﻿@charset "UTF-8";

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

Name: special.css

Copyright 2018 Hitachi Document Solutions Co., Ltd.

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

/* specialContent
===================================================== */
/* specialContent */

/* mainSection
===================================================== */
/* mainSection */

/* keyVisual */

/* responsive */
@media screen and (max-width: 767px) {
	.JS h1 a .en {
		font-size: 83%;
		font-weight: normal;
	}
}


/* Section
===================================================== */
/* section */
.section {
	width: 100%;
}

.coreList_vista {
	display: flex;
	flex-wrap: wrap;
	-ms-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*  3製品版（Dams追加により使用しない）  *//*
.coreList_vista li {
	width: calc((100% - 44px) / 3);
	margin: 0 21px 21px 0;
}

.coreList_vista li:first-child {
	background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_01.jpg") no-repeat;
	background-size: cover;
}
.coreList_vista li:nth-child(2) {
	background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_02.png") no-repeat;
	background-size: cover;
}
.coreList_vista li:nth-child(3) {
	background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_03.png") no-repeat;
	background-size: cover;
	margin-right: 0;
}
.coreList_vista li:last-child {
	background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_04.png") no-repeat;
	background-size: cover;
	margin-right: 0;
}

.coreList_vista li a {
	display: block;
	height: 60px;
	color: #fff;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	padding-top: 100px;
}

@media screen and (max-width: 840px) {
	.coreList_vista li:first-child {
		background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_01.jpg") no-repeat;
		background-size: cover;
	}
	.coreList_vista li:nth-child(2) {
		background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_02.png") no-repeat;
		background-size: cover;
	}
	.coreList_vista li:last-child {
		background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_03.png") no-repeat;
		background-size: cover;
		margin-right: 0;
	}
}

@media screen and (max-width: 639px) {
	.coreList_vista li a {
		height: 80px;
	}
}

@media screen and (max-width: 579px) {
	.coreList_vista li {
		width: calc((100% - 21px) / 2);
	}
	.coreList_vista li:nth-child(2n) {
		margin-right: 0;
	}
	.coreList_vista li a {
		height: 60px;
	}
}

@media screen and (max-width: 417px) {
	.coreList_vista li a {
		font-size: 90%;
	}
}
*/

/*  4製品版  */
.coreList_vista li {
	width: calc((100% - 42px) / 4);
	margin: 0 14px 14px 0;
}
.coreList_vista li:first-child {
	background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_01.jpg") no-repeat;
	background-size: cover;
}
.coreList_vista li:nth-child(2) {
	background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_02.png") no-repeat;
	background-size: cover;
}
.coreList_vista li:nth-child(3) {
	background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_03.png") no-repeat;
	background-size: cover;
}
.coreList_vista li:last-child {
	background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_04.png") no-repeat;
	background-size: cover;
	margin-right: 0;
}
.coreList_vista li a {
	display: block;
	height: 60px;
	color: #fff;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	padding-top: 100px;
}

@media screen and (max-width: 821px) {
	.coreList_vista li:first-child {
		background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_01.jpg") no-repeat;
		background-size: cover;
	}
	.coreList_vista li:nth-child(2) {
		background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_02.png") no-repeat;
		background-size: cover;
	}
	.coreList_vista li:nth-child(3) {
		background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_03.png") no-repeat;
		background-size: cover;
	}
	.coreList_vista li:last-child {
		background: url("/service/digital/diovista/image/img_vista_100p.png"), url("/service/digital/diovista/image/img_vista_04.png") no-repeat;
		background-size: cover;
		margin-right: 0;
	}
	.coreList_vista li a {
		height: 80px;
		padding-top: 100px;
	}
	}

@media screen and (max-width: 639px) {
	.coreList_vista li a {
		height: 80px;
		font-size: 83%;
	}
}

@media screen and (max-width: 579px) {
	.coreList_vista li {
		width: calc((100% - 14px) / 2);
	}
	.coreList_vista li:nth-child(2n) {
		margin-right: 0;
	}
	.coreList_vista li a {
		height: 60px;
		padding-top: 80px;
		font-size: 100%;
	}
}

@media screen and (max-width: 427px) {
	.coreList_vista li a {
		height: 60px;
		font-size: 90%;
	}
}

/* Dams */
.brandingWrapDams {
  position: relative;
  margin-top: 20px;
  margin-bottom: 20px;
  /*margin: 0 calc(((100vw - 100%) / 2) * -1) 20px;*/
  /*padding: 0 calc((100vw - 100%) / 2);*/
  background-repeat: no-repeat;
  background-position: center top;
  background-image: url( "/service/digital/diovista/dams/image/img_diovista-dams_01.jpg");
  background-size: cover;
  height: 450px;
}

.brandingWrapDams p {
  position: absolute;
  top: 7%;
  width: 100%; 
  overflow: hidden;
  display: inline-block;
  padding: 25px 0 25px 0;
  background-color: rgba(0,0,0,0.40);
  text-align: center;
  color: #fff;
  font-size: 200%;
  font-weight: bold;
  text-shadow: black 1px 1px 2px, white 0 0 10px;
}

.brandingWrapDams Subtitle {
  position: absolute;
  top: 7%;
  width: 100%; 
  overflow: hidden;
  display: inline-block;
  padding: 25px 0 25px 0;
  background-color: rgba(0,0,0,0.50);
  text-align: center;
  color: #fff;
  font-size: 150%;
  font-weight: bold;
}

/* BCP  2025-06-03追加 */
/* Box
=========================================================================================== */

/* --- Pattern A --- */
/* --- [c16-1-2] Box > Pattern A > Link in Heading --- */
/* --- [c16-2-1] Box > Pattern B --- */
/* --- [c16-2-2] Box > Pattern B > Link in Heading --- */
/* --- [c16-3] Box > Pattern C (No Heading) --- */
/* --- [c16-4-1] Box > Pattern A (h2) --- */
/* --- [c16-4-2] Box > Pattern A (h2) > Link in Heading --- */
/* --- [c16-5-1] Box > Pattern A (h3) --- */
/* --- [c16-5-2] Box > Pattern A (h3) > Link in Heading --- */
/* --- [c16-6-1] Box > Pattern A (h4) --- */
/* --- [c16-6-2] Box > Pattern A (h4) > Link in Heading --- */
/* --- [c16-7-1] Box > Pattern B (h2) --- */
/* --- [c16-7-2] Box > Pattern B (h2) > Link in Heading --- */
/* --- [c16-8-1] Box > Pattern B (h3) --- */
/* --- [c16-8-2] Box > Pattern B (h3) > Link in Heading --- */
/* --- [c16-9-1] Box > Pattern B (h4) --- */
/* --- [c16-9-2] Box > Pattern B (h4) > Link in Heading --- */


/* 提供例 */
.containerB {
	position: relative;
	top: -50px;
	left: -30px;
	display: flex;
	width: auto;
	flex-direction: row;
}

/* 提供価値 */
.containerC {
	position: relative;
	left: 10px;
	display: flex;
	width: auto;
	flex-direction: row;
}

.containerB > div {flex: 1 1 0;}
.containerC > div {flex: 1 1 0;}

/* 提供例　赤 */
.BoxBcpB {
	flex: 0 0 auto;
	max-width: 120px;
	min-height: 30px;
	padding: 8px 15px;
	font-size: 120%;
	font-weight: bold;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	line-height: 130%;
	border: solid;
	border-color: #E03030;
	background-color: #E03030;
}

/* 提供価値　青 */
.BoxBcpC {
	flex: 0 0 auto;
	max-width: 120px;
	min-height: 30px;
	padding: 8px 15px;
	font-size: 120%;
	font-weight: bold;
	color: #fff;
	overflow-wrap: break-word;
	text-align: center;
	vertical-align: middle;
	line-height: 130%;
	border: solid;
	border-color: #0070C0;
	background-color: #0070C0;
}

/* 説明文 */
.BoxBcpD {
	flex: 0 0 auto;
	max-width: 400px;
	min-height: 30px;
	padding: 8px 15px;
	font-size: 120%;
	font-weight: bold;
	vertical-align: middle;
	line-height: 130%;
	border-top: 3px solid #000000;
	border-right: 3px solid #000000;
	border-bottom: 3px solid #000000;
    border-left: none;
    background-color: #fff;
    word-wrap: break-word;
}

/* 説明文 */
.BoxBcpE {
	flex: 0 0 auto;
	max-width: 500px;
	min-height: 30px;
	padding: 8px 15px;
	font-size: 120%;
	font-weight: bold;
	vertical-align: middle;
	line-height: 130%;
	border-top: 3px solid #000000;
	border-right: 3px solid #000000;
	border-bottom: 3px solid #000000;
    border-left: none;
    background-color: #fff;
    word-wrap: break-word;
}


/* 外枠 */
.BoxPattern_bcpA {
	position: relative;
    top: 20px;
    left: -10px;
    clear: both;
	margin: 20px 0px 40px 40px;
	padding: 20px 0 5px 0;
	border-style: solid;
	border-width: 3px;
	border-color: #7F7F7F;
    z-index: 1;
}


.BoxPattern_bcpB {
	position: relative;
    top: -66px;
    left: -30px;
    clear: none;
	margin: 0 0 15px;
	padding: 15px 0 5px 0;
	border: none;
    z-index: 2;
}

.BoxPattern_bcpC {
	clear: none;
    z-index: 3;
	margin: 20px 20px 15px;
	padding: 15px 0 5px;
	border: none;
}

.BoxPattern_bcpA:after,
.BoxPattern_bcpB:after,
.BoxPattern_bcpC:after {
	content: "";
	display: block;
	clear: both;
}

.BoxPattern_bcpB .Title,
.BoxPattern_bcpB h2 {
	display: inline-block; 
	clear: none;
    min-height: 30px;
    max-width: 240px;
	margin: -15px 0 15px;
	padding: 8px 15px;
	font-size: 120%;
	font-weight: bold;
	color: #fff;
	text-align: center;
    vertical-align: middle;
	line-height: 130%;
	border: solid;
    border-color: #E03030;
	background-color: #E03030;
    z-index: 2;
}

.BoxPattern_bcpC h3 {
	display: inline-block;
	clear: none;
    min-height: 30px;
    max-width: 180px;
	margin: -18px 0 10px;
	padding: 8px 15px;
	font-size: 120%;
	font-weight: bold;
	color: #fff;
	vertical-align: middle;
	line-height: 130%;
	border: solid;
    border-color: #0070C0;
	background-color: #0070C0;
}

.BoxPattern_bcpB h4,
.BoxPattern_bcpC h4 {
	display: inline-block;
	clear: none;
    min-height: 30px;
	margin: -15px 0 15px;
	padding: 8px 25px;
	font-size: 120%;
	font-weight: bold;
	/*color: #fff; */
	vertical-align: middle;
	line-height: 130%;
	border-top: 3px solid #000000;
	border-right: 3px solid #000000;
	border-bottom: 3px solid #000000;
    border-left: none;
    background-color: #fff;
}

.BoxPattern_bcpA h2,
.BoxPattern_bcpB h2 {background-image: none;}


.BoxPattern_bcpA .Title strong {
	color: #fff;
	font-weight: normal;
}


.BoxPattern_bcpB .Title strong {color: #575757;}


.BoxPattern_bcpA .BoxImgStyle {
	margin: -15px 0 15px;
	padding: 0;
}
.BoxPattern_bcpB .BoxImgStyle,
.BoxPattern_bcpC .BoxImgStyle {
	margin: -15px 0 0;
	padding: 0 0 15px;
}

.BoxPattern_bcpA .ImgOnlyStyle,
.BoxPattern_bcpB .ImgOnlyStyle,
.BoxPattern_bcpC .ImgOnlyStyle {
	margin-bottom: 10px;
}

.BoxPattern_bcpB p,
.BoxPattern_bcpB dl {
    margin: 20px 0px 20px 30px ;}


.BoxPattern_bcpC p,
.BoxPattern_bcpC dl {
    margin: 20px 0px 30px;}

.BoxPattern_bcpA p,
.BoxPattern_bcpA ul,
.BoxPattern_bcpA dl,
.BoxPattern_bcpB ul,
.BoxPattern_bcpC ul {
	margin-bottom: 10px;
	padding-left: 15px;
	padding-right: 15px;
}


.BoxPattern_bcpA .ThumbW60SetStyle,
.BoxPattern_bcpB .ThumbW60SetStyle,
.BoxPattern_bcpC .ThumbW60SetStyle,
.BoxPattern_bcpA .ThumbW120SetStyle,
.BoxPattern_bcpB .ThumbW120SetStyle,
.BoxPattern_bcpC .ThumbW120SetStyle,
.BoxPattern_bcpA .ThumbW180SetStyle,
.BoxPattern_bcpB .ThumbW180SetStyle,
.BoxPattern_bcpC .ThumbW180SetStyle,
.BoxPattern_bcpA .ThumbW230SetStyle,
.BoxPattern_bcpB .ThumbW230SetStyle,
.BoxPattern_bcpC .ThumbW230SetStyle {margin-left: 15px;}

.BoxPattern_bcpA .ThumbW60SetStyle .Img,
.BoxPattern_bcpB .ThumbW60SetStyle .Img,
.BoxPattern_bcpC .ThumbW60SetStyle .Img,
.BoxPattern_bcpA .ThumbW120SetStyle .Img,
.BoxPattern_bcpB .ThumbW120SetStyle .Img,
.BoxPattern_bcpC .ThumbW120SetStyle .Img,
.BoxPattern_bcpA .ThumbW180SetStyle .Img,
.BoxPattern_bcpB .ThumbW180SetStyle .Img,
.BoxPattern_bcpC .ThumbW180SetStyle .Img,
.BoxPattern_bcpA .ThumbW230SetStyle .Img,
.BoxPattern_bcpB .ThumbW230SetStyle .Img,
.BoxPattern_bcpC .ThumbW230SetStyle .Img {padding-right: 5px;}

.BoxPattern_bcpA .ImgW60SetStyle .ImgSet,
.BoxPattern_bcpB .ImgW60SetStyle .ImgSet,
.BoxPattern_bcpC .ImgW60SetStyle .ImgSet {margin-left: -90px;}
.BoxPattern_bcpA .ImgW120SetStyle .ImgSet,
.BoxPattern_bcpB .ImgW120SetStyle .ImgSet,
.BoxPattern_bcpC .ImgW120SetStyle .ImgSet {margin-left: -150px;}
.BoxPattern_bcpA .ImgW180SetStyle .ImgSet,
.BoxPattern_bcpB .ImgW180SetStyle .ImgSet,
.BoxPattern_bcpC .ImgW180SetStyle .ImgSet {margin-left: -210px;}
.BoxPattern_bcpA .ImgW230SetStyle .ImgSet,
.BoxPattern_bcpB .ImgW230SetStyle .ImgSet,
.BoxPattern_bcpC .ImgW230SetStyle .ImgSet {margin-left: -270px;}

@media screen and (max-width: 800px) {
	.BoxPattern_bcpB .Title,
	.BoxPattern_bcpB h2,
	.BoxPattern_bcpC h3,
	.BoxPattern_bcpB h4,
	.BoxPattern_bcpC h4 {
		font-size: 100%;
	}
}


/* Column
=========================================================================================== */

.Column_4th_1 .ButtonStyle1 a,
.Column_4th_2 .ButtonStyle1 a
{
 display:block;
}
.Column_4th_1 {
float: left;
margin: 0 0 0 16px;
padding: 0;
width: calc((100% / 4) - 25px) ;
}
.Column_4th_2 {
float: left;
margin: 0 0 0 25px;
padding: 0;
width: calc(((100% / 4) * 1.5) - 25px) ;
}
.Column_4th_1:first-child,
.Column_4th_2:first-child{
margin: 0;
padding: 0;
}
@media screen and (min-width :995px) and (max-width: 1304px) {
.Column_4th_1 {width: calc((100% / 4) - 25px) ;}
.Column_4th_1:first-child{margin: 0 0 0 25px!important;}
.Column_4th_2{margin: 0 0 0 25px!important;}
}
@media screen and (max-width: 994px) {
.Column_4th_1 {width: calc((100% / 4) - 25px) ;}
.Column_4th_2 {width: calc(((100% / 4) * 1.5) - 25px)) ;}
.Column_4th_1:first-child,
.Column_4th_2:first-child{margin: 0 0 0 16px;}
}
@media screen and (max-width: 579px) {
.Column_4th_1,
.Column_4th_2 {
float:none;
width: calc(100% - 25px);
}
}


/* アコーディオン
=========================================================================================== */

.faqHeader {
	margin: 0;
	padding: 10px;
	color: #FFF;
	font-weight: bold;
	background: #444 url("/product/equipment/production-line-solutions/image/icon_plus.png") no-repeat right 15px center;
	background-size: 24px;
	cursor: pointer;
}
.faqHeader.open {
	background: #444 url("/product/equipment/production-line-solutions/image/icon_minus.png") no-repeat right 15px center;
	background-size: 24px;
}
.faqContents {
	display: none;
	padding: 20px 20px 15px;
	background: #f2f2f2;
}
.faqContents .TextStyle1 {
	margin-bottom: 30px;
}
.faqContents .TextStyle1:last-of-type {
	margin-bottom: 15px;
}
.mb15 { margin-bottom: 15px!important;}
