/* CSS Document */

/*字体*/
@font-face{
    font-family: 'Bodoni';
    src:url(../fonts/BodoniStd-Italic.otf);
}
@font-face{
    font-family: 'Poppins';
    src:url(../fonts/Poppins-SemiBold.ttf);
}
@font-face{
    font-family: 'Lato';
    src:url(../fonts/LATO-LIGHT.WOFF.TTF);
}
@font-face{
    font-family: 'Playfair';
    src:url(../fonts/PlayfairDisplay-Regular.ttf);
}
@font-face{
    font-family: 'Sans';
	src:url(../fonts/OpenSans-Regular.ttf);
}
@font-face{
    font-family: 'Raleway';
    src:url(../fonts/Raleway-400-Regular.otf);
}
@font-face{
    font-family: 'Roboto_m';
    src:url(../fonts/Roboto-Medium.ttf);
}
@font-face{
    font-family: 'Roboto_l';
    src:url(../fonts/Roboto-Light.ttf);
}
@font-face{
    font-family: 'Oswald_Regular';
    src:url(../fonts/Oswald-Regular.ttf);
}
@font-face{
    font-family: 'Oswald-Light';
    src:url(../fonts/Oswald-Light-TTF.sfd.ttf);
}
@font-face{
    font-family: 'Montserrat-Light';
    src:url(../fonts/Montserrat-Light.otf);
}


/*小动画*/
.inleft{transform: translateX(-100px);}
.inleft.animate{transform: translateX(0);}

.inright{transform: translateX(100px);}
.inright.animate{transform: translateX(0);}

.inbottom{transform: translateY(100px);}
.inbottom.animate{transform: translateY(0);}

.intop{transform: translateY(-100px);}
.intop.animate{transform: translateY(0);}

.js-stt{opacity: 0; transition: 1s;}
.js-stt.animate{opacity: 1;}

.inzoom{transform: scale(0);}
.inzoom.animate{transform: scale(1);}


.del1{transition-delay: .1s;}
.del2{transition-delay: .2s;}
.del3{transition-delay: .3s;}
.del4{transition-delay: .4s;}
.del5{transition-delay: .5s;}
.del6{transition-delay: .6s;}
.del7{transition-delay: .7s;}
.del8{transition-delay: .8s;}
.del9{transition-delay: .9s;}
.del10{transition-delay: 1s;}
.del11{transition-delay: 1.1s;}
.del12{transition-delay: 1.2s;}
.del13{transition-delay: 1.3s;}
.del14{transition-delay: 1.4s;}
.del15{transition-delay: 1.5s;}
.del16{transition-delay: 1.6s;}
.del17{transition-delay: 1.7s;}
.del18{transition-delay: 1.8s;}
.del19{transition-delay: 1.9s;}
.del20{transition-delay: 2s;}



/*默认基础样式*/
*{padding:0; margin:0; list-style:none;box-sizing: border-box;}
img{max-width: 100%; vertical-align: middle; border: 0;}
.w-1,.w-2,.w-3,.w-4,.w-5,.w-6,.w-7,.w-8,.w-9,.w-10,.w-11,.w-12{padding-left:25px; padding-right: 25px;}
.w-1,.flex_w1{width:calc(100%/12);}
.w-2,.flex_w2{width:calc(100%/12*2);}
.w-3,.flex_w3{width:calc(100%/12*3);}
.w-4,.flex_w4{width:calc(100%/12*4);}
.w-5,.flex_w5{width:calc(100%/12*5);}
.w-6,.flex_w6{width:calc(100%/12*6);}
.w-7,.flex_w7{width:calc(100%/12*7);}
.w-8,.flex_w8{width:calc(100%/12*8);}
.w-9,.flex_w9{width:calc(100%/12*9);}
.w-10,.flex_w10{width:calc(100%/12*10);}
.w-11,.flex_w11{width:calc(100%/12*11);}
.w-12,.flex_w12{width:calc(100%/12*12);}
.pad10{padding-top: 10px;padding-bottom: 10px;}
.pad20{padding-top: 20px;padding-bottom: 20px;}
.pad30{padding-top: 30px;padding-bottom: 30px;}
.pad40{padding-top: 40px;padding-bottom: 40px;}
.pad50{padding-top: 50px;padding-bottom: 50px;}
.pad60{padding-top: 60px;padding-bottom: 60px;}
.pad70{padding-top: 70px;padding-bottom: 70px;}
.padt10{padding-top: 10px;}
.padt20{padding-top: 20px;}
.padt30{padding-top: 30px;}
.padt40{padding-top: 40px;}
.padt50{padding-top: 50px;}
.padt60{padding-top: 60px;}
.padt70{padding-top: 70px;}
.padb10{padding-bottom: 10px;}
.padb20{padding-bottom: 20px;}
.padb30{padding-bottom: 30px;}
.padb40{padding-bottom: 40px;}
.padb50{padding-bottom: 50px;}
.padb60{padding-bottom: 60px;}
.padb70{padding-bottom: 70px;}
.t_indent{text-indent: 2em;}
.mid_h3{ font-size:18px; line-height:28px; margin-bottom:10px;color:#333; padding-top: 20px;}
.mid_text p{ font-size:14px; color:#7e7e7e; line-height:26px; margin-bottom:10px;}



/*flex弹性布局*/
.flex_row{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;-ms-flex-wrap: wrap; flex-wrap: wrap;}
.flex_row_center{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;-ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;}
.flex_row_center.align{
	-webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;}
.flex_row_between{
	display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
	display: -moz-box; /* Firefox 17- */  
	display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
	display: -moz-flex; /* Firefox 18+ */  
	display: -ms-flexbox; /* IE 10 */  
	display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */ 
	-ms-flex-wrap: wrap; flex-wrap: wrap; 
		-webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -ms-justify-content: space-between;
    -o-justify-content: space-between;
    justify-content: space-between;}
.flex_row_between.align{
	-webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;}
.flex_row_around{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -ms-justify-content: space-around;
    -o-justify-content: space-around;
    justify-content: space-around;}
.flex_row_around.align{
	-webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;}
.flex_column_center{display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction:column;
		-webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;align-items: center;}


@media screen and (max-width: 480px) {
.w-1,.w-2,.w-3,.w-4,.w-5,.w-6,.w-7,.w-8,.w-9,.w-10,.w-11,.w-12{width: 100%; padding: 10px;}

	}