@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* CSSリセット */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	color: #404040;
/*	font-family: Arial, sans-serif; */
	font-family: -apple-system, 'メイリオ', monospace;
	overflow-wrap: anywhere;
}
nav ul, ol li, ul li {
	list-style: none;
}
img{
	max-width:100%;
}
a,a:hover{
	text-decoration:none;
}
html {
	font-size: 24px; /* デフォルト */
	height:100%;
}
h1,h2,h3,h4,h5,h6 {
	font-size:1.25em;
}
/* ベースフォントサイズ設定 */
body {
	width: 768px;
	margin: 0 auto;
/*	font-family: Arial, sans-serif;*/
	font-family: -apple-system, 'メイリオ', monospace;

	min-height: 100%;
	background-color: #FFF;
	box-shadow: 0 0 .75em rgba(0, 0, 0, 0.1);
}
@media (max-width: 768px) {
	html {
		font-size: calc(768 / 768 * 3.6vw);
	}
	body {
		width: 100%;
	}
}
header {
	background: #EDEBE7;
	padding: .75em 1.5em;
	font-weight:600;
}
main {
	padding: .75em 0 ;
	min-height: calc( 100vh - 9em );
}
main .content {
	padding: 0 .75em;
}
span.required{
	background: #F97667;
	color:#FFF;
	font-size:.6em;
	font-weight:600;
	padding:.25em .5em;
	margin: 0 1em;
	border-radius:.5em;
}
span.optional{
	background: #666;
	color:#FFF;
	font-size:.6em;
	font-weight:600;
	padding:.25em .5em;
	margin: 0 1em;
	border-radius:.5em;
}
h1 {
	margin-top:1.25em;
	margin-left:.5em;
}
.h2warp{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-top: 1em;
	align-items: flex-end;
}
.h2title_warp{
	display: flex;
	flex-direction: column;
}
.h2title {
	margin-top:1em;
	margin-left:1em;

	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
}
.h2bar {
	margin-left:1.75em;

	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	gap:1em;
	
	font-size:.75em;
	font-weight:600;
}
.h2coution {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: flex-start;
	justify-content: flex-start;

	font-size: .6em;
	margin: 1em 2em 0 2.5em;
}
span.number {
	color:#10C0D7;
	font-size:1.5em;
}
.readonly,
.readonly *{
	color:#D9D9D9 !important;
}

.btn{
	background:#EDD8D6;
	width: 98%;

	border-radius:.25em;
	padding:.5em 1em;
	margin:.5em auto;

	font-weight:600;

	box-shadow: .25em .25em .125em rgba(0, 0, 0, 0.125);
}
.btn *{
	color:#6B6A6A;
	vertical-align: middle;
}
.btn.notselect {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
}

.btn.notselect.disabled {
	background:#CAC9C9;
	cursor: default;
}
.btn.notselect.disabled *{
	border-color:#6B6A6A !important;
	color:#6B6A6A !important;
}

.btn.select {
	background:#F6F1E1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
}
.btn.select .btn_items{
	width: 92%;
	font-size:.75em;
}
.btn.select .btn_items .list_set_cat{
	padding-left:.25em;
}
.btn.select .btn_items .list_title{
	padding-left:.25em;
}
.btn.select .list_info{
	padding-left:.25em;
}
.red{
	color:#F97667;
}

.btn .btn_left {
	border-right: 2px solid #DEB5B1;
	padding: 2em 1em 2em 0em;
	font-size:1em;
	text-align:center;
	width:30%;
}
.btn .btn_right {
	width:60%;
	padding: 0 0em;
	text-align:center;
}
.btn_title{
}
.btn_caution{
	font-size:.75em;
}
.btn_right_arrow{
	background-color: #fff; 
	color: #bd7169; 
	border-radius:1em;
	font-size:1.25em;
}
.btn_left_cross{
	background-color: #fff; 
	color: #CCC; 
	border-radius:1em;
	font-size:1.25em;
}

.h3title{
	font-size: .5em;
	background: #6B6A6A;
	margin-top: 1.75em;
	padding: 1.5em 2em;
	border-radius: .75em .75em 0 0;
}
.h3title span{
	font-size:.9em;
}
.h3title *{
	color: #FFF;
}
.h3_no_setmenu{
	margin-bottom: .9em;
}
.h3list_items {
	font-size: .85em;
	list-style: none;
	padding: .5em 0;
	border-bottom: 2px solid;
}
.h3list_item{
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
}
input[type="checkbox"] ,
input[type="radio"] {
	margin: 0;
	accent-color: #e56e60;
	inline-size: 1.75em;
	block-size: 1.75em;
	width:10%;
}
@media (max-width: 768px) {
	input[type="checkbox"] ,
	input[type="radio"] {
		inline-size: 1.25em;
		block-size: 1.25em;
		width:11.25%;
	}
}
.list_texts{
	width:90%;
}
.list_terms{
	font-size:.8em;
}
.list_desc,
.list_info,
.list_terms,
.list_countkbn{
	padding:.125em 1em .125em 0;
}
.list_title{
	font-size:1.125em;
}
.list_desc{
	font-size:.85em;
}
.list_info{
	display: flex;
	gap: 1em;
	justify-content: space-between;
}
.list_countkbn{
	font-size:.85em;
}
b{
	font-size: 1.125em;
}
sub{
	font-size: .5em;
	margin-left:.25em;
}
span{
	font-size: .6em;
}
.list_target {
	padding-right: .5em;
	font-size: .95em;
	text-align: right;
}
.list_time{
	padding-right:0em;
	font-size: 1.125em;
	font-weight:bold;

	display: flex;
	align-items: flex-start;
	align-items: baseline;
}
.list_time span{
	font-size: .65em;
	margin-right:1em;
}
.list_price {
	display: flex;
	font-size: 2.25em;
	font-weight:bold;
	align-items: baseline;
}
.list_price span{
	font-size: .75em;
}
.list_set_cat {
	display: flex;
	font-size: .7em;
	flex-wrap: wrap;
	gap: .5em;
	margin:.5em 0;
}
.list_set_cat li {
	background: #F39388;
	padding: .25em .5em;
	color: #fff;
	border-radius: .25em;
}

.list_set_cat li.new ,
.list_set_cat li.rep ,
.list_set_cat li.all {
	width: 7em;
	text-align: center;
}
.list_set_cat li.new {
	background: #000;
}
.list_set_cat li.rep {
	background: #999;
}
.list_set_cat li.all {
	background: #6B6A6A;
}

.bottom_btns{
	display: flex;
	position: sticky;
	left: 0;
	bottom: 0;
	width: 100%;
	text-align: center;
	background: #EDEBE7;
}

.btn_submit {
	font-size: 1em;
	font-weight:bold;

	color: #FFF;
	background: #10C0D7;

	width: 70%;
	border: none;
	border-radius: .25em;

	padding: .75em 0em;
	margin: 1em auto 2em;

	cursor: pointer;
}
.btn_submit.disabled {
	background: #CAC9C9;

	cursor: default;
}

.btn_change{
	font-size: .9em;
	padding: .25em 2em;
	border-radius: .5em;
	border:none;
	border: 1px solid #CAC9C9;
	margin-right: .75em;
/*	box-shadow: .25em .25em .125em rgba(0, 0, 0, 0.125);*/
	cursor: pointer;
}

.btn_back{
	font-size: 1em;
	font-weight:bold;

	width: 20%;
	border: none;
	border: 1px solid #CAC9C9;
	border-radius: .25em;

	padding: .75em 0em;
	margin: 1em auto 2em;

	cursor: pointer;

}
.cal_selecter {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	font-size: 1.25em;
	padding: .5em;
}
.cal_selecter h3{
	font-size:.75em;
}
.cal_selbtn {
	border: none;
	border-radius: .5em;
	padding: .5em 1.5em;
	text-align: center;
	font-weight: 600;
	border: 1px solid #CAC9C9;
	font-size: .75em;

	cursor: pointer;
}
.calender {
	width: 100%;
	text-align: center;
}
.calender td{
	width: 11%;
	height:1.25em;
	font-size:2.5em;
	font-family: sans-serif;
	line-height: 1;
	overflow: hidden;
}
.calender th{
	width: 11%;
	height:2em;
	font-size:.75em;
	font-weight:bold;
	padding:.75em;
	background:#E0DED8;
	line-height: 1;
}
.calender th.day{
}
.calender th.sat{
	color:#11BDD7;
}
.calender th.sun{
	color:#F39388;
}
.calender thead{
	position: sticky;
	top: 0;
	z-index: 1;
}
.calender tbody{
}
.calender td:first-child{
	width: 22%;
	font-size:1em;
	font-weight:bold;
	padding:0 .75em;
	background:#E0DED8;
}
.calicon{
	width: .7em;
	height: .7em;
	padding: .025em;
}
.hidden{
	background:#B5B5B5;
	color:#6B6A6A;
}
.active{
	background:#F5F5F5;
}
/*
.active a{
	color: #BD7169;
	font-size: 1.5em;
	width: 100%;
	height: 100%;
	display: block;
	line-height: 0.7;
}
*/
.tel{
	font-size:1em !important;
	font-weight:bold;
}

.triangle{
	background: #E0E0E0;
	color:#6B6A6A;
/*	font-size:1.25em; */
}
.verticalwrite{
	background: #E0E0E0;
	align-content: flex-start;
}
.verticalwrite span{
	white-space: pre;
	writing-mode: vertical-rl;
	display: inline-block;

	color: #6B6A6A;

	font-size: .4em !important;
	font-weight: bold;
	text-align: left;
	padding-top: 1em;

	vertical-align: middle;

	position: relative;
	top: 0;
}
div.types_warp {
	display: flex;
	margin: .75em .5em;
	justify-content: flex-end;
}
ul.types {
	font-size: .75em;
	display: flex;
	margin-left: .5em;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	width: 30em;
}
ul.types li {
	display: flex;
	min-width: 6em;
	justify-content: flex-start;
	align-items: center;
	gap: .25em;
	margin-left:.25em;
}
div.active,
div.triangle,
div.hidden,
div.tel{
	background:none;
	text-align:center;
	line-height: 1;
}
div.active{
	line-height: 0.7;
}
div.active,
div.hidden{
	font-size:1.75em !important;
}
.staff_left{
	padding: .25em 0;
}
.staff_name{
	font-size: 1.25em;
}
.staff_kana{
	font-size: .75em;
}
.staff_right{
	display: flex;
	gap: 1em;
	align-items: baseline;
}
.staff_target{
}
.staff_price {
	font-size: 1.75em;
	min-width: 4.5em;
	text-align: right;
}
.staff_price span{
	font-size: .75em;
}
.staff_warp{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-direction: row;
	width: 100%;
}
.staff_column{
	display: flex;
	flex-direction: column;
	width: 100%;
}
.staff_catch{
	font-size: .6em;
}
.btn.staff {
	background:none;
	border: .1em solid #CAC9C9;
	min-height:4.5em;

	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
	
	box-shadow:none;
}

.btn.offmenu {
	background:none;
	border: .1em solid #CAC9C9;
	height:4.5em;

	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
	
	box-shadow:none;
}
.offmenu_warp{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-direction: row;
	width: 100%;
}
.offmenu_price {
	font-size: 1.5em;
}
.offmenu_time{
	font-size: .75em;
	font-weight:normal;
}
.lastpage {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: 80%;
	min-height: 60vh;
	background: #EDEBE7;
	margin: 2em auto 1em;
	border-radius: 1em;
	padding: 1em;
	justify-content: space-evenly;
	font-size: 1.25em;
}
.h2thanks{
	font-family: math;
	font-size: 1.75em;
}
.pthanks{
	color:#BE7169;
}
.totop {
	display: block;
	text-align: center;
	font-size: 1.25em;
}
.lastpage.sorry {
	background: #F39388;
	justify-content: flex-start;
	padding: 3em 1em;
}
.lastpage.sorry *{
	color:#FFF;
}
.h2sorry{
	font-family: math;
	font-size: 2em;
}
.h3sorry{
	font-size: 1em;
	margin-bottom:3em;
}

.h3formtitle{
	font-size: .9em;
	background: #EEEBE4;
	color:#404040;
	margin-top: 1.75em;
	padding: .75em 2em;
	border-radius: .5em .5em 0 0;
	display: flex;
	align-items: center;
}
.h3form *{
	color: #404040;
}

.h3formdata{
	display: flex;
	flex-direction: column;
	gap:.5em;
	padding: .75em .75em 0;
}
.h3formdata.form_name{
	flex-direction: row;
	justify-content: space-between;
}
.h3formdata p,
.h3formdata span{
	font-size:1.125em;
}
.h3formdata.qa p,
.h3formdata.qa span{
	font-size:.75em;
}
.input_text,
.textarea_text{
	font-size:1em;
	padding: .5em;
}
.input_text.input_name{
	width:50%;
}
.textarea_text{
	resize: none;
	height:6em;
}
.validation {
	font-size: .75em;
	display: flex;
	align-items: center;
	gap:.5em;
	margin-bottom:1em;
}
.validation label{
	font-size: 1.5em;
}
.validation input[type="checkbox"],
.validation input[type="radio"] {
	margin:0 .75em;
	width: 1.75em;
	-webkit-transform: scale(1.5,1.5);
}
.form_price{
	display: flex;
	align-items: baseline;
}
.form_price_sub{
	display: flex;
	flex-direction: column;
	padding: 0 .5em;
}
.form_price_sub span{
	font-size: .75em;
	padding-left:.25em;
}
.form_price_sub span.subtitle{
	font-size: .9em;
	width: 6.5em;
}
.off_cat {
	color: #ffe0a2;
	font-size: 1.2em;
}
.h3list_items.off_menu {
	background-color: #EEE;
}
.off_menu_desc {
	color: #FFF;
	background-color: #999;
	padding: .5em 1.25em;
	font-size: .75em;
	border-radius: .5em;
	margin-right: 1em;
}
.dn{
	display: none;
}
.notes {
	font-size: 0.7em;
}