﻿
@charset "utf-8";
/*格式化*/
#content p img{ width:100%;display:block; margin:0 auto; max-width:560px;}
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td, span, input, textarea {margin:0;padding:0;}
body{ font-size:14px;font-family:"Microsoft Yahei",Verdana,Arial,Helvetica,sans-serif;} 
li, ol { list-style:none; }
ins { text-decoration:none; }
i, em { font-style:normal; }
a { text-decoration:none;font-family:"Microsoft Yahei";}
a:hover { cursor:pointer; text-decoration:none;}
a:active{star:expression(this.onFocus=this.blur());}
:focus{outline:0;}
.clear { clear:both; line-height:0px; overflow:hidden; zoom:1; font-size:0px; content:'.';}
.clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
img{ padding:0; margin:0;}
a img { border:none; }
input,textarea{ border:none;font-family:"Microsoft Yahei"; font-size:13px;}
h1, h2, h3, h4, h5, h6{ font-weight:normal; font-size:14px;}
/*排版通用*/
.f-mm{ margin-left:auto; margin-right:auto;}/*居中对齐*/
.f-fl{ float:left;} /*左浮动*/
.f-fr{ float:right;} /*右浮动*/
.f-tr{ text-align:right;} /*右对齐*/
.f-tl{ text-align:left;} /*左对齐*/
.f-tc{ text-align:center;} /*中间对齐*/
.f-pr{ position:relative;} /*定位*/
.f-di{ display:inline;}

/* -- 页面整体布局 -- */
.wrap{min-width:320px; max-width:640px; margin:0 auto; position:relative;} /*网站首页宽度*/
.emptyData{line-height:1.5rem;padding:1rem; font-size:1rem; display:block; clear:both;overflow:hidden; }
/*----------------------------------------------------------------------------------------------------------------------------*/
/*--------------------做单时把下面的头部和底部样式删除，换成自己写的样式，样式命名按规范命名----------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/

/*头部样式*/
.head2_top{background:#fff;position:fixed;z-index: 11;height:4.7rem; box-shadow:0 0.1rem 0.2rem #666;min-width:320px; max-width:640px; margin:0 auto; width:100%;}
.head2 { background:#fff;height:4.7rem;overflow:hidden;  width:100%;}
.head2 .menu_btn{width:76%; overflow:hidden; height:6.2rem; position:absolute; top:0; right:0;}
.head2 .menu_btn .tsite{ width:75%; float:left; text-align:center; line-height:4.7rem; font-size:1.4rem;}
.head2 .menu_btn .tsite a{ display:inline-block; color:#2a2a2a; padding:0 4%; position:relative;}
.head2 .menu_btn .tsite a:last-child:before{ background:none; border:0;}
.head2 .menu_btn .tsite a:last-child{ padding-right:0;}
.head2 .menu_btn a.downmenu{display:block; width:7.1875%; margin-top:1.5rem; height:1.6rem;background:url(../images/common/home.png) no-repeat;background-size:100% 1.6rem; z-index:12; margin-right:4%; float:right;}
.head2 .logo{ width:20.3125%; float:left; height:4.3rem; margin:0.1rem 0 0 3.125%; overflow:hidden;}
.head2 .logo img{display:block; width:100%;}

.head2 .menu_btn .tsite a.cur{ color:#1bc71f;}

.menu2 .slideMenu{ width:100%; display: none;z-index:16;position:absolute; top:4.7rem; right:0px; transition:transform 1s;-webkit-transition:transform 1s;}
.menu2 .slideMenu:before{content: "";position: absolute;width: 100%;background:rgba(119,182,11,0.8);height:100%; right:0;top:0;z-index: 0;}
.menu2.down .slideMenu{transform:translate3D(0,100%,0);-webkit-transform:translate3D(0,100%,0);}
.menu2 ul { padding:0 5%;}
.menu2 ul li {line-height:3rem;text-align:center;color:#fff; position:relative;}
.menu2 ul li:before{ content:""; position:absolute; bottom:0; left:0; width:100%; height:1px; background:#fff;}
.menu2 ul li:last-child:before{ background:none; border:0;}
.menu2 ul li a {font-size:1rem; font-family:"Microsoft Yahei"; color: #fff;text-decoration: none;}
.menu2 ul .tel {border-bottom:none;height:auto; padding:0px;}
.menu2 ul .tel img {width:64%;vertical-align:middle;}
.menu2 ul li:last-child{border-bottom: none;}
.menu2 ul li:first-child{border-top: none;}

.top{ height:4.7rem;}


a{text-decoration: none;}
/*电话按钮*/
.phone-btn{position:fixed; right:2%; bottom:14.5rem;width:4rem; height:4.2rem; background-image:url(../images/phone.png); background-repeat:no-repeat; background-size: 100%; z-index:999;}
.phone-btn img{width: 100%;display: block;}
.phone-btn.qq{display:none; background-image:url(../images/phone.png); bottom:8rem;}

.phone-page-on .phone-btn{transition:all 1s ease;-webkit-transition:all 1s ease;transform:rotate(1080deg) scale(1);-webkit-transform:rotate(1080deg) scale(1);}


/*跳转链接动画*/
@-webkit-keyframes chaining
{
	0%{-webkit-transform: scale(0, 0);transform: scale(0, .0);}
	50%{-webkit-transform: scale(1.2, 1.2);transform: scale(1.2, 1.2);}
	100%{-webkit-transform: scale(1, 1);transform: scale(1, 1);
}}

@keyframes chaining{
	0%{-webkit-transform: scale(0, 0);transform: scale(0, .0);}
	50%{-webkit-transform: scale(1.2, 1.2);transform: scale(1.2, 1.2);}
	100%{-webkit-transform: scale(1, 1);transform: scale(1, 1);
	}}

/*跳转链接*/
.swiper-slide .chaining{position: absolute;left: 50%;font-size: 1.3rem;text-decoration: none;color: #f58220;white-space: nowrap;-webkit-animation: chaining 1s ease;animation: chaining 1s ease;}
/*跳转链接里面的箭头动画*/
@keyframes arrow
	{
	  0%{opacity: 1;-webkit-transform: translateX(0);transform: translateX(0);}
	  100%{opacity: 0;-webkit-transform: translateX(.7rem);transform: translateX(.7rem);
	}}

@-webkit-keyframes arrow
   {
		0%{opacity: 1;-webkit-transform: translateX(0);transform: translateX(0);}
	    100%{opacity: 0;-webkit-transform: translateX(.7rem);transform: translateX(.7rem);
	}}
.arrow{display: inline-block;-webkit-animation: arrow 1s ease infinite;animation: arrow 1s ease infinite;}

@keyframes toggleArrow
{   0%,
	30%{opacity:0;-webkit-transform:translate(0, 1rem);transform:translate(0, 1rem);}
	60%{opacity:1;-webkit-transform:translate(0, 0);transform:translate(0, 0);}
	100%{opacity:0;-webkit-transform:translate(0, -.8rem);transform:translate(0, -.8rem);
	}}
@-webkit-keyframes toggleArrow
  {0%,
	30%{opacity:0;-webkit-transform:translate(0, 1rem);transform:translate(0, 1rem);}
	60%{opacity:1;-webkit-transform:translate(0, 0);transform:translate(0, 0);}
	100%{opacity:0;-webkit-transform:translate(0, -.8rem);transform:translate(0, -.8rem);
	}}

#toggle-arrow{position: absolute;left: 50%;bottom: 1rem;z-index: 9999;width: 2.4rem;height: 1.4rem;margin-left: -1.2rem;}
#toggle-arrow .toggle-arrow-wrap{position: relative;width: 2.4rem;height: 1.4rem;-webkit-animation: toggleArrow 1.5s infinite;animation: toggleArrow 1.5s infinite;}
#toggle-arrow .fore1,
#toggle-arrow .fore2{height: 1.5rem;width: 1.1rem;position: absolute;top: -.5rem;overflow: hidden;}
#toggle-arrow .fore2{left: 1rem;}
#toggle-arrow .fore1 i,
#toggle-arrow .fore2 i{background-color: #FFF;width: 1.4rem;height: .5rem;border-radius: 2px;position: absolute;box-shadow: 1px -1px 1px #979797;top: .5rem;}
#toggle-arrow .fore1 i{-webkit-transform: rotate(130deg);transform: rotate(130deg);left: .1rem;}
#toggle-arrow .fore2 i{left: -.45rem;-webkit-transform: rotate(50deg);transform: rotate(50deg);}

@-webkit-keyframes musicRotate{0%{-webkit-transform: rotate(0deg);}
100%{-webkit-transform: rotate(359deg);}}

@keyframes musicRotate{0%{transform: rotate(0deg);}
100%{transform: rotate(359deg);}}
#music{position: absolute;right: 2rem;top: 5.5rem;z-index: 9999;width: 3rem;height: 3rem;cursor: pointer;}
#music .fore1,
#music .fore2{position: absolute;left: 0;top: 0;width: 3rem;height: 3rem;-webkit-background-size: 100% 100%;background-size: 100% 100%;}
#music .fore1{display: none;z-index: 1;-webkit-animation: musicRotate 1.5s linear infinite;animation: musicRotate 1.5s linear infinite;}
#music .fore2{display: block;}
#music.on .fore2{display: none;}
#music.on .fore1{display: block;}
.swiper-container{
	width: 100%;height: 100%;max-width: 640px;margin: 0 auto;
	min-width: 320px;
	overflow:hidden;
	-webkit-box-sizing: border-box;
	position:relative;
	font-size:1rem;

}
.wrap{max-width:640px; min-width:320px; margin:0 auto;position:relative;width: 100%;height: 100%;}


/*底部导航*/
.footer {position:fixed;bottom:0;width:100%;left:0; z-index: 1;}
.footer ul{  max-width:640px; min-width:320px; width:100%; height:4rem; background:#1bc71f; z-index:9;}
.footer li{ width:25%; position:relative; height:4rem; font-size:1.2rem; color:#fff; float:left; text-align:center;}
.footer li:before{ content:""; position:absolute; top:0; right:0; width:1px; height:100%; background:#45d149;}
.footer li em{ display:block; width:18.75%; margin:0 auto 0.1rem;}
.footer li em img{ display:block; width:100%;}
.footer li a{ display:block; color:#fff; padding-top:0.5rem; height:3.5rem; line-height:1.3rem;}
.footer li a:hover{ background:#006600;}

html {font-size: 10px;}
@media screen and (min-width: 320px) {html {font-size: 10.625px;}}
@media screen and (min-width: 360px) {html {font-size: 11.875px;}}
@media screen and (min-width: 400px) {html {font-size: 13.125px;}}
@media screen and (min-width: 440px) {html {font-size: 14.375px;}}
@media screen and (min-width: 480px) {html {font-size: 15.625px;}}
@media screen and (min-width: 520px) {html {font-size: 16.875px;}}
@media screen and (min-width: 560px) {html {font-size: 18.125px;}}
@media screen and (min-width: 600px) {html {font-size: 19.375px;}}
@media screen and (min-width: 640px) {html {font-size: 20px;}}