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

/******************************************
File : /event/2021/october
*******************************************/

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;}
body {min-width:320px;}
img {max-width:100%;}
#event_header {position:relative; background:#fff; z-index:5;}
#layout_body {padding-bottom: 0;}
#event_footer {border-color:#f0f0f0;}
#wrap {position:relative; overflow:hidden; background:#fff; opacity:0;}
.show_mot {position:relative; opacity:0; top:20px;}
.top_btn {background:#1969ff;}
.section > .inner { opacity:0; max-width:1000px; margin:0 auto; }
.section.active > .inner {opacity:1;}
.section {position:relative; height:auto; text-align:center;}
.section h3 { font-size:42px; font-weight:700; color:#000; letter-spacing:-0.1em; line-height:1.4; }
.section .h3_desc { font-size:22px; font-weight:300; line-height:1.4; color:#636363; margin-top:17px; }
.pc_dib_mo_i { display:inline-block; }
.section .blue1 { color:#0166ff; }
.youtube_wrap { position:relative; padding-bottom:56.25%; }
.youtube_wrap iframe { position:absolute; left:0; top:0; width:100%; height:100%; }



/* #section0 */
#section0 { padding:125px 0 80px; background:#e1f0ff url('/images/event/20211007/sec0_bg.jpg') no-repeat center top; }
#section0 .contents2 { margin-top:40px; }

#section1 { padding:80px 0; background:#253549; color:#fff; }
#section1 .inner { max-width:860px; }
#section1 .contents1 { text-align:left; }
#section1 .contents1 .txt1 { margin-top:20px; }
#section1 .contents1 .txt1:first-child { margin-top:0; }
#section1 .contents1 .txt1 > li { display:inline-block; vertical-align:top; font-size:24px; font-weight:400; letter-spacing:-0.05em; }
#section1 .contents1 .txt1 > li.title { color:#b9fbff; border-top:2px #b9fbff solid; margin-right:30px; }
#section1 .contents1 .txt1 > li.desc { border-top:2px transparent solid; }
#section1 .goods_list { max-width:820px; margin:40px auto 0; font-size:0; }
#section1 .goods_list > li { display:inline-block; width:33.33%; padding:20px 18px 0; }

#section2 { padding:100px 0 90px; }
#section2 .list1 {}
#section2 .list1 > li { display:flex; align-items:center; padding-top:58px; }
#section2 .list1 > li > div { flex-basis:50%; }
#section2 .list1 > li:nth-child(even) > div.txt_area { order:-2; }
#section2 .list1 > li .txt_inner { display:inline-block; width:340px; padding-left:20px; max-width:100%; vertical-align:top; text-align:left; }
#section2 .list1 > li:nth-child(even) .txt_area { text-align:right; padding-right:20px; }
#section2 .list1 > li:nth-child(even) .txt_inner { width:auto; padding-left:0; }
#section2 .list1 h4 { font-size:37px; font-weight:400; letter-spacing:-0.05em; line-height:1.3; color:#0166ff; }
#section2 .list1 .h4_desc { margin-top:16px; font-size:20px; font-weight:300; color:#636363; }

#section3 { padding:100px 0 80px; background:#e1f0ff; }
#section3 .h3_desc { max-width:540px; margin-left:auto; margin-right:auto; }
#section3 .youtube_icon { display:inline-block; width:29px; height:20px; position:relative; top:2px; background:url('/images/event/20211007/icon_youtube.png') 50% 50% no-repeat; }
#section3 .h3_desc2 { position:relative; display:inline-block; vertical-align:top; margin-top:24px; padding:8px 24px 10px; border-radius:24px / 50%; font-size:26px; color:#fff; line-height:1.3; background:#0166ff; }
#section3 .h3_desc2:after { display:block; content:''; width:23px; height:16px; position:absolute; right:16px; bottom:-11px; background:url('/images/event/20211007/sec3_bul.png') 50% 100% no-repeat; }
#section3 .contents3 { max-width:540px; margin:40px auto 0; }
#section3 .contents4 { max-width:860px; margin:50px auto 0; }
#section3 .contents4 ol { font-size:0; }
#section3 .contents4 ol > li { position:relative; display:inline-block; vertical-align:top; width:30%; font-size:16px; }
#section3 .contents4 ol > li:before { display:block; content:''; width:42px; height:13px; position:absolute; left:0; top:140px; margin-left:-21px; background:url('/images/event/20211007/sec3_step_arr.png') no-repeat; }
#section3 .contents4 ol > li:first-child:before { display:none; }
#section3 .contents4 ol .img_area { height:204px; }
#section3 .contents4 ol h4 { margin-top:22px; font-size:25px; font-weight:400; line-height:1.2; color:#000; }
#section3 .contents4 ol .btn_area { margin-top:15px; }
#section3 .contents4 ol .btn_area .btn1 { display:inline-block; vertical-align:top; line-height:37px; padding:0 35px 0 25px; font-size:16px; color:#fff; background:#253549 url('/images/event/20211007/sec3_bul2.png') calc(100% - 20px) 50% no-repeat; border-radius:20px / 50%; }
#section3 .contents4 ol .h4_desc { margin-top:16px; color:#525d6e; line-height:1.4; }

#section4 { padding:70px 0; text-align:left; }
#section4 .inner { max-width:860px; margin:0 auto; }
#section4 h3 { font-size:24px; font-weight:400; color:#000; }
#section4 .notice_list { margin-top:20px; }
#section4 .notice_list > li { background:url('/images/event/20211007/sec4_bul.png') 0 11px no-repeat; padding:0 0 0 17px; margin-top:12px; font-size:19px; line-height:1.4; color:#aaa; }
#section4 .notice_list > li:first-child { margin-top:0; }


@media only screen and (max-width:1000px) {
	.section { background-size:cover !important; }
	.section .inner {width:100%; padding:0 20px;}
	#section1 .contents1 .txt1 > li { font-size:20px; }
	#section1 .contents1 .txt1 > li.desc { display:block; }
	#section1 .goods_list > li { padding:15px 10px 0; }
}

@media only screen and (max-width:800px) {
	.pc_dib_mo_i { display:inline; }
	#section0, #section2, #section3 { padding:80px 0 50px; }
	#section2 .list1 > li { display:block; }
	#section2 .list1 > li .img_area img { max-height:100px; margin-bottom:20px; }
	#section2 .list1 > li div.txt_inner { display:block; width:auto; padding-left:0;text-align:center; }
	#section2 .list1 h4 { font-size:28px; }
	#section2 .list1 .h4_desc { margin-top:17px }

	#section3 .contents4 ol > li { display:block; width:auto; }
	#section3 .contents4 ol > li:before { display:inline-block; position:static; margin:30px 0; transform:rotate(90deg); }
	#section3 .contents4 ol .img_area { height:auto; }
	#section3 .contents4 ol h4 { font-size:22px; }

	#section4 .notice_list > li { font-size:17px; }
}

@media only screen and (max-width:500px) {
	.section h3 { font-size:30px; }
	.section .h3_desc { font-size:18px; }
	#section1 .goods_list > li { display:block; width:auto; }
	#section3 .h3_desc2 { font-size:22px; }
}