/* customBox*/
#customBox {position: relative;padding: 70px 0px 130px;/* background-color: #fdfdfd; */background-repeat: no-repeat;margin: 0px auto 9px;background-image: linear-gradient(to bottom, #ffffff70, #fdfdfd);}
#customBox .customArea {display: flex;width: 102%;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: #aeaeae;font-size: 13px;font-weight: 400;line-height: 2em;margin: 10px 0;display: block;font-style: normal;margin-left: 8px;letter-spacing: 0.15em;}
#customBox .Info .titleBox h2{color: #d09f74;font-size: 55px;font-weight: 500;line-height: 30px;margin: 15px 0 30px;}
#customBox .Info .titleBox{
    margin-bottom: 40px;
    margin-left: -8px;
}
#customBox .Info .Txt p{color: #222222;font-size: 19px;font-weight: 200;line-height: 30px;padding: 0px 93px 0px 0px;}
#customBox .mama {margin-bottom: 0;width: 70%;}
#customBox .custom{position: relative;font-size: 0;margin: 10px;box-shadow: #53565938 0 0 10px;}
#customBox .custom a{position: absolute;width: 100%;height: 100%;z-index: 1;}
#customBox .imgs .list {height: 485px;background: no-repeat 40%;background-size: cover;}
#customBox .custom .info{
    padding: 15px 0;
}
#customBox .custom .info h3 {position: relative;font-size: 18px;color: #020202;font-weight: 200;overflow: hidden;margin: 0px 0;height: 29px;text-align: left;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
#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;}

@media screen and (max-width: 1600px) {
	#customBox .customArea{width: 100%;}
}
@media screen and (max-width: 1480px) {
	#customBox .imgs .list{
	    height: 435px;
	}
	#customBox .Info .titleBox em{
    font-size: 12px;
}
	#customBox .Info .titleBox h2{
	    font-size: 40px;
	}
	#customBox .Info .Txt p{
	    font-size: 16px;
	}
	#customBox .Info .titleBox{
    margin-bottom: 15px;
}
}
@media screen and (max-width: 1280px) {
	#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;}
}
@media screen and (max-width: 1024px) {
	#customBox .Info{width: 30%;}
}
@media screen and (max-width: 980px) {
	#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);}
}
@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 .mama{width: 100%;}
	#customBox .Info .Txt p{padding: 0;font-size: 14px;}
}
@media screen and (max-width: 680px) {
	#customBox .info article{width: 90%;}
	#customBox .info{padding: 1vh 0;}
}
@media screen and (max-width: 640px){
	#customBox .imgs .list{
    height: 400px;
}
}
@media screen and (max-width: 480px) {
	#customBox .imgs .list {height: 337px;}
	 #customBox .custom .info h3{font-size: 4vmin;}
	#customBox .slick-prev{
    left: -13px;
}
	#customBox .slick-next{
    right: -14px;
}
}