@charset "UTF-8";

:root {
  --color-bg: #F7F4E4;
  --color-font: #000000;
}

/*--------------------------------
            CSS Animation
 --------------------------------*/

@keyframes imgMove {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}


/*--------------------------------
            Contents
 --------------------------------*/

#Wrap,.wrapBottom,.wrapTop,.group-detail-area{
  width: 100%;
}

#lp_contents *{
  box-sizing: border-box;
}

#lp_contents{
  font-family:游ゴシック体, "游ゴシック Medium", "Yu Gothic Medium", "Yu Gothic", YuGothic, 'ヒラギノ角ゴシック','Hiragino Sans','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','ヒラギノ角ゴ StdN','Hiragino Kaku Gothic StdN', Meiryo, sans-serif;
  font-family: 'ヒラギノ角ゴシック','Hiragino Sans','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','ヒラギノ角ゴ StdN','Hiragino Kaku Gothic StdN',YuGothic,'Yu Gothic','メイリオ', Meiryo,sans-serif;
  font-feature-settings: "palt";
  text-align: center;

  color: var(--color-font);
  background-color: var(--color-bg);
  position: relative;
  padding-bottom: 8rem;
  overflow: hidden;
}
#lp_contents .sp_only{display: none;}
#lp_contents img{width: 100%;display: block;}
#lp_contents p {
  display: block;
  margin: 0;
  font-size: 1.7rem;
  line-height: 2.5;
  letter-spacing: 0.05em;
}

#lp_contents .mv_wrap{
  margin-bottom: 8rem;
}

#lp_contents .image__loop{
  display: flex;
  gap: 1rem;
  margin-top: 8rem;
}

#lp_contents .image__list{
  display: flex;
  gap: 1rem;
  width: fit-content;

  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-duration: 60s;
  animation-name: imgMove;
}

#lp_contents .image__list img{
  width: 28rem;
}


/*--------------------------------
            Responsive
 --------------------------------*/

@media screen and (max-width: 1600px){
  html {
    font-size: calc(10 * (100vw / 1280));
  }
}

/*--------------------------------
            Layout  SP
 --------------------------------*/
@media (max-width: 767px) {

  html {
    font-size: calc(10 * (100vw / 390));
  }

  #lp_contents{
    padding-bottom: 8rem;
  }

  #lp_contents .sp_only{display: block;}

  #lp_contents p {
    font-size: 1.4rem;
  }

  #lp_contents .mv_wrap{
    margin-bottom: 5rem;
  }

  #lp_contents .image__loop{
    margin-top: 5rem;
  }

  #lp_contents .image__list{
    animation-duration: 45s;
  }

  #lp_contents .image__list img{
    width: 17.5rem;
  }
}