@charset "utf-8";

/* CSS Document */
.index_pc{display: block;}
.index_wap{display: none;}
.f14{ font-size: 14px}
.f18{ font-size: 18px}
.f20{ font-size: 20px}
.f22{ font-size: 22px}
.f24{ font-size: 24px}
.f28{ font-size: 0.28rem}
.f26{ font-size: 0.55rem; color: #666666}
.f32{ font-size: 0.32rem}
.f34{ font-size: 0.34rem}
.f46{ font-size: 0.46rem}
.f48{ font-size:0.85rem}
.f50{ font-size: 0.5rem}
.f60{ font-size: 2.34375vw}
.f70{ font-size: 2.734375vw}
.f72{ font-size: 2.8125vw}
.f90{ font-size: 3vw}
.f93{ font-size: 3.6328vw}


.aboutMap { padding-bottom:60px; padding-top:60px}
.aboutMap .left { float: left; width:46%; color: #000 }
.aboutMap .left .tit { line-height: normal; margin-bottom:0px; font-weight: bold; }
.aboutMap .left p { margin-top:2vw; line-height: 28px; border-bottom:1px solid #b8b8b8; font-size:16px; padding-bottom:13px}
.aboutMap .left b{  font-size:18px}
.aboutMap .left p a { color:#000000}
.ico01{ padding-left:70px; background: url(/images/icon1_6.png) no-repeat left 2px}
.ico02{ padding-left:70px; background: url(/images/icon1_1.png) no-repeat left 2px}
.ico03{ padding-left:70px; background: url(/images/icon1_2.png) no-repeat left 2px}
.ico04{ padding-left:70px; background: url(/images/icon1_3.png) no-repeat left 2px}


.aboutMap .right { float: right; width: 50%; height: 560px; margin-top:10px;border-radius:5px; overflow: hidden;border:1px solid #b8b8b8}
.aboutMap .right * { max-width: none }
.aboutMap .right .ytable { width: 350px; max-width: 93% }
.aboutMap .right .pic { width: 30% }
.aboutMap .right .txt { padding-left: 3% }
.aboutMap .right .txt h4, .aboutMap .right .txt p { margin: 0 }
.aboutMap .right .txt h4 { padding-left:0px; background: url(../images/add_icon.png) no-repeat left center; }
.aboutMap .right .txt p { font-size: 14px; line-height:25px }
@media (max-width:640px) {
.aboutMap .left, .aboutMap .right { width: 100%; float: none }
}





/* 行业 */
.list_business {  }
.list_business .list { margin: 70px 0 70px }
.list_business .list ul li { display: block;  margin-bottom:20px}
.list_business .list ul li a { display: block }
.list_business .list ul li a .txt { float: left; width: 50%; height: 395px; background: #c8161d; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s }
.list_business .list ul li a .txt .des { padding: 100px 80px; background: url("/images/business_bg2.png") 0 0 no-repeat; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; position: relative }
.list_business .list ul li a .txt .des i.iconfont { display: block; width: 40px; height: 40px; line-height: 40px; text-align: center; font-size: 40px; color: #fff; position: absolute; right: 90px; top: 90px; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s ; font-style: normal; }
.list_business .list ul li a .txt b.t1 { display: block; font-size: 30px; color: #fff }
.list_business .list ul li a .txt span.t2 { display: block; font-family: 'btl'; font-size: 30px; opacity: .5; filter: alpha(opacity=50); line-height: 34px; margin: 8px 0 }
.list_business .list ul li a .txt p { display: block; font-size: 16px; line-height: 34px; height: 136px; overflow: hidden; color: #fff; font-weight: lighter }
.list_business .list ul li a .thumb { float: right; width: 50%; height: 395px; overflow: hidden }
.list_business .list ul li a .thumb img { 
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  transition: all .3s;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  width: 100%;
}
.list_business .list ul li a .thumb span { display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s }
.list_business .list ul li a:hover .txt { background: #f5f5f5 }
.list_business .list ul li a:hover .txt .des { background: url("/images/business_bg.png") 0 0 no-repeat }
.list_business .list ul li a:hover .txt .des i.iconfont { color: #9f9f9f; transform: rotate(90deg); -ms-transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg) }
.list_business .list ul li a:hover .txt b.t1, .list_business .list ul li a:hover .txt span.t2{ color: #222 }
.list_business .list ul li a:hover .txt p { color: #666 }
.list_business .list ul li a:hover .thumb span { -webkit-transform: scale(1.07, 1.07); -moz-transform: scale(1.07, 1.07); -o-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07) }
.list_business .list ul li a:hover .thumb img { 
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
}
.list_business .list ul li:nth-child(odd) a .txt { float: right }
.list_business .list ul li:nth-child(odd) a .thumb { float: left }

@media (max-width: 768px){
  .list_business .list ul li { display: block; width: 100%; display: inline-block;}
  .list_business .list ul li a .txt{ width: 100%; float: none; clear: both; height: auto;}
  .list_business .list ul li a .thumb{ width: 100%; float: none; clear: both;  height: auto; }
  .list_business .list ul li a .thumb img{ width: 100%; height: auto;}
  .list_business .list ul li a .thumb span{ display: none;}
  .list_business .list ul li a .txt .des{ padding: 20px;}
  .list_business .list ul li a .txt .des i.iconfont{      right: 20px; top: 15px; font-size: 24px;}
  .list_business .list ul li a .txt b.t1 { font-size: 18px;}
  .list_business .list ul li a .txt p{ font-size: 14px; height: auto; text-align: justify; line-height: 1.8; margin: 10px 0;}
}












/*网站单位设置*/
@media (max-width: 767px) {
  html {
    font-size: 26px !important; } }
@media (max-width: 479px) {
  html {
    font-size: 24px !important; } }
@media (max-width: 320px) {
  html {
    font-size: 20px !important; } }
@media (min-width: 768px) {
  html {
    font-size: 28px !important; } }
@media (min-width: 1200px) {
  html {
    font-size: 30px !important; } }
@media (min-width: 1440px) {
  html {
    font-size: 34px !important; } }
@media (min-width: 1680px) {
  html {
    font-size: 40px !important; } }


.w1400 {
  width: 1400px; }

.w980 {
  width: 980px; }

.w1100 {
  width: 1100px; }

.w1170 {
  width: 1170px; }

.w1140 {
  width: 1140px; }

.w1400, .w1170, .w1140, .w1100, .w980 {
  margin-left: auto;
  margin-right: auto; }


@media (max-width: 1900px) {
  .lithium-list1 .list1-imgs {
    left: 0; } }
@media (max-width: 1700px) {
  .lithium-list2-banner .swiper-slide {
    height: 22rem; } }
.star-products .star-banner {
  position: relative;
  padding: 21px 0;
  overflow: hidden;
  top: -21px;
}
.lithium .footer, .key .footer, .alkaline .footer, .lipstick .footer, .water .footer {
  margin-top: -42px;
}
.nav-hides2 .w1400 {
  width: 1170px;
}
.nav-hides2-top .w1400 {
    position: relative;
    height: 44px;
  }
  .nav-hides2-top input {
    line-height: 44px;
    border: none;
    margin: 0;
    position: absolute;
    box-sizing: border-box;
    top: 0;
  }
  .nav-hides2 .txt-wrap {
    font-size: 16px;
    padding: 16px 10px 0;
  }
  .hides-search-input {
    width: calc(100% - 100px);
  }
@media (max-width: 1600px) {
  .star-products .star-name {
    bottom: 12px;
  }
  .star-products .star-banner {
    padding: 16px 0;
    top: -16px;
  }
 .lithium .footer, .key .footer, .alkaline .footer, .lipstick .footer, .water .footer {
    margin-top: -32px;
  }
  .w1170, .nav-hides2 .w1400 {
  	width: 840px;
  }
.nav-hides2-top .w1400 {
    height: 34px;
  }
  .nav-hides2-top input {
    line-height: 34px;
  }
  .nav-hides2 .txt-wrap {
    font-size: 14px;
    padding-top: 0px 5px;
  }
}
@media (max-width: 1500px) {
  .lithium-list3 .list3-imgs {
    flex: 0 0 50%;
    margin-right: 0; }

  .lithium-list1 .list1-imgs {
    flex: 0 0 50%; }

  .lithium-list3 .lithium-title-wrap, .lithium-list1 .lithium-title-wrap {
    flex: 0 0 460px;
    width: 460px; }

  .lithium-list3 .num-cn {
    font-size: 16px; }

  .lithium-list2-banner .lithium-title {
    font-size: 32px; }

  .w1400 {
    width: 92%; }
    .w1170, .nav-hides2 .w1400 {
	  	width: 840px;
	  }
  .about-list1 .list1-left {
    width: 92%;
    left: 4%;
    margin-left: auto;
    padding-right: 48vw; }
  .about-list1 .right-bg {
    height: 600px; }

  .about-list4 .list4-right {
    width: 92%;
    left: 4%;
    margin-left: auto;
    padding-left: 48vw; }
  .about-list4 .left-bg {
    height: 700px; } }

.about-page .message {
  padding: 60px 0px 70px;
}
.about-page .message .title {
  font-size: 34px;
  padding-bottom: 22px;
  margin-bottom:6px;
  text-align:left;
}


.about-page .message .title:after {content: '';width: 60px;height: 4px;display: block;background-image: linear-gradient(90deg, #c8161d, #c8161d); text-align:left; margin-top:15px}



.about-page .message .slogan {
  font-size: 15px;
  color: #888888;
  margin-bottom: 44px;
}
.about-page .message .tips {
  line-height: 30px;
  font-size: 15px;
  color: #555555;
  background: url(/images/tips.png) no-repeat 0 6px;
  padding-left:30px;
  margin: 18px 0 24px 0;
}
.about-page .message .row {
  margin: 0 -18px;
}
.about-page .message .col {
  padding: 0 18px;
}
.about-page .message textarea,
.about-page .message input[type='text'] {
  width: 100%;
  font-size: 15px;
  line-height: 22px;
  padding: 12px 18px;
  border: solid 1px #e0e0e0;
  margin-bottom: 28px;
}
.about-page .message textarea::-webkit-input-placeholder,
.about-page .message input[type='text']::-webkit-input-placeholder {
  color: #a1a1a1;
}
.about-page .message textarea:-moz-placeholder,
.about-page .message input[type='text']:-moz-placeholder {
  color: #a1a1a1;
}
.about-page .message textarea::-moz-placeholder,
.about-page .message input[type='text']::-moz-placeholder {
  color: #a1a1a1;
}
.about-page .message textarea:-ms-input-placeholder,
.about-page .message input[type='text']:-ms-input-placeholder {
  color: #a1a1a1;
}
.about-page .message textarea {
  resize: vertical;
  height: 260px;
}
.about-page .message .btn {
  display: inline-block;
  background: #c8161d;
  margin-top: 10px;
}
.about-page .message .btn::after {
  background: #c53b00;
}
.about-page .message button,
.about-page .message input[type='submit'],
.about-page .message input[type='button'] {
  min-width: 158px;
  height: 46px;
  padding: 0 20px;
  font-size: 15px;
  color: #fff;
  background: none;
  cursor: pointer;
}

.row:after {
  content: "";
  height: 0;
  display: block;
  clear: both;
}
.col12,
.col {
  width: 100%;
  float: left;
}
.col1 {
  width: 8.33333333%;
}
.col2 {
  width: 16.66666667%;
}
.col3 {
  width: 25%;
}
.col4 {
  width: 33.33333333%;
}
.col5 {
  width: 41.66666667%;
}
.col6 {
  width: 50%;
}
.col7 {
  width: 58.33333333%;
}
.col8 {
  width: 66.66666667%;
}
.col9 {
  width: 75%;
}
.col10 {
  width: 83.33333333%;
}
.col11 {
  width: 91.66666667%;
}
.l {
  float: left;
}
.r {
  float: right;
}
.white {
  background: #fff;
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
body,
div,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
form,
fieldset,
legend,
button,
input,
textarea,
th,
td,
a,
img {
  margin: 0;
  padding: 0;
  border: none;
}
textarea,
input {
  font-family: "Microsoft YaHei", "Arial", arial;
  color: #333333;
  font-size: 14px;
  padding: 0;
  margin: 0;
  outline: none;
  -webkit-appearance: none;
  display: block;
}
input[type="checkbox"],
input[type="radio"] {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}
select,
input:focus,
textarea:focus {
  outline: none;
}
select::-ms-expand {
  display: none;
}
article,
aside,
dialog,
footer,
header,
section,
footer,
nav,
figure,
menu {
  display: block;
}