@charset "UTF-8";
/*トップページ*/
/*1250px―タブレット*/
@media screen and (max-width: 1250px) {
  .sr-only {
    display: none !important; } }
/*1250px―タブレットここまで*/
@media screen and (max-width: 960px) {
  #main_vis header {
    width: 96%; }
  #main_vis .main_text {
    top: 60%; }
    #main_vis .main_text .main_text_soudan br {
      display: inherit; }

  h2:after {
    top: calc(120px + 8.5vw); } }
/*スマホ*/
@media screen and (max-width: 768px) {
  #main_vis {
    margin-bottom: 40px; }

  .contents1_inner {
    display: block; }
    .contents1_inner dl {
      border-radius: 5vw;
      width: 100%; }
      .contents1_inner dl dt {
        font-size: clamp(25px, 4vw, 35px); }
      .contents1_inner dl dd figure img {
        max-width: 90%; }

  .contents3_inner table tbody tr td span {
    padding: 5px 15px; }

  .contents5 .contents5_inner .dl_blue dd .contents5_inner_img {
    justify-content: space-around;
    gap: 20px; }
    .contents5 .contents5_inner .dl_blue dd .contents5_inner_img figure {
      width: 45%;
      height: auto; }

  .contents6 .contents6_inner .flow_box:before {
    font-size: 4.5vw;
    line-height: min(8vw, 92px);
    left: 0;
    top: -10%;
    width: min(8vw, 92px);
    height: min(8vw, 92px); }

  .contents7 form .form_box {
    padding: 30px 0; }
    .contents7 form .form_box .form_box_inner {
      width: min(90%, 1000px); }
      .contents7 form .form_box .form_box_inner dl {
        display: block;
        margin-bottom: 30px; }
        .contents7 form .form_box .form_box_inner dl dt {
          padding: 0;
          width: initial;
          display: inline-block; }
          .contents7 form .form_box .form_box_inner dl dt.require:before {
            padding: 3px 10px;
            top: -5px;
            right: -60px; }
          .contents7 form .form_box .form_box_inner dl dt.dt_long {
            width: 100%;
            padding-right: 0; }
        .contents7 form .form_box .form_box_inner dl dd {
          padding: 10px 0;
          width: 100%; }
          .contents7 form .form_box .form_box_inner dl dd textarea {
            height: 130px; }

  /*lINEボタンを下に設置する*/
    #line:hover {transform: none; }
  footer {
    padding-bottom: 20px; } }
/*SE対策*600px*/
@media screen and (max-width: 600px) {
  header .header_inner {
    padding: 10px; }

  h2:after {
    top: calc(100px + 11vw); }

  .contents6 .contents6_inner .flow_box {
    padding: 3.5vw 4vw 3.5vw 4vw;
    position: relative;
    display: block;
    margin-bottom: 45px; }
    .contents6 .contents6_inner .flow_box img {
      width: 100%;
      height: 100%; }
    .contents6 .contents6_inner .flow_box:before {
      font-size: 30px;
      line-height: 55px;
      left: 20px;
      top: 10px;
      width: 55px;
      height: 55px; }
    .contents6 .contents6_inner .flow_box .flow_left {
      margin-right: 0; }
      .contents6 .contents6_inner .flow_box .flow_left h3 {
        margin: 0 0 20px 70px; }
      .contents6 .contents6_inner .flow_box .flow_left p {
        margin-bottom: 20px; }

  .tel_box .box_type3 {
    width: 100%; }
  .tel_box h4 {
    font-size: 22px;
    margin-bottom: 15px; }
  .tel_box .tel_box_inner {
    font-size: 26px;
    border-radius: 50px;
    padding: 10px 20px;
    line-height: 1.7;
    width: 100%; }
    .tel_box .tel_box_inner img {
      width: 40px;
      height: auto; }

  /*pagetopボタンの位置を調整する*/
  #pagetop {
    bottom: calc( 50px + 3vw); }

  footer .footer_inner {
    background-position: right bottom 10px;
    background-size: 30% auto; } }
/*SE対策*380px*/
@media screen and (max-width: 380px) {
  .contents5 .contents5_inner .dl_blue dt {
    padding: 15px 30px; }

  .tel_box h4 {
    font-size: 22px;
    margin-bottom: 10px; }
  .tel_box .tel_box_inner {
    font-size: 22px;
    border-radius: 50px;
    padding: 10px;
    line-height: 1.7;
    width: 100%; }
    .tel_box .tel_box_inner img {
      width: 30px;
      height: auto; }
    } 
 
/* ===== SP FV：最終クリーン版（style_sp.css の末尾に置く）===== */

/* SP見出しカラー */
#main_vis .main_text h1{
  color:#295a75;
  -webkit-text-fill-color:#295a75;
}

/* ベース：〜768px */
@media (max-width:768px){
  /* 背景はPC画像を敷く（SPでも） */
  #main_vis{ min-height:480px; }
  #main_vis img.main_pc{
    display:block !important;
    position:absolute; inset:0;
    width:100%; height:100%;
    object-fit:cover;
    object-position:right 88%;
    z-index:0;
  }
  #main_vis img.main_sp{ display:none !important; }

  /* .fv は中身だけを表示（箱の余白は殺す） */
  #main_vis .main_text .fv{
    display:contents !important;
    height:auto !important; padding:0 !important; margin:0 !important;
  }

  /* テキスト塊を最上面に・上から余白 */
  #main_vis > .main_text{
    position:absolute !important; top:0 !important; left:0 !important; right:0 !important;
    transform:none !important; z-index:1 !important; text-align:center !important;
    padding-top:134px !important;           /* ここを基準に帯ごとで微調整 */
    padding-bottom:18px !important;         /* h1 とアニメの間 */
  }

  /* h1（clamp無効化） */
  #main_vis .main_text > h1,
  #main_vis .main_text h1{
    font-size:19px !important;
    line-height:1.35 !important;
    margin:0 0 6px !important;
    letter-spacing:.02em !important;
    font-weight:700 !important;
  }

  /* FV直下（h2）との間 */
  #main_vis + *{ margin-top:24px !important; }
}

/* 320〜360px */
@media (max-width:360px){
  #main_vis > .main_text{ padding-top:150px !important; }
  #main_vis{ min-height:620px !important; }
}

/* 361〜420px（iPhone SE/8〜XR 系） */
@media (min-width:361px) and (max-width:420.98px){
  #main_vis > .main_text{ padding-top:134px !important; }
  #main_vis{ min-height:640px !important; }
}

/* 421〜480px（Pixel/S22 等） */
@media (min-width:421px) and (max-width:480.98px){
  #main_vis > .main_text{ padding-top:134px !important; }
  #main_vis{ min-height:640px !important; }
}

/* brクラスの出し分け（保険） */
#main_vis h1 br[class^="br"]{ display:none; }
@media (max-width:425px){ #main_vis h1 br.br-425{ display:inline; } }
@media (max-width:375px){ #main_vis h1 br.br-375{ display:inline; } }
#main_vis h1 .nobr{ white-space:nowrap; }

/* PC帯では従来の配置に戻す（念のため） */
@media (min-width:769px){
  .fv{ display:block !important; }
  #main_vis > .main_text{
    position:absolute !important; top:0 !important; left:0 !important; right:0 !important;
    transform:none !important; z-index:3 !important;
    padding-top:180px !important;          /* PC側はこれでOK（お好みで） */
  }
  #main_vis img.main_pc{ display:block !important; }
}
/* ===== PCの見え方を微調整（style_sp.css の一番最後に追加）===== */

/* PC全体：FVの下余白はゼロに */
@media (min-width:1024px){
  #main_vis{ padding-bottom: 0 !important; }
}

/* 1024〜1279px（小さめノート） */
@media (min-width:1024px) and (max-width:1279.98px){
  #main_vis > .main_text{ padding-top: 140px !important; } /* ←今180ならまず140へ */
  #main_vis{ min-height: 660px !important; }               /* ←720が大きければ660前後へ */
}

/* 1280〜1439px（一般的なデスクトップ） */
@media (min-width:1280px) and (max-width:1439.98px){
  #main_vis > .main_text{ padding-top: 160px !important; }
  #main_vis{ min-height: 700px !important; }
}

/* 1440px〜（広めのデスクトップ） */
@media (min-width:1440px){
  #main_vis > .main_text{ padding-top: 180px !important; }
  #main_vis{ min-height: 740px !important; }
}

/* FV直下の見出しとの間に変な余白が入る場合の保険 */
@media (min-width:1024px){
  #main_vis + *{ margin-top: 0 !important; }
}
/* ===== PC帯：アニメは1回だけで停止（style_sp.css の末尾に追記） ===== */
@media (min-width: 1024px){
  /* 無料回収/無料撤去のスパン（animate.css を使ってる要素）を指定 */
  #main_vis .main_text_blue .animate__animated{
    animation-iteration-count: 1 !important;      /* ← 繰り返し禁止 */
    animation-fill-mode: both !important;         /* ← 最終状態で静止 */
    animation-name: animate__bounceInDown !important; /* ← もし別名に上書きされても戻す */
    /* お好みで速度・遅延も固定可能（必要なら有効化）
    animation-duration: 0.9s !important;
    animation-delay: 0s !important;
    */
  }
}