@charset "utf-8";
/* CSS Document */



.contentWrap .wrap{text-align:center; margin:0 auto;}
.contentWrap .wrap .videoBox{ width:100%;margin-bottom: 70px;}
.contentWrap .wrap .videoBox ul{ margin:0 -5px;}
.contentWrap .wrap .videoBox ul li{ float:left; width:33.33%; box-sizing: border-box; padding:0 5px 15px;}

.contentWrap .wrap .videoBox ul li .itemBox{ width:100%;box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.3);}
.contentWrap .wrap .videoBox ul li .itemBox .imgBox{ width:100%;}
.contentWrap .wrap .videoBox ul li .itemBox .imgBox img{display:block; width:100%;opacity:0.7; transition:all 0.4s ease;}
.contentWrap .wrap .videoBox ul li .itemBox .imgBox a{ display:block;}
.contentWrap .wrap .videoBox ul li .itemBox .imgBox a:hover img{ opacity:1;}
.contentWrap .wrap .videoBox ul li .itemBox .txtBox{ width:100%; background:#fff; padding:15px 0;}
.contentWrap .wrap .videoBox ul li .itemBox .txtBox a h3{ font-size:21px; color:#A3C585; font-weight:normal; font-family:微軟正黑體; line-height: 3;}
.contentWrap .wrap .videoBox ul li .itemBox .txtBox a:hover  h3{color:#2F4F2F;}
.contentWrap .wrap .videoBox ul li .itemBox .txtBox p{ font-size:15px; color:#A3C585; line-height:1.6; font-family:微軟正黑體; text-align:left;}
.contentWrap .wrap .videoBox ul li .itemBox .txtBox span.text{ font-family:微軟正黑體; display:block; font-size:13px; color:#5bcbad; text-align:center; font-family:Arial, Helvetica, sans-serif; padding:10px 0; letter-spacing:2px;}


.contentWrap .wrap .navBox{text-align:center; margin:0 auto;}
.contentWrap .wrap .navBox ul{ display:block; margin:0 auto; text-align:center;}
.contentWrap .wrap .navBox ul li{ float:left; width:25%; padding:0 5px; box-sizing: border-box;}
.contentWrap .wrap .navBox ul li a{ display:block; font-size:18px; color:#8254ae; background:#fff; border:1px #8254ae solid; text-align:center; padding:10px 10px; transition:all 0.4s ease;}
.contentWrap .wrap .navBox ul li a:hover{ background:#8254ae; color:#fff;}
.contentWrap .wrap .navBox ul li a.active{ font-size:18px; color:#fff; background:#8254ae; font-weight:bold;}

/*==房型選單==*/
.contentWrap .wrap .navBox ul.rooms li{ width:16.66%; padding:0 5px 10px;}

.contentWrap .wrap .roomsTextBox{text-align:center; margin:0 auto; padding-top:20px;}
.contentWrap .wrap .roomsTextBox ul.roomsText{ display:block; margin:0 auto; text-align:center;;}
.contentWrap .wrap .roomsTextBox ul.roomsText li{ float:left; width:50%; box-sizing: border-box;}
.contentWrap .wrap .roomsTextBox ul.roomsText li a{ display:block; font-size:17px; color:#5bcbad; background:#fff; border:1px #5bcbad solid; text-align:center; padding:5px 5px; transition:all 0.4s ease;}
.contentWrap .wrap .roomsTextBox ul.roomsText li a:hover{ background:#5bcbad; color:#fff;}
.contentWrap .wrap .roomsTextBox ul.roomsText li a.active{ font-size:17px; color:#fff; background:#5bcbad; font-weight:bold;}
.contentWrap .wrap  p{ text-align:left; color:#999; margin:20px 10px 0 10px; }

.contentWrap .wrap .caseBox .slider {width:98%;overflow: hidden;text-align: center; margin-left: 5px;}
.contentWrap .wrap .caseBox .slider ul.slides li img{ height:500px;}
.contentWrap .wrap .caseBox .contentBox{padding-left:20px;padding-top:10px;margin-bottom: 10px;}

@media (max-width:1280px){
}


@media (max-width:1034px){
.contentWrap .wrap{ padding:0 20px;}	
}

@media (max-width:980px){
.contentWrap .wrap .videoBox ul li{ width:50%;}
}

@media (max-width:768px){
.contentWrap .wrap .navBox ul.rooms li{ width:33.33%; padding:0 5px 10px;}

}

@media (max-width:640px){
.contentWrap .wrap .videoBox ul li{ width:100%;}
}

@media (max-width:480px){
.contentWrapp .wrap .navBox b{ display: inline-block; font-size:15px; text-align:left;}
.contentWrap .wrap .navBox ul{ margin-top:30px;}
.contentWrap .wrap .navBox ul li{ width:50%; padding:0 5px 10px;}
.contentWrap .wrap .videoBox{ margin-top:30px;}

.contentWrap .wrap .navBox ul{ margin:30px -3px 0;}
.contentWrap .wrap .navBox ul.rooms li{ width:33.33%; padding:0 3px 6px;}
.contentWrap .wrap .navBox ul.rooms li a{ font-size:16px;}
}


@media (max-width:420px){
.contentWrap .wrap .navBox ul{ margin:30px -3px 0;}
.contentWrap .wrap .navBox ul li{ padding:0 3px 6px;}
}


@media (max-width:375px){
}


@media (max-width:320px){

.contentWrap .wrap .navBox ul.rooms li{ width:50%;}
.contentWrap .wrap .navBox ul.rooms li a{ font-size:14px;}
.contentWrap .wrap .titleBox h2 b{ display:block;}
}
