/* font-family: 'Lato', sans-serif; */

.common_title{width: 100%; height: 400px;}
.common_title.company{background: url(../img/sub/company_title.jpg)no-repeat; background-size: cover; background-position: 10% center;}
.common_title.product{background: url(../img/sub/product_title.jpg)no-repeat; background-size: cover; background-position: center;}
.common_title.business{background: url(../img/sub/business_title.jpg)no-repeat; background-size: cover; background-position: center;}
.common_title.result{background: url(../img/sub/result_title.jpg)no-repeat; background-size: cover; background-position: center;}
.common_title h1{font-size: 44px; color: #fff; line-height: 400px; font-weight: 400; text-transform: uppercase; text-align: center;}
.section_wrap{background-color: #f5f5f5; padding-bottom: 120px;}
.section_wrap section.title{padding: 80px 0 120px 0;}
section.title .deco_line{width: 1px; height: 76px; background-color: #a7a7a7; margin: 0 auto; margin-bottom: 30px;}
section.title h1{text-align: center; font-size: 50px; font-weight: 400; word-break: keep-all;}

.sub_tab_wrap{background-color: #f5f5f5; border-bottom: 1px solid #ddd;}
.sub_tab_menu{position: relative; z-index: 150; color: #555;}
.sub_tab_menu>li{height: 50px; float: left; border-right: 1px solid #ddd; box-sizing: border-box; line-height: 50px; cursor: pointer;}
.sub_tab_home{border-left: 1px solid #ddd;}
.sub_tab_title_box{width: 230px; position: relative;}
.tab_select_menu{line-height: 50px; background-color: #fff; border: 1px solid #e7e7e7; border-top: 0; width: 100%; color: #333; display: none;}
.tab_select_menu>li{padding: 0 24px; cursor: pointer;}
.tab_select_menu>li:last-child{border: 0;}
.sub_tab_title_box>span{padding: 0 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; text-transform: uppercase;}
.sub_tab_title_box>.tab_plus_btn{width: 14px; height: 14px;display: inline-block; padding: 0; position: absolute; top: 22px; right: 25px;}
.tab_select_menu>li>a{width: 100%; height: 100%; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase;}
/* 서브페이지 상단배너,탭 */

/* 서브 공통 */

.greeting{background-color: #fff;}
.greeting li{float: left;}
.greet_pic{width: 40%; background: url(../img/sub/greeting.jpg)no-repeat; min-height: 736px; background-size: cover; background-position: center;}
.greet_txt{width: 60%; padding: 130px 20px 130px 100px; position: relative;}
.factory_pic{width: 50%; position: absolute; bottom: 0; right: -10px;}
.greeting .txt_inner{/* width: 68%; */ word-break: keep-all;}
.greeting .txt_inner h1{font-size: 40px; font-weight: 600; line-height: 1.2; padding-bottom: 50px;}
.greeting .txt_inner p{font-size: 19px; font-weight: 300; padding-bottom: 30px; line-height: 1.6;}
.greeting .txt_inner p:last-child{padding-bottom: 0;}

.certi{width: 100%;}
.certi li{width: 25%; padding: 20px; text-align: center; float: left;}
.certi .con_wrap{background-color: #fff; padding: 24px; font-weight: 400; word-break: keep-all;}
.certi .con_wrap .title{padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #ddd;}
.certi .con_wrap .f_sky{font-weight: 500;}
.certi .con_wrap .name{font-size: 18px; padding-top: 2px;}
.company02 section.title{padding-bottom: 100px;}

.certi_table{padding-bottom: 80px; overflow-x: auto;}
.certi_table table{width: 100%; font-family: 'Noto Sans KR', 'Sans-serif'; min-width: 560px;}
.certi_table table td{padding: 10px 10px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; vertical-align: middle;}
.certi_table table td.type{background-color: #eee; text-align: center; font-weight: 500;}
.certi_table table td.name{background-color: #fff; padding-left: 30px;}

.map_info{padding: 20px; margin-top: 40px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; font-family: 'Noto Sans KR', 'Sans-serif'}
.map_info>ul{display: inline-block; text-align: center;}
.map_info>ul.add{width: 40%;}
.map_info>ul.tel{width: 29%;}
.map_info li{display: inline-block;}
.map_info .title{padding-right: 10px; margin-right: 10px; border-right: 1px solid #ddd; color: #0f6593;}
.map_info .info{padding-right: 20px; font-size: 18px;}
/* --------------------- company 회사소개 --------------------- */

/* .product02 .con_wrap{background-color: #fff; padding: 20px 40px;} */
.product02 .con_wrap li{padding:30px 40px; /* border-bottom: 1px solid #ddd; */ background-color: #fff; margin-bottom: 40px; font-family: 'Noto Sans KR', 'Sans-serif'; word-break: keep-all;}
.product02 .con_wrap li:last-child{border-bottom: 0;}
.product02 .txt_inner h6{font-size: 22px; padding-bottom: 14px;}
.product02 .txt_inner h6 span{font-family: 'Lato', sans-serif; color: #0f6593; font-weight: 800; padding-right: 4px; font-size: 26px; position: relative; top: 1px;}
.product02 .txt_inner p{line-height: 1.8; position: relative; padding-left: 20px; margin-left: 13px;}
.product02 .txt_inner p::before{content: ""; width: 5px; height: 5px; background-color: #5cbbe2; position: absolute; top: 12px; left: 0; border-radius: 50%;}
/* --------------------- product 제품소개 --------------------- */

.sub_title{position: relative;}
.sub_title h4{font-size: 30px; font-weight: 400; padding-bottom: 40px; position: relative; padding-left: 44px;}
.sub_title .deco_cir{position: absolute; width: 28px; height: 16px; display: inline-block; margin-right: 20px; left: 0; top: 11px; margin-right: 16px;}
.sub_title .deco_cir::before{content: ""; width: 16px; height: 16px; background-color: rgba(130, 199, 236, 0.9); position: absolute; top: 0; left: 0; border-radius: 50%;}
.sub_title .deco_cir::after{content: ""; width: 16px; height: 16px; background-color: rgba(12, 97, 143, 0.9); position: absolute; top: 0; right: 0; border-radius: 50%;}

.sewage01 .con_wrap{width: 100%; background-color: #fff; padding: 60px;}
.cir_con{border-radius: 50%; border: 10px solid #5cbbe2; margin: 0 auto; position: relative; background-color: #fff;}
.cir_con p{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 22px; text-align: center; width: 100%;}
.sewage01 .cir_con{width: 160px; height: 160px;}
.sewage01 .arrow{width: 39px; margin: 0 auto;}
.sewage01 .arrow{padding: 25px 0 25px 0;}
.sewage01 .process{width: 100%;}
.sewage01 .process li{width: 33.333%; padding: 20px; float: left; position: relative; z-index: 3;}
.sewage01 .process .txt_inner{background-color: #e6f2f8; padding: 30px 30px 40px 30px; font-family: 'Noto Sans KR', sans-serif; text-align: center;}
.sewage01 .process .txt_inner h6{font-size: 24px; padding-bottom: 16px; font-weight: 400;}
.sewage01 .process .txt_inner span{font-size: 36px; font-family: 'Lato', sans-serif; color: #0f6593; font-weight: 800; position: relative; top: 3px; padding-right: 10px;}
.sewage01 .process .txt_inner p{font-size: 17px; font-weight: 400; line-height: 1.3;}
.sewage01.filter .process li::before{content: ""; width: 103%; height: 3px; background-color: #dddddd; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: -1;}
.sewage01.filter .process .txt_inner{padding: 16px 16px 26px 16px;}
.sewage01.filter .process .txt_inner h6{padding-bottom: 6px; font-size: 18px;}
.sewage01.filter .cir_con{width: 130px; height: 130px; display: inline-block;}
.filter .cir_con p{font-size: 18px;}
.sewage01.filter .arrow{width: 30px; display: none;}
.sewage01.filter .con_wrap{margin-bottom: 40px; text-align: center; position: relative;}
.sewage01.filter .con_wrap:last-child{margin-bottom: 0px;}
.sewage01.filter .process{width: calc(100% - 290px); display: inline-block; position: relative; top: 14px;}
.sewage01.filter .process .txt_inner span{font-size: 28px;}
.sewage01.filter .process .txt_inner p{font-size: 16px;}
.sewage01.filter .title{font-size: 26px;}
.sewage01.filter .con_txt{padding-top: 18px; padding-bottom: 10px;}
.img_wrap .con_wrap li{width: 50%; padding: 20px; float: left;}
.img_wrap .con_wrap p{text-align: center; font-size: 18px; font-family: 'Noto Sans KR', sans-serif; padding-top: 16px;}
/* --------------------- business 사업분야 --------------------- */

.result_table{width: 100%; background-color: #fff; padding: 60px; overflow-x: auto;}
.result_table table{width: 100%; font-family: 'Noto Sans KR', sans-serif; min-width: 400px;}
.result_table th,.result_table td{text-align: center; padding: 15px; vertical-align: middle; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.result_table th{background-color: #eee;}
.result_table .empty{padding: 60px 0;}

.pagenation_wrap{width: 100%; text-align: center; padding-top: 40px; font-family: 'Noto Sans KR', sans-serif;}
.page_board{display: inline-block;}
.page_board>li{float: left; overflow: hidden;  padding: 10px 20px; cursor: pointer;}
.page_board>li>a{padding: 10px;}
.page_board>li>b{padding: 10px; display: inline-block; width: 100%; height: 100%;}
.page_active{color: #5cbbe2; font-weight: 900;}
.warning{padding-bottom: 10px; color: #aaa; display: none;}
/* list pagination */
/* --------------------- result 설치실적 --------------------- */



/* ********************************************* *
 * 1400px
 * ********************************************* */
 @media screen and (max-width: 1400px){
   
    .section_wrap section.title{padding-bottom: 80px; padding-top: 60px;}

    .greet_pic{width: 100%; background: url(../img/sub/greeting_mo.jpg)no-repeat; min-height: 500px; background-size: cover; background-position: center;}
    .greet_txt{width: 100%;}    
    
}

/* ********************************************* *
 * 1200px
 * ********************************************* */
 @media screen and (max-width: 1200px){


    .certi li{width: 33.333%;}
    .certi .con_wrap .name{height: 46px;}

    .product02 .txt_inner p br{display: none;}

    .sewage01 .con_wrap{padding: 60px 0;}

    .sewage01.filter .process{width: 100%;}
    .sewage01.filter .arrow{display: block;}
    .sewage01.filter .process li::before{content: none;}
    .sewage01.filter .process li{width: 80%; float: none; margin: 0 auto;}
    .sewage01.filter .con_txt{padding: 20px 20px 30px 20px; word-break: keep-all;}
    .sewage01.filter .con_txt br{display: none;}
    .sewage01.filter .arrow.top{padding-bottom: 0;}


 }

/* ********************************************* *
* 1024px
* ********************************************* */
@media screen and (max-width: 1024px){

    .map_info>ul.add,.map_info>ul.tel{width: 100%; padding: 10px;}
    .map_info li{width: 100%; word-break: keep-all;}
    .map_info .title{border-right: 0;}
    .map_info .info{padding-right: 0;}

    .sewage01 .process .txt_inner p{font-size: 16px; word-break: keep-all; height: 40px;}
    .sewage01.filter .process .txt_inner p{height: auto;}    
    .sewage01 .process .txt_inner h6{font-size: 22px;}
    .sewage01 .process .txt_inner span{font-size: 32px;}
}

/* ********************************************* *
 * 960px
 * ********************************************* */
 @media screen and (max-width: 960px){

    .greet_txt{padding: 80px 60px 80px 60px;}
    .greeting .txt_inner p{word-break: keep-all;}
    .greeting .txt_inner p br{display: none;}
    .sewage01 .process li{width: 50%; padding: 10px 20px;}

 }

 /* ********************************************* *
 * 860px
 * ********************************************* */
 @media screen and (max-width: 860px){

    .common_title{height: 300px;}
    .common_title h1{line-height: 300px; font-size: 36px;}
    section.title h1{font-size: 42px;}
    section.title .deco_line{height: 70px; margin-bottom: 20px;}

    .certi li{width: 50%; padding: 20px 40px;}
    .certi_pic{padding: 0 40px;}
    .img_wrap .con_wrap li{width: 100%;}

    .result_table{padding: 60px 20px;}
    .result_table .num,.result_table .date{display: none;}
    
 }


 /* ********************************************* *
 * 600px
 * ********************************************* */
 @media screen and (max-width: 640px){

    .sub_tab_wrap .bd1200{padding: 0;}
    .sub_tab_home{display: none;}
    .sub_tab_title_box{width: 50%;}
    .tab_in_menu.sub_tab_title_box{border-right: 0;}

    .sub_title h4{font-size: 24px; padding-left: 40px;}
    .sub_title .deco_cir{margin-right: 12px; top: 8px;}

    .greet_txt{padding: 80px 20px 80px 20px;}
    .greeting .txt_inner p{font-size: 16px;}
    .greeting .txt_inner h1{padding-bottom: 30px; font-size: 36px;}

    .certi li{width: 100%;}
    .certi .con_wrap .name{height: auto;}

    .product02 .txt_inner p{margin-bottom: 5px; line-height: 1.6; margin-left: 7px;}
    .product02 .con_wrap li{padding: 30px 20px;}

    .sewage01 .process li{width: 100%;}
    .sewage01 .process .txt_inner{padding: 20px 30px 30px 30px;}
    /* .sewage01 .process .txt_inner p br{display: none;} */
    .sewage01 .process .txt_inner p{height: auto;}
    .cir_con p{font-size: 20px;}

    .sewage01.filter .con_txt{text-align: left;}
    .sewage01.filter .process li{width: 100%}

    .warning{display: block; font-size: 14px;}

 }

 /* ********************************************* *
 * 400px
 * ********************************************* */
 @media screen and (max-width: 400px){

   section.title h1{font-size: 36px;}

    .certi_pic{padding: 0 20px;}
    .greet_pic{min-height: 330px;}

    .certi .con_wrap .name{font-size: 16px;}

 }