@charset "utf-8";

/* base
------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Spartan:wght@400;700&display=swap");
:root{
	--easing:cubic-bezier(.2, 1, .2, 1);
	--transition:.8s var(--easing);
}
#mv{ margin:90px 0 0; }
#mv .l-inner{ padding-bottom:0; }
#mv .swiper-fade .swiper-slide{ -webkit-transition-property:opacity, -webkit-transform !important; transition-property:opacity, -webkit-transform !important; transition-property:opacity, transform !important; transition-property:opacity, transform, -webkit-transform !important; pointer-events:none; }
#mv .swiper-fade .swiper-slide-active{ pointer-events:auto; }
#mv .swiper-pagination{ position:absolute; z-index:1; top:auto; bottom:30px; left:0; margin:auto; display:flex; justify-content:center; align-items:center; }
#mv .swiper-pagination-bullet{ display:block; width:3.2rem; height:4px; cursor:pointer; -webkit-transition:var(--transition); transition:var(--transition); background-color:rgba(255, 255, 255, 0.5); opacity:1; border-radius:0; margin:0 5px; }
#mv .swiper-pagination-bullet-active{ background-color:#FFF; }
#mv .slide-media{ height:calc(570 / 1280 * 100vw); }
#mv .slide{ background-size:cover; background-position:center right 25%; background-repeat:no-repeat; }
#mv .slide-media img{ display:none; }
#mv .slide-title{ font-size:28px; font-weight:normal; padding:0 20px; line-height:1.6; position:absolute; left:0; right:0; margin:auto; bottom:15%; color:#fff; width:100%; max-width:1280px; }
#mv .slide-title span{ display:block; font-size:8rem; font-weight:bold; opacity:0.8; white-space:pre-wrap; text-shadow:7px 7px 5px rgba(0,0,0,0.75); line-height:1.1; transform:scale(0.9, 1); margin:0 0 0 -0.5em; font-family:"Oswald", sans-serif; }
@media only screen and (max-width:1024px){
	#mv .slide-media{ height:max(70vh, 70vw); }
}
@media only screen and (max-width:1023px){
	#mv{ margin:60px 0 0; }
	#mv .slide-title{ font-size:22px; right:6rem; }
	#mv .slide-title span{ font-size:6rem; }
}
@media only screen and (max-width:599px){
	#mv .slide-title{ font-size:18px; }
	#mv .slide-title span{ font-size:4rem; }
}
#mv .swiper-slide[class*=-active] .slide-media img{
	-webkit-transition-delay:0s;
			transition-delay:0s;
	-webkit-transform:scale(1.05);
			transform:scale(1.05);}
#mv .swiper-slide[class*=-active] .slide-title{
	-webkit-animation:mv01-fadeIn 2s 0.5s var(--easing) both;
			animation:mv01-fadeIn 2s 0.5s var(--easing) both;}
@-webkit-keyframes mv01-fadeIn{
	0%{
		-webkit-transform:scale(0.5);
				transform:scale(0.5);
		opacity:0;
		-webkit-filter:blur(300px);
				filter:blur(300px);
	}
	100%{
		-webkit-transform:scale(1);
				transform:scale(1);
		opacity:1;
		-webkit-filter:blur(0);
				filter:blur(0);
	}
}
@keyframes mv01-fadeIn{
	0%{
		-webkit-transform:scale(0.5);
				transform:scale(0.5);
		opacity:0;
		-webkit-filter:blur(300px);
				filter:blur(300px);
	}
	100%{
		-webkit-transform:scale(1);
				transform:scale(1);
		opacity:1;
		-webkit-filter:blur(0);
				filter:blur(0);
	}
}

/* Intro
--------------------*/
#intro{ padding:50px 20px; }
#intro h2{ font-size:20px; font-weight:bold; margin:0 0 25px; }
@media only screen and (min-width:768px){
	#intro{ padding:65px 20px; }
	#intro h2{ text-align:center; font-size:22px; margin:0 0 30px; }
	#intro p{ text-align:center; }
}
@media only screen and (min-width:1024px){
	#intro{ padding:80px 20px; }
	#intro h2{ margin:0 0 35px; }
}

/* News
--------------------*/
#news{ padding:50px 20px; background:#292523; }
#news ul{ margin:30px 0;}
#news ul li{ border-bottom:1px solid #FFF; padding:14px 0; }
#news ul li:last-child{ border-bottom:none; }
#news ul li span{ display:block; }
@media only screen and (min-width:768px){
	#news{ padding:65px 20px; }
	#news ul li{ padding:14px 35px; display:flex; }
	#news ul li span{ margin:0 0 0 35px; }
}
@media only screen and (min-width:1024px){
	#news{ padding:80px 20px; }
	#news ul li{ padding:14px 45px; }
}

/* Products
--------------------*/
#products{ padding:50px 20px; }
.prod-row{ margin:40px 0 0; }
.prod-box{ background:#292523; padding:45px 20px 50px; }
.prod-bale h3{ font-size:30px; font-weight:bold; margin:0 0 25px; transform:scale(0.9, 1); font-family:"Oswald", sans-serif; }
.prod-bale h3 span{ padding:10px 0 0; font-weight:normal; margin:10px 0 0; display:block; position:relative; font-size:18px; font-family:"Noto Sans JP"; }
.prod-bale h3 span::after{ content:''; position:absolute; top:0; left:0; margin:auto; width:178px; height:3px; background:#FFF;}
.prod-bale p{ white-space:pre-wrap; }
.prod-bale .dlb-btn a{ margin:30px auto 0; }
@media only screen and (min-width:768px){
	#products{ padding:65px 0; }
	.prod-col{ display:flex; flex-wrap:wrap; }
	.prod-col:nth-child(even){ flex-direction:row-reverse; }
	.prod-img,
	.prod-box{width:50%;display:flex;align-items:center;}
	.prod-img img{ width:100%; }
    .prod-bale{ margin:auto; width:75%; }
	.prod-bale h3{ font-size:40px; margin:0 0 30px; }
	.prod-bale h3 span{ font-size:20px; }
	.prod-bale .dlb-btn a{ margin:35px 0 0; }
}
@media only screen and (min-width:1024px){
	#products{ padding:80px 0; }
	.prod-bale h3{ font-size:45px; margin:0 0 35px; }
	.prod-bale h3 span{ font-size:22px; }
	.prod-bale .dlb-btn a{ margin:40px 0 0; }
}

/* Service
--------------------*/
#service{ position:relative; background-repeat:no-repeat; background-size:cover; background-position:center; padding:60px 20px; }
#service::after{ content:''; position:absolute; bottom:0; left:0; width:100%; height:100%; background-color:rgba(35, 24, 21, 0.6); }
#service .dlb-ttl{ margin:0 0 35px; }
#service .inner{ position:relative; z-index:2; }
@media only screen and (min-width:768px){
	#service{ padding:120px 20px; }
	#service p{ text-align:center; }
}
@media only screen and (min-width:1024px){
	#service{ padding:180px 0; }
}

/* Brands
--------------------*/
#brands{ padding:50px 20px; 145px; }
.brand-list{ display:flex; flex-wrap:wrap; text-align:center; margin:40px 0 0; }
.brand-list li{ width:calc(50% - 10px); }
.brand-list li:nth-child(odd){ margin:20px 10px 0 0; }
.brand-list li:nth-child(even){ margin:20px 0 0 10px; }
.brand-list li:nth-child(1){ margin:0 10px 0 0; }
.brand-list li:nth-child(2){ margin:0 0 0 10px; }
.brand-list li a{ line-height:0; display:block; }
.brand-list li span{ display:block; }
.brand-list li img{ width:100%; }
@media only screen and (min-width:577px){
	.brand-list li,
	.brand-list li:nth-child(2),
	.brand-list li:nth-child(-n+1),
	.brand-list li:nth-child(2n),
	.brand-list li:nth-child(odd),
	.brand-list li:nth-child(even){ margin:20px 20px 0 0; width:calc(100%/3 - 13.3333px); }
	.brand-list li:nth-child(3n){ margin:20px 0 0; }
	.brand-list li:nth-child(-n+2){ margin:0 20px 0 0; }
	.brand-list li:nth-child(3){ margin:0; }
}
@media only screen and (min-width:768px){
	#brands{ padding:65px 20px 180px; }
	.brand-list li:nth-child(odd),
	.brand-list li:nth-child(even){ width:calc(25% - 15px); margin:20px 20px 0 0; }
	.brand-list li:nth-child(4n){ margin:20px 0 0; }
	.brand-list li:nth-child(-n+3){ margin:0 20px 0 0; }
	.brand-list li:nth-child(4){ margin:0; }
}
@media only screen and (min-width:1101px){
	.brand-list li:nth-child(odd),
	.brand-list li:nth-child(even){ width:calc(100%/6 - 16.6666px); margin:20px 20px 0 0; }
	.brand-list li:nth-child(6n){ margin:20px 0 0; }
	.brand-list li:nth-child(-n+5){ margin:0 20px 0 0; }
	.brand-list li:nth-child(6){ margin:0; }
}
@media only screen and (min-width:1024px){
	#brands{ padding:80px 20px 215px; }
}