﻿:root{
    /* ------ 色 -------------------------------- */
    --main-color:#DB621B; /* 濃いオレンジ */
    --main-color-grade: linear-gradient(90deg , #f08a01 , #d75a11);
    --main-color-grade-hover: linear-gradient(-90deg , #f08a01 , #d75a11);

    --pale-orange:#FAE8DD; /* 新HP薄いオレンジ */
    --pale-green:#d3f2eb; /* 新HP薄い緑 */
    --pale-blue:#cde6f2; /* 新HP薄い青 */
    --dark-blue:#015AA9;
    --dark-green:#019d79;

    --pale-gray:#ebf0f3; /* ヘッダーと同色の灰色 */
    --dark-gray:#6B6B6A; /* 車種の選択肢の色 */
    --pale-gray2:#b7b6b6; /* 無効ボタンの色 */
    --red:#e80000;
    --white:#FAF9FA;



    --pale-orange3:#faf2eb;


    /* ------ 文字サイズ -------------------------------- */
    --f-l1:48px; /* 大：48px 38px 32px */
    --f-l2:32px; /* 大：32px 28px 24px */
    --f-l3:24px; /* 大：24px 22px 20px */
    --f-l4:22px;
    --f-c:18px; /* 大：18px 16px */
    --f-s1:16px; /* 大：16px 14px */
    --f-s2:14px; /* 大：14px 12px */
    --f-s3:12px; /* 大：14px 12px */
}







.container{
    width:1420px;
    max-width:100%;
    margin: 0 auto;
    padding: 0 auto;
}
input,select{
     margin:0 10px;
 }
/* 見出し */
 .heading{
    font-weight:bold;
    padding-right:30px;
 }

/* ----------------------------------------------------*/

/* ---- 配置 ---- */
.row{
    display:flex;
    align-items:center;
}
.col{
    display:flex;
    flex-direction:column;
}
/* 右寄せ */
.insurance-select,
.car-accessories-fee,
.select-insurance .option-price,
.select-car-accessories .option-price,
.select-discount .discount-price,
.last-price-txt{
    margin-right: 10px;
    margin-left: auto;
}
/* 上寄せ */
.option-and-usage-fee{
    align-items:start;
}
/* 文字右寄せ */
.select-car-txt,
.select-car-price{
    text-align:right;
}




/* ---- 横幅 ---- */
/* 共通横幅 */
.condition-input,
.car-selection,
.option-and-usage-fee{
    margin:40px 0px;
}
.option-and-usage-fee > .col:first-child{
    width:60%;
}
.usage-fee{
    width: calc(40% - 30px);
}
/* 横余白30% */
.condition-input > .col{
    padding:0 30px;
}




/* ---- インデント・input周りのpadding調整 ---- */
/* (横)インデント　1字下げる */
.car-explanation .row,
.option .b-label,
.option-and-usage-fee .option-menu{
    padding: 10px 30px;
}
/* (縦)余白 */
.condition-input .row,
.select-option-area{
    padding:5px 0px;
}
/* ラベル同士の余白 */
label{
    margin-right:30px;
}
/* ラベル下の余白 */
.option-menu .insurance-label,
.option-menu .car-accessories-label{
    margin:20px 0;
}
.insurance > .row,
.car-accessories > .row,
.select-car-class{
    margin-bottom:15px;
}
/* 左側余白 */
.usage-fee,
.select-insurance .option-name,
.select-car-accessories .option-name,
.discount .discount-name{
    margin-left:30px;
}
/* 上下余白 */
.select-insurance{
    padding:15px 0;
}
/* 左右余白 */
.usage-fee .label{
    padding: 0 10px;
}
.car-select{
    padding:30px 0;
    position:relative;
}
.car-select .car-scroll-track{
    align-items:end;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 6px;
    padding: 0 30px 10px; /* 余白をボタンと干渉しないように確保 */
    scroll-behavior: smooth;
    -ms-overflow-style: none; /* IE/Edge */
    scrollbar-width: none; /* Firefox */
}
.car-select .car-scroll-track img{
    -webkit-user-drag: none;
    user-select: none;
}
.car-select .car-scroll-track::-webkit-scrollbar{
    display: none; /* Chrome/Safari */
}
.car-select .car-single{
    flex: 0 0 170px;
}
.car-select .car-scroll-btn{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 64px;
    border: none;
    background: rgba(0,0,0,0.5);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    z-index: 2;
    border-radius: 4px;
}
.car-select .car-scroll-btn.prev{
    left: 0;
}
.car-select .car-scroll-btn.next{
    right: 0;
}
.car-select .car-scroll-btn:hover{
    background: rgba(0,0,0,0.7);
}




/* ---- ラベル ---- */
/* ラベル太字 */
.label,
.insurance-label,
.car-accessories-label{
    padding-right:20px;
    font-weight:bold;
}
/* ラベル横幅 */
.condition-input .row .label{
    width:80px;
}




/* ---- background ---- */
/* 背景オレンジー */
.option .b-label{
    background:var(--main-color);
}
.select-car-class-text,
.last-price{
    background:var(--pale-orange3);
}
.option-menu{
    border: 2px solid var(--main-color);
}
.insurance > .row,
.select-car-class,
.discount{
    padding-bottom:15px;
}
.insurance > .row,
.car-accessories > .row,
.select-car-class,
.discount{
    border-bottom:2px solid var(--pale-gray);
}
.option .b-label{
    color:var(--white);
}
.option-menu{
    border-radius: 0 0 5px 5px;
}




/* ---- 文字色 ---- */
/* オレンジ文字 */
.select-car-txt,{
    color:var(--main-color);
}
/* 赤字 */
.discount-price{
    color:var(--red);
}




/* ---- 文字サイズ ---- */
/* 文字設定 */
.last-price-txt{
    font-size:var(--f-l1);
}
.select-car-txt,
.select-car-price{
    font-size:var(--f-l2);
}
.last-price-label,
.insurance-label,
.car-accessories-label,
.b-label{
    font-size:var(--f-l3);
}
.heading,
input,select{
    font-size:var(--f-c);
}




/* 太字 */
.select-car,
.last-price-txt,
.b-label{
    font-weight:bold;
}




/* エラーメッセージ */
.error-txt{
    color:var(--red);
    font-size:var(--f-s2);
}




/* ---- ボタン・バッジ ---- */
/* 車種ステータス */
.select-status{
    border:1px solid var(--main-color);
    padding:0 50px;
    background-color:var(--main-color);
    color:var(--white);
    font-weight:bold;
    margin:0 20px;
}
.not-select-status{
    border:1px solid var(--main-color);
    border-radius:50px;
    padding:0 50px;
    background-color:var(--white);
    color:var(--main-color);
    font-weight:bold;
    margin:0 20px;
}

/* メインカラーボタン */
.main-color-btn{
    background-color:var(--main-color);
    border:none;
    border-radius:50px;
    color:var(--white);
    font-size:var(--f-l3);
    font-weight:bold;
    padding:10px 0;
    margin:30px 0;
    box-shadow: 5px 5px 5px #c4c4c4;
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    text-decoration: none;
    width: 100%;
}
.main-color-btn.search-btn{
    width: 180px;
    padding: 8px 0;
    margin: 15px 0 0 auto;
    font-size: var(--f-l4);
    box-shadow: 3px 3px 5px #c4c4c4;
}
.main-color-btn:hover{
    background-color:#f08445;
}

/* 白枠オレンジボタン */
.white-frame-color-btn{
    background:var(--main-color-grade);
    border:3px solid var(--white);
    border-radius:50px;
    color:var(--white);
    font-size:var(--f-l3);
    font-weight:bold;
    padding:10px 0px;
    width:350px;
    margin-top:30px;
    cursor: pointer;
}
.white-frame-color-btn:hover{
    background:var(--main-color-grade-hover);
}

/* 無効ボタン */
.invalid-btn{
    background-color:var(--white);
    border:2px solid var(--pale-gray2);
    border-radius:50px;
    color:var(--pale-gray2);
    font-size:var(--f-l3);
    font-weight:bold;
    padding:5px 0;
    margin:30px 0;
    box-shadow: 5px 5px 5px #c4c4c4;
}

/* 車種クラスボタン */
.car-class-menu-btn{
    background:var(--dark-gray);
    color:var(--white);
    padding:6px 4px;
    margin: 0 0 2px 0;
    font-size:var(--f-s3);
    height:28px;
    text-align:center;
    display: flex;
    align-items:center;
    justify-content:center;
    cursor: pointer;
    box-shadow: 5px 5px 5px #c4c4c4;
}

/* 在庫なし */
.out-of-stock .car-class-menu-btn{
    background-color:var(--dark-gray);
    cursor: initial;
}
.car-class-menu-btn:hover{
    background-color:var(--main-color);
}
.car-choices.select:not(.out-of-stock) .car-class-menu-btn{
    background-color:var(--main-color);
    cursor: initial;
}
.car-class-menu-btn:not(:first-child){
    position:absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 0;
    /* jsでクリックで表示できるようにしてください */
    display:none;
}
/* 車種クラス選択のプルダウン(2階層目以降) */
.car-class-menu-btn:nth-child(2){
    top:138px;
}
.car-class-menu-btn:nth-child(2){
    top:138px;
}
.car-class-menu-btn:nth-child(3){
    top:194px;
}
.car-class-menu-btn:nth-child(4){
    top:250px;
}

/* 吹き出し */
.speech-bubble {
    position: relative;
    display: inline-block;
    margin: 0 10px 20px;
    padding: 16px;
    border-radius: 5px;
    background-color: #faf2eb;
    text-align: left;
    font-size: var(--f-s2);
    font-weight: 400;
    line-height: 1.5;
    color: #000000;
    min-height: 55px;
}
.speech-bubble::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    border-style: solid;
    border-width: 20px 10px 0 10px;
    border-color: #faf2eb transparent transparent;
    translate: -50% 100%;
}

/* 在庫切れのクラス */
.car-choices.out-of-stock::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
}
/* 選択中のクラス */
.car-choices.select::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border:4px solid var(--main-color);
    border-radius: 5px 5px 0 0;
    background: transparent;
    pointer-events: none;
}

/* 全在庫がない場合のstyle */
.car-select .row::before{
    content: 'ご指定の時間では空き車両がありません';
    position: absolute;
    top: 154px;
    right: 0;
    bottom: 30px;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    color:var(--white);
    font-size:var(--f-l2);
    z-index:1;

    display:flex;
    align-items:center;
    justify-content:center;
    display:none;
}
.orange-txt{
    color:var(--main-color);
    font-weight:bold;
    font-size:var(--f-l3);
}





/* -------------------- 予約システム　--------------------------------------------------------------- */
/* 枠 */
.condition-input{
    background-color:var(--pale-orange3);
    display:flex;
    /*justify-content:center;*/
    padding:30px 10px;
    flex-wrap: wrap;
}
.condition-input > .col{
    box-sizing: border-box;
    flex: 1 1 50%;
}
/* 区切り線 */
.condition-input > .col:first-child{
    border-right:2px solid var(--pale-gray);
}
.condition-input .search-row{
    width: 100%;
    justify-content: flex-end;
    padding: 0 30px 10px;
}


/* -- 車種選択 -- */
/* 車種画像 */
.car-img{
    width:150px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}
.car-choices{
    position:relative;
    width:160px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
}
.car-class-menu{
    width:100%;
}


/* --- オプション選択 ---*/
/* 加入ボタン */
.insurance label{
    border:2px solid var(--pale-gray);
    border-radius:5px;
    padding:10px 10px 10px 20px;
    margin:0 5px;
    cursor: pointer;
}
/* 加入ボタンの余白 */
.insurance input{
    margin-left:20px;
}

/* チェックボックス */
.car-accessories label{
    width:100%;
    display:flex;
    margin-right:initial;
    padding: 10px 0;
    cursor: pointer;
}
.option .b-label{
    border-radius:5px 5px 0 0;
}

/* ---- 見積 ---- */
/* ご利用料金 */
.last-price{
    padding:50px 0 10px;
    display:flex;
    align-items:end;
}


/* -------------------- 民間車検　--------------------------------------------------------------- */
/* --- 色 --- */
.top-first-message .l-1,
.top-first-message .l-2,
.quote-band .wrapper .l-1,
.quote-band .wrapper .l-2{
    color:var(--white);
}
.top-first-message,
.quote-band{
    background-color:var(--main-color);
}
.vehicle-inspection-process .frame-main-section-title > .l2,
.vehicle-inspection-process .frame-section-title > .l2{
    color:var(--main-color);
}
.reliable-inspection-details-box > .box-txt li::marker,
.reliable-inspection .frame-section-title > .l2,
.reliable-inspection-details-box > .box-title{
    color:var(--dark-blue);
}
.inspection-details-box > .box-txt li::marker,
.inspection-details .frame-section-title > .l2,
.inspection-details-box > .box-title{
    color:var(--dark-green);
}
.reliable-inspection .wrapper{
    background-color:var(--pale-blue);
}
.inspection-details .wrapper{
    background-color:var(--pale-green);
}




/* --- ファーストビュー画像 --- */
.top-first-img{
    width:100%;
    vertical-align: bottom;
}
/* オレンジタイトル */
.top-first-message{
    display:flex;
    flex-direction:column;
    text-align:center;
    padding:30px 0;
}
.top-first-message .l-1{
    font-size:var(--f-l1);
    padding-bottom:10px;
    font-weight:bold;
}
.top-first-message .l-2{
    font-size:var(--f-c);
    font-weight:bold;
}




/* --- フロートボタン --- */
.float-quote-btn{
    position:fixed;
    bottom:20px;
    right:20px;
    width:200px;
    height:200px;
    border-radius:50%;
    border:3px solid var(--white);
    background:var(--main-color-grade);
    display:flex;
    justify-content:center;
    align-items:center;
    color:var(--white);
    text-decoration: none;
    font-size:var(--f-l3);
    box-shadow:0 4px 6px rgba(0,0,0,0.2);
}
.float-quote-btn:hover{
    background-color:var(--main-color-grade-hover);
}
.float-quote-btn .wrapper{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items: center;
}
.float-quote-btn .txt{
    text-align:center;
    color:var(--white);
    font-weight:bold;
    padding-top:10px;
    line-height:initial;
}
.float-quote-btn .icon-04{
    width:70px;
    margin-top:10px;
}




/* --- WEBで簡単お見積り --- */
.quote-band .container{
    display:flex;
    justify-content:center;
    padding:50px 0;
}
.quote-band .icon-04{
    padding-right:50px;
    width:180px;
    height:180px;
    margin:auto 0;
}
.quote-band .wrapper{
    display:flex;
    flex-direction:column;
    align-items:center;
}
.quote-band .wrapper .l-1{
    font-size:var(--f-l2);
    font-weight:bold;
    padding-bottom:10px;
}
.quote-band .wrapper .l-2{
    font-size:var(--f-l4);
    font-weight:bold;
}
.btn-elem > .white-frame-color-btn:first-child{
    margin-right:30px;
}



/* --- WEB車検～点検内容枠 --- */
.vehicle-inspection-process .col,
.reliable-inspection .col,
.inspection-details .col{
    width:50%;
}
.vehicle-inspection-process .wrapper > .row,
.reliable-inspection .explain-single > .row,
.inspection-details .wrapper .row{
    align-items:flex-start;
}
.vehicle-inspection-process .wrapper > .row:nth-of-type(4),
.reliable-inspection .wrapper > .row:nth-of-type(2),
.reliable-inspection .wrapper > .row:nth-of-type(5),
.inspection-details .wrapper > .row:nth-of-type(2),
.inspection-details .wrapper > .row:nth-of-type(5),
.reliable-inspection .explain-single .row{
    padding-top:30px;
}
.vehicle-inspection-process .wrapper > .row,
.inspection-details .wrapper > .row{
    padding-top:60px;
}
.inspection-details .wrapper > .row{
    width:100%;
}
.reliable-inspection .explain-single .row{
    padding-bottom:30px;
}
.vehicle-inspection-process .wrapper .row:nth-of-type(3),
.vehicle-inspection-process .wrapper .row:nth-of-type(5){
    border-top: solid var(--main-color) 2px;
    margin:0 30px;
}
.reliable-inspection .explain-single .row:nth-of-type(2){
    border-top: solid var(--dark-blue) 2px;
}
.reliable-inspection .wrapper > .row:nth-of-type(5),
.inspection-details .wrapper > .row:nth-of-type(5){
    width:100%;
}
.vehicle-inspection-process .wrapper > .row{
    padding:30px 0px 0px;
    margin:0 30px;
}
.vehicle-inspection-process .wrapper > .row:not(:nth-of-type(4)){
    padding:30px 0px 30px;
}
.vehicle-inspection-process .wrapper .row:nth-of-type(6){
    padding-bottom:0px;
}
.vehicle-inspection-process .wrapper{
    background-color:var(--pale-orange);
    /*border: 3px solid #db621b;*/
}
.vehicle-inspection-process .wrapper,
.inspection-details .wrapper,
.reliable-inspection .wrapper{
    margin:100px 0;
    border-radius:10px;
    display:flex;
    flex-direction: column;
    align-items:center;
    justify-content:center;
    padding:70px 70px 75px;
}
.vehicle-inspection-process .wrapper .heading{
    background-color:var(--white);
    border-left:20px solid var(--main-color);
    color:var(--main-color);
    display:flex;
    align-items: center;
    padding:10px 20px;
    font-size:var(--f-l3);
    margin-bottom:30px;
}
.step-txt{
    margin: 0 0 20px;
}

/* --- 写真スタイル(仮) --- */
.capture{
    width:80%;
    margin-left:auto;
}

/* 枠タイトル */
.frame-main-section-title,
.frame-section-title{
    display:flex;
    flex-direction:column;
    align-items: center;
    font-weight:bold;
    width:100%;
}
.frame-section-sub-title{
    font-weight:bold;
    width:100%;
    margin-right:auto;
    padding:30px 30px 10px;
    font-size:var(--f-l3);
}


/*
.vehicle-inspection-process .frame-main-section-title > .l1{
    padding-bottom:10px;
}*/
.vehicle-inspection-process .frame-main-section-title > .l1,
.frame-section-title > .l1{
    font-size:var(--f-l2);
}
.vehicle-inspection-process .frame-main-section-title > .l2{
    background: var(--white);
    padding: 0 30px;
    border-left: 20px solid var(--main-color);
}
.vehicle-inspection-process .frame-main-section-title > .l2,
.frame-section-title > .l2{
    font-size:var(--f-l2);
    display: flex;
    align-items: center;
    margin-right:auto;
    padding-left: 30px;
    font-weight:bold;
}

/* WEB車検の流れ */
.vehicle-inspection-process .col .iframe-box{
    position: relative;
    width: 100%;
    max-width: 480px; /* 最大幅を指定 */
    aspect-ratio: 16/9;
}
.vehicle-inspection-process .col .iframe-box iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.iframe-box{
    margin-left:auto;
}




/* 安心安全の検査 */
.reliable-inspection .row{
    margin:0 30px 0;
}




/* --- 点検内容 --- */
.reliable-inspection-details-box,
.inspection-details-box{
    border-radius:10px;
    margin:0 30px;
    padding:40px;
}
.reliable-inspection-details-box{
    background-color:var(--white);
    border:2px solid var(--dark-blue);
}
.inspection-details-box{
    background-color:var(--white);
    border:1px solid var(--dark-green);
}
.reliable-inspection-details-box > .box-title,
.inspection-details-box > .box-title{
    padding-bottom:10px;
    font-size:var(--f-l4);
    font-weight:bold;
}
.reliable-inspection-details-box > .box-title{
    border-bottom:3px solid var(--dark-blue);
}
.inspection-details-box > .box-title{
    border-bottom:1px solid var(--dark-green);
}
.reliable-inspection-details-box > .box-txt li,
.inspection-details-box > .box-txt li{
    border-bottom:10px;
}
.inspection-details ul, ol{
    list-style:initial;
    padding:22px;
}
.reliable-inspection > .wrapper .frame-section-title:nth-of-type(4),
.inspection-details > .wrapper .frame-section-title:nth-of-type(4){
    margin: 80px 0 0;
}
/*.inspection-details-box .box-txt li{
    font-weight:bold;
}*/
.reliable-inspection-details-box .box-txt li > p,
.inspection-details-box .box-txt li > p{
    margin:5px 0 0 15px;
    font-weight:initial;
}
.row-movie{
    padding:0 0 50px;
}
.frame-section-title svg:first-child{
    padding-left:10px;
}




.home .cont05 .h_box h2{
    background: url(../../static/img/vehicleInspectionFactory/home_text12.svg) left top no-repeat;;
}
.point{
    display: flex;
    justify-content: center;
    margin: 50px;
}
.point .point-single{
    width: 320px;
    border: 1px solid #333;
    border-radius: 5px;
    padding: 165px 30px 20px;
    box-sizing: border-box;
    background-size: 320px;
    margin:0 30px;
}
.point .point-single[data-point-index="1"] {
    background: #fff url(../../static/img/vehicleInspectionFactory/point01.jpg) center top no-repeat;
    background-size: 320px;
}
.point .point-single[data-point-index="2"] {
    background: #fff url(../../static/img/vehicleInspectionFactory/point02.jpg) center top no-repeat;
    background-size: 320px;
}
.point .point-single[data-point-index="3"] {
    background: #fff url(../../static/img/vehicleInspectionFactory/point03.jpg) center top no-repeat;
    background-size: 320px;
}
.point .point-single h3{
    padding: 49px 0 0;
    color: #db621b;
    font-size: 22px;
    line-height: 1.5;
    position: relative;
}
.point .point-single h3:before{
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 140px;
    height: 38px;
    border-radius: 5px;
}
.point .point-single[data-point-index="1"] h3:before{
    background: #fff url(../../static/img/vehicleInspectionFactory/home_text13.svg) center center no-repeat;
    background-size: 66px;
}
.point .point-single[data-point-index="2"] h3:before{
    background: #fff url(../../static/img/vehicleInspectionFactory/home_text14.svg) center center no-repeat;
    background-size: 66px;
}
.point .point-single[data-point-index="3"] h3:before{
    background: #fff url(../../static/img/vehicleInspectionFactory/home_text15.svg) center center no-repeat;
    background-size: 66px;
}
.point .point-single p{
    line-height: 1.875;
    margin-top: 10px;
}
.home .cont05{
    margin-bottom:120px;
}
.contact_box {
    background: url(../../static/img/vehicleInspectionFactory/common_bg01.png) top center / cover no-repeat;
    height:500px;
}
.contact_box .inner h2{
    background: url(../../static/img/vehicleInspectionFactory/common_text01.svg) center top no-repeat;
    background-size: 413px;
}
.contact_box .inner .box .tel_box .tel a{
    background: url(../../static/img/vehicleInspectionFactory/contact.svg) no-repeat;
    background-size: 277px;
}
.contact_box .inner .box .tel_box .tel a{
    height: 80px;
}
.contact_box .inner .box .button a,
.contact_box .inner .box .button:nth-of-type(2) a{
    display: block;
    width: 320px;
    height: 50px;
    background: var(--main-color-grade);
    padding: 0 90px;
    border-radius: 25px;
    box-sizing: border-box;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    line-height: 50px;
    text-align: center;
}
.contact_box .inner .box .button a:hover,
.contact_box .inner .box .button:nth-of-type(2) a:hover{
    background: var(--main-color-grade-hover);
    opacity: 1;
}
.home .cont06 .inner .box::before{
    background: var(--pale-blue);
}
.home .cont06 .inner{
    padding: 60px 0;
}
.cont05 .text01{
    font-size:var(--f-l4);
}
.home .cont06 .inner .box .insta_box .h_box h6{
    background: url(../../static/img/vehicleInspectionFactory/home_text22.svg) no-repeat;
}
.home .cont05::after{
    width:1190px;
    border-radius:10px 0 0 10px;
}



/*===============================================
横幅700px以上 sp
===============================================*/
@media screen and (min-width: 700px){
    .sp{
        display:none;
    }
}

/*===============================================
横幅441px以下 sp
===============================================*/

@media screen and (max-width: 441px) {
  :root {
    --f-l1: 26px;
    --f-l2: 22px;
    --f-l3: 18px;
    --f-l4: 16px;
    --f-c: 14px;
    --f-s1: 13px;
    --f-s2: 12px;
    --f-s3: 10px;
  }
    body{
        letter-spacing: initial;
    }
    .pc{
        display:none;
    }


    /* ---- 縦margin ----------------- */
    .vehicle-inspection-process .wrapper,
    .inspection-details .wrapper,
    .reliable-inspection .wrapper,
    .quote-band
    {
        margin:70px 0 0px;
    }
    .home .cont05{
        margin-bottom:0;
    }
    .home .cont06 .inner{
        padding:30px 0 0;
    }


    /* ---- 画像文章 ----------------- */
    .top-first-message .l-1{
        padding-bottom:0;
    }
    .top-first-message{
        padding: 10px 5px;
    }
    .home .cont06 .inner .box .insta_box .insta_photo_box,
    .home .cont06 .inner .box .insta_box .h_box,
    .home .cont05 .h_box,
    footer .inner .h_box{
        width:340px;
    }
    .home .cont05::after,
    .contact_box .inner .box .button a, .contact_box .inner .box .button:nth-of-type(2) a,
    .contact_box .inner .box .tel_box h3{
        width:300px;
    }

    /* ---- 3つのポイント ----------------- */
    .home .cont05 .h_box h2{
        background-size: 132px;
        margin: 0 100px;
    }
    .point{
        flex-direction: column;
        margin: 20px 0;
    }
    .point .point-single{
        margin: 30px auto;
        width: 280px;
    }
    .home .cont05{
        padding: 130px 0 30px;
    }

    /* ---- 24時間受け付け ----------------- */
    .quote .quote-band{
        padding: 30px 20px;
    }
    .quote-band .icon-04{
        padding-right:initial;
    }
    .quote-band .wrapper .l-1{
        font-size: var(--f-l1);
        padding-bottom: 20px;
    }
    .quote-band .container{
        padding:initial;
    }
    .quote .quote-band .container{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .quote .quote-band .container .icon-04{
        margin-bottom:10px;
    }
    .quote-band .wrapper .l-2{
        text-align:center;
        font-size: var(--f-l3);
    }
    .quote-band .wrapper .btn-elem{
        display: flex;
        flex-direction: column;
    }
    .btn-elem > .white-frame-color-btn:first-child{
        margin-right:initial;
    }

    /* ---- WEB車検の流れ ----------------- */
    .vehicle-inspection-process .wrapper, .inspection-details .wrapper, .reliable-inspection .wrapper{
        padding: 70px 5px 75px;
        border-radius: initial;
    }
    .vehicle-inspection-process .frame-main-section-title > .l2, .frame-section-title > .l2{
        font-size: var(--f-l1);
        padding: 0 10px;
    }
    .frame-section-sub-title{
        font-size: var(--f-l3);
        padding: 10px 10px 10px;
    }
    .vehicle-inspection-process .col, .reliable-inspection .col, .inspection-details .col{
        width:100%;
    }
    .vehicle-inspection-process .wrapper .row:nth-of-type(3),
    .vehicle-inspection-process .wrapper .row:nth-of-type(5),
    .vehicle-inspection-process .wrapper > .row,
    .reliable-inspection .row{
        flex-direction:column;
        margin:0 10px;
    }
    .vehicle-inspection-process .col .iframe-box{
        margin-top:20px;
    }
    .vehicle-inspection-process .wrapper .heading{
        padding:5px 20px;
        margin-bottom:20px;
    }
    .capture{
        margin:0 auto;
        width:100%;
    }
    .reliable-inspection .explain-txt{
        margin-bottom:20px;
    }
    .inspection-details .wrapper .row{
        display:flex;
        flex-direction:column;
    }
    .inspection-details .wrapper > .row{
        padding-top:0;
    }
    .inspection-details-box{
        margin: 0 10px 30px;
        padding: 40px 30px 20px;
    }

    /* ---- footer ----------------- */
    .contact_box .inner h2{
        background-size: 276px;
    }
    .contact_box .inner{
        padding: 40px 20px;
    }
    .float-quote-btn{
        display:none;
    }
    footer .line-svg, footer .tel-svg{
        width:225px;
    }
}

/*===============================================
横幅1200px以下
===============================================*/
@media screen and (max-width: 1240px) and (min-width: 441px){
html,
body,
.wrap{
	width:1240px;
}
}
    .main-color-btn.search-btn{
        width: 100%;
    }
