#wrap {z-index: 2;}

/* section */
section {padding: 5vw 0;}
section >* { z-index: 3; }
section .title_box {padding-bottom: 3vw;font-size: 38px;font-family: 'Noto Serif TC';font-weight: 600;letter-spacing: 3px;}
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%); }

.small_more .pom_cabtn{position: relative;bottom: auto;right: auto;width: min(175px, 100%);margin-top: 60px;}
.center_more{display:flex;justify-content: center;}
.small_more .pom_cabtn .vatitle , #describe .small_more .pom_cabtn .vatitle{font-size: 15px;color: white;letter-spacing: 1px;}
.small_more .pom_cabtn a b:before{border-color: transparent #ffffff transparent;}
.pom_cabtn a{display: grid;grid-template-columns: 60% 30%;gap: 10%;background: var(--primary);border-radius: 10px;font-size: max(4 * (1vw + 1vh) / 2, 15px);align-items: center;padding: 0 0;}
.pom_cabtn a b{display:flex;width: 100%;height: 100%;aspect-ratio: 1/1;flex-direction: column;align-items: center;justify-content: center;border-left: #e8e8e8 1px solid;}
.pom_cabtn a b:before {content:"";position: absolute;width: 0;height: 0;border-style: solid;border-width: 6px 10px 6px 0;border-color: transparent #3a3a3a transparent;transform: rotate(180deg);z-index: 9;animation: rotateJa 4s linear infinite;}
.pom_cabtn .vatitle{font-size: max(1.2 * (1vw + 1vh) / 2, 16px);display: flex;width: 100%;justify-content: center;font-family: 'Noto Serif TC';}
.pom_cabtn a:hover{background: var(--complement);}
.pom_cabtn a:hover *{color:white;}
.pom_cabtn a:hover b:before{border-color: transparent #ffffff transparent;}

@keyframes rotateJa {    0% {transform: rotate(0deg);}     100% {transform: rotate(360deg);}}

/* product_area */
#product_area .title_box, #book_area .title_box {padding-bottom: 1vw;}
#product_area .pageh1 , #book_area .pageh1{margin-bottom:3vw;font-family: 'Noto Serif TC';font-weight: 500;font-size: 22px;letter-spacing: 2px;}
#product_area .arrowBox {right: -7.5%;z-index: 10;bottom: 0;display: flex;justify-content: space-between;width: 115%;}
#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;top: -200px;}
#product_area .arrowBox a#product_prev img{transform:scaleX(-1);}
#product_area .arrowBox a#product_next{right:0}
#product_area .arrowBox a:hover{background:var(--primary);border-color:var(--primary)}
#product_area .arrowBox a:hover img{-webkit-filter: contrast(0) brightness(150%);filter: contrast(0) brightness(200%);}

/* product_list */
#product_list{position:relative;}
#product_list li{padding: 0px 45px 35px;background: #ffffff;display: flex;flex-direction: column;align-items: center;margin: 0 10px;vertical-align: top;gap: 30px;border-radius: 20px;}
#product_list li .clip img{aspect-ratio:4/3}
#product_list li p{background: #f7f7f7;padding: 8px 40px 9px;font-size: 14px;border-radius: 0 0 10px 10px;font-family: "Tinos", serif;color: #888;text-transform: capitalize;}
#product_list li .h3 {height: auto;font-size: 18px;font-family: 'Noto Serif TC';letter-spacing: 1px;}
#product_list li:hover .h3{color:var(--primary)}
#product_list li:hover p{background:var(--primary);color:white}

/* about_area */
#about_area {padding-bottom: 5vw;background: linear-gradient(180deg, #f7f7f7, #e3e3e3);}
#about_area .workframe {display:grid;grid-template-columns: 40% 50%;justify-content: space-between;align-items: center;}
#about_area .entit {font-family: 'Tinos';letter-spacing: 1px;padding-left: 20px;}
#about_area .entit:before{position: absolute;content:url(/images/44/icon.svg);width: 12px;top: -25px;left: 0;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 .title_box {padding-bottom: 2vw;}
#about_area h2 { font-size: 45px; font-style: italic; }
#about_area article p {margin-bottom: 30px;line-height: 2.2;letter-spacing: 2px;font-weight: 400;text-align: justify;}
#about_area .clip {-webkit-clip-path: url(#clip_about);clip-path: url(#clip_about);}


/* custom_area */
#custom_area{padding:0;}
#custom_area >p{position:absolute;bottom: 150px;color: white;width: 100%;text-align: center;font-family: 'Tinos';letter-spacing: 5px;}
#custom_area .video-bg{height: 450px;background: var(--complement);overflow: hidden;}
#custom_area:before{content:'';width:0;height:0;border-style:solid;border-width: 0 104vw 4.6vw 0vw;border-color: transparent transparent #f7f7f7;position:absolute;bottom: 0vw;z-index: 4;left: -1vw;}
#custom_area:after{content:'';width:0;height:0;border-style:solid;border-width: 0 80vw 4.6vw 100vw;border-color: transparent transparent #ffffffb5;position:absolute;bottom: 0vw;z-index: 3;left: -1vw;}
#custom_area .video-bg video{opacity:.5;filter: blur(3px);}
#custom_area .wam_img{width:100%;display: flex;flex-direction: column;align-items: center;position: absolute;bottom: -70px;z-index: 5;}

/* news_area */
#news_area li .img_box , #book_area li .img_box {border-radius: 20px;}
#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 ul{width:min(90%, 1400px);margin: 0 auto;}
#book_area li{margin:0 15px;}
#book_area li .h3 {margin-top: 25px;height: auto;font-size: 18px;padding: 0 5%;-webkit-line-clamp: 2;text-align: left;font-family: 'Noto Serif TC';font-weight: 500;letter-spacing: 1px;text-align: justify;}

/* 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 .arrowBox{right: -5%;width: 110%;}
}
@media screen and (max-width: 1280px) {
    #product_area .arrowBox{right: -2.5%;width: 105%;}
    #product_area ul{width: 90%;margin: 0 auto;}
}
@media screen and (max-width: 1024px) {
    section {padding: 10vw 0;}
    #product_area .pageh1, #book_area .pageh1{padding-bottom:5vw}
}
@media screen and (max-width: 980px) {
    #about_area{padding:10vw 0}
    #about_area .workframe{display:flex;flex-direction: column;align-items: stretch;gap: 50px;}
}
@media screen and (max-width: 550px) {
    #custom_area .video-bg{height: 350px;}
    section .clip img{height:auto;}
    #custom_area >p{letter-spacing: 3px;}
    section .title_box{font-size:30px;}
    section, #about_area {padding: 19vw 0;}
    #product_area .pageh1, #book_area .pageh1{font-size: 18px;padding: 0 30px 8vw;}
	#about_area .about_sub_2 { bottom: 60vw; }
	#news_area li .row { margin: auto; width: 280px; }
    #product_area .arrowBox{position:relative;right: 0;display: flex;justify-content: center;width: 100%;margin-top: 30px;gap: 20px;}
    #product_area .arrowBox a{top: unset;position: relative;}
}