@charset "utf-8";
/*
input[type=submit] {
 -webkit-border-radius: 10px;
 border-radius: 10px;
}
*/

/**************************************/
/*               index                */
/**************************************/
/***

1.Common
   body
   a
   br
   img
   h1,h2,h3,h4,h5,h6
   p
   em
   strong
   ins
   del
   ul,ol
   th,td
   form
   textarea
   input[type=text]
   select
   address

2.layout
   #header
   #menu
   #contents
   #footer

3.custom
   .summary
   .totop

***/

/**************************************/
/*             1.Common               */
/**************************************/
/*
@media screen and (max-width:750px) {

	body {
	   font-size:30px;
	}
}
*/
body {
   margin:0;
   padding:0;
   color:#333;
   font-family:verdana, sans-serif;
   font-style:normal;
   font-weight:normal;
   font-size:100%;
   text-align:center;
   text-decoration:none;
   letter-spacing:1px;
   line-height:1.4;
   background:#e0efff;
}

a {
   color:#551A8B;
   text-decoration:none;
}


a:link {
   color:#551A8B;
}

a:visited {
   color:#551A8B;
}

a:hover {
color:#333;
}

br {
   letter-spacing:normal;
}

img {
   border:0;
   vertical-align:bottom;
}

h1,h2,h3,h4,h5,h6 {
   margin:0;
   padding:0;
   font-weight:bold;
   font-size:88%;
}

p {
   margin:0;
   font-size:88%;
}
em {
   font-weight:bold;
   font-style:normal;
}

strong {
   font-weight:bold;
   color:#00008b;
}

ins {
   text-decoration: underline;
}

del {
   color:#999;
   text-decoration: line-through;
}


ul,ol {
   margin:0;
   padding:1em 0;
   padding-left:40px;
   font-size:88%;
}

dl{
   margin:0;
   padding:1em 0;
   font-size:88%;
   
}

th,td {
   font-weight:normal;
   font-size:88%;
}



textarea,
input[type=text],
select {
   font-size:100%;
   background:#fff;
   border:1px solid #333;
   }

address {
   margin:0;
   padding:0;
   color:#333;
   font-style:normal;
   font-weight:normal;
   font-size:88%;
}

/**************************************/
/*             2.layout               */
/**************************************/
#top {
   margin:0 auto;
   text-align:left;
}

#header {
   width:100%;
   padding:20px 10px;
   background:#e0efff;
}

#contents {
  margin:10px auto;
  padding:0px 10px;
  background:#e0efff;
}
.contentInner {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

#footer {
   height:100px;
   padding:0 20px;
   background:#e0efff;
}


/**************************************/
/*             3.custom               */
/**************************************/

/* header
------------------------*/
 #header {
  box-sizing: border-box;
  background-color: #668ad8;
  margin-bottom: 50px;
}
 #header .contentInner {
  position: relative;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
 }
#header h1 {
  text-align: center;
  font-size: 200%;
  color: #fff;
  display: inline-block;
}
#header .header_buttonWrap {
  width: 150px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
#header .button {
  width: 100%;
  display: inline-block;
  color: #fff;
  font-weight: bold;
  background: #2F3540 url(/images/arw.svg) no-repeat;
  background-position: center right 10px;
  text-decoration: none;
  padding: 7px 10px;
  margin-top: 10px;
  box-sizing: border-box;
  border: none;
}
#header .button:first-child {
  margin-top: 0;
}
#header .button.confBtn {
  background: #fff url(/images/conf.svg) no-repeat;
  background-position: center right 10px;
  background-size: 20px;
  border: 1px solid #2F3540;
  color: #2F3540;
}
#header input[type="submit" i]:focus,
#header input[type="submit" i]:active {
  /*ボタンを押したとき*/
  outline: none;
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
}
@media screen and (max-width:767px){
  #header {
    margin-bottom: 20px;
  }
  #header .contentInner {
    height: 40px;
  }
  #header h1 {
    font-size: 150%;
  }
  #header .contentInner {
    padding: 0 65px;
  }
  #header .header_buttonWrap {
    width: 60px;
  }
  #header .button.confBtn,
  #header .button {
    font-size: 12px;
    padding: 5px 10px;
    background-position: center right 3px;
    background-size: 10px;
  }
  #header .button.confBtn {
    background-size: 12px;
  }
}
/* contents
------------------------*/
#contents h2 {
   margin-bottom:2px;
   padding-top:1px;
   border-bottom:3px double #00008b;
   color:#00008b;
}

#contents h3 {
   margin-bottom:2px;
   margin-left:1em;
   padding-top:30px;
   border-bottom:1px solid #333;
}

#contents h4 {
   margin-bottom:2px;
   margin-left:1em;
   padding-top:30px;
   font-weight:normal;
}

#contents h5 {
   margin-bottom:2px;
   margin-left:1em;
   padding-top:30px;
   font-weight:normal;
   font-size:88%;
}

#contents h6 {
   margin-bottom:2px;
   margin-left:1em;
   padding-top:30px;
   font-weight:normal;
   font-size:88%;
}

#contents ul,
#contents ol {
   margin-left:1em;
}

#contents dt {
   margin-left:1em;
}

#contents dd {
   margin-left:2em;
}

#contents p {
   margin-left:1em;

}
#contents .seltable {
   margin:3px 0 10px 1em;
   padding:0;
   border: 1;
   line-height:1.4;
}

#contents .seltable th {
   padding:5px;
   padding-right:2em;
   vertical-align:top;
   text-align:left;
   font-weight:bold;
   color:#00008b;
}

#contents .seltable td {
   padding:5px;
   vertical-align:top;
   font-weight:normal;
   color:#00008b;
}
/* button
------------------------*/
#contents .button {
  margin-top: 40px;
  font-size: 20px;
  font-weight: bold;
  height: auto;
  background-image: linear-gradient(180deg, #668ad8 90%, #426cc8 98%);
  border: 1px solid #426cc8;
  border-radius: 50px;
  color: #fff;
  width: 100%;
  max-width: 400px;
  padding: 15px;
}
#contents .button:hover,
#contents .button:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  background-image: linear-gradient(180deg, #668ad8 100%, #426cc8 0%);
}
#contents .button:focus,
#contents .button2:focus {
  outline: none;
}
#contents .button2 {
  display: inline-block;
  padding: 0.5em 2em;
  text-decoration: none;
  color: #FFF;
  background-color: #668ad8;
  border: 1px solid #426cc8;
  border-radius: 3px;
}
#contents .button2:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  border-bottom: none;/*線を消す*/
}

#contents .line_button {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  background: #668ad8;/*ボタン色*/
  color: #FFF;
  border-bottom: solid 4px #627295;
  border-radius: 3px;
  width: 60px;
}
#contents .line_button:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  border-bottom: none;/*線を消す*/
}
@media screen and (max-width:767px){

}
/*
#contents .button {
    background: #EEE;
    border-top: 3px solid #DDD;
    border-left: 3px solid #DDD;
    border-right: 3px solid #BBB;
    border-bottom: 3px solid #BBB;
    font-size:110%;
    color:#111;
    width: 100px;
    height: 40px;
    padding: 10px 0;  
    margin-right:20px
}

#contents .button2 {
    background: #EEE;
    border-top: 3px solid #DDD;
    border-left: 3px solid #DDD;
    border-right: 3px solid #BBB;
    border-bottom: 3px solid #BBB;
	font-size:11pt;
    color:#111;
    width: 60px;
    height: 30px;
    padding: 5px 0;  
}

#contents .menu_btn {
    background: #EEE;
    border-top: 3px solid #DDD;
    border-left: 3px solid #DDD;
    border-right: 3px solid #BBB;
    border-bottom: 3px solid #BBB;
    font-size:110%;
    color:#111;
    width: 115px;
    padding: 10px 0;  
    margin-right:10px
}

#contents .line_button {
    background: #EEE;
    border-top: 3px solid #DDD;
    border-left: 3px solid #DDD;
    border-right: 3px solid #BBB;
    border-bottom: 3px solid #BBB;
    font-size:110%;
    color:#111;
    width: 80px;
    padding: 5px 0;  
    margin-right:10px
}
*/
/* daySearch
------------------------*/
#daySearch {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
  font-size:120%;
}
#contents #daySearch select  {
  border: 1px solid #a5a5a5;
  padding: 0.5em 1em;
  font-size:24px;
 }
#contents #daySearch .login  {
  color:red;
  font-weight:bold;
 }

#contents #daySearch select:hover,
#contents #daySearch select:focus,
#contents #daySearch select:active {
  border: 1px solid #668ad8;
  outline: none;
}
#contents #daySearch .button2 {
  margin-left: 5px;
  font-size:24px;
}
#contents #daySearch .btnResat {
  background-color: #eee;
  border: 1px solid #a5a5a5;
  color: #2F3540;
}
@media screen and (max-width:767px){
  #contents #daySearch select,
  #contents #daySearch .button2 {
    padding: 0.25em 0.5em;
  }

}
/* mainForm
------------------------*/
#contents #mainForm {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  background-color: #fff;
  box-shadow: 0px 0px 25px #0000000F;
  border-radius: 15px;
  padding: 50px 20px;
  box-sizing: border-box;
}
#contents #mainForm .mainFormInner {
  display: block;
  width: 100%;
  max-width: 450px;
  margin: 0 auto;
}
#contents #mainForm tbody {
  display: block;
  width: 100%;
}
#contents #mainForm tr {
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#contents #mainForm th {
  width: 7em;
  font-size: 18px;
  margin: 0;
  margin-right: 1rem;
  text-align: left;
}
#contents #mainForm td {
  width: 69%;
  width: calc(100% - 8rem);
  font-size: 18px;
  text-align: left;
}
#contents #mainForm .SubmitWrapn td {
  width: 100%;
  text-align: center;
}
#contents #mainForm td input:not(.button),
#contents #mainForm td select {
  width: 100%;
  box-sizing: border-box;
}
#contents #mainForm td input:not(.button),
#contents #mainForm td select  {
  border: 1px solid #a5a5a5;
  padding: 10px;
 }
#contents #mainForm td input:not(.button):hover,
#contents #mainForm td input:not(.button):focus,
#contents #mainForm td input:not(.button):active,
#contents #mainForm td select:hover,
#contents #mainForm td select:focus,
#contents #mainForm td select:active {
  border: 1px solid #668ad8;
  outline: none;
}
@media screen and (max-width:767px){
  #contents #mainForm .button {
    margin-top: 20px;
  }
  #contents #mainForm .row {
    display: block;
  }
  #contents #mainForm label {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 10px;
    display: inline-block;
  }
  #contents #mainForm input:not(.button) {
    width: 100%;
    box-sizing: border-box;
  }
}

#contents .totop {
   font-size:88%;
   text-align:right;
}

#contents .close_msg  {
  color:red;
  font-weight:bold;
  font-size:24px;
 }

#footer address {
   padding-top:30px;
   font-size:70%;
   text-align:center;
}

/**************************************/
/*             3.custom               */
/**************************************/


#contents table.edit {
   width:70%;
   border-collapse:collapse;
   background:#FFFFFF;
}

#contents table.edit th {
   padding:5px;
   width:100px;
   font-size:14px;
   text-align:left;
   border:1px solid #ddd;
   background:#f0f7fc;
}

#contents table.edit td {
   padding:5px;
   font-size:14px;
   text-align:left;
   border:1px solid #ddd;
   background:#FFFFFF;
}
/* table.suj
------------------------*/
#contents table.suj {
  width: 100%;
  border-collapse:collapse;
  background-color: #fff;
}
#contents table.suj th {
  text-align: center;
  background: #668ad8;
  font-weight: 600;
}
#contents table.suj thead th {
  border: 1px solid #ddd;
  background: #2f3540;
  color: #fff;
}
#contents table.suj thead th:first-child{
  width: 10%;
  min-width: 4rem;
}
#contents table.suj tr:nth-child(even) th{
  background-color: #7e9fe6;
}
#contents table.suj tr:nth-child(even) {
  background-color: #f3f3f3;
}
#contents table.suj tbody td {
  width:80px;
  text-align:center;
  border: 1px solid #fff;
}
#contents table.suj th{
  font-size:20px;
  padding: 0.5em;
}
#contents table.suj td {
  font-size:18px;
  padding: 0.5em;
}
#contents table.suj tbody td.link {
  padding: 0;
}
#contents table.suj tbody td.link:hover {
  opacity: .5;
}
#contents table.suj tbody td.link a {
  color: #668ad8;
  display: block;
  padding: 0.5em 0;
}
#contents table.suj td.sc1 { background:#A4F3FF; }
#contents table.suj td.sc2 { background:#33FFCC; }
#contents table.suj td.sc3 { background:#98fb98; }
#contents table.suj td.sc4 { background: #A4C6FF; }
#contents table.suj td.nasi { background:#CCCCCC; }
#contents table.suj td.aki { background: #E0FFFF; }
#contents table.time {
   width:80%;
   border-collapse:collapse;
}
@media screen and (max-width:767px){
  #contents table.suj tbody td {
    font-size:18px;
  }
}

#contents table.time th {
   padding:5px;
   font-size:12px;
   text-align:left;
   border:1px solid #ddd;
   background:#f0f7fc;
}

#contents table.time td {
   padding:5px;
   font-size:12px;
   text-align:center;
   border:1px solid #ddd;
}

#contents table td.rv {
   padding:5px;
   font-size:12px;
   text-align:center;
   border:2px double #ff1493;
}

#contents table.sel {
   width:60%;
   border:none;
}

#contents table.sel td {
   padding:5px;
   font-size:12px;
   text-align:left;
   border:none;
}

#contents table td.usr {
   padding:5px;
   font-size:12px;
   text-align:center;
   border:none;
}

#contents table.coach {
   width:100%;
   border-collapse:collapse;
}


#contents table.rev {
   width:80%px;
   background:#FFFFFF;
   border-collapse:collapse;
}

#contents table.rev tr {
   height:5px;
}

#contents table.rev tr.line {
   border-top:2px solid #ddd;
}

#contents table.rev th {
   width:80px;
   padding:5px;
   font-size:12px;
   text-align:left;
   border:1px solid #ddd;
   background:#f0f7fc;
}

#contents table.rev td {
   width:80px;
   height:10px;
   padding:0px;
   margin:0px;
   font-size:1px;
   text-align:center;
   border:1px solid #ddd;
}

#contents table.rev td.nasi {
   width:80px;
   height:10px;
   padding:0px;
   font-size:1px;
   text-align:center;
   border:1px solid #ddd;
   background:#CCCCCC;
}

#contents table.dummy {
   padding:10px;
   height:20px;
   border-collapse:collapse;
}

#contents table.dummy td {
   width:100px;
   font-size:10px;
   text-align:center;
   border:1px solid #ddd;
}

#contents table.dummy td.nasi {
   width:100px;
   font-size:10px;
   text-align:center;
   border:1px solid #ddd;
   background:#CCCCCC;
}

#contents table.kbn {
   width:70%;
   border:none;
}

#contents table.kbn td {
   padding:5px;
   font-size:12px;
   text-align:left;
   border:none;
}

#contents table.w50 {
   width:50%;
}

/**************************************/
/*             calendar               */
/**************************************/

#contents table.calendar {
   width:80%;
   border-collapse:collapse;
}

#contents table.calendar th {
   width: 80px;
   border:1px solid #696969;
}
#contents table.calendar th.weekday {
   padding:5px;
   font-size:12px;
   text-align:center;
   color:#000000;
   background:#f0f7fc;
}

#contents table.calendar th.holiday {
   padding:5px;
   font-size:12px;
   text-align:center;
   color:#FF7575;
   background:#FFE3E3;
}

#contents table.calendar th.saturday {
   padding:5px;
   font-size:12px;
   text-align:center;
   color:#000099;
   background:#E3F4FF;
}

#contents table.calendar td {
   padding:5px;
   width: 80px;
   height:100px;
   font-size:12px;
   text-align:left;
   vertical-align:top;
   border:1px solid #696969;
}

#contents table.calendar td.holiday {
   color:#FF7575;
}

#contents table.calendar td.close {
   padding:5px;
   background:#DFDFDF;
}


#contents .btn {
    background: #EEE;
    border-top: 3px solid #DDD;
    border-left: 3px solid #DDD;
    border-right: 3px solid #BBB;
    border-bottom: 3px solid #BBB;
    font-size:110%;
    font-weight:bold;
    color:#111;
    width: 80px;
    padding: 10px 0;  
}

#contents .day_btn {
    background: #EEE;
    border-top: 3px solid #DDD;
    border-left: 3px solid #DDD;
    border-right: 3px solid #BBB;
    border-bottom: 3px solid #BBB;
    font-size:90%;
    font-weight:bold;
    color:#111;
    height:30px;
    width: 80px;
    padding: 5px 0;  
}

#contents .time_btn {
    background: #EEE;
    border-top: 3px solid #DDD;
    border-left: 3px solid #DDD;
    border-right: 3px solid #BBB;
    border-bottom: 3px solid #BBB;
    font-size:90%;
    font-weight:bold;
    color:red;
    height:30px;
    width: 80px;
    padding: 5px 0;  
}



/* 入力域(文字列) */
input.char {
	background-color:#ffffff;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
}
textarea.char {
	background-color:#ffffff;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
}

/* 入力域(文字列、背景色が薄青色) */
input.char_blue {
	background-color:#E3FFF4;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
}
textarea.char_blue {
	background-color:#E3FFF4;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
}


/* 入力域エラー(文字列) */
input.char_err {
	background-color:yellow;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
}

/* 入力域(文字列) */
input.char_off {
	background-color:#ffffff;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
	ime-mode: inactive;
}
textarea.char_off {
	background-color:#ffffff;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
	ime-mode: inactive;
}

/* 入力域(文字列、背景色が薄青色) */
input.char_off_blue {
	background-color:#E3FFF4;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
	ime-mode: inactive;
}
textarea.char_off_blue {
	background-color:#E3FFF4;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
	ime-mode: inactive;
}


/* 入力域(数値) */
input.number {
	background-color:#ffffff;
	font-size:10pt;
	text-align:right;
	font-family:"ＭＳ ゴシック",Arial;
}

/* 入力域(数値、背景色が薄青色) */
input.number_blue {
	background-color:#E3FFF4;
	font-size:10pt;
	text-align:right;
	font-family:"ＭＳ ゴシック",Arial;
}


/* 入力域エラー(数値) */
input.number_err {
	background-color:yellow;
	font-size:10pt;
	text-align:right;
	font-family:"ＭＳ ゴシック",Arial;
}


/* 文字列 */
.char	{
	font-weight:normal;
	font-style:normal;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
}

/* 文字列 */
.char_blue	{
	font-weight:normal;
	font-style:normal;
	font-size:10pt;
	text-align:left;
	font-family:"ＭＳ ゴシック",Arial;
}

/* 文字列(右寄せ) */
.char_right	{
	font-weight:normal;
	font-style:normal;
	font-size:10pt;
	text-align:right;
	font-family:"ＭＳ ゴシック",Arial;
}

/* 文字列(中央揃え) */
.char_center	{
	font-weight:normal;
	font-style:normal;
	font-size:10pt;
	text-align:center;
	font-family:"ＭＳ ゴシック",Arial;
}


/* 数値表示 */
.number	{
	font-weight:normal;
	font-style:normal;
	font-size:10pt;
	text-align:right;
	font-family:"ＭＳ ゴシック",Arial;
}

/* 数値表示 */
.number_blue	{
	font-weight:normal;
	font-style:normal;
	font-size:10pt;
	text-align:right;
	font-family:"ＭＳ ゴシック",Arial;
}



/* エラーメッセージ */
#header .char_err {
	color:red;
	font-weight:bold;
	font-style:normal;
	font-size: 180%;
	font-family:"ＭＳ ゴシック",Arial;
}
/* 警告メッセージ */
#header .char_warn {
	color:#FF9900;
	font-weight:bold;
	font-style:normal;
	font-size: 180%;
	font-family:"ＭＳ ゴシック",Arial;
}
/* 情報メッセージ */
#header .char_info {
	color:#0000F2;
	font-weight:bold;
	font-style:normal;
	font-size: 180%;
	font-family:"ＭＳ ゴシック",Arial;
}

/* 必須プルダウン */
.sel_blue	{
/*	background-color:#eddbff;*/
	background-color:#E3FFF4;
}

input.check {
	border: 0px none; background : #F8F8F8;
}
/* 必須チェック */
input.check_blue {
/*	border: 0px none; background : #eddbff; */
	border: 0px none; background : #E3FFF4;
}

#contents input[type=checkbox] {
	width:			24px;
	height:			24px;
	-moz-transform:		scale(1.4);
	-webkit-transform:	scale(1.4);
	transform:		scale(1.4);
}

#contents .cansel {
   align:center;
}

#contents .detail {
   border:1px solid #999;
   border-collapse: collapse;
   margin:3px 0 20px 1em;
   font-size:180%;
}

#contents .detail tr.line {
   background:#ECF8FF;
}

#contents .detail th {
   border:1px solid #999;
   padding:5px;
   font-weight:bold;
   background:#FFF8EC;
}

#contents .detail td {
   border:1px solid #999;
   padding:5px;
   font-weight:normal;
   background:#FFFFFF;
}

#contents .totop {
   font-size:88%;
   text-align:right;
}

#contents .font_medium {
   font-size:150%;
}