/* ==========================================
   Media Query Mixins
   ========================================== */
main {
  background: var(--bg2);
}

.studio {
  background: var(--br);
  padding: 45rem 10rem 60rem;
}
.studio__ttl {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 38rem;
  width: auto;
}
.studio__ttl-en {
  height: 25rem;
  margin-bottom: 12rem;
}
.studio__ttl-jp {
  color: #FFF;
  font-size: 16rem;
  font-weight: 500;
}
.studio__gallery {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8rem 6rem;
  margin-bottom: 24rem;
}
.studio__gallery-item {
  margin: 0;
}
.studio__gallery-item:first-child {
  grid-column: 1/-1;
}
.studio__gallery-item img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 3rem 6rem rgba(0, 0, 0, 0.16);
}
.studio__info {
  width: 100%;
  padding: 0 5rem;
  margin-bottom: 35rem;
}
.studio__info-inner {
  background: url("../img/studio_info_bg.png") no-repeat center/cover;
  aspect-ratio: 1436/1028;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 18rem;
  gap: 5rem;
}
.studio__info-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.studio__info-item-ttl {
  color: #3B2205;
  font-size: 16rem;
  font-weight: 500;
  line-height: 1.5625;
  margin-bottom: 3rem;
  position: relative;
  width: 100%;
  text-align: center;
}
.studio__info-item-ttl::before, .studio__info-item-ttl::after {
  content: "";
  display: block;
  width: 100rem;
  height: 1rem;
  background: #3B2205;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.studio__info-item-ttl::before {
  left: 0;
}
.studio__info-item-ttl::after {
  right: 0;
}
.studio__info-item-text {
  color: #434444;
  font-size: 12rem;
  line-height: 1.6666666667;
  text-align: center;
}
.studio__map {
  margin-bottom: 60rem;
}
.studio__access {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.studio__access-ttl {
  width: 250rem;
}
.studio__access-ttl img {
  width: 100%;
}
.studio__access-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20rem;
  padding: 0 10rem;
}
.studio__access-item {
  width: 100%;
}
.studio__access-item-ttl {
  color: #fff;
  font-size: 18rem;
  font-weight: 500;
  line-height: 1.3888888889;
  margin-bottom: 8rem;
}
.studio__access-item-text {
  background: #F2E9DC;
  color: #434444;
  font-size: 14rem;
  font-weight: 500;
  line-height: 1.4285714286;
  display: flex;
  align-items: center;
  height: 60rem;
  padding: 0 20rem;
  border-radius: 3rem;
}

.footer {
  padding-top: 70rem;
}

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