@charset "utf-8";


/*Common Rwd*/

@media screen and (max-width: 850px) {
	.header_box_main {
	 padding: 70px auto;
	 margin-right: 10px;
	 margin-left: 10px
	}
	.swiper-container .font1 {
	 font-size: 40px
	}
	.swiper-word {
	 font-size:30px;
	}
}
#mobileMenuPosition { display: none; }

@media screen and (max-width: 960px) {
	.header_box_line {
		border:0;
	}
	#mobileMenuPosition {
		 display: inline-block;
		 width: 30px;
		 height: 30px;
		 margin-right: 3%;
		 vertical-align: middle;
		 float: right
	}
	.mobileMenuPosition_top {
		 margin-top: 8px
	}
	#mobileMenu {
		 width: 30px;
		 height: 25px;
		 position: absolute;
		 bottom:20px;
		 z-index: 999;
		 cursor: pointer
	}
	#mobileMenu span {
		 width: 30px;
		 height: 5px;
		 display: block;
		 background: #ffffff;
		 margin-top: 5px;
		 -webkit-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
		 -moz-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
		 -ms-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
		 -o-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
		 transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
	}
	.mobileMenu_spac {
	 	background: #fff !important
	}
	#mobileMenu span:first-child {
		margin-top: 0
	}
	#mobileMenu .top {
		 position: absolute;
		 top: 10px;
		 -webkit-transform: rotate(225deg);
		 -moz-transform: rotate(225deg);
		 transform: rotate(225deg)
	}
	#mobileMenu .bottom {
		 position: absolute;
		 top: 10px;
		 margin-top: 0 !important;
		 -webkit-transform: rotate(-225deg);
		 -moz-transform: rotate(-225deg);
		 transform: rotate(-225deg)
	}
	#mobileMenu .middle {
	 	opacity: 0
	}
	.menu-active .navigation {
	 	right: 0
	}
	.menu-active .navigation ul li {
		 -moz-transform: translateX(0);
		 -webkit-transform: translateX(0);
		 opacity: 1;
		 transform: translateX(0)
	}

	
	.navigation {
		 display: inline !important;
		 height: 100%;
		 width: 100%;
		 padding: 0;
		 position: fixed;
		 right: -100%;
		 top: 0;
		 overflow: scroll !important;
		 overflow-x: hidden !important;
		 overflow-y: auto !important;
		 -webkit-overflow-scrolling: touch !important;
		 /*background: rgba(0, 0, 0, 0.75);*/
		 margin-top: 0px !important;
		 padding-top: 100px;
		 text-align: center
	}
	.navigation_spen {
		 margin-top: 58px !important;
		 width: 235px !important;
		 background: rgba(255, 255, 255, 0.9);
		 padding-top: 10px;
		 color: #000000;
		 text-align: left
	}
	.navigation ul:nth-child(1) {
		 margin-top: 70px;
		 vertical-align: middle
	}
	.navigation ul li {
		 -moz-transform: translateX(15%);
		 -webkit-transform: translateX(15%);
		 margin: 0 20px;
		 opacity: 0;
		 display: block;
		 vertical-align: top;
		 transform: translateX(15%);
		 text-align: left
	}
	.navigation ul li a {
	 	padding: 10px 0
	}
	.header_box .header_box_main .menu {
	 	height: 100%
	}
	.header_box .header_box_main .menu {
	 	float: inherit !important
	}
	.header_box .header_box_main .menu li {
		 float: inherit;
		 list-style: none
	}
	.header_box .header_box_main .menu li a {
		 padding-left: 10px;
		 padding-right: 10px;
		 line-height: 40px;
		 font-size: 20px
	}
	.header_box .header_box_main .menu li a:hover {
	 	color: #2EA8E1
	}
	.swiper-container .font1 {
		 font-size: 45px;
		 line-height: 60px
	}
	.swiper-container .font2 {
	 	font-size: 25px
	}
	.banner_br {
	 	display: block !important
	}
	.banner_de {
	 	display: none !important
	}
}

@media screen and (max-width: 450px) {
	.swiper-container .font1 {
		font-size: 25px
	}
}

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

}