@charset "UTF-8";

/* コンテンツヘッダー
---------------------------------------*/
article header div.bg{
	/* background-image:linear-gradient(0deg, rgba(255, 255, 255, 1) 2%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, .0)),url('../img/products/img_header.jpg'); */
	background-image:url('../img/products/img_header.jpg');
	background-color:rgba(255,255,255,0.3);
	background-blend-mode:lighten;
}

/* コンテンツ
---------------------------------------*/
article div#content_wrapper section{
	padding:45px 0;
}

article div#content_wrapper section div{
	/*width:1000px;*/
	height:100%;
	margin:0 auto;
}

/* 画面幅1250px未満
=======================================*/
@media screen and (max-width:1250px){
	article div#content_wrapper section div{
		width:100%;
	}
}

/* 画面幅768px未満
=======================================*/
@media screen and (max-width:768px){
	article div#content_wrapper section{
		padding:40px 0;
	}
	article header div.bg{
		background-color:rgba(255,255,255,0.5);
	}
}

/* 画面幅480px以下
=======================================*/
@media screen and (max-width:480px){

}

/* Concept
---------------------------------------*/
article div#content_wrapper section#products div.container{
	/* width:1000px; */
	width: 100%;
}
article div#content_wrapper section#products div.container > div{
	padding:0 20px;
	max-width:1000px;
	width: 100%;
	margin: 0 auto;
	box-sizing:border-box;
}

article div#content_wrapper section#products div.container div h1{
	width:100%;
	height:55px;
	/* line-height:55px; */
	border:2px solid #0d4746;
	color:#0d4746;
	font-size:25px;
	margin-bottom:30px;
	box-sizing:border-box;
	display: flex;
    justify-content: flex-start;
    align-items: stretch;
}
article div#content_wrapper section#products div.container div h1 b{
	display: flex;
    justify-content: flex-start;
    align-items: center;
	height: inherit;
	box-sizing:border-box;
}
article div#content_wrapper section#products div.container div h1 b em{
	font-size: 27px;
	color: #ff33e6;
	font-style: normal;
	font-weight: 600;
	height: auto;
	box-sizing:border-box;
	display: inline-block;
	margin-right: 1em;
    /* background: linear-gradient(transparent 70%, #ffcccc 70%); */
}
article div#content_wrapper section#products div.container div h1 span{
	background-color:#0d4746;
	color:#FFF;
	display:inline-block;
	width:55px;
	height:auto;
	text-align:center;
	margin-right:18px;
	display: flex;
    justify-content: center;
    align-items: center;
	box-sizing:border-box;
}
article div#content_wrapper section#products div.container div h1 b br{
	display: none;
}
article div#content_wrapper section#products div.container div p{
	color:#000;
	font-size: 16px;
	text-align:left;
	margin-bottom:30px;
}
article div#content_wrapper section#products div.container div p a{
	color:#64aa45;
	font-size: 16px;
	font-weight: 600;
	margin: 0 8px;
	transition: all 0.3s ease;
}
article div#content_wrapper section#products div.container div.category4 p a{
	/* color:#d57b1d; */
  color:#FFA500;
}

article div#content_wrapper section#products div.container div p a:hover{
	opacity: 0.7;
}
article div#content_wrapper section#products div.container hr{
	margin-top: 60px;
	margin-bottom: 50px;
	border: none;
    background-color: #fff;
	border-bottom: solid 1px #a8d3b9;
	width: 100%;
}
article div#content_wrapper section#products div.container div div ul{
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
}
article div#content_wrapper section#products div.container div div ul li{
	width: calc((100% - (1% * 2)) / 3);
	margin-right: 1%;
}
article div#content_wrapper section#products div.container div div ul li figure{
	width: 100%;
	position: relative;
}
article div#content_wrapper section#products div.container div div ul li figure img{
	width: 100%;
	height: auto;
}
article div#content_wrapper section#products div.container div div ul li figure figcaption{
	width: 100%;
	text-align: left;
	font-size: 16px;
	color: #000;
}
article div#content_wrapper section#products div.container div div ul li figure.upper figcaption{
	top: 90%;
    position: absolute;
}
article div#content_wrapper section#products div.container div.category1 div ul li{
	width: calc((100% - (1% * 2)) / 3);
	margin-bottom: 25px;
}
article div#content_wrapper section#products div.container div.category1 div ul li:nth-of-type(3n){
	margin-right: 0;
}
article div#content_wrapper section#products div.container div.category2 div ul li{
	width: calc((100% - (1% * 2)) / 3);
	margin-bottom: 40px;
}
article div#content_wrapper section#products div.container div.category2 div ul li:nth-of-type(3n){
	margin-right: 0;
}
article div#content_wrapper section#products div.container div.category3 div ul li{
	width: calc((100% - (1% * 3)) / 4);
	margin-bottom: 25px;
}
article div#content_wrapper section#products div.container div.category3 div ul li:nth-of-type(4n){
	margin-right: 0;
}
article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(1) li{
	width: calc((100% - (1% * 4)) / 5);
	margin-bottom: 15px;
}
article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(1) li:nth-of-type(5n){
	margin-right: 0;
}
article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(2) li{
	width: calc((100% - (1% * 3)) / 4);
	margin-bottom: 25px;
}
article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(2) li:nth-of-type(4n){
	margin-right: 0;
}

article div#content_wrapper section#products div.container div.downlord {
	margin-bottom: 70px;
}
article div#content_wrapper section#products div.container div.downlord h2{
	margin: 0 auto 55px auto;
	text-align: center;
	font-size: 30px;
	font-weight: 600;
	line-height: 140%;
	color: #0d4746;
}
article div#content_wrapper section#products div.container div.downlord h2 br{
	display:none;
}
article div#content_wrapper section#products div.container div.downlord div:nth-of-type(1){
	margin: 0 auto;
	width: 100%;
	/* max-width: 440px; */
	max-width: 600px;
}
article div#content_wrapper section#products div.container div.downlord div:nth-of-type(2){
	width: 100%;
}
article div#content_wrapper section#products div.container div.downlord div a{
	text-align: center;
	font-size: 26px;
	font-weight: 600;
	line-height: 200%;
	color: #64aa45;
	border: #64aa45 solid 2px;
	border-radius: 25px 25px;
	transition: all 0.5s ease;
	margin-bottom: 20px;
	display: flex;
  justify-content: center;
  align-items: center;
  padding: 2px 0 0 0;
  box-sizing: border-box;
}
article div#content_wrapper section#products div.container div.downlord div a.pcview {
	display: flex;
}
article div#content_wrapper section#products div.container div.downlord div a.spview {
	display: none;
}
article div#content_wrapper section#products div.container div.downlord div a:hover{
	color: #fff;
	background-color: #64aa45;;
}

article div#content_wrapper section#products div.container div.downlord div a:nth-of-type(2n){
	/* color: #d57b1d;
	border: #d57b1d solid 2px; */
  color: #FFA500;
	border: #FFA500 solid 2px;
	margin-bottom: 0;
  padding: 2px 0 0 0;
  box-sizing: border-box;
}
article div#content_wrapper section#products div.container div.downlord div a:nth-of-type(2n):hover{
	color: #fff;
	/* background-color: #d57b1d; */
  background-color: #FFA500;
}
article div#content_wrapper section#products div.container div.downlord p{
	margin: 60px auto;
	text-align: center;
	font-size: 16px;
	line-height: 180%;
	color: #000;
}
article div#content_wrapper section#products div.container div.downlord div ul li{
	width: calc((100% - (1% * 3)) / 4);
	margin-bottom: 10px;
}
article div#content_wrapper section#products div.container div.downlord div ul li:nth-of-type(4n){
	margin-right: 0;
}
/* 画面幅1024px未満
=======================================*/
@media screen and (max-width:1024px){
	

}


/* 画面幅768px未満
=======================================*/
@media screen and (max-width:768px){

	article div#content_wrapper section#products div.container div h1{
		margin-bottom:40px;
	}
	article div#content_wrapper section > div {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	article div#content_wrapper section#products div.container > div{
		padding:0 5%;
	}
}

/* 画面幅620px未満
=======================================*/
@media screen and (max-width:630px){
	article div#content_wrapper section#products div.container div h1{
		font-size:22px;
	}
	article div#content_wrapper section#products div.container div h1 b em{
		font-size:24px;
	}
	article div#content_wrapper section#products div.container div.downlord h2{
		font-size: 26px;
	}
	article div#content_wrapper section#products div.container div.downlord div:nth-of-type(1){
		margin: 0 auto;
		width: 100%;
		max-width: 440px;
	}
	article div#content_wrapper section#products div.container div.downlord div a{
		font-size: 20px;
	}
	article div#content_wrapper section#products div.container div.downlord {
		margin-bottom: 0;
	}
}
/* 画面幅530px未満
=======================================*/
@media screen and (max-width:540px){
	article div#content_wrapper section#products div.container div h1{
		height:auto;
	}
	article div#content_wrapper section#products div.container div h1 b{
		display: block;
	}
	article div#content_wrapper section#products div.container div h1 b em{
		display: block;
		width: fit-content;
		margin-right: 0;
		/* background: linear-gradient(transparent 60%, #ffcccc 60%); */
		line-height: 100%;
		margin-bottom: 5px;
	}
	article div#content_wrapper section#products div.container div h1 b br{
		display: none;
	}
	article div#content_wrapper section#products div.container div h1 {
		line-height: 140%;
	}
	article div#content_wrapper section#products div.container div h1 b {
		/* padding: 10px 0; */
		padding: 18px 0 8px 0;
	}
	article div#content_wrapper section#products div.container div.downlord div a {
		line-height: 130%;
		padding: 5px 0 !important;
	}
	article div#content_wrapper section#products div.container div.downlord div a.pcview {
		display: none;
	}
	article div#content_wrapper section#products div.container div.downlord div a.spview {
		display: block;
	}
	article div#content_wrapper section#products div.container div.downlord div a.spview br {
		display: none;
	}
	article div#content_wrapper section#products div.container div.downlord p{
		text-align: left;
	}
	article div#content_wrapper section#products div.container hr {
		margin-top: 30px;
	}
	article div#content_wrapper section#products div.container div.downlord p {
		margin: 50px auto;
	}
	article div#content_wrapper section#products div.container div.downlord h2 {
		margin: 0 auto 45px auto;
	}
	article div#content_wrapper section#products div.container div div ul li figure figcaption {
		font-size: 14px;
	}

	article div#content_wrapper section#products div.container div.category1 div ul li{
		width: calc((100% - (1% * 1)) / 2);
		margin-bottom: 25px;
	}
	article div#content_wrapper section#products div.container div.category1 div ul li:nth-of-type(3n){
		margin-right: 1%;
	}
	article div#content_wrapper section#products div.container div.category1 div ul li:nth-of-type(2n){
		margin-right: 0;
	}
	article div#content_wrapper section#products div.container div.category2 div ul li{
		width: calc((100% - (1% * 1)) / 2);
		margin-bottom: 40px;
	}
	article div#content_wrapper section#products div.container div.category2 div ul li:nth-of-type(3n){
		margin-right: 1%;
	}
	article div#content_wrapper section#products div.container div.category2 div ul li:nth-of-type(2n){
		margin-right: 0;
	}
	article div#content_wrapper section#products div.container div.category3 div ul li{
		width: calc((100% - (1% * 1)) / 2);
		margin-bottom: 25px;
	}
	article div#content_wrapper section#products div.container div.category3 div ul li:nth-of-type(4n){
		margin-right: 1%;
	}
	article div#content_wrapper section#products div.container div.category3 div ul li:nth-of-type(2n){
		margin-right: 0;
	}
	article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(1) li{
		width: calc((100% - (1% * 2)) / 3);
		margin-bottom: 15px;
	}
	article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(1) li:nth-of-type(5n){
		margin-right: 1%;
	}
	article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(1) li:nth-of-type(3n){
		margin-right: 0;
	}
	article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(2) li{
		width: calc((100% - (1% * 1)) / 2);
		margin-bottom: 0;
	}
	article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(2) li:nth-of-type(4n){
		margin-right: 1%;
	}
	article div#content_wrapper section#products div.container div.category4 div ul:nth-of-type(2) li:nth-of-type(2n){
		margin-right: 0;
	}
	article div#content_wrapper section#products div.container div.downlord div ul li{
		width: calc((100% - (1% * 1)) / 2);
		margin-bottom: 0;
	}
	article div#content_wrapper section#products div.container div.downlord div ul li:nth-of-type(4n){
		margin-right: 1%;
	}
	article div#content_wrapper section#products div.container div.downlord div ul li:nth-of-type(2n){
		margin-right: 0;
	}
  article div#content_wrapper section#products div.container div.downlord div a.spview br{
		display: block;
	}
}
/* 画面幅430px未満
=======================================*/
@media screen and (max-width:430px){
	article div#content_wrapper section#products div.container div.downlord h2 br{
		display:block;
	}
	article div#content_wrapper section#products div.container div h1{
		font-size:20px;
	}
	article div#content_wrapper section#products div.container div h1 b em{
		font-size:22px;
	}
	article div#content_wrapper section#products div.container div.downlord h2{
		font-size: 24px;
	}
	article div#content_wrapper section#products div.container div.downlord div a.spview {
		border-radius: 50px 50px;
	}
	article div#content_wrapper section#products div.container div h1 span {
		margin-right: 3%;
	}
	article div#content_wrapper section#products div.container div div ul li figure figcaption {
		font-size: 13px;
	}
}

.mkreg{
  font-size: 70%;
  display: inline-block;
  margin-left: 3px;
  margin-right: 3px;
}