@charset "UTF-8";

/* 홍보영상 */
.video-list .list { padding-bottom: 10px; border-bottom: 1px solid #d8d8d8; }
.video-list .list li { margin-top: 20px; padding-top: 20px; border-top: 1px solid #e8e8e8; }
.video-list .list li:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.video-list .list li .img img { width: 100%; }
.video-list .list li .subject { margin-top: 10px; color: #555; font-size: 12px; line-height: 1.5; }
.video-list .list li .date { margin-top: 6px; color: #999; font-size: 12px; }

/* FAQ */
.faq .list { border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; }
.faq .list li { border-top: 1px solid #eaeaea; }
.faq .list li:first-child { border-top: 0; }
.faq .list li a { display: block; padding: 19px 60px 19px 0; background: url(/images/m/kr/sub/service/faq-icon-arrow.png) no-repeat right center; background-size: 30px 30px; color: #333; font-weight: bold; font-size: 12px; line-height: 1.5; text-align: justify; }
.faq .list li.active a { background: url(/images/m/kr/sub/service/faq-icon-arrow-active.png) no-repeat right center; background-size: 30px 30px; }
.faq .list li a .category { margin-right: 4px; color: #7f5f2e; }
.faq .list li .answer { display: none; padding: 20px; border: 1px solid #ff7a00; color: #555; font-size: 12px; line-height: 1.5; text-align: justify; word-break: break-all; }
.faq .list li.active .answer { display: block; }

/* 공급신청 및 절차 */
.progress .list { margin-top: 20px; border: 1px solid #ebebeb; background-color: #fff; }
.progress .list div[class^="step"] { position: relative; padding: 15px 20px 15px 45px; border-top: 1px solid #ebebeb; }
.progress .list div[class^="step"]:first-child { border-top: 0; }
.progress .list div[class^="step"]:nth-child(1) { background: url(/images/m/kr/sub/service/progress-num1.png) no-repeat 10px 15px; background-size: 24px 17px; }
.progress .list div[class^="step"]:nth-child(2) { background: url(/images/m/kr/sub/service/progress-num2.png) no-repeat 10px 15px; background-size: 24px 17px; }
.progress .list div[class^="step"]:nth-child(3) { background: url(/images/m/kr/sub/service/progress-num3.png) no-repeat 10px 15px; background-size: 24px 17px; }
.progress .list div[class^="step"]:nth-child(4) { background: url(/images/m/kr/sub/service/progress-num4.png) no-repeat 10px 15px; background-size: 24px 17px; }
.progress .list div[class^="step"]:nth-child(5) { background: url(/images/m/kr/sub/service/progress-num5.png) no-repeat 10px 15px; background-size: 24px 17px; }
.progress .list div[class^="step"]:nth-child(6) { background: url(/images/m/kr/sub/service/progress-num6.png) no-repeat 10px 15px; background-size: 24px 17px; }
.progress .list div[class^="step"]:nth-child(odd) { background-color: #f9f9f9; }
.progress .list div[class^="step"]:nth-child(even) { background-color: #fff; }
.progress .list div[class^="step"]:nth-child(odd):before  { content: " "; display: block; position: absolute; top: -1px; left: 50%; width: 19px; height: 10px; margin-left: -8px; background: url(/images/m/kr/sub/service/progress-icon-arrow1.png) no-repeat; background-size: 19px 10px; }
.progress .list div[class^="step"]:nth-child(even):before { content: " "; display: block; position: absolute; top: -1px; left: 50%; width: 19px; height: 10px; margin-left: -8px; background: url(/images/m/kr/sub/service/progress-icon-arrow2.png) no-repeat; background-size: 19px 10px; }
.progress .list div[class^="step"]:first-child:before { display: none; }
.progress .list div[class^="step"] > div { margin-top: 13px; padding-top: 13px; border-top: 1px dashed #d1d121; }
.progress .list div[class^="step"] > div:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.progress .list div[class^="step"] > div h4 { margin-bottom: 4px; }
.progress .list div[class^="step"] > div p { font-size: 11px; }
.progress .list div[class^="step"] > div p .btn-wrap { display: block; margin-top: 10px; }
.progress .toggle-wrap h3 { margin-bottom: 0; }
.progress .toggle-wrap h3 a { display: block; margin-top: 25px; padding: 16px 47px 16px 20px; border: 1px solid #ebebeb; background: url(/images/m/kr/sub/service/progress-icon-toggle.png) no-repeat 100% 0; background-size: 47px 94px; color: #7f5f2e; font-weight: bold; font-size: 13px; }
.progress .toggle-wrap.active h3 a { background-position: 100% -47px; }
.progress .toggle-wrap .toggle-body { display: none; padding: 20px; border: 1px solid #ebebeb; border-top: 0; }
.progress .toggle-wrap.active .toggle-body { display: block; }
.progress .toggle-wrap .toggle-body h4 { margin-bottom: 5px; }
.progress .toggle-wrap .toggle-body ul li { padding-left: 10px; font-size: 11px; line-height: 1.5; text-indent: -10px; text-align: justify; }
.progress .toggle-wrap .toggle-body .group { margin-top: 13px; padding-top: 13px; border-top: 1px dashed #d1d121; }
.progress .toggle-wrap .toggle-body .group:first-child { margin-top: 0; padding-top: 0; border-top: 0; }

/* 요금안내 */
.charge .date-desc h3 { margin-bottom: 5px; color: #333; font-weight: bold; font-size: 13px; }
.charge .date-desc p { margin-bottom: 20px; }
.charge .date-desc p:nth-of-type(1) { margin-top: 0; }
.charge .tab-head { overflow: hidden; margin-top: 25px; }
.charge .tab-head .btn-wrap { float: right; } 
.charge .tab-head .btn-wrap .btn { padding: 9px 20px; background-color: #997f58; color: #fff; }
.charge .charge-tab { float: left; width: 100px; height: 30px; margin-bottom: 15px; }
.charge .charge-tab li a { padding: 7px 0; background-color: #fff; border: 1px solid #cdcdcd; }
.charge .charge-tab li:first-child a { border-right: 0; }
.charge .charge-tab li.active a { padding: 7px 0 8px; background-color: #757575; color: #fff; }
.charge .measure { margin-bottom: 4px; color: #888; font-size: 12px; text-align: right; }
.charge .custom table tbody th { background-color: #fff; }
.charge .section-wrap { margin-top: 20px; }
.charge .section { margin-top: 20px; padding-top: 20px; border-top: 1px solid #d8d8d8; }
.charge .section:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.charge .section h4 { margin-bottom: 5px; }
.charge .section p em { font-style: normal; font-weight: bold; }
.charge .group { margin-top: 10px; }
.charge .group:first-child { margin-top: 0; }

.charge .download-list {
    padding: 0px 30px;
    float: right;
    text-align: right;
}
.charge .download-list a {
    min-width: 0;
    padding: 10px 18px 10px 40px;
    background-image: url(https://www.skens.com/images/sub/common/icon-download.png);
    background-repeat: no-repeat;
    background-position: 10px 12px;
    vertical-align: middle;
}

/* 고지 및 납부 */
.bill-pay p.img { border: 1px solid #d8d8d8; }
.bill-pay p.img img { width: 100%; }
.bill-pay .btn-wrap { margin-top: 10px; }
.bill-pay .btn-wrap a { margin-top: 5px; }
.bill-pay .btn-wrap a:first-child { margin-top: 0; }
.bill-pay .section-wrap { margin-top: 15px; }
.bill-pay .section { margin-top: 20px; padding-top: 20px; border-top: 1px solid #d8d8d8; }
.bill-pay .section:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.bill-pay .section .group-wrap { margin-top: 10px; }
.bill-pay .section .group { margin-top: 10px; padding-top: 0; border-top: 0; }
.bill-pay .group { margin-top: 10px; padding-top: 10px; border-top: 1px solid #ececec; }
.bill-pay .group:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.bill-pay .group h4 { margin-bottom: 7px; }
.bill-pay .group p { margin-top: 10px; }
.bill-pay .group p:nth-of-type(1) { margin-top: 0; }
.bill-pay .group ul li { padding-left: 10px; line-height: 1.5; text-indent: -10px; }

/* 검침안내 */
.check-info .section { margin-top: 15px; padding-top: 15px; border-top: 1px solid #ececec; }
.check-info .section:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.check-info .section ul li { padding-left: 10px; text-indent: -10px; line-height: 1.5; }
.check-info .section h4 { margin-bottom: 5px; }
.check-info .section .img { margin-top: 15px; }
.check-info .section .img img { width: 100%; }

/* 가스안전사용요령 */
.safety-use .group { margin-top: 13px; padding-top: 13px; border-top: 1px solid #ececec; }
.safety-use .group:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.safety-use .group p { margin-top: 10px; }
.safety-use .group p.img { margin-top: 0; }
.safety-use .group p.img img { height: 117px; }

/* 가스시설점검요령 */
.safety-check .group { margin-top: 13px; padding-top: 13px; border-top: 1px solid #ececec; }
.safety-check .group:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.safety-check .group p { margin-top: 10px; }
.safety-check .group p.img { margin-top: 0; }
.safety-check .group p.img img { height: 63px; }
.safety-check .group ul li { padding-left: 10px; text-indent: -10px; line-height: 1.5; }

/* 이사날 체크포인트 */
.check-point .section-wrap { margin-top: 30px; }
.check-point .section { margin-top: 13px; padding-top: 13px; border-top: 1px solid #ececec; }
.check-point .section:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.check-point .section p em { font-style: normal; font-weight: bold; }
.check-point .section .img { margin-bottom: 13px; }
.check-point .section .img img { height: 63px; }
.check-point .section ul li { padding-left: 10px; line-height: 1.5; text-indent: -10px; }
.check-point .section .table { margin: 35px 0 15px; }
.check-point .section .table:nth-of-type(1) { margin: 0; }
.check-point .section .table tbody th { padding: 11px 0 12px; background-color: #fff; letter-spacing: -1px; }
.check-point .section .btn-wrap { margin-top: 13px; }

/* 센터안내 */
.center-info .section-wrap { margin-top: 30px; }
.center-info .section { margin-top: 13px; padding-top: 13px; border-top: 1px solid #ececec; }
.center-info .section:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.center-info .section p em { display: block; margin-bottom: 11px; font-style: normal; font-weight: bold; }
.center-info .section ul li { line-height: 1.5; }
.center-info .section .btn-wrap { margin-top: 13px; }
.center-info .group { margin-top: 10px; }
.center-info .group:first-child { margin-top: 0; }

/* 관리구역 */
.management-area .section-wrap { margin-top: 30px; }
.management-area .section { margin-top: 20px; border-top: 2px solid #545454; }
.management-area .section:first-child { margin-top: 0; }
.management-area .section h3 { margin-bottom: 0; padding: 12px 25px; border: 1px solid #d9d9d9; border-bottom: 2px solid #efefef; color: #333; font-weight: bold; font-size: 14px; }
.management-area .section .desc-wrap { padding: 20px 25px 25px; border: 1px solid #d9d9d9; }
.management-area .section .desc li { margin-top: 5px; padding-left: 20px; line-height: 1.5; }
.management-area .section .desc li:first-child { margin-top: 0; }
.management-area .section .desc li.area { background: url(/images/m/kr/sub/service/icon-area.png) no-repeat 0 5px; background-size: 13px 12px; }
.management-area .section .desc li.addr { background: url(/images/m/kr/sub/service/icon-addr.png) no-repeat 0 5px; background-size: 13px 12px; }
.management-area .section .desc li.tel  { background: url(/images/m/kr/sub/service/icon-tel.png) no-repeat 0 5px; background-size: 13px 12px; }
.management-area .section .btn-wrap { margin-top: 15px; font-size: 0; text-align: center; }
.management-area .section .btn-wrap a { min-width: 75px; margin-left: 13px; font-size: 12px; }
.management-area .section .btn-wrap .trigger-map { min-width: 75px; background-image: url(/images/m/kr/sub/service/management-area-arrow.png); background-repeat: no-repeat; background-position: 90% 0; background-size: 30px 60px; }
.management-area .section .active .btn-wrap .trigger-map { background-position: 90% -30px; }
.management-area .section .toggle-map { display: none; margin-top: 15px; border: 1px solid #ccc; }
.management-area .section .active .toggle-map { display: block; }
.management-area .section .toggle-map img { width: 100%; }

.pipe-status h2 { padding-bottom: 0; border-bottom: 0; }
.pipe-status .table table tbody th { background-color: #fff; }

/* 열공급정보 */
.heat-supply h4 { margin-bottom: 16px; color: #7f5f2e; font-weight: bold; font-size: 21px; }
.heat-supply .section-wrap > div { margin-top: 20px; padding-top: 60px; border-top: 1px dotted #e8e8e8;  }
.heat-supply .section-wrap > div:first-child { margin-top: 0; padding-top: 0; border-top: 0;  }
.heat-supply .section > p { color: #333; font-size: 14px; }
.heat-supply .section > p em { display: block; margin-top: 3px; color: #987f57; font-style: normal; font-size: 13px; }
.heat-supply .section p.tip { margin-top: 12px; color: #666; font-size: 14px; }
.heat-supply .section p.tip em { display: inline; color: #666; font-weight: bold; font-style: normal; }
.heat-supply .section .custom { margin-top: 13px; } 
.heat-supply .group { position: relative; padding: 10px 130px 10px 10px; border: 1px solid #e8e8e8; }
.heat-supply .group > p { color: #909090; line-height: 1.8; }
.heat-supply .group a.download { display: block; position: absolute; top: 50%; right: 20px; width: 100px; margin-top: -20px; padding-right: 20px; background: #e70128 url(/images/sub/common/icon-download.png) no-repeat 143px 12px; }


/*엔솔브*/

.contents.ensolve h2 { margin-bottom: 0; }
.ensolve .con { }
.ensolve .con .login_form { background: #f8f8f8; padding: 15px 10px;  box-sizing: border-box; }
.ensolve .con .login_form p { color: #393939; height: 30px;}
.ensolve .con .login_form input { width: 100%; height: 40px; font-size: 14px; box-sizing: border-box; }
.ensolve .con .login_form a.check { background: #444444; width: 100%; height: 60px; line-height: 60px; font-size: 14px; box-sizing: border-box; margin-top: 10px;
text-align: center; color: #fff; font-weight: bold;}
.ensolve .con .login_form a.check span { position: relative; padding-left: 15px;}
.ensolve .con .login_form a.check span:before { 
    content: '';
    display: block;
    width: 27px;
    height: 27px;
    background: url(../../../../images/m/kr/sub/common/icon_search.png) no-repeat 0 0px;
    background-size: cover;
    position: absolute;
    left: -20px;
    top: -2px;
}
.ensolve .con .b-txt { margin: 20px 0 0; border-top: 1px solid #c9c9c9; padding-top: 20px;}
.ensolve .con .b-txt ul { font-size: 11px; color: #855d23; }
.ensolve .con .b-txt ul li.tit { padding: 0 0 5px 8px; position: relative; }
.ensolve .con .b-txt ul li.txt { padding: 0 0 15px 8px; }
.ensolve .con .b-txt ul li.tit:before { 
    content: '-';
    display: block;
    position: absolute;
    left: 0px;
    top: -2px;
}


.ensolve .con .search { background: #f8f8f8; padding: 10px;  box-sizing: border-box; }
.ensolve .con .search select { width: calc(100% - 90px); height:40px; box-sizing: border-box; vertical-align: middle;} 
.ensolve .con .search a.check { display: inline-block; width: 80px; line-height: 40px; background: #444444; box-sizing: border-box; text-align: center; color: #fff; vertical-align: middle; } 
.ensolve .con .search_result { margin-top: 15px; }
.ensolve .con .search_result table { background: #fff; border-top: 1px solid #6f6f6f; }
.ensolve .con .search_result table th { width: 35%; background: #f8f8f8;  text-align: left; color: #343434; }
.ensolve .con .search_result table th,
.ensolve .con .search_result table td { border-bottom: 1px solid #cecece; padding: 8px 0px 8px 10px}
.ensolve .con .btn-area { margin-top: 10px; overflow: hidden; }
.ensolve .con .btn-area a.detail_veiw { display: inline-block; float: right; width: 90px; line-height: 35px; padding-left: 15px; border: 1px solid #cdcdcd; position: relative; font-weight: bold; }
.ensolve .con .btn-area a.detail_veiw:after {
    content: '';
    display: block;
    width: 8px;
    height: 15px;
    background: url(../../../../images/m/kr/sub/common/btn_arrow.png) no-repeat -9px 0px;
    background-size: cover;
    position: absolute;
    top: 10px;
    right: 10px;
}

.ensolve .con .tab_wrap { margin-top: 15px; }
.ensolve .con .tab_wrap ul { overflow: hidden; }
.ensolve .con .tab_wrap ul li { width: 50%; float: left; }
.ensolve .con .tab_wrap ul li.active a, .tab_wrap.col3 ul li.active a {
    background: #fff;
    border-top: 2px solid #e70128;
    border-bottom: 1px solid #fff;
    color: #e70128;
    border-left: 1px solid #cdcdcd;
    border-right: 1px solid #cdcdcd;
}
.ensolve .con .tab_wrap.h60 ul li a {
    min-height: 60px;
    padding: 0;
    line-height: 60px;
}
.ensolve .con .tab_wrap ul li a {
    width: 100%;
    padding: 12px 0 13px;
    display: block;
    text-align: center;
    font-size: 13px;
    color: #666;
    font-weight: bold;
    background: #f5f5f5;
    border-top: 2px solid #fff;
    border-bottom: 1px solid #d1d1d1;
}

.ensolve .con .search_result p.tit { color: #855d23; font-size: 11px; font-weight: bold; padding-bottom: 8px;  }
.ensolve .con .search_result section { margin-top: 15px;}
.ensolve .con .search_result table.cost td { text-align: right; padding-right: 10px;}
.ensolve .con .btn-area a.prev_page { display: inline-block; float: right; width: 105px; line-height: 35px; padding-left: 25px; border: 1px solid #cdcdcd; position: relative; font-weight: bold; }
.ensolve .con .btn-area a.prev_page:before {
    content: '';
    display: block;
    width: 8px;
    height: 15px;
    background: url(../../../../images/m/kr/sub/common/btn_arrow.png) no-repeat 0px 0px;
    background-size: cover;
    position: absolute;
    top: 10px;
    left: 10px;
}

.ensolve .con .nlLogout {
    padding: 0 25px;
    color: #666;
    margin-top: 10px;
    font-size: 14px;
    text-align: right;
    margin-bottom: 15px;
    text-decoration: underline;
}