:root {
	--text-color: #222;
	--bg-color: #fffcff;
	--text-color-b: #222;
	--text-color-w: #fffcff;
	--text-color-r: #ff0000;
	--bg-color-b: #222;
	--bg-color-w: #fffcff;
	--bg-color-r: #ff0000;
	/* mobile 320px */
	--site-inner-width: 320px;
	/* mobile 8px 12px 16px 20px */
	--font-size-small: 8px;
	--font-size-default: 12px;
	--font-size-headline: 16px;
	--font-size-large: 20px;
	--font-size-xlarge: 32px;
	--font-size-cover-title: 1rem;

	--menu-height: 32px;
	--menu-font-size: 12px;
	--header-mergin: 40px;

	--svg-width: 120px;
	--svg-min-width: 120px;
	--svg-max-width: 120px;
}

@media screen and (min-width: 480px) {
	:root {
		/* mobile 640px */
		--site-inner-width: 480px;
		/* tablet 8px 14px 20px 26px*/
		--font-size-small: 8px;
		--font-size-default: 14px;
		--font-size-headline: 20px;
		--font-size-large: 26px;
		--font-size-xlarge: 40px;
		--font-size-cover-title: 1.5rem;

		--menu-height: 40px;
		--menu-font-size: 14px;
		--header-mergin: 48px;
	}
}

@media screen and (min-width: 640px) {
	:root {
		/* mobile 640px */
		--site-inner-width: 640px;
		/* tablet 8px 14px 20px 26px*/
		--font-size-small: 8px;
		--font-size-default: 14px;
		--font-size-headline: 20px;
		--font-size-large: 26px;
		--font-size-xlarge: 40px;
		--font-size-cover-title: 2rem;

		--menu-height: 40px;
		--menu-font-size: 14px;
		--header-mergin: 48px;
	}
}

@media screen and (min-width: 1024px) {
	:root {
		/* desktop 960px */
		--site-inner-width: 960px;
		/* desktop 8px 16px 24px 32px*/
		--font-size-small: 8px;
		--font-size-default: 16px;
		--font-size-headline: 24px;
		--font-size-large: 32px;
		--font-size-xlarge: 48px;
		--font-size-cover-title: 3rem;

		--menu-height: 48px;
		--menu-font-size: 16px;
		--header-mergin: 56px;
	}
}

body {
	font-size: var(--font-size-default);
}

.text-default {
	font-size: var(--font-size-small);
}
.text-small {
	font-size: var(--font-size-small);
}
.text-headline {
	font-size: var(--font-size-headline);
}
.text-large {
	font-size: var(--font-size-large);
}

html {
	overflow: auto;
}
body {
	color: var(--text-color-w);
	background: var(--bg-color-r);
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	/**/
	font-feature-settings: "palt";
	letter-spacing: -0.01em;
	text-align: justify;
	text-justify: inter-ideograph;
	word-break: break-word;
	line-break: strict;
	table-layout: fixed;
	overflow-wrap: break-word;
	word-wrap: break-word;
	/**/
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
}

a,
a:hover,
a:focus {
	color: #222222;
}

img {
	max-width: 100%;
}

hr {
	height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-top: 1px solid #ccc;
}

body {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 100%;
	min-width: 100%;
	height: 100vh;
	max-height: 100vh;
	min-height: 100vh;
}

p,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
figure {
	margin-block: 0;
	margin-inline: 0;
	padding-block: 0;
	padding-inline: 0;
}

.site-main {
	min-width: 320px;

	color: var(--text-color-b);
	background: var(--bg-color-w);
}
.site-header {
	width: var(--site-inner-width);
	margin: auto;
	padding: 0 1rem;
	min-width: 320px;
	padding-top: var(--header-mergin);

	color: var(--text-color-w);
}
.sticky-wrapper {
	position: fixed;
	width: 100%;
	height: var(--menu-height);
	background: var(--bg-color-r);
	align-content: center;
}
.sticky-wrapper-wrapper {
	display: flex;
	justify-content: start;
}
.site-header-sticky {
}

.site-header-inner {
	padding: 1rem 0;

	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	grid-template-areas:
		"area-title"
		"area-svg";
}
@media screen and (min-width: 640px) {
	.site-header-inner {
		padding: 1rem 0;

		display: grid;
		grid-template-columns: auto;
		grid-template-rows: auto;
		grid-template-areas: "area-title area-svg";
	}
}

.site-branding {
	grid-area: area-title;
}
.site-branding a,
.site-branding a:hover,
.site-branding a:focus {
	color: var(--text-color-w);
	text-decoration: none;
}
.site-title {
	font-size: var(--font-size-large);
	font-weight: 900;
}
.site-catch {
	font-size: var(--font-size-default);
	font-weight: 700;
}
.site-catch span {
	display: inline-block;
}
.site-navigation {
}
.site-menu {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.site-menu a,
.site-menu a:hover,
.site-menu a:focus {
	color: var(--text-color-w);
}
.site-menu ul {
	text-align: right;
	line-height: 1;
}
.site-menu li {
	font-size: var(--menu-font-size);
	font-weight: 700;
	display: inline-block;
	list-style: none;
	margin-left: 1rem;
}
.page-item {
}
.current-page {
}
.page_item {
}
.page-item-2 {
}
.site-header-svg-wrapper {
	grid-area: area-svg;
	justify-self: end;
	margin-top: 1rem;
}
.site-header-svg-logo {
	justify-self: end;
	width: var(--svg-width);
	min-width: var(--svg-min-width);
	max-width: var(--svg-max-width);
}
.site-header-svg-ultraman {
	justify-self: end;
	width: var(--svg-width);
	min-width: var(--svg-min-width);
	max-width: var(--svg-max-width);
	color: var(--text-color-b);
}
@media screen and (min-width: 640px) {
	.site-header-svg-wrapper {
		margin-top: 0;
	}
}

.site-main {
}
.cover,
.article {
	width: var(--site-inner-width);
	margin: auto;
	padding: 0 1rem 4rem 1rem;
	min-width: 320px;

	background-color: var(--bg-color-w);
	color: var(--text-color-b);
}
.cover-header-container {
	padding: 4rem 0;
}
.cover-header {
	grid-area: area-header;
	align-self: center;
}
.cover-title {
	text-align: center;
}
.cover-title span {
	display: inline-block;
}
h1.cover-title {
	font-size: var(--font-size-cover-title);
	font-weight: 900;
	padding-bottom: 1rem;
	border-bottom: var(--text-color-b);
	border-bottom-width: 1px;
	border-bottom-style: solid;
}
.cover-catch {
	text-align: center;
}
.cover-catch span {
	display: inline-block;
}
h2.cover-catch {
	font-size: var(--font-size-default);
	font-weight: 700;
	margin-top: 1rem;
}

.cover-svg {
	grid-area: area-svg;
	padding: 1rem;
}
.cover-svg svg {
	height: fit-content;
}
.cover-container {
}
.cover-content {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: auto;
	grid-template-areas:
		"area-item-A area-item-A area-item-A area-item-A area-item-A"
		"area-item-B area-item-B area-item-B area-item-B area-item-B"
		"area-item-C area-item-C area-item-C area-item-C area-item-C";
	row-gap: 2rem;
}
.cover-item-1 {
	grid-area: area-item-A;
}
.cover-item-2 {
	grid-area: area-item-B;
}
.cover-item-3 {
	grid-area: area-item-C;
}
.cover-item-cap {
	background-color: var(--bg-color-b);
	color: var(--text-color-w);
	width: fit-content;
	padding: 0 0.5rem;
}

.article-container {
	padding-top: 4rem;
}
#about .article-content {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: auto;
	grid-template-areas:
		"area-heading-about area-heading-about area-heading-about area-heading-about area-heading-about"
		"area-item-A area-item-A area-item-A area-item-A area-item-A"
		". . area-dot-A . ."
		"area-item-B area-item-B area-item-B area-item-B area-item-B"
		". . area-dot-B . ."
		"area-item-C area-item-C area-item-C area-item-C area-item-C"
		". . area-dot-C . ."
		"area-item-D area-item-D area-item-D area-item-D area-item-D";
	row-gap: 2rem;
}

#seller .article-content {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: auto;
	grid-template-areas:
		"area-heading-A area-heading-A area-heading-A area-heading-A area-heading-A"
		"area-notice-A area-notice-A area-notice-A area-notice-A area-notice-A"
		"area-item-A area-item-A area-item-A area-item-A area-item-A"
		". . area-dot-A . ."
		"area-item-B area-item-B area-item-B area-item-B area-item-B"
		". . area-dot-B . ."
		"area-item-C area-item-C area-item-C area-item-C area-item-C"
		". . area-dot-C . ."
		"area-item-D area-item-D area-item-D area-item-D area-item-D"
		"area-heading-B area-heading-B area-heading-B area-heading-B area-heading-B"
		"area-wrapper-release area-wrapper-release area-wrapper-release area-wrapper-release area-wrapper-release"
		"area-heading-C area-heading-C area-heading-C area-heading-C area-heading-C"
		"area-wrapper-customer area-wrapper-customer area-wrapper-customer area-wrapper-customer area-wrapper-customer";
	row-gap: 2rem;
}
@media screen and (min-width: 640px) {
	#about .article-item-1,
	#about .article-item-2,
	#about .article-item-3,
	#about .article-item-4,
	#seller .article-item-1 {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
		grid-template-rows: auto;
		grid-template-areas:
			"area-title area-title area-title area-title area-title"
			"area-image area-image area-text area-text area-text";
	}
	#about div[class^="article-item-"] .article-item-title,
	#seller .article-item-1 .article-item-title {
		grid-area: area-title;
	}
	#about div[class^="article-item-"] .article-item-image-wrapper,
	#seller .article-item-1 .article-item-image-wrapper {
		grid-area: area-image;
	}
	#about div[class^="article-item-"] .article-item-text-wrapper,
	#seller .article-item-1 .article-item-text-wrapper {
		grid-area: area-text;
		padding-top: 0;
		padding-left: 2rem;
	}
	#about div[class^="article-item-"] .article-item-cap,
	#seller .article-item-1 .article-item-cap {
		justify-self: start;
	}
}

#about .article-heading,
#seller .article-heading {
	background-color: var(--bg-color-b);
	color: var(--text-color-w);
	font-size: var(--font-size-large);
	font-weight: 900;
	padding: 0 0.5rem;
}
#about .article-heading-about {
	grid-area: area-heading-about;
}
#seller .article-heading-A {
	grid-area: area-heading-A;
}
#seller .article-heading-A-notice {
	grid-area: area-notice-A;
}
#seller .article-heading-B {
	grid-area: area-heading-B;
	margin-top: 2rem;
}
#seller .article-heading-C {
	grid-area: area-heading-C;
	margin-top: 2rem;
}
#seller .wrapper-release {
	grid-area: area-wrapper-release;
}
#seller .wrapper-customer {
	grid-area: area-wrapper-customer;
}
.article-item-1 {
	grid-area: area-item-A;
}
.article-item-2 {
	grid-area: area-item-B;
}
.article-item-3 {
	grid-area: area-item-C;
}
.article-item-4 {
	grid-area: area-item-D;
}
.article-divider {
	content: "●";
	text-align: center;
	padding: 1rem;
}
.article-divider-A {
	grid-area: area-dot-A;
}
.article-divider-B {
	grid-area: area-dot-B;
}
.article-divider-C {
	grid-area: area-dot-C;
}
.article-item-title {
	font-size: var(--font-size-headline);
	font-weight: 900;
	padding-bottom: 1rem;
	letter-spacing: -0.05rem;
}
.article-item-cap {
	width: 75%;
	padding: 0.2rem 0 1rem 0;
	justify-self: end;
}
.article-item-text-wrapper {
	padding-top: 1rem;
}
.article-item-text {
	line-height: 1.75;
}
.article-item-data-mark {
	background-color: var(--bg-color-b);
	color: var(--text-color-w);
	width: fit-content;
	margin-top: 0.5rem;
	padding: 0 0.2rem;
}
.article-item-data {
	font-weight: 700;
}
.article-item-title span,
.article-item-cap span,
.article-item-text span {
	display: inline-block;
}

.image-size-large {
}
.cover-headline {
}
.headline {
}
.copyright {
	padding-top: 4rem;
}
.copyright div {
	padding-bottom: 1rem;
}
.copyright div:last-child {
	padding-bottom: 0;
}
.site-footer {
	width: var(--site-inner-width);
	margin: auto;
	padding: 0 1rem;
	min-width: 320px;
}
.site-info {
	height: 6rem;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.site-info a,
.site-info a:hover,
.site-info a:focus {
	color: var(--text-color-w);
}
.site-info ul {
	text-align: left;
}
.site-info li {
	display: inline-block;
	list-style: none;
}
.site-info {
}
.util {
}