#wrap { z-index: 5; }
#wrap:before{content:'';width: 1px;position: absolute;left: 9vw;top: -18vh;height: calc(100% + 18vh);background: #fff;z-index: 5;opacity: .4;}
#wrap:after{content:'';width: 1px;position: absolute;right: 9vw;top: 0;height: 100%;background: #e9e9e9;z-index: 5;}

/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .entitle_box {font-size: 17px;font-family: "Cinzel", serif;text-transform: uppercase;font-weight: 100;color: var(--gray);letter-spacing: 0.2em;}
section .title_box {padding-bottom: 3vw;font-size: 30px;letter-spacing: 5px;font-weight: 600;}
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%); }
.more_btn {padding:0;position: relative;}
.more .atag_item{position: absolute;z-index: 10;}
.more b {width: 120px;font-weight: 600;font-size: 13px;color: var(--complement);letter-spacing: 2px;line-height: 1.5;text-transform: uppercase;display: flex;align-items: center;text-transform: uppercase;font-family: "Cinzel", serif;}
.more .arrowWrap {width: 95px;height: 90px;position: relative;padding-right: 20px;}
.more .arrowWrap:before,.more .arrowWrap:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:30px;height:30px;border:1px solid #bcbcbc;box-sizing:border-box;border-radius:50%}
.more .arrowWrap:before{animation:ripple 3s linear 0.6s infinite}
.more .arrowWrap:after{animation:ripple 3s linear 1.4s infinite}
@keyframes ripple{0%{border:3px solid #bcbcbc;width:30px;height:30px;opacity:0}5%{opacity:0.1}10%{opacity:0.2}15%{opacity:0.3}20%{border:1px solid rgb(29 29 29 / 70%);opacity:0.4}25%{opacity:0.5}30%{opacity:0.6}35%{opacity:0.7}40%{opacity:0.9}45%,100%{border:1px solid rgba(255,255,255,0.3);opacity:0;width:60px;height:60px}}
@keyframes moreArrow {0% {transform: translateX(0px);}30% {transform: translateX(5px);}100% {transform: translateX(0px);}}
.more .arrowWrap .arrow{display: block;height: 20px;background-image: url(/images/44/more_shape.png);background-repeat: no-repeat;position: absolute;top: calc(50% - 10px);left: 0px;width: 67px;animation: moreArrow 1s infinite;}

/* product_area */
#product_area .workframe{margin:0;width: 85vw;position: relative;}
#product_area .ptitbox {right: 15vw;z-index: 6;top: 22%;width: min(90%, 640px);padding-bottom: 20px;}
#product_area .ptitbox:before{content:'';width: 25px;height: 2px;position: absolute;bottom: -1px;left: 0;background: var(--complement);}
#product_area .ptitbox .title_box {padding:0}
#product_area .bg_box {width: 15vw;left: unset;right: 0;z-index: 10;}
#product_area .arrowBox {right: 5%;z-index: 10;bottom: -65px;display: flex;flex-direction: row;gap: 15px;}
#product_area .arrowBox a{border: 1px solid #d7d7d7;width: 55px;aspect-ratio: 1/1;border-radius: 50px;display: inline-flex !important;align-items: center;justify-content: center;}
#product_area .arrowBox a#product_prev img{transform:scaleX(-1);}

/* product_list */
#product_list *{transition:unset;-webkit-transition:unset;}
#product_list li {display:grid;grid-template-columns: 65% 35%;align-items: center;}
#product_list li .clip {aspect-ratio: 5/3;}
#product_list li .info_box {background: white;margin-left: -30%;position: relative;padding: 10vw 5vw 1vw;display: flex;flex-direction: column;gap: 10px;z-index: 20;}
#product_list li .info_box .h3 {height: auto;font-size: 24px;letter-spacing: 3px;}
#product_list li .info_box article {height: auto;letter-spacing: 1px;-webkit-line-clamp: 2;margin-bottom: 30px;font-size: 20px;}
#product_list li .info_box .spec *{font-size:14px;letter-spacing: 1px;line-height: 2;color: #555;}

/* about_area */
#about_area {background-image: url(/images/44/Bg.jpg);background-size: cover;background-repeat: no-repeat;background-position: 50% 50%;position: relative;}
#about_area:before{content:'';position: absolute;top: 20%;left: 0;width: 60%;height: 1px;background: var(--black);opacity: .15;}
#about_area:after {content:'';position: absolute;z-index: 1;width: 9vw;right: 0;top: 0;height: 100%;background: var(--primary);}
#about_area .decoText{width: min(100%, 600px);position:absolute;top: 100px;right: 15%;display: flex;flex-direction: column;align-items: flex-end;gap: 5px;}
#about_area .decoText p font{
    text-align: end;
    font-size: 15px;
    font-family: "Cormorant", serif;
    font-style: italic;
    letter-spacing: 1px;
}
#about_area .decoText h1{font-size: 18px;font-weight: 600;letter-spacing: 3px;text-align: end;word-break: keep-all;}
#about_area .title_box {padding-bottom: 1vw;}
#about_area .workframe {display: grid;grid-template-columns: 22% 70%;width: min(80%, 1600px);margin-right: 0;z-index: 6;position: relative;margin-top: 10%;justify-content: space-between;}
#about_area article p {margin-bottom: 30px;line-height: 210%;letter-spacing: 2px;font-weight: 400;font-size: 18px;}
#about_area .clip img{aspect-ratio: 228 / 91;}
#about_area .about_sub_1 {width: 350px;top: 5vw;left: -6vw;z-index: 6;animation: aboutImgAnimation 10s ease-in-out infinite;}
@keyframes aboutImgAnimation{0%{-webkit-transform:translateY(0);transform:translateY(0);}50%{-webkit-transform:translateY(10px);transform:translateY(10px);}100%{-webkit-transform:translateY(0);transform:translateY(0);}}
#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{ right: -110px; }

/* custom_area */
#custom_area {padding: 0;z-index: 10;}
#custom_area .arrowBox {top: 50%;z-index: 20;left: 5%;width: 90%;display: flex;justify-content: space-between;}
#custom_area .arrowBox a{border: 1px solid #d7d7d7;width: 55px;aspect-ratio: 1/1;border-radius: 50px;display: inline-flex !important;align-items: center;justify-content: center;background: rgb(255 255 255 / 15%);}
#custom_area .arrowBox a#custom_prev img{transform:scaleX(-1);}
#custom_area .arrowBox a img, #custom_area ul li a img{-webkit-filter: contrast(0) brightness(150%);filter: contrast(0) brightness(200%);}
#custom_area ul *{transition:unset;-webkit-transition:unset;}
#custom_area ul li >div {display: flex;align-items: center;justify-content: center;}
#custom_area ul li .clip {width:100%;position: relative;}
#custom_area ul li .clip:before{content:'';position: absolute;width: 100%;height: 100%;top: 0;background: rgba(0, 0, 0, 0.55);z-index: 1;}
#custom_area ul li .clip img{aspect-ratio: 4/1.5;width: 100%;}
#custom_area ul li .info{z-index: 2;width: 60%;display: flex;flex-direction: column;align-items: flex-start;gap: 20px;}
#custom_area ul li .h3 {font-size: 24px;height: auto;width: 45%;font-weight: 600;}
#custom_area ul li article {font-weight: 300;font-size: 20px;overflow: hidden;margin: 10px 0 60px;height: auto;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;width: 55%;line-height: 2.2;}
#custom_area ul li a{display: flex;align-items: center;padding: 12px 20px;gap: 30px;font-weight: 500;font-size: 14px;letter-spacing: .08em;text-align: center;font-family: "Cinzel", serif;text-transform: uppercase;border: 1px solid #ffffff69;color: white;}
#custom_area ul li a:hover{background: var(--secondary);border-color: var(--secondary);}
#custom_area .slick-current .h3{animation:slideDownCAnimation .8s .8s ease-in-out forwards}
#custom_area .slick-current article{animation:slideUpAnimation .8s .8s ease-in-out forwards}
#custom_area .slick-current a{animation:slideUpAnimation .8s .8s ease-in-out forwards}
@-webkit-keyframes slideUpCAnimation{0%{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}
100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
}
@-webkit-keyframes slideDownCAnimation{0%{opacity:0;-webkit-transform:translateY(-10px);transform:translateY(-10px)}
100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
}
/* news_area */
#news_area {z-index:10}
#news_area .bg_box {z-index: -1;}
#news_area .titboxx{display:flex;flex-direction: column;justify-content: center;position: relative;padding: 0 25px;}
#news_area .titboxx .more_btn {right:0;position: absolute;}
#news_area li{margin:0 25px}
#news_area li .info_box {margin: 15px 0 0;display: grid;grid-template-columns: 50px 1fr;gap: 30px;}
#news_area li .date{display:flex;flex-direction: column;font-family: "Cinzel", serif;align-items: center;font-size: 24px;}
#news_area li .date .news_date{font-family: "Cinzel", serif;}
#news_area li .time { width: 65px; font-weight: 400; font-size: 13px; }
#news_area li .infobox >a {font-weight: 100;font-size: 15px;z-index: 6;}
#news_area li .h3 {margin-top: 10px;height: 54px;line-height: 150%;font-size: 20px;-webkit-line-clamp: 2;font-weight: 600;}
#news_area li article {margin-top: 15px;height: auto;line-height: 1.8;font-size: 19px;-webkit-line-clamp: 2;color: #585858;}

/* facility_area */
#facility_area{position:relative;padding-top: 0;}
#facility_area .about_sub {z-index:10;bottom: 2%;animation: aboutImgAnimation 10s ease-in-out infinite;}
#facility_area .workframe { margin-right: 0; width: min(90%,1700px); }
#facility_area .facility-header-grid { margin: 0 auto; display: grid; grid-template-columns: 40% 60%; align-items: center; position: relative; }
#facility_area .facility-left { padding-right: 50px; z-index: 5; }
#facility_area .facility-logo-area { margin-bottom: 40px; }
#facility_area .facility-brand { font-family: var(--font-en); font-size: 2rem; color: #ccc; letter-spacing: 0.2em; margin-bottom: 10px; }
#facility_area .facility-deco-title { font-family: var(--font-en); font-size: 1.1rem; color: var(--primary); letter-spacing: 0.1em; margin-bottom: 5px; }
#facility_area h2 { font-family: var(--font-zh); font-size: 2.2rem; font-weight: 700; color: var(--dark); letter-spacing: 0.2em; }
#facility_area .facility-controls { display: flex; align-items: center; margin-top: 50px; gap: 20px; }
#facility_area .control-line { width: 60px; height: 1px; background: #ddd; }
#facility_area .btn-nav {font-size: 0.8rem;letter-spacing: 0.2em;color: #999;cursor: pointer;transition: color 0.3s;user-select: none;font-family: "Cinzel", serif;}
#facility_area .btn-nav:hover { color: var(--primary); }
#facility_area .facility-right { position: relative; padding-left: 20px; }
#facility_area .facility-main-figure {margin: 0;width: 100%;}
#facility_area .facility-main-figure img {width: 100%;object-fit: cover;transition: opacity 0.5s ease-in-out;aspect-ratio: 2 / 1;box-shadow: -200px -95px rgb(235 229 219);}
#facility_area .facility-list {margin: 80px 0 0 15%;display: grid;grid-template-columns: repeat(3,1fr);gap: 100px;counter-reset: facility-no;width: 71%;}
#facility_area .facility-item { cursor: pointer; transition: all 0.4s ease; opacity: 0.6; }
#facility_area .facility-item.active { opacity: 1; }
#facility_area .facility-item-header {display: flex;align-items: center;gap: 15px;margin-bottom: 20px;border-bottom: 1px solid #ddd;padding-bottom: 10px;position: relative;}
#facility_area .facility-item-header:before{content:'';position: absolute;width: 0;height: 2px;left: 0;bottom: -1px;background: var(--primary);}
#facility_area .active .facility-item-header:before{width: 50px;}
#facility_area .facility-number {display: inline-block;min-width: 2.5em;letter-spacing: .08em;}
#facility_area .facility-number::before {counter-increment: facility-no;content: "00" counter(facility-no);font-size: .9rem;color: var(--primary);font-family: "Cinzel", serif;}
#facility_area .facility-item-subtitle {font-size: 0.95rem;color: var(--primary);font-weight: 200;font-family: "Cinzel", serif;text-transform: uppercase;line-height: 1;}
#facility_area .facility-item-title {font-size: 1.29rem;font-weight: 600;color: var(--info);margin-bottom: 15px;letter-spacing: 2px;}
#facility_area .facility-text {font-size: 1.125rem;color: #888;line-height: 1.8;}

/* 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: 1680px) {
	#product_area .ptitbox{width: min(90%, 556px);top: 17%;}
}
@media screen and (max-width: 1440px) {
    #facility_area .about_sub{left: -80px;}
    #product_area .arrowBox{bottom: -50px;}
	#product_area .ptitbox{width: min(90%, 475px);top: 13%;}
    #about_area .about_sub_1{left: -12vw;}
    #about_area .decoText{top: 70px;}
}
@media screen and (max-width: 1024px) {
    #custom_area ul li .clip img{aspect-ratio: 4 / 2.5;}
    #facility_area .facility-list{margin: 80px 0 0 0;width: 90%;}
    #facility_area .facility-left{margin-top: 70px;}
    section{padding:8vw 0}
    #product_list li .clip{aspect-ratio:4/3}
    #product_area .ptitbox{position:relative;top: unset;right: unset;margin: -10px 0 90px auto;width: min(90%, 815px);}
    #product_area .workframe{width:100%}
    #about_area .workframe{width:90%;grid-template-columns: 1fr;margin-top: 23%;gap: 50px;}
    #about_info{width:80%}
    #about_area #about_img{order:-1}
    #facility_area .about_sub, #product_area .bg_box, #wrap:after, #about_area .about_sub_1, #wrap:before{display:none;}
	#product_list { margin: auto; }
	#news_area li .h3 { height: 30px; -webkit-line-clamp: 1; }
    #product_list li .info_box{margin-left: 0;padding: 10vw 8vw 1vw;}
}
@media screen and (max-width: 980px) {
    #custom_area ul li .h3, #custom_area ul li article{width:80%}
    #facility_area .facility-main-figure img{box-shadow:none}
    #facility_area .facility-right{padding:0}
    #facility_area .facility-left{margin-bottom: 70px;}
    #facility_area .title_box {padding-bottom: 0px;}
    section .title_box{padding-bottom: 8vw;}
	section {padding: 12vw 0;}
    #product_list li, #facility_area .facility-header-grid{grid-template-columns:1fr}
}
@media screen and (max-width: 550px) {
	section .clip img{height: auto;}
    #custom_area ul li .h3, #custom_area ul li article{width:100%}
    #custom_area ul li .info{width: 80%;top: 10%;}
    #custom_area .arrowBox{display:flex;justify-content: center;gap: 30px;top: unset;bottom: 30px;}
    #custom_area ul li .clip img{aspect-ratio: 4 / 6;}
    #facility_area .facility-item-header{padding-bottom: 20px;}
    #facility_area .facility-list{grid-template-columns:1fr;margin: 40px 0 0 0;}
    #facility_area .facility-list .reveal:not(.active), #facility_area .facility-number{display:none;}
    #product_area .arrowBox{position:relative;display: flex;bottom: 0;margin-top: 30px;right: 0;justify-content: flex-end;width: 85%;}
    #about_area .clip img{aspect-ratio: 38 / 23;}
    #about_area:before{top: 22%;}
    #about_area .workframe{margin-top: 50px;}
    #about_area:after, #news_area .titboxx .more_btn{display:none;}
    #about_area .decoText{width: 95%;left: 0;right: unset;position: relative;top: unset;}
	#about_area .decoText h1{font-size: 14px;}
}