@charset "UTF-8";

/* --------------------------------------------------
    COMMON
-------------------------------------------------- */
html {
	overflow-x: hidden;
}

body,
p {
	line-height: 1.8rem !important;
}

.border {
	border-width: 2px !important;
}

.bg-lightblue {
	background: #fff;
}

/* 半円背景各種
-------------------------------------------------- */
/* 半月（背景白） */
.half-white:after {
	background-color: #0c2b5f;
	}
	
	/* 半月（背景薄青） */
	.half-lightblue:after {
		background: #0c2b5f;
	}
	
	/* 半月（） */
	.half-info:after {
		background: #0c2b5f;
	};


/* 半月（背景薄青） */
.half-lightblue:after {
	background: #0c2b5f;
}

/* 半月（） */
.half-info:after {
	background: #eeccd7;
	;
}

/* 共通 */
.half {
	width: 120% !important;
	height: 150px !important;
	border-top-left-radius: 100% 120px !important;
	border-top-right-radius: 100% 120px !important;
	position: absolute !important;
	top: 0 !important;
	left: -10% !important;
}

.half:after {
	content: ' ' !important;
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	top: 0 !important;
	bottom: 0 !important;
	z-index: -1 !important;
}

.font-weight-bold {
	color: #0c2b5f !important;
}

/* 見出し丸
-------------------------------------------------- */
.dot {
	padding-left: 1.5rem !important;
	padding-right: 1.5rem !important;
}

.dot:before,
.dot:after {
	font-family: "Font Awesome 5 Free";
	/*忘れずに*/
	content: "\f111";
	/*アイコンのユニコード*/
	font-size: 1.2rem;
	/*サイズ*/
	color:#edbede (311 27% 4%);
	padding: 0 10px;
	vertical-align: middle;
}


.dot:before,
.dot:after {
	font-family: "Font Awesome 5 Free";
	/*忘れずに*/
	content: "";
	/*アイコンのユニコード*/
	font-size: 1.2rem;
	/*サイズ*/
	padding: 0 10px;
	vertical-align: middle;
}


/* --------------------------------------------------
    header
-------------------------------------------------- */

header.container-fluid {
	width: 100%;
	background-size: cover;
	background-position: 50% 100%;
}


/* PC用コーディング */
.header5 img{
	width: 100% !important;
}

.zen-maru-gothic-regular {
	font-family: "Zen Maru Gothic", serif;
	font-weight: 400;
	font-style: normal;
	color: #F9F9F9;
}

header h1 {
	position: absolute;
	top: 0.5em;
	z-index: 1;
	left: 0.5em;
	font-size: 3.5vw;
}


  
.logo {
	height: 120px;
	
}

.logo image {
	width: 500px;

}

.hanen {
	height: 84px;
}

.footerlogo-img {
	max-width: 80%;
	height: auto;
	display: block;
	margin: 20px auto;
	padding-top: 20px;
	width: 200px;
}


/* Please ❤ this if you like it! */


@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap');

.section-center {
	position: absolute;
	top: 50%;
	left: 0;
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
	z-index: 6;
	text-align: center;
	transform: translateY(-50%);
}

[type="checkbox"]:checked,
[type="checkbox"]:not(:checked) {
	position: absolute;
	left: -9999px;
}

.menu-icon:checked+label,
.menu-icon:not(:checked)+label {
	position: fixed;
	top: 63px;
	right: 75px;
	display: block;
	width: 50px;
	height: 30px;
	padding: 0;
	margin: 0;
	cursor: pointer;
	z-index: 10;
}

.menu-icon:checked+label:before,
.menu-icon:not(:checked)+label:before {
	position: fixed;
	content: '';
	display: block;
	width: 50px;
	height: 40px;
	z-index: 20;
	right: 80px;
	bottom: 50px;
	border-top: 3px solid #0c2b5f;
	border-bottom: 3px solid #0c2b5f;
	transition: border-width 100ms 1500ms ease,
		top 100ms 1600ms cubic-bezier(0.23, 1, 0.32, 1),
		height 100ms 1600ms cubic-bezier(0.23, 1, 0.32, 1),
		background-color 200ms ease,
		transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

.menu-icon:checked+label:after,
.menu-icon:not(:checked)+label:after {
	position: fixed;
	content: '';
	display: block;
	width: 50px;
	height: 3px;
	z-index: 20;
	right: 80px;
	bottom: 70px;
	background-color: #0c2b5f;
	margin-top: -1px;
	transition: width 100ms 1750ms ease,
		right 100ms 1750ms ease,
		margin-top 100ms ease,
		transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

.menu-icon:checked+label:before {
	right: 55px;
	bottom: 70px;
	transform: rotate(45deg);
	height: 3px;
	background-color: #0c2b5f;
	border-width: 0;
	transition: border-width 100ms 340ms ease,
		top 100ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
		height 100ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
		background-color 200ms 500ms ease,
		transform 200ms 1700ms cubic-bezier(0.23, 1, 0.32, 1);
}

.menu-icon:checked+label:after {
	width: 50px;
	margin-top: 0;
	right: 55px;
	transform: rotate(-45deg);
	transition: width 100ms ease,
		right 100ms ease,
		margin-top 100ms 500ms ease,
		transform 200ms 1700ms cubic-bezier(0.23, 1, 0.32, 1);
}

.nav {
	position: fixed;

	right: 50px;
	bottom: 20px;
	display: block;

	width: 120px;
	height: 120px;
	padding: 0px;
	margin: 0;
	z-index: 9;
	overflow: hidden;
	box-shadow: 0 5px 10px 0;
	background-color: #edbede;
	animation: border-transform 7s linear infinite;
	transition: top 350ms 1100ms cubic-bezier(0.23, 1, 0.32, 1),
		right 350ms 1100ms cubic-bezier(0.23, 1, 0.32, 1),
		transform 250ms 1100ms ease,
		width 650ms 400ms cubic-bezier(0.23, 1, 0.32, 1),
		height 650ms 400ms cubic-bezier(0.23, 1, 0.32, 1);
}

@keyframes border-transform {

	0%,
	100% {
		border-radius: 63% 37% 54% 46% / 55% 48% 52% 45%;
	}

	14% {
		border-radius: 40% 60% 54% 46% / 49% 60% 40% 51%;
	}

	28% {
		border-radius: 54% 46% 38% 62% / 49% 70% 30% 51%;
	}

	42% {
		border-radius: 61% 39% 55% 45% / 61% 38% 62% 39%;
	}

	56% {
		border-radius: 61% 39% 67% 33% / 70% 50% 50% 30%;
	}

	70% {
		border-radius: 50% 50% 34% 66% / 56% 68% 32% 44%;
	}

	84% {
		border-radius: 46% 54% 50% 50% / 35% 61% 39% 65%;
	}
}

.menu-icon:checked~.nav {
	animation-play-state: paused;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%);
	width: 100%;
	height: 50%;
	transition: top 350ms 700ms cubic-bezier(0.23, 1, 0.32, 1),
		right 350ms 700ms cubic-bezier(0.23, 1, 0.32, 1),
		transform 250ms 700ms ease,
		width 750ms 1000ms cubic-bezier(0.23, 1, 0.32, 1),
		height 750ms 1000ms cubic-bezier(0.23, 1, 0.32, 1);
}




.nav ul {
	position: absolute;
	top: 50%;
	left: 0;
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
	z-index: 6;
	text-align: center;
	transform: translateY(-50%);
	list-style: none;
}

.nav ul li {
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	margin: 10px 0;
	text-align: center;
	list-style: none;
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	transform: translateY(30px);
	transition: all 250ms linear;
}

.nav ul li:nth-child(1) {
	transition-delay: 200ms;
}

.nav ul li:nth-child(2) {
	transition-delay: 150ms;
}

.nav ul li:nth-child(3) {
	transition-delay: 100ms;
}

.nav ul li:nth-child(4) {
	transition-delay: 50ms;
}

.nav ul li a {
	font-family: 'Montserrat', sans-serif;
	font-size: 25px;
	text-transform: uppercase;
	line-height: 1.2;
	font-weight: 700;
	display: inline-block;
	position: relative;
	color: #0c2b5f;
	transition: all 250ms linear;
}

.menu-icon:checked~.nav ul li {
	pointer-events: auto;
	visibility: visible;
	opacity: 5;
	transform: translateY(0);
	transition: opacity 350ms ease,
		transform 250ms ease;
}

.menu-icon:checked~.nav ul li:nth-child(1) {
	transition-delay: 1400ms;
}

.menu-icon:checked~.nav ul li:nth-child(2) {
	transition-delay: 1480ms;
}

.menu-icon:checked~.nav ul li:nth-child(3) {
	transition-delay: 1560ms;
}

.menu-icon:checked~.nav ul li:nth-child(4) {
	transition-delay: 1640ms;
}






@media screen and (max-width: 991px) {

	.menu-icon:checked+label,
	.menu-icon:not(:checked)+label {
		right: 55px;
	}

	.nav {
		right: 45px;
	}

	.nav li {
		font-size: 10px;
	}

	.nav ul li a {
		font-size: 20px;
	}
}





/*    グローバルナビ
-------------------------------------------------- */
.breadcrumb {
	background: transparent;
}

.breadcrumb-item+.breadcrumb-item::before {
	content: '>';
	color: #fff;
}

/* --------------------------------------------------
    トップページ
-------------------------------------------------- */

.balloon {
	width: 130px;
	height: 130px;
	top: -50px;
	z-index: 10;
	left: -20px;
	font-size: 15px;
}

.balloon-s {
	width: 110px;
	height: 110px;
	top: -20px;
	z-index: 10;
	left: -20px;
	font-size: 14px;
}

.balloon:before,
.balloon-s:before {
	content: "";
	position: absolute;
	bottom: -5px;
	right: -5px;
	margin-top: -15px;
	border: 10px solid transparent;
	z-index: 0;
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}


.button-55 {
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 180px;
	line-height: 10px;
	position: relative;
	top: 10px;
	margin: 20px auto;
	padding: .9em 2em;
	border: none;
	border-radius: 25px;
	background-color: #bea5ef;
	color: #fff;
	font-weight: 600;
	font-size: 1em;
}


.button-55::after {
	width: 1.25em;
	height: 1.25em;
	margin-left: 8px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V11H19L18.9999 6.413L11.2071 14.2071L9.79289 12.7929L17.5849 5H13V3H21Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E");
	content: '';
}

.button-55:hover {
	background-color: #ceb5ff;
}

.bg_pattern {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: #ffffff;
	opacity: 0.4;
	z-index: -1;
}

.Polka {
	background-image: radial-gradient(#d2e8f1 2px, #ffffff 2px);
	background-size: 20px 20px;
	background-attachment: local;

}


table {
	width: 80%;
	border-collapse: collapse;
	max-width: 100%;
	text-align: center;

}

table tr {
	background-image: linear-gradient(40deg, #d2e8f1 0%, #bea5ef 74%);
}

table tr th {
	border: 1px solid #ffffff;
}

table thead th {
	border: 1px solid #fff;
}

table tbody td {
	border: 1px solid #fff;
}

.table_01 tbody th {
	color: #0c2b5f !important;
}

.table_01 tbody td {
	color: #fff !important;
}

.table_01 thead th {
	background-color: #0c2b5f;
	color: #fff;
}

/* 左右のmarginを個別に指定 */
table {
	margin-left: auto;
	margin-right: auto;
}


.table_design08 {
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
	margin-bottom: 20px;
	max-width: 900px;
	text-align: center;
}
.table_design08 th{
	font-size: 20px;
}

.table_design08 th,
.table_design08 td {
	border: 1px solid #d2e8f1;
	padding: 1em;
}

.table_design08 td {
	color: #0c2b5f;
}

.table_design08 thead th {
	background-color: #0c2b5f;
	color: #fff;
	border: 1px solid #0c2b5f;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
}

.table_design08 thead th:last-of-type {
	border-right: 1px solid #0c2b5f;
}

.table_design08 tbody th {
	color: #0c2b5f;
	font-weight: bold;
	text-align: center;
}


@media screen and (max-width: 768px) {
	.table_design08 {
		text-align: center;
	}

	.table_design08 thead {
		display: none;
	}

	.table_design08 thead text {
		float: left;
		width: calc(64px-100px);
	}

	.table_design08 th,
	.table_design08 td {
		display: block;
		border: 0;
		border-bottom: 1px solid #fff;
	}

	.table_design08 tbody th {
		background: #0c2b5f;
		color: #fff;
		font-size: large;
	}

	.table_design08 td::before {
		content: attr(data-label);
		color: #0c2b5f;
		font-weight: bold;
		display: inline-block;
		width: 20%;
		min-width: 4em;
	}

}

.button-54 {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 180px;
	height: 55px;
	margin: 0 auto;
	padding: .9em 3em .9em 2em;
	border: 2px solid #0c2b5f;
	border-radius: 25px;
	background-color: #fff;
	color: #0c2b5f;
	font-weight: bold;
	font-size: 1em;
}

.button-54::after {
	position: absolute;
	right: 2em;
	transform: translateY(-50%);
	transform-origin: left;
	width: 2em;
	height: .5em;
	background-color: #0c2b5f;
	clip-path: polygon(0 100%, 100% 100%, 70% 40%, 70% 90%, 0% 90%);
	content: '';
	transition: transform .3s;
}

.button-54:hover::after {
	transform: translateY(-50%) scaleX(1.4);
}

.button-20 {
	display: flex;
	z-index: 10;
	justify-content: center;
	align-items: center;
	width: 50px;
	height: 50px;
	right: 0px;
	left: -10px;
	border: none;
	transition: .8s;
	border-radius: 50%;
	background-color: #ceb5ff;
	opacity: .8;
}


.button-20-pagetop:hover {
	opacity: .8;
}

.button-56 {
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 180px;
	margin: 0 auto;
	padding: .9em 2em;
	border: none;
	border-radius: 25px;
	background-color: #bea5ef;
	color: #fff;
	font-weight: 600;
	font-size: 1em;
}

.button-56:hover {
	background-color: #ceb5ff;
}

.button-56::before {
	width: 1.25em;
	height: 1.25em;
	margin-right: 8px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM12.0606 11.6829L5.64722 6.2377L4.35278 7.7623L12.0731 14.3171L19.6544 7.75616L18.3456 6.24384L12.0606 11.6829Z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E");
	content: '';
}

.layer-img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 50px auto;
	width: 400px;
}


@media screen and (max-width: 600px) {
	.layer-img {
		max-width: 50%;
	}
}

.layer2-img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 50px auto;
	width: 400px;
}

@media screen and (max-width: 600px) {
	.layer2-img {
		max-width: 50%;
	}
}

.w-100 rounded {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 50px auto;
	width: 250px;
}

@media screen and (max-width: 600px) {
	.w-100 rounded {
		max-width: 80%;
	}
}



/* --------------------------------------------------
    料金ページ
-------------------------------------------------- */
.season {
	width: 70px;
	height: 70px;
	left: 10px;
	padding: 0.34em;
}

.season div {
	display: block;
	width: 100%;
	height: 100%;
	border: 1px dotted #fff;
}

.title {
	border-bottom: 2px solid #eeccd7;
}


.bg-info {
	background-color: #ceb5ffed !important;
}

.half-info:after {
	background: #ceb5fff7;
}

.half-lightblue:after {
	background: #ceb5fff7;
}

.half-white:after {
	background: #ceb5fff7;
}

.text-info {
	color: #0c2b5f !important;
}

.btn-danger {
	background-color: crimson !important;
	border-color: crimson !important;
}

.badge-info {
	background-color: crimson;
}

table_01 thead tr th {
	background-color: #eeccd7;
	font-size: 25px;
	text-align: center;

}

.table_01 caption {
	text-align: right;
}

.table_01 {
	max-width: 768px;

}

/* 上下左右のmarginを個別に指定 */
table_01 {
	margin-left: auto;
	margin-right: auto;
}

table_01 tbody tr {
	background-color: #ffffff;
	font-size: 20px;
}

table_01 {
	width: 600px;
	margin-bottom: 20px;
	border-collapse: collapse;
	border-spacing: 50px;
	text-align: center;

}

.table_01 th {
	height: 50px;
}

table_01 caption {
	overflow: hidden;
	text-align: right;
	font-size: large;
}

table_01 td :target {
	width: 60px;
	text-align: center;
}

table_01 td.learning {
	width: 200px;
}


 @media screen and (max-width: 768px){
	.table_01 thead tbody tr th {
		display: block;
	}
}

/*ーーーーーーーーーーーーーーーーーーーーーーー
main
*/
.h3,
h3 {
	font-size: 1.85rem !important;
}

.h5,
h5 {
	font-size: 1.25rem !important;
}

.h3,
mb-3 {
	color: #0c2b5f;
}