/*-- 折扣碼商品格子區 .pro-coupon --*/

.pro-coupon {}

.rowline.pro-coupon>div {
    margin-bottom: 1.5rem;
}

@media screen and (max-width:1199px) {
    .rowline.pro-coupon>div {
        padding-left: 0.6rem;
        padding-right: 0.6rem;
    }
}

@media screen and (max-width:991px) {
    .rowline.pro-coupon>div {
        padding-left: 0.4rem;
        padding-right: 0.4rem;
    }
}

@media screen and (max-width:767px) {
    .rowline.pro-coupon>div {
        padding-left: 0.3rem;
        padding-right: 0.3rem;
    }
}

div[class^='rowline pro-']>div {
    margin-bottom: 1.5rem;
}

div[class^='rowline pro-']>div.col-md-3 {
    padding-left: 0.6rem;
    padding-right: 0.6rem;
}

@media screen and (min-width:992px) {
    div[class^='rowline pro-']>div.col-lg-3 {
        padding-left: 0.6rem;
        padding-right: 0.6rem;
    }

    div[class^='rowline pro-']>div.col-lg-3 .sale_info>h4 {
        font-size: 1.35rem;
    }
}

@media screen and (max-width:1199px) {
    div[class^='rowline pro-']>div {
        padding-left: 0.6rem;
        padding-right: 0.6rem;
    }
}

@media screen and (max-width:991px) {
    div[class^='rowline pro-']>div {
        padding-left: 0.4rem;
        padding-right: 0.4rem;
    }
}

@media screen and (max-width:767px) {
    div[class^='rowline pro-']>div {
        padding-left: 0.3rem;
        padding-right: 0.3rem;
    }
}


.sale_box {
    color: var(--com-color);
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0;
    border-radius: var(--b-round);
    background-color: #ffffff;
    border: 1px solid var(--gray-light);
    box-shadow: 0 0 0 rgba(65, 157, 112, 0.7);
    z-index: 10;
    transition: var(--transition-com);
}

.sale_box:hover {
    color: var(--com-color);
    border: 1px solid var(--main-color);
    box-shadow: 4px 5px 0 rgba(65, 157, 112, 0.3);
}

/* 商品圖 */
.sale_box>.sale_img {
    position: relative;
    width: 100%;
    height: 230px;
    border-top-left-radius: var(--b-round);
    border-top-right-radius: var(--b-round);
    overflow: hidden;
}

@media screen and (max-width:991px) {
    .sale_box>.sale_img {
        height: 180px;
    }
}

@media screen and (max-width:767px) {
    .sale_box>.sale_img {
        height: 150px;
    }
}

.sale_box>.sale_img>img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: auto;
    min-height: 100%;
    height: 117%;
}

.sale_box>.sale_img.sale_img_w100>img {
    min-width: 100%;
    width: 100%;
    min-height: auto;
    height: auto;
}


@media screen and (max-width:991px) {
    .sale_box>.sale_img.sale_img_h100-m>img {
        min-width: auto;
        width: auto;
        min-height: 100%;
        height: 100%;
    }
}

@media screen and (max-width:767px) {
    .sale_box>.sale_img.sale_img_h100-s>img {
        min-width: auto;
        width: auto;
        min-height: 100%;
        height: 100%;
    }
}

/* 商品圖 END */

.sale_info {
    --btn-h: 42px;
    position: relative;
    padding: 0.6rem;
    margin-bottom: var(--btn-h);
    font-size: 1rem;
    text-align: left;
}

.pro-coupon .sale_info>h4 {
    color: var(--og-color);
    margin-bottom: 0.35rem;
}

@media screen and (max-width:767px) {
    .sale_info>h4 {
        font-size: 1.125rem;
    }

    .sale_info {
        font-size: 0.9375rem;
    }
}

.pro-coupon .sale_info>ul {
    margin-block-end: 0.3rem;
}

.pro-coupon .sale_info>ul li {
    line-height: 1.4;
    margin-bottom: 3px;
}

@media screen and (min-width:991px) {
    .pro-coupon .sale_info>ul li {
        margin-bottom: 1px;
    }
}

.pro-coupon .sale_info>ul li.coupon-num {
    color: var(--main-deep);
    font-weight: 600;
}

.pro-coupon .sale_info>ul li.date::before {
    font-family: 'Font Awesome 5 Free';
    content: '\f1da';
    font-weight: 600;
    color: var(--gray-60);
    margin-left: 0.2rem;
    margin-right: 0.4rem;
}

.pro-coupon .sale_info>ul li.coupon-num::before {
    content: '\e638';
    font-family: 'Material Icons Outlined', 'Material Icons';
    font-size: 130%;
    font-weight: 400;
    vertical-align: sub;
    color: var(--gray-60);
    margin-right: 0.3rem;
}

.pro-coupon .sale_info>ul li b {
    color: var(--gray-60);
    font-weight: 400;
}

.pro-coupon .sale_info>p {
    color: var(--box-border);
    margin-top: 0.3rem;
    margin-bottom: 0;
}

.pro-coupon .sale_info>.date_txt {
    float: left;
    padding-top: 0.6rem;
}

.pro-coupon .sale_info>.price_txt {
    float: right;
    color: var(--sale);
}

.pro-coupon .sale_info>.price_txt>span {
    font-size: 1.75rem;
}

.sale_box .sale_info:after {
    /* clearfix */
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.pro-coupon .sale_box .btn {
    position: absolute;
    bottom: 0.5rem;
    width: calc(100% - 1rem);
    left: 0.5rem;
}

/*-- 折扣碼商品格子區 .pro-coupon END --*/

/*-- 一般商品格子區 .pro-sale --*/

.pro-sale {}

.mb10 {
    margin-bottom: 10px;
}

.pro-sale .sale_info>h4 {
    text-align: center;
    color: var(--basic-txt);
    font-weight: 600;
    margin-bottom: 0.35rem;
}

.pro-sale .sale_info>ul {
    margin-block-end: 0;
}

.pro-sale .sale_info>ul li {
    color: var(--main-deep);
    line-height: 1.3;
    margin-bottom: 3px;
}

@media screen and (min-width:991px) {
    .pro-sale .sale_info>ul li {
        margin-bottom: 2px;
    }
}

.pro-sale .sale_info>ul li.info-hotel::before {
    font-family: 'Font Awesome 5 Free';
    content: '\f084';
    font-size: 90%;
    font-weight: 600;
    color: var(--main-deep);
    margin-left: 0.2rem;
    margin-right: 0.4rem;
}

.pro-sale .sale_info>ul li.info-light::before {
    font-family: 'Material Icons';
    content: '\ef76';
    font-size: 120%;
    vertical-align: middle;
    color: var(--main-deep);
    margin-left: 0.2rem;
    margin-right: 0.4rem;
}

.pro-sale .sale_info>p {
    color: var(--box-border);
    margin-top: 0.3rem;
    margin-bottom: 0;
}

.pro-sale .sale_info>.date_txt {
    float: left;
    padding-top: 0.6rem;
}

.pro-sale .sale_info>.price_txt {
    float: right;
    color: var(--og-color);
}

.pro-sale .sale_info>.price_txt.emoney::before {
    font-family: 'Material Icons';
    content: '\eb70';
    font-size: 120%;
    vertical-align: middle;
    margin-right: 0.4rem;
}

@media screen and (max-width:767px) {
    .pro-sale .sale_info>ul li.info-light::before {
        font-size: 100%;
        vertical-align: top;
        margin-right: 0.2rem;
    }

    .pro-sale .sale_info>.price_txt.emoney::before {
        font-size: 100%;
        vertical-align: text-bottom;
        margin-right: 0.3rem;
    }
}

.pro-sale .sale_info>.price_txt>span {
    font-size: 1.5rem;
    font-weight: 600;
    margin-right: 3px;
}

@media screen and (min-width:991px) {
    .pro-sale .sale_info>.price_txt>span {
        font-size: 1.8rem;
    }
}

.pro-sale .sale_box .btn {

    position: absolute;
    bottom: 0.5rem;
    width: calc(100% - 1rem);
    left: 0.5rem;
}

/*-- 一般商品格子區 .pro-sale END --*/

/*-- 商品為2顆按鈕時，疊加class --*/

.sale_info.dbl_btn {
    margin-bottom: calc(var(--btn-h) * 2)
}

.dbl_btn_sec {
    position: absolute;
    bottom: 0;
    width: calc(100% - 1rem);
    left: 0.5rem;
}

.dbl_btn_sec .btn {
    position: relative !important;
    margin-bottom: 0.5rem;
    width: 100% !important;
    bottom: auto !important;
    left: auto !important;
}

/*-- 商品為2顆按鈕時，疊加class END --*/

/*-- 聯名卡首購優惠>適用商品 20230215 --*/

.pro-theme .btn .material-icons {
    font-size: 140%;
}

.pro-theme .btn {
    border-radius: 0.5rem;
}