﻿@charset "utf-8";

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre, 
form,fieldset,input,textarea,p,blockquote,th,td { 
    padding: 0; 
    margin: 0; 

     
}
table { overflow-x
    border-collapse: collapse; 
    border-spacing: 0; 
}
fieldset,img { 
    border: 0; 
} 
address,caption,cite,code,dfn,em,strong,th,var,b,i { 
    font-weight: normal; 
    font-style: normal; 
}
input[type=text],input[type=email],input[type=password],input[type=time],input[type=datetime],a{
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance :none; /* IOS下input[text] 无风格 */
	-ms-appearance:none;
	outline:none;
	border-radius:0;
}
input,button{
	border:solid 1px #ddd;
	background:none;
	outline:none;
}
/* 重设IOS半透明北京以及点击出现虚线  */
html,body,a{
	color:#666;
}
html,body{

	-webkit-font-smoothing:antialiased;
}
a{
	-webkit-tap-highlight-color:rgba(255,0,0,0);
	text-decoration:none;
}
a:link{
	text-decoration: none;
	
}
a:hover{
	text-decoration: none;
}
ol,ul { 
    list-style: none; 
}
caption,th { 
    text-align: left; 
} 
h1,h2,h3,h4,h5,h6 { 
    font-weight: normal;

}
html,body{
	
	font-family:"微软雅黑";
	

}

/* base */
/*  input 基于  */

input[type=text]{
	box-sizing:border-box;
	-moz-box-sizing:border-box;  /* 为元素设定的宽度和高度决定了元素的边框盒。 */	
}
input,button{
	background:#fff;
}
input[type=button]:hover,input[type=submit]:hover,input[type=reset]:hover,button:hover{
	cursor:pointer;
	
}
input[type=button]:active,input[type=submit]:active,input[type=reset]:active,button:active{
	background:#dedede;
}

input:focus {outline:none;}
img{width:100%;height:auto;}

/* reset */



/* 导航栏 */
.hostnav-layout{width:100%;height:60px;background:#000;}
.hostnav-layout ul{width:500px;margin:0 auto;}
.hostnav-layout ul li,.hostnav-layout ul li a{display:inline-block;float:left;height:60px;text-align:center;line-height:60px;}
.hostnav-layout ul li{margin-left:10px;}

.hostnav-layout ul li a{padding:0 12px;transition: all 300ms ease 0s;font-size:18px;color:#fff;}
.hostnav-layout ul li a:hover{background:#fff;color:#000;}
.hostnav-layout ul li.host-active a{background:#fff;color:#000;}
/* 导航栏 */
.host-logo{width:100px;height:50px;float:left;overflow:hidden;}

/* 图片切换 */
.host-banner{width:100%;margin:0 auto;overflow:hidden;}
.host-banner ul{float:left;width:300%;position:relative;z-index: 3;}
.host-banner li{height:auto;list-style:none;float:left;display: inline-block;overflow: hidden;}
.host-banner li a{display: inline-block;}
.host-banner ul img{width:1920px;}

.host-banner .change-btn{height: 24px;width: 100%;text-align: center;}
.host-banner .change-btn button{display:inline-block;width:24px;height:24px;border-radius:100%;text-align:center;line-height:0px;margin-left:10px;}
.host-banner .prev,.host-banner .next{width:34px;height:34px;border-radius:100%;line-height:0px;}
.chang_active{background:#3c3c3c;color:#fff;}
/* 图片切换 */




/* js的css属性 */
.host-box{position:relative;}
.host-out{position:absolute;display:none;z-index:10;background: #dbdbdb;top:60px;}
.host-out a{width: 100%;}

/* js的css属性 */

/* 方形布局 */
.host-square{width:505px;height:auto;background:#dbdbdb;margin:0 auto;}
.host-s-h{width:100%;float:left;}
.host-s-l{min-width:100px;float:left;}


/* 方形布局 */

/* 分页 */

.host-page{height:36px;float:right;display:block;}

.host-page div{float:left;width:32px;height:32px;background:#fff;border:1px solid #dddddd;margin-left:8px;text-align:center;line-height:32px;}
.host-page div a{color:#717171;display:block;width:100%;height:100%;}

.host-page div.host-prev,.host-page div.host-next{width:80px;}
.host-page div.host-prev a,.host-page div.host-next a{color:#ec5317;}

.host-page div.active a{color:#fff;background:#ea5513;}
.host-page a:hover{color:#fff;background:#ea5513;}
.host-page div.host-prev{text-indent:10px;background: url(img/left.jpg) no-repeat center left;}
.host-page div.host-next{text-indent:-10px;background: url(img/right.jpg) no-repeat center right;}
.host-page div.host-prev a:hover{color:#ec5317;background:none;}
.host-page div.host-next a:hover{color:#ec5317;background:none;}

/* 分页 */

/*下拉显示*/
.host-open{width: 100px;height: 100px;background: red;position: relative;float: right;}
/*下拉显示*/

/*返回顶部*/
.host-fiexd{
width: 70px;height: 70px;
bottom: 24px;
position: fixed;

right: 0px;
}
.host-backtotop{	
width:70px;height:70px;
background:url(img/backtotop.png) no-repeat center;
cursor: pointer;
display: none;

}
/*返回顶部*/

/*文字下划线*/

.host-line{position: relative;display:inline-block;}
.host-line i{position: absolute;display:inline-block;height: 2px;bottom: 0px;animation-fill-mode: forwards;}
.linemove{
	width: 100%;

background: #66AFE9;
animation:myfirst 0.5s;
-moz-animation:myfirst 0.5s; /* Firefox */
-webkit-animation:myfirst .5s; /* Safari and Chrome */
-o-animation:myfirst 0.5s; /* Opera */
}

@keyframes myfirst
{
0%   {width: 0px;}
100% {width: 100%;}
}

@-moz-keyframes myfirst /* Firefox */
{
0%   {width: 0px;}
100% {width: 100%;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
0%   {width: 0px;}
100% {width: 100%;}
}

@-o-keyframes myfirst /* Opera */
{
0%   {width: 0px;}
100% {width: 100%;}
}
/*文字下划线*/



/*css3  横移效果*/

.host-cssmove{
min-width: 180px;
float: left;
border-radius: 30px;
height:30px;
line-height: 30px;
position: relative;
text-align: center;

}
.host-cssmove a{color:#222222;position: relative;margin-left: 38px;padding-right: 38px;}

.cssmoveactive a{color:#fff;z-index: 2;}

.cssmoveactive .host-titico{
    z-index: 1;
    transition: width  0.25s ease-in-out,background 0.2s ease-in-out ;
	border-radius: 19px;
	width: 100%;
	background: #2d76b9;
	
}

.host-titico{
 transition: width  0.25s ease-in-out,background 0.2s ease-in-out ;
box-shadow:0 2px 3px rgba(0, 0, 0, 0.28);
left:0px;
position: absolute;
cursor: pointer;
width:30px;
height:30px;
background: #aab8db;
display: block;
float: left;
border-radius: 19px;
}
/*css3  横移效果*/

/* 按钮*/
.host-button{
border-radius: 3px;
text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);
box-shadow:0 1px 0 rgba(255, 255, 255, 0.5) inset, 0 1px 2px rgba(0, 0, 0, 0.3);
display:inline-block;
background:#f7766c;
font-size:14px;
padding:12px ;
color:#fff;

}
.host-button:hover{
color:#fff;
/* box-shadow:0 1px 0 rgba(255, 255, 255, 0.3) inset, 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 40px #f5756c;} */
/* 按钮*/

/*常用css*/
}
.float-left{float: left;}
.float-right{float:right;}
.margin-auto{margin: 0 auto;}


.colorf{color: #fff;}
.color0{color: #000;}
.color1{color:#1F1F1F;}
.color2{color:#3D3D3D;}
.color3{color:#5C5C5C;}
.color4{color:#7A7A7A;}
.color5{color:#999999;}

.font12{font-size: 12px;}
.font13{font-size: 13px;}
.font14{font-size: 14px;}
.font15{font-size: 15px;}
.font16{font-size: 16px;}
.font17{font-size: 17px;}
.font18{font-size: 18px;}
.font19{font-size: 19px;}
.font20{font-size: 20px;}

.fontbold{font-weight: bold;}

.display-box{

    display:-moz-box;
    display:-webkit-box;
    display:box;
}

.box-orient{
	
	-moz-box-orient:vertical;
	-webkit-box-orient:vertical;
	box-orient:vertical;
	
}



.box-flex-l{
	width: 0%;
   -moz-box-flex:1;
    -webkit-box-flex:1;
    box-flex:1;
    
}
.box-flex-h{
	height: 0%;
   -moz-box-flex:1;
    -webkit-box-flex:1;
    box-flex:1;
    
}

/*常用css*/

/*搜索*/

.host-search{width: 300px;height: 30px;border-radius:3px ;border:1px solid #dbdbdb;background: #f0f0f0 ;float:right;transition: width 300ms ease 0s;}
.host-into{width: 240px;height: 26px;border: none;font-size: 14px;line-height: 26px;margin-right: 10px;background: none;float:right;transition: width 300ms ease 0s;}
.host-search button{float:right;width: 30px;height: 26px;border: none;background: none;font-size: 16px;}

.host-search-act{width: 380px;transition: width 300ms ease 0s;background: #fff;}
.host-into-act{width: 320px;transition: width 300ms ease 0s;}

/*搜索*/
