@charset "UTF-8";
/*//////////PCサイズ///////////*/
/*//////////PCサイズ///////////*/
@media screen and (min-width: 768px) {
  /* ==============================
header　start
============================== */
  .hd {
    width: 100vw;
    min-height: 5rem;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .hd-logo {
    display: block;
  }
  .hd-logo img {
    height: 5rem;
    width: auto;
    display: block;
  }
  /* ==============================
header　end
============================== */
  /* ==============================
hero　start
============================== */
  .hero {
    width: 100vw;
    aspect-ratio: 2 / 1;
    position: relative;
    background: url("../images/img02.jpg") center center / cover no-repeat;
  }
  .hero-main {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 72vw;
  }
  .hero-main img {
    width: 100%;
    height: auto;
    display: block;
  }
  /* ==============================
hero　end
============================== */
  /* ==============================
cta start
============================== */
  .cta {
    width: 100vw;
    padding: 4vw 0;
    background: #1f2a66;
  }
  .cta-inner {
    width: 100vw;
    margin: 0 auto;
  }
  /* ==============================
コピー（ヒーローCTA）
============================== */
  .cta-head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1vw;
    margin-bottom: 2vw;
    font-size: 2.1rem;
  }
  /* ← 元仕様に戻す（absolute禁止） */
  .cta-head::before, .cta-head::after {
    content: "";
    width: 4vw;
    height: 0.15vw;
    background: #fff;
  }
  .cta-head::before {
    transform: rotate(80deg);
  }
  .cta-head::after {
    transform: rotate(160deg);
  }
  .cta-head-left {
    background: #fff;
    color: #e45e2f;
    padding: 0.5vw 1.5vw;
    font-weight: 700;
  }
  .cta-head-right {
    color: #fff;
  }
  .cta-footer {
    width: 100%;
    color: #fff;
    font-size: 2.8rem;
    padding: 0 0 3vw 0;
    font-weight: 700;
    text-align: center;
  }
  /* ==============================
グリッド
============================== */
  .cta-box {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2vw;
    width: 76.5vw;
    margin: 0 auto;
  }
  /* ==============================
ボタン（共通）
============================== */
  .cta-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36.5vw;
    height: 7vw;
    border: 0.2vw solid #66b89f;
    border-radius: .8vw;
    background: linear-gradient(0deg, #1e757c, #1ab293);
    text-decoration: none;
    color: #fff;
  }
  /* ==============================
無料バッジ
============================== */
  .cta-badge {
    position: absolute;
    left: 1vw;
    top: 50%;
    transform: translateY(-50%);
    background: #e45e2f;
    color: #fff;
    width: 5.7vw;
    height: 5.7vw;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 2.3rem;
    letter-spacing: .2rem;
    font-weight: 500;
  }
  /* ==============================
テキスト
============================== */
  .cta-text {
    font-size: 2.9rem;
    font-weight: 500;
    letter-spacing: .2rem;
  }
  /* ==============================
画像（ヒーローCTA）
============================== */
  .cta-box > a.cta-btn img {
    position: absolute;
    right: 0;
    bottom: 0;
    height: auto;
  }
  .cta-box > a.cta-btn:first-child img {
    width: 8vw;
  }
  .cta-box > a.cta-btn:last-child img {
    width: 10vw;
  }
  /* ==============================
stack variant（汎用CTA）
============================== */
  .cta--stack .cta-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5vw;
  }
  /* コピー */
  .cta--stack .cta-copy {
    color: #fff;
    font-size: 1.8rem;
    text-align: center;
    position: relative;
    padding: 0 8vw;
    font-weight: 500;
  }
  .cta--stack .cta-copy span {
    display: block;
    font-size: 1.6rem;
    margin-top: 0.3vw;
    font-weight: 400;
  }
  /* ライン */
  .cta--stack .cta-copy::before, .cta--stack .cta-copy::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 6vw;
    height: 0.15vw;
    background: #fff;
  }
  .cta--stack .cta-copy::before {
    left: 0;
    transform: rotate(70deg);
  }
  .cta--stack .cta-copy::after {
    right: 0;
    transform: rotate(110deg);
  }
  /* 画像（stackのみ） */
  .cta--stack .cta-btn img {
    position: absolute;
    right: 0;
    bottom: 0;
    height: auto;
  }
  .cta--stack .cta-item:first-child .cta-btn img {
    width: 8vw;
  }
  .cta--stack .cta-item:last-child .cta-btn img {
    width: 10vw;
  }
  /* ==============================
cta end
============================== */
  /* ==============================
freeze start
============================== */
  .freeze {
    width: 100vw;
    background: #dcf0f9;
    padding: 6vw 0;
  }
  .freeze-pad {
    padding: 0 0 4vw 0;
  }
  .freeze-inner {
    width: 70vw;
    margin: 0 auto;
    background: #fff;
    padding: 4vw;
    position: relative;
  }
  /* 角装飾 */
  .corner {
    position: absolute;
    width: 3vw;
    height: 3vw;
    pointer-events: none;
  }
  .corner.tl {
    top: 0;
    left: 0;
    border-top: 0.2vw solid #488178;
    border-left: 0.2vw solid #488178;
  }
  .corner.tr {
    top: 0;
    right: 0;
    border-top: 0.2vw solid #488178;
    border-right: 0.2vw solid #488178;
  }
  .corner.bl {
    bottom: 0;
    left: 0;
    border-bottom: 0.2vw solid #488178;
    border-left: 0.2vw solid #488178;
  }
  .corner.br {
    bottom: 0;
    right: 0;
    border-bottom: 0.2vw solid #488178;
    border-right: 0.2vw solid #488178;
  }
  /* タイトル */
  .freeze-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 0.1vw solid #488178;
    padding-bottom: 2vw;
    margin-bottom: 3vw;
    position: relative;
  }
  .freeze-head-text {
    max-width: 50vw;
  }
  .freeze-ttl-wrap {
    display: flex;
    align-items: flex-end;
    gap: 0.5vw;
    font-weight: 500;
  }
  .freeze-sub {
    font-size: 2.4rem;
    line-height: 100%;
    color: #488178;
  }
  .freeze-ttl {
    font-size: 3.2rem;
    line-height: 100%;
    display: inline-block;
    color: #488178;
    padding: 0 0.3rem;
    letter-spacing: .2rem
  }
  .freeze-copy {
    margin-top: 1vw;
    font-size: 1.6rem;
    line-height: 1.8;
  }
  .freeze-head img {
    width: 13vw;
    height: auto;
    display: block;
    position: absolute;
    right: 0%;
    bottom: 0%;
  }
  /* フロー */
  .freeze-flow {
    display: grid;
    grid-template-columns: 32% 32% 32%;
    justify-content: space-between;
    text-align: center;
    align-items: stretch;
  }
  .freeze-col {
    display: flex;
    flex-direction: column;
  }
  .freeze-col img {
    width: 100%;
    display: block;
  }
  .freeze-label {
    margin: 1vw 0;
    font-size: 2rem;
    font-weight: 500;
  }
  .freeze-label span {
    font-size: 70%;
  }
  .freeze-box {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    padding: 0vw 1vw;
    font-size: 1.8rem;
    line-height: 1.6;
    min-height: 6vw;
  }
  /* 色 */
  .brown {
    background: #85756e;
  }
  .blue {
    background: #497e9e;
  }
  .clip {
    clip-path: polygon(90% 0, 100% 50%, 90% 100%, 0 100%, 0 0);
  }
  .blue_txt {
    color: #497e9e;
  }
  .green {
    background: #488178;
  }
  .green_txt {
    color: #488178;
  }
  .red {
    background: #ba533a;
  }
  .red_txt {
    color: #ba533a;
  }
  /* ==============================
freeze end
============================== */
  /* ==============================
movie start
============================== */
  .movie {
    width: 100vw;
    background: url("../images/img12.jpg") center center / cover no-repeat;
    padding: 8vw 0 6vw;
    position: relative;
  }
  .movie-inner {
    width: 60vw;
    margin: 0 auto;
    text-align: center;
    position: relative;
  }
  .movie-bubble-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 90%; /* ←ここがキモ（突起を除外） */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  /* 吹き出し */
  .movie-bubble {
    width: 60vw;
    aspect-ratio: 780 / 383;
    padding: 3vw 4vw;
    color: #fff;
    position: relative;
    display: block;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: url("../images/img13.jpg") center center / cover no-repeat;
    -webkit-mask-image: url("../images/mask.svg");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    -webkit-mask-position: center;
    mask-image: url("../images/mask.svg");
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
    mask-position: center;
    font-weight: 500
  }
  /* テキスト */
  .movie-lead {
    font-size: 2.9rem;
    margin-bottom: 1vw;
  }
  .movie-key {
    display: flex;
    justify-content: center;
    gap: 1vw;
    margin-bottom: 1vw;
  }
  .movie-key span {
    width: 5vw;
    height: 5vw;
    background: #fff;
    color: #4c6f84;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.9rem;
    font-weight: bold;
  }
  .movie-main {
    font-size: 2.9rem;
    margin-bottom: 1vw;
    position: relative;
    display: inline-block;
  }
  .movie-main::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -0.3vw;
    width: 100%;
    height: 0.5vw;
    background: #f0d45c;
  }
  .movie-sub {
    padding: 1rem;
    font-size: 1.6rem;
    line-height: 1.8;
  }
  /* 見出し */
  .movie-ttl {
    margin-top: 4vw;
    font-size: 2.8rem;
    color: #4c6f84;
  }
  .movie-ttl-sub {
    font-size: 1.8rem;
    margin-bottom: 2vw;
    color: #4c6f84;
  }
  /* 画像 */
  .movie-img img {
    width: 100%;
    display: block;
  }
  /* ボタン */
  .movie-btn {
    margin-top: 3vw;
    display: inline-flex;
    align-items: center;
    gap: 1vw;
    background: #e53935;
    color: #fff;
    padding: .8vw 1vw;
    border-radius: 3vw;
    text-decoration: none;
  }
  /* アイコン */
  .movie-btn-icon {
    width: 4vw;
    height: 4vw;
    background: #fff;
    border-radius: 50%;
    position: relative;
  }
  .movie-btn-icon::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-40%, -50%);
    border-left: 1.6vw solid #e53935;
    border-top: .8vw solid transparent;
    border-bottom: .8vw solid transparent;
  }
  /* テキスト */
  .movie-btn-text {
    font-size: 2.4rem;
  }
  .movie-btn-text span {
    font-size: 0.9em;
  }
  /* ==============================
movie end
============================== */
  /* ==============================
risk start（調整版）
============================== */
  .risk {
    width: 100vw;
    padding: 10vw 0 20vw;
    background: url("../images/img15.jpg") repeat;
  }
  .risk-inner {
    width: 70vw;
    margin: 0 auto;
  }
  /* ==============================
タイトル
============================== */
  .risk-head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.5vw;
    margin-bottom: 2.5vw;
  }
  .risk-head-icon {
    width: 11vw;
  }
  .risk-ttl {
    font-size: 3.5rem;
    line-height: 1.35;
    color: #488178;
    font-weight: 700;
  }
  .risk-ttl span {
    display: block;
    font-size: 1.8rem;
    margin-bottom: 0.3vw;
    font-weight: 700;
  }
  /* コピー */
  .risk-copy {
    text-align: center;
    font-size: 1.6rem;
    margin-bottom: 5vw;
    letter-spacing: 0.05em;
  }
  /* ==============================
グラフ
============================== */
  .risk-graph-wrap {
    position: relative;
    z-index: 1;
  }
  .risk-graph {
    position: relative;
    background: #fff;
    padding: 5vw;
  }
  /* タイトル */
  .risk-graph-ttl {
    font-size: 2.4rem;
    color: #488178;
    margin-bottom: 1vw;
  }
  .risk-graph-ttl span {
    display: inline-block;
    font-size: 1.2rem;
    margin-left: 0.5vw;
  }
  /* 画像 */
  .risk-graph-img {
    margin-bottom: 2vw;
  }
  /* ==============================
凡例
============================== */
  .risk-legend {
    width: 80%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0vw 1vw;
    margin-top: 1vw;
  }
  .risk-legend-item {
    display: flex;
    align-items: center;
    gap: 0.8vw;
    font-size: 1.2rem;
  }
  .risk-legend-item img {
    width: 1.4vw;
  }
  .risk-legend-item .ico {
    width: 1.4vw;
    height: auto;
    font-size: 1.2rem;
    fill: currentColor;
  }
  /* 色指定 */
  .risk-legend-item.c1 {
    color: #488178;
  }
  .risk-legend-item.c2 {
    color: #91b671;
  }
  /* 色 */
  .green_color {
    color: #488178;
  }
  /* ==============================
下段
============================== */
  .risk-bottom {
    width: 65vw;
    margin: auto;
    position: relative;
    margin-top: 4vw;
    z-index: 2;
  }
  /* 見出し */
  .risk-bottom-ttl {
    font-size: 2.4rem;
    color: #488178;
    margin-bottom: 1vw;
  }
  /* コピー */
  .risk-bottom-copy {
    font-size: 1.6rem;
    width: 70%;
    line-height: 1.8;
  }
  /* 人物 */
  .risk-img {
    position: absolute;
    right: 0%;
    bottom: 0%;
    width: 22vw;
  }
  /* ==============================
risk end
============================== */
  /* ==============================
recommend start
============================== */
  .rec {
    width: 100vw;
    padding: 0 0 5vw;
  }
  /* ボックス */
  .rec-box {
    width: 70vw;
    margin: -10vw auto 0;
    padding: 8vw 0vw 7vw;
    border-radius: 2vw;
    position: relative;
    text-align: center;
    background: url("../images/img19.jpg") center center / cover no-repeat;
  }
  /* ==============================
上円
============================== */
  .rec-top {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8vw;
    height: 8vw;
    border-radius: 50%;
    background: #1c9fcf;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.4rem;
    color: #fff;
    font-weight: 500;
  }
  /* ==============================
タイトル
============================== */
  .rec-ttl {
    font-size: 3.5rem;
    color: #fff;
    line-height: 1.5;
    margin-bottom: 2vw;
  }
  /* ==============================
マーカー
============================== */
  .rec-lead {
    display: inline;
    font-size: 1.6rem;
    line-height: 2;
    color: #000;
    background: linear-gradient(#fff9ae, #fff9ae) no-repeat;
    background-size: 140% 120%;
    background-position: 0% 100%;
  }
  /* ==============================
サブ
============================== */
  .rec-sub {
    font-size: 1.6rem;
    color: #fff;
  }
  /* ==============================
下円
============================== */
  .rec-bottom {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 66%);
    width: 12vw;
    height: 12vw;
    border-radius: 50%;
    background: #1c9fcf;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.9rem;
    color: #fff;
    line-height: 1.6;
    text-align: center;
    font-weight: 500;
  }
  /* ==============================
recommend end
============================== */
  /* ==============================
recommend-list start
============================== */
  .rec-list {
    width: 100vw;
    padding: 8vw 0 5vw 0;
  }
  /* 1行 */
  .rec-item {
    width: 70vw;
    margin: auto;
    display: grid;
    grid-template-columns: 40vw 30vw;
    align-items: stretch;
    padding: 0 0 3vw 0;
  }
  /* 左 */
  .rec-left {
    padding: 0 0 2vw 0;
  }
  /* タイトルバー */
  .rec-bar {
    width: 40vw;
    font-size: 2.4rem;
    color: #fff;
    padding: 0 0 0 2vw;
    display: inline-block;
    margin-bottom: 1.5vw;
    border-radius: 9999px 0 0 9999px;
  }
  /* おすすめポイント */
  .rec-point {
    display: inline-block;
    font-size: 1.3rem;
    padding: 0.1vw 0.5vw;
    border: 0.2rem solid;
    margin: 0 0 1vw 2vw;
  }
  /* 本文 */
  .rec-text {
    font-size: 1.8rem;
    line-height: 1.8;
    padding: 0 0 0 2vw;
  }
  /* 右画像 */
  .rec-right img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 0 9999px 9999px 9999px;
  }
  /* ==============================
カラー
============================== */
  .c1 .rec-bar {
    background: #5199d1;
  }
  .c1 .rec-point, .c1 .rec-text {
    color: #5199d1;
    border-color: #5199d1;
  }
  .c2 .rec-bar {
    background: #cf9856;
  }
  .c2 .rec-point, .c2 .rec-text {
    color: #cf9856;
    border-color: #cf9856;
  }
  .c3 .rec-bar {
    background: #63a47e;
  }
  .c3 .rec-point, .c3 .rec-text {
    color: #63a47e;
    border-color: #63a47e;
  }
  .c4 .rec-bar {
    background: #85755b;
  }
  .c4 .rec-point, .c4 .rec-text {
    color: #85755b;
    border-color: #85755b;
  }
  .c5 .rec-bar {
    background: #c5603f;
  }
  .c5 .rec-point, .c5 .rec-text {
    color: #c5603f;
    border-color: #c5603f;
  }
  /* ==============================
recommend-list end
============================== */
  /* ==============================
overview start
============================== */
  .overview {
    width: 100vw;
    padding: 5vw 0;
    background: url("../images/img25.jpg") center top / 100% auto repeat-y;
  }
  /* タイトル */
  .overview-ttl {
    font-size: 3.5rem;
    color: #488178;
    text-align: center;
    margin-bottom: 4vw;
    position: relative;
    font-weight: 500;
  }
  .overview-ttl::after {
    content: "";
    display: block;
    width: 4vw;
    height: 0.2vw;
    background: #488178;
    margin: 1vw auto 0;
  }
  /* ボックス */
  .overview-box {
    width: 56vw;
    margin: 0 auto;
    padding: 1vw 1.5vw;
    background: rgba(255, 255, 255, 0.8);
    border: 0.1vw solid #85756e;
  }
  /* アイテム */
  .overview-item {
    display: flex;
    align-items: center;
    gap: 1vw;
    margin-bottom: .5vw;
  }
  .overview-item:last-child {
    margin-bottom: 0;
  }
  .overview-item img {
    width: 4vw;
    height: auto;
  }
  /* 役割 */
  .overview-role {
    font-size: 2.1rem;
    font-weight: 500;
    margin-right: 0.5vw;
  }
  .overview-role.red {
    color: #d35336;
  }
  .overview-role.green {
    color: #488178;
  }
  /* テキスト */
  .overview-text {
    font-size: 1.6rem;
  }
  .overview-text span {
    font-size: 80%;
  }
  /* ==============================
overview 図
============================== */
  .overview-diagram {
    width: 70vw;
    margin: 3vw auto 6vw auto;
    background: #fff;
    border-radius: 2vw;
    padding: 3vw 5vw;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .overview-diagram img {
    width: 100%;
    height: auto;
    display: block;
  }
  /* ==============================
overview end
============================== */
  /* ==============================
compare start
============================== */
  .compare {
    width: 100vw;
    padding: 0;
  }
  .compare-inner {
    width: 70vw;
    margin: 0 auto;
  }
  .compare-table {
    width: 100%;
  }
  .compare-row {
    display: grid;
    grid-template-columns: 25% 25% 25% 25%;
  }
  .compare-cell {
    border: 0.1vw solid #000;
    padding: 1vw 1vw;
    text-align: center;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  /* ヘッダー */
  .compare-row--head .compare-cell {
    background: #488178;
    color: #fff;
    font-size: 1.6rem;
    font-weight: 500;
  }
  /* 家族信託 */
  .compare-row--trust .compare-cell {
    background: #e98151;
    color: #fff;
    font-size: 1.8rem;
    font-weight: 500;
  }
  .compare-row--trust .compare-cell:first-child {
    box-shadow: inset 0.3vw 0 0 #d86f42;
  }
  /* 後見制度 */
  .compare-row--guard .compare-cell {
    background: #f6f6f2;
    color: #85756e;
    font-size: 1.8rem;
    font-weight: 500;
  }
  .compare-row--guard .compare-cell:first-child {
    box-shadow: inset 0.3vw 0 0 #e2e2db;
  }
  /* 委任契約 */
  .compare-row--delegate .compare-cell {
    background: #f6f6f2;
    color: #85756e;
    font-size: 1.8rem;
    font-weight: 500;
  }
  .compare-row--delegate .compare-cell:first-child {
    box-shadow: inset 0.3vw 0 0 #e2e2db;
  }
  /* 注釈 */
  .compare-cell span {
    font-size: 80%;
    margin-top: 0.4vw;
    line-height: 1.2;
  }
  /* ==============================
記号（pタグ）
============================== */
  .mark {
    margin: 0;
    line-height: 1;
  }
  /* ◎ */
  .mark-circle {
    font-size: 2.7rem;
    color: #b2573b;
  }
  /* △ */
  .mark-triangle {
    font-size: 2.4rem;
    color: #a86f00;
  }
  /* × */
  .mark-cross {
    font-size: 3.1rem;
    color: #62a0b8;
  }
  /* 家族信託行は白 */
  .compare-row--trust .mark {
    color: #fff;
  }
  /* ==============================
compare end
============================== */
  /* ==============================
talk start
============================== */
  .talk {
    width: 100vw;
    padding: 20vw 0 10vw 0;
    background-image: url("../images/img31.jpg");
    background-position: center 0%;
    background-size: cover;
  }
  .talk-inner {
    position: relative;
    width: 70vw;
    aspect-ratio: 910 / 606.6667;
    margin: 0 auto;
  }
  /* メイン画像 */
  .talk-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  /* 吹き出し */
  .talk-bubble {
    position: absolute;
    left: -5vw;
    top: -10vw;
    width: 28vw;
  }
  .talk-bubble img {
    width: 100%;
    display: block;
  }
  /* コピー */
  .talk-copy {
    position: absolute;
    right: 3vw;
    bottom: -4vw;
    width: 32vw;
    background: #488178;
    color: #fff;
    padding: 2vw;
  }
  .talk-copy p {
    font-size: 1.8rem;
    line-height: 1.8;
  }
  /* 人物 */
  .talk-person {
    position: absolute;
    right: -2vw;
    bottom: -8vw;
    width: 14vw;
  }
  .talk-person img {
    width: 100%;
    display: block;
  }
  /* ==============================
talk end
============================== */
  /* ==============================
faqlead start
============================== */
  .faqlead {
    width: 100vw;
    padding: 8vw 0 0 0;
    background: #e7eff2 url("../images/img32.jpg") no-repeat center top / 100% auto;
    text-align: center;
  }
  .faqlead-inner {
    width: 70vw;
    margin: 0 auto;
  }
  /* 画像 */
  .faqlead-img {
    width: 47vw;
    margin: 0 auto 3vw;
  }
  .faqlead-img img {
    width: 100%;
    display: block;
  }
  /* 見出し */
  .faqlead-ttl {
    font-size: 2.3rem;
    margin-bottom: 2vw;
    line-height: 1.6;
  }
  /* コピー */
  .faqlead-copy {
    font-size: 1.6rem;
    line-height: 1.8;
  }
  /* ==============================
faqlead end
============================== */
  /* ==============================
portal start
============================== */
  .portal {
    width: 100vw;
    padding: 8vw 0;
    background: #e9eff1;
  }
  .portal-inner {
    width: 70vw;
    margin: 0 auto;
    background: #fff;
    padding: 4vw;
    position: relative;
  }
  /* ==============================
portal-top start
============================== */
  .portal-top {
    position: relative;
    color: #1f2a66;
  }
  .portal-top-inner {
    position: relative;
    text-align: left
  }
  /* タイトル */
  .portal-ttl {
    font-size: 2.3rem;
    line-height: 1.6;
    margin-bottom: 2vw;
  }
  /* グリッド */
  .portal-grid {
    display: grid;
    grid-template-columns: 1fr 18vw;
    width: 50vw;
    align-items: start;
  }
  /* コピー */
  .portal-copy {
    font-size: 1.6rem;
    line-height: 1.9;
    padding: 0 0 2vw 0;
    margin-bottom: 2vw;
  }
  /* 画像 */
  .portal-img img {
    width: 100%;
    height: auto;
    display: block;
  }
  /* 下人物 */
  .portal-person {
    position: absolute;
    right: 0;
    bottom: 0;
  }
  .portal-person img {
    width: 11vw;
    height: auto;
    display: block;
  }
  /* ==============================
portal-top end
============================== */
  /* ==============================
portal-box start
============================== */
  .portal-box {
    width: 100%;
    border: 0.2vw solid #1f2a66;
    display: grid;
    grid-template-columns: 25vw 1fr;
    gap: 1rem;
    padding: 1.5rem 1rem;
    text-align: left;
  }
  /* 左 */
  .portal-box-left img {
    width: 100%;
    height: auto;
    display: block;
  }
  /* 右 */
  .portal-box-right {}
  .portal-box-right p {
    font-size: 1.6rem;
    line-height: 1.8;
  }
  /* ==============================
portal-box end
============================== */
  /* ==============================
portal-btn start
============================== */
  .portal-btn {
    margin-top: 3vw;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1vw;
    background: linear-gradient(180deg, #489bcc, #1f2a66);
    color: #fff;
    padding: .8vw 2vw;
    border-radius: 3vw;
    text-decoration: none;
  }
  /* アイコン（movie-btn流用） */
  .portal-btn-icon {
    font-size: 1.6rem;
  }
  /* テキスト */
  .portal-btn-text {
    font-size: 2.4rem;
    font-weight: 500;
  }
  /* ==============================
portal-btn end
============================== */
  /* ==============================
portal end
============================== */
  /* ==============================
case start
============================== */
  .case {
    width: 100vw;
    padding: 5vw 0;
    background: #254938;
    color: #fff;
  }
  .case-inner {
    width: 70vw;
    margin: 0 auto;
  }
  /* ==============================
タイトル
============================== */
  .case-head {
    text-align: center;
    margin-bottom: 4vw;
  }
  .case-sub {
    color: #ee87b4;
    font-size: 2.4rem;
    line-height: 1.6;
    margin-bottom: 1vw;
  }
  .case-ttl {
    font-size: 3.5rem;
    line-height: 1.6;
    padding: 2vw 0 0 0;
  }
  /* ==============================
アイテム
============================== */
  .case-item {
    display: grid;
    grid-template-columns: 1fr 18vw;
    padding: 3vw 1vw;
    border-bottom: 0.1vw dotted #fff;
    align-items: center;
  }
  /* 左 */
  .case-title {
    display: flex;
    align-items: center;
    gap: 1vw;
    margin-bottom: 1vw;
  }
  .case-num {
    border: 0.15vw solid #d5d564;
    color: #d5d564;
    padding: 0.1vw 0.5vw;
    font-size: 1.3rem;
    letter-spacing: 0.2rem
  }
  .case-title-text {
    color: #d5d564;
    font-size: 2.4rem;
  }
  .case-lead {
    font-size: 1.8rem;
    margin-bottom: 1vw;
  }
  /* ==============================
リスト（縦線＋横線）
============================== */
  .case-list {
    position: relative;
    padding-left: calc(1rem + 1.7vw);
    padding-top: 1rem;
  }
  .case-list::before {
    content: "";
    position: absolute;
    left: 1rem;
    top: 0;
    bottom: 0;
    width: 0.15vw;
    background: #fff;
  }
  .case-list p {
    position: relative;
    padding-left: 0.5rem;
    font-size: 1.6rem;
    line-height: 3rem;
  }
  /* 横線 */
  .case-list p::before {
    content: "";
    position: absolute;
    left: -1.5vw;
    top: 50%;
    width: 1vw;
    height: 0.15vw;
    background: #fff;
    transform: translateY(-50%);
  }
  /* ==============================
右画像
============================== */
  .case-right img {
    width: 100%;
    border-radius: 0.5vw;
    display: block;
  }
  /* ==============================
case end
============================== */
  /* ==============================
flow start
============================== */
  .flow {
    width: 100vw;
    padding: 8vw 0;
    background: #fff;
  }
  .flow-inner {
    width: 75vw;
    margin: 0 auto;
  }
  /* タイトル */
  .flow-ttl {
    text-align: center;
    font-size: 3.5rem;
    color: #488178;
    margin-bottom: 3vw;
  }
  /* グリッド */
  .flow-grid {
    display: grid;
    grid-template-columns: 1fr 4vw 1fr 4vw 1fr 4vw 1fr;
    align-items: center;
    text-align: center;
  }
  /* 奇数 */
  .flow-item {
    display: grid;
    grid-template-rows: auto 12vw auto 1fr;
    align-items: start;
    text-align: center;
  }
  /* 数字 */
  .flow-num {
    font-size: 5.4rem;
    font-weight: 300;
    font-family: 'Jost', sans-serif;
    margin-bottom: 1vw;
    background: linear-gradient(180deg, #77c4a1, #0077c4);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  /* 画像 */
  .flow-item img {
    width: 12vw;
    height: 12vw;
    object-fit: cover;
    margin: 0 auto;
    display: block;
  }
  /* 見出し */
  .flow-head {
    font-size: 2.1rem;
    color: #0056a8;
    margin-bottom: 1vw;
    line-height: 1.5;
    font-weight: bold;
    min-height: 4.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  /* コピー */
  .flow-text {
    font-size: 1.6rem;
    line-height: 1.8;
    text-align: justify;
  }
  /* 偶数（矢印） */
  .flow-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4rem;
    color: #a8d9d8;
    height: 100%;
  }
  /* ==============================
flow end
============================== */
  /* ==============================
faq start
============================== */
  .faq {
    width: 100vw;
    padding: 8vw 0;
    background: #dcf0f9;
  }
  .faq-inner {
    width: 70vw;
    margin: 0 auto;
  }
  /* タイトル */
  .faq-head {
    text-align: center;
    margin-bottom: 3vw;
  }
  .faq-ttl {
    font-size: 3.3rem;
    color: #1f2a66;
    margin-bottom: .5vw;
  }
  .faq-sub {
    font-size: 2.1rem;
    color: #1f2a66;
  }
  /* ==============================
Q
============================== */
  .faq-item {
    margin-bottom: 2vw;
  }
  .faq-q {
    display: grid;
    grid-template-columns: 8vw 1fr auto;
    align-items: center;
    background: #fff;
    padding: 1.5vw 0vw;
    border-bottom: 0.1vw solid #ccc;
    cursor: pointer;
  }
  .faq-q-num {
    font-family: 'Jost', sans-serif;
    font-size: 5.4rem;
    width: 8vw;
    text-align: center;
    font-weight: 300;
    color: #8abed8;
  }
  .faq-q-text {
    font-size: 1.8rem;
  }
  /* くの字 */
  .faq-q-icon {
    width: 1.5vw;
    height: 1.5vw;
    margin: 0 3rem;
    border-right: 0.3vw solid #8abed8;
    border-bottom: 0.3vw solid #8abed8;
    transform: rotate(45deg);
    transition: .3s;
  }
  .faq-q.open .faq-q-icon {
    transform: rotate(-135deg);
  }
  /* ==============================
A
============================== */
  .faq-a {
    display: grid;
    grid-template-columns: 8vw 1fr;
    gap: 0vw;
    background: #fff;
    padding: 1.5vw 1.5vw;
  }
  .faq-a-num {
    font-family: 'Jost', sans-serif;
    font-size: 5.4rem;
    width: 8vw;
    text-align: center;
    font-weight: 300;
    color: #bf7b5a;
  }
  .faq-a-text {
    font-size: 1.8rem;
    line-height: 1.8;
  }
  /* 初期閉じ */
  .accordion-inner-job {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
    padding: 0;
  }
  .accordion-inner-job.open {
    padding: 1.5vw 0;
  }
  /* ==============================
faq end
============================== */
  /* ==============================
future start
============================== */
  .future {
    width: 100vw;
    background: url("../images/img47.jpg") center / cover no-repeat;
  }
  .future-inner {
    width: 70vw;
    margin: 0 auto;
    padding: 10vw 0;
    text-align: center;
  }
  /* コピー */
  .future-copy {
    font-family: 'Noto Serif JP', serif;
    font-size: 5.6rem;
    color: #fff;
    line-height: 1.4;
    margin-bottom: 4vw;
    text-shadow:
      0 0.2vw 0.4vw rgba(0, 0, 0, 0.35), 0 0.6vw 1.5vw rgba(104, 173, 224, 0.8), 0 0 2.5vw rgba(104, 173, 224, 0.9), 0 0 4vw rgba(104, 173, 224, 1);
  }
  .future-copy span {
    font-size: 90%;
  }
  .future-sub {
    font-size: 2.4rem;
    font-family: 'Noto Sans JP', sans-serif;
    margin-top: 2vw;
  }
  /* ボックス */
  .future-box {
    background: rgba(255, 255, 255, 0.8);
    padding: 2.5vw 3vw;
    font-size: 2rem;
    line-height: 2;
    text-align: left;
    display: inline-block;
  }
  /* ==============================
future end
============================== */
  /* ==============================
footer　start
============================== */
  .ft {
    width: 100vw;
    min-height: 5rem;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .ft-logo {
    width: 90%;
    display: block;
  }
  .ft span {
    line-height: 5rem;
    width: auto;
    display: block;
    padding-right: 1rem;
    letter-spacing: 0.1rem;
  }
  /* ==============================
footer　end
============================== */
}
/*//////////SPサイズ///////////*/
/*//////////SPサイズ///////////*/
@media screen and (max-width:767px) {
  /* ==============================
header　start
============================== */
  .hd {
    width: 100vw;
    min-height: 4rem;
    padding: 0 0;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .hd-logo {
    display: block;
  }
  .hd-logo img {
    height: 3.5rem;
    width: auto;
    display: block;
  }
  /* ==============================
header　end
============================== */
  /* ==============================
hero　start
============================== */
  .hero {
    width: 100vw;
    aspect-ratio: auto;
    padding: 2rem 0;
    position: relative;
    background: url("../images/img02.jpg") center center / cover no-repeat;
  }
  .hero-main {
    position: static;
    transform: none;
    width: 95vw;
    margin: 0 auto;
  }
  .hero-main img {
    width: 100%;
    height: auto;
    display: block;
  }
  /* ==============================
hero　end
============================== */
  /* ==============================
cta start
============================== */
  .cta {
    width: 100vw;
    padding: 2.5rem 0;
    background: #1f2a66;
  }
  .cta-inner {
    width: 100vw;
    margin: 0 auto;
  }
  /* ==============================
コピー（ヒーローCTA）
============================== */
  .cta-head {
    text-align: center;
    font-size: .95rem;
  }
  .cta-head-left {
    width: 90vw;
    margin: 0 auto .5rem auto;
    background: #fff;
    color: #e45e2f;
    padding: 0.5vw 1.5vw;
    font-weight: 700;
  }
  .cta-head-right {
    color: #fff;
    margin: 0 auto .5rem auto;
  }
  .cta-footer {
    width: 100%;
    color: #fff;
    font-size: 1.05rem;
    padding: 0 0 3vw 0;
    font-weight: 700;
    text-align: center;
  }
  /* ==============================
グリッド
============================== */
  .cta-box {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.3rem;
    width: 90vw;
    margin: 1rem auto 0;
  }
  /* ==============================
ボタン（共通）
============================== */
  .cta-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90vw;
    height: 15vw;
    border: 0.2vw solid #66b89f;
    border-radius: .8vw;
    background: linear-gradient(0deg, #1e757c, #1ab293);
    text-decoration: none;
    color: #fff;
  }
  /* ==============================
無料バッジ
============================== */
  .cta-badge {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    background: #e45e2f;
    color: #fff;
    width: 14vw;
    height: 14vw;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1rem;
    letter-spacing: .2rem;
    font-weight: 500;
  }
  /* ==============================
テキスト
============================== */
  .cta-text {
    font-size: 1.3rem;
    font-weight: 500;
    letter-spacing: .2rem;
  }
  /* ==============================
画像（ヒーローCTA）
============================== */
  .cta-box > a.cta-btn img {
    position: absolute;
    right: 0;
    bottom: 0;
    height: auto;
  }
  .cta-box > a.cta-btn:first-child img {
    width: 16vw;
  }
  .cta-box > a.cta-btn:last-child img {
    width: 20vw;
  }
  /* ==============================
stack variant（汎用CTA）
============================== */
  .cta--stack .cta-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
  }
  /* コピー */
  .cta--stack .cta-copy {
    color: #fff;
    font-size: 1rem;
    text-align: center;
    position: relative;
    padding: 0 3rem;
    font-weight: 500;
  }
  .cta--stack .cta-copy span {
    display: block;
    font-size: 1.1rem;
    margin-top: .1rem;
    font-weight: 400;
  }
  /* ライン */
  .cta--stack .cta-copy::before, .cta--stack .cta-copy::after {
    content: "";
    position: absolute;
    top: 60%;
    width: 3rem;
    height: 0.15vw;
    background: #fff;
  }
  .cta--stack .cta-copy::before {
    left: 0;
    transform: rotate(70deg);
  }
  .cta--stack .cta-copy::after {
    right: 0;
    transform: rotate(110deg);
  }
  /* 画像（stackのみ） */
  .cta--stack .cta-btn img {
    position: absolute;
    right: 0;
    bottom: 0;
    height: auto;
  }
  .cta--stack .cta-item:first-child .cta-btn img {
    width: 16vw;
  }
  .cta--stack .cta-item:last-child .cta-btn img {
    width: 20vw;
  }
  /* ==============================
cta end
============================== */
  /* ==============================
freeze start
============================== */
  .freeze {
    width: 100vw;
    background: #dcf0f9;
    padding: 3rem 0;
  }
  .freeze-pad {
    padding: 0 0 1rem 0;
  }
  .freeze-inner {
    width: 90vw;
    margin: 0 auto;
    background: #fff;
    padding: 2rem 4vw;
    position: relative;
  }
  /* 角装飾 */
  .corner {
    position: absolute;
    width: 10vw;
    height: 10vw;
    pointer-events: none;
  }
  .corner.tl {
    top: 0;
    left: 0;
    border-top: 1px solid #488178;
    border-left: 1px solid #488178;
  }
  .corner.tr {
    top: 0;
    right: 0;
    border-top: 1px solid #488178;
    border-right: 1px solid #488178;
  }
  .corner.bl {
    bottom: 0;
    left: 0;
    border-bottom: 1px solid #488178;
    border-left: 1px solid #488178;
  }
  .corner.br {
    bottom: 0;
    right: 0;
    border-bottom: 1px solid #488178;
    border-right: 1px solid #488178;
  }
  /* タイトル */
  .freeze-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 0.1vw solid #488178;
    padding-bottom: 2rem;
    margin-bottom: 1rem;
    position: relative;
  }
  .freeze-head-text {
    width: 100%;
  }
  .freeze-ttl-wrap {
    display: flex;
    align-items: flex-end;
    font-weight: 500;
  }
  .freeze-sub {
    font-size: 1.1rem;
    line-height: 100%;
    color: #488178;
  }
  .freeze-ttl {
    font-size: 1.3rem;
    line-height: 100%;
    display: inline-block;
    color: #488178;
    padding: 0 0.5rem;
    letter-spacing: .2rem
  }
  .freeze-copy {
    margin-top: 1rem;
    font-size: 1rem;
    line-height: 1.8;
    padding: 0 0 15vw 0;
  }
  .freeze-head img {
    width: 30vw;
    height: auto;
    display: block;
    position: absolute;
    right: 0%;
    bottom: 0%;
  }
  /* フロー */
  .freeze-flow {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    justify-content: initial;
    text-align: center;
    align-items: stretch;
  }
  .freeze-col {
    display: flex;
    flex-direction: column;
  }
  .freeze-col img {
    width: 50vw;
    margin: auto;
    display: block;
  }
  .freeze-label {
    margin: 1vw 0;
    font-size: 1.2rem;
    font-weight: 500;
  }
  .freeze-label span {
    font-size: 70%;
  }
  .freeze-box {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    padding: 2vw 1vw;
    font-size: 1.2rem;
    line-height: 1.4;
    min-height: 6vw;
    border-radius: 2rem;
  }
  /* 色 */
  .brown {
    background: #85756e;
  }
  .blue {
    background: #497e9e;
  }
  .clip {}
  .blue_txt {
    color: #497e9e;
  }
  .green {
    background: #488178;
  }
  .green_txt {
    color: #488178;
  }
  .red {
    background: #ba533a;
  }
  .red_txt {
    color: #ba533a;
  }
  /* ==============================
freeze end
============================== */
  /* ==============================
movie start
============================== */
  .movie {
    width: 100vw;
    background: url("../images/img12.jpg") center center / cover no-repeat;
    padding: 3rem 0;
  }
  .movie-inner {
    width: 90vw;
    margin: 0 auto;
    text-align: center;
  }
  .movie-bubble-inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  /* 吹き出し */
  .movie-bubble {
    width: 90vw;
    margin: auto;
    padding: 1.5rem 0;
    color: #fff;
    position: relative;
    display: block;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: url("../images/img13.jpg") center center / cover no-repeat;
    font-weight: 500;
    border-radius: 1rem;
  }
  /* テキスト */
  .movie-lead {
    font-size: 1.4rem;
    margin-bottom: 0.75rem;
  }
  .movie-key {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
  }
  .movie-key span {
    width: 3rem;
    height: 3rem;
    background: #fff;
    color: #4c6f84;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    font-weight: bold;
  }
  .movie-main {
    font-size: 1.4rem;
    margin-bottom: 1vw;
    position: relative;
    display: inline-block;
  }
  .movie-main::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -0.3vw;
    width: 100%;
    height: 0.2rem;
    background: #f0d45c;
  }
  .movie-sub {
    padding: 1rem 0 0 0;
    font-size: 1rem;
    line-height: 1.8;
  }
  /* 見出し */
  .movie-ttl {
    margin-top: 4vw;
    font-size: 1.2rem;
    color: #4c6f84;
  }
  .movie-ttl-sub {
    font-size: .9rem;
    margin: .7rem 0 1rem 0;
    color: #4c6f84;
  }
  /* 画像 */
  .movie-img img {
    width: 100%;
    display: block;
  }
  /* ボタン */
  .movie-btn {
    margin-top: 3vw;
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    background: #e53935;
    color: #fff;
    padding: .5rem 1rem;
    border-radius: 1.6rem;
    text-decoration: none;
  }
  /* アイコン */
  .movie-btn-icon {
    width: 1.8rem;
    height: 1.8rem;
    background: #fff;
    border-radius: 50%;
    position: relative;
  }
  .movie-btn-icon::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-40%, -50%);
    border-left: .7rem solid #e53935;
    border-top: .35rem solid transparent;
    border-bottom: .35rem solid transparent;
  }
  /* テキスト */
  .movie-btn-text {
    font-size: 1.3rem;
  }
  .movie-btn-text span {
    font-size: 0.8em;
  }
  /* ==============================
movie end
============================== */
  /* ==============================
risk start（調整版）
============================== */
  .risk {
    width: 100vw;
    padding: 3rem 0 3rem;
    background: url("../images/img15.jpg") repeat;
  }
  .risk-inner {
    width: 90vw;
    margin: 0 auto;
  }
  /* ==============================
タイトル
============================== */
  .risk-head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
  }
  .risk-head-icon {
    width: 6rem;
    padding-bottom: 0rem;
  }
  .risk-ttl {
    font-size: 1.6rem;
    line-height: 1.35;
    color: #488178;
    font-weight: 700;
  }
  .risk-ttl span {
    display: block;
    font-size: 1.1rem;
    margin-bottom: 0.3vw;
    font-weight: 700;
  }
  /* コピー */
  .risk-copy {
    text-align: justify;
    font-size: 1rem;
    margin-bottom: 5vw;
    letter-spacing: 0.05em;
  }
  /* ==============================
グラフ
============================== */
  .risk-graph-wrap {
    position: relative;
    z-index: 1;
  }
  .risk-graph {
    position: relative;
    background: #fff;
    padding: 5vw;
  }
  /* タイトル */
  .risk-graph-ttl {
    font-size: 1.2rem;
    color: #488178;
    margin-bottom: 1vw;
  }
  .risk-graph-ttl span {
    display: block;
    font-size: .8rem;
    margin-left: 0.5vw;
  }
  /* 画像 */
  .risk-graph-img {
    margin-bottom: 2vw;
  }
  /* ==============================
凡例
============================== */
  .risk-legend {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0vw 1vw;
    margin-top: 1vw;
  }
  .risk-legend-item {
    display: flex;
    align-items: center;
    gap: 0.8vw;
    font-size: .7rem;
  }
  .risk-legend-item img {}
  .risk-legend-item .ico {
    width: .8rem;
    height: auto;
    font-size: .8rem;
    fill: currentColor;
  }
  /* 色指定 */
  .risk-legend-item.c1 {
    color: #488178;
  }
  .risk-legend-item.c2 {
    color: #91b671;
  }
  /* 色 */
  .green_color {
    color: #488178;
  }
  /* ==============================
下段
============================== */
  .risk-bottom {
    width: 90vw;
    margin: auto;
    position: relative;
    margin-top: 2rem;
    z-index: 2;
  }
  /* 見出し */
  .risk-bottom-ttl {
    font-size: 1.3rem;
    color: #488178;
    margin-bottom: 1rem;
  }
  /* コピー */
  .risk-bottom-copy {
    font-size: 1rem;
    width: 100%;
    line-height: 1.8;
  }
  /* 人物 */
  .risk-img {
    position: absolute;
    right: 0%;
    top: -13%;
    width: 30vw;
  }
  /* ==============================
risk end
============================== */
  /* ==============================
recommend start
============================== */
  .rec {
    width: 100vw;
    padding: 0 0 5vw;
  }
  /* ボックス */
  .rec-box {
    width: 90vw;
    margin: 0rem auto 0;
    padding: 3.5rem 1rem 3.5rem;
    border-radius: 1rem;
    position: relative;
    background: url("../images/img19.jpg") center center / cover no-repeat;
  }
  /* ==============================
上円
============================== */
  .rec-top {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 20vw;
    height: 20vw;
    border-radius: 50%;
    background: #1c9fcf;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    color: #fff;
    font-weight: 500;
  }
  /* ==============================
タイトル
============================== */
  .rec-ttl {
    font-size: 1.2rem;
    color: #fff;
    line-height: 1.5;
    margin-bottom: 2vw;
    font-weight: 700;
    text-align: center;
  }
  /* ==============================
マーカー
============================== */
  .rec-lead {
    display: inline;
    font-size: 1rem;
    line-height: 2;
    text-align: justify;
    color: #000;
    background: linear-gradient(#fff9ae, #fff9ae) no-repeat;
    background-size: 140% 120%;
    background-position: 0% 100%;
  }
  /* ==============================
サブ
============================== */
  .rec-sub {
    font-size: 1rem;
    color: #fff;
  }
  /* ==============================
下円
============================== */
  .rec-bottom {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 66%);
    width: 30vw;
    height: 30vw;
    border-radius: 50%;
    background: #1c9fcf;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    color: #fff;
    line-height: 1.6;
    text-align: center;
    font-weight: 500;
  }
  /* ==============================
recommend end
============================== */
  /* ==============================
recommend-list start
============================== */
  .rec-list {
    width: 100vw;
    padding: 6rem 0 5vw 0;
  }
  /* 1行 */
  .rec-item {
    width: 90vw;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    padding: 0 0 2.5rem 0;
  }
  /* 左 */
  .rec-left {
    padding: 0 0 1rem 0;
  }
  /* タイトルバー */
  .rec-bar {
    width: 100%;
    font-size: 1.3rem;
    color: #fff;
    padding: .5rem 1rem;
    display: inline-block;
    margin-bottom: 1.5vw;
    border-radius: .2rem;
  }
  /* おすすめポイント */
  .rec-point {
    display: inline-block;
    font-size: .8rem;
    padding: .05rem 0.3rem;
    border: 0.1rem solid;
    margin: .5rem 1rem;
  }
  /* 本文 */
  .rec-text {
    font-size: 1rem;
    line-height: 1.8;
    padding: 0 1rem;
  }
  /* 右画像 */
  .rec-right img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 0;
  }
  /* ==============================
カラー
============================== */
  .c1 .rec-bar {
    background: #5199d1;
  }
  .c1 .rec-point, .c1 .rec-text {
    color: #5199d1;
    border-color: #5199d1;
  }
  .c2 .rec-bar {
    background: #cf9856;
  }
  .c2 .rec-point, .c2 .rec-text {
    color: #cf9856;
    border-color: #cf9856;
  }
  .c3 .rec-bar {
    background: #63a47e;
  }
  .c3 .rec-point, .c3 .rec-text {
    color: #63a47e;
    border-color: #63a47e;
  }
  .c4 .rec-bar {
    background: #85755b;
  }
  .c4 .rec-point, .c4 .rec-text {
    color: #85755b;
    border-color: #85755b;
  }
  .c5 .rec-bar {
    background: #c5603f;
  }
  .c5 .rec-point, .c5 .rec-text {
    color: #c5603f;
    border-color: #c5603f;
  }
  /* ==============================
recommend-list end
============================== */
  /* ==============================
overview start
============================== */
  .overview {
    width: 100vw;
    padding: 3rem 0;
    background: url("../images/img25.jpg") center top / 100% auto repeat-y;
  }
  /* タイトル */
  .overview-ttl {
    font-size: 1.6rem;
    color: #488178;
    text-align: center;
    margin-bottom: 2rem;
    position: relative;
    font-weight: 500;
  }
  .overview-ttl::after {
    content: "";
    display: block;
    width: 2rem;
    height: .15rem;
    background: #488178;
    margin: 1vw auto 0;
  }
  /* ボックス */
  .overview-box {
    width: 90vw;
    margin: 0 auto;
    padding: .5rem 1rem;
    background: rgba(255, 255, 255, 0.8);
    border: 0.1vw solid #85756e;
  }
  /* アイテム */
  .overview-item {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .5vw;
  }
  .overview-item:last-child {
    margin-bottom: 0;
  }
  .overview-item img {
    width: 2rem;
    height: auto;
  }
  /* 役割 */
  .overview-role {
    font-size: 1rem;
    font-weight: 500;
  }
  .overview-role.red {
    color: #d35336;
  }
  .overview-role.green {
    color: #488178;
  }
  /* テキスト */
  .overview-text {
    font-size: .8rem;
    line-height: 140%;
  }
  .overview-text span {
    font-size: 80%;
  }
  /* ==============================
overview 図
============================== */
  .overview-diagram {
    width: 90vw;
    margin: 3vw auto 6vw auto;
    background: #fff;
    border-radius: 2vw;
    padding: 3vw 5vw;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .overview-diagram img {
    width: 100%;
    height: auto;
    display: block;
  }
  /* ==============================
overview end
============================== */
  /* ==============================
compare start
============================== */
  .compare {
    width: 100vw;
    padding: 0;
  }
  .compare-inner {
    width: 90vw;
    margin: 0 auto;
  }
  .compare-table {
    width: 100%;
  }
  .compare-row {
    display: grid;
    grid-template-columns: 25% 25% 25% 25%;
  }
  .compare-cell {
    border: 0.1vw solid #000;
    padding: 1rem 0;
    text-align: center;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  /* ヘッダー */
  .compare-row--head .compare-cell {
    background: #488178;
    color: #fff;
    font-size: .8rem;
    font-weight: 500;
    line-height: 140%;
  }
  /* 家族信託 */
  .compare-row--trust .compare-cell {
    background: #e98151;
    color: #fff;
    font-size: 1rem;
    font-weight: 500;
  }
  .compare-row--trust .compare-cell:first-child {
    box-shadow: inset 0.3vw 0 0 #d86f42;
  }
  /* 後見制度 */
  .compare-row--guard .compare-cell {
    background: #f6f6f2;
    color: #85756e;
    font-size: 1rem;
    font-weight: 500;
  }
  .compare-row--guard .compare-cell:first-child {
    box-shadow: inset 0.3vw 0 0 #e2e2db;
  }
  /* 委任契約 */
  .compare-row--delegate .compare-cell {
    background: #f6f6f2;
    color: #85756e;
    font-size: 1rem;
    font-weight: 500;
  }
  .compare-row--delegate .compare-cell:first-child {
    box-shadow: inset 0.3vw 0 0 #e2e2db;
  }
  /* 注釈 */
  .compare-cell span {
    font-size: 80%;
    margin-top: 0.4vw;
    line-height: 1.2;
  }
  /* ==============================
記号（pタグ）
============================== */
  .mark {
    margin: 0;
    line-height: 1;
  }
  /* ◎ */
  .mark-circle {
    font-size: 1.6rem;
    color: #b2573b;
  }
  /* △ */
  .mark-triangle {
    font-size: 1.6rem;
    color: #a86f00;
  }
  /* × */
  .mark-cross {
    font-size: 1.6rem;
    color: #62a0b8;
  }
  /* 家族信託行は白 */
  .compare-row--trust .mark {
    color: #fff;
  }
  /* ==============================
compare end
============================== */
  /* ==============================
talk start
============================== */
  .talk {
    width: 100vw;
    padding: 7rem 0 7rem 0;
    background-image: url("../images/img31.jpg");
    background-position: center 0%;
    background-size: cover;
  }
  .talk-inner {
    position: relative;
    width: 90vw;
    aspect-ratio: 910 / 606.6667;
    margin: 0 auto;
  }
  /* メイン画像 */
  .talk-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  /* 吹き出し */
  .talk-bubble {
    position: absolute;
    left: -4vw;
    top: -5rem;
    width: 50vw;
  }
  .talk-bubble img {
    width: 100%;
    display: block;
  }
  /* コピー */
  .talk-copy {
    position: absolute;
    right: 0;
    bottom: -4rem;
    width: 90vw;
    background: #488178;
    color: #fff;
    padding: 2vw;
  }
  .talk-copy p {
    font-size: 1rem;
    line-height: 1.8;
  }
  /* 人物 */
  .talk-person {
    position: absolute;
    right: -2vw;
    bottom: -4rem;
    width: 25vw;
  }
  .talk-person img {
    width: 100%;
    display: block;
  }
  /* ==============================
talk end
============================== */
  /* ==============================
faqlead start
============================== */
  .faqlead {
    width: 100vw;
    padding: 8vw 0 0 0;
    background: #e7eff2 url("../images/img32.jpg") no-repeat center top / 100% auto;
    text-align: center;
  }
  .faqlead-inner {
    width: 90vw;
    margin: 0 auto;
  }
  /* 画像 */
  .faqlead-img {
    width: 90vw;
    margin: 0 auto 2rem auto;
  }
  .faqlead-img img {
    width: 100%;
    display: block;
  }
  /* 見出し */
  .faqlead-ttl {
    font-size: 1.3rem;
    margin-bottom: 1rem;
    line-height: 1.6;
  }
  /* コピー */
  .faqlead-copy {
    font-size: 1rem;
    line-height: 1.8;
    text-align: justify;
  }
  /* ==============================
faqlead end
============================== */
  /* ==============================
portal start
============================== */
  .portal {
    width: 100vw;
    padding: 8vw 0;
    background: #e9eff1;
  }
  .portal-inner {
    width: 90vw;
    margin: 0 auto;
    background: #fff;
    padding: 2rem 4vw;
    position: relative;
  }
  /* ==============================
portal-top start
============================== */
  .portal-top {
    position: relative;
    color: #1f2a66;
  }
  .portal-top-inner {
    position: relative;
    text-align: left;
    padding: 1.5rem 0;
  }
  /* タイトル */
  .portal-ttl {
    font-size: 1.6rem;
    line-height: 1.6;
  }
  /* グリッド */
  .portal-grid {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    align-items: start;
  }
  /* コピー */
  .portal-copy {
    font-size: 1rem;
    text-align: justify;
    line-height: 1.9;
    padding: 1rem 0 1.5rem 0;
  }
  /* 画像 */
  .portal-img {
    display: flex;
    justify-content: center; /* 横中央 */
    align-items: center; /* 縦中央 */
  }
  .portal-img img {
    width: 70%;
    padding-right: 5vw;
    height: auto;
    display: block;
  }
  /* 下人物 */
  .portal-person {
    position: absolute;
    right: 0;
    bottom: 0;
  }
  .portal-person img {
    width: 20vw;
    height: auto;
    display: block;
  }
  /* ==============================
portal-top end
============================== */
  /* ==============================
portal-box start
============================== */
  .portal-box {
    width: 100%;
    border: 0.2vw solid #1f2a66;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    padding: 1rem 1rem;
    text-align: justify;
    margin-bottom: 1.5rem;
  }
  /* 左 */
  .portal-box-left {
    display: flex;
    justify-content: center; /* 横中央 */
    align-items: center; /* 縦中央 */
  }
  .portal-box-left img {
    width: 70%;
    height: auto;
    display: block;
  }
  /* 右 */
  .portal-box-right {}
  .portal-box-right p {
    font-size: 1rem;
    line-height: 1.8;
  }
  /* ==============================
portal-box end
============================== */
  /* ==============================
portal-btn start
============================== */
  .portal-btn {
    margin-top: 3vw;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1vw;
    background: linear-gradient(180deg, #489bcc, #1f2a66);
    color: #fff;
    padding: .5rem 1rem;
    border-radius: 1.6rem;
    text-decoration: none;
  }
  /* アイコン（movie-btn流用） */
  .portal-btn-icon {
    font-size: 1.1rem;
    padding-right: .5rem;
  }
  /* テキスト */
  .portal-btn-text {
    text-align: left;
    font-size: 1.2rem;
    line-height: 1.4;
    font-weight: 500;
  }
  /* ==============================
portal-btn end
============================== */
  /* ==============================
portal end
============================== */
  /* ==============================
case start
============================== */
  .case {
    width: 100vw;
    padding: 3rem 0;
    background: #254938;
    color: #fff;
  }
  .case-inner {
    width: 90vw;
    margin: 0 auto;
  }
  /* ==============================
タイトル
============================== */
  .case-head {
    text-align: center;
  }
  .case-sub {
    color: #ee87b4;
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 1rem;
  }
  .case-ttl {
    font-size: 1.3rem;
    line-height: 1.4;
    padding: 0 0 .5rem 0;
  }
  /* ==============================
アイテム
============================== */
  .case-item {
    display: grid;
    grid-template-columns: 1fr;
    padding: 2.3rem 0 2.3rem 0;
    border-bottom: 0.1vw dotted #fff;
    align-items: center;
  }
  /* 左 */
  .case-title {
    display: flex;
    align-items: flex-start;
    gap: 1vw;
    margin-bottom: 1vw;
  }
  .case-num {
    border: 0.15vw solid #d5d564;
    color: #d5d564;
    padding: .9rem .5rem;
    font-size: .9rem;
    letter-spacing: 0rem
  }
  .case-title-text {
    color: #d5d564;
    font-size: 1.1rem;
    margin: 0 0 1rem 1rem;
    line-height: 1.4
  }
  .case-lead {
    font-size: 1rem;
    margin-bottom: 1vw;
    font-weight: bold;
  }
  /* ==============================
リスト（縦線＋横線）
============================== */
  .case-list {
    position: relative;
    padding-left: calc(1rem + 1.7vw);
    padding-top: 1rem;
  }
  .case-list::before {
    content: "";
    position: absolute;
    left: 1rem;
    top: 0;
    bottom: 0;
    width: 0.15vw;
    background: #fff;
  }
  .case-list p {
    position: relative;
    padding: 0 0 1rem 1rem;
    font-size: .9rem;
    line-height: 3rem;
    line-height: 1.4;
  }
  /* 横線 */
  .case-list p::before {
    content: "";
    position: absolute;
    left: -1.5vw;
    top: 20%;
    width: 1rem;
    height: 0.15vw;
    background: #fff;
    transform: translateY(-50%);
  }
  /* ==============================
右画像
============================== */
  .case-right {
    display: flex;
    justify-content: center; /* 横中央 */
    align-items: center; /* 縦中央 */
  }
  .case-right img {
    width: 91%;
    border-radius: 0;
    display: block;
  }
  /* ==============================
case end
============================== */
  /* ==============================
flow start
============================== */
  .flow {
    width: 100vw;
    padding: 8vw 0;
    background: #fff;
  }
  .flow-inner {
    width: 90vw;
    margin: 0 auto;
  }
  /* タイトル */
  .flow-ttl {
    text-align: center;
    font-size: 1.6rem;
    color: #488178;
    margin-bottom: 3vw;
  }
  /* グリッド */
  .flow-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 0 0 1rem 0;
  }
  /* 奇数 */
  .flow-item {
    display: grid;
    grid-template-rows: 1fr;
    align-items: start;
    text-align: center;
  }
  /* 数字 */
  .flow-num {
    font-size: 3rem;
    font-weight: 300;
    line-height: 0;
    font-family: 'Jost', sans-serif;
    background: linear-gradient(180deg, #77c4a1, #0077c4);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  /* 画像 */
  .flow-item img {
    width: 25vw;
    height: 25vw;
    margin: 0 auto;
    display: block;
  }
  /* 見出し */
  .flow-head {
    font-size: 1.2rem;
    color: #0056a8;
    margin: .5rem;
    line-height: 1.5;
    font-weight: bold;
  }
  /* コピー */
  .flow-text {
    font-size: 1rem;
    line-height: 1.8;
    text-align: justify;
  }
  /* 偶数（矢印） */
  .flow-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #a8d9d8;
    height: auto;
    transform: rotate(90deg);
  }
  /* ==============================
flow end
============================== */
  /* ==============================
faq start
============================== */
  .faq {
    width: 100vw;
    padding: 8vw 0;
    background: #dcf0f9;
  }
  .faq-inner {
    width: 90vw;
    margin: 0 auto;
  }
  /* タイトル */
  .faq-head {
    text-align: center;
    margin-bottom: 1rem;
  }
  .faq-ttl {
    font-size: 1.6rem;
    color: #1f2a66;
    margin-bottom: .1rem;
  }
  .faq-sub {
    font-size: 1.2rem;
    color: #1f2a66;
  }
  /* ==============================
Q
============================== */
  .faq-item {
    margin-bottom: 2rem;
  }
  .faq-q {
    display: grid;
    grid-template-columns: 4rem auto 3rem;
    align-items: center;
    background: #fff;
    padding: 1rem 0;
    border-bottom: 0.1vw solid #ccc;
    cursor: pointer;
  }
  .faq-q-num {
    font-family: 'Jost', sans-serif;
    font-size: 2rem;
    width: 100%;
    text-align: center;
    font-weight: 300;
    color: #8abed8;
  }
  .faq-q-text {
    font-size: 1rem;
  }
  /* くの字 */
  .faq-q-icon {
    width: 1rem;
    height: 1rem;
    margin: 0 1rem;
    border-right: 0.4vw solid #8abed8;
    border-bottom: 0.4vw solid #8abed8;
    transform: rotate(45deg);
    transition: .3s;
  }
  .faq-q.open .faq-q-icon {
    transform: rotate(-135deg);
  }
  /* ==============================
A
============================== */
  .faq-a {
    display: grid;
    grid-template-columns: 4rem auto;
    background: #fff;
  }
  .faq-a-num {
    font-family: 'Jost', sans-serif;
    font-size: 2rem;
    width: 100%;
    text-align: center;
    font-weight: 300;
    color: #bf7b5a;
  }
  .faq-a-text {
    font-size: 1rem;
    line-height: 1.8;
    margin: 0 1rem 0 0;
  }
  /* 初期閉じ */
  .accordion-inner-job {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
    padding: 0;
  }
  .accordion-inner-job.open {
    padding: 1.5rem 0;
  }
  /* ==============================
faq end
============================== */
  /* ==============================
future start
============================== */
  .future {
    width: 100vw;
    background: url("../images/img47.jpg") center / cover no-repeat;
  }
  .future-inner {
    width: 90vw;
    margin: 0 auto;
    padding: 3rem 0;
    text-align: center;
  }
  /* コピー */
  .future-copy {
    font-family: 'Noto Serif JP', serif;
    font-size: 1.8rem;
    color: #fff;
    line-height: 1.6;
    margin-bottom: 2rem;
    text-shadow:
      0 0.2vw 0.4vw rgba(0, 0, 0, 0.35), 0 0.6vw 1.5vw rgba(104, 173, 224, 0.8), 0 0 2.5vw rgba(104, 173, 224, 0.9), 0 0 4vw rgba(104, 173, 224, 1);
  }
  .future-copy span {
    font-size: 90%;
  }
  .future-sub {
    font-size: 1.2rem;
    font-family: 'Noto Sans JP', sans-serif;
    margin-top: 2vw;
  }
  /* ボックス */
  .future-box {
    background: rgba(255, 255, 255, 0.8);
    padding: 2.5vw 3vw;
    font-size: .95rem;
    line-height: 1.4;
    text-align: left;
    display: inline-block;
  }
    .future-box p {
	    padding: .5rem 0 .5rem 1em;
text-indent: -1em;
	}
  /* ==============================
future end
============================== */
  /* ==============================
footer　start
============================== */
  .ft {
    width: 100vw;
    min-height: 5rem;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .ft-logo {
    width: 90%;
    display: block;
  }
  .ft span {
    line-height: 5rem;
    width: auto;
    display: block;
    padding-right: 1rem;
    letter-spacing: 0.1rem;
	font-size: .7rem;
  }
  /* ==============================
footer　end
============================== */
}