/* ranking.css - RANKING 共通スタイル（完成版）
   PC: 6列 / SP: 2列
   バッジ: 右上から少し内側・角丸なし・エンジ色
   SP: セクション間の余白を詰める
*/
.page-title {
    margin-top: 14px;
    font-size: 1.8em;
    text-align: left;
    font-weight: 800;
	padding-left: 10px;
}
/* ===== グリッド（PC: 6列）===== */
.ma25aw_container2{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:10px;
  max-width:100%;
  margin:0 auto;
}

/* カード（リンク全体をクリック可能に） */
.ma25aw_container2 a{
  position:relative;
  display:block;
  text-decoration:none;
  color:inherit;
}

/* 画像まわり */
.ma25aw_container2 picture,
.ma25aw_container2 img{
  width:100%;
  display:block;
}
.ma25aw_container2 img{
  height:auto;
  border:1px solid #ccc;
  box-sizing:border-box;
}

/* ===== 順位バッジ（読みやすい余白あり） ===== */
.rank-badge{
  position:absolute;
  top:2px;             /* 端から少し内側へ */
  right:2px;
  background:#800000;  /* エンジ色 */
  color:#fff;
  font-weight:bold;
  padding:8px 8px;    /* 文字のまわりに余白を増やす */
  font-size:16px;
  line-height:1;
  border-radius:0;     /* 角丸なし */
  z-index:1;
}


/* ===== スマホ最適化 ===== */
@media screen and (max-width: 768px){
  /* グリッドを2列に・下余白を抑える */
  .ma25aw_container2{
    grid-template-columns:repeat(2,minmax(0,1fr));
    margin-bottom:20px;         /* 50px → 20px に短縮 */
  }
  /* セクション見出し下の余白を詰める */
  .c-offers-section h1{
    margin-bottom:10px !important;
  }
  /* 「u-paddingTop-50」をSPでは少し詰める */
  .c-offers-section.u-paddingTop-50{
    padding-top:24px;
  }
}

/* --- SP時の見出しサイズを上げる（base.css の 599px ルールを上書き） --- */
@media screen and (max-width: 599px){
  h1.u-display--onlySP{
    font-size:18px !important;
    font-weight:bold;
  }
  .h1_1{
    font-size:16px !important;
    font-weight:600;
  }
}