@charset "utf-8";

/*------------------------------------------------------------------------------------------------------------------　productページ専用　---*/

.chi_main hr {
	width: 80%;
	margin : 1.5em auto;
}
.margin_t {
	margin-top: 2em;
}
.margin_b {
	margin-bottom: 40px;
}

/*----------------　product孫ページコンテナ　---*/

.singleMain {
	width: 80%;
	margin: 0 auto;
	min-height: 70vh;
	padding-top: 8em;
	text-align: center;
}

.singleMain h1 {
	width: 100%;
	font-size: 130%;
	font-weight: bold;
	margin-bottom: 2em;
	padding: 0.4em 0;
	color: #ffffff;
	background-color: #191970;
	border: none;
}

.singleMain h2 {
	font-size: 120%;
	font-weight: bold;
	margin-bottom: 2em;
}


.blog-content figure {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.blog-content p {
	padding-left: 20%;
	text-align: left;
}

.blog-content table {
	margin: 20px auto;
	border: 2px solid;
}

.blog-content table td {
	text-align: left;
}



/*----------------　レスポンシブ設定　---*/


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

	.head_space {
		width: 100%;
		height: 50px;
	}

	.chi_main {
		width: 100%;
	}
	.chi_main h2 {
		width: 400px;
		font-size: 110%;
		text-align: center;
		color: #000000;
		margin-left: auto;
		margin-right: auto;
		background: -moz-linear-gradient(top left, #7fff4d, #808000);
		background: -webkit-linear-gradient(top left, #7fff4d, #808000);
		background: linear-gradient(to bottom right, #7fff4d, #808000);
		border-top: 6px double #4b0082;
		border-bottom: 6px double #4b0082;
		margin-bottom: 1.5em;
	}

	.flex-container {
		display:flex;
		flex-wrap: wrap;
		width: 400px;
		margin-left: auto;
		margin-right: auto;
		align-items: flex-start;
		justify-content: space-around;
	}
	.flex-item {
		width: 300px;
		text-align: center;
		font-size: 85%;
		margin: 5px 10px;
		padding: 5px;
		border: 1px dotted #333333;
	}
	.flex-item img {
		width: 200px;
		height: 150px;
		text-align: center;
	}

	.blog-content table td {
		padding: 0 .5em;
		font-size: 80%;
	}
}


@media screen and (min-width: 681px) and (max-width: 1020px) {
	.head_space {
		width: 100%;
		height: 65px;
	}

	.chi_main {
		width: 100%;
	}
	.chi_main h2 {
		width: 600px;
		font-size: 110%;
		text-align: center;
		color: #000000;
		margin-left: auto;
		margin-right: auto;
		background: -moz-linear-gradient(top left, #7fff4d, #808000);
		background: -webkit-linear-gradient(top left, #7fff4d, #808000);
		background: linear-gradient(to bottom right, #7fff4d, #808000);
		border-top: 6px double #4b0082;
		border-bottom: 6px double #4b0082;
		margin-bottom: 1.8em;
	}

	.flex-container {
		display:flex;
		flex-wrap: wrap;
		width: 680px;
		margin-left: auto;
		margin-right: auto;
		padding-left: 10px;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.flex-item {
		width: 300px;
		text-align: center;
		font-size: 85%;
		margin: 5px 10px;
		padding: 5px;
		border: 1px dotted #333333;
	}
	.flex-item img {
		width: 200px;
		height: 150px;
		text-align: center;
	}

	.blog-content table td {
		padding: 0 1em;
		font-size: 90%;
	}
}


@media screen and (min-width: 1021px) and (max-width: 1340px) {
	.head_space {
		width: 100%;
		height: 70px;
	}

	.chi_main h2 {
		width: 850px;
		font-size: 120%;
		text-align: center;
		color: #000000;
		margin-left: auto;
		margin-right: auto;
		background: -moz-linear-gradient(top left, #7fff4d, #808000);
		background: -webkit-linear-gradient(top left, #7fff4d, #808000);
		background: linear-gradient(to bottom right, #7fff4d, #808000);
		border-top: 6px double #4b0082;
		border-bottom: 6px double #4b0082;
		margin-bottom: 1.8em;
	}

	.flex-container {
		display:flex;
		flex-wrap: wrap;
		width: 1010px;
		margin-left: auto;
		margin-right: auto;
		padding-left: 10px;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.flex-item {
		width: 300px;
		text-align: center;
		font-size: 85%;
		margin: 5px 10px;
		padding: 5px;
		border: 1px dotted #333333;
	}
	.flex-item img {
		width: 200px;
		height: 150px;
		text-align: center;
	}

	.blog-content table td {
		padding: 0 1.5em;
		font-size: 100%;
	}
}


@media screen and (min-width: 1341px) {
	.head_space {
		width: 100%;
		height: 70px;
	}

	.chi_main {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	.chi_main h2 {
		width: 1010px;
		font-size: 120%;
		text-align: center;
		color: #000000;
		margin-left: auto;
		margin-right: auto;
		background: -moz-linear-gradient(top left, #7fff4d, #808000);
		background: -webkit-linear-gradient(top left, #7fff4d, #808000);
		background: linear-gradient(to bottom right, #7fff4d, #808000);
		border-top: 6px double #4b0082;
		border-bottom: 6px double #4b0082;
		margin-bottom: 1.8em;
	}

	.flex-container {
		display:flex;
		flex-wrap: wrap;
		width: 1340px;
		padding-left: 10px;
		margin-left: auto;
		margin-right: auto;
		justify-content: flex-start;
	}
	.flex-item {
		width: 300px;
		text-align: center;
		font-size: 85%;
		margin: 5px 10px;
		padding: 5px;
		border: 1px dotted #333333;
	}
	.flex-item img {
		width: 200px;
		height: 150px;
		text-align: center;
	}

	.blog-content table td {
		padding: 0 1.5em;
		font-size: 100%;
	}
}