@charset "utf-8";

body { position: relative; min-width: 1400px; background:#f6fbff; }

/* 重置 */
.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; line-height: 36px; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1); margin-left: 10px; color: #fff; background: rgba(12, 107, 243, 0.5); border-radius: 40px; float: left;}
.links a:hover { background: rgba(12, 107, 243, 0.8); }


/* 大图 */
.banner { min-width: 1400px; position: relative; overflow: hidden; clear: both; z-index: 1; height: 750px; background: url(../img/banner.png) no-repeat center bottom;}
.banner .con { position: absolute; left: 50%; top: 42%; transform: translate(-50%,-50%); color: #fff; text-align: left; width: 1400px; }
.banner .con .title { font-size: 80px; letter-spacing: 0.2em; font-weight: 700; position: relative; text-shadow: 0px 0px 10px rgba(12, 12, 12, 0.2); line-height: 1.5; animation: moveLeft 2s 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 3s ease;  }
.banner .container { position: relative; height: 100%; }
.banner .pic { position: absolute; right: 0; bottom: 130px; width: 530px; height: 440px; opacity: 0; }
.banner .pic p { position: absolute; }
.banner .pic .bg-voting { width: 530px; height: 440px; }
.banner .pic .book { width: 113px; height: 234px; }
.banner .pic .book-1 { right: 190px; top: -5px; }
.banner .pic .book-2 { right: 230px; top: 25px; }
.banner .pic .mail { width: 97px; height: 121px; right: 275px; top: 160px; }
.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) */
 }


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

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


/* title-bar */
.title-bar { display: flex; align-items: center; font-size: 32px; font-weight: bold; margin-bottom: 50px; margin-top: 30px; }
.title-bar::before { content: "\E818"; font-family: "font-webicon"; font-weight: normal; font-size: 40px; width: 54px; height: 54px; border-radius: 14px; text-align: center; line-height: 54px; color: #fff; margin-right: 20px;
    background: linear-gradient(180deg, #006DFF 0%, #3F91FF 100%); box-shadow: 0px 5px 10px rgba(0, 28, 58, 0.15);
}


/* 背景/字体图标 */
.row-options { background-color: #fff; }
.row-options .title-bar::before { content: "\E815"; }
.row-control { background-color: #FAFAFA; }
.row-control .title-bar::before { content: "\E819"; }
.row-result { background: linear-gradient(94.48deg, rgba(250, 250, 250, 0.3) 17.62%, rgba(206, 229, 245, 0.3) 53.38%, rgba(220, 228, 255, 0.3) 100%); }
.row-result .title-bar::before { content: "\E820"; font-size: 50px; }
.row-deploy { background: linear-gradient(94.48deg, rgba(220, 228, 255, 0.3) 3.7%, rgba(206, 229, 245, 0.3) 50.31%, rgba(250, 250, 250, 0.3) 86.08%); }
.row-deploy .title-bar::before { content: "\E821"; font-size: 50px; }

/* box-default */
.box-default .bd { display: flex; justify-content: space-between; }
.box-default .pic { position: relative; padding: 30px 0 0 30px; }
.box-default .pic img { max-width: 580px; height: auto; }
.box-default .pic .img1 { position: absolute; top: 0; left: 0; opacity: 0.2; }
.box-default .pic .img2 { position: relative; z-index: 1; }
.box-default .title { position: absolute; padding: 0 15px; white-space: nowrap; z-index: 3; background-color: #0095FF; color: #fff; line-height: 30px; border-radius: 3px; height: 30px; font-size: 14px; }
.box-default .con { flex: 1 0 0%; min-width: 0; padding-left: 100px; }
.box-default .intro p { text-indent: 2em; line-height: 2; margin-bottom: 18px; }

/* 内边距 */
.box-options .con, 
.box-result .con { padding-left: 0; padding-right: 130px; }

/* title 位置 */
.box-item .title-bar { margin-top: 0; }
.box-item .title-1 { top: 180px; left: 140px; }
.box-item .title-2 { top: 235px; left: 346px; }
.box-item .title-3 { top: 260px; left: 160px; }

.box-options .title-1 { top: 126px; left: 66px; }
.box-options .title-2 { top: 268px; left: 330px; }

.box-control .title-1 { top: 158px; left: 212px; }
.box-result .title-1 { top: 286px; left: 160px; }
.box-deploy .title-1 { top: 240px; left: 200px; }

/* row-relevance ----------- */
.rowTi h2 { color: #0972E7; }
#technicalSupport .row { width: 1400px; margin: 0 auto; padding: 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; }
}