@charset "UTF-8";

:where(:root) {
	--color-body-1: #333333;
	--color-theme-pink: #cb006b;
	--color-theme-blue: #1c9dd4;

	--gothic: YakuHanJP, "Noto Sans JP", sans-serif;
	--ls: 0.1em;
	--op: 0.6;
	--ts: 0.3s;

	--container: 1040px;
	--padding: 20px;
	--stack: 70px;

	overflow-wrap: anywhere;
	line-break: strict;
}

:where(*,::before,::after) {
	--font-size: calc((var(--fs) / 16) * 1rem);
	font-size: var(--font-size);
}

:where(b, strong, span, i, em, a, mark, ::before, ::after) {
	font-size: inherit;
}

.editor-styles-wrapper {
	color: var(--color-body-1);
	font-size: var(--font-size);
	font-family: var(--gothic);
}

:where(.editor-styles-wrapper .wp-block-column),
:where(.editor-styles-wrapper .wp-block-group) {
	border: 1px dashed gray;
}

.container {
	padding-inline: var(--padding);
	max-width: calc(var(--padding) * 2 + var(--container));
}

.stack {
	padding-block: var(--stack);
}

.stack-top {
	padding-top: var(--stack);
}

.stack-bottom {
	padding-bottom: var(--stack);
}

.bg-pink{
	background-color: var(--color-theme-pink);
}

.bg-blue{
	background-color: var(--color-theme-blue);
}

.bg-pink_blue{
    background: linear-gradient(90deg, 
    	var(--color-theme-pink) 0%, 
    	var(--color-theme-pink) 50%, 
    	var(--color-theme-blue) 50%, 
    	var(--color-theme-blue) 100%
    );
}

.bg-gray{
	background-color: var(--color-body-1);
}

.text-blue{
	color: var(--color-theme-blue);
}

h2:where(.wp-block-heading) {
	--fs: 30;
	font-size: var(--font-size);
}

h3:where(.wp-block-heading) {
	--fs: 25;
	font-size: var(--font-size);
}

h4:where(.wp-block-heading) {
	--fs: 20;
	font-size: var(--font-size);
}

h5:where(.wp-block-heading) {
	--fs: 18;
	font-size: var(--font-size);
}

h6:where(.wp-block-heading) {
	--fs: 16;
	font-size: var(--font-size);
}


@media (max-width: 991px) {
	:where(:root) {
		--stack: 50px;
	}
}

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

@media (max-width: 575px) {
}
