@charset "utf-8";


body { background-color: #EAF6FC; }
.wrap { position: static; }
#header { display: none; }
#footer { font-weight: 400; }

@font-face {
    font-family: 'font-webicon';
    src: url('../font-webicon/iconfont.eot');
    src: url('../font-webicon/iconfont.woff2') format('woff2'),
        url('../font-webicon/iconfont.woff') format('woff'),
        url('../font-webicon/iconfont.ttf') format('truetype');
}

/* row ---------------------------------------------------- */
.row { min-width: 1400px; clear: both; padding: 50px 0; }
.container { max-width: 1400px; margin: 0 auto; }
.content-manage { font-size: 16px; font-weight: 400; text-align: left; line-height: 2; position: relative; z-index: 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; border-radius: 36px; box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.15); background: rgba(0, 0, 0, 0.34); line-height: 36px; margin-left: 10px; color: #fff; float: left;}
.links a:hover { background-color: rgba(0, 0, 0, 0.5); }

/* 大图 */
.banner { min-width: 1400px; position: relative; overflow: hidden; clear: both; z-index: 1; height: 760px; background: linear-gradient(279.49deg, #66CAA5 1.71%, #3566A4 85.68%); }
.banner .container { position: relative; height: 100%; }
.banner .con { position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: #fff; }
.banner .con .title { font-size: 90px; font-weight: bold; line-height: 1.5; font-family: 'Source Han Sans CN'; text-shadow: 0px 4px 2px rgba(0, 0, 0, 0.25); animation: moveLeft 3s ease; margin-bottom: 20px; }
.banner .con .title a { color: inherit; }
.banner .con .intro { display: block; font-size: 18px; line-height: 2; font-weight: 300; animation: moveLeft 2s ease;  }
.banner .pic { position: absolute; right: -30px; bottom: 47px; width: 712px; height: 528px; opacity: 0; }
.banner .pic img { width: 100%; height: auto; }
.banner .pic li { position: absolute; }
.banner .pic .li1 { width: 631px; height: 528px; right: 48px; bottom: 8px; }
.banner .pic .li2 { width: 597px; height: 336px; right: 59px; top: 28px; }
.banner .pic .li3 { width: 117px; height: 120px; left: 0; bottom: 190px; }
.banner .pic .li4 { width: 130px; height: 142px; right: 38px; top: 80px; }
.banner .pic .li5 { width: 239px; height: 373px; right: 238px; bottom: 7px; }
.banner .pic .li6 { width: 215px; height: 198px; right: 0; bottom: 26px; }


/* manage-content----------------------------------------------- */

/* list */
.list { padding: 0 0 10px; }
.list li { line-height: 2; margin-bottom: 18px; box-sizing: border-box; text-align: justify; position: relative; padding-left: 30px; transition: 0.5s; }
.list li::before { content: "\E804"; font-family: font-webicon; color: #999; position: absolute; left: 0; top: 2px; transition: 0.5s; font-size: 26px; line-height: 1; }
.list li:hover { color: #284CBF; }
.list li:hover::before { color: #284CBF; }

.row-list .list { padding-bottom: 30px; }
.row-list .box-in-right .list { padding-bottom: 43px; }
.row-list .list li::before { content: "\E798"; background: linear-gradient(279.49deg, #66CAA5 1.71%, #3566A4 85.68%);
    webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
 }


/* box-about */
.box-about { box-sizing: border-box; margin-top: -60px; padding: 30px 40px; text-indent: 2em; background-color: #fff; box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15); border-radius: 10px; font-size: 20px; line-height: 2; }

/* row-advantage ------------------------ */

/* title-bar */
.title-bar { display: flex; align-items: center; font-size: 40px; text-align: center; justify-content: center; font-weight: bold; margin-bottom: 30px;}
.title-bar::before,
.title-bar::after { width: 200px; height: 1px; content: ""; transform: matrix(-1, 0, 0, 1, 0, 0); }
.title-bar::before { background: linear-gradient(270deg, rgba(77, 151, 165, 0) 0%, #4D97A5 100%); }
.title-bar::after { background: linear-gradient(90deg, rgba(77, 151, 165, 0) 0%, #4D97A5 100%);  }
.title-bar span { display: inline-block; padding: 0 22px;
    background: linear-gradient(279.49deg, #66CAA5 1.71%, #3566A4 85.68%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
 }
.title-bar i { width: 28px; height: 20px; position: relative; z-index: 1; }
.title-bar i::before,
.title-bar i::after { display: block; content: "\E796"; font-family: "font-webicon"; position: absolute; top: 50%; transform: translateY(-50%); }

.title-bar i.left { left: -5px; }
.title-bar i.right { right: -5px; }
.title-bar i.left::before,
.title-bar i.right::after { font-size: 14px; color: #4D97A5; }
.title-bar i.right::before,
.title-bar i.left::after { font-size: 20px; color: #CBE4EB; }
.title-bar i.left::after,
.title-bar i.right::after { right: 0; }
.title-bar i.left::before,
.title-bar i.right::before { left: 0; }

/* box-adv-in */
.box-adv-in { display: flex; justify-content: space-between; border-bottom: 1px solid #d9d9d9; padding-bottom: 70px; margin-bottom: 70px; }
.box-adv-in:last-child { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }

/* box-focus */
.box-focus { position: relative; width: 600px; height: 350px; padding: 0 25px; overflow: hidden; margin-top: 20px; margin-right: 50px; }
.box-focus li { position: relative; }
.box-focus .pic { text-align: center; width: 600px; }
.box-focus .pic img { max-height: 350px; 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-focus .title { position: absolute; z-index: 1; left: 50%; bottom: 75px; line-height: 40px; border-radius: 40px; background-color: #EF7D77; color: #fff; font-weight: bold; font-size: 16px; transform: translateX(-50%); }
.box-focus .title span { display: inline-block; padding: 0 20px; }
.box-focus .arrow { width: 30px; height: 30px; border-radius: 100%; transition: 0.5s; z-index: 2; text-align: center; line-height: 30px; position: absolute; top: 50%; transform: translateY(-50%);}
.box-focus .arrow::before { display: block; content: "\E802"; font-family: font-webicon; font-size: 24px; color: #999; }
.box-focus .arrow:hover { background: linear-gradient(279.49deg, #66CAA5 1.71%, #3566A4 85.68%); }
.box-focus .arrow:hover::before { color: #fff; }
.box-focus .prev { left: 0; }
.box-focus .next { right: 0; }
.box-focus .next::before { content: "\E801"; }
.box-focus:nth-child(2n) { margin-right: 0; margin-left: 50px; }

.box-focus-yy .li2 .title { bottom: 280px; left: 410px; }
.box-focus-yy .li3 .title { bottom: 290px; }
.box-focus-bj .li1 .title { left: 55%; bottom: 165px; }
.box-focus-bj .li3 .title { left: 70%; bottom: 165px; }
.box-focus-bj .li4 .title { bottom: 165px; }

/* row-list ----------------------- */
.row-list { background-color: #fff; }
.row-list .icon { width: 60px; height: 60px; overflow: hidden; margin: 0 auto; }
.row-list .icon i { animation: circle 10s linear infinite; display: block; background: linear-gradient(279.49deg, #66CAA5 1.71%, #3566A4 85.68%); width: 60px; height: 60px; border-radius: 100%; }
.row-list .icon i::before { content: "\E803"; font-family: font-webicon; display: block; width: 60px; height: 60px; text-align: center; line-height: 60px; font-size: 55px; color: #fff; 
 z-index: 1; }
.row-list .Tbd { display: flex; justify-content: space-between; position: relative; padding-top: 40px; }
.row-list .Tbd::before { content: ''; display: block; width: 1px; height: 100%; background-color: #ddd; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}

.box-in-left { width: 50%; }
.box-in-right { min-width: 0; flex: 1 0 0%; margin-top: 70px; }
.box-in-left .box-list { padding-right: 30px; }
.box-in-right .box-list { padding-left: 30px; }

/* box-list */
.box-list h3 { font-size: 24px; font-weight: bold; margin-bottom: 20px; }
.box-adv-in .box-list { flex: 1 0 0%; min-width: 0; }
.box-adv-in .box-list h3 { font-size: 32px; }

.row-list .box-list { padding-top: 20px; border-top: 1px solid #ddd; position: relative; }
.row-list .box-list::before { display: block; content: ""; position: absolute; top: -4px; width: 7px; height: 7px; border: 1px solid #ddd; box-sizing: border-box; border-radius: 100%; background-color: #fff; z-index: 1;}
.row-list .box-in-left .box-list::before { right: -3px; }
.row-list .box-in-right .box-list::before { left: -4px; }

/* 相关技术支撑功能模块----------- */
#technicalSupport { background-color: #EAF6FC; padding-top: 40px; }
#technicalSupport .row { width: 1400px; margin: 0 auto; padding: 0;}
.rowTi { padding: 0; }
.rowTi h2 { display: inline-block; padding: 0 22px;
    background: linear-gradient(279.49deg, #66CAA5 1.71%, #3566A4 85.68%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
 }
.techSupportList li:hover a { background: linear-gradient(279.49deg, #66CAA5 1.71%, #3566A4 85.68%); }
.lxss a,
.lxss a.sq { background-color: #2F508C; }




/* 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{
    0%{transform: rotate(0)}
    100%{transform: rotate(360deg)}
}

@media (min-width:1440px) {
    body { overflow-x: hidden; }
}