/*
Theme Name: 1osMC
Theme URI: https://web.1os.co.jp/
Author: One OS inc.
Author URI: https://1os.co.jp/
Description: このテーマは株式会社ワンオーエス(サービス名：クオリティWebデザイン)によって作成されました。高品質でカスタマイズ可能なデザインを提供し、ユーザーに素晴らしいエクスペリエンスをもたらします。
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: 1os_mc
Tags: レスポンシブ, マルチ, 1カラム, 2カラム, 翻訳対応
*/

/**********  カスタマイズCSS **********/

#header_title_logo{
	max-width:240px;
}
#header_copy_wrapper{
	z-index:2;
	top:6px;
}
#header_copy_container{
	line-height:18px!important;
}
#mainview_wrap {
	background:#eee;
}

#breadcrumb_wrapper{
	border-bottom:1px solid #ccc;
}

.more_link{
	padding:1em 1.6em;
	border-radius:2em;
}
form.wpcf7-form button.wpcf7Btn::after, #send_contact_form::after, .more_link::after{
	width: 1.7em;
    height: 1.7em;
}

.footer_info_org_name{
	font-weight:600;
	font-size:1.1em
}

/* ==================================================
   メインビュー：格子模様オーバーレイ
================================================== */
#mainview_slider .slide_img_wrap::after,
#page_title_bg_container::after{
	position:absolute;
	inset:0;
	background-image:
		linear-gradient(to right,rgba(0,0,0,.4) 1px,transparent 1px),
		linear-gradient(to bottom,rgba(0,0,0,.4) 1px,transparent 1px);
	background-size:3px 3px;
	content:"";
	pointer-events:none;
	z-index:1;
}
#mainview_slider .slide_caption_wrap,
#page_title_container{
	z-index:12;
}

/* ==================================================
   TOP：共通デザイン
================================================== */
#top_concept,
#top_recruit,
#top_service,
#top_usedcar,
#top_strength,
#top_company,
#top_contact{
	--top-dark:#202c32;
	--top-accent:rgba(40,34,22,0.70);
	--top-light:#f5f5f2;
}
#top_concept .container,
#top_recruit .container,
#top_service .container,
#top_usedcar .container,
#top_strength .container,
#top_company .container,
#top_contact .container{
	width:100%;
	max-width:1200px;
	padding-right:1rem;
	padding-left:1rem;
}
.top_label{
	font-size:.75rem;
	font-weight:700;
	line-height:1.4;
	padding-left:.3em;
}

/* ==================================================
   TOP：コンセプト
================================================== */
#top_concept{
	background:#fff;
}
#top_concept .top_concept_layout{
	align-items:center;
}
#top_concept .top_concept_visual{
	min-width:0;
}
#top_concept .top_concept_image{
	display:block;
	aspect-ratio:16/9;
	object-fit:cover;
}
#top_concept .top_image_caption{
	position:absolute;
	right:1rem;
	bottom:1rem;
	color:#fff;
	font-size:.7rem;
	font-weight:700;
	letter-spacing:.15em;
	text-shadow:0 1px 5px rgba(0,0,0,.5);
}
/* ==================================================
   TOP：サービス案内
================================================== */
#top_service{
	background:var(--top-light);
}
#top_service .top_service_heading_link{
	display:flex;
	align-items:end;
}
#top_service .top_service_card{
	min-width:0;
	overflow:hidden;
	background:#fff;
	color:var(--top-dark);
	text-decoration:none;
	transition:box-shadow .3s,transform .3s;
}
#top_service .top_service_image{
	position:relative;
	overflow:hidden;
}
#top_service .top_service_image img{
	display:block;
	aspect-ratio:16/9;
	object-fit:cover;
	transition:transform .4s;
}
#top_service .top_service_number{
	position:absolute;
	top:1rem;
	left:1.25rem;
	color:#fff;
	font-size:1.9rem;
	font-weight:700;
	text-shadow:0 1px 5px rgba(0,0,0,.8);
	opacity:.8
}
#top_service .top_card_label{
	color:var(--top-accent);
	font-size:.7rem;
	font-weight:700;
	letter-spacing:.1em;
}
#top_service .top_card_arrow{
	display:flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
	width:38px;
	height:38px;
	border:1px solid #ddd;
	border-radius:50%;
	font-size:1.1rem;
	transition:background .3s,color .3s;
}
/* ==================================================
   TOP：中古車販売
================================================== */
#top_usedcar{
	background:#fff;
}
#top_usedcar .top_usedcar_layout{
	align-items:center;
}
#top_usedcar .top_usedcar_visual{
	position:relative;
	min-width:0;
	padding-right:1.5rem;
	padding-bottom:1.5rem;
}
#top_usedcar .top_usedcar_image{
	display:block;
	aspect-ratio:16/9;
	object-fit:cover;
}
#top_usedcar .top_usedcar_decoration{
	position:absolute;
	right:0;
	bottom:0;
	display:flex;
	align-items:center;
	justify-content:center;
	width:128px;
	background:var(--top-accent);
	color:#fff;
	font-size:1rem;
	font-weight:700;
	line-height:1.4;
	letter-spacing:.05em;
}
/* ==================================================
   TOP：選ばれる理由
================================================== */
#top_strength{
	background:var(--top-dark);
	color:#fff;
}
#top_strength .top_strength_item{
	min-width:0;
	padding:1rem 0;
	border-top:1px solid rgba(255,255,255,.25);
}
.strength_number{
	font-size:2rem;
	font-weight:300;
	line-height:1;
}
#top_strength .top_strength_item p:last-child{
	color:rgba(255,255,255,.8);
}
/* ==================================================
   TOP：会社案内
================================================== */
#top_company{
	background:#fff;
}
#top_company .top_company_layout{
	align-items:center;
}
#top_company .top_company_visual{
	min-width:0;
}
#top_company .top_company_image{
	display:block;
	aspect-ratio:16/9;
	object-fit:cover;
}
/* ==================================================
   TOP：お問い合わせ
================================================== */
#top_contact .top_contact_inner{
	max-width:800px;
	margin:0 auto;
}
#top_contact .top_button{
	min-width:260px;
}
/* ==================================================
   TOP：タブレット以上
================================================== */
@media(min-width:768px){
	#top_service .top_service_card:hover{
		transform:translateY(-5px);
		box-shadow:0 15px 35px rgba(0,0,0,.08);
	}
	#top_service .top_service_card:hover img{
		transform:scale(1.05);
	}
	#top_service .top_service_card:hover .top_card_arrow{
		background:var(--top-dark);
		color:#fff;
	}
	#top_strength .top_strength_item{
		padding:2rem 1rem;
	}
	#top_usedcar .top_usedcar_decoration{
		width:160px;
		font-size:1.25rem;
	}
}
/* ==================================================
   TOP：PC以上
================================================== */
@media(min-width:1024px){
	#top_service .top_service_heading_link{
		justify-content:flex-end;
	}
	#top_strength .top_strength_item{
		padding:2.5rem 1.5rem;
	}
	#top_usedcar .top_usedcar_decoration{
		width:180px;
		font-size:1.35rem;
	}
}
/* ==================================================
   TOP：動きの軽減設定
================================================== */
@media(prefers-reduced-motion:reduce){
	.top_more_link,
	.top_button,
	#top_service .top_service_card,
	#top_service .top_service_image img,
	#top_service .top_card_arrow{
		transition:none;
	}
}


/* ==================================================
   TOP：LINE公式アカウント
================================================== */
#top_line{
	--top-line:#06c755;
	background:#fff;
}
#top_line .top_line_inner{
	background:#f1f8f3;
}
#top_line .top_line_button{
	background:var(--top-line);
	color:#fff;
	font-weight:700;
	text-decoration:none;
	transition:background .3s;
	border:1px solid #3c9100
}
#top_line .top_line_button:hover{
	background:#05a847;
	color:#fff;
}
#top_line .top_line_feature{
	background:#fff;
	border:1px solid #d8eadf;
	border-left:3px solid var(--top-line);
}
#top_line .top_line_number{
	color:#07883c;
	font-size:.8rem;
	font-weight:700;
	letter-spacing:.1em;
}
#top_line .top_line_qr_wrap{
	display:none;
}
#top_line .top_line_qr{
	background:#fff;
	border:1px solid #d8eadf;
}
#top_line .top_line_qr_label{
	color:#07883c;
	font-size:.8rem;
	font-weight:700;
	letter-spacing:.08em;
}
#top_line .top_line_qr_image{
	max-width:220px;
	margin:0 auto 1rem;
}
#top_line .top_line_qr_image img{
	display:block;
	width:100%;
	height:auto;
}

/* ==================================================
   TOP：採用情報
================================================== */
#top_recruit{
	background:var(--top-light);
}
#top_recruit .top_recruit_detail{
	padding-top:1.5rem;
	border-top:1px solid #d5d2c9;
}
#top_recruit .top_recruit_status{
	display:inline-block;
	padding:.4rem .9rem;
	background:var(--top-dark);
	color:#fff;
	font-size:.8rem;
	font-weight:700;
	letter-spacing:.05em;
}
/* ==================================================
   TOP：LINE・採用情報 PC調整
================================================== */
@media(min-width:768px){
	#top_line .top_line_features{
		align-content:center;
	}
	#top_line .top_line_qr_wrap{
		display:block;
		margin-top:1rem;
	}
	#top_recruit .top_recruit_detail{
		padding-top:0;
		padding-left:2rem;
		border-top:0;
		border-left:1px solid #d5d2c9;
	}
}
@media(min-width:1024px){
	#top_line .top_line_side{
		display:grid;
		grid-template-columns:minmax(0,1fr) 200px;
		gap:1.5rem;
		align-items:stretch;
	}
	#top_line .top_line_side > .d-grid{
		grid-template-rows:repeat(2,minmax(0,1fr));
		height:100%;
	}
	#top_line .top_line_feature{
		height:100%;
	}
	#top_line .top_line_qr_wrap{
		display:block;
		height:100%;
		margin-top:0;
	}
	#top_line .top_line_qr{
		display:flex;
		flex-direction:column;
		justify-content:center;
		height:100%;
	}
}
@media(min-width:1280px){
	#top_line .top_line_side{
		grid-template-columns:minmax(0,1fr) 260px;
	}
}


/* ==================================================
   中古車販売・買取：全国からのお車探し
================================================== */
.usedcar_search_card{
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	height:100%;
	padding:2rem 1.5rem;
	background:#fff;
	border:1px solid rgba(20,60,100,.08);
	border-radius:.75rem;
	box-shadow:0 8px 24px rgba(10,35,70,.06);
	text-align:center;
}
.usedcar_search_number{
	display:block;
	margin-bottom:1rem;
	font-size:3.5rem;
	line-height:1;
}
.usedcar_search_card .title_h3{
	position:relative;
	width:100%;
	margin:0 0 1.25rem;
	padding-bottom:1rem;
}
.usedcar_search_card .title_h3::after{
	content:"";
	position:absolute;
	bottom:0;
	left:50%;
	width:40px;
	height:3px;
	border-radius:2px;
	transform:translateX(-50%);
}
.usedcar_search_card p{
	line-height:1.9;
}
@media(min-width:1024px){
	.usedcar_search_card{
		padding:2.5rem 1.75rem;
	}
}

/* ==================================================
   中古車販売・買取：安心のサポート
================================================== */
.usedcar_support_card{
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	height:100%;
	padding:2rem 1.5rem;
	background:#fff;
	border:1px solid rgba(20,60,100,.1);
	border-radius:.75rem;
	box-shadow:0 8px 24px rgba(10,35,70,.06);
	text-align:center;
}
#usedcar_support .usedcar_support_number{
	display:block;
	margin-bottom:1rem;
	color:#c5d9ea;
	font-size:3.5rem;
	line-height:1;
}
.usedcar_support_card .title_h3{
	position:relative;
	width:100%;
	margin:0 0 1.25rem;
	padding-bottom:1rem;
}
.usedcar_support_card .title_h3::after{
	content:"";
	position:absolute;
	bottom:0;
	left:50%;
	width:40px;
	height:3px;
	border-radius:2px;
	transform:translateX(-50%);
}
.usedcar_support_card p{
	line-height:1.9;
}
@media(min-width:1024px){
	.usedcar_support_card{
		padding:2.5rem 2rem;
	}
}


/* ==================================================
   24時間ロードサービス：対応の流れ
================================================== */
#roadservice_flow .roadservice_flow_list{
	row-gap:3.5rem;
}
#roadservice_flow .roadservice_flow_card{
	padding:2rem 1.5rem;
	background:#fff;
	border:1px solid rgba(20,60,100,.1);
	border-radius:.75rem;
	box-shadow:0 8px 24px rgba(10,35,70,.06);
}
#roadservice_flow .roadservice_flow_number{
	margin:0 0 1rem;
	font-size:1.2rem;
	font-weight:700;
	line-height:1;
}
#roadservice_flow .roadservice_flow_card .title_h3{
	margin:0 0 1.25rem;
	padding-bottom:1rem;
	border-bottom:2px solid #e3edf6;
}
#roadservice_flow .roadservice_flow_card p:last-child{
	line-height:1.9;
}
#roadservice_flow .roadservice_flow_arrow{
	bottom:-2.9rem;
	left:50%;
	width:2.3rem;
	height:2.3rem;
	font-size:1.6rem;
	transform:translateX(-50%);
	z-index:2;
}
@media(min-width:1024px){
	#roadservice_flow .roadservice_flow_list{
		column-gap:3.5rem;
		row-gap:1rem;
	}
	#roadservice_flow .roadservice_flow_card{
		padding:2.5rem 1.5rem;
	}
	#roadservice_flow .roadservice_flow_arrow{
		top:50%;
		right:-2.9rem;
		bottom:auto;
		left:auto;
		transform:translateY(-50%);
	}
	#roadservice_flow .roadservice_flow_arrow .svg_icon{
		transform:rotate(-90deg);
	}
}


/* ==================================================
   会社案内：会社概要
================================================== */
#company_profile .company_profile_box{
	box-shadow:0 8px 28px rgba(10,35,70,.05);
}
#company_profile .company_profile_row{
	gap:.35rem;
	border-bottom:1px solid rgba(20,60,100,.12);
}
#company_profile .company_profile_row:last-child{
	border-bottom:none;
}
#company_profile .company_profile_row dt{
	font-weight:700;
}
#company_profile .company_profile_row dd{
	line-height:1.9;
}
@media(min-width:768px){
	#company_profile .company_profile_row{
		gap:1.5rem;
	}
	#company_profile .company_profile_row dt{
		flex:0 0 25%;
	}
	#company_profile .company_profile_row dd{
		flex:1;
		min-width:0;
	}
}

/* ==================================================
   会社案内：アクセス
================================================== */
#company_access .company_access_card{
	border:1px solid rgba(20,60,100,.1);
	border-top:4px solid rgb(122,109,83);
	box-shadow:0 8px 28px rgba(10,35,70,.06);
}
#company_access .company_access_card .title_h3{
	padding-bottom:.75rem;
	border-bottom:1px solid rgba(20,60,100,.12);
}
#company_access .company_access_card a[href^="tel:"]{
	font-weight:700;
	text-decoration:none;
}
#company_access .company_access_map .google_map{
	overflow:hidden;
	border-radius:.5rem;
}


/* ==================================================
   採用情報：募集要項
================================================== */
#recruit_information .recruit_information_box{
	border-top:4px solid rgb(122,109,83);
	box-shadow:0 8px 28px rgba(10,35,70,.06);
}
#recruit_information .recruit_information_row{
	gap:.35rem;
	border-bottom:1px solid rgba(20,60,100,.12);
}
#recruit_information .recruit_information_row:last-child{
	border-bottom:none;
}
#recruit_information .recruit_information_row dt{
	font-weight:700;
}
#recruit_information .recruit_information_row dd{
	line-height:1.9;
}
@media(min-width:768px){
	#recruit_information .recruit_information_row{
		gap:1.5rem;
	}
	#recruit_information .recruit_information_row dt{
		flex:0 0 25%;
	}
	#recruit_information .recruit_information_row dd{
		flex:1;
		min-width:0;
	}
}



/* ==================================================
   お問い合わせ：よくあるご質問
================================================== */
#contact_faq .contact_faq_item{
	border:1px solid rgba(20,60,100,.1);
	box-shadow:0 5px 20px rgba(10,35,70,.04);
	overflow:hidden;
	transition:border-color .3s,box-shadow .3s;
}
#contact_faq .contact_faq_item[open]{
	border-color:rgba(36,105,173,.3);
	box-shadow:0 8px 25px rgba(10,35,70,.07);
}
#contact_faq .contact_faq_question{
	padding:1.25rem 3.5rem 1.25rem 3.75rem;
	cursor:pointer;
	list-style:none;
	line-height:1.7;
}
#contact_faq .contact_faq_question::-webkit-details-marker{
	display:none;
}
#contact_faq .contact_faq_question::before{
	content:"Q";
	position:absolute;
	left:1.25rem;
	font-size:1.5rem;
	font-weight:700;
	line-height:1;
}
#contact_faq .contact_faq_question::after{
	content:"+";
	position:absolute;
	right:1.25rem;
	top:50%;
	transform:translateY(-50%) rotate(0);
	color:#2469ad;
	font-size:1.75rem;
	font-weight:400;
	line-height:1;
	transition:transform .3s;
}
#contact_faq .contact_faq_item[open]:not(.is-closing) .contact_faq_question::after{
	transform:translateY(-50%) rotate(45deg);
}
#contact_faq .contact_faq_answer{
	display:grid;
	grid-template-rows:0fr;
	overflow:hidden;
	transition:grid-template-rows .4s ease;
}
#contact_faq .contact_faq_item[open]:not(.is-closing) .contact_faq_answer{
	grid-template-rows:1fr;
}
#contact_faq .contact_faq_answer_inner{
	min-height:0;
	overflow:hidden;
	padding:0 1.25rem 0 3.75rem;
	opacity:0;
	transition:opacity .3s ease;
}
#contact_faq .contact_faq_item[open]:not(.is-closing) .contact_faq_answer_inner{
	opacity:1;
}
#contact_faq .contact_faq_answer_inner::before{
	content:"A";
	position:absolute;
	margin-left:-2.5rem;
	color:#2469ad;
	font-size:1.5rem;
	font-weight:700;
	line-height:1;
}
#contact_faq .contact_faq_answer_inner p{
	padding:1rem 0 1.5rem;
	border-top:1px solid rgba(20,60,100,.1);
}
#contact_faq .contact_faq_question::before,
#contact_faq .contact_faq_answer_inner::before{
	font-family:"Hiragino Mincho ProN","Yu Mincho",serif;
	letter-spacing:.05em;
	font-weight:700;
}
@media(min-width:768px){
	#contact_faq .contact_faq_question{
		padding:1.5rem 4rem 1.5rem 4.5rem;
	}
	#contact_faq .contact_faq_question::before{
		left:1.75rem;
	}
	#contact_faq .contact_faq_question::after{
		right:1.75rem;
	}
	#contact_faq .contact_faq_answer_inner{
		padding:0 1.75rem 0 4.5rem;
	}
}
/* ==================================================
   お問い合わせ：FAQ開閉アニメーション
================================================== */
#contact_faq .contact_faq_item.is-closing .contact_faq_answer{
	grid-template-rows:0fr;
}
#contact_faq .contact_faq_item.is-closing .contact_faq_answer_inner{
	opacity:0;
}
#contact_faq .contact_faq_item.is-closing .contact_faq_question::after{
	transform:translateY(-50%) rotate(0);
}
@media(prefers-reduced-motion:reduce){
	#contact_faq .contact_faq_item,
	#contact_faq .contact_faq_question::after,
	#contact_faq .contact_faq_answer,
	#contact_faq .contact_faq_answer_inner{
		transition:none;
	}
}

@media (min-width:768px) {

	#header_main_wrapper{
		padding:0 .8em
	}
}
@media (min-width: 1024px) {

	#header_main_wrapper{
		padding:0 1.2em
	}
	#header_title_logo{
		max-width:256px;
	}
	#global_nav > .menu-item > .menu_link{
		padding:0 .2em;
	}
	#global_nav > .menu-item-has-children > .menu_link{
		padding-right:28px;
	}
	#global_nav > .menu-item-has-children > .menu_link::after{
		width:28px;
		filter:drop-shadow(0 1px 1px rgba(0,0,0,1)) drop-shadow(0 3px 3px rgba(0,0,0,.9));
	}
	.scroll #header_title_logo{
		max-width:292px;
	}

}
@media (min-width: 1280px) {
	#header_title_logo{
		max-width:306px;
	}
}