@charset "UTF-8";
/*
スタイル基本指定
720pxの画面表示を標準とする
*/

*,
*::before,
*::after {
	box-sizing: border-box;
}

/* スムーズスクロール
参考 https://schepp.dev/posts/smooth-scrolling-and-page-search/
 */
@keyframes smoothscroll1 {
	from, to { scroll-behavior: smooth; }
}
@keyframes smoothscroll2 {
	from, to { scroll-behavior: smooth; }
}

html {
	font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Segoe UI", "メイリオ", "Meiryo", sans-serif;
	animation: smoothscroll1 1s;
}
html:focus-within {
	scroll-behavior: smooth;
	animation: smoothscroll2 1s;
}

body {
	width: 100%;
	min-height: 100%;
	overflow-x: hidden;
	margin: 0;
	padding: 0;
	line-height: 1.5;
}

a {
	text-decoration: none;
	border: none;
}
a:link {
	color: #0066cc;
}
a:visited {
	color: #551a8b;
}
a:active {
	color: #ee0000;
}

p {
	margin: 0;
	padding: 0;
}

span {
	display: inline-block;
}

img,
picture {
	display: inline-block;
	border: none;
	margin: 0px;
	padding: 0px;
	width: 100%;
	vertical-align: bottom;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

input,
button,
textarea,
select {
  font: inherit;
}

header {
	display: block;
	width: 100%;
}

.container {
	width: 100%;
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 10px; /* IE */
	padding: 0 min(10px, calc(10% / 4.8)); /* 幅480px未満の画面で左右のパディングを縮小 */
}

.container-wide {
	max-width: 960px;
}

.container-narrow {
	max-width: 480px;
}

.mb-0 {
	margin-bottom: 0;
}
.mb-1 {
	margin-bottom: 10px;
}
.mb-2 {
	margin-bottom: 20px;
}
.mb-3 {
	margin-bottom: 30px;
}
.mb-4 {
	margin-bottom: 40px;
}
.mb-5 {
	margin-bottom: 50px;
}
.mb-6 {
	margin-bottom: 60px;
}
.mb-7 {
	margin-bottom: 70px;
}
.mb-8 {
	margin-bottom: 80px;
}
.mb-9 {
	margin-bottom: 90px;
}

h1 {
	margin: 0 auto;
	padding: 0;
	font-size: 2rem;
	font-weight: 700;
}

h2 {
	margin: 0 auto;
	padding: 0;
	font-size: 1.5rem;
	font-weight: 700;
}

h3 {
	margin: 0 auto 10px;
	padding: 0;
	font-size: 1.17rem;
	font-weight: 500;
}

h4 {
	margin: 0 auto 10px;
	padding: 0;
	font-size: 1rem;
	font-weight: 500;
}

hr {
	width: 100%;
	height: 1px;
	margin: 0;
	border: none; /* デフォルトのボーダーを消去 */
	border-top: 1px solid rgba(0, 0, 0, .46);
}

.title {
	text-align: center;
}
.title img {
	max-width: 369px; /* 画像実寸 */
	aspect-ratio: 369 / 58; /* 画像実寸 */
	margin-top: calc(10% / 3.69); /* 画像サイズに合わせて可変 */
	margin-bottom: calc(10% / 3.69); /* 画像サイズに合わせて可変 */
}

section h2 {
	padding-bottom: 20px;
	text-align: center;
}
section h2 img {
	max-width: 300px; /* 画像実寸 */
	aspect-ratio: 300 / 35; /* 画像実寸 */
}

section h3 {
	color:#faaf55;
}

.wrap-bg {
	padding-top: 20px;
	padding-bottom: 10px;
	background-color:#fff9ec;
}

.button {
	display: block;
	width: 80%;
	margin: 10px auto 0 auto;
	border-radius: 5px;
	border: none;
	background:#faaf55;
	font-size: 16px;
	line-height: 250%;
	text-align: center;
	font-weight: 500;
	color: #fff;
	cursor: pointer;
}

footer {
	display: block;
	width: 100%;
	/* background-color:#F8F8F8; */
	background-color: #faf8f6;
	padding-top: 50px;
}
footer nav {
	text-align: center;
	margin-bottom: 50px;
}
footer a {
	color:#000 !important;
}

.copy {
	margin-top: 30px;
	padding-bottom: 50px;
	text-align: center;
	font-size: 14px;
	color: rgba(0, 0, 0, .7) !important;
}

/* 全ページ共通 画面右下のナビ表示 */
.floating-nav {
	position: fixed;
	bottom: 0;
	right: 0;
	width: calc(42px + 42% / 4.8); /* 幅480pxより小さい画面で縮小 */
	max-width: 84px;
	z-index: 1;
}
.sodan {
	width: calc(66% / .84);
	padding-bottom: calc(12% / .84);
}
.sodan a {
	display: block;
	border-radius: 50%; /* 円形 */
}
.pagetop {
	width: calc(66% / .84);
	padding-bottom: calc(18% / .84);
}
.pagetop a {
	display: block;
	border-radius: 50%; /* 円形 */
}

/* 以下、ユーティリティクラス */

/* テキスト配置 */
.text-center {
	text-align: center !important;
}
.text-left {
	text-align: left !important;
}
.text-right {
	text-align: right !important;
}

.pre-line {
    white-space: pre-line !important;
}
.pre-wrap {
    white-space: pre-wrap !important;
}

.text-color-disabled {
	color: rgba(0, 0, 0, .4) !important;
}

.text-weight-bold {
	font-weight: 700 !important;
}
.text-weight-semibold {
	font-weight: 500 !important;
}
.text-weight-normal {
	font-weight: 400 !important;
}

/* 要素を一時的に非表示にするためのクラス */
.hide {
	visibility: hidden;
	opacity: 0;
}
.hideable {
	/* hideクラスで非表示にするかもしれない要素にトランジションを適用する */
	transition: visibility .3s ease-out, opacity .3s ease-out;
}

/* アニメーションを減らす設定のブラウザに対してアニメーション効果を低減 */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}