@charset "utf-8";
@import url("reset.css");
@import url(var.css);
@import url(mobile.css);


/**********************************************************************************
** 공통
*********************************************************************************/
h2{font-size: var(--main-title-56); font-weight: var(--font-weight-800); word-wrap: break-word; word-break: keep-all; text-align: center; padding: 7.2rem 0 5.5rem;}
h2 strong {font-weight: var(--font-weight-800);}
h3{position: relative; font-size: var(--contents-title-40); font-weight: var(--font-weight-700); line-height: var(--line-height-55); padding-left: 27px; word-wrap: break-word; word-break: keep-all;}
h3::before{content: ""; position: absolute; left: 0; top: 50%; display: block; width: 7px; height: 31px; background: var(--prime-color); margin-right: 20px; transform: translateY(-50%);}
h4{margin-top: 140px; font-size: var(--contents-title-40); font-weight: var(--font-weight-600); line-height: var(--line-height-55); word-wrap: break-word; word-break: keep-all; word-wrap: break-word; word-break: keep-all;}
h5{margin-top: 140px; font-size: var(--contents-title-40); font-weight: var(--font-weight-700); line-height: var(--line-height-55); word-wrap: break-word; word-break: keep-all; word-wrap: break-word; word-break: keep-all;}
h4 *, h5 *{font-weight: inherit;}
h6 {font-size: var(--contents-text-22); font-weight: 700; letter-spacing: -1px; margin-bottom: 1rem;}
p{display: block; font-size: var(--contents-title-20); color: var(--secondary-gray-500); font-weight: var(--font-weight-300); line-height: var(--line-height-30); word-wrap: break-word; word-break: keep-all;}

/* 줄바꿈 */
u{display: block; text-decoration: none; color: inherit; font-size: inherit; line-height: inherit; font-weight: inherit;}

/* 정렬 */
.align-left{text-align: left;}
.align-cnt{text-align: center;}
.align-right{text-align: right;}

.blind,legend,caption,#accessibility {width:0px; height:0px; position:absolute; overflow:hidden; font-size:0px; line-height:0px; z-index:-1; visibility:hidden;}
.hidden{visibility:hidden;}
body {position:relative;}
#wrap {position: relative;}
.flex {display: flex !important;}
.inner {max-width: 1740px; margin: 0 auto; padding: 0 5.5rem; box-sizing: content-box;}
.img-wrap img {width: 100%;}
u {display: inline;}


/**********************************************************************************
** contents
*********************************************************************************/
header.head {position: sticky; left: 0; top: 0; width:100%; margin:0 auto ; overflow: hidden; background: #fff; z-index: 100;}
header.head .inner {align-items: center; justify-content: space-between; height:125px;}
header.head .logo img {width: 100px;}
header.head .menu_wrap { width: 80%; max-width: 700px; flex-shrink: 1;}
header.head .menu_wrap .mo_btn {display: none; float: right; width: 50px; height: 50px; background: url('../images/mo_menu.svg') center center no-repeat; background-size: 20px;  text-indent: -99em; overflow: hidden; margin-right: -10px;}
header.head .menu ul {align-items: center; justify-content: space-between;}
header.head .menu .link {display: inline-block; font-size: var(--contents-text-16); font-weight: var(--font-weight-700);}
header.head .menu .link.map {color: var(--prime-color); align-items: center; gap: 5px;}

section {position:relative; margin:0 auto; padding-bottom: 7.2rem;}
section .swiper,
section .swiper-wrapper{height:auto}



section.s1{padding: 1rem 0 5.5rem;}
section.s1 .inner {align-items: flex-start; gap: 1.65rem;}
section.s1 .s_box.video {flex-grow: 1;}
section.s1 .s_box .video_box {border-radius: 15px; overflow: hidden; font-size: 0;}
section.s1 .s_box .video_box iframe {width: 100%;}
section.s1 .s_box .bn_box+ .bn_box {margin-top: 1.45rem;}

section.s2{padding-bottom:3.75rem;}
section.s2 ul {align-items: flex-start; gap: 1.25rem; margin-bottom:4.8rem}
section.s2 ul li {flex-grow: 1;}
section.s2 .desc{color:var(--secondary-light-gray);font-size:var(--contents-text-18);line-height:1.625rem;font-weight:var(--font-weight-300);letter-spacing: -0.5px;}

section.s3 .s3Swiper {position: relative; padding-bottom: 4.5rem;}
section.s3 .s3Swiper .swiper {width: 100%; /*height: 100%; */}
section.s3 .s3Swiper .swiper .swiper-wrapper{height:auto}
section.s3 .s3Swiper .swiper-slide {width: 406px; }
section.s3 .s3Swiper .swiper-slide img {display: block; width: 100%; /*height: 100%;*/ object-fit: cover;}
section.s3 .s3Swiper .swiper-slide .on {display: none;}
section.s3 .s3Swiper .swiper-slide:hover .on {display: block;}
section.s3 .s3Swiper .swiper-slide:hover .off {display: none;}
section.s3 .s3Swiper .swiper_button {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: flex; gap: 10px;}
section.s3 .s3Swiper .swiper-button-next::after, section.s3 .s3Swiper .swiper-button-prev::after {display: none;}
section.s3 .s3Swiper .swiper_button > div {position: static; width: auto; height: auto; margin: 0;}
section.s3 .s3Swiper .swiper-scrollbar {display: none;}

section.s4 .inner {max-width: none;}
section.s4 .bn_box {width: 100%; padding: 8rem 0 1.5rem; transition: all 0.3s; margin: 0 auto;}
section.s4 .bn_box .img-wrap.img {display: inline-block; margin-left: 35px;}
section.s4 .bn_box .img-wrap img {width: auto; max-width: 100%; margin: 0 auto; }
section.s4 .bn_box .txt {margin-top: 3.88rem;}
section.s4 .bn_box .btnView {margin-top: 1.25rem; }
section.s4 .bn_box .btnView a {display: inline-block; position: relative; background: var(--secondary-blue); padding: 0.5rem 1.5rem 0.5rem 0.85rem; color: var(--secondary-white); border-radius: 100px; overflow: hidden; font-weight: var(--font-weight-700);}
section.s4 .bn_box .btnView a::before {content: ""; position: absolute; right: 0.8rem; top: 50%; width: 7px; height: 16px; background: url('../images/s3_ar.svg') center center no-repeat; background-size: 7px; transform: translateY(-50%);}
section.s4 .bn_box:hover .txt {filter: brightness(10);}
section.s4 .bn1 .bn_box:hover {background: #50ADC7;}
section.s4 .bn2 .bn_box:hover {background: #CDA66F;}
section.s4 .bn3 .bn_box:hover {background: #F09C42;}
section.s4 .bn4 .bn_box:hover {background: #B76ED6;}
section.s4 .bn5 .bn_box:hover {background: #CDA66F;}
section.s4 .bn6 .bn_box:hover {background: #E1BB85;}
section.s4 .bn7 .bn_box:hover {background: #2E60B5;}
.s4Swiper {position: relative; max-width: 1570px; margin: 0 auto; padding: 0 4rem; box-sizing: content-box;}
.s4Swiper .swiper {width: 100%; /*height: 100%;*/}
.s4Swiper .swiper .swiper-slide {text-align: center; display: flex; justify-content: center; align-items: center;}
.s4Swiper .swiper .swiper-slide img {display: block; width: 100%; /*height: 100%;*/ object-fit: cover;}
.s4Swiper .swiper .swiper-slide ul {display: flex; align-items: flex-start; width: 100%;}
.s4Swiper .swiper .swiper-slide ul li {flex-grow: 1;}
.s4Swiper .swiper .swiper-slide:first-child ul li {flex-shrink: 0; width: 25%;}
.s4Swiper .swiper .swiper-slide .bn_box {width: 100%;}
/*.s4Swiper .swiper .swiper-slide:nth-child(3n) .bn_box {width: 50%;}*/
.s4Swiper .swiper-button-next::after, .s4Swiper .swiper-button-prev::after {display: none;}
.s4Swiper .swiper-button-next {right: 1rem;}
.s4Swiper .swiper-button-prev {left: 1rem;}
.s4Swiper .swiper-scrollbar {display: none;}

#layer_in {overflow-y: auto; display: none; width: 100%; max-width: 1920px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 999;}
#layer_in .popup_box>div {display: none;}
#layer_in.on, #layer_in .popup_box>div.on {display: block;}
#layer_in .popup_box{width: 100%; height: auto;}
#layer_in .popup_box img {width: 100%;}
#layer_in .btnClose {position: absolute; right: 1.25rem; top: 1.25rem; padding: 1rem; z-index: 9999;}

section.s5 .faq_wrap {background: #fff; padding: 4rem 5.5rem; border-radius: 30px;}
section.s5 .accordion_list .accordion_item {border-bottom: 1px solid #E4E6EA;}
section.s5 .accordion_list .accordion_item .accordion_link {display: block; position: relative; padding: 1.7rem 0; transition: all 0.3s;}
section.s5 .accordion_list .accordion_name {width: calc(100% - 50px); padding-left: 2.78rem; font-size: var(--contents-title-24); font-weight: var(--font-weight-700); letter-spacing: -0.5px; word-wrap: break-word; word-break: keep-all;}
section.s5 .accordion_list .accordion_name .ar {position: absolute; top: 50%; right: 5px; width: 18px; height: 18px; transform: translateY(-50%);}
section.s5 .accordion_list .accordion_name .ar::before {content: ""; position: absolute; top: 50%; left: 0; width: 18px; height: 4px; background-color: var(--default-color); transform: translateY(-50%);}
section.s5 .accordion_list .accordion_name .ar::after {content: ""; position: absolute; left: 50%; top: 0; height: 18px; width: 4px; background-color: var(--default-color); transform: translateX(-50%);}
section.s5 .accordion_list .accordion_name .icon {position: absolute; top: 50%; left: 0; font-weight: var(--font-weight-700); font-size: var(--contents-title-28); color: var(--prime-color); transform: translateY(-50%);}
section.s5 .accordion_list .accordion_item .accordion_desc {display: none; padding: 1rem 2.78rem 3rem; background-color: #fff; color: var(--secondary-orange);  word-wrap: break-word; word-break: keep-all; line-height: 1.5;}
section.s5 .accordion_list .accordion_item.active {border-bottom: 2px solid var(--secondary-orange);}
section.s5 .accordion_list .accordion_item.active .accordion_link {background-color: #fff;}
section.s5 .accordion_list .accordion_item.active .accordion_name {color: var(--secondary-orange);}
section.s5 .accordion_list .accordion_item.active .accordion_name .ar::before {background-color: var(--secondary-orange);}
section.s5 .accordion_list .accordion_item.active .accordion_name .ar::after {display: none;}
section.s5 .accordion_list .accordion_item.active .accordion_name .icon {color: var(--secondary-orange);}
section.s5 .accordion_list .accordion_item.active .accordion_link::before {background-color: #15989f}

section.s6 {padding-bottom:6.7rem;background:#F2F2F2 url('../images/s6_bg.png') no-repeat calc(50% + 100px) top;}
section.s6 h2{padding-top:6.7rem;padding-bottom:1.1rem;font-size:var(--main-title-64); color: #0A3373;text-align:left; line-height:4.1rem;}
section.s6 p{margin-bottom:2rem;line-height:1;font-size:var(--contents-title-26);font-weight:var(--font-weight-500)}
section.s6 a{display:inline-block; position: relative; padding: 1rem 3.3rem 1rem 1.7rem; color: var(--secondary-blue); border:1px solid var(--secondary-blue);border-radius: 100px; overflow: hidden; font-size:var(--contents-title-24); font-weight: var(--font-weight-700);}
section.s6 a:hover{background: var(--secondary-blue);color: var(--secondary-white);}
section.s6 a:before {content: ""; position: absolute; right: 2rem; top: 50%; width: 9px; height: 18px; background: url('../images/s6_ar.svg') center center no-repeat; background-size: 9px; transform: translateY(-50%);}
section.s6 a:hover:before {background: url('../images/s6_ar_hover.svg') center center no-repeat;}


/* searching map */
.search_list a i, .result_box .pager .prev, .result_box .pager .next { background: url('../images/ico.png') no-repeat;}
.searching_area {display: flex; align-items: center; justify-content: space-between; padding: 1.2rem; border:1px solid var(--secondary-light-gray); flex-wrap: wrap; gap: 10px;}
.searching_area .col_select {display: flex; gap: 3px; }
.searching_area .col_result { text-align:right; display:inline-block; font-size: 18px; letter-spacing: -1px; color: #404040; order: 2;}
.select_box { width: 152px; position: relative; }
.select_box a { display: block; font-size: var(--contents-text-14); letter-spacing: -0.5px; color: var(--secondary-gray-100); padding: 0 1rem; text-align: left; }

.select_box dt a { display: block; height: 45px; border:1px solid var(--secondary-blue); line-height: 45px; background-color: #fff; position: relative; font-weight: var(--font-weight-400) }
.select_box dt a:after { position: absolute; top: 50%; right: 10px; width: 16px; height: 10px; content: ""; background: url('../images/select_ar.svg') center center no-repeat; transform: translateY(-50%);}
.select_box dd { position: absolute; top: 44px; left: 0px; border: 1px solid var(--secondary-blue); border-top: 0; max-height: 600px; overflow-y: auto; display: none; z-index: 55; width: 100%; background: #fff;}
.select_box li a { width: 100%; font-size: 14px; line-height: 30px; background: #fff }
.select_box li a:hover { background-color: #f1f1f1 }
.btn_search { display: inline-block; padding: 0 1.8rem; height: 45px; line-height: 45px; color: var(--secondary-white);  background: var(--secondary-blue); text-align:center; font-weight: var(--font-weight-700); font-size: var(--contents-text-14); letter-spacing: -0.5px;}
.searching_area .col_result .count { color: var(--secondary-blue); font-weight: var(--font-weight-700) }

.result_box { position: absolute; top: 0; left: 30vw; margin-left: -45vw; width: 15vw; height: 100%; background: #fff; border: 1px solid #e2e2e2; text-align: left; overflow-y: auto; opacity: 0; filter: alpha(opacity=0); transition: all .3s ease-in-out; z-index: 50 }
.result_box a { text-decoration: none }
.result_box.open { margin-left: -30vw; opacity: 1; filter: alpha(opacity=100) }
.result_box .pager { padding: 20px 0; line-height: 25px; text-align: center; position: relative }
.result_box .pager a {color: #4a4a4a; text-align: center; margin: 0 5px }
.result_box .pager a.on { font-weight: bold; color: #133b89 }
.result_box .pager .prev, .result_box .pager .next { margin: -6px 0 0 0; display: inline-block; width: 25px; height: 23px; border: 1px solid #ddd; text-indent: -999px; font-size: 0; vertical-align: middle }
.result_box .pager .prev { background-position: 0 -60px }
.result_box .pager .next { background-position: -30px -60px }
.result_box .pager .prev.last, .result_box .pager .next.last { pointer-events: none; cursor: default }
.result_box .pager .prev.last { background-position: 0 -30px }
.result_box .pager .next.last { background-position: -30px -30px }
.search_list a { display: block; padding: 20px 15px 20px 50px; border-bottom: 1px solid #e2e2e2; font-size: 12px; line-height: 16px; color: #5a5a5a; text-decoration: none; position: relative }
.search_list a i { position: absolute; top: 20px; left: 15px; display: inline-block; width: 26px; height: 36px; font-size: 14px; font-weight: bold; font-style: normal; line-height: 28px; color: #fff; background-position: -80px 0; text-align: center }
.search_list a>span { display: block }
.search_list .place { font-size: 16px; font-weight: 600; line-height: 30px; color: #4a4a4a }
.search_list a:hover i, .search_list a.active i { background-position: -122px 0 }
.search_list a:hover .place, .search_list a.active .place { color: #3db46f }

#layer_notice {display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.8); z-index: 999;}
#layer_notice .popup_box {position: absolute; left: 50%; top: 48%; width: 1000px; transform: translate(-50%, -50%);}
#layer_notice .popup_box img {width: 100%;}
#layer_notice .btnWrap {overflow: hidden; position: absolute; left: 0; bottom: 0; width: 100%; height: 10.2%;}
#layer_notice .btnWrap input {visibility: hidden; position: absolute; left: 0; top: 0; width: 0; height: 0;}
#layer_notice .btnWrap label {display: inline-block; position: relative; width: 25%; height: 100%; margin-left: 3%; text-indent: -999em; cursor: pointer;}
#layer_notice .btnWrap label::before {display: none; position: absolute; left: 4%; top: 33.5%; content: ''; width: 3%; max-width: 7px; height: 23%; max-height: 12px; border: 2px solid #000037; border-top: 0; border-left: 0; transform: rotate(45deg);}
#layer_notice .btnWrap input:checked + label::before {display: block;}
#layer_notice .btnWrap a.btnClose {float: right; width: 8%; height: 100%; margin-right: 2.3%; text-indent: -999em;}

.btnFloating {position: fixed; top: 226px; right: 0; z-index: 99;}
.btnFloating a {display: block; height: 100%;}
.btnTop {position: fixed; bottom: 42px; right: 41px; z-index: 99;}
.btnTop a {display: block; height: 100%;}

/* footer */
#footer {position: relative; border-top: 1px solid #dfdfdf; padding: 3.75rem 0; background: #fff; text-align:left; color: #757575;}
#footer .inner {display: flex; align-items: flex-start; gap: 7.5rem;}
#footer p {font-size: var(--contents-text-14); margin-bottom: 5px;}
#footer p strong {font-weight: 400;}
#footer .bar {display: inline-block; width: 1px; height: 14px; background: var(--secondary-light-gray); vertical-align: middle; margin: 0 13px 3px;}
#footer .copyright {font-size: 12px; display: block; margin-top: 15px; line-height: 20px;}
#footer .txt {font-size: 12px; line-height: 20px;}