/* COMMON */
.bbs-contents {padding-top: 0}
.sub-visual-container{
    overflow: hidden; padding: 60px 0; height: 300px;
    background-repeat: no-repeat; background-position: center;
    width: 100%; opacity: 0;
    -webkit-animation: visualFadeIn .4s ease-in-out .1s forwards;
    animation: visualFadeIn .4s ease-in-out .1s forwards;
}
.sub-visual-container.sv9{height: 500px;}
.sub-visual-wrapper{
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-align: center; -ms-flex-align: center; align-items: center;
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: auto;
    height: 100%; max-width: 1230px; padding: 0 15px; text-align: center; width: 100%;
}
.sub-visual-container .title { z-index: 2; position: relative; line-height: 1; text-align: center; font-size: 62px; font-weight: 600; color: #ffffff; letter-spacing: 1px; }
.sub-visual-container .title small { display: block; margin-bottom: 15px; font-size: 14px; color: #bcc5df; font-weight: 300; letter-spacing: 0.2em; }

.sub-visual-container.sv1,
.sub-visual-container.sv2,
.sub-visual-container.sv3,
.sub-visual-container.sv4,
.sub-visual-container.sv5 { background: url('/child/img/visual/sv1.png') no-repeat center / cover; }
.sub-visual-container.sv9 { background: url('/child/img/visual/sv9.png') no-repeat center / cover; }
.sub-visual-container.sv10 { background: url('/child/img/visual/sv10.png') no-repeat center / cover; }

.navi-container{height: 48px; width: 100%; border-bottom: 1px solid #dfdfdf;}
.navi-container .container{max-width: 1530px !important; height: 100%; display: flex; align-items: center;}
.navi-container p{font-size: 16px; color: #707070; font-weight: 400; line-height: 1;}
.navi-container p img{margin: 0 20px; display: inline-block;}

.sv5_visual{height: 270px; background: url('/child/img/visual/sv5.png') no-repeat left center / cover; width: 100%; max-width: 1600px; box-sizing: border-box; margin: 0 auto;}

.sub-tab-container.sv6, .sub-tab-container.sv12{display: none}
.navi-container.sv12{opacity: 0; visibility: hidden;}


@-webkit-keyframes visualFadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes visualFadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@media (max-width: 1024px){
    .sub-visual-container.sv9{height: 300px;}
    .sub-visual-container { padding: 0; height: 220px; }
    .sub-visual-container .title { font-size: 34px; }
    .sub-visual-container .title small { font-size: 13px; }
}
@media (max-width: 768px){
    .sub-visual-container.sv9{height: 240px;}
    .sub-visual-container { padding: 0; height: 180px; }
    .sub-visual-container .title { font-size: 24px; }
    .sub-visual-container .title small { margin-bottom: 10px; font-size: 11px; }
}
@media (max-width: 500px){
    .sub-visual-container.sv9{height: 180px;}
    .sub-visual-container { padding: 0; height: 160px; }
}


.txt-wrap h5{
    color: #212121;
    line-height: 1;
    margin-bottom: 18px;
    font-weight: 600;
    font-size: 28px;
}

.txt-wrap li,
.txt-wrap p{
    color: #545454;
    font-size: 18px;
}

.txt-wrap p{
    line-height: 28px;
}

.txt-wrap li{
    line-height: 23px;
}


@media (max-width:1024px){

    .txt-wrap h5{
        margin-bottom: 14px;
        font-size: 18px;
    }

    .txt-wrap li,
    .txt-wrap p{
        font-size: 14px;
    }

    .txt-wrap p{
        line-height: 22px;
    }

    .txt-wrap li{
        line-height: 22px;
    }

}

@media (max-width:768px){

}

@media (max-width:500px){

}

@media (max-width:380px) {

}


/* Sub Tab List */
.sub-tab{}
.sub-tab-container { z-index: 2; position: relative; margin: 50px auto 0; max-width: 1230px; padding: 0 15px}
.sv5.sub-tab-container{margin-bottom: 40px;}
.sub-tab-container h2{font-size: 50px; font-weight: 600; color: #212121; text-align: center;}
.sub-tab-container.sv11 h2{display: none;}
.sub-tab-lists { display: flex; flex-wrap: wrap; margin: auto; max-width: 1200px; width: 100%;}
.sub-tab-lists2 {max-width: 1230px; padding: 17px 30px; position: relative; margin: 30px auto 100px;}
.sub-tab-lists2::after{content: ""; position: absolute; display: block; width: calc(100% - 30px); height: 1px; left: 15px; top: 0; background-color: #212121}
.sub-tab-lists2::before{content: ""; position: absolute; display: block; width: calc(100% - 30px); height: 100%; left: 15px; top: 0; background-color: #fafafa}
.sub-tab-container:not(.sv1) .sub-tab-lists{justify-content: center;}
.sub-tab-lists li {width: calc(100% / 6);}

.sub-tab-lists:not(.sub-tab-lists2) li{
    position: relative;
}

/* .sub-tab-lists:not(.sub-tab-lists2) li::after{
    content: "";
    display: block;
    position: absolute;
    width: 1px;
    height: 24px;
    background-color: #e3e3e3;
    right: -1px;
    top: 10px;
    z-index: 2
} */

.sub-tab-lists:not(.sub-tab-lists2) li:nth-child(6)::after,
.sub-tab-lists:not(.sub-tab-lists2) li:last-child::after{
    display: none;
}

.sub-tab-lists2 li{width: 25%}
.sub-tab-lists .link{
    display: flex; align-items: center; justify-content: center; position: relative; padding: 4px; height: 44px; width: 100%;
    line-height: 1.4; text-align: center; font-size: 18px; color: #6f6f6f; font-weight: 400;
    box-sizing: border-box;  background-color: #f2f2f2;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
}
.sub-tab-lists2 .link{
    height: auto; background-color: transparent;
    display: block;
    padding: 8px 5px;
    width: 100%;
}

/*
.sub-tab-lists .link::before{
    content: ''; position: absolute; bottom: 0; left: 0;
    width: 100%; height: 100%; background: #ffffff;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
    -webkit-transform-origin: bottom; transform-origin: bottom;
    -webkit-transform: scaleY(0); transform: scaleY(0);
}*/
.sub-tab-lists .link span { display: block; z-index: 2; position: relative; }
.sub-tab-lists .link--on {background-color: #212121; color: #ffffff; font-weight: 500; }
.sub-tab-lists .link--on::before{
    -webkit-transform: scaleY(1); transform: scaleY(1);
}
.sub-tab-lists2 .link{
    background-color: #545454;
    background-color: transparent;
    font-size: 18px;
    color: #545454;
    text-align: left;
}
.sub-tab-lists2 .link--on{
    background-color: transparent;
    color: #ee0a0a;
    font-weight: 600;
}
.sub-tab-container.sv9, .sub-tab-container.sv10{display: none;}


.sub-tab-line{
    position: absolute;
    display: block;
    width: 1px;
    height: calc(100% - 20px);
    top: 10px;
    background-color: #e3e3e3;
    z-index: 2;
}

.sub-tab-line1{
    left: calc((((100% - 60px) / 4) * 1) + 10px);
}


.sub-tab-line2{
    left: calc((((100% - 60px) / 4) * 2) + 10px);
}

.sub-tab-line3{
    left: calc((((100% - 60px) / 4) * 3) + 10px);
}

.sub-tab-select{
    display: none;
}

.sub-tab-lists2-wrap{
    display: block;
}


@media (max-width: 1630px){
    .sub-tab-container{width: 100%; padding: 0 15px;}
    .sv5_visual{width: calc(100% - 30px);}
    .sub-tab-container.sv5::after{width: calc(100% - 30px) !important; left: 15px !important; transform: translate(0, 0);}
}
@media(min-width:1201px){
	.sub-tab-lists:not(.sub-tab-lists2) .link:not(.link--on):hover{
      background-color: #212121; color: #ffffff; font-weight: 500;
    }
  .sub-tab-lists2 .link:not(.link--on):hover{
      color: #ed1b23; font-weight: 400;
    }
  .sub-tab-lists2 .link:not(.link--on):hover span::after{transform: scaleY(1);}
}
@media (max-width:1200px){
    .sub-tab-lists .link { height: 50px; font-size: 16px; }
    .navi-container{border-top: 1px solid #dfdfdf}
}


@media (max-width:1024px){

  .sub-tab-container h2{font-size: 30px;}
  .sub-tab-lists:not(.sub-tab-lists2){margin-top: 20px}
  .sv5_visual {height: 174px}

   .sub-tab-select{width: calc(100% - 30px); height: 40px; margin: 30px auto 0; background-color: #f4f4f4;
       cursor: pointer; background-size:8px auto;background-position:right 9px center; padding-right: 30px;
       -moz-appearance:none;-webkit-appearance:none;appearance:none;background-image:url('/child/img/icon/select-arrow.png');
       font-size: 14px; color: #6f6f6f; line-height: 40px; text-align: center;
       background-repeat:no-repeat; display: block;}
    .sub-tab-lists2-wrap{display: none;}

    .sv10 .sub-tab-select{
        display: none;
    }

    .sub-tab.active .sub-tab-lists2-wrap{display: block;}

    .sub-tab-lists2{
        padding: 0 15px;
        margin: 0;
    }

    .sub-tab-lists2 li{
        width: 100%;
    }

    .sub-tab-lists2 .link{
        padding: 8px 15px;
        height: auto;
    }

    .sub-tab-lists2::after{
        background-color: #f9f9f9;
    }

    .sub-tab-line{display: none;}
}
@media (max-width:768px){
    .sub-tab-container { margin-top: 0; }
    .sub-tab-lists .link { padding: 12px 10px; height: 100%; line-height: 1.3; font-size: 14px; }
    .sub-tab-lists{justify-content: flex-start;}
    .sub-tab-lists li{width: 33.333%}
    .sub-tab-lists:not(.sub-tab-lists2) li::after{
        display: none;
    }
    .sub-tab-lists2 li{
        width: 100%;
    }
    .sv5_visual {height: 100px}
}
@media (max-width:768px){
}


/*제품리스트 상품검색*/
.p-list-thumbnail{min-height: 364px; display: flex; align-items: center; justify-content: center; border: 1px solid #dfdfdf}

.product-list-header{margin-bottom: 30px; position: relative;}
.product-list-header h3{font-size: 46px; font-weight: 600; color: #212121;}
.product-list-header a{position: absolute; bottom: 0; right: 0}

.p-list-info p:first-child, .all-product-title{font-size: 20px; color: #212121; font-weight: 600;}
.p-list-info p:last-child, .all-product-txt{font-size: 16px; color: #707070; font-weight: 400}

.all-product-section{padding: 90px 0;}
.section1{padding-top: 0}
.section4{padding-bottom: 150px;}
.all-product-section:nth-child(2n){background-color: #fafafa}
.all-product-wrap{display: flex; flex-wrap: wrap;}
.product-img{min-height: 358px; display: flex; align-items: center; justify-content: center; border: 1px solid #dfdfdf; background-color: #fff}
.product-img img{width: 100%; height: 100%; object-fit: cover; min-height: }

.p-list-thumbnail>a>img{width: 100%; }

@media (max-width:1024px){


  .product-list-header h3{font-size: 30px;}


}
@media (max-width:768px){
  .navi-container p{font-size: 14px}
  .sub-tab-container{margin: 0px 0 60px;}
  .product-list-header{margin-bottom: 10px}
  .product-list-header>a>img{width: 40px;}

  .p-list-info p:first-child, .all-product-title{font-size: 16px;}
  .p-list-info p:last-child, .all-product-txt{font-size: 14px;}

  .all-product-section{padding: 50px 0;}
  .section1{padding-top: 0}
  .section4{padding-bottom: 110px;}
}

/*회사소개*/
.section-title{
    font-weight: 600;
    line-height: 1;
    font-size: 42px;
    margin-bottom: 20px;
}

.about-section1{
    padding: 150px 0;
    background-image: url(/child/img/sub/about/s1-bg.png);
    background-position: right top;
    background-repeat: no-repeat;
}

.hash-wrap{
    display: flex;
    margin-bottom: 25px;
}

.hash-wrap img:nth-child(2){
    margin: 0 17px;
}

.hash-wrap img:nth-child(5){
    margin: 0 6px;
}

.about-section1 h3{
    font-weight: 600;
    line-height: 56px;
    font-size: 42px;
    margin-bottom: 38px;
}

.about-section1 p{
    color: #545454;
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 20px;
}

.about-section1 h6{
    color: #545454;
    font-size: 20px;
    line-height: 1;
    font-weight: 600;
    margin-top: 30px
}


@media (max-width:1024px){

    .section-title{
        font-size: 22px;
        margin-bottom: 16px;
    }

    .about-section1{
        padding: 80px 0;
        background-image: none;
    }

    .hash-wrap{
        margin-bottom: 18px;
    }

    .about-section1 h3{
        line-height: 32px;
        font-size: 22px;
        margin-bottom: 20px;
    }

    .about-section1 p{
        font-size: 16px;
        line-height: 26px;
        margin-bottom: 12px;
    }

    .about-section1 h6{
        font-size: 16px;
        margin-top: 20px
    }

}

@media (max-width:768px){

}

@media (max-width:500px){

}

@media (max-width:380px) {

}

.py-120{
        padding: 120px 0;
}

.py-150{
    padding: 120px 0 150px;
}

.about-section2{
    background-color: #f2f2f2;
}

.about-s2-item{position: relative;}

.about-s2-item img{
    display: block;
    width: 100%;
}

.txt-wrap.txt-wrap-absolute{
    position: absolute;
    bottom: 50px;
    left: 50px;
}

.about-s2-item1 .txt-wrap{
    background-color: #fff;
    background-image: url(/child/img/sub/about/s2-img1.png);
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 50px;
}

.sale-list li:not(.sale-list li:last-child){
    margin-bottom: 13px;
}

.sale-list span{
    display: inline-block;
    padding: 0 10px;
    border-radius: 15px;
    background-color: #18a6f7;
    color: #fff;
    font-weight: 600;
    margin-right: 10px;
}

@media (max-width:1024px){
    .py-120{
            padding: 80px 0;
    }

    .py-150{
        padding: 80px 0 100px;
    }

    .txt-wrap.txt-wrap-absolute{
        position: absolute;
        bottom: 24px;
        left: 24px;
    }

    .about-s2-item1 .txt-wrap{
        background-color: #fff;
        padding: 20px 20px 300px 20px;
    }

    .sale-list li:not(.sale-list li:last-child){
        margin-bottom: 10px;
    }

    .sale-list span{padding: 0 8px;
        border-radius: 15px;
        margin-right: 6px;
    }

    .about-s2-item:not(.about-s2-item1) .txt-wrap{
        width: calc(100% - 48px)
    }

    .about-s2-item:not(.about-s2-item1) .txt-wrap h5{
        margin-bottom: 8px;
    }
}

@media (max-width:768px){

}

@media (max-width:500px){

}

@media (max-width:380px) {

}

.about-section3 img{
    display: block;
    margin: 24px auto 0;
}

@media (max-width:1024px){

}

@media (max-width:768px){

}

@media (max-width:500px){

}

@media (max-width:380px) {

}

.about-section4{
    background-color: #f2f2f2;
}

.tab-list > li .button.tab-button-icon{
    height: 130px;
}

.tab-list > li .button.tab-button-icon{
    font-size: 22px;
    font-weight: 500;
    padding: 0;
}

.tab-list > li.on .button.tab-button-icon{
    font-weight: 600;
}

.tab-button-icon{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.tab-icon{
    width: 59px;
    height: 58px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
    margin-bottom: 10px;
}

.tab-icon1{
    background-image: url(/child/img/sub/about/s4-icon1.png);
}

.tab-icon2{
    background-image: url(/child/img/sub/about/s4-icon2.png);
}

.tab-icon3{
    background-image: url(/child/img/sub/about/s4-icon3.png);
}

.tab-icon4{
    background-image: url(/child/img/sub/about/s4-icon4.png);
}

.tab-icon5{
    background-image: url(/child/img/sub/about/s4-icon5.png);
}

li.on .tab-icon1{
    background-image: url(/child/img/sub/about/s4-icon1-on.png);
}

li.on .tab-icon2{
    background-image: url(/child/img/sub/about/s4-icon2-on.png);
}

li.on .tab-icon3{
    background-image: url(/child/img/sub/about/s4-icon3-on.png);
}

li.on .tab-icon4{
    background-image: url(/child/img/sub/about/s4-icon4-on.png);
}

li.on .tab-icon5{
    background-image: url(/child/img/sub/about/s4-icon5-on.png);
}

.performance-item{
    background-color: #fff;
    padding: 30px 26px;
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #dfdfdf;
}

.performance-item li{
    width: 50%;
    font-size: 17px;
    line-height: 27px;
}

@media (max-width:1024px){
    .tab-list > li .button.tab-button-icon{
        height: 84px;
    }

    .tab-list > li .button.tab-button-icon{
        font-size: 16px;
    }

    .tab-icon{
        width: 30px;
        height: 29px;
        margin-bottom: 8px;
    }

    .performance-item{
        padding: 20px;
    }

    .performance-item li{
        font-size: 14px;
        line-height: 22px;
    }
}

@media (max-width:768px){
    .performance-item li{
        width: 100%;
    }
}

@media (max-width:500px){

}

@media (max-width:380px) {

}

.form-section{
    padding: 120px 0 150px;
}

@media (max-width:1024px){
    .form-section{
        padding: 80px 0 100px;
    }
}

@media (max-width:768px){

}

@media (max-width:500px){

}

@media (max-width:380px) {

}
