@charset "utf-8";

/****** sub layout ******/
.sub_container{position: relative;z-index: 0;}
.s_left{display: none;}
.s_left h2{height: 130px;padding-top: 45px;margin-bottom: 20px;background: #003668;border-radius: 10px 10px 40px 10px;font-size: 28px;color: #fff;text-align: center;box-sizing: border-box;box-shadow: 0 0 10px rgba(35,88,195,.1);}
.s_left>ul>li{position: relative;margin-bottom: 5px;}
.s_left>ul>li>a{display: block;padding: 20px 30px 20px 20px;font-size: 18px;color: #000;border-radius: 10px;box-shadow: 0 0 10px rgba(219,219,219,.3);}
.s_left>ul>li:first-child>a{border-radius: 10px 40px 10px 10px;}
.s_left>ul>li.on>a{background: #2358c3;color: #fff;font-weight: 600;}
.s_left>ul>li>a:after{position: absolute;top: 28px;right: 20px;width: 10px;height: 10px;content: "";background: url("/images/common/sub_ico.png") no-repeat center -736px;}
.s_left>ul>li.on>a:after{background-position: center -746px;}
.s_left li ul{margin-top: 5px;background: #f6f9ff;border-radius: 10px;padding: 20px 20px 10px;}
.s_left li li{position: relative;padding-left: 10px;margin-bottom: 10px;}
.s_left li li:before{position: absolute;left: 0;top: 9px;width: 5px;height: 5px;content: "";background: #2358c3;border-radius: 100%;}
.s_left li li>a{display: block;color: #000;}
.s_left li li.on>a{font-weight: 500;text-decoration: underline;}
.s_left li a:hover, .s_left li a:focus{text-decoration: underline;font-weight: 500;}
.s_left ul ul ul{background: #fff;padding: 0;border-radius: 5px;}
.s_left li li li{margin-bottom: 4px;padding: 5px 10px 5px 20px;border-bottom: 1px dashed var(--bggray1);}
.s_left li li li:before{width: 6px;height: 2px;border-radius: 0;left: 10px;top: 12px;background: var(--point2);}
.s_left li li li a{font-size: 14px;}
.s_left .new_win{vertical-align: baseline;}

.s_title{position: relative;} 
.s_title .local{height: 130px;padding: 20px 0 80px;background: #eff8fe;text-align: center;box-sizing: border-box;}
.s_title .local>ul{position: relative;margin: 0 20px;font-size: 0;}
.s_title .local>ul>li{display: inline-block;}
.s_title .local>ul>li:after{display: inline-block;content: ">";color: #2358c3;margin: 0 10px;font-size: 14px;}
.s_title .local>ul>li:last-child:after{display: none;}
.s_title .local li a{display: inline-block;color: #111;font-size: 14px;}
.s_title .local .home a{width: 16px;height: 16px;background: url("/images/common/sub_ico.png") no-repeat top center;font-size: 0;}
.s_title .local .navi>a:after{display: inline-block;width: 16px; height: 16px; border-radius: 100%; background: url(/images/common/toggle_open.png) no-repeat center rgba(255,255,255,.8);content: "";vertical-align: middle;margin: 0 0 0 6px;}
.s_title .local .navi div{display: none;position: absolute;left: 0;width: 100%;text-align: left;background: #fff;border-radius: 10px;padding: 20px;box-sizing: border-box;box-shadow: 0 0 10px rgba(35,88,195,.1);z-index: 1;}
.s_title .local .navi div.on{display: block;}
.s_title .local .navi div li{margin-top: 8px;padding-bottom: 8px;border-bottom: 1px dashed #ddd;}
.s_title .local .navi div li:first-child{margin-top: 0;}
.s_title .local .navi div button{position: absolute;width: 40px;height: 40px;border-radius: 100%;background: url("/images/common/sub_ico.png") no-repeat center -656px #2358c3;font-size: 0;padding: 0;margin: 0;right: 0;bottom: -45px;}
.s_title .utill{position: absolute;right: 20px;top: 80px;}
.s_title .utill li{display: inline-block;}
.s_title .utill li button{width: 40px;height: 40px;padding: 0;margin: 0;font-size: 0;border-radius: 100%;background: url("/images/common/sub_ico.png") no-repeat center -16px #fff;box-shadow: 0 0 10px rgba(35,88,195,.1);}
.s_title .utill li.up, .s_title .utill li.down{display: none;}
.s_title .utill li.down button{background-position: center -96px;}
.s_title .utill li.print button{background-position: center -216px;background-color: #003668;}
.s_title .utill li.url button{background-position: center -296px;background-color: #2358c3;}
.s_title h3{margin: 30px 20px 20px;padding-bottom: 20px;border-bottom: 1px solid #ededed;}
.s_title .share{position: absolute;bottom: 20px;right: 20px;}
.s_title .share button, .s_title .share a{display: block;width: 40px;height: 40px;padding: 0;margin: 0;font-size: 0;border-radius: 100%;background: url("/images/common/sub_ico.png") no-repeat center -336px #ededed;box-shadow: 0 0 10px rgba(219,219,219,.2);}
.s_title .share div{display: none;position: absolute;z-index: 1;}
.s_title .share div.on{display: block;}
.s_title .share div li{margin: 4px 0;}
.s_title .share .face a{background-position: center -416px;}
.s_title .share .kakao a{background-position: center -456px;}
.s_title .share .story a{background-position: center -496px;}
.s_title .share .band a{background-position: center -536px;}
.s_title .share .ins a{background-position: center -576px;}
.s_title .share div button{background-position: center -616px;}
.s_con{margin: 0 20px 40px;}
.scon_bottom{margin: 20px;}

@media all and (min-width:768px) {
.s_title .local .navi div{left: auto;width: 200px;}
.s_title .utill{top: 70px;}
.s_title .share{bottom: 15px;}
}

@media all and (min-width:1023px) {
.sub_container:before{position: absolute;top: 0;left: 0;width: 100%;height: 100px;content: "";background: #eff8fe;z-index: -1;}
.s_content{padding-top: 40px;margin: 0 20px;}
.s_content:after{display: block;clear: both;content: "";}

.s_left{display: block;float: left;width: 200px;}
.s_right{float: right;width: calc(100% - 240px);}

.s_title .local{height: auto;padding: 0 180px 36px 0;background: none!important;text-align: left;}
.s_title .local>ul{margin: 0;}
.s_title .local>ul>li:after, .s_title .local li a{font-size: 16px;}
.s_title .local .home a{margin-top: 3px;}
.s_title .local .navi div{width: 240px;}
.s_title .utill{right: 0;top: -10px;}
.s_title .utill li.up, .s_title .utill li.down{display: inline-block;}
.s_title h3{margin: 50px 0 40px;padding-bottom: 30px;font-size: 36px;padding-top: 30px;}
.s_title .share{bottom: 30px;}
.s_con, .scon_bottom{margin: 0 0 40px;}
}

@media all and (min-width:1200px) {
.s_content{max-width: 1200px;margin: 0 auto;}
.s_left{width: 280px;}
.s_right{width: calc(100% - 340px);}
.s_con, .scon_bottom{margin: 0 0 60px;}
}


/* 공공누리 */
.license{background: #fafafa;padding:20px;margin-bottom: 20px;text-align:center;border-radius: 20px;word-break: keep-all;}
.license div{display:block;margin:0 0 10px 0}
.license p em{font-style:normal;font-weight:bold}
.license p em:after,.license p em:before{content:'\0022'}
@media all and (min-width:1023px) {
.license{overflow:hidden;text-align:left}
.license div{float:left;margin:0}
.license p{float:right;margin:12px 0 0 0;width:calc(100% - 230px)}
}

/* 콘텐츠담당자 */
.manager{background:#fafafa;padding:20px;border-radius: 20px 20px 0 0;}
.manager h4{display:block;overflow:hidden;position:absolute;top:0;left:-5000px;font-size:1.8em}
.manager li{margin:0 0 5px 0}
.manager li:before{display: inline-block;width: 20px;height: 20px;content: "";background: url("/images/common/sub_ico.png") no-repeat center -696px;margin-right: 4px;vertical-align: middle;}
.manager li.tel:before{background-position: center -716px;}
.manager li strong{color:#000}
@media all and (min-width:768px) {
.manager{position:relative}
.manager ul{overflow:hidden}
.manager li{float:left;margin:0 30px 5px 0}
}
@media all and (min-width:1023px) {
.manager p{position:absolute;bottom:20px;right:20px}
.manager li{margin:0 30px 0 0}
}

/* 만족도조사 */
.research{border:5px solid #fafafa;padding:20px;border-radius: 0 0 20px 20px;}
.research h4{display:block;overflow:hidden;position:absolute;top:0;left:-5000px;font-size:1.8em}
.research p{margin:0 0 10px 0}
.research li{line-height:1.5em}
.research li:first-child{margin:0 0 10px 0}
.research li *{vertical-align:middle}
.research input[type=text]{border:1px solid #ddd;width:100%;height:30px;box-sizing:border-box;border-radius: 3px;}
.research input[type=submit]{background:#2358c3;color:#fff;width:100%;height:30px;border-radius: 3px;}
.research input[type=submit]:focus { outline-offset: -3px; outline: 2px dashed #fff;}
.research label{color:#000;margin-right:20px;font-size: 14px;}
.research a.btn_bbsw{width:100%;padding:9px 0 0 0;margin:5px 0 0 0;text-align:center}
@media all and (min-width:768px) {
.research{padding:25px;position:relative}
.research input[type=text]{width:calc(100% - 120px)}
.research input[type=submit]{width:100px}
.research a.btn_bbsw{width:100px;position:absolute;top:20px;right:25px}
}
@media all and (min-width:1023px) {
.research ul:after{display: block;clear: both;content:"";}
.research li{float:left;width:50%}
.research li:first-child{padding:5px 0 0 0;margin:0}
}

/*translated-ltr*/
.translated-ltr .manager p{position: static;text-align: right;}
.translated-ltr .research input[type=submit]{font-size: 14px;}
@media all and (min-width:768px) {
.translated-ltr .research input[type=text]{width: 60%;}
.translated-ltr .research input[type=submit]{width: 39%;}
}
@media all and (min-width:1023px) {
.translated-ltr .research input[type=text]{width: 100%;}
.translated-ltr .research input[type=submit]{width: 100%;}
}