﻿/* ************************************** _

タイトル：layout.css

レイアウト用CSSファイル

_ ************************************** */


/* ログイン
---------------------------------------------------------------------------- */
.login_wrap{
	text-align:center;
	margin-top:90px;
}
.login_wrap input[type="text"]{
	width:400px;
	margin:0 auto 8px auto;
	display:block;
}
.login_wrap input[type="password"]{
	width:400px;
	margin:0 auto 8px auto;
	display:block;
}
.login_wrap p{
	color:#ff1d25;
	font-weight:bold;
}

/* ダッシュボード
---------------------------------------------------------------------------- */
.column4_list{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	max-width:980px;
	width:100%;
	overflow:hidden;
}
.column4_list div.rollover{
	flex-basis: 480px;
	max-width:480px;
	height:215px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border:1px solid #29abe2;
	color:#29abe2;
	font-weight:bold;
	text-align:center;
	background-color: #fff;
	border-radius: 5px;
	margin:0 0 20px 0;
	position: relative;
	-webkit-transition: all .3s;
    transition: all .3s;
}

.column4_list div ul{
	width:100%;
}
.column4_list div ul li{
	display: flex; /* 子要素をflexboxで揃える */
    flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
	align-content: center;  /* 子要素をflexboxにより中央に配置する */
	height:215px;
	font-weight:bold;
	font-size:22px;
}
.column4_list div ul li p{
	margin-bottom:20px;
}
.column4_list div a{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-indent:-999px;
}

.column4_list div.rollover:hover {
    filter:alpha(opacity=70);/* IE 6,7*/
    -ms-filter: "alpha(opacity=70)";/* IE 8,9 */
    -moz-opacity:0.7;/* FF , Netscape */
    -khtml-opacity: 0.7;/* Safari 1.x */
    opacity:0.7;
    zoom:1;/*IE*/
}

/* 入力
---------------------------------------------------------------------------- */

ul.side_slide{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	width:100%;
	margin-bottom:30px;
}
ul.side_slide li{
	flex-basis: auto;
	min-width:30px;
	margin:0 20px;
	font-size:24px;
	font-weight:normal;
}
ul.side_slide li:nth-child(2){
	padding-top:5px;
}

ul.upimg{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
	margin-bottom:50px;
}
ul.upimg li{
	flex-basis: 23%;
	max-width:23%;
	position:relative;
	margin-bottom:30px;
}
ul.upimg li h5{
	border-bottom:1px solid #ccc;
	margin-bottom:2px;
	padding-left:5px;
	font-weight:normal;
}


ul.upimg li img{
	width:auto;
	margin-top:8px;
	pointer-events: none;
	display:block;
}

ul.upimg li canvas{
	margin-bottom:5px;
	width:100%;
}
/*
ul.upimg li label img {
  pointer-events: auto;
}
*/

ul.upimg li label{
	background-image: url(../images/cmn_img/choice_img.png);
	background-size:cover;
	width:216px;
	height:52px;
	margin-top:5px;
}

ul.upimg li label input{
  display:none;
}
ul.upimg li label input{
  cursor:pointer;
}
ul.upimg li .btn-primary{
  margin-top:5px;
}

ul.upimg li button {
    -webkit-appearance: button;
    -webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
    color: buttontext;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: center;
    align-items: flex-start;
    cursor: default;
    background-color: buttonface;
    box-sizing: border-box;
    margin: 0em;
    font: 400 13.3333px ;
    padding: 4px 6px 0 6px;
    border-width: 2px;
    border-style: outset;
    border-color: buttonface;
    border-image: initial;
}

ul.upimg li .close{
		position:absolute;
		display:inline-block;
		top:120px;
		right:4px;
		width:40px;
		height:40px;
		border:0;
		background-color:black;
		border-radius:5px;
		margin:0;
		padding:0;
		transform:scale(0.5);
		cursor:pointer;
	}
ul.upimg li .close:before{
		content:"";
		position:absolute;
		display:inline-block;
		top:8px;
		left:17px;
		width:6px;
		height:24px;
		border:0;
		margin:0;
		padding:0;
		background-color:white;
		-moz-transform:rotate(45deg);
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
	}
ul.upimg li .close:after{
		content:"";
		position:absolute;
		display:inline-block;
		top:8px;
		left:17px;
		width:6px;
		height:24px;
		border:0;
		margin:0;
		padding:0;
		background-color:white;
		-moz-transform:rotate(-45deg);
		-webkit-transform:rotate(-45deg);
		transform:rotate(-45deg);
	}
ul.upimg li .close:hover{
		background-color:red;
	}

.attention_wrap{
	width:100%;
	padding:10px 20px 0 20px;
}
.attention_wrap p{
	color: #FF0000 !important;
}

/* インラインフレーム用
---------------------------------------------------------------------------- */
.popupframewrap{
	padding:0 40px 0 40px;
	min-height:600px;
	overflow:auto;
  -webkit-overflow-scrolling:touch;
}

/* ポップアップ
---------------------------------------------------------------------------- */

ul.popup_shinkibtn{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items:stretch;
	align-content:stretch;
	width:100%;
}
ul.popup_shinkibtn li{
	flex-basis: auto;
	max-width:auto;
	padding:0 2px;
	height:auto!important;
}
ul.popup_shinkibtn li input{
	width:100%;
}

ul.popup_shinkibtn2{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items:stretch;
	align-content:stretch;
	width:250px;
	margin:0 auto 45px auto;
}
ul.popup_shinkibtn2 li{
	flex-basis: 100%;
	max-width:100%;
	padding:0 2px;
	height:auto!important;
}
ul.popup_shinkibtn2 li input{
	width:100%;
}


.popaup_ketteibtn{
	position: fixed;
	bottom:20px;
	width: 100%;
	text-align: center;
	margin-left:-40px;
	z-index:9999;
}
/*IE ハック 決定ボタンのpadding*/
.ie_pdbtm{
	padding-bottom: 100px\9; /* IE10以下 */
}
@media all and (-ms-high-contrast: none){
  .ie_pdbtm{
    padding-bottom: 100px; /* IE10以上 */
  }
}

/* 見積もり編集画面
---------------------------------------------------------------------------- */
#swaipe_wrap{
  width: 980px;
  margin:0 auto 0;
	background-color:#fff;
}
.slide-item{
  width:100%;
}
#swaipe_wrap li{
  padding:20px 20px 40px 20px;
}
#thumbnail-list{
  width: 980px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  flex-wrap:wrap;
}
.thumbnail-item{
  flex: 0 1 18.4%;
	box-sizing: border-box;
  position:relative;
	background-color: #29ABE2;
	color:#fff;
	text-align:center;
	cursor: pointer;
	padding:5px 0;
}
.thumbnail-item:nth-child(4){
	background-color: #FF7F00;
}
.thumbnail-item:nth-child(5){
	background-color: #8DE229;
}
.thumbnail-current{
	background-color: #fff!important;
	color:#29ABE2!important;
}


.mitsumori_credit{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
}
.mitsumori_credit div{
	flex-basis: 47.5%;
	max-width: 47.5%;
	padding:20px;
	text-align:center;
}
.mitsumori_credit div.plan1{
	background-color:#effbff;
}
.mitsumori_credit div.plan1 h3{
	background-color:#00bfff;
	color:#fff;
	text-align:center;
	padding:10px;
	font-weight:bold;
	margin-bottom:10px;
}
.mitsumori_credit div.plan2{
	background-color:#fffdef;
}
.mitsumori_credit div.plan2 h3{
	background-color:#ffc000;
	color:#fff;
	text-align:center;
	padding:10px;
	font-weight:bold;
	margin-bottom:10px;
}

.mitsumori_credit table{
	width:100%;
	text-align:left;
}
.mitsumori_credit table th{
	width:40%;
	padding:3px 5px;
}
.mitsumori_credit table td{
	width:60%;
	text-align:right;
	padding:3px 5px;
}
/*7段組みtable 見積もりトータル */
.mitumori_carname{
	background-color: #fff;
	padding:1px 20px 10px 20px;
	margin-bottom:10px;
}
.mitumori_carname p{
	font-weight:bold;
	margin-bottom:0px;
}
table.mitumori_total{
	width:100%;
	text-align:center;
	margin-top:-10px;
}
table.mitumori_total th{
	padding:0 5px;
	vertical-align: bottom;
	width:23.5%;
	font-size:70%;
}
table.mitumori_total th:nth-child(2) , table.mitumori_total th:nth-child(4) , table.mitumori_total th:nth-child(6){
	width:2%;
}
table.mitumori_total td{
	padding:0 5px 0 5px ;
	vertical-align: top;
	text-align:right;
	border-radius: 5px;
}
table.mitumori_total td.wakunone{
	border:none;
}

table.mitumori_total td input[type="text"] , table.mitumori_total td input[type="number"]{
	text-align:right;
	width:100%;
	padding: 5px 10px;
}

/*諸費用　下取り　table  */
.sitadori_wrap{
	width:980px;
	position:relative;
	height:60px;
}
.sitadori_wrap p{
	position:absolute;
	top:0;
	left:120px;
}
ul.sitadori_slide{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	width:700px;
	margin-bottom:30px;
	position:absolute;
	top:-18px;
	right:0px;
}
ul.sitadori_slide li{
	flex-basis: auto;
	min-width:30px;
	margin:0;
	font-size:24px;
	font-weight:normal;
	text-align:center;
}

ul.sitadori_slide li:nth-child(2){
	line-height:1.2;
}

table.sitadori_table{
	max-width:980px;
	width:100%;
	margin-bottom:20px;
	
}
table.sitadori_table td{
	padding:0 5px;
	
}
table.sitadori_table td:nth-of-type(1){
	text-align:left;
}
table.sitadori_table td:nth-of-type(2){
	text-align:center;
}
table.sitadori_table td:nth-of-type(3){
	text-align:right;
}


ul.creditdetailbtn_wrap{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
	margin:50px 0 0 0;
}
ul.creditdetailbtn_wrap li{
	flex-basis: 30%;
	max-width:30%;
}

/* 在庫車
---------------------------------------------------------------------------- */
.zaiko_topbar{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:center;
	align-content:stretch;
	width:100%;
	margin-bottom:10px;
	padding-bottom:20px;
	border-bottom:3px solid #29ABE2;
}
.zaiko_topbar li.icon-wrap{
	flex-basis: 12.7%;
	max-width: 12.7%;
}
.zaiko_topbar li.conditions-wrap{
	flex-basis: 23%;
	max-width: 23%;
}
.zaiko_topbar li.syasyu-wrap{
	flex-basis: 23%;
	max-width: 23%;
}
.zaiko_topbar li.tenpo-wrap{
	flex-basis: 23%;
	max-width: 23%;
}
.zaiko_topbar li.shinki-wrap{
	flex-basis: 12%;
	max-width: 12%;
}

.icon-choice{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
}
.icon-choice div{
	flex-basis: 48%;
	max-width: 48%;
}
.icon-choice div img{
	width: 100%;
	opacity:0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha( opacity=50 )";
	background: #fff;
}

.icon-choice div a:hover img{
	opacity:80;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
	background: #fff;
}

.icon-choice div.active img{
	opacity:100;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	background: #fff;
}
.conditions-choice{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
	text-align:center;
}
.conditions-choice div{
	flex-basis: 31%;
	max-width: 31%;
}
.conditions-choice ul{
	font-size:70%;
}


ul.card_wrap{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content:flex-start;
	align-items:stretch;
	align-content:stretch;
	width:940px;
}
ul.card_wrap li{
	flex-basis: 32%;
	max-width: 32%;
	/*margin-bottom:20px;*/
	margin:0 0.6% 20px 0.6%;
	background-color:#f2f2f2;
	padding:15px 10px;
	position:relative;
}
ul.card_wrap li p{
	border-bottom:1px solid #ccc;
	line-height:1.3;
	padding:2px 0 5px 0;
	margin-bottom:3px;
}
ul.card_wrap li .card_img{
	margin-bottom:5px;
	border-bottom:none;
	position:relative;
}

ul.card_wrap li .card_img button{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	cursor: pointer;
}
ul.card_wrap li .card_img img{
	width:100%;
}
ul.card_wrap li .syoudancyu_card , ul.card_wrap li .baiyakuzumi_card{
	position:absolute;
	top:25px;
	right:25px;
}
ul.card_wrap li .syoudancyu_card span{
	padding: 3px 8px;
	background-color:#FFFD00;
	font-weight:bold;
}
ul.card_wrap li .baiyakuzumi_card span{
	padding: 3px 8px;
	background-color:#BCBCBC;
	font-weight:bold;
}
ul.card_wrap li .card_wrap_btn{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items:stretch;
	align-content:stretch;
	width:100%;
	margin-top:12px;
}
ul.card_wrap li .card_wrap_btn div{
	flex-basis: 55px;
	max-width: 55px;
	margin:0 10px;
}
ul.card_wrap li .card_wrap_btn div.mitsu{
	flex-basis: 90px;
	max-width: 90px;
}

/* マイナスアイコン
---------------------------------------------------------------------------- */
.mainasu {
	margin: auto;
	width: 39px;
}
.mainasu input[type="checkbox"] {
display: none;
}

.mainasu label {
  display: block;
  box-sizing: border-box;
  text-align: center;
  /*border: 2px solid #78bd78;*/
  border-radius: 3px;
  height: 39px;
  font-size: 18px;
  line-height: 39px;
  font-weight: bold;
  background: #eee;
  /*box-shadow: 1px 1px 2px #999;*/
  transition: .3s;
}
 
.mainasu label span:after{
  content        : "△";
  color          : #ccc;
}
.mainasu #mainasu_check:checked + label {
  background     : #E22959;
  box-shadow     : none;
}
.mainasu #mainasu_check:checked + label span:after {
  content        : "▲";
  color          : #fff;
}

ul.if_mainasu{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:210px;
	margin:0 auto 4px auto;
}
ul.if_mainasu li:nth-child(1){
	flex-basis: 46px;
	max-width: 46px;
	margin-right:4px;
}
ul.if_mainasu li:nth-child(2){
	flex-basis: 160px;
	max-width: 160px;
}

.ClearBtn{
	width:218px;
	margin:0 auto 4px auto;
}
.ClearBtn input[type="button"]{
    display: inline-block;
	width:70px;
	height:60px;
    text-decoration: none;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7d7e7d+0,0e0e0e+100;Black+3D */
background: rgb(125,126,125); /* Old browsers */
background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
    color: #FFF;
    border-bottom: solid 4px #333;
    border-radius: 3px;
	font-size:20px;
}

.ClearBtn input[type="button"]:active {/*ボタンを押したとき*/
    -ms-transform: translateY(2px);
    -webkit-transform: translateY(2px);
    transform: translateY(2px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}

/* クレジット切り替え
---------------------------------------------------------------------------- */
.arrow{
    position: relative;
    display: inline-block;
    padding: 0 0 0 0;
	margin:0 10px 5px 5px;
    color: #fff;
    vertical-align: middle;
    text-decoration: none;
    font-size: 15px;
	
}
.arrow::before,
.arrow::after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}

.credit_yaji{
    left: 3px;
    width: 37px;
    height: 2px;
    background: #fff;
}

.credit_yaji::before{
    left: 30px;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.credit_yaji::after{
    left: 0px;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}

.kirikaebtn {
  display: inline-block;
  width: 200px;
  height: 50px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
	border-radius: 25px;
	cursor: pointer;
	margin: 0;
}
.kirikaebtn::before,
.kirikaebtn::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.kirikaebtn,
.kirikaebtn::before,
.kirikaebtn::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.kirikaebtn {
  background-color: #8DE229;
  color: #fff;
}
.kirikaebtn:hover {
  background-color: #a9ea5d;
}

.kirikaebtn_wrap{
	text-align:center;
	width:200px;
	margin:20px auto 0 auto
}
.kirikaebtn_wrap a {
  color:
	  #fff!important;
}
.kirikaebtn_wrap a:hover {
  color:
	  #fff!important;
	text-decoration: none;
}


/* ページャー  */
.pager .pagination {
  text-align: center;
	margin:15px 0;
}

.pager .pagination li {
  display: inline;
  margin: 0 5px;
  padding: 0;
  display: inline-block;
  background:#fff;
  width: 50px;
  height: 50px;
  text-align: center;
  position: relative;
}


.pager .pagination li a{
  vertical-align: middle;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display:table;
  color: #2AABE4;
  text-decoration: none;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all  0.3s ease;
  border:1px solid #2AABE4;
  border-radius: 50px;
}

.pager .pagination li.pre a , .pager .pagination li.next a{
  vertical-align: middle;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display:table;
  color: #2AABE4;
  border:none!important;
	font-size:200%;
	line-height:1.0;
}
.pager .pagination li.saisyo a , .pager .pagination li.saigo a{
  vertical-align: middle;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display:table;
  color: #2AABE4;
	font-size:200%;
	line-height:1.0;
}

.pager .pagination li a span{
  display:table-cell;
  vertical-align:middle;
}
.pager .pagination li.pre a span , .pager .pagination li.next a span{
  display:table-cell;
  vertical-align:top;
}
.pager .pagination li.saisyo a span , .pager .pagination li.saigo a span{
  display:table-cell;
  vertical-align:top;
}

.pager .pagination li a:hover,
.pager .pagination li a.active{
  color: #fff;
  background: #2AABE4;
  border-radius: 50px;
}

/* ↓↓↓↓↓新規追加 20220627↓↓↓↓↓
---------------------------------------------------------------------------- */
/* 検索
---------------------------------------------------------------------------- */
.search_menu_wrap{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
}
.search_menu_wrap_pd{
	padding:20px 30px 60px 30px;
}

.search_menu_wrap div.search_menu_wrap_box .selectbox {
    overflow: hidden;
    width: auto;
    margin: 0 auto;
    text-align: center;
    position: relative;
    border-radius: 2px;
    border: 2px solid #29ABE2;
    background: #ffffff;
    display: inline-block;
    vertical-align: bottom;
    max-width: 300px;
}

.search_menu_wrap_pd h3 {
  position: relative;
  padding: 5px 5px 5px 48px;
  background: #333;
  font-size: 22px;
  color: white;
  margin-left: -33px;
  line-height: 1.3;
  z-index:-1;
	font-weight:bold;
	margin-bottom:30px;
}

.search_menu_wrap_pd h3:before {
  position: absolute;
  content: '';
  left: -2px;
  top: -2px;
  border: none;
  border-left: solid 40px white;
  border-bottom: solid 79px transparent;
  z-index:-2
}
/*space-between で2つの時に左寄せ*/
.search_menu_wrap::after{
	content:"";
	display: block;
	width:48%;
}
.search_menu_wrap div.search_menu_wrap_box{
	/*flex-basis: 48.5%;
	max-width: 48.5%;*/
	flex-basis: auto;
	max-width: auto;
	margin-bottom:20px;
	font-size:80%!important;
}
.search_menu_wrap div.search_menu_wrap_box.wd100{
	flex-basis: 100%;
	max-width: 100%;
	margin-bottom:30px;
}
.search_menu_wrap div.search_menu_wrap_box.wd62{
	flex-basis: 62.5%;
	max-width: 62.5%;
	margin-bottom:30px;
}

.search_menu_wrap_box.tax label input[type="checkbox"] + span{
    position: relative;
    padding: 0 30px 0 40px;
}

.search_menu_wrap_box.tax input[type="checkbox"] + span::before, .search_menu_wrap_box label input[type="checkbox"] + span::after {
    position: absolute;
    top: 4px;
    left: 7px;
    display: inline-block;
    content: '';
    box-sizing: border-box;
}
.search_menu_wrap_box label input[type="checkbox"] + span::after {
    z-index: 1;
    margin: 7px 0;
    width: 6px;
    height: 9px;
}
.search_menu_wrap_box.tax label input[type="checkbox"] + span::after {
    z-index: 1;
    margin: 5px 8px;
    width: 6px;
    height: 9px;
}


.search_menu_wrap_box.tax label input[type="checkbox"] + span.tax_24 {
  z-index: 0;
  /*background-color: transparent;*/
	background-color:#ff9e5c;
}
.search_menu_wrap_box.tax label input[type="checkbox"] + span.tax_48 {
  z-index: 0;
  /*background-color: transparent;*/
	background-color:#ffbfc6;
}
.search_menu_wrap_box.tax label input[type="checkbox"] + span.tax_60 {
  z-index: 0;
  /*background-color: transparent;*/
	background-color:#81d3f7;
}
.search_menu_wrap_box.tax label input[type="checkbox"] + span::before {
  z-index: 0;
  background-color: white;
  width: 22px;
  height: 22px;
  border: 2px #29ABE2 solid;
  border-radius: 5px;
}
.search_menu_wrap_box.tax label input[type="checkbox"]:checked + span::after {
    border: 2px solid #29ABE2;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
	z-index: 1;
}

/* stock-list-new.html 在庫者情報
---------------------------------------------------------------------------- */
.zaiko_topbar li.favorite_wrap{
	flex-basis: 26.6%;
	max-width: 26.6%;
}
.zaiko_topbar li.conditions-wrap_new{
	flex-basis: 26.6%;
	max-width: 26.6%;
}
.zaiko_topbar li.maker-wrap{
	flex-basis: 26.6%;
	max-width: 26.6%;
}
.zaiko_topbar li.tenpo-wrap_new{
	flex-basis: 25%;
	max-width: 25%;
}
.zaiko_topbar li.favorite_wrap label input[type="checkbox"] + span::before {
  content:"☆";
	color:#333;
  font-size:1em;
	line-height:1.0;
	font-weight:bold;
} 
.zaiko_topbar li.favorite_wrap label input[type="checkbox"]:checked + span::before {
  color:#ffea00;
	content:"★";
} 
.zaiko_topbar li.favorite_wrap label input[type="checkbox"] + span::before {
    z-index: 0;
    background-color: transparent;
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 5px;
}
.zaiko_topbar li.favorite_wrap label input[type="checkbox"]:checked + span::after {
    border: none;
    border-width: 0 0 0 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.stock_ichiran_individual{
	width:100%;
	padding-bottom:10px;
	margin-bottom:10px;
	border-bottom:1px solid #ccc;
}
.stock_ichiran_individual.trade{
	width:100%;
	padding:10px;
	margin-bottom:10px;
	border-top:1px solid #ccc;
}
.stock_ichiran_individual.kounyu{
	background: #b5e8fc;
}
.stock_ichiran_individual.baikyaku{
	background: #ffd7ea;
}

.stock_num{
	display: inline-block;
	font-size:70%;
}
.stock_num span{
	color:#af0000;
	font-weight:bold;
	padding-left:20px;
}
.stock_ichiran_individual_innerwrap{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img{
	flex-basis: 25%;
	max-width: 25%;
	position: relative;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img .sateisyo{
	position:absolute;
	bottom:35px;
	left:6px;
	width:40px;
	height:40px;
	background: url(../images/cmn_img/sateisyo.svg) no-repeat 0 0;
	background-size: contain;
	z-index:999;
	opacity: 0.7;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img .zipdl{
	position:absolute;
	bottom:35px;
	right:6px;
	width:40px;
	height:40px;
	background: url(../images/cmn_img/zipdl.svg) no-repeat 0 0;
	background-size: contain;
	z-index:999;
	opacity: 0.7;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img .stock_shinchakuicon{
	position:absolute;
	top:5px;
	left:5px;
	font-size:80%;
	background-color:#FFFD00;
	font-weight:bold;
	padding: 0 5px;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img .stock_hikiateicon{
	position:absolute;
	top:5px;
	left:5px;
	font-size:80%;
	background-color:#666;
	font-weight:bold;
	padding: 0 5px;
	color:#fff;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img .trade_shinchakuicon{
	position:absolute;
	top:5px;
	left:5px;
	font-size:80%;
	background-color:#FFFD00;
	font-weight:bold;
	padding: 0 5px;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img .trade_kanryoicon{
	position:absolute;
	top:5px;
	left:5px;
	font-size:80%;
	background-color:#333;
	font-weight:bold;
	padding: 0 5px;
	color:#fff;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img button {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}
.stock_ichiran_individual_innerwrap_img_name{
	font-size:60%;
	margin-top:5px;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_img img{
	width: 100%;
}
.stock_ichiran_individual_innerwrap div.stock_ichiran_individual_innerwrap_detail{
	flex-basis: 73%;
	max-width: 73%;
}
.stock_ichiran_individual_innerwrap .stock_ichiran_tax{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
	margin-bottom:8px;
}
/*space-between で2つの時に左寄せ*/
.stock_ichiran_individual_innerwrap .stock_ichiran_tax::after{
	content:"";
	display: block;
	width:32%;
}
.stock_ichiran_individual_innerwrap  div.stock_ichiran_taxbox{
	flex-basis: 32%;
	max-width: 32%;
	text-align:center;
	font-size:90%;
}
.stock_ichiran_individual_innerwrap  div.stock_ichiran_taxbox.tax_24{
	background-color:#ff9e5c;
}
.stock_ichiran_individual_innerwrap  div.stock_ichiran_taxbox.tax_48{
	background-color:#ffbfc6;
}
.stock_ichiran_individual_innerwrap  div.stock_ichiran_taxbox.tax_60{
	background-color:#81d3f7;
}
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
	margin-bottom:8px;
}
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_left{
	flex-basis: 55%;
	max-width: 55%;
}
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_left p.cartitle{
	font-weight:bold;
	line-height:1.2;
	margin-bottom:5px;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden; 
}
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_left p.comment{
	font-size:80%;
	line-height:1.2;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden; 
}

.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_right{
	flex-basis: 44%;
	max-width: 44%;
}

.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_right .kakusyu_info{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
	text-align:center;font-size:70%;
}
/*space-between で2つの時に左寄せ*/
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_right .kakusyu_info::after{
	content:"";
	display: block;
	width:33%;
}
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_right .kakusyu_info .kakusyu_info_box{
	flex-basis: 33%;
	max-width: 33%;
}
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_right .kakusyu_info .kakusyu_info_box.lgrey{
	background-color:#f2f2f2;
}
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_right .kakusyu_info .kakusyu_info_box.grey{
	background-color:#ccc;
}
.stock_ichiran_individual_innerwrap_detail .stock_ichiran_carinfo .stock_ichiran_carinfo_right .kakusyu_info .kakusyu_info_box.wh{
	background-color:#fff;
}

.stock_ichiran_price_line{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:flex-end;
	align-content:stretch;
	width:100%;
}
.stock_ichiran_price_line div.stock_ichiran_price_wrap{
	flex-basis: 70%;
	max-width: 70%;
}
.stock_ichiran_price_line div.stock_ichiran_price_wrap .stock_ichiran_price_wrap_inner{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:flex-end;
	align-content:stretch;
	width:100%;
}
.stock_ichiran_price_line div.stock_ichiran_price_wrap .stock_ichiran_price_wrap_inner .hontaikakakubox{
	flex-basis: 60%;
	max-width: 60%;
	text-align:center;
	font-size:80%;
	line-height:1.2;
}
.stock_ichiran_price_line div.stock_ichiran_price_wrap .stock_ichiran_price_wrap_inner .hontaikakakubox span{
	font-size:200%;
	font-weight:bold;
}
.stock_ichiran_price_line div.stock_ichiran_price_wrap .stock_ichiran_price_wrap_inner .torihikibox{
	flex-basis: 35.5%;
	max-width: 35.5%;
}
.stock_ichiran_price_line div.stock_ichiran_mitumori_wrap{
	flex-basis: 30%;
	max-width: 30%;
	text-align:right;
}
/* ============================
fade
=============================*/
.mfp-fade.mfp-bg{
	opacity: 0;
	transition: all 0.3s ease-out;
}
.mfp-fade.mfp-bg.mfp-ready {
	opacity: 0.8;
}
.mfp-fade.mfp-bg.mfp-removing{
	opacity: 0;
}
.mfp-fade.mfp-wrap .mfp-content{
	opacity: 0;
	transition: all 0.3s ease-out;
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content{
	opacity: 1;
}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content{
	opacity: 0;
}
.white-popup-block{
	background: #FFF;
	width: 90%;
	margin: 0 auto;
	padding: 3%;
	text-align: center;
}

a.popup_close_btn{
	display: block;
	width:60%;
	background: #000;
	padding:10px 0;
	color: #FFF;
	border-radius: 5px;
	text-align: center;
	transition: all .3s;
	box-sizing: content-box;
	margin:20px auto 0 auto
}

a.btn:hover{
	background: #333;
}


a.btn span {
    font-size: 80%;
    display: inline-block;
    margin: 0 0 0 10px;
}


.stock_ichiran_individual label.favorite input[type="checkbox"] + span::before {
  content:"☆";
	color:#333;
  font-size:1em;
	line-height:1.0;
	font-weight:bold;
} 
.stock_ichiran_individual label.favorite input[type="checkbox"]:checked + span::before {
  color:#29ABE2;
	content:"★";
} 
.stock_ichiran_individual label.favorite input[type="checkbox"] + span::before {
    z-index: 0;
    background-color: transparent;
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 5px;
}
.stock_ichiran_individual label.favorite input[type="checkbox"]:checked + span::after {
    border: none;
    border-width: 0 0 0 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* アコーディオン */
.s_01 .accordion_one {
  max-width: 1024px;
  margin: 0 auto 20px auto;
}
.s_01 .accordion_one .accordion_header {
  background-color: #db0f2f;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  padding: 5px 11%;
  text-align: center;
  position: relative;
  z-index: +1;
  cursor: pointer;
  transition-duration: 0.2s;
}

.s_01 .accordion_one:nth-of-type(2) .accordion_header {
    background-color: #ff9a05;
}
.s_01 .accordion_one:nth-of-type(3) .accordion_header {
    background-color: #1c85d8;
}
.s_01 .accordion_one .accordion_header:hover {
  opacity: .8;
}
.s_01 .accordion_one .accordion_header .i_box {
  content:"";
  display:block;
  width:12px;
  height:12px;
  border-top: #fff 4px solid;
  border-right: #fff 4px solid;
  -webkit-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  transform: rotate(135deg);
  position:absolute;
  right: 3%;
  top: 0;
  bottom: 15%;
  margin: auto;
  transition-duration: 0.2s;
}
.s_01 .accordion_one .accordion_header .i_box .one_i {
  display: block;
  width: 18px;
  height: 18px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
  position: relative;
}
.s_01 .accordion_one .accordion_header.open .i_box {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
	bottom: 0%;
	top: 3px;
}

.s_01 .accordion_one .accordion_header .i_box .one_i:before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
.s_01 .accordion_one .accordion_header.open .i_box .one_i:before {
  content: none;
}
.s_01 .accordion_one .accordion_header.open .i_box .one_i:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.s_01 .accordion_one .accordion_inner {
  display: none;
  padding: 30px 30px;
  border-left: 2px solid #db0f2f;
  border-right: 2px solid #db0f2f;
  border-bottom: 2px solid #db0f2f;
  box-sizing: border-box;
}
.s_01 .accordion_one .accordion_inner .box_one {
  height: auto;
}
.s_01 .accordion_one .accordion_inner p.txt_a_ac {
  margin: 0;
}
@media screen and (max-width: 1024px) {
  .s_01 .accordion_one .accordion_header {
    font-size: 18px;
  }
  .s_01 .accordion_one .accordion_header .i_box {
    width: 24px;
    height: 24px;
    margin-top: -15px;
  }
}
@media screen and (max-width: 767px) {
  .s_01 .accordion_one .accordion_header {
    font-size: 16px;
    text-align: left;
    padding: 15px 60px 15px 15px;
  }
}

/* estimate-edit.html
---------------------------------------------------------------------------- */
.mitsumori_lease{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items:stretch;
	align-content:stretch;
	width:100%;
}
.mitsumori_lease label{
	flex-basis: 46.5%;
	max-width: 46.5%;
	text-align:center;
	margin:0 0.75% 30px 0.75%;
}
.mitsumori_lease label.plan{
	background-color:#effbff;
	pointer-events: none;
}

.mitsumori_lease label.selected{
    outline-color: #af0000;
    outline-offset: 3px;
    outline-style: solid;
    outline-width: 5px;
}

.mitsumori_lease label.plan h3{
	background-color:#00bfff;
	color:#fff;
	text-align:center;
	padding:10px;
	font-weight:bold;
	margin-bottom:10px;
}

.mitsumori_lease table{
	width:100%;
	text-align:left;
}
.mitsumori_lease table tr.kiiro{
	background-color:#fff352;
}
.mitsumori_lease table th{
	width:35%;
	padding:3px 5px;
}
.mitsumori_lease table td{
	width:65%;
	text-align:right;
	padding:3px 5px;
}
.mitsumori_lease table td label{
	flex-basis: 100%;
	max-width: 100%;
	text-align:right;
	margin:0;
	pointer-events: auto;
}
.mitsumori_lease label.plan input[type="text"] , .mitsumori_lease label.plan input[type="textarea"] , .mitsumori_lease label.plan input[type="number"] , .mitsumori_lease label.plan input[type="password"] , .mitsumori_lease label.plan input[type="checkbox"], .mitsumori_lease label.plan input[type="radio"] , .mitsumori_lease label.plan select , .mitsumori_lease label.plan select , .mitsumori_lease label.plan input[type="submit"] , .mitsumori_lease label.plan input[type="month"] {
  pointer-events: auto;
}

.mitsumori_lease table td .bonus_plus{
	width: 65%;
	text-align:right;
}

.mitsumori_lease .colum2wrap{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:stretch;
	align-content:stretch;
	width:100%;
}
.mitsumori_lease .colum2wrap div.box{
	flex-basis: 48.5%;
	max-width: 48.5%;
}


/*プラン確定ボタン*/
 input.planbutton[type="radio"] + span  {
  display: inline-block;
  width: 300px;
  height: 50px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
	border-radius: 25px;
	cursor: pointer;
	margin:20px 0 20px 0;
	 pointer-events: auto !important;
}
 input.planbutton[type="radio"] + span ::before,
 input.planbutton[type="radio"] + span ::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
 input.planbutton[type="radio"] + span ,
 input.planbutton[type="radio"] + span ::before,
 input.planbutton[type="radio"] + span ::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
 input.planbutton[type="radio"] + span  {
  background-color: #ff7f00;
  color: #fff;
}
 input.planbutton[type="radio"] + span :hover {
  background-color: #ff931e;
	color:#fff;
	text-decoration: none;
}
/*ラジオボタン*/
label input.planbutton[type="radio"] + span::before {
  z-index: 0;
  top: 7px;
  left: 0;
  background-color: transparent;
  width: 0;
  height: 0;
  border: 0 #29ABE2 solid;
}
.mitumori_carname span.tax_24{
	background-color:#ff9e5c;
	padding:0 5px;
}
.mitumori_carname .tax_48{
	background-color:#ffbfc6;
	padding:0 5px;
}
.mitumori_carname .tax_60{
	background-color:#81d3f7;
	padding:0 5px;
}
.smalltxt{
	font-size:70%;
	line-height:0.5;
	padding-top:5px;
}

@media screen and (min-width: 1024px) {
	.mitsumori_lease label{
		margin:0 1% 30px 1%;
	}
}


/* 装備アイコン */
.detail-data .data-list {
  border-bottom: 1px solid #ccc;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.detail-data .data-list dt {
  background-color: #f2f2f2;
  border-top: 1px solid #ccc;
  padding: 18px 20px;
  max-width: 280px;
  width: 20%;
}
.detail-data .data-list dd {
  border-top: 1px solid #ccc;
  padding: 18px 20px;
  width: 30%;
}
.detail-data .data-list dd.col3 {
  width: 80%;
}
.detail-data .equipment-spec .equipment-spec-list {
  margin-left: -1%;
}
.detail-data .equipment-spec .equipment-spec-list::after {
  content: "";
  display: block;
  clear: both;
}
.detail-data .equipment-spec .equipment-spec-list .item {
  background: #fff;
  border-radius: 5px;
  border: 1px solid #ccc;
  color: #999;
  float: left;
  font-size: 70%;
  font-weight: normal;
  height: 40px;
  line-height: 1;
  margin: 0 0 10px 1%;
  padding: 13px 20px 0;
  width: 24%;
}
.detail-data .equipment-spec .equipment-spec-list .item.double {
  width: 49%;
}
.detail-data .equipment-spec .equipment-spec-list .item.active {
  border: 1px solid #cc0000;
  color: #cc0000;
  font-weight: bold;
}

@media screen and (max-width: 940px) {
  .detail-data .equipment-spec .equipment-spec-list .item {
    font-size: 13px;
    padding: 12px 10px;
  }
}
@media screen and (max-width: 768px) {
  .detail-data .data-menu .data-menu-list {
    padding: 13px 10px;
  }
  .detail-data .data-list dt {
    padding: 9px 10px;
    max-width: 240px;
    width: 40%;
  }
  .detail-data .data-list dd {
    padding: 9px 10px;
    width: 60%;
  }
  .detail-data .data-list dd.col3 {
    width: 60%;
  }
  .detail-data .data-list .no-data {
    display: none;
  }
  .detail-data .equipment-spec .equipment-spec-list {
    margin-left: -2%;
  }
  .detail-data .equipment-spec .equipment-spec-list::after {
    content: "";
    display: block;
    clear: both;
  }
  .detail-data .equipment-spec .equipment-spec-list .item {
    height: 24px;
    margin: 0 0 5px 2%;
    padding: 6px 5px 0;
    width: 48%;
  }
  .detail-data .equipment-spec .equipment-spec-list .item.double {
    width: 100%;
  }
}
@media screen and (max-width: 414px) {
  .detail-data .equipment-spec .equipment-spec-list .item {
    font-size: 10px;
  }
}