/* section */
section {padding: 5vw 0;}
section .title_box {margin-bottom: 50px;}
section .title_box span {text-transform: uppercase;line-height: 130%;letter-spacing: 8px;font-weight: bold;font-size: 45px;color: #050a10;margin-top: 15px;}
section .title_box span:first-letter {color:#cb060e;}
section .title_box .page_title {font-weight: bold;font-size: 26px;position: relative;font-family: 'Poppins', sans-serif;margin-right: .3em;background: linear-gradient(to right, rgba(209,4,13,1) 0%,rgba(64,39,40,1) 100%);background: linear-gradient(to right, rgba(209,4,13,1) 0%,rgba(64,39,40,1) 100%);background-clip: text;-webkit-background-clip: text;color: transparent;}

.producTitle{margin:50px 0}
.video-container{position:relative;padding-bottom:49.25%;padding-top:30px;height:0;overflow:hidden}
.video-container iframe,.video-container object,.video-container embed{position:absolute;top:0;left:0;width:100%;height:100%}
.productyoutubee{vertical-align:top;display:grid;grid-template-columns:repeat(3,1fr);gap:20px 20px;padding:0  0 5vw 0}
.productyoutubee h5{text-align:center;font-size:22px;margin-top:10px}

/* custom */
#custom_area .top-title{position:relative;display:flex;justify-content:center;flex-direction:column;align-items:center;margin-bottom:120px}
#custom_area .top-title:before{content:"";position:absolute;width:50px;aspect-ratio:1 / 1;background-size:contain;background-repeat:no-repeat;background-image:url(/images/39/img-point.png);top:-80px}
#custom_area .top-title h2{text-transform:uppercase;line-height:130%;letter-spacing:5px;font-weight:bold;font-size:47px;color:#242424;display:flex;align-items:baseline;position:relative;flex-wrap:wrap;justify-content:center}
#custom_area .top-title h2:before{content:'';position:absolute;border-top:10px solid #cb060e;width:100%;z-index:-1;bottom:0}
#custom_area .top-title h2:after{content:'';position:absolute;width:38px;aspect-ratio:1/1;border-top:5px solid #242424;border-left:5px solid #242424;transform:rotate(0deg);left:-50px;top:-30px}
#custom_area .top-title h2 span{text-transform:uppercase;line-height:130%;letter-spacing:5px;font-weight:bold;font-size:47px;color:#cb060e}
#custom_area .top-title h2 span:nth-child(1){margin-right:15px}
#custom_area .top-title h2 span:nth-child(2){margin-left:15px}
#custom_area .top-title span.d_inblock {    position: relative;}
#custom_area .top-title span{font-size:32px;font-weight:bold;letter-spacing:5px;margin-top:20px;color:#050a10;display:flex;align-items:baseline;}
#custom_area .top-title span.d_inblock:before{content:'';position:absolute;width:38px;aspect-ratio:1 / 1;border-top:5px solid #242424;border-left:5px solid #242424;transform:rotate(180deg);right:-290px;bottom:-30px}
#custom_area .top-title span span{font-size:32px;font-weight:bold;letter-spacing:1px;margin-top:20px;color:#cb060e}
#custom_area .custom{padding-left:18px;padding-right:13px;display:-webkit-box;display:-ms-flexbox;display:grid;grid-template-columns:32% 1fr 32%;position:relative;justify-items:center;align-items:center}
#custom_area .custom .areaTxt{order:-1}
#custom_area .custom .img_item{width:270px;height:100%;aspect-ratio:9/16;object-fit:contain;display:flex;align-items:center}
#custom_area .processList .listItem .Img{position:relative;display:flex;flex-direction:row-reverse;align-items:center;margin-bottom:35px;justify-content:space-between}
#custom_area .processList .listItem .Img:before{content:'';position:absolute;width:90px;background-color:#cacaca;height:1px;right:-90px;z-index:-1}
#custom_area .processList-right .listItem .Img:before{right:390px}
#custom_area .processList-right .listItem .Img{display:flex;flex-direction:row;justify-content:space-between}
#custom_area .processList-right .listItem .Img .title{margin-left:30px}
#custom_area .processList .listItem .Img .title{display:flex;flex-direction:column;align-items:flex-start;width:80%;letter-spacing:2px}
#custom_area .processList .listItem .Img .title .titleEn{font-size:30px;color:#242424}
#custom_area .processList .listItem .Img .title .titleTw{font-size:20px;color:#696969;font-weight:400}
#custom_area .processList .listItem .Img img{border-radius:50%;width:113px;aspect-ratio:1/1;object-fit:cover;border:5px solid rgb(214 6 20);box-shadow:0 6px 10px rgb(0 0 0 / 8%)}
.bottomBox{margin-top: 80px;width: 100%;}
.bottomBox .projectBottomItem .item:nth-child(5){border-right:0px solid #e0e0e0}
.bottomBox .projectBottomItem{cursor:pointer;height:100%;display:grid;grid-template-columns:1fr 1fr 1fr 1fr 30%}
.bottomBox .projectBottomItem .item{height:100%;border-right:1px solid #e0e0e0;-webkit-box-pack:center;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}
.bottomBox .projectBottomItem .Img{display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;width:70px;height:70px;border-radius:50%}
.bottomBox .projectBottomItem .Img img{width:100%;display:block;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;max-width:40px}
.bottomBox .projectBottomItem .Txt{max-width:100%;display:flex;justify-content:center;flex-direction:column;align-items:center}
.bottomBox .projectBottomItem .item:nth-child(5) .Txt{background:#cb060e;padding:30px 80px}
.bottomBox .projectBottomItem .item:nth-child(5) .Txt .title{color:#fff;font-size:22px}
.bottomBox .projectBottomItem .title{font-size:19px;font-weight:500;letter-spacing:1px;line-height:30px;color:#000}
.bottomBox .projectBottomItem .subtitle{font-weight:500;margin-top:4px;font-size:19px;color:#202020}
#mainArea{background: linear-gradient(to right, rgb(1 9 12) 0%, rgb(1 9 12) 50%, rgb(14 28 39) 100%);background: linear-gradient(to right, rgb(1 9 12) 0%, rgb(1 9 12) 50%, rgb(2 11 14) 100%);}

/*about_areaa*/
#about_area{background-image: url(/images/39/img-ab-bg.jpg);background-size: cover;padding: 4vw 2vw 5vw;background-attachment:local;background-position: 50% 50%;background-repeat: no-repeat;}
#about_area::before{position:absolute;bottom: 0;left:0;z-index: 2;content:"";width:100%;height:240px;display:block;background: linear-gradient(to top, rgb(1 9 12), rgba(0, 0, 0, 0));pointer-events:none}
#about_area .title_box .page_title {background: linear-gradient(to right, rgba(209, 4, 13, 1) 0%, #fff 60%);background: linear-gradient(to right, rgba(209, 4, 13, 1) 0%, #fff 60%);background-clip: text;width: 265px;}
#about_area .title_box .page_title:before{content:'';width: 50px;aspect-ratio: 1 / 1;background-size: contain;background-repeat: no-repeat;background-image: url(/images/39/img-point-w.png);opacity: 1;position: absolute;top: 0;right: 0px;transform: translateY(-15%);-webkit-transform: translateY(-15%);}
#about_area .linkArea{display: grid;grid-template-columns: 40% 1fr;margin: 0;gap: 20px;}
#about_area .linkArea .right{width: 300px;}
#about_area .linkArea .title{width: 100%;}
#about_area .title_box span{color:#fff;text-align:left;display:block;position:relative;padding: 10px 0 30px 0;}
#about_area .title_box .page_title::after{display:none}
#about_area .item h4,#Service_area .txt_box,#Service_area .txt_box b{color:#fff}
#about_area .txt_box p{position: relative;display:flex;flex-direction:column;align-items:flex-start;font-size: 21px;font-weight: 500;padding-left: 30px;letter-spacing: 2px;color: #fff;}
#about_area .txt_box p:before{content: '';position: absolute;border-left: 5px solid #fff;height: 70%;z-index: 0;bottom: 0;left: 0;}
#about_area .txt_box p:after{content: '';position: absolute;border-left: 5px solid #cb060e;height: 50%;z-index: 0;top: 0;left: 0;}
#about_area .txt_box b{font-size:36px}
#about_area .item h4{font-size:20px;font-weight:400;letter-spacing:1.5px}
#about_area .link_btn{display:flex;justify-content:flex-start}
#about_area .link_btn .more_btn{margin-right:20px}

@media screen and (max-width: 1440px){
	.bottomBox{width:100%;margin-top: 0px;}
    #about_area .linkArea{
}
}
@media screen and (min-width: 1281px){
	#about_area .d_flex { align-items: center; }
}
@media screen and (max-width: 1280px){
	#about_area .img_item:before,#about_area .img_item img{width:100%}
	#about_area .img_item img{height:100%}
	#custom_area .custom{grid-template-columns:1fr 40% 40%}
	#custom_area .custom .areaTxt{order:0}
	#custom_area .processList .listItem .Img{display:flex;flex-direction:row}
	#custom_area .processList .listItem .Img:before{display:none}
	#custom_area .processList .listItem .Img .title{margin-left:30px}
	#custom_area .processList .listItem .Img .title .titleEn{font-size:26px}
	#custom_area .processList .listItem .Img .title .titleTw{font-size:18px}
	#custom_area .custom .img_item{width:200px;margin-right:20px}
	#custom_area .processList .listItem .Img img{width:70px}
	.bottomBox .projectBottomItem{grid-template-columns:repeat(2,1fr)}
	.bottomBox .projectBottomItem .item{margin-bottom:30px;border:0}
	.bottomBox .projectBottomItem .item:nth-child(5){grid-column:1 / 3}
	#about_area .linkArea{display:grid;grid-template-columns:50% 1fr;justify-items:end}
    .productyoutubee{grid-template-columns:repeat(2,1fr);padding:0 0 15vw 0}
}
@media screen and (max-width: 980px){
	#custom_area .top-title h2:after,#custom_area .top-title font:before,#product_area .productBG::after,#product_area .productBG::before{display:none}
	#custom_area .custom{grid-template-columns:repeat(1,1fr)}
	#custom_area .top-title{margin-bottom:70px}
	#custom_area .custom .img_item{margin-right:0;margin-bottom:70px}
	#custom_area .processList .listItem .Img img{width:100px}
	#about_area .linkArea{display:grid;grid-template-columns:repeat(1,1fr);justify-items:center;width: 100%;margin: 10px auto;}
	section .title_box{margin-bottom: 0;}
	#about_area .linkArea .left{margin-bottom:100px;width: 100%;}

}
@media screen and (max-width: 768px){
	#about_area .img_item { width: 80vw; height: 50vw; }
}

@media screen and (max-width: 550px){
	section .title_box span{font-size:32px;letter-spacing:2px;margin-top: 0;}
	#custom_area .top-title h2 span,#custom_area .top-title h2{font-size:32px}
	#custom_area .top-title span span,#custom_area .top-title font{font-size:24px}
	#about_area .txt_box p{font-size:18px}
	.productyoutubee{grid-template-columns:repeat(1,1fr);padding:0 0 20vw 0}
}

/* imglist */
#imglist img {margin-bottom: 20px;aspect-ratio: 1 / 1;}
#imglist .img_nav img { margin: 0 10px 0 0; width: 100px; height: 100px; }

/* productinfo */
#productinfo h2 {margin: 5px 0 15px;font-size: 28px;}
#productinfo .txt , .buyBtns { margin-bottom: 10px; }
#productinfo .txt label { margin-right: 15px; width: 50px; }
#productinfo .price span { font-size: 18px; }
#productinfo article {margin-bottom: 15px;padding-bottom: 15px;border-bottom: 1px #ddd solid;font-size: 16px;}
#productinfo #community { margin-top: 15px; }

/* orderfunction */
#productinfo #orderfunction { margin-bottom: 25px; }
#orderfunction a { line-height: 24px; }
#orderfunction a.limit { line-height: 21px; }
#orderfunction input { width: 50px; }

/* buyBtns */
.buyBtns a {padding: 10px 0;background: var(--primary);}

/* productTabs */
#productTabs ul.tabs {margin: 70px 0 35px;background-color: #fff;}
#productTabs ul.tabs li a { padding: 10px 40px; }
#productTabs ul.tabs li.active a { color: var(--primary); }

@media screen and (min-width: 1281px){
	#productdetail { display: flex; align-items: center; justify-content: space-between; text-align: justify; }
}
@media screen and (max-width: 1280px){
	#productinfo { margin-top: 5vw; }
	#imglist { width: 100%; }
    #imglist img{height:100%}
}