@charset "utf-8";


.bs-pagination { margin: 24px 0; padding: 0 16px; display: flex; justify-content: space-around; }
.bs-pagination span span { margin: 0 8px; display: inline-block; }
.bs-pagination span span.current { padding: 4px 8px; }
.bs-pagination a { padding: 4px 8px; background: #328049; color: #fff; }


/* --------------------------------------------------
	メインタイトル
-------------------------------------------------- */

#mainTitle { margin: 4px 0 10px; width: 100%; background: linear-gradient(105deg, #007535 0%, #007535 50%, #328049 50%, #328049 100%); color: #fff; }
#mainTitle .inner { margin: 0 auto; padding: 30px 0; width: 1200px; display: flex; align-items: center; }
#mainTitle .inner::after { content: attr(data-text); padding-left: 50px; width: 50%; text-align: left;  }
#mainTitle .inner h1 { padding-right: 50px; width: 50%; font-size: 4rem; text-align: right; }

@media screen and (max-width: 1024px) {
#mainTitle .inner { padding: 30px 20px; width: 100%; text-align: center; display: block; }
#mainTitle .inner h1 { font-size: 3.2rem; }
#mainTitle .inner::after, #mainTitle .inner h1 { padding: 0; width: 100%; text-align: center; }
}

@media screen and (max-width: 767px) {
#mainTitle .inner h1 { font-size: 2.8rem; }
}


/* --------------------------------------------------
	メールフォーム
-------------------------------------------------- */
.bs-mail-form {}
.bs-mail-form-body { margin-top: 20px; width: 100%; border-top: solid 1px #bebebe; }
.bs-mail-form-body tr {}
.bs-mail-form-body th { padding: 40px 35px; width: 385px; background: #e7e7e7; border-bottom: solid 1px #bebebe; }
.bs-mail-form-body th .required { background: #2d9939; color: #fff; }
.bs-mail-form-body td { padding: 15px 35px; border-bottom: solid 1px #bebebe; }
.bs-mail-form-body input[type="text"], .bs-mail-form-body input[type="email"], .bs-mail-form-body input[type="tel"], .bs-mail-form-body textarea { margin: 10px 0; padding: 8px 16px; border: solid 1px #c0c0c0; border-radius: 6px; display: block; }
.bs-mail-form-body select { margin: 10px 0; display: block; }

@media screen and (max-width: 1024px) {
.bs-mail-form-body tr { display: block; }
.bs-mail-form-body th, .bs-mail-form-body td { width: 100%; display: block; }
.bs-mail-form-body th { padding: 10px 20px; }
.bs-mail-form-body td { padding: 10px 20px; }
}

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



/* --------------------------------------------------
	ページ
-------------------------------------------------- */

#page { margin: 0 auto; padding: 0 50px 100px; width: 1200px; text-align: left; }
#page section { margin: 0 0 100px; }
#page section:nth-of-type(n+2) { margin-top: 100px; }
#page .title { margin-bottom: 140px; text-align: center; }
#page .title h2 { padding: 15px 80px 0; color: #296f45; font-size: 3.2rem; display: inline-block; position: relative; }
#page .title h2::before, #page .title h2::after { content: ''; width: 1px; height: 88px; background: #276E45; position: absolute; top: 0; transform: skew(-15deg); }
#page .title h2::before { left: 0; }
#page .title h2::after { right: 0; }
#page h3{
	font-size:2.4rem;
	border-left: 5px solid #296f45;
    padding-left: 16px;
    margin-bottom: 40px;
}
#page h3 span{
	font-size:2rem;
	display:inline-block;
	margin-left:1em;
	font-weight:normal;
}
#page p { margin: 1.6rem 0; }
#page ul, #page ol { margin: 1.6rem 0 1.6rem 2.4rem; }
#page ul ul, #page ol ol { margin: 0; counter-reset: number; }
#page ol ol { padding-left: 2em; list-style: none; position: relative; }
#page ol ol li:before { counter-increment: number; content: '(' counter(number) ')'; position: absolute; left: 0; }
#page li { list-style: unset; }

#page dl dt{ font-weight:bold; }
@media screen and (max-width: 1024px) {
#page { padding: 0 20px 40px; width: 100%; }
#page section:nth-of-type(n+2) { margin-top: 60px; }
#page .title { margin-bottom: 60px; }
#page .title h2 { padding: 0 60px 0; font-size: 2.8rem; }
#page .title h2::before, #page .title h2::after { height: 60px; }
}

@media screen and (max-width: 767px) {
#page { padding: 0 15px 30px; }
#page section:nth-of-type(n+2) { margin-top: 40px; }
#page .title { margin-bottom: 40px; }
#page .title h2 { padding: 0 40px 0; font-size: 2.4rem; }
#page .title h2::before, #page .title h2::after { height: 40px; }
}


/* --------------------------------------------------
	商品詳細　共通部分
-------------------------------------------------- */

#items main {margin-bottom:100px;}
#items div.button {width:1000px; margin:100px  auto; font-size:3.0rem; text-align:center;}
#items div.button a {width:100%; color: #fff; display:inline-block; background:#34a649; padding:15px 0; position:relative;}
#items div.button a:after {content:""; width:12px; height:12px; border-top:3px solid #fff; border-right:3px solid #fff; transform:rotate(45deg); position:absolute; top:50%; margin:-6px; right:40px;}
#items div.button a:hover {text-decoration:none; opacity: 0.8; transition: all 0.3s ease;}

@media screen and (max-width: 1024px) {
#items div.button { margin: 80px 0; width: 100%; font-size: 2.4rem; }
#items div.button a { padding: 12px 0; }
}

@media screen and (max-width: 767px) {
#items div.button { margin: 60px 0; font-size: 2rem; }
#items div.button a { padding: 10px 0; }
}

/* --------------------------------------------------
	商品詳細
-------------------------------------------------- */
#items {width:1200px; margin:0 auto;}
#items dl {display:flex; justify-content:flex-start;}
#items dl dt { 
    width: 600px;
    flex-shrink: 0;
    height: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#items dl dd strong {font-size:2.0rem; font-weight:normal; display:block; background:#E4E4E4; padding:10px 20px;}
#items span {font-size:1.6rem; font-weight:normal; display:block; margin-bottom:-15px;}
#items h2 {font-size:3.6rem;margin-bottom:40px;}
#items dl dd { padding-left:16px }
#items dl dd ul {display:flex; justify-content:space-between; flex-wrap:wrap;}
#items dl dd ul li {
    border: 1px solid #EEE;
    width: 48%;
    margin: 1%;
    display: flex;
    justify-content: center;
    align-items: center;
}
#items dl dd ul li img {width:290px;}
#items table {width:100%; border-collapse:collapse; margin: 80px 0 20px;}
#items tr {border-top:1px solid #d2d2d2;}
#items tr:last-child {border-bottom:1px solid #d2d2d2;}
#items th {font-weight:normal; text-align:left; background:#f1f9f2; padding:10px 20px;}
#items td {text-align:center; padding:10px 20px;}

#item .item-list {
	margin:32px 0;
}
#item .item-list li{
	padding: 0 16px 0 20px;
	margin-bottom:40px;
	box-sizing: border-box;
    width: 50%;
    text-align: left;
	position: relative;
	list-style: none;
}
#item .item-list li::before {
    content:"";
    width:8px;
    height:8px;
    border-top:2px solid #328049;
    border-right:2px solid #328049;
    position:absolute;
    transform:rotate(45deg);
    top:10px;
    left:0;
}
#item .item-list li .img{
	display:block;
}
#item .item-list li .img img{
	object-fit: contain;
	width: 224px;
	height: 224px;
}

#item .item-list li a{
	color:#000;
}
#item h3.midashi{
	text-align:left;
	background:linear-gradient(#007535, #328049);
	padding:8px;
	color:#FFF;
	margin: 16px 0;
	cursor: pointer;
	position:relative;
}
#item h3.midashi:after{
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    border-bottom: 3px solid #FFF;
    border-right: 3px solid #FFF;
    transform: rotate(45deg);
    position: absolute;
    right: 20px;
    top: 12px;
}
#item h3.midashi.active:after{
    transform: rotate(225deg);
    top: 20px;
}
#item .bs-pagination__number.current{
	border:1px solid #ddd;
}
#item .item_flex{
	display:flex;
	align-items:center;
	margin-bottom:20px;
}
#item .item_flex p{
	margin-left:20px;
}
@media screen and (max-width: 1024px) {
#items { padding: 0 20px; width: 100%; }
#items h2 { font-size: 3.2rem; }
#items dl { display: block; }
#items dl dt { width: 100%; height: auto; text-align: center; }
#items table { margin: 60px 0 20px; }
}

@media screen and (max-width: 767px) {
#items { padding: 0 10px; }
#items h2 { font-size: 2.4rem; }
#items table { margin: 40px 0 15px; }
#item th { width: 100%; border-bottom: solid 1px #d2d2d2; display: block; }
#item td { width: 100%; display: block; }

#item .item_flex p{ text-align:center; margin-right:10px;}
#item 
	#item .item-list {
		padding:0 8px;
    }
    #item .item-list li {
        width: 100%; 
    }
	#item .bs-pagination .bs-pagination__number a{
		display: inline-block;
	}
	#item .bs-pagination__number.current{
		display: inline-block;
		border:1px solid #DDD;
	    color: #DDD;
		background:#FFF;
	}
	#item .bs-pagination__prev.disabled, .bs-pagination__next.disabled{
		padding:4px 8px;
	}
	#item .bs-pagination span span {
		margin:0 4px;
	}
	#item .bs-pagination__next.disabled{
		border:1px solid #DDD;
	}
}

/* 関連企業 */
#kanren dl{
	margin-bottom:32px;
	padding-left:1em;
	border-bottom:dotted 1px #333;
}
#kanren dl dt{
	font-size: 2rem;
    display: inline-block;
    margin-bottom: 16px;
    background: #296f45;
    color: #FFF;
    padding: 8px 16px;
}

#kanren dl dd{
	margin-left:1em;
}