/* 모든 스타일은 css 충돌방지를 위해 .product을 기준으로 작성 하시면 됩니다. 예) .product .box {} */
  .product{}




html {
  scroll-behavior: smooth;
}

/* 공통 */
#ctt {display: none;}
.clearboth::before, .clearboth::after {display: block; content:""; clear: both;}


/* 페이지타이틀 */
.pageTitle {width: 100%; height: 410px; background: url(../value/images/sub-1.png) no-repeat; background-size: cover; background-position: center center; position: relative;}
.pageTitle_textWrap {width: 1200px; margin: 0 auto;}
.pageTitle .pageTitle_text {width: 100%; position: absolute; top: 55%; transform: translateY(-50%);}
.pageTitle .pageTitle_text h1 {font-size: 45px; color: #fff; letter-spacing: -3px !important; font-weight: 500;}
.pageTitle .pageTitle_text p {font-size:18px; color: #fff; font-weight: 400; letter-spacing: -1px; margin-top: 20px;}


/* 페이지탭 */
.pageTabWrap {width: 100%; height:55px; margin-top: -55px; position: relative; z-index: 1;}
.pageTabWrap .pageTab {width: 1200px; height: 100%; margin: 0 auto; position: absolute; z-index: 1; background: #dc1d1d; left: 50%; transform: translateX(-50%);}
.pageTabWrap .pageTab >li {float:left; width: 20%; }
.pageTabWrap .pageTab >li:first-child {width: 5%;}
.pageTabWrap .pageTab >li:last-child {width: 55%;}
.pageTabWrap .pageTab >li >a {width: 100%; display: block; text-align: center;line-height: 55px; color: #fff; font-size: 16px;font-weight: 500; text-align: left;border-left: 1px solid #e83434; padding-left: 30px;}
.pageTabWrap .pageTab >li:first-child >a {text-align: center; border: none; padding: 0;}
.pageTabWrap .pageTab >li >a:hover  {background: #d20010;}
.pageTab_submenu {width: 100% !important; padding: 15px 0; background: #f9f9f9; border: 1px solid #efefef; display: none;}
.active1 {background: #d20010;}
.active2 {display: block;}
.pageTab_submenu >li {width: 100%;}
.pageTab_submenu >li> a {display: block; width: 100%; font-size: 15px; padding: 10px 30px; background: #f9f9f9; box-sizing: border-box;}
.pageTab_submenu >li> a:hover {color: #d20010;}
.pageTab_arrow {padding-right:20px; float: right;}
.pageTab_arrow img {width: 14px;}



/*주소정보 시설물*/


.product1{}
#ctt{display:none;}
.bl{color:#000;}
.sky{color:#8fb3e4;}
.blue{color:#bd0413;}
.gray_bg{background:#f7f7f7;}
.sky_bg{background:#ffbcbc;}
.blue_bg{background:#1e529e;}
.con{width:1200px;margin:0 auto;}
.basic{font-size: 18px;
  line-height: 36px;
  font-weight: 600;
  color:#333;}
.sub_main_tit{font-size:35px;line-height:47px;font-weight:600;color:#000;}
.sub_main_tit span{display:block;}
.ft18{font-size:18px;font-weight:600;}
.ft22{font-size:22px;font-weight:700;}
.ft28{font-size:28px;font-weight:700;}
.list_border{    display: block;
  width: 40px;
  margin-bottom: 10px;
  height: 10px;
  border-radius: 0;}
.sub_top{width:100%;height:400px;background:url(../product1/images/sub_top.jpg)no-repeat;background-size:cover;}
.sub_top .con{padding-top:120px;}
.sub_top ul{overflow:hidden;}
.sub_top ul li{float:left;}
.sub_top ul li a{display:inline-block;font-size:16px;font-weight:500;color:#fff;}
.sub_top ul li:last-child a{color:#8fb3e4;}
.sub_top h1{font-size:38px;font-weight:500;line-height:46px;color:#fff;padding-top:30px;}
.right_arrow{margin-top: -6px;width: 20px;}



/* 페이지 시작 */


.tab_wrap{margin-top:50px;}
.tab_wheel{    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    background: #8fb3e4;
    margin-top: 0;
    /* transition: all .5s; */}

.tab_wheel li{
    border: 0 !important;}
.tab_wheel .active{background:#1e529e !important}
.tab_wheel li a{color:#fff !important;padding:25px 20px !important;}
.product_tab{display:flex;}
.product_tab li{display:inline-block;width:auto;border:1px solid #e4e4e4;border-left:0;flex-grow:1;text-align:center;}
.product_tab li:first-child{border-left:1px solid #e4e4e4;}
.product_tab li a{display:block;font-size:16px;font-weight:500;padding:10px 15px;}

.page_wrap{padding:70px 0;}
.product{overflow:hidden;}
.product_left{float:left;width:45%;}
.product_right{float:left;width:50%;margin-left:5%;padding-top:106px;}
.product_left img{width:100%;}
.text_box{display: inline-block;
  color: #fff;
  padding: 7px 15px;
  font-size: 18px;
  font-weight: 500;}
.product .sub_main_tit{padding:0px 0 30px 0}
.product_right .ft28{padding-bottom:20px;line-height:38px;border-bottom:2px solid #333;}
.product_right .ft28 span{margin:20px 0;}
.product_txt{padding-top:20px;padding-left:20px;}
.jodal{display: block;
    padding: 10px;
    width: 130px !important;
    margin-right: 10px;
    margin-top: 15px;}
.jodal_txt{display: inline-block;
    background: linear-gradient( 360deg, #0c3b90, #184bda);
    font-size: 16px;
    color: #fff;
    padding: 0px 20px;
    border-radius: 50px;}
.jodal_num{background: #333;
  display:inline-block;
    font-size: 16px;
    color: #fff;
    padding: 0px 20px;
    border-radius: 50px;
  margin-left:7px !important}
.product_txt p{padding-bottom:6px;font-weight:700;}
.product_txt p span{display:block;color:#333;font-size:16px;padding-top:5px;padding-left:10px;line-height:28px;font-weight:600;}
.product_img1{position:relative;}
.product_img2{background: #f2f2f2;
  padding: 20px;
  margin-top: 20px;}
.nara{margin-top:15px;}
.nara a{font-size:18px;font-weight:600px;display:inline-block;padding:0px 25px;border-radius:50px;border:1px solid #e4e4e4;}
.nara img{    display: inline-block;
    width: 30px;
    margin-right: 6px;}

.jodal_img_txt{display:flex;align-items:center;}

.picture1{} 
.picture1 .con{overflow:hidden;margin-top:70px;}
.picture1 .con img{float:left;width:49.5%;}
.picture1 .con img:nth-child(2){height: 421px;margin-left:1%;object-fit: cover;}

.page_wrap2{}
.page_wrap2 .ft28{border-bottom: 2px solid #474747;
    padding-bottom: 24px;}
.sub_txt{padding-top:30px;}
.page_wrap2 .blue{padding:15px 0 30px 0;}

.product_table{}
.line_circle{    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 4px solid #ffbcbc;
    display: inline-block;
    position: relative;
    top: -2px;
    margin-right: 7px;}
.product_table .sub_table_tit{padding:50px 0;border:none;display:inline-block;}
.product_table .sub_table_tit span{border: 1px solid #ccc;
    color: #333;
    font-size: 16px;
    padding: 10px 15px;
    margin-left: 10px;
    border-radius: 32px;
    font-weight: 600;
    background: #fff;
}

.product_table:before, .product_table:after{display:block;content:"";clear:both;}
.product_table table{width:100%;border-collapse:collapse;}
.product_table table tr{}
.product_table table td{text-align:center;padding:15px;font-size:16px;font-weight:600;color:#000;background:#fff;border:1px solid #f2f2f2;}
.product_table table tr:nth-child(4n) td{background:#e7edf6;}
.product_table table tr:nth-child(5) td{background:#e7edf6;}
.product_table table tr:nth-child(9) td{background:#e7edf6;}
.product_table table tr:nth-child(13) td{background:#e7edf6;}
.product_table table tr:nth-child(17) td{background:#e7edf6;}
.product_table table tr:nth-child(21) td{background:#e7edf6;}
.product_table table tr:nth-child(25) td{background:#e7edf6;}
.product_table table tr:nth-child(29) td{background:#e7edf6;}
.product_table table tr:nth-child(34) td{background:#e7edf6;}
.product_table table tr:nth-child(38) td{background:#e7edf6;}
.product_table table tr:nth-child(42) td{background:#e7edf6;}
.product_table table tr:nth-child(46) td{background:#e7edf6;}
.product_table table tr:nth-child(50) td{background:#e7edf6;}
.product_table table tr:nth-child(54) td{background:#e7edf6;}
.product_table table tr:nth-child(58) td{background:#e7edf6;}
.product_table table tr:nth-child(62) td{background:#e7edf6;}
.backnone{background:#fff !important;}
.backnone td{background:#fff !important;}
.table_blue td{background:#e7edf6 !important;}
.table_more, .table_close{width: 150px;overflow-anchor: none;
    height: 40px;
    line-height: 40px;
    background: #fff;
    color: #fff;
    font-size: 18px;
    color: #333;
    margin: 30px auto;
    box-shadow: 0;
    border: 1px solid #e4e4e4;
    font-weight: 600;
	display:block;}
.table_more span{display:block;}


.product_table table .table_tit td{color:#fff !important;border:none;}

.product_image{width:40%;float:left;}
.obfit img{    height: auto;
    width: 100%;
    object-fit: cover;}
.product_standard{width:60%;float:left;padding-left:50px;}





.page_wrap3 h1{    border-bottom: 2px solid #474747;
padding-bottom: 24px;}
.wrap3_box{position:relative;display:flex;margin-top:50px;border:1px solid #e4e4e4;}
.gray_arrow{    position: absolute;
    top: 52%;
    left: 45%;
    transform: translate(-50%,-50%);
    z-index: 9999;
    width: 159px;}
.wrap3_left{padding:100px;width:45%;}
.wrap3_left img{width:400px;}
.wrap3_right{background:#f7f7f7;width:55%;position:relative;}
.wrap3_right img{width: 550px;padding-top: 150px;margin-left: 86px;}
.wrap3_right p{    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 18px;
    font-weight: 500;
    background: #1e529e;
    color: #fff;
    padding: 8px 13px;}


.page_wrap4 h1{border-bottom: 2px solid #474747;padding-bottom: 24px;}

.page_wrap4_product{}
.page_wrap4_product ul{overflow:hidden;margin-top:30px;}
.page_wrap4_product ul li{float:left;width:31.3%;margin:1%;}
.page_wrap4_product ul li p{font-size:18px;font-weight:600;text-align:center;padding-top:20px;}
.page_wrap4_product2{}
.page_wrap4_product2 ul{overflow:hidden;}
.page_wrap4_product2 ul li{float:left;width:48%;margin:0 1%;}


.page_wrap5{background:#f7f7f7;}
.page_wrap5 h1{
  border-bottom: 2px solid #474747;padding-bottom: 24px;}

.page_wrap6 h1{
  border-bottom: 2px solid #474747;padding-bottom: 24px;}
.page_wrap6_image1, .page_wrap6_image2{overflow:hidden;}
.page_wrap6_image1 li{width:29.3%;margin:0 2% 2% 2%;float:left;}
.page_wrap6_image1 li p, .page_wrap6_image2 li p{font-size:18px;font-weight:600;color:#000;text-align:Center;padding-top:20px;}
.page_wrap6_image2{margin-top:50px;}
.page_wrap6_image2 li{width:46%;margin:0 2% 2% 2%;float:left;}
.page_wrap6_image2 li img{padding:20px;background:#f2f2f2;}

.page_wrap7 h1{
  border-bottom: 2px solid #474747;padding-bottom: 24px;}
.page_wrap7_img3{padding:50px;background:#f2f2f2;}

.page_wrap8 h1{
  border-bottom: 2px solid #474747;padding-bottom: 24px;}

.page_wrap8_box{}
.page_wrap8_box .product_table .sub_table_tit{padding:50px 0 10px 0;}
.page_wrap8_leftpadding:30px;border-right:1px solid #e4e4e4;}
.page_wrap8_left .ft18{padding-top:5px;}
.page_wrap8_right{background:#f7f7f7;margin-top:70px;padding-bottom:50px;}
.page_wrap8_right .kinds li{background:#fff;}
.configuration{overflow:hidden;display:flex;margin-top:30px;}
.configuration ul{    overflow: hidden;
    margin-top: 21px;}
.configuration ul li{position:relative;width: 150px;
    height: 150px;
    text-align: center;
    padding: 30px;
    font-size: 18px;
    font-weight: 700;
    float: left;
    color: #000;
    border: 1px solid #e4e4e4;
    /* align-items: center; */
    /* display: flex; */
    background: #f7f7f7;
    line-height: 25px;
    padding-top: 48px;}
.configuration ul li:after{    display: block;
    content: "+";
    position: absolute;
    width: 30px;
    height: 30px;
    background: #8fb3e4;
    color: #fff;
    text-align: center;
    font-size: 25px;
    top: 50%;
    left: 100%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    z-index: 1;}

.configuration ul li:last-child:after{display:none;}
.configuration img{
    width: 350px;
    margin-left: 70px;}
.page_wrap8_box .ft22{padding-top:30px;}

.kinds{overflow:hidden;margin-top:30px;}
.kinds li{    width: 23%;
    float: left;
    margin: 1%;border:1px solid #f2f2f2;}
.kinds li img{    display: block;
    margin: 0 auto;
    padding: 30px;background:#f2f2f2;}
.kinds li p{font-size:18px;font-weight:700;text-align:center;padding:15px 0;color:#000;}
.kinds li p span{display:block;font-size:14px;padding-top:2px;}

/* 추가 */

.mb_sub_quick{display:none;}
.br1024{display:none;}
.br699{display:none;}
.tab_arrow{display:none;}

@media screen and ( max-width:1300px){
  .sub_quick .con{width:100%;}
  .sub_top{background-position:center center;position:relative;height:300px;}
  .sub_top .con{    position: absolute;
    top: 50%;
    left: 60%;
    transform: translate(-50%,-50%);
    padding-top: 0;
    width: 100%;}
  .sub_top h1{font-size:28px;line-height:40px;}
  .sub_quick ul li{width:16.6%}
  .sub_quick ul li a{text-align:center;}
  
  .con{width:90%;}
  
  
  /* 제품소개 */
  .page_wrap{padding:50px 0;}
  .product_tab{display:block;overflow:hidden;}
  .product_tab li{display:block;width:48%;margin:1% 1% 0 1%;border-left:1px solid #e4e4e4;float:left;}

  .sub_main_tit{font-size:24px;}
  .nara{overflow:hidden;}
  .nara a{float: left;
    width: 48%;
    margin: 1%;
    font-size: 16px;
    padding: 0;
    text-align: center;}
  
  .ft28{font-size:20px;line-height:32px !important;}
  .product_right .ft28 span{margin:10px 0;}
  .jodal{width:100px !important}
    .picture1 .con img{object-fit:cover;height:300px !Important;}
  .picture1 .con{width:100%;}
  
  .product_table .sub_table_tit{font-size:20px;}
  
    .wrap3_right img{position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 70%;
    margin: 0;
    padding: 0;}
  .gray_arrow{width:100px;}
  
    .page_wrap8{padding:0;padding-bottom:50px;}
  
}

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

}

@media screen and ( max-width:1024px){
  .sub_quick{display:none;}
  .mb_sub_quick{display:block;}
  .mb_sub_quick .con{width:100%;}
  .mb_sub_active{color:#8fb3e4;font-weight:700;position:relative;border-bottom:1px solid #e4e4e4;}
  .mb_sub_active span{display:inline-block;position:absolute;top:50%;transform:translateY(-50%);right:30px;}
  .mb_sub_active img{width:20px;transform:rotate(180deg);}

  .sub_active_close img{transform:rotate(0deg);}
  .mb_sub_quick a{display:block;font-size:16px;font-weight:600;text-align:left;padding:15px 30px;border-top:1px solid #e4e4e4}
  .mb_sub_quick li:first-child a{border-top:0;}
  .mb_sub_quick li a{background:#f8f8f8;}
  .mb_sub_quick li:last-child a{border-bottom:1px solid #e4e4e4;}
  .sub_top h1{font-size:24px;line-height: 32px;}
  
 /* 제품소개 */
  
  .product_left{width:100%;float:none;}
  .product_right{width:100%;float:none;margin:0;padding-top:30px;}
  .picture1 .con{margin-top:30px;}
  .picture1 .con img{width:100%;float:none;height:auto !Important;}
  .picture1 .con img:nth-child(2){margin-left:0;margin-top:30px;}
  .picture1{width:80%;margin:0 auto;}
  
  .ft18{font-size:16px;}
  .table_more, .table_close{font-size:16px ;}
  .product_table table td{font-size:14px;text-align:left;}
  .product_table table{}
  .product_table{overflow-x:auto;}
  
  .product_image{width:100%;float:none;margin-top:20px;}
  .product_standard{width:100%;float:none;padding-left:0;margin-top:30px;}

  .wrap3_box{display:block;}    
  .wrap3_left{width:100%;float:none;}
  .wrap3_right{width:100%;float:none;}
  .wrap3_right img{position: relative;
    top: 0;
    left: 0;
    transform: translate(0);
    width: 70%;
    margin: 0 auto;
    display: block;
  	padding:100px 0;}
  .wrap3_left img{margin:0 auto;width:90%;}

  .product_image img{width:80%;margin:0 auto;display:block;}
  .wrap3_left img{width:70%;margin:0 auto;display:block;}
  .gray_arrow {
       width: 130px;
    transform: translate(-50%,-50%) rotate( 
90deg);
    left: 50%;
    top: 55%;}
  
  .page_wrap6_image1 li p, .page_wrap6_image2 li p{font-size:16px;}
  .page_wrap6_image2{margin-top:30px;}
  
  .configuration{display:block;}
  .configuration ul li{width:33.3%;}
  .configuration img{margin-left:0;margin:30px auto 0 auto;display:block;}
  
  .page_wrap7_product2{margin-top:20px;}
  .page_wrap7_img3{padding:30px;}
  
  .kinds li p{font-size:16px;}
  
}

@media screen and ( max-width:799px)
{
  .product_table{padding-top:30px;}
  .product_table .sub_table_tit{padding:0;}
  .product_table h4{display:flex;align-items:top;}
  .product_table .sub_table_tit span{display:block;margin-left:0;margin:10px 0;width:188px;padding:5px 10px;}
  .product_table table{margin-top:30px !important;}
  
  .line_circle{width: 10px;
    height: 10px;
    top: 9px;
  }
  .wrap3_left{padding:50px;}
  .wrap3_left img{width:100%;}
  .wrap3_right img{width:90%;}
  .gray_arrow{display:none;}
  
  .product_image img{width:100%;}
  .page_wrap4{padding:0;padding-bottom:50px;}
  .page_wrap4_product ul li p{font-size:16px;}
  
  .page_wrap4_product2{margin-top:20px;}
    .page_wrap6_image1{margin-top:20px;}
  
  .page_wrap8_box .product_table .sub_table_tit{padding:0 }
  .page_wrap8_box .line_circle{top:-33px;}
  
  .configuration{margin-top:0;}
  .configuration ul li{font-size:16px;height:auto;padding:20px;}
  .configuration img{width:100%;}
  .page_wrap6_image2 li img{padding:10px;}
  
  .kinds li{width:48%;}
  .page_wrap8_right .line_circle{top:0px;}
  .page_wrap8_left .ft18{padding-top:20px;}
  .page_wrap8_right .ft18{padding-top:20px;}
  .page_wrap8_right {
    background: #f7f7f7;
    margin-top: 30px;
    padding-bottom: 50px;
    padding-top: 20px;}
  
  .page_wrap7{padding:0;padding-bottom:50px;}
  
}

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

  .br699{display:block !Important;}
  .nara a{width:100%;margin:2% 0 0 0;}
  .ft18{font-size:16px;}
  .product_txt{padding-left:0;}
  .picture1{width:100%;}
}

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

  .jodal_img_txt{display:block;}
  .jodal{margin-top:0;margin-right:0;}
 .product_tab li a {
    font-size: 14px;
    padding: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;}
  
}




.mb_br{display:none;}

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

  /* 서브탑 */
  .pageTitle_textWrap{width:100%;}
  .pageTitle{height:300px;}

  .pageTitle .pageTitle_text h1{font-size:28px;}
  .pageTitle .pageTitle_text {top: 45%;left: 10%;}


  .pageTabWrap .pageTab{width:100%;}
  .pageTabWrap .pageTab >li:first-child{width:80px;}
  .pageTabWrap .pageTab >li{width:30%;}

  .pageContent{width:90%;}
  .pageContentWrap{padding:50px 0;}
  .pageContent_title h1{font-size:28px;}


  /* 페이지 */

  
}

@media screen and ( max-width:799px){
  .pageContent_title h1{font-size:22px;}

  .pageTitle .pageTitle_text p{font-size:16px;}
  .pageTitle .pageTitle_text h1{font-size:20px;font-weight:700;}
  .pageTabWrap .pageTab >li:first-child{display:none;}
  .pageTabWrap .pageTab >li{width:50%;}

  .mb_br{display:block;}

  /* 페이지 */


}