@charset "utf-8";
@import url('//fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');


/******************************************
Author : 퍼스트몰(firstmall)
Author URL : http://firstmall.kr
Creation Date : 2021-08-16
Modify Date : 2021-08-16
File : /event/2021/chuseok
*******************************************/

/* 공통 */
body, div, dl, dt, li, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, textarea, p, blockquote, th, td, input, select, button {font-family:"Noto Sans KR", sans-serif; /*transition:all 0.3s ease;*/}
body {min-width:360px; letter-spacing:-1px;}
img {max-width:100%;}
#event_header {position:relative; background:#fff; z-index:1;}
#event_footer {border-color:#f0f0f0;}
#wrap {position:relative; overflow:hidden; background:#fff; opacity:0;}
.top_btn {background:#0056b7;}
.show_mot {position:relative; opacity:0; top:20px;}
.section {position:relative; height:auto; padding:120px 0 130px; text-align:center; transition:all 0.3s ease;}
.section .inner {position:relative; width:1180px; /*height:100%;*/ margin:auto; text-align:center;}
.section > .inner {opacity:0;}
.section.active > .inner {opacity:1;}
.section hgroup {margin-bottom:80px;}
.section hgroup .icon {display:inline-block; margin-bottom:20px;}
.section h3 {position:relative; margin-bottom:20px; font-size:52px; font-weight:300; color:#2c2d31; letter-spacing:-4px; line-height:1.3;}
.section h3 i {font-weight:inherit;}
/*.section h3 + p {font-size:22px; font-weight:400; color:#9d9d9d; letter-spacing:-2px; line-height:1.3;}
.section h3 + p em {color:#465385;}*/
.section .cont li {position:relative; float:left; transition:all 0.1s ease 0s;}
.section .cont li:hover {transform:translateY(-5px);}

/* #section0 */
body {background:#e9f1fd;}
#section0 {background:#e9f1fd url('/images/event/20211202/sec0_bg.jpg') no-repeat center; padding-bottom:90px;}
#section0 hgroup {margin-bottom:70px;}
#section0 .img {margin:0 auto;}

/* #section1 */
#section1 {background:#005d9d; padding-bottom:0;}
#section1 h3 {color:#fff;}
#section1 h3 i {font-weight:inherit;}

/* #section2 */
#section2 {background:#fff;}
#section2 .icon {margin:0 10px 5px 0; vertical-align:middle;}
#section2 .txt p {font-size:34px; font-weight:300; color:#333; letter-spacing:-3px; line-height:1.4;}
#section2 .txt em {background:#fde5b2; padding:0 5px; font-weight:500;}

/* #section3 */
#section3 {background:#0b3a82;}
#section3 h3 {color:#fff;}
#section3 .cont {margin-left:-30px;}
#section3 .cont li {width:33.33%; padding-left:30px; box-sizing:border-box;}
#section3 .cont .box {border-radius:20px; background:#fff; padding:50px 10px; text-align:center;}
#section3 .cont .box h4 {padding:40px 0 10px; font-size:34px; font-weight:500; color:#333; letter-spacing:-3px;}
#section3 .cont .box p {font-size:22px; font-weight:300; color:#333; letter-spacing:-2px;}

/* #section4 */
#section4 {background:#fafafa url('/images/event/20211202/sec4_bg.jpg') no-repeat center;}
#section4 .cont {margin-left:-30px;}
#section4 .cont li {width:50%; padding-left:30px; box-sizing:border-box;}
#section4 .cont li:nth-child(2) {margin-top:50px;}
#section4 .cont li:nth-child(3) {margin-top:-25px;}
#section4 .cont li:nth-child(4) {margin-top:25px;}
#section4 .cont .box {box-shadow:0 5px 20px rgba(0,0,0,0.05); border-radius:20px; background:#fff; padding:40px; text-align:left;}
#section4 .cont .box h4 {padding:30px 0 10px; font-size:34px; font-weight:500; color:#333; letter-spacing:-3px;}
#section4 .cont .box p {font-size:22px; font-weight:300; color:#333; letter-spacing:-2px; line-height:1.2;}

/* #section5 */
#section5 {background:#fff;}
#section5 .cont li {width:100%; padding-top:30px; box-sizing:border-box;}
#section5 .cont li:nth-child(1) {padding-top:0;}
#section5 .cont li:nth-child(1) .box {background:#ffce25;}
#section5 .cont li:nth-child(2) .box {background:#4775f5;}
#section5 .cont li:nth-child(3) .box {background:#11be76;}
#section5 .cont li:nth-child(4) .box {background:#f03c3a;}
#section5 .cont li:nth-child(1) .box span,
#section5 .cont li:nth-child(1) .box h4,
#section5 .cont li:nth-child(1) .box p {color:#333;}
#section5 .cont .box {position:relative; border-radius:100px; padding:40px; text-align:left;}
#section5 .cont .box span {position:absolute; top:-5px; left:40px;  /*margin:-45px 30px 0 0;*/ font-family:'Montserrat', sans-serif; font-size:125px; font-weight:100; color:#fff;}
#section5 .cont .box h4 {margin:-10px 0 10px 170px; font-size:34px; font-weight:500; color:#fff; letter-spacing:-3px;}
#section5 .cont .box p {margin-left:170px; font-size:22px; font-weight:300; color:#fff; letter-spacing:-2px; line-height:1.2;}

/* #section6 */
#section6 {background:#e7f4ff;}
#section6 .cont {margin-left:-30px;}
#section6 .cont li {width:33.33%; box-sizing:border-box;}
#section6 .cont li:nth-child(1) .st {margin-left:30px;}
#section6 .cont .box {margin-left:30px; background:#fff; padding:60px 10px 20px; text-align:center;}
#section6 .cont .box h4 {padding:50px 0 0; font-size:34px; font-weight:400; color:#333; letter-spacing:-4px; line-height:1.2;}
#section6 .cont .box p {font-size:22px; font-weight:300; color:#333; letter-spacing:-2px;}
#section6 .cont .st {padding:20px 0; text-align:center;}
#section6 .cont li:nth-child(1) .st {background:#ffecac;}
#section6 .cont li:nth-child(2) .st {background:#ffdb60; padding-left:30px;}
#section6 .cont li:nth-child(2) .st:before {display:block; content:''; position:absolute; top:0; left:0; width:37px; height:60px; background:url('/images/event/20211202/sec6_st2_be.png') no-repeat left;}
#section6 .cont li:nth-child(3) .st {background:#ffce25; padding-left:30px;}
#section6 .cont li:nth-child(3) .st:before {display:block; content:''; position:absolute; top:0; left:0; width:37px; height:60px; background:url('/images/event/20211202/sec6_st3_be.png') no-repeat left;}

/* #section7 */
#section7 {background:#203150 url('/images/event/20211202/sec7_bg.jpg') no-repeat center;}
#section7 hgroup {margin-bottom:50px;}
#section7 h3 {text-align:left; color:#fff;}
#section7 h3 em {color:#5ff3f1;}
#section7 .btns {text-align:left;}
#section7 .btns > a {display:inline-block; background:#5ff3f1; padding:15px 100px; font-size:32px; font-weight:700; color:#203250; transition:all linear 0.5s;}
#section7 .btns > a:hover {background:#ffb495;}

/* 반응형 처리 */
@media only screen and (max-width:1179px) {	
	.section .inner {width:100%; padding:0 20px;}	
	.section .cont .box h4 {line-height:1.3;}
	.section .cont .box br {display:none;}
}
@media only screen and (max-width:767px) {
	.section .cont li {width:100% !important;}
	.section .cont li + li {padding-top:20px !important;}	
	#section4 .cont li:nth-child(2),
	#section4 .cont li:nth-child(3),
	#section4 .cont li:nth-child(4) {margin-top:0;}
	#section5 .cont .box {border-radius:50px;}
	#section6 .cont li .st {margin-left:30px; padding-left:0 !important;}
	#section6 .cont li:nth-child(2) .st:before,
	#section6 .cont li:nth-child(3) .st:before {display:none;}
	#section7 h3,
	#section7 .btns {text-align:center;}	
}
@media only screen and (max-width:479px) {
	.section {padding:60px 0;}	
	.section hgroup {margin-bottom:50px !important;}
	.section h3 {font-size:36px;}
	.section .cont .box h4 {font-size:26px !important;}
	.section .cont .box p {font-size:18px !important;}	
	#section0 {padding-bottom:60px;} 
	#section2 .txt p {font-size:26px;}	
	#section3 .cont .box {padding:50px 30px;}
	#section5 .cont .box span {top:5px; font-size:80px;}	
	#section5 .cont .box h4,
	#section5 .cont .box p {margin-left:110px;}
}
@media only screen and (max-width:375px) {
	.section h3 {font-size:30px;}
	#section7 .btns > a {font-size:26px;}
}