.promotion-banner{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 350px;
	background-size: cover;
	background-position: left;
	background-attachment: fixed;

}
.promotion-wrap{
	background-color: #e9e9e9;
}


/* classify */
.promotion-classify-wrap{
	height: 50px;
	/*background-color: #e9e9e9;*/
	text-align: center;
	margin-top: 20px;
	margin-bottom: 35px;
}
	.promotion-classify-each{
		display: inline-block;
		padding-left: 30px;
		padding-right: 30px;
		height: 50px;
		line-height: 50px;
		font-size: 18px;
		font-weight: bold;
		cursor: pointer;
		border:2px solid  transparent;
		-webkit-transition: all 0.3s; /* For Safari 3.1 to 6.0 */
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
	}
		.promotion-classify-each:hover{
			color: #888;
		}
	.promotion-classify-each.select{
		border:2px solid  #555;
		border-radius: 6px;
		
	}



/* each */
.promotion-each-wrap{
	/*background-color: #e9e9e9;*/
	min-height: 200px;	
	padding-left: 20px;
	position: relative;

}
	.promotion-each{
		/*background-color: #888;*/
		width: 33.3%;
		float: left;
		padding-right: 20px;
		position: relative;
		// margin-top: 50px;


	}
	.promotion-each .photo{
		background-color: #111;
		width: 100%;
		height: 100%;
		background-size: cover;
		background-position: center;
		position: relative;
		overflow: hidden;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s; 
		-o-transition: all 0.3s; 
    	transition: all 0.3s;

    	-webkit-filter: brightness(100%);
    	filter: brightness(100%);

	}
		.photosize{
			width: 100%;
			height: 250px;
			overflow: hidden;
		}
		

	// .promotion-each .photo img{
	// 	max-width: 100.5%;
 //   		height: auto;  

	// 	-webkit-transition: all 0.3s; /* For Safari 3.1 to 6.0 */
	// 	-moz-transition: all 0.3s; 
	// 	-o-transition: all 0.3s; 
 //    	transition: all 0.3s;
		
	// }
	// 	.promotion-each.promotion-each .photo img:hover{
			
	// 		 -webkit-transform: scale(1.1);
	//          -moz-transform: scale(1.1);
	//          -ms-transform: scale(1.1);
	//          -o-transform: scale(1.1);
	//          transform: scale(1.1);
	//          transform-origin: center center;
	// 	}

	.promotion-each .new{
		position: absolute;
		left: 0px;
		top: 15px;
		padding: 10px;
		padding-right: 30px;
		padding-left: 30px;
		background-color:rgba(0%,0%,0%,0.7);
		color: #FFF;
		z-index: 5;
	}
	.promotion-each .words{
		background-color: #FFF;
		width: 100%;
		padding: 15px;
		height: 110px;
		position: relative;
	}
	.promotion-each .words i{
		margin-right: 10px;
	}
	.words div {
	    line-height: 2rem;
	}
	.promotion-each .words_title{
		font-size: 18px;
	    font-weight: bold;
	    margin-bottom: 5px;
	    /* margin-right: 70px; */
	    overflow: hidden;
	    white-space: nowrap;
	    text-overflow: ellipsis;
	    text-align: left;
	}
	.promotion-each .words_subtitle{
		font-size: 14px;
	    margin-right: 90px;
	    color: #999;
	    text-align: left;
	}
	.promotion-each .words_brief {
	    color: #999;
	    text-overflow: ellipsis;
	    overflow: hidden;
	    white-space: nowrap;
	}
	.promotion-each .reservation{
		width: 70px;
		height: 70px;
		border-radius: 70px;
		line-height: 70px;
		font-size: 18px;
		border: 1px solid #FFF;
		text-align: center;
		background-color: #888;
		position: absolute;
		top: -35px;
		right: 15px;
		color: #FFF;
		z-index: 1;
		cursor: pointer;
	}
		.promotion-each .reservation:hover{
			background-color: #666;
		}
		.promotion-each .reservation:active{
			line-height: 73px;
		}
	.promotion-each-top{
		width: 66.6%;
	}
	.promotion-each-top .photo{
		height: 660px;
	}

	.promotion-content-title {
	    font-size: 30px;
	    color: #111;
	    padding-top: 50px;
	}
	.promotion_slider{
		text-align: center;
	}

		.promotion-each{
		margin-bottom: 25px;
	}
	/* hover效果 */
	/* 大圖 */
	.promotion-each-top .photowrap{
		width: 100%;
		height: 575px;
		overflow: hidden;
		
	}
	.promotion-each-top .photo{
		-webkit-transition: all 0.3s; /* For Safari 3.1 to 6.0 */
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
	}
	

	/* 小圖 */
	.promotion-each-normal .photowrap , .promotion-each-top-normal .photowrap{
		width: 100%;
		height: 220px;
		overflow: hidden;
		
	}
	.promotion-each-normal .photo , .promotion-each-top-normal .photo{
		-webkit-transition: all 0.3s; /* For Safari 3.1 to 6.0 */
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
	}
	.promotion-each-normal .photo:hover{
		width: 120%;
		height: 275px;
		/* margin-left: -10%;
		margin-top: -13px; */
		margin-left: 0;
		margin-top: 0;
		background-size: cover;
		-webkit-filter:  brightness(90%);
		filter:  brightness(90%);
	}

	.promotion-each-top .photo:hover{
		height: 770px;
	}

/* --------------------------------------- RWD ---------------------------------------------------- */ 

@media screen and (max-width: 980px) {
	.promotion-each-wrap{
		padding: 0px;
	}
	.promotion-each-top{
		width: 100%;
	}
	.promotion-each{
		width: 100%;
		padding: 0px;
		margin-bottom: 0px !important;
	}
	.promotion-each-top .photo{
		height: 180px;
	}
	.promotion-each-top .photowrap{
		height: auto !important;
	}
	.promotion-each-normal .photowrap, .promotion-each-top-normal .photowrap{
		height: auto !important;
	}
	.promotion .promotion-each .photo{
		height: auto !important;
		min-height: 200px;
	}
	.promotion .promotion-each .photo img{
		visibility: hidden;
	}
	.promotion-each .words{
		min-height: 90px;
		height: auto;
	}
	.promotion-each{
		margin-top: 25px;
	}
	.promotion-classify-wrap{
		height: auto;
		margin-bottom: 0px;
		margin-top: 0px;
	}
	.promotion-classify-each {
	    width: 45%;
	    padding-left: 0px;
	    padding-right: 0px;
	    height: 50px;
	    font-size: 16px;
	}
	body[lang="en"] .promotion-classify-each{
		width: 33%;
	}
	body[lang="jp"] .promotion-classify-each{
		width: 48%;
		font-size: 13.5px;
	}
	.promotion-banner{
		background-attachment: scroll;
		background-size: auto 200%;
		background-position: left top; 
	}
	.promotion-content-title{
		    padding-top: 0px;
	}
	.promotion-each-normal .photo:hover{
		width: 100%;
		height: 220px;
		margin-left: 0px;
		margin-top:  0px;
		
	}

	.promotion-each-top .photo:hover{
		height: 575px;
	}



}