@charset "utf-8";


.buyhead:before {
	content: "";
	display: block;
	background-position: center center;
	background-size: cover;
}

.buyhead.camp:before {
	background-image: url(../images/img_kv_camp.jpg);
}

.buyhead.climbing:before {
	background-image: url(../images/img_kv_climbing.jpg);
}

.buyhead.fishing:before {
	background-image: url(../images/img_kv_fishing.jpg);
}

.buyhead-wrap {
	text-align: center;
	color: rgba(255, 255, 255, 1);
}

.camp .buyhead-wrap {
	background-color: rgba(47, 30, 24, 1);
}

.climbing .buyhead-wrap {
	background-color: rgba(37, 84, 10, 1);
}

.fishing .buyhead-wrap {
	background-color: rgba(81, 101, 117, 1);
}

.buyhead-title-sub {
	max-width: 350px;
	height: 60px;
	margin: 0 auto;
	display: -webkit-flex;
	display: flex;
	border-top: 1px solid rgba(255, 255, 255, .3);
	border-bottom: 1px solid rgba(255, 255, 255, .3);
	box-sizing: border-box;
	-webkit-justify-content: center;
			justify-content: center;
	-webkit-align-items: center;
			align-items: center;
}

.buyhead-title .eng {
	margin-bottom: 20px;
	display: block;
	line-height: 1;
	text-align: center;
	text-transform: uppercase;
	word-break: break-word;
	letter-spacing: -.01em;
}

.buyhead-catch {
	padding: 0 5vw;
	line-height: 1.6;
}

.buyhead-tex {
	max-width: 100%;
	padding: 0 5vw;
	box-sizing: border-box;
}


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

	.buyhead:before {
		width: 100%;
		height: calc(200px + 40vw);
		min-height: 360px;
	}

	.buyhead-wrap {
		padding: 10vw 5vw;
	}

	.buyhead-title {
		margin: 0 auto;
		display: table;
	}

	.buyhead-title-sub {
		font-size: 1.8rem;
	}

	.buyhead-title-sub span {
		font-size: 2.5rem;
	}

	.buyhead-catch {
		margin: 20px 0;
		font-size: 2rem;
	}

}


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

	.buyhead-title .eng {
		font-size: 5rem;
	}

	.buyhead-catch br {
		display: none;
	}

}


@media screen and ( min-width: 1001px ) {

	.buyhead-title .eng {
		font-size: 8rem;
	}

}


@media screen and ( min-width: 851px ) {

	.buyhead {
		width: 100%;
		height: calc(400px + 20vw);
		max-height: 740px;
		display: -webkit-flex;
		display: flex;
	}

	.buyhead:before,
	.buyhead-wrap {
		width: 50%;
		-webkit-flex: 0 0 50%;
				flex: 0 0 50%;
	}

	.buyhead-wrap {
/* 		padding: 5vw; */
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
				flex-direction: column;
		-webkit-justify-content: center;
				justify-content: center;
		-webkit-align-items: center;
				align-items: center;
	}

	.buyhead-title-sub {
		font-size: 1.8rem;
	}

	.buyhead-title-sub span {
		font-size: 2.5rem;
	}

	.buyhead-catch {
		margin: 50px 0 20px 0;
		font-size: 2.5rem;
	}

}


@media screen and ( min-width: 601px ) and ( max-width: 1000px ) {

	.buyhead-title .eng {
		font-size: 8rem;
	}

}


/*------------------------------------*/


.category {
	padding-bottom: 0;
}

.category-item {
	background-color: rgba(232, 231, 227, 1);
	box-sizing: border-box;
}

.category-item:nth-child(2n) {
	background-color: rgba(247, 247, 244, 1);
}

.category-image {
	margin-bottom: 10px;
}

.category-caption {
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	color: rgba(0, 0, 0, 1);
}

.category-caption .eng {
	display: block;
	font-size: 1.4rem;
	line-height: 1.4;
}

.category-item-child {
	margin-bottom: 5px;
	background-color: rgba(255, 255, 255, .3);
	border-radius: 5px;
	font-size: 1.4rem;
	line-height: 1.4;
}

li:nth-child(2n) .category-item-child {
	background-color: rgba(255, 255, 255, 1);
}

.category-item-child:last-chuld {
	margin-bottom: 0;
}

.case-list {
	-webkit-flex-wrap: nowrap;
			flex-wrap: nowrap;
}

.case-list-item {
	margin-top: 0;
}

.case-list-item a {
	text-decoration: none;
}


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

	.category-item {
		padding: 20px;
		padding-left: 0;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
				justify-content: center;
		-webkit-align-items: center;
				align-items: center;
	}

	.category-caption {
		font-size: 1.8rem;
	}

	.category-item-child {
		padding: 5px 10px;
	}

	.category-image {
		width: 160px;
		-webkit-flex: 0 0 160px;
				flex: 0 0 160px;
	}

	.category-image figure {
		width: 120px;
		margin: 0 auto;
		margin-bottom: 10px;
	}

	.category-item-list {
		width: 100%;
		max-width: 400px;
	}

	.case-list {
		left: 0 !important;
	}

}


@media screen and ( min-width: 801px ) {

	.category-list {
		display: -webkit-flex;
		display: flex;
	}

	.category-item {
		padding: 40px;
		-webkit-flex: 0 0 25%;
				flex: 0 0 25%;
	}

	.category-image figure {
		width: 160px;
		margin: 0 auto;
	}

	.category-caption {
		font-size: 2rem;
	}

	.category-item-child {
		padding: 10px 20px;
	}

}


@media screen and ( min-width: 1001px ) {

	.category-item {
		width: 25%;
		max-width: 25%;
		-webkit-flex: 0 0 25%;
				flex: 0 0 25%;
	}

}


@media screen and ( min-width: 801px ) and ( max-width: 1000px ) {

	.category-list {
		-webkit-flex-wrap: wrap;
				flex-wrap: wrap;
	}

	.category-item {
		width: 50%;
		max-width: 50%;
		-webkit-flex: 0 0 50%;
				flex: 0 0 50%;
	}

	.category-item:nth-child(1),
	.category-item:nth-child(4) {
		background-color: rgba(232, 231, 227, 1);
	}

	.category-item:nth-child(2),
	.category-item:nth-child(3) {
		background-color: rgba(247, 247, 244, 1);
	}

	li:nth-child(1) .category-item-child,
	li:nth-child(4) .category-item-child {
		background-color: rgba(255, 255, 255, .3);
	}

	li:nth-child(2) .category-item-child,
	li:nth-child(3) .category-item-child {
		background-color: rgba(255, 255, 255, 1);
	}

}


/*------------------------------------*/


.feature {
	background-color: rgba(51, 46, 7, 1);
	color: rgba(255, 255, 255, 1);
}

.feature-title {
	color: rgba(255, 255, 255, 1);
}

.feature-title:before {
	background-image: url(../../common/images/img_waku_left_w.png);
}

.feature-title:after {
	background-image: url(../../common/images/img_waku_right_w.png);
}

.feature-tex {
	color: rgba(255, 255, 255, .75);
}

.point-item {
	padding-bottom: 40px;
	background-color: rgba(255, 255, 255, 1);
	border-radius: 5px;
	overflow: hidden;
}

.point-item.other {
	background-color: rgba(1, 178, 174, .2);
}

.point-image {
	position: relative;
	z-index: 0;
}

.point-icon {
	width: 60px;
	margin: 0 auto;
	margin-top: -30px;
	position: relative;
	z-index: 1;
}

.point-title,
.point-tex {
	padding: 0 20px;
}

.point-title {
	margin: 20px 0;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
}

/*
.other .point-title {
	color: rgba(1, 178, 174, 1);
}
*/

.brand {
	background-color: rgba(221, 220, 216, 1);
}

.brand-list {
	max-width: 1600px;
	margin: 0 auto;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
			flex-wrap: wrap;
}

.brand-item {
	margin-right: 20px;
	margin-top: 20px;
	display: -webkit-flex;
	display: flex;
}

.brand-item a {
	padding: 20px;
	display: -webkit-flex;
	display: flex;
	background-color: rgba(255, 255, 255, 1);
	-webkit-justify-content: center;
			justify-content: center;
	-webkit-align-items: center;
			align-items: center;
}

.brand-item a.none {
	pointer-events: none;
	cursor: default;
}

.brand-item img {
	transition: all 300ms ease;
	opacity: .2;
}

.brand-item a:hover img {
	opacity: 1;
}

.buy-tex {
	padding: 0 5vw;
	font-weight: bold;
	line-height: 2;
	text-align: center;
	color: rgba(0, 0, 0, 1);
}


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

	.buy-tex {
		padding-top: 40px;
		padding-bottom: 40px;
		font-size: 1.6rem;
	}

}


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

	.point-item {
		margin-bottom: 20px;
	}

	.brand-item {
		width: calc((100% - (10px * 2)) / 3);
	}

	.brand-item {
		margin-right: 10px;
		margin-top: 10px;
	}

	.brand-item:nth-child(3n) {
		margin-right: 0;
	}

}


@media screen and ( min-width: 601px ) {

	.point-list {
		max-width: 1600px;
		margin: 0 auto;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
				flex-wrap: wrap;
	}

}


@media screen and ( min-width: 801px ) {

	.feature .subtitle br {
		display: none;
	}

	.buy-tex {
		padding-top: 100px;
		padding-bottom: 100px;
		font-size: 1.8rem;
	}

}


@media screen and ( min-width: 1001px ) {

	.point-item {
		width: calc((100% - (20px * 3)) / 4);
	}

	.brand-item {
		width: calc((100% - (20px * 5)) / 6);
	}

	.brand-item:nth-child(6n) {
		margin-right: 0;
	}

}


@media screen and ( min-width: 601px ) and ( max-width: 1000px ) {

	.point-item {
		width: calc((100% - (20px * 1)) / 2);
		margin-bottom: 20px;
	}

	.brand-item {
		width: calc((100% - (20px * 3)) / 4);
	}

	.brand-item:nth-child(4n) {
		margin-right: 0;
	}
	
}

/* 追加分 */
.buy_intro {
	width: 100%;
	background-color: #e8e7e3;
	padding-top: 0;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
	margin-bottom: 20px;
  }
  
  .buy_intro-lead {
	text-align: center;
	padding-top: 20px;
  }
  
  .buy_intro-lead img {
	width: 100vw;
	max-width: 1350px;
  }
  
  .buy_intro-lead ._text {
	width: 100%;
	margin: 0 auto;
  }
  
  .buy_intro-lead ._text p {
	font-size: 15px;
	line-height: 2;
	padding: 20px;
	word-break: break-all;
	text-align: left;
  }
  
  .buy_intro-image h2 {
	font-size: 18px;
	font-weight: bold;
	background-color: #516575;
	color: #e8e7e3;
	width: 90%;
	margin: 20px auto 10px auto;
	padding: 5px 0;
	text-align: center;
  }
  
  .buy_intro-image-wrapper {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	-webkit-box-pack: center;
		-ms-flex-pack: center;
			justify-content: center;
  }
  
  .buy_intro-image-wrapper ._card {
	width: 47%;
	margin: 1vw;
	background-color: #f5f5f5;
	text-align: center;
	padding: 10px 0;
  }
  
  .buy_intro-image-wrapper ._card h3 {
	font-size: 14px;
	font-weight: bold;
	line-height: 1.6;
  }
  
  .buy_intro-image-wrapper ._card img {
	width: 95%;
  }
  
  .buy_intro-image-wrapper ._card p {
	font-size: 12px;
	text-align: left;
	line-height: 1.6;
	padding: 0 5px;
	word-break: break-all;
  }
  
  @media screen and (min-width: 768px) {
	.buy_intro-lead {
	  padding-top: 40px;
	}
	.buy_intro-lead img {
	  width: 88vw;
	}
	.buy_intro-lead ._text p {
	  font-size: 16px;
	  padding: 30px;
	}
	.buy_intro-image h2 {
	  font-size: 24px;
	  width: 95%;
	  margin: 40px auto 20px auto;
	  padding: 10px 0;
	}
	.buy_intro-image-wrapper ._card {
	  width: 31%;
	  margin: 0.8vw;
	  padding: 20px 0;
	}
	.buy_intro-image-wrapper ._card h3 {
	  font-size: 18px;
	}
	.buy_intro-image-wrapper ._card p {
	  font-size: 13px;
	  padding: 5px 10px 0 10px;
	}
  }
  
  @media screen and (min-width: 1001px) {
	.buy_intro-lead ._text p {
	  padding: 50px;
	}
	.buy_intro-image-wrapper ._card h3 {
	  font-size: 20px;
	}
	.buy_intro-image-wrapper ._card p {
	  font-size: 14px;
	  padding: 10px 15px 0 15px;
	}
  }
  
  @media screen and (min-width: 1400px) {
	.buy_intro-lead ._text p {
	  font-size: 18px;
	  padding: 30px;
	}
	.buy_intro-image-wrapper ._card h3 {
	  font-size: 22px;
	}
	.buy_intro-image-wrapper ._card p {
	  font-size: 16px;
	  padding: 15px 20px 0 20px;
	}
  }