/* contact-footer-fixed-content.css — ベースライン(自動読込・module-base.css前提)。編集せず上書きで調整。 */
@charset "UTF-8";


.modulelist_container .footer_fixed_content {
  position: relative;
}


.footer_fixed_content {
  display: block;  /* common.css の平置き防止(既定none)を上書き */
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 999;
  padding: 0;
  background: var(--color-primary);
  color: var(--color-on-primary);
}
.footer_fixed_content .pc_ftr {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer_fixed_content .pc_ftr .box01 {
  width: 25%;
}
.footer_fixed_content .pc_ftr .box01 .title {
  text-align: center;
  font-weight: 800;
  font-size: 1.5rem;
}
.footer_fixed_content .pc_ftr .box01 .title span {
  display: block;
  font-size: 0.875rem;
}
.footer_fixed_content .pc_ftr .box02 {
  width: 37%;
  margin-left: 3%;
  padding-left: 30px;
  border-left: 1px solid #fff;
}
.footer_fixed_content .pc_ftr .box03 {
  width: 35%;
}
.footer_fixed_content .pc_ftr .box03 .more a {
  border-color: #fff;
  color: var(--color-on-primary);
  background: transparent;
}
.footer_fixed_content .pc_ftr .box03 .more a:after {
  border-color: #fff;
}
.footer_fixed_content .pc_ftr .box03 .more a:hover {
  background: var(--color-primary); color: var(--color-on-primary); }
.footer_fixed_content .pc_ftr .row {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer_fixed_content .sp_ftr .inner {
  display: flex;
  align-items: center;
}
.footer_fixed_content .sp_ftr a {
  text-decoration: none;
  width: 50%;
  text-align: center;
  padding: 8px;
  padding-left: 30px;
  position: relative;
  color: var(--color-on-primary);
}
.footer_fixed_content .sp_ftr a:after {
  content: "";
  position: absolute;
  width: 33px;
  height: 32px;
  left: 10px;
  top: 50%;
  transform: translate(0, -50%);
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -1;
}
.footer_fixed_content .sp_ftr .tel:after {
  background: url(images/footer-fixed-content-bg-1.webp) no-repeat center/contain;
}
.footer_fixed_content .sp_ftr .mail {
  border-left: 1px solid #fff;
}
.footer_fixed_content .sp_ftr .mail:after {
  background: url(images/footer-fixed-content-bg-2.webp) no-repeat center/contain;
}
.footer_fixed_content .row p {
  margin: 0;
}
@media screen and (max-width: 1199px) {
  .footer_fixed_content .pc_ftr .box01 {
    width: 32%;
  }
  .footer_fixed_content .pc_ftr .box02 {
    width: 33%;
    padding-left: 15px;
  }
  .footer_fixed_content .pc_ftr .box02 .tel {
    font-size: 1.125rem;
  }
  .footer_fixed_content .pc_ftr .box03 {
    width: 38%;
  }
}
@media screen and (min-width: 768px) {
  /* SM-FIX6-close: 元ファイルはこの @media を【閉じ忘れ】ており、
     以降に書いた CSS がすべてこのブロックに飲み込まれて無効になっていた。 */
}

/* SM-FIX2-20260819 */
/* 2026-08-19: スマホで潰れる。CSS 末尾の @media screen and (min-width: 768px){} が
   【中身が空のまま】で、「PC用の3カラムは 768px 以上だけ」という出し分けが丸ごと
   欠落していた。結果 375px でも 25%/37%/35% の flex がそのまま効き、各カラムが
   90px 前後になって「お問い合 わせ」のように1〜3文字で改行されていた。
   sample.html に .sp_ftr のマークアップは無いので、.pc_ftr を狭い画面向けに畳む。 */
@media screen and (max-width: 767px){
  .footer_fixed_content .pc_ftr{ max-width: none; }
  .footer_fixed_content .pc_ftr .row{ flex-wrap: wrap; padding: .35em .6em; }
  .footer_fixed_content .pc_ftr .box01{ width: 100%; }
  .footer_fixed_content .pc_ftr .box01 .title{ font-size: 1rem; line-height: 1.35; }
  .footer_fixed_content .pc_ftr .box01 .title span{ display: inline; font-size: .8125rem; margin-right: .4em; }
  .footer_fixed_content .pc_ftr .box02{
    width: 58%; margin-left: 0; padding-left: 0; border-left: 0;
  }
  .footer_fixed_content .pc_ftr .box02 .tel{ font-size: 1.0625rem; }
  .footer_fixed_content .pc_ftr .box02 p{ font-size: .75rem; line-height: 1.4; }
  .footer_fixed_content .pc_ftr .box03{ width: 42%; }
  .footer_fixed_content .pc_ftr .box03 .more a{
    width: 100%; min-width: 0; padding: .6em .4em; font-size: .8125rem;
  }
}
