/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .titleSide{display:flex;align-items:center;justify-content:center}
section .title_box {flex-direction: row;gap: .6em;margin-bottom: 50px;position: relative;display: flex;flex-wrap: wrap;-webkit-box-align: end;align-items: baseline;}
section .title_box h2 {letter-spacing: 2px;display: inline-block;padding-left: 10px;letter-spacing: 2px;font-size: 26px;font-weight: 600;line-height: 1.1;color: #333;}
section .title_box .num{position:absolute;top:-6px;left:3px;line-height:1;-webkit-transform:translateX(-100%);transform:translateX(-100%);font-size:20px;font-weight:700;font-family: "Tenor Sans", serif;color: var(--info);padding-right:16px}
section .title_box .num::before{content:"";position:absolute;top:0;right:0;width:1px;height:52px;background-color:#d8d8d8;-webkit-transform-origin:top right;transform-origin:top right;-webkit-transform:rotate(25deg);transform:rotate(25deg)}
section .title_box .titleEn{font-size:50px;font-weight:700;font-family: "Tenor Sans", serif;line-height:1}
section .title_box .titleEn:first-letter{color:var(--primary)}

.more_btn{display:flex;justify-content:space-between;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;flex-direction:column;width:100%;max-width:110px;background-color:var(--secondary);border:1px solid var(--secondary);border-radius:100px;font-weight:600;line-height:25px;letter-spacing:0.03rem;padding:14px 29px;overflow:hidden;font-family:"Tenor Sans",serif;color:#363636;margin:40px 0 0}
.more_btn img{width:20px;height:20px;object-fit:contain}
.more_btn:hover{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
.more_btn .more{width:40px;height:40px;border-radius:50%;background-color:var(--secondary);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:10px}
.more_btn .more::before{content:"";position:absolute;width:8px;height:8px;border-left:1px solid #363636;border-bottom:1px solid #363636;right:0px;top:50%;left:-5px;margin:auto;-webkit-transform:translateY(-50%) rotate(225deg);transform:translateY(-50%) rotate(225deg)}
.more_btn:after{content:"";position:absolute;right:0;top:0;z-index:-1;width:0;height:100%;background-color:var(--primary);-webkit-transition:all 0.5s 0s ease;transition:all 0.5s 0s ease}
.more_btn:hover:after{width:100%;left:0;right:auto}
.more_btn:hover{color:#fff}

.titleBox .titleTw{margin-top:8px;margin-bottom:8px;font-size:25px;font-weight:700;line-height:1}
.btnWrap{display:flex;align-items:center;justify-content: center;}
.btnWrap .inbtn{display:inline-block;width: 150px;height: 60px;line-height: 60px;padding: 0 20px;font-size:16px;letter-spacing: 0.5px;color: #fff;text-align:center;background: linear-gradient(-210deg, var(--primary), var(--secondary));margin-right:10px;border-radius: 100px;position: relative;text-align: justify;}
.btnWrap a.inbtn:hover{color:#fff;letter-spacing: 1.5px;background: linear-gradient(-210deg, #ff8b00, #ffcb8c);}
.btnWrap .inbtn:hover span{width: 10px;height: 10px;}
.btnWrap .inbtn span{position:absolute;top: 50%;right: 10px;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);display:block;width: 8px;height: 8px;border-radius:100%;background: #fff;}

/* particle-canvas */
#particle-canvas{width:100%;height: 100%;position: absolute !important;bottom: 0;left: 0;z-index: 0;opacity: .23;}
#particle-canvas canvas{width:100%;height:100%;}

/* about_area */
#about_area{padding:60px 0;background: url(/images/46/bg.jpg);}
#about_area .workframe{gap:30px;display:flex;flex-direction:column}
#about_area .title_box{/* display:flex; *//* align-items:flex-start; */margin-bottom:0}
#about_area .title_box h2{font-size: 1.6rem;font-weight: 600;line-height: 1.2;position:relative;}
#about_area .info_box{
    font-size: 17px;
}

/* product_area */
#product_area{background-image:url(/images/46/p-bg.jpg);background-size:cover;position:relative}
#product_area td,#product_area th{padding:10px;border:0px solid #a2a9b1}
#product_area tr.active td{min-height: 48px;font-size:19px;font-weight:700;background-color:var(--primary);white-space:nowrap;color:#fff;letter-spacing:1px}
#product_area tr:nth-child(2n) td{background:#f4f4f4}
#product_area tr.active td{
    padding: 30px 15px;
}
#product_area tr.active td:first-child{border-top-left-radius:10px;}
#product_area tr.active td:last-child{border-top-right-radius:10px}
#product_area th{padding:10px 5px;border-bottom:1px solid #dfdfdf;border-right:1px solid #dfdfdf;background:#3a4856;text-align:center;color:#ffffff;letter-spacing:2px;font-weight:400}
#product_area th:last-child{border-right:none}
#product_area td{background:#fff;color:#2c2c2c;font-size:16px;font-family:"Tenor Sans",serif;padding:15px;margin:0 10px;min-height:65px;border-bottom:1px solid #c7c9c9}
#product_area tr td p{text-align:center}
#product_area tbody tr:hover td{background:#e9e9e9}
#product_area tbody tr:hover td a{color: var(--primary);}

/* book_area */
#book_area {display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;gap: 4%;padding: 3vw 0 8vw 0;background-color: #eee;flex-direction: column;}
#book_area .title_box .sub_title{position:relative}
#book_area .title_box .sub_title:before{position:absolute;width:6px;height:6px;border-radius:50%;background-color:var(--complement);top:-15px;content:""}
#book_area .boxx ul{display:flex;gap:20px 20px;justify-content:center;}
#book_area .boxx li{display:flex;flex-direction:column;gap:.5em;width:calc(100% / 3)}
#book_area .boxx li .bookItem{background-color:#fff;border:1px solid #0000002d;padding:1rem;border-radius:7px}
#book_area .boxx li .Txt{padding:18px 10px 18px 4px}
#book_area .boxx li .img_box{}
#book_area .boxx li .img_box img{aspect-ratio:4 / 2.3}
#book_area .boxx li h3{font-size:1.5rem;margin-top:10px;height:39px}
#book_area .boxx li p{height:58px;-webkit-line-clamp:2;font-size:16px;margin-top:10px}


/* news_area */
#information_area{width:min(90%,1700px);display:grid;grid-template-columns:850px 670px;gap:20px;margin:0 0 0 auto;justify-content:space-between;padding:0 0 3vw 0;align-items:center}
#news_area .bg_box{background-repeat:no-repeat;background-position:50% 50%;background-size:cover}
#news_area .bg_box:before{display:none}
#news_area{padding: 2vw 0 4vw 0;z-index: 10;}
#news_area::before{content:"";position:absolute;pointer-events:none;top:-67px;right:136px;z-index:-1;width:calc(100% - 136px);height:66.1%;border-top-right-radius:40px;background:url(/images/46/n-bg.jpg) no-repeat}
#news_area .newsBox{padding:50px 125px 40px;background-color:#fff;max-width:74%;margin:0 auto;border-top-left-radius:40px}
#news_area .newsBox .workframe{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 50px}
#news_area .titleSide{margin-bottom:0;display:flex;justify-content:flex-start}
#news_area .titleSide .title_box{align-items:baseline}
#news_area .titleSide .title_box h2,#news_area .title_box .num,#news_area .title_box .titleEn,#news_area .title_box .titleEn:first-letter{color:#fff}
#news_area li .img_box{border-radius:15px;background-color:#f9f9f9}
#news_area li{border-bottom:1px solid #e4e4e4;padding:20px 0px;margin: 0 0 2px;}
#news_area li .newsInfoBox{display:flex;flex-wrap:wrap;align-items: baseline;}
#news_area li .newsInfoBox .date{position:relative;font-size:13px;letter-spacing:0.5px;padding-right:15px;margin: 0 13px 0 0;color:#666;border-right:1px solid #dbdbdb}
#news_area li .classTitle{display:flex;align-items: flex-end;margin-bottom:13px}
#news_area li .classTitle .title{position:relative;text-transform:uppercase;font-size:13px;letter-spacing:1px;padding-right: 38px;margin-right:15px;color:#666}
#news_area li .classTitle .title::after{content:"";position:absolute;pointer-events:none;top:calc(50% - 0.5px);right:0;width: 30px;height:1px;background-color:#dbdbdb}
#news_area li .classTitle .class{
    font-size: 16px;
}
#news_area li .info_box{margin-bottom:12px}
#news_area li .info_box .Ntxt{background:#f0f0f0;padding:2px 10px}
#news_area li .time{font-weight:500;font-size:14px;color:#666666;font-family:"Nunito Sans",sans-serif;margin-right:20px;letter-spacing:.5px}
#news_area li .Ntitle_box{display:grid;grid-template-columns: 1fr 120px;gap:120px;justify-content:space-between}
#news_area li h3{height:30px;line-height:150%;font-size:18px;-webkit-line-clamp:1;font-weight:400;text-align:justify;color:#1e1d1d}
#news_area li:before{content:'';width:0;height:1px;position:absolute;background:linear-gradient(-210deg,var(--primary),var(--secondary));bottom:0;left:0;opacity:0}
#news_area li:hover:before{opacity:1;width:100%}
#news_area li:hover .info_box .Ntxt{background:linear-gradient(-210deg,var(--primary),var(--secondary));color:var(--white)}
#news_area li .circleBox,#custom_area ul li .circleBox{position:relative;z-index:10;display:inline-block;border-left: 1px solid #dbdbdb;padding: 0 0 0 10px;}
#news_area li .moreBtn{font-family: "Tenor Sans", serif;font-size: 16px;}
#news_area li:hover .circleBox span,#custom_area ul li:hover .circleBox span{top:60%;width:20px;height:20px}
#news_area li:hover .circleBox .circle,#custom_area ul li:hover .circleBox .circle{width: 8px;height: 8px;background:#fff;}
#news_area li:hover .circleBox .Img,#custom_area ul li:hover .circleBox .Img{opacity:1}
#news_area li .circleBox .circle,#custom_area ul li .circleBox .circle{position:absolute;top: 59%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);display:inline-block;width: 0px;height: 0px;border-radius:100%;}
#news_area li .circleBox .circle{width:40px;height:40px;border-radius:50%;background-color:var(--secondary);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:10px}
#news_area li .circleBox .circle::before{content:"";position:absolute;width:8px;height:8px;border-left:1px solid #363636;border-bottom:1px solid #363636;right:0px;top:50%;left:-5px;margin:auto;-webkit-transform:translateY(-50%) rotate(225deg);transform:translateY(-50%) rotate(225deg)}

@media screen and (min-width: 1000px) {
	#news_area .bg_box{background-attachment: fixed;}
}
@media screen and (max-width: 1680px) {
	#news_area{padding: 2vw 0 8vw 0;}

}
@media screen and (min-width: 1280px) {
    #product_area:after{content:"";display:block;position:absolute;bottom:0;left:0;width:8%;height:25vh;background-color:#e7e7e778;opacity:1;z-index:1;border-top-right-radius:100px}
	#product_area:before{content:"";display:block;position:absolute;top:0%;right:0;width:8%;height:40vh;background-color:#d5e6d578;opacity:1;z-index:1;border-bottom-left-radius:100px}
}

@media screen and (max-width: 1280px) {
    .more_btn{margin: 40px 0 0;font-size: 13px;padding: 10px 23px;}
	#news_area{margin:0 auto;padding: 3vw 0 8vw 0;}
	#news_area .bg_box{display:none}
	.btnWrap{display:flex;flex-direction:column}
	.btnWrap .inbtn{width:calc(100% - 60px);margin-right:0;margin-bottom:10px}
	#book_area{padding: 7vw 0 15vw 0;}
	#book_area .title_box .bookbtn{display:flex;justify-content:center;margin-top:0}
	#book_area .title_box{padding-bottom:5%}
	section .title_box h2{font-size:21px}
	#book_area .boxx{width:100%}
	#book_area .boxx li >*{}
	section .title_box .titleEn{font-size:34px}
	section .title_box .num{font-size:15px}
	section .title_box{margin-bottom:20px;margin-left:20px}
	#about_area .info_box{width:90%;margin:auto}
	#product_area{padding:10vw 0}
	#news_area .newsBox{padding:40px 30px 0;max-width:80%}
	#book_area .boxx li{width:calc(100% / 2)}
}
@media screen and (max-width: 1140px) {
    #news_area .newsBox .workframe{grid-template-columns:1fr;width:100%}
}
@media screen and (max-width: 760px) {
    #news_area li .Ntitle_box{gap:10px;grid-template-columns:1fr 90px}
	#news_area li .circleBox .circle{width:30px;height:30px;right:0}
	#news_area li h3{font-size: 17px;}
	#news_area li .tt{gap:30px;grid-template-columns: 1fr 50px;}
	#news_area li article{font-size:0;border: 0;}
	#product_list{width:auto;overflow-x:scroll;margin:0 0 .5em;-webkit-overflow-scrolling:touch}
	#product_list table{width:900px;border-right:1px #e6e6e6 solid;border-top:1px #e6e6e6 solid}
	#book_area .boxx ul{display:flex;flex-direction:column}
	#book_area .boxx li{width:auto}
	#book_area{padding:11vw 0 16vw 0}
	#news_area::before{top:-30px;right:46px;width:calc(100% - 46px)}
}
@media screen and (max-width: 550px) {
	#news_area li .row { margin: auto; width: 280px; }
	#news_area .newsBox{padding: 10px 20px 0;max-width: 85%;}
}