﻿

/*幻灯片 beg*/
#swiper-main { z-index: 50; position: relative; }
#swiper-main .swiper-slide {height: 540px!important; width: 100% }
#swiper-main .swiper-slide a { display: block; position: relative; color: #fff; height: 540px; width: 100% }
#swiper-main .swiper-slide a img { width: 100%; }
#swiper-main .swiper-slide a .wrap { position: absolute; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
#swiper-main .swiper-slide a .wrap .container { position: relative; height: 100%; }
#swiper-main .swiper-slide a .wrap .container .silde-title { display: inline-block; padding: 10px 20px; position: absolute; bottom: 30px; left: 0px; background-color: rgba(43, 39, 39, 0.50); }
#swiper-main .swiper-slide a .wrap .container .silde-title span { font-size: 18px; }

#swiper-main .swiper-pagination-bullet { background-color: transparent; border: solid 1px #fff; border-radius: 50%; opacity: 1; height: 14px; width: 14px; transition: all 0.3s; }
#swiper-main .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; }

#swiper-main .swiper-button-next, #swiper-main .swiper-button-prev { background-image: none !important; position: absolute; top: 50%; width: 44px !important; height: 44px; text-align: center; line-height: 54px !important; margin-top: -22px; z-index: 10; border-radius: 0; background-color: rgba(0, 0, 0, 0.20); transition: all 0.3s; }
#swiper-main .swiper-button-next:hover, #swiper-main .swiper-button-prev:hover { background-color: rgba(0, 0, 0, 0.80) }
#swiper-main .swiper-button-next { right: 0px !important; }
#swiper-main .swiper-button-prev { left: 0px !important; }
#swiper-main .swiper-button-next i, #swiper-main .swiper-button-prev i { font-size: 20px; color: rgba(255, 255, 255, 0.6); text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.20) }
#swiper-main .swiper-button-next:hover i, #swiper-main .swiper-button-prev:hover i { color: rgba(255, 255, 255, 0.8); text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.40) }


#swiper-case .swiper-slide a img { width: 100%; }

.swiper-container-horizontal > .swiper-pagination-bullets { bottom: 10px; }

.case-container { padding: 0px 50px; position: relative; }


.case-container .swiper-button-next, .case-container .swiper-button-prev { background-size: 18px auto !important; text-align: center; background-color: #eee }
.case-container .swiper-button-next:hover, .case-container .swiper-button-prev:hover { background-color: #ddd }
/*.case-container .swiper-button-next { right: -20px !important; }
.case-container .swiper-button-prev { left: -20px !important; }*/
/*.case-container .swiper-button-next i, .case-container .swiper-button-prev i { font-size: 20px; color: rgba(255, 255, 255, 0.6); text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.20) }
.case-container .swiper-button-next:hover i, .case-container .swiper-button-prev:hover i { color: rgba(255, 255, 255, 0.8); text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.40) }*/


.section-header { text-align: center; padding: 50px; }
.section-header .section-title { font-size: 30px; font-weight: bold; display: block; }
.section-header .section-desc { font-size: 14px; display: block; }
.section-header .section-line-h { width: 150px; height: 4px; display: block; position: relative; }
.section-header .section-line-h:before { content: ""; background-color: #e0b509; overflow: hidden; vertical-align: middle; width: 30px; height: 4px; display: inline-block; }


.section-yewu ul { display: flex; justify-content: space-between; }
.section-yewu ul li { width: 16%; height: 140px; }
.section-yewu ul li a { display: block; position: relative; }
.section-yewu ul li a span { display: block; }
.section-yewu ul li a span.img { position: absolute; left: 0px; top: 0px; z-index: 100; max-width: 200px; }
.section-yewu ul li a span.img img { width: 100%; }
.section-yewu ul li a span.name { z-index: 200; position: relative; text-align: center; line-height: 140px; color: #fff; font-size: 18px; }

.news { background-color: #f0f0f0; padding: 50px; }
.box-header { background-color: #4b6524; height: 70px; line-height: 70px; padding: 0px 10px; border-radius: 10px 10px 0px 0px; }
.box-header .box-header-title { color: #fff; font-size: 24px; position: relative; display: inline-block; }
.box-header .more { float: right; font-size: 12px; color: #fff; font-weight: 300; }
.box-header .more:hover { color: #fff }

.news-box { background-color: #fff; min-height: 400px; padding: 20px; }

.border { box-shadow: 0px 0px 1px #ccc; border-radius: 3px; }
.newsitem { display: block; overflow: hidden; padding: 10px 0px; border-bottom: dotted 1px #eee; }
.newsitem.noborder { display: block; overflow: hidden; padding: 10px 0px; border-bottom: dotted 1px #fff; }
.newsitem:last-child { border-bottom: none; }
.newsitem .newstitle { font-size: 16px; overflow: hidden; width: 70%; display: inline-block; text-overflow: ellipsis; white-space: nowrap; }
.newsitem .newsdesc { display: inline-block; float: right; font-size: 16px; }
.newsitem .newsthum { display: block; color: #999; width: 100%; clear: both; padding-top: 20px; }
.links .value ul li{ float:left; margin-right:15px;margin-bottom:15px; }


/*for main nav*/
@media screen and (max-width:767px) { /*H5*/ .page-header { text-align: center; }
    .page-header .line { border-bottom: solid 1px #ddd; position: relative; padding-left: 0px; padding-bottom: 10px; }
    .page-header .line:before { display: none; }

    .search-area { height: 160px; position: relative; z-index: 10; margin-top: 0px; padding: 0px 0px; }
    .search-area-content { background-color: rgba(0, 0, 0, 0.1); border-radius: 0px; padding: 23px 10px 10px 10px; }
    .search-area-content > div { padding-left: 8px; padding-right: 8px; padding-bottom: 10px; }

    .box-product { margin-top: 20px; }
    .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 0px; }

    .mediaitem .mediatitle { overflow: initial; text-overflow: initial; white-space: normal; }
    .mediaitem > div { padding-left: 0px; padding-right: 0px; }
    .carditem .cardtitle span { font-size: 14px; font-weight: 600; }
    #swiper-main .swiper-button-next, #swiper-main .swiper-button-prev { display: none; }
    #swiper-main .swiper-slide { height: 180px !important; width: 100%; background-size: cover!important }
    #swiper-main .swiper-slide a { display: block; position: relative; color: #fff; height: 180px; width: 100% }


    .section-header { text-align: center; padding: 20px; }
    .section-header .section-title { font-size: 24px; font-weight: bold; display: block; }
    .section-header .section-desc { font-size: 14px; display: block; }
    .section-header .section-line-h { width: 150px; height: 4px; display: block; position: relative; }
    .section-header .section-line-h:before { content: ""; background-color: #e0b509; overflow: hidden; vertical-align: middle; width: 30px; height: 4px; display: inline-block; }


    .section-yewu ul { display: flex; justify-content: space-between; flex-wrap: wrap }
    .section-yewu ul li { width: 48%; height: 140px; margin-bottom: 20px; }
    .section-yewu ul li a { display: block; position: relative; }
    .section-yewu ul li a span { display: block; }
    .section-yewu ul li a span.img { position: absolute; left: 0px; top: 0px; z-index: 100; max-width: 200px; }
    .section-yewu ul li a span.img img { width: 100%; }
    .section-yewu ul li a span.name { z-index: 200; position: relative; text-align: center; line-height: 140px; color: #fff; font-size: 18px; }


    .news-box { background-color: #fff; min-height: 400px; padding: 15px; }
    .news { padding: 15px 0px; }
    .news .container{ padding: 0px; }
    .news .news-box{ margin-bottom:20px; }
    /*.container { padding: 0px }*/
}
