@charset "utf-8";
/* reserve__id ============ */
.reserve__idTtl {
	margin: 16px auto;
	width: 100%;
	font-size: 1.6rem;
	text-align: center;
	line-height: 1;
	color: #FFF;
	background-color: var(--sub-color);
	border-radius: 50px;
	padding: 6px 0 8px;
	letter-spacing: 0.14em;
}
/* タブ ============ */
.reserve__idCtt {
	margin: 16px auto;
}
.reserve__tab {
	width: 100%;
	display: flex;
	justify-content: space-between;
	gap: 10px;
}
.reserve__tabBtn {
	width: calc(100% / 2);
	display: block;
	height: 44px;
	line-height: 1.5;
	text-align: center;
	background-color:var(--gray-color);
	border-radius: 8px 8px 0 0;
	padding: 12px 8px;
}
.reserve__tabBtn.active {
	background-color: #FFF7F0;
}
@media (hover: hover) {
.reserve__tabBtn:hover {
	cursor: pointer;
}
}
.reserve__tabPanel {
	display: none;
	background-color: var(--lightorange-color);
	font-size: 1.4rem;
}
.reserve__tabPanel.active {
	display: block;
}
.reserve__tabFlexItemTtl {
	position: relative;
	font-size: 1.5rem;
	margin-bottom: 6px;
}
.reserve__idCtt .subcolor {
	/* position: absolute;
	top: 0;
	left: 0; */
	display: block;
}
.reserve__tabFlex {
	width: 100%;
	display: flex;
	flex-direction: column;
}
.reserve__tabFlexItem {
	width: 100%;
	padding: 16px;
	border-right: #FFF 3px solid;
}
.reserve__tabFlexItem:last-child {
	border: none;
}
.reserve__idBox {
	margin: 8px 0;
	padding: 6px 14px;
	border: var(--darkgray-color) 1px solid;
}
.reserve__tabLst li.np {
	padding-left: 0;
	margin-bottom: 4px;
}
p.reserve__tabFlexItemTtl:not(:first-child),
.reserve__innerTabPanel .reserve__tabLst:not(:first-child) {
	margin-top: 18px;
}
.reserve__tabLst li {
    text-align: justify;
    font-feature-settings: "palt" 1;
    word-break: break-all;
    letter-spacing: .1rem;
}
@media screen and (min-width:768px) {
    .reserve__tabBtn {
        height: 48px;
        padding: 12px 8px;
    }
    .reserve__tabFlexItem {
        padding: 24px;
    }
    .reserve__idCtt .subcolor {
        position: absolute;
        top: 0;
        left: 0;
    }
    .reserve__tabLst li {
        position: relative;
        padding-left: 60px;
    }
    .reserve__tabLst li.pl {
        padding-left: 120px;
    }
	.reserve__tabLst li.np {
		margin-bottom: 6px;
	}
}
@media screen and (min-width:980px) {
    .listFlex {
        flex-direction: row;
        gap: 1.4rem;
    }
}
/* reserve__check ============ */
.reserve__check {
	text-align: center;
	margin: 8px auto 100px;
}
.reserve__checkTtl {
	display: block;
	width: 80px;
	margin: 0 auto;
	font-size: 1.8rem;
	position: relative;
}
.reserve__checkTtl::before {
	position: absolute;
	content: "";
	width: 20px;
	height: 160px;
	top: -35px;
	left: 50%;
	transform: translateX(-50%);
	background-image: url(../../../images/reserve/reserve_arrow1.svg);
	background-repeat: no-repeat;
	background-size: contain;
}
.reserve__checkTxt {
	font-size: 1.4rem;
	position: relative;
}
.reserve__checkTxt::after {
	position: absolute;
	content: "";
	width: 20px;
	height: 160px;
	bottom: -163px;
	left: 50%;
	transform: translateX(-50%);
	background-image: url(../../../images/reserve/reserve_arrow2.svg);
	background-repeat: no-repeat;
	background-size: contain;
}
/* .reserve .gBoxA picture img {
	display: block;
	width: 100%;
	max-width: 380px;
	margin: 16px auto 0px;
}
@media screen and (min-width:768px) {
    .reserve .gBoxA picture img {
        max-width: 1200px;
    }
} */
.guidePage__note .reserve__btn{
	margin-bottom: 0;
}
/* 内側タブ ============ */
.reserve__innerTab {
	margin-top: 12px;
}
.reserve__innerTabList {
	width: 100%;
	display: flex;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 0;
	padding: 0;
	list-style: none;
}
.reserve__innerTabBtn {
	width: calc(100% / 2);
	display: block;
	height: 44px;
	line-height: 44px;
	text-align: center;
	background-color: var(--gray-color);
	border-radius: 8px 8px 0 0;
	padding: 0 8px;
	cursor: pointer;
}
.reserve__innerTabBtn.active {
	background-color: #FFEAD1;
}
@media (hover: hover) {
	.reserve__innerTabBtn:hover {
		cursor: pointer;
		opacity: 0.8;
	}
}
.reserve__innerTabPanel {
	display: none;
	background-color: #FFEAD1;
	padding: 16px;
	font-size: 1.4rem;
}
.reserve__innerTabPanel.active {
	display: block;
}
@media screen and (min-width:768px) {
	.reserve__innerTabBtn {
		height: 48px;
		line-height: 48px;
	}
	.reserve__innerTabPanel {
        padding: 24px;
    }
    .reserve__innerTab {
        margin-top: 14px;
    }
}