/* --------------------------------------------------
Common
-------------------------------------------------- */
#wrapper { padding: 60px 0 0; }

@media screen and (min-width: 1024px) { #wrapper { padding: 66px 0 0; } }
@media screen and (orientation: portrait) { .pc { display: none !important; } }
@media screen and (orientation: landscape) { .sp { display: none !important; } }
/* --------------------------------------------------
Contents
-------------------------------------------------- */
.gallery-top--container { border-bottom: solid 1px #000000; }
.gallery-top--container .gallery-top--titlearea { position: sticky; left: 0; top: 60px; border-top: solid 1px #000000; border-bottom: solid 1px #000000; background: #D2CFC5; display: flex; z-index: 9; }
.gallery-top--container .gallery-top--titlearea h2 { font-family: "Pinyon Script", cursive !important; font-size: 2.6rem; padding: 10px 0 0 15px; width: 30.67%; }
.gallery-top--container .gallery-top--titlearea .gallery-top--plans { padding: 10px 0 10px 20px; flex: 1; font-size: 1.1rem; letter-spacing: .04em; line-height: 1.73; border-left: solid 1px #000000; color: #767676; }
.gallery-top--container .gallery-top--titlearea .gallery-top--plans .gallery-top--plans-list { column-count: 2; counter-reset: number; }
.gallery-top--container .gallery-top--titlearea .gallery-top--plans .gallery-top--plans-list li { counter-increment: number; }
.gallery-top--container .gallery-top--titlearea .gallery-top--plans .gallery-top--plans-list li::before { display: inline; content: counter(number) "."; margin: 0 .25em 0 0; }
.gallery-top--container .gallery-top--titlearea .gallery-top--plans .is-current { color: #1A1311; }
.gallery-top--container .gallery-top--column.title-column { border-bottom: solid 1px #000000; }
.gallery-top--container .gallery-top--column.title-column .gallery-top--imagearea { aspect-ratio: 750 / 938; mix-blend-mode: multiply; }
.gallery-top--container .gallery-top--column.title-column .gallery-top--imagearea img { height: 100%; object-fit: cover; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container { display: flex; align-items: flex-start; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--keywords { width: 30.67%; padding: 10px 15px; font-size: 1.1rem; letter-spacing: .04em; line-height: 1.73; position: sticky; left: 0; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--keywords ul li { color: #767676; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--keywords ul li a { font-size: inherit !important; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container { border-left: solid 1px #000000; flex: 1; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .image-container { position: relative; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .image-container .imagearea { aspect-ratio: 1; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .image-container .imagearea img { height: 100%; object-fit: cover; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .image-container .imagearea:nth-child(2) { position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .textarea { border-top: solid 1px #000000; border-bottom: solid 1px #000000; padding: 8px 0 10px; text-align: center; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .textarea .name { font-family: "Pinyon Script", cursive; font-size: 2.45rem; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .textarea .plan { font-size: .85rem; letter-spacing: .04em; }
.gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single:last-child .textarea { border-bottom: none; }
.gallery-top--container .btn--back { font-size: 1.25rem; letter-spacing: .04em; border-top: solid 1px #000000; }
.gallery-top--container .btn--back a { display: block; height: 50px; padding: 18px 30px 0; }

@media screen and (orientation: landscape) { .gallery-top--container { width: 97.22%; max-width: 1780px; margin: 0 auto; padding: 16px 0 0; border-bottom: none; display: flex; }
  .gallery-top--container .gallery-top--titlearea { position: static; }
  .gallery-top--container .gallery-top--titlearea h2 { font-size: 3rem; padding: 25px 0 0 6.38%; width: 28.94%; }
  .gallery-top--container .gallery-top--titlearea .gallery-top--plans { padding: 20px 0 20px 30px; font-size: 1.2rem; line-height: 1.75; }
  .gallery-top--container .gallery-top--column { position: sticky; left: 0; top: 66px; align-self: flex-start; }
  .gallery-top--container .gallery-top--column.title-column { width: 33.57%; min-width: 400px; position: sticky; left: 0; background: #D2CFC5; border-left: solid 1px #000000; border-right: solid 1px #000000; margin: 0 -1px 0 0; height: calc(100vh - 66px - 16px - 20px); display: flex; flex-direction: column; z-index: 2; }
  .gallery-top--container .gallery-top--column.title-column .gallery-top--imagearea { aspect-ratio: auto; flex: 1; position: relative; }
  .gallery-top--container .gallery-top--column.title-column .gallery-top--imagearea img { position: absolute; left: 0; top: 0; }
  .gallery-top--container .gallery-top--column.title-column::after { display: block; content: ""; position: absolute; width: calc(198.72% + 1px); max-width: calc(97.22vw - 400px); left: 100%; top: 100%; height: 36px; background: #D2CFC5; border-top: solid 1px #000000; }
  .gallery-top--container .gallery-top--column.main-column { flex: 1; border-right: solid 1px #000000; border-left: solid 1px #000000; border-bottom: solid 1px #000000; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container { flex-direction: row-reverse; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--keywords { width: 16.13%; min-width: 150px; padding: 24px 0 24px 3.23%; font-size: 1.2rem; line-height: 2; top: 66px; border-top: solid 1px #000000; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container { border-left: none; border-right: solid 1px #000000; display: flex; flex-wrap: wrap; border-top: solid 1px #000000; margin: 0 0 -1px; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single { box-sizing: content-box; width: calc((100% - 2px) / 3); border-bottom: solid 1px #000000; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .image-container { background: #D2CFC5; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .image-container .imagearea:nth-child(1) { opacity: 0; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .image-container .imagearea:nth-child(2) { opacity: 1; mix-blend-mode: multiply; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .textarea { padding: 9px 0 10px; border-bottom: none; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .textarea .name { font-size: 2.5rem; margin: 0 0 2px; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single .textarea .plan { font-size: 1rem; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single:nth-child(3n-2), .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single:nth-child(3n-1) { border-right: solid 1px #000000; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single:hover .image-container .imagearea:nth-child(1) { opacity: 1; }
  .gallery-top--container .gallery-top--column.main-column .gallery-top--sticky-container .gallery-top--single-container .gallery-top--single:hover .image-container .imagearea:nth-child(2) { opacity: 0; }
  .gallery-top--container .btn--back { font-size: 1.2rem; }
  .gallery-top--container .btn--back a { height: 44px; padding: 15px 4.26% 0; } }
