@charset "UTF-8";


/* base settings */
@media all {
	:root {
		--modal-red: #ea0029;
	}
	body {
		font-family: "Noto Sans JP", sans-serif;
		background-color: #000;
		font-feature-settings: "palt";
		color: #fff;
		line-height: 1;
	}
	a {color: #fff;}
	.palt {font-feature-settings: "palt";}
	.ilb {display: inline-block;}
	.reg {
		display: inline-block;
		font-size: .75em;
		transform: translateY(27%);
	}
	sub:not(.reg) {
		display: inline-block;
		font-size: .7em;
	}
	.filter_blk {
		filter: brightness(0);
	}
	img {width: 100%;height: auto;}
	section {position: relative;}

	/* sp & tab */
	@media only screen and (max-width: 1024px) {
		.pcOnly {display: none!important;}
	}
	/* sp */
	@media only screen and (max-width: 767px) {
		:root {font-size: .25vw;}
		body {font-size: 15rem;}
		.spNone, .tabOnly {display: none!important;}
		.site-main {overflow: clip;}
	}
	/* pc & tab */
	@media print,
	(min-width: 768px) {
		body {font-size: 16rem;}
		.site-main {overflow: clip;}
		.spOnly {display: none!important;}
		/* pc */
		@media (min-width: 1025px) {
			:root {font-size: 1px;}
			.pcNone, .tabOnly {display: none!important;}
			.site-header,
			.site-main,
			.site-footer {min-width: 1280px;}
		}
		/* tab */
		@media (max-width: 1024px) {
			:root {font-size: 0.085vw;}
			.pcOnly, .spOnly, .tabNone {display: none!important;}
		}
		/* wide */
		@media (min-width: 1600px) {
			:root {font-size: .0625vw;}
		}
	}
}

/* splash */
@media all {
	.splash-base {
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100vh;
		z-index:1000;
		background: center / cover no-repeat url(img/splash/bg.jpg);
	}
	.splashed .splash-base {
		visibility: hidden;
		opacity: 0;
		pointer-events: none;
	}
	.splash-skip {
		position: absolute;
		display: block;
	}
	.splash-logos {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
	}
	.splash-logo1,
	.splash-logo2 {
		visibility: hidden;
		opacity: 0;
		transition: opacity 1s, filter 1s, visibility 1s;
	}
	.splash-logo2 {transition-delay: 1s;}
	.splash-logos.show :is(.splash-logo1, .splash-logo2) {
		visibility: visible;
		opacity: 1;
		filter: blur(0);
	}
	.splash-scroll {
		visibility: hidden;
		position: absolute;
		top: 50%;
		left: 50%;
		padding: 2px 0;
		transform: translate(-50%, -50%);
		opacity: 0;
		transition: opacity 1s, filter 1s, visibility 1s;
	}
	.splash-scroll.show {
		visibility: visible;
		opacity: 1;
		filter: blur(0);
	}
	.splash-scroll::before,
	.splash-scroll::after {
		content: '';
		position: absolute;
		z-index: 1;
		top: -1px;
		left: 0;
		width: 100%;
		background: center top / auto 100rem url(img/splash/grad.png);
	}
	.splash-scroll::after {
		top: auto;
		bottom: -1px;
		transform: scaleY(-1);
	}
	.splash-scroll-en {
		overflow: hidden;
		width: 100%;
		height: calc(100% - 4px);
	}

	.splash-scroll-ja {
		overflow: hidden;
		position: relative;
		opacity: 0;
		z-index: 2;
		transition: opacity .5s;
	}
	.scroll-ja-item img {
		margin: 0 auto;
		width: auto;
		height: 100%;
	}



	/* sp */
	@media only screen and (max-width: 767px) {
		.site-main {
			opacity: 0;
			transition: opacity .5s .25s;
		}
		.splashed .site-main {opacity: 1;}
		.splash-base {
			top: auto;
			bottom: 0;
			height: 100svh;
			transition: opacity .5s, visibility .5s;
		}
		.splash-skip {
			bottom: 20rem;
			right: 20rem;
			width: 70rem;
			height: 26rem;
		}
		.splash-logos {
			height: 84rem;
			width: 300rem;
		}
		.splash-logo1,
		.splash-logo2 {
			width: 128rem;
			filter: blur(15rem);
		}
		.splash-scroll {
			margin-top: -40rem;
			width: 100%;
			height: 340rem;
			filter: blur(10rem);
			text-align: center;
		}
		.splash-scroll::before,
		.splash-scroll::after {height: 100rem;}
		.splash-scroll .splash-scroll-en .linear {width: 330rem;}
		.splash-scroll.show .splash-scroll-en .linear {
			animation: scroll_sp 15s linear forwards;
		}
		@keyframes scroll_sp {
			0% {transform: translateY(255rem);}
			100% {transform: translateY(-320rem);}
		}

		.splash-scroll-ja {
			transform: translateY(40rem);
			width: 100%;
			height: 60rem;
		}
		.scroll-ja-item img {height: 60rem;}
	}

	/* pc & tab */
	@media (min-width: 768px) {
		.splash-base {transition: opacity 2s, visibility 2s, filter 2s;}
		.splashed .splash-base {filter: blur(50rem);}
		.splash-skip {
			bottom: 50rem;
			right: 30rem;
			width: 70rem;
			height: 26rem;
		}
		.splash-logos {
			height: 170rem;
			max-width: 690rem;
		}
		.splash-logo1,
		.splash-logo2 {
			width: 256rem;
			filter: blur(25rem);
		}
		.splash-scroll {
			margin-top: -40rem;
			width: 100%;
			height: 485rem;
			filter: blur(10rem);
			text-align: center;
		}
		.splash-scroll::before,
		.splash-scroll::after {height: 100rem;}
		.splash-scroll .splash-scroll-en .linear {width: 650rem;}
		.splash-scroll.show .splash-scroll-en .linear {
			animation: scroll 15s linear forwards;
		}
		@keyframes scroll {
			0% {transform: translateY(500rem);}
			100% {transform: translateY(-620rem);}
		}

		.splash-scroll-ja {
			transform: translateY(80rem);
			width: 100%;
			height: 40rem;
		}
		/* tab */
		@media (max-width: 960px) {}
		/* pc */
		@media (min-width: 961px) {}
		/* wide */
		@media (min-width: 1600px) {}
	}
}

/* header */
@media all {
	.iPhone-hack {
		font-size: 0;
		height: 0;
		transition: height 2s;
	}
	.site-header {
		position: fixed;
		z-index: 1010;
		top: 0;
		left: 0;
		display: flex;
		align-items: center;
		width: 100vw;
		background-color: rgba(0,0,0,0);
		visibility: hidden;
		opacity: 0;
		transition: opacity 1s, visibility 1s, background-color 1s, filter 1s, top 2s;
	}
	.splashed .site-header {
		visibility: visible;
		opacity: 1;
		filter: blur(0);
		background-color: rgba(0,0,0,1);
	}
	.site-header-swlogo {display: block;}
	.site-header-9229logo {
		position: fixed;
		top: 0;
		right: 0;
		background-color: #fff;
		z-index: 1020;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	/* sp */
	@media only screen and (max-width: 767px) {
		.site-header {
			padding-left: 20rem;
			height: 56rem;
			filter: blur(10rem);
		}
		.site-header-swlogo {
			margin-top: 1rem;
			width: 76.5rem;
		}
		.site-header-9229logo {
			width: 240rem;
			height: 56rem;
			transition: top 2s;
		}
		.site-header-9229logo img {width: 207rem;}

		.iPhone :is(.site-header, .site-header-9229logo) {top: 5px;}
		.iPhone .iPhone-hack {
			position: fixed;
			z-index: 9000;
			top: 0;
			left: 0;
			display: block;
			width: 100%;
			height: 5px;
			background-color: #000;
		}
	}

	/* pc & tab */
	@media (min-width: 768px) {
		.site-header {
			padding-left: 40rem;
			height: 65rem;
			filter: blur(10rem);
		}
		.site-header-swlogo {
			margin-top: 1rem;
			width: 81rem;
		}
		.site-header-9229logo {
			width: 350rem;
			height: 65rem;
		}
		.site-header-9229logo img {width: 300rem;}
		/* tab */
		@media (max-width: 1024px) {}
		/* pc */
		@media (min-width: 1025px) {}
		/* wide */
		@media (min-width: 1600px) {}
	}
}

/* .site-main-header(slick) & .aside-banners */
@media all {
	.site-main-header {position: relative;}
	.site-main-header div {height: 100%!important;}
	.slider-img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center center;
	}

	.aside-bnr-link {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		background-color: #1b1819;
	}

	.sw-license {
		position: absolute;
		z-index: 1;
		display: block;
	}

	/* sp */
	@media only screen and (max-width: 767px) {
		.site-main-header {
			margin-top: 56rem;
			height: calc(100svh - 56rem - 56rem);
		}
		/* .aside-banners {
			position: sticky;
			top: calc(100% - 59rem + 1px);
			top: calc(56rem - 2px);
			display: flex;
			align-items: center;
			justify-content: space-evenly;
			width: 100vw;
			height: 59rem;
		} */
		
		.aside-banners {display: flex;}
		.aside-bnr {
			width: 50%;
			height: 56rem;
			border: max(1px, 1rem) solid #8c8c8c;
		}
		.aside-bnr:nth-child(odd) {border-right: none;}
		.aside-bnr-link {height: 100%;}

		.aside-bnr-logo1 {width: 33rem;}
		.aside-bnr-logo2 {width: 34rem;}

		.sw-license {
			bottom: 15rem;
			right: 15rem;
		}
	}

	/* pc & tab */
	@media (min-width: 768px) {
		.site-main-header {
			margin-top: 65rem;
			height: calc(100vh - 65rem);
			min-height: 500rem;
		}
		.aside-banners {
			overflow: hidden;
			position: fixed;
			z-index: 999;
			top: 200rem;
			right: 0;
			width: 68rem;
		}
		.aside-bnr {transition: margin 1s;}
		.aside-bnr:nth-child(1) {transition-delay: .25s;}
		.hide .aside-bnr {margin-left: 68rem;}
		.aside-bnr + .aside-bnr {margin-top: 15rem;}
		.aside-bnr-link {
			margin-left: 10rem;
			padding-right: 10rem;
			height: 120rem;
			width: 68rem;
			border: max(1px, 1rem) solid #8c8c8c;
			border-right: none;
			transition: margin .3s, padding .3s, background-color .3s;
		}
		.aside-bnr-link:hover {
			margin-left: 0;
			background-color: #5b5859;
		}

		.aside-bnr-logo1 {width: 37rem;}
		.aside-bnr-logo2 {width: 38rem;}

		.sw-license {
			bottom: 34rem;
			right: 38rem;
		}

		/* tab */
		@media (max-width: 1024px) {
			.site-main-header {
				max-height: 750rem;
			}
		}
		@media (min-width: 1281px) {
			.site-main-header {
				min-height: 45vw;
				max-height: 75vw;
			}
		}
		/* wide */
		@media (min-width: 1600px) {}
	}
}

/* .intro-section */
@media all {
	.intro-section {
		text-align: center;
		background: center / cover url(img/intro/bg.jpg);
	}
	.intro-ttl {
		font-weight: normal;
		line-height: 1.667;
		transform-origin: center center;
	}
	.intro-content {line-height: 2.2;}

	/* sp */
	@media only screen and (max-width: 767px) {
		.intro-section {
			padding: 80rem 0 70rem;
			background-size: 150%;
		}
		.intro-ttl {font-size: 24rem}
		.intro-content {
			margin-top: 45rem;
			font-size: 17rem;
		}
	}

	/* pc & tab */
	@media (min-width: 768px) {
		.intro-section {
			padding: 160rem 20rem 140rem;
			background-size: 150%;
		}
		.intro-ttl {
			transform: scaleX(.9);
			font-size: 42rem
		}
		.intro-content {
			margin-top: 90rem;
			font-size: 25rem;
		}
	}
}

/* .product-section (共通部品) */
@media all {
	.product-section {background-color: #1b1819;}
	/* .product-section::before {
		content: '';
		position: absolute;
		bottom: calc(100% - 2px);
		left: 0;
		width: 100%;
		height: 30rem;
		background: linear-gradient(to bottom, rgba(27,24,25,0), rgba(27,24,25,1) calc(100% - 4px));
	} */
	.product-header {text-align: center;}

	.product-content-ttl {margin: 0 auto;}

	.sith-text, .way-text {
		z-index: 2;
		font-weight: 200;
	}
	.white-vertical {
		position: absolute;
		writing-mode: vertical-rl;
		color: #fff;
	}
	.black-vertical {
		position: absolute;
		writing-mode: vertical-rl;
		color: #000;
	}

	.product-item {position: relative;}
	.product-name-img {width: auto;}
	.product-feature {
		font-weight: 200;
		line-height: 1.733;
	}

	.product-buttons {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		font-weight: normal;
	}
	button.detail {
		display: block;
		margin: 0;
		padding: 0;
	}
	button.detail:hover {cursor: zoom-in;}
	.product-btn.rakuten a {
		background: linear-gradient(to right, rgba(209, 12, 15, 1) 0%, rgba(136, 0, 1, 1) 100%)
	}
	.product-btn.yahoo a {
		background-color: #e6233e;
		color: #fff
	}
	.product-btn.amazon a {
		background-color: #f8991d;
		color: #fff
	}
	.product-btn a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
	}
	.product-buy-date {
		margin-top: 1em;
		text-align: center;
	}
	/* 発売開始したら削除？ */
	.product-item.sith-1 {padding-top: 120rem;}
	
	/* sp */
	@media only screen and (max-width: 767px) {
		.product-header {padding-top: 80rem;}
		.product-ttl img {width: 240rem;}

		.product-det {padding: 0 30rem;}
		.product-sub {font-size: 16rem;}
		.product-name-img {
			margin-top: 16rem;
			height: 24rem;
		}
		.product-feature {
			margin-top: 20rem;
			font-size: 15rem;
		}

		.product-buttons {
			margin: 0 auto;
			gap: 16rem 8rem;
			width: 300rem;
		}

		.product-btn.btn1, button.detail {width: 100%;}

		.product-btn:not(.btn1) {
			width: calc(50% - 4rem);
			height: 44rem;
		}
		.product-btn.rakuten img {width: 87.5rem;}
		.product-btn.amazon {margin-top: -8rem;}
	}

	/* pc & tab */
	@media (min-width: 768px) {
		.product-header {padding-top: 80rem;}
		.product-ttl img {width: 364rem;}

		.product-det {padding-left: calc(50% + 126rem);}
		.product-txt {width: 350rem;}
		.product-sub {font-size: 18rem;}
		.product-name-img {
			margin-top: 28rem;
			height: 30rem;
		}
		.product-feature {
			margin-top: 30rem;
			font-size: 15rem;
		}

		.product-buttons {
			margin-top: 30rem;
			gap: 20rem 8rem;
			font-size: 15rem;
		}

		button.detail {width: 350rem;}
		button.detail img {transition: opacity .3s;}
		button.detail:hover img {opacity: 0;}

		.product-btn:not(.btn1) {
			width: calc(50% - 4rem);
			height: 44rem;
		}
		.product-btn.rakuten img {width: 87.5rem;}
		.product-btn a {transition: opacity .3s;}
		.product-btn a:hover {opacity: .6;}

		.product-btn.amazon {margin-top: -10rem;}

		/* wide */
		@media (min-width: 1600px) {}
	}
}

/* .sith-content */
@media all {
	.product-item.sith-2 {
		background-color: #fff;
		color: #000;
	}
	
	/* sp */
	@media only screen and (max-width: 767px) {
		.sith-content .product-content-ttl {width: 180rem;}
		.sith-text {
			left: 0;
			font-size: 40rem;
		}
		.sith-text.white-vertical {bottom: -25rem;}
		.sith-text.black-vertical {top: 10rem;}
		.product-item.sith-1 {
			margin-top: 40rem;
			padding-top: 40rem;
			padding-bottom: 40rem;
			background: 40rem 350rem / 120% auto no-repeat url(img/product/sith-1.jpg);
		}
		.sith-1 .product-det {
			position: relative;
			margin-top: 60rem;
		}
		.sith-1 .product-det::before,
		.sith-1 .product-det::after {
			content: '';
			position: absolute;
			top: 140rem;
			left: 39rem;
			display: block;
			width: 30rem;
			height: 345rem;
			background: linear-gradient(to left, rgba(27,24,25,0), rgba(27,24,25,1) calc(100% - 4px));
		}
		.sith-1 .product-det::after {
			top: 243rem;
			left: 210rem;
			transform: rotate(-90deg);
		}
		.sith-1 :is(.product-feature, .product-buttons) {
			position: relative;
			z-index: 10;
		}
		.sith-1 .product-buttons {
			margin-top: 275rem;
			transform: translateX(18rem);
		}
		.sith-1 .product-buy-date {transform: translateX(18rem);}

		.product-item.sith-2 {padding: 40rem 0;}
		.sith-2 :is(.product-sub, .product-name, .product-feature) {padding-left: 30rem;}
		.sith-2 .product-img {
			position: absolute;
			top: 260rem;
			left: calc(50% - 150rem);
			width: 300rem;
			height: 241.5rem;
		}
		.sith-2 .product-buttons {margin-top: 260rem;}
	}

	/* pc & tab */
	@media (min-width: 768px) {
		.sith-content .product-content-ttl {width: 490rem;}
		.sith-text {
			left: 0;
			font-size: 80rem;
		}
		.sith-text.white-vertical {bottom: -50rem;}
		.sith-text.black-vertical {top: 20rem;}

		.product-item.sith-1 {
			margin-top: 80rem;
			padding-top: 90rem;
			/* 発売日過ぎたら削除？ */
			margin-top: 95rem;
			padding-top: 65rem;
			background: center bottom / contain no-repeat url(img/product/sith-1.jpg);
			height: 1000rem;
		}
		.product-det {margin-top: 51rem;}
		.sith-1 .detail {
			box-shadow: 0 0 18rem rgba(234, 0, 41, 1);
			background: center / cover no-repeat url(img/product/btn-sith-r.svg);
		}

		.sith-2 .product-det {margin-top: 60rem;}
		.product-item.sith-2 {
			display: flex;
			justify-content: center;
			height: 580rem;
		}
		.sith-2 .product-img {
			position: absolute;
			top: calc(50% - 237.5rem);
			left: calc(50% - 590rem + 126rem);
			width: 590rem;
			height: 475rem;
		}
		.sith-2 .detail {
			border: max(1px, 1rem) solid #fff;
			background: center / cover no-repeat url(img/product/btn-sith-w.svg);
		}
		.sith-2 .detail:hover {
			border: max(1px, 1rem) solid #ea0029;
		}

		@media (min-width: 1281px) {
			.product-item:is(.sith-1, .way-1) {position: relative;}
			.product-item:is(.sith-1, .way-1)::before,
			.product-item:is(.sith-1, .way-1)::after {
				content: '';
				position: absolute;
				top: 0;
				left: calc(50% - 640rem);
				display: block;
				width: 30rem;
				height: 1000rem;
				background: linear-gradient(to right, rgba(27,24,25,1) 4rem, rgba(27,24,25,0));
			}
			.product-item:is(.sith-1, .way-1)::after {
				left: calc(50% + 595rem);
				transform: scaleX(-1);
			}
		}

	}
}

/* .way-content */
@media all {
	.product-item.way-2 {
		background-color: #fff;
		color: #000;
	}
	.bnr-mandalorian {position: relative;}
	
	/* sp */
	@media only screen and (max-width: 767px) {
		.way-content .product-content-ttl {width: 280rem;}
		.way-text {
			right: 0;
			font-size: 40rem;
		}
		.way-text.white-vertical {bottom: -25rem;}
		.way-text.black-vertical {top: 10rem;}
		.product-item.way-1 {
			margin-top: 40rem;
			padding-top: 40rem;
			padding-bottom: 40rem;
			background: 10rem 281rem / 120% auto no-repeat url(img/product/way-1.jpg);
		}
		.way-1 .product-det {
			position: relative;
			margin-top: 60rem;
		}
		.way-1 .product-det::before,
		.way-1 .product-det::after {
			content: '';
			position: absolute;
			top: 140rem;
			left: 9rem;
			display: block;
			width: 30rem;
			height: 345rem;
			background: linear-gradient(to left, rgba(27,24,25,0), rgba(27,24,25,1) calc(100% - 4px));
		}
		.way-1 .product-det::after {
			content: none;
			top: 270rem;
			left: 180rem;
			transform: rotate(-90deg);
		}
		.way-1 :is(.product-feature, .product-buttons) {
			position: relative;
			z-index: 10;
		}
		.way-1 .product-buttons {
			margin-top: 275rem;
			transform: translateX(-18rem);
		}

		.product-item.way-2 {padding: 40rem 0;}
		.way-2 :is(.product-sub, .product-name, .product-feature) {padding-right: 30rem;}
		.way-2 .product-img {
			position: absolute;
			top: 265rem;
			left: calc(50% - 150rem);
			width: 300rem;
			height: 241.5rem;
		}
		.way-2 .product-buttons {margin-top: 260rem;}
	}

	/* pc & tab */
	@media (min-width: 768px) {
		.way-content .product-content-ttl {width: 336rem;}
		.way-text {
			right: 0;
			font-size: 80rem;
		}
		.way-text.white-vertical {bottom: -50rem;}
		.way-text.black-vertical {top: 20rem;}
		.product-item.way-1 {
			padding-top: 70rem;
			background: center bottom / contain no-repeat url(img/product/way-1.jpg);
			min-height: 1020rem;
		}
		.way-1 .product-det {margin-top: 60rem;}
		.way-1 .detail {
			box-shadow: 0 0 10rem 5rem rgba(255, 255, 255, .5);
			background: center / cover no-repeat url(img/product/btn-way-bk.svg);
		}

		.way-2 .product-det {margin-top: 80rem;}
		.product-item.way-2 {
			display: flex;
			justify-content: center;
			height: 580rem;
		}
		.way-2 .product-img {
			position: absolute;
			top: calc(50% - 220rem);
			left: calc(50% - 590rem + 126rem);
			width: 590rem;
			height: 440rem;
		}
		.way-2 .detail {
			border: max(1px, 1rem) solid #fff;
			background: center / cover no-repeat url(img/product/btn-way-w.svg);
		}
		.way-2 .detail:hover {
			border: max(1px, 1rem) solid #000;
		}

	}
}

/* .site-footer */
@media all {
	.site-footer {background-color: #1b1819;}
	.official-site {
		background: top center / 65rem auto repeat url(img/footer/bg.png);
	}
	.official-site-ttl {text-align: center;}
	.official-site a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	.official-site-sw {background-color: #000;}
	.official-site-9229 {background-color: #fff;}

	.footer-text-1 {
		position: relative;
		padding-bottom: 35rem;
		font-size: 11rem;
	}
	.footer-license {
		position: absolute;
		right: 0;
		width: 97rem;
	}
	.footer-list {
		font-size: 13rem;
		line-height: 2.3;
	}
	.footer-item-list {display: inline;}
	.footer-item-list li {display: inline-block;}

	.footer-item-list img {transform: translateY(-.6em);}
	.tm-1 {width: 89rem;}
	.tm-2 {width: 31rem;}
	.tm-3 {width: 91rem;}
	.tm-4 {width: 128rem;}

	
	/* sp */
	@media only screen and (max-width: 767px) {
		.official-site {
			padding: 50rem 20rem;
			text-align: center;
		}
		.official-site-ttl img {width: 180rem;}
		.official-site a {
			margin-top: 20rem;
			width: 270rem;
			height: 90rem;
		}
		.official-site-sw-logo {width: 126rem;}
		.official-site-9229-logo {width: 195rem;}

		.footer-text {padding: 50rem 20rem 20rem;}
		.footer-text-1 {
			padding-right: 100rem;
			line-height: 2.3;
		}
		.footer-license {top: -10rem;}

		.footer-list {margin-top: 30rem;}
	}

	/* pc & tab */
	@media (min-width: 768px) {
		.official-site {
			display: flex;
			flex-wrap: wrap;
			align-content: center;
			justify-content: center;
			gap: 40rem 20rem;
			height: 320rem;
		}
		.official-site-ttl {
			width: 100%;
		}
		.official-site-ttl img {width: 232rem;}

		.official-site a {
			width: 360rem;
			height: 120rem;
			transition: opacity .3s;
		}
		.official-site a:hover {opacity: .6;}
		.official-site-sw-logo {width: 168rem;}
		.official-site-9229-logo {width: 260rem;}

		.footer-text {
			margin: 0 auto;
			padding: 85rem 20rem 10rem;
			max-width: 880rem;
		}
		.footer-license {top: -60rem;}
		.footer-list {margin-top: 30rem;}

		/* wide */
		@media (min-width: 1600px) {}
	}
}


/* .inview */
@media all {
	.fadeUpperIn {
		opacity: 0;
		filter: blur(5rem);
		transform: translateY(50rem);
		transition: opacity 2s, filter 1s, transform 2s;
	}
	.animated:is(.fadeUpperIn, .fadeBlur) {
		opacity: 1;
		filter: blur(0);
		transform: translateY(0);
	}
	.fadeBlur {
		opacity: 0;
		filter: blur(10rem);
		transition: opacity 2s, filter 2s;
	}
	
	/* sp */
	@media only screen and (max-width: 767px) {}

	/* pc & tab */
	@media (min-width: 768px) {
		/* wide */
		@media (min-width: 1600px) {}
	}
}







/* modal-slider */
@media all {
	.modal-slider {
		border: max(1px, 1rem) solid #E6E6E6;
	}
	.modal-slider-thumb .slick-track {transform: unset!important;}
	.modal-slider-thumb-item {
		border: max(1px, 1rem) solid #E6E6E6;
		transition: border-color .3s;
		aspect-ratio: 1;
	}
	.modal-slider-thumb-item.slick-current {
		border-color: var(--modal-red);
	}
	.modal-slider .slick-prev,
	.modal-slider .slick-next {
		z-index: 10;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 30rem;
		height: 100%;
		background-color: rgba(0,0,0,0);
		transition: background .3s;
	}
	.modal-slider .slick-prev {
		left: 0;
		padding-left: 9rem;
	}
	.modal-slider .slick-next {
		right: 0;
		padding-right: 9rem;
	}
	.modal-slider .slick-prev::before,
	.modal-slider .slick-next::before {
		content: '';
		width: 15rem;
		height: 15rem;
		border-top: max(1px, 1rem) solid #ccc;
		border-left: max(1px, 1rem) solid #ccc;
		transition: border .3s;
	}

	.modal-slider .slick-prev:hover::before,
	.modal-slider .slick-next:hover::before {border-color: #bbb;}
	.modal-slider .slick-prev::before {
		transform: rotate(-45deg);
	}
	.modal-slider .slick-next::before {
		transform: rotate(135deg);
	}

	/* sp */
	@media (max-width: 767px) {
		.modal-slider-block {width: 100%;}
		.modal-slider-thumb {margin-top: 10rem;}
		.modal-slider-thumb-item {
			width: 60rem!important;
			margin-right: 4rem;
		}
		.modal-slider-thumb-item:nth-child(5n) {margin-right: 0;}
		/* .modal-slider-thumb .slick-track {
			display: flex;
			justify-content: space-between;
			width: 100%!important;
		}
		.modal-slider-thumb-item {width: calc(20% - 3rem)!important;} */
		
	}
	/* tab & pc */
	@media (min-width: 768px) {
		.modal-slider-block {
			width: 400rem;
		}
		.modal-slider .slick-prev:hover,
		.modal-slider .slick-next:hover {background-color: rgba(128,128,128,.2);}
		.modal-slider-thumb {margin-top: 10rem;}
		.modal-slider-thumb-item {
			width: 15%!important;
			margin-left: 8rem;
			margin-bottom: 8rem;
		}
		.modal-slider-thumb-item:nth-child(6n+1) {margin-left: 0;}
	}
}


/* modal */
@media all {
	.modal-content {display: none;}
	.modal-base {
		position: fixed;
		z-index: 1111;
		top: 0;
		left: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100vw;
		height: 100vh;
		background: rgba(30,30,30,.8);
		opacity: 1;
		transition: visibility .5s linear, opacity .5s linear;
		pointer-events: none;
	}
	.modal-close-area {
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
		width: 100vw;
		height: 100vw;
		pointer-events: all;
		cursor:zoom-out;
	}
	.modal-base.hide {
		visibility: hidden;
		opacity: 0;
	}
	.modal,
	.modal-viewer {
		width: calc(100vw - 40rem);
		height: calc(100svh - 60rem);
		background-color: #fff;
	}
	.modal {
		position: relative;
		z-index: 0;
		pointer-events: all;
	}
	.modal-closer {
		position: absolute;
		top: .5em;
		right: .5em;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 0 0 1px 0;
		width: 1.2em;
		height: 1.2em;
		border: max(2px, 2rem) solid var(--modal-red);
		font-size: 18rem;
		-webkit-text-stroke: 1px;
		color: var(--modal-red);
		line-height: 1;
		cursor: pointer;
		transition: background .3s, color .3s;
	}
	.modal-closer:hover {
		background: var(--modal-red);
		color: #fff;
	}
	.modal-viewer {
		overflow: auto;
		height: 100%;
		color: #000;
	}
	.product-points {margin-top: 40rem;}
	.product-points-item {
		position: relative;
		padding-left: 1em;
		line-height: 1.334;
	}
	.product-points-item + .product-points-item {margin-top: .5em;}
	.star-list li::before,
	.product-points-item::before,
	.product-square-item::before,
	.product-dots-item::before {
		content: '■';
		position: absolute;
		left: 0;
	}
	.star-list li,
	.product-square-item,
	.product-dots-item {
		position: relative;
		padding-left: 1em;
	}
	.product-dots-item::before {content: '・';}
	/* .star-list li::before {content: '☆';} */
	.product-set {margin-top: 1.6em;}
	.product-parts-ttl {
		line-height: 1.4;
	}
	.product-parts-ttl.b-bottom {
		padding-bottom: .5em;
		border-bottom: max(1px, 1rem) solid #000;
	}
	.product-dots-list {
		margin-top: 10rem;
		padding: 10rem 0;
		border-top: max(1px, 1rem) solid #000;
		line-height: 1.667;
	}
	.product-set .product-dots-list {
		border-bottom: max(1px, 1rem) solid #000;
	}
	.product-spec tr:nth-child(odd) {background-color: #F4F6F7;}
	.inner-tbl tr:nth-child(odd) {background: none;}
	.product-spec {
		width: 100%;
		border: 1px solid #D3DAE0;
		line-height: 1.5;
	}
	.product-spec th {
		padding-right: .3em;
		padding-left: .4em;
		max-width: 6em;
		border-right: 1px solid #D3DAE0;
		font-weight: normal;
		text-align: left;
		vertical-align: top;
		white-space: nowrap;
	}
	.product-spec td {
		padding: 0 .4em;
	}
	/*.product-spec td:has(.inner-tbl) {padding: 0;}
	.inner-tbl {width: 100%;}
	.product-spec > tbody > tr > :is(th, td) {
		border: 1px solid #D3DAE0;
	} */
	.product-spec td small {font-size: 10rem;}
	.product-spec .inner-tbl :where(th, td) {
		text-align: center;
		vertical-align: middle;
	}
	.product-spec .inner-tbl th {
		padding-bottom: .4em;
		width: 50%;
		border: none;
	}
	/* .product-spec .inner-tbl tr:nth-child(odd) {background-color: #f2f2f2;} */
	.product-spec .inner-tbl td:nth-child(odd) {border-right: 1px solid #D3DAE0;}
	.product-spec .inner-tbl tr:not(:last-child) td {border-bottom: 1px solid #D3DAE0;}
	.product-spec .lh1 {
		padding-bottom: .25em;
		line-height: .8;
		white-space: nowrap;
	}
	.product-spec .inner-tbl .gray {
		display: block;
		margin: 0 auto;
		width: 95%;
		background-color: #92A2B2;
		border-radius: 1.5em;
		color: #fff;
	}
	.product-spec .modal-product-notice {
		margin-left: -1.5em;
	}
	.product-spec .modal-product-notice li {
		display: inline-block;
		margin-left: 1.5em;
	}
	.product-parts-img {text-align: center;}
	.spec-notice {
		margin-top: .5em;
		line-height: 1;
	}
	.spec-notice li {
		display: inline-block;
		margin-right: 1em;
		font-size: 10px;
	}
	.modal-product-notice {
		margin-top: 30rem;
		line-height: 1.34;
	}
	.modal-product-notice li {
		position: relative;
		padding-left: 2em;
	}
	.modal-product-notice li span {
		position: absolute;
		top: 0;
		left: 0;
	}

	.modal-buy-txt,
	.modal-buy-date {
		width: 100%;
		text-align: center;
	}
	.modal-buy-date {margin-top: 1em;}
	.close-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 4rem auto 0;
		background-color: #fff;
		border: 2px solid var(--modal-red);
		border-radius: var(--4px);
		box-shadow: 2px 2px 0 rgba(0,0,0,.2);
		font-weight: bold;
		color: var(--modal-red);
		transition: .3s;
		cursor: pointer;
	}
	.close-btn:hover {
		background-color: var(--modal-red);
		box-shadow: 0 0 0 rgba(0,0,0,0);
		color: #fff;
	}
	.close-btn .oswald {
		margin-right: .5em;
		font-weight: 500;
	}

	.modal-viewer .product-edit {color: var(--modal-red);}
	.size-tbl {
		font-family: var(--roboto);
		font-feature-settings: "palt";
	}
	.size-ttl {
		margin: .75em 0;
		text-align: left;
	}
	.size-tbl tr > :is(th, td):nth-child(n+2) {
		text-align: center;
	}
	.size-tbl tr:nth-child(odd) {background: none;}
	.size-tbl tr > :is(th, td):nth-child(even) {
		background-color: #F4F6F7;
	}
	.size-tbl tr > :is(th, td) {border: 1px solid #D3DAE0;}
	.size-tbl tr:nth-child(2) > th {width: 22%;}
	.size-tbl tr > td {width: 19.5%;}
	.modal-product2 .product-set + .product-set {
		margin-top: 3.5rem;
	}
	.product-set-txt {margin-top: 1em;}
	.product2-notice {margin-top: 4em;}
	.modal-product-notice + .product2-notice {margin-top: 1em;}
	.modal-product2 .modal-buy {margin-top: 4rem;}

	.product-spec-add {
		margin-top: .5em;
		line-height: 1.5;
	}

	/* sp */
	@media (max-width:767px) {
		.modal-base {height: 100dvh;}
		.modal-closer {
			top: 5rem;
			right: 5rem;
			z-index: 10;
			background-color: #fff;
			box-shadow: 0 0 0 5rem #fff;
		}
		.modal,
		.modal-viewer {
			width: 100%;
			max-width: 350rem;
			height: calc(100svh - 60rem);
		}
		.modal {
			width: calc(100% - 20rem);
		}
		.modal-content-inner {
			padding: 40rem 16rem 60rem;
			font-feature-settings: "palt";
		}
		.modal-product-main {margin-top: 50rem;}
		.modal-product-main .product-name {font-size: 40rem;}
		.modal-product-main .volt {font-size: 15rem;}
		.modal-product-main .product-sub {font-size: 15rem;}
		.product-parts-ttl {font-size: 18rem;}
		.product-dots-list,
		.product-spec {font-size: 15rem;}
		.product-parts-img img {width: 90%;}
		.spec-outer {
			overflow: scroll;
			margin-top: 24rem;
			padding-bottom: 20rem;
			width: 100%;
		}
		.inner-tbl {
			margin: 6rem 3rem;
			width: 100%;
		}
		.product-spec .inner-tbl .gray {
			font-size: 13rem;
			line-height: 1.45;
		}
		.modal-product-notice {
			margin-top: 12rem;
			font-size: 12rem;
		}
		.modal-product-notice + .product2-notice {margin-top: 20rem;}
		.product2-notice {font-size: 12rem;line-height: 1.34;}

		.modal-buy {
			margin-top: 50rem;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
		}
		.modal-buy-txt {font-size: 20rem;}
		.modal-buy-date {font-size: 16rem;}
		.modal-buy .product-btn {
			margin: 16rem 0 0;
		}
		.modal-buy .product-btn:not(.btn1) {
			width: 170rem;
			height: 44rem;
		}
		.close-btn {
			width: 160rem;
			height: 30rem;
			font-size: 11rem;
		}
		.close-btn .oswald {font-size: 18rem;}
	}

	/* tab & pc */
	@media (min-width: 768px) {
		.modal-content-inner {padding: 40rem 36rem 80rem;}
		.modal-product-main .product-sub {font-size: 18rem;}
		.modal .product-name-img {
			margin-top: 10rem;
		}

		.product-points-item {font-size: 18rem;}

		.product-parts-ttl {font-size: 20rem;}
		.product-dots-list,
		.product-spec {font-size: 15rem;}

		.product-set.size {padding-bottom: 30rem;}
		.inner-tbl {
			margin: 4rem;
			width: 250rem;
		}
		.product-spec .inner-tbl .gray {
			font-size: 13rem;
			line-height: 1.45;
		}
		.product-parts-img img {width: 350rem;}
		.spec-notice li {font-size: 12rem;}
		.modal-product-notice {font-size: 12rem;}

		.modal-buy {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			column-gap: 10rem;
			margin: 100rem auto 0;
		}
		.modal-buy-txt {font-size: 20rem;}
		.modal-buy .product-btn {
			margin-top: 20rem;
			width: 195rem;
		}
		.close-btn {
			width: 100rem;
			height: 30rem;
			font-size: 11rem;
		}
		.close-btn .oswald {font-size: 18rem;}

		.product-set-txt {font-size: 15rem;}
		.product2-notice {font-size: 12rem;}
		
		.modal,
		.modal-viewer {width: 920rem;}
		.modal-viewer .pc-2col {
			display: flex;
			justify-content: space-between;
		}
		.modal-viewer .pc-2col > * {
			width: 400rem;
		}
		.product-dots-list {min-height: 150rem;}
		.FA23112UL .product-dots-list,
		.BT23211UL .product-dots-list {min-height: 150rem;}
		.product-spec-add {font-size: 15rem;}

		/* tab */
		@media (max-width: 1024px) {
			.modal,
			.modal-viewer {
				height: auto;
				max-height: calc(100vh - 120rem);
			}
		}
		/* pc */
		@media (min-width: 1025px) {
			.modal,
			.modal-viewer {
				max-height: 650rem;
			}
		}
	}
}


/* Font change */
@media all {
	.spec-notice > li > span,
	.modal-product-notice > li > span,
	sub {font-family: sans-serif;}
	
}

/* .template */
@media all {
	
	/* sp */
	@media only screen and (max-width: 767px) {}

	/* pc & tab */
	@media (min-width: 768px) {
		/* wide */
		@media (min-width: 1600px) {}
	}
}





/* Amazon非表示（後日削除） */
@media all {
	.amazon {display: none!important;}
	
	/* sp */
	@media only screen and (max-width: 767px) {}

	/* pc & tab */
	@media (min-width: 768px) {
		.product-item.sith-1 {
			margin-top: 80rem;
			padding-top: 90rem;
		}
		.sith-2 .product-det {margin-top: 90rem;}
		.product-item.way-1 {padding-top: 100rem;}
		.way-1 .product-det {margin-top: 70rem;}
		.way-2 .product-det {margin-top: 90rem;}
		/* wide */
		@media (min-width: 1600px) {}
	}
}