@charset "utf-8";

/* frame */
a { transition:all 0.5s;}
body{min-width: 1400px;font-weight:400;background: transparent;}
.clear{clear: both;}
#content{zoom: 1;width: 100%;overflow: hidden;}
.row{width: 1400px; margin: auto; position: relative;}
.row:after { content:""; clear:both; display:block; overflow:hidden;}
#content .fl { float:left}
#content .fr { float:right}
.wrap {}

.rowTi {position:relative;display: block;height: auto;margin: 0 0 20px;padding: 0;}
.rowTi h2 {color: #333;height: 120px;line-height: 53px;display: flex;align-items: center; gap:10px; max-width: 58%;margin: 0 auto;flex-direction: column;justify-content: center; color:#0F2FA3}
.rowTi h2:after {content:"";width:200px;height:9px;transform:rotateY(90deg);background:url(../img/rowtibgline.png) no-repeat left;display:inline-block;vertical-align: middle;transition:all 1s;transition-delay:1s;opacity:0}
.rowTi h2.animated:before { transform:rotateY(0); opacity:1}
.rowTi h2.animated:after {  transform:rotateY(0); opacity:1}


#header { display: none;}
#headerMn{position:relative;width:100%;height: 808px;background: #0a48ab url(../img/bg.jpg) repeat-x center;overflow: hidden;background-size:cover}
#headerMn .logo{display:block;width:300px;height:50px;float: left;overflow:visible;margin: 41px 0 100px;}
#headerMn .logo img { height:100%; width:auto;}
#headerMn .links {height: 36px;position: absolute;top: 48px;right: 0;}
#headerMn .links a {height:36px;border-radius: 18px;line-height: 36px;text-align: center;color: #fff;font-size: 16px;float:left;padding:0 1.5em;margin-left:10px;border: 1px solid #fff;}
#headerMn .links a:hover {background: linear-gradient(180deg, #FFFFFF 0%, #EEFCFF 100%); color: #22468c}

#headerMn .mnfont {position: absolute;top: 314px;left: 30px;font-size: 36px;color:#fff;line-height: 24px;font-weight:400;text-shadow:0 4px 4px rgb(0 0 0 / 25%);transition:all 2s;opacity:0;text-align: center;}
#headerMn .mnfont h1 {font-size: 70px;font-weight:bold;line-height: 1.5;transition:all 4s;margin-bottom: 40px;}
#headerMn .mnfont p {display:block;text-align: center;line-height: 1.8;}

#headerMn .mnpc {position:relative;top: 173px;left: 544px;}
#headerMn .mnpc .p-01 {position:absolute;transition:all 1.2s;background:url(../img/aipic1.png) no-repeat;width: 610px;height: 503px;position:absolute;left: 252px;top: 0;transform:scale(0.5)translateY(200px);z-index:7;opacity:0;}
#headerMn .mnpc .p-01.animated { transform:scale(1)translateY(0); opacity:1 }
#headerMn .mnpc .p-02 {position:absolute;transition:all 1s;background:url(../img/aipic2.png) no-repeat;width: 459px;height: 250px;position:absolute;left: 609px;top: 304px;transform:translateX(200px);transition-delay:0.3s;z-index:7;opacity:0;}
#headerMn .mnpc .p-02.animated { transform:translateX(0) ; opacity:1 }
#headerMn .mnpc .p-03 {position:absolute;transition:all 1s;background:url(../img/aipic3.png) no-repeat;width: 257px;height: 198px;position:absolute;left: 183px;top: 361px;z-index:7;opacity:0;visibility: hidden;transform:translateX(-200px);transition-delay:0.5s;}
#headerMn .mnpc .p-03.animated { transform:translateX(0); opacity:1 }
#headerMn .mnpc .p-04 {position:absolute;transition:all 1s;background:url(../img/aipic4.png) no-repeat;width: 74px;height: 128px;position:absolute;left: 96px;top: 428px;z-index:7;opacity:0;visibility: hidden;transform:translateX(-300px);transition-delay:0.65s;}
#headerMn .mnpc .p-04.animated {  transform:translateX(0); opacity:1 }
#headerMn .mnpc .p-05 {position:absolute;transition:all 1s;background:url(../img/aipic5.png) no-repeat;width: 85px;height: 128px;position:absolute;left: 0;top: 428px;z-index:7;opacity:0;visibility: hidden;transform:translateX(-400px);transition-delay:0.8s;}
#headerMn .mnpc .p-05.animated {  transform:translateX(0); opacity:1 }
#headerMn .mnpc:hover { }

@keyframes pclight { }

.productIntro { background:linear-gradient(to bottom, #E3E8FF, #fff); padding:80px 0}
.productIntro .bd {display:flex;gap:70px;align-items: center;}
.productIntro .bd p {font-size:18px; line-height:32px; text-indent:2em}

@keyframes phdli {
    100% {
        transform: translateY(0)scale(1);
    }
    70% {
        transform: translateY(-6px)scale(1.05); opacity:1;
    }
    0% {
        transform: translateY(100px)scale(0); opacity:0;
    }
}
@keyframes phdlii {
    100% {
        transform: rotateY(0)scale(1); opacity:1;
    }
    80% {
        transform: scale(1.1); opacity:1;
    }
    50% {
        transform: scale(0.8); opacity:0.5;
    }
    0% {
        transform:scale(0.6); opacity:1; 
    }
}

#advantage {padding: 50px 0 100px;background:url(../img/rowbbg.jpg) no-repeat center / 100% 100%}
.advantageBox {display:flex;flex-wrap: wrap;gap: 20px;justify-content: center;flex-direction: row;}
.dvantBox {position:relative;flex: 1;background: #fff;border-radius: 20px;padding: 50px 30px;flex-basis: 335px;box-sizing: border-box;display: block!important;text-align: center; transition:all 0.5s}
.dvantBox .hd {margin-bottom: 30px;}
.dvantBox .hd h3 {font-size:24px;line-height: 32px;font-weight:bold;}
.dvantBox .ico {border-radius:50%;display:block;width:80px;height:80px;background: #F1F3FF;margin: 0 auto 30px; }
.dvantBox .ico:before {  content:""; background:url(../img/vector1.png) no-repeat center; width:100%; height:100%; display:block;}
.dvantBox .bd{position:relative;z-index:1;font-size:16px;line-height:2em;text-align: justify;}
.dvantBox .bd p { text-indent:2em}
.dvantBox .bd img {margin-left:40px;}
.dvantBox:nth-child(2) .ico:before {background-image:url(../img/vector2.png)}
.dvantBox:nth-child(3) .ico:before {background-image:url(../img/vector3.png)}
.dvantBox:nth-child(4) .ico:before {background-image:url(../img/vector4.png)}
.dvantBox:nth-child(5) .ico:before {background-image:url(../img/vector5.png)}
.dvantBox:nth-child(6) .ico:before {background-image:url(../img/vector6.png)}
.dvantBox:nth-child(7) .ico:before {background-image:url(../img/vector7.png)}
.dvantBox:nth-child(8) .ico:before {background-image:url(../img/vector8.png)}
.dvantBox:nth-child(9) .ico:before {background-image:url(../img/vector9.png)}
.dvantBox:nth-child(10) .ico:before {background-image:url(../img/vector10.png)}
.dvantBox:nth-child(11) .ico:before {background-image:url(../img/vector11.png)}
.dvantBox:nth-child(12) .ico:before {background-image:url(../img/vector12.png)}

.dvantBox:hover { background:#0F2FA3; color:#fff; box-shadow:0 5px 10px #00000022; margin-top:-10px;}
.dvantBox:hover .ico {background:linear-gradient( 135deg , #fff 0%, #e5e8f7 40%, #fff 100% );animation: phdli 0.6s ease-in-out!important;animation-fill-mode: forwards!important; box-shadow:3px 5px 10px #00000022}
.dvantBox:hover .ico:before {  animation: phdlii 1s ease-in-out;}


.lxss { background:transparent;}
.lxss a{background-color:#433FD8;}
.lxss a.sq{background-color:#433FD8;}

@media only screen and (max-width: 1400px){}