/*全局*/
html {
    /* 10÷16=75% 浏览器默认大小16 */
    font-size: 62.5%!important;
}
@media only screen and (min-width: 1920px){
    html {
        /* 12÷16=75% */
        font-size: 75%!important;
    }
}
@font-face {
    font-family: SarasaLight;
    src: url('/Public/font/SARASA-MONO-SC-LIGHT.TTF')
}
@font-face {
    font-family: SarasaSemiBold;
    src: url('/Public/font/SARASA-MONO-SC-SEMIBOLD.TTF')
}
@font-face {
    font-family: zurchlxc;
    src: url('/Public/font/ZURCHLXC.TTF')
}
@font-face {
    font-family: PuHuiLight;
    src: url('/Public/font/Alibaba-PuHuiTi-Light.TTF')
}
@font-face {
    font-family: SiYuanST;
    src: url('/Public/font/SourceHanSerifCN.woff2'),
    url('/Public/font/SourceHanSerifCN.otf'),
    url('/Public/font/SourceHanSerifCN.ttf');
}

body {
    font-size: 1.4rem;
    color: #3F3F3F;
    background-color: #e8e8e8;
    font-family: 'PingFang Light', "Microsoft YaHei", "Arial", "宋体", sans-serif;
}
div.container-fluid {
    padding: 0 0;
    min-width: 960px;
    position: relative;
}
div.container-fluid.spg {
    height: 100vh;
}
/*首页分屏*/
.page1 {
    position: fixed;
    height: 100vh;
    left: 0;
    top: 0;
    z-index: 5;
}
.page2 {
    /*position: absolute;*/
    /*left: 0;*/
    /*top: 0;*/
    /*margin-top: 70px;*/
    padding-top: 70px;
    background-color: #e8e8e8;
    /*z-index: 10;*/
}
.skrollr-desktop body {
    height:100% !important;
}
#skrollr-body {
    height:100%;
    overflow:visible;
    position:absolute;
    z-index: 100;
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
    width: 12px;
    height: 12px;
    background-color: #828383;
    margin: 0 0;
    left: 0;
    top: 0;
}
#fp-nav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li a.active span,
.fp-slidesNav ul li:hover a.active span {
    background-color: #ee7700;
    margin: 0 0;
}
#fp-nav ul li:hover a span,
.fp-slidesNav ul li:hover a span {
    width: 12px;
    height: 12px;
    margin: 0 0;
    background-color: #9a9b9b;
}
/*鼠标跟随*/
.cursor {
    width: 2.6vw;
    height: 2.6vw;
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    margin: -25px 0 0 -25px;
    z-index: 120;
    visibility: hidden;
}
.cursor:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: blue;
    border-radius: 50%;
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(1);
    transition: all .4s cubic-bezier(.3,1.83,.49,.88);
}
.cursor, .cursor::after {
    user-select: none;
    pointer-events: none;
    mix-blend-mode: difference;
}

/*导航*/
/* 导航字体大小，首页/单页2.6rem,列表1.8rem */
/* 60*60，60*40， 25 */
.nav-bar {
    display: block;
    margin: 0 auto;
    height: auto;
}
.nav-bar nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.nav-bar nav > div {
    display: inline-block;
}
.nav-bar a {
    display: inline-block;
    text-decoration: none;
    color: #342c2a;
}
.nav-bar a.logo img {
    height: 35px;
    border: 0;
    outline: 0;
}
.nav-bar nav .main {
    margin: 0 0;
    padding: 0 0;
    display: flex;
    /*margin-block: 0;*/
    /*padding-inline: 0;*/
    /*background-color: #e8e8e8;*/
}
.nav-bar .main > li {
    display: inline-block;
    list-style: none;
}
.nav-bar .main > li > a {
    display: block;
    text-align: center;
    font-size: 1.8rem;
    overflow: hidden;
    height: 35px;
    line-height: 35px;
}
.nav-bar .main > li > a:after {
    width: 0;
    height: 2px;
    position: absolute;
    left: 50%;
    bottom: 0;
    content: '';
    background-color: #FEFEFE;
    -webkit-transition: all .3s;
    border-radius: 5px;
}
.nav-bar .main a > span {
    display: block;
    line-height: 35px;
}
.nav-bar .main > li {
    position: relative;
    width: 100px;
    text-align: center;
}
.nav-bar .main > li:hover > a {
    font-weight: bold;
}
.nav-bar .main > li:hover > a:after {
    width: 40%;
    left: 30%;
}
.nav-bar .main > li:hover .en {
    display: none;
}
.nav-bar .sub {
    display: none;
    position: absolute;
    left: 50%;
    top: 35px;
    margin-left: -67px;
    width: 134px;
    background-color: rgba(254, 254, 254, 0.5);
    padding: 10px 0;
    border-radius: 10px; /* 圆角的半径 */
    z-index: 999;
}
.nav-bar .sub a {
    display: inline-block;
    margin: 8px 25px;
    padding: 8px 0;
    font-size: 1.6rem;
    position: relative;
    line-height: 100%;
}
.nav-bar .sub a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 0;
    height: 1px;
    background-color: #FEFEFE;
    transition: width 0.3s, left 0.3s;
}
.nav-bar .sub a:hover {
    color: #FFFFFF;
}
.nav-bar .sub a:hover::after {
    width: 100%;
    left: 0;
}
.nav-bar .main > li:hover .sub {
    display: block;
}
/*.page2 .nav-bar {*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 100%;*/
/*    background-color: #0f0f0f;*/
/*    z-index: 999;*/
/*}*/
/*.page2  nav {*/
/*    width: 92%;*/
/*    margin: 0 auto;*/
/*    height: 70px;*/
/*}*/
/*.page2 .main > li > a {*/
/*    color: #e8e8e8;*/
/*}*/
/*.page2 .sub {*/
/*    background-color: rgba(254, 254, 254, 0.7);*/
/*}*/
.jobpg-nav {
    width: 100%;
    background-color: #0f0f0f;
    margin-bottom: 110px;
}
.jobpg-nav .nav-bar {
    width: 92%;
}
.jobpg-nav .nav-bar nav {
    height: 70px;
}
.jobpg-nav .main > li > a {
    color: #e8e8e8;
}
.jobpg-nav .sub {
    background-color: rgba(254, 254, 254, 0.7);
}
.work-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #0f0f0f;
    z-index: 990;
}
.work-nav .nav-bar {
    width: 92%;
}
.work-nav  nav {
    height: 70px;
}
.work-nav .main > li > a {
    color: #e8e8e8;
}
.work-nav .sub {
    background-color: rgba(254, 254, 254, 0.7);
}

/*home 首页*/
.home {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}
.home img.logo {
    position: absolute;
    height: 92vh;
    left: 2%;
    top: 6%;
    z-index: 10;
}
.home video {
    width: 100%;
    height: 100vh;
    object-fit: cover; /* 确保视频内容覆盖整个元素区域 */
    position: fixed; /* 固定位置 */
    top: 0;
    left: 0;
}
.home-nav {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    z-index: 50;
}
.home .nav-bar {
    margin: 20px auto 0 auto;
    width: 94%;
}
.home .nav-bar a {
    color: #fefefe;
}

/*首页视频*/
.home-vod {
    display: block;
    position: relative;
    width: 100%;
    height: 100vh;
    font-size: 0;
    overflow: hidden;
}
.home-vod video {
    display: inline-block;
    margin: 0 auto;
    object-fit: fill;
}
.home-vod img.logo {
    display: block;
    position: absolute;
    width: 25vh;
    border: 0;
    left: 2vw;
    bottom: 8%;
    z-index: 99;
}
/*项目作品*/
.swiper {
    width: 100%;
    height: 100vh;
}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}
.swiper-slide img {
    display: block;
    width: 100%;
    height: 100vh;
    object-fit: cover;
}
/*.my-bullet {*/
/*    width: 13px;*/
/*    height: 13px;*/
/*    background-color: rgb(130, 131, 131);*/
/*}*/
/*.my-bullet-active {*/
/*    background-color: rgb(238, 119, 0);*/
/*}*/
.swiper-pagination-bullet {
    width: 13px;
    height: 13px;
    /*background-color: rgb(130, 131, 131);*/
    margin-left: 10px;
    margin-right: 10px;
}
.swiper-pagination-bullet-active {
    background-color: rgb(238, 119, 0);
}
/*作品列表*/
.work-list .work-box {
    height: 100vh;
    width: 92%;
    margin: 0 auto;
    padding: 80px 0 10px 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    align-content: space-evenly;
}
.work-list .work-box .item {
    display: inline-block;
    width: 32.5%;
    text-decoration: none;
    color: #383637;
}
.work-box .item:active,
.work-box .item:focus {
    border: none;
    outline: none;
}
.work-box .item .thum {
    position: relative;
    width: 100%;
    height: 213px;
    overflow: hidden;
}
.work-box .item .thum img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    transition: 0.5s;
}
.work-box .item .title {
    font-family: SarasaLight;
    font-size: 1.8rem;
    line-height: 200%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #0f0f0f;
    font-weight: 200;
    text-align: left;
}
.work-box .item .title span {
    display: inline-block;
    margin: 0 3px;
}
.work-box .item:hover .title {
    color: #666666;
}
.work-box .item:hover .thum img {
    transform: scale(1.1);
}

/*详细页按钮*/
a.back-btn {
    padding: 10px 25px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 110px;
    background-color: #fefefe;
    border-radius: 60px;
    font-size: 1.2rem;
    text-decoration: none;
    overflow: hidden;
}
a.back-btn > span {
    display: inline-block;
    line-height: 100%;
}
a.back-btn .dot {
    width: 5px;
    height: 5px;
    border-radius: 80px;
    background-color: #e6212a;
    z-index: 1;
    transition:transform cubic-bezier(.35,0,0,1) .4s;
}
a.back-btn .en {
    padding-right: 10px;
    z-index: 5;
    color: #342e2e;
}
a.back-btn .cn {
    display: none;
    padding-right: 20px;
    z-index: 5;
    color: #fffff3;
    background-image: url("/Public/img/arrow_w.png");
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 10px 7px;
}
.jobpg-mail a.back-btn .cn {
    background-image: url("/Public/img/arrowl.png");
    background-position: left center;
    padding-left: 20px;
    padding-right: 0;
}
a.back-btn:hover .dot {
    transform:translate3d(4em,0,0) scale(38);
}
a.back-btn:hover .en {
    display: none;
}
a.back-btn:hover .cn {
    display: inline;
}


/*作品详情*/
.work-details {
    margin: 0 auto;
    width: 92%;
    height: 100vh;
    position: relative;
    overflow: hidden;
}
.work-details .leaf {
    position: absolute;
    left: -100px;
    bottom: -100px;
    width: 1200px;
    animation: ruffle 3s linear infinite;
    z-index: 1;
}
@keyframes ruffle {
    50% { transform: skew(5deg) rotate(-5deg) }
    100% { transform: skew(0) rotate(0) }
}
/*返回*/
.work-details a.back-btn {
    position: absolute;
    left: 0.8%;
    bottom: 16%;
    z-index: 100;
}
.work-content {
    padding-top: 70px;
    height: 100vh;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.work-content .txtBox {
    width: 25%;
    font-family: SarasaLight;
    z-index: 100;
}
.work-content .txtBox .title {
    white-space: pre-wrap;
    font-size: 2.8rem;
}
.work-content .txtBox .intro {
    margin-top: 30px;
    font-size: 1.6rem;
    line-height: 200%;
    text-align: justify;
    text-align-last: left;
	white-space: pre-wrap;
}
.work-content .carousel {
    width: 70%;
    z-index: 100;
}
.work-content .carousel .carousel-inner .item {
    height: 70vh;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.work-content .carousel-control.left,
.work-content .carousel-control.right {
    background: none;
    opacity: 0.2;
}
.work-content .carousel-control.left:hover,
.work-content .carousel-control.right:hover {
    opacity: 1;
}
.work-content .carousel-control.left .chevron-left,
.work-content .carousel-control.right .chevron-right {
    position: absolute;
    left: 50%;
    top: 50%;
    display: inline-block;
    width: 33px;
    height: 70px;
    margin-left: -15px;
    margin-top: -35px;
    background-image: url("/Public/img/chevron-left.png");
    background-repeat: no-repeat;
    background-position: center;
}
.work-content .carousel-control.right .chevron-right {
    right: 50%;
    margin-right: -15px;
    background-image: url("/Public/img/chevron-right.png");
}
.work-content .video {
    width: 70%;
    z-index: 100;
}
/*关于我们*/
.about-box {
    width: 92%;
    margin: 70px auto 0 auto;
    padding-top: 50px;
    text-align: center;
}
.about-box img {
    text-align: center;
    width: 90%;
    max-width: 1310px;
}
.about-box .about {
    font-size: 2rem;
    font-weight: 200;
    padding: 80px 0 50px 0;
    line-height: 200%;
}
.about-box .culture {
    font-size: 1.8rem;
    text-align: center;
    color: #bb3532;
    margin: 0 auto;
}
.about-box .culture > span {
    margin: 0 8px;
    display: inline-block;
}

/*创意团队*/
.group-box {
    width: 70%;
    margin: 0 auto;
    padding-bottom: 50px;
}
.group-box .title {
    font-family: SarasaSemiBold;
    font-size: 3rem;
    text-align: center;
    padding: 75px 0 50px 0;
}
.group-box img {
    width: 100%;
}
.about-banner img {
    width: 100%;
}
/*历史事件*/
.chronicle-box {
    width: 80%;
    margin: 0 auto;
}
.chronicle-box .title {
    font-family: SarasaSemiBold;
    font-size: 3rem;
    text-align: center;
    padding: 60px 0 50px 0;
}
.chronicle-box img {
    width: 100%;
}
/*合作伙伴*/
.client-box {
    margin-top: 105px;
    width: 100%;
}
.client-box .custom-title {
    font-family: SarasaSemiBold;
    text-align: center;
    line-height: 100%;
    font-size: 3rem;
}
.client-box .custom-logo {
    width: 80%;
    margin: 100px auto 80px auto;
}
.client-box img {
    width: 100%;
}
/*.chronicle-pause {*/
/*    position: fixed;*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 100vw;*/
/*    height: 100vh;*/
/*    z-index: 100;*/
/*}*/
/*.chronicle-inner {*/
/*    margin: 120px 0 100px 40px;*/
/*    width: 4457px;*/
/*    height: 375px;*/
/*    position: relative;*/
/*}*/
/*.chronicle-line {*/
/*    fill: none;*/
/*    stroke:#E62129;*/
/*    stroke-width:1.09573;*/
/*    stroke-dasharray:1791;*/
/*    stroke-dashoffset:0;*/
/*    stroke-opacity: 0;*/
/*}*/
/*.chronicle-circle {*/
/*    fill:#E62129;*/
/*    opacity: 0;*/
/*}*/
/*.chronicle-inner .chr-date {*/
/*    display: inline-block;*/
/*    position: absolute;*/
/*    z-index: 10;*/
/*    opacity: 0;*/
/*    transition: opacity 0.5s;*/
/*}*/
/*.chronicle-inner .chr-date .dt {*/
/*    display: block;*/
/*    line-height: 100%;*/
/*    font-family: zurchlxc;*/
/*    font-size: 7.2rem;*/
/*}*/
/*.chronicle-inner .chr-date .wd {*/
/*    display: block;*/
/*    line-height: 100%;*/
/*    font-family: SarasaLight;*/
/*    font-size: 1.6rem;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(2) {*/
/*    left: 30px;*/
/*    top: 30px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(3) {*/
/*    left: 420px;*/
/*    top: 371px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(4) {*/
/*    left: 759px;*/
/*    top: -101px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(5) {*/
/*    left: 1134px;*/
/*    top: 363px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(6) {*/
/*    left: 1689px;*/
/*    top: -4px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(7) {*/
/*    left: 2035px;*/
/*    top: 340px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(8) {*/
/*    left: 2572px;*/
/*    top: -14px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(9) {*/
/*    left: 2725px;*/
/*    top: 294px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(10) {*/
/*    left: 3290px;*/
/*    top: 145px;*/
/*}*/
/*.chronicle-inner .chr-date:nth-child(11) {*/
/*    left: 3995px;*/
/*    top: 316px;*/
/*    !*left: 4378px;*!*/
/*    !*top: -120px;*!*/
/*}*/

/*页脚*/
.footer-box {
    padding: 60px 4% 0 4%;
    border-top: 2px solid #fefefe;
}
.footer-box .line1 {
    height: 270px;
    font-size: 0;
    vertical-align: top;
}
.footer-box .line1 > div {
    display: inline-block;
    vertical-align: top;
}
.footer-box .line1 .logo {
    width: 32%;
}
.footer-box .line1 .logo img {
    width: 190px;
}
.footer-box .line1 .title {
    font-size: 3.2rem;
    line-height: normal;
    padding-bottom: 30px;
    font-weight: bold;
    color: #332d2d;
}
.footer-box .contact {
    width: 45%;
}
.footer-box .join {
    width: 23%;
}
.footer-box .line1 p,
.footer-box .line1 a
{
    display: block;
    margin: 0 0 20px 0;
    color: #545253;
    font-size: 1.6rem;
    line-height: 100%;
}
.footer-box .join a {
    padding-bottom: 5px;
    text-decoration: none;
    border-bottom: 1px solid #332d2d;
}
.footer-box .icp {
    padding-bottom: 10px;
    text-align: center;
    color: rgba(51,45,45,.45);
    font-size: 1rem;
}
/*招聘*/
.jobpg {
    position: relative;
    width: 92%;
    margin: 0 auto;
    padding-bottom: 60px;
}
.jobpg .item {
    padding-top: 15px;
    padding-bottom: 70px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    border-top: 1px solid #a2a2a2;
    color: #3e3e3e;
    font-size: 2rem;
    font-weight: 200;
    text-align: left;
}
.jobpg .item .title {
    display: inline-block;
    min-width: 250px;
    vertical-align: top;
    font-family: PuHuiLight;
    font-size: 3.4rem;
}
.jobpg .item .requ {
    display: inline-block;
    width: 65%;
    vertical-align: top;
    font-family: SarasaLight;
    white-space: pre-line;
    line-height: 175%;
}
.jobpg-mail {
    position: relative;
    padding-left: 35%;
}
/*项目列表页页脚*/
.catchphrase {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 70px;
    height: 100vh;
    width: 100%;
    font-family: SiYuanST;
    font-size: 5.6rem;
    line-height: 180%;
    color: #FFFFFF;
    background-image: url("/Public/img/catchphrase_bg.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.catchphrase p {
    width: 71%;
    margin: 0 0;
    text-align: justify;
}
.catchphrase p:last-child {
    margin-top: 15px;
    text-align: right;
}