@charset "utf-8";

.container {width: 100%; max-width: 1600px; margin: 0 auto;}

@media all and (max-width:1600px) {
	.container {padding:0 20px;}
}

@media all and (max-width:1023px) {
	.container {padding:0 30px;}
}

.wrap-header-box {position: relative; z-index: 200;}
.wrap-top {background: #eeeeee;}
.wrap-top .container {overflow: hidden;}
.wrap-top .btn-go {display: block; float: left; padding: 0 30px; color: #fff; font-size: 14px; height: 35px; line-height: 35px;}
.wrap-top .btn-go.color1 {background: #006276;}
.wrap-top .btn-go.color2 {background: #0f3a43;}
.wrap-top .btn-go.color3 {background: #00a6ac;}
.wrap-top .goto {float: left;}
.wrap-top .gnb {float: right;}
.wrap-top .gnb span {color: rgba(255,255,255,.4); padding: 0 5px;}
.wrap-top .gnb .top-gnb div {display: inline-block; padding-left: 15px; margin-left: 15px; background: url('/Web-home/fnct/globalNavi/gnb-temp/images/dot-gnb.png') no-repeat left center;}
.wrap-top .gnb .top-gnb .gnb-main {background: none;}
.wrap-top .gnb .top-gnb div a {height: 35px; font-family: 'Noto Light'; font-size: 14px; line-height: 35px; color: #000;}

@media all and (max-width: 768px) {
    .wrap-top .goto {display: none;}
}

.wrap-header {background: #ffffff;}
.wrap-header .container {display: table; width: 100%;}
.wrap-header .head-logo,
.wrap-header .head-navi {display: table-cell; vertical-align: middle;}
.wrap-header .head-logo a {position: relative; display: inline-block;}
.wrap-header .head-logo a:after {display:none; content: ''; position: absolute; right: 0; top: 14px; width: 1px; height: 30px; background: #cfcfcf;}
.wrap-header .head-logo img {vertical-align: middle;}
.wrap-header .head-logo span {position: relative; display: inline-block; margin-left: 15px; font-family:'S-CoreDream-5Medium'; font-size: 22px; vertical-align: middle; color: #717171;}

@media all and (max-width: 1600px) {
    .wrap-top .container,
    .wrap-header .container {padding: 0 20px;}
}

@media all and (max-width: 768px) {
    .wrap-header .head-logo span {display: block; margin: 0 0 0 38px; font-size: 18px;}
}

.wrap-header .head-navi {text-align:right;}
.wrap-header .head-navi .menuUItop {display: inline-block; vertical-align: middle;}
.wrap-header .head-navi .li_1 {display:inline-block; position:relative;}
.wrap-header .head-navi .li_1:last-child {display: none;}
.wrap-header .head-navi .li_1.li_1_1833,
.wrap-header .head-navi .li_1.li_1_6465 {display:none;}
.wrap-header .head-navi .a_1 {display:block; padding:33px 34px; font-size: 22px; font-family:'Noto Regular'; color: #000;}
.wrap-header .head-navi .a_1 span {position:relative;}
.wrap-header .head-navi .a_1.on span:after {display: none; content:''; position:absolute; left:50%; top:-12px; width:9px; height:9px; background:#c42605; border-radius:100%; transform:translate(-50%,0)}
.wrap-header .head-navi .a_1.on span:before {content:''; position:absolute; left:0; bottom:-12px; width:100%; height:4px; background:#006276;}
.wrap-header .head-navi .div_2 {overflow:hidden; max-height:0; position:absolute; top:100%; left:0px; width:100%; z-index:100; background:rgba(1,166,172,0.9); text-align:left; transition:all 0.75s cubic-bezier(0.7, 0, 0.3, 1);}
.wrap-header .head-navi .div_2.on {max-height:400px;}
.wrap-header .head-navi .ul_2 {padding:15px 0;}
.wrap-header .head-navi .a_2 {font-family:'Noto Demilight';position:relative; display:block; color:#fff; padding:8px 15px;}
.wrap-header .head-navi .a_2 span {position:relative;}
.wrap-header .head-navi .a_2 span:after {content:''; position:absolute; left:0px; bottom:-3px; width:0px; height:1px; background:#fff; transition:all 0.8s;}
.wrap-header .head-navi .a_2[target=_blank] span:before {content: ''; position: absolute; left: 111%; top: 6px; width: 14px;height: 14px; background: url(../../images/common/ico_blank_pc.png) no-repeat center center;}
.wrap-header .head-navi .a_2:hover:after {content:''; position:absolute; right:10%; top:46%; width:5px; height:7px; background:url('../../images/common/arrow-menu.png') no-repeat center center;}
.wrap-header .head-navi .a_2:hover span:after {width:100%;}
.wrap-header .head-navi .div_3 {display:none;}
.wrap-header .head-navi .sitemap {display: inline-block; vertical-align: middle;}
.wrap-header .head-navi .sitemap a {display: block; width: 45px; height: 40px; text-align: left; background: url('../../images/common/ico-sitemap.png') no-repeat center center; text-indent: -9999px;}
.wrap-header .btn-mgnb {display: none;}
.wrap-header .btn-mgnb-close {display: none;}


@media all and (max-width:1500px) {
	.wrap-header .head-navi .a_1 {padding:32px 20px;}
}

@media all and (max-width:1250px) {
	.wrap-header .head-navi .a_1 {padding: 32px 10px; font-size: 20px;}
}

@media all and (max-width:1100px) {
	.wrap-header .head-navi .a_1 {padding: 32px 7px;}
}

@media all and (max-width:1023px) {
    .wrap-header .head-logo {width: 100%; height: 100px;}
    .wrap-header .head-navi {position:fixed;top: 0;right:-100%;z-index:10000;width: 100%;max-width: 500px;height: 100%;background: #282a2f;opacity: 0;transition: all 0.55s cubic-bezier(0.7, 0, 0.3, 1);}
    .wrap-header .head-navi.on {right: 0;opacity: 1;transition: all 0.55s cubic-bezier(0.7, 0, 0.3, 1);}
    .wrap-header .head-navi .menuUItop {display: block; position: relative;height: 100%;}
    .wrap-header .head-navi .div_1 {padding:20px 0 0 0;}
    .wrap-header .head-navi .li_1 {position: static; display: block; width: 100%; padding:0px;}
    .wrap-header .head-navi .a_1 {background-image: none; background-position: right center; width:40%; height: auto; padding: 15px 0 15px 20px; text-align: left; font-size: 18px; color: #fff;}
    .wrap-header .head-navi .a_1:after {display:none;}
	.wrap-header .head-navi .a_1:hover {color:#fff;}
	.wrap-header .head-navi .a_1.on span:after {display:none;}
    .wrap-header .head-navi .a_1.on span:before {display:none;}
    .wrap-header .head-navi .a_1.on {color:#00a6ac;}
    .wrap-header .head-navi .ul_2 {border: 0; padding:0;}
    .wrap-header .head-navi .li_2 {display:block; border:0px; padding:0px;}
    .wrap-header .head-navi .li_2 .a_2:after {display:none;}
    .wrap-header .head-navi .a_2 {width:100%;padding: 15px 15px 15px 20px;border-bottom: 1px solid #d1d1d1;margin:0;font-size: 18px;color:#666;}
    .wrap-header .head-navi .a_2.plus {position: relative; background:url('../../images/common/arrow_a2.png') no-repeat 90% center}
    .wrap-header .head-navi .a_2.plus.on {background:url('../../images/common/arrow_a2_hover.png') no-repeat 90% center; border-bottom:1px solid #fff;}
    .wrap-header .head-navi .a_2._active {color: #00a6ac;}
 	.wrap-header .head-navi .a_2[target=_blank] span:before {top:6px;}
    .wrap-header .head-navi .div_2 {width:60% !important; right:0px; left:auto; transition-property:none; }
    .wrap-header .head-navi .div_2.on {top:20px; max-height:none; height:100%; background:#fff; transition-property: none;}
    .wrap-header .head-navi .div_2 .container {padding: 0px;}
    .wrap-header .head-navi .ul_3 {padding:0 0 20px 0; border-bottom: 1px solid #d1d1d1;}
    .wrap-header .head-navi .li_3 {position:relative; margin: 0px;}
    .wrap-header .head-navi .a_3 {color:#999; display:inline-block; padding:4px 0 4px 40px; font-size:14px;}
    .wrap-header .head-navi .a_3[target=_blank] {position:relative;}
    .wrap-header .head-navi .a_3[target=_blank]:before {content:''; position:absolute; left:110%; top:10px; width:10px; height:10px; background:url('../../images/common/ico_blank.png') no-repeat center center;}
    .wrap-header .head-navi .a_3:after {content:''; position:absolute; left:25px; top:13px; width:6px; height:2px; background:#808080;}
    .wrap-header .head-navi .a_3._active:after,
    .wrap-header .head-navi .a_3:hover:after {width:6px; background:#00a6ac;}
    .wrap-header .head-navi .a_3:hover {color:#00a6ac;}
    .wrap-header .head-navi .a_3._active {color:#00a6ac;}
    .wrap-header .head-navi .div_3 {display:block; overflow:hidden; max-height:0px; transition:all 0.25s cubic-bezier(0.7, 0, 0.3, 1);}
    .wrap-header .head-navi .div_3.on {max-height: 500px; transition: all 0.25s cubic-bezier(0.7, 0, 0.3, 1);}
    .wrap-header .head-navi .title {display:none;}
    .wrap-header .head-navi .close {display:none;}
    .wrap-header .head-util {width:100px;}
    .wrap-header .head-util .btn-share {display:none;}
    .wrap-header .container > div.black-bg {display:none; position:fixed; width:100%; height:100%; left:0px; top:0px; background:rgba(0,0,0,0.6); z-index:1200;}
    .wrap-header .container > div.black-bg.on {display:block;}
    .wrap-header .btn-mgnb {position: absolute; right: 0; display: block; background: #006276 url(../../images/common/ic-head-util1.png) no-repeat center center; width: 100px; height: 100px;}
    .wrap-header .btn-mgnb button {display: block; width: 100%; height: 100%; text-indent: -99999px;}
    .wrap-header .btn-mgnb-close.on {display:block; position:absolute; right:100%; top:0;  width:45px; height:45px; background:url('../../images/common/ic-navi-close.png') no-repeat center center;}
	.wrap-header .btn-mgnb-close button {text-indent:-9999px; display:block; width:100%; height:100%;}
}

@media all and (max-width:767px) {
	.container {padding: 0 20px;}
	.wrap-header .head-navi {max-width: calc(100% - 50px);}
	.wrap-header .head-navi.on {right:0;}
}