@charset "UTF-8";

.er-banner .page-title {
  color: #332c2b;
}



/* pro-sec01 */
.pro-sec01 {
  position: relative;
}
.pro-sec01 .imgbg {
  position: absolute;
  left: 0px;
  top:0px;
  bottom: 0px;
  width: 15.833%;
}
.pro-sec01 .bg_container {
  height: 100%;
}
.pro-sec01 .page-content {
  position: relative;
  z-index: 2;
}
.pro-sec01 .page-text {
  width: 48%;
  padding:0.71rem 0px 1.21rem;
  flex:none;
}
.pro-sec01 .page-text .page-con {
  background: #f7b228;
  padding:0.7rem 0.56rem 0.8rem;
  line-height: 1.8181;
  color: #fff;
  height: 100%;
}
.pro-sec01 .page-img {
  width: 54.95%;
  position: relative;
  right: -3.03%;
  padding: 0.76rem 0px 1.47rem;
  flex:none;
}
.pro-sec01 .page-img .bg_container {
  position: absolute;
  top:0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-size: 100% auto;
}
.pro-sec01 .page-img ul {
  padding-right: 42.15%;
  position: relative;
  z-index: 2;
  width: 100%;
}
.pro-sec01 .page-img ul li {
  padding: 0.16rem 0px;
  letter-spacing: 0.1em;
  line-height: 1.5;
  position: relative;
  transform: scale(1,1);
}
.pro-sec01 .page-img .page-ico img {
  width: 1.42rem;
}
.pro-sec01 .page-img ul li:nth-child(2) {
  padding-right:0.6rem;
}
.pro-sec01 .page-img ul li:hover {
  transform: scale(1.02,1.02);

}


@media only screen and (max-width:1740px){
  .pro-sec01 .page-img {
    width: 56%;
  }
  .pro-sec01 .page-img ul li:nth-child(2) {
    padding-right:0.7rem;
  }  
  .pro-sec01 .page-img ul li:nth-child(3) {
    padding-right:0.1rem;
  }
}  
@media only screen and (max-width:1640px){
  .pro-sec01 .page-img {
    width: 57%;
  }
}
@media only screen and (max-width:1440px){
  .pro-sec01 .page-img {
    width: 62%;
  }
  .pro-sec01 .page-img ul {
    padding-right: 44%;
  }
}
@media only screen and (max-width:1240px){
  .pro-sec01 .page-img {
    width: 68%;
  }
  .pro-sec01 .page-text {
    width: 40%;
  }
  .pro-sec01 .page-img ul {
    padding-right: 45%;
  }
}
@media only screen and (max-width:1140px){
  .pro-sec01 .page-content {
    -webkit-flex-wrap: wrap; flex-wrap:wrap;
  }
  .pro-sec01 .page-img {
    width: 100%;
    right: 0px;
    padding: 0px 0px 0.7rem;
  }
  .pro-sec01 .page-text {
    width: 100%;
    padding-bottom: 0.7rem;
  }
  .pro-sec01 .page-img ul {
    padding-right: 22%;
    padding-left: 10%;
  }
  .pro-sec01 .page-img .bg_container {
    background-size: auto 100%;
    background-position: right center;
  }
  .pro-sec01 .page-img ul li:nth-child(2) {
    padding-right:0px;
  }  
  .pro-sec01 .page-img ul li:nth-child(3) {
    padding-right:0px;
  }
  
}

@media only screen and (max-width:767px){
  .pro-sec01 .page-img .bg_container {
    background-size:100%  auto;
    display: none;
  }
  .pro-sec01 .page-img ul {
    padding-right:0px;
    padding-left: 16%;
  }
} 

/* pro-sec02 */
.pro-sec02 {
  padding: 0.74rem 0px 1.02rem;
}
.pro-sec02 .page-list {
  margin: 0px -0.28rem;
  padding-top: 0.11rem;
}
.pro-sec02 .page-list .page-item {
  width: 33.33%;
  padding: 0.6rem 0.28rem 0px;
}
.pro-sec02 .page-con {
  background: rgba(255,255,255,0.39);
  padding: 0.33rem 0px 0.5rem;
  height: 100%;
}
.pro-sec02 .page-img {
  height: 3.5rem;
}
.pro-sec02 .page-img img {
  max-height: 88%;
  max-width: 88%;
  transform: scale(1,1);
}
.pro-sec02 .page-tit {
  padding-top: 0.12rem;
}
.pro-sec02 .page-tit span {
  position: relative;
  padding: 0px 0.1rem;
}
.pro-sec02 .page-tit span:before {
  position: absolute;
  content: "";
  height: 0.2727em;
  background: #f3c16c;
  left: 0px;
  bottom: 0px;
  width: 100%;
}
.pro-sec02 .page-tit span i {
  position: relative;
  z-index: 2;
}
.pro-sec02 a:hover .page-img img {
  transform: scale(1.05,1.05);
}

@media only screen and (max-width:1020px){
  .pro-sec02 .page-list .page-item {
    width: 48.75%;
  }
}
@media only screen and (max-width:767px){
  .pro-sec02 .page-list .page-item {
    width:100%;
  }
} 

/* pro-sec03 */
.pro-sec03 {
  padding: 0.85rem 0px;
}
.pro-sec03 .page-title {
  padding: 0px 0.1rem;
}
.pro-sec03 .page-list ul {
  column-count: 2;
  column-gap:3rem;
  padding-top: 0.03rem;
  min-width:3rem;
  padding-right:0.5rem;
}
.pro-sec03 ul li {
  padding-top: 0.71rem;
  padding-left: 0.16rem;
  break-inside:avoid;
}
.pro-sec03 dl dt {
  padding-left: 0.32rem;
  position: relative;
}
.pro-sec03 dl dt:before {
  position: absolute;
  top:50%;
  margin-top: -0.078125em;
  content: "";
  left: 0px;
  width:0.4375em;
  height:0.15625em;
  background: #f5b13b;
}
.pro-sec03 dl dt {
  margin-bottom: 0.24rem;
}
.pro-sec03 dl  a {
  display: inline-block;
  padding-right: 0.4rem;
  position: relative;
  background: url(../images/jt10.png) no-repeat right 55%/9px auto;
}
.pro-sec03 dl dd {
  padding: 0.09rem 0px 0.09rem 0.32rem;
}
.pro-sec03 dl dd a {
  color: #625d5d;
}
.pro-sec03 dl dd a:hover {
  color: #f5b13b;
  text-shadow: 1px 1px #f5b13b;
  background: url(../images/jt11.png) no-repeat right 55%/9px auto;
}
.pro-sec03 dl dt a {
  background: url(../images/jt12.png) no-repeat right  55%/9px auto;
}
.pro-sec03 dl dt a:hover {
  background: url(../images/jt11.png) no-repeat right  55%/9px auto;
}

.pro-sec03 .page-folder span{
  position: relative;
  display: block;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  border: 1px solid #332c2b;
  line-height: 1;
  cursor: pointer;
}
.pro-sec03 .page-folder span::before {
  position: absolute;
  content: "";
  left: 50%;
  top:50%;
  width: 0.5em;
  height: 2px;
  background: #332c2b;
  transform: translate(-50%,-50%);
}
.pro-sec03 .page-folder span::after {
  position: absolute;
  content: "";
  left: 50%;
  top:50%;
  height: 0.5em;
  width: 2px;
  background: #332c2b;
  transform: translate(-50%,-50%);
  display: none;
}
.pro-sec03 .page-folder.on span::after {
  display: block;
}

@media only screen and (max-width:1340px){
  .pro-sec03 .page-list ul { 
    padding-right: 0px;
    column-gap:1rem;
  }
}
@media only screen and (max-width:1020px){
  .pro-sec03 .page-list ul {
    column-gap:0rem;
  }
  .pro-sec03 dl  a {
    background-size:7px auto;
  }
  .pro-sec03 dl dd a:hover {
    background-size:7px auto;
  }
  .pro-sec03 dl dt a {
    background-size:7px auto;
  }
  .pro-sec03 dl dt a:hover {
    background-size:7px auto;
  }
}
@media only screen and (max-width:767px){
  .pro-sec03 .page-list ul {
    column-count:1;
    column-gap:0.5rem;
  }
}