@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Roboto:wght@700&display=swap');

/* ============================================================
   引越し見積もり（MOVING）専用スタイル
   - 元サイト(au-plus-home.com fp-19346)のデザインを移植
   - 元CSSは html{font-size} を 62.5%/55%/50% と切替えるため、
     サイト全体に影響しないよう .parts-fp 配下に閉じたスケール
     変数 --rf（1rem相当）へ変換している
   ============================================================ */

.parts-fp,
.parts-fp.template-fp {
  --main-color: #6D461F;
  --sub-color: #E98119;
  --bg-color: #F1F8FA;
  --border-color: #D1E8EC;
  --gray-color: #8A8A8A;
  --marker: #FBFF80;
  --rf: 10px;
}
@media screen and (max-width:1024px){ .parts-fp,.parts-fp.template-fp{ --rf: 8.8px; } }
@media screen and (max-width:768px){ .parts-fp,.parts-fp.template-fp{ --rf: 8px; } }

/* common
---------------------------------------------------------------------------- */
.template-fp{ font-family:'Noto Sans JP', sans-serif; }
.template-fp h2,
.template-fp h3,
.template-fp h4,
.template-fp h5,
.template-fp p{
  margin:0;
  padding:0;
  border-radius:0;
  line-height:1.5em;
  letter-spacing:0.05em;
  font-weight:500;
  border:none;
}
.template-fp a{ text-decoration:none; display:block; }
.template-fp img{ width:100%; height:auto; display:block; }
.template-fp .pc-none{ display:none; }
.template-fp .sp-none{ display:block; }
@media screen and (max-width:560px){
  .template-fp .pc-none{ display:block; }
  .template-fp .sp-none{ display:none; }
}

/* cw
---------------------------------------------------------------------------- */
.parts-fp .cw{ padding:calc(4 * var(--rf)) 0; }

@media screen and (max-width:1120px){
  .parts-fp .cw-inner{ width:calc(100% - 4 * var(--rf)); margin:0 auto; }
}
@media screen and (max-width:768px){
  .parts-fp .cw{ padding:calc(6 * var(--rf)) 0; }
}
@media screen and (max-width:560px){
  .parts-fp .cw{ padding:calc(3 * var(--rf)) 0; }
}

/* mv-wrapper（mv-text02 / mv-img）
---------------------------------------------------------------------------- */
.parts-fp .mv-text02{
  text-align:left;
  margin:0 auto calc(4 * var(--rf));
  padding-bottom:calc(2 * var(--rf));
  width:100%;
  display:flex;
  justify-content:flex-start;
  align-items:flex-end;
  position:relative;
  flex-wrap:wrap;
  border-bottom:2px solid;
  border-color:var(--main-color);
}
.parts-fp .mv-text02::before{
  position:absolute;
  content:'';
  width:100%;
  height:0;
  border-bottom:1px solid;
  border-color:var(--main-color);
  bottom:2px;
  left:0;
}
.parts-fp .mv-text02 h2{
  text-align:center;
  font-size:calc(3.6 * var(--rf));
  font-weight:bold;
  color:#242424;
  position:relative;
  display:inline-block;
  padding-right:calc(3 * var(--rf));
}
.parts-fp .mv-text02 p{
  font-size:calc(1.8 * var(--rf));
  color:var(--main-color);
  display:inline-block;
  font-family:'Roboto', sans-serif;
}

.parts-fp .mv-img{
  display:flex;
  justify-content:center;
  align-items:center;
}
.parts-fp .mv-img img{
  width:50%;
  height:calc(24 * var(--rf));
  object-fit:cover;
  font-family:'object-fit: cover;';
}
@media screen and (max-width:1120px){
  .parts-fp .mv-img img{ height:25vw; }
}

/* title-box01-2
---------------------------------------------------------------------------- */
.parts-fp .title-box01-2{
  margin:calc(3 * var(--rf)) 0 calc(1 * var(--rf));
  font-size:calc(1.8 * var(--rf));
  font-weight:bold;
  position:relative;
  background:none;
  padding-bottom:calc(2 * var(--rf));
  color:var(--main-color);
  text-align:center;
}
.parts-fp .title-box01-2 h3{
  text-align:center;
  font-size:calc(3.2 * var(--rf));
  font-weight:bold;
  color:#242424;
  position:relative;
}
.parts-fp .title-box01-2 p{
  font-size:calc(1.6 * var(--rf));
  color:var(--main-color);
  font-family:'Roboto', sans-serif;
}
.parts-fp .title-box01-2::before{
  position:absolute;
  content:'';
  width:calc(8 * var(--rf));
  border-bottom:2px solid var(--main-color);
  bottom:0;
  left:50%;
  transform:translateX(-50%);
}
@media screen and (max-width:560px){
  .parts-fp .title-box01-2 h3{ font-size:calc(2.4 * var(--rf)); }
  .parts-fp .title-box01-2{ margin-bottom:calc(1 * var(--rf)); }
}

/* cw04
---------------------------------------------------------------------------- */
.parts-fp .cw-04{ padding-bottom:calc(2 * var(--rf)); }
.parts-fp .cw-04 .cw-flex{
  display:flex;
  justify-content:flex-start;
  align-items:stretch;
  flex-wrap:wrap;
}
.parts-fp .cw-04 .cw-box{
  width:calc(100% / 4);
  text-align:left;
  position:relative;
  margin:calc(4 * var(--rf)) 0 calc(2 * var(--rf));
  overflow:hidden;
  padding:0 calc(2 * var(--rf));
  box-sizing:border-box;
}
.parts-fp .cw-04 .cw-box .cw-img{ width:100%; }
.parts-fp .cw-04 .cw-box .cw-img img{
  height:calc(14 * var(--rf));
  width:calc(14 * var(--rf));
  object-fit:cover;
  font-family:'object-fit: cover;';
  border-radius:50%;
  margin:0 auto;
}
.parts-fp .cw-04 .cw-box h4{
  font-size:calc(1.8 * var(--rf));
  font-weight:bold;
  color:var(--main-color);
  padding:calc(1 * var(--rf)) 0;
  text-align:center;
}
.parts-fp .cw-04 .cw-box p{ font-size:13px; }

.parts-fp .note-txt-wrap{ margin-bottom:calc(4 * var(--rf)); }
.parts-fp .note-txt-wrap p{
  font-size:calc(1.6 * var(--rf));
  text-align:center;
}
@media screen and (max-width:768px){
  .parts-fp .cw-04 .cw-box{
    width:calc(100% / 2);
    margin:calc(3 * var(--rf)) 0 calc(2 * var(--rf));
  }
}
@media screen and (max-width:480px){
  .parts-fp .cw-04 .cw-box{
    margin:calc(2 * var(--rf)) 0;
    padding:0;
  }
  .parts-fp .cw-04 .cw-box p{ padding:0 calc(1 * var(--rf)); }
  .parts-fp .note-txt-wrap p{ text-align:left; }
}

/* contact-wrapper02
---------------------------------------------------------------------------- */
.template-fp .common-contact02{
  position:relative;
  background:#3E3E3E;
  padding:calc(6 * var(--rf)) 0;
  overflow:hidden;
}
.template-fp .contact-img{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
  height:100%;
  opacity:0.3;
}
.template-fp .contact-img img{
  width:100%;
  height:100%!important;
  object-fit:cover;
  font-family:'object-fit: cover;';
}
.template-fp .common-contact02 .contact-inner{
  width:calc(100% - 8 * var(--rf));
  margin:0 auto;
  box-sizing:border-box;
  text-align:center;
  position:relative;
}
.template-fp .common-contact02 .contact-title{ margin-bottom:calc(4 * var(--rf)); }
.template-fp .common-contact02 .contact-title h3{
  font-size:calc(3.2 * var(--rf));
  font-weight:bold;
  color:#fff;
}
.template-fp .common-contact02 .contact-title p{ color:#fff; }

.template-fp .common-contact02 .contact-mail{
  background:var(--sub-color);
  max-width:calc(38 * var(--rf));
  margin:0 auto calc(2 * var(--rf));
  text-align:center;
  padding:calc(1.6 * var(--rf));
  box-sizing:border-box;
  transition:.4s;
  border-radius:calc(1 * var(--rf));
  display:flex;
  justify-content:center;
  align-items:center;
  border:3px solid var(--sub-color);
}
.template-fp .common-contact02 .contact-mail p{
  color:#fff;
  font-size:calc(1.8 * var(--rf));
  padding-left:8px;
  font-weight:bold;
}
.template-fp .common-contact02 .contact-mail svg{
  fill:#fff;
  width:calc(2.4 * var(--rf));
  height:auto;
}
.template-fp .common-contact02 .contact-mail:hover{ background:#fff; }
.template-fp .common-contact02 .contact-mail:hover p{ color:var(--sub-color); }
.template-fp .common-contact02 .contact-mail:hover svg{ fill:var(--sub-color); }

.template-fp .common-contact02 .contact-tel{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
}
.template-fp .common-contact02 .contact-tel p{
  font-size:calc(1.6 * var(--rf));
  font-weight:bold;
  color:#fff;
}
.template-fp .common-contact02 .contact-tel p.l-text{
  font-size:calc(3.2 * var(--rf));
  font-family:'Roboto', sans-serif;
  letter-spacing:0;
  padding-left:4px;
}
.template-fp .common-contact02 .contact-tel svg{
  fill:#fff;
  padding-left:8px;
  width:calc(2.4 * var(--rf));
}

@media screen and (min-width:769px){
  .template-fp a[href^="tel:"]{ pointer-events:none; }
}
@media screen and (max-width:768px){
  .template-fp .common-contact02{ padding:calc(4 * var(--rf)) 0; }
  .template-fp .common-contact02 .contact-title{ margin-bottom:calc(3 * var(--rf)); }
  .template-fp .common-contact02 .contact-inner{ width:calc(100% - 6 * var(--rf)); }
}
@media screen and (max-width:560px){
  .template-fp .common-contact02 .contact-tel p:first-child{ width:100%; }
  .template-fp .common-contact02 .contact-tel svg{ padding-left:0px; }
}
