@charset "UTF-8";
/*
メインビジュアルのCSSファイル
*/
/* 色 */
/* pの行間 */
/* サイドエリアのグリッドサイズ */
/* サイドエリアの幅 */
/* 外周のマージン */
/* メインエリアのグリッドサイズ */
/* タブレットのメインエリア幅 */
/* スマホのヘッダー高さ */
/* セクションの最低高さ */
/* 690px */
/*
@use "./_mixins" as mixins;

@include mixins.mobileView {
}

@include mixins.mobileView {
}
*/
.main-visual {
  height: calc(100svh - 48px);
  position: relative;
  display: flex;
  flex-direction: column;
  margin: 24px 0 24px 0;
}

.main-visal-container {
  height: 100%;
}

.exc {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
}
.exc img {
  width: 100%;
  object-fit: contain;
}
@media screen and (max-width: 1024px) {
  .exc img {
    width: 80%;
    height: 80%;
  }
}

.logo {
  position: absolute;
  bottom: 0;
  right: 0;
}

.main-visual .logo img {
  width: 26px;
}

.m-items {
  display: none;
}

@media screen and (max-width: 1024px) {
  .main-visual {
    align-items: center;
    min-height: calc(100svh - 188px - 24px);
    height: calc(100svh - 188px);
    margin: 0;
    margin-bottom: 16svh;
    padding: 188px 24px 0 24px;
  }
  .main-visal-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
  }
  .logo {
    display: none;
  }
  .exc {
    flex-shrink: 1;
    flex-basis: 0;
    min-width: 0;
    min-height: 0;
  }
  .m-items {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 17px;
    padding-bottom: 24px;
  }
  .m-items .m-place-year-sns {
    display: flex;
    flex-direction: row;
  }
  .m-items .m-logo {
    display: flex;
    justify-content: flex-end;
  }
  .m-items .m-logo img {
    width: 26px;
  }
  .m-items .m-place {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
  .m-items .m-place p {
    line-height: 1.8;
  }
  .m-items .m-year {
    writing-mode: vertical-rl;
    text-orientation: sideways;
    line-height: 1;
    letter-spacing: 0.2em;
    margin-top: 8px;
  }
  .m-items .m-sns {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 17px;
    margin-left: auto;
  }
  .m-items .m-sns .m-sns-x,
  .m-items .m-sns .m-sns-instagram {
    line-height: 1;
  }
  .m-items .m-sns img {
    width: 36px;
    height: 36px;
  }
}

/*# sourceMappingURL=mainvisual.css.map */