@charset "UTF-8";
/*---------------------------------------------

	初期設定用

---------------------------------------------*/

:root{
  /* font-family */
  --font-base: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;

  /* font-weight */
  --fw-regular: 400;
  --fw-bold: 700;

  /* font-size*/
  --fs-heading-lg: 42px; /* 大見出し */
  --fs-heading-md: 36px; /* 中見出し */
  --fs-heading-sm: 28px; /* 小見出し・FAQ */
  --fs-body: 16px;       /* 本文 */

  /* color */
  --black: #000;
  --orange: #e26900;
  --blue: #07b8ed;
  --yellow: #f9df5e;
  --right-yellow: #fffad9;
  --gray: #eaeaea;
  --right-blue: #e5f4fd;

  /* width */
  --main-width: 1200px;

  /* line-height */
  --lh-base:2;
}




html,body{
	margin:0px;
	padding:0px;
  scroll-behavior: smooth;
}


body{
  font-family: var(--font-base);
  font-size: var(--fs-body);
  line-height:var(--lh-base);
}

img{
  max-width:100%;
  height:auto;
}


/*---------------------------------------------
	a
---------------------------------------------*/
a{
	color: var(--black);
	text-decoration: none;
}
a:link {
}
a:visited{
}
a:hover{
	color: var(--black);
	text-decoration: none;
}
a:active{
}
a.on{
	color: var(--black);
	text-decoration: none;
}

li{
	list-style: none;
}

.flex{
  display:flex;
}


/*---------------------------------------------
	追加部分
---------------------------------------------*/
section,footer{
  width:100%;
  margin:0 auto 50px;
}

.cta-box,.needs,.support,.flow,.futures,.faq,.contact{
  max-width:var(--main-width);
  margin:0 auto 50px;
}

.main-width{
  max-width:var(--main-width);
  margin:0 auto;
}

h2,.reasons-item-title,.point-title,.support-title{
  font-size:var(--fs-heading-md);
  font-weight:var(--fw-bold);
}

.title-band{
  font-size:var(--fs-heading-lg);
  font-weight:var(--fw-bold);
}

.flow h3,.faq dt,.privacy-policy-title{
  font-size:var(--fs-heading-sm);
  font-weight:var(--fw-bold);
}




.title-box{
  text-align: center;
  margin-bottom:30px;
}

.title-box .title-small-text{
  margin: 0 0 12px;
  font-weight: var(--fw-bold);
}

.title-box h2{
  margin: 0 0 12px;
  font-size: var(--fs-heading-md);
  text-align:center;
}
.title-box .title-line{
  display: block;
  width: 100%;
  height: 2px;
  margin: 0 auto 12px;
  background: var(--yellow);
}
.title-box>div{
  margin: 0;
  letter-spacing: 0.12em;
  color: var(--yellow);
  font-size:var(--fs-heading-sm);
  font-weight: var(--fw-bold);
}






header{
  width:100%;
  position:fixed;
  background-color:#fff;
  display:flex;
  height:80px;
  align-items: center;
  justify-content: space-between;
  padding:0 10px;
  box-sizing: border-box;
  gap: clamp(
    10px,
    calc(-31.7px + 4.33vw),
    50px
  );
  top:0;
  z-index:9999;
}
header button{
  display:none;
}
header .header-nav{
  display:none;
}
header h1{
  flex-shrink:0;
}
header h1 img {
  width: clamp(200px, 20vw, 500px);
  height: auto;
}
header nav {
  box-sizing: border-box;
}
header nav ul {
  display: flex;
  gap: clamp(
    10px,
    calc(-10.8px + 2.12vw),
    30px
  );
  box-sizing: border-box;
}
header nav ul li{
  font-weight:var(--fw-bold);
}
header nav.menu{
  margin-left:auto;
}
header nav.cta ul li a{
  padding: 10px clamp(
    10px,
    calc(-10.8px + 2.12vw),
    30px
  );
    color:#fff;
}
header nav.cta ul li:first-child a{
  background-color:var(--orange);
  box-shadow: 0px 4px 0px 0px #8f570d;
}
header nav.cta ul li:last-child a{
  background-color:var(--blue);
  box-shadow: 0px 4px 0px 0px #045b75;
}
header nav.cta ul li a span {
  font-size: clamp(
    12.8px,
    calc(1.306px + 1.176vw),
    16px
  );
  margin-left:5px;
}

.fv{
  margin-top:80px;
}

.course{
  padding:50px 0;
  background-color:var(--right-blue);
}
.course ul{
  display:flex;
  justify-content: center;
  gap:20px;
  padding:0 20px;
}
.course ul li{
  flex:1;
}
.course ul li br{
  display:none;
}
.course ul li:first-child{
  background-color:#f49314;
  box-shadow: 0px 4px 0px 0px #8f570d;
}
.course ul li:nth-child(2){
  background-color:#6bc636;
  box-shadow: 0px 4px 0px 0px #38661d;
}
.course ul li:last-child{
  background-color:#6886dd;
  box-shadow: 0px 4px 0px 0px #384978;
}
.course ul li a{
  position:relative;
  display:block;
  font-weight:var(--fw-bold);
  color:#fff;
  font-size:var(--fs-heading-sm);
  padding:15px;
  text-align:center;
}
.course ul li a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 11px;
  height: 11px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  transform: translateY(-50%) rotate(45deg);
}





.cta-box{
  margin:50px auto;
  padding:50px 100px;
  background-color:var(--right-yellow);
}
.cta-box h2{
  text-align:center;
  margin-bottom:40px;
}
.cta-box .cta-inner{
  display:flex;
  gap:20px;
  justify-content: center;
}
.cta-box .cta-inner .cta-btn{
  flex:1;
}
.cta-box .cta-inner .cta-btn a{
  display:block;
  padding:10px 10px 20px;
  font-weight:var(--fw-bold);
  text-align:center;
}
.cta-inner .cta-btn div:nth-child(1){
  position:relative;
  margin-top:-25px;
}
.cta-inner .cta-btn div:nth-child(1) span{
  font-weight:var(--fw-bold);
  text-align:center;
  background-color:#fff;
  margin:0 auto;
  display:block;
  width:80%;
  padding:5px 0;
  max-width:300px;
  border-radius:20px;
}

.cta-inner .cta-btn div:nth-child(2) i{
  padding-right:10px;
}

.cta-inner .cta-btn div:nth-child(2) i,
.cta-inner .cta-btn div:nth-child(2) span{
  color:#fff;
}

.cta-inner .cta-btn:nth-child(1)  {
  background-color: var(--orange);
  box-shadow: 0px 4px 0px 0px #8f570d;
}
.cta-inner .cta-btn:nth-child(1) div:nth-child(1) span{
  border:3px solid var(--orange);
}
.cta-inner .cta-btn:nth-child(2)  {
  background-color: var(--blue);
  box-shadow: 0px 4px 0px 0px #045b75;
}
.cta-inner .cta-btn:nth-child(2) div:nth-child(1) span{
  border:3px solid var(--blue);
}


.needs .needs-list ul{
  display:flex;
  flex-direction: column;
  flex:1;
  width:90%;
  max-width:960px;
  margin:0 auto;
  padding-bottom:80px;
}
.needs .needs-list ul li{
  padding:20px;
  margin-bottom:20px;
  background-color:var(--gray);
  text-align:center;
  font-size:var(--fs-heading-sm);
  border-radius:30px;
  color:var(--orange);
  font-weight:var(--fw-bold);
}
.needs .needs-list ul li span{
  color:var(--black);
  margin-left:20px;
}

.reasons{
  position:relative;
  padding:130px 0 50px;
  background-color:var(--right-yellow);
}
.triangle{
  position:absolute;
  top:-80px;
  left: 50%;
  transform: translateX(-50%);
  width:60%;
  max-width:900px;
}
.reasons-box{
  padding-bottom:50px;
}
.reasons-item{
  display:flex;
  gap:30px;
  justify-content: space-between;
  padding:60px;
  margin-bottom:40px;
  background-color:#fcfbf5;
  align-items:stretch;
}
.reasons-box div.reasons-item{
  background-repeat:no-repeat;
  background-size:150px;
  background-position:98% 105%;
}
.reasons-item > div:first-child{
  flex:2 1 0;
}
.reasons-item > div:last-child{
  flex:3 1 0;
}
.reasons-box div.reasons-item div:first-child img{
  width:100%;
}

.reasons-box div.reasons-item:first-child{
  background-image:url(../img/reasons-03.webp);
}
.reasons-box div.reasons-item:nth-child(2){
  background-image:url(../img/reasons-05.webp);
  flex-direction:row-reverse;
  background-position:2% 105%;  
}
.reasons-box div.reasons-item:nth-child(3){
  background-image:url(../img/reasons-07.webp);
}
.reasons-box div.reasons-item:last-child{
  background-image:url(../img/reasons-11.webp);
  flex-direction:row-reverse;
  background-position:2% 105%;  
}
.reasons-item .reasons-item-title{
  margin-bottom:10px;
  font-size:var(--fs-heading-sm);
}






.title-band{
  display: flex;
  gap: 50px;
  align-items: end;
  margin-bottom:30px;
  justify-content:center;
}
.title-band-deco{
  width:64px;
  object-fit:contain;
}

.title-band-title{
  margin: 0;
  text-align: center;
  font-size:var(--fs-heading-lg);
  display: flex;
}




.image-text-box{
  display:flex;
  gap:20px;
}
.image-text-box > div{
  min-width:0;
}
.image-text-box > div:first-child{
  flex:2 1 0;
}
.image-text-box > div:last-child{
  flex:3 1 0;
}

.image-text-box > div:first-child{
  aspect-ratio:4/3;
  overflow:hidden;
}

.image-text-box > div:first-child img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.point-text-heading{
  color:var(--orange);
  font-weight:var(--fw-bold);
  margin-top:10px;
}



.support-box{
  display:flex;
  gap:30px;
  justify-content: space-around;
  margin-bottom:30px;
}
.support-box-item{
  border:2px solid var(--gray);
  padding:40px;
  border-radius: 20px;
  flex:1;
}
.support-image{
  width:130px;
  margin:0 auto 20px;
}
.support-title{
  margin-bottom:10px;
  color:var(--orange);
  text-align:center;
  font-size:var(--fs-heading-sm);
}

.flow-item{
  margin-bottom:15px;
}
.flow-item h3{
  background-color:var(--right-blue);
  padding:15px;
  padding-left:50px;
  background-image:url(../img/parts-03.webp);
  background-repeat:no-repeat;
  background-position:15px 50%;
  background-size:15px;
  margin-bottom:12px;
}
.flow-item h3 br{
  display:none;
}

.futures .image-text-box > div:first-child{
  aspect-ratio:auto!important;
}



.faq dt{
  background-color:var(--gray);
  padding:15px;
  padding-left:55px;
  background-image:url(../img/faq-02.webp);
  background-repeat:no-repeat;
  background-position:15px 50%;
  background-size:30px;
  margin-bottom:20px;
}
.faq dd{
  margin-bottom:30px;
}

.privacy-policy{
 padding:50px 0; 
}
.privacy-policy .privacy-policy-title{
  background-color:var(--right-blue);
  padding:15px;
  padding-left:50px;
  background-image:url(../img/parts-03.webp);
  background-repeat:no-repeat;
  background-position:15px 50%;
  background-size:15px;
  margin-bottom:12px;  
}
.privacy-policy li{
  padding-bottom:5px;
}


footer{
  background-color:var(--right-yellow);
  text-align:center;
  padding:50px 0 100px;
  margin-bottom:0;
}
footer .footer-inner div{
  margin-bottom:20px;
}
footer .footer-inner .logo img{
  width:500px;
}
footer .footer-inner .footer-nav{
  display:flex;
  gap:20px;
  justify-content: center;
  font-weight:var(--fw-bold);
}
.fixed-buttons{
  display:none;
}