.fl { float: left; } .fr { float: right; } ul.newslist { text-align: left; padding: 30px 0 0 0; } ul.newslist li { list-style-type: disc; color: rgb(245, 161, 0); padding-left: 0px; margin-left: 10px; } ul.newslist li a:link { color: #333; } ul.newslist li a:hover { color: rgb(245, 161, 0); } ul.newslist li a:visited { color: #333; } #index_banner { overflow: hidden; height: 33.8vw; margin: 0 auto; } #index_banner ul { padding: 0; } #index_banner ul li { padding: 0; } #index_product { margin: 0 auto; background-color: rgba(238, 238, 238,.4); } #index_product .title { text-align: center; } #index_product .title h1 { } #index_product .title h5 { color: #001f6e; } #index_product .title em { font-size: 24px; color: #999; line-height: 150%; font-weight: bold; font-style: normal; } #index_product .menu{ display: flex; justify-content: center; } #index_product .menu li{ float: left; height: 30px; box-sizing: border-box; font-size: 18px; line-height: 18px; letter-spacing: 1px; margin-right: 32px; margin-bottom: 48px; } #index_product .menu li:hover{ cursor: pointer; } #index_product .menu li:last-child{ margin-right: 0; } #index_product .menu li.current{ color: #f08519; border-bottom: solid 1px #f08519; } #index_product .content .c{ margin-bottom: 80px; } #index_product .content .c .list { width: 50%; } #index_product .content .c .list ul.menu { width: 100%; } #index_product .content .c .list ul.menu li { width: 141px; height: 39px; line-height: 39px; float: left; font-size: 14px; color: #002063; background-color: #ffffff; cursor: pointer; border: none; margin-right: 8px; transition: 0.5s ease all; border-radius: 3px; box-shadow: 0 0 5px #ccc; } #index_product .content .c .list ul.menu li:last-child { margin-right: 0; } #index_product .content .c .list ul.menu li.current { background: #002063; color: #fff; } #index_product .content .c .list .items { width: 100%; float: left; } #index_product .content .c .list .items .item { display: none; width: 100%; } #index_product .content .c .list .items .item:first-child { display: block; } #index_product .content .c .list .items .item ul li span { display: inline-block; white-space: break-spaces; width: 100%; text-align: center; padding: 5px 0; } #index_product .more { display: block; margin: 0 auto; cursor: pointer; text-align: center; width: 102px; height: 30px; line-height: 30px; color: #fff; } #index_product .more:hover { text-decoration: none; } #index_product .product-rec{ background-color: #fff; overflow: hidden; ry_jp_05} #index_product .product-rec .hottitle { text-align: center; padding: 70px 0 50px; letter-spacing: 4px; } #index_product .swiper-button-prev{ background-image: url("/public/images/index/button_prev.png"); width: 33px; height: 33px; background-size:33px 33px; left: 518px; } #index_product .swiper-button-prev:hover{ background-image: url("/public/images/index/button_prev_link.png"); } #index_product .swiper-button-next{ background-image: url("/public/images/index/button_next.png"); width: 33px; height: 33px; background-size:33px 33px; right: 518px; } #index_product .swiper-button-next:hover{ background-image: url("/public/images/index/button_next_link.png"); } #index_product .swiper-button-prev,#index_product .swiper-button-next{ bottom: 50px; } .swiper-slide { border: solid 1px #eeeeee; box-sizing: border-box; } .swiper-wrapper a:hover{ text-decoration: none; cursor: pointer; overflow: visible; box-shadow: 0 6px 10px 0 rgba(95, 101, 105, 0.15); transform: translateY(-5px); } .bx-wrapper img{ margin: 24px auto 0; min-height: 0; } .plist-img{ text-align: center; display: flex; justify-content: space-between; width: 455px; margin: 40px auto 20px; } .plist-img li{ width: 125px; height: 165px; font-size: 15px; } .plist-img li img{ margin-top: 24px; margin-bottom: 30px; height: 45px; } #news { background: #193066; background: url("/public/images/index/news_bg.png") no-repeat; background-size: cover; padding-bottom: 80px; } #news .title { width: 100%; text-align: center; color: #fff; } #news .play { position: relative; cursor: pointer; } #news .play .mask { background-color: rgba(0, 0, 0, .4); position: absolute; top: 0; bottom: 0; left: 5px; right: 5px; } #news .play i { position: absolute; font-size: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; z-index: 3; color: #ccc; } #news .play:hover { color: #fff; } #news .play:hover .mask { background-color: rgba(0, 0, 0, .2); } #news li:nth-child(2) { animation-delay: 0.1s; } #news li:nth-child(3) { animation-delay: 0.2s; } #news li:nth-child(4) { animation-delay: 0.3s; } #news img { width: 280px; height: 180px; } #news .title h2 { color: #ffffff; } #news .title h5{ color: #ffffff; } #news .title em { font-size: 24px; color: #fff; line-height: 150%; font-weight: bold; font-style: normal; } #news ul { width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; } #news li { } #news li>div{ padding-top: 2px; background: #fff; text-align: left; font-size: 12px; box-sizing: border-box; width: 290px; height: 300px; position: relative; transition: .3s all; } #news li>div:hover{ transform: translateY(-5px); } #news li p { font-size: 16px; margin: 17px 10px 4px; height: 40px; letter-spacing: 1px; color: #333333; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; } #news li>div a{ display: block; } #news li p a{ line-height: 24px; } #news li:first-child { margin-left: 0; } #news li .play{ margin: 7px auto 0; position: relative; text-align: center; } #news li .news_info{ margin: 20px 15px 0; opacity: 0.5; } #news li .news_date{ font-size: 12px; color: #999; } #news li .underline{ width: 43px; height: 7px; background-color: #002063; } #news .news_img{ margin: 3px 5px 0; } #news .news_more { margin: 50px auto 0; display: block; cursor: pointer; text-align: center; width: 102px; height: 30px; line-height: 30px; color: #fff; } #news .news_more:hover { text-decoration: none; cursor: pointer; } #news ul a { display: block; color: #333333; letter-spacing: 1px; } #news ul a:hover { text-decoration: none; } #news ul a img { width: 100%; } #about{ padding-bottom: 50px; } #about .title h2 { text-align: center; margin: 80px 0 50px; color: #001f6e; } #about .title h5 { color: #001f6e; } #about .title em { font-size: 24px; color: #999; line-height: 150%; font-weight: bold; font-style: normal; } #about .content .list { margin: 0 auto; overflow: hidden; align-content: flex-start; } #about .content .list ul.menu { display: flex; justify-content: center; height: 40px; border-bottom: 1px #6666664f solid; box-sizing: border-box; } #about .content .list ul.menu li { width: 175px; height: 40px; cursor: pointer; border: none; box-sizing: border-box; transition: 0.5s ease all; overflow: visible; position: relative; float: left; text-align: center; box-sizing: border-box; color: #333333; font-size: 18px; } #about .content .list ul.menu li::after{ content: ""; display: inline-block; width: 0; height: 1px; background-color: #f08519; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); transition: 0.3s all linear; } #about .content .list ul.menu li.current::after{ width: 100%; transition: 0.1s all linear;/*璁剧疆杩囧害鏃堕棿*/ transition-delay: 0.1s;/*杩囧害寤舵椂*/ } #about .content .list .items { overflow: hidden; float: left; margin-top: 50px; width: 100%; } #about .content .list .items .abitem { display: none; opacity: 0; height: 362px; } #about .content .list .items .padd{ } #about .content .list .items .padd .flex{ display: flex; justify-content: space-between; } #about .content .list .items .abitem:first-child { display: block; } #about .content .list .items .abitem:first-child { opacity: 1; } #typical { background-color: #f8f8f8; text-align: center; padding-bottom: 100px; } #typical .content { font-size: 0; } #typical .logo-box{ text-align: left; display: flex; } #typical a{ display: flex; width: 150px; border: 1px solid rgba(0,0,0,0); margin-bottom: 10px; height: 75px; text-align: center; justify-content: center; position: relative; align-items: center; transition: .3s all; } #typical a:hover { border: solid 1px #eeeeee; cursor: auto; transform: translateY(-5px); } #typical a img { width: 120px; height: 48px; } #typical .title h5{ color: #001f6e; } /*锟斤拷品锟剿碉拷item*/ .itemsImg .itemImg img{ width: 553px; height: 355px; box-shadow: 0px 5px 8px 0px rgba(0, 0, 0, 0.16); } .list li p { margin: 0; color: #666; } .item-desc { color: #666; margin-top: 0; height: 66px; line-height: 26px; } .item h3 { margin: 10px 0; font-size: 14px; } .itemImg { display: none; } .itemImg:first-child { display: block; } .abitem-list { vertical-align: top; text-align: center; } .abitem-list img { margin: 0; margin-bottom: 20px; margin-top: 55px; } .abitem-list h5 { font-size: 20px; font-weight: normal; letter-spacing: 1px; color: #333; } .abitem-text { width: 240px; margin: 0 auto; } .abitem-text p{ margin-top: 30px; color: #616161; } .about_us > div { float: left; } .about_us_left { width: 600px; text-indent: 2em; color: #878787; margin-right: 15px; margin-top: 25px; float: right!important; letter-spacing: 1px; text-align: justify; } .about_us_left p { letter-spacing: 1px; color: #7d7d7d; line-height: 26px; margin-top: 0; } .about_us_left h3 { font-size: 60px; font-weight: normal; color: #001f6e; text-indent: 40px; } .about_us_left h3 span { font-size: 20px; text-indent: 20px; } .about_us_left h3 span.top{ position: relative; top: -30px; font-weight: bolder; } .about_us_text { display: flex; justify-content: space-between; margin-top: 45px; } .about_us_text div { line-height: normal; text-align: center; transition: all 0.6s; } .about_us_text div:hover { transform: scale(1.4); } .about_us_text h5 { font-size: 16px; color: #474747; font-weight: normal; } .about_us_right img { margin-left: 40px; } .about-fz{ /*overflow: auto;*/ } .about-fz-box { position: relative; left: 140px; /*background: url("/public/images/index/about_fz_line.png") no-repeat 50px 35px;*/ /*height: 300px;*/ /*padding-left: 50px;*/ } .about-fz-box ul li{ float: left; } .about-fz-box h5{ font-size: 30px; } .about-fz-box p { font-size: 14px; color: #666666; } #abouttab { display: flex; flex-wrap: wrap; justify-content: center; } #abouttab .about_us{ padding-top: 35px; box-sizing: border-box; } .about-fz-list ul { display: flex; justify-content: space-between; } .about-fz-list ul li p { position: absolute; font-size: 12px; width: 120px; font-weight: bolder; opacity: .7; } .about-fz-list ul li:nth-child(1) p { bottom: 20px; } .about-fz-list ul li:nth-child(6) p { bottom: 112px; right: -8px; } #abouttab .about-ry-list{ display: flex; justify-content: space-between; } #abouttab .about-ry-list li{ float: left; text-align: center; position: relative; } #abouttab .about-ry-list li img{ border: 1px solid #ececec; } #abouttab .about-ry-list p{ text-align: center; position: absolute; color: #fff; bottom: 24px; width: 100%; background-color: #002063; opacity: 0.4; font-size: 18px; } /*姣忎竴灞忕殑鏍囬鍜屽壇鏍囬鏍峰紡*/ .title h1{ letter-spacing: 4px; padding: 80px 0 50px 0; margin: 0; text-align: center; } /*瑙嗛鎾斁灞?/ .modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1050; display: none; } .modal .mask { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); } .modal .video { position: absolute; left: 50%; top: 50%; z-index: 10; transform: translate(-50%, -50%); z-index: 15; } .video i { font-size: 50px; position: absolute; right: 10px; top: -57px; color: #fff; opacity: 0.7; cursor: pointer; } .video i:hover { opacity: 1; } .modal .video video { display: block; max-width: 980px; max-height: 500px; margin: 0 auto; } .itemProd { dispaly: none; padding-top: 10px } /*banner杞挱*/ /*--------------SLIDER----------------*/ #slider { width: 100%; min-width: 1200px; background-color: rgba(238, 238, 238,.4); } #slider li{ max-height: 644px; position: relative; } .banner-text-wrap{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; } .banner-text4,.banner-text1{ width: 1200px; margin: 0 auto; position: relative; top: 28%; color: #fff; font-size: 40px; } .banner-text2 { width: 1200px; margin: 0 auto; } .banner-text1 { top: 18%; } .banner-text1 h4{ font-size: 36px; line-height: 60px; } .banner-text1 h4 p{ font-size: 24px; margin: 0; font-weight: normal; } .banner-text1 ul{ margin-top: 24px; } .banner-text1 ul li{ float: none!important; width: auto!important; font-size: 14px; line-height: 36px; } .banner-text1 ul li .circle{ display: inline-block; width: 10px; height: 10px; background-color:#f08519; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; margin-right: 5px; } .banner-text2 .banner-img-01{ margin-top: 1vw; } @media screen and (min-width:1366px) and (max-width:1600px){ } @media screen and (max-width: 1366px){ } @media screen and (max-width: 1200px){ } .banner-text2 h1 { color: #666; font-size: 48px; line-height: 48px; } .banner-text2 h1 span{ color: #f08519; } .banner-text2 h3{ color: #333; font-size: 24px; font-weight: normal; margin: 5px 0 22px; } .banner-text2 h5{ font-size: 14px; font-weight: normal; color: #666; } .banner-text2 h5 span{ color: #ef8419; font-weight: bolder; } .banner-text2 .btn-group a{ letter-spacing: 2px; color: #ffffff; font-size: 14px; width: 120px; height: 30px; line-height: 30px; display: inline-block; background-color: #f08519; text-align: center; margin-right: 60px; } .banner-text2 .btn-group a:hover{ background-color: rgba(240, 133, 25, 0.89); } .banner-text2 .btn-group { position:absolute; bottom: 7rem; left: 20rem; } .banner-text4 .banner4-btn,.banner-text1 .banner1-btn{ display: inline-block; background-color: #f08519; color: #fff; font-size: 14px; padding: 5px 20px; cursor: pointer; margin-top: 5px; line-height: 28px; } .banner-text1 .banner1-btn{ margin-left: 46px; margin-top: 16px; } .banner-text4 p.title{ font-size: 48px; line-height: 48px; font-weight: bold; letter-spacing: 5px; color: #031134; margin: 0; } .banner-text4 p.text{ font-size: 30px; line-height: 30px; letter-spacing: 3px; color: #031134; margin-top: 30px; margin-bottom: 50px; } /*--------------CONTROLS--------------*/ /*position controls*/ .controls li { top: 50%; margin-top: -50px; z-index: 10; } .controls li:nth-child(1) { left: 40px; } .controls li:nth-child(2) { right: 40px; } #slider .controls li{ width: 60px; height: 60px; } #slider .controls li.back{ background: url("/public/images/back.svg") no-repeat; } #slider .controls li.back:hover{ background: url("/public/images/back_01.svg") no-repeat; } #slider .controls li.prev{ background: url("/public/images/prev.svg") no-repeat; } #slider .controls li.prev:hover{ background: url("/public/images/prev_01.svg") no-repeat; } /*------------PAGINATION------------*/ /*style pagination*/ .pagination li { background-color: #ddd; } .pagination li.active { background-color: #000; } /*-------------HELPERS----------------*/ .responsive { width: 100%; } .swiper-container { width: 100%; height: 310px; margin: 0 auto; padding-bottom: 120px; } /*杞挱鍥?/ .controls li { display: none; }