@charset "UTF-8";

@media screen and (min-width:959px){
  .pc_none {
    display: none;
  }
}
@media screen and (max-width:958px){
  .sp_none {
    display: none;
  }
}
@media screen and (max-width:320px) {
	html {
		font-size: 16px;
	}
}

/* --- LP 202511 --- */
#lp202511 {
  overflow: hidden;
}
#lp202511 * {
  font-family: メイリオ, Meiryo, ヒラギノ角ゴシック, "Hiragino Sans", YuGothic, "Yu Gothic", sans-serif;
  box-sizing: border-box;
  font-size: 18px;
  letter-spacing: 0.05em;
  line-height: 1.8;
  padding: 0;
  margin: 0;
}
#lp202511 .w1200 {
  width: calc(100% - 40px);
  max-width: 1200px;
  margin: 0 auto;
}
#lp202511 img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
}
#lp202511 ul {
  list-style: none;
}
#lp202511 .mv .mv_img_area {
  background: #083069;
  background: linear-gradient(287deg,rgba(8, 48, 105, 1) 30%, rgba(42, 83, 181, 1) 100%);
}
#lp202511 .mv .mv_img_area .inner {
  position: relative;
  width: 100%;
  padding: 0;
  display: grid; 
  grid-template-columns: 1fr 40vw; 
  align-items: center;
  gap: 0px 0px; 
}
#lp202511 .mv .mv_img_area .inner h2 {
  position: relative;
  z-index: 0;
  font-size: min(4vw, 50px);
  line-height: 1.2;
  color: #03112e;
  text-shadow: 0px 0px 15px rgba(255,255,255,1);
  padding: 0.2em 0 0.2em 5vw;
}
#lp202511 .mv .mv_img_area .inner h2::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: #FFFFFF;
background: linear-gradient(90deg,rgba(180, 205, 240, 1) 50%, rgba(212, 228, 250, 0.2) 100%);
box-shadow: 0px 0px 5px 0px rgba(255,255,255,0.1);
}
#lp202511 .mv .mv_img_area .inner .img {
  position: relative;
  z-index: 1;
}
#lp202511 .mv h3 {
  position: relative;
  z-index: 0;
  text-align: center;
  background: #fff;
  color: #333;
  font-size: 20px;
  letter-spacing: 0.1em;
  line-height: 2;
  padding: 30px 0;
}
#lp202511 .mv h3::after{
  content: "";
  position: absolute;
  z-index: 1;
  bottom: -38px;
  left: 50%;
  transform: translateX(-50%);
  width: 400px;
  height: 40px;
  clip-path: polygon(48% 100%, 0 0, 100% 0);
  background: #fff;
}
#lp202511 .innertitle1 {
  position: relative;
  font-size: min(4vw, 45px);
  line-height: 1.2;
  text-align: center;
  padding-bottom: 20px;
  margin-bottom: 45px;
}
#lp202511 .innertitle1::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 150px;
  height: 6px;
  background: #2D53A3;
background: linear-gradient(140deg,rgba(45, 83, 163, 1) 45%, rgba(221, 48, 45, 1) 100%);
}
#lp202511 .innertitle1 span {
  display: inline-block;
  font-size: min(2.5vw, 32px);
  line-height: 1;
}
#lp202511 .worries {
  padding-top: 120px;
  padding-bottom: 80px;
  background: #ebeef2;
  background: linear-gradient(140deg,rgba(235, 238, 242, 1) 45%, rgba(207, 213, 227, 1) 100%);
}
#lp202511 .worries p,
#lp202511 .how1 p,
#lp202511 .how2 p {
  text-align: center;
}
#lp202511 .worries .list_worries {
  width: -moz-fit-content;
  width: fit-content;
  margin: 40px auto 60px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
#lp202511 .worries .list_worries li {
  position: relative;
  padding: 0.4em 1.5em 0.4em 55px;
  background: #fff;
  box-shadow: 0px 0px 5px 0px rgba(109, 109, 109, 0.2);
  font-weight: 700;
}
#lp202511 .worries .list_worries li::before {
  content: "";
  position: absolute;
  top: 0.6em;
  left: 20px;
  width: 24px;
  height: 24px;
  background: url(../images/check-circle.svg) no-repeat center center;
  background-size: cover;
}
#lp202511 .worries .list_worries li .highlight {
  text-decoration: underline;
  text-underline-offset: -0.2em;
  text-decoration-thickness: 0.5em;
  text-decoration-color: rgba(255, 230, 0, 0.4);
  text-decoration-skip-ink: none;
}
#lp202511 .worries .closing {
  font-size: 20px;
}
#lp202511 .worries .closing strong {
  font-size: 1.3em;
}
#lp202511 .how1 {
  padding-top: 100px;
}
#lp202511 .how1 .box_model {
  margin-top: 40px;
  margin-bottom: 40px;
  box-shadow: 0px 0px 3px 0px rgba(45, 83, 163, 0.7);
  padding: 20px 10px;
}
#lp202511 .how1 .box_model .exp {
  width: 90%;
  margin: 0 auto;
  text-align: left;
  font-size: 16px;
}
#lp202511 .how1 .list_step {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  counter-reset:number;
  list-style-type: none!important;
  margin-bottom: 15px;
}
#lp202511 .how1 .list_step div {
  position: relative;
  padding: 15px 20px 15px 35px;
}
#lp202511 .how1 .list_step div:not(:last-of-type):after {
  content: "";
  position: absolute;
  top: 0;
  right: -14.5px;
  width: 15px;
  height: 100%;
  clip-path: polygon(100% 50%, 0 0, 0 100%);
  z-index: 10;
}
#lp202511 .how1 .list_step div.step1,
#lp202511 .how1 .list_step div.step1::after{
  background: #d8deec;
}
#lp202511 .how1 .list_step div.step2,
#lp202511 .how1 .list_step div.step2::after{
  background: #c2cce4;
}
#lp202511 .how1 .list_step div.step3,
#lp202511 .how1 .list_step div.step3::after{
  background: #a5b5da;
}
#lp202511 .how1 .list_step div.step4,
#lp202511 .how1 .list_step div.step4::after{
  background: #90a5d6;
}
#lp202511 .how1 .list_step dt {
  color: #142B5A;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  line-height: 1.4;
  margin-bottom: 5px;
}
#lp202511 .how1 .list_step div dt::before {
  counter-increment: number;
  content: "STEP " counter(number);
  display: block;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  color: #142B5A;
  border-bottom: 1px solid #142B5A;
  margin-bottom: 5px;
}
#lp202511 .how1 .list_step dd {
  font-size: 14px;
}
#lp202511 .how1 .list_step dd.tit {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  margin-bottom: 5px;
}
#lp202511 .how1 .closing {
  font-size: 18px;
}
#lp202511 .how1 .closing strong {
  font-size: 1.2em;
  text-decoration: underline;
  text-underline-offset: -0.2em;
  text-decoration-thickness: 0.5em;
  text-decoration-color: rgba(255, 230, 0, 0.6);
  text-decoration-skip-ink: none;
}
#lp202511 .how2 {
  padding-top: 120px;
  counter-reset:number;
  list-style-type: none!important;
}
#lp202511 .how2 .box_how2 {
  padding-top: 40px;
  padding-bottom: 20px;
}
#lp202511 .how2 .box_how2 .inner {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 50px;
  align-items: center;
}
#lp202511 .how2 .box_how2 .inner .text h3 {
  position: relative;
  font-size: min(3vw, 35px);
  line-height: 1.2;
  color: #03112e;
  padding-left: 1.8em;
  margin-bottom: 30px;
}
#lp202511 .how2 .box_how2 .inner .text h3 span {
  display: inline-block;
  font-size: 0.7em;
  line-height: 1.1;
}
#lp202511 .how2 .box_how2 .inner .text h3::before {
  counter-increment: number;
  content: counter(number);
  position: absolute;
  top: -0.3em;
  left: 0;
  color: #eb8b89;
  font-size: 2.0em;
  font-weight: 900;
  line-height: 1;
  font-style: italic;
}
#lp202511 .how2 .box_how2 .inner .text ul li {
  position: relative;
  padding-left: 30px;
  margin-left: 20px;
  margin-bottom: 10px;
}
#lp202511 .how2 .box_how2 .inner .text ul li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 28px;
  height: 28px;
  background: url(../images/chevron-right.svg) no-repeat center center;
  background-size: cover;
}
#lp202511 .how2 .box_how2 .inner .image img {
  box-shadow: 5px 5px 15px 0px rgba(45, 83, 163, 0.2);
}
#lp202511 .how2 .closing {
  width: -moz-fit-content;
  width: fit-content;
  margin: 40px auto 0;
  padding: 40px;
  font-size: 20px;
  box-shadow: 0px 0px 15px 0px rgba(45, 83, 163, 0.3);
}
#lp202511 .reasons {
  margin-top: 120px;
  padding-top: 80px;
  padding-bottom: 80px;
  background: #ebeef2;
  background: linear-gradient(140deg,rgba(235, 238, 242, 1) 45%, rgba(207, 213, 227, 1) 100%);
  counter-reset:number;
  list-style-type: none!important;
}
#lp202511 .reasons .box_reasons {
  position: relative;
  padding: 40px;
  background: #fff;
  box-shadow: 0px 0px 15px 0px rgba(45, 83, 163, 0.1);
  margin-bottom: 40px;
}
#lp202511 .reasons .box_reasons::before {
  counter-increment: number;
  content: counter(number);
  position: absolute;
  top: -0.4em;
  left: 40px;
  color: #eb8b89;
  font-size: 60px;
  font-weight: 900;
  line-height: 1;
  font-style: italic;
}
#lp202511 .reasons .box_reasons h3 {
  font-size: 35px;
  line-height: 1.2;
  color: #03112e;
}
#lp202511 .reasons .box_reasons h4 {
  position: relative;
  color: #03112e;
  font-size: 20px;
  margin-bottom: 15px;
}
#lp202511 .reasons .closing {
  text-align: center;
}
#lp202511 .voices {
  margin-top: 120px;
}
#lp202511 .voices .list_voices {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px;
}
#lp202511 .voices .list_voices li h2 {
  font-size: 22px;
  color: #03112e;
  padding: 10px 15px 0 15px;
}
#lp202511 .voices .list_voices li h3 {
  padding: 0 15px;
  color: #333;
}
#lp202511 .voices .list_voices li img {
  transition: transform 0.3s ease-in-out;
}
#lp202511 .voices .list_voices li:hover img {
  transform: scale(1.03);
}
#lp202511 .contact {
  position: relative;
  z-index: 0;
  margin-top: 200px;
  padding-top: 120px;
  padding-bottom: 120px;
  color: #fff;
}
#lp202511 .contact::before,
#lp202511 .contact::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#lp202511 .contact::before {
  background: url(../images/bg_lp202511_contact01.jpeg) no-repeat center center;
  background-size: cover;
  opacity: 0.5;

}
#lp202511 .contact::after {
  background: rgba(20,43,90,0.8);
  backdrop-filter: blur(2px);
}
#lp202511 .contact p {
  text-align: center;
  font-size: 22px;
}
#lp202511 .contact .link_cta {
  position: relative;
  z-index: 0;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 40px auto 0;
  background: #fff;
  color: #03112e;
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 0.8em 2.5em 0.8em 1.3em;
}
#lp202511 .contact .link_cta::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -50px;
  width: 100px;
  height: 2px;
  background: rgba(221, 48, 45, 1);
}
#lp202511 .contact .link_cta:hover {
  background: rgba(221, 48, 45, 1);
  color: #fff;
}
#lp202511 .contact .link_cta:hover::after {
  background: #fff;
}

@media screen and (max-width:958px){
  #lp202511 * {
    font-size: calc(100vw / 26);
  }
  #lp202511 .w1200 {
    width: calc(100% - calc(30 / 400 * 100vw));
    max-width: 1200px;
    margin: 0 auto;
  }
  #lp202511 .mv .mv_img_area .inner {
    display: flex;
    position: relative;
    height: calc(174 / 400 * 100vw);
    overflow: hidden;
  }
  #lp202511 .mv .mv_img_area .inner .img {
    position: absolute;
    top: 0;
    right: calc(-25 / 400 * 100vw);
    width: calc(250 / 400 * 100vw);
  }
  #lp202511 .mv .mv_img_area .inner h2 {
    font-size: calc(23em / 16);
    line-height: 1.4;
    padding: 0.3em 0 0.3em calc(15 / 400 * 100vw);
  }
  #lp202511 .mv h3 {
    font-size: calc(18em / 16);
    line-height: 1.8;
    padding: calc(30 / 400 * 100vw) calc(15 / 400 * 100vw) calc(20 / 400 * 100vw) calc(15 / 400 * 100vw);
  }
  #lp202511 .mv h3::after{
    bottom: calc(-29 / 400 * 100vw);
    width: calc(200 / 400 * 100vw);
    height: calc(30 / 400 * 100vw);
  }
  #lp202511 .innertitle1 {
    font-size: calc(24em / 16);
    padding-bottom: calc(20 / 400 * 100vw);
    margin-bottom: calc(40 / 400 * 100vw);
  }
  #lp202511 .innertitle1::after {
    width: calc(100 / 400 * 100vw);
    height: calc(4 / 400 * 100vw);
  }
  #lp202511 .innertitle1 span {
    font-size: calc(18em / 24);
  }
  #lp202511 .worries {
    padding-top: calc(100 / 400 * 100vw);
    padding-bottom: calc(60 / 400 * 100vw);
  }
  #lp202511 .worries p,
  #lp202511 .how1 p,
  #lp202511 .how2 p {
    text-align: left;
  }
  #lp202511 .worries .list_worries {
    margin: calc(20 / 400 * 100vw) auto calc(30 / 400 * 100vw);
    gap: calc(10 / 400 * 100vw);
  }
  #lp202511 .worries .list_worries li {
    padding: 0.5em 1.0em 0.5em calc(40 / 400 * 100vw);
    line-height: 1.4;
  }
  #lp202511 .worries .list_worries li span {
    line-height: 1.4;
  }
  #lp202511 .worries .list_worries li::before {
    top: 0.6em;
    left: calc(10 / 400 * 100vw);
    width: calc(20 / 400 * 100vw);
    height: calc(20 / 400 * 100vw);
  }
  #lp202511 .worries .closing {
    font-size: calc(18em / 16);
  }
  #lp202511 .worries .closing strong {
    font-size: 1.2em;
  }
  #lp202511 .how1 {
    padding-top: calc(60 / 400 * 100vw);
  }
  #lp202511 .how1 .box_model {
    margin-top: calc(20 / 400 * 100vw);
    margin-bottom: calc(30 / 400 * 100vw);
    padding: calc(20 / 400 * 100vw) calc(10 / 400 * 100vw);
  }
  #lp202511 .how1 .box_model .exp {
    width: 95%;
    font-size: calc(16em / 16);
  }
  #lp202511 .how1 .list_step {
    grid-template-columns: 1fr;
  }
  #lp202511 .how1 .list_step div {
    padding: calc(30 / 400 * 100vw) calc(10 / 400 * 100vw) calc(10 / 400 * 100vw) calc(10 / 400 * 100vw);
  }
  #lp202511 .how1 .list_step div:not(:last-of-type):after {
    top: inherit;
    right: 0;
    bottom: calc(-19 / 400 * 100vw);
    width: 100%;
    height: calc(20 / 400 * 100vw);
    clip-path: polygon(50% 100%, 0 0, 100% 0);
  }
  #lp202511 .how1 .list_step dt {
    font-size: calc(20em / 16);
    margin-bottom: calc(5 / 400 * 100vw);
  }
  #lp202511 .how1 .list_step div dt::before {
    font-size: calc(15em / 16);
    margin-bottom: calc(5 / 400 * 100vw);
  }
  #lp202511 .how1 .list_step dd {
    font-size: calc(14em / 16);
  }
  #lp202511 .how1 .list_step dd.tit {
    font-size: calc(17em / 16);
    margin-bottom: calc(10 / 400 * 100vw);
  }
  #lp202511 .how1 .closing {
    font-size: calc(16em / 16);
  }
  #lp202511 .how2 {
    padding-top: calc(100 / 400 * 100vw);
  }
  #lp202511 .how2 .box_how2 {
    padding-top: calc(40 / 400 * 100vw);
    padding-bottom: calc(10 / 400 * 100vw);
  }
  #lp202511 .how2 .box_how2 .inner {
    grid-template-columns: 1fr;
    gap: calc(10 / 400 * 100vw);
  }
  #lp202511 .how2 .box_how2.reverse .inner .image {
    order: 2;
  }
  #lp202511 .how2 .box_how2.reverse .inner .text {
    order: 1;
  }
  #lp202511 .how2 .box_how2 .inner .text h3 {
    font-size: calc(22em / 16);
    padding-left: 1.8em;
    margin-bottom: calc(10 / 400 * 100vw);
  }
  #lp202511 .how2 .box_how2 .inner .text h3 span {
    font-size: 0.8em;
  }
  #lp202511 .how2 .box_how2 .inner .text ul li {
    padding-left: calc(25 / 400 * 100vw);
    margin-left: 0;
    margin-bottom: calc(2 / 400 * 100vw);
  }
  #lp202511 .how2 .box_how2 .inner .text ul li::before {
    width: calc(22 / 400 * 100vw);
    height: calc(22 / 400 * 100vw);
  }
  #lp202511 .how2 .closing {
    margin: calc(40 / 400 * 100vw) auto 0;
    padding: calc(15 / 400 * 100vw);
    font-size: calc(18em / 16);
  }
  #lp202511 .reasons {
    margin-top: calc(60 / 400 * 100vw);
    padding-top: calc(60 / 400 * 100vw);
    padding-bottom: calc(60 / 400 * 100vw);
  }
  #lp202511 .reasons .box_reasons {
    padding: calc(30 / 400 * 100vw) calc(15 / 400 * 100vw) calc(15 / 400 * 100vw) calc(15 / 400 * 100vw);
    margin-bottom: calc(35 / 400 * 100vw);
  }
  #lp202511 .reasons .box_reasons::before {
    left: calc(15 / 400 * 100vw);
    font-size: calc(38em / 16);
  }
  #lp202511 .reasons .box_reasons h3 {
    font-size: calc(22em / 16);
    margin-bottom: calc(5 / 400 * 100vw);
  }
  #lp202511 .reasons .box_reasons h4 {
    font-size: calc(16em / 16);
    line-height: 1.3;
    margin-bottom: calc(10 / 400 * 100vw);
  }
  #lp202511 .reasons .closing {
    text-align: left;
  }
  #lp202511 .voices {
    margin-top: calc(80 / 400 * 100vw);
  }
  #lp202511 .voices .list_voices {
    grid-template-columns: repeat(2, 1fr);
    gap: calc(20 / 400 * 100vw);
  }
  #lp202511 .voices .list_voices li h2 {
    font-size: calc(18em / 16);
    padding: calc(5 / 400 * 100vw) calc(5 / 400 * 100vw) 0 calc(5 / 400 * 100vw);
  }
  #lp202511 .voices .list_voices li h3 {
    padding: 0 calc(5 / 400 * 100vw);
    font-size: calc(14em / 16);
  }
  #lp202511 .contact {
    margin-top: calc(100 / 400 * 100vw);
    padding: calc(30 / 400 * 100vw) calc(20 / 400 * 100vw) calc(30 / 400 * 100vw) calc(20 / 400 * 100vw);
  }
  #lp202511 .contact p {
    text-align: left;
    font-size: calc(16em / 16);
  }
  #lp202511 .contact .link_cta {
    margin: calc(30 / 400 * 100vw) auto 0;
    font-size: calc(20em / 16);
    padding: 0.6em 2.0em 0.6em 1.0em;
  }
  #lp202511 .contact .link_cta::after {
    right: calc(-30 / 400 * 100vw);
    width: calc(60 / 400 * 100vw);
    height: 1px;
  }









}