@charset "utf-8";


.skiptranslate {display:none !important;}
body.no-scroll {overflow-y:hidden;}
.area {position: relative; max-width:180rem; width:100%; margin:0 auto;}
.black-bg{position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.7); z-index: 6; display: none; }
.black-bg.on{display: block;}
@media screen and (max-width:1800px) {
  .area {padding:0 2rem;}
}
@media screen and (max-width:1200px) {
  .area {padding:0 4rem;}
}
@media screen and (max-width:768px) {
  .area {padding:0 2rem;}
}

.sub-area {position: relative; max-width:144rem; width:100%; margin:0 auto;}
@media screen and (max-width:1440px) {
  .sub-area {padding:0 2rem;}
}
@media screen and (max-width:1200px) {
  .sub-area {padding:0 4rem;}
}
@media screen and (max-width:768px) {
  .sub-area {padding:0 2rem;}
}
/* [S] 헤더 */
.wrap-header {position: absolute; top:0; left:0; z-index: 5; width:100%;}
.wrap-header.on {z-index: 6;}
/* 헤더 탑 */
.wrap-header .header-top {background:rgba(0,0,0,0.2); font-family: paper; font-weight: 400; font-size: 1.4rem;}
.wrap-header .header-top ul {display: flex; align-items: center; justify-content: end;}
.wrap-header .header-top ul li {position: relative; margin-left:2rem; padding-left:2rem;}
.wrap-header .header-top ul li::before {content:''; position: absolute; top:50%; left:0; width:.3rem; height:.3rem; margin-top:-.1rem; background:#A1A2A5;}
.wrap-header .header-top ul li:first-child::before {display: none;}
.wrap-header .header-top a {background-image: linear-gradient(#fff,#fff);background-position: left bottom;background-size: 0 1px;background-repeat: no-repeat;transition: background-size .5s;}
.wrap-header .header-top a:hover {background-size: 100% 1px;}
.wrap-header .header-top a, 
.wrap-header .header-top button {line-height:4rem; font-size: 1.4rem; color:#fff;}

/*.wrap-header.scroll .header-top,
.wrap-header.on .header-top{background: #144173;}*/
.wrap-header.on .header-top{background: #144173;}

/* 구글번역 */
.language {position: relative; display: inline-block; padding-left:4rem !important; margin-left:3rem !important; padding-right:2rem;}
.wrap-header .util .language {display: none;}
.language button,
.language a{text-indent: 0 !important; font-size: 1.4rem !important; color:#fff;}
.language span {text-transform: uppercase;}
.language::before {content:''; position: absolute; top:50%; left:0; width:2.9rem !important; height:2.8rem !important; margin-top:-1.4rem !important; background:url('../../images/common/ic-language.png') no-repeat left center / 2.8rem auto !important;}
.language .lang::after {content:''; position: absolute; right:0; top:50%; width:1.2rem; height:.6rem; margin-top:-.3rem; background: url('../../images/common/ic-language-arrw.png') no-repeat center / 1.2rem auto; transition:transform .3s;}
.language .lang:has(.list.on)::after {transform:rotate(180deg);}
.language .list li {text-align:center;}
.mobile-menu .language .lang::after {background: url('../../images/common/ic-language-arrw-on.png') no-repeat center / 1.2rem auto;}
/* 헤더 */ 
.wrap-header .header {position: relative;}
.wrap-header .header > .area{position: static;}
.wrap-header .header .area {display: flex; align-items: center; justify-content: space-between;}
.wrap-header .header .logo {position: relative;width: 30rem;z-index: 1;}
.wrap-header .header .logo img{width: 100%;} 
.wrap-header .header .logo .white{display: block;}
.wrap-header .header .logo .color{display: none;}

/*.wrap-header.scroll,*/
.wrap-header.on{background-color: white; border-bottom: .1rem solid #e6eef7;}
.wrap-header.on .header .logo .white{display: none;}
.wrap-header.on .header .logo .color{display: block;}
/* 메뉴 */
.header .menu {display: flex; flex:1; justify-content: end;}
.header .menu .link{display: none;}
.header .menu .ul_1 {display: flex; gap:9.5rem;}
.header .menu .li_1:last-child {display: none;} 
.header .menu .a_1 {display: flex; align-items: center; justify-content: center; min-height:8.5rem; font-family: paper; font-weight: 500; font-size: 2.4rem; color:#fff; position: relative;z-index: 1;}
.header .menu .a_1.on{color: #0053b0;}
.header .menu .a_1.on::after{content:""; display: block; position: absolute; left: 50%; margin-left: -.7rem; bottom: -.7rem; width: 1.4rem; height: 1.4rem; border-radius: 50%; background-color: #0053b0; z-index: 2;}
.header .menu .div_2{position: absolute; left: 0; top: calc(100% + .1rem); max-height: 0;background: #edf6ff url('../../images/common/bg-menu.png') no-repeat right -1rem bottom -9rem / 33.3rem; width: 100%; padding: 3rem 0 9.5rem 0;transition:all 0.25s cubic-bezier(0.7, 0, 0.3, 1);opacity:0;pointer-events: none;}
.header .menu .div_2.on{opacity: 1;pointer-events: auto;}
.header .menu .div_2 .inner{max-width: 180rem; margin: 0 auto;}
.header .menu .ul_2{display: flex; flex-wrap: wrap; margin: -8rem -1.9rem 0;}
.header .menu .li_2{width: 20%; padding:0 1.9rem; margin-top: 8rem;}
.header .menu .a_2{font-size: 2rem; color: #333333; font-weight: 500; display: block; border-radius: 1rem; background: white; display: flex; align-items: center; height: 6rem; padding: 0 2rem; position: relative;}
.header .menu .a_2._active,
.header .menu .a_2.on{background: linear-gradient(to left, #2567b0, #172657); color: #ffffff;}
.header .menu .a_2[target=_blank]::after{content:""; display: block; position: absolute; right: 2rem; top: 50%; margin-top: -.9rem; width: 1.8rem; height: 1.8rem; background: url(../../images/common/ic-blank-dep2.png) no-repeat center center / cover;}
.header .menu .a_2.on[target=_blank]::after{background: url('../../images/common/ic-blank-dep2-on.png') no-repeat center center / cover;}
.header .menu .ul_3{padding: 2rem 0 0 2rem;}
.header .menu .li_3{padding-left: 1.8rem; position: relative; margin-bottom: .9rem}
.header .menu .li_3::after{content:""; display: block; position: absolute; left: 0; top: .9rem; width: .6rem; height: .6rem; border-radius: 50%; background-color: #0359b8}
.header .menu .li_3:last-child{margin-bottom: 0;}
.header .menu .a_3{font-size: 1.6rem; color: #666666; display: inline-block; position: relative;}
.header .menu .a_3[target=_blank]{padding-right: 1.8rem;}
.header .menu .a_3[target=_blank]::after{content:""; display: block; position: absolute; right: 0; top: 50%; margin-top: -.55rem; width: 1.1rem; height: 1.1rem; background: url(../../images/common/ic-blank-dep3.png) no-repeat center center / cover;}
.header .menu .a_3 span{background: linear-gradient(#0076c4, #0076c4); background-repeat: no-repeat; background-position: left 0 bottom 0; background-size: 0 .1rem; transition: background-size .5s;}
.header .menu .a_3._active,
.header .menu .a_3:hover{color: #0076c4;}
.header .menu .a_3[target=_blank]:hover::after{background: url('../../images/common/ic-blank-dep3-on.png') no-repeat center center / cover;}
.header .menu .a_3._active span,
.header .menu .a_3:hover span{background-size: 100% .1rem;}

/*.wrap-header.scroll .a_1,*/
.wrap-header.on .a_1{color: #000000}
/* 유틸 */
.header .util {display: flex; gap:5rem; margin-left:8rem;}
.header .util > div {height:100%; }
.header .util > div > button {display: inline-block; height:8.5rem; text-indent: -9999rem;}



.header .util .head-search {position: relative;}
.header .util .head-search > button { width:3rem; background:url('../../images/common/ic-search.png') no-repeat center / 3rem auto;}

.header .util .pop {position: relative;}
.header .util .pop button { width:3.2rem; background:url('../../images/common/ic-popup.png') no-repeat center / 3.2rem auto; text-indent: -9999rem;}
.header .util .pop button .state {position: absolute; right:-0.3rem; top:50%; display: flex; align-items: center; justify-content: center; width:2rem; height:2rem; background:#D90304; border-radius:50%; font-weight: 700; font-size: 1.2rem; text-indent: 0; color:#fff;}

.header .util .sitemap {position: relative;}
.header .util .sitemap a {display: inline-block; width:3.2rem; height:8.5rem; background:url('../../images/common/ic-menu.png') no-repeat center / 3.2rem auto; text-indent: -9999rem;}


.header .btn-gnb-open {display: none; position: relative;}
.header .btn-gnb-close button,
.header .btn-gnb-open button {display: inline-block; width:3.2rem; background:url('../../images/common/ic-menu.png') no-repeat center / 3.2rem auto; text-indent: -9999rem;}

.header .mobile-menu  {display: none;}
.header .btn-gnb-close {display: none; margin-left:7rem;}
.header .btn-gnb-close button {height:8.8rem;}

.wrap-header.on .header .util .head-search > button{background: url('../../images/common/ic-search-color.png') no-repeat center / 3rem auto;}
.wrap-header.on .header .util .pop button{background: url('../../images/common/ic-popup-color.png') no-repeat center / 3.2rem auto;}
.wrap-header.on .header .util .sitemap a{background: url('../../images/common/ic-menu-color.png') no-repeat center / 3.2rem auto;}
.wrap-header.on .header .util .btn-gnb-open button{background: url('../../images/common/ic-menu-color.png') no-repeat center / 3.2rem auto;}
.wrap-header.on .header .btn-gnb-close button{background: url('../../images/common/ic-menu-close.png') no-repeat center / 2.6rem auto;}


/* 구글번역 안내창 */
.wrap-header .tip {position: absolute; left: -99999px; top: 100%; right:0;  z-index:5; width: 41.6rem; padding: 1rem 1.5rem; background: rgba(255,255,255,1); border-radius: 0.5rem; font-size: 1.4rem; border: 1px solid #d1d1d1; color: #666; opacity: 0; transition: opacity .75s;}
.wrap-header .tip.on {left: auto; opacity: 1;}
.wrap-header .tip button {display: inline-block; margin-top: 0.5rem; padding: 0.5rem 1rem; background: #003477; border-radius: 0.5rem; line-height:1.5; color: #fff !important;}
.wrap-header .util .tip,
.wrap-header .util .list{top:100%;}
.wrap-header.on .util .tip,
.wrap-header.on .util .list{display:none;}

@media screen and (max-width: 768px) {
  .wrap-header .tip {top: 145%;right: -4.5rem;}
}

/* 구글번역 리스트 */
.wrap-header .list {overflow: hidden; position: absolute; left: 0; top: 100%; z-index:5; width:100%; max-height: 0; background: #fff; border: 1px solid #fff; border-radius: 0.5rem; transition: max-height .5s; opacity: 0;}
.wrap-header .list.on {max-height: 25rem; border: 1px solid #d1d1d1; opacity: 1;}
.wrap-header .list ul {flex-direction:column; padding: 0.5rem 0;}
.wrap-header .list li {padding: 0.3rem 0 !important; margin:0 !important;}
.wrap-header .list li:last-child {border: 0}
.wrap-header .list li::before {display:none;}
.wrap-header .list li a {line-height:1.5; color:#121212;}
.wrap-header .list li a:hover {color:#1473e5;}
.wrap-header .list li a.on {color:#1473e5; text-decoration: underline;}


/* [E] 헤더 */


/* [S] 플로팅 */
.floating {position:fixed; bottom:0; right:2rem; bottom:12rem; z-index: 5;  transition:all .3s;}
.floating.at-bottom {opacity:0 !important; visibility: hidden !important;}
.floating ul.btn-ul {display: flex; flex-direction: column; gap:1rem;}
.floating ul.btn-ul > li {position: relative;}
.floating ul.btn-ul > li > button {width:8rem; height:8rem; padding:0 2rem; border-radius:50%; font-weight: 600; font-size: 1.4rem; color:#fff;}
.floating ul.btn-ul > li > button span {position: relative;}
.floating .btn-user {background:#007EFF;}
.floating .btn-user span {display: flex; flex-direction: column; align-items: center; gap:0.5rem;}
.floating .btn-user span::before {content:''; display: block; width:2.2rem; height:2.2rem; background:url('../../images/common/ic-user.png') no-repeat center / cover;}
.floating .btn-notice {background:#00409A;}
.floating .btn-notice span {display: flex; flex-direction: column; align-items: center; gap:0.5rem;}
.floating .btn-notice span::before {content:''; display: block; width:2.4rem; height:2.2rem; background:url('../../images/common/ic-noti.png') no-repeat center / cover;}
/* [E] 플로팅 */

/* [S] 사용자 메뉴 */
.wrap-user {position: absolute; right:calc(100% + 1.5rem); bottom:0; width:35rem; opacity:0; visibility: hidden; transition: all .3s;}
.wrap-user.on {opacity:1; visibility: visible;}
.wrap-user .aco-list {position: relative; left:5rem; transition: left .3s;}
.wrap-user.on .aco-list {left:0rem;}

.wrap-user .items {margin-bottom: 1rem;}
.wrap-user .items:last-child {margin-bottom: 0;}
.wrap-user .info-box > button {position: relative; display: flex; align-items: center; width:100%; height:6.5rem; padding:0 5rem 0 2rem; ;background:#fff; font-weight: 600; font-size: 2rem; color:#000; transition: background .3s, border-color .3s;}
.wrap-user .info-box > button::after {content:''; position: absolute; right:3rem; top:50%; width:1.4rem; height:0.9rem; margin-top:-0.4rem; background:#1F1F1F; mask:url('../../images/common/ic-user-arrw.png') no-repeat center / 1.4rem auto;-webkit-mask:url('../../images/common/ic-user-arrw.png') no-repeat center / 1.4rem auto; transition:all .3s;}
.wrap-user .info-box.active > button::after {transform:rotate(180deg);}
.wrap-user .info-box > button:hover::after,
.wrap-user .info-box.active > button::after {background:#fff;}
.wrap-user .info-box > button span {position: relative; display: inline-block; padding-left:4rem;}

.wrap-user .info-box > button span::before {content:''; position: absolute; left:0; top:50%;}
.wrap-user .info-box.active > button span::before,
.wrap-user .info-box > button:hover span::before {background-color:#fff !important;}

.wrap-user .items1 .info-box > button span::before {width:2.7rem; height:2.8rem; margin-top:-1.4rem; background:#1D306F; mask:url('../../images/common/ic-user1.png') no-repeat center / 2.7rem auto; -webkit-mask:url('../../images/common/ic-user1.png') no-repeat center / 2.7rem auto; transition:all .3s;}
.wrap-user .items1 .info-box > button:hover,
.wrap-user .items1 .info-box.active > button {background:#1D306F; color:#fff;}
.wrap-user .items2 .info-box > button span::before {width:2.3rem; height:2.6rem; margin-top:-1.3rem; background:#007EFF; mask:url('../../images/common/ic-user2.png') no-repeat center / 2.3rem auto; -webkit-mask:url('../../images/common/ic-user2.png') no-repeat center / 2.3rem auto; transition:all .3s;}
.wrap-user .items2 .info-box > button:hover,
.wrap-user .items2 .info-box.active > button {background:#007EFF; color:#fff;border-color: #007EFF;}
.wrap-user .items3 .info-box > button span::before {width:2.6rem; height:2.7rem; margin-top:-1.4rem; background:#009AC6; mask:url('../../images/common/ic-user1.png') no-repeat center / 2.7rem auto; -webkit-mask:url('../../images/common/ic-user3.png') no-repeat center / 2.6rem auto; transition:all .3s;}
.wrap-user .items3 .info-box > button:hover,
.wrap-user .items3 .info-box.active > button {background:#009AC6; color:#fff;border-color: #009AC6;}

.wrap-user .info-box {max-height: 6.5rem;overflow: hidden;border-radius:0 0 3rem 3rem; transition:max-height .5s;border-radius: 3rem;border: 1px solid #cdcdcd;}
.wrap-user .info-box.active {max-height: 35rem;border-radius: 3rem;border: 0;}
.wrap-user .items1 .info-box:hover {border-color: #1D306F;}
.wrap-user .items2 .info-box:hover {border-color: #007EFF;}
.wrap-user .items3 .info-box:hover {border-color: #009AC6;}
.wrap-user .info-box.active .item-list {border: 1px solid #cdcdcd;border-radius: 0 0 3rem 3rem;}
.wrap-user .item-list {background:#fff; }
.wrap-user .item-list .scrollbox {max-height:25.4rem; overflow-y:auto;}
.wrap-user .item-list .scrollbox::-webkit-scrollbar {width:0.5rem;}
.wrap-user .item-list .scrollbox::-webkit-scrollbar-thumb {background:#003976; border-radius:0.5rem;}
.wrap-user .item-list .scrollbox::-webkit-scrollbar-track {}
.wrap-user .item-list ul {display: flex; flex-wrap:wrap; gap:1rem; padding:3rem 2rem;}
.wrap-user .item-list ul li {width:calc(50% - 1rem);}
.wrap-user .item-list a {position: relative; display: inline-block; padding-left:1.3rem; font-weight: 400; font-size: 1.5rem; color:#000;}
.wrap-user .item-list a:hover {color:#1174FF;}
.wrap-user .item-list a span {background:linear-gradient(#1174FF,#1174FF) no-repeat left bottom; background-size:0 1px; transition:background-size .3s;}
.wrap-user .item-list a:hover span {background-size:100% 1px;}
.wrap-user .item-list a::before {content:''; position: absolute; left:0; top:0.9rem; width:0.4rem; height:0.4rem; background:#A3A3A3;}
.wrap-user .item-list a:hover::before {background:#1174FF;}

.wrap-user .btn-user-close {position: absolute; left:calc(100% + 1.5rem); bottom:0; width:8rem; height:8rem; background:#007EFF;  border-radius:50%; text-indent: -9999rem;}
.wrap-user .btn-user-close::after {content:''; position: absolute; left:50%; top:50%; width:1.8rem; height:1.8rem; margin-left:-0.9rem; margin-top:-0.9rem; background:url('../../images/common/btn-user-close.png') no-repeat center / 1.8rem auto;}
.wrap-user .btn-user-close::before {content:''; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%) scale(0.9); width:100%; height:100%; background:#000; border-radius:50%; transition:transform .3s;}
.wrap-user .btn-user-close:hover::before {transform: translate(-50%, -50%) scale(0);}
/* [E] 사용자 메뉴 */

/* 푸터 */
.sub .wrap-footer {margin-top:10rem;}
.sub footer.no-margin .wrap-footer {margin-top:0;}
.wrap-footer{background-color: #eaebed; padding: 4rem 0 0 0;}
.wrap-footer .wrap-footer-top{ display: flex; justify-content: space-between; align-items: center; max-width: 180rem; margin: 0 auto;}
.wrap-footer .wrap-footer-top .footer-logo{width: 18.8rem}
.wrap-footer .wrap-footer-top .footer-logo img{width: 100%;}
.wrap-footer .footer-top-left{overflow:hidden; display: flex; gap: 4.7rem; flex-wrap: wrap; min-width:0;}
.wrap-footer .footer-info-top{display: flex; flex-wrap: wrap; margin-bottom: .5rem;}
.wrap-footer .footer-info-top p{font-size: 1.7rem; color: #555555;}
.wrap-footer .footer-info-top p span{display: inline-block; margin: 0 2rem 0 .5rem;}
.wrap-footer .footer-info-bottom{display: flex; flex-wrap: wrap; gap: 2rem;}
.wrap-footer .footer-info-bottom dl{display: flex; flex-wrap: wrap;}
.wrap-footer .footer-info-bottom dt{font-weight: 600; color: #222222;}
.wrap-footer .footer-top-right{position: relative;z-index: 4;width:40rem;min-width:0; flex-shrink:0;}
.wrap-footer .footer-top-right button{display: block; width: 40rem; height: 6rem; background-color: white; border-radius: 3rem; align-items: center; padding: 0 4rem; position: relative; text-align: left; font-size: 1.8rem; color: #000000; font-weight: 500; z-index: 2;}
.wrap-footer .footer-top-right button::after{content:""; display: block; position: absolute; right: 4rem; top: 50%; margin-top: -1.05rem; width: 2rem; height: 2.1rem; background: url(../../images/common/ic-sitemap.png) no-repeat center center / cover;}
.wrap-footer .footer-top-right button.on {border-radius: 0 0 3rem 3rem;}
.wrap-footer .footer-top-right button.on::after{transform: rotate(180deg);}
.wrap-footer .footer-top-right > div {display: none;overflow: hidden;max-height: 35rem;position: absolute; left: -.1rem; bottom: calc(100% - 1rem); background-color: white; border-radius: 3rem;width: calc(100% + .22rem); padding: 0rem 1.2rem 1rem 0; z-index: 1;border: .1rem solid #eaeaea;}
.wrap-footer .footer-top-right > div.on {display: block; border-radius: 3rem 3rem 0 0;}
.wrap-footer .footer-top-right ul{ overflow: auto;max-height: 26.7rem;}
/* .wrap-footer .footer-top-right ul.on{display: block;} */
.wrap-footer .footer-top-right li a{font-size: 1.6rem; display: block; color: #000000; padding: 1.5rem 2rem;}
.wrap-footer .footer-top-right li a:hover{background-color: #144173; color: white;}
.wrap-footer .wrap-footer-bottom{overflow: hidden; min-width:0; background-color: #05367b; border-top-left-radius: 3rem; border-top-right-radius: 3rem; margin-top: 4rem; padding: 2.3rem 0;}
.wrap-footer .wrap-footer-bottom .area{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.wrap-footer .footer-bottom-left ul {min-width:0; overflow: hidden;}
.wrap-footer .footer-bottom-left ul{display: flex; flex-wrap: wrap; gap: 3.5rem;}
.wrap-footer .footer-bottom-left li a{color: #ffffff; font-size: 1.6rem; color: #ffffff;background-image: linear-gradient(#fff,#fff);background-size: 0 1px;background-position: left bottom;background-repeat: no-repeat;transition: background-size .5s;}
.wrap-footer .footer-bottom-left li a:hover {background-size: 100% 1px;}
.wrap-footer .footer-bottom-left li.private a{color: #8ac3ff; font-weight: 500;background-image: linear-gradient(#8ac3ff,#8ac3ff);}
.wrap-footer .footer-bottom-right p{font-size: 1.4rem; color: #ffffff; opacity: .4;}

/* 검색 */
.head-search .openSearch{display:flex;align-items:center;justify-content:center;text-indent:-9999px;}
.head-search .boxSearch{display:flex;align-items:center;justify-content:center;position:fixed;left:0;top:0;width:100%;z-index:3;height:100vh;background:url('../../images/common/bg-search.jpg') no-repeat center;background-size:cover;visibility:hidden;opacity:0;transition:0.5s;}
.head-search .boxSearch.on{visibility:visible;opacity:1;}
.head-search .boxSearchInner{max-width:100rem;width:100%; position:relative;}
.head-search .boxSearch .item_1{font-weight: 600; font-size: 3.6rem; color:#fff;}
.head-search .boxSearch .item_1 strong{font-weight: 600; font-size: 5rem; color:#20A7FF;}
.head-search .boxSearch .item_1 span{font-size:1.8rem;font-family:'pre-sb';padding-left:1rem;}
.head-search .boxSearch .item_2{position:relative;margin:1rem 0 2rem 0;}
.head-search .boxSearch .item_2 input[type=text]{color:#FFF;font-size:3rem;border:2px solid #FFF;padding:3rem 3rem;width:100%;background:rgb(0,0,0,0.2);}
.head-search .boxSearch .item_2 input[type=text]::placeholder{color:#FFF;}
.head-search .boxSearch .item_2 input[type=submit]{width:10rem;height:100%;background:url('../../images/common/ic-search-w.png') no-repeat center;text-indent:-9999px;position:absolute;right:0;top:0;}
.head-search .boxSearch .item_3{display:flex;align-items:center;}
.head-search .boxSearch .item_3 dt{font-weight: 400;font-size:2rem;color:#009AFF;padding-right:5rem;}
.head-search .boxSearch .item_3 dd{display:flex;}
.head-search .boxSearch .item_3 dd button{font-size:1.5rem;font-weight: 300;color:#FFF;padding:1rem 1.8rem;border:1px solid rgb(255,255,255,0.3);margin:0 1rem 0.5rem 0; border-radius:0.5rem; text-indent: 0;}
.head-search .closeSearch {width:9rem !important; height:9rem !important; background:#1174FF url('../../images/common/btn-search-close.png') no-repeat center;border-radius:100%;text-indent:-9999px;position:absolute;right:-11.5rem;top:-11.5rem;transition:0.3s;}
.head-search .closeSearch:hover {transform:rotate(180deg);}
@media all and (max-width:1580px){
  .head-search{padding:0 1rem 0 2rem;}
  .head-search .closeSearch {right:0;}
}
@media screen and (max-width: 1280px) {
  .head-search{padding:0 2rem 0 3rem;}
  .head-search .boxSearch{align-items:flex-start;padding-top:10rem;}
  .head-search .boxSearchInner{width:100%;max-width:90%;padding-top:8rem;}
  .head-search .closeSearch {top:0;}
}
@media screen and (max-width: 1024px) {
  .head-search .boxSearch .item_1 span{display:block;}
  .head-search .boxSearch .item_3{flex-direction:column;}
  .head-search .boxSearch .item_3 dt{width:100%;padding-right:2;padding-bottom:2rem;}
  .head-search .boxSearch .item_3 dd{width:100%;flex-wrap:wrap;}
}
@media screen and (max-width: 768px) {
  .head-search .boxSearchInner{padding-top:3rem;padding-right:3rem;}
  .head-search .boxSearch .item_1{font-size:2.6rem; line-height: 1.2;}
  .head-search .boxSearch .item_1 strong {font-size: 3rem;}
  .head-search .boxSearch .item_2 input[type=text]{font-size:2rem;padding:2rem;}
  .head-search .boxSearch .item_2 button[type=submit]{width:7rem;}
  .head-search .closeSearch{width:6rem !important;height:6rem !important;background-size:33%;}
}


@media screen and (max-width: 1800px) {
  .header .menu .div_2{padding-left: 2rem; padding-right: 2rem;}
  .wrap-footer .wrap-footer-top{padding: 0 2rem;}
}
@media screen and (max-width:1500px) {
  .header .util {margin-left:5rem;}
}
@media screen and (max-width: 1300px) {
  .wrap-header .header-top ul li{padding-left: 1rem; margin-left: 1rem;}
  .wrap-header .header-top a, .wrap-header .header-top button{font-size: 1.4rem;}

  .header .menu .ul_1{gap: 6rem;}
  .header .menu .a_1{font-size: 2rem;}
  .header .menu .div_2{padding: 3rem 2rem 5rem;}
  .header .menu .ul_2{margin: -5rem -2rem 0;}
  .header .menu .li_2{padding: 0 2rem; margin-top: 5rem;}
  .header .menu .a_2{font-size: 1.6rem; height: 5rem;}
  .header .menu .li_3{margin-bottom: .5rem;}
  .header .menu .a_3{font-size: 1.4rem;}

  .header .util {margin-left:3rem;}

  .wrap-footer .wrap-footer-top{position: relative; padding: 0 4rem;}
  .wrap-footer .footer-top-left{flex-direction: column; gap: 4rem;}
  .wrap-footer .wrap-footer-bottom .area{flex-direction: column; align-items: start;}
  .wrap-footer .footer-bottom-right{margin-top: 1rem;}
}
@media screen and (max-width: 1200px) {
  .wrap-header .header-top{display: none;}
  .wrap-header .header .logo {position: relative; z-index: 2; }
  .header .menu{position: absolute; right: -100%; top:0rem; z-index: 1; display:block; max-width: 50rem; width: 100%; height: 100vh; visibility: hidden; opacity: 0; transition: all .35s; background-color: white;}
  .header .menu.on{opacity: 1; visibility: visible; right:0;}
  .header .mobile-menu {display: block;}
  .wrap-header .header .menu .menuUItop {position: relative; height:100%;}
  .header .mobile-menu {display: flex; align-items: center; justify-content: end; width:100%; height:8.8rem; padding:0 4rem;}
  .header .menu .link{display: block; background-color: #f5f5f5;}
  .header .menu .link ul{display: flex; justify-content: center; align-items: center; height: 8rem; border-bottom: .1rem solid #e5e5e5;}
  .header .menu .link li {position: relative; margin-left:2rem; padding-left:2rem;}
  .header .menu .link li::before {content:''; position: absolute; top:50%; left:0; width:.3rem; height:.3rem; margin-top:-.1rem; background:#A1A2A5;}
  .header .menu .link li:first-child{padding-left: 0; margin-left: 0;}
  .header .menu .link li:first-child::before {display: none;}
  .header .menu .link li a{font-size: 1.4rem; color: #000000}
  .header .menu .ul_1{gap: 0; flex-direction: column;}
  .header .menu .li_1{position: static; display: block; width: 100%; padding: 0; text-align: left;}
  .header .menu .li_1:last-child {display: block;}
  .header .menu .a_1{width: 18rem; min-height: 7.6rem; padding: 0; font-size: 2.2rem; color: #222222; display: flex; align-items: center; justify-content: start; padding: 0 2.5rem;}
  .header .menu .a_1.on::after{left: 0; width: 100%; bottom: 0; height: .2rem; margin-left: 0;}
  /*.header .menu .div_2{overflow-y:auto; position: absolute; left: auto; right: 0; top: 0rem; height: calc(100% - 8.8rem); max-height: none; background: #f5f5f5; transition-property: none; width: calc(100% - 18rem); padding: 0;} */
  .header .menu .div_2{overflow-y:auto; position: absolute; left: auto; right: 0; top: 0rem; height: calc(100dvh - 15rem); max-height: none; background: #f5f5f5; transition-property: none; width: calc(100% - 18rem); padding: 0;max-height: 100% !important;}
  .header .menu .ul_2{margin: 0; flex-direction: column;}
  .header .menu .li_2{width: 100%; margin-top: 0; padding: 0;}
  .header .menu .a_2{color: #222222; font-size: 1.8rem; height: 7.6rem; background-color: transparent; padding: 0 5rem 0 3rem; border-radius: 0;}
  .header .menu .a_2.plus::after{content:""; display: block; position: absolute; width: 1rem !important; height: .6rem !important; background: url('../../images/common/ic-mobile-arrow.png') no-repeat center center / cover; right: 3rem; top: 50%; margin-top: -.3rem !important;}
  .header .menu .a_2.on.plus::after{background: url('../../images/common/ic-mobile-arrow-on.png') no-repeat center / cover;}
  .header .menu .a_2[target=_blank]::after{right: 3rem; width: 1.4rem; height: 1.4rem; margin-top: -.7rem;}
  .header .menu .div_3{display: none; background-color: #e9f2fc;}
  .header .menu .div_3.on{display: block;}
  .header .menu .ul_3{padding: 2.5rem 3rem;}
  .header .menu .li_3{margin-bottom: 1rem;}
  .header .menu .a_3{font-size: 1.6rem;}
  .header .util{gap: 4rem; align-items:center;}
  .head-search{padding: 0;}
  .header .util > div > button{height: 8.8rem; font-size: 1.4rem;}
  .wrap-header .util .language {display: block !important;}

  .header .util .sitemap{display: none;}
  .header .btn-gnb-open {display: block;}
  .header .btn-gnb-close.on{display: block;}

  .wrap-header.scroll .header .language button,
  .wrap-header.on .header .language button{color: #222222;}
  .wrap-header.scroll .header .language::after,
  .wrap-header.on .header .language::after{background: url('../../images/common/ic-language-arrw-on.png') no-repeat center / 1.2rem auto;}

  .floating {bottom:35rem;}
}

@media screen and (max-width: 768px) {
  .wrap-header {position: fixed;}
  .wrap-header .header .logo{width: 17rem;}

  .wrap-header.scroll{background-color: white; border-bottom: .1rem solid #e6eef7;}
  .wrap-header.scroll .header .logo .white{display: none;}
  .wrap-header.scroll .header .logo .color{display: block;}

  .wrap-header.scroll .header .util .head-search > button {background: url('../../images/common/ic-search-color.png') no-repeat center / 3rem auto;}
  .wrap-header.scroll .header .util .pop button {background: url('../../images/common/ic-popup-color.png') no-repeat center / 3.2rem auto;}
  .wrap-header.scroll .header .util .sitemap a {background: url('../../images/common/ic-menu-color.png') no-repeat center / 3.2rem auto;}
  .wrap-header.scroll .header .util .btn-gnb-open button{background: url('../../images/common/ic-menu-color.png') no-repeat center / 3.2rem auto;}

  .header .menu{top: 0rem}
  .header .mobile-menu {height: 7rem; padding:0 2rem;}
  .header .btn-gnb-close {margin-left:4.5rem;}
  .header .btn-gnb-close button {height:7rem;  background-size:2.1rem auto !important;}
  .header .util{gap: 3rem;}
  .header .util .language{display: none !important;}
  .header .util > div > button{height: 7rem;}
  .header .util .head-search > button{width: 2.3rem; background-size: 2.3rem auto !important;}
  .header .util .pop button{width: 2.5rem; background-size: 2.5rem auto !important;}
  .wrap-header.on .header .util .btn-gnb-close button,
  .header .btn-gnb-open button{width: 2.5rem; background-size: 2.5rem auto !important;}
  /* .wrap-header.on .header .util{gap: 5rem;} */
  /* .wrap-header.on .header .util .search,
  .wrap-header.on .header .util .pop{display: none;} */

  .floating {right:1rem; bottom:14rem;}
  .floating ul.btn-ul {gap:1rem;}
  .floating ul.btn-ul > li > button {width:6.5rem; height:6.5rem; font-size: 1.2rem;}
  .floating .btn-user span::before {width:1.4rem; height:1.4rem;}
  .floating .wrap-user .btn-user-close {width:6.5rem; height:6.5rem;}
  .wrap-user .btn-user-close::before {transform: translate(-51%, -51%) scale(0.88);}
  .floating .btn-notice span::before {width:1.5rem; height:1.4rem;}


  .wrap-footer {}
  .wrap-footer .footer-top-left{align-items: center; gap: 3.5rem;}
  .wrap-footer .wrap-footer-top{min-width:0; padding-bottom: 4rem; flex-direction: column; justify-content: center;}
  .wrap-footer .footer-top-right{top:unset; bottom:unset; right:unset; margin:0; margin-top: 2.5rem; width:100%;}
  .wrap-footer .footer-top-right button {width:100%;}
  .wrap-footer .footer-info-top{overflow:hidden; gap: 0; flex-direction: column; align-items: center; min-width:0;}
  .wrap-footer .footer-info-top p{font-size: 1.4rem; text-align: center;min-width:0;}
  .wrap-footer .footer-info-top p span{margin: 0 2rem 0 0;}
  .wrap-footer .wrap-footer-bottom{margin-top: 0;}
  .wrap-footer .footer-info-bottom{justify-content: center; gap: 1.5rem;}
  .wrap-footer .footer-info-bottom dt,
  .wrap-footer .footer-info-bottom dd{font-size: 1.4rem;}
  .wrap-footer .wrap-footer-bottom .area{justify-content: center; align-items: center;}
  .wrap-footer .footer-bottom-left ul{gap: 2rem;}
  .wrap-footer .footer-bottom-left li a{font-size: 1.4rem;}
  .wrap-footer .footer-bottom-right{margin-top: 1.7rem;}
  .wrap-footer .footer-bottom-right p{font-size: 1.2rem; text-align: center;}
}

/* 상단으로 이동 */
.btn-top-page {position: fixed; right: 2rem; bottom: -3rem; z-index: 3; opacity: 0; transition: .35s;}
.btn-top-page.fix {bottom: 2rem; opacity: 1;}
.btn-top-page.at-bottom {bottom:24.5rem;}
.btn-top-page button {display: flex; width: 6rem; height: 6rem; background: #fff url('../../images/common/ic-top-page.png') no-repeat center / 2rem auto; border:1px solid #E7E7E7; border-radius: 100%; text-indent: -99999rem;}

@media screen and (max-width:768px) {
  .btn-top-page.at-bottom {bottom:34.5rem;}
}


/* 서브 */

/* 서브비주얼 */
.wrap-sub-visual {position: relative;min-height: 45rem; z-index: 4; padding: 25rem 0 10rem;background-color: #000;background-attachment: fixed;background-position: center top; background-repeat: no-repeat;background-size: cover; animation: scale-sub-vis 3s both;}
.wrap-sub-visual::after {content:''; position: absolute; left:0; top:0; width:100%; height:100%; background:linear-gradient(to top, transparent, rgba(42,44,60,0.7) 100%)}
.wrap-sub-visual.m1 {background-image: url('../../images/common/img-sub-visual1.jpg');}
.wrap-sub-visual.m2 {background-image: url('../../images/common/img-sub-visual2.jpg');}
.wrap-sub-visual.m3 {background-image: url('../../images/common/img-sub-visual3.jpg');}
.wrap-sub-visual.m4 {background-image: url('../../images/common/img-sub-visual4.jpg');}
.wrap-sub-visual.m5 {background-image: url('../../images/common/img-sub-visual5.jpg');}
.wrap-sub-visual.m6 {background-image: url('../../images/common/img-sub-visual1.jpg');}
.wrap-sub-visual.m7 {background-image: url('../../images/common/img-sub-visual2.jpg');}
.wrap-sub-visual.m8 {background-image: url('../../images/common/img-sub-visual3.jpg');}
.wrap-sub-visual::before {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; animation: scale-sub-vis2 3s both;}
@keyframes scale-sub-vis {
  0% {background-size: 120%;}
  100% {background-size: 105%;}
}

@keyframes scale-sub-vis2 {
  0% {opacity: 1;}
  100% {opacity: 0.5;}
}

@media screen and (max-width: 1919px) {
  .wrap-sub-visual {background-size: cover !important; background-attachment: local}
}

@media screen and (max-width: 1400px) {
  .wrap-sub-visual {min-height: 38.5rem; padding: 14.5rem 0;}
}

@media screen and (max-width: 768px) {
  .wrap-sub-visual {min-height: 25rem; padding: 11.5rem 0 6rem 0;}

}
/* 서브 타이틀 */
.wrap-sub-title {position: relative; z-index: 1;}
.loaded .wrap-sub-title h1 {animation:slogan-big .7s both; animation-delay:.4s;}
.wrap-sub-title h1 {display: inline-block; font-weight: 800; font-size: 5rem; line-height: 1; color: #fff; position: relative; opacity:0;}
@keyframes slogan-big {
  0% {filter: blur(10px); opacity:0; transform:  scale(1.2);}
  100% {filter: blur(0px); opacity:1;  transform:  scale(1);}
}

@media screen and (max-width: 1100px) {
  .wrap-sub-title h1 {font-size: 35px;}
}

@media screen and (max-width: 768px) {
  .wrap-sub-title h1 {font-size: 25px; animation:slogan-big 0s both;}
}

/* 서브네비 */
.wrap-sub-util {position: relative; z-index: 1; margin-top: 2rem;}
.wrap-sub-util .area {display: flex; justify-content: space-between; align-items: center;}
.wrap-sub-util .sub-navi .inner {padding: 0;}
.wrap-sub-util .sub-navi > ul {display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 0; font-size: 0;position: relative; opacity:0;}
.loaded .wrap-sub-util .sub-navi > ul {animation:sub-navi .7s both; animation-delay:.6s; }
.wrap-sub-util .sub-navi > ul > li {position: relative; }
.wrap-sub-util .sub-navi > ul > li.home {margin-right: 2rem; padding-right: 2.6rem; background: url('../../images/common/ic-sub-navi-arrow.png') no-repeat right center / 0.8rem auto;}
.wrap-sub-util .sub-navi > ul > li > .inner > button {font-weight: 500; font-size: 1.7rem; color: rgba(255,255,255,1);}
.wrap-sub-util .sub-navi > ul > li.last > .inner > button {color: #fff;}
.wrap-sub-util .sub-navi .home a {display: block; width: 1.7rem; height: 1.7rem; background: url('../../images/common/ic-sub-navi-home.png') no-repeat center / 1.7rem auto; text-indent: -99999rem;}
.wrap-sub-util .sub-navi > strong {width: 15.5rem; flex-shrink: 0; font-family: 'Mont Bold'; font-size: 1.8rem; font-style: italic; color: #005128;}
.wrap-sub-util .sub-navi .navMenu {position: relative; margin-right: 2rem; padding-right: 2.6rem; }
.wrap-sub-util .sub-navi .navMenu::after {content:''; position: absolute; right:0; top:50%; width:1.3rem; height:0.8rem; margin-top:-0.4rem; background: url('../../images/common/ic-sub-navi-arrow2.png') no-repeat right center / 1.3rem auto; transition: transform .3s;}
.wrap-sub-util .sub-navi .navMenu.on::after {transform:rotate(180deg);}

.wrap-sub-util .sub-navi .navUl {visibility: hidden; overflow: hidden; position: absolute; left: 0; top: calc(100% + 2rem); z-index: 50; width: 21rem; max-height: 0; opacity: 0;}
.wrap-sub-util .sub-navi .navUl::-webkit-scrollbar {width: 1.1rem;}
.wrap-sub-util .sub-navi .navUl::-webkit-scrollbar-thumb {background: #c5c5c5; border: 2px solid #fff; border-radius: 1rem;}
.wrap-sub-util .sub-navi .navUl.on {visibility: visible; overflow: hidden; overflow-y: auto; max-height: 23.8rem; padding: 0.9rem 0; background: #fff; border: 1px solid #e1e1e1; border-radius: 0.5rem; opacity: 1;}
.wrap-sub-util .sub-navi .navUl a {position: relative; display: block; padding: 0.8rem 2rem; font-weight: 500; font-size: 1.5rem; line-height: 2rem; color: #666666; word-break: keep-all;}
.wrap-sub-util .sub-navi .navUl a:hover,
.wrap-sub-util .sub-navi .navUl a._active {color: #1174ff;}
.wrap-sub-util .sub-navi .navUl a span {position: relative; display: inline-block; width:100%; padding-right:2rem;}
.wrap-sub-util .sub-navi .navUl a[target=_blank] span::after {content: ''; position: absolute; right:0; top:50%; width: 1.5rem; height: 1.5rem; margin-left: 1rem; margin-top:-0.7rem; background:#666666; mask: url('../../images/common/new-win.png') no-repeat center top / 1.5rem auto; -webkit-mask: url('../../images/common/new-win.png') no-repeat center top / 1.5rem auto;}
.wrap-sub-util .sub-navi .navUl a[target=_blank]:hover span::after  {background-color: #0164ED;background-position: center bottom;}
@keyframes sub-navi {
  0% {filter: blur(1rem); opacity:0; transform:  scale(1.2);}
  100% {filter: blur(0rem); opacity:1;  transform:  scale(1);}
}

@media screen and (max-width: 768px) {
  .wrap-sub-util {margin-top: 1.5rem;}
  .wrap-sub-util .sub-navi > ul { opacity:0 !important;}
  .loaded .wrap-sub-util .sub-navi > ul {animation:none !important; opacity:1 !important; transition:opacity .3s;}
  /* .wrap-sub-util .sub-navi > ul > li {margin-right: 0.9rem; padding-right: 1.7rem;} */
  .wrap-sub-util .sub-navi > ul > li > .inner > button {font-size: 1.6rem;}
  .wrap-sub-util .sub-navi .navUl {top: calc(100% + 0.7rem); width: 17rem;}
  .wrap-sub-util .sub-navi .navUl.on {max-height: 26.8rem;}
  .wrap-sub-util .sub-navi .navUl a {padding: 0.4rem 1rem; font-size: 1.6rem;}
}


/* 서브 유틸 */
.sub-util > ul {display: flex; justify-content: center; align-items: center; position: relative; vertical-align: middle;}
.sub-util > ul > li {position: relative; display: flex; align-items: center; padding-right: 1.5rem; margin-right: 1.3rem;}
.sub-util > ul > li:last-child {padding-right: 0; margin-right: 0;}
.sub-util > ul > li::after {content: ''; position: absolute; right: 0px; top: 1.1rem; width: 1px; height: 2.4rem; background: #b2b2b2;}
.sub-util > ul > li:last-child::after {display: none;}
.sub-util > ul > li > button {width: 4.5rem; height: 4.5rem; border-radius: 15px; text-indent: -99999rem; transition: box-shadow .35s;}
.sub-util > ul > li > button:hover,
.sub-util > ul > li > button.hold,
.sub-util > ul > li > button.on {box-shadow: 0 0 1rem rgba(0,0,0,.2);}

.sub-util .sub-share {background: url('../../images/common/ic-share.png') no-repeat center center / 2.5rem auto;}
.sub-util .sub-favo {background: url('../../images/common/ic-favorite.png') no-repeat center center / 2.5rem auto;}
.sub-util .sub-favo.on, 
.sub-util .sub-favo.hold {background: url('../../images/common/ic-favorite-on.png') no-repeat center center / 2.5rem auto;}

.sub-util .box-sub-favo {opacity: 0; overflow: hidden; position: absolute; right: 0; top: calc(100% + 2.5rem); z-index: 1; width: 25rem; max-height: 0rem; background: #fff; border-radius:1rem; transition: .35s;z-index: 4}
.sub-util .box-sub-favo.on {opacity: 1; max-height: 50rem;}
.sub-util .box-sub-favo > strong {display: block; border: 1px solid #d2d2d2; font-weight: 400; font-size: 1.8rem; padding: 1.6rem 2.5rem; border-bottom: 1px solid #d6d6d6; border-radius:1rem 1rem 0 0; color: #000000;}
.sub-util .box-sub-favo ul {padding: 1.5rem 0; border-left: 1px solid #d2d2d2; border-right: 1px solid #d2d2d2;}
.sub-util .box-sub-favo ul li {display: flex;  position: relative; padding: 0.2rem 2.5rem; transition: all .3s;}
.sub-util .box-sub-favo ul li > a {display: inline-block; font-weight: 400; font-size: 1.5rem; vertical-align: middle; color: #666;}
.sub-util .box-sub-favo ul li strong {position: relative; display: inline-block; font-weight: 400; font-size: 1.5rem; color:#666; transition: color .3s;}
.sub-util .box-sub-favo ul li:hover strong {color:#0e3999;}
.sub-util .box-sub-favo ul li strong::after {content: ''; position:absolute; left:0; bottom:0; width: 0%; height: 1px; background: #0e3999; transition:all .3s;} 
.sub-util .box-sub-favo ul li:hover strong::after {width: 100%;}
.sub-util .box-sub-favo ul li a span {display: none;}
.sub-util .box-sub-favo .close {position: absolute; right: 0px; top: 0px; width: 6rem; height: 6rem; background: url('../../images/common/btn_favo_close.png') no-repeat center center; text-indent: -99999rem;}
.sub-util .box-sub-favo .close:hover {transform: rotate( 180deg ); transition: all 0.75s cubic-bezier(0.7, 0, 0.3, 1);}
.sub-util .box-sub-favo .del {display: inline-block; width: 1.7rem; height: 1.7rem; margin: 0.3rem 1rem 0 0; background: url('../../images/common/favo-del.png') no-repeat center center; text-indent: -99999rem; vertical-align: middle;}
.sub-util .box-sub-favo .control {display: flex;overflow: hidden; font-size: 0; text-align: center;}
.sub-util .box-sub-favo .control::after {content: ''; display: block; clear: both;}
.sub-util .box-sub-favo .control button {display: inline-block; width: 50%; padding: 1.6rem 2rem; font-weight: 400; font-size: 1.6rem; color: #fff;}
.sub-util .box-sub-favo .control button.add {background: #005ead;}
.sub-util .box-sub-favo .control button.reset {background: #003378;}
.sub-util .box-sub-share {opacity: 0; overflow: hidden; position: absolute; left: 0; top: calc(100% + 2.5rem); z-index: 4; max-height: 0rem; transition: .35s}
.sub-util .box-sub-share.on {opacity: 1; max-height: 30rem;}
.sub-util .box-sub-share ul button,
.sub-util .box-sub-share ul a {position: relative; display: block; width: 4.5rem; height: 4.5rem; margin-bottom: 0.5rem; border-radius: 1.5rem; text-indent:-99999rem;}
.sub-util .box-sub-share .fb {background: url('../../images/common/ic-fb.png') no-repeat center center / 4.5rem;}
.sub-util .box-sub-share .tw {background: url('../../images/common/ic-tw.png') no-repeat center center / 4.5rem;}
.sub-util .box-sub-share .pin {background: url('../../images/common/ico_sns_pin.png') no-repeat center center / 4.5rem;}
.sub-util .box-sub-share .insta {background: url('../../images/common/ic-insta.png') no-repeat center center / 4.5rem;}
.sub-util .box-sub-share .kakao {background: url('../../images/common/ic-kakao.png') no-repeat center center / 4.5rem;}
.sub-util .box-sub-share .naver {background: url('../../images/common/ic-blog.png') no-repeat center center / 4.5rem;}
.sub-util .box-sub-share .addr {background: url('../../images/common/ic-copy.png') no-repeat center / 4.5rem;}
.sub-util .box-sub-share .close {background: url('../../images/common/ic-share-close.png') no-repeat center center / 4.5rem;}
.sub-util .box-sub-share .whatsapp {background:#30b545 url('../../images/common/ic-noti-app.png') no-repeat center center / 4.5rem;}
.sub-util .box-sub-share .mail {background:#2c3a4c url('../../images/common/ic-mail.png') no-repeat center center / 4.5rem;}
.sub-util .copy {text-align: center;}
.sub-util .copy button {display: inline-block; width: 3.8rem; height: 3.8rem; margin: 0 auto 0 auto;  text-indent: -99999rem;}
.sub-util .sub-print {background: url('../../images/common/ic-print.png') no-repeat 50% 50% / 2.8rem auto;}
@media screen and (max-width: 768px) {
  .sub-util .box-sub-favo > strong {font-size: 1.4rem;}
  .sub-util .box-sub-favo .control button {font-size: 1.4rem;}
  .sub-util .box-sub-favo ul li > a {font-size: 1.4rem;}
  .sub-util > ul > li{padding-right: 0; margin-right: 0.5rem;}
  .sub-util > ul > li:last-child {display: none;}
  .sub-util > ul > li::after {display: none;}
  .sub-util > ul > li > button {width: 3.5rem; height: 3.5rem; background-size: 2rem !important; border-radius: 1rem;}
  .sub-util .box-sub-share {top: calc(100% + 1.5rem);}
  .sub-util .box-sub-share ul button,
  .sub-util .box-sub-share ul a {width: 3.5rem; height: 3.5rem; border-radius: 1rem;}
  .sub-util .box-sub-favo {top: calc(100% + 1.5rem);}
}


/* 서브 타이틀 */
.wrap-sub-subject {margin-top: 7rem;}
.wrap-sub-subject .sub-area {display: flex; justify-content: space-between; align-items: center;}
.wrap-sub-subject h1 {display: block; font-weight: 700; font-size: 4rem; line-height: 1; color: #222222;}

.page_440 .wrap-sub-subject {display: none;}

@media screen and (max-width: 1100px) {
  .wrap-sub-subject {margin-top: 5rem;}
  .wrap-sub-subject h1 {font-size: 3.5rem;}
}

@media screen and (max-width: 768px) {
  .wrap-sub-subject {margin-top: 4rem;}
  .wrap-sub-subject h1 {font-size: 2.5rem; line-height: 1.2;}
}

/* 서브 컨텐츠 */
.wrap-sub-contents {margin-top: 7rem;}

@media screen and (max-width: 1100px) {
  .wrap-sub-contents {margin-top: 5rem;}
}

@media screen and (max-width: 768px) {
  .wrap-sub-contents {margin-top: 4rem;}
}