.swiper-container{ width: 57.37%; height: 410px; float: left; margin-right:3.2786%; } .topNews{ margin-top: 40px; margin-bottom:40px; } .swiper-button-prev{ left:0px; background-image:url("../../../image/pre03.png"); width: 33px; height: 33px; } .swiper-button-next{ right:0px; background-image:url("../../../image/next03.png"); width: 33px; height: 33px; } .topNewList{ float:left; width:39.34%; } .toptitle{ color: #333333; font-size: 14px; letter-spacing: 1px; font-weight: bold; height: 20px;overflow: hidden; margin-bottom:5px; } .toptitle a{ color: #333333; } .intro{ color: #999999; text-align: justify; height:40px; overflow: hidden; line-height:21px; } .intro a{color: #999999;} .topDetail{ padding-top: 11px; padding-bottom: 11px; padding-left:20px; padding-right:20px; margin-bottom: 20px; background-color: #f5f5f5; } .topDetail:last-child{ margin-bottom: 0px; } .newTitle{ position: absolute; bottom: 0px; left: 0px; height: 80px; background-image:url("../../../image/home/bg.png"); font-size: 16px; color: white; padding-top: 16px; line-height: 25px; padding-left: 40px; padding-right: 40px; width: 100%; text-align: justify; } .title{ height: 48px; overflow: hidden; color:white; } .groupContent{ background-color:#F5F5F5; margin-bottom:40px; } .pohotNews{ background-color:#F5F5F5; padding-bottom:40px; } .otherNews{ margin-bottom:40px; } .groupNew{ width:72.13%; float:left; margin-right:3.2786%; } .groupTop{ color: #555555; max-width: 400px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-weight: bold; width:100%; } .groupTop a{ color: #555555; } .pubDate{ margin-top: 10px; /*margin-bottom: 10px;*/ } .groupnew{ display: inline-block; } .groupIntro{ line-height: 25px; color: #777777; margin-bottom: 20px; height:50px; overflow:hidden; } .groupDetail{ border-bottom: 1px solid #e3e4e4; margin-bottom: 40px; } .groupDetailimg{ float: left; padding-right:20px; width: 160px; height: 100px; margin-left: 0; } .groupDetailimg img { width: 100%; height: 100%; } .groupMedio{ float:left; width: 24.59%; } .groupMedio .modaulTitle{ width:100%; margin-bottom:15px; } .groupMedio .sub{ float: right; padding-right: 0px; } .vedioImg{ width:100%; } a{ cursor: pointer; } .bookE{ width:48.333333333%; display:block; float:left; color: #333333; text-align: center; } .bookE img{ width:100%; margin-bottom:15px; } .otherArea{ width:48.2%; height:295px; border:1px solid #e3e4e4; padding:40px 26px; float:left; } .otherArea:nth-child(3n+2){ margin-left: 3.2786%; /* margin-right: 3.2786%; */ } .otherArea ul{ padding-left: 0px; } .otherArea li a{ color: #777777; } .otherArea li a:hover{ color: #0055aa; } a:hover{ cursor:pointer; color:#0055aa; text-decoration:none; } .otherArea li{ line-height:30px; list-style-type:none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position:relative; } .otherArea .modaulTitle{ margin-bottom: 30px; } .hot{ background-image:url("../../../image/home/hot.png"); width:29px; height:13px; margin-top: 9px; position:absolute; } .pohotNews .modaulTitle{ width:100%; } .photoDetail{ width:25%; padding-left:36px; padding-right:36px; float:left; border-left:1px solid #e3e4e4; } .photoDetails{ margin-left: -36px; margin-right: -36px; display: inline-block; } .newsPicHeader:hover{ cursor:pointer; color:#0055aa; } .pohotNews .row{ overflow:hidden; } .date, .picList{ display: none; } .mobileTop { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } @media screen and (max-width: 767px) { .swiper-container{ width: 100%; height: 204px; margin-bottom: 17px; } .swiper-container img { width: 100%; /**height: 100%;*/ } .newTitle { padding: 6px 20px; height: 50px; } .title { height: auto; font-size: 14px; line-height: 1.4; } .topNews { margin-top: 0; margin-bottom: 15px; } .swiper-button-next, .swiper-button-prev { top: 50%; } .topNewList { width: 100%; padding: 0 15px; font-size: 14px; } .topDetail, .groupDetail, .otherArea ul li { background: none; width: 100%; position: relative; padding: 8px 15px 10px; margin-bottom: 0; border-top: 1px solid #ddd; border-bottom: none; padding-right: 0; } .topDetail:nth-child(1) { border-top: none; } .groupPic:nth-child(2), .otherArea li.picList:nth-child(1) { padding-top: 0; } .groupDetail:nth-child(2) { border-top: none; } .otherArea ul li:nth-child(1) { border-top: none; } .topDetail:before, .groupDetail:before, .otherArea ul li:before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #00aff0; position: absolute; left: 0; top: 20px; } .groupPic:before, .picList:before { display: none; } .groupPic, .otherArea li.picList { padding-bottom: 14px; padding-top: 12px; display: inline-block; } .groupPic img, .picList img { float: left; width: 100%; } .groupPic a, .groupPic span,.picList a, .picList span { position: relative; top: -6px; } .groupDetailimg { padding-right: 0; width: 24%; height: auto; } .groupDetailimg img { min-height: 37px; } .groupnew { width: 100%; } .groupPic .groupnew { width: 76%; padding-left: 10px; } .groupTop { max-width: none; } .topDetail .intro { display: none; } .toptitle, .groupTop, .mobileTop { height: auto; margin-bottom: 0; font-weight: 100; line-height: 2.2; white-space: normal; letter-spacing: 0; text-align: justify; overflow: auto; } .date { display: inline-block; float: right; color: #b2b2b2; font-weight: 100; font-size: 12px; } .groupNew { width: 100%; padding: 25px 15px; } .pubDate { float: right; font-size: 12px; } .modaulTitle img { width: 5px; height: 24px; } .modaulTitle { height: auto; } .otherArea { width: 100%; border: none; height: auto; padding: 25px 15px 15px; margin-left: 0 !important; margin-right: 0 !important; } .pohotNews { padding: 25px 15px 15px; } .groupContent { margin-bottom: 0; } .otherArea .modaulTitle { margin-bottom: 25px; margin-top: 0; background: none; border: none; } .otherArea.gray { background-color: #F5F5F5; } .photoDetail { width: 100%; } .newsPicHeader { /*text-align: center;*/ color: #333333; margin-top: 13px; margin-bottom: 18px; } .otherNews { margin-bottom: 0; } } .arrow-left { background: url(img/arrows.png) no-repeat left top; position: absolute; left: 10px; top: 50%; margin-top: -15px; width: 17px; height: 30px; } .arrow-right { background: url(img/arrows.png) no-repeat left bottom; position: absolute; right: 10px; top: 50%; margin-top: -15px; width: 17px; height: 30px; }