#wrap { z-index: 5; }

/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .title_box {font-size: 26px;letter-spacing: 3px;font-weight: 500;}
section .entitle_box {font-size: 50px;font-weight: 500;background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;font-weight: 800;line-height: 1.3;margin-bottom: 20px;text-transform: uppercase;}
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 {width: min(91%,1700px);margin: 0 0 0 auto;display: grid;grid-template-columns: 18% 75%;justify-content: space-between;align-items: center;padding: 7vw 0;}
#product_area .bg_box {width:100vw;left: unset;right: 0;top: 70%;opacity: .75;height: 122%;background-size: cover;background-repeat: no-repeat;background-position: right;}
#product_area .bg_box:before{content:'';width: 280px;height: 380px;position: absolute;left: -190px;top: 0;background: white;transform: skewX(-35deg);}
#product_area .areatit {margin-top: -200px;}
#product_area h1 { font-size: 18px; font-weight: 500; letter-spacing: 1px; text-align: justify; color: #555; margin: 30px 0 60px; }
#product_area .product_slider_wrap { position: relative; --offset-y: 85px; --move-speed: .6s; --move-ease: cubic-bezier(.22,.61,.36,1); }
#product_area #product_list .product_viewport { overflow: hidden; width: 100%; padding-bottom: calc(var(--offset-y) + 25px); }
#product_area #product_list ul.nowrap_box {list-style: none;display: flex;align-items: flex-start;flex-wrap: nowrap;margin: 0;padding: 0;transform: translate3d(0,0,0);transition: transform var(--move-speed) var(--move-ease);will-change: transform;}
#product_area #product_list li { flex: 0 0 33.333333%; min-width: 0; padding: 0 30px; background: none; margin: 0; box-shadow: none; }
#product_area #product_list li .product_item_inner {position: relative;background: #fbfbfb;padding: 30px;box-shadow: 20px 20px var(--secondary);transform: translate3d(0,0,0);transition: transform var(--move-speed) var(--move-ease);will-change: transform;}
#product_area #product_list li.is-offset .product_item_inner { transform: translate3d(0,var(--offset-y),0); }
#product_area #product_list li .clip { background: white; padding: 35px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
#product_area #product_list li .clip img { aspect-ratio: 1/1; display: block; width: 100%; height: auto; object-fit: contain; }
#product_area #product_list li .info_box { margin: 0 15px 15px; }
#product_area #product_list li .info_box .h3 { height: auto; font-size: 23px; font-weight: 500; letter-spacing: 1px; }
#product_area #product_list li .info_box p { font-weight: 300; }
#product_area #product_list li .atag_item { inset: 0; z-index: 5; }
#product_area .product_controls { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 20px; padding-right: 20px; position: absolute; right: 10%; bottom: 0; }
#product_area .product_arrow {width: 60px;aspect-ratio: 1/1;background: white;color: #333;font-size: 18px;line-height: 1;cursor: pointer;transition: .25s ease;border-radius: 50%;}
#product_area .product_arrow.prev svg { transform: scaleX(-1); }
#product_area .product_arrow svg { width: 18px; height: 18px; fill: #626565; }
#product_area .product_arrow:hover svg { fill: white; }
#product_area .product_arrow:hover { background: var(--secondary); color: #fff; border-color: var(--secondary); }
#product_area .product_dots { display: none; align-items: center; gap: 10px; margin-left: 8px; }
#product_area .product_dot { width: 10px; height: 10px; border-radius: 50%; background: #cfcfcf; cursor: pointer; transition: .25s ease; }
#product_area .product_dot.active { background: var(--secondary); transform: scale(1.05); }

/* about_area */
#about_area {z-index: 5;padding-top: 0;}
#about_area:before{position:absolute;display:block;bottom: -200px;right: 45px;content:"";background: rgb(255 154 63 / 30%);z-index: 0;height:620px;width:270px;-webkit-transform:skewX(-30deg);-ms-transform:skewX(-30deg);transform: skewX(-30deg);}
#about_area .workframe {display:grid;grid-template-columns: 40% 38%;justify-content: space-between;width: min(90%, 1300px);}
#about_area .title_box{padding-left: 70px;}
#about_area .title_box:after{content:"";width:55px;height:9px;background-image: url(/images/44/img-bn-icon01.png);opacity:1;position:absolute;top:50%;left:0;transform:translate(-50%,-50%);-webkit-transform:translateY(-50%)}
#about_area .subtit {color:black;font-size: 23px;margin: -20px 0 40px;font-weight: 500;}
#about_area article p {margin-bottom: 30px;line-height: 210%;letter-spacing: .25px;font-weight: 400;text-align: justify;}
#about_area .clip {clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%, 0 18%);aspect-ratio: 3.5/4;}
#about_area #about_img:after{content:'';position: absolute;width: 380px;aspect-ratio: 1.2/1;background-image: url(/images/44/metal-texture.jpg);right: -180px;bottom: -40px;z-index: -1;background-size: cover;}
#about_area #about_img:before{position:absolute;display:block;top: -70px;left: 5px;content:"";background: var(--primary);height: 130px;width: 120px;-webkit-transform: skewX(-30deg);-ms-transform: skewX(-30deg);transform: skewX(-35deg);}
#about_area .about_sub_1 { width: 350px; top: -10vw; left: -3vw; }
#about_area .about_sub_1 .clip { -webkit-clip-path: url(#clip_about_sub_1); clip-path: url(#clip_about_sub_1); }
#about_area .about_sub_2 {width: 470px;top: -26vw;right: 14vw;}
#about_area .about_sub_2 .clip { -webkit-clip-path: url(#clip_about_sub_2); clip-path: url(#clip_about_sub_2); }
#about_area .about_sub_3 { width: 300px; bottom: -11vw; left: 35vw; }
#about_area .about_sub_3 .clip { -webkit-clip-path: url(#clip_about_sub_3); clip-path: url(#clip_about_sub_3); }
#about_area #about_img{}

/* fakeNumber */
#fakeNumber{width:min(90%, 1000px);margin: 0 auto 0;background: white;padding: 50px 80px;border-radius: 500px;display: grid;grid-template-columns: repeat(4, 1fr);position: relative;z-index: 5;box-shadow: 0 20px 50px rgb(0 0 0 / 10%);gap: 90px;}
#fakeNumber .advantage-item { display: flex; flex-direction: column; align-items: center; }
#fakeNumber .advantage-item .english { color: #999; }
#fakeNumber .advantage-item .number { display: flex; align-items: baseline; gap: 5px; }
#fakeNumber .advantage-item .number b { font-size: 40px; color: var(--primary); }
#fakeNumber .advantage-item .number span {   }
#fakeNumber .advantage-item .h3 { font-size: 18px; font-weight: 500; margin-bottom: 10px; }
#fakeNumber .advantage-item p { font-size: 14px; text-align: center; color: #666; }

/* custom_area */
#custom_area .parallax_svg { --parallax_wave: color-mix(in srgb, var(--secondary) 80%, white); }
#custom_area .parallax_svg.top { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M1440 64V16.67c-90 24.285-138.35 6.45-203.49-2.259-59.67-7.998-119.29 10.198-179.14 5.869-78.82-5.09-135.28-41.99-217.6-1.58C797.82 34.596 776 42.875 718.33 38.326c-164.07-15.317-329.57 33.862-490.92 5.169C150.6 31.857 79.33-8.834 0 16.62V64h1440z' fill='black'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M1440 64V16.67c-90 24.285-138.35 6.45-203.49-2.259-59.67-7.998-119.29 10.198-179.14 5.869-78.82-5.09-135.28-41.99-217.6-1.58C797.82 34.596 776 42.875 718.33 38.326c-164.07-15.317-329.57 33.862-490.92 5.169C150.6 31.857 79.33-8.834 0 16.62V64h1440z' fill='black'/%3E%3C/svg%3E"); }
#custom_area .parallax_svg.bottom { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0 0v47.33c90-24.285 138.35-6.45 203.49 2.259 59.67 7.998 119.29-10.198 179.14-5.869 78.82 5.09 135.28 41.99 217.6 1.58C642.18 29.403 664 21.125 721.67 25.674c164.07 15.317 329.57-33.862 490.92-5.169C1289.4 32.143 1360.67 72.834 1440 47.38V0H0z' fill='black'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0 0v47.33c90-24.285 138.35-6.45 203.49 2.259 59.67 7.998 119.29-10.198 179.14-5.869 78.82 5.09 135.28 41.99 217.6 1.58C642.18 29.403 664 21.125 721.67 25.674c164.07 15.317 329.57-33.862 490.92-5.169C1289.4 32.143 1360.67 72.834 1440 47.38V0H0z' fill='black'/%3E%3C/svg%3E"); }
#custom_area ul li >div { margin: auto; width: 70% }
#custom_area ul li .clip { width: 250px; height: 250px; -webkit-clip-path: url(#clip_custom); clip-path: url(#clip_custom); }
#custom_area ul li h3 { margin: 10px 0 5px; font-size: 20px; }
#custom_area ul li article { font-weight: 300; font-size: 14px; overflow: hidden; margin: 10px 0 60px; height: 66px; text-align: center; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

/* news_area */
#news_area .areatit{position:relative;margin: 0 35px 3vw;}
#news_area .more{right:0;bottom: 0;display: flex;align-items: center;gap: 45px;position: absolute;}
#news_area .arrowBox{display:flex;gap: 10px;}
#news_area .arrowBox a{background:var(--primary);width: 51px;aspect-ratio: 1/1;display: flex !important;border-radius: 50px;align-items: center;justify-content: center;}
#news_area .arrowBox a:hover{background:#323232}
#news_area .arrowBox a svg{fill:white;width: 16px;height: 16px;}
#news_area .arrowBox a#case_prev svg{transform:scaleX(-1);}
#news_area li{margin:0 25px}
#news_area li .infoo{margin: 25px 30px 0;display: flex;flex-direction: column;align-items: stretch;gap: 10px;}
#news_area li .h3 {height: auto;font-size: 20px;-webkit-line-clamp: 2;font-weight: 500;letter-spacing: .5px;}
#news_area li p {height: auto;-webkit-line-clamp: 2;font-weight: 300;letter-spacing: .5px;font-size: 15px;color: #414141;margin-bottom: 30px;}
#news_area .slide-content-cta{position:relative;display:inline-block;vertical-align:middle;text-decoration:none;cursor:pointer;border:0;background:transparent;padding:0;outline:none;width:12rem;height:3rem}
#news_area .slide-content-cta .circle{transition:all 0.45s cubic-bezier(0.65,0,0.076,1);position:relative;display:block;margin:0;width:3rem;height:3rem;background: var(--secondary);border-radius:1.625rem}
#news_area .slide-content-cta .circle .icon{transition:all 0.45s cubic-bezier(0.65,0,0.076,1);position:absolute;top:0;bottom:0;margin:auto}
#news_area .slide-content-cta .circle .icon.arrow{left:0.625rem;width:1.125rem;height:0.125rem;background:none}
#news_area .slide-content-cta .circle .icon.arrow::before{position:absolute;content:"";top: -0.275rem;right:0.0625rem;width:0.625rem;height:0.625rem;border-top:0.125rem solid #fff;border-right:0.125rem solid #fff;transform:rotate(45deg)}
#news_area .slide-content-cta .button-text{transition:all 0.45s cubic-bezier(0.65,0,0.076,1);position:absolute;inset:0;padding:0.75rem 0;margin: 0 0 0 1.05rem;color: var(--black);font-weight: 400;line-height:1.6;text-align:center;text-transform:uppercase;letter-spacing: 0.08rem;font-size: 14px;}
#news_area li:hover .slide-content-cta .circle{width:100%}
#news_area li:hover .slide-content-cta .circle .icon.arrow{background:#fff;transform: translate(1rem,0);}
#news_area li:hover .slide-content-cta .button-text{color:#fff}

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

/* photo_area */
#photo_area .item {width: 260px;height: 200px;}
#photo_area .item img {height: 100%;object-fit: cover;}

@media screen and (max-width: 1460px) {
    #product_area .bg_box{height: 142%;}
    #product_area{grid-template-columns: 25% 70%;width: 95%;}
}
@media screen and (max-width: 1024px) {
    #about_area .workframe{display:flex;flex-direction: column;gap: 30px;}
    #about_area .clip{aspect-ratio:4/3}
    #product_area .bg_box{height: 120%;}
    #fakeNumber{box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;grid-template-columns: repeat(2, 1fr);gap: 30px;border-radius: 110px;margin-top: 40px;}
    #about_area #about_img:after{width: 350px;right: -120px;}
    #product_area{display:block;}
    #product_area .areatit{margin: 0 30px 40px;}
    #news_area .more{display: flex;position:relative;justify-content: flex-end;}
}
@media screen and (max-width: 980px) {
    #fakeNumber{margin-top: -30px;}
    #product_area #product_list li{flex: 0 0 50%;}
	section { padding: 10vw 0; }
    #product_area .bg_box{height: 155%;}
}
@media screen and (max-width: 550px) {
    #about_area:before{height: 360px;width: 250px;right: -105px;}
	section { padding: 12vw 0 ; }
    #about_area #about_img:after{width: 210px;}
    #product_area .bg_box{height: 150%;top: 50%;}
    #product_area .bg_box:before{width: 150px;}
	#product_area .product_slider_wrap { --offset-y: 0px; }
	#product_area #product_list li { flex: 0 0 50%; padding: 0 10px; }
	#product_area #product_list li.is-offset .product_item_inner { transform: translate3d(0,0,0); }
    #product_area .product_controls{position:relative;}
    #product_area #product_list li{flex: 0 0 100%;}
    #product_area #product_list li .product_item_inner{box-shadow:none}
    #product_area{margin:0 auto;padding: 12vw 5%;width: 90%;}
    #fakeNumber{grid-template-columns: 1fr 1fr;padding: 40px 30px;border-radius: 90px;margin: 0 auto;}
    #fakeNumber .advantage-item p{display:none;}
    #news_area .areatit{margin: 0 5px 12vw;}
    #news_area li{margin:0 5px}
    section .entitle_box{font-size:45px;}
}