/* =========================================================

responsive - 金星ハイヤー採用サイト（最適化版）

=========================================================== */

/* デフォルトでモバイル版メインビジュアルを非表示 */
#mainVisual_sp {
    display: none;
}

@media screen and (max-width: 1024px) {

.inner {width:94%;margin: 0 auto;}
section .inner {padding:50px 0;}
#mainVisual {
    background-position: center right;
    background-size: cover;
}
#topnav {
	width: 90%;
	margin-bottom: 0;
}
#pagetop {position: fixed;bottom: 20px;right:0;font-size:10px;}
#pagetop a {
    background:#DC143C;
    text-decoration: none;
    color: #fff;
    width:40px;
    padding:20px 0;
    text-align: center;
    display: block;
    border-bottom-left-radius:4px;
    border-top-left-radius:4px;
    border-bottom-right-radius:0;
    border-top-right-radius:0;
}
#pagetop a:hover {text-decoration: none;background: #B91C3C;}

/* 社長挨拶セクション */
#president-greeting .inner {
	padding: 40px 30px;
	width: 45%;
}
#president-greeting ul {
	margin-top: 20px;
}
#president-greeting ul li {
	width: 48%;
}
#president-greeting ul li a {
	padding: 8px 15px;
	font-size: 14px;
}
.president-img {
	width: 45%;
}

}

 
@media screen and (max-width: 896px) {
.overlay ul {
	max-width: 80%;
}
.overlay ul li a {
    font-size: 20px;
}
section .inner {padding:30px 0;}
#header .row {
	width: calc(100% - 70px);
	padding: 10px 0 0;
}
#header #logo {
    width: 350px;
    margin: 0;
}
#logo .logomark {
	width: 70px;
	margin-top: 5px;
	margin-right: 8px;
}
#logo h1.logo-txt {
	width: 240px;
	padding: 6px 0 0;
}
#logo h1.logo-txt span{
	display: none;
}

#contact-telnum {
	background: url('images/icon-tel.png') no-repeat left center;
	background-size: 20px auto;
	font-size: 22px;
	padding-left: 30px;
	flex: none;
}
#topnav li a {
	padding: 8px;
}

/* 会社情報セクション */
#company-info .inner {
    flex-direction:column;
}
#company-overview,
#recruitment-info {
	width: 80%;
	margin: 0 auto;
}
#company-overview .toInfoList {
	margin-bottom: 40px;
}
#president-greeting .inner {
	flex-direction:column;
	padding: 60px 0 20px !important;
}
#president-greeting .greeting-txt {
	width: 100% !important;
}

.president-img {
	width: 70%;
	margin: 0 auto;
}

/* フッター */
#footer .inner {
    padding: 40px 0px;
}
#footer .row {
	flex-direction:column;
	width: 50%;
	max-width: 90%;
	margin: 0 auto;
}
.f-address,.f-contact {
	width: 100%;
}
.f-address p.branch {
	font-size: 13px;
	margin-top: 5px;
}
#f-nav {
	width: 90%;
	max-width: 100%;
	text-align: center;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    margin: 40px auto 0;
}

/* 募集要項セクション */
#recruitment .inner {
	padding: 0;
	text-align: left;
	border-top: none;
	background: #1A1A1A; color: #FFF;
	flex-direction: column;
}
#recruitment .recruitment-img {
	width: 100%;
	margin: 0 auto;
}
#recruitment .recruitment-txt {
	width: 100%;
	padding: 60px 40px 0;
}
#recruitment h3 {
	color:#333;
	font-size: 20px;
	margin-bottom: 15px;
}

/* メインビジュアル調整 */
.main-title {
    font-size: 42px;
}
.badge {
    font-size: 16px;
    padding: 10px 25px;
}
.feature-item {
    font-size: 15px;
    padding: 10px 20px;
}

}

@media screen and (max-width: 640px) {
.pc-only {display:none;}
.sp-only {display:block;}	
body {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.6em;
	overflow-x: hidden !important;  /* ← これを追加 */
}

/* ヘッダー固定対応 */
#header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: rgba(255,255,255,0.98) !important;
    padding: 12px 15px 6px;
    z-index: 9999 !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

#header .row {
	width: calc(100% - 70px);
	padding: 0;
}
.button_container {
     position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    width: auto !important;  /* ← これを追加 */
    padding: 22px 18px 22px 18px;
    z-index: 10000 !important;
    background: rgba(42, 42, 42, 0.9);  /* ← これも追加 */
}
.button_container.active .bottom {
    -webkit-transform: translateY(-6px) translateX(0) rotate(-45deg);
    transform: translateY(-6px) translateX(0) rotate(-45deg);
    background: #FFF;
}
.button_container span {
    width: 30px;
    top:20px;
    right:20px;
}
.button_container span:nth-of-type(2) {
    top: 26px;
}
.button_container span:nth-of-type(3) {
    top: 32px;
}
.button_container p.toggletxt {
    margin-top: 15px;
    border: none;
    font-size: 10px;
    color: #FFF;
    letter-spacing: 0.1em;
}

#logo .logomark {
	width: 50px;
	margin-top: 5px;
	margin-right: 8px;
}
#logo h1.logo-txt {
	width: 200px;
	padding: 6px 0 0;
}
#contact-telnum {
	display: none;
}

@media screen and (max-width: 640px) {
    .cta-buttons {
        display: flex !important;
        flex-direction: row !important;  /* 横並び維持 */
        justify-content: center !important;
        align-items: center !important;
        gap: 10px !important;  /* 間隔を10pxに */
        padding: 0 5px !important;  /* 左右の余白を最小に */
    }

    .btn-tel,
    .btn-web {
        font-size: 14px !important;  /* 文字を小さく */
        padding: 15px 15px !important;  /* パディングを減らす */
        width: auto !important;
        flex: 1 !important;
        max-width: 160px !important;  /* 最大幅を狭く */
        white-space: nowrap !important;
        font-weight: bold !important;
        min-height: 48px !important;  /* 高さも少し減らす */
    }
    
    /* 電話アイコンも小さく */
    .btn-tel:before {
        width: 20px;
        height: 20px;
        left: 15px;
    }
    
    /* アイコン付きの場合の左パディング調整 */
    .btn-tel {
        padding-left: 40px !important;
    }
}
	

	
	
	
/* PCメインビジュアルを非表示に */
#mainVisual {
    display: none !important;
}

/* モバイルメインビジュアルを表示（改善版） */
#mainVisual_sp {
    display: flex !important;
    width: 100%;
    height: calc(100vh - 70px) !important;
    min-height: 500px !important;
    max-height: 700px !important;
    margin-top: 70px !important;
    background: linear-gradient(135deg, #7a7a7a 0%, #9a9a9a 100%);
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    position: relative;
}

/* メインコンテンツもヘッダー分下げる */
main {
    margin-top: 70px !important;
    padding-bottom: 80px !important;
	overflow-x: hidden !important;  /* ← これを追加 */
}

#pageVisual {
    border:solid 10px #FFF; 
    height: 30vh; 
    background-position: right center;
    margin-top: 70px !important;
}

/* オーバーレイメニュー */
.overlay nav {
	position: fixed;
	overflow-y: scroll; 
	z-index: 99;
	width:100%;
	height:100%; 
    top: 30%;
    -webkit-transform: translateY(-30%);
    transform: translateY(-30%);
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
    padding: 40px 0;
}
.overlay ul {
	flex-direction: column;
}
.overlay ul li {
	width: 100%;
	margin: 5px 0 0;
}
.overlay ul li.home {
	display: block;
}
.overlay ul li a {
    display: block;
    color: #333;
    text-decoration: none;
    font-size: 16px;
	height: 46px;
	line-height: 46px;
	border:none;
	border-bottom: solid 1px #FFD700;
	text-align: left;
	background: url('images/icon-arrow2.png') no-repeat right center;
	background-size: 12px auto; 
}
.overlay ul li a img {
    display: none;
}
.overlay .clinicinfo {
	display: block;
	margin: 30px auto 15px;
}
.overlay .clinicinfo dl {
	width: 100%;
	color: #333;
}
.overlay .clinicinfo dt {
	text-align: center;
	margin-bottom: 15px;
}
.overlay .clinicinfo dt img {
	width: 70%;
	max-width: 240px;
	margin: 0 auto;
}
.overlay .clinicinfo dd {
	font-size: 22px;
	margin: 10px auto;
}
.overlay .clinicinfo dd a {
	color: #333 !important;
}
.overlay .clinicinfo dd span {
	font-size: 14px;
	display: block;
	margin: 5px 0;
	line-height: 1.6em;
}
.overlay .clinicinfo dd.recruitment-btn {
	margin-top: 20px;
}
.overlay .clinicinfo dd.recruitment-btn a {
	background: #DC143C;
	color: #FFF !important;
	padding: 10px 20px;
	border-radius: 0;
	display: inline-block;
	font-size: 16px;
}

/* テーブル */
table.sp-table {
    width: 100% !important;
}
table.sp-table thead {
    display: none;
}
table.sp-table tr,
table.sp-table td,
table.sp-table th {
    display: block;
    width: 100% !important;
}
table.sp-table td,
table.sp-table th {
    padding: 0.6em 1em;
    border-top-width: 0;
}
table.sp-table th {
    text-align: center;
    font-weight: bold;
    border-bottom: none;
    white-space: normal !important;
}

.inner {
	width:90%;
	margin: 0 auto;
}

/* タイトル調整 */
#pagetitle h2,
#pagetitle-blog h2 {
	font-size: 24px;
}
.cont-title {
	font-size: 20px;
	margin: 0 0 20px;
}

/* フッター */
#footer .row {
	width: 80%;
}
.f-address p {
	font-size: 13px;
	letter-spacing: 0;
	text-align: center !important;
}
.f-address p span {
	display: none;
}
.f-address p.branch {
	display: block;
	font-size: 12px;
	margin-top: 5px;
}
.f-contact .contact-tel {
	background: url('images/icon-taxi.png') no-repeat 0 12px;
	background-size: 42px auto;
	padding: 10px 0 6px 60px;
}
.f-contact .contact-tel span{
	font-size: 36px;
	letter-spacing: 0.03em;
	color: #FFF !important;
}
#f-nav {
    display: none;
}
.f-contact .hour {
	line-height: 1.2em;
}
.f-contact .hour span {
	display: block;
}

/* フローティングボタン（改善版） */
.floating {
  position: fixed;
  right: 0;
  bottom: 0;
  top: auto;  /* ← これを追加 */
  display: block;  /* ← これを追加 */
  width: 100%;
  z-index: 998;
}

.floating a {
  background-color: #DC143C;
  background-image: url('images/icon-tel.png');
  background-repeat: no-repeat;
  background-position: 20px center;
  background-size: 30px auto;
  padding: 20px 10px 20px 28px;
  font-size: 15px;
  letter-spacing: 0.03em;
  width: 100%;
  color: #FFF;
  display: block;
  text-align: center;
}

.floating a span {
	display: inline-block;
}

/* ★★★ メインビジュアル要素の調整（インパクト重視） ★★★ */
.mainvisual-content {
    padding: 40px 20px;
    width: 100%;
    max-width: 500px;
}

.main-title {
    font-size: 38px !important;
    margin-bottom: 30px !important;
    line-height: 1.35 !important;
    font-weight: bold !important;
    text-shadow: 2px 2px 6px rgba(0,0,0,0.2) !important;
    letter-spacing: 0.02em !important;
}

.badges {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 5px !important;  /* 10px → 5px に縮小 */
    margin-bottom: 25px !important;
    flex-wrap: nowrap !important;  /* nowrapに戻す */
    padding: 0 5px !important;  /* パディングも縮小 */
}

.badge {
    font-size: 13px !important;  /* 14px → 13px */
    padding: 8px 12px !important;  /* 10px 16px → 8px 12px に縮小 */
    white-space: nowrap !important;  /* 改行させない */
    flex: 1 !important;  /* 均等幅にする */
    max-width: 110px !important;  /* 最大幅を制限 */
}

.features {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 30px !important;
    flex-wrap: wrap !important;
}

.feature-item {
    font-size: 15px !important;
    padding: 10px 16px !important;
    white-space: nowrap !important;
    font-weight: bold !important;
    letter-spacing: 0.03em !important;
}

.cta-buttons {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 0 10px !important;
}

.btn-tel,
.btn-web {
    font-size: 17px !important;
    padding: 18px 28px !important;
    width: auto !important;
    flex: 1 !important;
    max-width: 200px !important;
    white-space: nowrap !important;
    font-weight: bold !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3) !important;
    letter-spacing: 0.03em !important;
    min-height: 56px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

section .inner {
	padding:30px 0 !important;
}

/* 採用情報 */
#recruit .inner {
	width: 92%;
	padding: 40px 30px;
}
#recruit table {
	width: 92% !important;
	margin:  0 auto !important;
}
#recruit table th {
	text-align: left !important;
	font-weight: 700;
	color:#333;
}

/* 募集要項 */
#recruitment-message p {
	width: 92% !important;
	margin: 0 auto 40px;
	text-align: justify;
}

/* =========================================================
新規追加：実際のHTML構造に対応した修正
=========================================================== */

/* トップナビゲーションを非表示 */
#topnav {
    display: none !important;
}

/* 選ばれる3つの理由 */
#top-about {
	padding: 30px 0 !important;
}

#top-about .aarre-mark {
	width: 80px;
	margin: 0 auto 20px;
}

#top-about h2 {
	font-size: 22px !important;
	margin-bottom: 15px !important;
}

#top-about h2 span {
	font-size: 26px !important;
}

#top-about p {
	font-size: 14px !important;
	padding: 0 15px;
	margin-bottom: 30px !important;
}

@media screen and (max-width: 640px) {
    #top-about ul {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        padding: 0 !important;  /* 左右のパディングを0に */
        gap: 0 !important;  /* 画像間の隙間を0に */
        justify-content: space-between;  /* 均等配置 */
        align-items: center;
        width: 100% !important;  /* 幅100% */
        margin: 0 !important;  /* マージンも0 */
    }

    #top-about ul li {
        width: 33.333% !important;  /* 正確に3分割 */
        max-width: none !important;  /* 最大幅制限を解除 */
        flex: 1 1 33.333%;  /* フレックスで均等に */
        margin: 0 !important;
        padding: 0 !important;
    }

    #top-about ul li img {
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
}

/* 先輩ドライバーの声（#clinicDirector） */
#clinicDirector {
	padding: 40px 0 !important;
	    overflow-x: hidden !important;  /* ← これを追加 */
}

#clinicDirector .inner {
	flex-direction: column !important;
	padding: 0 !important;
}

#clinicDirector .director-greeting,
#clinicDirector .director-img {
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

#clinicDirector .director-img {
    order: -1;
    margin-bottom: 30px !important;
    padding: 0 !important;
    margin-left: calc(-50vw + 50%) !important;  /* より安全な計算方法 */
    margin-right: calc(-50vw + 50%) !important;
    width: 100vw !important;
}

#clinicDirector .director-img img {
    width: 100%;
    max-width: none;
    margin: 0;
    display: block;
    aspect-ratio: 16/10;
    object-fit: cover;
}

#clinicDirector .director-greeting {
	padding: 0 15px 30px !important;
}

#clinicDirector .director-greeting h2 {
	font-size: 18px !important;
	padding: 12px 15px !important;
	margin: 0 -15px 20px !important;
	background-color: #2a2a2a !important;
	color: #ffffff !important;
	border-bottom: 4px solid #ffd700 !important;
	text-align: center !important;
}

#clinicDirector .director-greeting h3 {
	font-size: 14px !important;
	padding: 10px 15px !important;
	margin: 0 -15px 20px !important;
	background: #f8f8f8 !important;
	text-align: center !important;
	line-height: 1.6 !important;
}

#clinicDirector .director-greeting p strong {
	font-size: 14px !important;
	padding: 8px 15px !important;
	margin: 20px -15px 10px !important;
	background: #dc143c !important;
	color: #fff !important;
	display: block !important;
}

#clinicDirector .director-greeting p strong:before {
	content: "Q. ";
	font-weight: bold;
	margin-right: 5px;
}

#clinicDirector .director-greeting p {
	font-size: 13px !important;
	padding: 10px 12px !important;
	line-height: 1.7 !important;
	background: #fafafa !important;
	border-left: 3px solid #1a1a1a !important;
	margin-bottom: 15px !important;
}

#clinicDirector .director-name {
	text-align: center !important;
	margin: 25px 0 20px !important;
	padding: 15px !important;
	background: #f8f8f8 !important;
	border-top: 1px solid #e0e0e0 !important;
	border-bottom: 1px solid #e0e0e0 !important;
}

#clinicDirector .director-name span {
	font-size: 18px !important;
}

#clinicDirector .director-greeting ul {
	margin-top: 20px;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

#clinicDirector .director-greeting ul li {
	width: 100%;
	max-width: 280px;
}

#clinicDirector .director-greeting ul li a {
	font-size: 14px !important;
	padding: 12px 15px !important;
	display: block !important;
	text-align: center !important;
}

#clinicDirector.director-second {
	background: #F8F8F8;
	    overflow-x: hidden !important;  /* ← これを追加 */
}

#clinicDirector.director-second .inner {
	flex-direction: column !important;
}

#clinicDirector.director-second .director-img {
    order: -1;
    margin-bottom: 30px !important;
    padding: 0 !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    width: 100vw !important;
}
	
#clinicDirector.director-second .director-img img {
    width: 100%;
    max-width: none;
    margin: 0;
    display: block;
    aspect-ratio: 16/10;
    object-fit: cover;
}

/* 募集要項ハイライト（上部） */
#recruitment-highlight {
	padding: 30px 15px !important;
	background: #FFF;
}

#recruitment-highlight .recruitment-summary-main h2 {
	font-size: 22px !important;
	padding: 12px 15px !important;
	margin-bottom: 25px !important;
}

#recruitment-highlight .recruitment-summary-main h2 span {
	font-size: 12px !important;
	display: block;
	margin-top: 5px;
}

#recruitment-highlight .reserved-telnum {
	font-size: 26px !important;
	margin: 20px 0 !important;
}

#recruitment-highlight .reserved-telnum span {
	font-size: 12px !important;
}

#recruitment-highlight .net-reserved a {
	font-size: 14px !important;
	padding: 12px 20px !important;
	display: block !important;
	width: 90% !important;
	max-width: 280px !important;
	margin: 0 auto !important;
}

#recruitment-highlight .yoyaku {
	font-size: 13px !important;
	margin: 10px 0 20px !important;
}

#recruitment-highlight .recruitment-table {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

#recruitment-highlight .recruitment-table table {
	min-width: 280px;
	width: 100%;
}

#recruitment-highlight .recruitment-table th,
#recruitment-highlight .recruitment-table td {
	font-size: 13px !important;
	padding: 8px 10px !important;
}

#recruitment-highlight .recruitment-table td.highlight-red {
	font-size: 15px !important;
}

#recruitment-highlight .recruitment-table td .small {
	font-size: 11px !important;
}

/* お知らせ・募集要項セクション（旧デザイン）を非表示 */
#news-consaltationHours {
	display: none !important;
}

/* よくある質問 */
#faq {
	padding: 40px 0 !important;
}

#faq .section-title {
	font-size: 18px !important;
	padding: 12px 15px !important;
	margin-bottom: 30px !important;
}

#faq .w600 {
	padding: 0 15px !important;
	max-width: 100% !important;
}

.annotation.bg-b {
	margin-bottom: 20px !important;
	padding: 15px !important;
	background-color: #fafafa !important;
	border-left: 4px solid #dc143c !important;
	border-radius: 0 !important;
}

.annotation dt {
	font-size: 14px !important;
	padding: 8px 15px 8px 40px !important;
	margin: -15px -15px 10px -15px !important;
	background: #dc143c !important;
	color: #fff !important;
	position: relative;
}

.annotation dt:before {
	width: 22px;
	height: 22px;
	font-size: 12px;
	left: 12px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(255,255,255,0.2);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.annotation dd {
	font-size: 13px !important;
	padding: 10px 15px !important;
	margin-left: -15px !important;
	margin-right: -15px !important;
	background: #ffffff !important;
	line-height: 1.7 !important;
}

/* お問い合わせセクション */
#contact {
	padding: 40px 0 60px !important;
	background: #ffffff;
}

#contact .section-title {
	font-size: 18px !important;
	padding: 12px 15px !important;
	margin-bottom: 20px !important;
}

#contact > .inner > p {
	font-size: 14px !important;
	padding: 0 15px;
	margin-bottom: 30px !important;
}

.row.col2 {
	flex-direction: column !important;
	margin: 30px 0 !important;
	padding: 0 15px !important;
	gap: 15px;
}

.contact-tel-box,
.contact-line-box {
	width: 100% !important;
	padding: 25px 20px !important;
}

.contact-tel-box {
	background: #2a2a2a !important;
	border-bottom: 5px solid #ffd700 !important;
}

.contact-tel-box h3 {
	color: #ffffff !important;
	font-size: 16px !important;
	margin-bottom: 15px !important;
}

.contact-tel-big {
	font-size: 24px !important;
	color: #ffd700 !important;
	margin: 15px 0 !important;
}

.contact-tel-box p {
	color: #ffffff !important;
	font-size: 13px !important;
	line-height: 1.6 !important;
}

.contact-line-box {
	background: #f8f8f8 !important;
	border-bottom: 5px solid #dc143c !important;
}

.contact-line-box h3 {
	color: #2a2a2a !important;
	font-size: 16px !important;
	margin-bottom: 15px !important;
}

.contact-line-box img {
	max-width: 150px !important;
	margin: 15px auto !important;
	display: block;
}

.contact-line-box p {
	color: #333 !important;
	font-size: 13px !important;
	line-height: 1.6 !important;
	text-align: center;
}

#form {
	margin: 30px 15px 0 !important;
	padding: 20px !important;
	background: #ffffff !important;
	box-shadow: 0 0 10px rgba(0,0,0,0.1) !important;
}

#form h3 {
	font-size: 16px !important;
	padding: 10px !important;
	margin: -20px -20px 20px !important;
	background: #dc143c !important;
	color: #ffffff !important;
	text-align: center !important;
}

/* お知らせセクション（下部） */
#news-info {
	padding: 30px 15px !important;
	background: #F8F8F8;
}

#news-info h2 {
	font-size: 18px !important;
	padding: 12px 15px !important;
	margin: 0 -15px 25px !important;
	background-color: #2a2a2a !important;
	color: #ffffff !important;
	border-bottom: 4px solid #ffd700 !important;
	text-align: center !important;
}

#news-info h2 span {
	font-size: 11px !important;
	display: block;
	margin-top: 5px;
}

#news-info .news-list {
	padding: 20px !important;
	background: #FFF !important;
	border-left: 4px solid #dc143c !important;
}

#news-info .toInfoList {
	text-align: center;
	margin-top: 20px;
}

#news-info .toInfoList a {
	display: inline-block;
	background: #2a2a2a !important;
	color: #fff !important;
	padding: 10px 30px !important;
	font-size: 14px !important;
	border-radius: 0 !important;
}

/* アクセス（地図） */
#access {
	padding: 0 !important;
}

#g-map {
	width: 100%;
	height: 300px !important;
}

#g-map iframe {
	width: 100% !important;
	height: 300px !important;
}

/* 募集要項詳細 */
#requirements {
	padding: 40px 0 !important;
	background: #FFF;
}

#requirements .section-title {
	font-size: 18px !important;
	padding: 12px 15px !important;
	margin-bottom: 30px !important;
}

#requirements .table {
	padding: 0 15px;
}

#requirements .table.w600 {
	max-width: 100% !important;
}

#requirements table.border {
	width: 100% !important;
}

#requirements table.border th {
	font-size: 13px !important;
	padding: 8px !important;
	background: #1A1A1A !important; color: #FFF !important;
	width: 35% !important;
}

#requirements table.border td {
	font-size: 13px !important;
	padding: 8px !important;
	line-height: 1.6 !important;
}

}

/* 480px以下の調整 */
@media screen and (max-width: 480px) {
    .main-title {
        font-size: 32px !important;
    }
    .badge {
        font-size: 14px !important;
        padding: 10px 16px !important;
    }
    .feature-item {
        font-size: 13px !important;
        padding: 8px 12px !important;
    }
    .btn-tel,
    .btn-web {
        font-size: 15px !important;
        padding: 16px 20px !important;
        max-width: 170px !important;
    }
    
    #recruitment-highlight .reserved-telnum {
        font-size: 24px !important;
    }
    
    .contact-tel-big {
        font-size: 22px !important;
    }
}

/* 380px以下 */
@media screen and (max-width: 380px) {
    .main-title {
        font-size: 28px !important;
    }
    .badge {
        font-size: 13px !important;
        padding: 8px 14px !important;
    }
    .feature-item {
        font-size: 12px !important;
        padding: 7px 10px !important;
    }
    .btn-tel,
    .btn-web {
        font-size: 14px !important;
        padding: 14px 16px !important;
        max-width: 150px !important;
        min-height: 48px !important;
    }
    
    #top-about h2 {
        font-size: 20px !important;
    }
    
    #top-about h2 span {
        font-size: 24px !important;
    }
}

/* 320px以下（超小型デバイス対応強化） */
@media screen and (max-width: 320px) {
    .mainvisual-content {
        padding: 30px 15px !important;
    }
    
    .main-title {
        font-size: 22px !important;
        line-height: 1.3 !important;
    }
    
    .badge {
        font-size: 11px !important;
        padding: 6px 8px !important;
    }
    
    .badges {
        gap: 5px !important;
    }
    
    .feature-item {
        font-size: 10px !important;
        padding: 5px 6px !important;
    }
    
    .features {
        gap: 4px !important;
    }
    
    .btn-tel,
    .btn-web {
        font-size: 11px !important;
        padding: 10px 8px !important;
        max-width: 130px !important;
        min-height: 40px !important;
    }
    
    .cta-buttons {
        gap: 6px !important;
    }
    
    #top-about .aarre-mark {
        width: 60px;
    }
    
    #top-about h2 {
        font-size: 18px !important;
    }
    
    #top-about h2 span {
        font-size: 22px !important;
    }
    
    #recruitment-highlight .reserved-telnum {
        font-size: 22px !important;
    }
    
    .contact-tel-big {
        font-size: 20px !important;
    }
    
    #clinicDirector .director-greeting h2 {
        font-size: 16px !important;
    }
    
    #clinicDirector .director-greeting h3 {
        font-size: 13px !important;
    }
    
    #clinicDirector .director-greeting p strong {
        font-size: 13px !important;
    }
    
    #clinicDirector .director-greeting p {
        font-size: 12px !important;
    }
}

/* ========================================== */
/* レスポンシブ対応（タブレット用）            */
/* ========================================== */
@media (max-width: 1024px) and (min-width: 641px) {
    .driver-voice-container {
        max-width: 100%;
    }
    
    .driver-qa-wrapper {
        padding: 0 30px;
    }
}

/* ========================================== */
/* レスポンシブ対応（スマートフォン用）         */
/* ========================================== */
@media (max-width: 768px) {
    /* タイトル縮小 */
    .driver-header-title {
        font-size: 22px;
        padding: 15px 20px;
    }
    
    /* Q&Aラッパーのパディング調整 */
    .driver-qa-wrapper {
        padding: 0 20px;
    }
    
    /* 画像の比率をモバイル用に調整 */
    .driver-photo {
        aspect-ratio: 4/3;
    }
    
    /* Q&Aアイテムのパディング調整 */
    .driver-qa-item {
        padding: 15px;
        margin-bottom: 20px;
    }
    
    /* Qマークサイズ調整 */
    .driver-q-mark {
        width: 35px;
        height: 35px;
        font-size: 20px;
    }
    
    /* 質問文字サイズ調整 */
    .driver-question-text {
        font-size: 17px;
    }
    
    /* 回答の調整 */
    .driver-answer {
        font-size: 15px;
        margin-left: 50px;
    }
    
    /* ボタンを縦並びに */
    .driver-button-container {
        flex-direction: column;
        padding: 20px;
    }
    
    .driver-btn {
        width: 100%;
    }
}

@media screen and (max-width: 480px) {
    #top-about ul {
        gap: 2px;  /* さらに隙間を狭める */
    }
    
    #top-about ul li {
        max-width: 130px;  /* 最大幅を少し小さく */
    }
}

@media screen and (max-width: 380px) {
    #top-about ul {
        padding: 0 3px;
        gap: 1px;  /* 最小限の隙間 */
    }
    
    #top-about ul li {
        max-width: 110px;
    }
}

@media screen and (max-width: 640px) {
    /* GOアプリページの電話ボックスを全幅に */
    #go-app-page .contact-tel-box {
        width: 100vw !important;
        margin-left: calc(-50vw + 50%) !important;
        margin-right: calc(-50vw + 50%) !important;
    }
}

@media screen and (max-width: 768px) {
    .mw_wp_form .form-container {
        padding: 30px 20px;
    }
    
    .mw_wp_form .radio-item,
    .mw_wp_form .checkbox-item {
        flex: 0 0 100%;
    }
    
    .mw_wp_form .tel-group {
        gap: 8px;
    }
    
    .mw_wp_form .submit-btn {
        width: 100%;
        padding: 16px 40px;
    }
}
/* ================================================= */
/* 金星タクシー札幌版 モバイル修正パッチ v3           */
/* 2026-02-18                                         */
/* ================================================= */

/* 1. ヘッダー：白背景→ダーク（ロゴが見える） */
#header {
    background: rgba(10,10,10,0.95) !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.3) !important;
}

/* 2. メインビジュアル高さ調整 */
#mainVisual_sp {
    height: 75vh !important;
}

/* 3. バッジ（赤帯）モバイル表示 */
.main-visual-sp .feature-badge {
    display: inline-block !important;
    background: #C1272D !important;
    color: #FFF !important;
    padding: 6px 12px !important;
    font-size: 12px !important;
    font-weight: bold !important;
    margin: 0 3px 8px !important;
}

/* 4. 配車ボタン（黄帯）モバイル表示 */
.main-visual-sp .main-tel-btn {
    display: inline-block !important;
    background: #FFD700 !important;
    color: #0A0A0A !important;
    padding: 12px 25px !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
}

/* 5. お知らせ：コンパクト表示 */
.news-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.news-list .news-item {
    display: block !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #EEE !important;
}

.news-list .news-category {
    display: inline-block !important;
    vertical-align: middle !important;
    background: #0A0A0A !important;
    color: #FFD700 !important;
    padding: 2px 8px !important;
    font-size: 10px !important;
    font-weight: bold !important;
    border: none !important;
    margin-right: 8px !important;
}

.news-list .news-date {
    display: inline-block !important;
    vertical-align: middle !important;
    font-size: 12px !important;
    color: #888 !important;
}

.news-list .news-title {
    display: block !important;
    margin-top: 5px !important;
    font-size: 14px !important;
    color: #333 !important;
    font-weight: bold !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-decoration: none !important;
}

/* 6. サービスパネル 2×2グリッド */
@media screen and (max-width: 640px) {
    .service-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
        padding: 0 15px !important;
    }

    .service-grid .service-item {
        width: 100% !important;
        margin: 0 !important;
    }

    .service-grid .service-item h3 {
        font-size: 14px !important;
    }

    .service-grid .service-item p {
        font-size: 11px !important;
    }
}

/* 7. ホークアイセクション：テキスト調整 */
.hawkeye-section {
    padding: 50px 0 !important;
}

.hawkeye-title {
    font-size: 22px !important;
    line-height: 1.4 !important;
    margin-bottom: 15px !important;
}

.hawkeye-text {
    font-size: 14px !important;
    line-height: 1.7 !important;
    margin-bottom: 25px !important;
}

.hawkeye-badge {
    font-size: 12px !important;
    padding: 6px 15px !important;
    margin-bottom: 15px !important;
}

.hawkeye-btn {
    font-size: 14px !important;
    padding: 12px 30px !important;
}

/* 8. フッター：モバイルで1列に */
@media screen and (max-width: 640px) {
    #footer .row {
        flex-direction: column !important;
    }

    #footer .f-address,
    #footer .f-contact {
        width: 100% !important;
        margin-bottom: 30px !important;
    }
}