@charset "utf-8";
#wrapper{
	color:#333;}
.wrap1050{max-width:1050px; margin:auto;}
a:hover{ text-decoration:none;}
/***********************************************************
メインビジュアル画像
***********************************************************/
#main{
	/*background:url(../img/topimg.png) no-repeat 100% center;*/
	position:relative;
	width: 1050px;
    /*height: 573px;*/
	height: 359px;
	margin:auto;}
	
/***********************************************************
メインビジュアル内
***********************************************************/
#gnav{
	/*position: absolute;
    bottom: 25px;*/
    background-color:rgba(0, 105, 52, 0.3);
    width: 100%;
	font-size: 16px;}
	#gnav ul{
		width:92%;
		margin:auto;}
		#gnav li{
			display: inline;
			float: left;
			min-width: 229px;
			text-align: center;
			margin-right: 16px;}
		#gnav li:last-child{
			margin-right: 0px;}
			#gnav li a {
				display: block;
				background-color:#006934;
				color: #ffffff;
				margin: .5em auto;
				line-height: 1;
				font-weight: 500;
				padding: .5em 2em;}
			#gnav li a:hover {
				background-color: rgba(255, 255, 255, 0.8);
					color: #006934;}

#dropmenu {
  list-style-type: none;
  width: 960px;
  margin: 30px auto 500px;
  padding: 0;
}
#dropmenu li {
  position: relative;
}
#dropmenu li ul {
  list-style: none;
  position: absolute;
  z-index: 100;
  top: 100%;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 0;
}
#dropmenu li ul li {
  overflow: hidden;
  width: 100%;
  height: 0;
  color: #fff;
  transition: .2s;
}
#dropmenu li ul li a {
  padding: 13px 15px;
  background: #7c8c0e;
  text-align: left;
  font-size: 12px;
  font-weight: normal;
}
#dropmenu > li:hover > a {  background: #7c8c0e }
#dropmenu > li:hover li:hover > a {  background: #6e7c0c }
#dropmenu > li:hover > ul > li {
  overflow: visible;
  height: 38px;
}
#dropmenu li ul li ul {
  top: 0;
  left: 100%;
}
#dropmenu li:last-child ul li ul {
  left: -100%;
  width: 100%;
}
#dropmenu li ul li ul:before {
  position: absolute;
  content: "";
  top: 13px;
  left: -20px;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-left-color: #454e08;
}
#dropmenu li:last-child ul li ul:before {
  position: absolute;
  content: "";
  top: 13px;
  left: 200%;
  margin-left: -20px;
  border: 5px solid transparent;
  border-right-color: #454e08;
}
#dropmenu li ul li:hover > ul > li {
  overflow: visible;
  height: 38px;
}
#dropmenu li ul li ul li a {  background: #616d0b }
#dropmenu li:hover ul li ul li a:hover {  background: #535d09 }

/***********************************************************
20200617
***********************************************************/
.tab{text-align:center;cursor:pointer;}
.panel{display:none;}.panel.is-show{display:block;}

.wrap900{ margin:50px auto 100px; width:900px;}

a.btn{ font-size: 16px; line-height: 1; position: relative; display: inline-block; padding: 1rem 4rem; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transition: all 0.3s; transition: all 0.3s; text-align: center; vertical-align: middle; text-decoration: none; letter-spacing: 0.1em; color: #212529; border-radius: 0.5rem; margin: 0 15px;}
a.btn-tag { position: relative; padding: 1.25rem 3rem 1.25rem 80px; color: #000; } a.btn-tag:before { position: absolute; top: 0; left: 0; width: 50px; height: 100%; content: ""; border-radius: 0.5rem 0 0 0.5rem; }
a.btn-tag--chevron-down { background: #e5e5e5; }
a.btn-tag--chevron-down:before { background: #238759; }
a.btn-tag--chevron-down i { font-size: 120%; position: absolute; top: 30%; left: 0; width: 50px; text-align: center; letter-spacing: 0; opacity: 0.5; color: #fff; }
a.btn-tag--chevron-down:hover { color: #212529; background: #f2f2f2; }
a.btn-tag--chevron-down:hover i { opacity: 1; color: #fff100; }

.titleSquare{ position: relative; display: inline-block; padding: 0 50px; font-size:28px; font-weight:500; line-height: 1.3; letter-spacing: -1px; text-align:left;}
.titleSquare::before, .titleSquare::after, .titleSquare span::before, .titleSquare span::after, .titleSquare span>span::before, .titleSquare span>span::after{ width: 12px; height: 12px; position: absolute; top: 0; bottom: 0; margin: auto; content: ""; vertical-align: middle; border: 1px #f3f3f3 solid;}
.titleSquare::before, .titleSquare::after{ background:#7a0;}
.titleSquare span::before, .titleSquare span::after{ background:#036933;}
.titleSquare span>span::before, .titleSquare span>span::after{ background:#f8ff00;}
.titleSquare::before{ left: 0; } .titleSquare::after{ right: 0; }
.titleSquare span::before{ left: 15px; } .titleSquare span::after{ right: 15px; }
.titleSquare span>span::before{ left: 31px; } .titleSquare span>span::after{ right: 31px; }
.wrap900 p,.wrap900 dt,.wrap900 dd,.wrap900 li{font-size:18px;}
dl{margin:50px 0 50px 2em;box-sizing: border-box;}
ul.listDisc{padding-left: 2em;box-sizing: border-box;}
dt,.listDisc li{position: relative;margin-bottom: 1rem;}
dt:before,.listDisc li:before{content: "●";left: -1.2em;position: absolute;}
dd{margin-bottom: 2rem;}
.l_1of3{width:30%;float: left;}
.r_2of3{width: 70%;float: right;text-align: center;}
.r_2of3 span{display: inline-block; width: 30%;}
.r_2of3 img,.r_1of3 img,.tab_content li img{max-width: 100%;height: auto;}
.l_2of3{width:70%;float: left;}
.r_1of3{width: 30%;float: right;text-align: center;}
.l_1of2,.r_1of2{width: 50%;float: left;}
.tableLayout{table-layout: fixed;width: 100%;border-collapse: collapse;}
.tableLayout th{background: #eee;font-weight: 600;width: 30%;}
.tableLayout th,.tableLayout td{padding: 8px 1rem; border: 1px solid #C3C3C3;font-size: 14px;}

.tab_content li img { max-width: 174px; height: auto; max-height: 65.25px; }

.frame-wrapper__video { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; overflow: hidden; margin-bottom: 50px; }
.frame-wrapper__video iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.wrapHalf-left{width: 48%;float: left;}
.wrapHalf-right{width: 48%;float: right;}
/***********************************************************
section2*about
***********************************************************/
#about{
    margin:50px auto;
	text-align:center;
	width:1050px;}	
	#about img{
		vertical-align: baseline;}	
	#about h1{
		font-size:28px;
		font-weight:500;
		line-height: 1.3;
		margin-bottom:80px;
		letter-spacing: -1px;}
		.txtPoint{
			color:#dd960f;
			font-size:26px;
			margin-bottom:1em;
		    font-weight: 600;}
	#about dl{
		border: 8px solid #8fc31f;
		float: left;
		width: 32%;
		margin-right:2%;
		padding: 50px 34px 16px;
		box-sizing: border-box;
		min-height: 433px;
		position: relative;}
	#about dl:last-child{
		margin-right:0%}
		#about dt{
			font-size: 28px;
			color: #006934;
			line-height: 1;
			margin-bottom: 15px;}
			#about dt img{
				position: absolute;
				left: 0;
				right: 0;
				margin: auto;
				top: -13%;}
		#about dd{
			font-size: 18px;
			line-height: 1.4;
			text-align: justify;
			text-justify: inter-ideograph;}
			#about dd img{
				display:block;
				margin-bottom: 15px;}




/***********************************************************
section3*itemList
***********************************************************/
#itemList{
    padding: 0;
	width:909px;
	margin:100px auto;}
	#itemList h2{
		font-size: 30px;
		color: #FFFFFF;
		background-color:#006934;
		line-height: 1.3;
		padding: 15px 0;
		text-align:center;
		margin:0 auto 50px;}	
	#linkBtn {
		width:80%;
		margin:auto;
		font-size:27px;
		line-height:1.5;
		font-weight:600;}
		#linkBtn > div{
			background:url(../img/linkbtn.png) no-repeat;
			width:342px;
			height:143px;
			display:table;
			cursor:pointer;}
		#linkBtn > div:first-child{
			float:left;}
		#linkBtn > div:last-child{
			float:right;}
			#linkBtn span{
				display:table-cell;
				text-align:center;
				vertical-align:middle;}
	a:hover {
		opacity: unset;
	}
	.tab_content{
		margin:30px auto;}
		.tab_content ul{
			padding-left: 2%;}
			.tab_content li{
				display:inline;
				float:left;
				width:22.5%;
				margin: 2.3% 1% 0;
				text-align:center;
				border:1px solid #666666;
				box-sizing:border-box;
				cursor:pointer;
				font-weight: bold;
				font-size: 16px;}
			.tab_content #category li,
			.tabLi li{
				padding:1rem;}
			.tab_content2{
				background-color:#EBF6F5;}
				#tab2_cont li a,
				.tab_content2 li a{
					display:block;
					padding:1rem;
					background-color:#FFFFFF;}
				.tab_content li:hover{
					background-color:#FF0000;
					color:#FFFFFF;}
					#tab2_cont li a img, .tab_content2 li a img {
						max-width: 174px;
						height: auto;
						max-height:65.25px;}
		.tab_content li.select {
				background: #2fb5d8;
				color: #fff;
				border: 1px solid #2fb5d8;}
		.cont_close ul{
			padding-left: 0;}
			.cont_close li{
				display: block;
				width: 94%;
				float: none;
				margin: 2.3% auto;
				padding: 1rem;
				border: none;
				background-color: #666;
				color: #fff;}
/***********************************************************
section4*solution
***********************************************************/
#solution{
    padding: 0 0 50px;
	margin:50px auto;
	position:relative;}
#solution .solutionInner{
	background-color: #f6f6c1;
	padding-bottom: 100px;}
#solution .solutionInner:last-child{
	background-color: #EBF6F5;}
	#solution h3{
		font-size: 40px;
		color: #FFFFFF;
		background-color:#8FC31F;
		border-radius:50px;
		line-height: 1;
		padding: 30px 0;
		text-align:center;
		width:60%;
		margin:0 auto 50px;
		position: absolute;
		top: -2%;
		left: 0;
		right: 0;}
	#innerBox,
	#innerBox2{
		width:909px;
		margin:auto;
		padding-top: 100px;}
	#innerBox h5,
	#innerBox2 h5{
		font-size: 22px;
		text-align: center;
		margin: 0 auto 2em;}
		.readmore {
			max-height: 0;
			width:auto;
			background-color: #ffffff;}		
		.readmore dt{
			font-size:24px;
			background-color:#A1D8E6;
			text-align:center;
			line-height: 1.3;
			position:relative;}
		#innerBox2 .readmore dt{
			font-size:32px;
		    line-height: 1.8;
			background-color:#2ba59b;
			color:#FFFFFF;
			letter-spacing: 2px;}
			.readmore dt span{
				display:block;
				padding:1.5em 0;}
		.readmore dd{
			width:654px;
			margin:50px auto;
			font-size:14px;
			letter-spacing:-1px;}
			.readmore dd p{
				margin-bottom:30px;}
			.readmore dd p > span{
				display: block;
				text-align: center;
				font-size: 28px;
				font-weight: 600;
				color: #333;
				margin-bottom: 1em;}
			#innerBox2 ol{
				margin-top: 50px;}
				#innerBox2 li{
					font-size: 22px;
					line-height: 1;
					font-weight: 600;
					margin-bottom: 16px;}
					#innerBox2 li > span{
						color: #058d83;
						transform: scaleX(0.8);
						display: inline-block;}
		#innerBox .titleBar:after{
			content:" ";
			background-image: url(../img/detail.png);
			background-repeat:no-repeat;
			width:156px;
			height:30px;
			position:absolute;
			bottom: -12px;
			right: 0;}
	a.open, a.close {
		background-color: #FFFFFF;
		text-align: center;
		padding: 0.3em 0;
		font-size: 16px;
		font-weight:600;
		color: #006934;
	}
		
/***********************************************************
section5*contact
***********************************************************/
#contact{
	margin: 60px auto;
	width: 1050px;
	position: relative;}
	#contact h4{
		position: absolute;
		left: 60px;
		color: #ffffff;
		top: 70px;
		font-size: 40px;
		width: 500px;
		line-height: 1.3;}
	#contact p{
		position: absolute;
		left: 60px;
		color: #ffffff;
		bottom: 70px;
		font-size: 23px;
		width: 500px;
		width: 520px;
		letter-spacing: -2px;}
	#contact a{
		display: block;
		background-color: rgba(130, 0, 16, 0.8);
		color: #fff;
		border-radius: 30px;
		position: absolute;
		bottom: 50px;
		right: 50px;
		margin: auto;
		width: 310px;
		font-size: 16px;
		padding: .4em 1em;
		text-align: center;
		line-height: 1;}
		#contact a:hover {
			filter:alpha(opacity=80);
			-moz-opacity: 0.8;
			opacity: 0.8;}

/***********************************************************
製品・メーカー詳細
***********************************************************/
#products{
    margin:50px auto;
	text-align:center;
	width:1050px;}	
	#products h1{
		font-size:28px;
		font-weight:500;
		line-height: 1.3;
		margin-bottom:30px;
		letter-spacing: -1px;}
	#products li {
		margin-bottom: 10px;
		padding-left: 1.5em;
		font-size: 1.3em;
		line-height: 1.4;}
	.content{
		padding: 50px 30px 50px 0;
		border-bottom: 1px solid #9fa0a0;}
		.imgBox{
			float:left;
			width:433px;}

		.textBox{
			margin-left:433px;
			text-align: justify;
			text-justify:inter-ideograph;}
			.textBox  h2{
				font-size: 24px;
				color: #006934;
				border-left: 5px solid #006934;
				line-height: 1.1;
				padding: 15px 1rem;
				margin:0 auto 50px;}
			.textBox  h2 > span{
				letter-spacing:-1px;}
			#products h3{
				font-size: 18px;
				line-height: 1;
				margin:0 auto 1rem;
				font-weight:600;
				letter-spacing:2px;}	
			.textBox  p{
				margin-bottom:1.6rem;}
			ul.list-circle li {
				margin-bottom: 10px;
				padding-left: 1.5em;
				font-size: 1.3em;
				line-height: 1.4;
				position: relative;
				vertical-align: middle;}
			ul.list-circle > li:before {
				content: "●";
				color: #006934;
				position: absolute;
				top: 1px;
				left: 0;}

article h4{font-size: 1.4em; margin: 1em auto .5em;}

/*20200214追加～products/mbel/index.html～*/
    .news{
        width: 1050px;
        margin-left: auto;
        margin-right: auto;
/*		border-bottom: 1px solid #9fa0a0;*/
		padding: 10px 30px 40px 0;}
		.news-textBox{
            float: left;
            margin-top: 60px;
/*			text-align: center;*/
            margin-bottom: 20px;}
	    	#main-h2{
                margin-left: 155px;
                margin-bottom: 20px;
				font-size: 30px;
                font-weight: 800;
                color:deeppink;}
	    	#main-sub{
                margin-left: 140px;
                padding: 5px;
				font-size: 20px;
                font-weight: 600;
                border:solid 1px royalblue;
                color:royalblue;}
       
		.news-imgBox{
			float:right;
			width:433px;}
            .news-imgBox img{
            width: 400px;}

        .main-content{
                width: 850px;
                font-size: 22px;
                text-align: left;
				border-left: 5px solid #006934;
				line-height: 1.2;
				padding: 15px 1rem;
				margin:0 auto 20px;}

        .detail-content{
                width: 800px;
                text-align: left;
				line-height: 1.1;
				padding: 15px 1rem;
				margin:0 auto 20px;}
			.detail-content #detail-list li {
                font-size: 20px;
				margin-bottom: 10px;
				padding-left: 1.5em;
				line-height: 1.4;
				position: relative;
				vertical-align: middle;}
			.detail-content #detail-list > li:before {
				content: "●";
				color: #006934;
				position: absolute;
				top: 1px;
				left: 0;}
/*以上20200214追加*/


.table-layout{
	width: 100%;
	border: 1px solid;
	border-collapse: collapse;
}
.table-layout td,.table-layout th{
	text-align: center;
	vertical-align: middle;
	padding: 8px 1em;
	font-size: 1.0rem;
	line-height: 1.7;
	border: 1px solid;
}
#nvidiaID.table-layout thead th{
	background-color: #77aa00;
	font-weight: 700;
}
#nvidiaID.table-layout tbody th{
	background-color: #C8C8C8;
	font-weight: 700;
}


#logoArea{
	margin-bottom: 50px;
}
#logoArea img{
	float: left;
}
#logoArea span{
	display: block;
	margin-left: 200px;
}


/***********************************************************
sidenav
***********************************************************/
#wrapFull{ position:relative;}
#sidenav {
	left: 0;
	display:none;
	right: 0;
	bottom:0;
	z-index: 10;
	background-color: rgba(255, 255, 255, .8);
}
#sidenav h3 {
    font-size: 1.2em;
    margin-bottom: 8px;
    font-weight: 600;
    text-align: center;
	margin-top: 8px;
}
#sidenav ul {
	text-align:center;
}
#sidenav li {
	display:inline-block;
	vertical-align:bottom;
}
#sidenav a {
    background-color: #b70003;
    color: #fff;
    padding: .5em 2em;
	position:relative;
    border:1px solid;
}
#sidenav a:before {
	content: '\f105';
    position: absolute;
    right:10px;
    font-family: FontAwesome;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all .4s;
    transition: all .4s;
	
}
#sidenav a:hover {
    color: #b70003;
	background-color:#FFFFFF;
}

/***********************************************************
産業用ラックシステムサービス210113
***********************************************************/

.rackTextBox {
    padding: 0.5em 1em;
    font-weight: bold;
    border: solid 1px #000000;
    text-align: center;
    display: block;
    width: 300px;
    margin: auto;}
.rackTextBox p {
    margin: 0; 
    padding: 0;
}
.settsuImg  {
         margin: -100px 0 0 600px;
         width: 270px;
}
.rackBrank{
		padding: 4px 0;
		margin-left: 20px;
		line-height: 30px;
}
.rackBrank1{
	font-size: 16px !important;
	padding: 4px 0;
	line-height: 30px;
}

.rackBox1{
 display: table-cell;
 color: black;
 height:100px;
 /*background-color: red;*/
 margin: 20px;
 padding: 20px;
}
.rackBox2{
 display: table-cell;
 color: black;
 height:100px;
 /*background-color: blue;*/
 margin: 20px;
 padding: 20px;}
.rackBox3{
 display: table-cell;
 color:black;
 height:100px;
 /*background-color: green;*/
 margin: 20px;
 padding: 20px;}
.settsuImg11{
 margin-bottom:15px;}
.rackBox1  a {
 color:blue;
 font-size:17px;
 text-decoration: underline;}
.rackBox2  a {
 color:blue;
 font-size:17px;
 margin-top:46px;
 text-decoration: underline;}
.rackBox3  a {
 color:blue;
  font-size:17px;
 margin-top:46px;
 text-decoration: underline;}


/***********************************************************
ご参考構成スタート
***********************************************************/

.sanko-container {
	font-weight: bold;
    font-size: 12px;
	margin-top: 3em;
	position: relative;
	text-align: center;
}
.sanko-textR {
	position: absolute;
	top: 14em;
	left: -6em;
	width: 50%;
}
.lineR {
	margin: 12px;
	overflow :hidden;
	color: rgb(51, 66, 99);
	text-align: right;
	line-height: 1.6em;
  }
  .lineR:before {
	display: block;
	float: right;
	margin-top: .6em;
	border-top: 4px solid #f00;
	width: 60px;
	content: "";
  }
  .lineR-3 {
	padding-right: 2em;
	margin: 12px;
	overflow :hidden;
	color: rgb(51, 66, 99);
	text-align: right;
	line-height: 1.6em;
  }
  .lineR-3:before {
	display: block;
	float: right;
	margin-top: .6em;
	border-top: 4px solid #f00;
	width: 40px;
	content: "";
  }


.sanko-textL {
	position: absolute;
	top: 0;
	left: 43em;
	width: 50%;
}
.sanko-textL div:nth-child(2) {
	margin-top: 1.5em;
}
.sanko-textL div:nth-child(3) {
	margin-top: 4em;
}
  .lineL {
	margin: 10px;
	overflow :hidden;
	color: rgb(51, 66, 99);
	text-align: left;
	line-height: 1.6em;
  }
  .lineL span {
	  padding-left: 5em;
  }
  
  .lineL:before {
	display: block;
	float: left;
	margin-top: .6em;
	border-top: 4px solid #f00;
	width: 60px;
	content: "";
  }

  /***********************************************************
ご参考構成終わり
***********************************************************/


.pasokon-img {
	margin-top: -4em;
}
.pasokon2 {
	margin: -100px 0 0 600px;
}
.settsu-img {
	margin: -138px 0 2.5em 650px;
}
.settsuImg2  {
	margin: -200px 0 0 600px;
	width: 220px;
}
.settsuImg3  {
	margin: -70px 0 0 500px;
	width: 340px;
}

.rackTextBox2 {
	font-weight: bold;
	border: solid 1px #000000;
	text-align: center;
	display: block;
	width: 400px;
	margin: auto;
}
.mb50-margin0 {
	margin-bottom: 0 !important;
}