
.olearn{background-color: #fff;}

#olearn-carouse{height: 500px; text-align: center;}
#olearn-carouse>*[carousel-item] > *, #olearn-carouse .layui-carousel{background: none;width: 100%; height:100%;}
#olearn-carouse .carousel-img{ width: 100%; height:100%;}

.olearn .layui-fixbar li {
    width: 50px;
    height: 50px;
    line-height: 50px;
    margin-bottom: 1px;
    text-align: center;
    cursor: pointer;
    font-size: 30px;
    background: #6294b5;
    color: rgb(255, 255, 255);
    opacity: 0.95;
    border-radius: 2px;}
.olearn .layui-laypage .layui-laypage-curr .layui-laypage-em{background: #6394b5;}
.olearn .layui-laypage-prev:hover ,.olearn .layui-laypage-next:hover{color: #6394b5;}
.olearn .w1000{min-width: 320px; max-width: 1280px; margin:0 auto 0 auto;}
.olearn .layui-carousel>[carousel-item]>* {height: auto;}
html, body{height: 100%;}

/*header*/
.olearn-header-wrap{background: #fff;width: 100%; top: 0;}
.olearn-header{line-height: 90px; height: 90px; position: relative; font-size: 16px;}
.olearn-header .logo,.olearn-header .nav,.olearn-header .search-bar,.olearn-header .search-bar button,.olearn-header .search-bar input{float: left;}
.olearn-header .search-bar input{background: #f6f6f8;}
.olearn-header .logo{ margin: 0px 0px 0px 0px; padding: 6px 0px 0px 0px; width: 440px; text-align: left;}
.olearn-header .nav{padding: 0px 10px;}
.olearn-header .nav a{display: inline-block; height: 90px; line-height: 96px; font-size: 16px; color: #222; padding:0 22px; float: left;}
.olearn-header .nav a.active{background: #701f62; color: #fff;}
.olearn-header .nav a.active:hover{color:#fff;}
.olearn-header .nav a:hover{color: #6294b5;}
.olearn-header .search-bar{width: 251px; height: 38px; margin: 17px 0 0 20px; font-size: 14px;}
.olearn-header .search-bar .layui-form-item{margin-bottom: 0;}
.olearn-header .search-bar .layui-input-block{margin-left: 0; height: 38px;}
.olearn-header .search-bar input{width: 200px; border:1px solid #e9eaec; border-right: none;  border-radius: 2px 0px 0px 2px;}
.olearn-header .search-bar button{width: 50px; background: #6294b5; padding:0; border-radius: 0 2px 2px 0px;}
.olearn-header .login img{height: 100%;}
.olearn-header .login{ position: absolute; right: 0; top: 0px; } 
.olearn-header .login a{color: #6294b5; display: inline-block;  padding:0 10px;}
.olearn-header .menu-icon{display: none;}
.olearn-header .mobile-nav{display: none;}
/*end-header*/

/*menu*/
.olearn .olearn-menu{background-color: #fff;line-height: 60px; height: 60px; font-size: 16px;margin: 10px auto 0 auto;}
.olearn-menu .nav a{display: inline-block; height: 60px; font-size: 16px; color: #4c4b4b; padding:0 18px; float: left;}
.olearn-menu .nav a.active,.olearn-menu .nav a:hover{background-color: #a52f7c; color: #fff;}
.olearn-menu .layui-nav{background-color: #fff;padding: 0;}
.olearn-menu .layui-nav .layui-nav-more,.olearn-menu .layui-nav .layui-nav-bar{display: none;}
.olearn-menu .layui-nav .layui-nav-item{line-height: 60px;}
.olearn-menu .layui-nav .layui-this:after{background-color: transparent;}
.olearn-menu .layui-nav .layui-nav-child{background-color: #eee; border: 0px;top: 60px;}
.olearn-menu .layui-nav dd a{display: inline-block; height: 40px; font-size: 14px; color: #000;  padding:0 22px; float: left;}
.olearn-menu .layui-nav dd a:hover{ color: #000;}
/*end-menu*/

/* login-user info */
.omi-dropdown { position: relative; display: inline-block; }
.omi-dropdown-content {
	display: none;
	position: absolute;
	margin-top: -12px;
	margin-left: -84px;
	background-color: #fafafa;
	min-width: 100px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	padding: 8px 10px;
	font-size: 14px;
	line-height: 32px;
	z-index: 1;
}
.omi-dropdown:hover .omi-dropdown-content { display: block; }
.omi-dropdown-content .sinfo { padding: 0px 0px; line-height: 20px; text-align: center; font-size: 14px; font-weight: bold; }
.omi-dropdown-content .omi-dropdown-item { text-align: center; }
.omi-dropdown-content .omi-dropdown-item:hover{ background-color: #f0f0f0; }


/*baner*/
.olearn .olearn-banner{min-width: 640px;margin: 0 auto 0 auto;}
.olearn-banner  .title{position: absolute; left: 30px;  top: 240px;  color: #fff; font-size: 20px; font-weight: 100;}
/*end-baner*/

.olearn-mobile-only { display: none; }
.olearn-mobile-hide { }
.olearn-mobile-no-left-padding { padding-left: 20px; }


/*content*/
.olearn .olearn-container{padding: 0px 0 30px 0;margin-top: 20px}
.olearn-container .layui-flow-more{margin: 50px 0;}
.olearn-container .layui-fluid{padding:0;}
.olearn-container .main{}
.olearn-container .item{overflow:hidden; padding:10px 0; border-bottom: 1px solid #eaeaea;}
.olearn-container .item img{float: left; margin-right: 16px; width:128px; height: 80px; border-radius: 6px; }
.olearn-container .item h4{font-size: 16px; color: #222222; font-weight: bold;}
.olearn-container .b-txt{ text-align: right; }
.olearn-container .b-txt .label{display:inline-block; padding: 0 4px; height:18px; line-height: 18px; background: #6294b5; font-size: 12px; cursor: pointer; color: #fff; border-radius: 2px; margin-left: 10px; margin-right: 10px;}
.olearn-container .b-txt .message{margin-right: 10px;}
.olearn-container .b-txt .icon{color:#d2d6da; position: relative; top: 2px; cursor: pointer;}
.olearn-container .o-breadcrumb{padding: 10px 0 10px 6px; margin: 0 0 20px 0; font-weight: bold; border-bottom: solid 1px #6395b8;} /* margin: 上 右 下 左 */

.olearn-container .popular-info{border: 0px solid #6294b5;}
.olearn-container .popular-info .list{padding:16px 0;}
.olearn-container .popular-info .list-item{position: relative;}
.olearn-container .popular-info .list-item i.layui-badge-dot{margin:0 8px;}
.olearn-container .layui-card{background: none; box-shadow:none;}
.olearn-container .layui-card-body{padding:0;}
.olearn-container .popular-info .list:last-child{border-bottom: 0;}
.olearn-container .popular-info .list{border-bottom: 1px solid #eaeaea;}
.olearn-container .popular-info .list a{padding-right: 5px;}
.olearn-container .popular-info-tog  i{display: block ;width: 4px; height: 4px; border-radius: 50%; color: #ceced0; position: absolute; top: 0; background: #cdcdcf; top: 26px; left: 8px;}
.olearn-container .popular-info-tog .list{list-style-type: disc;}
.olearn-container .popular-info-tog .list a{padding:0;}
.olearn-container .popular-info-tog  a{ margin-right:0;  padding-right: 0; }
.olearn-container .popular-info .heat-icon{display:inline-block; width: 12px;  height: 16px; background: url(../images/heat.png) no-repeat center center; position: relative; top: 3px;}
/*end-content*/

/*footer*/
.olearn-footer-wrap{color: #fff; background: #2a2a2a; }
.olearn-footer{padding:20px 0 20px 0; position: relative;}
.olearn-footer .ft-nav{margin-bottom: 24px;}
.olearn-footer .ft-nav a{margin-right: 10px; color: #fff;}  
.olearn-footer .f-icon{position: absolute; right: 0; top: 20px;}
.olearn-footer .w-icon{margin: 0 6px 0 6px;}
.olearn-footer-wrap .Copyright{
    color: #fff;
}
.olearn-footer-wrap a{
    color: #fff;
}
/*end-footer*/


/*olearn-details-container*/
.olearn-details-container{padding: 10px 0;}
.olearn-details-container .main{margin-bottom: 20px;}

.olearn-details-container .b-txt{padding:10px 0; line-height: 35px;}
.olearn-details-container .b-txt .icon{margin-right: 26px;}
.olearn-details-container .b-txt .icon b{color: #ec414d;}
.olearn-details-container .title{border-bottom: 1px solid #eaeaea;}
.olearn-details-container .title h3{font-size: 24px;}
.olearn-details-container .article{color: #555; padding: 10px 0 32px 0;}
.olearn-details-container .article p{line-height: 30px;}
.olearn-details-container .article p.mt30{margin-bottom: 30px;}
.olearn-details-container .article .img-box{text-align: center; padding:12px; cursor: pointer;}
.olearn-details-container .article .share-title{height: 30px; line-height: 30px;}
.olearn-details-container .article .share-title .txt{position: relative; top: -4px; margin-right: 5px;}
.olearn-details-container .article .share-title .icon{font-size: 26px;  margin-right: 6px;}
.olearn-details-container .article .share-title .icon.layui-icon-login-wechat{color: #3ab032;}
.olearn-details-container .article .share-title .layui-icon-login-weibo{color: #f16420;}
.olearn-details-container .article .share-title .layui-icon-login-qq{color: #04aed9;}
.olearn-details-container .article .layui-btn{width: 96px; padding:0; height: 28px; line-height: 26px; background: #ec414d; border:1px solid #ec414d; margin-left: 37px; position: relative; top: -5px;}
.olearn-details-container .article .layui-btn.active{background: #fff; color: #ec414d;}
.olearn-details-container .article .layui-btn span{margin-left: 10px;}
.olearn-details-container .leave-message .tit-box{line-height: 40px;}
.olearn-details-container .leave-message .tit{font-size: 16px; margin-right: 28px;}
.olearn-details-container .leave-message .tit-box .num{color: #b5b9bd;}
.olearn-details-container .leave-message .tit-box b{color: #ec414d;}
.olearn-details-container .leave-message .tear-box img{float: left;}
.olearn-details-container .leave-message .tear-box form{padding-left: 50px; margin:10px 0;}
.olearn-details-container .content-box .layui-form .layui-form-item{clear:none; margin-bottom: 0;}
.olearn-details-container .content-box .layui-form  .layui-btn{width: 90px; height: 30px; line-height: 30px; background: #6294b5; position: relative; z-index: 10; border-radius: 0}
.olearn-details-container .content-box .layui-form .layui-textarea{border-radius: 0}
.olearn-details-container .content-box .layui-form .message-text{position: absolute; height: 100%; width: 100%; padding:0 90px 0 0px; text-align: left; box-sizing: border-box; line-height: 30px;}
.olearn-details-container .content-box .layui-form .message-text .txt{padding-left: 10px; border:1px solid #e6e6e6; height:100%; box-sizing: border-box; border-top:0; border-right: 0; color: #ec414d;}
.olearn-details-container .content-box .layui-form .layui-input-block{margin-left: 0; min-height: 30px;}
.olearn-details-container .content-box .ulCommentList{margin-bottom: 30px;}
.olearn-details-container .content-box .ulCommentList .item-cont{padding-left: 50px;}
.olearn-details-container .content-box .ulCommentList .cont{padding:10px 20px; background: #f5f6f7; word-wrap:break-word;}
.olearn-details-container .liCont{padding:30px 0 0 0; border-bottom: 0;}
.olearn-details-container .liCont img{float: left; width: 28px; height: 28px;}
.olearn-details-container .cont .name{margin-right: 15px;}
.olearn-details-container .cont .time{color: #6d6d6d; font-size: 12px;} 
.olearn-details-container .cont p{line-height: 26px;}
.olearn-details-container .cont .text{color: #555;}
/*end-olearn-details-container*/

/*olearn-list-container*/
.olearn-list-container{padding-top: 16px;}
.olearn-list-container h3{font-size: 16px; line-height: 50px; padding-left: 12px; font-weight: bold;}
/*end-olearn-list-container*/

/*olearn-search-container*/
.olearn-search-container p.num{color: #888888;}
.olearn-search-container p.num span{color: #ec414d;}
.olearn-search-container .item{border-bottom: 0; padding:30px 0;}
.olearn-search-container .time{font-size: 14px; color: #868686; padding-left: 20px;}
.olearn-search-container .item p{line-height: 30px; font-size: 16px;}
/*end-olearn-search-container*/

/*olearn-login-container*/
.olearn-login-container .layui-form-item{margin:10px 0 0 0 ;}  /* margin: 上 右 下 左 */
.olearn-login-container .layui-input-block{margin-left: 2px; position: relative;}
.olearn-login-container .layui-input-block span.txt{position: relative; top: 1px;}
.olearn-login-container .layui-input-block img{height: 36px; position: absolute; right: 1px; top: 1px; cursor: pointer;}
.olearn-login-container button{width: 100%; background: #6294b5;}
/*end-olearn-login-container*/

/*olearn-persInfo-content*/
.olearn-persInfo-wrap{background: #f5f6f8;}
.olearn-persInfo-content{padding:30px 0 30px 0;}
.olearn-persInfo-content .main{margin:0 0 0 30px; padding-right: 0; background: #fff; box-shadow: 1px 1px 10px 1px #ccc; box-sizing: border-box;}
.olearn-persInfo-content .ulCommentList{padding:0 30px;}
.olearn-persInfo-content .item{border-bottom: 0; padding:0;}
.olearn-persInfo-content .item h4 {margin-bottom: 0}
.olearn-persInfo-content .liCont{padding:30px 0; border-bottom: 1px solid #eaeaea;}
.olearn-persInfo-content .liCont:last-child{border-bottom: 0;}
.leave-message{min-height: 100px;}
.olearn-persInfo-content .content-box{padding-bottom: 30px; display: none;}
.olearn-persInfo-content .popular-info{background: #fff; border:0; padding: 60px 0 150px 0; text-align: center; box-shadow: 1px 1px 10px 1px #ccc; box-sizing: border-box;}
.olearn-persInfo-content .layui-card-header{height: auto;  border:0;}
.olearn-persInfo-content .tab {margin-top: 30px; padding:0 60px;}
.olearn-persInfo-content .tab li{ line-height: 40px; font-size: 16px; color: #666666;  margin-bottom: 16px; cursor: pointer;}
.olearn-persInfo-content .tab li.layui-this{border-bottom: 1px solid #6295b4; color: #6295b4;}
.olearn-personal-info {} 
/*end-olearn-persInfo-content*/


.olearn-recommend {
    padding-left: 20px;
}

/*中屏幕*/
@media screen and (max-width: 960px){
  .olearn-header{height: 60px; line-height: 60px;}
  .olearn-header .search-bar,.olearn-header .nav{display: none;}
  .olearn-header .logo{position: absolute; margin-left: 2px; width: 200px; }  /* 设置LOGO居中 left: 50%; margin-left: -100px; */
  .olearn-header .login{display: none;}
  .olearn-banner .title{display: block; left: 30px; top: 120px; }
  .olearn-recommend { display: none; }
  .olearn-mobile-only { display: block; }
  .olearn-mobile-hide { display: none; }
  .olearn-mobile-no-left-padding { padding-left: 0px; }
  .olearn-personal-info { padding: 20px 18px; } 
  .olearn-container .layui-fluid{padding:0 15px;}
  .olearn-container .item img{ width: 96px; height: 60px; }
  .olearn-footer{text-align: center;}

  .olearn-footer .f-icon{position: static; margin-top: 20px;}
  .olearn-header .menu-icon{position: absolute; right: 0; top: 0px; display: block; height: 100%; width:40px; cursor: pointer; text-align: center;}
  .olearn-header .menu-icon i{font-size: 26px; color: #6294b5;}
  .olearn-header .mobile-nav{display: none; position: absolute; top: 60px; left: 0; width: 100%; z-index: 100; border-bottom: solid 1px #6395b8; }
  .olearn-header .mobile-nav li{display: block;}
  .olearn-header .mobile-nav .layui-nav{background: #fff; padding:0;}
  .olearn-header .mobile-nav .layui-nav a{color: #6294b5;} 
  .olearn-header .mobile-nav .layui-nav .layui-this:after,.olearn-header .mobile-nav .layui-nav-bar{background: #6294b5; height: 3px;}
}


/*小屏幕*/
@media screen and (max-width: 768px){
  .olearn-container .main{padding-right: 0;}
  .olearn-details-container .article .img-box img{width: 100%;}
  .olearn-container .item h4{font-size: 16px; line-height: 24px;}
  .olearn-footer .ft-nav a{display: block; margin:15px 0;}
  .olearn-login-container .form-box{padding: 0 10px; overflow-x: hidden;}  /* width: auto;  */
  .olearn-login-container .form-box form{width: 100%;}
  .olearn-login-container .form-box h3{line-height: 70px; font-size: 24px;}
  .olearn-persInfo-content .popular-info{padding:60px 0; margin-bottom: 20px;}
  .olearn-container .main{margin-left: 0;}
  #olearn-carouse{height: 300px;}
  .olearn-menu{display: none;}
}