h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
address,
caption,
cite,
code,
em,
th,
p,
a,
li,
td,
b,
div {
    font: 400 12px open sans, lucida grande, lucida sans unicode, arial;
    color: #333
}

html {
    font: 400 100% open sans, lucida grande, lucida sans unicode, arial;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: none;
    line-height: 1.2;
    color: #333;
    font-size: 10px
}

body {
    overflow-x: hidden;
    background-color: #fff
}

.pw1200 {
    max-width: 1200px;
    width: 98%;
    margin: 0 auto
}

.wrap h2 {
    line-height: 1.4
}

.wrap p {
    line-height: 1.8
}

.wrap a {
    text-decoration: none
}

.ft26 {
    font-size: 26px
}

.newnav,
.newnav>a,
.newnav>div.navbox {
    display: none
}

.bannerbox {
    height: 592px;
    background-color: #e0faff
}

.bannerbox>a {
    display: block;
    width: 60px;
    height: 60px;
    line-height: 80px;
    text-align: center;
    position: absolute;
    top: 45%;
    z-index: 7;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .2);
    transition: .3s ease-in-out
}

.bannerbox>a:hover {
    background-color: rgba(0, 0, 0, .4)
}

.bannerbox>a:after {
    content: "";
    display: inline-block;
    width: 15px;
    height: 27px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

.idxprev {
    left: 9%
}

.idxnext {
    right: 9%
}

.idxprev:after {
    background: url(../png/idxprev.png) no-repeat;
    background-size: 15px 27px
}

.idxnext:after {
    background: url(../png/idxnext-2.png) no-repeat;
    background-size: 15px 27px
}

.bannerbox ul {
    bottom: 35px;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
    z-index: 7
}

.bannerbox li {
    cursor: pointer;
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 5px;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, .15);
    margin: 5px;
    cursor: pointer;
    transition: .3s ease-in-out
}

.bannerbox .activeli {
    background-color: rgba(0, 0, 0, .45);
    width: 30px
}

.banner1 {
    width: 100%;
    height: 592px;
    left: 0;
    top: 0;
    background: #f3f3f3 url(../png/idx_atbanbg.png) bottom center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out
}

.attext {
    max-width: 580px;
    width: 94%;
    height: 592px;
    z-index: 5;
    overflow: hidden
}

.attext h3 {
    padding-top: 80px;
    font-weight: 900
}

.attext h1 {
    margin-top: 20px;
    line-height: 1.3;
    font-size: 48px;
    font-weight: 900
}

.attext p {
    width: 90%;
    opacity: .8;
    line-height: 1.6;
    color: #666
}

.idxatbtn {
    max-width: 500px;
    width: 100%;
    margin-top: 40px
}

.idxatbtn a {
    font-size: 20px;
    color: #fff;
    margin: auto
}

.idxatbtn .idxatle {
    color: #000
}

.idxatdl {
    display: block;
    width: 233px;
    height: 65px;
    line-height: 65px;
    background-color: #2375ff
}

.idxatdl:after,
.idxprdl:after,
.idxafdl:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    width: 14px;
    height: 16px;
    background: url(../png/dlarrow.png) top center no-repeat;
    background-position: 0 -18px
}

.idxatdl:hover:after,
.idxprdl:hover:after,
.idxatle:hover:after,
.idxprle:hover:after,
.idxafle:hover:after,
.idxafdl:hover:after {
    background-position: 0 0;
    transition: ease-in-out .39s
}

.idxatle {
    display: block;
    width: 229px;
    height: 61px;
    line-height: 61px;
    border: 2px solid #000
}

.idxatle:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    width: 16px;
    height: 14px;
    background: url(../png/morearrow1.png) left center no-repeat;
    background-position: -18px 0
}

.banner2 {
    width: 100%;
    height: 592px;
    left: 0;
    top: 0;
    background: #0dacc1 url(../png/idx_prbanbg.png) bottom center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out
}

.prtext {
    max-width: 650px;
    width: 98%;
    height: 592px;
    z-index: 5;
    overflow: hidden
}

.prtext h3 {
    padding-top: 100px
}

.prtext h1 {
    margin-top: 20px;
    line-height: 1.3;
    font-size: 48px;
    color: #fff;
    font-weight: 900
}

.prtext p {
    width: 90%;
    opacity: .8;
    line-height: 1.6
}

.idxprbtn {
    max-width: 500px;
    width: 100%;
    margin-top: 40px
}

.idxprbtn a {
    font-size: 20px;
    color: #fff
}

.idxprdl {
    display: block;
    width: 233px;
    height: 65px;
    line-height: 65px;
    background-color: #21b85a
}

.idxprle {
    display: block;
    width: 229px;
    height: 61px;
    line-height: 61px;
    border: 2px solid #fff
}

.idxprle:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    width: 16px;
    height: 14px;
    background: url(../png/morearrow2.png) left center no-repeat;
    background-position: -18px 0
}

.banner3 {
    width: 100%;
    height: 592px;
    left: 0;
    top: 0;
    background: #f3f3f3 url(../png/idx_aubanbg-3.png) bottom center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out
}

.autext {
    max-width: 650px;
    width: 94%;
    height: 592px;
    z-index: 5;
    overflow: hidden
}

.autext h3 {
    padding-top: 100px;
    font-weight: 900
}

.autext h1 {
    margin-top: 20px;
    line-height: 1.3;
    font-size: 48px;
    font-weight: 900
}

.autext p {
    width: 90%;
    opacity: .8;
    line-height: 1.6;
    color: #666
}

.idxreban_tips_au {
    display: inline-block;
    padding: 0 8px;
    vertical-align: middle;
    height: 20px;
    line-height: 20px;
    font-size: 14px;
    background-color: #0da6a9;
    border-radius: 8px 0 8px 0;
    font-family: open sans;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 4px;
    color: #fff
}

.banner4 {
    width: 100%;
    height: 592px;
    left: 0;
    top: 0;
    background: #1ab9a5 url(../jpg/idx_afbanbg.jpg) bottom center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out
}

.aftext {
    max-width: 650px;
    width: 98%;
    height: 592px;
    z-index: 5;
    overflow: hidden
}

.aftext h3 {
    padding-top: 100px
}

.aftext h1 {
    margin-top: 20px;
    line-height: 1.3;
    font-size: 48px;
    color: #fff;
    font-weight: 900
}

.aftext p {
    width: 90%;
    opacity: .8;
    line-height: 1.6
}

.idxafbtn {
    max-width: 500px;
    width: 100%;
    margin-top: 40px
}

.idxafbtn a {
    font-size: 20px;
    color: #fff
}

.idxafdl {
    display: block;
    width: 233px;
    height: 65px;
    line-height: 65px;
    background-color: #00dd54
}

.idxafle {
    display: block;
    width: 229px;
    height: 61px;
    line-height: 61px;
    border: 2px solid #fff
}

.idxafle:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    width: 16px;
    height: 14px;
    background: url(../png/morearrow2.png) left center no-repeat;
    background-position: -18px 0
}

.idx_aflable {
    margin-left: 8px
}

.banner5 {
    width: 100%;
    height: 592px;
    left: 0;
    top: 0;
    background: #aad8f0 url(../jpg/idx_ptbanbg-2.jpg) bottom center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out
}

.newtab {
    display: inline-block;
    padding: 3px 8px;
    vertical-align: middle;
    font-weight: 400;
    font-size: 16px;
    line-height: 1;
    border-radius: 0 6px 0 6px;
    color: #fff;
    background: linear-gradient(to right, #00e4ff, #329fff);
    background-color: #4c7bff
}

.idxatbtn div span {
    font-size: 14px;
    color: #222;
    display: block;
    margin-top: 8px
}

.banner6 {
    width: 100%;
    height: 592px;
    left: 0;
    top: 0;
    background: #aad8f0 url(../jpg/idx_aptbanbg.jpg) bottom center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out
}

.banner6 h3 img {
    display: inline-block;
    transform: translateY(-5px)
}

.banner6 .idxatdl {
    background: linear-gradient(to right, #175CFF, #24DBC9);
    background-color: #175cff
}

.banner7 {
    width: 100%;
    height: 592px;
    left: 0;
    top: 0;
    background: #daffde url(../png/idx_dkbanbg-4.png) bottom center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out
}

.banner7 .idxatdl {
    background-color: #009e13
}

.dknew {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    font-family: Helvetica, sans-serif;
    color: #fff;
    background-color: #009e13;
    padding: 2px 7px;
    border-radius: 0 7px
}

.bannershow {
    opacity: 1;
    z-index: 5
}

.idxrebanner h3,
.idxrebanner h1,
.idxrebanner p,
.idxrebanner .idxprbtn,
.idxrebanner .idxatbtn,
.idxrebanner .idxafbtn {
    transform: translateX(-600px);
    opacity: 0
}

.bannershow h3,
.bannershow h1,
.bannershow p,
.bannershow .idxprbtn,
.bannershow .idxatbtn,
.bannershow .idxafbtn {
    transform: translateX(0px);
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -o-transform: translateX(0px);
    opacity: 1
}

.bannershow h3 {
    transition: transform .7s ease-in-out, opacity .7s ease-in-out;
    -webkit-transition: transform .7s ease-in-out, opacity .7s ease-in-out;
    -moz-transition: transform .7s ease-in-out, opacity .7s ease-in-out;
    -o-transition: transform .7s ease-in-out, opacity .7s ease-in-out
}

.bannershow h1 {
    transition: transform .7s .2s ease-in-out, opacity .7s ease-in-out;
    -webkit-transition: transform .7s .2s ease-in-out, opacity .7s ease-in-out;
    -moz-transition: transform .7s .2s ease-in-out, opacity .7s ease-in-out;
    -o-transition: transform .7s .2s ease-in-out, opacity .7s ease-in-out
}

.bannershow p {
    transition: transform .7s .4s ease-in-out, opacity .7s ease-in-out;
    -webkit-transition: transform .7s .4s ease-in-out, opacity .7s ease-in-out;
    -moz-transition: transform .7s .4s ease-in-out, opacity .7s ease-in-out;
    -o-transition: transform .7s .4s ease-in-out, opacity .7s ease-in-out
}

.bannershow .idxprbtn,
.bannershow .idxatbtn,
.bannershow .idxafbtn {
    transition: transform .5s .6s ease-in-out, opacity .7s ease-in-out;
    -webkit-transition: transform .5s .6s ease-in-out, opacity .7s ease-in-out;
    -moz-transition: transform .5s .6s ease-in-out, opacity .7s ease-in-out;
    -o-transition: transform .5s .6s ease-in-out, opacity .7s ease-in-out
}

.idxreban_tips {
    height: 28px;
    background: #ffa800;
    font-size: 16px;
    line-height: 28px;
    color: #fff;
    padding: 0 12px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
    position: relative
}

.idxreban_tips:before {
    width: 0;
    height: 0;
    border-right: 12px solid transparent;
    border-top: 18px solid #ffa800;
    position: absolute;
    right: -10px;
    top: 0;
    z-index: 3;
    content: ""
}

.idxreban_tips:after {
    width: 0;
    height: 0;
    border-right: 12px solid transparent;
    border-bottom: 18px solid #ffa800;
    position: absolute;
    right: -10px;
    bottom: 0;
    z-index: 3;
    content: ""
}

.bannerimg {
    width: 465px;
    height: 520px;
    margin-right: 30px;
    z-index: 6
}

.bannerimg_anima {
    bottom: 5px;
    left: 0
}

.idxtitle {
    max-width: 985px;
    width: 92%;
    margin: 70px auto 0
}

.idxtitle h2 {
    max-width: 750px;
    width: 100%;
    font-size: 38px;
    color: #000;
    font-weight: 700;
    margin: 0 auto
}

.idxtitle p {
    font-size: 18px;
    color: #000;
    line-height: 1.7;
    margin-top: 15px
}

.idxpro_box {
    width: 46.875%;
    min-height: 508px;
    margin: 10px;
    background: #fdfdfd;
    padding-top: 50px;
    display: inline-block;
    vertical-align: top;
    border: 1px solid #eee;
    border-radius: 5px;
    transition: transform .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out;
    -moz-transition: transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    -ms-transition: transform .3s ease-in-out;
    position: relative
}

.idxpro_box:hover {
    transform: translateY(-8px);
    border: 1px solid #f7f3f3;
    box-shadow: 0 0 30px #eee
}

.idxpro_box h3 {
    font-size: 32px;
    color: #111;
    font-weight: 700
}

.idxpro_box p {
    max-width: 410px;
    width: 92%;
    margin: 15px auto 0;
    font-size: 18px;
    color: #111;
    line-height: 1.4
}

.idxpro_link a {
    font-size: 16px;
    color: #2375ff;
    text-decoration: none;
    margin: 10px 10px 0;
    font-weight: 700;
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.idxpro_link a>span {
    width: 0;
    height: 1px;
    display: inline-block;
    background: #2375ff;
    position: absolute;
    left: 20px;
    bottom: -3px;
    display: block;
    transition: width .3s linear;
    -webkit-transition: width .3s linear;
    -moz-transition: width .3s linear;
    -o-transition: width .3s linear;
    -ms-transition: width .3s linear
}

.idxpro_link a:hover span {
    width: calc(100% - 15px)
}

.idxpro_link a:hover:after {
    transform: translateX(5px)
}

.idxpro_link a:after {
    content: "\e902";
    font-family: iconfont;
    vertical-align: middle;
    margin-left: 5px;
    font-size: 12px;
    color: inherit;
    transition: transform .3s linear;
    -webkit-transition: transform .3s linear;
    -moz-transition: transform .3s linear;
    -o-transition: transform .3s linear;
    -ms-transition: transform .3s linear;
    display: inline-block
}

.idxpro_link a:before {
    content: "\e906";
    font-family: pricon;
    vertical-align: middle;
    margin: -3px 5px 0 0;
    font-size: 14px;
    color: inherit;
    display: inline-block;
    font-weight: 400
}

.idxpro_link a.idxpro_lkios:before {
    content: "\e906"
}

.idxpro_link a.idxpro_lkand:before {
    content: "\eac0"
}

.idxpro_link a.idxpro_lkau:before {
    content: "\e909"
}

.idxpro_link a.idxpro_lkaf:before {
    content: "\e908"
}

.idxpro_link a.idxpro_lkmore:before {
    content: "\e90b"
}

.idxpro_link a.idxpro_lkspt:before {
    content: "\e90c"
}

.idxpro_link a.idxpro_lkhow:before {
    content: "\e90a"
}

.idxpro_link a.idxpro_lkytb:before {
    content: "\e90d"
}

.idxpro_link a.idxpro_lkaui:before {
    content: "\e90e"
}

.idxpro_link a.idxpro_lkpt:before {
    content: "\e90f"
}

.idxpro_link a.idxpro_lkapt:before {
    content: "\e910"
}

.idxpro_link a.idxpro_lksdcard:before {
    content: "\e911"
}

.idxpro_link a.idxpro_lkunlock:before {
    content: "\e912"
}

.idxpro_link a.idxpro_lkfrp:before {
    content: "\e913"
}

.idxpro_link a.idxpro_lkrepair:before {
    content: "\e914"
}

.idxpro_link a.idxpro_lkitunes:before {
    content: "\e915"
}

.idxpro_box>img {
    max-width: 600px;
    height: auto;
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    z-index: 5
}

.idxpro_box>img.idxpro_img2,
.idxpro_box>img.idxpro_img4 {
    bottom: 10px
}

.idxpro_develop {
    width: 1400px;
    height: 655px;
    margin: 50px auto 0;
    background: url(../jpg/idxpro_worldmap.jpg) center center no-repeat;
    background-size: 1321px 655px;
    overflow: hidden
}

.idxpro_dlop {
    position: absolute;
    z-index: -1;
    transition: transform .3s linear;
    -webkit-transition: transform .3s linear;
    -moz-transition: transform .3s linear;
    -o-transition: transform .3s linear;
    -ms-transition: transform .3s linear
}

.idxpro_dlop1 {
    width: 580px;
    height: 349px;
    background: url(../png/idxpro_map1.png) top center no-repeat;
    background-size: cover;
    left: 30px;
    top: 15px
}

.idxpro_dlop2 {
    width: 203px;
    height: 333px;
    background: url(../png/idxpro_map2.png) top center no-repeat;
    background-size: cover;
    left: 274px;
    top: 338px
}

.idxpro_dlop3 {
    width: 280px;
    height: 174px;
    background: url(../png/idxpro_map3.png) top center no-repeat;
    background-size: cover;
    left: 600px;
    top: 60px
}

.idxpro_dlop4 {
    width: 296px;
    height: 356px;
    background: url(../png/idxpro_map4.png) top center no-repeat;
    background-size: cover;
    left: 561px;
    top: 225px
}

.idxpro_dlop5 {
    width: 524px;
    height: 416px;
    background: url(../png/idxpro_map5.png) top center no-repeat;
    background-size: cover;
    left: 743px;
    top: 45px
}

.idxpro_dlop6 {
    width: 251px;
    height: 228px;
    background: url(../png/idxpro_map6.png) top center no-repeat;
    background-size: cover;
    left: 1105px;
    top: 410px
}

.idxpro_dlop.checked {
    transform: translate(-3px, -3px) scale(1.05)
}

.idxpro_dlop1.checked {
    background: url(../png/idxpro_mapcl1.png) top center no-repeat;
    background-size: cover
}

.idxpro_dlop2.checked {
    background: url(../png/idxpro_mapcl2.png) top center no-repeat;
    background-size: cover
}

.idxpro_dlop3.checked {
    background: url(../png/idxpro_mapcl3.png) top center no-repeat;
    background-size: cover
}

.idxpro_dlop4.checked {
    background: url(../png/idxpro_mapcl4.png) top center no-repeat;
    background-size: cover
}

.idxpro_dlop5.checked {
    background: url(../png/idxpro_mapcl5.png) top center no-repeat;
    background-size: cover
}

.idxpro_dlop6.checked {
    background: url(../png/idxpro_mapcl6.png) top center no-repeat;
    background-size: cover
}

.idxpro_deve {
    margin-top: 140px
}

.idxpro_defig {
    float: left
}

.idxpro_defig1 {
    width: 25%
}

.idxpro_defig2 {
    width: 27%
}

.idxpro_defig3 {
    width: 30%
}

.idxpro_defig4 {
    width: 18%
}

.idxpro_deico {
    width: 140px;
    height: 140px;
    margin: 0 auto;
    background: #fff;
    border-radius: 140px;
    position: relative;
    box-shadow: 0 0 30px #e5ecf8
}

.idxpro_deico>img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 5
}

.idxpro_defig>h5 {
    font-size: 50px;
    color: #111;
    font-weight: 700;
    margin-top: 10px
}

.idxpro_defig>p {
    font-size: 18px;
    color: #111;
    margin-top: 10px
}

.idxpro_defig span {
    height: 67px;
    overflow: hidden;
    font-size: inherit;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    margin: -9px 3px 0 0
}

.idxpro_defig span em {
    height: 67px;
    display: block;
    line-height: 67px;
    font-size: inherit;
    font-weight: 700;
    font-style: normal
}

.idxpro_deve.anima .idxpro_deyear span em {
    animation: tratop 1.5s ease-in-out forwards;
    -webkit-animation: tratop 1.5s ease-in-out forwards;
    -moz-animation: tratop 1.5s ease-in-out forwards;
    -o-animation: tratop 1.5s ease-in-out forwards;
    -ms-animation: tratop 1.5s ease-in-out forwards
}

.idxpro_deve.anima .idxpro_decount span em {
    animation: tratop 1.6s ease-in-out forwards;
    -webkit-animation: tratop 1.6s ease-in-out forwards;
    -moz-animation: tratop 1.6s ease-in-out forwards;
    -o-animation: tratop 1.6s ease-in-out forwards;
    -ms-animation: tratop 1.6s ease-in-out forwards
}

.idxpro_deve.anima .idxpro_deuser span em {
    animation: tratop 1.8s ease-in-out forwards;
    -webkit-animation: tratop 1.8s ease-in-out forwards;
    -moz-animation: tratop 1.8s ease-in-out forwards;
    -o-animation: tratop 1.8s ease-in-out forwards;
    -ms-animation: tratop 1.8s ease-in-out forwards
}

.idxpro_deve.anima .idxpro_detech span em {
    animation: tratop 2s ease-in-out forwards;
    -webkit-animation: tratop 2s ease-in-out forwards;
    -moz-animation: tratop 2s ease-in-out forwards;
    -o-animation: tratop 2s ease-in-out forwards;
    -ms-animation: tratop 2s ease-in-out forwards
}

@keyframes tratop {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(-536px)
    }
}

.idxmedia {
    max-width: 1400px;
    margin: -100px auto 0
}

.slidertext {
    width: 100%;
    height: 260px;
    background: #fff;
    box-shadow: 0 0 30px #e5ebf6;
    border-radius: 10px;
    position: relative
}

.slidertext:before {
    width: 75px;
    height: 84px;
    content: "";
    display: block;
    background: url(../png/idxpro_quoft.png) no-repeat;
    background-size: 100% auto;
    position: absolute;
    left: 80px;
    top: 65px
}

.slidertext:after {
    width: 75px;
    height: 84px;
    content: "";
    display: block;
    background: url(../png/idxpro_quont.png) no-repeat;
    background-size: 100% auto;
    position: absolute;
    right: 70px;
    bottom: 40px
}

.slidertext p {
    width: 840px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(.9);
    position: absolute;
    z-index: -1;
    opacity: 0;
    text-align: center;
    font-size: 20px;
    color: #333;
    line-height: 1.6;
    transition: all linear .4s;
    font-weight: 700
}

.slidertext p.active {
    opacity: 1;
    z-index: 2;
    transform: translate(-50%, -50%) scale(1)
}

.slidertext p>em {
    font-size: 16px;
    color: #888;
    font-style: italic;
    display: block;
    margin-top: 20px
}

.slidertext p>em>a {
    font-size: inherit;
    color: #2375ff;
    margin-left: 5px;
    font-style: italic
}

.idxme_progress {
    width: 140px;
    height: 4px;
    border-radius: 4px;
    background: #111;
    position: absolute;
    bottom: -4px;
    left: 475px;
    z-index: 2;
    transition: left .3s linear
}

.idxme_progress:after {
    width: 0;
    height: 0;
    content: "";
    display: block;
    border: 5px solid transparent;
    border-top: 5px solid #111;
    position: absolute;
    display: block;
    left: calc(50% - 5px);
    bottom: -10px;
    z-index: 3
}

.sliderimg {
    text-align: center;
    margin-bottom: 50px;
}

.sliderimg span {
    display: inline-block;
    height: 70px;
    margin: 0 66px 0 1px;
    cursor: pointer;
    background: url(../png/idxpro_marksha-3.png) top center no-repeat
}

.sliderimg span:nth-child(1),
.slidertext p:nth-child(1) span {
    width: 240px;
    background-position: 0 0
}

/* .sliderimg span:nth-child(2),
.slidertext p:nth-child(2) span {
    width: 193px;
    background-position: -303px 0
} */

.sliderimg span:nth-child(2),
.slidertext p:nth-child(2) span {
    width: 193px;
    background-position: -915px 0
}


.sliderimg span:nth-child(3),
.slidertext p:nth-child(3) span {
    width: 200px;
    background-position: -566px 0
}

.sliderimg span:nth-child(4),
.slidertext p:nth-child(4) span {
    width: 66px;
    background-position: -831px 0
}

.sliderimg span:nth-child(5),
.slidertext p:nth-child(5) span {
    width: 104px;
    background-position: -960px 0
}

.sliderimg span:nth-child(6),
.slidertext p:nth-child(6) span {
    width: 230px;
    background-position: -1120px 0
}

.sliderimg span:nth-child(6) {
    margin-right: 0
}

.sliderimg .imgclick {
    background: url(../png/idxpro_markcli-3.png) top center no-repeat
}

.slidertext p span {
    display: none;
    height: 70px;
    margin: 20px auto 10px;
    background: url(../png/idxpro_markcli-3.png) top center no-repeat
}

.slidertext ul {
    display: none;
    text-align: center;
    height: 15px;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 20px;
    z-index: 5
}

.slidertext li {
    cursor: pointer;
    display: inline-block;
    vertical-align: middle;
    width: 18px;
    height: 5px;
    border-radius: 4px;
    background-color: #e4ebf8;
    margin: 5px;
    cursor: pointer;
    transition: .3s ease-in-out
}

.slidertext li.circle {
    background: linear-gradient(to right, #2375ff, #d7e6ff);
    background-color: #d7e6ff;
    width: 35px
}

.idxmemat {
    width: 100%;
    height: 349px;
    margin-top: 100px;
    background: url(../jpg/idxpro_matbg.jpg) #353535 top center no-repeat;
    background-size: cover;
    overflow: hidden
}

.idxtitle.white {
    max-width: 800px;
    margin-top: 80px
}

.idxtitle.white h2 {
    color: #fff;
    font-size: 36px
}

.idxtitle.white p {
    color: rgba(255, 255, 255, .7);
    font-size: 16px;
    margin-top: 25px
}

.idxmemat .idxpro_link a {
    font-size: 20px;
    margin: 5px 35px
}

.idxmemat .idxpro_link a:after {
    font-size: 16px
}

.idxmemat .idxpro_link a:before {
    font-size: 18px;
    margin: 1px 8px 0 0
}

.idxmemat .idxpro_link a>span {
    left: 26px
}

.idxmemat .idxpro_link a:hover span {
    width: calc(100% - 17px)
}

.idx_article {
    width: 100%;
    height: 411px
}

.idx_article .idx_articlebg_left {
    width: 180px;
    height: 359px;
    position: absolute;
    top: o;
    left: 0;
    opacity: .3
}

.idx_article .idx_articlebg_right {
    width: 188px;
    height: 411px;
    position: absolute;
    top: o;
    right: -14px;
    opacity: .3
}

.idx_article .idx_article_box {
    width: 1400px;
    height: 411px;
    margin: 0 auto
}

.idx_article .idx_article_box .idx_article_left {
    width: 930px;
    height: 411px;
    float: left
}

.idx_article_left>div {
    width: 465px;
    height: 411px;
    float: left;
    box-sizing: border-box;
    padding-left: 10px
}

.idx_article_left>div p {
    font-size: 16px;
    color: #000;
    font-weight: 700;
    margin-top: 54px;
    position: relative;
    text-align: left
}

.icon_hand {
    vertical-align: middle;
    margin-right: 6px;
    width: 28px;
    height: 38px;
    position: relative;
    top: -5px
}

.idx_article_need {
    background: url(../png/idx_article_need_bg.png) no-repeat 0 0/100% 100%
}

.idx_article_need ul li {
    text-align: left;
    font-size: 14px;
    margin-top: 11px;
    box-sizing: border-box;
    padding-left: 19px;
    position: relative
}

.idx_article_need ul li span {
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 4px;
    background: rgba(51, 51, 51, .65);
    vertical-align: middle;
    margin-left: 5px;
    margin-right: 10px;
    position: absolute;
    left: 0;
    top: 8px
}

.idx_article_left>div ul li a {
    color: rgba(51, 51, 51, .65);
    font-size: 14px
}

.idx_article_need ul li:hover span {
    background: #2375ff
}

.idx_article_left>div ul li:hover a {
    color: #2375ff;
    text-decoration: underline
}

.idx_article_hot {
    background: url(../png/idx_article_hot_bg.png) no-repeat 0 0/100% 100%
}

.idx_article_hot ul {
    text-align: left;
    box-sizing: border-box
}

.idx_article_hot ul li {
    display: inline-block;
    padding: 5px 10px;
    margin-top: 10px;
    width: 160px;
    text-align: left
}

.idx_article_hot ul li a {
    font-size: 14px
}

.idx_article .idx_article_box .idx_article_right {
    width: 460px;
    height: 411px;
    float: right;
    box-sizing: border-box;
    padding-left: 10px;
    background: url(../png/idx_article_right_bg.png) no-repeat 0 0/100% 100%
}

.idx_article_right p {
    font-size: 16px;
    color: #000;
    font-weight: 700;
    margin-top: 54px;
    position: relative;
    text-align: left;
    vertical-align: middle
}

.icon_tv {
    vertical-align: middle;
    position: relative;
    top: -2px;
    margin-right: 6px
}

.idx_article_right span {
    color: rgba(51, 51, 51, .65);
    font-size: 14px;
    text-align: left;
    display: block;
    margin-top: 20px;
    margin-bottom: 20px
}

.idx_article_right .idx_video_box {
    width: 450px;
    height: 250px
}

.idx_video_box>div {
    width: 150px;
    float: left;
    box-sizing: border-box;
    padding: 5px
}

.idx_video_box>div a {
    display: block;
    text-align: left;
    color: rgba(51, 51, 51, .65);
    font-size: 14px;
    text-indent: 0
}

.idx_video_box>div a img {
    width: 94%;
    margin-bottom: 10px;
    transition: all .3s linear
}

.idx_video_box>div a:hover img {
    transform: scale(1.05)
}

.idx_video_box>div a:hover {
    color: #333
}

.ftsubscribe>a {
    margin-top: 3px;
    position: absolute;
    top: 0;
    right: 5px
}

.ftsubscribe>input {
    width: calc(100% - 89px);
    margin-top: 0
}
/* 2023/3/24 */
.ata_more{max-width:1500px;margin:100px auto 50px;height:250px;overflow:hidden;width:96%;border:1px solid #f3f3f3;border-radius:15px;padding-bottom:40px}.ata_more_left{width:60%}.ata_more_right{width:39%}.ata_more_left>p,.ata_more_right>p{font-weight:700}.ata_more_left,.ata_more_right{display:inline-block;position:relative;overflow:hidden;vertical-align:top}.ata_more_title,.pra_more_left>ul{font-size:24px;margin:40px 0 0 35px}.ata_more_title>a,.pra_more_left>ul>a{font-size:24px;color:#333;font-weight:700;text-decoration:none;}.ata_more_left>ul{margin:20px 0 0 35px}.ata_more_title>img{vertical-align:bottom}.ata_more_left:before{content:'';position:absolute;top:40px;right:0;width:1px;height:235px;background-color:#f3f3f3}.ata_more_left>ul>li{margin-left:15px;position:relative;line-height:35px;display:inline-block;width:47%}.ata_more_left>ul>li>a{font-size:14px;color:gray;position:relative;text-decoration:none;display:inline-block;line-height:35px;}.ata_more_left>ul>li:before{content:'';position:absolute;top:15px;left:-15px;width:6px;height:6px;background-color:#2375ff;border-radius:3px}.ata_more_left>ul>li>a>span{width:0;height:1px;display:inline-block;background:#2375ff;position:absolute;left:0;bottom:-3px;display:block;transition:width .3s linear;-webkit-transition:width .3s linear;-moz-transition:width .3s linear;-o-transition:width .3s linear;-ms-transition:width .3s linear}.ata_more_left>ul>li>a:hover span{width:calc(100% - 1px)}.ata_more_left>ul>li>a:hover{color:#2375ff}.ata_tipsbox>a{display:inline-block;font-size:15px;color:gray;padding:0 25px;background-color:rgba(238,244,255,.8);line-height:25px;border-radius:20px;margin-right:5px;margin-top:13px;text-decoration:none}.ata_tipsbox{margin:15px 0 0 35px}.ata_tipsbox>a:hover{color:#2375ff}.ata_more_left>p,.ata_more_left>ul{margin-left:35px}.banner_logo{position:absolute;top:4px;margin-left:10px}.title_logo{display:none}

@media only screen and (-webkit-min-device-pixel-ratio:1.5),
only screen and (min--moz-device-pixel-ratio:1.5),
only screen and (-o-min-device-pixel-ratio:3/2),
only screen and (min-device-pixel-ratio:1.5) {
    .idxprev:after {
        background: url(../png/idxprev%402x.png) no-repeat;
        background-size: 15px 27px
    }

    .idxnext:after {
        background: url(../png/idxnext%402x.png) no-repeat;
        background-size: 15px 27px
    }

    .banner1 {
        background: #f3f3f3 url(../png/idx_atbanbg%402x.png) bottom center no-repeat;
        background-size: cover
    }

    .banner2 {
        background: #e0faff url(../png/idx_prbanbg%402x.png) bottom center no-repeat;
        background-size: cover
    }

    .banner3 {
        background: #f3f3f3 url(../png/idx_aubanbg%402x-3.png) bottom center no-repeat;
        background-size: cover
    }

    .banner4 {
        background: #1ab9a5 url(../jpg/idx_afbanbg%402x.jpg) bottom center no-repeat;
        background-size: cover
    }

    .banner5 {
        background: #aad8f0 url(../jpg/idx_ptbanbg%402x.jpg) bottom center no-repeat;
        background-size: cover
    }

    .banner6 {
        background: #aad8f0 url(../jpg/idx_aptbanbg%402x.jpg) bottom center no-repeat;
        background-size: cover
    }

    .banner7 {
        background: #daffde url(../png/idx_dkbanbg%402x-3.png) bottom center no-repeat;
        background-size: cover
    }

    .slidertext:before {
        background: url(../png/idxpro_quoft%402x.png) no-repeat;
        background-size: 100% auto
    }

    .slidertext:after {
        background: url(../png/idxpro_quont%402x.png) no-repeat;
        background-size: 100% auto
    }

    .sliderimg span {
        background: url(../png/idxpro_marksha%402x-3.png) top center no-repeat;
        background-size: cover
    }

    .slidertext p span {
        background: url(../png/idxpro_markcli%402x-3.png) top center no-repeat;
        background-size: cover
    }

    .idxmemat {
        background: url(../jpg/idxpro_matbg%402x.jpg) #353535 top center no-repeat;
        background-size: cover
    }
}

@media screen and (max-width:1700px) {
    .idxpro_img2 {
        margin-top: -20px
    }
}

@media screen and (max-width:1534px){.ata_more{height:auto}.note_box li{float:none}.function_sec li{margin:0 4px 20px}}

@media screen and (max-width:1500px) {
    .idxpro_box {
        min-height: 450px
    }

    .idxprev {
        left: 4%
    }

    .idxnext {
        right: 4%
    }

    .ata_more{width:95%;margin:30px 2.5% -25px;height:auto}.ata_more_left:before{height:100%}.ata_more{margin-top:50px}.ata_more_left>p,.ata_more_left>ul{margin-left:0}.ata_more_title>a,.pra_more_left>ul>a{font-size:22px}
}

@media screen and (max-width:1400px) {
    .idxpro_box {
        min-height: 470px
    }

    .idxmedia {
        width: 96%
    }

    .slidertext {
        height: 300px
    }

    .slidertext p {
        width: 80%;
        top: 40%
    }

    .slidertext ul,
    .slidertext p span {
        display: block
    }

    .idxme_progress,
    .sliderimg {
        display: none
    }

    .slidertext:before {
        left: 20px;
        top: 20px
    }

    .slidertext:after {
        right: 20px;
        top: auto;
        bottom: 20px
    }

    .idxpro_develop {
        width: 100%;
        height: 655px;
        background: url(../jpg/idxpro_worldmap.jpg) center center no-repeat;
        background-size: cover;
        overflow: hidden
    }

    .idxpro_dlopmap {
        display: none
    }

    .idxpro_deve {
        width: 96%
    }

    .idxpro_box>img.idxpro_img1 {
        width: 72%
    }

    .idxpro_box>img.idxpro_img3 {
        width: 70%
    }

    .idx_article .idx_article_box {
        width: 100%
    }

    .idx_article .idx_article_box .idx_article_left {
        width: 67%
    }

    .idx_article .idx_article_box .idx_article_right {
        width: 33%
    }

    .idx_article_left>div {
        width: 49%
    }

    .idx_article_right .idx_video_box {
        width: calc(100% - 10px);
        height: 150px
    }

    .idx_video_box>div {
        width: 33%
    }
}

@media screen and (max-width:1228px) {
    .idx_article_hot ul {
        padding-left: unset
    }
}

@media screen and (max-width:1200px) {
    .idxpro_box {
        min-height: 430px
    }
}

@media screen and (max-width:1154px) {
    .idx_article_left>div {
        width: 58%
    }

    .idx_article_left>.idx_article_hot {
        padding-left: 30px;
        width: 40%
    }

    .idx_article_hot ul li {
        padding: unset;
        margin-top: 7px
    }
}

@media screen and (max-width:1100px) {
    .idxpro_box {
        min-height: 400px
    }
}

@media screen and (max-width:1024px){.ata_more_left>ul>li{width:95%}}

@media screen and (max-width:980px) {

    .banner,
    .bannerbox {
        display: none
    }

    .wrap h2 {
        font-size: 34px
    }

    .wrap h3 {
        font-size: 28px
    }

    .idxtitle.white h2 {
        margin-top: 30px;
        font-size: 34px
    }

    .idxpro_box {
        width: 92%;
        margin: 20px auto 0;
        padding-top: 30px;
        min-height: auto
    }

    .idxpro_box>img {
        position: relative;
        bottom: 0;
        margin-top: 30px
    }

    .idxpro_box>img.idxpro_img4 {
        margin-top: 50px;
        transform: translateX(-30px)
    }

    .idxpro_box p {
        max-width: 100%
    }

    .idxmemat {
        width: 100%;
        height: auto;
        background: #353535;
        padding-bottom: 40px
    }

    .idxtitle.white {
        margin-top: 40px
    }

    .slidertext {
        height: 380px
    }

    .idxpro_deve {
        margin: 0 auto
    }

    .idxpro_defig {
        width: 46%;
        margin: 30px 2%
    }

    .idxpro_defig1 {
        margin: 28px 2%;
    }


    .idxpro_defig>h5 {
        font-size: 36px
    }

    .idxpro_defig>p {
        margin-top: 5px;
        line-height: 1.2
    }

    .idx_article {
        height: auto
    }

    .idx_article .idx_article_box {
        height: auto
    }

    .idx_article .idx_article_box .idx_article_left {
        float: unset
    }

    .idx_article .idx_article_box .idx_article_right {
        float: unset;
        padding-top: .1px;
        width: 80%;
        margin: 0 auto;
        height: 400px
    }

    .idx_article .idx_article_box .idx_article_left {
        width: 95%;
        margin: 0 auto
    }

    .ata_more_left,.ata_more_right{width:49%}.ata_more_left>ul>li{line-height:30px}
}
@media screen and (max-width:768px) {
.ata_more_left,.ata_more_right{width:95%;margin:20px 2.5%}.ata_more_right>p,.ata_more_right>div{margin-left:0}.ata_more_title{margin-top:0}.ata_more_left:before{display:none}
}

@media screen and (max-width:750px) {
    .idxpro_defig span {
        height: 50px;
        margin: -5px 3px 0 0
    }

    .idxpro_defig span em {
        height: 50px;
        line-height: 50px
    }

    @keyframes tratop {
        0% {
            transform: translateY(0)
        }

        100% {
            transform: translateY(-400px)
        }
    }
}

@media screen and (max-width:568px) {
    .wrap h1 {
        font-size: 32px
    }

    .wrap h2,
    .idxtitle.white h2 {
        font-size: 26px
    }

    .wrap h3 {
        font-size: 22px
    }

    .idxmemat .idxpro_link a {
        font-size: 16px;
        margin: 10px 10px 5px
    }

    .idxmemat .idxpro_link a:after,
    .idxmemat .idxpro_link a:before {
        font-size: 14px
    }

    .idxpro_deico {
        width: 100px;
        height: 100px
    }

    .idxtitle {
        margin-top: 40px
    }

    .idxpro_cnt {
        margin-top: 20px
    }

    .slidertext p {
        font-size: 20px;
        width: 96%
    }

    .idxpro_defig>h5 {
        font-size: 30px;
        margin-top: 15px
    }

    .idxpro_box>img {
        width: 90%
    }

    .idxpro_box>img.idxpro_img4 {
        width: 85%;
        margin-bottom: 10px;
        transform: translateX(0)
    }

    .idxpro_box>img.idxpro_img1 {
        margin-top: 20px
    }

    .idxpro_img2 {
        margin-bottom: 10px
    }

    .idxpro_box p,
    .idxtitle p {
        font-size: 16px
    }

    .idxpro_link a {
        margin: 10px 10px 5px;
        font-size: 16px
    }

    .idxhelp .idxtitle {
        margin-top: 50px
    }

    .idxpro_develop {
        background: 0 0;
        height: auto
    }

    .idxpro_defig>p {
        font-size: 12px;
        font-weight: 700
    }

    .slidertext:before,
    .slidertext:after {
        display: none
    }

    .idxmedia {
        margin-top: 50px
    }

    .slidertext {
        height: 400px
    }

    .slidertext p {
        top: 45%
    }

    .idxmemat {
        margin-top: 70px
    }

    .idxmemat .idxpro_link {
        margin-top: 25px
    }

    .idx_article .idx_article_box .idx_article_left {
        height: auto
    }

    .idx_article_left>div {
        float: unset;
        width: 80%;
        margin: 0 auto;
        padding-top: .1px;
        height: auto
    }

    .idx_article_left>.idx_article_hot {
        width: 80%
    }

    .idx_article_hot ul li {
        width: auto;
        padding: 10px
    }

    .idx_article_left>.idx_article_hot {
        padding-left: 10px
    }
}

@media screen and (max-width:420px) {
    .idx_article_hot ul li {
        width: auto;
        padding: 3px 10px
    }
}

@media screen and (max-width:360px) {
    .idxpro_defig>h5 {
        font-size: 24px
    }

    .slidertext p {
        font-size: 18px
    }

    .idxpro_defig>p {
        font-size: 16px
    }
}