@charset "utf-8";

/* html */

body {
	-webkit-text-size-adjust: 100%;
	margin:0px 0px 0px 0px;
	min-width:100%;
	background-color:#FAFAF3;
	font-size:11pt;
	line-height:2.5em;
}

a {
	color:#660000;
}

/* ボタンリセット

input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

*/

td {
	box-sizing: border-box;
}

header {
	box-sizing: border-box;
	width:100%;
	min-width:100%;
	padding:20px 30px 20px 30px;
	background-color:#CBE4E4;
}

dl {
	clear:both;
}

h1 {
	font-size: 15pt;
	font-weight: bold;
}

/*ヘッダー タイトルテキスト*/
h3 {
	margin-top:35px;
	font-size: 36px;
	font-weight: bold;
	text-decoration: none;
	background:none;
}

article {
	padding:0px 340px 20px;
}
article h2 {
	font-size:12pt;
	margin-top:20px;
}
article h4 {
	font-size:12pt;
}
footer {
	font-size:12pt;
	padding:0px 30px 20px 30px;
}

.nowrap {
	white-space:nowrap;
}

/* error & message */
.error {
	color:#FF0000;
}

/*戻るボタン*/
.prevBTN {
	text-align: left;
	font-size: 20px;
}

/* main table */
.tb05 {
	width:100% ;
	min-width:800px;
	margin-top:20px;
/*	background-color:#FFCC99;*/
	font-size:26pt;
	text-align:left;
}
.tb05 th {
	font-weight:normal;
	background-color:#FFCC99;
	text-align:left;
	padding:10px 15px 10px 15px;
}
.tb05 td {
	background-color:#efefef;
	padding:5px 15px 25px 15px;
}
.tb05 dl {
	padding-top:5px;
}
.tb05 dt {
	white-space: nowrap;
	width:130px;
	padding-right:20px;
	float:left;
	margin:0px;
}
.tb05 dd {
	margin:0px 0px 0px 350px;
	padding:0px;
}

/* require */
.require {
	color:#f14a4a;
}

/* form size */
.furigana {
	width:120px;
}
.name {
	width:80px;
}
.email {
	width:360px;
}
.tel {
	width:150px;
}
.r_car01 {
	width:300px;
}
.r_car02 {
	width:80px;
}
.r_car03 {
	width:500px;
	height:80px;
}
.r_car04 {
	width:400px;
	height:80px;
}
.r_car05 {
	width:400px;
	height:180px;
}
.r_car06 {
	width:338px;
}
.weight{
	font-size: 22px;
	font-weight: bold;
	color: #ff690a;
}
.dd01 {
	width:200px;
}
.dd02 {
	margin:-37px 0px 0px 500px !important;
}

/* reserve_calendar */
.tb06 {
	width:100%;
	margin-top:20px;
	background-color:#FFCC99;
	font-weight:normal;
	font-size:11pt;
	text-align:left;
}
.tb06 th {
	font-size:28pt;
	font-weight:normal;
	background-color:#FFE0C1;
	text-align:left;
	padding:5px;
}
.tb06 td {
	font-size:26pt;
	padding:20px;
}
/* 2020.4.29 東口 カレンダーのポップアップ対応 */
.tb06-margin-top-0 {
	margin-top:0px;
}
.tb06-calendar-button {
	text-align:right;
}

/* calendar month */
.cal01 {
	width:9%;
	text-align:center !important;
	background-color:#FFE0C1;
}

/* calendar days */
.cal02 {
	width:11%;
	text-align:center !important;
}

/* calendar times */
.cal03_r {
	text-align:right !important;
	background-color:#FFE0C1;
}

.cal03_l {
	text-align:left !important;
	background-color:#FFE0C1;
}

/* reserve OK */
.cal04 {
	background-color:#fff !important;
}
.cal04 a{
	color:#cc4466 !important;
	text-align:center !important;
	width:100%;
	display:block;
	box-sizing:border-box;
	text-decoration:none;
}
.cal04:hover {
	background-color:#A8D5A8 !important;
	text-decoration:none;
}

/* reserve NG */
.cal05 {
	text-align:center !important;
	background-color:#EBEBEB !important;
}
.cal05 a{
	color:#000 !important;
	text-align:center !important;
	width:100%;
	display:block;
	box-sizing:border-box;
	text-decoration:none;
}

/* reserve TEL */
.cal06 {
	text-align:center !important;
	background-color:#E8F2BF !important;
}
.cal06 a{
	color:#000 !important;
	text-align:center !important;
	width:100%;
	display:block;
	box-sizing:border-box;
	text-decoration:none;

}

/* reserve Kari */
.cal08 {
	text-align:center !important;
	background-color:#EBEBEB !important;
}
.cal08 a{
	color:#000 !important;
	text-align:center !important;
	width:100%;
	display:block;
	box-sizing:border-box;
	text-decoration:none;
}

/* reserve END */
.cal07 {
	text-align:center !important;
	background-color:#EBEBEB !important;
}

/* reserve other */
.centerside {
	text-align:center;
	font-size:1.5vw;
	background: #FFCC99;
	padding: 4px;
}

.saturday {
	color:#000099;
}
.sunday {
	color:#CC0000;
}
.remark {
	color:#FF0000;
}

/* reserve form */
.r_constr_j {
	display:none;
}
.r_contacttime_j {
	display:none;
}





/* ---------------------------------------------------------------------------

 Custom 2018-02-07

------------------------------------------------------------------------------*/


/*車検のカレンダー一番右列を非表示*/
/*th.cal01,
th.cal03_l{ display:none;}*/

/* フォーム関連  */

input[type="text"],
input[type="date"],
select,
textarea{
	border:0;
	padding:3px;
	font-size:1.8vw;
	color:#333;
	border:solid 1px #AAA;
	margin:0 0 3px;
	width:100%;

	
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	
	-moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
	box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
}
select{ padding:5px;}

input:focus,
textarea:focus{
    border:solid 1px #EEA34A;
	padding:3px;
	color:#333;
}

input[type="submit"]{
	display:block;
	width:100%;

	border:solid 3px #FFF;

	padding:3% 5%;
	margin:0 auto 20px auto;
	font-size:1.4vw;
	color:#FFF;

	cursor:pointer;	

	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

	background-color:rgba(0,116,217,1);
	background: rgba(0,116,217,1);
	background: -webkit-linear-gradient(top, rgba(0,116,217,1) 0%, rgba(0,65,122,1) 100%);
	background: linear-gradient(to bottom, rgba(0,116,217,1) 0%, rgba(0,65,122,1) 100%);
	-moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
	}

input[type="submit"]:hover{
	filter:alpha(opacity=70);
	-moz-opacity:0.70;
	opacity:0.70;
	
}
	
.txt_annotation{ font-size:0.8vw;}


/*その他*/



/* ---------------------------------------------------------------------------


下記からユーザー設定（ 変更＆追加分）

------------------------------------------------------------------------------*/


.tire_caption {
	color:#000;
	background:#fc0;
	padding: 10px 0px;
	border-radius: 4px;
	border: 1px solid #d8d8d8;
}

.tire_caption span{
	/* background: linear-gradient(transparent 70%, #fc0 80%); */
}

.reqs{
	padding:10px;
	background:#e1e1e1;
	border:1px solid  #fafaf3;
	text-align:left;
}

.reqtxt{
	font-size:70%;
/*	line-height: 1em;*/
}

.reqtxt span{
	font-weight: bold;
    background: linear-gradient(transparent 60%, #ffff66 60%);
}

.reqtxt2{
	font-size: 14px;
}

.dt_title{
	font-size:120%;
	padding:10px 0;
}

h3 {
	font-size: 25px;
}

.tb05{
	min-width:inherit !important ;
	width:100% !important;
	font-size:1.6vw;
}

.tb05 dt,
.tb05 dd{
	width:auto;
	padding:0 0.5em;
	margin:0px;
	white-space:inherit !important;
}

.thx_txt p{
	font-size:12px;
	line-height: 2em;
}

.first{
	line-height: 1.4em;
}
.first span{
	font-weight: bold;
	background: linear-gradient(transparent 60%, #ffff66 60%);
}

.first .p16{
	font-size: 16px;
}

.first .p12{
	font-size: 12px;
}

/* ------------------------------------------

		CALENDAR

/* --------------------------------------- */
.tb06{
	padding: 0;
}

.tb06 td{
	padding: 0;
}

.tb06 th{
	padding: 0;
}

.tbtitle{
	font-size: 16px;
}



.hd01 p{
	font-size: 20px;
}

.hd01 dl{
    display:flex;
	flex-direction: column;
}

.hd01 dt{
    background:rgb(0 66 124);
	color:#fff;
    font-size:18px;
}

.hd01 dd{
    font-size:18px;
}

.dd02 span{
	font-size: 22px;
	font-weight: bold;
	color: #ff690a;
}

.weight{
	font-size: 22px;
	font-weight: bold;
	color: #ff690a;
}

/*----- TIRE OPTION start -----*/

.tireop{
	background: #00417a;
	color:#fff;
	padding:8px;

}

.tirecbx {
	font-size: 18px;
}

.tirecbx.vertical {
  flex-direction: column;
}

.tirecbx label {
  display: flex;
  position: relative;
}

.tirecbx [type=radio],
.tirecbx [type=checkbox] {
  -webkit-appearance: none;
  -moz-appearance: none;
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

	



/* appearance: none; for IE11 */
_:-ms-lang(x)::-ms-backdrop, .tirecbx [type=radio],
_:-ms-lang(x)::-ms-backdrop, .tirecbx [type=checkbox] {
  visibility: hidden;
}

.tirecbx .cbxbtn {
  z-index: 1;
}

.tirecbx.vertical .cbxbtn {
  width: 100%;
}


.tirecbx :checked + .cbxbtn {
	color: #fff;
	background-color: #53a9ff;
	border: 2px solid #5a9ce9;
}

.tirecbx :disabled + .cbxbtn {
  cursor: not-allowed;
  opacity: .6;
  color: #def;
}

.cbxbtn {
  display: inline-block;
  width:100%;
  padding: 0.4em 1em;
  text-align: left;
  cursor: pointer;
  margin-bottom: 5px;

  color: #5A9CE9;
  background-color: #fff;
  border-radius: 10px;
  border:2px solid #5A9CE9;

}

.tirecbx {

font-size: 16px;

}



.tirecbx_lane {

padding: 20px 0 !important;

}



.tirecbx.vertical {

display: flex;

flex-direction: column;

gap: 12px;

}



.tirecbx label {

display: flex;

align-items: center;

cursor: pointer;

position: relative;

}


/*------ input hidden化 ------*/

.tirecbx [type="checkbox"],

.tirecbx [type="radio"] {

 -webkit-appearance: none;

 -moz-appearance: none;

appearance: none;

position: absolute;

width: 100%;

height: 100%;

margin: 0;

padding: 0;

background: none;

border: none;

cursor: pointer;

}


/*------ IE11対応 ------*/

_:-ms-lang(x)::-ms-backdrop,

.tirecbx [type=radio],

_:-ms-lang(x)::-ms-backdrop,

.tirecbx [type=checkbox] {

visibility: hidden;

}


/*------ cbxbtn ベース ------*/

.cbxbtn {

display: inline-flex;

align-items: center;

gap: 0.6em;

width: 100%;

padding: 0.75em 1em;

font-size: 1rem;

font-weight: bold;

border: 2px solid #ccc;

background-color: #fff;

color: #333;

border-radius: 10px;

transition: all 0.2s ease-in-out;

}


/*------ 常時表示のベース枠 ------*/

.tirecbx input[type="checkbox"] + .cbxbtn::before {

content: "";

display: inline-block;

width: 1.4em;

height: 1.4em;

border: 2px solid #999;

border-radius: 4px;

box-sizing: border-box;

background-color: transparent;

background-repeat: no-repeat;

background-position: center;

background-size: 70%;

flex-shrink: 0;

}


/*------ チェック時：背景にSVGアイコンを表示 ------*/

.tirecbx input[type="checkbox"]:checked + .cbxbtn::before {

border-color: #fff;

background-color: #fff;

background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='%230765d2' d='M6.173 12.127L2.148 8.102l1.414-1.414 2.611 2.611 6.41-6.41 1.414 1.414z'/></svg>");

}


/*------ 無効状態 ------*/

.tirecbx input:disabled + .cbxbtn {

cursor: not-allowed;

opacity: 0.5;

}

/*------ Color Modifiers（必要に応じて） ------*/



.cbxbtn--blue {

border-color: #0073fa;

}

.tirecbx input:checked + .cbxbtn--blue {

background-color: #0059c0;

color: #fff;

}

.tirecbx input:checked + .cbxbtn--blue::before {

color: #fff;

}

/* レーン用 */
.tirecbx_lane{
	clear:both;

	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-pack:distribute;
	justify-content:space-around;
	
	flex-wrap: wrap;
}

.tirecbx_lane label{
	width:48%;
	}
.tirecbx_lane .cbxbtn {
  padding: 0.3em 1em;
  text-align: center;
  margin-bottom: 5px;

}
	
	
/*----- TIRE OPTION end -----*/


	
	
	

/* 表組化する */
.box_form h4{

	background:rgb(0 66 124);
	color:#fff;
	font-size:18px;
	padding: 4px 12px;
}


.box_form p{
	background: #e2e2e2;
	font-size: 20px;
}

.box_form .tb05{
	font-size: 1.4vw;
}

.box_form dl{
	display: flex;
	flex-direction: column;
}

.box_form dt{
	font-size: 1.2vw;
	margin-bottom: 15px;
}

.box_form dd{
	font-size: 1.0vw;
	margin:0;
}

.box_form .require{
	color: #fff;
	background: #f14a4a;
	padding: 0.4em;
	margin-left: 10px;
	font-size: 12px;
}

.box_form span{
/*	font-size: 18px;*/
}

dd.formtwo ul{
    display:flex;
    padding:0;
    list-style:none;
}

dd.formtwo li{
    flex-wrap:wrap;
}

dd.formtwo li:first-child{
    margin-right:20px;
}

dd.reqbg input{
    background: #fff7d7;
}

input[type="date"] {
	font-size: 16px;
	width:100%;
/*  position: relative;
  padding: 0 10px;
  width: 100%;
  height: 46px;
  border: 0;
  background: transparent;
  box-sizing: border-box;
  font-size: 14px;
  color: #999;
  border:solid 1px #AAA;

	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	
	-moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
	box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);

	-webkit-appearance: none;*/
}

input::-webkit-input-placeholder{font-size: 18px;}
input:-moz-placeholder{font-size: 18px;}
input::-moz-placeholder{font-size: 18px;}
input:-ms-input-placeholder{font-size: 18px;}


/*textarea*/
.r_car03 {
	 width:100% !important;
}



.tb06 {
	width:100% !important;
}


.tb06 th,
.tb06 td {
	font-size:1.6vw;
	line-height:1.2em;
}

.cal01,
.cal02{}




.dd01{	width: auto !important;}
.dd02{	margin:0px !important;}


/* ------------------------------------------

for PC

------------------------------------------ */

@media screen and (min-width: 375px) {
  .sp_only{
    display: none;
  }
}

/* ------------------------------------------

for SP

------------------------------------------ */

@media screen and (max-width: 768px) {

article{padding: 0px 0px 20px;}
h3{font-size: 20px;}

select{font-size: 18px;}

input[type="text"]{
	width: 100%;
	box-sizing: border-box;
	padding: 10px;
	font-size: 18px;
}

input[type="submit"]{
	display: block;
	width:100%;
	font-size:4vw;
}

textarea{
	font-size: 18px;
}

.tb05{
	font-size:14px;
	line-height: 1.8em;
}

.dd02 span{
	font-size: 16px;
	font-weight: bold;
	color: #ff690a;
}

.weight{
	font-size: 16px;
	font-weight: bold;
	color: #ff690a;
}

.tb05 td{
	padding: 5px 5px 10px;
}

.tb05 dl{}
.tb05 dt{}
.tb05 dd{}

.tb05 .box_form{}
.tb05 .box_form *{ box-sizing:border-box;}

.centerside{
	font-size:90%;
	background: #FFCC99;
	padding: 4px;
}

td.hd01 {}

.hd01 p{
	font-size: 16px;
}
.hd01 dl{
    display:flex;
	flex-direction: column;
}

.hd01 dt{
    background:rgb(0 66 124);
	color:#fff;
    font-size:16px;
    padding:10px 8px;
}

.hd01 dd{
    font-size:16px;
}

.dt_title{
	font-size:120%;
	padding:10px 0;
}

.reqtxt{
	font-size: 90%;
/*	line-height: 1em;*/
}

.reqtxt span{
	font-weight: bold;
    background: linear-gradient(transparent 60%, #ffff66 60%);
}

.reqtxt2{
	font-size: 14px;
}


/*------ CALENDAR start ------*/
.tb06{
	padding: 0;
}

.tb06 th{
	padding: 0 4;
}

.tb06 td{
	padding: 10px 0;
}

/*--- Year,Month ---*/
.tb06 .cal01{
	font-size: 12px;
}

/*--- Date ---*/
.tb06 .cal02{
	font-size: 12px;
	background: #fff;
}

/*--- Time ---*/
.tb06 .cal03_r{
	font-size: 12px;
	padding-right: 5px;
}

/*--- shuryo,Kyu ---*/
.tb06 .cal07{
	font-size: 12px;
}
/*--- OK ---*/
.tb06 .cal04{
	background:#fff !important;
}

.tb06 .cal04 a{
	font-size: 16px;
}

/*--- blank ---*/
.tb06 .cal05{
	font-size: 14px;
}

/*------ CALENDAR end ------*/

/*------ TIRE OPTION start ------*/


.tirecbx {

font-size: 16px;

}



.tirecbx_lane {

padding: 20px 0 !important;

}



.tirecbx.vertical {

display: flex;

flex-direction: column;

gap: 12px;

}



.tirecbx label {

display: flex;

align-items: center;

cursor: pointer;

position: relative;

}


/*------ input hidden化 ------*/

.tirecbx [type="checkbox"],

.tirecbx [type="radio"] {

 -webkit-appearance: none;

 -moz-appearance: none;

appearance: none;

position: absolute;

width: 100%;

height: 100%;

margin: 0;

padding: 0;

background: none;

border: none;

cursor: pointer;

}


/*------ IE11対応 ------*/

_:-ms-lang(x)::-ms-backdrop,

.tirecbx [type=radio],

_:-ms-lang(x)::-ms-backdrop,

.tirecbx [type=checkbox] {

visibility: hidden;

}


/*------ cbxbtn ベース ------*/

.cbxbtn {

display: inline-flex;

align-items: center;

gap: 0.6em;

width: 100%;

padding: 0.75em 1em;

font-size: 1rem;

font-weight: bold;

border: 2px solid #ccc;

background-color: #fff;

color: #333;

border-radius: 10px;

transition: all 0.2s ease-in-out;

}


/*------ 常時表示のベース枠 ------*/

.tirecbx input[type="checkbox"] + .cbxbtn::before {

content: "";

display: inline-block;

width: 1.4em;

height: 1.4em;

border: 2px solid #999;

border-radius: 4px;

box-sizing: border-box;

background-color: transparent;

background-repeat: no-repeat;

background-position: center;

background-size: 70%;

flex-shrink: 0;

}


/*------ チェック時：背景にSVGアイコンを表示 ------*/

.tirecbx input[type="checkbox"]:checked + .cbxbtn::before {

border-color: #fff;

background-color: #fff;

background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='%230765d2' d='M6.173 12.127L2.148 8.102l1.414-1.414 2.611 2.611 6.41-6.41 1.414 1.414z'/></svg>");

}


/*------ 無効状態 ------*/

.tirecbx input:disabled + .cbxbtn {

cursor: not-allowed;

opacity: 0.5;

}

/*------ Color Modifiers（必要に応じて） ------*/



.cbxbtn--blue {

border-color: #0073fa;

}

.tirecbx input:checked + .cbxbtn--blue {

background-color: #0059c0;

color: #fff;

}

.tirecbx input:checked + .cbxbtn--blue::before {

color: #fff;

}



/*------ TIRE OPTION end ------*/



/*------ FORM start ------*/

.box_form p{
	background: #e2e2e2;
}

.box_form dt{
	font-size: 18px;
	border-left: 3px solid #ff9934;
	padding-left: 15px;
}

.box_form dd{
	font-size: 16px;
}

.box_form dd span{
}

.box_form td{
	padding: 0;
}

.box_form .txt_annotation{
	font-size: 12px;
}

.box_form .require{
	color: #fff;
	background: #f14a4a;
	padding: 0.4em;
	margin-left: 10px;
	font-size: 12px;
}

dd.formtwo ul{
    display:flex;
    padding:0;
    list-style:none;
}

dd.formtwo li{
    flex-wrap:wrap;
}

dd.formtwo li:first-child{
    margin-right:20px;
}

dd.reqbg input{
    background: #fff7d7;
}

input[type="date"] {
  width: 340px;
  height: 46px;
  font-size: 16px;
  box-sizing: border-box;
/*  position: relative;
  padding: 0 10px;
  box-sizing: border-box;
  border: 0;
  color: #333;
  border:solid 1px #AAA;
  background: #fff;

	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	
	-moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
	box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);

	-webkit-appearance: none;*/
}

/*------ FORM end ------*/

.prevBTN{
	font-size: 14px;
	padding: 10px 30px;
	text-decoration:none;
	background: #c13a3a;
	color: #fff;
}

.submitarea{
	text-align: center;
}

/* 20240717 松田追加 */

.cal06 {
	font-size: 16px !important;
}

}