.banner { height: 100%; }
.banner .item { display: block; height: 100%; }
.banner .item { position: relative; }
.banner .owl-dots{ position: absolute; left: 0px; right: 0px; bottom: 10px; }
.banner .owl-dots span{ background:rgba(255,255,255,0.4)!important; width: 60px!important;height: 2px!important; border-radius: 3px; }
.banner .active span{ background:#cb0f1a!important;  width: 60px!important; height: 2px!important border-radius: 3px;}
.banner { position: relative; }
.banner .owl-prev{ position: absolute; left:20px; top: 47%; background: rgba(0,0,0,0.5)!important; color: #fff!important; font-size:24px!important; width: 50px!important; height: 50px!important; line-height: 40px!important; border-radius: 50px!important;}
.banner .owl-next{ position: absolute; right:20px; top: 47%; background: rgba(0,0,0,0.5)!important; color: #fff!important; font-size:24px!important; width: 50px!important; height: 50px!important; line-height: 40px!important; border-radius: 50px!important;}
.banner .owl-item .item .text{ position: absolute; width: 1200px; left: 50%; margin-left: -600px; bottom: 40px; color: #fff; opacity: 0; transition: 0.5s;  transition-delay: 0.5s;transition-timing-function: linear; } 
.banner .owl-item .item .text a{ color: #fff; text-decoration: underline;  }
.banner .active .item .text{ position: absolute; width: 1200px; left: 50%; margin-left: -600px; bottom: 50px; color: #fff;opacity: 1; } 
.banner .active .item .text .box{ float: right; padding: 15px; background: rgba(0,0,0,0.7); line-height: 1.6; font-size: 18px; text-align: right;}
.owl-carousel .owl-stage-outer{ height: 100%; }
.owl-carousel .owl-stage{ height: 100%; }
.owl-carousel.owl-drag .owl-item{ height: 100%; }
.index_banner .swiper-slide .text h1{ font-weight: bold; color: #fff; font-size: 46px;position: absolute;top: 350px; width:1200px;  left: 50%; margin-left: -600px; text-align: left; opacity: 0; transition: 0.5s;  transition-delay: 0.5s;transition-timing-function: linear; }
.index_banner .swiper-slide .text h2{ color: #fff; font-size: 24px;position: absolute; top: 430px;  width:1200px;  left: 50%; margin-left: -600px; opacity: 0; transition: 0.5s;  transition-delay: 0.8s;transition-timing-function: linear; }
.index_banner .swiper-slide-active .text h1{margin-left: -600px;  opacity: 1;top: 320px;}
.index_banner .swiper-slide-active .text h2{margin-left: -600px; opacity: 1;top: 390px;}


.video{ height: 100%; position: relative; width: 100%;min-width: 100%;min-height: 100%; overflow: hidden; }
.video:before{ content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 200px;
    position: absolute;
    z-index: 888;
    background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
    background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
    background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}
.video img{position: absolute;right: 0;bottom: 0;min-width: 100%;min-height: 100%;width: auto;height: auto;-webkit-filter: grayscale(20%);object-fit: cover;}
.video .pagewidth{ position: relative; height: 100%; }

.video .pagewidth h2{ position: absolute; left: 0px;bottom: 120px; font-size: 32px; color: #fff; font-weight: normal;  z-index: 2; line-height: 100%}
.video .pagewidth .h1{ position: absolute; left: 0px;bottom: 55px; font-size:62px; color: #fff; font-weight: bold;  z-index: 2;font-family:"Arial Black"; line-height: 100%}
.video .mouse{ border-radius: 40px; border:#fff solid 2px; z-index: 39; position: absolute; height: 30px; width: 18px; left: 50%; margin-left: -10px; bottom:60px; -webkit-animation:video 1.5s infinite linear ;}
.video .mouse span{ position: absolute; left: 50%;z-index: 39; border:#fff solid 2px; border-radius: 10px; bottom:16px;   width: 2px; height: 4px; margin-left: -3px;}

@-webkit-keyframes video {
    0%{
        bottom: 60px;
    }
    50%{
        bottom: 70px;
    }
    100%{
        bottom: 60px;
    }
}







.indexabout{ padding-top: 45px; padding-bottom: 45px; background: #ffffff; overflow: hidden;  }
.indexabout .pagewidth .title{ position: relative; height: 120px; }
.indexabout .pagewidth .title h1{ position: absolute; left: 0px; top: 30px; right: 0px;line-height: 100%;text-align: center; color: #333333; font-size: 24px; z-index: 2 }
.indexabout .pagewidth .title h2{ position: absolute; left: 0px; top: 0px; right: 0px; line-height: 100%; text-align: center; font-size: 60px;font-weight: bold; z-index: 1; color: #ededed; opacity: 0.5; text-transform: uppercase; font-family:"Arial Black"}
.indexabout .content .left{ float: left; width: 50%; }
.indexabout .content .left img{ width: 100%; display: block; border-radius: 3px; }
.indexabout .content .right{  float: left; width: 50%; }
.indexabout .content .right .text{ padding-left: 100px; position: relative; }
.indexabout .content .right .text p{ text-align: justify; font-size: 14px; line-height: 1.8em; color: #333; margin-bottom: 10px; }
.indexabout .content .right .more{ padding-left: 100px; padding-top: 20px; }
.indexabout .content .right .more a{ float: left; margin-right: 20px; height: 40px; line-height: 40px; width: 40px; border-radius: 40px; border:#9d9d9d solid 1px; font-size: 14px; color: #333; display: block; text-align: center;transition-duration: 0.3s;-moz-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; -o-transition-duration: 0.3s;
 }
.indexabout .content .right .more a:hover{ border:#446199 solid 1px;color: #fff; background: #446199; }
.indexabout .content .right h3{ position: absolute; width: 400px; transform:rotate(-90deg)scale(1); right: auto; left: -150px;  text-transform: uppercase;  text-align: right; top: 190px; font-weight: bold; font-size: 12px; color: #dddddd;}


.indexwork{ padding-top: 45px; padding-bottom: 65px; background: #f7f7f7; overflow: hidden;}
.indexwork .pagewidth .title{ position: relative; height: 120px; }
.indexwork .pagewidth .title .h1{ position: absolute; left: 0px; top: 30px; right: 0px;line-height: 100%;text-align: center; color: #333333; font-size: 24px; z-index: 2 }
.indexwork .pagewidth .title h2{ position: absolute; left: 0px; top: 0px; right: 0px; line-height: 100%; text-align: center; font-size: 60px;font-weight: bold; z-index: 1; color: #ededed; opacity: 0.5;text-transform: uppercase; font-family:"Arial Black"}
.indexwork .sub ul { text-align: center; }
.indexwork .sub ul li{ display:inline-block; width: 150px;text-align: center; }
.indexwork .sub ul li .icon{ height: 40px; margin: 0 auto; width: 40px; position: relative; margin-bottom: 10px; }
.indexwork .sub ul li .icon img.icona{ width: 40px; position: absolute; left: 0px; top: 0px; opacity: 1; }
.indexwork .sub ul li .icon img.iconb{ width: 40px; position: absolute; left: 0px; top: 0px; opacity: 0 }
.indexwork .sub ul li span{ display: block;  }
.indexwork .sub ul li a{ color: #333; font-size: 16px;font-weight: bold; text-decoration: none; }

.indexwork .sub ul li:hover .icon img.icona{ width: 40px; position: absolute; left: 0px; top: 0px; opacity: 0; }
.indexwork .sub ul li:hover .icon img.iconb{ width: 40px; position: absolute; left: 0px; top: 0px; opacity: 1 }
.indexwork .sub ul li:hover a{ color: #446199;}



.indexwork .content{ padding-top: 50px; }
.indexwork .content ul li {  height: 400px; position: relative;margin-bottom: 60px;}
.indexwork .content ul li .img{ width: 750px; position: absolute; right: 0px; overflow: hidden;  }
.indexwork .content ul li .img img{ width: 100%; display: block; transition:0.5s;}
.indexwork .content ul li .img:hover img{ width: 100%; display: block;transform:rotate(0deg)scale(1.2); }
.indexwork .content ul li .info{ width: 465px; float: left; position: absolute;left: 0px; }
.indexwork .content ul li .info h3{ position: absolute; width: 400px;  transform:rotate(-90deg)scale(1); right: -235px; text-align: right; top: 190px; font-weight: bold; font-size: 12px; color: #dddddd;}
.indexwork .content ul li .info h2{ color: #999999;font-size: 12px;line-height: 100%; margin-bottom: 15px;}
.indexwork .content ul li .info .name{font-size: 16px; font-weight: bold; padding-top: 30px; line-height: 100%; margin-bottom: 30px; }
.indexwork .content ul li .info .name a{color: #2d2d2d; }
.indexwork .content ul li .info .swiper-container{ margin-bottom: 30px; }
.indexwork .content ul li .info .swiper-container { width: auto; padding-right: 15px; height:240px;}
.indexwork .content ul li .info .swiper-slide { height: auto; text-align: justify; font-size: 14px; line-height: 1.8em; color: #333; -webkit-box-sizing: border-box; box-sizing: border-box;}
.indexwork .content ul li .info .description .swiper-slide p{ margin-bottom: 10px; }
.indexwork .content ul li .info .more a{ color: #2d2d2d; font-size: 14px; font-weight: bold; }
.indexwork .content ul li .info .more a:hover{ color: #446199; text-decoration: none;}
.indexwork .content ul li .info .more  a i{transition: 0.3s;}
.indexwork .content ul li .info .more  a:hover i{ text-indent: 5px; }



.indexwork .content ul li:nth-child(2n) .img{ width: 750px; position: absolute; right: auto; left: 0px; }
.indexwork .content ul li:nth-child(2n) .info{ width: 450px; float: left; position: absolute; left: auto; right: 0px; }
.indexwork .content ul li:nth-child(2n) .info h3{ position: absolute; width: 400px; transform:rotate(-90deg)scale(1); right: auto; left: -250px; text-align: right; top: 190px; font-weight: bold; font-size: 12px; color: #dddddd;}
.indexwork .morework a{ text-align: center; color: #2d2d2d; font-size: 14px; font-weight: bold; border-radius: 50px; border:#999999 solid 1px; padding: 10px 30px; text-decoration: none; transition: 0.3s; }
.indexwork .morework a:hover{ border:#446199 solid 1px;color: #fff; background: #446199; }
.indexwork .morework a i{ transition: 0.3s;}
.indexwork .morework a:hover i{ text-indent: 10px; }
.indexwork .morework{ text-align: center; }


.indexcooperations{ padding-top: 45px; padding-bottom: 45px; background: #ffffff; overflow: hidden; }
.indexcooperations .pagewidth .title{ position: relative; height: 120px; }
.indexcooperations .pagewidth .title .h1{ position: absolute; left: 0px; top: 30px; right: 0px;line-height: 100%;text-align: center; color: #333333; font-size: 24px; z-index: 889 }
.indexcooperations .pagewidth .title h2{ position: absolute; left: 0px; top: 0px; right: 0px; line-height: 100%; text-align: center; font-size: 60px;font-weight: bold; z-index:888; color: #ededed; opacity: 0.5; text-transform: uppercase; font-family:"Arial Black"}
.indexcooperations .cooperationsoimg{  margin-bottom:70px;  }
.indexcooperations .cooperationsoimg .swiper-slide img{ display: block; width: 100%; border-radius: 3px; overflow: hidden; }
.indexcooperations .cooperationscontent .swiper-slide{ text-align: center;}

.indexcooperations .cooperationscontent .swiper-slide .icon{ height: 44px; width: 44px; position: relative; margin: 0 auto; margin-bottom: 10px; }
.indexcooperations .cooperationscontent .swiper-slide .icon img.icona{width:44px; position: absolute; left: 0; top: 0; opacity: 1; }
.indexcooperations .cooperationscontent .swiper-slide .icon img.iconb{width:44px; position: absolute; left: 0; top: 0;  opacity: 0; }
.indexcooperations .cooperationscontent .swiper-slide:hover .icon img.icona{width:44px; position: absolute; left: 0; top: 0; opacity: 0; }
.indexcooperations .cooperationscontent .swiper-slide:hover .icon img.iconb{width:44px; position: absolute; left: 0; top: 0;  opacity: 1; }
.indexcooperations .cooperationscontent .swiper-slide img{width:44px; }
.indexcooperations .cooperationscontent .swiper-slide span{ display: block;color: #333; font-size: 16px;font-weight: bold;  }
.indexcooperations .cooperationscontent .swiper-slide:hover span{ display: block;color: #446199; font-size: 16px;font-weight: bold;  }
.indexcooperations .cooperationscontent .swiper-slide  a{ text-decoration:none;  }
.indexcooperations .cooperationscontent .swiper-container{ padding-bottom: 50px; }
.indexcooperations .cooperationsoimg .swiper-pagination{ display: none;}
.indexcooperations .cooperationscontent .swiper-pagination{ display: none;}




.indexnews{ padding-top: 45px; padding-bottom: 45px; background: #f7f7f7; overflow: hidden;}
.indexnews .pagewidth .title{ position: relative; height: 120px; }
.indexnews .pagewidth .title .h1{ position: absolute; left: 0px; top: 30px; right: 0px;line-height: 100%;text-align: center; color: #333333; font-size: 24px; z-index: 889 }
.indexnews .pagewidth .title h2{ position: absolute; left: 0px; top: 0px; right: 0px; line-height: 100%; text-align: center; font-size: 60px;font-weight: bold; z-index: 888; color: #ededed; opacity: 0.5;text-transform: uppercase; font-family:"Arial Black"}
.indexnews .swiper-slide img{ display: block; width: 100%; border-radius: 3px; overflow: hidden; }
.indexnews .swiper-slide .info{ background: #fff; padding: 20px; height: 140px; } 
.indexnews .swiper-slide .info .date{ font-size: 14px; color: #999;margin-bottom: 10px; }
.indexnews .swiper-slide .info .name{ font-size: 16px; color: #333;margin-bottom: 10px; font-weight: bold; }
.indexnews .swiper-slide .info .name a{ color: #333;text-decoration:  none; }
.indexnews .swiper-slide .info .description{ color: #666666; line-height: 1.8em; font-size: 14px; }
.indexnews .swiper-container{ padding-bottom: 50px; }






.indexpartner{ padding-top: 45px; padding-bottom: 45px; background: #ffffff; overflow: hidden; }
.indexpartner .pagewidth .title{ position: relative; height: 120px; }
.indexpartner .pagewidth .title .h1{ position: absolute; left: 0px; top: 30px; right: 0px;line-height: 100%;text-align: center; color: #333333; font-size: 24px; z-index: 889 }
.indexpartner .pagewidth .title h2{ position: absolute; left: 0px; top: 0px; right: 0px; line-height: 100%; text-align: center; font-size: 60px;font-weight: bold; z-index: 888; color: #ededed; opacity: 0.5;text-transform: uppercase; font-family:"Arial Black"}
.indexpartner .swiper-slide{text-align: center; padding-top: 10px; padding-bottom: 10px;}
.indexpartner .swiper-slide img{ height: 44px;-webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.6; transition:0.3s; }
.indexpartner .swiper-slide img:hover{ height: 44px;-webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1; transform:rotate(0deg)scale(1.2);}
.indexpartner .swiper-container{ padding-bottom: 50px; }



.detailbanner{ height: 500px; width: 100%; }
.detailbanner .pagewidth{ position: relative; opacity: 1;transition:0.5s; }
.detailbanner .pagewidth h1{ position: absolute; left: 0px; right: 0px; top:280px; color: #fff; font-size: 36px; text-align: center; text-shadow: 1px 2px 2px rgba(0,0,0,0.1);}
.detailbanner .pagewidth p{ position: absolute; left: 0px; right: 0px; top:340px; text-transform: uppercase; color: #fff; font-weight: bold; font-size: 16px; text-align: center; text-shadow: 1px 2px 2px rgba(0,0,0,0.1);}
.detailbanner .hidden{ opacity: 0; }


/*头条*/
.detailtwomenu{ height: 80px; line-height: 80px; background: #f5f5f5; text-align: center;  }
.detailtwomenu ul li {height: 80px; line-height: 80px; display: inline-block; text-align: center; padding-left: 80px; padding-right: 40px;}
.detailtwomenu ul li.active{background: #fff; }
.detailtwomenu ul li a{color: #333; font-size: 16px; text-align: left; font-weight: bold; position: relative; text-decoration: none; display: block;}
.detailtwomenu ul li.active a{color: #446199;   }
.detailtwomenu ul li a img.icona{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 1 }
.detailtwomenu ul li a img.iconb{ position: absolute; width: 28px; top:26px; left: -40px; opacity: 0 }
.detailtwomenu ul li.active a img.icona{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 0 }
.detailtwomenu ul li.active a img.iconb{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 1 }


/*授权合作*/
.detailtwomenu1{ height: 80px; line-height: 80px; background: #f5f5f5; text-align: center;  }
.detailtwomenu1 ul li {height: 80px; line-height: 80px; display: inline-block; text-align: center; padding-left: 70px; padding-right: 30px;}
.detailtwomenu1 ul li.active{background: #fff; }
.detailtwomenu1 ul li a{color: #333; font-size: 16px; text-align: left; font-weight: bold; position: relative; text-decoration: none; display: block;}
.detailtwomenu1 ul li.active a{color: #446199;   }
.detailtwomenu1 ul li a img.icona{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 1 }
.detailtwomenu1 ul li a img.iconb{ position: absolute; width: 28px; top:26px; left: -40px; opacity: 0 }
.detailtwomenu1 ul li.active a img.icona{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 0 }
.detailtwomenu1 ul li.active a img.iconb{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 1 }

/*作品*/
.detailtwomenu2{ height: 80px; line-height: 80px; background: #f5f5f5; text-align: center;  }
.detailtwomenu2 ul li {height: 80px; line-height: 80px; display: inline-block; text-align: center; padding-left: 80px; padding-right: 40px;}
.detailtwomenu2 ul li.active{background: #fff; }
.detailtwomenu2 ul li a{color: #333; font-size: 16px; text-align: left; font-weight: bold; position: relative; text-decoration: none; display: block;}
.detailtwomenu2 ul li.active a{color: #446199;   }
.detailtwomenu2 ul li a img.icona{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 1 }
.detailtwomenu2 ul li a img.iconb{ position: absolute; width: 28px; top:26px; left: -40px; opacity: 0 }
.detailtwomenu2 ul li.active a img.icona{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 0 }
.detailtwomenu2 ul li.active a img.iconb{ position: absolute; width: 28px; top: 26px; left: -40px; opacity: 1 }



.aboutcontent{ padding-top: 50px; padding-bottom: 100px; font-size: 18px; color: #222; line-height: 2em;  }
.aboutcontent h2{ font-size: 24px; color: #3166ae;font-weight: normal; margin-bottom: 20px; padding-top: 50px; }
.aboutcontent p{ font-size:16px; color: #333;font-weight: normal; line-height: 2em; margin-bottom: 20px; }


.october_about{ padding-top: 70px; padding-bottom: 70px; }
.october_about .text{ float: left; width: 50%; }
.october_about .img{ float: left; width: 50%; }
.october_about .img img{width:100%; border-radius: 3px; }
.october_about .text .title{ font-size: 30px; color: #333; font-weight: bold; position: relative; height: 65px; margin-bottom: 25px; }
.october_about .text .title:after{ position: absolute; content: ""; left: 0px; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc;}
.october_about .text .content{ padding-right: 100px; line-height: 1.8em; font-size: 14px; color: #333;}
.october_about .text .content p{ margin-bottom: 10px; text-align: justify; }
.october_about .text .content p strong{  font-size: 15px; }

.october_course{ padding-top: 70px; padding-bottom: 70px; background: #f7f7f7 }
.october_course .title{text-align: center; font-size: 30px; color: #333; font-weight: bold; position: relative; height: 65px; margin-bottom: 25px; }
.october_course .title:after{ position: absolute; content: ""; left: 50%; margin-left: -15px; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc;}
.october_course .content{ position: relative; }
.october_course .content:after{ position: absolute; content: ""; top: 0px;left: 50%; margin-left: -0.5px; background: #c4c4c4; width: 1px; bottom: 0px; }
.october_course .content ul li{ position: relative; height: 60px; cursor: pointer; }
.october_course .content ul li h1{font-size: 16px; color: #333; position: relative; height:24px; line-height:24px;}
.october_course .content ul li h1:after{ position: absolute; right: -33px; background: #fff; z-index: 9; top: 5px;content:""; border-radius: 40px; height: 12px; width: 12px;border:#c4c4c4 solid 1px;   }
.october_course .content ul li h1:before{ position: absolute; right: -29px; background: #fff; z-index: 10; top: 9px;content:""; border-radius: 40px; height: 6px; width: 6px; background: #fff;  }
.october_course .content ul li p{font-size: 14px; color: #666666; line-height: 16px;}
.october_course .content ul li:nth-child(2n-1) { text-align: right; }
.october_course .content ul li:nth-child(2n-1) {text-align: right; }
.october_course .content ul li:nth-child(2n) h1 { text-align: left; }
.october_course .content ul li:nth-child(2n) p{text-align: justify; }
.october_course .content ul li:nth-child(2n) .text {position: absolute;right:0px;}
.october_course .content ul li:nth-child(2n-1) .text {position: absolute;left:0px;}
.october_course .content ul li:nth-child(2n) h1:after{ position: absolute; left: -33px; background: #fff; z-index: 9; top: 5px;content:""; border-radius: 40px; height: 12px; width: 12px;border:#c4c4c4 solid 1px;   }
.october_course .content ul li:nth-child(2n) h1:before{ position: absolute; left: -29px; background: #fff; z-index: 10; top: 9px;content:""; border-radius: 40px; height: 6px; width: 6px; background: #fff;  }
.october_course .content ul li:hover{ }
.october_course .content ul li:hover h1{ color: #446199; font-weight: bold;}
.october_course .content ul li:hover p{ color: #446199; font-weight: bold;}
.october_course .content ul li:hover h1:after{ position: absolute; right: -33px; background: #fff; z-index: 9; top: 5px;content:""; border-radius: 40px; height: 12px; width: 12px;border:#446199 solid 1px;   }
.october_course .content ul li:hover h1:before{ position: absolute; right: -29px; background: #fff; z-index: 10; top: 9px;content:""; border-radius: 40px; height: 6px; width: 6px; background: #446199;  }
.october_course .content ul li .text{width: 48%;}
.october_course .content ul { padding-top: 20px; }



.october_honor{ padding-top: 70px; padding-bottom: 70px; background: #fff;}
.october_honor .title{ font-size: 30px; color: #333; font-weight: bold; position: relative; height: 65px; margin-bottom: 25px;  text-align: center}
.october_honor .title:after{ position: absolute; content: ""; left: 50%; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; margin-left: -15px;}
.october_honor .content {   text-align: left }
.october_honor .content h2{ font-size: 16px; }
.october_honor .content a{ text-decoration: none; text-align: left; padding-bottom: 5px; font-size: 14px;}
.october_honor .content span{ display: block; height: 10px; }
.block{}
.block__link{position:relative;cursor:pointer;color:#666}
.block__link:hover{color:#446199; font-weight: bold;}
.block__link span,.content__text-link span{display:inline-block;white-space:pre}
.content__text{padding:0 5vw 25vh;line-height:2;color:var(--color-text)}
.content__text-link{position:relative;font-weight:700;cursor:pointer}
.block[data-fx="1"] a::after,a.content__text-link[data-fx="1"]::after{content:'';z-index:-1;width:100%;bottom:.25rem;left:0;position:absolute;height:2px;background:currentColor;transform:scale3d(0,1,1);transform-origin:0% 50%;transition:transform .2s cubic-bezier(.39,.575,.565,1)}
a.content__text-link[data-fx="1"]::after{bottom:0}
.block[data-fx="1"] a:hover::after,a.content__text-link[data-fx="1"]:hover::after{transform:scale3d(1,1,1)}
.block[data-fx="5"] a::after,a.content__text-link[data-fx="5"]::after{content:'';z-index:-1;width:100%;bottom:.25rem;left:0;position:absolute;height:2px;background:currentColor;transform:scale3d(0,1,1);transform-origin:100% 50%;transition:transform .7s cubic-bezier(.86,0,.07,1)}
a.content__text-link[data-fx="5"]::after{bottom:0}
.block[data-fx="5"] a:hover::after,a.content__text-link[data-fx="5"]:hover::after{transform:scale3d(1,1,1)}
.block[data-fx="10"] a::after,a.content__text-link[data-fx="10"]::after{content:'';z-index:-1;width:100%;bottom:.25rem;left:0;position:absolute;height:2px;background:currentColor;transform:scale3d(0,1,1);transform-origin:0% 50%}
a.content__text-link[data-fx="10"]::after{bottom:0}
.block[data-fx="10"] a:hover::after,a.content__text-link[data-fx="10"]:hover::after{animation:loop .5s infinite}
@keyframes loop{0%{transform-origin:0% 50%;transform:scale3d(0,1,1)}
50%{transform-origin:0% 50%;transform:scale3d(1,1,1)}
51%{transform-origin:100% 50%}
100%{transform-origin:100% 50%;transform:scale3d(0,1,1)}
}
.hover-reveal{position:fixed;width:150px;height:206px;top:0;left:0;pointer-events:none;opacity:0; border-radius:3px; overflow: hidden;}
.hover-reveal__inner,.hover-reveal__img{width:100%;height:100%;position:relative}
.hover-reveal__deco{width:100%;height:100%;position:absolute;top:0;left:0;background-color:#181314}
.hover-reveal__img{background-size:cover;background-position:50% 50%}




.october_team{ background: #f7f7f7;}
.october_team .title{ font-size: 30px; color: #333; font-weight: bold; position: relative; height: 65px; margin-bottom: 25px; }
.october_team .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; }
.october_team .width50{ width: 650px; float: right }
.october_team .left { width: 50%; float: left;  padding-top: 40px; padding-bottom:40px;}
.october_team .left .content{ margin-bottom: 20px; }
.october_team .left .content .photo{ width: 120px; border-radius: 120px; height: 120px; overflow: hidden; float: left;  margin-right: 45px; }
.october_team .left .content .photo img{ width: 120px; height: 120px; display: block;}
.october_team .left .content .text {float: left;}
.october_team .left .content .text h2{ font-size: 18px; color: #333;  margin-bottom: 10px; padding-top: 10px; }
.october_team .left .content p{ font-size: 14px; color: #333; font-weight: normal; line-height: 1.8em; }
.october_team .left .description{ font-size: 14px; color: #333; font-weight: normal; line-height: 1.8em; padding-right: 80px; text-align: justify;}
.october_team .right { width: 50%; float: left; }
.october_team .right .swiper-slide{  height: 420px; }
.october_team .right .swiper-pagination .swiper-pagination-bullet{background: rgba(255,255,255,0.8);}





.october_join{ background: #fff; padding-top: 70px; padding-bottom: 70px;}
.october_join .title{ font-size: 30px; color: #333; font-weight: bold; position: relative; height: 65px; margin-bottom: 25px; }
.october_join .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; }
.october_join .more{ padding-top: 30px; }
.october_join .more a{ text-align: center; color: #2d2d2d; font-size: 14px; font-weight: bold; border-radius: 50px; border:#999999 solid 1px; padding: 10px 30px; text-decoration: none; transition: 0.3s; }
.october_join .more a:hover{ border:#446199 solid 1px;color: #fff; background: #446199; }
.october_join .more a i{ transition: 0.3s;}
.october_join .more a:hover i{ text-indent: 10px; }
.october_join .more{ text-align: center; }
.bellows{}
.bellows__item{ cursor: pointer; }
.bellows__item:not(.bellows--is-open)>.bellows__content{display:none}.bellows__item.bellows--is-open>.bellows__content-wrapper,.bellows__item.bellows--is-closing>.bellows__content-wrapper{display:block}.bellows__content-wrapper{display:none}
.bellows { border-bottom: #ececec solid 1px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
.bellows__header { border-top: #ececec solid 1px;position: relative;padding: 18px 0px;color: #333; cursor:pointer;}
.bellows__header::after {font-family: 'FontAwesome';content: "\f107"; font-size: 15px; position: absolute;top: 50%;right: 10px;z-index: 2; margin-top: -14px; display: block;  color: #b2b2b2;pointer-events: none;-webkit-transition: -webkit-transform .25s ease-in-out;transition: transform .25s ease-in-out}
.bellows__header::after {-webkit-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg)}

.bellows__item.bellows--is-open > .bellows__header::after, .bellows__item.bellows--is-opening > .bellows__header::after {-webkit-transform: rotate(-180deg);-ms-transform: rotate(-180deg);transform: rotate(-180deg)}
.bellows__item:last-child > .bellows__header {border-bottom: 0}
.bellows__header h1, .bellows__header h2, .bellows__header h3, .bellows__header h4 { margin: 0; font-size: 18px; cursor: pointer;}
.bellows__content { padding-bottom: 10px; font-size: 14px; line-height: 1.8em; }
.bellows__content .bellows {margin-top: 20px}
.bellows--is-open .bellows__header{color: #446199}
.october_join .join_wechat img{ width: 110px; }
.october_join .join_wechat { padding-top: 30px; color: #446199; font-size: 14px; font-style: italic; }
.october_join .join_wechat a{ color: #446199; }
.bellows__content ol {list-style-type:none;counter-reset:sectioncounter;}
.bellows__content ol li{ position: relative;padding-left:25px; }
.bellows__content ol li:before{ position: absolute; left: 0px; width: 20px; text-align: right; content:counter(sectioncounter) ".";
counter-increment:sectioncounter;}



.october_contact{ background: #f7f7f7; padding-top: 70px; padding-bottom: 70px;}
.october_contact .title{ font-size: 30px; color: #333; font-weight: bold; position: relative; height: 65px; margin-bottom: 25px; }
.october_contact .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; }
.october_contact .contact{ padding-bottom: 40px; }
.october_contact .contact ul li { width: 25%; float: left; text-align: center; padding-top: 25px; padding-bottom: 25px; }
.october_contact .contact ul li .icon{cursor: pointer;height: 90px; width: 90px; border-radius: 90px; background: #fff; border:#ececec solid 1px; position: relative; margin:0 auto;}
.october_contact .contact ul li .icon img.icona{cursor: pointer; width: 40px; position: absolute; display: block; margin-left: -20px; top: 24px;left: 50%; opacity: 1 }
.october_contact .contact ul li .icon img.iconb{cursor: pointer; width: 40px; position: absolute; display: block; margin-left: -20px; top: 24px;left: 50%; opacity: 0 }
.october_contact .contact ul li h3{cursor: pointer; font-size: 16px; color: #333333;font-weight: bold; padding-top: 15px;  }
.october_contact .contact ul li a{ display: block; text-decoration: none;}
.october_contact .contact ul li a:hover{ display: block; text-decoration: none; cursor: pointer;}
.october_contact .contact ul li:hover .icon img.icona{ opacity: 0 }
.october_contact .contact ul li:hover .icon img.iconb{ opacity: 1 }
.october_contact .contact ul li:hover h3{ color: #496195; }

.october_contact .photo{ margin-bottom: 20px; }
.october_contact .photo .left{ width: calc(50% - 10px); float: left; border-radius: 3px ; }
.october_contact .photo .right{ width: calc(50% - 10px); float: right;border-radius: 3px ; }
.october_contact .photo img{ display: block; width: 100%; }
.october_contact .map{ height: 500px; position: relative; border-radius: 3px ; overflow: hidden;  }
.october_contact .map .add img{ width:100%; display: block; }






.detailworklist { background: #fff }
.detailworklist ul{ padding-top: 60px; }
.detailworklist ul li {position: relative;margin-bottom: 60px; box-shadow: 0px 0px 15px rgba(0,0,0,0.08); -webkit-box-shadow: 0px 0px 15px  rgba(0,0,0,0.08);-moz-box-shadow: 0px 0px 15px  rgba(0,0,0,0.08);
}
.detailworklist ul li .img{ width: 790px; overflow: hidden; float: left; }
.detailworklist ul li .img img{ width: 100%; display: block; transition:0.5s;}
.detailworklist ul li .img:hover img{ width: 100%; display: block;transform:rotate(0deg)scale(1.2); }
.detailworklist ul li .info{ width: 455px; float: left;  background: #fff;padding: 35px 20px 0px 35px;}
.detailworklist ul li .info h3{ position: absolute;transform:rotate(-90deg)scale(1); right: -70px; text-align: right; top: 10px; font-weight: bold; font-size: 12px; color: #dddddd;}
.detailworklist ul li .info h2{ color: #999999;font-size: 12px; }
.detailworklist ul li .info .name{font-size: 16px; font-weight: bold; padding-top: 15px; margin-bottom: 15px; }
.detailworklist ul li .info .name a{color: #2d2d2d; }
.detailworklist ul li .info .swiper-container{ margin-bottom: 15px; }
.detailworklist ul li .info .swiper-container { width: auto; padding-right: 15px; height:240px;}
.detailworklist ul li .info .swiper-slide { height: auto; text-align: justify; font-size: 14px; line-height: 1.8em; color: #333; -webkit-box-sizing: border-box; box-sizing: border-box;}
.detailworklist ul li .info .description .swiper-slide p{ margin-bottom: 10px; }
.detailworklist ul li .info .description .swiper-slide p:last-child{ margin-bottom: 0px; }
.detailworklist ul li .info .more a{ color: #2d2d2d; font-size: 14px; font-weight: bold; }
.detailworklist ul li .info .more{ }
.detailworklist ul li .info .more a:hover{ color: #446199; text-decoration: none;}
.detailworklist ul li .info .more  a i{transition: 0.3s;}
.detailworklist ul li .info .more  a:hover i{ text-indent: 5px; }


.detailworkbanner{ height: 100%; }
.detailworkbanner .pagewidth{ position: relative; height: 100%; }
.detailworkbanner .pagewidth h2{ position: absolute; left: 0px;bottom: 100px; font-size: 18px; color: #fff; font-weight: normal; }
.detailworkbanner .pagewidth h1{ position: absolute; left: 0px;bottom: 45px; font-size: 36px; color: #fff; font-weight: bold; }

.detailworkbanner .mouse{ border-radius: 40px; border:#fff solid 2px; z-index: 39; position: absolute; height: 30px; width: 18px; left: 50%; margin-left: -10px; bottom:60px; -webkit-animation:mouse 1.5s infinite linear ;}
.detailworkbanner .mouse span{ position: absolute; left: 50%;z-index: 39; border:#fff solid 2px; border-radius: 10px; bottom:16px;   width: 2px; height: 4px; margin-left: -3px;}

@-webkit-keyframes mouse {
    0%{
        bottom: 60px;
    }
    50%{
        bottom: 70px;
    }
    100%{
        bottom: 60px;
    }
}





.work_introduce,.work_poster,.work_still,.work_video {padding-top: 60px; padding-bottom: 60px;}

.work_still,.work_video { background: #f5f5f5; }


.work_introduce .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }
.work_introduce .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; }
.work_introduce .content{ line-height: 1.8em; font-size: 14px; color: #333; }
.work_introduce .content p{ margin-bottom: 10px; text-align: justify; }
.work_poster .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }
.work_poster .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; }

.work_still .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }
.work_still .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; }

.work_video .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }
.work_video .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; }

.work_poster .pagewidth{position:relative;}
.work_poster .swiper-slide{ width: auto; }
.work_poster .swiper-slide img{ height: 300px; }
.work_poster .swiper-container{ padding-bottom: 40px; }
.work_still .pagewidth{position:relative;}
.work_still .swiper-container{ padding-bottom: 40px; }
.work_still .swiper-slide{ width: auto; }
.work_still .swiper-slide img{ height: 300px; }

.work_video{ position: relative; width: 100%; }
.work_video .video_box{position:relative; }
.work_video video{}


.work_poster .swiper-button-next{ top: 52%; right: -40px; }
.work_poster .swiper-button-prev{ top: 52%; left: -40px; }
.work_still .swiper-button-next{ top: 52%;right: -40px;  }
.work_still .swiper-button-prev{ top: 52%;left: -40px;  }





.news_list { padding-top: 30px; padding-bottom: 30px; background: #fff;  }
.news_list ul li { margin-bottom:15px; padding-bottom: 15px;  }
.news_list ul li .img{ float: left; width: 250px; margin-right: 30px; border-radius: 3px; overflow: hidden; }
.news_list ul li .img img{ display: block;width: 100%; height: 180px;}
.news_list ul li .text{float: left; width: 890px;}
.news_list ul li .text h2 a{ font-size: 18px;  color: #333;}
.news_list ul li .text .time{ font-size: 14px;  color: #666;  margin-bottom:10px;}
.news_list ul li .text .description{ font-size: 14px;  color: #666; margin-bottom: 10px; }
.news_list ul li .text .more a{ font-size: 16px;  color: #39309c; }
.news_list ul li:hover .text h2 a{  color: #000;}
.news_list ul li:hover .text .description{color: #222; }

.news_detail{ padding-top: 80px; padding-bottom: 40px;  }
.news_detail .title { border-bottom: #ececec solid 1px; padding-bottom: 20px; }
.news_detail .title h1{text-align: center; font-size: 24px; line-height: 2em;}
.news_detail .title p{text-align: center; font-size: 14px; line-height: 2em;}
.news_detail .title p span{ margin-right: 15px; margin-left: 15px; }
.news_detail .content{ padding-top: 30px; padding-bottom: 30px; font-size: 14px; color: #222; line-height: 1.8em; padding-bottom: 30px; border-bottom: #ececec solid 1px; }
.news_detail .content .html img{ width: 600px; margin: 20px auto; display: block; }
.news_detail .content .html p{ margin-bottom:10px; }
.news_detail .other{ padding-top: 30px; padding-bottom: 50px; font-size: 14px;}
.news_detail .other .left{float: left;}
.news_detail .other .right{float: right;}
.news_detail .other a{ color: #222; font-size: 14px; } 
.news_detail .pagewidth{ width: 960px; }




.detailcooperation1 { padding-top: 30px; padding-bottom: 30px; background: #fff;  }
.detailcooperation1 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation1 .swiper-container{ width: 96%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation1 .swiper-slide{ width: auto; text-align: center; }
.detailcooperation1 .swiper-slide img{ height: 400px; }
.detailcooperation1 .description{ width: 96%; margin:0 auto; padding-bottom: 40px;border-top: #ececec solid 1px; padding-top: 30px; }
.detailcooperation1 .swiper-button-next{ top: 42%; right: -20px; }
.detailcooperation1 .swiper-button-prev{ top: 42%; left: -20px; }
.detailcooperation1 .description p{ margin-bottom: 20px; line-height: 1.8em; }
.detailcooperation1 .description p a{ color: #496195; }


.detailcooperation2 { padding-top: 30px; padding-bottom: 30px; background: #fff;  }
.detailcooperation2 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation2 .swiper-container{ width: 96%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation2 .swiper-slide{ width: auto; }
.detailcooperation2 .swiper-slide img{ height:300px  }
.detailcooperation2 .description{ width: 96%; margin:0 auto; padding-bottom: 40px;border-top: #ececec solid 1px; padding-top: 30px; }
.detailcooperation2 .swiper-button-next{ top: 42%; right: -20px; }
.detailcooperation2 .swiper-button-prev{ top: 42%; left: -20px; }
.detailcooperation2 .description p{ margin-bottom: 20px; line-height: 1.8em; }
.detailcooperation2 .description p a{ color: #496195; }

.detailcooperation3 { padding-top: 30px; padding-bottom: 30px; background: #fff;  }
.detailcooperation3 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation3 .swiper-container{ width: 96%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation3 .swiper-slide{ width: auto; text-align: center; }
.detailcooperation3 .swiper-slide img{ width: 100%; }
.detailcooperation3 .description{ width: 96%; margin:0 auto; padding-bottom: 40px;border-top: #ececec solid 1px; padding-top: 30px; }
.detailcooperation3 .swiper-button-next{ top: 42%; right: -20px; }
.detailcooperation3 .swiper-button-prev{ top: 42%; left: -20px; }
.detailcooperation3 .description p{ margin-bottom: 20px; line-height: 1.8em; }
.detailcooperation3 .description p a{ color: #496195; }




.detailcooperation4 { padding-top: 30px; padding-bottom: 30px; background: #fff;  }
.detailcooperation4 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation4 .swiper-container{ width: 96%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation4 .swiper-slide{ width: auto; text-align: center; }
.detailcooperation4 .swiper-slide img{ width: 100%; }
.detailcooperation4 .description{ width: 96%; margin:0 auto; padding-bottom: 40px; padding-top: 30px; }
.detailcooperation4 .description p{ margin-bottom: 10px; line-height: 1.8em; font-size: 14px; }
.detailcooperation4 .swiper-button-next{ top: 42%; right: -20px; }
.detailcooperation4 .swiper-button-prev{ top: 42%; left: -20px; }
.detailcooperation4 .description p a{ color: #496195; }


.detailcooperation5 { padding-top: 30px; padding-bottom: 30px; background: #fff;  }
.detailcooperation5 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation5 .swiper-container{ width: 96%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation5 .swiper-slide{ width: auto; text-align: center; }
.detailcooperation5 .swiper-slide img{ height: 400px;}
.detailcooperation5 .description{ width: 96%; margin:0 auto; padding-bottom: 40px;border-top: #ececec solid 1px; padding-top: 30px; }
.detailcooperation5 .swiper-button-next{ top: 42%; right: -20px; }
.detailcooperation5 .swiper-button-prev{ top: 42%; left: -20px; }
.detailcooperation5 .description p{ margin-bottom: 20px; line-height: 1.8em; }
.detailcooperation5 .description p a{ color: #496195; }





.detailcooperation4video{ position: relative; width: 1200px; margin:0 auto; }
.detailcooperation4video .video_box{position:relative; }


.remodal-bg.remodal-is-opening,.remodal-bg.remodal-is-opened {-webkit-filter: blur(3px);filter: blur(3px);}
.remodal-overlay {background: rgba(255, 255, 255, 0.9);}
.remodal-overlay.remodal-is-opening,.remodal-overlay.remodal-is-closing {-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: forwards;animation-fill-mode: forwards;}
.remodal-overlay.remodal-is-opening {-webkit-animation-name: remodal-overlay-opening-keyframes;animation-name: remodal-overlay-opening-keyframes;}
.remodal-overlay.remodal-is-closing {-webkit-animation-name: remodal-overlay-closing-keyframes;animation-name: remodal-overlay-closing-keyframes;}
.remodal-wrapper {padding: 10px 10px 0;}
.remodal {box-sizing: border-box;width: 100%;margin-bottom: 10px;padding: 35px;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);color: #333333;background: #fff;}
.remodal.remodal-is-opening,.remodal.remodal-is-closing {-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: forwards;animation-fill-mode: forwards;}
.remodal.remodal-is-opening {-webkit-animation-name: remodal-opening-keyframes;animation-name: remodal-opening-keyframes;}
.remodal.remodal-is-closing {-webkit-animation-name: remodal-closing-keyframes;animation-name: remodal-closing-keyframes;}
.remodal,.remodal-wrapper:after {vertical-align: middle;}
.remodal-close {position: absolute;top: 0;left: 0;display: block;overflow: visible;width: 35px;height: 35px;margin: 0;padding: 0;cursor: pointer;-webkit-transition: color 0.2s;transition: color 0.2s;text-decoration: none;color: #95979c;border: 0;outline: 0;background: transparent;}
.remodal-close:hover,.remodal-close:focus {color: #333333;}
.remodal-close:before {font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif !important;font-size: 25px;line-height: 35px;position: absolute;top: 0;left: 0;display: block;width: 35px;content: "\00d7";text-align: center;}
.remodal-confirm,.remodal-cancel {font: inherit;display: inline-block;overflow: visible; border-radius: 3px; min-width: 110px;margin: 0;padding: 12px 0;cursor: pointer;-webkit-transition: background 0.2s;transition: background 0.2s;text-align: center;vertical-align: middle;text-decoration: none;border: 0;outline: 0;}
.remodal-confirm {color: #fff;background: #999;}
.remodal-confirm:hover,.remodal-confirm:focus {background: #666;}
.remodal-cancel {color: #fff;background: #666;}
.remodal-cancel:hover,.remodal-cancel:focus {background: #666;}
.remodal-confirm::-moz-focus-inner,.remodal-cancel::-moz-focus-inner,.remodal-close::-moz-focus-inner {padding: 0;border: 0;}
@-webkit-keyframes remodal-opening-keyframes {from {  -webkit-transform: scale(1.05);  transform: scale(1.05);  opacity: 0;}
to {  -webkit-transform: none;  transform: none;  opacity: 1;  -webkit-filter: blur(0);  filter: blur(0);}
}
@keyframes remodal-opening-keyframes {from {  -webkit-transform: scale(1.05);  transform: scale(1.05);  opacity: 0;}
to {  -webkit-transform: none;  transform: none;  opacity: 1;  -webkit-filter: blur(0);  filter: blur(0);}
}
@-webkit-keyframes remodal-closing-keyframes {from {  -webkit-transform: scale(1);  transform: scale(1);  opacity: 1;}
to {  -webkit-transform: scale(0.95);  transform: scale(0.95);  opacity: 0;  -webkit-filter: blur(0);  filter: blur(0);}
}
@keyframes remodal-closing-keyframes {from {  -webkit-transform: scale(1);  transform: scale(1);  opacity: 1;}
to {  -webkit-transform: scale(0.95);  transform: scale(0.95);  opacity: 0;  -webkit-filter: blur(0);  filter: blur(0);}
}
@-webkit-keyframes remodal-overlay-opening-keyframes {from {  opacity: 0;}
to {  opacity: 1;}
}
@keyframes remodal-overlay-opening-keyframes {from {  opacity: 0;}
to {  opacity: 1;}
}
@-webkit-keyframes remodal-overlay-closing-keyframes {from {  opacity: 1;}
to {  opacity: 0;}
}
@keyframes remodal-overlay-closing-keyframes {from {  opacity: 1;}
to {  opacity: 0;}
}
@media only screen and (min-width: 641px) {.remodal {  max-width: 300px;}
}
.lt-ie9 .remodal-overlay {background: #333333;}
.lt-ie9 .remodal {width: 700px;}
html.remodal-is-locked {overflow: hidden;-ms-touch-action: none;touch-action: none;}
.remodal,[data-remodal-id] {display: none;}
.remodal-overlay {position: fixed;z-index: 9999;top: -5000px;right: -5000px;bottom: -5000px;left: -5000px;display: none;}
.remodal-wrapper {position: fixed;z-index: 10000;top: 0;right: 0;bottom: 0;left: 0;display: none;overflow: auto;text-align: center;-webkit-overflow-scrolling: touch;}
.remodal-wrapper:after {display: inline-block;height: 100%;margin-left: -0.05em;content: "";}
.remodal-overlay,.remodal-wrapper {-webkit-backface-visibility: hidden;backface-visibility: hidden;}
.remodal {position: relative;outline: none;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;text-size-adjust: 100%;}
.remodal-is-initialized {display: inline-block;}





/*大屏幕*/
@media screen and (max-width: 1920px) {
} 
/*中屏幕*/
@media screen and (max-width: 1440px) {
} 
/*ipad pro*/
@media screen and (max-width: 1112px) {
.indexabout .content .left{ width: 45%; }
.indexabout .content .right { width: 55%; }
.indexwork .content ul li {  height: 293px; position: relative;margin-bottom: 40px;}
.indexwork .content ul li .img{ width: 550px; position: absolute; right: 0px; overflow: hidden;  }
.indexwork .content ul li .img img{ width: 100%; display: block; transition:0.5s;}
.indexwork .content ul li .img:hover img{ width: 100%; display: block;transform:rotate(0deg)scale(1.2); }
.indexwork .content ul li .info{ width: 480px; float: left; position: absolute;left: 0px; }
.indexwork .content ul li .info h3{ right: -220px }
.indexwork .content ul li .info .name{ padding-top: 5px;  margin-bottom: 15px; }
.indexwork .content ul li .info .swiper-container{ height: 230px; }
.indexwork .content ul li:nth-child(2n) .info h3{ left: -220px }
.indexwork .content ul li:nth-child(2n) .img{ width: 550px; }
.indexwork .content ul li:nth-child(2n) .info{ width: 480px; }
.indexwork .content ul li .info .more{ display: none; }
.october_about .text .content{ padding-right: 50px; }
.october_about .img{ padding-top: 40px; }
.october_course .content ul li h1:before{right: -23px;}
.october_course .content ul li h1:after{ right: -27px; }
.october_course .content ul li:hover h1:before{ right: -23px;}
.october_course .content ul li:hover h1:after{ right: -27px; }
.october_course .content ul li:nth-child(2n) h1:before{left: -23px;}
.october_course .content ul li:nth-child(2n) h1:after{ left: -27px; }

.october_team .width50{ width: auto; padding-left: 20px; }
.october_team .left{ padding-top: 30px; padding-bottom: 30px; }
.october_team .right .swiper-slide{ height: 430px; }
.october_team .left .description{ padding-right: 30px; }
.detailworklist ul li{ margin-bottom: 30px; }
.detailworklist ul li .img{ width: 550px; }
.detailworklist ul li .info{ width: 465px; padding-top: 20px; }
.detailworklist ul li .info .swiper-container{ height: 140px; }
.work_video .video_box video{ width: 100%; }
.work_video .video_box{ width: 100%; }
.work_poster .swiper-button-next{ display: none; }
.work_poster .swiper-button-prev{ display: none; }
.work_still .swiper-button-next{ display: none; }
.work_still .swiper-button-prev{ display: none; }

.detailcooperation1 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation1 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation2 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation2 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation3 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation3 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation4 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation4 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation5 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation5 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}


.detailcooperation1 .swiper-container{ width: 100%; }
.detailcooperation3 .swiper-container{ width: 100%; }
.detailcooperation2 .swiper-container{ width: 100%; }
.detailcooperation4 .description{ width: 100%; }
.detailcooperation1 .swiper-slide img{ height: auto; width: 100%; }
.detailcooperation4video .video_box{ width: 100%; }
.detailcooperation4video .video_box video{ width: 100%; }
.detailcooperation4video{ width: 100%; }
.news_list{ padding-top: 20px;padding-bottom: 20px; }
.news_list ul li{ margin-top: 10px; margin-bottom: 10px; }
.news_list ul li .text{ width: 790px; }
.news_detail .pagewidth{ width: auto; }
.october_contact .map .left .add{ z-index: 33; position: absolute;width:32px; left: 50%; margin-left: 30px; top:90px; -webkit-animation:add 1.5s infinite linear ;}

} 
/*平板 横*/
@media screen and (max-width: 1024px) {
.indexabout .content .left{ width: 45%; }
.indexabout .content .right { width: 55%; }
.indexwork .content ul li {  height: 293px; position: relative;margin-bottom: 40px;}
.indexwork .content ul li .img{ width: 550px; position: absolute; right: 0px; overflow: hidden;  }
.indexwork .content ul li .img img{ width: 100%; display: block; transition:0.5s;}
.indexwork .content ul li .img:hover img{ width: 100%; display: block;transform:rotate(0deg)scale(1.2); }
.indexwork .content ul li .info{ width: 390px; float: left; position: absolute;left: 0px; }
.indexwork .content ul li:nth-child(2n) .img{ width: 550px; }
.indexwork .content ul li:nth-child(2n) .info{ width: 390px; }
.october_about .text .content{ padding-right: 50px; }
.october_about .img{ padding-top: 40px; }
.october_course .content ul li h1:before{right: -23px;}
.october_course .content ul li h1:after{ right: -27px; }
.october_course .content ul li:hover h1:before{ right: -23px;}
.october_course .content ul li:hover h1:after{ right: -27px; }
.october_course .content ul li:nth-child(2n) h1:before{left: -23px;}
.october_course .content ul li:nth-child(2n) h1:after{ left: -27px; }

.october_team .width50{ width: auto; padding-left: 20px; }
.october_team .left{ padding-top: 30px; padding-bottom: 30px; }
.october_team .right .swiper-slide{ height: 430px; }

.detailworklist ul li{ margin-bottom: 30px; }
.detailworklist ul li .img{ width: 550px; }
.detailworklist ul li .info{ width: 378px; }
.detailworklist ul li .info .swiper-container{ height:140px;  }

.work_video .video_box video{ width: 100%; }
.work_video .video_box{ width: 100%; }
.work_poster .swiper-button-next{ display: none; }
.work_poster .swiper-button-prev{ display: none; }
.work_still .swiper-button-next{ display: none; }
.work_still .swiper-button-prev{ display: none; }

.detailcooperation1 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation1 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation2 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation2 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation3 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation3 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation4 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation4 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation5 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation5 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}


.detailcooperation1 .swiper-container{ width: 100%; }
.detailcooperation3 .swiper-container{ width: 100%; }
.detailcooperation2 .swiper-container{ width: 100%; }
.detailcooperation4 .description{ width: 100%; }
.detailcooperation1 .swiper-slide img{ height: auto; width: 100%; }
.detailcooperation4video .video_box{ width: 100%; }
.detailcooperation4video .video_box video{ width: 100%; }
.detailcooperation4video{ width: 100%; }
.news_list{ padding-top: 20px;padding-bottom: 20px; }
.news_list ul li{ margin-top: 10px; margin-bottom: 10px; }
.news_list ul li .text{ width: 700px; }
.news_detail .pagewidth{ width: auto; }
.october_contact .map .left .add{ z-index: 33; position: absolute;width:32px; left: 50%; margin-left: 30px; top:95px; -webkit-animation:add 1.5s infinite linear ;}

} 
/*平板 竖*/
@media screen and (max-width: 768px) {

.video{ background: url(../image/20190608061710721-jpg.webp) no-repeat center ; background-size: cover; }
.video .pagewidth h2{ bottom: 70px; font-size: 22px; left: 20px; font-family: "Helvetica"; }
.video .pagewidth .h1{ bottom: 25px; font-size:42px; left: 20px; font-family: "Helvetica" }
.video video{ display: none; }
.video .mouse{ border-radius: 40px; border:#fff solid 2px; z-index: 39; position: absolute; height: 30px; width: 18px; left: 50%; margin-left: -10px; bottom:90px; -webkit-animation:video 1.5s infinite linear ;}

@-webkit-keyframes video {
    0%{
        bottom: 90px;
    }
    50%{
        bottom: 100px;
    }
    100%{
        bottom: 90px;
    }
}
.indexabout .content .left{ float: none; width: 100%; }
.indexabout .content .left img{ width: 100%; display: block; }
.indexabout .content .right{  float: none; width: 100%; }
.indexabout .content .right h3{ display: none; }
.indexabout .content .right .text{ padding-left: 0;padding-top: 20px; }
.indexabout .content .right .more{ padding-left: 0; padding-top: 20px; }
.indexabout .content .right .more a{ float: left; margin-right: 20px; height: 44px; line-height: 44px; width: 44px; border-radius: 44px; border:#9d9d9d solid 1px; font-size: 14px; color: #333; display: block; text-align: center;transition-duration: 0.3s;-moz-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; -o-transition-duration: 0.3s;
 }
.indexabout .content .right .more a:hover{ border:#446199 solid 1px;color: #fff; background: #446199; }
.indexwork .content ul li{ height: auto; }
.indexwork .content ul li .img{width: calc(100% - 20px); height: calc(100vw - 20px); position: inherit; right: 0; overflow: hidden;  }
.indexwork .content ul li .img img{ width: auto; height: 100%; display: block; transition:0.5s; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.indexwork .content ul li .img:hover img{ width: auto; height: 110%; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.indexwork .content ul li .info{ width: calc(100% - 40px); padding: 20px; float: none; position: inherit;}
.indexwork .content ul li .info h3{ height: 20px; position: absolute; width: 100%; transform: rotate(-90deg)scale(1); left: 50%; top: 0; margin-top: calc(-50vw - 10px); right: auto; margin-left: -10px; text-align: left; font-weight: bold; font-size: 12px; color: #dddddd;}
.indexwork .content ul li .info h2{ color: #999999;font-size: 12px;line-height: 100%;}
.indexwork .content ul li .info .swiper-container{ height: auto;}

.indexwork .content ul li{  margin-bottom: 0; }
.indexwork .content ul li:nth-child(2n) .img{ width: calc(100% - 20px);height: calc(100vw - 20px); position: inherit; left: auto; right: -20px;  overflow: hidden; }
.indexwork .content ul li:nth-child(2n) .info{width: calc(100% - 40px); padding: 20px; float: none;position: inherit; left: auto; right: 0px; }
.indexwork .content ul li:nth-child(2n) .info h3{ height: 20px; position: absolute; width: 100%; transform: rotate(-90deg)scale(1); left: auto; right: 50%; top: 0; margin-top: calc(-50vw - 10px); margin-left: auto;  margin-right: -10px; text-align: left; font-weight: bold; font-size: 12px; color: #dddddd;}

.indexwork .content ul li .info .more{ display: none; }
.indexwork .content ul li .info .name{ padding-top: 20px; }
.indexcooperations .cooperationsoimg .swiper-pagination{ display: block;}
.indexcooperations .cooperationscontent .swiper-pagination{ display: block;}
.indexcooperations .cooperationsoimg .swiper-pagination-bullet{ background: #fff; }


.indexcooperations .pagewidth{ margin: 0 20px; }
.indexnews .pagewidth{ margin: 0 20px; }
.indexabout .pagewidth{ margin: 0 20px; }
.indexpartner .pagewidth{ margin: 0 20px; }

.indexabout .pagewidth .title h2{ font-size: 40px; font-family: "Helvetica" }
.indexwork .pagewidth .title h2{ font-size: 40px;  font-family: "Helvetica"}
.indexcooperations .pagewidth .title h2{ font-size: 40px; font-family: "Helvetica" }
.indexnews .pagewidth .title h2{ font-size: 40px;  font-family: "Helvetica"}
.indexpartner .pagewidth .title h2{ font-size: 40px; font-family: "Helvetica" }

.indexpartner .swiper-slide{text-align: center; padding-top:  0px; padding-bottom:  0px;}
.indexpartner .swiper-slide img{ height: 34px;-webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.6; transition:0.3s; }
.indexpartner .swiper-slide img:hover{ height: 34px;-webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1; transform:rotate(0deg)scale(1.1);}
.indexpartner .swiper-container{ padding-bottom: 50px; }



.october_about{ padding-top: 30px; padding-bottom: 30px; margin: 0 20px; }
.october_about .text{ float:none; width: 100%; }
.october_about .img{ float: none; width: 100%; }
.october_about .img img{width:100%; border-radius: 3px; }
.october_about .text .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }
.october_about .text .title:after{ position: absolute; content: ""; left: 0px; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc;}
.october_about .text .content{ padding-right: 0px; line-height: 1.8em; font-size: 14px; color: #333;}
.october_about .text .content p{ margin-bottom: 10px; text-align: justify; }
.october_about .text .content p strong{  font-size: 15px; }

.october_course{ padding-top: 30px; padding-bottom: 30px; background: #f7f7f7 ; padding-left:20px; padding-right:20px; }
.october_course .title{text-align: left; font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }
.october_course .title:after{ position: absolute; content: ""; left:0px; margin-left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc;}
.october_course .content{ position: relative; }
.october_course .content:after{ position: absolute; content: ""; top: 0px;left: 20px; margin-left:0; background: #c4c4c4; width: 1px; bottom: 0px; }
.october_course .content ul li{ position: relative; height: auto; cursor: pointer; margin-bottom: 15px }
.october_course .content ul li h1{font-size: 16px; color: #333; position: relative; height:24px; line-height:24px;}
.october_course .content ul li h1:after{ position: absolute; left: -33px; background: #fff; z-index: 9; top: 5px;content:""; border-radius: 40px; height: 12px; width: 12px;border:#c4c4c4 solid 1px;   }
.october_course .content ul li h1:before{ position: absolute; left: -29px; background: #fff; z-index: 10; top: 9px;content:""; border-radius: 40px; height: 6px; width: 6px; background: #fff;  }
.october_course .content ul li p{font-size: 14px; color: #666666; line-height: 1.6em; text-align: justify;}
.october_course .content ul li:nth-child(2n-1) { text-align: left; }
.october_course .content ul li:nth-child(2n-1) {text-align: left; }
.october_course .content ul li:nth-child(2n) h1 { text-align: left; }
.october_course .content ul li:nth-child(2n) p{text-align: justify; }
.october_course .content ul li:nth-child(2n) .text {position: inherit;padding-left:47px;}
.october_course .content ul li:nth-child(2n-1) .text {position: inherit;padding-left:47px;}
.october_course .content ul li:nth-child(2n) h1:after{ position: absolute; left: -33px; background: #fff; z-index: 9; top: 5px;content:""; border-radius: 40px; height: 12px; width: 12px;border:#c4c4c4 solid 1px;   }
.october_course .content ul li:nth-child(2n) h1:before{ position: absolute; left: -29px; background: #fff; z-index: 10; top: 9px;content:""; border-radius: 40px; height: 6px; width: 6px; background: #fff;  }
.october_course .content ul li:hover h1:after{ position: absolute; right: -33px; background: #fff; z-index: 9; top: 5px;content:""; border-radius: 40px; height: 12px; width: 12px;border:#446199 solid 1px;   }
.october_course .content ul li:hover h1:before{ position: absolute; right: -29px; background: #fff; z-index: 10; top: 9px;content:""; border-radius: 40px; height: 6px; width: 6px; background: #446199;  }
.october_course .content ul li .text{width: calc(100% - 47px);}
.october_course .content ul { padding-top: 20px; }



.october_honor{ padding-top: 30px; padding-bottom: 30px; background: #fff; margin: 0 20px;}
.october_honor .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px;  text-align: left}
.october_honor .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; margin-left: 0;}
.october_honor .content { text-align: left; line-height: 1.3em;}
.october_honor .content h2{ font-size: 16px; }
.october_honor .content span{}
.october_honor .content a{ text-decoration: none; text-align: left; padding-bottom: 5px; font-size: 14px;   line-height: 1.6em; margin-bottom: 10px; text-align: justify;}
.october_team{padding: 0 20px;}
.october_team .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }
.october_team .title:after{ position: absolute; content: ""; left: 0; bottom: 0px; width: 30px; height: 2px; border-radius: 2px; background: #cccccc; }
.october_team .width50{ width: 100%; float: none; padding-left: 0px;}
.october_team .left { width: 100%; float: none;  padding-top: 30px; padding-bottom: 30px;}
.october_team .left .content{ margin-bottom: 20px; }
.october_team .left .content .photo{ width: 140px; border-radius: 140px; height: 140px; overflow: hidden; float: none;  margin-right: 0; margin: 0 auto; }
.october_team .left .content .photo img{ width: 140px; height: 140px; display: block;}
.october_team .left .content .text {float: none;}
.october_team .left .content .text h2{ font-size: 18px; color: #333;  margin-bottom: 10px; padding-top: 10px;text-align: center; }
.october_team .left .content p{ font-size: 14px; color: #333; font-weight: normal; line-height: 1.8em;text-align: center; }
.october_team .left .description{ font-size: 14px; color: #333; font-weight: normal; line-height: 1.8em; padding-right:0px; text-align: justify;}
.october_team .right { width: 100%; float: none; }
.october_team .right .swiper-slide{  height: 380px; border-radius: 3px; }
.october_team .right .swiper-pagination .swiper-pagination-bullet{background: rgba(255,255,255,0.8);}



.october_join{ background: #fff; padding-top: 30px; padding-bottom: 30px; margin: 0 20px;}
.october_join .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }

.october_join .join_wechat { text-align: center;}


.october_contact .title{ font-size: 24px; color: #333; font-weight: bold; position: relative; height: 55px; margin-bottom: 25px; }
.october_contact{ background: #f7f7f7;  padding: 30px 20px;}
.october_contact .contact{ padding-bottom: 20px; }
.october_contact .contact ul li { width: 50%; float: left; text-align: center; padding-top: 10px; padding-bottom:30px; }
.october_contact .contact ul li .icon{cursor: pointer;height: 90px; width: 90px; border-radius: 90px; background: #fff; border:#ececec solid 1px; position: relative; margin:0 auto;}
.october_contact .contact ul li .icon img.icona{cursor: pointer; width: 40px; position: absolute; display: block; margin-left: -20px; top: 24px;left: 50%; opacity: 1 }
.october_contact .contact ul li .icon img.iconb{cursor: pointer; width: 40px; position: absolute; display: block; margin-left: -20px; top: 24px;left: 50%; opacity: 0 }
.october_contact .contact ul li h3{cursor: pointer; font-size: 14px; color: #333333;font-weight: bold; padding-top: 15px; height: 40px; }
.october_contact .map{ height: 400px; position: relative; border-radius: 3px ; overflow: hidden;  }
.october_contact .map .add img{ width:100%; display: block; }




.detailworklist ul{ padding-top: 30px; }
.detailworklist ul li {position: relative;margin-bottom: 30px; box-shadow: 0px 0px 15px rgba(0,0,0,0.08); -webkit-box-shadow: 0px 0px 15px  rgba(0,0,0,0.08);-moz-box-shadow: 0px 0px 15px  rgba(0,0,0,0.08);
}
.detailworklist ul li .img{ width: 100%; height:100vw; overflow: hidden; float: none; position: relative; }
.detailworklist ul li .img img{ width: auto; height: 100%; display: block; transition:0.5s; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.detailworklist ul li .img:hover img{ width: auto; height: 110%; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.detailworklist ul li .info{ width: auto; float: none;  background: #fff;padding: 20px;}
.detailworklist ul li .info .swiper-container{ height: auto; }

.detailworkbanner{ height: 55%; }
.detailworkbanner .pagewidth{ position: relative; height: 100%; }
.detailworkbanner .pagewidth h2{ position: absolute; left:18px;bottom: 60px; font-size: 18px; color: #fff; font-weight: normal; }
.detailworkbanner .pagewidth h1{ position: absolute; left:18px;bottom: 10px; font-size: 36px; color: #fff; font-weight: bold; }

.detailworkbanner .mouse{ border-radius: 40px; border:#fff solid 2px; z-index: 39; position: absolute; height: 30px; width: 18px; left: 50%; margin-left: -10px; bottom:60px; -webkit-animation:mouse 1.5s infinite linear ; display: none; }
.detailworkbanner .mouse span{ position: absolute; left: 50%;z-index: 39; border:#fff solid 2px; border-radius: 10px; bottom:20px;   width: 2px; height: 4px; margin-left: -3px;}

@-webkit-keyframes mouse {
    0%{
        bottom: 20px;
    }
    50%{
        bottom: 30px;
    }
    100%{
        bottom: 20px;
    }
}



/*头条*/
.detailtwomenu{ height: 50px; line-height: 50px; background: #f5f5f5; text-align: center;  }
.detailtwomenu ul li {height: 50px; line-height: 50px; display: inline-block; text-align: center; padding-left:50px; padding-right: 20px;}
.detailtwomenu ul li.active{background: #fff; position: relative;top: -20px; }
.detailtwomenu ul li a{color: #333; font-size: 14px; text-align: left; font-weight: bold; position: relative; text-decoration: none; display: block;}
.detailtwomenu ul li a span{ display: none;  }
.detailtwomenu ul li.active a{color: #446199;   }
.detailtwomenu ul li a img.icona{ position: absolute; width: 22px; top: 14px; left: -30px; opacity: 1 }
.detailtwomenu ul li a img.iconb{ position: absolute; width: 22px; top:14px; left: -30px; opacity: 0 }
.detailtwomenu ul li.active a img.icona{ position: absolute; width: 22px; top: 14px; left: -30px; opacity: 0 }
.detailtwomenu ul li.active a img.iconb{ position: absolute; width: 22px; top: 14px; left: -30px; opacity: 1 }
.detailtwomenu ul li.active a span{ display: inline; }

/*授权合作*/
.detailtwomenu1{ height: 50px; line-height: 50px; background: #f5f5f5; text-align: center;  }
.detailtwomenu1 ul li {height: 50px; line-height: 50px; display: inline-block; text-align: center; padding-left: 30px; padding-right: 20px;}
.detailtwomenu1 ul li.active{background: #fff; position: relative;top: -20px; padding-left: 45px; }
.detailtwomenu1 ul li a{color: #333; font-size: 14px; text-align: left; font-weight: bold; position: relative; text-decoration: none; display: block;}
.detailtwomenu1 ul li a span{ display: none;  }
.detailtwomenu1 ul li.active a{color: #446199;   }
.detailtwomenu1 ul li a img.icona{ position: absolute; width: 22px; top: 14px; left: -15px; opacity: 1 }
.detailtwomenu1 ul li a img.iconb{ position: absolute; width: 22px; top:14px; left: -15px; opacity: 0 }
.detailtwomenu1 ul li.active a img.icona{ position: absolute; width: 22px; top: 14px; left: -25px; opacity: 0 }
.detailtwomenu1 ul li.active a img.iconb{ position: absolute; width: 22px; top: 14px; left: -25px; opacity: 1 }
.detailtwomenu1 ul li.active a span{ display: inline; }

/*作品*/
.detailtwomenu2{ height: 50px; line-height: 50px; background: #f5f5f5; text-align: center;  }
.detailtwomenu2 ul li {height: 50px; line-height: 50px; display: inline-block; text-align: center; padding-left: 50px; padding-right: 20px;}
.detailtwomenu2 ul li.active{background: #fff; position: relative;top: -20px; }
.detailtwomenu2 ul li a{color: #333; font-size: 14px; text-align: left; font-weight: bold; position: relative; text-decoration: none; display: block;}
.detailtwomenu2 ul li a span{ display: none;  }
.detailtwomenu2 ul li.active a{color: #446199;   }
.detailtwomenu2 ul li a img.icona{ position: absolute; width: 22px; top: 14px; left: -30px; opacity: 1 }
.detailtwomenu2 ul li a img.iconb{ position: absolute; width: 22px; top:14px; left: -30px; opacity: 0 }
.detailtwomenu2 ul li.active a img.icona{ position: absolute; width: 22px; top: 14px; left: -30px; opacity: 0 }
.detailtwomenu2 ul li.active a img.iconb{ position: absolute; width: 22px; top: 14px; left: -30px; opacity: 1 }
.detailtwomenu2 ul li.active a span{ display: inline; }



.detailcooperation1 { padding-top: 30px; padding-bottom: 30px; background: #fff; margin: 0 30px;  }
.detailcooperation1 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation1 .swiper-container{ width: 100%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation1 .swiper-slide{ width: auto; text-align: center; }
.detailcooperation1 .swiper-slide img{ height: auto; width: 100%; }
.detailcooperation1 .description{ width: 100%; margin:0 auto; padding-bottom: 40px;border-top: #ececec solid 1px; padding-top: 30px; }
.detailcooperation1 .swiper-button-next{ top: 42%; right:  -10px; display: none; }
.detailcooperation1 .swiper-button-prev{ top: 42%; left:  -10px;  display: none;}
.detailcooperation1 .description p{ margin-bottom: 20px; line-height: 1.8em;  font-size: 14px; color: #333;}
.detailcooperation1 .description p a{ color: #496195; }


.detailcooperation2 { padding-top: 30px; padding-bottom: 30px; background: #fff;  margin: 0 10px;  }
.detailcooperation2 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation2 .swiper-container{ width: 100%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation2 .swiper-slide{ width: auto; }
.detailcooperation2 .swiper-slide img{ height: auto; width: 100%;border-radius: 3px; }
.detailcooperation2 .description{ width: 100%; margin:0 auto; padding-bottom: 40px;border-top: #ececec solid 1px; padding-top: 30px; }
.detailcooperation2 .swiper-button-next{ top: 42%; right:  10px;  display: none;}
.detailcooperation2 .swiper-button-prev{ top: 42%; left:  10px; display: none; }
.detailcooperation2 .description p{ margin-bottom: 20px; line-height: 1.8em; font-size: 14px;  color: #333;}
.detailcooperation2 .description p a{ color: #496195; }

.detailcooperation3 { padding-top: 30px; padding-bottom: 30px; background: #fff; margin: 0 30px;  }
.detailcooperation3 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation3 .swiper-container{ width: 100%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation3 .swiper-slide{ width: auto; text-align: center; }
.detailcooperation3 .swiper-slide img{ height: auto; width: 100%; }
.detailcooperation3 .description{ width: 100%; margin:0 auto; padding-bottom: 40px;border-top: #ececec solid 1px; padding-top: 30px; }
.detailcooperation3 .swiper-button-next{ top: 42%; right:  -10px;  display: none;}
.detailcooperation3 .swiper-button-prev{ top: 42%; left:  -10px; display: none; }
.detailcooperation3 .description p{ margin-bottom: 20px; line-height: 1.8em;  font-size: 14px; color: #333;}
.detailcooperation3 .description p a{ color: #496195; }



.detailcooperation4 { padding-top: 30px; padding-bottom: 30px; background: #fff;  }
.detailcooperation4 .pagewidth{ position: relative; margin-bottom: 20px; padding-left: 20px; padding-right: 20px;}
.detailcooperation4 .swiper-container{ width: 100%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation4 .swiper-slide{ width: auto; text-align: center; }
.detailcooperation4 .swiper-slide img{ width: 100%; }
.detailcooperation4 .description{ width: 100%; margin:0 auto; padding-bottom: 10px; padding-top: 10px; }
.detailcooperation4 .description p{ margin-bottom: 20px; line-height: 1.8em;  text-align: justify; font-size: 14px; color: #333; }
.detailcooperation4 .swiper-button-next{ top: 42%; right: -20px; display: none; }
.detailcooperation4 .swiper-button-prev{ top: 42%; left: -20px; display: none; }
.detailcooperation4 .description p a{ color: #496195; }
.detailcooperation4 .description p strong{ font-size: 18px; }
.detailcooperation4 .description img{ border-radius: 3px; }

.detailcooperation5 { padding-top: 30px; padding-bottom: 30px; background: #fff;  margin: 0 30px;  }
.detailcooperation5 .pagewidth{ position: relative; margin-bottom: 20px;}
.detailcooperation5 .swiper-container{ width: 100%; margin:0 auto; padding-bottom: 40px; }
.detailcooperation5 .swiper-slide{ width: auto; }
.detailcooperation5 .swiper-slide img{ height:auto; width: 100%; border-radius: 3px; }
.detailcooperation5 .description{ width: 100%; margin:0 auto; padding-bottom: 40px; padding-top: 30px; }
.detailcooperation5 .description p{ margin-bottom: 20px; line-height: 1.8em; color: #333; font-size: 14px; }
.detailcooperation5 .swiper-button-next{ top: 42%; right: -20px; display: none; }
.detailcooperation5 .swiper-button-prev{ top: 42%; left: -20px; display: none; }
.detailcooperation5 .description p a{ color: #496195; }





.detailcooperation4video{ position: relative; width: 100%; margin:0 auto; }
.detailcooperation4video video{  width: 100%; border-radius: 3px;}
.work_introduce,.work_poster,.work_still,.work_video { padding: 30px 20px;}
.work_poster .swiper-button-next { display: none;}
.work_poster .swiper-button-prev { display: none;}
.work_poster .swiper-slide{ text-align: center; }
.work_poster .swiper-slide img{ height: 380px; width: auto; border-radius: 3px;}
.work_poster .swiper-container{ padding-bottom: 40px; }
.work_still .pagewidth{position:relative;}
.work_still .swiper-container{ padding-bottom: 40px; }
.work_still .swiper-slide{ width: auto; }
.work_still .swiper-slide img{ height: auto; width: 100%; border-radius: 3px; }
.work_still .swiper-button-next { display: none;}
.work_still .swiper-button-prev { display: none;}
.work_video{ position: relative;width: auto;}
.work_video .video_box{position:relative; }
.work_video video{width:100% ; background: #000; border-radius: 3px;}


.work_poster .swiper-button-next{ top: 52%; right: 20px; }
.work_poster .swiper-button-prev{ top: 52%; left: 20px; }
.work_still .swiper-button-next{ top: 48%;right: 20px;  }
.work_still .swiper-button-prev{ top: 48%;left: 20px;  }

.news_list { padding-top: 20px; padding-bottom: 20px; background: #fff; margin: 0 20px;  }
.news_list ul li { margin-bottom:15px; padding-bottom: 15px;  }
.news_list ul li .img{ float: none; width: 100%; margin-right: 0px; border-radius: 3px; overflow: hidden; }
.news_list ul li .img img{ display: block;width: 100%; height: auto;}
.news_list ul li .text{float: none; width: 100%;}
.news_list ul li .text h2 { line-height: 100%;  padding-top: 15px; }
.news_list ul li .text h2 a{ font-size: 18px;  color: #333;}
.news_list ul li .text .time{ font-size: 14px;  color: #666;  margin-bottom:10px;}
.news_list ul li .text .description{ font-size: 14px;  color: #666; margin-bottom: 10px; }
.news_list ul li .text .more a{ font-size: 16px;  color: #39309c; }
.news_list ul li:hover .text h2 a{  color: #000;}
.news_list ul li:hover .text .description{color: #222; }

.news_detail{ padding-top: 30px; padding-bottom: 30px; margin: 0 20px;  }
.news_detail .content{ padding-top: 30px; padding-bottom: 30px; text-align: justify; font-size: 14px; color: #333; line-height: 1.8em padding-bottom: 30px; border-bottom: #ececec solid 1px; }
.news_detail .content .html img{ width: 100%; margin: 20px auto; display: block; border-radius: 3px; }
.news_detail .content .html p{ margin-bottom: 10px;text-align: justify; font-size: 14px; color: #333; line-height: 1.8em }
.news_detail .other{ padding-top: 30px; padding-bottom: 50px; font-size: 14px;}
.news_detail .other .left{float: none; margin-bottom: 10px;}
.news_detail .other .right{float: none;}
.news_detail .other a{ color: #222; font-size: 14px; } 
.news_detail .pagewidth{ width: 100%; }
.october_honor .content a{ text-decoration: none; text-align: left; padding-bottom: 5px; font-size: 14px; line-height: 1.6em; margin-bottom: 10px;}

.detailbanner{ height: 300px; width: 100%; }
.detailbanner .pagewidth{ position: relative; opacity: 1;transition:0.5s; }
.detailbanner .pagewidth h1{ position: absolute; left: 0px; right: 0px; top:180px; color: #fff; font-size: 24px; text-align: center; text-shadow: 1px 2px 2px rgba(0,0,0,0.1);}
.detailbanner .pagewidth p{ position: absolute; left: 0px; right: 0px; top:220px; text-transform: uppercase; color: #fff; font-weight: bold; font-size: 14px; text-align: center; text-shadow: 1px 2px 2px rgba(0,0,0,0.1);}
.detailbanner .hidden{ opacity: 0; }
.bellows__header h1, .bellows__header h2, .bellows__header h3, .bellows__header h4 { font-size: 16px; cursor: pointer;}
.news_detail .title h1{text-align: center; font-size: 18px; line-height:1.6em; margin-bottom: 10px;}
.news_detail .title p span{ margin-right:  5px; margin-left:  5px; }

.mobiletwomenu{ display:block; text-align:center;color: #333; font-size: 18px; font-weight: bold; text-align: center; padding-top: 30px; padding-bottom: 10px; display: none; }
.mobiletwomenu img{  height: 32px;position: absolute;  left: 0;   top: 0;  }
.mobiletwomenu span{ height: 32px; line-height: 32px; display: inline-block;position: relative; padding-left: 40px;}



}
@media screen and (max-width: 667px) {
.october_contact .map .left .add{ z-index: 33; position: absolute;width:22px; left: 50%; margin-left: 20px; top:190px; -webkit-animation:add 1.5s infinite linear ;}
.october_contact .map .left .add img{ width:100%; display: block; }
@-webkit-keyframes add {
   0%{
        margin-top: 5px;
    }
    50%{
        margin-top: 0px;
    }
    100%{
        margin-top: 5px;
    }
}
}


@media screen and (max-width: 450px) {
.october_team .right .swiper-slide{ height: 210px; }
.october_contact .map .left .add{ z-index: 33; position: absolute;width:22px; left: 50%; margin-left: 10px; top:100px; -webkit-animation:add 1.5s infinite linear ;}
.october_contact .map .left .add img{ width:100%; display: block; }
@-webkit-keyframes add {
   0%{
        margin-top: 5px;
    }
    50%{
        margin-top: 0px;
    }
    100%{
        margin-top: 5px;
    }
}
}

/*iphone8 plus*/
@media screen and (max-width: 414px) {
.october_team .right .swiper-slide{ height: 210px; }
.october_contact .map .left .add{ z-index: 33; position: absolute;width:22px; left: 50%; margin-left: 10px; top:100px; -webkit-animation:add 1.5s infinite linear ;}
.october_contact .map .left .add img{ width:100%; display: block; }
@-webkit-keyframes add {
   0%{
        margin-top: 5px;
    }
    50%{
        margin-top: 0px;
    }
    100%{
        margin-top: 5px;
    }
}
}
/*iphone8*/
@media screen and (max-width: 375px) {
.october_contact .map .left .add{ z-index: 33; position: absolute;width:22px; left: 50%; margin-left: 8px; top:85px; -webkit-animation:add 1.5s infinite linear ;}
.october_contact .map .left .add img{ width:100%; display: block; }
@-webkit-keyframes add {
   0%{
        margin-top: 5px;
    }
    50%{
        margin-top: 0px;
    }
    100%{
        margin-top: 5px;
    }
}
}
/*iphone se*/
@media screen and (max-width: 320px) {}