.wrap{position:relative;padding-top:5vh;z-index:998}
.wrap #wrapBox>div{position:relative}
.wrap #wrapBox .bg{position:relative;width:100%;height:100%;top:0;left:0;opacity:1}
.about-block{background-repeat:no-repeat;background-size:contain;background-attachment:fixed;background-position-y:bottom}
.about-block .editor{display:flex;flex-direction:row;align-items:flex-start;justify-content:center;gap:10rem;padding:4rem 0}
.about-block .editor::before,.about-block .editor::after{display:none}
.about-block .editor .part-01,.about-block .editor .part-02{width:600px}
.about-block .slogan-01{font-size:26px;color:#ee3111;font-weight:400;letter-spacing:2px;padding:0 0 20px;margin:0}
.about-block .slogan-02{color:#514f4a;font-size: 20px;font-weight:500;letter-spacing:5px;padding:0;margin:0}
.about-block .description{color:#8a877f;font-size:17px;font-weight:300;letter-spacing:4px;line-height:2}
.about-block .description p{font-family:'Noto Serif TC',serif}
.about-block .description span{font-size:30px;letter-spacing:15px;font-weight:400;color:#ee3111}
.about-block .vertical-line{content:'';height:100px;width:1px;background:#dcdcdc}
#aboutBox{overflow:hidden;padding-top:3vh}
#aboutBox .deck01{top:-10px;left:30%;transform:translateX(-50%);position:absolute;width:1250px}
#aboutBox .deck01 .serviceTitle,#bookBox .deck01 .bookTitle{font-size:240px;line-height:90%;color:#f7f7f7;letter-spacing:60.5px;text-align:center;text-transform:uppercase;font-family:'Hedvig Letters Sans',sans-serif;font-weight:bold}
#productBox{padding-top:40px}
#productBox .workframe{position:relative;width:1500px}
#productBox .proList{padding:0 0 1vw;display:flex;flex-wrap:wrap}
#productBox .proList li{position:relative;padding:0;-webkit-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease;width:calc(100%/3)}
#productBox .proList li.slick-slide{-moz-transform:scale(0.8);-webkit-transform:scale(0.8);-o-transform:scale(0.8);-ms-transform:scale(0.8);transform:scale(0.8);z-index:-1;margin:0 -30px;opacity:0.4}
#productBox .proList li.slick-center{z-index:1;-webkit-transform:scaleY(0.9);-ms-transform:scaleY(0.9);transform:scaleY(0.9);opacity:1}
#productBox .proList .item{padding:25px;position:relative}
#productBox .proList .item a{position:absolute;width:100%;height: 100%;z-index: 2;top: 0;}
#productBox .proList .item .Img{position:relative}
#productBox .proList .item .Img .photo{background-size:cover;background-position:50% 50%}
#productBox .proList .item .info{text-align:center;margin-top:20px}
#productBox .proList .item .info h3{text-align:center;-webkit-line-clamp:1;padding-bottom:10px;display:inline-block;font-size:20px;line-height:180%;font-weight:500;color:#575550}
#productBox .proList .item .info article p{text-align:center;color:#534f4f;font-weight:300;-webkit-line-clamp:2;font-size: 15px;}
#NewsBox{padding:90px 0px 60px 0px}
#NewsBox .workframe .row{margin-top:50px}
#NewsBox .NewsTxt h3{display:block;color:#514f4a;font-size:20px;font-weight:500;letter-spacing:5px}
#NewsBox .bgTxt.title{display:flex;background:url(/images/46/img_n_t_bg.png) repeat top/contain;align-items:flex-start;padding:50px 20px 40px 30px;justify-content:center;width:auto}
#NewsBox .bgTxt.title::before{content:"";position:absolute;left:calc(50% - 6.5px);top:-40px;width:1px;height:70px;background-color:#9c9276}
#NewsBox .bgTxt.title .titleEn{border-bottom:0px solid #bdad84}
#NewsBox .bgTxt.title h3,#NewsBox .titleEn{color:#fff}
#NewsBox .bgTxt.title h3{font-size:28px}
#NewsBox ul.newsList li{position:relative;font-size:0;margin:0px 2px 10px;border-bottom:1px solid rgb(47 47 47 / 20%);background:#f7f7f7}
#NewsBox ul.newsList li:hover .info_box .Nmore{right:15px;-webkit-animation:ani-arrow-x 1.2s infinite;animation:ani-arrow-x 1.2s infinite}
#NewsBox ul.newsList li .info_box{padding:30px 35px}
#NewsBox ul.newsList li .info_box h5{height:92px;-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:18px;font-weight:400;text-align:justify}
#NewsBox ul.newsList li .info_box .Nmore{position:absolute;right:20px;top:22%;-webkit-transition:0.5s;transition:0.5s}
#NewsBox ul.newsList li a{position:absolute;width:calc(100% - 0px);height:100%;top:0;left:0}
#NewsBox ul.newsList li p.time{line-height:27px;color:#ee3111;font-weight:300;letter-spacing:1.5px;font-size:15px;display:flex;justify-content:space-between;align-items:center;margin-top:15px}
#NewsBox ul.newsList li p.time b{font-weight:500;color:#a39d9d}
#NewsBox ul.newsList li p.txt{width:calc(100% - 155px);display:-webkit-inline-box;overflow:hidden;font-weight:400;line-height:160%;max-height:initial;text-overflow:ellipsis;-webkit-line-clamp:1;-webkit-box-orient:vertical;font-size:15px;letter-spacing:1px;color:#807c71}
#NewsBox ul.newsList li .noBox{position:absolute;font-weight:400;font-size:13px;top:calc(100% - 22px);right:67px}
@-webkit-keyframes ani-arrow-x{0%,100%{-webkit-transform:translateX(0)}
50%{-webkit-transform:translateX(5px)}
}@keyframes ani-arrow-x{0%,100%{transform:translateX(0)}
50%{transform:translateX(5px)}
}#bookBox{font-size:0;padding-top:60px}
#bookBox .deck01{top:30px;left:50%;transform:translateX(-50%);position:absolute}
#bookBox .row{position:relative;width:100%}
#bookBox #BookList{padding-bottom:2vh}
#bookBox #BookList ul{padding-bottom:6vh}
#bookBox #BookList ul li{position:relative;width:100%;max-width:1180px;margin:20px}
#bookBox #BookList ul li.slick-slide{position:relative;-moz-transform:scale(0.9);-webkit-transform:scale(0.9);-o-transform:scale(0.8);-ms-transform:scale(0.9);transform:scale(0.9);z-index:-1;margin:0 0px;filter:blur(3px)}
#bookBox #BookList ul li.slick-slide:after{position:absolute;width:100%;height:100%;top:0;left:0;background:rgb(255 255 255 / 78%);content:""}
#bookBox #BookList ul li.slick-center{z-index:1;-webkit-transform:scaleY(1);-ms-transform:scaleY(1);transform:scaleY(1);filter:none}
#bookBox #BookList ul li.slick-center:after{display:none}
#bookBox #BookList ul li h3{position:absolute;width:100%;left:0;bottom:35px}
#bookBox #BookList ul li h3 a{height:70px;color:#fff;font-size:3rem;font-weight:400;font-family:'Noto Serif TC',serif;text-align:center;-webkit-line-clamp:1;opacity:0}
#bookBox #customBox{background:url(/images/46/flower-bg.jpg) no-repeat 50% / cover}
#bookBox #customBox ul{margin-bottom:0}
#bookBox #customBox .custom{position:relative;height:80vh;font-size:0}
#bookBox #customBox .imgs{position:absolute;top:0;right:0;display:inline-block;width:48vw;z-index:1}
#bookBox #customBox .imgs .list{height:100vh;background:no-repeat 50% / cover}
#bookBox #customBox .info{display:inline-block;width:25vw;vertical-align:top;padding:5vw 13vw 0;float:left;z-index:3}
#bookBox #customBox .info h3{position:relative;font-size:40px;color:#D7A297;text-align:center}
#bookBox #customBox .info h3:after{position:absolute;bottom:-11px;left:calc((100% - 80px) / 2);width:80px;height:1px;background:#D7A297;content:""}
#bookBox #customBox .info article{color:#6D6D6D;margin:55px 0}
#bookBox #customBox .slick-dots{position:absolute;bottom:4vh;left:-25%}
#bookBox #customBox .slick-dots li button:before{color:#d49e93;font-size:10px;opacity:.25}
#bookBox #customBox .slick-dots li.slick-active button:before{color:#d7a297;opacity:.75}
#bookBox .nowrap_box.arrow_box{width:110%;display:flex;flex-direction:row;justify-content:space-around;position:absolute;z-index:20;left:50%;top:40%;transform:translate(-50%,-70%)}
#bookBox .arrow_box a{position:relative;background-color:#ffffff;-webkit-box-shadow:0 8px 30px rgb(0 0 0 / 16%);box-shadow:0 8px 30px rgb(0 0 0 / 16%);box-sizing:border-box;width:90px;height:60px;display:flex}
#bookBox .arrow_box a.next{-webkit-transform:scaleX(-1);transform:scaleX(-1);margin-left:20px}
#bookBox .arrow_box a:before,#bookBox .arrow_box a:after{position:absolute;width:15px;height:1px;background:#808080;display:block;top:50%;left:calc((100% - 13px) / 2);-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transform-origin:left;transform-origin:left;content:""}
#bookBox .arrow_box a:after{content:"" -webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
#advertiseBox .workframe{padding:60px 0;width:85%}
#advertiseBox .wall li{position:relative;margin:10px}
#advertiseBox .wall li a{position:absolute;z-index:30}
#advertiseBox .wall li .img_cover{height:270px;width:100%;object-fit:cover;object-position:50% 100%}
#advertiseBox .wall li .info{position:absolute;bottom:40%;left:70px}
#advertiseBox .wall li:nth-child(2n) .info{right:70px;left:auto}
#advertiseBox .wall li .info h3{color:#4a4a4a;text-transform:uppercase;font-weight:400;font-size:23px;line-height:150%;letter-spacing:3.5px;font-family:'Noto Serif TC',serif;border-bottom:1px solid}
#advertiseBox .wall li .info p{color:#fff;font-size:18px;letter-spacing:1.5px;font-weight:600}
.serviceArea{padding:40px 0 110px}
.serviceArea .titleBox{display:flex;flex-direction:column;align-items:center;padding:2vw 0 5vw}
.serviceArea .titleBox .titleTw{font-size:36px;letter-spacing:9.5px;font-family:'Noto Serif TC',serif;color:#bdad84;text-align:center}
.serviceArea .titleBox .exp{padding-top:20px;padding-bottom:40px;display:inline-block;font-size:17px;line-height:180%;font-weight:400;color:#474747;font-family:'Noto Serif TC',serif;text-align:center;width:100%}
.serviceList{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;width:-webkit-calc(100% + 138px);width:-moz-calc(100% + 138px);width:calc(100% + 138px);position:relative;left:-68px}
.serviceList .serviceItem{width:20%;position:relative}
.serviceList .serviceItem:before{content:"";display:block;width:1px;height:100%;background-color:rgb(0 0 0 / 7%);position:absolute;top:0;left:0;bottom:auto;right:auto}
.serviceList .item{display:flex;-webkit-box-align:center;align-items:center;flex-wrap:wrap;padding:0 48px}
.serviceList .Img{width:50px}
.serviceList .Img img{display:block;width:100%}
.serviceList .title{color:#bdad84;font-size:27px;font-weight:500;letter-spacing:3.5px;line-height:2.25;width:calc(100% - 90px);padding-left:20px;display:flex;align-items:baseline}
.serviceList .title span{font-family:'Cormorant',serif}
.serviceList .exp{color:#8a877f;font-weight:400;padding-top:10px;width:100%}
#page-form{position:relative;background:#f5f5f5;padding:60px 0;box-sizing:border-box}
#page-form form,#page-form fieldset{margin:0;padding:0;border:0}
#page-form fieldset:first-child{display:flex;flex-wrap:wrap;justify-content:space-between}
#page-form p{overflow:hidden;color:#000;font-size:16px;margin:10px 0;width:calc(50% - 10px)}
#page-form .btn{display:flex;justify-content:center;flex-wrap:wrap}
#page-form .btn p{width:auto;margin:30px 10px 0}
#page-form label{float:left;width:100px;text-align:right;padding:5px 0}
#page-form .ra span{width:auto;float:left;margin-left:10px;padding:5px 0}
#page-form input[type="text"],#page-form select{width: calc(100% - 30px);padding: 15px;border:0;color:#000;background:none;font-size:15px;border-bottom: 1px solid #8f8a8a;border-radius: 0;}
#page-form input#Checknum{margin:0 10px 0 0;width:calc(100% - 100px)}
#page-form select{width:calc(100% - 1px);-webkit-appearance:none;background:url(/images/46/arrow.png) no-repeat scroll 99% center transparent;background-repeat:no-repeat;background-position:97% 50%;padding: 18px 10px;}
#page-form .btn p.send{position:relative;overflow:unset}
#page-form .btn p.send input{background:#ee3111;color:#fff;text-align:center;width:auto;padding:15px 80px 15px 40px;font-size:15px;outline:none;cursor:pointer;letter-spacing:1px}
#page-form .btn p span{position:absolute;width:80px;height:1px;background:#000;display:block;right:-40px;top:calc((100% - 1px) / 2);z-index:3;-webkit-transition-duration:.2s;transition-duration:.2s}
#page-form .btn p.send:hover span{right:-50px}
#page-form .btn p span:before{position:absolute;width:0;height:0;border-style:solid;border-width:0 16px 7px 0;border-color:transparent transparent #0c0b19 transparent;right:-1px;bottom:50%;content:""}
#pandr-title{padding:0 0 40px}
#pandr-title:before{content:'';width:206px;height:100%;position:absolute;top:-52px;left:0;background:#f5f5f5}
#pandr-title .workframe{width:1500px;margin-right:5%}
#pandr-title h2.Ptitle{font-size:26px;color:#ee3111;font-weight:400;letter-spacing:2px;padding:0 0 20px}
#pandr-title p{margin-bottom:30px;color:#514f4a;font-size:20px;font-weight:500;letter-spacing:5px}
#pandr-title .webframe,#sixBox .webframe{overflow:hidden;width:1530px;margin:0 auto}
#pandr-title .title-set{display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;-ms-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;padding:0;list-style:none}
#pandr-title .title-set >div{width:calc((100%/4) - 40px);position:relative;padding:30px 20px 90px}
#pandr-title .title-set >div:before{content:'';width:100%;height:1px;background:#e0e0e0;position:absolute;bottom:26px;left:0;transition:all 0.4s ease}
#pandr-title .title-set >div:nth-of-type(4n+1):before{width:calc(100% - 30px);left:30px}
#pandr-title .title-set >div:nth-of-type(4n):before{width:calc(100% - 30px);left:0}
#pandr-title .title-set >div:hover:before{background:#ee3111}
#pandr-title .title-set >div .free{}
#pandr-title .title-set >div .free .num{width:32px;height:32px;background:#f5f7fa;border:1px solid #dedede;border-radius:50%;text-align:center;color:#454545;font-size:13px;line-height:30px;letter-spacing:0;position:absolute;bottom:10px;left:90px;-webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-o-transition:all 0.2s ease;transition:all 0.2s ease}
#pandr-title .title-set >div:hover .free .num{background:#ee3111;color:#fff;border:1px solid #f5f7fa}
#pandr-title .title-set >div .free .icon{width:40px;height:55px;float:left;margin-right:15px;position:relative;overflow:hidden}
#pandr-title .title-set >div .free .icon svg{width:100%;position:absolute;top:0;left:0;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease;display:inline-block}
#pandr-title .title-set h2{font-weight:400;font-size:24px;color:#111;font-size:20px;line-height:120%;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease;height:48px}
#pandr-title .title-set .free:hover h2{color:#ee3111}
#pandr-title .title-set h3{color:#595454;font-size:14px;overflow:hidden;margin-top:5px;letter-spacing:0;font-weight:300;line-height:180%;text-align:justify}
#pandr-title .small-talk{float:right}
#pandr-title .small-talk p{text-align:right;font-size:16px;color:#e19dc5;line-height:180%;width:280px}

@media (max-width:1680px){
	#pandr-title:before{display:none}
}
@media (max-width:1440px){
	#pandr-title .workframe,#productBox .workframe{width:90%}
	.serviceList{width:100%;left:0}
	.serviceList .item{padding:0 20px}
	.serviceList .title{font-size:30px}
}
@media screen and (min-width:1281px){
	#advertiseBox .wall li .ImgBorder{position:absolute;top:0;left:0;width:calc(100% - 20px);height:calc(100% - 20px);padding:10px;z-index:10}
	#advertiseBox .wall li .ImgBorder .dashed{position:relative;width:100%;height:100%}
	#advertiseBox .wall li .ImgBorder .dashed::before,#advertiseBox .wall li .ImgBorder .dashed::after{content:"";position:absolute;height:100%;width:100%;-webkit-transform-origin:center;transform-origin:center;opacity:1;-webkit-transition:all 0.7s ease-in-out;transition:all 0.7s ease-in-out}
	#advertiseBox .wall li .ImgBorder .dashed::before{border-top:1px solid #ffffff4d;border-bottom:1px solid #ffffff4d;-webkit-transform:scale3d(1,0,1);transform:scale3d(1,0,1)}
	#advertiseBox .wall li .ImgBorder .dashed::after{border-left:1px solid #ffffff4d;border-right:1px solid #ffffff4d;-webkit-transform:scale3d(0,1,1);transform:scale3d(0,1,1)}
	#advertiseBox .wall li:hover .ImgBorder .dashed::before,#advertiseBox .wall li:hover .ImgBorder .dashed::after{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1);opacity:0.7}
	#advertiseBox .wall li:hover .img_cover{opacity:0.5}
	#advertiseBox .wall li{background-color:#b7ab8e}
}
@media screen and (max-width:1280px){
	#aboutBox .deck01,#bookBox .deck01{display:none}
	#advertiseBox .workframe{padding:40px 0}
	.about-block .editor .part-01,.about-block .editor .part-02{width:390px}
	.about-block .editor{gap:3rem}
}
@media (min-width:1181px){
	.serviceList .serviceItem:nth-child(5n+1):before{opacity:0}
}
@media screen and (max-width:1180px){
	.serviceArea .titleBox .exp{padding-top:12px}
	.serviceList .serviceItem{width:50%;margin:20px 0}
	.serviceList .title{font-size:26px;font-weight:500;letter-spacing:2px}
	#advertiseBox .wall li .img_cover{height:190px}
	#bookBox .arrow_box a{width:80px;height:45px}
	.serviceArea .titleBox{display:flex;flex-direction:column;align-items:center}
	.serviceArea .titleBox .titleTw{margin-top:0px;font-size:27px;letter-spacing:5.5px}
}
@media (max-width:1180px) and (min-width:769px){
	.serviceList .serviceItem:nth-child(odd):before{opacity:0}
}
@media screen and (max-width:980px){
	#productBox .proList li{width:50%;}
	#pandr-title .title-set >div{width: calc((100%/2) - 40px);}
	#aboutBox .info .title{margin-bottom:32px}
	#bookBox #BookList ul li.slick-slide{margin:0}
	#bookBox #customBox .custom{height:auto}
	#bookBox #customBox .info{width:100%;height:48vh;display:block;float:none;padding:10vh 0}
	#bookBox #customBox .info article{width:60%;margin:0 auto;padding:5vh 0}
	#bookBox #customBox .imgs{position:relative;width:100%}
	#bookBox #customBox .imgs .list{height:35vh}
	#bookBox #customBox .slick-dots{bottom:40vh;left:calc(0% / 2)}
	#bookBox .nowrap_box.arrow_box{transform:translate(-50%,-120%);width:160%}
	#bookBox .arrow_box a{width:45px}
	#bookBox #BookList ul{padding-bottom:0vh}
	#NewsBox{padding: 50px 0px 30px 0px;}
	#bookBox{padding-top:20px}
	.about-block .editor{gap:1rem;display:flex;flex-direction:column;align-items:flex-start;padding:3rem 0}
	.about-block .slogan-01{padding:0 0 8px}
	.about-block .slogan-01, .about-block .description span, #pandr-title h2.Ptitle, .bgTxt.title{font-size:24px}
	.about-block .slogan-02, #pandr-title p, .bgTxt.title h3{font-size: 18px;letter-spacing: 1px;}
	.about-block .description span{letter-spacing:10px}
	.about-block .description{font-size:16px}
	.about-block .vertical-line{height:40px}
	.about-block .editor .part-01,.about-block .editor .part-02{width:auto}
}
@media (max-width:768px){
	.serviceArea .titleBox{padding-bottom:0}
.serviceList .serviceItem{width:100%;margin:0;padding:25px 0}
.serviceList .serviceItem:before{width:100%;height:1px}
.serviceList .serviceItem:first-child:before{opacity:0}
.serviceList .item{padding:0}
}
@media screen and (max-width:680px){
	#page-form fieldset:first-child{display:block;}
	#page-form p{width:100%;margin: 20px 0;}
	#productBox .proList li{width:100%;}
	#pandr-title .title-set h2{height:auto;}
	#pandr-title .title-set >div:nth-of-type(4n+1):before{left:0;width: 100%;}
	#pandr-title .title-set >div{width: calc((100%/1) - 20px);padding: 20px 10px 60px;}
	#productBox .proList{padding:5vh 0 1vh}
	#productBox .proList li.slick-center{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}
	#bookBox #customBox .info article{width:90%;padding:8vw 0 0}
	#advertiseBox .wall li .info{right:auto;left:30px}
	#advertiseBox .wall li:nth-child(2) .info{left:30px;right:auto}
	#advertiseBox .wall li .info h3{font-size:20px}
	#advertiseBox .wall li .info p{font-size:17px}
	#advertiseBox .workframe{padding:30px 0}
	#advertiseBox .wall li .img_cover{height:160px}
	#NewsBox:before,#NewsBox:after,#NewsBox .bgTxt.title::before{display:none}
	#NewsBox .workframe .row{width:calc(100% - 0px);margin-left:0;margin-top:30px}
	#NewsBox .NewsTxt{writing-mode:inherit}
	#NewsBox .bgTxt.title{padding:20px 40px}
	#aboutBox{padding-top:0vh}
	.wrap{padding-top:1vh}
	.serviceArea{padding:40px 0 60px}
	.serviceList .title{font-size:20px;font-weight:400;letter-spacing:1px}
	#page-form input[type="text"], #page-form select{background:#fff;border: 0;}
}
@media screen and (max-width:400px){
	.serviceList .title{padding-left:10px}
}