/* BASIC css start */
.container {padding-top: 70px; padding-bottom: 200px;}
.container.store-detail {color: #000;}
.store-detail * {color: inherit; font-size: inherit; font-weight: inherit; line-height: inherit;}
.store-detail .pp-wrap {max-width: 1270px; margin: 0 auto; padding: 0 15px;}
.store-detail img {max-width: 100%;}

.store-detail .tt-wrap {
  position: relative;
  padding-top: 56.25%;
  height: 0;
}
.store-detail .tt-bg::before {
  content: ''; display: block;
  position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  background-repeat: no-repeat; background-position: center; background-size: cover;
  background-image: url(/design/urbanic30/202507/img/store/b-top_bg.jpg);
}
.store-detail .tt-box {
  position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; 
  display: flex; justify-content: center; align-items: center;
}
.store-detail .tt-box h2 {
  font-size: 50px;
  font-weight: 400;
  color: #fff;
}

.st-section.st1 {margin-top: 280px;}
.st-section.st2 {margin-top: 300px;}
.st-section.st3 {margin-top: 350px;}
.st-section.st0 {margin-top: 300px;}

.store-detail .sinfo-mix {
  display: flex;
  align-items: center;
  gap: 80px;
}
.store-detail .sinfo-mix .mix-c1 {
  width: 45%;
}
.store-detail .sinfo-mix .mix-c1 img {
  display: block;
  width: 100%;
}
.store-detail .sinfo-mix .mix-c2 {
  flex-grow: 1;
  font-size: 15px;
  line-height: 1.85;
  text-align: center;
  color: #000;
}


.store-detail .sinfo-img{text-align: center;}
.store-detail .sinfo-full img {display: block; width: 100%;}
.store-detail .sinfo-2col {display: flex; justify-content: center; gap: 60px;}
.store-detail .sinfo-2col .w {flex: 1; max-width: 430px;}
.store-detail .sinfo-2col img {display: block;}
.store-detail .pp,
.store-detail .sinfo-txt {word-break: keep-all;}
.store-detail .o-time {
  margin-top: 90px;
  font-size: 13px;
  line-height: 1.78;
  text-align: center;
  color: #000;
}
.store-detail .o-time strong {display: block;font-size: 16px;}
.store-detail .o-time p {margin-bottom: 1.5em}
.store-detail .o-time .btn_map {text-decoration: underline;}

.store-detail--b .sinfo-mix .mix-c2 .pp {transform: translateX(110px);}
.store-detail--b .sinfo-mix .mix-c2 .h4 {font-size: 20px; font-weight: 300; color: #393737; margin-bottom: 1.5em;}
.store-detail--b .st2 .sinfo-2col {align-items: flex-start; margin-top: 100px;}
.store-detail--b .st3 .sinfo-full {margin-top: 90px;}
.store-detail--b .st2 .sinfo-txt,
.store-detail--b .st3 .sinfo-txt {
  font-size: 15px;
  line-height: 2;
  text-align: center;
}
.store-detail--b .st2 .sinfo-txt {margin-top: 70px; text-align: right;}
.store-detail--b .st3 .sinfo-txt {margin-top: 90px;}
.store-detail .st2 .w.down img {padding-top: 24.1%;}


@media screen and (min-width: 2400px) {
  .store-detail .tt-wrap {padding-top: 0; height: 1200px;}
}

@media screen and (max-width: 1800px) {
  .store-detail .sinfo-mix {gap: 50px;}
  .store-detail .sinfo-mix .mix-c1 {width: 42%;}
  .store-detail--b .sinfo-mix .mix-c2 .pp {transform: translateX(0);}

  .st-section.st1 {margin-top: 13vw;}
  .st-section.st2 {margin-top: 13vw;}
  .st-section.st3 {margin-top: 13vw;}
  .st-section.st0 {margin-top: 17vw;}
  .store-detail--b .st2 .sinfo-2col {margin-top: 100px;}
  .store-detail--b .st2 .sinfo-txt,
  .store-detail--b .st3 .sinfo-txt {margin-top: 100px;}
}

@media screen and (max-width: 900px) {
  .store-detail .pp-wrap {padding: 0 20px;}
  .store-detail .sinfo-mix {display: block;}
  .store-detail .sinfo-mix .mix-c1 {width: 100%; text-align: center;}
  .store-detail .sinfo-mix .mix-c1 img {width: auto; max-width: 100%;}
  .store-detail .sinfo-mix .mix-c2 { margin-top: 50px;}
  .store-detail .sinfo-2col {gap: 30px;}
  .store-detail .sinfo-mix .mix-c2 {font-size: 14px;}
  .store-detail--b .st2 .sinfo-txt,
  .store-detail--b .st3 .sinfo-txt {font-size: 14px;}
  .store-detail--b .sinfo-mix .mix-c2 .h4 {font-size: 18px;}
  .store-detail .o-time {font-size: 13px;}
  .store-detail .o-time strong {font-size: 16px;}
}

@media screen and (max-width: 640px) {
  .store-detail .st-section .mbr {display: none;}
  .store-detail .tt-box h2 {font-size: 26px; letter-spacing: .6px;}
  .store-detail .tt-wrap {padding-top: 0; height: 360px;}
  .store-detail .sinfo-2col {gap: 16px;}
  .store-detail .o-time {margin-top: 60px;}

  .container {padding-top: 50px; padding-bottom: 150px;}
  .st-section.st1 {margin-top: 150px;}
  .st-section.st2 {margin-top: 150px;}
  .st-section.st3 {margin-top: 150px;}
  .st-section.st0 {margin-top: 200px;}
  .store-detail--b .st2 .sinfo-2col {margin-top: 60px;}
  .store-detail--b .st2 .sinfo-txt,
  .store-detail--b .st3 .sinfo-txt {margin-top: 60px;}

  .store-detail .sinfo-mix .mix-c2,
  .store-detail--b .st2 .sinfo-txt,
  .store-detail--b .st3 .sinfo-txt {font-size: 14px; letter-spacing: 0.7px; line-height: 1.7;}
  .store-detail--b .sinfo-mix .mix-c2 .h4 {font-size: 18px; letter-spacing: 0.12em; line-height: 1.417;}
}

/* BASIC css end */

