@charset "utf-8";
iframe{ padding-bottom:30px;} /*0302  추가. 유투브영상과 이미지가 붙었을때 여백없는것방지*/
/* contents navigation*/
.content_nav{display:block;clear:both;float:left;width:257px;font-size:1.083em; background:#f5f5f5;}
.content_nav li{clear:both;float:left;margin:3px 0 1px 10px; padding:1px;}
.content_nav li li{clear:both;float:left;margin-left:14px; font-size:0.9em; /*text-transform:capitalize;*/}
.content_nav li.last{padding-bottom:100px;}
.content_nav li a{float:left; padding:1px;font-family: 'Lato', sans-serif;color:#333;cursor:pointer}
.content_nav li li a{float:left; padding:1px;font-family: 'Lato', sans-serif;color:#999;cursor:pointer}

.content_nav li a:hover, .content_nav li a.active{color:#000; background-image:url('images/line_bg.png');  background-position: -3px -3px; background-repeat: no-repeat;}
 #uxp a:hover, #info_per a:hover, #creative a:hover,#portfolio a:hover,#communication a:hover,#photography a:hover,#app_proto a:hover
,#uxp a.active,#uxp li.active a, #info_per a.active, #creative a.active,#portfolio a.active,#communication a.active,#photography a.active, #app_proto a.active{background-image:url('images/line_bg.png'); background-position: -20px -80px;}
#commondsgn a:hover,#commondsgn a.active {background-image:url('images/line_bg.png'); background-position: -20px -228px;}
#time a:hover,#time a.active{background-image:url('images/line_bg.png'); background-position: -20px -565px;}
#new_pro a:hover,#new_pro a.active{background-image:url('images/line_bg.png'); background-position: -20px -565px;}
#iiid a:hover,#iiid a.active{background-image:url('images/line_bg.png'); background-position: -20px -665px;}
#leadership a:hover,#leadership a.active{background-image:url('images/line_bg.png'); background-position: -5px -665px;}
#tacp a:hover, #tacp a.active{background-image:url('images/line_bg.png'); background-position: -5px -707px;}
.content_nav_mask{ position:relative; top:850px; left:-10px; background:#fff; width:280px; height:70px; -ms-transform:rotate(-10deg);transform:rotate(-10deg); -webkit-transform:rotate(-10deg); -moz-transform:rotate(-10deg);  -o-transform:rotate(-10deg);}
.top_img{position:relative; top:-200px;width:100%; height:240px; background:url('/images/courses/top.jpg') no-repeat center;  }

/*lnb */
 

/* courses */
.long_title{ line-height:220%; display:inline-block; margin-bottom:-24px;}
.crr{ padding:0;}
.crr_img{ display:block; padding-top: 40px; padding-bottom:40px; text-align:center;}
.courses_content{position:relative;width:100%}
.courses_content.active{display:block}
.courses_content:after{content:'';display:block;height:0;clear:both;visibility:hidden}
.courses_column{display:block;position:relative; top:30px; left:0; width:100%; margin-top:25px;} 
.courses_column h4{ margin-top:20px; padding-bottom:6px;}
.courses_column h4 span{font-family:'Lato', san-serif; font-weight:700;font-size:1.4em;color:#000;}
.courses_column .courses p{display:block;padding-bottom:12px; font-family:'Bitter', serif; font-size:1.1em;text-align:justify;color:#333}
.courses_column .courses.last p{padding-bottom:0}
.courses_info{ margin-top:20px; font-family:'Lato', san-serif; font-style:italic; font-size:1.0em; height:30px; border-bottom:1px solid #ebebeb;}
.courses_info .info{ float:left; margin-right:30px;}
.courses_info .box{ width:45px; background:#333; float:left; color:#fff; text-align:center; margin-right:5px;}


/*gallery*/

.gallery_area{margin-bottom:80px;}
.num_area{z-index:1000; position:relative; top:-170px; width:760px; height:18px; text-align:right;} 
.number{ display:none;} 
.gallery_list{ overflow:hidden; width:760px; height:150px; margin-top:10px;}  
.gallery_nav li{ display:inline-block; float:left; margin:0; padding:0; }
.gallery_nav li img{ margin:0; padding:0;}
.gallery_list .numbering{ text-align:right; margin-right:10px; margin-bottom:3px;}
.gallery_img img{ margin-bottom:20px;}
.gallery_imgs img{ margin-bottom:-5px;}
.gallery{display:none;clear:both; position:relative; top:0px;background:#252525; width:760px; text-align:center; padding-bottom:22px;}
.gallery h5{padding-top:20px; padding-left:28px; color:#fff; text-align:left;}
.gallery h5 span{ font-family:'Lato', san-serif; font-weight:700; font-size:1.4em; }
.gallery .name{ padding-left:28px; margin-bottom:10px; color:#fff; width:700px; }
.gallery .name p{font-family:'Lato', san-serif; font-weight:700; font-size:1.2em; color:#fff; text-align: justify;}
.deactive{ display:none;}
.active{ display:block;} 
.gallery_nav a:hover,.gallery_nav a.active{border: solid 5px #0099ff; opacity:1.0;}
.gallery_nav a:hover img,.gallery_nav a.active img{ margin:-5px; opacity:1.0;}
a.img_thumb, a.img_thumb img, a.img_select, a.img_select img{float:left; overflow:hidden; opacity:0.7;}
/*a.img_thumb:hover, a.img_select{ border: solid 5px #0099ff; opacity:1.0;}
a.img_thumb:hover img, a.img_select img{ margin:-5px; opacity:1.0;}*/ 
.pt{ margin-left:30px; width:700px;}
.pt h6{ color:#fff; text-align:left;text-decoration:underline;}
.pt h6 span{ font-family:'Lato', san-serif; font-weight:700; font-size:1.2em; }
.gallery .description p,.gallery .description span{ color:#fff;} 
.description a{font-family:'Lato','Noto Sans',sans-serif; font-weight:bold; color:#0099ff; text-align:left;}
.description .ko{ font-family:'Noto Sans','NanumGothicBold',sans-serif;}/*0302 추가 작품설명 한글혼용일떄 */
.description .sub_title{font-size:1.1em; font-weight:700; margin-bottom:-10px;} 
.left{ display:inline-block; float:left;}
.left img{ margin-right:15px;} 
.cl { clear:both;} 
.untitle{padding-top:40px;}
.linethrough{text-decoration:line-through;}
.gallery_nav span{ float:left;}
.prev_btn{ position:relative; z-index:500; top:-100px; left:10px;}
.next_btn{position:relative; z-index:500;top:-100px; left:680px;}


/* download */
.cr_download{ float:left; display:inline-block; position:relative; top:30px; left:0;  }
.cr_download a span{ padding-right:20px;border-bottom: solid 1px #000000; height:15px; font-family:'Lato', san-serif; font-weight:400;font-size:1.0em;color:#333;  text-transform:uppercase; background-image:url('images/arr_down.png');background-repeat:no-repeat;  background-position: bottom right;}
.cr_download a:hover span{color:#0099ff; background-image:url('images/arr_down.png');background-repeat:no-repeat;   background-position: top right; border-bottom: solid 1px #0099ff;} 

/*table*/
.table_area{ position: relative; top:0; left:0;}
.table_area h4 span{font-family:'Lato', san-serif; font-weight:700;font-size:1.4em;color:#000;}
.table_area table{ margin-top:5px;border-collapse: collapse; width: 100%;  }
.table_area td{padding: 5px; border-top: 1px solid #999; border-bottom: 1px solid #999; font-size:1.05em;} 
.table_area tr{ height:45px;}
.table_area tr:last-child{ height:50px;}
.table_area td:first-child{ width:5%; text-align: center;}
.table_area td:last-child{ width:50%;  }
.table_area table tbody .alt td { background: #f9f9f9; }