/* 07_02 */
.pb-100 {
    padding-bottom: 100px;
}
  .header {
        width: 100%;
        max-width: 60%;
        margin: 0 auto;
	    display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px 40px;
        /* border-bottom: 1px solid #eee; */
        background-color: #fff;
        flex-wrap: wrap;
    }

.logo-box a img {
    width: 100%;
    height: auto;
    max-width: 250px;
}

.title-box {
    font-size: 20px;
    font-weight: 700;
    text-align: right;
    color: #333;
}

.highlight {
    color: #ceac60;
}

@media (max-width: 768px) {
    .header {
    	flex-direction: column;
    	align-items: flex-start;
    	gap: 10px;
    	padding: 20px;
	}

	.title-box {
        font-size: 16px;
        text-align: left;
    }
}

      .main-visual {
        position: relative;
        max-width: 100%;
        width: 100%;
        height: auto;
        background-image: url('../images/20th/sample1_bg_v2.png');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
      }

      .main-visual .content {
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
        position: relative;
        z-index: 2;
        color: #111;
        padding: 250px 0 250px 0;
      }

      /* .main-visual .content h1 {
        font-size: 32px;
        font-weight: 600;
        margin: 0;
      }

      .main-visual .content p {
        font-size: 32px;
        color: #ceac60;
        font-weight: 800;
        margin: 0;
      } */

      .main-visual .content img {
        max-width: 500px;
        width: 100%;
        height: auto;
        margin: 20px;
      }

      @media (max-width: 768px) {
        .main-visual .content h1 {
          font-size: 24px;
        }

        .main-visual .content p {
          font-size: 16px;
        }

        .main-visual .content img {
          width: 400px;
        }
      }
      .btn-shadow {
    /* 입체감 그림자 */
    box-shadow:
        4px 4px 10px rgba(0, 0, 0, 0.18),   /* 아래쪽 그림자 */
        -3px -3px 8px rgba(255, 255, 255, 0.5); /* 윗면 하이라이트 */
    transition: all 0.2s ease;
    }

    .btn-shadow:hover {
        box-shadow:
            2px 2px 6px rgba(0, 0, 0, 0.14),
            -2px -2px 6px rgba(255, 255, 255, 0.4);
        transform: translateY(-2px);
    }

    .btn-shadow:active {
        box-shadow:
            1px 1px 3px rgba(0, 0, 0, 0.2),
            -1px -1px 3px rgba(255, 255, 255, 0.3);
        transform: translateY(1px);
    }

      .btn-section {
        position: relative;
        max-width: 100%;
        width: 100%;
        height: 500px;
        background-image: url('../images/20th/btn-section_bg.png');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        text-align: center;
      }
      .btn-box {
        width: 100%;
        max-width: 70%;
        margin: 0 auto;
        display: flex;
        justify-content: space-evenly;
      }
      .btn {
        width: 200px;
        background: linear-gradient(145deg, #e4c98a, #c9a156);
        border-radius: 7px;
      }
      .btn>a {
        display: flex;
        text-decoration: none;
        color: white;
        line-height: 1.2rem;
        text-align: left;
        justify-content: center;
      }
      .btn>a>p {
        font-weight: 700;
      }
       .btn>a>img {
        max-width: 100%;
      }
       .btn>a>p>span {
        font-weight: 500;
        /* margin: 0; */
      }
       @media (max-width: 768px) {
          .btn-box {
            flex-direction: column;
            max-width: 65%;
          }
          .btn {
            width: 300px;
            margin: 5px;
          }
        }
      .btn3 {
        padding: 0 30px;
        background: linear-gradient(145deg, #e4c98a, #c9a156);
        border-radius: 7px;
      }
      .btn3>a {
        display: flex;
        text-decoration: none;
        color: white;
        line-height: 1.2rem;
        text-align: left;
        justify-content: center;
      }
      .btn3>a>p {
        font-weight: 700;
      }
       .btn3>a>p>span {
        font-weight: 500;
        /* margin: 0; */
      }
      .btn-margin {
        margin-top: 5px;
      }
      .btn-margin p {
        margin-top: 20px;
      }
      .btn2 {
        background: linear-gradient(145deg, #e4c98a, #c9a156);
        padding: 15px 30px;
        border-radius: 7px;
        width: 200px;
      }
      .btn2>a {
        display: flex;
        text-decoration: none;
        color: white;
        line-height: 1.2rem;
        justify-content:center;
        text-align: left;
      }
      .btn2>a>p {
        font-weight: 700;
        margin: 0;
      }

        @media (max-width: 768px) {
          .btn-box {
            flex-direction: column;
          }
          .btn2 {
            margin: 5px;
          }
          .btn3>a>p {
            font-size: 20px !important;
          }
        }

      .btn-section h1 {
        color: #ceac60;
        font-weight: 700;
        font-size: 35px;
      }
      .section-20th {
        width: 100%;
        max-width: 100%
      }
      .section-title {
        width: 100%;
        max-width:60%;
        margin: 0 auto;
        display: flex;
        border-bottom: solid 2px #ceac60;
      }
       .section-title img {
        width: 45px;
      }
       .section-title h1{
        font-size: 30px;
        margin: 0 0 0 10px;
        color : #4d4d4d;
      }
      .video-content {
        margin: 30px;
        text-align: center;
      }
      .video-content img {
       max-width: 100%;
      }
      @media (max-width: 768px) {
        .video-content iframe {
          width: 100%;
          height: 300px;
        }
        .section-title {
        max-width:90%;
      }
        .section-title h1{
        font-size: 25px;
      }
      .btn-section {
        padding-bottom: 200px;
      }
      .btn-section h1 {
        font-size: 25px;
      }

      }
      .brochure-content {
        margin: 30px;
        text-align: center;
      }
      .brochure-content img {
       max-width: 70%;
       width: 800px;
      }
      .gallery-content {
        margin: 50px 0;
      }
      .gallery-box {
        display: flex;
        width: 100%;
        justify-content: space-between;
        overflow-x: hidden;
      }
      .gallery-box img {
        width: 24.5%;
        margin: 0 10px 10px 0;
      }

      /* gallery */
      
.gallery-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
  text-align: center;
}

.gallery-section h2 {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.gallery-section .icon {
  width: 24px;
  height: 24px;
}

.gallery-wrapper {
  overflow: hidden;
}

.gallery-row {
  overflow: hidden;
  margin-bottom: 10px;
}

.gallery-track {
  display: flex;
  animation: scroll-horizontal 15s linear infinite;
}

/* .gallery-row:hover .gallery-track,
.gallery-row:active .gallery-track {
  animation-play-state: paused;
} */

.gallery-track img {
  width: 470px;
  height: auto;
  margin-right: 10px;
  object-fit: cover;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
@keyframes scroll-horizontal {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}