/*
  auther:f7
  date:2017.2
*/
html,
body { height:100%;}
body { overflow:auto; -webkit-overflow-scrolling:touch; background:#f7f8f8;}
a,
.js-click-change { -webkit-tap-highlight-color:rgba(0,0,0,0);}
input,textarea { outline:none;}
a { color:#333; text-decoration:none;}
a:hover { text-decoration:none;}

/**/
.sharelogo { width:100%; height:100%; position:absolute; top:-200%; left:-200%;}
.sharelogo img { max-width:100%; max-height:100%; }

/**/
.head-box,
.header,
.head-gohome { height:44px;}
.header {height:44px; background:#40403e url("../../img/head-bg.png") no-repeat center center; background-size:100% 100%;}
.head-con{ width:100%; height:100%; margin:auto;}
.head-logo { float:left; padding:5px 10px; height: 100%;}
.head-logo img { height:34px; }
.head-nav { float:right; height:100%;}
.head-nav a { display:inline-block; line-height:34px; color:#f4da7b; padding:5px 20px; font-size:1.2rem;}

.video-con { width:95%; margin:auto; font-size:1em; line-height:30px; color:#333;}
.video-title { padding-top:14px; position:relative;}
.video-title h1 { font-size:1rem; font-weight:normal; margin:0;}
.video-author { position:absolute; top:14px; right:0;}
.video-author span { padding-left:15px;}

/**/
.video-box { overflow:hidden;}
.video { display:inline-block; position: relative; margin: auto; width:100%;}
.video img { width:100%; }
.video em { width:50px;height: 50px; position: absolute;bottom:10px;right:10px; background: url("../../img/open.png");}
.video video { display:block; margin:auto; width:100%; }

/**/
.video-list { padding:2% 0; font-size:0; -webkit-overflow-scrolling:touch; overflow:hidden; width: 100%;}
.video-list-item { float:left; background:#fff; width:48%; margin:1% 0% 0 1.3%; font-size:14px; padding-bottom:2%;}
.video-list-item:active { background-color:rgba(0,0,0,.05);}
.video-list-item img { display:block; width:100%;}
.video-list-item h2 { font-size:15px; padding:8px 8px 0; margin:0 0 4px; line-height:20px; max-height:40px; overflow:hidden;}
.video-list-item p { margin:0; padding:0 8px; color:#999; line-height:20px; font-size:13px;}
.video-list-text { height:74px; overflow:hidden;}
.video-list-photo { position:relative; }
.video-list-photo em { position:absolute; right:0; top:0; background-color:#ee9572; line-height:1.5em; font-size:0.01rem;  color:#ffffff; padding:0 6px; font-style:normal; margin:0 5px 5px 0;}
.video-list-photo strong {position:absolute; right:0; bottom:0; background-color:#666666; line-height:1.5em; font-size:0.8rem; border-radius:8px; color:#fff; padding:0 5px; font-style:normal; margin:0 5px 5px 0;}
.video-list-play { position:absolute; top:0; left:0; width:100%; height:100%; background-size:auto 30%;}

.videos {width: 100%;margin:15px auto 0; }
.video-mod {background-color:#fff;}
.video-mod h1 { margin:0 22px; border-bottom:1px solid #f1f2f3; font-weight:normal; color:#666; font-size:1.2rem; line-height:1.5em; padding-top:10px;}
.video-mod h1 a { color:#666; }
.video-mod h1 a:hover { color:#c00; }
.video-mod-list { font-size:0; padding-bottom:20px; width:100%;}
.video-mod-list a { font-size:1.5rem; display:inline-block; margin:10px 0 0 2%; color:#666; line-height:20px; width:46%;}
.video-mod-list a span { display:block; position:relative;}
.video-mod-list a p{ position:absolute; right:0; top:0; background-color:#ee9572; line-height:1.5em; font-size:0.6rem;  color:#ffffff; padding:0 5px; font-style:normal; margin:0 5px 5px 0;}
.video-mod-list a em { position:absolute; right:0; bottom:0; background-color:#666666; line-height:1.5em; font-size:0.8rem; border-radius:8px; color:#fff; padding:0 5px; font-style:normal; margin:0 5px 5px 0;}
.video-mod-list a div { display:block; font-weight:normal; height:65px; padding-top:5px; overflow:hidden; font-size: 0.8rem;}
.video-mod-list a img { width:100%; display:block;}
.video-mod-list a:hover { background-color:#f2f2f2; }
.video-mod-list a:hover strong { color:#000; }
.video-mod-placeholder { height:20px; overflow:hidden;}
.span1 {padding:2px 0}

/**/
.footer { width:100%; padding:15px 0 50px; overflow:hidden;}
.foot-left { width:60%; float:left;}
.foot-right { width:38%; float:right; border-left:1px solid #eee; max-width:150px;}
.foot-right img { width:60%; display:block; margin:auto;}

.foot-left h3 { font-size:16px; margin:0; line-height:2em; padding-left:15px; color:#333;}
.foot-left p { font-size:13px; margin:0; line-height:1.6em; padding-left:15px; padding-right:10px; color:#555;}
.foot-left img { width:100px; }

/**/
.logo-bar { padding:10px 14px 10px 18px; overflow:hidden;}
.logo-bar img { display:block; width:100%; }
.logo-bar-left { float:left; width:31%; max-width:120px;}
.logo-bar-right { float:right; width:22%; padding-top:3px; max-width:85px;}

/**/
.video-content {width:100%;background-color: white;}
.video-content-tab { width:100%; overflow:hidden;}
.video-content-tab em { float:left; display:block; width:33.3%; border-bottom: 1px solid #eee; text-align:center; font-size:16px;padding:15px 0px;  font-style:normal; color:#cccccc;}
.video-content-tab em.current { color:#000000; border-bottom: 3px solid #f4da7b;}

.video-content-tab1 { width:100%; overflow:hidden;}
.video-content-tab1 em { float:left; display:block; width:50%; border-bottom: 1px solid #eee; text-align:center; font-size:16px;padding:15px 0px;  font-style:normal; color:#cccccc;}
.video-content-tab1 em.current { color:#000000; border-bottom: 3px solid #f4da7b;}

/**/
.video-intro {overflow: auto;width: 100%}
.video-intro-con { width:94%; margin:auto; padding:15px 0; color:#333;}
.video-intro-title { font-size:16px; line-height:1.8em;}
.video-intro-text { font-family:simsun; font-size:13px; line-height:1.6em; padding-top:10px;}
.video-intro-inner-more a { color:#042880; padding-left:10px;}
.video-intro-inner-more a:hover { color:#f00; }
#js-video-intro-complete { display:none; }
.video-intro-title span { display:block; width:50px; height:30px; float:right; background:url("../../img/video-intro-head-more.png") no-repeat center center; background-size:auto 36%; overflow:hidden; text-indent:-999em;}
.video-intro-head-more-close { -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); transform: rotate(-180deg); }

.video-chat {font-family:"宋体";}
.video-chat-con { width:94%; margin:auto; padding:15px 0; color:#333;  border-bottom:1px solid #eee; }
.video-chat-no {width:94%; margin: 0 auto;padding:20px; font-size: 13px; color: #000000;text-align: center;}
.video-chat-title { font-size:15px; line-height:1.5em;}
.video-chat-title img { width:32px; height:32px;}
.video-chat-text {font-size:13px; padding-top:2px;}
.video-chat-text p {text-indent:2em; line-height:1.2em; font-size:13px;}
.video-chat-text span{ font-size:10px}


/**/
.video-more { display:block; border-top:1px solid #eee; height:20px; margin-top:10px; position:relative;}
.video-more img { height:29px; position:absolute; top:-15px; right:0; box-shadow:3px 3px 5px rgba(0,0,0,.1);}


/**/
.items { overflow:auto; }
.items-item{ width:90%; margin:auto; overflow:hidden; padding:20px 0; border-bottom:1px solid #eee; position:relative;}
.items-item-photo { font-size:0; width:30%; float:left; display:inline-block; position: relative;}
.items-item-photo em{ position:absolute; right:0; top:0; background-color:#ee9572; line-height:1.5em; font-size:0.5rem;  color:#ffffff; padding:0 5px; font-style:normal; margin:0 5px 5px 0;}
.items-item-photo img { width:100%;box-shadow:2px 2px 1px rgba(0,0,0,.2);}
.items-item-photo strong { position:absolute; left:0; top:0; text-align:center;background-color:#76c2f5; border-radius: 8px; line-height:1.5em; font-size:0.5rem;  color:#ffffff; padding:0 5px; font-style:normal; margin-left: 5px;}
.items-item-text { width:70%; float:left;}
.items-item-text h2 { margin:0; padding-left:20px; font-size:1rem; font-weight:normal; color:#000000; line-height:1.2em;}
.items-item-text span{ margin:0; padding-left: 20px; font-size:0.8rem; color:#666666;}
.items-item-text p { margin:0; padding-left:20px; padding-top:2px;padding-bottom:2px;font-size:0.8rem; color:#555555; line-height:1.5em;text-indent: 2em;}

/**/
.fadeIn,
.fadeInRight { -webkit-animation-duration:.5s; animation-duration:.5s; }

/* phone heng and pad */
@media screen and (min-width:667px) {
  .video-list-item { width:31.5%; margin:1% 0% 0 1.3%;}
}
/* iphone 5 */
@media screen and (max-width:370px) {
  .foot-left { width:65%; }
  .foot-right { width:33%; }
  .foot-right img { width:80%; }
  .foot-left h3 { font-size:14px;}
  .foot-left p { font-size:12px;}
  .video-content-tab em,
  .books-item-text h2 { font-size:18px; }
  .video-intro-title { font-size:16px;}
  .video-intro-text,
  .books-item-text p { font-size:14px;}
}

/* 横屏�?*/
@media screen and (orientation:landscape) {
  .header { position:relative; }
}