﻿
/*______________PRODUCTS______________*/




.products-row{
    grid-template-columns: repeat(3,1fr);
    display: grid;
    grid-column-gap: 45px;
    grid-row-gap: 45px;
    width: 100%;
    margin:45px 0;
}

.products-row img{
    width:100%;
}


.products-row .pr-item{
    background-color:#2d2d2d;
    padding: 30px;
    transition: all 0.3s;
}


    .products-row .pr-item:hover {
      background-color:#191919;
    }



.products-row .pr-item .img-con{
    width:100%;
    aspect-ratio:5/4;

}

.products-row .pr-item .img-con img{
    width:100%;
    height:100%;
    object-fit:contain;
    transform:scale(0.95);
    transition:all 0.3s;

}
.products-row .pr-item:hover .img-con img{

    transform:scale(1);


}

.products-row .pr-item .head-con{
    width:100%;
    margin:15px 0;

}


.products-row .pr-item .head-con .head{
    color:#fff;
    font-size:22px;
    font-weight:500;
    margin:0;
    margin-bottom:5px;
}
.products-row .pr-item .head-con .head-en{
    color:#fff;
    font-size:14px;
    font-weight:300;
    margin:0;
}



.products-row .pr-item .desc-con{
   font-size:14px;
   font-weight:300;
   color:#bbb

}









@media(max-width:1199px){

}

@media(max-width:991px){
    .products-row {
    grid-template-columns: repeat(2,1fr);
}


}


@media(max-width:767px){


.products-row{
    grid-template-columns: repeat(2,1fr);
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    margin:20px 0;
}

.products-row .pr-item{
    padding: 15px;

}


.products-row .pr-item .head-con{
    margin:10px 0 0 0;

}


.products-row .pr-item .head-con .head{
    font-size:16px;
    margin-bottom:3px;
}
.products-row .pr-item .head-con .head-en{

    font-size:10px;

}



.products-row .pr-item .desc-con{
   font-size:11px;
   display:none;

}



}










/*_________PRODUCT____________*/




.product-row{
    background-color:#2d2d2d;

    padding-bottom:120px;
}

.product-row .product-con{
    display:flex;
}

.product-row .product-con .txt-col{
    flex:1 0 0;
    max-width:50%;

}


.product-row .product-con .img-col{
    flex:1 0 0;
    max-width:50%;
    aspect-ratio:3/2;
}

.product-row .product-con .txt-col .txt-con{
   padding-right:222px;

}

.product-row .txt-col .head-con{
    margin:45px 0;
}


.product-row .txt-col .head-con .head{
font-size:42px;
font-weight:500;
color:#f57120;
margin:0;
margin-bottom:10px;
}
.product-row .txt-col .head-con .head-en{
font-size:22px;
font-weight:300;
color:#fff;
margin:0;
}


.product-row .txt-col .desc-con {
    margin:45px 0;
}



.product-row .txt-col .desc-con .desc {
 font-size:18px;
 font-weight:300;
}




.product-row .txt-col .feature-con{
display:flex;
justify-content:space-between;
margin:45px 0;

}



.product-row .txt-col .feature-con .feature-item{
padding: 15px;
flex:1 0 0;
text-align:center;

}
.product-row .txt-col .feature-con .feature-item:not(:last-of-type){
border-left:1px solid #666;

}




.product-row .txt-col .feature-con .feature-item .ttl{
font-size:14px;
font-weight:300;
margin-top:10px;
color:#999
}



.product-row .txt-col .feature-con .feature-item .icon img{
width:50px;
height:50px;
object-fit:contain
}


.product-row .txt-col .btn-con{
display:flex;
justify-content:space-between;
margin:45px 0;

}


.product-row .product-con .img-col img,
.product-row .product-con .img-col .product-hero-img{
   width:100%;
   height:100%;
   object-fit:contain;

}










.pr-info-row{
    margin-top:-120px;
}

.pr-info-row .pr-info-con{
   display:flex;

}

.pr-info-row .pr-info-con .txt-col{
    flex:1 0 0;
    max-width:50%;
    padding-top:150px;
    display:flex;
    align-items:flex-end;
    padding-right:45px;

}
.pr-info-row .pr-info-con .txt-col>*{
    min-width:100%;

}

.pr-info-row .pr-info-con .img-col{
    flex:1 0 0;
    max-width:50%;
    aspect-ratio:3/2;
}

.pr-info-row .pr-info-con .img-col img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.pr-info-row .pr-info-con .txt-col .head-con{
    margin:30px 0;

}
.pr-info-row .pr-info-con .txt-col .head-con .head{
    font-size:18px;
    font-weight:400;
    color:#fff;

}

.pr-info-row .pr-info-con .txt-col .spec-con{
   margin:30px 0;

}

.pr-info-row .pr-info-con .txt-col .spec-con .spec-item{
  display:flex;
align-items:center;
padding:5px 0;

}

.pr-info-row .pr-info-con .txt-col .spec-con .spec-item:after{
content:'';
height:1px;
background-color:#444;
flex-grow:1;
order:2;
margin:0 10px;

}
.pr-info-row .pr-info-con .txt-col .spec-con .spec-item .ttl{

order:1;
font-size:14px;
font-weight:300;
color:#aaa
}


.pr-info-row .pr-info-con .txt-col .spec-con .spec-item .val{

order:3;
font-size:14px;
font-weight:400;
color:#fff;

}

.pr-desc-row{
    margin:90px 0;
}

.pr-desc-row .desc-con .head{
    font-size:28px;
    font-weight:400;
    color:#f57120;
    margin:0;
}
.pr-desc-row .desc-con .head span{
    font-size:20px;
    font-weight:300;
    display:block;
    color:#fff
}
.pr-desc-row .desc-con .desc{
    margin:30px 0;
       font-size: 16px;
    font-weight: 300;
    column-count: 2;
    column-gap: 30px;
    column-rule: 1px solid #666;
}

.pr-desc-row .desc-con .img{
    aspect-ratio:4/1;

}

.pr-desc-row .desc-con .img img{
    width:100%;
    height:100%;
    object-fit:cover;

}



@media(max-width:1499px){

.product-row .product-con .txt-col .txt-con{
   padding-right:45px;

}
}


@media(max-width:1199px){

}
@media(max-width:991px) {

}

@media(max-width:767px) {


.product-row{

    padding-bottom:120px;
}

.product-row .product-con{
    flex-direction:column-reverse;
}

.product-row .product-con .txt-col{
   min-width:100%;
    max-width:initial;

}


.product-row .product-con .img-col{
 min-width:100%;
    max-width:initial;

    aspect-ratio:3/2;
}

.product-row .product-con .txt-col .txt-con{
   padding:0 20px;

}

.product-row .txt-col .head-con{
    margin:0 0 20px 0;
}


.product-row .txt-col .head-con .head{
font-size:30px;
margin-bottom:7px;
}
.product-row .txt-col .head-con .head-en{
font-size:18px;
}


.product-row .txt-col .desc-con {
    margin:20px 0;
}



.product-row .txt-col .desc-con .desc {
 font-size:14px;
}




.product-row .txt-col .feature-con{
margin:20px 0;

}



.product-row .txt-col .feature-con .feature-item{
padding: 10px;

}



.product-row .txt-col .feature-con .feature-item .ttl{
font-size:10px;
margin-top:10px;

}



.product-row .txt-col .feature-con .feature-item .icon img{
width:32px;
height:32px;

}


.product-row .txt-col .btn-con{
margin:20px 0;

}






.pr-info-row{
    margin-top:-120px;
}

.pr-info-row .pr-info-con{
   flex-direction:column;

}

.pr-info-row .pr-info-con .txt-col{
   min-width:100%;
    max-width:initial;
    padding-top:20px;
    padding-right:0;

}


.pr-info-row .pr-info-con .img-col{
   min-width:100%;
    max-width:initial;

}

.pr-info-row .pr-info-con .txt-col .head-con{
    margin:15px 0;

}
.pr-info-row .pr-info-con .txt-col .head-con .head{
    font-size:16px;

}

.pr-info-row .pr-info-con .txt-col .spec-con{
   margin:15px 0;

}

.pr-info-row .pr-info-con .txt-col .spec-con .spec-item{

padding:5px 0;

}


.pr-info-row .pr-info-con .txt-col .spec-con .spec-item .ttl{

font-size:12px;

}


.pr-info-row .pr-info-con .txt-col .spec-con .spec-item .val{

font-size:12px;


}

.pr-desc-row{
    margin:50px 0;
}

.pr-desc-row .desc-con .head{
    font-size:24px;

}
.pr-desc-row .desc-con .head span{
    font-size:16px;

}
.pr-desc-row .desc-con .desc{
    margin:15px 0;
       font-size: 14px;

  column-count: 1;
    column-gap: 30px;

}

.pr-desc-row .desc-con .img{
    aspect-ratio:3/1;

}





}
