@charset "UTF-8";
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

img {
  display: block;
}

a img {
  border: none;
}

ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
}
table th {
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
table td {
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: white;
  color: #2E3339;
  font-size: 16px;
  line-height: 1.8;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, Verdana, Meiryo, sans-serif;
}
body input {
  font-size: 100%;
}

a {
  color: #333;
  transition: color 300ms ease;
  text-decoration: none;
}
a:hover {
  color: #31B1B0;
  transition: color 300ms ease;
}

header {
  width: 100%;
  height: 80px;
  display: flex;
  align-items: center;
  background-color: #022456;
}
header .container {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
header .container .header-title {
  width: 120px;
  height: 41px;
  margin-left: 20px;
}
header .container .header-title p {
  background: url(../images/logo.png) no-repeat center center;
  background-size: contain;
  width: 100%;
  height: 100%;
}
header .container .header-title p a {
  display: block;
  text-indent: -9999px;
}
header .container .r {
  display: flex;
  justify-content: right;
  align-items: center;
  gap: 24px;
}
header .container .r ul {
  display: flex;
  justify-content: flex-end;
}
header .container .r ul li a {
  color: white;
  transition: color 300ms ease;
}
header .container .r ul li a:hover {
  color: #97d34a;
  transition: color 300ms ease;
}
header .container .r ul li:not(:last-child)::after {
  content: "｜";
  color: white;
}
header .container .r .out {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 300px;
  height: 40px;
  margin-right: 20px;
}
header .container .r .out a {
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 140px;
  height: 40px;
  border: 1px solid white;
  border-radius: 20px;
  background-color: transparent;
  text-align: center;
  transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
}
header .container .r .out a:hover {
  color: #97d34a;
  background-color: rgba(0, 0, 0, 0.3);
  border-color: #97d34a;
  transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
}
header .container .r .out a:last-child {
  color: #97d34a;
  border-color: #97d34a;
  background-color: transparent;
  transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
}
header .container .r .out a:last-child span {
  display: flex;
  align-items: center;
}
header .container .r .out a:last-child span::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  margin-right: 8px;
  -webkit-mask: url(../images/lp2608/icon04.png) no-repeat center center;
          mask: url(../images/lp2608/icon04.png) no-repeat center center;
  -webkit-mask-size: contain;
          mask-size: contain;
  background-color: #97d34a;
  transition: background-color 300ms ease;
}
header .container .r .out a:last-child:hover {
  color: white;
  border-color: white;
  background-color: rgba(0, 0, 0, 0.3);
  transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
}
header .container .r .out a:last-child:hover span::before {
  background-color: white;
  transition: background-color 300ms ease;
}

@media screen and (max-width: 1200px) {
  header .container .r ul {
    font-size: 1.4vw;
  }
  header .container .r .out {
    width: 25vw;
  }
  header .container .r .out a {
    width: 12vw;
    font-size: 1.4vw;
  }
}
@media screen and (max-width: 900px) {
  header {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99;
    background-color: transparent;
  }
  header .container {
    justify-content: right;
    position: relative;
    z-index: 2;
  }
  header .container .header-title {
    margin-right: auto;
  }
  header .container .r ul {
    display: none;
  }
  header .container .r .out {
    width: 260px;
  }
  header .container .r .out a {
    width: 120px;
    font-size: 100%;
  }
}
@media screen and (max-width: 600px) {
  header .container .r .out {
    display: none;
  }
}
.header-blend {
  display: none;
}

@media screen and (max-width: 900px) {
  .header-blend {
    display: block;
    width: 100%;
    height: 80px;
    background-color: #022456;
    mix-blend-mode: multiply;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 98;
  }
}
/**
 * mobile-menu.css
 * #toggle_menu_button のクリックで #mobile-menu を開閉する。
 * #mobile-menu の中身は accordandgo/g-navigation パターンの出力
 * （wp-block-list）をそのまま使用し、サブ項目を持つ<li>はタップで開閉する。
 */
#toggle_menu_button {
  display: none;
}

@media screen and (max-width: 900px) {
  #toggle_menu_button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    z-index: 30;
    cursor: pointer;
    position: relative;
  }
  #toggle_menu_button span {
    display: block;
    width: 32px;
    height: 2px;
    background-color: #03ac4b;
    text-indent: -9999px;
    position: absolute;
    left: 16px;
  }
  #toggle_menu_button span:first-child {
    top: 30px;
    transform: rotate(0);
    transition: transform 300ms ease;
  }
  #toggle_menu_button span:last-child {
    bottom: 30px;
    transform: rotate(0);
    transition: transform 300ms ease;
  }
  #toggle_menu_button.is-open span:first-child {
    transform: rotate(45deg) translateX(6px);
    transform-origin: 30% center;
    transition: transform 300ms ease;
  }
  #toggle_menu_button.is-open span:last-child {
    transform: rotate(-45deg) translateX(6px);
    transform-origin: 30% center;
    transition: transform 300ms ease;
  }
}
#mobile-menu {
  position: fixed;
  top: 80px;
  right: 0;
  width: 100%;
  max-width: 480px;
  height: 100%;
  background-color: #022456;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform 0.25s ease;
  z-index: 25;
  padding: 0 24px 40px;
}
#mobile-menu.is-open {
  transform: translateX(0);
}
#mobile-menu ul.in {
  list-style: none;
  margin: 0;
  padding: 0;
}
#mobile-menu ul.in > li {
  position: relative;
  border-bottom: 1px solid #e5ede3;
}
#mobile-menu ul.in > li > a {
  display: block;
  padding: 14px 0;
  color: white;
  font-size: 15px;
  text-decoration: none;
}
#mobile-menu ul.in > li:has(> ul) > a::after {
  content: "+";
  position: absolute;
  right: 4px;
  top: 14px;
  color: #03ac4b;
}
#mobile-menu ul.in > li.is-open > a::after {
  content: "−";
}
#mobile-menu ul.in > li > ul.wp-block-list {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.25s ease;
}
#mobile-menu ul.in > li.is-open > ul.wp-block-list {
  max-height: 600px;
}
#mobile-menu ul.in > li > ul.wp-block-list li a {
  padding: 10px 0 10px 16px;
  font-size: 100%;
}
#mobile-menu .out {
  display: none;
}

@media screen and (max-width: 900px) {
  #mobile-menu .out {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    margin-top: 30px;
  }
  #mobile-menu .out a {
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 140px;
    height: 40px;
    border: 1px solid white;
    border-radius: 20px;
    background-color: transparent;
    text-align: center;
    transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
    margin-bottom: 20px;
  }
  #mobile-menu .out a:hover {
    color: #97d34a;
    background-color: rgba(0, 0, 0, 0.3);
    border-color: #97d34a;
    transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
  }
  #mobile-menu .out a:first-child {
    width: 100%;
  }
  #mobile-menu .out a:nth-child(2) {
    width: 48%;
  }
  #mobile-menu .out a:last-child {
    width: 48%;
    color: #97d34a;
    border-color: #97d34a;
    background-color: transparent;
    transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
  }
  #mobile-menu .out a:last-child span {
    display: flex;
    align-items: center;
  }
  #mobile-menu .out a:last-child span::before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    -webkit-mask: url(../images/lp2608/icon04.png) no-repeat center center;
            mask: url(../images/lp2608/icon04.png) no-repeat center center;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: #97d34a;
    transition: background-color 300ms ease;
  }
  #mobile-menu .out a:last-child:hover {
    color: white;
    border-color: white;
    background-color: rgba(0, 0, 0, 0.3);
    transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
  }
  #mobile-menu .out a:last-child:hover span::before {
    background-color: white;
    transition: background-color 300ms ease;
  }
}
@media screen and (max-width: 400px) {
  #mobile-menu .out a:nth-child(2) {
    width: 100%;
  }
  #mobile-menu .out a:last-child {
    width: 100%;
  }
}
@media screen and (max-width: 900px) {
  main::before {
    content: "";
    display: block;
    width: 100%;
    height: 80px;
  }
}
section .container {
  width: 100%;
  margin: 0 auto;
}
section .container h2.ttl {
  text-align: center;
  font-size: 240%;
  position: relative;
  padding-bottom: 0.5em;
  margin-bottom: 0.8em;
}
section .container h2.ttl::after {
  content: "";
  display: block;
  background-color: #2E3339;
  width: 3em;
  height: 2px;
  position: absolute;
  left: calc(50% - 1.5em);
  bottom: 0;
}
section .container .consult {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto auto;
  gap: 30px;
  margin-bottom: 80px;
}
section .container .consult p {
  grid-column: 1/3;
  grid-row: 1/2;
  color: white;
  text-align: center;
  font-size: 125%;
}
section .container .consult a {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 2px solid white;
  height: 3em;
  border-radius: 1.5em;
  background-color: transparent;
  text-align: center;
  color: white;
  transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
}
section .container .consult a:hover {
  color: #97d34a;
  background-color: rgba(0, 0, 0, 0.3);
  border-color: #97d34a;
  transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
}
section .container .consult a:first-of-type {
  grid-column: 1/3;
  grid-row: 2/3;
  font-size: 280%;
  margin: 0 120px;
}
section .container .consult a:nth-of-type(2) {
  grid-column: 1/2;
  grid-row: 3/4;
  font-size: 170%;
  margin: 0 0 0 120px;
}
section .container .consult a:nth-of-type(3) {
  grid-column: 2/3;
  grid-row: 3/4;
  color: #97d34a;
  border-color: #97d34a;
  font-size: 170%;
  margin: 0 120px 0 0;
  color: #97d34a;
  border-color: #97d34a;
  background-color: transparent;
  transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
}
section .container .consult a:nth-of-type(3) span {
  display: flex;
  justify-content: center;
  align-items: center;
}
section .container .consult a:nth-of-type(3) span::before {
  content: "";
  display: block;
  width: 1.6em;
  height: 1.6em;
  margin-right: 0.4em;
  -webkit-mask: url(../images/lp2608/icon04.png) no-repeat center center;
          mask: url(../images/lp2608/icon04.png) no-repeat center center;
  -webkit-mask-size: contain;
          mask-size: contain;
  background-color: #97d34a;
  transition: background-color 300ms ease;
}
section .container .consult a:nth-of-type(3):hover {
  color: white;
  border-color: white;
  background-color: rgba(0, 0, 0, 0.3);
  transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease;
}
section .container .consult a:nth-of-type(3):hover span::before {
  background-color: white;
  transition: background-color 300ms ease;
}
section.one .container {
  position: relative;
  max-width: 1920px;
  height: 920px;
}
section.one .container h1 {
  width: 100%;
  height: 920px;
  background: url(../images/lp2608/img01.jpg) no-repeat center center;
  background-size: cover;
  position: absolute;
  left: 0;
  top: 0;
  text-indent: -9999px;
}
section.one .container h2, section.one .container h3 {
  position: relative;
  color: white;
}
section.one .container h3 {
  font-size: 180%;
  padding: 260px 0 20px 280px;
  text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
}
section.one .container h3 > span > span {
  color: #3F84DA;
}
section.one .container h2 {
  font-size: 380%;
  padding: 0 0 0 280px;
  line-height: 1.4;
  text-shadow: 4px 4px 6px rgba(0, 0, 0, 0.5);
}
section.one .container h2 > span {
  display: block;
}
section.one .container h2 > span:first-child {
  text-indent: -0.5em;
}
section.one .container img.ds {
  filter: drop-shadow(8px 8px 10px rgba(0, 0, 0, 0.3));
  max-width: 600px;
  height: auto;
  margin: 0 auto 0 300px;
  position: relative;
  z-index: 1;
}
section.one .container .b {
  content: "";
  display: block;
  background-color: rgba(5, 52, 123, 0.8);
  mix-blend-mode: multiply;
  width: 100%;
  height: 200px;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 0;
}
section.one .container ul {
  width: 100%;
  max-width: 1400px;
  height: 200px;
  position: absolute;
  left: calc(50% - 700px);
  bottom: 0;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
section.one .container ul li {
  padding-left: 80px;
  background: url(../images/lp2608/icon01.png) no-repeat 0 center;
  background-size: 62px auto;
  color: white;
  width: 32%;
}
section.one .container ul li h4 {
  font-size: 135%;
}
section.one .container ul li:nth-child(2) {
  background-image: url(../images/lp2608/icon02.png);
}
section.one .container ul li:nth-child(3) {
  background-image: url(../images/lp2608/icon03.png);
}
section.two {
  padding: 120px 0 60px 0;
  background-color: #f0f0f0;
}
section.two .container {
  max-width: 1000px;
}
section.two .container .row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 60px 0;
  border-bottom: 1px solid #2E3339;
}
section.two .container .row > img {
  max-width: -moz-fit-content;
  max-width: fit-content;
  height: auto;
}
section.two .container .row > img:first-child {
  width: 32%;
}
section.two .container .row > img:last-child {
  width: 53%;
}
section.two .container .row.half > img {
  width: 50%;
}
section.two .container .row.half > div {
  width: 50%;
}
section.two .container .row.half > div.c {
  width: 48%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
section.two .container .row.half > div.c img {
  margin: 0 auto 12px auto;
  max-width: 100%;
  height: auto;
}
section.two .container .row.half > div.c p span {
  display: block;
}
section.two .container .row.half > div h3 {
  font-size: 150%;
  padding-bottom: 1em;
}
section.two .container .row.half > div p.dotline {
  -webkit-text-decoration: underline dotted #2E3339;
          text-decoration: underline dotted #2E3339;
  text-underline-offset: 6px;
  line-height: 2.4;
  padding-right: 2em;
}
section.two .container .row.half > div p.dotline span {
  color: #005fbf;
  font-size: 135%;
  font-weight: 700;
}
section.two .container .row.half > div p.dotline span::before, section.two .container .row.half > div p.dotline span::after {
  content: " ";
}
section.two .container .balloon {
  position: relative;
  display: block;
  width: 100%;
  padding: 16px 20px;
  background: #424e60;
  color: #fff;
  font-size: 150%;
  font-weight: 700;
  text-align: center;
}
section.two .container .balloon::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 1.2em 2.4em 0;
  border-style: solid;
  border-color: #424e60 transparent transparent;
}
section.two .container .customer {
  position: relative;
  margin-bottom: 60px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
section.two .container .customer p {
  position: relative;
}
section.two .container .customer p.img {
  width: 356px;
  height: auto;
  aspect-ratio: 356/275;
}
section.two .container .customer p.img img {
  width: 100%;
  height: auto;
  border: 2px solid #888d96;
}
section.two .container .customer p.img::after {
  content: "";
  display: block;
  background-color: #888d96;
  width: 2px;
  height: 40px;
  position: absolute;
  left: calc(50% - 1px);
  bottom: -2px;
}
section.two .container .customer p.img.lu {
  margin-top: 140px;
}
section.two .container .customer p.img.ll {
  margin-top: 20px;
}
section.two .container .customer p.img.mu {
  margin-top: 60px;
  margin-left: -100px;
}
section.two .container .customer p.img.ml {
  margin-top: -90px;
  margin-left: -100px;
}
section.two .container .customer p.img.ru {
  margin-top: 180px;
  margin-left: -100px;
}
section.two .container .customer p.img.rl {
  margin-top: 30px;
  margin-left: -100px;
}
section.two .container .customer .txt {
  position: relative;
  display: inline-block;
  text-align: center;
  margin: 40px auto 0 auto;
  font-size: 150%;
}
section.two .container .customer .txt::after {
  content: "";
  display: block;
  width: 100%;
  height: 6px;
  background: linear-gradient(to right, #3f84da, #85ceed);
}
section.two .container .menu {
  display: flex;
  flex-direction: column;
}
section.two .container .menu .items {
  position: relative;
  margin-bottom: 40px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: nowrap;
}
section.two .container .menu .items p.img {
  position: relative;
  width: 356px;
  height: 346px;
  aspect-ratio: 356/346;
  overflow: visible;
}
section.two .container .menu .items p.img img {
  width: 100%;
  height: auto;
  border: 2px solid #888d96;
}
section.two .container .menu .items p.img::after {
  content: "";
  display: block;
  background-color: #888d96;
  width: 2px;
  height: 40px;
  position: absolute;
  left: calc(50% - 1px);
  bottom: -34px;
}
section.two .container .menu .items p.img.l {
  margin-top: 140px;
}
section.two .container .menu .items p.img.m {
  margin-left: -34px;
  margin-top: 60px;
}
section.two .container .menu .items p.img.r {
  margin-left: -34px;
  margin-top: 180px;
}
section.two .container .menu p.txt {
  position: relative;
  display: inline-block;
  text-align: center;
  margin: 0 auto 20px auto;
  font-size: 150%;
}
section.two .container .menu p.txt::after {
  content: "";
  display: block;
  width: 100%;
  height: 6px;
  background: linear-gradient(to right, #3f84da, #85ceed);
}
section.two .container .menu p.txt + p {
  width: 100%;
  text-align: center;
}
section.two .container .menu p.txt + p span {
  display: block;
}
section.three {
  padding: 60px 0 0 0;
  min-height: 600px;
  background-image: url(../images/lp2608/bg01.jpg), conic-gradient(from 45deg at 50% 50%, #ffffff 0deg, #e1e1e1 90deg, #f1f1f2 180deg, #f5f5f7 270deg, #ffffff 360deg);
  background-repeat: no-repeat, no-repeat;
  background-position: center center, center center;
  background-size: auto 100%, 100% 100%;
}
section.three .container {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
}
section.three .container h2.v {
  writing-mode: vertical-rl;
  text-orientation: upright;
  height: 10em;
  font-size: 320%;
  position: relative;
  padding-right: 280px;
  display: inline-block;
}
section.three .container h2.v::after {
  content: "";
  display: block;
  width: 200px;
  height: 2px;
  background-color: #2E3339;
  position: absolute;
  right: 40px;
  top: 0.5em;
}
section.three .container ul {
  font-size: 150%;
}
section.three .container ul li {
  padding-bottom: 0.5em;
}
section.three .container ul li::before {
  content: "";
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  background: url(../images/lp2608/icon05.png) no-repeat center center;
  background-size: contain;
  margin-right: 0.5em;
  transform: translateY(0.3em);
}
section.three .container h3.skew {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: -100px;
  width: 550px;
  aspect-ratio: 550/250;
  background: linear-gradient(90deg, #3f84da 0%, #85ceed 100%);
  clip-path: polygon(0% 30.92%, 4.54% 92.37%, 33.94% 100%, 100% 64.26%, 96.01% 0%);
}
section.three .container h3.skew .in {
  position: absolute;
  top: 36%;
  left: 12%;
  justify-content: center;
  transform: rotate(-4.6deg);
  transform-origin: left top;
  color: #fff;
  white-space: nowrap;
}
section.three .container h3.skew .upper {
  display: block;
  margin-bottom: 0.35em;
  font-size: 150%;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
}
section.three .container h3.skew .lower {
  display: block;
  font-size: 320%;
  font-weight: 900;
  line-height: 1;
}
section.four {
  min-height: 1310px;
  background-image: url(../images/lp2608/bg02.jpg), linear-gradient(to right, #5e6c76 0%, #5e6c76 50%, #6c7983 50%, #6c7983 100%);
  background-repeat: no-repeat;
  background-position: calc(50% + clamp(0px, (1300px - 100vw) * 0.5, 200px)) center;
  background-size: auto 1318px, cover;
  padding: 120px 0 0 0;
}
section.four .container {
  max-width: 1000px;
  margin: 0 auto;
}
section.four .container h2 {
  font-size: 320%;
  color: white;
  text-align: center;
  position: relative;
  padding-bottom: 0.6em;
}
section.four .container h2::after {
  content: "";
  display: block;
  width: 3em;
  height: 2px;
  background-color: white;
  position: absolute;
  left: calc(50% - 1.5em);
  bottom: 0;
}
section.four .container h2 br {
  display: none;
}
section.four .container .row {
  display: flex;
  justify-content: center;
  align-items: center;
}
section.four .container .row ul {
  padding-right: 2em;
}
section.four .container .row ul li {
  position: relative;
  color: white;
  text-align: center;
  font-size: 150%;
  font-weight: 700;
  padding: 0.6em 3em 1.2em 0;
}
section.four .container .row ul li::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 3em;
  height: 3em;
  background-image: url(../images/lp2608/icon06.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
section.four .container .row ul li:first-child::after {
  transform: translateX(1.2em);
}
section.four .container .row ul li:nth-child(2)::after {
  background-image: url(../images/lp2608/icon07.png);
}
section.four .container .row ul li:nth-child(3)::after {
  background-image: url(../images/lp2608/icon08.png);
}
section.four .container .row ul li:nth-child(4)::after {
  background-image: url(../images/lp2608/icon09.png);
  transform: translateX(1.2em);
}
section.four .container .row .ring {
  position: relative;
  width: 470px;
  aspect-ratio: 1;
}
section.four .container .row .ring::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid #5ac8f5;
  border-radius: 50%;
  -webkit-mask: conic-gradient(from 220deg, #000 0deg 90deg, transparent 90deg);
          mask: conic-gradient(from 220deg, #000 0deg 90deg, transparent 90deg);
}
section.four .container .row .ring::after {
  content: "";
  position: absolute;
  inset: 6%;
  border: 2px solid #262f3c;
  border-radius: 50%;
}
section.four .container .row .ring .circle {
  position: absolute;
  inset: 8%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 13%;
  border-radius: 50%;
  background: #262f3c;
  color: #fff;
  text-align: center;
}
section.four .container .row .ring .circle::before {
  content: "";
  position: absolute;
  top: 95%;
  left: 12%;
  width: 20px;
  border-top: 2px solid #5ac8f5;
  transform: rotate(-90deg);
  transform-origin: left center;
}
section.four .container .row .ring h3 {
  margin-bottom: 1.1em;
  color: #5ac8f5;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
}
section.four .container .row .ring p {
  font-size: 15px;
  line-height: 2;
  text-align: left;
}
section.four .container .row:last-of-type {
  flex-direction: row-reverse;
}
section.four .container .row:last-of-type ul {
  padding-right: 0;
  padding-left: 2em;
}
section.four .container .row:last-of-type ul li {
  padding: 0.6em 0 1.2em 3em;
}
section.four .container .row:last-of-type ul li::after {
  right: initial;
  left: 0;
  background-image: url(../images/lp2608/icon10.png);
}
section.four .container .row:last-of-type ul li:first-child::after {
  transform: translateX(-1.2em);
}
section.four .container .row:last-of-type ul li:nth-child(2)::after {
  background-image: url(../images/lp2608/icon11.png);
}
section.four .container .row:last-of-type ul li:nth-child(3)::after {
  background-image: url(../images/lp2608/icon12.png);
}
section.four .container .row:last-of-type ul li:nth-child(4)::after {
  transform: translateX(-1.2em);
}
section.four .container .row:last-of-type .ring::before {
  -webkit-mask: conic-gradient(from 50deg, #000 0deg 90deg, transparent 90deg);
          mask: conic-gradient(from 50deg, #000 0deg 90deg, transparent 90deg);
}
section.four .container .row:last-of-type .ring .circle::before {
  left: initial;
  right: 6.5%;
}
section.five .container h2 {
  position: relative;
  padding: 0.8em 0;
  background: linear-gradient(to right, #0b7fd4, #5fc8ee 50%, #1e9fe0);
  color: #fff;
  text-align: center;
  font-size: 180%;
}
section.five .container h2 span {
  font-size: 150%;
}
section.five .container h2::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 120px;
  height: 30px;
  transform: translateX(-50%);
  background: inherit;
  background-size: 100vw 100%;
  background-position: center;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
section.six {
  padding: 100px 0;
}
section.six .container {
  max-width: 1000px;
  margin: 0 auto;
}
section.six .container h3 {
  font-size: 180%;
  text-align: center;
  padding-bottom: 1em;
  color: #3f84da;
}
section.six .container h3 br {
  display: none;
}
section.six .container h2 {
  aspect-ratio: 861/168;
  width: 861px;
  margin: 0 auto;
  background: url(../images/lp2608/ttl01.png) no-repeat center center;
  background-size: contain;
  text-indent: -9999px;
}
section.six .container h4 {
  font-size: 240%;
  text-align: center;
  padding-bottom: 1em;
  color: #3f84da;
  padding: 1em 0 0 0;
  background-color: white;
  width: 17em;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
section.six .container .row {
  display: flex;
  justify-content: left;
  align-items: flex-start;
}
section.six .container .row p.circle {
  color: #3f84da;
  width: 14em;
  height: 14em;
  border: 2px solid #3f84da;
  border-radius: 50%;
  transform: rotate(-20deg);
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex-direction: column;
  font-weight: 700;
  margin: -50px 80px 0 120px;
  position: relative;
  z-index: 0;
}
section.six .container .row p.circle span {
  display: block;
  transform: translate(0.3em, 1em);
}
section.six .container .row p.box {
  border: 2px solid #90959d;
  margin-top: 54px;
  padding: 1em 2em;
  background-color: white;
  font-weight: 700;
  text-align: center;
}
section.six .container .img {
  max-width: 940px;
  width: 100%;
  margin: 0 auto;
  position: relative;
  overflow: visible;
  padding-top: 98px;
}
section.six .container .img img {
  width: 100%;
  height: auto;
}
section.six .container .img::before {
  content: "";
  display: block;
  width: 2px;
  height: 100px;
  background-color: #8f959e;
  position: absolute;
  left: 531px;
  top: 0;
}
section.seven {
  padding: 100px 0;
  background: url(../images/lp2608/bg03.jpg) center center;
  background-size: cover;
}
section.seven .container {
  max-width: 1000px;
  margin: 0 auto;
}
section.seven .container h2 {
  text-align: center;
  position: relative;
  padding-bottom: 0.8em;
  margin-bottom: 40px;
  font-size: 100%;
}
section.seven .container h2 span {
  display: block;
}
section.seven .container h2 span:first-child {
  font-size: 135%;
}
section.seven .container h2 span:last-child {
  font-size: 280%;
}
section.seven .container h2::after {
  content: "";
  display: block;
  position: absolute;
  width: 3em;
  height: 2px;
  background-color: #333;
  left: calc(50% - 1.5em);
  bottom: 0;
}
section.seven .container .row {
  display: flex;
  margin-bottom: 30px;
  align-items: stretch;
}
section.seven .container .row > div {
  width: 50%;
  height: auto;
}
section.seven .container .row > div:first-child {
  overflow: hidden;
}
section.seven .container .row > div:first-child img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
section.seven .container .row > div:last-child {
  background-color: #545C65;
  color: white;
  padding: 20px 30px;
}
section.seven .container .row > div:last-child h3 {
  text-align: center;
  font-size: 135%;
  padding-bottom: 0.5em;
}
section.seven .container .row > div:last-child p.num {
  font-size: 240%;
  font-weight: 700;
  width: 1.4em;
  height: 1.4em;
  position: relative;
  margin-bottom: 0.3em;
  transform: scaleX(0.8);
}
section.seven .container .row > div:last-child p.num::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 240%;
  height: 1px;
  background: white;
  transform: translate(-50%, -50%) rotate(-40deg);
}
section.seven .container .row > div:last-child p:last-child {
  padding: 0 1em;
}
section.eight {
  padding: 100px 0;
  background: url(../images/lp2608/bg04.jpg) center top;
}
section.eight .container {
  max-width: 1000px;
  margin: 0 auto;
}
section.eight .container h2 {
  text-align: center;
  position: relative;
  padding-bottom: 0.8em;
  margin-bottom: 70px;
  font-size: 280%;
}
section.eight .container h2::after {
  content: "";
  display: block;
  position: absolute;
  width: 3em;
  height: 2px;
  background-color: #333;
  left: calc(50% - 1.5em);
  bottom: 0;
}
section.eight .container > div:last-child {
  width: 100%;
  padding: 30px 5%;
  position: relative;
}
section.eight .container > div:last-child::before {
  content: "";
  display: block;
  width: 50%;
  height: 100%;
  background-color: white;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
}
section.eight .container > div:last-child::after {
  content: "";
  display: block;
  width: 50%;
  height: 110%;
  background-color: #2e3339;
  position: absolute;
  right: 0;
  top: -5%;
  z-index: 0;
}
section.eight .container > div:last-child table {
  width: 100%;
  position: relative;
  z-index: 1;
  border: none;
}
section.eight .container > div:last-child table tr th {
  width: 20%;
  padding: 0.3em;
  border: 1px solid #ddd;
  border-right: none;
  color: #666;
  background-color: #eee;
}
section.eight .container > div:last-child table tr td:first-of-type {
  color: #666;
  width: 30%;
  padding: 0.3em 0 0.3em 2em;
  border: 1px solid #ddd;
  border-right: none;
}
section.eight .container > div:last-child table tr td:last-of-type {
  color: white;
  width: 50%;
  padding: 0.3em 0 0.3em 2em;
  border: 1px solid #ddd;
  border-right: none;
  font-weight: 700;
  font-size: 125%;
}
section.eight .container > div:last-child table tr:first-child th, section.eight .container > div:last-child table tr:first-child td {
  border: none;
  text-align: center;
  font-weight: 700;
  font-size: 115%;
  background-color: transparent;
}
section.eight .container > div:last-child table tr:first-child td:last-child {
  font-size: 150%;
  color: #85ceed;
}
section.eight .container > div:last-child table tr:last-child th, section.eight .container > div:last-child table tr:last-child td {
  border: none;
  font-size: 75%;
  text-align: right;
  padding-top: 1.6em;
  background-color: transparent;
}
section.nine {
  background-color: #022456;
  padding: 60px 0;
}
section.nine .container {
  max-width: 1000px;
  margin: 0 auto;
}
section.nine .container a.starter-kit {
  width: 100%;
  display: block;
  aspect-ratio: 20/5;
  border: 3px solid #05347b;
  transition: border-color 300ms ease;
  border-radius: 16px;
  background: url(../images/lp2608/banner01.jpg) no-repeat center center;
  background-size: cover;
}
section.nine .container a.starter-kit:hover {
  border-color: #97d34a;
  transition: border-color 300ms ease;
}
section.nine.lower {
  border-bottom: 1px solid #858b94;
  padding-bottom: 0;
}
section.ten {
  padding: 100px 0;
  background: url(../images/lp2608/bg05.jpg) center top;
}
section.ten .container {
  max-width: 1000px;
  margin: 0 auto;
}
section.ten .container .upper {
  color: white;
  padding: 0 0 1em 0.5em;
  background: url(../images/lp2608/img12.png) no-repeat right bottom;
  background-size: 225px 360px;
  min-height: 360px;
}
section.ten .container .upper h2 {
  font-size: 260%;
  padding-bottom: 0.8em;
}
section.ten .container .upper h2 span {
  display: inline-block;
}
section.ten .container .upper h2 span:first-child {
  background: linear-gradient(to right, #3F84DA, #85CEED);
  padding: 0 0.3em 0 0.5em;
  letter-spacing: 0.2em;
  transform: rotate(-12deg);
}
section.ten .container .upper h2 span:last-child {
  font-size: 120%;
  padding-left: 0.5em;
}
section.ten .container .upper h3 {
  font-size: 150%;
  padding-bottom: 0.5em;
}
section.ten .container .upper h3 span {
  display: block;
}
section.ten .container .upper h3 span:last-child {
  padding-left: 1em;
}
section.ten .container .mid {
  background-color: #545C65;
  padding: 30px;
  display: flex;
  color: white;
}
section.ten .container .mid > div:first-child {
  width: 60%;
  border-right: 2px solid white;
  padding-right: 30px;
}
section.ten .container .mid > div:first-child h3 {
  background: linear-gradient(to right, #3F84DA, #85CEED);
  font-size: 150%;
  padding: 0 0 0 2em;
  margin-bottom: 0.8em;
}
section.ten .container .mid > div:first-child ul {
  font-size: 115%;
  list-style-type: disc;
  padding-left: 1.2em;
}
section.ten .container .mid > div:last-child {
  width: 40%;
  padding-left: 30px;
}
section.ten .container .mid > div:last-child h4 {
  font-size: 135%;
  padding: 0 0 0.6em 0;
}
section.ten .container .mid > div:last-child ul li {
  position: relative;
  padding-left: 1.6em;
}
section.ten .container .mid > div:last-child ul li::before {
  content: "";
  display: block;
  width: 1.2em;
  height: 1.2em;
  background: url(../images/lp2608/icon13.png) no-repeat center center;
  background-size: contain;
  position: absolute;
  left: 0;
  top: 0.2em;
}
section.ten .container .lower {
  color: white;
}
section.ten .container .lower > div {
  display: flex;
  align-items: flex-start;
}
section.ten .container .lower > div:nth-last-child(2) {
  justify-content: left;
}
section.ten .container .lower > div:nth-last-child(2) > div {
  width: 46%;
  margin-left: 4%;
}
section.ten .container .lower > div:nth-last-child(2) > div:first-child {
  padding: 0 30px 40px 0;
}
section.ten .container .lower > div:nth-last-child(2) > div:first-child h3 {
  font-size: 150%;
  display: flex;
  align-items: center;
  justify-content: left;
}
section.ten .container .lower > div:nth-last-child(2) > div:first-child h3::after {
  content: "";
  display: inline-block;
  width: 3.6em;
  height: 3.6em;
  margin-left: 0.8em;
  background: url(../images/lp2608/icon14.png) no-repeat center center;
  background-size: contain;
}
section.ten .container .lower > div:nth-last-child(2) > div:last-child h3 {
  font-size: 150%;
  line-height: 3.6;
}
section.ten .container .lower > div:nth-last-child(2) > div:last-child p {
  font-size: 140%;
}
section.ten .container .lower > div:last-child {
  justify-content: space-between;
}
section.ten .container .lower > div:last-child a {
  width: 46%;
  font-size: 150%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 3em;
  color: white;
  font-weight: 700;
  border-radius: 1.5em;
}
section.ten .container .lower > div:last-child a:first-child {
  background-color: transparent;
  border: 2px solid white;
  transition: color 300ms ease, 300ms ease, border-color 300ms ease;
}
section.ten .container .lower > div:last-child a:first-child::before {
  content: "";
  display: inline-block;
  width: 1.8em;
  height: 1.8em;
  margin-right: 0.6em;
  -webkit-mask: url(../images/lp2608/icon15.png) no-repeat center center;
          mask: url(../images/lp2608/icon15.png) no-repeat center center;
  -webkit-mask-size: contain;
          mask-size: contain;
  background-color: white;
  transition: background-color 300ms ease;
}
section.ten .container .lower > div:last-child a:first-child:hover {
  color: #97d34a;
  border-color: #97d34a;
  background-color: rgba(0, 102, 255, 0.3);
  transition: color 300ms ease, 300ms ease, border-color 300ms ease;
}
section.ten .container .lower > div:last-child a:first-child:hover::before {
  background-color: #97d34a;
  transition: background-color 300ms ease;
}
section.ten .container .lower > div:last-child a:last-child {
  background: linear-gradient(to right, #3F84DA 0%, #85CEED 50%, #3F84DA 100%);
  background-size: 200% 100%;
  background-position: left center;
  transition: background-position 300ms ease;
}
section.ten .container .lower > div:last-child a:last-child:hover {
  background-position: right center;
  transition: background-position 300ms ease;
}
section.eleven {
  padding: 80px 0;
  background-color: #f0f0f0;
}
section.eleven .container {
  max-width: 1000px;
  margin: 0 auto;
}
section.eleven .container h2 {
  text-align: center;
  position: relative;
  padding-bottom: 0.8em;
  margin-bottom: 70px;
  font-size: 280%;
}
section.eleven .container h2::after {
  content: "";
  display: block;
  position: absolute;
  width: 3em;
  height: 2px;
  background-color: #333;
  left: calc(50% - 1.5em);
  bottom: 0;
}
section.eleven .container dl dt, section.eleven .container dl dd {
  display: flex;
  justify-content: left;
  align-items: flex-start;
}
section.eleven .container dl dt span, section.eleven .container dl dd span {
  display: block;
}
section.eleven .container dl dt {
  border-top: 1px solid #b5bcc4;
  font-size: 120%;
  padding: 40px 0 16px 30px;
}
section.eleven .container dl dt span:first-child {
  width: 2em;
  height: 2em;
  border-radius: 50%;
  background-color: #abadb0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  margin-right: 20px;
  font-weight: 700;
}
section.eleven .container dl dd {
  padding: 0 0 30px 30px;
}
section.eleven .container dl dd span:first-child {
  margin-right: 30px;
  margin-left: 12px;
  font-weight: 700;
}

@media screen and (max-width: 1920px) {
  section.one .container h2, section.one .container h3 {
    padding-left: calc((100vw - 1920px) / 2 + 280px);
  }
  section.one .container img.ds {
    margin-left: calc((100vw - 1920px) / 2 + 300px);
  }
}
@media screen and (max-width: 1400px) {
  section.one .container h2, section.one .container h3 {
    padding-left: 20px;
  }
  section.one .container img.ds {
    margin-left: 30px;
  }
  section.one .container .b {
    height: 280px;
  }
  section.one .container ul {
    display: grid;
    grid-template-columns: 600px auto;
    grid-template-rows: 1fr 1fr;
    max-width: initial;
    height: auto;
    width: 96%;
    left: 2%;
    bottom: 30px;
    gap: 30px;
    justify-content: center;
  }
  section.one .container ul li {
    width: 100%;
    margin: 0 auto 0 0;
  }
  section.one .container ul li:first-child {
    grid-column: 2/3;
    grid-row: 1/2;
  }
  section.one .container ul li:nth-child(2) {
    grid-column: 1/2;
    grid-row: 2/3;
  }
  section.one .container ul li:nth-child(3) {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
@media screen and (max-width: 1200px) {
  section.one .container {
    height: auto;
    min-height: initial;
    aspect-ratio: 10/7;
  }
  section.one .container h1 {
    height: 100%;
    background-size: auto 100%;
  }
  section.one .container h3 {
    padding-top: 20vw;
    font-size: 2.4vw;
  }
  section.one .container h2 {
    font-size: 4.6vw;
  }
  section.one .container img.ds {
    width: 50%;
    margin-left: 30px;
  }
  section.one .container .b {
    height: 280px;
  }
  section.one .container ul {
    display: grid;
    grid-template-columns: 55% auto;
    width: 96%;
    left: 2%;
    bottom: 30px;
    gap: 30px;
    justify-content: center;
  }
  section.one .container ul li {
    width: 100%;
    margin: 0 auto 0 0;
  }
  section.one .container ul li:first-child {
    grid-column: 2/3;
    grid-row: 1/2;
  }
  section.one .container ul li:nth-child(2) {
    grid-column: 1/2;
    grid-row: 2/3;
  }
  section.one .container ul li:nth-child(3) {
    grid-column: 2/3;
    grid-row: 2/3;
  }
}
@media screen and (max-width: 1040px) {
  section.one .container {
    height: auto;
    min-height: initial;
  }
  section.one .container h1 {
    height: 100%;
    background-size: auto 100%;
  }
  section.one .container .b {
    height: 24vw;
  }
  section.one .container ul {
    grid-template-columns: 48% auto;
    bottom: 20px;
    gap: 20px;
  }
  section.one .container ul li {
    font-size: 1.5vw;
  }
  section.two .container .row {
    padding: 60px 20px;
  }
  section.two .container .menu .items {
    padding: 0 20px;
  }
  section.two .container .menu .items p.img {
    width: 36%;
    height: auto;
  }
  section.two .container .menu .items p.img.l {
    margin-top: 140px;
  }
  section.two .container .menu .items p.img.m {
    margin-left: -4%;
    margin-top: 60px;
  }
  section.two .container .menu .items p.img.r {
    margin-left: -4%;
    margin-top: 180px;
  }
  section.six .container h2 {
    max-width: 96%;
  }
  section.six .container .img {
    max-width: 96%;
    height: auto;
  }
  section.six .container .img::before {
    left: 56.5%;
  }
  section.ten .container .upper {
    padding: 0 20px;
  }
  section.ten .container .lower > div:last-child {
    justify-content: space-around;
  }
  section.nine .container a.starter-kit {
    width: 92%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 900px) {
  section .container .consult p {
    padding: 0 3%;
  }
  section .container .consult a:first-of-type {
    margin: 0 3%;
  }
  section .container .consult a:nth-of-type(2) {
    margin-left: 6%;
  }
  section .container .consult a:nth-of-type(3) {
    margin-right: 6%;
  }
  section.two .container .customer {
    justify-content: center;
  }
  section.two .container .customer p.img {
    width: 50%;
  }
  section.two .container .customer p.img.lu {
    margin-top: 20vw;
  }
  section.two .container .customer p.img.ll {
    margin-top: -8vw;
    margin-left: -4vw;
  }
  section.two .container .customer p.img.mu {
    margin-top: 10vw;
    margin-left: -6vw;
  }
  section.two .container .customer p.img.ml {
    margin-top: 8vw;
    margin-left: 0;
    z-index: 1;
  }
  section.two .container .customer p.img.ru {
    margin-top: 6vw;
    margin-left: 0;
  }
  section.two .container .customer p.img.rl {
    margin-top: -12vw;
    margin-left: -10vw;
  }
  section.two .container .customer p.img::after {
    bottom: initial;
  }
  section.two .container .menu p.img.l {
    z-index: 1;
  }
  section.four {
    background-position: calc(50% + 200px);
    background-size: auto 100%;
    min-height: initial;
    padding-bottom: 80px;
  }
  section.four .container h2 br {
    display: inline;
  }
  section.four .container .row .ring {
    width: 52vw;
  }
  section.six .container h3 br {
    display: inline;
  }
  section.ten .container .upper p {
    text-shadow: 2px 2px 2px #666;
  }
}
@media screen and (max-width: 768px) {
  section .container .consult a:first-of-type {
    font-size: 6vw;
  }
  section .container .consult a:nth-of-type(2) {
    font-size: 3.8vw;
  }
  section .container .consult a:nth-of-type(3) {
    font-size: 3.8vw;
  }
  section.one .container {
    aspect-ratio: 750/1184;
  }
  section.one .container h1 {
    aspect-ratio: 750/1184;
    background-image: url(../images/lp2608/img01-sp.jpg);
  }
  section.one .container h3 {
    font-size: 4.6vw;
    padding-top: 72vw;
  }
  section.one .container h3 > span {
    display: block;
  }
  section.one .container h2 {
    font-size: 6.6vw;
    padding-bottom: 0.5em;
  }
  section.one .container img.ds {
    width: 92%;
    margin: 0 auto;
  }
  section.one .container .b, section.one .container ul {
    height: 52vw;
    bottom: -52vw;
  }
  section.one .container .b {
    background-color: #022456;
  }
  section.one .container ul {
    display: block;
    width: 80%;
    left: 8%;
  }
  section.one .container ul li {
    font-size: 2.6vw;
    padding: 0.5em 0 0.5em 6em;
    background-size: 4.6em 4.6em;
  }
  section.one .container ul li:last-child br {
    display: none;
  }
  section.two {
    padding-top: 60vw;
  }
  section.two .container .row {
    display: block;
  }
  section.two .container .row img {
    width: 92%;
    height: auto;
    margin: 0 auto 40px auto;
  }
  section.two .container .row img:first-child {
    width: 68%;
  }
  section.two .container .row img:last-child {
    width: 92%;
  }
  section.two .container .row > div {
    width: 94%;
    margin: 0 auto 40px auto;
  }
  section.two .container .row.half > img {
    width: 92%;
    margin: 0 auto 40px auto;
  }
  section.two .container .row.half > div {
    width: 94%;
    margin: 0 auto 40px auto;
  }
  section.two .container .row.half > div.c {
    width: 94%;
  }
  section.two .container .row.half > div.c img {
    width: 100%;
  }
  section.two .container .customer p.txt span {
    display: block;
  }
  section.two .container .menu .items p.img {
    width: 45%;
  }
  section.two .container .menu .items p.img.l {
    margin-top: 32vw;
  }
  section.two .container .menu .items p.img.m {
    margin-left: -18%;
    margin-top: 60px;
  }
  section.two .container .menu .items p.img.r {
    margin-left: -17%;
    margin-top: 40vw;
  }
  section.two .container .menu p.txt + p {
    padding: 0 20px;
  }
  section.two .container .menu p.txt + p span:first-child, section.two .container .menu p.txt + p span:nth-child(2) {
    display: inline;
  }
  section.three {
    min-height: initial;
  }
  section.three .container h2.v {
    padding-right: 32vw;
    font-size: 8vw;
  }
  section.three .container h2.v::after {
    width: 26vw;
    right: 5vw;
  }
  section.three .container ul {
    font-size: 3vw;
  }
  section.three .container h3.skew {
    width: 70vw;
    bottom: -6vw;
    right: 1vw;
  }
  section.three .container h3.skew span.upper {
    font-size: 3.8vw;
  }
  section.three .container h3.skew span.lower {
    font-size: 8vw;
  }
  section.four {
    background-position: 26% top;
  }
  section.four .container .row ul {
    padding-right: 1em;
  }
  section.four .container .row ul li {
    padding-right: 2em;
    font-size: 2.6vw;
  }
  section.four .container .row .ring {
    width: 57%;
    margin-right: -3vw;
  }
  section.four .container .row .ring h3 {
    font-size: 3.4vw;
  }
  section.four .container .row .ring p {
    font-size: 2vw;
  }
  section.four .container .row:last-of-type ul {
    padding-left: 1em;
  }
  section.four .container .row:last-of-type ul li {
    padding-left: 2em;
  }
  section.four .container .row:last-of-type ul li:nth-child(2) {
    padding-left: 2.8em;
  }
  section.four .container .row:last-of-type ul li:nth-child(2)::after {
    left: -0.5em;
  }
  section.four .container .row:last-of-type .ring {
    margin-right: 0;
    margin-left: -6vw;
  }
  section.four .container .row:last-of-type .ring .circle::before {
    right: 5%;
  }
  section.six .container h3 {
    font-size: 4vw;
  }
  section.six .container h4 {
    width: auto;
    font-size: 5.6vw;
  }
  section.six .container .row p.circle {
    margin: -50px 10vw 0 3vw;
  }
  section.six .container .img::before {
    left: 72.5%;
  }
  section.eight .container h2 {
    margin-bottom: 0;
  }
  section.eight .container > div:last-child::before, section.eight .container > div:last-child::after {
    content: "";
    display: block;
    width: 33px;
    height: 30px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27.8 25'%3E%3Cpath d='M3 12.5L24.8 12.5M15.3 3L24.8 12.5L15.3 22' fill='none' stroke='%232e3339' stroke-width='6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;
    position: absolute;
    top: 2px;
    z-index: 2;
    opacity: 0;
    transition: opacity 200ms ease;
  }
  section.eight .container > div:last-child::before {
    left: 5%;
  }
  section.eight .container > div:last-child::after {
    right: 5%;
    transform: scaleX(-1);
  }
  section.eight .container > div:last-child.more-right::before {
    opacity: 1;
  }
  section.eight .container > div:last-child.more-left::after {
    opacity: 1;
  }
  section.eight .container > div:last-child .table-scroll {
    overflow-x: auto;
    overscroll-behavior-x: contain;
  }
  section.eight .container > div:last-child .table-scroll table {
    min-width: 640px;
    margin: 0.5em auto 1em auto;
  }
  section.eight .container > div:last-child table tr td:first-of-type {
    background-color: white;
  }
  section.eight .container > div:last-child table tr td:nth-of-type(2) {
    background-color: #2e3339;
  }
  section.eight .container > div:last-child table tr:first-child th {
    background-color: #eee;
  }
  section.eight .container > div:last-child table tr:first-child td {
    text-align: left;
  }
  section.eight .container > div:last-child table tr:last-child th {
    padding: 0;
  }
  section.eight .container > div:last-child table tr:last-child td {
    background-color: transparent;
    color: #333;
    padding: 0;
  }
  section.nine .container a.starter-kit {
    aspect-ratio: 1/1;
    background-image: url(../images/lp2608/banner01-sp.jpg);
  }
  section.ten {
    padding: 60px 0 100px 0;
  }
  section.ten .container .upper {
    padding: 0 20px 20px 20px;
  }
  section.ten .container .upper h2 {
    padding-bottom: 140px;
    font-size: 6vw;
  }
  section.ten .container .upper p br {
    display: none;
  }
  section.ten .container .mid {
    display: block;
  }
  section.ten .container .mid > div:first-child {
    width: 100%;
    padding-right: 0;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-right: none;
    border-bottom: 2px solid white;
  }
  section.ten .container .mid > div:last-child {
    width: 100%;
  }
  section.ten .container .lower > div {
    display: block;
    margin: 0 auto;
  }
  section.ten .container .lower > div:nth-last-child(2) {
    width: 80%;
    padding-bottom: 40px;
  }
  section.ten .container .lower > div:nth-last-child(2) div {
    width: 100%;
  }
  section.ten .container .lower > div:nth-last-child(2) div:first-child {
    padding: 40px 0 0 0;
  }
  section.ten .container .lower > div:last-child {
    width: 80%;
  }
  section.ten .container .lower > div:last-child a {
    width: 100%;
  }
  section.ten .container .lower > div:last-child a:first-child {
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 600px) {
  section .container h2 {
    font-size: 9vw;
  }
  section .container h2.ttl {
    font-size: 8vw;
  }
  section.two .container .menu p.txt span {
    display: block;
  }
  section.four .container h2 {
    font-size: 9vw;
  }
  section.five .container h2 {
    font-size: 5.2vw;
  }
  section.six .container .row {
    display: block;
  }
  section.six .container .row p.box {
    width: 80%;
    margin: 20px auto 0 auto;
  }
  section.six .container .img {
    padding-top: 60px;
  }
  section.six .container .img::before {
    width: 1px;
    height: 60px;
  }
  section.seven .container h2 span:first-child {
    font-size: 5.2vw;
  }
  section.seven .container h2 span:last-child {
    font-size: 9vw;
  }
  section.seven .container .row {
    display: block;
    width: 96%;
    margin: 0 auto 30px auto;
  }
  section.seven .container .row > div {
    width: 100%;
  }
  section.eight .container h2 {
    font-size: 9vw;
  }
  section.eight .container > div:last-child {
    padding: 30px 0;
  }
  section.eight .container > div:last-child table tr {
    grid-template-columns: 8em auto;
  }
  section.eight .container > div:last-child table tr:last-child td:last-child {
    grid-column: 1/3;
    padding-right: 1em;
  }
  section.ten .container .upper {
    background-size: auto 90%;
  }
  section.ten .container .upper h2 {
    padding-bottom: 30vw;
  }
  section.ten .container .upper h3 {
    text-shadow: 2px 2px 2px #666;
    font-size: 4.6vw;
  }
  section.eleven .container h2 {
    font-size: 9vw;
  }
  section.eleven .container dl dt {
    padding: 40px 0 16px 12px;
  }
  section.eleven .container dl dt span:first-child {
    margin-right: 12px;
  }
  section.eleven .container dl dd {
    padding: 0 0 30px 12px;
  }
  section.eleven .container dl dd span:first-child {
    margin-right: 16px;
  }
}
@media screen and (max-width: 500px) {
  section.two .container .customer p.txt {
    font-size: 5.8vw;
  }
  section.two .container .menu p.txt {
    font-size: 5.8vw;
  }
  section.eight .container > div:last-child table tr td:last-child {
    font-size: 4vw;
  }
  section.eight .container > div:last-child table tr:first-child td:last-child {
    font-size: 4.6vw;
  }
  section.eight .container > div:last-child table tr:last-child td:last-child {
    grid-column: 1/3;
    padding-right: 1em;
    font-size: 75%;
  }
  section.ten .container .lower > div:first-child {
    width: 90%;
  }
  section.ten .container .lower > div:last-child {
    width: 90%;
  }
  section.ten .container .lower > div:last-child a {
    font-size: 5vw;
  }
}
footer {
  background-color: #022456;
}
footer .container {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  padding: 100px 0 60px 0;
}
footer .container .wrap-scroll-top {
  width: 100vw;
  height: 0;
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 9980;
}
footer .container .wrap-scroll-top a#scroll-top {
  display: block;
  width: 50px;
  position: absolute;
  right: 10%;
  bottom: 16vh;
  cursor: pointer;
  border-radius: 50%;
  background-color: #3f84da;
  transition: background-color 300ms ease;
}
footer .container .wrap-scroll-top a#scroll-top img {
  width: 100%;
  height: auto;
}
footer .container .wrap-scroll-top a#scroll-top:hover {
  background-color: #85CEED;
  transition: background-color 300ms ease;
}
footer .container .l {
  width: 160px;
}
footer .container .l > div {
  display: flex;
  gap: 20px;
  justify-content: center;
  align-items: center;
  padding-top: 60px;
}
footer .container .l > div a {
  display: block;
  border: 1px solid white;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  background: url(../images/lp2608/icon16.png) no-repeat center center transparent;
  background-size: 60% auto;
  text-indent: -9999px;
  transition: background-color 300ms ease;
}
footer .container .l > div a.ln {
  background-image: url(../images/lp2608/icon17.png);
}
footer .container .l > div a:hover {
  background-color: rgba(0, 102, 255, 0.3);
  transition: background-color 300ms ease;
}
footer .container .r {
  color: white;
  width: 600px;
}
footer .container .r > p {
  padding-bottom: 20px;
}
footer .container .r > p span {
  display: block;
}
footer .container .r > p span:first-child {
  font-size: 115%;
}
footer .container .r > p span:last-child {
  font-weight: 700;
  font-size: 150%;
}
footer .container .r dl {
  margin-bottom: 20px;
  display: flex;
  justify-content: left;
  align-items: flex-start;
  flex-wrap: wrap;
}
footer .container .r dl dt {
  width: 6em;
}
footer .container .r dl dd {
  width: calc(100% - 7em);
}
footer .container .r > a {
  font-size: 150%;
  font-weight: 700;
  color: white;
  pointer-events: none;
  cursor: default;
}
footer .copy {
  color: white;
  text-align: center;
  padding: 2em 6em;
  border-top: 1px solid #858b94;
}

@media screen and (max-width: 1000px) {
  footer .container .l {
    margin-left: 20px;
  }
}
@media screen and (max-width: 900px) {
  footer .container {
    gap: 40px;
  }
  footer .container .r {
    width: calc(100% - 220px);
  }
}
@media screen and (max-width: 768px) {
  footer .container {
    display: block;
  }
  footer .container .l {
    margin: 0 auto 40px auto;
  }
  footer .container .r {
    width: 92%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  footer .container .r > a {
    pointer-events: auto;
    cursor: pointer;
  }
}