@charset "utf-8";

/*-----------------------------------------------------------------------------------
	충남도서관 다국어 sub Style    
	Last : 2018.04.23
-----------------------------------------------------------------------------------*/


.sub-visual {position:absolute; top:0; left:0; overflow:hidden; width:100%; min-width:100%; height:220px; margin:0 auto; z-index:1}
.sub-visual .img {width:100%; height:100%; font-size:0; background:url('../../images/encn/sub/visual.jpg') no-repeat 50% 50%; background-size:cover}

#side {position:absolute; top:0; left:0; width:240px; height:100%; min-height:600px; padding:60px 0; background-color:#fff; border:1px solid #ddd; border-top:0; border-bottom:0; z-index:10}
#side .side_title {padding:0 20px; margin-bottom:60px; text-align:center}
#side .side_title span {display:block; padding-bottom:30px; line-height:30px; font-size:22px; font-family:'NanumGB'; color:#3f3f3f; border-bottom:2px solid #4d4d4d}
#side > ul {}
#side > ul li {padding:20px 15px; margin-bottom:10px; border-bottom:1px solid #ddd}
#side > ul li a {overflow:hidden; display:block; font-size:14px; font-family:'NanumGB'; color:#333; word-break:keep-all; word-wrap:break-word}
#side > ul li a:hover {color:#0d6fb8}
#side > ul li.on {background-color:#0d6fb8; border-bottom:0}
#side > ul li.on a {color:#fff}

.pd5  {padding:5px}
.pd15 {padding:15px}
.pd25 {padding:25px}


/* ===== ===== content ===== ===== */
.sub-content {position:relative; width:920px; min-height:700px; padding:240px 0 60px; margin-left:280px}

.sub-head {margin:10px 0 40px; border-bottom:2px dashed #e1e1e1}
.sub-head > .lineMap {height:30px; line-height:20px; font-size:12px; font-family:'Dotum', 'Arial'; color:#8b8b8b;}
.sub-head > .lineMap span {display:inline-block; padding-left:14px; margin-left:4px; background:url('../../images/encn/sub/bg_lineMap.gif') no-repeat left 4px}
.sub-head > .lineMap .home {width:14px; height:100%; margin-left:0; text-indent:-9999em; background:url('../../images/encn/sub/ico_home.gif') no-repeat 0 2px }
.sub-head > .title {}
.sub-head > .title h2 {margin:14px 0 16px; line-height:34px; font-size:26px; font-family:'NanumGB'; color:#3f3f3f}


.buDep1 {margin:16px 0 10px; line-height:26px; font-size:22px; font-family:'NanumGB'; color:#0d6fb8}
.buDep2 {}
.buDep3 {margin:4px 0 0 10px; padding:0 0 0 8px; background:url('../../images/encn/sub/buDep3.gif') no-repeat 0 10px}

.tb-col {overflow:hidden; border-top:1px solid #3a3a3a}
.tb-col table {width:100%; margin-left:-1px}
.tb-col thead th {padding:9px 3px 8px; font-family:'NanumGB'; font-size:14px; color:#333; border-bottom:1px solid #949494; border-left:1px solid #c6c6c6; background-color:#fafafa}
.tb-col tbody th, .tb-col td {padding:8px 10px 10px 14px; color:#333; border-bottom:1px solid #c6c6c6; border-left:1px solid #c6c6c6;}





@media screen and (max-width:1200px){
	.sub-visual {-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; transition:all 0.3s ease}
}



@media screen and (max-width:1024px){
	.sub-visual {height:160px}
	#side {display:none}
	.sub-content {width:96%; margin:0 auto; padding-top:180px}
}



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

}



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

}



@media screen and (max-width:640px){
	.sub-visual {height:100px}
	.sub-content {padding-top:100px}
	.sub-head > .lineMap {display:none}
	.sub-head > .title h2 {margin:8px 0 12px; line-height:30px; font-size:22px}
}



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

}