@charset "utf-8"; /* 공통 */
.show-default { display: block; }
.hide-default { display: none; }
/* skip */
#top_skip { display: block; background: #fff; position: fixed; left: 0; top: 0; z-index: 99999999; }
#top_skip a { position: relative; display: block; width: 120px; line-height: 35px; text-align: center; background: #333; color: #fff; font-size: 12px; height: 0; overflow: hidden; }
#top_skip a:focus { height: 35px; border: 2px solid #005983; }
#header { height: 80px; background-color: #fff; position: fixed; top: 0; z-index: 1; }
.top-menu-wrap { display: inline-block; position: absolute; left: 50%; margin: 0 0 0 -310px; text-align: center; }
.top-menu-wrap li { display: inline-block; margin-left: 50px; font-size: 1.5em; line-height: 80px; }
.top-menu-wrap a:first-child li { margin-left: 0; }
.phone-call { display: inline-block; line-height: 82px; opacity: 0; background-image: url(/image/common/phone_call.png); background-repeat: no-repeat; background-position: 20px; padding-left: 70px; margin-right: 55px; font-size: 1.5em; }
.mobile-call { display: none; }
.right-menu { position: absolute; right: 50px; line-height: 82px; }
.top-menu { display: inline-block; cursor: pointer; }
.header-logo { display: inline-block; cursor: pointer; position: absolute; /* top: 26px; */
 top: 12px; left: 50px; opacity: 0; }
.top-menu { -webkit-transform: translateY(7px); transform: translateY(7px); }
.bottom-menu { position: absolute; bottom: 60px; right: 50px; }
.bottom-intro p,
.bottom-contact p { display: inline-block; margin-right: 10px; }
.bottom-intro,
.bottom-contact { display: inline-block; margin-left: 35px; }
.open-layer { position: fixed; top: 0; width: 100%; left: 50%; margin: 0 0 0 -50%; height: 200%; background-image: url(/image/common/open_menu.jpg); background-repeat: repeat; /* background-size: cover; */
 display: none; }
.open-menu { position: fixed; top: 0; width: 100%; left: 50%; margin: 0 0 0 -50%; z-index: 4; text-align: center; padding: 100px 0 60px; display: none; opacity: 0; }
.open-logo { position: absolute; left: 50px; top: 30px; }
.open-menu-wrap { text-align: center; font-size: 1.2em; color: #fff; font-weight: 300; display: inline-block; opacity: 0; margin-top: -10px; }
.open-menu-wrap a { color: #fff; }
.open-menu-wrap a:hover { color: #ffe922; }
.open-menu-wrap li { margin-top: 45px; }
.open-menu-wrap .open-menu-tit { font-size: 1.8em; position: relative; display: inline-block; }
.open-menu-wrap .open-menu-home { cursor: pointer; font-size: 1.8em; position: relative; display: inline-block; }
.open-menu-wrap .open-menu-home:hover::after { content: ''; width: 140px; height: 15px; background-color: #00406d; position: absolute; left: 50%; margin: 0 0 0 -70px; bottom: -8px; z-index: -1; }
.open-menu-wrap .open-menu-tit.on::after { content: ''; width: 140px; height: 15px; background-color: #00406d; position: absolute; left: 50%; margin: 0 0 0 -70px; bottom: -8px; z-index: -1; }
.open-sub-menu { margin-top: 35px; }
.open-sub-menu li { display: inline-block; margin: 0 12px; }
.open-close { width: 200px; height: 85px; background-color: #000; line-height: 85px; position: absolute; right: 0; top: 0; color: #fff; font-size: 1.5em; cursor: pointer; }
.open-close img { margin-left: 10px; }
.footer-inner { max-width: 1640px; height: 520px; margin: auto; box-sizing: border-box; padding-top: 90px; }
.footer-section { display: inline-block; width: 33%; vertical-align: middle; }
.footer-section01 { text-align: left; }
.footer-section01 h1 { font-size: 1.2em; font-weight: 500; color: #333; margin-bottom: 35px; position: relative; }
.footer-section01 h1::after { content: ''; width: 15px; height: 1px; background-color: #b5b5b5; position: absolute; bottom: -15px; left: 0; }
.footer-section01 .contact { margin-top: 7px; }
.footer-section01 .copy { margin-top: 20px; font-size: 0.9em; }
.footer-section02 { text-align: center; }
.footer-intro p,
.footer-contact p { display: inline-block; margin-right: 10px; color: #666; }
.footer-intro,
.footer-contact { display: inline-flex; align-items: center; }
.footer-intro { margin-right: 35px; }
.footer-section03 { text-align: right; vertical-align: middle; }

.footer-section03 .family-tit { font-size: 14px; color: #313131; }
.footer-section03 .family-tit > span { font-size: 12px; color: #fff; background-color: #00406d; border-radius: 2em; display: inline-block; padding: 0 12px; margin-right: 5px; }
.footer-section03 .family-nav { display: flex; margin-top: 25px; align-items: center; justify-content: flex-end; margin-bottom: 45px; }
.footer-section03 .family-nav > a:not(:last-child) { margin-right: 35px; }


.top-btn { width: 66px; position: absolute; left: 50%; margin: 0 0 0 -33px; cursor: pointer; bottom: 100px; }
.footer-txt { font-size: 1.2em; font-family: 'Nanum Myeongjo', serif; font-weight: 900; color: #00406d; text-align: right; margin-top: 10px; }
.footer-top .recruit-banner { background-repeat: no-repeat; background-size: cover; background-color: #0e224b; height: 250px; display: inline-block; width: 50%; position: relative; cursor: pointer; /* -webkit-transition: all ease .7s; transition: all ease .7s; */
 border-right: 1px solid #404040; box-sizing: border-box; }
.footer-top .request-banner { background-repeat: no-repeat; background-size: cover; background-color: #0e224b; background-position: center; height: 250px; display: inline-block; width: 50%; float: right; position: relative; cursor: pointer; /* -webkit-transition: all ease .7s; transition: all ease .7s; */ }
.footer-top .recruit-banner:hover { background-image: url(/image/main/main_sec06_01.jpg); }
.footer-top .request-banner:hover { background-image: url(/image/main/main_sec06_02.jpg); }
.footer-top .footer-top-txt { position: absolute; left: 90px; color: #fff; width: 820px; font-size: 1.1em; line-height: 2.7em; font-weight: 100; top: 60px; }
.footer-top .footer-top-txt h1 { color: #fff; width: 100%; font-size: 4em; line-height: 1.5em; font-family: 'Nanum Myeongjo', sans-serif; padding-left: 35px; }
.footer-top .footer-top-txt h2 { line-height: 1.5em; font-size: 1em; font-weight: 300; padding-left: 35px; }
.footer-top .recruit-txt { position: absolute; right: -15px; }
.footer-top .footer-top-more { font-family: 'Nanum Myeongjo', serif; color: #fff; font-size: 1.3em; position: absolute; right: 100px; top: 125px; }
.footer-top .footer-top-more::before { content: ''; width: 400px; height: 1px; background-color: #727d94; position: absolute; right: 70px; top: 10px; }
.footer-top .footer-top-more::after { content: ''; width: 30px; height: 2px; background-color: #fff; position: absolute; right: 70px; top: 9px; }
/* pf-header */
#pf_header { height: 100px; background-color: #fff; position: fixed; top: 0; z-index: 2; box-shadow: 1px -1px 1px 1px #444; }
.pf-top-menu-wrap { position: absolute; left: 50%; top: 20px; width: 1000px; margin: 0 0 0 -500px; text-align: center; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; }
.pf-top-menu-wrap.on { -webkit-transform: scale(0.5); transform: scale(0.5); opacity: 0; }
.pf-top-menu-wrap li { display: inline-block; margin-left: 50px; font-size: 1.2em; line-height: 80px; font-weight: 600; }
.pf-top-menu-wrap a:first-child li { margin-left: 0; }
.pf-top-submenu-wrap { position: absolute; width: 100%; height: 50px; left: 50%; margin: 0 0 0 -50%; top: 100px; background-color: #fff; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; }
.pf-top-submenu-wrap.on { height: 0; }
.pf-top-submenu { position: absolute; width: 1000px; height: 50px; left: 50%; margin: 0 0 0 -500px; top: 0; text-align: center; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; background-color: #fff; }
.pf-top-submenu.on { top: -60px; }
.pf-top-submenu li { display: inline-block; margin-left: 40px; font-size: 1.2em; line-height: 30px; position: relative; /* margin-bottom: 50px; */
 padding-bottom: 7px; }
.pf-top-submenu a:first-child li { margin-left: 0; }
.pf-top-submenu a li.on { font-weight: bold; color: #000; }
.pf-top-submenu a li.on::after { content: ''; position: absolute; width: 100%; left: 0; bottom: 7px; height: 1px; background-color: #000; }
.pf-right-menu { float: right; margin-right: 50px; }
.pf-top-menu { display: inline-block; cursor: pointer; -webkit-transform: translateY(40px); transform: translateY(40px); }
.pf-search-btn { margin-right: 20px; display: inline-block; cursor: pointer; -webkit-transform: translateY(45px); transform: translateY(45px); }
.pf-header-logo { display: inline-block; cursor: pointer; float: left; margin-left: 50px; -webkit-transform: translateY(30px); transform: translateY(30px); }
.mobile-sidebar-wrap { display: none; }
.search-wrap { position: absolute; bottom: -100px; width: 100%; background-color: #fff; text-align: center; box-sizing: border-box; padding: 40px 0; display: none; opacity: 0; }
.search-wrap input { width: 800px; border: none; text-align: center; font-size: 1.5em; }
.search-layer { position: fixed; top: 0; width: 100%; height: 100vh; z-index: 1; background: rgba(0, 0, 0, 0.5); display: none; opacity: 0; }
.pf-search-btn { position: absolute; right: 100px; }
.search-wrap button { background: url(/image/common/search_icon_grey.png); background-repeat: no-repeat; width: 28px; height: 28px; border: none; position: absolute; right: 100px; text-align: center; cursor: pointer; }
/* s-header */
#s_header { position: absolute; top: 0; height: 80px; position: fixed; top: 0; z-index: 3; -webkit-transition: all ease 0.1s; transition: all ease 0.1s; }
.s-top-menu-wrap { display: inline-block; position: absolute; width: 650px; left: 50%; margin: 0 0 0 -325px; text-align: center; }
.s-top-menu-wrap > li { display: inline-block; font-size: 1.2em; line-height: 80px; padding-left: 50px; font-weight: 500; }
.s-top-menu-wrap > li > a { color: #333; }
/* GNB 메뉴 HOVER 시 그라디언트 배경 움직임 *CHROME만 적용 */
.gnb-menu:hover,
.sub-gnb > li:hover { background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 500% 500%; -webkit-animation: gradient 5s ease infinite; animation: gradient 5s ease infinite; }
@-webkit-keyframes gradient {
 0% { background-position: 0% 50%; }
 50% { background-position: 100% 50%; }
 100% { background-position: 0% 50%; }
 }
@keyframes gradient {
 0% { background-position: 0% 50%; }
 50% { background-position: 100% 50%; }
 100% { background-position: 0% 50%; }
 }
/* CHROME이 아닐 경우 HOVER 시 해당 COLOR로 출력 */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS styles go here */
 .gnb-menu:hover,
 .sub-gnb > li:hover { color: #333; background: none; }
 }
.s-top-menu-wrap > li:first-child { padding-left: 0; }
.s-header-logo { display: inline-block; cursor: pointer; position: absolute; top: 13px; left: 50px; }
.s-top-menu { -webkit-transform: translateY(20px); transform: translateY(20px); cursor: pointer; }
.header-bg { position: absolute; top: 0; background-color: #fff; border-bottom: 1px solid #ddd; width: 100%; right: 0; height: 0%; -webkit-transition: all ease-in-out 0.3s; transition: all ease-in-out 0.3s; }
/* 간편문의 */
.quick-contact { position: fixed; display: block; z-index: 1; bottom: 50px; right: 50px; width: 260px; background: linear-gradient(45deg, #1b3c7f, #0f2551); height: 60px; line-height: 60px; color: #fff !important; border-radius: 50px; text-align: center; padding-left: 25px; box-sizing: border-box; font-size: 1.2em; font-weight: 300; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; overflow: hidden; cursor: pointer; }
.quick-contact.active { width: 60px; }
.quick-contact.active::before { display: none; }
.quick-contact::before { content: ''; background-image: url(/image/main/quick_arrow.png); background-repeat: no-repeat; position: absolute; left: 40px; top: 17px; width: 27px; height: 27px; }
.quick-icon { position: absolute; right: 0; top: 0; opacity: 0; }
.quick-contact-form { position: fixed; bottom: 50px; right: 50px; width: 380px; box-sizing: border-box; border-radius: 20px; background-color: #fff; box-shadow: 2px 2px 10px #333; display: none; opacity: 0; z-index: 1; }
.quick-contact-form .cf-head { background: -webkit-gradient(linear, left top, right top, from(#1b3c7e), to(#0f2550)); background: linear-gradient(90deg, #1b3c7e, #0f2550); padding: 30px; color: #fff; border-radius: 20px 20px 0 0; }
.quick-contact-form .cf-head h1 { font-size: 1.7em; padding-bottom: 20px; margin-bottom: 12px; border-bottom: 1px solid #7f8ead; }
.quick-contact-form .quick-contact-close { position: absolute; top: 20px; right: 20px; width: 20px; cursor: pointer; }
.quick-contact-form .quick-contact-close img { width: 100%; }
.quick-contact-form .cf-head p { color: #dee0e7; font-size: 1em; word-break: keep-all; font-weight: 300; }
.quick-contact-form .cf-body { padding: 20px 30px; }
.quick-contact-form .cf-body .cf-options select { width: 100%; border: none; font-size: 1em; color: #122a5c; font-weight: 600; padding-bottom: 10px; border-bottom: 1px solid #122a5c; margin-bottom: 30px; background: url(/image/sub/select_arrow.png) no-repeat right 8px; font-family: 'Noto Sans KR', sans-serif; }
.quick-contact-form .cf-body .cf-input { margin-bottom: 13px; display: flex; border-bottom: 1px solid #122a5c; padding-bottom: 10px; }
.quick-contact-form .cf-body .cf-input label { color: #999; font-weight: 500; }
.quick-contact-form .cf-body .cf-input p { width: 95px; font-weight: 500; font-family: 'Noto Sans KR', sans-serif; }
.quick-contact-form .cf-body .cf-input input { width: 100%; height: 28px; border: none; background: #ebebeb; flex: 1; }
.quick-contact-form .cf-body .cf-content { margin-bottom: 30px; }
.quick-contact-form .cf-body .cf-content textarea { resize: none; width: 100%; border: none; height: 120px; border-bottom: 1px solid #122a5c; }
.quick-contact-form .cf-body .cf-input input::-webkit-input-placeholder,
.quick-contact-form .cf-body .cf-content textarea::-webkit-input-placeholder { font-weight: 500; font-family: 'Noto Sans KR', sans-serif; }
.quick-contact-form .cf-body .cf-checkbox { margin-bottom: 20px; }
.quick-contact-form .cf-body button[type='button'] { width: 100%; border-radius: 50px; line-height: 45px; border: none; background-color: #122a5c; color: #fff; font-size: 1.1em; font-weight: 600; }
/* END OF 간편문의 */
.mobile-footer-menu { margin-top: 20px; }
.mobile-footer-menu ul { font-size: 0; text-align: center; }
.mobile-footer-menu ul li { display: inline-block; width: 33.3%; padding: 0 5px; vertical-align: top; box-sizing: border-box; text-align: center; position: relative; }
.sub-gnb { position: absolute; width: 1400px; left: 50%; margin: 0 0 0 -700px; top: 60px; font-size: 18px; display: none; opacity: 0; }
.sub-gnb > li { display: inline-block; font-size: 1em; line-height: 80px; color: #333; cursor: pointer; padding-left: 50px; }
.sub-gnb > li:first-child { padding-left: 0px; }
.privacy-policy { font-size: 1.1em; margin-bottom: 15px; display: inline-block; border-bottom: 1px solid #fff; padding-bottom: 1px; }
.privacy-policy:hover { font-weight: 500; border-bottom: 1px solid #333; }
.dh-popup { position: absolute; left: 4.6875%; top: 15px; max-width: 90.625%; z-index: 99999999; }
.dh-popup-img { /* padding:5px; */
 background: #fff; border: 1px solid #202020; }
.dh-popup-img a,
.dh-popup-img img { display: block; max-width: 100%; }
.dh-popup-chk { padding: 5px 10px; text-align: right; background: #202020; color: #fff; font-size: 12px; }
.dh-popup-chk button { background: none; border: 0; padding: 0; outline: 0; cursor: pointer; appearance: none; -webkit-appearance: none; -moz-appearance: none; color: #fff; }
@media all and (max-width: 1740px){
 .footer-inner { width: 100%; padding: 90px 3% 0 3%; }
 }
@media all and (max-width: 1199px){
 #s_header { display: block !important; padding-top: 5px; box-sizing: border-box; }
 #pf_header { display: none !important; }
 .s-header-logo { left: 25px; top: 20px; }
 .s-header-logo img { 
  /* width: 140px; */
    height: 40px;
  }
 .header-logo { left: 25px; top: 22px; }
 .header-logo img { margin-top: -10px; }
 .right-menu { right: 25px; }
 .s-top-menu-wrap { display: none; }
 .pc-sitemap-wrap { display: none; }
 .open-layer { display: none !important; }
 .phone-call { display: none; }
 .mobile-call { display: inline-block; -webkit-transform: translateY(7px); transform: translateY(7px); margin-right: 7px; }
 .mobile-sidebar-wrap { display: block; width: 280px; height: 100%; box-sizing: border-box; padding: 45px 0 0 30px; background-color: #000; float: right; }
 .open-menu { position: fixed; top: 0; width: 100%; left: 50%; margin: 0 0 0 -50%; z-index: 4; text-align: left; display: none; opacity: 0; height: 100%; background-color: rgba(0, 0, 0, 0.4); padding: 0; }
 .mobile-menu-wrap > li { font-size: 2em; font-weight: bold; color: #797979; margin-bottom: 22px; }
 .m-gnb-menu.on .m-gnb { color: #fff; /* margin-bottom: 10px; */ }
 .mobile-menu-wrap .m-gsnb { font-size: 14px; margin-top: 12px; display: none; }
 .mobile-menu-wrap .m-gsnb li { line-height: 1.4em; font-size: 1.2em; color: #fff; padding: 5px 10px; }
 .mobile-bottom-menu { position: absolute; bottom: 50px; color: #fff; }
 .mobile-bottom-menu li { margin-bottom: 15px; }
 .sidebar-close { position: absolute; top: 20px; right: 20px; cursor: pointer; width: 25px; }
 .sidebar-close img { width: 100%; }
 .footer-inner { width: 100%; height: auto; padding: 50px 3% 175px 3%; display: flex; flex-wrap: wrap; justify-content: space-between; }
 .footer-section { width: auto; }
 .footer-section02 { order: 3; width: 100%; margin-top: 45px; }
 .footer-section03 { order: 2; }
 .quick-contact { bottom: 150px; right: 10px; }
 .top-btn { width: 50px; margin: 0 0 0 -25px; bottom: 80px; }
 .footer-top .request-banner,
 .footer-top .recruit-banner { width: 100%; height: 150px; background-position: center; display: block; }
 .footer-top .footer-top-txt { width: 100%; left: 10px; top: 43px; }
 .footer-top .footer-top-txt h1 { color: #fff; width: 100%; font-size: 2.2em; line-height: 1.2em; font-weight: 100; top: 30px; font-family: 'Nanum Myeongjo', sans-serif; }
 .footer-top .footer-top-txt h2 { line-height: 1.5em; font-size: 1em; font-weight: 300; }
 .footer-top .footer-top-more { top: 53px; right: 10px; font-size: 1em; color: #c7c9cf; }
 .footer-top .footer-top-more::before { width: 160px; right: 45px; }
 .footer-top .footer-top-more::after { width: 15px; right: 45px; }
 .footer-top .recruit-banner { border-right: none; border-bottom: 1px solid #404040; }
 }
/* 타블렛 세로 */
@media all and (max-width: 1023px){
 .footer-inner { justify-content: center; align-items: center; }
 .footer-section01 { text-align: center; }
 .footer-section01 h1::after { display: none; }
 .footer-section03 { margin-top: 45px; }
 .footer-section03 .family-nav { margin-bottom: 0; }
 .footer-section03 .footer-txt,
 .footer-section03 > img { display: none; }
 }
/* 타블렛 가로 미만 ~ 모바일 */
@media all and (max-width: 767px){
 .footer-section { text-align: center; }
 .footer-section01 h1::after { left: 50%; margin: 0 0 0 -7.5px; }
 .footer-section03 { display: none; }
 }
/* 모바일 상세 */
@media all and (max-width: 640px){
 .dh-popup { width: 96% !important; max-width: 96% !important; left: 50% !important; margin-left: -48% !important; top: 15% !important; position: fixed !important; }
 .footer-inner { padding-bottom: 120px; padding-top: 45px; }
 .footer-section01 { margin-top: 0 !important; }
 .footer-section01 h1 { font-size: 1.5em; margin-bottom: 25px; }
 .top-btn { bottom: 25px; }
 .footer-section { margin-top: 25px; }
 .footer-intro p, .footer-contact p { font-size: 12px; }
 .footer-intro img, .footer-contact img { transform: scale(.8);}
 }
/* 모바일 가로 */
@media all and (max-width: 568px){
 .footer-top .footer-top-txt h1 { padding-left: 15px; }
 .footer-top .footer-top-txt h2 { padding-left: 15px; }
 .quick-contact { display: none; }
 .m-quick-contact { position: fixed; bottom: 100px; right: 20px; width: 70px; height: 70px; z-index: 99999; }
 }
@media all and (max-width: 425px) { }
@media all and (max-width: 375px) { }
@media all and (max-width: 320px){
 .footer-top .footer-top-more::before { width: 115px; }
 }
/* 공통 */
/* PC이하 ~ 타블렛 가로 */
@media all and (max-width: 1099px){
 .show-1024 { display: block; }
 .hide-1024 { display: none; }
 }
/* 타블렛 가로 이하 */
@media all and (max-width: 1023px){
 .show-768 { display: block; }
 .hide-768 { display: none; }
 }
/* 타블렛 이하 ~ 모바일 */
@media all and (max-width: 767px){
 .show-640 { display: block; }
 .hide-640 { display: none; }
 }
/* 모바일 가로 미만 */
@media all and (max-width: 568px){
 .show-568 { display: block; }
 .hide-568 { display: none; }
 }
/* 모바일 최소 */
@media all and (max-width: 425px){
 .show-425 { display: block; }
 .hide-425 { display: none; }
 }
@media all and (max-width: 375px){
 .show-375 { display: block; }
 .hide-375 { display: none; }
 }
@media all and (max-width: 320px){
 .show-320 { display: block; }
 .hide-320 { display: none; }
 }