@charset "utf-8";

/*■■■■■■■■■■■■■■■■■■■■■■■■
　全ページ共通CSS
　■■■■■■■■■■■■■■■■■■■■■■■■*/

:root {
	--main-bg-color: #FBF4E4;
	--nav-bg-color: #FCEDCB;
	--btn-bg-color: #F16D75;
}

/* ■■■■■■ Reset ■■■■■■ */
address, caption, cite, code, dfn, em, i, th, strong, var {
	font-style: normal;
}

blockquote, dd, div, dl, dt, h1, h2, h3, h4, h5, h6, li, ol, p, pre, span, td, th, ul {
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}

ol, ul {
	list-style: none;
}

q:before, q:after {
	content: '';
}

figure {
	margin: 0;
}

img {
	display: block;
}

article, aside, canvas, details, figcaption, figure, header, footer, hgroup, menu, nav, section, summary, main {
	display: block;
}

article, aside, footer, header, hgroup, nav, section, main {
	position: relative;
}

html {
	width: 100%;
	font-size: 62.5%;
}



/* ■■■■■■ 共通 ■■■■■■ */
*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	margin: 0;
	padding: 0;
	position: relative;
	overflow-x: hidden;
	overflow-y: scroll;
	height: 100%;
	background: transparent !important;
}

body {
	background: #fff;
	position: relative;
	margin: 0;
	padding: 0;
	min-width: 320px;
	letter-spacing: 0;
	height: 100%;
	font-size: 1.7rem;
	font-weight: 400;
	line-height: 1.29;
	color: #000;
	word-wrap: break-word;
	overflow-wrap: break-word;
	text-align: justify;
	text-justify: inter-ideograph;
	font-family: 'Hiragino Maru Gothic StdN', "Hiragino Sans", 'Yu Gothic', 'メイリオ', sans-serif;
}

a {
	color: unset;
	text-decoration: none;
	-webkit-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-o-transition: all .5s linear;
	transition: all .5s linear;
}

a:hover {
	text-decoration: none;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	-o-transition: all .2s linear;
	transition: all .2s linear;
	opacity: 0.7;
}

a:hover img,
input[type="image"]:hover {
	filter: Alpha(opacity=70);
	opacity: .7;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	-o-transition: all .2s linear;
	transition: all .2s linear;
}

a img,
input[type="image"] {
	filter: ;
	opacity: 1;
	-webkit-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-o-transition: all .5s linear;
	transition: all .5s linear;
}

img {
	border: 0;
	-ms-interpolation-mode: bicubic;
	vertical-align: top;
	max-width: 100%;
	height: auto;
}

form {
	margin: 0;
	padding: 0;
}

input[type="checkbox"],
input[type="radio"] {
	vertical-align: middle;
}

.mincho {
	font-family: "ヒラギノ明朝 Pro W4", "Hiragino Mincho Pro", "HGS明朝B", "MingLiU", "SimSun", "ＭＳ Ｐ明朝", serif !important;
}

.times {
	font-family: Times, "Times New Roman", serif !important;
}

.ib {
	display: inline-block;
}


.inr {
	max-width: 1040px;
	padding: 0 5vw;
	margin: 0 auto;
}
@media screen and (max-width: 800px) {
	.pc {
		display:  none !important;
	}
}
@media screen and (min-width: 801px) {
	.inr {
		padding: 0 20px;
	}

	.smt {
		display: none !important;
	}
	main {
		margin-top: 210px;
	}
}

/* ■■■■■■ ローディング ■■■■■■ */
#loading {
	position: fixed;
	z-index: 9999;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: #fff;
	-webkit-transition: all 0.3s;
    transition: all 0.3s;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

#loading.loaded {
    opacity: 0;
    visibility: hidden;
}


/* ■■■■■■ アイコン ■■■■■■ */
.icon_external {
	padding-right: 40px;
	position: relative;
}

.icon_external::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	display: block;
	width: 20px;
	height: 20px;
	background: url(../../../lp-common/img/icon/icon_external.png) no-repeat;
	background-size: contain;
}


/* ■■■■■■ タイトル ■■■■■■ */
.c_ttl {
	font-size: 2.4rem;
	font-weight: 600;
	text-align: center;
}

.bg_ttl {
	font-size: 2.6rem;
	font-weight: 500;
	color: #fff;
	background-color: #A09F96;
	text-align: center;
	padding: 25px 10px;
}

.left_border_ttl {
	font-size: 2rem;
    line-height: 1.4;
    padding-left: 5px;
    border-left: 2px solid #E47E5E;
}

@media screen and (min-width: 801px) {
	.c_ttl {
		font-size: 2.6rem;
	}
}

/* ■■■■■■ ボタン ■■■■■■ */
.btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-right: 30px;
	width: 320px;
	max-width: 100%;
	height: 50px;
	border-radius: 25px;
	color: #fff;
	background: url(../../../lp-common/img/icon/icon_arrow_w.png) no-repeat;
	background-position:  right 25px center;
	background-size: 24px;
	background-color: var(--btn-bg-color);
	font-size: 1.7rem;
	transition: background-position 0.3s;
	cursor: pointer;
}

.btn:hover {
	background: url(../../../lp-common/img/icon/icon_arrow_w.png) no-repeat;
	background-position:  right 15px center;
	background-size: 24px;
	background-color: var(--btn-bg-color);
}
.btn.btn--green {
	color: #77C1A5;
	border: 2px solid #77C1A5;
	font-size: 1.6rem;
	width: auto;
	height: 40px;
	margin: 0 auto;
	background: url(../../../lp-common/img/icon/icon_arrow_g.png) no-repeat;
	background-position: right 25px center;
	background-size: 24px;
	background-color: #fff;
	font-weight: 400;
	display: inline-flex;
	padding: 0 60px 0 30px;
}

.btn.btn--green:hover {
	opacity: 0.7;
}

.simple_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 238px;
    max-width: 100%;
    height: 48px;
    border-radius: 24px;
	-webkit-border-radius: 24px; /* WebKit用のプレフィックス */
    -webkit-appearance: none; /* iOSデフォルトの外観をリセット */
    appearance: none;
    color: #fff;
	background-color: #E47E5E;
	border: none;
    font-size: 1.6rem;
    transition: background-position 0.3s;
    cursor: pointer;
	font-weight: 600;
}

.simple_btn.simple_btn--edging {
    color: #E47E5E;
	background-color: #fff;
	border: 2px solid #E47E5E;
}

.external_btn {
	min-width: 176px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #E47E5E;;
	border: 2px solid #E47E5E;
	border-radius: 25px;
	font-size: 1.6rem;
}

.external_btn span {
	position: relative;
	text-align: center;
	padding-right: 20px;
}

.external_btn span::after {
	content: "";
	position: absolute;
	top: 50%;
	right: -6%;
	transform: translateY(-50%);
	display: block;
	width: 20px;
	height: 20px;
	background: url(../../../lp-common/img/icon/icon_external.png) no-repeat;
	background-size: contain;
}



/* ■■■■■■ recruit_tag ■■■■■■ */
.recruit_tag {
	font-size: 1.6rem;
	color: #fff;
	min-width: 65px;
	height: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	border-radius: 10px;
	background-color: #21B927;
	line-height: 1;
}
 
.recruit_tag.recruit_tag--urgent {
	background-color: #EE6D79;
}

/* ■■■■■■ bnr_line ■■■■■■ */
.bnr_line {
	display: none;
}
@media screen and (min-width: 801px) {
	.bnr_line {
		display: block;
		width: 250px;
		position: fixed;
		right: 0;
		bottom: calc(10% + 100px);
		z-index: 1;
	}
}

/* ■■■■■■ ヘッダー ■■■■■■ */
.header_top {
	position: relative;
	background-color: var(--main-bg-color);
}

.header_top_inr {
	display: flex;
	align-items: center;
	justify-content:space-between;
	position: relative;
}

.header_top_logo {
	display: flex;
	align-items: flex-end;
	gap: min(2vw,10px);
}

.header_top_logo span {
	color: #707070;
	text-align: center;
	font-size: clamp(1rem, 3vw, 1.2rem);
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
    padding: 0em .7em;
	height: 21px;
	border: 1px solid #707070;
	background-color: #fff;
	border-radius: 6px;
}

.header_nav {
	background-color: var(--nav-bg-color);
	overflow-x: auto;
	margin-top: 100px;
}

.header_nav_inr {
	width: 1040px;
}

.header_nav_inr ul {
	display: flex;
	justify-content: space-between;
}

.header_nav_inr li {
	padding: 19px 0;
}

.header_nav_inr li a {
	display: block;
	font-size: min(2vw,1.9rem);
	line-height: 1.2;
	padding-left: 10px;
	width: 100%;
	height: 100%;
	border-left: 2px solid #E47E5E;
}

.header_catch {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background-color: #E47E5E;
	font-size: 2.2rem;
	font-weight: 600;
	text-align: center;
	height: 50px;
	transition: height 0.3s;
	overflow: hidden;
}

.scroll .header_catch {
	height: 0;
}

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

	.header_top .external_btn {
		display: none;
	}

	.header_top_inr {
		height: min(23vw,100px);
	}

	.header_top_logo_img {
		display: block;
		width: 62vw;
		max-width: 353px;
	}

	.header_top_logo_img img {
		vertical-align: bottom;
	}

	.header_nav {
		background: transparent;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 1000;
		margin-top: 0;
	}

	.header_nav_inr {
		background-color: #fff;
		width: 100%;
		padding: 0;
	}

	.header_nav_inr ul {
		gap: 4px;
	}

	.header_nav_inr li {
		padding: 0;
		background-color: #8E8C87;
	}

	.header_nav_inr li.header_nav_line {
		width: 23%;
		background: url(../../../lp-common/img/icon/icon_line.png) no-repeat center 18%;
        background-size: auto 33%;
		background-color: #4DC664;
	}

	.header_nav_inr li.header_nav_line a {
		font-size: min(3.3vw, 1.7rem);
        padding: 2.5em 0 .2em;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	li.header_nav_school {
		width: 43%;
	}

	li.header_nav_description {
		width: 34%;
	}

	.header_nav_inr li a {
		color: #fff;
		font-size: min(4.4vw, 1.9rem);
		text-align: center;
		border-left: none;
		padding-left: 0;
        padding: 1.37em 0;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.header_catch {
        font-size: min(4.8vw, 2rem);
		height: 60px;
	}


	@media screen and (max-width: 400px) {
		.header_top_logo_img {
			width: 57vw;
		}
	}

}

@media screen and (min-width: 801px) {

	.header {
		padding: 0;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 10;
	}

	.header_top_inr {
		height: 100px;
		padding: 10px 90px 10px 0;
		transition:  height 0.3s;
	}

	.header_nav_inr li {
		transition:  padding 0.3s;
	}

	.header_top_logo {
		gap: 10px;
	}

	.header_top_logo span {
		font-size: 1.8rem;
		width: 88px;
		height: 28px;
		padding: 0;
	}

	.header_nav {
		margin-top: 0;
	}

	.scroll .header_top_inr {
        height: 80px;
	}

	.scroll .header_nav_inr li {
		padding: 15px 0;
	}
}

/* ■■■■■■ フッター ■■■■■■ */
.footer {
	padding: 35px 0 25vw;
}

.footer .c_ttl {
	color: #A09F96;
	margin-bottom: 38px;
}

.local_preschool_ttl {
	font-size: 2rem;
	font-weight: 600;
	color: #707070;
	margin-bottom: 11px;
}

.local_preschool_list {
	margin-bottom: 40px;
	display: none;
}

.local_preschool_list li {

	margin-bottom: 30px;
}

.local_preschool_list li a {
	display: flex;
	align-items: center;
}

.local_preschool_img {
	width: 54%;
	border-radius: 10px;
	overflow: hidden;
}

.local_preschool_body {
	flex: 1;
	padding-left: 3%;
	text-align: justify;
}

.local_preschool_name {
	font: 1.8rem;
	color: #707070;
	display: inline-block;
	border-bottom: 2px solid #E47E5E;
	margin-bottom: 10px;
}

.local_preschool_address {
	font-size: 1.5rem;
	line-height: 1.33;
}

.local_preschool_img {
	width: 45%;
}

#pageTop {
    position: fixed;
    right: 3%;
    bottom: min(20vw, 90px);
    width: min(15vw, 70px);
    z-index: 1;
	transition: none;
}

@media screen and (min-width: 801px) {
	.footer {
		padding: 35px 0 35px;
	}

	.local_preschool {
		padding: 0 30px;
	}

	.local_preschool_list {
		display: none;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.local_preschool_list li {
		width: 49%;
	}

	.local_preschool_img {
		width: 45%;
	}
}

/* ■■■■■■ nursery_list ■■■■■■ */
.nursery_list {
	border-radius: 10px;
	border: 1px solid #DDDBD4;
}

.nursery_list_ttl {
	color: #707070;
	font-weight: 600;
	font-size: 2rem;
	padding: 20px 11% 20px 7%;
	cursor: pointer;
	position: relative;
	background-color: #F6F4ED;
	transition: background-color 0.6s;
}

.nursery_list_ttl.open {
    background-color: transparent;
	color: #E47E5E;
}

.nursery_list_ttl::after {
    content: "";
    content: "";
    position: absolute;
    top: 50%;
    right: 7%;
    width: 7px;
    height: 7px;
    border-bottom: 2px solid #95989A;
    border-right: 2px solid #95989A;
    transform: rotate(45deg) translateY(-50%);
    transition: transform 0.6s;
}

.nursery_list_ttl.open::after {
    border-color: #DDDBD4;
    transform: rotate(-135deg) translateY(-50%);
}

.nursery_list_block {
	display: none;
	padding: 25px 5% 20px 13%;
}

.nursery_list_block ul {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 22px 12%;
}

.nursery_list_block li {
	margin-bottom: 10px;
}

.nursery_list_block dl {
	display: flex;
	align-items: baseline;
}

.nursery_list_block dt {
	color: #707070;
	font-size: 1.8rem;
	line-height: 1.4;
	width: 95px;
	padding-left: 5px;
	border-left: 2px solid #E47E5E;
}

.nursery_list_block dd {
	font-size: 1.5rem;
	align-self: center;
}

.nursery_list_block dd a {
	display: block;
	text-decoration: underline;
	margin-bottom: 15px;
}

.nursery_list_block dd a:last-of-type {
	margin-bottom: 0;
}

@media screen and (min-width: 801px) {
	.nursery_list_ttl {
		padding: 20px 50px 20px 29px;
	}

	.nursery_list_ttl::after {
		right: 33px;
	}

	.nursery_list_block {
		padding: 20px 29px 20px 29px;
	}

	.nursery_list_block ul {
		height: 770px;
		gap: 32px 12%;
	}
}

/* ■■■■■■ メニュー ■■■■■■ */

.menu {
	display: block;
	width: 90vw;
	max-width: 400px;
	height: 100vh;
	background-color: #FBF4E3;
	position: fixed;
	top: 0;
	right: -100vw;
	z-index: 10;
	padding: min(23vw,100px) 0 0;
	transition: right 0.6s;
}

.open .menu {
	right: 0;
}

.menu_inr {
	overflow: auto;
	height: 100%;
	padding-bottom: 100px;
}

.menu_list {
	width: 88%;
	margin-left: auto;
	margin-bottom: 100px;
}

.menu_list li {
	border-top: 1px solid #fff;
}

.menu_list li:last-of-type {
	border-bottom: 1px solid #fff;
}

.menu_list li a {
	display: block;
	width: 100%;
	height: 100%;
	padding: 11px 0;
	font-size: 1.9rem;
}

.menu_list li a span {
	padding-left: 10px;
	border-left: 2px solid #E47E5E;
	line-height: 1.7;
}

.menu_contact {
	padding: 0 5%;
}

.menu_contact_ttl {
	font-size: 2.2rem;
	font-weight: 600;
	text-align: center;
}

.menu_contact_txt {
	font-size: 1.7rem;
	line-height: 1.29;
	text-align: center;
	margin-bottom: 30px;
}

.menu_contact .btn {
    width: 94%;
    height: 44px;
    margin: 0 auto;
}

/* ■■■■■■ ハンバーガー ■■■■■■ */
.hamburger {
	display: block;
	position: fixed;
	width: 48px;
    top:  clamp(10px, 5vw, 25px);
    right: 2vw;
	z-index: 11;
}

.hamburger_btn {
	cursor: pointer;
	width: 48px;
	height:48px;
	border-radius: 5px;
	transition: background .6s;
}

.hamburger_btn_inr {
	transition: all .6s;
	width:100%;
	height:100%;
}

.hamburger_btn span {
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 2px;
    border-radius: 2px;
	background-color: #172026;
    width: 20px;
  }

.hamburger_btn span:nth-of-type(1) {
  top:18px;
}

.hamburger_btn span:nth-of-type(2) {
  top:24px;
}

.hamburger_btn span:nth-of-type(3) {
  top:30px;
}

.scroll .hamburger .hamburger_btn {
	background:#EC6015;
}

.scroll .hamburger .hamburger_btn span {
	background-color: #fff;
}

.open .hamburger_btn {
	background:#EC6015;
}

.open .hamburger_btn .hamburger_btn_inr {
  transform: rotate(360deg);
}

.open .hamburger_btn span {
	background: #fff;
}

.open .hamburger_btn span:nth-of-type(1) {
    top: 18px;
    left: 13px;
    transform: translateY(6px) rotate(-45deg);
    width: 24px;
}

.open .hamburger_btn span:nth-of-type(2) {
  opacity: 0;
}

.open .hamburger_btn span:nth-of-type(3){
    top: 30px;
    left: 13px;
    transform: translateY(-6px) rotate(45deg);
    width: 24px;
}

@media screen and (min-width: 801px) {
	.hamburger {
		position: absolute;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
	}
}

/* ■■■■■■ modal ■■■■■■ */
body {
    overflow: initial !important; /* モーダルが開いてもスクロールを許可 */
}
.modal {
	max-width: 100vw;
	max-height: 90vh;
    overflow: scroll;
}

.iziModal ,
.iziModal .iziModal-wrap {
	border-radius: 10px !important;
    overflow: hidden;
}

.modal_inr {
	background-color: #FFFFFF;
	border-radius: 10px;
	padding: 30px 5vw;
	width: 940px;
	max-width: 100%;
}

.modal .close {
	display: block;
	background: #EC6015;
	cursor: pointer;
    width: 48px;
    height: 48px;
    border-radius: 5px;
	position: absolute;
	top: 10px;
	right: 10px;
}

.modal_close_inr {
	width: 100%;
    height: 100%;
	position: relative;
}

.modal_close span {
	display: block;
	position: absolute;
    background-color: #fff;
	height: 2px;
}

.modal_close span:nth-of-type(1) {
    top: 18px;
    left: 13px;
    transform: translateY(6px) rotate(-45deg);
    width: 24px;
}

.modal_close span:nth-of-type(2) {
    opacity: 0;
}

.modal_close span:nth-of-type(3) {
    top: 30px;
    left: 13px;
    transform: translateY(-6px) rotate(45deg);
    width: 24px;
}

.modal .left_border_ttl {
	margin-bottom: 30px;
	padding-right: 45px;
}

.modal_body {
	overflow: auto;
}

.modal_ttl {
	background-color: #FAE6DF;
	padding: 10px 10px;
	font-size: 1.9rem;
	font-weight: 600;
	text-align: center;
}

@media screen and (min-width: 801px) {
	.modal {
		max-width: 100%;
	}

	.modal .close {
		top: 20px;
		right: 20px;
	}

	.modal_inr {
		padding: 30px 30px;
	}
}

/* ■■■■■■ フォームパーツ ■■■■■■ */
input[type="tel"],
input[type="text"],
input[type="email "],
input[type="email"],
input[type="date"],
input[type="number"] {
	width: 100%;
	height: 60px;
	border: 1px solid #B4B7BB;
	border-radius: 6px;
	padding: 10px 20px;
	font-size: 1.6rem;
}

textarea  {
	width: 100%;
	border: 1px solid #B4B7BB;
	border-radius: 6px;
	padding: 18px 20px;
	font-size: 1.6rem;
	height: 60px;
	line-height: 1.4;
	resize: vertical;
}

input[type="date"] {
	appearance: none; /* ブラウザのデフォルトスタイルを無効化 */
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: white;
	color: #000;
	max-width: 260px;
	position: relative;
}

input[type="date"]::-webkit-date-and-time-value {
    text-align: left;
}

input[type="date"]::-webkit-calendar-picker-indicator {
	background: transparent;
	z-index: 1;
}

input[type="date"]::before {
	content: '';
	position: relative;
	background-image: url(../../../lp-common/img/icon/icon_calendar.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0;
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	z-index: 1;
}

select {
	width: 100%;
    height: 60px;
    border: 1px solid #B4B7BB;
    border-radius: 6px;
    padding: 10px 20px;
    font-size: 1.6rem;
	background-color: #fff;
	-webkit-appearance: none;
	appearance: none;
	/* デフォルトの矢印を非表示 */
}

select::-ms-expand {
	display: none;
	/* デフォルトの矢印を非表示(IE用) */
}

label {
	display: block;
}

::placeholder {
	color: #B4B7BB;
  }
/* 旧Edge対応 */
::-ms-input-placeholder {
	color: #B4B7BB;
}

input.form_size_s ,
.form_size_s {
	width: 65px;
}

.form_size_m {
	min-width: 260px;
}

.form_size_w100 {
	width: 100%;
}

.required {
    font-size: 1.3rem;
    color: #fff;
    background-color: #DF5341;
    border-radius: 4px;
	padding: 3px 5px;
	line-height: 1;
    margin-left: 10px;
    flex-shrink: 0;
}

/* ■■■■■■ セレクトボックス ■■■■■■ */
.selectBox {
    position: relative;
    width: 100%;
}

.selectBox::after {
	content: "";
	position: absolute;
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
	border: 0;
	border-top: solid 2px #CDD6DD;
	border-right: solid 2px #CDD6DD;
	display: inline-block;
	width: 5px;
	height: 5px;
	transform: translateY(-50%) rotate(135deg);
	pointer-events: none;
}

/* ■■■■■■ チェックボックス＆ラジオ ■■■■■■ */
.customBox {
    display: inline-flex;
    align-items: center;
    padding: 16px 25px 16px 15px;
    min-height: 60px;
	min-width: 260px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #fff;
    cursor: pointer;
    position: relative;
    line-height: 1.4;
    transition: background-color 0.3s, border-color 0.3s;
}

.customBox input[type="checkbox"] {
    display: none;
}

.customBox input[type="checkbox"]+.customBox_check {
    width: 20px;
    height: 20px;
    border: 1px solid #B4B7BB;
    border-radius: 4px;
	margin:-3px 10px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s, border-color 0.3s;
    position: relative;
    z-index: 2;
}

.customBox input[type="checkbox"]:checked+.customBox_check {
    background-color: #77C1A5;
    border-color: #77C1A5;
}

.customBox input[type="checkbox"]:checked+.customBox_check::after {
    content: '\02714';
    color: #fff;
    font-size: 14px;
}

.customBox input[type="checkbox"]:checked+.customBox_check+span+.customBox_bg {
    background-color: #E7F4BB;
}

.customBox:hover {
    background-color: #E7F4BB;
}

.customBox:hover .customBox_check {
    border-color: #77C1A5;
}

.customBox span {
    font-size: 16px;
    z-index: 2;
    position: relative;
}

.customBox small {
    font-size: 14px;
}

.customBox_bg {
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #ddd;
    transition: background-color 0.3s, border-color 0.3s;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}

.customBox input[type="radio"] {
    display: none;
}

.customBox input[type="radio"]+.customBox_radio {
    border-radius: 20px;
    margin:-3px 8px 0 0;
    position: relative;
    width: 20px;
    height: 20px;
    display: block;
    position: relative;
    border: 1px solid #B4B7BB;
    position: relative;
    z-index: 2;
    flex-shrink: 0;
}

.customBox input[type="radio"]:checked+.customBox_radio::after {
    content: "";
    border-radius: 20px;
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
    top: 50%;
    left: 50%;
    border: 4px solid #77C1A5;
    transform: translate(-50%, -50%);
}

.customBox input[type="radio"]:checked+.customBox_radio+span+.customBox_bg {
    background-color: #E7F4BB;
}

/* ■■■■■■ 時間 ■■■■■■ */
.time_input {
	display: flex;
	align-items: center;
	gap: 1vw;
}

@media screen and (min-width: 801px) {
	.time_input {
		gap: 10px;
	}
}

/* ■■■■■■ 年齢 ■■■■■■ */
.age_input {
	display: flex;
	align-items: center;
	gap: 1vw;
}

@media screen and (min-width: 801px) {
	.age_input {
		gap: 10px;
	}
}

/* ■■■■■■ 確認テキスト ■■■■■■ */
.confirm_txt  {
	display: inline-flex;
	align-items: center;
    min-height: 60px;
    border: 1px solid #B4B7BB;
	background-color: #E7F4BB;
    border-radius: 6px;
    padding: 15px 20px;
    font-size: 1.6rem;
}