@media (min-width: 1025px) {
    #header .burger, #header .mobile-menu, #header .search-modal, #header .mobile-btns, #header .first-menu li .mobile-menu-arrow, #header .mobile-menu-li {
        display: none;
        font-size: 0
    }
}

@media (min-width: 1536px) {
    #header {
    }

    #header .second-third-menu {
        left: -94px;
        width: 1100px
    }

    #header .header-container {
        width: 1440px
    }

    #header .second-third-menu-container {
        width: 900px
    }

    #header .second-menu {
        width: 350px
    }

    #header .advertising {
        width: 280px
    }
}

@media (min-width: 1281px) and (max-width: 1536px) {
    #header {
    }

    #header .second-third-menu {
        left: -94px;
        width: 1100px
    }

    #header .header-container {
        width: 1200px
    }

    #header .second-third-menu-container {
        width: 900px
    }

    #header .second-menu {
        width: 350px
    }

    #header .advertising {
        width: 280px
    }
}

@media (min-width: 1025px) and (max-width: 1280px) {
    #header {
        font-size: 14px
    }

    #header .first-menu-li {
        padding-right: 26px
    }

    #header .first-menu-link {
        padding: 0 2px;
        font-size: 14px
    }

    #header .second-third-menu {
        left: -94px;
        width: 1020px
    }

    #header .header-container {
        width: 1110px
    }

    #header .second-third-menu-container {
        width: 820px
    }

    #header .second-menu {
        width: 240px
    }

    #header .advertising {
        width: 260px
    }
}

@media (min-width: 481px) and (max-width: 1024px) {
    #header .logo {
        margin-top: 0
    }

    #header .first-menu-li {
        padding-right: 0
    }

    #header .header-container {
        width: 90vw
    }

    #header .mobile-menu-li {
        display: block
    }

    #header .search-store {
        display: none !important
    }

    #header .advertising {
        display: none
    }

    #header .header-search section {
        width: 100%;
        padding: 0 20px
    }

    #header .web-shortcut, #header .shortcut {
        display: none
    }

    #header .first-menu .first-menu-link strong {
        font-size: 14px
    }

    #header .second-third-menu {
        display: flex;
        justify-content: flex-start;
        left: -200px;
        top: 0;
        width: 100%;
        height: 100%
    }

    #header .mobile-btns {
        display: flex;
        align-items: center
    }

    #header .mobile-btn {
        width: 50px;
        height: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        margin-right: 10px;
        cursor: pointer
    }

    #header .mobile-btn .iconfont {
        font-size: 30px !important
    }

    #header .search-modal {
        width: 100%;
        height: 140px;
        background: #fff;
        position: fixed;
        top: 0;
        left: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 99999
    }

    #header .search-modal .iconfont {
        font-size: 26px;
        border: none;
        background-color: transparent;
        outline: none
    }

    #header .search-modal-form {
        width: 70%;
        height: 40px;
        border-bottom: 1px solid #1d73dd;
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative
    }

    #header .search-modal-form button {
        width: 50px
    }

    #header .search-modal-form .input-medium {
        padding: 0 20px;
        background: 0 0;
        outline: none;
        border: none
    }

    #header .search-modal-close {
        position: absolute;
        width: 50px;
        height: 50px;
        right: 20px;
        top: 0;
        display: flex;
        align-items: center;
        justify-content: center
    }

    #header .second-menu-arrow {
        right: 10px;
        font-size: 26px !important;
        color: #333;
        opacity: 1
    }

    #header .burger {
        width: 30px;
        height: 20px;
        transform: rotate(0deg);
        cursor: pointer
    }

    #header .burger span {
        display: block;
        position: absolute;
        height: 3px;
        width: 100%;
        background-color: #000;
        opacity: 1;
        left: 0;
        transform: rotate(0deg);
        transition: background-color .3s linear, transform .1s linear
    }

    #header .burger-close span:nth-child(1) {
        top: 0
    }

    #header .burger-close span:nth-child(2) {
        top: 8px
    }

    #header .burger-close span:nth-child(3) {
        top: 16px
    }

    #header .burger-open span:nth-child(1) {
        top: 6px;
        transform: rotate(-45deg);
        height: 4px
    }

    #header .burger-open span:nth-child(2) {
        display: none
    }

    #header .burger-open span:nth-child(3) {
        transform: rotate(45deg);
        top: 6px;
        height: 4px
    }

    #header .header-menu {
        position: fixed;
        background: #fff;
        top: 0;
        left: 100%;
        width: 70%;
        height: 100vh;
        transition: all .2s ease 0s;
        z-index: 99999;
        justify-content: space-between;
        height: 100vh;
        display: flex;
        flex-direction: column
    }

    #header .header-menu-show {
        left: 30%
    }

    #header .dialog {
        width: 100vw;
        height: 100vh;
        background: rgba(0, 0, 0, .6);
        position: fixed;
        top: 0;
        left: 0;
        z-index: 99;
        display: none
    }

    #header .header-nav section, .nav-menu {
        justify-content: space-between;
        height: 100vh;
        width: 100%
    }

    #header .menu-nav {
        flex: 1;
        overflow-y: auto;
        display: flex;
        flex-direction: column
    }

    #header .mobile-menu-arrow {
        display: block
    }

    #header .first-menu-li .mobile-menu-arrow {
        font-size: 26px
    }

    #header .first-menu-link {
        font-weight: 700;
        height: 60px;
        display: flex;
        justify-content: space-between;
        padding: 0 10px 0 28px;
        width: 100%;
        align-items: center;
        border-bottom: 1px solid #f6f9ff;
        color: #313538
    }

    #header .second-menu {
        width: 100%;
        height: 100%;
        padding: 0
    }

    #header .second-menu-link {
        padding: 0 10px 0 28px;
        font-weight: 500;
        height: 60px;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #f6f9ff
    }

    #header .first-menu-link .mobile-menu-arrow {
        font-size: 26px
    }

    #header .third-menu {
        width: 100%;
        height: 100%;
        background: #fff;
        padding: 0;
        display: none
    }

    #header .third-menu-link {
        padding: 0 10px 0 28px;
        height: 60px;
        line-height: 26px;
        font-family: montserrat, poppins, sans-serif;
        color: #333;
        font-size: 16px;
        margin: 10px 0 0
    }
    #header .fourth-menu-link {
        padding: 0 10px 0 28px;
        height: 60px;
        line-height: 20px;
        font-family: montserrat, poppins, sans-serif;
        color: #333;
        font-size: 13px;
        margin: 10px 0 0
    }

    #header .fifth-menu-link {
        display: block;
        padding: 0 10px 0 46px;
        min-height: 44px;
        line-height: 20px;
        font-family: montserrat, poppins, sans-serif;
        color: #333;
        font-size: 12px;
        margin: 8px 0 0
    }

    #header .second-third-menu-container {
        display: flex;
        display: none;
        flex-direction: column;
        width: 100%;
        height: 100%;
        background: #fff
    }

    #header .mobile-menu {
        width: 100%;
        height: 100px;
        flex-shrink: 0;
        position: relative;
        font-family: din2014, helvetica neue, Helvetica, Arial, sans-serif;
        font-weight: 600 !important;
        line-height: 24px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-start
    }

    #header .mobile-menu-close, .mobile-menu-back {
        width: 50px;
        height: 50px;
        display: flex;
        justify-content: center;
        align-items: center
    }

    #header .mobile-menu-close {
        position: absolute;
        top: 0;
        right: 0
    }

    #header .mobile-menu-back {
        left: 0;
        display: none;
        width: 40px;
        height: 100px
    }

    #header .mobile-menu-back .iconfont {
        transform: rotate(180deg)
    }

    #header .mobile-menu .iconfont {
        font-size: 26px;
        width: 20px;
        height: 20px;
        color: #313538;
        display: inline-block
    }

    #header .mobile-menu-title {
        display: flex;
        align-items: center
    }

    #header .mobile-menu-title span {
        position: relative;
        color: #313538;
        font-size: 20px
    }

    #header .mobile-menu-title-home {
        text-indent: 24px
    }
}

@media (min-width: 480px) {
    #header .logo-mobile {
        display: none
    }
}

@media (max-width: 480px) {
    #header .header-search {
        height: 55px;
    }

    #header .first-menu-li {
        padding-right: 0
    }

    #header .logo-pc {
        display: none
    }
    #header .iso {
        display: none
    }
    #header .logo-mobile {
        /*width: 30px;*/
        height: 50px;
        margin: 0 30px 0 0
    }

    #header .header-container {
        width: 90vw
    }

    #header .mobile-menu-li {
        display: block
    }

    #header .search-store {
        display: none !important
    }

    #header .advertising {
        display: none
    }

    #header .header-search section {
        width: 100%;
        padding: 0 20px
    }

    #header .web-shortcut, .shortcut {
        display: none !important
    }

    #header .first-menu .first-menu-link strong {
        font-size: 14px
    }

    #header .second-third-menu {
        display: flex;
        justify-content: flex-start;
        left: -200px;
        top: 0;
        width: 100%;
        height: 100%
    }

    #header .mobile-btns {
        display: flex;
        align-items: center
    }

    #header .mobile-btn {
        width: 50px;
        height: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #000;
        margin-right: 10px;
        cursor: pointer
    }

    #header .mobile-btn .iconfont {
        font-size: 30px !important
    }

    #header .search-modal {
        width: 100%;
        height: 140px;
        background: #fff;
        position: fixed;
        top: 0;
        left: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 99999
    }

    #header .search-modal .iconfont {
        font-size: 26px;
        border: none;
        background-color: transparent;
        outline: none
    }

    #header .search-modal-form {
        width: 70%;
        height: 40px;
        border-bottom: 1px solid #1d73dd;
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative
    }

    #header .search-modal-form button {
        width: 50px
    }

    #header .search-modal-form .input-medium {
        padding: 0 20px;
        background: 0 0;
        outline: none;
        border: none
    }

    #header .search-modal-close {
        position: absolute;
        width: 50px;
        height: 50px;
        right: 20px;
        top: 0;
        display: flex;
        align-items: center;
        justify-content: center
    }

    #header .second-menu-arrow {
        right: 10px;
        font-size: 18px !important;
        color: #333;
        opacity: 1
    }

    #header .burger {
        width: 30px;
        height: 20px;
        transform: rotate(0deg);
        cursor: pointer
    }

    #header .burger span {
        display: block;
        position: absolute;
        height: 3px;
        width: 100%;
        background-color: #000;
        opacity: 1;
        left: 0;
        transform: rotate(0deg);
        transition: background-color .3s linear, transform .1s linear
    }

    #header .burger-close span:nth-child(1) {
        top: 0
    }

    #header .burger-close span:nth-child(2) {
        top: 8px
    }

    #header .burger-close span:nth-child(3) {
        top: 16px
    }

    #header .burger-open span:nth-child(1) {
        top: 6px;
        transform: rotate(-45deg);
        height: 4px
    }

    #header.burger-open span:nth-child(2) {
        display: none
    }

    #header .burger-open span:nth-child(3) {
        transform: rotate(45deg);
        top: 6px;
        height: 4px
    }

    #header .header-menu {
        position: fixed;
        background: #fff;
        top: 0;
        left: 100%;
        width: 70%;
        height: 100vh;
        transition: all .2s ease 0s;
        z-index: 99999;
        justify-content: space-between;
        height: 100vh;
        display: flex;
        flex-direction: column
    }

    #header .header-menu-show {
        left: 30%
    }

    #header .dialog {
        width: 100vw;
        height: 100vh;
        background: rgba(0, 0, 0, .6);
        position: fixed;
        top: 0;
        left: 0;
        z-index: 99;
        display: none
    }

    #header .header-nav section, .nav-menu {
        justify-content: space-between;
        height: 100vh;
        width: 100%
    }

    #header .menu-nav {
        flex: 1;
        overflow-y: auto;
        display: flex;
        flex-direction: column
    }

    #header .mobile-menu-arrow {
        display: block
    }

    #header .first-menu-li .mobile-menu-arrow {
        font-size: 26px
    }

    #header .first-menu-link {
        font-weight: 700;
        height: 40px;
        display: flex;
        justify-content: space-between;
        padding: 0 10px 0 18px;
        width: 100%;
        align-items: center;
        border-bottom: 1px solid #f6f9ff;
        color: #313538;
        text-align: left;
        font-size: 14px;
        font-family: din2014, helvetica neue, Helvetica, Arial, sans-serif
    }

    #header .second-menu {
        width: 100%;
        height: 100%;
        padding: 0
    }

    #header .second-menu-link {
        padding: 0 10px 0 18px;
        font-weight: 500;
        height: 40px;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #f6f9ff
    }

    #header .second-menu-link div {
        display: flex;
        align-items: center
    }

    #header .first-menu-link .mobile-menu-arrow {
        font-size: 18px
    }

    #header .h-60 {
        height: 40px
    }

    #header .third-menu {
        position: absolute;
        top: 0;
        width: 100%;
        /*height: 100%;*/
        background: #fff;
        padding: 0;
        display: none
    }

    #header .third-menu-link {
        padding: 0 18px 10px;
        line-height: 20px;
        font-family: montserrat, poppins, sans-serif;
        color: #333;
        font-size: 14px;
        display: block
    }
    #header .fourth-menu-link {
        padding: 0 18px 10px;
        line-height: 14px;
        font-family: montserrat, poppins, sans-serif;
        color: #333;
        font-size: 13px;
        display: block
    }

    #header .fifth-menu-link {
        padding: 0 18px 10px 42px;
        line-height: 16px;
        font-family: montserrat, poppins, sans-serif;
        color: #333;
        font-size: 12px;
        display: block
    }
    #header .second-third-menu-container {
        display: flex;
        display: none;
        flex-direction: column;
        width: 100%;
        height: 100%;
        background: #fff
    }

    #header .mobile-menu {
        width: 100%;
        height: 80px;
        flex-shrink: 0;
        position: relative;
        font-family: din2014, helvetica neue, Helvetica, Arial, sans-serif;
        font-weight: 600 !important;
        line-height: 24px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-start
    }

    #header .mobile-menu-close, #header .mobile-menu-back {
        width: 40px;
        height: 40px;
        display: flex;
        justify-content: center;
        align-items: center
    }

    #header .mobile-menu-close {
        position: absolute;
        top: 0;
        right: 0
    }

    #header .mobile-menu-back {
        left: 0;
        display: none;
        width: 40px;
        height: 100px
    }

    #header .mobile-menu-back .iconfont {
        transform: rotate(180deg)
    }

    #header .mobile-menu .iconfont {
        font-size: 18px;
        width: 16px;
        height: 24px;
        color: #313538;
        display: inline-block
    }

    #header .mobile-menu-title {
        display: flex;
        align-items: center
    }

    #header .mobile-menu-title span {
        position: relative;
        color: #313538;
        font-size: 14px
    }

    #header .mobile-menu-title-home {
        text-indent: 16px
    }
}
