.wow {-webkit-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation-duration: 1s;animation-duration: 1s;}
.Title{margin: 10px 0 40px;}
.title1,.title1 h2{text-align: center;font-family: 'Open Sans', sans-serif;font-size: 45px;font-weight: 800;display: flex;flex-direction: column;align-items: center;position: relative;text-transform: uppercase;}
.title1:after{content:'';width: 40px;height: 2px;display: block;margin: 40px auto 0;background: #cecece;}
.title1:before{content:url(/images/02/index/img-p-title.png);position: absolute;top: -50px;animation-name: fish;animation-direction: alternate;animation-iteration-count: infinite;animation-timing-function: ease-in-out;animation-duration: 2s;}
.title1 .longbar{letter-spacing: 3.2px;font-size: 22px;padding: 25px 0 0;display: inline-block;font-weight: 400;}
@keyframes fish{0%{transform-origin:right bottom;transform:rotate(-3deg);}100%{transform-origin:right bottom;transform:rotate(3deg);}}

/* + products
*----------------------------------------------------------------------------*/
#recomWrap {background: url(/images/02/index/product-bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;}
#recomWrap .box{padding: 70px 0;}
#products{width: 1250px;margin: 0 auto;}
#products ul li .PDStyle{position: relative;}
#products ul li .PDStyle a.moreTT { position: absolute; width: 100%; height: 100%; z-index: 2; }
#products ul {overflow: revert;padding: 30px 0px 0;display: flex;flex-wrap: wrap;flex-direction: row;justify-content: flex-start;margin: 0;}
#products ul li .productPhoto a.photo{-webkit-backface-visibility: hidden;transition: transform .2s;-moz-transition: transform .2s;-webkit-transition: transform .2s;display: block;position: relative;overflow: hidden;}
#products ul li {background: #fff;margin: 0 20px;padding: 40px;border-radius: 35px;}
#products ul li .info {display: flex;position: relative;padding: 0 75px 0 0px;align-items: center;}
#products ul li .info .specific {background: #d03b27;color: #fff;font-size: .75rem;display: inline-block;padding: 5px 7px;line-height: 1;margin: 0;display: none;}
#products ul li h3 {overflow: hidden;font-size: 22px;margin: 10px 0 0;text-align: center;font-weight: 500;}
#products ul li h3 a {color: #595757;font-weight: 400;font-size: 20px;text-align: center;}
#products ul li .info p {letter-spacing: 0.8px;line-height: 24px;font-size: .7375rem;color: #666;margin: 0;padding: 3px 0;}
#products ul li p.info {height: 45px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;padding: 0;margin: 15px 0 40px;}
#products ul li .info .price .sale{line-height: 28px;font-size: 21px;color: #6e6c6c;font-weight: 500;letter-spacing: 0;font-family: 'Kanit', sans-serif;}
#products ul li .info .detail {display: block;position: absolute;width: 40px;text-align: center;right: 8px;}
#products ul li .info .detail:before {content: '';display: block;position: absolute;width: 40px;height: 40px;background: #f15a30;border-radius: 100%;top: 0;left: 0;transition: background .2s;-moz-transition: background .2s;-webkit-transition: background .2s;}
#products ul li .info .detail:after {content: '';display: block;position: absolute;width: 10px;height: 10px;border-top: 2px solid #fff;border-right: 2px solid #fff;top: 15px;left: 11px;transform: rotate(45deg);-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg)}
#products ul li .info .detail span {display: inline-block;line-height: 23px;font-size: .8125rem;color: #f15a30;border-bottom: 1px solid #f15a30;vertical-align: top;margin-top: 4px;padding: 0 2px;opacity: 0;-webkit-transform: translateX(0);transition: opacity .2s,transform .2s;-moz-transition: opacity .2s,transform .2s;-webkit-transition: opacity .2s,transform .2s}
#products .slick-prev{width: 25px;height: 47px;opacity: 1;left: -55px;}
#products .slick-prev:before{content:url(/images/02/index/arrow-left.png);width: 25px;height: 47px;opacity: 1;display: block;}
#products .slick-next{width: 25px;height: 47px;opacity: 1;right: -55px;}
#products .slick-next:before{content:url(/images/02/index/arrow-right.png);width: 25px;height: 47px;opacity: 1;display: block;}

/* + aboutWrap
*----------------------------------------------------------------------------*/
#newsBox .info .more.white{text-align: inherit;padding: 70px 0 0;}


/* + newsWrap
*----------------------------------------------------------------------------*/
/* newsBox */
#newsBox {margin: 0px auto 0;padding: 0;background: url(/images/02/index/new-bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;position: relative;}
#newsBox section {position: relative;margin: auto;padding: 70px 0;width: 70%;}
#newsBox .text-parallax {background: no-repeat 0 0;display: inline-block;position: relative;left: calc(90% - 130px);top: 130px;z-index: 2;}
#newsBox .text-parallax-content {font-size: 150px;line-height: 1;overflow: hidden;mix-blend-mode: darken;-ms-mix-blend-mode: darken;text-transform: uppercase;left: 0;font-family: 'DM Serif Display', serif;font-weight: 700;letter-spacing: 1.5px;display: inline-block;position: relative;color: #ffffff;background-image: url(/images/37/ab-t-bg.jpg);background-size: 320%;background-position: 50% -170%;-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;}
#newsBox .info .main-title {position: relative;margin-top: 10px;margin-bottom: 20px;font-weight: 700;font-size: 35px;line-height: 1.2;color: #ff8511;text-align: center;}
#newsBox .info .tit.row {width: 100%;line-height: 120%;text-align: left;font-size: 45px;color: #ffffff;letter-spacing: 1.5px;padding: 0px 0px 0px;z-index: 15;text-transform: uppercase;border-bottom: 1px solid #333;margin-bottom: 0px;}
#newsBox .info .tit.row span{letter-spacing: 2.5px;font-size: 18px;}
#newsBox .info .tit.row:after {width: 80px;height: 1px;display: block;content: "";margin-top: 15px;background: #f7ca4a;}
.info .more a{background: rgb(179 179 179 / 5%);border-radius: 40px;border: 1px solid #e9e9e94d;padding: 10px 20px 10px 20px;font-family: 'Montserrat', sans-serif;font-weight: 900;position: relative;color: #fff;display: inline-block;text-align: center;}
#newsBox .info .more a font{color: #fff;}
#newsBox .info .tit a {font-family: 'DM Serif Display', serif;text-transform: uppercase;font-size: 45px;letter-spacing: 3px;color: #f7ca4a;display: block;}
#newsBox .row ul{padding: 0 50px;margin-bottom: 0;display: flex;flex-wrap: wrap;justify-content: space-between;}
#newsBox .row ul li {position: relative;width: calc(50% - 80px);background: #f7f7f7;padding: 30px;border-radius: 25px;margin: 20px 0;display: flex;flex-wrap: wrap;justify-content: space-between;}
#newsBox .row ul li .photo{width: 30%;border-radius: 15px;}
#newsBox .row ul li .item{padding: 30px;position: relative;z-index: 10;}
#newsBox .row ul li .Txt{position: relative;width: 65%;}
#newsBox .row ul li .newIcon{font-size: 12px;color: #caa06b;display: flex;align-items: center;padding-bottom: 10px;}
#newsBox .row ul li .newIcon h4{display: block;line-height: 34px;font-size: .7125rem;color: #fff;background: #f15a30;border-radius: 17px;margin-right: 15px;font-weight: 300;padding: 0 5px;}
#newsBox .row ul li .date{font-size: 13px;font-weight: 500;color: #f15a30;text-transform: uppercase;}
#newsBox .row ul li .date strong{line-height: 40px;padding-right: 0px;font-size: 40px;font-family: "Poppins",sans-serif;font-weight: 300;background-color: #ff8511;color: #fff;padding: 9px;}
#newsBox .row ul li .date b{line-height: 20px;font-weight: normal;transform: translateY(0px);padding-left: 10px;font-family: "Poppins",sans-serif;color: #000;}
#newsBox .row ul li h3{margin: 0 0 10px 0;}
#newsBox .row ul li h3 a{color: #000000;font-size: 18px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;line-height: 25px;height: auto;overflow: hidden;}
#newsBox .row ul li p.ellipsis{padding-bottom: 30px;}
#newsBox .row ul li p.ellipsis a{color:#666666;font-size: 15px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;line-height: 25px;height: 50px;overflow: hidden;}

#newsBox .row .btn{text-align: end;}
#newsBox .row .btn a {display: inline-block;position: relative;width: 40px;text-align: center;}
#newsBox .row .btn a:before {content: '';display: block;position: absolute;width: 40px;height: 40px;background: #f15a30;border-radius: 100%;top: 0;left: 0;transition: background .2s;-moz-transition: background .2s;-webkit-transition: background .2s;}
#newsBox .row .btn a:after {content: '';display: block;position: absolute;width: 10px;height: 10px;border-top: 2px solid #fff;border-right: 2px solid #fff;top: 15px;left: 11px;transform: rotate(45deg);-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg)}
#newsBox .row .btn a span {display: inline-block;line-height: 23px;font-size: .8125rem;color: #f15a30;border-bottom: 1px solid #f15a30;vertical-align: top;margin-top: 4px;padding: 0 2px;-webkit-transform: translateX(-45px);transition: opacity .2s,transform .2s;-moz-transition: opacity .2s,transform .2s;-webkit-transition: opacity .2s,transform .2s}
#newsBox li:hover .btn a span{    -webkit-transform: translateX(-55px);}
#newsBox .more{text-align: center;z-index: 99;position: absolute;left: 50%;-webkit-transform: translate(-50%, -30%);-ms-transform: translate(-50%, -30%);transform: translate(-50%, -30%);}
#newsBox .more a {background: #d03b27;color: #fff;display: inline-block;padding: 10px 40px;line-height: 1;margin: 0;}
#newsBox .more a font{font-size: 14px;letter-spacing: 1.5px;-webkit-transition: all .3s ease-out;transition: all .3s ease-out;}

#pd2Wrap {background: url(/images/02/index/img-pdBg2.jpg);background-repeat: no-repeat;background-position: 0 0;background-size: cover;padding: 80px 0;}
#pd2Wrap .info{overflow: hidden;margin-right: 0%;width: 100%;max-width: 1240px;padding-left: 20px;padding-right: 20px;margin: 0 auto;}
#pd2Wrap .info .titleBox p{margin: 10px 0 30px;}
#pd2Wrap .info .titleBox, #pd2Wrap .info .titleBox p, #pd2Wrap .info .titleBox h2, #pd2Wrap .info  article{text-align: center;position: relative;overflow: hidden;color: #fff;}
#pd2Wrap .info .titleBox h2,#pd2Wrap .info article{font-size: 16px;font-weight: 400;width: 390px;margin: auto;}
#pd2Wrap .info article{padding: 10px 0;}
#pd2Wrap .info .deckTop{display: inline-block;margin-bottom: 12px;font-size: 23px;letter-spacing: 0.3em;writing-mode: vertical-lr;height: 140px;}
#pd2Wrap .info .deckTop h3{color: #fff;font-weight: 300;letter-spacing: 5.5px;font-size: 22px;}
#pd2Wrap .info .more{text-align: center;margin: 20px 0 0;}

@media screen and (max-width:1660px) {
}
@media screen and (max-width:1440px) {
	#newsBox section{
    width: 82%;
}
}
@media screen and (max-width: 1366px){
	#products{width:80%}
}
@media screen and (min-width: 1281px) {
	#products ul li:hover .productPhoto a.photo{transform: scale(1.05);-moz-transform: scale(1.05);-webkit-transform: scale(1.05);}
	#products ul li:hover .productPhoto a.photo:before  {opacity: 1}
	#products ul li:hover .productPhoto a.photo:after {opacity: .75;transform: scale(1);-moz-transform: scale(1);-webkit-transform: scale(1)}
	#products ul li:hover .info .detail span {opacity: 1;transform: translateY(0);-moz-transform: translateY(0);-webkit-transform: translateX(-45px);}
	#newsBox .row ul li:hover .date{}
	#newsBox .row ul li:hover h3 a{color: #000000;}
	#pd2Wrap{background-attachment: fixed;}
#newsBox .more a:hover font{letter-spacing: 4.5px;}
}
@media screen and (max-width: 1280px){
	#newsBox {margin-right: 0px;}
	#newsBox .text-parallax-content{font-size: 110px;}
	#newsBox section{display: block;padding: 70px 0;width: 90%;}
	#newsBox .info .more.white{padding: 40px 0 40px;}
	#newsBox .info,#newsBox .row{width: 100%;padding-left: 0;}
	#products ul li {width: 31%;}
	#newsBox:before {right: -40px;bottom: -40px;}
	#newsBox section:after {}
	#newsBox:after{left: -50px;top: 32px;}
}

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

@media screen and (max-width: 768px) {
	#newsBox .row ul li{width:100%;}
	#pd2Wrap .info{width: auto;max-width: 100%;}
	#pd2Wrap .info .titleBox h2, #pd2Wrap .info article{width: auto;}



	.Title{margin: 10px 0 10px;}
	.title1 .longbar{letter-spacing: 9.2px;font-size: 18px;padding: 11px 0 0;}
}

@media screen and (max-width: 640px) {
	#products .slick-prev, #products .slick-next{display: none !important;}
	.btnBox{top: 5%;left: 230px;width: 70px;height: 70px;line-height: 70px;box-shadow: 5px 5px 6px 2.5px rgb(255 149 26 / 17%);}
	#products ul li {width: 100%;margin: 10px 0px;}
	#products ul{padding: 10px 0px 0px;}
    #newsBox .row ul{padding: 0;margin-bottom: 0;}
	#newsBox .row .btn{display:none;}
	#newsBox .row ul li p.ellipsis{padding:0;}
	#newsBox .row ul li{padding:15px;}
}

@media screen and (max-width: 480px) {
	#newsBox {}
	#newsBox .info{width: calc(100% - 0px);}
	#newsBox .text-parallax-content {font-size: 80px;}
	#newsBox .info .tit a {font-size: 35px;line-height: 120%;width: 180px;}
	#product-article ul.tabs li a {padding: 0 10px;font-size: 14px;}
	#newsBox:before {right: -40px;bottom: 10px;background-size: 150px;width: 165px;height: 90px;}
	#newsBox section:after {}
	#newsBox:after{left: 0px;top: 102px;background-size: 100px;width: 120px;height: 120px;}
}

@media screen and (max-width:375px) {
	#newsBox .text-parallax-content {font-size: 60px;}
	#newsBox .text-parallax{top: 170px;left: calc(90% - 80px);}
	#newsBox .info{width: calc(100% - 0px);}
}