@charset "UTF-8";

/* ──────────── */
/*	共通					*/
/* ──────────── */

header, footer {
	margin-right: -15px;
	margin-left: -15px;
	color: #FFF;
}
.bg-full{
	background-color: #20176D;
}

h1, h2, h3, h4, h5, h6 {
	width: 100%;
	padding: 5px;
	color: #ffffff;
	background-color: #20176D;
	padding: 5px;
}

.col-form-label {
	background-color: #23176D;
	color: #ffffff;
	font-weight: bold;
/*	font-size: medium;*/
	font-style: normal;
	font-weight: bold;
}

.is-invalid .form-check-label {
	color: inherit;
}
.is-invalid .invalid-feedback {
	display: inherit;
	font-weight: bold;
}

.chapter {
	border-left: solid 55px #8f942e;
}

.chapter:before {
	position: relative;
	left: -2.5rem;
	transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}

.chapter1:before {
	content: "1";
}

.chapter2:before {
	content: "2";
}

.chapter3:before {
	content: "3";
}

.opacity {
	zoom: 1;
	opacity: 0.5;
	-moz-opacity: 0.5;
	filter: alpha(opacity = 50);
	-ms-filter: "alpha(opacity=50)";
}

.noBg {
	display: none;
	zoom: 1;
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity = 0);
	-ms-filter: "alpha(opacity=0)";
}

.noBg.debug {
	display: inherit;
	opacity: 1;
	-moz-opacity: 1;
	filter: alpha(opacity = 100);
	-ms-filter: 'alpha(opacity=100)';
	background-color: #F6F6F6;
}

.noBg.debug .form-group {
	margin: 0;
	padding: 0;
}

.noBg.debug .form-control {
	/* 	width: inherit; */
	/* 	height: inherit; */
	padding: 0;
}

.disp-sp {
	display: none;
}

@media ( max-width : 992px) {
	.disp-pc {
		display: none;
	}
	.disp-sp {
		display: inline;
	}
	
	.col-form-label {
		margin-bottom: 10px;
	}
}

/* ──────────── */
/*	ヘッダー				*/
/* ──────────── */
header h1 {
	font-size: 1.8rem;
    margin-bottom: 0;
}
@media ( max-width : 992px) {
	header h1 {
		font-size: 2rem;
	}
}

header img {
	width: 200px;
	padding-top: 5px;
}

@media ( max-width: 992px) {
	header h1 {
		font-size: 1.6rem;
		margin-bottom: 0;
	}
	header img.img-fluid {
		margin-bottom: 0;
		float: left;
		vertical-align: top;
	}
	
}

/* ──────────── */
/*	フッター				*/
/* ──────────── */
@media ( max-width : 992px) {
	footer h6 {
		font-size: 90%;
	}
}

/* ──────────── */
/*	メインコンテンツ		*/
/* ──────────── */
form>.row {
	margin-top: 50px;
}

/* ──────────── */
/*	配列（#BL-array）		*/
/* ──────────── */
#BL-array .disp-pc {
	font-size: 16px;
	margin-left: 10px;
}

#BL-array .disp-sp {
	font-size: 14px;
}

#BL-array-rBox,
#BL-array-lBox{
   
}


/* デフォの調整 */

.bg
{
    background-color: #EBEBEE;
}
.bgBox
{
    background-color: #EBEBEE;
    padding: 15px;
}
#BL-array-inn{
    background-color: #EBEBEE;
}



/* ベアリング種類 */
#BL-array .form-group .col-md-9 {
	flex: initial;
	max-width: inherit;
}

#BL-array .form-check {
	float: left;
}

#BL-array .form-check label {
	width: 130px;
	height: 110px;
	background-repeat: no-repeat;
	/* 	background-position: left top; */
	background-size: contain;
	margin-bottom: 1.25em;
}

#BL-array .form-check label[for="j-1"] {
	background-image: url(../../img/bearings/array_front01.jpg);
}

#BL-array .form-check label[for="j-2"] {
	background-image: url(../../img/bearings/array_front02.jpg);
}

#BL-array .form-check label[for="j-3"] {
	background-image: url(../../img/bearings/array_front03.jpg);
}

#BL-array .form-check label[for="j-4"] {
	background-image: url(../../img/bearings/array_front04.jpg);
	width: 260px;
}

#BL-array .form-check label[for="k-1"] {
	background-image: url(../../img/bearings/array_back01.jpg);
}

#BL-array .form-check label[for="k-2"] {
	background-image: url(../../img/bearings/array_back02.jpg);
}

#BL-array .form-check label[for="k-3"] {
	background-image: url(../../img/bearings/array_back03.jpg);
}

#BL-array .form-check label[for="k-4"] {
	background-image: url(../../img/bearings/array_back04.jpg);
}

#BL-array .form-check label[for="k-5"] {
	background-image: url(../../img/bearings/array_back05.jpg);
}

#BL-array .form-check label[for="k-6"] {
	background-image: url(../../img/bearings/array_back06.jpg);
}

#BL-array .form-check input {
	position: relative;
	left: 70px;
	margin-bottom: 10px;
}

#BL-array .form-check input#j-4 {
	left: 120px;
}

@media ( max-width : 992px) {
	#BL-array h2 {
		font-size: 1.8rem;
	}
	#BL-array h3 {
		font-size: 1.25rem;
	}
	#BL-array .form-check label {
		width: 91px;
		height: 77px;
	}
	#BL-array .form-check label[for="j-4"] {
		width: 220px;
	}
	#BL-array .form-check input {
		left: 55px;
		margin-bottom: 5px;
	}
	#BL-array .form-check input#j-4 {
		left: 85px;
	}
}

/* ────────────── */
/*	配列　図面（#BL-array-inn）	*/
/* ────────────── */
/* 図面入れ替え */
#BL-array-inn #drawingBox img {
	margin-bottom: 50px;
	background-position: left top;
	background-repeat: no-repeat;
}

#BL-array-inn i{
	width: 35px;
	height: 35px;
	background-size: contain;
	display: block;
/*
	margin: 15px;
	background-color: aqua;
	background-position: left top;
*/
	
}

#BL-array-inn span span{
	width: 35px;
	height: 35px;
	background-size: contain;
	display: block;
	background-position: left top;
	
}

#BL-array-inn #drawingBox.dr01 img {
	content: url(../../img/bearings/drawing/01.jpg);
}

#BL-array-inn #drawingBox.dr02 img {
	content: url(../../img/bearings/drawing/02.jpg);
}

#BL-array-inn #drawingBox.dr03 img {
	content: url(../../img/bearings/drawing/03.jpg);
}

#BL-array-inn #drawingBox.dr04 img {
	content: url(../../img/bearings/drawing/04.jpg);
}

#BL-array-inn #drawingBox.dr05 img {
	content: url(../../img/bearings/drawing/05.jpg);
}

#BL-array-inn #drawingBox.dr06 img {
	content: url(../../img/bearings/drawing/06.jpg);
}

#BL-array-inn #drawingBox.dr07 img {
	content: url(../../img/bearings/drawing/07.jpg);
}

#BL-array-inn #drawingBox.dr08 img {
	content: url(../../img/bearings/drawing/08.jpg);
}

#BL-array-inn #drawingBox.dr09 img {
	content: url(../../img/bearings/drawing/09.jpg);
}

/* 図面入れ替え（デバッグ） */
#BL-array-inn #drawingBox.dr01debug img {
	content: url(../../img/bearings/drawing/debug/01.jpg);
}

#BL-array-inn #drawingBox.dr02debug img {
	content: url(../../img/bearings/drawing/debug/02.jpg);
}

#BL-array-inn #drawingBox.dr03debug img {
	content: url(../../img/bearings/drawing/debug/03.jpg);
}

#BL-array-inn #drawingBox.dr04debug img {
	content: url(../../img/bearings/drawing/debug/04.jpg);
}

#BL-array-inn #drawingBox.dr05debug img {
	content: url(../../img/bearings/drawing/debug/05.jpg);
}

#BL-array-inn #drawingBox.dr06debug img {
	content: url(../../img/bearings/drawing/debug/06.jpg);
}

#BL-array-inn #drawingBox.dr07debug img {
	content: url(../../img/bearings/drawing/debug/07.jpg);
}

#BL-array-inn #drawingBox.dr08debug img {
	content: url(../../img/bearings/drawing/debug/08.jpg);
}

#BL-array-inn #drawingBox.dr09debug img {
	content: url(../../img/bearings/drawing/debug/09.jpg);
}

#BL-array-inn label[for="ddd2"], #BL-array-inn label[for="sel-d3"], #BL-array-inn label[for="d2"] {
	background-color: inherit;
}

#BL-array-inn i#fr {
	content: url(../../img/bearings/drawing/icon_Fr.jpg);
	background-size: contain;
	display: block;
}

#BL-array-inn i#fa {
	content: url(../../img/bearings/drawing/icon_Fa.jpg);
}

#BL-array-inn i#ddd1 {
	content: url(../../img/bearings/drawing/icon_DD1.jpg);
}

#BL-array-inn i#ddd2 {
	content: url(../../img/bearings/drawing/icon_DD2.jpg);
}

#BL-array-inn i#ddd3 {
	content: url(../../img/bearings/drawing/icon_DD3.jpg);
}

#BL-array-inn i#d1 {
	content: url(../../img/bearings/drawing/icon_d1.jpg);
}

#BL-array-inn i#d2 {
	content: url(../../img/bearings/drawing/icon_d2.jpg);
}

#BL-array-inn i#l1 {
	content: url(../../img/bearings/drawing/icon_L1.jpg);
}

#BL-array-inn i#l2 {
	content: url(../../img/bearings/drawing/icon_L2.jpg);
}

#BL-array-inn span#fr {
	content: url(../../img/bearings/drawing/icon_Fr.jpg);
}

#BL-array-inn span#fa {
	content: url(../../img/bearings/drawing/icon_Fa.jpg);
}

#BL-array-inn span#ddd1 {
	content: url(../../img/bearings/drawing/icon_DD1.jpg);
}

#BL-array-inn span#ddd2 {
	content: url(../../img/bearings/drawing/icon_DD2.jpg);
}

#BL-array-inn span#ddd3 {
	content: url(../../img/bearings/drawing/icon_DD3.jpg);
}

#BL-array-inn span#d1 {
	content: url(../../img/bearings/drawing/icon_d1.jpg);
}

#BL-array-inn span#d2 {
	content: url(../../img/bearings/drawing/icon_d2.jpg);
}

#BL-array-inn span#l1 {
	content: url(../../img/bearings/drawing/icon_L1.jpg);
}

#BL-array-inn span#l2 {
	content: url(../../img/bearings/drawing/icon_L2.jpg);
}

#BL-array-inn .input-group-prepend .input-group-text {
	padding: 0 .75rem 0 0;
	border: none;
	background-color: inherit;
}

#BL-array-inn .form-control {
	border-top-left-radius: .25rem;
	border-bottom-left-radius: .25rem;
}

/* #BL-array-inn .form-control { */
/* 	width: 3rem; */
/* 	height: inherit; */
/* 	border-radius: .25rem; */
/* } */

/* ──────────── */
/*	選定（#BL-select）		*/
/* ──────────── */
#BL-select>div.col-md-6:last-child {
	max-width: 49.9%;
	margin-left: auto;
}

#BL-select .form-check {
	float: left;
	margin-right: 10px;
}

@media ( max-width : 992px) {
	#BL-select>div.col-md-6:last-child {
		max-width: initial;
		margin-left: initial;
	}
	#BL-select .form-check {
		float: none;
	}
	header h1 {
		font-size: 1.6rem;
	}
}

/* ────────────── */
/*	運転条件（#BL-condition）	*/
/* ────────────── */
#BL-condition .form-check {
	float: left;
	margin-right: 10px;
}

#BL-condition #BL-condition-resultBox {
	margin: 10px;
	border: #D8868C solid 1px;
	background-color: #FFF;
	color: #BF343A;
	font-size: 120%;
}

#BL-condition #BL-condition-resultBox .form-group {
	margin-top: 1rem;
}

#BL-condition #BL-condition-resultBox .col-form-label {
	background-color: inherit;
	color: #BF343A;
}
#BL-condition #BL-condition-resultBox .form-control {
	border: 3px solid #BF343A;
}


#dmn{
	font-size: 28px;
	color: #BF343A;
	line-height: 120%;
	height: auto;
}

#allowablerotation{
	font-size: 28px;
	color: #BF343A;
	line-height: 120%;
	height: auto;
}


@media ( max-width : 1024px) {
		#dmn{
		font-size: 16px;
	}

	#allowablerotation{
		font-size: 16px;
	}
}

@media ( max-width : 992px) {
	#BL-condition .form-check {
		float: none;
	}
}

/* ────────────── */
/*	ボタン（#BL-button）		*/
/* ────────────── */
#BL-button .btn {
	padding: 0;
	border: none;
	background: none;
}

/* ────────────── */
/*	BT打ち消し					*/
/* ────────────── */
.form-group{
    margin-bottom: 5px;
}
.form-check-input.is-invalid ~ .form-check-label, .was-validated .form-check-input:invalid ~ .form-check-label{
    color: #333333;
}
.input-group-text{
    border: none;
    background: none;
}
.is-invalid .form-control{
    border: solid 1px #B0B0B0;
}


/* add 20200324 */
.btn-secondary img{
	height: 42px;
	margin-bottom: 15px;
}
.mx-auto.btn-secondary img{
	height: 70px;
}
