@charset 'utf-8';
.transition{-webkit-transition: all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out -o-transition:all 0.3s ease-in-out; transition::all 0.3s ease-in-out;}
.only-m {display:none;}
.only-sm {display:none;}
.only-pc {display:block;}
.viewall {display:none;}

.inner {position: relative; width:100%; max-width: 1680px; margin:0 auto; padding:0 20px;}
.wide {width: 100vw; margin-left: calc(-50vw + 50%);}
.area_rgh {text-align: right;}
.btn_wrap {display: flex; gap:10px;}
.btn_wrap > a {font-size:1em; font-weight: 700; padding:15px 48px; display: inline-block; border-radius: 60px; }
.btn_color {color:#fff; background:#055cff;}
.btn_line {color:#055cff; background:transparent; border:2px solid #055cff;}

/* header */
#header {position:absolute; width:100%; height:124px; transition: all .5s ease;  -webkit-transition: all .5s ease;  -moz-transition: all .5s ease; z-index: 10;}
#header.is-fixed {position:fixed; background:#fff;}
#header .inner {height:100%; margin:0 auto; display: flex; flex-wrap: nowrap; align-items: center;justify-content: space-between;}
#header .logo {flex:0 0 130px;}
#header .logo a {display: block; background:url('../images/common/logo.png') center no-repeat; width:111px; height:46px;}
#header .logo_fix {flex:0 0 10%; max-width:10%; display: none;}
#header #gnb {flex:0 0 50%; max-width: 50%;}
#header .lang_wrap {flex:0 0 130px;}
#header .lang_wrap a {display: flex; align-items: center; justify-content: flex-end;color:#fff; font-size:18px; font-weight: 500;}
#header .lang_wrap a::before {content:''; display: inline-block; width:16px; height:16px; background:url('../images/common/lang_icon.png') center no-repeat; margin-right:11px;}
#header .lang_wrap a::after {content: ''; display: inline-block; width:12px; height:7px; background:url('../images/common/lang_arrow.png') center no-repeat; margin-left:16px; -webkit-transition: all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out -o-transition:all 0.3s ease-in-out; transition::all 0.3s ease-in-out;}
#header .lang_wrap a:hover::after {transform: rotate(-90deg);}

/* header is-fixed */
#header.is-fixed {-webkit-box-shadow: 0px 0px 32px 5px rgba(0,0,0,0.2); box-shadow: 0px 0px 32px 5px rgba(0,0,0,0.2);}
#header.is-fixed .logo a {background:url('../images/common/logo_black.png') center no-repeat;}
#header.is-fixed #gnb .depth1 > li > a {color:#0b0b0b;}
#header.is-fixed #gnb .depth1 > li > a > span:after {background:#0b0b0b; }
#header.is-fixed .lang_wrap a {color:#0b0b0b;}
#header.is-fixed .lang_wrap a::before {background:url('../images/common/lang_icon_black.png') center no-repeat;}
#header.is-fixed .lang_wrap a::after {background:url('../images/common/lang_arrow_black.png') center no-repeat;}

#gnb .depth1 {display: flex; width:100%; flex-wrap: nowrap;justify-content: center}
#gnb .depth1 > li {position: relative; text-align: center; padding:0 25px;}
#gnb .depth1 > li > a {position: relative; color:#fff; font-size:18px; font-weight: 500; background:transparent; backface-visibility: hidden; transform-origin: 50% 50% 0.7em; transition-duration: .45s; transition-property: transform,opacity; transition-timing-function: cubic-bezier(.43,.05,.2,1); cursor: pointer;}
#gnb .depth1 > li > a > span:after {content: '';display: block; width:0; height:1px; position: absolute; left:50%; bottom:-7px; transform: translate(-50%, 0);  background:#fff; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out -o-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; }
#gnb .depth1 > li.on > a > span:after,
#gnb .depth1 > li > a:hover > span:after {width:100%; opacity: 1; visibility: visible;}
#gnb .logo_m {display: none;}
#gnb .close_m {display: none;}

#m_gnb.active,
#m_gnb {opacity: 0; visibility: hidden;}

#header .m_view {display: none; width:30px; height:40px; position: relative; cursor: pointer; margin-right:15px;}
#header .m_view:after, #header .m_view:before, #header .m_view span {position: absolute; top: 50%; left: 34%; width: 40px; height: 2px; background-color: #000;}
#header .m_view:after, #header .m_view:before { content: ""; margin-left: -9px;}
#header .m_view:before {margin-top: -11px;}
#header .m_view:after {margin-top: 10px;}
#header .m_view span {margin: -1px 0 0 -9px; text-indent: -9999px; display: block;}

.main_visual {}
.main_visual .inner {}
.m01 .content-fit {text-align: center;}
.main_visual .swiper-slide {height:100vh;}

.m01 {width:100%; height:100%; color:#fff; background:url('../images/main/m01_bg.jpg') center / cover no-repeat;}
.m01 .m_inner {width:100%; height:100%; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.m01 img {max-width:700px; margin:0 auto;}
.m01 .tit {font-size:1.875em; font-weight: 700; word-wrap: break-word; line-height: 1.161em; display: block; height:84px;}

.m02 {width:100%; height:100%; color:#fff; background:url('../images/main/m02_bg.jpg') center / cover no-repeat;}
.m02 .m_inner {width:100%; height:100%; display: flex; justify-content: center; align-items:  flex-end; flex-direction: column; }
.m02 .tit {text-align: right; font-size:3.5em; font-weight: 700; line-height: 1.161em; margin-bottom:70px;}
.m02 p {text-align: right; font-size:1em; font-weight: 400; line-height: 26px;}

.m03 {width:100%; height:100%; color:#fff; background:url('../images/main/m03_bg.jpg') center / cover no-repeat;}
.m03 .m_inner {width:100%; height:100%; display: flex; justify-content: center; align-items: flex-start; flex-direction: column;}
.m03 .tit {text-align: left; font-size:3.5em; font-weight: 700; line-height: 1.161em;}
.m03 .stit {text-align: left; font-size:1.875em; font-weight: 700; margin:100px 0 40px 0;}
.m03 p {text-align: left; font-size:1em; font-weight: 400; line-height: 26px;}

.m04 {background:#000000;}
.m04 .m_inner {max-width: 1905px; margin:200px 0 100px 0;}
.m04 .m_inner #player {width:100%; height:910px;}

/* index_2에 적용된 swiper css */
.swiper {width: 100%; height: 100%;}
.swiper-slide {display: flex; justify-content: center; align-items: center;}

/* index에 적용된 메인 디자인 */
.main_wrap .m01,
.main_wrap .m02,
.main_wrap .m03,
.main_wrap .m04 {position: relative; height:100vh; background:transparent; padding:0 20px;}
.main_wrap .bg {position: absolute; left:0; bottom:0; width:100%; height:100%; }
.main_wrap .m01 .bg {background:url('../images/main/m01_bg.jpg') center / cover no-repeat;}
.main_wrap .m02 .bg {background:url('../images/main/m02_bg.jpg') center / cover no-repeat;}
.main_wrap .m03 .bg {background:url('../images/main/m03_bg.jpg') center / cover no-repeat;}
.m_inner {max-width: 1680px; margin:0 auto;}

#footer {padding:100px 0 200px 0; background:#000; color:#fff;}
#footer .contain {display: flex; gap:75px;}
#footer .contain .logo {margin-top:19px;}
#footer .contain .copy {position: relative; font-size:1em; line-height: 22px; font-weight: 500;}
#footer .contain .copy span {position: absolute; left:0; margin-top:97px;}
#footer .contain .copy span a {position: relative; display:inline-block; color:#fff;}
#footer .contain .copy span a::before {content: ''; display: inline-block; width:100%; height:1px; position: absolute; left:0; bottom:0; background:#b78def;}
#footer .contain .mail_wrap {position: absolute; right:0; display: flex; align-items: center; gap:10px; margin-top:10px;}
#footer .contain .mail_wrap input {border:1px solid #e0e0e0; font-size:0.75em; color:#000; padding:28px 8px; width:245px;}
#footer .contain .mail_wrap input:placeholder {color:#b9bac8;}
#footer .contain .mail_wrap button {width:138px; height:58px; line-height: 58px; color:#fff; background:#b78def; font-size:0.875em; font-weight: 700; text-align: center;}

/* 서브페이지 - header */
.subPage {background: #fff; color:#000;}
.subPage #header {position: relative; -webkit-box-shadow: 0px 0px 32px 5px rgba(0,0,0,0.2); box-shadow: 0px 0px 32px 5px rgba(0,0,0,0.2);}
.subPage #header .logo a {background:url('../images/common/logo_black.png') center no-repeat;}
.subPage #gnb .depth1 > li > a {color:#0b0b0b;}
.subPage #gnb .depth1 > li > a > span:after {background:#0b0b0b; }
.subPage #header .lang_wrap a {color:#0b0b0b;}
.subPage #header .lang_wrap a::before {background:url('../images/common/lang_icon_black.png') center no-repeat;}
.subPage #header .lang_wrap a::after {background:url('../images/common/lang_arrow_black.png') center no-repeat;}
.sub_wrap {padding:146px 0 140px 0;}

@media screen and (max-width:1024px) {		
	.only-m {display:block;}
	.only-pc {display:none;}	
	.inner {padding:0 20px;}		
	
	#header .logo,
	#header .inner > .lang_wrap {display: none;}
	
	#header #m_gnb .lang_wrap {position: absolute; left:50%; bottom:20px; transform: translate(-50%, 0);}
	#header #m_gnb .gnb_wrap {width:100%; height:100%; text-align: center; margin-top: 150px; line-height: 48px;}
	
	#header .m_view {display: block;}

	#m_gnb {position: fixed; left:0; top:0; width:100%; height:100%; background:#eaeaee; color:#000; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out -o-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; z-index: 999;}
	#m_gnb.active {opacity: 1; visibility: visible;}
	#m_gnb .gnb_wrap a {font-size:1.786em; color:#000;}
	#m_gnb .close_m {display: block; width:21px; height:21px; background:url('../images/common/m_close.png') center no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top:52px; left:32px;}

	#header #gnb {visibility: hidden; position: fixed; left:-100%; top:0; bottom:0; width: 100%; max-width: none; background:#fff; z-index: 9;}
	#header #gnb.active {left:0; visibility: visible; padding:30px 20px; overflow-y: scroll;}
	#header #gnb.active .popup_bg {opacity: 1; visibility: visible; background:#fff;}
	#gnb .depth1 {display: inline-block;}	
	#gnb .depth1 > li {cursor: pointer;padding: 5px 10px;border-bottom:1px solid #f0f0f0; }
	#gnb .depth1 > li > a {display: block; font-weight: 900; color:#000; font-size: 1.625em; padding:6px 10px 13px 10px;}
	#gnb .depth1 > li.active > a::before {content: none;}
	#gnb .depth1 > li .depth2 {position: relative; top:0; width:100% !important; border-radius: 0; left:0 !important; background:none; box-shadow: none;opacity: 0; visibility: hidden; height:0;}
	#gnb .depth1 > li .depth2 > li {display: block; padding:10px 0;}
	#gnb .depth1 > li .depth2 > li a {font-weight: 600; color:#000;}
	#gnb .depth1 > li .depth2::after {content: none;}	 
	#gnb .depth1 > li.active .depth2 {opacity: 1; visibility: visible; height: 100%; display: block;}
	#gnb .close_m{position: absolute;top:30px;right: 20px;display:block;width:30px;height:30px;cursor: pointer; background:url('/images/main/btn_close.png') no-repeat; text-indent: -9999px; background-size: cover;}
	#gnb .logo_m.active {display: block; padding-bottom: 20px; margin-bottom: 20px; position: relative; text-align: right;}	
	
	.m01 .m_inner {text-align: center;}
	.m01 img {width:80%;}
	
	.main_wrap .m01,
	.main_wrap .m02,
	.main_wrap .m03,
	.main_wrap .m04 {padding:0 10px; word-break: keep-all;}

	/*	footer */
	#footer .contain {flex-direction: column;}
	#footer .contain .copy span {position: relative; display: inline-block; padding-top:50px;}
	#footer .contain .mail_wrap {position: relative;}
	
	
}

@media screen and (max-width:768px) {	
	.only-sm {display:block;}	
		
}

@media screen and (max-width:425px) {
	
	
}

@media screen and (max-width:320px) {	
	
	
}