@charset "utf-8";
/*===============================================
sp.css  画面の横幅が768pxまで
===============================================*/
@media screen and (max-width:768px){

/*SP開始******************************************/
/*google_reviews*/
.google_reviews_button{
	margin: 12px auto;
	font-size: 16px;
	font-size: 1rem;
	width: 100%;
}

.google_reviews_button a{
	padding: 12px 12px;
	display: block;
	border-radius: 12px;
	text-align: center;
	line-height: 1.6;
}

.google_reviews_button a .logo_box{
	justify-content: center;
	margin-bottom: 6px;
}

.google_reviews_button a .star{
	width: 130px;
}

/*オリジナル割引　original_discount*/
.original_discount{
	padding: 16px 0 0 0;
	margin-bottom: 12px;
}

.original_discount h2{
	font-size: 28px;
    font-size: 1.75rem;
	margin: 0;
}

.original_discount ul.discount li{
	padding: 18px 24px 16px 24px;
	width: 100%;
}

.original_discount ul.discount li h3{
	font-size: 20px;
	font-size: 1.25rem;
}

/*安い早い安心 slogan*/
dl.slogan{
	display: block;
}

dl.slogan dt{
	width: 100%;
	font-size: 20px;
	font-size: 1.25rem;
	border-radius: 12px 12px 0 0;
}

dl.slogan dt strong{
	font-size: 26px;
	font-size: 1.625rem;
	display: inline;
}

dl.slogan dd{
	width: 100%;
	padding: 18px 18px;
	border-radius: 0 0 12px 12px;
}

dl.slogan dd h2{
	font-size: 20px;
	font-size: 1.25rem;
	margin: 0 0 8px 0;
	line-height: 1.4;
}

/*特許取得の「マッハタッチ」とは？　explain*/
.explain ul.cmncard li h3{
	padding: 24px 16px 18px 16px;
	margin: 0;
}

.explain ul.cmncard li .detail .img img{
	width: 100%;
	height: auto;
	max-width: 600px;
}

/*service_gift　チラシ*/
.service_gift h2,
.flyer .flyer_content h2{
	font-size: 26px;
	font-size: 1.625rem;
	padding: 18px 12px 16px 12px;
}

.service_gift ul.service_gift_list{
	display: block;
}

.service_gift ul.service_gift_list{
	margin-top: 0;
}

.service_gift ul.service_gift_list li{
	width: calc(100% - 12px);
	margin-bottom: 12px;
}

.service_gift ul.service_gift_list li:last-child{
	margin-bottom: 0;
}

.flyer .flyer_content ul.thumb{
	gap:0 0;
	margin: 12px;
}

.flyer .flyer_content ul.thumb li{
	margin: 0 6px;
	width: calc(50% - 12px);
}

.flyer .flyer_content ul.thumb li a .flyer_img .img img{
	width: 100%;
	height: auto;
}

/*　store_information*/
.store_information .information_container{
	padding: 24px 16px 18px 16px;
}

.store_information .information_container .box{
	display: block;
	gap:0 0; 
}

.store_information .information_container .box .left{
	width: 100%;
}

.store_information .information_container .box .right{
	width: 100%;
	margin: 0;
}

.store_information .information_container .box dl.information_table dt,
.store_information .information_container .box dl.information_table dd{
	padding: 12px 12px;
}

.store_information .information_container .box dl.information_table dt{
	width: 36%;
}

.store_information .information_container .box dl.information_table dd{
	width: calc(100% - 36%);
}

.store_information .information_container .box .right dl.information_table dt{
	width: 36%;
}

.store_information .information_container .box .right dl.information_table dd{
	width: calc(100% - 36%);
}

.store_information .information_button{
	margin-bottom: 36px;
}

.store_information .information_container ul.service_icon{
	margin-bottom: 24px;
}

.store_information .information_container ul.service_icon li{
	margin: 0 1px 8px 1px;
}

.store_information .information_container ul.payment_icon li{
	margin: 0 12px 18px 12px;
}

/*その他のサービス*/
/*アコーディオン*/
.accordion summary {
  padding: 24px 24px 22px 24px;
}

.other_services .detail_block{
	padding: 0 12px 12px 12px;
}

.other_services .detail_block .main{
	width: 100%;
	height: auto;
	position: static;
}

.other_services .detail_block .main .img{
	width: 100%;
	height: auto;
}

.other_services .detail_block .main .key{
	clip-path: polygon(0px 0px, 100% 0, 100% 100%, 0 100%);
	width: 100%;
	position: static;
	font-size: 16px;
	font-size: 1rem;
	min-width: 100%;
}

.other_services .detail_block .main .key .text_box{
	width: 100%;
	position: static;
	padding: 16px 0 12px 0;
}

.other_services .detail_block .main .key h4{
	font-size: 20px;
	font-size: 1.25rem;
}

.other_services .detail_block.hanbai .main .key h4{width: 100%;}

.other_services .detail_block .main .key h4 strong{
	font-size: 26px;
	font-size: 1.625rem;
}

.other_services .detail_block .main .key .slogan_text{
	width: 86%;
	padding: 12px 12px 10px 12px;
	margin-bottom: 12px;
}

.other_services .detail_block.hanbai .main .key .slogan_text{width: 86%;}

.other_services .detail_block .main .key .text{
	padding: 0 16px;
}

/*eco*/
.other_services .detail_block .eco{
	height: 180px;
}

.other_services .detail_block .eco h4{
	padding: 8px 24px;
	font-size: 16px;
	font-size: 1rem;
}

.other_services .detail_block .eco .text{
	font-size: 16px;
	font-size: 1rem;
}

.other_services .detail_block .eco .text strong{
	font-size: 20px;
	font-size: 1.25rem;
	display: inline-block;
	margin-top: 6px;
}

/*contents_bg*/
.other_services .detail_block .contents_bg{
	padding: 12px 12px 12px 12px;
}

.other_services .detail_block .contents_bg .cmncard.card3.point{
	margin-bottom: 6px;
}

.other_services .detail_block .contents_bg .cmncard.card3.point li{
	padding:12px 0 12px 0;
}

.other_services .detail_block .contents_bg .cmncard.card3 h4{
	font-size: 20px;
	font-size: 1.25rem;
	margin: 0 16px 12px 16px;
	position: relative;
}

.other_services .detail_block .contents_bg .cmncard.card3 h4 p{
	margin-bottom: 6px;
	position: relative;
}

.other_services .detail_block .contents_bg .cmncard.card3 h4 strong{
	font-size: 26px;
	font-size: 1.625rem;
}

/*サポート付き*/
.other_services .detail_block .contents_bg .with_support h4{
	font-size: 20px;
	font-size: 1.25rem;
	position: relative;
	line-height: 1.2;
}

.other_services .detail_block .contents_bg .with_support h4:before,
.other_services .detail_block .contents_bg .with_support h4:after{
	height: 46px;
	position: absolute;

}
.other_services .detail_block .contents_bg .with_support h4:before{transform: rotate(-18deg); left: 0;}
.other_services .detail_block .contents_bg .with_support h4:after{transform: rotate(18deg); top:0;}

.other_services .detail_block .contents_bg .with_support ul.support{
	flex-wrap: wrap;
}

.other_services .detail_block .contents_bg .with_support ul.support li{
	margin: 0 6px 6px 6px;
}

/*赤枠　買取のヒミツ*/
.other_services .detail_block .contents_bg .appeal_points{
	display: block;
}

.other_services .detail_block .contents_bg .appeal_points .text_box{
	width: 100%;
	display: block;
	padding: 24px 12px 12px 12px;
	box-sizing: border-box;
}

.other_services .detail_block .contents_bg .appeal_points .img_box{
	width: 100%;
}

.other_services .detail_block .contents_bg .appeal_points .img_box:after{
	background: #988a8b;
	clip-path: polygon(780px 0px, 100% 0, 100% 100%, -80px 100%);
	position: absolute;
	border-radius: 0 0 12px 12px;
	bottom: 0;
	right: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	content: "";
}

.other_services .detail_block .contents_bg .appeal_points .img{
	position: static;
	margin: 0 auto 12px auto;
}

.other_services .detail_block .contents_bg .appeal_points .img img{
	width: 200px;
	height: auto;
}

.other_services .detail_block .contents_bg .appeal_points .text_box h4{
	font-size: 26px;
	font-size: 1.625rem;
	margin: 0 0 12px 0;
	line-height: 1.2;
}

.other_services .detail_block .contents_bg .appeal_points .text_box ul.point li{
	font-size: 16px;
	font-size: 1rem;
	margin-bottom: 12px;
}

.other_services .detail_block .contents_bg .appeal_points .text_box ul.point li strong{
	font-size: 20px;
	font-size: 1.25rem;
}

.other_services .detail_block .contents_bg .appeal_points .text_box ul.point li .icon img{
	width: 20px;
	height: auto;
}

.other_services .detail_block .contents_bg .appeal_points .text_box .text{
	font-size: 20px;
	font-size: 1.25rem;
}

.other_services .detail_block .contents_bg .appeal_points .text_box .text strong{
	font-size: 26px;
	font-size: 1.625rem;
}

/*買取の流れ*/
.other_services .detail_block .contents_bg .tips{
	margin-bottom: 0;
}

.other_services .detail_block .contents_bg .kaitori_flow h4,
.other_services .detail_block .contents_bg .tips h4{
	font-size: 28px;
	font-size: 1.75rem;
	line-height: 1.2;
}

/*高額査定のコツ*/
.other_services .detail_block .contents_bg .tips .img{
	margin-bottom: 12px;
}

.other_services .detail_block .contents_bg .tips .img img{
	width: 160px;
	height: auto;
}

.other_services .detail_block .contents_bg .tips ul.tips_item li{
	position: static;
	padding: 18px 18px;
	width: 100%;
	margin-bottom: 12px;
}

/*お気に入りの車を探してみましょう*/
.other_services .detail_block .contents_bg ul.menu li{
	margin-right: 0;
	padding: 12px 0 0 0;
	margin-bottom: 12px;
}

.other_services .detail_block .contents_bg ul.menu li h5{
	margin: 12px 12px 10px 12px;
}

.other_services .detail_block .contents_bg ul.menu li .subtitle{
	margin: 0 12px 14px 12px;
}

.other_services .detail_block .contents_bg ul.point li .detail .img img,
.other_services .detail_block .contents_bg ul.menu li .detail .img img{
	height: 140px;
}

/*support_services*/
.support_services{
	padding: 24px 12px 12px 12px;
}

.support_services ul.service{
	gap:0 0;
}

.support_services ul.service li{
	width: 100%;
	padding: 18px 16px 12px 16px;
	line-height: 1.2;
	margin-bottom: 12px;
}

.support_services ul.service li h5{
	margin: 0 0 4px 0;
}

.support_services ul.service li .text {
  padding-left: 0;
  line-height: 1.4;
}

.faq h4{
	line-height: 1.2;
}

/*free_service*/
.free_service{
	display: block;
	padding: 12px;
}

.free_service .detail{
	padding: 16px 0 12px 0;
	box-sizing: border-box;
}

.free_service .detail h4{
	position: relative;
	font-size: 20px;
	font-size: 1.25rem;
	width: 216px;
	margin: 0 auto 12px auto;
	line-height: 1.2;
}

.free_service .detail h4:before,
.free_service .detail h4:after{
	height: 42px;
	position: absolute;
}
.free_service .detail h4:before{transform: rotate(-20deg); left: -18px;}
.free_service .detail h4:after{transform: rotate(18deg); top: 0; right: -18px;}

.other_services .detail_block .contents_bg .free_service .detail ul.menu{
	display: block;
	text-align: center;
}

.other_services .detail_block .contents_bg .free_service .detail ul.menu li{
	padding: 12px 26px;
	margin: 0 0 12px 0;
}

.other_services .detail_block .contents_bg .free_service .detail ul.menu li:last-child{
	margin-bottom: 0px;
}

.free_service .price .text{
	text-align: center;
}

.price h4{
	font-size: 26px;
	font-size: 1.625rem;
}

.other_services .detail_block.carpaint .contents_bg .price ul.price_table{
	gap:0 0;
}

.other_services .detail_block.carpaint .contents_bg .price ul.price_table li{
	width: 100%;
	margin-bottom: 12px;
}

.other_services .detail_block.carpaint .contents_bg .price ul.price_table li:last-child{
	margin-bottom: 0;
}

.other_services .detail_block.carpaint .contents_bg .appeal_points .text_box .text{
	font-size: 26px;
	font-size: 1.625rem;
}

.other_services .detail_block.carpaint .contents_bg .appeal_points .text_box .text strong{
	font-size: 36px;
    font-size: 2.25rem;
	padding: 12px 16px 5px 16px;
}

.other_services .detail_block.carpaint .contents_bg .appeal_points .text_box .text strong span{
	font-size: 26px;
	font-size: 1.625rem;
}

/*knowledge*/
.knowledge h4{
	font-size: 26px;
	font-size: 1.625rem;
	line-height: 1.2;
}

.knowledge .subtitle{
	font-size: 16px;
	font-size: 1rem;
	width: 296px;
	position: relative;
}

.knowledge .subtitle:before,
.knowledge .subtitle:after{
	height: 70px;
}
.knowledge .subtitle:before{transform: rotate(-15deg); left: -6px;}
.knowledge .subtitle:after{transform: rotate(15deg); top:0;}

.knowledge ul.column{
	display: block;
	gap:0 0;
}

.knowledge ul.column li{
	width: 100%;
	margin-bottom: 12px;
}

.knowledge ul.column li h5{
	line-height: 1.2;
}

.knowledge ul.column li .img{
	text-align: center;
}

.knowledge ul.column li .img img{
	width: 100%;
	height: auto;
	max-width: 500px;
}

/*gallery-container*/
.gallery-container .main_img {
	width: 100%;
	height: 166px;
}

.gallery-container .main_img img {
  width: 100%;
  height: 166px;
}

.gallery-container .thumbnail ul.list li img {
  width: 71px;
  height: 71px;
}

/*WEBで予約・問い合わせ（サービス別リンク一覧）*/
#serviceContactArea #serviceContactBox{
	width: 96%;
	height: 340px;
	background: #fff;
	padding: 20px 10px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	box-sizing: border-box;
}

#serviceContactArea #serviceContactBox #btnClose{
	width: 50px;
	height: 50px;
	top: -33px;
	right: -5px;
}

#serviceContactArea #serviceContactBox #btnClose img,
#serviceContactArea #serviceContactBox #serviceContactList img{
	width: 100%;
	height: auto;
}

#serviceContactArea #serviceContactBox #serviceContactList{
	width: 96%;
}

/*//SP終了******************************************/
}