@charset "utf-8";

@media(max-width: 768px){
	body {
		cursor: auto;
	}
	#cur, #ring {
		display: none;
	}
	nav {
		padding: 12px 16px;
	}
	.nav-links{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		background: rgba(255,248,250,.97);
		backdrop-filter: blur(14px);
		flex-direction: column;
		align-items: stretch;
		padding: 70px 20px 28px;
		gap: 0;
		z-index: 299;
		border-bottom: 2px solid var(--pk1);
		display: flex;
		visibility: hidden;
		opacity: 0;
		transform: translateY(-100%);
		pointer-events: none;
		transition: none;
	}
	.nav-links.open {
		visibility: visible;
		opacity: 1;
		transform: translateY(0);
		pointer-events: auto;
		animation: navSlideIn .32s cubic-bezier(.22, 1, .36, 1) both;
	}
	.nav-links.closing {
		animation: navSlideOut .26s cubic-bezier(.4, 0, 1, 1) both;
	}
	.nav-links li {
		border-bottom: 1.5px solid var(--pk1);
	}
	.nav-links a {
		padding: 14px 8px;
		font-size: .92rem;
	}
	.hbg {
		display: flex;
		z-index: 301;
	}
	.sec {
		padding: 64px 20px;
	}
	.hero-text {
		padding: 0 20px 44px;
	}
	.hero-name {
		font-size: clamp(2.2rem, 8vw, 3rem);
	}
	.hero-btns {
		justify-content: flex-start;
	}
	.ad1 {
		top: auto;
		bottom: 28%;
		right: 3%;
		font-size: .72rem;
		padding: 5px 11px;
	}
	.ad2 {
		display:none;
	}
	.ad3 {
		top: 9%;
		left: 2%;
		font-size: .7rem;
		padding: 5px 10px;
	}
	.halo-deco {
		display: none;
	}
	.profile-grid {
		grid-template-columns: 1fr;
	}
	.prof-right-standingart {
		display: none;
	}
	.charinfo-grid {
		grid-template-columns: 1fr;
	}
	.stats {
		gap: 8px;
	}

	.week {
		grid-template-columns: repeat(7, 1fr);
		gap: 4px;
	}
	.dlabel {
		font-size: .58rem;
		padding: 5px 2px;
	}
	.chip {
		font-size: .58rem;
		padding: 6px 3px;
		line-height: 1.3;
	}

	.vid-card {
		width: 260px;
	}
	.vid-card.pos-left {
		transform: translateX(-190px)rotateY(22deg)scale(.82);
		opacity: .6;
	}
	.vid-card.pos-left2 {
		transform: translateX(-340px)rotateY(36deg)scale(.68);
		opacity: .3;
	}
	.vid-card.pos-right {
		transform: translateX(190px)rotateY(-22deg)scale(.82);
		opacity: .6;
	}
	.vid-card.pos-right2 {
		transform: translateX(340px)rotateY(-36deg)scale(.68);
		opacity: .3;
	}
	.gal-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.links-grid {
		grid-template-columns: 1fr;
	}
	.modal-box {
		margin: 12px;
		max-height: 88svh;
	}
	.modal-head {
		padding: 18px 20px 14px;
	}
	.modal-body {
		padding: 16px 20px 22px;
	}
}

/* ハンバーガーメニュー スライド keyframes */
@keyframes navSlideIn {
	from {
		opacity: 0;
		transform: translateY(-100%);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes navSlideOut{
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(-100%);
	}
}
@media(min-width:769px)and(max-width:1024px) {
	nav {
		padding: 12px 24px;
	}
	.sec {
		padding: 84px 28px;
	}
	.profile-grid {
		grid-template-columns: 210px 1fr;
		gap: 32px;
	}
}