@charset "euc-kr";
@font-face{font-family:'NanumGothic'; src:local('/font/NanumGothic.ttf'), url('../font/NanumGothic.ttf'), url('../font/NanumGothic.eot')}
@font-face { font-family: 'S-CoreDream-4Regular'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.woff') format('woff'); font-weight: normal; font-style: normal; }
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); 

/*CSS Document*/

/* reset css */

body{margin:0; padding:0; /*background:url(../img/comm/header_bg.jpg) top center repeat-x*/}
html{overflow-y:scroll;}
body, table, th, td, input, select, textarea, div{font-family:'Noto Sans KR', 'S-CoreDream-4Regular','Dotum',Helvetica; font-size:13px; color:#2f2f2f; line-height:1.6;font-weight: 500!important}
h1, h2, h3, h4, h5, h6, ol, ul, li, hr, p{margin:0; padding:0;}
img, fieldset{border:0 none;}
img{vertical-align:baseline;}
ol, ul, li{list-style:none;}
table{border-spacing:0; border-collapse:collapse; border:0 none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}

button{border:0 none; padding:0; margin:0; background:transparent; *overflow:visible; cursor:pointer;}
label{cursor:pointer;}

a:link{color:#333333; text-decoration:none; selector-dummy:expression(this.hideFocus=true); outline:none;}
a:visited{color:#333333; text-decoration:none; selector-dummy:expression(this.hideFocus=true); outline:none;}
a:hover{color:#cb7803; text-decoration:none; selector-dummy:expression(this.hideFocus=true); outline:none;}
a:active{color:#333333; text-decoration:none; selector-dummy:expression(this.hideFocus=true); outline:none;}

input{border:solid 1px #d1d1d1;}
input[type="text"]{padding:0 3px; ;}
select{border:solid 1px #d1d1d1;}

button::-moz-focus-inner{border:0; padding:0;}

/* Çì´õ */
.header_wrap{ height:100px; overflow:hidden; background: rgba(0, 0, 0, 0.5); }
#header{width:1000px; margin:0 auto;}
#header h1{margin:45px 0 0px; float:left;}
#header ul{margin-top:55px; float:right;}
#header ul li{float:left; font-size:15px; font-weight:400; margin-left:58px;}
#header ul li.first{margin-left:0;}
#header ul li a{color:#fff;}
#header ul li a:hover{color:#98cbea;}

/* ºñÁê¾ó */
#Visual { width:1000px; height:570px; position:absolute; top:100px; z-index:9998;visibility: hidden;}


/* ¸ÞÀÎ ÄÁÅÙÃ÷1 */
@media (min-width:981px) {
	#m_container{width:1200px; margin:0 auto; overflow:hidden;}
}
@media (max-width:980px) {
	#m_container{; margin:0 auto; overflow:hidden;}
}
#m_container h4{font-size:18px; color: #454545; font-weight:600;}
/* ¸ÞÀÎ ÄÁÅÙÃ÷1 ³»¿ë*/
.snip1360 {position: relative;  float: left;  overflow: hidden;  margin-right:20px;  min-width: 320px;  max-width: 320px;  width: 100%;  color: #141414;  text-align: left;  line-height: 1.4em;  font-size: 16px;  background-color: #ffffff;}
.snip1360 * {  -webkit-box-sizing: border-box;  box-sizing: border-box;  -webkit-transition: all 0.25s ease;  transition: all 0.25s ease;}
.snip1360 img {  max-width: 100%;  vertical-align: top;}
.snip1360 figcaption {  width: 100%;  background-color: #ffffff;  padding: 10px 25px 55px;  position: relative;}
.snip1360 figcaption:before {  position: absolute;  content: '';  z-index: 2;  bottom: 100%;  left: 0;  width: 100%;  height: 80px;  background-image: -webkit-linear-gradient(top, transparent 0%, #ffffff 100%);  background-image: linear-gradient(to bottom, transparent 0%, #ffffff 100%);}
.snip1360 figcaption a {  position: absolute;  bottom: 0;  left: 0;  padding: 10px;  background-color: #f49c00;  color: #fff;  font-size: 14px;  text-transform: uppercase;  opacity: 0.65;  width: 100%;  text-align: center;  text-decoration: none;  letter-spacing: 1px;}
.snip1360 figcaption a:hover {  opacity: 1;}
.snip1360 h2 {  margin: 0 0 10px;  font-weight: 700;  font-size: 16px;  line-height: 1.2em;    text-transform: uppercase;  color:#666;}
.snip1360 p {  margin: 0 0 10px;  font-size: 0.9em;  letter-spacing: -1px;  opacity: 0.9;}

.snip13601 {position: relative;  float: left;  overflow: hidden;  min-width: 320px;  max-width: 320px;  width: 100%;  color: #141414;  text-align: left;  line-height: 1.4em;  font-size: 16px;  background-color: #ffffff;}
.snip13601 * {  -webkit-box-sizing: border-box;  box-sizing: border-box;  -webkit-transition: all 0.25s ease;  transition: all 0.25s ease;}
.snip13601 img {  max-width: 100%;  vertical-align: top;}
.snip13601 figcaption {  width: 100%;  background-color: #ffffff;  padding: 10px 25px 55px;  position: relative;}
.snip13601 figcaption:before {  position: absolute;  content: '';  z-index: 2;  bottom: 100%;  left: 0;  width: 100%;  height: 80px;  background-image: -webkit-linear-gradient(top, transparent 0%, #ffffff 100%);  background-image: linear-gradient(to bottom, transparent 0%, #ffffff 100%);}
.snip13601 figcaption a {  position: absolute;  bottom: 0;  left: 0;  padding: 10px;  background-color: #f49c00;  color: #fff;  font-size: 14px;  text-transform: uppercase;  opacity: 0.65;  width: 100%;  text-align: center;  text-decoration: none;  letter-spacing: 1px;}
.snip13601 figcaption a:hover {  opacity: 1;}
.snip13601 h2 {  margin: 0 0 10px;  font-weight: 700;  font-size: 18px;  line-height: 1.2em;   text-transform: uppercase;  color:#666;}
.snip13601 p {  margin: 0 0 10px;  font-size: 0.9em;  letter-spacing: -1px;  opacity: 0.9;}

.main_map {background:#e46b13; margin-top:30px;}
.map_info {width:1000px; margin:0 auto;}
.main_map h2 {font-size:22px; padding:10px; text-align:center;  color:#fff;}
.main_map p	{ font-size:16px; padding:10px; text-align:center;  color:#fff;}


.banner_txt { text-align:center; background:#e5e5e5;; border-bottom:1px solid #e5e5e5;; padding:30px 0 0 0; }

.subimg { text-align:center; padding:20px 0; }
#Sub_bg { background:#fff; }
#Sub_Wrap { width:1000px; margin: 0 auto; overflow:hidden; }

#Sub_Category { float:left; width:200px; margin-top:50px; }
#Sub_Container { float:right; width:750px; margin-top:50px;  }

/*¼­ºêÄ«Å×°í¸®*/
#Sub_Category .Category_Title { padding:30px 0 15px 20px; letter-spacing:-0.05em; background:#e4984a;    border-radius: 10px 10px 0 0; }
#Sub_Category .Category_Title span { color:#FFF; font-size:13px; }
#Sub_Category h2 { font-size:18px; font-weight:normal; color:#fff;  height:40px; line-height:40px;  }
#Sub_Category ul { border-width:0px 1px 0px; border-style:solid; border-color:#ddd; }
#Sub_Category li { border-bottom:1px solid #ddd; background:#fff; }
#Sub_Category li a { display:block; line-height:1.2!important; color:#666; padding:13px 0 13px 20px; font-size:12px; }
#Sub_Category li a:hover { background:url(../img/comm/arrow.png) no-repeat 90% 17px #f8f8f8; }
#Sub_Category li.on a  { font-weight:bold; color:#000; background:url(../img/comm/arrow.png) no-repeat 90% 17px #fff; }

/*¼­ºêŸÀÌƲ*/
#Sub_Title { position:relative; border-bottom:1px solid #ddd; height:48px;}
#Sub_Title h3 { position:absolute; font-size:20px; font-weight:normal; color:#333; letter-spacing:-0.05em;  }
#Sub_Title ul { position:absolute; overflow:hidden; right:0; top:10px; }
#Sub_Title li { float:left; color:#666; letter-spacing:-0.05em; padding-left:15px; background:url(../img/comm/arrow.png) no-repeat 4px -29px;  font-size:12px !important;}
#Sub_Title li.home {  background:url(../img/comm/home.png) no-repeat 4px 4px; }
#sub_title ul li span{color:#555;  }

/*¼­ºêÄÁÅÙÃ÷*/
#sub_top {width: 100%; background: url('../img/main/visual_sub.jpg');  height: 250px;}
#sub_top p{text-align: center; font-size: 24px;  color: #fff; padding-top: 134px;}
#Sub_Body  { margin-top:30px; min-height:500px; padding-bottom:0px; }



/* ǪÅÍ */
.footer_wrap{background:#f5f5f5; border-top:1px solid #ddd; overflow:hidden; }
#footer{width:786px; margin:0 auto; background:url(../img/comm/f_logo.png) left 30px no-repeat; padding-left:214px; overflow:hidden;}
#footer ul{margin-top:30px; overflow: hidden;}
#footer ul li{float:left; margin-left:10px; color:#666;}
#footer ul li.first{margin-left:0;}
#footer p{color:#b8b8b8; margin:10px 0 35px;}


/* ¸¶Áø -------------------------------------------------------------------*/
.top5{margin-top:5px;}
.top10{margin-top:10px;}
.top15{margin-top:15px;}
.top20{margin-top:20px;}
.top25{margin-top:25px;}
.top30{margin-top:30px;}
.top35{margin-top:35px;}
.top40{margin-top:40px;}
.top50{margin-top:50px;}
.top60{margin-top:60px;}
.top70{margin-top:70px;}
.top80{margin-top:80px;}
.top90{margin-top:90px;}

.left5{margin-left:5px;}
.left10{margin-left:10px;}
.left15{margin-left:15px;}
.left20{margin-left:20px;}
.left25{margin-left:25px;}
.left30{margin-left:30px;}
.left35{margin-left:35px;}
.left40{margin-left:40px;}
.left50{margin-left:50px;}
.left60{margin-left:60px;}
.left70{margin-left:70px;}
.left80{margin-left:80px;}
.left90{margin-left:90px;}

.right5{margin-right:5px;}
.right10{margin-right:10px;}
.right15{margin-right:15px;}
.right20{margin-right:20px;}
.right25{margin-right:25px;}
.right30{margin-right:30px;}
.right40{margin-right:40px;}
.right50{margin-right:50px;}
.right60{margin-right:60px;}
.right70{margin-right:70px;}
.right80{margin-right:80px;}
.right90{margin-right:90px;}

.center{text-align:center;}
.right{text-align:right;}
.left{text-align:left;}

.size30 { font-size:30px; }
.size40 { font-size:40px; }
.size50 { font-size:50px; }

/*Å×À̺í*/
table.type11 {
	font-family: 'S-CoreDream-4Regular';
	border-collapse: separate;
	border-spacing: 1px;
	text-align: center;
	line-height: 1.5;
	margin: 20px 0px;
	color: rgba(130,130,130,1);
}
table.type11 th {
	font-family: 'S-CoreDream-4Regular';
	font-size: 13px;
   
    padding: 10px;
    
	vertical-align: middle;
    color: #fff;
    background: #e8881b ;
}
table.type11 td {
	font-family: 'S-CoreDream-4Regular';
    
    padding: 10px;
    vertical-align: middle;
    border-bottom: 1px solid #ccc;
    background: #eee;
}

table.type12 {
	font-family: 'S-CoreDream-4Regular';
	border-collapse: separate;
	border-spacing: 1px;
	text-align: center;
	line-height: 1.5;
	margin: 20px 0px;
	color: rgba(119,119,119,1);
}
table.type12 p {text-align: center;}
table.type12 th {
	font-family: 'S-CoreDream-4Regular';
	font-size: 13px;
    
    padding: 10px;
    text-align: center;
	vertical-align: middle;
    color: #222222;
    background: rgb(181, 181, 181) ;
	font-weight: 300;
}
table.type12 td {
	font-family: 'S-CoreDream-4Regular';
   
    padding: 10px;
    vertical-align: middle;
	text-align: center;
    border-bottom: 1px solid #ccc;
    background: #eee;
}

table.type13 {
	font-family: 'S-CoreDream-4Regular';
	border-collapse: separate;
	border-spacing: 1px;
	text-align: center;
	line-height: 1.5;
	margin: 20px 0px;
	color: rgba(119,119,119,1);
	font-weight: 500
}
table.type13 p {text-align: left;line-height: 1.7}
table.type13 th {
	font-family: 'Noto Sans KR', sans-serif,  'S-CoreDream-4Regular';
	font-size: 12px;
    
    padding: 10px;
    text-align: center;
	vertical-align: middle;
    color: #222222;
    background: rgb(181, 181, 181) ;
	font-weight: 500;
}
table.type13 td {
	font-family: 'Noto Sans KR', sans-serif, 'S-CoreDream-4Regular';
   
    padding: 10px;
    vertical-align: middle;
	
    border-bottom: 1px solid #ccc;
    background: #eee;
}

 /*Äü¸Þ´º½ºÅ¸ÀÏ*/
					.sidebar {
						position: fixed;
						right: 0;
						top:20%;
						width: 100px;
						border: 1px solid #d0d0d0;
						background-color: #fff;
						box-sizing: border-box;
						z-index: 9999;
						
					}
		.sidebar img {
			padding: 15px;
			width: 50px;
		}
					.sidebar h6 {
						color: white;
            padding: 5px;
            font-size: 14px;
            font-weight: 400;
            background: #3f3f3f;
            font-family: 'Noto Sans KR';
            text-align: center;
					}
					.sidebar li {
						text-decoration: none;
    				list-style: none;
    				text-align: center;
						line-height: 1.3em;
						padding-bottom: 10px;
						font-size: 13px;
						
					}
		.sidebar span {
			display: block;
			font-size: 12px;
		}
					@media (min-width:1200px) {
						.sidebar {display:block;}
					}
					@media (max-width:1190px) {
						.sidebar {display:none;}
					}


/* ¸ÞÀοµ¿ª ÅÇ Àüü ½ºÅ¸ÀÏ */
.tabs {
  margin-top: 50px;
  padding-bottom: 0px;
/*  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);*/
  width: 100%;
  margin: 0 auto;}

/* ÅÇ ½ºÅ¸ÀÏ */
.tab_item {
  width: calc(100%/3);
  height: 50px;
  background-color: #cdcdcd;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #333333;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.55;
}

/* ¶óµð¿À ¹öÆ° UI»èÁ¦*/
input[name="tab_item"] {
  display: none;
}

/* ÅÇ ÄÁÅÙÃ÷ ½ºÅ¸ÀÏ */
.tab_content {
  display: none;
  padding: 15px 40px 0;
  clear: both;
  overflow: hidden;
	height: 250px;
	background-color: white;
}


/* ¼±Åà µÈ ÅÇ ÄÜÅÙÃ÷¸¦ Ç¥½Ã */
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/* ¼±ÅÃµÈ ÅÇ ½ºÅ¸ÀÏ */
.tabs input:checked + .tab_item {
  background-color: #fff;
  color: #333;
}
		.tab_content li {
			text-align: left;
			    padding-bottom: 5px;
    padding-top: 5px;
    border-bottom: 1px solid #eee;
			height: 20px;
		}
		
		.tab_content span {
			float: right;
		}