@charset "utf-8";

@media screen and (max-width: 1119px) {
	.wrap_offcanvas {
		padding-bottom: 0;
	}
}

.wrp-container {
	max-width: none;
	padding: 0;
	overflow: hidden;
}

@media screen and (max-width: 787px) {
	.wrp-container{
		padding: 0;
	}
}

/* 背景 */

.l-content {
	padding-bottom: 220px;
	overflow: hidden;
	background-color: #b3c9bc;
	background-image:
		url(../images/parts-bg-frame-edge-b-pc.png),
		url(../images/parts-bg.png);
	background-repeat:
		no-repeat,
		repeat;
	background-position:
		center bottom,
		center top;
	background-size:
		1120px auto,
		40px auto;
}

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

@media screen and (max-width: 767px) {
	.l-content {
		padding-bottom: 30vw;
		background-image:
			url(../images/parts-bg-frame-edge-l.png),
			url(../images/parts-bg-frame-edge-r.png),
			url(../images/parts-bg-frame-edge-b-sp.png),
			url(../images/parts-bg.png);
		background-repeat:
			no-repeat,
			no-repeat,
			no-repeat,
			repeat;
		background-position:
			left -22vw top 20px,
			right -22vw top 20px,
			center bottom,
			center top;
		background-size:
			45vw auto,
			45vw auto,
			100vw auto,
			40px auto;
	}
}

/* タイトル */

.top {
	max-width: 1120px;
	margin: 0 auto;
	position: relative;
	background-image:
		url(../images/parts-kv.png),
		url(../images/parts-bg-pattern.png);
	background-repeat:
		no-repeat,
		repeat-x;
	background-position:
		right top -50px,
		center top;
	background-size:
		500px 100%,
		auto;
}
@media screen and (max-width: 767px) {
	.top {
		max-width: none;
		background-position:
			right -2vw top -15px,
			center top;
		background-size:
			67vw auto,
			contain;
	}
}

.kv {
	position: relative;
	margin: 0 -40px;
	padding-top: 80px;
	text-align: center;
	/* filter: drop-shadow(0 6px 2px #9ebaaa); */
}

.kv__text {
	display: none;
}

.kv__pict {
	position: relative;
}

.kv__pict__img {
	width: 100%;
	height: auto;
}

.kv__pict--pc {
	display: block;
}

.kv__pict--sp {
	display: none;
}

@media screen and (max-width: 767px) {
	.kv {
		margin: 0;
		padding-top: 13vw;
	}

	.kv__pict--pc {
		display: none;
	}

	.kv__pict--sp {
		display: block;
		position: relative;
		width: 100%;
	}
}

.lead {
	position: relative;
	margin: -70px -40px 0;
	text-align: center;
	/* filter: drop-shadow(0 6px 2px #9ebaaa); */
}

.lead__text {
	display: none;
}

.lead__pict {
	position: relative;
}

.lead__pict__img {
	width: 100%;
	height: auto;
}

.lead__pict--pc {
	display: block;
}

.lead__pict--sp {
	display: none;
}

@media screen and (max-width: 767px) {
	.lead {
		margin: 10vw 0 0;
	}

	.lead__pict--pc {
		display: none;
	}

	.lead__pict--sp {
		display: block;
		position: relative;
		width: 100%;
	}
}

/* カテゴリナビゲーション */

.nav {
	max-width: 1120px;
	margin: 0 auto;
}

@media screen and (max-width: 767px) {
	.nav {
		max-width: none;
		margin: 0;
	}
}

.slick-track {
	margin: 0 auto;
}

@media screen and (max-width: 767px) {
	.slick-track {
		margin: 0;
	}
}

.nav--top {
	max-width: 1120px;
	width: 100%;
	margin: 40px auto 0;
	overflow: hidden;
}

@media screen and (max-width: 767px) {
	.nav--top {
		width: 100vw;
		margin: 2.2vw 0 0;
	}
}

.nav--top .nav__item {
	position: relative;
	width: 20%;
	padding: 0 7px 25px;
	text-align: center;
	box-sizing: border-box;
}

@media screen and (max-width: 767px) {
	.nav--top .nav__item {
		width: 25%;
		padding: 0 0 26px;
	}
}

.nav--top .nav__item > a {
	display: block;
}

.nav--top .nav__item-photo {
	position: relative;
	z-index: 0;
}

@media screen and (max-width: 767px) {
	.nav--top .nav__item-photo {
		padding: 5px 0;
	}
}

.nav--top .nav__item-photo::before {
	content: "";
	position: absolute;
	z-index: 0;
	left: 2px;
	top: 40px;
	width: calc(100% - 4px);
	height: calc(100% - 80px);
	box-sizing: border-box;
	border-radius: 10px;
	background: #f1eded;
}

@media screen and (max-width: 767px) {
	.nav--top .nav__item-photo::before {
		left: 1vw;
		top: 40px;
		width: calc(100% - 2vw);
		height: calc(100% - 80px);
		border-radius: 10px;
	}
}

.nav--top .nav__item-photo img {
	position: relative;
	z-index: 0;
	width: 100%;
	height: auto;
	margin: auto;
	filter: drop-shadow(0 12px 10px #9ebaaa);
}

.nav--top .nav__item-text {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 50px;
	margin-top: -10px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}

.nav--top .nav__item-text span {
	display: none;
}

.nav--top .nav__item--category01 .nav__item-text {
	background-image: url(../images/parts-topnav-item-01.png);
}

.nav--top .nav__item--category02 .nav__item-text {
	background-image: url(../images/parts-topnav-item-02.png);
}

.nav--top .nav__item--category03 .nav__item-text {
	background-image: url(../images/parts-topnav-item-03.png);
}

.nav--top .nav__item--category04 .nav__item-text {
	background-image: url(../images/parts-topnav-item-04.png);
}

.nav--top .nav__item--category05 .nav__item-text {
	background-image: url(../images/parts-topnav-item-05.png);
}

@media screen and (max-width: 767px) {
	.nav--top .nav__item-text {
		margin-top: -20px;
	}
}

.nav--bottom {
	display: none;
}

@media screen and (max-width: 767px) {
	.nav--bottom {
		display: flex;
		position: fixed;
		z-index: 2;
		bottom: 60px;
		left: 0;
		width: 100%;
		margin: 0;
		background: #fff;
		transition: bottom .3s;
	}

	.nav--bottom::before {
		content: "";
		position: absolute;
		top: -1px;
		left: 0;
		width: 100%;
		height: 1px;
		background-color: rgba(80, 80, 80, .1);
	}

	.header_nav_sp {/* ローカルメニューの回避のため */
		z-index: 3 !important;
	}

	.nav--bottom.standby {
		bottom: -9vw;
	}

	.nav--bottom .nav__item {
		width: 20%;
		margin: 0;
		background-color: transparent;
	}

	.nav--bottom .nav__item > a {
		display: block;
		width: 100%;
	}

	.nav--bottom .nav__item > a > img {
		display: block;
		width: 100%;
		height: auto;
	}
}

/* banzai */

.wrp-banzai {
	position: absolute;
	top: 100px;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 1;
}

@media screen and (max-width: 767px) {
	.wrp-banzai {
		top: 90px;
	}
}

.wrp-banzai .txt-banzai {
	color: #a9a9a9;
	transition: color .5s;
}

body.is-goods .wrp-banzai .txt-banzai {
	color: #a9a9a9;
}

body.is-menu .wrp-banzai .txt-banzai {
	color: #f04a6a;
}

.wrp-banzai .txt-banzai::before,
.wrp-banzai .txt-banzai::after {
	background: #a9a9a9;
	transition: background .5s;
}

body.is-goods .wrp-banzai .txt-banzai::before,
body.is-goods .wrp-banzai .txt-banzai::after {
	background: #a9a9a9;
}

body.is-menu .wrp-banzai .txt-banzai::before,
body.is-menu .wrp-banzai .txt-banzai::after {
	background: #f04a6a;
}

/* カテゴリ領域 */

.section {
	max-width: 1120px;
	margin: 0 auto;
	padding-top: 60px;
	background: transparent;
}

@media screen and (max-width: 767px) {
	.section {
		padding: 13vw 5vw 0;
	}
}

.section + .section {
	/* margin-top: 40px; */
}

.section__title {
	display: none;
}

/* box-menu */

.box-menu {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0;
}

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

.box-menu__content {
	position: relative;
	z-index: 1;
}

.box-menu__list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	margin: 0;
	padding-top: 220px;
}

#category01 .box-menu__list {
	justify-content: flex-start;
}

#category02 .box-menu__list {
	justify-content: center;
}

#category03 .box-menu__list {
	justify-content: center;
	padding-top: 140px;
}

#category04 .box-menu__list {
	justify-content: flex-start;
}

#category05 .box-menu__list {
	justify-content: flex-start;
}

@media screen and (max-width: 767px) {
	#category01 .box-menu__list,
	#category02 .box-menu__list,
	#category03 .box-menu__list,
	#category04 .box-menu__list,
	#category05 .box-menu__list {
		justify-content: flex-start;
	}
}

.box-menu__list::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	max-width: 585px;
	height: 185px;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: auto;
	/* filter: drop-shadow(0 6px 2px #9ebaaa); */
}

.section--category01 .box-menu__list::before {
	background-image: url(../images/parts-list-title-01-pc.png);
}

.section--category02 .box-menu__list::before {
	background-image: url(../images/parts-list-title-02-pc.png);
}

.section--category03 .box-menu__list::before {
	background-image: url(../images/parts-list-title-03-pc.png);
}

.section--category04 .box-menu__list::before {
	background-image: url(../images/parts-list-title-04-pc.png);
}

.section--category05 .box-menu__list::before {
	background-image: url(../images/parts-list-title-05-pc.png);
}

@media screen and (max-width: 767px) {
	.box-menu__list {
		padding: 40vw 0 0;
	}

	#category03 .box-menu__list {
		padding-top: 27vw;
	}

	.box-menu__list::before {
		left: 0;
		right: 0;
		top: 0;
		max-width: none;
		width: 100vw;
		height: 0;
		margin: 0 -5vw;
		padding-top: 30.5vw;
		background-position: center top;
		background-size: cover;
	}
	
	.section--category01 .box-menu__list::before {
		background-image: url(../images/parts-list-title-01-sp.png);
	}
	
	.section--category02 .box-menu__list::before {
		background-image: url(../images/parts-list-title-02-sp.png);
	}

	.section--category03 .box-menu__list::before {
		background-image: url(../images/parts-list-title-03-sp.png);
	}

	.section--category04 .box-menu__list::before {
		background-image: url(../images/parts-list-title-04-sp.png);
	}

	.section--category05 .box-menu__list::before {
		background-image: url(../images/parts-list-title-05-sp.png);
	}
}

.box-menu__list li {
	margin-top: 15px !important;
	margin-bottom: 15px !important;
	padding: 0 7px !important;
}

@media screen and (max-width: 767px) {
	.box-menu__list li {
		margin-top: 4vw !important;
		margin-bottom: 0 !important;
		padding: 0 2vw !important;
	}
}

.box-menu__list li > div {
	position: relative;
	padding-bottom: 60px;
	border-radius: 500px 500px 0 0;
	background: #fff;
	overflow: hidden;
}

@media screen and (max-width: 767px) {
	.box-menu__list li > div {
		padding-bottom: 40px;
	}
}

.box-menu__list li > div[data-mfp-src] {
	cursor: pointer;
}

.box-menu__list li.grid-col--4.grid-colSp--6,
.box-menu__list li.grid-col--3.grid-colSp--6 {
		margin-bottom: 0;
		padding: 0;
		background: transparent;
}

@media screen and (min-width: 768px) {
	.box-menu__list li.grid-col--4.grid-colSp--6,
	.box-menu__list li.grid-col--3.grid-colSp--6 {
			margin-bottom: 0;
			padding: 0;
			background: transparent;
	}
}

.box-article {
	position: static;
	text-align: center;
}

.box-article:after {
	background-image: none;
	box-shadow: none;
}

@media screen and (max-width: 550px) {
	.box-article:after{
		background-image: none;
		box-shadow: none;
	}
}

.lst-img img {
	-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 88%, rgba(0, 0, 0, .25) 94%, rgba(0, 0, 0, .1) 97%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 88%, rgba(0, 0, 0, .25) 94%, rgba(0, 0, 0, .1) 97%, rgba(0, 0, 0, 0) 100%);
}

.box-article__icon {
	display: block;
	position: absolute;
	width: auto;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 0 4px 12px;
	font-size: 15px;
	font-weight: bold;
	line-height: 1.4;
	color: #42291f;
}

@media screen and (max-width: 787px) {
	.box-article__icon {
		padding: 6px 4px;
		border-radius: 19px;
		font-size: 12px;
	}
}

.box-article__icon:before {
	color: #42291f;
}

/* モーダル内ラッピング */
.title--wrapping {
	display: inline-block;
	margin-top: 25px !important;
	margin-bottom: 15px !important;
	padding: 6px 12px;
	border: 1px solid #42291f;
	border-radius: 500px;
	font-size: 16px !important;
	font-weight: bold;
	line-height: 1;
	color: #42291f;
}

@media screen and (max-width: 767px) {
	.title--wrapping {
		margin-top: 5px !important;
		margin-bottom: 10px !important;
		font-size: 15px !important;
	}
}

.category + .title--wrapping {
	margin-top: 10px !important;
}

@media screen and (max-width: 767px) {
	.category + .title--wrapping {
		margin-top: 5px !important;
	}
}

/* hover効果 */

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

	.nav--top .nav__item > a {
		transition: filter .5s, opacity .5s;
	}

	.nav--top .nav__item > a:hover {
		filter: brightness(1.1);
		opacity: 1;
		transition: filter .1s, opacity .1s;
	}

	.box-menu__list li [data-mfp-src]:hover {
		opacity: 1;
		
	}

	.box-menu__list li [data-mfp-src] img {
		transition: filter .5s, opacity .5s;
	}

	.box-menu__list li [data-mfp-src]:hover img {
		filter: brightness(1.1);
		opacity: 1;
		transition: filter .1s, opacity .1s;
	}

	.box-menu__list li [data-mfp-src] .box-article__icon {
		transition: color .5s;
	}

	.box-menu__list li [data-mfp-src]:hover .box-article__icon {
		color: #639d80;
		transition: color .1s;
	}

	.box-menu__list li [data-mfp-src] .box-article__icon::before {
		transition: color .5s;
	}

	.box-menu__list li [data-mfp-src]:hover .box-article__icon::before {
		color: #639d80;
		transition: color .1s;
	}
}

/* モーダル背景 */

.mfp-bg {
	background-color: rgba(172, 200, 186, .9);
}

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

@media screen and (max-width: 787px){
	.mfp-bg {
	}
}

.mfp-bg.mfp-fade-in {
	opacity: 0 !important;
	transition: all 0.5s ease-out !important;
}

.mfp-bg.mfp-fade-in.mfp-ready {
	opacity: 1 !important;
	transition: all 0.5s ease-out !important;
}

.mfp-bg.mfp-fade-in.mfp-removing {
	opacity: 0 !important;
	transition: all 0.5s ease-out !important;
}

.mfp-close:after {
	color: #26757b !important;
}

.mfp-arrow-right:after,
.mfp-arrow-left:after {
	color: #26757b !important;
}

/* 開始・終了時のトランジション */

.mfp-wrap .mfp-close,
.mfp-wrap .mfp-arrow-right,
.mfp-wrap .mfp-arrow-left {
	opacity: 0 !important;
	transition: all 0.5s ease-out !important;
}

.mfp-wrap.mfp-ready .mfp-close,
.mfp-wrap.mfp-ready .mfp-arrow-right,
.mfp-wrap.mfp-ready .mfp-arrow-left {
	opacity: 1 !important;
	transition: all 0.5s ease-out !important;
}

.mfp-wrap.mfp-removing .mfp-close,
.mfp-wrap.mfp-removing .mfp-arrow-right,
.mfp-wrap.mfp-removing .mfp-arrow-left {
	opacity: 0 !important;
	transition: all 0.5s ease-out !important;
}

/* 注釈 */

.note {
	max-width: 1120px;
	margin: 30px auto 0;
	/* background-color: rgba(255, 214, 230, .9); */
	/* background-color: #fff; */
}

@media screen and (max-width: 787px){
	.note {
		margin: 30px 7vw 0;
	}
}

.txt-note {
	color: #42291f;
}

/* 継承されている文字の調整 */

.box-popup .category,
.box-popup .box .head,
.box-popup .box .head [class^="icon-"] {
	font-weight: bold;
	color:#26757b;
}

.box-popup .box .tel {
	color:#26757b;
}

/* 継承されているその他の箇所の調整 */

.box-menu__list li img {
	background: #f1eded;
}

/* 文字詰め調整 */

.nav__item-text,
.box-article__icon,
.box-popup .category,
.box-popup .title,
.box-popup .price,
.box-popup .description,
.box-popup .box .head,
.box-popup .box .content,
.txt-banzai,
.txt-note {
	font-feature-settings: "palt";
}

.nav__item-text,
.box-popup .price,
.box-popup .description,
.box-article__icon,
.txt-banzai,
.txt-note {
	letter-spacing: 0.05em;
}

/* 行揃え調整 */

.box-popup .description,
.txt-note {
	text-align: justify;
}