.wrap {position: relative;z-index: 998;}
.wrap #wrapBox >div { position: relative; }
.wrap #wrapBox .bg { position: absolute; width: 100%; height: 100%; background: no-repeat 50% / cover; top: 0; left: 0; opacity: .4; }
.wrap_bg{position: absolute;z-index: 33;margin-top: -80px;}

.poJJ_title{display: flex;flex-direction: column;align-items: center;margin-bottom: 50px;width: 100%;position: relative;}
.poJJ_title.left_booxJ{display: flex;align-items: flex-start;margin-bottom: 0;}
.poJJ_title .pen{font-size: max(3.7 * (1vw + 1vh) / 2, 41px);text-transform: uppercase;line-height: 100%;letter-spacing: 0.05em;}
.poJJ_title .pch{font-size: max(2 * (1vw + 1vh) / 2, 23px);}
.poJJ_title:before{content:"";position: relative;width: 10px;aspect-ratio: 1/1;background: #3b3b3b;animation: rateJ 8s ease-in-out infinite;top: -14px;}

@keyframes rateJ{
	0%{transform:rotate(0deg);}
	50%{transform:rotate(360deg);}
	100%{transform:rotate(0deg);}}
/*leaf_box*/
.leaf_box{position: absolute;width: 100%;height: 100%;}
.leaf_box:before{content:"";position: absolute;width: 50px;aspect-ratio: 1/1;background: url(/images/42/fly-paper01.png);background-size: cover;right: 25vw;top: 5vw;}
.leaf_box .lee_a{width:30vw;left: -1vw;position: absolute;z-index: -1;transform-origin: left;animation: sway2 4s linear infinite;}
.leaf_box .lee_b{width:30vw;position: absolute;right: 0;z-index: -1;bottom: 0;transform-origin: right bottom;animation: sway2 5s linear infinite;}


/*porservice_box*/
#porservice_box{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 142px 0;
    justify-content: center;
    margin-bottom: 250px;
}
#porservice_box:before{content:"";position: absolute;width: 70vw;aspect-ratio: 1/1;background: linear-gradient(0deg, rgb(246 246 246 / 65%) 0%, rgb(255 255 255 / 77%) 100%);border-radius: 6666px;}
#porservice_box .workframe{
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    width: 90vw;
}
#porservice_box:after{content:"";position: absolute;width: 2px;height: 150px;background: #e4e4e4;display: flex;flex-direction: column;bottom: -150px;}
#porservice_box .SJJBox{}
#porservice_box .SJJBox{width:100%;}
#porservice_box .SJJitem{
    position: relative;
}
#porservice_box .SJJitem a{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 6;
}
#porservice_box .SJJitem.slicknume02 .infot , #porservice_box .SJJitem.slicknume02 a{transform: translateX(-60px);}
#porservice_box .SJJitem.slicknume04 .infot , #porservice_box .SJJitem.slicknume04 a{transform: translateX(60px);}


#porservice_box .infot:before{content:"";position: absolute;width: 70px;aspect-ratio: 1/1;background: url(/images/42/plus.png);background-size: cover;background-position: 50%;background-repeat: no-repeat;padding: 0;right: 4px;transform: translateY(93px);z-index: -1;}
#porservice_box .mootitle{font-size: max(1.4 * (1vw + 1vh) / 2, 21px);font-weight: 400;}
#porservice_box .cooinfo{
    display: flex;
    flex-direction: column;
    align-items: center;
}
#porservice_box .cootitle{font-size: max(1.9 * (1vw + 1vh) / 2, 29px);font-weight: 600;}
#porservice_box .cooicon{display:flex;gap: 7px;}
#porservice_box .cooicon a{display:flex;padding: 10px;background: #858583;border-radius: 50px;width: 60px;aspect-ratio: 1/1;flex-direction: column;align-items: center;justify-content: center;}
#porservice_box .cooicon a:hover{
    background: #527b85;
}
#porservice_box .infot .current{moz-transform:scale(1);-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}
#porservice_box .infot{display:flex;flex-direction:column;align-items:center;gap:10px;padding:50px 0}
#porservice_box .infot.current:before{transform: translateY(-20px);opacity:1}
#porservice_box .infot:before{content:"";position:absolute;width:70px;aspect-ratio:1/1;background:url(/images/42/plus.png);background-size:cover;background-position:50%;background-repeat:no-repeat;padding:0;right:24px;transform:translateY(93px);z-index:-1;opacity:0;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
#porservice_box .infot img{border-radius:555px;border:#cb9c77 solid 2px;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
#porservice_box .infot{-webkit-transform: scale(0.7);transform: scale(0.7);-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
#porservice_box .infot.current{-webkit-transform: scale(1);transform: scale(1);}
#porservice_box .cooicon a img{height: 25px;object-fit: cover;}
.counct_box{position: relative;display:flex;flex-direction: column;align-items: center;gap: 20px;margin-top: 60px;z-index: 3;}
.mooseemore{position: absolute;left: 19vw;bottom: 2vw;width: 11vw;}
.mooseemore:hover{transform: scale(0.9);}
.arrow_btns_box{cursor:pointer;position:absolute;z-index:5;width: 24.5%;margin-bottom:70px}
.arrow_btns_box .arrowBox{display:flex;justify-content:space-between}
.arrowBox .arrow{position:relative;width:30px;height:30px;cursor:pointer}
.arrowBox .arrow::before{content:"";position:absolute;top:50%;width:15px;height:15px;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
.arrowBox .arrow:hover::before{border-color:#567e88}
.arrowBox .prev::before{top:50%;left:11px;-webkit-transform-origin:left top;transform-origin:left top;border-top:3px solid #2c2c2c;border-left:3px solid #2c2c2c;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
.arrowBox .next::before{right:11px;-webkit-transform-origin:right top;transform-origin:right top;border-top:2px solid #2c2c2c;border-right:2px solid #2c2c2c;-webkit-transform:rotate(45deg);transform:rotate(45deg)}
.arrow_btns_box .slick-prev:before ,.arrow_btns_box .slick-next:before{content: "";}
.arrow_btns_box .slick-prev{
    left: 0;
    width: 55px;
    height: 55px;
}
.arrow_btns_box .slick-next{
    right: 0;
    width: 55px;
    height: 55px;
}
.arrow_btns_box .prev svg{-moz-transform:scalex(-1);-webkit-transform:scalex(-1);-o-transform:scalex(-1);-ms-transform:scalex(-1);transform:scalex(-1)}
.arrow_btns_box svg{width: 60px;aspect-ratio:1/1;background: rgb(255 255 255 / 0%);border-radius: 0;padding: 18px;fill: #3c3c3c;}
.arrow_btns_box .slick-prev svg{transform: scaleX(-1);}
.arrow_btns_box svg{width: 59px;padding: 21px;border-radius: 555px;}
.arrow_btns_box .iconCircle{position:absolute;top:0;left:0;width: 75px;height:auto;aspect-ratio:1/1;display:flex;justify-content:center}
.arrow_btns_box .iconCircle  circle{top:0;left:0}
.arrow_btns_box svg.pathJ{position:relative;z-index:1;width:100%;height:100%;border-radius:100%;stroke-dasharray:236;stroke-dashoffset:236;stroke:rgba(30,84,93,0.2);fill:none;stroke-width:3px;background:unset;stroke: #515151;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:0;padding:0;top:-9px;left:-9px;border:unset;opacity: 0;}
.arrow_btns_box .slick-arrow:hover svg.pathJ{stroke-dashoffset:0;fill:none;background:unset}
.arrow_btns_box .slick-arrow:hover svg{background: #59818b00;fill: #517a85;}

#flypaper2{height: 100%;position: relative;}
#flypaper2:before{position: absolute;content:"";background: url(/images/42/plus-w01.png);width: 3vw;aspect-ratio: 1/1;background-size: cover;right: 12vw;top: 7vw;}
#flypaper2:after{position: absolute;content:"";background: url(/images/42/plus-w01.png);width: 4vw;aspect-ratio: 1/1;background-size: cover;left: 7vw;bottom: 10vw;}

#flypaper2 .fy_item01{
    width: 100vw;
}
#flypaper2 .fy_item02{
    width: 100vw;
}
#flypaper2 .fy_item01 img{
    left: -16vw;
    display: flex;
    position: absolute;
    width: 26vw;
    animation: float2 5s ease-in-out infinite;
}
#flypaper2 .fy_item02 img{
    right: -15vw;
    display: flex;
    position: absolute;
    width: 24vw;
    top: 25vw;
    animation: float2 4s ease-in-out infinite;
}
#doJJin_box:before{content:"";position: absolute;background: url(/images/42/fly-paper02.png);width: 5vw;aspect-ratio: 1/1;background-size: cover;right: 15vw;top: -12vw;animation: float2 6s ease-in-out infinite;}

 /* 提示容器 */
    .swipe-hint {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;opacity:0;pointer-events:none;transition:opacity 0.5s;display: none;}

    .swipe-hint.show { opacity:1; }

    /* 箭頭動畫 */
    .swipe-hint .arrow {
      font-size:24px;
      animation: bounce 1s infinite alternate;
    }
    .swipe-hint .arrow.left { animation-delay: 0s; }
    .swipe-hint .arrow.right { animation-delay: 0.5s; }

    @keyframes bounce {
      from { transform:translateY(0); }
      to   { transform:translateY(-6px); }
    }


/*doctorbox*/
#doctorbox{
    display: flex;
    align-items: center;
    justify-content: center;
}
#doctorbox .arrow_btns_box{
    width: 35%;
    margin-bottom: -50px;
}
#doctorbox .arrow_btns_box svg ,#casesBox .arrow_btns_box svg{
    background: linear-gradient(0deg, #858583 0%, #c3c3bf 100%);
    fill: white;
    width: 55px;
}
.feeJ{width: 100%;display: flex;}

/* aboutBox */
#aboutBox {overflow: hidden;}
#aboutBox .slick-slider{
    margin-bottom: 0;
}
#aboutBox .imgs {position: absolute;width: 50vw;height: 100%;top: 0;left: 0;z-index: 1;}
#aboutBox .imgs .list {height: 40vw;background: no-repeat 50% / cover;}
#aboutBox .info {position: relative;z-index: 3;}
#aboutBox .info .bgTxt {text-align: left; }
#aboutBox .info .stitle {position: relative;margin-bottom: 25px;padding: 0px 0 15px;font-size: 18px;color: #6D6D6D;}
#aboutBox .info .stitle:after{position: absolute;top: 33%;width: 70px;height: 1px;display: inline-block;background: #CCC;content: "";}
#aboutBox .info article {line-height: 200%;color: #6D6D6D;}
#aboutBox #SeoStarRating { margin: 15px 0 30px; text-align: right; }
#aboutBox p.more { text-align: left; }

/* productBox */
#productBox .workframe{ position: relative; width: 100%; }
#productBox .proList{padding: 0 0 1vw;}
#productBox .proList li{ position: relative; padding: 0; -webkit-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
#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{margin: 30px auto;position: relative;width: 100%;max-width: 1180px;-webkit-box-shadow: 0px 5px 30px -5px rgba(0, 0, 0, 0.3);box-shadow: 0px 5px 30px -5px rgba(0, 0, 0, 0.3);}
#productBox .proList .item .Img{ position: relative}
#productBox .proList .item .Img a.photo:after { position: absolute; top: 0; left: 0;width: 100%; height: 100%; background-color: rgb(0 0 0 / 0.2); content: ""}
#productBox .proList .item .info {position: absolute;left: 50%;bottom: 35px;-webkit-transform: translate(-50%, 0);-ms-transform: translate(-50%, 0);transform: translate(-50%, 0);text-align: center;}
#productBox .proList .item .info h3 {text-align: center;color: #fff;font-size: 2.4rem;font-weight: bold;text-shadow: 0px 0px 10px rgb(0 0 0 / 0.5);-webkit-line-clamp: 1;}
#productBox .proList .item .info article p {text-align: center;color: #ffffff;font-weight: 500;text-shadow: 0 0 10px rgb(0 0 0 / 0.3);-webkit-line-clamp: 2;}

/* bookBox bookList*/
#bookBox {font-size: 0;}
#bookBox .row { position: relative; width: 100%; }
#bookBox #BookList {padding-bottom: 7vh;}
#bookBox #BookList ul li { position: relative; width: 100%; max-width: 1180px; -webkit-box-shadow: 0px 5px 30px -5px rgba(0, 0, 0, 0.3); box-shadow: 0px 5px 30px -5px rgba(0, 0, 0, 0.3);   }
#bookBox #BookList ul li.slick-slide {position: relative;-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 -70px;filter: blur(3px);}
#bookBox #BookList ul li.slick-slide:after {position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: rgb(215 162 151 / 78%);content: "";}
#bookBox #BookList ul li.slick-center{ z-index: 1; -webkit-transform: scaleY(0.9); -ms-transform: scaleY(0.9); transform: scaleY(0.9); 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: bold;text-shadow: 0 0 10px rgb(0 0 0 / 50%);text-align: center;-webkit-line-clamp: 1;}

/* customBox*/
#customBox {padding: 60px 0px;background-color: #FFFFFF;background-image: url(/images/42/bg-tiffany-green.jpg);background-repeat: no-repeat;background-position: calc(50vw - 2200px) 0;}
#customBox .customArea {display: flex;width: 1600px;margin: auto;flex-direction: row;}
#customBox .Info{display: flex;align-items: flex-start;flex-direction: column;justify-content: center;width: 30%;}
#customBox .Info .titleBox em{color: #727272;font-size: 14px;font-weight: 400;line-height: 1em;margin: 10px 0;display: block;font-style: normal;}
#customBox .Info .titleBox h2{color: #222222;font-size: 36px;font-weight: 400;line-height: 30px;margin: 15px 0 30px;}
#customBox .Info .Txt p{color: #222222;font-size: 19px;font-weight: 200;line-height: 30px;padding: 0px 50px 0px 0px;}
#customBox ul {margin-bottom: 0;width: 70%;}
#customBox .custom{position: relative;font-size: 0;margin: 10px;}
#customBox .custom a{position: absolute;width: 100%;height: 100%;z-index: 1;}
#customBox .imgs .list {height: 44vh;background: no-repeat 40%;background-size: contain;}
#customBox .custom .info h3 {position: relative;font-size: 18px;color: #020202;}
#customBox .info article {color: #6D6D6D;}
#customBox .slick-dots { position: absolute; bottom: 4vh; left: -25%; }
#customBox .slick-dots li button:before{ color: #d49e93; font-size: 10px; opacity: .25 }
#customBox .slick-dots li.slick-active button:before{ color: #d7a297; opacity: .75 }
#customBox .slick-prev:before,#customBox .slick-next:before{color: #404040;font-family: 'Noto Sans TC';font-size: 15px;}
#ssbanner{animation-name:fadeInUp}
#ssbanner .bxslider{display: flex;flex-direction: row;}
#ssbanner .bxslider .SSBox{position:relative;overflow:hidden;}
#ssbanner .bxslider a{height:100%;display:block;position:absolute;left:0;top:0;width:100%;z-index:2}
#ssbanner .bxslider img{width:100%}
#ssbanner .bxslider .infot h4{position:absolute;color:#fff;font-size: 1.6em;line-height:110%;bottom: 0;left: 0;width: calc(100% - 0px);z-index:5;padding: 30px 0px 30px 0px;background-color: rgba(185,169,141,0.50);text-align: center;}


/* casesBox */
#casesBox {position: relative;padding: 100px 0 0px 0;}
#casesBox .casesArea{position: relative;display: flex;flex-direction: column;align-items: center;justify-content: center;z-index: 2;}

#casesBox #casesList{width:100%;}
#casesBox  .arrow_btns_box{margin-top: 100px;width: 20%;}
#casesBox .info_item { width: 768px; margin: auto; padding-bottom: 10px; padding-top: 60px; }
#casesBox::after { content: ''; position: absolute; height: 100%; width: 100%; top: 0; right: 0; background-image: url(/images/42/img_Cases_bg.jpg); background-size: cover; background-repeat: no-repeat; z-index: -2; transform-origin: top left; transition: all 1.1s ease-in-out; -webkit-transition: all 1.1s ease-in-out; }
#casesBox:before {content: '';position: absolute;width: 120%;height: 240%;top: 60px;left: -10%;z-index: 0;border-radius: 50%;opacity: 0.3;}
.deckTop { animation-name: fadeInDown; -webkit-animation-name: fadeInDown; }
.deckTop h3 { position: relative; margin: 0 0 40px; font-size: 20px; font-weight: 600; color: #242424; letter-spacing: 1px; z-index: 1; }
#casesBox .deckTop p { margin: 0 0 0px; padding: 0 0 140px 0; text-align: center; text-transform: uppercase; font-weight: bold; letter-spacing: 1.5px; font-family: 'Noto Serif TC', serif; color: #6e3a19; font-size: 38px; }
#casesList ul { overflow: hidden; margin-bottom: 20px; animation-name: fadeInUp; -webkit-animation-name: fadeInUp; height: 650px; width: 100%; }

#casesList ul li {position: relative;padding: 20px 20px;-webkit-transition: all .9s ease;-o-transition: all .9s ease;transition: all .9s ease;-moz-transform: scale(0.9);-webkit-transform: scale(0.9);-o-transform: scale(0.9);-ms-transform: scale(0.9);transform: scale(0.9);}
#casesList ul li .casesStyle { margin: 50px auto 0; position: relative; -webkit-transition-delay: 0s; transition-delay: 0s; display: flex; flex-direction: column; justify-content: center; align-items: center; }
#casesList ul li .casesStyle a { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 10; }
#casesList ul li .info { padding-bottom: 0; -webkit-transition: opacity 0.15s, -webkit-transform 0.15s; transition: opacity 0.15s, transform 0.15s; position: relative; }
#casesList ul li .info .h3 { overflow: hidden; padding: 0; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; color: #616161; }
#casesList ul li .info .h3 {letter-spacing: 4px;text-align: inherit;font-weight: 400;font-size: 19px;color: #76707f;margin-top: 10px;}
#casesList ul li .info .h3 font { margin: 5px 0; font-weight: 500; letter-spacing: 1.5px; line-height: 160%; }
#casesList ul li .info .h3 span { margin-right: 4px; display: inline-block; }
#casesList ul li .info p { margin: 0px 0 0; display: block; text-align: center; font-family: "Roboto", Arial, Tahoma, sans-serif; letter-spacing: .8px; font-weight: 400; font-size: 15px; color: rgb(255 255 255 / 60%); opacity: 0; -webkit-transition-delay: 0s; transition-delay: 0s; }
#casesList ul li.slick-center .info p { opacity: 1; -webkit-transition-delay: .5s; transition-delay: .5s; }
#casesList ul li.slick-center .casesStyle {margin: 0;-webkit-transition-delay: .5s;transition-delay: .5s;-moz-transform: scale(1);-webkit-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
#casesList ul li .casesStyle .Photo { width: 100%; position: relative; }
#casesList ul li .casesStyle .Photo img { width: 100%; height: 400px; object-fit: cover; object-position: 50% 15%; border-radius: 120px 0 120px 0; }
#casesList ul li.slick-center .casesStyle .Photo { width: 100%; padding-bottom: 20px; }
#casesList ul li.slick-center .casesStyle .Photo img { width: 100%; height: 470px; }
#casesList ul li .casesStyle .Photo:after {content: '';position: absolute;width: 100%;height: 99%;top: 10px;left: 10px;z-index: 0;border: 1px solid #90908d;border-radius: 120px 0 120px 0;}
#casesList ul li:before { position: absolute; width: 100px; height: 130px; background-image: url(/images/42/img_Cases_02.png); background-repeat: no-repeat; background-size: cover; display: block; top: 5px; left: 5px; z-index: 0; opacity: 0; content: ""; -webkit-transition-delay: .5s; transition-delay: .5s; -webkit-transition: all .9s ease; -o-transition: all .9s ease; transition: all .9s ease; }

@keyframes sway2 {
    0% {transform:translateY(0px) rotate(2deg);}
    50% {transform: translateY(0px) rotate(-3deg);}
    100% {transform:translateY(0px) rotate(2deg);}
}
 @keyframes float2{0%{transform:translateY(0)}
50%{transform:translateY(-30px)}
100%{transform:translateY(0)}
}
.wrap #wrapBox #va_back{position: absolute;}
@media screen and (min-width: 1281px){
	#casesList ul li:after { position: absolute; width: 120px; height: 120px; background-image: url(/images/42/img_Cases_01.png); background-repeat: no-repeat; background-size: contain; display: block; top: -30px; right: -30px; z-index: 0; opacity: 0; content: ""; -webkit-transition-delay: .5s; transition-delay: .5s; -webkit-transition: all .9s ease; -o-transition: all .9s ease; transition: all .9s ease; }
	#casesList ul li.slick-center:after { opacity: 1; -webkit-transition-delay: 1s; transition-delay: 1s; -webkit-animation: apple_circle 50s linear infinite; animation: apple_circle 50s linear infinite; }
	@-webkit-keyframes apple_circle { 0%, 100% { transform: rotate(0); -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); } 50% { transform: rotate(1turn); -webkit-transform: rotate(1turn); -moz-transform: rotate(1turn); -ms-transform: rotate(1turn); -o-transform: rotate(1turn); } }
	#casesList ul li.slick-center:before { opacity: 1; -webkit-transition-delay: 1s; transition-delay: 1s; }
}
@media screen and (min-width: 1025px) {
	#prolay .pro-list .p-box:hover:after,#ssbanner .bxslider .slick-slide:hover a:after{animation-name:rush;animation-iteration-count:1;animation-delay:.2s;animation-duration:.8s;animation-timing-function:cubic-bezier(.215,.61,.355,1)}
	#prolay .pro-list .p-box:hover:before,#ssbanner .bxslider .slick-slide:hover a:before{animation-delay:0;animation-direction:normal;animation-duration:.3s;animation-fill-mode:both;animation-iteration-count:1;animation-name:rush2;animation-timing-function:cubic-bezier(.215,.61,.355,1)}
	#casesList .slick-prev { left: auto; right: 150px; top: -100px; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 70px; height: 70px; background: #3b5670; border-radius: 50px; }
	#casesList .slick-track {padding: 0;}
	#casesList .slick-prev:before { color: #ffffff; font-size: 40px; opacity: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-right: 7px; }
	
}
@media screen and (max-width: 1600px) {
	#customBox .customArea{width: 84%;}
}
@media screen and (max-width: 1470px) {
	#ssbanner .bxslider .infot h4{font-size:27px}
	#casesList ul li { padding: 20px 13px; }
	#casesList ul li .casesStyle .Photo img { height: 290px; }
	#casesList ul li.slick-center .casesStyle .Photo img { height: 370px; }
	#casesList ul li .casesStyle .Photo img, #casesList ul li.slick-center .casesStyle .Photo img, #casesList ul li .casesStyle .Photo:after { border-radius: 60px 0 50px 0; }
	#casesList ul li:before { display: none; }
	#casesList ul { height: 500px; }
	#porservice_box .slick-center .infot:before{transform: translateY(-25px);width: 60px;}
	.leaf_box:before{right: 29vw;top: 6vw;}
	#flypaper2 .fy_item01 img{width: 23vw;left: -14vw;}
	#flypaper2 .fy_item02 img{width: 21vw;right: -14vw;}
	#porservice_box .arrow_btns_box{width: 26%;}
	.counct_box{margin-top:20px;}
	.mooseemore{left: 18vw;bottom: 7vw;}
	#porservice_box:after{height: 100px;bottom: -35px;}
	#porservice_box{margin-bottom: 100px;}
}
@media screen and (max-width: 1366px) {
	#casesList ul { height: 600px; }
	#casesList ul li { padding: 20px 23px; }
	#casesList ul li .casesStyle .Photo img { height: 390px; }
	#casesList ul li.slick-center .casesStyle .Photo img { height: 470px; }
}

@media screen and (max-width: 1280px) {
	#aboutBox .imgs , #bookBox .row {position: relative;width: 100%;display: inline-block;}
	#aboutBox .info {width: 100%;}
	#aboutBox p.more{ text-align: center;}
	#customBox .imgs .list{height: 35vh;}
	#customBox .Info .titleBox h2{font-size: 26px;font-weight: 400;margin: 5px 0 20px;}
	#customBox .Info .Txt p{color: #222222;font-size: 16px;line-height: 160%;padding: 0px 50px 0px 0px;}
	#casesBox .arrow_box a { top: calc(100% - 180px); }
	#casesList ul { height: 600px; }
	#casesList .deckTop p { padding: 30px 0 40px 0; }
	#porservice_box .SJJitem.slicknume02 .infot , #porservice_box .SJJitem.slicknume02 a{transform: translateX(0px);}
	#porservice_box .SJJitem.slicknume04 .infot , #porservice_box .SJJitem.slicknume04 a{transform: translateX(00px);}
	#porservice_box .arrow_btns_box{width: 43%;}
}
@media screen and (max-width: 1180px){
	#casesBox .info_item { padding-top: 10px; }
	#casesBox .info_item .title_box h2 { display: inline-block; text-align: center; width: 100%; }
	#casesList ul li .casesStyle .Photo img { height: 340px; }
	#casesList ul li.slick-center .casesStyle .Photo img { height: 420px; }
	#casesBox .arrow_box a { width: 40px; height: 40px; }
	#casesList ul li { padding: 20px 14px; }
	
}
@media screen and (max-width: 1024px) {
	#customBox .Info{width: 30%;}
	#ssbanner .bxslider a:before{background:rgba(0,0,0,0)}
	#ssbanner .bxslider .infot h4{font-size: 20px;padding: 20px 0px;}
	#ssbanner .bxslider{display: flex;flex-wrap: wrap;}
	#ssbanner .bxslider .SSBox:first-child{width: 100%;}
	#ssbanner .bxslider .SSBox{width: 50%;}
	#casesList ul li.slick-center .casesStyle .Photo { padding-bottom: 10px; }
	#casesList ul { height: 510px; }
	#casesList ul li .info p { opacity: 1; -webkit-transition-delay: .5s; transition-delay: .5s; }
	#porservice_box:before{width: 90vw;}
	#porservice_box{padding: 0 0;}
	.mooseemore{width: 15vw;left: 9vw;}
	.leaf_box:before{right: 16vw;}
	#doJJin_box:before{top: -6vw;}
	#casesBox .arrow_btns_box{width: 30%;}
}
@media screen and (max-width: 980px) {
	#bookBox #BookList ul li.slick-slide{ margin: 0}
	#customBox .info {width: 100%;display: block;float: none;padding: 2vh 0;}
	#customBox .info article {width: 60%;margin: 0 auto;}
	#customBox .imgs {position: relative;width: 100%;}
	#customBox .imgs .list {height: 35vh;}
	#customBox .slick-dots {bottom: 40vh;left: calc(0% / 2);}
	#casesList ul { margin-bottom: 10px; height: 510px; }
	#casesList ul li .casesStyle .Photo img { height: 290px; }
	#casesList ul li.slick-center .casesStyle .Photo img { height: 370px; }
}
@media screen and (max-width: 768px) {
	#customBox{background-position: calc(50vw - 1920px) 0;padding: 20px 0px 20px 0px;}
	#customBox .customArea{display: flex;flex-direction: column;}
	#customBox .Info{margin-bottom: 20px;}
	#customBox .Info,#customBox ul{width: 100%;}
	#customBox .Info .Txt p{padding: 0;font-size: 14px;}
	#casesList ul li .info p { font-size: 18px; }
	#casesList ul { height: 620px; }
	#casesBox .arrow_box a { top: calc(100% - 320px); }
	#casesBox .nowrap_box.arrow_box { width: 1010px; }
	#casesBox .arrow_box a#product_prev { left: 90px; }
	#casesBox .arrow_box a#product_next { right: 90px; }
	#casesList ul li { padding: 20px 18px; }
	#casesList ul li .casesStyle .Photo img { height: 430px; }
	#casesList ul li.slick-center .casesStyle .Photo img { height: 530px; }
	#casesList ul li .casesStyle { margin: 26px auto 0; }
	#casesList ul li .casesStyle .Photo img, #casesList ul li.slick-center .casesStyle .Photo img, #casesList ul li .casesStyle .Photo:after { border-radius: 80px 0 80px 0; }
	#casesList ul li .casesStyle .Photo:after { top: 5px; left: 5px; }
	#casesBox {padding: 60px 0 10px 0;}
	#casesBox .arrow_btns_box{width: 83%;}
	#porservice_box .workframe{width: 100vw;}
}

@media screen and (max-width: 680px) {
	#aboutBox .imgs .list {height: 60vw;}
	#productBox .proList {padding: 5vh 0 1vh;}
	#productBox .proList li.slick-center {-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
    #customBox .info article{width: 90%;}
	#customBox .info{padding: 1vh 0;}
	#casesBox .nowrap_box.arrow_box { width: 460px; top: 54%; }
	#casesBox .arrow_box a { top: calc(100% - 230px); }
	#casesBox .arrow_box a#product_prev { left: 60px; }
	#casesBox .arrow_box a#product_next { border-width: 1px 1px 0 0; transform: rotate(45deg); right: 30px; }
	#casesBox .arrow_box a#product_next { right: 60px; }
	#casesList ul { height: 400px; }
	#casesList ul li .casesStyle .Photo img { height: 260px; }
	#casesList ul li.slick-center .casesStyle .Photo img { height: 310px; }
	#casesList ul li .info .h3 font { font-size: 14px; }
	.mooseemore{position:relative;left: auto;bottom: auto;margin-top: 60px;width: min(400px , 60%);display: flex;flex-direction: column;align-items: center;}
	#porservice_box:after{display:none;}
	#porservice_box .arrow_btns_box{width: 110%;}

}
@media screen and (max-width: 640px){
	#porservice_box .slick-center{transform: scale(1);}
	#porservice_box .workframe{width: min(400px , 100%);}
	#casesBox .arrow_btns_box{width: 80%;}
	#doJJin_box:before{display:none;}
	.poJJ_title.left_booxJ{display: flex;flex-direction: column;align-items: center;}
	.swipe-hint{
    display: flex;
    width: 100vw;
    height: 100vh;
    align-items: center;
    position: fixed;
    justify-content: center;
    z-index: 6;
    background: #ffffff70;
}
 #blockOverlay {
      position:fixed;
      top:0; left:0; right:0; bottom:0;
      background:transparent;
      z-index:10000;
      display:none;
    }
}
@media screen and (max-width: 480px) {
	#customBox .imgs .list {height: 21vh;}
	 #customBox .custom .info h3{ font-size: 3vmin; }
	 .wrap{margin-top: -20px;}
	#porservice_box .SJJitem.slicknume02 .infot , #porservice_box .SJJitem.slicknume02 a{transform: translateX(0px);}
	#porservice_box .SJJitem.slicknume04 .infot , #porservice_box .SJJitem.slicknume04 a{transform: translateX(0px);}
	#porservice_box .SJJBox{display:flex;flex-wrap: wrap;}
	#porservice_box .SJJitem{width: 48%;transform: scale(1);margin: 1%;}
	#porservice_box .infot{margin:0;padding: 0 0 15px;}
	#porservice_box .SJJitem:nth-child(3n){width: 100%;}
	#porservice_box .SJJitem:nth-child(3n) .infot:before{top: -94px;display:flex;}
	#porservice_box .SJJitem .infot:before,  .leaf_box {display:none;}
	#porservice_box .workframe{width: 88%;}
	.mooseemore{
    width: min(160px, 60%);
}
}
@media screen and (max-width: 380px)
{
	#casesList ul { height: 410px; }
}