@charset "UTF-8";

@media screen and (max-width:800px) {

  /* グリッドデザインを横並びに設定 */
  .grid {
    grid-template-columns: 1fr;
  }

  /* works-contentsを中央に設定 */
  .works-contents {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: center;
    /* パララックス */
    background-attachment: fixed;
  }

  /* 各セクションの余白設定 */
  .works-section,
  .hope-section {
    padding: 10vh 0;
  }

  .contact-section {
    padding-top: 10vh;
  }

  /* サムネイルの調整 */
  .detail {
    display: block;
  }

  .thumb-caption {
    display: none;
  }

  .thumb-item {
    flex: 0 0 17%;

  }

  footer {
    grid-template-columns: 1fr;
  }


  .profile {
    grid-row: 1 / 2;
    grid-column: 1 / 2;
    text-align: left;
    font-size: 12px;
  }

  .create {
    padding-top: 2vh;
    grid-row: 3 / 4;
    grid-column: 1 / 2;
    font-size: 12px;
  }

  .gratitude {
    padding: 3vh 0;
    text-align: left;
    grid-row: 2 / 3;
    grid-column: 1 / 2;
  }

  .swiper-button-prev,
  .swiper-button-next {
    display: none;
  }

  .swiper-container{
    width: 100%;
  }

  .swiper-slide img {
    width: 99%;
    height: auto;
  }

  .detail-description{
    margin-bottom: 5%;
  }

  .panel{
    display: flex;
    flex-direction: column;
  }

  .form-explanation{
    width: 100%;
    padding-right: 0%;
  }

  form{
    width: 100%;
  }


}