@charset "utf-8";

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

body{background:#F9F9F9;}
img {
	max-width: 100%;
	height: auto;
	width: auto;
　
}
.w100 {
	width: 100% !important;
}
/*input[type="text"].w100, input[type="email"].w100, input[type="password"].w100, select.w100{
	width:93.5% !important;
	padding:inherit 2%;
}*/
img.w100{
	height:auto;
}
.sp{ display:none;}

.anchor {
    margin-top: -185px;
    padding-top: 185px;
}
.txt-red{color:#c0392b;}
#page-top span{
	display:block;
	width:70px;
	height:68px;
	border-radius:35px;
	background:#333;
	text-align:center;
	padding-top:2px;
}
#page-top a{ color:#FFF;}

/*-------------------------------------- Header */
header{
	/*position:relative;*/
	z-index:99;
	margin:0 auto;
	width:100%;
	background:#FFF;
	/*position:fixed;*/
	/*top:0;*/
	/*box-shadow: 0 0 10px rgba(0,0,0,.1);*/
}
header .pc{
	width:960px;
	margin:0 auto;
}
header .pc ul{
	display:table;
	table-layout:fixed;
	border-right:1px solid #CCC;
}
header .pc ul li{
	display:table-cell;
	border-left:1px solid #FFF;
	white-space:nowrap;
	font-size:1.1em;
	text-align:center;
}
header .pc ul li a{
	display:block;
	height:60px;
	width:100px;
	line-height:60px;
	box-sizing:border-box;
	border-left:1px solid #CCC;
}


/*-------------------------------------- Footer */
footer{
	/*position:relative;*/
	z-index:99;
	margin:0 auto;
	width:100%;
	min-width:960px;
	background:#333;
	color:#999;
}
footer .pc{
	width:960px;
	margin:0 auto;
	padding:20px 0;
}
footer .pc li {
    display:inline-block;
	margin-right:5px;
}

/*-------------------------------------- Content */
.content{
	width:960px;
	margin: 0 auto 60px auto;
}
#wrap > .content{padding-top:60px;}
h1{
	font-size:1.6em;
	margin:30px 0;
	font-weight:bold;
}
.content-inner{
	padding:0 70px;
}
.content-inner.show-scroll{
	max-height:180px;
	overflow:auto;
}
.show-scroll::-webkit-scrollbar {
    width: 12px;
}
 
.show-scroll::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
}
 
.show-scroll::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
    
.content-inner label{
	padding:6px;
	display:block;
	cursor:pointer;
}
ul.select-course li{position:relative;}
ul.select-course .btn{
	position:absolute;
	right:10px;
	top:5px;
}
.box{
	width:100%;
	background:#FFF;
	box-shadow: 0 0 15px rgba(0,0,0,.1);
}
.box-half{
	width:48%;
	background:#FFF;
	box-shadow: 0 0 15px rgba(0,0,0,.1);
}
.box-calendar{
	width:32%;
	background:#FFF;
	/*box-shadow: 0 0 15px rgba(0,0,0,.1);*/
    border: 1px solid #b9b9b9;
    box-sizing: border-box;
}
.box-reservemenu{
	/*width:65%;*/
	width:100%;
	background:#FFF;
	/*box-shadow: 0 0 15px rgba(0,0,0,.1);*/
    border: 1px solid #b9b9b9;
    box-sizing: border-box;
    
}
.box-inner{
	padding:25px;
}
.box-warning{
	padding:10px 15px;
	border-radius:3px;
	border:1px solid #cc0000;
    background: #cc0000;
    color: #fff;
}

/* headline */

h2{
	font-size:1.3em;
	margin:30px 0 20px 0;
	font-weight:bold;
	border-bottom:1px solid #333;
	padding-bottom:10px;
}
h2.step{
	font-size:1.3em;
	margin:40px 0 20px 0;
	text-indent:0;
}
h2.step span{
	width:80px;
	border-radius:30px;
	color:#FFF;
	font-size:0.8em;
	display:inline-block;
	margin-right:15px;
	text-align:center;
}
.box-inner h2{
	/*font-size:1.3em;*/
	margin:0 0 20px 0;
	font-weight:bold;
}
/* content */
.content-inner ul li{
	border-bottom:1px solid #EEEEEE;
}
.content-inner ul li:first-child{
	border-top:1px solid #EEEEEE;
}

/*-------------------------------------- Table */
.table,
.table-day,
.table-week,
.table-month{
	border:1px solid #dbdbdb;
	border-collaps:collapse;
	width:100%;
}
.table td, .table th,
.table-day td, .table-day th,
.table-week td, .table-week th,
.table-month td, .table-month th{
	border:1px solid #dbdbdb;
	padding: 5px 10px;
}
.table th{
	white-space:nowrap;
	background:#EEEEEE;
	border-bottom-color:#FFF;
}
.table tr:last-child th{
	border-bottom-color:#dbdbdb;
}
.table td,
.table-day td,
.table-week td,
.table-month td{
	background:#FFF;
}
.table span.address{
	display:inline-block;
	width:110px;
	font-size:0.9em;
}
.table span.label{
	display:inline-block;
	background:#C62828;
	color:#FFF;
	font-size:0.7em;
	padding:1px 5px;
	border-radius:3px;
}
.table-schedule {
    border-collapse: collapse;
    border-spacing: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
	 margin-top:20px;
}
.table-schedule th {
    background: none repeat scroll 0 0 #dbdbdb;
    font-size: 1.2em;
    padding: 5px;
    text-align: center;
}
.table-schedule td {
    border-bottom: 1px solid #dbdbdb;
    border-right: 1px solid #dbdbdb;
    border-top: 1px solid #dbdbdb;
    font-size: 1.2em;
    padding: 5px 10px;
	 background:#FFF;
}
.table-schedule tr:nth-child(2) td{ border-top:none;}
.table-schedule td:first-child{text-align:center;}
.table-schedule td:last-child {
    border-right: medium none;
	 text-align:right;
}
.table-schedule td span{
	font-size:0.8em;
	display:inline-block;
	margin-right:15px;
}

.table-appointment{
	border:1px solid #dbdbdb;
	border-collaps:collapse;
	width:100%;
}
.table-appointment td, .table-appointment th{
	border:1px solid #dbdbdb;
	padding: 5px 10px;
	text-align:center;
}
.table-appointment th{
	white-space:nowrap;
	background:#dbdbdb;
	border-right-color:#FFF;
}
.table-appointment th:last-child{
	border-right-color:#dbdbdb;
}
.table-appointment td{
	background:#FFF;
}


/*-------------------------------------- Form */
/*input[type="text"], input[type="email"], input[type="password"], select  {
    border-color: #aab2bd;
    color: #434a54;
	 width:300px;
}*/
/*input[type="text"], input[type="text"]:focus, input[type="email"], input[type="email"]:focus, input[type="password"], input[type="password"]:focus, select, select:focus, textarea, textarea:focus {
    box-shadow: none;
}*/
/*input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus {
    border-color: #3bafda;
}*/
/*input[type="text"], input[type="email"], input[type="password"], select, textarea {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    color: #555;
    display: inline-block;
    font-size: 14px;
    height: 34px;
    line-height: 1.42857;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}*/
/*input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, select:focus, textarea:focus {
    border-color: #66afe9;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
    outline: 0 none;
}*/
/*input[type="text"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="password"]::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder {
    color: #999;
    opacity: 1;
}*/
/*input[type="text"], input[type="email"], input[type="password"]{
	padding:2px 12px;
}*/
/*textarea{width:400px;}
input.datepicker, input.timepicker{width:160px;}
option{
	padding:6px 12px;
}*/

/*textarea {
    height: auto;
}*/
/*input[type="text"].form-sm, select.form-sm{
	width:150px;
}*/
/*input[type="text"].form-lg, select.form-lg{
	width:400px;
}*/

/*-------------------------------------- Button */
.btn{
 background-color: #c0167b;
    border-radius: 2px;
    color: #FFFFFF;
    display: inline-block;
    padding: 3px 0;
    text-align: center;
	 width:180px;
    vertical-align: middle;
	 border:none;
	 cursor:pointer;
	 /*border-bottom:3px solid rgba(0, 0, 0, 0.2);*/
}
.btn:hover {
	color:#FFF;
	text-decoration:none;
	filter: alpha(opacity=70);
	-moz-opacity: 0.70;
	opacity: 0.70;
}
.btn-sm{
	font-size:0.9em;
	width:80px;
	padding:3px 0;
}
.btn-xs{
	font-size:0.9em;
	width:50px;
	padding:3px 0;
}
.btn-lg{
	padding:6px 0;
	width:200px;
}
.btn-search{
	padding:6px 10px;
	width:inherit;
}
.btn.btn-disabled{
	background:#bdc3c7;
}
.btn.btn-disabled:hover{
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
	cursor:default;
}
.btn.btn-gray{
	background:#ccc;
	color:#000;
}

/*-------------------------------------- ログイン */
.login-box{
	width:400px;
}


/*-------------------------------------- 予約 */
.switch{
	padding:30px 0 10px 0;
}
.switch ul{
	display:table;
}
.switch li{
	display:table-cell;
}
.switch li a{
	margin-right:5px;
}
.table-day th,
.table-day td,
.table-week th,
.table-week td,
.table-month th,
.table-month td{
	text-align:center;
	box-sizing:border-box;
}
.table-day th,
.table-week th,
.table-month th{
	border-bottom:double 4px #DBDBDB;
}
.table-day td,
.table-week td{
	padding:0;
	height:30px;
}
.table-day .schedule-wrap,
.table-week .schedule-wrap{
	position:relative;
	width:100%;
	z-index:1;
}
.table-day .schedule-detail,
.table-week .schedule-detail{
	position:absolute;
	padding:5px 10px;
	top:-15px;
	left:0;
	width:100%;
	box-sizing:border-box;
	text-align:left;
	display:block;
	z-index:999;
	border-radius:6px;
	font-size:12px;
}
.table-month .schedule-detail{
	margin-bottom:2px;
	padding:3px 5px;
	width:100%;
	box-sizing:border-box;
	text-align:left;
	display:block;
	border-radius:3px;
	font-size:11px;
}
.table-week .weekday,
.table-week .sunday,
.table-week .saturday{
	width:13.1428%;
    min-width: 126px;
}
.table-month{
	table-layout:fixed;
}
.table-month td:before {
  display: block;
  float: left;
  height: 90px; /* この値は適宜書き換える */
  content: "";
}
.table-month td{
	vertical-align:top;
}
.table-month td > span{
	display:block;
	font-size:16px;
	font-weight:bold;
}
.table-month td:first-child span{
	color:#cc0000;
}
.table-month td:last-child span{
	color:#009eb7;
}
.table-month td:last-child span > i {
    color: #fff;
}
.table-month td{
	padding:5px 0;
}
.table-month td.noRsv{
	background-color: #f0f0f0;
}
.table-month td.today{
	background-color: #ececff;
}

.hour,
.min{
	width:4%;
}
.saturday{
	background:#BBDEFB;
}
.sunday{
	background:#FFCDD2;
}
.schedule-detail .reserve-time{
	font-size:0.9em;
}
.schedule-detail .reserve-left{
	display:inline-block;
	font-size:0.9em;
	border:1px solid #FFF;
	border-radius:3px;
	padding:0 5px;
	margin-top:5px;
	background:rgba(255,255,255,.5);
}
.schedule .available{
	display:inline-block;
	background:#43A047;
	color:#FFF;
	font-size:0.8em;
	padding:0 4px;
	border-radius:3px;
	margin-right:2px;
}
.schedule .unavailable{
	display:inline-block;
	background:#F44336;
	color:#FFF;
	font-size:0.8em;
	padding:0 4px;
	border-radius:3px;
	margin-right:2px;
}
.schedule-detail-modalBtn {
	margin: 0 10px;
}
.schedule-detail-modalBtn.bgGreen button,
.schedule-detail-modalBtn.bgRed {
	padding: 10px;
}
.schedule-detail-modalBtn.bgGreen button {
	width: 100%;
}
.schedule-detail-modalBtn.bgGreen button:before {
	border: none;
}
.schedule-detail-modalBtn.bgGreen:hover {
	background: rgba(0, 158, 183, 0.8);
	transition: .3s ease-out;
}