.base-lang-wrap {
    display: inline-flex;
    align-items: center;
    padding: 0 10px 0 6px;
    font-size: 12px;
    height: 28px;
    cursor: pointer
}

#navBarItem30 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center
}

#navBarItem30.no-bg {
    background: transparent
}

#navBarItem30.no-bg .base-lang-wrap {
    background: rgba(0, 0, 0, .5)
}

#navBarItem30.no-bg .base-lang-wrap .c-\$btn-text,
#navBarItem30.no-bg .base-lang-wrap .text-\[var\(--btn-text\)\],
#navBarItem30.no-bg .base-lang-wrap .text-\$btn-text {
    color: #fff !important
}

#navBarItem30.no-bg .left {
    background: rgba(0, 0, 0, .5) !important;
    border-radius: 100px;
    color: #fff !important
}

#navBarItem30 .is-mine .left {
    color: #fff !important
}

#navBarItem30 .no-login-part .base-help-btn {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-card);
    border-radius: 50%;
    box-shadow: var(--box-shadow)
}

#navBarItem30 .base-lang-wrap {
    border-radius: 15px;
    margin-right: 0;
    box-shadow: var(--box-shadow)
}

#navBarItem30 .left {
    position: relative;
    z-index: 1
}

#navBarItem30 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem30 .name {
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem30 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem30 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem30 .base-lang-wrap span {
    display: block;
    max-width: 68px;
    line-height: 12px
}

#navBarItem29 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem29 .no-login-part .base-help-btn {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-card);
    border-radius: 50%;
    box-shadow: var(--box-shadow)
}

#navBarItem29 .base-lang-wrap {
    border-radius: 15px;
    margin-right: 0;
    box-shadow: var(--box-shadow)
}

#navBarItem29 .left {
    position: relative;
    z-index: 1
}

#navBarItem29 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem29 .name {
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem29 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem29 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem29 .base-lang-wrap span {
    display: block;
    max-width: 68px;
    line-height: 12px
}

#navBarItem28 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem28 .site-name {
    font-size: 20px;
    font-weight: 700
}

#navBarItem28 .no-login-part .base-help-btn {
    margin-left: 10px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f4ad61;
    border-radius: 50%;
    box-shadow: var(--box-shadow);
    color: var(--text-black)
}

#navBarItem28 .base-lang-wrap {
    border-radius: var(--btn-radius);
    margin-right: 0;
    box-shadow: var(--box-shadow);
    background: var(--primary);
    border: none
}

#navBarItem28 .left {
    position: relative;
    z-index: 1
}

#navBarItem28 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem28 .name {
    color: var(--btn-text);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem28 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem28 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem28 .base-lang-wrap span {
    display: block;
    max-width: 68px;
    line-height: 12px
}

#navBarItem27 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem27 .site-name {
    font-size: 20px;
    font-weight: 700
}

#navBarItem27 .no-login-part .base-help-btn {
    margin-left: 10px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f4ad61;
    border-radius: 50%;
    box-shadow: var(--box-shadow)
}

#navBarItem27 .base-lang-wrap {
    border-radius: var(--btn-radius);
    margin-right: 0;
    box-shadow: var(--box-shadow);
    border: 1px solid var(--text-gray)
}

#navBarItem27 .left {
    position: relative;
    z-index: 1
}

#navBarItem27 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem27 .name {
    color: var(--btn-text);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem27 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem27 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem27 .base-lang-wrap span {
    display: block;
    max-width: 68px;
    line-height: 12px
}

#navBarItem26 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem26 .no-login-part .base-help-btn {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-card);
    border-radius: 50%;
    box-shadow: var(--box-shadow)
}

#navBarItem26 .base-lang-wrap {
    border-radius: var(--btn-radius);
    margin-right: 0;
    box-shadow: var(--box-shadow)
}

#navBarItem26 .left {
    position: relative;
    z-index: 1
}

#navBarItem26 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem26 .name {
    color: var(--btn-text);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem26 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem26 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem26 .base-lang-wrap span {
    display: block;
    max-width: 68px;
    line-height: 12px
}

#navBarItem25 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem25 .no-login-part .base-help-btn {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary);
    border-radius: 50%;
    box-shadow: var(--box-shadow)
}

#navBarItem25 .base-lang-wrap {
    background: var(--primary);
    border-radius: var(--btn-radius);
    margin-right: 0;
    padding: 4px 8px 4px 6px;
    box-shadow: var(--box-shadow)
}

#navBarItem25 .left {
    position: relative;
    z-index: 1
}

#navBarItem25 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem25 .name {
    color: var(--btn-text);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem25 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem25 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem24 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem24 .no-login-part .base-help-btn {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-card)
}

#navBarItem24 .base-lang-wrap {
    background: var(--bg-card);
    margin-right: 0;
    padding: 4px 8px 4px 6px
}

#navBarItem24 .left {
    position: relative;
    z-index: 1
}

#navBarItem24 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem24 .name {
    color: var(--btn-text);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem24 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem24 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem23 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem23 .no-login-part .base-help-btn {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-card);
    border-radius: 50%
}

#navBarItem23 .base-lang-wrap {
    background: var(--primary);
    box-shadow: var(--box-shadow);
    border-radius: 24px;
    margin-right: 0;
    padding: 4px 8px 4px 6px
}

#navBarItem23 .left {
    position: relative;
    z-index: 1
}

#navBarItem23 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem23 .name {
    color: var(--primary);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem23 .name.change-color {
    color: var(--btn-text)
}

#navBarItem23 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem23 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem22 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem22 .no-login-part .base-help-btn {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary);
    border-radius: 50%
}

#navBarItem22 .base-lang-wrap {
    background: var(--primary);
    box-shadow: var(--box-shadow);
    border-radius: 24px;
    margin-right: 0;
    padding: 4px 8px 4px 6px
}

#navBarItem22 .left {
    position: relative;
    z-index: 1
}

#navBarItem22 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem22 .name {
    color: var(--btn-text);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem22 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem22 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem21 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end
}

#navBarItem21 .no-login-part .base-help-btn {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-card);
    border-radius: 5px
}

#navBarItem21 .base-lang-wrap {
    background: var(--bg-card);
    border-radius: 5px;
    margin-right: 0;
    padding: 4px 8px 4px 6px
}

#navBarItem21 .left {
    position: relative;
    z-index: 1
}

#navBarItem21 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem21 .name {
    color: var(--btn-text);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem21 .name .small-logo {
    margin-right: 5px;
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem21 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem4 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0
}

#navBarItem4:before {
    content: "";
    position: absolute;
    left: 0;
    top: -44px;
    background: url(data:image/png;base64,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) left top no-repeat;
    background-size: 100% 100%;
    width: 220px;
    height: 181px;
    pointer-events: none
}

#navBarItem4:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -90px;
    background: url(data:image/png;base64,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) left top no-repeat;
    background-size: 100% 100%;
    width: 100px;
    height: 122px;
    pointer-events: none
}

#navBarItem4 .left {
    position: relative;
    z-index: 1;
    padding-left: 10px;
    transition: padding .2s;
    display: flex;
    align-items: flex-end
}

#navBarItem4 .left .base-logo {
    width: 77px !important;
    height: 77px !important;
    margin-right: 0
}

#navBarItem4 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem4 .name {
    position: absolute;
    left: 109px;
    margin-bottom: 5px;
    color: var(--btn-text2);
    font-size: 22px;
    line-height: 38px;
    font-weight: 700;
    letter-spacing: 1px
}

#navBarItem4 .base-help-btn,
#navBarItem4 .base-alarm-logo-btn {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-weight)
}

#navBarItem4 .base-help-btn svg,
#navBarItem4 .base-alarm-logo-btn svg {
    font-size: 18px
}

#navBarItem4 .base-alarm-logo-btn svg {
    font-size: 14px
}

.is-scroll-state {
    z-index: 10 !important
}

.is-scroll-state #navBarItem4 {
    align-items: center
}

.is-scroll-state #navBarItem4 .left {
    padding-left: 12px;
    transition: padding .2s
}

.is-scroll-state #navBarItem4 .left .base-logo {
    width: 35px !important;
    height: 35px !important
}

#navBarItem3 {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0 10px
}

#navBarItem3 .left {
    position: relative;
    z-index: 1
}

#navBarItem3 .right {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center
}

#navBarItem3 .name {
    color: var(--btn-text2);
    font-size: 38px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 1
}

#navBarItem3 .name .small-logo {
    margin-right: 5px;
    width: calc(var(--402f4b2c) + 10px);
    height: calc(var(--402f4b2c) + 10px);
    max-width: 40px;
    max-height: 40px;
    flex-shrink: 0
}

#navBarItem3 .name .small-logo .site-img {
    width: 100%;
    height: 100%
}

#navBarItem3 .base-help-btn,
#navBarItem3 .base-alarm-logo-btn {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-weight)
}

#navBarItem3 .base-help-btn svg,
#navBarItem3 .base-alarm-logo-btn svg {
    font-size: 18px
}

#navBarItem3 .base-alarm-logo-btn svg {
    font-size: 14px
}