@charset "utf-8";

body { position: relative; min-width: 1400px; background-color: #fff; }

/* 重置 */
.wrap { position: static; }
#header { display: none; }
#top { position: relative; z-index: 3; }
#footer { font-weight: 400; }

/* row ---------------------------------------------------- */
.row { min-width: 1400px; clear: both; padding-block: 50px; }
.container { max-width: 1400px; margin: 0 auto; }
.content-manage { font-size: 16px; font-weight: 400; text-align: left; line-height: 2; }


/* manage-header----------------------------------------------- */
.manage-header { position: relative; }

/* logo-box */
.logo-box { position: absolute; top: 41px;  left: 0; width: 100%; min-width: 1400px; z-index: 2; }
.logo-box .container { display: flex; align-items: center; justify-content: space-between; height: 50px;}
.logo-box .logo { animation: moveTop 2s ease; display: block; height: 50px; }
.logo-box .logo img { max-height: 50px; width: auto;
	image-rendering: -moz-crisp-edges; /* Firefox */
    image-rendering: -o-crisp-edges; /* Opera */
    image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
 }

/* links */
.links { display: flex; min-width: 0; animation: moveTop 2s ease; }
.links a { padding: 0 24px; transition: 0.5s; display: block; font-weight: 400; line-height: 36px; box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.16); margin-left: 10px; color: #fff; background-color: rgba(0, 0, 0, 0.37); border-radius: 40px; float: left;}
.links a:hover { background-color: rgba(0, 0, 0, 0.5);  }

/* 大图 */
.banner { min-width: 1400px; position: relative; clear: both; height: 910px; overflow: hidden;}
.banner svg { position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
.banner .con { position: absolute; left: 0; top: 42%; transform: translateY(-50%); width: 665px; color: #fff; text-align: left; }
.banner .con .title { font-size: 80px; font-weight: bold; line-height: 1.5; animation: moveLeft 1.5s ease; margin-bottom: 20px;}
.banner .con .title span { padding: 0 10px; }
.banner .con .intro { display: block; font-size: 18px; line-height: 2; font-weight: 300; animation: moveLeft 2s ease;  }
.banner .pic { position: absolute; width: 680px; height: 710px; right: 0; bottom: 0; opacity: 0; }
.banner .pic p { position: absolute; }
.banner .pic .p1 { left: 0; bottom: 15px; width: 694px; height: 694px; }
.banner .pic .p2 { right: 30px; bottom: 115px; width: 210px; height: 510px; }
.banner .pic img { max-width: 100%; height: auto;
      image-rendering: -moz-crisp-edges; /* Firefox */
        image-rendering: -o-crisp-edges; /* Opera */
        image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */
        image-rendering: crisp-edges;
        -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
 }
.banner .container { position: relative; height: 100%; }


/* manage-content----------------------------------------------- */
.box-default>.hd { text-align: center; padding-bottom: 30px; }
.box-default>.hd h3 { position: relative; font-weight: 700; font-size: 40px; line-height: 2.3; display: inline-block;
    background: linear-gradient(90deg, #B8CBB8 0%, #B8CBB8 0%, #B465DA 0%, #CF6CC9 33%, #EE609C 66%, #EE609C 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}


/* row-about ----------- */
.row-about { padding-bottom: 0; }

/* box-about */
.box-about .bd { padding: 25px 60px; background-color: #FAFAFA; line-height: 2; border-radius: 20px; border: 1px solid #f1f1eb; display: flex; align-items: center; justify-content: space-between;}
.box-about .bd p { text-indent: 2em; margin-bottom: 18px; line-height: 2; font-size: 20px;  }
.box-about .bd p:last-child { margin-bottom: 0; }
.box-about .bd .intro { flex: 1 0 0%; min-width: 0; }
.box-about .bd .pic { width: 160px; padding-left: 80px; }
.box-about .bd .pic img { max-width: 100%; height: auto; }



/* row-lightspot ----------- */
.row-lightspot { padding: 20px 0 10px; }
.row-lightspot .container { overflow: hidden; }

/* box-lightspot */
.box-lightspot .bd .li1 { display: flex; align-items: center; justify-content: space-between; background: url(../img/bg-01.jpg) no-repeat center top; padding-block: 50px 30px; }
.box-lightspot .bd .li1:nth-child(odd) .con { padding-left: 60px; }
.box-lightspot .bd .li1:nth-child(even) .con { padding-right: 60px; }
.box-lightspot .pic { width: 563px; box-sizing: border-box; text-align: center; }
.box-lightspot .pic img { max-width: 100%;
      image-rendering: -moz-crisp-edges; /* Firefox */
        image-rendering: -o-crisp-edges; /* Opera */
        image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */
        image-rendering: crisp-edges;
        -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
 }
.box-lightspot .con { flex: 1 0 0%; min-width: 0; }
.box-lightspot .title { font-weight: bold; font-size: 24px; color: #3B3A3A; margin-bottom: 20px; }
.box-lightspot .intro p { line-height: 2; margin-bottom: 18px; box-sizing: border-box; text-align: justify; position: relative; padding-left: 16px; transition: 0.5s; }
.box-lightspot .intro p::before { content: ""; width: 5px; height: 5px; background-color: #666; border-radius: 100%; position: absolute; left: 0; top: 14px; transition: 0.5s; }
.box-lightspot .intro p:hover { color: #195681; }
.box-lightspot .intro p:hover::before { background-color: #195681; }


/* box-focus */
.box-focus { width: 563px; padding-block: 13px; height: 260px; background: linear-gradient(90deg, #D3EAFF 0%, #F3E9ED 100%); border-radius: 60px 0; position: relative; }
.box-focus .bd li { position: relative; }
.box-focus .bd .pic img { height: 260px; width: auto; }
.box-focus .bd .title { position: absolute; bottom: 52px; right: 270px; margin-bottom: 0; display: flex; align-items: center; justify-content: center; }
.box-focus .bd .title::after { content: ""; width: 0; height: 0; border: 7px solid transparent; border-left: 7px solid #DE3C19; }
.box-focus .bd .title span { display: inline-block;  white-space: nowrap; font-weight: 400; border-radius: 7px; font-size: 12px; padding-inline: 25px; color: #fff; background-color: #DE3C19; height: 36px; line-height: 36px;}
.box-focus .arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; cursor: pointer; color: #999; }
.box-focus .arrow::before { font-family: "fontpower"; font-size: 24px; color: inherit; line-height: 1.5; content: "\E1D0";}
.box-focus .prev { left: 18px; }
.box-focus .next { right: 18px; }
.box-focus .next::before { content: "\E1D1" }
.box-focus .arrow:hover { color: #DE3C19; }


/* row-relevance ----------- */
#technicalSupport .row { width: 1400px; margin: 0 auto; padding: 0;}
.lxss .row { padding-block: 0; }


/* keyframes------------------ */
@keyframes moveLeft
{
    0%{
        opacity: 0;
        transform: translateX(-100%);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes moveRight
{
    0%{
        opacity: 0;
        transform: translateX(100%);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes moveTop
{
    0%{
        opacity: 0;
        transform: translateY(-100%);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes moveTop1
{
    0%{
        opacity: 0;
        transform: translateY(-20%);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes moveBottom
{
    0%{
        opacity: 0;
        transform: translateY(100%);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}

/* 旋转 */
@keyframes circle{
    50% { transform: rotate(180deg)}
}


@media (min-width:1440px) {
    body { overflow-x: hidden; }
}



@keyframes path {
    0% {
        stroke-dashoffset: 220;
    }

    100% {
        stroke-dashoffset: 0;
    }
}
