@charset "utf-8";
.wrap-header-box {z-index: 1030 !important;}
.wrap-header {position: relative; z-index: 1030;}
/* 서브비주얼 */
.wrap-sub-visual {position:relative; background:url('../../images/common/sub-visual.jpg') no-repeat top center; background-size:cover; display:table; width:100%;}
.wrap-sub-visual:after {content:''; position:absolute; left:0px; top:0px; width:100%; height:100%; background:url('../../images/common/pattern.png');}
.wrap-sub-visual .wrap-sub-cell {display:table-cell; height:310px; text-align:center; vertical-align: middle; color:#fff;}
.wrap-sub-visual .container {position:relative; z-index:1;}
.wrap-sub-visual .slogan-big {font-family:'Noto Regular';position:relative; display:inline-block; font-size:40px; line-height:1.2;}
.wrap-sub-visual .slogan-small {font-size:18px; font-family:'Noto DemiLight';}
.wrap-sub-visual .page-move {position:absolute; left:0px; top:30px; width:100%; height:0px;}
.wrap-sub-visual .page-move a {position:relative; display:block; width:70px; height:70px; border:1px solid rgba(255,255,255,0.5); border-radius:100%;}
.wrap-sub-visual .page-move a.prev {float:left; background:url('../../images/common/ico_prev_menu.png') no-repeat left center; transition:background-position 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-visual .page-move a:hover.prev {background-position:right center; transition:background-position 0.5s cubic-bezier(0.7, 0, 0.3, 1); }
.wrap-sub-visual .page-move a.next {float:right; background:url('../../images/common/ico_next_menu.png') no-repeat right center; transition:background-position 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-visual .page-move a:hover.next {background-position:left center; transition:background-position 0.5s cubic-bezier(0.7, 0, 0.3, 1); }
.wrap-sub-visual .page-move a span {position:absolute;}
.wrap-sub-visual .page-move a.prev span {position:absolute; left:90%; top:50%; opacity:0; margin:0 0 0 30px; white-space:nowrap; color:rgba(255,255,255,0.5); transform: translate(0,-50%); transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1); }
.wrap-sub-visual .page-move a:hover.prev span {opacity:1; left:100%; transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1); }
.wrap-sub-visual .page-move a.prev span:after {content:''; position:absolute; left:0px; bottom:-5px; width:0%; height:1px; background:rgba(255,255,255,0.5);  transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-visual .page-move a:hover.prev span:after {width:100%; transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1); }
.wrap-sub-visual .page-move a.next span {position:absolute; right:90%; top:50%; opacity:0; margin:0 30px 0 0; white-space:nowrap; color:rgba(255,255,255,0.5); transform: translate(0,-50%); transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1); }
.wrap-sub-visual .page-move a:hover.next span {opacity:1; right:100%; transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1); }
.wrap-sub-visual .page-move a.next span:after {content:''; position:absolute; right:0px; bottom:-5px; width:0%; height:1px; background:rgba(255,255,255,0.5);  transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-visual .page-move a:hover.next span:after {width:100%; transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1); }

@media all and (max-width:1023px) {
    .wrap-sub-visual .wrap-sub-cell {height:230px;}
}

@media all and (max-width:768px) {
    .wrap-sub-visual .wrap-sub-cell {height:190px;}
    .wrap-sub-visual .slogan-big {font-size:34px; padding:0px; margin:0px;}
    .wrap-sub-visual .slogan-big:after {display:none;}
    .wrap-sub-visual .slogan-small {display:none;}
}

/* 서브네비 */
.wrap-sub-navi {position:relative; z-index: 1020; background:#fff;}
.wrap-sub-navi .container {position:relative; max-width:1400px; height:70px; border-bottom: 1px solid #d8d8d8;}
.wrap-sub-navi .sub-navi > ul > li {position:relative; float:left; background:url('../../images/common/arrow-page-nav.png') no-repeat left center; padding: 0 0 0 30px;}
.wrap-sub-navi .sub-navi > ul > li > a, .wrap-sub-navi .sub-navi > ul > li > .inner > button {display:block; color:#282727; font-size:18px; height:70px; line-height:70px;}
.wrap-sub-navi .sub-navi > ul > li > .inner > button {font-family:'Noto Light'; width:100%; text-align:left; padding:0 70px 0 0 ; background:url('../../images/common/arrow-page-nav2.png') no-repeat top right; transition:background-position 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-navi > ul > li > .inner > button:hover {background-position: bottom right; font-family: 'Noto Regular'; color:#006276; transition:background-position 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-navi .home {background-image:none; padding:0px; min-width:auto;}
.wrap-sub-navi .sub-navi .home a {width:46px; text-indent:-9999px; background:url('../../images/common/ico_home.png') no-repeat left center;}
.wrap-sub-navi .sub-navi .navUl {overflow:hidden; max-height:0px; opacity:0; position:absolute; left: 30px; top:100%; z-index: 20; width: 180px; border:1px solid #fff;}
.wrap-sub-navi .sub-navi .navUl.on {overflow:hidden; max-height:10000px; opacity:1; background:#fff; border:1px solid #3e454c; transition: max-height 1s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-navi .navUl:after {content:''; position:absolute; left:0px; top:0px; width:100%; height:4px; background:#006276;}
.wrap-sub-navi .sub-navi .navUl a {display:block; padding:10px 15px; color:#333; word-break: keep-all;}
.wrap-sub-navi .sub-navi .navUl a:hover {background:#f5f5f5;}

@media all and (max-width: 1400px) {
    .wrap-sub-navi .container {padding: 0 20px;}
}

@media all and (max-width: 768px) {
    .wrap-sub-navi .sub-navi > ul > li {display: none;}
    .wrap-sub-navi .sub-navi .home,
    .wrap-sub-navi .sub-navi > ul > li.is {display: block; }
    .wrap-sub-navi .sub-navi > ul > li.is {width: calc(100% - 50px);}
    .wrap-sub-navi .sub-navi .is .navUl {left: 0; width: 100%;}
}

.wrap-sub-navi .sub-util {position:absolute; right:0px; top:0px;}
.wrap-sub-navi .sub-util > ul > li {float:left; position:relative;}
.wrap-sub-navi .sub-util > ul > li > button {width:70px; height:70px; text-indent:-9999px;}
.wrap-sub-navi .sub-util .sub-print {background: #00a6ac url('../../images/common/ico_print.png') no-repeat center center; transition:background-color 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-util .sub-favo {background: #006cc7 url('../../images/common/ico_favo.png') no-repeat center center; transition:background-color 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-util .sub-favo.on {background: #006cc7 url('../../images/common/ico_favo_ov.png') no-repeat center center;}
.wrap-sub-navi .sub-util .sub-share {background: #073862 url('../../images/common/ico_sns.png') no-repeat center center; transition:background-color 0.5s cubic-bezier(0.7, 0, 0.3, 1);}

.wrap-sub-navi .sub-util .box-sub-favo {opacity: 0; overflow: hidden; max-height: 0px; position: absolute; right: -70px; top: 100%; width: 210px; background:#fff; border: 1px solid #3e454c; transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-util .box-sub-favo.on {opacity:1; max-height:1000px; transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-util .box-sub-favo  > strong {display:block; font-family:'Noto Medium'; font-size:18px; padding:10px 20px; border-bottom:1px solid #d6d6d6;}
.wrap-sub-navi .sub-util .box-sub-favo ul li {padding:10px 20px;}
.wrap-sub-navi .sub-util .box-sub-favo ul li:hover {background:#f5f5f5;}
.wrap-sub-navi .sub-util .box-sub-favo ul li a span {display:none;}
.wrap-sub-navi .sub-util .box-sub-favo .close {text-indent:-9999px; position:absolute; right:0px; top:0px; width:47px; height:47px; background:url('../../images/common/btn_favo_close.png') no-repeat center center;}
.wrap-sub-navi .sub-util .box-sub-favo .close:hover {transform: rotate( 180deg ); transition: all 0.75s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-util .box-sub-favo .del {width:17px; height:17px; margin:0 0 0 10px; background:url('../../images/common/btn-favo-del.png') no-repeat center center; text-indent:-9999px;}
.wrap-sub-navi .sub-util .box-sub-favo .control {text-align:center; padding:15px 0;}
.wrap-sub-navi .sub-util .box-sub-favo .control button {display:inline-block; display:inline-block; padding:5px 20px; color: #FFF;font-size: 12px; border-radius: 40px;}
.wrap-sub-navi .sub-util .box-sub-favo .control button.add {background: #0067c3;}
.wrap-sub-navi .sub-util .box-sub-favo .control button.reset {background: #707070;}
.wrap-sub-navi .sub-util .box-sub-share {opacity:0; overflow:hidden; max-height:0px; position:absolute; left:0px; top:0; width:100%;  transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-util .box-sub-share.on {opacity:1; max-height:1000px; transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1); transition:all 0.5s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-sub-navi .sub-util .box-sub-share .close {width:100%; height: 70px; text-indent: -9999px; background: #183d92 url('../../images/common/btn_share_close.png') no-repeat center center; box-shadow: inset 11px 0px 17px -10px rgba(0,0,0,0.4)}
.wrap-sub-navi .sub-util .box-sub-share ul {border:1px solid #3e454c; background:#fff; padding:5px 0;}
.wrap-sub-navi .sub-util .box-sub-share ul button {position:relative; display:block; width:100%; height:50px; text-indent:-9999px;}
.wrap-sub-navi .sub-util .box-sub-share ul button:after {content:''; position:absolute; bottom:0px; left:50%; width:30px; height:1px; background:#e5e5e5; transform: translate(-50%,0);}
.wrap-sub-navi .sub-util .box-sub-share ul li:last-child button:after {display:none;}
.wrap-sub-navi .sub-util .box-sub-share .fb {background: url('../../images/common/ico_sns_fb.png') no-repeat center center;}
.wrap-sub-navi .sub-util .box-sub-share .tw {background: url('../../images/common/ico_sns_tw.png') no-repeat center center;}
.wrap-sub-navi .sub-util .box-sub-share .pin {background: url('../../images/common/ico_sns_pin.png') no-repeat center center;}
.wrap-sub-navi .sub-util .box-sub-share .insta {background: url('../../images/common/ico_sns_insta.png') no-repeat center center;}
.wrap-sub-navi .sub-util .box-sub-share .kakao {background: url('../../images/common/ico_sns_kakao.png') no-repeat center center;}
.wrap-sub-navi .sub-util .box-sub-share .naver {background: url('../../images/common/ico_sns_naver.png') no-repeat center center;}
.wrap-sub-navi .sub-util .box-sub-share .addr {background: url('../../images/common/ico_sns_addr.png') no-repeat center center;}

@media all and (max-width: 1023px) {
    .wrap-sub-navi .sub-util {display: none;}
}

/* 푸터 */
.main .wrap-footer {margin:0px;}
.wrap-footer {background: #343539; margin-top: 100px; }
.wrap-footer .footer-bottom  {position: relative; font-size: 0px; border-bottom: 1px solid #494a4d;}
.wrap-footer .footer-bottom .footer-link ul {display: inline-block; width: 100%; padding: 16px 0;}
.wrap-footer .footer-bottom .footer-link li {float: left; margin-right: 20px; padding: 4px 20px 4px 0; background: url('../../images/common/dot-footer-bottom.png') no-repeat right center;}
.wrap-footer .footer-bottom .footer-link li:last-child {background: none;}
.wrap-footer .footer-bottom .footer-link li a {position: relative; font-family: 'Noto Light'; font-size: 16px; color: #fff;}
.wrap-footer .footer-bottom .footer-link li a:after {content: ''; position: absolute; left: 0; bottom: -3px; width: 0; height: 1px; background: rgba(255,255,255,.5); transition: 0s;}
.wrap-footer .footer-bottom .footer-link li a:hover:after {width: 100%; transition: 0.4s;}
.wrap-footer .footer-bottom .footer-link li a.private {color: #00afd3;}
.wrap-footer .footer-bottom .footer-link li a.private:after {background: #00afd3;}
.wrap-footer .footer-bottom {display: table; width: 100%;}
.wrap-footer .footer-link,
.wrap-footer .footer-jump {display: table-cell; vertical-align: middle;}

.wrap-footer .footer-contact-box {position: relative;}
.wrap-footer .footer-contact {display: table; width: 100%;}
.wrap-footer .footer-logo,
.wrap-footer .footer-info,
.wrap-footer .footer-jump {display: table-cell; vertical-align: middle;}
.wrap-footer .footer-logo {width: 220px;}
.wrap-footer .footer-info {padding: 36px 0 36px 0; font-family: 'Noto Light'; font-size: 16px; }
.wrap-footer .footer-info .footer-address {color: #ccc;}
.wrap-footer .footer-info .footer-copyright {color: #8c8b8b;}
.wrap-footer .footer-sns {display: none; position: absolute; right: 0px; top: 12px;}
.wrap-footer .footer-sns li {display: inline-block; margin: 0 0 0 8px;}
.wrap-footer .footer-sns li a {display: block; width: 39px; height: 40px; background: url('../../images/common/ico-footer-sns.png') no-repeat; text-indent: -99999px;}
.wrap-footer .footer-sns li.sns-list1 a {background-position: 0 0;}
.wrap-footer .footer-sns li.sns-list2 a {background-position: -40px 0;}
.wrap-footer .footer-sns li.sns-list3 a {background-position: -80px 0;}
.wrap-footer .footer-sns li.sns-list4 a {background-position: -120px 0;}

.wrap-footer .footer-jump {display: none !important; width: 340px; padding-left: 5px;}
.wrap-footer .footer-jump > div {position:relative;}
.wrap-footer .footer-jump .default-jump {float:left; width: 80%; height:45px; padding:0 20px; background:#fff url('../../images/common/arrow-jump-open.png') no-repeat right center; border: 1px solid #474d57; line-height:45px; text-align:left; font-family: 'Noto DemiLight'; font-size: 14px; color:#666;}
.wrap-footer .footer-jump .go-btn {float:left; width:20%; height:45px; background:#606060 url('../../images/common/arrow-jump.png') no-repeat center center; text-indent: -9999px; transition: .4s}
.wrap-footer .footer-jump .go-btn:hover {background-color: #1e4691;}
.wrap-footer .footer-jump .jump-menu-list {overflow:hidden; max-height:0px; position:absolute; bottom: -1px; left: 1px; width: 79.5%; transition: max-height 0.8s ease;}
.wrap-footer .footer-jump .jump-menu-list.on {max-height: 500px; transition: max-height 0.8s ease;}
.wrap-footer .footer-jump .jump-menu-list ul {background:#fff; border:1px solid #d1d1d1; border-bottom:0px;}
.wrap-footer .footer-jump .jump-menu-list a {cursor:pointer; padding:10px 15px; border-bottom:1px solid #d1d1d1; display:block; color:#333; font-size:15px;}

@media all and (max-width: 1600px) {
    .wrap-footer .container {padding: 0 20px;}
}

@media all and (max-width: 1100px) {
    .wrap-footer {padding: 0 0 40px 0;}
    .wrap-footer .footer-contact,
    .wrap-footer .footer-info,
    .wrap-footer .footer-jump {display: block; width: 100%;}
    .wrap-footer .footer-info {padding: 20px 0;}
    .wrap-footer .footer-jump {max-width: 300px;}
    .wrap-footer .footer-sns {display: none;}
}

.top-button {position: fixed; right: 30px; bottom: -120px; z-index: 1; width: 70px; height: 70px; background: #006276 url('../../images/common/btn-go-top.png') no-repeat center center; border-radius: 100%; text-indent: -99999px; box-shadow: 7px 5px 15px -4px rgba(0,0,0,0.49); transition: .75s;}
.top-button.fix {bottom: 30px;}
