body { min-width: 1150px; color: #000; font: 15px "Century Gothic", Arial, 'Microsoft JhengHei', "蘋果儷中黑", "儷黑 Pro", "新細明體", "sans-serif"; }
a { display: block; text-decoration: none;}
:focus { outline: none; }
i { font-style: normal; }
.header { margin:0 auto; width: 100%;}
.footer { margin: auto; width: 100%;}
.hd_pc { width: 100%;}
.hd_m, .M_menu_wrap { display: none; }
.pez_ft { height: 228px;}

.main { background: url(../images/bg.jpg) no-repeat top center; position: relative; width: 100%; z-index: 1; overflow: hidden; background-color: #fff3ea;}
.kv { width: 1050px; height: 450px; margin: auto; position: relative; }
.kv_slogan1 { position: absolute; left: 230px; top: 40px; z-index:1;}
.kv_slogan1a { position: absolute;  right: 46px; top: 73px; animation: mymove 1.5s linear infinite; -webkit-animation: mymove 1.5s linear infinite; z-index:2;}
.kv_m{ display: none;}

/*menu*/
.menu_wrapper{ width: 100%; background: #546fb4; box-shadow: inset 0px 3px 5px rgb(0 0 0 / 40%);}
.menu_main{ width: 620px; margin: 0 auto;}
.menu_main ul{ overflow: hidden;}
.menu_main li { float: left;  padding: 0 50px;  border-left: solid #849acb 1px;  border-right: solid #849acb 1px;  font-size: 28px;  font-weight: bold;  color: #fff;  line-height: 65px; position: relative;}
.menu_main li a {color: #fff;}
.menu_main li a:hover{ color: yellow}
.menu_main li i::before { content: "";  width: 51px;  height: 51px;  background: url("../images/menu_icon1.png")no-repeat;  display: inline-block;  position: relative;  top: 12px;  margin: 0 5px; }
.menu_main li i2::before { content: "";  width: 51px;  height: 51px;  background: url(../images/menu_icon2.png)no-repeat;  display: inline-block;  position: relative;  top: 12px;  margin: 0 5px; }
.menu_main li.active:after { content: '';  display: block; position: absolute;  bottom: 0; left: 36px; right: 0;  margin: auto; width: 0;  height: 0;  border-style: solid;  border-width: 0 12px 12px 12px; border-color: transparent transparent #f57c60 transparent; }

/*標題*/
.section-header {  margin-bottom: 10px; }
.section-title { font-size: 44px;  line-height: 55px;  font-weight: bold; color: #3e3e3e; }
.section-title i::before { content: "";  width: 38px;  height: 40px;  background: url(../images/title_icon.png)no-repeat;  display: inline-block;  position: relative;  top: 4px;  margin: 0 5px; }
.section-title i2::before { content: "";  width: 38px;  height: 40px;  background: url(../images/title_icon2.png)no-repeat;  display: inline-block;  position: relative;  top: 4px;  margin: 0 5px; }
.section-title span { background: linear-gradient(#fff 50%, #fff200); }
.section-desc {  font-size: 18px;line-height: 30px;font-weight: bold; color: #f75f5c;}

/*商品*/
.hotel_wrapper{ position: relative; background-size: 80%; border-top: 3px #deaf6d double; border-bottom: 3px #deaf6d double;}
.hotel_main{ width:1100px; margin:0 auto; overflow:hidden; padding: 30px 0; text-align: center; }
.hotel_product {width: 29.3%;height: 310px;position: relative; margin: 1%;  overflow:hidden;  border: 10px solid #fff; box-shadow: 0px 1px 4px rgb(0 0 0 / 40%);}
.hotel_img {width: 100%;height: 208px;position: relative;overflow: hidden; background-color: #fff;}
.hotel_img img {display: block;width: 100%;height: 100%;transition: all 1s;}
.hotel_img:hover img {-webkit-transform: scale(1.2, 1.2);-moz-transform: scale(1.2, 1.2);-ms-transform: scale(1.2, 1.2);-o-transform: scale(1.2, 1.2);transform: scale(1.2, 1.2);}
.hotel_detail { position: relative; height: 100px; background: #fff; }
.hotel_tit {width: 90%;margin:0 auto;font-size: 20px;line-height: 22px;font-weight: bold;color: #333; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; padding: 7px 0; }
.hotel_buy {  width: 150px;  height: 30px;  font-size: 17px;  font-weight: bold;  line-height: 30px;  text-align: center;   color: #fff;  background: #f54648;   margin: 5px auto; border-radius: 20px; }
.hotel_buy:hover {background: #448aca;}
.hotel_desc { color: #fff; font-size: 15px; line-height: 32px; font-weight: bold;  text-align: center;  background-image: linear-gradient(to right, #f5ad90 0%, #f39b77 100%); }

.foreign_money { color: #f77054;  font-size: 16px;  width: 100%; }
.foreign_money span {line-height: 36px;}
.foreign_money span.p_price{ font-size: 32px;  padding: 0 3px; }
.foreign_sign {font-size: 18px;}
.foreign_price {font-size: 30px;}
.hotel_product:hover { box-shadow: 0px 1px 4px rgb(245 70 72);}

/**more**/
.event_more {  margin: 15px 0 0;}
.event_more a {  display: block;  width: 25%;  border-radius: 30px;  text-align: center;  margin: 0 auto;  line-height: 45px;  font-size: 26px;  color: #FFF;  font-weight: bold;  background-color: #ff5d5f;  border-bottom: 5px #e40b0e solid; }
.event_more a:hover{ background-color: #448aca;    border-bottom: 5px #126fc4 solid;  }

/**float**/
.float_wrapper {  position: fixed;top: 100px; right: 0px; z-index: 250; display: none;}
.float_main {  }
.group_leftmenu { background: #f57c60; width: 122px; margin: auto;  }
.group_leftmenu li { position: relative;  text-align: center; font-size: 18px; }
.group_leftmenu li a {  color: #fff; font-weight: bold; border-bottom: 2px #ffcfc4 dotted; padding: 8px 0;  width: 100%; }
.group_leftmenu li.qa a{ background: #546fb4;}
.group_leftmenu li a.end{ border: none;}
.group_leftmenu li a:hover { color: yellow; }

/*kv-move*/
@keyframes mymove {
 0%, 100% {margin-left:0px;}
 50% {margin-top:5px;}
}

/*常見問題*/
.terms_wrapper { width: 100%; margin: 0 auto;  padding-bottom: 40px; background: #fff3eb;  padding-top: 30px;   border-top: 3px #deaf6d double;}
.terms_container { background-color: #fff;   border: solid 3px #f57c60;   border-radius: 50px;  width: 1150px;  margin: 0 auto;}
.terms_container h2 {  font-size: 30px;  font-weight: bold;  text-align: center;  background-color: #f57c60;  color: #fff;  border-radius: 45px 45px 0 0;  padding: 10px 0; }
.terms_container h3 {  background-color: #40a1c1;  border-radius: 20px;  font-size: 22px;  line-height: 30px;  font-weight: bold;  padding: 5px 20px;  display: inline-block;  margin: 20px 0 7px;  color: #fff;}
.terms_container p { padding-left: 18px; margin-bottom: 5px;}
.terms_content {  width: 90%;  margin: 0 auto 20px;  font-size: 17px;  line-height: 24px;}
.terms_content ol li { margin: 0 30px 5px 50px;  list-style-type: decimal;  }
.red{ color: tomato; font-weight: bold; font-size: 1.1em;}
.terms_wrapper a { display: inline; text-decoration: underline; color: #333; }

@media screen and (max-width:768px) {
body { width: 100vw; min-width: inherit; padding-bottom: 50px;}
* { box-sizing: border-box; }
.gotop { background: url(//www.payeasy.com.tw/168/img/icon_top.png) no-repeat;  height: 36px; position: fixed; right: 5px; width: 36px; bottom: 49px; z-index: 900;display: none;  }
.gotop a { display: block; width: 48px; height: 36px; }
.header { width: 100vw; }
.hd_pc, .footer { display: none; }
.hd_m { display: block; }
	
.main { background-size: 160vw; }
.kv{ width: 100vw; height: 37vw; }
.kv img { width:100%;}
.kv_slogan1 { left: 26vw;  top: 2vw;  width: 53vw; }
.kv_slogan1a {right: 26px;  top: 3.5vw; width: 25vw;}

.menu_wrapper{ display: none; }
	
.section-title {  font-size: 28px; line-height: 34px;  font-weight: bold; padding-top: 5px;}
.section-title i::before, .section-title i2::before{ width: 17px; height: 20px;  background-size: 100%;  top: 2px; margin: 0 6px 0 2px; }
.section-desc { font-size: 14px;  line-height: 16px; width: 80vw; margin: 0 auto; padding-top: 5px; }
.hotel_main{ width:100%;  padding: 10px 0; }
.hotel_desc {  font-size: 14px;   line-height: 17px;  padding: 3px 0; }
.hotel_desc span{ display: block; }
.hotel_tit_all {text-align: center; padding:0; overflow: hidden;}
.hotel_main img { width:100%;}
.hotel_product { width: 46%; height: auto;   margin-left: 2.7%;  margin-right: 0;  margin-bottom: 2.5%; box-shadow: none;   border: 3px solid #ececec;}
.hotel_img { height: 130px;}
.hotel_tit { line-height: 16px; font-size: 14px; height: 32px;}
.hotel_money { position: initial; font-size: 13px; margin-left: 0; height: 45px; }
.hotel_money span.price { font-size: 26px; line-height: 30px; }
.hotel_sign { font-size: 14px;}
.hotel_buy { position: inherit; bottom: 15px; margin: 0 auto; height: 28px; font-size: 15px; line-height: 28px;}
.hotel_detail { height: 90px; }
	
.foreign_money {  color: #f77054;  font-size: 14px;  width: 100%;}
.foreign_money span.p_price {  font-size: 27px;  padding: 0 3px;}
.foreign_money span {    line-height: 30px;}
	
/**more**/
.event_more {  margin: 5px 0;}
.event_more a {  width: 60%;  line-height: 42px;  font-size: 21px;  border-bottom: 3px #e40b0e solid; }
.event_more a:hover{ border-bottom: 3px #126fc4 solid;  }
	
.M_menu_wrap { position: fixed; bottom: 0; z-index: 200; display: block; font-size: 14px; }
.M_menu_block { width: 100vw; height: 50px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #555), color-stop(100%, #111));}
.M_menu_block ul { list-style: none; overflow: hidden; }
.M_menu_block li { float: left; width: 25vw; line-height: 33px; border-top: 1px solid #ccc; border-left: 1px solid #666; border-right: 1px solid #222;  padding-top: 0; text-align: center; padding: 8px 0;}
.M_menu_block li a { color: #fff; }
	
.terms_wrapper {  width: 100vw;  padding-bottom: 1px;  padding-top: 10px; box-shadow: none;}
.terms_container {  border-radius: 30px; margin: 0 auto 20px; width: 96vw;}
.terms_container h2 {  font-size: 21px;  line-height: 24px;  border-radius: 25px 25px 0 0;  padding: 7px 0;  margin-bottom: 3px; }
.terms_container h3 {  font-size: 16px;  line-height: 20px; margin: 10px 0 7px; border-radius: 50px;}
.terms_container p { padding-left: 5px; }
.terms_content {  width: 94%; font-size: 15px; line-height: 18px;}
.terms_content ol li {  margin: 4px 0 0 25px; }
.red { font-size: 1em;}
}

