/* Grape Amazon Link - 商品リンクの表示 */
.gal { line-height: 1.4; font-size: 14px; }
.gal a.gal-link { text-decoration: none; color: inherit; }
.gal img { border: 0; max-width: 100%; height: auto; }

/* 詳細（.item-affiliate）
   テーマ（grape）に同じクラスの CSS がある前提。ここはテーマに無い場合の最低限で、
   :where() で詳細度をゼロにしてあるので、テーマ側の指定が必ず優先される。 */
:where(.gal-detail.item-affiliate) { display: flex; gap: 16px; margin: 1.5em 0; padding: 16px; background: #fff; border: 1px solid #ddd; box-sizing: border-box; }
:where(.gal-detail.item-affiliate figure) { margin: 0; flex: 0 0 120px; }
:where(.gal-detail.item-affiliate figure img) { display: block; width: 100%; height: auto; }
:where(.gal-detail .item-affiliate_text) { flex: 1; min-width: 0; }
:where(.gal-detail .item-affiliate_text p) { margin: 0 0 6px; }
:where(.gal-detail .item-affiliate_text a) { text-decoration: none; color: inherit; }
:where(.gal-detail .item-affiliate_text .title) { font-weight: bold; }
:where(.gal-detail .item-affiliate_text .detail) { color: #555; font-size: 13px; }
:where(.gal-detail .item-affiliate_text .links) { margin-top: 10px; }
:where(.gal-detail .item-affiliate_text .links a) { display: block; padding: 10px; text-align: center; color: #333; background: #ffd814; font-weight: bold; text-decoration: none; }
:where(.gal-detail .item-affiliate_text .links a.rakuten) { background: #be0000; color: #fff; }
:where(.gal-detail .item-affiliate_text .links a.yahoo) { background: #d14615; color: #fff; }
/* 価格ブロック（テーマの .item-affiliate .price / .yen / details.date に合わせたマークアップ）。テーマ側の指定が優先される */
:where(.gal-detail .price) { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; margin: 0 0 8px; }
:where(.gal-detail .yen) { color: #b12704; font-size: 16px; font-weight: bold; }
:where(.gal-detail details.date) { color: #999; font-size: 11px; }
:where(.gal-detail details.date summary) { cursor: pointer; list-style: none; }
:where(.gal-detail details.date summary)::-webkit-details-marker { display: none; }
:where(.gal-detail details.date summary i) { display: inline-block; width: 1.4em; height: 1.4em; line-height: 1.4em; margin-left: 4px; border: 1px solid #bbb; border-radius: 50%; text-align: center; font-style: normal; font-size: 10px; color: #777; vertical-align: middle; }
:where(.gal-detail details.date[open] summary i) { background: #eee; }
:where(.gal-detail details.date > span) { display: block; margin-top: 4px; color: #777; line-height: 1.5; }
@media (max-width: 480px) {
	:where(.gal-detail.item-affiliate) { flex-direction: column; align-items: center; text-align: center; }
	:where(.gal-detail.item-affiliate figure) { flex: none; width: 160px; }
}

/* 画像＋テキスト */
.gal-image-text { margin: 1em 0; text-align: center; }
.gal-image-text .gal-link { display: inline-block; }
.gal-image-text .gal-image img { max-width: 200px; max-height: 200px; }
.gal-image-text .gal-title { display: block; margin-top: 6px; color: #222; }
.gal-image-text .gal-link:hover .gal-title { text-decoration: underline; }

/* テキスト */
.gal-text .gal-link { color: #0066c0; text-decoration: underline; }