/* 栅格系统 */
.grid-row {
    display: flex;
    flex-direction: row;
    width: 100%;
    box-sizing: border-box;
    border: none;
    margin: 0 -10px ;
}

.grid-col {
    overflow: hidden; padding: 15px 10px;
    box-sizing: border-box;
}

.grid-col-1 {
    width: 100%;
}

.grid-col-2 {
    width: 50%;
}

.grid-col-3 {
    width: 33.33333333%;
}

.grid-col-4 {
    width: 25%;
}

.grid-col-5 {
    width: 20%;
}

.grid-col-6 {
    width: 16.66666667%;
}

@media screen and (max-width: 768px) {
    .grid-row {
        display: block;
        margin: 15px 0 0;
    }

    .grid-col {
        width: 100%; padding: 0;
    }

    .grid-col + .grid-col {
        margin-top: 15px;
        padding: 0;
    }

}

/* 链接 */
.link-wrapper {
    display: inline-block;
    box-sizing: border-box;
    border: none;
    overflow: hidden;
    --width: 190px;
    --font-size: 18px;
    --font-color: #ffffff;
    --font-weight: 400;
    --hover-opacity: 0.85;
    --background-color: #159eed;
    --border-radius: 3;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --padding-top: 10;
    --padding-bottom: 10;
    --padding-left: 10;
    --padding-right: 10;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.link-container {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-sizing: border-box;
    line-height: 1;
    width: var(--width);
    font-weight: var(--font-weight);
    font-size: var(--font-size);
    color: var(--font-color) !important;
    background-color: var(--background-color);
    border-radius: var(--border-radius);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
}

.link-container:hover {
    opacity: var(--hover-opacity);
}

/* 图片 */
.image-wrapper {
    display: block;
    width: 100%;
    border: none;
    --background-color: #ffffff;
    --border-width: 0;
    --border-color: #159eed;
    --border-radius: 3px;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --padding-top: 10;
    --padding-bottom: 10;
    --padding-left: 10;
    --padding-right: 10;
    --box-shadow-offset-x: 0;
    --box-shadow-offset-y: 0;
    --box-shadow-blur-radius: 0;
    --box-shadow-spread-radius: 0;
    --box-shadow-opacity: 0;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.image-container {
    display: block;
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    background-color: var(--background-color);
    border: var(--border-width) solid var(--border-color);
    border-radius: var(--border-radius);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
    box-shadow: var(--box-shadow-offset-x) var(--box-shadow-offset-y) var(--box-shadow-blur-radius) var(--box-shadow-spread-radius) rgba(0, 0, 0, var(--box-shadow-opacity));
}

.image-container > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--border-radius);
}

/* Iframe嵌入 */
.iframe-wrapper {
    display: block;
    width: 100%;
    border: none;
    height: auto;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.iframe-container {
    width: 100%;
    height: auto;
    margin: 0;
    border: none;
}

.iframe-container > span {
    display: block;
    width: 100%;
    height: 100%;
}

.iframe-container iframe {
    width: 100%;
    border: 0;
}
@media screen and (max-width: 768px) {
    .iframe-container iframe{
        height: 250px;
    }
}
/* 左右图文 */
.zypictxt-wrapper {
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --flex-direction: row;
    --background-color: #ffffff;
    --text-background-hover-color: #ffffff;
    --border-width: 1px;
    --border-color: #ebebeb;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --padding-top: 0;
    --padding-bottom: 0;
    --padding-left: 0;
    --padding-right: 0;
    --image-width: 40%;
    --image-border-radius: 0;
    --image-padding-top: 0;
    --image-padding-bottom: 0;
    --image-padding-left: 0;
    --image-padding-right: 0;
    --text-width: 60%;
    --text-padding-top: 0;
    --text-padding-bottom: 0;
    --text-padding-left: 10;
    --text-padding-right: 10;
    --text-title-size: 18px;
    --text-title-weight: 600;
    --text-title-color: #ffffff;
    --text-title-hover-color: #ffffff;
    --text-title-line-height: 1.5;
    --text-title-padding-bottom: 0;
    --text-description-size: 16px;
    --text-description-color: #ffffff;
    --text-description-line-height: 1.5;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.zybox-container {
    display: flex;
    justify-content: space-between;
    flex-direction: var(--flex-direction);
    box-sizing: border-box;
    width: 100%;
    border: var(--border-width) solid var(--border-color);
    background-color: var(--background-color);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
}

.zybox-container:hover {
    background-color: var(--text-background-hover-color) !important;
}

.left-image {
    box-sizing: border-box;
    overflow: hidden;
    width: var(--image-width);
    border-radius: var(--image-border-radius);
    padding: var(--image-padding-top) var(--image-padding-right) var(--image-padding-bottom) var(--image-padding-left);
}

.left-image > img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.right-text {
    box-sizing: border-box;
    width: var(--text-width);
    padding: var(--text-padding-top) var(--text-padding-right) var(--text-padding-bottom) var(--text-padding-left);
}

.right-text-title {
    padding-bottom: var(--text-title-padding-bottom);
}

.right-text-title * {
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
    margin: 0;
    white-space: normal;
}

.zybox-container:hover .right-text-title * {
    color: var(--text-title-hover-color);
}

.right-text-description * {
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
    margin: 0;
    white-space: normal;
}

@media screen and (max-width: 768px) {
    .zybox-container {
        display: block;
    }
    .left-image{ width: 100% !important;}

    .right-text {
        padding: 10px 0!important; width: 100% !important;
    }
    .right-text-title *{ font-size: 18px !important;}
    .right-text-description *{ font-size: 17px !important;}
}

/* 上下图文 */
.tbpictxt-wrapper { 
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --flex-direction: column;
    --background-color: #ffffff;
    --background-hover-color: #ffffff;
    --border-width: 1px;
    --border-color: #ebebeb;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --padding-top: 0;
    --padding-bottom: 0;
    --padding-left: 0;
    --padding-right: 0;
    --image-border-radius: 0;
    --text-padding-top: 0;
    --text-padding-bottom: 0;
    --text-padding-left: 10;
    --text-padding-right: 10;
    --text-title-size: 18px;
    --text-title-weight: 600;
    --text-title-color: #ffffff;
    --text-title-line-height: 1.5;
    --text-title-padding-bottom: 0;
    --text-description-size: 16px;
    --text-description-color: #ffffff;
    --text-description-line-height: 1.5;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.tbpictxt-container {
    display: flex;
    flex-direction: var(--flex-direction);
    justify-content: space-between;
    box-sizing: border-box;
    width: 100%;
    background-color: var(--background-color);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
    border: var(--border-width) solid var(--border-color);
}

.tbpictxt-container:hover {
    background-color: var(--background-hover-color) !important;
}

.tbpictxt-image {
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: var(--image-border-radius);
}

.tbpictxt-image > img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.tbpictxt-text {
    width: 100%;
    box-sizing: border-box;
    padding: var(--text-padding-top) var(--text-padding-right) var(--text-padding-bottom) var(--text-padding-left);
}

.tbpictxt-title * {
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
    margin: 0;
    white-space: normal;
}

.tbpictxt-description * {
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
    margin: 0;
    white-space: normal;
}
@media screen and (max-width: 768px) {
    .tbpictxt-title *{ font-size:18px !important;}
    .tbpictxt-description *{ font-size: 17px !important;}
}

/* 底图上文 */
.bottpictxt-wrapper { 
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --border-radius: 0;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --text-background-color: #000000;
    --text-padding-top: 0;
    --text-padding-bottom: 0;
    --text-padding-left: 10;
    --text-padding-right: 10;
    --text-title-size: 18px;
    --text-title-weight: 600;
    --text-title-color: #ffffff;
    --text-title-line-height: 1.5;
    --text-title-padding-bottom: 0;
    --text-description-size: 16px;
    --text-description-color: #ffffff;
    --text-description-line-height: 1.5;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.bottpictxt-container {
    box-sizing: border-box;
    width: 100%;
    position: relative;
    overflow: hidden;
    border: none;
    border-radius: var(--border-radius);
}

.bottpictxt-image {
    display: block;
    width: 100%;
    height: auto;
    position: relative;
    z-index: 1;
}

.bottpictxt-image > img {
    display: block;
    width: 100%;
    height: auto;
}

.bottpictxt-text {
    display: block;
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    box-sizing: border-box;
    background: linear-gradient(transparent, var(--text-background-color));
    padding: var(--text-padding-top) var(--text-padding-right) var(--text-padding-bottom) var(--text-padding-left);
}

.bottpictxt-text-title * {
    margin: 0;
    white-space: normal;
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
}

.bottpictxt-text-description * {
    margin: 0;
    white-space: normal;
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
}
@media screen and (max-width: 768px) {
    .bottpictxt-text-title *{ font-size: 18px;}
    .bottpictxt-text{ position: static; background: none; margin-top: 6px; padding: 0;}
    .bottpictxt-wrapper,.bottpictxt-text-title *,.bottpictxt-text-description *{ color: #333 !important;}
}

/* 图文手风琴 */
.akordeon-wrapper {
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --height: 200px;
    --item-border-left-width: 2px;
    --item-transition-duration: 100ms;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --text-padding-top: 0;
    --text-padding-bottom: 0;
    --text-padding-left: 10;
    --text-padding-right: 10;
    --text-background-linear-gradient-color: #000000;
    --text-title-display: none;
    --text-title-size: 16px;
    --text-title-weight: 600;
    --text-title-color: #ffffff;
    --text-title-line-height: 1.2;
    --text-title-padding-bottom: 0;
    --text-description-size: 14px;
    --text-description-color: #ffffff;
    --text-description-line-height: 1.2;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.akordeon-container {
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    height: var(--height);
}

.akordeon-item {
    width: 33.33333333%;
    height: 100%;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    float: left;
    transition-duration: var(--item-transition-duration);
}

.akordeon-item + .akordeon-item {
    border-left-width: var(--item-border-left-width);
    border-left-style: solid;
    border-left-color: #ffffff;
}

.akordeon-item-image {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.akordeon-item-image > img {
    display: block;
    width: auto;
    height: 100%;
    object-fit: cover;
}

.akordeon-item-text {
    display: block;
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    box-sizing: border-box;
    overflow: hidden;
    padding: var(--text-padding-top) var(--text-padding-right) var(--text-padding-bottom) var(--text-padding-left);
}

.akordeon-item.active .akordeon-item-text {
    background: linear-gradient(transparent, var(--text-background-linear-gradient-color));
}

.akordeon-item-text-title {
    display: var(--text-title-display);
    padding-bottom: var(--text-title-padding-bottom);
}

.akordeon-item.active .akordeon-item-text-title {
    display: block;
}

.akordeon-item-text-title * {
    margin: 0;
    white-space: normal;
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
}

.akordeon-item-text-description {
    display: none;
}

.akordeon-item.active .akordeon-item-text-description {
    display: block;
}

.akordeon-item-text-description * {
    margin: 0;
    white-space: normal;
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
}
@media screen and (max-width: 768px) {
    .akordeon-container{ height: auto;}
    .akordeon-item{ width: 100% !important; height: 250px; margin-bottom: 6px;}
    .akordeon-item + .akordeon-item{ border:none}
    .akordeon-item-text-title *{ font-size: 18px;}
    .akordeon-item-text-description *{ font-size: 17px !important; margin-bottom: 0 !important;}
    .akordeon-item-text-description{ display: block !important;}
}

/* 图标文本 */
.icon-wrapper { 
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --flex-direction: column;
    --background-color: #ffffff;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --padding-top: 0;
    --padding-bottom: 0;
    --padding-left: 0;
    --padding-right: 0;
    --border-width: 1px;
    --border-color: #ebebeb;
    --border-radius: 0;
    --image-align: center;
    --image-width: 60px;
    --image-padding-top: 0;
    --image-padding-bottom: 0;
    --image-padding-left: 0;
    --image-padding-right: 10;
    --image-border-radius: 0px;
    --image-background-color: transparent;
    --text-align: left;
    --text-padding-top: 0;
    --text-padding-bottom: 0;
    --text-padding-left: 10;
    --text-padding-right: 10;
    --text-title-size: 16px;
    --text-title-weight: 600;
    --text-title-color: #ffffff;
    --text-title-line-height: 1.2;
    --text-title-padding-bottom: 0;
    --text-description-size: 14px;
    --text-description-color: #ffffff;
    --text-description-line-height: 1.2;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.icon-container { 
    display: flex;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
    flex-direction: var(--flex-direction);
    border: var(--border-width) solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--background-color);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
}

.icon-image {
    display: flex;
    flex-direction: row;
    align-items: var(--image-align);
    justify-content: var(--image-align);
    box-sizing: border-box;
    overflow: hidden;
    min-width: calc(var(--image-width) + var(--image-padding-left) + var(--image-padding-right));
    padding: var(--image-padding-top) var(--image-padding-right) var(--image-padding-bottom) var(--image-padding-left);
}

.icon-image > img {
    display: block;
    width: var(--image-width);
    height: var(--image-width);
    min-width: var(--image-width);
    background-color: var(--image-background-color);
    border-radius: var(--image-border-radius);
    padding: var(--image-padding);
}

.icon-text {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    overflow: hidden;
    padding: var(--text-padding-top) var(--text-padding-right) var(--text-padding-bottom) var(--text-padding-left);
}

.icon-text-title {
    padding-bottom: var(--text-title-padding-bottom);
}

.icon-text-title * {
    margin: 0;
    white-space: normal;
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
    text-align: var(--text-align);
}

.icon-text-description * {
    margin: 0;
    white-space: normal;
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
    text-align: var(--text-align);
}
@media screen and (max-width: 768px) { 
    .icon-text-title *{ font-size: 18px;}
}

/* 折叠手风琴 */
.fold-wrapper {
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --item-transition-duration: 600ms;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --image-width: 36px;
    --image-position-left: 10px;
    --text-title-padding-top: 0;
    --text-title-padding-bottom: 0;
    --text-title-padding-left: 10;
    --text-title-padding-right: 10;
    --text-title-size: 16px;
    --text-title-weight: 600;
    --text-title-color: #333333;
    --text-title-line-height: 1.2;
    --text-title-hover-color: #333333;
    --text-title-border-bottom-width: 2px;
    --text-title-border-bottom-color: #c0c0c0;
    --text-description-padding-top: 0;
    --text-description-padding-bottom: 0;
    --text-description-padding-left: 10;
    --text-description-padding-right: 10;
    --text-description-size: 14px;
    --text-description-color: #555555;
    --text-description-line-height: 1.2;
    --text-description-border-bottom-width: 2px;
    --text-description-border-bottom-color: #c0c0c0;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.fold-container {
    width: 100%;
    border: none;
    box-sizing: border-box;
}

.fold-item { 
    background-color: #ffffff;
}

.fold-item-title { 
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;
    background-color: #ffffff;
    border-bottom: var(--text-title-border-bottom-width) solid var(--text-title-border-bottom-color);
    padding: var(--text-title-padding-top) var(--text-title-padding-right) var(--text-title-padding-bottom) var(--text-title-padding-left);
}

.fold-item-title-icon { 
    width: var(--image-width);
    height: var(--image-width);
    position: absolute;
    top: 50%;
    left: var(--image-position-left);
    margin-top: calc(var(--image-width)/-2);
}

.fold-item-title-icon > img {
    display: block;
    width: var(--image-width);
    height: var(--image-width);
}

.fold-item-title-text * {
    margin: 0;
    white-space: wrap;
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
}

.fold-item-title:hover .fold-item-title-text * {
    color: var(--text-title-hover-color);
}

.fold-item-content { 
    height: 0px;
    background-color: #ffffff;
    transition-duration: var(--item-transition-duration);
    overflow: hidden;
}

.fold-item-content-text { 
    box-sizing: border-box;
    padding: 20px 50px;
    overflow: hidden;
    border-bottom: var(--text-description-border-bottom-width) solid var(--text-description-border-bottom-color);
    padding: var(--text-description-padding-top) var(--text-description-padding-right) var(--text-description-padding-bottom) var(--text-description-padding-left);
}

.fold-item:last-child .fold-item-content-text { 
    border-bottom: none;
}

.fold-item-content-text * {
    margin: 0;
    white-space: normal;
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
}
@media screen and (max-width: 768px) {
    .fold-item-title-text *{ font-size: 18px;}
    .fold-item-content-text{ padding:12px 0 0; }
}

/* 一排两列 */
.two-column-wrapper {
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --gutter-width: 10px;
    --background-color: #ffffff;
    --border-width: 0;
    --border-color: #ebebeb;
    --padding-top: 0;
    --padding-bottom: 0;
    --padding-left: 0;
    --padding-right: 0;
    --image-border-radius: 0;
    --text-padding-top: 0;
    --text-padding-bottom: 0;
    --text-padding-left: 10;
    --text-padding-right: 10;
    --text-title-size: 18px;
    --text-title-weight: 600;
    --text-title-color: #333333;
    --text-title-line-height: 1.5;
    --text-title-padding-bottom: 0;
    --text-description-size: 16px;
    --text-description-color: #333333;
    --text-description-line-height: 1.5;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.two-column-row {
    gap: var(--gutter-width);
}

.two-column-container {
    width: 100%;
    box-sizing: border-box;
    background-color: var(--background-color);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
    border: var(--border-width) solid var(--border-color);
}

.two-column-image {
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: var(--image-border-radius);
}

.two-column-image > img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.two-column-text {
    width: 100%;
    box-sizing: border-box;
    padding: var(--text-padding-top) var(--text-padding-right) var(--text-padding-bottom) var(--text-padding-left);
}

.two-column-text-title {
    padding-bottom: var(--text-title-padding-bottom);
}

.two-column-text-title * {
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
    margin: 0;
    white-space: normal;
}

.two-column-text-description * {
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
    margin: 0;
    white-space: normal;
}

@media screen and (max-width: 768px) {
    .two-column-item {
        padding: 0;
    }
    .two-column-text-title *{ font-size: 18px;}
    .two-column-text-description *{ margin-bottom: 0 !important; font-size: 17px;}
}

/* 一排三列 */
.three-column-wrapper {
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --gutter-width: 10px;
    --background-color: #ffffff;
    --border-width: 0;
    --border-color: #ebebeb;
    --padding-top: 0;
    --padding-bottom: 0;
    --padding-left: 0;
    --padding-right: 0;
    --image-border-radius: 0;
    --text-padding-top: 0;
    --text-padding-bottom: 0;
    --text-padding-left: 10;
    --text-padding-right: 10;
    --text-title-size: 18px;
    --text-title-weight: 600;
    --text-title-color: #333333;
    --text-title-line-height: 1.5;
    --text-title-padding-bottom: 0;
    --text-description-size: 16px;
    --text-description-color: #333333;
    --text-description-line-height: 1.5;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.three-column-row {
    gap: var(--gutter-width);
}

.three-column-container {
    width: 100%;
    box-sizing: border-box;
    background-color: var(--background-color);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
    border: var(--border-width) solid var(--border-color);
}

.three-column-image {
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: var(--image-border-radius);
}

.three-column-image > img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.three-column-text {
    width: 100%;
    box-sizing: border-box;
    padding: var(--text-padding-top) var(--text-padding-right) var(--text-padding-bottom) var(--text-padding-left);
}

.three-column-text-title {
    padding-bottom: var(--text-title-padding-bottom);
}

.three-column-text-title * {
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
    margin: 0;
    white-space: normal;
}

.three-column-text-description * {
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
    margin: 0;
    white-space: normal;
}

@media screen and (max-width: 768px) {
    .three-column-item {
        padding: 0;
    }
    .three-column-text-title *{ font-size:18px;}
    .three-column-text-description *{ margin-bottom: 0 !important; font-size: 17px;}
}

/* 一排四列 */
.four-column-wrapper {
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: none;
    --margin-top: 0;
    --margin-bottom: 0;
    --margin-left: 0;
    --margin-right: 0;
    --gutter-width: 10px;
    --background-color: #ffffff;
    --border-width: 0;
    --border-color: #ebebeb;
    --padding-top: 0;
    --padding-bottom: 0;
    --padding-left: 0;
    --padding-right: 0;
    --image-border-radius: 0;
    --text-padding-top: 0;
    --text-padding-bottom: 0;
    --text-padding-left: 10;
    --text-padding-right: 10;
    --text-title-size: 18px;
    --text-title-weight: 600;
    --text-title-color: #333333;
    --text-title-line-height: 1.5;
    --text-title-padding-bottom: 0;
    --text-description-size: 16px;
    --text-description-color: #333333;
    --text-description-line-height: 1.5;
    padding: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
}

.four-column-row {
    gap: var(--gutter-width);
}

.four-column-container {
    width: 100%;
    box-sizing: border-box;
    background-color: var(--background-color);
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
    border: var(--border-width) solid var(--border-color);
}

.four-column-image {
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: var(--image-border-radius);
}

.four-column-image > img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.four-column-text {
    width: 100%;
    box-sizing: border-box;
    padding: var(--text-padding-top) var(--text-padding-right) var(--text-padding-bottom) var(--text-padding-left);
}

.four-column-text-title {
    padding-bottom: var(--text-title-padding-bottom);
}

.four-column-text-title * {
    color: var(--text-title-color);
    font-size: var(--text-title-size);
    font-weight: var(--text-title-weight);
    line-height: var(--text-title-line-height);
    margin: 0;
    white-space: normal;
}

.four-column-text-description * {
    color: var(--text-description-color);
    font-size: var(--text-description-size);
    line-height: var(--text-description-line-height);
    margin: 0;
    white-space: normal;
}

@media screen and (max-width: 768px) {
    .four-column-item {
        padding: 0;
    }
    .four-column-text-title *{ font-size: 18px;}
    .four-column-text-description *{ margin-bottom: 0 !important; font-size: 17px;}
}