/* ===== リセット簡略版 ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ===== 全体ラッパー ===== */
body {
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  color: #000;
  background: #fff;
}

.wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  max-width: 720px;      /* PC での最大横幅 */
  margin: 0 auto;
  padding: 0 1rem;
}

/* ===== ヘッダー ===== */
.hero {
  width: 100%;
  background: #ff6600;
  color: #fff;
  padding: 0.75rem 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.hero__logo img { max-width: 200px; height: auto; }


/* ===== Flexslider 調整 ===== */
/* ── 新しいラッパー デフォルトは 100%(スマホ) ───────────────────── */
.slider-box{
  width: 100%;
  margin: 0 auto;             /* 中央寄せ */
  border: 10px solid #669900; /* 10px の緑枠を一括で */
  border-radius: 5px;         /* 角丸も一括 */
  overflow: hidden;           /* はみ出しカット */
}

/*  PC では 65% に縮める */
@media (min-width:768px){
  .slider-box{ width:65%; }
}

/* ── スライダー：下の枠線と角丸をカット ── */
.flexslider{
  width: 100%;                 /* PC 幅を 65% に */
  border: none;               /* 枠は親に任せる */
  border-radius: 0;
  margin-bottom: 0;           /* 隙間ゼロ */
  background: #669900;        /* 読み込み前の色合わせ */
}

/* ── ナビ帯：上の枠線をゼロに、色と余白だけ ── */
.slider-nav-bar{
  background: #669900;
  padding: 0.5rem 0;
  text-align: center;
}

.flexslider img {
  width: 100%;
  height: auto;
  display: block;
}

/* ── 緑帯のコンテナ ── */
.slider-nav-bar{
/*  width: 100%;*/
  background:#669900;
  text-align:center;
  padding: .4rem 0;            /* ボタンまわりの余白はお好みで */
}

/* ── ナビ自体の余白を詰める ── */
.slider-nav{
  justify-content:center;
  align-items:center;
  margin-top:.5rem;
}

/* --- カスタム 3 ボタン横並び --- */
.slider-nav{
  margin-top: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* 共通プロパティはここで一括 */
.slider-prev,
.slider-next{
  width:48px;
  height:48px;
  cursor: pointer;           /* ← これが無いと矢印のまま */
  border:none;                       /* 既定ボーダーを消す */
  background-color:transparent;      /* ← ここを追加 */
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  -webkit-appearance:none;           /* iOS/Safari 用 */
  appearance:none;                   /* そのほか */
}


/* ── ホバー時：少し薄く（10% 明るく）── */
.slider-prev:hover,
.slider-next:hover{
  filter: brightness(1.1);        /* 1.0 = 等倍／1.1 = 10% 明るい */
}

.slider-prev { background-image:url("../img/next.png"); }  /* 左矢印 */
.slider-next { background-image:url("../img/back.png"); }  /* 右矢印 */

/* 先頭・末尾でボタンを「見えなくして無効化」 */
.slider-prev.disabled,
.slider-next.disabled{
  opacity: 0;              /* 完全に透明に */
  pointer-events: none;    /* クリック不可 */
  visibility: hidden;      /* 画面リーダーにも非表示 */
}

/* もしまだ既定矢印が残る場合の念押し */
.flex-direction-nav{ display:none !important; }

/* トップへ戻る */
.btn-home{
  width: 48px;
  height: 48px;
  margin: 0 50px;
  display: inline-block;
  background: url("../img/top.png") center / contain no-repeat;
}

/* ===== フッター ===== */
.site-footer{
  width: 100%;
  height: auto;
  background:#ff6600;
  color:#fff;
  font-size:0.8em;
  letter-spacing:0.5px;
  line-height:1.6;
  text-align:center;
  padding:0.8rem 1rem;
}

/* ---- コピーライト帯 ---- */
.footer-bottom small{
  font-size:0.8em;
  letter-spacing:0.5px;
}