@charset "utf-8";
/* CSS Document */
body {font-family:'Noto Sans KR', 'sans-serif';}

@font-face {font-family: 'Noto Sans Korean', 'Noto Sans KR', 'sans-serif', "나눔고딕";
	src:url(https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/stylesheets/NotoSansKR-Hestia.css);
	src:local(※), url(http://www.darakwon.co.kr/css/fonts/NanumGothic.ttf) format('truetype'), url(http://www.darakwon.co.kr/css/fonts/NanumGothic.otf) format('opentype');
}


img{ border:none; padding:0; margin:0;}
input.radio {width:13px;height:13px; vertical-align:top; padding:0px; margin:0px;}
ul,li{padding:0; margin:0; list-style:none;}
* {font-family:'Noto Sans Korean', 나눔고딕, ng, arial;}
body {color:#FFF;font-size:12px;line-height: 1.5;font-family:'Noto Sans Korean',NanumGothic, 나눔고딕, ng, arial;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button{margin:0;padding:0} 
img,fieldset,iframe{border:0 none}
dl,ul,ol,menu,li{list-style:none}
img, input, button, select, textarea {vertical-align:middle;}
button {overflow:visible;margin:0;padding:0;border:none;background:0;vertical-align:middle;cursor:pointer;}
button::-moz-focus-inner,  
input::-moz-focus-inner{border:0;padding:0;}
.blind{display:block;overflow:hidden;*position:absolute;top:0;left:0;width:0;height:0;border:0;background:none;font-size:0;line-height:0;}

.Bar_container {z-index:999;    position: fixed;    left: 0;    bottom: 0;    width: 100%;   height:86px;    background: #FFF; border-top:1px solid #000}
.Bar_inner{display:flex; justify-content: center;max-width:540px;margin: 0 auto;padding: 0px 0 0 0;box-sizing: border-box;position:relative; max-width:830px; height:auto; margin:0 auto; }
.Bar_txt{  margin-left: 0px; width: 254px; padding-top: 1%}

.Bar_selectButton{position: relative;width: 100%;padding: 10px 10px;font-size: 20px;font-weight: 600;text-align: left;box-sizing: border-box;background: #fff;}

.Bar_selectButton:after {content: ""; position: absolute;top: -10px;right: 16px;bottom: 0;width: 0;height: 0;margin: auto;border: 10px solid transparent;border-bottom-color: #000;opacity: .7;}

.Bar_ListWrap {position: absolute;left: 0;bottom: 100%;width: 100%;height: 0;max-height: 600px;border: 1px solid #000;box-sizing: border-box;    background: #fff;}
.Bar_ListWrap.Bar_open {overflow-y: auto;    height: auto;}

.ButtonWrap {width: 209px;    margin-left: 15px; }


.Item_wrapper {position: relative;    padding: 10px 12px 15px;    letter-spacing: -.5px;    background: #fff;    cursor: pointer;}
.Item_wrapper {margin: 0;   padding: 15px 10px 10px;   border-top: 1px solid #000;}
/*.top_btn a {width: 50px;height: 50px;color: #ffffff;position: fixed;z-index: 99999;bottom: 12px;right: 20px;}*/
.top_btn a {width: 50px;height: 50px;color: #ffffff;position: fixed;z-index: 99999;bottom: 99px;right: 41px;}
div.Control {width: 79px;left: 10px;top: 0;position: absolute;}
.top_join1124 {display: inline;height: 25px;line-height: 25px;padding: 0 7px;font-size: 13px;color: #1e75d6;border-radius: 2px;border: 1px solid #1e75d6;float:right;}
.top_lgfind {display: inline;height: 25px;line-height: 25px;padding: 0 7px;font-size: 13px;color: #1e75d6;border-radius: 2px;border: 1px solid #1e75d6;float:right;margin-right:5px;}
.loginform button {background: #1e75d6;padding: 18px 20px;font-size: 16px;border: 0;letter-spacing: 1px;color: #ffffff;cursor: pointer;width: 100%;box-sizing: border-box;font-family: 'Nanum Gothic Bold';margin-top: 22px;text-align:center}
.loginform p {margin: 10px 0 15px 0;}
.loginform table{}
.loginform table th{text-align:center; padding-bottom:10px;}
.loginform table td input {padding: 7px;background: #ffffff;border: 1px solid #e1e1e1;color: #999999;font-family: Arial, Helvetica, sans-serif;margin-top: 8px;width: 100%;height: 43px;box-sizing: border-box;}
.loginform p input {padding: 0 10px;background: #ffffff;border: 1px solid #e1e1e1;color: #999999;font-family: Arial, Helvetica, sans-serif;margin-top: 8px;width: 100%;height: 49px;box-sizing: border-box;}
.loginform .keep_area label {color: #999999;margin-left: 5px;font-size: 14px;}
.loginform .keep_area .ckbox {height: 22px;width: 23px;vertical-align: middle;}
.ban_btm {position: fixed;left: 0;bottom: 0;z-index: 1000;width: 100%;height: 140px;text-align: center;background:url(images/ban_bg.jpg) repeat-y;border-top: 2px solid #fff;}

/*  레이어 */
.wrap_layer_popup {display: none;position: absolute;left: 50%;z-index: 999;padding: 0;background: #fff;padding:30px;}
.wrap_layer_popup .bt_close {position: absolute;top: -42px;right: 0;}
.layer_popup_bg {opacity:0.3; -moz-opacity:0.3;   z-index: 997;}

/* top_header */
#top_header1 {width:100%; height:34px; background-color:#f3f2f7; overflow: hidden;}
#top_header2 {width: 100%;max-height:100px;background-color: #935cc7;overflow: hidden;}
#top_header2 .top_header_in {max-width: 830px; width: 100%; margin: 0 auto; padding: 0;}
#top_header2 .top_header_in img{width: 100%;}
#top_header2 #top_header_left { float: left; }
*{padding:0; margin:0;}
ul, li, dd, dt, dl{list-style:none;}




/* contents */
.contents{position: relative; background-color:#FFF;}
.sec01 {background-color: #ead5ff;}
.sec02 {background-color: #ece2f3;}
.sec03 {background-color: #fff;}
.sec04 {background-color:#fff;}
.sec05 {background-color: #fff;}
.sec06 {background-color: #FFF;}
.sec07 {background-color: #e9d7fd; }
.sec08 {background:url(../images/event_bg_08.jpg) top center; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover; }

.pt7{padding-top:7%;}
.pt5{padding-top:5%;}
.pb7{padding-bottom:7%;}

.eventimg{position:relative; max-width:830px; height:auto; margin:0 auto;}
.eventimg img{ height:auto;width:100%; margin:0 auto; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}

*, *:before, *:after {box-sizing: inherit;}
.align-left {float: right;margin-left: 20px;}
.align-right {float: right;margin-left: 20px;}
.slide-in {opacity: 0;transition: all .5s;}
.align-left.slide-in {transform: translateY(30%) scale(0.95);}
.align-right.slide-in {transform: translateX(30%) scale(0.95);}.slide-in.active {opacity: 1;transform: translateX(0%) scale(1);}


/* topbg */
.eventtopbg{ position:relative; width:100%;  height:auto; background:url(../images/top_bg_01.jpg) top center; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}
.topimg{width:100%; max-width: 830px; margin:0 auto;}
.topimg img{height:auto;width:100%; margin:0 auto; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}


.eventtopbg .inner{position:absolute;top: 64%;max-width: 830px;width: 100%; margin:0 auto; border: 0px solid red}

.eventtopbg .bubble01{position: absolute; top: 68.5%; left:1%;  width:58%; max-width: 460px;}
.eventtopbg .bubble01 img{width: 100%;  max-width:460px; animation: bubble 2.5s infinite 1s;}
.eventtopbg .bubble02{position: absolute; top:60.3%; left: 49.5%;  width:58%;max-width: 407px;}
.eventtopbg .bubble02 img{width: 100%;  max-width:407px;  animation: bubble 2.5s infinite 0s;}

 @keyframes bubble{
  0% {transform: translatey(0px);}
  50% {transform: translatey(-35px);}
  100% {transform: translatey(0px);}  
}

 @keyframes bubble2{
  0% {transform: translatey(0px);}
  50% {transform: translatey(-15px);}
  100% {transform: translatey(0px);}  
}


.eventtopbg h1{width:137px;height:30px; top:32px; left:50%; position:absolute; margin:0 0 0 -445px; z-index: 3;}
.eventtopbg .util{position:absolute;left:50%;top:32px; z-index:2;width:960px;margin-left:-496px;text-align:right; color:#ffffff;}
.eventtopbg .util a{color:#ffffff;text-decoration:none;margin:0 2px;}

.benefit-col{ }
.benefit-col .laptop_bg{position: absolute; margin-top: -2px; max-width: 395px; width:47.5%; left: 50%; transform: translate(-50%, 0%); z-index:5; padding-left: 3px;}
.benefit-col .laptop_bg img{width: 102%;}

.benefit-col .lecture-slide{position:relative; max-width:830px; width: 100%;height:280px;padding-top:7.5px;  margin:0 auto;overflow:hidden;}
.benefit-col .lecture-slide li{ width: 33.3%; max-width:280px;}
.benefit-col .lecture-slide li{min-height:5em; margin:0 auto;}
.benefit-col .lecture-slide ul *{-webkit-transition:all .2s ease-in-out; -moz-transition:all .2s ease-in-out; -o-transition:all .2s ease-in-out; -ms-transition:all .2s ease-in-out; margin:0 auto; width: 100%;}
.benefit-col .lecture-slide li span{display:block; position:absolute; top:0; right:0; left:0; margin:auto; transform:scale(0.9);}
.benefit-col .lecture-slide li span img{position:relative;max-width:100%; opacity:.8}
.benefit-col .lecture-slide li::after{content: ''; display: block; clear: left;}
.benefit-col .lecture-slide li.active{z-index:2;}
.benefit-col .lecture-slide li.active span{padding-top:0.5em; transform:scale(1.2);}
.benefit-col .lecture-slide li.active img{opacity:1;}


.benefit-col .lecture-slide .bx-viewport{overflow:visible !important;}
.benefit-col .lecture-slide .bx-controls-direction .bx-prev{display:block; position:absolute; top:10em; left:6em; width:64px; height:64px; background:url(images/btn_media_prev.png) no-repeat 50% 50%; text-indent:-9999px; z-index:3;}
.benefit-col .lecture-slide .bx-controls-direction .bx-next{display:block; position:absolute; top:10em; right:5em; width:64px; height:64px; background:url(images/btn_media_next.png) no-repeat 50% 50%; text-indent:-9999px; z-index:3;}
.benefit-col li p{ opacity:0;}



@media(max-width:830px){
	.laptop_bg{display: none;}
		
}
/*상단고정탭*/
.fixed_top{position: fixed;    bottom: auto;    top: 0; z-index: 99;}

/* sec01 */
.img1{ position:relative; width:100%;  }
.lecture_img{position:absolute; top:48.8%; left: 14.0%; width:28.6%; z-index:10; }
.lecture_img img{width:95.4%;}
.benefit_img{position:absolute; top:48.8%; left: 58%; width:30%; z-index:10; }
.benefit_img img{width:100%;}

/* sec02 */
.sec02 .tabSection{width: 100%; height: 115px; background-color: #9454c9;}
.sec02 .tabSection .inner{max-width: 830px;width: 100%; margin:0 auto;}
.sec02 .tabSection .inner ul li{width: 50%; height: 100%; padding:31px 0px;  float: left; text-align: center; display: block; box-sizing: border-box; vertical-align: middle}
.sec02 .tabSection .inner ul li:first-child{border-right: 1px solid #b284d8;}
.sec02 .tabSection .inner ul li a{width: 100%; height:100%; display: block;}

/* sec03 */
.sec03{position: relative;}
.sec03 .lec_tab{width: 100%;max-width:830px; margin:0 auto; padding: 0 50px;  box-sizing: border-box;}
.sec03 .lec_tab ul li{width: 33%;float: left; text-align: center; display: block; padding:0px 10px; }
.sec03 .lec_tab ul li img{width: 100%;}

.sec03 .lec_wrap{ width: 100%; max-width:830px; margin:0 auto;}
.sec03 .lec_wrap .lec_list{ display: flex; flex-wrap: wrap; flex-direction: row;justify-content:center; width: 100%; }
.sec03 .lec_wrap .lec_list .lec_item{width: 33%; padding:25px 1% ; box-sizing: border-box; text-align: center}
.sec03 .lec_wrap .lec_list .lec_item img{width: 100%;}





/* sec04 */

.sec04{position: relative;}
.sec04 .pk_tab{width: 100%;max-width:830px; margin:0 auto; padding: 0 10px;  box-sizing: border-box; }
.sec04 .pk_tab ul li{width: 25%;float: left; text-align: center; display: block; padding:0px 5px; }
.sec04 .pk_tab ul li img{width: 100%;}

.sec04 .pk_wrap{ width: 100%; max-width:830px; margin:0 auto;}
.sec04 .pk_wrap .pk_list{display: flex; flex-wrap: wrap; flex-direction: row;justify-content:center; width: 100%; padding-top:15px;}
.sec04 .pk_wrap .pk_list .pk_item {padding:15px 2% ; }
.sec04 .pk_wrap .pk_list .pk_item img{width: 100%;}

.sec03 .guide_wrap, .sec04 .guide_wrap{ border-top: 1px solid #d8d8da; border-bottom: 1px solid #d8d8da; text-align: center; width:95%; max-width: 830px; margin:0 auto; padding: 12px 0px; margin-top: 70px; margin-bottom: 100px;}
.sec03 .guide a img, .sec04 .guide a img{width:35%; max-width: 154px;}
.sec03 .guide_wrap .guide_txt, .sec04 .guide_wrap .guide_txt{padding-top: 15px;}
.sec03 .guide_wrap .guide_txt > p, .sec04 .guide_wrap .guide_txt > p{text-align: center; color: #b9b9b9; font-size: 14px; padding: 3px 0px}
.sec03 .guide_wrap .guide_txt > p > strong, .sec04 .guide_wrap .guide_txt > p > strong{color: #9a9a9a}
.sec03 .guide_wrap .guide_txt > p > a, .sec04 .guide_wrap .guide_txt > p > a{color: #894dc2; font-weight: bold; text-decoration: underline}



@media(max-width:670px){
	.sec03 .tab{padding: 0 10px; }
	.sec03 .tab ul li{ padding:0px 5px;}	
	.sec03 .lec_wrap .lec_list .lec_item{width: 50%; }
	.sec03 .lec_tab{padding: 0 40px;}
	.sec03 .lec_tab ul li{padding:0px 5px; height:42px;}
	.sec03 .lec_tab ul li img{height: 100%; width:auto }
	.benefit-col .lecture-slide{height:215px;}
	.sec04 .pk_tab ul li{ padding:0px 3px;}
	
}




/* 유의사항 */
.evt_foot{position:relative; width:100%; max-width:3000px; margin:0 auto; text-align:left; background-color:#7e7e7e; padding-top:60px}
.evt_foot .f_tab{width:970px; margin:0 auto;position:relative;height:70px}
.evt_foot .f_tab .tab1 a{ display:block; width:254px; height:64px; float:left;background:url('../images/footer_btn.png') no-repeat 0 -75px; margin-right:15px}
.evt_foot .f_tab .tab1 a:hover, .evt_foot .f_tab .tab1 a.selected{ background-position:0 0 }
.evt_foot .f_tab .tab2 a{display:block; width:254px; height:64px; float:left;background:url('../images/footer_btn.png') no-repeat -267px -75px;}
.evt_foot .f_tab .tab2 a:hover, .evt_foot .f_tab .tab2 a.selected{ background-position:-267px 0 }
.evt_foot .f_tab .event_btn{position:relative; margin:10px 0; float:right;}
.evt_foot .footertext {position:relative; margin:0 auto; width:960px; padding:35px 0 55px 50px; color:#ffffff;}
.evt_foot .footertext a{ color:#ffff00;}
.evt_foot .footertext .tit{ font-size:14px;  display:block; padding-bottom:5px;  color:#fff4ac; padding-bottom:5px; text-decoration:underline}
.evt_foot .footertext strong{ font-size:14px; }
.evt_foot .q_list{position:relative; margin:0 auto; width:960px;}
.evt_foot .q_list div.q_txt{ padding-bottom:5px; cursor:pointer;}
.evt_foot .q_list div.a_txt{ font-size:16px; color:#FFF; padding:5px 30px 15px 30px;}
.evt_foot .q_list div.a_txt a{font-size:16px; color:#57c1e9; text-decoration:underline; }

/*간편로그인*/
.login_tit {display: block;width: 300px;margin:0 auto;color: #999;text-align: center;position: relative;font-size: 15px;}
.join_sns{width: 300px;margin:0 auto;padding-bottom: 15px}

span.Error{font-size: 12px; display: block;  padding-left:0px; letter-spacing: -0.3px;  color: red;  margin-top: 2px;  margin-left: 0px; text-align: left;}