body{
	font-family: "microsoft yahei";
	color: #333;
	background-color: #F5F8F9;
}
.bg{ background: transparent url("../images/bj.png") repeat top left scroll !important; }
.mr5{ margin-right: 5px; }
.w900{ width: 900px; }
.w300{ width: 300px; }
.block{ display: block !important; }
/* ico banner */
.ico-banner{
	position: relative;
	width: 100%;
	min-width: 1200px;
	height: 500px;
	background-repeat: no-repeat;
	background-position: top left;
	background-size: cover;
	overflow: hidden;
}
.ico-banner .banner-wrapper{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 50px 0;
	background-color: rgba(0,0,0,0.35);
}
.ico-banner .banner-wrapper .banner-inner{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: auto;
	width: 1200px;
}
.banner-inner .image-box{
	display: flex;
	align-items: center;
	width: 600px;
	height: 400px;
}
.banner-inner .image-box .image-item{ width: 100%; }
.banner-inner .text-box{
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-left: 40px;
	width: 600px;
	height: 400px;
	color: #efefef;
}
.banner-inner .text-box h3,
.banner-inner .text-box p{
	margin: 0 0 40px;
}
.banner-inner .text-box h3{ font-size: 36px; }
.banner-inner .text-box p{ font-size: 16px; }


/* ico navbar */
.ico-navbar{
	width: 100%;
	min-width: 1200px;
	background-color: #f3f3f3;
}
.ico-navbar .list-none{
	display: flex;
	margin: auto;
	width: 1200px;
}
.ico-navbar .list-none li{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px;
	line-height: 50px;
	min-width: 240px;
	font-size: 16px;
}
.ico-navbar .list-none .label{ margin-left: 4px; }

/* ico content */
.ico-content{
	display: flex;
	margin: auto;
	width: 1200px;
	min-width: 1200px;
}
.ico-content .content-images{width: 800px;}
.ico-content .content-images .title{
	margin: 0 0 30px;
	font-size: 20px;
	text-align: center;
}
.ico-content .content-images .sub-title{
	margin-bottom: 30px;
	text-align: center;
}
.ico-content .content-images .sub-title .text{
	display: inline-flex;
	padding: 5px 10px;
	font-size: 26px;
	border: 1px solid #333;
	border-left: none;
	border-right: none;
}
.ico-content .content-images img{ width: 100% !important; }
.ico-content .ico-list{ width: 360px; }
.ico-content .content-images ~ .ico-list, .ico-content .ico-list ~ .content-images{ margin-left: 40px; }
.ico-list .ico-item{
	padding: 15px;
	margin-bottom: 30px;
	background-color: #f2f2f2;
}
.ico-list .ico-item .title{
	position: relative;
	padding-left: 30px;
	margin: 0 0 20px;
	line-height: 30px;
}
.ico-list .ico-item .image-box{width: 100px;}
.ico-list .ico-item .ico-info{width: 230px;}
.ico-list .ico-item .image-item{
	width: 80px;
	border-radius: 50%;
}
.ico-list .ico-item .title::before{
	content: "";
	position: absolute;
	left: 0;
	top: 4px;
	width: 24px;
	height: 24px;
	background-color: #EE3531;
}
.ico-list .ico-item .money{
	position: relative;
	padding-right: 90px;
	line-height: 40px;
}
.ico-list .ico-item .money .text-color{ 
	margin-left: 4px;
	font-size: 22px; 
	letter-spacing: -0.2px;
}
.ico-list .ico-item .list-none{
	display: flex;
	flex-wrap: wrap;
}
.ico-list .ico-item .list-none li{
	line-height: 26px;
	width: 50%;
	color: #666;
	font-size: 12px;
}
.ico-list .ico-item .list-none .block{ width: 100%; }

.ico-list .ico-item .btn{
	background-color: #c0c0c0;
	box-shadow: none;
	color: #fff;
	border-color: #c0c0c0;
	transition: 0.233s;
}
.ico-list .ico-item .btn:hover{
	color: #333;
	border-color: #333
}
.status{
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	top: 5px;
	right: 0;
	bottom: 5px;
	min-width: 80px;
	background-color: #EE3531;
	color: #fff;
}
.status::before{
	content: "";
	position: absolute;
	left: -6px;
	bottom: 0;
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-right: 6px solid #EE3531;
}

.ico-tags{
	padding: 10px 0;
	margin: 30px auto 0;
	width: 1200px;
	border-top: 1px dashed #ddd;
}
.ico-tag a{
	display: inline-block;
	padding: 6px 12px;
	margin: 0 3px;
	background-color: #f2f2f2;
	color: #999;
	font-size: 12px;
	transition: 0.233s;
	border-radius: 2px;
}
.ico-tag a:hover{
	background-color: #ddd;
}

/* ui banner */
.banner-slider{ height: 500px; }
.banner-slider li{
    height: 500px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.banner-slider + .unslider-nav {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    top: auto;
    margin: 0;
    z-index: 100;
}
.banner-slider + .unslider-nav ol{
    list-style: none;
    text-align: center;
}
.banner-slider + .unslider-nav ol li{
    display: inline-block;
    float: none;
    width: 6px;
    height: 6px;
    margin: 0 4px;
    padding: 3px;
    background: transparent;
    border-radius: 5px;
    overflow: hidden;
    text-indent: -999em;
    border: 2px solid #fff;
    cursor: pointer;

    opacity: .4;
}
.banner-slider + .unslider-nav ol li.unslider-active {
    background: #fff;
    cursor: default;
    opacity: 1;
}

.ui-banner .unslider{ position: relative; }
.ui-banner .unslider-arrow{
	display: block;
	width: 49px;
	height: 85px;
	top: 50%;
	right: 200px;
	left: auto;
	margin-top: -40px;
	overflow: hidden;
	background: url("../images/arrowsright.png") no-repeat;
	border-radius: 80px;
	text-indent: -999em;
	opacity: .75;
	transition: opacity .2s;
	z-index: 1000;
}
.ui-banner .unslider-arrow:hover{
	opacity: 1;
	background-image: url("../images/arrowsright1.png");
}
.ui-banner .unslider-arrow.prev{
	left: 200px;
    right: auto;
    -ms-transform: rotate(-180deg);
    transform: rotate(-180deg);
}
.ui-banner .unslider-nav{
	position: absolute;
	bottom: 10px;
	left: 0;
	right: 0;
	top: auto;
	min-height: 25px;
	margin: 0;
	z-index: 10;
}
.ui-banner .unslider-nav ol li{
	display: inline-block;
	float: none;
	width: 16px;
	height: 16px;
	margin: 0 4px;
	padding: 3px;
	background: transparent;
	border-radius: 16px;
	overflow: hidden;
	text-indent: -999em;
	border: 2px solid #fff;
	cursor: pointer;
	opacity: .4;
}
.ui-banner .unslider-nav ol li.unslider-active{
	background: #fff;
	cursor: default;
	opacity: 1;
}
/* ui content */
.ui-content{
	padding: 20px;
	margin: auto;
	width: 1200px;
	min-width: 1200px;
	background: #fff;
}


/* ico projects */
.ico-projects{ margin-bottom: 30px; }
.ico-projects .title{
	line-height: 24px;
	text-transform: uppercase;
	color: #666;
}
.ico-projects .sub-title{
	position: relative;
	margin-left: 30px;
	margin-bottom: 20px;
	line-height: 30px;
	font-size: 24px;
	color: #333;
	text-transform: uppercase;
}
.ico-projects .sub-title::before{
	content: "";
	position: absolute;
	left: -30px;
	top: 3px;
	width: 24px;
	height: 24px;
	background-color: #EE3531;
}
.ico-projects .project-list{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
}
.ico-projects .ico-project{
	display: inline-block;
	margin-bottom: 15px;
	width: 380px;
	box-shadow: 2px 2px 1px rgba(0,0,0,0.075);
	transition: 0.233s;
}
.ico-projects .ico-project:hover{
	box-shadow: 5px 5px 5px rgba(0,0,0,0.15);
}
.ico-project .image-box{position: relative;}
.ico-project .image-box img{
	width: 380px;
	height: 225px;
	vertical-align: bottom;
}
.ico-project .image-box .image-wrapper{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(0,0,0,0.5);
	visibility: hidden;
	opacity: 0;
	transition: 0.233s;
}
.ico-project .image-box .image-wrapper a{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background-color: #efefef;
	font-size: 60px;
	opacity: 0;
	transition: 0.233s;
}
.ico-project .image-box:hover .image-wrapper{
	visibility: visible;
	opacity: 1;
	transition: 0.233s;
}
.ico-project .image-box:hover .image-wrapper a{
	width: 40px;
	height: 40px;
	font-size: 16px;
	opacity: 1;
}
.ico-project .project{
	padding: 10px;
	background-color: #fff;
}
.ico-project .project .name{
	margin: 0;
	line-height: 36px;
	font-size: 18px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ico-project .project .name a{ color: #009AFF !important; }
.ico-project .project p{
	line-height: 24px;
	text-align: center;
	font-size: 14px;
}
.ico-project .project .btn.btn-dark{
	background-color: #333;
	color: #fff;
	transition: 0.233s;
}
.ico-project .project .btn.btn-default{
	background-color: #fff;
	border-color: #ddd;
}
.ico-project .project .btn.btn-dark:hover{ color: #EE3531; }

/* ico slider */
.ico-slider{ min-height: 180px; }
.ico-slider .unslider-wrap li{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-right: 8px;
	min-height: 180px;
}
.ico-slider .slider-wrapper{
	display: flex;
	margin-bottom: 30px;
	padding: 20px;
	width: 580px;
	background-color: #fff;
	transition: 0.233s;
	float: left;
}
.ico-slider .slider-wrapper .slider-avatar img{ 
	width: 120px;
	height: 120px;
	border-radius: 50%;
}
.ico-slider .slider-wrapper .slider-info{
	width: 420px;
	padding-left: 20px;
}
.ico-slider .slider-info .name{
	margin: 0;
	height: 30px;
	font-weight: normal;
	font-size: 20px;
}
.ico-slider .slider-info .name a:not(.btn):hover{
	color: #EE3531;
}
.ico-slider .slider-info .name .btn{
	color: #333;
	border-color: #333;
	background-color: #fff;
	box-shadow: none;
	letter-spacing: 3px;
	opacity: 0;
	visibility: hidden;
	transition: 0.233s;
}
.ico-slider .slider-wrapper:hover{
	box-shadow: 6px 6px 6px rgba(0,0,0,0.25);
	transition: 0.233s;
}
.ico-slider .slider-wrapper:hover .btn{
	opacity: 1;
	visibility: visible;
	transition: 0.233s;
}
.ico-slider .slider-info .text-sub{
	line-height: 20px;
	font-size: 12px;
}
.ico-slider .slider-info .slider-group{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 10px;
	height: 60px;
	border-top: 1px solid #ddd;
}
.ico-slider .slider-info .slider-group .slider-item{
	display: inline-flex;
	width: 33.333%;
	font-size: 12px;
	color: #666;
}
.ico-slider .slider-info .slider-group .slider-item span{ margin: 0 5px; }
.ico-slider ~ .unslider-nav ol li{
	width: 10px;
	height: 10px;
	border: 1px solid #ddd;
	border-radius: 50%;
	transition: 0.233s;
}
.ico-slider ~ .unslider-nav ol li.unslider-active{ 
	background-color: #EE3531;
	border-color: #EE3531;
}

/**/
.ui-filter-tags{
	margin: 0 0 10px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	list-style: none;
}
.ui-filter-tags li a{
	display: inline-block;
	margin: 0 5px;
	font-weight: 600;
	font-size: 14px;
	color: #999;
}
.ui-filter-tags li a span{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 15px;
	width: 20px;
	background-color: #ddd;
	color: #fff;
	font-size: 12px;
	border-radius: 2px;
	font-weight: normal;
}
.ui-filter-tags li a.active,
.ui-filter-tags li a:hover{
	color: #009AFF;
}
.ui-filter-tags li a.active span,
.ui-filter-tags li a:hover span{
	background-color: #009AFF;
}
.ui-filter-list{
	margin-bottom: 20px;
	border: 1px solid #EAEAEA;
}
.ui-filter-list .ui-filter-item:not(:last-child){
	border-bottom: 1px solid #EAEAEA;
}
.ui-filter-list .ui-filter-item{
	display: flex;
}
.ui-filter-list .ui-filter-item .ui-filter-lead{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	min-height: 50px;
	background-color: #F5F5F5;
	font-size: 12px;
}
.ui-filter-list ul{
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ui-filter-list ul li{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 4px;
}
.ui-filter-list ul li a{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	min-height: 24px;
	font-size: 12px;
    padding: 0 3px;
}
.ui-filter-list ul li a:hover,
.ui-filter-list ul li.active a{
	background-color: #009AFF;
	color: #fff;
}
.ui-project-header{
	margin-bottom: 20px;
	background-color: #fff;
}
.ui-project-header .pro-content{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 auto;
	min-width: 1200px;
	width: 1200px;
}
.ui-project-header .pro-content .pro-left{
	font-size: 30px;
	color: #333;
}
.ui-project-header .pro-content ul{
	display: flex;
}
.ui-project-header .pro-content ul li{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 15px;
	min-height: 100px;
}
.ui-project-header .pro-content ul li a{
	font-size: 16px;
	color: #666;
	text-decoration: none;
}
.ui-project-header .pro-content ul li.active ::after{
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	background-color: #009AFF;
}
.ui-project-header .pro-content ul li.active a{ color: #009AFF; }

/* ui discus */
.ui-discus{
	background-color: #fff;
}
.ui-group .header{
	position: relative;
	padding: 40px 0;
	text-align: center;
}
.ui-group .header::before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	border-bottom: 1px solid #efefef;
	z-index: -1;
}
.ui-group .header .text{
	display: inline-block;
	padding: 10px 20px;
	font-size: 36px;
	background-color: #fff;
}

.ui-discus-list{
	display: flex;
	flex-wrap: wrap;
}
.ui-discus-list li{
	position: relative;
	padding-left:190px;
	margin-bottom: 20px;
	width: 50%;
}
.ui-discus-list .image-item{
	position: absolute;
	top: 0;
	left: 0;
	width: 180px;
	height: 120px;
	vertical-align: bottom;
}
.ui-discus-list .info .title{
	line-height: 30px;
	font-size: 20px;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #333;
	transition: 0.35s;
}
.ui-discus-list .info .title:hover{ color: #009AFF }
.ui-discus-list .info p{
	line-height: 25px;
	font-size: 14px;
	color: #999;
}
.ui-discus-list .group{
	display: flex;
	align-items: center;
	min-height: 40px;
	color: #999;
	font-size: 12px;
}
.ui-discus-list .group .avatar{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-right: 40px;
	color: #999;
}
.ui-discus-list .group .avatar img{
	margin-right: 10px;
	width: 36px;
	height: 36px;
	border-radius: 50%;
}
.ui-discus-list .group .commet .item{ margin-right: 10px; }
.ui-discus-list ~ .read-more a{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 5px 20px;
	background-color: #E5E9ED;
	color: #9d9d9d;
	border-radius: 4px;
	transition: 0.35s;
}
.ui-discus-list ~ .read-more a:hover{
	background-color: #009AFF;
	color: #fff;
}
.read-more .ico-more{
	display: inline-block;
	width: 30px;
	height: 30px;
	background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAADqElEQVR4Xu2agXXTMBCGkwmACUgngE6AmYB2gqYTABMAE1AmIJ2AdgLSCWgnIJ0AmCD8P+/c55baOp3uHCex3stzKJZ0/6fTSSdlOtnzMt1z/ZMRwOgBe05gnAJ77gD9BcH1ev0UsF/gUwn0+lmPwVK+8HkznU5/9zE4oVMAol9CxImI5vecco2XCeMcMPg9pIQAgHCKfodPrug2kQRwBhDn3hRcAUD4EQz8jM/M21Bpb4Xne4C48GrfBYDM72/i6l62dbVDAKcecaIYAMRXMIbiGeT6LAySx4DAOGEuRQAgfo6ev5p796lIT1hYmzIDGIj4WrcZggnAwMQXQcgGIHP+u9Xlguu9zo0JWQAk2v/cQMDTcmNgPMhZHXIBMNpzrR9yuQCAY62BagCyySGAbSjqqZADgK4/2wb1sHEFLzjQ2KoCMNCon9KnWhq1AH6gN6/EJmW41/9fwwsOU40lAUhKSwDbWA5TqbQGwBmUv91G9bD5CwAwLW8tGgDb6P614OQ06AQgG59fhtH/gzpPDPW6qljbfNa1MUoBqGBR7rb3FHXq4ywvCBRPWxiIc7PPzj1BCsBHdPghYyTvlh4JnksHT/gnvg5mhiX5E+pSx6MlDAB7c4BwT7y0Oc/0giIAHMFXGR7AV+9tQAogeIinPZfwgNb8JeUBFgAeELzE05YrAGD8ME0BK4ASCJ7iNwrAAsFbfPEUYPTMWQUeczNtTIgQT3uKgqAHAI0nRIkvBsDgkbsRaos3bZ7A9+/Wef7DsNa39cm/F22EeNlh2QrnQJg0MzZn8bTDvhWW0eC2ltfaXqX1oCJAPK/ZO88xNNlgRDr8H4QA8Rwwl3SYBCMORJp5wxx95CY5Go8sPxAJmga18cwcWSLEJ92fHSenQEBU1oycxzt+h6ICYYXncw/LemjjFsFvpulH5QECgBnV/l6MCAT+MuONhuwG3+lMfx/apfYAAcCNEaeC11GXNyduqWdhl6MCocLTa3vsDUB9J1h3nOUBdaWgTUspDFXUL5oCzcoDg2ASTz0mDxiYJ5jFFwNoxASuDn0HRga8IwS8ZcncKfKAhidwdVj0uEReoq95TrRvg+QCoAGCmyVmj1E7xlsRXjTqTRiuAB7EBt7Kep0j3BAsRpxe5lpCADRAMJWe41MZYFA0R3rRPDFyVY/GQgE0jZWbZgIhDBZ+r39fzJ+38eSJhaJ5rc2/hZfeAIQrMXYwAjCC25lqowfszFAahYweYAS3M9X+AlIzjlA1afutAAAAAElFTkSuQmCC") no-repeat center;
	background-size: 90%;
	border-radius: 50%;
	transform: rotate(-90deg);
}

/* ui join */
.ui-join{
	position: relative;
	margin-bottom: 30px;
	width: 100%;
	min-height: 400px;
	background: transparent url("../images/join.jpg") no-repeat center;
	background-size: cover;
}
.ui-join .ui-group-wrapper{
	position: absolute;
	display: flex;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 100px;
	align-items: flex-start;
	justify-content: center;
}
.ui-join .avatar img{
	width: 100px;
	height: 100px;
	border-radius: 50%;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-40px);
	transition: 0.4s;
}
.ui-join .info{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 10px 20px;
	margin-left: 50px;
	min-height: 200px;
	background-color: #fff;
	opacity: 0;
	visibility: hidden;
	transform: translateY(40px);
	transition: 0.4s;
}
.ui-join .ui-group-wrapper:hover .avatar img{
	transform: translateX(0px);
	opacity: 1;
	visibility: visible;
}
.ui-join .ui-group-wrapper:hover .info{
	transform: translateY(0px);
	opacity: 1;
	visibility: visible;
}
.ui-join .info::before{
	content: "";
	position: absolute;
	left: -24px;
	top: 24px;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 24px solid #fff;
}
.ui-join .info h3{
	font-size: 36px;
	line-height: 60px;
}
.ui-join .info p{
	font-size: 24px;
	line-height: 50px;
	color: #666;
}
.ui-join .info a{
	display: inline-flex;
	justify-content: center;
	padding: 8px 24px;
	min-width: 150px;
	color: #fff;
	background-color: #009AFF;
	border-radius: 4px;
	transition: 0.35s;
}
.ui-join .info a:hover{ opacity: 0.7; }
/* ui partner */
.ui-partner{ margin-bottom: 20px; }
.ui-partner .header .text{
	background-color: #F5F8F9;
}
.list-partner{
	display: flex;
	flex-wrap: wrap;
}
.list-partner li{
	padding: 5px;
	width: 240px;
}
.list-partner li a{
	display: block;
	transition: 0.35s;
}
.list-partner li a:hover{
	box-shadow: 0 0 5px rgba(0,0,0,0.15);
}
.list-partner li a img{
	width: 230px;
	height: 110px;
	vertical-align: bottom;
}

.ui-wrapper{
	display: flex;
	justify-content: space-between;
}
.ui-wrapper .ui-left{
	padding-right: 10px;
	width: 850px;
}
.ui-wrapper .ui-right{
	padding-left: 10px;
	width: 350px;
}

.ui-release .header{
	position: relative;
	padding: 10px;
	line-height: 24px;
	font-size: 16px;
	border-bottom: 1px solid #efefef;
}
.ui-release .header::before{
	content: "";
	position: absolute;
	top: 12px;
	left: 0;
	bottom: 12px;
	width: 4px;
	background-color: #009AFF;
}
.ui-release .ui-release-user{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	padding: 20px 10px;
}
.ui-release .ui-release-user img{
	width: 100px;
	height: 100px;
	border-radius: 50%;
	vertical-align: bottom;
}
.ui-release .ui-release-user .info{
	padding: 10px;
	min-width: 210px;
}
.ui-release .ui-release-user .info h4{
	margin: 0;
	line-height: 34px;
	font-size: 16px;
	color: #666;
}
.ui-release .ui-release-user .info p{
	line-height: 24px;
	font-size: 14px;
	color: #9d9d9d;
}
.ui-release .desc{
	padding: 10px;
	min-height: 120px;
}
.ui-release .desc p{
	line-height: 24px;
	color: #666;
}
.ui-wrapper .ico-tags{ width: 100%; }
.ui-example .header{
	position: relative;
	padding: 5px 0 0 18px;
	font-size: 16px;
	line-height: 34px;
	border-bottom: 1px dashed #ddd;
}
.ui-example .header::before{
	content: "";
	position: absolute;
	top: 17px;
	left: 0;
	width: 10px;
	height: 10px;
	background-color: #009AFF;
}
.ui-example .ui-example-content{  padding: 10px 0;  }
.ui-example .ui-example-content .btn{ color: #fff; }
.ui-wrapper .media-list{
	padding: 10px;
	background: #fff;
}
.ui-wrapper .media-list .media{
	padding-top: 15px;
	border-top: 1px dashed #ddd;
}
.ui-wrapper .media-list .media-object{
	width: 40px;
	height: 40px;
	vertical-align: bottom;
	border-radius: 50%;
}
.ui-wrapper .media-list .media-heading{ font-size: 12px; }
.ui-wrapper .media-list .media-heading span{ color: #9d9d9d; }
.ui-wrapper .media-list .media-body p{
	margin-bottom: 5px;
	min-height: 30px;
	line-height: 22px;
	color: #666;
	font-size: 12px;
}
.ui-wrapper .media-list .ref{
	display: flex;
	align-items: center;
	margin-bottom: 5px;
}
.media-list .ref-item a{
	font-size: 12px;
	color: #999;
	transition: 0.333s;
}
.media-list .ref-item a:hover,
.media-list .ref-item a.active,
.media-list .ref-item a:hover .fa,
.media-list .ref-item a.active .fa{
	color: #009AFF;
}
.media-list .ref-item .fa{ color: #999; }
.media-list .ref-item .glyphicon{ margin-right: 3px;}
.media-list .ref-item:not(:last-child){ margin-right: 20px; }
/* 新闻 */
.news-head{
	padding-bottom: 20px;
	border-bottom: 1px solid #eee;
}
.news-head .news-title{
	line-height: 34px;
	font-size: 18px;
	font-weight: 600;
}
.search-group{
	display: flex;
	justify-content: center;
	align-items: center;
}
.search-group input{
	display: inline-block;
	padding: 6px 10px;
	height: 34px;
	border: 1px solid #eee !important;
	outline: none !important;
	transition: 0.3s;
}
.search-group input:focus{ border-color: #2BAAFB; }
.search-group button{
	display: inline-block;
	height: 34px;
	width: 40px;
	border: 1px solid #eee;
	border-left: none;
	background-color: transparent;
	outline: none !important;
	transition: 0.3s;
}
.search-group button:hover{
	background-color: #2BAAFB;
	border-color: #2BAAFB;
	color: #fff;
}

.news-item{
	display: flex;
	justify-content: space-around;
	padding: 20px 0;
	border-bottom: 1px solid #f5f5f5;
}
.news-item .thumbnail{
	position: relative;
	display: inline-flex;
	padding: 0;
	margin-bottom: 0;
	border: none;
}
.news-item .thumbnail a{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.25);
	opacity: 0;
	visibility: hidden;
	transition: 0.35s;
}
.news-item .thumbnail:hover a{
	opacity: 1;
	visibility: visible;
}
.news-item .thumbnail:hover a::before{
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAEYUlEQVR4Xu1bgXXTMBBNJoANaCdomYBkAsoGYQJgAsIElAlIJ6BMQDJB2wkIE0AnCP/3nXmKfJLOtmyLJHpPz6kjyff/fUmnczqdHHmZHjn+yYmAkwL+EwZ2u90lTH2FeoXKz88d0+/xmfUWdTOdTv9YYRU/BQD8DGA+oi6MoLZotwQJN5b2RRMA8AT92fO2BRfbUBHzlBqKJQDg6fWlFW2gHdXwBiSQDLUUSQDAf01IfiMe5lznesD6IoAxqoTiCEiA/wBvXmtAZZFc4bsL5fs1+s21fkUREAH/QEXEpFyBwxicNpw+fuFU4C6xV4ohIAF+llrMXFQBErYY47xIAnKCd5TAue9Ph5e+ikZXQB/gSQLGneHyw/P4FxDw3r03KgF9gXdUsPMIYJRIYv6V0QjoG7yoYI0rw+eqlEHAEOCFAG6Z7/Y8DgmMqoChwAcU8AD8DJrGmQJDghcCfuPqnhrHmwIAz2PsN29R4p8Mchrt88oYtVtyivzpfXEDBSxGUUAgOOkFvHifZJN0t9SiwcF2AWVf7hO8prZHeN+dDk/EDEaAeIWGUYJr1FWT8NYie3kGFzkGQD7YT3je0h9nUAKsINq2kxOhBv4XxrzUCD8YAiLgH2WRVZMiB0FABDzF9BaeX4VUlZUAGMKoi/N8i8rkhTk7K4skszrfG/YLzfkk+KyLoBLkEIi/DamO8PqStHMLCV08XxmSRQGBCE/ddnwGAn2jsk2s9ibPZyMgEt7Wzt5G8GxWS1y4fXN4PgsBXWL7SN9auNoX+E5rwCGAb03AoYBvRcBI4M9g7B1qLZZP7fOh/b/VGtAR/AwP9ZOUtCM652XFZz7/tQImuVtkI6ALeAGxwJWvvNySBC9917i6uT3e7gzePAW6ghcQlO8W9ZkwYAIvff3jbRbwJgJygK9cjrFIAsHc+y8oUlKVvZ/T6BZ9SWSWEo0E8VC+ROD7eb/0lszIgqrBIEEChs7hNbA5a1OVAJEqE4r+tnMwnq9YDBGwRAP/FXMwq9LVJZLBZRKTR9s1KpOX5qN0l+eHCPDfqfEZcxhF47IWURvjA/eFRfIglcuIGgGBud+LQQHwxGbeIrsSoRGgyT96PG1jRAR8b2rT7NQIoMz3oi5IP0vipDIgAT5bkGNxjIWADfDPLINZ2pQEnvYOSkBp4K0ETHJMgRLBhwjIvgiWCj5EgPZisfU2WDJ4lQDehNFZAqHSwccI0KbBFh0YD5hCVC+89TeIQbe62O4UOwwRcJW8qMbgPRrPWCFYAJ6vyEhi9hyeZatt0iZ2HF5gID+FVY29wgdW/ujoSRHicf4ykzmEWcCIYjxf2ZdKiNCL2g+PXXxUBT2tedttVxx4GpcMcSNZIavS+H6ev/RmZre4kiRA5M2t8Ro19E8JIWDMIVw1zf8NyZKJACGBEuf8XhiIIHD+49JqSDBtnmUmwB1cMrTVu38mMrgQci3gNWvWtg2oJn1aEdDkAaW3PRFQuof6tu/oFfAXrjBMX31GQUYAAAAASUVORK5CYII=") no-repeat center;
	opacity: 0.7;
}
.news-item .thumbnail img{
	width: 240px;
	height: 144px;
}
.news-item .news-info{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-direction: column;
	width: 300px;
	margin-left: 15px;
}
.news-item .news-info h4{
	margin: 0;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.news-item .news-info p{
	margin-bottom: 0;
	color: #999;
}
.news-item .news-info a{
	text-decoration: none !important;
	color: #2BAAFB;
}
.news-item .news-info span{ color: #ccc; }
.news-item .news-info .fa{ color: #9d9d9d; }

/* 分页 */
.main-container .pagination li a{
	margin: 0 2px;
	border: none;
	background-color: #eee;
	color: #9d9d9d;
	border-radius: 0;
}
.main-container .pagination li.disabled a{
	background-color: #dfdfdf;
	color: #9d9d9d;
	cursor: text;
}
.main-container .pagination li:not(.disabled) a:hover,
.main-container .pagination li.active a{
	background-color: #2BAAFB;
	color: #fff;
}


/* 标题导航 */
.main-title li a{
	display: block;
	padding: 6px 12px;
	background-color: #f6f6f6;
	color: #9d9d9d;
	text-decoration: none !important;
}
.main-title li a.current{
	background-color: #2BAAFB;
	color: #fff;
}
.main-container .al-show{ padding-bottom: 20px; }
.main-container .al-show .thumbnail{
	position: relative;
	padding: 0;
	border: 0;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.main-container .al-show .thumbnail img{
	width: 100%;
	height: 240px;
}
.main-container .al-show .thumbnail::before{
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	color: #f5f5f5;
	font-size: 48px;
	line-height: 240px;
	text-align: center;
	transition: 0.3s;
	z-index: -1;
}
.main-container .al-show .thumbnail:hover::before{
	content: "\f0c1";
	background-color: rgba(0,0,0,0.25);
	z-index: 1;
}
.main-container .al-show p{  color: #9d9d9d;  }
.main-container .al-show p.caption{
	color: #2BAAFB;
	font-size: 16px;
	font-weight: 600;
}

/* 新闻详情 */
.news-detail .news-header{
	padding: 10px 20px;
	margin-bottom: 30px;
	text-align: center;
	border-bottom: 1px solid #efefef;
}
.news-detail .news-header h3{
	font-size: 24px;
	font-weight: 600;
	line-height: 60px;
    margin-top:60px;
}
.news-detail .news-header p {
	font-size: 12px;
	line-height: 30px;
	color: #9d9d9d;
}
.news-detail .news-infomation{
	padding: 20px 0;
	margin-bottom: 20px;
}

/* 博客 */

.ui-blog .blog-item{
	position: relative;
	padding: 20px;
	display: flex;
	background-color: #fff;
	border: 1px solid #f2f2f2;
}
.ui-blog .blog-item::before{
	content: "";
	position: absolute;
	left: 0;
	top: 20px;
	width: 4px;
	height: 28px;
	background-color: #237BE0;
	z-index: 10;
}
.ui-blog .blog-item .blog-image-box{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 200px;
	min-width: 200px;
	height: 150px;
	overflow: hidden;
}
.ui-blog .blog-item .blog-image-box::after{
	content: attr(data-name);
	position: absolute;
	left: 0;
	top: 0;
	min-width: 80px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #237BE0;
	color: #fff;
	z-index: 100;
}
.ui-blog .blog-item .blog-image-box img{
	height: 150px;
	transition: 0.6s;
}
.ui-blog .blog-item .blog-image-box:hover img{
	transform: scale(1.2);
}
.ui-blog .blog-item:not(:last-child){  margin-bottom: 20px; }

.ui-blog .blog-item .blog-wrapper{  padding-left:  20px;  }
.ui-blog .blog-item .blog-wrapper .title{
	margin: 0;
	height: 30px;
	font-size: 20px;
	font-weight: 600;
	transition: color 0.333s;
}
.ui-blog .blog-item .blog-wrapper .title a:hover{ color: #237BE0; }
.ui-blog .blog-item .blog-wrapper .wrapper{
	height: 90px;
	color: #777;
}
.ui-blog .blog-item .blog-wrapper .wrapper p{
	margin: 0;
	line-height: 24px;
}
.ui-blog .blog-item .blog-wrapper .group{
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	height: 30px;
	color: #999;
}
.ui-blog .blog-item .blog-wrapper .group .item .glyphicon{ margin-right: 3px; }
.ui-blog .blog-item .blog-wrapper .group .item:not(:last-child){ margin-right: 10px; }
.ui-blog .blog-item .blog-wrapper .more{
	position: absolute;
	right: -1px;
	bottom: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 80px;
	height: 32px;
	background-color: #237BE0;
	color: #fff;
	transition: 0.333s;
}
.ui-blog .blog-item .blog-wrapper .more:hover{  background-color: #5e5e5e;  }
/* 博客侧边栏 */
.ui-blog-aside{
	padding-left: 15px;
}
.blog-aside-group{
	margin-bottom: 20px;
	border: 1px solid #f2f2f2;
	background-color: #fff;
}
.blog-aside-group .header{
	position: relative;
	padding-left: 30px;
	line-height: 34px;
	border-bottom: 1px solid #f2f2f2;
	font-weight: 600;
	font-size: 14px;
	background-color: #f5f5f5;
}
.blog-aside-group .header::before{
	content: "";
	position: absolute;
	top: 4px;
	left: 2px;
	width: 26px;
	height: 26px;
	background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAk0lEQVQ4T2NkoBAwgvTv27fvASMjozyaWRccHR0NofIXgPL6aPIPgPKKMAMOODk5OSAr2L9//3+gArA8MhumBmgpWM8wMgAUiPeRw+D///+GQD8KQAPxA1D+PJq8IlBeARwGlADqGABKB0BXgDAyMED2AlDiApq8AtwLsDgdTQeomQmYDi4CA8kAV2YCyj+kSjoAANFTtBHg7iFnAAAAAElFTkSuQmCC") no-repeat center;
}
.blog-aside-group .content{ padding: 15px 10px; }
.blog-aside-group .group-list.list-thumbnail li{
	position: relative;
	padding-left: 100px;
	min-height: 75px;
}
.blog-aside-group .group-list.list-thumbnail li:not(:last-child){ margin-bottom: 15px; }
.blog-aside-group .group-list.list-thumbnail .image-box{
	position: absolute;
	top: 0;
	left: 0;
	width: 100px;
	height: 75px;
	overflow: hidden;
}
.blog-aside-group .group-list.list-thumbnail .image-box a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100px;
	height: 75px;
}
.blog-aside-group .group-list.list-thumbnail .image-box img{
	max-width: 100px;
	transition: 0.6s;
}
.blog-aside-group .group-list.list-thumbnail .image-box:hover img{ transform: scale(1.2); }
.blog-aside-group .group-list.list-thumbnail .wrapper{ padding-left: 5px; }
.blog-aside-group .group-list.list-thumbnail .wrapper .title{
	max-height: 50px;
	line-height: 25px;
	font-size: 14px;
	color: #666;
}
.blog-aside-group .group-list.list-thumbnail .wrapper .title a:hover{ color: #009AFF; }
.blog-aside-group .group-list.list-thumbnail .wrapper .group{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	height: 25px;
}
.blog-aside-group .group-list.list-thumbnail .wrapper .group span{
	color: #9d9d9d;
	font-size: 12px;
}
.blog-aside-group .group-list.list-catalog{
	display: flex;
	flex-wrap: wrap;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}
.blog-aside-group .group-list.list-catalog li{
	width: 50%;
	overflow: hidden;
}
.blog-aside-group .group-list.list-catalog li a{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	line-height: 34px;
	transition: 0.15s;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
.blog-aside-group .group-list.list-catalog li:nth-child(odd) a{ border-right: 1px solid #ddd; }
.blog-aside-group .group-list.list-catalog li a:hover{
	background-color: #237BE0;
	color: #fff;
	border-color: #237BE0;
}
.blog-aside-group .group-list.list-only li{
	position: relative;
	padding-left: 14px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.blog-aside-group .group-list.list-only li::before{
	content: "";
	position: absolute;
	left: 0;
	top: 10px;
	height: 12px;
	width: 12px;
	background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAW0lEQVQ4T2NkoBAwUqifgTYGFBQUGIBcNmHChAuEXIjVBVADNgA1BxAyBKcXiDUEbxgQYwjBQCRkCG0NIGQ7KIZoE4jE2AxLH/jSAfkJiVDqQ5YnGAuEDKPYAABORzARUZw3uwAAAABJRU5ErkJggg==") no-repeat center;
}
.blog-aside-group .group-list.list-only li a{
	line-height: 30px;
	transition: color 0.35s;
	font-size: 14px;
}
.blog-aside-group .group-list.list-only li a:hover{ color: #237BE0; }

/* 博客详情 */
.ui-blog-detail .blog-detail-wrapper{
	position: relative;
	margin-bottom: 20px;
	width: 100%;
	/*min-height: 400px;*/
	background-color: #fff;
	border: 1px solid #f5f5f5;
}
.ui-blog-detail .blog-detail-wrapper .wrapper{
	position: absolute;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 5px 10px;
	line-height: 34px;
	background-color: #f8f8f8;
}
/* 编辑框 */
.ui-reply #message-reply{
	width: 100%;
	min-height: 120px;
	border: none;
	outline: none;
	resize: none;
}
.ui-reply .btn-reply{
	display: inline-block;
	padding: 15px 100px;
	margin-top: 10px;
	border: 1px solid #ddd;
	background-color: #fff;
	font-size: 14px;
	transition: 0.333s;
}
.ui-reply .btn-reply:hover{
	background-color: #237BE0;
	color: #fff;
	border-color: #237BE0;
}