@charset "utf-8";
@import url('//fonts.googleapis.com/earlyaccess/notosanskr.css');


/******************************************
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:#5f6988;}
.show_mot {position:relative; opacity:0; top:20px;}
.section {position:relative; height:auto; padding:100px 0; 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:50px;}
.section hgroup .icon {display:inline-block; margin-bottom:20px;}
.section h3 {position:relative; margin-bottom:20px; font-size:42px; font-weight:700; color:#2c2d31; letter-spacing:-4px; line-height:1.3;}
.section h3 em {display:inline-block; position:relative; font-weight:inherit;}
.section h3 em:before {display:block; content:''; position:absolute; bottom:5px; left:0; right:0; width:100%; height:13px; background:#9db1ff;}
.section h3 em span {display:block; position:relative;}
.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 {padding:60px 30px;}
.section .cont li {position:relative; float:left; width:50%; padding:5px; text-align:center; transition:all 0.1s ease 0s;}
.section .cont li:hover {/*transform:translateY(-5px);*/}
.section .bnr {padding-top:60px;}
.section .bnr > a {display:inline-block; padding:15px 130px; font-size:24px; font-weight:700; transition:all linear 0.5s;}

/* 뷰레이어 */
.view_bg {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.3); z-index:2;}
.view_layer {letter-spacing:0px; display:none; position:fixed; top:50%; left:50%; margin:-370px 0 0 -560px; width:1120px; box-shadow:0 0 10px rgba(0,0,0,0.05); border-radius:30px; border:3px solid #191f28; background:#fff; padding:45px 50px; text-align:center; z-index:3; overflow-y:auto;}
.view_layer h5 {font-size:34px; font-weight:700; color:#2a2e3c; letter-spacing:-2px;}
.view_layer h5 + p {margin-bottom:20px; font-size:16px; font-weight:500; color:#6d7cb3; line-height:1.4;}
.view_layer table {width:100%;}
.view_layer thead th {border-bottom:1px solid #a5acc5; border-left:1px solid #a5acc5; background-color:#485689; padding:15px; text-align:center; font-size:17px; color:#fff; line-height:1.3;}
.view_layer tbody td {border-bottom:1px solid #a5acc5; border-left:1px solid #a5acc5; background-color:#fff; padding:15px; text-align:center; font-size:17px; color:#000; line-height:1.3;}
.view_layer tbody td:nth-child(1) {border-left:none;}
.view_layer tbody td:nth-child(2) {font-weight:600; color:#3e5199;}
.view_layer tbody td:nth-child(4) {font-weight:600;}
.view_layer .close {position:absolute; top:30px; right:30px; width:20px; height:20px; background:url('/images/event/20210104/layer_close.png') no-repeat center; cursor:pointer;}
@media only screen and (max-width:1100px) {
	.view_layer {width:auto; left:10px; right:10px; margin-left:0; padding:15px 20px 20px;}
	.view_layer .close {top:20px; right:20px;}
}
@media only screen and (max-width:600px) {
	.view_layer {top:10px; margin-top:0; bottom:10px;}
	.view_layer thead th, .view_layer tbody td {font-size:15px; white-space:nowrap;}
}
@media only screen and (max-width:375px) {
	.view_layer h5 {font-size:24px;}
	.view_layer h5 + p {font-size:16px;}
}

/* #section0 */
body {background:url('/images/event/20210818/sec0_bg.jpg') no-repeat center 61px;}
#section0 {background:url('/images/event/20210818/sec0_bg.jpg') no-repeat center top; background-size:cover; padding:100px 0 0;}
#section0 hgroup {margin-bottom:150px;}
#section0 .icon {margin-bottom:40px;}
#section0 .cont {margin:0 auto;}
#section0 .cont li {width:33.33%; padding:5px;}

/* #section1 */
#section1 {background:#ededf1;}
#section1 h3 em:before {background:#9db1ff;}
#section1 .cont {background:#fff;}
#section1 .bnr > a {background:#465385; color:#fff;}
#section1 .bnr > a:hover {background:#c54a22;}

/* #section2 */
#section2 {background:#d4643f url('/images/event/20210818/sec2_bg.jpg') no-repeat center top; background-size:cover;}
#section2 h3 em:before {background:#f2b57b;}
#section2 h3 + p {color:#ffa587;}
#section2 h3 + p em {color:#fff;}
#section2 .cont {background:#fff;}
#section2 .cont li:nth-child(2):before {display:block; content:''; position:absolute; top:50px; bottom:30px; left:0; width:1px; background:#e0e0e0;}
#section2 .bnr > a {background:#000; color:#fff;}
#section2 .bnr > a:hover {background:#395935;}

/* #section3 */
#section3 {background:#2a2e3c url('/images/event/20210818/sec3_bg.jpg') no-repeat center top; background-size:cover;}
#section3 h3 {color:#fff;}
#section3 h3 em:before {background:#566186;}
#section3 h3 + p {color:#6e758e;}
#section3 h3 + p em {color:#6078cf;}
#section3 .cont {padding:10px 10px;}
#section3 .bnr > a {background:#dec683; color:#000;}
#section3 .bnr > a:hover {background:#eca83d;}

/* #section4 */
#section4 {background:#232732; padding:40px 0;}
#section4 .inner {width:1120px; margin:0 auto; text-align:left;}
#section4 hgroup {margin-bottom:0;}
#section4 h3 {margin-bottom:10px; background:url('/images/event/20210818/sec4_icon.png') no-repeat; padding-left:25px; font-size:18px; color:#7d829e;}
#section4 .cont {padding:0;}
#section4 .cont li {width:100%; padding:0 0 0 8px; text-indent:-8px; text-align:left; font-size:16px; color:#747885;}

/* 반응형 처리 */
@media only screen and (max-width:1180px) {	
	.section .inner {width:100%; padding:0 20px;}
}
@media only screen and (max-width:1120px) {	
	#section4 .inner {width:100%;}
}
@media only screen and (max-width:768px) {
	.section .cont li {width:100%;}
	.section .cont li + li {padding-top:20px;}
	#section0 .cont li {width:100%;}
	#section0 hgroup, #section0 h3 {margin-bottom:0;}	
	#section1 .cont li:nth-child(1), #section1 .cont li:nth-child(2),
	#section2 .cont li:nth-child(1), #section2 .cont li:nth-child(2) {padding-left:30px; padding-right:30px;}
	#section4 .cont li + li {padding-top:0;}	
}
@media only screen and (max-width:500px) {
	.section {padding:60px 0;}	
	.section hgroup {margin-bottom:30px;}
	.section h3 {font-size:36px;}
	.section .bnr {padding-top:30px;}
	.section .bnr > a {width:100%; padding-left:15px; padding-right:15px;}
	#section0 {padding-top:70px;}
	#section1 .cont li:nth-child(1), #section1 .cont li:nth-child(2),
	#section2 .cont li:nth-child(1), #section2 .cont li:nth-child(2) {padding-left:20px; padding-right:20px;}	
}
@media only screen and (max-width:375px) {
	.section h3 {font-size:30px;}
	.section h3 + p {font-size:20px;}
	#section0 .cont {padding:60px 0;}
	#section1 .cont, #section2 .cont {padding:40px 0 30px;}
	#section3 .cont {padding:0;}
}