@charset "utf-8";

/********************************************************
	
	flex-grid:| sm  | md  | lg  |  xl  |
	min-width:| 576 | 768 | 992 | 1200 |
	max-width:| 575 | 767 | 991 | 1199 |

********************************************************/
/* ======================================================

	事業内容

====================================================== */
.blk-out1 .c-row{ margin-right: -20px; margin-left: -20px; }
.blk-out1 .c-row > [class*="c-col-"] { padding-right: 20px; padding-left: 20px; }

.blk-out1{}
.blk-out1 .c-page-ttl-sub,
.blk-out1__text,
.blk-out1__fig{
	text-align: center;
}
.blk-out1__text{
	font-size: 1.8rem;
}
.blk-out1 img{
	max-width: 550px;
	width: 100%;
}
.blk-out1__link{
	display: block;
	padding: 10px 40px 10px 40px;
	max-width: 330px;
	margin: 0 auto;
	border: 1px solid #b3b3b3;

	font-size: 2.4rem;
	text-align: center;
}
.blk-out1__link.c-arr-btn:before{
	color: #000000;
}

.item{
	margin-bottom: 40px;
	background-color: #f4f4f4;
}
.item__title{
	position: relative;
	display: flex;
	align-items: center;
	height: 130px;
	padding: 0 0 0 40px;
	z-index: 10;

	font-size: 2.4rem;
	/*font-weight: bold;*/
	line-height: 1.3;
	color: #ffffff;
}
.bg-color--1{ background-color: #51ac9d; }
.bg-color--2{ background-color: #db9567; }
.bg-color--3{ background-color: #7c6fa5; }
.bg-color--4{ background-color: #e69a96; }

.item__title span{
	position: relative;
	z-index: 1;
}
.item__title img{
	position: absolute;
	right: 0;
	width: 205px;
	z-index: 1;
}
.item__desc{
	padding: 20px 40px;
	font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
	.blk-out1 .c-page-ttl-sub{
		text-align: left;
	}
	.blk-out1__text{
		font-size: 1.4rem;
		text-align: left;
	}
	.blk-out1__link{
		font-size: 1.8rem;
	}
	.item{
		margin-bottom: 10px;
		background-color: #ffffff;
	}
	.item__title{
		padding: 0 0 0 10px;
	}
	.item__desc{
		padding: 10px 0;
	}
}
/* ======================================================

	取り扱い品目

====================================================== */
.blk-out2__title{
	margin-bottom: .5em;

	font-size: 1.8rem;
	font-weight: bold; 
}
.item2{
	margin-bottom: 10px;
}
.item2__title{
	padding: 1px 20px;
	color: #ffffff;
	font-size: 1.8rem;
}
.item2__inner{
	background-color: #f4f4f4;
	padding: 20px 40px 20px;
}
.item2 dl{
	display: flex;
	flex-wrap: wrap;

	font-size: 1.4rem;
}
.item2 dl:not(:last-child){
	border-bottom: 1px solid #999999;
}
.item2 dt{
	padding: 10px;
	width: 30%;
	font-weight: bold;
}
.item2 dd{
	padding: 10px;
	width: 70%;
}
@media screen and (max-width: 767px) {
	.blk-out2__title{
		font-size: 1.6rem;
	}
	.item2__inner{
		padding: 0 10px 0;
	}
	.item2 dt{
		padding: 10px 0;
		width: 100%;
	}
	.item2 dd{
		padding: 0 0 10px;
		width: 100%;
	}
}
/* ======================================================

	主要納品先

====================================================== */
.blk-out3__title{
	margin-bottom: .5em;

	font-size: 1.8rem;
	font-weight: bold; 
}
.list{
	margin-bottom: 10px;
}
.list__btn{
	position: relative;
	padding: 13px 40px 13px 20px;
	background-color: #81be25;
	cursor: pointer;
	transition: opacity 300ms;

	font-size: 2.4rem;
	font-weight: bold;
	color: #ffffff;
}
.list__btn--dealer{
	background-color: #ef9d26;
}
.list__btn:hover{
	opacity: 0.7;
}
.list__btn::before {
	position: absolute;
	display: block;
	content: '\e900';
	font-size: 3.0rem;
	font-weight: bold;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	color: #ffffff;
}
.list__btn.is-open::before{
	content: '\e903';
}
.list__body{
	display: none;
	padding: 20px 40px;
	background-color: #f4f4f4;
}
@media screen and (max-width: 767px) {
	.blk-out3__title{
		font-size: 1.6rem;
	}
	.list__btn{
		padding: 13px 30px 13px 10px;
		font-size: 1.6rem;
	}
	.list__body{
		padding: 10px 10px;
	}
}
/* ======================================================

	加入団体 / 輸入元

====================================================== */
.blk-out4,
.blk-out5{
	display: flex;
}
.blk-out4-bnr-img,
.blk-out5-bnr-img{
	max-width: 590px;
}
.blk-out4-bnr-img--300{
	max-width: 300px;
}
.blk-out4__title,
.blk-out5__title{
	flex: 0 0 8em;
	margin-bottom: .5em;

	font-size: 1.8rem;
	font-weight: bold; 
}
.blk-out4__list li,
.blk-out5__list li{
	margin-bottom: 2em;
}
.blk-out5__list li{
	border-bottom: 1px solid #000000;
}
.blk-out5__list li a:last-child{
	display: inline-block;
	margin-bottom: 10px;
}
.blk-out5__list li a::after{
	content: attr(href);
	margin-left: 1em;
}
@media screen and (max-width: 767px) {
	.blk-out4,
	.blk-out5{
		display: block;
	}
	.blk-out4__title,
	.blk-out5__title{
		font-size: 1.6rem;
	}
	.blk-out5__list li a{
		font-size: 1.0rem;
	}
	.blk-out5__list li a::after{
		font-size: 1.0rem;
	}

	.blk-out4-bnr-img,
	.blk-out5-bnr-img{
		max-width: 100%;
	}

	.blk-out4__list img{
		width:100%;
	}

	.blk-out4__list li:nth-child(3){
		width:60%;
	}
}