@charset "utf-8";
/* CSS Document */
/*===================CSS Reset================*/
@font-face{ font-family: Montserrat-Bold; src: url(../fonts/Montserrat-Bold.ttf);}
@font-face{ font-family: Montserrat-Medium; src: url(../fonts/Montserrat-Medium.ttf);}
@font-face{font-family: Montserrat-Regular; src: url(../fonts/Montserrat-Regular.ttf);}

::selection {color:#fff;background-color: #4687f2;}
::-moz-selection {color:#fff;background-color: #4687f2;}
::-webkit-selection {color:#fff;background-color: #4687f2;}
::-webkit-scrollbar {width: 8px;height: 8px;background-color: #F5F5F5;}
::-webkit-scrollbar-track {border-radius: 10px;background-color: #E2E2E2;}
::-webkit-scrollbar-thumb {border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);background-color: #555;}

body{ font-size:100%;line-height:1.1; width:100%; position:relative; z-index: 99; font-family: Montserrat-Regular, Montserrat,"苹方", PingFangSC-Regular,"微软雅黑", sans-serif; font-weight: 400; overflow-x:hidden; background: #262626; color: #fff; }
body:before{ content: ""; display: block; width: 100%; height: 100vh; position: fixed; left: 0; top: 0; background: linear-gradient(176deg, #282B2D 0%, #000000 100%); background: url(../images/index_bg.svg) center no-repeat; background-size: cover; z-index: -1; }

/*自定义样式*/
*{ padding:0; margin:0;}
img{ max-width:100%;}
#bdshare_weixin_qrcode_dialog *,#bdshare_weixin_qrcode_dialog{ box-sizing:content-box; }
.j_tab{ display:table; width:100%; height:100%;}
.j_tab_cel{ display:table-cell; vertical-align:middle; width:100%; height:100%;}
*{ margin:0; padding:0; outline:none; box-sizing: border-box; }
a{ color:inherit;}
a:focus{ outline: none !important;}
h4, .h4, h5, .h5, h6, .h6,h1, .h1, h2, .h2, h3, .h3,p{ margin:0;}
h5{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
h5 a{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
img{ max-width:100%; max-height:100%;}
.img img{ width:100%; height:100%; transition: 1s; -webkit-transition: 1s; -moz-transition: 1s; -ms-transition: 1s; -o-transition: 1s; }
li:hover .img img{ transform: scale(1.05) rotate(.1deg); -webkit-transform: scale(1.05) rotate(.1deg); -moz-transform: scale(1.05) rotate(.1deg); -ms-transform: scale(1.05) rotate(.1deg); -o-transform: scale(1.05) rotate(.1deg); }
svg{ max-width:100%; max-height:100%;}
table{table-layout: fixed;}
.ovh{ overflow: hidden; width: 100%;}
.m{  padding: 0 5.16vw; height:100%; margin: 0 auto; display: block; position:relative;}
.pad_top{ padding-top:5rem;}
.pad_bot{ padding-bottom:5rem;}
.pad_aside{ padding-left:45px; padding-right:45px;}
.draw_h{ width: 67px !important; height: 67px !important; line-height: 65px !important; display:block; border-radius: 50%; text-align: center; position:relative;}
.draw_h:before{ content:""; display:block; width:100%; height:100%; position:absolute; left:0; top:0; border: 2px solid rgba(100%,100%,100%,.5); border-radius: 50%;}
svg.drawcircle{position:absolute;top:0;left:0;overflow: inherit;display: block;pointer-events: none;}
svg.drawcircle circle {
	fill: none; box-sizing:border-box;
	stroke-width: 2;
	stroke: none;
	stroke-dasharray: 0 , 188.49;
	stroke-dashoffset:188.49;
	transition: all .3s linear 0s;	
}
.draw_h:hover svg.drawcircle circle { 
    stroke:#fff;
	stroke-dasharray:188.49 , 0;
	stroke-dashoffset:188.49;
	-webkit-transition: all .7s cubic-bezier(0.11, 0.57, 0.58, 1);
	transition: all .7s cubic-bezier(0.11, 0.57, 0.58, 1);
}
.draw_h .icon { fill: #626262; vertical-align: middle; transition:.3s;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.draw_h:hover .icon{ fill:#0081cc;}
.txtovh2{overflow: hidden;-webkit-line-clamp: 2;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}

.ico_tgl{ margin: 0 auto; display: flex; align-items: center; justify-content: center; width: 3.875rem; height: 3.875rem;}
.ico_tgl img{ display: block;}
.ico_tgl .img02{ display: none;}
.ico_tgl:hover .img01,li:hover .ico_tgl .img01{ display: none;}
.ico_tgl:hover .img02,li:hover .ico_tgl .img02{ display: block;}

.img_zd>img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; display: block;
}
svg{ display: inline-block; vertical-align: middle;}

:focus { outline: 0;}
 input,button,a { outline:0;}
article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {display: block;}
ins {background-color: #ff9;color: #000;text-decoration: none;}
mark {background-color: #ff9;color: #000;font-style: italic;font-weight: bold;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
hr {display: block;height: 1px;border: 0;border-top: 1px solid #e3e3e3;margin: 1em 0;padding: 0;}
input,select {vertical-align: top;}
li,ul {list-style-type: none;}
img {border: none;}
a{text-decoration: none;  }
a:link,a:hover,a:active,a:visited {text-decoration: none;}
input,textarea {outline: 0;border: 0;}
textarea {resize: none;}
h1,h2,h3,h4,h5,h6,dl,dd,dt,i,em {font-weight: normal;font-style: normal;}
ul, li {list-style: none;margin: 0;padding: 0;}

.fl {float: left;}
.fr {float: right;}
.img{ overflow:hidden;}
.h5{  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.h5 a{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.clear{ clear:both;}

.pad_left{ padding-left: 10.625rem;}
/*===========================header=============================*/
#header,#nav ul li h3,.top_menu{ transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; white-space: nowrap; }
#nav ul li h3:hover{ color: #2ABECF;}
#header{ z-index:99999; width:100%; height: 3.75rem; display: flex; align-items: center; justify-content: center; position:absolute; top:0;  }
#header .m{ height:100%; width: 100%; display: flex; justify-content: space-between; max-width: inherit;}
#header .fr{ display: flex; justify-content: space-between; align-items: center;  }
#logo{ }
#logo a{ display: flex; height: 100%; align-items: center;}
#logo img{ height: 26px;  vertical-align: middle;}
#logo img.img02{ display: none;}
 
.top_menu{ margin-right: 4rem; }
.top_menu a{ color: #fff; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
.top_menu a:hover{ color: #2ABECF; text-decoration: underline;}
 
 
.aside_header{ position: fixed; z-index: 9999; left: 0; top: 0; height: 100%; width: 100px;}
.aside_header .box{ height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.aside_logo{ margin-left: 4.16vw; position: relative; top: 1.3125rem;}
.aside_logo img{ height:14px;}
.aside_header #nav ul{ transform: rotate(270deg) translateY(4.16vw) translateX(21rem); display: flex; justify-content: flex-end; flex-direction: row-reverse; transform-origin: 0%; -webkit-transform: rotate(270deg) translateY(4.16vw) translateX(2rem); -moz-transform: rotate(270deg) translateY(4.16vw) translateX(21rem); -ms-transform: rotate(270deg) translateY(4.16vw) translateX(21rem); -o-transform: rotate(270deg) translateY(4.16vw) translateX(21rem); }
.aside_header #nav ul li{ margin: 0 .75rem;font-size: .8125rem;
    font-family: Montserrat-Regular, Montserrat;
    font-weight: 400;
    color: rgba(255,255,255,0.6000);
    line-height: 1.625rem;}
    .aside_header #nav ul li.on{ 
        /* color: #FBBC00; */
        color: #fff;
    }
    .show_page02{ display: none;}
.show_page01{ width: 12rem; flex-grow: 0; flex-shrink: 0; position: absolute; left: 6rem;}
.show_page01 a{ 
    font-family: Montserrat-Regular, Montserrat;
    font-weight: 400;
    color: rgba(255,255,255,0.6000); 
    letter-spacing: 4px;}
 
/*手机导航开始*/
#m_header{ display:none; height:4.5rem; position:fixed; top:0; width:100%; z-index:9999999; transition:0s 1.5s; }
#m_header .m{ position:relative; height:100%;}
.m_user{ height:4.5rem; line-height: 4.5rem; margin-right: 4rem; color: #999;}
.m_user a{ display: inline-block; margin: 0 .625rem; color: #666;}
.m_user a svg{ width: 16px;}
.m_user a:hover{ color: #ff0000;}
.m_user a:hover svg path{ fill: #ff0000;}
#m_logo{ transition:0s 1.5s; height:100%; visibility:visible; float: left; position: relative; z-index: 1002;}
#m_logo img{ display:block; max-height: 60%;}
/*导航按钮开始*/
/*导航按钮开始*/
#nav_btn_box{ height:100%; z-index:999999999; margin-left:20px; position:fixed; height: 3.75rem; display: flex; align-items: center; right:4.16vw; top: 0; }
#nav_btn_box .m{ height: 100%; display: flex; align-items: center;}
#nav_btn_box.on{ background:none;  }
#nav_btn{}
#nav_btn .point.on .navbtn::after, #nav_btn .point.on .navbtn::before{background: #fff;}
#nav_btn{ cursor: pointer; text-align: center;z-index:99999; padding-bottom:4px; transition:.5s;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s; outline:none; box-shadow:none;}
#nav_btn .point{display: inline-block;width: 1.25rem;height: 22px; position: relative; outline:none;}
#nav_btn .point:hover .navbtn,
#nav_btn .point:hover .navbtn::after,
#nav_btn .point:hover .navbtn::before{width: 1.25rem;}
#nav_btn .navbtn{position: absolute;top: 12px;left: 0;display: inline-block;width: 1.25rem;height: 2px;-webkit-transition: all .3s ease-out 0s;-moz-transition: all .3s ease-out 0s;-ms-transition: all .3s ease-out 0s;-o-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s;background: #fff;}
#nav_btn .navbtn::after,
#nav_btn .navbtn::before{position: absolute;left: 0;display: inline-block;width: 1.25rem;height: 2px;content: '';-webkit-transition: all .3s ease-out 0s;-moz-transition: all .3s ease-out 0s;-ms-transition: all .3s ease-out 0s;-o-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s;background: #fff;}
.ny #nav_btn .navbtn::after,
.ny #nav_btn .navbtn::before{ background: #999;}
#nav_btn .navbtn::after{top: -5px;}
#nav_btn .navbtn::before{top: 5px;}
#nav_btn .point.on .navbtn{background: transparent;}
#nav_btn .point.on .navbtn::after{-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);top: 0px;}
#nav_btn .point.on .navbtn::before{-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);top: 0px;}
/*导航按钮结束*/
.m_nav_list{ width:100%; margin-bottom: 2rem; opacity: 0; visibility: hidden; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
.m_nav_list::-webkit-scrollbar {display:none}
#m_nav {
    position: fixed; z-index: 1001;
    width: 0;
    height:100vh;
    right: 0;
    top: 0;
    overflow:hidden;
    pointer-events: none;
    transition: all 0.5s cubic-bezier(0.445, 0.145, 0.355, 1);
    -webkit-transition: all 0.5s cubic-bezier(0.445, 0.145, 0.355, 1);
    -moz-transition: all 0.5s cubic-bezier(0.445, 0.145, 0.355, 1);
    -o-transition: all 0.5s cubic-bezier(0.445, 0.145, 0.355, 1);
    -ms-transition: all 0.5s cubic-bezier(0.445, 0.145, 0.355, 1);
    display: block;
    overflow: auto;
    display: flex; justify-content: space-between; flex-direction: column; padding-top: 10rem;
    align-items:center;
    }
    #m_nav:before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; 
        background: rgba(0, 68, 255, 0.802); -webkit-backdrop-filter: saturate(180%) blur(20px);
        backdrop-filter: saturate(180%) blur(20px);
        opacity: 1; z-index: -1;
        transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; } 

#m_nav::-webkit-scrollbar{ display: none;}
#m_nav.act{pointer-events: auto;top:0; width: 22.5rem; height: 100vh; }
#m_nav.act .m_nav_list{ visibility: visible; opacity: 1;}
#m_nav>ul{ width: 12.5rem; max-width: 100%;}
#m_nav>ul>li{width: 80%;overflow:hidden;padding: 0 1rem; text-align: center; font-size: 1.125rem; position: relative; overflow: hidden;}
#m_nav>ul>li+li{ margin-top: 2.25rem;}
#m_nav li h3{ line-height:1.75rem; color: #fff; padding:0; font-size:1.125rem; float:left; font-weight: bold; font-family: Montserrat-Bold, Montserrat; position: relative; transition: .3s; -webkit-transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; }
#m_nav li h3:before{ content: ""; display: block; width: 0; height: 1px; background: #2ABECF; position: absolute; right: 0; bottom: 3px; transition: .3s; -webkit-transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; }
#m_nav li:hover h3{ color: #2ABECF;}
#m_nav li:hover h3:before{ width: 100%; left:0; right: auto;}
#m_nav li{display:block;width:100%;}
.slide_nav{ position: absolute; left:0; height: 70px; z-index: 998; padding:15px; top:0; width: 100%; }
#m_nav .title .list{display:none;position:relative;width:100%;z-index:9;left:0;margin-left:0;background:none;border:0;clear: both;padding-bottom:10px;}
#m_nav .title .list span{ background:none; }
#m_nav .title .list span a:hover{ color: #014085;}
#m_nav .title .list a{display:block;font-size:1.125rem;color: #666;text-align:left;line-height:35px;height: 35px;border:0; }
/*三级导航 开始*/
#m_nav .title .list .void>a{background-size:10px; position:relative;}
#m_nav .title .list .void>a:before{ content:"·"; position:absolute; left:-1em; font-size:12px; font-weight:bold;}
#m_nav .title .list span{ position:relative; display:block;}
#m_nav .title .list span .sub{ position: static; width:100%;display: block !important; overflow:hidden;}
#m_nav .title .sub a{ background:none; font-size:.875rem; opacity:.8; min-width:50%; float:left; display:inline-block; color:#999;}
.nav_mask { position: fixed; top: 0; left: 0;width: 100%;height: 100%;z-index: 1000;background-color: rgba(0,0,0,0.01);display: none;}
#m_nav li{ transition: .5s; opacity: 0; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
#m_nav.act li{  opacity: 1; transition-delay: 0s; }

#m_nav>ul>li:after{ transition: 3s; opacity: 0; transform:scaleX(0); -webkit-transition: 3s; -moz-transition: 3s; -ms-transition: 3s; -o-transition: 3s; -webkit-transform:scaleX(0); -moz-transform:scaleX(0); -ms-transform:scaleX(0); -o-transform:scaleX(0); }
#m_nav.act>ul>li:after{ transform:scaleX(1); width: 100%; transition-delay: 1.2s; opacity: 1; transition-delay: 0s; -webkit-transform:scaleX(1); -moz-transform:scaleX(1); -ms-transform:scaleX(1); -o-transform:scaleX(1); }

.navinfo{ border-top: 1px solid rgba(255,255,255,1); width: 78%; padding: 2.5rem; visibility: hidden; opacity: 0; transition: .7s; -webkit-transition: .7s; -moz-transition: .7s; -ms-transition: .7s; -o-transition: .7s; }
#m_nav.act .navinfo{ visibility: visible; opacity: 1;}
.navinfo ul{ }
.navinfo ul li{ }
.navinfo ul li a{display: flex; height: 20px; margin-bottom: 1rem; align-items: center;}
.navinfo ul li .ico{ flex-shrink: 0; margin-right: .5rem;}
.navinfo ul li .ico svg{}
.navinfo ul li .ico svg path{ transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
.navinfo ul li p{
   font-size: .75rem;
   transition: .5s;
   font-family: Montserrat-Medium, Montserrat;
   font-weight: 500;
   color: #FFFFFF;
   line-height: 1.25rem;
   -webkit-transition: .5s;
   -moz-transition: .5s;
   -ms-transition: .5s;
   -o-transition: .5s;
}
.navinfo ul li:hover p{ color: #2ABECF; text-decoration: underline;}
.navinfo ul li:hover .ico svg path{ fill: #2ABECF;}




#section01{ padding: 5rem 0; }
#section01 .m{ display: flex; justify-content: space-between; align-items: flex-start;}
#section01 .tt.wap{ display: none;}
#section01 .tt{font-size: 2rem; margin-bottom: 2.5rem; position: relative; z-index: 1;
    /* min-width: 35rem; */
    width: 100%;
    font-family: Montserrat-Bold, Montserrat; display: inline-block;
    font-weight: bold; 
   }
#section01 .tt h3{
    background: linear-gradient(90deg,#0046FF 0%, #2ABECF 20%, #FBBC00 50%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1.2;
    white-space: pre;
    }
#section01 .tt h3:nth-child(2){ margin-right: 4rem; display: inline-block;  position: relative; }

#section01 .left-ul-flex{ display: flex;}
#section01 .left-ul-flex>li{
    background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0) 100%);
    border-radius: 4px;
    padding: 1.5rem 1rem;
    /* min-width: 310px; */
    position: relative;

}
#section01 .left-ul-flex>li:nth-child(1) {
    margin-right: 2rem;
    /* transition: all 3s ease; */

}
@keyframes hover-animation {
    0% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0) 100%); }
    7% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.01) 100%); }
    14% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.02) 100%); }
    21% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.03) 100%); }
    28% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.04) 100%); }
    35% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.05) 100%); }
    42% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.06) 100%); }
    49% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.07) 100%); }
    56% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.08) 100%); }
    63% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.09) 100%); }
    70% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.10) 100%); }
    77% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.11) 100%); }
    84% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.12) 100%); }
    91% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.13) 100%); }
    100% { background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.14) 100%); }
    
  }
  @keyframes hover-animation2 {
    0% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0) 100%); }
    7% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.005) 100%); }
    14% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.01) 100%); }
    21% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.015) 100%); }
    28% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.02) 100%);}
    35% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.025) 100%); }
    42% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.03) 100%); }
    49% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.035) 100%); }
    56% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.04) 100%); }
    63% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.045) 100%); }
    70% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.05) 100%); }
    77% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.055) 100%); }
    84% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.06) 100%); }
    91% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.07) 100%); }

    100% { background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.08) 100%); }
  }
#section01 .left-ul-flex>li:nth-child(2) {
    background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0) 100%);
    /* transition: all 3s ease; */

}
#section01 .left-ul-flex>li:nth-child(2):hover {
    /* background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.08) 100%); */
    /* background: rgba(0,203,221,0.2); */
    /* background: linear-gradient(180deg, rgba(0,203,221,0.2) 0%, rgba(0,203,221,0.08) 100%); */
    /* box-shadow: 0 0 10px 0 rgba(0,203,221,0.2); */
    animation-duration: .4s;
  animation-name: hover-animation2;
  animation-fill-mode: forwards;
}
#section01 .left-ul-flex>li:nth-child(1):hover{
    /* background: linear-gradient(180deg, rgba(31,75,255,0.3) 0%, rgba(0,70,255,0.14) 100%); */
    /* background: rgba(31,75,255,0.3); */
    /* box-shadow: 0 0 10px 0 rgba(31,75,255,0.3); */
    animation-duration: .4s;
  animation-name: hover-animation;
  animation-fill-mode: forwards;
}

#section01 .left .left-ul-flex>li .txt h5{
    color: #0090FF;
}
#section01 .left .left-ul-flex>li:nth-child(2) .txt h5{
    color: #2ABECF;
}
#section01 .left .left-ul-flex>li .right-icon{
    /* color: white; */
    width: 3.5vw;
    height: 3.5vw;
    max-width: 56px;
    max-height: 56px;
    align-self:center;
    /* margin-top: 1.9rem; */
    margin-left: 0.5rem;
    /* background: url(../images/ic_arrow_normal.svg)  no-repeat; */
    /* background: url(../images/ic_arrow_normal.svg)  no-repeat; */
    background-size: 100% 100%;
    transition: all .4s ease;
    /* text-align: center;
    line-height: 2rem;
    font-size: 1.2rem;
    margin-top: 2.5rem;
    margin-left: 10px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%; */
    /* position: absolute;
    top: 3rem;
    right: 10px; */
}
#section01 .left-ul-flex>li:hover .right-icon>div{
    /* background: rgba(255,255,255,0.2) !important; */

}
@keyframes hover-animation3 {
  

    0% {background: rgba(255, 255, 255, 0.1);  }
    10% {background: rgba(255, 255, 255, 0.11);  }
    20% {background: rgba(255, 255, 255, 0.12);  }
    30% {background: rgba(255, 255, 255, 0.13);  }
    40% {background: rgba(255, 255, 255, 0.14);  }
    50% {background: rgba(255, 255, 255, 0.15);  }
    60% {background: rgba(255, 255, 255, 0.16);  }
    70% {background: rgba(255, 255, 255, 0.17);  }
    80% {background: rgba(255, 255, 255, 0.18);  }
    90% {background: rgba(255, 255, 255, 0.19);  }

    100% { background: rgba(255, 255, 255, 0.2); } 

 
  }



#section01 .left .left-ul-flex>li .right-icon>div{
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    line-height: 100%;
    position: relative;
}
#section01 .left-ul-flex>li:hover .right-icon>div{


    animation-duration: .7s;
  animation-name: hover-animation3;
  animation-fill-mode: forwards;

}
#section01 .left .left-ul-flex>li .right-icon img{
    width: 1vw;
    height: 1vw;
    max-width: 16px;
    max-height: 16px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    /* width: 0.8rem;
    height: 0.8rem;
    margin-left: 0.6rem;
    margin-top: 0.6rem; */
}
#section01 .left ul li .ico{ width: 2.4vw; min-width: 2.2rem;}
#section01 .left ul li .ico> img{
    width: 2.4vw;
    /* height: 2.2rem; */
    min-width: 2.2rem;
    /* margin-top: 0.4rem; */
}

#icon-fixed{
    position: fixed;
    right: 0;
    bottom: 56px;
    z-index: 1000;
    font-size: 0;
    line-height: 0;
}
#icon-fixed .hover-weixin{
    width: 136px;
    height: 176px;
    position: absolute;
    top: 0;
    left: -152px;
    background: url(../images/normal/Frame.png)  no-repeat;
    background-size: 100% 100%;
    display: none;
}
#icon-fixed .normal-icon{
    width: 48px;
    height: 48px;
    background: url(../images/normal/ic_document_normal@2x.png)  no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    border-bottom: 1px solid #252525;
    vertical-align: top;
    
}
#icon-fixed .normal-icon:nth-child(2) {
    background: url(../images/normal/ic_weixin_normal@2x.png)  no-repeat;
    background-size: 100% 100%;
}
#icon-fixed .normal-icon:nth-child(3) {
    background: url(../images/normal/ic_linkedin_normal@2x.png)  no-repeat;
    background-size: 100% 100%;
    /* margin-bottom: -3px; */
}
#icon-fixed .normal-icon:nth-child(4) {
    background: url(../images/normal/ic_backtop_normal@2x.png)  no-repeat;
    background-size: 100% 100%;
    display: none;
    border-bottom: none;
    margin-top: -1px;
}
#icon-fixed .normal-icon:nth-child(1):hover {
    background: url(../images/normal/ic_document_hover@2x.png)  no-repeat;
    background-size: 100% 100%;
}
#icon-fixed .normal-icon:nth-child(2):hover {
    background: url(../images/normal/ic_weixin_hover@2x.png)  no-repeat;
    background-size: 100% 100%;
}
#icon-fixed .normal-icon:nth-child(2):hover .hover-weixin{
    display: block;
}
#icon-fixed .normal-icon:nth-child(3):hover {
    background: url(../images/normal/ic_linkedin_hover@2x.png)  no-repeat;
    background-size: 100% 100%;
    
}
#icon-fixed .normal-icon:nth-child(4):hover {
    background: url(../images/normal/ic_backtop_hover@2x.png)  no-repeat;
    background-size: 100% 100%;
    margin-top: -1px;
}
#myimg3{
    transform: rotate(0deg);
    margin-left: -2rem;
  transition: transform 0.5s ease-in-out;
}
#logo span{
    font-size: 1rem;
    display: inline-block;
    /* margin-left: 10px;
    margin-bottom: 3px; */
    font-family: Montserrat-Regular, Montserrat;
    font-weight: 400;
    /* line-height: 1.125rem; */
    line-height: 1.25rem;
    background: linear-gradient(90deg, #0046FF 0%, #2ABECF 30%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
     vertical-align: middle;
     margin: 3px 0 0 6px;
}
.mycon{font-size:1.125rem;font-family: Montserrat-Regular, Montserrat; min-width: 35%;
    font-weight: 400;
    color: rgba(255,255,255,0.6000);
    line-height: 1.75rem; margin-top: 2rem;}
.mycon .shuzi{ font-size: 1.25rem; color: #FBBC00;}
.mycon p+p{ margin-top: 1.5rem;}
#section01 .right{ margin-left: 3rem; }
#section01 .right .mycon{ margin-left: 7.8vw;}
#section01 .pic_dots{ margin-top: 4rem;}
a.arr_down{ display: block; width: .5rem; height: 4rem;}

.txtcircle{ position: relative; width: 14.58vw; height:  14.58vw;  }
.txtcircle img{ display: block; animation: roll 8s infinite linear; -webkit-animation: roll 8s infinite linear; width: 100%; height: 100%; }
.txtcircle .mask{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.txtcircle span{ display: block; width: .5625rem; height:  2.3125rem; background: #0046FF;}

@-webkit-keyframes roll {
    0% { -webkit-transform: rotate(0); transform: rotate(0) }
    to { -webkit-transform: rotate(359deg); transform: rotate(359deg) }
}

@keyframes roll {
    0% { -webkit-transform: rotate(0); transform: rotate(0) }
    to { -webkit-transform: rotate(359deg); transform: rotate(359deg) }
}

.pic_dots{  width: 9.8958vw; height: 9.8958vw;}
#section01 .left{ display: flex; flex-direction: column; justify-content: center; align-items: flex-start; margin-top: 4vw;}
#section01 .left ul{}
#section01 .left ul li{ margin-bottom: 2.5rem; flex: 1;}
#section01 .left ul li a{ display: flex;}
#section01 .left ul li .ico{ margin-right: 1rem;}
#section01 .left ul li .txt{ flex: 1;}
#section01 .left ul li .txt h5{ font-size: 2vw; margin-bottom: 12px;color: #FBBC00; line-height: 2.8vw;font-family: Montserrat-Bold, Montserrat; }
#section01 .left ul li .txt p{font-size: 1.4vw; line-height: 2.3vw; margin-bottom: 1rem;
    font-family: Montserrat-Regular, Montserrat;
    font-weight: 400;
    color: rgba(255,255,255,0.6000);
    }

.arrow_anim2 {
    display: block;
    width: 2.5rem;
    height: .5rem;
    position: relative;
    overflow: hidden;
  }

  .arrow_anim2:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/section01_arr.svg) left center no-repeat;
    position: absolute;
    left: -100%;
    top: 0;
    background-size: 2rem;
    transition: .5s;
  }

  .arrow_anim2:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/section01_arr.svg) left center no-repeat;
    position: absolute;
    left: 0;
    top: 0;
    background-size: 2rem;
    transition: .5s;
  }

  .arrow_anim2:hover:before, li:hover .arrow_anim2:before {
    left: 0;
  }

  .arrow_anim2:hover:after, li:hover .arrow_anim2:after  {
    left: 100%;
  }


#section02{  }
#section02 .offsetbox{ display: flex; justify-content: space-between; align-items: flex-start;}
#section02 .left{ width: 48%;  
}
#section02 .right{ width: 37vw; padding-top: 28rem; }
.tt_border{font-size: 5.4vw; text-align: left; margin-bottom: 3.5rem; color: #262626; line-height: 1.2;
    font-family: Montserrat-Bold, Montserrat; 
    font-weight: bold; background: -webkit-linear-gradient(#fff, #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: #262626;
    -webkit-text-stroke: 1px transparent; }
    .tt_border h3{ margin-top: -1rem; }
    .tt_border span{ -webkit-text-fill-color: #262626;}
.active .tt_border span{  -webkit-text-fill-color: #fff;}
.tt_border span.light{  -webkit-text-fill-color: #fff;}
.tt_yellow{font-size: 4.2vw; text-align: left; color: #FBBC00; line-height: 1.2;
    font-family: Montserrat-Bold, Montserrat; 
    font-weight: bold;  }
.tt_yellow h3{ margin-top: -1rem;}
.tt_yellow font{ color: #0046FF;}

.pic_anim{ width: 34rem; height: 34rem;}

#section02 .right ul{}
#section02 .right ul li{ margin-bottom: 2.5rem;}
#section02 .right ul li .box{height: 11.25rem; padding: 2rem;
    background: rgba(255,255,255,0.1);
    border-radius: 8px 8px 8px 8px;
    opacity: 1;}
#section02 .right ul li .box h5{font-size: 1rem; margin-bottom: 1rem;
    font-family: Montserrat-Bold, Montserrat;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 2.5rem; }
#section02 .right ul li .box p{ 
    font-size: 1rem; 
    font-weight: 500;
    color: rgba(255,255,255,0.6000);
    line-height: 1.75rem; }
    #section02 .right ul li .box h5>div{
        display: inline-block;
        font-size:2.4rem;
        
        -webkit-background-clip: text;
      color: transparent;
      margin-right: 5px;
        /* background: linear-gradient(to bottom, #0046FF, #2ABECF); */
        background: linear-gradient(to bottom, #0046FF, #2ABECF);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        /* color: transparent; */
        /* color:  */
    }

 
#myimg{ margin-top: -2rem; margin-left: -1rem;}
.tt_whitebold{font-size: 1.66vw;
    font-family: Montserrat-Bold, Montserrat;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 2.5rem; margin-bottom: 3rem;}
#section03{ padding-top: 7rem;}
#section03 .tt_border{ display: inline-block; background: -webkit-linear-gradient(-73deg,#2ABECF 38%,#1F4BFF 66%); font-size: 4.58rem;
    -webkit-background-clip: text;
    -webkit-text-fill-color: #262626;
    -webkit-text-stroke: 1px transparent;}
#section03 .offsetbox{ display: flex; justify-content: space-between;  }
#section03 .left{   }
#section03 .right{  display: flex; justify-content: center; align-items: flex-end;  }


.img_box{ position: relative; }
.img_box .img_db{ padding-bottom:171% !important}
.img_box >img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform:none !important;
    -webkit-transform:none !important;
    -moz-transform:none !important;
    -ms-transform:none !important;
    -o-transform:none !important;
}
 
#section04{  padding-bottom: 7.5rem; overflow: hidden;}
#section04 .offsetbox{}
#section04 .tt_yellow{ margin-bottom: 4rem;}
#section04 ul{ display: flex; padding-left: 50%; padding-right: 10vw;}
#section04 ul li{ float: left; flex: 0 0 300px;}
#section04 ul li .box{ width: 256px;}
#section04 ul li .img{  
    border-radius: 8px 8px 8px 8px; }
#section04 ul li .box h5{font-size: .875rem; text-align: center; margin-top: 1.75rem; text-transform: uppercase;
    font-family: Montserrat-Bold, Montserrat;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 1.625rem;}

#section05{ padding-top: 4rem;}
#section05 .offsetbox{ display: flex; align-items: center; justify-content: space-between;}
#section05 .right{ width: 37vw;  }

.btn_contact{
    width: 17.6875rem;
    display: block;
    height: 42px;
    text-align: center;
    background: #0046FF;
    transition: .5s;
    border-radius: 1000px 1000px 1000px 1000px;
    font-size: .875rem;
    font-weight: 500;
    color: #FFFFFF;
    text-transform: uppercase;
    line-height: 42px;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.btn_contact:hover{ background: #007cff;}

    #section06{ }
    #section06 .offsetbox{ display: flex; justify-content: space-between;  }
    #section06 .left{ }
    #section06 .right{  display: flex; justify-content: baseline;  align-items: flex-end; }
    #section06 .tt_whitebold{ margin-top: 1.75rem;}

    #section07{ padding-top: 5rem; padding-bottom: 7.5rem; }
    #section07 .tt_yellow{ line-height: 1.1; margin-bottom: 3.5rem;}
    #section07 .txt{ display: flex; align-items: flex-start; justify-content: space-between;}
    #section07 .txt>div:nth-child(1){ width: 44.8vw; flex-grow: 0;}
    #section07 .txt>div:nth-child(2) p{ white-space: nowrap;}
    #section07 ul{ display: flex; align-items: center; flex-flow: wrap; margin: -.875rem; margin-top: 4rem; justify-content: space-between;}
    #section07 ul li{ padding: .875rem; flex-grow: 0;}
    #section07 ul li .pic{ height: 3.75rem;}

#section08{ padding-top: 7.5rem; padding-bottom: 7.5rem;}
#section08 .offsetbox{ display: flex; justify-content: space-between;}
#section08 .left{width: 45%;display: flex;flex-direction: column;align-items: flex-start;flex-grow: 0;}
#section08 .right{ width: 48%;}
#section08   .videobox01{ width:58%; align-self: flex-end;}
#section08  .videobox02{ width: 100%;}
#section08  .videobox03{ width: 79%; margin-top: 4.3125rem; margin-bottom: 5rem;}
    video{ max-width: 100%;}
.innerbox{ position: relative;}
.innerbox .mask {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      z-index: 9;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(0,0,0,0.3);
      transition: .5s;
      -webkit-transition: .5s;
      -moz-transition: .5s;
      -ms-transition: .5s;
      -o-transition: .5s;
    }
.innerbox .mask .video_btn {
      width: 4rem;
      height: 4rem;
      display: block;
    }
    #s_case{ position: relative; z-index: 9;}
    #s_case .slidebox{ height:100vh; width: 100%; position: relative; overflow: hidden; }
    #s_case .item.item01{ opacity: 1;}
    #s_case .item{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
    #s_case .item .box{ display: flex; height: 100%;}
    #s_case .item .left{ flex-grow: 1;width: 34vw; background: #2ABECF; padding: 5rem 0; flex-shrink: 0;}
    #s_case .item .right{ flex-grow: 1; padding: 5rem; background: #E2FCFF; display: flex; align-items: center; justify-content: center;color: #000;}
    #s_case .item .right .mycon{ max-width: 80%;color: #000; font-style: italic; display: flex; flex-direction: column; align-items: flex-end; font-size: 1.125rem; line-height: 2rem;font-family: Montserrat-Medium, Montserrat;
        font-weight: 500;}
    #s_case .item .right .tag{ font-size: 1.5rem;  margin-top: 5rem;
        font-family: Montserrat-Bold, Montserrat;
        font-weight: bold;
        color: #000000;
        line-height: 32px;}
        #s_case .item02 .left{ background: #0046FF;}
        #s_case .item02 .right{ background: #E3EEFF;}

        #s_case .item03 .left{ background: #FBBC00;}
        #s_case .item03 .right{ background: #FBF4DF;}

        #s_case .item04 .left{ background: #000000;}
        #s_case .item04 .right{ background: #F5F5F5;}
        .case_mao{ position: absolute; left: 0; top: 0;}

#s_case .item .case_logo,#s_case .item .mycon{ transition: .5s; transform: translateY(30px); -webkit-transform: translateY(30px); -moz-transform: translateY(30px); -ms-transform: translateY(30px); -o-transform: translateY(30px); -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
#s_case .item.act .case_logo,#s_case .item.act .mycon{ transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
        .case_logo{ max-width: 6.25rem; max-height: 5rem;}
        #s_reach{ padding: 12.25rem 0; min-height: 100vh; background: #262626;background: linear-gradient(176deg, #282B2D 0%, #000000 100%);background: url(../images/index_bg.svg) center no-repeat; background-size: cover;}
        #s_reach .tt_yellow{ margin-bottom: 5rem;}
        #s_reach .tt_yellow h3{ font-size: 3rem;
             /* background: linear-gradient(360deg, #FBBC00 40%, #2ABECF 60%, #0046FF 90%); -webkit-background-clip: text;
            -webkit-text-fill-color: transparent; */
              text-align: center; text-transform: uppercase;
           }
           #s_reach .tt_yellow h3:nth-child(2){ font-size: 2rem; margin-top: .5rem;}
        #s_reach .pic_dots{ bottom: 1rem; position: absolute; left: -6rem; width: 7.1875rem; height: 7.1875rem;}
            #n_lianxi {  }

            .el-form{ max-width: 880px; margin: 0 auto;}
            #n_lianxi .el-form-item { padding: 0 1rem;
                margin-bottom: 1rem; width:33.333%; float: left;
                
            }
            #n_lianxi .el-form-item.dbwidth{ width: 66.666%;}
            #n_lianxi .el-form-item.btnbox{ float: none; clear: both; margin: 0 auto;}
            #n_lianxi .el-form-item__label { 
                padding: 0;
                margin: 0;
                color: #fff; font-size: .75rem; line-height: 1.625rem;   font-family: Montserrat-Medium, Montserrat;
                font-weight: 500;
            }
            
            #n_lianxi .el-form-item__label span {
                color: #8C8C8C
            }
            
            #n_lianxi .el-input__inner {
                border-radius: 3px;
                height: 2.5rem !important;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                -ms-border-radius: 3px;
                -o-border-radius: 3px;
}
            
            #n_lianxi .input { 
                font-size: 14px;
                flex-grow: 1;
                width: 100%;
                color: #2D3446
            }
            
            #n_lianxi .el-input-group__append {
                position: absolute;
                bottom: 0;
                right: 0;
                border: 0;
                background: none;
                line-height: 40px;
                width: auto;
                padding: 0 6px;
                font-size: .8125rem;
            }
            
            #n_lianxi .el-input-group__append:before {
                content: "";
                display: inline-block;
                width: 1px;
                height: 24px;
                position: absolute;
                top: 8px;
                left: 0;
                background: #CBD5EE
            }
            
            #n_lianxi .el-input-group__append:hover {
                color: #22AC35
            }
            
      
#n_lianxi .btn_contact{
    width: 28.125vw;
    display: block;
    margin: 0 auto;
    margin-top: 4rem;
    height: 3rem;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0046FF;
    border: 0;
    transition: .5s;
    border-radius: 1000px 1000px 1000px 1000px;
    font-size: .875rem;
    font-weight: 500;
    color: #FFFFFF;
    text-transform: uppercase;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
 #n_lianxi .btn_contact:hover{ background: #005eff;}
 #n_lianxi .tt_yellow{ position: relative; z-index: 1; display: flex; align-items: baseline; justify-content:center; font-size: 3rem;}
 #n_lianxi .tt_yellow .box{ display: inline-block; position: relative;}
 
 #foot{ z-index: -2;
    display: none;
    background: linear-gradient(180deg, rgba(31,75,255,0.6000) 0%, rgba(0,70,255,0) 100%);}
 #foot .m{ height: 100%;}
 #foot .m .outbox{height: 100%; padding: 4.5rem 0;  display: flex; justify-content: space-between; align-items: flex-end;background: url(../images/foot_line.png) left center no-repeat; background-size: auto 80%;}
 #foot .left{}
 #foot .p{font-size: .75rem;
    font-family: Montserrat-Medium, Montserrat;
    font-weight: 500;
    color: rgba(255,255,255,0.6000);}
    #foot .p a{ color: #fff;}
    #foot .p a:hover{ color: #2ABECF;}
    #foot a{ transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
 #foot .left .foot_logo{ margin-bottom: 3.75rem;}
 .foot_logo h3{font-size: .875rem;
    font-family: Montserrat-Medium, Montserrat;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 1.3125rem;
    letter-spacing: 2px;}
 #foot .right{}
 #foot .right ul{ display: flex;}
 #foot .right ul li{ }
 #foot .right ul li+li{ margin-left: 2.5rem;}
 #foot .right ul li a{display: flex;}
 #foot .right ul li .ico{ flex-shrink: 0; margin-right: .5rem;}
 #foot .right ul li .ico svg{}
 #foot .right ul li .ico svg path{ transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
 #foot .right ul li p{
    font-size: .75rem;
    transition: .5s;
    font-family: Montserrat-Medium, Montserrat;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 1.25rem;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
    #foot .right ul li:hover p{ color: #2ABECF; text-decoration: underline;}
    #foot .right ul li:hover .ico svg path{ fill: #2ABECF;}
 

 
button{ cursor: pointer;}

.offsetbox{ padding-left: 8.8vw;}

#foot{ position: fixed; width: 100%; left: 0; bottom: 0; z-index: -1;}
#s_main{ }
.footbox{ pointer-events: none;}

#s_ad{ margin-bottom: 10rem;}
#s_ad .tt_yellow{ margin-bottom: 8.5rem;}
#s_ad .bd{ display: flex; justify-content: space-around; align-items: center; width: 1360px; max-width: 100%;}
#s_ad .bd ul{ flex-grow: 0;display: flex; max-width:33%; 
    flex-flow: wrap;
    justify-content: space-around;}
#s_ad .bd ul li{ width: 50%; padding: 1.25rem 1rem; text-align: center;}
#s_ad ul li .box{ width: 6.4375rem; max-width: 100%; margin: 0 auto; cursor: pointer;}
#s_ad ul li h5{ font-size: .75rem; margin-top: 12px; transition:.5s ; text-transform: uppercase; white-space: normal; font-family: Montserrat-Bold, Montserrat; font-weight: bold; color: rgba(255,255,255,0.5000); line-height: 23px; -webkit-transition:.5s ; -moz-transition:.5s ; -ms-transition:.5s ; -o-transition:.5s ;}
#s_ad .centervideo .box{ width: 18.625rem; background: rgba(89,89,89,0.5000); overflow: hidden; border-radius: 2rem 2rem 2rem 2rem; border: 6px solid #7A7F83; -webkit-border-radius: 2rem 2rem 2rem 2rem; -moz-border-radius: 2rem 2rem 2rem 2rem; -ms-border-radius: 2rem 2rem 2rem 2rem; -o-border-radius: 2rem 2rem 2rem 2rem;}
.centervideo .item{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
.centervideo .item video{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: fill;}
.centervideo .item.on{ opacity: 1;}
.centervideo .img_box .img_db{ padding-bottom: 212% !important; }
#s_ad .centervideo .box .currentImg{ opacity: 0; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
#s_ad .bd ul li .img_box{ position: relative;}
#s_ad .bd ul li .img_box:before{ content: ""; border: 2px solid #2ABECF; position: absolute; left: 0; top:0; width: 100%; height: 100%; box-sizing: border-box; opacity: 0; transition: .5s; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; }
#s_ad .bd ul li.on .img_box:before{ opacity: 1;}
#s_ad .bd ul li.on h5{ color: #2ABECF;}
#s_ad_wap{ margin-top: 5rem; margin-bottom: 3rem;}
#s_ad_wap .tt_yellow{ margin-bottom: 3rem;}
#s_ad_wap .item{ width: 16rem; max-width: 100%; background: rgba(89,89,89,0.5000); overflow: hidden; border-radius: 2rem 2rem 2rem 2rem; border: 4px solid #7A7F83; -webkit-border-radius: 2rem 2rem 2rem 2rem; -moz-border-radius: 2rem 2rem 2rem 2rem; -ms-border-radius: 2rem 2rem 2rem 2rem; -o-border-radius: 2rem 2rem 2rem 2rem;}
#s_ad_wap .item video{ position: absolute; left: 0; top: 0; object-fit: fill; max-width: inherit; width: 100%; height: 100%; border-radius:  1.875rem 1.875rem 1.875rem 1.875rem; -webkit-border-radius:  1.875rem 1.875rem 1.875rem 1.875rem; -moz-border-radius:  1.875rem 1.875rem 1.875rem 1.875rem; -ms-border-radius:  1.875rem 1.875rem 1.875rem 1.875rem; -o-border-radius:  1.875rem 1.875rem 1.875rem 1.875rem; }
#s_ad_wap .item img{ position: absolute; left: 0; top: 0; object-fit: fill; max-width: inherit; width: 100%; height: 100%; border-radius: 1.875rem 1.875rem 1.875rem 1.875rem; -webkit-border-radius: 1.875rem 1.875rem 1.875rem 1.875rem; -moz-border-radius: 1.875rem 1.875rem 1.875rem 1.875rem; -ms-border-radius: 1.875rem 1.875rem 1.875rem 1.875rem; -o-border-radius: 1.875rem 1.875rem 1.875rem 1.875rem; }
#s_ad_wap .img_box .img_db{padding-bottom: 200% !important;}
#s_ad_wap h5{ text-align: center; color: rgba(255,255,255,0.8); font-size: 12px; margin-top: 15px; text-transform: uppercase;}
#section08_wap{ padding-top: 4rem; padding-bottom: 4rem;}
#section08_wap .tt_yellow{ margin-bottom: 3rem;}
#section08_wap .vbox1{ display: flex; padding-right: 200px;}
#section08_wap .vbox1 .videobox01{ width: 240px; flex-shrink: 0;}
#section08_wap .vbox1 .videobox02{ flex-shrink: 0; width: 350px;}
#section08_wap .vbox1 .videobox03{ flex-shrink: 0; width: 350px;}
#section08_wap .vbox2{ display: flex; flex-direction: column; justify-content: space-between; flex-shrink: 0; width: 450px; margin-left: 30px;  }