/* ビルボード
----------------------------------------------- */
#mainImg {
  background: none;
  border: none;
}


/* パンくず
----------------------------------------------- */
#breadcrumb {
  margin-bottom: 15px;
}


/* イントロ（concept）
----------------------------------------------- */
div[id$="concept"] h1 {
  color: #333;
  font-weight: bold;
  margin-bottom: 0.5em;
}

@media (min-width:730px){
  div[id$="concept"] h1 {
    border-bottom: 4px #e60033 solid;
    padding-bottom: 0.5rem;
    position: relative;
  }
  div[id$="concept"] h1:after {
    background: #CCCCCC;
    content: "";
    height: 4px;
    width: 85%;
    position: absolute;
    bottom: -4px;
    right: 0;
  }
} /* Eo min730 */


div[id$="concept"] .trouble dl {
  background-color: #990000;
  padding: 1rem;
}
div[id$="concept"] .trouble dl dt {
  color: #FFF;
  font-size: min( 6vw, 52px );
  line-height: 1.25em;
  text-align: center;
}
div[id$="concept"] .trouble dl dd {
  background-image: url(../img/contents/ci-firewaste-genba.webp);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  padding: 2rem;
}
div[id$="concept"] .trouble dl dd ul {
  background-color: rgba( 255,255,255,0.9 );
  border-radius: 1rem;
  padding: 2rem;
  margin-bottom: 4rem;
}
div[id$="concept"] .trouble dl dd ul li {
  font-size: 1.25em;
  margin-left: 1rem;
}
div[id$="concept"] .trouble dl + p {
  background-color: #990000;
  color: #FFF;
  font-size: min( 6vw, 52px );
  line-height: 1.25em;
  text-align: center;
  clip-path: polygon( 53% 100%, 0 0, 100% 0 );
  padding-bottom: 0.75em;
  margin-bottom: 0;
}

@media (min-width:730px){
  div[id$="concept"] .trouble dl dd ul li {
    font-size: 1.5em;
    margin-left: 3rem;
  }
} /* Eo min730 */



/* サービスの特長
----------------------------------------------- */
section[id$="-service"] {
  counter-reset: ft;
}
section[id$="-service"] > div + div{
  border-top: 1px #CCC solid;
}
section[id$="-service"] h3 {
  counter-increment: ft;
  color: #cc3333;
  border: none;
}
section[id$="-service"] h3:before {
  content: counter(ft,decimal-leading-zero);
  background-color: #e60033;
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2264px%22%20height%3D%2213px%22%3E%3Ctext%20kerning%3D%22auto%22%20font-family%3D%22Kozuka%20Gothic%20Pr6N%22%20fill%3D%22rgb(0%2C%200%2C%200)%22%20font-size%3D%2216px%22%20x%3D%220px%22%20y%3D%2213px%22%3E%3Ctspan%20font-size%3D%2216px%22%20font-family%3D%22Century%20Gothic%22%20font-weight%3D%22bold%22%20fill%3D%22%23FFFFFF%22%3EFeatures%3C%2Ftspan%3E%3C%2Ftext%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  background-size: 80% auto;
  background-position: center 0.25em;
  color: #FFF;
  font-size: min( 6vw, 52px );
  padding: 0.25em;
  line-height: 1em;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: end;
  border-radius: 5px;
}


@media (max-width:879px){
  section[id$="-service"] h3 {
    display: flex;
    gap: 0.75em;
    align-items: center;
  }
} /* max 879px */


@media (min-width:880px){
  section[id$="-service"] h3,
  section[id$="-service"] h3 ~ p {
    margin-left: 2rem;
  }
  section[id$="-service"] h3:before {
    float: left;
    transform: translateX(-2rem);
    width: fit-content;
  }
} /* min 880px */



/* 処分費用
----------------------------------------------- */
section[id$="-cost"] .tanka {
  font-size: min( 6vw, 24px );
  margin-bottom: 0;
}
section[id$="-cost"] .tanka .deco span {
  font-size: 1.5em;
}
section[id$="-cost"] table {
  font-size: 1.25em
  line-height: 1.25em;
}
section[id$="-cost"] table caption {
  color: inherit;
}
section[id$="-cost"] table tbody th {
  background-color: unset;
  font-weight: normal;
  text-align: left;
}
section[id$="-cost"] table tbody .price {
  color: #cc3333;
  font-size: 1.25em
}



/* お伺いできる地域
----------------------------------------------- */
#contents .post .box.visit ul.area-list {
  margin: 0 0 1em;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.5em;
}
#contents .post .box.visit ul.area-list li {
  border-right: 1px #CCC solid;
  list-style: none;
  line-height: 1.2em;
  text-align: center;
  padding: 0 1em;
  min-width: 5em;
}