/* header */
*{
	margin:0;
	padding: 0;
	list-style:none;
	font-family:Microsoft JhengHei;
	text-decoration:none;
}

header{
	width:100%;
	background-color:#336ca8;
	position:fixed;

	z-index:99;
}

.logo a{
	width: 250px;
	max-width: 100%;
	margin: 0 auto;
	display: block;
}
/* .logo amp-img{
	width:100%;
} */

.page-box{
	width:100%;
	display:block;
	margin:0 auto;
	/* position:fixed; */
	z-index:-1;
	
}
.page-prev ,.page-next{
	color:#336ca8;
	/* width:20%; */
	position:fixed;
	font-size:3rem;
	text-align: center;
	bottom:50%;
}

.page-prev{
    left: 15%;
}
.page-next{
    right: 15%;
}
.menu-box{
	width:60%;
	max-width:100%;	
	display:inline-block;
	font-size:0;
	vertical-align:middle;
}
.menu-box ul {
	width:100%;
	margin:0;
}


.menu-box ul li:hover .menu-word{
	animation: lightSpeedIn 1s ease 0s 1 alternate;
}
.menu-box ul li a{
	width:100%;
	height:100%;
	color:#FFF;
	display:block;
}
.menu-word{
	display: inline-block;
	vertical-align: middle;
}
.menu-icon img{
	width:100%;
}
.search{
	width:20%;
	max-width:100%;
	display:inline-block;
	
}
.search-box{
	width:90%;
	margin:0 auto;
}
.search-input{
	font-size:0;
	width:100%;
	display:inline-block;
	vertical-align:middle;
}
.search-input input{
	width:84%;
	height:32px;
	display:inline-block;
	vertical-align:middle;
	border:1px solid #FFF;
}
.index-title-bg{
	background-image: url('../img/bg.png');
	background-size: cover;
	background-repeat: no-repeat;
}
.red{
	background-color:rgba(224,58,58,1);
	
}
.yellow{
	background-color:#ccb12e;
}
.green{
	background-color:#69cf25;
}

.blue{
	background-color:#299adb;
}
.orange{
	background-color:#f66f0d;
}


/* 文章開頭 */
.appear-title{
	width:100%;
}

.appear-title ul{
	padding-top:100px;
	width:1075px;
	max-width:100%;
	margin:0 auto;
	
}

.appear-title ul li{
	font-size:1rem;
	color:#545454;
	display:inline-block;
}
.appear-title ul li.big-title{
	width:100%;
	font-size:2.5rem;
	line-height:1.6;
	color:#0381d0;
}

.title-name{
	width:150px;
	max-width:100%;
}
.title-time{
	width:160px;
	max-width:100%;
}

.news-name, .news-time{
	display:inline-block;

}
.title-area{
	width:100px;
	max-width:100%;
}

.appear-banner{
	margin-top:20px;
	width:100%;
}
.appear-banner-box{
	width:1075px;
	max-width:100%;
	margin:0 auto;
}

.appear-banner-box div{
    width: 390px;
    max-width: 100%;
    height: 350px;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
}
.shops-box{
	margin-top:10px;
	width:100%;
	line-height: 1.6;
}
.shops-box ul{
	width:1075px;
	max-width:100%;
	margin:0 auto;
}

.shops-box ul iframe{

	max-width:100%;

}
.shop-information{
	font-size:2rem;
	color:#336ca8;
	margin:20px 0;
}

.shop-name{
	font-size:1.6rem;
	color:#f25e5e;
	margin:20px 0;
}

.shop-address{
	font-size:1.3rem;
	line-height:1.6;
	color:#8e8e8e;
	margin-bottom:20px;
}

.shop-word{
	margin:10px 0;
	font-size:1.3rem;
	color:#000;
	line-height:1.6;
}

.fb{
	margin:30px 0;
	width:100%;
}

.fb-good-box{
	width:1075px;
	max-width:100%;
	margin:0 auto;
}
.good-box{
	width:95px;
	max-width:100%;
}
.good-box img{
	width:100%;
}

.fb-include{
	margin-top:30px;
	width:100%;
}

.fb-include img{
	width:100%;
}

.footer-word{
	height:40px;
	line-height:40px;
	text-align:center;
	font-size:0.8rem;
	color:#000;
}

.more{
	width:100%;
	display:block;
}
.more-title{
	width:1075px;
	max-width:100%;
	margin:20px auto;
	text-align:left;
	display:block;
	font-size:2rem;
	color:#000;
	margin-bottom:10px;
}
.more-img-box{
	width:100%;
}


.more-news{
	width:1095px;
	max-width:100%;
	margin:0 auto;
	font-size:0;
}

.more-news ul{
	width:345px;
	max-width:100%;
	margin:10px 10px;
	height:auto;
	 overflow: hidden;
	position:relative;
	display:inline-block;
}

.more-img{
	position:relative;
	z-index:1;
}

.more-link{
	width:100%;
	display:block;
}

.more-img div{
    width: 390px;
    height: 350px;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
}
.more-word{
	width:100%;
	height:100%;
	position:absolute;
	z-index:2;
	background: -moz-linear-gradient(top, rgba(255,255,255,0) 60%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,255,255,0) 60%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,255,255,0) 60%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
	top:0;
}

.more-word h2{
	position:absolute;
	z-index:3;
	font-size:15px;
	color:#FFF;
	bottom:10px;
	text-align:center;
	left: 0;
	right:0;
}

.more-link:hover .more-img img{
    transform: scale(1.2);
    transition: all 0.6s ease-in;
}

.rwd-prev-box{
	width:100%;
	padding-top:20px;
	display:none;
	font-size:0;
}

.rwd-prev-box li{
	font-size:1.5rem;
	text-align:center;
	width:48%;
	display:inline-block;
	border-left:1px solid #000;
	padding:10px 5px;
	
}
.rwd-prev-box li:first-child{
	border:0;
}
.rwd-prev-title{
	width:100%;
	color:#168ad3;
	font-size:1rem;
	line-height:1.6;
	margin-top:10px;
}


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

	.menu-box{
		width:900px;
	}

	.menu-box ul li{
		width:180px;
	}
	.appear-title ul{
		width:900px;
	}
	.appear-banner-box{
		width:900px;
	}
	.shops-box ul{
		width:900px;
	}
	.fb-good-box{
		width:900px;
	}
	.more-title{
		width:900px;
	}
	.more-news{
		width:920px;
	}
	.more-news ul{
		width:285px;
	}
}

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

	
	.menu-box{
		width:700px;
	}

	.menu-box ul li{
		width:140px;
	}
	.appear-title ul{
		width:700px;
	}
	.appear-banner-box{
		width:700px;
	}
	.shops-box ul{
		width:700px;
	}
	.fb-good-box{
		width:700px;
	}
	.more-title{
		width:700px;
	}
	.more-news{
		width:720px;
	}
	.more-news ul{
		width:220px;
	}

}

@media only screen and (max-width: 1000px){
	.header-box{
		width:900px;
	}
	.logo-box{
		width:150px;
	}
	.logo{
		width:100px;
	}
	.menu-box{
		width:600px;
	}

	.menu-box ul li{
		width:120px;
	}
	.page-box{
		display:none;
	}
	.appear-title ul{
		width:600px;
	}
	.appear-banner-box{
		width:600px;
	}
	.shops-box ul{
		width:600px;
	}
	.fb-good-box{
		width:600px;
	}
	.more-title{
		width:600px;
		text-align:center;
	}
	.more-news{
		width:620px;
	}
	.more-news ul{
		width:345px;
		display:block;
		margin:10px auto;
	}
	.rwd-prev-box{
		display:block;
	}

}

@media only screen and (max-width: 900px){
	.header-box{
		width:100%;
		display:block;
		margin:0;
	}
	.logo-box{
		width:100%;
		display:block;
		height:50px;
		margin-left: 10px;
	}

	.logo{
		width:230px;
		margin-top:10px;
		display:block;
		text-align:center;
		
	}
	.menu-box{
		width:100%;
	}
	.menu-box ul li{
		width:20%;
		font-size: 0;
	}
	.menu-box ul li .menu-word{
		display:inline-block;
		font-size:1rem;
	}

	.menu-icon{
		display:inline-block;
	}
	/* .menu-icon{
		display:block;
	} */
	.appear-title ul li.big-title{
		font-size:2rem;
		margin-top:50px;
	}

}
@media only screen and (max-width: 550px){
	.rwd-prev-box li{
		padding:0;
	}	
}

@media only screen and (max-width: 450px){
	.appear-title ul li.big-title{
		font-size:1.5rem;
	}
	
}

@media only screen and (max-width: 350px){
	.logo{
		width:150px;
		margin-top:15px;
	}
	
}