.page-banner {
 height:410px;
 background-color:#fff
}
.page-banner-bg {
 background-image:url("../../static/images/veryxiao/activity/openClass2023/bannerH.jpg");
 background-size:1920px 410px
}
.page-banner-main {
 padding-top:0;
 height:100%
}
.page-banner-main .ban-title h1 {
 height:56px;
 line-height:56px;
 font-size:40px;
 color:#0b204c;
 font-weight:bold;
 letter-spacing:2px;
 margin-bottom:6px
}
.page-banner-main .ban-title h4 {
 height:42px;
 font-size:0;
 text-align:left;
 margin:0 0 12px
}
.page-banner-main .ban-title h4 strong {
 display:inline-block;
 vertical-align:middle;
 font-size:38px;
 color:#1966ff;
 line-height:42px;
 margin-right:8px
}
.page-banner-main .ban-title h4 span {
 display:inline-block;
 vertical-align:middle;
 height:42px;
 line-height:42px;
 font-size:24px;
 color:#fff;
 font-weight:bold;
 letter-spacing:2px;
 padding:0 16px;
 background-image:linear-gradient(90deg,#1967ff 0,#2cbeff 100%);
 background-color:#2cbeff;
 transform:skew(-10deg);
 -webkit-transform:skew(-10deg)
}
.page-banner-main .ban-title .text3 {
 height:43px
}
.page-banner-main .ban-title .text3 p {
 display:inline-block;
 height:43px;
 font-size:0;
 text-align:left;
 letter-spacing:1.5px;
 position:relative;
 line-height:42px;
 border-bottom:1px solid #0b0305;
 margin-top:0
}
.page-banner-main .ban-title .text3 p:before {
 content:'';
 position:absolute;
 left:0;
 bottom:-5px;
 width:100%;
 height:1px;
 border-bottom:1px dashed #0b0305
}
.page-banner-main .ban-title .text3 p span {
 display:inline-block;
 font-size:18px;
 color:#333;
 font-weight:500;
 line-height:42px;
 position:relative;
 padding-right:15px;
 margin-right:15px
}
.page-banner-main .ban-title .text3 p span:before {
 content:"";
 width:1px;
 position:absolute;
 left:auto;
 top:50%;
 margin-top:-8px;
 right:0;
 height:16px;
 background-color:#666
}
.page-banner-main .ban-title .text3 p span:last-child {
 padding-right:0;
 margin-right:0
}
.page-banner-main .ban-title .text3 p span:last-child:before {
 display:none
}
.big-title {
 letter-spacing:1px;
 text-align:center
}
.big-title h2 {
 color:#000;
 font-size:32px;
 line-height:46px
}
.big-title p {
 color:#3d485d;
 font-size:16px;
 line-height:28px;
 margin-top:9px
}
.big-title p a {
 color:#3d485d;
 font-size:16px
}
.big-title p a:hover {
 color:#596efb
}
.about {
 padding:80px 0 3px;
 position:relative
}
.about:before {
 content:'';
 position:absolute;
 left:0;
 bottom:0;
 width:100%;
 height:80px;
 background-color:#f2f6ff
}
.about .title1 {
 margin-top:36px
}
.about .title1 p {
 line-height:36px;
 font-size:16px;
 color:#3d485d;
 letter-spacing:1px;
 margin-bottom:26px
}
.about .yban {
 height:182px;
 background:linear-gradient(180deg,#f5f8ff,#fff);
 border-radius:2px;
 box-shadow:8px 8px 20px 0 rgba(55,99,170,.1),-8px 0 22px 0 rgba(255,255,255,.25);
 border:2px solid #fff;
 margin:33px 0 30px
}
.about .yban ul {
 text-align:center;
 font-size:0;
 padding:53px 40px 0
}
.about .yban ul li {
 display:inline-block;
 vertical-align:middle;
 width:21%;
 margin:0 2%
}
.about .yban ul li h6 {
 font-weight:bold
}
.about .yban ul li h6 b {
 height:54px;
 line-height:54px;
 font-size:50px;
 font-family:'DIN';
 display:inline-block;
 vertical-align:middle;
 background:linear-gradient(0,#586ffb,#04abff 100%);
 -webkit-background-clip:text;
 -webkit-text-fill-color:transparent
}
.about .yban ul li h6 span {
 display:inline-block;
 vertical-align:middle;
 height:54px;
 line-height:54px;
 margin-left:4px;
 position:relative;
 top:6px;
 font-size:26px;
 font-weight:bold;
 color:#596efb
}
.about .yban ul li p {
 line-height:28px;
 font-size:16px;
 color:#3d485d;
 margin-top:5px
}
.product {
 padding:62px 0 105px;
 background-color:#f2f6ff
}
.product .main {
 margin-top:50px;
 padding:45px 0 44px;
 height:auto;
 overflow:hidden;
 position:relative;
 letter-spacing:1px
}
.product .main .line-top,
.product .main .line-bottom {
 position:absolute;
 top:0;
 left:6px;
 right:6px;
 height:1px;
 background:linear-gradient(90deg,#b2bcfd,#f2f6ff,#6ecdff)
}
.product .main .line-right,
.product .main .line-left {
 position:absolute;
 left:0;
 right:0;
 top:0;
 bottom:0;
 border-radius:10px;
 border-right:1px solid #6ecdff
}
.product .main .line-left {
 z-index:1;
 border-right:0;
 border-left:1px solid #b2bcfd
}
.product .main .line-bottom {
 top:auto;
 bottom:0
}
.product .title {
 float:left;
 width:29.17%;
 height:100%;
 padding:0 0 0 3.83%;
 position:relative;
 z-index:2
}
.product .title h3 {
 height:38px;
 line-height:38px;
 position:relative
}
.product .title h3 a {
 display:block;
 line-height:38px;
 font-weight:bold;
 font-size:24px;
 color:#3d485d;
 padding-left:28px;
 position:relative
}
.product .title h3:before,
.product .title h3 a:before,
.product .title .text2 a:before {
 content:'';
 position:absolute;
 left:0;
 top:50%;
 margin-top:-6px;
 width:12px;
 height:12px;
 background-color:#487ffc
}
.product .title h3:before {
 left:auto;
 right:9px;
 margin-top:-4px;
 width:8px;
 height:8px
}
.product .title h3:after {
 content:'';
 position:absolute;
 left:29%;
 right:26px;
 top:50%;
 height:1px;
 background-color:#487ffc
}
.product .title .text1 {
 line-height:30px;
 font-size:16px;
 color:#3d485d;
 margin-top:19px
}
.product .title .text2 {
 height:auto;
 overflow:hidden;
 line-height:30px;
 font-size:16px;
 color:#3d485d;
 margin-top:23px
}
.product .title .text2 a {
 display:block;
 float:left;
 width:calc(46% - 20px);
 height:32px;
 overflow:hidden;
 line-height:32px;
 padding-left:20px;
 position:relative;
 margin-right:4%
}
.product .title .text2 a:before {
 margin-top:-2px;
 width:5px;
 height:5px
}
.product .title2 {
 float:right;
 padding:0 3.83% 0 0
}
.product .title2 h3:before,
.product .title2 h3:after,
.product .title2 h3 a:before,
.product .title2 .text2 a:before {
 background:#03acff
}
.product .title2 h3:after {
 left:42%
}
.product .main .title3 {
 float:left;
 width:298px;
 height:auto;
 overflow:hidden;
 margin-left:46px;
 padding-top:5px;
 position:relative;
 z-index:2
}
.product .main .title3 .img {
 width:100%;
 height:auto
}
.product .main .title3 h4 {
 position:absolute;
 left:4%;
 right:4%;
 top:50%;
 margin-top:-17px;
 height:34px;
 line-height:34px;
 text-align:center;
 color:#3d485d;
 font-size:24px;
 font-weight:bold
}
.product .title .text2 a:hover {
 color:#487ffc
}
.product .title2 .text2 a:hover {
 color:#03acff
}
.customers {
 padding:83px 0;
 position:relative
}
.customers:before {
 content:'';
 position:absolute;
 left:0;
 bottom:0;
 width:100%;
 height:460px;
 background:linear-gradient(120deg,#4e6492,#24375b)
}
.customers .main {
 position:relative;
 padding:36px 0 41px
}
.customers .swiper {
 overflow:hidden;
 background:#fff;
 border-radius:5px;
 box-shadow:0 0 8px 0 rgba(55,99,170,.15)
}
.customers .swiper .title {
 width:calc(100% - 124px);
 height:100%;
 overflow:hidden;
 padding:33px 62px 28px
}
.customers .swiper .swiper-slide h5,
.customers .swiper .swiper-slide h6 {
 text-align:center;
 letter-spacing:1px;
 color:#000;
 line-height:34px;
 font-size:24px
}
.customers .swiper .swiper-slide h6 {
 line-height:28px;
 font-size:16px;
 margin-top:6px
}
.customers .swiper .swiper-slide ul {
 height:auto;
 overflow:hidden;
 padding-top:26px
}
.customers .swiper .swiper-slide ul li {
 float:left;
 width:calc(16.66% - 18px);
 height:66px;
 background-color:#f2f6ff;
 position:relative;
 margin:0 9px 22px
}
.customers .swiper .swiper-slide ul li:before {
 content:'';
 width:100%;
 height:100%;
 background-image:url(../../static/images/veryxiao/about/brand.png);
 background-repeat:no-repeat;
 background-position:center;
 position:absolute;
 top:50%;
 left:50%;
 transform:translate(-50%,-50%);
 -webkit-transform:translate(-50%,-50%)
}
.customers .swiper .swiper-slide ul .icon-logo1:before {
 width:118px;
 height:35px;
 background-position:-150px -91px
}
.customers .swiper .swiper-slide ul .icon-logo2:before {
 width:41px;
 height:46px;
 background-position:-299px -232px
}
.customers .swiper .swiper-slide ul .icon-logo3:before {
 width:117px;
 height:36px;
 background-position:-5px -93px
}
.customers .swiper .swiper-slide ul .icon-logo4:before {
 width:115px;
 height:36px;
 background-position:-5px -181px
}
.customers .swiper .swiper-slide ul .icon-logo5:before {
 width:139px;
 height:29px;
 background-position:-150px -5px
}
.customers .swiper .swiper-slide ul .icon-logo6:before {
 width:77px;
 height:38px;
 background-position:-299px -51px
}
.customers .swiper .swiper-slide ul .icon-logo7:before {
 width:135px;
 height:33px;
 background-position:-5px -5px
}
.customers .swiper .swiper-slide ul .icon-logo8:before {
 width:77px;
 height:28px;
 background-position:-299px -147px
}
.customers .swiper .swiper-slide ul .icon-logo9:before {
 width:125px;
 height:18px;
 background-position:-142px -297px
}
.customers .swiper .swiper-slide ul .icon-logo10:before {
 width:136px;
 height:22px;
 background-position:-5px -265px
}
.customers .swiper .swiper-slide ul .icon-logo11:before {
 width:76px;
 height:38px;
 background-position:-299px -99px
}
.customers .swiper .swiper-slide ul .icon-logo01:before {
 width:123px;
 height:28px;
 background-position:-5px -227px
}
.customers .swiper .swiper-slide ul .icon-logo02:before {
 width:90px;
 height:36px;
 background-position:-299px -5px
}
.customers .swiper .swiper-slide ul .icon-logo03:before {
 width:112px;
 height:32px;
 background-position:-142px -139px
}
.customers .swiper .swiper-slide ul .icon-logo04:before {
 width:116px;
 height:33px;
 background-position:-130px -181px
}
.customers .swiper .swiper-slide ul .icon-logo05:before {
 width:133px;
 height:24px;
 background-position:-138px -227px
}
.customers .swiper .swiper-slide ul .icon-logo06:before {
 width:127px;
 height:19px;
 background-position:-5px -297px
}
.customers .swiper .swiper-slide ul .icon-logo07:before {
 width:135px;
 height:18px;
 background-position:-151px -265px
}
.customers .swiper .swiper-slide ul .icon-logo08:before {
 width:57px;
 height:37px;
 background-position:-299px -185px
}
.customers .swiper .swiper-slide ul .icon-logo09:before {
 width:127px;
 height:32px;
 background-position:-5px -139px
}
.customers .swiper .swiper-slide ul .icon-logo010:before {
 width:113px;
 height:37px;
 background-position:-150px -44px
}
.customers .swiper .swiper-slide ul .icon-logo011:before {
 width:122px;
 height:35px;
 background-position:-5px -48px
}
.customers .swiper .swiper-slide ul .icon-logo-more:before {
 display:none
}
.customers .swiper .swiper-slide ul .icon-logo-more span {
 width:4px;
 height:4px;
 background-color:#000;
 border-radius:2px;
 position:absolute;
 top:50%;
 left:50%;
 transform:translate(-50%,-50%);
 -webkit-transform:translate(-50%,-50%)
}
.customers .swiper .swiper-slide ul .icon-logo-more span:first-child {
 margin-left:-10px
}
.customers .swiper .swiper-slide ul .icon-logo-more span:last-child {
 margin-left:10px
}
.customers .swiper .swiper-pagination {
 height:13px;
 bottom:4px
}
.customers .swiper .swiper-pagination .swiper-pagination-bullet {
 width:30px;
 height:13px;
 position:relative;
 background:none;
 cursor:pointer;
 margin:0
}
.customers .swiper .swiper-pagination .swiper-pagination-bullet:before {
 content:'';
 position:absolute;
 left:5px;
 top:5px;
 width:20px;
 height:3px;
 background:rgba(161,179,215,.5)
}
.customers .swiper .swiper-pagination .swiper-pagination-bullet-active:before {
 background:#fff
}
.customers .layui-tab-item .text1 {
 height:34px;
 line-height:34px;
 font-size:24px;
 margin-bottom:7px
}
.customers .layui-tab-item .text2 {
 height:26px;
 line-height:26px;
 font-size:16px;
 margin-bottom:22px
}
.customers .layui-tab-item .text3 {
 height:auto;
 overflow:hidden
}
.customers .layui-tab-item .text3 p {
 float:left;
 width:17%;
 height:auto;
 overflow:hidden;
 margin-right:3%
}
.customers .layui-tab-item:nth-child(2) .text3 p {
 width:auto
}
.customers .layui-tab-item:nth-child(3) .text3 p {
 width:16%
}
.customers .layui-tab-item:nth-child(3) .text3 p:last-child {
 width:auto
}
.customers .layui-tab-item .text3 p span {
 display:block;
 height:26px;
 line-height:26px;
 font-size:16px;
 padding-left:12px;
 position:relative;
 margin-bottom:22px
}
.customers .layui-tab-item .text3 p span:before {
 content:'';
 position:absolute;
 left:0;
 top:11px;
 width:4px;
 height:4px;
 border-radius:2px;
 background:#fff
}
.certificate {
 padding:101px 0 94px;
 background:#f2f6ff
}
.certificate .swiper {
 overflow:hidden;
 position:relative;
 margin:47px -65px 0
}
.certificate .swiper .swiper-slide ul {
 overflow:hidden;
 margin:0 65px
}
.certificate .swiper .swiper-slide li {
 float:left;
 width:calc(25% - 22px);
 height:auto;
 overflow:hidden;
 padding:45px 0 50px;
 background:#fff;
 border-radius:10px;
 margin:0 11px 22px
}
.certificate .swiper .swiper-slide li .img {
 width:90%;
 height:207px;
 overflow:hidden;
 position:relative;
 margin:0 auto 46px
}
.certificate .swiper .swiper-slide li .img img {
 position:absolute;
 top:50%;
 left:50%;
 transform:translate(-50%,-50%);
 -webkit-transform:translate(-50%,-50%)
}
.certificate .swiper .swiper-slide li p {
 max-width:70%;
 height:48px;
 overflow:hidden;
 text-align:center;
 line-height:24px;
 font-size:16px;
 color:#000;
 letter-spacing:1px;
 margin:0 auto
}
.certificate .swiper .swiper-button {
 position:absolute;
 left:0;
 top:50%;
 margin-top:-20px;
 width:36px;
 height:36px;
 border-radius:50%;
 border:2px solid #fff;
 background:linear-gradient(180deg,#f2f6ff,#fff);
 box-shadow:0 0 3px rgba(55,99,170,.15)
}
.certificate .swiper .swiper-button-next {
 left:auto;
 right:0
}
.certificate .swiper .swiper-button-next:after {
 transform:rotate(180deg);
 -webkit-transform:rotate(180deg)
}
.certificate .swiper .swiper-button:after {
 content:'';
 position:absolute;
 left:50%;
 top:50%;
 margin:-5px 0 0 -3px;
 width:6px;
 height:10px;
 background-image:url(../../static/images/veryxiao/index_2023/icon-common.png);
 background-position:-79px -1px;
 background-repeat:no-repeat
}
.certificate .swiper .swiper-button:before {
 content:'';
 position:absolute;
 left:2px;
 right:2px;
 top:2px;
 bottom:2px;
 background:linear-gradient(180deg,#e6eaff,#f9faff);
 border-radius:50%
}
.certificate .swiper .swiper-button:hover:before {
 background:linear-gradient(180deg,#d2e1f7,#f6faff)
}
.certificate .swiper .swiper-button:hover:after {
 background-position:-91px -1px
}
.course {
 padding:96px 0 111px;
 position:relative;
 background:linear-gradient(180deg,#4e6492,#24375b)
}
.course .bg {
 position:absolute;
 bottom:0;
 left:50%;
 transform:translateX(-50%);
 -webkit-transform:translateX(-50%)
}
.course .big-title h2 {
 color:#fff
}
.course .main {
 margin-top:54px;
 height:auto;
 overflow:hidden
}
.course .main ul {
 float:left;
 width:514px;
 height:auto;
 overflow:hidden
}
.course .main ul li {
 margin-bottom:22px
}
.course .main ul .text1 {
 margin-bottom:71px
}
.course .main ul li .time {
 height:30px;
 line-height:30px;
 text-align:right;
 font-size:22px;
 color:#fff;
 font-weight:bold;
 position:relative;
 margin-bottom:7px
}
.course .main ul li .time svg {
 position:absolute;
 left:0;
 top:50%
}
.course .main ul li .time .stroke1 {
 stroke:#8997b2;
 stroke-width:1px;
 stroke-dasharray:8,6
}
.course .main ul li h5 {
 line-height:32px;
 text-align:left;
 font-size:22px;
 color:#fff;
 font-weight:bold;
 margin-bottom:1px
}
.course .main ul li h6 {
 max-width:95%;
 line-height:28px;
 text-align:left;
 font-size:16px;
 color:#b7c9eb;
 letter-spacing:1px
}
.course .main ul li.text1 .time {
 margin-bottom:0
}
.course .main ul li.text1 .time h5 {
 position:absolute;
 left:0;
 top:0;
 line-height:30px
}
.course .main ul li.text1 .time svg {
 left:60px
}
.course .main ul li.text2 {
 width:95.7%
}
.course .main ul li.text3 {
 width:89.9%
}
.course .main ul li.text4 {
 width:70%
}
.course .main ul li.text5 {
 width:64%
}
.course .main ul li.text5 h6 {
 max-width:100%
}
.course .main .right-text {
 float:right;
 width:520px;
 padding-top:63px
}
.course .main .right-text li.text2 {
 width:86%;
 margin-left:14%
}
.course .main .right-text li.text3 {
 width:76%;
 margin-left:24%
}
.course .main .right-text li.text4 {
 width:65%;
 margin-left:35%
}
.course .main .right-text li .time {
 text-align:left
}
.course .main .right-text li .time svg {
 left:auto !important;
 right:0 !important
}
.course .main .right-text li h5,
.course .main .right-text li h6 {
 text-align:right;
 padding-left:5%
}
.course .main .right-text li.text4 h6 {
 max-width:92%;
 padding-left:8%
}
.culture {
 /*! padding:0px; */background-image:url(../../static/images/veryxiao/about/idea-bg.jpg);
 background-position:center bottom;
 background-color:#f2f6ff;
 background-repeat:no-repeat;
 padding-bottom: 80px;
}
.culture .title1 {
 line-height:36px;
 font-size:26px;
 color:#000;
 letter-spacing:1px;
 margin-top:42px
}
.culture ul li {
 padding:39px 25px 35px 30px;
 background:#fff;
 border-radius:10px
}
.culture ul li .icon {
 margin:0 0 10px -5px;
 width:70px;
 height:70px;
 background-image:url(../../static/images/veryxiao/about/idea.png);
 background-position:0 0;
 background-repeat:no-repeat
}
.culture ul li .icon2 {
 background-position:-70px 0
}
.culture ul li .icon3 {
 background-position:-140px 0
}
.culture ul li .icon4 {
 background-position:0 -70px
}
.culture ul li .icon5 {
 background-position:-70px -70px
}
.culture ul li .icon6 {
 background-position:-140px -70px
}
.culture ul li h6 {
 line-height:32px;
 font-size:22px;
 color:#000
}
.culture ul li p {
 line-height:26px;
 font-size:16px;
 color:#3d485d;
 margin-top:9px
}
.culture ul:last-child li {
 position:relative;
 padding:44px 22px 47px 105px
}
.culture ul:last-child li .icon {
 position:absolute;
 left:22px;
 top:47px;
 margin:0
}
.main-more {
 padding:86px 0 107px
}
.main-more ul li,
.main-more ul li p span:before {
 transition:all .3s ease-in-out;
 -webkit-transition:all .3s ease-in-out
}
.main-more ul li:hover {
 background:#fff;
 border-radius:10px;
 box-shadow:0 0 21px 0 rgba(55,99,170,.2);
 transform:translateY(-10px);
 -webkit-transform:translateY(-10px)
}
.main-more ul li a {
 display:block;
 padding:20px
}
.main-more ul li .img {
 width:370px;
 height:235px;
 overflow:hidden;
 position:relative;
 border-radius:10px;
 margin-bottom:19px
}
.main-more ul li .img img {
 width:100%;
 height:100%;
 object-fit:cover;
 position:absolute;
 left:50%;
 top:50%;
 transform:translate(-50%,-50%);
 -webkit-transform:translate(-50%,-50%)
}
.main-more ul li p {
 height:30px;
 overflow:hidden;
 line-height:30px;
 text-align:left;
 letter-spacing:1px;
 color:#000;
 font-size:20px
}
.main-more ul li p span {
 float:right;
 height:30px;
 overflow:hidden;
 line-height:30px;
 font-size:18px;
 color:#888999;
 padding-right:26px;
 position:relative
}
.main-more ul li p span:before {
 content:'';
 position:absolute;
 right:10px;
 top:8px;
 width:10px;
 height:16px;
 background-image:url(../../static/images/veryxiao/about/icon.png);
 background-position:center;
 background-repeat:no-repeat
}
.main-more ul li:hover p span:before {
 transform:translateX(4px);
 -webkit-transform:translateX(4px)
}
@media only screen and (min-width:835px) {
 .about .yban ul {
  display:flex;
  flex-direction:row;
  justify-content:center;
  padding:53px 0 0
 }
 .about .yban ul li {
  width:auto;
  margin:0 4.5%
 }
 .customers .layui-tab {
  margin:40px 0 0;
  letter-spacing:1px;
  color:#fff;
  text-align:left;
  height:auto;
  overflow:hidden
 }
 .customers .layui-tab-title {
  float:left;
  width:112px;
  height:100%;
  padding-top:6px
 }
 .customers .layui-tab-title .small-line {
  position:absolute;
  left:0;
  top:30px
 }
 .customers .layui-tab-title .small-line span {
  display:block;
  width:5px;
  height:1px;
  background:#e0faff;
  margin-bottom:9px
 }
 .customers .layui-tab-title .small-line span:nth-child(5),
 .customers .layui-tab-title .small-line span:nth-child(10) {
  margin-bottom:22px
 }
 .customers .layui-tab-title li {
  display:block;
  height:28px;
  line-height:28px;
  font-size:16px;
  color:#b7c9eb;
  text-align:left;
  padding-left:25px;
  position:relative;
  margin-bottom:35px
 }
 .customers .layui-tab-title li:before {
  content:'';
  position:absolute;
  left:0;
  top:50%;
  width:11px;
  height:1px;
  background:#e0faff
 }
 .customers .layui-tab-title li.layui-this {
  color:#fff
 }
 .customers .layui-tab-title li.layui-this:before {
  left:0;
  height:2px;
  margin-top:-1px
 }
 .customers .layui-tab-title li:last-child {
  margin-bottom:0
 }
 .customers .layui-tab-content {
  margin-left:122px;
  height:100%
 }
 .customers .layui-tab-item {
  height:auto;
  overflow:hidden;
  padding:29px 16px 20px 26px;
  background:linear-gradient(90deg,rgba(103,131,191,.35),rgba(86,110,160,.25));
  border-radius:10px
 }
 .culture .even-share,
 .main-more .even-share {
  margin-left:-11px;
  margin-right:-11px;
  margin-top:32px
 }
 .culture .even-share .subelement {
  margin:0 11px 22px
 }
 .main-more .even-share .subelement {
  margin:0 1px 22px
 }
}
@media only screen and (max-width:1519px) and (min-width:835px) {
 .customers .layui-tab-item .text3 p,
 .customers .layui-tab-item:nth-child(3) .text3 p {
  width:auto
 }
 .customers .layui-tab-item:nth-child(2) .text3 p {
  margin-right:2%
 }
 .course .bg {
  width:1100px;
  bottom:25px
 }
 .certificate .swiper {
  margin-left:0;
  margin-right:0
 }
 .certificate .swiper .swiper-slide ul {
  margin:0 10px
 }
 .main-more .even-share .subelement {
  width:calc(33.33% - 2px)
 }
 .main-more ul li .img {
  width:auto;
  height:215px
 }
}
@media only screen and (max-width:834px) {
 main {
  padding-top:53px
 }
 main .max-width-1200 {
  width:calc(100% - 40px);
  padding:0 20px
 }
 .big-title {
  letter-spacing:0
 }
 .big-title p {
  line-height:30px
 }
 .page-banner {
  height:383px
 }
 .page-banner .page-banner-bg {
  background-image:url("../../static/images/veryxiao/about/banner_mobileH.jpg");
  background-size:auto 383px
 }
 .page-banner-title {
  top:auto;
  bottom:28px;
  letter-spacing:1px
 }
 .page-banner-title .text2,
 .page-banner-title .text1 {
  font-size:22px;
  font-weight:bold;
  line-height:32px;
  margin:0 8px
 }
 .page-banner-title .text1 {
  margin-top:5px
 }
 .page-banner-title .text1 span {
  display:none
 }
 .page-banner-title .text1 b {
  color:#ffdf6a
 }
 .big-title h2 {
  line-height:31px;
  font-size:21px;
  font-weight:bold
 }
 .about {
  padding:35px 0 0
 }
 .about:before {
  display:none
 }
 .about .title1 {
  margin-top:12px
 }
 .about .title1 p {
  line-height:30px;
  letter-spacing:.5px;
  margin-bottom:16px
 }
 .about .title1 p:last-child {
  margin-bottom:0
 }
 .about .yban {
  height:auto;
  overflow:hidden;
  border-radius:0;
  border:0;
  position:relative;
  background:linear-gradient(180deg,#f4f9ff,#fff);
  box-shadow:0 -1px 32px rgba(137,175,252,.26);
  margin:22px -20px 0
 }
 .about .yban:before {
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:0;
  bottom:0;
  background-image:url(../../static/images/veryxiao/about/mc-yban1.jpg);
  background-position:center bottom;
  background-size:100%;
  background-repeat:no-repeat
 }
 .about .yban ul {
  height:auto;
  overflow:hidden;
  position:relative;
  padding:0
 }
 .about .yban .text1 {
  border-bottom:2px solid #eee
 }
 .about .yban ul li {
  width:33.33%;
  margin:0;
  padding:16px 0 14px;
  position:relative
 }
 .about .yban .text2 li {
  width:100%;
  padding:18px 0 16px
 }
 .about .yban .text1 li:before {
  content:'';
  position:absolute;
  right:0;
  top:0;
  width:2px;
  height:100%;
  background-color:#eee
 }
 .about .yban .text1 li:last-child:before {
  display:none
 }
 .about .yban ul li h6 {
  height:34px
 }
 .about .yban ul li h6 b,
 .about .yban ul li h6 span {
  height:34px;
  line-height:34px;
  font-size:28px
 }
 .about .yban ul li h6 span {
  font-size:20px;
  top:3px;
  margin-left:2px
 }
 .about .yban ul li p {
  line-height:24px;
  font-size:14px;
  margin-top:2px
 }
 .product {
  padding:35px 0 0;
  background-image:url(../../static/images/veryxiao/about/mc-bg2.jpg);
  background-color:#e7eefc;
  background-position:center top;
  background-size:100%;
  background-repeat:no-repeat;
  position:relative
 }
 .product:before {
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:0;
  bottom:0;
  background-image:url(../../static/images/veryxiao/about/mc-bg21.jpg);
  background-position:center bottom;
  background-size:100%;
  background-repeat:no-repeat
 }
 .product .main {
  margin-top:25px;
  padding:15px 0;
  border-radius:5px;
  background-color:#fff
 }
 .product .main .line {
  display:none
 }
 .product .title {
  float:none;
  width:calc(100% - 50px);
  height:auto;
  overflow:hidden;
  padding:0 25px
 }
 .product .title h3 a:before {
  margin-top:-5px;
  width:10px;
  height:10px
 }
 .product .main .title3 {
  display:none
 }
 .product .main .title3 .img {
  width:88%;
  margin:0 auto
 }
 .product .main .title3 h4 {
  font-size:22px
 }
 .product .title h3 a {
  font-size:20px;
  padding-left:23px
 }
 .product .title .text1 {
  margin-top:5px
 }
 .product .title .text2 {
  height:auto;
  overflow:hidden;
  margin:5px 0 20px
 }
 .customers {
  padding:35px 0 0;
  background-image:url(../../static/images/veryxiao/about/mc-bg3.jpg);
  background-color:#e7eefc;
  background-position:center top;
  background-size:100%;
  background-repeat:no-repeat
 }
 .customers:before {
  display:none;
  height:640px
 }
 .customers .main {
  padding:25px 0 30px
 }
 .customers .swiper .title {
  width:calc(100% - 40px);
  padding:15px 20px
 }
 .customers .swiper .swiper-slide h5 {
  font-size:16px;
  line-height:26px
 }
 .customers .swiper .swiper-slide h6 {
  margin-top:0;
  line-height:22px;
  font-size:14px
 }
 .customers .swiper .swiper-slide ul {
  padding-top:15px
 }
 .customers .swiper .swiper-slide ul li {
  width:calc(33.33% - 12px);
  height:48px;
  margin:0 6px 12px
 }
 .customers .swiper .swiper-slide ul li:before {
  transform:translate(-50%,-50%) scale(.58);
  -webkit-transform:translate(-50%,-50%) scale(.58)
 }
 .customers .swiper .swiper-pagination .swiper-pagination-bullet:before {
  background:#6582be
 }
 .customers .swiper .swiper-pagination .swiper-pagination-bullet-active:before {
  background:#4e6492
 }
 .customers .layui-tab {
  overflow:initial;
  margin-top:45px;
  margin-bottom:25px;
  letter-spacing:.5px;
  position:relative
 }
 .customers .layui-tab:before {
  content:'';
  position:absolute;
  left:-20px;
  right:-20px;
  top:-25px;
  bottom:-25px;
  background:linear-gradient(120deg,#4e6492,#24375b)
 }
 .customers .layui-tab:after {
  content:'';
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background:linear-gradient(90deg,rgba(103,131,191,.35),rgba(86,110,160,.25));
  border-radius:5px
 }
 .customers .layui-tab-title {
  height:42px;
  line-height:42px;
  border-bottom:1px solid #8191b4;
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  position:relative;
  z-index:2;
  margin:5px 20px 0
 }
 .customers .layui-tab-title .small-line {
  display:none
 }
 .customers .layui-tab-title li {
  line-height:42px;
  color:#fff;
  font-size:16px;
  margin:0 6px
 }
 .customers .layui-tab-title li:before {
  content:'';
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:2px;
  background:#fff;
  transform:scale(0);
  transition:transform .3s ease-in-out
 }
 .customers .layui-tab-title li.layui-this:before {
  transform:scale(1)
 }
 .customers .layui-tab-title .small-line {
  top:19px
 }
 .customers .layui-tab-title .small-line span {
  margin-bottom:22px
 }
 .customers .layui-tab-title .small-line span:nth-child(10) {
  margin-bottom:21px
 }
 .customers .layui-tab-content {
  position:relative;
  z-index:2
 }
 .customers .layui-tab-item {
  padding:18px 20px 28px
 }
 .customers .layui-tab-item .text1 {
  display:none
 }
 .customers .layui-tab-item .text2 {
  text-align:center;
  color:#fff;
  font-size:14px;
  line-height:24px;
  height:auto;
  padding:6px 0;
  border-radius:5px;
  background:rgba(25,25,25,.09);
  margin-bottom:13px
 }
 .customers .layui-tab-item .text3 p {
  float:none;
  width:100% !important;
  margin:0 0 8px 0
 }
 .customers .layui-tab-item .text3 p span {
  float:left;
  width:calc(47% - 12px);
  height:auto;
  overflow:hidden;
  line-height:22px;
  font-size:14px;
  color:#fff;
  margin:0 3% 0 0
 }
 .customers .layui-tab-item .text3 p span:before {
  top:9px
 }
 .certificate {
  padding:35px 0
 }
 .certificate .swiper {
  margin:20px -20px 0
 }
 .certificate .swiper .swiper-slide ul {
  margin:0 15px
 }
 .certificate .swiper .swiper-slide li {
  width:calc(50% - 16px);
  padding:20px 0;
  margin:0 8px 16px
 }
 .certificate .swiper .swiper-slide li .img {
  height:123px;
  margin-bottom:10px
 }
 .certificate .swiper .swiper-slide li .img img {
  transform:translate(-50%,-50%) scale(.65);
  -webkit-transform:translate(-50%,-50%) scale(.65)
 }
 .certificate .swiper .swiper-slide li p {
  max-width:86%;
  height:44px;
  line-height:22px
 }
 .certificate .swiper .swiper-button {
  box-shadow:0 0 8px rgba(55,99,170,.15)
 }
 .course {
  padding:35px 0 25px
 }
 .course .bg {
  top:75px;
  bottom:auto;
  transform:translateX(-50%) scale(.45);
  transform-origin:center top;
  -webkit-transform:translateX(-50%) scale(.45);
  -webkit-transform-origin:center top
 }
 .course .main {
  margin-top:310px
 }
 .course .main ul {
  float:none;
  width:100%
 }
 .course .main ul li {
  width:100% !important
 }
 .course .main ul .text1 {
  margin-bottom:22px
 }
 .course .main ul li h5,
 .course .main ul li.text1 .time h5,
 .course .main ul li .time {
  font-size:20px
 }
 .course .main ul li h5 {
  font-weight:normal
 }
 .course .main ul li:nth-child(1) {
  margin-bottom:32px !important
 }
 .course .main ul li:nth-child(2) .time svg {
  left:0 !important
 }
 .culture {
  padding:35px 0;
  background-size:100%
 }
 .culture .title1 {
  margin-top:20px;
  line-height:30px;
  font-size:20px;
  padding-left:18px;
  position:relative
 }
 .culture .title1:before {
  content:'';
  position:absolute;
  left:0;
  top:5px;
  width:5px;
  height:20px;
  background-image:linear-gradient(to bottom,#5dc1ff,#617dff);
  border-radius:5px
 }
 .culture ul {
  width:100%;
  padding-bottom:10px;
  margin-top:15px
 }
 .culture ul li {
  padding-top:30px
 }
 .culture ul li:last-child {
  margin-bottom:0
 }
 .culture ul li h6 {
  font-size:18px
 }
 .culture ul:last-child li {
  padding-top:25px;
  padding-bottom:35px
 }
 .culture ul:last-child li .icon {
  top:30px
 }
 .main-more {
  padding:35px 0 28px
 }
 .main-more ul {
  width:100%;
  padding-top:20px
 }
 .main-more ul li {
  background:#fff;
  border-radius:10px;
  box-shadow:0 0 21px 0 rgba(55,99,170,.2)
 }
 .main-more ul li a {
  padding:15px 15px 20px
 }
 .main-more ul li .img {
  width:100%;
  height:185px;
  margin-bottom:10px
 }
}
@media only screen and (max-width:375px) {
 .customers .swiper .swiper-slide ul li {
  height:40px
 }
 .customers .swiper .swiper-slide ul li:before {
  transform:translate(-50%,-50%) scale(.46);
  -webkit-transform:translate(-50%,-50%) scale(.46)
 }
}
@media only screen and (max-width:320px) {
 .about .yban ul li h6 {
  height:30px
 }
 .about .yban ul li h6 b,
 .about .yban ul li h6 span {
  height:30px;
  line-height:30px;
  font-size:24px
 }
 .about .yban ul li h6 span {
  font-size:18px
 }
}