body{
  font-family: "Helvetica Neue",
  Arial,
  "Hiragino Kaku Gothic ProN",
  "Hiragino Sans",
  Meiryo,
  sans-serif;
}

main{
    max-width: 800px;
    margin: 0 auto;
    overflow: hidden;
}

@media screen and (max-width: 768px) {
  img {
  width:100%;
  max-width: 100%;
  height: auto;
	  
  }
}

.fv{
  position: relative;
  text-align: center;
}

.fv_title{
  position: absolute;
  top: 15%;
  right: 0;
	left:0;
  margin: 0 auto;
}


@media screen and (max-width: 768px) {
  .fv_title{
	  top: 26%; 
	  width:85%;
  }
}

 .btn_area{
  position: relative;
	 text-align: center;
}
/*フォーム上*/

 .ib{
  position: absolute;
  top: 40%;
  width: 100%;
  /* padding: 5% 0; */
}

@media screen and (max-width: 768px) {
  .ib{
    width: 92%;
    left: 4%;
    top: 35%;
  }
}

/* .btn_frame{
  position: relative;
  top: 10%;
} */

.input{
	margin:0 auto;
	width:95%;
	font-size:1.5rem;
	text-align: center;
}

@media screen and (max-width: 768px) {
  .input{
    margin:0 auto;
    width:100%;
    padding:6px;
    font-size:1rem;
    text-align: center;
  }
}

.mail_form{
  border: 3px solid #a0a0a0;
  background-color: #fff;
  border-radius: 10px;
	width:90%;
	padding:25px 0;
}
.btn{
	margin:5%;
	width:85%;
}

@media screen and (max-width: 768px) {
	.mail_form{border: 2px solid #a0a0a0;
    padding: 4%;
		margin-top:3%;
		width:97%;
}
.btn{
	margin:2%;
	width:85%;
}
}

/*ボタンアニメーション*/
.pulsate-fwd{-webkit-animation:pulsate-fwd 1.5s ease-in-out infinite both;animation:pulsate-fwd 1.5s ease-in-out infinite both}
 @-webkit-keyframes pulsate-fwd{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulsate-fwd{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}

.worry{
  position: relative;
  text-align: center;
	font-size: 0;
}

.worry_title{
  position: absolute;
  top: 4%;
  right: 0;
  left:0;
  width: 80%;
  margin:0 auto;
}

.solution{
  position: relative;
  text-align: center;
	font-size: 0;
}

.solution_title{
  position: absolute;
  top: 14%;
  right: 0;
  left:0;
  width: 90%;
  margin:0 auto;
}

.reason{
  position: relative;
	font-size: 0;
}

.reason1{
  position: absolute;
  top: 6%;
  margin: 0 auto;
  left: 0;
  right: 0;
  width: 90%;
}

.reason2{
  position: absolute;
  top: 37.5%;
  margin: 0 auto;
  left: 0;
  right: 0;
  width: 90%;
}

.reason3{
  position: absolute;
  top: 69%;
  margin: 0 auto;
  left: 0;
  right: 0;
  width: 90%;
}

.review{
	position:relative;
}

.movie1 video{
	position:absolute;
	top:22%;
	width:85%;
	margin:0 auto;
	left:0;
	right:0;
}

.movie2 video{
	position:absolute;
	top:51.5%;
	width:85%;
	margin:0 auto;
	left:0;
	right:0;
}
.movie3 video{
	position:absolute;
	top:81%;
	width:85%;
	margin:0 auto;
	left:0;
	right:0;
}

.point,.teacher{
	font-size: 0;
}
 /*フッター*/

footer {
  border-top: 2px solid #68c9d4;
  padding: 5% 0 0 0;
  position: relative;
  z-index: 9999;
  color: #01354d;
  background:#77dadb;
  margin-top: auto;
}

footer a {
  color: #01354d;
}

.footer_text{
	text-align: center;
  padding: 10px 0;
  color: #01354d;
  font-size: 16px;
	font-weight: 600;
}
@media screen and (max-width: 768px) {
	.footer_text{
		font-size:14px;
}
}

.copy {
  text-align: center;
  padding: 10px 0;
  color: #01354d;
  font-size: 11px;
}

/* fadeUp*/
.fadeUp {
  -webkit-animation-name: fadeUpAnime;
  animation-name: fadeUpAnime;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes fadeUpAnime {
  from {
    opacity: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.fadeUpTrigger {
  opacity: 0;
}

/*アニメーション*/
/*スライドイン*/
.scroll_fadein{
  opacity: 0;
}
.fadein_animation_start{
  /*キーフレームアニメーションを指定*/
  animation-name: fadein_animation;
  /* アニメーションの開始時間の遅延*/
  animation-delay: 0.3s;
  /* アニメーションの時間を指定*/
  animation-duration: 1s;
  /*アニメーション再生後のスタイルを指定*/
  animation-fill-mode: both;
}
@keyframes fadein_animation{
  0% {
    opacity: 0;
  }
  100%{
    opacity: 1;
    transform: translate(0);
  }
}
.slideup{
  transform: translateY(50px);
}

.slidedown{
  transform: translateY(-50px);
}
.slide-top{-webkit-animation:slide-top .7s cubic-bezier(.25,.46,.45,.94) both;animation:slide-top .7s cubic-bezier(.25,.46,.45,.94) both}
/* ----------------------------------------------
 * Generated by Animista on 2024-4-26 14:46:59
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

@-webkit-keyframes slide-top{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{-webkit-transform:translateY(-100px);transform:translateY(-100px)}}@keyframes slide-top{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{-webkit-transform:translateY(-100px);transform:translateY(-100px)}}