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

/* reset */
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0;font-family:'Noto Sans KR',Malgun Gothic,'맑은 고딕',Gulim,Dotum,Helvetica,sans-serif; font-size:15px; font-weight:300;letter-spacing:-0.025em;}
table{border-collapse:collapse;border-spacing:0}
fieldset,img{border:0}
address,caption,em{font-weight:normal}
ul,ol,dl{list-style:none}
select{vertical-align:middle}
caption{visibility:hidden;margin:0;padding:0;border:none;font-size:0;line-height:0}
legend{display:block;position:absolute;top:-9999px;left:-9999px;width:1px;height:1px;overflow:hidden;font-size:0;line-height:0;text-indent:-9999px}
input,button,textarea,option{font-style:inherit;font-size:inherit;font-family:inherit;font-weight:inherit; resize:none;}
a:link,a:visited,a:active{color:#444;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent-webkit-tap-highlight-color:rgba(0,0,0,0);}
a:focus,a:hover{color:#444}
.txt_b{text-indent:-9999px}
.blind{display:block;position:absolute;top:-9999px;left:-9999px;width:1px;height:1px;overflow:hidden;font-size:0;line-height:0;text-indent:-9999px}


/* layout */
.inner{ position:relative; width:1000px; margin:0 auto;}
.sec02, .sec03, .sec04{ padding:120px 0 100px;}
.sub_title{padding:0 0 20px; color:#222; font-size:50px; font-weight:200; line-height:1.3; text-align:center; letter-spacing:-0.045em; }
.sub_title strong{ font-weight:500;}

#u_skip{ position:fixed; top:50%; right:80px; margin-top:-150px; z-index:100;}
#u_skip ul li.line span{ display:block; width:3px; height:15px; background:#aaa; margin:0 auto;}
#u_skip ul li a{ display:block; width:50px; height:50px; line-height:50px; text-align:center; border:3px solid #aaa; border-radius:30px; color: #aaa; font-size:24px; font-weight:500;}
#u_skip ul li a.on{ background:#aaa; color:#fff;}


/* sec01 */
.sec01{ background:#000 url(../images/bg_sec01.jpg) center 0 no-repeat; background-size:100%;}
.sec01 .inner{ height:700px; text-align:center;  padding-top:200px; color: #fff;}
.sec01 .inner .logo_star{ display:block; position:absolute; top:20px; left:0; width:150px; height:60px; background:url(../images/img_sprite.png) 0px 0px no-repeat;}
.sec01 .inner .logo_star2{ display:block; position:absolute; top:20px; right:0; width:150px; height:180px; background:url(../images/img_sprite.png) 0px -60px no-repeat;}
.sec01 .inner h1{ position:relative; font-size:100px; font-weight:500; line-height:1.2; opacity:0; top:30px; }
.sec01 .inner h3{ position:relative; font-size:32px; font-weight:200; margin-top:20px; opacity:0; top:30px;}
.sec01 .inner h3 strong{ font-weight:500;}
.sec01 .inner .desc{ position:relative; font-size:21px; font-weight:400; padding-top:50px; opacity:0; }
.sec01 .inner h1.on{opacity:1; top:0; transition:all 1.5s ease 0s;}
.sec01 .inner h3.on{opacity:1; top:0; transition:all 1s ease 1s;}
.sec01 .inner .desc.on{opacity:1; transition:all 1.5s ease 2s;}


/* sec02 */
.sec02 .desc{color:#555; font-size:21px; text-align:center;}
.sec02 .inner .sub_title{ opacity:0; transition:1.5s;}
.sec02 .inner .sub_title.on{ opacity:1;}
.sec02 .inner .desc{ opacity:0; transition:1.5s;}
.sec02 .inner .desc.on{ opacity:1;}

.photo{ max-width:100%; margin-top:50px; opacity:0; transition:1.5s;}
.photo.on{ opacity:1;}
.photo .main{ position:relative; height:500px; margin-bottom:2px; background:url(../images/photo_01.jpg) no-repeat;}
.photo .main .profile{ position:absolute; right:75px; width:370px; height:500px; padding:40px 50px; background:rgba(0,0,0,0.85); box-sizing:border-box;}
.photo .main .profile p{ color:#fff; line-height:1.4;}
.photo .main .profile .p1{ padding-bottom:15px; border-bottom:1px solid #555;}
.photo .main .profile .p2{ padding-top:15px;}
.photo .main .profile .t1{ display:block; padding-bottom:20px; font-size:18px;}
.photo .main .profile .t2{display:block; font-size:18px; font-weight:400;}
.photo .main .profile .t3{display:block; color:#888; font-size:16px;}
.photo ul{overflow:hidden; clear:both;}
.photo ul li{ display:block; float:left; width:332px; height:240px; margin-left:2px;}
.photo ul li.fst{margin-left:0;}
.photo ul li img{width:100%;}


/* sec03 */
.sec03{ overflow:hidden; background:#172244; color:#fff;}
.sec03 .sub_title{ color: #fff; padding-bottom:50px; opacity:0; transition:1.5s;}
.sec03 .sub_title.on{ opacity:1;}

.guide{ padding:60px 0; background:#121b36; border-radius:10px; opacity:0; transition:1.5s;}
.guide.on{ opacity:1;}
.guide ul{width:780px; margin:0 auto;}
.guide ul li{ font-size:21px; padding:30px 0 30px 180px;}
.guide ul li.l1{ background:url(../images/ico_guide01.png) 0 center no-repeat;}
.guide ul li.l2{ background:url(../images/ico_guide02.png) 0 center no-repeat;}
.guide ul li.l3{ background:url(../images/ico_guide03.png) 0 center no-repeat;}
.guide ul li .t1{ display:block; font-weight:500;}
.guide ul li .t2{ color:#eee;}


/* sec04 */
.sec04{ position:relative; min-height:1560px; background:#000 url(../images/bg_sec04.jpg) center 0 no-repeat; background-size:100%;}
.sec04 .mask{ position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.7);}
.sec04 .inner{ height:700px; text-align:center; color: #fff; z-index:10;}
.sec04 .box{height:280px; background:url(../images/bg_subtitle04.png) center 0 no-repeat;}
.sec04 .box .sub_desc{ font-size:21px; padding:20px 0 5px; opacity:0; transition:1.5s;}
.sec04 .box .sub_desc.on{ opacity:1;}
.sec04 .box .sub_title{ color: #fff; font-size:60px; opacity:0; transition:1.5s;}
.sec04 .box .sub_title.on{ opacity:1;}
.sec04 .box .sub_title .em{ color: #fff100;}

.program{ width:780px; margin:0 auto; padding:100px 0 200px; background:url(../images/bg_program.png) right 170px no-repeat; text-align:left; opacity:0; transition:1s;}
.program.on{ opacity:1;}
.program ul li{ font-size:21px;}
.program ul li .t1{ display:block; font-weight:500;}
.program ul li .t2{ display:block; padding-bottom:20px;}
.program ul li .em{color: #fff100;}

.tbl{ display:block; position:relative;}
.tbl dl{ position:absolute; top:-50px; right:0; width:540px;}
.tbl dl dt, .tbl dl dd{ display:block; overflow:hidden; font-size:21px; line-height:45px;}
.tbl dl dt{font-weight:500; text-align:center; border-top:1px solid #fff; border-bottom:2px solid #fff;}
.tbl dl dd{border-bottom:1px solid #fff;}
.tbl dl .time{ display:block; float:left; width:20%; text-align:center;}
.tbl dl .programs{display:block; float:left; width:80%; text-indent:50px;}

.btn_lnk{clear:both; width:78%; margin:80px auto 0;}
.btn_lnk a{ display:block; padding:20px 100px;  background:#fff; color:#000; text-align:center; font-size:50px;}
.btn_lnk a strong{ font-weight:500;}

@media screen and (max-width: 768px) {
    
    .sec01{ background:#000 url(../images/bg_sec01.jpg) center 0 no-repeat; background-size:auto 100%;}
    .sec04{ position:relative; min-height:1560px; background:#000 url(../images/bg_sec04.jpg) center 0 no-repeat; background-size:auto 100%;}

}