/* ============================================================
首頁-標題
============================================================ */
.index_article .common_tit{ padding-bottom: 60px;}



/* ============================================================
區塊1-輪播
============================================================ */
#index_bn{ position: relative;}
#index_bn .item img {
  display: block;
  width: 100%;
}

#index_bn .owl-theme .owl-nav [class*=owl-]{
  color: #FFF;
  margin:0;
  padding: 0;
  display: inline-block;
  cursor: pointer;
  border-radius: 0;
}
.hide-owl-next .owl-next, .hide-owl-prev .owl-prev, .hide-owl-next.hide-owl-prev .owl-controls {
  display: none;
}
#index_bn.owl-theme .owl-next,
#index_bn.owl-theme .owl-prev {
  position: absolute;
  margin:0;
  padding: 0;
  background: rgba(255, 255, 255, 0.42);
  width: 5%;
  height: 100%;
  top: 0;
  border-radius: 0;
}
#index_bn.owl-theme .owl-prev {
  left: 0;
}
#index_bn.owl-theme .owl-next {
  right: 0;
}
/*#index_bn.owl-theme .owl-prev:before,
#index_bn.owl-theme .owl-next:before {
  content: '';
  position: absolute;
  width:40px;
  height:40px;
  background: url(../img/svg/arrow-pre.svg)no-repeat;
  display: block;
  margin: -20px 0 0 0;
  top: 50%;
  left: 20%;
}
#index_bn.owl-theme .owl-next:before {
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(18deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  right:20%;
  left: inherit;
}*/

  @media screen and (min-width: 1500px){
    #index_bn.owl-theme .owl-next,
    #index_bn.owl-theme .owl-prev {
      width: 18%;
    }
  }



/* ============================================================
區塊2-編輯文章
============================================================ */
.index_sub{ padding: 30px 0 0; }
.index_sub .subBn{width: 585px;float: left;margin-right: 15px;}

.index_sub .subBox{position: relative;width: 285px;float: left;margin: 0 15px 30px 0;vertical-align: top;}
.index_sub .subBox .pic{position: relative;margin: 0 auto;width: 285px;height: 170px;overflow: hidden;background: #fff url(../img/loader_logo.gif) no-repeat 50% 50%; display: -webkit-flex; display:         flex;-webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;}
.index_sub .subBox .pic img{vertical-align: middle;width: auto; height: 170px; text-align: center;}

.index_sub .subBox .tit{width: 100%;display: block;}
.index_sub .subBox .tit p{ height: 3em; overflow: hidden; word-wrap: break-word; word-break: normal; text-align: left;  display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 2;}



/* ============================================================
區塊3-部落客好文
============================================================ */
.index_article{ padding:0 30px 30px; }

.index_article .artBox_l{width: 900px;float: left;}
.index_article .artBox_l div.artBox{margin: 0 15px 45px 0;}
.index_article .artBox_l div.artBox:nth-child(4),
.index_article .artBox_l div.artBox:nth-child(5),
.index_article .artBox_l div.artBox:nth-child(6){ margin-bottom: 0;}
.index_article .artBox_l .artBox{width: 285px;vertical-align: top;float: left;}
.index_article .artBox_l .artBox .author{position: relative;z-index: 1;padding: 10px 10px 10px 100px;}
.index_article .artBox_l .artBox .author .userimg{position: absolute; left: 0; width: 90px; height: 90px; border-radius: 100%; overflow: hidden; top:-40px;}
.index_article .artBox_l .artBox .author .userimg img{ width: 100%; height: 100%;}
.index_article .artBox_l .artBox .author p{color: #fff;padding: 0;margin: 0;font-size: 12px;text-align: left;overflow: hidden;white-space:nowrap;/* height: 1.65em; *//* line-height: 2; *//* overflow: hidden; */}

.index_article .artBox_l .artBox .pic{position: relative;margin: 0 auto;width: 285px;height: 170px;overflow: hidden;background: #fff url(../img/loader_logo.gif) no-repeat 50% 50%;}
.index_article .artBox_l .artBox .pic img{position: absolute;vertical-align: middle;width: 285px;height: auto; top: -60px; left: 0; }

.index_article .artBox_l .artBox .tit{width: 100%;display: block;}
.index_article .artBox_l .artBox .tit p{ height: 3em; overflow: hidden; word-wrap: break-word; word-break: normal; text-align: left;  display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 2;}

.index_article .artBn_r{display: flex;}
.index_article .artBn_r .google_ad{ margin: 0 auto}



/* ============================================================
區塊4-關注Walker
============================================================ */
.index_social{ padding: 30px 0 0; }



/* ============================================================
區塊5-排名
============================================================ */
.index_rank{ padding: 30px 0 0; }

.index_rank dl{width: 360px;display: inline-block;margin:0 60px 20px 0;vertical-align: top;}
.index_rank dl:last-child{margin-right: 0}
.index_rank dl .btn{ margin: 0 auto; padding-bottom: 20px; display: inline-block; text-align: center;font-size: 12px;}
.index_rank dl .btn a{ padding: 0 10px; line-height: 2.2; display: block;}
.index_rank dl .btn a:hover{ padding: 0 10px; line-height: 2.2; display: block;}

.index_rank dl dd{margin: 0 auto;text-align: left;padding: 10px 0;}
.index_rank dl dd p{height: 18px;margin: 0;overflow:hidden;}
.index_rank dl dd span{ display: inline-block; padding-right: 15px; font-weight: 600;}

.index_rank .label{position: relative;margin: 0;padding: 0;width: 320px;height: 36px;top: -10px;left: 0;border: 0;z-index: 1;}
.index_rank .label dfn{position: absolute;width: 20px;height: 36px;top: 0;right: -20px;background: url(../img/com_icon.png?ver=1009) no-repeat;}
.index_rank .label .label_blue{background-position:0 -94px;}
.index_rank .label .label_dark{background-position:0 -130px;}

.index_rank .label p, .index_rank .label p{padding: 9px 0 0 8px;}

.index_rank .rankBox{float: left;}
.index_rank .rankBox .pic{position: relative;background-size: 100%;transition:all 0.3s ease-in-out;margin: 0 auto;width: 360px;height: 215px;overflow: hidden;background: #fff url(../img/loader_logo.gif) no-repeat 50% 50%;}
.index_rank .rankBox .pic img{position: absolute;vertical-align: middle;width: 360px;height: auto; top: -60px; left: 0; }
.index_rank .rankBox a .pic{ background-size:auto 100%;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.index_rank .rankBox a:hover .pic{ background-size:auto 110%;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}



/* ============================================================
區塊6-本月主打星
============================================================ */
.index_walker{ padding: 30px 0; }

.index_walker .walker_list{ width: 1200px; display: inline-block;}
.index_walker .walker_list ul{ position: relative; overflow: hidden;margin: 0; padding: 0; list-style: none; }
.index_walker .walker_list ul .prev a, .index_walker .walker_list ul .next a{ position: absolute; display: block; width: 42px; height: 38px; top: 50%;margin-top: -25px; background: url(../img/com_icon.png?ver=1009) no-repeat; z-index: 999;}
.index_walker .walker_list ul .prev a{ background-position: -18px -18px; left: 10px;}
.index_walker .walker_list ul .next a{ background-position: -18px -56px; right: 10px;}
.swiper-container-poipay, .index_walker .walker_list .swiper-container-poipay {height: 340px;}

/* index_walker .grid */
.index_walker .walker_list .walkerBox dl{width: 280px;margin: 0;vertical-align: top;display: inline-block;}
.index_walker .walker_list .walkerBox dl:last-child{/* margin-right: 0; */}
.index_walker .walker_list .walkerBox dl dt p{margin: 0;}
.index_walker .walker_list .walkerBox dl dd{ margin: 0 auto; display: inline-block;text-align: center; font-size: 12px;}

.index_walker .walker_list .walkerBox{width: 280px;height: 330px;margin: 0 auto;}
.index_walker .walker_list .walkerBox .pic{position: relative;margin: 0 auto;width: 280px;height: 167px;overflow: hidden;background: #fff url(../img/loader_logo.gif) no-repeat 50% 50%;}
.index_walker .walker_list .walkerBox .pic img{position: absolute;vertical-align: middle;width: 280px;height: auto; top: -50px;left: 0; }

.index_walker .walker_list .walkerBox .tit{position: relative;width: 100%;padding: 15px 0;display: block;}
.index_walker .walker_list .walkerBox .tit p{ height: 3em; overflow: hidden; word-wrap: break-word;word-break: normal;text-align: left; display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.index_walker .walker_list .walkerBox .tit span.poi{display: block;}

.index_walker .walker_list .walkerBox .author{text-align: left;margin-top: 10px;padding: 0;}
.index_walker .walker_list .walkerBox .author img{position: relative;float: left;width: 72px;height: 72px;display: inline-flex;vertical-align: middle;border-radius: 100%;}
.index_walker .walker_list .walkerBox .author p{position: relative;width: 95%;font-size: 12px;line-height: 1.4;text-align: left;left: 10px;top: 25px;}



/* ============================================================
區塊7-Walker video
============================================================ */
.index_video{padding: 30px 0; }

.index_video .videoBox_l{position: relative; float: left; z-index: 1; margin-bottom: 20px;}
.index_video .videoBox_l .video_b .pic{position: relative;width:590px;height: 330px;display: flex;align-items: center;justify-content: center;}
.index_video .videoBox_l .video_b i{ position: absolute;width: 50px;height: 50px; margin: -25px 0 0 -25px; display: block;top: 50%; left: 50%;z-index: 1;}
.index_video .videoBox_l .video_b i img{ width: 100%; height: 100%;}
.index_video .videoBox_l .video_b .detail h6{margin: 0;text-align: left;padding:10px;font-weight: 600;height: 2.8em;}

.index_video .videoBox_r{position: absolute;padding-left: 600px;width: 600px;}
.index_video .videoBox_r .video_s{width: 600px;margin: 0 0 10px;display: flex;}
.index_video .videoBox_r .video_s .pic{position: relative;width:342px;height: 192px;display: block;}
.index_video .videoBox_r .video_s i{ position: absolute;width: 50px;height: 50px; margin: -25px 0 0 -25px; display: block;top: 50%; left: 50%;z-index: 1;}
.index_video .videoBox_r .video_s i img{ width: 100%; height: 100%;}
.index_video .videoBox_r .video_s .detail{width: 230px;padding: 20px;}
.index_video .videoBox_r .video_s .detail h6{margin: 0;text-align: left;padding: 0;font-weight: 600;}
.index_video .videoBox_r .video_s .detail p{text-align: left;}


