body{
font-family: 'Noto Sans JP', sans-serif;
font-size:16px;
color:#747271;
}

html, body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

.obi {
  background-image: url('images/背景.png');
  background-repeat: no-repeat;
  background-size: cover center;   /* ←coverに変更 */
  background-position: center;

  width: 100%;       /* 親幅いっぱい */
  height: 100%;      /* 親要素の高さに合わせる */

  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.FV-inner {
  position: relative;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;      /* 中央寄せ */
  padding: 0 80px;     /* 左右の余白を確保 */
  z-index: 3;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}



.FV {
  position: relative;
  width: 100%;
  overflow: hidden;  /* 背景や帯がはみ出しても横スクロールしない */
  min-height: 90vh;
}

/* 背景画像 */
.background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 100%;
  background-image: url('images/起業1.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  z-index: 1;
  
}

/* 帯 */
.obi {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 100%;
  background-image: url('images/背景.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  z-index: 2;
}

/* コンテンツ幅制限 */
.FV-inner {
  position: relative;  /* 中身をabsolute要素の基準に */
  max-width: 1200px;   /* コンテンツ最大幅 */
  margin: 0 auto;      /* 中央寄せ */
  z-index: 3;           /* 背景や帯より上に表示 */
  flex-direction: column; 
  width: 100%;
}

/* 男性画像 */
.Man {
  width: 488px;
  height: 725px;
  background-image: url('images/起業3.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  
   position: absolute;  /* 下揃えにする */
  bottom: -50px;           /* 親要素の下にぴったり */
  right: 0;            /* 右側に寄せる */
}

.man-name {
  font-size: 24px;
  color: white;
  position: absolute;
  right: 0;         /* 親の右端に固定 */
  bottom: 80px;
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6); /* ←ここ追加！ */
}

.name {
  font-size: 36px;
  color: white;
  position: absolute;
  right: 0;         /* 同じく親の右端に固定 */
  bottom: 30px;
  text-shadow: 3px 3px 8px rgba(0, 0, 0, 0.7); /* ←ここ追加！ */
}

.kigyou {
  position: absolute;
  top: 10px;        /* 男性画像の上に表示 */
  right: 0;         /* 右端に寄せる */
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
  z-index: 4;       /* 男性画像より上に表示する場合は調整 */
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6); 
}


.kigyou p{
    font-size:36px;
    color:white;
    font-weight: bold;
     white-space: nowrap;  
}

.square{
background-color: white;
width:619px;
height: 7px;
}

.square2{
background-color: white;
width:200px;
height: 7px;
}


.Tytle{
    display: flex;
    flex-direction: column;
    padding-top: 120px;
}

.first-step{
  color: #f16c10;
  font-size: 40px;
  font-weight: bold;
  background-color: white;
  width: 356px;
  height: 91px;
  text-align: center;
  padding: 10px;
  position: relative; /* ::after を基準にする */
  line-height: 91px;  /* 縦中央 */

   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.first-step::after{
  content: "";
  position: absolute;
  bottom: -20px;      /* 本体の下に出す */
  left: 50%;          /* 横中央 */
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 20px solid transparent;   /* 左右の空白 */
  border-right: 20px solid transparent;
  border-top: 20px solid white;          /* 三角形の色 */
}

.tytle{
font-size:72px;
font-weight:bold;
text-align: left;
color:white;
margin-top: 20px;
}

.chance{
   background-color:white;
   color:#dc5b31;
   width:727px;
   height:73px;
   padding:10px 5px;
   text-align: center;
   font-weight:bold;
   font-size:30px;
   line-height: 73px;
   margin: 20px 0px;
}

.futoji{
 font-size:40px;
 color:#bb3f45;
}

.maru3{
    display: flex;
    flex-direction: row;
    gap:20px;
    margin:20px 0px 80px;
    justify-content: flex-start;
    align-items: center;
}

.satisfaction-wrapper {
  width: 202px;       /* 画像の幅に合わせる */
  height: 188px;      /* 画像の高さに合わせる */
  display: flex;
  justify-content: center;
  align-items: center;
}

.satisfaction {
  width: 100%;        /* divいっぱいに画像を表示 */
  height: 100%;       /* 縦横比を維持 */
  display: block;
}

.free {
  width: 201px;       /* 縮小後の幅に合わせる */
  height: 188px;      /* 縮小後の高さに合わせる */
  font-size: 40px;    /* 丸のサイズに合わせて調整 */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  background-color: white;
  color: #da5933;
}


.ruikei {
  width: 201px;       /* 縮小後の幅に合わせる */
  height: 188px;      /* 縮小後の高さに合わせる */
  font-size: 30px;    /* 丸のサイズに合わせて調整 */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  background-color: white;
  color: #da5933;
}

.button{
    display: flex;
    text-align: center;
    flex-direction: column;
}

.imasugu{
font-size:48px;
color:#e86522;
font-weight: bold;
margin-top: 80px;
margin-bottom:30px;
}

.cta{
    text-decoration: none;
    background: linear-gradient(360deg, #316ea9, #2c8ec4, #4fbfc0); /* ←これ！ */
    color:white;
    font-size:48px;
    font-weight: bold;
    border: none;
    width: 549px;
    height: 91px;
    margin: 0px auto 80px;
    border-radius: 35px;
    cursor:pointer;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.mirai {
  position: relative;
  width: 100%;
  min-height: 100vh;  /* 高さ最低100vh */
  overflow: hidden;
  margin-top: 0;       /* marginはpaddingで調整 */
}


.jump-img {
  position: absolute;  /* 親に対して絶対配置 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;   /* 余白なくカバー */
  display: block;
  z-index: 1;
  filter: opacity(0.85);
}



.mirai-wrapper {
  position: relative;
  max-width: 1200px;     /* 最大幅 */
  width: 100%;           /* 100%まで伸びるが max-width で制限 */
  margin: 0 auto;        /* ← これで中央に固定 */
  padding: 140px 40px;   /* 上下140px / 左右余白は適宜 */
  display: flex;
  flex-direction: column;
  align-items: flex-start; 
  z-index: 2;
  box-sizing: border-box;
}



.success {
  color: #e86522;
  font-size: 48px;
  font-weight: bold;
  text-align: left;
  margin-bottom:80px;
}

.sentence{
  font-size:24px;
  font-weight: bold;
  text-align: left;
}


/* 背景色は画面幅いっぱい */
.Onayami {
  width: 100%;
  background-color: rgba(116, 114, 113, 0.33); /* 背景色33%透明 */
  display: flex;
  justify-content: center;  /* 内側コンテンツを中央寄せ */
  padding: 140px 0;          /* 上下余白 */
  box-sizing: border-box;
}

/* 中身を1200pxに制限 */
.Onayami-inner {
  max-width: 1200px;        /* コンテンツ最大幅 */
  width: 100%;
  display: flex;
  flex-direction: row;       /* 画像とテキスト横並び */
  gap: 40px;                 /* 画像とテキスト間隔 */
  align-items: flex-start;
  padding: 0 20px;           /* 横余白 */
  box-sizing: border-box;
}

/* 画像 */
.Onayami-inner img {
  width: 100%;               /* コンテンツ幅に収める */
  max-width: 488px;          /* 元画像サイズに合わせる */
  height: auto;
}

/* テキスト部分 */
.nayami {
  font-size: 40px;
  font-weight: bold;
  color: #e86522;
  margin-bottom: 30px;
  margin-top: 0;
}

.onayami-container {
  position: relative; 
  display: flex;
  flex-direction: column;
  align-items: flex-start;   /* ← 左揃えに変更 */
  justify-content: center;
  background-color: white;
  gap: 40px;
  text-align: left;
  padding: 80px;
  margin-bottom: 0;
}

.onayami-container::before {
  content: "";
  position: absolute;
  left: -20px;              /* コンテナの左外側に出す */
  top: 50%;                 /* 上下中央 */
  transform: translateY(-50%);  /* 中央揃え */
  width: 0;
  height: 0;
  border-top: 20px solid transparent;    /* 上下の三角形 */
  border-bottom: 20px solid transparent;
  border-right: 20px solid white;       /* 吹き出し色 */
}

.onayami-container p {
  font-size: 24px;
  color: #747271;
  font-weight: bold;
  margin: 0 0 12px 0;      /* 下マージンで行間確保 */
  padding-left: 40px;      /* 左にスペース確保 */
  position: relative;      /* ::before の基準 */
}

.onayami-container p::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background-image: url('images/チェックボックス.png');
  background-size: contain;
  background-repeat: no-repeat;
}

.Point{
  background: linear-gradient(225deg, #bb3f45, #e66326); /* ←これ！ */
  margin:0 auto;
  display: flex;
  flex-direction: column;
}

.Sankaku {
  width: 1000px;
  height: 400px;
  background-color: white;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  display: flex;
  justify-content: center;
  align-items: flex-start;       /* 上寄せに変更 */
  text-align: center;
  margin: 0 auto;
  padding: 40px 20px 20px 20px;  /* 上に余白を大きくとる */
  box-sizing: border-box;
}

.Sankaku p {
  font-size: 24px;
  font-weight: bold;
  margin: 0;
  padding:0;
  color:#d0513a;
}

.Sankaku .kaisyou {
  color: #d0513a;
  font-size:48px;
}

.seikou{
  font-size:48px;
  font-weight: bold;
  margin: 80px auto 30px;
  color:white;
  padding:0;
}
.erareru {
  display: flex;             /* 横並びにする */
  align-items: center;       /* 子要素の縦方向中央揃え */
  gap: 20px;                 /* 四角と文字の間隔 */
  margin:0 auto;
  font-weight: bold;
}

.before-box {
  font-size: 48px;
  color: white;
  line-height: 1;
}

.haikei {
  display: inline-flex;
  justify-content: center;
  align-items: center;       /* 四角内の文字を縦中央 */
  background-color: white;
  padding: 5px 20px;
  font-size: 48px;
  box-sizing: border-box;
  color:#d65636;
}

.san {
  font-size: 96px;
  color: #316ea9;
  font-family: "fot-udmincho-pr6n", sans-serif;
  font-weight: 300;
  line-height: 1;
}

/* 全体ラッパー（画面中央・最大幅1200px） */
.Box-innner {
  width: 1200px;
  display: flex;
  flex-direction: column;
  align-items: flex-start; /* ✅ ← これに変更！ */
  margin: 0 auto;
}


.Box1{
  background-color: white;
  width: 997px;       /* ボックス幅 */
  height: 226px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center; /* 子要素縦中央 */
  align-items: flex-start; /* 横を左揃え */
  padding-left: 150px;      /* 左の余白を追加 */
  box-sizing: border-box;
  margin-top: 80px;

}
/* ボックス内のリボン */
.ribbon{
  position: absolute;
  left: 30px;
  top: 0;
}

/* ポイント見出し */
.point {
  color: #e97c4c;
  font-size: 36px;
  font-weight: bold;
  position: relative;
  display: inline-block;  /* 線の幅を文字幅に合わせる */
  margin: 0;              /* 上下余白リセット */
}

.point::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;           /* 文字の下に配置 */
  width: 100%;
  height: 5px;
  background-color: #e97c4c;
}

/* 強調文字 */
.shikin{
  font-size:48px;
}

/* 説明文 */
.setsumei1{
  font-size:24px;
  font-weight:bold;
  margin-top:25px;
}

/* ボックス内の銀行画像 */
.bank{
  position: absolute;
  width:185px;
  height: 244px;
  bottom: -50px;
  right: -120px;
}


.Box-innner2 {
  width: 1200px;
  display: flex;
  flex-direction: column;
  align-items: flex-end; /* ✅ ← これに変更！ */
  margin: 0 auto;
}


.Box2{
  background-color: white;
  width: 997px;       /* ボックス幅 */
  height: 226px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center; /* 子要素縦中央 */
  align-items: flex-start; /* 横を左揃え */
  padding-left: 150px;      /* 左の余白を追加 */
  box-sizing: border-box;
  margin-top: 80px;
}
.Box2 .point2,
.Box2 .setsumei2 {
  align-self: flex-start;
  text-align: left;
  margin-left: 0px; /* paddingを打ち消す */
}

.ribbon2{
  position:absolute;
  left:30px;
  top:0;
}

.point2 {
  color: #e97c4c;
  font-size: 36px;
  font-weight: bold;
  position: relative; /* ::after を基準にする */
  display: inline-block; /* 線の幅を文字幅に合わせる場合 */
  margin: 0px auto;   /* 下の余白 */
}

.point2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;           /* 文字の下に配置 */
  width: 100%;            /* 横幅を文字幅に合わせる */
  height: 5px;            /* 線の太さ */
  background-color: #e97c4c; /* 線の色 */
}

.marketing{
  font-size:48px;
}

.setsumei2{
  font-size:24px;
  font-weight:bold;
  margin-top:25px;
}

.Marketing{
  position: absolute;
  width:242px;
  height: 169px;
  bottom:-50px;
  left: -250px;
}


.Box-innner3 {
  width: 1200px;
  display: flex;
  flex-direction: column;
  align-items: flex-start; /* ✅ ← これに変更！ */
  margin: 0 auto;
}


/* ボックス共通 */
.Box3{
  background-color: white;
  width: 997px;       /* ボックス幅 */
  height: 226px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center; /* 子要素縦中央 */
    align-items: flex-start; /* 横を左揃え */
  padding-left: 150px;      /* 左の余白を追加 */
  box-sizing: border-box;
  margin-top: 80px;
  margin-bottom: 80px;
}

/* ボックス内のリボン */
.ribbon3{
  position: absolute;
  left: 30px;
  top: 0;
}

/* ポイント見出し */
.point3 {
  color: #e97c4c;
  font-size: 36px;
  font-weight: bold;
  position: relative;
  display: inline-block;  /* 線の幅を文字幅に合わせる */
  margin: 0;              /* 上下余白リセット */
}

.point3::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;           /* 文字の下に配置 */
  width: 100%;
  height: 5px;
  background-color: #e97c4c;
}

/* 強調文字 */
.hiketsu{
  font-size:48px;
}

/* 説明文 */
.setsumei3{
  font-size:24px;
  font-weight:bold;
  margin-top:25px;
}

/* ボックス内の銀行画像 */
.advice{
  position: absolute;
  width:200px;
  height: 214px;
  bottom: -50px;
  right: -50px;
}


.button2{
    display: flex;
    text-align: center;
    flex-direction: column;
}

.imasugu2{
font-size:48px;
color:white;
font-weight: bold;
margin-top: 0;
margin-bottom:30px;
}

.cta2{
    text-decoration: none;
    background: linear-gradient(360deg, #316ea9, #2c8ec4, #4fbfc0); /* ←これ！ */
    color:white;
    font-size:48px;
    font-weight: bold;
    border: solid 4px white;
    width: 549px;
    height: 91px;
    margin: 0px auto 140px;
    border-radius: 35px;
    cursor:pointer;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}


.Toudan{
  margin-top: 0;
}
.cut-box1 {
  background-color: #e9e9e9;
  height: 960px;
  width:100vw;
  margin-top: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items:flex-start;
  gap:0;
  clip-path: polygon(
    0 0,       /* 左上 */
    100% 0,    /* 右上 */
    100% 55%,  /* 右下を上げて10度風 */
    0 100%     /* 左下 */
  );
}

.text-container{
   display: flex;
  flex-direction: column;
  margin-top: 0;
}
.gradation-pc{
  font-size:48px;
  font-weight:bold;
  margin-top:160px;
    background: linear-gradient(90deg, #e66326, #bb3f45);
  -webkit-background-clip: text;  /* 背景を文字の形で切り取る */
  -webkit-text-fill-color: transparent; /* 文字色を透明にする */
  text-align: center;
}

.introduction-container {
  background-color: #e87643;
  width: 570px;
  color: white;
  text-align: center;
  padding: 40px 0; /* 上下40px、左右0 */
  margin: 0 auto; /* コンテナを左右中央に */
}

.namae{
  font-weight: bold; 
  font-size:24px;
}

.successlabo{
  font-size:16px; 
  font-weight:regular;
}

.introduction-container p {
  margin: 0;
  padding: 0;
  line-height: 1.6;
}

.dansei1 {
  width: 450px; /* 少し小さめに調整してみる */
  height: auto;
  display: block;
  object-fit: cover;
  margin-top:110px;
}



.taro{
  font-family: "futura-pt", sans-serif;
font-weight: light;
font-style: normal;
font-size:24px;
}

.cut-box2 {
  background-color: #e87643;
  height: 960px;
  width:100vw;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items:center;
  gap:0;
   margin: -500px auto 0px;
   overflow: visible; 
}

.namae2{
  font-weight: bold; 
  font-size:24px;
}

.business-b{
  font-size:16px; 
  font-weight:regular;
}

.woman {
  width: 400px; /* 少し小さめに調整してみる */
  height: auto;
  display: block;
  object-fit: cover;
    margin-top: 15px; /* ← リセット */
  transform: translateY(120px); /* ← 頭ちょい出し */
  z-index: 2; /* ← 背景より前に出す（必要なら） */

}

.introduction-container2 {
  background-color:white;
  width: 570px;
  color: #e87643;
  text-align: center;
  padding: 40px 0; /* 上下40px、左右0 */
  margin: 0px 40px; /* コンテナを左右中央に */
 
  position: relative;         /* 自分を動かす基準 */
  top: 50%;                   /* 親の高さ中央に移動 */
  transform: translateY(calc(-150% - 60px)); /* 画像の transform 120pxを考慮して微調整 */
}

.introduction-container2 p {
  margin: 0;
  padding: 0;
  line-height: 1.6;
}

.Hanako{
  font-family: "futura-pt", sans-serif;
font-weight: light;
font-style: normal;
font-size:24px;
}

.cut-box3 {
  width: 100vw;
  height: 960px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 40px;
  position: relative;
  overflow: visible; /* 画像の頭をはみ出させる */
}

.cut-box3-bg {
  width: 100%;
  height: 960px;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.top-left-triangle {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: white;
  clip-path: polygon(
    100% 30%,  /* 背景の右下カット開始点 */
    100% 100%, /* 右下角 */
    0 100%     /* 左下角 */
  );
  z-index: 10; /* 背景より上 */
}

.name3{
font-weight: bold;
 font-size:24px;
}

.freedom{
  font-size:16px; 
  font-weight:regular;
}

.tanaka {
  width: 400px;
  height: auto;
  position: relative;
  top: -65px;  /* 頭だけ出す */
  z-index: 4;
  overflow: hidden;
}

.introduction-container3 {
  background-color: #e87643;
  width: 570px;
  text-align: center;
  padding: 40px 0;
  position: relative;
  top: 50%;
  transform: translateY(-120%);
  z-index: 4;
  color:white;
}



.introduction-container3 p {
  margin: 0;
  padding: 0;
  line-height: 1.6;
}

.Ichiro{
  font-family: "futura-pt", sans-serif;
font-weight: light;
font-style: normal;
font-size:24px;
}

.Koe-container {
  max-width: 1200px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin: -120px auto 0;
  position: relative; /* ← これを追加 */
  z-index: 20;        /* 背景三角形より大きめに */
}

.Voice {
  background-color: white;
  display: flex;
  justify-content: center;   /* 横方向中央 */
  align-items: center;       /* 縦方向中央 */
  position: relative;        /* 必要なら */
}

.voice-text {
  position: relative;        /* これを基準に画像を動かす */
  text-align: center;
}

.voice {
  font-size: 48px;
  font-weight: bold;
  color: #e2602b;
  font-style: italic;
  margin: 0;
}

.voice-en {
  font-size: 48px;
  font-weight: bold;
  color: #747271;
  margin: 0;
}

.koe-image {
  position: absolute;        /* 相対親を基準に動かす */
  left: 100%;                /* 親の右端に配置 */
  top: 50%;
  transform: translate(20px, -50%); /* 横に20px、縦中央 */
  width: 200px;
  height: 260px;
  object-fit: cover;
}

.Voice-container {
  display: flex;
  justify-content: center; /* 中央寄せ */
  align-items: flex-start; /* 高さをそろえないように */
  gap: 80px;               /* ボックス同士の間隔 */
  margin-top: 80px;
  margin-bottom: 80px;
}

.voice1,
.voice2 {
  position: relative;
  width: 545px;             /* ← 幅を固定！ここがポイント */
  height: 476px;            /* 高さも固定（画像に合わせる） */
  background-image: url('images/ヴォイス背景.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}


.tytle1,.tytle2{
  font-family: "Comic Relief", system-ui;
  font-weight: 400;
  font-style: normal;
  font-size:48px;
  color:white;
  position:absolute;
  top: -40px;  /* 上から50px */
  left: 20px; /* 左から20px */
}

.takahashi{
  width: 224px;
  height: 366px;
  position:absolute;
  left: 0;
  bottom:0;
}

.misaki{
  width: 320px;
  height: 400px;
  position:absolute;
  left: -80px;
  bottom:0;
}

.bun1,.bun2{
  position:absolute;
  top: 130px;  /* 上から50px */
  right: 20px; /* 左から20px */
  font-size:16px;
  font-weight: bold;
  text-align: left;
  line-height: 30px;
}

.color-text{
  color:#e46129;
}

.voice-name,.voice-name2{
 font-size:16px;
 color:white;
 position:absolute;
 bottom:30px;
 right:20px;
 text-align: left;
}


.Voice-container2 {
  display: flex;
  justify-content: center; /* 中央寄せ */
  align-items: flex-start; /* 高さをそろえないように */
  gap: 80px;               /* ボックス同士の間隔 */
  margin-top: 0px;
  margin-bottom: 80px;
}

.voice3,
.voice4 {
  position: relative;
  width: 545px;             /* ← 幅を固定！ここがポイント */
  height: 476px;            /* 高さも固定（画像に合わせる） */
  background-image: url('images/ヴォイス背景.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}


.tytle3,.tytle4{
  font-family: "Comic Relief", system-ui;
  font-weight: 400;
  font-style: normal;
  font-size:48px;
  color:white;
  position:absolute;
  top: -40px;  /* 上から50px */
  left: 20px; /* 左から20px */
}

.yui{
  width: 224px;
  height: 366px;
  position:absolute;
  left: 0;
  bottom:0;
}

.haruto{
  width:280px;
  height: 360px;
  position:absolute;
  left: -20px;
  bottom:0;
}

.bun3{
  position:absolute;
  top: 130px;  /* 上から50px */
  right: 60px; /* 左から20px */
  font-size:16px;
  font-weight: bold;
  text-align: left;
  line-height: 30px;
}

.bun4{
  position:absolute;
  top: 130px;  /* 上から50px */
  right: 60px; /* 左から20px */
  font-size:16px;
  font-weight: bold;
  text-align: left;
  line-height: 30px;
}

.voice-name3,.voice-name4{
 font-size:16px;
 color:white;
 position:absolute;
 bottom:30px;
 right:20px;
 text-align: left;
}



.Voice-container3 {
  display: flex;
  justify-content: center; /* 横並び中央 */
  align-items: flex-start; /* 高さは揃えない */
  gap: 60px;
  margin-top: 0px;
  margin-bottom: 0px;
  position: relative;      /* Buildingを調整する基準 */
}


.voice5{
  position: relative;
  width: 545px;             /* ← 幅を固定！ここがポイント */
  height: 476px;            /* 高さも固定（画像に合わせる） */
  background-image: url('images/ヴォイス背景.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
    z-index: 1;
}


.tytle5{
  font-family: "Comic Relief", system-ui;
  font-weight: 400;
  font-style: normal;
  font-size:48px;
  color:white;
  position:absolute;
  top: -40px;  /* 上から50px */
  left: 20px; /* 左から20px */
}

.kenichi{
  width:330px;
  height: 360px;
  position:absolute;
  left: -20px;
  bottom:0;
}

.bun5{
  position:absolute;
  top: 130px;  /* 上から50px */
  right: 30px; /* 左から20px */
  font-size:16px;
  font-weight: bold;
  text-align: left;
  line-height: 30px;
}

.voice-name5{
 font-size:16px;
 color:white;
 position:absolute;
 bottom:30px;
 right:20px;
 text-align: left;
}

.building {
  display: block;
  width: 580px;          /* 横並びの幅 */
  height: auto;
  object-fit: cover;
  opacity: 0.7;
  margin-top: 140px;      /* Flexで残ったスペースに押し下げ */
  margin-bottom: 0;
      display: block; 
}


.imasugu-bg {
  background: linear-gradient(to bottom, #e66326,#bb3f45);
  margin: 0;
  padding-top: 140px;
  padding-bottom:140px;
  line-height: 1;
}

.touroku{
  font-size:60px;
  font-weight: bold;
  margin: 0  auto 80px;
  color:white;
  text-align:center;
  line-height: 90px;
}

.seminar-container{
  background-color:white;
  width:1025px;
  height:auto;
  font-size:36px;
  font-weight:bold;
  padding:80px;
  text-align: left;
  margin:0 auto;
  line-height: 48px;

  display:flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.syoshinsya{
  font-weight:bold; 
  font-size:48px; 
  color:#e66326; 
  margin-top: 0px;
  margin-bottom:40px;
}

.seminar-container p{
  padding:0;
margin: 0;
}

.scedule{
  margin-top: 40px;
}

.button3{
    display: flex;
    text-align: center;
    flex-direction: column;
    margin-bottom: 0;
    line-height: 1; /* 親の line-height を打ち消す */
    padding:0 !important;
}

.imasugu3{
font-size:48px;
color:#e86522;
font-weight: bold;
padding:0;
margin-top: 0px;
margin-bottom:30px;
}

.cta3{
  display: block; 
    text-decoration: none;
    background: linear-gradient(360deg, #316ea9, #2c8ec4, #4fbfc0); /* ←これ！ */
    color:white;
    font-size:48px;
    font-weight: bold;
    border: none;
    width: 549px;
    height: 91px;
    margin: 0 auto 0;
    border-radius: 35px;
    cursor:pointer;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    line-height: 1;  
}

.footer{
background-color: white;
text-align: center;
margin: 0 auto;
font-size:16px;
font-weight:bold;
margin-top:80px;
margin-bottom: 80px;
}

.footer p{
  margin:0;
  padding:0;
}

.mobile-br {
  display: none;
}

.maru3-mobile{
  display: none;
}

.gradation-mobile{
  display: none;
}

.pc-br{
  display: block;
}


@media (max-width: 767px) {

   .mobile-br {
    display: inline;
  }
  /* ファーストビュー全体 */
  .FV {
    min-height: 40vh;  /* スマホ向けに少し縮小 */
  }

  .FV-inner {
      padding-top: 20px;  /* 元が多い場合はここを少なめに */
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom:40px;
  }

   .obi {
    top: -10px; /* スマホだけ少し上げる */
  }

.Man {
  width: 200px;          /* 横幅は自動 */
  height: auto;        /* 縦の高さを大きくする */
  aspect-ratio: 627 / 885;
  bottom: -30px;
  right: -10px;
  position: absolute;
  z-index: 2;
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6); 
}



.man-name {
  position: absolute;     /* 右下固定のまま */
  right: 5px;               /* 画像の右端 */
  bottom: 30px;           /* 画像下から少し上 */
  font-size: 10px;
  text-align: left;       /* 文字は左揃え */
  width: 120px;           /* 必要に応じて文字幅を調整 */
  z-index: 3;
text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6); 
}

.name {
  position: absolute;
  right: 5px;               /* 画像右端 */
  bottom: 10px;           /* 画像下端から少し上 */
  font-size: 10px;
  text-align: left;       /* 文字左揃え */
  width: 120px;           /* 肩書きと幅をそろえる */
  z-index:3;
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6); 
}

  .kigyou {
    position: absolute;
    top: 10px;
    left: 10px;        /* 左から少し余白 */
    right: 10px;       /* 右も余白 */
    display: flex;
    justify-content: center;  /* 横中央に寄せる場合 */
    gap: 10px;
    white-space: normal;      /* 折り返し可能に */
    text-align: center;       /* 中央揃え */
  }

  .kigyou p {
    font-size: 20px;          /* スマホ用に文字サイズ縮小 */
  }

  .square {
    width: 50px;              /* スマホ用に縮小 */
    height: 5px;
  }

  .square2 {
    width: 40px;              /* スマホ用に縮小 */
    height: 5px;
  }

  .maru3 {
    flex-direction: column;       /* 横並び */
    gap: 10px;
    margin: 0px  0px;      /* FV下に余白 */
    justify-content: center; /* 左寄せ */
    align-items: center;
    z-index: 4;
    display: none;
  }

  .pc-br{
    display:none;
  }

  .maru3-mobile{
    display: block;
    margin-top: 10px;

  }

.free,
.ruikei,
.satisfaction-mobile {
  border-radius: 8px;        /* 角丸四角 */
  width: 200px;
  height: auto;
  font-size: 20px;
  padding: 10px;
  color: #da5933;
  background-color: rgba(255, 255, 255, 0.8); /* ← 白80%透明 */
  margin: 10px auto 0 0;        /* 左寄せ */
  text-align: center;
  font-weight: bold;
}


  .satisfaction-mobile{
    display: block;
    font-size:28px;
    font-weight: bold;
  }

  .satisfaction-mobile .small {
  display: inline-block;      /* inline-block にする */
  vertical-align: middle;     /* 上下中央に揃える */
}


.chance {
  max-width: 350px;
  height: auto;
  font-size: 16px;
  line-height: 1.4;
  padding: 10px 0;
  margin: 0px 0;          /* ← autoを削除（中央寄せ解除） */
  text-align: left;        /* ← テキストも左揃えに */
  box-sizing: border-box;
  z-index: 1;
  background-color:  transparent !important;
  color:white;
}

.small{
  font-size:14px;
  color:#747271;
}

.futoji {
  font-size: 20px;
  color: white;
}


.satisfaction-wrapper {
  width: 100%;
  margin: 0;
  padding: 0;
  align-items: flex-start; /* このままでOK */
}


  .Tytle {
  padding-top: 50px;  /* 元が120pxなら50pxに縮小 */
}


.tytle {
  font-size: 36px;
  margin: 0; /* ← 中央寄せを解除して左寄せ */
  text-align: left; /* ← 念のため左揃え */
}

.first-step {
  width: 170px;
  font-size: 16px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  box-sizing: border-box;
  margin: 0 0 10px 0; /* ← 左寄せに変更 */
}



  .first-step::after {
    bottom: -10px;      /* 三角の位置調整 */
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid white;  /* 三角の大きさ */
  }

  .imasugu {
    font-size: 24px;
    margin-top: 40px;
    margin-bottom: 20px;
  }

  .cta {
    font-size: 24px;
    width: 90%;
    max-width: 300px;
    height: 60px;
    border-radius: 25px;
    margin: 0 auto 40px;
  }

.mirai-wrapper {
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  padding: 0px;
  box-sizing: border-box;
  bottom: 0px;   /* 親の底から余白を作る */
}


  .success {
    font-size: 20px;           /* 文字サイズ縮小 */
    margin-bottom: 20px;       /* 下の余白も縮小 */
    margin-top: 0;
  }

  .sentence {
    font-size: 12px;           /* 文字サイズ縮小 */
    margin-top: 0;
    
  }

.jump-img {
   display: block; 
  height: 40vh;           /* 高さを少し低くして見える範囲を広げる */
  width: 100%;
  object-fit: cover;
  object-position: top;   /* トップ寄せ・bottomなども試せる */
  margin-bottom: 0;
}
  .mirai{
    min-height: 40vh;
    margin-bottom: 0;
    position: relative;
    padding-bottom:0px;
  }

  @media (max-width: 375px) {
  .jump-img {
    height: 50vh;      /* SEだけ少し高く */
     width: 100%;
   object-fit: cover;
  object-position: top;   /* トップ寄せ・bottomなども試せる */
  }

  .mirai{
    min-height: 50vh;
    margin-bottom: 0;
    position: relative;
  }

  }
/* 背景ラッパーの上下余白を縮小 */
  .Onayami {
    margin-top: 0;
    padding: 60px 0 80px;
  }

  /* 内部ラッパーを縦並びに変更（横並びだと画面狭いと潰れるため） */
  .Onayami-inner {
    flex-direction: column;
    align-items: center;  /* 画像とテキストを中央寄せ */
    gap: 20px;
    padding: 0 15px;      /* 横余白を縮小 */
  }

  /* 画像 */
  .Onayami-inner img {
    width: 80%;           /* 画面幅に応じて縮小 */
    max-width: 200px;     /* スマホ用最大幅 */
    height: auto;
  }

  /* 見出し */
  .nayami {
    font-size: 20px;
    text-align: center;   /* 中央寄せ */
    margin-bottom: 20px;
  }

  /* 吹き出し部分 */
  .onayami-container {
    padding: 40px 40px;
    gap: 10px;
    width: 100%;          /* 横幅いっぱいに */
    box-sizing: border-box;
  }

  .onayami-container::before {
    left: 10px;           /* 吹き出しの三角を少し内側に調整 */
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-right: 12px solid white;
  }

  .onayami-container p {
    font-size: 16px;
    padding-left: 30px;   /* 左スペース縮小 */
    white-space: nowrap;
  }

  .onayami-container p::before {
    width: 20px;
    height: 20px;
  }

    /* .Point はそのまま縦並び */
  .Point {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
  }

  /* 三角のコンテナをスマホ用に縮小 */
  .Sankaku {
    width: 100%;          /* 画面幅に合わせる */
    max-width: 400px;    /* スマホ用最大幅 */
    height: 170px;        /* 高さ自動 */
    padding: 10px 20px 20px 20px;
    clip-path: polygon(50% 100%, 0 0, 100% 0);  /* 三角形は維持 */
    display: flex;
    justify-content: center;
    align-items: flex-start; /* 上寄せ */
    text-align: center;
  }

  /* テキストサイズ縮小 */
  .Sankaku p {
    font-size: 14px;
    text-align: center;
  }

  .Sankaku .kaisyou {
    font-size: 20px;    /* スマホ向けに縮小 */
    text-align: center;
  }

    .seikou {
    font-size: 24px;
    margin: 40px auto 20px;
    text-align: center;
  }

  .erareru {
    flex-direction: column;
    align-items: center;
    gap: 20px;
    font-weight: bold;
    text-align: center;
  }

  .before-box {
    font-size: 24px;
  }

  .haikei {
    font-size: 24px;
    padding: 3px 10px;
  }

  .san {
    font-size: 48px;
  }

  /* Box-innner 全体 */
  .Box-innner, .Box-innner2, .Box-innner3 {
    width: 90%;
    max-width: 350px;
    margin: 0 auto;
    align-items: center; /* 中央寄せに変更 */
  }

  /* 共通ボックス */
  .Box1, .Box2, .Box3 {
    width: 100%;
    height: auto; /* 高さ自動 */
    margin-top: 40px;
    padding: 20px 20px 20px 60px;
    margin-bottom: 0;
  }

  /* ポイントリボン画像 */
  .ribbon, .ribbon2, .ribbon3 {
    width: 35px;   /* 縮小 */
    height: auto;
    left: 10px;
    top: 0;
  }

  /* 内部画像 */
  .bank, .Marketing, .advice {
    width: 80px;    /* 縮小 */
    height: auto;
    bottom: -20px;
    right: -20px;
    left: auto;
  }

  /* ポイント見出し */
  .point, .point2, .point3 {
    font-size: 16px;
    text-align: left;
  }

  .shikin, .marketing, .hiketsu {
    font-size: 20px;
  }

  /* 説明文 */
  .setsumei1, .setsumei2, .setsumei3 {
    font-size: 14px;
    margin-top: 20px;
    text-align: left;
  }

  /* 各Box内の横中央寄せ */
  .Box1 p, .Box2 p, .Box3 p {
    text-align: left;
  }

.button2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin: 0 auto;
}

.imasugu2 {
  font-size: 24px;       /* 文字サイズ縮小 */
  color: white;
  font-weight: bold;
  margin-top: 40px;
  margin-bottom: 20px;
  text-align: center;
}

.cta2{
  display: flex;
  align-items: center;             /* 縦中央 */
  justify-content: center;         /* 横中央 */
  text-decoration: none;
  background: linear-gradient(360deg, #316ea9, #2c8ec4, #4fbfc0);
  color: white;
  font-size: 24px;                 /* 文字サイズ縮小 */
  font-weight: bold;
  border: solid 2px white;         /* PC版の半分 */
  width: 90%;                       /* 画面幅に合わせる */
  width: 300px;                 /* 最大幅 */
  height: 60px;                     /* 高さ縮小 */
  margin: 0 auto 80px;
  border-radius: 25px;              /* 角丸縮小 */
  padding: 20px 15px;                  /* 文字端の余白 */
  box-sizing: border-box;
  cursor: pointer;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.gradation-mobile {
  display: block;
  font-size: 20px;
  text-align: center;
  margin: 80px 0 20px 0;
  font-weight: bold;
  background: linear-gradient(90deg,#e66326,#bb3f45);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  white-space: nowrap;  /* ← これで改行禁止 */
}

  /* PCタイトルは非表示 */
  .gradation-pc { display: none; }

.cut-box1 {
  position: relative;      /* 絶対配置の基準にする */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  height: 700px;           /* 十分な高さを確保 */
  padding: 80px 10px;
  box-sizing: border-box;
    clip-path: polygon(
    0 0,       /* 左上 */
    100% 0,    /* 右上 */
    100% 78%,  /* 右下を下げて傾きを緩やかに */
    0 100%     /* 左下 */
  );
}




  .cut-box1 p {
  margin-top: 0;
  padding-top: 0;
}

.text-container {
  position: absolute;
  top: 53%;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;       /* 親幅を明示 */
  max-width: 570px;  /* 最大幅を固定 */
  text-align: center;
  color: white;
  margin: 0 auto;
  padding: 0;
  border-radius: 8px;
}



/* 共通幅・パディング */
.introduction-container2,
.introduction-container3 {
  width: 80%;
  max-width: 570px;      /* 最大幅を570pxに固定 */
  padding: 20px;
  box-sizing: border-box;
  text-align: left;
  margin: 0 auto;        /* 中央寄せ */
}

.introduction-container {
  width: 80%;          /* 親幅いっぱいに広げる */
  max-width: 570px;     /* 最大幅を570pxに固定 */
  padding: 20px;
  box-sizing: border-box;
  margin: 0 auto;       /* 中央揃え */
  text-align: left;     /* 元の指示を維持 */
}

/* 静的配置のコンテナ2 */
.introduction-container2 {
  order: 3;                 /* 元の指示を維持 */
  position: static;          /* 元の指示を維持 */
  transform: none;           /* 元の指示を維持 */
  margin: -100px auto 40px;  /* 元の指示を維持 */
  z-index: 3;                /* 元の指示を維持 */
}

/* 絶対配置のコンテナ3 */
.introduction-container3 {
  position: absolute;        /* 元の指示を維持 */
  top: 260px;                /* 元の指示を維持 */
  left: 50%;                 /* 元の指示を維持 */
  transform: translateX(-50%); /* 元の指示を維持 */
  z-index: 3;                /* 元の指示を維持 */
}



.dansei1 {
  width: 80%;
  max-width: 200px;
  height: auto;
  margin-top: -20px;           /* 上に余白なし */
  margin-bottom: 0;
}



  .dansei1 { order: 2;}

  
  .namae{
    font-size:20px;
  }

  .introduction-container .namae{
    font-size:20px;
  }
  .introduction-container2 .namae2 {
  font-size: 20px;
}

 .name3 {
  font-size: 20px;
}

  .taro,.Hanako{
    font-size:16px;
  }

  .successlabo{
    font-size:14px;
  }

  .introduction-container2 .business-b{
  font-size: 14px;
}

  .introduction-container3 .freedom {
  font-size: 14px;
}

.cut-box2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;  /* 中央揃え */
  gap: 10px;
  height: 800px;
  padding: 0px 10px;      /* 左右だけ padding、上下は flex で中央揃え */
  box-sizing: border-box;
  margin-top: -450px;
  margin-bottom: 0;
}

.woman {
  width: 80%;                  /* スマホ幅に合わせて縮小 */
  max-width: 200px;
  transform: translateY(0);
  margin: 40px auto 0;        /* 上余白を大きくして下に下げる */
  order: 2;
  z-index: 2;
}




  .introduction-container2 p {
    font-size: 16px;             /* テキストも縮小 */
  }

  .Hanako {
    font-size: 18px;             /* 名前も縮小 */
  }

.cut-box3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 0px; /* 上余白を少し減らす */
  margin: 0px auto;
  box-sizing: border-box;
  position: relative;
  height: 700px;
}

.cut-box3-bg {
  position: absolute; /* 親にフィット */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;       /* 親の高さに合わせる */
  clip-path: polygon(
    0 0,
    100% 0,
    100% 65%,
    0 80%
  );
  z-index: 1;
}

.tanaka {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  width: 200px;
  order: 1;
}

.top-left-triangle{
  display: none;
}

  .Ichiro {
    font-size: 16px;
  }

  .voice,.voice-en{
    font-size:24px;
  }

  .Koe-container {
  position: relative;      /* 重ねる基準 */
  margin-top: -120px;      /* 上の余白分を重ねる */
  z-index: 5;              /* 必要に応じて前面に */
}

  .koe-image{
  width: 100px;
  height: 130px;
  left: 80%;
  }

  .Voice-container {
    flex-direction: column;
    align-items: center;
    gap: 60px;            /* ボックス間の余白 */
    margin-top: 60px;
    margin-bottom: 60px;
  }

  .Voice-container2 {
    flex-direction: column;
    align-items: center;
    gap: 60px;            /* ボックス間の余白 */
    margin-top: 0px;
    margin-bottom: 60px;
  }

  .Voice-container3 {
    flex-direction: column;
    align-items: center;
    gap: 60px;            /* ボックス間の余白 */
    margin-top: 0px;
    margin-bottom: 0px;
  }

.voice1,.voice2,.voice3,.voice4,.voice5 {
  position: relative;
  width: 300px;             /* ← 幅を固定！ここがポイント */
  height: 360px;            /* 高さも固定（画像に合わせる） */
  background-image: url('images/ヴォイス背景.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.tytle1,.tytle2,.tytle3,.tytle4,.tytle5{
  font-family: "Comic Relief", system-ui;
  font-weight: 400;
  font-style: normal;
  font-size:24px;
  color:white;
  position:absolute;
  top: -10px;  /* 上から50px */
  left: 20px; /* 左から20px */
}

.takahashi{
  width: 100px;
  height: 170px;
  position:absolute;
  left: 0px;
  bottom:0;
}

.yui{
  width: 100px;
  height: 160px;
  position:absolute;
  left: -10px;
  bottom:0;
}

.haruto{
  width: 120px;
  height: 160px;
  position:absolute;
  left: -10px;
  bottom:0;
}

.misaki{
  width: 130px;
  height: 160px;
  position:absolute;
  left: -20px;
  bottom:0;
}

.kenichi{
  width: 150px;
  height: 160px;
  position:absolute;
  left: -10px;
  bottom:0;
}


.bun1{
  position:absolute;
  top: 80px;  /* 上から50px */
  right: 30px; /* 左から20px */
  font-size:14px;
  font-weight: bold;
  text-align: left;
  line-height: 24px;
}

.bun2{
  position:absolute;
  top: 80px;  /* 上から50px */
  right: 0px; /* 左から20px */
  left: 20px;
  font-size:14px;
  font-weight: bold;
  text-align: left;
  line-height: 24px;
}

.bun3,.bun4,.bun5{
  position:absolute;
  top: 80px;  /* 上から50px */
  right: 20px; /* 左から20px */
  font-size:14px;
  font-weight: bold;
  text-align: left;
  line-height: 24px;
}

.voice-name,.voice-name3,.voice-name4,.voice-name5{
  font-size:14px;
  right:0;
}

.voice-name2{
  font-size:14px;
  bottom:10px;
  right:0;
}

.building {
  display: block;
  width: 580px;          /* 横並びの幅 */
  height: auto;
  object-fit: cover;
  opacity: 0.7;
  margin-top: 0px;      /* Flexで残ったスペースに押し下げ */
  margin-bottom: 0;
      display: block; 
}
  
 .imasugu-bg {
    padding-top: 60px;
    padding-bottom: 60px;
    margin-top: 0;
  }

  .touroku {
    font-size: 24px;
    line-height: 40px;
    margin-bottom: 40px;
  }

  .syoshinsya{
    font-size: 24px;
    line-height: 40px;
    margin-bottom: 40px;
  }

  .seminar-container {
    width: 80%;
    padding: 30px;
    font-size: 14px;
    line-height: 28px;
  }

  .imasugu3 {
    font-size: 24px;
    margin-top: 20px!important;
    margin-bottom: 20px;
  }

  .scedule{
    margin-top: 20px;
  }


  .cta3 {
    font-size: 24px;
    width: 90%;
    width: 300px;
    height: 60px;
    border-radius: 25px;
  }

  .seminar-container p {
    text-align: center; /* 中央寄せに */
  }

  .footer p{
    font-size:14px;
  }
.footer{
background-color: white;
text-align: center;
margin: 0 auto;
font-size:16px;
font-weight:bold;
margin-top:20px;
margin-bottom: 20px;
}

.gradation-pc{
  display: none;
}
}

@media (min-width: 768px) and (max-width: 819px) {
   .FV {
    min-height: 70vh;  /* スマホ向けに少し縮小 */
  }
  .FV-inner {
    padding: 0 40px; /* PCより少し狭く */
  }

  .Man {
    width: 360px;       /* 少し小さめにして右端に収まるように */
    height:500px;
    bottom: -30px;
    right: -40px;
    background-size: contain; /* iPadで縦が切れにくくなる */
  }

     .man-name .mobile-br {
    display: inline;
  }

  .man-name{
    bottom:70px;
    right: 30px;
    font-size:16px;
  }

  .name{
    bottom:25px;
    text-align: left;
    right: 90px;
    font-size: 24px;
  }

  .tytle {
    font-size: 60px;    /* 大きすぎる文字を調整 */
  }

  .first-step {
    font-size: 36px;
    width: 300px;
    height: 80px;
    line-height: 80px;
  }

  .chance {
    width: 600px;
    font-size: 24px;
    line-height: 65px;
  }

  .maru3 {
    gap: 10px;
    justify-content: flex-start;
    margin-bottom: 60px;
  }

  .free,
  .ruikei,
  .satisfaction-wrapper {
    width: 130px;
    height: 130px;
    font-size: 24px;
  }

  /* モバイル用の丸を非表示 */
 .maru3-mobile {
    display: none;
  }

   .mirai {
    min-height: 50vh; /* 高さを少し低くして間延び防止 */
  }

  .mirai-wrapper {
    padding: 40px 30px; /* 上下の余白を減らす */
    max-width: 90%;      /* 横幅を少し狭くして左右の余白を確保 */
  }

  .success {
    font-size: 36px;     /* 見出しをやや小さく */
    margin-bottom: 40px; /* 下の余白も調整 */
  }

  .sentence {
    font-size: 16px;     /* 本文も読みやすく縮小 */
    line-height: 1.6;    /* 行間を少し広げると綺麗 */
  }

  .jump-img {
    object-position: center top; /* トップ寄せで重要部分を見せる */
  }

  .Onayami {
    padding: 80px 0; /* 上下の余白を少し減らす */
  }

  .Onayami-inner {
    gap: 20px;           /* 画像とテキストの間隔を詰める */
    padding: 0 30px;     /* 横余白をやや広く */
    align-items: center; /* 縦位置を中央寄せに変更 */
  }

  .Onayami-inner img {
    max-width: 250px;    /* 画像を小さめに */
  }

  .nayami {
    font-size: 24px;     /* タイトルを少し縮小 */
    margin-bottom: 20px;
    text-align: center;
  }

  .onayami-container {
    padding: 40px;       /* 全体の余白を減らす */
    gap: 30px;
  }

  .onayami-container::before {
    left: -15px;         /* 吹き出しの矢印位置を微調整 */
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 15px solid white;
  }

  .onayami-container p {
    font-size: 20px;     /* テキストを少し小さく */
    padding-left: 35px;
  }

  .onayami-container p::before {
    width: 20px;
    height: 20px;
  }

  .Point {
    flex-direction: column;
    padding: 0; /* 少し上下に余白を足して見栄え調整 */
  }

  .Sankaku {
    width: 90%;                /* 固定幅→画面幅にフィットさせる */
    height: 300px;             /* 高さを少し低く */
    padding: 30px 15px 15px;   /* 余白を軽く調整 */
    clip-path: polygon(50% 100%, 0 0, 100% 0); /* 形はそのまま */
  }

  .Sankaku p {
    font-size: 20px;           /* テキスト縮小 */
  }

  .Sankaku .kaisyou {
    font-size: 36px;           /* メイン文字も一段階縮小 */
  }

  /* タイトル周り */
  .seikou {
    font-size: 36px;
    margin: 80px auto 20px;
  }

  .before-box,
  .haikei {
    font-size: 36px;
  }

  .san {
    font-size: 64px;
  }

  /* 各ボックスの共通調整 */
  .Box-innner,
  .Box-innner2,
  .Box-innner3 {
    width: 90%;              /* 固定幅→画面幅に合わせる */
  }

  .Box1,
  .Box2,
  .Box3 {
    width: 100%;
    height: auto;             /* 高さ自動にしてバランスを整える */
    padding: 40px 20px 40px 100px;       /* 内側に余白 */
    margin-top: 40px;
  }

  .cta2{
    margin-bottom: 80px;
  }

  .Box3{
    margin-bottom: 80px;
  }

  /* 見出し文字 */
  .point,
  .point2,
  .point3 {
    font-size: 24px;
  }

  .shikin,
  .marketing,
  .hiketsu {
    font-size: 36px;
  }

  /* 説明文 */
  .setsumei1,
  .setsumei2,
  .setsumei3 {
    font-size: 16px;
    line-height: 1.6;
    margin-top: 20px;
    text-align: left;
  }

  /* 画像の位置とサイズを小さめに調整 */
  .bank,
  .advice {
    width: 120px;
    height: auto;
    bottom: -30px;
    right: -45px;
  }

    .Marketing {
    position: absolute;
    width: 170px;
    height: auto;
    bottom: -40px;
    right: -40px; /* ← 右に配置 */
    left: auto;   /* ← PC指定の left を無効化 */
  }

  /* リボン */
  .ribbon,
  .ribbon2,
  .ribbon3 {
    width: 60px;
    height: auto;
    left: 15px;
  }


  .cut-box1 {
    display: flex;
    flex-direction: row;
    justify-content: center;      /* 全体は中央に置く */
    align-items: flex-start;
    gap: 0;                       /* gapで広がるのを防止 */
    height: 800px;
  }

  /* ← 左側ブロックを明示的に小さく＆右の画像に近づける */
  .text-container {
    width: 420px;                 /* 固定幅にする（autoだと広がる） */
    margin: 0;                    /* 余白をゼロ */
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;        /* 内容を右寄せにして画像に寄せる */
  }

  .introduction-container {
    width: 380px; 
    padding: 10px;
     position: relative;
  top: 30px;  /* 下に20pxずらす（上にしたいならマイナス） */
  text-align: left;

  }

  .gradation-pc {
    font-size: 28px;
    margin-top: 120px;
    text-align: center;            /* 右寄せ */
    white-space: nowrap;
  }

  .dansei1 {
    width: 330px;
    margin-top: 120px;
    margin-left: -40px;           /* ← ← ← これで実際に画像を左へ寄せる */
    
  }

  .cut-box2{
    height: 800px;
  }

  .introduction-container2{
    top:60%;
     width: 380px; 
    padding: 10px;
    text-align: left;
  }

  
  .woman{
    width: 300px;
  margin-top: 30px;
  }

  .tanaka{
    margin-left: 40px;
    margin-right: 40px;
    margin-top: 40px;
    width: 320px;
    height: auto;
  }

  .cut-box3-bg{
    height: 800px;
  }

  .cut-box3{
    gap:0;
  }

  .introduction-container3{
    margin-left: 30px;
    margin-top: -100px;
     width: 380px; 
    padding: 10px;
    text-align: left;
     box-sizing: border-box; /* padding を含めた幅になる */
  }
  

  .top-left-triangle {
  position: absolute;
  top: 70px;
  left: 0;
  width: 100%;
  height: 70%;
  background-color: white;
  clip-path: polygon(
    100% 30%,  /* 背景の右下カット開始点 */
    100% 100%, /* 右下角 */
    0 100%     /* 左下角 */
  );
  z-index: 10; /* 背景より上 */
}
  
.Koe-container {
  max-width: 900px;
  padding: 0 20px;
  position: relative;  
  overflow: visible;  
}


  .voice {
    font-size: 36px;
  }

  .Voice {
  position: relative;  /* stacking context の基準 */
  overflow: visible;   /* はみ出しても表示 */
  height: auto;        /* 子要素に合わせて高さを自動 */
}

  .voice-en {
    font-size: 36px;
  }
    .Koe-container {
  margin-top: -300px;      /* 上の余白分を重ねる */ 
}

.koe-image {
  position: absolute;
  z-index: 11;
  top: 0;
  left: 0;
  transform: translate(180px, -20%) scale(0.7); /* 70%に縮小 */
  transform-origin: top left;  /* 縮小の基準を左上に */
}


  /* --- 各 Voice コンテナ共通 --- */
.Voice-container{
  gap: 40px;
    margin-top: 60px;
    margin-bottom: 30px;
}
  .Voice-container2{
    gap: 40px;
    margin-top: 30px;
    margin-bottom: 30px;
  }

.Voice-container3 {
    gap: 40px;
    margin-top: 30px;
    margin-bottom: 80px;

  display: flex;
  flex-direction: row;
  align-items: flex-end;   /* 下揃え */
  gap: 40px;
  position: relative;
}

  .voice1,
  .voice2,
  .voice3,
  .voice4,
  .voice5 {
    width:350px;
    height: 380px;
    background-size: cover;
  }

  .voice5{
    z-index: 2;
  }

  .tytle1,
  .tytle2,
  .tytle3,
  .tytle4,
  .tytle5 {
    font-size: 36px;
    top: -30px;
    left: 15px;
  }

  /* --- 各人物画像 --- */
  .takahashi {
    width: 100px;
    height: auto;
  }

  .misaki {
    width: 140px;
    height: auto;
    left: -60px;
  }

  .yui {
    width: 100px;
    height: auto;
  }

  .haruto {
    width: 120px;
    height: auto;
    left: -10px;
  }

  .kenichi {
    width: 170px;
    height: auto;
  }

  /* --- テキスト調整 --- */
  .bun1,
  .bun2{
    top: 80px;
    right: 10px;
    font-size: 16px;
    line-height: 26px;
  }

  .bun3,.bun4{
    top: 80px;
    right: 30px;
    font-size: 16px;
    line-height: 26px;
  }

  .bun5{
    top: 80px;
    right: 20px;
    font-size: 16px;
    line-height: 26px;
  }

.bun5 span.mobile-br {
  display: inline;
}

  .voice-name,
  .voice-name2,
  .voice-name3,
  .voice-name4,
  .voice-name5 {
    font-size: 14px;
    bottom: 20px;
    right: 15px;
  }

.building {
  width: 350px;
 margin-left: auto;   /* 元のFlex位置を維持 */
  z-index: 3;
  position: relative;
  transform: translate(20px, 80px); /* X方向に50px、Y方向に100px */
}

.imasugu-bg {
  background: linear-gradient(to bottom, #e66326,#bb3f45);
  margin: 0;
  padding-top: 80px;      /* 上下余白を縮小 */
  padding-bottom: 80px;
  line-height: 1;
}

/* 登録テキスト */
.touroku {
  font-size: 36px;         /* 小さめに調整 */
  font-weight: bold;
  margin: 0 auto 40px;
  color: white;
  text-align: center;
  line-height: 48px;       /* 行間を縮小 */
}

/* セミナーコンテナ */
.seminar-container {
  background-color: white;
  width: 90%;              /* 幅を画面に合わせて縮小 */
  max-width: 650px;        /* 最大幅も指定 */
  font-size: 20px;          /* 文字サイズを小さめに */
  font-weight: bold;
  padding: 60px 20px;           /* パディングも縮小 */
  text-align: left;
  margin: 0 auto;
  line-height: 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* 初心者向けセミナー見出し */
.syoshinsya {
  font-weight: bold; 
  font-size: 36px;          /* 文字サイズを小さく */
  color: #e66326; 
  margin-top: 0;
  margin-bottom: 20px;
  text-align: center;
}

/* pタグのリセット */
.seminar-container p {
  padding: 0;
  margin: 0;
}

/* スケジュール部分 */
.scedule {
  margin-top: 30px;        /* 上余白を少し縮小 */
  margin-bottom: 30px;
  font-size: 24px;
  text-align: left;
  line-height: 30px;
}



/* フッター */
.footer {
  background-color: white;
  text-align: center;
  margin: 40px auto;        /* 上下余白を縮小 */
  font-size: 14px;           /* 文字サイズを小さめに */
  font-weight: bold;
}

.footer p {
  margin: 0;
  padding: 0;

}

.imasugu,.imasugu2,.imasugu3{
  font-size:36px;
}

.cta,.cta2,.cta3{
  font-size:36px;
  width:400px;
}


}

@media (min-width: 820px) and (max-width: 939px){
  .FV {
    min-height: 60vh;  /* スマホ向けに少し縮小 */
  }
  .FV-inner {
    padding: 0 40px; /* PCより少し狭く */
  }

  .Man {
    width: 360px;       /* 少し小さめにして右端に収まるように */
    height:500px;
    bottom: -30px;
    right: -40px;
    background-size: contain; /* iPadで縦が切れにくくなる */
  }

     .man-name .mobile-br {
    display: inline;
  }

  .man-name{
    bottom:70px;
    font-size:16px;
    margin-right: 30px;
  }

  .name{
    bottom:20px;
    text-align: left;
    right: 90px;
    font-size:24px;
  }

  .tytle {
    font-size: 60px;    /* 大きすぎる文字を調整 */
  }

  .first-step {
    font-size: 36px;
    width: 300px;
    height: 80px;
    line-height: 80px;
  }

  .chance {
    width: 600px;
    font-size: 26px;
    line-height: 65px;
  }

  .maru3 {
    gap: 10px;
    justify-content: flex-start;
    margin-bottom: 60px;
  }

  .free,
  .ruikei,
  .satisfaction-wrapper {
    width: 140px;
    height: 140px;
    font-size: 24px;
  }

  /* モバイル用の丸を非表示 */
.maru3-mobile{
    display: none;
  }

  .mirai {
    min-height: 50vh; /* 高さを少し低くして間延び防止 */
  }

  .mirai-wrapper {
    padding: 80px 30px; /* 上下の余白を減らす */
    max-width: 90%;      /* 横幅を少し狭くして左右の余白を確保 */
  }

  .success {
    font-size: 36px;     /* 見出しをやや小さく */
    margin-bottom: 50px; /* 下の余白も調整 */
  }

  .sentence {
    font-size: 20px;     /* 本文も読みやすく縮小 */
    line-height: 1.6;    /* 行間を少し広げると綺麗 */
  }

  .jump-img {
    object-position: center top; /* トップ寄せで重要部分を見せる */
  }

  .Onayami {
    padding: 80px 0; /* 上下の余白を少し減らす */
  }

  .Onayami-inner {
    gap: 20px;           /* 画像とテキストの間隔を詰める */
    padding: 0px;     /* 横余白をやや広く */
    align-items: center; /* 縦位置を中央寄せに変更 */
    justify-content: center;
  }

  .Onayami-inner img {
    max-width: 250px;    /* 画像を小さめに */
  }

  .nayami {
    font-size: 30px;     /* タイトルを少し縮小 */
    margin-bottom: 20px;
  }

  .onayami-container {
    padding: 40px;       /* 全体の余白を減らす */
    gap: 30px;
  }

  .onayami-container::before {
    left: -15px;         /* 吹き出しの矢印位置を微調整 */
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 15px solid white;
  }

  .onayami-container p {
    font-size: 20px;     /* テキストを少し小さく */
    padding-left: 35px;
  }

  .onayami-container p::before {
    width: 20px;
    height: 20px;
  }

  .Point {
    flex-direction: column;
    padding: 0; /* 少し上下に余白を足して見栄え調整 */
  }

  .Sankaku {
    width: 90%;                /* 固定幅→画面幅にフィットさせる */
    height: 300px;             /* 高さを少し低く */
    padding: 30px 15px 15px;   /* 余白を軽く調整 */
    clip-path: polygon(50% 100%, 0 0, 100% 0); /* 形はそのまま */
  }

  .Sankaku p {
    font-size: 20px;           /* テキスト縮小 */
  }

  .Sankaku .kaisyou {
    font-size: 36px;           /* メイン文字も一段階縮小 */
  }

   /* タイトル周り */
  .seikou {
    font-size: 36px;
    margin: 60px auto 20px;
  }

  .before-box,
  .haikei {
    font-size: 32px;
  }

  .san {
    font-size: 64px;
  }

  /* 各ボックスの共通調整 */
  .Box-innner,
  .Box-innner2,
  .Box-innner3 {
    width: 90%;              /* 固定幅→画面幅に合わせる */
  }

  .Box1,
  .Box2,
  .Box3 {
    width: 100%;
    height: auto;             /* 高さ自動にしてバランスを整える */
    padding: 40px 20px 40px 100px;       /* 内側に余白 */
    margin-top: 80px;
  }

  /* 見出し文字 */
  .point,
  .point2,
  .point3 {
    font-size: 28px;
  }

  .shikin,
  .marketing,
  .hiketsu {
    font-size: 36px;
  }

  /* 説明文 */
  .setsumei1,
  .setsumei2,
  .setsumei3 {
    font-size: 16px;
    line-height: 1.6;
    margin-top: 20px;
    text-align: left;
  }

  /* 画像の位置とサイズを小さめに調整 */
  .bank,
  .advice {
    width: 140px;
    height: auto;
    bottom: -30px;
    right: -30px;
  }

    .Marketing {
    position: absolute;
    width: 180px;
    height: auto;
    bottom: -40px;
    right: -40px; /* ← 右に配置 */
    left: auto;   /* ← PC指定の left を無効化 */
  }

  /* リボン */
  .ribbon,
  .ribbon2,
  .ribbon3 {
    width: 60px;
    height: auto;
    left: 15px;
  }
  .cta2{
    margin-bottom: 80px;;
  }

  .cut-box1 {
    display: flex;
    flex-direction: row;
    justify-content: center;      /* 全体は中央に置く */
    align-items: flex-start;
    gap: 0;                       /* gapで広がるのを防止 */
    height: 800px;
  }

  /* ← 左側ブロックを明示的に小さく＆右の画像に近づける */
  .text-container {
    width: 420px;                 /* 固定幅にする（autoだと広がる） */
    margin: 0;                    /* 余白をゼロ */
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;        /* 内容を右寄せにして画像に寄せる */
  }

   .introduction-container {
    width: 380px; 
    padding: 10px;
     position: relative;
  top: 30px;  /* 下に20pxずらす（上にしたいならマイナス） */
  text-align: left;

  }

  .gradation-pc {
    font-size: 27px;
    margin-top: 120px;
    margin-right: 0;              /* 不要な右余白を削除 */
    text-align: center;            /* 右寄せ */
    white-space: nowrap;
  }

  .dansei1 {
    width: 330px;
    margin-top: 120px;
    margin-left: -40px;           /* ← ← ← これで実際に画像を左へ寄せる */
    
  }

  .cut-box2{
    height: 800px;
  }

  .introduction-container2{
    top:60%;
     width: 380px; 
    padding: 10px;
    text-align: left;
  }

  
  .woman{
  width:300px;
  margin-top: 30px;
  }

  .tanaka{
    margin-left: 40px;
    margin-right: 40px;
    margin-top: 40px;
    width: 300px;
    height: auto;
  }

  .cut-box3-bg{
    height: 800px;
  }

   .introduction-container3{
    margin-left: 30px;
    margin-top: -100px;
     width: 380px; 
    padding: 10px;
    text-align: left;
     box-sizing: border-box; /* padding を含めた幅になる */
  }

    .top-left-triangle {
  position: absolute;
  top: 75px;
  left: 0;
  width: 100%;
  height: 70%;
  background-color: white;
  clip-path: polygon(
    100% 30%,  /* 背景の右下カット開始点 */
    100% 100%, /* 右下角 */
    0 100%     /* 左下角 */
  );
  z-index: 10; /* 背景より上 */
}
  



.Koe-container {
  max-width: 900px;
  padding: 0 20px;
  position: relative;  
  overflow: visible; 
  margin-top: -300px; 
  z-index: 12;  
}

  .Voice {
  position: relative;  /* stacking context の基準 */
  overflow: visible;   /* はみ出しても表示 */
  height: auto;        /* 子要素に合わせて高さを自動 */
  z-index:6
}

  .voice {
    font-size: 36px;
  }

  .voice-en {
    font-size: 36px;
  }

 .koe-image {
  position: absolute;
  z-index: 11;
  top: 0;
  left: 0;
  transform: translate(180px, -20%) scale(0.7); /* 70%に縮小 */
  transform-origin: top left;  /* 縮小の基準を左上に */
}

  /* --- 各 Voice コンテナ共通 --- */
.Voice-container{
  gap: 40px;
    margin-top: 60px;
    margin-bottom: 30px;
}
  .Voice-container2{
    gap: 40px;
    margin-top: 30px;
    margin-bottom: 30px;
  }

.Voice-container3 {
    gap: 40px;
    margin-top: 30px;
    margin-bottom: 80px;

  display: flex;
  flex-direction: row;
  align-items: flex-end;   /* 下揃え */
  gap: 40px;
  position: relative;
}

  .voice1,
  .voice2,
  .voice3,
  .voice4,
  .voice5 {
    width:350px;
    height: 380px;
    background-size: cover;
  }

  .voice5{
    z-index: 2;
  }

  .tytle1,
  .tytle2,
  .tytle3,
  .tytle4,
  .tytle5 {
    font-size: 36px;
    top: -30px;
    left: 15px;
  }

  /* --- 各人物画像 --- */
  .takahashi {
    width: 100px;
    height: auto;
  }

  .misaki {
    width: 140px;
    height: auto;
    left: -60px;
  }

  .yui {
    width: 100px;
    height: auto;
  }

  .haruto {
    width: 120px;
    height: auto;
    left: -10px;
  }

  .kenichi {
    width: 170px;
    height: auto;
  }

  /* --- テキスト調整 --- */
  .bun1,
  .bun2{
    top: 80px;
    right: 10px;
    font-size: 16px;
    line-height: 26px;
  }

  .bun3,.bun4{
    top: 80px;
    right: 30px;
    font-size: 16px;
    line-height: 26px;
  }

  .bun5{
    top: 80px;
    right: 20px;
    font-size: 16px;
    line-height: 26px;
  }

.bun5 span.mobile-br {
  display: inline;
}

  .voice-name,
  .voice-name2,
  .voice-name3,
  .voice-name4,
  .voice-name5 {
    font-size: 14px;
    bottom: 20px;
    right: 15px;
  }

.building {
  width: 350px;
 margin-left: auto;   /* 元のFlex位置を維持 */
  z-index: 3;
  position: relative;
  transform: translate(40px, 80px); /* X方向に50px、Y方向に100px */
}

.imasugu-bg {
  background: linear-gradient(to bottom, #e66326,#bb3f45);
  margin: 0;
  padding-top: 80px;      /* 上下余白を縮小 */
  padding-bottom: 80px;
  line-height: 1;
}

/* 登録テキスト */
.touroku {
  font-size: 36px;         /* 小さめに調整 */
  font-weight: bold;
  margin: 0 auto 40px;
  color: white;
  text-align: center;
  line-height: 48px;       /* 行間を縮小 */
}

/* セミナーコンテナ */
.seminar-container {
  background-color: white;
  width: 90%;              /* 幅を画面に合わせて縮小 */
  max-width: 650px;        /* 最大幅も指定 */
  font-size: 20px;          /* 文字サイズを小さめに */
  font-weight: bold;
  padding: 80px 20px;           /* パディングも縮小 */
  text-align: left;
  margin: 0 auto;
  line-height: 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* 初心者向けセミナー見出し */
.syoshinsya {
  font-weight: bold; 
  font-size: 36px;          /* 文字サイズを小さく */
  color: #e66326; 
  margin-top: 0;
  margin-bottom: 20px;
  text-align: center;
}

/* pタグのリセット */
.seminar-container p {
  padding: 0;
  margin: 0;
}

/* スケジュール部分 */
.scedule {
  margin-top: 40px;        /* 上余白を少し縮小 */
  margin-bottom: 40px;
  font-size: 24px;
  text-align: left;
  line-height: 30px;
}



/* フッター */
.footer {
  background-color: white;
  text-align: center;
  margin: 40px auto;        /* 上下余白を縮小 */
  font-size: 14px;           /* 文字サイズを小さめに */
  font-weight: bold;
}

.footer p {
  margin: 0;
  padding: 0;

}

.imasugu,.imasugu2,.imasugu3{
  font-size:36px;
}

.cta,.cta2,.cta3{
  font-size:36px;
  width:400px;
}

}

@media (min-width: 940px) and (max-width: 1024px){
.FV{
  min-height: 60vh;
}

.FV-inner{
  margin: 0 10px 20px 0;
}

.Man{
  width:400px;
  height: 600px;
  right:-10px;
}

.man-name{
  right:20px;
}

.name{
  right:20px;
}

.jump-img{
  height: 50vh;
}

.mirai{
  min-height: 50vh;
}

.mirai-wrapper{
  padding: 100px 40px 80px;
}

.success{
  margin-bottom: 50px;
  margin-top: 0;
}

.Onayami{
  padding:80px 0;
}


.Onayami-inner{
  padding:0;
  align-items: center;
  justify-content: center;
}

.Onayami-inner img{
  width:300px;
}

.Box-innner,.Box-innner2,.Box-innner3{
  width: 1000px;
}

.bank,.Marketing,.advice{
  width: 150px;    /* 縮小 */
    height: auto;
    bottom: -90px;
    right: -30px;
    left: auto;
}

.Marketing,.advice{
  width: 150px;    /* 縮小 */
    height: auto;
    bottom: -70px;
    right: -20px;
    left: auto;
}

.gradation-pc{
  font-size:36px;
}

.dansei1{
  width: 400px;
}



.woman{
  margin-top: 20px;
}

.tanaka{
  top:-90px;
  width: 400px;
}

    .top-left-triangle {
  position: absolute;
  top: 130px;
  left: 0;
  width: 100%;
  height: 80%;
  background-color: white;
  clip-path: polygon(
    100% 30%,  /* 背景の右下カット開始点 */
    100% 100%, /* 右下角 */
    0 100%     /* 左下角 */
  );
    }

.Koe-container{
    margin: -30px auto 0;
}
.Voice-container,.Voice-container2,.Voice-container3{
  gap:50px;
}
.voice1,.voice2,.voice3,.voice4,.voice5{
  width: 470px;
}

.Voice-container3{
  margin-bottom: 80px;
  position: relative;
}

.takahashi,.yui{
  width:150px;
  height: auto;
}

.haruto{
  width: 180px;
  height: auto;
}

.misaki,.kenichi{
  width:200px;
  height: auto;
}

.bun1{
  right: 30px;
}

.bun5{
   right:0;
}

.bun3{
  right:40px ;
}


.bun1,.bun2,.bun3,.bun4,.bun5{
  top:120px;
  font-size:20px;
}

.building {
  width: 450px;
  margin-left: auto;   /* 元のFlex位置を維持 */
  z-index: 3;
  position: relative;
  transform: translate(50px, 80px); /* X方向に50px、Y方向に100px */
}


.Koe-container {
  max-width: 900px;
  padding: 0 20px;
  position: relative;  
  overflow: visible;  
}

  .Voice {
  position: relative;  /* stacking context の基準 */
  overflow: visible;   /* はみ出しても表示 */
   margin-top: -150px;      /* 上の余白分を重ねる */
  height: auto;        /* 子要素に合わせて高さを自動 */
}



 .koe-image {
  position: absolute;
  z-index: 11;
  top: 0;
  left: 0;
  transform: translate(250px, -20%) scale(0.7); /* 70%に縮小 */
  transform-origin: top left;  /* 縮小の基準を左上に */
}



.imasugu-bg{
  padding-top:80px;
  padding-bottom:80px;
}

.touroku{
  font-size:48px;
  margin: 0 auto 40px;
}

.syoshinsya{
  font-size:36px;
}

.seminar-container{
  width:800px;
}

.scedule{
  font-size:24px;
}

.cta2{
  margin-bottom: 80px;
}

.maru3-mobile{
    display: none;
  }
}

@media (min-width: 1025px) and (max-width: 1440px) {

  .tanaka{
    top: -80px;
  }


.top-left-triangle {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: white;
  clip-path: polygon(
    100% 30%,  /* 背景の右下カット開始点 */
    100% 100%, /* 右下角 */
    0 96%     /* 左下角 */
  );
  z-index: 10; /* 背景より上 */
}
}