@charset "utf-8";
/* CLEARFIX */
.clearfix:after, .key-visual:after{content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0;}

/* 整體 */

.intro-anchors{display:none !important;}
[id*="anc_"]{position:relative; display:block; height:0; top:-120px;}
.kxs, .ksm, .kmd, .klg{display:none;}
html{background: #53539a;}
body{background:url(images/bg.jpg) repeat center top;}
.mainbg{  margin: auto 0; padding:0 0; background:url(images/main_bg.png) repeat-y center top;}
.note{ width:100%; height:auto;}
.note-s{ display:none;}
.cms26:after{content:"."; display:block; clear:both; line-height:0; height:0;}

/*TOP*/
.scroll2top:link, .scroll2top:visited{width:70px; height:250px; background:url(images/gotop.png) no-repeat 0 0px; margin-left:930px;bottom:100px;}
.scroll2top:hover{background-position:0 -250px;}

/* 主視覺 */
.key-visual{text-align:center; margin:0 auto; padding-bottom:75px;max-width: 1200px;}
.setop.navbar-default{ z-index:999;}
.key-visual .cover .klg { display:block; margin:auto; width:100%;text-align: center; }
.key-visual .cover .klg img{width:100%;}
.film:after {  content: ".";  display: block;  clear: both;  line-height: 0;  height: 0;  visibility: hidden;}

/*薰衣草行程錨點*/
.btn-go{ width:240px; height:80px; display: inline-block; background:url(images/btn_gopd.gif) no-repeat 0 0; position:absolute; z-index:99; text-align:center; left:0; right:0; margin:auto; top:555px;}
.btn-go:hover { background-position:0px -100px;}
.top{margin-top:-120px; display:block; height:10px; float:left;}
/*display:block↑告訴它有空間; height:10px↑告訴它有空間數字多少沒差比0大就好; float:left↑借浮動左右沒差;*/


.mainbg .container{max-width: 1200px;}


/*************** 商品區 ****************/
/*模組C26*/
.cms26{ margin-top: -20px;text-align: center;}
.pd-kanto, .pd-kansai, .pd-hokuriku, .pd-hokkaido01, .pd-hokkaido02, .pd-hokkaido03, .pd-hokkaido04, .pd-hokkaido05, .pd-hokkaido06, .pd-hokkaido07, .pd-hokkaido08{ /*float: left;*/ margin-left: 10px; padding-top: 80px; width: 300px;}
.pd-kanto{background:url(images/pd_title_kanto.gif) no-repeat left top -8px;}
.pd-kansai{background:url(images/pd_title_kansai.gif) no-repeat left top -8px;}
.pd-kansai02{background:url(images/pd_title_kansai02.gif) no-repeat left top -8px;}
.pd-kansai03{background:url(images/pd_title_kansai03.gif) no-repeat left top -8px;}
.pd-hokuriku{background:url(images/pd_title_hokuriku.gif) no-repeat left top -8px;}
.pd-hokkaido01{background:url(images/pd_title_hokkaido01.gif) no-repeat left top -10px;}
.pd-hokkaido02{background:url(images/pd_title_hokkaido02.gif) no-repeat left top -10px;}
.pd-hokkaido03{background:url(images/pd_title_hokkaido03.gif) no-repeat left top -10px;}
.pd-hokkaido04{background:url(images/pd_title_hokkaido04.gif) no-repeat left top -10px;}
.pd-hokkaido05{background:url(images/pd_title_hokkaido05.gif) no-repeat left top -10px;}
.pd-hokkaido06{background:url(images/pd_title_hokkaido06.gif) no-repeat left top -10px;}
.pd-hokkaido07{background:url(images/pd_title_hokkaido07.gif) no-repeat left top -10px;}
.pd-hokkaido08{background:url(images/pd_title_hokkaido08.gif) no-repeat left top -10px;}
.cms26 .group-type-ph {/*float: left;*/}
.ph{position:relative; display:block; /*float:left;*/ padding:0 10px; margin:20px 0 10px 15px;  transition:all .3s ease-out; box-shadow:none; overflow:hidden; width:295px; height:370px; border:1px solid #b5b0a3;border-radius:10px;background:url(images/pd_bg.jpg) repeat center;box-shadow: 0 0 0 1px #fff;}
.ph:hover{border:1px solid #FFF; box-shadow:0 2px 7px 5px rgba(128,128,128,.4);}
.group-type-ph:after{content:""; display:block; clear:both; line-height:0; height:0; visibility:hidden;}
.ph.left{margin-left:0;}
.ph-img{ margin:-10px -10px 0;}
.ph-img img{width:100%; height:auto;}
.ph a:link,  .ph a:visited{text-decoration:none; border:none; color:#fff;}
.ph a img{border:none;}
.ph-title{display:block; font-size:20px; line-height:1.3em; /* max-height:2.2em;*/ overflow:hidden; padding:0 5px 0 10px ; margin:8px -4px 1px -9px; color:#567ded; font-family:"微軟正黑體"; font-weight: 600;letter-spacing:-2px; height:55px; text-align: justify;}
.ph-detail{ display:none;}
.ph-feature{display:block; color:#828282; font-size:14px; line-height:1.3em; padding:1px 0 5px 2px; overflow:hidden; font-family:"微軟正黑體";letter-spacing:-2px; height:54px; overflow:hidden; margin-top:1px; text-align: justify;}
.ph .price{font-size:15px; font-weight:bold; float:right;font-family:"微軟正黑體"; color:#ffffff; background-color:#7299e8; padding:2px 24px;border-radius:8px; position:absolute; left:74px; bottom:14px;font-style:italic;}
.ph .price span{font-size:22px;  font-family: Helvetica; font-weight:bold;}
.ph .price i{ display:none;}
.ph:hover .price{background-color:#ec8ad5;}
.ph:hover .ph-title{color:#ec70cf;}
.ph:hover .ph-detail{background-color:#dabd73;}
.price span:after{content:"起"; display:inline; font-size:15px; position:relative; top:-1px; font-weight: 700; font-family:"微軟正黑體"; margin-left: -6px;}



.col-md-11{ padding:0;}





/*=== 桌機版 較小螢幕 =========================*/

/*@media (max-width: 767px){
.fixing #location-menus{padding-bottom:0; box-shadow:none; background:url(images/drop_bg.gif) repeat-x left top;}
}*/


/*當視窗最小寬度為992px，最大不管，套用這些CSS*/

@media (min-width: 992px){
.mainbg .key-visual .cover .kmd{ display: none;}
.mainbg .key-visual .cover .klg{ display:block;}


}

@media (min-width: 991px) and (max-width: 1150px){


/*薰衣草行程錨點*/
.btn-go{ width:240px; height:80px; display: inline-block; background:url(images/btn_gopd.gif) no-repeat 0 0; position:absolute; z-index:99; text-align:center; left:0; right:0; margin:auto; top:500px;}


}



/*當視窗最小寬度為768px，最大不管，套用這些CSS*/


/*當視窗最小寬度為768px，最大991px，套用這些CSS*/
@media (min-width: 768px) and (max-width: 991px){
.note{ width:100%; height:auto;}
.note-s{ display:none;}

.navbar-custom .navbar-nav > li > a{padding-left:6.8px; padding-right:6.9px; font-size:15px;}
.scroll2top:link, .scroll2top:visited{margin-left:720px;}

/* C26模組 */
.cms26 {padding: 5%;}

/*薰衣草行程錨點*/
.btn-go{ width:240px; height:80px; display: inline-block; background:url(images/btn_gopd.gif) no-repeat 0 0; position:absolute; z-index:99; text-align:center; left:0; right:0; margin:auto; top:48vh;}

}






/*for IOS用*/
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width: 768px) and (max-width: 991px){
#exotic .navbar-custom .navbar-nav > li.ribbon-right{margin-left:-130px; left:145px;}

}

/*=== 行種裝置版 Pad以下 =========================*/

/*當視窗最大寬度為768px，最小不管，套用這些CSS*/
@media (max-width: 767px) {
.key-visual .container{padding:0;}
.key-visual{padding-bottom:0;}
.mainbg .key-visual .cover .kmd{ display:block;}
.mainbg .key-visual .cover .kmd img {display: block; width: 100%;}
.mainbg .key-visual .cover .klg{ display: none;}
.container note{ width:100%; height:auto;}
.container.note-s{ display:none;}

/*TOP-M*/
.scroll2top:link, .scroll2top:visited{margin-left:0; bottom:0; right:0; width:60px; height:100px; background:url(images/top_badge_sm.png) no-repeat 0 0;}
.scroll2top:hover{background-position:0 -100px;}


.cms{padding-top:0;}
.cms .col-md-12{padding:0;}
.carrier{padding:0;}
.carrier h4{border-right-width:10px;}
.carrier li a .price{display:block; float:none; text-align:right; margin-right:5px;}

/* C26模組 */
.cms26 { margin-top: 30px; padding: 5%;}
}



/*當視窗最大寬度為767px，而且視窗為橫向，套用這些CSS*/
@media (max-width:736px) and (orientation: landscape) {
.mainbg .key-visual .cover .klg { display: none;}
.mainbg .key-visual .cover .kmd{ display:block; }
.mainbg .key-visual .cover .kmd img{ width:100%;}

/*薰衣草行程錨點*/
.btn-go{ display:none;}

/* C26模組 */


}


/*=== 行種裝置版 手機樣式 =========================*/

/*@media only screen and (min-width: 602px) and (max-width:765px) {
.mainbg .key-visual .cover .klg { display: none;}
.mainbg .key-visual .cover .kmd{ display:block; }
.mainbg .key-visual .cover .kmd img{ width:100%;}

/*薰衣草行程錨點*/
/*.btn-go{ width:240px; height:80px; display: inline-block; background:url(images/btn_gopd.gif) no-repeat 0 0; position:absolute; z-index:99; text-align:center; left:0; right:0; margin:auto; top:382px;}*/
/* C26模組 */
/*.cms26 h4{ width:95%; margin:0 auto; padding:2px;margin-top: 12px;}
.group-type-ph{ display:inline-block; text-align:center; padding:0; margin: 0 auto; }
.ph{position:relative; display:inline-block; float: none; padding:0 10px; margin:20px 0 0 10px ; width:45%; height:400px; text-align:justify;}
.ph-detail{font-size:15px; background-color:#ce9a2c; padding: 3px 10px; color:#FFFFFF; border-radius:20px; font-family:"微軟正黑體"; ine-height:2.2em; max-height:2.2em; overflow:hidden; height:28px; margin: 92px 0 0px 0;}
.ph-feature{display:block; color:#a5a5a5; font-size:14px; line-height:1.3em; padding:4px 0 5px 2px; overflow:hidden; font-family:"微軟正黑體";letter spacing:-2px; height:60px; overflow:hidden; margin-top: -125px; }
.ph .price{ bottom:35px;}
.container note{ width:100%; height:auto;}*/
	/*}*/




/*當視窗最大寬度為479px，最小不管，套用這些CSS*/
@media (max-width: 479px){
.mainbg .key-visual .cover .klg, .mainbg .key-visual .cover .kmd { display: none;}
.mainbg .key-visual .cover .ksm{ display:block;}
.mainbg .key-visual .cover .ksm img{ width:100%;}
.note{display:none;}
.note-s{ display: block;width:100%; height:auto; }

/*薰衣草行程錨點*/
/*.btn-go{ width:240px; height:80px; display: inline-block; background:url(images/btn_gopd.gif) no-repeat 0 0; position:absolute; z-index:99; text-align:center; left:0; right:0; margin:auto; top:470px;}*/

/* C26模組 */
.cms26 { margin-top: 30px; padding: 5%;}
.cms26 .group-type-ph {float: none;}


}

/*--------------IOS 6尺寸------------------------*/
@media only screen and (min-width: 375px) and (max-width:410px) {
.mainbg .key-visual .cover .klg, .mainbg .key-visual .cover .kmd { display: none;}
.mainbg .key-visual .cover .ksm{ display:block;}
.mainbg .key-visual .cover .ksm img{ width:100%;}

/*薰衣草行程錨點*/
/*.key-visual .btn-go{ width:240px; height:80px; display: inline-block; background:url(images/btn_gopd.gif) no-repeat 0 0; position:absolute; z-index:99; text-align:center; left:0; right:0; margin:auto; top:430px;}*/
/* C26模組 */
.cms26 { margin-top: 30px;padding: 0%;}

	
}



/*當視窗最大寬度為360px，最小不管，套用這些CSS*/
@media (max-width: 360px){
.mainbg .key-visual .cover .klg, .mainbg .key-visual .cover .kmd { display: none;}
.mainbg .key-visual .cover .ksm{ display:block;}
.mainbg .key-visual .cover .ksm img{ width:100%;}

/*薰衣草行程錨點*/
/*.btn-go{ width:240px; height:80px; display: inline-block; background:url(images/btn_gopd.gif) no-repeat 0 0; position:absolute; z-index:99; text-align:center; left:0; right:0; margin:auto; top:420px;}*/

/* C26模組 */
.cms26 { margin-top: 30px;padding: 0%;}
.cms26 .group-type-ph {float: none;}

}

/*------------------IOS 4s尺寸--------------------*/
@media (max-width: 320px){
.mainbg .key-visual .cover .klg, .mainbg .key-visual .cover .kmd { display: none;}
.mainbg .key-visual .cover .ksm{ display:block;}
.mainbg .key-visual .cover .ksm img{ width:100%;}

/*薰衣草行程錨點*/
.btn-go{ width:240px; height:80px; display: inline-block; background:url(images/btn_gopd.gif) no-repeat 0 0; position:absolute; z-index:99; text-align:center; left:0; right:0; margin:auto; top:373px;}
	
/* C26模組 */
.cms26 { margin-top: 40px;padding: 0%;}
.cms26 .group-type-ph {float: none;}
.pd-kanto, .pd-kansai, .pd-hokuriku, .pd-hokkaido01, .pd-hokkaido02, .pd-hokkaido03, .pd-hokkaido04, .pd-hokkaido05, .pd-hokkaido06, .pd-hokkaido07, .pd-hokkaido08{ float: left; margin-left: 10px; padding-top: 68px; background-size: contain; width:90%;}
.cms26 .ph{position:relative; display:block; float:left; padding:0 10px; margin:20px 0 10px 15px;  transition:all .3s ease-out; box-shadow:none; overflow:hidden; width:92%; height:350px; border:1px solid #b5b0a3;border-radius:10px;background:url(images/pd_bg.jpg) repeat center;box-shadow: 0 0 0 1px #fff;}
.cms26 .ph-title{display:block; font-size:19px; line-height:1.26em; /* max-height:2.2em;*/ overflow:hidden; padding:0 5px 0 10px ; margin:8px -4px 1px -9px; color:#567ded; font-family:"微軟正黑體"; font-weight: 600;letter-spacing:-2px; height:72px; text-align: justify;}
.cms26 .ph-detail{ display:none;}
.cms26 .ph-feature{display:block; color:#828282; font-size:13px; line-height:1.3em; padding:1px 0 5px 2px; overflow:hidden; font-family:"微軟正黑體";letter-spacing:-2px; height:65px; overflow:hidden; margin-top:1px; text-align: justify;}
.cms26 .ph .price{font-size:15px; font-weight:bold; float:right;font-family:"微軟正黑體"; color:#ffffff; background-color:#7299e8; padding:2px 24px;border-radius:8px; position:absolute; left:45px; bottom:14px;font-style:italic;}
.cms26 .ph .price span{font-size:22px;  font-family: Helvetica; font-weight:bold;}
.cms26 .price span:after{content:"起"; display:inline; font-size:15px; position:relative; top:-1px; font-weight: 700; font-family:"微軟正黑體"; margin-left: -6px;}

}


/*20170413 modify by kevin*/
.pdList {
	width: auto;
    margin: 0px;
    padding-top: 80px;
    /*float: left;*/
    display: inline-block;
}




@media (max-width: 768px) {
.btn-go{top:53vh;}

}
@media (max-width: 665px) {
.btn-go{top:48vh;}

}
@media (max-width: 580px) {
.btn-go{top:41vh;}

}


@media (max-width: 500px) {
.btn-go{top:36vh;}

}

@media (max-width:479px) {
.btn-go{top:60vh;}

}
@media (max-width:450px) {
.btn-go{top:58vh;}

}

@media (max-width:430px) {
.btn-go{top:54vh;}
.key-visual{padding: 0 0 50px 0;}
}


@media (max-width:396px) {
.btn-go{top:54vh;}

}

