@charset "utf-8";
/* CSS Document */

/*banner*/
.i_banner_h { position: relative; z-index: 0; height: calc(100vh - 5em);}
.i_banner { width: 100%; height: calc(100vh - 5em); position: fixed; z-index: 1; top: 5em; left: 0;
background-color: #f4f4f4;}
.i_banner .videoBox video { position: absolute; z-index: 0; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.i_banner .con { position: relative; z-index: 2;  height: 100%; display: flex; justify-content: space-between; align-items: center;}
.i_banner .con .txtb {width: 60%; text-align: left;}
.i_banner .con .txtb .name { font-weight: bold;color: #fff;}
.i_banner .con .txtb .intro { margin-top: 0.4em;color: #fff;}
@media only screen and (max-width:828px) {
	.i_banner_h {  height: calc(100vh - 3.3em);}
	.i_banner {height: calc(100vh - 3.3em);  top: 3.3em; }
	.i_banner .con .txtb {width: 100%;} 
}

/*外贸服务*/
.wmfwBoxW { position: relative; z-index: 0; }
.wmfwBox { max-width: 1920px; margin: 0 auto; height: 57.5em; position: relative; z-index: 0;}
.wmfwBoxFixed { position: fixed; left: 50%; margin-left: -960px; top: 5em; height: 57.5em; width: 100%;}
.wmfwBoxBot { position: absolute; bottom: 0; top: auto; left: 50%; margin-left: -960px;}
@media only screen and (max-width:1920px) {
	.wmfwBoxFixed { left: 0;margin-left: 0; }
	.wmfwBoxBot { left: 0;margin-left: 0; }
}
.wmfwBox .blockLB { position: absolute; z-index: 0; content: ""; display: block;
bottom: 0; left: 0; width: 33.1%; padding-bottom: 20%; background-color: #eb6300;}
.wmfwBox .con { max-width: initial; height: 57.5em;  position: relative; z-index: 1;}
.wmfwBox .tit{ position: absolute; z-index: 2; left: 0; top: 0; width: 100%; background-color: #fff;
display: flex; justify-content: space-between; align-items: center; height: 16.5em;}
.wmfwBox .tit .name { width: 60%; font-weight: bold; text-align: left;}
.wmfwBox .tit .tab { position: absolute; right: 0; top: 100%; background-color: #fff; width: 48.2%;}
.wmfwBox .tit .tab ul { text-align: left; display: flex; 
 justify-content: space-between; align-items: flex-end;}
.wmfwBox .tit .tab ul li { cursor: pointer; }
.wmfwBox .tit .tab ul li::after { margin-top: 0.8em; content: ""; display: block; width: 3em; height: 0.3em;}
.wmfwBox .tit .tab ul li.cur::after {background-color: #eb6300;}
.swiper-wmfw-1 {margin-top: 30em; width: 100%; height: 23em;}
.swiper-wmfw-1 .item { width: 48.3%; margin: 0 0 0 auto; height: 23em; text-align: left;
    transition: all 1s;
	-webkit-transition:all 1s;
	filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}
.swiper-wmfw-1 .swiper-slide-active .item {
		filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;	}
.swiper-wmfw-1 .item .intro { line-height: 2; height: 10em; overflow: hidden;}
.swiper-wmfw-1 .item .btnArrow { margin-top: 0.6em;}

.swiper-wmfw-2 { position: absolute; z-index: 2; width: 45.3%; height: 33.4em; top: 16.5em; left:0; margin-left: 0;
background-color: #f3f2f2; overflow: hidden;
-moz-border-radius:1em; -webkit-border-radius:1em; border-radius:1em;}
.swiper-wmfw-2 .swiper-slide { background-color: #f3f2f2; height: 100%;}
.swiper-wmfw-2 .swiper-slide a { display: block; cursor: pointer; color: #000;}
.swiper-wmfw-2 .swiper-slide .item {
	transition: all 1s;
	-webkit-transition:all 1s;
	filter:alpha(opacity=0);-moz-opacity:0; opacity:0;}
.swiper-wmfw-2 .swiper-slide-active .item {	filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;}
.swiper-wmfw-2 .pic { position: relative; z-index: 0; display: block;
padding-top: 56.7%;}
.swiper-wmfw-2 .pic img { display: block; position: absolute;
left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.swiper-wmfw-2 .txtb { padding: 1em 1em 1.7em; display: flex; justify-content: space-between; align-items: flex-start;}
.swiper-wmfw-2 .txtb .pics { position: relative; z-index: 0; width: 20%; padding-top: 7.6%;}
.swiper-wmfw-2 .txtb .pics img { position: absolute; left: 0; top: 0;
width: 100%; height: 100%; object-fit: cover;}
.swiper-wmfw-2 .txtb .txt { padding-top: 0.3em; flex: 1; margin-left: 1.2em; text-align: left;}
.swiper-wmfw-2 .txtb .txt  .name {height: 1.5em; overflow: hidden;}
.swiper-wmfw-2 .txtb .txt  .date { height: 1.5em; overflow: hidden;}

@media only screen and (max-width:828px) {
	.wmfwBox { height: auto; padding-bottom:1.5em;}
	.wmfwBox .con { height: 42em;}
	.wmfwBoxFixed { top: 3em;}
	.wmfwBox .tit{ position: static; display: block; padding-top: 2em; height: auto;}
	.wmfwBox .tit .name { width:100%; font-size: 16px;}
	.wmfwBox .tit .tab { width: 100%; position: static;}
	.wmfwBox .tit .tab ul { align-items: flex-start;}
	.wmfwBox .tit .tab ul li { margin-top: 1em; width: 30%;  margin-right:3%;}
	.wmfwBox .tit .tab ul li:last-child { margin-right: 0;}
	.wmfwBox .tit .tab ul li::after { margin-top: 0.4em;width: 3em; height: 0.15em;}
	.wmfwBox .tit .tab ul li .t1 { font-size:14px;}
	.wmfwBox .tit .tab ul li .t2 { font-size: 12px; letter-spacing: 0;}
	.swiper-wmfw-1{ height: 10em; margin-top: 0.4em;}
	.swiper-wmfw-1 .item {padding-top:0; width: 100%; margin: 0 auto 0 auto; }
	.swiper-wmfw-1 .item .intro  { height: 6em;}
	.swiper-wmfw-2 { position: static; width: 100%; height: 20em; margin-left: auto;}
}

/*跨越赤道线*/
.kycdxBoxW { position: relative; z-index: 0;}
.kycdxBox { max-width: 1920px; margin: 0 auto;  position: relative; z-index: 0; padding-bottom: 1em;}
.kycdxBoxFixed { position: fixed;  top: 5em; width: 100%;left: 50%; margin-left: -960px;}
.kycdxBoxBot { position: absolute; bottom: 0; top: auto; width:100%;left: 50%; margin-left: -960px;}

@media only screen and (max-width:1920px) {
	.kycdxBoxFixed { left: 0;margin-left: 0; }
	.kycdxBoxBot { left: 0;margin-left: 0; }
}

.kycdxBox .con { position: relative; z-index: 0; overflow: visible;}
.kycdxBox .tit{ position: absolute; z-index: 2; left: 0; top: 0; padding-top: 5em; width: 100%; 
display: flex; justify-content: space-between; align-items: center; }
.kycdxBox .tit .name { width: 48.2%; font-weight: bold; text-align: left;}
.kycdxBox .tit .titR { width: 49.2%;text-align: left;}
.kycdxBox .tit .titR .intro { line-height: 2;}
.kycdxBox .tit .titR .btnArrow { margin-top: 1em;}
.swiper-kycdx { position: relative; z-index: 1; padding-left: 25%; }
.swiper-kycdx .swiper-slide { height: 100%; padding-top: 12.4em;}
.swiper-kycdx .swiper-slide a { padding-bottom: 0.3em; display: block; cursor: pointer; color: #000;}
.swiper-kycdx .pic { position: relative; z-index: 0; display: block; overflow: hidden;
padding-top: 60%;}
.swiper-kycdx .pic img { display: block; position: absolute;
left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;
transition: all 1s;
-webkit-transition:all 1s;}
.swiper-kycdx .item:hover .pic img {
	-ms-transform: scale(1.05, 1.05);
	-webkit-transform: scale(1.05, 1.05);
	transform: scale(1.05, 1.05);
}
.swiper-kycdx .txtb { background-color: #f3f2f2; display: flex; justify-content: space-between; align-items: flex-start;}
.swiper-kycdx .txtb .pics { position: relative; z-index: 1; margin-top: -1.3em; margin-bottom: -0.3em;
 width: 5.5em; height: 5.5em; background-color: #ec6401;
display: flex; justify-content: center; align-items: center;
-moz-border-radius:1.2em; -webkit-border-radius:1.2em; border-radius:1.2em;}
.swiper-kycdx .txtb .pics img {width: 4.1em; display: block; height: 4.1em;}
.swiper-kycdx .txtb .txt { padding-top: 0.1em; margin-right: 1em; margin-left: 1.35em; flex: 1; }
.swiper-kycdx .txtb .txt  .name { height: 2.1em; line-height: 2.1em; overflow: hidden; text-align: left;}

@media only screen and (max-width:828px) {
	.kycdxBox .tit{ display: block; padding-top: 3em;}
	.kycdxBox .tit .name { width: 100%;}
	.kycdxBox .tit .titR { width:100%;}
	.swiper-kycdx { padding-left: 15%; }
	.swiper-kycdx .swiper-slide { padding-top: 20em;}
}

/*工具索引*/
.gjsyBox { max-width: 1920px; margin: 0 auto;  position: relative; z-index: 0; padding:6em 0 0;}
.gjsyBox .con { height: 100%; position: relative; z-index: 1;}
.gjsyBox .tit{ width: 100%; 
display: flex; justify-content: space-between; align-items: center; }
.gjsyBox .tit .name { width: 48.2%; font-weight: bold; text-align: left;}


.gjsyBox  .list { 
line-height: 2.6em;}
.gjsyBox .list ul { margin-right: -4%; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start;}
.gjsyBox .list li { margin-top: 1.2em;text-align: center; width:23.25%; margin-right:1%;}
.gjsyBox .list a{ display:block; padding: 0 1em;  height: 2.6em; line-height: 2.6; 
display:block; cursor: pointer; background-color: #f0f1f2; color: #000;
transition: all 0.5s;
-webkit-transition:all 0.5s;}
.gjsyBox .list a:hover{ background-color: #ec6401; color: #fff;}


@media only screen and (max-width:828px) {
	.gjsyBox { padding: 3em 0;}
	.gjsyBox .tit{ display: block;}
	.gjsyBox .tit .name { width: 100%;}
	.gjsyBox .list li { margin-top:0.5em; min-width: initial; margin-right:0.5em; width:48%;}
}




.btn_arr2{display: flex; align-items: center; font-size: 1.125rem; color: #000000; line-height: 2rem;}
.btn_arr2 font {
    margin-left: .25rem;
    display: inline-block;
    vertical-align: middle;
    width: 2rem;
    height: 1.5rem;
    border-radius: 50%;
    position: relative;
    overflow: hidden;
  }

.btn_arr2 font:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/Arrowshort.svg) center no-repeat;
    position: absolute;
    left: -100%;
    top: 0;
    background-size: 1.5rem;
    transition: .5s;
}

.btn_arr2 font:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/Arrowshort.svg) center no-repeat;
    position: absolute;
    left: 0;
    top: 0;
    background-size: 1.5rem;
    transition: .5s;
}
.btn_arr2:hover{ color: #000000; }
.btn_arr2:hover font:before {left: 0;}
.btn_arr2:hover font:after {left: 100%;opacity: 0;}

