@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Noto+Serif+JP:wght@200..900&family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap');

/* Editor Reset
================================================== */
:where(.mce-content-body) *,
:where(.mce-content-body) ::before,
:where(.mce-content-body) ::after {
	box-sizing: border-box;
	border-style: solid;
	border-width: 0;
}

:where(.mce-content-body) ul,
:where(.mce-content-body) ol {
	padding: 0;
	list-style: none;
}

:where(.mce-content-body) dt {
	font-weight: bold;
}

:where(.mce-content-body) dd {
	margin-left: 0;
}

:where(.mce-content-body) hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
	border-top-width: 1px;
	margin: 0;
	clear: both;
	color: inherit;
}

:where(.mce-content-body) table {
	border-collapse: collapse;
}

:where(.mce-content-body) caption {
	text-align: left;
}

:where(.mce-content-body) td,
:where(.mce-content-body) th {
	vertical-align: top;
	padding: 0;
}

:where(.mce-content-body) th {
	text-align: left;
	font-weight: bold;
}

/* root / body
================================================== */
:root {
	--mainBlue  : #013894;
	--mainBlueHover: #2659b0;
	--mainRed   : #ad002d;
	--mainRedHover : #bf3156;
	--textBody  : #333333;
	--textLink  : #0066cc;
	--textAlert : #cc0000;
	--textGray  : #666666;
	--blackSmoke: #333333;
	--darkGray  : #4f4f4f;
	--gray      : #999999;
	--lightGray : #cccccc;
	--whiteSmoke: #f4f4f4;
	--rainbow   : linear-gradient(to right, #ff0000, #ffa500, #ffff00, #008800, #00ffff, #0000ff, #800080);
	--font10    : .625rem;
	--font11    : .6875rem;
	--font12    : .75rem;
	--font13    : .8125rem;
	--font14    : .875rem;
	--font15    : .9375rem;
	--font16    : 1rem;
	--font17    : 1.0625rem;
	--font18    : 1.125rem;
	--font20    : 1.25rem;
	--font22    : 1.375rem;
	--font24    : 1.5rem;
	--font26    : 1.625rem;
	--font28    : 1.75rem;
	--font30    : 1.875rem;
	--font32    : 2rem;
	--font34    : 2.125rem;
	--font36    : 2.25rem;
	--font38    : 2.375rem;
	--font40    : 2.5rem;
	--spacing   : 0;
	--spMargin  : 4.6875vw;
}

* {
	letter-spacing: var(--spacing);
}

body.mce-content-body {
	width: 1200px;
	max-width: calc(100% - 20px);
	margin: 0 auto;
	background-color: #fff;
	color: #333;
	font-size: 100%;
	font-size: var(--font16);
	font-family: 'Noto Sans JP', YuGothic, 'Yu Gothic Medium', 'Yu Gothic', sans-serif;
	line-height: 1.5;
}

body.mce-content-body section:not(:first-child) {
	margin-top: 60px;
}


/* content
================================================== */
h1,h2,h3,h4,h5,h6 {
	font-weight: 500;
	line-height: 1.5;
}

h1 {
	font-size: var(--font28);
}

h2 {
	margin: 60px 0 24px;
	padding-bottom: 4px;
	border-bottom: 4px solid;
	border-image: repeating-linear-gradient(-45deg, #e0e0e0 0 3px, #ccc 3px 6px) 1.5;
	font-size: var(--font24);
	position: relative;
}

h2::after {
	content: '';
	position: absolute;
	top: 100%;
	left: 0;
	width: 230px;
	max-width: 50%;
	border-bottom: 4px solid var(--mainRed);
}

h3 {
	margin: 32px 0 16px;
	font-size: var(--font20);
}

h4 {
	margin: 24px 0 16px;
	font-size: var(--font18);
}

h5 {
	margin: 20px 0 16px;
	font-size: var(--font17);
}

h6 {
	margin: 18px 0 16px;
	font-size: var(--font16);
}

h2:first-child,
h3:first-child,
h2 + h3 {
	margin-top: 0;
}

@media screen and (max-width: 767px) {
	h1 {
		font-size: var(--font24);
	}
	
	h2 {
		margin: 40px 0 24px;
		font-size: var(--font20);
	}
	
	h3 {
		margin: 24px 0 16px;
		font-size: var(--font18);
	}
	
	h4 {
		margin: 20px 0 16px;
		font-size: var(--font17);
	}
	
	h5 {
		margin: 18px 0 16px;
		font-size: var(--font16);
	}
}

p,
ol,
ul,
dl {
	margin-bottom: 1.25em;
	line-height: 2;
}

ol {
	list-style: decimal;
	padding-left: 2em;
}

ul {
	list-style: disc;
	padding-left: 1.5em;
}

li ul {
	list-style: circle;
}

li li ul {
	list-style: square;
}

li ol,
li ul {
	margin-bottom: 0;
}

dt {
	font-weight: 400;
}

dd + dt {
	margin-top: 1.125em;
}

strong {
	font-weight: 600;
}

.hanging {
	padding-left: 1em;
	text-indent: -1em;
}

a img.external {
	border: 0;
}

table {
	width: 100%;
	max-width: 100%;
	margin-bottom: 1.5em;
	border: 1px solid var(--gray);
}

table th,
table td {
	padding: 12px 16px;
	border: 1px solid var(--gray);
	vertical-align: top;
}

.mce-item-table {
	margin-top: 1em;
}

.mce-item-table,
.mce-item-table td,
.mce-item-table th {
	border: 1px solid var(--gray);
}

table.noborder,
table.noborder th,
table.noborder td {
	padding: 0 16px 1em 0;
	border: 0;
}

.mce-item-table.noborder,
.mce-item-table.noborder th,
.mce-item-table.noborder td {
	border: 1px dashed var(--lightGray);
}

table th {
	background-color: #e9ecf1;
	font-weight: 400;
}

table.monospace {
	table-layout: fixed;
}

table caption {
	margin-bottom: 5px;
	text-align: left;
}

table p:first-child,
table ol:first-child,
table ul:first-child,
table dl:first-child {
	margin-top: 0;
}

table p:last-child,
table ol:last-child,
table ul:last-child,
table dl:last-child,
table ol li:last-child {
	margin-bottom: 0;
}

hr {
	margin: 1.5em 0;
}

.alignleft {
	float: left;
	max-width: 50%;
	margin: .25em 15px 10px 0;
}

.alignright {
	float: right;
	max-width: 50%;
	margin: .25em 0 10px 15px;
}

.aligncenter {
	display: block;
	margin: 36px auto;
}

.alignnone {
	display: inline-block;
	margin-right: 10px;
}

.alignnone:last-child {
	margin-right: 0;
}

.wp-caption {
	max-width: 100%;
	text-align: center;
}

.wp-caption-dd 	/* TinyMCE */ {
	display: inline-block;
	margin-top: 5px;
	font-size: 87.5%;
	line-height: 1.25;
	text-align: left;
}

a + br[data-mce-bogus] /* TinyMCE */ {
	display: none;
}

.clearBoth {
	clear: both;
}

.clearLeft {
	clear: left;
}

.clearRight {
	clear: right;
}

@media screen and (max-width: 767px) {
	.alignleft,
	.alignright {
		float: none;
		display: block;
		max-width: 100%;
		margin: 0 0 1em;
	}

	.alignnone {
		margin-right: 0;
	}
}

blockquote {
	margin-bottom: 1em;
	padding: 0 1.5em;
	color: #666;
	position: relative;
}

blockquote:before,
blockquote:after {
	position: absolute;
	top: -0.25em;
	font-size: 200%;
	font-family: 'Hiragino Kaku Gothic ProN', Meiryo, 'MS PGothic', sans-serif;
}

blockquote:before {
	content: "“";
	left: 0;
}

blockquote:after {
	content: "”";
	right: 0;
}

.fileSize {
	font-size: 93.75%;
	white-space: nowrap;
}

.wp-embedded-content {
	max-width: 100%;
}

figcaption {
	font-size:var(--font13);
}

.wp-caption {
	max-width: 100%;
	text-align: center;
}

.wp-caption-dd 	/* TinyMCE */ {
	display: inline-block;
	margin-top: 5px;
	font-size: 87.5%;
	line-height: 1.25;
	text-align: left;
}

.columns {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 36px;
}

.columns .col > *:last-child {
	margin-bottom: 0;
}

.banner {
	margin: 48px 0;
	text-align: center;
}

.banner a {
	display: inline-block;
	padding: 16px 24px;
	border: 2px solid var(--mainRed);
	border-radius: 8px;
	color: var(--textBody);
	font-size: var(--font22);
	font-weight: 500;
	text-decoration: none;
}

.mce-content-body .banner a[data-mce-selected] {
	padding: 16px 24px;
	border-radius: 8px;
}

@media screen and (max-width: 767px) {
	.columns {
		grid-template-columns: 100%;
	}
	
	.banner {
		margin: 36px 0;
	}
	
	.banner a {
		padding: 12px 16px;
		font-size: var(--font20);
	}
}
