/*-------------------------
parts　fine追加CSS
-------------------------*/
.cms-block-bgvideo{
  position:fixed;
  z-index:-1;
  }
  .cms-group{
  position:relative;
  }
 .cms-floating__item a {
    text-decoration: none;
}
  /*ヘッダーメニューの右に配置するテキストの修正*/
  .cms-part.cs-menu-right, 
  .cms-part.cs-menu-right .wrap {
      width: fit-content;
  }
  .cms-part.cs-menu-right a.btn-a {
      display: block;
      text-align: center;
      padding: 0.6em 2vw;
      width:auto;
  }
  
/*通常ブロックではパーツに接するパーツには頭にマージンを設ける　即採用*/
.cms-block--normal .cms-part + .cms-part {
  margin-top: 3em;
}
/*通常ブロックでは横並びのギャップ間を2rem*/
.cms-block--normal .cms-part--image_left_s .wrap, .cms-block--normal .cms-part--image_left_m .wrap, .cms-block--normal .cms-part--image_left_l .wrap {
  display: grid;
  gap: 2rem;
  align-items: start;
}

  /*topページのみヒーローとヘッダーが一体に修正*/
  @media (min-width: 768px) {
  #page-1 .site-header {
      background: none;
      border: none;
      box-shadow: none;
      position: fixed;
      width: 100vw;
  }
  }
    
  /*----------------------------------------------------------
.features
  ----------------------------------------------------------*/
  section.features {
    position: relative;
    min-height: 640px;
    padding: 24px 32px 20px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(77, 126, 201, .16);
    overflow: hidden;
  }

  .features h1 {
    margin: 1em auto 0;
    text-align: center;
  }

  .features h1 span { color: #4D7EC9; }

  .features ol {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
  }

  .features li {
    position: absolute;
    width: 250px;
    min-height: 76px;
    padding: 14px 16px 12px 52px;
    border-radius: 8px;
    background: #f3f6fb;
    box-shadow: 0 8px 18px rgba(77, 126, 201, .12);
  }

  .features li::before {
    content: counter(reason);
    counter-increment: reason;
    position: absolute;
    top: 15px;
    left: 14px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    font-weight: 800;
    font-size: 19px;
    background: linear-gradient(145deg, #7fa6df, #4D7EC9);
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .14);
  }

  .features ol { counter-reset: reason; }

  .features strong {
    display: block;
    margin-bottom: 7px;
    color: #4D7EC9;
    font-size: 18px;
    line-height: 1.2;
  }

  .features small {
    display: block;
    font-size: 12px;
    line-height: 1.55;
    font-weight: 700;
  }

  .features li:nth-child(1) {
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
  }

  .features li:nth-child(2) {
    top: 90px;
    left: 34px;
  }

  .features li:nth-child(3) {
    top: 90px;
    right: 34px;
  }

  .features li:nth-child(4) {
    top: 250px;
    left: 34px;
  }

  .features li:nth-child(5) {
    top: 250px;
    right: 34px;
  }

  .features img {
    position: absolute;
    left: 50%;
    bottom: 30px;
    width: 270px;
    height: auto;
    transform: translateX(-50%);
    object-fit: contain;
  }

  @media (max-width: 760px) {
    .features section {
      display: grid;
      min-height: 0;
      padding: 20px;
    }

    .features ol {
      display: grid;
      gap: 12px;
      justify-items: start;
      margin-top: 12px;
    }

    .features li {
      position: relative;
      width: 100%;
      min-height: 70px;
      transform: none !important;
    }

    .features li:nth-child(n) {
      top: auto;
      right: auto;
      left: auto;
    }

    .features img {
      position: relative;
      display: block;
      left: auto;
      bottom: auto;
      width: 50%;
      margin: 18px auto 0;
      transform: none;
      order: -1;
    }
  }
  /*----------------------------------------------------------
  .cs-tag-all-up tx-tagを枠の上に飛び出させる
  ----------------------------------------------------------*/
  .cs-tag-all-up .cms-part,
  .cs-tag-all-up.cms-part{
      margin-top: 1.2em;
  }
  .cs-tag-all-up .wrap .cms-rte {
    padding-top: 1.5rem;
  }
  .cs-tag-all-up span[class*="tx-tag"] {
      position: absolute;
      top: -1.2em;
      border-radius: 10px;
  }
  /*----------------------------------------------------------
  .wave-before　.wave-after blockに波背景
  ----------------------------------------------------------*/
  .wave-before {
    position: relative;
    overflow: hidden;
  padding-top:3rem;
  }
  
  .wave-before::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: unset;
    top: 0;
    z-index: 0;
    width: 100%;
    height: 90px;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201440%20160%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M0%2096L80%2085.3C160%2075%20320%2053%20480%2069.3C640%2085%20800%20139%20960%20144C1120%20149%201280%20107%201360%2085.3L1440%2064V160H0V96Z%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% 100%;
    transform: rotate(180deg);
  }
  
  .wave-before > * {
    position: relative;
    z-index: 1;
  }
  
  .wave-after {
    position: relative;
    overflow: hidden;
    padding-bottom:3rem;
  }
  
  .wave-after::after {
    content: "";
    position: absolute;
    left: 0;
    top: unset;
    bottom: 0;
    z-index: 0;
    width: 100%;
    height: 90px;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201440%20160%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M0%2096L0%2096L20%2092.8L40%2089.7L60%2086.7L80%2083.7L100%2081L120%2078.4L140%2076L160%2073.9L180%2072.1L200%2070.6L220%2069.4L240%2068.6L260%2068.1L280%2068L300%2068.2L320%2068.8L340%2069.8L360%2071.1L380%2072.7L400%2074.6L420%2076.7L440%2079.1L460%2081.8L480%2084.6L500%2087.6L520%2090.7L540%2093.8L560%2097L580%20100.1L600%20103.2L620%20106.3L640%20109.1L660%20111.9L680%20114.4L700%20116.6L720%20118.7L740%20120.4L760%20121.8L780%20122.8L800%20123.6L820%20123.9L840%20124L860%20123.6L880%20122.9L900%20121.9L920%20120.5L940%20118.8L960%20116.8L980%20114.6L1000%20112.1L1020%20109.4L1040%20106.5L1060%20103.5L1080%20100.4L1100%2097.2L1120%2094L1140%2090.9L1160%2087.8L1180%2084.8L1200%2082L1220%2079.3L1240%2076.9L1260%2074.7L1280%2072.8L1300%2071.2L1320%2069.9L1340%2068.9L1360%2068.3L1380%2068L1400%2068.1L1420%2068.6L1440%2069.4L1440%20160H0V96Z%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;
  
  }
  
  .wave-after > * {
    position: relative;
    z-index: 1;
  }
  
  /*----------------------------------------------------------
  .hd-waveをインラインブロックで並べる
  ----------------------------------------------------------*/
  @media (min-width: 601px) {
  .hd-wave .cms-rte h1::before, .hd-wave .cms-rte h2::before, .hd-wave .cms-rte h3::before, .hd-wave .cms-rte h4::before, .hd-wave .cms-rte h5::before, .hd-wave .cms-rte h6::before {
    content: "";
    position: relative;
    left: 0em;
    height: 1.17em;
    transform: translateY(-50%);
    width: clamp(3em, 10vw, 4.6em);
    aspect-ratio: 383 / 140;
    background: url(data:image/svg+xml,%3Csvg%20viewBox%3D%2266%20170%20383%20140%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22waveGrad%22%20x1%3D%2270%22%20y1%3D%22270%22%20x2%3D%22445%22%20y2%3D%22270%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23005BEA%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%2363D8FF%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%22M70%20306%20C92%20214%2C%20168%20165%2C%20256%20176%20C320%20184%2C%20353%20235%2C%20421%20219%20C386%20252%2C%20335%20257%2C%20279%20233%20C204%20201%2C%20124%20223%2C%2070%20306Z%22%20fill%3D%22url%28%23waveGrad%29%22%2F%3E%3Cpath%20d%3D%22M160%20292%20C188%20242%2C%20228%20227%2C%20278%20242%20C333%20258%2C%20374%20282%2C%20445%20245%20C397%20303%2C%20320%20315%2C%20259%20292%20C217%20276%2C%20188%20284%2C%20160%20292Z%22%20fill%3D%22url%28%23waveGrad%29%22%2F%3E%3C%2Fsvg%3E) no-repeat left center / contain;
    z-index: 0;
    pointer-events: none;
    display: inline-block;
    line-height: 1;
    top: 0.7em;
    margin: 0 0.3em;
  }
  }
  /*----------------------------------------------------------
  正式採用されるまで
  
   ===== flow-r：矢印を「＞」→「→」に（ai-code後読みで上書き・ツウィール全ページ共通） ===== 
  .cms-part.flow-r:not(:last-child)::after,
  .flow-r .cms-part:not(:last-child)::after {
    border: none;
    width: 4rem; height: 3.6rem;
    right: -2.7rem;
    transform: translateY(-50%);
    background-color: var(--col-a);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 12h16M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 12h16M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
  }
  @media (max-width: 600px) {
    SPは縦並び＝矢印を下向きに
    .cms-part.flow-r:not(:last-child)::after,
    .flow-r .cms-part:not(:last-child)::after {
      top: auto; bottom: -2.6rem; right: 50%;
      transform: translateX(50%) rotate(90deg);
    }
  }
  ----------------------------------------------------------*/