/*----------------------------------------
全体共通CSS
----------------------------------------*/

#io,#io td,#io th,input,select{font-size:15px; color:#333; line-height:30px; font-family:Century Gothic,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo, Osaka,ＭＳ Ｐゴシック,MS PGothic, sans-serif;}

#io a:link,#io a:visited{color:#444; text-decoration:none;}

a:hover img,a:hover{filter: alpha(opacity=80);	-moz-opacity:0.80;	opacity:0.80; -webkit-transition:0.6s ease-in-out; -moz-transition:0.6s ease-in-out; -o-transition:0.6s ease-in-out; transition:0.6s ease-in-out;}

img{border:0px;}

p{margin: 0; padding:0;}
ul{list-style-type:none; font-size:0; margin:0; padding:0;}
h1,h2,ul,li,div,p{box-sizing:border-box;}



h1,h2{font-size: 25px; line-height: 140%; margin: 0 auto; padding: 0; text-align:center;}

@media only screen and (min-width: 414px) {
h1,h2{font-size: 28px;}
}

@media only screen and (min-width:768px) {
h1,h2{font-size:45px; line-height: 140%; margin: 0 auto; padding: 0; text-align:center;}
}
@media only screen and (min-width:1000px) {
h1,h2{font-size:46px;}
}



section{width:100%; margin: 0 auto;}
section{margin:5% 0;}
section:first-child{margin:0;}
@media only screen and (min-width:768px) {
section{margin:10% 0;}
}
@media only screen and (min-width:1000px) {
section{margin: 5% 0;}
}



/*----------------------------------------
デバイスごとの表示固定用CSS
----------------------------------------*/

/*スマホのみ表示*/
@media only screen and (min-width: 737px) {
	.sp_only {display: none !important;}
}

/*スマホ・タブレットの両表示*/
@media only screen and (min-width: 1000px) {
	.padsp_only {display: none !important;}
}

/*タブレットのみ表示*/
@media only screen and (max-width: 736px) and (min-width:1000px){
	.pad_only {display: none !important;}
}

/*PC・タブレットの両表示*/
@media only screen and (max-width: 736px) {
	.padpc_only {display: none !important;}
}

/*PCのみ表示*/
@media only screen and (max-width:767px) {
	.pc_only {display: none !important;}
}



/*----------------------------------------
全ブロック共通使用CSS
----------------------------------------*/

.main_h1 span{font-size:25px; color: #f24444;}

@media only screen and (min-width:768px) {
.main_h1 span{font-size:85px;}
}
@media only screen and (min-width:1000px) {
.main_h1 span{font-size:55px; color:}
}



.width_content{width:100%; margin: 0 auto;}
.width_content small{font-size: 12px; margin-top: 20px; display: block; line-height: 160%;}
.width_content small b{color:#f24444;}

@media only screen and (min-width: 1100px) {
.width_content{width:1100px; margin: 0 auto;}
.width_content small{font-size: 30px; margin-top: 25px; display: block;}

}




/*----------------------------------------
ファーストビュー
----------------------------------------*/

.shopname {
    padding: 10px 0;
    text-align: center;
    position: relative;
    height:66px;
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid #fff;
}
.shopname::before {
    content: "";
    width: 100%;
    display: block;
    position: absolute;
    height: 100%;
    top: 0;
    background:#feda14
}


.shopname h1{
    margin: 0;
    padding: 0;
    width: 20%;
    z-index: 9999;
    position: absolute;
    left: 2%;
    text-align: left;
    width: 40%;
}

.shopname h1 img {
    max-width: 330px;
    width: 100%;
}


.shopname p{
position: absolute;
right: 1%;
text-align: right;
width: 54%;
}

.shopname a {
    display:none;
    /*background: #4f7ace;
    color: #fff !important;
    z-index: 999999;
    border-radius: 5px;
    padding: 3px 2% 3px 2.5%;
    letter-spacing: 0.8px;
    font-size: 14px;
    margin-left: 5px;
    border: 1px solid #fff;
    vertical-align: middle;*/
}

.shopname a::after{
content: "";
box-sizing: border-box;
width: 5px;
height: 5px;
border: 5px solid transparent;
border-left: 7px solid #ffffff;
display: inline-block;
margin-left: 6px;
}

.shopname .mousikomi::after{
content: "";
display:none;
}

.shopname .mousikomi{
display:block;
background: transparent;
color: transparent;
font-size: 0px;
border: none;
margin: 0;
padding-right:-1px;
vertical-align: middle;
width: 100%;
}

.shopname .mousikomi img {
    position: relative;
    padding: 0;
max-width: 256px;
    width: 100%;
}




.mainpoint_and_img{
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-flex-direction: column-reverse;
    flex-direction: column-reverse;}



#firstview{
	background:url(../images/bg_voice.png);
}


#firstview .width_content{
	padding:5%;
	width:100%;
	text-align:center;
}

@media only screen and (max-width: 414px) {
#firstview .width_content {
    padding: 3%;
}

.shopname {
    height: 50px;
}

}


#firstview .main_h1 {
	position:relative;
	display:inline-block;
	padding:5% 0;
	width:100%;
	color:#555;
	background:#fff;
	text-align:center;
	letter-spacing: -0.4px;
}

#firstview .main_h1 small{
    font-size: 18px;
}

#firstview .main_h1:before {
	content:"";
	position:absolute;
	top:100%;
	left:50%;
	margin-left:-15px;
	border:15px solid transparent;
	border-top:15px solid #fff;
}


#firstview .main_h2 small{
    font-size: 18px;
}


#firstview .main_img img{
	display:block; width:100%; margin:0 auto;
}


#firstview ul {
	width:100%;
	display:table;
	border-collapse:separate;
	border-spacing:10px;
}

#firstview ul li {
	width:100%;
	display:block;
	font-size:21px;
	vertical-align:top;
	text-align:center;
	background:#ffffff;
	border:7px solid #ea2e2e;
	border-radius:5px;
	padding:2% 5%;
	margin-bottom: 3%;
}


@media only screen and (max-width: 414px) {
#firstview ul li {
    font-size:18px;
    text-align: center;
}
#firstview ul li b{
    line-height: 100%;
}
}

#firstview ul li img {
    display: inline-block;
    vertical-align: middle;
    width: 30%;
}


#firstview ul li div {
    display: inline-block;
    vertical-align: middle;
    width: 70%;
}

#firstview ul li b{
    line-height: 120%;
}


#firstview ul li p {
	font-weight:bold;
	color:#ea2e2e;
	background:#fffb82;
	border-radius:20px;
	padding:0;
	width:70%;
	margin:0 auto;
	margin-bottom:2%;	
	font-size: 20px;
}



.car_logo {
	width:95%;
	margin:0 auto;
	text-align:center;
	border:5px solid #ea2e2e;
	background:#ffffff;
	border-radius:5px;
	padding:5% 2%;
}

.car_logo b{
	font-size:27px;
	color:#ea2e2e;
	display:block;
	margin-bottom:1%;
}

.car_logo img{
	width:100%; max-width:1000px;
}



/*タブレット用CSS*/

@media only screen and (min-width: 767px) and (max-width:1000px){

#firstview .main_h1 {
    font-size: 35px !important;
}

.main_h1 span {
    font-size: 60px;
}


#firstview .main_h2 {
    font-size: 35px !important;
}

.main_h2 span {
    font-size: 60px;
}



#firstview .width_content {
    padding: 5% 2%;
    width: 100%;
    text-align: center;
}

.shopname p {
    position: absolute;
    right: 1% !important;
    width: 64% !important;
    text-align: right;
}

.shopname img {
    max-width: 245px;
    left: 2% !important;
}

#firstview ul {
    width: 42% !important;
}

#firstview ul li {
    width: 100% !important;
padding: 2% 2% !important;
}
#firstview ul li b {
    font-size: 50% !important;
}

}



/*タブレット・PC用CSS*/
@media only screen and (min-width:768px) {
.shopname img {
max-width: 245px;
left: 5%;
}

.shopname p{
position: absolute;
right: 1%;
width: 60%;
text-align: right;
display: table;
border-collapse: separate;
border-spacing: 5px;
}

.shopname a {
    display:table-cell;
background: #ff4e00;
color: #fff !important;
    z-index: 999999;
    border-radius: 5px;
    padding: 3px 2% 3px 2.5%;
    letter-spacing: 0.8px;
    font-size: 14px;
    margin-left: 5px;
    border: 1px solid #fff;
    vertical-align: middle;
    text-align: center;
width: 165px;
}

.shopname a::after{
content: "";
box-sizing: border-box;
width: 5px;
height: 5px;
border: 5px solid transparent;
border-left: 7px solid #ffffff;
display: inline-block;
margin-left: 6px;
}

.shopname .mousikomi::after{
content: "";
display:none;
}

.shopname .mousikomi{
display: inline-block;
background: transparent;
color: transparent;
font-size: 16px;
border: none;
margin: 0;
padding: 0;
vertical-align: middle;
width: 256px;
margin-right: 5px;
}

.shopname .mousikomi img{
    position: relative;
    padding: 0;
    left: 0;
    width: 256px;
}




.mainpoint_and_img {
	overflow: auto;
	margin-bottom:2%;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	-webkit-flex-direction: row;
	flex-direction: row;
}


.main_titleimg{
width: 68%;
display:block;
vertical-align: bottom;
position: relative;
}



#firstview .main_h1 {
	/*position: absolute;
	left:35;
	top: 0;*/
	width: 85%;
	font-size: 41px;
}

#firstview .main_h2 {
	/*position: absolute;
	left:35;
	top: 0;*/
	width: 85%;
	font-size: 41px;
}

#firstview ul {
    width: 35%;
    display:block;
    border-collapse: separate;
    border-spacing: 10px;
    vertical-align: bottom;
}

#firstview ul li {
	width:95%;
	display: block;
	font-size:25px;
	margin-bottom:1%;
	font-size: 41px;
}

#firstview ul li img {
	margin-right:1px;
	display: inline-block;
	vertical-align: middle;
	width: 40%;
}


#firstview ul li div{
display: inline-block;
vertical-align: middle;
width: 55%;
}

#firstview ul li p {
display: inline-block;
vertical-align: middle;
padding:2px 0 3px 0;
width: 100%;
margin-bottom: 7%;
}

#firstview ul li b {
display:block;
font-size:60%;
}

.car_logo {
	width:100%;
	padding:2% 1%;
}

}


@media only screen and (max-width:861px){
.shopname a {
    display:none !important;
}

.shopname .mousikomi{
display: inline-block !important;
}
}


/*車種別 PC用CSS*/
@media only screen and (min-width: 1000px) {
#firstview .main_h1 {
		padding: 2% 0;
}
#firstview .main_h2 {
		padding: 2% 0;
}
}

.main_h2 {
	color: #fff;
	margin-top: 15px;
	margin-bottom: 15px;
}







/*----------------------------------------
申し込み+車種選択
----------------------------------------*/

#application{}

#application h1{
	text-align:center;
	margin-bottom:3%;
}

/*申し込みの流れ*/
#application .step{
	list-style-type: none;
	display:table;
	width:100%;
	padding:0;
	margin:0;
	overflow:hidden;
	margin-bottom: 1%;
}

#application .step li{
	display:block;
	position:relative;
	background: #808080;
	padding: 1em 0.5em 1em 2em;
	color: #fff;
	font-size: 22px;
	width:100%;
	margin-bottom: 5%;
}

#application .step li:last-child{
	padding-right: 1em;
	background:#ea2e2e;
}

#application .step li:after{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	bottom: -15px;
	border-style: solid;
	border-color: #808080 transparent transparent transparent;
	border-width: 26px 40px 0 40px;
	z-index: 1;
	margin: 0 auto;
	right: 0;
	left: 0;
}

#application .step li:last-child:before,
#application .step li:last-child:after{
	display:none;
}



#application .step li p{
	border-bottom: 1px solid #fff;
	padding-bottom: 5px;
	margin-bottom: 5px;
}

/*申し込みの流れ タブレット・PC用CSS*/
@media only screen and (min-width:736px) {

#application .step li{
	display:table-cell;
	margin-bottom:0;
	width:25%;
}

#application .step li:before,
#application .step li:after{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	margin: auto;
}

#application .step li:before{
	top:-10px;
	right:-1em;
	border-style: solid;
	border-color: transparent transparent transparent #fff;
	border-width: 70px 0 70px 1em;
	z-index: 10;
}

#application .step li:after{
	top:-10px;
	right:-0.8em;
	border-style: solid;
	border-color: transparent transparent transparent #808080;
	border-width: 70px 0 70px 1em;
	z-index: 10;
	bottom: inherit;
	left: inherit;
}


}


/*申し込みの流れ PC用CSS*/
@media only screen and (min-width: 1000px) {
}





/*車種別 スマホ・タブレット・PC用*/
#application .cartype li {
	width: 98%;
	padding:1%;
	margin:1%;
	display:inline-block;
	font-size:15px;
	vertical-align:top;
	text-align:center;
}

#application .cartype li h2 {
	display:inline-block;
	font-size:28px;
	letter-spacing:0.5px;
	position:relative;
	margin:3% 0 5% auto;
}

#application .cartype li h2::after {
	content:"";
	position:absolute;
	background:#fff77b;
	height:60%;
	width:106%;
	display:block;
	z-index:-10;
	bottom:0px;
	margin:0 auto;
	left:-3%;
	right:0;
}

#application .cartype li img{
	width:90%;
	display:block;
	margin: 0 auto;
	margin-bottom:10px;
}

#application .cartype li p{
	width:100%;
	text-align:left;
	font-weight:bold;
}

#application .cartype li .pricetxt{
	font-size:20px;
}

#application .cartype li b{
	display:block;
	color:#fd2d7b;
	font-size:26px;
	margin-top:5px;
}

#application .cartype li .pricetxt span{
	display:block;
	font-size:13px;
	line-height:14px;
}

#application .cartype li .price{
	color:#ea2e2e;
	display:inline-block;
	vertical-align:middle;
	width:60%;
	text-align:left;
	font-size:35px;
}

#application .cartype li .price small{
	font-size:15px;
}

#application .cartype li a {
	width:100%;
	display:block;
	background:#feda14;
	color:#fff;
	border-radius:5px;
	padding:4% 0;
	margin-top:3%;
	font-size:17px;
}

#application .cartype li a:hover {
	background:#d73d51;
}


/*車種別 タブレット用*/

@media only screen and (min-width:736px) {

#application .cartype li {
	width:48%;
}

} 



/*車種別 タブレット・PC用CSS*/
@media only screen and (min-width:768px) {
#application .cartype{
	width:96%;
	margin:0 auto;
}

#application .cartype li h2 {
	font-size:22px;
}

#application .cartype li {
	width:31.3%;
}

#application .cartype li img{
	width:100%;
}

#application .cartype li .pricetxt{
	font-size:22px;
}

#application .cartype li .pricetxt span{
	font-size:10px;
}

#application .cartype li .price{
	font-size:26px;
}

#application .cartype li .price small{
	font-size:12px;
}

#application .cartype li a {
	font-size:15px;
}

}


/*車種別 PC用CSS*/
@media only screen and (min-width: 1000px) {
#application .cartype{
	width:102.2%;
	margin-left:-1%;
}

#application .cartype li {
	width:23%;
}

}











/*----------------------------------------
インフォメーション
----------------------------------------*/

#inforamatin{}


#inforamatin .carmerit_img{
	width:100%;
	max-width:1000px;
	display:block;
	margin:0 auto;
}


#inforamatin .merit{
	font-size: 18px;
	line-height: 170%;
	background: #fffdc4;
	padding: 2% 5%;
	margin-top:3%;
}


#inforamatin .merit p{
	border-bottom: 1px dashed #bdbdbd;
	padding: 10px 0;
}


/*タブレット・PC用CSS*/
@media only screen and (min-width:768px) {

#inforamatin .merit{
	font-size: 25px;
}

}

/*PC用CSS*/
@media only screen and (min-width:1000px) {
}



/*----------------------------------------
お客様の声
----------------------------------------*/

#customer_voice{
	background:url(../images/bg_voice2111.png);
	padding:5% 0;
}

#customer_voice ul{
	margin-top: 2%;
	text-align: center;
}


#customer_voice ul h1 {
  position: relative;
  padding: 0.6em;
  background: #fff;
  border-radius: 7px;
  font-size: 25px;
  text-align: left;
  margin-bottom: 15px;
}

#customer_voice ul h1:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 30px;
  border: 15px solid transparent;
  border-top: 15px solid #fff;
  width: 0;
  height: 0;
}


#customer_voice ul li {
    width: 100%;
    margin: 5% auto;
    display: block;
    font-size: 25px;
    background:;
    border-radius: 5px;
    padding: 6% 6% 6% 6%;
}

#customer_voice ul li p{
	font-weight:bold;
	display:inline-block;
	vertical-align:middle;
	background: #fff;
	padding: 20px;
	text-align: left;
}

#customer_voice ul li p b{
	color:#f24444;
}

#customer_voice ul li span{
	font-size:18px;
	display:block;
	text-align: right;
}

#customer_voice ul li img{
	width:100%;
	max-width:65%;
	display:block;
	margin:0 auto;
	vertical-align:middle;
	margin-bottom:10px;
}



/*タブレット・PC用CSS*/
@media only screen and (min-width:768px) {

#customer_voice{
	padding:3% 0;
}

#customer_voice ul li {
	width: 31%;
	margin:1%;
	padding: 0%;
	display: inline-block;
}

#customer_voice ul li img{
	width:100%;
	max-width:200px;
	margin-bottom:10px;
	vertical-align:middle;
}

#customer_voice ul li span{
	text-align:right;
	margin-right:10px;
}


}

/*PC用CSS*/
@media only screen and (min-width:1000px) {
}




/*----------------------------------------
審査申し込みボタン
----------------------------------------*/
.sinsa_btn{display:block; margin:0 auto; text-align: center;}
.sinsa_btn img{width:100%;}

.sinsa_btn-bottom{display:block; margin:0 auto; text-align: center;}
.sinsa_btn-bottom img{width:100%; max-width:1100px;}

/*PAD・スマホ用*/
@media only screen and (min-width:768px) {
.sinsa_btn img{width:100%; margin: 0 auto;}

.sinsa_btn {
    text-align: center;
    width:75%;
    margin: 0 auto;
    display: inline-block;

}
}


/*----------------------------------------
フッター
----------------------------------------*/
.footer {
	background:#fff77b;
	padding: 2% 2% 7px 2%;
	line-height: 15px;
	font-size: 10px;
	box-sizing: border-box;
	margin-bottom:0 !important;
}

.footer div{margin-bottom:0%;}


.footer .tokutei b,.footer .privacy b{
    display: block;
    border-bottom: 1px solid #333;
}

.footer .privacy br{line-height:10px;}


.copyright {
    background: #feda14;
    width: 100%;
    color: #d80c25;
    text-align: center;
    font-size: 11px;
}



.pagelink{
    text-align: center;
    border-top: 1px solid #fff;
    margin-top: 1.5%;
    padding-top: 8px;
}

.pagelink a{
	display:inline-block;
	padding:0 1%;
	color: 333333;
}


.otherinfo{
	padding: 3%;
	margin:0;
	line-height: 18px;
	font-size: 10px;
	box-sizing: border-box;
	margin-bottom:0 !important;
}


.otherinfo .tokutei b,.otherinfo .privacy b{
padding-top: 1%;
display: block;
border-bottom: 1px solid #333;
font-size: 17px;
margin-bottom: 5px;
padding-bottom: 6px;
}





/*----------------------------------------
ステップ
----------------------------------------*/


/*PC・タブレットの両表示*/
@media only screen and (min-width: 736px) {

  .box_step07 {
    width: 1100px;
  }

.box_step07 img {
  vertical-align: top;
  width:180px;
  margin-bottom: 10px;
}

.box_step07 {
  width: 1100px;
  margin: 0 auto;
  margin-top: 20px;
}

.box_step07 ul {
  position: relative;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  font-size: 25px;
}
.box_step07 ul li {
  text-align: center;
  width: 250px;
  background: #fff;
  padding: 0;
  position: relative;
  z-index: 1;
}

.box_step07 b {
  font-size: 30px;
}

.box_step07 u {
  display: block;
  font-size: 20px;
  color: #f24444;
  font-weight: bold;
}

.box_step07 p {
  font-size: 20px;
  font-weight: bold;
}

.box_step07 ul li:nth-child(n+2) {
  margin-left: 0%;
}
.box_step07 ul li.active {
  color: ;
  background: #fff;
}

.box_step07 ul li:after {
  content: ">";
  position: absolute;
  font-weight: bold;
  top: 25%;
  right: -7%;
  color: #4b4b4b;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

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

}




/*スマホのみ表示*/
@media only screen and (max-width: 735px) {

  .box_step07 {
    width: 100%;
  }

.box_step07 img {
  display: block;
  width:65%;
  margin: 0 auto;
}

.box_step07 {
  width: 100%;
  margin: 0 auto;
  margin-top: 20px;
}

.box_step07 ul {
  position: relative;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  font-size: 25px;
}
.box_step07 ul li {
  text-align: center;
  width: 100%;
  background: #fff;
  padding: 0;
  position: relative;
  z-index: 1;
  margin-bottom: 75px;
}

.box_step07 b {
  font-size: 30px;
  margin-top: 10px;
  display: block;
}

.box_step07 u {
  display: block;
  font-size: 20px;
  color: #f24444;
  font-weight: bold;
}

.box_step07 p {
  font-size: 20px;
  font-weight: bold;
}

.box_step07 ul li:nth-child(n+2) {
  margin-left: 0%;
}
.box_step07 ul li.active {
  color: ;
  background: #fff;
}

.box_step07 ul li:after {
  content: "▼";
  position: absolute;
  font-weight: bold;
  top: 110%;
  right: 47%;
  color: #4b4b4b;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

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

}





/*----------------------------------------
店舗詳細
----------------------------------------*/

.card-container{
    display:flex;
    max-width: 1100px;
    margin: 0 auto;
}

.card-container2{
    display:flex;
    max-width: 1100px;
    margin: 0 auto;
}

.card-img{
    width:40%;
}

.card-img2{
    width:40%;
}

.card-img img{
    width:100%;
}

.card-img2 img{
    width:100%;
}

.card-text{
    width:60%;
    margin-left: 20px;
}

.card-text2{
    width:60%;
    margin-left: 20px;
}

.card-text small {
  font-size: 29px;
  display: block;
  font-weight: bold;
  line-height: 160%;
}

.card-text2 b {
  font-size: 55px;
  margin-top: 25px;
  display: block;
}

.card-text2 p {
  font-size: 25px;
  margin-top: 25px;
  font-weight: bold;
}


/*スマホのみ表示*/
@media only screen and (max-width: 735px) {

.card-container{
    display:block;
    max-width: 98%;
    margin: 0 auto;
}

.card-container2{
    display:flex;
    max-width: 98%;
    margin: 0 auto;
}

.card-img{
    width:100%;
}

.card-img2{
    width:30%;
}

.card-img img{
    width:100%;
}

.card-text{
    width:98%;
    margin-left: 0px;
    margin: 0 auto;
}

.card-text2{
    width:70%;
    margin-left: 20px;
}

.card-text small {
  font-size: 15px;
  display: block;
  font-weight: bold;
  line-height: 160%;
}

.card-text2 b {
  font-size: 30px;
  margin-top: 3px;
  display: block;
}

.card-text2 p {
  font-size: 13px;
  margin-top: 0;
  font-weight: bold;
  line-height: 160%;
}

}