@font-face {
    font-family: 'iconfont';
    src: url('../css/iconfont/iconfont.eot');
    src: url('../css/iconfont/iconfont.eot?#iefix') format('embedded-opentype'),
    url('../css/iconfont/iconfont.woff2') format('woff2'),
    url('../css/iconfont/iconfont.woff') format('woff'),
    url('../css/iconfont/iconfont.ttf') format('truetype'),
    url('../css/iconfont/iconfont.svg#iconfont') format('svg');
}

@font-face {
  font-family: "iconfontx";
  src: url('/pages/zacros/cssv2/font_4683828/iconfont.woff2?t=1637769520395') format('woff2'),
       url('/pages/zacros/cssv2/font_4683828/iconfont.woff?t=1637769520395') format('woff'),
       url('/pages/zacros/cssv2/font_4683828/iconfont.ttf?t=1637769520395') format('truetype');
}

.iconfontx {
  font-family: "iconfontx" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-diqiu:before {
  content: "\e734";
}

.icon-liebiao:before {
  content: "\e600";
}

.icon-yuanqujieshao:before {
  content: "\e873";
}
.ii-1{
    font-size:24px;
    color:var(--zacros-main);
}

em {
    font-size: 16px;
    line-height: 16px;
    font-family: iconfont;
}

body {
    -webkit-font-smoothing: antialiased;
}

img {
    max-width: 100%;
}

#big-view {
    /*margin: 0 5%;*/
}
.layout-inner {
    width: 100%;
    max-width: 1285px;
    margin: 0 auto;
}


body {
    height: 100%;
}

:root {
    --zacros-text: #000;
    --zacros-main: #05b9e1;
    --zacros-main-half: #81cde450;

    --zacros-main-hover: #04a4c8;
    --zacros-main-light: #cdf1f9;
    --zacros-main-hover2: #09badf;

    --zacros-active: #e60012;
    --zacros-text-link: #03809c;
    --zacros-gray-hard: #727676;
    --zacros-gray-dark: #aaabab;
    --zacros-gray: #dfdfdf;
    --zacros-gray-light: #f7f8f8;
    --zacros-white: #fff;
    --zacros-white-90: #ffffff90;
    --zacros-white-half: #ffffff50;
    --zacros-sub: #91c323;
    --zacros-wellness: #f09196;
    --zacros-env: #2db4aa;
    --zacros-elec: #6e9bd2;
    --zacros-matl: #f5aa19;

    --font-serif: "Zen Old Mincho", serif;
    --font-english: "Lexend", sans-serif;
    --font-english-serif: "Cormorant Garamond", serif;
    --font-mixed: "Lexend", "Noto Sans JP", sans-serif;
}
/* nav-view satrt */
#nav-view {
    position: absolute;
    top: 0;
    z-index: 10000;
    justify-content: space-between;
    width: 100%;
    height: 100px;
    /*padding: 0 20px;*/
    background-color: #fff;
    box-shadow: 0 0 10px #ddd;
    transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1), transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}
#nav-view .top-view {
    height: 50px;
    padding-right: 30px;
    text-align: right;
    line-height: 50px;

    margin-left: 270px;
    /*background-color: rgba(0,0,0,.1);#f7f8f8*/
    background-color: var(--zacros-gray-light) ;
    background-color:#fff;
}

#nav-view .bootom-view {
    display: flex;
    justify-content: center;
}
#nav-view .left-logo {
    position: absolute;
    left: 20px;
    width: 250px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
#nav-view .left-logo .logo-02 {
    display: none;
}
.se-topmenu{
    color:var(--zacros-text-link);
}
#select-container {
    position: relative;
    display: inline-block;
    width: 100px;
    margin-right: 40px;

    font-size: 12px;
}
#select-container:after {
    position: absolute;
    left: 5px;
    bottom: 10px;
    content: '';
    width: 100%;
    height: 1px;
    background-color: rgba(0,0,0,.5);
}
#select-container input {
    width: 85px;
    height: 50px;
    margin-right: 15px;
    line-height: 24px;
    text-indent: 5px;
    /*border-bottom: 1px solid rgba(0,0,0,.5);*/
    background-color: transparent;
    font-size: 15px;
    text-align: center;
    box-sizing: border-box;
}
#select-container input:hover {
    color: #2A71BB;
    color:var(--zacros-main);
    cursor: pointer;
}
#select-container .span {
    position: absolute;
    top: 0px;
    left: 80px;
    width: 20px;
    opacity: 0.7;
    margin-right: 0;
}
#select-container .span:hover {
    opacity: 1;
    color: #2A71BB;
    color:var(--zacros-main);
    cursor: pointer;
}
#select-container:hover .span,
#select-container:hover .input {
    color: #2A71BB;
    color:var(--zacros-main);
}

#select-container ul {
    position: absolute;
    top: 38px;
    left: 5px;
    padding: 0;
    z-index: 1;
    width: 100px;
    display: none;
    list-style: none;
    /*border: 1px solid #007ACC;*/
    background-color: rgba(0,0,0,.3);
    background-color: var(--zacros-gray);
}
#select-container li {
    line-height: 30px;
    text-align: center;
}
#select-container li a {
    display: inline-block;
    width: 100%;
    color: #fff;
    text-indent: 5px;
    text-decoration: none;
}
#select-container li a:hover {
    color: #fff !important;
    /*background: #1F92E4;*/
}





#nav-view .nav-bar {
    width: 100%;
    max-width: 1285px;
    margin: 0 auto;
}

#nav-view.scroll {
    height: 80px;
    opacity: 0;
    transform: translateY(-100px);
}
#nav-view.show {
    position: fixed;
    opacity: 1;
    transform: translateY(0);
    background-color: rgba(255,255,255,.9);
}
#nav-view.show .left-logo {
    width: 150px;
}
#nav-view.show .left-logo img {
    width: 100%;
}
#nav-view.china .left-logo .china {
    display: block;
}
#nav-view.china .left-logo .english {
    display: none;
}
#nav-view.english .left-logo .english {
    display: block;
}
#nav-view.english .left-logo .china {
    display: none;
}


#nav-view.show .left-logo .logo-01 {
    display: none;
}
#nav-view.show .left-logo .logo-02 {
    display: block;
}

#nav-view.show .nav-bar {
    /*width: calc(100% - 250px);*/
    /*margin-left: 250px;*/
}
#nav-view.show .top-view {
    display: none;
}
#nav-view.show .bootom-view {
    /*margin-top: 20px;*/
}

#nav-view .company-name {
    position: absolute;
    top: 10px;
    right: 0;
    line-height: 25px;
    font-weight: 600;
    font-size: 17px;
    text-align: right;
}


#nav-view .nav-div {
    /*width: calc(100% - 500px);*/
    margin-left: 50px;
    line-height: 40px;
}
#nav-view .nav-div > ul {
    display: flex;
    height: 40px;
}
#nav-view .nav-div > ul > li {
    min-width: 135px;
    text-align: center;
    margin-left: 15px;
}
#nav-view .nav-div > ul > li:last-child {
    /*min-width: auto;*/
}
#nav-view .nav-div > ul > li > a {
    max-width: 150px;
    font-size: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#nav-view li {
    font-weight: normal;
    transition: all 0.2s;
    /*position: relative;*/
}
#nav-view li:hover {
    /*font-weight: 600;*/
}
#nav-view li > a {
    display: block;
}
#nav-view li > a .arrow {
    display: none;
    float: right;
}


#nav-view .nav-div > ul > li .dropdown-menu {
    display: none;
    /*background-color: rgba(255,255,255,.9);*/
    background-color: var(--zacros-main-light);
    /*text-align: center;*/
    font-weight: normal;
    box-shadow: 0 5px 10px #ddd;
    /*overflow: inherit !important;*/
}
#nav-view .nav-div ul > li:hover .dropdown-menu {
    /*display: block;*/

}
#nav-view .nav-div > ul > li .dropdown-menu li.active,
#nav-view .nav-div > ul > li .dropdown-menu > ul > li:hover {
    /*background-color: #2A71BB;*/
    background-color: var(--zacros-main-hover2);
    color: #fff;
    /*font-weight: 600;*/
}
#region-btn {
    animation: all 0.2s;
    font-size: 12px;
}
#region-btn:hover {
    color: #2A71BB !important;
}
#region-btn > img {
    margin-right: 5px;
}

#nav-view .dropdown-menu {
    font-size: 13px;
}
#nav-view .product-msg-menu {
    position: absolute;
}
#nav-view .product-msg-menu ul {
    width: 150px;
    /*background-color: rgba(255,255,255,.9);*/
    background-color: var(--zacros-main-light);
}
#nav-view .product-msg-menu .pro-menu {
    width: 310px !important;
    /*background-color: rgba(255,255,255,.9);*/
    background-color: var(--zacros-main-light);
}
#nav-view .child-menu li {
    text-align: left;
    transition: all 0.2s;
}
#nav-view .child-menu li.msg-li > a {
    display: flex !important;
    justify-content: space-between;
}
#nav-view .child-menu li > a {
    padding: 0 20px 0 10px;
    line-height: 40px;
}
#nav-view .child-menu li.default,
#nav-view .child-menu li:hover {
    /*background-color: #2A71BB;*/
    background-color: var(--zacros-main-hover2);
    color: #fff;
    font-weight: 600;
}
#nav-view .child-menu a > em {
    font-size: 14px;
    line-height: 40px;
}
#nav-view .menu li > a {
    display: block;
    animation: all 0.3s;
}
#nav-view .menu li:hover > a {
    /*transform: translateX(10px);*/
}


#nav-view .right-menu {
    position: absolute;
    top: 0;
    left: 150px;
    /*height: 470px;*/
    display: none;
    justify-content: space-between;
    /*background-color: rgba(255,255,255,.9);*/
}
#nav-view .right-menu ul {
    color: rgba(0,0,0,.8);
    /*text-align: center;*/
}
#nav-view .right-menu .section-title {
    padding-left: 15px;
    font-weight: 600;
    line-height: 30px;
}
#nav-view .right-menu ul > li {
    font-size: 13px;
    line-height: 30px;
    /*text-align: center;*/
}
#nav-view li:hover > .right-menu {
    display: flex;
}
#nav-view .right-menu .menu li > a {
    padding-left: 20px;
    line-height: 30px;
    /*height: 30px;*/
    /*justify-content: center;*/
}
#nav-view .right-menu .menu li:hover {
    /*background-color: transparent;*/
    /*color: rgba(0,0,0,.8);*/
    /*font-weight: 600;*/
}
#nav-view .default > .right-menu {
    display: flex;
    color: #fff;
}

/* nav-view end */



.main-view {
    margin-top: 120px;
}


#foot-view {
    /*padding: 10px;*/
    margin-top: 40px;
    line-height: 25px;
    text-align: center;
    font-size: 12px;
    color: #fff;
    color: var(--zacros-text);
    background-color: var(--zacros-gray-light);
}
#foot-view .division-line {
    margin: 0 5px;
}
#foot-view .site.info {
    font-size: 100%;
    background: #f2f2f2;
    color: #565656;
    color: var(--zacros-text);
}
#foot-view .site.info p {
    padding: 0 0 0 20px;
}
#foot-view .site .inner {
    width: 100%;
    margin: 0 auto;

    box-sizing: border-box;
    background-color: rgba(0,0,0,0.5);
    background-color: var(--zacros-gray-light);

}
#foot-view .site.info .inner {
    /*background-color: transparent;*/
}

.branch {
    text-align: center;
}
.branch > a {
    display: inline-block;
    margin: 0 10px;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0,0,0,.2);
    transition: all 0.2s;
}
.branch > a:hover {
    box-shadow: 0 0 10px #2A71BB;
}


/*.backtop {*/
    /*display: none;*/
/*}*/
/*.backtop.show {*/
    /*display: block;*/
/*}*/
#back-top {
    position: fixed;
    bottom: 0;
    right: 0;
    opacity: 0;
    z-index: 100;
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
    transform: translateY(90px);
}
#back-top.show {
    opacity: 1;
    transform: translateY(0px);
}
#back-top > a {
    text-indent: -20000px;
    overflow: hidden;
    display: block;
    width: 60px;
    height: 60px;
    /*height: 80px;*/
    /*background-size: 40px 100px;*/
    background-repeat: no-repeat;
    position: relative;
    background-color: rgba(0,0,0,.4);
    background-color: var(--zacros-gray);
    text-align: center;
    color: #fff !important;
    line-height: 17px;
    transition: all 0.3s;
}
#back-top > a:hover {
    background-color: var(--zacros-main);
}
#back-top img {
    position: absolute;
    top: 15px;
    left: 15px;
}


/* 閫夋嫨鍖哄煙 start */
#region-view {
    display: none;
    position: fixed;
    left: 0;
    top: 50px;
    z-index: 10001;
    width: 100%;
    height: 500px;
    background-color: #f5f5f5;
    text-align: left;
}

#region-view .region-div {
    width: 900px;
    margin: 0 auto;
}
#region-view .region-div > p {
    margin-left: 110px;
    line-height: 75px;
    font-weight: 500;
}
#region-view .inner {
    display: flex;
    justify-content: center;
    padding: 0px 0 15px 0;
}
#region-view .inner > dl {
    float: left;
    margin-left: 50px;
}
#region-view .inner > dl.item-1 {
    width: 271px;
    margin-left: 0;
    margin-right: 50px;
}
#region-view .inner > dl.item-2 {
    width: 301px;
}
#region-view .inner > dl.item-3 {
    width: 271px;
}
#region-view .inner > dl > dt {
    position: relative;
    margin-bottom: -2px;
    border-bottom: 2px solid #cecece;
    color: #000;
    font-size: 24px;
    font-weight: bold;
    padding-bottom: 10px;
}
#region-view .inner > dl dl {
    color: #9598aa;
    *zoom: 1;
}
#region-view .inner > dl dl:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
}
#region-view .inner > dl dl > * {
    float: left;
    padding: 10px 0;
}
#region-view .inner > dl dl dt {
    color: #888;
    font-size: 14px;
    width: 120px;
    line-height: 1.64;
    padding-right: 5px;
}
#region-view .inner > dl dl ul {
    margin-bottom: -13px;
}
#region-view .inner > dl dl ul:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
}
#region-view .inner > dl dl li {
    *zoom: 1;
    float: left;
    border-left: 1px solid #c1c3d1;
    margin: 0 0 13px 8px;
    padding-left: 9px;
}
#region-view .inner > dl dl li:nth-child(odd) {
    border-left: none;
    margin-left: 0;
    padding-left: 0;
}
#region-view .inner > dl dl li a {
    color: #2A71BB;
    color:var(--zacros-main);
    font-size: 14px;
    line-height: 1.64;
}
#region-view .inner > dl dl li a:hover {
    color: #2A71BB !important;
    color:var(--zacros-main) !important;
    text-decoration: underline !important;
}
#region-view .inner > dl dl dd {
    width: 146px;
}
#region-view .inner > dl.item-2 dl dd {
    width: 176px;
}


#region-view .close {
    position: absolute;
    top: 20px;
    right: 20px;
}

/* 閫夋嫨鍖哄煙 end */


/* 渚ц竟鏍� */
#right-view {
    display: none;
    position: fixed;
    top: 100px;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.3);
    transition: all 0.3s;
}
#right-view.show {
    /*display: block;*/
}
#right-view .r-v-content {
    height: 100%;
    overflow: scroll;
    background-color: #fff;
}




#down-view {
    display: none;
    position: fixed;
    top: 100px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100000;
    height: calc(100vh - 100px);
    background-color: rgba(0,0,0,.3);
}
#down-view .d-v-menu {
    height: 100%;
    font-size: 34px;
    line-height: 80px;
    overflow: scroll;
}
#down-view .d-v-menu > ul {
    background-color: #fff;
}
#down-view .d-v-menu ul {
    padding: 0 30px;
}
#down-view .d-v-menu > ul > li {
    border-top: 1px solid #ddd;
}
#down-view .d-v-menu a {
    display: block;
}
#down-view .d-v-menu a > em {
    font-size: 34px;
    line-height: 80px;
}
#down-view .d-v-menu a > em.arrow {
    float: right;
}
#down-view .dropdown-menu {
    display: none;
}
#down-view .d-v-menu li.selected > a > .arrow {
    transform: rotate(90deg);
}
#down-view .section-title {
    font-weight: 500;
}

.site{
    margin: 0 auto;padding:35px;
}

@media screen and (max-width: 980px) {

    .ii-1{
        font-size: 30px;
    }
    #nav-view {
        display: flex;
    }
    #nav-view .nav-bar {
        display: none;
    }
    #nav-view .left-logo {
        height: 100px !important;
    }
    #nav-view .top-view {
        display: block !important;
        height: 100px !important;
        background-color: transparent !important;
    }
    #nav-view.scroll {
        height: 100px !important;
    }
    #select-container {
        display: none;
    }
    #nav-view .menu-btn {
        display: inline-block !important;
        line-height: 100px;
        margin-left: 30px;
        transition: all 0.3s;
    }
    #nav-view .menu-btn.selected {
        transform: rotate(90deg);
    }
    #nav-view .menu-btn > img {
        width: 70px;
    }
    #nav-view .nav-bar {
        background-color: #fff;
        border-top: 1px solid #ddd;
    }



    #region-btn {
        line-height: 100px;
        font-size: 30px;
    }
    #region-btn > img {
        width: 50px;
    }

    #region-view {
        top: 100px;
        height: 800px;
    }
    #region-view .region-div > p {
        font-size: 32px;
    }
    #region-view .inner {
        display: block !important;
    }
    #region-view .inner > dl {
        width: 70% !important;
        margin: 0 auto !important;
        float: none !important;
    }

    #region-view .inner > dl > dt {
        font-size: 3rem !important;
    }
    #region-view .inner > dl dl dt {
        font-size: 2rem !important;
        padding-right: 30px !important;
        width:40% !important;
    }
    #region-view .inner > dl dl dd {
        width: 50% !important;
    }
    #region-view .inner > dl dl li a {
        font-size: 2rem !important;
    }


    /* foot-view */
    #foot-view {
        font-size: 2rem;
        line-height: 3rem;
    }
    #foot-view .site .inner {
        text-align: center;
    }
    .site{
        max-width: 980px;
    }


    /* back-top */
    #back-top > a {
        width: 100px !important;
        height: 100px !important;
    }
    #back-top img {
        width: 70px;
        height: 70px;
    }



}



@media screen and (max-width: 1200px) {
    #nav-view .left-logo {
        /*width: 150px;
        height: 50px;*/
    }
    #nav-view .left-logo .logo-01 {
        display: none;
    }
    #nav-view.china .left-logo .china {
        display: none;
    }
    #nav-view .left-logo .logo-02 {
        display: block;
    }
    #nav-view .top-view {
        margin-left: auto;
    }
    .ii-1{
        font-size: 30px;
    }

}