@charset "utf-8";
@import url('https://webfontworld.github.io/gmarket/GmarketSans.css');

/******************************************
Author : 퍼스트몰(firstmall)
Author URL : http://firstmall.kr
Creation Date : 2023-07-03
Modify Date : 2023-07-04
File : /event/2023/geditor
*******************************************/

/* 공통 */
body {min-width:320px; letter-spacing:-1px;}
img {max-width:100%;}
#event_header {position:relative; background:#fff; z-index:1;}
#event_footer {border-color:#d0d0d0; background:#fff;}
#wrap {position:relative; overflow:hidden; opacity:0;}
.top_btn {background:#035ade;}
.top_btn:hover {background:#020c31;}
.show_mot {position:relative; opacity:0; top:100px;}
section {position:relative; text-align:center; transition:all 0.3s ease; padding:130px 0;}
section .inner {position:relative; width:auto; max-width:1216px; margin:auto; text-align:center;}
section > .inner {opacity:0;}
section.active > .inner {opacity:1;}
section hgroup {margin-bottom:50px;}
section .txt {margin-top:-10px; padding-right:20px; text-align:right; font-size:18px; color:#fff; opacity:0.5}

/* #section0 */
body {/*background:#020c31 url('/images/event/20231127/sec0_bg.jpg') no-repeat center 61px; background-size:cover;*/}
#section0 {height:100vh; background:url('/images/event/20231127/sec0_bg1.jpg') no-repeat center top; background-size:cover;}
#section0 .inner {height:100%;}
#section0 hgroup {text-align:left; z-index:1;}
#section0 hgroup .pc {display:block;}
#section0 hgroup .mo {display:none;}
#section0 .img .ball1 {position:absolute; bottom:180px; right:-40px; animation:pendulum 4s ease-in-out infinite;}
#section0 .img .ball2 {position:absolute; bottom:-100px; right:180px; animation:pendulum2 5s ease-in-out infinite;}
#section0 .img .ball3 {position:absolute; bottom:-190px; right:-170px; animation:pendulum3 6s ease-in-out infinite;}
#section0 .img img {width:340px;}
@keyframes pendulum { 0%{transform:rotateY(0);} 50%{transform:rotateX(10deg) translateX(20px);} 100%{transform:rotateY(0);} }
@keyframes pendulum2 { 0%{transform:rotateY(0);} 50%{transform:rotateY(10deg) translateX(20px);} 100%{transform:rotateY(0);} }
@keyframes pendulum3 { 0%{transform:rotateY(0);} 50%{transform:rotateY(10deg) translateX(20px);} 100%{transform:rotateY(0);} }
.benefit {background:#00174c; padding:30px 0 !important;}
.regist {position:fixed; bottom:0; width:100%; padding:0 !important; text-align:center; z-index:2; opacity:0;}
.regist.on {opacity:1;}

/* #section1 */
#section1 {background:#b10401 url('/images/event/20231127/sec1_bg.jpg') no-repeat center top; background-size:cover; padding:110px 0;}
#section2 .img {position:relative;}

/* #section2 */
#section2 {background:#005d25 url('/images/event/20231127/sec2_bg.jpg') no-repeat center top; background-size:cover; padding:110px 0;}
#section2 .img {position:relative;}
#section2 .img .icon {position:absolute; top:-40px; right:-120px;}

/* #section3 */
#section3 {background:#161a24 url('/images/event/20231127/sec3_bg.jpg') no-repeat center top; background-size:cover; padding-top:70px;}
#section3 hgroup {margin-bottom:80px;}
#section3 .swiper3 .swiper-wrapper {animation:left_flow 50s linear infinite;}
#section3 .swiper3:hover .swiper-wrapper {animation-play-state:paused;}
@keyframes left_flow {from {transform:translateX(0)} to {transform:translateX(-2280px)}}

/* #section4 */
#section4 {background:#2d2f35;}
#section4 .box {display:flex; flex-wrap:wrap; align-items:flex-start;}
#section4 .box li {position:relative; width:50%; padding:15px;}

/* #section5 */
#section5 {background:#fff;}
#section5 hgroup {margin-bottom:80px;}
#section5 .main_partners {padding:0 !important;}
#section5 .main_partners .tit_area {display:none;}

/* #section6 */
#section6 {background:#32343a;}
#section6 .inner {text-align:left;}
#section6 .tit {margin-bottom:20px; font-size:clamp(20px, 1.80vw, 26px); font-weight:600; color:#fff;}
#section6 .tit .ico {vertical-align:middle; margin:0 10px 2px 0;}	
#section6 .list {margin:0 0 70px 40px;}
#section6 .list li {position:relative; margin-top:5px; margin-bottom:5px; padding-left:8px; font-size:clamp(16px, 1.52vw, 22px); color:#cdcfd4;}
#section6 .list li:before {display:block; content:''; position:absolute; top:15px; left:0; width:3px; height:3px; border-radius:50px; background:#cdcfd4;}
#section6 .list + .tit {border-top:1px solid #4e5158; padding-top:70px;}
#section6 .dist {margin:0 0 0 40px; border-radius:10px; background:#41444e; padding:30px 35px;}
#section6 .dist + .dist {margin-top:25px;}
#section6 .dist dt {position:relative; padding-left:25px; text-indent:-25px; font-size:clamp(16px, 1.66vw, 24px); font-weight:600; color:#cdcfd4; cursor:pointer;}
#section6 .dist dt:after {display:block; content:''; position:absolute; top:50%; right:0; margin-top:-5px; width:18px; height:11px; background:url('/images/event/20231127/sec6_ico3.png') no-repeat right center; transform:rotate(180deg);}
#section6 .dist dt.active {display:block;}
#section6 .dist dt.active:after {transform:rotate(0);}
#section6 .dist dd {padding-left:23px; text-indent:-23px; padding-top:5px; font-size:clamp(16px, 1.52vw, 22px); color:#fff;}

/* 반응형 처리 */
@media only screen and (max-width:1216px) {
	section .inner {padding:0 20px;}
}
@media only screen and (max-width:1024px) {
	#section0 {/*height:auto; padding-bottom:300px !important;*/}
	#section2 .img .icon img {max-width:80%;}
	#section6 .list li:before {top:10px;}
}
@media only screen and (max-width:768px) {
	section {padding:100px 0 !important;}
	section .txt {margin-top:0; padding-right:10px; font-size:16px;}
	#section0 {height:auto; background:url('/images/event/20231127/sec0_bg2.jpg') no-repeat center top; background-size:cover; padding-bottom:120px !important;}
	#section0 hgroup .pc {display:none;}
	#section0 hgroup .mo {display:block;}
	#section0 .img {display:none;}
	#section4 .box li {padding:10px;}
	#section6 .dist dt,
	#section6 .dist dd {padding-left:15px; text-indent:-15px;}	
}
@media only screen and (max-width:640px) {	
	#section2 .img .icon img {max-width:60%;}
	#section4 .box li {width:100%;}
}
@media only screen and (max-width:500px) {
	section {padding:60px 0 !important;}
	section hgroup {margin-bottom:30px !important;}	
	#section6 .list {margin-bottom:50px;}
	#section6 .list + .tit {padding-top:50px;}
	#section6 .dist {padding:20px 25px;}
}