@charset "utf-8";
/*===============================================
 画面の横幅が769px以上
===============================================*/

/***共通**********************************/
html{
	margin-top:0 !important;
}

body{
	font-family: Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", Arial, Sans-serif;
	font-size:16px;
	font-size: 1rem;
	margin:0;
	padding:0;
	line-height:1;
	letter-spacing: 0.5px;
	color: #332623;
	background: #fefaf5;
}

.cx:after{
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}

a {
	color: #bc000f;/*#e60012*/
	overflow: hidden;
	text-decoration: none;
}

a:visited {
	color: #bc000f;
}

a:hover {
	opacity: 0.75;
}

img{
	vertical-align:middle;
}

ul,
ol{
	margin:0;
	padding:0;
	line-height:100%;
}

ul li,
ol li{
	list-style:none;
}

.ac{
	text-align:center;
}

.al{
	text-align:left;
}

p{
	margin:0;
}

a img{
	border:none;
}

/*切り替え*/
.pc{display:block;}
.sp{display:none !important;}

/*head*/
.header{	
	width:100%;
	background:rgba( 255,255,255, 0.75 );
	position: relative;
	border-bottom:1px solid #efefef;
	top:0;
	left:0;
	box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);
}

.header .innner{
	max-width:1400px;
	min-width: 1024px;
	margin:0 auto;
	padding:8px 18px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
}

.header .innner .logo{
	width: 180px;
}

.header .innner .head_cont{
	width: calc(100% - 180px);
	text-align: right;
}

.header .innner ul.navi{
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
}

.header .innner ul.navi li{
	margin-right: 12px;
}

.header .innner ul.navi li a{
	display: block;
	text-decoration: none;
	color: #333;
	position: relative;
	padding: 6px 0 6px 12px;
	box-sizing: border-box;
}

.header .innner ul.navi li a:before{
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	width: 5px;
	height: 5px;
	margin: auto;
	border-right: 2px solid #e60012;
	border-bottom: 2px solid #e60012;
	transform: translateY(-50%) rotate(-45deg);
	vertical-align: middle;
}

/*block*/
section .inner{
	max-width: 1400px;
	min-width: 1024px;
	margin: 0 auto 36px auto;
	padding: 0 20px;
	box-sizing: border-box;
}

/*card*/
ul.cmncard{
	display: flex;
	flex-wrap: wrap;
}

ul.cmncard li{
	margin-left: 10px;
	margin-right: 10px;
	flex:1;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.25);
}

ul.cmncard li:first-child{
	margin-left: 0;
}

ul.cmncard li:last-child{
	margin-right: 0;
}

ul.cmncard.no-link li{
	box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
}

ul.cmncard.card3 li{
	width: calc((100% - 40px) / 3);
}

ul.cmncard.card4 li{
	width: calc((100% - 60px) / 4);
}

ul.cmncard.card5 li{
	width: calc((100% - 80px) / 5);
}

ul.cmncard li a{
	display: block;
	color: #333;
	height: 100%;
}

ul.cmncard_list li{
	background: #fff;
	border-radius: 12px;
	padding: 24px 32px;
	box-sizing: border-box;
	line-height: 1.6;
	margin-bottom: 12px;
}

/*title*/
section h2{
	font-size: 36px;
	font-size: 2.25rem;
	margin-bottom: 12px;
	line-height: 1.1;
}

section h2 strong{
	font-size: 16px;
	font-size: 1rem;
	color: #bc000f;
	margin-bottom: 12px;
	display: block;
}

section .lead_text{
	margin-bottom: 12px;
	color: #555;
	line-height: 1.3;
}

section ul.note-list{
	font-size: 14px;
	font-size: 0.875rem;
	color: #555;
	line-height: 1.4;
	margin-bottom: 12px;
}

section ul.note-list li{
	margin-bottom: 2px;
}

section ul.note-list li:last-child{
	margin-bottom:0px;
}

/*予約・お問い合わせボタン　cv_button*/
ul.cv_button{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	text-align: center;
	line-height: 1.2;
	padding: 16px 0;
}

ul.cv_button li.simulation{
	width: 100%;
	text-align: center;
	margin-bottom: 18px;
}

ul.cv_button li.simulation a{
	width: 440px;
	margin: 0 auto;
	background: linear-gradient(90deg, #f8de6d, #e5c534);
	border-bottom: 3px solid #e6c636;
	font-size: 20px;
	font-size: 1.25rem;
	border-radius: 100px;
	box-sizing: border-box;
	padding: 16px 20px 8px 20px;
	color: #333;
	display: block;
}

ul.cv_button li.reservation,
ul.cv_button li.search_store{
	width: 430px;
	margin: 0 8px;
	border-radius: 10px;
	box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.25);
}

ul.cv_button li.reservation a,
ul.cv_button li.search_store a{
	padding: 12px 20px 4px 20px;
	box-sizing: border-box;
	display: block;
	color: #fff;
	position: relative;
	border-radius: 10px;
	font-size: 26px;
	font-size: 1.625rem;
}

ul.cv_button li.reservation a{
	background: linear-gradient(180deg, #d33f39, #bc000f);
	box-shadow: 0px 5px 0px 0px #8b030d;
}

ul.cv_button li.search_store a{
	background: linear-gradient(180deg, #0052e8, #0042ba);
	box-shadow: 0px 5px 0px 0px #00276f;
}

ul.cv_button li a:after,
ul.cv_button li.search_store a:after,
.fixed_contents .button_box .fixed_button a:after{
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	right: 18px;
	width: 8px;
	height: 8px;
	border-right: 3px solid #fff;
	border-bottom: 3px solid #fff;
	transform: translateY(-50%) rotate(-45deg);
	margin-top: 2px;
}

ul.cv_button li.simulation a:after{
	display: none;
}

ul.cv_button li.reservation strong,
ul.cv_button li.search_store strong{
	font-size: 40px;
	font-size: 2.5rem;
}

ul.cv_button li.reservation strong span,
ul.cv_button li.search_store strong span{
	font-size: 32px;
	font-size: 2rem;
}

/*基本ボタン*/
.button_basic{
	text-align: center;
	margin:  0 auto;
	line-height: 1.2;
}

.button_basic a,
.button_basic.link{
	background: linear-gradient(90deg, #f8de6d, #e5c534);
	border-bottom: 3px solid #e6c636;
	border-radius: 100px;
	box-sizing: border-box;
	display: block;
	color: #333;
}

.button_basic.small{
	width: 180px;
}

.button_basic.medium{
	width: 260px;
}

.button_basic.small a,
.button_basic.small.link{
	padding: 12px 12px 8px 12px;
}

.button_basic.medium a,
.button_basic.medium.link{
	padding: 16px 12px 12px 12px;
}

/*画面固定ボタン*/
.fixed_contents{
	background:rgba( 0,0,0, 0.60 );
	position: fixed;
	left: 0;
	bottom: 0;
	padding: 16px 0;
	width: 100%;
	z-index: 100;
}

.fixed_contents .button_box{
	width: 900px;
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto;
}

.fixed_contents .button_box .fixed_button{
	padding: 0 8px;
	width: 50%;
	box-sizing: border-box;
}

.fixed_contents .button_box .fixed_button a{
	display: block;
	border-radius: 8px;
	padding: 12px 0 2px 0;
	color: #fff;
	font-size: 40px;
	font-size: 2.5rem;
	box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.25);
	text-align: center;
	line-height: 1.25;
	font-weight: bold;
	position: relative;
}

.fixed_contents .button_box .fixed_button a p{
	font-size: 25px;
	font-size: 1.5625rem;
	font-weight: normal;
}

.fixed_contents .button_box .fixed_button a span{
	font-size: 36px;
	font-size: 2.25rem;
}

.fixed_contents .button_box .fixed_button.reservation a{
	background: linear-gradient(180deg, #d33f39, #bc000f);
	border-bottom: 5px solid #8b030d;
}

.fixed_contents .button_box .fixed_button.reservation a:hover{
	background: linear-gradient(180deg, #de6e6a, #cd414c);
	border-bottom: 5px solid #a8424a;
	opacity: 1;
}

.fixed_contents .button_box .fixed_button.search_shop a{
	background: linear-gradient(180deg, #0052e8, #0042ba);
	border-bottom: 5px solid #00276f;
}

.fixed_contents .button_box .fixed_button.search_shop a:hover{
	background: linear-gradient(180deg, #407dec, #4071cc);
	border-bottom: 5px solid #405d93;
	opacity: 1;
}

/*main*/
.main{
	background: linear-gradient(0deg, #ffffff, #fefaf5 80%, #f3efea);
	width:100%;
	height:530px;	
}

.main .contents{
	text-align: center;
	padding-top: 46px;
	position: relative;
	width: 1360px;
}

.main .contents .main_contents{
	position: relative;
}

.main .contents h1{
	background: #bc000f;
	font-size: 20px;
	font-size: 1.25rem;
	color: #fff;
	padding: 10px 12px 8px 12px;
	width: 400px;
	margin: 0 auto 32px auto;
	box-sizing: border-box;
	border-radius: 100px;
	text-align: center;
	line-height: 1.2;
}

.main .contents h2{
	font-size: 68px;
	font-size: 4.25rem;
	line-height: 0.85;
	margin-top: 0;
}

.main .contents h2 strong{
	color: #bc000f;
	font-size: 68px;
	font-size: 4.25rem;
}

.main .contents h2 em{
	font-size: 110px;
	font-size: 6.875rem ;
	font-style: normal;
}

.main .contents p.text{
	font-size: 26px;
	font-size: 1.625rem;
	font-weight: bold;
	margin-bottom: 16px;
}

.main .contents p.text strong{
	color: #bc000f;
	margin: 0 2px 0 5px;
}

.main .contents p.text strong span{
	font-size: 58px;
	font-size: 3.625rem;
	letter-spacing: -3px;
	margin-right: 3px;
}

.main .contents .character{
	position: absolute;
	top: -24px;
	left:100px;
}

.main .movie{
	position: absolute;
	top:100px;
	right: 100px;
}

.main .movie p.title{
	background: #333;
	color: #fff;
	border-radius: 30px;
	padding: 8px 12px;
	box-sizing: border-box;
	margin-bottom: 12px;
	text-align: center;
}

.main .movie p.movie_button{
	background: #333;
	border-radius: 10px;
	position: relative;
}

.main .movie p.movie_button a{
	z-index: 10;
	display: block;
}

.main .movie p.movie_button:before {
  content: '';
  width: 33px;
  height: 33px;
  background: #f8f8f8;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  bottom: 0;
  margin-top: -18px;
  margin-left: -16px;
  z-index: 10;
}

.main .movie p.movie_button:after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 0 8px 12px;
  border-color: transparent transparent transparent #333;
  position: absolute;
  top: 50%;
  left: 50%;
  bottom: 0;
  margin-top: -10px;
  margin-left: -4px;
  z-index: 10;
}

.main .movie p.movie_button a:after{
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.6);
	content: "";
	top: 0;
	left: 0;
	border-radius: 10px;
	z-index: 6;
}

.main .badge{
	width: 810px;
	margin-left: 422px;
}

.main .badge ul{
	display: flex;
}

.main .badge ul li{
	margin-right: 6px;
}

.main .badge ul li p{
	font-size: 12px;
	font-size: 0.75rem;
	margin-top: 5px;
	color: #6c5721;
	letter-spacing: 0;
	width: 100%;
	text-align: center;
}

/*車種別の車検料金 price*/
.price ul.price_table{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.price ul.price_table li{
	width:calc(24% - 2px);
	border: 1px solid #bc000f;
	border-radius: 12px;
	background: #fff;
	text-align: center;
	margin-right: 1%;
	margin-bottom: 12px;
}

.price ul.price_table li .title{
	background: linear-gradient(45deg, #db4d46, #bc000f);
	border-radius: 12px 12px 0 0;
	align-items: center;
	display: flex;
	justify-content: center;
	color: #fff;
	text-align: center;
	height: 90px;
	padding: 0 6px;
}

.price ul.price_table li .title h3{
	font-size: 22px;
	font-size: 1.375rem;
	margin: 0;
	line-height: 1.2;
	display: block;
}

.price ul.price_table li .title p{
	margin-top: 6px;
}

.price ul.price_table li .contents{
	 padding: 12px 12px;
	 box-sizing: border-box;
	 line-height: 1.3;
}

.price ul.price_table li .contents .car{
	margin-bottom: 12px;
	height: 90px;
}

.price ul.price_table li .contents .ex{
	margin-bottom: 12px;
}

.price ul.price_table li .contents .fee{
	font-size: 56px;
	font-size: 3.5rem;
	color: #bc000f;
	font-weight: bold;
	line-height: 1;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, Meiryo, "ＭＳ Ｐゴシック", Arial, Sans-serif;
}

.price ul.price_table li .contents .fee span{
	font-size: 22px;
	font-size: 1.375rem;
}

.price ul.price_table li .contents .car,
.price ul.price_table li .contents .ex{
	display: flex;
	align-items: center;
	justify-content: center;
}

.price ul.read-container{
	display: flex;
	flex-wrap: wrap;
}

.price ul.read-container li{
	background: #fff;
	padding: 36px 42px;
	box-sizing: border-box;
	border-radius: 12px;
	line-height: 1.8;
	width: 50%;	
	margin-bottom: 12px;
}

.price ul.read-container li:nth-child(odd){
	width: calc(50% - 10px);
	margin-right: 10px;
}

.price ul.read-container li:nth-child(even) {
	width: calc(50% - 10px);
	margin-left: 10px;
}

.price ul.read-container li h3{
	font-size: 26px;
	font-size: 1.625rem;
	margin-bottom: 12px;
	text-align: center;
	margin: 0;
}

/*流れ flow*/
.flow ul li{
	background: #fff;
	padding: 36px 24px 24px 24px;
	box-sizing: border-box;
	border-radius: 12px;
	border: 1px solid #bc000f;
	position: relative;
	text-align: center;
}

.flow ul li:last-child{
	margin-right: 0px;
}

.flow ul li:after{
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	right: -14px;
	width: 8px;
	height: 8px;
	border-right: 3px solid #bc000f;
	border-bottom: 3px solid #bc000f;
	transform: translateY(-50%) rotate(-45deg);
	margin-top: 2px;
}

.flow ul li:last-child:after{
	display: none;
}

.flow ul li .icon{
	margin-bottom: 14px;
}

.flow ul li dl dt{
	color: #bc000f;
	margin-bottom: 6px;
	margin-top: 0;
	line-height: 1.2;
	font-weight: bold;	
	font-size: 16px;
	font-size: 1rem;
}

.flow ul li dl dd{
	margin: 0;
	line-height: 1.6;
	text-align: left;
}

/*よくある質問 FAQ*/
/*よくある質問 knowledge*/
ul.faq_list li h3,
ul.knowledge_list li h3{
	line-height: 1.2;
	margin: 0 0 6px 0;
	display: flex;
	align-items: center;
}

ul.faq_list li h3 b{
	background: #f8e5e7;
	color: #bc000f;
	border-radius: 100%;
	padding: 6px 8px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 12px;
	font-size: 18px;
	font-size: 1.125rem;
	line-height: 1;
}

ul.knowledge_list li span.icon{
	margin-right: 8px;
}

ul.faq_list li .answer{
	margin-left: 41px;
}

ul.knowledge_list li .answer{
	margin-left: 28px;
}

/*お客様の声　reviews*/
.reviews ul{
	display: flex;
	flex-wrap: wrap;
}

.reviews ul li{
	/*background: #fff;
	border-radius: 12px;
	margin-right: 20px;*/
	padding: 32px 28px;
	box-sizing: border-box;
	margin-bottom: 12px;
	flex: auto;
}

.reviews ul li:nth-of-type(3n){
	margin-right: 0px;
}

.reviews ul li:first-child,
.reviews ul li:nth-of-type(3n + 1){
	margin-left: 0px;
}

.reviews ul li .customer{
	display: flex;
	margin-bottom: 12px;
	padding: 0 12px;
	box-sizing: border-box;
	align-items: center;
}

.reviews ul li .customer .icon{
	width: 50px;
}

.reviews ul li .customer .detail{
	padding-left: 12px;
}

.reviews ul li .customer .detail .store{
	line-height: 1.2;
	margin-bottom: 6px;
	font-weight: bold;
}

.reviews ul li .customer .detail .store strong{
	color: #999;
	font-weight: normal;
	margin-right: 6px;
}

.reviews ul li .review{
	line-height: 1.6;
}

/*他サービス other_services*/
section.other_services{
	background: #f8e5e7;
}

section.other_services .inner{
	padding: 32px 20px;
	box-sizing: border-box;
}

section.other_services h2{
	text-align: center;
	margin: 0 0 12px 0;
}

section.other_services h2 p{
	color: #bc000f;
	font-size: 20px;
	font-size: 1.25rem ;
	margin-bottom: 8px;
}

section.other_services h2 p:after,
section.other_services h2 p:before {
  display: inline-block;
  content: "";
  background: #bc000f;
  width: 3px;
  height: 22px;
  margin: 0 10px;
  vertical-align: middle;
  line-height: 1;
}

section.other_services h2 p:before {
  transform: rotate(-25deg);
}

section.other_services h2 p:after {
  transform: rotate(25deg);
}

section.other_services ul{
	display: flex;
}

section.other_services ul li{
	position: relative;
}

section.other_services ul li a{
	display: block;
	padding: 18px 38px;
	box-sizing: border-box;
	width: 100%;
}

section.other_services ul li a:after{
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	right: 20px;
	width: 8px;
	height: 8px;
	border-right: 3px solid #bc000f;
	border-bottom: 3px solid #bc000f;
	transform: translateY(-50%) rotate(-45deg);
	margin-top: 2px;
}

section.other_services ul li .character{
	margin-bottom: 20px;
	text-align: center;
	height: 114px;
	display: flex;
	justify-content: center;
	align-items: center;
}

section.other_services ul li .logo{
	margin-bottom: 18px;
	text-align: center;
}

section.other_services ul li .logo img{
	width: 100%;
	height: auto;
	max-height: 28px;
}

section.other_services ul li .detail{
	color: #555;
	line-height: 1.6;
}

/*店舗*/
.store_search .store_contents{
	display: flex;
	background: #fff;
	border-radius: 12px;
	padding: 20px 32px;
	box-sizing: border-box;
}

.store_search .store_contents .area{
	padding: 12px 20px 12px 0;
	box-sizing: border-box;
	width: calc(100% - 500px);
}

.store_search .store_contents .area h3{
	margin-bottom: 12px;
	font-size: 16px;
	font-size: 1rem;
}

.store_search .store_contents .area ul{
	margin-bottom: 12px;
	display: flex;
	flex-wrap: wrap;
}

.store_search .store_contents .area ul li{
	color: #999;
	font-size: 18px;
	font-size: 1.125rem;
	margin-right: 12px;
	line-height: 1.2;
	margin-bottom: 12px;
	display: flex;
	align-items: center;
}

.store_search .store_contents .area ul li a,
.store_search .store_contents .area ul li span{
	color: #fff;
	background: #bc000f;
	padding: 8px 8px 6px 8px;
	box-sizing: border-box;
	display: block;
	border-radius: 5px;
}

.store_search .store_contents .area ul li a{
	background: #bc000f;
}

.store_search .store_contents .area ul li span{
	background: #ccc;
	color: #efefef;
}

.store_search .store_contents .map{
	width: 500px;
	padding: 12px 0;
}

/*foot*/
.footer{
	width:100%;
	background: #bc000f;
	color: #fff;
	line-height: 1.6;
	padding-bottom: 132px;
}

.footer .inner{
	max-width:1400px;
	min-width: 1024px;
	margin:0 auto;
	padding: 46px 20px 0 20px;
	box-sizing: border-box;
}

.footer .inner .lead{
	display: flex;
	align-items: center;
	margin-bottom: 12px;
}

.footer .inner .lead .logo{
	width: 190px;
}

.footer .inner .lead .text{
	width: (100% - 190px);
	padding-left: 52px;
}

.footer .inner .menu{
	display: flex;
	padding: 0 32px;
	box-sizing: border-box;
}

.footer .inner .menu dl{
	flex: 1;
}

.footer .inner .menu dl dt{
	margin-bottom:8px;
	font-weight: bold;
	
}

.footer .inner .menu dl dd{
	margin: 0;
	line-height: 1.6;
}

.footer .inner .menu dl dd ul li a{
	color: #fff;
	text-decoration: underline;
	line-height: 1.3;
	padding: 6px 0;
	display: inline-block;
}

.footer .copy{
	text-align: center;
	padding: 0 0 20px 0;
}



