@charset "shift_JIS";

/* [header] */
div.PageTitleStyle1{
	background:url('/Prod/comp/soft1/jp1/feature/interview2607/images/topBrandingBack.png') no-repeat center top;
	background-size:cover;
	box-sizing:border-box;
	padding:50px 0 0;
	margin:0;
	height: 620px;
}
div.PageTitleStyle1 div#TitleInner{
	max-width:1275px;
	min-height:500px;
	margin:0 auto;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
}
div.PageTitleStyle1 div#TitleInner p#DialogueTitle{
	line-height:1;
	display:flex;
	gap:30px;
	align-items:center;
	justify-content:center;
	position:relative;
}
div.PageTitleStyle1 div#TitleInner p#DialogueTitle:before,
div.PageTitleStyle1 div#TitleInner p#DialogueTitle:after{
	content:"";
	display:inline-block;
	width:2px;
	background:#b3b3b3;
	height:100px;
	position:absolute;
	bottom:-110px;
	left:calc(50% + 15px);
}
div.PageTitleStyle1 div#TitleInner p#DialogueTitle:before{
	transform:skew(45deg);
}
div.PageTitleStyle1 div#TitleInner p#DialogueTitle:after{
	transform:skew(-45deg);
}
div.PageTitleStyle1 div#TitleInner p#DialogueTitle span:is(:first-child, :last-child){
	font-size:70px;
	font-weight:bold;
	color:#666;
}
div.PageTitleStyle1 div#TitleInner p#DialogueTitle span:first-child + span{
	font-size:30px;
	color:#231815;
	border:1px solid #c4111a;
	padding:10px;
	background:#FFF;
}
div.PageTitleStyle1 div#TitleInner h1{
	min-width:800px;
	margin:0 auto;
	margin-bottom:10px;
	background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 5%, rgba(255, 255, 255, 0.8) 95%, rgba(255, 255, 255, 0) 100%);
	padding:20px 5%;
	text-align:center;
	box-sizing:border-box;
}
div.PageTitleStyle1 div#TitleInner h1 :is(span, a){
	display:block;
	color:#504f4d;
}
div.PageTitleStyle1 div#TitleInner h1 span{
	font-weight:bold;
	font-size:150%;
}


/* [common] */
.FlexWrap{ gap:20px; }
.radiusBoxStyle{
	padding:10px 20px;
	border-radius:10px;
	border:1px solid #b3b3b3;
	background:#FFF;
}

.radiusBoxStyle dd li span{
	font-size: 100%;
	font-weight: bold;
}


ol.ListStyle1.CircleStyle{
	list-style:none;
	counter-reset:number 0;
}
ol.ListStyle1.CircleStyle li{
	position:relative;
}
ol.ListStyle1.CircleStyle li:before{
	counter-increment: number 1;
	content:counter(number);
	border:1px solid #333;
	border-radius:50%;
	font-size:0.7em;
	position:absolute;
	display:flex;
	width:1.4em;
	height:1.4em;
	align-items:center;
	justify-content:center;
	top:0;
	left:-2.2em;
	line-height:1;
}
section.interviewBlock{
	padding:50px 15px;
}


/* [prefaceArea] */
section#prefaceArea{
	background:url('/Prod/comp/soft1/jp1/feature/interview2607/images/prefaceAreaBack.png') no-repeat center top;
	background-size: cover;
}


/* [interviewArea] */
div#DialoguePartner{
	gap:30px;
	flex-wrap:wrap;
	margin-bottom:30px;
}
div#DialoguePartner dl{
	display:flex;
	flex-direction:column-reverse;
	width:467.5px;
	min-height:284px;
	justify-content:end;
	background:no-repeat center;
	background-size:cover;
	position:relative;
	padding:15px;
	box-sizing:border-box;
	margin:0 auto;
}
div#DialoguePartner dl#hitachiSide{
	background-image:url('/Prod/comp/soft1/jp1/feature/interview2607/images/hitachiSide.png');
}
div#DialoguePartner dl#ibmSide{
	background-image:url('/Prod/comp/soft1/jp1/feature/interview2607/images/ibmSide.png');
}
div#DialoguePartner dl dt{
	font-size:25px;
}
div#DialoguePartner dl dt span{
	font-size:16px;
}
div#DialoguePartner dl dt + dd{
	font-size:13px;
}
div#DialoguePartner dl dd:last-child{
	position:absolute;
	top:35px;
	font-weight:bold;
	font-size:15px;
}

section.articleBlock{
	padding:0 15px 50px;
}
section.articleBlock h2{
	display:flex;
	margin-top:0;
}
section.articleBlock h2 span:first-child{
	padding:0;
	background:none;
	display:flex;
	flex-direction:column;
	justify-content:center;
}
section.articleBlock h2 span:first-child + span{
	font-weight:normal;
	font-size:80%;
	color:#2d2d2d;
	padding:20px 15px;
	background:none;
	text-align:left;
}
section.articleBlock h2 span mark{
	display:block;
	background:none;
	color:inherit;
	font-size:140%;
	margin-bottom:7px;
}
section.articleBlock dl.articleItem{
	display:flex;
	gap:15px;
}
section.articleBlock dl.articleItem:not(:last-child){
	margin-bottom:20px;
}
section.articleBlock dl.articleItem dt{
	width:150px;
	text-align:right;
}
section.articleBlock dl.articleItem dt.withImg{
	width:450px;
}
section.articleBlock dl.articleItem dt.withImg img:first-child{
	margin-right:10px;
}
section.articleBlock dl.articleItem dd{
	flex:1;
}

/* [downloadArea] */
section#downloadArea h2 span{
	background:none;
	color:#333;
	text-decoration:underline;
}
ul.DownloadLinkList li a{
	display:block;
	max-width:700px;
	color:#FFF;
	font-size:110%;
	font-weight:bold;
	background:#2e4173;
	padding:15px 10px;
	border-radius:2em;
	margin:0 auto;
}
ul.DownloadLinkList li a span{
	background:url('/image/jp/r1/icon/icon_link_right_l_white_hd.gif') no-repeat center right;
	padding-right:25px;
	background-size:20px;
}
ul.DownloadLinkList li a span b{
	font-size:120%;
}

/* [Inquiry] */
div.NewSolInquiryBox h2 span{
	background:none;
	color:inherit;
}
div.NewSolInquiryBox :is(div.Inquiry a, div.FlexWrap div.FlexItem, p.TextStyle1){
	max-width:760px;
	margin:0 auto;
	box-sizing:border-box;
}
div.NewSolInquiryBox div.Inquiry a{
	display:block;
}
div.NewSolInquiryBox div.FlexWrap div.FlexItem{
	margin-right:auto!important;
	
}
div#InquiryHeader div.jp1BoxPatternA + ul.ListStyle2{
	max-width:850px;
	margin:0 auto;
}
div#InquiryHeader div.jp1BoxPatternA + ul.ListStyle2 li{
	background:none;
	padding:0;
}


/* for - 965px
=========================================================================================== */
@media screen and (max-width: 964px){
	.JS div.PageTitleStyle1 div#TitleInner h1{
		min-width:auto;
		width:100%;
	}
}

/* for - 768px
=========================================================================================== */
@media screen and (max-width: 767px){
	.JS .FlexWrap{
		display:flex;
		flex-direction:column;
	}
	.JS div.PageTitleStyle1{
		height: auto;
	}

	.JS div.PageTitleStyle1 div#TitleInner{
		min-height:300px;
	}
	.JS div.PageTitleStyle1 div#TitleInner p#DialogueTitle span:is(:first-child, :last-child){
		font-size:30px;
	}
	.JS div.PageTitleStyle1 div#TitleInner p#DialogueTitle span:first-child + span{
		font-size:20px;
	}
	div.PageTitleStyle1 div#TitleInner p#DialogueTitle:before,
	div.PageTitleStyle1 div#TitleInner p#DialogueTitle:after{
		height:50px;
		bottom:-60px;
		left:50%;
	}
	.JS div.PageTitleStyle1 div#TitleInner h1{ margin-bottom:0; }
	.JS div.PageTitleStyle1 div#TitleInner h1 span{
		font-size:120%;
	}
	.JS section.articleBlock h2 span:first-child{ width:100px; }
	.JS section.articleBlock h2 span:first-child + span{
		flex:1;
	}
	.JS section.articleBlock h2 span mark{ font-size:120%; }
	.JS section.articleBlock dl.articleItem{
		flex-direction:column;
	}
	.JS section.articleBlock dl.articleItem :is(dt, dt.withImg img, div.flexItem + p.ImgOnlyStyle){
		text-align:center;
		margin:0 auto;
	}
	.JS section.articleBlock dl.articleItem dt.withImg{
		display:flex;
		flex-direction:column;
		gap:10px;
	}
	.JS div.NewSolInquiryBox div.FlexWrap div.FlexItem{ width:100%; }
}
/* for - 580px
=========================================================================================== */
@media screen and (max-width: 579px){
	.JS div#DialoguePartner dl{
		width:100%;
	}
	.JS div#DialoguePartner dl dd:last-child{
		max-width:50%;
	}
	.JS section.articleBlock h2{
		flex-direction:column;
		margin:0;
	}
	.JS section.articleBlock h2 span:first-child{
		margin:20px auto 0;
	}
}
/* for - 470px
=========================================================================================== */
@media screen and (max-width:470px){
	div#DialoguePartner dl :is(dt, dt + dd){
		text-shadow:1px 1px 2px #FFF, -1px 1px 2px #FFF, 1px -1px 2px #FFF, -1px -1px 2px #FFF;
	}
}