:root {
  --main-key-color: #237d39;
  --sub-key-color: #265795;
  --sub2-key-color: #8bc1e1;
  --section-background-color : #e5f9ea;
  /* --main-key-color: #47B39D;
  --sub-key-color: #fc4128; */
  --marker-color-yellow : #fff08c;
  --my-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFFFFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --my-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
/***********************************************
 common
***********************************************/
html {
	scroll-behavior: smooth;
  scroll-padding-top: 100px;
}
body {
  text-align: left;
  font-family: 'Noto Serif JP', serif;
}
.section-title h1 ,.section-title h2 {
  position: relative;
  display: inline-block;
  padding: 0.5rem 55px;
  color: var(--sub-key-color);
}
.section-title h1::before ,.section-title h1::after ,
.section-title h2::before , .section-title h2::after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 45px;
    height: 3px;
    background-color: var(--sub-key-color);
  }
  .section-title h1::before,
.section-title h2::before {
  left:0;

}
.section-title h1::after,
.section-title h2::after {
  right:0;

}
.section-title p {
  position: relative;
  padding: 0.5rem 0 2rem;
  margin-bottom: 0.5rem;
}

.btn-line {
  --bs-btn-color: #fff;
  --bs-btn-bg: #00B900;
  --bs-btn-border-color: #00B900;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #018101;
  --bs-btn-hover-border-color: #018101;
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #018101;
  --bs-btn-active-border-color: #018101;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #00B900;
  --bs-btn-disabled-border-color: #00B900;
  padding :15px 0;
  width: 60%;
  margin: 0 auto;
}
.btn-line a {
  color: #fff;
  text-decoration: none;
}
div.line_button>a {
  background-color: #32C632;
  border-color: #32C632;
  padding-left: 1.45rem;
  padding-right: 1.45rem;
}

div.line_button>a:hover {
  background-color: #018101;
  border-color: #018101;
}

/* .section-title p::before {
  position: absolute;
  border-bottom: 7px solid var(--sub-key-color);
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  width: 140px;
  content: '';
} */

/* @media (max-width : 576px) {
  .section-title p::before {
    border-bottom: 7px solid var(--sub-key-color);
  width: 110px;
  }

} */
@media (min-width: 320px) and (max-width: 1680px) {
  .section-title h1 {
    font-size: calc((100vw - 320px) * 18 / 1360 + 22px);
  }
  .section-title h2 {
    font-size: calc((100vw - 320px) * 18 / 1360 + 22px);
  }
}
.strong-marker {
  display: inline;
  background-color: transparent;
  background: linear-gradient(transparent 55%, var(--marker-color-yellow) 45%);
  font-weight: 700;
}
section:nth-child(2n+1) {
  background-color: var(--section-background-color );
}
 /***********************************************
 nav
***********************************************/
.bg-body-tertiary {
  background-color: var(--main-key-color)!important;
}
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show ,.nav-link {
  color: #fff!important;
}
.img-logo {
  max-width: 220px;
}
@media (max-width : 576px) {
  .img-logo {
    max-width: 200px;
  }
}
.nav-link {
  font-size: 0.95rem;
}

@media (max-width : 1200px) {
  .nav-link {
    font-size: 0.75rem;
  }
}
.navbar-toggler {
  padding: var(--bs-navbar-toggler-padding-y);
}
 /***********************************************
 Carousel
***********************************************/
.img-cover {
  max-height: 650px;
  width: 100%;
  object-fit: cover;
  opacity: 0.6;
}
.carousel-item {
  background-color:#000;
}
.carousel-caption {
  bottom: 3.25rem;
  text-align: left;
}
@media (max-width : 576px) {
    .carousel-caption {
      bottom: 1.25rem;
      }
    }
@media (min-width: 320px) and (max-width: 1680px) {
  .carousel-h2 {
    font-size: calc((100vw - 320px) * 32 / 1360 + 16px);
    border-bottom: #fff;
    text-shadow: 1px 2px 3px #000; 
  }
  .carousel-p {
    font-size: calc((100vw - 320px) * 6 / 1360 + 10px);
    text-shadow: 1px 2px 3px #000; 
  }
   .carousel-caption .btn {
    font-size: calc((100vw - 320px) * 6 / 1360 + 10px);
  }
  
  }
.carousel-fade .carousel-item {
  opacity: 0;
  transition-property: opacity;
  transition-duration: 2s; /* フェードイン/アウトに2秒かける */
  transition-timing-function: ease-in-out; /* 滑らかな動作 */
}

.carousel-fade .carousel-item.active {
  opacity: 1;
  transition-property: opacity;
  transition-duration: 2s; /* フェードイン/アウトに2秒かける */
  transition-timing-function: ease-in-out; /* 滑らかな動作 */
}

 /***********************************************
 不動産放棄はできません
***********************************************/
.list-group-item h3::before {
  content: "";
  display: inline-block;
  width: 50px;
  height: 43.5px;
  /* background-image: url('../../images/leaf-red.png'); */
  background-image: url('../../images/house-green.svg');
  fill: var(--sub2-key-color)!important;
  background-position: bottom -2px right 0;
    background-size: contain;
  background-repeat: no-repeat;
  vertical-align: bottom;
  margin-right: 5px;
}
#catch h3 {
  padding-bottom: 3px;
  /* border-bottom: 3px solid var(--sub-key-color); */
}
.stripe {
  width: 100%;
  height: 10px;
  background-image: repeating-linear-gradient(45deg, var(--sub-key-color), var(--sub-key-color) 10px, var(--sub2-key-color) 10px,var(--sub2-key-color) 20px);
}

#catch.list-group li {
  list-style-type: disc;
}
#catch.list-group .list-group-item h3::before {
  /* background-image: url('../../images/leaf-green.png'); */
  background-image: url('../../images/house-blue.svg');

}
@media (min-width: 320px) and (max-width: 1680px) {
  .section  .list-group-item p{
    font-size: calc((100vw - 320px) * 3 / 1360 + 16px);
  }
  }
  .soudan {
    background: #fff;;
  }
 /***********************************************
 料金
***********************************************/
.list-group-item {
  border: none;
}
@media (min-width: 320px) and (max-width: 1680px) {
  #cost .list-group-item {
    font-size: calc((100vw - 320px) * 3 / 1360 + 16px);
  }
}
  #cost .text-attention {
    font-size: 14px;
    color: var(--sub-key-color);
  }
.table th {
  width: 40%;
}
.table td {
  width: 60%;
}
@media (min-width: 320px) and (max-width: 1680px) {
  .table th ,.table td {
    font-size: calc((100vw - 320px) * 3 / 1360 + 16px);
  }
  }
 /***********************************************
 お取引の流れ
***********************************************/
@media (min-width: 320px) and (max-width: 1680px) {
  #flow .row h1 {
    font-size: calc((100vw - 320px) * 16 / 1360 + 16px);
  }
  #flow .row p {
    font-size: calc((100vw - 320px) * 3 / 1360 + 16px);
  }
  }
  @media (max-width: 786px) {
    .custom-mt-3 {
      margin-top: 1rem; /* Bootstrapのmt-3相当の値 */
    }
  }
  
   /***********************************************
 よくあるご質問
***********************************************/
.accordion-body {
  background-color:#dee2e6;
}
.accordion-button {
  color: #fff;
  background-color: var(--sub-key-color);
}
.accordion-button:not(.collapsed) {
  color: #fff;
  background-color: var(--sub-key-color);
  box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}
.accordion-collapse {
  transition: height 0.6s ease; /* 開閉速度を600msに設定 */
}

 /***********************************************
 footer
***********************************************/
.footer{
  color: #fff;
  background-color: var(--main-key-color);
  text-align: center;
  padding: 1rem;
}
 /***********************************************
 nav menu sp and accodion 
***********************************************/
.navbar-toggler-icon {
  border: 1px solid var(--my-navbar-toggler-border-color);
  background-image : var(--my-navbar-toggler-icon-bg);
}
.navbar-toggler {
  border: var(--bs-border-width) solid #fff;
}
.navbar-toggler:focus {
  box-shadow : none;
}
.accordion-button:not(.collapsed)::after {
  background-image: var(--my-accordion-btn-icon);
}
.accordion-button::after {
  background-image: var(--my-accordion-btn-icon);
}