@charset "utf-8";
/* CSS Document */
fieldset,img { border: 0; }
address,caption,cite,code,dfn,em,strong,th,var,i { font-weight: normal; font-style: normal; }
*:focus { outline: none; }/*去掉获得焦点时的带颜色边框*/
textarea {resize:none;}
ul li{list-style-type: none;}
.opac{filter:alpha(opacity=80);opacity:.8;-moz-opacity:.8;}
.radi{-ms-border-radius: 8px;-o-border-radius: 8px;-moz-border-radius: 8px;-webkit-border-radius: 8px;border-radius: 8px;}
pre{white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word;}
.yy{text-shadow:3px -3px 10px #000;}
/*-- All --*/
body {word-spacing: 1px;letter-spacing: 1px;padding: 0;margin: 0;padding-top:110px; background-blend-mode: overlay;background-image: url(static/img/001.jpg), linear-gradient(90deg, #1f81ca 1%, #004e8d 100%) !important;background-repeat: no-repeat;background-position: center center;background-attachment:fixed;background-size:cover;background-color: inherit !important;}
a{text-decoration: none;}
a:link {text-decoration: none;color:var(--blue);}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;color:var(--blue-0);}
a:active {text-decoration: none;}
a.btn{margin-left: 5px;margin-top:8px;}
.padLR15 {padding：1px 15px;}
.padTB15 {padding:15px auto 15px auto;}
.marTB15 {margin:15px auto 15px auto;}
.flagax{float: left;margin:25px;}
.trs .row{margin:50px auto 20px;}
.Btom{/*border-bottom: 2px solid var(--green-6);*/}

#contact{margin:0 auto 10px auto;color:var(--white);}

/*home*/
#home{width:100%;color:var(--green-6);min-height:100vh;}
#home .h1{line-height:180%;font-size:18px;}
#home .h4{font-size:38px;font-weight:400;line-height:150%;}

#case{background-color:var(--white);}
#home .row{margin:0 auto;}
#service,#mymail{background-color:var(--white);color: var(--black);display:block;padding-top:1px;padding-bottom:10px;}
#myemail,#contacts{background-color:#000000;color: var(--white);}
#eumail{background-color:var(--blue);color: var(--white);}
#myemail i,#mymail i{color:var(--blue);}
#myemail h1{font-weight:900;}
#myemail p,#help p,{line-height:180%;font-size:15px;}
#help{background-color:var(--blue);color: var(--green-6);background-image: url(static/img/bg.svg);background-repeat: no-repeat;background-position: center center;background-attachment:fixed;background-size:cover;}
/*没用*/
button.mywc:before {
  content: "";
  position: absolute;
  z-index: -10;
  bottom: 0px;
  left: 0px;top:0px;
  width: 0;
  height: auto;
  background-color:var(--white);color:var(--primary);
  transition: all 0.5s ease-in-out;
}
button.mywc:hover:before {width: 100%;}

/*Grid*/
.grid-main{margin: 1.5rem auto; padding: 0 1rem;}
.grid {
            display: grid;
            grid-template-columns: repeat(1, 100%); /*repeat(1, 1fr);*/
            gap: 0.8rem;justify-content:stretch; align-content:stretch; 
        }
.grid-card {
            background-color: var(--white);word-wrap: break-word;word-break: normal;/*导致异常 white-space: pre-wrap;*/
            border-radius: 1rem;
            padding: 0rem;
            transition: all 0.5s ease;
            border: 1px solid var(--ccc);
            display: flex;
            flex-direction: column;position: relative;
        }

		
		.thumbnail{border:none;margin-bottom: 5px;background-color: transparent;padding:0;}
		.thumbnail .caption p{color:var(--gray-dark);font-size:16px;}
		.thumbnail .caption h4{color:var(--blue-0);margin: 18px auto;font-size: 20px;}
		.grid-card .thumbnail	img{/*border-top-left-radius: 1.0rem;border-top-right-radius: 1.0rem;z-index:5;position: relative;*/}
		
		.grid-card .thumbnail .flag{background-repeat: no-repeat;background-position: center center;background-size:cover;min-height:250px;}
        
		.grid-card .panel:hover {box-shadow: 5px 5px 10px var(--green-5), -5px -5px 10px var(--green-5); }
		.grid-card .panel{margin-bottom: 1px; transition: all 0.3s ease;}
	@media (min-width: 640px) {
            .grid { grid-template-columns: repeat(2, 50%); }
        }
        @media (min-width: 1024px) {
            .grid { grid-template-columns: repeat(4, 25%); }
        }
/*返回顶部 2025*/
.flash-icon, .flash-icon:before,.flash-icon:after{height: 50px;width: 50px; border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;}
.flash-icon:before,.flash-icon:after{top:0px;left:0px;right:0;bottom:0;position: absolute;content: "";border: 2px solid var(--blue);}
.flash-icon {position:relative;background-color: var(--blue);z-index: 2; display: block; margin:30px auto 28px auto;font-size:35px;color:var(--white);line-height:200%;transition: all 0.8s ease 0s;}
.flash-icon:hover{color:var(--blue);background-color:var(--white);transition: all 0.8s ease 0s;}
.flash-icon:before {animation-name: blink-a;animation-duration: 2s;animation-iteration-count: infinite;}
.flash-icon:after {animation-name: blink-a;animation-duration: 2s;animation-delay: 1s;animation-iteration-count: infinite;}
@keyframes blink-a {
	0%   {transform: scale(1, 1);}
	100%  {transform: scale(2, 2); opacity: 0;}
}
        
/* ------------------------------------------------------------------------------
	Header
-------------------------------------------------------------------------------*/
#header {
	position: fixed;top:0;
	width: 100%;
	z-index: 999;
	background-color: var(--blue-0);
}
#header .header-content {
	margin: 0 auto;
	max-width: 1170px;
	padding: 40px 0;
	width: 100%;
	-moz-transition: padding 0.5s;
	-o-transition: padding 0.5s;
	-webkit-transition: padding 0.5s;
	transition: padding 0.5s;
}
#header .logo {
	float: left;
	font-size: 28px;
	font-weight: bolder;
	color: var(--green-5);
	text-decoration:none;
	text-transform:uppercase;
	letter-spacing: 3px;
	margin-top: -10px;
}
#header.fixed {
	background-color: var(--blue-0);position: fixed;
}
#header.fixed a {
	/*color: var(--light); */
}
#header.fixed .header-content {
	border-bottom: 0;
	padding: 25px 0;
}
#header.fixed .nav-toggle {
	top: 18px;
	color: #000;
}
.navigation.open {
	opacity: 0.9;
	visibility: visible;
	-moz-transition: opacity 0.5s;
	-o-transition: opacity 0.5s;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}
.navigation {
	float: right;
}
.navigation li {
	display: inline-block;
}
.navigation a {
	color:  var(--light); 
	font-size: 14px;
	font-weight: 700;
	margin-left: 40px;
	text-transform: uppercase;
}
.navigation a.active {color: var(--blue);}
.navigation a:hover {color: var(--blue);}
.nav-toggle {
	display: none;
	height: 44px;
	overflow: hidden;
	position: fixed;
	right: 5%;
	text-indent: 100%;
	top: 32px;
	white-space: nowrap;
	width: 44px;
	z-index: 99999;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	background: transparent;
}
.nav-toggle:before, .nav-toggle:after {
	border-radius: 50%;
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-moz-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-webkit-transition-property: -webkit-transform;
	transition-property: transform;
}
.nav-toggle:before {
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-webkit-transform: scale(1);
	transform: scale(1);
	-moz-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	color: #f05da3;
}
.nav-toggle:after {
	background-color: transparent;
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-webkit-transform: scale(0);
	transform: scale(0);
	-moz-transition-duration: 0s;
	-o-transition-duration: 0s;
	-webkit-transition-duration: 0s;
	transition-duration: 0s;
	color: #f05da3;
}
.nav-toggle span {
	bottom: auto;
	display: inline-block;
	height: 3px;
	left: 50%;
	position: absolute;
	right: auto;
	top: 50%;
	width: 18px;
	z-index: 10;
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}
.nav-toggle span:before, .nav-toggle span:after {
	background-color: #fff;
	content: "";
	height: 100%;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-moz-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-transition: -moz-transform 0.3s;
	-o-transition: -o-transform 0.3s;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
}
.nav-toggle span:before {
	-moz-transform: translateY(-6px) rotate(0deg);
	-ms-transform: translateY(-6px) rotate(0deg);
	-webkit-transform: translateY(-6px) rotate(0deg);
	transform: translateY(-6px) rotate(0deg);
}
.nav-toggle span:after {
	-moz-transform: translateY(6px) rotate(0deg);
	-ms-transform: translateY(6px) rotate(0deg);
	-webkit-transform: translateY(6px) rotate(0deg);
	transform: translateY(6px) rotate(0deg);
}
.nav-toggle.close-nav:before {
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-webkit-transform: scale(0);
	transform: scale(0);
}
.nav-toggle.close-nav:after {
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-webkit-transform: scale(1);
	transform: scale(1);
}
.nav-toggle.close-nav span {
	background-color: rgba(255, 255, 255, 0);
}
.nav-toggle.close-nav span:before, .nav-toggle.close-nav span:after {
	background-color: #fff;
}
.nav-toggle.close-nav span:before {
	-moz-transform: translateY(0) rotate(45deg);
	-ms-transform: translateY(0) rotate(45deg);
	-webkit-transform: translateY(0) rotate(45deg);
	transform: translateY(0) rotate(45deg);
}
.nav-toggle.close-nav span:after {
	-moz-transform: translateY(0) rotate(-45deg);
	-ms-transform: translateY(0) rotate(-45deg);
	-webkit-transform: translateY(0) rotate(-45deg);
	transform: translateY(0) rotate(-45deg);
}

@media screen and (max-width: 1024px) {
 #header .header-content {
 width: 90%;
 padding: 40px 0;
}
 #header.fixed a:active{
 color: var(--primary);
}
 .nav-toggle {
 display: block;
}
 .navigation {
 position: fixed;
 background-color: #313131;
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
 z-index: 99999;
 visibility: hidden;
 opacity: 0;
 -webkit-transition: opacity 0.5s, visibility 0s 0.5s;
 transition: opacity 0.5s, visibility 0s 0.5s;
}
 .navigation .primary-nav {
 position: relative;
 top: 45%;
 -moz-transform: translateY(-45%);
 -ms-transform: translateY(-45%);
 -webkit-transform: translateY(-45%);
 transform: translateY(-45%);
}
 .navigation li {
 display: block;
 margin-bottom: 1px;
}
 .navigation a {
 display: block;
 font-size: 18px;
 margin: 0;
 text-align: center;
 padding: 12px 0;
 color: #fff;
}
 
 .flex-control-nav {
 bottom: 20px;
}
}
@media screen and (max-width: 768px) { 
#header.fixed a {
   /* color: #fff;*/
}
#header.fixed a.logo{
	 color: #fff;
}
}
@media screen and (max-width: 640px) {
 .banner-text {
 padding-top: 57%;
}
 .testimonials p {
 font-size: 12px;
}}


/* ----------------------------------------------
 * Generated by Animista on 2025-3-30
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-bottom
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

.slide-in-bottom {
	-webkit-animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s ;
	        animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s ;
}
.slide-in-bottom-1 {
	-webkit-animation: slide-in-bottom 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s ;
	        animation: slide-in-bottom 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s ;
}.slide-in-bottom-2 {
	-webkit-animation: slide-in-bottom 2.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s ;
	        animation: slide-in-bottom 2.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s ;
}
.slide-in-bottom-3 {
	-webkit-animation: slide-in-bottom 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s ;
	        animation: slide-in-bottom 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s ;
}

@-webkit-keyframes slide-in-blurred-top {
  0% {
    -webkit-transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
            transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    -webkit-transform-origin: 50% 0%;
            transform-origin: 50% 0%;
    -webkit-filter: blur(40px);
            filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
            transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
}
@keyframes slide-in-blurred-top {
  0% {
    -webkit-transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
            transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    -webkit-transform-origin: 50% 0%;
            transform-origin: 50% 0%;
    -webkit-filter: blur(40px);
            filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
            transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
}

.slide-in-blurred-top {
	-webkit-animation: slide-in-blurred-top 0.2s cubic-bezier(0.230, 1.000, 0.320, 1.000) ;
	        animation: slide-in-blurred-top 0.2s cubic-bezier(0.230, 1.000, 0.320, 1.000) ;
}

@-webkit-keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0.1;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 0.9;
  }
}
.slide-in-top {
	-webkit-animation: slide-in-top 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-top 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}