@charset "UTF-8";

/* H1 design B: two soft, non-repeating full-width curves. */
.tv-page-title {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 215px;
  margin: 0;
  overflow: hidden;
  color: #202b44;
  background: #fff;
  text-align: left;
}

.tv-page-title::before,
.tv-page-title::after {
  position: absolute;
  z-index: -1;
  inset: auto 0 0;
  height: 170px;
  content: "";
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}
.tv-page-title::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221600%22%20height%3D%22180%22%20viewBox%3D%220%200%201600%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22%23f0f5ff%22%20d%3D%22M0%20153%20C245%20137%20355%20168%20610%20139%20C865%20112%201060%2054%201250%2023%20C1390%200%201510%201%201600%207%20L1600%20180%20L0%20180%20Z%22%2F%3E%3C%2Fsvg%3E"); }
.tv-page-title::after { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221600%22%20height%3D%22180%22%20viewBox%3D%220%200%201600%20180%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22%23deeafe%22%20d%3D%22M0%20174%20C250%20157%20400%20170%20600%20161%20C850%20149%201010%20132%201175%20104%20C1360%2072%201490%2059%201600%2058%20L1600%20180%20L0%20180%20Z%22%2F%3E%3C%2Fsvg%3E"); opacity: .76; }
.tv-page-title__inner {
  display: flex;
  width: min(var(--content-max-width), calc(100% - var(--content-gutter)));
  margin-inline: auto;
  align-items: baseline;
  flex-wrap: wrap;
  column-gap: 22px;
  row-gap: 12px;
}
.tv-page-title__rule {
  flex: 0 0 48px;
  align-self: center;
  width: 48px;
  height: 3px;
  background: #3f43ff;
}
.tv-page-title__name {
  font-size: clamp(34px, 3.6vw, 52px);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: .025em;
}
.tv-page-title__en {
  color: #3f65e8;
  font-family: Roboto, sans-serif;
  font-size: clamp(15px, 1.45vw, 21px);
  font-weight: 700;
  letter-spacing: .09em;
}
.tv-breadcrumbs { width: min(var(--content-max-width), calc(100% - var(--content-gutter))); margin-inline: auto; }
.tv-content-width { margin-inline: auto; }

.tv-breadcrumbs ol {
  display: flex;
  margin: 20px 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
}

.tv-breadcrumbs li + li::before {
  content: ">";
  margin: 0 5px;
}

.tv-breadcrumbs a { text-decoration: underline; }

.tv-section-title { position: relative; margin: 0 0 50px; padding: 19px 0 15px; color: #fff; background: var(--rbc-main); text-align: center; }
.tv-section-title h2 { margin: 0; font-size: 18px; }
.tv-section-title h2 span { display: block; font-family: Roboto, sans-serif; font-size: 35px; letter-spacing: .15rem; }

.tv-programs-intro { width: min(var(--content-max-width), calc(100% - var(--content-gutter))); margin: 0 auto 56px; }
.tv-programs-intro > p { margin: 0 0 60px; text-align: center; }
.tv-programs-intro > p a { display: inline-block; }
.tv-programs-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 0; gap: 28px 24px; list-style: none; }
.tv-programs-list__item { overflow: hidden; background: #fff; border: 1px solid #dce3ef; border-radius: 10px; box-shadow: 0 4px 12px rgb(20 42 88 / 8%); transition: transform .2s ease, box-shadow .2s ease; }
.tv-programs-list__item:hover, .tv-programs-list__item:focus-within { box-shadow: 0 9px 20px rgb(20 42 88 / 16%); transform: translateY(-4px); }
.tv-programs-list__link { display: block; height: 100%; color: inherit; text-decoration: none; }
.tv-programs-list__link img { display: block; width: 100%; aspect-ratio: 564 / 289; object-fit: cover; border-bottom: 1px solid #dbdbdb;}
.tv-programs-list__link dl { margin: 0; padding: 16px 18px 18px; }
.tv-programs-list__link dt { margin: 0; color: var(--rbc-main); font-size: 19px; font-weight: 700; line-height: 1.45; }
.tv-programs-list__link dd { margin: 9px 0 0; color: #4d5564; font-size: 14px; line-height: 1.75; }

.tv-program-filters { display: flex; justify-content: space-between; margin-bottom: 44px; gap: 20px; }
.tv-program-filters button { display: flex; width: 100%; min-height: 53px; align-items: center; justify-content: center; padding: 8px 12px; color: var(--rbc-main); background: #fff; border: 2px solid var(--rbc-main); border-radius: 5px; font-weight: 700; cursor: pointer; }
.tv-program-filters button.is-active { color: #fff; background: var(--rbc-main); }
.tv-programs-subtitle { margin: 0 0 25px; padding-bottom: 17px; border-bottom: 2px solid var(--rbc-main); font-size: 18px; }
.tv-programs-subtitle[hidden] { display: none; }

.tv-program-group { margin-bottom: 35px; }
.tv-program-group[hidden] { display: none; }
.tv-program-group h3 { margin: 0 0 25px; padding-bottom: 17px; border-bottom: 2px solid var(--rbc-main); font-size: 18px; }
.tv-program-group h4 { margin: 0 0 12px; font-size: 17px; }
.tv-program-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 45px; padding: 0; gap: 40px 18px; list-style: none; }
.tv-program-card { min-width: 0; }
.tv-program-card__link, .tv-program-card__link:hover, .tv-program-card__link:visited { color: inherit; text-decoration: none !important; }
.tv-program-card__link { display: block; }
.tv-program-card[hidden] { display: none; }
.tv-program-card__image { display: flex; height: 134px; margin-bottom: 20px; align-items: center; justify-content: center; overflow: hidden; background: #fff; }
.tv-program-card__image img { width: 100%; height: 100%; object-fit: contain; }
.tv-program-card__body { display: block; word-break: break-word; }
.tv-program-card__body strong { display: block; margin-bottom: 3px; font-size: 16px; }
.tv-program-card__body > span { display: block; font-size: 14px; line-height: 1.6; }
.tv-program-empty { padding: 35px; background: #f4f4f4; text-align: center; }

.tv-sns { margin-top: 70px; padding: 65px 0 75px; background: #f4f4f4; }
.tv-sns h2 { margin: 0 0 34px; color: var(--rbc-main); font-size: 36px; }
.tv-sns-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 35px; padding: 0; gap: 20px 18px; list-style: none; }
.tv-sns-card { min-width: 0; background: #fff; }
.tv-sns-card__image { display: flex; height: 134px; align-items: center; justify-content: center; overflow: hidden; }
.tv-sns-card__image img { width: 100%; height: 100%; object-fit: contain; }
.tv-sns-card__body { display: flex; min-height: 138px; padding: 20px; align-content: space-between; flex-wrap: wrap; }
.tv-sns-card__body strong { width: 100%; }
.tv-sns-card__links { display: flex; width: 100%; margin-top: 10px; align-items: center; gap: 12px; }
.tv-sns-card__links a { display: flex; width: 31px; height: 31px; align-items: center; justify-content: center; }
.tv-sns-card__links img { max-width: 31px; max-height: 31px; }
.tv-outline-button { display: flex; width: 270px; min-height: 60px; margin: 45px auto 0; align-items: center; justify-content: center; padding: 10px 30px; color: var(--rbc-main); background: #fff; border: 3px solid var(--rbc-main); font-weight: 700; text-decoration: none; }
.tv-outline-button:hover { color: #fff; background: var(--rbc-main); opacity: .8; }

@media (max-width: 768px) {
  .tv-page-title { min-height: 155px; }
  .tv-page-title::before, .tv-page-title::after { height: 115px; }
  .tv-page-title__inner { column-gap: 12px; row-gap: 9px; }
  .tv-page-title__rule { flex-basis: 30px; width: 30px; height: 3px; }
  .tv-page-title__name { font-size: 30px; }
  .tv-page-title__en { font-size: 13px; }
  .tv-breadcrumbs ol { margin: 14px 0 40px; }
  .tv-section-title { margin-bottom: 24px; padding: 16px 0 14px; }
  .tv-section-title h2 { font-size: 16px; }
  .tv-section-title h2 span { font-size: 26px; }
  .tv-programs-intro { margin-bottom: 36px; }
  .tv-programs-intro > p { margin-bottom: 26px; }
  .tv-programs-list { gap: 20px 14px; }
  .tv-programs-list__link dl { padding: 11px 12px 13px; }
  .tv-programs-list__link dt { font-size: 15px; }
  .tv-programs-list__link dd { margin-top: 6px; font-size: 12px; line-height: 1.65; }
  .tv-program-filters { flex-wrap: wrap; margin-bottom: 28px; gap: 6px; }
  .tv-program-filters button { width: calc(33.333% - 4px); min-height: 48px; padding: 5px; font-size: 12px; }
  .tv-program-group { margin-bottom: 20px; }
  .tv-program-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 30px; gap: 28px 2%; }
  .tv-program-card__image { height: auto; margin-bottom: 10px; aspect-ratio: 236 / 134; }
  .tv-program-card__body strong { font-size: 14px; }
  .tv-program-card__body > span { font-size: 11px; }
  .tv-sns { margin-top: 40px; padding: 35px 0 45px; }
  .tv-sns h2 { margin-bottom: 18px; font-size: 22px; }
  .tv-sns-grid { display: block; }
  .tv-sns-card { display: flex; position: relative; margin-bottom: 10px; padding: 10px 10px 65px; align-items: center; }
  .tv-sns-card__image { width: 38%; height: 20vw; }
  .tv-sns-card__body { width: 62%; min-height: 0; padding: 0 0 0 10px; }
  .tv-sns-card__links { position: absolute; right: 0; bottom: 10px; left: 0; justify-content: center; }
  .tv-outline-button { width: min(270px, 70vw); min-height: 52px; margin-top: 30px; }
}

@media (max-width: 500px) {
  .tv-programs-list { grid-template-columns: 1fr; gap: 18px; }
  .tv-programs-list__link dl { padding: 14px 16px 16px; }
  .tv-programs-list__link dt { font-size: 17px; }
  .tv-programs-list__link dd { margin-top: 7px; font-size: 14px; line-height: 1.7; }
}

