#casesList ul{margin-bottom:20px;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;height:450px;width:100%;border-bottom:1px solid #e3e3e3;position:relative}
#casesList ul button{display:none}
.slick-prev{width:auto}
.slick-prev,.slick-next{position:absolute;margin-top:-10px;padding:0;color:transparent;border:none;outline:none;background:transparent;line-height:0;font-size:0;cursor:pointer;top:-110px;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%)}
#casesList ul li{overflow:hidden;position:relative;padding: 20px 30px;margin: 0 30px;-webkit-transition:all .9s ease;-o-transition:all .9s ease;transition:all .9s ease}
#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;opacity:0.3}
#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 1.15s,-webkit-transform 1.15s;transition:opacity 1.15s,transform 1.15s;position:relative}
#casesList ul li .info h6{font-size:1.3125vw;display:flex;line-height:0.9em;justify-content:flex-start;text-align:right;opacity:0.3;letter-spacing:-1.5px;margin-bottom:60px;flex-direction:column;align-items:flex-start;position: relative;}
#casesList ul li .info h6::before{content:"";display:block;width:40px;height:1px;background:#000000;margin:0px 0 auto 0;bottom:-40px;position:absolute}
#casesList ul li .info h6::after{width:3em;background-color:#14141442;content:'';display:block;position:absolute;left:0;bottom:-40px;height:1px}
#casesList ul li .info h3{padding:0;font-weight:400;text-overflow:ellipsis;color:#616161}
#casesList ul li .info h3{letter-spacing:4px;text-align:inherit;color:#76707f;display:flex;flex-direction:column}
#casesList ul li .info h3 font{margin:5px 0;font-weight:400;letter-spacing:1.5px;line-height:200%;display:inline-block;width:auto;font-size: 14px;}
#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{
    -webkit-transform: translate(0) scale(1.1);
    transform: translate(0) scale(1.1);
    }
#casesList ul li.slick-center .casesStyle{margin: 20px 0px;opacity:1;-webkit-transition:all .9s ease;-o-transition:all .9s ease;transition:all .9s ease}
#casesList ul li.slick-center .casesStyle h6{margin-bottom:80px;font-size: 40px;position:relative;opacity:0.7}
#casesList ul li.slick-center:before{opacity:0.5;height:70px;width:70px}
#casesList ul li:after{position:absolute;width:0;height:0;background-color:#696969;background-repeat:no-repeat;background-size:contain;display:block;top:0;left:0;z-index:20;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;width:10px;height:10px}
#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}
#casesBox .btn{position:relative}
#casesBox .nowrap_box.arrow_box{width: 90%;display:flex;flex-direction:row;justify-content: space-between;position:absolute;z-index:20;left:50%;top: 45%;transform: translate(-49%,0%);}
#casesBox .arrow_box a{position:relative;border-radius:50%;background-color:#3f393966;box-sizing:border-box;width:60px;height:60px;display:flex}
#casesBox .arrow_box a b{
    display: none;
}
#casesBox .arrow_box a.next{-webkit-transform:scaleX(-1);transform:scaleX(-1);margin-left:20px}
#casesBox .arrow_box a:before,#casesBox .arrow_box a:after{position:absolute;width:15px;height:1px;background:#ffffff;display:block;top:50%;left:calc((100% - 13px) / 2);-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transform-origin:left;transform-origin:left;content:""}
#casesBox .arrow_box a:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
#casesList ul li .casesStyle .Photo:after{content:'';position:absolute;width:100%;height:99%;top:10px;left:10px;z-index:0;border:1px solid #f0b7a4;border-radius:120px 0 120px 0}
#casesList ul li:before{position:absolute;width:0;height:0;border-left:solid 1px rgb(51 51 51 / 54%);border-top:solid 1px rgb(51 51 51 / 54%);display:block;top:10px;left:10px;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;z-index:0}


@media screen and (max-width: 1440px) {
	#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{height: 340px;}
	#casesList ul li.slick-center:before{
    top: 0px;
    left: 0px;
}
	#casesList ul li.slick-center .casesStyle h6{
    margin-bottom: 50px;
    font-size: 35px;
}
	#casesList ul li .info h6::before,#casesList ul li .info h6::after{
    bottom: -25px;
}
#casesList ul li.slick-center .casesStyle{
    margin: 10px 10px 20px;
}
}
@media screen and (max-width: 1366px) {
	#casesBox .arrow_box a{
    width: 40px;
    height: 40px;
}
	#casesBox .arrow_box a:before, #casesBox .arrow_box a:after{
    width: 12px;
}
    #casesList ul{height: 360px;}
	#casesList ul li{padding: 20px 10px;}
	#casesList ul li .casesStyle .Photo img{height:390px}
	#casesList ul li.slick-center .casesStyle .Photo img{height:470px}
}
@media screen and (min-width:1281px) {
	#casesList ul:before{content:"";-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;display:block;width:25px;height:25px;background-color:#cccccc61;position:absolute;left:calc(50% - 12.5px);bottom:calc(0% - 12.5px);right:8px}
	#casesList ul:after{content:"";-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;display:block;width:7px;height:7px;background-color:#989898;position:absolute;left:calc(50% - 3.5px);bottom:calc(0% - 3.5px);right:17px}
}
@-webkit-keyframes apple_circle {
	#casesList ul li.slick-center:before {opacity: 1;-webkit-transition-delay:1s;transition-delay:1s}
}
@media screen and (max-width: 1280px) {
	#casesBox .arrow_box a{top:calc(100% - 180px)}
	#casesList ul{height: 360px;}
	#casesList .deckTop p{padding:30px 0 40px 0}
}

@media screen and (max-width:1180px){
	#casesList ul li .info h3 font{font-size: 16px;letter-spacing:0.5px}
	#casesBox:before,#service_area .serviceBG,#service_area .deck01,#customBox .Book_box:before,#customBox .nowrap_box.arrow_box,#service_area .deck02,#service_area .deck03,#customBox .deck02,section .info_item .title_box h2:before{display:none}
	#customBox .customBG,#customBox.tooolong .customBG{width:calc(100% - 0px)}
	#customBox .info_item,#casesBox .info_item{display:flex;align-items:center;width:100%;justify-content:center}
	#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 30px 0;margin: 10px 20px;}
	#casesList ul li.slick-center .casesStyle{
    margin: 0;
}
}
@media screen and (min-width:1025px) {
	#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: 40px 0 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: 1024px) {
	#casesList ul li.slick-center .casesStyle .Photo{padding-bottom:10px}
	#casesList ul{height: 270px;}
	#casesList ul li .info p{opacity:1;-webkit-transition-delay:.5s;transition-delay:.5s}
}
@media screen and (max-width: 980px) {
	#casesList ul{margin-bottom:10px;height:510px}
	#customBox .slick-dots{left:0;bottom:-3vh}
	#casesList ul li .casesStyle .Photo img{height:290px}
	#casesList ul li.slick-center .casesStyle .Photo img{height:370px}
}
@media screen and (max-width: 768px) {
	#casesList ul li .info p{font-size:18px}
	#casesList ul{height:300px}
	#casesBox .arrow_box a{top:calc(100% - 320px)}
	#casesBox .nowrap_box.arrow_box{width: 100%;}
	#casesBox .arrow_box a#product_prev{left:90px}
	#casesBox .arrow_box a#product_next{right:90px}
	#casesList ul li{padding: 30px 20px;margin: 30px 80px;}
	#casesList ul li.slick-center .casesStyle h6{font-size:31px;margin-bottom:60px}
	#casesList ul li.slick-center .casesStyle{/* margin:12px; */}
	#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: 20px 0 10px 0;}

}
@media screen and (max-width: 680px) {
    #casesBox .nowrap_box.arrow_box{/* width: 460px; */top: 45%;}
	#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: 330px;}
    #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;}
	#casesList ul li{
    margin: 30px 40px;
}
}

@media screen and (max-width:380px) {
	#casesList ul {height: 420px;}
}