@charset "utf-8";
/* CSS Document */
@media all {
	
	#firstview{
		width: 100%;
		position: relative;
	}
	#firstview .image{
		width: 100%;
	}
	#firstview .titlebox{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		color: #fff;
		text-align: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
		background-color: rgba(0,0,0,.4);
	}
	#firstview .titlebox .h2sub{
		font-size: 1.2rem;
		margin-bottom: 0.5em;
	}
	#firstview .titlebox h2{
		font-size: 3.2rem;
	}
	
	#contents{
		padding: 0 40px;
	}
	#contents .dscrptn,
	#contents article{
		width: 100%;
		max-width: 1100px;
	}
	#contents .dscrptn{
		font-size: 1.2rem;
		line-height: 1.7;
		padding: 40px 0;
		margin: 0 auto;
	}
	#contents article{
		margin: 0 auto 80px;
	}
	#contents h3{
		display: block;
		width: 100%;
		font-size: 2.5rem;
		padding-bottom: 10px;
		border-bottom: solid 1px #ccc;
		margin-bottom: 40px;
	}
	#contents #manufacturers #itemjfda{
		padding-bottom: 40px;
		text-align: center;
	}
	#contents #manufacturers #itemjfda h4{
		font-size: 2rem;
		margin-bottom: 1em;
	}
	#contents #manufacturers #itemjfda .maincopy{
		font-size: 1.2rem;
		margin-bottom: 1em;
	}
	#contents #manufacturers #itemjfda a.jfdalink{
		display: block;
		width: fit-content;
		margin: 0 auto;
		font-size: 1.2rem;
		padding: 0.5em 2em;
		background: #EB3E38;
		color: #fff;
	}
	#contents #manufacturers ul.list,
	#contents #main-products ul.list{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		border: solid #ccc;
		border-width: 1px 0 0 1px;
	}
	#contents #manufacturers ul.list li{
		width: calc(100% / 3);
		border: solid #ccc;
		border-width: 0 1px 1px 0;
	}
	#contents #manufacturers ul.list li a{
		display: block;
		width: 100%;
		font-size: 1.2rem;
		padding: 1.5em;
		text-align: center;
	}
	#contents #manufacturers ul.list li a:hover{
		background: #eee;
	}
	#contents #main-products ul.list > li{
		width: calc(100% / 4);
		border: solid #ccc;
		border-width: 0 1px 1px 0;
		font-size: 1rem;
		padding: 1.5em;
		text-align: center;
	}
	#contents #main-products ul.list li .image{
		width: 100%;
	}
	#contents #main-products ul.list li h4{
		display: block;
		font-size: 1.2rem;
		padding: 1em 0 0.5em;
		border-bottom: solid 1px #ccc;
		margin-bottom: 1em;
	}
	#contents #main-products ul.list li .item{
		width: 100%;
	}
	#contents #main-products ul.list li .item li{
		width: 100%;
		padding-bottom: 0.5em;
	}
	
}

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

	#firstview .titlebox .h2sub{
		font-size: 1.1rem;
		margin-bottom: 0.3em;
	}
	#firstview .titlebox h2{
		font-size: 2.5rem;
	}
	
	#contents{
		padding: 0 20px;
	}
	#contents article{
		margin: 0 auto 60px;
	}
	#contents h3{
		font-size: 2rem;
		margin-bottom: 20px;
	}
	#contents #manufacturers #itemjfda h4{
		font-size: 1.7rem;
		margin-bottom: 0.5em;
	}
	#contents #manufacturers #itemjfda .maincopy{
		text-align: justify;
	}
	#contents #manufacturers ul.list li{
		width: 100%;
	}
	#contents #main-products ul.list > li{
		width: calc(100% / 2);
		padding: 1em;
	}
	#contents #main-products ul.list > li .item span{
		display: inline-block;
	}
	
}

@media screen and (min-width: 769px) and (max-width: 1024px){

	#contents #main-products ul.list > li{
		font-size: 0.8rem;
	}
	
}

@media screen and (min-width: 1025px), print{

}