@charset "utf-8";

body{
	margin:0px;
	overflow-y: scroll;
}

#wrapper{
}

#container{
  max-width: 900px;
  margin: 0 auto;
}

#header{
  width:100%;
  text-align: center;
  display: block;
}


/************各ページへのリンクボタン************/
#header_menu{
	text-align: center;
	display: table;
	width:100%;
	height:50px;
	padding:5px 0px 5px 0px;
}


/***********各カテゴリボタン装飾用***********/
.menu{
	display : table-cell;
	width: 12.5%;
	height:40px;
	border:1px #0a51a1 solid;
	padding:2px;
}

/*ボタンマウスオーバー時枠色*/
.menu:hover .menu_top{ 
	background-color:white;
	color:#0a51a1;
	font-weight:bold;
	transition: all 0.5s ;
}

.menu:hover .menu_bottom{ 
	background-color:#0a51a1;
	color:white;
	transition: all 0.5s ;
}

.menu:hover{ 
	background-color:#0a51a1;
	transition: all 0.5s ;
}

/*ボタン上側*/
.menu_top{
	display:block;
	background-color:#0a51a1;
	height:20px;
	color:white;
	font-size:1.5vmin;
}
/*ボタン下側*/
.menu_bottom{
	display:block;
	background-color:white;
	height:16px;
	padding-top:3px;
	color:#0a51a1;
	font-size:1vmin;
}


/*リンクの下線消し*/
.border_off{
	text-decoration: none;
}
/***********各カテゴリボタン装飾用ここまで***********/

/************社名ロゴ************/
#company_logo{
	display:flex;
	width:880px;
	height:100px;
 	background: linear-gradient(to bottom, #0a51a1, #ffffff);
 	padding:20px 10px 20px 10px;
}

#company_mark{
	margin: 0 auto;
	padding:10px;
	align:left;
	width:15%;
}

#company_name{
	display:block;
	margin: 0 auto;
	width:85%;
	align:right;
	font-family:Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
	

}

.text_shadow_plus3{
	color:white;
	text-shadow:3px 3px 0px #0a51a1;
	font-size:xxx-large;
	margin:0px;
	font-family:Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
	font-weight:bold;
	}

.text_shadow_plus2{
	color:white;
	text-shadow:2px 2px 0px #0a51a1;
	font-size:large;
	margin:0px;
}
/************社名ロゴここまで************/

/*サイト内検索*/
#search{
	display: flex;
 	width: 900px;
	height: 60px;
	align-items: center;
	padding:3px;
	}


/*メインコンテンツ*/
#body{
	width:100%;
}



#empty{
	height:30px;
}


/*フッター部*/
#footer{
	width:100%;
	display:block;
	background: linear-gradient(to bottom, #ffffff, #0a51a1);
	height:200px;
	margin-top:50px;
	height: 100px ;
	
}

/*見出し用*/
.headline{
	background-color :#0a51a1 ;
	color:white;
  	width:100%;
	font-size:x-large;
	font-weight:bold;
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
	padding:3px 3px 3px 8px;
}




h2{
  color:white;
  font-family:'GEORGIA' , 'sans-serif';
  text-shadow: 4px 4px 3px #0a51a1;
  display: block;
  background-color :#0a51a1 ;
  padding:5px ;
}

h3{
  display: block;
  padding:8px ;

}


/*赤文字用*/
.redfont{
	color: red;
}

/*太文字*/
.strong{
	font-weight:bold;
	
}

/*リンクボタン用*/
a.button{
	display:block;
	text-align:center;
	text-decoration:none;
	color:blue;
	box-sizing:border-box;
}

a.button:hover{
	background-color:#99CCFF;
	transition:all .5s;
}


p{
	font-size:small;
}

p.inquiry{
	color :white;
	background-color:;
	padding:5px ;
}



li{
	font-size:small;
}



/*総合カタログページここから*/
.general_catalog{
	display:table;
	/*padding: 10px 10px 0px 10px;*/
	text-align:center;
	
}

.catalog_name{
	padding:0px 10px 10px 10px;
	text-align:center;
	margin:auto;
	background-color:blue;
}

/*カタログ表紙アイコン設定*/
img.catalog_cover{
	width:200px;
	padding:5px;
}

.catalog_cover:hover{
	background-color:#66CCFF;
	transition:all .5s;
	filter: brightness(120%);
}

/*↑の旧カタログ用*/
img.old_cover{
	padding: 5px;
	width:150px;
	margin:	0px 70px 0px 70px;
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
}

.old_cover:hover{
	background-color:#66CCFF;
	transition:all .5s;
	filter: brightness(120%);
}


/*カタログカバー表示用*/
.cover{
	display:table-cell;
	width:300px;
	text-align:center;
}


#old_catalog{
	display:table-cell;
	text-align:center;
	width:892px;
	padding:10px 3px 10px 3px;
	border:solid 1px;
	margin:0px 0px 10px 0px;
}

/*カタログカバー空白用*/
.catalog_blank{
	padding:5px;
	width:200px;
	margin:0px 45px 0px 45px;

}

/*旧カタログ見出し*/
.old_catalog_headline{
	background-color :#555555 ;
	display: inline-block;
	color:white;
	width:100%;
	font-size:large;
	font-weight:bold;
	padding:3px 0px 3px 3px;
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
}

/************個別カタログリンク用ここから************/
.plist_link{
	border:2px fuchsia solid;
}

.plist_link2x{
	border:0.5px fuchsia solid;
}

.middle{
	display:flex;
	vertical-align:middle;
}

.catalog_index{
	width:100%;
	padding:2px;
}

.category{
	width:100%;
	border: solid 1px;
	border-color:white;
	text-align:center;
	background-color:#9999FF;
	color:white;
}


.link{
	width:50%;
	text-align:center;
	background-color:#cddcec;
}
/************個別カタログリンク用ここまで************/

/*商品アイコンリスト用横列*/
.product_row{
	width:900px;
	height:240px;
	display:table;
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
	text-align:center;
	margin:5px 0px 5px 0px;
}

.product_row_top{/*↑の部品図等へのリンク有用*/
	width:900px;
	height:240px;
	display:table;
	text-align:center;
	margin-top:5px;
}

.catalog_page_bottom{/*↑の下の部品図等表示用*/
	width:900px;
	display:table;
	vertical-align:top;
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
	text-align:center;
	margin-bottom:5px;
}



.icon{/*各商品アイコン用*/
	display:table-cell;
	width:220px;
	height:220px;
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
	margin:4px;

}


span.icon2x{
	display:table-cell;
	width:440px;
	margin:6px;
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
}

span.icon_info{
	vertical-align:top;
	font-size:x-small;
	width:220px;
	display:table-cell;
}

/*改行用*/
span.br{
	display:block;
	margin:0px;
	
}

.file_link{
	width:220px;
}

/*アイコン下リンク用*/
.br_small_font{
	display:block;
	font-size:x-small;
	width:220px;
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
	margin:4px;
}

/*カタログページ*/
/*リンク部*/


.table_page{
	width:100%;
	table-layout:fixed;
	
}

.th_page{
	width:25%;
	background-color:#0a51a1;
	color:white;
	padding:2px;
}



.td_page{
	background-color:white;
	border: solid 1px;
	border-color:#0a51a1;
	text-align:center;
	table-layout:fixed;
	color:black;
}


/*pdfまとめてダウンロード部分*/
.download{
	text-align:center;
	padding:2px;
}

/*カタログページ表示部分*/
.page{
	padding:10px 0px 30px 0px;
	text-align:center;	
}



/*カタログページ下部リンク*/
.bottom_link{
	width:892px;
	padding:3px;
	border:solid 1px;
	border-color:#0a51a1;
  	display: table;
}

.page_back{
	width:50%;
	display: table-cell;
}
.page_next{
	text-align:right;
	width:50%;
	display: table-cell;
}

/*******************カタログ目次******************************/
.contents_hl{
	display: flex;
	padding:10px;
}

/*カタログ目次ボタン*/
a.contents_btn{
	font-family:HG丸ｺﾞｼｯｸM-PRO;
	font-weight:bold;
	color:black;
    width:420px;
	height:35px;
	border-bottom:solid 2px;
	border-left:solid 12px;
	border-color:silver;
	padding:3px 0px 3px 5px;
	display:inline-block;
	text-decoration:none;
	margin:0px 5px 0px 5px;
	display:table;
}

.left_font{
	display:table-cell;
	vertical-align:middle;
	width:85%;
}

.left_font_s{
	display:table-cell;
	vertical-align:middle;
	width:85%;
	font-size:small;
}

a.contents_btn:hover{
	background-color:#CCFFFF;
	transition:all .5s;
}

/*ページ数右寄せ*/
.page_right{
	font-size:x-large;
	display:table-cell;
	vertical-align:middle;
	text-align:right;
	padding-right:3px;
	width:15%;
}
/*****************カタログ目次ここまで*************************/

/*****************カタログ各ページ************************/
/*とりあえずテスト用*/
.page{
	box-sizing: border-box;/*親要素からはみ出るのを防止*/
}

/*半自動溶接機関連*/
.category_name{
	width:100%;
	padding-bottom:10px;
	text-align:center;
	vertical-align:middle;
	font-family:HG丸ｺﾞｼｯｸM-PRO;
	font-size:xx-large;
	line-height:0%;
}

/*小赤文字用*/
.red_small{
	font-size:xx-small;
	color:red;
}


.small_pic{
	overflow: visible;
	width: 290px;
	padding:2px;
}


/*********マウスオーバー時の画像拡大用(非実装)********
実装の際は、
・.half_pic、.middle_pic、.lager_picでも同じ動作をする様に変更する。
・実際の画像も拡大に耐えられる様に作り直す(例：今まで290pxで保存していたものを750pxにする)
・すべての商品画像に、class="small_pic"(サイズによって、half、middle、largeは適宜変更)を設定する。
以上を行う。*/


.small_pic img{
	display: block;
	transition-duration: 1s;}

.small_pic:hover{
	transform: scale(1.5);
	transition-duration: 1s;

}


.half_pic{
	overflow: visible;
	width:440px;
}

.half_pic img{
	display: block;
	transition-duration: 1s;}

.half_pic:hover{
	transform: scale(1.44);
	transition-duration: 1s;

}


.middle_pic{
	overflow: visible;
	width:590px;
}

.middle_pic img{
	display: block;
	transition-duration: 1s;}

.middle_pic:hover{
	transform: scale(1.5);
	transition-duration: 1s;

}


.large_pic{
	overflow: visible;
	width:890px;
}

.large_pic img{
	display: block;
	transition-duration: 1s;}

.large_pic:hover{
	transform: scale(1.4);
	transition-duration: 1.5s;

}




/*コメント用*/
p.comment{
	margin:0px;
	font-size:small;
}

/*カタログ有商品用アイコン*/
.pdf_icon{

}

/*カタログ有商品アイコンマウスオーバー時用*/
.pdf_icon:hover{
	filter: brightness(120%);
	transition:all .5s;

}

.left_aligned{/*左寄せ*/
	font-size:medium;
	text-align:left;
	padding:5px 10px 5px 10px;
}

/*個別リンク設定カタログページ用*/
/*横列*/
.page_row{
	display:table;
	width:900px;
	margin:0px;
}

.page_row_large{
	display:table;
	width:900px;
	margin:0px;
}

.page_row_long{/*縦に長い商品用*/
	display:table;
	width:900px;
	margin:0px;
}

/*横列送料*/
.page_postage{
	display:table;
	width:900px;
	padding-bottom:15px;
	vertical-align:text-top;
}

/*商品1マス*/
.product_10{
vertical-align:top;
	display:table-cell;
	width:290px;
}

/*送料1マス*/
.postage_10{
	display:table-cell;
	width:290px;
	text-align:right;
	font-family:HG丸ｺﾞｼｯｸM-PRO;
	font-weight:bold;
	padding-bottom:5px;
	padding-right:5px;
}


/*商品1.5マス*/
.product_15{
	display:table-cell;
	width:440px;
}

/*送料1.5マス*/
.postage_15{
	display:table-cell;
	width:450px;
	text-align:right;
	font-weight:bold;
	font-family:HG丸ｺﾞｼｯｸM-PRO;
	font-weight:bold;
	padding-bottom:5px;
	padding-right:5px;
}


/*商品2マス*/
.product_20{
	display:table-cell;
	width:590px;
	padding:5px;
}

/*送料2マス*/
.postage_20{
	display:table-cell;
	width:590px;
	text-align:right;
	font-weight:bold;
	font-family:HG丸ｺﾞｼｯｸM-PRO;
	padding-bottom:5px;
	padding-right:5px;
}

/*商品3マス*/
.product_30{
	display:table-cell;
	width:880px;
}



/*商品2x2マス*/
.product_2x2{
	float:left;
	width:600px;
	height:418px;
	padding:5px 0px 5px 0px;
	vertical-align:top;
}

/*その横縦2マス分*/
.side_2x2{
	float:right;
	width:300px;
	height:428px;
	
}

.side_2x2_produce{
	width:290px;
	padding:5px;
}

.side_2x2_postage{
	text-align:right;
	font-weight:bold;
	padding-right:10px;
	margin-bottom:20px;
	font-family:HG丸ｺﾞｼｯｸM-PRO;
	padding-bottom:5px;
	padding-right:5px;
}

/*上の横列の枠*/
.page_row_2x2{
	width:900px;
	height:438px;
}


/*枠2マス*/
.frame_2{
	width:565px;
	height:170px;
	padding:10px;
	margin:5px;
	border:2px #0066CC solid;
	text-align:left;
}


.strongL{
	font-size:large;
	font-weight:bold;
}



/*送料3マス*/
.postage_30{
	display:table-cell;
	width:890px;
	text-align:right;
	padding-right:10px;
	font-weight:bold;
	font-family:HG丸ｺﾞｼｯｸM-PRO;
}


.product_link{
	display:block;
	background-color:aqua;
}


a.product_link  :hover{
	transition:all 1.5s;
	background-color:chartreuse;

}

/*余白消し*/
P.lh{
	font-weight:bold;
	font-size:x-small;
	line-height:0px;/*余白消し*/
}

P.lh_r{
	color:red;
	font-weight:bold;
	font-size:x-small;
	line-height:0px;/*余白消し*/
}



P.lh_red{
	font-weight:bold;
	font-size:x-small;
	line-height:0px;/*余白消し*/
	color:red;
}


.page_row_border{
	font-weight:bold;
	font-family:HG丸ｺﾞｼｯｸM-PRO;
	width:886px;
	border:2px #0a51a1 solid;
	margin:0 auto;
	margin-bottom:20px;
}

/*下部ページ・カテゴリ表記*/
.page_category{
	width:900px;
	margin-bottom:20px;
	
}

.page_no{
	display:inline-block;
	width:900px;
	text-align:center;
}

.bottom_category{
	display:inline-block;
	width:900px;
	text-align:right;
	line-height:20%;
	font-family:HG丸ｺﾞｼｯｸM-PRO;
	font-weight:bold;
}