/* ===== SHOP専用CSS（楽天ショップ完全コピー・水色版）===== */
body{margin:0;background:#f5fbfc;color:#333;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","Yu Gothic","Meiryo",sans-serif}
a{text-decoration:none}
img{max-width:100%;height:auto;vertical-align:bottom}
*,*::before,*::after{box-sizing:border-box}
.rk-container{max-width:1400px;margin:0 auto;padding:0 16px}

/* ヘッダー */
.rk-header{background:#fff;border-bottom:1px solid #b2e0e8}
.rk-header-inner{min-height:82px;display:flex;align-items:center;gap:20px;padding:12px 0}
.rk-brand{display:flex;align-items:center;gap:12px;min-width:0;flex:0 0 auto;padding-left:8px}
.rk-brand-text{display:flex;flex-direction:column;gap:4px;min-width:0}
.rk-brand-title{font-size:20px;font-weight:700;color:#006978;line-height:1.3}
.rk-brand-sub{font-size:13px;color:#778f93;line-height:1.5}
.rk-header-search{margin-left:auto;display:flex;align-items:center;gap:10px;flex:1;max-width:720px;min-width:0}
.rk-header-search-input{flex:1 1 auto;min-width:0;width:100%;height:48px;padding:0 16px;border:2px solid #7dd8e3;border-radius:12px;background:#fff;font-size:15px;outline:none;appearance:none;-webkit-appearance:none}
.rk-header-search-input::placeholder{color:#8ab0b5}
.rk-header-search-btn{flex:0 0 auto;height:48px;padding:0 22px;border:none;border-radius:12px;background:#26c6da;color:#fff;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;appearance:none;-webkit-appearance:none}
.rk-header-search-btn:hover{background:#00acc1}

/* メイン */
.rk-main-wrap{padding:20px 0 40px}
.rk-breadcrumb{margin:0 0 18px;font-size:14px;line-height:1.8;color:#8c9fa0}
.rk-breadcrumb a{color:#00838f;font-weight:500}
.rk-breadcrumb span{margin:0 4px}

/* 大カテゴリタブ */
.rk-category-nav-wrap{margin:0 0 0}
.rk-category-nav{display:flex;flex-wrap:wrap;gap:12px 10px;align-items:flex-end}
.rk-category-link{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 22px 10px;border-radius:14px 14px 0 0;background:linear-gradient(180deg,#f0fbfc 0%,#e0f7fa 100%);border:1px solid #7dd8e3;border-bottom:3px solid #4dd0e1;color:#006978;font-size:15px;font-weight:700;line-height:1.4;box-shadow:0 2px 6px rgba(0,131,143,.05);transition:all .2s ease}
.rk-category-link:hover{transform:translateY(-1px);background:linear-gradient(180deg,#f5fdfe 0%,#e8fafc 100%)}
.rk-category-link.is-active{background:linear-gradient(180deg,#4dd0e1 0%,#26c6da 100%);border-color:#26c6da;border-bottom:3px solid #00acc1;color:#fff;box-shadow:0 4px 10px rgba(0,172,193,.2)}

/* 子カテゴリ */
.rk-subcategory-wrap{margin:0 0 22px;background:#fff;border:1px solid #b2e0e8;border-radius:18px;padding:14px}
.rk-subcategory-scroll{display:flex;flex-wrap:wrap;gap:10px 8px}
.rk-subcategory-link{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 14px 6px;border-radius:11px;background:linear-gradient(180deg,#f5fdfe 0%,#e8fafc 100%);border:1px solid #b2e0e8;color:#006978;font-size:12px;font-weight:600;line-height:1.3;white-space:nowrap;box-shadow:0 1px 4px rgba(0,131,143,.05);transition:all .2s ease}
.rk-subcategory-link:hover{transform:translateY(-1px);background:linear-gradient(180deg,#e8fafc 0%,#d0f4f7 100%)}
.rk-subcategory-link.is-active{background:linear-gradient(180deg,#00838f 0%,#006978 100%);color:#fff;border-color:#006978;box-shadow:0 3px 8px rgba(0,105,120,.15)}

/* レイアウト（楽天と同じ：メイン＋右サイドバー） */
.rk-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
.rk-main-content{min-width:0}
.rk-sidebar{min-width:0;width:100%}

/* タイトル・件数 */
.rk-title{margin:0 0 10px;font-size:28px;color:#006978;font-weight:700}
.rk-sub{margin:0 0 18px;color:#777;font-size:14px;line-height:1.8}

/* 商品グリッド（4列・楽天と同じ） */
.rk-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}

/* 商品カード */
.rk-card{background:#fff;border:1px solid #b2e0e8;border-radius:18px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.05);display:flex;flex-direction:column;min-width:0;transition:transform .2s,box-shadow .2s}
.rk-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,131,143,.13)}
.rk-thumb{padding:16px 16px 0;text-align:center;background:#fff}
.rk-thumb a{display:block}
.rk-thumb img{width:100%;max-width:220px;height:220px;object-fit:contain;border-radius:10px;display:block;margin:0 auto}
.rk-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1;min-width:0}
.rk-shop-badge{display:inline-block;background:#e0f7fa;color:#006978;font-size:10px;font-weight:700;padding:2px 10px;border-radius:20px;align-self:flex-start}
.rk-name{margin:0;font-size:13px;line-height:1.7;font-weight:400;height:4.4em;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.rk-name a{color:#333}
.rk-price{color:#e3505d;font-size:18px;font-weight:700}
.rk-price.unk{color:#aaa;font-size:13px;font-weight:400} .rk-price.unknown{color:#aaa;font-size:13px;font-weight:400}

/* ★ 詳細を見るボタン（記事側と同じグラデーション・角丸デザイン）*/
.rk-btn{
  margin-top:auto;
  display:block;
  width:100%;
  text-align:center;
  padding:10px 16px;
  background:linear-gradient(135deg,#26c6da 0%,#00838f 100%);
  color:#fff !important;
  border-radius:8px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.03em;
  box-shadow:0 3px 10px rgba(0,172,193,.3);
  transition:opacity .2s,transform .2s;
  text-decoration:none;
}
.rk-btn:hover{opacity:.88;transform:translateY(-1px);color:#fff !important}
.rk-btn::after{content:" →"}

/* 空・エラー */
.rk-message{padding:24px;background:#fff;border:1px solid #b2e0e8;border-radius:18px;text-align:center;color:#555}
.rk-not-found{max-width:560px;margin:0 auto;padding:48px 24px;background:#fff;border-radius:18px;border:2px solid #b2e0e8;text-align:center}
.rk-not-found .ico{font-size:64px;margin-bottom:16px}
.rk-not-found h1{font-size:22px;color:#006978;margin-bottom:12px;font-weight:700}
.rk-not-found p{color:#666;margin-bottom:20px;line-height:1.8;font-size:14px}
.rk-not-found-btn{display:inline-block;padding:12px 28px;background:linear-gradient(135deg,#26c6da,#00838f);color:#fff;border-radius:25px;font-weight:700;font-size:14px;margin:6px}
.rk-not-found-btn.pink{background:linear-gradient(135deg,#f48fb1,#e91e63)}

/* サイドバー */
.rk-side-box{background:#fff;border:1px solid #b2e0e8;border-radius:18px;padding:16px;margin-bottom:18px}
.rk-side-title{margin:0 0 14px;font-size:18px;color:#006978;font-weight:700}
.rk-side-links{display:flex;flex-direction:column;gap:10px}
.rk-side-main{display:block;padding:12px 14px;border-radius:12px;background:#f0fbfc;border:1px solid #7dd8e3;color:#006978;font-size:14px;font-weight:700}
.rk-side-main:hover{background:#e0f7fa}
.rk-side-main.is-active{background:#26c6da;border-color:#26c6da;color:#fff}
.rk-side-sub{display:flex;flex-direction:column;gap:8px;padding:4px 0 4px 12px}
.rk-side-sub-link{display:block;color:#555;font-size:13px;line-height:1.6}
.rk-side-sub-link:hover{color:#006978}
.rk-side-sub-link.is-active{color:#006978;font-weight:700}
.rk-side-tags{display:flex;flex-wrap:wrap;gap:8px}
.rk-side-tag{display:inline-block;padding:8px 12px;border-radius:999px;background:#f0fbfc;border:1px solid #7dd8e3;color:#006978;font-size:12px;font-weight:700}
.rk-side-tag:hover{background:#e0f7fa}
.rk-side-ad{width:100%;padding:0}

/* ページャー */
.rk-pager{margin-top:24px;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;align-items:center}
.rk-pager a,.rk-pager span{display:inline-block;min-width:40px;padding:10px 12px;border-radius:999px;border:1px solid #7dd8e3;background:#fff;color:#006978;font-size:13px;text-align:center;transition:background .15s}
.rk-pager a:hover{background:#e0f7fa}
.rk-pager .current{background:#26c6da;color:#fff;border-color:#26c6da;font-weight:700}
.rk-pager .rk-next-page{min-width:auto;padding:10px 18px}

/* 広告エリア */
.rk-ad-bottom{margin-top:24px;text-align:center}

/* フッター */
.rk-footer{margin-top:48px;background:#f0fbfc;border-top:1px solid #b2e0e8}
.rk-footer-inner{padding-top:34px;padding-bottom:20px}
.rk-footer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px;align-items:start;width:100%}
.rk-footer-column{min-width:0}
.rk-footer-label{margin:0 0 4px;font-size:11px;letter-spacing:.08em;color:#4dd0e1;font-weight:700;text-transform:uppercase;line-height:1.4}
.rk-footer-heading{margin:0 0 16px;font-size:18px;font-weight:700;color:#26c6da;line-height:1.4;padding-bottom:12px;border-bottom:1px solid #b2e0e8}
.rk-footer-menu{list-style:none;margin:0;padding:0}
.rk-footer-menu li{margin:0;border-bottom:1px solid #d0f0f5}
.rk-footer-menu a{position:relative;display:block;padding:14px 22px 14px 0;color:#5a7a80;font-size:14px;line-height:1.8;transition:.2s ease}
.rk-footer-menu a::after{content:">";position:absolute;right:0;top:50%;transform:translateY(-50%);color:#7dd8e3;font-size:20px;line-height:1}
.rk-footer-menu a:hover{color:#00838f;padding-left:4px}
.rk-footer-bottom{margin-top:26px;padding-top:16px;border-top:1px solid #b2e0e8;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.rk-footer-site a{color:#006978;font-size:14px;font-weight:700}
.rk-footer-copy{color:#6a9098;font-size:12px}

/* TOPボタン */
.rk-top-btn{position:fixed;bottom:24px;right:20px;background:#26c6da;color:#fff;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;text-decoration:none;box-shadow:0 4px 12px rgba(0,172,193,.35);opacity:0;transition:opacity .3s;z-index:100}
.rk-top-btn.show{opacity:1}

/* レスポンシブ */
@media(max-width:1180px){
  .rk-header-inner{flex-wrap:wrap}
  .rk-header-search{width:100%;max-width:none;margin-left:0}
  .rk-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:860px){
  .rk-layout{grid-template-columns:1fr}
  .rk-sidebar{order:2}
}
@media(max-width:980px){.rk-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}}
@media(max-width:700px){
  .rk-container{padding:0 12px}
  .rk-header-inner{flex-direction:column;align-items:stretch;gap:12px}
  .rk-brand{width:100%}
  .rk-header-search{width:100%;flex-direction:column;align-items:stretch;gap:10px;max-width:none;margin-left:0}
  .rk-header-search-input,.rk-header-search-btn{width:100%;display:block;min-width:0;max-width:100%}
  .rk-category-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:stretch}
  .rk-category-link{width:100%;min-height:44px;text-align:center;border-radius:14px 14px 0 0}
  .rk-grid{grid-template-columns:1fr;gap:14px}
  .rk-card{flex-direction:row;align-items:flex-start;padding:12px;border-radius:14px}
  .rk-thumb{width:110px;min-width:110px;padding:0;margin-right:12px;background:none}
  .rk-thumb img{width:110px;height:110px;max-width:none}
  .rk-body{flex:1;padding:0;gap:6px}
  .rk-name{height:auto;font-size:13px;-webkit-line-clamp:2}
  .rk-btn{display:none}
  .rk-btn--rakuten{display:none}
  .rk-footer{margin-top:36px}
  .rk-footer-grid{grid-template-columns:1fr;gap:22px}
  .rk-footer-heading{font-size:17px;margin-bottom:12px;padding-bottom:10px}
  .rk-footer-menu a{padding:12px 20px 12px 0;font-size:13px}
  .rk-footer-bottom{flex-direction:column;align-items:flex-start;gap:8px}
}

@media(max-width:860px){.rk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ===== item.php専用 ===== */
.item-price{color:#e3505d !important}
.item-price.unk{color:#aaa !important;font-size:14px;font-weight:400}
.item-img img{max-width:100%;height:auto;object-fit:contain;border-radius:10px;display:block;margin:0 auto}

/* item.php 購入ボタン */
.buy-btn{
  display:block;
  text-align:center;
  background:linear-gradient(135deg,#26c6da 0%,#00838f 100%);
  color:#fff !important;
  padding:18px 24px;
  border-radius:8px;
  font-size:16px;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 4px 14px rgba(0,172,193,.28);
  transition:opacity .2s,transform .2s;
}
.buy-btn:hover{opacity:.88;transform:translateY(-1px)}

/* ===== 楽天混合カード ===== */
.rk-badge--rakuten{
    background:#e0f7fa;
    color:#006978;
    border-radius:20px;
}
.rk-card--mixed{
    border-color:#b2e0e8;
}
.rk-btn--rakuten{
    display:block;
    width:100%;
    text-align:center;
    padding:10px 16px;
    background:linear-gradient(135deg,#26c6da 0%,#00838f 100%);
    color:#fff !important;
    border-radius:8px;
    font-size:13px;
    font-weight:700;
    letter-spacing:.03em;
    text-decoration:none;
    margin-top:auto;
    transition:opacity .2s,transform .2s;
    box-shadow:0 3px 10px rgba(0,172,193,.3);
}
.rk-btn--rakuten:hover{
    opacity:.88;
    transform:translateY(-1px);
    color:#fff !important;
}
.rk-btn--rakuten::after{content:" →"}

/* ===== カテゴリ連動記事リンク ===== */
.shop-article-link{display:flex;align-items:center;gap:8px;padding:14px 18px;background:#e0f7fa;border-radius:12px;margin:16px 0;font-size:14px}
.shop-article-link a{color:#006978;font-weight:700;text-decoration:none}
.shop-article-link a:hover{text-decoration:underline}
.shop-article-icon{font-size:18px}

/* ===== 注目キーワード ===== */
.shop-trend-wrap{background:#fff;border:1px solid #b2e0e8;border-radius:14px;padding:16px;margin:16px 0}
.shop-trend-title{font-size:14px;font-weight:700;color:#006978;margin-bottom:12px}
.shop-trend-tags{display:flex;flex-wrap:wrap;gap:8px}
.shop-trend-tag{display:inline-block;padding:7px 14px;background:#f0fbfc;border:1px solid #7dd8e3;border-radius:999px;color:#006978;font-size:13px;font-weight:700;text-decoration:none;transition:background .15s}
.shop-trend-tag:hover{background:#e0f7fa}

/* スマホ1列 */
@media(max-width:700px){.rk-grid{grid-template-columns:1fr!important}}
@media(max-width:860px){.rk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ===== カテゴリ導入テキスト ===== */
.shop-intro-text{
    font-size:14px;
    line-height:1.9;
    color:#4a7a82;
    background:#f0fbfc;
    border-left:4px solid #26c6da;
    border-radius:0 10px 10px 0;
    padding:14px 18px;
    margin:0 0 18px;
}

/* ===== item.php SEO強化スタイル ===== */
.item-stock-badge{
    display:inline-block;
    background:#e0f7fa;
    color:#00838f;
    font-size:12px;
    font-weight:700;
    padding:3px 12px;
    border-radius:999px;
    margin-bottom:8px;
}
.item-spec{
    margin:16px 0;
    border:1px solid #b2e0e8;
    border-radius:12px;
    overflow:hidden;
    font-size:13px;
}
.item-spec-row{
    display:flex;
    align-items:baseline;
    border-bottom:1px solid #e0f7fa;
    padding:10px 14px;
    gap:12px;
}
.item-spec-row:last-child{border-bottom:none}
.item-spec-row dt{
    min-width:70px;
    color:#778f93;
    font-weight:700;
    flex-shrink:0;
}
.item-spec-row dd{
    margin:0;
    color:#333;
    line-height:1.6;
}
