:root {
    --color-primary: #222222;
    --color-gray: #898989;
    --color-gray2: #757475;
    --color-black: #000000;
    --color-white: #FFFFFF;
}
html,body{width: 100%;height: 100%;margin: 0;padding: 0;}
/* 顶部导航 */
.header{position:fixed;top: 0px;left: 0;z-index: 9999;width: 100%;height: 5rem;background-color: var(--color-white);}
.header-main{height: 100%;margin: auto;display: flex;flex-direction: row;justify-content:space-between; align-items: center;}

/* logo */
.header-main .logo{height: 3.3rem;}
.header-main .logo:hover{cursor: pointer;}
.header-main .logo img{height: 100%;}

/*一级菜单导航*/
.nav, .nav>.item{height: 100%;}
.nav>.item>a{
    display: flex;
    align-items: center;
    height: 100%;
    font-size: 16px;
    color: #232323;
    margin: 0 1.25rem;
}
.nav>.item>a.active,
.nav>.item>a:hover{color: #999999;cursor: pointer;text-decoration: none;}

/*====移动端样式=====*/
/*菜单icon默认样式*/
.menu-icon{
    width: 2.5rem;
    height: calc( 1.8rem + 1px );
    overflow: hidden;
    position: relative;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
    display: block;
    z-index: 9999;
}
.menu-icon:hover{cursor: pointer;}
.menu-icon span {
    display: block;
    position: absolute;
    height: 1px;
    width: 100%;
    background: var(--color-black);
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}
.menu-icon span:nth-child(1) {top: 0rem;}
.menu-icon span:nth-child(2),.menu-icon span:nth-child(3) {top: 0.9rem;}
.menu-icon span:nth-child(4) {top: 1.8rem;}
/*菜单icon打开样式*/
.menu-open .menu-icon span:nth-child(1),.menu-open .menu-icon span:nth-child(4) {top: 0.9rem;width: 0%;left: 50%;}
.menu-open .menu-icon span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.menu-open .menu-icon span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
/*菜单列表默认样式*/
.nav-mobile-list{
    position: absolute;
    height: calc(100vh - 5rem);
    width: 100vw;
    top: 5rem;
    left: 100vw;
    right: 0;
    background-color: var(--color-white);
    z-index: 999;
    padding: 1.5rem 1.5rem;
}
/*菜单列表打开样式*/
.menu-close .nav-mobile-list{
    left: 100vw;
    transition: left .3s ease;
}
/*菜单列表打开样式*/
.menu-open .nav-mobile-list{
    left: 0;
    transition: left .3s ease;
}

.nav-mobile-list>.item{height: 48px;}
.nav-mobile-list>.item>a{
    display: flex;
    align-items: center;
    height: 100%;
    font-size: 16px;
    color: #232323;
    margin-left: 15px;
}
.nav-mobile-list>.item>a.active,
.nav-mobile-list>.item>a:hover{color: #999999;cursor: pointer;text-decoration: none;}


/*内容页*/
.cont{width: 100%; background-color: #f5f5f5;}
.cont .cont-main{margin: auto;}

/*富文本内容样式*/
.content-details{
    font-family: -apple-system,BlinkMacSystemFont,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    line-height: 1.8;
    color: #333;
    word-break: break-word;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    text-align: justify;
    overflow: hidden;
    zoom: 1;
    position: relative;
}
.content-details img {
    margin: 0 auto;
    max-width: 100%;
    height: auto!important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
    vertical-align: middle;
}

/* 底部样式 */
.bottom{width: 100%;}
/*底部内容区*/
.bottom-main{
    height: 100%;
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content:space-between;
    align-items: flex-start;
}
.bottom-main .bottom-item{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    font-size: 14px;
    color: var(--color-primary);
}

.bottom-main .bottom-item-nav a{color: var(--color-primary);margin-bottom: 1.125rem;}
.bottom-main .bottom-item-nav a:hover{text-decoration: none;}
.bottom-main .bottom-item-location span{margin-bottom: 1.25rem;}
.bottom-main .bottom-item-contact span{margin-bottom: 1rem;}
.bottom-main .bottom-item-new-media a{color: var(--color-primary);margin-bottom: 1.25rem;}
.bottom-main .bottom-item-new-media a:hover{text-decoration: none;}
/*底部友情链接*/
.bottom-link{width: 100%;background: #fafafa;}
.bottom-link-main{
    height: 100%;
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content:flex-start;
    align-items: flex-start;
    padding-top: 15px;
    padding-bottom: 20px;
    border-bottom: 1px solid #c8c8c8;
}
.bottom-link-main a{color: #6e6e6e;margin-left: 0.8rem;margin-right: 0.8rem;}
.bottom-link-main a:hover{color: #6e6e6e;}
/*底部版权*/
.bottom-copyright{display: flex;flex-direction: row;justify-content: center;align-items: center;padding: 15px 15px;background: #fafafa;color: #999;font-size: 12px;}
.bottom-copyright a{margin-left:15px;text-decoration:none;color: #6c6c6c;}

/*移动端兼容样式*/
/*响应式样式*/
@media screen and (max-width: 950px) {
    html{font-size: 10px!important;}
    /*pc端样式隐藏*/
    .pc-ele{display: none;}
    /*一级导航*/
    .header-main{width: 100%;padding-left: 1.5rem;padding-right: 1.5rem;}
    /*页脚*/
    .bottom-main{width: 100%; padding: 3rem 15px 2rem 15px;}
    .bottom-main .bottom-item{width: 100%;}
    .bottom-main .bottom-item:nth-child(1),
    .bottom-main .bottom-item:nth-child(2),
    .bottom-main .bottom-item:nth-child(3) {margin-bottom: 1.5rem;}
    .bottom-link-main{width: 100%; padding-left: 15px;padding-right: 15px;}
    .bottom-copyright{display: flex;flex-direction: column;text-align: center;}
    .bottom-copyright a{margin-left:0;}
    /*内容块*/
    .cont .cont-main{width: 100%;padding-left: 15px;padding-right: 15px;}
    /*案例页*/
    .banner1 .item-contet .content1{font-size:1rem;}
    .banner1 .item-contet .content2{font-size:2rem;}
    .banner1 .item-contet .content3{font-size:1.5rem;}
    .works-list .works-item{width: 100%;}
    .cont-idear-list .cont-idear-item{width: 100%;}

    .cont-advantage-title{padding-top: 5rem;}
    .cont-advantage-list{padding-top: 3rem;padding-bottom: 6rem;}
    .cont-advantage-list div{width: 50%;}
    .cont-advantage-list div:nth-child(1),
    .cont-advantage-list div:nth-child(2){margin-bottom: 3rem;}

    .cps-item{width: calc( (100% - 2rem) / 2 );}
    .cps-item-circle{width: 70%;padding:70% 0 0;}
    /*案例详情页*/
    .cont-video video{width: 100%;}
    .works-list-d .works-item-d{width: calc( (100% - 1.5rem) / 2 );}
    /*关于我们*/
    .about-desc>div{width: 100%;}
    .about-team-list{ gap: calc(6.6% / 1) 1.5rem;}
    .about-team-list .team-item{width: calc( (100% - 6.6%) / 2 );}
    /*联系我们*/
    .contact-left{width: 100%;}
    .contact-right{width: 100%}
    /*业务*/
    .service-item .service-item-left{width: 100%;margin-top: 2.25rem;}
    .service-item .service-item-right{width: 100%;}
    /*观点*/
    .idear-top .idear-top-title .idear-top-logo{margin-left: 1rem;margin-right: 1rem;}
    .idear-item-left,.idear-item-right{width: 100%;}
    .idear-item-left{margin-top: 1.5rem;}
    .idear-item-left .item-info{width: 100%;margin-bottom: 3rem;}
    /*观点详情*/
    .idear-item-details{padding-top: 15px; padding-bottom: 60px;}
    .idear-item-details-left{width: 100%;margin-top: 40px;}
    .idear-item-details-right{width: 100%;}
    .idear-item-details-right{display: flex;flex-direction: row;justify-content: space-between;align-items: flex-start;}
    .item-date-details{margin-bottom: 0px;}
    .item-tag-list-details{display: flex;flex-direction: row;justify-content: flex-start;align-items: flex-start;}
    .item-tag-list-details span{margin-left: 20px;}
    .idear-page{justify-content: center;padding-top: 50px;padding-bottom: 60px;}
}
@media screen and (min-width: 950px) {
    html{font-size: 11px!important;}
    /*移动端样式隐藏*/
    .mobile-ele{display: none;}
    /*一级导航*/
    .header-main{width: 900px;}
    /*页脚*/
    .bottom-main{width: 900px;padding-top: 5rem;padding-bottom: 3rem;}
    .bottom-main .bottom-item{width: 50%;}
    .bottom-main .bottom-item:nth-child(1),
    .bottom-main .bottom-item:nth-child(2){margin-bottom: 1.5rem;}
    .bottom-link-main{width: 900px;}
    .bottom-copyright{}
    /*内容块*/
    .cont .cont-main{width: 900px;}
    /*案例页*/
    .banner1 .item-contet .content1{font-size:2rem;}
    .banner1 .item-contet .content2{font-size:4rem;}
    .banner1 .item-contet .content3{font-size:2.5rem;}
    .works-list .works-item{width: calc( (100% - 1.875rem) / 2 );}

    .cont-idear-list .cont-idear-item{width: calc( (100% - 1.875rem) / 2 );}

    .cont-advantage-title{padding-top: 6rem;}
    .cont-advantage-list{padding-top: 5rem;padding-bottom: 7rem;}
    .cont-advantage-list div{width: 25%;}
    .cps-item{width: calc( (100% - 2rem) / 2 );}
    .cps-item-circle{width: 50%;padding:50% 0 0;}
    /*案例详情页*/
    .works-list-d .works-item-d{width: calc( (100% - 1.25rem) / 2 );}
    /*关于我们*/
    .about-desc>div{width: 88%;}
    .about-team-list{ gap: calc(6.6% / 1) 1.5rem;}
    .about-team-list .team-item{width: calc( (100% - 6.6%) / 2 );}
    /*联系我们*/
    .contact-left{width: 30%;}
    .contact-right{width: 70%}
    /*业务*/
    .service-item .service-item-left{width: 100%;margin-top: 0;}
    .service-item .service-item-right{width: 100%;}
    /*观点*/
    .idear-top .idear-top-title .idear-top-logo{margin-left: 3rem;margin-right: 2rem;}
    .idear-item-left,.idear-item-right{width: 100%;}
    .idear-item-left{margin-top: 15px;}
    .idear-item-left .item-info{width: 100%;margin-bottom: 3rem;}
    /*观点详情*/
    .idear-item-details{padding-top: 15px; padding-bottom: 60px;}
    .idear-item-details-left{width: 100%;margin-top: 40px;}
    .idear-item-details-right{width: 100%;}
    .idear-item-details-right{display: flex;flex-direction: row;justify-content: space-between;align-items: flex-start;}
    .item-date-details{margin-bottom: 0px;}
    .item-tag-list-details{display: flex;flex-direction: row;justify-content: flex-start;align-items: flex-start;}
    .item-tag-list-details span{margin-left: 20px;}
    .idear-page{justify-content: center;padding-top: 50px;padding-bottom: 60px;}
}
@media screen and (min-width: 1100px) {
    html{font-size: 12px!important;}
    /*一级导航*/
    .header-main{width: 1000px;}
    /*页脚*/
    .bottom-main{width: 1000px;padding-top: 6rem;padding-bottom: 4rem;}
    .bottom-main .bottom-item{width: 25%;}
    .bottom-link-main{width: 1000px;}
    /*内容块*/
    .cont .cont-main{width: 1000px;}
    /*案例页*/
    .banner1 .item-contet .content1{font-size:2.6rem;}
    .banner1 .item-contet .content2{font-size:4.5rem;}
    .banner1 .item-contet .content3{font-size:3rem;}
    .works-list .works-item{width: calc( (100% - 1.875rem) / 2 );}

    .cont-idear-list .cont-idear-item{width: calc( (100% - 1.875rem) / 2 );}

    .cps-item{width: calc( (100% - 3.75rem) / 3 );}
    /*案例详情页*/
    .works-list-d .works-item-d{width: calc( (100% - 1.875rem) / 2 );}
    /*关于我们*/
    .about-desc>div{width: 78%;}
    .about-team-list{ gap: calc(6.6% / 1) 1.5rem;}
    .about-team-list .team-item{width: calc( (100% - 6.6%) / 2 );}
    /*业务*/
    .service-item .service-item-left{width: 35%;}
    .service-item .service-item-right{width: 65%;}
    /*观点*/
    .idear-top .idear-top-title .idear-top-logo{margin-left: 5rem;margin-right: 3rem;}
    .idear-item-left,.idear-item-right{width: 50%;}
    .idear-item-left{margin-top: 0;}
    .idear-item-left .item-info{width: 90%;}
    /*观点详情*/
    .idear-item-details{padding-top: 28px; padding-bottom: 110px;}
    .idear-item-details-left{width: 80%;margin-top: 0;margin-right: 5%}
    .idear-item-details-right{width: 15%;}
    .idear-item-details-right{display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start;}
    .item-date-details{margin-bottom: 60px;}
    .item-tag-list-details{display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start;}
    .item-tag-list-details span{margin-left: 0px;}
    .idear-page{justify-content: flex-start;padding-top: 26px;padding-bottom: 160px;}
}
@media screen and (min-width: 1200px) {
    html{font-size: 13px!important;}
    /*一级导航*/
    .header-main{width: 1100px;}
    /*页脚*/
    .bottom-main{width: 1100px;}
    .bottom-link-main{width: 1100px;}
    /*内容块*/
    .cont .cont-main{width: 1100px;}
    /*案例页*/
    .works-list .works-item{width: calc( (100% - 3.75rem) / 3 );}
    .cont-idear-list .cont-idear-item{width: calc( (100% - 3.75rem) / 3 );}
    /*案例详情页*/
    .works-list-d .works-item-d{width: calc( (100% - 3.75rem) / 3 );}
    /*关于我们*/
    .about-desc>div{width: 68%;}
    .about-team-list{ gap: calc(6.6% / 3) 1.5rem;}
    .about-team-list .team-item{width: calc( (100% - 6.6%) / 4 );}
    /*业务*/
    .service-item .service-item-left{width: 30%;}
    .service-item .service-item-right{width: 70%;}
    /*观点*/
    .idear-top .idear-top-title .idear-top-logo{margin-left: 7.5rem;margin-right: 5rem;}
    .idear-item-left .item-info{width: 80%;}
    /*观点详情*/
    .idear-item-details-left{width: 75%;margin-top: 0;margin-right: 8%}
    .idear-item-details-right{width: 17%;}
}
@media screen and (min-width: 1300px) {
    html{font-size: 14px!important;}
    /*一级导航*/
    .header-main{width: 1200px;}
    /*页脚*/
    .bottom-main{width: 1200px;}
    .bottom-link-main{width: 1200px;}
    /*内容块*/
    .cont .cont-main{width: 1200px;}
    /*关于我们*/
    .about-desc>div{width: 60%;}
    /*观点*/
    .idear-item-left .item-info{width: 80%;}
    /*观点详情*/
    .idear-item-details-left{width: 70%;margin-right: 10%}
    .idear-item-details-right{width: 20%;}
}
@media screen and (min-width: 1400px) {
    html{font-size: 15px!important;}
    /*一级导航*/
    .header-main{width: 1300px;}
    /*页脚*/
    .bottom-main{width: 1300px;}
    .bottom-link-main{width: 1300px;}
    /*内容块*/
    .cont .cont-main{width: 1300px;}
    /*关于我们*/
    .about-desc>div{width: 56%;}
}
@media screen and (min-width: 1500px) {
    html{font-size: 16px!important;}
    /*一级导航*/
    .header-main{width: 1400px;}
    /*页脚*/
    .bottom-main{width: 1400px;}
    .bottom-link-main{width: 1400px;}
    /*内容块*/
    .cont .cont-main{width: 1400px;}
}