:root{
	--col_white:#FFFFFF;
	--col_black:#000000;
	--col_red:#FF0000;
	--col_red_required:#FFEBED;
	--col_remon:#F9F7B4;
	--col_gray:#EBEAEA;
	--col_gray2:#999999;
	--col_gray3:#E0E0E0;
	--col_light_green:#9FD8CB;
	--col_light_green2:#DEF7F2;
	--col_light_green3:#296557;
	--contents_Rest:#DA3E52;
	--contents_short:#F58A07;
	--contents_A:#A3D9FF;
	--contents_B:#96E6B3;
	--contents_C:#7E6B8F;
	--contents_D:#084887;
	--contents_E:#F0D2D1;
	--contents_F:#ADEB84;
	--contents_G:#3980D0;
	--contents_H:#2B59C3;
	--contents_I:#998650;
	--contents_J:#F0B67F;
	--contents_K:#1D7874;
	--contents_L:#1C5D99;
	--contents_M:#E396DF;
	--contents_N:#004FFF;
	--contents_O:#F7B267;
	--contents_P:#EFD3D7;
	--contents_Q:#2C5530;
	--contents_R:#036D19;
	--contents_S:#BB9457;

	--checkBox_on:#06BEE1;
	--checkBox_off:#D8D8D8;
	--cal_blue:#1483EC;
	--cal_red:#EF233C;
	--cal_emerald:#2BB6A8;
	--cal_sweet_red:#FEA19A;
}

/* color
-----------------------*/
.font_black{
	color:var(--col_black);
}
.font_red{
	color:var(--col_red);
}
.font_blue{
	color:var(--contents_N);
}
.font_gray{
	color:var(--col_gray2) !important;
}
.font_caution{
	color:var(--contents_I);
}
.cal_blue{
	color:var(--cal_blue);
}
.cal_red{
	color:var(--cal_red);
}
.cal_emerald{
	color:var(--cal_emerald);
}
.checkBox_on{
	color:var(--checkBox_on);
}
.checkBox_off{
	color:var(--checkBox_off);
}
.font_bold{
	font-weight:bold;
}
.font_gray2{
	color: var(--col_gray2);
}
/* common
-----------------------*/
.strong_link{
	text-decoration:underline !important;
	background-color:rgba(255,255,255,0.5);
}
.align_left{
	text-align:left;
	padding-left:1rem;
}
.align_right{
	text-align:right;
	padding-right:1rem;
}
.float_left{
	float:left;
}
.float_right{
	float:right;
}
.width_4rem{
	width:4rem;
}
.width_10rem{
	width:10rem;
}
.width_20rem{
	width:20rem;
}
.width_30rem{
	width:30rem;
}
.width_40rem{
	width:40rem;
}
.middle_text_width{
	width:40rem;
}

/* フォーム関連
-----------------------*/
.form-group{
	margin-bottom: 35px;
}
input:required{
	background:var(--col_red_required);
}
input:valid{
	background:#FFFFFF;
}
input:focus{
	background: #EBF5E0;
}

.t_schedule_had{
	width:20%;
	padding-right:2rem;
	text-align:right;
}
.t_schedule_dat{
	width:80%;
	text-align:left;
}
.input_end{
	margin:2rem 0;
	border-bottom:solid 1px var(--col_white);
}
.confirm_input{
	float:left;
	width:40rem;
}
.confirm_atto{
	float:left;
	margin:0.3rem;
}
.border_getsurei{
	border: solid 3px var(--col_white);
	border-radius:1rem;
	padding:0.5rem 1rem;
}
.aroma_header{
	font-weight:bold;
	font-size:1.6rem;
}
.aroma_line{
	border-bottom:4px solid var(--col_red);
}

.mb-05{
	margin-bottom:0.5rem;
}
.mb-1{
	margin-bottom:1rem;
}
.mb-2{
	margin-bottom:2rem;
}
.mb-3{
	margin-bottom:3rem;
}
.mb-4{
	margin-bottom:4rem;
}
.mb-5{
	margin-bottom:5rem;
}
.mb-6{
	margin-bottom:6rem;
}
.mb-7{
	margin-bottom:7rem;
}
.mb-8{
	margin-bottom:8rem;
}
.ml-1{
	margin-left:1rem;
}
.ml-2{
	margin-left:2rem;
}

/* table
-----------------------*/
.t_schedule_sty, .t_sesrvice_sty{
	padding:0.7rem 1rem;
	background-color:var(--col_white);
}
.t_schedule_sty a:hover, .t_schedule_sty a:active{
	color:#E83F6F;
	background-color:rgba(255,190,0,0.5)!important;
}
.t_schedule_sty table>tbody>tr>th, .t_schedule_sty table>tbody>tr>td{
	text-align:center;
	vertical-align:top;
	padding-left: 0.1rem;
	padding-right: 0.1rem;
}
.t_sesrvice_sty table>tbody>tr>th, .t_sesrvice_sty table>tbody>tr>td{
	padding-top:0.5rem;
	padding-bottom:0.5rem;
	vertical-align:top;
}
.t_table{
	table-layout:fixed;
	width:100%;
	margin:0 auto;
	border-spacing:0;
}
.t_detail_week{
	height:5rem;
	min-height:5rem;
	text-align:center;
}
.tr_t_detail_day{
	border-top:solid 1px var(--col_light_green);
}
.t_detail_day{
	height:5rem;
}
.t_detail_day_line_h{
	border-bottom:solid 3px var(--col_light_green);
}
.t_detail_day_line{
	border-bottom:solid 1px var(--col_light_green);
}
.sch_month{
	font-size:1.6rem;
	margin:0.8rem 0 0.7rem 0;
}
.cal_date{
	margin:1.2rem;
}
.t_detail{
	height:5rem;
}
.tr_space_height{
	height:2rem;
}
.td_service_id{
	width:5%;
	min-width:5rem;
	padding-right:1rem;
	text-align:right;
}
.td_service_name{
	width:25%;
	text-align:left;
}
.td_service_button{
	width:10%;
	padding:0.2rem 0.2rem;
	text-align:right;
}
.td_new_button{
	width:100%;
	padding:0.3rem 0.2rem;
	text-align:right;
}
.sel_border_1{
	height:3.1rem;
	width:3.1rem;
	margin-left:0.5rem;
	background-color:var(--col_white);
}
.sel_border_2{
	height:2.5rem;
	width:2.5rem;
	margin:0.3rem;
	border:solid 3px var(--col_gray);
	border-radius:5px;
}

/* モーダル
-----------------------*/
.modalArea{
	display:none;
	position:fixed;
	z-index:10;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.modalBg{
	width:100%;
	height:100%;
	background-color:rgba(30,30,30,0.6);
}
.modalWrapper{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	height:auto;
	width:70%;
	max-width:500px;
	padding:2rem 2rem;
	background-color:var(--col_white);
}
.modalWrapper_cal{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	height:auto;
	width:90vw;
	max-height:70%;
	max-width:900px;
	overflow-y:scroll;
	padding:2rem 2rem;
	background-color:var(--col_white);
}
.closeModal{
	position:absolute;
	top:0.5rem;
	right:1rem;
	cursor:pointer;
	font-size:3rem;
}

/* ボタン
-----------------------*/
.btn{
	padding:1rem 2rem;
}
.btn:hover, .btns:visited{

}
.btns{
	display:inline-block;
	padding:2px 2px 6px 2px;
	margin-bottom:0.3rem;
	font-size:1.5rem;
	font-weight:normal;
	line-height:1.5;
	text-align:center;
	/* white-space:nowrap; */
	vertical-align:middle;
	cursor:pointer;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	background-image:none;
	border-radius:2px;
}
.btns:hover, .btns:visited{
	text-decoration:none;
	color:var(--col_white);
}
.col_mod_yes{
	color:var(--col_light_green3);
	background-color:var(--col_light_green);
}
.col_choice{
	color:var(--col_white);
	background-color:var(--cal_sweet_red);
}
.col_gray2{
	background: var(--col_gray2);
	color: var(--col_white);
}
.btns-info{
	width:100%;
	color:var(--col_white);
}
.btns-noservice{
	background:var(--col_gray);
	color:var(--col_gray2);
}
.btns_off{
	cursor:not-allowed;
	padding:2px 2px 6px 2px;
	width:100%;
	color:var(--col_white);
	margin-bottom:0.3rem;
	border-radius:2px;
	font-size:1.5rem;
	line-height:1.5;
}
.btns_off2{
	cursor:not-allowed;
	width:20rem;color:
	var(--col_gray2);
	background-color:var(--col_gray);
}
.wait_border{
	color:#FE5F55;
	background-color:var(--col_white);
}
.mail_button{
	background:#FFFFFF;
	border: solid 0px #FFFFFF;
	margin-right:0.4rem;
}

/* チェックボックス
-----------------------*/
.check_style label {
	padding-left:25px;
	position: relative;
	padding:0.5rem 1rem 0.5rem 3.5rem;
}
.check_style input {
	display: none;
}
.check_style label:before {
	position: absolute;
	opacity: 0;
	content: "";
	display: inline-block;
	width: 7px;
	height: 15px;
	border-right:3px solid var(--col_red);
	border-bottom:4px solid var(--col_red);
	transform: rotate(45deg);
	top:5px;
	left:15px;
}
.check_style label:after {
	position: absolute;
	display: block;
	content: "";
	width: 15px;
	height: 15px;
	border: 1px solid var(--col_gray2);
	top:10px;
	left:10px;
}
.check_style input[type=checkbox]:checked + label:before {
	opacity: 1;
}
.check_style input[type=checkbox]:hover + label:after {
	border: 1px solid #4973FF;
	cursor: pointer;
}

/* チェックボックスボタン
-----------------------*/
.support_cap_border{
	float: left;
	height: 1.8em;
	margin-right: 0.8em;
	margin-bottom: 1.8em;
}
.obj_input{
	display: none;
}
input[type="radio"], input[type="checkbox"]{
	box-sizing: border-box;
	padding: 0;
}
label{
	display: inline-block;
	margin-bottom: 0.5rem;
	font-weight:normal;
}
.label{
	display: inline;
	padding: 0.2em 0.6em 0.3em;
	font-weight: bold;
	line-height: 1;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: 0.5rem;
}
.obj_label{
	cursor: pointer;
	color:var(--col_gray2);
	padding: 0.3em 1.0em;
	background-color:var(--checkBox_off);
	border-radius: 5px;
}
.label{
	padding: 0.5em 1.0em;
	font-size:1.4rem;
	font-weight:normal;
}
.question_required{
	padding:0.3rem 0.7rem;
	font-size:1.4rem;
	font-weight:normal;
	color: #fff;
	text-align:center;
	background-color:var(--cal_sweet_red);
	border-radius:5px;
}
.check_box:checked + .label{
	color:var(--col_white);
	background-color:var(--checkBox_on);
}


/* スケジュール画面設定
-----------------------*/
.comment_border{
	text-align:left;
	padding-left:1rem;
}
.service_border a{
	color:var(--col_red);
}
.service_border{
	padding:2px 2px 6px 2px;
	width:100%;
	color:var(--col_gray2);
	margin-bottom:1.2rem;
	border-radius:2px;
	font-size:1.5rem;
	line-height:1.5;
}
.schedule_time{
	font-size:1.3rem;
}
.serviceName{
	font-weight:bold;
	color:var(--col_black);
}
.wait_border{
	color:#FE5F55;
	background-color:var(--col_white);
}
.ajax-box .inner-box .loading-box{
	display: block;
	height: 32px;
	background-image: url("ajax-loader.gif");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 32px auto;
}
.calender_min_size{
	font-size:1.1rem;
}

.color_gray{
	border:solid 4px var(--col_gray3);
}
.color_short{
	border:solid 4px var(--contents_short);
}
.color_Rest{
	border:solid 4px var(--contents_Rest);
}
.color_A{
	border:solid 4px var(--contents_A);
}
.color_B{
	border:solid 4px var(--contents_B);
}
.color_C{
	border:solid 4px var(--contents_C);
}
.color_D{
	border:solid 4px var(--contents_D);
}
.color_E{
	border:solid 4px var(--contents_E);
}
.color_F{
	border:solid 4px var(--contents_F);
}
.color_G{
	border:solid 4px var(--contents_G);
}
.color_H{
	border:solid 4px var(--contents_H);
}
.color_I{
	border:solid 4px var(--contents_I);
}
.color_J{
	border:solid 4px var(--contents_J);
}
.color_K{
	border:solid 4px var(--contents_K);
}
.color_L{
	border:solid 4px var(--contents_L);
}
.color_M{
	border:solid 4px var(--contents_M);
}
.color_N{
	border:solid 4px var(--contents_N);
}
.color_O{
	border:solid 4px var(--contents_O);
}
.color_P{
	border:solid 4px var(--contents_P);
}
.color_Q{
	border:solid 4px var(--contents_Q);
}
.color_R{
	border:solid 4px var(--contents_R);
}
.color_S{
	border:solid 4px var(--contents_S);
}
.contents_not_service{
	background-color:var(--col_gray2);
}
.contents_Rest{
	background-color:var(--contents_Rest);
}
.contents_short{
	background-color:var(--contents_short);
}
.contents_A{
	background-color:var(--contents_A);
}
.contents_B{
	background-color:var(--contents_B);
}
.contents_C{
	background-color:var(--contents_C);
}
.contents_D{
	background-color:var(--contents_D);
}
.contents_E{
	background-color:var(--contents_E);
}
.contents_F{
	background-color:var(--contents_F);
}
.contents_G{
	background-color:var(--contents_G);
}
.contents_H{
	background-color:var(--contents_H);
}
.contents_I{
	background-color:var(--contents_I);
}
.contents_J{
	background-color:var(--contents_J);
}
.contents_K{
	background-color:var(--contents_K);
}
.contents_L{
	background-color:var(--contents_L);
}
.contents_M{
	background-color:var(--contents_M);
}
.contents_N{
	background-color:var(--contents_N);
}
.contents_O{
	background-color:var(--contents_O);
}
.contents_P{
	background-color:var(--contents_P);
}
.contents_Q{
	background-color:var(--contents_Q);
}
.contents_R{
	background-color:var(--contents_R);
}
.contents_S{
	background-color:var(--contents_S);
}


/* スケジュール登録, サービス登録
-----------------------*/
.lbl_center_border{
	padding: 0.6em 0 0.5em 0.5em;
}
.information_border{
	background-color:var(--col_light_green2);
	padding:0.3rem 1rem 1rem 1rem;
}
.warning_border{
	background-color:var(--col_remon);
	padding:0.3rem 1rem 1rem 1rem;
}
.bottom_05{
	margin-bottom:0.5rem;
}
.cancel_msg_border{
	margin:0rem 1rem 2rem 1rem;
	padding:0.5rem 1.2rem;
	font-size:14px;
	background-color:rgba(255,255,255,0.8);
}

/* footer
-----------------------*/
footer p{
	text-align: center;
}


/*-----------------------*/

/* Media Queries */

/*-----------------------*/
@media screen and (min-width:320px) and ( max-width:560px){
	.calender_min_size{
		font-size:0.8rem;
	}
	.color_short{
		border:solid 2px var(--contents_short);
	}
	.color_Rest{
		border:solid 2px var(--contents_Rest);
	}
	.color_A{
		border:solid 2px var(--contents_A);
	}
	.color_B{
		border:solid 2px var(--contents_B);
	}
	.color_C{
		border:solid 2px var(--contents_C);
	}
	.color_D{
		border:solid 2px var(--contents_D);
	}
	.color_E{
		border:solid 2px var(--contents_E);
	}
	.color_F{
		border:solid 2px var(--contents_F);
	}
	.color_G{
		border:solid 2px var(--contents_G);
	}
	.color_H{
		border:solid 2px var(--contents_H);
	}
	.color_I{
		border:solid 2px var(--contents_I);
	}
	.color_J{
		border:solid 2px var(--contents_J);
	}
	.color_K{
		border:solid 2px var(--contents_K);
	}
	.color_L{
		border:solid 2px var(--contents_L);
	}
	.color_M{
		border:solid 2px var(--contents_M);
	}
	.color_N{
		border:solid 2px var(--contents_N);
	}
	.color_O{
		border:solid 2px var(--contents_O);
	}
	.color_P{
		border:solid 2px var(--contents_P);
	}
	.color_Q{
		border:solid 2px var(--contents_Q);
	}
	.color_R{
		border:solid 2px var(--contents_R);
	}
	.color_S{
		border:solid 2px var(--contents_S);
	}
	.middle_text_width{
		width:100%;
	}
	.btns{
		padding:4px 0px 2px 0px;
		margin-bottom:0.3rem;
		font-size:0.9rem;
		line-height:1.2;
		border-radius:5px;
	}
	.btns_off{
		padding:2px 0px;
		margin-bottom:0.3rem;
		font-size:0.9rem;
		line-height:1.2;
		border-radius:5px;
	}
	.confirm_input{
		width:90vw;
	}

}

@media screen and (min-width:560px) and ( max-width:767px){
	.confirm_input{
		width:90vw;
	}
}

@media screen and (min-width:768px) and ( max-width:899px){
	.modalWrapper{
		width:60vw;
		height:auto;
		max-height:60%;
	}
	.confirm_input{
		width:32rem;
	}
}

@media screen and (min-width:900px) and (max-width:1199px){
	.modalWrapper{
		width:50vw;
		height:auto;
		max-height:900px;
	}
}

@media screen and (min-width: 1200px){
	.modalWrapper{
		width:40vw;
		height:auto;
		max-height:900px;
	}
}