@import url("font.css");
@import url("default.css");

body {padding:0; background-color:var(--white);}


#mainTitle {
	background:url('/main/view/images/event_171120/main_bg.jpg') no-repeat 50%;
	text-align:center;
}

/* MidSection01 */
#MidSection01 {
	/* background:url('/main/view/images/event_250425/MidSection01_01.png') no-repeat 50% 118%
	, linear-gradient(to bottom right, #f83701 55%, #fb6500); */
	background:#5ea5ff;
	text-align:center;
	padding:35px 0;
}
#MidSection01 h2 {font-size:3rem; font-weight:bold; color:var(--white); position:relative; margin-bottom:0;}
/* #MidSection01 h2::after {
	content: "";
	position: absolute;
	width: 400px;
	background: radial-gradient(rgb(255 0 0 / 20%), rgb(145 152 229 / 0%) 50%);
	height: 200px;
	top: -80px;
	z-index: 0;
	left:calc(50% - 178px);
}
#MidSection01 h2::before {content:""; position:absolute; width:360px; height:1px; background-color:var(--white); bottom:0;} */
#MidSection01 p {font-size:2.3rem; margin-top:5px;}

/* MidSection02 */
#MidSection02 {position:relative; z-index:9; background-color:#1c1c1c;}
/* #MidSection02::after {
	content: "";
	position: absolute;
	width: 100%;
	background: radial-gradient(rgb(255 0 0 / 28%), rgb(145 152 229 / 0%) 50%);
	height: 540px;
	top: -270px;
}
#MidSection02::before {
	content: "";
	position: absolute;
	width: 100%;
	background: radial-gradient(rgb(255 0 0 / 28%), rgb(145 152 229 / 0%) 50%);
	height: 710px;
	top: calc(50% - 80px);
	left: -45%;
	z-index:-1;
} */
#threeBnSection {background:linear-gradient(180deg, rgb(255 247 240) 0%, rgb(255 222 179) 40%, rgb(252 116 54) 100%);
	padding:70px 0 0;
	margin-top:100px;
	background-size:100%;
	overflow:hidden;
}
#threeBnCnt {padding:180px 0 0; text-align: center;}
#threeBnCnt h2 {
	width: 122px;
	background: linear-gradient(to right, #913e0f 0%, #ff7a2c 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin: 0 auto;
	padding: 5px;
	position:relative;
}
#threeBnCnt h2 > span {
	font-size:2rem;
	color:#fff;
	/* background: linear-gradient(to bottom right, #f83701 0%, #fb6500 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent; */
}
#threeBnCnt h2 > span::after {
	content:"";
}
#threeBnCnt h2 > span::before {
	content: "";
	position: absolute;
	background: url('/main/view/images/event_171120/titledot.png') no-repeat 50%;
	width: 40px;
	height: 174px;
	top: -170px;
	left: calc(50% - 20px);
}

#threeBnCnt dl {text-align:center; margin:0 auto;}
#threeBnCnt dl dt {
	font-size:2.1rem;
	/* background: linear-gradient(to bottom right, #f83701 0%, #fb6500 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent; */
}
#threeBnCnt dl dd {
	font-size:2.1rem;
	padding:10px 0;
	/* font-weight:bold;
	color:var(--white);
	margin-top:10px;
	text-shadow: 0px 0px 10px red; */
}
#threeBnCnt dl dd > div {color:#ff6914; font-size:3.2rem; font-weight:600; padding:85px 0 50px;}
#threeBnCnt dl dd > div > b {color:#fff; background-color:#ff6914; font-weight:normal; /*padding:10px;*/ }
#threeBnCnt dl dd > b {font-size:4rem; color:#552312;}
#threeBnCnt dl dd > p {padding-bottom:10px;}

#threeBnCnt ul {display:inline-flex; position:relative; top:-70px; }
#threeBnCnt ul li {margin:20px;}
#threeBnCnt ul img {width:100%;}

.emphasize {margin:80px auto;}

#threeBnCnt ol {display:flex; flex-wrap:wrap; justify-content:center; list-style:none;}
#threeBnCnt ol li {margin:30px;}
#threeBnCnt ol img {box-shadow:0 1px 50px -28px #f00;}


/* MidSection03 */
#MidSection03 {position:relative; background:url('/main/view/images/event_250425/fireplug_bg.png') no-repeat -10% 100% #000; overflow:hidden;}
#MidSection03::after {
	content: "";
	position: absolute;
	width: 150%;
	left: -25%;
	background: radial-gradient(rgb(255 0 0 / 35%), rgb(145 152 229 / 0%) 50%);
	height: 1030px;
	top: -50%;
}

#movBnCnt {padding:60px 0 0; text-align: center; background:url('/main/view/images/event_171120/jung_mov_bg.png') no-repeat calc(50% - 520px) 202px;}
#movBnCnt h2 {
	width:122px;
	border: 3px solid transparent;
	border-radius: 10px;
	background-color:#5d7cea;
	margin:0 auto;
	padding:5px;
}
#movBnCnt h2 > span {
	font-size:2rem;
	color:#fff;
}
#movBnCnt dl {text-align:center; margin:0px auto;}
#movBnCnt dl dt {
	font-size:2.5rem;
}
#movBnCnt dl dd {
	/* width:800px; */
	font-size:4rem;
	font-weight:bold;
	margin:auto;
	background-color:rgb(85 37 17);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#movContent {margin-top:100px;}
#movContent ul {}
#movContent ul li {margin-left:280px; margin-top:80px;}
#movContent ul li > a {
	display: block;
	overflow: hidden;
	/* width: 590px; */
	margin: auto;
}



/* MidSection04 */
#MidSection04 {}
#MidSection04 {position:relative; background-color:#1c1711; overflow:hidden;}


#specialBnCnt {padding:150px 0; text-align: center;}
#specialBnCnt h2 {
	margin:0 auto;
	position:relative;
}
#specialBnCnt h2 > span {
	font-size:2rem;
	background: linear-gradient(to right, #913e0f 0%, #ff7a2c 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin: 0 auto;
	padding: 5px;
}
#specialBnCnt h2 > span::before {
	content: "";
	position: absolute;
	background: url('/main/view/images/event_171120/titledot.png') no-repeat 50%;
	width: 40px;
	height: 174px;
	top: -170px;
	left: calc(50% - 20px);
}
#specialBnCnt dl {text-align:center; margin:20px auto 70px;}
#specialBnCnt dl dt {
	font-size: 2.5rem;
	color: var(--white);
	font-weight: 300 !important;
	letter-spacing: 8px;
}
#specialBnCnt dl dd {
	font-size:3.6rem;
	font-weight:bold;
	color:#fff;
	margin-top:10px;
}

#specialContent {background:url('/main/view/images/event_171120/notebook.png') no-repeat 50% 0%; overflow:auto;}
#specialContent ul {margin-top:525px;}
#specialContent ul li {font-size:3.5rem; color:var(--white);}
#specialContent ul li > a {
	background:linear-gradient(to right, #f78270 0%, #ff8c61 40%, #ff942c 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: 2rem;
	/* color: var(--white); */
	display: inline-block;
}

/* couponAddSubmit */
#couponAddSubmit {text-align:center; padding:70px 0 150px;}
#couponAddSubmit > ul {width:70%; margin:0 auto; border-radius:30px; background-color:#fff; padding:70px 0 0;}


#edCode {border-radius:20px;background-color: #e4e4e4;padding: 34px 30px;width:80%;margin:0 auto;}
#edCode > h2 {font-size: 1.5rem;font-weight:normal;font-family:"Noto Sans KR", sans-serif;}
#edCode > h2 > span {font-size: 2.5rem;font-weight:bold;color: #ff5302;}
#edCode > ul {}
#edCode > ul > li {}


#coupon-position {font-family:"Noto Sans KR", sans-serif; margin:50px auto 20px; width:80%;}
#coupon-position > input{line-height:30px;font-size:30px;padding:30px;width: calc(100% - 300px);text-transform:uppercase;}
#coupon-position > span {
	float:right;
	width: 240px;
	color:#fff;
	background-color: #111111;
	padding: 27.5px 0;
	font-size:2rem;
	/* border-radius:10px; */
	font-weight:bolder;
	cursor:pointer;
	box-sizing: border-box;
}

#InfoText {font-family:"Noto Sans KR", sans-serif;font-size:1.15rem;padding: 0px 0 72px;color: #545454;}
#InfoAddBasket {
	font-family:"Noto Sans KR", sans-serif;
	display:inline-block;
	background-color: #ff6318;
	color:#fff;
	padding: 25px 100px;
	overflow:hidden;
	border-radius:50px;
	font-size: 2.2rem;
	font-weight:bold;
	/* margin:20px auto 70px; */
}
/* couponAddSubmit */

#mainCourse {
	background: url('/main/view/images/event_171120/trophy.png') no-repeat 50% 100%
	, radial-gradient(rgb(0 0 0) 0%, rgb(30 29 29) 40%, rgb(45 44 43) 100%);
	text-align:center;
	padding:80px 0;
	position:relative;
}
#mainCourse ul {}
#mainCourse ul li:first-child {
	font-size:3.5rem;
	font-weight: 600;
	color:#fff;
	margin-left:-100px;
	/* background:linear-gradient(to right, #f63401 0%, #f78022 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent; */
}
#mainCourse ul li > span {display:inline-block;line-height: 230px;}
#mainCourse ul li > .bookImg {position:relative; width:360px; }
#mainCourse ul li > .bookImg > img {position:absolute; top:-200px; left:0;}
#mainCourse ul li a {
	font-size:2.5rem;
	font-weight:normal;
	color:var(--white);
	display: inline-block;
	background-color: #b58959;
	padding: 20px 180px;
	overflow: hidden;
	border-radius:50px;
	font-weight: bold;
	margin: 0 auto;
	position: relative;
	z-index: 3;
}
#mainfooter a {display:inline-block;}
#pop_alert-search #wrapAlert-search #msgAra {display:flex; justify-content: center;}

.fzCls {}

@media (max-width: 1910px) {
	#threeBnSection {background-size:unset; background-position:top;}
}

@media (max-width: 1180px) {

	#mainTitle img {width:100%;}
	#mainfooter > .footerInner {width:100%;}
	.emphasize img.graph {width:93%;}
	#threeBnCnt ul {display:block;}
	/* #threeBnCnt ul li {width:33.33%;} */
	#threeBnCnt ul img {width:93%;}

	#specialContent {background-size:90%;}
	#movContent ul li {margin:430px 0 0 0;}
	#movContent ul li > a {width:100%;}
	#movContent ul li img {width:80%;}
	#threeBnCnt ol {margin-left:-47px;}
	#threeBnCnt ol li {width:100%;}
	#threeBnCnt ol li > img {width:95%;}
	#specialContent ul {margin-top:75%;}
	#mainCourse ul li a {margin:0px auto 10px;}

	/* #threeBnCnt dl dt {font-size:3.4rem;} */
	#threeBnCnt dl dt, #movBnCnt dl dt, #specialBnCnt dl dt {font-size:3.4rem;}
	#threeBnCnt dl dd, #movBnCnt dl dd, #specialBnCnt dl dd {font-size:4rem;}

	#movBnCnt dl dd > span {display:block;}

	#couponAddSubmit > ul {width:90%;}

	.fzCls dt {font-size:2.8rem !important;}
	.fzCls dd {font-size:3.1rem !important;}

	#zero {width:100%;}
	#zeroBn {width:100%;}
	#upgrade {width:100%;}
	
	#threeBnSection {}
	#movBnCnt {background-size:85%; background-position:calc(50% - 30px) calc(50% - 40px);}
	#movContent {display:block; overflow:hidden; margin-top:200px;}

	#specialContent {background:url('/main/view/images/event_171120/notebook_Mo.png') no-repeat 50% 0%; overflow:auto; background-size:100%;}
	
}

@media (max-width: 1083px) {

	#movBnCnt {background-size:85%; background-position:calc(50% - 30px) calc(50% - 110px);}
	#movContent {display:block; overflow:hidden; margin-top:30%;}

	#movContent ul li {margin: 430px 0 0 0;}

	/* #specialContent ul {margin-top:calc(100% - 330px);} */

}

@media (max-width: 900px) {

	#movBnCnt {background-size:85%; background-position:calc(50% - 30px) calc(50% - 0px);}
	#movContent {display:block; overflow:hidden; margin-top:20%;}

	#movContent ul li {margin: 430px 0 0 0;}

}


@media (max-width: 700px) {

	#movBnCnt {background-size:85%; background-position:calc(50% - 30px) calc(50% - -40px);}
	#movContent {display:block; overflow:hidden; margin-top:10%;}

	#movContent ul li {margin: 430px 0 0 0;}

}