@charset "UTF-8";

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

Name: common.css

Copyright 2018 Hitachi Document Solutions Co., Ltd.

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


/* 2: Body Setting
=========================================================================================== */

body {
	/*background-color: #D9D9D9; 20221113_for floatingmenu*/
	background-color: #fff;
}


/* Megamenu
===================================================== */
ul.MMLinkListStyle li {
    max-width: 230px !important;
	width: auto !important;
}
ul.MMLinkListStyle li > .MMLinkListStyle {
	margin: 3px 0 0 1em;
}
ul.MMLinkListStyle li > .MMLinkListStyle li {
	margin-right: 0;
	font-size: 100%;
}
.MMGrid2 img {
	max-width: 100%;
	width: auto;
}


/* Floating Menu
===================================================== */
input[type="submit"],
input[type="button"] {
  -webkit-appearance: none;
  border-radius: 0;
}
#floatingMenu {
	width: 100%;
	padding: 10px 0;
	background: #F4F4F4;
}
#floatingMenu.fixed {
	position: fixed;
	bottom: 0;
}
#floatingMenu .floatingInner {
	display: flex;
	max-width: 1275px;
	width: 100%;
	margin: 0 auto;
}
#floatingMenu .floatingInner .searchBox {
	width: 75%;
}
#floatingMenu .floatingInner .SearchTextBox {
	padding: 8px;
	margin-left: 0;
	width: calc(100% - 115px);
	border: 2px solid #B3B3B3;
}
#floatingMenu .floatingInner input[name=input2] {
	padding: 8px 24px 8px;
	background: #737373;
	border: none;
	color: #ffffff;
}
.SP #floatingMenu .floatingInner input[name=input2] {
    padding: 10px 24px 10px;
 }
#floatingMenu .floatingInner input[name=input2]:hover {
	cursor: pointer;
}
#floatingMenu .floatingInner .inquiryWrap {
	display: flex;
	width: 42%;
}
#floatingMenu .floatingInner .inquiryWrap a.fl_tel {
	display: block;
	box-sizing: border-box;
	width: 100%;
	padding: 7px 0 6px 50px;
	color: #ffffff;
	font-weight: bold;
	font-size: 80%;
	text-decoration: none;
	background: url(/image/en/common/icon_floating_form.png) no-repeat left 15px center #cc0000;
	margin-left: 10px;
}
#floatingMenu .floatingInner .inquiryWrap a.fl_catalog {
	display: block;
	box-sizing: border-box;
    width: 100%;
    margin-left: 15px;
	padding: 7px 0 6px 50px;
	color: #ffffff;
	font-weight: bold;
	font-size: 80%;
	text-decoration: none;
	background: url(/image/en/common/icon_floating_catalog.png) no-repeat left 15px center #cc0000;
}

@media screen and (min-width: 995px) and (max-width: 1304px){
#floatingMenu .floatingInner {
    width: calc(100% - 30px);
    padding: 10px 15px;
}
}

@media screen and (max-width: 994px) {
	#floatingMenu {
		width: calc(100% - 30px);
		padding: 10px 15px;
	}
}
@media screen and (max-width: 830px) {
	#floatingMenu .floatingInner {
		display: block;
	}
	#floatingMenu .floatingInner .searchBox {
		width: 100%;
		margin-bottom: 10px;
	}
	#floatingMenu .floatingInner .SearchTextBox {
		width: calc(100% - 111px);
	}
	#floatingMenu .floatingInner .inquiryWrap {
		width: 100%;
		margin-bottom: 10px;
	}
	#floatingMenu .floatingInner .inquiryWrap a.fl_tel{
	margin-left:	0;
	}
}
@media screen and (max-width: 440px) {
	#floatingMenu .floatingInner .inquiryWrap a {
		width: calc(50% - 3px);
		padding: 7px 0 6px 45px;
		font-size: 70%;
	}
	#floatingMenu .floatingInner .inquiryWrap a:first-child {
		margin-right: 6px;
	}
}


/* Margin
===================================================== */
.mb0 {
	margin-bottom: 0px!important;
}
.mb30 {
	margin-bottom: 30px!important;
}
.mr30 {
	margin-right: 30px!important;
}


/* Padding
===================================================== */
.pl15 {
	padding-left: 15px;
}


/* Line up
===================================================== */
#ProductsTop .ImgBoxStyle1,
#ProductsTop .ImgBoxStyle2 {
	margin-bottom: 0;
}
#ProductsTop .ImgBoxStyle2:last-child {
	margin-bottom: 30px;
}
#ProductsTop .ImgBoxStyle1 .ImgOnlyStyle,
#ProductsTop .ImgBoxStyle2 .ImgOnlyStyle {
	padding: 10px 0;
	text-align: center;
	background-color: #fff;
}
#ProductsTop .ImgBoxStyle1 .ImgOnlyStyle img,
#ProductsTop .ImgBoxStyle2 .ImgOnlyStyle img {
	width: auto;	
}
.ListStyleHorizontal {
	margin: 0 25px;
	font-size: 90%;
}
.ListStyleHorizontal dt {
	float: left;
	padding: 0 0 0 1em;
	background: url(/image/en/r1/icon/icon_list_marker_hd.gif) no-repeat 0 2px;
	background-size: 16px 16px;
	line-height: 140%;	
}
.ListStyleHorizontal dt:after {
	content: "：";
}

/* add 20200924 */
#ProductsTop .ImgBoxStyle2{
display:flex;
flex-direction:row-reverse;
align-content: space-between;
align-items: center
}

#ProductsTop .ImgBoxStyle2 .ImgOnlyStyle,
#ProductsTop  .ImgBoxStyle2 .Inner{
display:block;;
align-self: center;
}


@media screen and (max-width: 579px) {
	#ProductsTop .ImgBoxStyle1 {
		margin-bottom: 10px;
	}
	#ProductsTop .ImgBoxStyle2{
	display: block;
	}
	.JS #ProductsTop .ImgBoxStyle2 .Inner::before {
    top: -10px;
    bottom: 0;
	border-bottom: solid 10px #F4F4F4;
    border-top:none;
	}
	.JS .surfaceTable {
    margin-left: 15px;
	}
}

/* --- [c18] Content/Tab Navigation System --- */
.ContentNavi li a {
	min-width: 60px;
}


/* Related Links
===================================================== */
.relatedLink {
	margin-bottom: 15px;
	padding: 15px;
	background: #F4F4F4;
}
.relatedLink h2 {
	font-size: 90%;
	font-weight: bold;
	background: none;
}
.relatedLink ul {
	font-size: 90%;
}
.relatedLink ul li {
	display: inline-block;
	margin-right: 15px;
}
.relatedLink ul li a:link,
.relatedLink ul li a:visited {
	text-decoration: none;
	background-image: url(/image/en/r1/icon/icon_link_right_hd.gif);
}
.relatedLink ul li a:hover,
.relatedLink ul li a:active {
	text-decoration: underline;
	background-image: url(/image/en/r1/icon/icon_link_right_hover_hd.gif);
}
.relatedLink ul li a {
	padding: 0 17px 0 0;
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 16px 16px;
}
@media screen and (max-width: 767px) {
	.relatedLink h2 {
		margin: 0;
	}	
}


/* ColumnSet
===================================================== */
img {
	max-width: 100%;
}
.Column_3rd_1 .ButtonStyle1 a {
	display:block;
}
.Column_3rd_1 {
	float: left;
	margin: 0 0 0 16px;
	padding: 0;
	width: calc((100% / 3) - 16px);
}
.Column_3rd_2 {
	float: left;
	margin: 0 0 0 16px;
	padding: 0;
	width: 637px;
}
.Column_3rd_1:first-child,
.Column_3rd_2:first-child {
	margin: 0;
	padding: 0;
}

@media screen and (min-width :995px) and (max-width: 1304px) {
.Column_3rd_1 {width: calc((100% / 3) - 25px) ;}
.Column_3rd_1:first-child{margin: 0 0 0 25px!important;}
.Column_3rd_2{margin: 0 0 0 25px!important;}
}
@media screen and (max-width: 994px) {
	.Column_3rd_1 {
		width: calc((100% / 3) - 16px);
	}
	.Column_3rd_2 {
		width: calc(((100% / 3)*2) - 16px);
	}
	.Column_3rd_1:first-child,
	.Column_3rd_2:first-child {
		margin: 0 0 0 16px;
	}
}
@media screen and (max-width: 579px) {
	.Column_3rd_1,
	.Column_3rd_2 {
		float:none;
		width: calc(100% - 16px);
	}
}

/*/product/magnetron/magnetron/products/index.html*/
/*ラベル*/
.label1 li{
float: left;
border: 2px solid;
font-size: 90%;
font-weight: bold;
padding: 5px;
color: #0099cc;
margin-right: 25px;
margin-bottom: 10px;
min-width: 66px;
text-align: center;
}
.label1 li:last-child{
	margin-right: 0px;
}

/* Modal Window
===================================================== */
.modaal-container {
	width: auto !important;
	max-width: 100% !important;
}
.videoModal {
	display: none;
}
.openVideo,
.openVideo2 {
	cursor: pointer;
}

.modaal-content-container video{
width: 80vw;
max-width: 994px;
min-width: 320px;
height: 75vh;
max-height: 600px;
}

@media screen and (max-width: 579px) {
.modaal-inner-wrapper {	padding:0!important;}
}


/* Video Modal Window Icon
===================================================== */
.ImgOnlyStyle .playIcon {
	position: relative;
	display: inline-block;
	cursor: pointer;
}

.ImgOnlyStyle .playIcon:before {
	content: "";
	position: absolute;
	z-index: 1;
	width: 50px;
	height: 50px;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	background-color: #e60027;
	opacity: .5;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
	-ms-border-radius: 50%;
}
.ImgOnlyStyle .playIcon:after {
	content: "";
	position: absolute;
	z-index: 1;
	width: 36px;
	height: 36px;
	top: 50%;
	left: 50%;
	margin: -18px 0 0 -18px;
	background-color: #e60027;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
	-ms-border-radius: 50%;
}
.PC .ImgOnlyStyle .playIcon:hover:before,
.PC .ImgOnlyStyle .playIcon:active:before,
.PC .ImgOnlyStyle .playIcon:hover:after,
.PC .ImgOnlyStyle .playIcon:active:after {background-color: #b1000e;}

.ImgOnlyStyle .playIcon span {
	position: relative;
	display: block;
}
.ImgOnlyStyle .playIcon span:after {
	content: "";
	position: absolute;
	z-index: 2;
	width: 0;
	height: 0;
	top: 50%;
	left: 50%;
	margin: -9px 0 0 -3px;
	border-left: solid 9px #fff;
	border-top: solid 9px transparent;
	border-bottom: solid 9px transparent;
}


/* Fobt color  2026.01.21 Add */
.TextRe1 {color: #FA000F;}
.TextRe2 {color: #CC0000;}
.TextWht {color: #FFFFFF;}
.TextGr1 {color: #F4F4F4;}
.TextGr2 {color: #D9D9D9;}
.TextGr3 {color: #B3B3B3;}
.TextGr4 {color: #737373;}
.TextGr5 {color: #4D4D4D;}
.TextGr6 {color: #222222;}
.TextBak {color: #0C0C0C;}
.TextOr1 {color: #FDC796;}
.TextOr2 {color: #FA6900;}
.TextOr3 {color: #C85400;}
.TextYe1 {color: #FDEC96;}
.TextYe2 {color: #FAD200;}
.TextYe3 {color: #967E00;}
.TextPi1 {color: #FD96D4;}
.TextPi2 {color: #FA00A5;}
.TextPi3 {color: #96005A;}
.TextPu1 {color: #D096FD;}
.TextPu2 {color: #9B00FA;}
.TextPu3 {color: #540096;}
.TextBl1 {color: #96C5FD;}
.TextBl2 {color: #0064FA;}
.TextBl3 {color: #004596;}
.TextTe1 {color: #96F0FD;}
.TextTe2 {color: #00DCFA;}
.TextTe3 {color: #008496;}
.TextGr1 {color: #96FDCC;}
.TextGr2 {color: #00FA82;}
.TextGr3 {color: #00964E;}
.TextRe120T {color: #FFCBCE;}
.TextRe140T {color: #FF979D;}
.TextRe160T {color: #FF636C;}
.TextRe120D {color: #BB000B;}
.TextRe140D {color: #7D0008;}


/* Font size 2026.01.22 Add */
.Font80 {font-size: 80%;}
.Font100 {font-size: 100%;}
.Font110 {font-size: 110%;}
.Font120 {font-size: 120%;}
.Font130 {font-size: 130%;}
.Font140 {font-size: 140%;}
.Font150 {font-size: 150%;}
.Font160 {font-size: 160%;}
.Font170 {font-size: 170%;}
.Font180 {font-size: 180%;}
.Font190 {font-size: 190%;}
.Font200 {font-size: 200%;}
.FontXM {font-size: x-small;}
.FontXL {font-size: x-large;}


/* Font Bold 2026.01.22 Add */
.Bold {font-weight: bold;}


/* Background color  2026.01.21 Add */
.bgC-Re1 {background-color: #FA000F;}
.bgC-Re2 {background-color: #CC0000;}
.bgC-Wht {background-color: #FFFFFF;}
.bgC-Gr1 {background-color: #F4F4F4;}
.bgC-Gr2 {background-color: #D9D9D9;}
.bgC-Gr3 {background-color: #B3B3B3;}
.bgC-Gr4 {background-color: #737373;}
.bgC-Gr5 {background-color: #4D4D4D;}
.bgC-Gr6 {background-color: #222222;}
.bgC-Bak {background-color: #0C0C0C;}
.bgC-Or2 {background-color: #FA6900;}
.bgC-Or3 {background-color: #C85400;}
.bgC-Ye1 {background-color: #FDEC96;}
.bgC-Ye2 {background-color: #FAD200;}
.bgC-Ye3 {background-color: #967E00;}
.bgC-Pi1 {background-color: #FD96D4;}
.bgC-Pi2 {background-color: #FA00A5;}
.bgC-Pi3 {background-color: #96005A;}
.bgC-Pu1 {background-color: #D096FD;}
.bgC-Pu2 {background-color: #9B00FA;}
.bgC-Pu3 {background-color: #540096;}
.bgC-Bl1 {background-color: #96C5FD;}
.bgC-Bl2 {background-color: #0064FA;}
.bgC-Bl3 {background-color: #004596;}
.bgC-Te1 {background-color: #96F0FD;}
.bgC-Te2 {background-color: #00DCFA;}
.bgC-Te3 {background-color: #008496;}
.bgC-Gr1 {background-color: #96FDCC;}
.bgC-Gr2 {background-color: #00FA82;}
.bgC-Gr3 {background-color: #00964E;}
.bgC-Re120T {background-color: #FFCBCE;}
.bgC-Re140T {background-color: #FF979D;}
.bgC-Re160T {background-color: #FF636C;}
.bgC-Re120D {background-color: #BB000B;}
.bgC-Re140D {background-color: #7D0008;}


/* Production Line Solution
===================================================== */
/* Solution List */
.solutionList {
	display: flex;
	flex-wrap: wrap;
}
.solutionList li {
	display: table;
	width: calc((100% - 14px) / 2);
}
.solutionList li:first-child {
	margin-right: 14px;
	/* 2020.08.26 変更後のURLに訂正 */
	background: url("/en/product/equipment/production-line-solution/image/img_production-line-solutions_02.jpg") no-repeat;
	background-size: cover;
}
.solutionList li:last-child {
	/* 2020.08.26 変更後のURLに訂正 */
	background: url("/en/product/equipment/production-line-solution/image/img_production-line-solutions_03.jpg") no-repeat;
	background-size: cover;
}
.solutionList li a {
	display: table-cell;
	height: 100px;
	color: #fff;
	font-size: 1.429em;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
}
@media screen and (max-width: 579px) {
	.solutionList li {
		width: 100%;
	}
	.solutionList li:first-child {
		margin-right: 0;
		margin-bottom: 14px;
	}
}

/* Core Technologies List */
.coreList {
	display: flex;
	flex-wrap: wrap;
}
.coreList li {
	display: table;
	width: calc((100% - 42px) / 4);
	margin: 0 14px 14px 0;
}
.coreList li:first-child {
	/* 2020.08.26 Corrected to the new URL */
	background: url("/en/product/equipment/production-line-solution/image/banner_roll-press.jpg") no-repeat;
	background-size: cover;
}
.coreList li:nth-child(2) {
	/* 2020.08.26 Corrected to the new URL */
	background: url("/en/product/equipment/production-line-solution/image/banner_electrode-stacking.jpg") no-repeat;
	background-size: cover;
}
.coreList li:nth-child(3) {
	/* 2020.08.26 Corrected to the new URL */
	background: url("/en/product/equipment/production-line-solution/image/banner_automatic-assembly.jpg") no-repeat;
	background-size: cover;
}
.coreList li:last-child {
	/* 2020.08.26 Corrected to the new URL */
	background: url("/en/product/equipment/production-line-solution/image/banner_fsw.jpg") no-repeat;
	background-size: cover;
	margin-right: 0;
}
.coreList li a {
	display: table-cell;
	height: 100px;
	color: #fff;
	font-weight: bold;
	font-size: 1.214em;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
}
@media screen and (max-width: 579px) {
	.coreList li {
		width: 100%;
		margin-right: 0;
	}
}


/* 2024.11.1 Added with FSW deletion */
.coreList3 {
	display: flex;
	flex-wrap: wrap;
}
.coreList3 li {
	display: table;
	width: calc((100% - 42px) / 3);
	margin: 0 21px 21px 0;
}
.coreList3 li:first-child {
	background: url("/en/product/equipment/production-line-solution/image/banner_roll-press.jpg") no-repeat;
	background-size: cover;
}
.coreList3 li:nth-child(2) {
	background: url("/en/product/equipment/production-line-solution/image/banner_electrode-stacking.jpg") no-repeat;
	background-size: cover;
}
.coreList3 li:last-child {
	background: url("/en/product/equipment/production-line-solution/image/banner_automatic-assembly.jpg") no-repeat;
	background-size: cover;
	margin-right: 0;
}

.coreList3 li a {
	display: table-cell;
	height: 100px;
	color: #fff;
	font-weight: bold;
	font-size: 1.214em;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
}
@media screen and (max-width: 579px) {
	.coreList3 li {
		width: 100%;
		margin-right: 0;
	}
}


/* Banner List */
.bannerList2 {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 15px;
	padding: 15px;
	background: #F2F2F2;
}
.bannerList2 li {
	width: calc((100% - 28px) / 3);
	margin-right: 14px;
	text-align: center;
}
.bannerList2 li:nth-child(3n) {
	margin-right: 0;
}
@media screen and (max-width: 579px) {
	.bannerList2 li {
		width: calc((100% - 15px) / 2);
	}
	.bannerList2 li:nth-child(2n) {
		margin-right: 0;
	}
	.bannerList2 li:nth-child(3n) {
		margin-top: 10px;
		margin-right: 15px;
	}
}

/* Heading */
.h2Style3 {
	background: none;
	font-size: 150%;
}
@media screen and (max-width: 767px) {
	.h2Style3 {
		padding: 0 15px;
	}
}

/* Core Technologies */
.Section.lineSpacing h3 {
	margin-bottom: 3px;
}
.Section.lineSpacing h3+p.TextStyle1 {
	margin-bottom: 20px;
}


/* Company Profile
===================================================== */
.h2Style2 {
	background: none;
	font-size: 150%;
	text-align: center;
}
h2.NoArrow {
	background: none;
}
.TextStyle5 {
	font-size: 	112.5%;
}
.productsList .Title h3 a {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
}
@media screen and (min-width: 960px) {
	.Title h3.Line1 {
		line-height: 260%;
	}
}
@media screen and (max-width: 580px) {
	.OnlyPc {
		display: none;
	}
}

/* add 20200924
/product/plating/semiconductor/index.html
横幅100%リンクボタン
*/
.ButtonStyleBlue > span{
display: block;
width:100%;
background-color:#20468c;
background-image:none;
padding:13px 22px 13px 15px;
color:#fff;
font-size:130%;
font-weight:bold;
text-align:left;
box-sizing: border-box;
}

.ButtonStyleBlue a{
display: block;
width:100%;
background-color:#20468c;
background-image:none;
padding:13px 22px 13px 15px;
font-size:130%;
font-weight:bold;
text-align:left;
box-sizing: border-box;
}

.ButtonStyleBlue a span{
display: block;
width:100%;
background:url("/image/en/r1/icon/icon_link_right_xl_white_hd.gif") no-repeat 100% 50% ;
background-size: 16px;
}

.ButtonStyleBlue a:link,
.ButtonStyleBlue a:visited{
padding:13px 24px 13px 15px;
background-color:#20468c;
}

@media screen and (max-width: 767px) {
	.ButtonStyleBlue a{
	font-size:100%;
	}
}

/* add 20200924
/en/product/equipment/production-line-solution//index.html
h1見出し＋画像
*/

.h1txt{
position: absolute;
display: block;
top: 50%;
right:15px;
color:#fff;
font-size:225%;
font-weight:bold;
text-shadow: 0px -1px 7px rgba(12,12,12,0.8);
letter-spacing:0.05em;
transform: translateY(-50%);
z-index:10;
}

@media screen and (max-width: 767px) {
.h1txt{
font-size:187.5%;
}
}
@media screen and (max-width: 579px) {
.h1txt{
font-size:137.5%;
}
}

@media screen and (max-width: 767px) {
	.JS body {background-color: #fff !important;}
}