@font-face { font-family: 'siyuansongti'; src: url('./font/siyuansongti.ttf') }
  @font-face { font-family: 'siyuansongtizt'; src: url('./font/siyuansongtizt.ttf') }
html, body, div, span, applet, object, iframe, h1, h2, h3,
h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address,
big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot,
thead, tr, th, td, input, select {margin:0; padding:0; border:0 none; outline:0; color:inherit;}
html, body {width:100%; height:100%;color: #333333; ;}
body {margin:0 auto;  font-family: 'siyuansongti'; src: url('./font/siyuansongti.ttf'); vertical-align:baseline; overflow-y:scroll;}
h1 {font-weight:bold; font-size:18px; line-height:18px; color:#474545;}
h3 {font-weight:normal; font-size:12px; color:#746969;}
h2, h4, h5, h6 {font-weight:normal; font-size:100%;}
table {border-collapse:separate; border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
a {text-decoration:none;}
p {line-height:22px; text-align:justify;}
a img, iframe {border:none; vertical-align: top;}
:focus {outline:0;}
/*img{ vertical-align:top;}*/
ol, ul {list-style:none;}
input, textarea, select, button {font-weight:inherit; font-size:inherit; *font-size:100%; font-family:inherit;}
/* == clearfix == */
.clearfix:after {display:block; height:0; clear:both; content:"\200B";}
.clearfix {*zoom:1;}/*IE/7/6*/

/* == 以上 reset Css == */


/**************** 全局公用样式 ****************/
/*body {max-width:1580px; min-width:1130px;_width:expression(document.body.clientWidth<1130? "1130px": (document.body.clientWidth>1580?"1580px":"auto"));}*/
body {max-width:1920px; min-width:1130px; +overflow:hidden;}
 div{-webkit-tap-highlight-color:rgba(0,0,0,0); }
/*body.on {margin-left:-378px;}*/
.g-wrap {position:relative; margin:0 auto; width:1440px; height:100%; overflow:hidden;}
.g-wrap3{position:relative; margin:0 auto; width:1440px; height:100%; overflow:hidden;}
.g-wrap1 {position:relative; margin:0 auto; width:1440px; height:100%}
.g-wrap2{position:relative; margin:0 auto; width:1440px; height:100%}
#header {position:relative; z-index:999999999; height:120px; background-color:#ffffff; }
	#logo2 {position:absolute; top:25px; left:90px; width:410px;  background-size: contain;}
    #logo {position:absolute; left:0px; top: 0; }
	#logoline{position:absolute; bottom:0px; left:0px;  height:78px; background:#017A97; right: 0; width: 100%;}
    #nav {position:absolute; width:860px; z-index:4;  color:#333333; height: 78px; margin: 0 auto; display: flex; justify-content: space-between;top: 16px; left: 250px;}
	#nav ul{ display: flex; justify-content: space-between;}
    #nav li {float:left; height:100%; -webkit-transition:background-color 700ms; transition:background-color 700ms;}
    #nav .n1 {width:80px; }
    #nav .n2, #nav .n3, #nav .n6, #nav .n7, #nav .n8 {width:80px;}
    #nav .n4 {width:80px;}
	#nav .n44 {width:80px;}
	#nav .n5 {width:80px;}
	
	 #nav h3{color: #fff; margin-top: 30px; font-size: 15px;}
	
	.top_tel dl{display: flex; }
	.top_tel dl dd p{font-size: 18px;}
	.top_tel dl dd h2{font-size: 20px;}
	
	
	
	#logo dl dt{ float:left; }
	#logo dl dd{float:left;}
   #content img{vertical-align: bottom;}
.dhtop{ position: absolute; right: 0px;}
    #nav li a {position:relative; z-index:2; display:block; width:100%; height:100%; font-size:20px; line-height:75px; text-align:center;  -webkit-transition:color 200ms; transition:color 200ms; color: #333333;}
#nav li a.on,#nav li a:hover{ color: #B92C25;}
#nav li a.on p,#nav li a:hover p{ color: #B92C25;}
    #nav li a span {position:absolute; left:0; top:0; z-index:2; width:100%; height:100%; }
	 #nav li  p{text-align: center;font-size: 12px;
color: #666666;}
    #nav li a .bkg {top:100%; z-index:1;  height: 3px;}
 #nav li a .bkg{width: 0;top: 80px;}
    #nav li a.on .bkg,
    #nav li a:hover .bkg {width: 75px;
height: 4px;
background: #B92C25;margin: 0 auto; left: 0; right: 0;  position: absolute; top: 80px; transition: all 0.56s ease-in-out;}
	
	.dhtop   dt h2{font-size: 18px; color: #2EAE9F;}
	.dhtop   dt p{font-size: 32px; color: #333333;  font-style: italic; margin-top: 5px;}

.topnav{display: flex; justify-content: space-between;}

.top_tel{position: absolute; right: 0; top: 25px; width:230px; line-height: 38px; border-radius: 50px;text-align: center; font-size: 18px;}
.top_tel img{vertical-align: middle; padding-right: 10px; margin-top:3px;}



.dhtop dl{display: flex; justify-content: left; margin-top: 18px;}
.dhtop dl dt{margin-right: 10px; margin-top: 8px;}
.dhtop dl dd p{font-size: 18px;color: #333333;}
.dhtop dl dd h2{font-size: 26px;color: #333333; font-weight: bold;}

#logo dl{display: flex; justify-content: left; flex-wrap: wrap;}
#logo dl dt{width: 100%; font-size: 22px; color: #666666;}
#logo dl dd{width: 100%; display: none;}
#logo dl dt img{padding-right: 20px; vertical-align: middle;}
#logo dl dt span{display: none;}




#content .q1{width: 80px; height: 80px; right: 0; opacity: 0; top: 50%;}
#content:hover .q1{ opacity: 1; transition: all 0.56s ease-in-out; right: 5%;}	
#content .q2{width: 80px; height: 80px; left: 0; opacity: 0; top: 50%;}
#content:hover .q2{ opacity: 1; transition: all 0.56s ease-in-out; left: 5%;}  
  
  
  #content .swiper-pagination {
      position: absolute;
      bottom: 30px;
      left: 0;
      width: 100%;
      height: 15px;
      display: flex;
      align-items: center;
      justify-content: center;
  }
  #content .swiper-pagination .swiper-pagination-bullet {
      position: relative;
      margin: 0 6px; width: 15px; background: unset;
      height: 15px;
      cursor: pointer;
  }
  #content .swiper-pagination .swiper-pagination-bullet svg {
      display: block;
      width: 25px;
      height: 25px;
      position: relative;
      z-index: 5;
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      -o-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
  }
  #content .swiper-pagination .swiper-pagination-bullet svg circle {
      stroke-width: 2px;
      stroke: #B92C25;
      stroke-dasharray: 300%;
      stroke-dashoffset: 300%;
      transition: stroke-dashoffset 0.6s ease-out;
      -webkit-transition: stroke-dashoffset 0.6s ease-out;
      -moz-transition: stroke-dashoffset 0.6s ease-out;
      -o-transition: stroke-dashoffset 0.6s ease-out;
      -ms-transition: stroke-dashoffset 0.6s ease-out;
  }
  #content .swiper-pagination .swiper-pagination-bullet span {
      position: absolute;
      z-index: 4;
      top: 4px;
      left: 1px;
      width: 17px;
      height: 17px;
      border: 2px solid unset;
      border-radius: 50%;
      transition: border-color 0.3s ease-out;
      -webkit-transition: border-color 0.3s ease-out;
      -moz-transition: border-color 0.3s ease-out;
      -o-transition: border-color 0.3s ease-out;
      -ms-transition: border-color 0.3s ease-out;
  }
  #content .swiper-pagination .swiper-pagination-bullet span:after {
      content: "";
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background-color: #999999;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
  }
  #content .swiper-pagination .swiper-pagination-bullet-active span:after{
	 background-color: #B92C25; 
  }
    #content .swiper-pagination .swiper-pagination-bullet{ background: unset!important;}
  #content .swiper-pagination .swiper-pagination-bullet-active svg circle {
      stroke-dashoffset: 0;
      animation: movedong 4s ease-out,moveshou 1s ease-out 4s;
  }
  @keyframes movedong {
      0%{
          stroke-dashoffset: 300%;
      }   
      100%{
          stroke-dashoffset: 0;
      } 
  }
  @keyframes moveshou{
      0%{
          stroke-dashoffset: 0;
      }   
      100%{
          stroke-dashoffset: 300%;
      } 
  }