﻿
/* 经典案例 */
.page_ClassicCase { font-family: "Noto Sans S Chinese Light", "NotoSansHans-Regular", "Microsoft YaHei", "微软雅黑", "STHeiti"; color: #fff; padding-bottom:150px; }
.page_ClassicCase h1 { font-size: 46px; margin-top:80px; margin-bottom:100px; padding-left:10px; }
.page_ClassicCase h1 a { color:#fff; }
.page_ClassicCase h1.ky { color:#333; }
.page_ClassicCase h1.ky a { color:#333; }
/* 列表页 */
ul { padding: 0; list-style-type: none }
.syicon { background: url(../Images/xyicon.png) no-repeat }
/* 列表通用 图文自动识别 */
.blog-post { padding: 0; margin-bottom: 36px }
.blog-post-articl { margin-bottom: 0 }
.blog-post .post { padding: 30px 15px 0 }
.post .post-title { margin-top: 0; font-size: 36px; font-weight: 100; color: #333 }
.post .post-title a { display: block; float: left; width: 90%; max-height: 76px; overflow: hidden; word-break: break-all; margin-top: 0; font-size: 36px; font-weight: 100; color: #333; text-decoration: none }
.post .post-title a.post-share { float: right; display: inline-block; width: 16px; height: 14px; background-position: 0 -420px }
.post .post-content { font-size: 24px; color: #666; line-height: 20px; }
.post .post-content img { width: 100%; height: auto }
.post .post-content a { color: #666; text-decoration: none; line-height: 20px; }
.post .post-info { font-size: 20px; color: #666 }
.post .post-info a { font-size: 20px; float: right; line-height: normal; }
.post .font { color:#333 !important; font-size:16px !important; }
.blog-post .post-hd { padding: 36px 15px 0 }
.post-hd .post-info { margin-top: 10px; margin-bottom: 13px }
.post-hd .post-pic { margin-top: 36px }
.post-hd .post-line,
.post .post-line { width: 100%; height: 1px; margin-top: 36px; border-bottom: 1px solid #ebebeb }
.post-inner { padding: 0 0 15px; margin-bottom: 15px; border-bottom: solid 1px #e1e1e1 }
.post-last { padding-bottom: 0; margin-bottom: 0; border: none }
.blog-post .post-articl .breadcrumb { margin-bottom: 20px; background: none }
.blog-post .post-articl .post-content { padding: 20px 0 60px }
.blog-post .post-articl .xyi-btn-lg { display: inline-block; width: 200px; height: 44px; margin-bottom: 80px; line-height: 44px; font-size: 18px; background-position: 0 -312px; color: #fff; text-align: center; text-decoration: none }
.blog-post .post-articl .xyi-btn-lg:hover { background-position: 0 -366px; }
.sidebar { padding-left: 0; padding-right: 0 }
.sidebar .sidebar-widget { padding: 0 15px; margin-bottom: 15px; background: #fff }
.sidebar .sidebar-widget h4 { font-size: 18px; font-weight: normal; color: #000; padding: 10px 0; border-bottom: solid 1px #e1e1e1 }
.sidebar .sidebar-widget li { padding: 15px 0 15px 5px; border-bottom: solid 1px #e1e1e1 }
.sidebar .sidebar-widget li a:hover { color: #333 }
.sidebar .sidebar-widget .active a { color: #333 }
.active i { position: absolute; left: -10px; top: 16px; width: 4px; height: 24px; font-size: 0px; background-color: #f9460b; display: block !important; }
.sidebar .sidebar-widget a { font-size: 16px; color: #666; text-decoration: none }
.sidebar .sidebar-widget .last-item { border-bottom: none; }
.sidebar .nav-cat { padding: 0 }
.sidebar .nav-cat h4 { padding: 15px; margin: 0; background: #999; color: #fff; border-radius: 4px 4px 0 0; }
.sidebar .nav-cat ul { padding: 0 10px }
.sidebar .nav-cat li { padding: 15px 5px 15px 10px; position: relative; }
.sidebar .nav-cat li i { display: none; }
.sidebar .news li { padding: 10px 0 0 0 }
.sidebar .news a { display: inline-block; margin-bottom: 10px; }
.sidebar .news p { word-break: break-all; color: #666 }
.sidebar .news .hdmedia { margin-bottom: 10px }
/* 新闻频道页 */
.grid { position: relative; clear: both; list-style: none; text-align: center; }
/* Common style */
.grid figure { position: relative; float: left; overflow: hidden; margin: 10px 1%; min-width: 313px; max-width: 370px; max-height: 275px; width: 31.3%; height: auto; background: #3085a3; text-align: left; cursor: pointer; }
.grid figure img { position: relative; display: block; min-height: 100%; max-width: 100%; opacity: 1; }
.grid figure figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.grid figure figcaption::before,
.grid figure figcaption::after { pointer-events: none; }
.grid figure figcaption,
.grid figure figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; }
.grid figure h2 { font-size: 18px; word-spacing: -0.15em; font-weight: 300; }
.grid figure h2 span { font-weight: 800; }
.grid figure h2,
.grid figure p { margin: 0; }
.grid figure p { letter-spacing: 1px; font-size: 68.5%; }
/* Individual effects */
.grid2 { position: relative; clear: both; list-style: none; text-align: center; }
/* Common style */
.grid2 figure { position: relative; float: left; overflow: hidden; margin: 10px 1%; min-width: 313px; max-width: 370px; max-height: 275px; width: 31.3%; height: auto; background: #3085a3; text-align: center; cursor: pointer; }
.grid2 figure img { position: relative; display: block; min-height: 100%; max-width: 100%; opacity: 0.8; }
.grid2 figure figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.grid2 figure figcaption::before,
.grid2 figure figcaption::after { pointer-events: none; }
.grid2 figure figcaption,
.grid2 figure figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid2 figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; }
.grid2 figure h2 { font-size: 16px; word-spacing: -0.15em; font-weight: 300; }
.grid2 figure h2 span { font-weight: 800; }
.grid2 figure h2,
.grid2 figure p { margin: 0; }
.grid2 figure p { letter-spacing: 1px; font-size: 68.5%; }

/* Individual effects */
.grid3 { position: relative; clear: both; list-style: none; text-align: center; }
/* Common style */
.grid3 figure { position: relative; float: left; overflow: hidden; min-width: 350px; max-width: 370px; max-height: 275px; width: 31.3%; height: auto; background: #3085a3; text-align: center; cursor: pointer; }
.grid3 figure img { position: relative; display: block; min-height: 100%; max-width: 100%; opacity: 0.8; }
.grid3 figure figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.grid3 figure figcaption::before,
.grid3 figure figcaption::after { pointer-events: none; }
.grid3 figure figcaption,
.grid3 figure figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid3 figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; }
.grid3 figure h2 { font-size: 16px; word-spacing: -0.15em; font-weight: 300; }
.grid3 figure h2 span { font-weight: 800; }
.grid3 figure h2,
.grid3 figure p { margin: 0; }
.grid3 figure p { letter-spacing: 1px; font-size: 68.5%; }
/***** Julia *****/
/*---------------*/
figure.effect-julia { background: #2f3238; }
figure.effect-julia img {  -webkit-transition: opacity 1s, -webkit-transform 1s; transition: opacity 1s, transform 1s; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
figure.effect-julia figcaption { text-align: left; }
figure.effect-julia h2 { position: relative; padding: 0.5em 0; }
figure.effect-julia p { display: inline-block; margin: 0 0 0.25em; padding: 0.4em 1em; background: rgba(255,255,255,0.9); color: #2f3238; text-transform: none; font-weight: 500; font-size: 75%; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-360px, 0, 0); transform: translate3d(-360px, 0, 0); }
figure.effect-julia p:first-child { -webkit-transition-delay: 0.15s; transition-delay: 0.15s; }
figure.effect-julia p:nth-of-type(2) { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }
figure.effect-julia p:nth-of-type(3) { -webkit-transition-delay: 0.05s; transition-delay: 0.05s; }
figure.effect-julia:hover p:first-child { -webkit-transition-delay: 0s; transition-delay: 0s; }
figure.effect-julia:hover p:nth-of-type(2) { -webkit-transition-delay: 0.05s; transition-delay: 0.05s; }
figure.effect-julia:hover p:nth-of-type(3) { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }
figure.effect-julia:hover img { opacity: 0.4; -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); }
figure.effect-julia:hover p { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
/*-----------------*/
/***** Goliath *****/
/*-----------------*/
figure.effect-goliath { background: #df4e4e; }
figure.effect-goliath img,
figure.effect-goliath h2 { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; }
figure.effect-goliath img { -webkit-backface-visibility: hidden; backface-visibility: hidden; }
figure.effect-goliath h2,
figure.effect-goliath p { position: absolute; bottom: 0; left: 0; padding: 10px; }
figure.effect-goliath p { text-transform: none; font-size: 90%; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, 50px, 0); transform: translate3d(0, 50px, 0); }
figure.effect-goliath:hover img { -webkit-transform: translate3d(0, -80px, 0); transform: translate3d(0, -80px, 0); }
figure.effect-goliath:hover h2 { -webkit-transform: translate3d(0, -100px, 0); transform: translate3d(0, -100px, 0); }
figure.effect-goliath:hover p { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
/*-----------------*/

/* 翻译服务 */
.sidebar .fanyifuwu { padding-bottom: 15px;  }
.sidebar .fanyifuwu li { color: #fff; border: 1px solid #fff; padding:10px 0 10px 20px;  background-color: #4ea2ce; }

.sidebar .news a  { font-size: 14px; }
.sidebar .fanyilingyu {}
.sidebar .fanyilingyu li { padding-top:10px; padding-bottom: 10px; }
.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1000px) {
  .container {
    width: 1000px;
  }
}
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.row {
  margin-right: -15px;
  margin-left: -15px;
}
@media screen and (min-width: 992px) {
.sidebar { padding-left: 20px; }
}

@media screen and (max-width: 50em) {
	.grid figure {
		display: inline-block;
		float: none;
		margin: 10px auto;
		width: 100%;
	}
	.grid2 figure {
		display: inline-block;
		float: none;
		margin: 10px auto;
		width: 100%;
	}
}
