@charset "UTF-8";

#trackseat .itemBtn1,
#aoriseat .itemBtn1,
#nidainet .itemBtn1,
#hoshu .itemBtn1{
border: 1px solid #447ff6;
background: #447ff6;
}
#trackseat .itemBtn1:active,
#aoriseat .itemBtn1:active,
#nidainet .itemBtn1:active,
#hoshu .itemBtn1:active,
#trackseat .itemBtn1:hover,
#aoriseat .itemBtn1:hover,
#nidainet .itemBtn1:hover,
#hoshu .itemBtn1:hover{
border: 1px solid #447ff6;
background: #fff;
color: #447ff6;
}

label img {
	pointer-events: none;
}

/**************************************************************************************************

TOPタブ共通

**************************************************************************************************/
#truck-tab{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
    justify-content: space-between;
-ms-flex-align: end;
    align-items: flex-end;
margin-bottom:20px;
height: 66px;
border-bottom:solid 3px #c8c8c8;
}
#truck-tab li{
-ms-flex-positive: 1;
    flex-grow: 1;
-ms-flex-negative: 1;
    flex-shrink: 1;
width: calc(100% / 5);
}
#truck-tab li a,
#truck-tab li span{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: center;
    justify-content: center;
-ms-flex-align: center;
    align-items: center;
margin:0;
padding: 0;
height: 56px;
border-top:solid 2px #c8c8c8;
border-left:solid 1px #c8c8c8;
border-right:solid 1px #c8c8c8;
border-radius: 8px 8px 0 0;
background:#f0f0f0;
background: linear-gradient(#fff, #f0f0f0);
font-size: 14px;
font-weight:bold;
line-height: 1.2;
text-decoration:none;
text-align:center;
color:#000;
box-sizing: border-box;
}
#truck-tab li:first-child a,
#truck-tab li:first-child span{
border-left:2px solid #c8c8c8;
}
#truck-tab li:last-child a,
#truck-tab li:last-child span{
border-right:2px solid #c8c8c8;
}
#truck-tab li span{
height: 66px;
}
#truck-tab li a:hover,
#truck-tab li span{
opacity:1.0;
color:#fff;
}
#truck-tab li.tr-tab-truck a:hover,
#truck-tab li.tr-tab-truck span{
border-color: #e50112;
background:#e50112;
background: linear-gradient(#f85945, #e50112);
}
#truck-tab li.tr-tab-aori a:hover,
#truck-tab li.tr-tab-aori span{
border-color: #062d87;
background:#062d87;
background: linear-gradient(#1e67bb, #062d87);
}
#truck-tab li.tr-tab-net a:hover,
#truck-tab li.tr-tab-net span{
border-color: #0a5926;
background:#0a5926;
background: linear-gradient(#0a8e36, #0a5926);
}
#truck-tab li.tr-tab-repair a:hover,
#truck-tab li.tr-tab-repair span{
border-color: #f58300;
background:#f58300;
background: linear-gradient(#f8a200, #f58300);
}

/**************************************************************************************************
ttl-truck
**************************************************************************************************/

/*** トラックシート ***/
.ttl-truck{
background: linear-gradient(#f85945, #e50514);
border:solid 2px #e50514;
border-radius: 3px;
line-height:1.5em;
font-size:22px;
color:#fff;
font-weight:bold;
padding: 10px 20px 8px 20px;
margin:60px 0 20px 0;
text-shadow: 1px 1px 0px #000;
}
.ttl-truck span{
font-size:18px;
}
.ttl-truck.ttl-truck-point{
border:solid 3px #fb8306;
background: linear-gradient(#fdc601, #fb8306);
}

/*** アオリシート ***/
.ttl-truck.ttl-truck-aori{
border:solid 2px #062d87;
background: linear-gradient(#1e67bb, #062d87);
}

/*** トラック荷台ネット ***/
.ttl-truck.ttl-truck-nidai{
border:solid 2px #0a5926;
background: linear-gradient(#0a8e36, #0a5926);
}

/*** 補修・修理テープ・ロープ・ゴムバンド ***/
.ttl-truck.ttl-truck-hoshu{
border:solid 2px #f58300;
background: linear-gradient(#f8a200, #f58300);
}

.ttl-truck-sub{
margin: 40px 0 15px 0;
font-size: 21px;
font-weight: bold;
line-height: 1.25;
color:
#000;
}
.ttl-truck-sub + p{
margin: 1em 0;
font-size: 14px;
}

/**************************************************************************************************
truckhoshu-tab
**************************************************************************************************/
.truckhoshu-tab {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin: 20px 0 -40px 0;
}

.truckhoshu-tab > li {
	/* flex-basis: 25%; */
}

.truckhoshu-tab > li > a:link,
.truckhoshu-tab > li > a:visited,
.truckhoshu-tab > li > a:hover,
.truckhoshu-tab > li > a:active {
	display: block;
	width: calc(100% - 30px);
	height: 3em;
	line-height: 3em;
	margin: 0 15px;
	padding: 0 5px 0 15px;
	box-sizing: border-box;
	background: none;
	border-left: 4px solid #efefef;
	font-size: 0.9rem;
	text-decoration: none;
}

.truckhoshu-tab > li > a:hover,
.truckhoshu-tab > li > a:active {
	background: #ffeecc;
	color: #333;
	border-left: 4px solid #f8a200;
}

.truckhoshu-tab > li.current > a {
	pointer-events: none;
	border-left: 4px solid #f8a200;
	color: #333;
}

/**************************************************************************************************
base-content
**************************************************************************************************/
.disp-column{
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
    align-items: center;
margin: 30px 50px 0 50px;
}
.disp-column-img{
-ms-flex-order: 1;
    order: 1;
}
.disp-column-content{
-ms-flex-order: 2;
    order: 2;
padding-left: 30px;
}
.disp-column .ttl-truck-sub{
margin-top: auto;
}

.disp-img-round img{
display: block;
border-radius:8px;
}
.disp-img-round + p{
margin-top:1em;
font-size: 14px;
}

.tr-cards-list{
display:-ms-flexbox;
display:flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
margin: 15px 0;
}
.tr-cards-list li{
margin: 10px;
width: 31%;
width: calc(100% / 3 - 20px);
box-sizing: border-box;
}
.tr-cards-list li .tr-cards{
display:-ms-flexbox;
display:flex;
-ms-flex-direction: column;
    flex-direction: column;
border:1px solid #cdcdcd;
border-radius: 8px;
height: 100%;
}
.tr-cards-list li .tr-cards .tr-cards-ttl{
padding: 15px 15px 10px 15px;
font-size: 18px;
line-height: 1.25;
}
.tr-cards-list li .tr-cards p{
padding: 0 15px 20px 15px;
font-size: 12px;
line-height: 1.4;
}
.tr-cards-list li .tr-cards img{
display: block;
margin-top:auto;
border-radius: 0 0 7px 7px;
}

.tr-type-tbl {
margin: 30px 0;
}
.tr-type-tbl table {
width: 100%;
border-collapse: collapse;
font-size: 13px;
line-height: 1.4;
}
.tr-type-tbl table th {
padding: 4px 5px 4px 8px;
vertical-align: middle;
font-weight: bold;
text-align: center;
box-sizing: border-box;
font-size: 11px;
white-space: nowrap;
}
.tr-type-tbl table td {
padding: 4px 8px;
border-left: solid 1px #ccc;
text-align: center;
vertical-align: middle;
color: #333;
}
.tr-type-tbl table .tr-type-tbl-name td {
font-size: 15px;
font-weight: bold;
line-height: 1.3;
}
.tr-type-tbl table .tr-type-tbl-manufacture {
background: #ffeaec;
}


/**************************************************************************************************

ダンプカー用のアオリシートの生地素材について

**************************************************************************************************/
.tr-spec-tbl{
margin: 30px 0;
}
.tr-spec-tbl table{
width: 100%;
border-collapse: collapse;
font-size: 13px;
line-height: 1.4;
}
.tr-spec-tbl table th{
padding: 8px 10px;
border: solid 1px #ccc;
background: #062d87;
vertical-align: middle;
font-weight: normal;
text-align: center;
box-sizing: border-box;
font-size: 12px;
color: #fff;
}
.tr-spec-tbl table td{
padding: 8px 10px;
border: solid 1px #ccc;
text-align: center;
vertical-align: middle;
color: #333;
}
.tr-spec-tbl table td:first-child {
background: #efefef;
color: #333;
}

.tr-color-list{
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
justify-content: center;
}
.tr-color-list li{
margin:0 10px;
padding: 0;
text-align: center;
box-sizing: border-box;
}
.tr-color-list li p{
margin-top:10px;
}

.tr-case-list{
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
justify-content: center;
}
.tr-case-list li{
margin:0 15px;
padding: 20px;
width:46%;
text-align: center;
border: 5px solid #eee;
border-radius: 3px;
box-sizing: border-box;
}
.tr-case-list li p{
margin-top:10px;
font-weight: bold;
line-height: 1.3;
}
.tr-case-list.tr-case-feature{
margin-top:40px;
}

.tr-case-item{
position: relative;
margin-top: 10px;
font-size: 13px;
line-height: 1.3;
text-align: left;
}
.tr-case-item dt{
margin-bottom: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #ddd;
font-size: 21px;
font-weight: bold;
color:#062d87;
}
.tr-case-item dd{
padding-top: .25em;
}
.tr-case-item-price-size{
position: absolute;
top: 4px;
right: 0;
}
.tr-case-item-price-label{
padding-top: .5em;
font-weight: bold;
}
.tr-case-item-price{
position: absolute;
right: 0;
bottom: -3px;
font-size: 20px;
font-weight: bold;
color: #e50112;
}
.tr-case-item-price span{
padding-left: 0.25em;
font-size: 13px;
font-weight: normal;
color: #666;
}

.tr-aori-outlettxt{
margin-bottom: 1em;
}
.tr-aori-outlet{
margin: 30px 2px 20px 0;
padding: 0 18px 18px 18px;
}
.tr-aori-outletBox{
    margin: 0 21px;
    padding: 20px;
    text-align: center;
    border: 5px solid #eee;
}
.tr-aori-outletBox p{
font-size: 14px;
}
.tr-aori-outletBoxImgL{
display: table-cell;
vertical-align: top;
text-align: right;
padding-right: 28px;
}
.tr-aori-outletBoxImgL img{
border-radius: 4px;
}
.tr-aori-outletBoxCont{
display: table-cell;
vertical-align: top;
width: 320px;
}

.tr-aori-outletBoxCont li{
padding: 40px 0 0;
}
.tr-aori-outletBoxCont li:first-child{
border-bottom: 1px solid #ddd;
padding: 40px 0 40px;
}
.tr-aori-outletBoxCont li dl{
display: flex;
flex-wrap: wrap;
}
.tr-aori-outletBoxCont li dt{
width: 50%;
line-height: 1em;
font-size: 21px;
font-weight: bold;
color: #062d87;
text-align: left;
}
.tr-aori-outletBoxCont li dd{
width: 50%;
line-height: 1em;
font-size: 20px;
font-weight: bold;
color: #e50112;
text-align: right;
}
.tr-aori-outletBoxCont li dd span{
padding-left: 0.25em;
font-size: 13px;
font-weight: normal;
color: #666;
}
.tr-aori-outletBtnBase{
margin: 7px 0 0 0;
}
.tr-aori-outletBtnBase a{
	width: 100%;
	text-align: center;
}

.aori_materialBox{
width:900px;
margin:0;
}

.aori_materialBox .frame{
background:#f8f4ef;
margin:30px 0 0 0;
padding:20px;
}
.aori_materialBox h4{
margin:0 0 15px 5px;
font-size:20px;
line-height:1.1em;
border-left:solid 4px #062d87;
padding:2px 0 0 10px;
color:#000;
}

.aori_materialBox h4 span{
font-size:16px;
}


.aori_materialBox .thumbBox{
display:inline-block;
width:400px;
margin:0 20px 0 5px;
vertical-align:top;
}

.aori_materialBox .infoBox{
display:inline-block;
width:425px;
vertical-align:top;
}



.aori_materialBox .frame table {
	width: 425px;
	font-size:15px;
	line-height:1.6em;
	border-collapse:collapse;
	margin:0;
	background:#fff;
}

.aori_materialBox .frame th {
	font-size:15px;
	line-height:1.4em;
	width:40%;
	vertical-align:middle;
	padding:15px 0;
	font-weight:bold;
	text-align:center;
	border:solid 1px #ccc;
	background:#e6e6e6;
}

.aori_materialBox .frame td {
	font-size:15px;
	line-height:1.4em;
	width:60%;
	text-align:left;
	padding:10px;
	vertical-align:middle;
	border:solid 1px #ccc;
	color:#333;
}

.aori_materialBox .frame td i{
	font-size:18px;
margin:0 10px 0 0 ;
color: #ff7f04;
  background: -webkit-linear-gradient(#ffb76b, #ff7f04);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.aori_materialBox .frame td i.gray{
	font-size:18px;
margin:0 10px 0 0 ;
color: #ccc;
  background: -webkit-linear-gradient(#ccc, #ccc);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}



.aori_materialBox .frame td span{
text-align:center;
font-size:22px;
font-weight:bold;
color:#e50112;
}


.aori_materialBox .frame td span.tax{
font-size:13px;
font-weight:normal;
color:#000;
margin:0;
}

.aori_materialBox .frame .btnColor{
text-align: right;
}



.aori_materialBox .frame .btnColor a{
font-size:14px;
color:#fff;
display:inline-block;
padding: 8px 16px;
margin:10px auto 0 auto;
background-color:#4cbf00;
border-radius:5px;
text-decoration:none;
text-align:center;
line-height: 1;
}
.aori_materialBox .frame .btnColor a:before{
font-family: "Font Awesome 5 Free";
content:'\f002';
padding-right: 0.3em;
font-weight: 900;
}
.aori_materialBox .frame .btnColor a:hover{
opacity:.8;
}

.aori_haba_ttl{
	color: #062d87;
}
.aori_mt0{
	margin-top: 0px;
}
.aori_mt5{
	margin-top: 5px;
}
.aori_mt10{
	margin-top: 10px;
}
.aori_mt20{
	margin-top: 20px;
}
.aori_mb5{
	margin-bottom: 5px;
}
.aori_mb10{
	margin-bottom: 10px;
}
.aori_mb0{
	margin-bottom: 0px;
}
.aori_f14{
	font-size: 14px;
}
.aori_txtL{
	text-align: left;
}

.aori-case-list{
	margin-top: 20px;
}
.aori-case-item{
	margin-top: 0px;
	font-size: 14px;
}
.aori-case-item-price-label{
	margin-top: 10px;
}
.aori-case-item-txt {
	margin-top: 10px;
	line-height: 1.2;
}
.aoriBtnBase{
	margin-bottom: 10px;
}

/**************************************************************************************************

軽トラックシート

**************************************************************************************************/
.contLayoutBox.tr-sheets-spec{
margin-bottom:20px;
}
.tr-sheet-name{
padding: 15px 10px 0 10px;
font-size: 16px;
line-height: 1.4;
font-weight: bold;
text-align: center;
}
.tr-sheet-sup{
padding: 0 10px 10px 10px;
font-size: 12px;
line-height: 1.4;
text-align: center;
color: #666;
}
.tr-sheet-disc{
padding: 0 10px 10px 10px;
font-size: 12px;
line-height: 1.4;
color: #666;
}
.tr-sheet-img{
padding: 0 10px 10px 10px;
text-align: center;
}


/**************************************************************************************************

トラック荷台ネットの素材について

**************************************************************************************************/
.truck-heading-sub {
margin: 30px 15px 2px 15px;
padding: 0 0 5px 0;
border-bottom: 1px solid #ccc;
font-size: 18px;
font-weight: bold;
line-height: 1.25;
color: #444;
}

/* sozai-list */
.sozai-list-wrap{
display: -ms-flexbox;
display: flex;
margin:0 15px;
padding: 20px 0;
border-bottom :1px solid #ccc;
}
.sozai-list-img{
-ms-flex-negative: 0;
    flex-shrink: 0;
-ms-flex-positive: 0;
    flex-grow: 0;
margin-right:20px;
width: 120px;
}
.sozai-list-img a:hover,
.sozai-list-img a:active{
opacity: 0.7;
}
.sozai-list-img img{
display: block;
width: 120px;
border-radius: 3px;
}
.sozai-list-data{
-ms-flex-negative: 1;
    flex-shrink: 1;
-ms-flex-positive: 1;
    flex-grow: 1;
}
.sozai-list-data-wrap{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
    justify-content: space-between;
}
.sozai-list-icon{
margin: 0;
}
.sozai-list-icon ul{
display: -ms-flexbox;
display: flex;
}
.sozai-list-icon ul li{
margin-right: 2px;
}
.sozai-list-icon ul li img{
width: 32px;
}
.sozai-list-data-spec{
display:-ms-flexbox;
display:flex;
-ms-flex-pack: justify;
    justify-content: space-between;
margin-top: 10px;
border-top :1px solid #ddd;
border-bottom :1px solid #ddd;
font-size: 12px;
line-height: 1.4;
}
.sozai-list-data-spec li{
-ms-flex-positive: 1;
    flex-grow: 1;
padding: 0.5em 1em;
border-left :1px solid #ddd;
box-sizing: border-box;
}
.sozai-list-data-spec li:last-child{
margin-right: auto;
padding-right: 1em;
border-right :1px solid #ddd;
}
.sozai-list-data-spec .sozai-data-thickness{
width: 86px;
font-size: 14px;
line-height: 1.2;
font-weight: bold;
color: #000;
}
.sozai-list-data-spec .sozai-data-squares{
width: 60px;
}
.sozai-list-data-spec .sozai-data-price{
width: 108px;
font-size: 14px;
line-height: 1.2;
font-weight: bold;
color: #e60012;
}
.sozai-list-data-color{
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
    align-items: center;
margin-top: 0.5em;
font-size: 12px;
}
.sozai-list-data-color dd{
padding-right: 0.5em;
}
.sozai-list-data-color dd img{
display: block;
border-radius: 20px;
}
.sozai-list-data-note{
margin-top:0.5em;
font-size:12px;
line-height: 1.4;
color: #c00;
}

.sozai-list-data-spec li span{
display:block;
font-size: 10px;
font-weight:bold;
color: #333;
}
.sozai-list-code{
margin-top: 2px;
font-size: 11px;
line-height: 1.3;
color: #999;
}
.sozai-list-name{
font-size: 18px;
line-height: 1.1;
}


.sozai-list-wrap + .tr_selectBox-note{
margin-top: 20px;
}


/**************************************************************************************************

ダンプカー用のアオリシートの標準製作・加工について

**************************************************************************************************/
.aori_standardBox{
width:900px;
margin:0;
}


.aori_standardBox .inner{
margin:0 0 50px 0;
}



.aori_standardBox .thumbBox{
width:350px;
margin:0 20px 0 10px;
display:inline-block;
vertical-align:top;
}

.aori_standardBox .txtBox{
width:500px;
margin:0 10px 0 0;
display:inline-block;
vertical-align:top;
}


/**************************************************************************************************

トラックシートの補修・修理テープ

**************************************************************************************************/
.hoshu_proBox{
margin: 0 0;
}
.hoshu_proBox ul{
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.hoshu_proBox ul li{
padding: 20px;
width:25%;
box-sizing: border-box;
}


.hoshu_proBox .thumbBox img{
width: 100%;
}

.hoshu_proBox h4{
margin: 10px 0 0 0;
padding:0;
font-size:14px;
font-weight: normal;
line-height:1.3;
}
.hoshu_proBox p{
font-size: 12px;
line-height: 1.3;
}
.hoshu_proBox .hoshu-spec-code{
margin-top: 0.25em;
margin-bottom: 0.5em;
font-size: 10px;
line-height: 1;
color:#666;
}
.hoshu_proBox .price{
margin-top: 5px;
font-size:14px;
font-weight:bold;
color:#e50112;
}
.hoshu_proBox .hoshu-spec-list{
position: relative;
margin-top:1.25em;
margin-bottom: .5em;
border: 1px solid #ccc;
border-radius: 3px;
font-size:12px;
color: #666;
}
.hoshu_proBox .hoshu-spec-list span{
position: absolute;
display: inline-block;
padding:0 0.5em;
top:-0.7em;
left:0.5em;
background: #fff;
}
.hoshu_proBox a:hover .hoshu-spec-list span{
background: #f3f3f3;
}
.hoshu_proBox .hoshu-spec-list ol{
margin-top: 0.7em;
padding: 0.25em .5em .5em 1.75em;
}
.hoshu_proBox .hoshu-spec-list ol li{
list-style-type: disc;
padding: initial;
width: auto;
}


.hoshu_proBox a.btnDetail{
font-size:13px;
display: block;
padding: 8px 16px;
margin:10px auto 0 auto;
background:#447ff6;
border-radius:5px;
text-decoration:none;
text-align:center;
line-height: 1;
color:#fff;
}
.hoshu_proBox a.btnDetail:after{
font-family: "Font Awesome 5 Free";
content:'\f054';
padding-left: 1em;
font-weight: 900;
font-size:90%;
}

.hoshu_proBox a.btnDetail:hover {
opacity:.8;
}

.hoshuContactBox{
margin:50px 0 0 0;
padding:25px 15px;
background: #efefef;
}

.hoshuContactBox .contactBtn a{
font-size:20px;
font-weight:bold;
color:#fff;
display:block;
background: linear-gradient(#f85945, #e50514);
border:solid 3px #e50514;
line-height:1.2em;
width:540px;
padding:23px 0 20px 0;
background-color:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
text-decoration:none;
text-align:center;
position:relative;
margin:0 auto;

}


.hoshuContactBox .contactBtn a i{
font-size:25px;
margin:0 10px 0 0;
}


.hoshuContactBox .contactBtn a:hover{
opacity:.8;
}

#truckhoshu .detailTtl h2 {
	border-top: solid 3px #f58300;
}

#truckhoshu .tempComDetailBox .specBox .ttlSpec {
	background: #f58300;
}

.tempComDetailBox .specBox th {
	width: 6em;
}

/**************************************************************************************************

ビニプロのトラックシートが選ばれる理由

**************************************************************************************************/
.tr_reasonBox{
margin:0;
}
.tr_reasonBox ul{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
    justify-content: space-between;
}
.tr_reasonBox ul li{
border:solid 1px #ccc;
width: 33.33%;
width: calc( (100% - 24px) / 3);
box-sizing: border-box;
}
.tr_reasonBox ul li h4 img{
display: block;
padding:1px;
}
.tr_reasonBox p{
font-size:14px;
line-height:1.5em;
padding:15px;
text-align: justify;
}




/**************************************************************************************************

選べるトラックシートの素材・生地

**************************************************************************************************/
.tr_selectBox{
margin: 60px 0 0 0;
width:900px;
}


.tr_selectBox table {
	width: 900px;
font-size: 14px;
	line-height:1.6em;
	border-collapse:collapse;
	margin:30px 0;
}

.tr_selectBox th {
font-size: 14px;
line-height:1.4em;
width:205px;
vertical-align:middle;
padding:15px 0;
font-weight:normal;
text-align:center;
border:solid 1px #ccc;
background: #007a4f;
box-sizing: border-box;
color: #fff;
}
.tr_selectBox th:first-child {
width:80px;
padding:0;
font-size: 13px;
background: #efefef;
color: #333;
}
.tr_selectBox tr:first-child th:first-child{
background: transparent;
border-top: transparent;
border-left: transparent;
}
.tr_selectBox td {
font-size: 14px;
line-height:1.6em;
text-align:center;
padding: 12px 10px;
vertical-align:middle;
border:solid 1px #ccc;
color:#333;
}
.tr_selectBox tr:nth-child(2) td{
vertical-align:top;
}
.tr_selectBox .truck-weight-calc th:first-child{
background: #fee8b8;
}
.tr_selectBox .truck-weight-calc td{
border-bottom: 0 none;
background: #fef9ee;
}
.tr_selectBox .truck-weight-calc.truck-weight-calc-result td{
border-top: 0 none;
border-bottom: solid 1px #ccc;
padding-top: 0;
}


.tr_selectBox td.txtL {
font-size: 13px;
	line-height:1.5;
	text-align:left;
padding: 10px;
	vertical-align: top;
	border:solid 1px #ccc;
	color:#333;
}

.tr_selectBox .tr_selectBox-vtop td{
vertical-align: top;
}
.tr_selectBox .func-icn-list{
display:-ms-flexbox;
display:flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
-ms-flex-pack: center;
    justify-content: center;
}
.tr_selectBox td .func-icn-list li{
margin: 0 2px;
box-sizing: border-box;
}
.tr_selectBox td .func-icn-list li img{
display:block;
width: 32px;
}
.tr_selectBox .tr_selectBox-list{
margin-left: 0.5em;
padding-left: inherit;
font-size: 13px;
line-height: 1.4;
text-align: left;
}
.tr_selectBox td .tr_selectBox-list li{
list-style: inherit;
}

.truck-sheet-gallery{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: initial;
    justify-content: initial;
margin: 6px auto 0 auto;
width: 142px;
}
.truck-sheet-gallery li{
margin: 0 2px 0 0;
width: auto;
}
.truck-sheet-gallery li:last-child{
margin-right:0;
}
.truck-sheet-gallery li a{
border: 3px solid #fff;
border-radius: 6px;
}
.truck-sheet-gallery li a img{
border-radius: 2px;
}
.truck-sheet-gallery li a:hover{
border: 3px solid #447ff6;
}
.truck-sheet-gallery li .colorImgModal{
position: relative;
display:block;
width: 46px;
height: 46px;
background: transparent;
text-align: center;
overflow: inherit;
opacity: 1;
box-sizing: border-box;
}
.truck-sheet-gallery li .colorImgModal:after{
position: absolute;
bottom: -8px;
right: -5px;
content: "\f030";
width: 22px;
height: 22px;
border: 1px solid #000;
border-radius: 10px;
font-family: "Font Awesome 5 Free";
font-size: 13px;
font-weight: 900;
background: rgb(255, 255, 255);
line-height: 20px;
text-align: center;
color: #000;
z-index: 10;
box-sizing: border-box;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
.truck-sheet-gallery li .colorImgModal:hover:after,
.truck-sheet-gallery li .colorImgModal:active:after{
border: 1px solid #447ff6;
color: #447ff6;
}
.truck-sheet-gallery li .colorImgModal:hover img,
.truck-sheet-gallery li .colorImgModal:active img{
opacity: 0.7;
}

.tr_selectBox-balloon{
position: relative;
margin: 0 auto;
}
.tr_selectBox-balloon span{
display: block;
position: absolute;
top: -48px;
left: 50%;
transform: translateX(-50%);
padding: 0 8px;
width: 150px;
font-size: 12px;
font-weight: bold;
line-height: 28px;
border: 1px solid #fb8306;
border-radius: 5px;
background: linear-gradient(#fdc601, #fb8306);
color: #000;
box-sizing: border-box;
box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}
.tr_selectBox-balloon span:before,
.tr_selectBox-balloon span:after{
position: absolute;
left: 50%;
bottom: -16px;
border: solid transparent;
content: '';
height: 0;
width: 0;
border-width: 8px;
}
.tr_selectBox-balloon span:before {
border-top-color: #f51;
margin-top: -8px;
margin-left: -8px;
}
.tr_selectBox-balloon span:after {
top: 27px;
border-top-color: #fb8306;
margin: 0 0 1px -8px;
}


.tr_selectBox .btnBig a{
font-size:14px;
color:#fff;
display:block;
padding: 8px;
margin:10px auto 0 auto;
background-color:#00a0e4;
border-radius:5px;
text-decoration:none;
text-align:center;
line-height: 1;
}

.tr_selectBox .btnBig a:hover{
opacity:.8;
}




.tr_selectBox .btnColor a{
font-size:14px;
color:#fff;
display:block;
padding: 8px;
margin:0 auto;
background-color:#4cbf00;
border-radius:5px;
text-decoration:none;
text-align:center;
line-height: 1;
}

.tr_selectBox .btnBig a:before,
.tr_selectBox .btnColor a:before{
font-family: "Font Awesome 5 Free";
content:'\f002';
padding-right: 0.3em;
color:#fff;
font-weight: 900;
}



.tr_selectBox .btnColor a:hover{
opacity:.8;
}



.tr_selectBox .btnWeight a{
font-size:12px;
color:#000;
display:inline-block;
margin-right:10px;
padding: 7px 10px;
/* border: 1px solid #447ff6; */
background-color:#fb8306;
border-radius:5px;
text-decoration:none;
text-align:center;
line-height: 1;
color:#fff;
box-shadow: 2px 2px 0 0 #c86601;
}
.tr_selectBox .btnWeight a:before{
font-family: "Font Awesome 5 Free";
content:'\f1ec';
padding-right: 0.3em;
font-weight: 900;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}


.tr_selectBox .btnWeight a:hover{
opacity:.8;
}




.tr_selectBox .btnDetail a{
font-size:12px;
color:#fff;
display:inline-block;
margin:0 0 0 1em;
padding: 8px;
background-color:#fbac00;
border-radius:5px;
text-decoration:none;
text-align:center;
line-height: 1;
}
.tr_selectBox .btnDetail a:after{
font-family: "Font Awesome 5 Free";
content:'\f054';
padding-left: 0.5em;
font-weight: 900;
}



.tr_selectBox .btnDetail a:hover{
opacity:.8;
}




.tr_selectBox form input[type=text]{
-webkit-appearance:none;
display:inline-block;
margin:0 3px 0 0;
padding: 8px 8px 4px 8px;
width: 64px;
border:2px solid #ddd;
border-radius:5px;
background-color:#fff;
font-size: 18px;
font-weight: bold;
line-height: 1;
vertical-align: middle;
box-sizing: border-box;
box-shadow: none;
}
.tr_selectBox form input[type=text].truck-weight-result{
border: 0;
border-bottom:1px solid #fb8306;
border-radius:0;
background: #fef9ee;
text-align: right;
}



.tr_selectBox form input[type=text]:focus{
/* background-color:#fff; */
}


.truck-cl-thumb-27color{
	margin-top: 10px;
}
.truck-cl-thumb{
position: relative;
display: -ms-flexbox;
display: flex;
margin-top:0;
-ms-flex-pack: center;
    justify-content: center;
height: 30px;
}
.truck-cl-thumb img{
display: block;
margin: 0 0.25em;
max-width: fit-content;
}
.truck-cl-thumb a{
color: #447ff6;
}
.truck-cl-thumb .colorImgModal{
margin-top: 5px;
width: auto;
height: auto;
background: transparent;
opacity: inherit;
}

.tr_selectBox-note{
font-size: 13px;
line-height: 1.4;
text-align: right;
}
.tr_selectBox-note a{
color: #447ff6;
}

.vpNote dd a{
color: #447ff6;
}


/**************************************************************************************************

トラックシートの選び方

**************************************************************************************************/
.tr_kindBox{
width:900px;
margin:0;
}

.tr_kindBox .frame{
background:#f8f4ef;
margin:0 0 30px 0;
padding:20px;
}


.tr_kindBox .frame .point{
background:#e50112;
background: linear-gradient(#f85945, #e50112);
display:inline-block;
border:solid 2px #e50112;
text-shadow: 1px 1px 0px #000;

font-size:14px;
font-weight:bold;
line-height:1.3em;
color:#fff;
padding:4px 10px 2px 10px;
text-align:center;
margin:0 10px 0 0;
vertical-align:middle;
position:relative;
border-radius: 5px;         /* CSS3 */
	-moz-border-radius: 5px;    /* Firefox */
	-webkit-border-radius: 5px;

}


.tr_kindBox .frame .pointTxt{
display:inline-block;
margin:0;
font-size:15px;
font-weight:bold;
line-height:1.3em;
color:#000;
vertical-align:middle;
}


.tr_kindBox h4{
margin:20px 0 25px 5px;
font-size:20px;
line-height:1.1em;
border-left:solid 4px #e50112;
padding:2px 0 0 10px;
color:#000;
}

.tr_kindBox h4 span{
font-size:16px;
}


.tr_kindBox .thumbBox{
display:inline-block;
width:300px;
margin:0 20px 0 5px;
vertical-align:top;
}

.tr_kindBox .infoBox{
display:inline-block;
width:525px;
background:#fff;
border:solid 1px #ccc;
vertical-align:top;
}



.tr_kindBox .infoBox dl {
border-bottom:solid 1px #ccc;
}


.tr_kindBox .infoBox dl dt {
display:inline-block;
background: #036638;
vertical-align:middle;
width:130px;
font-size:15px;
color:#fff;
text-align:center;
padding:18px 0;
margin:0 15px 0 0;
font-weight:normal;
}


.tr_kindBox .infoBox dl dd {
display:inline-block;
}



.tr_kindBox .infoBox dl dd ul li{
display:inline-block;
background:#eee;
text-align:center;
font-size:12px;
padding:5px 8px;
color:#000;
margin:0 8px 0 0;
border-radius: 5px;         /* CSS3 */
	-moz-border-radius: 5px;    /* Firefox */
	-webkit-border-radius: 5px;

}

.tr_kindBox .infoBox .expBox{
padding:15px;
border-bottom:solid 1px #ccc;
}

.tr_kindBox .infoBox .priceBox {
padding:12px 15px;
}

.tr_kindBox .infoBox .priceBox p{
text-align:center;
font-size:22px;
font-weight:bold;
line-height: 1.3;
color:#e50112;
}


.tr_kindBox .infoBox .priceBox p span{
font-size:15px;
font-weight:bold;
color:#000;
margin:0 5px 0 0;
}


.tr_kindBox .infoBox .priceBox p span.tax{
font-size:15px;
font-weight:bold;
color:#e50112;
margin:0;
}
.tr_kindBox .infoBox .priceBox p span.priceBox-basic{
display: block;
margin:0;
font-size: 12px;
line-height: 1.2;
font-weight: normal;
color: #333;
}



.tr_kindBox .pointBox{
background:#fff;
border-radius: 5px 5px 0 0;
border:solid 1px #e50112;
}


.tr_kindBox .pointBox h5{
text-align:center;
font-size:16px;
font-weight:bold;
color:#e50112;
padding:18px 0 15px 0;
border-radius: 5px 5px 0 0;
border-bottom:solid 1px #e50112;
background:#fce5e7;
/*position:relative;*/
}


.tr_kindBox .pointBox h5:before{
font-family: "Font Awesome 5 Free";
content:'\f06a';
/*position:absolute;*/
color:#e50112;
font-weight: 900;
font-size: 130%;
/*top: 36%;*/
/*left: 154px;*/
padding-right: 5px;
}

.tr_kindBox .pointBox p{
padding:20px;
}


.truck-order-guide{
padding:0 20px;
border: 2px dotted #4e9975;
border-radius: 5px;
background: #eef9f4;
color: #036638;
}
.truck-order-guide-ttl{
margin-top:1.5em;
font-size: 16px;
font-weight: bold;
line-height: 1.4;
}
.truck-order-guide p{
margin-bottom:1.5em;
font-size: 14px;
line-height: 1.4;
color: #036638;
}

.comPriceTtl2.truck-price-ttl{
margin-top: 20px;
margin-bottom: 0;
border: none 0 transparent;
border-radius: 3px 3px 0 0;
background: #036638;
color: #fff;
}
.comPriceTtl2.truck-price-ttl h3{
font-size: 18px;
}
.comPriceTtl2.truck-price-ttl h3 .fa-stack{
height: 36px;
line-height: 36px;
}
.comPriceTtl2.truck-price-ttl h3 small{
font-size: 13px;
font-weight: normal;
}
.comPriceTtl2.truck-price-ttl .comPriceTtl-putIcn{
color: #036638;
}

.truck-price-disp{
padding: 15px 15px 10px 15px;
background: #fff;
font-size:18px;
font-weight: bold;
line-height: 1.3;
}
.truck-price-disp .truck-disp-length{
margin: 0 5px -10px -5px;
}
.truck-price-disp select{
font-size: 16px;
font-family: sans-serif;
font-weight: 700;
color: #447ff6;
line-height: 1.3;
padding: .6em 1.5em .5em .8em;
box-sizing: border-box;
margin: 0 .5em;
border: 1px solid #447ff6;
box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
border-radius: .5em;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
background-color: #f1f8ff;
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	linear-gradient(to bottom, #fff 0%,#f1f8ff 100%);
background-repeat: no-repeat, repeat;
background-position: right .7em top 50%, 0 0;
background-size: .65em auto, 100%;
}
.truck-price-disp select:-ms-expand {
display: none;
}
.truck-price-disp select:hover {
/* border-color: #888; */
}
.truck-price-disp select:focus {
/* border-color: #aaa; */
box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
box-shadow: 0 0 0 3px -moz-mac-focusring;
color: #222;
outline: none;
}
.truck-price-disp select option {
font-weight:normal;
}

.tbl-truck-price{
margin:0;
width: 100%;
border: 1px solid #ccc;
border-collapse: collapse;
background: #fff;
font-size: 12px;
line-height: 1.3;
text-align: center;
word-break: break-all;
}
.tbl-truck-price th {
padding: 8px 10px;
border: 1px solid #ccc;
background-color: #d9edf7;
vertical-align: middle;
text-align: center;
font-weight: bold;
}
.tbl-truck-price tr:first-child th:first-child {
background: #b4dbef;
line-height: 1.3;
text-align: left;
}
.tbl-truck-price td {
padding: 10px;
border: 1px solid #ccc;
vertical-align: middle;
}
.tbl-truck-price tr:nth-child(n + 2) {
display: none;
}


/**************************************************************************************************

ビニプロのトラックシート製作へのこだわり

**************************************************************************************************/
.tr_kodawariBox{
margin:0;
}


.tr_kodawariBox .kodawariFrame{
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
margin:25px 0;
padding-bottom: 25px;
border: 2px solid #fdc601;
border-radius: 5px;
background: linear-gradient(#fef9ee, #fee8b8);
box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.1);
}
.point-massage{
position: absolute;
top: -12px;
right: -12px;
}

.tr_kodawariBox .ttlBox{
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
    align-items: center;
width: 100%;
}

.tr_kodawariBox .ttlBox .point{
-ms-flex-negative: 0;
    flex-shrink: 0;
width:60px;
height:60px;
vertical-align:middle;
background: linear-gradient(#fdc601, #fb8306);
margin:0 15px 0 0;
border-radius: 2px 0 5px 0;
}

.tr_kodawariBox .ttlBox .point p.cap{
font-size: 11px;
text-align:center;
font-weight:normal;
color:#fff;
line-height:1.0em;
margin:7px 0 0 0;
}

.tr_kodawariBox .ttlBox .point p{
font-size:30px;
text-align:center;
line-height:1.2em;
font-weight:bold;
color:#fff;
}


.tr_kodawariBox .ttlBox h4{
display:inline-block;
font-size: 24px;
line-height:1.5em;
vertical-align:middle;
font-weight:bold;
color:#000;
text-shadow: 0.1em 0.1em 2px #fff;
}
.tr_kodawariBox .ttlBox h4 em{
font-size: 28px;
font-weight: bold;
color: #e50112;
}

.tr_kodawariBox .thumbBox{
-ms-flex-positive: 1;
    flex-grow: 1;
-ms-flex-negative: 0;
    flex-shrink: 0;
width: 50%;
text-align: right;
box-sizing: border-box;
}
.tr_kodawariBox .txtBox{
-ms-flex-positive: 1;
    flex-grow: 1;
-ms-flex-negative: 0;
    flex-shrink: 0;
padding-left: 20px;
padding-right: 150px;
width: 50%;
box-sizing: border-box;
}
.tr_kodawariBox .kodawariFrame:last-child .txtBox{
padding-right: 40px;
}




/**************************************************************************************************

トラックシートのオプション加工（特注加工）

**************************************************************************************************/
.tr_optionBox{
margin:0;
}

.tr_optionBox ul{
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
-ms-flex-pack: justify;
    justify-content: space-between;
margin: 20px 0;
}

.tr_optionBox ul li{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
    justify-content: space-between;
margin: 20px 0;
width: 48%;
width: calc( ( 100% - 30px ) / 2);
}

.tr_optionBox ul li div:first-child{
width: 36%;
width: calc( 36% - 5px );
}
.tr_optionBox ul li div:last-child{
width: 62%;
width: calc( 62% - 5px );
}
.tr_optionBox ul li{
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.tr_optionBox h4{
margin:0 0 10px 0;
padding:0 6px 6px 6px;
border-bottom: 1px solid #ccc;
font-size: 14px;
font-weight:bold;
line-height:1.5em;
}


.tr_optionBox p{
font-size: 12px;
line-height: 1.5;
}
.tr_optionBox img{
display: block;
width: 100%;
max-width: 100%;
border-radius: 3px;
}
.tr_optionBox .truck-option-fee{
display: inline-block;
margin-top:0.5em;
padding: 5px 10px;
border: 1px solid #ccc;
border-radius: 3px;
}
.tr_optionBox .truck-option-fee span{
padding-right: 0.2em;
color: #e50112;
}

.tr_optionBox ul li .truck-option-gallery{
-ms-flex-pack: initial;
    justify-content: initial;
margin-top: 8px;
margin-bottom: auto;
margin-left: -3px;
width: 100%;
}
.tr_optionBox ul li .truck-option-gallery li{
margin: 0 2px 0 0;
width: auto;
}
.tr_optionBox ul li .truck-option-gallery li a{
border: 3px solid #fff;
border-radius: 6px;
}
.tr_optionBox ul li .truck-option-gallery li a img{
border-radius: 2px;
}
.tr_optionBox ul li .truck-option-gallery li a:hover{
border: 3px solid #447ff6;
}
.tr_optionBox ul li .truck-option-gallery li .colorImgModal{
position: relative;
display:block;
width: 46px;
height: 46px;
background: transparent;
text-align: center;
overflow: inherit;
opacity: 1;
box-sizing: border-box;
}
.tr_optionBox ul li .truck-option-gallery li .colorImgModal:after{
position: absolute;
bottom: -8px;
right: -5px;
content: "\f030";
width: 22px;
height: 22px;
border: 1px solid #000;
border-radius: 10px;
font-family: "Font Awesome 5 Free";
font-size: 13px;
font-weight: 900;
background: rgb(255, 255, 255);
line-height: 20px;
text-align: center;
color: #000;
z-index: 10;
box-sizing: border-box;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
.tr_optionBox ul li .truck-option-gallery li .colorImgModal:hover:after,
.tr_optionBox ul li .truck-option-gallery li .colorImgModal:active:after{
border: 1px solid #447ff6;
color: #447ff6;
}
.tr_optionBox ul li .truck-option-gallery li .colorImgModal:hover img,
.tr_optionBox ul li .truck-option-gallery li .colorImgModal:active img{
opacity: 0.7;
}








/**************************************************************************************************

カテゴリーバナーリンク

**************************************************************************************************/
.tr-category-links{
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
-ms-flex-pack: justify;
    justify-content: space-between;
margin-top:50px;
}
.tr-category-links li{
margin-top:20px;
}



/**************************************************************************************************

トラックシートのサイズの測り方

**************************************************************************************************/
.tr_sizeBox{
width:900px;
margin:0;
}
.tr_sizeBox .sizeFrame{
padding: 0 10px;
}
.tr_sizeBox .tr_sizeBox-box{
margin: 15px 0 25px 0;
padding:15px 20px;
background: #eef9f4;
border: 1px solid #4e9975;
border-radius: 3px;
}
.tr_sizeBox .tr_sizeBox-box p{
font-size: 14px;
font-weight: bold;
line-height: 1.5;
color: #036638;
}
.tr_sizeBox .tr_sizeBox-box p em{
font-weight: inherit;
color:#cc0000;
}

.tr_sizeBox p em{
font-weight: bold;
color:#cc0000;
}

.tr_sizeBox-label{
margin: 40px 0 15px 0;
font-size: 21px;
font-weight: bold;
line-height: 1;
color: #000;
}
.tr_sizeBox-label span{
padding-left:0.5em;
font-size: 12px;
font-weight: normal;
}
.tr_sizeBox-label-sub{
display: inline-block;
margin: 0;
padding: 0 1em;
background: #4e9975;
border-radius: 12px;
font-size: 12px;
line-height: 24px;
color:#fff;
}
.tr_sizeBox-ill{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
    justify-content: space-around;
margin: 20px 0;
}
.tr_sizeBox-ill li{
width:250px;
width: calc( ( 100% - 70px ) /3);
}
.tr_sizeBox-ill .thumbBox{
margin:15px 0;
}
.tr_sizeBox .tr_sizeBox-ill li p{
font-size:12px;
line-height: 1.5;
}
.tr_sizeBox-redline{
display: inline-block;
padding:0 0.2em;
color:#cc0000;
}
.tr_sizeBox-redline:before{
display: inline-block;
content: '';
margin-right: 0.2em;
border:3px solid #ff0000;
width:15px;
vertical-align: 2px;
}





/**************************************************************************************************

FAX見積用紙（PDF）

**************************************************************************************************/
.tr_faxBox{
margin:0;
}
.tr_faxBox ul{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: center;
    justify-content: center;
}
.tr_faxBox ul li{
margin:0;
padding:0 10px;
text-align: center;
}

.tr_faxBox ul li a{
display: block;
text-decoration: none;
}
.tr_faxBox ul li a:hover img,
.tr_faxBox ul li a:hover p{
opacity: 0.7;
}

.tr_faxBox ul li p{
margin: 10px 0 0 0;
font-size: 0.9rem;
line-height: 1.4em;
text-align: center;
color: #447ff6;
}



.tr_faxBox ul li .faxBtn{
display: inline-block;
margin:10px auto 0 auto;
padding: 8px 12px;
border: 1px solid #447ff6;
border-radius: 4px;
background: #447ff6;
font-size:14px;
color:#fff;
text-align:center;
line-height: 1;
}
.tr_faxBox ul li .faxBtn:before{
font-family: "Font Awesome 5 Free";
content: "\f1c1";
padding-right:0.3em;
font-weight: 900;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
.tr_faxBox ul li .faxBtn:hover{
border: 1px solid #447ff6;
background: #fff;
color: #447ff6;
}







/**************************************************************************************************

決済・納期など

**************************************************************************************************/
.tr_informationBox_tit{
margin: 50px 0 0 0;
padding: 8px 10px;
border-radius: 4px 4px 0 0;
background: #ddd;
font-size: 14px;
line-height: 1.3em;
color: #000;
}
.tr_informationBox_tit i{
width: 1.5em;
}
.tr_informationBox{
border:solid 1px #ddd;
border-top: 0 none;
border-radius: 0 0 4px 4px;
margin:0;
padding:7px 27px;
box-sizing: border-box;
}


.tr_informationBox dl {
margin:20px 0;
}

.tr_informationBox dl dt{
display:inline-block;
width:189px;
vertical-align:top;
margin:0 25px 0 0;
padding: 12px 10px;
border: 1px solid #999;
border-radius: 4px;
font-size:16px;
line-height: 1;
font-weight:normal;
color:#000;
box-sizing: border-box;
}

.tr_informationBox dl dt.info1:before{
font-family: "Font Awesome 5 Free";
content:'\f157';
font-weight: 900;
padding-right: 0.5em;
font-size:110%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}

.tr_informationBox dl dt.info2:before{
font-family: "Font Awesome 5 Free";
content:'\f073';
font-weight: 900;
padding-right: 0.5em;
font-size:110%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}

.tr_informationBox dl dt.info3:before{
font-family: "Font Awesome 5 Free";
content:'\f2f1';
font-weight: 900;
padding-right: 0.5em;
font-size:110%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}

.tr_informationBox dl dt.info4:before{
font-family: "Font Awesome 5 Free";
content:'\f70e';
font-weight: 900;
padding-right: 0.5em;
font-size:110%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}


.tr_informationBox dl dt.info1 .cap{
margin:10px 0 0;
font-size:12px;
font-weight:bold;
line-height:1.3em;
}

.tr_informationBox dl dd{
width:620px;
padding:0;
margin:0;
display:inline-block;
vertical-align:top;
}
.tr_informationBox dl dd p{
margin: 0 auto 1em auto;
font-size: 13px;
line-height: 1.5;
}

.tr_informationBox dl dd.sample{
width:475px;
padding:0;
margin:0 15px 0 0;
display:inline-block;
vertical-align:top;
}

.tr_informationBox dl dd.sampleBtn{
width:124px;
padding:0;
margin:0;
display:inline-block;
vertical-align:top;
}

.tr_informationBox dl dd.sampleBtn a{
font-size:13px;
font-weight:bold;
color:#fff;
display:block;
width:124px;
padding:12px 0 10px 0;
margin:0;
background: linear-gradient(#f85945, #e50514);
border:solid 3px #e50514;

-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
text-decoration:none;
text-align:center;
position:relative;
}



.tr_informationBox dl dd.sampleBtn a:before{
font-family: "Font Awesome 5 Free";
content:'\f054';
position:absolute;
color:#fff;
font-weight: 900;
font-size:70%;
top:30%;
right:10px;
}



.tr_informationBox dl dd.sampleBtn a:hover{
opacity:.8;
}



.tr_informationBox ul li{
background:#fff;
width:200px;
margin:0;
display:inline-block;
}

.tr_informationBox ul li:nth-child(even){
margin:0 10px;
}

.tr_informationBox ul li h4{
background: #efefef;
border-bottom: 1px solid #356503;
font-size:14px;
text-align:center;
font-weight:normal	;
color:#356503;
padding:10px 0 8px 0;
line-height:1.4em;
}

.tr_informationBox ul li p{
font-size:13px;
padding:10px;
line-height:1.4em;
}







.tr_informationBox .attenBox{
background:#fff;
padding:0;
margin:0;
border:0;
}

.tr_informationBox .attenBox h4{
background:#e50112;
font-size:18px;
text-align:center;
font-weight:bold;
color:#fff;
margin:0;
padding:10px 0 8px 0;
line-height:1.4em;
position:relative;
}

.tr_informationBox .attenBox h4:before{
font-family: "Font Awesome 5 Free";
content:'\f06a';
position:absolute;
color:#fff;
font-weight: 900;
font-size:110%;
top:20%;
left:355px;
}


.tr_informationBox .attenBox p{
padding:20px;
}


/**************************************************************************************************

トラックシートの見積依頼

**************************************************************************************************/
.tr_estimateBox{

}

#trackseat .tr_estimateBox h3 {
background: linear-gradient(#f85945, #e50514);
border:solid 3px #e50514;
border-radius: 3px;
line-height:1.0em;
font-size:35px;
text-align:center;
color:#fff;
font-weight:bold;
padding:25px 0 13px 20px;
margin:50px 0 20px 0;
text-shadow: 1px 1px 0px #000;
position:relative;
}

#trackseat .tr_estimateBox h3 span{
font-size:14px;
}


#trackseat .tr_estimateBox h3:after {
border:30px solid transparent;
border-top-color:#e50514;
border-bottom-width:0;
bottom:-30px;
content:"";
display:block;
left:50%;
-webkit-transform: translateX(-50%);
-ms-transform:translateX(-50%);
          transform: translateX(-50%);

position:absolute;
width:0;
}



.tr_estimateBox .ttlBox{
padding:10px;
margin:50px 0 20px 0;
border: solid 1px #ccc;
background: #efefef;
border-radius: 2px;
box-sizing: border-box;
}

.tr_estimateBox .ttlBox .point{
width:55px;
height:55px;
vertical-align:middle;
display:inline-block;
background: linear-gradient(#f85945, #e50514);
margin:0 15px 0 0;
border-radius: 5px;         /* CSS3 */
	-moz-border-radius: 5px;    /* Firefox */
	-webkit-border-radius: 5px;
}

.tr_estimateBox .ttlBox .point p.cap{
font-size:12px;
text-align:center;
font-weight:normal;
color:#fff;
line-height:1.0em;
margin:7px 0 0 0;
}

.tr_estimateBox .ttlBox .point p{
font-size:30px;
text-align:center;
line-height:1.2em;
font-weight:bold;
color:#fff;
}


.tr_estimateBox .ttlBox h4{
font-size:22px;
line-height:1.5em;
vertical-align:middle;
font-weight:bold;
color:#000;
display:inline-block;
}





/**************************************************************************************************

トラック荷台ネットの見積依頼

**************************************************************************************************/
.nidai_estimateBox{

}

#nidainet .nidai_estimateBox h3 {
background: linear-gradient(#0a8e36, #0a5926);
border:solid 3px #0a5926;
border-radius: 3px;
line-height:1.0em;
font-size:35px;
text-align:center;
color:#fff;
font-weight:bold;
padding:25px 0 13px 20px;
margin:50px 0 20px 0;
text-shadow: 1px 1px 0px #000;
position:relative;
}

#nidainet .nidai_estimateBox h3 span{
font-size:14px;
}


#nidainet .nidai_estimateBox h3:after {
border:30px solid transparent;
border-top-color:#0a5926;
border-bottom-width:0;
bottom:-30px;
content:"";
display:block;
left:50%;
-webkit-transform: translateX(-50%);
-ms-transform:translateX(-50%);
          transform: translateX(-50%);

position:absolute;
width:0;
}



.nidai_estimateBox .ttlBox{
padding:10px;
margin:50px 0 20px 0;
border: solid 1px #ccc;
background: #efefef;
border-radius: 2px;
box-sizing: border-box;
}

.nidai_estimateBox .ttlBox .point{
width:55px;
height:55px;
vertical-align:middle;
display:inline-block;
background: linear-gradient(#0a8e36, #0a5926);

margin:0 15px 0 0;
border-radius: 5px;         /* CSS3 */
	-moz-border-radius: 5px;    /* Firefox */
	-webkit-border-radius: 5px;
}

.nidai_estimateBox .ttlBox .point p.cap{
font-size:12px;
text-align:center;
font-weight:normal;
color:#fff;
line-height:1.0em;
margin:7px 0 0 0;
}

.nidai_estimateBox .ttlBox .point p{
font-size:30px;
text-align:center;
line-height:1.2em;
font-weight:bold;
color:#fff;
}


.nidai_estimateBox .ttlBox h4{
font-size:22px;
line-height:1.5em;
vertical-align:middle;
font-weight:bold;
color:#000;
display:inline-block;
}






/**************************************************************************************************

アオリシートの見積依頼

**************************************************************************************************/
.aori_estimateBox{

}

#aoriseat .aori_estimateBox h3 {
background: linear-gradient(#1e67bb, #062d87);
border:solid 3px #062d87;
border-radius: 3px;
line-height:1.0em;
font-size:35px;
text-align:center;
color:#fff;
font-weight:bold;
padding:25px 0 13px 20px;
margin:50px 0 20px 0;
text-shadow: 1px 1px 0px #000;
position:relative;
}

#aoriseat .aori_estimateBox h3 span{
font-size:14px;
}


#aoriseat .aori_estimateBox h3:after {
border:30px solid transparent;
border-top-color:#062d87;
border-bottom-width:0;
bottom:-30px;
content:"";
display:block;
left:50%;
-webkit-transform: translateX(-50%);
-ms-transform:translateX(-50%);
          transform: translateX(-50%);

position:absolute;
width:0;
}



.aori_estimateBox .ttlBox{
padding:10px;
margin:50px 0 20px 0;
border: solid 1px #ccc;
background: #efefef;
border-radius: 2px;
box-sizing: border-box;
}

.aori_estimateBox .ttlBox .point{
width:55px;
height:55px;
vertical-align:middle;
display:inline-block;
background: linear-gradient(#1e67bb, #062d87);

margin:0 15px 0 0;
border-radius: 5px;         /* CSS3 */
	-moz-border-radius: 5px;    /* Firefox */
	-webkit-border-radius: 5px;
}

.aori_estimateBox .ttlBox .point p.cap{
font-size:12px;
text-align:center;
font-weight:normal;
color:#fff;
line-height:1.0em;
margin:7px 0 0 0;
}

.aori_estimateBox .ttlBox .point p{
font-size:30px;
text-align:center;
line-height:1.2em;
font-weight:bold;
color:#fff;
}


.aori_estimateBox .ttlBox h4{
font-size:22px;
line-height:1.5em;
vertical-align:middle;
font-weight:bold;
color:#000;
display:inline-block;
}






/**************************************************************************************************

アオリシートの見積依頼：STEP1お見積の種類をお選びください

**************************************************************************************************/
/***   ラジオボタン ***/
.aori_estStep1 ul{
text-align:center;
}

.aori_estStep1 ul li{
display:inline-block;
margin:0 20px 0 0;
}


.aori_estStep1 ul li:nth-child(even){
display:inline-block;
margin:0;
}


.aori_estStep1 input[type=radio] {
display: none;
}


.aori_estStep1 label{
text-align:left;
padding:0;
margin: 0;
border: 5px solid #efefef;
border-radius: 8px;
background: #efefef;
  }


.aori_estStep1 input[type=radio]:checked + label{
text-align:left;
padding:0;
margin: 0;
border: 5px solid #447ff6;
background: #447ff6;
   }
.aori_estStep1 label img {
display: block;
border-radius: 4px;
}
.aori_estStep1 label:hover img {
opacity: 0.8;
}




/**************************************************************************************************

トラックシートの見積依頼：STEP1トラックシートの素材をお選びください

**************************************************************************************************/
.tr_estStep1{
display: -ms-flexbox;
display: flex;
margin: 30px 0;
height: 100%;
}
.aori_estimateBox .tr_estStep1{
-ms-flex-pack: center;
    justify-content: center;
}
.tr_estStep1 .frame{
margin:0 12px 0 0;
padding:0;
width: calc( ( 100% - 36px) / 4);
}
.tr_estStep1 .frame:nth-child(4n){
margin:0;
}

.nidai_estimateBox .tr_estStep1{
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.nidai_estimateBox .tr_estStep1 .frame{
margin: 0 12px 12px 0;
}
.nidai_estimateBox .tr_estStep1 .frame:nth-child(4n){
margin: 0 0 12px 0;
}


.truck-check-item{
position: relative;
display: block;
height: 100%;
background: transparent;
padding:20px 15px;
border: 5px solid #efefef;
border-radius: 8px;
text-align: center;
box-sizing: border-box;
cursor: pointer;
}
.truck-check-item .thumb{
margin-top:2em;
display: block;
}
.truck-check-item .gom_need{
    margin: 2em auto 0;
    max-width: 120px;
}
.truck-check-item h4{
margin-top: 0.8em;
font-size:16px;
line-height: 1.3;
}
.nidai_estimateBox .truck-check-item h4{
font-size: 15px;
}
.truck-check-item ul{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
    justify-content: space-between;
margin:1em 0;
font-size: 12px;
}
.truck-check-item ul li{
padding: 0.5em 0.8em;
width: calc( ( 100% - 10px) / 2);
border: 1px solid #ddd;
border-radius: 3px;
box-sizing: border-box;
}
.truck-check-item ul li span{
display: block;
margin: 0 -0.8em 0.5em -0.8em;
padding-bottom: 0.5em;
border-bottom: 1px solid #ddd;
}
.truck-check-item .price{
margin:1em 0;
font-size: 13px;
font-weight: bold;
color: #e50112;
}
.truck-check-item .price span{
padding-left: .3em;
font-size: 11px;
font-weight: normal;
color:#333;
}


/***   チェックボックス ***/
.check {
display: none; /* まず、＜input＞タグの表示を消します*/
}
.check + .truck-check-item span:before,/* ＜span＞タグの疑似要素を作ります*/
.check + .truck-check-item span:after {
position: absolute;
content: '';
top: 20px;
left: 50%;
transform: translate(0, -50%);
border-radius:3px;
-webkit-transition: all .2s;
transition: all .2s;
}
.check + .truck-check-item span:before {
left: 50%;
width: 20px;
height: 20px;
margin-left: -10px;
background: #fff;/* ラジオボタンの元の色の指定*/
border: 1px solid #999;
}
.check + .truck-check-item span:hover:before {
background: #fff;/* ラジオボタンのマウスオーバーしたときの色の指定*/
}
.check + .truck-check-item span:after {
opacity: 0;
left: 50%;
width: 14px;
height: 14px;
margin-top: -8px;
margin-left: -6px;
transform: translate(0, -50%);

font-size: 15px;
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f00c";
line-height: 1;
-moz-osx-font-smoothing:grayscale;
-webkit-font-smoothing:antialiased;
color:#447ff6;

-webkit-transform: scale(2);
transform: scale(2);
}
.check:checked + .truck-check-item span:before {/* ラジオボタンがチェックされたときの隣接しているタグへの指示を書きます*/
background: #fff;
border: 1px solid #447ff6;/* ラジオボタンのチェックした時の枠の線の指定*/
}
.check:checked + .truck-check-item span:after {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}

.check:checked + .truck-check-item{
border: 5px solid #447ff6;
background: #f1f8ff;
}


.tr_estStep1 .frame ul li h4{
font-size:17px;
line-height:1.3em;
border-left:solid 3px #e50112;
padding:2px 0 0 8px;
color:#000;
margin:5px 0 20px 0;
}

.tr_estStep1 .frame ul li h4.aori{
font-size:17px;
line-height:1.3em;
border-left:solid 3px #062d87;
padding:2px 0 0 8px;
color:#000;
margin:5px 0 20px 0;
}


.tr_estStep1 .frame ul li h4.nidai{
font-size:17px;
line-height:1.3em;
border-left:solid 3px #0a5926;
padding:2px 0 0 8px;
color:#000;
margin:5px 0 20px 0;
}



.tr_estStep1 .frame table {
	width: 100%;
	font-size:15px;
	line-height:1.6em;
	border-collapse:collapse;
	margin:20px 0 0;
	background:#fff;
}

.tr_estStep1 .frame th {
	font-size:13px;
	line-height:1.4em;
	width:25%;
	vertical-align:middle;
	padding:5px 0;
	font-weight:bold;
	text-align:center;
	border:solid 1px #ccc;
	background:#e6e6e6;
}

.tr_estStep1 .frame td {
	font-size:13px;
	width:25%;
	line-height:1.6em;
	text-align:center;
	padding:5px 0;
	vertical-align:middle;
	border:solid 1px #ccc;
	color:#333;
}

.tr_estStep1 .frame td.price {
	font-size:16px;
	width:100%;
	color:#e50112;
	line-height:1.6em;
	text-align:center;
	font-weight:bold;
	padding:5px 0;
	vertical-align:middle;
	border:solid 1px #ccc;
}


.tr_estStep1 .frame td.price span{
	font-size:13px;
}



.tr_estStep1 .btnColor a{
font-size:13px;
color:#fff;
display:block;
padding:8px;
margin:15px 0 0 70px;
background-color:#4cbf00;
border-radius:5px;
text-decoration:none;
text-align:center;
line-height: 1;
}



.tr_estStep1 .btnColor a:before{
font-family: "Font Awesome 5 Free";
content:'\f002';
padding-right:0.3em;
font-weight: 900;
}



.tr_estStep1 .btnColor a:hover{
opacity:.8;
}





/**************************************************************************************************

トラックシートの見積依頼：STEP2トラックシートのサイズをご入力下さい。

**************************************************************************************************/
.tr_estStep2{
padding: 0 30px;
text-align: center;
}
.tr_estStep2-measurement{
margin-top: 35px;
border-bottom: 1px solid #ccc;
}
.tr_estStep2 ul{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
    justify-content: space-between;
padding: 15px;
}

.tr_estStep2 li{
position: relative;
padding: 20px;
text-align: left;
}
.tr_estStep2 li div,
.tr_aoriStep4 li div,
.tr_estStep4 li div{
margin-bottom:10px;
font-size: 18px;
font-weight: bold;
line-height: 1;
}

.tr_estStep2-note{
padding: 20px 35px;
border-top: 1px solid #ccc;
}
.tr_estStep2-note p{
font-size: 14px;
text-align: left;
color: #666;
}
.tr_estStep2-note p a{
color: #447ff6;
}
.estStep2-aoriheight-note{
margin-top: -15px;
margin-bottom: 20px;
padding:0 35px;
}
.estStep2-aoriheight-note p{
margin: .25em 0 .25em 1em;
font-size: .87rem;
line-height: 1.5;
text-align: left;
text-indent: -1em;
color: #e50112;
}

.tr_estStep2 ul li input[type=text],
.tr_aoriStep4 ul li input[type=text],
.tr_estStep4 ul li input[type=text],
.tr_aoriStep4 ul li input[type=text]{
width: 140px;
height: 54px;
line-height: 54px;
padding: 0.3em 0.25em 0.3em 1em;
border: 5px solid #efefef;
border-right:none;
border-radius: 8px 0 0 8px;
font-size: 20px;
font-weight: bold;
text-align: center;
vertical-align: middle;
box-shadow: none;
box-sizing: border-box;
}
.tr_estStep2 ul li input[type="text"]:focus,
.tr_estStep4 ul li input[type="text"]:focus,
.tr_aoriStep4 ul li input[type="text"]:focus{
border-color:#447ff6;
background: #f1f8ff;
}
.truck-input-unit{
display: inline-block;
width: 54px;
height: 54px;
line-height: 38px;
padding: 0.3em 1em 0.3em 0;
border: 5px solid #efefef;
border-left:none;
border-radius: 0 8px 8px 0;
font-size: 16px;
text-align: center;
vertical-align: middle;
box-sizing: border-box;
}
.tr_estStep2 ul li input[type="text"]:focus + .truck-input-unit,
.tr_estStep4 ul li input[type="text"]:focus + .truck-input-unit,
.tr_aoriStep4 ul li input[type="text"]:focus + .truck-input-unit{
border-color:#447ff6;
background: #f1f8ff;
}
.tr_estStep2 ul li.truck-input-invalid input[type="text"],
.tr_estStep2 ul li.truck-input-invalid .truck-input-unit,
.tr_estStep2 ul li.truck-input-invalid input[type="text"]:focus,
.tr_estStep2 ul li.truck-input-invalid input[type="text"]:focus + .truck-input-unit,
.tr_estStep4 ul li.truck-input-invalid input[type="text"],
.tr_estStep4 ul li.truck-input-invalid .truck-input-unit,
.tr_estStep4 ul li.truck-input-invalid input[type="text"]:focus,
.tr_estStep4 ul li.truck-input-invalid input[type="text"]:focus + .truck-input-unit,
.tr_aoriStep4 ul li.truck-input-invalid input[type="text"],
.tr_aoriStep4 ul li.truck-input-invalid .truck-input-unit,
.tr_aoriStep4 ul li.truck-input-invalid input[type="text"]:focus,
.tr_aoriStep4 ul li.truck-input-invalid input[type="text"]:focus + .truck-input-unit{
border-color: #e60012;
background: #fff2f4;
}

.truck-invalid-balloon{
display: none;
position: absolute;
top: -6px;
left: 21px;
padding: 8px;
width: 190px;
font-size: 12px;
line-height: 16px;
border-radius: 5px;
background: #e60012;
color: #fff;
box-sizing: border-box;
box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
-webkit-animation: fadeIn 300ms ease 0s;
        animation: fadeIn 300ms ease 0s;
}
.truck-input-invalid .truck-invalid-balloon{
display: flex;
display: -ms-flexbox;
}
@keyframes fadeIn{
    0% {
    opacity: 0;
    margin-top: 15px;
    }
    1% {
    opacity: 0;
    margin-top: 15px;
    }
    100% {
    opacity: 1;
    margin-top: 0;
    }
}
.truck-invalid-balloon i{
margin-top: 0.1em;
padding-right: 0.25em;
}
.truck-invalid-balloon:before{
position: absolute;
left: 50%;
bottom: -16px;
border: solid transparent;
content: '';
height: 0;
width: 0;
border-width: 8px;
}
.truck-invalid-balloon:before{
border-top-color: #e60012;
margin-top: -8px;
margin-left: -8px;
}

.tr_estStep2 ul li.faxBtn a{
font-size:15px;
font-weight:bold;
color:#000;
display:block;
width:250px;
padding:23px 0 20px 50px;
background-color:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
position:relative;
border:solid 1px #646464;
text-decoration:none;
 }


.tr_estStep2 ul li.faxBtn a:before{
font-family: "Font Awesome 5 Free";
content:'\f1c1';
position:absolute;
color:#d32d25;
font-weight: 900;
font-size: 160%;
top:38%;
left:15px;
}



.tr_estStep2 ul li.faxBtn a:after{
font-family: "Font Awesome 5 Free";
content:'\f054';
position:absolute;
color:#9f9f9f;
font-weight: 900;
font-size: 90%;
top:38%;
right:12px;
}





.tr_estStep2 ul li.contactBtn a{
font-size:15px;
font-weight:bold;
color:#fff;
display:block;
width:250px;
padding:23px 0 20px 50px;
background-color:#e50112;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
position:relative;
border:solid 1px #e50112;
text-decoration:none;
 }


.tr_estStep2 ul li.contactBtn a:before{
font-family: "Font Awesome 5 Free";
content:'\f0e0';
position:absolute;
color:#fff;
font-weight: 900;
font-size: 160%;
top:38%;
left:15px;
}



.tr_estStep2 ul li.contactBtn a:after{
font-family: "Font Awesome 5 Free";
content:'\f054';
position:absolute;
color:#fff;
font-weight: 900;
font-size: 90%;
top:38%;
right:12px;
}


.tr_estStep2 ul li a:hover{
opacity:.8;
}

/**************************************************************************************************

トラックシートのオプション加工をお選び下さい：STEP3

**************************************************************************************************/

.tr_estStep3 .frame{
margin:30px 0;
}
.tr_estStep3 .frame dl{
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
    align-items: center;
flex-wrap: wrap;
justify-content: flex-start;
padding-bottom: 20px;
border-bottom: 2px dotted #ccc;
}
.tr_estStep3 .frame:last-child dl{
padding-bottom: 0;
border-bottom: none;
}
.tr_estStep3 .frame dl dt{
width: 34%;
}
.tr_estStep3 .frame dl dd{
width: 22%;
text-align: center;
}
.tr_estStep3 .frame dl dt h5{
font-size: 18px;
font-weight:bold;
line-height:1.4em;
}
.tr_estStep3 .frame dl dt .hatena{
margin-top: 0.5em;
}

.tr_estStep3 .frame dl dd p{
display: inline-block;
margin: 0.5em 1em 0 1em;
padding: 5px .8em;
border-radius: 12px;
background: #f8f8f8;
font-size:14px;
line-height: 1;
color: #999;
}
.tr-estStep3-note{
margin: 0.5em 4em 0 0;
padding: 0.8em;
border: 1px dotted #c00;
border-radius: 2px;
font-size: 11px;
color: #c00;
}


/***   ラジオボタン ***/
.tr_estStep3 input[type=radio] {
display: none;
}

.tr_estStep3 label{
display: inline-block;
text-align:left;
padding:0;
margin: 0 1em;
border: 5px solid #efefef;/* ラベルの境界線を実線で指定する */
border-radius: 8px;
background: #efefef;
cursor: pointer;
}
.tr_estStep3 label img{
display: block;
border-radius: 4px;
}
.tr_estStep3 label:hover img{
opacity: 0.8;
}


.tr_estStep3 input[type=radio]:checked + label{
border: 5px solid #447ff6;
background: #447ff6;
}

.tr_estStep3 input[type=radio]:checked + label + p{
background: #447ff6;
color: #fff;
}

/**************************************************************************************************

ハトメピッチを入力してください：STEP4

**************************************************************************************************/
/*アオリシート*/
.tr_aoriStep4 {
	display: flex;
	width: 100%;
}
.tr_aoriStep4 > div:first-child {
	border: 0;
	flex-basis: 72%;
}
.tr_aoriStep4 > div:last-child ul {
    display: block;
    padding-left: 1.5em;
}
.tr_aoriStep4 > div:last-child li {
    padding-top: 2em;
}
.tr_aoriStep4 > div:first-child img {
	display: block;
	width: 100%;
	margin: 1em 0 0 0;
}
.tr_aoriStep4 label[for="hatomeA"] {
	margin-bottom: 0.5em;
}
.tr_aoriStep4 label[for^="hatomeA"] {
    display: block;
    height: auto;
    padding: 0.5em 0.5em 0.5em 2.5em;
    border: 0;
    border-radius: 0;
    text-align: left;
    font-size: 1rem;
    font-weight: normal;
}


/*トラック・荷台*/
.tr_estStep4 {
	display: flex;
	width: 100%;
}

.tr_estStep4 .frame{
margin:0 12px 0 0;
padding:0;
width: calc( ( 100% - 36px) / 4);
}
.tr_estStep4 .frame:nth-child(4n){
margin:0;
}


.tr_estStep4 > div:first-child img {
	display: block;
	width: 100%;
	margin: 1em 0 0 0;
}

.tr_estStep4 > div:last-child ul {
	display: block;
	padding-left: 1.5em;
}

.tr_estStep4 > div:last-child li {
	padding-top: 2em;
}

.tr_estStep4 label[for="hatomeA"] {
	margin-bottom: 0.5em;
}

.tr_estStep4 label[for^="hatomeA"] {
	display: block;
	height: auto;
	padding: 0.5em 0.5em 0.5em 2.5em;
	border: 0;
	border-radius: 0;
	text-align: left;
	font-size: 1rem;
	font-weight: normal;
}

.check + .truck-check-item[for^="hatomeA"]:hover,
.check:checked + .truck-check-item[for^="hatomeA"]:hover {
	background: #f1f8ff;
}

.check + .truck-check-item[for^="hatomeA"] span:before,
.check + .truck-check-item[for^="hatomeA"] span:after {
	top: 1.1em;
	left: 0.5em;
}

.check + .truck-check-item[for^="hatomeA"] span:before {
	margin-left: 0;
}
.check + .truck-check-item[for^="hatomeA"] span:after {
	margin-top: 0;
	margin-left: 0.3em;
	transform: translate(0, -50%);
}
.check:checked + .truck-check-item[for^="hatomeA"]{
	border: 0;
	background: none;
}

.truck-input-unit {
	font-weight: normal;
}


/**************************************************************************************************

tooltip

**************************************************************************************************/

/* tooltip */
/* button */

.hatena{
position:relative;
	display: inline-block;
vertical-align:middle;
}

.hatena button {
	cursor: pointer;
	outline: none;
	padding: 0;
	border: none;
	background: transparent;
	transition: opacity 0.2s 0s ease;
}

.hatena button:hover {
	opacity: 0.6;
}

.hatena button[disabled="disabled"] {
	pointer-events: none;
	color: #fff;
	background: #c8c8c8;
	border: 1px solid #c8c8c8;
}


.tooltip-open {
	top: 50%;
	right: 0;
	display: inline-block;
	height: 2em;
	line-height: 2em;
	margin: -1em 0 0 0;
	padding: 0 0 0.2em 0;
	color: #447ff6;
	font-size:115%;
	border-radius: 4px;
	text-align: center;
	text-decoration: underline;
}


.tooltip-open i {
	margin: 0 0.2em 0 0;
}

.tooltip-close-times {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	width: 2em;
	height: 2em;
	line-height: 2em;
	color: #666;
	font-size: 1.4rem;
}

.tooltip-close-text {
	display: block;
	width: 100%;
	height: 3em;
	line-height: 3em;
	border-top: 1px solid #e8e8e8;
	color: #666;
	font-size: 1rem;
}

.tooltip-close-text i {
	margin: 0 10px 0 0;
}

.tooltip-wrapper {
	position: absolute;
	top: 15px;
	left: -170px;
	width: 800px;
	display: none;
	margin: 2em 0 0 0;
	padding: 40px 0 0 0;
	border: 2px solid #447ff6;
	border-radius: 6px;
	background: #fff;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	opacity: 0;
	z-index: -1;
	animation: none;
}

.tooltip-wrapper.open {
	display: block;
	opacity: 1;
	margin: 1.2em 0 0 0;
	z-index: 10000;
	-webkit-animation: tooltip 0.3s ease-out 0s forwards;
	animation: tooltip 0.3s ease-out 0s forwards;
}

@keyframes tooltip {
	0%{
		display: none;
		opacity: 0;
		margin: 2em 0 0 0;
		z-index: -1;
	}
	0.1%{
		display: block;
		opacity: 0;
		margin: 2em 0 0 0;
		z-index: 10000;
	}
	99%,to{
		display: block;
		opacity: 1;
		margin: 1.2em 0 0 0;
		z-index: 10000;
	}
}

.tooltip-wrapper:before {
	content: "";
	position: absolute;
	top: -9px;
	left: 185px;
	display: block;
	width: 12px;
	height: 12px;
	background: #fff;
	border-top: 2px solid #447ff6;
	border-left: 2px solid #447ff6;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.tooltip-inner {
	overflow-y: auto;
	max-height: 500px;
	padding: 0 20px;
}

.tooltip-inner .flex {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
-ms-flex-pack: justify;
    justify-content: space-between;
-ms-flex-align: start;
    align-items: flex-start;
padding: 0;
}

.tooltip-inner .flex > p {
	max-width: 50%;
	flex-grow: 1;
	padding: 10px;
	box-sizing: border-box;
}

.tooltip-inner .flex img {
	max-width: 360px;
}

.tooltip-inner p {
	margin: 0 0 10px 0;
}

.tooltip-inner img {
	display: inline-block;
	max-width: 100%;
	margin: 10px auto;
}

.tooltip-inner img.center {
	display: block;
	max-width: 50%;
}

tooltip {
	cursor: pointer;
	font-size: 0.8rem;
}

.tooltip .fa-question-circle {
	color: #4E9BD5;
	font-size: 1rem;
}


.tr_estimateBox .step-note,
.aori_estimateBox .step-note,
.nidai_estimateBox .step-note{
font-size: 13px;
line-height: 1.4;
text-align: right;
}



.tr_estContactBox{
margin:50px 0 0 0;
background:#e6e6e6;
padding:25px 15px
}

.tr_estContactBox .contactBtn{
}


.tr_estContactBox .contactBtn a{
font-size:20px;
font-weight:bold;
color:#fff;
display:block;
background: linear-gradient(#f85945, #e50514);
border:solid 3px #e50514;
line-height:1.2em;
width:540px;
padding:23px 0 20px 0;
background-color:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
text-decoration:none;
text-align:center;
position:relative;
margin:0 auto;

}


.tr_estContactBox .contactBtn a:before{
font-family: "Font Awesome 5 Free";
content:'\f138';
position:absolute;
color:#fff;
font-weight: 900;
font-size: 130%;
top:38%;
left:40px;
}


.tr_estContactBox .contactBtn a:hover{
opacity:.8;
}



.tr_estContactBox .contactBtn a span{
font-size:14px;
font-weight: normal;
}




/***   セレクトボックス ***/
.tr_estimateBox select, .aori_estimateBox select, .nidai_estimateBox select{
width:100%;
height:auto;
padding:5px;
border:1px solid #999;
border-radius:3px;
font-size: 13px;
line-height: 1;
}







/***   チェックボックス ***/
.check {
        display: none; /* まず、＜input＞タグの表示を消します*/
    }
    label {
        position: relative;/* ＜label＞を位置の指標になる指示を書きます*/
        display: inline-block;
        padding: 3px 3px 3px 30px;
        cursor: pointer;
    }
    .check+span:before,/* ＜span＞タグの疑似要素を作ります*/
    .check+span:after {
        position: absolute;
        content: '';
        top: 50%;
border-radius:3px;
        -webkit-transition: all .2s;
        transition: all .2s;
    }
    .check+span:before {
        left: 0;
        width: 20px;
        height: 20px;
        margin-top: -10px;
        background: #fff;/* ラジオボタンの元の色の指定*/
        border: 1px solid #555;
    }
    .check+span:hover:before {
        background: #fff;/* ラジオボタンのマウスオーバーしたときの色の指定*/
    }
    .check+span:after {
        opacity: 0;
        left: 4px;
        width: 14px;
        height: 14px;
        margin-top: -6px;
        background: #f50000;/* ラジオボタンのチェックした時の色の指定*/
        -webkit-transform: scale(2);
        transform: scale(2);
    }
    .check:checked + span::before {/* ラジオボタンがチェックされたときの隣接しているタグへの指示を書きます*/
        background: #fff;
        border: 1px solid #f50000;/* ラジオボタンのチェックした時の枠の線の指定*/
    }
    .check:checked + span:after {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
}

















/**************************************************************************************************

トラックシートのよくある質問

**************************************************************************************************/

.trTtl{
border-top:solid 3px #e50112;
border-bottom:solid 1px #ccc;
padding:25px 0 15px 0;
margin: 80px 0 10px 0;
}

.trTtl h3,
.trTtl h4{
font-size:24px;
text-align:center;
font-weight:bold;
line-height:1.2em;
color:#000;
background:#fff;
}

.trTtl h3 span,
.trTtl h4 span{
font-size:15px;
color:#e50112;
}



.aoriTtl{
border-top:solid 3px #062d87;
border-bottom:solid 1px #ccc;
padding:25px 0 15px 0;
margin:80px 0 10px 0;
}

.aoriTtl h4{
font-size:24px;
text-align:center;
font-weight:bold;
line-height:1.2em;
color:#000;
background:#fff;
}

.aoriTtl h4 span{
font-size:15px;
color:#062d87;
}



.nidaiTtl{
border-top:solid 3px #0a5926;
border-bottom:solid 1px #ccc;
padding:25px 0 15px 0;
margin:80px 0 10px 0;
}

.nidaiTtl h4{
font-size:24px;
text-align:center;
font-weight:bold;
line-height:1.2em;
color:#000;
background:#fff;
}

.nidaiTtl h4 span{
font-size:15px;
color:#0a5926;
}



.hoshuTtl{
border-top:solid 3px #f58300;
border-bottom:solid 1px #ccc;
padding:25px 0 15px 0;
margin:80px 0 10px 0;
}

.hoshuTtl h4{
font-size:24px;
text-align:center;
font-weight:bold;
line-height:1.2em;
color:#000;
background:#fff;
}

.hoshuTtl h4 span{
font-size:15px;
color:#f58300;
}




.tr_faqBox, .aori_faqBox {
    width:900px;
   margin:0;
}

.tr_faqBox dt {
    cursor:pointer;

    background-size:12px auto;
    background-repeat: no-repeat;
    background-position: 99% center;
    border-bottom:dotted 1px #ccc;
    padding:20px 30px 20px 40px;
    font-size:15px;
    line-height:1.6em;
    position:relative;
}


.tr_faqBox dt:before{
font-family: "Font Awesome 5 Free";
content:'\f059';
 font-size:130%;
position:absolute;
color:#e50112;
font-weight: 900;
top:30%;
left:5px;
}


.aori_faqBox dt {
    cursor:pointer;
    background-size:12px auto;
    background-repeat: no-repeat;
    background-position: 99% center;
    border-bottom:dotted 1px #ccc;
    padding:20px 30px 20px 40px;
    font-size:15px;
    line-height:1.6em;
    position:relative;
}


.aori_faqBox dt:before{
font-family: "Font Awesome 5 Free";
content:'\f059';
 font-size:130%;
position:absolute;
color:#062d87;
font-weight: 900;
top:30%;
left:5px;
}



.nidai_faqBox dt {
    cursor:pointer;
    background-size:12px auto;
    background-repeat: no-repeat;
    background-position: 99% center;
    border-bottom:dotted 1px #ccc;
    padding:20px 30px 20px 40px;
    font-size:15px;
    line-height:1.6em;
    position:relative;
}


.nidai_faqBox dt:before{
font-family: "Font Awesome 5 Free";
content:'\f059';
 font-size:130%;
position:absolute;
color:#0a5926;
font-weight: 900;
top:30%;
left:5px;
}



.hoshu_faqBox dt {
    cursor:pointer;
    background-size:12px auto;
    background-repeat: no-repeat;
    background-position: 99% center;
    border-bottom:dotted 1px #ccc;
    padding:20px 30px 20px 40px;
    font-size:15px;
    line-height:1.6em;
    position:relative;
}


.hoshu_faqBox dt:before{
font-family: "Font Awesome 5 Free";
content:'\f059';
 font-size:130%;
position:absolute;
color:#f58300;
font-weight: 900;
top:30%;
left:5px;
}




.tr_faqBox dd, .aori_faqBox dd, .nidai_faqBox dd, .hoshu_faqBox dd{
    display:none;
    font-size:15px;
    line-height:140%;
    border-bottom:dotted 1px #ccc;
    padding:20px 30px 20px 40px;
    font-size:15px;
    line-height:1.6em;
    position:relative;
    }

.tr_faqBox dd, .aori_faqBox dd, .nidai_faqBox dd, .hoshu_faqBox dd{
    display:none;
    font-size:15px;
    line-height:140%;
    border-bottom:dotted 1px #ccc;
    padding:20px 30px 20px 40px;
    font-size:15px;
    line-height:1.6em;
    position:relative;
    }

.tr_faqBox dd:before{
font-family: "Font Awesome 5 Free";
content:'\f0a4';
 font-size:130%;
position:absolute;
color:#e50112;
font-weight: 900;
top:20px;
left:5px;
}


.aori_faqBox dd:before{
font-family: "Font Awesome 5 Free";
content:'\f0a4';
 font-size:130%;
position:absolute;
color:#062d87;
font-weight: 900;
top:20px;
left:5px;
}



.nidai_faqBox dd:before{
font-family: "Font Awesome 5 Free";
content:'\f0a4';
 font-size:130%;
position:absolute;
color:#0a5926;
font-weight: 900;
top:20px;
left:5px;
}



.hoshu_faqBox dd:before{
font-family: "Font Awesome 5 Free";
content:'\f0a4';
 font-size:130%;
position:absolute;
color:#f58300;
font-weight: 900;
top:20px;
left:5px;
}


.tr_faqBox dd p, .aori_faqBox dd p, .nidai_faqBox dd p, .hoshu_faqBox dd p{
margin:0 0 20px 0;
    }

.tr_faqBox dt.active{
    background-image: url(/laravel/images/truck/faq_close.png);
    background-size:12px auto;
}

.aori_faqBox dt.active{
    background-image: url(/laravel/images/truck/faq_close.png);
    background-size:12px auto;
}

.nidai_faqBox dt.active{
    background-image: url(/laravel/images/truck/faq_close.png);
    background-size:12px auto;
}

.tr_faqBox dt.over, .aori_faqBox dt.over, .nidai_faqBox dt.over, .hoshu_faqBox dt.over {
    background-color: #faf5e7;

}




/**************************************************************************************************

共通注意事項

**************************************************************************************************/
.priceTbl {
	margin-bottom: 20px;
}

.trAttenBox{
background:#fff;
border-radius: 8px;         /* CSS3 */
border:2px solid #e50112;
padding:20px;
}


.trAttenBox p{
font-size:16px;
line-height:1.6em;
font-weight:bold;
color:#e50112;
}



/**************************************************************************************************

共通お問い合わせエリア

**************************************************************************************************/
.trContactBox{
margin:50px 0 0 0;
background:#e6e6e6;
padding:25px 15px
}


.trContactBox ul li{
display:inline-block;
}

.trContactBox ul li:nth-child(even){
margin:0 30px 0 15px;
}

.trContactBox ul li a{
font-size:14px;
font-weight:bold;
color:#000;
display:block;
width:194px;
padding:23px 0 20px 0;
background-color:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
text-decoration:none;
text-align:center;
 	-webkit-box-shadow:1px 1px 1px rgba(0,0,0,0.4);
box-shadow:1px 1px 1px rgba(0,0,0,0.4);
position:relative;
}



.trContactBox ul li:nth-child(3) a{
font-size:14px;
font-weight:bold;
color:#000;
display:block;
width:435px;
padding:23px 0 20px 0;
background-color:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
text-decoration:none;
text-align:center;
 	-webkit-box-shadow:1px 1px 1px rgba(0,0,0,0.4);
box-shadow:1px 1px 1px rgba(0,0,0,0.4);
position:relative;
}

.trContactBox ul li a:before{
font-family: "Font Awesome 5 Free";
content:'\f1c1';
position:absolute;
color:#d32d25;
font-weight: 900;
font-size: 160%;
top:38%;
left:15px;
}


.trContactBox ul li:nth-child(2) a:before{
font-family: "Font Awesome 5 Free";
content:'\f548';
position:absolute;
color:#d32d25;
font-weight: 900;
font-size: 160%;
top:38%;
left:15px;
}


.trContactBox ul li:nth-child(3) a:before{
font-family: "Font Awesome 5 Free";
content:'\f157';
position:absolute;
color:#d32d25;
font-weight: 900;
font-size: 160%;
top:38%;
left:15px;
}

.trContactBox ul li a:after{
font-family: "Font Awesome 5 Free";
content:'\f054';
position:absolute;
color:#9f9f9f;
font-weight: 900;
font-size: 90%;
top:38%;
right:12px;
}


.trContactBox ul li a:hover{
opacity:.8;
}



.trContactBox .contactBtn{
}


.trContactBox .contactBtn a{
font-size:18px;
font-weight:bold;
color:#fff;
display:block;
background: linear-gradient(#f85945, #e50514);
border:solid 3px #e50514;
line-height:1.5em;
width:540px;
padding:23px 0 20px 0;
background-color:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
text-decoration:none;
text-align:center;
position:relative;
margin:25px auto 0 auto;

}


.trContactBox .contactBtn a:before{
font-family: "Font Awesome 5 Free";
content:'\f138';
position:absolute;
color:#fff;
font-weight: 900;
font-size: 130%;
top:31%;
left:40px;
}


.trContactBox .contactBtn a:hover{
opacity:.8;
}








/**************************************************************************************************

製品バナーエリア

**************************************************************************************************/
.comUtility-truck{
margin: 30px 0 50px 0;
}
.comUtility .linkToSample{
-ms-flex-positive: 1;
    flex-grow: 1;
border:1px solid #333;
background:#fff;
font-weight: bold;
color:#333;
}
.comUtility .linkToSample br{
display: none;
}
.comUtility .linkToSample span span{
display: block;
margin-top: .2em;
font-size: 11px;
line-height: 1.2;
font-weight: normal;
}
.comUtility .linkToSample:hover,
.comUtility .linkToSample:active{
border:1px solid #e70000;
color:#e70000;
}
.comUtility .linkToSample i{
color:#e70000;
}

.comUtility-truck .comRelationList li a{
color: #1287d4;
}
.comUtility-truck .comRelationList li a:hover,
.comUtility-truck .comRelationList li a:active{
border: solid 1px #1287d4;
background: #1287d4;
color: #fff;
}


/* サービス品案内 */
.truck-gift-message{
margin: 30px 10% 15px 10%;
border:1px solid #e50112;
border-radius: 4px;
}
.truck-gift-message dt{
margin-bottom: 10px;
padding: 8px 10px;
background: linear-gradient(#f85945, #e50112);
font-size: 14px;
font-weight: bold;
line-height: 1.3em;
color:#fff4f4;
}
.truck-gift-message dt i.fa-gift{
margin-right: 0.2em;
font-size: 1.2em;
}
.truck-gift-message dd{
margin:10px 15px 10px 15px;
font-size: 13px;
line-height: 1.4em;
color:#e50112;
}


/**************************************************************************************************
トラックボード動画埋め込み部分
**************************************************************************************************/

.iframeWrap {
     position: relative;
     padding-bottom: 56.25%;
     height: 0;
     overflow: hidden;
}

.iframeWrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

.sanko-p{
	position: relative;
	height: 360px;
}
.kei-dai{
	background: url(/laravel/images/truck/kei-truck/img_size_880_2.jpg) no-repeat;
}
.kei-hira{
	background: url(/laravel/images/truck/kei-truck/img_size_880_3.jpg) no-repeat;
}
.sanko-p .sankoBox{
	position: absolute;
	right: 0;
    top: 0px;
    border: 1px #e50112 solid;
    padding: 10px;
    border-radius: 5px;
}
.sankoBox p{
	color: #e50112;
	font-weight: bold;
}
.sankoBox dl{
	line-height: 1.8rem;
}
.sankoBox dl dt{
	font-size: 0.9rem;
    font-weight: bold;
	padding-top: 3px;
}
.sankoBox dl dd{
	font-size: 1.6rem;
    font-weight: bold;
	color: #e50112;
}
.sankoBox dl dd span{
	font-size: 1rem;
	color: #333;
}
/**************************************************************************************************
media query
**************************************************************************************************/
/* Small devices (480px and down) */
@media (max-width: 480px) {

	#trackseat .itemBtn1,
	#aoriseat .itemBtn1,
	#nidainet .itemBtn1,
	#hoshu .itemBtn1{
	margin: 0 8px;
	}
	#truck-tab{
	margin: 0;
	height: auto;
	border-bottom: solid 2px #c8c8c8;
	}
	#truck-tab li a,
	#truck-tab li span{
	height: 38px;
	padding: 0 .15em;
	border-width: 1px;
	font-size: 10px;
	line-height: 1.2;
	font-weight: normal;
	text-align: center;
	letter-spacing: -0.04em;
	position: inherit;
	box-sizing: border-box;
	}
	#truck-tab li:first-child a,
	#truck-tab li:first-child span,
	#truck-tab li:last-child a,
	#truck-tab li:last-child span{
	border-width: 1px;
	}

	.truckhoshu-tab {
		margin-bottom: -20px;
	}

	.truckhoshu-tab > li {
		flex-basis: 50%;
		margin: 0 0 10px 0;
	}

	.vp2-img-head + p,
    .vp2-img-head + p + p,
    .vp2-img-head + p + p + p,
	#trackseat h2 + p + p,
	#aoriseat h2 + p + p,
	#nidainet h2 + p + p,
	#hoshu h2 + p + p,
	#trackseat h2 + p + p + p,
	#aoriseat h2 + p + p + p,
	#nidainet h2 + p + p + p,
	#hoshu h2 + p + p + p{
	margin: 1em 8px;
	font-size: 13px;
	line-height: 1.5;
	}

	.ttl-truck,
	.ttl-truck.ttl-truck-aori,
	.ttl-truck.ttl-truck-nidai,
	.ttl-truck.ttl-truck-hoshu{
	margin: 30px 0 20px 0;
	padding: 12px 15px 10px 15px;
	border-width: 1px;
	border-left:none;
	border-right:none;
	border-radius: inherit;
	font-size: 16px;
	}
	.ttl-truck + p,
    .ttl-truck.ttl-truck-hoshu + p {
	margin-bottom: 2em;
    padding: 0 8px;
    font-size: 13px;
    line-height: 1.5;
	}
	.ttl-truck.ttl-truck-point{
	border-width: 1px;
	border-left:none;
	border-right:none;
	}
	.ttl-truck.ttl-truck-fax{
	font-size: 14px;
	}
	.ttl-truck.ttl-truck-fax span{
	font-size: 11px;
	font-weight: normal;
	}

	.ttl-truck-sub{
	margin: 30px 8px 15px 8px;
	font-size: 16px;
	line-height: 1.25;
	}
	.ttl-truck-sub + p{
	margin-left: 8px;
	margin-right: 8px;
	font-size: 13px;
	}

	.disp-column{
	margin: 30px 8px 0 8px;
	flex-direction: column;
	}
	.disp-column-img{
	order: 2;
	}
	.disp-column-content{
	order: 1;
	padding-left: 0;
	}
	.disp-column .ttl-truck-sub{
	margin-top: auto;
	text-align: center;
	}

	.disp-img-round img{
	border-radius: inherit;
	}
	.disp-img-round + p {
	margin-left:8px;
	margin-right:8px;
	font-size: 13px;
	}

	/*台形・平シート参考価格*/
	.sanko-p{
		position: relative;
		height: 450px;
	}
	.kei-dai{
		background: url(/laravel/images/truck/kei-truck/img_size_880_2_sp.jpg) no-repeat;
		background-size: contain;
	}
	.kei-hira{
		background: url(/laravel/images/truck/kei-truck/img_size_880_3_sp.jpg) no-repeat;
		background-size: contain;
	}
	.sanko-p .sankoBox{
		position: absolute;
		right: 0;
		top: 280px;
		border: 1px #e50112 solid;
		padding: 10px;
		border-radius: 5px;
		width: 100%;
	}
	.sankoBox p{
		color: #e50112;
		font-weight: bold;
	}
	.sankoBox dl{
		line-height: 1.8rem;
	}
	.sankoBox dl dt{
		font-size: 0.9rem;
		font-weight: bold;
		padding-top: 3px;
	}
	.sankoBox dl dd{
		font-size: 1.5rem;
		font-weight: bold;
		color: #e50112;
		text-align: right;
        flex: auto;
	}
	.sankoBox dl dd span{
		font-size: 1rem;
		color: #333;
	}



	.tr-cards-list{
	margin: 15px 4px;
	}
	.tr-cards-list li{
	margin: 4px;
	width: calc(100% / 2 - 8px);
	}
	.tr-cards-list li .tr-cards .tr-cards-ttl{
	font-size: 16px;
	}
	.tr-type-tbl{
	padding-bottom: 8px;
	width: 100%;
	overflow-x: auto;
	}
	.tr-type-tbl table{
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	}
	.tr-type-tbl table .tr-type-tbl-name td{
	font-size: 13px;
	white-space: nowrap;
	}

	.tr_reasonBox ul{
	flex-direction: column;
	}
	.tr_reasonBox ul li{
	margin:0;
	padding:15px 8px;
	width:auto;
	border:0 none;
	border-bottom: 1px solid #ccc;
	text-align: center;
	}
	.tr_reasonBox ul li:last-child{
	border:0 none;
	}
	.tr_reasonBox ul li h4 img{
	margin: 0 auto;
	padding:inherit;
	text-align: center;
	}
	.tr_reasonBox p{
	margin-top:15px;
	padding:0 8px;
	font-size: 13px;
	}

	.trContactBox{
	margin-top: 30px;
	padding: 8px;
	}
	.trContactBox ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	}
	.trContactBox ul li,
	.trContactBox ul li:nth-child(2n){
	margin: 0;
	width: calc((100% - 8px) / 2);
	box-sizing: border-box;
	}
	.trContactBox ul li:last-child{
	margin: 8px 0;
	width: 100%;
	}
	.trContactBox ul li a{
	display: block;
	}
	.trContactBox ul li:nth-child(3) a{
	display: block;
	width: auto;
	}
	.trContactBox .contactBtn a{
	margin: 0 auto;
	width: auto;
	}
	.trContactBox ul li a,
	.trContactBox ul li:nth-child(3) a{
	display: flex;
	justify-content: space-between;
	font-weight: normal;
	position: inherit;
	}
	.trContactBox ul li a:before,
	.trContactBox ul li:nth-child(2) a:before,
	.trContactBox ul li:nth-child(3) a::before,
	.trContactBox ul li a:after{
	position: inherit;
	top: inherit;
	left:inherit;
	}
	.trContactBox ul li a:before{
	padding-left: 0.8em;
	}
	.trContactBox ul li a:after{
	padding-right: 0.8em;
	}
	.trContactBox .contactBtn a{
	position: inherit;
	padding: 0 10px;
	line-height: 60px;
	box-sizing: border-box;
	}
	.trContactBox .contactBtn a::before{
	padding-right: 0.3em;
	vertical-align: -0.05em;
	position: inherit;
	top: inherit;
	left:inherit;
	}

	.tr_selectBox{
	margin-top:20px;
	width: 100%;
	overflow-x: auto;
	}
	.tr_selectBox table{
	margin: 40px 0 15px 0;
	}
	.tr_selectBox th{
	padding: 10px 0;
	width: 40vw;
	font-size: 13px;
	}
	.tr_selectBox th:first-child{
	width: 50px;
	}
	.tr_selectBox-note{
	margin: 0 8px;
	text-align: left;
	}
	.tr_selectBox + p{
	margin: 0 8px;
	font-size: 13px;
	line-height: 1.5	;
	}

	.trAttenBox{
	margin:15px 8px;
	padding: 10px;
	}
	.trAttenBox p{
	font-size: 13px;
	line-height: 1.4;
	text-align: left;
	}
	.trAttenBox p br{
	display: none;
	}

	.tr_kindBox{
	margin-top: -20px;
	width: auto;
	}
	.tr_kindBox .frame{
	display: flex;
	flex-wrap: wrap;
	margin:0;
	padding: 25px 8px;
	}
	.tr_kindBox .frame .point{
	display: flex;
	justify-content: center;
	align-items: center;
	position: inherit;
	padding: 0 5px;
	width: calc( 30vw - 18px );
	font-size: 12px;
	}
	.tr_kindBox .frame .pointTxt{
	display: inherit;
	width: calc( 70vw - 18px );
	font-size: 12px;
	}
	.tr_kindBox h4{
	margin: 20px 0 15px 0;
	font-size: 16px;
	}
	.tr_kindBox h4 span{
	font-size: 14px;
	}
	.tr_kindBox .thumbBox{
	display: block;
	margin:0 auto;
	width:auto;
	text-align: center;
	}
	.tr_kindBox .infoBox{
	display: block;
	margin-top:15px;
	width:auto;
	}

	.tr_kindBox .infoBox dl{
	display: table;
	width: 100%;
	}
	.tr_kindBox .infoBox dl dt{
	display: table-cell;
	margin: 0;
	padding: 8px;
	width: 40px;
	font-size: 11px;
	line-height: 1.2;
	}
	.tr_kindBox .infoBox dl dd{
	padding: 8px;
	}
	.tr_kindBox .infoBox dl dd ul li{
	margin-right: 5px;
	padding: 5px 6px;
	font-size: 10px;
	line-height: 1;
	}
	.tr_kindBox .infoBox .expBox{
	padding: 10px;
	}
	.tr_kindBox .infoBox .expBox p{
	font-size: 12px;
	line-height: 1.4;
	}
	.tr_kindBox .infoBox .priceBox{
	padding: 8px 12px;
	}
	.tr_kindBox .infoBox .priceBox p span.priceBox-basic{
	margin: 2px 0 0 0;
	font-size: 11px;
	}

	.tr_kindBox .pointBox{
	margin: 10px 0px;
	}
	.tr_kindBox .pointBox h5{
	position: inherit;
	padding: 12px 0 10px 0;
	font-size: 13px;
	}
	.tr_kindBox .pointBox h5::before{
	position: inherit;
	top:inherit;
	left:inherit;
	padding-right: 0.3em;
	vertical-align: -0.1em;
	}
	.tr_kindBox .pointBox p{
	padding: 12px;
	font-size: 14px;
	line-height: 1.5;
	}

	.truck-order-guide{
	padding:0 15px;
	}
	.truck-order-guide-ttl{
	margin-top:1.2em;
	font-size: 15px;
	}
	.truck-order-guide p{
	margin-bottom:1.2em;
	font-size: 13px;
	}

	.comPriceTtl2.truck-price-ttl{
	width: 100%;
	}
	.comPriceTtl2.truck-price-ttl h3{
	padding: .2em 0;
	}
	.comPriceTtl2.truck-price-ttl h3 .fa-stack{
	margin-left: .25em;
	margin-right: .25em;
	width: 36px;
	font-size: 24px;
	}

	.truck-price-disp{
	width: 100%;
	text-align: center;
	}
	.truck-price-disp .truck-disp-length{
	display: none;
	}

	.tbl-truck-price-wrap{
	overflow: auto;
	white-space: nowrap;
	}
	.tbl-truck-price{
	margin-left: 88px !important;
	}
	.tbl-truck-price tr:first-child th:first-child{
	position: absolute;
	left: 8px;
	margin-top: -1px;
	width: 90px;
	height: 53px;
	box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2);
	}
	.tbl-truck-price tr th:first-child{
	position: absolute;
	left: 8px;
	margin-top: -1px;
	width: 90px;
	line-height: 20px;
	box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.2);
	}
	.tbl-truck-price tr:first-child th{
	height: 52px;
	}
	.tbl-truck-price td{
	line-height: 16px;
	}


	.tr_kodawariBox{
	width: auto;
	overflow: hidden;
	}
	.tr_kodawariBox .kodawariFrame{
	flex-direction: column;
	margin: 20px 8px;
	}
	.tr_kodawariBox .kodawariFrame:first-child{
	margin-top: 9px;
	}
	.tr_kodawariBox .ttlBox{
	align-items: unset;
	}
	.tr_kodawariBox .ttlBox .point{
	}
	.tr_kodawariBox .ttlBox h4{
	margin: 0.5em 0;
	font-size: 16px;
	line-height: 1.3;
	}
	.tr_kodawariBox .ttlBox h4 em{
	display: block;
	font-size: 16px;
	line-height: 1.3;
	}
	.tr_kodawariBox .thumbBox{
	display: block;
	padding: 10px 15px;
	width: auto;
	text-align: center;
	}
	.tr_kodawariBox .txtBox{
	display: block;
	margin: 0 8px;
	padding: 0px 1em;
	width: auto;
	}
	.tr_kodawariBox .txtBox p{
	font-size: 13px;
	line-height: 1.5;
	}
	.tr_kodawariBox .kodawariFrame:last-child .txtBox{
	padding: 0px 1em;
	}
	.point-massage{
	right: -18px;
	width: 20vw;
	}

	.tr_optionBox ul{
	flex-direction: column;
	margin: 15px 8px 20px 8px;
	}
	.tr_optionBox ul li{
	margin: 15px 0;
	width: auto;
	}
	.tr_optionBox h4{
	padding: 0 6px 4px 0;
	line-height: 1.2;
	}
	.tr_optionBox p{
	text-align: justify;
	}

	.tr_optionBox ul li .truck-option-gallery{
	flex-direction: inherit;
	}

	.tr-category-links{
	margin: 20px 8px 0 8px;
	}
	.tr-category-links li{
	margin-top: 8px;
	}
	.tr-category-links-mini{
	width: calc( 100% / 2);
	}

	.tr_sizeBox{
	margin:0 8px;
	width: auto;
	}
	.tr_sizeBox p{
	font-size: 13px;
	line-height: 1.5;
	}
	.tr_sizeBox .sizeFrame{
	padding: inherit;
	}
	.tr_sizeBox-label{
	margin: 20px 0 10px 0;
	font-size: 16px;
	}
	.tr_sizeBox .tr_sizeBox-box{
	padding: 10px;
	border-width: 3px;
	}
	.tr_sizeBox .tr_sizeBox-box p{
	font-size: 13px;
	}
	.tr_sizeBox-ill{
	flex-direction: column;
	}
	.tr_sizeBox-ill li{
	margin: 10px 0;
	width: auto;
	text-align: center;
	}
	.tr_sizeBox-label-sub{
	border-radius: 13px;
	font-size: 13px;
	line-height: 26px;
	}
	.tr_sizeBox .tr_sizeBox-ill li p{
	padding: 0 2em;
	}





	.tr_informationBox_tit{
	margin-left: 8px;
	margin-right: 8px;
	font-size: 18px;
	}
	.tr_informationBox{
	width: auto;
	margin:0 8px;
	padding: 0;
	border-radius: 0 0 4px 4px;
	}
	.tr_informationBox dl{
	margin: 0;
	}
	.tr_informationBox dl dt{
	position: inherit;
	display:block;
	margin: auto;
	padding: 10px 1em;
	width:auto;
	border: none;
	border-radius: inherit;
	background: #efefef;
	font-size: 16px;
	font-weight: normal;
	line-height: 1;
	color: #000;
	}
	.tr_informationBox dl dt:before{
	position: inherit !important;
	top:inherit !important;
	left: inherit !important;
	padding-right: 0.3em;
	color: inherit !important;
	}
	.tr_informationBox dl dd{
	display:block;
	padding: 0 15px;
	width: auto;
	}
	.tr_informationBox dl dd.sample{
	display:block;
	padding: 15px;
	width: auto;
	}
	.tr_informationBox dl dd.sampleBtn{
	display: block;
	width: auto;
	text-align: center;
	}
	.tr_informationBox dl dd.sampleBtn a{
	position: inherit;
	display: inline-block;
	margin: 0 auto;
	padding: 10px 25px;
	width: auto;
	border: solid 2px #e50514;
	font-weight: normal;
	}
	.tr_informationBox dl dd.sampleBtn a::before{
	position: inherit;
	top: inherit;
	right:inherit;
	padding-right: 0.5em;
	}
	.tr_informationBox dl dd p{
	margin: 1em auto;
	font-size:13px;
	}
	.tr_informationBox ul{

	}
	.tr_informationBox ul li,
	.tr_informationBox ul li:nth-child(2n){
	display: flex;
	margin: 0 0 10px 0;
	width: auto;
	}
	.tr_informationBox ul li:last-child{
	margin: 0 0 0 0;
	}
	.tr_informationBox ul li h4{
	flex-shrink: 0;
	padding: 8px;
	width: 25vw;
	font-size: 10px;
	font-weight: normal;
	line-height: 1.2;
	box-sizing: border-box;
	}
	.tr_informationBox ul li p{
	padding: 8px;
	font-size: 12px;
	}



	.tr_informationBox .attenBox{
	background: #fff4f4;
	}
	.tr_informationBox .attenBox h4{
	position: inherit;
	padding: 8px;
	font-size: 16px;
	font-weight: normal;
	background: #cc0000;
	}
	.tr_informationBox .attenBox h4::before{
	position: inherit;
	padding-right: 0.3em;
	top: inherit;
	left: inherit;
	}
	.tr_informationBox .attenBox p{
	padding: 15px;
	font-size: 14px;
	line-height: 1.5;
	color:#cc0000;
	}


	#trackseat .tr_estimateBox h3,
	#aoriseat .aori_estimateBox h3,
	#nidainet .nidai_estimateBox h3{
	margin: 50px 8px 20px 8px;
	padding: 25px 8px 13px 8px;
	font-size: 24px;
	border-radius: 3px;
	}
	#trackseat .tr_estimateBox h3 span,
	#aoriseat .aori_estimateBox h3 span,
	#nidainet .nidai_estimateBox h3 span{
	display: block;
	margin-top: 1em;
	font-size: 12px;
	line-height: 1.3;
	}
	.tr_estimateBox .ttlBox,
	.aori_estimateBox .ttlBox,
	.nidai_estimateBox .ttlBox{
	display: flex;
	align-items: center;
	margin: 50px 8px 20px 8px;
	border: solid 1px #ccc;
	border-radius: 2px;
	}
	.tr_estimateBox .ttlBox .point,
	.aori_estimateBox .ttlBox .point,
	.nidai_estimateBox .ttlBox .point{
	flex-shrink: 0;
	box-sizing: border-box;
	}
	.tr_estimateBox .ttlBox h4,
	.aori_estimateBox .ttlBox h4,
	.nidai_estimateBox .ttlBox h4{
	font-size: 16px;
	}

	.tr_estStep1{
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 10px 8px;
	}
	.tr_estStep1 .frame,
	.nidai_estimateBox .tr_estStep1 .frame{
	margin: 8px 0;
	width: calc( ( 100% - 8px) / 2);
	}
	.tr_estStep1 .frame:nth-child(4n),
	.nidai_estimateBox .tr_estStep1 .frame:nth-child(4n){
	margin: 8px 0;
	}
	.truck-check-item .thumb{
	margin-top: 1.5em;
	}
	.truck-check-item h4{
	font-size: 13px;
	}
	.nidai_estimateBox .truck-check-item h4{
	font-size: 12px;
	line-height: 1.3;
	letter-spacing: -0.025em;
	}
	.truck-check-item ul{
	font-size: 11px;
	line-height: 1;
	}
	.truck-check-item ul li{
	padding: 0.5em;
	}
	.truck-check-item ul li span{
	margin: 0 -0.5em 0.5em -0.5em;
	padding-bottom: 0.5em;
	}
	.truck-check-item .price{
	font-size: 12px;
	line-height: 1;
	}
	.tr_estimateBox select,
	.aori_estimateBox select,
	.nidai_estimateBox select{
	font-size: 16px;
	transform: scale(0.8);
	}




	.tr_estStep2{
	padding: 0 8px;
	}
	.tr_estStep2-measurement{
	margin-top: 20px;
	}
	.tr_estStep2 ul{
	flex-wrap: wrap;
	padding: 0;
	}
	.tr_estStep2 li{
	display: flex;
	flex-wrap: wrap;
	padding: 20px 8px;
	width: 50%;
	border-bottom: 2px dotted #ccc;
	}
	.tr_estStep2 li:last-child{
	border-bottom: none;
	}
	.tr_estStep2 li div{
	width: 100%;
	font-size: 14px;
	}
	.tr_estStep2 ul li input[type="text"]{
	width: calc( 100% - 54px);
	font-size: 20px;
	line-height: 20px;
	-webkit-appearance : none;
	}
	.tr_estStep2-note{
	padding: 20px 0;
	}
	.tr_estStep2-note p{
	font-size: 12px;
	}
	.tr_estStep2-note .itemBtnBase{
	margin-bottom: 0;
	}
	.estStep2-aoriheight-note {
	margin-top: 0;
	margin-bottom: 0;
	padding: 15px 0;
	border-top: 2px dotted #ccc;
	}
	.estStep2-aoriheight-note p {
	font-size: .8rem;
	}


	.tr_estStep3{
	margin: 10px 8px;
	}
	.tr_estStep3 .frame dl{
	flex-wrap: wrap;
	align-items: unset;
	}
	.tr_estStep3 .frame dl dt{
	width: 100%;
	}
	.tr_estStep3 .frame dl dd{
	margin-top:1em;
	margin-right: 5px;
	width: calc( ( 100% - 16px ) / 3 );
	}
	.tr_estStep3 .frame dl dd:last-child{
	margin-right: 0;
	}
	.tr_estStep3 label{
	margin: 0;
	}
	.tr_estStep3 .frame dl dd p{
	margin: 0.5em 0 0 0;
	font-size: 10px;
	letter-spacing: -0.02em;
	}
	/*アオリシート*/
    .tr_aoriStep4 {
    display: block;
    padding: 0 10px;
}
    .tr_aoriStep4 > div:first-child {
	margin: 20px 	0 0 0;
	padding-bottom: 20px;
	border-bottom: 2px dotted #ccc;
	}
	.tr_aoriStep4 > div:last-child ul {
	display: flex;
	flex-wrap: wrap;
	padding: 0 0 20px 0;
	border-bottom: 2px dotted #ccc;
	}
    .tr_aoriStep4 ul > li:nth-child(1) {
		display: inline-flex;
		flex-wrap: wrap;
		flex-basis: 100%;
		padding: 20px 10px 0 10px;
		border-bottom: 2px dotted #ccc;
	}
	.tr_aoriStep4 ul > li:nth-child(1) > div:nth-child(1) {
		flex-basis: 100%;
	}
	.tr_aoriStep4 ul > li:nth-child(1) > div:nth-child(2),
	.tr_aoriStep4 ul > li:nth-child(1) > div:nth-child(3) {
		flex-basis: 50%;
	}
	.tr_aoriStep4 ul > li:nth-child(1) > div:nth-child(3) {
		padding-left: 10px;
	}
    .tr_aoriStep4 label[for^="hatomeA"] {
		padding: 0.5em 0 1em 2em;
		font-size: 0.9rem;
	}
    .tr_aoriStep4 li div {
		font-size: 0.9rem;
	}
    .tr_aoriStep4 ul > li:nth-child(2),
	.tr_aoriStep4 ul > li:nth-child(3) {
		flex-basis: calc(50%);
		justify-content: space-between;
	}
	.tr_aoriStep4 ul > li:nth-child(2) {
		padding: 20px 10px 0 5px;
	}
    .tr_aoriStep4 ul li input[type="text"] {
		width: calc( 100% - 54px);
	}
   	.tr_aoriStep4 ul > li:nth-child(3) {
		padding: 20px 5px 0 10px;
	}


    /**/
	.tr_estStep4 {
    /*display: block;
    padding: 0 10px;*/
    flex-wrap: wrap;
    justify-content: space-between;
    display: flex;
	padding: 0 10px;
	}
    .tr_estStep4 .frame {
    margin: 8px 0;
    width: calc( ( 100% - 8px) / 2);
}
	/*.tr_estStep4 > div:first-child {
		margin: 20px 	0 0 0;
		padding-bottom: 20px;
		border-bottom: 2px dotted #ccc;
	}*/

	.tr_estStep4 > div:last-child ul {
		display: flex;
		flex-wrap: wrap;
		padding: 0 0 20px 0;
		border-bottom: 2px dotted #ccc;
	}

	.tr_estStep4 ul > li:nth-child(1) > div:nth-child(1) {
		flex-basis: 100%;
	}
	.tr_estStep4 ul > li:nth-child(1) > div:nth-child(2),
	.tr_estStep4 ul > li:nth-child(1) > div:nth-child(3) {
		flex-basis: 50%;
	}
	.tr_estStep4 ul > li:nth-child(1) > div:nth-child(3) {
		padding-left: 10px;
	}
    .tr_estStep4 .frame:nth-child(4n), .nidai_estimateBox .tr_estStep4 .frame:nth-child(4n) {
    margin: 8px 0;
}
	.tr_estStep4 label[for^="hatomeA"] {
		padding: 0.5em 0 1em 2em;
		font-size: 0.9rem;
	}
	.check + .truck-check-item[for^="hatomeA"] span:before {
		left: 0;
	}
	.check + .truck-check-item[for^="hatomeA"] span:after {
		left: 0;
	}
	.tr_estStep4 ul > li:nth-child(2),
	.tr_estStep4 ul > li:nth-child(3) {
		flex-basis: calc(50%);
		justify-content: space-between;
	}
	.tr_estStep4 ul > li:nth-child(2) {
		padding: 0.5em;
	}
	.tr_estStep4 ul > li:nth-child(3) {
		padding: 0.5em;
	}
	.tr_estStep4 li div {
		font-size: 0.9rem;
	}
	.tr_estStep4 ul li input[type="text"] {
		width: calc( 100% - 54px);
	}

	.aori_estStep1{
	margin: 0 8px;
	}
	.aori_estStep1 ul{
	display: flex;
	justify-content: space-between;
	}
	.aori_estStep1 ul li{
	display: block;
	margin: 0;
	width: calc( 50% - 4px );
	}
	.aori_estimateBox .tr_estStep1{
	justify-content: space-between;
	}

	.truck-invalid-balloon{
	left: auto;
	right: 8px;
	top: -13px;
	width: 182px;
	}






	.tr_estContactBox{
	padding: 0 30px;
	background: transparent;
	}
	.tr_estContactBox .contactBtn a{
	width: auto;
	border-radius: 8px;
	}
	.tr_estContactBox .contactBtn a span{
	font-size: 12px;
	}
	.tr_estContactBox .contactBtn a:before{
	left: .5em;
	}




	.tr_estimateBox .step-note,
	.aori_estimateBox .step-note,
	.nidai_estimateBox .step-note{
	margin-right: 8px;
	font-size: 11px;
	}

	.tr-img-feature{
	margin-top: -20px;
	}
	.tr-color-list{
	margin: 0 8px;
	}
	.tr-color-list li{
	margin: 0 4px;
	width: calc( (100% - 16px ) / 2);
	}
	.tr-color-list li p{
	margin-top: 0.5em;
	font-size: 12px;
	text-align: center;
	}
	.tr-case-list{
	margin: 0 8px;
	justify-content: space-between;
	}
	.tr-case-list.tr-case-feature{
	margin-top: 20px;
	}
	.tr-case-list li{
	margin: 0;
	padding: 0;
	width: calc( 50% - 4px );
	}
	.tr-case-list li p{
	margin: 0;
	padding: 0.75em;
	font-size: 12px;
	}
	.tr-case-item{
	margin: 0 0 0.5em 0;
	font-size: 11px;
	}
	.tr-case-item dt{
	padding: 0.5em 0.5em 0.25em 0.5em;
	font-size: 14px;
	}
	.tr-case-item dd{
	padding: 0.25em 0.5em 0 0.5em;
	}
	.tr-case-item .tr-case-item-price-size{
	position: static;
	top: auto;
	right: auto;
	}
	.tr-case-item .tr-case-item-price{
	position: static;
	right: auto;
	bottom: auto;
	padding: 0 0.25em;
	text-align: right;
	}

	.tr-aori-outlettxt{
    padding: 0 8px;
    font-size: 13px;
	}
	.tr-aori-outletBoxImgL{
	display: inherit;
	text-align:left;
	padding: 0;
	}

	.tr-aori-outletBoxCont{
	display: inherit;
	padding: 0;
	width: auto;
	}
	.tr-aori-outletBoxCont li{
	padding: 0;
	}
	.tr-aori-outletBoxCont li:first-child{
	border: 0;
	padding: 15px 0 20px;
	}

	.tr-aori-outletBoxCont li dt{
	width: 100%;
	font-size: 14px;
}
	.tr-aori-outletBoxCont li dd{
	width: 100%;
	margin-top: 8px;
	}
	.tr-aori-outletBtnBase a{
	margin: 0;
	}
	.tr-spec-tbl{
	width: 100%;
	overflow-x: auto;
	}
	.tr-spec-tbl table th,
	.tr-spec-tbl table td{
	padding: 0.5em 0.75em;
	font-size: 11px;
	white-space: nowrap;
	}

	.truck-heading-sub{
	margin: 30px 8px 2px 8px;
	}
	.sozai-list-wrap{
	margin: 0 8px;
	}
	.sozai-list-img{
	margin-right: 10px;
	}
	.sozai-list-data-wrap{
	flex-wrap: wrap;
	flex-direction: column;
	}
	.sozai-list-name{
	font-size: 16px;
	line-height: 1.2;
	}
	.sozai-list-code{
	margin-top: 0.25em;
	font-size: 10px;
	}
	.sozai-list-icon{
	margin-top: 5px;
	}
	.sozai-list-data-spec{
	flex-wrap: wrap;
	flex-direction: column;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
	border-bottom: none;
	}
	.sozai-list-data-spec li,
	.sozai-list-data-spec li:last-child,
	.sozai-list-data-spec .sozai-data-thickness,
	.sozai-list-data-spec .sozai-data-squares,
	.sozai-list-data-spec .sozai-data-price{
	display: flex;
	align-items: center;
	padding: 0.5em;
	width: 100%;
	border: none;
	border-bottom: 1px solid #ddd;
	font-size: 11px;
	line-height: 1.1;
	}
	.sozai-list-data-spec li.sozai-data-thickness,
	.sozai-list-data-spec li.sozai-data-price{
	font-size: 13px;
	line-height: 1.2;
	}
	.sozai-list-data-spec li span{
	padding: 0;
	box-sizing: border-box;
	width: 45%;
	}
	.sozai-list-data-color{}
	.sozai-list-data-color dd{}
	.sozai-list-data-color dd img{
	width: 30px;
	border-radius: 15px;
	}










	.hoshu_proBox{
	margin-top:-20px;
	}
	.hoshu_proBox ul{
	flex-direction: column;
	}
	.hoshu_proBox ul li{
	display: flex;
	padding: 10px;
	width: auto;
	}
	.hoshu_proBox ul li:first-child{
	margin-top:10px;
	}
	.hoshu_proBox .thumbBox{
	width: 25%;
	}
	.hoshu_proBox .hoshu-spec{
	padding-left: 10px;
	width: 75%;
	box-sizing: border-box;
	}
	.hoshu_proBox h4{
	margin-top: 0;
	line-height: 1.2;
	}
	.hoshu_proBox p{
	font-size: 11px;
	}
	.hoshu_proBox .hoshu-spec-list{
	margin-top: 1em;
	}
	.hoshu_proBox .hoshu-spec-list span{
	top: -0.5em;
	line-height: 1;
	}
	.hoshu_proBox .hoshu-spec-list ol{
	margin-top: 0.75em;
	}
	.hoshu_proBox .hoshu-spec-list ol li{
	display: list-item;
	line-height: 1.2;
	}
	.hoshu_proBox .hoshu-spec-list ol li:first-child{
	margin-top: auto;
	}
	.hoshu_proBox .price{
	font-size: 13px;
	font-weight: normal;
	}
	.hoshu_proBox a .btnDetail{
	display: none;
	}

	.hoshuContactBox{
	margin-top: 50px;
	padding: 0 20px;
	background: transparent;
	}
	.hoshuContactBox .contactBtn a{
	width: auto;
	font-size: 16px;
	line-height: inherit;
	}
	.hoshuContactBox .contactBtn a i{
	font-size: 1.5em;
	}

	.tr-sheet-name{
	padding: 10px 5px 0 5px;
	font-size: 14px;
	}
	.contLayoutBox.tr-sheets-spec .contLayoutBox-Item4 li:nth-child(-n+2){
	border-bottom: 1px solid #ddd;
	}
	.contLayoutBox.tr-sheets-spec + p{
	margin: 1em 8px;
	font-size: 13px;
	font-size: 13px;
	}


	.tr_faxBox ul{
	flex-direction: column;
	}
	.tr_faxBox ul li{
	margin: 25px 0;
	}
	.tr_faxBox ul li a{
	padding: 0 2em;
	}
	.tr_faxBox ul li .faxBtn{
	padding: 0.8em 1.2em;
	font-size: 16px;
	}

	.trTtl h3,
	.trTtl h4,
	.aoriTtl h4,
	.nidaiTtl h4,
	.hoshuTtl h4{
	padding: 0 8px;
	font-size: 16px;
	}
	.trTtl h3 span,
	.trTtl h4 span,
	.aoriTtl h4 span,
	.nidaiTtl h4 span,
	.hoshuTtl h4 span{
	font-size: 12px;
	}
	.tr_faqBox,
	.aori_faqBox,
	.nidai_faqBox,
	.hoshu_faqBox{
	width: auto;
	}
	.tr_faqBox dt,
	.aori_faqBox dt,
	.nidai_faqBox dt,
	.hoshu_faqBox dt{
	padding: 8px 8px 8px 40px;
	font-size: 13px;
	line-height: 1.4;
	}
	.tr_faqBox dt::before,
	.tr_faqBox dd::before,
	.aori_faqBox dt::before,
	.aori_faqBox dd::before,
	.nidai_faqBox dt::before,
	.nidai_faqBox dd::before,
	.hoshu_faqBox dt::before,
	.hoshu_faqBox dd::before{
	left: 12px;
	}
	.tr_faqBox dd p,
	.aori_faqBox dd p,
	.nidai_faqBox dd p,
	.hoshu_faqBox dd p{
	margin: 0 0 1em 0;
	font-size: 13px;
	line-height: 1.4;
	}

	#trackseat .vpNote,
	#aoriseat .vpNote,
	#nidainet .vpNote,
	#hoshu .vpNote{
	margin-left: 8px;
	margin-right: 8px;
	}


	.comUtility .linkToSample{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 25%;
	}
	.comUtility .linkToSample br{
	display: block;
	}
	.comUtility .linkToSample span span {
	font-size: 8px;
	line-height: 1.2;
	}

	.truck-gift-message{
	margin: 30px 8px 15px 8px;
	}
	.truck-gift-message dt{
	text-align: center;
	}


}

/* Medium devices (768px and down) */
@media (max-width: 768px) {

}

.tr-feature-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	margin: 22px 0;
}

.tr-feature-list * {
	box-sizing: border-box;
}

.tr-feature-list > li {
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	border: 1px solid #E6E6E6;
	align-items: center;
}

.tr-feature-list h3 {
	font-weight: bold;
	font-size: 1.25rem;
	background-color: #F5F5F5;
	padding: .75rem 1rem;
	line-height: 1.2;
	border-bottom: 1px solid #E6E6E6;
	display: block;
	width: 100%;
}

.tr-feature-list figure {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: 0;
	padding: 22px;
	flex-shrink: 0;
	height: 130px;
}

.tr-feature-list figure img {
	width: 100%;
	height: auto;
	max-width: 100%;
}

.tr-feature-list ul {
	display: flex;
	flex-direction: column;
	padding: 0 1rem;
	gap: .5rem;
	flex-grow: 1;
	margin-bottom: 10px;
}

.tr-feature-list ul li {
	display: flex;
	align-items: flex-start;
	gap: .5rem;
	font-size: 1rem;
	line-height: 1.5;
}
.trucksheet-material .column2{
	display: flex;
}
.trucksheet-material .column2 .tr-case-list.tr-case-feature {
 margin: 0;
}

.trucksheet-material .column2 .tr-case-list.tr-case-feature img {
    height: 200px;
    object-fit: cover;
}

.tr-feature-list ul li:before {
	content: '';
	display: block;
	width: 10px;
	height: 10px;
	background-color: #315DAC;
	border-radius: 50%;
	flex-shrink: 0;
	transform: translateY(.25rem);
}

.tr-feature-list a {
	border-radius: .25rem;
	padding: .5rem;
	background-color: #507ff2;
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	color: #fff;
	font-size: .875rem;
	margin: 18px 0 24px;
	flex-shrink: 0;
}
.tr-feature-list li a {
    width: 90%;
    height: 40px;
    justify-content: center;
    margin: 0 auto 24px;
}
.tr-feature-list li p span {
	color: red;
	font-weight: bold;
	font-size: 1.0rem;
}

.tr-catch {
	display: block;
	text-align: center;
	line-height: 1.5;
	font-size: 1.25rem;
	font-weight: bold;
	margin-bottom: 22px;
}

.tr-subtitle {
	font-size: 1.25rem;
	font-weight: bold;
	line-height: 1;
	padding-bottom: 13px;
	border-bottom: 1px solid #24489B;
	margin-bottom: 1rem;
	margin-top: 2rem;
}

.trucksheet-material .contLayoutBox-Item10 {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
}

.trucksheet-material .contLayoutBox-Item10 li[data-item-color="last-color"]:not(:nth-child(10n)) {
	box-shadow: 1px 0 0 #ddd;
}

.trucksheet-material .colorVariationList .colorImg {
	height: auto;
	aspect-ratio: 1;
}

.trucksheet-material .tr-case-list--count-1 li {
	display: flex;
	gap: 50px;
	width: 100%;
	align-items: center;
}

.trucksheet-material .tr-case-list--count-1 .tr-case-item {
	width: 100%;
}

.trucksheet-material .tr-case-list:not(.tr-case-list--count-1) {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.trucksheet-material .tr-case-list:not(.tr-case-list--count-1) li {
	width: 100%;
}

.tr-cta-wrapper {
	display: flex;
	flex-direction: column;
	margin-bottom: 40px;
	margin-top: 72px;
}

.tr-cta {
	padding-top: .5rem;
	padding-left: .5rem;
	padding-right: .5rem;
	background-color: #E6E6E6;
	position: relative;
}

.tr-cta-inner {
	background-color: #fff;
	border-radius: 6px;
	padding-left: calc( 198px + 24px );
	height: 204px;
}

.tr-cta picture {
	position: absolute;
	width: 198px;
	height: auto;
	bottom: 0;
	left: 0;
}

.tr-cta picture img {
	width: 100%;
	height: auto;
	max-width: 100%;
}

.tr-cta-inner > div {
	display: flex;
	height: 100%;
	width: 100%;
	justify-content: center;
	flex-direction: column;
	gap: 1rem;
}

.tr-cta picture + div > span {
	font-size: 1.25rem;
	font-weight: bold;
	line-height: 1.2;
}

.tr-cta a {
	width: 458px;
	max-width: 100%;
	border-radius: 100px;
	padding: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #E50311;
	box-shadow: 0 4px 0 #900009;
	gap: .5rem;
	font-size: 1.5rem;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	line-height: 1;
}

.tr-cta-icon-yen {
	width: 28px;
	height: 28px;
}

.tr-cta-icon-right {
	margin-left: .5rem;
	transform: translateY(-1px);
}

.tr-cta-wrapper .comUtility {
	margin-top: 0;
	margin-bottom: 0;
}

.tr-about {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
	margin-bottom: 46px;
}

.tr-about-content h3 {
	font-size: 21px;
	color: #062D87;
	margin-bottom: 13px;
	line-height: 1.5;
	font-weight: bold;
}

.tr-about-content p {
	font-size: 1rem;
	line-height: 1.5;
	margin-bottom: 44px;
}

.tr-about-content > *:last-child {
	margin-bottom: 0;
}

.tr-feature-list.tr-lineup-list {
	gap: 15px;
}


.tr-feature-list.tr-lineup-list h3 {
	text-align: center;
}

.tr-feature-list.tr-lineup-list h3 span {
	display: block;
}

.tr-feature-list.tr-lineup-list h3 > span:first-child {
	font-size: 20px;
	font-weight: normal;
	line-height: 1.5;
}

.tr-feature-list.tr-lineup-list h3 > span:last-child {
	font-size: 1rem;
	font-weight: bold;
}

[data-type="light"] {
	background-color: #E2F0FF !important;
}

[data-type="premium"] {
	background-color: #C0DAF5 !important;
}

[data-type="mesh"] {
	background-color: #EBFFE2 !important;
}

.tr-feature-list.tr-lineup-list figure {
	height: auto;
	padding: .5rem;
}

.tr-feature-list.tr-lineup-list ul {
	gap: 0;
}

.tr-feature-list.tr-lineup-list p {
	text-align: center;
	width: 100%;
	padding: 1rem .5rem;
	font-size: 14px;
	line-height: 1.5;
}

.tr-compare-table {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	margin-bottom: 40px;
}

.tr-compare-table * {
	box-sizing: border-box;
}

.tr-compare-table th,
.tr-compare-table td {
	padding: .5rem;
	text-align: center;
	border: 1px solid #ccc;
	line-height: 1.5;
}

.tr-compare-table th {
	font-size: 13px;
	font-weight: bold;
}

.tr-compare-table th:nth-child(1) {
	width: 90px;
}

.tr-compare-table thead th {
	height: 60px;
}

.tr-compare-table td {
	font-size: 12px;
	vertical-align: top;
}

.tr-compare-table td img {
	display: block;
	text-align: center;
	margin: 0 auto;
}

.tr-compare-table td img.maru {
	height: 41px;
	width: 33px;
	transform: scale(1.3);
}

.tr-compare-table td b {
	font-size: 1rem;
	font-weight: bold;
	margin-bottom: .5rem;
	margin-top: .5rem;
	display: block;
	text-align: center;
	width: 100%;
}

.tr-compare-table td p {
	text-align: left;
	font-size: .875rem;
}

.tr-sozai-list-title {
	border: none !important;
	padding: 0;
	margin-bottom: 1rem;
}

.sozai-list-once.sozai-list-trucksheet {
	margin-left: 0;
	margin-right: 0;
}

.sozai-list-trucksheet .sozai-list-meta {
	display: flex;
	gap: .5rem;
}

.sozai-list-type {
	line-height: 1.3;
    font-size: 13px;
    display: table;
    padding: 0.2rem 0.6rem 0.2rem 0.6rem;
    border-radius: 4px;
    font-weight: lighter;
    margin: 4px 0px 5px 0px;
}

.sozai-list-trucksheet .sozai-list-link {
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
}

.sozai-list-price-title {
	font-size: 14px;
	line-height: 1.2;
	margin-bottom: .25rem;
}

.sozai-list-price-text {
	color: red;
	font-size: 15px;
	line-height: 1.5;
	font-weight: bold;
}

.sheet-filter-buttons {
	display: flex;
	gap: .5rem;
}

.sheet-filter-button {
	border-radius: 6px;
	font-size: 1rem;
	line-height: 1.5;
	font-weight: bold;
	padding: .5rem 1rem;
	background-color: #EFEFEF;
	color: #333;
	border: none;
	cursor: pointer;
}

.sheet-filter-button:hover {
	opacity: .8;
}

.sheet-filter-button.current {
	background-color: #226699;
	color: #fff;
}

.simItemSelect--type .simChoiceList .simOptInputBtn {
	justify-content: flex-start;
	align-items: center;
	text-align: left;
	height: 54px;
}

.simItemSelect--type .simChoiceList {
	padding-bottom: 1.5rem;
	border-bottom: 1px solid #DBDBDB;
	gap: 2rem;
}

.simItemSelect--type .simChoiceList .simChoiceItem > label {
	padding: 0;
}

.simItemSelect--type .simChoiceImg {
	height: 70px;
	display: flex;
	align-items: center;
}

.aori_estimateBox .tr_estStep1 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}

.aori_estimateBox .tr_estStep1 .frame {
	width: 100%;
}

.tr_estStep2 ul {
	flex-wrap: wrap;
}

.tr_estStep2 textarea {
	width: 100%;
    line-height: 1.8;
    padding: 0.3em 1em 0.3em;
    border: 5px solid #efefef;
    border-radius: 8px;
    font-size: 1rem;
    vertical-align: middle;
    box-shadow: none;
    box-sizing: border-box;
	margin-bottom: 2rem;
	margin-top: 2rem;
}

.tr_estStep2 textarea:focus {
	outline: none;
	border-color: #999;
}

.linkToList--blue,
.linkToList--blue:link,
.linkToList--blue:visited {
	border-color: #3974dd;
	box-shadow: 2px 2px 0 0 #254b81;
	color: #3974dd;
}

.linkToList--blue:hover {
	background-color: #3974dd;
	border-color: #3974dd;
	color: #fff;
}

.linkToList:hover {
	opacity: 1 !important;
}

@media (max-width: 768px) {
	.tr-feature-list {
		grid-template-columns: repeat(1, 1fr);
		gap: 1.5rem;
		margin: 22px 10px;
	}

	.tr-cta picture {
		width: 30%;
	}

	.tr-cta-inner {
		padding: 1rem;
		padding-left: calc( 30% + 12px );
		height: auto;
	}

	.tr-cta picture + div > span {
		font-size: 1rem;
		line-height: 1.3;
	}

	.tr-cta-icon-yen {
		width: 24px;
		height: 24px;
	}

	.tr-cta a {
		font-size: 1rem;
		padding: 12px;
	}

	.tr-about {
		grid-template-columns: 1fr;
		margin-left: 10px;
		margin-right: 10px;
	}

	.tr-compare-table-wrapper {
		overflow-x: auto;
		margin-left: 10px;
		margin-bottom: 40px;
	}

	.tr-compare-table {
		width: 150%;
		margin-bottom: 1rem;
		margin-right: 10px;
	}

	.tr-sozai-list-title {
		/* margin-left: 10px; */
		padding-bottom: .5rem;
		padding-left:10px;
		padding-right: 10px;
		border-bottom: 1px solid #ccc !important;
	}

	.sozai-list-once.sozai-list-trucksheet {
		margin-left: 10px;
		margin-right: 10px;
		border-top: 0;
	}

	.sozai-list-trucksheet .sozai-list-meta {
		flex-direction: column;
		gap: .25rem;
		display: inline-flex;
	}

	.sozai-list-trucksheet .sozai-list-code {
		margin-bottom: 0;
	}

	.sozai-list-trucksheet .sozai-list-type {
		margin-top: 0;
	}

	.tr-catch {
		font-size: 1.125rem;
		margin-left: 10px;
		margin-right: 10px;
	}

	.tr-case-list img {
		max-width: 100%;
	}

	.sheet-filter-buttons {
		flex-wrap: wrap;
		margin-left: 10px;
		margin-right: 10px;
		gap: .5rem;
	}

	.sheet-filter-button {
		font-size: .75rem;
		padding: .5rem 1rem;
	}

	.aori_estimateBox .tr_estStep1 {
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
	}

	.aori_estimateBox .tr_estStep1 .frame {
		margin: 0 !important;
	}

	.simChoiceList.sp-col2 {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
	}

	.simChoiceList.sp-col2 > li {
		margin: 0 !important;
	}
	.trucksheet-material .column2 {
		flex-wrap: wrap;
	}
	.trucksheet-material .tr-case-list--count-1 li {
		gap: 10px;
		flex-wrap: wrap;
	}
	ul.tr-case-list.tr-case-list--count-1 li>div,
	ul.tr-case-list.tr-case-list--count-1 li img {
		width: 100%;
	}
}