
/*通用*/
/*#ea5703;*/
.space_top_1{ padding-top:1em;}
.space_top_2{ padding-top: 2em;}
.space_top_3{ padding-top: 3em;}
.space_top_4{ padding-top: 4vh;}
.space_memu{ padding-top:5em}

.white{color:#FFF;}
.w30{width:30%;}
.w35{width:35%;}
.w50{width:50%;}
.w65{width:65%;}
.w70{width:70%;}

/*.box_about{width:80%; margin: 0 auto;}

@media screen and (max-width:760px){
	.box_about{width:100%;}
}*/

.left{float: left;}
.right{float: right;}


.mainpage{margin-top:100px; opacity: 0;}

/*header*/
.header{ background:rgba(255,255,255,1.7); height: 100px;width:100%;opacity: 0;position:fixed;z-index: 10; left: 0;top: 0;}

.logo{/*width:calc(45% - 14rem);*/width:357px;height: 100px; cursor:pointer;background: url("../Images/logo.svg") no-repeat left center;background-size: auto 20px;margin-left:7rem;float: left;}
.logo:hover{opacity: 0.5}

.menu{width: calc(100% - 357px - 14rem);float: right; line-height:2;margin-right: 2.5rem;-webkit-transition: all 0s ease 0s;}
.menu>ul>li{position: relative;float: right;font-size: 16px;height:100px;-webkit-transition: all 0s ease 0s;}
.menu>ul>li>a{color:#000;float: right;text-align: center;line-height:100px;padding: 0 5.5rem;font-weight:400;}
.menu>ul>li>a>span{padding-bottom:0.5rem;border-bottom: 1px solid rgba(0,0,0,0);-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;}
.menu>ul>li:hover span{border-bottom: 1px solid rgba(0,0,0,1);}
.menu>ul>li:hover>a{/*line-height: 9rem*/}
.menu>ul>li.active a>span{border-bottom: 1px solid rgba(0,0,0,1);}
.menu>ul>li:hover ul{opacity: 1;margin-top: 70px}
.menu a.active{color: #000;}
.menu>ul>li>ul{opacity: 0; position: absolute;padding: 0;margin: 0;margin: 10rem 0 0 5.5rem;font-size:12px;-webkit-transition: all 0.4s ease 0s;-moz-transition: all 0.4s ease 0s;transition: all 0.4s ease 0s;margin-top: 5rem;line-height: 2;}
.menu>ul>li>ul>li a{border-bottom: 1px solid rgba(0,0,0,0);-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;text-transform:uppercase;white-space:nowrap;}
.menu>ul>li>ul>li:hover a{border-bottom: 1px solid rgba(0,0,0,1);}


@media screen and (max-width:1650px){
	.menu>ul>li>a{padding: 0 4.5rem;}
	.menu>ul>li>ul{margin-left: 4.5rem;}
}

@media screen and (max-width:1450px){
	
	.menu{display: none}
	.nav__trigger { display:block}
}

/*@media screen and (max-width:1450px){
	.menu>ul>li>a{padding: 0 3.5rem;}
	.menu>ul>li>ul{margin-left: 3.5rem;}
}
@media screen and (max-width:1250px){
	.menu>ul>li>a{padding: 0 2.5rem;}
	.menu>ul>li>ul{margin-left: 2.5rem;}
}
@media screen and (max-width:1150px){
	.menu>ul>li>a{padding: 0 1.5rem;}
	.menu>ul>li>ul{margin-left: 1.5rem;}
}
@media screen and (max-width:1100px){
	.menu>ul>li>a{padding: 0 1rem;}
	.menu>ul>li>ul{margin-left: 1rem;}
}
@media screen and (max-width:1050px){
	.menu>ul>li>a{padding: 0 0.7rem;}
	.menu>ul>li>ul{margin-left: 0.7rem;}
}
*/




@media screen and (max-width:1000px){
	.header{background:rgba(255,255,255,1);width: 100%;height:7.5rem;overflow: hidden;padding:2rem 5%;}
	.logo{width:180px;height: 3.5rem;margin: 0 auto;background-size: 100% auto;}
	.mainpage{margin-top: 7.5rem;}
	.menu{display: none}
	#home-video{height:100%;width: 100%; margin: 0 auto}
}




.movie_box{background: #000;width: 100%;}
.movie_box .vertical{width:auto; margin: 0 auto;height:calc(100vh - 100px);}
.movie_box .vertical #home-video{height:calc(100vh - 100px); margin: 0 auto}
.movie_box .horizontal{width:100%; margin: 0 auto;}
.index_movie{margin-bottom: 20rem;}
.topview{overflow: hidden;}
.topview img{width: 50%;float: left}

.title_box{min-height: 20rem;text-align: center;font-size: 1.5rem;overflow: hidden;}
.title_box .type1{line-height: 20rem;font-weight:400}
.title_box .type2{line-height: 4.5rem;padding:13rem 0 4rem 0;font-weight: 400}
.title_box .type3{line-height: 20rem;padding:0;font-weight: 400}
.title_box a{border-bottom: 1px solid rgba(0,0,0,1);}

.slide_box{width: 100%; overflow: hidden;}
.slide_guide{width: calc(100% - 10rem);height: 3rem; margin: 4rem auto;display: block; background: url("../Images/Icon_arraw.svg") no-repeat right center; background-size: auto 1.2rem;position: absolute;}

.text_box{width: 78%;margin: 0 auto; clear: both;overflow: hidden;text-align: center;max-width: 1300px;margin: 0 auto;position: relative;}
.text_box_home{padding: 17rem 0;}
.text_box_home article{width: 86%;margin: 0 7%;}

.text_box_about{padding: 20rem 0 14rem 0;}
.text_box_about article{width: 66%;margin: 0 17%}

.bottonback{padding: 1rem 0 16rem 0;}
.backtotop{ border-bottom: 1px solid #000;font-size: 2.4rem;font-weight: 500}

@media screen and (max-width:760px){
	.index_movie{height: auto;margin-bottom:10rem;} 
	
	.topview img{width: 100%;}
	.topview img:nth-child(2){display: none}
	.title_box{min-height:17rem;}
	.title_box .type1{line-height: 17rem;}
	.title_box .type2{line-height: 4rem;padding:6rem 0 6rem 0;}
	.title_box .type3{line-height: 17rem;}
	
	.movie_box .vertical #home-video{height:calc(100vh - 8rem); margin: 0 auto}
	
	
	.slide_guide{width:95%;margin: 2rem auto;background-size: auto 1rem;}
	.text_box{width:78%; }
	.text_box_home{padding: 8rem 0;}
	.text_box_home article{width:100%;margin: 0;}
	.text_box_about{padding: 3rem 0 0 0;}
	.text_box_about article{width: 100%;margin: 0;padding: 8rem 0 8rem 0;}
	
	.bottonback{padding: 2rem 0 8rem 0;}
	.backtotop{font-size: 1.6rem;}
}

/*about*/
.aboutlist{}
.aboutlist li{width: 33.3333%;float: left;}

@media screen and (max-width:760px){
	.aboutlist{overflow: hidden}
}


/*collectionlist*/
.collectionlist{}
.collectionlist li{width: 33.3333%;float: left;padding-bottom: 15rem;}

@media screen and (max-width:760px){
	.collectionlist li{padding-bottom: 5rem;}
}

/*contactus*/
.form{width: 650px; margin: 30rem auto 0 auto;}
.form li{padding-bottom: 8rem;}
.form li:nth-last-child(1){padding-bottom: 0;}
.form textarea{min-height: 35rem;}
::placeholder {
  color: #323232;
}


@media screen and (max-width:760px){
	.form{width: 80%; margin: 20rem auto 0 auto;}
	.form textarea{min-height: 25rem;}
}


.search_box{width: 48rem; margin: 40rem auto 15rem auto; text-align: center; background: #FFF;}
.select_box{margin-top: 7rem;position: relative;}
.search_box h5{font-weight:500}
.select_box .icon_location{background: url("../Images/Icon_Location.svg") no-repeat left center; background-size: 3rem auto;position: absolute;left: 0;width:8rem;height:8rem;}
.select_box ul{width: 37rem; margin: 0 auto;position: relative;z-index: 2;}
 
.select_box ul li{font-size: 3rem;border: 1px solid #323232;cursor: pointer;font-weight: 500}
.select_box>ul>li:nth-child(1),.select_box ul li:hover{background: #323232;color: #FFF;height: 8rem;line-height: 8rem;}

.select_box ul>ul li{height: 8rem;line-height: 8rem;border: 1px solid #323232;background: #FFF;border-top:0;-webkit-transition: all 0.4s ease 0s;-moz-transition: all 0.4s ease 0s;transition: all 0.4s ease 0s;}
.select_box ul li:hover{background: #323232;color: #FFF; }
.select_box ul>ul{position: absolute; opacity:0;-webkit-transform: translateY(-100%);
          transform: translateY(-100%);z-index: -1;}
.select_box ul:hover ul{opacity: 1;top: 8rem;z-index: -1;-webkit-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
  -webkit-transform: translateY(0);
          transform: translateY(0);}

input[type="text"].searchinput{margin: 3rem auto; display: inline-block;width:20rem;font-size: 2rem;text-align: center;line-height: 1;padding-left: 0;font-weight: 350}


.storelist{font-weight: 500;width: 86%;margin:0 auto 10rem auto; overflow: hidden}
.storelist h5{line-height: 3;margin-bottom: 3rem;font-weight: 500}
.storelist li{clear: both}
.storelist li article{margin-bottom:2.5rem;clear: both;overflow: hidden;font-weight: 500;line-height: 2.5;}
.storelist .active span{background: #AAA;line-height: 3; display:inline-block}

@media screen and (max-width:760px){
	.search_box{width: 40rem; margin: 25rem auto 15rem auto; }
	.select_box{margin-top: 5rem;}
	.select_box .icon_location{width:6rem;height:6rem;background-size:2.5rem auto;}
	.search_box h5{font-size: 2.4rem;}
	.select_box ul{width: 30rem; }
	.select_box ul li{font-size: 2.4rem;}
	.select_box>ul>li:nth-child(1),.select_box ul li:hover{height: 6rem;line-height: 6rem;}
	.select_box ul>ul li{height: 6rem;line-height: 6rem;}
	.select_box ul:hover ul{opacity: 1;top: 6rem;}
	input[type="text"].searchinput{margin: 2rem auto;}
	.storelist{font-weight: bold;width: 86%;margin:0 auto 2rem auto;overflow: hidden}
}


.topline{border-top:1px solid #D7D7D7;}
.bottomline{border-bottom:1px solid #000;}
.bottom{clear: both;padding: 10rem 0;text-align: center;width: 80%; margin: 0 auto;font-weight: 350;font-size: 2rem;}
.bottom img{width: 25%; margin: 0 auto;padding-bottom: 1.5rem;width: 363px;}

@media screen and (max-width:760px){
	.bottom{width: 65%;font-size: 1.2rem;padding: 7rem 0;}
	.bottom img{width: 80%; margin: 0 auto;padding-bottom: 1.5rem;}
}


.popup{ display: none; text-align: center; padding: 2rem 2rem 4rem 2rem; overflow: hidden}
.popup img{ width:100%;}
/* 黑白效果
html {
        filter: grayscale(100%); 
        -webkit-filter: grayscale(100%); 
        -moz-filter: grayscale(100%); 
        -ms-filter: grayscale(100%); 
        -o-filter: grayscale(100%); 
        -webkit-filter: grayscale(1);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;}*/

