/* カスタムスタイル - 二つ目のCSSファイル */

.c-cta {
  position: fixed;
  left: 50%;
  -webkit-transform: translate(-50%);
  transform: translate(-50%);
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 40;
  width: min(100vw, 500px);
}
@media screen and (max-width: 500px) {
  .c-cta {
    bottom: 0vw;
  }
}
@media screen and (max-width: 500px) {
  .c-cta {
    padding-bottom: env(safe-area-inset-bottom);
  }
}
.c-cta__lead {
  font-weight: 600;
  font-size: 12px;
  font-family: "Shippori Mincho", serif;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
 
  border: 1px solid rgba(68, 68, 68, 0.6);
  background-color: #fff;
  border-radius: 50px;
  width: 460px;
  padding: 7px;
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
  top: calc(0.5em + 8px);
  pointer-events: none;
}
.c-cta__lead span {
  @media(max-width: 530px) {
    display: block;
  }
}
@media screen and (max-width: 500px) {
  .c-cta__lead {
    font-size: max(2.8vw, 11px);
    border-radius: 10vw;
    width: 95vw;
  }
  .c-cta__lead span {
  font-size: max(2.8vw, 11px);
}
}
.c-cta__tel {
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 66px;
  height: 60px;
  border-top: 1px solid rgba(68, 68, 68, 0.4);
}
@media screen and (max-width: 500px) {
  .c-cta__tel {
    width: 13.2vw;
  }
}
@media screen and (max-width: 500px) {
  .c-cta__tel {
    height: 12vw;
  }
}
@media screen and (max-width: 500px) {
  .c-cta__tel svg {
    width: 4.4vw;
    height: 4.4vw;
  }
}
.c-cta__tel:hover {
  opacity: 1;
}
.c-cta__button {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 6px;
  padding: 18px 7px;
}
@media screen and (max-width: 500px) {
  .c-cta__button {
    width: 100%;
  }
}
@media screen and (max-width: 500px) {
  .c-cta__button {
    gap: 1.2vw;
  }
}
.c-cta__button.-line {
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#606060),
    to(#414141)
  );
  background: linear-gradient(180deg, #606060 0%, #414141 100%);
  color: #fff;
}
@media screen and (max-width: 500px) {
  .c-cta__button.-line svg {
    width: 4.2vw;
    height: 4vw;
  }
}
.c-cta__button.-web {
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#bda46a),
    color-stop(50%, #d3c383),
    to(#ede7d7)
  );
  background: #CBB78A;
}
@media screen and (max-width: 500px) {
  .c-cta__button.-web svg {
    width: 3.6vw;
    height: 3.6vw;
  }
}
.c-cta__button.-tel {
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#414141),
    to(#606060)
  );
  background: #444;
}
.c-cta__button.-tel p {
  color: #fff;
}
@media screen and (max-width: 500px) {
  .c-cta__button.-tel svg {
    width: 3.6vw;
    height: 3.6vw;
  }
}
.c-cta__button p {
  font-size: 18px;
  color: #664a23;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.02em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-family: "Shippori Mincho", serif;
}
@media screen and (max-width: 500px) {
  .c-cta__button p {
    font-size: 3.6vw;
  }
}
.c-cta__button p span {
  font-size: 20px;
  font-family: "Cormorant Garamond", serif;
  padding-top: 4px;
}
@media screen and (max-width: 500px) {
  .c-cta__button p span {
    font-size: 4vw;
    padding-top: 0.8vw;
  }
}
.c-cta__button:hover {
  opacity: 1;
}
.p-top-cta__img {
  margin-top: 30px;
}
.p-top-cta__img img {
  width: 100%;
  height: 100%;
}

.first-visual>.inner>.content>.vertical-text>.main{
  height: max-content;
  padding: min(14 / 500 * 100vw, 14px) 0 min(10 / 500 * 100vw, 10px);
  font-size: min(36 / 500 * 100vw, 36px);
  line-height: 1.;
}

.first-visual>.inner>.content>.vertical-text {
  padding: min(38 / 500 * 100vw, 38px) 0 0 min(28 / 500 * 100vw, 28px);
  gap: min(8 / 500 * 100vw, 8px);
}

.first-visual>.inner>.content>.vertical-text>.sub{
  margin-left: min(4 / 500 * 100vw, 4px);
  font-size: min(16 / 500 * 100vw, 16px);
  letter-spacing: .16em;
  line-height: 1.5;
  text-shadow: 0 4.163px 7.57px rgba(109, 109, 109, 0.65);
}

.br-500{
  display: none;
  @media(max-width: 500px) {
    display: block;
  }
}
