@charset "UTF-8";

/*-----------------------------
pagename
-----------------------------*/
.h2__inner{
  background: url(../img/sale_bg.gif) repeat top left;
}
.pagename__h2 {
  color: #c50029;
}
.pagename__h2 span {
	background:#c50029;
}


/*-------------------------------
車両一覧
-------------------------------*/
.car {
  width: 100%;
  padding: 40px 0px;
  background: #f9f8f3;
}

.car__wrap {
  display: flex;
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
  justify-content: center;
}

.car__text {
  margin-bottom: 20px;
  padding: 0 3%;
  line-height: 30px;
}


/*-------------------------------
車両詳細
-------------------------------*/
.car__detail {
  width: 90%;
  margin: 0 1% 2%;
  padding: 1%;
  background: #fff;
	border-radius:10px;
  box-shadow: 2px 2px 15px 0px rgba(204, 204, 204, 0.5);
}
.car__img{
	display:inline-block;
  width: 63%;
  padding: 1%;
	text-align:center;
	border-right:#ccc 1px solid;
}
.car__img img {
  width: 100%;
  height: auto;
}
.thumbnail .slick-track {
	border-top:#ccc 1px solid;
	padding-top:10px;
  transform: unset !important;
}
.thumbnail-img {
  opacity: 0.3;
  transition: opacity .8s linear;
  width: calc(100% / 5) !important;
}
.thumbnail .slick-current {
  opacity: 1;
}
.car_logo{
	position: relative;
}
.car_logo img{
	width:130px;
	z-index:1;
	position: absolute;
	top: 10;
	right:10px;
}


.delivery-month{
	text-align:center;
	color:#fff;
	padding:3px;
	width:65px;
	height:45px;
	font-size:1.5rem;
	font-weight:bold;
	line-height:1;
}
.delivery-text{
	font-weight:normal;
	font-size:11px;
	padding:2px 0px;
	background:#fff;
	color:#000;
	margin-bottom:5px;
}
.delivery-month span{
	font-size:13px;
	margin-left:3px;
}
.month-1 .delivery-month {
	background:#ef3b6a;
}
.month-1 .car__item__h3 {
  border-bottom: 4px solid #991f22;
}

.month-2 .delivery-month {
	background:#4ec1f0;
}
.month-2 .car__item__h3 {
  border-bottom: 4px solid #4ec1f0;
}

.month-3 .delivery-month {
	background:#ed89bb;
}
.month-3 .car__item__h3 {
  border-bottom: 4px solid #ed89bb;
}

.month-4 .delivery-month {
	background:#ed6d64;
}
.month-4 .car__item__h3 {
  border-bottom: 4px solid #ed6d64;
}

.month-5 .delivery-month {
	background:#8bcf60;
}
.month-5 .car__item__h3 {
  border-bottom: 4px solid #8bcf60;
}

.month-6 .delivery-month {
	background:#389fe4;
}
.month-6 .car__item__h3 {
  border-bottom: 4px solid #389fe4;
}

.month-7 .delivery-month {
	background:#f3a40b;
}
.month-7 .car__item__h3 {
  border-bottom: 4px solid #f3a40b;
}

.month-8 .delivery-month {
	background:#ee3110;
}
.month-8 .car__item__h3 {
  border-bottom: 4px solid #ee3110;
}

.month-9 .delivery-month {
	background:#9267af;
}
.month-9 .car__item__h3 {
  border-bottom: 4px solid #9267af;
}

.month-10 .delivery-month {
	background:#991f22;
}
.month-10 .car__item__h3 {
  border-bottom: 4px solid #991f22;
}

.month-11 .delivery-month {
	background:#085732;
}
.month-11 .car__item__h3 {
  border-bottom: 4px solid #085732;
}
.month-12 .delivery-month {
	background:#c50029;
}
.month-12 .car__item__h3 {
  border-bottom: 4px solid #c50029;
}


.car__item__h3 {
	text-align:left;
	margin-bottom: 10px;
	padding: 10px;
	font-size: 1.5rem;
	font-weight:bolder;
	border-bottom: 4px solid #991f22;
	line-height: 1.8rem;
}
.car__item__h3 span {
	background:#eee;
  font-size: 1rem;
	font-weight:normal;
	margin-right:5px;
	padding:2px 5px;
}

.car__right{
  width: 30%;
  padding: 1%;
	display:inline-block;
	vertical-align:top;
}
.car__price{
	margin-bottom:10px;
}

.car__item__text{
	font-size:0.8rem;
	color:#555;
  line-height: 1.5rem;
	margin:0px auto 10px;
}
.car__item__text span{
	background: #f7b500;
	padding:2px 8px;
	border-radius:5px;
}
.car__item__text1{
	font-size:0.8rem;
	color:#333;
  line-height: 1.5rem;
	margin:0px auto 10px;
}
.car__item__text1 span{
	background:#eee;
	padding:2px 8px;
	border-radius:5px;
}


.car__price1{
	width:45%;
	margin:5px auto;
	padding:5px 0px;
	display:inline-block;
}
.car__price2{
	width:45%;
	margin:5px auto;
	padding:5px 0px;
	display:inline-block;
}
.car__item__fee {
  margin-top: 5px;
  color: #c50029;
  font-size: 1.8rem;
  font-weight: bold;
  text-decoration:none;
  line-height:1rem;
}
.car__item__fee span {
  color: #000;
	padding:2px 5px;
	vertical-align:middle;
	font-size:0.7rem;
}
.car__item__fee1 {
  margin-top: 5px;
  color: #000;
  font-size: 1.8rem;
  font-weight: bold;
  text-decoration:none;
  line-height:1rem;
}
.car__item__fee1 span {
	padding:2px 5px;
	vertical-align:middle;
	font-size:0.8rem;
}

.car__time {
	border-top:1px #ccc solid;
	border-bottom:1px #ccc solid;
  color: #000;
  font-size: 1rem;
  text-decoration:none;
  line-height: 1.5rem;
	margin:10px auto ;
	padding:10px 0px;
}
.car__time span {
	background:#eee;
	padding:2px 5px;
	border-radius:5px;
	font-size:0.8rem;
}


.detail_h3{
  font-size: 1.5rem;
	font-weight:bold;
	line-height:150%;
  margin: 0px auto;
	padding:1%;
	text-align:center;
}


.flow__contactwrap {
  margin: 0 auto;
}

.flow__contact {
  width: 90%;
  margin: 0px 0px 10px;
  padding: 20px;
  background: #fff4bd;
  border-radius: 10px;
}

.flow__contact__h3 {
  font-size:1rem;
  text-align: center;
}

.flow__contact__number {
  margin: 10px 0px;
	color:#c50029;
  font-size: 1.5rem;
	font-weight:bold;
  text-align: center;
}

.flow__contact__number:before {
  content: "";
  display: inline-block;
  width: 0.8em;
  height: 0.8em;
  background: url(../img/phone.png) no-repeat;
  background-size: contain;
	margin-right:10px;
}

.flow__contact__text {
  text-align: center;
  font-size: 0.8rem;
	line-height:1.3rem;
}

/*フロー内ボタン*/
.contact__button {
  margin-top: 20px;
  text-align: center;
}

.contact__button :after {
  content: "";
  display: inline-block;
  left: 5px;
  width: 0.5em;
  height: 0.5em;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}

.contact__button a {
  padding: 10px 50px;
  background: #014694;
  font-size: 16px;
  color: #fff;
  text-decoration: none;
  border-radius:30px;
}

.contact__button a:hover {
  background: #f7b500;
  color: #fff;
  transition: 0.6s;
}

.contact__button:hover :after {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transition: 0.6s;
}
.car_modal{
  border-radius: 10px;
	background:#f7b500;
	padding:20px 10px;
  display: flex;
  flex-wrap: wrap;
  white-space: normal;
  justify-content: center;
}
.car_modal li{
	border-radius:10px;
	background:#fff;
  width: 12%;
	text-align:center;
	margin:10px;
	padding:1%;
}
.car_modal li img{
	width:80px;
}
.car_modal li span{
	display:block;
	font-size:12px;
	background:#174c8c;
	color:#fff;
	padding:2px;
	margin:5px 0px;
	border-radius:5px;
}
.car_modal li p{
	display:block;
	padding:0px;
	margin:0px;
}



.modal__dl2 {
  display: flex;
  flex-wrap: wrap;
  font-size: 14px;
  white-space: normal;
  justify-content: center;
}
.modal__dl2 dt {
  width: 15%;
  padding: 5px 10px;
	border:5px #fff solid;
	background: #03a9f4;
	color:#fff;
	border-radius:10px; 
  text-align: center;
}
.modal__dl2 dd {
  width: 25%;
  padding: 5px 10px;
	border:5px #fff solid;
	background: #eee;
	color:#000;
	border-radius:10px; 
  text-align: center;
}



@media (max-width: 820px) {
  .car__wrap {
    justify-content: center;
  }
  .car__item {
    width: calc(80%/2);
    margin: 0 2% 30px;
    ;
  }

	.car_modal li{
    width: calc(80%/3);
	}

	.contact__button a {
		padding: 10px 20px;
	}
		.car__price1{
		width:90%;
		display:block;
	}
	.car__price2{
		width:90%;
		display:block;
	}

}

@media (max-width: 480px) {
  .car {
    padding: 30px 0px;
  }
	.car__detail {
		padding: 0 3% 1%;
		width:90%;
	}
  .car__wrap {
    margin-bottom: 0;
  }

	.car__img{
		display:block;
    width: 90%;
		margin:1% auto;
		text-align:center;
		border-bottom::#ccc 1px solid;
		border-right:none;
	}
	.car__right{
		display:block;
    width: 90%;
		margin:1% auto;
		vertical-align:top;
	}
.car__price1{
	width:45%;
	margin:5px auto;
	padding:5px 0px;
	display:inline-block;
}
.car__price2{
	width:45%;
	margin:5px auto;
	padding:5px 0px;
	display:inline-block;
}
  .car__item {
		display:block;
    width: 90%;
    margin: 0 2% 30px;
  }
	.modal__dl2 dt {
		width: 30%;
	}
	.modal__dl2 dd {
		width: 50%;
	}
	.car_modal li{
    width: calc(80%/2);
	}
	.contact__button a {
		padding: 10px 20px;
	}

  /*メールフォーム*/
  .contact__form {
    /*width: 100%;*/
    padding: 1%;
    width: 90%;
	}


}


.detail_text{
	background:#eee;
	padding:10px 10px 10px 20px;
	font-size:0.8rem;
	margin:20px auto 10px;
	border-radius:10px;
}

.detail_text li{
	margin:5px 0px;
}