.banner, .swiperbanner { width: 100%; height: 730px; overflow: hidden; } .swiperbanner .swiper_box, .swiperbanner .swiper_img { width: 100%; height: 100%; } .swiperbanner .swiperprev, .swiperbanner .swipernext { width: 64px; height: 64px; margin-top: -32px; outline: none; color: transparent; } .swiperbanner .swipernext { background: url(/uploads/image/ien/icon_next.png) no-repeat 0px; } .swiperbanner .swiperprev { background: url(/uploads/image/ien/icon_prev.png) no-repeat 0px; } .swiperbanner .swiper_text { width: 100%; position: absolute; z-index: 5; bottom: 0px; height: 155px; background: url(/uploads/image/ien/icon_opacity.png) no-repeat center center; } .swiperbanner .swiper_text>a { display: block; } .swiperbanner .swiper_text>a>span { display: inline-block; font-size: 14px; color: #ffffff; font-family: "libre"; background-color: #840d24; padding: 6px 11px; } .swiperbanner .swiper_text>a>h3 { display: block; width: 80%; font-family: "libre"; font-size: 18px; margin-top: 10px; color: #ffffff; line-height: 28px; text-shadow: 0px 2px 3px rgba(85,85,85,0.5); } .swiperidxpaga { width: 140px !important; height: 35px; background: url(/uploads/image/ien/icon_opacity_page.png) no-repeat 0px; bottom: 60px !important; left: auto !important; right: 00px; } .positionidx { position: relative; } .swiperidxpaga>span { width: 10px; height: 10px; background-color: #ffffff; margin-top: 12px !important; } /* news */ .newsidx { width: 100%; background-color: #f6f6f6; padding: 80px 0px 60px; } .newsidxbanner, .swipernews, .newsidxbanner .swiper_box { width: 100%; height: 550px; } .newsidxbanner .swiper_img { width: 100%; height: 408px; border-radius: 5px; } .newsidxbanner .swiper_text { width: 70%; margin: 0 auto; position: absolute; z-index: 5; top: 60%; left: 50%; margin-left: -45%; background-color: #ffffff; padding: 30px; border-radius: 5px; border-top: 3px solid #af0c2a; transition: all .5s ease .1s; -webkit-transition: all .5s ease .1s; /*谷歌和safari*/ -moz-transition: all .5s ease .1s; /*火狐*/ -ms-transition: all .5s ease .1s; /*ie*/ -o-transition: all .5s ease .1s; /*opera*/ } .newsidxbanner .swiper_text h3 { display: block; font-family: "libre-bold"; font-size: 18px; line-height: 24px; color: #840d24; height: 72px; max-height: 72px; overflow: hidden; } .newsidxbanner .swiper_text p { font-family: 'libre'; font-size: 14px; color: #222222; line-height: 22px; height: 66px; overflow: hidden; margin: 30px 0px; } .newsidxbanner .swiper_text span { display: block; width: 150px; height: 40px; background-color: #ae0c2a; text-align: center; line-height: 40px; font-size: 12px; font-family: "libre-bold"; color: #ffffff; margin-top: 20px; } .newsidxbanner .swiper-slide-active .swiper_text { opacity: 1; } .swiperprevnews, .swipernextnews { width: 64px; height: 64px; outline: none; color: transparent; top: auto !important; bottom: 5%; opacity: .5; } .swiperprevnews { background: url(/uploads/image/ien/icon_prev_t.png) no-repeat 0px; left: auto; right: 100px; } .swipernextnews { background: url(/uploads/image/ien/icon_next_t.png) no-repeat 0px; } .swiperprevnews:hover , .swipernextnews:hover { opacity: 1; } .newsidxbanner .swiper-slide-active .swiper_text:hover { transform: translatey(-10px); } /* research */ .researchidx { width: 100%; padding: 60px 0px; background-color: #ffefe2; } .commontitle { width: 100%; position: relative; text-align: center; } .commontitle>h3 { display: inline-block; font-size: 40px; color: #222222; font-family: 'libre-bold'; } .commontitle>a { display: block; position: absolute; right: 0px; top: 0px; font-size: 12px; font-family: 'libre'; color: #666666; line-height: 20px; margin-top: 25px; text-decoration: underline; } .commontitle>a:hover { color: #af0c2a; } .researchidx_item { width: 100%; margin-top: 60px; display: flex; justify-content: space-between; align-items: center; } .research_idx_list { width: calc(100% - 68%); } .research_idx_list_pic { width: 100%; height: 264px; overflow: hidden; } .research_idx_list_pic>img { transition: all .3s ease-out .1s; -webkit-transition: all .3s ease-out .1s; -moz-transition: all .3s ease-out .1s; -ms-transition: all .3s ease-out .1s; -o-transition: all .3s ease-out .1s; } .research_idx_list_text { width: 100%; margin-top: 30px; padding-bottom: 30px; position: relative; z-index: 1; } .research_idx_list_text>h3 { display: block; font-family: 'libre-bold'; font-size: 16px; color: #222222; line-height: 26px; max-height: 78px; overflow: hidden; } .research_idx_list_text>span { display: block; font-family: 'libre'; font-size: 14px; color: #666666; margin-top: 20px; } .research_idx_list_text:after { content: ''; display: block; position: absolute; z-index: 1; bottom: 0px; left: 0px; width: 0; height: 1px; background-color: #840d24; transition: width .5s ease .1s; -webkit-transition: width .5s ease .1s; /*谷歌和safari*/ -moz-transition: width .5s ease .1s; /*火狐*/ -ms-transition: width .5s ease .1s; /*ie*/ -o-transition: width .5s ease .1s; /*opera*/ } .research_idx_list:hover .research_idx_list_text:after { width: 100%; } .research_idx_list:hover .research_idx_list_text>h3 { color: #840d24; } .research_idx_list:hover .research_idx_list_pic>img { transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1); -moz-transform: scale(1.1,1.1); -ms-transform: scale(1.1,1.1); } /* events */ .eventsidx { width: 100%; padding: 60px 0px; } .events_idx_item { width: 100%; margin-top: 60px; display: flex; flex-wrap: wrap; justify-content: space-between; } .events_idx_list { width: calc(100% - 68%); } .events_idx_list .events_idx_list .events_idx_list .events_idx_list { margin-top: 80px; } .events_idx_list>a { display: flex; justify-content: space-between; } .events_time { width: 87px; height: 138px; background: rgba(102, 102, 102, 0.1); border-radius: 8px; padding-top: 30px; text-align: center; } .events_time>span { display: block; font-size: 14px; color: #222222; line-height: 30px; font-family: 'libre-bold'; } .events_time>span span { font-size: 30px; line-height: 40px; } .events_text { width: calc(100% - 120px); } .events_text>h3 { display: block; font-size: 16px; font-family: 'libre-bold'; color: #222222; line-height: 28px; max-height: 84px; overflow: hidden; } .events_text>span { display: block; font-family: 'libre'; font-size: 14px; color: #666666; margin-top: 20px; } .events_idx_list>a:hover .events_time { background-color: #af0c2a; } .events_idx_list>a:hover .events_time>span { color: #ffffff; } .events_idx_list>a:hover .events_text>h3 { color: #af0c2a; }