/*
Theme Name: BRT Path
Theme URI: https://brtpath.com/
Author: BRIGHTPATH
Author URI: https://brtpath.com/
Description: 自社サイト用オリジナルテーマ
Version: 1.0
*/

@charset "utf-8";

/* main コンテンツ幅 */
.gallery-container {
  width: 88.888%;
  max-width: 1200px;
  margin: 0 auto;
}

/* galleryコンテンツ */
.gallery-container .work-container {
  gap: 6rem 4rem;
  justify-content: center;
}

.gallery-work-card p:first-of-type {
  margin: 1rem 2rem 0;
  font-weight: 600;
}

.gallery-work-card p:last-of-type {
  margin: .5rem 2rem 1rem;
}


@media screen and (max-width: 1350px) {
  .gallery-work-card {
    flex: 0 0 45%;
  }
}


/*====================================
制作実例 詳細ページの設定
===================================*/
.works-bg {
  background-color: #f5fbff;
  position: relative;
  z-index: 0;
}

.gallery-top-img {
  display: block;
  margin: 0 auto 3rem;
}

.gallery-top-img img {
  margin: 0 auto;
  width: auto;
}

.gallery-title {
  margin-bottom: 0;
}

.gallery-description p {
  margin-top: 2rem;
}

.other-gallery {
  padding-bottom: 10rem;
}

.other-gallery h2 {
  text-align: center;
}

.gallery-mainTitle {
  color: var(--main-color);
  font-weight: 600;
}

.project-block {
  display: flex;
  align-items: center;
  gap: 3rem;
  margin: 2rem 0 8rem;
  flex-wrap: wrap;
}

.project-label {
  background-color: var(--accent-color);
  color: #fff;
  padding: .8rem 2rem;
  font-size: clamp(1.3rem, 2vw, 1.4rem);
  white-space: nowrap;
  font-family: var(--font-en);
}

.project-text {
  font-size: clamp(1.3rem, 2vw, 1.5rem);
}



@media screen and (max-width: 767px) {
  .gallery-container {
    width: 85%;
  }

  .gallery-mainTitle {
    font-size: 1.8rem;
    margin-bottom: 2rem;
    line-height: 1.5;
  }

  .project-block {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    margin-bottom: 4rem;
  }

  .project-label {
    padding: .5rem 1.5rem;
    margin-bottom: 0.5rem;
  }

  .other-gallery .work-card p:last-of-type {
    margin: 0;
  }
}