@charset "utf-8";

/* sub01 */

/*차트 상세정보 s*/
.datamap{position: relative;}
.datamap .graph_area{height: 600px;overflow: hidden;}
.datamap .graph_area>div#chart{height: 600px;}
.datamap .graph_area>div#chart2{height: 600px;}
.datamap .graph_area .keyword{padding:4px; background: #fff;box-sizing: border-box;text-align: center;font-size: 0;}
.datamap .graph_area .keyword li{display: inline-block;position: relative;padding-left: 18px;margin-right: 8px;font-size: 14px;}
.datamap .graph_area .keyword li:nth-child(1){color: #018580;}
.datamap .graph_area .keyword li:nth-child(2){color: #4476c6;}
.datamap .graph_area .keyword li:nth-child(3){color: #9756d5;}
.datamap .graph_area .keyword li:nth-child(4){color: #665ee4;}
.datamap .graph_area .keyword li:before{display: block;position: absolute;top: 4px;left: 0;width: 14px;height: 14px;border-radius: 100%;content: "";}
.datamap .graph_area .keyword li:nth-child(1):before{background: #59c7bf;}
.datamap .graph_area .keyword li:nth-child(2):before{background: #80adf5;}
.datamap .graph_area .keyword li:nth-child(3):before{background: #a367dc;}
.datamap .graph_area .keyword li:nth-child(4):before{background: #665ee4;}
.datamap .detail_area{position: absolute;top: 0;bottom: 0;right: 0;width: 50%;min-width: 280px;background: #fff;border-left: 1px solid #dedede;z-index: 999;box-shadow: 0 0 10px rgba(0,0,0,0.3);}
.datamap .detail_area .tit{padding: 12px;border-bottom: 1px solid #dedede;}
.datamap .detail_area .tit h4{margin: 0;}
.datamap .detail_area .tit .btn_close{display: block;position: absolute;top: 10px;right: 0px;width: 40px;height: 0;padding-top: 40px;overflow: hidden;background: url("/images/damin/common/common_ico.png") no-repeat center -180px;transform:rotate(45deg);}
.datamap .detail_area .con{padding: 12px;}
.datamap .detail_area .con h5{margin: 0;padding:0;background: none;}
.datamap .detail_area .con .basic_table{min-width: auto;}
.datamap .btn_prev{display: block;position: absolute;top: 0;left: 0;padding: 2px 8px;font-size: 14px;background: #555;color: #fff;}
@media all and (min-width:768px) {
.datamap .graph_area .keyword{position: absolute;bottom: 10px;right: 10px;border-radius: 5px;box-shadow: 0 0 5px rgba(0,0,0,0.2);}
.datamap .detail_area{max-width: 400px;}
}
.loading {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(255,255,255,0.8); z-index: 9999;}
.loading img {position: absolute; top: 30px; left: calc(50% - 51px); animation: aniImg 3s ease-in-out infinite;}
@keyframes aniImg {0%{transform: rotate(0deg);} 100%{transform: rotate(360deg);}}
.loading span{display: block;position: absolute;top: 170px;width: 100%;text-align: center;}
.datamap .loading img{top: 180px;}
.datamap .loading span{top: 300px;}
/*검색*/
.datamap_sch{border: 3px solid #005399;}
.datamap_sch form{font-size: 0;}
.datamap_sch input{display: inline-block;height: 40px;font-size: 14px;box-sizing: border-box;}
.datamap_sch .form_txt{width: calc(100% - 50px);padding: 0 8px;}
.datamap_sch .form_sm{float: right;width: 50px;background: #005399;color: #fff;}
.datamap .graph_area{margin-top: 10px;border: 1px solid #e4e4e4;box-sizing: border-box;}
.datamap .detail_area{top: 56px;}
.datamap .btn_prev{top: auto;bottom: 50px;left: 50%;transform: translateX(-50%);}
@media all and (min-width:768px) {
.datamap_sch{border-width: 4px;}
.datamap_sch input{height: 48px;font-size: 16px;}
.datamap_sch .form_txt{width: calc(100% - 120px);padding: 0 20px;}
.datamap_sch .form_sm{width: 120px;}
.datamap .detail_area{top: 66px;}
.datamap .btn_prev{bottom: 0;}
}
@media all and (min-width:1024px) {
.datamap_sch .form_txt{width: calc(100% - 200px);}
.datamap_sch .form_sm{width: 200px;}
}
/*차트 상세정보 e*/

/*데이터*/
.data_list{margin-top: 20px;}
.data_list .info_box {padding: 20px 20px 0;}
.data_list .info_box li {position: relative; width: 260px; height: 88px; padding-left: 100px; margin: 0 auto 20px; box-sizing: border-box;}
.data_list .info_box li:after {display: block; position: absolute; top: 0; left: 0; width: 88px; height: 88px; background: url("/images/sub/sub04/data_img01.png") no-repeat center #fff; border-radius: 100%; content: "";}
.data_list .info_box li:nth-child(2):after {background-image: url("/images/sub/sub04/data_img02.png")}
.data_list .info_box li:nth-child(3):after {background-image: url("/images/sub/sub04/data_img03.png")}
.data_list .info_box li span {display: inline-block; padding: 2px 10px; margin-top: 20px; border-radius: 20px; background: #005399; color: #fff;}
.data_list .info_box li strong {display: block; font-size: 24px; color: #212121;}
.data_list .info_box li em {font-size: 18px; font-weight: 400; font-style: normal; vertical-align: baseline;}

/*맞춤-주제별*/
.data_icon{margin: 20px 0;}
.data_icon ul:after{display: block;clear: both;content: "";}
.data_icon li{float: left;width: 50%;}
.data_icon li a{display: block;padding: 8px;text-align: center;border: 1px solid #cce9fc;background: #f8fbfe;}
.data_icon li.on a{background: #0073e8;border-color: #0090f1;color: #fff;font-weight: 500;}
.data_icon li a:hover, .data_icon li a:focus{background: #005399;color: #fff;}

/*맞춤-생애주기별*/
.life_icon{margin: 20px 0;}
.life_icon ul:after{display: block;clear: both;content: "";}
.life_icon li{float: left;width: 50%;}
.life_icon li a{display: block;padding: 8px;text-align: center;border: 1px solid #cce9fc;background: #f8fbfe;}
.life_icon li.on a{background: #0073e8;border-color: #0090f1;color: #fff;font-weight: 500;}
.life_icon li a:hover, .life_icon li a:focus{background: #005399;color: #fff;}

.gong_jedo{padding: 8px 0;background: #ecf3f9;}
.gong_jedo>div{margin: 12px;padding: 12px; border-radius: 10px;background: #fff;}

/*맞춤-도정목표*/
.vision_icon{margin: 20px 0;}
.vision_icon li a{display: block;padding: 8px;text-align: center;border: 1px solid #cce9fc;background: #f8fbfe;}
.vision_icon li.on a{background-color: #0073e8;border-color: #0090f1;color: #fff;font-weight: 500;}

/*맞춤-시군별*/
.city_icon{margin: 20px 0;}
.city_icon ul:after{display: block;clear: both;content: "";}
.city_icon li{float: left;width: 25%;}
.city_icon li a{display: block;padding: 8px;text-align: center;border: 1px solid #cce9fc;background: #f8fbfe;}
.city_icon li.on a{background: #fff;border-color: #0090f1;color: #0073e8;font-weight: 500;}
.city_icon li a:hover, .city_icon li a:focus{background: #005399;color: #fff;}

/* sub03 */
/*데이터시각화*/
.bbs_search_box {padding: 20px; margin-bottom: 20px; background: #ecf3f9;}
.bbs_search_box select {height: 32px;}
.bbs_search_box input[type="submit"] {cursor: pointer; height: 32px; padding: 0 8px; background: #005399; color: #fff; vertical-align: middle; font-size: 16px;}
.new_btn {margin: 20px 0; text-align: right;}
.new_btn button {padding: 5px 35px 5px 15px; background: url("/images/damin/common/new_win.png") no-repeat right 15px center #005399; color: #fff; font-size: 16px; border-radius: 20px;}
.new_btn button:hover, .bbs_search_box .new_btn button:focus {background-color: #0073e8;}

/*공간데이터 지도*/
.map_icon li{margin: 0 0 20px;}
.map_icon li a{display: block;border-radius: 20px;border: 1px solid #cce9fc;background: url("/images/damin/content/map01.png") no-repeat center top #fafcff;padding-top: 240px;overflow: hidden;}
.map_icon li a:hover, .map_icon li a:focus{border-color: #0073e8;}
.map_icon li.li02 a{background-image: url("/images/damin/content/map02.png");}
.map_icon li.li03 a{background-image: url("/images/damin/content/map03.png");}
.map_icon li.li04 a{background-image: url("/images/damin/content/map04.png");}
.map_icon li.li05 a{background-image: url("/images/damin/content/map05.png");}
.map_icon li.li06 a{background-image: url("/images/damin/content/map06.png");}
.map_icon li.li07 a{background-image: url("/images/damin/content/map07.png");}
.map_icon li.li09 a {background-image:url(/sppartners/images/commerce_btn.png);}
.map_icon li a span{display: block;background: #fff;padding: 20px 0;text-align: center;}
.map_icon li a strong{display: block;font-size: 18px;font-weight: 500;}
.map_icon li a em{display: inline-block;padding: 10px 42px 10px 24px;margin: 10px auto 0;font-style: normal;color: #005399;background: url("/images/damin/common/new_win.png") no-repeat top 16px right 22px #ecf3f9;border-radius: 20px;}
.map_icon li a:hover em, .map_icon li a:focus em{background: url("/images/damin/common/new_win_w.png") no-repeat top 16px right 22px #0073e8;color: #fff;transition: .3s;}

.map_icon li.btn2{position: relative;border-radius: 20px;border: 1px solid #cce9fc;background: #fafcff no-repeat;padding-top: 187px;overflow: hidden;}
.map_icon li.btn2:hover, .map_icon li.btn2:focus{border-color: #0073e8;}
.map_icon li.btn2 span{display: block;background: #fff;padding: 20px 0;text-align: center;}
.map_icon li.btn2 strong{display: block;font-size: 18px;font-weight: 500;}
.map_icon li.btn2 a{background: none;display: block;border: none;border-radius: 0;padding: 0;}
.map_icon li.btn2 a:last-child em{background-image: url("/images/damin/common/btn_down.png");}
.map_icon li.btn2 a:last-child:hover em, .map_icon li.btn2 a:last-child:focus em{background-image: url("/images/common/btn_down.png");}

.map_icon li.li06{background-image: url("/images/damin/content/map06.png");background-position: center top;background-size: 260px;}
.map_icon li.li08{background-image: url("/images/damin/content/map08.png");background-position: center -20px;}
.map_icon li.li08:before{display: block;position: absolute;top: 8px;left: 8px;width: 94px;height: 28px;content: "";background: url("/images/damin/content/map08_top.png") no-repeat;}

/*셀프분석*/
.self .basic_step li strong{padding: 16px 0;font-weight: 500;}
.self .basic_step li span{height: 120px;border-top: 1px solid #dedede;background: #fff;}
.self .basic_step li:last-child span{border-color: #0073e8;}
.self .basic_dl dt{color: #464646;}
.self .basic_dl dd{position: relative;padding: 8px;background: #ecf3f9;}
.self .basic_dl dd img{width: 100%;border: 1px solid #dedede;}
.self .basic_dl dd a{display: block;position: absolute;bottom: 8px;left: 8px; width:auto;padding: 4px 8px;background: #005399;color: #fff;font-size: 14px;}

.self_box{padding: 20px;margin-bottom: 20px;border: 1px solid #dedede;}
.self_box:before{display: block;width:240px;height: 240px;content: "";background: url("/images/damin/content/self01.png") no-repeat 0 0 /contain;margin: 0 auto 20px;}
.self_box p{font-size: 18px;}
.self_box h4{margin: 0 0 12px 0;padding: 0;background: none;font-weight: 500;}
.self_box h4 span{color: #005399;}
.self_box ul{margin: 0;padding-top: 20px;border-top: 1px solid #dedede;}
.self_box li{margin-bottom: 20px;}
.self_box li strong{display: block;font-size: 18px;color: #005399;font-weight: 500;}
.self_box li a{display: block;width: 130px;background: #ecf3f9;border-radius: 50px;margin: 5px 0;padding: 8px 20px;border: 1px solid #bedff7;color: #005399;}
.self_box li a:hover, .self_box li a:focus{background: #fff;border-color: #0073e8;}
.self_box li a span{display: block;padding-right: 20px;background: url("/images/damin/common/btn_go.png") no-repeat center right;}

.self .basic_box2>div{border-bottom: 1px dashed #e4e4e4;}
.self .basic_box2 .logo_img img{display: block;width: 100%;max-width: 300px;margin: 0 auto;}
.self .basic_box2 .dd_none{background: none;padding:0;}

/*한눈에보는충남*/
.cn_stat ul:after{display: block;clear: both;content: "";}
.cn_stat li{position: relative;float: left;width: 48%;margin: 1%;}
.cn_stat li a{display: block;height: 260px;padding: 160px 0 30px;border: 1px solid #bedff7;text-align: center;border-radius: 10px;}
.cn_stat li a:before{display: block;position: absolute;top: 30px;left: 50%;transform: translateX(-50%);width: 110px;height: 110px;background: url("/images/damin/content/cnstat_icon.png") no-repeat #ecf3f9;border-radius: 100%;content: "";}
.cn_stat li a strong, .cn_stat li a span, .cn_stat li a em{display: block;}
.cn_stat li a strong{font-size: 20px;font-weight: 500;color: #000;}
.cn_stat li a em{font-size: 14px;font-style: normal;color: #666;}
.cn_stat li a:hover, .cn_stat li a:focus{border-color: #0073e8;}
.cn_stat li a:hover strong, .cn_stat li a:focus strong{color: #0073e8;}
@media all and (max-width:450px) {
.cn_stat li{float: none;width: 100%;margin: 10px auto;}
}
/*icon*/
.cn_stat li.li1 a:before{background-position: 0 0;}
.cn_stat li.li2 a:before{background-position: -110px 0;}
.cn_stat li.li3 a:before{background-position: -220px 0;}
.cn_stat li.li4 a:before{background-position: -330px 0;}
.cn_stat li.li5 a:before{background-position: 0 -110px;}
.cn_stat li.li6 a:before{background-position: -110px -110px;}
.cn_stat li.li7 a:before{background-position: -220px -110px;}
.cn_stat li.li8 a:before{background-position: -330px -110px;}
.cn_stat li.li9 a:before{background-position: 0 -220px;}
.cn_stat li.li10 a:before{background-position: -110px -220px;}
.cn_stat li.li11 a:before{background-position: -220px -220px;}
.cn_stat li.li12 a:before{background-position: -330px -220px;}
.cn_stat li.li13 a:before{background-position: 0 -330px;}
.cn_stat li.li14 a:before{background-position: -110px -330px;}
.cn_stat li.li15 a:before{background-position: -220px -330px;}
.cn_stat li.li16 a:before{background-position: -330px -330px;}
.cn_stat li.li17 a:before{background-position: 0 -440px;}
.cn_stat li.li18 a:before{background-position: -110px -440px;}
.cn_stat li.li19 a:before{background-position: -220px -440px;}
.cn_stat li.li20 a:before{background-position: -330px -440px;}
.cn_stat li.li21 a:before{background-position: 0 -550px;}
.cn_stat li.li22 a:before{background-position: -110px -550px;}
.cn_stat li.li23 a:before{background-position: -220px -550px;}
.cn_stat li.li24 a:before{background-position: -330px -550px;}
/*icon*/

.notice_box div{padding-top: 300px;background: url("/images/damin/content/guide04.png") no-repeat top 30px center /240px;}
.notice_box h4{padding: 0;margin: 0;background: none;font-weight: 500;}


/* sub05 */
/*소개*/
.int .tit_box img{width: 100%;}
.int .tit_box .text{padding: 20px;background: #fff;box-shadow: 0 0 20px rgba(0,129,202,0.2);}
.int .tit_box .text h4{margin: 0;padding: 0;background: none;color: #005399;font-weight: 400;}
.int .tit_box .text .tit{margin: 20px 0 40px;font-size: 18px;}
.int .tit_box .text .tit strong{color: #D44300;}
.int .tit_box .text p{margin-top: 20px;}
.int .tit_box .text p br{display: none;}
.int .tit_box .text p em{display: inline-block;position: relative;font-weight: 500;font-style: normal;color: #005399;}
.int .tit_box .text p em:after{display: block;position: absolute;left: 0;bottom: 0; width: 100%;height: 11px;content: "";background: rgba(0,144,241,0.1);}
.int .con_box{margin-top: 60px;text-align: center;}
.int .con_box p{font-size: 18px;}
.int .con_box h5{margin: 20px 0 40px;padding: 0;background: none;color: #005399;font-weight: 500;}
.int .con_box li{position: relative;padding-top: 240px;margin-bottom: 20px;}
.int .con_box li:before{display: block;position: absolute;top: 10px;left: 50%;width: 210px;height: 210px;content: "";transform: translateX(-50%);border-radius: 100%;background: url("/images/damin/content/int_icon.png") no-repeat #ecf3f9;}
.int .con_box li:nth-child(2):before{background-position: 0 -210px;}
.int .con_box li:nth-child(3):before{background-position: 0 -420px;}
.int .con_box li strong{display: block;margin-bottom: 10px; font-size: 18px;font-weight: 500; color: #0073e8;}

/*활용가이드*/
.guide div{position: relative;padding: 260px 20px 20px;margin-bottom: 20px;border-radius: 20px;border: 1px solid #91b1df;}
.guide div:before{display: block;content: "";position: absolute;top: 20px;left: 50%;transform: translateX(-50%);width: 240px;height: 240px;background: url("/images/damin/content/guide01.png") no-repeat center /contain;}
.guide div.box02:before{background-image: url("/images/damin/content/guide02.png");}
.guide div.box03:before{background-image: url("/images/damin/content/guide03.png");}
.guide div.box04:before{background-image: url("/images/damin/content/guide04.png");}
.guide div h4{padding: 0;color: #005399;font-weight: 400;background: none;}
.guide div h4 br{display: none;}

/* sub06 */
/*로그인*/
.login{padding: 20px;margin-bottom: 20px;border: 1px solid #dedede;}
.login:before{display: block;width:240px;height: 240px;content: "";background: url("/images/damin/content/login01.png") no-repeat 0 0 /contain;margin: 0 auto 20px;}
.login h5{margin: 0 0 12px 0;padding: 0;background: none;font-weight: 500;}
.login h5 span{color: #005399;}
.login ul{margin: 0 0 20px 0;}
.login .login_form form li{margin-bottom: 12px;}
.login .login_form form li label{display: inline-block;width: 100px;}
.login .login_form form li input{width: calc(100% - 105px);padding: 2px 4px;border-bottom: 1px solid #ccc;font-size: 15px;}
.login .login_form form input[type="submit"]{display: block;margin: 0 auto;padding: 4px 12px;font-size: 18px;font-weight: 500;color: #fff;background: #005399;border-radius: 5px;cursor: pointer;}
.login .login_form .login_link{margin: 12px 0;}
.login .login_form .login_link:after{display: block;clear: both;content: "";}
.login .login_form .login_link li{float: left;position: relative;padding-left: 10px;margin-left: 10px; font-size: 14px;}
.login .login_form .login_link li:after{display: block;position: absolute;left: 0;top: 5px;width: 1px;height: 8px;background: #dedede;content: "";}
.login .login_form .login_link li:first-child{margin: 0;padding: 0;}
.login .login_form .login_link li:first-child a{color: #d93f09;}
.login .login_form .login_link li:first-child:after{display: none;}
.login .sns_login{margin-top: 40px;}
.login .sns_login .sns_btn {margin-top: 12px;text-align: center;font-size: 0;}
.login .sns_login .sns_btn a{display: inline-block;width: 50px;height: 0;padding-top: 50px;margin: 4px 4px;border-radius: 100%;background: url("/images/damin/content/login02.png") no-repeat; overflow: hidden;font-size: 14px;}
.login .sns_login .sns_btn a.kko{background-position: -60px 0;}
.login .sns_login .sns_btn a.ggle{background-position: -120px 0;}
.login .sns_login .sns_btn a.fb{background-position: -180px 0;}
.login .sns_login .sns_btn a.twt{background-position: -240px 0;}
.login li.find_id{max-width: 400px;padding: 8px;margin: 12px auto;background: #ecf3f9;text-align: center;font-size: 18px;}

/*회원가입*/
.reser_step{margin: 30px 0 0 0;}
.reser_step ol{border: 1px solid #dedede;box-shadow: 4px 4px 0 #ecf3f9;overflow:hidden;border-radius: 5px;}
.reser_step li{padding:15px;text-align:center;border-top:1px solid #dedede;box-sizing: border-box;position: relative;}
.reser_step li:first-child{border:none;}
.reser_step li.on{font-weight:bold;background: #005399;color:#fff;}
.reser_step li *{vertical-align:middle;}
.reser_step li em{font-style:normal; font-size:13px; display:block; }
.reser_step li span{font-weight:500;font-size:12px;margin:0 10px 0 0;background: #ecf3f9;padding: 0 7px;color: #005399;}
.reser_step li strong{font-size:16px;}
.reser_step li.on strong{font-weight:500;}

.join_box li{position: relative;margin-bottom: 20px;padding: 12px 0;border: 1px solid #dedede;border-radius: 5px;text-align: center;}
.join_box li:before{display: block;width: 94px;height: 105px;content: "";margin: 20px auto;}
.join_box li:nth-child(1):before{background: url("/images/damin/content/join00.png");}
.join_box li:nth-child(2):before{background: url("/images/damin/content/join01.png");}
.join_box li:nth-child(3):before{background: url("/images/damin/content/join02.png");}
.join_box li:nth-child(4):before{background: url("/images/damin/content/join03.png");}
.join_box li strong{display: block;font-size: 24px;font-weight: 500;}
.join_box li span{display: block;margin: 20px 0; font-size:14px;}
.join_box li:not(:nth-child(2)) span {margin-bottom:40px;}
.join_box li span i{display: block;font-size: 14px;font-style: normal;}
.join_box li a{display: block;width: 130px;padding: 10px 20px;margin: 20px auto;background: #ecf3f9;color: #005399;border-radius: 50px;border: 1px solid #bedff7;}
.join_box li a:hover, .join_box li a:focus{background: #fff;border-color: #0073e8;}

.agree_box{margin-bottom: 40px;}
.agree_box .ag_txt{max-height: 300px;padding: 0 12px;overflow-y: auto;border: 1px dashed #bedff7;background: #f8fbfe;}
.agree_box .ag_txt h6, .agree_box .ag_txt .basic_p{margin-left: 0;}
.agree_box .txt_box{margin-bottom: 20px;}
.agree_box input{vertical-align: middle;}
.agree_box .ag_all{margin-top: 20px; font-size: 18px;font-weight: 500;}

.verify{padding: 20px;margin-bottom: 20px;border: 1px solid #dedede;}
.verify:before{display: block;width:240px;height: 240px;content: "";background: url("/images/damin/content/join04.png") no-repeat 0 0 /contain;margin: 0 auto 20px;}
.verify h5{margin: 0 0 12px 0;padding: 0;background: none;font-weight: 500;}
.verify ul{margin: 0;padding-top: 20px;border-top: 1px solid #dedede;}

/*사이트맵*/
.sitemap>div{margin-bottom: 20px;border-top: 2px solid #005399;background: #f8fbfe;border-bottom: 1px solid #bedff7;}
.sitemap h4{padding: 0;background: none;text-align: center;}
.sitemap h4 a{color: #005399;}
.sitemap div div{padding: 20px 12px;background: #fff;}
.sitemap div div li{padding: 0 0 0 10px;margin: 0 0 12px;background: url("/images/common/h6.gif") 0 6px no-repeat;}
.sitemap div div li a{color: #0073e8;font-size: 18px;font-weight: 600;}
.sitemap div div li ul{padding: 12px;margin: 8px 0 0;background: #f8fbfe;border: 1px dashed #bedff7;}
.sitemap div div li li{display: inline-block;padding: 0 0 0 8px;margin: 0 15px 5px 0;background: url("/images/common/li02.gif") no-repeat 0 11px;}
.sitemap div div li li a{color: #464646;font-size: 16px;font-weight: 400;}

/*개인정보처리방침*/
.privacy .priv_icon:after{display: block;clear: both;content: "";}
.privacy .priv_icon li{position: relative;float: left;width: 50%;background: none;padding: 0;margin: 0;border: 1px solid #e4e4e4;}
.privacy .priv_icon li span{display: block;margin: 20px auto;padding: 90px 0 0;font-size: 14px;text-align: center;}
.privacy .priv_icon li span:after{display: block;position: absolute;top: 20px;left: 50%;transform: translateX(-50%);width: 80px;height: 80px;content: "";background: url("/images/damin/content/priv_icon.png") no-repeat;}
.privacy .priv_icon li:nth-child(1) span:after{background-position: -160px 0;}
.privacy .priv_icon li:nth-child(2) span:after{background-position: 0 0;}
.privacy .priv_icon li:nth-child(3) span:after{background-position: -80px 0;}
.privacy .priv_icon li:nth-child(4) span:after{background-position: -320px 0;}
.privacy .priv_icon li:nth-child(5) span:after{background-position: -240px 0;}
.privacy .priv_icon li:nth-child(6) span:after{background-position: 0 -160px;}
.privacy .priv_list li{position: relative;padding: 0;margin: 8px 4px;background: none;}
.privacy .priv_list li span{vertical-align: middle;padding-left: 6px;}
.privacy i{display: inline-block;width: 36px;height: 0;padding-top: 36px;overflow: hidden;background: url("/images/damin/content/priv_icon.png") no-repeat 0 0 /180px;vertical-align: middle;}
.privacy i.pr01{background-position: 0 0;}
.privacy i.pr02{background-position: -36px 0;}
.privacy i.pr03{background-position: -72px 0;}
.privacy i.pr04{background-position: -108px 0;}
.privacy i.pr05{background-position: -144px 0;}
.privacy i.pr06{background-position: 0 -36px;}
.privacy i.pr07{background-position: -36px -36px;}
.privacy i.pr08{background-position: -72px -36px;}
.privacy i.pr09{background-position: -108px -36px;}
.privacy i.pr10{background-position: -144px -36px;}
.privacy i.pr11{background-position: 0 -72px;}
.privacy i.pr12{background-position: -36px -72px;}
.privacy i.pr13{background-position: -72px -72px;}
.privacy i.pr14{background-position: -108px -72px;}
.privacy i.pr15{background-position: -144px -72px;}
.privacy .basic_ul>li{background: none;}

/* Tablet */
@media all and (min-width:768px) {
.data_list .info_box ul {font-size: 0; text-align: center;}
.data_list .info_box li {display: inline-block; width: auto; margin: 0 40px 20px; text-align: left; font-size: 16px;}

.data_icon li{width: 25%;}
.life_icon li{position: relative;width: calc(25% - 20px);margin: 10px;}
.life_icon li a{padding: 120px 0 20px;border-radius: 10px;}
.life_icon li a:before{display: block;position: absolute;top: 20px;left: 50%;transform: translateX(-50%);width: 100%;height: 92px;content: "";background: url("/images/damin/content/life_icon.png") no-repeat;}
.life_icon li.li1 a:before{background-position: center 0;}
.life_icon li.li2 a:before{background-position: center -93px;}
.life_icon li.li3 a:before{background-position: center -184px;}
.life_icon li.li4 a:before{background-position: center -276px;}
.life_icon li.li5 a:before{background-position: center -368px;}
.life_icon li.li6 a:before{background-position: center -460px;}
.life_icon li.li7 a:before{background-position: center -552px;}
.life_icon li.on a{background-color: #fff;color: #005399;}

.vision_icon ul:after{display: block;clear: both;content: "";}
.vision_icon li{float: left;width: 50%;}
	
.city_icon li{position: relative;width: 12.5%;}
.city_icon li a{padding-top: 60px;}
.city_icon li a:before{display: block;position: absolute;top: 14px;left: 0;width: 100%;height: 40px;content: "";background: url("/images/damin/content/city_icon.png") no-repeat;}
.city_icon li.li1 a:before{background-position: center 0;}
.city_icon li.li2 a:before{background-position: center -40px;}
.city_icon li.li3 a:before{background-position: center -80px;}
.city_icon li.li4 a:before{background-position: center -120px;}
.city_icon li.li5 a:before{background-position: center -160px;}
.city_icon li.li6 a:before{background-position: center -200px;}
.city_icon li.li7 a:before{background-position: center -240px;}
.city_icon li.li8 a:before{background-position: center -280px;}
.city_icon li.li9 a:before{background-position: center -320px;}
.city_icon li.li10 a:before{background-position: center -360px;}
.city_icon li.li11 a:before{background-position: center -400px;}
.city_icon li.li12 a:before{background-position: center -440px;}
.city_icon li.li13 a:before{background-position: center -480px;}
.city_icon li.li14 a:before{background-position: center -520px;}
.city_icon li.li15 a:before{background-position: center -560px;}
	
.map_icon ul:after{display: block;clear: both;content: "";}
.map_icon li{float: left;width: calc((100% - 120px)/3);margin: 20px;}

.self:after{display: block;clear: both;content: "";}
.self .basic_dl{float: left;width: 48%;margin: 0 1% 40px;}
.self .basic_dl dd{padding: 12px;}
.self .basic_dl dd a{bottom: 12px;left: 12px;font-size: 16px;}

.self_box li{position: relative;padding-right: 150px;}
.self_box li a{position: absolute;bottom: 0;right: 0;}
	
.self .basic_box2 .logo_img{float: left;}
.self .basic_box2 dl{float: right;width: calc(100% - 330px);}
	
.cn_stat li{width: calc((100%/3) - 2%);}

.int .tit_box{position: relative;}
.int .tit_box .img{width: 80%;}
.int .tit_box .text{position: absolute;width: 60%;right: 0;bottom: -60px;}
.int .tit_box .text h4{font-size: 32px;}
.int .tit_box .text .tit{font-size: 20px;}
.int .con_box{margin-top: 120px;}
.int .con_box p{font-size: 20px;}
.int .con_box h5{font-size: 28px;}
.int .con_box ul:after{display: block;clear: both;content: "";}
.int .con_box li{float: left;width: calc(100%/3);}
.int .con_box li strong{padding: 12px 0;}
.int .con_box li:first-child strong{padding: 0;}

.login .login_form form:after{display: block;clear: both;content: "";}
.login .login_form form ul{float: left;margin-bottom: 0;width: calc(100% - 150px);max-width: 400px;}
.login .login_form form input[type="submit"]{float: left;width: 132px;padding: 20px 0;margin-left: 30px;}
.login .sns_login{margin-top: 60px;}
.login .sns_login:after{display: block;clear: both;content: "";}
.login .sns_login .title{float: left;width: calc(100% - 290px);max-width: 290px;}
.login .sns_login .sns_btn{float: left;margin: 30px 0 0 0;}

.reser_step li{float:left;width:33.33333333333333%;border:none;position:relative;overflow:hidden;}
.reser_step li:before{content:"";display:block;position:absolute;top: 50%;left:0px;width:1px;height:20px;background: #dedede;transform: translate(0,-50%);}
.reser_step .col2 li{width:50%}
.reser_step .col3 li{width:33.333%}
.reser_step .col4 li{width:25%}
.reser_step .col5 li{width:20%}
.reser_step li:first-child:before{display:none;}
.join_box ul:after{display: block;clear: both;content: "";}
.join_box li{float: left;width: calc((100% - 25px)/2);height: 360px;margin: 0 12px 20px 0;}
.join_box li:last-child{margin-right: 0;}

.sitemap>div:after{display: block;clear: both;content: "";}
.sitemap>div h4{float: left;width: 250px;}
.sitemap div div{float: right;width: calc(100% - 250px);min-height: 140px;}
}
@media (min-width:768px) and (max-width:1023px) {
.reser_step .col5 li span{margin: 0;}
.reser_step .col5 li strong{display: block;}
}

/*운영지침*/
.guide02 .basic_ul>li {background: none;}
.guide02 .basic_box2 dl {margin-bottom: 16px;}
.guide02 .basic_step .col5 .num {height: 20px; margin-right: 8px; padding: 0 3px; background:#005399; color: #fff; border-radius: 100%; font-size: 16px; line-height: 30px;}

/*개인정보*/
.privacy .priv_icon li{width: calc(100%/3);}
.privacy .priv_list:after{display: block;clear: both;content: "";}
.privacy .priv_list li{float: left;width: 48%;margin: 1%;}


/* Desktop */
@media all and (min-width:1023px) {
.data_icon li{position: relative;width: 12.5%;}
.data_icon li a{padding: 80px 0 20px;}
.data_icon li a:before{display: block;position: absolute;top: 20px;left: 50%;transform: translateX(-50%);width: 100%;height: 52px;content: "";background: url("/images/damin/content/data_icon.png") no-repeat;}
.data_icon li.li1 a:before{background-position: center 0;}
.data_icon li.li2 a:before{background-position: center -52px;}
.data_icon li.li3 a:before{background-position: center -104px;}
.data_icon li.li4 a:before{background-position: center -156px;}
.data_icon li.li5 a:before{background-position: center -208px;}
.data_icon li.li6 a:before{background-position: center -260px;}
.data_icon li.li7 a:before{background-position: center -312px;}
.data_icon li.li8 a:before{background-position: center -364px;}
.data_icon li.li9 a:before{background-position: center -416px;}
.data_icon li.li10 a:before{background-position: center -468px;}
.data_icon li.li11 a:before{background-position: center -520px;}
.data_icon li.li12 a:before{background-position: center -572px;}
.data_icon li.li13 a:before{background-position: center -624px;}
.data_icon li.li14 a:before{background-position: center -676px;}
.data_icon li.li15 a:before{background-position: center -728px;}
.data_icon li.li16 a:before{background-position: center -781px;}
.data_icon li.on a{background: #fff;color: #005399;}
.life_icon li{width: calc((100%/7) - 20px);}
.vision_icon li{width: calc((100%/5) - 20px);margin: 0 10px;}
.vision_icon li a{height: 180px;padding: 120px 0 0;border-radius: 50px 0 50px 0;background: url("/images/damin/content/vision_icon.png") no-repeat;box-sizing: border-box;}
.vision_icon li.li1 a{background-position: center 0;background-color: #fff5e5;border-color: #fbe0b2;}
.vision_icon li.li2 a{background-position: center -180px;background-color: #fff1e7;border-color: #f9cfb2;}
.vision_icon li.li3 a{background-position: center -360px;background-color: #f1ffe4;border-color: #d4eabf;}
.vision_icon li.li4 a{background-position: center -540px;background-color: #ebf8fe;border-color: #b2def2;}
.vision_icon li.li5 a{background-position: center -720px;background-color: #fff1fc;border-color: #ead0e4;}
.vision_icon li.on a{color: #000;font-weight: 500;background-color:#fff;border:4px solid #0090f1;font-size: 18px}
.vision_icon li a:hover, .vision_icon li a:focus{background-color: #0090f1;color: #fff;font-weight: 500;}

.gong_jedo{padding: 12px 0;}
.gong_jedo:after{display: block;clear: both;content: "";}
.gong_jedo>div{float: left;width: calc((100%/3) - 24px);min-height: 185px;margin: 0 12px;}

.self_box{position: relative;padding: 40px 40px 40px 360px;margin:40px 0;min-height: 400px;}
.self_box:before{position: absolute;left: 40px;top: 40px;}
.self_box p{font-size: 20px;}
.self_box h4{margin: 0 0 20px;font-size: 36px;}
.self_box li strong{margin-bottom: 6px;font-size: 20px;}
	
.cn_stat li{width: 23%;}
.notice_box div{padding: 60px 30px 30px 210px;background-position: left 30px top 30px;background-size: 150px;}

.int .tit_box .text{width: 650px;padding: 30px;}
.int .tit_box .text h4{font-size: 48px;}
.int .tit_box .text p br{display: inline-block;}
.int .tit_box .text .tit{font-size: 24px;}
.int .con_box{margin-top: 150px;}
.int .con_box p{font-size: 24px;}
.int .con_box h5{font-size: 36px;}
.int .con_box li strong{font-size: 20px;}

.guide{padding: 20px;}
.guide:after{display: block;clear: both;content: "";}
.guide div{float: left;width: calc(50% - 40px);margin: 20px;height: 660px;}
.guide div h4{font-size: 28px;}
.guide div a{font-size: 18px;}

.login{position: relative;padding: 40px 40px 40px 360px;margin:40px 0;min-height: 400px;}
.login:before{position: absolute;left: 40px;top: 40px;}
.login h5{margin: 20px 0 12px;font-size: 28px;}
.login .login_form{margin: 40px 0;}
.login .sns_login{margin-top: 80px;}

.join_box li{width: calc((100% - 60px)/4);height: 430px; margin: 0 20px 40px 0;padding: 30px 0;}
.join_box li:nth-child(2){letter-spacing: -1px;}
.join_box li:hover{border-color: #b0e0f8;box-shadow: 0 0 20px rgba(0,129,202,.1);}
.join_box li span{margin: 40px 0 0;}
/*
.join_box li:nth-child(1) span, .join_box li:nth-child(2) span{margin-bottom: 20px;}
*/
.verify{position: relative;padding: 40px 40px 40px 360px;margin:40px 0;min-height: 400px;}
.verify:before{position: absolute;left: 40px;top: 40px;}
.verify h5{margin: 20px 0 12px;font-size: 28px;}

.sitemap>div{background: url("/images/damin/common/menu_bg.png") left 10px bottom /180px no-repeat #f8fbfe;}
.sitemap>div h4{width: 300px;}
.sitemap div div{width: calc(100% - 300px);}
	
.guide02 .basic_step .col4 li:nth-child(3) span {height: 82px;line-height: 54px;}
.guide02 .basic_box2 dl:after {display: block;clear: both;content: "";}
.guide02 .basic_box2 dt, .guide02 .basic_box2 dd {float: left;}
.guide02 .basic_box2 dd {margin-left: 10px; background: none;}
}


@media all and (min-width:1400px) {
.gong_jedo>div{min-height: 140px;}
	
/* .map_icon li{width: calc((100% - 160px)/4);margin: 20px;} */
.map_icon li {width:calc((100% - 120px)/3);}	
.vision_icon li{width: calc((100%/5) - 40px);margin: 0 20px;}
.vision_icon li a{font-size: 16px;padding-top: 125px;}
	
.city_icon li{width: calc(100%/15);}

.self .basic_dl{width: 23%;}
.self_box{padding: 60px 80px 60px 480px;}
.self_box:before{width: 300px;height: 300px;background-size: auto;left: 80px;}

.int .tit_box .img{width: 960px;}
.int .con_box ul{width: 1200px;margin: 0 auto;}

.guide div{height: 470px;}
.guide div.box01{padding: 0 24px 0 290px;}
.guide div.box02{padding: 0 290px 0 24px;}
.guide div.box03{padding: 0 24px 0 290px;}
.guide div.box04{padding: 0 290px 0 24px;}
.guide div:before{width: 300px;height: 300px;transform: none;}
.guide div.box01:before{top: -40px;left: -40px;}
.guide div.box02:before{top: -40px;left: auto;right: -40px;}
.guide div.box03:before{top: auto;bottom: -40px;left: -40px;}
.guide div.box04:before{top: auto;left: auto;bottom: -40px;right: -40px;}
.guide div h4{margin: 60px 0 40px;}
.guide div h4 br{display: inline-block;}
.guide div .basic_btn{text-align: left;}

.login{padding: 60px 80px 60px 480px;}
.login:before{width: 300px;height: 300px;background-size: auto;left: 80px;}

.verify{padding: 60px 80px 60px 480px;}
.verify:before{width: 300px;height: 300px;background-size: auto;left: 80px;}
.verify .txt{font-size: 18px;}
	
.privacy .priv_icon li{width: calc(100%/6);}
.privacy .priv_list li{width: 31.333333%;}
}


/* 충남의 주요지표 */
.zipyo {position: relative; margin-top: 30px;}

.sch_zipyo {padding: 20px; margin-bottom: 20px; background: #ecf3f9;}
.sch_zipyo select {height: 32px;}
.sch_zipyo button {cursor: pointer; height: 32px; padding: 0 8px; background: #005399; color: #fff; vertical-align: middle;}

.status_box {padding: 20px; margin-bottom: 30px; border-radius: 20px; background: #f8fbfe; box-sizing: border-box;border: 1px solid #ecf3f9;}
.status_box .title {position: relative; padding-bottom: 5px; border-bottom: 1px solid #005399; min-height: 29px;}
.status_box .title {position: relative; padding-bottom: 5px; border-bottom: 1px solid #005399; min-height: 29px;}
.status_box .title:after {display: block; clear: both; content: "";}
.status_box .title h4 {width: 100%; height: 29px; margin: 0; padding-left: 0; background: none; font-size: 20px; color: #005399;}
.status_box .title h4 span {font-weight: 400; color: #464646;}
.status_box .title p {float: right;}
.status_box .title p span {float: left; min-width: 150px; text-align: right;}
.status_box .title p span em {display: inline-block;}
.status_box li {padding: 12px; margin-top: 20px; border: 1px solid #ecf3f9; background: #fff; font-size: 18px;}
.status_box li sub {vertical-align: bottom;}
.status_box li span {display: block; height: 28px;}
.status_box li span em {float: right; margin-top: 3px;}
.status_box span strong {color: #005399; font-size: 20px;}
.status_box span em {padding-left: 18px; font-style: normal;}

.status_box2 {padding: 20px 20px 0; margin-bottom: 30px; border: 1px solid #ecf3f9;}
.status_box2 li {padding-bottom: 20px; margin-bottom: 20px; font-size: 18px; border-bottom: 1px solid #ecf3f9;}
.status_box2 li:last-child {margin-bottom: 0; border: none;}
.status_box2 li span {display: block; text-align: right;}
.status_box2 span strong {float: left; color: #005399; font-size: 20px;}
.status_box2 span em {display: inline-block; padding-left: 18px; margin-top: 3px; font-style: normal;}
.status_box2 li sub {display: inline-block; margin: 5px 0 0 6px; letter-spacing: -1px;}

.status_box2 .col1 span em {margin-left: 10px;}

.zipyo .over_table {margin: 10px 0 20px;}
.zipyo .over_table h6 {margin: 10px 0;}
.zipyo .over_table h6:after {display: block; clear: both; content: "";}
.zipyo .over_table h6 span {float: right; margin-top: 4px; font-size: .8em; font-weight: 400; color: #464646;}
.img_map {width:100%; height: calc(100% - 47px); border: 1px solid #dedede; box-sizing: border-box; overflow-x: auto;}
.grp_area {width:100%; height: 450px; border: 1px solid #dedede; box-sizing: border-box;}

/* 지표 상태변경 */
span.g_down strong, span.r_down strong {color: #d13333;}
span.g_up strong, span.r_up strong {color: #01837e;}
span.r_up em, span.g_up em {background: url("/images/sub/zipyo/new_up.png") no-repeat left 8px /12px;}
span.r_down em, span.g_down em {background: url("/images/sub/zipyo/new_down.png") no-repeat left 8px /12px;}

/* 지도 시군 표시 */
.img_map>div {position: relative; width: 678px; margin: auto; overflow: hidden;}
.img_map img {display: block; width: 640px; margin: 30px 0 0 20px;}
.img_map dl {position: absolute; min-width: 85px;}
.img_map dl dt {width: 50px; padding: 0 0 3px; margin: 0 auto; text-align: center; color: #fff; background: #005399; border-radius: 20px; font-weight: 600;}
.img_map dl dd {text-align: center;}
/*태안*/.img_map dl.map01 {top: 140px; left: 30px;}
/*서산*/.img_map dl.map02 {top: 140px; left: 130px;}
/*당진*/.img_map dl.map03 {top: 60px; left: 200px;}
/*아산*/.img_map dl.map04 {top: 120px; left: 330px;}
/*천안*/.img_map dl.map05 {top: 100px; left: 440px;}
/*예산*/.img_map dl.map06 {top: 190px; left: 250px;}
/*홍성*/.img_map dl.map07 {top: 250px; left: 170px;}
/*보령*/.img_map dl.map08 {top: 370px; left: 170px;}
/*청양*/.img_map dl.map09 {top: 310px; left: 280px;}
/*공주*/.img_map dl.map10 {top: 280px; left: 380px;}
/*서천*/.img_map dl.map11 {top: 490px; left: 220px;}
/*부여*/.img_map dl.map12 {top: 420px; left: 300px;}
/*논산*/.img_map dl.map13 {top: 450px; left: 410px;}
/*금산*/.img_map dl.map14 {top: 490px; left: 540px;}
/*계룡*/.img_map dl.map15 {top: 370px; left: 500px;}
.img_map dl.map15:after {display: block; position: absolute; top: 53px; left: -15px; width: 6px; height: 6px; content: ""; background: #005399; border-radius: 100%;}
.img_map dl.map15:before {display: block; position: absolute; top: 13px; left: -12.5px; width: 1px; height: 40px; content: ""; background: #005399;}
.img_map dl.map15 dt:before {display: block; position: absolute; top: 13px; left: -12px; width: 30px; height: 1px; content: ""; background: #005399;}

.loading {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(255,255,255,0.8); z-index: 9999;}
.loading img {position: absolute; top: 30px; left: calc(50% - 51px); animation: aniImg 3s ease-in-out infinite;}
@keyframes aniImg {0%{transform: rotate(0deg);} 100%{transform: rotate(360deg);}}
.loading span{display: block;position: absolute;top: 170px;width: 100%;text-align: center;color: #0073e8}

/*데이터없음*/
.data_none {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(255,255,255,0.6); z-index: 9999;}
.data_none div {position: absolute; top: 30px; left: 50%; transform: translateX(-50%); padding: 60px 20px; text-align: center; background: #fff; border: 1px solid #0073e8; width: 80%;}
.data_none .title {font-size: 24px; font-weight: 600; color: #0073e8;}

/*지표타이틀*/
.zipyo_tit p {padding: 0 0 0 32px; margin: 30px 0 20px; font-size: 28px; font-weight: 600; background: url(/images/common/h4.png) no-repeat 0 14px;}

/* Tablet */
@media all and (min-width:768px) {
.sch_zipyo {margin: 10px 10px 30px;}
	
.zipyo .over_table .scroll_guide {display: none;}
	
.status_box {padding: 30px; margin: 0 10px 30px;}
.status_box .title p {position: absolute; top: 5px; right: 0;}
.status_box ul:after {display: block; clear: both; content: "";}
.status_box li {float: left; width: calc((100% - 40px)/2); height: 97px; padding: 20px 20px 0; margin: 20px 10px 0; box-sizing: border-box;}
	
.status_box2 {padding: 20px 30px 0; margin: 0 10px 30px;}
.status_box2 ul:after {display: block; clear: both; content: "";}
.status_box2 li {float: left; width: calc((100% - 30px)/2); padding: 0 30px 0 0; margin-right: 30px; border: none; border-right: 1px solid #ecf3f9; box-sizing: border-box;}
.status_box2 .col3 li {width: calc((100% - 40px)/3); padding: 0 20px 0 0; margin-right: 20px;}
.status_box2 .col1 li {float: none; width: auto; margin-bottom: 20px;}
.status_box2 li:last-child {margin-right: 0; padding-right: 0;}

.loading img {top: 50px;}
.data_none div {width: auto; top: 50px;}

.zipyo_tit p {margin-bottom: 40px; font-size: 32px; background-position: 0 18px;}
}

/* Desktop */
@media all and (min-width:1023px) {
.zipyo:after {display: block; clear: both; content: "";}
.status_box.left {width: 70%; float: left; margin-right: 20px;}
.status_box.right {width: calc(30% - 50px); float: left;}
	
.status_box li {width: 100%; padding: 20px 10px 0; letter-spacing: -1px;}
.status_box .col4 li {width: calc(25% - 20px);}
.status_box .col3 li {width: calc((100%/3) - 21px);}
.status_box .col2 li {width: calc(50% - 20px); height: 70px;}
.status_box .col2 li span {width: 55%; float: right;}
	
.status_box.right li {margin: 20px 0 0;}
	
.status_box2 li span {width: 54%; float: right;}
.status_box2 .col1 {width: 50%; margin: 0 auto;}
.status_box2 .col3 li span {width: 70%;}
	
.zipyo .col:after {display: block; clear: both; content: "";}
.zipyo .col .over_table {width: calc(50% - 20px); height: 680px; margin: 0 10px 20px; float: left; overflow: hidden;}
.grp_area {height: 450px;}
.col .grp_area {height: calc(100% - 47px)!important;}
.col .grp_area.h50 {height: calc(50% - 47px)!important;}
.col .grp_area.h30 {height: calc(33.3% - 47px)!important;}
.zipyo.half .col .over_table {height: 400px;}
}
@media all and (min-width:1400px) {
.status_box li {padding: 20px 20px 0; letter-spacing: normal;}
}

.zipyo_tit>em,.status_box2 .col1+em{display: none;}