@charset "UTF-8";

.login_applicant_body{background-color: #ebeef6;}

.login_applicant_wrap{width: 1040px; margin: 0 auto;}

/*타이틀*/
.applicant_title_wrap{padding-top: 40px; margin-bottom: 40px;}
.applicant_title_logo{float: left; width: 176px; height: 40px; background: url(../img/applicant_title_logo.png) no-repeat 0 0;}
.applicant_title{float: left;width: 588px;height: 28px;margin: 7px 0 7px 34px;background: url(../img/applicant_title.png) no-repeat 0 0;}

/*콘텐츠*/
.applicant_contents_wrap{display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, minmax(100px, auto)); column-gap: 10px; row-gap: 15px;}
.applicant_contents_wrap + .applicant_contents_wrap{margin-top: 20px;}
.applicant_contents_wrap > .left{float: left; width: 50%; padding-right: 10px; box-sizing: border-box;}
.applicant_contents_wrap > .right{float: right; width: 50%; padding-left: 10px; box-sizing: border-box;}

/*로그인*/
.applicant_login_wrap{height: 354px;background-color: #c8d0e6;border: 1px solid #b6c1de;border-radius: 16px;}
.applicant_login_list{position: relative; display: flex; flex-wrap: wrap; padding: 0 6px;}
.applicant_login_list > li{/*flex: 1;*/ padding: 9px 8px 0;}
.applicant_login_list > li:first-child{padding: 9px 3px 0 8px;}
.applicant_login_list > li:last-child{padding: 9px 8px 0 3px;}
.applicant_login_list > li.on{padding-top: 4px;}
.applicant_login_list > li > a{display: block; position: relative; padding: 0 27px; font-size: 18px; line-height: 46px; color: #6b6b6b; font-weight: 400; text-align: center; background-color: #eef4f2; border-radius: 16px 16px 0 0;}
.applicant_login_list > li > a::before{content: ''; position: absolute; bottom: 0; left: -8px; width: 8px; height: 8px; background: url(../img/applicant_login_list1.png) no-repeat 0 0;}
.applicant_login_list > li > a::after{content: ''; position: absolute; bottom: 0; right: -8px; width: 8px; height: 8px; background: url(../img/applicant_login_list2.png) no-repeat 0 0;}
.applicant_login_list > li.on > a{font-size: 20px; line-height: 51px; color: #465e9c; font-weight: 700; background-color: #fff; border-radius: 16px 16px 0 0; z-index: 1;}
.applicant_login_list > li.on > a::before{content: ''; position: absolute; bottom: 0; left: -8px; width: 8px; height: 8px; background: url(../img/applicant_login_list_on1.png) no-repeat 0 0;}
.applicant_login_list > li.on > a::after{content: ''; position: absolute; bottom: 0; right: -8px; width: 8px; height: 8px; background: url(../img/applicant_login_list_on2.png) no-repeat 0 0;}
.applicant_login_list > li.on > a > span{display: inline-block; padding-left: 28px; background: url(../img/applicant_login_list_on_span2.png) no-repeat top 16.5px left;}
.applicant_login_list > li > .tab_contents{display: none;position: absolute;top: 55px;right: 0;left: 0;height: 249px;padding: 25px;background-color: #fff;border-radius: 0 0 16px 16px;}
.applicant_login_list > li.on > .tab_contents{display: block;}
.applicant_notice_wrap{padding: 17px 20px; background-color: #f6f6f6; border-radius: 16px;}
.applicant_notice_list > li{position: relative; padding-left: 14px; font-size: 14px; line-height: 24px;}
.applicant_notice_list > li::before{content: ''; position: absolute; top: 10.5px; left: 0; width: 3px; height: 3px; background-color: #414141;}
.button_wrap_list{display: flex; flex-wrap: wrap; margin-top: 15px;}
.button_wrap_list > li{flex: 1;}
.button_wrap_list > li > a{display: block; position: relative; padding: 13px 20px; font-size: 16px; line-height: 22px; color: #fff; font-weight: 6007; border-radius: 16px;}
.button_wrap_list > li.certificate{padding-right: 5px;}
.button_wrap_list > li.certificate > a{background: url(../img/certificate_a.png) repeat-y 0 0; background-color: #59b197;}
.button_wrap_list > li.certificate > a::after{content: ''; position: absolute; top: 20px; right: 20px; width: 30px; height: 30px; background: url(../img/button_wrap_list_a.png) no-repeat left 7px top 9px; background-color: #34705e; border-radius: 100%;}
.button_wrap_list > li.registration{padding-left: 5px;}
.button_wrap_list > li.registration > a{background: url(../img/registration_a.png) repeat-y 0 0; background-color: #226e8d;}
.button_wrap_list > li.registration > a::after{content: ''; position: absolute; top: 20px; right: 20px; width: 30px; height: 30px; background: url(../img/button_wrap_list_a.png) no-repeat left 7px top 9px; background-color: #133e4f; border-radius: 100%;}
.supply_login_list{margin-top: 15px;}
.supply_login_list > li{position: relative;}
.supply_login_list > li + li{margin-top: 10px;}
.supply_login_list > li.separation{display: grid;grid-template-columns: 1fr 110px;/* grid-auto-rows: minmax(100px, auto); */column-gap: 10px;row-gap: 15px;}
.supply_login_list > li > .company, .supply_login_list > li > .phone_num, .supply_login_list > li > .certi_code_num{padding-left: 145px;line-height: 42px;border: 1px solid #e7e7e7;border-radius: 10px;}
.supply_login_list > li > .company > label, .supply_login_list > li > .phone_num > label, .supply_login_list > li > .certi_code_num > label{position: absolute;top: 0;left: 15px;width: 130px;padding-left: 32px;font-size: 14px;line-height: 44px;color: #2e3e67;font-weight: 600;box-sizing: border-box;}
.supply_login_list > li > .company > label::after, .supply_login_list > li > .phone_num > label::after, .supply_login_list > li > .certi_code_num > label::after{content: ''; position: absolute; top: 15px; right: 0; width: 1px; height: 14px; background-color: #dcdcdc;}
.supply_login_list > li > .company > label{background: url(../img/supply_login_list_company.png) no-repeat top 12px left 1px;}
.supply_login_list > li > .phone_num > label{background: url(../img/supply_login_list_phonenum.png) no-repeat top 12px left;}
.supply_login_list > li > .certi_code_num > label{background: url(../img/supply_login_list_certicode.png) no-repeat top 16px left;}
.supply_login_list > li > div > input[type="text"], .supply_login_list > li > div > input[type="password"]{height: 42px;padding: 0 15px;line-height: 42px;background-color: transparent;border: none;}
.supply_login_list > li > button{width: 100%; cursor: pointer; font-size: 14px; line-height: 38px; color: #fff; border: none; border-radius: 10px;}
.supply_login_list > li > button.certi_code_button{background-color: #263356;}
.supply_login_list > li > button.apc_login_button{background-color: #465e9c;}

/*연락처 + 주의사항*/
.call_notice_wrap{display: grid; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(2, minmax(100px, auto)); grid-auto-rows: minmax(100px, auto); column-gap: 10px; row-gap: 15px;}

/*연락처*/
.call_info_wrap{height: 163px;padding: 19px;background-color: #f2f4f8;border: 1px solid #d1d8e6;border-radius: 16px;box-sizing: border-box;}
.call_info_wrap > .title{padding-left: 30px; font-size: 20px; line-height: 20px; color: #121212; font-weight: 700; background: url(../img/admin_call_wrap_p.png) no-repeat top 1px left;}
.main_call_wrap{padding: 17px 24px;margin: 25px 0 0;background-color: #e2e6ee;border-radius: 16px;}
.main_call_wrap > span{float: left; font-size: 16px; line-height: 22px; color: #4c6085;}
.main_call_wrap > span > i{font-style: normal; font-weight: 700;}
.main_call_wrap > p{float: right; padding-left: 25px; font-size: 36px; line-height: 44px; color: #394965; font-weight: 700; letter-spacing: -1px; background: url(../img/main_call_wrap_p.png)no-repeat top 9.5px left;}
.department_list > li{position: relative; padding-left: 134px; font-size: 14px; line-height: 33px; color: #818181; font-weight: 400;}
.department_list > li + li{border-top: 1px solid #e2e6ee;}
.department_list > li > span{position: absolute; top: 0; left: 0; padding-left: 13px; font-size: 15px; color: #505050; font-weight: 600; background: url(../img/department_list_span.png) no-repeat top 12.5px left;}

/*주의사항*/
.notice_info_wrap{padding: 19px; background-color: #deedec; border: 1px solid #bddcd9; border-radius: 16px;}
.notice_info_wrap > .title{padding-left: 30px; font-size: 20px; line-height: 20px; color: #366460; font-weight: 700; background: url(../img/apc_notice_info.png) no-repeat top left;}
.notice_info_list{margin-top: 25px;}
.notice_info_list > li{position: relative; padding-left: 14px; font-size: 14px; line-height: 21px; color: #527b77;}
.notice_info_list > li + li{margin-top: 5px;}
.notice_info_list > li::before{content: ''; position: absolute; top: 9px; left: 0; width: 3px; height: 3px; background-color: #527b77;} 

/*공지사항*/
.applicant_announcements_wrap{position: relative; height: 277px; padding: 25px; background-color: #fff; border: 1px solid #b6c1de; border-radius: 16px;}
.applicant_announcements_wrap > .title > span{position: relative;font-size: 20px;line-height: 20px;color: #364879;font-weight: 700;}
.applicant_announcements_wrap > .title > span::after{content: ''; position: absolute; top: -24px; right: 0; left: 0; height: 4px; background-color: #364879;}
.applicant_announcements_wrap > a.more_button{position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; background: url(../img/more_button.png) no-repeat center; background-color: #364879; border-radius: 7px;}
.latest_post_wrap{position: relative; padding: 24px 20px 20px; margin-top: 35px; background-color: #ebf0f6; border: 1px solid #d9e3ee; border-radius: 16px;}
.latest_post_wrap::before{content: '새로운 소식'; position: absolute; top: -14px; left: 20px; padding: 0 9px; font-size: 14px; line-height: 26px; color: #263356; background-color: #fff; border: 1px solid #263356; border-radius: 14px;}
.latest_post_wrap > a{display: block; font-size: 18px; line-height: 24px; color: #121212; font-weight: 600; word-break: break-all; text-overflow: ellipsis; display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; -webkit-line-clamp:2;}
.latest_post_wrap > span{display: block; margin-top: 5px; font-size: 14px; line-height: 14px; color: #a7a7a7; text-align: right;}
.latest_post_table{width: 100%; margin-top: 1px;}
.latest_post_table > tbody > tr > td{position: relative; padding: 13px 0 0; font-size: 14px; line-height: 14px;}
.latest_post_table > tbody > tr > td > a{position: absolute; top: 13px; right: 0; left: 0; color: #121212; text-overflow: ellipsis; font-style: normal; white-space: nowrap; word-wrap: normal; overflow: hidden; box-sizing: border-box;}
.latest_post_table > tbody > tr > td.date{color: #a7a7a7; text-align: right;}

/*관계법령*/
.applicant_laws_wrap{position: relative; height: 277px; padding: 25px; background-color: #fff; border: 1px solid #dddddd; border-radius: 16px;}
.applicant_laws_wrap > .title > span{position: relative; font-size: 20px; line-height: 20px; color: #616161; font-weight: 700;}
.applicant_laws_wrap > .title > span::after{content: ''; position: absolute; top: -24px; right: 0; left: 0; height: 4px; background-color: #838383;}
.applicant_laws_wrap > a.more_button{position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; background: url(../img/more_button.png) no-repeat center; background-color: #838383; border-radius: 7px;}
.laws_contents{margin-top: 21px;}
.laws_contents > button{float: left; position: relative; width: 220px; height: 235px; padding: 18px; text-align: left; background: url(../img/laws_contents_button.png) no-repeat 0 0; border: 1px solid #d5d5d5; border-radius: 16px; cursor: pointer;}
.laws_contents > button > p{position: absolute; top: 18px; left: 18px; padding-top: 55px; font-size: 20px; line-height: 28px; font-weight: 600;}
.laws_contents > button > p::before{content: ''; position: absolute; top: 0; left: 0; width: 38px; height: 38px; background: url(../img/laws_contents_button_p.png) no-repeat center; background-color: #838383; border-radius: 100%;}
.laws_contents > button > span{position: absolute; right: 18px; bottom: 18px; padding: 0 23px 0 12px; line-height: 25px; color: #fff; background: url(../img/laws_contents_button_span.png) no-repeat right 10px center; background-color: rgba(131, 131, 131, 0.4); border-radius: 12.5px;}
.laws_contents > table.laws_contents_table{float: right; width: 219px; border-bottom: 1px solid #eaeaea;}
table.laws_contents_table > tbody > tr > td{padding: 11px 0; border-top: 1px solid #eaeaea;}
table.laws_contents_table > tbody > tr > td > a{width: 219px; font-size: 14px; line-height: 18px; color: #121212; word-break: break-all; text-overflow: ellipsis; display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; -webkit-line-clamp:2;}
table.laws_contents_table > tbody > tr > td > span{display: block; margin-top: 5px; font-size: 14px; line-height: 14px; color: #a7a7a7; text-align: right;}

/* 서류보완방법 + 퀵메뉴 */
.docu_qm_wrap{display: grid; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(2, minmax(100px, auto)); grid-auto-rows: minmax(100px, auto); column-gap: 10px; row-gap: 15px;}

/* 서류보완방법 */
.docu_info_wrap{min-height: 112px; padding: 21px; background-color: #364879; border: 1px solid #2e3e67; border-radius: 16px;}
.docu_info_wrap > .title{padding-left: 30px; font-size: 20px; line-height: 20px; color: #fff; font-weight: 700; background: url(../img/apc_docu_info.png) no-repeat top left;}
.docu_info_list{margin-top: 25px;}
.docu_info_list > li{position: relative; padding-left: 14px; font-size: 14px; line-height: 21px; color: #fff;}
.docu_info_list > li + li{margin-top: 5px;}
.docu_info_list > li::before{content: ''; position: absolute; top: 9px; left: 0; width: 3px; height: 3px; background-color: #fff;} 

/*퀵메뉴*/
.quick_menu_wrap{padding: 8px; background-color: #f9f9f9; border: 1px solid #cbcbcb; border-radius: 16px;}
.quick_menu_list{display: flex; flex-wrap: wrap;}
.quick_menu_list > li{flex: 1;}
.quick_menu_list > li + li{padding-left: 5px;}
.quick_menu_list > li > a{display: block;position: relative;height: 108px;padding: 15px;font-size: 13px;line-height: 18px;color: #494949;font-weight: 600;background-repeat: no-repeat;background-color: #fff;border: 1px solid #cbcbcb;border-radius: 10px;}
.quick_menu_list > li > a::after{content: ''; position: absolute; right: 10px; bottom: 10px; width: 28px; height: 28px; background: url(../img/quick_menu_list_a2.png) no-repeat left 6px top 8px; background-color: #fff; border: 1px solid #5e85db; border-radius: 100%;}
.quick_menu_list > li:nth-child(1) > a{background-image: url(../img/quick_menu_list2_1.png); background-position: right 22px bottom 22px;}
.quick_menu_list > li:nth-child(2) > a{background-image: url(../img/quick_menu_list2_2.png); background-position: right 22px bottom 20px;}
.quick_menu_list > li:nth-child(3) > a{background-image: url(../img/quick_menu_list2_3.png); background-position: right 22px bottom 22px;}
.quick_menu_list > li:nth-child(4) > a{letter-spacing: -0.2px; background-image: url(../img/quick_menu_list2_4.png); background-position: right 22px bottom 23px;}
.quick_menu_list > li:nth-child(5) > a{background-image: url(../img/quick_menu_list5.png); background-position: right 22px bottom 25px;}
.quick_menu_list > li:nth-child(6) > a{background-image: url(../img/quick_menu_list6.png); background-position: right 22px bottom 19px;}
.quick_menu_list > li:nth-child(7) > a{background-image: url(../img/quick_menu_list7.png); background-position: right 22px bottom 21px;}
.quick_menu_list > li:nth-child(8) > a{background-image: url(../img/quick_menu_list8.png); background-position: right 22px bottom 25px;}

/*푸터*/
.login_applicant_footer{margin-top: 40px;background-color: #d9dfee;border-top: 1px solid #c8d0e6;}
.applicant_company_wrap{border-bottom: 1px solid #d4e1de;}
.applicant_company_wrap > .applicant_company_list{width: 1040px; margin: 0 auto;}
.applicant_company_list > li{float: left; padding: 9.5px 0;}
.applicant_company_list > li + li{position: relative; margin-left: 13px; padding-left: 14px;}
.applicant_company_list > li + li::before{content: ''; position: absolute; top: 18px; left: 0; width: 1px; height: 13px; background-color: #d4e1de;}
.applicant_company_list > li > a{display: block; font-size: 14px; line-height: 30px; color: #93a39f;}
.footer_bottom_wrap{width: 1040px; height: 49px; padding-top: 30px; margin: 0 auto;}
.footer_bottom_logo{float: left;width: 375px;height: 17px;background: url(../img/footer_bottom_logo.png) no-repeat 0 0;}
.footer_bottom_list{float: left;margin-top: 2px;margin-left: 20px;}
.footer_bottom_list > li{font-size: 13px; line-height: 13px; color: #93a3ce;}
.footer_bottom_list > li + li{margin-top: 9px;}
.family_web_select{float: right; width: 170px; height: 35px; padding: 0 12px; color: #93a39f; background: url(../img/family_web_select.png) no-repeat right 12px center; background-color: #e4edea; border: 1px solid #d4e1de; border-radius: 5px;}
.family_web_select:focus{outline: none;}
.family_web_select > option{color: #121212; background-color: #fff;}