@charset "UTF-8";
/* Safariバージョン10.1~12.0対策 */
* {
  min-height: 0vw;
  min-height: 0;
}

.gas .paragraph {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  color: #232323;
}
.gas .paragraph:has(.underline) {
  line-height: 2.4rem;
}

.gas-payment-method-method__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.gas-payment-method-method__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.gas-payment-method-method__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.gas-payment-method-method__title h3 span {
  background-color: #003881;
}
.gas-payment-method-method__title h3 span::before {
  background-color: #5682bc;
}
.gas-payment-method-method__title p:nth-child(2) {
  margin-top: 1.4rem;
}
.gas-payment-method-method__content {
  width: 100%;
  margin-top: 2.85rem;
  border: 1px solid #5682bc;
  padding-block: 2.15rem 3.5rem;
}
.gas-payment-method-method__content h4 {
  position: relative;
  margin-left: 3rem;
  padding-left: 1.8rem;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.2;
  color: #003881;
}
.gas-payment-method-method__content h4::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 1.7rem;
  margin: auto;
  background-image: url("../../images/sub/icon_contents.png");
  background-image: image-set(url("../../images/sub/icon_contents.png") 1x, url("../../images/sub/icon_contents@2x.png") 2x);
  background-size: cover;
  content: "";
  transform: translateX(-0.1rem) translateY(0.1rem);
  aspect-ratio: 17/16;
}
.gas-payment-method-method__content ul {
  margin-top: 0.9rem;
  margin-left: 2.9rem;
}
.gas-payment-method-method__content ul li {
  position: relative;
  padding-left: 3rem;
}
.gas-payment-method-method__content ul li::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 1rem;
  margin: auto;
  border-radius: 50%;
  background-color: #232323;
  content: "";
  aspect-ratio: 10/10;
}
.gas-payment-method-method__content ul li a {
  position: relative;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 2.2;
  color: #232323;
}
.gas-payment-method-method__content ul li a::after {
  position: absolute;
  right: 0;
  bottom: -0.3rem;
  left: 0;
  display: block;
  width: 100%;
  height: 0.2rem;
  background-color: #232323;
  content: "";
}

.gas-payment-method-deadline {
  margin-top: 8rem;
}
.gas-payment-method-deadline__container.container {
  width: 1088px;
}
.gas-payment-method-deadline__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.gas-payment-method-deadline__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.gas-payment-method-deadline__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.gas-payment-method-deadline__title h3 span {
  background-color: #003881;
}
.gas-payment-method-deadline__title h3 span::before {
  background-color: #5682bc;
}
.gas-payment-method-deadline__title p:nth-child(2) {
  margin-top: 2rem;
}
.gas-payment-method-deadline__content {
  margin-top: 3rem;
}
.gas-payment-method-deadline__content .js-scrollable {
  width: 100%;
}
.gas-payment-method-deadline__content img {
  width: 1088px;
  max-width: 200vw;
  aspect-ratio: 1088/220;
}
.gas-payment-method-deadline__content p {
  margin-top: 1rem;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
}

.gas-payment-method-direct-debit {
  margin-top: 5.7rem;
}
.gas-payment-method-direct-debit__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.gas-payment-method-direct-debit__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.gas-payment-method-direct-debit__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.gas-payment-method-direct-debit__title h3 span {
  background-color: #003881;
}
.gas-payment-method-direct-debit__title h3 span::before {
  background-color: #5682bc;
}
.gas-payment-method-direct-debit__title p:nth-child(2) {
  margin-top: 2rem;
}
.gas-payment-method-direct-debit__content {
  display: flex;
  margin-top: 3rem;
  padding-bottom: 1.7rem;
  border: solid 0.4rem #e4effa;
  flex-wrap: wrap;
}
.gas-payment-method-direct-debit__content-title {
  width: calc(100% - 4.2rem);
  margin-top: 1.7rem;
  background-color: #e4effa;
  padding-block: 0.9rem 1.1rem;
  margin-inline: auto;
}
.gas-payment-method-direct-debit__content-title h4 {
  font-size: 2rem;
  font-weight: 600;
  color: #232323;
  text-align: center;
}
@media (max-width: 767px) {
  .gas-payment-method-direct-debit__content-title h4 {
    line-height: 2.8;
  }
}
.gas-payment-method-direct-debit__content-title h4 > span {
  position: relative;
  display: inline-block;
  width: 10.5rem;
}
.gas-payment-method-direct-debit__content-title h4 > span span {
  position: absolute;
  display: flex;
  width: 9.8rem;
  padding-bottom: 0.5rem;
  background-image: url("../../images/sub/bg_speech-bubble-direct-debit.png");
  background-image: image-set(url("../../images/sub/bg_speech-bubble-direct-debit.png") 1x, url("../../images/sub/bg_speech-bubble-direct-debit@2x.png") 2x);
  background-size: cover;
  font-size: 2rem;
  font-weight: 600;
  color: #e50000;
  inset: 50% auto auto 50%;
  translate: -48% -87%;
  justify-content: center;
  align-items: center;
  aspect-ratio: 98/52;
}
.gas-payment-method-direct-debit__content-inner {
  display: flex;
  width: 100%;
  margin-top: 1.3rem;
  padding-right: 1.6rem;
  justify-content: center;
  align-items: flex-start;
  gap: 2.2rem;
}
@media (max-width: 767px) {
  .gas-payment-method-direct-debit__content-inner {
    flex-direction: column;
    align-items: center;
  }
}
.gas-payment-method-direct-debit__content-mark {
  display: flex;
  width: 10.7rem;
  height: 10.7rem;
  border-radius: 50%;
  background: #5682bc;
  justify-content: center;
  align-items: center;
}
.gas-payment-method-direct-debit__content-mark h5 {
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1.25;
  color: #fff;
  text-align: center;
}
.gas-payment-method-direct-debit__content-text p {
  margin-top: 0.4rem;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.3333333333;
  color: #232323;
}
.gas-payment-method-direct-debit__content-text ul {
  margin-top: 0.7rem;
  margin-left: 0.5rem;
}
.gas-payment-method-direct-debit__content-text ul li {
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  color: #232323;
}
.gas-payment-method-direct-debit__content-text ul li::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: block;
  margin: auto;
  content: "・";
}

.gas-payment-method-application-method {
  margin-top: 2.9rem;
}

.gas-payment-method-transfer-date,
.gas-payment-method-receipt-info {
  margin-top: 2rem;
}

.gas-payment-method-application-method__title h4,
.gas-payment-method-transfer-date__title h4,
.gas-payment-method-receipt-info__title h4 {
  position: relative;
  padding-left: 1.1em;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  color: #003881;
  letter-spacing: -0.08em;
}
.gas-payment-method-application-method__title h4::before,
.gas-payment-method-transfer-date__title h4::before,
.gas-payment-method-receipt-info__title h4::before {
  position: absolute;
  top: 0.1em;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 0.822rem solid #003881; /* 高さ */
  border-right: 0.6775rem solid transparent;
  border-left: 0.6775rem solid transparent; /* 底辺の半分 */
  content: "";
}
.gas-payment-method-application-method__content,
.gas-payment-method-transfer-date__content,
.gas-payment-method-receipt-info__content {
  margin-top: 0.5rem;
}
.gas-payment-method-application-method__content .note,
.gas-payment-method-transfer-date__content .note,
.gas-payment-method-receipt-info__content .note {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.7142857143;
  color: #232323;
}

.gas-payment-method-bank-list {
  margin-top: 6.4rem;
}
.gas-payment-method-bank-list__title h4 {
  padding-bottom: 0.5rem;
  font-size: 2.4rem;
  font-weight: 500;
  color: #003881;
}
.gas-payment-method-bank-list__title h4::after {
  background-color: #003881;
}
.gas-payment-method-bank-list__content {
  margin-top: 2.25rem;
  background-color: #e4effa;
  padding-block: 2.5rem;
  padding-inline: 2.7rem;
}
.gas-payment-method-bank-list__content p {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.5;
  color: #232323;
  letter-spacing: -0.01em;
}

.gas-payment-method-payment-slip-info {
  margin-top: 9.4rem;
}
.gas-payment-method-payment-slip-info__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.gas-payment-method-payment-slip-info__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.gas-payment-method-payment-slip-info__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.gas-payment-method-payment-slip-info__title h3 span {
  background-color: #003881;
}
.gas-payment-method-payment-slip-info__title h3 span::before {
  background-color: #5682bc;
}
.gas-payment-method-payment-slip-info__title p:nth-child(2) {
  margin-top: 2rem;
}

.gas-payment-method-convenience-store-payment {
  margin-top: 6.4rem;
}
.gas-payment-method-convenience-store-payment__title h4 {
  padding-bottom: 0.5rem;
  font-size: 2.4rem;
  font-weight: 500;
  color: #003881;
}
.gas-payment-method-convenience-store-payment__title h4::after {
  background-color: #003881;
}
.gas-payment-method-convenience-store-payment__content {
  margin-top: 2.25rem;
  background-color: #e4effa;
  padding-block: 2.5rem;
  padding-inline: 2.7rem;
}
.gas-payment-method-convenience-store-payment__content p {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.5;
  color: #232323;
  letter-spacing: -0.01em;
}
.gas-payment-method-convenience-store-payment__note {
  margin-top: 2rem;
}
.gas-payment-method-convenience-store-payment__note p {
  font-family: "Noto Sans JP";
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: #232323;
  text-align: left;
}

.supply-and-piping-supply-area__container.container {
  width: 1088px;
}
.supply-and-piping-supply-area__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.supply-and-piping-supply-area__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.supply-and-piping-supply-area__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.supply-and-piping-supply-area__title h3 span {
  background-color: #003881;
}
.supply-and-piping-supply-area__title h3 span::before {
  background-color: #5682bc;
}
.supply-and-piping-supply-area__content {
  margin-top: 1.7rem;
}
.supply-and-piping-supply-area__content h4 {
  display: inline-block;
  border: solid 0.1rem #232323;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.3333333333;
  color: #232323;
  padding-inline: 2.4rem;
}
.supply-and-piping-supply-area__content h5 {
  position: relative;
  padding-left: 1.5rem;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.3333333333;
  color: #232323;
}
.supply-and-piping-supply-area__content h5::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: inline-block;
  content: "▶︎";
}
.supply-and-piping-supply-area__content h5:not(:nth-child(2)) {
  margin-top: 0.3rem;
}
.supply-and-piping-supply-area__content p {
  font-size: 1.6rem;
  line-height: 1.5;
  color: #232323;
}

.supply-and-piping-supply-area-map {
  margin-top: 9.3rem;
}
.supply-and-piping-supply-area-map__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.supply-and-piping-supply-area-map__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.supply-and-piping-supply-area-map__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.supply-and-piping-supply-area-map__title h3 span {
  background-color: #003881;
}
.supply-and-piping-supply-area-map__title h3 span::before {
  background-color: #5682bc;
}
.supply-and-piping-supply-area-map__content {
  margin-top: 1.5rem;
}
.supply-and-piping-supply-area-map__content a {
  display: flex;
  width: 53.6rem;
  height: 6rem;
  padding-right: 7rem;
  border: solid 0.1rem #003881;
  font-size: 2rem;
  font-weight: 500;
  color: #003881;
  justify-content: center;
  align-items: center;
}
.supply-and-piping-supply-area-map__content a::before {
  right: 7.9rem;
}
.supply-and-piping-supply-area-map__content a::after {
  top: 0;
  right: 3.7rem;
  bottom: 0;
  left: unset;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 0.6775rem solid transparent;
  border-bottom: 0.6775rem solid transparent;
  border-left: 0.822rem solid #003881;
  background-color: unset;
}

.supply-and-piping-supply-plan {
  margin-top: 9.9rem;
}
.supply-and-piping-supply-plan__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.supply-and-piping-supply-plan__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.supply-and-piping-supply-plan__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.supply-and-piping-supply-plan__title h3 span {
  background-color: #003881;
}
.supply-and-piping-supply-plan__title h3 span::before {
  background-color: #5682bc;
}
.supply-and-piping-supply-plan__content {
  margin-top: 2rem;
}
.supply-and-piping-supply-plan__content .pdf {
  display: inline-block;
  margin-top: 1.7rem;
  padding-bottom: 0.5rem;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.2;
  color: #232323;
}
.supply-and-piping-supply-plan__content .pdf:nth-child(2) {
  margin-top: 2rem;
}

.rate-and-terms .tel-link a {
  display: flex;
  padding-left: 6.8rem;
  background-color: #e4effa;
  letter-spacing: 0;
  justify-content: flex-start;
  gap: 1.1rem;
}
.rate-and-terms .tel-link a::after {
  display: none;
}
.rate-and-terms .tel-number {
  font-size: 3rem;
  font-weight: 500;
  color: #232323;
}
.rate-and-terms .tel-info {
  font-size: 1.6rem;
  font-weight: 500;
  color: #232323;
}

.rate-and-terms-rate-and-terms {
  margin-top: 1.8rem;
}
.rate-and-terms-rate-and-terms__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.rate-and-terms-rate-and-terms__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.rate-and-terms-rate-and-terms__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.rate-and-terms-rate-and-terms__title h3 span {
  background-color: #003881;
}
.rate-and-terms-rate-and-terms__title h3 span::before {
  background-color: #5682bc;
}
.rate-and-terms-rate-and-terms__content {
  margin-top: 2.9rem;
}
.rate-and-terms-rate-and-terms__table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
.rate-and-terms-rate-and-terms__table-header th {
  height: 4.6rem;
}
.rate-and-terms-rate-and-terms__table-header th:nth-child(1) {
  width: 5rem;
}
.rate-and-terms-rate-and-terms__table-header th:nth-child(2) {
  width: 28.5rem;
  padding-left: 1.6rem;
  border: 1px solid #707070;
  background: #e4effa;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4.6rem;
  color: #003881;
  letter-spacing: 0.02em;
}
@media (max-width: 767px) {
  .rate-and-terms-rate-and-terms__table-header th:nth-child(2) {
    width: 26rem;
  }
}
.rate-and-terms-rate-and-terms__table-header th:nth-child(3) {
  width: calc(100% - 33.5rem);
  padding-left: 2.6rem;
  border: 1px solid #707070;
  background: #e4effa;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4.6rem;
  color: #003881;
  letter-spacing: 0.02em;
}
@media (max-width: 767px) {
  .rate-and-terms-rate-and-terms__table-header th:nth-child(3) {
    width: calc(100% - 31rem);
    padding-left: 1rem;
  }
}
.rate-and-terms-rate-and-terms__table-content-header {
  position: relative;
  width: 5rem;
  border: 1px solid #707070;
}
.rate-and-terms-rate-and-terms__table-content-header .vertical-text {
  position: absolute;
  display: inline-block;
  width: 100%;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 5rem;
  color: #003881;
  text-align: center;
  letter-spacing: 0.02em;
  inset: 50% auto auto 50%;
  translate: -50% -61%;
  writing-mode: vertical-rl;
}
.rate-and-terms-rate-and-terms__table-content-plan {
  padding-left: 2.06rem;
  border: 1px solid #707070;
  font-size: 2rem;
  font-weight: 500;
  color: #232323;
  vertical-align: middle;
}
@media (max-width: 767px) {
  .rate-and-terms-rate-and-terms__table-content-plan {
    padding-left: 1rem;
  }
}
.rate-and-terms-rate-and-terms__table-content-description {
  border: 1px solid #707070;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  color: #232323;
  padding-inline: 3rem;
  padding-block: 2.18rem;
}
@media (max-width: 767px) {
  .rate-and-terms-rate-and-terms__table-content-description {
    padding-inline: 1rem;
  }
}
.rate-and-terms-rate-and-terms .pdf {
  display: inline-block;
  margin-top: 1.5rem;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  color: #003881;
  letter-spacing: -0.08em;
}
@media (max-width: 767px) {
  .rate-and-terms-rate-and-terms .pdf {
    width: 18rem;
  }
}
.rate-and-terms-rate-and-terms .pdf::after {
  display: none;
}

.rate-and-terms-rate-and-terms-set-discount {
  margin-top: 10.01rem;
}
.rate-and-terms-rate-and-terms-set-discount__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.rate-and-terms-rate-and-terms-set-discount__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.rate-and-terms-rate-and-terms-set-discount__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.rate-and-terms-rate-and-terms-set-discount__title h3 span {
  background-color: #003881;
}
.rate-and-terms-rate-and-terms-set-discount__title h3 span::before {
  background-color: #5682bc;
}
.rate-and-terms-rate-and-terms-set-discount__content {
  display: flex;
  margin-top: 2.05rem;
  gap: 1.64rem;
}
@media (max-width: 767px) {
  .rate-and-terms-rate-and-terms-set-discount__content {
    flex-direction: column;
    align-items: center;
  }
}
.rate-and-terms-rate-and-terms-set-discount__content a {
  display: flex;
  width: 53.6rem;
  height: 7.5rem;
  padding-right: 7rem;
  border: solid 0.1rem #003881;
  font-size: 2rem;
  font-weight: 500;
  color: #003881;
  letter-spacing: -0.08em;
  justify-content: center;
  align-items: center;
}
.rate-and-terms-rate-and-terms-set-discount__content a:nth-child(1) {
  padding-right: 5rem;
}
@media (max-width: 767px) {
  .rate-and-terms-rate-and-terms-set-discount__content a:nth-child(1) {
    padding-right: 15rem;
  }
}
.rate-and-terms-rate-and-terms-set-discount__content a:nth-child(2) {
  padding-right: 15rem;
}
.rate-and-terms-rate-and-terms-set-discount__content a::before {
  right: 5.1rem;
}
.rate-and-terms-rate-and-terms-set-discount__content a::after {
  top: 0;
  right: 3rem;
  bottom: 0;
  left: unset;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 0.6775rem solid transparent;
  border-bottom: 0.6775rem solid transparent;
  border-left: 0.822rem solid #003881;
  background-color: unset;
}

.rate-and-terms-large-demand-contract {
  padding-top: 9.15rem;
}
.rate-and-terms-large-demand-contract__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.rate-and-terms-large-demand-contract__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.rate-and-terms-large-demand-contract__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.rate-and-terms-large-demand-contract__title h3 span {
  background-color: #003881;
}
.rate-and-terms-large-demand-contract__title h3 span::before {
  background-color: #5682bc;
}
.rate-and-terms-large-demand-contract__link {
  display: flex;
  margin-top: 1.9rem;
  justify-content: flex-start;
  gap: 1.64rem;
}
@media (max-width: 767px) {
  .rate-and-terms-large-demand-contract__link {
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
  }
}
.rate-and-terms-large-demand-contract__tel-area {
  display: flex;
  width: 100%;
  height: 10.619rem;
  margin-top: 2rem;
  background-color: #e4effa;
  justify-content: center;
  align-items: center;
}
@media (max-width: 767px) {
  .rate-and-terms-large-demand-contract__tel-area {
    height: unset;
    padding-block: 2rem;
  }
}
.rate-and-terms-large-demand-contract__tel-area > span {
  display: flex;
  text-align: center;
  align-items: center;
  gap: 1.1rem;
}
@media (max-width: 767px) {
  .rate-and-terms-large-demand-contract__tel-area > span {
    flex-direction: column;
    gap: 1rem;
  }
}
.rate-and-terms-large-demand-contract__tel {
  font-size: 3rem;
  font-weight: 500;
  color: #232323;
}
.rate-and-terms-large-demand-contract__note {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 3rem;
  color: #232323;
}
.rate-and-terms-large-demand-contract__tel-link, .rate-and-terms-large-demand-contract__internet-link {
  width: 53.6rem;
  max-width: calc((100% - 1.6rem) / 2);
}
@media (max-width: 767px) {
  .rate-and-terms-large-demand-contract__tel-link, .rate-and-terms-large-demand-contract__internet-link {
    max-width: 100%;
  }
}
.rate-and-terms-large-demand-contract__tel-link a, .rate-and-terms-large-demand-contract__internet-link a {
  position: relative;
  display: flex;
  width: 100%;
  height: 10.6rem;
  margin-top: 1rem;
  background-color: #003881;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.2;
  color: #fff;
  letter-spacing: -0.08em;
  justify-content: center;
  align-items: center;
}
.rate-and-terms-large-demand-contract__tel-link a::before, .rate-and-terms-large-demand-contract__internet-link a::before {
  position: absolute;
  top: 0;
  bottom: 0;
  display: block;
  margin: auto;
  background-size: cover;
  content: "";
}
.rate-and-terms-large-demand-contract__tel-link a::after, .rate-and-terms-large-demand-contract__internet-link a::after {
  position: absolute;
  right: 2rem;
  width: 0;
  height: 0;
  border-top: 1.113rem solid #fff;
  border-right: 0.9175rem solid transparent;
  border-left: 0.9175rem solid transparent;
  content: "";
  transform: rotate(270deg);
}
.rate-and-terms-large-demand-contract__tel-link p, .rate-and-terms-large-demand-contract__internet-link p {
  position: relative;
  padding-left: 1.1em;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  color: #003881;
  letter-spacing: -0.08em;
}
.rate-and-terms-large-demand-contract__tel-link p::before, .rate-and-terms-large-demand-contract__internet-link p::before {
  position: absolute;
  top: 0.1em;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 0.822rem solid #003881; /* 高さ */
  border-right: 0.6775rem solid transparent;
  border-left: 0.6775rem solid transparent; /* 底辺の半分 */
  content: "";
}
.rate-and-terms-large-demand-contract__tel-link a, .rate-and-terms-large-demand-contract__internet-link a {
  margin-top: 0.88rem;
}
.rate-and-terms-large-demand-contract__internet-link a {
  padding-left: 4rem;
}
.rate-and-terms-large-demand-contract__internet-link a::before {
  left: 10.48rem;
  width: 7rem;
  background-image: url("../../images/common/icon_contact.png");
  background-image: image-set(url("../../images/common/icon_contact.png") 1x, url("../../images/common/icon_contact@2x.png") 2x);
  aspect-ratio: 70/80;
}
.rate-and-terms-large-demand-contract .mt-20 {
  margin-top: 2rem;
}
.rate-and-terms-large-demand-contract .paragraph {
  position: relative;
  padding-left: 2rem;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  color: #003881;
  letter-spacing: -0.08em;
}

.rate-and-terms-contracts {
  padding-top: 9.88rem;
}
.rate-and-terms-contracts__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.rate-and-terms-contracts__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.rate-and-terms-contracts__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.rate-and-terms-contracts__title h3 span {
  background-color: #003881;
}
.rate-and-terms-contracts__title h3 span::before {
  background-color: #5682bc;
}
.rate-and-terms-contracts__link {
  display: flex;
  width: 52.6rem;
  margin-top: 2.1rem;
  flex-wrap: wrap;
}
.rate-and-terms-contracts__link .pdf {
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.5;
  color: #232323;
}
@media (max-width: 767px) {
  .rate-and-terms-contracts__link {
    width: 100%;
    padding-left: 2rem;
  }
}
.rate-and-terms-contracts__link-wrap {
  display: inline-block;
  width: 26.3rem;
  margin-bottom: 1.76rem;
}

.rate-and-terms-construction-info {
  margin-top: 9.5rem;
}
.rate-and-terms-construction-info__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.rate-and-terms-construction-info__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.rate-and-terms-construction-info__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.rate-and-terms-construction-info__title h3 span {
  background-color: #003881;
}
.rate-and-terms-construction-info__title h3 span::before {
  background-color: #5682bc;
}
.rate-and-terms-construction-info__content {
  display: flex;
  margin-top: 2.05rem;
  gap: 1.64rem;
}
@media (max-width: 767px) {
  .rate-and-terms-construction-info__content {
    flex-direction: column;
    align-items: center;
  }
}
.rate-and-terms-construction-info__content a {
  position: relative;
  display: flex;
  width: 53.6rem;
  height: 7.5rem;
  padding-right: 7rem;
  padding-right: 2.5rem;
  border: solid 0.1rem #003881;
  font-size: 2rem;
  font-weight: 500;
  color: #003881;
  justify-content: center;
  align-items: center;
}
.rate-and-terms-construction-info__content a::after {
  position: absolute;
  top: 0;
  right: 3rem;
  bottom: 0;
  left: unset;
  display: block;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 0.6775rem solid transparent;
  border-bottom: 0.6775rem solid transparent;
  border-left: 0.822rem solid #003881;
  background-color: unset;
  content: "";
}

.gas-construction-cost-gas-construction-cost {
  margin-top: 1.8rem;
}
.gas-construction-cost-gas-construction-cost__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.gas-construction-cost-gas-construction-cost__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.gas-construction-cost-gas-construction-cost__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.gas-construction-cost-gas-construction-cost__title h3 span {
  background-color: #003881;
}
.gas-construction-cost-gas-construction-cost__title h3 span::before {
  background-color: #5682bc;
}

.gas-construction-cost-gas-construction-estimate {
  margin-top: 3.1rem;
}
.gas-construction-cost-gas-construction-estimate__title h4 {
  padding-bottom: 0.5rem;
  font-size: 2.4rem;
  font-weight: 500;
  color: #003881;
}
.gas-construction-cost-gas-construction-estimate__title h4::after {
  background-color: #003881;
}
.gas-construction-cost-gas-construction-estimate__content {
  margin-top: 3.05rem;
}
.gas-construction-cost-gas-construction-estimate__content .note {
  padding-left: 1.2em;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.2;
  color: #232323;
}
.gas-construction-cost-gas-construction-estimate__content .note:nth-child(2) {
  margin-top: 1.3rem;
}
.gas-construction-cost-gas-construction-estimate__price {
  font-size: 1.8rem;
  font-weight: 500;
  color: #232323;
}
.gas-construction-cost-gas-construction-estimate__price .text-large {
  font-size: 2.6rem;
}
.gas-construction-cost-gas-construction-estimate__price .text-medium {
  font-size: 1.8rem;
}
.gas-construction-cost-gas-construction-estimate__note {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.2;
  color: #232323;
}
.gas-construction-cost-gas-construction-estimate__note:nth-child(2) {
  margin-top: 1rem;
}
.gas-construction-cost-gas-construction-estimate__note span {
  position: relative;
  padding-left: 1.2em;
}
.gas-construction-cost-gas-construction-estimate__note span::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  font-size: 1em;
  content: "※";
  transform: translateY(0.2rem);
}
.gas-construction-cost-gas-construction-estimate__standard-model {
  margin-top: 4.8rem;
}
.gas-construction-cost-gas-construction-estimate__standard-model h5 {
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.3333333333;
  color: #003881;
  transform: translateX(-0.5rem);
}
.gas-construction-cost-gas-construction-estimate__standard-model ul {
  margin-top: 1rem;
}
.gas-construction-cost-gas-construction-estimate__standard-model ul li {
  position: relative;
  padding-left: 1em;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.2;
  color: #232323;
}
.gas-construction-cost-gas-construction-estimate__standard-model ul li::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  font-size: 1em;
  content: "・";
}
.gas-construction-cost-gas-construction-estimate__img {
  display: flex;
  margin-top: 4rem;
  justify-content: center;
}
.gas-construction-cost-gas-construction-estimate__img img {
  width: 80rem;
  aspect-ratio: 800/500;
}
.gas-construction-cost-gas-construction-estimate__link {
  margin-top: 4.5rem;
}
.gas-construction-cost-gas-construction-estimate__link .pdf {
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.0666666667;
  color: #232323;
}

.gas-construction-cost-inner-piping-entry {
  margin-top: 8.5rem;
}
.gas-construction-cost-inner-piping-entry__title h3 {
  position: relative;
  padding-left: 2.4rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4rem;
  color: #003881;
}
.gas-construction-cost-inner-piping-entry__title h3 span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0.7rem;
  height: 100%;
}
.gas-construction-cost-inner-piping-entry__title h3 span::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1.3rem;
  content: "";
}
.gas-construction-cost-inner-piping-entry__title h3 span {
  background-color: #003881;
}
.gas-construction-cost-inner-piping-entry__title h3 span::before {
  background-color: #5682bc;
}
.gas-construction-cost-inner-piping-entry__title p.paragraph {
  margin-top: 2.5rem;
  line-height: 1.2;
}

.gas-construction-cost-contact {
  padding-top: 4.6rem;
}
.gas-construction-cost-contact__title h5 {
  position: relative;
  padding-left: 1.1em;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  color: #003881;
  letter-spacing: -0.08em;
}
.gas-construction-cost-contact__title h5::before {
  position: absolute;
  top: 0.1em;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 0.822rem solid #003881; /* 高さ */
  border-right: 0.6775rem solid transparent;
  border-left: 0.6775rem solid transparent; /* 底辺の半分 */
  content: "";
}
.gas-construction-cost-contact__link {
  width: 100%;
  margin-top: 0.3rem;
}
@media (max-width: 767px) {
  .gas-construction-cost-contact__link {
    width: 53.6rem;
    max-width: 100%;
    margin-inline: auto;
  }
}
@media (min-width: 1280px) {
  .gas-construction-cost-contact__link {
    white-space: nowrap;
  }
}
.gas-construction-cost-contact__tel-area {
  display: flex;
  width: 100%;
  height: 10.619rem;
  background-color: #e4effa;
  justify-content: center;
  align-items: center;
}
@media (max-width: 767px) {
  .gas-construction-cost-contact__tel-area {
    height: unset;
    padding-block: 2rem;
  }
}
.gas-construction-cost-contact__tel-area > span {
  display: flex;
  text-align: center;
  align-items: center;
  gap: 1.1rem;
}
@media (max-width: 767px) {
  .gas-construction-cost-contact__tel-area > span {
    flex-direction: column;
    gap: 1rem;
  }
}
.gas-construction-cost-contact__tel {
  font-size: 3rem;
  font-weight: 500;
  color: #232323;
}
.gas-construction-cost-contact__note {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 3rem;
  color: #232323;
}