@charset "UTF-8";

/* about */
@media all {
	.about-dt {text-align: center;}
	.about-dt img {width: auto; height: 100%;}
	.about-dd {
		position: relative;
		background-color: rgba(253,237,243,1);
		border: var(--max2px) solid #000;
		font-family: var(--yakuhan);
		font-weight: bold;
		line-height: 2.333;
		text-align: center;
	}
	.about-dd .deco img {
		width: auto;
		height: 100%;
	}

	/* sp */
	@media (max-width: 767px) {
		.about-dl {margin-top: 60rem;}
		.about-dt img {height: 59rem;}
		.about-dd {
			margin: 30rem auto 0;
			padding: 20rem 0;
			width: 340rem;
			border-radius: 15rem;
		}
		.deco {
			bottom: -2rem;
			height: 118rem;
		}
		.deco1 {left: -35rem;}
		.deco2 {right: -50rem;}
	}

	/* tab & pc */
	@media print,
	(min-width: 768px) {
		.about-dl {margin-top: 65rem;}
		.about-dt img {height: 45rem;}
		.about-dd {
			margin: 40rem auto 0;
			padding-top: 40rem;
			width: 560rem;
			height: 220rem;
			border-radius: 30rem;
		}

		.deco {
			bottom: 0;
			height: 236rem;
		}
		.deco1 {left: -150rem;}
		.deco2 {right: -183rem;}
		
		/* tab */
		@media (max-width: 1024px) {
			.deco {height: min(236px, 26vw);}
			.deco1 {left: max(-150rem, -15vw);}
			.deco2 {right: max(-183rem, -19.5vw);}
		}
		
		/* pc */
		@media (min-width: 1025px) {}
	}
	
}

/* logos */
@media all {
	.about-logo-ttl {text-align: center;}
	.about-logo-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.about-logo-item {text-align: center;}
	.about-logo-item a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		height: 96rem;
	}
	.about-logo-item img {max-width: 100%;}
	.about-logo-item.toshima img {width: 209rem;}
	.about-logo-item.zaidan img {width: 295rem;}
	.about-logo-item.sunshine img {width: 220rem;}
	.about-logo-item.tobu img {width: 183rem;}
	.about-logo-item.wacca img {width: 240rem;}
	.about-logo-item.hareza img {width: 200rem;}

	/* sp */
	@media (max-width: 767px) {
		.about-logos {margin-top: 60rem;}
		.about-logo-list {
			row-gap: 12rem;
			margin: 30rem auto 0;
			width: 250rem;
		}
		.about-logo-item {
			width: 100%;
		}
		.about-logo-item a {height: 80rem;}

		.about-logo-item.toshima img {width: 180rem;}
		.about-logo-item.zaidan img {width: 245rem;}
		.about-logo-item.sunshine img {width: 190rem;}
		.about-logo-item.tobu img {width: 150rem;}
		.about-logo-item.wacca img {width: 210rem;}
		.about-logo-item.hareza img {width: 180rem;}
	}

	/* tab & pc */
	@media print,
	(min-width: 768px) {
		.about-logos {margin-top: 100rem;}
		.about-logo-list {
			row-gap: 2em;
			margin: 2.5em auto 0;
			max-width: 980rem;
		}
		.about-logo-item a {transition: .3s;}
		.about-logo-item a:hover {opacity: .7;}
		
		/* tab */
		@media (max-width: 1024px) {
			.about-logo-item {
				width: 33.3%;
				max-width: 310rem;
			}
		}
		
		/* pc */
		@media (min-width: 1025px) {
			.about-logo-item {width: 310rem;}
		}
	}
	
}

/* carousel */
@media all {
		.carousel {
			width: 100%;
			background: left bottom / cover repeat-x url(../img/about/carousel.jpg?v0530);
			animation: 75s linear infinite;
		}

	/* sp */
	@media (max-width: 767px) {
		.carousel {
			margin-top: 75rem;
			height: 198rem;
			animation-name: carousel-sp;
		}
		@keyframes carousel-sp {
			0% {background-position-x: 1242rem;}
			100% {background-position-x: 0rem;}
		}

		.site-footer {margin-top: 100rem;}
	}

	/* tab & pc */
	@media print,
	(min-width: 768px) {
		.carousel {
			margin-top: 150rem;
			height: 396rem;
			animation-name: carousel-pc;
		}
		@keyframes carousel-pc {
			0% {background-position-x: 2484rem;}
			100% {background-position-x: 0rem;}
		}

		.site-footer {margin-top: 200rem;}
		
		/* tab */
		@media (max-width: 1024px) {}
		
		/* pc */
		@media (min-width: 1025px) {}
	}
	
}






/* template */
@media all {

	/* sp */
	@media (max-width: 767px) {}

	/* tab & pc */
	@media print,
	(min-width: 768px) {
		
		/* tab */
		@media (max-width: 1024px) {}
		
		/* pc */
		@media (min-width: 1025px) {}
	}
	
}