@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css); 


.inlineBlockSpacing {
     letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
    *letter-spacing: normal; /* reset IE < 8 */
    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */
    
}

#mtkContainer ,
#mtkContainer *,
#mtkContainer ::after,
#mtkContainer ::before { box-sizing: border-box; }

.bgBlue { background: #457cce; }
.bgYellow { background: #ffc400; }
.bgYellowLine {background-color: #fff;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #ebe8de), color-stop(.25, transparent),color-stop(.5, transparent),
 color-stop(.5, #ebe8de),color-stop(.75, #ebe8de), color-stop(.75, transparent),to(transparent));
-webkit-background-size: 5px 5px;}
.bgBlue2 { /*background:url(../images/bg-blue-1.jpg) top center repeat-y;*/ 
background-color: #457cce;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #3c70be), color-stop(.25, transparent),color-stop(.5, transparent),
 color-stop(.5, #3c70be),color-stop(.75, #3c70be), color-stop(.75, transparent),to(transparent));
-webkit-background-size: 5px 5px;}

.bgDarkGlory { background: #404040;  }


.width1 { margin: 0 auto; width: 90%; max-width: 1400px; }
.width2 { margin: 0 auto; width: 90%; max-width: 800px; }

h2 { margin-bottom: 15px; font: bold 32px/1.4 "arial","微軟正黑體"; color: #fff; text-align: center; letter-spacing: normal; }
h2 img { height: 1.2em; width: auto; }
h3  {  font:bold 24px/1.4 "arial","微軟正黑體"; color: #fff; text-align: center; letter-spacing: normal; }
p,a { font:15px/1.4 "arial","微軟正黑體"; color: #fff; text-align: left; letter-spacing: 2px; }


h2.blue { color: #457cce; }

header.header { padding-bottom: 80px; min-height: 90vh; background-size: cover;background-attachment:scroll; }
header.header.bgDefault,
header.header.finolhu { background:url(../images/bg-header-default-1.jpg) top center no-repeat fixed; background-size: cover;background-attachment:scroll; background-attachment:scroll; }
header.header.cherating { background:url(../images/header-vision-cherating.jpg) center center no-repeat fixed; background-size: cover;background-attachment:scroll; } 
header.header.kabira { background:url(../images/header-vision-kabira.jpg) top center no-repeat fixed; background-size: cover;background-attachment:scroll; } 
header.header.sanya { background:url(../images/header-vision-sanya.jpg) center center no-repeat fixed; background-size: cover;background-attachment:scroll;} 
header.header.bali { background:url(../images/header-vision-bali.jpg) bottom center no-repeat fixed; background-size: cover;background-attachment:scroll; } 
header.header.bintan { background:url(../images/header-vision-bintan.jpg) bottom center no-repeat fixed; background-size: cover;background-attachment:scroll; } 
header.header.guilin { background:url(../images/header-vision-guilin.jpg) bottom center no-repeat fixed; background-size: cover;background-attachment:scroll; } 
header.header.kani { background:url(../images/header-vision-kani.jpg) top center no-repeat fixed; background-size: cover;background-attachment:scroll; } 
header.header.phuket { background:url(../images/header-vision-phuket.jpg) top center no-repeat fixed; background-size: cover;background-attachment:scroll; }
header.header.albion { background:url(../images/header-vision-albion.jpg) bottom center no-repeat fixed; background-size: cover;background-attachment:scroll;}
header.header.canonniers { background:url(../images/header-vision-canonniers.jpg) bottom center no-repeat fixed;background-size: cover;background-attachment:scroll; }
header.header.sahoro { background:url(../images/header-vision-sahoro.jpg) bottom center no-repeat fixed;  background-size: cover;background-attachment:scroll;}
header.header.tomamu { background:url(../images/header-vision-tomamu2.jpg) bottom center no-repeat fixed; background-size: cover;background-attachment:scroll; }
header.header.yabili { background:url(../images/header-vision-yabili.jpg) bottom center no-repeat fixed; background-size: cover;background-attachment:scroll; }
header.header.beidahu { background:url(../images/header-vision-beidahu.jpg) center center no-repeat fixed; background-size: cover;background-attachment:scroll; }
header.header.group { background:url(../images/header-vision-group.jpg) center center no-repeat fixed;  background-size: cover;background-attachment:scroll;}
header.header.clubmed { background:url(../images/header-vision-clubmed.jpg) center center no-repeat fixed;  background-size: cover;background-attachment:scroll;}
header.header.honeymoon { background:url(../images/header-vision-honeymoon.jpg) center center no-repeat fixed;  background-size: cover;background-attachment:scroll;}
header.header.family { background:url(../images/header-vision-family.jpg) center center no-repeat fixed;  background-size: cover;background-attachment:scroll;}
header.header.summer { background:url(../images/header-vision-summer.jpg) center center no-repeat fixed;  background-size: cover;background-attachment:scroll;}
header.header.newsale { background:url(../images/header-vision-newsale.jpg) center center no-repeat fixed;  background-size: cover;background-attachment:scroll;}




header.header .pageMenu { position: sticky; position: -webkit-sticky; top:0; margin-bottom: 20vh; padding: 0; text-align: right; vertical-align: bottom; background: rgba(38,120,220,0.8); z-index: 10; }
header.header .pageMenu ul { display: inline-block; padding:0  17.5% 0 14px;  }
header.header .pageMenu li { display: inline-block; padding: 14px 14px 10px 14px; }
header.header .pageMenu p,
header.header .pageMenu a { font-size: 20px; color: #fff; letter-spacing: normal; vertical-align: bottom;}
header.header .pageMenu .hasSecButton  a { display: block;  font-size: 17px; color: #fff; }
.pageMenu li img {transform: translateY(-0.2em); width: 1em; }

.hasSecButton .pc { display: block; }
.hasSecButton .mobile { display: none; }
.hasSecButton { position: relative; }
.hasSecButton .secButton {display: none; position: absolute; top:100%; left: 0; padding: 5px 0; width: 100%; background: rgba(0,0,0,0.8); z-index: 100; }
.hasSecButton .secButton a { display: block;padding: 5px 0; text-align: center; }
.hasSecButton .secButton a:hover {background: #457cce; color:#fbc41f; }



.pageMenu li img {transform: translateY(-0.2em); width: 1em; }

header.header h1 { text-align: center; }
header.header h1 .h1Content { margin-bottom:120px;  display: inline-block; }
header.header h1 svg { margin-bottom: 15px; display: block; width: 600px; filter: drop-shadow(0px 0px 12px #457cce);  }
header.header h1 span {  padding: 5px 20px; font:24px/1 "arial","微軟正黑體"; color: #fff; letter-spacing: normal; border-radius: 99em;
letter-spacing: 2px; background:#457cce; }

.item header.header .pageMenu { margin-bottom: /*100px*/ 10vh; }
.item header.header h1 { text-shadow: #457cce 0px 0px 15px; font: bold 140px/1 arial, 微軟正黑體; color: #fff; }
.item header.header h1 svg {margin:0 auto 15px auto; width: 230px }
.item header.header h1 small { display: block;padding-bottom: 10px; font-size: 34px; letter-spacing: 2px ; text-shadow: #457cce 0px 0px 10px,#457cce 0px 0px 10px}
.item header.header h1 .h1Content { margin-bottom:0px;  display: inline-block; }


.tipBase { margin: -50px auto 50px auto; text-align: center; }
.tip { position: relative; display: inline-block; margin:0 10px; max-width: 200px; border-radius: 99em; background: #fff; overflow: hidden;  }
.tip img { width: 101%; max-width: 100px; }
.tip p { position: absolute; bottom:0; left: 0; padding:3px 10px; width: 100%; text-align: center; letter-spacing: normal; line-height: 1.1; color: rgba(255,255,255,0.7); transition: .5s; background: rgba(0,0,0,0.8);  }
.tip:hover p { color: #fff } 

.searchBase {  text-align: center; }
.searchBase-bar { margin: 0 auto; position: relative; padding: 20px 20px 20px  25px; width: 90%; max-width: 730px; height: 85px;
 border-radius: 10px;overflow: hidden; background:#fff; }
.searchBase-bar::after { content: ""; position: absolute; top:0; left: 0; width: 10px; height: 100%; background: #457cce; }
.searchBase-bar::before { content: ""; position: absolute; top:calc(50% - 5px); left: 5px; width: 10px; height: 10px; transform: rotate(45deg);
 background: #457cce; }

.searchBase-bar-input { display: inline-block; width: 75%; height: 50px; }
.searchBase-bar-send { display: inline-block; width: 25%; height: 50px;font:24px/50px "arial","微軟正黑體"; color: #fff;letter-spacing: normal;
 border-radius: 10px; cursor: pointer; }

.searchBase-bar-input-location,
.searchBase-bar-input-date { display: inline-block; margin-right: 1%; padding: 0 5px; width: 49%; height: 100%; border-radius: 10px; border:1px solid #ddd;
font:24px/50px "arial","微軟正黑體"; color: #bbb; letter-spacing: normal; text-align: left; }


.content { position: relative; padding:50px 0 75px 0;}
/*.content::after { content: "more"; position: absolute; bottom:30px; left: calc(50% - 20px); width: 40px; height: 25px; font: 14px/1 "arial"; color: #757575;
 text-align: center; background:url(../images/arrow.png) bottom center no-repeat; }*/
/*
.content.bgBlue2::after { content: "more"; position: absolute; bottom:10px; left: calc(50% - 20px); width: 40px; height: 25px; font: 14px/1 "arial"; color: #fff;
 text-align: center; background:url(../images/arrow2.png) bottom center no-repeat; }*/
.content.noArrow::after {display: none; }

.boxBase {}
.boxBase img { width: 100%; }
.boxBase > .box3 { position: relative; display: inline-block; width: 33.333333%; letter-spacing: normal; vertical-align: top; }
.boxBase > .box3:first-child { width:33.333334%;}
.boxBase > .box3.text { padding: 30px; }
.boxBase > .box3.text img { display: block; margin: 0 auto; max-width: 75px }
.boxBase > .box3 p { margin-bottom: 12px; }

.content.box3newContent{padding:50px 0 25px 0;}
@media only screen and (max-width: 500px){
	.content.box3newContent{padding:30px 0 20px 0;}
}
.width1 .boxBase > .box3.box3new img {max-width: 65px;margin-bottom: 5px;}
.width1 .boxBase > .box3.box3new { width:47%;padding: 30px 30px 30px 60px;}
.width1 .boxBase > .box3.box3new strong{background: #FFF;border-radius: 20px;color: #457cce;padding: 3px 10px;font-size: 20px;cursor: pointer;}
.width1 .boxBase > .box3.box3newImg{width: 53%;}
.width1 .boxBase > .box3.box3new  ul{margin: 0 0 0 10px;}
.width1 .boxBase > .box3.box3new  ul li{font:16px/1.8 "arial","微軟正黑體";color: #FFF; list-style-type:upper-alpha;}
.width1 .boxBase > .box3.box3new  ul li p{margin-bottom: 0;}

/*lightbox*/
.lightbox * {letter-spacing: 2px;}
.lightboxblack{background: rgba(0,0,0,0.6);width: 100%;height: 100%;position: fixed;display: block;top: 0;left: 0;z-index: 999;display: none;}
.lightbox {top:10%;width: 80%;height: 80%;background: #FFF;padding: 5%;overflow-y: scroll;text-align: left;left: 10%;position: relative;display: block;}
.lightbox b {font:bold 18px/1.8 "arial","微軟正黑體";color:#000;margin: 0 auto;text-align: left;}
.lightbox p {font:16px/1.6 "arial","微軟正黑體";color:#000;margin: 0 auto;text-align: left;}
.lightbox .title {font:bold 36px/1.4 "arial","微軟正黑體";color:#457cce;margin: 0 auto;text-align: left;padding: 0px 10px;border-bottom: #457cce solid 1px;}
.lightbox li {font:16px/1.8 "arial","微軟正黑體";color:#000;margin: 0 auto;text-align: left;list-style-type: circle;}
.lightbox a{color:#FFF;text-decoration: underline;}
.lightbox .close{position: fixed;right: 12%;top:13%;opacity:1;}
.lightbox .close svg g .st0{fill:#457cce;}
.lightbox .close svg{width: 50px; height: 50px; opacity: 1;transition: .3s;cursor: pointer;}
.lightbox .close svg:hover g .st0{fill:#ff6476;}
ul.nostyle li{list-style-type: none;}
ul.nostyle li span{font-weight: bold;}




@media only screen and (max-width: 651px) {
.lightbox .title{font:bold 24px/1.4 "arial","微軟正黑體";}
.lightbox{position: fixed;padding: 10% 5%;}
.lightbox .close{right: 5px;top:9px;}
.lightbox .close svg{width: 35px;height: 35px;}
.lightbox .close svg g .st0{fill:#FFF;}



}


/*lightbox*/
/*
.lightboxblack{background: rgba(0,0,0,0.8);z-index: -1;width: 100%;height: 100%;}
.lightbox{position: fixed;top:10%;width: 80%;height: 80%;z-index: 999;background: #FFF;padding: 5%;overflow-y: scroll;text-align: left;left: 10%;display: none;z-index: 50;}
.lightbox b {font:bold 18px/1.8 "arial","微軟正黑體";color:#000;margin: 0 auto;text-align: left;}
.lightbox p {font:16px/1.6 "arial","微軟正黑體";color:#000;margin: 0 auto;text-align: left;}
.lightbox .title {font:bold 36px/1.4 "arial","微軟正黑體";color:#457cce;margin: 0 auto;text-align: left;padding: 0px 10px;border-bottom: #457cce solid 1px;}
.lightbox li {font:16px/1.8 "arial","微軟正黑體";color:#000;margin: 0 auto;text-align: left;list-style-type: circle;}
.lightbox a{color:#FFF;text-decoration: underline;}
.close{position: absolute;right: 30px;top:30px;}
.close svg g .st0{fill:#457cce;}
.close svg{width: 50px; height: 50px; opacity: 1;transition: .3s;cursor: pointer;}
.close svg:hover g .st0{fill:#ff6476;}
ul.nostyle li{list-style-type: none;}
ul.nostyle li span{font-weight: bold;}




@media only screen and (max-width: 651px) {
.lightbox .title{font:bold 28px/1.4 "arial","微軟正黑體";}
.lightbox{position: fixed;padding: 10% 5%;}
.close{right: 5px;top:9px;}
.close svg{width: 35px;height: 35px;}

}
*/

.arrowRight::after {content: ""; position: absolute; top:calc(50% - 10px); right: -10px; width: 20px; height: 20px;border:10px solid transparent;
 border-top:10px solid #457cce; border-left:10px solid #457cce; transform: rotate(-45deg); }
.arrowLeft::after {content: ""; position: absolute; top:calc(50% - 10px); left: -10px; width: 20px; height: 20px;border:10px solid transparent;
 border-top:10px solid #457cce; border-right:10px solid #457cce; transform: rotate(45deg); }
.arrowLeft img{transform: translateX(1px);}


.whiteBg { background:#fff; }
.whiteBg .arrowRight::after  {  border-top:10px solid #fff; border-left:10px solid #fff }
.whiteBg .arrowLeft::after {border-top:10px solid #fff; border-right:10px solid #fff;  }
.whiteBg .box3.text h2{ color: #457cce; }
.whiteBg .box3.text p { color: #000; }

.roundBoxBase { text-align: center;  }
.roundBoxBase img { width: 100%; }
.roundBoxBase-area { display: inline-block;    margin-bottom: 2%; padding: 0 3%; width: 20%; letter-spacing: normal; }
.roundImgLine { padding: 4px; border:1px solid #fff; border-radius: 99em; }
.roundImgLine-inner { border-radius: 99em; overflow: hidden; }


.roundBoxBase.box3 .roundBoxBase-area { padding: 0; width: 30%; }



.newsBase .newsBase-text::-webkit-scrollbar-corner{
background-color: red; 
} 
.newsBase { height: 400px;  }
.newsBase .newsBase-text { display: inline-block;padding: 30px; width: 66.666667%; height: 100%; letter-spacing: normal;  }
.newsBase .newsBase-text h2 {color: #000;}
.newsBase .newsBase-img { display: inline-block; width: 33.333333%; letter-spacing: normal; }
.newsBase .box-head,
.newsBase .intro-anchors,
.newsBase h4,
.newsBase .price { display: none; }
.newsBase .carrier { height: 90%; }
.newsBase .carrier ul { height: 100%; overflow: hidden;overflow-y: scroll; overflow-x:hidden;-webkit-overflow-scrolling: touch;overflow-scrolling: touch; }
.newsBase .carrier a { font:16px/1.6em "arial","微軟正黑體"; color: #000; }
.newsBase .carrier strong { display: block; position: relative; z-index: 2; }
.newsBase .carrier li { position: relative; margin-left: 40px; margin-bottom: 10px; transition: .5s; z-index: 2;  }
.newsBase .carrier li a { position: relative; z-index: 2; }
.newsBase .carrier li::after { position: absolute; top:0; left: -10px; content: ""; width: 5px; height: 100%;background: #fff; transition: .5s; z-index: 1;}
.newsBase .carrier li:hover { transform: translateY(-5px); }
.newsBase .carrier li:hover::after { width: 100%; }
.newsBase .newsBase-img {min-height: 100%; height: 100%; background:url(../images/index-img-13a.jpg) top center no-repeat; }
.newsBase .newsBase-img img { width: 100%; height: auto; }





/*.newOffer .group-type-ph { text-align: center;  margin-top: 20px;}
.newOffer .ph { position: relative; display: inline-block; margin: 0 10px 20px 10px; padding-bottom: 15px; max-width: 300px; text-align: center; background: #fff; }
.newOffer .ph img { width: 100%;transition: 0.3s; }
.newOffer .ph-title {  margin-top: 0px; padding:5px 10px; min-height: 28px; height: auto; font: 18px/24px "arial","微軟正黑體"; color: #fff; text-align: center;
;z-index: 1; overflow: hidden; background: #000;}*/
/*background: linear-gradient(90deg, rgba(0, 0, 0, 1)0%, rgba(0, 0, 0, 0)100%); 
background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 1)0%, rgba(0, 0, 0, 0)100%); 
background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 1)0%, rgba(0, 0, 0, 0)100%); 
background: -o-linear-gradient(90deg, rgba(0, 0, 0, 1)0%, rgba(0, 0, 0, 0)100%); */ 

/*
.newOffer .ph-detail,
.newOffer .ph-feature { padding:0 10px; font: 16px/1.8em "arial","微軟正黑體"; color: #4f4f4f; text-align: left; }
.newOffer .ph-detail {padding:15px 10px 0 10px  }
.newOffer .ph .price { padding: 5px 10px; font: 20px/1.8em "arial","微軟正黑體"; color: #fff; border-radius: 99em; background: #457cce;  }
.newOffer .ph .price span { margin:0 -5px; font: 20px/1.8em "arial","微軟正黑體";  }

.newOffer{text-align: center;}
.newOffer a {margin: 0 auto;}
.newOffer a .ph-img {overflow: hidden;}
.newOffer a img.newPC{ max-width: 1057px; border-radius:30px;width: 100%;transition: 0.3s;}
.newOffer a img.newM{ max-width: 800px; border-radius:0px;width: 100%;display: none;transition: 0.3s;}
.newOffer a img:hover {transform:scale(1.1);}



@media only screen and (max-width: 800px) {
.newOffer a img.newPC{display: none;}
.newOffer a img.newM{display: block;}
}
*/

.hotBase h2 img{transform: translate(-9px,-2px);}
.newOffer h2 img{transform: translate(-9px,-2px);}
.newsBase-text h2 img{transform: translate(-9px,-2px);}
.hotBase  {  }
.hotBase  .box2 {  letter-spacing: -0.31em;*letter-spacing: normal;  *word-spacing: -0.43em;
 text-rendering: optimizespeed;  }
.hotBase  .a-box { display: inline-block; margin: 0 2%; width: 46%; background: #fff; }
.hotBase h2 { text-align: center; color: #457cce; }
.hotBase   .hot-infor { margin-top: 10px; margin-bottom: 40px; }
.hot-infor .hot-infor-text { margin:0; padding-top: 10%; width: 33.333333% ; text-align: center; background: #fff; }
.hot-infor .hot-infor-text h3 { margin:0 auto; width: 80%; font: 22px/26px "arial","微軟正黑體"; color: #457cce; border-bottom: 1px solid #818181; }
.hot-infor .hot-infor-text p {font: 18px/20px "Times New Roman"; color: #818181;  text-align: center; }
.hot-infor .hot-infor-photo { margin:0; width: 66.666666% }
.hot-infor .hot-infor-photo img { width: 100%; }


.bg-clubmedInfor-1 { background: url(../images/bg-clubmedInfor-1.jpg) top center no-repeat; }
.bg-clubmedInfor-2 { background: url(../images/bg-clubmedInfor-2.jpg) top center no-repeat; }
.bg-clubmedInfor-3 { background: url(../images/bg-clubmedInfor-3.jpg) top center no-repeat; }
.bg-honeymoon-1 { background: url(../images/bg-honeymoon-1.jpg) top center no-repeat; }
.bg-honeymoon-2 { background: url(../images/bg-honeymoon-2.jpg) top center no-repeat;  }
.bg-honeymoon-3 { background: url(../images/bg-honeymoon-3.jpg) top center no-repeat;  }
.bg-family-1 { background: url(../images/bg-family-1.jpg) top center no-repeat;  }
.bg-family-2 { background: url(../images/bg-family-2.jpg) top center no-repeat;  }
.bg-family-3 { background: url(../images/bg-family-3.jpg) top center no-repeat;  }
.bg-family-4 { background: url(../images/bg-family-4.jpg) top center no-repeat;  }
.bg-summer-1 { background: url(../images/bg-summer-1.jpg) top center no-repeat; }
.bg-summer-2 { background: url(../images/bg-summer-2.jpg) top center no-repeat; }
.bg-summer-3 { background: url(../images/bg-summer-3.jpg) top center no-repeat; }
.bg-summer-4 { background: url(../images/bg-summer-4.jpg) top center no-repeat; }
.bg-group-1 { background: url(../images/bg-group-1.jpg) top center no-repeat; }
.bg-group-2 { background: url(../images/bg-group-2.jpg) top center no-repeat fixed; background-size: cover;background-attachment:scroll;  }
.bg-group-3 { background: url(../images/bg-group-3.jpg) top center no-repeat; }
/*
.maskWhite { position: relative; }
.maskWhite::before { content: ""; position: absolute; top:0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.5); z-index: 1; }
.maskWhite > * { position: relative; z-index: 3; }
*/

.clubmedInfor { margin: 0 0.75% 0.75% 0.75%; padding: 80px 30px; }
.clubmedInfor .clubmedInfor-text { padding: 20px; width: 100%; max-width: 435px; background:  rgb(60 112 190 / 80%);}
.clubmedInfor .clubmedInfor-text h2 { border-bottom: 1px solid #fff; }


.clubmedBox4 .aBox { position: relative; display: inline-block; padding: 0.75%; width: 25% }
.clubmedBox4.box5 .aBox { position: relative; display: inline-block; padding: 0 0.75% 0.75% 0.75%; width: 20% }
.clubmedBox4 .aBox img { width: 100%; transition: .5s;}
.clubmedBox4 .aBox-img { position: relative; opacity: 1 ; transition: .5s; overflow: hidden;}
.clubmedBox4 .aBox-img::after {content: ""; position: absolute; top:0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 1; transition: .5s;}
.clubmedBox4 .aBox:hover .aBox-img { opacity: 1; }
.clubmedBox4 .aBox:hover .aBox-img img { transform: scale(1.05); }
.clubmedBox4 .aBox:hover .aBox-img::after { background: 0; }
.clubmedBox4 .aBox-text { position: absolute; top: 10%; left: 0; width: 100%; height: 100%; text-align: center; z-index: 2; }
.clubmedBox4 .line { border:1px solid rgba(255,255,255,0.5);padding: 0px 5px;width: 100%; height: 100%; line-height: 1000%; transition: 1s;  transform: translateY(0px); }
.clubmedBox4.box5 .line { line-height: 850%; }
.clubmedBox4 .aBox:hover .line { border:1px solid rgba(255,255,255,0); color: rgba(255,255,255,0); margin-top: -100px; }
.clubmedBox4 .line span {position: absolute;bottom: 5px;right: 10px;width: auto;height: 20px; z-index: 2;line-height: 1;font: 16px/1 "微軟正黑體"; color: rgba(255,255,255,0.6);}
.clubmedBox4 .aBox:hover .line span { color: rgba(255,255,255,1); }
.clubmedBox4 h3 { display:  inline-block; padding: 7px; font-weight: normal; width: 80%; height: 80%; background: rgba(0,0,0,0.0); }




.clubmedBox1 {  }
.clubmedBox1 .aBox { position: relative; display: block; padding: 0.75%; width: 100% }
.clubmedBox1 .aBox .aBox-img { display: inline-block;width: 70%; transform: translateX(10%); overflow: hidden; }
.clubmedBox1 .aBox img { width: 100%; transition: .5s; }
.clubmedBox1 .aBox:hover img { transform: scale(1.05); }
.clubmedBox1 .aBox-text { position: relative; display: inline-block; width: 29%; text-align: center;transform: translate(-20%,40%); }
.clubmedBox1 .line { border:1px solid  rgb(60 112 190 / 80%);padding: 5%;}
.clubmedBox1 h3 { display:  inline-block; padding: 20px; width: 100%;font-size: 40px; font-weight: normal; background: rgb(255 255 255 / 90%);color: #457cce; }


.bgYellowLine .width1  > h2 {color:#457cce; } 


.style1 .style1-text { display: inline-block; padding-right: 20px; width:40%; letter-spacing: normal; color: #000; }
.style1 .style1-img { display: inline-block; width:60%; letter-spacing: normal;  }
.style1 img { width: 100%; }
.style1 .style1-text h2 { padding-left: 10px ;font-size: 46px; text-align: left; }
.style1 .style1-text h3 { margin-top: 10px; color: #457cce; text-align: left; }
.style1 .style1-text p { margin-top: 10px; color: #000; }


.style1 .down { margin-top: -40px; }
.style1 .down .style1-text { margin-top: 70px; padding-right: 0; padding-left: 20px;}
.style1 .down .style1-text.margintop50{margin-top: 50px;}

.style1 .down .style1-text h2 {   padding-right: 10px  }

.style1 .style1-text h2 {background: #457cce; }

.bgBlue2 .style1 .style1-text h2 {background: #fff; color:#457cce; }
.bgBlue2 .style1 .up .style1-text h3,
.bgBlue2 .style1 .up .style1-text p ,
.bgBlue2 .style1 .down .style1-text h3,
.bgBlue2 .style1 .down .style1-text p  { color: #fff;}

/*
.style1 .style1-text h3,
.style1 .style1-text p { color: #757575; }
*/
.style2 { text-align: center; }
.style2 .style2-aBox { display: inline-block; padding: 0 1%; width: 25%; }
.style2 img { width: 100%; }
.style2 .style2-aBox-text { padding: 15px 0; background:#fff; }
.style2 .style2-aBox-text h3 { color: #457cce;}
.style2 .style2-aBox-text p { color: #000; padding: 0px 20px 10px 20px; }
.style2-aBox-text strong { display: block;color: #fff; border-radius: 99em; margin:0 auto 10px auto; width: 90%; text-align: center; background:#457cce; }
.style2 .style2-aBox-text p small { font-size: 12px;transform: translateY(4px); display: inline-block;}

.mobile-nav-control { display: none;}







/*蜜月*/
.content.bgYellowLine.honeymoonpart1{padding: 5% 0;}
.honeymoonInfor { margin:0 auto; padding: 5%; max-width: 1400px; }
.honeymoonInfor-text { position: relative; padding: 20px; width: 100%; max-width: 480px; background:rgb(60 112 190 / 80%);}
.honeymoonInfor-text::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height: calc(100% - 10px); border:1px solid rgba(255,255,255,0.5); }




.honeymoonInfor-text h2 { }

.honeymoonBoxBase {  }
.honeymoonBoxBase .honeymoonBoxBase-area { display: inline-block; padding: 0 10px; width: 25%; }
.honeymoonBoxBase .honeymoonBoxBase-area:nth-child(1) { margin-bottom: 30px;  }
.honeymoonBoxBase .honeymoonBoxBase-area img { width: 100%; }
.honeymoonBoxBase-area .honeymoonText { margin: 0 auto; padding: 10px; width: 90%; transform: translateY(-10px); background: #FFF; }
.honeymoonBoxBase-area .honeymoonText h3{color:#577cce;}
.honeymoonBoxBase-area .honeymoonText p{color:#000;}

.honeymoonBigTitle { padding: 5% 0 5% 0; height: auto; text-align: center; background-size: 100% auto ;}
/*.honeymoonBigTitle h2 { position: relative; display: inline-block; margin-bottom:10%; padding: 12px 20px; font-weight: normal; letter-spacing: 2px; background:rgb(60 112 190 / 90%) ;}
.honeymoonBigTitle h2::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }*/
.honeymoonBigTitle h2 { position: relative; display: inline-block; margin-bottom:10%; padding: 12px 20px; font-weight: normal; letter-spacing: 2px; background:none ;}
.honeymoonBigTitle h2::after { content: none; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }




.honeymoonBigTitle .honeymoonBigTitleText { position: relative; margin: 0 auto ; padding: 15px; max-width: 800px; background: rgba(0,0,0,0.8); }
.honeymoonBigTitle .honeymoonBigTitleText::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }
.honeymoonBigTitle .honeymoonBigTitleText h2 { margin-bottom: 10px; padding: 0; border-bottom: 1px solid #fff; background: none; }
.honeymoonBigTitle .honeymoonBigTitleText h2::after { display: none; }
.honeymoonBigTitle .honeymoonBigTitleText h2 small { display: block; font-size: 0.6em; letter-spacing: 2px; }



.bgBlue2.honeymoonBigTitle{background-size:5px 5px; padding: 5% 0 5 0;}
/*.honeymoonBigTitle.part2 h2{background: #FFF;color:#457cce;font-weight: bold;margin-bottom:4%;}
.honeymoonBigTitle.part2 h2::after {border: 1px solid #457cce;}*/
.honeymoonBigTitle.part2 {padding: 3% 0 5% 0;}
.honeymoonBigTitle.part2 h2{background: none;color:#FFF;font-weight: bold;margin-bottom:2%;}
.honeymoonBigTitle.part2 h2 img{transform: translate(-9px,0px);}
.honeymoonBigTitle.part2 h2::after {border: 1px solid #457cce;}
.honeymoonBigTitle.part3 .width1 > h2{background:rgb(60 112 190 / 90%) ;font-weight: bold;  }
.honeymoonBigTitle.part3 .width1 > h2:after{ content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height: calc(100% - 10px); border:1px solid rgba(255,255,255,0.5); }




.bgBlue2.honeymoonpart4 {padding: 75px 0 75px 0;}

/*.bg-honeymoon-3 .clubmedBox4 .aBox-img::after {content: ""; position: absolute; top:0; left: 0; width: 100%; height: 100%; background: rgb(20 79 167 / 80%); z-index: 1; transition: .5s;}*/
.whiteBg.blue .box3.text h2{color:#457cce;}



/*親子*/
.familyInfor { margin:0 auto; padding: 5%; max-width: 1400px; }
.familyInfor-text { position: relative; padding: 30px; width: 100%; max-width: 480px; background:rgb(60 112 190 / 90%); }
.familyInfor-text::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height: calc(100% - 10px); border:1px solid rgba(255,255,255,0.5); }
.familyInfor-text h2 { }

.familyBigTitle { padding: 10% 0; height: auto; text-align: center; background-size: 100% auto ;}
.familyBigTitle h2 { position: relative; display: inline-block; margin-bottom:10%; padding: 12px 20px; font-weight: bold; letter-spacing: 2px; background: rgba(0,0,0,0.8) }
.familyBigTitle h2::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }

.familyBigTitle .familyBigTitleText { position: relative; margin: 0 auto ; padding: 30px; max-width: 800px; background:rgb(60 112 190 / 90%) ; }
.familyBigTitle .familyBigTitleText::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }
.familyBigTitle .familyBigTitleText h2 { margin-bottom: 10px; padding: 0;/* border-bottom: 1px solid #fff;*/ background: none; }
.familyBigTitle .familyBigTitleText h2::after { display: none; }
.familyBigTitle .familyBigTitleText h2 small { display: block; font-size: 0.6em; letter-spacing:2px;background:#FFF ;color: #457cce;font-weight: normal;}



/*暑假*/
.summerInfor { margin:0 auto; padding: 5%; max-width: 1400px; }
.summerInfor-text { position: relative; padding: 20px; width: 100%; max-width: 480px; background:rgb(60 112 190 / 90%) ; }
/*
.summerInfor-text::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height: calc(100% - 10px); border:1px solid rgba(255,255,255,0.5); }
*/
.summerInfor-text h2 { margin-bottom: 0; }

.summerBigTitle { padding: 10% 0; height: auto; text-align: center; background-size: 100% auto ;}
.summerBigTitle h2 { position: relative; display: inline-block; margin-bottom:10%; padding: 12px 20px; font-weight: bold; letter-spacing: 2px; background: rgba(0,0,0,0.8) }
.summerBigTitle h2::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }

.summerBigTitle .summerBigTitleText { position: relative; margin: 0 auto ; padding: 20px; max-width: 800px; background:rgb(60 112 190 / 90%) ; }
.summerBigTitle .summerBigTitleText::after { content: none; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }
.summerBigTitle .summerBigTitleText h2 { margin-bottom: 10px; padding: 0; border-bottom: 1px solid #fff; background: none; }
.summerBigTitle .summerBigTitleText h2::after { display: none; }
.summerBigTitle .summerBigTitleText h2 small { display: block; font-size: 0.6em; letter-spacing:2px;background:#FFF ;color: #457cce;font-weight: normal;padding: 0 5px;}


.summerInfor-text:after{ content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }
.summerBigTitleText:after{ content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }
.summerBigTitle .summerBigTitleText:after{ content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }



.summerPromo{text-align: center;}
.summerPromo h3 { margin: 10px auto; }
.summerPromo a { display: inline-block; margin:3px 5px; padding: 5px 8px; border-radius: 99em; color: #000; background: #ffd350; }

.summerInforBase { padding: 3% 0; background-size: 100% auto;}
.summerInforBase .roundImgLine { border:none; }
.summerInforBase .roundText { background: rgba(0,0,0,0.8) }
.summerInforBase .honeymoonBigTitleText { margin-bottom:40px; }


.summerBoxBase {  }
.summerBoxBase .summerBoxBase-area { display: inline-block; padding: 0 10px; width: 33.333333%; }
.summerBoxBase .summerBoxBase-area:nth-child(1) { margin-bottom: 30px;  }
.summerBoxBase .summerBoxBase-area img { width: 100%; }
.summerBoxBase-area .summerText { margin: 0 auto; padding: 15px; width: 90%; transform: translateY(-10px); background: rgba(255,255,255,1); }
.summerBoxBase-area .summerText h3{color:#577cce;}
.summerBoxBase-area .summerText p{color:#000;margin-top: 5px;}
.bgBlue2.summerInforBase{background-size:5px 5px;}


/*團體旅遊*/
.groupInfor { margin:0 auto; padding: 0%;  }
.groupInfor-text { position: relative; padding: 20px; width: 100%; max-width: 480px; background: rgba(0,0,0,0.8); }
.groupInfor-text::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height: calc(100% - 10px); border:1px solid rgba(255,255,255,0.5); }
.groupInfor-text h2 { margin-bottom: 0; }

.groupBoxBase {  }
.groupBoxBase .groupBoxBase-area { display: inline-block; padding: 0 10px; width: 25%; }
.groupBoxBase.box3 .groupBoxBase-area { display: inline-block; padding: 0 10px; width: 33.333333%; }
.groupBoxBase .groupBoxBase-area:nth-child(1) { margin-bottom: 30px;  }
.groupBoxBase .groupBoxBase-area img { width: 100%; }
.groupBoxBase-area .groupText { margin: 0 auto; padding: 26px; width: 90%; transform: translateY(-10px); background: #FFF; }

.groupBigTitle.bgYellowLine{background-size:5px 5px;}
.groupBigTitle.bgBlue2 {background-size:5px 5px;}


.groupBigTitle { padding: 1% 0 3% 0; height: auto; text-align: center; background-size: cover;background-attachment:scroll;}
.groupBigTitle h2 { position: relative; display: inline-block; margin-bottom:10%; padding: 12px 20px; font-weight: normal; letter-spacing: 2px;  background: rgba(0,0,0,0.8) }
.groupBigTitle h2::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }

.groupBigTitle .groupBigTitleText { position: relative; margin: 3% auto 3% auto; padding: 20px 30px; max-width: 800px; background: #457cce ;display: block;}
.groupBigTitle .groupBigTitleText::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid rgba(255,255,255,0.5); z-index: 2; }
.groupBigTitle .groupBigTitleText h2 { margin-bottom: 10px; padding: 0;/* border-bottom: 1px solid #fff;*/ font-weight: bold; background: none; }
.groupBigTitle .groupBigTitleText h2::after { display: none; }
.groupBigTitle .groupBigTitleText h2 small { display: block; font-size: 0.6em; letter-spacing: 2px;background: #457cce;color:#FFF;padding: 0 5px;}

.groupBigTitle.part4 h2 img{transform: translate(-9px,0px);}
.groupBigTitle.part4 div .groupBigTitleText::after{content: none;}
.groupBigTitle.part4 div .groupBigTitleText{background: none;padding: 0;}
.bgBlue2.groupBigTitle.part4 h2 {color:#FFF;}

.bgYellowLine.groupBigTitle .groupBigTitleText h2 small {color: #457cce;background:#FFF;}

.bgBlue2.groupBigTitle .groupBigTitleText {background: #FFF;}
.bgBlue2.groupBigTitle h2 {color:#457cce;/*border-bottom: 1px solid #3c70be;*/}
.bgBlue2.groupBigTitle p {color:#457cce;}
.bgBlue2.groupBigTitle .groupBigTitleText::after { content: ""; position: absolute; top:5px; left: 5px; width: calc(100% - 10px); height:calc(100% - 10px); border: 1px solid #457cce; z-index: 2; }




.groupBoxBase-area .groupText h3{color:#457cce;}
.groupBoxBase-area .groupText p{color:#000;}
.groupList { margin:0 auto; padding-top: 20px; max-width: 700px; box-shadow: 0 10px 10px rgba(0,0,0,0.1); background:#fff ;/* background:url(../images/groups_title.jpg) top right no-repeat; */}
.groupList .text {  margin-bottom: 10px;  text-align: center; }
.groupList h2 { margin-bottom: 10px; color: #457cce; text-shadow: 0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff;}
.groupList small {  text-shadow: 0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff; }

.groupList .btnBox { margin-bottom: 10px; text-align: center; }
.groupList .btnBox a { padding: 5px 10px; color: #fff; border-radius: 99em;  background:#457cce;box-shadow: 0 3px 5px rgba(0,0,0,0.2);  }
.groupList iframe { /*min-height: 110vh;*/ }




/*最新優混*/
.newSale-aBox { position: relative; margin-bottom: 60px; padding: 10px; box-shadow: 0 5px 10px rgba(0,0,0,0.2); background:#fff; letter-spacing: -0.31em;*letter-spacing: normal;  *word-spacing: -0.43em; text-rendering: optimizespeed; }
.newSale-aBox h2 { position: absolute; top:0; left: 0; display: inline-block; padding: 5px 10px; font-size: 20px; font-weight: normal; background:#457cce; border-radius: 0 0 10px 10px;   }
.newSale-photo { display: inline-block; width: 40%; letter-spacing: normal; }
.newSale-photo img { width: 100%; }
.newSale-text { display: inline-block; padding: 10px; width: 60%;   letter-spacing: normal;}
.newSale-text h3 { text-align: left; color: #457cce; }
.newSale-text ul li { margin-bottom: 5px; padding: 5px 10px; font:14px/1.4 "arial","微軟正黑體"; color: #fff; border-radius: 10px; background: #FF8E45;  }
.newSale-text p { color: #000; }

.newSale-text .price { display: block; width: 100%; text-align: right; }
.newSale-text .price span { font:24px/1 "arial","微軟正黑體"; color: #457cce; letter-spacing: normal; }
.newSale-text .price span small { display: inline-block; font-size: 14px; vertical-align: bottom; transform: translateY(-3px); }



.youtube { position: relative; cursor: pointer; }
.youtube::before { content: "";position: absolute; top: calc(50% - 45px); left: calc(50% - 45px); width: 90px; height: 90px; border-radius: 99em; z-index: 10; transition: .5s; 
transform: rotate(0deg); border: 3px solid #FF8E45; background: url(../images/youtube.png) center no-repeat rgba(255,255,255,0.8); }
.youtube::after {content: "";position: absolute; top: calc(50% - 20px); left: calc(50% - 10px); border-color: transparent transparent transparent #457cce;border-style: solid solid solid solid;border-width: 20px;z-index: 11;  height: 0px;width: 0px;transform: scaleY(0.8);transition: .5s; 
}
.youtube:hover::before  {transform: scale(1.2);}
.youtube:hover::after  {transform: scaleY(1) scaleX(1.2);}





.videoGo{width: 100%;text-align: center;padding: 20px 0;}
.videoGo iframe {max-width: 1000px;width: 100%;}
@media only screen and (max-width: 1280px){
.videoGo iframe{width: 90%;margin: 0 auto;}
}

@media only screen and (max-width: 500px){

.videoGo iframe{margin: 30px auto;}
}
/*

.youtube { position: relative; cursor: pointer; }
.youtube::before { content: "";position: absolute; top: calc(50% - 45px); left: calc(50% - 45px); width: 90px; height: 90px; border-radius: 99em; z-index: 10; transition: .5s; 
transform: rotate(0deg); border: 3px solid #FF8E45; background: url(../images/youtube.png) center no-repeat rgba(255,255,255,0.8); }
.youtube:hover::before  {transform: scale(1.2);}
.playBase { display: none; position: fixed; top:0; left: 0; width: 100%; height: 100%; text-align: center; z-index: 5000; background:rgba(0,0,0,0.8); }
.closePlay { display: inline-block; margin-top:10px; padding: 8px 20px; font:20px/1 "微軟正黑體"; border-radius: 10px; background: #FF8E45; cursor: pointer; }
*/

.goOrder { display: none; position: fixed; bottom: 20%; left: 10%; padding: 5px; width: 80px; height: 80px; border-radius: 99em; background: #FF8E45; z-index: 10; cursor: pointer; 
animation: itemOne 0.6s alternate infinite;-webkit-animation: itemOne 0.6s alternate infinite; }
@keyframes itemOne {
  from { transform: translateY(20px);}
  to { transform: translateY(0px); }
}
@-webkit-keyframes itemOne {
  from { transform: translateY(20px);}
  to { transform: translateY(0px); }
}
.goOrder:hover p {transform: scale(1.3);}
.goOrder p { padding: 10px; font:20px / 1.2 "微軟正黑體"; text-align: center; color: #fff; border:1px solid #fff; border-radius: 99em;}



.tableOrder { margin: 0 auto; width: 90%; max-width: 500px; border-radius: 20px; text-align: center; background: #fff; 
	box-shadow: 0 5px 10px rgba(0,0,0,0.25); transition: .5s; }
.tableOrder a { display: block; padding: 20px 0px; width: 100%; font: bold 28px/1.4 "arial","微軟正黑體"; text-align: center;  color:#457cce;}
.tableOrder:hover { transform: translateY(-10px); }





@media only screen and (max-width: 1420px) {
.style1 .down{margin-top:0;}
}

@media only screen and (max-width: 1366px) {
h2 { margin-bottom: 5px; font: bold 28px/1.4 "arial","微軟正黑體";  }

header.header .pageMenu { padding-top: 0px; width: 100%; overflow: hidden;overflow-y: hidden; overflow-x:auto;-webkit-overflow-scrolling: touch;overflow-scrolling: touch;
	text-align: center; }
header.header .pageMenu ul { display:block;position:relative; padding:0 ; white-space:nowrap; width:auto;  }
header.header .pageMenu ul li{}
.item header.header .pageMenu { margin-bottom: 8vh }

.item header.header h1 { font-size: 120px; }

.boxBase > .box3.text { padding: 15px }


.clubmedBox4 .line { line-height: 900%; }
.clubmedBox4.box5 .line { line-height: 750%; }

.style1 .style1-text h2 {font-size: 40px;}

.honeymoonBoxBase .honeymoonBoxBase-area { padding: 0 4px; }
.honeymoonBigTitle { padding: 5% 0; height:auto; }
.honeymoonBigTitle h2 { margin-bottom:6%;} 



.familyBoxBase .familyBoxBase-area { padding: 0 4px; }
.familyBigTitle {padding: 10% 0;    height: auto;    background-size: auto;}
.familyBigTitle h2 { margin-bottom:6%;} 


.summerBoxBase .summerBoxBase-area { padding: 0 4px; }
.summerBigTitle { padding: 5% 0; height:auto; }
.summerBigTitle h2 { margin-bottom:6%;}


.groupBoxBase .groupBoxBase-area { padding: 0 4px; }
.groupBigTitle { padding: 5% 0; height:auto; }
.groupBigTitle h2 { margin-bottom:6%;} 
.groupBoxBase-area .groupText { padding: 15px; }
.groupBoxBase-area .groupText h3 { font-size: 22px; }



.goOrder { left: 0; }




.width1 .boxBase > .box3.box3new { width:80%;margin: 0 auto;display: block;}
.width1 .boxBase > .box3.box3newImg{width: 80%;margin: 0 auto;display: block;}


.style1 .down .style1-text.margintop50{margin-top:0;}




}


@media only screen and (max-width: 1280px) {
h2 { font: bold 30px/1.4 "arial","微軟正黑體"; }	
p,a { font:15px/1.8 "arial","微軟正黑體"; color: #fff; text-align: left; letter-spacing: normal; }

.clubmedBox1 .aBox a { letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
    *letter-spacing: normal; /* reset IE < 8 */
    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */  }
.clubmedBox1 .aBox .aBox-img { display: inline-block;width: 70%;transform: translateX(0); }
.clubmedBox1 .aBox-text { width: 30%;transform: translate(0,0); }



}

@media only screen and (max-width: 1024px) {
.clubmedBox4 .line { line-height: 700%; }

.style1 .down { margin-top: 20px; }
.style1 .down .style1-text { margin-top: 20px; }

.groupBoxBase .groupBoxBase-area,
.groupBoxBase.box3 .groupBoxBase-area {margin: 5% 0; padding: 5px; width: 50%  }
.groupBoxBase.box3 .groupBoxBase-area:last-child { width: 100%; }
.groupBoxBase.box3 .groupBoxBase-area:last-child .groupImgLine { display: inline-block; width: 49%; }
.groupBoxBase.box3 .groupBoxBase-area:last-child .groupText { display: inline-block; width: 49%; transform: translate(-5%,5%); }



/*最新優惠*/
.newSale-aBox h2 { position: static; display: block; margin: 0; width: 100%; border-radius: 0; text-align: center; }
}

@media only screen and (max-width: 800px) {
p,a { font:14px/1.6 "arial","微軟正黑體";  letter-spacing: 2px; }
h3  {  font:bold 20px/1.4 "arial","微軟正黑體";  }


/*
header.header.bgDefault { background-size: auto 100%;  }
header.header.cherating {  background-size: auto 100%;  } 
header.header.kabira {background-size: auto 100%;  } 
header.header.sanya {background-size: auto 100%;} 
*/
.width1 .boxBase > .box3.box3new { width:100%;margin: 0 auto;display: block;}
.width1 .boxBase > .box3.box3newImg{width: 100%;margin: 0 auto;display: block;}



header.header h1 svg { margin: 0 auto 15px auto; width: 90%; max-width: 500px; }
header.header h1 .h1Content { margin-bottom:60px;   }
header.header .pageMenu { margin-bottom: 15vh;  }

.item header.header h1 svg { width: 180px; }
.item header.header h1 {     font: bold 100px/1 arial, 微軟正黑體; }
.item header.header h1 small { font-size: 26px;}
.item header.header h1 span { font-size: 18px; }


.boxBase .smallHidden { display: none; }
.boxBase > .box3 { width: 50%; }
.boxBase > .box3.text img { display: block; margin: 0 auto; max-width: 30px }
.boxBase > .box3.text img { display: none; }

.roundBoxBase { text-align: left; }
.roundBoxBase-area { display: inline-block; margin-bottom: 5%; margin-right: 1%; padding: 0%; width: 49%; letter-spacing: -0.31em; *letter-spacing: normal;
    *word-spacing: -0.43em; text-rendering: optimizespeed;}
.roundBoxBase-area:nth-child(even) { margin-left: 1%;  margin-right: 0%;  }   
.roundBoxBase-area .roundImgLine { display: inline-block; width: 40%; }
.roundBoxBase-area .roundText { display: inline-block; padding-left: 10px; width: 60%; }


.roundBoxBase.box3 .roundBoxBase-area { padding: 0; margin: 0 0.5%; width: 49%; }



.hotBase .hot-infor-text,
.hotBase .hot-infor-photo
    {width: 100%;}
.hotBase .hot-infor-text { padding: 5% 0; }


.clubmedBox4 .aBox { padding: 1%; }
.clubmedBox4 .aBox-img::after { display: none; }
.clubmedBox4 .aBox-text { position: static; top: 0; left: 0; width: 100%; height: auto; text-align: center; }
.clubmedBox4 .line,
.clubmedBox4.box5 .line { border:none;padding: 0px; line-height: 1; }
.clubmedBox4 .line span { display: none; }
.clubmedBox4 .aBox-text h3 { display: block; width: 100%; height: auto; background: rgba(0,0,0,0.8) }


.clubmedBox1 .aBox { position: relative; display: block; padding: 0.75%; width: 100% }
.clubmedBox1 .aBox .aBox-img { display: inline-block;width: 100%;  }
.clubmedBox1 .aBox-text {  width: 100%; }
.clubmedBox1 .line { padding: 0; border:none;}
.clubmedBox1 h3 { padding: 7px; font-size: 20px;  }



.style1 .style1-text { ; padding-right: 0%; width:100%;  }
.style1 .style1-img { display: inline-block; margin-top: 3%; width:100%; letter-spacing: normal;  }
.style1 .style1-text h2 { padding-left: 0px ;font-size: 32px; text-align: center; }
.style1 .style1-text h3 { margin-top: 10px; color: #457cce; text-align: center; }
.style1 .style1-text p { margin-top: 5px; color: #000; }


.style1 .down { margin-top: 0px; }
.style1 .down .style1-text { margin-top: 0px; padding-right: 0; padding-left: 0%;}
.style1 .down .style1-text h2 {  text-align:  center;margin-top: 20px; }
.style1 .down .style1-text h3 {  text-align:  center; }
.style1 .down .style1-text p { text-align: left ;}


.style2 .style2-aBox {  margin: 0.5% 0.5% 1% 0.5%; padding: 1% 1% 0 1%; width: 49%; min-height: 30vw; }





/*蜜月*/
.honeymoonBoxBase .honeymoonBoxBase-area { padding: 5px; width: 33.333333%  }
.honeymoonBoxBase .honeymoonBoxBase-area:nth-child(1) { margin-bottom: 0; }


/*親子*/
.familyBigTitle {padding: 15% 0;    height: auto;    background-size: auto;}


/*暑假*/
.summerBoxBase .summerBoxBase-area { padding: 5px; width: 33.333333%  }
.summerBoxBase .summerBoxBase-area:nth-child(1) { margin-bottom: 0; }


/*團體企業*/

.groupBoxBase .groupBoxBase-area:nth-child(1) { margin-bottom: 0; }



}

@media only screen and (max-width: 768px) {
header.header { min-height: 30vh; }
header.header h1 { padding-top: 10vh;  }

header.header .pageMenu { position: fixed; top:-100vh; left: 0; width: 100%; height: 100vh; margin-bottom: 0px; padding-top:0px; padding: 10vh 10px 0 10px; text-align:center; 
  z-index: 2; background: rgba(38,120,220,0.9); z-index: -1; transition: .8s; }
header.header .pageMenu ul { display: block; padding:0; background: none; }
header.header .pageMenu li { display:block; padding: 10px; text-align: center; border-bottom:1px solid rgba(255,255,255,0.7);}
 header.header .pageMenu li a,
header.header .pageMenu li p { font-size: 20px; text-align: center; }
header.header .pageMenu.show { top:0;z-index: 20;}

.hasSecButton { position: relative; }
.hasSecButton .secButton {display: none; position: static;  padding: 5px 0; width: 100%; }
.hasSecButton .secButton a { padding: 0; }

.hasSecButton .pc { display:none !important;}
.hasSecButton .mobile { display: block; }

.clubmedBox4 .aBox-img { opacity: 1 ;}

.mobile-nav-control { display: none; position: fixed;bottom: 10px; right: 10px; width: 60px; height: 60px; background:#ffc400 ; border-radius: 99em;
 z-index: 25; }
.mobile-nav-control ul { margin:5px; width: 50px; height: 50px; border: 1px solid #fff; border-radius: 99em; }
.mobile-nav-control ul li { margin: 10px auto 0 auto; width: 70%; height: 2px; background: #fff; transition: .5s; }
.mobile-nav-control.now ul li:first-child { transform: translateY(12px) rotate(45deg); }
.mobile-nav-control.now ul li:last-child { transform: translateY(-12px) rotate(-45deg); }
.mobile-nav-control.now ul li:nth-child(2) { opacity: 0 }


.goOrder { bottom:10px; left: 0; width: calc( 100% - 80px); padding: 5px; height: auto; z-index: 20; animation:none;-webkit-animation:none; }

.goOrder span { display: none; }
}




@media only screen and (max-width: 500px) {

.width1 .boxBase > .box3.box3new {padding: 30px;}
.width1 .boxBase > .box3.box3new h2 {font:bold 25px/1.8 "arial","微軟正黑體";}
.width1 .boxBase > .box3.box3new strong{ margin: 0 auto;  display: block;  text-align: center;}

h2 { margin-bottom: 0; }
header.header { padding: 10vh 0; }
.content { padding: 10% 0 10% 0;}
header.header .pageMenu ul li img { display: none; }
header.header.cherating { background-position-x: 30%;  } 
header.header.sanya { background-position-x: 35%;}



.item header.header h1 .h1Content { margin-bottom: 10%; }
.item header.header h1 svg { width: 200px; }
.item header.header h1 { margin-top: 0; padding-top: 0; font: bold 60px/1 arial, 微軟正黑體; }
.item header.header h1 small {margin-top: 5%; font-size: 24px }

.tip { margin: 0; width: 24%; }

.searchBase { margin-bottom: 10%;}
.searchBase-bar {    padding: 10px 10px 10px 15px; height: auto; }	
.searchBase-bar-input,
.searchBase-bar-send { display:block; width: 100%; }
.searchBase-bar-send { margin-top: 15px; }

.boxBase > .box3 { width: 100%; }


.arrowRight::after,.arrowLeft::after  {display: none;}


.roundBoxBase-area { display: inline-block; margin-bottom: 5%; margin-right: 0%; padding: 0%; width: 100%; }
.roundBoxBase-area:nth-child(even) { margin-left: 0%;   }   
.roundBoxBase-area .roundImgLine { display: inline-block; width: 40%; }
.roundBoxBase-area .roundText { display: inline-block; padding-left: 10px; width: 60%; }

.roundBoxBase.box3 .roundBoxBase-area { padding: 0 5%; margin: 0 0 5% 0; width: 100%; }
.roundBoxBase.box3 .roundBoxBase-area .roundImgLine { display: inline-block; width: 100%; }
.roundBoxBase.box3 .roundBoxBase-area .roundText { display: inline-block; padding-left: 0px; width: 100%; }


.newsBase .newsBase-text { padding: 5%; width: 100%;  }
.newsBase .newsBase-img { display: none; }
.newsBase .carrier li { margin-left: 0px;  }

.hotBase > .box2 > .a-box {  margin: 0 0 5% 0; width: 100%;  }

.clubmedInfor { margin: 0 0.75% 10% 0.75%; }
.clubmedBox4 .aBox ,
.clubmedBox4.box5 .aBox { margin-bottom: 0%; padding: 2%; width: 50% }


.style1 .style1-text h2 { margin-bottom: 0; font-size: 26px;    border-radius: 99em;  }
.style1 .style1-text p { margin-bottom: 10px; }
.style1 .down .style1-text h2 { margin-top: 20px; }

.style2 .style2-aBox {  margin: 0 0 10% 0; padding: 1% 1% 0 1%; width: 100%; }





.maskWhite { /*background: rgba(255,255,255,0.6);*/ }
.maskWhite { position: relative; }
.maskWhite::before { content: ""; position: absolute; top:0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.8); z-index: 1; }
.maskWhite > * { position: relative; z-index: 3; }



/*蜜月*/
.honeymoonBigTitle { height: auto;   }
.honeymoonBigTitle.part2 h2 { margin-bottom:8%; }
.honeymoonBigTitle .honeymoonBigTitleText::after { display: none;}
.honeymoonBoxBase .honeymoonBoxBase-area { display: block; padding: 0; margin-bottom: 5% !important; width: 100%; }
.content.bgYellowLine.honeymoonpart1{padding: 10% 0;}



.familyBigTitle { height: auto; background-size: auto ;  }
.familyBigTitle h2 { margin-bottom:15%; }
.familyBigTitle .honeymoonBigTitleText::after { display: none;}



.newOffer .ph { margin-bottom: 20%; }
.summerBoxBase .summerBoxBase-area { display: block; padding: 0; margin-bottom: 5% !important; width: 100%;}
.summerPromo a {margin:5px;}
.summerPromo h3{margin:5px auto;}

/*團體旅遊*/
.groupBigTitle { height: auto;   }
.groupBigTitle h2 { margin-bottom:15%; }
.groupBigTitle .groupBigTitleText::after { display: none;}
.groupBoxBase.box3 .groupBoxBase-area ,
.groupBoxBase .groupBoxBase-area { display: block; padding: 0; margin-bottom: 10% !important; width: 100%; }
.groupBoxBase.box3 .groupBoxBase-area:last-child .groupImgLine { width: 100%; }
.groupBoxBase.box3 .groupBoxBase-area:last-child .groupText {    margin: 0 auto;padding: 15px; width: 90%; transform: translateY(-10px); background: rgba(0,0,0,0.8);}
.groupBoxBase-area .groupText{ box-shadow: 0 0 5px rgba(0,0,0,0.2);}
.groupBigTitle .groupBigTitleText {margin:3% auto 13% auto;}
.bgBlue2.groupBigTitle .groupBoxBase.box3 .groupBoxBase-area:last-child .groupText {background: #FFF;}
.bgYellowLine.groupBigTitle .groupBoxBase.box3 .groupBoxBase-area:last-child .groupText{background: #FFF;}

.groupList h2 { font-size: 24px;}
.bgBlue2.groupBigTitle.part4 h2{color:#457cce;}


.content.groupcontent{padding: 10% 0 2% 0;}



/*最新優惠*/
.newSale-aBox .newSale-photo,
.newSale-aBox .newSale-text { display: block; width: 100%; }


}




/*小動畫社訂*/
.headerAni { padding-top: 30px; text-align: center; }
.mouseContent { position: absolute; bottom: 0; left: 0; width: 100%; }
.mouseBase { display: inline-block; position: relative; margin: 10px 0 0 0; width: 30px; height: 60px; border:3px solid #fff ; box-shadow:0px 0px 10px rgba(0,0,0,0.5); border-radius: 99em; }
.mouseBase .mouseMov { display: inline-block; position: absolute; top: 8%; left:40%; width: 6px; height: 16px; box-shadow:0px 0px 10px rgba(0,0,0,0.5); border-radius: 99em; background: #fff;
-webkit-animation: mouseMov 1s  infinite alternate; }
@-webkit-keyframes mouseMov {
  from { top: 8%; }
  to { top: 30%; }
}

@media only screen and (max-width: 320px) {
header.header h1 span {  padding: 5px 20px; font:20px/1 "arial","微軟正黑體";letter-spacing: 0px;  }
}



.newOffer img{width: 100%;}


/*客製化*/


.poiAutoTemplate .ph-group
.poi{width: 90%;margin: 0 auto;}
.poiAutoTemplate .slidecontain{display: none;}
.poiAutoTemplate .ph-group-content{padding: 10px 10px 50px 10px;margin: 5px;} 
.poiAutoTemplate .ph-group-title span{margin: 0 auto; display: inline-block; text-align: center; padding: 0 25px; color: #FFF; font: 700 30px/1.4 'Noto Sans TC',"微軟正黑體"; position: relative;  }
.poiAutoTemplate .ph-group-title  img{display: none;}
.poiAutoTemplate .ph-group-content-text-name{color: #3c70be;font: 600 18px/1.4 'Noto Sans TC',"微軟正黑體";}
.poiAutoTemplate .ph-group-content-tag{background:#ffc74d;color: #000;font: 16px/1.2 'Noto Sans TC',"微軟正黑體";letter-spacing: 2px;}
.poiAutoTemplate  .ph-group-content-text-detail{font:16px/1.4 "微軟正黑體";}
.poiAutoTemplate  .ph-group-content-text-price{position: absolute;bottom: 0;text-align: center;left: 0;width: 100%;}
.poiAutoTemplate  .ph-group-content-text-price span{font: 14px/3 "微軟正黑體";}
.poiAutoTemplate .ph-group-content-text-sale  {display: block; padding: 0px 5px; font: 400 15px/1.4 'Noto Sans TC',"微軟正黑體"; color: black; background:#ffe49d; }
.poiAutoTemplate .ph-group-content-text-detail {display: block; padding: 5px 5px; font: 14px/1.8 'Noto Sans TC',"微軟正黑體"; color: black; }
.poiAutoTemplate .ph-group-content-text-sale a{ color: black; background: #ffdc36;padding: 0 5px;}

.poiAutoTemplate{position: relative;padding: 0 0 10px 0;}
.poiAutoTemplate .link-right{background:#daa55f;padding: 7px 29px 7px 15px;font:18px/1.4 "微軟正黑體";color: #FFF;text-align: center;display: inline-block;position: absolute;bottom: 0;right: 20px;clip-path: polygon(0 0, 86% 0, 100% 100%, 0% 100%);transition: 0.3s;}
.poiAutoTemplate .link-right::after{content: ">>" ;display: inline-block;font:10px/1 "微軟正黑體";transform:translateY(-5px);-webkit-animation: gogo 0.3s  infinite alternate;animation: gogo 0.3s  infinite alternate;}
.poiAutoTemplate .link-right:hover{padding: 7px 39px 7px 15px;color: #e8fe51;);transform: translateX(10px);}

.poiAutoTemplate .ph-group, .poiAutoTemplate.poiAutoTemplate-scrollTab .ph-group {justify-content: center;margin-bottom:0px;}




@media only screen and (max-width: 600px) {
.poiAutoTemplate .ph-group-title{font-size:22px;}
.poiAutoTemplate .ph-group-content-text-name{font-size: 18px;}
.poiAutoTemplate .link-right{bottom: 50px;}

}