body{
  margin:0px;
  text-align:center;
  font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  font-size: 16px;
}

.box_line{
	width:760px;
	border: 1px solid #D2D2D2;
	background-color:#f6f6f6;
  padding:10px;
	margin:20px auto;

	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}


a:link{
	color:#000000;
}
a:visited {
	color:#000000;
}
a:hover {
	color:#000000;
}
a:activ {
	color:#000000;
}

.boldertext{
  font-weight:bolder; font-size:19px;
}


/******************** リンク用の画像を薄くする ********************/
a:hover img {
 opacity:0.8;
 filter:alpha(opacity=80);
 -ms-filter: "alpha( opacity=80 )";
}




/******************** カレンダー用 ********************/

table.calendar {
    width:98%;margin:0 auto;
}

table.calendar th{
    background: #49c;
    color:#fff; font-size:13px; padding:0px;
    border: 1px solid #CCCCCC;
    text-align: center;
}

table.calendar td {
  border: 1px solid #ccc;
  text-align: center;
	width:105px;
  height:60px;
	font-size:15px;
  border-collapse: collapse;
	line-height:130%;
	padding:1px;
  font-weight:bolder;
/* シャドー
  -moz-box-shadow: 0px 1px 5px #000000;
  -webkit-box-shadow: 0px 1px 5px #000000;
  box-shadow: 0px 1px 5px #000000;
  filter: progid:DXImageTransform.Microsoft.Shadow(strength = 1, direction = 180, color = '#000000');
*/
}

/****************************** カレンダー グラデーションなし ******************************/
table.calendar td.weekday {
  background-color:#fff;
}

table.calendar td.saturday{
  background-color:#fff;
}

table.calendar td.holiday {
  background-color:#fff;
}

/****************************** カレンダー グラデーションなし END ******************************/




/****************************** カレンダー グラデーションあり ******************************/
table.calendar td.weekday_Gradation {
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength = 1, Direction = 180, Color = '#000000')";
  /*Shadows look very different in IE (Only cardinal directions supported)*/
  /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
  /*Element should have a background-color*/
  /*All filters must be placed together*/
  /*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#e3fffe');
  /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
  /*Element must have a height (not auto)*/
  /*All filters must be placed together*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#e3fffe')";
  /*Element must have a height (not auto)*/
  /*All filters must be placed together*/
  background-image: -moz-linear-gradient(top, #ffffff, #e3fffe);
  background-image: -ms-linear-gradient(top, #ffffff, #e3fffe);
  background-image: -o-linear-gradient(top, #ffffff, #e3fffe);
  background-image: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#e3fffe));
  background-image: -webkit-linear-gradient(top, #ffffff, #e3fffe);
  background-image: linear-gradient(top, #ffffff, #e3fffe);
  /*--IE9 DOES NOT SUPPORT CSS3 GRADIENT BACKGROUNDS--*/
}

table.calendar td.saturday_Gradation{
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength = 1, Direction = 180, Color = '#000000')";
  /*Shadows look very different in IE (Only cardinal directions supported)*/
  /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
  /*Element should have a background-color*/
  /*All filters must be placed together*/
  /*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fff', endColorstr = '#ee9');
  /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
  /*Element must have a height (not auto)*/
  /*All filters must be placed together*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fff', endColorstr = '#ee9')";
  /*Element must have a height (not auto)*/
  /*All filters must be placed together*/
  background-image: -moz-linear-gradient(top, #fff, #ee9);
  background-image: -ms-linear-gradient(top, #fff, #ee9);
  background-image: -o-linear-gradient(top, #fff, #ee9);
  background-image: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#ee9));
  background-image: -webkit-linear-gradient(top, #fff, #ee9);
  background-image: linear-gradient(top, #fff, #ee9);
  /*--IE9 DOES NOT SUPPORT CSS3 GRADIENT BACKGROUNDS--*/
}
table.calendar td.holiday_Gradation {
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength = 1, Direction = 180, Color = '#000000')";
  /*Shadows look very different in IE (Only cardinal directions supported)*/
  /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
  /*Element should have a background-color*/
  /*All filters must be placed together*/
  /*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fff', endColorstr = '#faa');
  /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
  /*Element must have a height (not auto)*/
  /*All filters must be placed together*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fff', endColorstr = '#faa')";
  /*Element must have a height (not auto)*/
  /*All filters must be placed together*/
  background-image: -moz-linear-gradient(top, #fff, #faa);
  background-image: -ms-linear-gradient(top, #fff, #faa);
  background-image: -o-linear-gradient(top, #fff, #faa);
  background-image: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#faa));
  background-image: -webkit-linear-gradient(top, #fff, #faa);
  background-image: linear-gradient(top, #fff, #faa);
  /*--IE9 DOES NOT SUPPORT CSS3 GRADIENT BACKGROUNDS--*/
}
/****************************** カレンダー グラデーションあり END ******************************/



table.calendar td.pastday {
  background-color:#f6f6f6;
  box-shadow:  none;
}


p.pastday {
  font-size:11px;font-weight:normal; margin:0 auto; text-align:center;
}


span.reserveok{
  font-size:11px;font-weight:normal;margin:0px;
}


table.calendar a{
  text-decoration:none; color:#333;
}


table.calendar td.weekday a{
  color:#333;
}


table.calendar td.saturday a{
  color:#359;
}

table.calendar td.holiday a{
  color:#953;
}


table.calendar a:hover {
	color:#cc0;
}

.opening_table{
  font-size: 13px;
  margin: 0px auto;
}


.daylink{
  padding:6px 0px;
  background-image: url(../pic/reserve/daylink.GIF);
  background-repeat: no-repeat;
  background-position: center bottom;
}

.daylink:hover {
 background-color:#dfff47;
 color:#33f;
 background-image: url(../pic/reserve/daylinkH.GIF);
}

.daylink_en{
  padding:6px 0px;
  background-image: url(../pic/reserve/daylink_en.GIF);
  background-repeat: no-repeat;
  background-position: center bottom;
}

.daylink_en:hover {
 background-color:#dfff47;
 color:#33f;
 background-image: url(../pic/reserve/daylinkH_en.GIF);
}



.dayclose, .dayclose_en{
  padding:6px 0px;
  color:#aaa; font-size:20px;
  background-repeat: no-repeat;
  background-position: center bottom;
}
.dayclose{
  background-image: url(../pic/reserve/dayclose.GIF);
}
.dayclose_en{
  background-image: url(../pic/reserve/dayclose_en.GIF);
}



.dayend{
  color:#aaa; font-size:20px;
}

.btn_cancel_pc{
  display:block;
  color:#fff;
  background-color:#ff5454;
  padding:10px;
  text-align:center;
  width:280px;
  margin:0px auto;
  text-decoration:none;
}
.btn_officialSite{
  display: block;
  background-color:#2fb4d5;
  padding: 20px;
  color:#fff;
  font-weight:bold;
  font-size:20px;
  text-decoration:none;
  margin: 0px auto;
  max-width: 370px;
}

.btn_cancel_pc:link, .btn_cancel_pc:visited, .btn_officialSite:link, .btn_officialSite:visited{
  color:#fff;
}
.btn_cancel_pc:hover, .btn_officialSite:hover{
  opacity:0.9;
}





/******************** 予約フォーム用 ********************/

.formcomment{
  font-size:12px;
  color: #333333;
}

.formcertain{
  font-size:11px;
  color:#f00;
  font-weight:bolder;
}

.submit{
  padding:2px 15px;
}
#submit_alertB{
  /*color:blue;*/
  font-weight:bold;
}


div#errormsg{
  margin:0 auto;border:1px solid red;background-color:#fcc;font-weight:bolder;color:#33c;
  width:400px;margin:10px auto;padding:3px;font-size:14px;
}

.form_table{
  border:1px solid #aaa;
  border-collapse: collapse;
  margin:0 auto;
  text-align:left;
  font-size:13px;
  color: #333;
}

.form_table th {
  border:1px solid #aaa;
  padding: 5px 10px;
  background-color:#eee;
  height:48px;
  font-size:15px;
  width:140px;
}

.form_table td {
  border:1px solid #aaa;
  padding: 5px 10px;
  background-color:#fff;
  width:720px;
}


.form_table input ,select{
  vertical-align:-0.18em; padding:5px; border:1px solid #99c;
}

.form_table pre{
  white-space: pre-wrap;
}



input[type=radio] {
    width: 15px;
    height: 15px;
    /*vertical-align: middle;*/
}


.btn_back {
  display:block;
  background-color: #5aad00;
  padding: 7px;
  color: #fff;
  font-size: 18px;
  text-decoration:none;
  margin: 0px auto;
  text-align:center;
}
.btn_back:link, .btn_back:visited {
  color: #fff;
}
.btn_back:hover {
  opacity: 0.9;
}



/******************** 予約状況の時刻一覧用 ********************/


.timeListSj{
  background-color:#eee; border:1px solid #b0b0b0; font-weight:bolder;
}

.timeListLk{
  background-color:#fff; border-left:1px solid #b0b0b0; border-right:1px solid #b0b0b0; border-bottom:1px solid #eee; display:table;
}

.timeListLkCleaningNone{
  background-color:#f99; border-left:1px solid #b0b0b0; border-right:1px solid #b0b0b0; border-bottom:1px solid #eee; display:table;
}

.timeListLk:hover, .timeListLkCleaningNone:hover{
  background-color:#ff6;
}


.timeListLk1{
  width:90px; height:25px; float:left; padding-top:5px; background-color:#f6f6ff; color:#333;
}

.timeListLk2{
  width:150px; height:25px; border-left:1px solid #eee; float:left; padding-top:5px;
}


.timeListLk3{
  width:40px; height:25px; float:left; padding-top:5px;
}

.timeListLk4{
  background-color:#eee; border:1px solid #b0b0b0; height:4px; clear:both;
}


span.maru{
  padding:2px 25px; font-size:12px; color:#fff; background-color:#04a3da;
}

span.sankaku{
  padding:2px 13px; font-size:12px; color:#fff; background-color:#c80;
}

span.batsu{
  padding:2px 6px; font-size:11px; color:#fff; background-color:#d33;
}

strong.maru{
  color:#333;
}

strong.sankaku{
  color:#333; font-family: "ＭＳ ゴシック",sans-serif;
}

strong.batsu{
  color:#333;
}


strong.maru_cleaningNon{
  color:red;
}
strong.sankaku_cleaningNon{
  color:red; font-family: "ＭＳ ゴシック",sans-serif;
}

strong.maru_beginnerOk{
  color:green;
}
strong.sankaku_beginnerOk{
  color:green; font-family: "ＭＳ ゴシック",sans-serif;
}


.timeListLk_close{
  background-color:#ccc; border-left:1px solid #b0b0b0; border-right:1px solid #b0b0b0; border-bottom:1px solid #eee; display:table;
}

span.close{
  padding:2px 13px; font-size:11px; color:#fff; background-color:#969696;
}

.aboutCxlWaitReserve{
  font-size:13px; text-align:left;padding:5px; border:1px dotted #666;background-color:#ffc;line-height:1.6;
}

.aboutCaution{
  margin-top:5px;font-size:13px;text-align:left;padding:5px; border:1px dotted #666;
  background-color:#eef;line-height:1.4; margin-bottom:5px;
}


/******************** 予約状況の時刻一覧用 ********************/
.statetable{
  border:3px solid #007a52;
  border-collapse: collapse;
  margin:0 auto;
  text-align:left;
  font-size:12px;
  color: #333;
  margin-right:20px;
}

.statetable th {
  border:1px solid #007a52;
  color:#007a52;
  font-weight:bolder;
  font-size:14px;
  padding: 5px 10px;
  background-color:#dbeee7;
  text-align:center;
}

.statetable td {
  border-right:1px solid #007a52;
  border-bottom:2px solid #007a52;
  background-color:#fff;
  font-size:25px;
  text-align:center;
}


.statetable td.tdL {
  border-right:1px solid #007a52;
  border-bottom:2px solid #007a52;
  background-color:#f7f7b1;
  font-size:25px;
  text-align:center;
  width:95px;
}


.statetable td.tdLclose {
  border-right:1px solid #007a52;
  border-bottom:2px solid #007a52;
  background-color:#f2f2f2;
  font-size:10px;
  text-align:center;
  width:95px;
}

.statetable td.tdRclose {
  background-color:#f2f2f2;
  text-align:center;
  font-size:10px;
}

div.pagebody{
  display:flex;
  justify-content: space-between;
  margin:20px auto;
  width:1100px;


/*  height: auto !important;
  min-height: 600px;
  height: 600px;
*/
}


input.b_backStep2{
  cursor: pointer;
  display: block;
  width: 230px;
  height: 35px;
  border: none;
  text-indent: -9999px;
  background: url(../pic/reserve/b_backStep2.GIF) no-repeat 0 0;
}


input.b_backStep2:hover{
 opacity:0.8;
 filter:alpha(opacity=80);
 -ms-filter: "alpha( opacity=80 )";
}



/******************** キャンセルフォーム用 ********************/
.cancelinfo{
margin:0 auto;
border:3px solid #f6f6f6;
background-color:#fff;
padding:8px;
text-align:left;
font-size:13px;
line-height: 160%;
color: #333333;
width:760px;
text-align:left;
margin:0 auto;
}

.tableinfo{
font-size: 14px;
line-height: 160%;
color: #333333;
padding-top:10px;
padding-bottom:10px;
padding-left:10px;
padding-right:10px;
}

.subtytle{
width:720px;
margin:20px 0px 20px 20px;
font-size:16px;
font-weight:bold;
}


.maintable{
width:740px;
margin:8px;
background-color:#FFFFFF;
text-align:left;
border-top: 5px solid #FFFFFF;
border-bottom: 5px solid #FFFFFF;
}


.tabletitle{
width:160px;
padding-top:5px;
padding-bottom:5px;
padding-left:10px;
padding-right:10px;
vertical-align:top;
font-size: 13px;
line-height: 130%;
color: #333333;
border-right: 4px solid #E4E4E4;
}

.tableform{
width:530px;
vertical-align:top;
padding-top:5px;
padding-left:15px;
padding-bottom:5px;
font-size: 13px;
line-height: 130%;
color: #333333;
}

.stop_caution{
  color:#600; font-size:15px; border:10px solid #c9171e; height:50px; display:table; text-align:left; padding:20px; margin:0px auto 30px; background-color:#fff6f6;
  width:80%; max-width: 950px; box-sizing: border-box;
}

.stop_caution > div{
  background-color:#c9171e; color:white; width:90%; margin:auto; text-align:center; padding:8px;font-weight:bolder;
}

.stop_caution > p{
  color:#00f;
  width:90%;
  margin:10px auto 0px;
  font-weight:bolder;
}



/**** 空席状況の変更に伴う予約受付の変更メッセージ ****/
.vacancyAnnounceA{
	background-color:#eec7a1;
	padding:20px;text-align: center;
	margin-bottom:20px;
	border:7px dashed #900;
}

.vacancyAnnounceB{
	background-color:#ace9ed;
	padding:20px;text-align: center;
	margin-bottom:20px;
	border:7px dashed #900;
}

.vacancyAnnounceC{
	background-color:#fcc;
	padding:20px;text-align: center;
	margin-bottom:20px;
	border:7px dashed #900;
   font-weight:bolder;
   color:#c53d43;
}



/******************** 確認画面 ********************/
.goto_home {
    display: block;
    background-color: #2fb4d5;
    color:#fff;
    font-weight:bold;
    border: 1px solid #ccc;
    width: 50%;
    margin: 0px auto;
    text-decoration: none;
    padding: 10px;
    border-radius: 5px;
}
.goto_home:visited{
  color:#fff;
}
.goto_home:hover{
  opacity: 0.9;
}



/******************** ヘッダー ********************/
.header_base{
  width:100%; height:92px; border-bottom:4px solid #f99b9b; margin-bottom:10px;
  display:flex;flex-flow: row wrap; justify-content:center; align-items: center; align-content: center;
}
.header_left{
  width:30%; text-align:left;box-sizing: border-box;
}
.header_center{
  text-align:center; color:#444; font-size:25px; font-weight:bold; 
  width:40%;box-sizing: border-box;
}
.header_center .clinic_en{
  margin:0px auto;
  font-size:18px;
  color:#1c68ab;
  line-height:1.0;
}


.header_right{
  width:30%;
  box-sizing: border-box;
}


/******************** フッター ********************/
#copyright {
  position: relative;
  bottom: 0;
  background-color: #fe6c6c;
  width: 100%;
  padding:5px;
  box-sizing: border-box;
}
#copyrighttext {
  color: #FFFFFF;
  font-weight: bolder;
  text-align: center;
  margin: 5px auto;
  font-size:20px;
}





/******************** bar_steps ********************/
.bar_steps {
  display: flex;
  flex-wrap: wrap;
  width: 780px;
  margin: 30px auto 32px;
}
.bar_steps .step {
  position: relative;
  width: 20%;
  text-align: center;
  position: relative;
  align-items: center;
  justify-content: center;
  padding: 8px 0;
  line-height: 1.5;
  background: #F5F5F5;
  color: #999999;
  font-size: 12px;
}
.bar_steps .step:not(:last-child)::before,
.bar_steps .step:not(:last-child)::after {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: 100%;
  content: '';
  border: 37px solid transparent;
  border-left: 20px solid #F5F5F5;
  margin: auto;
}
.bar_steps .step:not(:last-child)::before {
  margin-left: 2px;
  border-left-color: #FFF;
}


.switch_language {
  position: fixed;
  bottom: 0px;
  right: 0px;
  width: 106px;
  display:block;
  background-color:rgba(0,0,0,0.7);
  color:#fff;
  text-decoration:none;
  padding:20px;
  box-sizing: border-box;
  z-index: 10;
}
.switch_language:link, .switch_language:visited {
  color: #fff;
}
.switch_language:hover {
  opacity: 0.9;
  font-weight:bold;
  transition: all  0.3s ease;
}



@media screen and (max-width: 767px) {
  .bar_steps .step {
    font-size: 11px;
    line-height: 1.4;
    padding: 10px 0;
  }
  .bar_steps .step:not(:last-child)::before,
  .bar_steps .step:not(:last-child)::after {
    border-width: 25px;
    border-left-width: 12px;
  }
}

.bar_steps .step.active {
  z-index: 1;
  background: #1c68ab;
  color: #fff;
}
.bar_steps .step.active:not(:last-child)::after {
  border-left-color: #1c68ab;
}
.bar_steps .step.active:not(:last-child)::before {
  border-left: none;
}