.sq-widget-logo{
    --logo-gap: var(--pc-logo-gap, 6px);
    --img-width: var(--pc-img-width, 32);
    --img-height: var(--pc-img-height, 32);
}
.sq-widget-logo .image-text-r,
.sq-widget-logo .image-text-b{
    display: flex;
    align-items: center;
    gap: var(--logo-gap, 10px);
}
.sq-widget-logo .image-text-b{
    flex-direction: column;
}
.sq-logo-text{
    line-height: 1;
}

.sq-screen-flex > .sq-widget-logo .sq-logo-img,
.sq-col-wp > .sq-widget-logo .sq-logo-img,
.sq-draggable-item > .sq-widget-logo .sq-logo-img,
.sq-logo-img:not([data-type="image"]){
    width: calc(var(--img-width, 32)* 1px);
    height: calc(var(--img-height, 32)* 1px);
}
.sq-screen-body > .sq-widget-logo{
    height: fit-content;
}

/* 编辑器生效 */
.sq-screen-body > .sq-widget-logo .sq-logo-img[data-type="image"] .sq-resize-controls{
    display: none;
}



@media screen and (max-width: 640px){
    .sq-widget-logo{
        --logo-gap: var(--m-logo-gap, var(--pc-logo-gap));
        --img-width: var(--m-img-width, var(--pc-img-width));
        --img-height: var(--m-img-height, var(--pc-img-height));
    }
}
.sq-toggle{
    --toggle-gap: var(--pc-btn-gap);
    /* 图标 */
    --line-width: var(--pc-line-width, 2px);
    --icon-size: var(--pc-icon-size, 16px);
    --icon-color-default: var(--pc-icon-color-default, #000);
    --icon-color-hover: var(--pc-icon-color-hover, var(--pc-icon-color-default));
    --icon-color-active: var(--pc-icon-color-active, var(--pc-icon-color-default));
    /* 文字样式 */
    --toggle-font-size: var(--pc-toggle-font-size, 16px);
    --toggle-color-default: var(--pc-toggle-color-default);
    --toggle-color-hover: var(--pc-toggle-color-hover);
    --toggle-color-active: var(--pc-toggle-color-active);

    display: flex;
    flex-direction: var(--pc-toggle-direction, row);
    align-items: center;
    cursor: pointer;
    gap: var(--toggle-gap, 6px);
    line-height: 1;

    /* 点击态 */
    -webkit-tap-highlight-color: transparent;
}
.sq-toggle .sq-toggle-label{
    font-size: var(--toggle-font-size, 16px);
    color: var(--toggle-color-default, var(--icon-color-default));
    transition: all 0.3s ease;
}

.sq-toggle.cur{
    position: relative;
    z-index: 100;
    --icon-color-default: var(--pc-icon-color-active);
    --toggle-color-default: var(--pc-toggle-color-active, var(--pc-toggle-color-active));
}
.sq-toggle.cur .sq-toggle-label{
    opacity: 0;
    visibility: hidden;
}

/* 查询属性 */
.sq-toggle[data-pc-type="sq-menu-i"] .sq-toggle-label{
    display: none;
}
.sq-toggle[data-pc-type="sq-menu-i-tb"]{
    flex-direction: column;
}
.sq-toggle[data-pc-type="sq-menu-i-tl"] .sq-toggle-label{
    order: -1;
}

.sq-mask{
    background-color: rgba(0, 0, 0, 0.8);
    position: fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display: none;
    z-index: 20;
}

@media screen and (max-width: 640px){
    .sq-toggle{
        --toggle-gap: var(--m-toggle-gap, var(--pc-toggle-gap));

        /* 图标 */
        --line-width: var(--m-line-width, var(--pc-line-width, 2px));
        --icon-size: var(--m-icon-size, var(--pc-icon-size, 16));
        --icon-color-default: var(--m-icon-color-default, var(--pc-icon-color-default));
        --icon-color-hover: var(--m-icon-color-hover, var(--pc-icon-color-default));
        --icon-color-active: var(--m-icon-color-active, var(--pc-icon-color-default));
        /* 文字样式 */
        --toggle-font-size: var(--m-toggle-font-size, var(--pc-toggle-font-size, 16px));
        --toggle-color-default: var(--m-toggle-color-default, var(--pc-icon-color-default));
        --toggle-color-hover: var(--m-toggle-color-hover, var(--pc-icon-color-default));
        --toggle-color-active: var(--m-toggle-color-active, var(--pc-icon-color-default));

    }
    .sq-toggle.cur{
        --icon-color-default: var(--m-icon-color-active, var(--pc-icon-color-active));
        --toggle-color-default: var(--m-toggle-color-active, var(--pc-toggle-color-active));
    }

    .sq-toggle[data-m-type="sq-menu-i"] .sq-toggle-label{
        display: none;
    }
    .sq-toggle:not([data-m-type="sq-menu-i"]) .sq-toggle-label{
        display: block;
    }
    .sq-toggle[data-m-type="sq-menu-i-tb"]{
        flex-direction: column;
    }
    .sq-toggle[data-m-type="sq-menu-i-tl"] .sq-toggle-label{
        order: -1;
    }

    
}

/* 图标 1 */
.sq-menu-1 {
display: block;
cursor: pointer;
}
.sq-menu-1 .__icon-item {
    transform: scale(calc(var(--icon-size, 16) / 16));
    width: 20px;
    height: 14px;
    position: relative;
}

.sq-menu-1 .__icon-item div {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
transition: transform 0.5s ease;
}
.sq-menu-1 .__icon-item div span {
display: block;
position: absolute;
left: 0;
right: 0;
}
.sq-menu-1 .__icon-item div span:first-child {
top: 0;
}
.sq-menu-1 .__icon-item div span:first-child:before, .sq-menu-1 .__icon-item div span:first-child:after {
top: 0;
}
.sq-menu-1 .__icon-item div span:last-child {
bottom: 0;
}
.sq-menu-1 .__icon-item div span:last-child:before, .sq-menu-1 .__icon-item div span:last-child:after {
bottom: 0;
}
.sq-menu-1 .__icon-item div span:before, .sq-menu-1 .__icon-item div span:after {
content: "";
display: block;
width: 47%;
height: var(--line-width, 2px);
border-radius: 5px;
background: var(--icon-color-default, #fff);
position: absolute;
-webkit-backface-visibility: hidden;
transition: transform 0.5s ease, border-radius 0.3s ease, background 0.4s ease;
}
.sq-menu-1 .__icon-item div span:before {
left: 0;
transform-origin: 0 50%;
transform: translate(1px, 0) scaleX(1.1);
}
.sq-menu-1 .__icon-item div span:after {
right: 0;
transform-origin: 100% 50%;
transform: translate(-1px, 0) scaleX(1.1);
}
.sq-menu-1 .__icon-item svg {
display: block;
fill: none;
stroke: var(--icon-color-default, #fff);
stroke-width: var(--line-width, 2px);
width: 28px;
height: 28px;
stroke-linecap: round;
position: absolute;
left: 50%;
top: 50%;
margin: -14px 0 0 -14px;
stroke-dasharray: 0 82.801 8.6 82.801;
stroke-dashoffset: 82.801;
transform-origin: 50% 50%;
-webkit-backface-visibility: hidden;
transform: scale(1.5);
transition: stroke-dashoffset 0.5s ease, stroke-dasharray 0.6s ease, transform 0.5s ease, stroke 0.4s ease;
}
.sq-menu-1 .__icon-item svg:nth-child(3) {
transform: rotate(180deg) scale(1.5);
}
.sq-toggle.cur .__icon-item div {
transform: rotate(90deg);
}
.sq-toggle.cur .__icon-item div span:before, .sq-toggle.cur .__icon-item div span:after {
background: var(--icon-color-default, #fff);
}
.sq-toggle.cur .__icon-item div span:first-child:before {
transform: rotate(45deg) translate(2.2px, -3px) scaleX(1.05);
}
.sq-toggle.cur .__icon-item div span:first-child:after {
transform: rotate(-45deg) translate(-2.2px, -3px) scaleX(1.05);
}
.sq-toggle.cur .__icon-item div span:last-child:before {
transform: rotate(-45deg) translate(2.2px, 3px) scaleX(1.05);
}
.sq-toggle.cur .__icon-item div span:last-child:after {
transform: rotate(45deg) translate(-2.2px, 3px) scaleX(1.05);
}
.sq-toggle.cur .__icon-item svg {
stroke-dashoffset: 62;
stroke-dasharray: 0 82.801 62 82.801;
transform: rotate(90deg);
stroke: var(--icon-color-default, #fff);
}
.sq-toggle.cur .__icon-item svg:nth-child(3) {
transform: rotate(270deg);
}
/* 导航栏组件 */
.sq-widget-navs{
    --navs-item-height: var(--pc-navs-item-height, inherit);
    --navs-item-padding: var(--pc-navs-item-padding);
    --navs-item-radius: var(--pc-navs-item-radius);

    --subnav-item-gap: var(--pc-subnav-item-gap);
    --subnav-font-size: var(--pc-subnav-font-size, 14px);
    --subnav-text-color-default: var(--pc-subnav-text-color-default, #333);
    --subnav-font-family: var(--pc-subnav-font-family, inherit);
    --subnav-font-weight: var(--pc-subnav-font-weight, normal);
    --subnav-item-padding: var(--pc-subnav-item-padding, 3px 12px);
    --subnav-item-bg-default: var(--pc-subnav-item-bg-default);
    --subnav-radius: var(--pc-subnav-radius, 4px);

    --navs-icon-gap: var(--pc-icon-before-gap, 8px);
}

.sq-navs-ul,
.sq-navs-item > a,
.sq-navs-item > .sq-a,
.sq-navs-link{
    display: flex;
}
.sq-navs-item > a,
.sq-navs-item > .sq-a,
.sq-navs-link{
    gap: var(--navs-icon-gap);
}
.sq-navs-name,.sq-navs-link{
    flex: 1 1 auto;
}
.sq-navs {
    height: fit-content;
    width: auto;
    display: flex;
    justify-content: var(--pc-widget-justify);
}
.sq-navs-ul{
    margin: 0;
    height: 100%;
    flex-wrap: wrap;
    flex-direction: var(--pc-navs-mode, 'row');
}
.sq-pc-mode-row .sq-navs-ul{
    column-gap: var(--pc-navs-gap, 26px);
}
.sq-pc-mode-column .sq-navs-ul{
    row-gap: var(--pc-navs-gap, 26px);
}

.sq-navs-item{
    position: relative;
    font-size: var(--pc-font-size, 15px);
}
.sq-pc-mode-row .sq-navs-line{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: var(--pc-navs-line-height, var(--pc-font-size, 100%));
    left: calc(-1 * var(--pc-navs-gap) / 2);
    border-left-width: var(--pc-navs-line-width, 1px);
    border-left-color: var(--pc-navs-line-color, rgba(0, 0, 0, .3));
    border-left-style: var(--pc-navs-line-style, solid);
    display: var(--pc-navs-line-type, 'block');
}
.sq-pc-mode-column .sq-navs-line{
    position: absolute;
    height: 0;
    width: 100%;
    left: 0;
    top: calc(-1 * var(--pc-navs-gap) / 2);
    border-top-width: var(--pc-navs-line-width, 1px);
    border-top-color: var(--pc-navs-line-color, rgba(0, 0, 0, .3));
    border-top-style: var(--pc-navs-line-style, solid);
    display: var(--pc-navs-line-type, 'block');
    
}
.sq-navs-item:first-child .sq-navs-line{
    display: none;
}
.sq-navs-item > a,
.sq-navs-item > .sq-a {
    height: var(--navs-item-height);
    width: 100%;
    font-size: var(--pc-font-size);
    /* color: var(--pc-navs-text-color-default); */
    background-color: var(--pc-navs-item-bg-default);
    align-items: var(--pc-navs-align, center);
    /* justify-content: var(--pc-navs-justify, center); */
    color: var(--pc-text-color-default);
    padding: var(--navs-item-padding);
    border-radius: var(--navs-item-radius);
}
.sq-navs-link{
    gap: var(--pc-navs-icon-gap, 12px);
}
.sq-navs-item > a:hover,
.sq-navs-item > .sq-a:hover {
    color: var(--pc-text-color-hover);
    background-color: var(--pc-navs-item-bg-hover);
}
.sq-navs-item.active > a,
.sq-navs-item.active > .sq-a {
    color: var(--pc-text-color-active);
    background-color: var(--pc-navs-item-bg-active);
}
.sq-navs-icon{
    overflow: hidden;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* .sq-sub-menu{
    --pc-subnav-a-padding:3px 12px;
} */
.sq-sub-menu,
.sq-subnav .sq-subnav {
    padding: var(--pc-subnav-padding, 8px 0);
    min-width: var(--pc-subnav-min-width, 120px);
    max-width: var(--pc-subnav-max-width, 300px);
}
.sq-subnav-ul{
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: var(--pc-subnav-item-mode, column);
    gap: var(--subnav-item-gap, 0);

    --subnav-line-height: var(--pc-subnav-line-height, 1.8);
}
.sq-subnav-ul li{
    position: relative;
    line-height: var(--subnav-line-height);
    width: 100%;
}
.sq-subnav-ul li a,
.sq-subnav-ul li .sq-a{
    font-size: var(--subnav-font-size);
    color: var(--subnav-text-color-default);
    font-family: var(--subnav-font-family);
    font-weight: var(--subnav-font-weight);
    padding: var(--subnav-item-padding);
    background: var(--subnav-item-bg-default);
    border-radius: var(--subnav-radius);
}
.sq-subnav-ul li a:hover,
.sq-subnav-ul li .sq-a:hover{
    color: var(--pc-subnav-text-color-hover);
    background: var(--pc-subnav-item-bg-hover);
}

/* 无限子菜单样式 */
.sq-navs-subpanel:not([data-layout="2"]) .sq-sub-menu,
.sq-navs-subpanel:not([data-layout="2"]) .sq-subnav .sq-subnav{
    background: var(--pc-subnav-bg, #ffffff);
    box-shadow: var(--pc-subnav-shadow);
    border-radius: var(--pc-subnav-radius, 4px);
    border: var(--pc-subnav-border, 1px solid #e8e8e8);

}
.sq-navs-subpanel:not([data-layout="2"]) .sq-sub-menu{
    position: absolute;
    z-index: 100;
    visibility: hidden;
    opacity: 0;
}
.sq-navs-subpanel:not([data-layout="2"]) .sq-subnav .sq-subnav{
    position: absolute;
    left: 100%;
    top: 0;
    visibility: hidden;
    opacity: 0;
    transform: translateY(10px);
    transition: all .4s cubic-bezier(.4,.01,.165,.99);
}

.sq-navs-subpanel:not([data-layout="2"]) .sq-subnav-ul li:hover > .sq-subnav{
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

/* 导航ALL子菜单面板 */
.sq-navs-subpanel[data-layout="2"]{
    width: 100%;
    position: fixed;
    top: 100%;
    left: 0!important;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
}
.sq-navs-subpanel[data-layout="2"] .sq-navs-subpanel-wp{
    display: flex;
    flex-wrap: wrap;
    gap: var(--pc-subpanel-gap, 20px);
}

.sq-navs-collapse,
.sq-navs-collapse .sq-navs-ul,
.sq-navs-panel,
.sq-navs-panel .sq-navs-ul{
    width: 100%;
}
.sq-navs-arrow{
    display: flex;
}
.sq-navs-panel .sq-navs-children-a .sq-navs-arrow{
    display: none;
}


@media screen and (min-width: 640px){
    .sq-pc-navs-panel .sq-navs-line{
        --pc-navs-line-height: 100%
    }
    /* 折叠菜单样式 */
    .sq-pc-navs-collapse .sq-subnav{
        display: none;
    }
    .sq-pc-navs-collapse .sq-navs-children.sq-open .sq-subnav{
        display: block;
    }
    .sq-pc-navs-panel .sq-navs{
        width: 100%;
    }
    .sq-pc-navs-panel .sq-navs-ul > .sq-navs-item {
        width: calc((100% - var(--pc-navs-gap)*(var(--pc-navs-col, 2) - 1)) / var(--pc-navs-col, 2));
    }
}

@media screen and (max-width: 640px){
    /* 导航菜单 */
    .sq-widget-navs{
        --navs-item-height: var(--m-navs-item-height, var(--pc-navs-item-height));
        --navs-item-padding: var(--m-navs-item-padding, var(--pc-navs-item-padding));
        --navs-item-radius: var(--m-navs-item-radius, var(--pc-navs-item-radius));
        
        --subnav-item-gap: var(--m-subnav-item-gap, var(--pc-subnav-item-gap));
        --subnav-font-size: var(--m-subnav-font-size, var(--pc-subnav-font-size));
        --subnav-text-color-default: var(--m-subnav-text-color-default, var(--pc-subnav-text-color-default));
        --subnav-font-family: var(--m-subnav-font-family, var(--pc-subnav-font-family));
        --subnav-font-weight: var(--m-subnav-font-weight, var(--pc-subnav-font-weight));
        --subnav-item-padding: var(--m-subnav-item-padding, var(--pc-subnav-item-padding));
        --subnav-item-bg-default: var(--m-subnav-item-bg-default, var(--pc-subnav-item-bg-default));
        --subnav-radius: var(--m-subnav-radius, var(--pc-subnav-radius));

        --navs-icon-gap: var(--m-icon-before-gap, var(--pc-icon-before-gap, 8px));
    }
    .sq-navs-ul{
        flex-direction: var(--m-navs-mode, var(--pc-navs-mode));
    }
    .sq-m-mode-row .sq-navs-ul{
        column-gap: var(--m-navs-gap, var(--pc-navs-gap));
    }
    .sq-m-mode-column .sq-navs-ul{
        row-gap: var(--m-navs-gap, var(--pc-navs-gap));
    }

    .sq-navs-item{
        font-size: var(--m-navs-font-size, var(--pc-font-size, 15px));
    }
    .sq-m-mode-row .sq-navs-line{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 0;
        height: var(--m-navs-line-height, var(--pc-navs-line-height, var(--m-navs-font-size, var(--pc-font-size))));
        left: calc(-1 * var(--m-navs-gap, var(--pc-navs-gap)) / 2);
        border-left-width: var(--m-navs-line-width, var(--pc-navs-line-width));
        border-left-color: var(--m-navs-line-color, var(--pc-navs-line-color));
        border-left-style: var(--m-navs-line-style, var(--pc-navs-line-style));
        display: var(--m-navs-line-type, var(--pc-navs-line-type));
    }
    .sq-m-mode-column .sq-navs-nav,.sq-m-mode-column .sq-navs-ul{
        width: 100%;
    }
    .sq-m-mode-column .sq-navs-line{
        position: absolute;
        height: 0;
        width: 100%;
        left: 0;
        top: calc(-1 * var(--m-navs-gap, var(--pc-navs-gap)) / 2);
        border-top-width: var(--m-navs-line-width, var(--pc-navs-line-width));
        border-top-color: var(--m-navs-line-color, var(--pc-navs-line-color));
        border-top-style: var(--m-navs-line-style, var(--pc-navs-line-style));
        display: var(--m-navs-line-type, var(--pc-navs-line-type));
    }
    .sq-navs-item > a,
    .sq-navs-item > .sq-a{
        font-size: var(--m-font-size, var(--pc-font-size));
        color: var(--m-navs-text-color-default, var(--pc-navs-text-color-default));
        background-color: var(--m-navs-item-color-default,var(--pc-navs-item-color-default));
        align-items: var(--m-navs-align, var(--pc-navs-align, center));
        justify-content: var(--m-navs-justify, var(--pc-navs-justify));
    }
    .sq-navs-item > a:hover,
    .sq-navs-item > .sq-a:hover {
        color: var(--m-navs-text-color-hover, var(--pc-navs-text-color-hover));
        background-color: var(--m-navs-item-color-hover, var(--pc-navs-item-color-hover));
    }
    .sq-navs-item.active > a,
    .sq-navs-item.active > .sq-a {
        background-color: var(--m-navs-item-color-active, var(--pc-navs-item-color-active));
    }

    .sq-m-navs-panel .sq-navs-line{
        --m-navs-line-height: 100%
    }
    .sq-m-navs-collapse .sq-subnav{
        display: none;
    }
    .sq-m-navs-collapse .sq-navs-children.sq-open .sq-subnav{
        display: block;
    }

    .sq-navs-xscroll .sq-navs{
        overflow-x: auto;
    }
    .sq-navs-xscroll .sq-navs-ul {
        flex-wrap: nowrap
    }
    .sq-navs-xscroll .sq-navs-item {
        flex-shrink: 0;
    }
}
/* 目前仅图文有用 日期组件 */
.sq-date{
    --date-color-default: var(--pc-date-color-default, #333);
    --date-color-hover: var(--pc-date-color-hover, #666);
    --date-font-size: var(--pc-date-font-size, 15px);
    --date-align: var(--pc-date-justify);
    --date-padding: var(--pc-date-padding);
    --date-margin: var(--pc-date-margin);

    display: flex;
    flex-direction: column;
    line-height: 1.2;
    color: var(--date-color-default);

    justify-content: var(--date-align);

    padding: var(--date-padding);
    margin: var(--date-margin);
}
.sq-date-day{
    font-size: var(--date-font-size);
    width: 100%;
    white-space: nowrap;
}
.sq-date-month{
    font-size: calc(var(--date-font-size) * 0.7);
    opacity: 0.5;
    width: 100%;
    white-space: nowrap;
}
.sq-date.sq-date-3 .sq-date-month{
    order: -1;
}
/* 日期位置 */
.sq-pos-a-top,
.sq-pos-a-left,
.sq-pos-a-right,
.sq-pos-a-bottom{
    --date-gap: var(--pc-date-gap);
    gap: var(--date-gap);
    display: flex;
}
.sq-pos-t-top .sq-item-body,
.sq-pos-t-left .sq-item-body,
.sq-pos-t-right .sq-item-body{
    --date-gap: var(--pc-date-gap);
    gap: var(--date-gap);
    display: flex;
    flex: 1 1 0;
}
.sq-pos-a-top,
.sq-pos-a-bottom,
.sq-pos-t-top .sq-item-body,
.sq-pos-t-bottom .sq-item-body{
    flex-direction: column;
}
.sq-pos-a-left .sq-item-wp,
.sq-pos-t-left .sq-item-body .sq-texts,
.sq-pos-t-right .sq-item-body .sq-texts{
    flex: 1 1 0%;
}
.sq-pos-a-top .sq-date,
.sq-pos-a-left .sq-date,
.sq-pos-t-top .sq-date,
.sq-pos-t-left .sq-date{
    order: -1;
}

.sq-item-img-wp .sq-videos-btn{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}


@media screen and (min-width: 640px){
    .sq-pc_img-text-b .sq-item-wp,
    .sq-pc_img-text-t .sq-item-wp,
    .sq-pc_img-text-tb .sq-item-wp{
        display: flex;
        width: 100%;
        flex-direction: column;
        height: 100%;
    }

    .sq-pc_img-text-t .sq-item .sq-item-body,
    .sq-pc_img-text-tb .sq-item:nth-child(2n) .sq-item-body,
    .sq-pc_img-text-l .sq-item-wp .sq-item-body{
        order: -1;
    }

    .sq-pc_img-text-r .sq-item-wp,
    .sq-pc_img-text-l .sq-item-wp{
        display: flex;
        flex-direction: row;
        width: 100%;
    }

    .sq-imgbox{
        min-width: 6px;
        min-height: 6px;
    }
    .sq-pc_img-text-r .sq-item-wp .sq-imgbox,
    .sq-pc_img-text-l .sq-item-wp .sq-imgbox{
        width: calc(var(--pc-img-width, 32) * 1px);
        height: calc(var(--pc-img-height, 32) * 1px);
    }
    .sq-pc_img-text-r .sq-item-wp .sq-item-body,
    .sq-pc_img-text-l .sq-item-wp .sq-item-body{
        flex: 1;
        min-width: 32px;
    }

    .sq-pc_img-text-cb .sq-item-body,
    .sq-pc_img-text-c .sq-item-body{
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        z-index: 2;
    }
    .sq-pc_img-text-c .sq-item-body{
        top: 0;
    }

    .sq-pc_img-text-r .sq-item-body,
    .sq-pc_img-text-l .sq-item-body,
    .sq-pc_img-text-cb .sq-item-body,
    .sq-pc_img-text-c .sq-item-body{
        display: flex;
        width: 100%;
        justify-content: var(--pc-texts-align);
        flex-direction: column;
    }

    /* 悬停显示文字效果 */
    .sq-pc-item-hover .sq-item .sq-item-body{
        opacity: 0;
        visibility: hidden;
        transition: all .4s cubic-bezier(.4,.01,.165,.99);
    }
    .sq-pc-item-hover .sq-item:hover .sq-item-body{
        opacity: 1;
        visibility: visible;
    }

    .sq-pc-item-hover .sq-item .sq-text-item{
        opacity: 0;
        visibility: hidden;
        transition: all .4s cubic-bezier(.4,.01,.165,.99);
        transform: translateY(12px);
    }
    .sq-pc-item-hover .sq-item:hover .sq-text-item{
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
    .sq-pc-item-hover .sq-item:hover .sq-text-item:nth-child(2){
        transition-delay: .1s;
    }
    .sq-pc-item-hover .sq-item:hover .sq-text-item:nth-child(3){
        transition-delay: .2s;
    }
    .sq-pc-item-hover .sq-item:hover .sq-text-item:nth-child(4){
        transition-delay: .3s;
    }


    /* texts.style.switch.hover */
}

.sq-items .sq-item .sq-item-body{
    --text-bg-default: var(--pc-text-bg-default);
    --text-bg-hover: var(--pc-text-bg-hover);
    background: var(--text-bg-default);
}
.sq-items .sq-item:hover .sq-item-body{
    background: var(--text-bg-hover);
}
.sq-items .sq-text-item{
    --text-color-hover: var(--pc-text-color-hover, var(--pc-text-color-default));
}
.sq-items .sq-item:hover .sq-text-item{
    color: var(--text-color-hover);
}

/* 分页 */
.sq-pagination{
    --pagi-padding: var(--pc-pagi-padding);
    --pagi-align: var(--pc-pagi-align);
    --pagi-justify: var(--pc-pagi-justify);
    --pagi-item-gap: var(--pc-pagi-item-gap);
    --pagi-item-font-size: var(--pc-pagi-item-font-size);
    --pagi-item-padding: var(--pc-pagi-item-padding);
    --pagi-item-radius: var(--pc-pagi-item-radius);
    --pagi-item-bg-default: var(--pc-pagi-item-bg-default);
    --pagi-item-bg-hover: var(--pc-pagi-item-bg-hover);
    --pagi-item-bg-active: var(--pc-pagi-item-bg-active, var(--pc-pagi-item-bg-hover));
    --pagi-item-color-default: var(--pc-pagi-item-color-default);
    --pagi-item-color-hover: var(--pc-pagi-item-color-hover);
    --pagi-item-color-active: var(--pc-pagi-item-color-active, var(--pc-pagi-item-color-hover));
    --pagi-item-border: var(--pc-pagi-item-border);
    --pagi-item-shadow: var(--pc-pagi-item-shadow);


    display: flex;
    padding: var(--pagi-padding, 10px);
    align-items: var(--pagi-align, center);
    justify-content: var(--pagi-justify, center);
}
.sq-pagination-wp{
    display: flex;
    gap: var(--pagi-item-gap, 10px);
    font-size: var(--pagi-item-font-size, 14px);
}

.sq-pagination .page-item{
    padding: var(--pagi-item-padding, 10px 12px);
    border-radius: var(--pagi-item-radius, 5px);
    background: var(--pagi-item-bg-default, #fff);
    color: var(--pagi-item-color-default, #333);
    line-height: 1;

    border: var(--pagi-item-border);
    box-shadow: var(--pagi-item-shadow);
}
.sq-pagination .page-item:hover{
    background: var(--pagi-item-bg-hover, var(--pagi-item-bg-default));
    color: var(--pagi-item-color-hover, var(--pagi-item-color-default));

}
.sq-pagination .page-item.current{
    background: var(--pagi-item-bg-active);
    color: var(--pagi-item-color-active);
    border-color: var(--pagi-item-bg-active);
}

@media screen and (max-width: 640px){
    .sq-items .sq-text-item{
        --text-color-hover: var(--m-text-color-hover, var(--m-text-color-default));
    }
    .sq-date{
        --date-color-default: var(--m-date-color-default, var(--pc-date-color-default));
        --date-color-hover: var(--m-date-color-hover, var(--pc-date-color-hover));
        --date-font-size: var(--m-date-font-size, var(--pc-date-font-size));
        --date-align: var(--m-date-justify, var(--pc-date-justify));
        --date-padding: var(--m-date-padding, var(--pc-date-padding));
        --date-margin: var(--m-date-margin, var(--pc-date-margin));
    }

    .sq-m_img-text-r .sq-item-wp,
    .sq-m_img-text-l .sq-item-wp{
        display: flex;
        flex-direction: row;
        width: 100%;
    }
    .sq-m_img-text-b .sq-item-wp,
    .sq-m_img-text-t .sq-item-wp,
    .sq-m_img-text-tb .sq-item-wp{
        display: flex;
        width: 100%;
        flex-direction: column;
    }

    .sq-m_img-text-t .sq-item .sq-item-body,
    .sq-m_img-text-l .sq-item-wp .sq-item-body,
    .sq-m_img-text-tb .sq-item:nth-child(2n) .sq-item-body{
        order: -1;
    }

    .sq-m_img-text-r .sq-item-wp .sq-item-body,
    .sq-m_img-text-l .sq-item-wp .sq-item-body{
        flex: 1;
        min-width: 32px;
    }

    .sq-m_img-text-r .sq-item-wp .sq-imgbox,
    .sq-m_img-text-l .sq-item-wp .sq-imgbox{
        width: calc(var(--m-img-width, var(--pc-img-width)) * 1px);
        height: calc(var(--m-img-height, var(--pc-img-width)) * 1px);
    }

    .sq-m_img-text-cb .sq-item-body,
    .sq-m_img-text-c .sq-item-body{
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        z-index: 2;
    }
    .sq-m_img-text-c .sq-item-body{
        top: 0;
    }

    .sq-m_img-text-r .sq-item-body,
    .sq-m_img-text-l .sq-item-body,
    .sq-m_img-text-cb .sq-item-body,
    .sq-m_img-text-c .sq-item-body,
    .sq-m_img-text-c .sq-texts{
        display: flex;
        width: 100%;
        justify-content: var(--m-texts-align, var(--pc-texts-align));
        flex-direction: column;
    }
    .sq-m_img-text-c .sq-texts{
        height: 100%;
    }
    /* 分页 */
    .sq-pagination{
        --pagi-padding: var(--m-pagi-padding, var(--pc-pagi-padding));
        --pagi-align: var(--m-pagi-align, var(--pc-pagi-align));
        --pagi-justify: var(--m-pagi-justify, var(--pc-pagi-justify));
        --pagi-item-gap: var(--m-pagi-item-gap, var(--pc-pagi-item-gap));
        --pagi-item-font-size: var(--m-pagi-item-font-size, var(--pc-pagi-item-font-size));
        --pagi-item-padding: var(--m-pagi-item-padding, var(--pc-pagi-item-padding));
        --pagi-item-radius: var(--m-pagi-item-radius, var(--pc-pagi-item-radius));
        --pagi-item-bg-default: var(--m-pagi-item-bg-default, var(--pc-pagi-item-bg-default));
        --pagi-item-bg-hover: var(--m-pagi-item-bg-hover, var(--pc-pagi-item-bg-hover));
        --pagi-item-bg-active: var(--m-pagi-item-bg-active, var(--pc-pagi-item-bg-hover));
        --pagi-item-color-default: var(--m-pagi-item-color-default, var(--pc-pagi-item-color-default));
        --pagi-item-color-hover: var(--m-pagi-item-color-hover, var(--pc-pagi-item-color-hover));
        --pagi-item-border: var(--m-pagi-item-border, var(--pc-pagi-item-border));
        --pagi-item-shadow: var(--m-pagi-item-shadow, var(--pc-pagi-item-shadow));
    }
}

/* 滚动效果 */
.marquee-box {
    display: flex;
    transform: translateZ(0);
    backface-visibility: hidden;
    overflow: hidden;
    justify-content: flex-start;
}
.marquee-box .marquee-container {
    overflow: hidden;
    position: relative;
}
.marquee-box .marquee-content {
    display: inline-flex;
    white-space: nowrap;
    /* 当激活后，应该width设置为auto */
    width: 100%;
}
.marquee-box .marquee-vertical .marquee-content {
    display: block;
    white-space: normal;
}

.marquee-box .marquee-content.init .sq-item {
    width: var(--item-width); /* 使用 CSS 变量 */
    will-change: transform;
    backface-visibility: hidden;
}
.marquee-box .marquee-content.init{
    flex-wrap: nowrap;
}
.swiper.swiper-cards{
    overflow: visible!important;
}
.sq-slides{
    gap: var(--slides-gap, 8px);
}
.sq-swiper .swiper-button-prev,
.sq-swiper .swiper-button-next{
    position: absolute;
    top: 50%;
    z-index: 10;
    width: auto;
    height: auto;
    margin-top: auto;
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    color: var(--pc-swiper-nav-color);
    --icon-size: var(--pc-swiper-nav-size);
}
.sq-swiper .swiper-button-prev{
    --tw-rotate: 180deg;
    /* left: calc(-1 * (var(--pc-swiper-nav-size) + var(--prev-offset-x, 12px))) */
}
.sq-swiper .swiper-button-prev:after,
.sq-swiper .swiper-button-next:after {
    content: '';
    background: var(--pc-swiper-nav-color);
    mask-image: var(--pc-swiper-nav-icon);
    mask-mode: alpha;
    mask-size: var(--icon-size);
    width: var(--icon-size);
    height: var(--icon-size);
}
.sq-swiper .sq-swiper{
    border-radius: var(--pc-widget-radius);
}

.sq-swiper-thumbs{
    height: var(--pc-swiper-thumbs-height);
}
.sq-swiper-thumbs swiper-slide{
    opacity: 0.6;
}
.sq-swiper-thumbs .swiper-slide-thumb-active{
    opacity: 1;
}

.sq-swiper .swiper-pagination-bullet{
    background: var(--pc-swiper-pag-color, --swiper-theme-color);
    width: var(--pc-swiper-pag-size, 8px);
    height: var(--pc-swiper-pag-size, 8px);
}
.sq-swiper .sq-pagination-a2 .swiper-pagination-bullet-active{
    width: 24px;
    border-radius: 100px;
}

.sq-swiper .sq-pagination-a3 .swiper-pagination-bullet{
    border-radius: 1px;
    width: 20px;
}

.sq-swiper .sq-pagination-a4 .swiper-pagination-bullet{
    border-radius: 0;
    width: 20px;
    margin: var(--swiper-bullet-m, 0)!important;
}

.sq-swiper .sq-pagination-a5{
    width: auto;
    left: 50%;
    transform: translateX(-50%);
    background: var(--pc-swiper-pag-color, --swiper-theme-color);
    color: #fff;
    min-height: var(--pc-swiper-pag-size, 16px);
    height: auto;
    border-radius: 100px;
    padding: 0 10px;
    font-size: var(--pagination-font-size, 13px);
}

.sq-swiper .sq-pagination-a6,
.sq-swiper .sq-pagination-a7{
    display: flex;
    justify-content: center;
}
.sq-swiper .sq-pagination-a6 .swiper-pagination-bullet,
.sq-swiper .sq-pagination-a7 .swiper-pagination-bullet{
    min-height: 16px;
    min-width: 16px;
    line-height: 1;
    font-size: var(--pagination-font-size, 12px);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sq-swiper .sq-pagination-a7 .swiper-pagination-bullet{
    border-radius: var(--swiper-bullet-radius, 3px);
    background: transparent;
    border: 1.5px solid var(--pc-swiper-pag-color, --swiper-theme-color);
    color: var(--pc-swiper-pag-color, --swiper-theme-color);
}
.sq-swiper .sq-pagination-a7 .swiper-pagination-bullet-active{
    background: var(--pc-swiper-pag-color, --swiper-theme-color);
    color: #fff;
}
/* 是否在外 */
.swiper-nav-outer .swiper-button-prev{
    left: calc(-1 * (var(--pc-swiper-nav-size) + var(--pc-prev-offset-x, 20px)))
}
.swiper-nav-outer .swiper-button-next{
    right: calc(-1 * (var(--pc-swiper-nav-size) + var(--pc-prev-offset-x, 20px)))
}
.swiper-pag-outer .swiper-pagination,
.swiper-pag-outer .swiper-pagination.swiper-pagination-horizontal{
    bottom: calc(-1 * (var(--pc-swiper-pag-size) + var(--pc-pag-offset-y, 20px)))
}

.sq-slide-item .sq-widget-gridbox{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

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

@media screen and (max-width: 640px){
    .sq-swiper .swiper{
        border-radius: var(--m-widget-radius, var(--pc-widget-radius));
    }
    .sq-swiper-thumbs{
        height: var(--m-swiper-thumbs-height, var(--pc-swiper-thumbs-height));
    }

    .swiper-nav-outer .swiper-button-prev{
        left: calc(-1 * (var(--m-swiper-nav-size) + var(--m-prev-offset-x, 16px)))
    }
    .swiper-nav-outer .swiper-button-next{
        right: calc(-1 * (var(--m-swiper-nav-size) + var(--m-prev-offset-x, 16px)))
    }
    .swiper-pag-outer .swiper-pagination,
    .swiper-pag-outer .swiper-pagination.swiper-pagination-horizontal{
        bottom: calc(-1 * (var(--m-swiper-pag-size) + var(--m-prev-pag-y, 16px)))
    }

    /* 配色 */
    .sq-swiper .swiper-button-prev,
    .sq-swiper .swiper-button-next{
        color: var(--m-swiper-nav-color, var(--pc-swiper-nav-color));
        --icon-size: var(--m-swiper-nav-size, var(--pc-swiper-nav-size));
    }
    .sq-swiper .swiper-button-prev:after,
    .sq-swiper .swiper-button-next:after {
        background: var(--m-swiper-nav-color, var(--pc-swiper-nav-color));
        mask-image: var(--m-swiper-nav-icon), var(--pc-swiper-nav-icon);
    }
    .sq-swiper .sq-swiper{
        border-radius: var(--m-widget-radius, var(--pc-widget-radius));
    }

    .sq-swiper-thumbs{
        height: var(--m-swiper-thumbs-height, var(--pc-swiper-thumbs-height));
    }

    .sq-swiper .swiper-pagination-bullet{
        background: var(--m-swiper-pag-color, var(--pc-swiper-pag-color));
        width: var(--m-swiper-pag-size, var(--pc-swiper-pag-size));
        height: var(--m-swiper-pag-size, var(--pc-swiper-pag-size));
    }

    .sq-swiper .sq-pagination-a5{
        background: var(--m-swiper-pag-color, var(--pc-swiper-pag-color));
        min-height: var(--m-swiper-pag-size, var(--pc-swiper-pag-size));
        /* font-size: var(--pagination-font-size, var(--pagination-font-size)); */
    }
    
    /* .sq-swiper .sq-pagination-a6 .swiper-pagination-bullet,
    .sq-swiper .sq-pagination-a7 .swiper-pagination-bullet{
        font-size: var(--pagination-font-size, 12px);
    } */
    .sq-swiper .sq-pagination-a7 .swiper-pagination-bullet{
        border-radius: var(--swiper-bullet-radius);
        border: 1.5px solid var(--m-swiper-pag-color, var(--pc-swiper-pag-color));
        color: var(--m-swiper-pag-color, var(--pc-swiper-pag-color));
    }
    .sq-swiper .sq-pagination-a7 .swiper-pagination-bullet-active{
        background: var(--m-swiper-pag-color, var(--pc-swiper-pag-color));
    }
    /* 是否在外 */
    .swiper-nav-outer .swiper-button-prev{
        --pc-swiper-nav-size: var(--m-swiper-nav-size, var(--pc-swiper-nav-size))
    }
    .swiper-nav-outer .swiper-button-next{
        --pc-swiper-nav-size: var(--m-swiper-nav-size, var(--pc-swiper-nav-size))
    }
    .swiper-pag-outer .swiper-pagination,
    .swiper-pag-outer .swiper-pagination.swiper-pagination-horizontal{
        --pc-swiper-pag-size: var(--m-swiper-pag-size, var(--pc-swiper-pag-size))
    }
    

}
.sq-tabs-box,
.sq-collapse,
.sq-collapse-box{
    display: flex;
}
.sq-collapse,
.sq-collapse-box{
    flex-direction: column;
}
.sq-tabs-box .sq-tabs-content,
.sq-tabs-nav-item .sq-tabs-label{
    flex: 1;
}

.sq-tabs-nav-wp{
    display: flex;
    min-width: fit-content;
    width: 100%;
}
.sq-tabs-nav-item{
    cursor: pointer;
}
.sq-tabs-icon img{
    width: 100%;
    height: 100%;
}

.sq-tabs-panel{
    display:none
}
.sq-tabs-panel-active{
    display:block
}

.sq-tabs-nav{
    overflow-x: auto;
    display: flex;
    justify-content: start;
}

/* 折叠面板 */
.sq-collapse-body{
    display: none;
}
.sq-collapse.sq-open .sq-collapse-body{
    display: block;
}
.sq-collapse-title{
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}
.sq-collapse .sq-collapse-header__right{
    transform: rotate(90deg);
    transition: transform 0.3s ease-in-out;
}
.sq-collapse.sq-open .sq-collapse-header__right{
    transform: rotate(0deg);
}

@media screen and (min-width: 640px){
    .sq-pc_tab-left > .sq-tabs-nav .sq-tabs-nav-wp,
    .sq-pc_tab-right > .sq-tabs-nav .sq-tabs-nav-wp,
    .sq-pc_tab-icon-top .sq-tabs-nav-item,
    .sq-pc_tab-icon-bottom .sq-tabs-nav-item,
    .sq-pc_tab-top.sq-tabs-box,
    .sq-pc_tab-bottom.sq-tabs-box{
        flex-direction: column;
    }

    .sq-pc_tab-top > .sq-tabs-nav-wp,
    .sq-pc_tab-bottom > .sq-tabs-nav-wp{
        flex-wrap: nowrap;
    }
    .sq-pc_tab-top > .sq-tabs-nav .sq-tabs-label,
    .sq-pc_tab-bottom > .sq-tabs-nav .sq-tabs-label{
        white-space: nowrap;
    }
    
    .sq-pc_tab-right > .sq-tabs-nav,
    .sq-pc_tab-bottom > .sq-tabs-nav{
        order: 1;
    }

    /* 图标 */
    .sq-pc_tab-icon-right .sq-tabs-nav-item .sq-tabs-icon,
    .sq-pc_tab-icon-bottom .sq-tabs-nav-item .sq-tabs-icon{
        order: 1;
    }

    
}

@media screen and (max-width: 640px){
    .sq-m_tab-left > .sq-tabs-nav .sq-tabs-nav-wp,
    .sq-m_tab-right > .sq-tabs-nav .sq-tabs-nav-wp,
    .sq-m_tab-icon-top .sq-tabs-nav-item,
    .sq-m_tab-icon-bottom .sq-tabs-nav-item,
    .sq-m_tab-top.sq-tabs-box,
    .sq-m_tab-bottom.sq-tabs-box{
        flex-direction: column;
    }

    .sq-m_tab-top > .sq-tabs-nav-wp,
    .sq-m_tab-bottom > .sq-tabs-nav-wp{
        flex-wrap: nowrap;
    }
    .sq-m_tab-top > .sq-tabs-nav .sq-tabs-label,
    .sq-m_tab-bottom > .sq-tabs-nav .sq-tabs-label{
        white-space: nowrap;
    }

    .sq-m_tab-right > .sq-tabs-nav,
    .sq-m_tab-bottom > .sq-tabs-nav{
        order: 1;
    }
    /* 图标 */
    .sq-m_tab-icon-right .sq-tabs-nav-item .sq-tabs-icon,
    .sq-m_tab-icon-bottom .sq-tabs-nav-item .sq-tabs-icon{
        order: 1;
    }
}
.sq-buttons {
    --btn-gap: var(--pc-btn-gap, 8px);
    --btn-col: var(--pc-btn-col, 2);
    --btn-height: var(--pc-btn-height, 42px);
    
    --btn-justify: var(--pc-btn-justify, center);
    --btn-icon-gap: var(--pc-btn-icon-gap, 5px);
    --btn-icon-size: var(--pc-btn-icon-size, 20px);
    --btn-icon-color: var(--pc-btn-icon-color, #333);
    --display-icon: var(--pc-display-icon);

    grid-gap: var(--btn-gap);
    display: flex;
    flex-wrap: wrap;
    height: 100%;

    justify-content: var(--btn-justify, center);
}
.sq-buttons > .sq-button,
.sq-buttons > .sq-button .sq-text{
    --text-color-default: var(--in-text-color-default, var(--pc-text-color-default));
    --text-color-hover: var(--in-text-color-hover, var(--pc-text-color-hover));
}
.sq-buttons > .sq-button{
    --btn-color-default: var(--pc-btn-color-default);
    --btn-color-hover: var(--pc-btn-color-hover, var(--pc-btn-color-default));
    --btn-radius: var(--pc-btn-radius);
    --btn-padding: var(--pc-btn-padding, 10px);
    --btn-border: var(--pc-btn-border);
    --btn-shadow: var(--pc-btn-shadow);

    --btn-width: calc((100% - var(--btn-gap) * (var(--btn-col, 2) - 1)) / var(--btn-col, 2));
    --btn-width-auto: var(--pc-btn-width);
    width: var(--btn-width-auto, var(--btn-width));
    height: var(--btn-height, 42px);
    /* color: var(--in-text-color-default, var(--text-color-default)); */
    background: var(--btn-color-default);
    border-radius: var(--btn-radius);
    padding: var(--btn-padding, 10px);
    border: var(--btn-border);
    box-shadow: var(--btn-shadow);
}
.sq-buttons > .sq-button:hover{
    color: var(--i-text-color-hover, var(--text-color-hover));
    background: var(--btn-color-hover);
}
.sq-buttons > .sq-button:hover .sq-text{
    color: var(--i-text-color-hover, var(--text-color-hover));
}
.sq-buttons > .sq-button .sq-button-wp{
    display: flex;
    justify-content: var(--btn-justify, center);
    align-items: center;
    height: 100%;
}

.sq-button-wp{
    gap: var(--btn-icon-gap);
}
.sq-button-wp .sq-icon{
    max-width: var(--btn-icon-size, 20px);
    max-height: var(--btn-icon-size, 20px);
    display: var(--display-icon);
}
/* .sq-button-wp .sq-text{
    flex: 1;
} */
/* .sq-items .sq-item-wp{
    padding: var(--pc-btn-padding);
    border: var(--pc-btn-border);
    border-radius: var(--pc-btn-radius);
    box-shadow: var(--pc-btn-shadow);
    background: var(--pc-btn-color-default);
    gap: var(--pc-btn-gap-wp, 5px);
    transition: all .4s cubic-bezier(.4,.01,.165,.99);
    position: relative;
} */

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

@media screen and (max-width: 640px){
    .sq-buttons{
        --btn-gap: var(--m-btn-gap, var(--pc-btn-gap));
        --btn-col: var(--m-btn-col, var(--pc-btn-col));
        --btn-height: var(--m-btn-height, var(--pc-btn-height));

        --btn-justify: var(--m-btn-justify, var(--pc-btn-justify));
        --btn-icon-gap: var(--m-btn-icon-gap, var(--pc-btn-icon-gap));
        --btn-icon-size: var(--m-btn-icon-size, var(--pc-btn-icon-size));
        --btn-icon-color: var(--m-btn-icon-color, var(--pc-btn-icon-color));
        --display-icon: var(--m-display-icon, var(--pc-display-icon));


    }
    .sq-buttons .sq-button{
        --btn-radius: var(--m-btn-radius, var(--pc-btn-radius));
        --btn-padding: var(--m-btn-padding, var(--pc-btn-padding));
        --btn-border: var(--m-btn-border, var(--pc-btn-border));
        --btn-shadow: var(--m-btn-shadow, var(--pc-btn-shadow));
        
        --btn-color-default: var(--m-btn-color-default, var(--pc-btn-color-default));
        --btn-color-hover: var(--m-btn-color-hover, var(--pc-btn-color-hover));

        --btn-width-auto: var(--m-btn-width, var(--pc-btn-width));
    }
    .sq-buttons > .sq-button,
    .sq-buttons > .sq-button .sq-text{
        --text-color-default: var(--in-text-color-default, var(--m-text-color-default, var(--pc-text-color-default)));
        --text-color-hover: var(--in-text-color-hover, var(--m-text-color-hover, var(--pc-text-color-hover)));
    }
}
.sq-videos{
    border-radius: var(--pc-widget-radius);
    overflow: hidden;
}
.sq-videos video{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.sq-videos-btn{
    --play-icon-size: var(--pc-play-icon-size, 3.5rem);
    --play-icon-color: var(--pc-play-icon-color, #00000083);

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: calc(var(--play-icon-size) * 1rem);
    color: var(--play-icon-color);
    text-shadow: 0 0 10px #ffffff80;
}
.sq-videos-poster{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

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

@media screen and (max-width: 640px){
    .sq-videos-btn{
        --play-icon-size: var(--m-play-icon-size, var(--pc-play-icon-size, 3.5rem));
        --play-icon-color: var(--m-play-icon-color, var(--pc-play-icon-color, #00000083));
    }
}
.sq-widget-multilang{
    --subnav-padding: var(--pc-subnav-padding, 8px 0)
}
.sq-langs,
.sq-widget-multilang .sq-subnav-item-a{
    gap: var(--pc-lang-icon-gap, 8px);
    display: flex;
    align-items: center;
    cursor: pointer;
}
.sq-widget-multilang .sq-icon{
    display: var(--pc-lang-icon-display, none);
    --icon-size: var(--pc-lang-icon-size, 16px)
}
.sq-langs:hover .sq-text{
    color: var(--pc-text-color-hover, var(--pc-text-color-default));
}

.sq-widget-multilang .sq-subnav {
    padding: var(--subnav-padding);
    min-width: var(--pc-subnav-min-width, 120px);
    max-width: var(--pc-subnav-max-width, 300px);
    background: var(--pc-subnav-bg, #ffffff);
    box-shadow: var(--pc-subnav-shadow);
    border-radius: var(--pc-subnav-radius, 4px);
    border: var(--pc-subnav-border, 1px solid #e8e8e8);

    position: absolute;
    right: 0;
    top: 100%;
    visibility: hidden;
    opacity: 0;
    transform: translateY(10px);
    transition: all .4s cubic-bezier(.4,.01,.165,.99);
}
.sq-widget-multilang:hover .sq-subnav{
    z-index: 100;
    visibility: visible;
    opacity: 1;
}
.breadcrumb{
    --font-size: var(--pc-font-size);
    --text-color-default: var(--pc-text-color-default);
    --text-color-hover: var(--pc-text-color-hover);
    --text-color-active: var(--pc-text-color-active);
    --crumb-gap: var(--pc-crumb-gap, 8px);
    --crumb-justify: var(--pc-crumb-justify);
    --crumb-arrow-color: var(--pc-crumb-arrow-color);
    --crumb-arrow-size: var(--pc-crumb-arrow-size);

    margin: 0;
    display: flex;
    align-items: center;
    gap: var(--crumb-gap);
    justify-content: var(--crumb-justify);
    line-height: 1;
}
.breadcrumb-item{
    color: var(--text-color-active, var(--text-color-default));
    font-size: var(--font-size);
}
.breadcrumb-item:hover{
    color: var(--text-color-hover);
}
.breadcrumb-item:last-child,
.breadcrumb-item:last-child:hover{
    color: var(--text-color-default);
}
.breadcrumb-arrow{
    color: var(--crumb-arrow-color, #999);
    font-size: var(--crumb-arrow-size, 14px);
    display: flex;
    align-items: center;
}
@media screen and (max-width: 640px){
    .breadcrumb{
        --font-size: var(--m-font-size, var(--pc-font-size));
        --text-color-default: var(--m-text-color-default, var(--pc-text-color-default));
        --text-color-hover: var(--m-text-color-hover, var(--pc-text-color-hover));
        --crumb-gap: var(--m-crumb-gap, var(--pc-crumb-gap, 8px));
        --crumb-justify: var(--m-crumb-justify, var(--pc-crumb-justify));
        --crumb-arrow-color: var(--m-crumb-arrow-color, var(--pc-crumb-arrow-color));
        --crumb-arrow-size: var(--m-crumb-arrow-size, var(--pc-crumb-arrow-size));
    }
}
.sq-search-form{
    --search-gap: var(--pc-search-gap);
    --search-height: var(--pc-search-height, 36px);
    --search-border-radius: var(--pc-search-border-radius);

    --search-font-size: var(--pc-search-font-size, 14px);
    --search-input-color: var(--pc-search-input-color, #000);

    --search-bar-bg-color: var(--pc-search-bar-bg-color, #0000000a);
    --search-bar-border-radius: var(--pc-search-border-radius);
    --search-bar-border-width: var(--pc-search-border-width, 0);
    --search-bar-border-color: var(--pc-search-border-color, transparent);
    --search-btn-border-radius: var(--pc-search-btn-border-radius);

    border-radius: var(--search-border-radius);
    overflow: hidden;

    height: var(--search-height);
    gap: var(--search-gap);
}
.sq-search-form,
.sq-search-form-bar{
    display: flex;
    flex: 1;
}
.sq-search-form-input{
    flex: 1;
}
.sq-search-form .sq-input,
.sq-search-form .sq-select,
.sq-search-form .sq-btn{
    width: 100%;
    height: 100%;
    border: none;
    background-color: transparent;
    line-height: 1;
    vertical-align: middle;
    padding: 0 10px;
}
.sq-search-form .sq-select{
    border-right: 1px solid #00000018;
}
.sq-search-form .sq-select,
.sq-search-form .sq-input{
    font-size: var(--search-font-size, 14px);
    color: var(--search-input-color, #000);
    min-width: 100px;
}
.sq-search-form-bar{
    --search-input-border: var(--pc-search-input-border, none);
    --search-input-border-l: var(--pc-search-input-border-l, var(--search-input-border));
    --search-input-border-r: var(--pc-search-input-border-r, var(--search-input-border));
    --search-input-border-t: var(--pc-search-input-border-t, var(--search-input-border));
    --search-input-border-b: var(--pc-search-input-border-b, var(--search-input-border));
    border-left: var(--search-input-border-l);
    border-right: var(--search-input-border-r);
    border-top: var(--search-input-border-t);
    border-bottom: var(--search-input-border-b);
    
    border-radius: var(--search-bar-border-radius);
    background-color: var(--search-bar-bg-color);

    /* 无间隔时，右边框圆角0 */
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}
.sq-search-form-btn{
    --search-btn-border: var(--pc-search-btn-border, none);
    --search-btn-border-l: var(--pc-search-btn-border-l, var(--search-btn-border));
    --search-btn-border-r: var(--pc-search-btn-border-r, var(--search-btn-border));
    --search-btn-border-t: var(--pc-search-btn-border-t, var(--search-btn-border));
    --search-btn-border-b: var(--pc-search-btn-border-b, var(--search-btn-border));
    border-left: var(--search-btn-border-l);
    border-right: var(--search-btn-border-r);
    border-top: var(--search-btn-border-t);
    border-bottom: var(--search-btn-border-b);

    --search-btn-color: var(--pc-search-btn-color, #333);
    --search-btn-bg-color: var(--pc-search-btn-bg-default, var(--primary-color, #007aff));
    --search-btn-font-size: var(--pc-search-btn-font-size, 14px);
    --search-btn-radius: var(--pc-search-btn-radius);

    border-radius: var(--search-btn-radius, 0);
    background-color: var(--search-btn-bg-color);
    color: var(--search-btn-color);
    font-size: var(--search-btn-font-size, 14px);
    margin-left: -1px;
}
.sq-search-form .sq-btn{
    padding: 0 16px;
    font-size: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 如果开启间隔 */
.sq-search-form.is-gap {
    border-radius:0
}
.sq-search-form.is-gap .sq-search-form-bar{
    border-radius: var(--search-bar-border-radius);
}

/* 标签 */
.sq-search-tags{
    --tags-title-font-size: var(--pc-tags-title-font-size, 14px);
    --tags-title-font-weight: var(--pc-tags-title-font-weight);
    --tags-title-color: var(--pc-tags-title-color, #000);

    /* tag */
    --tags-list-gap: var(--pc-tags-list-gap, 8px);
    --tags-font-size: var(--pc-tags-font-size, 12px);
    --tags-font-weight: var(--pc-tags-font-weight);
    --tags-color: var(--pc-tags-color-default, #666);
    --tags-bg-color: var(--pc-tags-bg-color-default, #f5f5f5);
    --tags-border-radius: var(--pc-tags-border-radius);

    margin-top: var(--tags-margin-top, 16px);
}
.sq-search-tags-title{
    font-size: var(--tags-title-font-size);
    font-weight: var(--tags-title-font-weight);
    color: var(--tags-title-color);
    margin-bottom: 8px;
}
.sq-search-tags-list{
    display: flex;
    flex-wrap: wrap;
    gap: var(--tags-list-gap, 8px);
}
.sq-search-tag{
    display: inline-block;
    padding: 4px 12px;
    font-size: var(--tags-font-size, 12px);
    font-weight: var(--tags-font-weight);
    color: var(--tags-color, #666);
    border-radius: var(--tags-border-radius, 30px);
    background-color: var(--tags-bg-color, #f5f5f5);
    margin-bottom: 8px;
}
.sq-search-tag.active{
    --tags-color: var(--tags-color-active, #fff);
    --tags-bg-color: var(--tags-bg-color-active, #007aff);
}

/* 移动端 */
@media only screen and (max-width: 768px) {
   .sq-search-form{
        --search-gap: var(--m-search-gap, var(--pc-search-gap));
        --search-height: var(--m-search-height, var(--pc-search-height, 36px));
        --search-border-radius: var(--m-search-border-radius);

        --search-font-size: var(--m-search-font-size, var(--pc-search-font-size, 14px));
        --search-input-color: var(--m-search-input-color, var(--pc-search-input-color, #000));

        --search-bar-bg-color: var(--m-search-bar-bg-color, #0000000a);
        --search-bar-border-radius: var(--m-search-border-radius);
        --search-bar-border-width: var(--m-search-border-width, 0);
        --search-bar-border-color: var(--m-search-border-color, transparent);

        --search-btn-border-radius: var(--m-search-btn-border-radius);
    }

    .sq-search-form-bar{
        --search-input-border: var(--m-search-input-border, var(--pc-search-input-border, none));
        --search-input-border-l: var(--m-search-input-border-l, var(--search-input-border));
        --search-input-border-r: var(--m-search-input-border-r, var(--search-input-border));
        --search-input-border-t: var(--m-search-input-border-t, var(--search-input-border));
        --search-input-border-b: var(--m-search-input-border-b, var(--search-input-border));
    }

    .sq-search-form-btn{
        --search-btn-border: var(--m-search-btn-border, var(--pc-search-btn-border, none));
        --search-btn-border-l: var(--m-search-btn-border-l, var(--search-btn-border));
        --search-btn-border-r: var(--m-search-btn-border-r, var(--search-btn-border));
        --search-btn-border-t: var(--m-search-btn-border-t, var(--search-btn-border));
        --search-btn-border-b: var(--m-search-btn-border-b, var(--search-btn-border));

        --search-btn-color: var(--m-search-btn-color, var(--pc-search-btn-color, #333));
        --search-btn-bg-color: var(--m-search-btn-bg-default, var(--pc-search-btn-bg-default, #007aff));
        --search-btn-font-size: var(--m-search-btn-font-size, var(--pc-search-btn-font-size));
        --search-btn-radius: var(--m-search-btn-radius, var(--pc-search-btn-radius));
    }

    .sq-search-tags{
        --tags-title-font-size: var(--m-tags-title-font-size, var(--pc-tags-title-font-size, 14px));
        --tags-title-font-weight: var(--m-tags-title-font-weight, var(--pc-tags-title-font-weight));
        --tags-title-color: var(--m-tags-title-color, var(--pc-tags-title-color, #000));
        --tags-list-gap: var(--m-tags-list-gap, var(--pc-tags-list-gap, #888));
        --tags-font-size: var(--m-tags-font-size, var(--pc-tags-font-size, 12px));
        --tags-font-weight: var(--m-tags-font-weight, var(--pc-tags-font-weight));
        --tags-color: var(--m-tags-color-default, var(--pc-tags-color-default, #666));
        --tags-bg-color: var(--m-tags-bg-color-default, var(--pc-tags-bg-color-default, #f5f5f5));
        --tags-border-radius: var(--m-tags-border-radius, var(--pc-tags-border-radius, 10px));
    }
    .sq-search-tag.active{
        --tags-color: var(--m-tags-color-active, var(--pc-tags-color-active, #fff));
        --tags-bg-color: var(--m-tags-bg-color-active, var(--pc-tags-bg-color-active, #007aff));
    }
}
.sq-widget-forms{
    --input-padding: var(--pc-input-padding, 4px 10px);
    --input-radius: var(--pc-input-radius, 4px);
    --input-font-size: var(--pc-input-font-size, 14px);
    --input-color: var(--pc-input-color, rgba(0, 0, 0, 0.88));
    --input-font-family: var(--pc-input-font-family, -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol','Noto Color Emoji');

    --form-item-gap: var(--pc-form-item-gap, 12px);
    --form-item-direction: var(--pc-form-item-direction, column);
}

.sq-forms{
    --form-direction: var(--pc-form-direction, column);
    --form-gap: var(--pc-form-gap, 10px);
    --form-label-display: var(--pc-form-label-display);
    --form-label-color: var(--pc-form-label-color, rgba(0, 0, 0, 0.54));
    --form-label-width: var(--pc-form-label-width, 100px);

    --form-label-align: var(--pc-form-label-align, left);
    --form-label-justify: var(--pc-form-label-justify, flex-start);

    --input-bg-color: var(--pc-input-bg-color-default, #fff);

    --input-border: var(--pc-input-border);
    --input-border-l: var(--pc-input-border-l, var(--input-border));
    --input-border-r: var(--pc-input-border-r, var(--input-border));
    --input-border-t: var(--pc-input-border-t, var(--input-border));
    --input-border-b: var(--pc-input-border-b, var(--input-border));

    --input-color: var(--pc-input-color-default, rgba(0, 0, 0, 0.88));

    display: flex;
    flex-direction: var(--form-direction);
    gap: var(--form-gap);
}
.sq-form-item{
    display: flex;
    flex-direction: var(--form-item-direction);
    gap: var(--form-item-gap);
}

.sq-form-label{
    position: relative;
    align-items: var(--form-label-align);
    justify-content: var(--form-label-justify);
    max-width: 100%;
    min-width: var(--form-label-width);
    height: 32px;
    color: var(--form-label-color);
    font-size: 14px;
    display: var(--form-label-display, inline-flex);
}
.sq-required-label{
    color: red;
}
[data-required="0"] .sq-required-label{
    display: none;
}

.sq-form-control{
    flex: 1;
}

.sq-input,
.sq-textarea,
.layui-input, .layui-select, .layui-textarea{
    box-sizing: border-box;
    margin: 0;
    display: inline-block;
    width: 100%;
    padding: var(--input-padding);
    color: var(--input-color);
    font-size: var(--input-font-size);
    line-height: 1.5714285714285714;
    font-family: var(--input-font-family);
    border-radius: var(--input-radius);
    transition: all 0.2s;

    outline: 0;

    border: var(--input-border) !important;
    border-left: var(--input-border-l);
    border-right: var(--input-border-r);
    border-top: var(--input-border-t);
    border-bottom: var(--input-border-b);

    background: var(--input-bg-color);

    height: auto;
}
.sq-input:hover,
.sq-textarea:hover,
.layui-input:hover, .layui-select:hover, .layui-textarea:hover{
    --input-color: var(--pc-input-color-hover, var(--pc-input-color-default)) !important;
    --input-border: var(--pc-input-border) !important;
    /* --input-border-color: var(--pc-input-border-color-hover, var(--pc-input-border-color-default)); */
    --input-bg-color: var(--pc-input-bg-color-hover, var(--input-bg-color-default));
}
.sq-input:focus,
.sq-textarea:focus,
.layui-input:focus, .layui-select:focus, .layui-textarea:focus{
    --input-color: var(--pc-input-color-active, var(--pc-input-color-default)) !important;
    border-color: var(--pc-input-border, var(--pc-input-color-active)) !important;
    /* --input-border-color: var(--pc-input-border-color-active, var(--pc-input-border-color-default)); */
    --input-bg-color: var(--pc-input-bg-color-active, var(--input-bg-color-default));
}

.layui-form-select dl dd.layui-this{
    color:var(--select-option-color, #000000c9) !important;
}


.sq-select{
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.sq-select:not(.is-active) .sq-dropdown-label{
    color: var(--select-label-color, rgba(0, 0, 0, 0.5));
}
.sq-select .sq-dropdown-label{
    cursor: pointer;
}
.sq-select .sq-select-value{
    cursor: pointer;
    opacity: 0;
}
.sq-select.is-active .sq-dropdown-label{
    display: none;
}
.sq-input-clear{
    
    width: 14px;
    height: 14px;
    display: none;
    cursor: pointer;
}
.sq-input-clear:before,
.sq-input-clear:after{
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 2px;
    border-radius: 5px;
    background-color: var(--input-color);
    
}
.sq-input-clear:before{
    transform: translate(-50%, -50%) rotate(45deg);
}
.sq-input-clear:after{
    transform: translate(-50%, -50%) rotate(-45deg);
}
.sq-select.is-active .sq-input-clear{
    display: block;
}
.sq-select.is-active .sq-input-arrow{
    display: none;
}
.sq-select-arrow{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    height: 14px;
    cursor: pointer;
    z-index: 20;
}

.sq-select-item{
    display: flex;
    gap: 8px;
    align-items: center;
    --icon-size: 16px;
}
.sq-select-item .sq-icon{
    display: flex;
}
.sq-dropdown-panel{
    max-height: var(--dropdown-max-height, 200px);
    overflow-y: auto;
    /* 一直显示滚动条 */
    scrollbar-color: var(--dropdown-scrollbar-color, #00000088) transparent;
}
.sq-country-input{
    position: absolute;
    border: none;
    width: 100%;
    height: inherit;
    z-index: 11;
    background: transparent;
    box-shadow: none;
}
.sq-country-input:focus{
    outline: 0;
}

@media screen and (max-width: 640px){
    .sq-widget-forms{
        --input-padding: var(--m-input-padding, 4px 10px);
        --input-radius: var(--m-input-radius, 4px);
        --input-font-size: var(--m-input-font-size, 14px);
        --input-color: var(--m-input-color, rgba(0, 0, 0, 0.88));
        
        --input-font-family: var(--m-input-font-family, -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol','Noto Color Emoji');
        --form-item-gap: var(--m-form-item-gap, 12px);
        --form-item-direction: var(--m-form-item-direction, column);
    }
    .sq-forms{
        --form-direction: var(--m-form-direction, column);
        --form-gap: var(--m-form-gap, 10px);
        --form-label-display: var(--m-form-label-display);
        --form-label-color: var(--m-form-label-color, rgba(0, 0, 0, 0.54));
        --form-label-width: var(--m-form-label-width, 100px);
        --form-label-align: var(--m-form-label-align, left);
        --form-label-justify: var(--m-form-label-justify, flex-start);
        --input-bg-color: var(--m-input-bg-color-default, #fff);
        --input-border: var(--m-input-border);
        --input-border-l: var(--m-input-border-l, var(--input-border));
        --input-border-r: var(--m-input-border-r, var(--input-border));
        --input-border-t: var(--m-input-border-t, var(--input-border));
        --input-border-b: var(--m-input-border-b, var(--input-border));
        --input-color: var(--m-input-color-default, rgba(0, 0, 0, 0.88));
    }
    .sq-input:hover,
    .sq-textarea:hover,
    .layui-input:hover, .layui-select:hover, .layui-textarea:hover{
        --input-color: var(--m-input-color-hover, var(--pc-input-color-hover)) !important;
        --input-border: var(--m-input-border) !important;
        --input-bg-color: var(--m-input-bg-color-hover, var(--pc-input-bg-color-hover));
    }
    .sq-input:focus,
    .sq-textarea:focus,
    .layui-input:focus, .layui-select:focus, .layui-textarea:focus{
        --input-color: var(--m-input-color-active, var(--pc-input-color-active)) !important;
        border-color: var(--m-input-border, var(--pc-input-color-active)) !important;
        --input-bg-color: var(--m-input-bg-color-active, var(--pc-input-bg-color-active));
    }
    .sq-select{
        --select-label-color: var(--m-select-label-color, var(--pc-select-label-color));
    }
}
.sq-modal.layui-layer{
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0;
    padding: 0;
    margin: 0;
}
.sq-modal .layui-layer-setwin{
    z-index: 10;
}
.layui-layer-shade{
    backdrop-filter: blur(8px);
    background-color: transparent !important;
    opacity: 1 !important;
}
/* 组件样式 */