@import url('https://fonts.googleapis.com/css?family=Noto+Serif+TC:600&display=swap');

.landing-banner{
	display:block;
	width:95%;
	margin: 0 auto;
/*    -webkit-box-shadow: 0 60px 80px rgba(220, 165, 152, 0.65);
    -moz-box-shadow: 0 60px 80px rgba(220, 165, 152, 0.65);
    box-shadow: 0 60px 80px rgba(220, 165, 152, 0.65);*/
    position: relative;
    z-index: 1;
	}
.landing-mobile{ display:none; }

@media screen and (max-width: 640px) {
.landing-banner{
	display:none;
	}
.landing-mobile{ 
	display:block;
	width:95%;
	margin: 4% auto;
    }
}

.petals-love-story{
	display: block;
	width: 100%;
	padding:23% 7% 7% 7%;
	background: linear-gradient(320deg, #edb5ab, #f7d1ca);
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
.petals-en-title{
	display: block;
	width: 100%;
	text-align: center;
	padding: 2% 0 0 0;
	margin: 0;
	font-family: 'La Belle Aurore', cursive;
	color: #ffffff;
    font-size: 40px;
    letter-spacing: 5px;
    font-weight: 100;
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
	}	
.petals-tw-title{
	display: block;
	width: 100%;
	color: #ffffff;
	font-size: 20px;
	letter-spacing: 21px;
	padding: 2% 0 0 0;
	margin: 0;
	text-align: center;
	font-weight: 500;
	position: relative;
	z-index: 2;
	}	
.petals-left,
.petals-right{
	display: inline-block;	
	margin: 0 auto;
	vertical-align: middle;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
.petals-left{
	width: 48%;
	padding-left: 15%;
	}
.petals-right{
	width: 48%;
	padding-top: 3%;
	padding-left: 5%;
	}	
.petals-right p{
	color: #ffffff;
	margin: 8px 0;
	font-size: 17px;
	letter-spacing: 2px;
	}	
.petals-keep-happiness{
    display: block;
    width: 100%;
    max-width: 280px;
    font-size: 19px;
    letter-spacing: 5px;
    color: #ffffff;
    font-weight: 600;
    margin: 8% 0 0 0;
    padding: 30px 0 20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.4);
    }	
.petals-title-line{
	display: block;
	width: 95%;
	margin: 30px auto;
	font-size: 21px;
	letter-spacing: 2px;
	color: #707070;
	text-transform: uppercase;
	}   
.petals-title-line.last{
	width: 87%;
	margin: 3% auto -3% auto;
	} 
.main-slider-area .petals-title-line{
	width: 100%;
	margin: 30px auto;
	} 	
.petals-title-line span{
	position: relative;
	} 	
.petals-title-line span:after{
    position: absolute;
    top: 15px;
    margin: 0 0 0 10px;
    content: '';
    width: 150px;
    height: 1px;
    background-color: #e4e4e4;
	} 	
.gray-bg{
	display: block;
	width: 100%;
    }

.main-slider-area{
	display: block;
	width: 85%;
	max-width: 1617.55px;
	margin: 0 auto;
	padding: 7% 0 25% 0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
.main-slider-area.store{
	display: block;
	width: 85%;
	max-width: 1617.55px;
	margin: 0 auto;
	padding: 5% 0 8.5% 0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
/*feature begin*/
.main-slider-area h2,
.main-slider-area h3{
	position: relative;
	z-index: 5000;
	display: block;
	margin: 0 0 3% 0;
	font-size: 36px;
	letter-spacing: 8px;
	font-weight: 500;
	color: #555555;
	}
.petals-row{
	display: table;
	width: 100%;
    }
.index-news-pic{
	position: relative;
	display:table-cell;
	width:40%;
	margin:0 6% 0 0;
	max-width:600px;
	vertical-align: top;
	overflow: hidden;
	z-index: 1;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
.main-slider-area .petals-deatil{
	display:table-cell;
	width:60%;
	list-style-type:none;
	margin:0 auto;
	padding:9% 0 0 22%;
	text-align: left;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	vertical-align: middle;
	}
.main-slider-area.store .petals-deatil{
	display:table-cell;
	width:60%;
	list-style-type:none;
	margin:0 auto;
	padding:0 0 0 10%;
	text-align: left;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	vertical-align: middle;
	}
.petals-pic{
    position: relative;	
	width:40%;
    }
@media screen and (min-width: 640px) {
	.petals-pic{
		display:table-cell;
	}
}
.petals-pic img{	
	position: relative;
	width:100%;
	display:block;
	}
.main-slider-area p{
	margin:0;
	padding:0 0 0 3px;
	color: #707070;
	font-size: 17px;
	letter-spacing: 2px;
	line-height: 180%;
	}	
.main-slider-area p.note{
	margin:25px 0 0 0;
	color: #999999;
	font-size: 14px;
	}	
.main-slider-area ol{
	margin:15px 0;
	padding:0 0 0 30px;
	}
.main-slider-area ol li{
	margin:0;
	padding:0;
	color: #707070;
	font-size: 17px;
	letter-spacing: 2px;
	line-height: 180%;
	}		
.swiper-container.mobile-pic{
	width:100%;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;	
    }
.swiper-container.mobile-pic .swiper-slide img{
	display: block;
    width: 100%;
    }
@media screen and (max-width: 960px) {
	.petals-tw-title {
		letter-spacing: 10px;
		}
	.main-slider-area .petals-deatil {
		padding: 9% 0 0 15%;
		}
	.petals-en-title {
		font-size: 30px;
		}
}
@media screen and (max-width: 820px) {
	.main-slider-area p {
		font-size: 15px;
		letter-spacing: 0px;
		}
}
@media screen and (max-width: 640px) {
	.petals-title-line{
		margin: 15px auto 0 auto;
		font-size: 14px;
		overflow: hidden;
		letter-spacing: 0;
		}  
	.petals-title-line span:after {
	    top: 10px;
	}
	.main-slider-area .petals-title-line{
		width: 100%;
		margin: 20px auto 20px auto;
		} 	
	.petals-tw-title {
		letter-spacing: 5px;
		padding: 0 0 10px 0;
		font-family: 'Noto Serif TC', serif;
		font-size: 24px;
		}
	.petals-en-title {
		display: none;
		}
	.petals-left {
		width: 100%;
		padding-left: 0;
		}
	.petals-right {
		width: 100%;
		padding-top: 0;
		text-align: center;
		}
	.petals-right p {
		letter-spacing: 0;
		font-size: 15px;
		margin: 20px 0;
		}
	.petals-right label{
		display: block;
	    }	
	.petals-love-story {
		padding: 23% 5% 7% 5%;
		}
	.petals-keep-happiness {
		max-width: 160px;
		font-size: 16px;
		margin: 20px auto;
		padding: 20px 0 10px 0;
		}
	.petals-love-story {
		padding: 31% 7% 7% 7%;
		background-color: #e8bdb5;
		}
}
@media screen and (max-width: 640px) {
    .petals-row{
		display: block;
		width:100%;
	}
	.petals-pic{
		width:100%;
	}
	.swiper-container.mobile-pic{
		position: relative;
	}
	.main-slider-area .petals-deatil{
		display: block;
		width:100%;
		padding: 20% 0 25% 0;
		text-align: center;
	}
	.main-slider-area h2,	
	.main-slider-area h3{
		font-size: 22px;
		letter-spacing: 2px;
		}
	.main-slider-area{
		width: 100%;
		padding: 7% 8% 13% 8%;
		}
	.petals-title-line span:after {
		width: 460px;
		}
}
@media screen and (max-width: 480px) {
	.main-slider-area p {
		line-height: 1.5;
		}
	.main-slider-area h2,	
	.main-slider-area h3{
		font-size: 19px;
		letter-spacing: 1px;
		font-weight: 600;
		}
}
@media screen and (max-width: 320px) {	
	.main-slider-area .petals-deatil {
		padding: 0 0 0 5%;
		}
	.main-slider-area h2,	
	.main-slider-area h3 {
		font-size: 17px;
		}
	.petals-right p,	
	.main-slider-area p{
		font-size: 13px;
		}
	.petals-tw-title {
		font-size: 16px;
		letter-spacing: 0;
		}
	.petals-love-story {
		padding: 31% 3% 7% 7%;
		}
}

.main-slider-area.fade-area{
	display:block;
	max-width: 100%;
	}	
.main-slider-area.fade-area p,	
.main-slider-area.fade-area h3{
	color: #ffffff;
	}
.main-slider-area p strong{
	font-weight: normal;
	}	
.main-slider-area.fade-area p u{
	text-decoration: none;
	}	
.main-slider-area.fade-area .petals-deatil{
	width: 100%;
	padding: 0;	
	}
.fade-area{
	position: relative;
	display: block;
	width: 100%;
	background: linear-gradient(320deg, #ffdfd4, #e3a499);
	padding: 8% 10%;
	margin: 0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
.fade-white-bg{
	position: absolute;
	width: 50%;
	right: 0;
	top: 0;
	height: 100%;
	background-color: #ffffff;
	z-index: 0;
    }	
.main-slider-area.fade-area .petals-keep-happiness {
	max-width: 320px;
	letter-spacing: 3px;
	margin: 15% 0 0 0;
	padding: 30px 0 10px 0;
	}
@media screen and (max-width: 640px){
	.main-slider-area.fade-area .petals-keep-happiness {
		max-width: 320px; 
	}
	.fade-white-bg{
		width: 100%;
	}
}

.main-slider-area.flavors{
	padding: 5% 0;
	text-align: center;
}


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

}

@media screen and (max-width: 1280px){
	.fade-area{
		padding: 6% 8%;
		}
}  
@media screen and (max-width: 1024px){
	.fade-white-bg {
		background-color: transparent;
		}
	.main-slider-area.fade-area .petals-keep-happiness {
		padding: 30px 0 0 0;
		}

}    
@media screen and (max-width: 865px){
	.fade-area {
		padding: 6%;
		}
}  
@media screen and (max-width: 640px){
	.main-slider-area.flavors{
		padding: 10%;
	}

	.main-slider-area.fade-area .petals-keep-happiness {
		padding: 15px 0 0 0;
		margin: 15px 0 0 0;
		letter-spacing: 1px;
		}

	.fade-area {
		padding: 5% 8% 25% 8%;
        background: linear-gradient(320deg, #e19d91, #ebc5b7);
		}
	.main-slider-area.fade-area p{
		line-height: 2;
		}

	.main-slider-area.fade-area .petals-keep-happiness {
        display: block;
        width: 100%;
        max-width: 100%;
        text-align: center;
        padding: 25px 0 0 0;
        margin: 25px auto 0 auto;
		}
}	


.main-slider-area.flavors .petals-title-line{
	margin: 15px auto;
	}
.main-slider-area.flavors .petals-deatil{
	padding: 0;
	display: inline-block;
	width: auto;
	text-align: center;
	}	
.petals-deatil ul{
	margin: 0;
	padding: 0;
	display: block;
}
.petals-deatil ul li{
	margin: 0 0 10px 0;
	display: inline-block;
}
.petals-deatil ul li div{
	display: block;
	text-decoration: none;
	padding: 5px 15px;
	font-size: 15px;
	border-radius: 8px;
	background: #ffffff;
	color: #707070;
	border: 1px solid #cccccc;
}
.main-slider-area.flavors .petals-title-line span:before{
	position: absolute;
	left: -90px;
	top: 9px;
	margin: 0 10px 0 0;
	content: '';
	width: 80px;
	height: 1px;
	background-color: #e4e4e4;
	}	
.product-tab-title{
	position: relative;
    display: block;
    width:95%;
	margin:3% auto;
	border-bottom:1px solid #e2e2e2;
	}
.product-tab-title:after{
	position: absolute;
	left:0;
	bottom: -31px;
	content: '';
	width: 100%;
	height: 30px;
	background-color: #ffffff;
	}
.product-tab-span{
	display: inline-block;
	padding: 8px 20px 1px 20px;
	margin:0 0 -1px 0;
	background-color:#ffffff;
	font-size:27px;
	font-family: 'Noto Serif TC', serif;
	color:#666666;
	border:1px solid #e2e2e2;
	border-radius:12px 12px 0 0;
	border-bottom:0;
	}
.product-tab-span label{
	border-bottom:1px solid #a4da79;
	}	
.product-tab-span span{
	font-size: 13px;
	color: #ababab;
	}	
/* product item */
.wedding-pic-container{
	position:relative;
	display:block;
	width:100%;
	}
ul.product-item{
	display:table;
	width:100%;
	margin:0 auto;
	padding:0 0 3% 3%;	
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
ul.product-item.recommend{
	padding:0;
	}
ul.product-item h2{
	display:block;
	font-size:30px;
	font-weight:normal;
	letter-spacing:2px;
	margin:0 auto 5px auto;
	padding:0;
	color:#333333;
	}
ul.product-item p{
	display:block;
	font-size:16px;
	letter-spacing:2px;
	margin:0 auto 5% auto;
	padding:0;
	color:#707070;
	}
ul.product-item li{
	display:inline-block;
	width:13.8%;
	padding:0 .5%;
	margin:0;
	vertical-align:top;
	text-align:center;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
ul.product-item.news li{
	text-align: left;
}
ul.product-item.recommend li{
	width:19%;
	padding:0 1%;
	}
ul.product-item li .item-group{
	position:relative;
	display:block;
	width:100%;
	max-width:320px;
	border:0;
	text-decoration:none;
	margin:0 auto 5% auto;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
.item-group:hover .item-price {
	border-top: 1px solid #777777;
	}
ul.product-item li .item-group img{
	display:block;
	width:inherit;
	margin:0 auto;
	border-radius: 6px;
	}
ul.product-item li .item-group label{
	display:block;
	margin:30px 0 0 0;
	font-size:21px;
    color:#dc8574;
	letter-spacing:1px;
    line-height: 130%;
	font-weight:normal;
	cursor: pointer;
	}
ul.product-item.news li .item-group label{
	font-size:18px;
	letter-spacing:0;
	color: #707070;
	}

ul.product-item.recommend .item-group label{
	text-align:center;
	}

.item-description{
	display:block;
	color: #0f73df;
	padding:15px 0;
    font-size: 15px;
	}
.item-description.last{
    letter-spacing: 0;
    height:auto;
	}
 @media screen and (max-width: 640px) {
	.item-description{
		padding:10px 0 0 0;
		font-size:13px;
		line-height: 1.2;
		letter-spacing: 0;
		}
}	
.item-pic{
    position:relative;
    width:100%;
    border-radius: 6px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position-x: center;
	background-position-y: center;
	cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
   }
ul.product-item li .item-group:hover label{
    color: #62afad;
}
ul.product-item li .item-group:hover .item-pic{
    opacity: .7;
}
.img-span {
   position:absolute;
   left:0;
   top:0;
   display:block;
   padding:5px 10px;
   font-size:13px;
   background-color:;
   color:#ffffff;
   background: rgba(206, 0, 39, .85);
   z-index:3;
   }	
 @media screen and (max-width: 1300px) {
	ul.product-item li,	
	ul.product-item.recommend li{
		width:16%;
		padding:0 .5%;
	}
}
 @media screen and (max-width: 1100px) {
	ul.product-item li .item-group label{
		font-size:16px;
	}
	ul.product-item li,	
	ul.product-item.recommend li{
		width:19%;
		padding:0 .5%;
	}
}
 @media screen and (max-width: 640px) {
    ul.product-item.recommend,
	ul.product-item{
	    padding:5% 0 0 2%;
	        display: block;
		}
	ul.product-item.recommend li,
	ul.product-item li{
		width:32%;
		padding:0 1.5% 4% 1.5%;
		margin:0;
		}
	ul.product-item li .item-group label{
		margin:8% 0 0 0;
		font-size:17px;
		text-align:center;
		letter-spacing:0;
		height:auto;
		}
	ul.product-item.news li .item-group label{
		text-align:left;
		font-size:16px;
		padding: 0 1.5% 8% 1.5%;
	}
	ul.product-item h2{
		font-size:21px;
		margin:0 auto;
		}
	ul.product-item p{
		font-size:14px;
		}
	ul.product-item li .item-group{
		margin:0 auto;
		}
}
 @media screen and (max-width: 480px) {

}
 @media screen and (max-width: 380px) {
	ul.product-item li .item-group label{
		font-size: calc( 0.9rem + 2vw - 8px );
		}
}
.item-price{
	display:block;
	margin:25px 0 0 0;
	padding:15px 0;
	border-top:1px solid #d8d8d8;
	text-align:center;
	color:#CE0027;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
	}
 @media screen and (max-width: 640px) {
	.item-price {
		margin: 10px 0 0 0;
		padding: 10px 0px;
		}
}
.item-price strong{
	font-size:17px;
    font-family: "Open Sans",Helvetica,Arial,sans-serif;
	font-weight:normal;
	vertical-align:baseline;
	}
.item-price span.item-price-event{
	font-size:14px;
	}
.item-price strong:only-child{
	color:#222222;
	}
.item-price > span.item-price-event{
	color:#CE0027;
	}

 @media screen and (max-width: 480px) {
	.item-price strong{
	  font-size:15px;
	  font-weight:bold;
	  }
    .item-price span{ font-size:13px; }
}
/* product item end */	

.main-slider-area.choose-area{
	display: block;
	max-width: 100%;
    position: relative;
    display: block;
    width: 100%;
    background-color: #ffede9;
    background: linear-gradient(345deg, #fffdfd, #ffede9);
    padding: 8% 0;
    margin: 0;
    text-align: center;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	}
.choose-content{
	display: block;
	width: 100%;
	max-width: 1617.55px;
	margin: 0 auto;
	}
.choose-btn{
	display: inline-block;
	width: 28%;
	min-height: 220px;
	margin: 0 1.2%;
	padding: 60px 3vw;
    background: #fff6f4;
    background: linear-gradient(340deg, #ffffff, #fff6f4);
    text-decoration:none; 
    vertical-align: middle;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	-webkit-box-shadow: 0px 0px 60px 20px rgba(249, 185, 185, 0.2);
	-moz-box-shadow: 0px 0px 60px 20px rgba(249, 185, 185, 0.2);
	box-shadow: 0px 0px 60px 20px rgba(249, 185, 185, 0.2);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
.choose-btn:hover{
    background: #ffffff;
    background: linear-gradient(340deg, #ffffff, #ffffff);
	-webkit-box-shadow: 0px 0px 80px 20px rgba(249, 185, 185, 0.5);
	-moz-box-shadow: 0px 0px 80px 20px rgba(249, 185, 185, 0.5);
	box-shadow: 0px 0px 80px 20px rgba(249, 185, 185, 0.5);
    transform: scale(1.1, 1.1);
	}	
.choose-btn.comingsoon{
	opacity: 0.5;
	cursor: default;
	}
.choose-content .choose-btn:hover div span u{
	background-color: #ffffff;
	}
.choose-btn label{
	display: block;	
    margin: 0 0 20px 0;
	color:#da8484;
	font-size: 28px; 
	cursor: pointer;
	letter-spacing: 3px;
	}	
.choose-btn span{
	display: block;
	color:#707070;
	font-size: 14px; 
	line-height: 1.5;
	}	
.main-slider-area.choose-area .petals-title-line span{
	color:#bbbaba;
	font-size: 13px;
	overflow: hidden;
	}
.main-slider-area.choose-area .petals-title-line span u{
	position: relative;
	background-color: #fff9f8;
	text-decoration: none;
	z-index: 1;
	padding: 0 8px;
	}
.main-slider-area.choose-area .petals-title-line span:after{
    display: none;
	}		
.main-slider-area.choose-area .petals-title-line span:before{
	position: absolute;
	left: 0;
	top: 9px;
	margin: 0;
	content: '';
	width: 100%;
	height: 1px;
	background-color: #e4e4e4;
	z-index: 0;
	}			
.main-slider-area.choose-area .choose-btn .petals-title-line {
	width: 100%;
	margin:0 auto 10px auto;
	}	
@media screen and (max-width: 1024px) {
	.choose-btn label {
		font-size: 24px;
		letter-spacing: 2px;
		}
}	
@media screen and (max-width: 768px) {
	.choose-btn {
		width: 30%;
		min-height: 277px;
		margin: 0 0.5%;
		}		
}	
@media screen and (max-width: 640px) {
	.choose-btn:hover{
	    transform: scale(1, 1);
		}
	.choose-btn label {
		font-size: 20px;
		letter-spacing: 1px;
		margin: 0 0 17px 0;
		text-align: center;
		}
	.choose-btn {		
		padding: 20px 3vw 5px 3vw;
		min-height: 0;
		text-align: left;
		}
	.main-slider-area.choose-area .petals-title-line span u,
	.main-slider-area.choose-area .petals-title-line span:after,	
	.main-slider-area.choose-area .petals-title-line span:before,
    .main-slider-area.choose-area .choose-btn .petals-title-line,
	.choose-btn span{
		display: none;
	}			
}	
@media screen and (max-width: 420px) {
	.choose-btn label {
		font-size: 17px;
		letter-spacing: 0;
		}
	.choose-btn span {
		font-size: 13px;
		}
}
@media screen and (max-width: 414px) {
	.choose-btn label{
		font-size: 15px;
		margin: 0;
		}
	.choose-btn{
		background: linear-gradient(340deg, #ffffff, #ffffff);
		min-height: auto;
		padding: 20px 2vw;
		}		
}
@media screen and (max-width: 320px) {
	.choose-btn label{
		font-size: 13px;
		margin: 0;
		}
}
/*animate begin*/
@media screen and (min-width: 900px) { 
	.view-poll.last-child.in-view{
		position: relative;	
		}
	.view-poll.last-child.in-view:after{
	    position: absolute;	
		content: '';	
		display: block;
		width: 100%;
		height: 100%;
		left:0;
		right:0;
		bottom:0;
		top: 0;
		background: #fafafa;
		z-index: 1;
		animation: mask_item 1s;
		transition: transform 1s cubic-bezier(0.3, 0.5, 0, 1);
		transform: translate3d(100%, 0, 0);
		}
	@keyframes mask_item{		
		0% { transform: translate3d(0%, 0, 0);}	
		30% { transform: translate3d(0%, 0, 0);}
		80% { transform: translate3d(99%, 0, 0);}
		100% { transform: translate3d(100%, 0, 0);}
		}	
	@-webkit-keyframes mask_item{		
		0% { transform: translate3d(0%, 0, 0);}	
		30% { transform: translate3d(0%, 0, 0);}
		80% { transform: translate3d(99%, 0, 0);}
		100% { transform: translate3d(100%, 0, 0);}
		}	
	@-moz-keyframes  mask_item{		
		0% { transform: translate3d(0%, 0, 0);}	
		30% { transform: translate3d(0%, 0, 0);}
		80% { transform: translate3d(99%, 0, 0);}
		100% { transform: translate3d(100%, 0, 0);}
		}	
	@-o-keyframes mask_item{		
		0% { transform: translate3d(0%, 0, 0);}	
		30% { transform: translate3d(0%, 0, 0);}
		80% { transform: translate3d(99%, 0, 0);}
		100% { transform: translate3d(100%, 0, 0);}
		}	
}
/*animate end*/
/*animate begin*/
@media screen and (min-width: 900px) { 
	.view-poll.first-child.in-view{
		position: relative;
		animation: feature_item 1.5s;
		}
	.view-poll.zero-child.in-view{
		animation: feature_item 1.8s; 
		}
		@keyframes feature_item{		
			0% { right:-40px;opacity: 0;}	
			40% { right:-40px;opacity: 0; }
			99% { right:-1px;opacity: 1; }
			100% { right:0px;opacity: 1; }
			}	
		@-webkit-keyframes feature_item{		
			0% { right:-40px;opacity: 0;}	
			40% { right:-40px;opacity: 0; }
			99% { right:-1px;opacity: 1; }
			100% { right:0px;opacity: 1; }
			}		
		@-moz-keyframes  feature_item{		
			0% { right:-40px;opacity: 0;}	
			40% { right:-40px;opacity: 0; }
			99% { right:-1px;opacity: 1; }
			100% { right:0px;opacity: 1; }
			}	
		@-o-keyframes feature_item{		
			0% { right:-40px;opacity: 0;}	
			40% { right:-40px;opacity: 0; }
			99% { right:-1px;opacity: 1; }
			100% { right:0px;opacity: 1; }
			}
}			
/*animate end*/

/*animate begin*/
@media screen and (min-width: 900px) { 
	.view-poll.awards-child.in-view{
		position: relative;
		animation: about_item 1.5s;
		}
	.view-poll.awards-pic-child.in-view{
		position: relative;
		animation: aboute_item 1s; 
		}
		@keyframes aboute_item{		
			0% { left:-40px;opacity: 0;}	
			40% { left:-40px;opacity: 0; }
			99% { left:-1px;opacity: 1; }
			100% { left:0px;opacity: 1; }
			}	
		@-webkit-keyframes aboute_item{		
			0% { left:-40px;opacity: 0;}	
			40% { left:-40px;opacity: 0; }
			99% { left:-1px;opacity: 1; }
			100% { left:0px;opacity: 1; }
			}		
		@-moz-keyframes  aboute_item{		
			0% { left:-40px;opacity: 0;}	
			40% { left:-40px;opacity: 0; }
			99% { left:-1px;opacity: 1; }
			100% { left:0px;opacity: 1; }
			}	
		@-o-keyframes aboute_item{		
			0% { left:-40px;opacity: 0;}	
			40% { left:-40px;opacity: 0; }
			99% { left:-1px;opacity: 1; }
			100% { left:0px;opacity: 1; }
			}
}			
/*animate end*/

/*animate begin*/
@media screen and (min-width: 900px) { 
	.view-poll.last-area.in-view{
		position: relative;
		animation: last_item 1s;
		z-index: 1;	
		}
	@keyframes last_item{		
		0% { bottom:-80px;opacity: 0;}	
		40% { bottom:-80px;opacity: 0; }
		99% { bottom:-1px;opacity: 1; }
		100% { bottom:0px;opacity: 1; }
		}	
	@-webkit-keyframes last_item{		
		0% { bottom:-80px;opacity: 0;}	
		40% { bottom:-80px;opacity: 0; }
		99% { bottom:-1px;opacity: 1; }
		100% { bottom:0px;opacity: 1; }
		}	
	@-moz-keyframes  last_item{		
		0% { bottom:-80px;opacity: 0;}	
		40% { bottom:-80px;opacity: 0; }
		99% { bottom:-1px;opacity: 1; }
		100% { bottom:0px;opacity: 1; }
		}		
	@-o-keyframes last_item{		
		0% { bottom:-80px;opacity: 0;}	
		40% { bottom:-80px;opacity: 0; }
		99% { bottom:-1px;opacity: 1; }
		100% { bottom:0px;opacity: 1; }
		}
}	
/*animate end*/

.background-area{
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-position: 25% 25%;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateZ(0x);
	background-image: url(/assets/www/tw/images/petals_mask_1.jpg);
	text-align: center;
	}
.white-box{
	display: inline-block;
	width: 90%;
	max-width: 915px;
	background: rgba(255, 255, 255, 1);
	margin: 5% auto;
	padding: 2% 0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	border-radius: 12px;
	-webkit-box-shadow: 0 10px 80px rgba(199, 199, 199, 0.65);
	-moz-box-shadow: 0 10px 80px rgba(199, 199, 199, 0.65);
	box-shadow: 0 10px 80px rgba(199, 199, 199, 0.65);
	}	
.step-item {
	font-size: 18px;
	}	
.step-title {
	font-size: 30px;
	font-weight: 100;
	}	
.step-item {
	border-top: 4px solid #cccccc;
	}
.ball {
	top: -13px;
	}
.step-area h4 {
	margin: 0 0 10px 0;
	}

.font-current span{
    color: #707070;
}	
@media screen and (max-width: 768px){
	.background-area{
		background-position: 40%;
		}
	.white-box{
		width: 100%;
		margin: 0 auto;
		border-radius: 0;
		padding: 2%;
		background-color: rgba(241, 241, 241, 0.6);
		}
	.half-right,
	.half-left {
		display: none;
		}
	.background-area{
		background-position: 100%;
		}		
}	
@media screen and (max-width: 320px){
	.main-slider-area ol li{
		font-size: 14px!important;
		}
}			
@media screen and (max-width: 640px){
	.product-tab-span{
        font-size: 22px;
	}
	.step-title {
		font-size: 22px;
		}	
	.step-item{
		font-size: 14px;
		letter-spacing: 0;
		}
	.main-slider-area ol li{
		font-size: 16px;
		letter-spacing: 0;
		}
	.main-slider-area.store .petals-deatil{
        width: 100%;
        padding: 10% 0 10% 20%;
        display: block;	
		}
	.main-slider-area.store .petals-pic{
		display: none;
		}
}
@media screen and (max-width: 480px){
	.step-current, .step-item {
		padding: 15px 5px 8px 5px;
		}
	.step-area h4 {
		margin: 0 0 5px 0;
		}
}



.petals-store-list{
	display: block;
	width: 95%;
	max-width: 1680px;
	margin: 0 auto;
	text-align: center;
	}
.petals-store-list ul{
    display: inline-block;
    width: 100%;    
    padding: 7% 0 0 0;
    list-style-type: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    vertical-align: top;    
	}	
.petals-store-list ul li{
	position: relative;
	display: inline-block;
	width:30%;
	padding:5% 0; 
	margin:0 1% 2.4% 1%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	vertical-align:top;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	}	
.petals-store-list ul li:nth-child(1){
	background-image: url(/assets/www/tw/images/petals_store_2.jpg);
	}
.petals-store-list ul li:nth-child(2){
	background-image: url(/assets/www/tw/images/petals_store_8.jpg);
	}	
.petals-store-list ul li:nth-child(3){
	background-image: url(/assets/www/tw/images/petals_store_3.jpg);
	}	
.petals-store-list ul li:nth-child(4){
	background-image: url(/assets/www/tw/images/petals_store_4.jpg);
	}	
.petals-store-list ul li:nth-child(5){
	background-image: url(/assets/www/tw/images/petals_store_5.jpg);
	}	
.petals-store-list ul li:nth-child(6){
	background-image: url(/assets/www/tw/images/petals_store_6.jpg);
	}	
.petals-store-list ul li:nth-child(7){
	background-image: url(/assets/www/tw/images/petals_store_7.jpg);
	}
.petals-store-list ul li:nth-child(8){
	/*background-image: url(/assets/www/tw/images/petals_store_9.jpg);*/
	}		
.petals-store-list ul li:nth-child(9){
	/*background-image: url(/assets/www/tw/images/petals_store_10.jpg);*/
	}					
.petals-store-list ul li:after{
	background: rgba(173, 159, 161, 0.5);
	content: "";	
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;	
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 1;
	}	

.store-box{
	position: relative;
	width: 70%;
	min-height: 285px;
	padding:10% 7%; 
	margin:0 auto;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	background-color: rgba(255, 255, 255, 0.95);
	text-align: left;
	z-index: 2;
	}	
.store-box img{
	display: none;
	}	
 @media screen and (max-width: 1280px) {
	.store-box {
		width: 85%;
		}
	 .store-spec{
		font-size: 14px;
		margin: 0 0 5px 0;
		}
 } 		
 @media screen and (max-width: 900px) {
  .petals-store-list ul li{ 
    width:47%;
    } 
 } 	 	
.store-name{
	font-size: 22px;
	margin: 0 0 15px 0;
	letter-spacing: 2px;
	color: #dc8574;
	}
.store-spec{
	font-size: 15px;
	margin: 0 0 5px 0;
	}
.store-spec a{
	text-decoration: none;
	}	
.store-spec span{
	color: #222222;	
	}
.store-spec label a,	
.store-spec label{
	color: #707070;	
	text-decoration: none;
	}		
 @media screen and (max-width: 640px) {
	.petals-store-list ul {
		padding: 5% 0;
		}
	.store-box{
		width: 100%;
		padding:2% 8%; 
		min-height: 190px;
		background-color: transparent;
		}	
	.store-box img{
		display: block;
		width: 100%;
		margin: 0 0 20px 0;
		}	
	.petals-store-list ul li {
		padding: 2% 0;
		}
	 .store-name{
		font-size: 19px;
		margin: 5px 0 8px 0;
		letter-spacing: 0px;
		font-weight: 600;
		}
	 .store-spec{
		font-size: 14px;
		}	
	.petals-store-list ul li:nth-child(1),
	.petals-store-list ul li:nth-child(2),	
	.petals-store-list ul li:nth-child(3),	
	.petals-store-list ul li:nth-child(4),
	.petals-store-list ul li:nth-child(5),	
	.petals-store-list ul li:nth-child(6),
	.petals-store-list ul li:nth-child(5),	
	.petals-store-list ul li:nth-child(7),
	.petals-store-list ul li:nth-child(8),	
	.petals-store-list ul li:nth-child(9){
		background-image:none;
		background-color: #f7f7f7;
		border-radius: 12px;
		background: linear-gradient(to bottom, #f7f7f7, #ffffff);
		}
	.petals-store-list ul li:after{
		display: none;
		}	
	.petals-store-list ul li:last-child{
		width: 95%;
		}
	.petals-store-list ul li{
		margin:0;
		}	
 } 	 	
  @media screen and (max-width: 320px) {
	 .store-spec label{
		display: block;
		}
 } 	 	

.main-slider-area.flavors.note{
	padding: 7.5% 0;
	}
@media screen and (max-width: 640px){
	.main-slider-area.note .petals-deatil {
		padding: 0;
		
		}
	.main-slider-area.note .petals-title-line span:after {
		width: 90px;
		}
	.main-slider-area.flavors.note {
		background-color: #f7f7f7;
		}
}

.gray-bg {
    display: block;
    width: 100%;
}

.gray-bg {
    background-color: #fafafa;
}