﻿

/*-----------------[初始化]--------------*/
body{color: #444;font-size: 12px;font-family:"微软雅黑","Microsoft Yahei";min-width: 1000px;}
a{color: #444;}
a:hover{color: #134268;}
a,.ani{
	transition: .3s;
	-ms-transition: .3s;
	-moz-transition: .3s;
	-webkit-transition: .3s;
	-o-transition: .3s;
}
input,textarea,select{font-size: 12px;color: #444;font-family:"微软雅黑","Microsoft Yahei";}
input[type='submit'],input[type='reset'],input[type='button'],select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

@font-face {
    font-family: 'Caviar';
    src: url('../fonts/Caviar dreams.eot');
    src: url('../fonts/Caviar dreams.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Caviar dreams.ttf') format('truetype');
}

/*布局*/
.wp{width: 1200px;margin: 0 auto;}
.h50{height: 50px;clear: both;overflow: hidden;}
.h100{height: 100px;clear: both;overflow: hidden;}

/*标题*/

/*按钮*/

/*颜色*/


/*******************************
	-------[=头部]-------
********************************/
#hd{position: absolute;left: 0;right: 0;top: 30px;z-index: 9;}
.logo{margin-left: 40px;}
.logo img{display: inline-block;vertical-align: middle;margin-right: 10px;}
.logo span{font-size: 28px;font-weight: bold;color: #fff;display: inline-block;vertical-align: middle;}
.hdr{margin-right: 30px;}
.hdr a{display: inline-block;width: 30px;height: 30px;vertical-align: middle;
	background-repeat: no-repeat;
	background-position: center;
}
.a-tele{background-image: url(../images/ico-phone.png);}
.a-loca{background-image: url(../images/ico-loca.png);}
.a-weix{background-image: url(../images/ico-weix.png);}

/*******************************
	-------[=导航]-------
********************************/
.menuBtn{display: inline-block;width: 30px;height: 30px;margin: 0 10px;vertical-align: middle;cursor: pointer;}
.menuBtn b{display: block;float: right;width: 26px;height: 3px;background-color: #fff;margin: 5px 2px 0 0;border-radius: 2px;}
.menuBtn .s1{
	width: 10px;
	animation: myline 2s linear infinite;
	-ms-animation: myline 2s linear infinite;
	-moz-animation: myline 2s linear infinite;
	-webkit-animation: myline 2s linear infinite;
	-o-animation: myline 2s linear infinite;	
}
.menuBtn .s2{
	width: 20px;
	animation: mylinet 2s linear infinite;
	-ms-animation: mylinet 2s linear infinite;
	-moz-animation: mylinet 2s linear infinite;
	-webkit-animation: mylinet 2s linear infinite;
	-o-animation: mylinet 2s linear infinite;
}
.menuBtn .s3{
	width: 26px;
	animation: mylines 2s linear infinite;
	-ms-animation: mylines 2s linear infinite;
	-moz-animation: mylines 2s linear infinite;
	-webkit-animation: mylines 2s linear infinite;
	-o-animation: mylines 2s linear infinite;
}
.menuBtn:hover b{width: 26px;
	animation:none;
}

@-webkit-keyframes myline {
	0% { width: 10px; }
	50% { width: 26px;  }
	100% { width: 10px;  }
}
@-moz-keyframes myline {
	0% { top: 10px; }
	50% { width: 26px;  }
	100% { width: 10px;  }
}
@-ms-keyframes myline {
	0% { top: 10px; }
	50% { width: 26px;  }
	100% { width: 10px;  }
}
@-o-keyframes myline {
	0% { top: 10px; }
	50% { width: 26px;  }
	100% { width: 10px;  }
}
@keyframes myline {
	0% { top: 10px; }
	50% { width: 26px;  }
	100% { width: 10px;  }
}

@-webkit-keyframes mylinet {
	0% { width: 20px; }
	50% { width: 26px;  }
	100% { width: 20px;  }
}
@-moz-keyframes mylinet {
	0% { top: 20px; }
	50% { width: 26px;  }
	100% { width: 20px;  }
}
@-ms-keyframes mylinet {
	0% { top: 20px; }
	50% { width: 26px;  }
	100% { width: 20px;  }
}
@-o-keyframes mylinet {
	0% { top: 20px; }
	50% { width: 26px;  }
	100% { width: 20px;  }
}
@keyframes mylinet {
	0% { top: 20px; }
	50% { width: 26px;  }
	100% { width: 20px;  }
}

@-webkit-keyframes mylines {
	0% { width: 26px; }
	50% { width: 10px;  }
	100% { width: 26px;  }
}
@-moz-keyframes mylines {
	0% { top: 26px; }
	50% { width: 10px;  }
	100% { width: 26px;  }
}
@-ms-keyframes mylines {
	0% { top: 26px; }
	50% { width: 10px;  }
	100% { width: 26px;  }
}
@-o-keyframes mylines {
	0% { top: 26px; }
	50% { width: 10px;  }
	100% { width: 26px;  }
}
@keyframes mylines {
	0% { top: 26px; }
	50% { width: 10px;  }
	100% { width: 26px;  }
}

#aside{position: fixed;right: -360px;width: 280px;top: 0;bottom: 0;overflow-y: auto;z-index: 10;
	background-color: rgba(0,0,0,.9);
	background: url(../images/black-alpha90.png) repeat left top \9;
	padding: 25px 40px;	
	transition: right .3s linear 0s;
	-ms-transition: right .3s linear 0s;
	-moz-transition: right .3s linear 0s;
	-webkit-transition: right .3s linear 0s;
	-o-transition: right .3s linear 0s;
}
.open #aside{right: 0;}
.closeBtn{float: right;width: 40px;height: 40px;cursor: pointer;
	background: url(../images/ico-close.png) no-repeat center;
}

#nav{clear: both;padding-top: 80px;border-bottom: 1px solid #353a41;}
#nav li{border-top: 1px solid #353a41;padding: 0 10px;}
#nav .v1{display: block;line-height: 70px;font-size: 24px;color: #fff;}
#nav .has .v1{background: url(../images/a1.png) no-repeat right center;}
#nav li.on .v1,#nav li.ok .v1{color: #eaddb3;}
#nav dl{font-size: 18px;color: #b3b3b3;padding-bottom: 20px;display: none;}
#nav dd a{color: #b3b3b3;display: block;line-height: 45px;}
#nav dd a:hover{color: #fff;}


/*******************************
	-------[=banner]-------
********************************/


/*******************************
	-------[=底部]-------
********************************/
#fd{background-color: #212427;color: #7b7d80;}

.ftop{background-color: #2c2f33;overflow: hidden;padding: 40px 0 80px;}
.fnav{overflow: hidden;font-size: 12px;}
.fnav a{color: #7b7d80;}
.fnav a:hover{color: #bbb;}
.fnav dl{float: left;min-width: 160px;margin-right: 10px;}
.fnav dt{font-size: 14px;color: #fff;padding-bottom: 11px;position: relative;margin-bottom: 10px;}
.fnav dt:after{
	content: '';position: absolute;left: 0;bottom: 0;width: 15px;height: 1px;background-color: #595b5e;
}
.fnav dd{line-height: 2;}

.ftel{font-size: 24px;color: #eaddb3;font-family: 'Caviar';} 
.fma{text-align: center;}
.fma img{display: block;margin: 0 auto 10px;width: 140px;height: 140px;}

.fbot{color: #46484b;height: 60px;line-height: 60px;overflow: hidden;}
.m-share{}
.m-share a{display: inline-block;vertical-align: middle;
	width: 30px;height: 30px;
	background-repeat: no-repeat;
	background-position: center;
}
.m-share a:hover{
	opacity: .8;
	-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity= 80)';
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
}
.m-share .a-zone{background-image: url(../images/ico-qq.png);}
.m-share .a-sina{background-image: url(../images/ico-sina.png);}

/*返回顶部*/
#toTop{position: fixed;right: 10%;bottom: 275px;z-index: 9;display: none;}

/*加载*/
.loading{position: fixed;left: 0;right: 0;top: 0;bottom: 0;z-index: 99;
	background: url(../images/bg-leader.jpg) no-repeat center;
	-o-background-size: cover;
	-ms-background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	background-size: cover;
}
.loading .pic{position: absolute;left: 0;top: 50%;right: 0;text-align: center;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.animated.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s
}
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        -ms-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}
