.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 * { box-sizing: border-box; }



.bg-wight-line { background: linear-gradient(
        45deg, 
        rgba(0, 0, 0, .05) 0, rgba(0, 0, 0, .05) 25%, transparent 25%, transparent 50%, 
        rgba(0, 0, 0, .05) 50%, rgba(0, 0, 0, .05) 75%, transparent 75%, transparent
      );
  background-size: 7px 7px
}

.header-bottom-bg { background: url(../images/bg-header-bottom-2.jpg) bottom center no-repeat; }
header.header { position: relative; background: url(../images/bg-header2023.jpg) top center no-repeat; }
header.header h1 { height: 558px; }
h2 p,
header.header h1 p { font-size: 0 !important; opacity: 0 !important; display: none !important; }
header.header .top-button-base { width: 100%; height: auto; }
header.header .top-button-base ul { margin:0 auto; width: 95%; max-width: 1400px; text-align: center; }
.top-button-base ul li { display: inline-block; margin: 0 1%; width: 17%; letter-spacing: normal; background: #fff; box-shadow:0 0 15px rgba(0,0,0,0.3); transition: .5s;}
.top-button-base ul li:hover { transform: translateY(-10px); }
.top-button-base .name { margin:20px 10px 20px 10px; padding-left: 10px; text-align: left; border-left: 3px solid #000; }
.top-button-base .img img,
.top-button-base .other img { width: 100%; }



.top-button-base .name p{font:bold 20px/1.4 "微軟正黑體";color:#000; }

.header-bottom-ttile { margin:0 auto; padding: 60px 0; width: 95%; max-width: 1400px; text-align: center; }
.header-bottom-ttile img { width: 49%; }
.header-bottom-ttile img:nth-child(1) { max-width: 473px;margin-right: 40px; }
.header-bottom-ttile img:nth-child(2) { max-width: 502px; }



.infor-base { padding: 80px 0; }
.infor-base h2 { margin-bottom: 20px; text-align: center; }
.infor-base .date{text-align: center; color: #000;  font: 24px/1.4 "微軟正黑體";display: block;margin: 20px auto;}

.infor-content {margin:0 auto; width: 95%; max-width: 1400px; text-align: center; overflow: hidden;background: #627625; }
.infor-content .content { display: none; }
.infor-content .content:first-child { display: block; }
.infor-content .text { float: left; padding: 35px; width: 40%;  }
.infor-content .text h3 { margin-bottom: 10px; font: 30px/1 "微軟正黑體"; color: #fff; text-align: center; }
.infor-content .text small { display: inline-block; margin-bottom: 10px;  padding: 5px 10px;  font: 17px/1 "微軟正黑體";  color: #627625; background: #ffba00; }
.infor-content .text p {   font: 17px/1.7 "微軟正黑體";  color: #fff; letter-spacing: 2px; text-align: left; }
.infor-content .photo { float: left; width: 60%; }
.infor-content .photo img { width: 100%; }
.infor-content.map img{ width: 100%; }

.infor-button { margin:0 auto; padding: 20px 0; width: 95%; max-width: 1400px; text-align: left;;overflow: hidden;overflow-y: hidden; overflow-x:auto;-webkit-overflow-scrolling: touch;overflow-scrolling: touch; }
.infor-button ul { position:relative; width: 100%; height: auto; z-index: 10; white-space:nowrap; width:auto; border-radius: 0; overflow: visible;  }
.infor-button li { display: inline-block; margin-right: 20px; padding: 10px 25px;  text-align: center; background: #627625;}
.infor-button li  a { font: 22px/1 "微軟正黑體"; color: #fff; }
.infor-button li.on ,
.infor-button li:hover { background: #ffba00; }
.infor-button li.on a ,
.infor-button li:hover a { color: #627625; } 



.localview-base { padding: 80px 0; width: 100%;   }
.localview-base h2 { margin-bottom: 30px; text-align: center;}
.localview-base  .localview-content { margin:0 auto; padding-bottom: 20px; width: 95%; max-width: 1400px;overflow: hidden;overflow-y: hidden; overflow-x:auto;-webkit-overflow-scrolling: touch;overflow-scrolling: touch;  }
.localview-base ul{  text-align: center; white-space:nowrap; width:auto; border-radius: 0; overflow: visible; }
.localview-base li { position: relative; display: inline-block; margin: 0 2.5%; width: 20%; letter-spacing: normal; background: #fff; box-shadow:0 0 15px rgba(0,0,0,0.3); transition: .5s;}
.localview-base .name { margin:20px 10px 20px 10px; padding-left: 10px; text-align: left; border-left: 3px solid #000; }
.localview-base .img img,
.localview-base .other img { width: 100%; }
.localview-base a .name {font: 24px/1 "微軟正黑體"; color: #000;  }
.localview-base p { position: absolute; top: 64px; left: 0; padding: 15px; width: 100%; height:280px ; font: 15px/1.4 "微軟正黑體"; color: #fff; text-align: left; 
white-space: normal; word-break: break-all;  background: rgba(0,0,0,0.8); z-index: 5; opacity: 0; display: block; transition: .5s; }
.localview-base li:hover p { display: block; opacity: 1; } 





.bg-photo-1 { background: url(../images/bg-photo-1.jpg) bottom center no-repeat;  }
.bg-photo-2 { background: url(../images/bg-photo-2.jpg) bottom center no-repeat;  }
.bg-photo-3 { background: url(../images/bg-photo-3.jpg) bottom center no-repeat;  }
.bg-photo-4 { background: url(../images/bg-photo-4.jpg) bottom center no-repeat;  }
.bg-photo-5 { background: url(../images/bg-photo-5.jpg) bottom center no-repeat;  }

.fixBase { display: none; position: fixed; bottom: 40%; left:20px ; z-index: 50;  }
.fixBase li { position: relative; margin-bottom: 20px; padding: 20px; width: 80px; height: 80px; text-align: center; background: rgba(0,0,0,0.8); border-radius: 99em; }
.fixBase li a { width: 100%; font:20px/20px "微軟正黑體"; color: #fff; }
.fixBase li.hot { background: rgba(255,0,72,0.8); }
.fixBase li.hot::after { content: "HOT"; position: absolute; top:10%; right: -20px; padding: 3px 6px; font:12px/1 "arial";color: #fff; border-radius: 99em; background: #ff7e00; }

@media only screen and (max-width: 1024px) {

.infor-content .photo img { width: auto; height: 100%; }
}



@media only screen and (max-width: 800px) {
header.header { background-size: 160% }
header.header h1 { height: 24vh; }
.top-button-base ul li {margin: 0 0.5%; width: 24%; }
.top-button-base .name img { width: 100%; }

.localview-base li { width: 25%;}


.fixBase { bottom: 0; left: 0; width: 100%; }
.fixBase ul { width: 100%;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 */ }
.fixBase li { display: inline-block; margin: 0; padding: 10px 0; width: 20%; border-radius: 0; height: auto; letter-spacing: normal;  }

.fixBase li a { width: 100%; font:16px/16px "微軟正黑體"; color: #fff; }
.fixBase li.hot::after { display: none; }
}


@media only screen and (max-width: 768px) {
.infor-content .text ,
.infor-content .photo { float: none; width: 100%; }
.infor-content .text { padding: 3%; }
.infor-content .photo img { width: 100%; height: auto; }

.top-button-base .name p {font:bold 2.6vw/1.4 "微軟正黑體";}
.top-button-base ul li {margin: 1% ; width: 48%; }
.top-button-base .img { float: left; width: 30%; }
.top-button-base .name { float: right; margin: 5% 5% 0 5%; ; width: 60%;  }
.top-button-base .other { float: left; width: 65%;   }

}


@media only screen and (max-width: 500px) {

.bg-wight-line { background: linear-gradient(
        45deg, 
        rgba(0, 0, 0, .03) 0, rgba(0, 0, 0, .03) 25%, transparent 25%, transparent 50%, 
        rgba(0, 0, 0, .03) 50%, rgba(0, 0, 0, .03) 75%, transparent 75%, transparent
      );
  background-size: 7px 7px
}
.header-bottom-bg { background-size: 200%;    background-position: bottom left;}	
header.header { background-size: 160% }
header.header h1 { height: 18vh; }


.header-bottom-ttile {  padding: 5% 0; background: rgba(255,255,255,0.5) }
.header-bottom-ttile img:nth-child(1) { width:70%;margin-right: 0px; }
.header-bottom-ttile img:nth-child(2) { width:100%; }




.infor-button li  a { font: 25px/1 "微軟正黑體";  }

.localview-base h2 img { width:80%; }
.localview-base li { margin-top:5%; width: 80%;}


.localview-base p { position: static; height: auto; color: #000; opacity: 1; background: none; }
h2 p { opacity: 0; } 
.c23Base { padding: 5% 0; }
.carrier li { right: 0; padding-right: 0; padding-bottom: 30px; width: 100%; }
}

@media only screen and (max-width: 400px) {
header.header h1{height: 17vh;}
}





.poiAutoTemplate .slidecontain {display: none;}
.poiAutoTemplate .ph-group-content-text-sale,.poiAutoTemplate .ph-group-content-text-sale a{padding: 0 5px;font:700 15px/2 "微軟正黑體";background:#627625;}
.poiAutoTemplate .ph-group{justify-content: center;}

.poiAutoTemplate .ph-group-content{margin: 5px;}

.poiAutoTemplate .ph-group-content-tag{font:300 17px/1 "微軟正黑體";}
.poiBase{padding: 5% 0;}
.poiBase h2{text-align: center;display: block;font:500 italic 42px/2 "微軟正黑體";}
.poiBase h2 span{color: #627625;font:700 italic 56px/1.4 "微軟正黑體";}

@media only screen and (max-width: 500px) {
.poiBase{padding: 5% 0;width: 95%;margin: 0 auto;}


  }