#wrap { z-index: 5; }

/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .title_box {font-size: 50px;font-size: max(6*(1vw + 1vh) / 2, 22px);font-family: "Geist", sans-serif;font-weight: 400;color: var(--info);line-height: 1.2;}
section .title_box:first-letter{color:var(--primary)}
section .h2title_box {font-weight: 400;font-size: 30px;margin-bottom: 20px;}
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%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }

/* product_area */
#product_area{padding-top:0}
#new_tabs .tabs_list {margin: 2vw 0 4vw;display: flex;flex-wrap: wrap;justify-content: center;}
#new_tabs .tabs_list li{margin:0 15px;}
#new_tabs .tabs_list li a {border: 1px solid var(--black);}
#new_tabs .tabs_list li a span {border-right: 2px solid var(--black);border-bottom: 2px solid var(--black);}
#new_tabs .tabs_list li.active a {background: var(--primary);border: none;color: var(--white);}
#new_tabs .tabs_list li.active a span {border-right: 2px solid var(--white);border-bottom: 2px solid var(--white);}
#new_tabs .tabs_container ul{display:grid;grid-template-columns: repeat(3, 1fr);}

/* product_list */
#product_list .slick-prev{width: 58px;height: 58px;left: -8%;background: #dddddd;border-radius: 50px;display: flex !important;align-items: center;justify-content: center;!i;!;}
#product_list .slick-prev:before{content:'';opacity: 1;width: 10px;height: 10px;border-right: 2px solid var(--white);border-bottom: 2px solid var(--white);-webkit-transform: rotate(45deg);transform: rotate(135deg);display: block;margin-left: 3px;}
#product_list .slick-next{width: 58px;height: 58px;right: -8%;background: #dddddd;border-radius: 50px;display: flex !important;align-items: center;justify-content: center;!i;!;}
#product_list .slick-next:before{content:'';display: block;opacity: 1;width: 10px;height: 10px;border-right: 2px solid var(--white);border-bottom: 2px solid var(--white);-webkit-transform: rotate(45deg);transform: rotate(-45deg);display: block;margin-right: 3px;}
#product_list li{margin: 0 30px;}
#product_list li .clip{aspect-ratio: 3/3;object-fit: cover;}
#product_list li img{aspect-ratio: 3/3;object-fit: cover;background: #d9dbe7;}
#product_list li a{z-index: 9;}
#product_list li .clip:before{content:'';position: absolute;width: 150px;height: 50px;background-image: url(/userfiles/images/20241111015658638.png);background-size: contain;background-repeat: no-repeat;z-index: 1;opacity: .8;bottom: 35%;left: 50%;transform: translate(-50%, -50%);}
#product_list li .info_box h3{margin-top: 20px;text-align: center;font-size: 18px;height: auto;font-weight: 500;}
/* product_list2 */
#product_list2 .slick-prev{width: 58px;height: 58px;left: -8%;background: #dddddd;border-radius: 50px;display: flex !important;align-items: center;justify-content: center;!i;!;}
#product_list2 .slick-prev:before{content:'';opacity: 1;width: 10px;height: 10px;border-right: 2px solid var(--white);border-bottom: 2px solid var(--white);-webkit-transform: rotate(45deg);transform: rotate(135deg);display: block;margin-left: 3px;}
#product_list2 .slick-next{width: 58px;height: 58px;right: -8%;background: #dddddd;border-radius: 50px;display: flex !important;align-items: center;justify-content: center;!i;!;}
#product_list2 .slick-next:before{content:'';display: block;opacity: 1;width: 10px;height: 10px;border-right: 2px solid var(--white);border-bottom: 2px solid var(--white);-webkit-transform: rotate(45deg);transform: rotate(-45deg);display: block;margin-right: 3px;}
#product_list2 li{margin: 0 30px;}
#product_list2 li img{aspect-ratio: 4/3;object-fit: contain;}
#product_list2 li .info_box h3{margin-top: 20px;text-align: center;font-size: 18px;height: auto;font-weight: 500;}

/* about_area */
#about_area .workframe {margin: 0;display: grid;grid-template-columns: 55% 40%;justify-content: space-between;align-items: center;width: 90%;margin-bottom: 100px;}
#about_area article {margin-bottom: 40px;line-height: 240%;font-weight: 400;text-align: justify;}
#about_area article h2{font-weight:400;letter-spacing: 2px;}
#about_area article p{line-height: 230%;width: 100%;}
#about_area .clip {transform: skewX(20deg);width: 115%;}
#about_area .clip img{aspect-ratio: 5/3;}
#about_info {position: relative;margin-bottom: 5vw;}
#about_info:after{content:url(/images/44/img-about.gif);position: absolute;right: -30%;bottom: -66%;zoom: 25%;z-index: -1;outline: 1px solid rgb(0 0 0 / 15%);outline-offset: -125px;}
#about_area #about_img{transform: skewX(-20deg);left: -190px;overflow: hidden;box-shadow: 70px 80px #f0f4f8;}

#about_info .infotext{}
#about_info .infotext h2{
    font-size: max(2*(1vw + 1vh) / 2, 24px);
    margin-bottom: 20px;
}
/* history */
.h_box{padding: 2vw 0;}
#history{position:relative;display: flex;align-items: center;width: 90%;margin: 0 auto;}
#history, #history *{transition: all 0s ease-in-out;-webkit-transition: all 0s ease-in-out;}
#history li{position:relative;}
#history li .maJmask{
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 5;
}
#history:after{content:'';position: absolute;width: 200%;height: 1px;background: #ddd;z-index: -1;left: -50%;}
#history li h3{color: #dcdcdc;font-size: 56px;font-weight: 600;font-family: "Geist", sans-serif;}
#history li span{width:33px;height: 33px;background: #cfcfcf;border-radius: 50px;display: flex;align-items: center;justify-content: center;position: relative;margin-bottom: 35px;}
#history li.slick-current span{background: var(--primary);}
#history li span:before{content:'';width: 1px;height: 53px;background: #dcdcdc;position: absolute;top: 33px;}
#history li span:after{content:'';width: 11px;height: 11px;position: absolute;background: var(--white);border-radius: 50px;}
#history li article{color:#6b6b6b;font-size: 18px;width: 85%;padding-left: 40px;position: relative;overflow: hidden;height: 55px;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
#history li article:after{content:'';width: 8px;height: 8px;background: #dcdcdc;position: absolute;border-radius: 50px;left: 13px;top: 12px;}
#history .slick-prev{width: 58px;height: 58px;left: -15%;background: #dddddd;border-radius: 50px;display: flex !important;align-items: center;justify-content: center;!i;!;}
#history .slick-prev:before{content:'';opacity: 1;width: 10px;height: 10px;border-right: 2px solid var(--white);border-bottom: 2px solid var(--white);-webkit-transform: rotate(45deg);transform: rotate(135deg);display: block;margin-left: 3px;}
#history .slick-next{width: 58px;height: 58px;right: -15%;background: #dddddd;border-radius: 50px;display: flex !important;align-items: center;justify-content: center;!i;!;}
#history .slick-next:before{content:'';display: block;opacity: 1;width: 10px;height: 10px;border-right: 2px solid var(--white);border-bottom: 2px solid var(--white);-webkit-transform: rotate(45deg);transform: rotate(-45deg);display: block;margin-right: 3px;}

/* material_area */
#material_area:after{content:'';position: absolute;width: 80vw;height: 70%;right: 0;top: 45px;background: #f0f4f8;z-index: -1;}
#material_area .workframe {display:grid;grid-template-columns: 50% 40%;justify-content: space-between;}
#material_area .photo img{aspect-ratio: 4.5/3;object-fit: cover;}
#material_area .info{margin-top:20px;}
#material_area ol{display:grid;grid-template-columns: repeat(3, 1fr);gap: 10px;margin-bottom: 50px;}
#material_area li{position:relative;display:flex;align-items: center;font-size: 18px;}
#material_area li:before{content:'';width: 10px;aspect-ratio: 1/1;background: #cdcdcd;border-radius: 50px;margin-right: 10px;}
#material_area.right .workframe{grid-template-columns: 40% 50%;}
#material_area.right .photo{order:2}
#material_area.right:after{left:0;}

/* news_area */
#news_area li .img_box , #book_area li .img_box { border-radius: 15px; background-color: #f9f9f9; }
#news_area li .info_box { margin: 10px 15px 0; }
#news_area li .time { width: 65px; font-weight: 400; font-size: 13px; }
#news_area li .more_btn { margin-left: 10px; padding: 2px 15px; max-width: calc(100% - 105px); height: 22px; font-weight: 100; font-size: 13px; z-index: 6; }
#news_area li h3 { margin-top: 10px; height: 60px; line-height: 150%; font-size: 20px; -webkit-line-clamp: 2; }

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

/* photo_area */
#photo_area{padding:0;}
#photo_area , #photo_area *{
	transition: all 0s ease-in-out;
	-webkit-transition: all 0s ease-in-out;
}
#photo_area img{width:100%;}
#photo_area .item{position:relative;}
#photo_area .item:before{content:'';position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: linear-gradient(180deg,rgb(0 0 0 / 0%), rgb(0 0 0 / 50%));z-index: 2;}
#photo_area .item:after{content:'';position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: rgb(34 34 34 / 35%);opacity: 0;}
#photo_area .item:hover:after{opacity:1}
#photo_area .item img{outline: 1px solid rgb(255 255 255 / 20%);outline-offset: -25px;}
#photo_area .item:hover img{outline-offset:0;outline: 1px solid rgb(255 255 255 / 0%);}
#photo_area .item .info{bottom: 60px;left: 60px;z-index: 5;}
#photo_area .item .info h5{color:#fff;font-weight: 400;font-size: 18px;letter-spacing: 1px;line-height: 2;}

@media screen and (max-width: 1680px) {
	#about_info:after{bottom: -40%;}
}
@media screen and (max-width: 1460px) {
	#material_area:after{height: 75%;}
	#material_area ol{grid-template-columns: repeat(2, 1fr);}
	.h_box{width: 80%;}
	#about_info:after{zoom: 20%;bottom: -46%;}
}
@media screen and (max-width: 1366px) {
	#about_area article p{width: 100%;}
	#material_area .photo img{aspect-ratio: 3.5/3;}
	#about_area article{width: 100%;margin-bottom: 90px;}
	#about_area .clip img{aspect-ratio:4/3}
}
@media screen and (max-width: 1280px) {
	#about_info:after{right: -53%;}
}
@media screen and (max-width: 1024px) {
	#photo_area{grid-template-columns: repeat(2, 1fr);}
	#about_area article{width: 100%;}
	#about_info{margin:0}
	#about_info:after{display:none;}
	#product_list { margin: auto; }
	#news_area li h3 { height: 30px; -webkit-line-clamp: 1; }
}
@media screen and (max-width: 980px) {
	#about_info{margin-top:50px}
	#about_area #about_img{box-shadow: 40px 50px #f0f4f8;}
	#new_tabs .tabs_container ul{grid-template-columns: 1fr;}
	#new_tabs .tabs_container li{margin: 0 15px 30px;}
	#new_tabs .tabs_list{margin: 5vw 0 8vw;}
	#material_area .photo img{aspect-ratio: 5/3;}
	#material_area .workframe, #material_area.right .workframe{grid-template-columns:1fr}
	#material_area.right .workframe .photo{order:-1}
	#history .slick-prev{left: -25%;}
	#history .slick-next{right: -25%;}
	.h_box{width: 65%;}
	#about_area .clip img{aspect-ratio:5/3}
	#about_area .workframe{grid-template-columns:1fr;margin: 0 auto;gap: 30px;}
	#material_area:after{height: 85%;width: 100%;}
}
@media screen and (max-width: 760px) {
	#history .slick-prev{left: -30%;}
	#history .slick-next{right: -30%;}
	#about_area article{width: 90%;}
	section {padding: 10vw 0;}
	section .clip img{height:auto;}
}
@media screen and (max-width: 550px) {
	#photo_area{grid-template-columns: repeat(1, 1fr);}
	#about_area #about_img {width: 100vw;}
	#about_area .about_sub_2 { bottom: 60vw; }
	#news_area li .row { margin: auto; width: 280px; }
}
@media screen and (max-width: 480px) {
	section .title_box{font-size: 40px;}
	#book_area li.row { margin: auto; width: 250px; }
}