/* 新闻 */ /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; font-family: "Microsoft Yahei"; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul,li { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } img{border:0} table { border-collapse: collapse; border-spacing: 0; } a{text-decoration: none;display:block;} ::-webkit-scrollbar {width: 5px;background: #fff;} ::-webkit-scrollbar-button {display: none;} ::-webkit-scrollbar-thumb {background: #ff91a1;} body {background: #eee;} .imgAD{ border:0; } a:focus{outline:none;} #container {width: 900px;height: 595px;margin: 0 auto;background: #fff;overflow: hidden;padding-top: 5px;} #container .wrapper {box-sizing: border-box;height: 600px;position: relative;padding: 5px 0;width: 100%;margin: 0 auto;position: relative} #container .left_nav {width: 78px;height: 560px;padding-top: 10px;position: absolute;right: 20px;z-index:999;top:0;} #container .left_nav li {width: 78px;height: 32px;margin-bottom: 18px;color: #333;font-size: 15px;line-height: 32px;text-align: center;display: block;cursor: pointer;position: relative;} #container .left_nav a {text-decoration: none;color: #000;display: block} #container .left_nav li.active,#container .left_nav li:hover {background: #ed4040;color: #fff;border-radius: 2px;} #container .left_nav li.active a,#container .left_nav li:hover a {color: #fff;} #container .left_nav li img {width: 10px;height: 7px;position: absolute;right: 4px;top: 12px;} #container .left_nav .more_nav { width: 176px; height:85px; padding: 5px; border: 1px solid #e8e8e8; background: #fff; z-index: 2; position: absolute; bottom: 0; right: 77px; display: none; } #container .left_nav .more_nav li {float: left;} #container .left_nav .more_nav li a {color: #333;} #container .left_nav .more_nav .active a,#container .left_nav .more_nav li:hover a {color: #fff;} /* #container .left_nav .nav_item:last-child:hover .more_nav {display: block;} */ /* 中间部分 CSS start*/ .content {overflow: auto;} .content .scroll_con {width: 500px; margin-left:15px;} /* 单图模式 */ .content {width: 100%;height: 589px;padding-left:250px;box-sizing: border-box;} .content .news_item {width: 100%;box-sizing: border-box;border-bottom: 1px solid #eeeeee;position: relative;} .content .news_item h3 {color: #333;font-size: 15px;line-height: 22px;padding-left: 10px;max-height: 44px;overflow: hidden;font-weight: bold;} .content .news_item div img,#container .right_pannel .right360ad img,.today_news li img,.right_top_zhike img{width: 100%;height: 100%;transition: all ease 1s;} .content .news_item p {color: #aaa;font-size: 12px;line-height: 16px;padding-left: 10px;float: left;margin-top: 14px;} .content .news_item p span {margin: 0 5px 0 0;float: left;} .content .news_item p em {float: left;margin-right:4px;} .content .news_item p .author_word {width: 16px;height: 16px;background: #ed4040;border-radius: 50%;display: inline-block;line-height: 14px;text-align: center;color: #fff;font-size: 12px;} .content .news_item p img {width: 16px;height: 16px;border-radius: 50%;margin: 0 5px;float: left;} .content .news_item:hover,#container .content .mid_news_item:hover {background: #f9f9f9;} .content .news_item:hover h3,#container .content .mid_news_item:hover h3 {color: #406599;} /* 多图模式 */ .content .news_item .mid_news_item {width: 100%;height: 135px;box-sizing: border-box;display:block;position: relative;padding:5px 0 3px;} .content .news_item .img_con {position: absolute;left: 0;top: 34px;overflow: hidden;} .content .news_item .img_con a {display: block;width: 120px;height: 66px;float: left;margin-right: 5px;box-sizing: border-box;overflow: hidden;} .content .mid_news_item .img_con a:last-child {margin-right: 0;} .content .img_con img {width: 100%;height: 100%;transition: all ease 1s;} .content .img_con span {display: block;width: 100%;height: 100%;line-height: 66px;text-align: center;background: #eeeeee;color: #333;font-size: 12px;} .content .mid_news_item p {position: absolute;left: -5px;bottom: 3px;color: #aaa;font-size: 12px;line-height: 24px;height: 24px;} .content .mid_news_item p span {margin: 0 5px;float: left;} .content .mid_news_item p em {float: left;margin-right: 5px;} .content .mid_news_item p .author_word {width: 16px;height: 16px;background: #ed4040;border-radius: 50%;display: inline-block;line-height: 16px;text-align: center;color: #fff;font-size: 12px;} .content .mid_news_item p img {width: 16px;height: 16px;border-radius: 50%;margin: 0 5px;float: left;} .content .news_item div:hover>img,.content .ad_item div:hover>img,.today_news li div:hover img,#container .right_pannel .right360ad a:hover img,#container .content .img_con a:hover>img, #container .content #zhikeAd img:hover,.right_top_zhike img:hover{transform: scale(1.1);} .content .news_item .single_item{height:74px;padding:10px 0;} .content .news_item .single_item div{width:120px;height:66px;float:left;overflow: hidden;} /* 360大图 */ .content .news_item .ad_big_item{width: 500px;height:197px;padding:10px 0;} .content .news_item .ad_big_item div{width:500px;height:170px;overflow: hidden;margin-top:4px;} .content .news_item video{width:500px;height:170px;} /* 360小图 */ /* .content .news_item .ad_big_item{width: 500px;height: 218px;} */ /* 右侧 */ #container .right_pannel {width: 240px;height: 475px;padding-top: 20px;box-sizing: border-box;position: absolute;left: 10px;top: 0;} #container .right_pannel .showcase { width: 240px; height: 128px; position: relative; margin-bottom: 6px; } /*#container .right_pannel .showcase iframe {margin-left: -8px!important;margin-top: -5px!important;}*/ #container .right_pannel .today_news {height: 295px;box-sizing: border-box;border-top: 2px solid #ed4040;background: #f5f6f7;font-size: 12px;color: #333;padding: 3px 0px;} #container .right_pannel .today_news h2 {font-size: 14px;font-weight: bold;line-height: 20px;} #container .right_pannel .today_news ul{height: 258px;overflow: hidden;} #container .right_pannel .today_news li {width: 100%;height:60px;border-bottom: 1px solid #e5e5e5;} #container .right_pannel .today_news .right_pannel_xxl_ad {width: 100%;height: 64px;box-sizing: border-box;padding: 10px 0;border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;} #container .right_pannel .today_news li a {display: block;height: 42px;text-decoration: none;padding:10px 0;} #container .right_pannel .today_news li div {width: 60px;height: 42px;float: left;overflow: hidden;} #container .right_pannel .today_news li div img {width: 100%;height: 100%;} #container .right_pannel .today_news li p {padding-left: 10px;height: 36px;line-height: 18px;overflow: hidden;color: #333;} #container .right_pannel .today_news li:hover p {color: #2a90d7;} /*右侧顶部360*/ .right360ad{ height: 130px; position: relative; } .right360ad img{ width: 200px; height: 110px; } .right360ad h3{ height: 18px; line-height: 17px; text-align: center; position: absolute; font-size: 14px; left: 0; bottom: 0; overflow: hidden; z-index: 2; color: #fff; } .right360ad .rightBack{ width: 240px; height: 18px; background: #000; opacity: 0.7; filter: alpha(opacity=70); position: absolute; left: 0; bottom: 0; } .right360ad span{ position: absolute; top: 0; right: 0; color: #eee; font-size: 12px; background: rgba(0,0,0,0.1); padding: 2px; } .right360ad div{ width: 240px; height: 128px; overflow: hidden; } .hot_ssp{ width: 240px; height: 265px; margin-top: 10px; margin-left: -10px; position:relative; } /* #container .right_pannel .today_news li .adv_source{color: #ccc;font-size: 12px;margin-left: 10px;} */ .top_ssp{ width:240px; height:262px; position: relative; display:none; } .top_ssp img{ width:240px; height:262px; } .showcase .ssp_click_gg img{ width:240px; height:128px; margin-bottom:6px; } .news_big{ width: 30px; color: #eee; float: right; font-size: 12px; } .swiper-container{ width:240px; height:255px; } .swiper-wrapper{ width:240px; height:255px; } .swiper-slide{ width:240px; height:255px; position:relative; } .swiper-slide p{position:absolute;bottom:0px;left:0;font-size:15px;color:#fff;height:20px;z-index:2;line-height:20px;} .swiper-slide .rightBack{ width: 240px; height:20px; background: #000; opacity: 0.7; filter: alpha(opacity=70); position: absolute; left: 0; bottom: 0; } .leftBtn { width: 36px; height: 53px; cursor: pointer; position: absolute; top: 50%; margin-top: -26px; z-index: 5; left: 0; background: url(../images/left.png) no-repeat; } .rightBtn { width: 36px; height: 53px; cursor: pointer; position: absolute; top: 50%; margin-top: -26px; z-index: 5; right: 0; background: url(../images/right.png) no-repeat; } .adCase img{width:240px;height:255px;} .asd{ background-color: white; display: inline-block; width: 240px; padding: 5px 0 0 0; font-size: 12px; max-height: 40px; color: #B2B2B2; line-height: 15px; } .adv_source{ position:absolute; top:0; right:0; color: #eee; font-size: 12px; background: rgba(0,0,0,0.1); padding: 2px; } .arrow{display:none;} .ad_source { position: absolute; top: 0; right: 0; color: #eee; font-size: 12px; background: rgba(0,0,0,0.1); padding: 2px; } .showcase .ssp_click_gg img{ width: 240px; height: 128px; margin-bottom: 6px; } #toast {width: 500px;height: 30px;background: #78b1f6;border-radius: 2px;font-size: 14px;color: #fff;line-height: 30px;box-sizing: border-box;text-align: center;} #toast.hide_now {animation: height_go_0 2s ease forwards;} @-webkit-keyframes height_go_0 { 0% { height: 30px;} 50% { height: 30px;} 100% { height: 0;} } @keyframes height_go_0 { 0% { height: 30px;} 50% { height: 30px;} 100% { height: 0;} }