@charset "utf-8";
/* =========================================================
   たかさんの旧吉野川フィッシングガイド  (preview)
   local.css を整理したもの。agency.min.css / Bootstrap 4 の上に重ねる。
   ========================================================= */

:root {
  --bgd: #28320f;          /* 濃いセクション背景 */
  --bgl: #8d8049;          /* 明るいセクション背景 */
  --thema: #28320f;        /* ボタン・料金表の見出し */
  --a_link: #26A69A;       /* 選択色・ボタン押下時 */
  --a_link2: #131825;      /* リンクhover・ボタン枠 */
  --body_link: #F04A6E;    /* 本文リンク */
  --line: #0D0C0C;         /* 料金表の罫線 */
  --font-en: Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; }
body { color: #fff; }

h1, h2, h3, h4, h5, h6 { font-weight: 700; margin-bottom: 1rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.25rem; }
p, li { font-size: 1rem; line-height: 1.75rem; }

a { color: var(--body_link); }
a:hover { color: var(--a_link2); }
::selection { background: var(--a_link); }

img { border-radius: 5px; }

.container { max-width: 800px; }

.btn-primary {
  color: #fff;
  background-color: var(--thema);
  border-color: var(--a_link2);
}
.btn-primary:active,
.btn-primary:focus {
  background-color: var(--a_link) !important;
  border-color: var(--a_link2) !important;
}

/* ---------- Navigation ---------- */
#mainNav .navbar-nav .nav-item .nav-link { font-weight: 700; }
#mainNav.navbar-shrink { background-image: url(img/camo.png); }

#phone_logo { height: 1.5rem; }
#pc_logo { width: 150px; height: 2rem; padding-top: 2px; opacity: .9; }

@media (max-width: 991.98px) {
  .navbar { padding: .25rem; }

  /* ロゴ + メニューを必ず1行に */
  #mainNav > .container-fluid {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
  }
  #phone_logo {
    display: block;
    flex: 0 0 auto;
    width: auto;
    height: 20px;
    margin-right: 8px;
  }

  #top_menu_phone {
    display: flex !important;
    align-items: center;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    margin: 0 0 0 auto !important;
    padding-left: 0;
    list-style: none;
  }
  #top_menu_phone > li { flex: 0 0 auto; margin: 0 10px 0 0; }
  #top_menu_phone > li:last-child { margin-right: 0; }

  #top_menu_phone a,
  #top_menu_phone a:link,
  #top_menu_phone a:visited,
  #top_menu_phone i {
    color: #fff !important;
    text-decoration: none;
    font-weight: 700;
    font-family: var(--font-en);
  }
  #top_menu_phone a:hover,
  #top_menu_phone a:focus { color: #fff !important; opacity: .85; }
}
@media (max-width: 360px) {
  #top_menu_phone > li { margin-right: 6px; font-size: 12px; }
}

/* ---------- Hero header ---------- */
header.hero {
  padding: 50px 0;
  color: #fff;
  text-align: center;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.intro-heading { padding-bottom: 100px; }
.logo {
  width: 75%;
  filter: drop-shadow(0 0 10px rgba(205, 216, 213, .93));
}

/* ---------- Sections ---------- */
section { padding: 50px 0; }
section li { list-style-type: none; margin-bottom: 1rem; }

.bg_light { background-color: var(--bgl); }
.bg_dark  { background-color: var(--bgd); }

.section-heading { margin-top: 50px; }
section h2.section-heading { font-size: 1.75rem; margin-bottom: .75rem; }
section h3.section-subheading { font-style: normal; font-size: .9rem; margin-bottom: 2rem; }

.one_block {
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 3px dotted #ddd;
}

/* ---------- Price table ---------- */
.price { font-weight: 600; font-size: 18px; }
table.table.price th {
  vertical-align: middle;
  text-align: center;
  color: #fff;
  background-color: var(--thema);
  border: 2px solid var(--line);
}
table.table.price td.yen {
  width: 50%;
  font-family: 'Oxanium', cursive;
  font-size: 24px;
  color: var(--thema);
  background-color: #eee;
  border: 2px solid var(--line);
}
.cc-logos { max-width: 100%; margin-bottom: 2rem; }

/* ---------- Access ---------- */
.map { display: block; width: 100%; height: 300px; border: 0; }

/* ---------- Schedule / Calendar (global_conf.php の calendar() が出力) ---------- */
#sched button { padding: .25rem; font-size: 9px; }

#cal {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}
#cal th,
#cal td {
  width: 14.285714%;
  padding: .5rem .25rem;
  box-sizing: border-box;
  word-break: break-word;
  overflow-wrap: anywhere;
}
#cal th { text-align: center; }
#cal td { font-size: 20px; font-family: var(--font-en); }
#cal tr > *:last-child { border-right: 0; }
@supports (-webkit-touch-callout: none) {
  #cal { width: calc(100% - 1px); }  /* iOS Safari のはみ出し対策 */
}
.sat { color: #6CA9E9; }
.sun { color: #B70407; }
.today { opacity: .5; }

/* ---------- Footer ---------- */
footer {
  padding: 10px 0;
  background-color: #048a42;
  background-image: url(img/camo.png);
}
footer li { margin-bottom: 1rem; list-style: none; color: #fff; }
footer li a { color: #fff; }
footer .link-sub { color: #ffcc00; }

/* ---------- Back to top ---------- */
#topcontrol {
  position: fixed;
  right: 5px;
  bottom: 5px;
  z-index: 1030;
  opacity: 0;
  pointer-events: none;
  cursor: pointer;
  transition: opacity .4s;
}
#topcontrol.is-visible { opacity: 1; pointer-events: auto; }

/* ---------- Tablet〜 ---------- */
@media (min-width: 768px) {
  .logo { width: 50%; }
  h3 { font-size: 1.75rem; }
  h4 { font-size: 1.5rem; }
  section h2.section-heading { font-size: 2.5rem; }
}

/* ---------- PC ---------- */
@media (min-width: 940px) {
  .logo { width: 100%; }
  #sched button { font-size: 14px; }
}
