@charset "utf-8";
/* ------------------- トップイメージ窓 -------------------- */
.s-headingContainer--service {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.s-headingContainer--service::after{
  content: "";
  background: hsla(0, 0%, 100%, 0.8);
  width: 100%;
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.s-heading {
  font-size: var(--FZ_25);
  font-weight: 700;
  width: fit-content;
  margin-inline: auto;
  border-bottom: 5px solid var(--YELLOW01);
  line-height: 1.4;
  padding-bottom: 3px;
  letter-spacing: .2em;
  z-index: 2;
  margin-bottom: var(--GAP_30);
}
.s-heading__caption {
  font-size: var(--FZ_18);
  text-align: center;
  z-index: 3;
}
.s-heading__en {
  max-width: 400px;
  position: absolute;
  transform: translateX(-50%);
  z-index: 2;
}
.s-heading__labels {
  display: flex;
  gap: var(--GAP_20);
  width: 90%;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
@media screen and (min-width: 768px){
  .s-headingContainer--service {
    height: 38vw;
    max-height: 470px;
  }
  .s-heading__en {
    width: 36%;
    left: calc(50% + 15vw);
    transform: translateX(-50%);
    bottom: 22%;
  }
  .s-headingContainer--service::after{
    height: 45%;
  }
  .s-headingContainer--mado {
    background: url(../images/service/ttl_img_mado.jpg) no-repeat;
    background-size: cover;
  }
  .s-headingContainer--door {
    background: url(../images/service/ttl_img_door.jpg) no-repeat;
    background-size: cover;
  }
  .s-headingContainer--exterior {
    background: url(../images/service/ttl_img_exterior.jpg) no-repeat;
    background-size: cover;
  }
  .s-heading__labels {
    max-width: 530px;
    bottom: -110px;
  }

}
@media screen and (max-width: 767px){
  .s-headingContainer--service {
    height: 385px;
  }
  .s-heading__en {
    width: 55%;
    max-width: 300px;
    left: 70%;
    bottom: 25%;
  }
  .s-headingContainer--service::after{
    height: 56%;
  }
  .s-headingContainer--mado {
    background: url(../images/service/sp/ttl_img_mado.jpg) no-repeat;
    background-size: cover;
  }
  .s-headingContainer--door {
    background: url(../images/service/sp/ttl_img_door.jpg) no-repeat;
    background-size: cover;
  }
  .s-headingContainer--exterior {
    background: url(../images/service/sp/ttl_img_exterior.jpg) no-repeat;
    background-size: cover;
  }
  .s-heading__labels {
    max-width: 400px;
    bottom: -50px;
  }

}
/* ------------------- お悩み -------------------- */
.s-worryHeading {
  text-align: center;
  font-size: var(--FZ_20);
  font-weight: 700;
  position: relative;
  margin-bottom: var(--GAP_60);
}
.s-worryHeading::before{
  content: "";
  background: url(../images/service/icon_light.svg) no-repeat;
  background-size: contain;
  width: 25px;
  height: 35px;
  display: block;
  margin: 0 auto var(--GAP_30);
}
.s-worryHeading span{
  background: url(../images/common/line_dot.svg) repeat-x left bottom;
  background-size: 200px;
}
.s-worry {
  display: flex;
  flex-wrap: wrap;
}
.s-worry__img {
  margin-bottom: var(--GAP_10);
}
.s-worry__ttl {
  font-size: var(--FZ_14);
}
@media screen and (min-width: 768px){
  .s-worrySection{
    padding: calc( var(--GENERALSEC) * 1.7 ) 0 var(--GENERALSEC);
  }
  .s-worryHeading span{
    padding: 0 5px 10px;
  }
  .s-worry {
    gap: var(--GAP_80) calc(20% / 3);
  }
  .s-worry li {
    width: 20%;
  }
  .s-worry__ttl {
    text-align: center;
  }

}
@media screen and (max-width: 767px){
  .s-worrySection{
    padding: calc( var(--GENERALSEC) * 1.5 ) 0 var(--GENERALSEC);
  }
  .s-worryHeading span{
    padding: 0 5px 5px;
    line-height: 2;
  }
    .s-worry {
    gap: var(--GAP_40) 5%;
  }
  .s-worry li {
    width: 30%;
  }

}
/* ------------------- リフォーム -------------------- */
.s-reformSection {
  background: var(--YELLOW03);
}
.s-reformHeading {
  font-size: var(--FZ_25);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .2em;
  text-align: center;
  margin-bottom: var(--GAP_80);
  position: relative;
}
.s-reformHeading span{
  position: relative;
}
.s-reformHeading span::before,
.s-reformHeading span::after{
  content: "";
  width: 30px;
  height: 30px;
  display: inline-block;
  position: absolute;
}
.s-reform {
  background: var(--WHITE);
  box-shadow: 0 0 10px rgba(235, 219, 71, 0.6);
  display: grid;
  margin-bottom: var(--GAP_80);
}
.marker{
  background: linear-gradient(transparent 50%, var(--YELLOW01) 50%);
}
.s-reform__img {
  margin-bottom: 5px;
}
.s-reform__ttl {
  text-align: center;
  font-size: var(--FZ_18);
  font-weight: 700;
  line-height: 1.4;
}
.s-reform__txt{
  font-size: var(--FZ_14);
}
.s-reform__award--ttl {
  text-align: center;
  font-size: var(--FZ_25);
  margin-inline: auto;
  margin-bottom: var(--GAP_30);
  width: fit-content;
  position: relative;
}
.s-reform__award--ttl::before,
.s-reform__award--ttl::after{
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 56px;
}
.s-reform__award--ttl::before{
  background: url(../images/common/deco-line-left.svg) no-repeat;
  background-size: contain;
}
.s-reform__award--ttl::after{
  background: url(../images/common/deco-line-right.svg) no-repeat;
  background-size: contain;
}
.s-reform__award--img{
  max-width: 724px;
  margin-inline: auto;
  margin-bottom: var(--GAP_50);
}
.s-reform__list-wrap {
  width: 90%;
  max-width: 740px;
  margin-inline: auto;
  background: #fff;
}
.s-reform__award--spon {
  font-weight: bold;
  margin-block: var(--GAP_30) var(--GAP_20);
  font-size: var(--FZ_20);
}
.s-reform__award--spon:first-of-type{
  margin-top: 0;
}
.s-reform__award--list li {
  line-height: 1.4;
  list-style-type: disc;
  margin-left: 1em;
}
.s-reform__award--list li:not(:last-child) {
  margin-bottom: 10px;
}

@media screen and (min-width: 768px){
  .s-reform {
    padding: var(--GAP_50);
    border-radius: 30px;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--GAP_30);
  }
  .s-reform__ttl {
    margin-bottom: var(--GAP_10);
  }
  .s-reformHeading span::before{
    background: url(../images/service/kakko_l.svg) no-repeat;
    background-size: contain;
    left: -1.5em;
    top: -1em;
  }
  .s-reformHeading span::after{
    background: url(../images/service/kakko_r.svg) no-repeat;
    background-size: contain;
    right: -1.5em;
    bottom: -1em;
  }
  .s-reform__award--ttl::before{
    left: -1em;
  }
  .s-reform__award--ttl::after{
    right: -1em;
  }
  .s-reform__list-wrap {
    padding: var(--GAP_40);
    border-radius: 30px;
  }
  .s-reform__award--list li {
    font-size: var(--FZ_16);
  }
}
@media screen and (max-width: 767px){
  .s-reform {
    padding: var(--GAP_30) var(--GAP_20);
    border-radius: 20px;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--GAP_20);
  }
  .s-reform__ttl {
    margin-bottom: var(--GAP_15);
  }
.s-reformHeading span::before{
    background: url(../images/service/kakko_l.svg) no-repeat;
    background-size: contain;
    left: -1em;
    top: -1em;
  }
  .s-reformHeading span::after{
    background: url(../images/service/kakko_r.svg) no-repeat;
    background-size: contain;
    right: -3.2em;
    bottom: -1em;
  }
  .s-reform__award--ttl::before{
    left: -1.5em;
  }
  .s-reform__award--ttl::after{
    right: -1.5em;
  }
  .s-reform__list-wrap {
    padding: var(--GAP_30);
    border-radius: 20px;
  }
  .s-reform__award--list li {
    font-size: var(--FZ_15);
  }
}

/* ------------------- サービス一覧 -------------------- */
.s-serviceSection{
  background: var(--YELLOW02);
}
.s-service {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.s-service li a {
  background: var(--WHITE);
  border-radius: 50%;
  aspect-ratio: 1 / 1;
  display: flex;
  flex-direction: column;
  text-align: center;
  position: relative;
  padding-top: var(--GAP_30);
}
.s-service__img {
  max-width: 140px;
  margin-inline: auto;
}
.s-service__ttl{
  font-size: var(--FZ_15);
  font-weight: 700;
}
.s-service__ttl span {
  border-bottom: 2px solid var(--YELLOW01);
  padding-bottom: 2px;
}
.s-service__sub{
  font-size: var(--FZ_10);
  line-height: 2;
}
.s-service li a::after {
  content: "";
  background: url(../images/common/arrow_yw.svg) no-repeat;
  background-size: contain;
  display: inline-block;
  width: 18px;
  height: 22px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px){
  .s-service {
    gap: var(--GAP_20);
  }
  .s-service--door {
    padding: 0 10%;
  }
  .s-service li {
    width: 22%;
    max-width: 235px;
  }
  .s-service li a::after {
    bottom: var(--GAP_20);
  }
  .s-service--door li {
    width: 30%;
  }
  .s-service__img {
    width: 60%;
  }

}
@media screen and (max-width: 767px){
  .s-service {
    gap: var(--GAP_20) 4%;
  }
  .s-service li {
    width: 48%;
    max-width: 170px;
  }
  .s-service li a::after {
    bottom: var(--GAP_10);
  }
  .s-service__img {
    width: 50%;
  }
  .s-service__sub{
    letter-spacing: 0;
  }

}
/* ------------------- シミュレーション -------------------- */
.s-simulationSection {
    background: var(--YELLOW02);
}
.s-simulationSection .g-heading__ja{
	font-size: var(--FZ_22);
}
.s-simulationContainer {
  background: var(--WHITE);
  border: 4px solid var(--YELLOW01);
  position: relative;
}
.s-simulation--img {
  width: 20%;
  max-width: 130px;
  position: absolute;
  right: 3%;
}
.g-btn--hikone {
  margin-bottom: 15px;
}
@media screen and (min-width: 768px){
	.s-simulationContainer {
    padding: var(--GAP_50);
    border-radius: 30px;
    gap: var(--GAP_30);
	}
	.s-simulation--text {
    width: 65%;
    margin-inline: auto;
	}
	.s-simulation--img {
	  top: 50%;
	  transform: translateY(-50%);
	}
	.s-simulationSection .g-btn{
		max-width: 350px;
	}

}
@media screen and (max-width: 767px){
	.s-simulationContainer {
    padding: var(--GAP_30) var(--GAP_20);
    border-radius: 20px;
    gap: var(--GAP_20);
	}
	.s-simulation--img {
	  top: 23%;
	  transform: translateY(-50%);
	}
	.s-simulationSection .g-btn > a{
		padding: 5px 0;
	}

}

/* ------------------- 対応エリア -------------------- */
.s-areaSection{
  background: var(--BLUE02);
}
.s-areaContainer {
  border: 4px solid var(--BLUE01);
  background: var(--WHITE);
  display: flex;
  align-items: center;
}
.s-areaContainer .g-headingContainer {
  margin: 0;
  text-align: center;
}
.g-heading__icon {
  width: 25%;
  max-width: 36px;
  margin: 0 auto 20px;
}
.s-heading__cap {
  font-size: var(--FZ_15);
}
.s-areaSection .s-heading__cap {
  text-align: left;
}

@media screen and (min-width: 768px){
  .s-areaContainer {
    padding: var(--GAP_50);
    border-radius: 30px;
    gap: var(--GAP_30);
  }
  .s-heading__cap {
    margin-top: var(--GAP_50);
  }
  .s-areaContainer .g-headingContainer {
    width: 50%;
  }
  .s-areaContainer .s-area--img {
    width: 50%;
  }

}
@media screen and (max-width: 767px){
  .s-areaContainer {
    flex-direction: column;
    padding: var(--GAP_30) var(--GAP_20);
    border-radius: 20px;
    gap: var(--GAP_20);
  }
  .s-heading__cap {
    margin-top: var(--GAP_50);
  }
}
/* ------------------- スタッフ -------------------- */
.s-staffSection {
  background: var(--YELLOW03);
  position: relative;
  overflow: hidden;
}
.s-staffContainer {
  background: var(--YELLOW03);
}
.bg-stripe{
  position: relative;
  overflow: hidden;
}
.s-staff {
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 2;
}
.s-staff__ttl {
  font-size: var(--FZ_18);
  text-align: center;
  color: var(--BLUE01);
  font-weight: 700;
  margin-bottom: var(--GAP_15);
}
.s-staff__ttl--en {
  display: block;
  font-size: var(--FZ_11);
}
.s-staff__txt{
  font-size: var(--FZ_13);
}
@media screen and (min-width: 768px){
  .s-staff {
    gap: var(--GAP_80);
  }
  .s-staff li {
    width: 30%;
  }
  .s-staff__img {
    margin-bottom: var(--GAP_10);
  }
  .bg-stripe::after {
    content: "";
    background: url(../images/common/bg_stripe.svg) repeat-x;
    background-size: contain;
    display: inline-block;
    width: 1440px;
    height: 50%;
    position: absolute;
    top: 53%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

}
@media screen and (max-width: 767px){
  .s-staff {
    flex-direction: column;
    gap: var(--GAP_60);
  }
  .s-staff li {
    display: flex;
    gap: var(--GAP_30);
    position: relative;
  }
  .s-staff__img {
    width: 35%;
    max-width: 120px;
    z-index: 2;
  }
  .s-staff--txtContainer {
    flex: 1;
    z-index: 2;
  }
  .s-staff li::after {
    content: "";
    background: url(../images/common/sp/bg_stripe.svg) repeat-x;
    background-size: contain;
    display: inline-block;
    width: 45%;
    max-width: 170px;
    height: 140px;
    position: absolute;
    left: -7%;
    top: 50%;
    transform: translateY(-50%);
  }

}
/* ------------------- 施工までの流れ -------------------- */
.s-processSection {
  background: var(--BLUE03);
}
.s-processContainer {
  border: 4px solid var(--BLUE01);
  background: var(--WHITE);
}
.s-process__num {
  font-weight: 700;
  text-align: center;
  color: var(--BLUE01);
}
.s-process__ttl {
  font-size: var(--FZ_16);
  background: var(--BLUE05);
  color: var(--WHITE);
  text-align: center;
}
.s-process li:last-child .s-process__ttl{
  background: var(--YELLOW01);
  color: var(--TXT_COLOR_BASE);
}
.s-process li{
  position: relative;
}
.s-process li::after {
  content: "";
  display: inline-block;
  position: absolute;
}
.s-process li:last-child::after{
  content: none;
}
@media screen and (min-width: 768px){
  .s-processContainer {
    padding: var(--GAP_50);
    border-radius: 30px;
  }
  .s-processSection .s-heading__cap{
    text-align: center;
  }
  .s-process__num {
    font-size: var(--FZ_25);
    margin-bottom: 10px;
  }
    .s-process {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--GAP_50);
  }
  .s-process__ttl {
    width: 75%;
    margin: 0 auto 10px;
    line-height: 1.4;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 150px;
  }
  .s-process li::after {
    background: url(../images/common/arrow_blue.svg) no-repeat center;
    background-size: contain;
    width: 10px;
    height: 16px;
    top: 37%;
    right: -15px;
  }
  .s-process__txt {
    font-size: var(--FZ_14);
  }
}
@media screen and (max-width: 767px){
  .s-processContainer {
    padding: var(--GAP_30) var(--GAP_20);
    border-radius: 20px;
  }
  .s-process li {
    display: flex;
    flex-wrap: wrap;
  }
  .s-process li:not(:last-child){
    margin-bottom: var(--GAP_60);
  }
  .s-process__num {
    width: 33%;
    border-radius: 10px 0 0 10px;
    border: 2px solid var(--BLUE05);
    font-size: var(--FZ_18);
  }
  .s-process__ttl {
    flex: 1;
    border-radius: 0 10px 10px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .s-process__txt {
    width: 100%;
    font-size: var(--FZ_14);
    padding: var(--GAP_10) 0;
  }
  .s-process li::after {
    background: url(../images/common/sp/arrow_blue.svg) no-repeat center;
    background-size: contain;
    width: 20px;
    height: 12px;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
  }
  .s-process li:last-child .s-process__num {
    border: 2px solid var(--YELLOW01);
  }
}
/* ------------------- お客様の声 -------------------- */
.s-voiceSection{
  background: var(--BEIGE);
}
.s-voice{
  display: flex;
  flex-direction: column;
  gap:var(--GAP_30);
}
.s-voice > li a{
  display: flex;
  gap:var(--GAP_30);
  border: 4px solid var(--BLUE01);
  background: var(--WHITE);
}
.s-voice__thumb {
  width: 25%;
  max-width: 210px;
  border-radius: 10px;
}
.s-voice__ttl {
  font-weight: 700;
  font-size: var(--FZ_18);
}
.s-voice__ttl span {
  font-size: var(--FZ_20);
  color: var(--BLUE01);
}
.s-voice__list--ttl{
  font-size: var(--FZ_12);
  font-weight: 700;
  background: var(--YELLOW02);
  padding: 5px 10px;
  margin-bottom: 5px;
  width: fit-content;
  border-radius: 5px;
  line-height: 1.3;
}
.s-voice__list--txt{
  font-size: var(--FZ_14);
}
.s-voice__list li:not(:last-child) {
  margin-bottom: var(--GAP_15);
}
@media screen and (min-width: 768px){
  .s-voice > li a{
    padding: var(--GAP_50);
    border-radius: 30px;
  }
  .s-voice > li:nth-of-type(even) a{
    flex-direction: row-reverse;
  }
  .s-voice--infoContainer {
    flex: 1;
  }
  .s-voice__ttl {
    margin-bottom: var(--GAP_20);
  }
  .s-voice__ttl span {
    margin-right: 2em;
  }

}
@media screen and (max-width: 767px){
  .s-voice > li a{
    padding: var(--GAP_30) var(--GAP_20);
    border-radius: 20px;
    flex-wrap: wrap;
  }
  .s-voice--infoContainer {
    display: contents;
  }
  .s-voice__ttl {
    flex: 1;
    line-height: 1.4;
  }
  .s-voice__ttl span {
    display: block;
    margin-bottom: 5px;
  }
}
/* ------------------- よくある質問 -------------------- */
.s-faq{
  font-size: var(--FZ_15);
}
.s-faq dt,
.s-faq dd{
  letter-spacing: .15em;
  line-height: 1.8;
  position: relative;
}
.s-faq dt {
  margin-bottom: 5px;
}
.s-faq dd:not(:first-child) {
  margin-bottom: var(--GAP_40);
}
.s-faq dt::before,
.s-faq dd::before{
  display: inline-block;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 2px;
  left: 0;
}
.s-faq dt::before{
  content: "Q";
  background: var(--YELLOW01);
}
.s-faq dd::before{
  content: "A";
  background: var(--BLUE01);
  color: var(--WHITE);
}

@media screen and (min-width: 768px){
  .s-faq dt,
  .s-faq dd{
    padding: 15px 0 15px 5em;
  }
  .s-faq dt::before,
  .s-faq dd::before{
    font-size: var(--FZ_28);
    width: 50px;
    height: 50px;
    font-weight: 700;
    letter-spacing: 0;
  }

}
@media screen and (max-width: 767px){
  .s-faq dt,
  .s-faq dd{
    padding: 10px 0 10px 4em;
  }
  .s-faq dt::before,
  .s-faq dd::before{
    font-size: var(--FZ_25);
    width: 35px;
    height: 35px;
  }
}

/* ------------------- エクステリアトップ -------------------- */
.s-heading__label {
  width: 100%;
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 2;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.s-heading__label li{
  font-size: var(--FZ_15);
  background: var(--WHITE_OP90);
}
@media screen and (min-width: 768px){
  .s-headingContainer--exterior .s-heading__en{
    bottom: 20%;
  }
  .s-heading__label {
    gap: var(--GAP_20);
    bottom: var(--GAP_30);
  }
  .s-heading__label li{
    padding: 10px 30px;
  }

}
@media screen and (min-width: 1201px){
  .s-heading__en {
    left: calc(50% + 210px);
  }
}
@media screen and (max-width: 767px){
  .s-heading__label {
    gap: var(--GAP_10);
    bottom: var(--GAP_30);
  }
  .s-heading__label li{
    padding: 5px 10px;
  }

}
/* ------------------- エクステリアサービス一覧 -------------------- */
.s-ExteriorAnc {
  display: grid;
}
.s-ExteriorAnc li{
  border: 2px solid var(--YELLOW01);
  border-radius: 5px;
  text-align: center;
  position: relative;
}
.s-ExteriorAnc__ttl a{
  display: grid;
  place-items: center;
  font-size: var(--FZ_15);
  font-weight: 700;
  line-height: 1.2;
  min-height: 60px;
}
.s-ExteriorAnc__ttl::after{
  content: "";
  background: url(../images/common/arrow_gr_dw.svg) no-repeat;
  background-size: contain;
  display: inline-block;
  width: 10px;
  height: 6px;
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  transition: .5s;
}
.s-serviceExteriorListContainer{
  background: var(--YELLOW02);
}
.s-serviceExteriorList {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: var(--GAP_30);
}
.s-serviceExteriorList > li{
  display: flex;
  flex-wrap: wrap;
  gap: var(--GAP_30);
  background: var(--WHITE);
  box-shadow: 0 0 10px rgba(235, 219, 71, 0.6);
}
.s-serviceExteriorList--wrap {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: var(--GAP_20);
}
.s-serviceExteriorList__ttl {
  font-size: var(--FZ_25);
  font-weight: 700;
  line-height: 1.4;
}
.s-serviceExteriorList__ttl span{
  border-bottom: 3px solid var(--YELLOW01);
}
.s-serviceExteriorList--wrap .g-btnContainer{
  width: 100%;
  margin-top: 10px;
}
.s-serviceExteriorList__subttl {
  font-size: var(--FZ_15);
  font-weight: 700;
  background: var(--BLUE02);
  border-radius: 5px;
  text-align: center;
  padding: 5px;
  line-height: 1.4;
  margin-bottom: var(--GAP_10);
}
.s-serviceExteriorList__service,
.s-serviceExteriorList__point{
  font-size: var(--FZ_15);
  padding: 0 5px;
}
.s-serviceExteriorList__service li::before{
  content: "";
  background: var(--BLUE01);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-right: .5em;
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 2px;
}

@media screen and (min-width: 768px){
  .s-ExteriorAnc {
    gap: var(--GAP_10);
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    grid-template-rows: auto;
  }
    .s-ExteriorAnc li a:hover{
    background: var(--YELLOW01);
    opacity: 1;
    transition: .5s;
  }
  .s-serviceExteriorList > li {
    padding: var(--GAP_50);
    border-radius: 30px;
    gap: var(--GAP_30);
  }
  .s-serviceExteriorList--spWrap{
    display: contents;
  }
  .s-serviceExteriorList__img {
    width: 40%;
    max-width: 400px;
  }
  .s-serviceExteriorList__img img{
    border-radius: 20px;
  }
  .s-serviceExteriorList__ttl {
    width: 100%;
  }
  .s-serviceExteriorList--serviceWrap {
    width: 30%;
  }
  .s-serviceExteriorList--pointWrap {
    flex: 1;
  }
  .s-ExteriorAnc__ttl:hover::after{
    background: url(../images/common/arrow_bk_dw.svg) no-repeat;
    background-size: contain;
  }

}
@media screen and (max-width: 767px){
  .s-ExteriorAnc {
    gap: var(--GAP_10);
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    grid-template-rows: auto;
  }
  .s-serviceExteriorList > li {
    padding: var(--GAP_35) var(--GAP_30);
    border-radius: 20px;
    gap: var(--GAP_20);
  }
  .s-serviceExteriorList__img img{
    border-radius: 10px;
  }
  .s-serviceExteriorList--pointWrap {
    width: 100%;
  }
  .s-serviceExteriorList__ttl {
    margin-bottom: var(--GAP_30);
  }

}
@media (min-width:415px) and (max-width:767px) {
  .s-serviceExteriorList__img {
    width: 50%;
  }
  .s-serviceExteriorList--spWrap{
    flex: 1;
  }
  .s-serviceExteriorList--wrap {
    display: contents;
  }
  .s-serviceExteriorList--serviceWrap{
    flex: 1;
  }
}
@media screen and (max-width: 414px){
  .s-serviceExteriorList--wrap{
    display: contents;
  }
  .s-ExteriorAnc {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
  .s-serviceExteriorList > li {
    flex-direction: column;
  }
  .s-serviceExteriorList--serviceWrap{
    width: 100%;
  }
  .s-serviceExteriorList__ttl {
    text-align: center;
  }

}
/* ------------------- エクステリア施工事例 -------------------- */
.tab-wrap--exterior .tab-nav{
  display: grid;
  border: none;
}
.tab-wrap--exterior .tab-nav li{
  display: grid;
  place-items: center;
  font-size: var(--FZ_15);
  font-weight: 700;
  line-height: 1.2;
  min-height: 60px;
  border-radius: 5px;
  text-align: center;
  position: relative;
}
@media screen and (min-width: 768px){
  .tab-wrap--exterior .tab-nav {
    gap: var(--GAP_10);
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    grid-template-rows: auto;
    margin-bottom: var(--GAP_30);
  }
}
@media screen and (max-width: 767px){
  .tab-wrap--exterior .tab-nav {
    gap: var(--GAP_10);
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    grid-template-rows: auto;
  }

}
@media screen and (max-width: 414px){
  .tab-wrap--exterior .tab-nav {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }

}
/* ------------------- サービス一覧 -------------------- */
.s-headingContainer--common {
  background: var(--BLUE02);
}
.s-headingContainer--common .g-headingContainer{
  margin: 0;
}
.s-serviceIntroSection{
  background: var(--YELLOW03);
  padding-bottom: var(--GENERALSEC);
}
.s-serviceIntro--caption {
  font-size: var(--FZ_16);
  background: var(--WHITE);
}
.s-serviceIntro--content {
  background: var(--WHITE);
  box-shadow: 0 0 10px rgba(235, 219, 71, 0.6);
}
.s-serviceIntro-headingContainer {
  width: 90%;
  max-width: var(--PC_MAX_WIDTH_S);
  margin-inline: auto;
  display: flex;
}
.s-serviceIntro--wrap{
  background: var(--YELLOW01);
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
}
.s-serviceIntro__ttl {
  width: fit-content;
  background: var(--WHITE);
  padding: 5px 10px;
  line-height: 1.4;
  font-weight: 700;
  margin-bottom: var(--GAP_20);
}
.s-serviceIntro__caption {
  padding: 0 10px;
  font-size: var(--FZ_16);
}
.s-serviceIntro__en {
  width: 70%;
  position: absolute;
}
.s-serviceIntro__subttl {
  font-size: var(--FZ_25);
  text-align: center;
  width: fit-content;
  margin-inline: auto;
  margin-bottom: var(--GAP_20);
}
.s-serviceIntro__subttl::before,
.s-serviceIntro__subttl::after{
  content: "";
  width: 9px;
  height: 26px;
  display: inline-block;
  line-height: 1.4;
  vertical-align: middle;
}

.s-serviceIntro__subttl::before{
  background: url(../images/common/line-l.svg) no-repeat;
  background-size: contain;
  margin-right: .3em;
}
.s-serviceIntro__subttl::after{
  background: url(../images/common/line-r.svg) no-repeat;
  background-size: contain;
  margin-left: .3em;
}
.s-serviceIntro__txt {
  font-size: var(--FZ_16);
}
.g-btn--arrow.s-btn--faq > a::after{
  background: url(../images/common/arrow_faq.svg) no-repeat;
  background-size: contain;
  top: 35%;
  width: var(--FZ_25);
  height: var(--FZ_25);
}

@media screen and (min-width: 768px){
  .s-serviceIntro-headingContainer {
    margin-top: clamp(-70px, -8vw, -100px);
  }
  .s-serviceIntro--caption {
    text-align: center;
    padding: var(--GENERALSEC_HALF) 0 calc(var(--GENERALSEC)* 1.4);
    line-height: 2;
}
  .s-serviceIntro__en {
    max-width: 350px;
    right: -60px;
    bottom: var(--GAP_30);
  }
  .s-serviceIntro--wrap{
    padding: 0 var(--GAP_40);
  }
  .s-serviceIntro__ttl {
    font-size: var(--FZ_25);
  }
  .s-serviceIntro--wrap,
  .s-serviceIntro__img {
    width: 50%;
  }
  .s-serviceIntro--content {
    padding: calc(var(--GENERALSEC)* 1.3) var(--GAP_50) var(--GAP_80);
    margin-top: clamp(-70px, -8vw, -100px);
    border-radius: 30px;
  }
  .s-serviceIntro > li:not(:last-child) .s-serviceIntro--content{
    margin-bottom: calc(var(--GENERALSEC)* 1.5);
  }
  .g-btn--arrow.s-btn--faq{
    max-width: 500px;
  }
  .g-btn--arrow.s-btn--faq .g-btn__label{
    font-size: var(--FZ_18);
  }
  .g-btn--arrow.s-btn--faq a{
    background: url(../images/common/icon_faq.svg) no-repeat left 4% top -5px,var(--YELLOW01);
    background-size: auto 105%;
    border-radius: 25px;
    min-height: clamp(70px,7vw,80px);
  }
}
@media screen and (max-width: 767px){
  .s-serviceIntroSection{
    overflow: hidden;
  }
    .s-serviceIntro--caption {
    padding: var(--GENERALSEC_HALF) 5% calc(var(--GENERALSEC)*1.3);
    text-align: center;
    line-height: 2;
  }
  .s-serviceIntro__en {
    max-width: 300px;
    right: -10%;
    bottom: -10px;
  }
  .s-serviceIntro-headingContainer {
    flex-direction: column-reverse;
    margin-top: -30px;
  }
  .s-serviceIntro--wrap {
    padding: var(--GAP_35) 5%;
    width: 75%;
    max-width: 350px;
    margin: -30px auto 0 7%;
  }
  .s-serviceIntro__ttl {
    font-size: var(--FZ_20);
  }
  .s-serviceIntro--content {
    padding: calc(var(--GENERALSEC)* 4.7) var(--GAP_20) var(--GAP_60);
    margin-top: calc(var(--GENERALSEC)* -4);
    border-radius: 20px;
  }
  .s-serviceIntro > li:not(:last-child) .s-serviceIntro--content{
    margin-bottom: calc(var(--GENERALSEC)* 2);
  }
  .s-serviceIntro__img {
    width: 85%;
    margin: 0 -5.5% 0 auto;
  }
  .g-btn--arrow.s-btn--faq{
    width: 90%;
    max-width: 500px;
  }
  .g-btn--arrow.s-btn--faq a{
    background: url(../images/common/icon_faq.svg) no-repeat left 5px top 8px,var(--YELLOW01);
    background-size: auto 80%;
    min-height: clamp(70px, 12vw, 80px);
    border-radius: 25px;
  }
  .g-btn--arrow.s-btn--faq .g-btn__label{
    font-size: var(--FZ_18);
  }

}
/* ------------------- 店舗紹介 -------------------- */
.tab-wrap--shop .tab-nav {
  border-bottom: 4px solid var(--YELLOW01);
}
.tab-wrap--shop .tab-nav li {
  border: 4px solid var(--YELLOW01);
  border-bottom: none;
  position: relative;
}
.tab-wrap--shop .tab-btn.show{
  background: var(--YELLOW01);
}
.tab-wrap--shop .tab-btn.show::before{
  content: "";
  background: url(../images/shop/arrow.svg) no-repeat;
  background-size: contain;
  display: inline-block;
  position: absolute;
  bottom: -17px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
.s-tab-btn__img {
  margin-bottom: var(--GAP_10);
}
.s-tab-btn__ttl{
  text-align: center;
}
.s-tab-btn__ttl span {
  font-weight: 700;
  color: var(--BLUE01);
}
.tab-contents--wrap{
  background: var(--YELLOW03);
}
.s-shop {
  background: var(--WHITE);
}
.s-shop--wrap {
  display: flex;
  gap: var(--GAP_30);
}
.s-shop__ttl {
  background: var(--YELLOW01);
  text-align: center;
  font-size: var(--FZ_30);
  color: var(--BLUE01);
  font-weight: 700;
  padding: 10px 0;
  letter-spacing: .15em;
}
.s-shop__img {
  display: flex;
}
.s-shop--wrap {
  display: flex;
}
.s-shop__table {
  border-collapse: collapse;
}
.s-shop__table th,
.s-shop__table td{
  padding: 15px 1em 15px 2em;
  text-align: left;
}
.s-shop__table th{
  font-size: var(--FZ_15);
  font-weight: 700;
  background: var(--BLUE02);
  border-bottom: 1.5px solid var(--WHITE);
}
.s-shop__table td{
  font-size: var(--FZ_14);
  border-bottom: 1.5px solid #D1D1D1;
}
.s-shop__table--map span {
  background: var(--YELLOW01);
  font-size: var(--FZ_10);
  line-height: 1;
  padding: 2px 5px;
  border-radius: 5px;
  color: var(--BLUE01);
  font-weight: 700;
}
.s-shop__table--map::before{
  content: "";
  background: url(../images/service/icon_area.svg) no-repeat;
  background-size: contain;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 .5em;
  vertical-align: bottom;
}
.s-shop--mng {
  border: 3px solid var(--YELLOW04);
  display: flex;
  gap: var(--GAP_50);
}
.s-shop--thumbContainer {
  position: relative;
}
.s-shop--thumbContainer img{
  margin-inline: auto;
}
.s-shop--txtContainer {
  flex: 1;
}
.s-shop__name{
  font-weight: 700;
  color: var(--WHITE);
  background: var(--BLUE04);
  padding: 12px 0 6px;
  text-align: center;
  position: relative;
  margin: -20px auto 0;
  width: 70%;
  max-width: 250px;
}
.s-shop__name span {
  display: block;
  line-height: 1.4;
}
.s-shop__name--ja {
  font-size: var(--FZ_18);
  letter-spacing: .2em;
}
.s-shop__name--en {
  font-size: var(--FZ_11);
}
.s-shop__name--yaku{
  font-size: var(--FZ_13);
  color: var(--BLUE04);
  background: var(--WHITE);
  border: 1px solid var(--BLUE04);
  padding: 3px 1.5em;
  position: absolute;
  left: -15px;
  top: -15px;
}
.s-shop__txtTtl {
  font-size: var(--FZ_20);
  font-weight: 700;
  padding: 0 .5em;
  margin-bottom: var(--GAP_30);
  background: linear-gradient(transparent 50%, var(--YELLOW01) 50%);
  width: fit-content;
  position: relative;
}
.s-shop__txtTtl::before{
  content: "";
  background: url(../images/shop/deco.svg) no-repeat;
  background-size: contain;
  width: 30px;
  height: 20px;
  display: inline-block;
  position: absolute;
  top: -10px;
  right: -15px;
  z-index: 2;
}
.s-shop__txtTtl::after{
  content: "";
  background: url(../images/shop/fukidashi.svg) no-repeat;
  background-size: contain;
  width: 110%;
  display: inline-block;
  position: absolute;
  bottom: -1em;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
.s-shop__txt{
  font-size: var(--FZ_15);
  line-height: 2.4;
  letter-spacing: .15em;
}
.s-shop__txt span{
  border-bottom: 3px dotted var(--YELLOW01);
  padding-bottom: 5px;
}
.s-shop--staffTtl {
  font-size: var(--FZ_20);
  font-weight: 700;
  text-align: center;
  width: fit-content;
  margin: 0 auto var(--GAP_60);
  padding: 15px 3em;
  position: relative;
}
@media screen and (min-width: 768px){
  .tab-wrap--shop .tab-nav {
    gap: var(--GAP_40);
  }
  .tab-wrap--shop .tab-nav li {
    padding: var(--GAP_40) var(--GAP_40) var(--GAP_30);
    border-radius: 40px 40px 0 0;
  }
  .tab-wrap--shop .tab-btn.show::before{
    width: 30px;
    height: 30px;
  }
  .s-tab-btn__ttl{
    font-size: var(--FZ_16);
  }
  .s-tab-btn__ttl span {
    font-size: var(--FZ_25);
    margin-right: .5em;
  }
  .s-shop {
    border-radius: 40px;
  }
  .s-shop__ttl {
    border-radius: 40px 40px 0 0;
  }
  .s-shop__img {
    gap: var(--GAP_30);
  }
  .s-shop__img,
  .s-shop--wrap,
  .s-shop--mng {
    width: 92%;
  }
  .s-shop__map {
    width: 50%;
  }
  .s-shop__map iframe {
    width: 100%;
    height: 100%;
  }
  .s-shop__table {
    width: 50%;
  }
  .s-shop--mng {
    border-radius: 35px;
    padding: var(--GAP_40);
  }
  .s-shop--thumbContainer {
    width: 25%;
  }
  .s-shop--thumbContainer img{
    width: 75%;
  }
  .s-shop--staffTtl {
    background: url(../images/shop/bg_fukidashi.svg) no-repeat center center;
    background-size: contain;
    height: 4em;
  }
  .s-shop__txtTtl::after{
    height: 3vw;
    max-height: 34px;
  }

}
@media screen and (max-width: 767px){
  .tab-wrap--shop .tab-nav {
    gap: var(--GAP_10);
  }
  .tab-wrap--shop .tab-nav li {
    padding: var(--GAP_20);
    border-radius: 20px 20px 0 0;
  }
  .tab-wrap--shop .tab-btn.show::before{
    width: 25px;
    height: 25px;
  }
  .s-tab-btn__ttl{
    font-size: var(--FZ_11);
  }
  .s-tab-btn__ttl span {
    font-size: var(--FZ_20);
    display: block;
  }
  .s-shop {
    border-radius: 20px;
  }
  .s-shop__ttl {
    border-radius: 20px 20px 0 0;
  }
  .s-shop--wrap {
    flex-direction: column;
  }
  .s-shop__map iframe {
    width: 100%;
    height: 250px;
  }
  .s-shop__table {
    margin-bottom: var(--GAP_20);
  }
  .s-shop--mng {
    flex-direction: column;
    border-radius: 20px;
    padding: var(--GAP_30);
    text-align: justify;
  }
  .s-shop--thumbContainer img{
    width: 70%;
    max-width: 280px;
  }
  .s-shop--staffTtl {
    background: url(../images/shop/sp/bg_fukidashi.svg) no-repeat center center;
    background-size: contain;
    height: 6em;
  }
  .s-shop__txtTtl::after{
    height: 28px;
  }

}
@media screen and (max-width: 414px){
  .s-shop--mng {
    padding: var(--GAP_35) var(--GAP_30);
  }
  .s-shop__img {
    flex-direction: column;
    gap: var(--GAP_20);
  }

}
/* ------------------- わたしたちについて -------------------- */
.s-aboutTop {
  position: relative;
}
.s-aboutTop__catch span{
  background: var(--WHITE);
  padding: 5px 10px;
  font-size: var(--FZ_25);
  font-weight: 700;
  box-shadow: 5px 5px 0 var(--YELLOW01);
}
.s-aboutSection {
  background: var(--YELLOW03);
}
.s-about {
  background: var(--WHITE);
  box-shadow: 0 0 10px rgba(235, 219, 71, 0.6);
}
.s-about li {
  display: flex;
}
.s-about--thumbContainer {
  position: relative;
}
.s-about__thumb img {
  box-shadow: 2px 2px 5px hsla(0, 0%, 44%, 0.33);
}
.s-about--txtContainer {
  flex: 1;
}
.s-about__ttl {
  font-size: var(--FZ_25);
  font-weight: 700;
  margin-bottom: var(--GAP_20);
  width: fit-content;
  background: linear-gradient(transparent 50%, var(--YELLOW01) 50%);
}
.s-about__txt{
  font-size: var(--FZ_15);
}
.s-kodawariContainer{
  position: relative;
}
.s-kodawariContainer::before,
.s-kodawariContainer::after{
  content: "";
  display: inline-block;
  position: absolute;
  z-index: 1;
}
.s-kodawariContainer::before{
  background: url(../images/about/triangle_l.svg) no-repeat left top;
  background-size: contain;
  top: 0;
  left: 0;
}
.s-kodawariContainer::after{
  background: url(../images/about/triangle_r.svg) no-repeat right bottom;
  background-size: contain;
  bottom: 0;
  right: 0;
}
.s-kodawariSection .bg-stripe {
  background: var(--YELLOW03);
}
.s-kodawari {
  z-index: 2;
  position: relative;
}
.s-kodawari__ttl span{
  border: 2px solid var(--BLACK);
  font-weight: 700;
  line-height: 1.4;
  position: relative;
  z-index: 2;
}
.s-kodawari__ttl span::after{
  content: "";
  background: var(--YELLOW01) no-repeat left 5px top 5px;
  background-size: 100%;
  display: inline-block;
  position: absolute;
  top: 5px;
  left: 5px;
  width: 101%;
  height: 105%;
  z-index: -1;
}
.s-kodawari--listWrap {
  display: flex;
  align-items: center;
  gap: var(--GAP_20);
}
.s-kodawari__txt {
  font-weight: 700;
  line-height: 1.4;
}
.s-kodawari li:not(:last-child) {
  margin-bottom: var(--GAP_30);
}
@media screen and (min-width: 768px){
  .s-headingContainer--caption{
    line-height: 2.2;
  }
  .s-aboutTop__catch {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .s-aboutTop__catch span{
    line-height: 1.4;
  }
  .s-headingContainer--caption{
    text-align: center;
  }
  .s-about {
    padding: calc(var(--GENERALSEC_HALF)* 1.5) var(--GAP_50);
    border-radius: 30px;
  }
  .s-about li {
    gap: var(--GAP_100);
  }
  .s-about li:not(:last-child){
    margin-bottom: var(--GAP_40);
  }
  .s-about--thumbContainer {
    width: 40%;
  }
  .s-about__thumb img {
    border-radius: 5px;
  }
  .s-about__num {
    width: clamp(28%,7.5vw,33%);
    max-width: 80px;
    position: absolute;
    top: -15px;
    right: -50px;
  }
  .s-kodawari__img {
    position: absolute;
    width: 50%;
    max-width: 600px;
    top: var(--GENERALSEC);
    z-index: 2;
  }
  .s-kodawari--wrap {
    padding: calc(var(--GENERALSEC)* 1.5) 0 var(--GENERALSEC);
  }
  .s-kodawariContainer::before,
  .s-kodawariContainer::after{
    width: 40%;
    height: 40%;
  }
  .s-kodawari--txtWrap {
    width: 55%;
    margin: 30px 0 0 auto;
    background: var(--BLUE02);
    padding: calc(var(--GENERALSEC_HALF)* 1.5) 40px calc(var(--GENERALSEC_HALF)* 1.5) 12%;
    position: relative;
  }
  .s-kodawari__ttl {
    position: absolute;
    top: -1em;
    left: 10%;
  }
  .s-kodawari__num {
    width: 15%;
    max-width: 60px;
  }
  .s-kodawari__ttl span{
    padding: 15px 3em;
    font-size: var(--FZ_25);
  }
  .s-kodawari__txt {
    font-size: var(--FZ_18);
  }

}
@media screen and (max-width: 767px){
  .s-headingContainer--caption{
    line-height: 2;
  }
  .s-aboutTop__catch {
    width: 90%;
    position: absolute;
    bottom: 15%;
    left: 50%;
    transform: translateX(-50%);
  }
  .s-aboutTop__catch span{
    line-height: 2.5;
  }
  .s-about {
    padding: var(--GAP_60) var(--GAP_35) ;
    border-radius: 20px;
  }
  .s-about li {
    gap: var(--GAP_20);
    flex-direction: column;
  }
  .s-about li:not(:last-child){
    margin-bottom: var(--GAP_80);
  }
  .s-about__thumb img {
    border-radius: 5px;
  }
  .s-about__num {
    width: 22%;
    max-width: 100px;
    position: absolute;
    top: -25px;
    left: -20px;
  }
  .s-about__ttl {
    margin-inline: auto;
  }
  .s-kodawari--wrap {
    padding: var(--GENERALSEC) 7%;
  }
  .s-kodawari__img {
    position: relative;
    z-index: 2;
    width: 93%;
  }
  .s-kodawariContainer::before,
  .s-kodawariContainer::after{
    width: 65%;
    height: 30%;
  }
  .s-kodawari--txtWrap {
    width: 93%;
    margin: -60px 0 0 auto;
    background: var(--BLUE02);
    padding: calc(var(--GENERALSEC)* 2) 5% calc(var(--GENERALSEC_HALF)* 1.5);
    position: relative;
  }
  .s-kodawari__num {
    width: 50%;
    max-width: 45px;
  }
  .s-kodawari__ttl {
    margin: -50px 0 30px -40px;
  }
  .s-kodawari__ttl span{
    padding: 10px 2em;
    font-size: var(--FZ_22);
  }
  .s-kodawari__txt {
    font-size: var(--FZ_16);
  }

}
/* ------------------- 会社概要 -------------------- */
.s-message {
  display: flex;
  margin-bottom: var(--GAP_40);
}
.s-message__thumb {
  box-shadow: 15px 15px 0 var(--YELLOW01);
  position: relative;
}
.s-message__en {
  width: 65%;
  max-width: 250px;
  position: absolute;
}
.s-message__cap {
  margin: 1em 0 2em;
  font-size: var(--FZ_18);
  font-weight: 700;
  letter-spacing: .15em;
}
.s-message__txt{
  margin-bottom: 2em;
  font-size: var(--FZ_15);
}
.s-message__txt span{
	font-weight: 600;
}
.s-message__name{
  font-size: var(--FZ_15);
  text-align: right;
}
@media screen and (min-width: 768px){
  .s-message {
    align-items: flex-start;
    gap: var(--GAP_80);
  }
  .s-message__thumb {
    width: 40%;
  }
  .s-message__en {
    right: -50px;
    bottom: -55px;
  }
  .s-message--txtContainer {
    flex: 1;
  }
}
@media screen and (max-width: 767px){
  .s-message {
    flex-direction: column;
    gap: var(--GAP_40);
  }
  .s-message__thumb {
    width: 70%;
    margin-inline: auto;
  }
  .s-message__en {
    right: -30px;
    bottom: -40px;
  }

}
/* ------------------- 会社概要 -------------------- */
.s-profile--wrap .s-shop__table {
  width: 100%;
}
.s-profile--wrap .s-shop__table th{
  width: 20%;
  background: none;
  border-bottom: 1.5px solid var(--BLUE04);
}
.s-profile--wrap .s-shop__map{
  width: 100%;
  height: 320px;
}
.s-profile--wrap .s-shop__table--map::before {
    content: "地図はこちらをクリック";
    background: url(../images/service/icon_area.svg) no-repeat right center;
    background-size: contain;
    width: auto;
    height: 18px;
    padding-right: 2em;
    color: var(--BLUE01);
    vertical-align: text-bottom;
}
@media screen and (min-width: 768px){
  .s-profile--wrap .s-shop__table th,
  .s-profile--wrap .s-shop__table td{
    font-size: var(--FZ_16);
  }

}
@media screen and (max-width: 767px){
  .s-profile--wrap .s-shop__table th,
  .s-profile--wrap .s-shop__table td{
    font-size: var(--FZ_14);
    padding: 15px 1em;
  }
  .s-profile--wrap .s-shop__table th{
    width: 30%;
  }

}
/* ------------------- よくあるご質問 -------------------- */
.s-headingContainer--faq {
  background: var(--BLUE03);
}
.s-faqSection--page {
  display: flex;
  align-items: flex-start;
}
.s-faq--ttl {
  font-size: var(--FZ_20);
  font-weight: 700;
  margin-bottom: var(--GAP_40);
  border-left: 4px solid var(--BLUE01);
  padding-left: 1em;
  letter-spacing: .15em;
}
.s-faqSection--page .s-faq dd {
  display: none;
}
.s-faqSection--page .s-faq dt:not(:first-child) {
  border-top: 1px solid var(--GRAY03);
}
.s-faqSection--page .s-faq dt::after{
  content: "";
  background: url(../images/common/arrow_faq_a.svg) no-repeat;
  background-size: contain;
  display: inline-block;
  position: absolute;
  top: 55%;
  transform: translateY(-50%);
}
.s-faqSection--page .s-faq dt.is_active::after{
  content: "";
  background: url(../images/common/arrow_faq_b.svg) no-repeat;
  background-size: contain;
}
@media screen and (min-width: 768px){
  .s-faqSection--page .s-faqContainer{
    flex: 1;
    gap: var(--GAP_40);
  }
	.s-guideNav{
		position: sticky;
		top: 120px;
		left: 0;
    width: 150px;
	}
	.s-guideNav__item li a{
		font-size: var(--FZ_15);
    font-weight: 700;
		display: block;
		padding: 3px 0 3px 1em;
    border-left: 4px solid var(--BLUE01);
	}
  .s-guideNav__item li:not(:last-child){
    margin-bottom: 15px;
  }
  .s-faqSection--page .s-faq dt {
    cursor: pointer;
    padding: 2em 0 2.2em 5em;
    margin: 0;
  }
  .s-faqSection--page .s-faq dd {
    padding: 2em 0 0 5em;
  }
  .s-faqSection--page .s-faq dt::before,
  .s-faqSection--page .s-faq dd::before{
    top: .7em;
  }
  .s-faqSection--page .s-faq dt::after{
    width: 15px;
    height: 8px;
    right: 2%;
  }
}
@media screen and (max-width: 767px){
	.s-guideNav{
		--GUIDE_NAV_SP_BOX: 250px;
		--GUIDE_NAV_SP_BOX_TRIGGER: 40px;
		position: fixed;
		right: calc(0px - var(--GUIDE_NAV_SP_BOX) + var(--GUIDE_NAV_SP_BOX_TRIGGER));
		top: 150px;
		display: flex;
		width: var(--GUIDE_NAV_SP_BOX);
		transition: .5s;
		z-index: 99;
		opacity: 0;
	}
	body.scroll .s-guideNav{
		opacity: 1;
		animation: var(--ANIME_FADEIN);
	}
	body.scroll.returnTop .s-guideNav{
		opacity: 0;
		animation: var(--ANIME_FADEOUT);
	}
	.s-guideNav.is_active{
		right: 0;
	}
	.s-guideNav__spTrigger{
		width: var(--GUIDE_NAV_SP_BOX_TRIGGER);
		background-color: hsla(200, 100%, 37%, 0.1);
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 5px 0 0 5px;
		border: 1px solid var(--GRAY03);
		border-right: none;
	}
  .s-guideNav.is_active .s-guideNav__spTrigger{
    background-color: var(--BLUE03);
  }
	.s-guideNav__spTrigger::after{
		content: '目次';
		writing-mode: vertical-rl;
	}
	.s-guideNav.is_active .s-guideNav__spTrigger::after{
		content: '閉じる';
	}
  .s-guideNav__item{
		flex: 1;
		background-color: var(--WHITE);
		border: 1px solid var(--GRAY03);
	}
	.s-guideNav__item li:not(:last-child){
		border-bottom: 1px solid var(--GRAY03);
	}
	.s-guideNav__item li a{
		display: block;
		padding: 8px 15px;
		font-size: 13px;
	}
  .s-faqSection--page .s-faq dt{
    padding: 1.5em 2em 1.5em 4em;
    margin: 0;
  }
  .s-faqSection--page .s-faq dd{
    padding: 1.5em 0 1.5em 4em;
  }
  .s-faqSection--page .s-faq dd:not(:first-child){
    margin: 0;
  }
  .s-faqSection--page .s-faq dt::before,
  .s-faqSection--page .s-faq dd::before{
    top: .7em;
  }
  .s-faqSection--page .s-faq dt::after{
    width: 12px;
    height: 7px;
    right: 2%;
  }

}
/* -------------------  -------------------- */

@media screen and (min-width: 768px){

}
@media screen and (max-width: 767px){

}