@charset "utf-8";

*, ::before, ::after {

    --tw-border-spacing-x: 0;

    --tw-border-spacing-y: 0;

    --tw-translate-x: 0;

    --tw-translate-y: 0;

    --tw-rotate: 0;

    --tw-skew-x: 0;

    --tw-skew-y: 0;

    --tw-scale-x: 1;

    --tw-scale-y: 1;

    --tw-pan-x: ;

    --tw-pan-y: ;

    --tw-pinch-zoom: ;

    --tw-scroll-snap-strictness: proximity;

    --tw-gradient-from-position: ;

    --tw-gradient-via-position: ;

    --tw-gradient-to-position: ;

    --tw-ordinal: ;

    --tw-slashed-zero: ;

    --tw-numeric-figure: ;

    --tw-numeric-spacing: ;

    --tw-numeric-fraction: ;

    --tw-ring-inset: ;

    --tw-ring-offset-width: 0px;

    --tw-ring-offset-color: #fff;

    --tw-ring-color: rgb(59 130 246 / 0.5);

    --tw-ring-offset-shadow: 0 0 #0000;

    --tw-ring-shadow: 0 0 #0000;

    --tw-shadow: 0 0 #0000;

    --tw-shadow-colored: 0 0 #0000;

    --tw-blur: ;

    --tw-brightness: ;

    --tw-contrast: ;

    --tw-grayscale: ;

    --tw-hue-rotate: ;

    --tw-invert: ;

    --tw-saturate: ;

    --tw-sepia: ;

    --tw-drop-shadow: ;

    --tw-backdrop-blur: ;

    --tw-backdrop-brightness: ;

    --tw-backdrop-contrast: ;

    --tw-backdrop-grayscale: ;

    --tw-backdrop-hue-rotate: ;

    --tw-backdrop-invert: ;

    --tw-backdrop-opacity: ;

    --tw-backdrop-saturate: ;

    --tw-backdrop-sepia: ;

    --tw-contain-size: ;

    --tw-contain-layout: ;

    --tw-contain-paint: ;

    --tw-contain-style:

}



::backdrop {

    --tw-border-spacing-x: 0;

    --tw-border-spacing-y: 0;

    --tw-translate-x: 0;

    --tw-translate-y: 0;

    --tw-rotate: 0;

    --tw-skew-x: 0;

    --tw-skew-y: 0;

    --tw-scale-x: 1;

    --tw-scale-y: 1;

    --tw-pan-x: ;

    --tw-pan-y: ;

    --tw-pinch-zoom: ;

    --tw-scroll-snap-strictness: proximity;

    --tw-gradient-from-position: ;

    --tw-gradient-via-position: ;

    --tw-gradient-to-position: ;

    --tw-ordinal: ;

    --tw-slashed-zero: ;

    --tw-numeric-figure: ;

    --tw-numeric-spacing: ;

    --tw-numeric-fraction: ;

    --tw-ring-inset: ;

    --tw-ring-offset-width: 0px;

    --tw-ring-offset-color: #fff;

    --tw-ring-color: rgb(59 130 246 / 0.5);

    --tw-ring-offset-shadow: 0 0 #0000;

    --tw-ring-shadow: 0 0 #0000;

    --tw-shadow: 0 0 #0000;

    --tw-shadow-colored: 0 0 #0000;

    --tw-blur: ;

    --tw-brightness: ;

    --tw-contrast: ;

    --tw-grayscale: ;

    --tw-hue-rotate: ;

    --tw-invert: ;

    --tw-saturate: ;

    --tw-sepia: ;

    --tw-drop-shadow: ;

    --tw-backdrop-blur: ;

    --tw-backdrop-brightness: ;

    --tw-backdrop-contrast: ;

    --tw-backdrop-grayscale: ;

    --tw-backdrop-hue-rotate: ;

    --tw-backdrop-invert: ;

    --tw-backdrop-opacity: ;

    --tw-backdrop-saturate: ;

    --tw-backdrop-sepia: ;

    --tw-contain-size: ;

    --tw-contain-layout: ;

    --tw-contain-paint: ;

    --tw-contain-style:

}



*,::after,::before {

    box-sizing: border-box;

    border-width: 0;

    border-style: solid;

    border-color: #e5e7eb

}



::after,::before {

    --tw-content: ''

}

:host,html {

    line-height: 1.5;

    -webkit-text-size-adjust: 100%;

    -moz-tab-size: 4;

    tab-size: 4;

    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

    font-feature-settings: normal;

    font-variation-settings: normal;

    -webkit-tap-highlight-color: transparent

}



.li\:type li{

    list-style-type: none;

}

.last\:sep span:last-child{

    display: none;

}

body {

    margin: 0;

    line-height: inherit

}

.Bellefair{

    font-family: Bellefair;

    font-weight: 400;

}

.Heebo{

    font-family: Heebo;

}

.w-full{

    width: 100%;

}

.h-full{

    height: 100%;

}

.relative{

    position: relative;

}

.absolute{

    position: absolute;

}

.text-center{

    text-align: center;

}

.text-left{

    text-align: left;

}

.text-right{

    text-align: right;

}

.object-cover {

    object-fit: cover

}

.overflow-hidden{

    overflow: hidden;

}

.hidden{

    display: none;

}

.pointer{

    cursor: pointer;

}

.mx-auto{

    margin-left: auto;

    margin-right: auto;

}

.px-auto{

    padding-left: 15px;

    padding-right: 15px;

}

.py-auto{

    padding-top: 15px;

    padding-bottom: 15px;

}

.p-3{

    padding: .75rem;

}

.container {

    width: 100%

}



@media (min-width: 640px) {

    .container {

        max-width:640px

    }

}



@media (min-width: 768px) {

    .container {

        max-width:768px

    }

}



@media (min-width: 1024px) {

    .container {

        max-width:1280px

    }

}



@media (min-width: 1280px) {

    .container {

        max-width:1280px

    }

}



@media (min-width: 1460px) {

    .container {

        max-width:1430px

    }

}

.flex{

    display: flex;

}

.flex-wrap{

    flex-wrap: wrap;

}

.items-start {

    align-items: flex-start

}

.items-center {

    align-items: center

}

.items-end {

    align-items: flex-end

}

.align-stretch{

    align-items: stretch;

}

.justify-center {

    justify-content: center

}

.justify-between {

    justify-content: space-between

}

.gap-7{

    gap: 1.75rem;

}

.gap-3{

    gap: .75em;

}

.gap-sm{

    gap: .4em;

}

.block{

    display: block;

}

.top-1\/2{

    top: 50%;

}

.left-1\/2{

    left: 50%;

}

.m-0{

    margin: 0;

}

.mx-sm{

    margin-left: .4em;

}

.mt-5{

    margin-top: 1.25rem;

}

.mt-4{

    margin-top: 1rem;

}

.mt-3{

    margin-top: .75rem;

}

.mb-15{

    margin-bottom: 3.75rem;

}

.mb-20{

    margin-bottom: 5rem;

}

.mb-9{

    margin-bottom: 2.25rem;

}

.mb-5{

    margin-bottom: 1.25rem;

}

.mb-3{

    margin-bottom: .75rem;

}

.ml-5{

    margin-left: 1.25rem;

}

.py-9{

    padding-top: 2.25rem;

    padding-bottom: 2.25rem;

}

.py-5{

    padding-top: 1.25rem;

    padding-bottom: 1.25rem;

}

.py-3{

    padding-top: .75rem;

    padding-bottom: .75rem;

}

.py-1{

    padding-top: .25rem;

    padding-bottom: .25rem;

}

.px-10{

    padding-left: 2.5rem;

    padding-right: 2.5rem;

}

.px-7{

    padding-left: 1.75rem;

    padding-right: 1.75rem;

}

.px-5{

    padding-left: 1.25rem;

    padding-right: 1.25rem;

}

.text-\[clamp\(1\.25rem\2c 3vw\2c 1\.75rem\)\] {

    font-size: clamp(1.25rem,3vw,1.75rem)

}

.text-\[clamp\(1\.25rem\2c 3vw\2c 2\.125rem\)\] {

    font-size: clamp(1.25rem,3vw,2.125rem)

}

.text-lg {

    font-size: 1.125rem;

    line-height: 1.75rem

}

.text-sm {

    font-size: 0.875rem;

    line-height: 1.25rem

}

.text-sk {

    font-size: 1rem;

    line-height: 1.875rem

}

.text-2xl{

    font-size: 1.5rem;

    line-height: 1.875rem;

}

.text-xl {

    font-size: 1.25rem;

    line-height: 1.75rem

}

.text-uppercase{

    text-transform: uppercase

}

.leading-tight{

    line-height: 2.5rem;

}

.text-black {

    --tw-text-opacity: 1;

    color: rgb(0 0 0 / var(--tw-text-opacity, 1))

}

.text-white {

    --tw-text-opacity: 1;

    color: rgb(255 255 255 / var(--tw-text-opacity, 1))

}

.text-dark {

    --tw-text-opacity: 1;

    color: rgb(51 51 51 / var(--tw-text-opacity, 1))

}

.text-gray-600 {

    --tw-text-opacity: 1;

    color: rgb(102 102 102 / var(--tw-text-opacity, 1))

}

.text-gray-900 {

    --tw-text-opacity: 1;

    color: rgb(153 153 153 / var(--tw-text-opacity, 1))

}

.bg-repeat{

    background-repeat: no-repeat;

}

.bg-center{

    background-position: center center;

}

.bg-cover{
    background-size: cover;
}

.bg-all{
    background-size: 100% 100%;
}

.bg-black {

    --tw-bg-opacity: 1;

    background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1))

}

.bg-white {

    --tw-bg-opacity: 1;

    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1))

}

.bg-gray-100 {

    --tw-bg-opacity: 1;

    background-color: rgb(181 181 181 / var(--tw-bg-opacity, 1))

}

.w-30{

    width: 7.5rem;

}

.w-10{

    width: 2.5rem;

}

.w-4{

    width: 1rem;

}

.h-75{

    height: 18.75rem;

}

.h-16{

    height: 4rem;

}

.h-10{

    height: 2.5rem;

}

.h-4{

    width: 1rem;

}

.h-0{

    height: 0;

}

.w-sidebar-list{

    width: calc(100% - 7.5rem);

}

.square-all{

    padding-bottom: 100%;

}

.rounded-bottom {

    border-radius: 4px

}

.border {

    border-width: 1px

}

.border-t {

    border-top-width: 1px

}

.border-b {

    border-bottom-width: 1px

}

.border-dark {

    --tw-border-opacity: 1;

    border-color: rgb(207 207 207 / var(--tw-border-opacity, 1))

}

.translate-center{

    transform: translateY(-50%) translateX(-50%);;

}

.card-hover {

    transition: all 0.3s ease;

}

.card-hover:hover {

    transform: translateY(-8px);

    box-shadow: 0 12px 20px rgba(22, 93, 255, 0.15);

}

.cat-arrow::before{

    content: '>';

    position: absolute;

    font-size: 1.125rem;

    font-family: '宋体';

    font-weight: 600;

    --tw-text-opacity: 1;

    color: rgb(0 0 0 / var(--tw-text-opacity, 1))

}

span.up::before{

    transition: all .3s;

    top: 50%;

    left: 50%;

    transform: translateY(-50%) translateX(-50%);

}

span.down::before{

    transition: all .3s;

    top: 50%;

    left: 50%;

    transform: translateY(-50%) translateX(-50%) rotate(90deg);

}

.hover\:underline:hover{

    text-decoration: underline;

}

.hover\:bg-black:hover{

    --tw-bg-opacity: 1;

    background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1))

}

.hover\:text-whiie:hover{

    --tw-text-opacity: 1;

    color: rgb(255 255 255 / var(--tw-text-opacity, 1))

}

.hover\:border-black:hover{

    --tw-border-opacity: 1;

    border-color: rgb(0 0 0 / var(--tw-border-opacity, 1))

}

.ellipsis-1-lines{

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 1;

    overflow: hidden;

    text-overflow: ellipsis;

}

.ellipsis-2-lines{

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 2;

    overflow: hidden;

    text-overflow: ellipsis;

}

/* important */



.bg-black-important {

    --tw-bg-opacity: 1;

    background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)) !important

}

.bg-white-important {

    --tw-bg-opacity: 1;

    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important

}

.text-black-important {

    --tw-text-opacity: 1;

    color: rgb(0 0 0 / var(--tw-text-opacity, 1)) !important

}

.round-0{

    border-radius: 0 !important;

}

.border-b-important{

    border-top-width: 0 !important;

    border-right-width: 0 !important;

    border-bottom-width: 1px !important;

    border-left-width: 0 !important;

}

.mb-3-important{

    margin-bottom: .75rem !important;

}

.hover-bg-white-important:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1)) !important

}

.important-h-full{

    height: 100% !important;

}

@media (min-width: 640px) {
    .sm\:flex{
        display: flex;
    }

}



@media (min-width: 768px) {

    .md\:flex{

        display: flex;

    }

    .md\:w-1\/2{

        width: 50%;

    }

    .md\:w-list{

        width: calc(100% - 17.5rem);

    }

    .md\:w-185{

        width: 46.25rem;

    }

    .md\:w-135{

        width: 33.75rem;

    }

    .md\:w-3\/5{

        width: 56.333%;

    }

    .md\:w-2\/5{

        width: 43.666%;

    }

    .md\:w-70{

        width: 17.5rem;

    }

    .md\:w-list-1\/3{

        width: calc(33.333% - 2.333rem);

    }

    .md\:w-list-1\/2{

        width: calc(50% - 2.25rem);

    }

    .md\:mr-9{

        margin-right: 2.25rem;

    }

    .md\:px-10{

        padding-left: 2.5rem;

        padding-right: 2.5rem;

    }

    .md\:gap-18{

        gap: 4.5rem;

    }

    .md\:gap-14{

        gap: 3.5rem;

    }

    .md\:hidden{

        display: none;

    }

    .md\:block{

        display: block;

    }

}



@media (min-width: 1024px) {

    .lg\:flex{

        display: flex;

    }


}





/* 相关内容样式 */

li.ast-article-single{

    list-style-type: none;

    width: calc(25% - 1.3125rem);

}

li.ast-article-single span.ast-woo-product-category,li.ast-article-single a.product_type_simple{

    display: none;

}

li.ast-article-single .woocommerce-loop-product__title{

    padding: 12px;

    font-size: 18px;

    line-height: 30px;

    color: #000;

    margin: 0;

}

li.ast-article-single .astra-shop-thumbnail-wrap{

    height: 0;

    padding-bottom: 100%;

    position: relative;

}

li.ast-article-single .astra-shop-thumbnail-wrap img{

    content: '';

    position: absolute;

    width: 100%;

    height: 100%;

    top: 50%;

    left: 50%;

    transform: translateY(-50%) translateX(-50%);

}

@media (max-width: 768px) {

    li.ast-article-single{

        width: 100%;

        margin-top: 1.25rem;

    }

}