@charset "UTF-8";
/* CSS Document */


/* ------------------------------ title text
*/


.t80 {font-size:8.0rem;}
.t50 {font-size:5.0rem;}
.t40 {font-size:4.0rem;}
.t30 {font-size:3.0rem;}
.t28 {font-size:2.8rem;}
.t24 {font-size:2.4rem;}
.t22 {font-size:2.2rem;}
.t20 {font-size:2.0rem;}
.t18 {font-size:1.8rem;}
.t16 {font-size:1.6rem;}
.t15 {font-size:1.5rem;}
.t14 {font-size:1.4rem;}
.t13 {font-size:1.3rem;}
.t12 {font-size:1.2rem !important;}
.t11 {font-size:1.1rem !important;}
.t10 {font-size:1.0rem !important;}


/* ----------------------------- margin
*/
.mb5 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb15 {margin-bottom:15px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb60 {margin-bottom:60px;}

.ml-10 {margin-left: 10px;}
.mr-20 {margin-right: 20px;}
.mr-40 {margin-right: 40px;}
.mr-60 {margin-right: 60px;}

.mt-10 {margin-top: 10px;}
.mt-5 {margin-top: 5px;}

.pd-20-all {padding: 20px;}
.pd-10-all {padding: 10px;}
.pd-5-all {padding: 5px;}
.pd-20-bottom {padding-bottom: 20px !important;}
.pd-40-bottom {padding-bottom: 40px !important;}
.pd-10-bottom {padding-bottom: 10px !important;}
.pd-20-top {padding-top: 20px !important;}
.pd-10-top {padding-top: 10px !important;}
.pd-5-10 {padding:5px 10px;}

.s-mr-15 {margin-right: 15px;}

html, body {
	height: 100%;
}

.header {
	width: 100%;
	height: 60px;
	background: #fff;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.3);

}

.main,.main-2 {
	width:100%;
	padding:25px 20px;
	box-sizing: border-box;
}



.header-inner {padding:0 20px; width: 1000px;  position: relative; box-sizing: border-box; margin: 0 auto; }

.inner { margin-left: auto; margin-right: auto; width: 1000px; box-sizing: border-box;}
.top-inner { margin-left: auto; margin-right: auto; width: 940px; }



/* ------------------------------ background
*/
.bg-wall {background: url("/img/bg.png") center ;}
.bg-gray {background: #EFEFEF;}
.bg-mizu {background: #DFEEFF;}
.bg-white {background: #fff;}
.bg-grey {background: #f2f2f2;}
.bg-blue {background: #0071BC;}
.bg-orange{background: #F7931E ;}
.bg-emerald {background:#58BCBC;}

.bg-about {background-image: url("../img/about_bg.jpg");
background-repeat: no-repeat;
background-position:-150px 0 ;}

.label_orange {background:#F7931E ; color: #fff; padding: 2px; margin-right: 0.7em;}

/* ------------------------------ header
*/
h1 {float: left; margin-right: 40px; padding-top: 5px;}

.about-live-box {float:left; color: #F38200; line-height: 40px; margin-top: 10px; font-size: 1.8rem;}


/* ------------------------------ login
*/
/*.login-box {float: right; margin-top: 15px;}*/
.login-box {position: absolute; right: 10px; top: 15px;}
.btn-login {padding: 3px 5px; border: 1px solid #F39800; display: block; text-align: center; font-size: 1.2rem; border-radius: 3px; color: #F39800; background: transparent ;}
/*.btn-login-box a:hover {background: #F39800; border: 1px solid #F39800; color: #fff;}*/

/*---------------------------------- popup
*/

.popup_screen {
	position: fixed;
	top: 0;
	left: 0;
	width:100%;
	height:100%;
	background: rgba(0, 0, 0, 0.4);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr=#44000000,EndColorStr=#44000000);
	z-index: 999;
}
.popup { position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 300px;
	height: 360px;
	margin:auto;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	background:#FFF;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	padding:10px 20px;
	z-index: 1000;}
.popup .innerBox { position: relative; width: 100%;}
.close-btn {position: absolute; top:0px; right: -10px;}


/* ------------------------------ TITLE
*/
b { font-weight: bold !important;}
.kei {border-bottom: 1px solid #ccc;}
.kei-dott {border-bottom: 1px dotted #ccc;}
.dash-tit {background: #ccc; border-radius: 7px 7px 0px 0px; padding: 3px 10px; }
.kei-all {border: 1px solid #ccc;}

/* top main */

.top-L,.top-R {width:47.8723404%;}

.btn_list li {
	float:left;
	width:18.6666%/*84px*/;
	border-radius: 6px;
	background: #fff;
	text-align: center;
	margin-right: 1.5555%/*7px*/;
	margin-bottom: 10px;
	font-size:1.2rem;
	line-height: 1.2;
	box-shadow: 0px 1px 3px -1px #666;
	padding-top: 5px;
	padding-bottom: 5px;
	min-height: 80px;
	box-sizing: border-box;}

.btn_list li:nth-child(5n){ margin-right: 0;}
.btn_list li a,.btn_list_price li a,.btn_list_body li a {color:#333;}
.btn_list li a:hover,.btn_list_price li a:hover,.btn_list_body li a:hover {color:#F39800;}

.btn_list_price li {
	float:left;
	width:23.85% !important;
	border-radius: 6px;
	background: #fff;
	text-align: center;
	margin-right: 1.1111% !important;
	margin-bottom: 10px;
	font-size:1.5rem;
	box-shadow: 0px 1px 3px -1px #666;
	padding-top: 15px;
	padding-bottom: 5px;
	min-height: 90px;
	box-sizing: border-box;
}
.btn_list_price li:nth-child(4n){margin-right: 0px;}

.btn_list_body li {
	float:left;
	width:23.85% !important;
	border-radius: 6px;
	background: #fff;
	text-align: center;
	margin-right: 1.1111% !important;
	margin-bottom: 10px;
	font-size:1.3rem;
	box-shadow: 0px 1px 3px -1px #666;
	padding-top: 15px;
	padding-bottom: 5px;
	min-height: 90px;
	box-sizing: border-box;
}
.btn_list_body li:nth-child(4n){margin-right: 0px;}

.search-box {
	border-radius: 6px;
	border:1px solid #ccc;
	background: #fff;
	padding: 0;
}

.search-box input[type="text"] {
	border: none;
    border-radius: 0;
    outline: none;
    background: none;
	padding: 5px;
	width: 91.1111%/*410px*/;
	box-sizing: border-box;
}
.search-box button {border-left:1px solid #ccc; height: 34px; width: 7.7777%/*35px*/; }

/* table */
.table-style-1 th, .table-style-1 td {padding: 3px; vertical-align: middle;}

.no-border th,.no-border td {border: none !important; vertical-align: middle; padding: 3px;}



/* width */

.w_half { width: 50% !important;}
.w140, .w140 dt	{ width: 140px;}
.w450 {width:450px;}
.w400 {width:400px;}
.w300 {width:300px;}
.w280 {width:280px;}
.w240 {width:240px;}
.w200 {width:200px;}
.w180 {width:180px;}
.w160 {width:160px;}
.w150 {width:150px;}
.w120 {width:120px !important;}
.w100 {width:100px;}
.w80 {width:80px;}
.w63 {width:63px !important;}
.w60 {width:60px;}
.w50 {width:50px;}
.w55 {width:55px;}
.w40 {width:40px;}
.w30 {width:30px;}
.w20 {width:20px;}
.w10 {width:10px;}

.w100p {width:100% !important;}
.w80p {width:80%;}
.w70p {width:80%;}
.w60p {width:60%;}
.w52p {width:52%;}
.w50p {width:50%;}
.w49p {width:49%;}
.w48p {width:48%;}
.w45p {width:45%;}
.w40p {width: 40%;}
.w30p {width: 30%;}
.w28p {width:28% !important;}
.w25p {width:25% !important;}
.w20p {width:20% !important;}


.part.col1 { width: 100%; float: none;}
.part.col2,.part-2.col2 { width: 50%;}
.part.col2_2 {}
.part.col3 { width: 33.33%;}
.part.col3-2 { width: 66.66%;}

.pdt20 {padding-top:20px;}

.mr {margin-right:3px;}

/*---------------------------------- button
*/
/* ボタンにカーソルが乗ったら少し薄くする */
a.btn:hover,a.btn-s:hover,a.btn-ss:hover,a.btn-waku-s:hover,a.btn-b:hover,button:hover {opacity: 0.6;}

.bd-blue {border-color: #0071BC !important;}
.bd-red {border-color: #f00 !important;}
.bd-whi {border-color: #fff !important;}
.btn-waku-s {
	box-sizing: border-box; -webkit-box-sizing: border-box;
	padding: 2px 5px;
	display: inline-block;
	font-weight: bold;
	text-decoration: none;
	border: 1px solid #ccc;
	border-radius: 4px; -webkit-border-radius: 4px;
	position: relative;
	text-align: center;
}
.btn-waku-about {
	box-sizing: border-box; -webkit-box-sizing: border-box;
	padding: 5px 20px;
	display: inline-block;
	font-weight: bold;
	text-decoration: none;
	border: 1px solid #ccc;
	border-radius: 30px; -webkit-border-radius: 30px;
	position: relative;
	text-align: center;
}

.btn{
	box-sizing: border-box; -webkit-box-sizing: border-box;
	padding: 2px 15px;
	display: inline-block;
	font-weight: bold;
	text-decoration: none;
	border-radius: 4px; -webkit-border-radius: 4px;
	color:#fff !important;
	position: relative;
	text-align: center;
}
.btn-s{
	box-sizing: border-box; -webkit-box-sizing: border-box;
	padding: 2px 10px;
	display: inline-block;
	font-weight: bold;
	text-decoration: none;
	border-radius: 4px; -webkit-border-radius: 4px;
	color:#fff !important;
	position: relative;
	text-align: center;
}
.btn-ss{
	box-sizing: border-box; -webkit-box-sizing: border-box;
	padding: 2px 5px;
	display: inline-block;
	font-weight: bold;
	text-decoration: none;
	border-radius: 4px; -webkit-border-radius: 4px;
	color:#fff !important;
	position: relative;
	text-align: center;
}
.btn-b{
	box-sizing: border-box; -webkit-box-sizing: border-box;
	padding: 15px 30px;
	display: inline-block;
	font-weight: bold;
	text-decoration: none;
	border-radius: 4px; -webkit-border-radius: 4px;
	color:#fff !important;
	position: relative;
	text-align: center;
}

/* color */
.green {color: #b0d547;}
.purple {color:#bf8ff2;}
.yellow {color:#feca00;}
.pink {color:#f77876;}
.blue {color:#00a3fc;}
.dark_blue {color:#336699;}
.oran {color:#f7931e;}
.orange {color:#F38200;}
.red {color: #f00 !important;}
.whi {color:#fff !important;}
.blu {color:#0071BC;}
.emerald {color:#58BCBC;}
.black {color:#000 !important}

.mat-blue {background:#0071BC ;}
.mat-orange {background:#F7931E ;}
.mat-grey {background:#ccc ;}
.mat-red {background: #f00;}
.mat-black {background: #000;}
.mat-white {background: #fff;}

.arrow::after{
	font-family: "Font Awesome 5 Free";
	content: '\f054';
	position: absolute;
	right: 5px;
}
.cak::before{
	font-family: "Font Awesome 5 Free";
	content: '\f00c';
	position: absolute;
	left: 5px;
}

.pek::before{
	font-family: "Font Awesome 5 Free";
	content: '\f00d';
	position: absolute;
	left: 5px;
}

.sea::before{
	font-family: "Font Awesome 5 Free";
	content: '\f002';
	position: absolute;
	left: 5px;
}

.arrow-down::after{
	font-family: "Font Awesome 5 Free";
	content: '\f078';
	position: absolute;
	right: 5px;
}



/*---------------------------------- stock
*/

.list-box {width:94%; margin: 0 auto; padding: 40px 0; border-bottom: 1px solid #ccc;}
.list-info dt { float: left; width:34.0425531%;}
.list-info dt img {max-width: 100%; height: auto;}
.list-info dd {float:right; width:63.2978723%; /*595*/}

.list-price {width: 100%; letter-spacing: -.4em;}
.list-price li { display: inline-block; /*border: 1px solid #f00;*/ width: 40%; letter-spacing: normal; box-sizing: border-box;}
.list-price li:last-child { text-align: right; width: 19.7%;}
.list-price small {margin-right: 1em; font-size: 1.1rem;}
.list-price strong {color:#f00; font-size: 2.0rem;}

.list-tbl {width: 100%;}
.list-tbl td {text-align: center; background: #F0F4F5; padding: 1em 0; border: 1px solid #ccc; width: 33.3333%;}
.list-tbl td:first-child {border-left:1px solid #F0F4F5;}
.list-tbl td:last-child {border-right:1px solid #F0F4F5;}

/* ----------------------------- 車輌詳細
--*/
.detail-box {width:96%; margin: 0 auto; }
.area_number {width:96%; margin: 20px auto;}
.detail-info dt { float: left; width:55.2083333%; /*530*/ box-sizing: border-box;}

.detail-info dd {float:right; width:42.5%; /*408*/}


.main_thumb {
	margin-bottom: 15px;
	position: relative;
}
.main_thumb .arw_l { position:absolute; top:50%; left:0; margin-top:-20px; display: block !important;}
.main_thumb .arw_r { position:absolute; top:50%; right:0; margin-top:-20px; display: block !important;}

.main_thumb img {max-width:100%; height: auto;}

.sub_thumb {width:100%;}
.sub_thumb li {float:left; width: 19.6226415%;/*106*/ text-align: center; margin:0 0 1px 0;  box-sizing: border-box; padding: 1px;}
.sub_thumb li img {vertical-align: middle; width:100%; height: auto;}
.sub_thumb .active {background: #F38200;}

.price.details ul{display: table; width: 100%;}
.price.details li{display: table-cell;}
.price.details li:last-child{text-align: right;}

.yoyaku-dl dt { float: left; width: 20%; /*border:1px solid #f00;*/ box-sizing: border-box;}
.yoyaku-dl dd {	float: right; width: 80%; /*border:1px solid #f00;*/ box-sizing: border-box;}

.spec-tbl,.sobi-tbl {width: 100%;}
.spec-tbl td { width: 18.3333%;vertical-align: middle;}
.spec-tbl th {background: #F0F4F5; padding: 5px 10px; box-sizing: border-box; width: 15%; height: 53px; vertical-align: middle;}

.sobi-tbl .on { width: 20%;padding: 5px 10px;box-sizing: border-box;background: #F0F4F5;vertical-align: middle;font-weight: bold;color:black}
.sobi-tbl td {width:20%; padding: 5px 10px; box-sizing: border-box; color:#999; vertical-align: middle;}

.yoyaku-2 {display: none;}


/* ----------------------------------area-pagenation
*/
.area-pagenation {
	text-align: center;
	margin: 40px 0 20px;
}
.area-pagenation > a { padding: 0 5px; }
.area-pagenation a {
		display: inline-block;
		text-decoration: none;
}
.area-pagenation button,
.area-pagenation a {
	font-size: 2.0rem;
	color: #1378dc;
	background-color: transparent;
}
.area-pagenation button:hover,
.area-pagenation a:hover {
		color: #333;
		background-color: #cce2f8;
}
.area-pagenation .numberlink {
		display: inline-block;
		text-align: center;
}
.area-pagenation .numberlink > li {
			display: inline-block;
}
.area-pagenation .numberlink > li:not(:first-child) {
			margin-left: 2px;
}
.area-pagenation .numberlink > li button ,
.area-pagenation .numberlink > li a {
				font-size: 1.6rem;
				line-height: 1.9;
				width: 30px;
				border: 1px solid #ccc;
				color: #333;
}
.area-pagenation .numberlink > li button:hover ,
.area-pagenation .numberlink > li a:hover {
				border: 1px solid #99c4f0;
				color: #333;
}
.area-pagenation .numberlink > li.act {
}
.area-pagenation .numberlink > li.act button ,
.area-pagenation .numberlink > li.act a {
				border: 1px solid #99c4f0;
				color: #333;
				background-color: #cce2f8;
}
.area-pagenation .current_page {
    font-size: 1.6rem;
    padding: 3.5px 10px;
    margin: 0px 4px;
    line-height: 1.9;
    width: 30px;
    border: 1px solid #99c4f0;
    color: #333;
    background-color: #cce2f8;
}
.area-pagenation .page_button > a {
    font-size: 1.6rem;
    line-height: 1.9;
    margin: 0px 4px;
    width: 30px;
    border: 1px solid #ccc;
    color: #333;
}



@media screen and (max-width:1024px){
	.header { height: auto;}
	.header-inner{width:100%;}
	.inner {width:100%;}
}
@media screen and (max-width:940px){
	.top-inner {width:100%;}
}
@media screen and (max-width:600px){
	h1 {float:none; }
	.about-live-box {line-height: 1.5; font-size: 1.2rem; text-align: center;}
	.btn_list_price li,.btn_list_body li {font-size: 1.2rem;}
	.btn_list_price li {padding-top: 20px;}
}
@media screen and (max-width:480px){
	.top-L,.top-R {width: 100% !important;}
	.fL.top-L,.fR.top-L {float: none !important;}

	.main-2 {padding:25px 0 60px;}
	.detail-box {width:90%;}


	.list-info dt,.detail-info > dt {float:none; width: 100%; text-align: center; margin-bottom: 10px;}
	.list-info dd,.detail-info > dd {float:none; width: 100%;}
	.list-price li {display: block; width: 100%;}
	.list-price li:nth-child(2) small {margin-right: 3em;}
	.list-price li:last-child {width: 100%;}

	.bx-wrapper {width:90%;}

	.spec-tbl {list-style: none;}
	.spec-tbl th {display: list-item; width: 100%; box-sizing: border-box;vertical-align: middle;}
	.spec-tbl td {display: list-item; width: 100%; box-sizing: border-box;vertical-align: middle;}
}
@media screen and (max-width:320px){
	.btn_list li {width:23%;}
	.btn_list li:nth-child(4n){margin-right: 0;}
	.btn_list li:nth-child(5n){margin-right: 1.1111%/*5px*/;}
}

div.this {
    filter:alpha(opacity=50) !important;
    -moz-opacity: 0.5 !important;
    opacity: 0.5;
    cursor: default !important;
}