@charset "utf-8";

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  line-height: 1.6;
  font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

p {
	margin-bottom: 2em;
}

ul {
	list-style: none;
}

@media (min-width: 768px) {
	.sp_only {
		display: none;
	}	
}

@media (max-width: 768px) {
  .pc_only {
		display: block;
		margin-top: 0;
	}
}

.small {
	font-size: 75%;
}

.large {
	font-size: 125%;
}

.center {
	text-align: center;
}

.right {
	text-align: right;
}

.mgb0 {
	margin-bottom: 0;
}

.mgb1 {
	margin-bottom: 1em;
}

.mgr1 {
	margin-right: 1em;
}
hr {
	margin-bottom: 2em;
	border-right: none;
    border-bottom: none;
    border-left: none;
	border-top: 2px dashed #fff;
}
header {
	background:#231815 url(../images/bg_head-top.png) repeat-x 0 top;
	overflow: hidden;
	margin-bottom: 5em;
}

header p {
	background:#231815 url(../images/bg_head-middle.png) repeat-x 0 bottom;
	color: #fff;
	text-align: center;
	margin: 1em 0 0;
	padding-bottom: 1em;
}

.slider {
	width: 1200px;
	margin: 0 auto 0;
}

.slider img {
	width: 100%;
	height: auto;
}

.container img {
	margin-bottom: 2em;
}

nav ul {
	text-align: center;
	margin-bottom: 20px;
}

nav ul li {
	display: inline;
	padding: 0 1.5em;
}

nav ul li a {
	color: #fff;
	text-decoration: none;
}
nav#nav_head {
	background:url(../images/bg_head-bottom.png) repeat-x 0 top;
	padding-top: 25px;
}
nav#nav_bottom {
	margin-bottom: 4em;
}
nav#nav_bottom ul li a {
	color: #333;
	text-decoration: none;
}

nav ul li:not(:first-child):not(:last-child):not(:nth-last-child(2)){
	border-right: 1px solid #fff;
}

nav ul li:last-child{
	border-left: 1px solid #ea5504;
}

nav#nav_bottom ul li:not(:first-child):not(:last-child):not(:nth-last-child(2)){
	border-right: 1px solid #000;
}

.container {
	width: 1000px;
	margin: 0 auto;
}

section {
	margin-bottom: 100px;
}

h1 {
	text-align: center;
	margin-bottom: 2em;
	font-size: 2em;
	background: url(../images/emblem.png) no-repeat center top;
	padding-top: 120px;

}

h1.emb2 {
	text-align: center;
	margin-bottom: 2em;
	font-size: 2em;
	background: url(../images/emblem2.png) no-repeat center top;
	padding-top: 120px;

}

h2 {
	text-align: center;
	font-size: 1.6em;
	margin-bottom: 1em;
}

h3 {
	text-align: center;
	font-size: 1.4em;
	margin-bottom: 1em;
}

figcaption {
	text-align: center;
	margin-bottom: 0.5em;
}

figure {
	text-align: center;
}

#list_certificate {
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
}

#list_certificate li:nth-child(odd):not(:first-child) {
	margin-left:150px;
}


#sec_history {
	background: #231815;
	color: #fff;
	padding: 30px 0;
}

#photo_history {
	display: flex;
	justify-content:space-between;
	margin-bottom: 4em;
}

#photo_history img {
	margin-bottom: 0;
}

#photo_history figcaption {
	text-align: right;
}

.photo_saji {
	display: flex;
	justify-content: space-between;
}

#sec_company {
	text-align: center;
}

#list_products {
	display: flex;
	flex-wrap: wrap-reverse;
	justify-content: space-around;
	margin-bottom: 4em;
	flex-direction:row-reverse;
}

#list_products li {
	margin-bottom: 2em;
}

#list_products li img {
	margin-bottom: 1em;
}

#wrap_table{
	width: 47.5%;
	margin: 0 auto 2em;
}

#wrap_table table {
	margin-bottom: 2em;
	border-collapse:collapse;
}

table {
	border-top: 1px solid #333;
}
th,td {
	border-bottom: 1px solid #333;
	padding:0.5em 0;
}

td {
	padding-right: 2em;
}

th {
	padding: 0 1em;
	width: 4em;
}
#sec_products h3 {
	text-align: left;
	margin:0 0 0.5em 1em;
}

#nav-fix {
	position: fixed;
	right: 20px;
	bottom: 80px;
	z-index: 100 !important;
}
#nav-fix li {
	text-align: center;
	display: table;
	width: 80px;
	height: auto;
}

#nav-fix li a {
	display: table-cell;
	vertical-align: middle;
}

#nav-fix li a img {
	width: 80px;
	height: auto;
}

#nav-fix li a:hover {

}

.modal{
    display: none;
    height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
}

.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
}

.modal__content{
    background: #fff;
    left: 50%;
    padding: 40px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
    max-height: 100vh;
    overflow:scroll;
}

footer {
	text-align: center;
	background: #231815;
	color: #fff;
}

footer p {
	margin-bottom: 0;
}


@media (max-width: 768px) {
	header {
		background:#231815 url(../images/bg_head-top.png) repeat-x 0 top;
		background-size:contain;
		margin-bottom: 2em;
	}
	header p {
		background:#231815 url(../images/bg_head-middle.png) repeat-x 0 bottom;
		background-size:contain;
		margin: 0.5rem 0 0;
		padding-bottom: 0.5rem;
		font-size: small;
	}
	nav ul {
		font-size: 0;
	}
	nav ul li {
		font-size: small;
		padding: 0 0.5em;
	}
	nav ul li:first-child {
		padding-right: 0;
	}
	nav ul li:nth-of-type(4) {
	    border-right: none !important;
	}
	nav#nav_head {
		background:url(../images/bg_head-bottom.png) repeat-x 0 top;
		background-size:contain;
		padding-top: 0.5em;
	}
	nav#nav_head ul {
		margin-bottom: 0.25rem;
	}
	h1 {
		margin-bottom: 1em;
	}
	.slider {
		width: 100%;
	}
	.container {
		width: 90%;
	}
	section {
		margin-bottom: 3em;
	}
	img {
		width: 100%;
		height: auto;
	}
	#f_logo {
		width: 25%;
		margin: 0 auto 1em;
	}
	#list_certificate li {
		width: 100%;
	}
	#list_certificate li:nth-child(odd):not(:first-child) {
		margin-left: 0;
	}
	#photo_history,
	.photo_saji {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	#wrap_table{
		width: 100%;
		margin: 0 auto 2em;
	}
	table, th, td {
		font-size: 90% !important;
	}
	#sec_products h3 {
		text-align: left;
		margin:0 0 0.5em 0.25em !important;
	}
	td {
		padding-right: 0;
	}
	th {
		padding: 0 0.5em 0 0;
		width: 4em;
	}
	#list_products li {
		width: 47.5%;
	}
	#nav-fix {
		right: 10px;
		bottom: 40px;
	}
	#nav-fix li {
		width: 40px;
	}
	#nav-fix li a img {
		width: 40px;
	}
	.modal__content{
	    background: #fff;
	    left: 50%;
	    padding: 40px 20px;
	    position: absolute;
	    top: 50%;
	    transform: translate(-50%,-50%);
	    width: 90%;
	    max-height: 100vh;
	    overflow:scroll;
	}
	#f_p {
		font-size: small;
	}
	footer p {
		font-size: small;
		padding:0.5em 0;
	}
}