@charset "utf-8";
/* CSS Document */

/*banner*/
#i_banner { position: relative; z-index: 0;}
#i_banner .swiper-slide { position: relative; z-index: 0;}
#i_banner .pic { position: relative; z-index: 0; padding-top:31.2%;}
#i_banner .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}
#i_banner .swiper-slide-active  .txtb .txt {
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
transform: translate(0,0);
-ms-transform: translate(0,0);
-webkit-transform: translate(0,0);}

#i_banner .swiper-pagination { bottom: 1.5em; }
#i_banner .swiper-pagination-bullet { width: 0.5em; height: 0.5em;
 background-color: #3FA9F5; margin: 0 0.4em;
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
border: 1px solid #3FA9F5;
-moz-border-radius:0.5em; -webkit-border-radius:0.5em; border-radius:0.5em;
}
#i_banner .swiper-pagination-bullet-active {
width: 1.75em;
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
background-color:#3FA9F5; 
}


#i_banner .btnPrev { left: 5.2%; right: auto;
transform: rotate(180deg);
-ms-transform: rotate(180deg); 
-webkit-transform: rotate(180deg); 
}
#i_banner .btnNext:hover,
#i_banner .btnPrev:hover {
	background-color: #008cd6;
}

#i_banner  .swiper-button-disabled,
#i_banner  .swiper-button-disabled:hover{  background: transparent;
filter:alpha(opacity=50);-moz-opacity:0.5; opacity:0.5;}

#i_banner .num { position: absolute; z-index: 1000; left: 9.3%; color: #fff;bottom: 2.6em;}
#i_banner .num span.cur { font-size: 1.5em;}

 @media only screen and (max-width:828px) { 
#i_banner .con { width:  90vw; margin: 0 5vw;}
#i_banner .pic { position: relative; z-index: 0; padding-top: 80%;}
#i_banner .swiper-pagination { font-size: 2vw;}
#i_banner .swiper-pagination-bullet { width: 6px; height: 6px;}
}



.contBox { padding: 7.5em 0; background-color: #fafafa; color: #1B1B1B;}
.contBox .con { display: flex; justify-content: space-between; align-items: center;}
.contBox .txtb { margin: 0 auto 0 0; width: 43.2%;text-align: left;}
.contBox .txtb .tit { font-weight: bold; line-height: 1.1; }
.contBox .txtb .tit span { color: #3FA9F5;}
.contBox .txtb .list { margin-top: 3em;}
.contBox .txtb .list li { margin-top: 1.5em; line-height: 1.87em;
	display: flex; justify-content: flex-start; align-items: flex-start;}
.contBox .txtb .list li img { margin-right: 2em; display: block; width: 1.87em; height: 1.87em;}

.contBox .form {  width: 50%; background-color: #fff;
display: flex; flex-wrap: wrap; 
justify-content: space-between; align-items: flex-start;}
.contBox .form form { padding: 6.3% 5.5%;
 display: flex; flex-wrap: wrap;
 justify-content: space-between; align-items: flex-start;width:100%;}

.contBox .form dl { margin-top: 1.5em; width: 49.1%; 
display: flex; justify-content: flex-start; align-items: center;
border-bottom: 1px solid #dcdfe6;}
.contBox .form dl:first-child { margin-top: 0;}
.contBox .form dl dt { margin-left: 1.6em; margin-right: 0; }
.contBox .form dl dd { flex: 1;}
.contBox .form dl.dl2 { width: 100%;}
.contBox .form dl.dl3 { width: 100%; align-items: flex-start; }
.contBox .form dl .iW { padding: 0 1em;}
.contBox .form dl .input { width: 100%; border: 0;
 outline-width: 0; line-height: 5em; height: 5em;
 font-size: 1em; background-color: transparent;}
.contBox .form dl .tW {padding: 0 1em;} 
.contBox .form dl .textarea { display: block; width: 100%;
  border: 0; outline-width: 0; line-height: 1.2em; height:5.1em;
  font-size: 1em; background-color: transparent; }
  
.contBox textarea::-webkit-input-placeholder,
.contBox input::-webkit-input-placeholder{	color: #999;}
.contBox textarea::-moz-placeholder,
.contBox input::-moz-placeholder{	color: #999;}
.contBox textarea:-ms-input-placeholder,
.contBox input:-ms-input-placeholder{	color: #999;}



@media only screen and (max-width:828px) {
	.contBox .con { display: block;}
	.contBox .form { margin-top: 2em; display: block; width: 100%;}
	.contBox .form form { display: block; width:auto;}
	.contBox .txtb {  width: 100%; }
	.contBox .form dl { width: 100%;}
	
}


.proBox .list{ }
.proBox .list ul {display: flex; justify-content: flex-start; align-items: stretch;
flex-wrap: wrap; margin-bottom: -1.25em;}
.proBox .list li { margin-bottom: 1.25em; position: relative; z-index: 0; width: 50%; background-color: #eff3f4;}
.proBox .list li:nth-child(2n) { background-color: #eff3f4;}
.proBox .list li .pic {position: absolute; z-index: 0; left: 0; top: 0; width: 100%; height: 100%;
object-fit: cover;}
.proBox .list li .pic img {position: absolute; z-index: 0; left: 0; top: 0; width: 100%; height: 100%;
object-fit: contain; object-position: right bottom;}
.proBox .list li .txtb {color:#000; text-align: left; position: relative; z-index: 1; padding: 12.5% 34.3% 20.8% 18%;}
.proBox .list li .txtb .name { font-weight: bold; color:#000; line-height: 1.2;}
.proBox .list li .txtb .intro { margin-top: 1em; line-height: 1.4em;}

@media only screen and (max-width:828px) {
	.proBox .list li { width: 100%; }
}