#vision5 {padding-top:30px}

#vision5 .img1 {padding-bottom:50px; text-align:center;  }
#vision5 .img1 img {border-radius:100px 0}

#vision5 .flex1{display:flex; flex-wrap: wrap;  justify-content: space-between; margin:30px 0 0px 0; align-items:center  }
#vision5 .flex1 .item{   width:100%; text-align:center }
#vision5 .flex1 .item .tit { font-size:42px;  line-height:54px; margin-bottom:42px}
#vision5 .flex1 .item .txt {font-size:18px; line-height:28px;}

#vision5 .txt1 { font-weight:600; font-size:22px; line-height:35px;  padding-top:10px; }
#vision5 .flex .item{  width:100%; text-align:center  }
#vision5  p {padding-bottom:25px !important; font-size:20px; line-height:32px; }

#vision5 .cont {padding:180px 0 0px 0; position:relative; }
#vision5  .txt3 {margin-top:30px; text-align:center}

#vision5 .cont:before {content:""; width:1px; height:100px; background:#bbb; position:absolute; left:50%; top:35px;   transform:rotate(25deg);}
#vision5 h3 {font-size:45px; line-height:55px; font-weight:700; text-align:center; }
#vision5 h3 strong {font-weight:400}
#vision5 h3 span{position: relative; padding:0 13px; }
#vision5 h3 span:before { content: "";  width: 8px; height: 8px; background-color:#ff4500 ;  position: absolute; 
right: 0; bottom: 8px;   border-radius: 50%;}
#vision5 .mainColor {color:#ff4500; }

#vision5 img {vertical-align:top; max-width:100%;}
#vision5 .flex2{display:flex; flex-wrap: wrap;  justify-content: space-between; align-items: center; padding:50px 0 }
#vision5 .flex2 .item{  width:260px;  text-align:center;}
#vision5 .flex2 .ico {border:1px dashed #888; height:260px; width:260px; margin:0 auto; border-radius:50%; 
background-position:center 22%; background-repeat:no-repeat; background-size:80px; }
#vision5 .flex2 .ico1 {background-image:url(../img/ico1.png);}
#vision5 .flex2 .ico2 {background-image:url(../img/ico2.png);}
#vision5 .flex2 .ico3 {background-image:url(../img/ico3.png);}
#vision5 .flex2 .ico4 {background-image:url(../img/ico4.png);}
#vision5 .flex2 .tit {background-color:#ff4500; border-radius:50px ; color:#fff; padding:7px 7px 8px 7px;  font-size:18px;
width:180px; margin:-135px auto 10px auto; font-weight:500;}
#vision5 .flex2 .txt { font-size:14px; line-height:20px; font-weight:500;}
#vision5 .flex2 .txt2 { font-size:18px; font-weight:500; margin-top:50px;}
#vision5 .flex2 .plus {position:relative}
#vision5 .flex2 .plus:before {display:none; content:""; width:30px; height:30px;  background:url(../img/plus.jpg)no-repeat  center;
position:absolute; top:47%; right:-42px; z-index: 9}

#vision5 .flex5 {display:flex; flex-wrap: wrap;  justify-content: space-between; padding-top:60px; text-align:center }
#vision5 .flex5 .item{  width:25%; position:relative }
#vision5 .flex5 .item .tit {font-size:42px; font-weight:700; padding:40px 0 0px 0;  color:#323d46;}
#vision5 .flex5 .item .tit span{position: relative; padding:5px 0 0 16px;}
#vision5 .flex5 .item:first-child:before {display:none}
#vision5 .flex5 .item:before { content: "";  width: 1px; height: 70px; background-color:#ccc ;  position: absolute; 
left: 0; top: 35px; }
#vision5 .flex5 .item .txt {font-size:18px; font-weight:500; padding:15px 5px;}
#vision5 .flex5 .item .img img{  }


/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1023px) {
#vision5 {padding-top:0px}	
#vision5 .img1 {padding-bottom:30px; text-align:center;  }
#vision5 .img1 img {border-radius: 50px 0 ; }	
#vision5 .img2 .item {margin-right:-15px}
#vision5 .img2 img {border-radius: 0 80px 0 0; margin-left:-30px; }	
	
#vision5 h3 {font-size:25px; line-height:32px }
#vision5 h3 span{ padding:0 12px;}
#vision5 h3 span:before { content: "";  width: 6px; height: 6px;   position: absolute; 
right: 0; bottom: 7px;   border-radius: 50%;}
#vision5  .bgBox {position:relative; padding:50px 0 ; margin-top:50px}
#vision5 .flex1{margin:30px 0 0px 0 }
#vision5 .flex1 .item{   width:100%;  }
#vision5 .flex1 .item .tit { font-size:25px;  line-height:32px; margin:20px 0}
#vision5 .flex1 .item .tit img {height:70px}
#vision5 .txt1 {  font-size:18px; line-height:28px;  padding-top:10px;  }
#vision5 .flex .item{  width:100%; text-align:center  }
#vision5  p {padding-bottom:15px !important; font-size:15px; line-height:25px; }

#vision5 .mainColor { font-size:18px; }

#vision5 .cont {padding-top:130px; position:relative}
#vision5 .cont:before { height:60px;  top:35px;   transform:rotate(25deg);}
#vision5  .txt3 {margin-top:20px; text-align:center}

#vision5 .flex2{display:flex; flex-wrap: wrap;  justify-content: space-between; align-items: start; padding:30px 0 0 0; }
#vision5 .flex2 .item{  width:48%; margin-bottom:30px;  text-align:center;}
#vision5 .flex2 .ico {border:1px dashed #aaa; height:190px; width:100%; border-radius:10%; background-position:center 15px; background-size:70px }
#vision5 .flex2 .tit {border-radius:50px ; color:#fff; padding:5px;  font-size:14px;
width:80%; margin:-95px auto 10px auto; font-weight:500; line-height:20px;}
#vision5 .flex2 .txt { font-size:13px; font-weight:500 ; line-height:16px;}
#vision5 .flex2 .txt2 { font-size:15px;  font-weight:500; margin-top:30px;}
#vision5 .flex2 .plus:before {display:none;}

#vision5 .tit1 {font-size:16px; text-align:center;  padding:10px; 0}
#vision5  .flex3 {  margin-top:10px; flex-direction: column;}
#vision5  .flex3 .item {width:100%; font-size:20px;padding:20px 10px; border-radius:20px; margin-top:1px }
#vision5 .flex3 .item span {display:block; font-size:15px;   padding-top:10px;}


#vision5 .flex5 { gap:0px; padding-top:20px;  }
#vision5 .flex5 .item{  width:50%;  margin-bottom:30px; padding:20px}
#vision5 .flex5 .item .tit {font-size:22px; font-weight:700; padding:20px 0 0px 0;  color:#323d46;}
#vision5 .flex5 .item .tit span{position: relative; padding:5px 0 0 16px;}
#vision5 .flex5 .item .tit span:before { content: "";  width: 10px; height: 10px; background-color:#ff4500 ;  position: absolute; 
left: 0; top: 1px;   border-radius: 50%;}
#vision5 .flex5 .item .txt {font-size:14px;  padding:5px 0px;}
#vision5 .flex5 .item:before {content: "";  width: 1px; height: 120px; background-color:#bbb ;  position: absolute; 
left: 0; top: 5px;  }
#vision5 .flex5 .item:after {content: "";  width: 130px; height: 1px; background-color:#bbb ;  position: absolute; 
left: 50%; top: 0px; transform:translate(-50%,-10px);  }
#vision5 .flex5 .item:nth-child(odd):before,
#vision5 .flex5 .item:first-child:after,#vision5 .flex5 .item:first-child+.item:after {display:none}

@media (max-width: 768px) {
}
@media (max-width: 640px) {
#vision5 .flex5 .item  img {height:80px}	
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {
}

