html {
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}

img {
margin: 0 auto;
vertical-align: bottom;
margin-top: -1px;
}

img.img-gap {
  margin-top: -1px;
}

.wrapper {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
}

#result {
  max-width: 750px;
  margin: 0 auto;
}

.en {
  color: #c3c3c3;
  font-size: 1.8em;
  font-weight: 800;
  margin-right: 7px;
  font-family: math;
}

/* .wrapper .title-page .fv img {
  vertical-align: bottom;
  line-height: 1.0em;
} */

.scroll-container {
  display: flex;
  overflow-x: auto; /* 横スクロールを許可 */
  scroll-behavior: smooth; /* スムーズなスクロール */
  white-space: nowrap; /* 要素が折り返されないようにする */
  width: 100%; /* コンテナの幅を親要素に合わせる */
}

.scroll-container img {
  max-width: 136%; /* 画像の幅を親要素に合わせる */
  height: auto; /* アスペクト比を維持 */
  margin: 0 6% 5% 6%;/* 画像間の余白 */
}

.soudan_img{
  margin-top: 10%;
}

.details {
	transition: .3s;
	overflow: hidden;
	margin-top: -10px;
	padding: 4% 5%;
	&:last-of-type {
		margin-bottom: 0;
	}
}
.details[open] {
	margin-top: 0;
	padding-bottom: 10px;
} 
.details-summary {
	display: flex;
	padding: 12px 15px;
    transition: .3s;
	transform: translateY(10px);
	background-color: #ff9db1;
	font-size: 20px;
	font-weight: bold;
	color: #fff;
	&:hover {
		cursor: pointer;
	}
}
.details-summary::-webkit-details-marker {
	display: none;
}
.details[open] .details-summary {
	transform: translateY(0);
}
.details-content {
	padding: 20px;
	background-color: #fff2f2;
}

p.details-content{
  font-size: 14px;
  text-align: left;
  line-height: 23px;
  letter-spacing: 2px;
  font-family: sans-serif;
  color: #4a4a4a;
}

.Qsize {
    margin: 1% 3% 0 0;
    font-size: 29px;
    font-family: serif;
    flex: inherit;
    color: #fff;
}

p.maintx {
  padding: 7px;
  font-size: 0.7em;
  text-align: left;
  line-height: 20px;
  letter-spacing: 1px;
  font-family: sans-serif;
  font-weight: 600;
  color: #fff;
}

.all_list{
  margin: 0px 4px 40px 4px;
}

.page ul {
  width: 100%;
  list-style-type: none; /* デフォルトのリストマーカーを削除（オプション） */
  padding: 0;            /* リストの余白を削除（オプション） */
  text-align: center!important; /* ul自体を中央揃え */
  background-color: #fff2f2;
}

.page li {
  display: inline-block;  /* liをインラインブロックに */
  width: 100%;     
  margin: 0 auto;
}

.loading relative{
  background-color:#fff7f5;
}

.q {
  display: block;
  padding: 2% 0 0 0;
  margin: 20px 15px 0 15px;
  font-size: 1.5em;
  font-weight: normal;
  font-family: sans-serif;
  text-align: left;
  font-weight: 600;
  color: #292929;
  letter-spacing: 0.5px;
}

.page ul li:first-child .q {
  margin-top: 15px;
  padding-top: 0;
  font-weight: 600;
  color: #292929;
  letter-spacing: 0.5px;
}

.title-page .absolute {
  /* bottom: 14.9%; */
  text-align: center;
  left: 0;
  right: 0;
  width: 82%;
  margin: 2% 9%;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute!important;
}

.cta-anim {
  animation: yureru 2s infinite;
  cursor: pointer;
  transform-origin: center;
  position: absolute;
}

/*一番初めのCTA*/
img.cta-anim {
  padding: 1% 3% 7%;
  margin-top: -31%;
}

.lp_result-cv p {
  padding: 0 5%;
  text-align: center;
  font-size: 10px;
}

/* CTAのゆれるアニメーション */
@keyframes yureru {
  0% {
      transform: translate(0px, 2px);
  }
  5% {
      transform: translate(0px, -2px);
  }
  10% {
      transform: translate(0px, 2px);
  }
  15% {
      transform: translate(0px, -2px);
  }
  20% {
      transform: translate(0px, 2px);
  }
  25% {
      transform: translate(0px, -2px);
  }
  30% {
      transform: translate(0px, 0px);
  }
}

.p-fv__inner {
  padding: 16px 12px 12px;
}

.p-fv__lead {
  margin: 2% 0 1% 0;
  text-align: center;
}

.p-fv__lead img {
  max-width: 378px;
  width: 100%;
}

.p-fv__caution {
  background-color: #f6f6f6;
  border-radius: 2.5px;
  /* font-size: 10px; */
  line-height: 1.25;
  padding: 14px 15px 14px;
  margin: 30% 2% 0;
}


/* フッター */
footer {
  width: 100%;
  height: 50%;
  background: #fff;
  text-align: center;
  padding: 10% 0 10% !important;
  display: block;
}

footer img {
  width: 15%;
  height: auto;
  margin-bottom: 5%;
}

footer a {
text-decoration: none;
}

footer a,p {
  color: #333;
  font-size: 1rem;
}
/* フッター */



@media screen and (min-width: 750px) {

  .en {
    color: #c3c3c3;
    font-size: 1.9em;
    font-weight: 800;
    margin-right: 8px;
    font-family: math;
  }

  .q {
    padding: 3% 0 0 7%;
    font-size: 2.5em;
    font-weight: 500;
    text-align: left;
    font-weight: 600;
    color: #292929;
    letter-spacing: 0.5px;
  }
  
  footer a,p {
    font-size: 1.2rem;
  }


}

@media (min-width: 768px) {
  .slick-initialized .slick-slide{
  display: block;
  width: 3%;}
  }