*{
	font-family: "Noto Sans TC";
	font-weight: 300;
	box-sizing: border-box;
	font-size: 16px;
}


html,body{
	width: 100%;
	padding: 0;
	margin: 0;
	color: #757575;
}

a{
	text-decoration: none;
	display: inline-block;
}

a img, div img{
	width: 100%;
	vertical-align: middle;
}

/*div, input ,label,textarea{
	box-sizing: border-box;
}
*/
h1,h2,h3,h4,h5,h6,p,ul,li{
	padding: 0;
	margin: 0;
}

h1,h2,h3,h4,h5,h6{
	font-weight: 500;
}
p{
	text-align: justify;
}

span{
	color: #D8B22C;
	font-weight: 500;
}


.m_show{
	display: none;
}

/*------------------------------------------------*/
/*video*/



header{
	width: 100%;
	/*height: 60vh;*/
	height: 90vh;
	overflow: hidden;
	position: relative;
	background-color: #000;
	margin-bottom: 60px;
}

header::before{
	content: '';
	width: 0%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.3);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
}

header.stop::before{
	width: 100%;
}



.volume_btn{
	position: absolute;
	right: 30px;
	bottom: 30px;
	width: 40px;
	height: 40px;
	display: inline-block;
	z-index: 2;
	cursor: pointer;
}
.sound_open,.sound_close{
	display: none;
}

.sound_open.show{
	display: inline-block;
}
.sound_close.show{
	display: inline-block;
}

.play_btn{
	position: absolute;
/*	right: 25px;
	bottom: 70px;*/
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 0px;
	height: 0px;
	z-index: 5;
	display: inline-block;
	cursor: pointer;
	transition: 0.25;
}

header.stop .play_btn{
	width: 50px;
	height: 50px;
}


.video{
	min-width: 100%;
/*	min-height: 100%;*/
/*	width: auto;
	height: auto;*/
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}



.scroll_bar{
	width: 10px;
	position: absolute;
	bottom: 30px;
	left: 50%;
	z-index: 5;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}


.scroll_bar_txt{
	color: #fff;
	margin-top: 10px;
}


.scroll_arrow.show{
	animation: scroll_ani 0.5s alternate infinite ease-in-out;
}



@keyframes scroll_ani{

	0%{
		transform: translateY(0);
	}

	100%{
		transform: translateY(10px);
	}
}






/*------------------------------------------------*/





footer{
	width: 100%;
	text-align: center;
	color: #fff;
	background-color: #153448;
	padding: 15px 0;
	font-size: 13px;
	position: relative;
}





nav{
	height: 70px;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	transition: .5s;
	overflow: hidden;
	z-index: 100;
	background-color: transparent;

}
nav.show{
	display: inline-block;
	height: 100vh;
	background-color: #153448;
}

nav.change_color{
	background-color: #153448;
}


.menu{
	position: absolute;
	right: 50px;
	top: 50%;
	transform: translateY(-50%);
}

.menu_item{
	color: #fff;
	display: inline-block;
	padding: 0 20px;
	position: relative;
}

.menu_item + .menu_item::before{
	content: '';
	width: 1px;
	height: 17px;
	background-color: #fff;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-45%);
	opacity: 0.3;
}


.menu_bar{
	width: 45px;	
	height: 45px;
	position: absolute;
	right: 30px;
	top: 12px;
	display: none;
}

.menu_bar img{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: 0.3s;
	opacity: 0;
	width: 0;
	height: 0;

}


.bar_open.show ,.bar_close.show{
	opacity: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
}




/*-------------------------------------------------*/

.container{
	width: 1080px;
	margin: 0 auto;
}


.container_full{
	width: 100%;
}


.title{
	color: #153448;
	font-size: 40px;
	text-align: center;
	margin-bottom: 10px;
}
.title span{
	font-size: 50px;
	margin-left: 10px;
	margin-right: 10px;

}
.title_light,
.price_title_light{
	color: #F2E2AC;
	font-size: 40px;
	text-align: center;
	margin-bottom: 40px;	
}
.price_title_light{
	margin-bottom: 30px;	
}


.title2{
	text-align: center;
	color: #898989;
	margin-bottom: 40px;
}



/*-------------------------------------------------*/

/*about_wrap*/
.about_wrap{
	margin-bottom: 100px;
	position: relative;
}
.about_wrap .title{
	text-align: left;
}
.about_img{
	width: 60%;
	height: 600px;
}
.about_img img{
	height: 100%;
	object-fit: cover;
}
.about_txt{
	width: 50%;
	box-shadow: 0 5px 10px rgba(0,0,0,0.1);
	/*border: 1px solid #000;*/
	padding: 80px;
	position: absolute;
	right: 0;
	bottom: 100px;
	background-color: #fff;
	padding-right: 10%;

}






/*-------------------------------------------------*/

/*shop_power_wrap*/

.shop_power_wrap{
	position: relative;
	margin-bottom: 140px;
}

.shop_power_wrap h5{
	font-size: 28px;
	line-height: 50px;
}

.shop_power_wrap h5 span{
	font-size: 35px;	
}

.shop_power_img{
	width: 900px;
	height: 600px;
	position: absolute;
	/*top: -300px;*/
	right: 0;
	top: -40px;
	z-index: -1;
	overflow: hidden;


}

.shop_power_title{
	margin-bottom: 30px;
	text-shadow: 1px 2px 2px #fff;

}

.shop_power_img img{
	position: absolute;
	right: -100px;
	top: 0;
}

.shop_power_book{
	width: 35%;
	border: 1px solid #E5E5E5;
}

.shop_book_txt{
	width: 60%;
	color: #b7b7b7;
	margin-left: 30px;
}

.shop_book_txt p{
	font-size: 14px;
	text-shadow: 2px 2px 2px #fff;

}


.power_book{
	width: 600px;
	display: flex;
	align-items: flex-end;
}



/*-------------------------------------------------*/

/*days_wrap*/

.days_wrap{
	margin-bottom: 120px;
}

.days_wrap h3{
	margin-bottom: 80px;
	text-align: center;
	font-size: 28px;
}

.days_wrap h3 span{
	font-size: 35px;
	margin-left: 5px;
	margin-right: 5px;
	border-bottom: 2px solid #D8B22C;
}

.days_item_g{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.days_item{
	width: 20%;
	display: flex;
	flex-direction: column;
	align-items: center;
	transform: scale(0);
	transition: 0.5s;
	transition-delay: 0.5s;
	opacity: 0;
}

.days_item_change{
	transform: scale(1);
	opacity: 1;
}

.days_circle{
	width: 128px;
	height: 128px;
	background-color:  #153448;
	border-radius: 999em;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
}

/*.days_wrap .days_number{
	font-size: 58px;
	font-weight: 500;
	color: #FFE27B;
}*/



.days_word{
	margin-top: -8px;
	color: #fff;
}

.days_txt{
	color:  #153448;
	font-weight: 500;
	font-size: 18px;
}




/*-------------------------------------------------*/


/*popular_wrap*/
.popular_wrap{
	width: 100%;
	margin-bottom: 120px;
	position: relative;

}

.days_bg{
	max-width: 990px;
	width: 100%;
	height: 400px;
	position: absolute;
	left: 0;
	top: -400px;
	overflow: hidden;
	z-index: -1;
	opacity: 0.75;
}

.days_bg img{
	position: absolute;
	top: 0;
	left: 0;
}



.popular_img{
	background: url("../img/popular.jpg") top center no-repeat;
	width: 100%;
	height: 700px;
	background-size: cover;
	margin-bottom: 100px;
}
.popular_wrap p{
	width: 650px;
	margin: 0 auto; 
	text-align: center;
	margin-bottom: 20px;
}

.popular_wrap h4{
	text-align: center;
	font-size: 32px;
	color: #d8b22c;
}

/*-------------------------------------------------*/


/*product*/

.product_wrap{
	background: url("../img/background.jpg") no-repeat fixed;
	width: 100%;
	background-size: cover;
	padding: 150px 0;
	margin-bottom: 120px;
	position: relative;
	overflow: hidden;
}


/*illustrator*/

.product_illustrator_left,
.product_illustrator_right{
/*	width: 500px;
	height: 300px;*/
	position: absolute;
	overflow: hidden;
}

.product_illustrator_right img{
	position: absolute;
	top: 0;
	left: 0;
}

.product_illustrator_left img{
	position: absolute;
	top: 0;
	right: 0;

}



.product_illustrator01,
.product_illustrator03,
.product_illustrator05{
	right: 0;
}

.product_illustrator02,
.product_illustrator04,
.product_illustrator06{
	left: 0;
}

.product_illustrator01{
	top: 300px;
	width: 370px;
	padding-top: 79.5%;
}


.product_illustrator02{
	top: 600px;
	width: 473px;
	padding-top: 39.3%;
}

.product_illustrator03{
	top: 1050px;
	width: 505px;
	padding-top: 27.9%;
}

.product_illustrator04{
	top: 1300px;
	width: 400px;
	padding-top: 56.6%;
}


.product_illustrator05{
	top: 1800px;
	width: 302px;
	padding-top: 89.4%;
	opacity: 0.6;
}

.product_illustrator06{
	top: 2250px;
	width: 400px;
	padding-top: 44.5%;
	opacity: 0.75;
}










.product_wrap p{
	color: #fff;
}

.product_title{
	text-align: center;
	font-size: 28px;
	color: #fff;
	margin-bottom: 70px;
}

.product_title span{
	font-size: 35px;
	color: #f2e2ac;
	border-bottom: 1px solid #f2e2ac;
}

.product_descript{
	color: #fff;
	margin-bottom: 100px;
}


.product_box{
	width: 100%;
	padding: 40px 0;
	border: 1px solid rgba(255,255,255,0.5);
	background-color: rgba(10,15,35,0.5);
	padding-top: 220px;
	position: relative;
}

.slick-slide:focus { outline:none;} 






.product_item{
	display: flex;
	flex-direction: column;
}

.product_item_content{
	padding: 30px 80px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
}

.product_item_img{
	width: 250px;
	height: 250px;
	border-radius: 999em;
	overflow: hidden;
}

.product_item_img{
	height: 100%;
	object-fit: cover;
}
.product_item_txt{
	width: 70%;
	margin-left: 30px;
	position: relative;
}

.product_item_title{
	color: #f2e2ac;
	font-size: 24px;
	margin-bottom: 10px;
	transform: translateY(20px);
	opacity: 0;
	transition: 0.2s ease-out;
}

.product_item_title2{
	color: #fff;
	font-size: 18px;
	margin-bottom: 30px;
	transform: translateY(20px);
	opacity: 0;
	transition: 0.3s ease-out;
	transition-delay: 0.25s;
}

.product_item_txt .product_item_word{
	transform: translateY(20px);
	opacity: 0;
	transition: 0.3s ease-out;
	transition-delay: 0.5s;

}

.product_days{
	color: #f2e2ac;
	font-size: 18px;
	font-weight: 500;
	position: absolute;
	top: -60px;
	right: 0;
	transform: scale(0);
	opacity: 0;
	transition: 0.5s ease-out;
	z-index: -1;
	transition-delay: 0.25s;
}
.product_days span{
	color: #f2e2ac;
	font-size: 120px;
}


/*»¬„Ó•rЧ¹û*/

.product_item.show .product_item_title{
	transform: translateY(0px);
	opacity: 1;
}

.product_item.show .product_item_title2{
	transform: translateY(0px);
	opacity: 1;
}

.product_item.show .product_item_word{
	transform: translateY(0px);
	opacity: 1;
}

.product_item.show .product_days{
	transform: scale(1);
	opacity: 1;
}





/*slick*/
.btn-left{
	width: 30px;
	height: 30px;
	display: inline-block;
	cursor: pointer;
	position: absolute;
	left: -50px;
	top: 50%;
	transform: translateY(-50%);
	padding: 10px;
	border: none;
	outline: none;
	background-color: transparent;
}

.btn-left::before,.btn-left::after{
	content: "";
	display: inline-block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: 0.25s;
}

.btn-left::before{
	background: url(../img/img_arrow-left.svg)  no-repeat center center;
}

.btn-left::after{
	background: url(../img/img_arrow-left-hover.svg)  no-repeat center center;
	opacity: 0;
}


.btn-left:hover::before{
	opacity: 0;
}

.btn-left:hover::after{
	opacity: 1;
}


.btn-right{
	width: 30px;
	height: 30px;
	display: inline-block;
	cursor: pointer;
	position: absolute;
	right: -50px;
	top: 50%;
	transform: translateY(-50%);
	padding: 10px;
	border: none;
	outline: none;
	background-color: transparent;
}


.btn-right::before,.btn-right::after{
	content: "";
	display: inline-block;
	width: 100%;
	height: 100%;	
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: 0.25s;
}

.btn-right::before{
	background: url(../img/img_arrow-right.svg)  no-repeat center center;
}

.btn-right::after{
	background: url(../img/img_arrow-right-hover.svg)  no-repeat center center;
	opacity: 0;
}

.btn-right:hover::before{
	opacity: 0;
}

.btn-right:hover::after{
	opacity: 1;
}


/*slick*/
.product_box.slick-dotted.slick-slider{
	margin-bottom: 100px;
}

.btn_txt{
	width: 120px;
	color: #D7D4B7;
	position: absolute;
	top: -20px;
	left: 50%;
	transform: translateX(-50%);
	font-size: 15px;
	font-weight: 500;
	color: #fff;

}
.slick-active .btn_txt{
	color: #F2E2AC;
}

.product_box .slick-dots{
	z-index: 5;
	width: 85%;
	left: 50%;
	transform: translateX(-50%);
	bottom: calc(100% - 150px);
}

.product_box .slick-dots::before{
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 999em;
	background-color: #fff;
	position: absolute;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
}

.product_box .slick-dots::after{
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 999em;
	background-color: #fff;
	position: absolute;
	top: 50%;
	right: 0px;
	transform: translateY(-50%);
}


.product_box .slick-dots li{
	width: 20%;
	height: initial;
	opacity: 1;
	margin: 0;
/*	margin: 20px 0;
	padding: 0 50px;*/
}

.product_box .slick-dots li button{
	font-size: 16px;
	font-weight: 500;
	color: #153448;
	width: 40px;
	height: 40px;
	position: relative;
	padding: 0;
	z-index: 99;
	border-radius: 999em;
	background-color: #fff;
	transition: .25s;
	margin: 0 auto;	
}


.product_box .slick-dots li button:before{
	opacity: 0;
}


.product_box .slick-dots li button:hover{
	background-color: #F2E2AC;
	width: 50px;
	height: 50px;
}

.product_box .slick-dots li.slick-active button{
	background-color: #F2E2AC;

	opacity: 1;
	width: 50px;
	height: 50px;
}

.product_box .slick-dots li button:hover .btn_txt{
	color: #F2E2AC;
}


.product_box .slick-dots li::before{
	content: '';
	width: 100%;
	height: 2px;
	background-color: rgba(255,255,255,0.2);
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}




/*collapse-content*/


.product_collapse{
	padding: 0 80px;	
	opacity: 0;
	transform: translateY(20px);
	transition: 0.3s ease-out;
	transition-delay: 0.7s;
}

.collapse_btn_g{
	width: 750px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

.product_item.show .product_collapse{
	transform: translateY(0px);
	opacity: 1;
}




.collapse_btn{
	width: 200px;
	padding: 10px 0; 
	/*background-color: #f2e2ac;*/
	border: 1px solid #f2e2ac;
	border-radius: 999em;
	text-align: center;
	margin: 10px 20px;
	color: #f2e2ac;
	cursor: pointer;
	transition: 0.25s;
}

.collapse_btn.active,.collapse_btn:hover{
	background-color: #f2e2ac;
	color: #000;
}


.collapse_box{
	width: 100%;
	height: 150px;
	margin-top: 30px;
	color: #555;
	position: relative;
}

.collapse_content{
	width: 100%;
	height: 0;
	border: 1px solid rgba(255,255,255,0.5);
	background-color: rgba(136,136,136,0.1);
	opacity: 0;
	position: absolute;
	top: 0;
	transition: 1s;
	padding-left: 50px;
	padding-right: 50px;
	overflow: hidden;
}

.collapse_content.change{
	width: 100%;
	height: initial;
	opacity: 1;
	padding: 35px 50px;

}

.collapse_title{
	color: #f2e2ac;
	font-size: 20px;
	font-weight: 500;
	margin-bottom: 20px;
}
.collapse_txt{
	color: #fff;
}


.product_collapse_ps{
	text-align: center;
	color: #C6C6C6;
	/*padding-top: 10px;*/
	height: 50px;
	line-height: 50px;
}


/*-------------------------------------------------*/

/*price*/

.price_box{
	width: 100%;
	padding: 40px 50px;
	padding-top: 60px;
	border: 1px solid rgba(255,255,255,0.5);
	background-color: rgba(10,15,35,0.5);
}

.price_item{
	width: 80%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	/*border-bottom: 1px solid #fff;*/
	margin: 0 auto;
	padding: 0 100px;
	padding-top: 15px;
	margin-bottom: 15px;
	position: relative;
}

.price_item + .price_item{
	border-top: 1px solid rgba(255,255,255,0.5);
}


.price_title{
	color: #fff;
	font-weight: 500;
	font-size: 22px;
}

.price_days{
	color: #f2e2ac;
	font-weight: 500;
	font-size: 20px;
	align-self: flex-start;
}

.price_txt_box{
	width: 125px;
	font-weight: 500;
	font-size: 20px;
	display: inline-block;
	background-color: #fff;
	color: #000;
	padding: 5px 0px;
	text-align: center;
}

.price_right_g{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 245px;
	position: relative;
	left: 88px;
}
.price_right_txt{
	color: #fff;
	margin-top: 10px;
}

.price_total_item{
	width: 100%;
/*	padding: 0 100px;
	margin: 0 auto;*/
	border-top: 1px solid rgba(255,255,255,0.5);
}


.price_item::before{
	content: '+';
	font-size: 30px;
	color: #f2e2ac;
	font-weight: 500;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.price_item:nth-of-type(1):before{
	display: none;
}



.price_total_right{
	position: relative;
}
.price_total_right::before{
	content: '';
	width: 150%;
	height: 2px;
	background-color: #f2e2ac;
	display: inline-block;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);	
}

.price_gold{
	width: 125px;
	text-align: center;
	font-weight: 500;
	font-size: 20px;
	display: inline-block;
	background-color: #f2e2ac;
	color: #000;
	padding: 5px 0px;
	margin-top: 20px;
}
.price_discount{
	margin-top: 20px;
	color: #fff;
	margin-right: -5px;
}

.price_countdown{
	font-size: 40px;
	color: #f2e2ac;
	font-weight: 500;
	text-align: center;
	margin-top: 50px;
}


.mouse{
	width: 100px;
	height: 100px;
	position: absolute;
	top: 0;
	left: 0;
  opacity: 0;
  pointer-events: none;
  z-index: 999;
}

.mouse img{
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
}


/*-------------------------------------------------*/


/*form*/

.form{
	width: 80%;
	margin: 0 auto;
	margin-bottom: 150px;
}

.form_title, .form_input{
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
}
.form_title{
	margin-bottom: 5px;
}

.form_input{
	border: 1px solid #AAA9A9;
	border-radius: 2px;
	padding: 3px;
	padding-left: 5px;
	color: #757575;
}



.form_item{
	width: 100%;
	margin-bottom: 12px;
}

.form_item textarea{
	display: inline-block;
	width: 100%;	
}

.form_item span{
	color: #FF3D3F;
	font-weight: 300;
}

.form_item_g{
	display: flex;
	justify-content: space-between;
}

.form_item_g .form_item{
	width: 48%;
}


/*radio*/
.radio_item_g{
	width: 48%;
	display: flex;
}

.radio_item{
	display: flex;
	align-items: center;
	margin-top: 10px;
}
.radio_item + .radio_item{
	margin-left: 20px;
}

.radio_item input{
    opacity: 0;
    display: inline-block;
}

.label_radio{
    position: relative;
    display: inline-block;
}

.label_radio::before{
    content: '';
    width: 13px;
    height: 13px;
    border-radius: 999em;
    border: 1px solid #AAA9A9;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -20px;

}
.label_radio::after{
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 999em;
    border: 1px solid #757575;
    background-color: #757575;
    position: absolute;
    left: -16px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    transition: 0.25s;
}

.radio_item input:checked + .label_radio::after{
    opacity: 1;
}



/*checkbox*/

.checkbox_item_g{
	display: inline-block;
}
.checkbox_item_g + .checkbox_item_g{
	margin-left: 20px;
}

.checkbox_item{
	display: inline-block;
	margin-bottom: 10px;
}

.checkbox_item + .checkbox_item{
	margin-left: 20px;
}

.checkbox_item input{
    opacity: 0;
}

.label_checkbox{
    position: relative;
}

.label_checkbox::before{
  content: '';
  width: 13px;
  height: 13px;
  border-radius: 2px;
  border: 1px solid #AAA9A9;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -20px;
}

.label_checkbox::after{
  content: '';
  background-image: url("../img/check.svg");
  width: 11px;
  height: 11px;
  color: #fff; 
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -18px;
  opacity: 0;
  transition: 0.25s;
}

.checkbox_item input:checked + .label_checkbox::after{
    opacity: 1;
}

.checkbox_item input:checked + .label_checkbox::before{
  opacity: 1;
  border-color: #757575;
  background-color: #757575;
}


.form_select{
	appearance: none;
	color: #757575;
	
}

.select_label{
	position: relative;
}

.select_label::before{
	content: "";
	display: inline-block;
    background-image: url("../img/select.svg");
    width: 15px;
    height: 15px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.code_input{
	width: 350px;
}
.code_img{
	width: 100px;
	display: inline-block;
	margin-left: 20px;
}
.code_img img{
	width: 100%;
	margin-top: -5px;
}



.index_btn{
	display: block;
	background-color: #fff;
	border: 1px solid #AAA9A9;
	color: #AAA9A9;
	padding: 5px 40px;
	cursor: pointer;
	border-radius: 999em;
	margin: 50px auto;
	transition: 0.25s;
}

.index_btn:hover{
	background-color: #AAA9A9;
	color: #fff;
}

.form_input:focus{
	outline: none;
}



/*------------------------------------------------*/

/*ScrollMagic*/


.shop_power_title,
.days_wrap h3,
.popular_txt .title,
.popular_txt .title2,
.popular_wrap p,
.popular_wrap h4,
.product_wrap .product_title,
.product_wrap .title_light,
.product_wrap .product_descript,
.product_wrap .product_box,
.product_wrap .price_box,
.price_box .price_title_light,
.price_item{
	opacity: 0;
	transition: 0.5s;
	transform: translateY(20px);
}

.shop_power_wrap.show .shop_power_title,
.days_wrap.show.days_wrap h3,
.popular_wrap.show .popular_txt .title,
.popular_wrap.show .popular_txt .title2,
.popular_wrap.show p,
.popular_wrap.show h4,
.product_wrap.show .product_title,
.product_wrap.show .title_light,
.product_wrap.show .product_descript,
.product_wrap.show .product_box,
.product_wrap.show .price_box,
.price_box.show .price_title_light,
.price_item.show{
	opacity: 1;
	transform: translateY(0px);
}

.popular_wrap.show .popular_txt .title2,
.product_wrap.show .title_light{
	transition-delay: 0.3s;
}

.popular_wrap.show p,
.product_wrap.show .product_descript{
	transition-delay: 0.5s;
}

.popular_wrap.show h4,
.product_wrap.show .product_box{
	transition-delay: 0.7s;
}





/*------------------------------------------------*/

/*odometer*/

.days_number.odometer{
	transition: 0.5s;
}

.days_number.odometer,
.days_number.odometer span,
.days_number.odometer.odometer-auto-theme .odometer-digit .odometer-value, 
.days_number.odometer.odometer-theme-default .odometer-digit .odometer-value,
.days_number.odometer.odometer-auto-theme, 
.days_number.odometer.odometer-theme-default {
	font-weight: 500;
	font-size: 58px;
	color: #FFE27B;
}


.days_number.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, 
.days_number.odometer.odometer-theme-default .odometer-digit .odometer-digit-inner{
	bottom: 10px;
}

/*------------------------------------------------*/


@media screen and (max-width:1200px){
	.btn-right,.btn-left{
		display: none !important;
	}


}


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

	.container{
		width: 100%;
		padding-left: 15px;
		padding-right: 15px;
	}

	/*video*/

	header{
		padding-top: 56.2%;
		height: initial;
	}

	.video{
		min-width: initial;
		width: 100%;
		left: 50%;
		top: 0%;
		transform: translate(-50%,0%);
	}

	/*shopBook*/
	.shop_power_wrap{
		margin-bottom: 0;
	}
	.shop_power_title{
		text-align: center;
		margin-bottom: 30px;
	}
	.power_book {
		margin: 0 auto;
		width: 80%;
		flex-direction: column;
		align-items: center;
		margin-bottom: 20px;
	}
	.shop_power_book{
		width: 50%;
		margin-bottom: 20px;
	}
	.shop_book_txt{
		width: 100%;
		margin-left: 0;
	}
	.shop_book_txt p{
		text-align: center;
	}
	.shop_power_img{
		position: relative;
		width: 80%;
		margin: 0 auto;
		height: initial;
		padding-top: 50%;
	}
	.shop_power_img img{
		right: 0;
	}

	/*product*/
	.product_wrap{
		padding: 100px 0;
	}

	.product_title, .title_light,
	.price_title_light,
	.product_descript{
		width: 80%;
		margin: 0 auto;
		margin-bottom: 40px;

	}
	.collapse_box{
		height: 170px;
	}

	/*form*/
	.checkbox_item_g{
		width: 100%;
	}
	.checkbox_item_g + .checkbox_item_g{
		margin-left: 0px;
	}

}


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

	/*menu*/
	.menu{
		width: 100%;
		left: 0;
		top: 70px;
		padding: 50px 0;		
		transform: none;
	}
	.menu_bar{
		display: inline-block;
	}
	.menu_item{
		width: 100%;
		text-align: center;
		padding: 0;
	}
	.menu_item + .menu_item::before{
		height: 0;
		width: 0;
	}
	.menu_item + .menu_item{
		margin-top: 20px;
	}

	/*day*/
	.days_wrap{
		margin-bottom: 80px;
	}
	.days_item_g{
		justify-content: center;

	}

	.days_number.odometer,
	.days_number.odometer span,
	.days_number.odometer.odometer-auto-theme .odometer-digit .odometer-value, 
	.days_number.odometer.odometer-theme-default .odometer-digit .odometer-value,
	.days_number.odometer.odometer-auto-theme, 
	.days_number.odometer.odometer-theme-default {
		font-size: 50px;
	}

	


	

	.days_circle{
		width: 110px;
		height: 110px;
	}


	/*popular*/
	.popular_img{
		background-size: contain;
		height: initial;
		padding-top: 55%;
		margin-bottom: 50px;
	}

	/*product*/
	.product_box{
		padding-top: 200px;
	}
	.product_item_img{
		margin-bottom: 30px;
	}
	.product_item_content{
		flex-direction: column;
		padding: 0;
		margin-bottom: 40px;
	}
	.product_item_txt{
		width: 80%;
		margin-left: 0;
	}

	.product_collapse{
		padding: 0 50px;
	}
	.collapse_btn_g{
		width: 100%;
		justify-content: center;
	}
	.collapse_btn{
		width: 180px;
		font-size: 14px;
		margin: 10px;
	}

	.price_item{
		padding: 0 60px;
		padding-top: 40px;
	}

	.price_days{
		margin-bottom: 20px;
	}


	/*form*/
	.select_label::before {
		display: none;
	}
	.form_select{
		appearance: auto;
	}



	.product_illustrator01{
		top: 200px;
		width: 180px;
	}	
	.product_illustrator02{
		top: 700px;
		width: 230px;
	}	
	.product_illustrator03{
		top: 1180px;
		width: 350px;
	}	
	.product_illustrator04{
		top: 1400px;

		width: 240px;
	}	
	.product_illustrator05{
		width: 150px;
	}	
	.product_illustrator06{
		width: 255px;
	}	
	.mouse{
		display: none;
	}



}




@media screen and (max-width:800px){
	/*form*/
	.form_item_g{
		flex-direction: column;
	}
	.form_item_g .form_item,.radio_item_g{
		width: 100%;
	}
	.radio_item_g{
		margin-bottom: 12px;
	}

}




@media screen and (max-width:750px){
	/*about*/
	.about_wrap{
		margin-bottom: 20px;
	}
	.about_img{
		width: 100%;
		height: 400px;
	}
	.about_txt{
		width: 80%;
		position: relative;
		top: -50px;
		margin: 0 auto;
		padding: 50px;
	}
	.about_wrap .title{
		text-align: center;
	}
	.title,.title_light,
	.price_title_light{
		font-size: 26px;
	}


	/*title*/
	.days_wrap h3,
	.shop_power_title,.popular_txt{
		width: 80%;
		margin: 0 auto;
		margin-bottom: 60px;
	}

	.shop_power_wrap h5,
	.days_wrap h3,
	.product_title{
		font-size: 26px;
	}

	.shop_power_wrap h5 span,
	.days_wrap h3 span,
	.product_title span,
	.title span,
	.price_countdown{
		font-size: 32px;
	}

	.popular_wrap h4{
		font-size: 26px;
	}

	.price_title{
		font-size: 20px;

	}
	.price_days,.price_txt_box{
		font-size: 18px;

	}


	/*popular*/
	.popular_wrap{
		margin-bottom: 20px;
	}
	.popular_wrap p{
		width: 100%;
	}

	.days_item{
		margin-bottom: 50px;
		width: 33%;
	}


	/*product*/
	.product_box{
		border: none;
		/*border-bottom: 1px solid rgba(255,255,255,0.5);*/
		padding-bottom: 80px;
		padding-top: 200px;
		background-color: transparent;
	}
	.product_box.slick-dotted.slick-slider{
		margin-bottom: 0;
		padding-bottom: 10px;
	}
	.product_box .slick-dots {
		width: 95%;
	}
	.btn_txt{
		font-size: 13px;
	}

	.product_days{
		top: -40px;
	}
	.product_days span{
		font-size: 60px;
	}
	.collapse_btn{
		width: 160px;
		margin: 10px;
	}
	.product_collapse{
		padding: 0 20px;
	}
	.product_box .slick-dots{
		width: 95%;
	}


	/*price*/
	.price_box{
		padding: 40px 10px;	
		border: none;
		background-color: transparent;
	}



	.product_item{
		padding-bottom: 30px;
		position: relative;
		overflow: hidden;
		/*border-bottom: 1px solid rgba(255,255,255,0.5);*/
	}


	.product_item::before{
		content: '';
		display: inline-block;
		background-color: rgba(255,255,255,0.5);
		width: 100%;
		height: 1px;
		position: absolute;
		bottom: 0;
		right: 100%;
		transition: 0.5s;
		transition-delay: 0.7s;
	}

	.product_item:hover::before,.product_item.show::before{
		right: 0;
	}



	.price_item{
		flex-direction: column;
		align-items: center;
		padding-top: 20px;
		margin-bottom: 20px;
	}

	.price_left{
		text-align: center;
	}
	.price_right_g{
		left: 0;
		align-items: center;
	}

	.price_right_txt{
		text-align: center;
	}
	.price_title_light{
		margin-bottom: 20px;
	}
	.price_days{
		align-self: initial;
	}






}


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

	.m_show{
		display: block;
	}
	.pc_show{
		display: none;
	}

	nav{
		height: 55px;
	}


	header{
		padding-top: 70%;
		margin-bottom: 20px;
	}

	.video{
		width: 160%;
		top: 50%;
		transform: translate(-50%,-50%);
	}




	/*about*/
	.about_wrap{
		margin-bottom: 0;
	}

	.about_img{
		height: 300px;
	}
	.about_txt{
		width: 90%;
		padding: 40px 30px;
	}


	/*shop*/

	.shop_power_wrap{
		margin-bottom: 30px;
	}
	.shop_book_txt p{
		text-align: justify;
	}
	.shop_book_txt p:nth-of-type(2){
		text-align: right;
		margin-top: 5px;
	}
	.shop_power_img{
		width: 100%;
		padding-top: 60%;
		top: -20px;
	}
	

	/*title*/

	.days_wrap h3, 
	.shop_power_title, 
	.popular_txt,
	.product_title, 
	.title_light, 
	.price_title_light,
	.product_descript{
		width: 95%;
	}

	.shop_power_wrap h5, 
	.days_wrap h3, 
	.product_title{
		font-size: 22px;
		line-height: 40px;
	}

	.shop_power_wrap h5 span, 
	.days_wrap h3 span, 
	.product_title span, 
	.title span, 
	.price_countdown{
		font-size: 24px;
	}

	.popular_wrap h4{
		font-size: 20px;
	}

	.title,.title_light,
	.price_title_light{
		margin-bottom: 20px;
		font-size: 24px;
	}

	.shop_power_title{
		margin-bottom: 20px;
	}





	/*days*/
	.days_wrap{
		margin-bottom: 40px;
	}
	.days_wrap h3{
		margin-bottom: 35px;
	}
	.days_bg{
		height: 300px;
		top: -300px;

	}

	
	/*product*/

	.product_wrap{
		padding: 50px 0;
	}
	.popular_wrap p{
		text-align: justify;
	}
	.product_descript{
		margin-bottom: 0;
	}

	.product_wrap{
		margin-bottom: 60px;
	}


	/*popular*/	
	.popular_img{
		padding-top: 65%;
		background-image: url("../img/popular_m.jpg");
		margin-bottom: 40px;
	}


	/*form*/
	.form{
		width: 90%;
	}
	.code_input{
		width: calc(100% - 128px);
	}
	.collapse_box{
		height: 190px;
	}

	.btn_txt{
		font-size: 14px;
		width: 60px;
		height: 70px;
		line-height: 18px;
		top: -50px;
	}	
	.product_box .slick-dots li button{
		width: 30px;
		height: 30px;
	}
	.product_box .slick-dots li.slick-active button,
	.product_box .slick-dots li button:hover{
		width: 30px;
		height: 30px;
	}

	.menu_bar{
		width: 30px;
		height: 30px;
		right: 15px;
	}

/*
	header.stop .play_btn{
		width: 25px;
		height: 25px;
	}*/
	.scroll_bar{
		width: 5px;
	}
	.scroll_bar_txt{
		margin-top: 7px;
		font-size: 13px;
	}

	@keyframes scroll_ani{

		0%{
			transform: translateY(0);
		}

		100%{
			transform: translateY(5px);
		}
	}


	.volume_btn{
		width: 20px;
		height: 20px;
		right: 18px;
		bottom: 18px;
	}


}



@media screen and (max-width:500px){
	.days_item{
		margin-bottom: 30px;
		width: 50%;
	}
}



@media screen and (max-width:430px){
	.days_bg{
		height: 200px;
		top: -200px;

	}
	.btn_txt{
		font-size: 13px;
		width: 60px;
		height: 70px;
		line-height: 16px;
		top: -50px;
	}	

	.collapse_box{
		height: 210px;
	}

	.product_box .slick-dots{
		width: 100%;
	}

	.product_wrap{
		background: url("../img/background_m.jpg") no-repeat;
		background-size: cover;

	}

	.product_item_txt{
		width: 100%;
	}
	.product_collapse{
		padding: 0;
	}
	.collapse_btn {
		margin: 10px 5px;
	}

	.price_days{
		margin-bottom: 10px;
	}
	.price_item{
		width: 90%;
		margin-bottom: 25px;
		padding-top: 25px;

	}
	
	.shop_power_book{
		width: 80%;
	}

	.collapse_btn:hover{
		background-color: transparent;
		color: #f2e2ac;
	}

	.collapse_btn.active{
		background-color: #f2e2ac;
		color: #000;
	}


	.product_illustrator_right,
	.product_illustrator_left{
		display: none;
	}

	.price_countdown{
		font-size: 20px;
	}


}