@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
/* font-family: 'Noto Sans KR', sans-serif; */

@font-face {font-family: 'Noto Sans KR'; font-style: normal; font-weight: 400; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff); }
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 700;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff');}

.blind {display: block;left: 9999px; top:auto; width: 1px; height: 1px; overflow:hidden; position: absolute;}
.clearfix::after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}
.clear::after {content:''; clear:both; display: block;}

#sidebar {background: linear-gradient( to left, #ff8b3e, #ff6600 );font-family: 'Noto Sans KR', sans-serif;padding:10px 0;position: fixed; bottom: 0; width: 100%; height: auto; text-align: center; margin-right: 4%; z-index: 9999; clear: both; max-width: 720px;}
#sidebar .fix {width:720px; margin:0 auto;position: relative;}
#sidebar .fix a {color:#fff;font-size: 22px;font-weight:300;}
#sidebar .fix a span {font-weight:600;}
#sidebar .fix a span img {position: absolute; top:50%; right:0;transform: translate(-50%, -50%);}

article { font-family: 'Noto Sans KR', sans-serif; max-width: 720px; margin: auto;}
article>section>.wrap {position: relative;width: 100%; box-sizing: border-box;}
article>section>.video_wrap {position: relative;width: 100%; box-sizing: border-box;}
article>.wrap>iframe { display:block; margin:0 auto; height: 78.0556vw;}
article>.section1 { background: url('m-images/m_con01_bg.jpg') 50% 0 / auto no-repeat; /*height: 122.7778%;*/background-repeat: no-repeat;-webkit-background-size: cover;background-size: cover; text-align: center; padding:0 15px;margin-top: 100px;}
article>.section2 { background:#1d1d1d; }
article>.section3 { background: #000;padding: 15% 15px 20% 15px;text-align: center;}
article>.section4 { background: url('m-images/m_con04_bg.jpg') 50% 0 / auto no-repeat; /*height: 137.2222%;*/background-repeat: no-repeat;-webkit-background-size: cover;background-size: cover;}
article>.section5 { background: url('m-images/m_con05_bg.jpg') 50% 0 / auto no-repeat; /*height: 83.6111%;*/ background-repeat: no-repeat;-webkit-background-size: cover;background-size: cover; }

article>.section1>.wrap { padding:16% 0 22.9444%; }
article>.section1>.wrap .content {width: 57%; margin: 0 auto 20px;}
article>.section1>.wrap p {margin-bottom:20px;}

article .bt_gd {background:transparent ; color: #fff;text-decoration: none;border: 1px solid #fff;padding:30px 60px;border-radius:100px;font-size: 27px;line-height: 1.2;position: relative;letter-spacing: -1.6px;}
article .bt_gd.orange {background: linear-gradient( to left, #ff8b3e, #ff6600 ); border:none; color: #fff;} 
article .bt_gd span {display: block;font-weight: 600;font-size: 33px;}
article .bt_gd img { position: absolute;right: 40px; margin-top:-8px; }

.drop_down{ list-style: none;padding: 38px 0 0 0;position: relative;width: 100%;}
.drop_down input[type='radio'] {display: none;}
.drop_down .drop_down-nav {display: flex;height: 100px;margin: -80px 25px 0 25px;}
.drop_down .drop_down-nav label:hover {cursor: pointer;color: #666;}
.drop_down .drop_down-nav label {position: relative;width:25%;color: #fff;text-align: center;border-radius: 10px;margin-right: 10px;box-sizing: border-box;transition: all .2s ease 0s;}
.drop_down .drop_down-nav label:nth-child(1) {background:url('m-images/m_con02_img1_off.png') no-repeat center;}
.drop_down .drop_down-nav label:nth-child(2) {background:url('m-images/m_con02_img2_off.png') no-repeat center;}
.drop_down .drop_down-nav label:nth-child(3) {background:url('m-images/m_con02_img3_off.png') no-repeat center;}
.drop_down .drop_down-nav label:nth-child(4) {background:url('m-images/m_con02_img4_off.png') no-repeat center;}
.drop_down .drop_down-nav label:last-child {margin-right:0px;}
.drop_down .drop_down-nav label span {background:#444;position: absolute;right:0;color:#fff;font-size:20px;bottom:0;font-weight: 600;padding:4px 15px;border-top-left-radius: 30px;}

.drop_down input[id='tab1']:checked ~ .drop_down-nav label:nth-child(1) {background:url('m-images/m_con02_img1_on.png') no-repeat center;}
.drop_down input[id='tab2']:checked ~ .drop_down-nav label:nth-child(2) {background:url('m-images/m_con02_img2_on.png') no-repeat center;}
.drop_down input[id='tab3']:checked ~ .drop_down-nav label:nth-child(3) {background:url('m-images/m_con02_img3_on.png') no-repeat center;}
.drop_down input[id='tab4']:checked ~ .drop_down-nav label:nth-child(4) {background:url('m-images/m_con02_img4_on.png') no-repeat center;}

.drop_down .drop_down-content {overflow: hidden;display: none;box-sizing: border-box;}
.drop_down .drop_down-content .cont {padding:2.4167% 0 0 0;text-align: center;}

.drop_down input[id='tab1']:checked ~ .drop_down-nav label[for='tab1'] {cursor: default;}
.drop_down input[id='tab1']:checked ~ div.tab-1 {display: block;}
.drop_down input[id='tab2']:checked ~ .drop_down-nav label[for='tab2'] {cursor: default;}
.drop_down input[id='tab2']:checked ~ div.tab-2 {display: block;}
.drop_down input[id='tab3']:checked ~ .drop_down-nav label[for='tab3'] {cursor: default;}
.drop_down input[id='tab3']:checked ~ div.tab-3 {display: block;}
.drop_down input[id='tab4']:checked ~ .drop_down-nav label[for='tab4'] {cursor: default;}
.drop_down input[id='tab4']:checked ~ div.tab-4 {display: block;}

article .section2 .img { position: relative;}
article .section2 .img img { border-radius:10px; }
article .section2 .bt_gd {width:80%;/* box-shadow: 5px 10px 20px 5px rgba(255, 102, 0, 0.2); */font-weight: 300;margin:80px auto;text-align: left;}

article .section2 .drop_down-content .wide_img .txt_box {margin:0 auto;font-size: 30px;font-weight: 300;letter-spacing: -2px;padding-top:15%;color:#000;line-height: 1.5;}
article .section2 .drop_down-content .wide_img .txt_box span {;font-weight: 600;}

.drop_down .tab-1 .wide_img {background: url('m-images/m_con03_bg-1.jpg') 50% 0 / auto no-repeat; height:54.1667%; } 
.drop_down .tab-1 .wide_img .txt_box {text-align: right;padding-right: 30px;}
.drop_down .tab-2 .wide_img {background: url('m-images/m_con03_bg-2.jpg') 50% 0 / auto no-repeat; height:54.1667%; background-size:cover; } 
.drop_down .tab-2 .wide_img .txt_box {text-align: right;padding-left: 45%;}
.drop_down .tab-3 .wide_img {background: url('m-images/m_con03_bg-3.jpg') 50% 0 / auto no-repeat; height:54.1667%; } 
.drop_down .tab-3 .wide_img .txt_box {text-align: center;}
.drop_down .tab-3 .wide_img .txt_box .txt {margin-left:-35%;}
.drop_down .tab-4 .wide_img {background: url('m-images/m_con03_bg-4.jpg') 50% 0 / auto no-repeat; height:54.1667%; } 
.drop_down .tab-4 .wide_img .txt_box {text-align: center;}
.drop_down .tab-4 .wide_img .txt_box .txt {margin-left:35%;color:#fff;}
.drop_down .tab-1 .wide_img .txt_box .txt_mo {display:none}

article .video_wrap .wrap {background: #000;}

article .section4 {background: #fff;text-align: center;padding: 0 0 5px 0;width:100%}
article .section4 .wrap h2 {padding: 15% 10px 5% 10px;}
article .section4 .cont {margin:0 20px;}
article .section4 .cont .box {margin-bottom:40px;text-align: left;display: flex;align-items: center;}
article .section4 .cont .box img {width:90%}
article .section5 {padding:40px 0;background: #fff;}
article .section5 .bt_gd { width:80%; margin:0 auto;}

article>.bottom_area>.wrap {text-align: center; padding: 3% 0;}

@media screen and (max-width: 720px) {
	#sidebar .fix {width:100%;}
}

@media screen and (max-width: 500px) {

	#sidebar .fix {}

	.drop_down .drop_down-nav {margin: -80px 10px 0 10px;}

	.drop_down .drop_down-nav label {background-size: contain !important;}
	.drop_down .drop_down-content .cont .txt {margin: 0 10px;}
	.drop_down .tab-1 .wide_img {background: url(m-images/m_con03_bg-1.jpg) 5% 0 / auto no-repeat; background-size: cover;}
	article .section2 .drop_down-content .wide_img .txt_box {padding: 15.5556% 8% 15.5556% 0;}
	.drop_down .tab-1 .wide_img .txt_box {padding-right: 20px;}
	.drop_down .tab-1 .wide_img .txt_box .txt {display:none}
	.drop_down .tab-1 .wide_img .txt_box .txt_mo {display:block}
	.drop_down .tab-3 .wide_img {background: url(m-images/m_con03_bg-3.jpg) 60% 0 / auto no-repeat; background-size: cover;}
	.drop_down .tab-3 .wide_img .txt_box .txt {margin-left: -20%;}
	.drop_down .tab-4 .wide_img {background: url(m-images/m_con03_bg-4.jpg) 40% 0 / auto no-repeat; background-size: cover;}
	.drop_down .tab-4 .wide_img .txt_box .txt {margin-left: 50%;}

	article .section2 .drop_down-content .wide_img .txt_box {font-size: 17px;}

	article .bt_gd {width:90%;font-size: 15px;padding: 16px 40px;}
	article .bt_gd span {font-size: 18px;}
	article .bt_gd img {right: 40px;}

	article .section4 .wrap h2 img {width:60%}

	article .section5 {padding:20px 0 50px 0}
	article .section5 .bt_gd, article .section2 .bt_gd {width:90%;margin: 40px auto 50px;}
	article .section5 .bt_gd {margin: 0 auto 20px auto;}

}

@media screen and (max-width: 400px) {

	.drop_down .tab-2 .wide_img .txt_box {padding-left: 30%;}
	.drop_down .tab-3 .wide_img {background: url(m-images/m_con03_bg-3.jpg) 70% 0 / auto no-repeat; background-size: cover;}
	
}

@media screen and (max-width: 360px) {

	.drop_down .tab-1 .wide_img .txt_box { padding-right: 20px; }

	article .bt_gd {font-size: 17px;}
	article .bt_gd span {font-size: 18px;}

	article .section4 .cont {margin: 0 10px;}

}

@media screen and (max-width: 320px) {

	.drop_down .tab-2 .wide_img {background: url(m-images/m_con03_bg-2.jpg) 40% 0 / auto no-repeat;}
	.drop_down .tab-4 .wide_img {background: url(m-images/m_con03_bg-4.jpg) 30% 0 / auto no-repeat;}
	.drop_down .tab-4 .wide_img .txt_box .txt { margin-left: 20%; }

}