te(-50%,-50%);
width: 30px;
height: 30px;
border-radius: 50%;
border: 1px solid red;
-webkit-animation: home_hero_item_hints_border-data-v-8d9497d2 2s linear infinite red;
animation: home_hero_item_hints_border-data-v-8d9497d2 2s linear infinite red
}
@-webkit-keyframes home_hero_item_hints_border-data-v-8d9497d2 {
0%,to {
border-color: hsla(0,0%,100%,.6);
-webkit-transform: translate(-50%,-50%) scale(.95);
transform: translate(-50%,-50%) scale(.95)
}
50% {
border-color: hsla(0,0%,100%,.3);
-webkit-transform: translate(-50%,-50%) scale(1);
transform: translate(-50%,-50%) scale(1)
}
}
@keyframes home_hero_item_hints_border-data-v-8d9497d2 {
0%,to {
border-color: hsla(0,0%,100%,.6);
-webkit-transform: translate(-50%,-50%) scale(.95);
transform: translate(-50%,-50%) scale(.95)
}
50% {
border-color: hsla(0,0%,100%,.3);
-webkit-transform: translate(-50%,-50%) scale(1);
transform: translate(-50%,-50%) scale(1)
}
}
.service .container .map .hint .hint-content[data-v-8d9497d2] {
position: absolute;
width: 180px;
color: red;
z-index: 5;
padding: 12px 0;
font-size: 12px;
color: #b0b0b0;
-webkit-transition: opacity .7s ease,visibility .7s ease;
transition: opacity .7s ease,visibility .7s ease;
opacity: 0;
visibility: hidden
}
.service .container .map .hint:hover .hint-content[data-v-8d9497d2] {
opacity: 1;
visibility: visible
}
.service .container .map .hint .hint-content[data-v-8d9497d2]:after,.service .container .map .hint .hint-content[data-v-8d9497d2]:before {
content: "";
position: absolute;
height: 1px;
background-color: red;
-webkit-transition: opacity .5s ease;
transition: opacity .5s ease;
opacity: 0
}
.service .container .map .hint .hint-content[data-v-8d9497d2]:before {
width: 180px
}
.service .container .map .hint .hint-content[data-v-8d9497d2]:after {
width: 80px
}
.service .container .map .hint:hover .hint-content[data-v-8d9497d2]:after,.service .container .map .hint:hover .hint-content[data-v-8d9497d2]:before {
opacity: 1
}
.service .container .map .hint:hover .hint-content[data-v-8d9497d2]:before {
-webkit-transition-delay: .15s;
transition-delay: .15s
}
.service .container .map .hint .hint-content p[data-v-8d9497d2] {
opacity: 0; font-size:20px; margin:0px 0; color:#fff;text-shadow: 1px 1px 2px #000000;
-webkit-transition-delay: .3s;
transition-delay: .3s
}
.service .container .map .hint:hover .hint-content p[data-v-8d9497d2] {
opacity: 1
}
.service .container .map .hint.beimei[data-v-8d9497d2] {
top: calc(41.64% - 30px);
left: calc(18.29% - 30px)
}
.service .container .map .hint.beimei .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.beimei .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.beimei .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
.service .container .map .hint.ouzhou[data-v-8d9497d2] {
top: calc(34.5% - 30px);
left: calc(53.47% - 30px)
}
.service .container .map .hint.ouzhou .hint-content[data-v-8d9497d2] {
top: 85px;
left: 50%;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
margin-left: -55px
}
.service .container .map .hint.ouzhou .hint-content[data-v-8d9497d2]:before {
top: 0;
right: 0
}
.service .container .map .hint.ouzhou .hint-content[data-v-8d9497d2]:after {
top: 0;
right: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%
}
.service .container .map .hint.yatai[data-v-8d9497d2] {
top: calc(34.5% - 30px);
left: calc(75.52% - 30px)
}
.service .container .map .hint.yatai .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.yatai .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.yatai .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
.service .container .map .hint.nanmei[data-v-8d9497d2] {
top: calc(70.06% - 30px);
left: calc(26.24% - 30px)
}
.service .container .map .hint.nanmei .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.nanmei .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.nanmei .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*智利*/
.service .container .map .hint.zhili[data-v-8d9497d2] {
top: calc(89.06% - 30px);
left: calc(26.24% - 30px)
}
.service .container .map .hint.zhili .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.zhili .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.zhili .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*智利*/
/*玻利维亚*/
.service .container .map .hint.Bolivia[data-v-8d9497d2] {
top: calc(76.06% - 30px);
left: calc(29% - 30px)
}
.service .container .map .hint.Bolivia .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Bolivia .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.Bolivia .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*玻利维亚*/
/*多米尼加*/
.service .container .map .hint.Dominica[data-v-8d9497d2] {
top: calc(53.56% - 30px);
left: calc(27% - 30px)
}
.service .container .map .hint.Dominica .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Dominica .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.Dominica .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*多米尼加*/
/*特克斯和凯科斯群岛*/
.service .container .map .hint.Turks[data-v-8d9497d2] {
top: calc(49.56% - 30px);
left: calc(25.5% - 30px)
}
.service .container .map .hint.Turks .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Turks .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.Turks .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*特克斯和凯科斯群岛*/
/*加纳*/
.service .container .map .hint.Ghana[data-v-8d9497d2] {
top: calc(60.06% - 30px);
left: calc(46.5% - 30px)
}
.service .container .map .hint.Ghana .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Ghana .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.Ghana .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*加纳*/
/*埃及*/
.service .container .map .hint.Egypt[data-v-8d9497d2] {
top: calc(49.06% - 30px);
left: calc(54.5% - 30px)
}
.service .container .map .hint.Egypt .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Egypt .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.Egypt .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*埃及*/
/*尼日利亚*/
.service .container .map .hint.Nigeria[data-v-8d9497d2] {
top: calc(60.06% - 30px);
left: calc(49.5% - 30px)
}
.service .container .map .hint.Nigeria .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Nigeria .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.Nigeria .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*尼日利亚*/
/*北苏丹*/
.service .container .map .hint.Sudan[data-v-8d9497d2] {
top: calc(60.06% - 30px);
left: calc(57.5% - 30px)
}
.service .container .map .hint.Sudan .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Sudan .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.Sudan .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*北苏丹*/
/*阿联酋*/
.service .container .map .hint.UAE[data-v-8d9497d2] {
top: calc(50.06% - 30px);
left: calc(62.5% - 30px)
}
.service .container .map .hint.UAE .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.UAE .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.UAE .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*阿联酋*/
/*沙特阿拉*/
.service .container .map .hint.Saudi[data-v-8d9497d2] {
top: calc(50.06% - 30px);
left: calc(59.5% - 30px)
}
.service .container .map .hint.Saudi .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Saudi .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.Saudi .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*沙特阿拉*/
/*马达加斯加*/
.service .container .map .hint.Madagascar[data-v-8d9497d2] {
top: calc(75.06% - 30px);
left: calc(60% - 30px)
}
.service .container .map .hint.Madagascar .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Madagascar .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.Madagascar .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*马达加斯加*/
/*菲律宾*/
.service .container .map .hint.Philippines[data-v-8d9497d2] {
top: calc(58.06% - 30px);
left: calc(82% - 30px)
}
.service .container .map .hint.Philippines .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Philippines .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.Philippines .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*菲律宾*/
/*缅甸*/
.service .container .map .hint.Myanmar[data-v-8d9497d2] {
top: calc(54.06% - 30px);
left: calc(74% - 30px)
}
.service .container .map .hint.Myanmar .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Myanmar .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.Myanmar .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*缅甸*/
/*柬埔寨*/
.service .container .map .hint.Cambodia[data-v-8d9497d2] {
top: calc(58.06% - 30px);
left: calc(76% - 30px)
}
.service .container .map .hint.Cambodia .hint-content[data-v-8d9497d2] {
top: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.Cambodia .hint-content[data-v-8d9497d2]:before {
top: 0;
left: 0
}
.service .container .map .hint.Cambodia .hint-content[data-v-8d9497d2]:after {
top: 0;
left: 0;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
/*柬埔寨*/
.service .container .map .hint.dayang[data-v-8d9497d2] {
top: calc(81.13% - 30px);
left: calc(83.86% - 30px)
}
.service .container .map .hint.dayang .hint-content[data-v-8d9497d2] {
bottom: 85px;
right: 50%;
-webkit-transform: translateX(100%);
transform: translateX(100%);
margin-right: -55px
}
.service .container .map .hint.dayang .hint-content[data-v-8d9497d2]:before {
bottom: 0;
left: 0
}
.service .container .map .hint.dayang .hint-content[data-v-8d9497d2]:after {
bottom: 0;
left: 0;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%
}
.service .container .map .ningbo[data-v-8d9497d2] {
position: absolute;
top: 50.02%;
left: 79.49%
}
.service .container .map .ningbo[data-v-8d9497d2]:before {
content: "";
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
width: 8px;
height: 8px;
background-color: red;
border-radius: 50%
}
.service .container .map .ningbo .tq1[data-v-8d9497d2] {
position: absolute;
top: 50%;
left: 50%;
width: 8px;
height: 8px;
margin: -4px 0 0 -4px;
border-radius: 50%;
background-color: hsla(0,100%,54%,.2);
-webkit-animation: bianda-data-v-8d9497d2 2.5s linear infinite;
animation: bianda-data-v-8d9497d2 2.5s linear infinite
}
.service .container .map .ningbo .tq2[data-v-8d9497d2] {
-webkit-animation: bianda2-data-v-8d9497d2 2s linear infinite;
animation: bianda2-data-v-8d9497d2 2s linear infinite
}
.service .container .map .ningbo .tq2[data-v-8d9497d2],.service .container .map .ningbo .tq3[data-v-8d9497d2] {
position: absolute;
top: 50%;
left: 50%;
width: 8px;
height: 8px;
margin: -4px 0 0 -4px;
border-radius: 50%;
background-color: hsla(0,100%,54%,.1)
}
.service .container .map .ningbo .tq3[data-v-8d9497d2] {
-webkit-animation: bianda3-data-v-8d9497d2 3s linear infinite;
animation: bianda3-data-v-8d9497d2 3s linear infinite
}
.service .container .map .ningbo .content[data-v-8d9497d2] {
position: absolute;
left: 20px;
bottom: -10px;
font-size: 12px;
color: red
}
.service .container .map .ningbo .content img[data-v-8d9497d2] {
margin-left: -70px
}
@-webkit-keyframes bianda-data-v-8d9497d2 {
0% {
-webkit-transform: scale(1);
transform: scale(1)
}
to {
-webkit-transform: scale(10);
transform: scale(10)
}
}
@keyframes bianda-data-v-8d9497d2 {
0% {
-webkit-transform: scale(1);
transform: scale(1)
}
to {
-webkit-transform: scale(10);
transform: scale(10)
}
}
@-webkit-keyframes bianda2-data-v-8d9497d2 {
0% {
-webkit-transform: scale(1);
transform: scale(1)
}
to {
-webkit-transform: scale(13);
transform: scale(13)
}
}
@keyframes bianda2-data-v-8d9497d2 {
0% {
-webkit-transform: scale(1);
transform: scale(1)
}
to {
-webkit-transform: scale(13);
transform: scale(13)
}
}
@-webkit-keyframes bianda3-data-v-8d9497d2 {
0% {
-webkit-transform: scale(1);
transform: scale(1)
}
to {
-webkit-transform: scale(17);
transform: scale(17)
}
}
@keyframes bianda3-data-v-8d9497d2 {
0% {
-webkit-transform: scale(1);
transform: scale(1)
}
to {
-webkit-transform: scale(17);
transform: scale(17)
}
}
@media (max-width:768px) {
.service .container[data-v-8d9497d2] {
padding-top: 0
}
.service .container .box .title .en[data-v-8d9497d2] {
font-size: 24px
}
.service .container .box .title .cn[data-v-8d9497d2] {
font-size: 20px
}
.service .container .map .hint[data-v-8d9497d2],.service .container .map .ningbo[data-v-8d9497d2] {
display: none
}
.service .container .box[data-v-8d9497d2] {
position: static;
padding-bottom: 50px
}
}