.blog-eyecatch img{
	width:100%
}

/* 全体コンテナ */
.wine-blog-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px 15px;
    color: #333333;
    line-height: 1.8;
    letter-spacing: 0.05em;
}

/* アイキャッチバナー */
.blog-eyecatch img {
    width: 100%;
    height: auto;
    display: block;
    margin-bottom: 25px;
    border-radius: 4px; /* 緩やかな角丸でモダンに */
}

/* リード文 */
.blog-lead {
    font-size: 16px;
    font-weight: 500;
    width: 95%;
    margin: 10px auto 30px;
}

/* PC表示（画面幅 768px 以上）のときのみ適用 */
@media screen and (min-width: 768px) {
    .blog-lead{
        width:80%;
    }
}

/* アコーディオン全体（枠組みと下線） */
.blog-accordion {
    border-bottom: 1px solid #111111; /* アコーディオン下部の黒線 */
    margin-bottom: 40px;
}

/* アコーディオンのボタン部分 */
.accordion-trigger {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    cursor: pointer;
    list-style: none; /* デフォルトの矢印を消去（Chrome/Safari） */
    border-top: 1px solid #e0e0e0; /* 上部には薄い線を入れて区切りを明確に */
}
.accordion-trigger::-webkit-details-marker {
    display: none; /* デフォルトの矢印を消去（iOS用古期対策） */
}

/* 「続きを読む」のテキスト */
.trigger-text {
    font-size: 18px;
    font-weight: bold;
    color: #111111;
}

/* 「＋」マークの作成（CSS疑似要素） */
.accordion-trigger::after {
    content: '';
    display: block;
    width: 14px;
    height: 14px;
    position: relative;
    /* 縦線と横線で「＋」を表現 */
    background: 
        linear-gradient(#111 0 0) calc(50% - 1px) 50% / 2px 100% no-repeat,
        linear-gradient(#111 0 0) 50% calc(50% - 1px) / 100% 2px no-repeat;
    transition: transform 0.3s ease;
}

/* アコーディオンが開いている時の「ー」マーク切り替え */
.blog-accordion[open] .accordion-trigger::after {
    /* 縦線を消して横線だけにすることで「ー」にする */
    background: linear-gradient(#111 0 0) 50% calc(50% - 1px) / 100% 2px no-repeat;
}

/* アコーディオン内部のコンテンツエリア */
.accordion-content {
    padding: 30px 0% 10px 0%;
}

/* PC表示（画面幅 768px 以上）のときのみ適用 */
@media screen and (min-width: 768px) {
    .accordion-content {
        padding: 30px 10% 10px 10%;
    }
}

/* 記事内の装飾（Futureshop内のバッティング防止にクラス指定を推奨） */
.accordion-content h2 {
    font-size: 20px;
    font-weight: bold;
    color: #111111;
    border-bottom: 3px solid #111111;
    padding-left: 12px;
    margin: 40px 0 20px 0;
}

.accordion-content h3 {
    font-size: 16px;
    font-weight: bold;
    color: #222222;
    margin: 30px 0 15px 0;
}

.accordion-content p {
    font-size: 16px;
    margin-bottom: 15px;
    text-align: justify; /* テキストの右端を綺麗に揃える */
}

.blog-img img{
	width:90%;
	margin:10px auto;
}

/* PC表示（画面幅 768px 以上）のときのみ適用 */
@media screen and (min-width: 768px) {
    .blog-img img{
        width:70%;
    }
}

/* ==========================================================================
   ドン・ペリニヨン　特集ページ用CSS
   ========================================================================== */

.table-title{
	font-size:18px;
	text-align:center;
	width:100%;
	margin:10px 0 0;
	font-weight:bold;
}

/* ラインナップテーブル全体のスタイル */
.domperignon-lineup-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0px 0 30px 0;
    font-size: 14px;
    line-height: 1.6;
}

/* ヘッダー行（一番上の見出し） */
.domperignon-lineup-table th {
    padding: 12px 8px;
    font-weight: bold;
    color: #111111;
    border-bottom: 2px solid #111111; /* しっかりとした黒線 */
    text-align: left;
}

/* データ行（中身のセル） */
.domperignon-lineup-table td {
    padding: 12px 8px;
    color: #333333;
    border-bottom: 1px solid #e0e0e0; /* 境界線は薄いグレー */
}

/* 最後の行の下線だけ少し太くして締める */
.domperignon-lineup-table tbody tr:last-child td {
    border-bottom: 1px solid #111111;
}

/* 各列の個別微調整（CSSで後から幅や位置を自由に変えられます） */
.domperignon-lineup-table .col-name {
    width: 40%;
    font-weight: 500;
}
.domperignon-lineup-table .col-period {
    width: 35%;
}
.domperignon-lineup-table .col-rarity {
    width: 25%;
    letter-spacing: 2px; /* 星マークの間隔を少し広げて見やすく */
}

/* スマホ表示（画面幅が狭い時）のフォントサイズ微調整 */
@media screen and (max-width: 480px) {
    .domperignon-lineup-table {
        font-size: 13px;
    }
}

/* 温度テーブル全体のスタイル */
.domperignon-temperature-table {
    width: 100%;
    max-width: 600px; /* 横に広がりすぎないよう最大幅を制限 */
    border-collapse: collapse;
    margin: 20px auto 30px;
    font-size: 14px;
    line-height: 1.6;
}

/* ヘッダー行 */
.domperignon-temperature-table th {
    padding: 12px 8px;
    font-weight: bold;
    color: #111111;
    border-bottom: 2px solid #111111;
    text-align: left;
}

/* データ行 */
.domperignon-temperature-table td {
    padding: 12px 8px;
    color: #333333;
    border-bottom: 1px solid #e0e0e0;
}

/* 最後の行の下線 */
.domperignon-temperature-table tbody tr:last-child td {
    border-bottom: 1px solid #111111;
}

/* 各列の幅指定 */
.domperignon-temperature-table .col-lineup {
    width: 45%;
    font-weight: 500;
}
.domperignon-temperature-table .col-temp {
    width: 55%;
}

/* スマホ表示（画面幅が狭い時）の微調整 */
@media screen and (max-width: 480px) {
    .domperignon-temperature-table {
        font-size: 13px;
    }
}

/* ==========================================================================
   ドン・ペリニヨン　特集ページ用CSS ここまで
   ========================================================================== */

.product-link{
	font-size:large;
	text-align:center;
}

.product-link a{
	text-decoration: underline;
}