/*共通
--------------------------------------------------------------*/

.content{
	min-height: 200px;
}




.title-sub-02{
	line-height: 1.3em !important;
}

.strong{
color: rgba(255,0,4,1.00);
font-weight: bold
}


/*予約　日時選択画面
----------------------------------------------------------------*/

/*
#cal table{
	
}
#cal table .list-header{
	font-size:  1.3rem;
	font-weight: 100;
}

#cal table .list-time strong{
	font-size:  1.3rem;
	font-weight: 100;
}
#cal table .list-box a {
	font-size:  2rem;
	font-weight: 100;
	line-height: 1em;
}
*/


/*リストカレンダー枠*/

#booking-reservation-list-cal{
	width: auto;
	display: inline-block;
	
		margin-bottom: 2em;
	padding: 0em  1em  1em  1em ;
 	border: 1px solid rgba(95,95,95,0.5);
/*	background: rgba(255,255,255,1.00);*/
	box-shadow: 3px 3px 1px rgba(0,0,0,0.1);
	border-radius: 3px;

}








/*注意文*/
ul.caution--wrap{
	margin-top: 0px;
	padding-top: 0px;
	margin-bottom: 3em;
}
ul.caution--wrap strong{
	color: rgba(255,0,4,1.00);
	}






table.list-cal  {

  border-collapse: collapse;
  border-spacing: 0;
  margin-bottom: 10px;
  max-width: 100%;
  width: 100%;
}
table.list-cal  > thead > tr > th,
table.list-cal  > thead > tr > td,
table.list-cal  > tbody > tr > th,
table.list-cal  > tbody > tr > td,
table.list-cal  > tfoot > tr > th,
table.list-cal  > tfoot > tr > td {
  border: 1px solid #ddd;

  vertical-align: top;

}
table.list-cal  > thead > tr > th {
  background: #444;
  color: #fff;
  font-weight: normal;
  vertical-align: bottom;
}
table.list-cal  th {
  text-align: left;
}

table.list-cal ,
table.list-cal  th,
table.list-cal  td,
table.list-cal  tr,
table.list-cal  tr th,
table.list-cal  tr td,
table.list-cal  thead,
table.list-cal  thead th,
table.list-cal  thead td,
table.list-cal  thead tr,
table.list-cal  thead tr th,
table.list-cal  thead tr td,
table.list-cal  tbody,
table.list-cal  tbody th,
table.list-cal  tbody td,
table.list-cal  tbody tr,
table.list-cal  tbody tr th,
table.list-cal  tbody tr td,
table.list-cal  tfoot,
table.list-cal  tfoot th,
table.list-cal  tfoot td,
table.list-cal  tfoot tr,
table.list-cal  tfoot tr th,
table.list-cal  tfoot tr td {
  display: block;
  	line-height: 100% !important;

 
}

table.list-cal  > thead {
  float: left;
}
table.list-cal  > tbody > tr {
  display: inline-block;
  vertical-align: center;
}




/*予約へのリンク*/
/*残り30％をきったときの表示*/
.low .calendar-mark:before{
	content: "残 ";
	color: rgba(0,0,0,1.00);
}

.vacant .calendar-mark,
.booked .calendar-mark{
margin-top:-0.3em !important
}
.vacant .calendar-mark a,
.booked .calendar-mark a{
	display: block;
	background-color:#e83f22;
	border:none;
	color:#fff;
	font-size:13px;
	font-weight:700;
	text-align:center;
	box-shadow: 3px 3px 1px rgba(0,0,0,0.1);
    border-radius: 3px;
	font-size: 1.2rem ;
	font-weight: normal;
	padding: 0.7em;
	text-decoration: none;
	
	
}

.vacant .calendar-mark a:hover,
.booked .calendar-mark a:hover{
	background-color:#761c0c !important;
	color:#fff;


}

.full .calendar-mark,
.disable .calendar-mark{
	font-size: 14px;
	margin-top: 0.5em;
}







.list-header,
.kara_line,
.list-box{

	height: 4em !important;
		font-size: 1rem;
		margin: 1em 0 0 0 !important;	
		
/*
	line-height: 100% !imprtant;

	padding: 10px !important;
 	box-sizing: border-box !important;

	vertical-align: middle !important;
*/
	/*
*/
}
.timetable-time{
	font-size: 1.0rem;
	padding-top: 1em !important;
}
.calendar-mark{
	 font-size: 1.6rem;
}

table.list-cal{
	position: relative
}

table.list-cal .list-date span{
/*
	display: block;
	position: absolute;
	top:20px;
	left: 10px;
*/
}



.sp-only {display:none;}
.pc-only {display:inline;}







@media screen and (max-width: 767px) {
   /* 表示領域が320px以下の場合に適用するスタイル */
	

.sp-only {display:inline;}
.pc-only {display:none;}
/*


#cal table .list-box a {

	font-size:  2rem;
	line-height: 100%;
	margin: -0.4em 0px 0px 0px;
	padding: 0px;
	display: block;
*/
	
/*	font-weight: 100;
	line-height: 1em;
*/
}




}











/*カレンダー装飾*/
.list-calendar table {
/*	width: auto;*/

	margin: 1em 0px 1em 0px;
}







.list-monthly-calendar th, .list-monthly-calendar td,
.list-calendar th, .list-calendar td {
	border: none !important;
	border-bottom: 1px solid #dddddd !important;
	text-align: center;
	vertical-align: top;
}

.list-monthly-calendar th,
.list-calendar th {
	font-size: 1.1em;
	padding: 0.6em 1.3em;
}

.list-monthly-calendar td,
.list-calendar td {
	text-align: center;
	font-size: 1.1em;
	padding: 0.6em;
}

.list-header.sun,
.mix-calendar .header-row .sun,
/* .list-box.sun, */
.week-title.sun,
.day-box.sun .day-number {
	color: #ff6347;
}

.list-header.sat,
.mix-calendar .header-row .sat,
/* .list-box.sat, */
.week-title.sat,
.day-box.sat .day-number {
	color: #4169e1;
}

.list-header.holiday,
.list-box.holiday,
.day-box.holiday .day-number {
	color: #ff6347;
}








/*フォーム形状
--------------------------------------------------------*/

.content-form select option {
	font-size: 1.2rem !important;
	padding: 0.5rem 0.5rem !important;
}


.content-form input,
.content-form textarea
 {
	padding: 0.5rem 0.5rem !important;
	margin-bottom: 3px !important;
	font-size: 1.2rem !important;
}




/*メール設定の注意書き*/
#booking-reservation-attention {

	margin-bottom: 4em;
}
#booking-reservation-attention .wrap---attention{
	padding: 1em;

}


.list-type_time li{
	font-weight: bold;
	
}
#booking-reservation-attention  strong{
	color: rgba(255,0,4,1.00);
	
}







@media screen and (max-width: 767px) {
   /* 表示領域が320px以下の場合に適用するスタイル */
	

   
   		div[class^="op1-"] { /* セレクタ名の前方一致 */
				margin-top: 1em;

		}

			.op2-sanka01-birth-m span,
			.op2-sanka02-birth-m span{
				top: -4em !important;
				left: 9em !important;

			}
			.op2-sanka01-birth-d span,
			.op2-sanka02-birth-d span{
				top: -4em !important;
				left: 16em !important;
			}

			.op2-sanka01-birth-y span select,
			.op2-sanka02-birth-y span select{
				width: 6em !important;

			}
			.op2-sanka01-birth-m span select,
			.op2-sanka01-birth-d span select,
			.op2-sanka02-birth-m span select,
			.op2-sanka02-birth-d span select{
				width: 4em !important;

			}



/*フォーム形状
--------------------------------------------------------*/




/*booking-reservation-fieldset人数*/
select#client-adult{
	width: 5em;
}

/*	select*/
	#booking-form select{
		height: 3em !important;
	}


	#booking-form input.content-text{
		height: 3em !important;
		width: 100% !important
	}
	
	
/*補足*/
 	.option-note{
		padding-top: 0.7em;
		font-size: 0.8em;
	}


/*お住いの地域*/
	#client-address1{
		width: 48% !important;
	}	
	
	
	

}

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

		/*メールフォーム*/

		div[class^="op-wrap"] { /* セレクタ名の前方一致 */
				margin-bottom: 1em
		}

		.op-wrap-sanka01-birth-m,
		.op-wrap-sanka01-birth-d,
		.op-wrap-sanka02-birth-m,
		.op-wrap-sanka02-birth-d{
			margin-bottom: 0em !important;
		}




		div[class^="op1-"] { /* セレクタ名の前方一致 */

		 width: 25%;
		 float: left;
		 padding-left:1em;
		 box-sizing: border-box;
		}

		div[class^="op2-"] { /* セレクタ名の前方一致 */
		
		 width: 75%;
		 float: right;
		}


		#booking-reservation-fieldset tabel{}




/*確認*/
		div.option-confirm-label { 

		 width: 25%;
		 float: left;
		 padding-left:1em;
		 box-sizing: border-box;
		}

		div.option-confirm-value { /* セレクタ名の前方一致 */
		
		 width: 75%;
		 float: right;
		}



}





/*フォームの余白設定*/
#booking-reservation-fieldset,
#booking-option-fieldset,
#booking_client-fieldset,
#booking-message-fieldset,
#booking-confirm-fieldset{
	margin-bottom: 3em;
	padding: 2em;
 	border: 1px solid rgba(95,95,95,0.5);
	background: rgba(255,255,255,1.00);
	box-shadow: 3px 3px 1px rgba(0,0,0,0.1);
	border-radius: 3px;

	
	
}

/*調整*/
#booking-reservation-fieldset{
border-bottom: 0px solid rgba(0,0,0,1.00);
margin-bottom: 0px !important;
padding-bottom: 0px;
	border-radius: 3px 3px 0px 0px ;
}

#booking-option-fieldset{
margin-top: 0em;
border-top: 0px solid rgba(0,0,0,1.00);
padding-top: 0px !important;
	border-radius:  0px 0px 3px 3px;
}




/*見出し設定*/
#booking-reservation-fieldset legend,
#booking-option-fieldset legend,
#booking_client-fieldset legend,
#booking-message-fieldset legend{
	font-size: 2em;
	font-weight: normal;
}

#booking-option-fieldset legend{
	display: none;
}



/*ご予約の枠
-----------------------------------------------------------------*/
div[class^="op-wrap"] { /* セレクタ名の前方一致 */
	border-bottom: 1px dotted  rgba(200,200,200,1.00);
	padding-bottom: 1em;
		}

		div.op-wrap-sanka01-birth-m,
		div.op-wrap-sanka01-birth-d,
		div.op-wrap-sanka02-birth-m,
		div.op-wrap-sanka02-birth-d{
			border-bottom: 0px dotted hsla(0,0%,69%,1.00) ;
			padding-bottom: 0em;
		}

	.op1-yo1{
		font-weight: bold;

	}


	.op2-yo2{
		font-size: 1.3em;
	}




/*フォーム形状
--------------------------------------------------------*/

/*	select*/
	#booking-form select{
		height: 2em;
	}

/*補足*/
 	.option-note{
		padding-top: 0.7em;
		font-size: 0.8em;
	}
	
	
	
	
.cnfirm_title:first-child{
	display: none
}

.op-wrap-sanka01-name{
	padding-right: 1em;
	margin-top: 1em;
}

/*参加者　識別表示*/
.op-wrap-sanka01-name:before,
#confirmation-sanka01-name:before{
	content: "参加者 1" !important;
	font-weight: bold;
	margin-bottom: 0.3em;
	border-bottom: 1px solid hsla(0,0%,76%,1.00);
	display: block !important;
	padding-bottom: 0.3em;
	margin-bottom: 1em;
}

.op-wrap-sanka02-name:before,
#confirmation-sanka02-name:before{
	content: "参加者 2" !important;
	font-weight: bold;
	margin-bottom: 0.3em;
	border-bottom: 1px solid hsla(0,0%,76%,1.00);
	display: block !important;
		padding-bottom: 0.3em;
	margin-bottom: 1em;
}

.op-wrap-sanka03-name:before,
#confirmation-sanka03-name:before{
	content: "参加者 3" !important;
	font-weight: bold;
	margin-bottom: 0.3em;
	border-bottom: 1px solid hsla(0,0%,76%,1.00);
	display: block !important;
		padding-bottom: 0.3em;
	margin-bottom: 1em;
}

.op-wrap-sanka04-name:before,
#confirmation-sanka04-name:before{
	content: "参加者 4"  !important;
	font-weight: bold;
	margin-bottom: 0.3em;
	border-bottom: 1px solid hsla(0,0%,76%,1.00);
	display: block !important;
		padding-bottom: 0.3em;
	margin-bottom: 1em;
}

.op-wrap-sanka05-name:before,
#confirmation-sanka05-name:before{
	content: "参加者 5"  !important;
	font-weight: bold;
	margin-bottom: 0.3em;
	border-bottom: 1px solid hsla(0,0%,76%,1.00);
	display: block !important;
		padding-bottom: 0.3em;
	margin-bottom: 1em;
}

.op-wrap-sanka06-name:before,
#confirmation-sanka06-name:before{
	content: "参加者 6"  !important;
	font-weight: bold;
	margin-bottom: 0.3em;
	border-bottom: 1px solid hsla(0,0%,76%,1.00);
	display: block !important;
		padding-bottom: 0.3em;
	margin-bottom: 1em;
}





.op-wrap-bikou:before,
#confirmation-bikou:before{
	content: "備考"  !important;
	font-weight: bold;
	margin-bottom: 0.3em;
	border-bottom: 1px solid hsla(0,0%,76%,1.00);
	display: block !important;
		padding-bottom: 0.3em;
	margin-bottom: 1em;
  margin-top: 2em;
}





/*生年月日*/
.op1-sanka01-birth-m,
.op1-sanka01-birth-d,

.op1-sanka02-birth-m,
.op1-sanka012-birth-d{
display: none
}


.op2-sanka01-birth-y span::after,
.op2-sanka02-birth-y span::after,
div.op2-confirm-sanka01-birth-y::after,
div.op2-confirm-sanka02-birth-y::after{
	content: "年"
}
.op2-sanka01-birth-m span::after,
.op2-sanka02-birth-m span::after,
div.op2-confirm-sanka01-birth-m::after,
div.op2-confirm-sanka02-birth-m::after{
	content: "月"

}
.op2-sanka01-birth-d span::after,
.op2-sanka02-birth-d span::after,
div.op2-confirm-sanka01-birth-d::after,
div.op2-confirm-sanka02-birth-d::after{
	content: "日"
}






.op2-sanka01-birth-m,
.op2-sanka01-birth-d,
.op2-sanka02-birth-m,
.op2-sanka02-birth-d{
	position: relative
}

.op2-sanka01-birth-y span,
.op2-sanka02-birth-y span{
	display: block;
}
.op2-sanka01-birth-m span,
.op2-sanka02-birth-m span{
	display: block;
	position: absolute;
	top: -4em;
	left: 9em;

}
.op2-sanka01-birth-d span,
.op2-sanka02-birth-d span{
	display: block;
	position: absolute;
	top: -4em;
	left: 16em;
}

.op2-sanka01-birth-y span select,
.op2-sanka02-birth-y span select{
	width: 6em;
}
.op2-sanka01-birth-m span select,
.op2-sanka01-birth-d span select,
.op2-sanka02-birth-m span select,
.op2-sanka02-birth-d span select{
	width: 4em;

}










/*参加者募集*/
.op-wrap-sanka-add:before{
	content: "保護者" ;
	font-weight: bold;
	margin-bottom: 0.3em;
	border-bottom: 1px solid hsla(0,0%,76%,1.00);
	display: block;
		padding-bottom: 0.3em;
	margin-bottom: 1em;
}
.op1-sanka-add{

}
.op-wrap-sanka-add{
	margin-top: 3em;
}





/*レゴ*/
.op-wrap-sanka-lego-{
	margin-top: 3em;
	padding-bottom: 0.3em;
	margin-bottom: 1em;
}


.op1-sanka-lego-{
	font-weight: bold;
}









/*大人人数*/
.op-wrap-sanka-otona{}
.op-wrap-sanka-otona{
	margin-top: 2em;
	padding-bottom: 0.3em;
	margin-bottom: 1em;
}


.op1-sanka-otona{
		font-weight: bold;
}




/*子供人数*/
.op-wrap-sanka-kodomo{}
.op-wrap-sanka-kodomo{
	margin-top: 3em;
	padding-bottom: 0.3em;
	margin-bottom: 1em;

}


.op1-sanka-kodomo{
font-weight: bold;
}

/*キット数*/
.op-wrap-sanka-kit{}
.op-wrap-sanka-kit{
	margin-top: 3em;
	padding-bottom: 0.3em;
	margin-bottom: 1em;
}


.op1-sanka-kit{
font-weight: bold;
}






/*メルマガ*/
.op-wrap-mailmagazine-{
	margin-top: 3em;
	padding-bottom: 0.3em;
	margin-bottom: 1em;
}

.op1-mailmagazine-{
font-weight: bold;
}



.melmaga .op2-yo2{
	font-size: 1.0em;
}
.melmaga .op2-yo2 label{ margin-right: 1.2em}
.melmaga .op2-yo2 input{	
	margin-right: 0.3em !important;
}


/*情報媒体*/
.op-wrap-media{
	margin-top: 3em
}


.op1-media{
	font-weight: bold;
}




/*名前の項目の前に余白を設ける*/
.op-wrap-sanka02-name,
.op-wrap-sanka03-name,
.op-wrap-sanka04-name,
.op-wrap-sanka05-name,
.op-wrap-sanka06-name,
.op-wrap-media{
	 margin-top: 3em;
}






/*個別対応*/


/*クラブ募集フォーム
================================================================*/


















/*横並び*/
.check-media,
.check-mailmagazine{
	float: left;
	padding-right: 1em;
}

.option-note{
	display: block;
	clear: both;
}



#client-address2{
	display: none
}




/*カレンダー*/
h3.calendar-title,
caption.list-calendar{
display: none;
}


.list-calendar .article-name,
.list-calendar .note{
	display: none;

}






/*お申込者ご連絡先*/
#booking-client-table{
	padding-top: 1em;
}









/*確認画面
------------------------------------------------------*/
.cnfirm_title{
    font-size: 1.2em;
    font-weight: normal;
	margin-top: 2em;
	margin-bottom: 1em;
}


.option-confirm-note{
	font-size: 0.8em;
	display: none ;
}


#form_{

 text-align: center;
 line-height: 1.9em;
 font-size: 0,8rem;
 margin: 2em 0;

}




/* LINK
---------------------------------------------------- */
#form_ a:link {
	color: #1B73A3 !important;
	text-decoration: underline;
}
#form_ a:visited {
	color: #5B1BA3  !important;
	text-decoration: underline;
}
#form_ a:active {
	color: #1B73A3  !important;
	text-decoration: none;
}
#form_ a:hover {
	color: #1B73A3  !important;
	text-decoration: none;
}







#action-button button#submitBtn{
	width:300px;
	height:60px;
	background-color:#e83f22;
	border:none;
	color:#fff;
	font-size:13px;
	font-weight:700;
	text-align:center;
	    box-shadow: 3px 3px 1px rgba(0,0,0,0.1);
    border-radius: 3px;
	font-size: 2em;
	font-weight: normal;
	
	
}
#action-button button#submitBtn:hover{
	background-color:#761c0c !important;
	color:#fff;
}




#action-button{
	width: 500px;
	margin: auto
}




#action-button button#submitBtn:disabled,
#action-button button#submitBtn:disabled:hover{
	background-color:rgba(150,150,150,1.00) !important; 
	cursor: default !important;
     }
	
	
	


/*戻るボタン*/
#action-button button#btn_back{
	width:150px;
	height:40px;
	background-color:rgba(146,146,146,1.00);
	border:none;
	color:#fff;
	font-size:13px;
	font-weight:700;
	text-align:center;
	    box-shadow: 3px 3px 1px rgba(0,0,0,0.1);
    border-radius: 3px;
	font-size: 1.3em;
	font-weight: normal;
}
	 
#action-button button#btn_bac:hover{
	background-color:rgba(237,237,237,1.00); !important;
	color:#fff;
}






.submit button#submitBtn{
	float: left;
}

.submit  button#btn_back{
	float: right;
	margin-top: 0.5em;
}



@media screen and (max-width: 767px) {
   /* 表示領域が320px以下の場合に適用するスタイル */
#action-button{
width: auto
}

#action-button button#submitBtn{
	float: none
}

#action-button button#btn_back{
	float: none;
	 margin-top: 2em;

}
}














/*404
===============================================*/


.error-404{
	height: 400px !important;
}











/*キャンセル　
===============================================*/
.subscription-cancel{
float: none !important;
    text-align: center;
	margin-top: 1em;
	margin-bottom: 2em;
}


.subscription-cancel button{
	
	height:60px;
	background-color:#e83f22;
	border:none;
	color:#fff;
	font-size:13px;
	font-weight:700;
	text-align:center;
	    box-shadow: 3px 3px 1px rgba(0,0,0,0.1);
    border-radius: 3px;
	font-size: 2em;
	font-weight: normal;
	padding-left: 2em;
	padding-right:2em;
	
}
.subscription-cancel button:hover{
	background-color:#761c0c !important;
	color:#fff;
}



@media screen and (max-width: 767px) {
   /* 表示領域が320px以下の場合に適用するスタイル */
	
	.subscription-cancel button{
	font-size: 1.4em;
	}
	
	
	
	}

/*
オプション　生年月日
.sanka01-birth-m,
.sanka01-birth-d,
.sanka02-birth-m,
.sanka02-birth-d{
	display:none;
}

select#booking-option-sanka01_birth-y:after{
	content:"test"
}

 
#booking-option-sanka01-birth-y{}
.booking-option-sanka01-birth-m th{
	display: none;
	}
.booking-option-sanka01-birth-d th{
	display: none;
	}


.booking-option-sanka01-birth-y td {
	
}
.booking-option-sanka01-birth-m td{
	display: block;

	background: none !important;
	}
.booking-option-sanka01-birth-d td{
	float: left;
	display: block;
	background: none !important;
	}



*/






