/* CSS Document */
@charset "UTF-8";
/************************************************************************************
RESET
*************************************************************************************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, figure, mark{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    text-transform:uppercase
}
body {line-height: 1; -webkit-text-size-adjust: none;}
ol, ul { list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}
/* remember to define focus styles! */
:focus {outline: 0;}
/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table {
   /* border-collapse: collapse;*/
    border-spacing: 0;
}
a img {border: none;}
.clean { clear:both;}
a {color: #292929; text-decoration: none; blr:expression(this.onFocus=this.blur()); outline: none; /* for Firefox */hlbr:expression(this.onFocus=this.blur()); /* for IE */}
a:hover {text-decoration:none;}
a:focus{ -moz-outline-style: none;}

body{margin: 0px;padding: 0px;font-family: var(--family-normal);}

/*ÁãÂI*/
.block-first{overflow: hidden;padding-top: 150px;margin-top: -150px;}
.block-first1{overflow: hidden;padding-top: 120px;margin-top: -120px;}
/*°ò¥»ÃC¦âÅܼÆ*/
:root {
	--white-color:#ffffff;
	--bk-color:#000000;
	--yellow-color:#fee1a3;
	--family-normal:'Poppins', 'Noto Sans TC', sans-serif;
	--family-ny:tt-zhihei-chs-variable, sans-serif;
}


.block-center{
	max-width: 1400px;
	margin: 0 auto;
}

.block-center2{
	max-width: 1300px;
	margin: 0 auto;
}

.block-center3{
	max-width: 1000px;
	margin: 0 auto;
}

header {
  background: url("../images/bg.webp") center top no-repeat;
  height: 630px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.kv-wrap {
  width: 960px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
  transform-origin: top center;
  transition: transform 0.3s ease;
  font-size: 16px; 
}


.kv-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  font-size: 16px;
}

.main-title {
  font-size: 60px;
  color: #edd876;
  font-family: var(--family-ny);
  font-weight: 200;
  text-align: center;
}

.newyear figure,
.calendar figure {
  width: 12em;
  max-width: 100%;
}

.newyear img,
.calendar img {
  width: 100%;
  height: auto;
  display: block;
}


.kv-horse {
  flex-shrink: 0;
}

.kv-horse figure {
  width: 360px; 
}

.kv-horse img {
  width: 100%;
  height: auto;
  display: block;
}

.calendar {
  position: relative;
  z-index: 1; 
}

.calendar::before {
  content: '';
  position: absolute;
  background: url("../images/cloud.png") no-repeat;
  background-size: contain;
  width: 183px;
  height: 34px;
  right: -80px;
  top: -10px;
  z-index: 0;
}

.kv-mobile {
  display: none;
}

.kv-mobile img {
  width: 100%;
  height: auto;
  display: block;
}

/*==nav CSS=====*/

#main-nav{
   z-index: 990;
}

#block_menu {
	width: 100%;
	text-align: center;
    font-family: var(--family-normal);
    font-weight: 600;
    overflow: hidden;
}
#block_menu.sticky {
  position: fixed;
  top: 0;
  z-index: 999;
  width: 100%;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}



#block_menu {
  position: relative;
  z-index: 999;
  background: #fff;
}
#block_menu.sticky {
  position: fixed;
  top: 40px; 
  width: 100%;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}


.class-nav ul{background:#ff7800;height: 70px;display: flex;align-items: center;justify-content: center;gap:20px;}
.class-nav li{ display:inline-block; font: 500 20px 'Noto Sans TC', serif;letter-spacing: 1px;}
.class-nav li.menu-title{font-size: 18px; color: var(--white-color);background: url("../images/menu-bg.png");width: 60px;height: 60px;line-height: 60px;}
.menu-title-second { margin-left: 20px;}
.class-nav li a { 
  display:block;
	width:100%;
	height: 50px;
	text-align: center;
	text-decoration: none; 
  color:var(--yellow-color);
	padding: 20px 5px 0 5px;}
.class-nav li a:hover{ font-weight: 600;background: #E76C00;}
.class-nav li a.active { background:var(--yellow-color);font-weight: 600;color: var(--bk-color);}

/*.navbar-nav {background:var(--yellow-color);width: 100%; margin:0 auto; height: 45px;padding-top:15px;}*/
.navbar-nav {background:var(--yellow-color);width: 100%; margin:0 auto; height: auto;padding-top:15px;padding-bottom: 15px;}
.navbar-nav li {display:inline-block; font: 400 16px 'Noto Sans TC', serif;color:var(--white-color); margin: 0 4px;}
.navbar-nav li a { display:block; width:100%; height:100%; text-align: center; text-decoration: none; color:#954300;  padding:3px 4px; }
.navbar-nav li a:hover,.navbar-nav li a.active { background: #ff7e00;color: var(--white-color); border-radius: 30px; }

#block_menu.sticky {
  position: fixed;
  width: 100%;
  z-index: 999;
}


#block_menu.sticky {
  position: fixed;
  top: 40px; 
  left: 0;
  width: 100%;
  z-index: 9999;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}


.title {
    height: 87px;
    text-align: center;
    padding-top: 50px;
    font-size: 30px;
    color: #ac2630;
    background: url("../images/title-3.webp") center top no-repeat;
	  margin-bottom: 60px;
}

.title span {
    display: block;
    font-size: 12px;
    margin-top: 5px;
}

/* === ³æ¼Æ section ¼Ð·Ç¼Ë¦¡ === */
section:nth-child(odd) {
    min-height: 500px;
    padding-top: 100px;
    padding-bottom: 160px;
    position: relative;
    background: url("../images/bg1.webp") center -70px repeat, #fef3e0;
}

section:nth-child(odd)::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 9px;
    top: -9px;
    background: url("../images/line1.png");
}

section:nth-child(odd) .title {
    background: url("../images/title-3.webp") center top no-repeat;
}

/* === °¸¼Æ section ¼Ð·Ç¼Ë¦¡ === */
section:nth-child(even) {
    min-height: 500px;
    padding-top: 100px;
    padding-bottom: 160px;
    position: relative;
    background: url("../images/bg2.webp") center 70px repeat, #ffe9c3;
}

section:nth-child(even)::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 9px;
    top: -9px;
    background: url("../images/line2.png");
}

section:nth-child(even) .title {
    background: url("../images/title-2.webp") center top no-repeat;
}

/* === ²Ä¤@­Ó section ¯S§O³B²z === */
section:first-of-type{
	padding-top: 120px;
}

section:first-of-type::before {
    content: none;
}

section:first-of-type .title {
    background: url("../images/title-1.webp") center top no-repeat;
}

/*¬K¸`Àu´f*/
.discount-wrap {
  width: 95%;
  max-width: 880px;
  margin: 0 auto;
  padding-bottom: 80px;
}

.bag{
	width: 100%;
	height: 150px;
	background: #ff1929;
	margin-bottom: 30px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
	gap:10px;
	padding: 20px;
	box-sizing: border-box;
}

.bag::after{
	content: '';
	position: absolute;
	background: url("../images/frame.png");
	width: 29px;
	height: 29px;
	top: 10px;
	left: 10px;
}

.bag::before{
	content: '';
	position: absolute;
	background: url("../images/frame.png");
	transform: rotate(180deg);
	width: 29px;
	height: 29px;
	right: 10px;
	bottom: 10px;
}

.bag-name{
	min-width: 300px;
	text-align: right;
	font-family: var(--family-ny);
	color: #ffefae;
	font-size: 26px;
	position:relative;
}

.bag-name::before{
	content: '';
	position: absolute;
    background: url("../images/bag.png") no-repeat center / contain;
    aspect-ratio: 67 / 68;
	width: 67px;
	height: 68px;
	top: -30px;
	left: 20px;
}

.bag-name span{
	display: block;
}

.bag-line{
	background: url("../images/gift-line.png");
	width: 8px;
	height: 49px;
}

.bag-info{
	font-size: 18px;
	color: var(--white-color);
	padding-left: 20px;
	letter-spacing: 1px;
	line-height: 34px;
	text-align: center;
}

.sale-title{
  border: solid 1px;
  padding: 1px 5px;
  margin-right: 5px;
  border-radius: 5px 0 5px 0;
}


.bag-info .bag-price{
	color: #ffe156;
}

.bag-info strong{
	color: #ffe156;
}

.bag-info em{
	display: inline-block;
	border: solid 2px #FFFFFF;
	border-radius: 50%;
	height: 24px;
  line-height: 24px;
	width: 24px;
	margin: 0 3px 0 1px;
	font-style: normal;
  padding: 1px;
  text-align: center;
}

.bag-info strong{font-size: 24px;}


/*¯S§O±ÀÂË*/
.special-wrap{
	display: flex;
	position: relative;
	align-items: stretch;
}

.special-item{
	background: var(--white-color);
	padding: 20px;
	box-sizing: border-box;
	position: relative;
	margin: 10px;
}

.special-pic{aspect-ratio: 3 / 2;}

.special-pic img{width: 100%;}

.special-tab{
	position: absolute;
	background: #e8b864;
	color: var(--white-color);
	padding: 10px;
	font-size: 18px;
	border-radius: 0 0 20px 0;
	top: -20px;
	left: -20px;
}

.special-txt{
	display: flex;
	flex-direction: column;
	gap:10px;
	margin-top: 10px;
	flex: 1;
	justify-content: space-between;
}

.special-name{
	font-size: 20px;
	font-weight: 600;
	line-height: 26px;
	border-bottom: solid 2px #ffe2af;
	padding-bottom: 10px;
}


.special-info{padding-left: 20px;font-size: 16px;min-height: 120px;}

.special-info li{
	position: relative;
	margin-bottom: 8px;
	line-height: 22px;
}

.special-info li::before{
	content: '';
	position: absolute;
	background: url("../images/info-icon.png");
	width: 12px;
	height: 12px;
	left: -20px;
	top: 5px;
}

.special-name span{
	color: #ff5400;
}

.special-price{text-align: center;}

.special-price strong{
	color: #ff0c00;
	font-size: 32px;
}


.special-wrap {
	width: 100%;
	clear: both;
}

.special-wrap {
	position: relative;
}


/* Åý slick ¾ã­Ó¦³¨¬°÷ªÅ¶¡©ñ dots */
.special-wrap {
  position: relative;
  padding-bottom: 50px; /* ?™å‡º dots 空é? */
}

/* Dots ¼Ë¦¡ */
.slick-dots {
  position: absolute;
  bottom: 10px;
  width: 100%;
  left: 0;
  transform: none;
  display: flex !important;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin: 0;
  list-style: none;
}

.slick-dots li {
  margin: 0 5px;
}

.slick-dots button {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: none;
  background: #ccc;
  cursor: pointer;
  padding: 0;
  font-size: 0;
}

.slick-dots .slick-active button {
  background: #ff6600; 
}


/*¥D±À¦æµ{*/


.promo{
    border-radius: 30px 0 30px 0;
    text-decoration: none; 
    color: inherit; /*«O¯d¤å¦rÃC¦â*/
	position: relative;
}

.promo-pic{
	width: 45%;
}



.promo-city{
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 1;
	background: #e8b864;
	padding: 15px 20px;
	color: var(--white-color);
	font-size: 20px;
	border-radius: 25px 0 10px 0;
}

.promo a {
    display: flex;
    align-items: stretch;
    justify-content: center;
	text-decoration: none;
}

.promo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 30px 0 0 0;
    position: relative;
}
.promo-tour {
    box-sizing: border-box;
    background: #FFF;
    border-radius: 0 0 30px 0;
    padding: 40px;
    width: 40%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    flex-grow: 1;
}
.promo-txt {
    width: 90%;
    margin: 0 auto;
}
.tour-name {
    font-size: 22px;
    line-height: 34px;
    margin-bottom: 20px;
}
.tour-name span {
    margin-right: 3px;
	color: #cb2b00;
}
.promo-tour ul {
    margin-top: 20px;
    margin-bottom: 20px;
    padding-left: 20px;
}
.promo-tour li {
    font-size: 18px;
    line-height: 22px;
    margin-bottom: 10px;
    position: relative;
}
.promo-tour li::before {
	content: '';
	position: absolute;
	background: url("../images/info-icon.png");
	width: 12px;
	height: 12px;
	left: -20px;
	top: 5px;
}
.sale {
    font-size: 18px;
    color: #FF4447;
}
.promo-tour .price {
    color: #ff4f4f;
}
.promo-tour .price strong {
    font-size: 40px;
}



   /*--°ê¤º¥~¶º©±¥D±À---*/

.promo.htl .promo-pic{ width: 60%;}

.promo.htl .promo-tour {width: 40%;align-items:stretch;}

.promo.htl .tour-name{text-align: center;	border-bottom: solid 2px #ffe2af;
	padding-bottom: 10px;}
.promo.htl .price{text-align: center;}


/* ±ø¦C¦æµ{ */
.area{
	padding: 5px 10px 3px 10px;
	border: solid 1px;
	display: inline-block;
	font-size: 22px;
	color: #88360a;
	font-weight: bold;
	margin-bottom: 10px;
	margin-top: 40px;
}

.tour-list {
    width: 95%;
    margin: 0 auto;
    margin-top: 30px;
}
.tour-txt {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
    margin-bottom: 5px;
}

.tour-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tour-list li {
    list-style-type: none;
    display: block;
    margin-bottom: 20px;
	position: relative;
	text-indent: 30px;
}

.tour-list li::before {
	content: '';
	position: absolute;
	background: url("../images/tourlist-icon.png");
	width: 22px;
	height: 23px;
	left: 6px;
	top: 10px;
}


.tour-list li a {
    width: 100%;
    border-bottom: dashed 1px;
    display: block;
    height: 100%;
    padding: 5px;
    transition: background-color 0.5s ease;
    box-sizing: border-box;
}

.tour-list li a:hover {
	background: linear-gradient(to right, transparent, #FFF8ED, transparent);
}



.list-name {
    font-size: 20px;
    font-weight: 600;
    width: 80%;
    letter-spacing: 1px;
    line-height: 30px;
}
.list-name span {
    margin-right: 3px;
    color: #cb2b00;
}

.list-name .htl-area{
  font-size: 17px;
  padding: 2px 5px 1px 5px;
  background: #FF7800;
  color: #fff;
  border-radius: 5px;
  margin-right: 10px;
}

.list-name em {
    font-style: normal;
    font-size: 14px;
    margin-left: 5px;
    color: #FF2424;
    padding: 2px 5px 3px 5px;
}
.list-price strong {
    color: #ff5027;
    font-size: 26px;
    margin: 0 3px 0px 3px;
}



@media (min-width: 1199px) {
  .slick-dots .slick-active button {
  display: none;}
}


@media (max-width: 1000px) {
	.tour-txt{flex-direction: column;gap:15px;}
	.list-name{width: 100%;}
  .list-price{width: 100%;text-align:right;}
}

@media (max-width: 960px) {
  .main-title { font-size: 48px;}
}





@media (max-width: 600px) {
  .kv-wrap {
    display: none;
  }

  .kv-mobile {
    display: block;
    text-align: center;
  }

  header {
    height: auto;
    background: none; 
	margin-top: 40px;
  }	
  .main-title {
    font-size: 32px;
  }
.kv-horse figure {
  width: 300px; 
}
}
@media screen and (max-width:768px) {
	#block_menu{display: none;}
	/*ºÖ³U*/
	.bag{flex-direction: column;padding: 30px 20px;justify-content: center;gap:10px;}
	.bag-name{width: 100%;text-align: center;border-bottom: solid 1px;padding-bottom: 15px;}
	.bag-name::before {
    width: 35px;
    top: -25px;
    left: 12px;}
	.bag-line{display: none;}
	/*¯S§O±ÀÂË*/
	.promo a{flex-direction: column;width:95%;margin: 0 auto;}
	.promo-pic,.promo-tour{width: 100%;}
  .promo-tour{align-items: center;}
  .tour-name{text-align: center;display: block;}
	
  .promo.htl .promo-pic{ width: 100%;}
  .promo.htl .promo-tour {width: 100%;}

}