/* theme style */

:root {
    --black: #000;
    --white: #fff;
    --text-color: #333333;
    --border-color: #ebeef5;
    --active-color: #3095fb;
    --background-color: #f8f8f8;
    --background-color-light: #f90df7;
    --theme-color: #008272;
    --theme-color-dark: #007163;
    --theme-color-light: #01AA95;
    --warning-color: #ffa179;
    --warning-color-dark: #ff976a;
    --warning-color-light: #fffbe8;
    --success-color: #20c770;
    --success-color-dark: #07c160;
    --success-color-light: #b5eccf;
    --error-color: #ff5757;
    --error-color-dark: #f44;
    --error-color-light: #ffc7c7;
    --font-size: 14px;
    --line-height: 1.4;
    --center-width: 1600px;
}

::placeholder {
    color: #bfbfbf;
}

a {
    color: #333333;
}

a:hover {
    color: #008272;
}

body {
    color: #333333;
    font-size: 14px;
    line-height: 1.4;
}

.Page-header--subheader {
    height: 250px;
}

.both-sidebar .Page-body,
.left-sidebar .Page-body,
.right-sidebar .Page-body {
    width: 1600px;
}

.Page-header .Page-header--topbar .top-bar__in .top-bar__body .account a {
    color: #333333;
}

.Page-header .Page-header--topbar .top-bar__in .top-bar__body .account a:hover {
    color: #008272;
}

.Page-slot--template-header_in {
    width: auto;
}

h1 {
    font-size: 32px;
    line-height: 1.4;
    font-weight: bold;
    color: #3c3c3c;
}

h2 {
    font-size: 32px;
    line-height: 1.4;
    font-weight: bold;
    color: #3c3c3c;
}

h3 {
    font-size: 32px;
    line-height: 1.4;
    font-weight: bold;
    color: #3c3c3c;
}

h4 {
    font-size: 32px;
    line-height: 1.4;
    font-weight: bold;
    color: #3c3c3c;
}

h5 {
    font-size: 32px;
    line-height: 1.4;
    font-weight: bold;
    color: #3c3c3c;
}

h6 {
    font-size: 32px;
    line-height: 1.4;
    font-weight: bold;
    color: #3c3c3c;
}

.theme-color-text {
    color: #008272;
}

.theme-color-bg {
    background-color: #008272;
}

.layout-boxed .Page {
    max-width: 1600px;
}

body.both-sidebar .Page-sidebar.sidebar-left,
body.left-sidebar .Page-sidebar.sidebar-left {
    width: 23%;
}

body.both-sidebar .Page-sidebar.sidebar-right,
body.right-sidebar .Page-sidebar.sidebar-right {
    width: 23%;
}

body.both-sidebar .Page-content {
    width: 54%;
}

body.left-sidebar .Page-content {
    width: 77%;
}

body.right-sidebar .Page-content {
    width: 77%;
}

.Page-footer>.footer {
    padding: 30px 0;
}

.Page-footer>.fixed-toolbar {
    padding: 0px 0;
}

.Page-widgets>.fixed-toolbar.page-move-fixed {
    width: 200px;
}

.side-toolbar .toolbar-icon {
    background-color: rgba(0, 130, 114, 1);
    width: 50px;
    height: 50px;
}

.side-toolbar>ul>li:hover .toolbar-icon,
.side-toolbar .toolbar-text {
    background-color: rgba(0, 130, 114, 1);
}

.side-toolbar>ul>li,
.side-toolbar .toolbar-text {
    margin-bottom: 5px;
}

.Page-header--main .Page-header--logo {
    order: 0;
}

.Page-header--main .Page-header--menu {
    order: 1;
}

.Page-header--main .Page-header--widgets {
    order: 2;
}

.Page-header--main .Page-slot--template-header_in {
    order: 3;
    min-width: auto;
}

.Page-header--logo img {
    max-height: 68px;
    width: auto;
}

.Page .Page-body .Page-content .join {
    background-color: #fff;
}

.header-type-fixed .Page-header .Page-header--main.fixed .Page-header--logo img.all-logo,
.header-type-immersion .Page-header .Page-header--main .Page-header--logo img.all-logo,
.header-type-immersion2 .Page-header .Page-header--main .Page-header--logo img.all-logo {
    max-height: 68px;
    width: auto;
}

.Page-header .Page-header--main,
.Page-header .Page-header--mobile {
    background-color: rgba(30, 30, 30, 0);
}

.Page-header .Page-header--main.fixed,
.Page-header .Page-header--mobile.fixed {
    background-color: rgba(0, 130, 114, 1);
}

.Page .Page-header .Page-header--main .Page-header--icons li.menu {
    color: #3c3c3c;
}

.Page-header--mobile .Page-header--icons li.menu {
    color: #3c3c3c;
}

.Page .Page-header .Page-header--main .Page-header--icons li.menu.icon-active,
.Page-header--mobile .Page-header--icons li.menu.icon-active {
    color: #008272;
}

.Page .Page-header .Page-header--main .Page-header--icons li.menu-colse {
    color: #000;
}

.Page .Page-header .Page-header--icons .menu i {
    font-size: 30px;
}

.Page-header--main .cc-menu--nav .cc-menu--item .cc-menu--item__link {
    justify-content: flex-start;
    text-align: left;
}

.Page-header--mobile .cc-menu--nav .cc-menu--item .cc-menu--item__link {
    justify-content: flex-start;
    text-align: left;
}

.Page-header--shade .cc-menu--nav .cc-menu--item .cc-menu--item__link {
    justify-content: flex-start;
    text-align: left;
}

.Page-header--user>a {
    color: #333333;
}

.Page-header--mobile .Page-header--icons .user>a {
    color: #333333;
}

.container,
.cc-row--width__default {
    max-width: 1600px;
}

.cc-row--width__row {
    padding-left: calc((100% - 1600px) / 2) !important;
    padding-right: calc((100% - 1600px) / 2) !important;
}

.Page-header .container,
.Page-header .cc-row--width__default {
    max-width: 1600px;
}

.Page-header .cc-row--width__row {
    padding-left: calc((100% - 1600px) / 2) !important;
    padding-right: calc((100% - 1600px) / 2) !important;
}

.Page-header--main__in {
    padding: 10px 0;
}

.side-toolbar.position-right-bottom {
    bottom: 10%;
    right: 0;
    height: max-content;
}

.Page .Page-widgets .side-toolbar .toolbar-text.show {
    transform: translateX(calc(-100% + 3px));
    -webkit-transform: translateX(calc(-100% + 3px));
    -ms-transform: translateX(calc(-100% + 3px));
}

.Page .Page-widgets .side-toolbar .toolbar-img.show {
    right: calc(100% + 3px);
    display: block;
}

.Page-header .Page-header--left__fixed .cc-menu .cc-menu--nav .cc-menu--item .cc-menu--item__link,
.Page-header .Page-header--right__fixed .cc-menu .cc-menu--nav .cc-menu--item .cc-menu--item__link,
.Page-header .Page-header--shade .cc-menu .cc-menu--nav .cc-menu--item .cc-menu--item__link,
.Page-header .Page-header--shade .cc-menu .cc-menu--nav .cc-menu--item .cc-menu--item__link {
    height: 50px;
    line-height: 50px;
    padding: 0px 0;
}

.Page-header .Page-header--left__fixed .cc-menu>.cc-menu--nav>.cc-menu--item>.cc-menu--item__link,
.Page-header .Page-header--right__fixed .cc-menu>.cc-menu--nav>.cc-menu--item>.cc-menu--item__link,
.Page-header .Page-header--shade .cc-menu>.cc-menu--nav>.cc-menu--item>.cc-menu--item__link,
.Page-header .Page-header--shade .cc-menu>.cc-menu--nav>.cc-menu--item>.cc-menu--item__link {
    font-size: 16px;
}

.Page-header .Page-header--left__fixed .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item>.cc-menu--item__link,
.Page-header .Page-header--right__fixed .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item>.cc-menu--item__link,
.Page-header .Page-header--shade .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item>.cc-menu--item__link,
.Page-header .Page-header--shade .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item>.cc-menu--item__link {
    font-size: 14px;
}

.Page-header .Page-header--left-drawer+.Page-header--shade,
.Page-header .Page-header--right-drawer+.Page-header--shade {
    background-color: #fff !important;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item>.cc-menu--item__link {
    justify-content: flex-start;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav .cc-menu--item>.cc-menu--item__link {
    justify-content: flex-start;
    text-align: left;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item {
    background-color: rgba(248, 248, 248, 1);
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item:hover,
.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item.block,
.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item.current {
    background-color: rgba(0, 130, 114, 1);
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item>.cc-menu--item__link {
    color: #333333;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item:hover>.cc-menu--item__link,
.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item.block>.cc-menu--item__link,
.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item.current>.cc-menu--item__link {
    color: #FFFFFF;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item {
    background-color: rgba(0, 130, 114, 1);
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item:hover,
.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item.block,
.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item.current {
    background-color: rgba(0, 130, 114, 1);
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav .cc-menu--item>.cc-menu--item__link {
    color: #fff;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav .cc-menu--item:hover>.cc-menu--item__link,
.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav .cc-menu--item.block>.cc-menu--item__link,
.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav .cc-menu--item.current>.cc-menu--item__link {
    color: #FFFFFF;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav>.cc-menu--item>.cc-menu--item__link {
    padding-left: 17px;
    padding-right: 17px;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav>.cc-menu--item>.cc-menu--item__link {
    padding-left: 34px;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav .cc-menu--nav>.cc-menu--item>.cc-menu--item__link {
    padding-left: 51px;
}

.Page-header .Page-header--shade .Page-header--shade__menu .cc-menu .cc-menu--nav .cc-menu--nav .cc-menu--nav .cc-menu--nav .cc-menu--item>.cc-menu--item__link {
    padding-left: 68px;
}

.inner-page-wrapper.user-page {
    background-color: transparent;
}

.user-page.order .order-item--head {
    background-color: #f0f0f0;
}

.user-page .cc-account-sidenav {
    background-color: #fff;
}

.user-page .cc-account-sidenav--menu dd {
    background-color: #fff;
}

.user-page .cc-account-sidenav--menu dd a {
    color: rgba(96, 96, 96, 1);
}

.user-page .cc-account-sidenav--menu dd i {
    color: rgba(96, 96, 96, 1);
}

.user-page .cc-account-sidenav--menu dd:hover {
    background-color: rgba(214, 214, 214, 1);
}

.user-page .cc-account-sidenav--menu dd:hover i,
.user-page .cc-account-sidenav--menu dd:hover a {
    color: rgba(0, 0, 0, 1);
}

.user-page .cc-account-sidenav--menu .current {
    background-color: rgba(214, 214, 214, 1);
}

.user-page .cc-account-sidenav--menu .current i,
.user-page .cc-account-sidenav--menu .current a {
    color: rgba(0, 0, 0, 1);
}

.inner-page-wrapper.user-page.login {
    background-color: #fff;
}

@media only screen and (min-width: 767px) {}

@media only screen and (min-width: 768px) {}



.Page .Page-content-inner>.posts {
    max-width: 1200px;
}

.Page .Page-content-inner>.posts .posts-body .posts-photos .cc-gallery .cc-gallery--thumbs {
    padding: 10px 0px;
}

.Page-body .Page-content-inner>.posts .posts-share .cc-share ul {
    margin: 0 10px;
}

.Page-body .Page-content-inner>.posts .posts-share .cc-share ul li img {
    width: 44px;
    height: 44px;
}

.Page .Page-content-inner>.product {
    max-width: 1600px;
    margin: auto;
}

.Page-content-inner>.product .checkout-goto {
    background-color: var(--theme-color);
}

.Page-content-inner>.product .checkout-goto:hover {
    background-color: var(--theme-color-dark);
}

.Page-content-inner>.product .shopping-push {
    background-color: var(--error-color);
}

.Page-content-inner>.product .shopping-push:hover {
    background-color: var(--error-color-dark);
}

.Page-content-inner>.Page .Page-body .Page-content .product>.cc-row {
    padding: 0px 0px;
}

.Page .Page-content-inner>.product .cc-gallery .cc-gallery--top {
    width: 100%;
}

.Page .Page-content-inner>.product .cc-gallery .cc-gallery--top .swiper-zoom-container {
    justify-content: center;
}

.Page .Page-content-inner>.product .cc-row--width__default .cc-element--wrapper .cc-textblock .cc-textblock__body {
    padding: 20px;
}

.Page .Page-content-inner>.product .cc-row--width__default .product-header {
    margin-bottom: 0px;
}

.Page-content-inner>.product .cc-tabs.cc-tabs--line.cc-tabs--position__top .cc-tabs--nav:after {
    bottom: 0;
}

.Page-content-inner>.product .product-header .product-info .product-property {
    margin: 0px 0px;
}

.Page-body .Page-content-inner>.product .cc-row--width__default .posts-share .cc-share ul {
    margin: 0 10px;
}

.Page-body .Page-content-inner>.product .cc-row--width__default .posts-share .cc-share ul li img {
    width: 44px;
    height: 44px;
}

.Page-content-inner>.product .product-header {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

.Page-content-inner>.product .cc-gallery--top {
    min-height: 380px;
}

.Page-body .Page-content-inner>.product .product-header .product-info .product-title {
    font-size: 30px;
}

@media only screen and (max-width:767px) {}

@media only screen and (min-width: 768px) {}

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

    .container,
    .cc-row--width__default {
        max-width: 98%;
    }

    .container .container,
    .cc-row .cc-row--width__default {
        max-width: 100%;
    }

    .layout-boxed .Page {
        max-width: calc(100% - 60px);
    }
}

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

    .Page-header .Page-header--topbar,
    .Page-header .Page-header--main,
    .Page-header .Page-header--topbar__placeholder,
    .Page-header .Page-header--main__placeholder,
    .Page-header--logo .all-logo {
        display: none;
    }

    .Page-header--mobile {
        display: block;
    }

    .Page-header-fixed-left>.Page-header {
        padding: unset;
        float: none;
        position: unset;
        height: auto;
        width: auto;
    }

    .Page-header--mobile .Page-header--left-drawer~.Page-header--shade {
        width: 80%;
        position: fixed;
        left: -80%;
        height: 100vh;
        display: initial;
        visibility: hidden;
        z-index: 99;
    }

    .Page-header--mobile .Page-header--right-drawer~.Page-header--shade {
        width: 80%;
        position: fixed;
        right: -80%;
        height: 100vh;
        display: initial;
        visibility: hidden;
        z-index: 99;
    }

    .Page-header--mobile .Page-header--left-drawer~.Page-header--shade .Page-header--shade__menu {
        width: 100%;
        position: static;
    }

    .Page-header--mobile .Page-header--right-drawer~.Page-header--shade .Page-header--shade__menu {
        width: 100%;
        position: static;
    }

    .Page-header-fixed-left>.Page-body {
        float: none;
        padding-left: unset;
        height: auto;
    }

    .Page-header-fixed-right>.Page-header {
        padding: unset;
        float: none;
        position: unset;
        height: auto;
        width: auto;
    }

    .Page-header-fixed-right>.Page-body {
        float: none;
        padding-left: unset;
        height: auto;
    }

    .Page-header--logo .mobile-logo {
        display: block;
    }

    .cc-textblock table,
    .posts .richtext table,
    .product .richtext table {
        margin: 5px 0 20px 0;
        display: block;
        width: 100%;
        overflow-x: auto;
        overflow-y: auto;
        min-height: 100px;
    }

    .cc-textblock table tbody,
    .posts .richtext table tbody,
    .product .richtext table tbody,
    .cc-textblock table thead,
    .posts .richtext table thead,
    .product .richtext table thead,
    .cc-textblock table tfoot,
    .posts .richtext table tfoot,
    .product .richtext table tfoot {
        width: max-content;
        height: inherit;
        border-width: inherit;
    }

    .cc-textblock table td,
    .posts .richtext table td,
    .product .richtext table td,
    .cc-textblock table th,
    .posts .richtext table th,
    .product .richtext table th {
        white-space: nowrap;
    }

    .Page-header .Page-header--mobile {
        background-color: #fff;
    }

    .Page-header .Page-header--mobile.fixed {
        background-color: rgba(255, 255, 255, 1);
    }

    .Page-header--mobile,
    .show-mobile-menu .Page-header::before {
        background-color: #eee;
    }
}

@media only screen and (min-width: 768px) {
    .Page-header--mobile {
        display: none;
    }
}

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

    .Page-header--mobile .Page-header--left-drawer,
    .Page-header--mobile .Page-header--right-drawer {
        flex-direction: row-reverse;
    }
}

@media only screen and (min-width: 768px) {}

@media only screen and (max-width: 767px) {}


.cc-hoverbox--image {
    position: relative; 
    width: 100%; 
    aspect-ratio: 268 / 359;
}

.cc-hoverbox--image img, 
.cc-hoverbox--image__hover img {
    width: 100%; 
    height: 100%; 
    object-fit: cover;
}

.cc-hoverbox--image label {
    position: absolute; 
    top: 0; 
    left: 0; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    width: 100%; 
    height: 100%; 
    font-family: 微软雅黑; 
    font-size: 24px; 
    color: #fff;
}

.cc-hoverbox--image__hover::after {
    content: '';
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(42, 157, 143, 0.75);
}

.cc-hoverbox--image__hover label {
    position: absolute;
    z-index: 1;
    top: 30%;
    left: 10%;
    font-family: 微软雅黑; 
    font-size: 20px; 
    color: #fff;
    line-height: 3;
}

.cc-hoverbox--image__hover label::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 2em;
    height: 2px;
    background-color: #fff;
}

.cc-hoverbox--image__hover p {
    position: absolute;
    top: 55%;
    left: 10%;
    z-index: 1;
    width: 80%;
    font-family: 微软雅黑; 
    font-size: 12px; 
    color: #fff;
}

.cc-hoverbox--image__hover a {
    position: absolute;
    left: 10%;
    bottom: 10%;
    z-index: 1;
    text-align: center;
    font-family: 微软雅黑; 
    font-size: 34px; 
    color: #fff;
}