#wrap { z-index: 5; }

/* section */
section {padding: 4vw 0;}
section >* { z-index: 3; }
section .title_box {margin-bottom: 3vw;}
section .title_box h2{text-align: center;font-size: max(3 * (1vw + 1vh) / 2, 30px);font-weight: 400;}
section .title_box p{text-align: center;font-size: max(1.8 * (1vw + 1vh) / 2, 19px);font-weight: 300;}
section .clip { margin: auto; width: 100%; }
section .clip img { height: 100%; }
section .clip iframe { width: 100%; height: 100%; top: 0; left: 0; }
section .clip video { width: auto; height: 100%; top: 50%; left: 50%; }

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

/* about_area */
#about_area {z-index: 5;position: relative;overflow: hidden;}
#about_area .title_box {padding-bottom: 0;width: 30%;position: absolute;top: 0;left: 0;}
#about_area .title_box article{margin-top:2vw;color: #6b6b6b;letter-spacing: 0;width: 90%;}
#about_area .title_box * {text-align: left;}
#about_area article { margin-bottom: 30px; line-height: 210%; letter-spacing: 2px; font-weight: 400; }
#about_info{margin:0;}
#about_info #imglist{display:grid;grid-template-columns: 75% 23%;align-items: center;justify-content: space-between;}
#about_info .info{display:flex;align-items: flex-end;}
#about_info .info .photo{position:relative;width: 60%;}
#about_info .info .photo .icon{position:absolute;background: #e3f1ef;border-radius: 130px;border: 1px solid var(--primary);bottom: 28%;left: -20px;display: flex;align-items: center;justify-content: center;width: 150px;height: 150px;}
#about_info .info .photo .icon img{aspect-ratio: 3 / 3;object-fit: contain;}
#about_info .info .tt{margin-bottom:4vw;width: 40%;}
#about_info .info .tt h4{font-size:25px;font-weight: 500;margin-bottom: 20px;}
#about_info .info .tt p{color:#6b6b6b;width: 70%;margin-bottom: 40px;}
#about_info .img_nav .slick-track{overflow: hidden;}
#about_info .img_nav{display: flex;flex-wrap: wrap;}
#about_info .nav_info {display: flex;flex-direction: column;align-items: center;width: calc(50% - 20px);padding: 15.5px 10px;}
#about_info .nav_info:nth-child(even){-webkit-transform:translateY(69px);transform:translateY(69px);}
#about_info .nav_info .Img{padding:20px;border-radius: 50px;border: 1px solid var(--primary);}
#about_info .nav_info img{width:40px;height: 40px;object-fit: contain;-webkit-filter: grayscale(1);}
#about_info .nav_info:hover img{-webkit-filter: grayscale(0);}
#about_info .nav_info:hover .Img{background: #e3f1ef;}
#about_info .nav_info p{color:#6b6b6b;margin-top: 10px;}
#about_info .nav_info:hover p{color:var(--primary)}


/* custom_area */
#custom_area .title_box{margin-top: 4vw;}
#custom_area .workframe{width:1240px;}
#custom_area .track{z-index: -1;position:absolute;width:100vw;max-width:100%;overflow:hidden;top: 50px;white-space:nowrap}
#custom_area .track p{font-weight:600;font-size: 200px;margin:0;text-transform:uppercase;letter-spacing:2px;line-height:1;will-change:transform;animation: marquee 40s linear infinite;color: #f1f1f1;font-family: "Heebo", sans-serif;display: flex;align-items: center;opacity: .5;}
#custom_area .track p img{margin-left:5vw}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
#custom_area ul li{width:calc(100% / 4);margin-right:-4px;vertical-align:top;display:none;overflow: hidden;}
#custom_area ul li:nth-child(1),#custom_area ul li:nth-child(2),#custom_area ul li:nth-child(3),#custom_area ul li:nth-child(4){display:inline-block}
#custom_area ul li .mofd{margin: 0 10px;position:relative}
#custom_area ul li .mofd:after{content:'';background: linear-gradient(180deg, rgb(0 0 0 / 0%), rgb(255 255 255 / 97%));width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 1;}
#custom_area ul li .photo{background-size:auto 100%}
#custom_area ul li .photo img{height: 450px;}
#custom_area ul li .info{position:absolute;bottom: -120px;left:0;width: 100%;padding: 30px 0;z-index: 2;}
#custom_area ul li.divOver .info{bottom:0;}
#custom_area ul li h3{color: var(--info);font-weight: 500;font-size: 20px;text-align: center;}
#custom_area ul li p{color: var(--info);font-weight:400;font-size: 16px;text-align: center;}

/* news_area */
#news_area{position:relative;background-image: url(/images/44/bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;}
#news_area section{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;padding: 0;}
#news_area .bgg:after{content:'';position: absolute;right: 0;top: 0;width: 100px;height: 100%;background-image: url(/images/44/img-news-bg.jpg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;}
#news_area .news_box {display:flex;flex-wrap: wrap;justify-content: space-between;width: 1400px;}
#news_left{width: 50%;height: 75vh;background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;}
#news_left img{object-fit:contain;}
#news_left .info_box{margin-top:20px;width: 65%;}
#news_left .info_box .top{display:flex;justify-content: space-between;align-items: center;border-bottom: 1px solid rgb(255 255 255 / 30%);padding-bottom: 15px;margin-bottom: 20px;}
#news_left .info_box p{font-family: "Barlow", sans-serif;font-size: 30px;font-weight: 700;color: var(--white);display: flex;align-items: flex-end;}
#news_left .info_box p b{margin-left:5px;font-family: "Barlow", sans-serif;font-size: 16px;font-weight: 400;color: #fff;margin-bottom: 7px;margin-left: 20px;}
#news_left .info_box .d_inblock.txt_clamp{font-size:14px;background: #fff;border-radius: 0;color: #2b222b;padding: 2px 10px 0;}
#news_left .info_box h3{height:auto;font-size: 18px;color: #fff;-webkit-line-clamp: 2;font-weight: 500;}
#news_left .info_box .more{font-size:14px;margin-top: 50px;color: var(--white);display: inline-block;border-bottom: 2px solid #fff;padding-bottom: 10px;}
#news_left .info_box .more svg{width:17px;height: 17px;fill: #fff;margin-left: 70px;}
#news_left li:hover .info_box .more svg{margin-left:90px;}
#news_right{width: 45%;}
#news_right .title_box h2{text-align:left;}
#news_area .tabs_box{margin-top:30px;display:flex;justify-content:flex-start;flex-direction:column;align-items:center;position:relative;width: 70%;}
#news_area .tabs_btn{width:100%;z-index:100}
#news_area .tabs_box .tabs_btn .newsList{align-items:center;position:relative;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;border-bottom: 2px solid #323232;padding-bottom: 45px;}
#news_area .tabs_box .tabs_btn li{opacity:.5}
#news_area .tabs_box .tabs_btn .active{opacity: 1;}
#news_area .tabs_box .tabs_btn li:hover::after,#news_area .tabs_box .tabs_btn .active::after{opacity:1;-webkit-transform:translate(0px,-50%);transform:translate(0px,-50%)}
#news_area .tabs_box .tabs_btn li:last-child:before{display:none}
#news_area .tabs_box .tabs_body{width:calc(100% - 0px);padding-bottom:20px;margin-top: -2px;}
#news_area .tabs_btn a{padding: 3px 25px 3px 0;font-size: 17px;letter-spacing:0;color:#2f2f2f;font-weight:500;display:block}
#news_area .tabs_btn .active a{color: var(--primary);}
#news_area .tabs_body .tab_info{width:100%;top:0;left:0;opacity:0;pointer-events:none}
#news_area .tabs_body .tab_info.showBox{opacity:1;pointer-events:auto;}
#news_area .tabs_body .tab_info li{padding: 20px 0;border-bottom: 1px solid #c6c6c6;}
#news_area .tabs_body .tab_info li:first-child{}
#news_area .tabs_body .tab_info .items{}
#news_area .tabs_body .tab_info .items .Img{padding-bottom:20px;display:none;width:100%}
#news_area .tabs_body .tab_info .items .Img img{height:310px;width:100%;object-fit:cover}
#news_area .tabs_body .tab_info .items .Txt{width:100%;}
#news_area .tabs_body .tab_info .items .Txt >div:first-child{display:flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
#news_area .tabs_body .tab_info .items .Txt .f_aitems_right{display:flex;align-items: center;justify-content: space-between;}
#news_area .tabs_body .tab_info .items .Txt .f_aitems_right h3{width: calc(100% - 50px);height: auto;font-weight: 400;}
#news_area .tabs_body .tab_info .items .Txt .f_aitems_right p svg{width:18px;height:18px;fill: #323232;}
#news_area .tabs_body .tab_info .items .Txt .time{display:flex;flex-wrap: wrap;align-items: flex-end;}
#news_area .tabs_body .tab_info .items .Txt .time font{font-size: 22px;font-weight: 700;font-family: "Heebo", sans-serif;}
#news_area .tabs_body .tab_info .items .Txt .time b{=:"Barlow", sans-serif;color: #8b8a8a;font-size: 16px;font-weight: 500;margin-left: 10px;margin-bottom: 5px;font-family: "Heebo", sans-serif;text-transform: uppercase;}
#news_area .tabs_body .tab_info li:first-child .items .Img{display:inline-block}
#news_area .tabs_body .tab_info li:first-child article,#news_area .tabs_body .tab_info  li:first-child .items .Txt .more{display:none}
#news_area .tabs_body .tab_info .items .Txt .more{width:auto;border:0px solid var(--info);padding:0}
#news_area .tabs_body .tab_info .items .Txt .more b.arrow{background-color:#ababab;height:1px;width:calc(100% - 60px)}
#news_area .tabs_body .tab_info .category{background: var(--primary);color: #fff;line-height:1;font-size: 14px;font-weight: 300;padding: 5px 12px 7px;}
#news_area .btnBox{margin-top:20px;}
#news_area .btnBox p{display:inline-flex;align-items: center;}
#news_area .btnBox p a{padding:14px 25px;background: var(--primary);color: var(--white);font-size: 15px;}
#news_area .btnBox p a svg{width:18px;height: 18px;fill: var(--white);margin-left: 70px;}
#news_area .btnBox p a:hover svg{margin-left:100px;}

/* book_area */
#book_area li h3 { margin-top: 10px; height: 30px; font-size: 18px; }

/* photo_area */
#photo_area{background-image: url(/images/44/bg.jpg);position: relative;background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;}
#photo_area:after{content:'';position: absolute;bottom: 199px;width: 100%;height: 1px;background: #e6e6e6;}
#photo_area .boxx .item{background:var(--white);padding: 20px 25px 30px;margin: 0 15px;display: flex;flex-direction: column;align-items: center;}
#photo_area .boxx .item h2{font-family: "Heebo", sans-serif;font-size: 36px;font-weight: 400;}
#photo_area .boxx .item h2:after{content:'';background: #cec9c6;height: 30px;width: 1px;display: block;transform: skewX(-45deg);margin: 0 auto 10px;}
#photo_area .boxx .item h3{text-align:center;font-size: 19px;font-weight: 500;height: 64px;}
#photo_area .boxx .item p{text-align:center;font-size: 14px;margin: 15px 0;overflow: hidden;height: auto;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
#photo_area .boxx .item span{display: flex;width: 12px;height: 12px;margin: 10px auto 25px;align-items: center;justify-content: center;}
#photo_area .boxx .item:hover span{width:12px;height:12px;}
#photo_area .boxx .item span:before{content:'';position: absolute;width: 6px;height: 6px;border-radius: 50px;border: 1px solid #e6e6e6;}
#photo_area .boxx .item:hover span:before, #photo_area .boxx .item.slick-current span:before{width:12px;height:12px;}
#photo_area .boxx .item span:after{content:'';position: absolute;width: 6px;height: 6px;background: #e6e6e6;border-radius: 50px;opacity: 0;}
#photo_area .boxx .item:hover span:after, #photo_area .boxx .item.slick-current span:after{opacity:1;}
#photo_area .boxx .item img{}
#photo_area .workframe{width: min(90%, 1100px);}

@media screen and (min-width: 1025px) {
	#custom_area ul.sOver li{width:calc(100% / 5)}
	#custom_area ul.sOver li.divOver{width:calc((100% / 5) * 2)}
	#custom_area ul li .photo a img{height:293px}
}
@media screen and (min-width: 1281px) {
	#custom_area ul li .photo a img{height:373px}
}
@media screen and (min-width: 1681px) {
	#custom_area ul li .photo a img{height:480px}
}
@media screen and (max-width: 1680px){
	#photo_area:after{bottom: 189px;}
}
@media screen and (max-width: 1460px){
	#about_area .about_sub_1 , #about_area .about_sub_2 , #about_area .about_sub_3 { width: 20vw; }
	#product_list{width:500px;margin-left:30px}
	#product_list li .clip{height:590px}
	#about_area .about_sub_2{top:-20vw;right:6vw}
}
@media screen and (max-width: 1280px){
	#news_area .tabs_box{width:85%;}
	#custom_area .workframe{width:90%;}
	#news_left{height: 90vh;}
	#about_info .info .tt{margin-bottom:2vw}
	#about_info .info .photo{order: -1;width: 90%;}
	#photo_area:after{bottom: 172px;}
	#about_info .nav_info p{font-size: 15px;}
}
@media screen and (max-width: 1024px){
	#about_info .info .photo .icon{width:120px;height:120px;}
	#about_area .title_box{width:50%}
	#about_info #imglist{display:block;}
	#about_info .img_nav{display:none;}
	#photo_area:after{bottom: 163px;}
	#custom_area ul li .photo img{height: 330px;}
	#product_list { margin: auto; }
	#news_area li h3 { height: 30px; -webkit-line-clamp: 1; }
}
@media screen and (max-width: 980px){
	#news_area{padding-bottom:6vw}
	#news_area .tabs_box{width:100%;}
	#news_area section{flex-direction: column;}
	#news_left{height: 40vh;width: 100%;margin-bottom: 40px;}
	#news_right{width:90%;}
	#about_info .info .tt{width:100%;margin: 30px 0 0;}
	#about_info .info .tt a{display:none;}
	#about_info .info .tt *{text-align:center;}
	#about_info .info .tt p{width:100%;}
	#about_info .info{display:flex;flex-direction: column;align-items: center;}
	#about_area .title_box article{margin: 2vw auto 0;}
	#about_area .title_box{position: relative;width: 100%;}
	#about_area .title_box *{text-align:center;}
	#custom_area ul li{width:50%;margin: 10px 0;}
	#custom_area ul li .info{bottom:0;}
	section { padding-top: 10vw; }
	#product_list { width: 500px; }
	#product_list li .clip { height: 590px; }
	#about_area .about_sub_2 { top: auto; bottom: 35vw; width: 35vw; }
	#about_area .about_sub_3 { width: 29vw; left: 10vw; }
}
@media screen and (max-width: 760px){
	section {padding: 8vw 0;}
	#product_sub_list >div { margin: 10px auto 50px; }
	#product_sub_list li { width: 150px; }
	#product_sub_list li .clip { height: 150px; }
	#product_list { width: 70vw; }
	#product_list li .clip { height: 80vw; }
	#product_list li .info_box { width: 45vw; height: 30vw; }
}
@media screen and (max-width: 550px){
	#about_info .info .photo{width: 100%;}
	#about_info .info .photo .icon{width: 100px;height: 100px;left: 0;}
	#about_info .info .photo .icon img{width: 40px;}
	#about_area .title_box article{font-size:15px;width: 100%;}
	#photo_area:after{bottom: 152px;}
	#photo_area .boxx .item h3{font-size: 16px;}
	#photo_area .boxx .item{margin:0 2px;}
	section .title_box {margin-bottom: 9vw;}
	#custom_area ul li .photo img{height: 220px;}
	#custom_area ul li{width:100%;}
	#custom_area .track p{font-size:90px;}
	#custom_area .track p img{width: 100px;}
	#product_sub_list li { margin: 10px; width: 35vw; }
	#product_sub_list li .clip { height: 35vw; }
	#product_list { width: 90vw; }
	#product_list li .clip { height: 100vw; }
	#product_list li .info_box { width: 55vw; height: 40vw; }
	#about_area #about_img { width: 80vw; }
	#about_area .about_sub_2 { bottom: 60vw; }
	#news_area li .row { margin: auto; width: 280px; }
	#photo_area .boxx .item p{font-size: 13px;}
}
@media screen and (max-width: 480px){
	#book_area li .row { margin: auto; width: 250px; }
}