@charset "UTF-8";

#business { line-height: 1.9 }

#business p { margin-bottom: 15px }

#business .base_gray h2 { 
    font-size: 2.5rem;
    font-weight: bold;
    color: #192151;
}

/* 標準電源 */
#business1_box1 h2 { float: left; margin-top: -10px }

/* カスタム電源 */
#business2_box1 img { display: block }

#custom_list { margin-bottom: 50px }

#custom_list dt { 
    float: left; height: 75px; padding: 20px;
    background: #333; font-size: 1.6rem;
    color: #fff; font-weight: normal;
}
#custom_list dd { 
    height: 75px; padding: 15px 20px 20px 160px;
    background: #222; color: #bbb;
}

#business2_box3 h2 { 
    position:relative; width:60%;
    margin: 0 auto 30px auto;
    font-size:2.2rem !important;
    text-align:center;
}

#business2_box2 { 
    padding-bottom: 50px;
    background: url(images/arrow1.png) 400px 100px no-repeat;
}

#business2_box2 dt { margin-bottom: 10px; font-size: 1.8rem; font-weight: bold }

#custom_left { 
    float: left; width: 410px; height: 290px;
    padding: 20px; border: 10px #eceefb solid;
}
#custom_left dt, #custom_left i { color: #3a4379 }

#custom_left dd { margin-bottom: 8px; font-size: 1.5rem }

#custom_right { 
    float: right; width: 500px; height: 290px;
    padding: 20px; border: 10px #fbebea solid;
}
#custom_right dt { color: #d7241b }

#custom_right dd { margin-bottom: 8px; font-size: 1.5rem }

#custom_right i { padding-right: 5px; color: #d7241b }

#business2_box3 h2:before,
#business2_box3 h2:after { position: absolute;
		  					top: -5px; content:'';
							vertical-align: middle }

#business2_box3 h2:before { width:20px; height:30px; left:30px;
							border-left:#222 2px solid;
							-webkit-transform: rotate(-45deg);
							transform: rotate(-45deg) }
							
#business2_box3 h2:after { width:20px; height:30px; right:30px;
							border-right:#222 2px solid;
							-webkit-transform: rotate(45deg);
							transform: rotate(45deg) }

#business2_box3 li { height: 200px }

#business2_box3 figure { height: 200px }


/* LED電源 */
#business3_box1 p { margin: 0; text-align: center }

#business3_box2 { padding-bottom: 20px }

#business3_box2 h2 { margin-bottom: 30px; text-align: center }

/* ACアダプタ */
#business4_box1 { padding: 20px 0 60px 0 }

#business4_box1 dd a { text-decoration: underline }

#business4_box2 h2 { margin-bottom: 30px; text-align: center }

/* 電流センサー */
#business5_box1 { padding: 20px 0 60px 0 }

#business5_box2 h2 { float: left; margin-top: -10px }

.table-design{
    width:100%;
	border-collapse: collapse;
    border: 1px solid #ccc;
    text-align: center;
    margin:20px 0 40px 0;
}
.table-design th{
    background: #ffd52b;
    border:1px solid #bbb;
    padding:10px 5px;
	font-size:1.2rem; line-height:130%;
	font-weight:normal; color:#222;
    vertical-align:middle;
}
.table-design td{
    border:1px solid #ccc;
    padding:15px 5px;
	background: #fff;
	font-size:1.2rem; line-height:130%;
    vertical-align: middle;
}

.table-design img { width:80px; padding-top:5px }

/* システム開発 */
#business6_box1 { 
    min-height: 400px; margin-bottom: 40px;
    padding-right: 480px; 
    background: url(images/pr6_bg1.png) right top no-repeat;
}
#business6_box1 h3 { 
    padding: 20px 0 10px 0;
    color: #192151; font-weight: bold;
    font-size: 2.8rem; line-height: 1.3;
}
#business6_box2 h3 { 
    padding: 10px 0 5px 0; font-weight: bold;
    font-size: 2rem; line-height: 1.3;
}
#business6_box2 .clearfix { margin-bottom: 20px }

#business6_box2 .button--medium { margin: 20px 0 }

#business6_box3 h2 { margin-bottom: 30px; text-align: center }

#business6_box3 p { font-size:1.3rem }

/* 使用機材・装置 */
#equipment1_box1 { 
    min-height: 320px; margin-bottom: 40px;
    padding-right: 330px; 
    background: url(images/eq1_bg1.jpg) right top no-repeat;
}

#equipment1_box1 h3 { 
    padding-bottom: 5px;
    color: #192151; font-weight: bold;
    font-size: 2.8rem; line-height: 1.3;
}

#equipment1_box1 h3 small { font-size: 2.0rem }

#equipment1_box1 h4 { 
    padding-bottom: 10px;
    color: #192151;
    font-size: 1.8rem;
}

.spec { padding-top:10px }

.spec dt  { clear:both; float:left; width:180px; padding-left:10px }

.spec dd {
    margin-bottom: 12px;
    padding: 0 0 12px 180px;
    border-bottom: #ddd 1px solid;
}

#equipment1_box2 {
    padding: 30px;
    margin: 30px 0;
    background: #f5f5f5;
}

#equipment1_box2 dt {
    margin-bottom: 10px;
    font-size: 1.8rem;
    font-weight: bold
}

#equipment_left {
    float: left;
    width: 640px;
    padding-right: 20px;
    border-right: 2px #e5e5e5 solid
}

#equipment_left dt, #equipment_left i { color: #d7241b }

#equipment_left i, #equipment_right i { padding-right: 5px }

#equipment_left dd { margin-bottom: 8px; font-size: 1.5rem }

#equipment_right { float: right; width: 220px }
#equipment_right dt, #equipment_right i { color: #3a4379 }

#equipment_right dd { margin-bottom: 8px; font-size: 1.5rem }

#equipment1_box3 { width: 840px; margin: 0 auto; padding: 20px 0 50px 0 }

#equipment1_box3 h4 { 
    padding-bottom: 5px;
    color: #192151; font-weight: bold;
    font-size: 1.8rem;
}

#movie_left { width: 400px; float: left }

#movie_right { width: 400px; float: right }


/* レーザーマーカー,レーザークリーナー */
#business7_box1 {
    width: 1200px;
    margin: 50px auto;
    padding-left: 50px;
    text-align: left;
    line-height: 1.6;

}

#business7_box1 h2 {
    padding-bottom: 15px;
    color: #192151;
    font-weight: bold;
    font-size: 3.0rem;
}

#business7_box1 p {
    width: 1200px;
    font-size: 1.5rem;
}

#business7_box1 dl {
    width: 450px;
    margin-top: 30px;
    padding: 20px 25px;
    background: rgba(150, 150, 150, 0.1);
    font-size: 1.4rem;


}
#business7_box1 dt {
    padding-bottom: 8px;
    font-weight: bold;
    font-size: 1.6rem;
}

#business7_box1 i {
    padding-right: 5px;
    vertical-align: top;
}

.top-banner{
	display: flex;
	flex-wrap:wrap;
}
.top-banner li {
	width: calc(50%);/*←画像を横に4つ並べる場合*/
	padding:0 15px;/*←画像の左右に5pxの余白を入れる場合*/
	box-sizing:border-box;
}
.top-banner li img {
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	
}

.inline-block_test {
    display: inline-block;      /* インラインブロック要素にする */
    background-color:  #e6e6e6;    /* 背景色指定 */
    padding:  20px;             /* 余白指定 */
    height: 200px;              /* 高さ指定 */
    width: 450px;              /* 幅指定 */
    margin: 20px 60px
}

/* youtube動画 */
#top_youtube {
    padding: 50px 0;
    background: #2b2b2b;
}

#top_youtube h2 {
    text-align: center;
}

#top_youtube iframe {
    padding: 20px 10px;
}


/* タブ切替え */
#tab-cate { text-align: right }

#tab-cate label {
  display: inline-block;
  width: 120px; padding: 14px 5px;
  cursor: pointer; background: #192151;
  font-size:1.2rem; color: #868ebb;
  text-align: center;
}
#tab-cate label:hover { background: #555d8e; color: #fff }

#tab-cate input:checked + label {
    padding: 14px 5px;
    background: #555d8e;
    color: #fff; 
}
#tab-cate input { display: none }

#tab-cb1, #tab-cb2, #tab-cb3 {
    display: none; overflow:auto;
    border-top: 5px #555d8e solid;
    padding-top: 40px; text-align: left;
}
#tab-c1:checked ~ #tab-cb1,
#tab-c2:checked ~ #tab-cb2,
#tab-c3:checked ~ #tab-cb3 { display: block }


/* 3列ボックス */
.bn3box_left { 
    float:left; width:300px;
    margin:40px 30px 0 0;
}
.bn3box_right { 
    float:right; width:300px;
    margin-top:40px;
}
.bn3box dt { 
    margin-bottom: 8px; font-weight: bold;
    font-size: 2.0rem; line-height: 1.3;
}
.bn3box dt img { display: block; margin-bottom: 15px }

/* 2列ボックス */
#listbox_left { width: 465px; float: left }

#listbox_right { width: 465px; float: right }

.under_2box a:hover { text-decoration: none }

.under_2box li { 
    margin-bottom: 20px;
    height: 180px; overflow: hidden;
    background: #fff; position: relative;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
}
.under_2box figure { 
    float: left; margin-right: 20px;
    width: 180px; height: 180px;
    overflow: hidden; 
}
.under_2box figure img { width: 180px; transition:all 0.25s ease-in-out }
 
.under_2box a:hover > figure img { transform: scale(1.15,1.15) }

.under_2box h3 { 
    padding: 25px 20px 10px 0;
    font-size:2.0rem;
    line-height: 1.25;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.under_2box h3 small { font-size:1.5rem; font-weight: bold }

.under_2box p { padding: 0 20px 20px 0 }
.under_2box p small { font-size:1.2rem }

.under_2box span { 
    padding: 5px 0 5px 15px; position: absolute;
    right: 0; bottom: 0; z-index: 10;
    background:#192151; color: #fff;
    font-size: 1.3rem;
    transition:all 0.25s ease-in-out;
}
.under_2box a:hover > span { background: #d7241b }
