@charset "UTF-8";

.kataban_font {
	font-size: 16px;
	font-weight: 600;
	color: #444;
	cursor: pointer;
}

main td {
	background: unset;
}

@media (max-width: 579px){
	.container_max-width {
		max-width: 95%;
	}
}

@media (min-width: 768px) {
	.table_caption_pc {
		display: unset;
	}
	.table_caption_sp {
		display: none;
	}
}
@media (max-width: 767px) {
	.table_caption_pc {
		display: none;
	}
	.table_caption_sp {
		display: unset;
	}
}

.datatable_caption_top_start {
	position: absolute;
	top: -28px;
}

.margin-left_5r {
	margin-left: 5rem !important;
}

/* ライトマックス */
.row_bg1 {
	background-color: #ffabab;
}

/* カミオンマックス */
.row_bg2 {
	background-color: #fffae1;
}

/* リング付タイヤチェーン */
.row_bg3 {
	background-color: #b4f5ba;
}

/* ヘキサグリップ */
.row_bg4 {
	background-color: #f7d1e8;
}

/* Ｓラグチェーン */
.row_bg5 {
	background-color: #f0f0f0;
}

/* ＳラグチェーンH形 */
.row_bg6 {
	background-color: #00ef6d
;
}

/* Vラグチェーン */
.row_bg7 {
	background-color: #d3d8f5;
}

/* トラッカーファイブ */
.row_bg8 {
	background-color: #bae4f7;
}

/* FixedHeader のクローンにも枠線 */
table.dataTable.fixedHeader-floating th {
	background-color: #f0f0f0;
	z-index: 102;
	border-top: 1px solid #B3B3B3;
	border-left: 1px solid #B3B3B3;
	text-align: center;
	padding: 0.6rem;
	vertical-align: middle;
	border-bottom-left-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
	border-bottom: 1px solid #B3B3B3;
}
table.dataTable.fixedHeader-floating th:last-child {
	border-right: 1px solid #B3B3B3;
}

table.dataTable.fixedHeader-locked th {
	background-color: #f0f0f0;
	z-index: 102;
	border-top: 1px solid #B3B3B3;
	border-left: 1px solid #B3B3B3;
	text-align: center;
	padding: 0.6rem;
	vertical-align: middle;
	border-bottom-left-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
	border-bottom: 1px solid #B3B3B3;
}
table.dataTable.fixedHeader-locked th:last-child {
	border-right: 1px solid #B3B3B3;
}

/* スクロール時に下の要素が透けないように */
table.dataTable.fixedHeader-floating {
	background-color: #f0f0f0;
	height: inherit;
}

.loading_area {
	position: relative;
	margin-top: 3rem;
	display: flex;
	justify-content: center;
}

.margin-l_40p {
	margin-left: 40px;
}

.loading{
	position:absolute;
	width:25px;
	height:25px;
	left: calc(50% - 5rem);
}
.loading > .dot{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
}
.loading > .dot:after{
	content:"";
	position:absolute;
	left:calc(50% - 10px);
	top:0;
	width:25%;
	height:25%;
	border-radius:50%;
	background-color:black;
	border:0;
	margin:0;
	padding:0;
	font-size:0;
	animation: anim-rotate-dot 1.2s ease-in-out infinite;
}
.loading > .dot:nth-child(1){transform:rotate(0deg);}
.loading > .dot:nth-child(1):after{animation-delay: 0s;}
.loading > .dot:nth-child(2){transform:rotate(45deg);}
.loading > .dot:nth-child(2):after{animation-delay: -1.05s;}
.loading > .dot:nth-child(3){transform:rotate(90deg);}
.loading > .dot:nth-child(3):after{animation-delay: -0.9s;}
.loading > .dot:nth-child(4){transform:rotate(135deg);}
.loading > .dot:nth-child(4):after{animation-delay: -0.75s;}
.loading > .dot:nth-child(5){transform:rotate(180deg);}
.loading > .dot:nth-child(5):after{animation-delay: -0.6s;}
.loading > .dot:nth-child(6){transform:rotate(225deg);}
.loading > .dot:nth-child(6):after{animation-delay: -0.45s;}
.loading > .dot:nth-child(7){transform:rotate(270deg);}
.loading > .dot:nth-child(7):after{animation-delay: -0.3s;}
.loading > .dot:nth-child(8){transform:rotate(315deg);}
.loading > .dot:nth-child(8):after{animation-delay: -0.15s;}
@keyframes anim-rotate-dot{
	0%{opacity:0.0;}
	35%{opacity:1.0;}
	70%{opacity:0.0;}
	100%{opacity:0.0;}
}

.tirechain_list_area {
	margin-top: 3rem !important;
}

.max_width-200p {
	max-width: 200px;
}

.flex-1 {
	flex: 1;
}

.margin_l-0 {
	margin-left: 0;
}

.margin_r-1r {
	margin-right: 1rem;
}

.border-white {
	color: white;
	border: 1px solid;
	opacity: 100;
}

.input_wrap {
	white-space: normal;
	flex-wrap: wrap;
}

.disp_inline-block {
	display: inline-block;
}

@media (max-width: 992px) {
	.how_to_read_tire_size-margin {
		margin-top: 0.7rem;
		margin-left: 5rem;
	}
}

.margin_t-0 {
	margin-top: 0;
}

.align_items-center {
	align-items: center;
}

.text_align-center {
	text-align: center;
}

.result_1row_message {
	display: inline-block;
	background-color: #fffae1;
	margin-top: 0.5rem;
	margin-bottom: 0;
	max-width: 700px !important;
	padding: 0.5rem;
}

.disp-none {
	display: none;
}

.padding_l-08r {
	padding-left: 0.8rem;
}

@media (max-width: 1399px) {
	.tire_size-mt {
		margin-top: 0.5rem;
	}
}

.reset_conditions {
	width: 200px;
}

.text_align-right {
	text-align: right;
}