/* =========================================================
   パートナーポータルサイト「TETORIについて」ページ専用
   TETORIブランドサイト（tetori.link）風デザイン
   ※ body[data-page-id="42740"] = /tetori ページだけに効きます
   ※ トップページ用CSSの下に、続けて貼り付けてください
   ========================================================= */

/* ---------- 全体 ---------- */
body[data-page-id="42740"] {
  background: #ffffff !important;
  color: #333333 !important;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
  -webkit-font-smoothing: antialiased;
}
body[data-page-id="42740"] .layout-page,
body[data-page-id="42740"] .layout-body-header,
body[data-page-id="42740"] .layout-body-footer {
  background: #ffffff !important;
}
body[data-page-id="42740"] a {
  transition: color .25s, background-color .25s, border-color .25s, opacity .25s, transform .25s, box-shadow .25s;
}

/* ---------- ヘッダー ---------- */
body[data-page-id="42740"] .block-HeaderSet2 {
  background: rgba(255, 255, 255, .97) !important;
  border-bottom: 1px solid #f5d9e5 !important;
}
body[data-page-id="42740"] .part-HeaderSet2 .menu .piece-HorizontalList li a {
  position: relative;
  color: #8a1874 !important;
  font-weight: 700 !important;
  letter-spacing: .04em;
  background: none !important;
}
body[data-page-id="42740"] .part-HeaderSet2 .menu .piece-HorizontalList li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 0;
  height: 2px;
  background: #8a1874;
  transition: width .25s;
}
body[data-page-id="42740"] .part-HeaderSet2 .menu .piece-HorizontalList li a:hover::after {
  width: 100%;
}

/* ---------- パンくず ---------- */
body[data-page-id="42740"] .block-Breadcrumb,
body[data-page-id="42740"] .part-Breadcrumb {
  background: #fff8fb !important;
  border: none !important;
}
body[data-page-id="42740"] .piece-Breadcrumb,
body[data-page-id="42740"] .piece-Breadcrumb .delimiter {
  color: #999999 !important;
  font-size: 13px !important;
}
body[data-page-id="42740"] .piece-Breadcrumb a {
  color: #8a1874 !important;
  text-decoration: none !important;
}
body[data-page-id="42740"] .piece-Breadcrumb a:hover {
  text-decoration: underline !important;
}

/* ---------- 見出し（共通） ---------- */
body[data-page-id="42740"] .block-Heading .part-Heading,
body[data-page-id="42740"] .block-SetA .b-head h1 {
  position: relative;
  background: none !important;
  border: none !important;
  padding: 0 0 0 20px !important;
  margin: 0 0 28px !important;
  text-align: left !important;
}
body[data-page-id="42740"] .block-Heading .part-Heading::before,
body[data-page-id="42740"] .block-SetA .b-head h1::before {
  content: "" !important;
  display: block !important;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 1.3em;
  border-radius: 3px;
  background: linear-gradient(180deg, #e85382 0%, #8a1874 100%) !important;
  border: none !important;
}
body[data-page-id="42740"] .block-Heading .part-Heading::after,
body[data-page-id="42740"] .block-SetA .b-head h1::after {
  display: none !important;
}
body[data-page-id="42740"] .block-Heading .piece-Heading,
body[data-page-id="42740"] .block-SetA .b-head h1 span {
  color: #552277 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: .05em;
  line-height: 1.5;
  background: none !important;
  border: none !important;
  padding: 0 !important;
}
body[data-page-id="42740"] .block-Heading,
body[data-page-id="42740"] .block-SetA {
  margin-top: 64px !important;
}

/* ---------- ページタイトル（TETORIについて） ---------- */
body[data-page-id="42740"] .layout-contents > .block-Heading:first-child .part-Heading {
  padding: 0 0 22px !important;
  text-align: center !important;
}
body[data-page-id="42740"] .layout-contents > .block-Heading:first-child .part-Heading::before {
  left: 50%;
  top: auto;
  bottom: 0;
  transform: translateX(-50%);
  width: 64px;
  height: 4px;
  border-radius: 2px;
  background: linear-gradient(90deg, #e85382 0%, #8a1874 100%) !important;
}
body[data-page-id="42740"] .layout-contents > .block-Heading:first-child .piece-Heading {
  font-size: 32px !important;
  letter-spacing: .08em;
}
body[data-page-id="42740"] .layout-contents > .block-Heading:first-child {
  margin-top: 56px !important;
}
body[data-page-id="42740"] .block-Heading .part-RichText {
  max-width: 820px;
  margin: 0 auto !important;
  text-align: center !important;
}

/* ---------- 本文 ---------- */
body[data-page-id="42740"] .piece-RichText {
  color: #333333 !important;
  font-size: 15px !important;
  line-height: 2 !important;
  letter-spacing: .03em;
}

/* ---------- 売り方を学ぶ（動画）エリア ---------- */
body[data-page-id="42740"] .block-SetA {
  background: #fff8fb !important;
  border-radius: 20px !important;
  padding: 48px 40px 40px !important;
}
body[data-page-id="42740"] .part-SetA {
  background: #ffffff !important;
  border: none !important;
  border-radius: 12px !important;
  overflow: visible !important;
  height: auto !important;
  padding: 0 0 24px !important;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, .16);
}
body[data-page-id="42740"] .part-SetA:hover {
  box-shadow: 4px 6px 18px rgba(138, 24, 116, .22);
  transform: translateY(-2px);
}
body[data-page-id="42740"] .part-SetA {
  transition: box-shadow .25s, transform .25s;
}
body[data-page-id="42740"] .part-SetA .piece-Heading {
  order: 0;
  color: #552277 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  background: none !important;
  border: none !important;
  padding: 18px 20px 12px !important;
  margin: 0 !important;
}
body[data-page-id="42740"] .part-SetA .piece-Heading::before,
body[data-page-id="42740"] .part-SetA .piece-Heading::after {
  display: none !important;
}
body[data-page-id="42740"] .part-SetA .piece-Image {
  position: relative;
  margin: 0 !important;
  padding: 0 !important;
}
body[data-page-id="42740"] .part-SetA .piece-Image a {
  position: relative;
  display: block;
}
body[data-page-id="42740"] .part-SetA .piece-Image a::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(138, 24, 116, .88) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5v11l9-5.5z' fill='%23fff'/%3E%3C/svg%3E") no-repeat 58% 50% / 26px 26px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .2);
  transition: transform .25s, background-color .25s;
}
body[data-page-id="42740"] .part-SetA .piece-Image a:hover::after {
  transform: translate(-50%, -50%) scale(1.1);
  background-color: rgba(232, 83, 130, .92);
}
body[data-page-id="42740"] .part-SetA .piece-Image img {
  border-radius: 0 !important;
}
body[data-page-id="42740"] .part-SetA .piece-RichText {
  padding: 14px 20px 6px !important;
  color: #555555 !important;
  font-size: 14px !important;
  line-height: 1.85 !important;
}

/* ---------- 「詳細」ボタン（TETORIのアウトラインボタン風） ---------- */
body[data-page-id="42740"] .part-SetA .piece-Button {
  padding: 10px 20px 0 !important;
  text-align: center;
}
body[data-page-id="42740"] .part-SetA .piece-Button a {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  max-width: 240px;
  padding: 10px 20px !important;
  background: #ffffff !important;
  border: 2px solid #8a1874 !important;
  border-radius: 100px !important;
  color: #8a1874 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: .08em;
  text-decoration: none !important;
  box-shadow: none !important;
}
body[data-page-id="42740"] .part-SetA .piece-Button a::before,
body[data-page-id="42740"] .part-SetA .piece-Button a::after {
  display: none !important;
}
body[data-page-id="42740"] .part-SetA .piece-Button a:hover {
  background: #8a1874 !important;
  color: #ffffff !important;
  opacity: 1 !important;
}

/* ---------- 資料ダウンロード（TETORIの資料請求ボタン風） ---------- */
body[data-page-id="42740"] .piece-MultiColumnList li a {
  position: relative;
  display: block;
  max-width: 420px;
  margin: 0 auto !important;
  padding: 16px 60px 16px 32px !important;
  background: #7cba00 !important;
  border: 2px solid #ffffff !important;
  border-radius: 100px !important;
  color: #ffffff !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: .06em;
  text-align: center;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(124, 186, 0, .3);
}
body[data-page-id="42740"] .piece-MultiColumnList li a::before {
  display: none !important;
}
body[data-page-id="42740"] .piece-MultiColumnList li a::after {
  content: "";
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v11m0 0l-5-5m5 5l5-5M5 20h14' stroke='%23fff' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}
body[data-page-id="42740"] .piece-MultiColumnList li a:hover {
  background: #6aa300 !important;
  transform: translateY(-2px);
  opacity: 1 !important;
}

/* ---------- ページトップ・フッター ---------- */
body[data-page-id="42740"] .part-PageTop a {
  color: #8a1874 !important;
  font-weight: 700;
  letter-spacing: .08em;
  background: none !important;
  border: none !important;
}
body[data-page-id="42740"] .block-Copyright {
  background: #441c5e !important;
  padding: 26px 0 !important;
}
body[data-page-id="42740"] .block-Copyright p {
  color: #ffffff !important;
  font-size: 12px !important;
  letter-spacing: .08em;
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 767px) {
  body[data-page-id="42740"] .layout-contents > .block-Heading:first-child .piece-Heading {
    font-size: 24px !important;
  }
  body[data-page-id="42740"] .block-Heading .piece-Heading,
  body[data-page-id="42740"] .block-SetA .b-head h1 span {
    font-size: 20px !important;
  }
  body[data-page-id="42740"] .block-Heading .part-RichText {
    text-align: left !important;
  }
  body[data-page-id="42740"] .block-SetA {
    padding: 32px 16px 24px !important;
    border-radius: 14px !important;
  }
  body[data-page-id="42740"] .piece-MultiColumnList li a {
    font-size: 15px !important;
  }
}

/* =========================================================
   スマホ表示（TETORIについてページ）
   ハンバーガーメニュー・ヘッダー・ページTOPボタン
   ========================================================= */
@media screen and (max-width: 767px) {

  /* ヘッダー */
  html body[data-page-id="42740"] .block-HeaderSet2 {
    background: #ffffff !important;
    border-bottom: 1px solid #eaeff4 !important;
  }
  html body[data-page-id="42740"] .part-HeaderSet2 h1 img {
    max-width: 170px !important;
    height: auto !important;
    margin-left: 12px !important;
  }

  /* MENUボタン → 3本線のハンバーガー */
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger {
    width: 56px !important;
    background: #ffffff !important;
    vertical-align: middle !important;
  }
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger a {
    position: relative;
    display: block !important;
    width: 56px !important;
    height: 56px !important;
    background: none !important;
  }
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger a::before,
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger a::after,
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger span::before {
    content: "" !important;
    position: absolute;
    left: 17px;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: #0f1419 !important;
    transition: transform .3s, top .3s, opacity .3s;
  }
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger a::before { top: 20px; }
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger span::before { top: 27px; }
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger a::after { top: 34px; }
  html body[data-page-id="42740"] .part-HeaderSet2 .trigger span {
    font-size: 0 !important;
    color: transparent !important;
    background: none !important;
  }
  /* メニューが開いているとき → × */
  html body[data-page-id="42740"]:has(.TriggerMenu.active) .part-HeaderSet2 .trigger a::before {
    top: 27px;
    transform: rotate(45deg);
  }
  html body[data-page-id="42740"]:has(.TriggerMenu.active) .part-HeaderSet2 .trigger a::after {
    top: 27px;
    transform: rotate(-45deg);
  }
  html body[data-page-id="42740"]:has(.TriggerMenu.active) .part-HeaderSet2 .trigger span::before {
    opacity: 0;
  }

  /* 開いたメニュー */
  html body[data-page-id="42740"] .TriggerMenu {
    background: #ffffff !important;
    border-top: 1px solid #eaeff4 !important;
    border-bottom: 1px solid #eaeff4 !important;
    box-shadow: 0 12px 24px rgba(15, 20, 25, .08);
  }
  html body[data-page-id="42740"] .TriggerMenu ul {
    display: block !important;
    margin: 0 !important;
    padding: 8px 20px 16px !important;
    background: none !important;
  }
  html body[data-page-id="42740"] .TriggerMenu li {
    display: block !important;
    float: none !important;
    width: 100% !important;
    border: none !important;
    background: none !important;
  }
  html body[data-page-id="42740"] .TriggerMenu li a {
    position: relative;
    display: block !important;
    padding: 18px 32px 18px 4px !important;
    background: #ffffff !important;
    border: none !important;
    border-bottom: 1px solid #eaeff4 !important;
    color: #0f1419 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: .04em;
  }
  html body[data-page-id="42740"] .TriggerMenu li:last-child a {
    border-bottom: none !important;
  }
  html body[data-page-id="42740"] .TriggerMenu li a::before {
    display: none !important;
  }
  html body[data-page-id="42740"] .TriggerMenu li a::after {
    content: "→";
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    color: #8a1874;
    font-family: "Lato", sans-serif;
    font-weight: 700;
  }
  html body[data-page-id="42740"] .TriggerMenu li a:active {
    color: #8a1874 !important;
  }

  /* ページTOPボタン（画面右下に固定） → 丸いボタン */
  html body[data-page-id="42740"] .piece-PageTop.fixed {
    left: auto !important;
    right: 14px !important;
    bottom: 14px !important;
    width: auto !important;
    background: none !important;
  }
  html body[data-page-id="42740"] .part-PageTop .piece-PageTop a {
    display: block !important;
    width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: #8a1874 !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(15, 20, 25, .2);
    font-size: 0 !important;
    color: transparent !important;
    position: relative;
  }
  html body[data-page-id="42740"] .part-PageTop .piece-PageTop a::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 55%;
    width: 10px;
    height: 10px;
    border-top: 2px solid #ffffff;
    border-left: 2px solid #ffffff;
    transform: translate(-50%, -50%) rotate(45deg);
  }
  html body[data-page-id="42740"] .block-PageTop {
    background: none !important;
  }

  /* 本文の左右に少し余白 */
  html body[data-page-id="42740"] .layout-contents {
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box;
  }
}