/* index.less */
#product_area .row .info_box{transform:scale(1);-webkit-transform:scale(1);}#product_area .row .img_box{transform:scale(0);-webkit-transform:scale(0);}@media (min-width:1281px){#product_area .row:hover .info_box{}#product_area .row:hover .img_box{transform:scale(1);-webkit-transform:scale(1);}}@media (max-width:1280px){#product_area .slick-current .img_box{transform:scale(1);-webkit-transform:scale(1);}}

/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .title_box {margin-bottom: 50px;}
section .title_box font {text-transform: uppercase;line-height: 130%;letter-spacing: 8px;font-weight: bold;font-size: 42px;color: #050a10;margin-top: 15px;}
section .title_box font: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;}
#product_area .list_box h2.page_title {width: auto;font-weight: bold;font-size: 42px;position: relative;font-family: 'Poppins', sans-serif;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) 40%,rgba(64,39,40,1) 0%);background-clip: text;-webkit-background-clip: text;color: transparent;margin-bottom: 50px;margin-top: 60px;letter-spacing: 2px;}
#product_area .list_box h2.page_title::after{content:"";width: 40px;aspect-ratio:1/1;background-size:contain;background-repeat:no-repeat;background-image:url(/images/39/img-point.png);opacity:1;position:absolute;top: -40%;left: 50%;transform: translate(-50%, -50%);}

/* list_box */
.list_box .info_box h3 { height: 30px; font-weight: 400; font-size: 18px; }
.list_box .row {margin: 0 15px;display: block;}

/* news_area */
#news_area .list_box .row { padding-bottom: 30px; }
#news_area .list_box .row img {aspect-ratio: 4 / 3;object-position: top;}
#news_area .list_box .row .info_box {padding: 15px;width: calc(100% - 70px);box-shadow: 0 0 10px rgba(var(--black-rgb), .3);left: 20px;bottom: 0;background-color: #ffffff;}
#news_area .list_box .row .info_box p a, #news_area .list_box .row .info_box font{
    color: #000000;
}
#news_area .list_box .row .info_box p * {font-size: 14px;}
#news_area .list_box .row .info_box p a { margin-right: 10px; padding: 0 2px; max-width: calc(100% - 82px); height: 23px; z-index: 2; }

/* product_area */
#product_area{position: relative;padding: 3vw 0;}
#product_area::before{position:absolute;top: 0;left:0;z-index: 1;content:"";width:100%;height: 100%;display:block;background: linear-gradient(to top, rgb(229 229 229), rgb(0 0 0 / 0%));pointer-events:none}

#product_area::after{content:"";position: absolute;width: 100%;height: 100%;top: 0;background: url(/images/39/img-pd-bg.png);background-repeat: no-repeat;background-position: 0 50%;background-size: cover;z-index: 0;}
#product_area .page_title{width:180px}
#product_area .title_box{display:flex;justify-content:space-between;align-items:flex-end}
#product_area .title_box .right{display:flex;align-content:space-between;flex-direction:column;justify-content:space-between;align-items:flex-start}
#product_area .title_box .right .noteBox-bold{font-size:34px;font-weight:bold;letter-spacing:6px;color:#050a10;display:flex;align-items:baseline}
#product_area .title_box .right .noteBox-bold span{font-size:48px;color:#cb060e;margin:0 13px}
#product_area .title_box .right .noteBox{font-size:26px;font-weight:500;letter-spacing:2px}
#product_area .photo{background-repeat:no-repeat;background-position:50% 50%;background-size:cover;position:relative}
#product_area .list_box{display: flex;flex-direction: column;align-items: center;}
#product_area .list_box ul{display:grid;grid-template-columns:repeat(3,1fr);justify-items:stretch}
#product_area li{}
#product_area li .row{position:relative;}
#product_area li .row:after{transform:scale(1);-webkit-transition:all 0.4s ease-in-out;-moz-transition:all 0.4s ease-in-out;-o-transition:all 0.4s ease-in-out;transition:all 0.4s ease-in-out}
#product_area li .row .img_box{transform:scale(1)}
#product_area li  .row .info_box{padding: 30px 0px;width:auto;display: flex;flex-direction: column;align-items: center;}
#product_area li .row .info_box p{display:block;color: #050a10;font-size: 26px;font-weight:bold;line-height:1.4;position:relative;padding-bottom: 10px;text-decoration: underline;text-align: center;}
#product_area li .row .info_box h2{font-size: 18px;color: #404040;font-weight: 400;margin-top: 20px;display: none;}
#product_area .productBG::before{content:'';position:absolute;height: 328px;width: 80px;top: 0;right: 100px;background: #cb060e;opacity:1;z-index: 1;-webkit-transform: skewX(-30deg);-ms-transform: skewX(-30deg);transform: skewX(-30deg);}
#product_area .productBG::after{content:'';position:absolute;height: 486px;width: 80px;bottom: 0;left: 0;background: #cb060e;opacity:1;z-index: 1;-webkit-transform: skewX(-30deg);-ms-transform: skewX(-30deg);transform: skewX(-30deg);}


/* Book_area */
#Book_area{padding: 6vw 0 1vw 0;background-image: url(/images/39/img-b-bg.png);background-repeat: no-repeat;background-position: 50% 0%;position: relative;z-index: 99;margin-top: 0px;}
#Book_area .title_box{margin-bottom: 60px;}
#Book_area .title_box h2{position:relative}
#Book_area .title_box h2::before{content:"";display:block;width: 215px;height: 72px;margin:20px 0;background-image: url(/images/39/img-b-t-01.png);left: -50px;top: -100px;position:absolute}

/* custom */
#custom_area::after{content:"";position:absolute;width:1920px;height:100%;bottom:0;background:url(/images/39/img-cus-bg.png);background-repeat:no-repeat;background-position:50% 40%;background-size:cover;z-index:-5}
#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 font{font-size:32px;font-weight:bold;letter-spacing:5px;margin-top:20px;color:#050a10;display:flex;align-items:baseline;position:relative}
#custom_area .top-title font: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 font 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{width: 80%;}
.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 0 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;}
#about_area .linkArea .right{width: 300px;}
#about_area .linkArea .title{margin-bottom:10px;width: 100%;}
#about_area .title_box font,#Service_area .title_box .page_title{color:#fff;text-align:left;display:block;position:relative;padding: 20px 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: 22px;font-weight: 500;margin-left: 60px;letter-spacing: 2px;color: #fff;}
#about_area .txt_box p:before{content: '';position: absolute;border-left: 5px solid #fff;height: 70%;z-index: -1;top: 46px;left: -58px;}
#about_area .txt_box p:after{content: '';position: absolute;border-left: 5px solid #cb060e;height: 70%;z-index: -1;top: -33px;left: -58px;}
#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}

#news_area{
    padding: 2vw 0;
}
#news_area .title_box{
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
}

@media screen and (max-width: 1440px){
	.bottomBox{width:100%}
}
@media screen and (min-width: 1281px){
	#about_area .d_flex { align-items: center; }
	#news_area .list_box .row:hover .info_box { bottom: 30px; }
	#product_area .row:hover .info_box .line { width: 100%; }
	#book_area .row:hover .info_box { bottom: 0; }
}
@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%}
	#product_area .title_box{display:flex;flex-direction:column;align-items:center}
	#product_area .left{display:flex;justify-content:center;flex-direction:column;align-items:center}
	#product_area .title_box .right{align-items:center}
	#product_area .productBG::before{right:0px}
	#product_area .productBG::after{left:-100px}
	#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}
}
@media screen and (max-width: 980px){
	#Book_area{
    padding: 18vw 0 1vw 0;
}
	#product_area .list_box ul{grid-template-columns:repeat(2,1fr)}
	#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:70%;margin:40px auto}
	section .title_box{margin-bottom: 30px;}
	#about_area .linkArea .left{margin-bottom:100px}
}
@media screen and (max-width: 768px){
	#about_area .img_item { width: 80vw; height: 50vw; }
	#book_area .row img { height: 350px; }
}
@media screen and (max-width: 640px){
	#product_area .list_box ul{grid-template-columns:repeat(1,1fr)}
    #product_area .list_box h2.page_title{
    font-size: 32px;
    margin-bottom: 30px;
}
}
@media screen and (max-width: 550px){
	section .title_box font{font-size:32px;letter-spacing:2px}
	#product_area .title_box .right .noteBox-bold{font-size:28px}
	#product_area .title_box .right .noteBox-bold span{font-size:40px}
	#product_area .title_box .right .noteBox{font-size:20px}
	#product_area li .row .info_box p{font-size:24px}
	#product_area li .row .info_box h2{margin-top:20px}
	#custom_area .top-title h2 span,#custom_area .top-title h2{font-size:32px}
	#custom_area .top-title font span,#custom_area .top-title font{font-size:24px}
	#about_area .txt_box p{margin-left:10px;font-size:18px}
	#about_area .txt_box p:after{height:50%;top:0px;left:-35px}
	#about_area .txt_box p:before{height:50%;top:90px;left:-35px}
}