@charset "utf-8";

html,body{height:100%;}

/* animation */
.ani{opacity:0;}
.animate .ani{animation:animate_opacity 1.2s forwards;}
.ani-top{opacity:0;transform:translateY(120px);}
.ani-top2{opacity:0;transform:translateY(120px);}
.ani-bottom{opacity:0;transform:translateY(-120px);}
.ani-left{opacity:0;transform:translateX(120px);}
.ani-right{opacity:0;transform:translateX(-120px);}
.ani-show{opacity:0;animation:animate_opacity 0.1s forwards;}
.ani-zoom{opacity:0;}
.animate .ani-zoom{animation:animate_zoom 1.2s forwards;}
.animate .ani-top,.animate .ani-bottom,.animate .ani-left,.animate .ani-right{animation:animate_TBLR 1.2s forwards;}
.animate .ani-top2{animation:animate_TBLR 2.4s forwards;}
.ani-height{opacity:0;height:0;}
.animate .ani-height{animation:animate_height 1.0s forwards;animation-delay:0.8s;}

@keyframes animate_height{
	0%{height:0;}
	100%{height:100%;}
}
@keyframes animate_opacity{
	0%{}
	100%{opacity:1;}
}
@keyframes animate_TBLR{
	0%{}
	100%{opacity:1;transform:translate(0,0);}
}
@keyframes animate_scale{
	0%{transform:scale(1.15);opacity:0;}
	100%{transform:scale(1);opacity:1;}
}
@keyframes animate_zoom{
	0%{transform:scale(0.5);}
	100%{transform:scale(1);opacity:1;}
}

@keyframes rotate_ico{ 100% { transform:rotate(360deg);} }

@keyframes bounce {
	0% {transform:translateY(0px);}
	50% {transform:translateY(-2.5rem);}
	100% {transform:translateY(0);}
}
@-webkit-keyframes bounce {
	0% {transform:translateY(0px);}
	50% {transform:translateY(-2.5rem);}
	100% {transform:translateY(0);}
}

.animate .delay1{animation-delay:.1s;}
.animate .delay2{animation-delay:.2s;}
.animate .delay3{animation-delay:.3s;}
.animate .delay4{animation-delay:.4s;}
.animate .delay5{animation-delay:.5s;}
.animate .delay6{animation-delay:.6s;}
.animate .delay7{animation-delay:.7s;}
.animate .delay8{animation-delay:.8s;}
.animate .delay9{animation-delay:.9s;}
.animate .delay10{animation-delay:1s;}
.animate .delay11{animation-delay:1.1s;}
.animate .delay12{animation-delay:1.2s;}
.animate .delay13{animation-delay:1.3s;}
.animate .delay14{animation-delay:1.4s;}
.animate .delay15{animation-delay:1.5s;}
.animate .delay16{animation-delay:1.6s;}
.animate .delay17{animation-delay:1.7s;}
.animate .delay18{animation-delay:1.8s;}
.animate .delay19{animation-delay:1.9s;}
.animate .delay20{animation-delay:2s;}
.animate .delay21{animation-delay:2.1s;}
.animate .delay22{animation-delay:2.2s;}

body{width:100%;overflow-x:hidden;}
body #wrap ::-webkit-scrollbar{width:10px;height:10px}
body #wrap ::-webkit-scrollbar-track{background-color:transparent;border-radius:10px}
body #wrap ::-webkit-scrollbar-thumb{background-color:#d8d8d8;border-radius:10px;background-clip:padding-box;border:3px solid transparent}
/* .fixed{overflow:hidden} */
/* .fixed #wrap{position:fixed;width:100%;overflow:hidden} */
.dim{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:498}
.view_pc{}
.view_mo{display:none !important;}

br.pc{}
br.mo{display:none;}
@media all and (max-width:1200px){
	.fixed{overflow:hidden}
	.fixed #wrap{position:fixed;width:100%;overflow:hidden}
}
@media all and (max-width:720px){
	.view_pc{display:none !important;}
	.view_mo{display:block !important;}
	br.pc{display:none !important;}
	br.mo{display:block !important;}
}

.inner{position:relative;margin:0 auto;}
.inner::after{display:block;clear:both;content:''}

#header > .inner,#footer > .inner{width:1320px;}

@media all and (max-width:1400px){
	#header > .inner,#footer > .inner{width:100%;}
}

#header{position:absolute;top:0;left:0;z-index:10;width:100%;height:8rem;padding:0 20rem;}
#header::after{display:block;clear:both;content:'';position:absolute;top:8rem;left:0;width:100%;height:1px;background:#fff;opacity:0.3;}
#header > .inner{width:100%;height:100%;}
#header.on::after{height:26.2rem;opacity:0.8;}

.header_logo{position:absolute;top:2.1rem;left:0;}
.header_logo a{display:block;width:10rem;height:4.8rem;margin:0 auto;background:url(../images/common/header_logo@2x.png) no-repeat 0 0 / 100% auto;text-indent:-9999px;font-size:0;}

.header_lang{position:absolute;top:3rem;right:0;vertical-align:top;z-index:2;}
.header_lang button{display:block;width:8rem;height:4rem;background:transparent linear-gradient(90deg, #0E4688 0%, #165AA9 100%) 0% 0% no-repeat;border:0 none;border-radius:5px;font-size:1.8rem;letter-spacing:-0.36px;color:#fff;}
.header_lang ul{display:none;position:absolute;top:4.1rem;left:0;width:100%;padding:1rem 0;background:#fff;box-shadow:0px 6px 8px #0000001A;border:1px solid #E0E0E0;border-radius:5px;}
.header_lang ul li + li{margin-top:1rem;}
.header_lang ul a{display:block;font-size:1.8rem;line-height:2.5rem;letter-spacing:-0.36px;color:#545454;text-align:center;}

.header_sns{position:absolute;top:50%;right:0;margin-top:-1.2rem;}
.header_sns li{float:left; position: relative;}
.header_sns li + li{margin-left:1.1rem;}
.header_sns li a{display:block;height:3rem;background-repeat:no-repeat;background-position:50% 50%;background-size:100%;text-indent:-9999px;font-size:0;overflow: hidden; z-index: -1; position: relative; z-index: 1}

.header_sns li.sns1 a{width:3rem;background-image:url(../images/common/header_ico1.png);}
.header_sns li.sns2 a{width:3rem;background-image:url(../images/common/header_ico2.png);}
.header_sns li.sns3 a{width:3rem;background-image:url(../images/common/header_ico3.png);}
.header_sns li.sns4 a{width:3rem;background-image:url(../images/common/header_ico4.png);}
.header_sns li.sns5 a{width:3rem;background-image:url(../images/common/header_ico5.png);}
.header_sns li.sns6 a{width:3rem;background-image:url(../images/common/header_ico6.png);}
.header_sns li.sns7 a{width:3rem;background-image:url(../images/common/header_ico7.png);}
.header_sns li.sns8 a{width:3rem;background-image:url(../images/common/header_ico8.png);}

.header_btn{display:none;position:absolute;top:1.8rem;left:0;width:4.4rem;height:4.4rem;border:0 none;background-color:transparent;cursor:pointer;text-indent:-9999px;font-size:0;z-index:2}
.header_btn.open{background:url(../images/common/header_btn_open.png) no-repeat 50% 50% / 100% 100%;}
.header_btn.close{top:2.8rem;left:3rem;background:url(../images/common/header_btn_close.png) no-repeat 50% 50% / 100% 100%;}

.header_nav{max-width:92rem;margin:0 auto;font-size:0;margin-right: 25%;}

.scr-down #header {position: fixed; background: #fff}
.scr-down .header_logo a {background:url(../images/common/header_logo_active@2x.png) no-repeat 0 0 / 100% auto;}
.scr-down #gnb > li > a span {color: #212121;}
.scr-down #gnb > li > a em {color: #212121;}

.scr-down .header_btn.open {background:url(../images/common/header_btn_open_on.png) no-repeat 50% 50% / 100% 80%;}

@media all and (max-width:1680px){
	#header{padding:0 3%;}
}
@media all and (max-width:1400px){
	#header{padding:0 3rem;}
	.header_nav{max-width:100%;padding-left:20rem;padding-right:25rem;}
}
@media all and (max-width:1200px){
	.header_nav{padding-left:17rem;padding-right:22rem;}
}
@media all and (max-width:960px){
	.header_nav{display:none;}
	.header_sns{display:none;}
	.header_logo{position:relative;top:auto;left:auto;padding:2.1rem 0 0;}
	.header_logo a{}
	.header_btn{display:block;}
}
/*


@media all and (max-width:1400px){
	#header{padding:0 3rem}
	.header_logo{top:2.4rem;}
	.header_logo a{width:27.8rem;height:5.2rem;}
}

@media all and (max-width:960px){
	.header_logo{position:relative;top:auto;left:auto;padding-top:2rem;}
	.header_logo a{width:32.1rem;height:6rem;margin:0 auto;}
	.header_lang button{font-size:2rem;letter-spacing:-0.4px;}
	.header_btn{display:block;}
}
*/


#gnb{padding:0;}
#gnb::after{display:block;clear:both;content:'';}
#gnb > li{position:relative;float:left;width:25%;overflow:visible;}
#gnb > li > a{position:relative;display:flex;justify-content:center;align-items:center;height:8rem;padding:0;text-align:center;font-size:2rem;letter-spacing:-0.4px;color:#545454;}
#gnb > li > a em{font-size:1.8rem;font-weight:700;letter-spacing: -0.36px;color: #fff;display:none;}
#gnb > li > a span{font-family:'Play';font-size:1.8rem;font-weight:700;color:#fff;display:inline-block;}
#gnb > li.on > a em,#gnb > li > a:hover em,#gnb > li > a:focus em{display:inline-block;}
#gnb > li.on > a span,#gnb > li > a:hover span,#gnb > li > a:focus span{display:none}


#gnb > li.on > a::after,#gnb > li > a:hover span::after,#gnb > li > a:focus span::after{display:block;}
#gnb > li > a::after{display:none;clear:both;content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:#DC000C;}
#gnb > li .depth_wrap{display:none;position:absolute;left:0;top:8rem;width:100%;padding-top:2rem;z-index:10;}

#gnb > li .depth_title{margin-bottom:2rem;}
#gnb > li .depth_title span{display:block;margin-bottom:0.5rem;font-family:'Play';font-size:2.5rem;font-weight:700;color: #212121;line-height:2.9rem;}
#gnb > li .depth_title em{font-size:1.8rem;font-weight:700;letter-spacing: -0.36px;color: #003E55;}

#gnb > li .depth2{}
#gnb > li .depth2 > li{position:relative;width:100%;}
#gnb > li .depth2 a{display:block;font-size:1.6rem;letter-spacing: -0.32px;color: #666666;line-height:3rem;}
/* #gnb > li .depth2 > li.on > a,#gnb > li .depth2 > li a:hover,#gnb > li .depth2 > li a:focus{color:#212121;} */
#gnb > li.on .depth_wrap{display:block;}

/* Mobile Menu */
#mobileMenu{display:none;position:fixed;top:0px;right:0;width:100%;min-width:320px;height:100%;z-index:500;background:#fff;}
.mobile_head{height:10rem;padding:2rem 3rem;border-bottom:1px solid #e2e2e2;}
.mobile_head .mobile_logo{}
.mobile_head .mobile_logo a{display:block;width:12.6rem;height:6.6rem;margin:0 auto;background:url(../images/common/mobile_logo.png) no-repeat 0 0 / 100% auto;text-indent:-9999px;font-size:0;}
.mobile_head .header_lang{right:3rem;}

.fixed #mobileMenu{}
#mobileMenu > .inner{position:relative;overflow-y:auto;width:100%;height:calc(100% - 10rem - 11rem);padding:0;background-color:#fff;-webkit-overflow-scrolling:touch}
.mnb{position:relative;}
.mnb > li > a{position:relative;display:block;padding:3.4rem 3rem;font-weight:700;font-size:2.8rem;letter-spacing: 0px;color: #212121l;line-height:3.2rem;}
.mnb > li > a:hover{color:#003E55}
.mnb > li > a.active{color:#003E55}
.mnb > li > a em{display:none;}
.mnb > li > a span{display:block;font-family:'Play';}
.mnb > li > a.active em{display:block;}
.mnb > li > a.active span{display:none;}

.mnb > li.parent > a::after{display:block;clear:both;content:'';position:absolute;top:50%;right:2.6rem;width:3rem;height:2.3rem;margin-top:-1.1rem;transition:all .3s;background:url(../images/common/mnb_arrow_off.png) no-repeat 50% 50% / 100% auto;}
.mnb > li.parent > a.active::after{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg);background-image:url(../images/common/mnb_arrow_on.png);}

.mnb .depth2{display:none;padding:5rem 3rem;background:#F8F8F8;}
.mnb .depth2 li{}
.mnb .depth2 li + li{margin-top:3rem;}
.mnb .depth2 li a{position:relative;display:block;font-size:2.4rem;line-height:3rem;letter-spacing: -0.48px;color: #333333;}

.mobile_sns{position:fixed;bottom:5rem;left:3rem;z-index:1;}
.mobile_sns li{float:left;}
.mobile_sns li + li{margin-left:1rem;}
.mobile_sns li a{display:block;width:4rem;height:4rem;background-repeat:no-repeat;background-position:50% 50%;background-size:100% auto;text-indent:-9999px;font-size:0;}
.mobile_sns li.sns1 a{background-image:url(../images/common/mobile_ico1.png);}
.mobile_sns li.sns2 a{background-image:url(../images/common/mobile_ico2.png);}
.mobile_sns li.sns3 a{background-image:url(../images/common/mobile_ico3.png);}
.mobile_sns li.sns4 a{background-image:url(../images/common/mobile_ico4.png);}
.mobile_sns li.sns5 a{background-image:url(../images/common/mobile_ico5.png);}
.mobile_sns li.sns6 a{background-image:url(../images/common/mobile_ico6.png);}
.mobile_sns li.sns7 a{background-image:url(../images/common/mobile_ico7.png);}
.mobile_sns li.sns8 a{background-image:url(../images/common/mobile_ico8.png);}

/* .mobile_sns li.sns1 a:hover{background-image:url(../images/common/mobile_ico1_on.png);}
.mobile_sns li.sns2 a:hover{background-image:url(../images/common/mobile_ico2_on.png);}
.mobile_sns li.sns3 a:hover{background-image:url(../images/common/mobile_ico3_on.png);}
.mobile_sns li.sns4 a:hover{background-image:url(../images/common/mobile_ico4_on.png);} */



#footer{position:relative;padding:8.6rem 0;background-color:#293946}
.footer_info{margin:0 auto;padding:0 2rem;text-align:center;}

.ft_mobile_sns {display: flex; justify-content: center; margin-bottom: 4rem;}
.ft_mobile_sns li{}
.ft_mobile_sns li + li{margin-left:2rem;}
.ft_mobile_sns li a{display:block;width:4rem;height:4rem;background-repeat:no-repeat;background-position:50% 50%;background-size:100% auto;text-indent:-9999px;font-size:0;}
.ft_mobile_sns li.sns1 a{background-image:url(../images/common/mobile_ico1.png);}
.ft_mobile_sns li.sns2 a{background-image:url(../images/common/mobile_ico2.png);}
.ft_mobile_sns li.sns3 a{background-image:url(../images/common/mobile_ico3.png);}
.ft_mobile_sns li.sns4 a{background-image:url(../images/common/mobile_ico4.png);}
.ft_mobile_sns li.sns5 a{background-image:url(../images/common/mobile_ico5.png);}
.ft_mobile_sns li.sns6 a{background-image:url(../images/common/mobile_ico6.png);}
.ft_mobile_sns li.sns7 a{background-image:url(../images/common/mobile_ico7.png);}
.ft_mobile_sns li.sns8 a{background-image:url(../images/common/mobile_ico8.png);}

@media all and (max-width:1400px){
	#footer{padding:8.6rem 3rem;}
}
@media screen and (max-width:720px){
	#footer{padding:5rem 3rem;}
}
