

	/* =====================================
 Banner 
===================================== */


	.good-banner-ad {


		width: 1200px;


		max-width: calc(100% - 60px);


		margin: 40px auto;


		overflow: hidden;


		border-radius: 18px;


	}





	.banner-slider {


		position: relative;


		width: 100%;


		overflow: hidden;


	}





	.banner-track {


		display: flex;


		transition: .6s ease;


	}





	.banner-item {


		min-width: 100%;


	}





	.banner-item img {


		display: block;


		width: 100%;


		height: auto;


		object-fit: cover;


	}









	/* =====================================
 左右按鈕
===================================== */


	.banner-prev,
	.banner-next {


		position: absolute;


		top: 50%;


		transform: translateY(-50%);


		width: 45px;


		height: 45px;


		border-radius: 50%;


		border: 0;


		background: rgba(0, 0, 0, .35);


		cursor: pointer;


		z-index: 5;


		display: flex;


		align-items: center;


		justify-content: center;


	}





	.banner-prev {


		left: 20px;


	}





	.banner-next {


		right: 20px;


	}








	/* 左箭頭 CSS */


	.banner-prev::before {


		content: "";


		width: 12px;


		height: 12px;


		border-left: 3px solid #fff;


		border-bottom: 3px solid #fff;


		transform: rotate(45deg);


		margin-left: 5px;


	}







	/* 右箭頭 CSS */


	.banner-next::before {


		content: "";


		width: 12px;


		height: 12px;


		border-right: 3px solid #fff;


		border-top: 3px solid #fff;


		transform: rotate(45deg);


		margin-right: 5px;


	}









	/* =====================================
 點點
===================================== */


	.banner-dots {


		position: absolute;


		bottom: 18px;


		left: 50%;


		transform: translateX(-50%);


		display: flex;


		gap: 8px;


	}





	.banner-dot {


		width: 10px;


		height: 10px;


		border-radius: 50%;


		background: #fff;


		opacity: .5;


		cursor: pointer;


	}





	.banner-dot.active {


		opacity: 1;


	}









	/* =====================================
 平板
===================================== */


	@media(max-width:992px) {



		.good-banner-ad {


			width: calc(100% - 40px);


		}



	}









	/* =====================================
 手機
===================================== */


	@media(max-width:768px) {



		.good-banner-ad {


			width: calc(100% - 30px);


			margin: 20px auto;


			border-radius: 12px;


		}




		.banner-prev,
		.banner-next {


			width: 35px;


			height: 35px;


		}





		.banner-prev {


			left: 10px;


		}





		.banner-next {


			right: 10px;


		}





		.banner-prev::before,
		.banner-next::before {


			width: 9px;


			height: 9px;


			border-width: 2px;


		}





		.banner-dots {


			bottom: 10px;


		}



	}


    /* =====================================
Header
===================================== */


.iqos-nav-toggle{


display:none;


}



@media(max-width:768px){



.iqos-header-container{


position:relative;


}




/* 漢堡按鈕 */


.iqos-nav-toggle{


display:block;


position:absolute;


right:15px;


top:50%;


transform:translateY(-50%);


width:40px;


height:40px;


border:0;


background:none;


cursor:pointer;


z-index:9999;


}





.iqos-nav-toggle span,
.iqos-nav-toggle span::before,
.iqos-nav-toggle span::after{


content:"";

position:absolute;

left:8px;

width:24px;

height:2px;

background:#333;

transition:.3s;


}





.iqos-nav-toggle span{


top:19px;


}



.iqos-nav-toggle span::before{


top:-8px;

left:0;


}



.iqos-nav-toggle span::after{


top:8px;

left:0;


}






/* 導航預設關閉 */


.iqos-header-nav{


display:none;


position:absolute;


top:60px;


left:0;


width:100%;


background:#fff;


z-index:9998;


box-shadow:

0 8px 20px rgba(0,0,0,.12);


}







/* 展開 */


.iqos-header-nav.mobile-open{


display:block;


}







.iqos-header-menu{


display:block !important;


padding:0;

margin:0;


}





.iqos-header-menu li{


width:100%;


border-bottom:1px solid #eee;


}





.iqos-header-menu li a{


display:block;


padding:15px 20px;


color:#333;


}






/* 二級菜單 */


.iqos-dropdown{


display:none;


background:#f7f7f7;


}





.iqos-dropdown a{


padding-left:40px !important;


font-size:14px;


}





/* 點擊父級後展開 */


.iqos-header-menu li.child-open 
.iqos-dropdown{


display:block;


}



}
/* =====================================
 手機導航關閉按鈕
===================================== */

@media(max-width:768px){


.iqos-nav-close{


position:absolute;


right:15px;


top:15px;


width:35px;


height:35px;


border-radius:50%;


background:#f5f5f5;


display:flex;


align-items:center;


justify-content:center;


font-size:24px;


color:#333;


cursor:pointer;


z-index:10001;


line-height:1;


}





.iqos-header-nav.mobile-open{


padding-top:60px;


}




}
.iqos-header{
position:sticky!important;
top:0!important;
}

/* =====================================
 IQOS 頂部懸浮通知欄
===================================== */

.iqos-notice-bar{
    position:sticky;
    top:0;

    width:100%;

    background:#198754;

    color:#fff;

    z-index:10050;

    box-shadow:0 2px 8px rgba(0,0,0,.08);
}


/* 內容寬度 */

.iqos-notice-inner{
    position:relative;

    width:100%;
    max-width:1200px;

    min-height:42px;

    margin:0 auto;
    padding:8px 48px 8px 20px;

    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;

    gap:12px;

    text-align:center;

    box-sizing:border-box;
}


/* 通知文字 */

.iqos-notice-text{
    font-size:14px;
    font-weight:500;
    line-height:1.5;
}


/* 查看消息 */

.iqos-notice-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:5px 14px;

    background:rgba(255,255,255,.15);

    border:1px solid rgba(255,255,255,.4);
    border-radius:999px;

    color:#fff;

    font-size:13px;
    font-weight:600;

    text-decoration:none;

    transition:.25s;
}

.iqos-notice-link:hover{
    background:#fff;

    color:#198754;

    text-decoration:none;
}


/* 關閉按鈕 */

.iqos-notice-close{
    position:absolute;

    right:15px;
    top:50%;

    transform:translateY(-50%);

    width:28px;
    height:28px;

    padding:0;

    display:flex;
    align-items:center;
    justify-content:center;

    background:transparent;

    border:0;
    border-radius:50%;

    color:#fff;

    font-size:22px;
    line-height:1;

    cursor:pointer;

    transition:.25s;
}

.iqos-notice-close:hover{
    background:rgba(255,255,255,.15);
}


/* =====================================
 Header 跟在通知欄下面
===================================== */

.iqos-header{
    position:sticky !important;

    top:42px !important;

    z-index:10000;
}


/* 通知欄關閉後 */

body.iqos-notice-hidden .iqos-notice-bar{
    display:none;
}

body.iqos-notice-hidden .iqos-header{
    top:0 !important;
}


/* =====================================
 手機
===================================== */

@media(max-width:768px){

    .iqos-notice-inner{
        min-height:48px;

        padding:7px 42px 7px 12px;

        gap:6px;
    }

    .iqos-notice-text{
        width:100%;

        font-size:12px;

        line-height:1.45;
    }

    .iqos-notice-link{
        padding:4px 11px;

        font-size:11px;
    }

    .iqos-notice-close{
        right:8px;

        width:26px;
        height:26px;

        font-size:20px;
    }

    .iqos-header{
        top:48px !important;
    }

    body.iqos-notice-hidden .iqos-header{
        top:0 !important;
    }

}




/* =====================================
 index
===================================== */

.card-news{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:24px;
    max-width:1200px;
    margin:40px auto !important;
    padding:0 20px !important;
}


/* 單個卡片 */

.news-card-item{
    min-width:0;
    margin:0;
}


/* 整張卡片可點擊 */

.news-card{
    display:flex;
    flex-direction:column;
    height:100%;
    overflow:hidden;
    background:#fff;
    border:1px solid #eee;
    border-radius:18px;
    box-shadow:0 6px 22px rgba(0,0,0,.06);
    text-decoration:none;
    color:#222;
    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


.news-card:hover{
    transform:translateY(-6px);
    border-color:#ddd;
    box-shadow:0 14px 35px rgba(0,0,0,.12);
}


/* =====================================
 圖片
===================================== */

.news-card-img{
    position:relative;
    width:100%;
    aspect-ratio:3 / 2;
    overflow:hidden;
    background:#f5f5f5;
}


.news-card-img img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    margin:0;
    transition:transform .45s ease;
}


.news-card:hover .news-card-img img{
    transform:scale(1.05);
}


/* =====================================
 文字區
===================================== */

.news-card-body{
    display:flex;
    flex-direction:column;
    flex:1;
    padding:18px 18px 20px;
}


.news-card-title{
    color:#222;
    font-size:15px;
    font-weight:400;
    line-height:1.25;

    /* 最多顯示2行 */
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;

    min-height:52px;
}


.news-card:hover .news-card-title{
    color:#198754;
}


/* =====================================
 平板
===================================== */

@media(max-width:992px){

    .card-news{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:20px;
    }

}


/* =====================================
 手機
===================================== */

@media(max-width:768px){

    .card-news{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:14px;
        margin:25px auto !important;
        padding:0 15px !important;
    }

    .news-card{
        border-radius:14px;
    }

    .news-card-body{
        padding:14px;
    }

    .news-card-title{
        min-height:44px;
        font-size:14px;
        line-height:1.55;
    }

}


/* =====================================
 超小手機
===================================== */

@media(max-width:380px){

    .card-news{
        gap:10px;
        padding:0 10px !important;
    }

    .news-card-body{
        padding:11px;
    }

    .news-card-title{
        font-size:13px;
    }

}
/* ==============================
   新聞 / 商品區塊 H2 標題
============================== */

.news-section-title {
    max-width: 1160px;
    margin: 45px auto 25px;
    padding: 0 20px;
    box-sizing: border-box;

    font-size: 30px;
    font-weight: 700;
    line-height: 1.4;
}

.news-section-title a {
    position: relative;
    display: inline-block;

    color: #222;
    text-decoration: none;
    transition: color .25s ease;
}

/* 標題下方裝飾線 */
.news-section-title a::after {
    content: "";
    display: block;

    width: 45px;
    height: 4px;

    margin-top: 10px;

    background: #198754;
    border-radius: 10px;

    transition: width .3s ease;
}

.news-section-title a:hover {
    color: #198754;
}

.news-section-title a:hover::after {
    width: 100%;
}


/* ==============================
   平板
============================== */

@media (max-width: 992px) {

    .news-section-title {
        font-size: 26px;
        margin-top: 35px;
    }

}


/* ==============================
   手機
============================== */

@media (max-width: 768px) {

    .news-section-title {
        margin: 30px auto 18px;
        padding: 0 15px;

        font-size: 23px;
    }

    .news-section-title a::after {
        width: 38px;
        height: 3px;
        margin-top: 7px;
    }

}
/* =========================================================
   IQOS FAQ 常見問題區塊
   Scope: .good-section.faq-section
========================================================= */

.good-section.faq-section,
.good-section.faq-section * {
    box-sizing: border-box;
}

.good-section.faq-section {
    width: 100%;
    max-width: 1200px;

    margin: 50px auto 60px;
    padding: 45px 40px;

    background: #fff;

    border: 1px solid #e9e9e9;
    border-radius: 22px;

    color: #333;

    box-shadow: 0 8px 30px rgba(0, 0, 0, .05);
}


/* =========================================================
   FAQ 主標題
========================================================= */

.good-section.faq-section .news-section-title {
    position: relative;

    margin: 0 0 35px;
    padding: 0 0 18px;

    color: #222;

    font-size: 30px;
    font-weight: 700;
    line-height: 1.45;

    text-align: left;
}


/* 標題底線 */

.good-section.faq-section .news-section-title::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: 0;

    width: 65px;
    height: 4px;

    background: #198754;

    border-radius: 10px;
}


/* =========================================================
   FAQ 容器
========================================================= */

.good-section.faq-section .faq-container {
    display: grid;

    grid-template-columns: 1fr;

    gap: 16px;

    width: 100%;
}


/* =========================================================
   FAQ 單項
========================================================= */

.good-section.faq-section .faq-item {
    position: relative;

    width: 100%;

    margin: 0;
    padding: 24px 26px;

    overflow: hidden;

    background: #fafafa;

    border: 1px solid #e9e9e9;
    border-radius: 14px;

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}


/* 左側綠線 */

.good-section.faq-section .faq-item::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 4px;
    height: 100%;

    background: #198754;
}


/* 滑鼠經過 */

.good-section.faq-section .faq-item:hover {
    background: #fff;

    border-color: #d5e8dc;

    transform: translateY(-2px);

    box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
}


/* =========================================================
   問題 H3
========================================================= */

.good-section.faq-section .faq-item h3 {
    position: relative;

    margin: 0 0 12px;
    padding: 0 0 0 36px;

    color: #222;

    font-size: 18px;
    font-weight: 700;
    line-height: 1.65;
}


/* Q 圖示 */

.good-section.faq-section .faq-item h3::before {
    content: "Q";

    position: absolute;

    top: 1px;
    left: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    background: #198754;

    border-radius: 50%;

    color: #fff;

    font-size: 13px;
    font-weight: 800;
    line-height: 1;
}


/* =========================================================
   答案文字
========================================================= */

.good-section.faq-section .faq-item p {
    position: relative;

    margin: 0;
    padding: 0 0 0 36px;

    color: #5d5d5d;

    font-size: 15px;
    font-weight: 400;
    line-height: 1.9;

    text-align: left;
}


/* A 圖示 */

.good-section.faq-section .faq-item p::before {
    content: "A";

    position: absolute;

    top: 3px;
    left: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    background: #eef7f1;

    border: 1px solid #cfe7d8;
    border-radius: 50%;

    color: #198754;

    font-size: 13px;
    font-weight: 800;
    line-height: 1;
}


/* =========================================================
   文字強調 / 連結
========================================================= */

.good-section.faq-section .faq-item strong {
    color: #198754;
    font-weight: 700;
}

.good-section.faq-section .faq-item a {
    color: #198754;

    font-weight: 600;

    text-decoration: underline;
    text-underline-offset: 3px;

    transition: color .2s ease;
}

.good-section.faq-section .faq-item a:hover {
    color: #126b42;
}


/* =========================================================
   PC 大螢幕
========================================================= */

@media (min-width: 1200px) {

    .good-section.faq-section {
        padding: 50px;
    }

    .good-section.faq-section .news-section-title {
        font-size: 32px;
    }

}


/* =========================================================
   平板
========================================================= */

@media (max-width: 992px) {

    .good-section.faq-section {
        width: calc(100% - 40px);

        margin: 40px auto 50px;
        padding: 35px 30px;

        border-radius: 18px;
    }

    .good-section.faq-section .news-section-title {
        margin-bottom: 28px;

        font-size: 27px;
    }

    .good-section.faq-section .faq-item {
        padding: 22px;
    }

}


/* =========================================================
   手機
========================================================= */

@media (max-width: 768px) {

    .good-section.faq-section {
        width: calc(100% - 30px);

        margin: 30px auto 40px;
        padding: 25px 18px;

        border-radius: 16px;
    }


    /* 主標題 */

    .good-section.faq-section .news-section-title {
        margin-bottom: 24px;
        padding-bottom: 14px;

        font-size: 23px;
        line-height: 1.5;
    }

    .good-section.faq-section .news-section-title::after {
        width: 50px;
        height: 3px;
    }


    /* FAQ */

    .good-section.faq-section .faq-container {
        gap: 12px;
    }

    .good-section.faq-section .faq-item {
        padding: 18px 16px;

        border-radius: 12px;
    }


    /* 問題 */

    .good-section.faq-section .faq-item h3 {
        margin-bottom: 12px;

        padding-left: 32px;

        font-size: 16px;
        line-height: 1.65;
    }

    .good-section.faq-section .faq-item h3::before {
        width: 23px;
        height: 23px;

        font-size: 12px;
    }


    /* 答案 */

    .good-section.faq-section .faq-item p {
        padding-left: 32px;

        font-size: 14px;
        line-height: 1.85;
    }

    .good-section.faq-section .faq-item p::before {
        width: 23px;
        height: 23px;

        font-size: 12px;
    }

}


/* =========================================================
   小手機
========================================================= */

@media (max-width: 390px) {

    .good-section.faq-section {
        width: calc(100% - 20px);

        padding: 20px 14px;

        border-radius: 14px;
    }

    .good-section.faq-section .news-section-title {
        font-size: 21px;
    }

    .good-section.faq-section .faq-item {
        padding: 16px 13px;
    }

    .good-section.faq-section .faq-item h3 {
        font-size: 15px;
    }

    .good-section.faq-section .faq-item p {
        font-size: 13.5px;
        line-height: 1.8;
    }

}




/* =========================================================
  列表 CSS
========================================================= */


/* =========================================================
   1. 外层宽度
========================================================= */

.filter-section-container,
.product-card-page{
    width:100%;
    max-width:1200px;
    margin-left:auto;
    margin-right:auto;
    padding-left:20px;
    padding-right:20px;
    box-sizing:border-box;
}

.product-card-page{
    margin-top:32px;
    margin-bottom:60px;
}


/* =========================================================
   2. 面包屑
========================================================= */

.filter-section-container .product-breadcrumb-nav{
    display:block;
    width:100%;
    margin:24px 0 16px;
    padding:0;
}

.filter-section-container .breadcrumb-list{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:7px;

    margin:0;
    padding:0;

    list-style:none;
}

.filter-section-container .breadcrumb-item{
    display:flex;
    align-items:center;
    gap:7px;

    margin:0;
    padding:0;

    color:#777;
    font-size:14px;
    line-height:1.5;
}

.filter-section-container .breadcrumb-item a{
    color:#555;
    text-decoration:none;
    transition:color .25s ease;
}

.filter-section-container .breadcrumb-item a:hover{
    color:#198754;
}

.filter-section-container .breadcrumb-item.active{
    color:#198754;
    font-weight:600;
}

.filter-section-container .breadcrumb-separator{
    color:#bbb;
    font-size:13px;
}


/* =========================================================
   3. 筛选卡片
========================================================= */

.filter-section-container .filter-white-box{
    width:100%;

    padding:22px 25px;

    background:#fff;

    border:1px solid #ececec;
    border-radius:18px;

    box-shadow:0 6px 24px rgba(0,0,0,.05);

    box-sizing:border-box;
}


/* 每一行 */

.filter-section-container .filter-row{
    display:flex;
    align-items:flex-start;
    gap:18px;

    padding:15px 0;

    border-bottom:1px solid #eee;
}

.filter-section-container .filter-row:first-child{
    padding-top:0;
}

.filter-section-container .filter-row:last-child{
    padding-bottom:0;
    border-bottom:0;
}


/* 标签 */

.filter-section-container .filter-label{
    flex:0 0 142px;

    padding-top:8px;

    color:#222;

    font-size:15px;
    font-weight:700;
    line-height:1.4;
}


/* 选项 */

.filter-section-container .filter-options{
    display:flex;
    flex:1;
    flex-wrap:wrap;
    align-items:center;

    gap:9px;

    min-width:0;
}


/* 分类按钮 */

.filter-section-container .filter-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:36px;

    margin:0;
    padding:7px 16px;

    background:#fafafa;

    border:1px solid #e5e5e5;
    border-radius:999px;

    color:#555;

    font-size:14px;
    font-weight:500;
    line-height:1.2;

    text-decoration:none;
    white-space:nowrap;

    box-sizing:border-box;

    transition:
        color .25s ease,
        background .25s ease,
        border-color .25s ease,
        transform .25s ease;
}

.filter-section-container .filter-link:hover{
    color:#198754;

    background:#f2f9f5;

    border-color:#198754;

    transform:translateY(-1px);
}


/* 当前分类 */

.filter-section-container .filter-link.active{
    color:#fff !important;

    background:#198754 !important;

    border-color:#198754 !important;
}


/* =========================================================
   4. 页面 H1
========================================================= */

.product-card-page .product-page-title{
    display:block;

    margin:0 0 28px;
    padding:0;

    color:#222;

    font-size:34px;
    font-weight:700;
    line-height:1.45;

    text-align:left;
}

.product-card-page .product-page-title::after{
    content:"";

    display:block;

    width:55px;
    height:4px;

    margin-top:12px;

    background:#198754;

    border-radius:10px;
}


/* =========================================================
   5. 商品列表 Grid
========================================================= */

.product-card-page .product-card-list{
    display:grid !important;

    grid-template-columns:repeat(4,minmax(0,1fr));

    gap:24px;

    width:100%;

    margin:0 !important;
    padding:0 !important;

    list-style:none !important;

    box-sizing:border-box;
}


/* 单个商品 li */

.product-card-page .product-card-list > .product-card{
    display:block;

    width:auto;
    min-width:0;

    margin:0 !important;
    padding:0 !important;

    background:transparent !important;

    border:0 !important;

    list-style:none !important;
}


/* 清除主题可能加的项目符号 */

.product-card-page .product-card::before,
.product-card-page .product-card::after{
    display:none !important;
    content:none !important;
}


/* =========================================================
   6. 商品卡片
========================================================= */

.product-card-page .product-card-link{
    display:flex;
    flex-direction:column;

    width:100%;
    height:100%;

    margin:0;
    padding:0;

    overflow:hidden;

    background:#fff;

    border:1px solid #ececec;
    border-radius:18px;

    color:#222;

    text-decoration:none !important;

    box-shadow:0 6px 22px rgba(0,0,0,.06);

    box-sizing:border-box;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}

.product-card-page .product-card-link:hover{
    transform:translateY(-6px);

    border-color:#ddd;

    box-shadow:0 14px 35px rgba(0,0,0,.12);

    text-decoration:none !important;
}


/* =========================================================
   7. 商品图片
========================================================= */

.product-card-page .product-card-image{
    position:relative;

    display:block;

    width:100%;

    aspect-ratio:1 / 1;

    overflow:hidden;

    background:#f7f7f7;
}

.product-card-page .product-card-image img{
    display:block;

    width:100% !important;
    height:100% !important;

    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:cover;

    border:0;

    transition:transform .4s ease;
}

.product-card-page .product-card-link:hover .product-card-image img{
    transform:scale(1.05);
}


/* =========================================================
   8. 商品内容区
========================================================= */

.product-card-page .product-card-body{
    display:flex;
    flex:1;
    flex-direction:column;

    width:100%;

    padding:18px;

    box-sizing:border-box;
}


/* =========================================================
   9. 商品标题
========================================================= */

.product-card-page .product-card-title{
    display:-webkit-box;

    min-height:50px;

    margin:0 0 10px;
    padding:0;

    overflow:hidden;

    color:#222;

    font-size:16px;
    font-weight:700;
    line-height:1.55;

    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;

    transition:color .25s ease;
}

.product-card-page .product-card-link:hover .product-card-title{
    color:#198754;
}


/* =========================================================
   10. 商品价格
========================================================= */

.product-card-page .product-card-price{
    display:block;

    margin:0 0 9px;
    padding:0;
}

.product-card-page .price-display{
    display:inline-block;

    color:#c0392b;

    font-size:19px;
    font-weight:700;
    line-height:1.4;
}


/* =========================================================
   11. 推荐星级
========================================================= */

.product-card-page .product-card-rating{
    display:flex;
    flex-wrap:wrap;
    align-items:center;

    gap:5px;

    margin:0 0 14px;
    padding:0;

    color:#777;

    font-size:13px;
    line-height:1.4;
}

.product-card-page .stars{
    color:#777;
}

.product-card-page .review-count{
    color:#d49a16;

    letter-spacing:1px;
}


/* =========================================================
   12. 卡片底部
========================================================= */

.product-card-page .product-card-bottom{
    width:100%;

    margin-top:auto;
}


/* 查看详情 */

.product-card-page .product-more{
    display:flex;

    align-items:center;
    justify-content:center;

    width:100%;
    min-height:40px;

    padding:9px 14px;

    background:#198754;

    border-radius:999px;

    color:#fff !important;

    font-size:14px;
    font-weight:600;
    line-height:1.2;

    text-align:center;

    box-sizing:border-box;

    transition:
        background .25s ease,
        transform .25s ease;
}

.product-card-page .product-card-link:hover .product-more{
    background:#146c43;
}


/* =========================================================
   13. 独立分页 iqos-list-pager
========================================================= */

.product-card-page .iqos-list-pager{
    display:flex !important;

    justify-content:center !important;
    align-items:center !important;
    flex-wrap:wrap !important;

    gap:8px !important;

    width:100%;

    margin:40px auto 0 !important;
    padding:0 !important;

    clear:both !important;

    text-align:center !important;

    box-sizing:border-box !important;
}


/* EyouCMS 可能输出 UL */

.product-card-page .iqos-list-pager ul,
.product-card-page .iqos-list-pager .pagination{
    display:flex !important;

    justify-content:center !important;
    align-items:center !important;

    flex-wrap:wrap !important;

    gap:8px !important;

    width:auto !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    list-style:none !important;

    background:none !important;
    border:0 !important;

    float:none !important;
    position:static !important;
}


/* 分页 li */

.product-card-page .iqos-list-pager li{
    display:block !important;

    width:auto !important;
    min-width:0 !important;
    height:auto !important;

    margin:0 !important;
    padding:0 !important;

    float:none !important;
    position:static !important;

    list-style:none !important;

    background:none !important;
    border:0 !important;

    box-shadow:none !important;
}


/* 删除原主题装饰 */

.product-card-page .iqos-list-pager li::before,
.product-card-page .iqos-list-pager li::after{
    display:none !important;
    content:none !important;
}


/* =========================================================
   14. 分页按钮
========================================================= */

.product-card-page .iqos-list-pager a,
.product-card-page .iqos-list-pager span,
.product-card-page .iqos-list-pager li a,
.product-card-page .iqos-list-pager li span{
    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;

    min-width:40px !important;
    height:40px !important;

    margin:0 !important;
    padding:0 13px !important;

    background:#fff !important;

    border:1px solid #dedede !important;
    border-radius:8px !important;

    color:#333 !important;

    font-size:14px !important;
    font-weight:500 !important;

    line-height:1 !important;

    text-decoration:none !important;

    white-space:nowrap !important;

    float:none !important;
    position:static !important;

    box-sizing:border-box !important;

    box-shadow:none !important;

    transition:
        background-color .25s ease,
        border-color .25s ease,
        color .25s ease,
        transform .25s ease !important;
}


/* 分页 hover */

.product-card-page .iqos-list-pager a:hover{
    background:#198754 !important;

    border-color:#198754 !important;

    color:#fff !important;

    text-decoration:none !important;

    transform:translateY(-2px);
}


/* 当前页 */

.product-card-page .iqos-list-pager .active,
.product-card-page .iqos-list-pager .current,
.product-card-page .iqos-list-pager li.active > a,
.product-card-page .iqos-list-pager li.active > span,
.product-card-page .iqos-list-pager li.current > a,
.product-card-page .iqos-list-pager li.current > span{
    background:#198754 !important;

    border-color:#198754 !important;

    color:#fff !important;

    font-weight:700 !important;

    transform:none !important;
}


/* 上一页 / 下一页 */

.product-card-page .iqos-list-pager .prev,
.product-card-page .iqos-list-pager .next,
.product-card-page .iqos-list-pager a.prev,
.product-card-page .iqos-list-pager a.next{
    min-width:70px !important;

    padding-left:16px !important;
    padding-right:16px !important;

    font-weight:600 !important;
}


/* 禁用 */

.product-card-page .iqos-list-pager .disabled,
.product-card-page .iqos-list-pager li.disabled > a,
.product-card-page .iqos-list-pager li.disabled > span{
    background:#f6f6f6 !important;

    border-color:#e7e7e7 !important;

    color:#aaa !important;

    opacity:.7 !important;

    cursor:not-allowed !important;

    pointer-events:none !important;
}


/* =========================================================
   15. 平板
========================================================= */

@media(max-width:992px){

    .product-card-page .product-card-list{
        grid-template-columns:repeat(3,minmax(0,1fr));

        gap:20px;
    }

    .product-card-page .product-page-title{
        font-size:29px;
    }

}


/* =========================================================
   16. 手机
========================================================= */

@media(max-width:768px){

    .filter-section-container,
    .product-card-page{
        padding-left:15px;
        padding-right:15px;
    }


    /* 面包屑 */

    .filter-section-container .product-breadcrumb-nav{
        margin-top:16px;

        overflow-x:auto;

        -webkit-overflow-scrolling:touch;
    }

    .filter-section-container .breadcrumb-list{
        flex-wrap:nowrap;

        width:max-content;
        min-width:100%;
    }


    /* 筛选 */

    .filter-section-container .filter-white-box{
        padding:17px 15px;

        border-radius:14px;
    }

    .filter-section-container .filter-row{
        display:block;

        padding:14px 0;
    }

    .filter-section-container .filter-label{
        width:auto;

        margin-bottom:10px;
        padding:0;

        font-size:14px;
    }

    .filter-section-container .filter-options{
        gap:7px;
    }

    .filter-section-container .filter-link{
        min-height:34px;

        padding:6px 12px;

        font-size:13px;
    }


    /* H1 */

    .product-card-page{
        margin-top:24px;
    }

    .product-card-page .product-page-title{
        margin-bottom:20px;

        font-size:24px;
    }

    .product-card-page .product-page-title::after{
        width:42px;
        height:3px;

        margin-top:8px;
    }


    /* 商品两列 */

    .product-card-page .product-card-list{
        grid-template-columns:repeat(2,minmax(0,1fr));

        gap:14px;
    }


    .product-card-page .product-card-link{
        border-radius:14px;
    }


    .product-card-page .product-card-body{
        padding:13px;
    }


    .product-card-page .product-card-title{
        min-height:43px;

        margin-bottom:7px;

        font-size:14px;
        line-height:1.5;
    }


    .product-card-page .price-display{
        font-size:16px;
    }


    .product-card-page .product-card-rating{
        gap:4px;

        margin-bottom:10px;

        font-size:12px;
    }


    .product-card-page .product-more{
        min-height:36px;

        padding:8px 9px;

        font-size:13px;
    }


    /* 分页 */

    .product-card-page .iqos-list-pager{
        margin-top:30px !important;

        gap:6px !important;
    }

    .product-card-page .iqos-list-pager ul,
    .product-card-page .iqos-list-pager .pagination{
        gap:6px !important;
    }

    .product-card-page .iqos-list-pager a,
    .product-card-page .iqos-list-pager span,
    .product-card-page .iqos-list-pager li a,
    .product-card-page .iqos-list-pager li span{
        min-width:34px !important;
        height:34px !important;

        padding:0 9px !important;

        border-radius:7px !important;

        font-size:13px !important;
    }

    .product-card-page .iqos-list-pager .prev,
    .product-card-page .iqos-list-pager .next{
        min-width:58px !important;

        padding-left:11px !important;
        padding-right:11px !important;
    }

}


/* =========================================================
   17. 小手机
========================================================= */

@media(max-width:390px){

    .filter-section-container,
    .product-card-page{
        padding-left:10px;
        padding-right:10px;
    }


    .product-card-page .product-card-list{
        gap:10px;
    }


    .product-card-page .product-card-body{
        padding:10px;
    }


    .product-card-page .product-card-title{
        min-height:40px;

        font-size:13px;
    }


    .product-card-page .price-display{
        font-size:15px;
    }


    .product-card-page .product-more{
        min-height:34px;

        padding:7px;

        font-size:12px;
    }


    .product-card-page .iqos-list-pager{
        gap:5px !important;
    }


    .product-card-page .iqos-list-pager ul,
    .product-card-page .iqos-list-pager .pagination{
        gap:5px !important;
    }


    .product-card-page .iqos-list-pager a,
    .product-card-page .iqos-list-pager span,
    .product-card-page .iqos-list-pager li a,
    .product-card-page .iqos-list-pager li span{
        min-width:31px !important;
        height:31px !important;

        padding:0 7px !important;

        font-size:12px !important;
    }

}




/* =========================================================
  詳情頁
========================================================= */

.product-detail-page,
.product-detail-page *{
    box-sizing:border-box;
}

.product-detail-page{
    width:100%;
    max-width:1200px;
    margin:40px auto 60px;
    padding:0 20px;
    color:#333;
}


/* =========================================================
   商品首屏：左圖右文
========================================================= */

.product-detail-page .product-main{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:45px;
    align-items:start;
}


/* =========================================================
   商品圖片
========================================================= */

.product-detail-page .product-gallery{
    min-width:0;
}

.product-detail-page .product-main-image{
    position:relative;
    width:100%;
    aspect-ratio:1 / 1;

    display:flex;
    align-items:center;
    justify-content:center;

    overflow:hidden;

    padding:30px;

    background:#f7f7f7;

    border:1px solid #eee;
    border-radius:24px;

    box-shadow:0 8px 30px rgba(0,0,0,.06);
}

.product-detail-page .product-main-image img{
    display:block;

    width:100%;
    height:100%;

    max-width:100%;

    margin:0;

    object-fit:contain;

    transition:transform .4s ease;
}

.product-detail-page .product-main-image:hover img{
    transform:scale(1.03);
}


/* =========================================================
   商品資訊
========================================================= */

.product-detail-page .product-info{
    min-width:0;

    padding:35px;

    background:#fff;

    border:1px solid #eee;
    border-radius:24px;

    box-shadow:0 8px 30px rgba(0,0,0,.06);
}


/* =========================================================
   H1
========================================================= */

.product-detail-page .product-info .product-page-title{
    margin:0 0 18px;
    padding:0;

    color:#222;

    font-size:34px;
    font-weight:700;
    line-height:1.45;

    word-break:break-word;
}


/* =========================================================
   評分
========================================================= */

.product-detail-page .product-rating{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:10px;

    margin-bottom:20px;
}

.product-detail-page .product-rating .stars{
    color:#ff6600 !important;

    font-size:18px;
    line-height:1;

    letter-spacing:2px;
}

.product-detail-page .rating-text{
    color:#777;

    font-size:14px;
}


/* =========================================================
   價格
========================================================= */

.product-detail-page .product-price{
    display:flex;
    align-items:baseline;

    gap:6px;

    margin:0 0 22px;
    padding:18px 0;

    border-top:1px solid #eee;
    border-bottom:1px solid #eee;
}

.product-detail-page .product-price .currency{
    color:#c0392b;

    font-size:18px;
    font-weight:700;
}

.product-detail-page .product-price .price-num{
    color:#c0392b;

    font-size:34px;
    font-weight:800;
    line-height:1.2;
}


/* =========================================================
   商品簡介
========================================================= */

.product-detail-page .product-desc{
    margin-bottom:28px;

    color:#666;

    font-size:16px;
    line-height:1.9;
}

.product-detail-page .product-desc p{
    margin:0 0 12px;
}

.product-detail-page .product-desc p:last-child{
    margin-bottom:0;
}


/* =========================================================
   購買按鈕
========================================================= */

.product-detail-page .product-buy{
    display:grid;
    grid-template-columns:1fr 1fr;

    gap:12px;
}

.product-detail-page .product-buy button{
    width:100%;
    min-height:50px;

    padding:10px 18px;

    border-radius:999px;

    font-size:16px;
    font-weight:700;
    line-height:1.2;

    cursor:pointer;

    transition:
        background .25s ease,
        color .25s ease,
        border-color .25s ease,
        transform .25s ease,
        box-shadow .25s ease;
}


/* 立即購買 */

.product-detail-page .btn-buy-now{
    background:#198754;

    border:1px solid #198754;

    color:#fff;
}

.product-detail-page .btn-buy-now:hover{
    background:#146c43;

    border-color:#146c43;

    transform:translateY(-2px);

    box-shadow:0 8px 20px rgba(25,135,84,.2);
}


/* 加入購物車 */

.product-detail-page .btn-add-cart{
    background:#fff;

    border:1px solid #198754;

    color:#198754;
}

.product-detail-page .btn-add-cart:hover{
    background:#f1f8f4;

    transform:translateY(-2px);
}


/* =========================================================
   商品詳情
========================================================= */

.product-detail-page .product-content{
    margin-top:55px;

    padding:40px;

    background:#fff;

    border:1px solid #eee;
    border-radius:24px;

    box-shadow:0 8px 30px rgba(0,0,0,.06);
}


/* 商品詳情大標題 */

.product-detail-page .content-heading{
    margin:0 0 30px;
    padding:0 0 15px;

    border-bottom:2px solid #198754;

    color:#222;

    font-size:28px;
    font-weight:700;
    line-height:1.4;
}


/* =========================================================
   內文 product-text
========================================================= */

.product-detail-page .product-text{
    width:100%;

    color:#555;

    font-size:16px;
    line-height:1.95;
}


/* 內文 H2 */

.product-detail-page .product-text h2{
    margin:42px 0 20px;

    padding:14px 17px;

    background:#f7faf8;

    border-left:5px solid #198754;
    border-radius:10px;

    color:#222;

    font-size:26px;
    font-weight:700;
    line-height:1.5;
}

.product-detail-page .product-text h2:first-child{
    margin-top:0;
}


/* 內文 H3 */

.product-detail-page .product-text h3{
    margin:30px 0 14px;

    padding-left:14px;

    border-left:4px solid #198754;

    color:#222;

    font-size:20px;
    font-weight:700;
    line-height:1.5;
}


/* 段落 */

.product-detail-page .product-text p{
    margin:0 0 18px;

    color:#555;

    font-size:16px;
    line-height:1.95;
}


/* 強調 */

.product-detail-page .product-text strong{
    color:#198754;
    font-weight:700;
}


/* =========================================================
   內文圖片
========================================================= */

.product-detail-page .product-text img{
    display:block;

    max-width:100%;
    height:auto;

    margin:28px auto;

    border-radius:14px;
}


/* =========================================================
   內文列表
========================================================= */

.product-detail-page .product-text ul,
.product-detail-page .product-text ol{
    margin:20px 0 28px;

    padding:18px 22px 18px 42px;

    background:#fafafa;

    border:1px solid #eee;
    border-radius:14px;
}

.product-detail-page .product-text li{
    margin-bottom:8px;

    color:#555;

    font-size:15px;
    line-height:1.8;
}

.product-detail-page .product-text li:last-child{
    margin-bottom:0;
}


/* =========================================================
   內文表格
========================================================= */

.product-detail-page .product-text table{
    width:100%;

    margin:25px 0 32px;

    border-collapse:collapse;

    background:#fff;
}

.product-detail-page .product-text th,
.product-detail-page .product-text td{
    padding:13px 16px;

    border:1px solid #e3e3e3;

    text-align:left;
    vertical-align:top;

    font-size:15px;
    line-height:1.7;
}

.product-detail-page .product-text th{
    background:#198754;

    color:#fff;

    font-weight:700;
}

.product-detail-page .product-text tbody tr:nth-child(even){
    background:#fafafa;
}


/* =========================================================
   分隔線
========================================================= */

.product-detail-page .product-text hr{
    height:1px;

    margin:38px 0;

    border:0;

    background:#eee;
}


/* =========================================================
   相關商品
========================================================= */

.product-detail-page .related-product{
    margin-top:55px;
}


/* 標題 */

.product-detail-page .related-product > h2{
    margin:0 0 25px;
    padding:0;

    color:#222;

    font-size:28px;
    font-weight:700;
    line-height:1.4;
}

.product-detail-page .related-product > h2::after{
    content:"";

    display:block;

    width:50px;
    height:4px;

    margin-top:10px;

    background:#198754;

    border-radius:10px;
}


/* =========================================================
   相關商品 Grid
========================================================= */

.product-detail-page .related-list{
    display:grid;

    grid-template-columns:repeat(4,minmax(0,1fr));

    gap:22px;
}


/* 卡片 */

.product-detail-page .related-item{
    display:flex;
    flex-direction:column;

    min-width:0;
    height:100%;

    overflow:hidden;

    background:#fff;

    border:1px solid #eee;
    border-radius:18px;

    color:#222;
    text-decoration:none;

    box-shadow:0 6px 20px rgba(0,0,0,.05);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}

.product-detail-page .related-item:hover{
    transform:translateY(-5px);

    border-color:#ddd;

    box-shadow:0 12px 28px rgba(0,0,0,.1);
}


/* =========================================================
   相關商品圖片
========================================================= */

.product-detail-page .related-img-box{
    width:100%;

    aspect-ratio:1 / 1;

    overflow:hidden;

    background:#f7f7f7;
}

.product-detail-page .related-img-box img{
    display:block;

    width:100%;
    height:100%;

    margin:0;

    object-fit:cover;

    transition:transform .4s ease;
}

.product-detail-page .related-item:hover .related-img-box img{
    transform:scale(1.05);
}


/* =========================================================
   相關商品標題
========================================================= */

.product-detail-page .related-title{
    display:-webkit-box;

    min-height:70px;

    padding:16px;

    overflow:hidden;

    color:#222;

    font-size:15px;
    font-weight:700;
    line-height:1.55;

    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;

    transition:color .25s ease;
}

.product-detail-page .related-item:hover .related-title{
    color:#198754;
}


/* =========================================================
   平板
========================================================= */

@media(max-width:992px){

    .product-detail-page .product-main{
        gap:28px;
    }

    .product-detail-page .product-info{
        padding:28px;
    }

    .product-detail-page .product-info .product-page-title{
        font-size:28px;
    }

    .product-detail-page .related-list{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

}


/* =========================================================
   手機
========================================================= */

@media(max-width:768px){

    .product-detail-page{
        margin:25px auto 40px;

        padding:0 15px;
    }


    /* 首屏改上下 */

    .product-detail-page .product-main{
        grid-template-columns:1fr;

        gap:18px;
    }


    /* 主圖 */

    .product-detail-page .product-main-image{
        padding:18px;

        border-radius:16px;
    }


    /* 商品資訊 */

    .product-detail-page .product-info{
        padding:22px 18px;

        border-radius:16px;
    }


    .product-detail-page .product-info .product-page-title{
        margin-bottom:14px;

        font-size:24px;
        line-height:1.5;
    }


    /* 價格 */

    .product-detail-page .product-price{
        margin-bottom:18px;
        padding:14px 0;
    }

    .product-detail-page .product-price .currency{
        font-size:16px;
    }

    .product-detail-page .product-price .price-num{
        font-size:28px;
    }


    /* 描述 */

    .product-detail-page .product-desc{
        margin-bottom:20px;

        font-size:15px;
        line-height:1.85;
    }


    /* 按鈕上下 */

    .product-detail-page .product-buy{
        grid-template-columns:1fr;

        gap:10px;
    }

    .product-detail-page .product-buy button{
        min-height:46px;

        font-size:15px;
    }


    /* 詳情 */

    .product-detail-page .product-content{
        margin-top:30px;

        padding:20px 17px;

        border-radius:16px;
    }


    .product-detail-page .content-heading{
        margin-bottom:22px;

        font-size:23px;
    }


    .product-detail-page .product-text{
        font-size:15px;
    }


    .product-detail-page .product-text h2{
        margin:30px 0 17px;

        padding:12px 14px;

        border-left-width:4px;

        font-size:21px;
    }


    .product-detail-page .product-text h3{
        margin:24px 0 12px;

        font-size:18px;
    }


    .product-detail-page .product-text p{
        font-size:15px;
        line-height:1.85;
    }


    /* 表格手機橫向 */

    .product-detail-page .product-text table{
        min-width:620px;
    }

    .product-detail-page .product-text{
        overflow-wrap:anywhere;
    }

    .product-detail-page .product-text figure,
    .product-detail-page .product-text .table-wrapper,
    .product-detail-page .product-text .TyagGW_tableWrapper{
        max-width:100%;

        overflow-x:auto;

        -webkit-overflow-scrolling:touch;
    }


    /* 相關商品 */

    .product-detail-page .related-product{
        margin-top:35px;
    }


    .product-detail-page .related-product > h2{
        font-size:23px;
    }


    .product-detail-page .related-list{
        grid-template-columns:repeat(2,minmax(0,1fr));

        gap:12px;
    }


    .product-detail-page .related-item{
        border-radius:14px;
    }


    .product-detail-page .related-title{
        min-height:62px;

        padding:12px;

        font-size:13px;
    }

}


/* =========================================================
   超小手機
========================================================= */

@media(max-width:390px){

    .product-detail-page{
        padding:0 10px;
    }

    .product-detail-page .product-info{
        padding:18px 15px;
    }

    .product-detail-page .product-info .product-page-title{
        font-size:22px;
    }

    .product-detail-page .related-list{
        gap:9px;
    }

    .product-detail-page .related-title{
        min-height:58px;

        padding:10px;

        font-size:12px;
    }

}
/* =========================================================
   返回商品分類按鈕
========================================================= */

.product-detail-page .btn-back-list{
    width:100%;
    min-height:50px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:10px 18px;

    background:#fff;

    border:1px solid #198754;
    border-radius:999px;

    color:#198754;

    font-size:16px;
    font-weight:700;
    line-height:1.2;

    text-align:center;
    text-decoration:none !important;

    cursor:pointer;

    transition:
        background .25s ease,
        color .25s ease,
        border-color .25s ease,
        transform .25s ease,
        box-shadow .25s ease;
}


/* 滑鼠移入 */
.product-detail-page .btn-back-list:hover{
    background:#198754;

    border-color:#198754;

    color:#fff;

    text-decoration:none !important;

    transform:translateY(-2px);

    box-shadow:0 8px 20px rgba(25,135,84,.20);
}


/* 點擊 */
.product-detail-page .btn-back-list:active{
    transform:translateY(0);

    box-shadow:none;
}


/* 鍵盤操作 */
.product-detail-page .btn-back-list:focus-visible{
    outline:3px solid rgba(25,135,84,.20);
    outline-offset:3px;
}


/* =========================================================
   讓「立即購買」與「返回分類」高度完全一致
========================================================= */

.product-detail-page .product-buy .btn-buy-now,
.product-detail-page .product-buy .btn-back-list{
    min-height:50px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin:0;

    padding:10px 18px;

    border-radius:999px;

    font-size:16px;
    font-weight:700;

    box-sizing:border-box;
}


/* =========================================================
   手機版
========================================================= */

@media(max-width:768px){

    .product-detail-page .product-buy{
        display:grid;
        grid-template-columns:1fr;
        gap:10px;
    }

    .product-detail-page .product-buy .btn-buy-now,
    .product-detail-page .product-buy .btn-back-list{
        width:100%;
        min-height:46px;

        font-size:15px;
    }

}


/* =====================================
 商品詳情頁 麵包屑導航
===================================== */

.breadcrumb-wrapper{
    width:100%;
    max-width:1200px;
    margin:20px auto 25px;
    padding:0 20px;
    box-sizing:border-box;
}


/* =====================================
 列表
===================================== */

.breadcrumb-wrapper .breadcrumb-list{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:7px;

    margin:0;
    padding:0;

    list-style:none;
}


/* =====================================
 每一項
===================================== */

.breadcrumb-wrapper .breadcrumb-item{
    display:flex;
    align-items:center;

    gap:7px;

    margin:0;
    padding:0;

    color:#777;

    font-size:14px;
    line-height:1.6;

    list-style:none;
}


/* 清除其他主題可能加入的符號 */
.breadcrumb-wrapper .breadcrumb-item::before,
.breadcrumb-wrapper .breadcrumb-item::after{
    content:none !important;
    display:none !important;
}


/* =====================================
 連結
===================================== */

.breadcrumb-wrapper .breadcrumb-item a{
    display:inline-flex;
    align-items:center;

    color:#555;

    font-size:14px;
    font-weight:500;

    text-decoration:none;

    transition:color .25s ease;
}


.breadcrumb-wrapper .breadcrumb-item a:hover{
    color:#198754;
    text-decoration:none;
}


/* =====================================
 分隔符
===================================== */

.breadcrumb-wrapper .breadcrumb-separator{
    display:inline-block;

    margin:0 2px;

    color:#bbb;

    font-size:13px;
    font-weight:400;
}


/* =====================================
 最後一項 / 當前頁
===================================== */

.breadcrumb-wrapper .breadcrumb-item:last-child{
    color:#198754;
    font-weight:600;
}


/* 商品名稱太長時避免爆版 */
.breadcrumb-wrapper .breadcrumb-item:last-child span[itemprop="name"]{
    display:block;

    max-width:520px;

    overflow:hidden;

    text-overflow:ellipsis;
    white-space:nowrap;
}


/* =====================================
 卡片式背景，可選
===================================== */

.breadcrumb-wrapper .breadcrumb-list{
    padding:12px 16px;

    background:#fafafa;

    border:1px solid #eee;
    border-radius:12px;
}


/* =====================================
 平板
===================================== */

@media(max-width:992px){

    .breadcrumb-wrapper{
        margin:16px auto 20px;
    }

}


/* =====================================
 手機
===================================== */

@media(max-width:768px){

    .breadcrumb-wrapper{
        margin:12px auto 18px;
        padding:0 15px;

        overflow:hidden;
    }

    .breadcrumb-wrapper .breadcrumb-list{
        flex-wrap:nowrap;

        width:100%;

        padding:10px 12px;

        overflow-x:auto;

        white-space:nowrap;

        -webkit-overflow-scrolling:touch;

        scrollbar-width:none;
    }

    .breadcrumb-wrapper .breadcrumb-list::-webkit-scrollbar{
        display:none;
    }

    .breadcrumb-wrapper .breadcrumb-item{
        flex:0 0 auto;

        font-size:13px;
    }

    .breadcrumb-wrapper .breadcrumb-item a{
        font-size:13px;
    }

    .breadcrumb-wrapper .breadcrumb-item:last-child span[itemprop="name"]{
        max-width:220px;
    }

}


/* =====================================
 小手機
===================================== */

@media(max-width:390px){

    .breadcrumb-wrapper{
        padding:0 10px;
    }

    .breadcrumb-wrapper .breadcrumb-list{
        padding:9px 10px;
    }

    .breadcrumb-wrapper .breadcrumb-item:last-child span[itemprop="name"]{
        max-width:160px;
    }

}




/* =====================================
 底部
===================================== */


.bottom-login-bar{


position:fixed;


left:50%;


bottom:20px;


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


width:calc(100% - 220px);


max-width:50%;


height:70px;


background:rgba(30,30,30,.88);


display:flex;


align-items:center;


justify-content:space-between;


padding:0 25px;


z-index:99999;


transition:.35s ease;


box-shadow:

0 8px 30px rgba(0,0,0,.25);


}





/* 顯示狀態 */


.bottom-login-bar.show{


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


}







/* 左側文字 */


.bottom-login-text{


color:#fff;


font-size:18px;


font-weight:500;


}








/* 登入按鈕 */


.bottom-login-btn{


width:180px;


height:55px;


background:#fff;


color:#222;


display:flex;


align-items:center;


justify-content:center;


font-size:22px;


font-weight:bold;


text-decoration:none;


transition:.3s;


}





.bottom-login-btn:hover{


background:#eee;


}









/* ==========================
 平板
========================== */


@media(max-width:992px){



.bottom-login-bar{


width:calc(100% - 80px);


}



.bottom-login-text{


font-size:22px;


}



.bottom-login-btn{


width:140px;


font-size:18px;


}



}









/* ==========================
 手機
========================== */


@media(max-width:768px){



.bottom-login-bar{


width:calc(100% - 30px);


height:70px;


bottom:15px;


padding:0 15px;


border-radius:10px;


}





.bottom-login-text{


font-size:15px;


}




.bottom-login-btn{


width:90px;


height:40px;


font-size:16px;


border-radius:5px;


}



}




