.gg-container {
  width: 100%;
  max-width: 1056px;
  margin: 0 auto;
  transition: opacity 1s ease;
}

body {
  background-color: #000;
  touch-action: manipulation;
}
.bg {
  position: fixed;
  background: url(/images/2025/bg.webp) center center;
  background-size: cover;
  z-index: -9;
  opacity: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0 auto;
}
.nav {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
}
.nav a {
  margin: 0;
}
.nav .text-logo {
  width: 120px;
}

.text-tit {
  width: 180px;
}
.photo-footer {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px 0;
}

.hidden {
  opacity: 0;
}

.showing {
  opacity: 1 !important;
}
@media (min-width: 768px) {
  .text-tit {
    width: 180px;
  }
}
@media (max-width: 450px) {
  .gg-box {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
}

@media (min-width: 478px) {
  .gg-box img:nth-child(2n):not(:last-of-type) {
    grid-row-end: initial;
  }
}
.gg-box img {
  background: #000;
}
/* 모바일 */
@media (max-width: 768px) {
  .gg-box {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    grid-auto-rows: initial;
    margin: 10px 0;
  }
  .gg-box img {
    height: 50vw;
  }
}

/* 테블릿 CSS - 세로 */

@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .gg-box {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  }
}
/* 테블릿 CSS - 가로 */
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .gg-box {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  }
}
/* 아이패드 프로 */
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) {
  .gg-box {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  }
}