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

/* ========== 基本とトークン ========== */
:root{
--container: 1200px;
--header-h: 86px;
--radius: 12px;
--space: 24px;
--color-primary: #0ca678;       /* 緑系（要調整） */
--color-primary-ink: #065f46;
--color-accent: #ff8a00;        /* オレンジ系 */
--color-bg: #f5f7f7;
--color-text: #111827;
--color-muted: #6b7280;
--white: #fff;
--shadow: 0 8px 24px rgba(0,0,0,.08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--color-text); line-height:1.75; font-family: ヒラギノ角ゴシック, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration: none; }
.skiplink { position:absolute; left:-9999px; top:auto; }
.skiplink:focus { left:16px; top:16px; background:#000; color:#fff; padding:.5rem; z-index:10000; }

/* ラッパー */
.wrapper { max-width: var(--container); margin-inline:auto; padding-inline: 16px; }

/* セクション共通 */
.section { padding: 60px 0; scroll-margin-top: calc(var(--header-h) + 12px); background:#fff; }
.section:nth-of-type(even) { background: #ecf6f0; }
.section__title { margin:0 0 1.25rem; font-size: 32px; text-align: center; font-family: ヒラギノ角ゴ StdN;}
.section_margin {
margin-top: 40px;
}
.section__margin {
margin-top: 40px;
}
/* 見出し最適化 */
h1,h2,h3 { font-weight: 700; line-height:1.3; }
h1 { font-size: clamp(26px, 4.2vw, 40px); }
h2 { font-size: clamp(22px, 3vw, 32px); line-height: 1.5; letter-spacing: 0.05em;}
h3 { font-size: clamp(18px, 2vw, 22px); }
.text_style_01 {
font-size: 42px !important;
color: #00a073;
}
.text_style_02 {
font-size: 42px !important;
color: #fe780c;
}
.text_style_03 {
font-size: 42px !important;
color: #fffb3e;
}
.lead {
text-align: center;
}

/* ========== ヘッダー（追従） ========== */
.site-header {
position: sticky; top:0; z-index: 999;
background: rgba(255,255,255); backdrop-filter: saturate(140%) blur(8px);
border-bottom: 1px solid rgba(0,0,0,.06);
height: var(--header-h);
transition: height .2s ease, box-shadow .2s ease, background .2s ease;
}
.site-header__inner { display:flex; align-items:center; gap: 20px; height: 100%; justify-content: space-between; padding-top: 8px; padding-bottom: 8px;}
.site-header__logo img { width:287px; height:auto; }

/* ナビ */
nav {
display: flex;
align-items: center;
background-color: #fff;
font-size: 16px;
margin-left: auto; /* ← ロゴの右側に押す */
}
.menu {
display: flex;
list-style: none;
padding-left: 0;
margin-left:auto;
}
.menu li {
margin-right: 20px;
}
.menu li:last-child {
margin-right: 0;
}
/* メニューアイコンを右端に固定 */
.menu-icon {
margin-left: auto;
position: relative;
width: 32px;
height: 24px;
flex: 0 0 32px;
cursor: pointer;
display: none;
margin-left:12px;
}
.menu-icon span {
position: absolute;
left: 0; right: 0;
margin: 0 auto;
height: 2px;
background-color: #333;
transition: transform .3s, opacity .2s, top .3s;
}
.menu-icon span:nth-child(1) { top: 0; }
.menu-icon span:nth-child(2) { top: 11px; }
.menu-icon span:nth-child(3) { top: 22px; }

/* ========== メインビジュアル（背景画像+inner） ========== */
.hero {
position: relative;
background-image: image-set(url("../img/img_bg/img_bg.png") 1x);
background-repeat: no-repeat;
background-size: cover;
}
@media (max-width: 767.98px) {
.hero{ min-height: 78vh;
background-image: image-set(url("../img/img_bg/img_bg_sp.png") 1x);
background-size: cover;
}
}
.hero__inner{ position: relative; padding-top: 20px; max-width: 1200px; color:#fff; margin: 0 auto;}
.hero__title{ margin:0 0 .5rem; letter-spacing: 0.05em;}
.hero_img {
display: flex;
padding-bottom: 10px;
}
.img_fv_sp {
display: none;
}
.item_02 {
padding-bottom: 36px;
}
.title_01 {
font-size: 32px;
padding: 16px 60px;
border-radius: 100vh;
background: #01956d;
white-space: nowrap;
}
.title_01 span {
color: #fffb3e;
}
.title_02 {
color: #01956d;
font-size: 66px;
letter-spacing: 0;
-webkit-text-stroke: 8px #fff; /* テキストに黒い縁取り */
paint-order: stroke;
padding: 24px 0 24px;
white-space: nowrap;
}
.item_03 img {
margin: 0 auto;
}
.sp_show{display: none;}
.pc_show{display: block;}

/* ========== ボタン（hover実装） ========== */
.btn{
align-items:center; justify-content:center; gap:20px;
padding: 20px 50px; border-radius: 999px; border: 5px solid transparent; max-width: 920px;
font-weight:700; line-height:1; transition: transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
will-change: transform;}
.btn--tel{ background:#fff; border-color: #18bc90; color: #073599; font-size: 50px; border-radius: 0; display: flex; margin: 0 auto; font-family: Helvetica; text-align: center;}
.tel_label {
font-size: 18px;
color: #000;
margin-top: 0;
align-items: center;
display: flex;
justify-content: center;
}
.tel_label::before,
.tel_label::after {
background-color: #000;
border-radius: 5px;
content: "";
height: 2px;
width: 20px;
}
.tel_label::before {
margin-right: 16px;
transform: rotate(60deg);
}
.tel_label::after {
margin-left: 16px;
transform: rotate(-60deg);
}
.hours {
font-size: 18px;
font-weight: 300;
color: #333;
margin-bottom: 0;
}
.hero_cta {
text-align: right;
}
.btn--tel div {
width: 100%;
}
.icon_tel {
display: flex;
justify-content: center;
gap: 14px;
align-items: center;
}
.bg {
position: relative;
padding-bottom: 0;
}
.bg_tel {
height: 232px;
background-color: #00a073;
position: absolute;
top: 20px;
margin: 0 calc(50% - 50vw);
width: 100vw;
}
.btn_reservation {
display: inline-flex;
font-family: ヒラギノ角ゴシック;
letter-spacing: 0.05em;
width: 330px;
padding: 24px 30px;
margin-bottom: 14px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #d60000, #ed0101); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: right;
gap: 30px;
align-items: center;
}
.hours .hours_box {
border: 1px solid #000;
padding: 6px 8px;
display: inline-block;
margin-left: 10px;
}
.btn_line {
display: inline-flex;
font-family: ヒラギノ角ゴシック;
letter-spacing: 0.05em;
width: 330px;
padding: 17px 30px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #03a803, #06c806); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
gap: 30px;
align-items: center;
}

/* ========== ul・liのボックス ========== */
.box-list{ list-style:none; margin:0 auto; padding:0; display:grid; gap: clamp(32px, 2vw, 40px); grid-template-columns: repeat(2, minmax(0,1fr)); max-width: 920px;}
.box-list__item{
background:#ecf6f0; border-radius: var(--radius); padding: clamp(16px, 2.2vw, 22px);
box-shadow: 0 2px 0 rgba(0,0,0,.02);
}
.box-list__title{ margin:0 0 .25rem; font-size: clamp(18px, 2vw, 24px); color: #00a073; font-family: ヒラギノ角ゴ StdN;}
.box-list__text{ margin:0; color: var(--color-muted);}

/* ========== 九州最安値水準（吹き出し） ========== */
.balloon {
font-size: 20px;
font-weight: 600;
margin-top: 0;
margin-bottom: 36px;
letter-spacing: 0.05em;
color: #fffb3e;
text-align: center;
min-width: 335px;
background: #01956d;
border-radius: 50px;
padding: 15px 58px;
display: inline-block;
position: relative;
left: 50%;
transform: translateX(-50%);
}
.balloon::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 14px;
height: 14px;
background: #01956d;
transform: translate(-50%,55%) rotate(45deg);
transform-origin:center center;
}
.balloon_text {
color: #01956d;
text-align: center;
font-size: 60px;
letter-spacing: 0.05em;
margin: 0 0 32px;
line-height: 1;
}
.lead_dec_02 {
font-size: 20px;
font-weight: 300;
margin-bottom: 0;
}

/* ========== 選ばれる理由 ========== */
.reason_title {
display: flex;
align-items: center;
}
.reason_title h3 {
margin: 0 0 20px 40px;
letter-spacing: 0.05em;
}

/* ========== カード（車種） ========== */
.card-list{ list-style:none; margin:0; padding:0; display:grid; gap: clamp(14px,2vw,20px); grid-template-columns: repeat(1, minmax(0,1fr)); }
.card{ background:#fff; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius); overflow:hidden; display:flex; flex-direction:column; }
.card__title{ margin: 16px 16px 0; font-family: ヒラギノ角ゴ Std; text-align: center; color: #fff; font-size: 30px;}
.card_title_style {
font-size: 40px !important;
color: #fffb3e;
}
.pc_flex {
display: flex;
margin: 0 40px;
gap: 40px;
}
.img_car {
width: 525px;
margin: 0 auto;
order: 2;
}
.img_pc_none {
display: none;
}
.card_bg_container {
background-color: #00a073;
}
.card_lead {
text-align: center;
margin: 14px 0 16px;
font-family: ヒラギノ角ゴシック;
font-size: 18px;
}
.car_model {
font-size: 24px;
color: #00a073;
font-weight: 600;
margin: 40px 0 30px;
border-bottom: solid 2px #00a073;
width: 540px;
}
.item {
width: 122px;
padding: 8px 28px;
border-radius: 8px;
background: #f5d55c;
margin: 16px 16px 24px 0;
}
.card_item_01 {
max-width: 540px;
}
.card_item {
display: flex;
align-items: center;
}
.period {
font-size: 13px;
}
.price {
color: #00a073;
font-weight: 600;
}
.table_border {
border: solid 4px #eeeeed;
background: #fffef6;
border-collapse: collapse;
width: 100%;
margin-bottom: 40px;
}
.td_border {
border: solid 2px #eeeeed;
text-align: center;
height: 86px;
width: 168px;
}

/* ========== ステップ ========== */
.step-list{ max-width: 1100px; ; counter-reset: step; list-style:none; margin:0 auto; padding:0; display:grid; gap:20px; grid-template-columns: repeat(4, minmax(0,1fr));}
.step{ background:#fef9e4; border:3px solid rgba(51,51,51); border-radius: var(--radius); padding: 16px 15px; position: relative; text-align: center; justify-content: center;}
.step_icon {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -25px;
}
.step_title_en {
font-family: Futura PT;
font-weight: 900;
color: #fea52f;
letter-spacing: 0.05em;
margin: 0;
line-height: 0;
}
.step__title {
margin: 54px 0 10px;
}
.step_info{
display: grid;
grid-template-columns: 1fr auto 1fr; /* 左線 | ボックス | 右線 */
align-items: center;
gap: 0;
padding: 60px 16px 40px;
}
.step_text {
margin-bottom: 24px;
}
.info_line{
height: 2px;
background: #00a073;
}
.step_info .box{
width: 100%;
background: #00a073;
border-radius: 0; /* 直角 */
padding: 13px 34px;
}
.info_text{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #fff;
font-size: 24px;
letter-spacing: 0.05em;
font-weight: 600;
}
.license {
margin: 0 auto;
}
.dec_01 {
margin: 0 0 16px;
padding: 2px 10px;
border-left: 3px solid;
height: 35px;
display: flex;
align-items: center;
color: #00a073;
font-weight: bold;
font-size: 24px;
}
.dec_02 {
margin: 24px 0 16px;
padding: 2px 10px;
border-left: 3px solid;
height: 35px;
display: flex;
align-items: center;
color: #00a073;
font-weight: bold;
font-size: 24px;
}
.dec_text_02 {
margin-bottom: 0;
}
.is-open {
display: flex;
justify-content: center;
align-items: center;
}
.is-open_img {
align-items: center;
}
.is-open img{
margin: 0 40px 0 0;
}

/* ========== 整備 ========== */
.box-list_cases { grid-template-columns: repeat(1, minmax(0,1fr)); max-width: 1200px;}
.box-list_cases__title {
font-size: 30px;
}
.cases_info{
display: grid;
grid-template-columns: 1fr auto 1fr; /* 左線 | ボックス | 右線 */
align-items: center;
gap: 0;
padding: 60px 16px 40px;
}
.cases_info_line{
height: 2px;
background: #fe6e04;
}
.cases_info .box{
width: 100%;
background: #fe6e04;
border-radius: 0; /* 直角 */
padding: 13px 145px;
}
.cases_info_text{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #fff;
font-size: 24px;
letter-spacing: 0.05em;
font-weight: 600;
}
.case_title {
display: flex;
align-items: center;
}
.case_title {
color: #333;
padding-top: 24px;
}
.maintenance__item {
background-color: #fff;
display: flex;
gap: 60px;
padding: 40px;
}
.maintenance__item picture {
display: inline-block;
max-width: 100%;
width: fit-content;
}
li.box-list__item.maintenance__item picture img {
display: block;
max-width: 450px;
height: auto;
}
.btn_maintenance {
display: inline-block;
width: 480px;
padding: 24px 115px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #00a073, #00be89); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
}

/* ========== 販売・リース ========== */
.gallery {
display: grid;
grid-template-columns: repeat(3, 1fr); /* 1行に3枚 */
gap: 27px; /* 画像の間隔 */
justify-items: center;
max-width: 1023.98px; /* デモ用：横幅制限 */
margin: auto;
}
.gallery img {
width: 100%;
max-width: 380px;
height: auto;
display: block;
border-radius: 8px; /* 任意の装飾 */
}
.btn-lease {
display: inline-block;
width: 480px;
padding: 24px 95px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #fe6e04, #fc8a36); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
}
.btn-gradient {
text-align: center;
padding-top: 40px;
}

/* ========== 喜びの声 ========== */
.reviews {
display: flex;
align-items: center;
}
.reviews_title {
margin: 0 0 4px 16px;
}

/* ========== FAQ ========== */
.faq-box {
margin-bottom: 16px;
}
.sec9 .faq-box .faq-ttl {
display: flex;
cursor: pointer;
max-width: 920px;
margin: 0 auto;
align-items: stretch;
}

/* ブラウザ標準のマーカーを消す */
summary { list-style: none; }
summary::-webkit-details-marker { display: none; }

/* 左のアイコンボックス */
.sec9 .faq-box .faq_img {
width: 60px;
height: 60px;
position: relative;
background-color: #18bc90;
border-radius: 8px 0 0 8px;
flex: 0 0 60px;
}
.sec9 .faq-box .faq_img img {
width: 24px;
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%,-50%);
}

/* タイトルテキスト＋丸トグル */
.sec9 .faq-box .txt {
flex: 1 1 auto;
background-color: #ecf6f0;
border-radius: 0 8px 8px 0;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 24px;
gap: 12px;
}
.sec9 .faq-box .ttl {
margin: 0;
line-height: 1.5;
font-weight: 600;
color: #333;
}

/* 丸いトグル（中の矢印は ::after） */
.faq-toggle {
color: #18bc90;
display: inline-block;
background-color: #fff;
border-radius: 50%;
width: 40px; height: 40px;
position: relative;
flex: 0 0 40px;
}
.faq-toggle::after {
content: '';
position: absolute;
left: 0; right: 0; margin: 0 auto;
top: 50%;
width: 12px; height: 12px;
border: 3px solid currentColor;
border-left: 0; border-top: 0;
transform: translateY(-50%) rotate(45deg);
transition: transform .3s ease;
}

/* パネルの開閉 */
.faq-detail {
display: grid;
grid-template-rows: 0fr;
overflow: hidden;
opacity: 0;
transition: grid-template-rows .3s ease, opacity .3s ease;
max-width: 920px;
margin: 12px auto 20px;
}
.faq-detail__inner { min-height: 0; }
.faq-detail p {
color: #333;
font-size: 14px;
line-height: 1.75;
margin: 0;
padding: 0 12px 0 84px;
}

/* 開いたとき */
.faq[open] .faq-detail {
grid-template-rows: 1fr;
opacity: 1;
}
/* 矢印を上向きに回転 */
.faq[open] .faq-toggle::after {
transform: translateY(-50%) rotate(-135deg);
}

.faq-ttl:focus { outline: none; }
.faq-ttl:focus-visible {
outline: 2px solid #18bc90;
outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
.faq-detail { transition: none; }
.faq-toggle::after { transition: none; }
}

/* ========== アクセス ========== */
.card-list_access{ max-width: 920px; margin: 0 auto; grid-template-columns: repeat(1, minmax(0,1fr));}
.access_card {
background-color: #ecf6f0;
border: none;
}
.access_card__title {
margin: 13px auto; text-align: center; color: #fff;
}
.card_text {
display: flex;
margin: 0 auto;
gap: 60px;
padding: 40px 0;
align-items: center;
}
.inline-sep{
display:flex;
align-items:center;
gap:24px;
list-style:none;
margin:0;
padding: 0 0 16px;
white-space:nowrap;
}
.inline-sep_last {
padding-bottom: 0;
}
.inline-sep li:first-child {
width: 80px;
}
.inline-sep > li + li{
position:relative;
padding-left:16px;
}
.inline-sep > li + li::before{
content:"";
position:absolute;
left:0;
top:50%;
transform:translateY(-50%);
width:2px;
height:15px;
background:rgba(75,75,75,.5);
}
.map {
margin: 24px auto 0;
width: 920px;
}
.map-img {
width: 920px;
margin: 16px auto 40px;
}
.map iframe {
width: 100%;
height: 260px;
}

/* ========== お問い合わせ ========== */
.childContent {
background-color: #00a073;
padding-bottom: 60px;
}
.childContent_ttl {
margin: 0 auto 30px;
padding-top: 60px;
font-size: 24px;
text-align: center;
color: #fff;
}
.childContent_inner {
max-width: 920px;
padding: 40px 70px;
background: #fff;
border-radius: 10px;
margin: 0 auto;
}
.formQuestions {
display: flex;
justify-content: space-between;
align-items: center;
}
.formQuestions_radio {
margin: 20px auto 0;
display: flex;
justify-content: start;
gap: 0;
}
.radio-group_01 {
display: flex;
width: 100%;
column-gap: 40px;
font-weight: bold;
accent-color: #212121;
margin: 0 auto;
}
.formQuestions .formQuestions_ttls {
display: flex;
align-items: center;
}
.formQuestions_ttls {
width: 350px;
padding-right: 60px;
justify-content: end;
}
.formQuestions_ttls p{
margin: 0;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ttl {
font-size: 16px;
font-weight: bold;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ind {
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
color: #dd2727;
}
.formQuestions_content {
width: 100%;
}
.formQuestions {
margin-top: 10px;
}
.formQuestions .formQuestions_content textarea,
.formQuestions .formQuestions_content input{
width: 100%;
font-family: 'Noto Sans JP', sans-serif;
font-size: 16px;
padding: 10px 15px;
box-sizing: border-box;
border: 2px solid #d2d2d2;
border-radius: 8px;
}
.formSubmit {
margin-top: 40px;
}
.formSubmit .formSubmit_btn {position: relative;display: flex;align-items: center;justify-content: center;width: 100%;max-width: 480px;height: 80px;font-size: 20px;font-weight: bold;color: #fff;background: linear-gradient(180deg,#ed0101,#d60000);border: none;margin: 0 auto;border-radius: 50px;box-shadow: 0px 8px 8px rgba(73, 73, 73,0.2);cursor: pointer;}
.formSubmit .formSubmit_btn::before {
content: "";
position: absolute;
top: 50%;
left: 32.5px;
transform: translateY(-50%);
width: 20px;
height: 16.6px;
background: url(../img/send-ico.png);
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ind {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 22.5px;
font-size: 14px;
color: #fff;
background: #dd0000;
margin-left: 10px;
border-radius: 3px;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_opt {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 22.5px;
font-size: 14px;
color: #fff;
background-color: #073599;
margin-left: 10px;
border-radius: 3px;
}
.formContent_link {
text-align: center;
text-decoration: underline;
color: #207ecd;
}
label[for="radio1"] {
font-weight: 300;
}

/* ========== フッター ========== */
.site-footer{ background:#fff; color:#000; padding: 24px 0; text-align: center;}

/* ========== 共通 ========== */
.lead_dec_01 {
font-size: 18px;
font-weight: 300;
padding-bottom: 40px;
margin-bottom: 0;
}
.br_pc_none {
display: none;
}
.icon {
width: 80px;
position: absolute;
left: -18px;
top: -24px;
}
.bg_white {
padding: 32px 40px;
background-color: #fff;
border: solid 3px #333;
}
.box-list__item {
padding: 24px 40px;
margin: 24px 0 0 10px;
position: relative;
}
.box-list__text {
padding-top: 16px;
font-size: 16px;
}


/* ========== レスポンシブ ========== */
@media (max-width: 1023.98px){
.sp_show img{margin: 0 auto;}
.card-list{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.step-list{ grid-template-columns: repeat(2, minmax(0,1fr));}
.box-list__item img {
margin: 0 auto;
}
.box-list__item p {
max-width: 360px;
margin: 0 auto;
}
.is-open_inner {
width: 80%;
max-width: 446px;
margin: 0 auto;
text-align: left;
}

}

@media (max-width: 767.98px){
:root{ --header-h: 64px; }
.box-list{ grid-template-columns: 1fr; }
.card-list{ grid-template-columns: 1fr; }
/* ========== ヘッダー（追従） ========== */
.site-header__logo img { width:165px; }
/* ナビ */
nav { font-size: 14px;}
.site-header__inner { gap: 10px;}
.menu-icon { display: block; }
.menu { display: none; flex-direction: column; }
.menu.is-open { display: flex; margin: 0;}

/* バツ化 */
body.is-menu-open #menu-icon span:nth-child(1) {
top: 11px; transform: rotate(45deg);
}
body.is-menu-open #menu-icon span:nth-child(2) {
opacity: 0;
}
body.is-menu-open #menu-icon span:nth-child(3) {
top: 11px; transform: rotate(-45deg);
}

.menu {
position: fixed;
height: 380px;
top: var(--header-h);
right: 0;
bottom: 0;
width: 75vw;
max-width: 320px;
background: #fff;
display: none;
flex-direction: column;
gap: 16px;
padding: 20px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
z-index: 1000;
}
/* メニュー本体を画面内に収める */
.menu.is-open{ display: flex; }

/* 端末のノッチ等の安全域に対応（任意） */
.menu{
padding-top: calc(20px + env(safe-area-inset-top));
padding-bottom: calc(20px + env(safe-area-inset-bottom));
}

/* ヘッダーの背後にオーバーレイを敷く（はみ出し誤タッチ防止） */
body::after{
content: "";
position: fixed;
inset: 0;
background: rgba(0,0,0,.35);
opacity: 0;
pointer-events: none;
transition: opacity .3s;
}
body.is-menu-open::after{
opacity: 1;
pointer-events: auto;
}

/* メニュー開時の画面スクロールを止める（はみ出し→背面スクロール防止） */
body.is-menu-open{
overflow: hidden;
touch-action: none;
}
.menu li {
margin-right: 0;
}

/* ========== メインビジュアル（背景画像+inner） ========== */
.img_fv_sp {
display: block;
}
.img_fv_pc {
display: none;
}
.hero__inner{ padding: 24px 0 20px;}
.hero__title{
text-align: center;
margin-bottom: o;
}
.title_02{
line-height: 1;
padding: 20px 0 8px;
font-size: 40px;
}
.item_03{
padding: 8px 0 8px;
}
.item_03 img{
margin: 0 auto;
}
.img_fv img{
margin: 0 auto;
}
.title_01 {
font-size: 18px;
padding: 10px 32px;
}
.btn--tel {
display: block;
padding: 24px 20px;
font-size: 36px;
margin: 0 20px;
}
.hero_img {
display: block;
flex-direction: column;
padding: 0;
}
.img_fv {
order: 2;
}

/* ========== ボタン（hover実装） ========== */
.btn_reservation {
display: inline-flex;
width: 250px;
padding: 16px 26px;
margin-bottom: 10px;
font-size: 14px;
gap: 25px;
}
.hours .hours_box {
padding: 4px 8px;
margin-left: 8px;
}
.btn_reservation img {
width: 30px;
}
.btn_line {
display: inline-flex;
width: 250px;
padding: 10px 24px;
font-size: 14px;
gap: 25px;
}
.btn_line img {
width: 34px;
}
.hero_cta {
text-align: center;
}
.hours {
font-size: 12px;
padding-bottom: 20px;
}
.bg_tel {
height: 305px;
top: 15px;
}
.icon_tel {
gap: 8px;
}
.icon_tel img {
width: 18px;
}

/* ========== 九州最安値水準（吹き出し） ========== */
.balloon_text {
font-size: 38px;
}
.balloon {
font-size: 16px;
border-radius: 50px;
padding: 12px 25px;
margin-bottom: 30px;
}
.balloon::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 10px;
height: 10px;
background: #01956d;
transform: translate(-50%,55%) rotate(45deg);
transform-origin:center center;
}
.lead_dec_02 {
font-size: 16px;
font-weight: 300;
}

/* ========== 料金・車種ラインアップ（カード） ========== */
.img_car {
width: 300px;
order: 1;
}
.img_sp_none {
display: none;
}
.img_pc_none {
display: block;
}
.pc_flex {
display: block;
margin: 0 auto;
}
.card_lead {
font-size: 16px;
}
.card__title {
font-size: 22px;
}
.card_title_style {
font-size: 30px !important;
}
.card_item_flex {
flex-direction: column;
padding: 0 16px;
}
.item_02 {
padding-bottom: 24px;
}
.item_02 img {
margin: 0 auto;
}
.car_model {
font-size: 18px;
margin: 40px auto 16px;
}
.table_border {
order: 3;
margin: 0 auto 40px;
}

/* ========== ステップ ========== */
.step-list{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 40px 10px; margin-top: 20px;}
.step_icon {
width: 50px;
}
.step__title {
margin: 34px 0 10px;
}
.step_text {
margin-bottom: 16px;
}
.step_info .box{
padding: 12px 18px;
}
.step_info {
padding: 60px 0 40px;
}
.info_text{
font-size: 18px;
}
.is-open {
display: block;
}
.is-open img {
margin: 0 auto 24px;
}
.license img{
width: 245px;
}
.is-open_inner {
width: 100%;
}
.dec_01 {
font-size: 18px;
height: 24px;
}
.dec_02 {
font-size: 18px;
height: 24px;
}

/* ========== 整備 ========== */
.cases_info .box{
padding: 12px 102px;
}
.cases_info_text{
font-size: 18px;
}
.cases_info {
padding: 60px 0 40px;
}
.maintenance__item{background-color: #fff; padding: 32px 20px; margin: 0 auto; display: block;}
.maintenance__item img {padding-bottom: 24px;}
.maintenance__item h3 {text-align: center; font-size: 22px;}
li.box-list__item.maintenance__item picture img {
max-width: 100%;
}
.btn_maintenance {
width: 335px;
padding: 20px 68px;
font-size: 16px;
}

/* ========== 販売・リース ========== */
.gallery {
grid-template-columns: repeat(2, 1fr);
}
.btn-lease {
width: 335px;
padding: 20px 52px;
font-size: 16px;
}

/* ========== 喜びの声 ========== */
.icon_reviews {
width: 85px;
height: 85px;
}
.box_reviews {
padding: 32px 16px;
margin: 0;
}
.reviews_title p {
margin: 0 0 14px;
font-size: 12px;
}
.reviews_title h3 {
font-size: 16px;
color: #18bc90;
}
.reviews_title {
margin: 0 0 4px 10px;
}

/* ========== FAQ ========== */
.sec9 .faq-box .faq_img {
width: 40px;
position: relative;
background-color: #18bc90;
border-radius: 6px 0 0 6px;
flex: 0 0 40px;
height: auto;
}
.faq-detail p {
padding: 0 12px 0 40px;
}
.sec9 .faq-box .faq_img img {
width: 15px;
}
.sec9 .faq-box .txt {
font-size: 14px;
}
.sec9 .faq-box .txt {
border-radius: 0 6px 6px 0;
}
.sec9 .faq-box .txt {
padding: 10px;
}
.faq-toggle {
width: 24px; height: 24px;
flex: 0 0 24px;
}
.faq-toggle::after {
width: 8px; height: 8px;
}

/* ========== アクセス ========== */
.access_card img {
padding: 24px 45px;
}
.card_text {
padding: 0 0 32px;
display: block;
}
.inline-sep {
font-size: 14px;
display:flex;
align-items:center;
gap:16px;
list-style:none;
margin:0;
padding: 0 20px 12px;
white-space:nowrap;
}
.inline-sep li:first-child {
width: 70px;
}
.inline-sep_last {
padding-bottom: 0;
}
.inline-sep_last li {
padding-bottom: 0;
}
.map {
width: 100%;
}
.map-img {
width: 100%;
}

/* ========== お問い合わせ ========== */
.formContent_link {
font-size: 12px;
}
.formQuestions .formQuestions_content textarea,
.formQuestions .formQuestions_content input{
border-radius: 5px;
}
.formQuestions_content {
margin-top: 10px;
}
.formQuestions_content p {
margin: 10px 0 24px;
}
.childContent_ttl {
padding-top: 40px;
}
.childContent {
padding: 0 20px 40px;
}
.childContent_inner {
padding: 10px 15px 40px;
}
.formQuestions {
display: block;
margin-top: 20px;
}
.formSubmit .formSubmit_btn {max-width: 295px;height: 63px;font-size: 16px;}
.radio-group_01 {
display: block;
padding-top: 10px;
}
.formQuestions_ttls {
width: 100%;
padding-right: 0;
justify-content: start;
}

/* ========== 共通 ========== */
.box-list__item {
padding: 24px 30px;
}
.sp_show{display: block; margin: 0 auto;}
.pc_show{display: none;}
.dec_text {font-size: 14px;}
.section {
padding: 40px 0;
}
.section_margin {
margin-top: 22px;
}
.section__margin {
margin-top: 0;
}
.section__title {
font-size: 20px;
letter-spacing: 0.025em;
}
.text_style_01 {
font-size: 26px !important;
}
.text_style_02 {
font-size: 26px !important;
}
.text_style_03 {
font-size: 26px !important;
}
.icon {
width: 65px;
position: absolute;
left: -10px;
top: -16px;
}
.box-list__text {
font-size: 14px;
}
.br_pc_none {
display: inline;
}
.br_sp_none {
display: none;
}
.lead_dec_01 {
font-size: 16px;
}


}

@media (prefers-reduced-motion: reduce){ *{ scroll-behavior: auto !important; } .btn{ transition: none; } }
@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap");

/* ========== 基本とトークン ========== */
:root{
--container: 1200px;
--header-h: 86px;
--radius: 12px;
--space: 24px;
--color-primary: #0ca678;       /* 緑系（要調整） */
--color-primary-ink: #065f46;
--color-accent: #ff8a00;        /* オレンジ系 */
--color-bg: #f5f7f7;
--color-text: #111827;
--color-muted: #6b7280;
--white: #fff;
--shadow: 0 8px 24px rgba(0,0,0,.08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--color-text); line-height:1.75; font-family: ヒラギノ角ゴシック, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration: none; }
.skiplink { position:absolute; left:-9999px; top:auto; }
.skiplink:focus { left:16px; top:16px; background:#000; color:#fff; padding:.5rem; z-index:10000; }

/* ラッパー */
.wrapper { max-width: var(--container); margin-inline:auto; padding-inline: 16px; }

/* セクション共通 */
.section { padding: 60px 0; scroll-margin-top: calc(var(--header-h) + 12px); background:#fff; }
.section:nth-of-type(even) { background: #ecf6f0; }
.section__title { margin:0 0 1.25rem; font-size: 32px; text-align: center; font-family: ヒラギノ角ゴ StdN;}
.section_margin {
margin-top: 40px;
}
.section__margin {
margin-top: 40px;
}
/* 見出し最適化 */
h1,h2,h3 { font-weight: 700; line-height:1.3; }
h1 { font-size: clamp(26px, 4.2vw, 40px); }
h2 { font-size: clamp(22px, 3vw, 32px); line-height: 1.5; letter-spacing: 0.05em;}
h3 { font-size: clamp(18px, 2vw, 22px); }
.text_style_01 {
font-size: 42px !important;
color: #00a073;
}
.text_style_02 {
font-size: 42px !important;
color: #fe780c;
}
.text_style_03 {
font-size: 42px !important;
color: #fffb3e;
}
.lead {
text-align: center;
}

/* ========== ヘッダー（追従） ========== */
.site-header {
position: sticky; top:0; z-index: 999;
background: rgba(255,255,255); backdrop-filter: saturate(140%) blur(8px);
border-bottom: 1px solid rgba(0,0,0,.06);
height: var(--header-h);
transition: height .2s ease, box-shadow .2s ease, background .2s ease;
}
.site-header__inner { display:flex; align-items:center; gap: 20px; height: 100%; justify-content: space-between; padding-top: 8px; padding-bottom: 8px;}
.site-header__logo img { width:287px; height:auto; }

/* ナビ */
nav {
display: flex;
align-items: center;
background-color: #fff;
font-size: 16px;
margin-left: auto; /* ← ロゴの右側に押す */
}
.menu {
display: flex;
list-style: none;
padding-left: 0;
margin-left:auto;
}
.menu li {
margin-right: 20px;
}
.menu li:last-child {
margin-right: 0;
}
/* メニューアイコンを右端に固定 */
.menu-icon {
margin-left: auto;
position: relative;
width: 32px;
height: 24px;
flex: 0 0 32px;
cursor: pointer;
display: none;
margin-left:12px;
}
.menu-icon span {
position: absolute;
left: 0; right: 0;
margin: 0 auto;
height: 2px;
background-color: #333;
transition: transform .3s, opacity .2s, top .3s;
}
.menu-icon span:nth-child(1) { top: 0; }
.menu-icon span:nth-child(2) { top: 11px; }
.menu-icon span:nth-child(3) { top: 22px; }

/* ========== メインビジュアル（背景画像+inner） ========== */
.hero {
position: relative;
background-image: image-set(url("../img/img_bg/img_bg.png") 1x);
background-repeat: no-repeat;
background-size: cover;
}
@media (max-width: 767.98px) {
.hero{ min-height: 78vh;
background-image: image-set(url("../img/img_bg/img_bg_sp.png") 1x);
background-size: cover;
}
}
.hero__inner{ position: relative; padding-top: 20px; max-width: 1200px; color:#fff; margin: 0 auto;}
.hero__title{ margin:0 0 .5rem; letter-spacing: 0.05em;}
.hero_img {
display: flex;
padding-bottom: 10px;
}
.img_fv_sp {
display: none;
}
.item_02 {
padding-bottom: 36px;
}
.title_01 {
font-size: 32px;
padding: 16px 60px;
border-radius: 100vh;
background: #01956d;
white-space: nowrap;
}
.title_01 span {
color: #fffb3e;
}
.title_02 {
color: #01956d;
font-size: 66px;
letter-spacing: 0;
-webkit-text-stroke: 8px #fff; /* テキストに黒い縁取り */
paint-order: stroke;
padding: 24px 0 24px;
white-space: nowrap;
}
.item_03 img {
margin: 0 auto;
}
.sp_show{display: none;}
.pc_show{display: block;}

/* ========== ボタン（hover実装） ========== */
.btn{
align-items:center; justify-content:center; gap:20px;
padding: 20px 50px; border-radius: 999px; border: 5px solid transparent; max-width: 920px;
font-weight:700; line-height:1; transition: transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
will-change: transform;}
.btn--tel{ background:#fff; border-color: #18bc90; color: #073599; font-size: 50px; border-radius: 0; display: flex; margin: 0 auto; font-family: Helvetica; text-align: center;}
.tel_label {
font-size: 18px;
color: #000;
margin-top: 0;
align-items: center;
display: flex;
justify-content: center;
}
.tel_label::before,
.tel_label::after {
background-color: #000;
border-radius: 5px;
content: "";
height: 2px;
width: 20px;
}
.tel_label::before {
margin-right: 16px;
transform: rotate(60deg);
}
.tel_label::after {
margin-left: 16px;
transform: rotate(-60deg);
}
.hours {
font-size: 18px;
font-weight: 300;
color: #333;
margin-bottom: 0;
}
.hero_cta {
text-align: right;
}
.btn--tel div {
width: 100%;
}
.icon_tel {
display: flex;
justify-content: center;
gap: 14px;
align-items: center;
}
.bg {
position: relative;
padding-bottom: 0;
}
.bg_tel {
height: 232px;
background-color: #00a073;
position: absolute;
top: 20px;
margin: 0 calc(50% - 50vw);
width: 100vw;
}
.btn_reservation {
display: inline-flex;
font-family: ヒラギノ角ゴシック;
letter-spacing: 0.05em;
width: 330px;
padding: 24px 30px;
margin-bottom: 14px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #d60000, #ed0101); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: right;
gap: 30px;
align-items: center;
}
.hours .hours_box {
border: 1px solid #000;
padding: 6px 8px;
display: inline-block;
margin-left: 10px;
}
.btn_line {
display: inline-flex;
font-family: ヒラギノ角ゴシック;
letter-spacing: 0.05em;
width: 330px;
padding: 17px 30px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #03a803, #06c806); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
gap: 30px;
align-items: center;
}

/* ========== ul・liのボックス ========== */
.box-list{ list-style:none; margin:0 auto; padding:0; display:grid; gap: clamp(32px, 2vw, 40px); grid-template-columns: repeat(2, minmax(0,1fr)); max-width: 920px;}
.box-list__item{
background:#ecf6f0; border-radius: var(--radius); padding: clamp(16px, 2.2vw, 22px);
box-shadow: 0 2px 0 rgba(0,0,0,.02);
}
.box-list__title{ margin:0 0 .25rem; font-size: clamp(18px, 2vw, 24px); color: #00a073; font-family: ヒラギノ角ゴ StdN;}
.box-list__text{ margin:0; color: var(--color-muted);}

/* ========== 九州最安値水準（吹き出し） ========== */
.balloon {
font-size: 20px;
font-weight: 600;
margin-top: 0;
margin-bottom: 36px;
letter-spacing: 0.05em;
color: #fffb3e;
text-align: center;
min-width: 335px;
background: #01956d;
border-radius: 50px;
padding: 15px 58px;
display: inline-block;
position: relative;
left: 50%;
transform: translateX(-50%);
}
.balloon::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 14px;
height: 14px;
background: #01956d;
transform: translate(-50%,55%) rotate(45deg);
transform-origin:center center;
}
.balloon_text {
color: #01956d;
text-align: center;
font-size: 60px;
letter-spacing: 0.05em;
margin: 0 0 32px;
line-height: 1;
}
.lead_dec_02 {
font-size: 20px;
font-weight: 300;
margin-bottom: 0;
}

/* ========== 選ばれる理由 ========== */
.reason_title {
display: flex;
align-items: center;
}
.reason_title h3 {
margin: 0 0 20px 40px;
letter-spacing: 0.05em;
}

/* ========== カード（車種） ========== */
.card-list{ list-style:none; margin:0; padding:0; display:grid; gap: clamp(14px,2vw,20px); grid-template-columns: repeat(1, minmax(0,1fr)); }
.card{ background:#fff; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius); overflow:hidden; display:flex; flex-direction:column; }
.card__title{ margin: 16px 16px 0; font-family: ヒラギノ角ゴ Std; text-align: center; color: #fff; font-size: 30px;}
.card_title_style {
font-size: 40px !important;
color: #fffb3e;
}
.pc_flex {
display: flex;
margin: 0 40px;
gap: 40px;
}
.img_car {
width: 525px;
margin: 0 auto;
order: 2;
}
.img_pc_none {
display: none;
}
.card_bg_container {
background-color: #00a073;
}
.card_lead {
text-align: center;
margin: 14px 0 16px;
font-family: ヒラギノ角ゴシック;
font-size: 18px;
}
.car_model {
font-size: 24px;
color: #00a073;
font-weight: 600;
margin: 40px 0 30px;
border-bottom: solid 2px #00a073;
width: 540px;
}
.item {
width: 122px;
padding: 8px 28px;
border-radius: 8px;
background: #f5d55c;
margin: 16px 16px 24px 0;
}
.card_item_01 {
max-width: 540px;
}
.card_item {
display: flex;
align-items: center;
}
.period {
font-size: 13px;
}
.price {
color: #00a073;
font-weight: 600;
}
.table_border {
border: solid 4px #eeeeed;
background: #fffef6;
border-collapse: collapse;
width: 100%;
margin-bottom: 40px;
}
.td_border {
border: solid 2px #eeeeed;
text-align: center;
height: 86px;
width: 168px;
}

/* ========== ステップ ========== */
.step-list{ max-width: 1100px; ; counter-reset: step; list-style:none; margin:0 auto; padding:0; display:grid; gap:20px; grid-template-columns: repeat(4, minmax(0,1fr));}
.step{ background:#fef9e4; border:3px solid rgba(51,51,51); border-radius: var(--radius); padding: 16px 15px; position: relative; text-align: center; justify-content: center;}
.step_icon {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -25px;
}
.step_title_en {
font-family: Futura PT;
font-weight: 900;
color: #fea52f;
letter-spacing: 0.05em;
margin: 0;
line-height: 0;
}
.step__title {
margin: 54px 0 10px;
}
.step_info{
display: grid;
grid-template-columns: 1fr auto 1fr; /* 左線 | ボックス | 右線 */
align-items: center;
gap: 0;
padding: 60px 16px 40px;
}
.step_text {
margin-bottom: 24px;
}
.info_line{
height: 2px;
background: #00a073;
}
.step_info .box{
width: 100%;
background: #00a073;
border-radius: 0; /* 直角 */
padding: 13px 34px;
}
.info_text{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #fff;
font-size: 24px;
letter-spacing: 0.05em;
font-weight: 600;
}
.license {
margin: 0 auto;
}
.dec_01 {
margin: 0 0 16px;
padding: 2px 10px;
border-left: 3px solid;
height: 35px;
display: flex;
align-items: center;
color: #00a073;
font-weight: bold;
font-size: 24px;
}
.dec_02 {
margin: 24px 0 16px;
padding: 2px 10px;
border-left: 3px solid;
height: 35px;
display: flex;
align-items: center;
color: #00a073;
font-weight: bold;
font-size: 24px;
}
.dec_text_02 {
margin-bottom: 0;
}
.is-open {
display: flex;
justify-content: center;
align-items: center;
}
.is-open_img {
align-items: center;
}
.is-open img{
margin: 0 40px 0 0;
}

/* ========== 整備 ========== */
.box-list_cases { grid-template-columns: repeat(1, minmax(0,1fr)); max-width: 1200px;}
.box-list_cases__title {
font-size: 30px;
}
.cases_info{
display: grid;
grid-template-columns: 1fr auto 1fr; /* 左線 | ボックス | 右線 */
align-items: center;
gap: 0;
padding: 60px 16px 40px;
}
.cases_info_line{
height: 2px;
background: #fe6e04;
}
.cases_info .box{
width: 100%;
background: #fe6e04;
border-radius: 0; /* 直角 */
padding: 13px 145px;
}
.cases_info_text{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #fff;
font-size: 24px;
letter-spacing: 0.05em;
font-weight: 600;
}
.case_title {
display: flex;
align-items: center;
}
.case_title {
color: #333;
padding-top: 24px;
}
.maintenance__item {
background-color: #fff;
display: flex;
gap: 60px;
padding: 40px;
}
.maintenance__item picture {
display: inline-block;
max-width: 100%;
width: fit-content;
}
li.box-list__item.maintenance__item picture img {
display: block;
max-width: 450px;
height: auto;
}
.btn_maintenance {
display: inline-block;
width: 480px;
padding: 24px 115px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #00a073, #00be89); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
}

/* ========== 販売・リース ========== */
.gallery {
display: grid;
grid-template-columns: repeat(3, 1fr); /* 1行に3枚 */
gap: 27px; /* 画像の間隔 */
justify-items: center;
max-width: 1023.98px; /* デモ用：横幅制限 */
margin: auto;
}
.gallery img {
width: 100%;
max-width: 380px;
height: auto;
display: block;
border-radius: 8px; /* 任意の装飾 */
}
.btn-lease {
display: inline-block;
width: 480px;
padding: 24px 95px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #fe6e04, #fc8a36); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
}
.btn-gradient {
text-align: center;
padding-top: 40px;
}

/* ========== 喜びの声 ========== */
.reviews {
display: flex;
align-items: center;
}
.reviews_title {
margin: 0 0 4px 16px;
}

/* ========== FAQ ========== */
.faq-box {
margin-bottom: 16px;
}
.sec9 .faq-box .faq-ttl {
display: flex;
cursor: pointer;
max-width: 920px;
margin: 0 auto;
align-items: stretch;
}

/* ブラウザ標準のマーカーを消す */
summary { list-style: none; }
summary::-webkit-details-marker { display: none; }

/* 左のアイコンボックス */
.sec9 .faq-box .faq_img {
width: 60px;
height: 60px;
position: relative;
background-color: #18bc90;
border-radius: 8px 0 0 8px;
flex: 0 0 60px;
}
.sec9 .faq-box .faq_img img {
width: 24px;
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%,-50%);
}

/* タイトルテキスト＋丸トグル */
.sec9 .faq-box .txt {
flex: 1 1 auto;
background-color: #ecf6f0;
border-radius: 0 8px 8px 0;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 24px;
gap: 12px;
}
.sec9 .faq-box .ttl {
margin: 0;
line-height: 1.5;
font-weight: 600;
color: #333;
}

/* 丸いトグル（中の矢印は ::after） */
.faq-toggle {
color: #18bc90;
display: inline-block;
background-color: #fff;
border-radius: 50%;
width: 40px; height: 40px;
position: relative;
flex: 0 0 40px;
}
.faq-toggle::after {
content: '';
position: absolute;
left: 0; right: 0; margin: 0 auto;
top: 50%;
width: 12px; height: 12px;
border: 3px solid currentColor;
border-left: 0; border-top: 0;
transform: translateY(-50%) rotate(45deg);
transition: transform .3s ease;
}

/* パネルの開閉 */
.faq-detail {
display: grid;
grid-template-rows: 0fr;
overflow: hidden;
opacity: 0;
transition: grid-template-rows .3s ease, opacity .3s ease;
max-width: 920px;
margin: 12px auto 20px;
}
.faq-detail__inner { min-height: 0; }
.faq-detail p {
color: #333;
font-size: 14px;
line-height: 1.75;
margin: 0;
padding: 0 12px 0 84px;
}

/* 開いたとき */
.faq[open] .faq-detail {
grid-template-rows: 1fr;
opacity: 1;
}
/* 矢印を上向きに回転 */
.faq[open] .faq-toggle::after {
transform: translateY(-50%) rotate(-135deg);
}

.faq-ttl:focus { outline: none; }
.faq-ttl:focus-visible {
outline: 2px solid #18bc90;
outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
.faq-detail { transition: none; }
.faq-toggle::after { transition: none; }
}

/* ========== アクセス ========== */
.card-list_access{ max-width: 920px; margin: 0 auto; grid-template-columns: repeat(1, minmax(0,1fr));}
.access_card {
background-color: #ecf6f0;
border: none;
}
.access_card__title {
margin: 13px auto; text-align: center; color: #fff;
}
.card_text {
display: flex;
margin: 0 auto;
gap: 60px;
padding: 40px 0;
align-items: center;
}
.inline-sep{
display:flex;
align-items:center;
gap:24px;
list-style:none;
margin:0;
padding: 0 0 16px;
white-space:nowrap;
}
.inline-sep_last {
padding-bottom: 0;
}
.inline-sep li:first-child {
width: 80px;
}
.inline-sep > li + li{
position:relative;
padding-left:16px;
}
.inline-sep > li + li::before{
content:"";
position:absolute;
left:0;
top:50%;
transform:translateY(-50%);
width:2px;
height:15px;
background:rgba(75,75,75,.5);
}
.map {
margin: 24px auto 0;
width: 920px;
}
.map-img {
width: 920px;
margin: 16px auto 40px;
}
.map iframe {
width: 100%;
height: 260px;
}

/* ========== お問い合わせ ========== */
.childContent {
background-color: #00a073;
padding-bottom: 60px;
}
.childContent_ttl {
margin: 0 auto 30px;
padding-top: 60px;
font-size: 24px;
text-align: center;
color: #fff;
}
.childContent_inner {
max-width: 920px;
padding: 40px 70px;
background: #fff;
border-radius: 10px;
margin: 0 auto;
}
.formQuestions {
display: flex;
justify-content: space-between;
align-items: center;
}
.formQuestions_radio {
margin: 20px auto 0;
display: flex;
justify-content: start;
gap: 0;
}
.radio-group_01 {
display: flex;
width: 100%;
column-gap: 40px;
font-weight: bold;
accent-color: #212121;
margin: 0 auto;
}
.formQuestions .formQuestions_ttls {
display: flex;
align-items: center;
}
.formQuestions_ttls {
width: 350px;
padding-right: 60px;
justify-content: end;
}
.formQuestions_ttls p{
margin: 0;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ttl {
font-size: 16px;
font-weight: bold;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ind {
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
color: #dd2727;
}
.formQuestions_content {
width: 100%;
}
.formQuestions {
margin-top: 10px;
}
.formQuestions .formQuestions_content textarea,
.formQuestions .formQuestions_content input{
width: 100%;
font-family: 'Noto Sans JP', sans-serif;
font-size: 16px;
padding: 10px 15px;
box-sizing: border-box;
border: 2px solid #d2d2d2;
border-radius: 8px;
}
.formSubmit {
margin-top: 40px;
}
.formSubmit .formSubmit_btn {position: relative;display: flex;align-items: center;justify-content: center;width: 100%;max-width: 480px;height: 80px;font-size: 20px;font-weight: bold;color: #fff;background: linear-gradient(180deg,#ed0101,#d60000);border: none;margin: 0 auto;border-radius: 50px;box-shadow: 0px 8px 8px rgba(73, 73, 73,0.2);cursor: pointer;}
.formSubmit .formSubmit_btn::before {
content: "";
position: absolute;
top: 50%;
left: 32.5px;
transform: translateY(-50%);
width: 20px;
height: 16.6px;
background: url(../img/send-ico.png);
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ind {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 22.5px;
font-size: 14px;
color: #fff;
background: #dd0000;
margin-left: 10px;
border-radius: 3px;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_opt {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 22.5px;
font-size: 14px;
color: #fff;
background-color: #073599;
margin-left: 10px;
border-radius: 3px;
}
.formContent_link {
text-align: center;
text-decoration: underline;
color: #207ecd;
}
label[for="radio1"] {
font-weight: 300;
}

/* ========== フッター ========== */
.site-footer{ background:#fff; color:#000; padding: 24px 0; text-align: center;}

/* ========== 共通 ========== */
.lead_dec_01 {
font-size: 18px;
font-weight: 300;
padding-bottom: 40px;
margin-bottom: 0;
}
.br_pc_none {
display: none;
}
.icon {
width: 80px;
position: absolute;
left: -18px;
top: -24px;
}
.bg_white {
padding: 32px 40px;
background-color: #fff;
border: solid 3px #333;
}
.box-list__item {
padding: 24px 40px;
margin: 24px 0 0 10px;
position: relative;
}
.box-list__text {
padding-top: 16px;
font-size: 16px;
}


/* ========== レスポンシブ ========== */
@media (max-width: 1023.98px){
.sp_show img{margin: 0 auto;}
.card-list{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.step-list{ grid-template-columns: repeat(2, minmax(0,1fr));}
.box-list__item img {
margin: 0 auto;
}
.box-list__item p {
max-width: 360px;
margin: 0 auto;
}
.is-open_inner {
width: 80%;
max-width: 446px;
margin: 0 auto;
text-align: left;
}

}

@media (max-width: 767.98px){
:root{ --header-h: 64px; }
.box-list{ grid-template-columns: 1fr; }
.card-list{ grid-template-columns: 1fr; }
/* ========== ヘッダー（追従） ========== */
.site-header__logo img { width:165px; }
/* ナビ */
nav { font-size: 14px;}
.site-header__inner { gap: 10px;}
.menu-icon { display: block; }
.menu { display: none; flex-direction: column; }
.menu.is-open { display: flex; margin: 0;}

/* バツ化 */
body.is-menu-open #menu-icon span:nth-child(1) {
top: 11px; transform: rotate(45deg);
}
body.is-menu-open #menu-icon span:nth-child(2) {
opacity: 0;
}
body.is-menu-open #menu-icon span:nth-child(3) {
top: 11px; transform: rotate(-45deg);
}

.menu {
position: fixed;
height: 380px;
top: var(--header-h);
right: 0;
bottom: 0;
width: 75vw;
max-width: 320px;
background: #fff;
display: none;
flex-direction: column;
gap: 16px;
padding: 20px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
z-index: 1000;
}
/* メニュー本体を画面内に収める */
.menu.is-open{ display: flex; }

/* 端末のノッチ等の安全域に対応（任意） */
.menu{
padding-top: calc(20px + env(safe-area-inset-top));
padding-bottom: calc(20px + env(safe-area-inset-bottom));
}

/* ヘッダーの背後にオーバーレイを敷く（はみ出し誤タッチ防止） */
body::after{
content: "";
position: fixed;
inset: 0;
background: rgba(0,0,0,.35);
opacity: 0;
pointer-events: none;
transition: opacity .3s;
}
body.is-menu-open::after{
opacity: 1;
pointer-events: auto;
}

/* メニュー開時の画面スクロールを止める（はみ出し→背面スクロール防止） */
body.is-menu-open{
overflow: hidden;
touch-action: none;
}
.menu li {
margin-right: 0;
}

/* ========== メインビジュアル（背景画像+inner） ========== */
.img_fv_sp {
display: block;
}
.img_fv_pc {
display: none;
}
.hero__inner{ padding: 24px 0 20px;}
.hero__title{
text-align: center;
margin-bottom: o;
}
.title_02{
line-height: 1;
padding: 20px 0 8px;
font-size: 40px;
}
.item_03{
padding: 8px 0 8px;
}
.item_03 img{
margin: 0 auto;
}
.img_fv img{
margin: 0 auto;
}
.title_01 {
font-size: 18px;
padding: 10px 32px;
}
.btn--tel {
display: block;
padding: 24px 20px;
font-size: 36px;
margin: 0 20px;
}
.hero_img {
display: block;
flex-direction: column;
padding: 0;
}
.img_fv {
order: 2;
}

/* ========== ボタン（hover実装） ========== */
.btn_reservation {
display: inline-flex;
width: 250px;
padding: 16px 26px;
margin-bottom: 10px;
font-size: 14px;
gap: 25px;
}
.hours .hours_box {
padding: 4px 8px;
margin-left: 8px;
}
.btn_reservation img {
width: 30px;
}
.btn_line {
display: inline-flex;
width: 250px;
padding: 10px 24px;
font-size: 14px;
gap: 25px;
}
.btn_line img {
width: 34px;
}
.hero_cta {
text-align: center;
}
.hours {
font-size: 12px;
padding-bottom: 20px;
}
.bg_tel {
height: 305px;
top: 15px;
}
.icon_tel {
gap: 8px;
}
.icon_tel img {
width: 18px;
}

/* ========== 九州最安値水準（吹き出し） ========== */
.balloon_text {
font-size: 38px;
}
.balloon {
font-size: 16px;
border-radius: 50px;
padding: 12px 25px;
margin-bottom: 30px;
}
.balloon::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 10px;
height: 10px;
background: #01956d;
transform: translate(-50%,55%) rotate(45deg);
transform-origin:center center;
}
.lead_dec_02 {
font-size: 16px;
font-weight: 300;
}

/* ========== 料金・車種ラインアップ（カード） ========== */
.img_car {
width: 300px;
order: 1;
}
.img_sp_none {
display: none;
}
.img_pc_none {
display: block;
}
.pc_flex {
display: block;
margin: 0 auto;
}
.card_lead {
font-size: 16px;
}
.card__title {
font-size: 22px;
}
.card_title_style {
font-size: 30px !important;
}
.card_item_flex {
flex-direction: column;
padding: 0 16px;
}
.item_02 {
padding-bottom: 24px;
}
.item_02 img {
margin: 0 auto;
}
.car_model {
font-size: 18px;
margin: 40px auto 16px;
}
.table_border {
order: 3;
margin: 0 auto 40px;
}

/* ========== ステップ ========== */
.step-list{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 40px 10px; margin-top: 20px;}
.step_icon {
width: 50px;
}
.step__title {
margin: 34px 0 10px;
}
.step_text {
margin-bottom: 16px;
}
.step_info .box{
padding: 12px 18px;
}
.step_info {
padding: 60px 0 40px;
}
.info_text{
font-size: 18px;
}
.is-open {
display: block;
}
.is-open img {
margin: 0 auto 24px;
}
.license img{
width: 245px;
}
.is-open_inner {
width: 100%;
}
.dec_01 {
font-size: 18px;
height: 24px;
}
.dec_02 {
font-size: 18px;
height: 24px;
}

/* ========== 整備 ========== */
.cases_info .box{
padding: 12px 102px;
}
.cases_info_text{
font-size: 18px;
}
.cases_info {
padding: 60px 0 40px;
}
.maintenance__item{background-color: #fff; padding: 32px 20px; margin: 0 auto; display: block;}
.maintenance__item img {padding-bottom: 24px;}
.maintenance__item h3 {text-align: center; font-size: 22px;}
li.box-list__item.maintenance__item picture img {
max-width: 100%;
}
.btn_maintenance {
width: 335px;
padding: 20px 68px;
font-size: 16px;
}

/* ========== 販売・リース ========== */
.gallery {
grid-template-columns: repeat(2, 1fr);
}
.btn-lease {
width: 335px;
padding: 20px 52px;
font-size: 16px;
}

/* ========== 喜びの声 ========== */
.icon_reviews {
width: 85px;
height: 85px;
}
.box_reviews {
padding: 32px 16px;
margin: 0;
}
.reviews_title p {
margin: 0 0 14px;
font-size: 12px;
}
.reviews_title h3 {
font-size: 16px;
color: #18bc90;
}
.reviews_title {
margin: 0 0 4px 10px;
}

/* ========== FAQ ========== */
.sec9 .faq-box .faq_img {
width: 40px;
position: relative;
background-color: #18bc90;
border-radius: 6px 0 0 6px;
flex: 0 0 40px;
height: auto;
}
.faq-detail p {
padding: 0 12px 0 40px;
}
.sec9 .faq-box .faq_img img {
width: 15px;
}
.sec9 .faq-box .txt {
font-size: 14px;
}
.sec9 .faq-box .txt {
border-radius: 0 6px 6px 0;
}
.sec9 .faq-box .txt {
padding: 10px;
}
.faq-toggle {
width: 24px; height: 24px;
flex: 0 0 24px;
}
.faq-toggle::after {
width: 8px; height: 8px;
}

/* ========== アクセス ========== */
.access_card img {
padding: 24px 45px;
}
.card_text {
padding: 0 0 32px;
display: block;
}
.inline-sep {
font-size: 14px;
display:flex;
align-items:center;
gap:16px;
list-style:none;
margin:0;
padding: 0 20px 12px;
white-space:nowrap;
}
.inline-sep li:first-child {
width: 70px;
}
.inline-sep_last {
padding-bottom: 0;
}
.inline-sep_last li {
padding-bottom: 0;
}
.map {
width: 100%;
}
.map-img {
width: 100%;
}

/* ========== お問い合わせ ========== */
.formContent_link {
font-size: 12px;
}
.formQuestions .formQuestions_content textarea,
.formQuestions .formQuestions_content input{
border-radius: 5px;
}
.formQuestions_content {
margin-top: 10px;
}
.formQuestions_content p {
margin: 10px 0 24px;
}
.childContent_ttl {
padding-top: 40px;
}
.childContent {
padding: 0 20px 40px;
}
.childContent_inner {
padding: 10px 15px 40px;
}
.formQuestions {
display: block;
margin-top: 20px;
}
.formSubmit .formSubmit_btn {max-width: 295px;height: 63px;font-size: 16px;}
.radio-group_01 {
display: block;
padding-top: 10px;
}
.formQuestions_ttls {
width: 100%;
padding-right: 0;
justify-content: start;
}

/* ========== 共通 ========== */
.box-list__item {
padding: 24px 30px;
}
.sp_show{display: block; margin: 0 auto;}
.pc_show{display: none;}
.dec_text {font-size: 14px;}
.section {
padding: 40px 0;
}
.section_margin {
margin-top: 22px;
}
.section__margin {
margin-top: 0;
}
.section__title {
font-size: 20px;
letter-spacing: 0.025em;
}
.text_style_01 {
font-size: 26px !important;
}
.text_style_02 {
font-size: 26px !important;
}
.text_style_03 {
font-size: 26px !important;
}
.icon {
width: 65px;
position: absolute;
left: -10px;
top: -16px;
}
.box-list__text {
font-size: 14px;
}
.br_pc_none {
display: inline;
}
.br_sp_none {
display: none;
}
.lead_dec_01 {
font-size: 16px;
}


}

@media (prefers-reduced-motion: reduce){ *{ scroll-behavior: auto !important; } .btn{ transition: none; } }
@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap");

/* ========== 基本とトークン ========== */
:root{
--container: 1200px;
--header-h: 86px;
--radius: 12px;
--space: 24px;
--color-primary: #0ca678;       /* 緑系（要調整） */
--color-primary-ink: #065f46;
--color-accent: #ff8a00;        /* オレンジ系 */
--color-bg: #f5f7f7;
--color-text: #111827;
--color-muted: #6b7280;
--white: #fff;
--shadow: 0 8px 24px rgba(0,0,0,.08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--color-text); line-height:1.75; font-family: ヒラギノ角ゴシック, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration: none; }
.skiplink { position:absolute; left:-9999px; top:auto; }
.skiplink:focus { left:16px; top:16px; background:#000; color:#fff; padding:.5rem; z-index:10000; }

/* ラッパー */
.wrapper {max-width: var(--container);margin-inline:auto;padding-inline: 16px;}

/* セクション共通 */
.section { padding: 60px 0; scroll-margin-top: calc(var(--header-h) + 12px); background:#fff; }
.section:nth-of-type(even) { background: #ecf6f0; }
.section__title { margin:0 0 1.25rem; font-size: 32px; text-align: center; font-family: ヒラギノ角ゴ StdN;}
.section_margin {
margin-top: 40px;
}
.section__margin {
margin-top: 40px;
}
/* 見出し最適化 */
h1,h2,h3 { font-weight: 700; line-height:1.3; }
h1 { font-size: clamp(26px, 4.2vw, 40px); }
h2 { font-size: clamp(22px, 3vw, 32px); line-height: 1.5; letter-spacing: 0.05em;}
h3 { font-size: clamp(18px, 2vw, 22px); }
.text_style_01 {
font-size: 42px !important;
color: #00a073;
}
.text_style_02 {
font-size: 42px !important;
color: #fe780c;
}
.text_style_03 {
font-size: 42px !important;
color: #fffb3e;
}
.lead {
text-align: center;
}

/* ========== ヘッダー（追従） ========== */
.site-header {
position: sticky; top:0; z-index: 999;
background: rgba(255,255,255); backdrop-filter: saturate(140%) blur(8px);
border-bottom: 1px solid rgba(0,0,0,.06);
height: var(--header-h);
transition: height .2s ease, box-shadow .2s ease, background .2s ease;
}
.site-header__inner {display:flex;align-items:center;gap: 20px;height: 100%;justify-content: space-between;padding-top: 8px;padding-bottom: 8px;}
.site-header__logo img { width:287px; height:auto; }

/* ナビ */
nav {
display: flex;
align-items: center;
background-color: #fff;
font-size: 16px;
margin-left: auto; /* ← ロゴの右側に押す */
}
.menu {
display: flex;
list-style: none;
padding-left: 0;
margin-left:auto;
}
.menu li {
margin-right: 20px;
}
.menu li:last-child {
margin-right: 0;
}
/* メニューアイコンを右端に固定 */
.menu-icon {
margin-left: auto;
position: relative;
width: 32px;
height: 24px;
flex: 0 0 32px;
cursor: pointer;
display: none;
margin-left:12px;
}
.menu-icon span {
position: absolute;
left: 0; right: 0;
margin: 0 auto;
height: 2px;
background-color: #333;
transition: transform .3s, opacity .2s, top .3s;
}
.menu-icon span:nth-child(1) { top: 0; }
.menu-icon span:nth-child(2) { top: 11px; }
.menu-icon span:nth-child(3) { top: 22px; }

.menu-item a {
position: relative;
display: inline-block;
color: #333;      /* 通常の文字色 */
text-decoration: none;
padding-bottom: 4px;  /* 下線部分のスペース */
}

.menu-item a::after {
content: "";
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%) scaleX(0);
transform-origin: center center;
width: 100%;
height: 2px;   /* 下線の太さ */
background-color: #444;  /* 下線の色 */
transition: transform 0.3s ease;
}

.menu-item a:hover::after,
.menu-item a:focus::after {
transform: translateX(-50%) scaleX(1);
}

/* ========== メインビジュアル（背景画像+inner） ========== */
.hero {
position: relative;
background-image: image-set(url("../img/img_bg/img_bg.png") 1x);
background-repeat: no-repeat;
background-size: cover;
}
.item_03 {
max-width: 500px;
}
@media (max-width: 767.98px) {
.hero{min-height: 78vh;background-image: image-set(url("../img/img_bg/img_bg_sp.png") 1x);background-size: cover;}
}
.hero__inner{ position: relative; padding-top: 20px; max-width: 1200px; color:#fff; margin: 0 auto;}
.hero__title{ margin:0 0 .5rem; letter-spacing: 0.05em;}
.hero_img {
display: flex;
padding-bottom: 10px;
}
.img_fv_sp {
display: none;
}
.item_02 {
padding-bottom: 36px;
}
.title_01 {
font-size: 32px;
padding: 16px 60px;
border-radius: 100vh;
background: #01956d;
white-space: nowrap;
}
.title_01 span {
color: #fffb3e;
}
.title_02 {
color: #01956d;
font-size: 66px;
letter-spacing: 0;
-webkit-text-stroke: 8px #fff; /* テキストに黒い縁取り */
paint-order: stroke;
padding: 24px 0 24px;
white-space: nowrap;
}
.item_03 img {
margin: 0 auto;
}
.sp_show{display: none;}
.pc_show{display: block;}

/* ========== ボタン（hover実装） ========== */
.btn{
align-items:center; justify-content:center; gap:20px;
padding: 20px 50px; border-radius: 999px; border: 5px solid transparent; max-width: 920px;
font-weight:700; line-height:1; transition: transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
will-change: transform;}
.btn--tel{ background:#fff; border-color: #18bc90; color: #073599; font-size: 50px; border-radius: 0; display: flex; margin: 0 auto; font-family: Helvetica; text-align: center;}
.tel_label {
font-size: 18px;
color: #000;
margin-top: 0;
align-items: center;
display: flex;
justify-content: center;
}
.tel_label::before,
.tel_label::after {
background-color: #000;
border-radius: 5px;
content: "";
height: 2px;
width: 20px;
}
.tel_label::before {
margin-right: 16px;
transform: rotate(60deg);
}
.tel_label::after {
margin-left: 16px;
transform: rotate(-60deg);
}
.hours {
font-size: 18px;
font-weight: 300;
color: #333;
margin-bottom: 0;
}
.hero_cta {
text-align: right;
}
.btn--tel div {
width: 100%;
}
.icon_tel {
display: flex;
justify-content: center;
gap: 14px;
align-items: center;
}
.bg {
position: relative;
padding-bottom: 0;
}
.bg_tel {
height: 232px;
background-color: #00a073;
position: absolute;
top: 20px;
margin: 0 calc(50% - 50vw);
width: 100vw;
}
.btn_reservation {
display: inline-flex;
font-family: ヒラギノ角ゴシック;
letter-spacing: 0.05em;
width: 330px;
padding: 24px 30px;
margin-bottom: 14px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #d60000, #ed0101); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: right;
gap: 30px;
align-items: center;
}
.hours .hours_box {
border: 1px solid #000;
padding: 6px 8px;
display: inline-block;
margin-left: 10px;
}
.btn_line {
display: inline-flex;
font-family: ヒラギノ角ゴシック;
letter-spacing: 0.05em;
width: 330px;
padding: 17px 30px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #03a803, #06c806); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
gap: 30px;
align-items: center;
}

/* ========== ul・liのボックス ========== */
.box-list{ list-style:none; margin:0 auto; padding:0; display:grid; gap: clamp(32px, 2vw, 40px); grid-template-columns: repeat(2, minmax(0,1fr)); max-width: 920px;}
.box-list__item{
background:#ecf6f0; border-radius: var(--radius); padding: clamp(16px, 2.2vw, 22px);
box-shadow: 0 2px 0 rgba(0,0,0,.02);
}
.box-list__title{ margin:0 0 .25rem; font-size: clamp(18px, 2vw, 24px); color: #00a073; font-family: ヒラギノ角ゴ StdN;}
.box-list__text{ margin:0; color: var(--color-muted);}

/* ========== 九州最安値水準（吹き出し） ========== */
.balloon {
font-size: 20px;
font-weight: 600;
margin-top: 0;
margin-bottom: 36px;
letter-spacing: 0.05em;
color: #fffb3e;
text-align: center;
min-width: 335px;
background: #01956d;
border-radius: 50px;
padding: 15px 58px;
display: inline-block;
position: relative;
left: 50%;
transform: translateX(-50%);
}
.balloon::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 14px;
height: 14px;
background: #01956d;
transform: translate(-50%,55%) rotate(45deg);
transform-origin:center center;
}
.balloon_text {
color: #01956d;
text-align: center;
font-size: 60px;
letter-spacing: 0.05em;
margin: 0 0 32px;
line-height: 1;
}
.lead_dec_02 {
font-size: 20px;
font-weight: 300;
margin-bottom: 0;
}

/* ========== 選ばれる理由 ========== */
.reason_title {
display: flex;
align-items: center;
}
.reason_title h3 {
margin: 0 0 20px 40px;
letter-spacing: 0.05em;
}

/* ========== カード（車種） ========== */
.card-list{ list-style:none; margin:0; padding:0; display:grid; gap: clamp(14px,2vw,20px); grid-template-columns: repeat(1, minmax(0,1fr)); }
.card{ background:#fff; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius); overflow:hidden; display:flex; flex-direction:column; }
.card__title{ margin: 16px 16px 0; font-family: ヒラギノ角ゴ Std; text-align: center; color: #fff; font-size: 30px;}
.card_title_style {
font-size: 40px !important;
color: #fffb3e;
}
.pc_flex {
display: flex;
margin: 0 40px;
gap: 40px;
}
.img_car {
width: 525px;
margin: 0 auto;
order: 2;
}
.img_pc_none {
display: none;
}
.card_bg_container {
background-color: #00a073;
}
.card_lead {
text-align: center;
margin: 14px 0 16px;
font-family: ヒラギノ角ゴシック;
font-size: 18px;
}
.car_model {
font-size: 24px;
color: #00a073;
font-weight: 600;
margin: 40px 0 30px;
border-bottom: solid 2px #00a073;
width: 540px;
}
.item {
width: 122px;
padding: 8px 28px;
border-radius: 8px;
background: #f5d55c;
margin: 16px 16px 24px 0;
}
.card_item_01 {
max-width: 540px;
}
.card_item {
display: flex;
align-items: center;
}
.card_item_03 caption {
    text-align: left;
    padding-bottom: 5px;
}
.period {
font-size: 13px;
}
.price {
color: #00a073;
font-weight: 600;
}
.table_border {
border: solid 4px #eeeeed;
background: #fffef6;
border-collapse: collapse;
width: 100%;
margin-bottom: 40px;
}
.td_border {
border: solid 2px #eeeeed;
text-align: center;
height: 86px;
width: 168px;
}

/* ========== ステップ ========== */
.step-list{ max-width: 1100px; ; counter-reset: step; list-style:none; margin:0 auto; padding:0; display:grid; gap:20px; grid-template-columns: repeat(4, minmax(0,1fr));}
.step{ background:#fef9e4; border:3px solid rgba(51,51,51); border-radius: var(--radius); padding: 16px 15px; position: relative; text-align: center; justify-content: center;}
.step_icon {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -25px;
}
.step_title_en {
font-family: Futura PT;
font-weight: 900;
color: #fea52f;
letter-spacing: 0.05em;
margin: 0;
line-height: 0;
}
.step__title {
margin: 54px 0 10px;
}
.step_info{
display: grid;
grid-template-columns: 1fr auto 1fr; /* 左線 | ボックス | 右線 */
align-items: center;
gap: 0;
padding: 60px 16px 40px;
}
.step_text {
margin-bottom: 24px;
}
.info_line{
height: 2px;
background: #00a073;
}
.step_info .box{
width: 100%;
background: #00a073;
border-radius: 0; /* 直角 */
padding: 13px 34px;
}
.info_text{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #fff;
font-size: 24px;
letter-spacing: 0.05em;
font-weight: 600;
}
.license {
margin: 0 auto;
}
.dec_01 {
margin: 0 0 16px;
padding: 2px 10px;
border-left: 3px solid;
height: 35px;
display: flex;
align-items: center;
color: #00a073;
font-weight: bold;
font-size: 24px;
}
.dec_02 {
margin: 24px 0 16px;
padding: 2px 10px;
border-left: 3px solid;
height: 35px;
display: flex;
align-items: center;
color: #00a073;
font-weight: bold;
font-size: 24px;
}
.dec_text_02 {
margin-bottom: 0;
}
.is-open {
display: flex;
justify-content: center;
align-items: center;
}
.is-open_img {
align-items: center;
}
.is-open img{
margin: 0 40px 0 0;
}

/* ========== 整備 ========== */
.box-list_cases { grid-template-columns: repeat(1, minmax(0,1fr)); max-width: 1200px;}
.box-list_cases__title {
font-size: 30px;
}
.cases_info{
display: grid;
grid-template-columns: 1fr auto 1fr; /* 左線 | ボックス | 右線 */
align-items: center;
gap: 0;
padding: 60px 16px 40px;
}
.cases_info_line{
height: 2px;
background: #fe6e04;
}
.cases_info .box{
width: 100%;
background: #fe6e04;
border-radius: 0; /* 直角 */
padding: 13px 145px;
}
.cases_info_text{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #fff;
font-size: 24px;
letter-spacing: 0.05em;
font-weight: 600;
}
.case_title {
display: flex;
align-items: center;
}
.case_title {
color: #333;
padding-top: 24px;
}
.maintenance__item {
background-color: #fff;
display: flex;
gap: 60px;
padding: 40px;
}
.maintenance__item picture {
display: inline-block;
max-width: 100%;
width: fit-content;
}
li.box-list__item.maintenance__item picture img {
display: block;
max-width: 450px;
height: auto;
}
.btn_maintenance {
display: inline-block;
width: 480px;
padding: 24px 115px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #00a073, #00be89); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
}

/* ========== 販売・リース ========== */
.gallery {
display: grid;
grid-template-columns: repeat(3, 1fr); /* 1行に3枚 */
gap: 27px; /* 画像の間隔 */
justify-items: center;
max-width: 1023.98px; /* デモ用：横幅制限 */
margin: auto;
}
.gallery img {
width: 100%;
max-width: 380px;
height: auto;
display: block;
border-radius: 8px; /* 任意の装飾 */
}
.btn-lease {
display: inline-block;
width: 480px;
padding: 24px 95px;
font-size: 20px;
font-weight: bold;
color: #fff;
border: none;
border-radius: 50px;
background: linear-gradient(360deg, #fe6e04, #fc8a36); /* ← グラデーション */
cursor: pointer;
transition: 0.3s ease;
text-decoration: none;
text-align: center;
}
.btn-gradient {
text-align: center;
padding-top: 40px;
}

/* ========== 喜びの声 ========== */
.reviews {
display: flex;
align-items: center;
}

.reviews img{
width: 90px;
}
.reviews_title {
margin: 0 0 4px 16px;
}

/* ========== FAQ ========== */
.faq-box {
margin-bottom: 16px;
}
.sec9 .faq-box .faq-ttl {
display: flex;
cursor: pointer;
max-width: 920px;
margin: 0 auto;
align-items: stretch;
}

/* ブラウザ標準のマーカーを消す */
summary { list-style: none; }
summary::-webkit-details-marker { display: none; }

/* 左のアイコンボックス */
.sec9 .faq-box .faq_img {
width: 60px;
height: 60px;
position: relative;
background-color: #18bc90;
border-radius: 8px 0 0 8px;
flex: 0 0 60px;
}
.sec9 .faq-box .faq_img img {
width: 24px;
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%,-50%);
}

/* タイトルテキスト＋丸トグル */
.sec9 .faq-box .txt {
flex: 1 1 auto;
background-color: #ecf6f0;
border-radius: 0 8px 8px 0;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 24px;
gap: 12px;
}
.sec9 .faq-box .ttl {
margin: 0;
line-height: 1.5;
font-weight: 600;
color: #333;
}

/* 丸いトグル（中の矢印は ::after） */
.faq-toggle {
color: #18bc90;
display: inline-block;
background-color: #fff;
border-radius: 50%;
width: 40px; height: 40px;
position: relative;
flex: 0 0 40px;
}
.faq-toggle::after {
content: '';
position: absolute;
left: 0; right: 0; margin: 0 auto;
top: 50%;
width: 12px; height: 12px;
border: 3px solid currentColor;
border-left: 0; border-top: 0;
transform: translateY(-50%) rotate(45deg);
transition: transform .3s ease;
}

/* パネルの開閉 */
.faq-detail {
display: grid;
grid-template-rows: 0fr;
overflow: hidden;
opacity: 0;
transition: grid-template-rows .3s ease, opacity .3s ease;
max-width: 920px;
margin: 12px auto 20px;
}
.faq-detail__inner { min-height: 0; }
.faq-detail p {
color: #333;
font-size: 14px;
line-height: 1.75;
margin: 0;
padding: 0 12px 0 84px;
}

/* 開いたとき */
.faq[open] .faq-detail {
grid-template-rows: 1fr;
opacity: 1;
}
/* 矢印を上向きに回転 */
.faq[open] .faq-toggle::after {
transform: translateY(-50%) rotate(-135deg);
}

.faq-ttl:focus { outline: none; }
.faq-ttl:focus-visible {
outline: 2px solid #18bc90;
outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
.faq-detail { transition: none; }
.faq-toggle::after { transition: none; }
}

/* ========== アクセス ========== */
.card-list_access{ max-width: 920px; margin: 0 auto; grid-template-columns: repeat(1, minmax(0,1fr));}
.access_card {
background-color: #ecf6f0;
border: none;
}
.access_card__title {
margin: 13px auto; text-align: center; color: #fff;
}
.card_text {
display: flex;
margin: 0 auto;
gap: 60px;
padding: 40px 0;
align-items: center;
}
.inline-sep{
display:flex;
align-items:center;
gap:24px;
list-style:none;
margin:0;
padding: 0 0 16px;
white-space:nowrap;
}
.inline-sep_last {
padding-bottom: 0;
}
.inline-sep li:first-child {
width: 80px;
}
.inline-sep > li + li{
position:relative;
padding-left:16px;
}
.inline-sep > li + li::before{
content:"";
position:absolute;
left:0;
top:50%;
transform:translateY(-50%);
width:2px;
height:15px;
background:rgba(75,75,75,.5);
}
.map {
margin: 24px auto 0;
width: 920px;
}
.map-img {
width: 920px;
margin: 16px auto 40px;
}
.map iframe {
width: 100%;
height: 260px;
}

/* ========== お問い合わせ ========== */
.childContent {
background-color: #00a073;
padding-bottom: 60px;
}
.childContent_ttl {
margin: 0 auto 30px;
padding-top: 60px;
font-size: 24px;
text-align: center;
color: #fff;
}
.childContent_inner {
max-width: 920px;
padding: 40px 70px;
background: #fff;
border-radius: 10px;
margin: 0 auto;
}
.formQuestions {
display: flex;
justify-content: space-between;
align-items: center;
}
.formQuestions_radio {
margin: 20px auto 0;
display: flex;
justify-content: start;
gap: 0;
}
.radio-group_01 {
display: flex;
width: 100%;
column-gap: 40px;
font-weight: bold;
accent-color: #212121;
margin: 0 auto;
}
.formQuestions .formQuestions_ttls {
display: flex;
align-items: center;
}
.formQuestions_ttls {
width: 350px;
padding-right: 60px;
justify-content: end;
}
.formQuestions_ttls p{
margin: 0;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ttl {
font-size: 16px;
font-weight: bold;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ind {
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
color: #dd2727;
}
.formQuestions_content {
width: 100%;
}
.formQuestions {
margin-top: 10px;
}
.formQuestions .formQuestions_content textarea,
.formQuestions .formQuestions_content input{
width: 100%;
font-family: 'Noto Sans JP', sans-serif;
font-size: 16px;
padding: 10px 15px;
box-sizing: border-box;
border: 2px solid #d2d2d2;
border-radius: 8px;
}
.formSubmit {
margin-top: 40px;
}
.formSubmit .formSubmit_btn {position: relative;display: flex;align-items: center;justify-content: center;width: 100%;max-width: 480px;height: 80px;font-size: 20px;font-weight: bold;color: #fff;background: linear-gradient(180deg,#ed0101,#d60000);border: none;margin: 0 auto;border-radius: 50px;box-shadow: 0px 8px 8px rgba(73, 73, 73,0.2);cursor: pointer;}
.formSubmit .formSubmit_btn::before {
content: "";
position: absolute;
top: 50%;
left: 32.5px;
transform: translateY(-50%);
width: 20px;
height: 16.6px;
background: url(../img/send-ico.png);
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_ind {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 22.5px;
font-size: 14px;
color: #fff;
background: #dd0000;
margin-left: 10px;
border-radius: 3px;
}
.formQuestions .formQuestions_ttls .formQuestions_ttls_opt {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 22.5px;
font-size: 14px;
color: #fff;
background-color: #073599;
margin-left: 10px;
border-radius: 3px;
}
.formContent_link {
text-align: center;
text-decoration: underline;
color: #207ecd;
}
label[for="radio1"] {
font-weight: 300;
}

/* ========== フッター ========== */
.site-footer{ background:#fff; color:#000; padding: 24px 0; text-align: center;}

/* ========== 共通 ========== */
.lead_dec_01 {
font-size: 18px;
font-weight: 300;
padding-bottom: 40px;
margin-bottom: 0;
}
.br_pc_none {
display: none;
}
.icon {
width: 80px;
position: absolute;
left: -18px;
top: -24px;
}
.bg_white {
padding: 32px 40px;
background-color: #fff;
border: solid 3px #333;
}
.box-list__item {
padding: 24px 40px;
margin: 24px 0 0 10px;
position: relative;
}
.box-list__text {
padding-top: 16px;
font-size: 16px;
}


/* ========== レスポンシブ ========== */
@media (max-width: 1023.98px){
.sp_show img{margin: 0 auto;}
.card-list{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.step-list{ grid-template-columns: repeat(2, minmax(0,1fr));}
.box-list__item img {
margin: 0 auto;
}
.box-list__item p {
max-width: 360px;
margin: 0 auto;
}
.is-open_inner {
width: 80%;
max-width: 446px;
margin: 0 auto;
text-align: left;
}

}

@media (max-width: 767.98px){
:root{ --header-h: 64px; }
.box-list{ grid-template-columns: 1fr; }
.card-list{ grid-template-columns: 1fr; }
/* ========== ヘッダー（追従） ========== */
.site-header__logo img { width:165px; }
/* ナビ */
nav { font-size: 14px;}
.site-header__inner {gap: 10px;}
.menu-icon { display: block; }
.menu { display: none; flex-direction: column; }
.menu.is-open { display: flex; margin: 0;}

/* バツ化 */
body.is-menu-open #menu-icon span:nth-child(1) {
top: 11px; transform: rotate(45deg);
}
body.is-menu-open #menu-icon span:nth-child(2) {
opacity: 0;
}
body.is-menu-open #menu-icon span:nth-child(3) {
top: 11px; transform: rotate(-45deg);
}

.menu {
position: fixed;
height: 380px;
top: var(--header-h);
right: 0;
bottom: 0;
width: 75vw;
max-width: 320px;
background: #fff;
display: none;
flex-direction: column;
gap: 16px;
padding: 20px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
z-index: 1000;
}
/* メニュー本体を画面内に収める */
.menu.is-open{ display: flex; }

/* 端末のノッチ等の安全域に対応（任意） */
.menu{
padding-top: calc(20px + env(safe-area-inset-top));
padding-bottom: calc(20px + env(safe-area-inset-bottom));
}

/* ヘッダーの背後にオーバーレイを敷く（はみ出し誤タッチ防止） */
body::after{
content: "";
position: fixed;
inset: 0;
background: rgba(0,0,0,.35);
opacity: 0;
pointer-events: none;
transition: opacity .3s;
}
body.is-menu-open::after{
opacity: 1;
pointer-events: auto;
}

/* メニュー開時の画面スクロールを止める（はみ出し→背面スクロール防止） */
body.is-menu-open{
overflow: hidden;
touch-action: none;
}
.menu li {
margin-right: 0;
}

/* ========== メインビジュアル（背景画像+inner） ========== */
.img_fv_sp {display: block;}
.img_fv_pc {
display: none;
}
.hero__inner{padding: 15px 0 20px;}
.hero__title{
text-align: center;
margin-bottom: o;
}
.title_02{line-height: 1;padding: 20px 0 8px;font-size: 36px;}
.item_03{
padding: 8px 0 8px;
}
.item_03 img{
margin: 0 auto;
width: 90%;
}
.img_fv img{
margin: 0 auto;
width:70%;
}
.title_01 {font-size: 16px;padding: 10px 32px;}
.btn--tel {display: block;padding: 20px 10px;font-size: 36px;margin: 0 20px;}
.hero_img {
display: block;
flex-direction: column;
padding: 0;
}
.img_fv {
order: 2;
}

/* ========== ボタン（hover実装） ========== */
.btn_reservation {
display: inline-flex;
width: 250px;
padding: 16px 26px;
margin-bottom: 10px;
font-size: 14px;
gap: 25px;
}
.hours .hours_box {
padding: 4px 8px;
margin-left: 8px;
}
.btn_reservation img {
width: 30px;
}
.btn_line {
display: inline-flex;
width: 250px;
padding: 10px 24px;
font-size: 14px;
gap: 25px;
}
.btn_line img {
width: 34px;
}
.hero_cta {
text-align: center;
}
.hours {
font-size: 12px;
padding-bottom: 20px;
}
.bg_tel {
height: 305px;
top: 15px;
}
.icon_tel {
gap: 8px;
}
.icon_tel img {
width: 18px;
}

/* ========== 九州最安値水準（吹き出し） ========== */
.balloon_text {
font-size: 38px;
}
.balloon {
font-size: 16px;
border-radius: 50px;
padding: 12px 25px;
margin-bottom: 30px;
}
.balloon::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 10px;
height: 10px;
background: #01956d;
transform: translate(-50%,55%) rotate(45deg);
transform-origin:center center;
}
.lead_dec_02 {
font-size: 16px;
font-weight: 300;
}

/* ========== 料金・車種ラインアップ（カード） ========== */
.img_car {
width: 300px;
order: 1;
}
.img_sp_none {
display: none;
}
.img_pc_none {
display: block;
}
.pc_flex {
display: block;
margin: 0 auto;
}
.card_lead {
font-size: 16px;
}
.card__title {
font-size: 22px;
}
.card_title_style {
font-size: 30px !important;
}
.card_item_flex {
flex-direction: column;
padding: 0 16px;
}
.item_02 {
padding-bottom: 24px;
}
.item_02 img {
margin: 0 auto;
}
.car_model {
font-size: 18px;
margin: 40px auto 16px;
}
.table_border {
order: 3;
margin: 0 auto 40px;
}

/* ========== ステップ ========== */
.step-list{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 40px 10px; margin-top: 20px;}
.step_icon {
width: 50px;
}
.step__title {
margin: 34px 0 10px;
}
.step_text {
margin-bottom: 16px;
}
.step_info .box{
padding: 12px 18px;
}
.step_info {
padding: 60px 0 40px;
}
.info_text{
font-size: 18px;
}
.is-open {
display: block;
}
.is-open img {
margin: 0 auto 24px;
}
.license img{
width: 245px;
}
.is-open_inner {
width: 100%;
}
.dec_01 {
font-size: 18px;
height: 24px;
}
.dec_02 {
font-size: 18px;
height: 24px;
}

/* ========== 整備 ========== */
.cases_info .box{
padding: 12px 102px;
}
.cases_info_text{
font-size: 18px;
}
.cases_info {
padding: 60px 0 40px;
}
.maintenance__item{background-color: #fff; padding: 32px 20px; margin: 0 auto; display: block;}
.maintenance__item img {padding-bottom: 24px;}
.maintenance__item h3 {text-align: center; font-size: 22px;}
li.box-list__item.maintenance__item picture img {
max-width: 100%;
}
.btn_maintenance {
width: 335px;
padding: 20px 68px;
font-size: 16px;
}

/* ========== 販売・リース ========== */
.gallery {
grid-template-columns: repeat(2, 1fr);
}
.btn-lease {
width: 335px;
padding: 20px 52px;
font-size: 16px;
}

/* ========== 喜びの声 ========== */
.icon_reviews {
width: 85px;
height: 85px;
}
.box_reviews {
padding: 32px 16px;
margin: 0;
}
.reviews_title p {
margin: 0 0 14px;
font-size: 12px;
}
.reviews_title h3 {
font-size: 16px;
color: #18bc90;
}
.reviews_title {
margin: 0 0 4px 10px;
}

/* ========== FAQ ========== */
.sec9 .faq-box .faq_img {
width: 40px;
position: relative;
background-color: #18bc90;
border-radius: 6px 0 0 6px;
flex: 0 0 40px;
height: auto;
}
.faq-detail p {
padding: 0 12px 0 40px;
}
.sec9 .faq-box .faq_img img {
width: 15px;
}
.sec9 .faq-box .txt {
font-size: 14px;
}
.sec9 .faq-box .txt {
border-radius: 0 6px 6px 0;
}
.sec9 .faq-box .txt {
padding: 10px;
}
.faq-toggle {
width: 24px; height: 24px;
flex: 0 0 24px;
}
.faq-toggle::after {
width: 8px; height: 8px;
}

/* ========== アクセス ========== */
.access_card img {
padding: 24px 45px;
}
.card_text {
padding: 0 0 32px;
display: block;
}
.inline-sep {
font-size: 14px;
display:flex;
align-items:center;
gap:16px;
list-style:none;
margin:0;
padding: 0 20px 12px;
white-space:nowrap;
}
.inline-sep li:first-child {
width: 70px;
}
.inline-sep_last {
padding-bottom: 0;
}
.inline-sep_last li {
padding-bottom: 0;
}
.map {
width: 100%;
}
.map-img {
width: 100%;
}

/* ========== お問い合わせ ========== */
.formContent_link {
font-size: 12px;
}
.formQuestions .formQuestions_content textarea,
.formQuestions .formQuestions_content input{
border-radius: 5px;
}
.formQuestions_content {
margin-top: 10px;
}
.formQuestions_content p {
margin: 10px 0 24px;
}
.childContent_ttl {
padding-top: 40px;
}
.childContent {
padding: 0 20px 40px;
}
.childContent_inner {
padding: 10px 15px 40px;
}
.formQuestions {
display: block;
margin-top: 20px;
}
.formSubmit .formSubmit_btn {max-width: 295px;height: 63px;font-size: 16px;}
.radio-group_01 {
display: block;
padding-top: 10px;
}
.formQuestions_ttls {
width: 100%;
padding-right: 0;
justify-content: start;
}

/* ========== 共通 ========== */
.box-list__item {
padding: 24px 30px;
}
.sp_show{display: block; margin: 0 auto;}
.pc_show{display: none;}
.dec_text {font-size: 14px;}
.section {
padding: 40px 0;
}
.section_margin {
margin-top: 22px;
}
.section__margin {
margin-top: 0;
}
.section__title {
font-size: 20px;
letter-spacing: 0.025em;
}
.text_style_01 {
font-size: 26px !important;
}
.text_style_02 {
font-size: 26px !important;
}
.text_style_03 {
font-size: 26px !important;
}
.icon {
width: 65px;
position: absolute;
left: -10px;
top: -16px;
}
.box-list__text {
font-size: 14px;
}
.br_pc_none {
display: inline;
}
.br_sp_none {
display: none;
}
.lead_dec_01 {
font-size: 16px;
}


}

@media (prefers-reduced-motion: reduce){ *{ scroll-behavior: auto !important; } .btn{ transition: none; } }

a:hover {
opacity: .8;
}

.formSubmit:hover {
opacity: .8;
}

.follow-cta {
position: fixed;
width: 100%;
bottom: 0;
left: 0;
z-index: 10;
background: #fff;
-webkit-box-shadow: 0 0 30px rgba(0, 0, 0, .15);
box-shadow: 0 0 30px rgba(0, 0, 0, .15);
-webkit-transition: all .3s;
-o-transition: all .3s;
transition: all .3s;
opacity: 1;
visibility: visible;
}

.l-container{
max-width:1200px;
width: 100%;
margin: 0 auto;
padding: 0 10px;
}
.follow-cta ul {
padding: 0;
margin: 20px 0px;
}
.follow-cta__list {
list-style: none;
display: flex;
gap: 30px;
align-items: center;
}

.follow-cta__list .only-pc {
display:block;
}
.follow-cta__list .only-sp {
display: none;
}

@media (max-width: 768px) {
.follow-cta__list .only-pc {
display:none;
}
.follow-cta__list .only-sp {
display: block;
}
.follow-cta ul {
padding: 0;
margin: 10px 0px;
}
.follow-cta__list {
list-style: none;
display: flex;
gap: 10px;
align-items: center;
}
}

.formQuestions_content select {
width: 200px;
padding: 14px 26px 14px 10px;
border: 2px solid #EBEBEB;
background: #fff;
color:#444;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

.form-icon :after {
content: '▼';
position: absolute;
left: 170px;
z-index: 4;
font-size: 10px;
top: 0px;
}
