@charset "UTF-8";
/* 冒頭でimport */
@import url(https://web.archive.org/web/20240630120016cs_/https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
/* フォントを指定したいところで */
/*font-family: 'Sawarabi Mincho';*/


/*--------------------------------
 トップページ
-------------------------------*/

#topImage div.inner{
	max-width:1200px;
	height:550px;
	margin:0 auto;
	background:url(/web/20240630120016im_/http://www.houeisangyo.jp/wp-content/themes/houeisangyo/img/topImage_bg.jpg) no-repeat center center;
	position:relative;
}

#topImage div.inner div#catchcopy{
	position:absolute;
	top:50%;
	left:50%;
	margin:0 auto;
    max-width: 375px;
    min-width: 240px;
	-webkit-transform:translate(-50%,-50%);
	transform:translate(-50%, -50%);
	
	background:rgba(50, 82, 172,0.9);
	padding:10px;
    z-index: 1000;
	opacity:0.9;
}
div#catchcopy p{
	text-align:center;
	color:#fff;
	font-size:25px;
	padding:15px;
	border:1px solid #fff;
}
@media screen and (max-width:599px){
  #topImage div.inner{
	height:350px;
	background:url(/web/20240630120016im_/http://www.houeisangyo.jp/wp-content/themes/houeisangyo/img/topImage_bg.jpg) no-repeat center 80%;

}
	div#catchcopy p{
		font-size:18px;
	}
}


.overlayer{
  position:absolute;
  display:block;
  top: 0;
  left: 0;
  width:100%;
  height:100%;
  z-index: 50;
 /* background-color:rgba(0,0,0,1.0);*/
	
  animation: fadeIn01 20s ease-in 0s 1 normal forwards;
  -webkit-animation: fadeIn01 20s ease-in 0s 1 normal forwards;
}

#particles-js {
  position:absolute;
  width: 100%;
  height: 100%;
  display:block;
  top: 0;
  left: 0;
  z-index: 100;
  animation: fadeIn02 22s ease-in 0s 1 normal forwards;
  -webkit-animation: fadeIn02 22s ease-in 0s 1 normal forwards;
  }

@keyframes fadeIn01 {
    0% {opacity: 1;   background-color:rgba(50, 82, 172,1.0);}
	20%{opacity:1;}
	50%{ background-color:rgba(0, 176, 80,1.0);}
    100% {opacity: 0; background-color:rgba(229, 185, 67,1.0);}
}

@-webkit-keyframes fadeIn01 {
    0% {opacity: 1;   background-color:rgba(50, 82, 172,1.0);}
	20%{opacity:1;}
	50%{ background-color:rgba(0, 176, 80,1.0);}
    100% {opacity: 0; background-color:rgba(229, 185, 67,1.0);}
}


@keyframes fadeIn02 {
    0% {opacity: 0.8}
	20%{opacity:1}
    100% {opacity: 0}
}

@-webkit-keyframes fadeIn02 {
    0% {opacity: 0.8}
	20%{opacity:1}
    100% {opacity: 0}
}

/*===================================
 * topBox01
 ==================================*/
#topBox01 div >a {
	margin:15px auto;
	background-color:#1e3166;
	padding:15px;
	max-width:365px;
	transition:1.0s;
}

#topBox01 div >a div h2{
	font-weight:normal;
	text-align:center;
	color:#fff;
	font-size:18px;
	margin:5px 0 15px 0;
}

#topBox01 a:nth-of-type(2)  {
	background-color:#2c4999;
}

#topBox01 a:nth-of-type(3)  {
	background-color:#436ee6;
}

#topBox01 a p:first-of-type{
  max-width:275px;
  margin:0 auto;
 overflow:hidden;
}

#topBox01 p.arrow{
	border:1px solid #fff;
	color:#fff;
	width:150px;
	padding:10px 20px;
	margin:15px 0 0 auto;
	transition:0.4s;
	font-size:14px;
}

#topBox01 p.arrow:hover{
	background-color:rgba(255,255,255,0.9);
	color:#3252AC;
}

#topBox01 div >a p img{
	    transform: translate3d(0,0,0);  /*IE対策　有効？*/
		transition:0.6s;
}

#topBox01 div >a:hover p img{
    transform: translate3d(0,0,0);  /*IE対策　有効？*/
	transform:scale(1.2, 1.2);
} 

@media print, screen and (min-width:768px){
	
	#topBox01 .box_inner {
		display:table;
		table-layout:fixed;
		width:100%;
	}
	#topBox01 a{
		display:table-cell;
		width:33.333%;
	}
}

@media screen and (min-width:768px) and (max-width:959px){
	#topBox01{
		padding:0;
	}
	#topBox01 div >a div h2{
	font-size:16px;
}
}

/*===================================
 * topBox02
 ==================================*/

#topBox02{
	/*background-color:#dce0e0;*/
	background:url("/web/20240630120016im_/http://www.houeisangyo.jp/wp-content/themes/houeisangyo/img/bg01.gif") repeat 0 0;
	padding-top:40px;
	padding-bottom:50px;
}

#topBox02 h1{
	font-size:20px;
	line-height:1.27;
	margin-bottom:10px;
}

#topBox02 h1+p{
	margin-bottom:5px;
}

#topBox02 h1+p+p{
	margin-bottom:40px;
}
#topBox02 div.company,
#topBox02 div.equipment
{
	position:relative;
	z-index:10;
	max-width:350px;
	margin:0 auto;
}

#topBox02 div.company{
	margin-bottom:25px;
}

#topBox02 div.company img{
		border:3px solid #328bac;
}

#topBox02 div.equipment img{
		border:3px solid #9fac32;
}

#topBox02 div.company h3,
#topBox02 div.equipment h3{
	position:absolute;
	top:0;
	left:0;
	color:#fff;
	font-weight:normal;
	font-size:16px;
	z-index:100;
	letter-spacing:0.15em;
	line-height:1.25;
	padding:15px;
}

#topBox02 > div >div h3 span{
	letter-spacing:0.02em;
	font-size:14px;
	padding-left:0.5em;
}

@media print, screen and (min-width:768px){
	#topBox02 #dpt_box{
	display:table;
	table-layout:fixed;
	width:100%;
	margin:0 auto;
}

#topBox02 #dpt_box .dpt_inner{
	display:table-cell;
	width:50%;
	vertical-align:middle;
}
	
	#topBox02 div.company{
	margin-bottom:0px;
}
}

/*===================================
 * topBox03 CONTACT
 ==================================*/
#topBox03{
	padding-top:50px;
	padding-bottom:50px;
	background:url("/web/20240630120016im_/http://www.houeisangyo.jp/wp-content/themes/houeisangyo/img/top_contactBg.jpg") no-repeat center center;
	background-size:1200px 676px;
}

#topBox03 h2,
#topBox03 p.line50
{
	color:#fff;
	width:160px;
	margin:0 auto;
}

#topBox03 p.line50:before,
#topBox03 p.line50:after{
	background-color:#fff;
}


#topBox03 div.whitebox{
	max-width:650px;
	margin:50px auto;
	padding:2em;
	border-radius:10px;
	background-color:rgba(255,255,255,0.7);
}

@media screen and (max-width:800px){
	#topBox03{
	padding-top:40px;
	padding-bottom:30px;
	background-size:960px 541px;
}
	
	#topBox03 div.whitebox{
	margin:30px auto;
	padding:2em;
}
}

#topBox03 div.tel{
	margin-bottom:20px;
}

#topBox03 h3{
	color:#3252AC;
	color:#00B050;
	font-weight:normal;
}

#topBox03 h3:before{
	font-family:"FontAwesome";
	content:"\f111";
	position:relative;
	margin-right:10px;

}

#topBox03 div.mail h3:before{
	content:"\f0e0";
}


#topBox03 div.tel p{
	font-weight:bold;
	font-size:25px;
	color:#3252AC;
    text-align:center;
	padding:10px 5px;
	margin-top:5px;
}

#topBox03 div.tel p:before{
	font-family:"FontAwesome";
	content:"\f098";
	position:relative;
	margin-right:5px;
	top:2px;
	font-size:25px;
}

@media screen and (max-width:767px){
	#topBox03 div.tel p{
	  font-size:20px;
	}
}

@media screen and (max-width:349px){
	#topBox03 div.tel p{
	  font-size:16px;
	}
}

@media screen and (max-width:599px){
	#topBox03 div.tel a{
	background-color:rgba(255,255,255,0.8);
	border-radius:15px;
	max-width:300px;
	box-shadow:2px 2px 2px #ddd;
}

#topBox03 div.tel a p:after{
	font-family:"FontAwesome";
	content:"\f0a9";
	position:relative;
	margin-left:10px;
	color:#bbb;
}
}

#topBox03 div.mail a{
	max-width:240px;
    padding: 15px 15px;
	margin:10px auto 0 auto;
	font-size:16px;
	background-color:rgba(255,255,255,0.8);
	border-radius:5px;
}

#topBox03 div.mail a:before{
		border-radius:5px;
}

@media print, screen and (min-width:600px){
	#topBox03 div.whitebox_inner{
		display:table;
		table-layout:fixed;
		width:100%;
	}
	
	#topBox03 div.whitebox_inner > div{
		display:table-cell;
		width:50%;
		margin-bottom:0;
	}
	
	#topBox03 div.tel p {
    color: #3252AC;
    text-align: left;
    padding: 5px 5px;
    margin-top: 5px;
}
}


#topBox03 div.tel dl{
	width:230px;
	margin:5px auto;
	color:#777;
}

@media screen and (max-width:768px){
#topBox03 div.tel dl{
	margin:10px auto 0 auto;
}
}

#topBox03 div.tel dl dt{
	float:left;
	clear:both;
	width:90px;
	padding:3px;
	text-align:center;
	background-color:#98a8d5;
	color:rgba(255,255,255,0.8);
	margin-right:5px;
	border-radius:5px;
}

#topBox03 div.tel dl dd{
	margin-bottom:3px;
	padding:3px;
}


/*===================================
 * topBox04 MAP
 ==================================*/
#topBox04{
	padding:30px 0;
	background-color:#fff;
}
#topBox04 h2,
#topBox04 p.line50
{
	color:#333;
	width:150px;
	margin:0 auto;
}

#topBox04 p.line50:before,
#topBox04 p.line50:after{
	background-color:#333;
}

#topBox04 h3{
	margin-top:20px;
}
#topBox04 p.root{
	font-size:14px;
	color:#3252AC;
}
#topBox04 p.root:before{
	font-family:"FontAwesome";
	content:"\f1b9";
	position:relative;
	margin-right:5px;
}


/*google map*/
.g_map {
    position: relative;
    /*padding-bottom: 56.25%;*/
    padding-bottom: 40%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-bottom: 3px;
	margin-top:30px;
}

@media screen and (max-width:767px){
	.g_map {
    padding-bottom: 56.25%;
}
}

.g_map iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border:none;
}

/*===============================
ステンレス原料販売
================================*/

body#stainless div.titleh3 h3:before{
	content:"\f085";
	top:0px;
}

div.flowchart p.flowchart01{
	max-width:860px;
    margin: 0 auto 35px auto;
}

div.flowchart p.pc{
	display:none;
}

@media print, screen and (min-width:960px) {
	div.flowchart p.pc{
	display:block;
}
	
		div.flowchart p.sp{
	display:none;
}
}

/*===============================
シリコン系副資材の製造販売
================================*/

body#silicon div.titleh3 h3:before{
	content:"\f085";
	top:0px;
}

div.equipment_imgbox p.silicon_production{
	background-color:rgba(39, 113, 135, 0.7);
}

div.equipment_imgbox p.silicon_material{
	background-color:rgba(210, 217, 237, 0.5);
}

#silicon_process {
	max-width:800px;
	margin:30px auto;
}

#silicon_process .box01{
	position:relative;
	max-width:430px;
	border:1px solid #ddd;
	margin:30px auto;
	padding:1em;
	background-color:#e6f5f1;
}
#silicon_process p.caption{
	max-width:400px;
	margin:10px auto 0 auto;
}

#silicon_process .box01:not(.lastBox):after{
	position:absolute;
	bottom:-30px;
	left:50%;
	font-family:"FontAwesome";
	content:"\f13a";
	font-size:25px;
	color:#bece87;
	-weblit-transform:translateX(-50%);
	transform:translateX(-50%);
}

@media print, screen and (min-width:768px){
	div.process_box01 .box01{
		float:left;
		width:49%;
	}
	
	#silicon_process div.process_box01 div.left{
		margin-right:1%;
	}
	
	#silicon_process div.process_box01 div.right{
		margin-left:1%;
	}
	#silicon_process .box01:not(.lastBox):after{
		content:"";
	}
	
	#silicon_process div.process_box02{
		position:relative;
	}
	
	#silicon_process div.process_box02:after{
	position:absolute;
	bottom:-45px;
	left:50%;
	font-family:"FontAwesome";
	content:"\f13a";
	font-size:35px;
	color:#bece87;
	-weblit-transform:translateX(-50%);
	transform:translateX(-50%);
	}
	
	#silicon_process div.process_box02:before{
	position:absolute;
	top:-45px;
	left:50%;
	font-family:"FontAwesome";
	content:"\f13a";
	font-size:35px;
	color:#bece87;
	-weblit-transform:translateX(-50%);
	transform:translateX(-50%);
	}

}



/*===============================
各種加工コーディネート
================================*/

div#first_imgbox{
	margin:0 auto 30px auto;
}

div.business_box{
	border:1px solid #ddd;
	margin-bottom:30px;
	padding:1em;
	border-radius:5px;
}

div.business_box ul + p{
	margin-top:10px;
}

div.business_box ul li{
	margin-bottom:5px;
	text-indent:-1.4em;
	padding-left:1.4em;
}

div.business_box ul li:before{
	font-family:"FontAwesome";
	content:"\f1b2";
	position:relative;
	top:0px;
	color:#4a9b2d;
	margin-right:5px;
}


/*===============================
保有設備
================================*/

body#equipment article h2:before{
	font-family:"FontAwesome";
	content:"\f013";
	position:relative;
	top:0;
	margin-right:5px;
	color:#646b80;
}

body#equipment div.table_wrapp{
	margin:25px auto 25px 0;
	max-width:580px;
}

body#equipment div.table_wrapp table{
	width:100%;
}

body#equipment div.table_wrapp table th{
	text-align:left;
	color:#3a3f4b;
}

body#equipment div.table_wrapp table td{
	border-left:1px solid #fff;
	text-align:center;
}

body#equipment div.table_wrapp table th,
body#equipment div.table_wrapp table td{
	padding:8px 15px;
}

body#equipment div.table_wrapp table tr{
	background-color:#d2d9ed;
}

body#equipment div.table_wrapp table tr:nth-of-type(2n){
		background-color:#eaedf6;
}

div.equipment_imgbox{
	background:url("/web/20240630120016im_/http://www.houeisangyo.jp/wp-content/themes/houeisangyo/img/tile/stripes-light.png") repeat 0 0 ;
	/*background-color:#eaedf6;*/
	margin:25px auto;
	padding:5px 0;
}

div.equipment_imgbox:last-of-type{
		margin:25px auto 0 auto;
}

div.equipment_imgbox p{
	float:left;
	width:50%;
	padding:5px;
}

@media print, screen and (min-width:768px){
	div.equipment_imgbox p{
	width:25%;
	padding:10px;
}
}



/*===============================
会社概要・地図
================================*/

#greeting {
	border:1px solid #ddd;
	border-radius:15px;
	padding:1em;
	margin:30px auto;
	background-color:#f9f9fa;
}

@media print, screen and (min-width:768px){
	#greeting {
	padding:2em;
}
}

#greeting .textBlock h3{
	margin:0 auto 0.5em auto;
}

#greeting .textBlock p{
	/*font-family: 'Sawarabi Mincho';*/
	/*color:#000;*/
	text-indent:1em;
	font-size:15px;
	line-height:1.75;
	margin-bottom:0.25em;
	color:#242424;
}

div.greeting_photo{
	width:200px;
	margin:20px 0 0 auto;
}

div.greeting_photo img{
	border:8px solid #fff;	
	box-shadow:3px 3px 10px #ddd, 0px 0px 5px #eee;
}

@media print, screen and (min-width:769px){
	#greeting .textBlock{
	float:left;
	width:70%;
	}
	div.greeting_photo{
	float:left;
	margin:20px 0 0 0;
	width:30%;
	padding:1em 0 1em 1em;
	text-align:center;
}
	
	div.greeting_photo p{
		max-width:250px;
		margin:0 auto;
	}
}

/*会社概要*/

table.company{
width:100%;
margin:25px auto 35px auto;
border:1px solid #d0f6d5;
box-sizing:border-box;
}

table.company tr{
border-bottom: 1px #ddd dotted;
}

table.company th{
background-color:#ecedef;
box-sizing:border-box;
width:25%;
white-space:nowrap;
font-size:15px;
padding:1em;

}

table.company tr:nth-of-type(2n) th{
	background-color:#f9f9fa;
}



table.company td{
box-sizing:border-box;
font-size:15px;
padding:1em;
}


@media screen and (max-width:767px){

table.company th,
table.company td{
 display:block;
 width:100%;
}

table.company td{
line-height:1.5;
}
}

table.company td span.est{
	width:110px;
	display:inline-block;
}

table#kyoka th{
	background-color:#eaf5e6;
}

div#history{
	max-width:1080px;
	margin:0 auto 45px auto;
}

div#history dl {
	margin:0 0 15px 0;
	border-top:1px solid #ddd;
}

div#history dl dt{
	font-weight:bold;
	padding:15px 0 5px 0;
}

@media print, screen and (min-width:769px){
	div#history dl {
	display:table;
	width:100%;
	table-layout:fixed;
	padding-top:10px;
}
	
	div#history dl dt{
	display:table-cell;
	width:95px;
	vertical-align:middle;
	padding:15px 0 15px 10px;
	border-right:1px solid #ddd;
	border-left:3px solid #9ed08b;
	}
	div#history dl dd{
	display:table-cell;
	vertical-align:middle;
	padding:15px 0 15px 15px;
	}
	
	/*div#history dl dt:before{
	content:"";
	height:100%;
	border:1px solid red;
}*/
}

@media print, screen and (max-width:768px){
	div#history dl dt{
		position:relative;
	}
	
	div#history dl dt:after{
		position:absolute;
		left:0;
		bottom:2px;
		content:"";
		height:3px;
		width:75px;
		background-color:#9ed08b;
	}
	
	div#history dl dd{
		padding:5px 0 0 0 ;
	}
}

body#company .g_map {
    margin-top:10px;
}
@media print, screen and (max-width: 959px){
body#company .g_map {
    margin-left: -15px;
    margin-right: -15px;
}
}

div.office_box{
	border:1px solid #ddd;
	border-radius:5px;
	margin:25px auto;
	padding:1em;
}

/*-----------------------------------
 privacypolicy
 ----------------------------------*/ 
body#privacypolicy div.titleh2 h2{
	margin-bottom:20px;
}
body#privacypolicy article ul{
	margin:20px auto;
	font-size:15px;
}

body#privacypolicy article p{
	margin-bottom:20px;
}

body#privacypolicy article ul li:before{
	font-family:"FontAwesome";
	content:"\f0da";
	color:#3c2685;
	position:relative;
	top:0;
	margin-right:5px;
}




/*-----------------------------------
 お問い合わせフォーム
 ----------------------------------*/ 
body#contact dl.telfax
{
	max-width:1100px;
	margin:5px auto;
}

body#contact dl.telfax2{
	margin:5px auto 15px auto;
}

body#contact dl.telfax dt{
	float:left;
	width:60px;
	clear:both;
}

body#contact dl.telfax dt,
body#contact dl.telfax dd{
	font-size:22px;
	color:#207033;
	font-weight:bold;
}

body#contact dl.accept
{
	max-width:1100px;
	margin:5px auto;
}

body#contact dl.accept:last-of-type{
	margin:5px auto 35px auto;
}

body#contact dl.accept dt{
	float:left;
	width:100px;
	clear:both;
	background-color:#27883d;
	color:#fff;
	text-align:center;
	margin-right:10px;
}

body#contact dl.accept dt,
body#contact dl.accept dd{
	font-size:16px;
	padding:3px;
}

#contact_form {
	margin-bottom:25px;
}

.contact_head{
	margin-bottom:25px;
}


#contact_form dl {
    display: table;
    table-layout: fixed;
    width: 100%;
    margin-bottom: 0;
	margin-top:0;
    border-collapse: collapse;
}

#contact_form dt{
	display:table-cell;
	width:25%;
	font-weight:bold;
    background-color: #afdeba;
}

#contact_form dl:nth-of-type(2n) dt {
    background-color: #ccead3;
}

#contact_form dt,
#contact_form dd{
    margin-bottom: 0;
    text-align: left;
    border: #d0d0d0 1px solid;
    border-bottom: none;
    vertical-align: middle;
	padding:1em;
}

#contact_form dd{
	border-left:none;
}

#contact_form dl:last-of-type{
	border-bottom: #d0d0d0 1px solid;
    margin-bottom: 25px;
}

#contact_form span.tx{
	display:block;
	font-size:14px;
	margin:5px 0 10px 0;
	color:#555;
}

#contact_form span.required {
    display: inline-block;
    margin-left: 5px;
    background-color: #FAB001;
    border-radius: 3px;
    padding: 5px;
    line-height: 1;
	color:#fff;
	font-weight:normal;
	font-size:14px;
}

#contact_form input[type=text], 
#contact_form input[type=email], 
#contact_form textarea {
    display: block;
    border: #d0d0d0 1px solid;
    padding: 5px;
    width: 100%;
    box-sizing: border-box;
}

.mwform-tel-field input {
    display: inline-block !important;
    width: inherit !important;
}

textarea {
    resize: vertical;
}
textarea {
    overflow: auto;
}

#contact_form p.submit{
    text-align: center;
}

#contact_form input[type=submit] {
    display: inline-block;
    padding: 10px 20px;
    margin: 0 10px;
    background-color: #FAB001;
    border: #d0d0d0 1px;
    border-radius: 5px;
    font-size: 18px;
    font-weight: bold;
}

#contact_form input[type=submit]:hover{
	box-shadow:0 0 15px #177225;
	color:#177225;
}

#contact_form div.titleh2{
	display:none;
}

/*Media Query*/
@media screen and (max-width: 480px){
	
#contact_form dl,
#contact_form dt,
#contact_form dd{
    display: block;
    width: 100%;
}
	
#contact_form dd{
	border-left: #d0d0d0 1px solid;
}
	
#contact_form input[type=submit] {
    width: 100%;
    display: block;
    box-sizing: border-box;
    margin: 0;
}
	
	.mw_wp_form_confirm #contact_form input[type=submit].back{
		margin-bottom:15px;
	}
}

/* comfirm */
.mw_wp_form_confirm #contact_form div.titleh2{
	display:block;
}

.mw_wp_form_confirm #contact_form dd span{
	display:none;
}

.mw_wp_form_confirm #contact_form input[type=submit].back{
	background:#ddd;
}

.mw_wp_form_confirm .contact_head,
.mw_wp_form_complete .contact_head{
	display:none;
}

body#contact .mw_wp_form .error {
	font-size: 100%;
	color: red;
	font-weight:bold;
    display: block;
}




/*
     FILE ARCHIVED ON 12:00:16 Jun 30, 2024 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 08:46:04 Dec 03, 2024.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/
/*
playback timings (ms):
  captures_list: 2.006
  exclusion.robots: 0.024
  exclusion.robots.policy: 0.011
  esindex: 0.01
  cdx.remote: 8.231
  LoadShardBlock: 97.04 (3)
  PetaboxLoader3.datanode: 164.694 (5)
  load_resource: 184.286
  PetaboxLoader3.resolve: 36.917
  loaddict: 87.201
*/