section.res_calendar{ position:relative; margin:0 auto; width:100%; height:auto;}
section.res_calendar div.calendar{ width:65%; height:auto; z-index: 4; padding:2% 1%; float:left; border-radius: 8px; background: #f9f9f9; position: relative;    
    box-shadow: 0 0 30px rgba(0,0,0,0.15);
    -moz-box-shadow: 0 0 30px rgba(0,0,0,0.15);
    -o-box-shadow: 0 0 30px rgba(0,0,0,0.15);
    -webkit-box-shadow: 0 0 30px rgba(0,0,0,0.15) }
  section.res_calendar div.cal_bg01{ width:63.5%; height:90%; z-index: 2; border-radius: 8px; top:5%; left:2%; position: absolute; background: #d0d1d4; 
box-shadow: 0 10px 10px rgba(0,0,0,.08);
    -moz-box-shadow: 0 10px 10px rgba(0,0,0,.08);
    -o-box-shadow: 0 10px 10px rgba(0,0,0,.08);
    -webkit-box-shadow: 0 10px 10px rgba(0,0,0,.08)
  }
  section.res_calendar div.cal_bg02{ width:64%; height:85%; z-index: 1; border-radius: 8px; top:7%; left:2.3%; position: absolute; background: #9598a0; 
box-shadow: 0 10px 10px rgba(0,0,0,.08);
    -moz-box-shadow: 0 10px 10px rgba(0,0,0,.08);
    -o-box-shadow: 0 10px 10px rgba(0,0,0,.08);
    -webkit-box-shadow: 0 10px 10px rgba(0,0,0,.08)
  }
  section.res_calendar div.calendar h3{ text-align: center; color:#6b7395; padding:4% 0 7% 0; font-size:20px; font-family: 'Montserrat_M';}
  section.res_calendar div.calendar div.ca_arrows{ position: absolute; width:100%; }
  section.res_calendar div.calendar div.ca_arrows img{ width:30px; height: auto; }
  section.res_calendar div.calendar div.ca_arrows img.left{ position: absolute; left:12px; top:23px;}
  section.res_calendar div.calendar div.ca_arrows img.right{ position: absolute; right:35px; top:23px; }
  section.res_calendar div.calendar table{ width:96%; margin-left: 2%; }
  section.res_calendar div.calendar table tr th{ font-family: 'Montserrat_R'; color:#606c8c; padding-bottom: 3%; }
  section.res_calendar div.calendar table tr td{ cursor: pointer; font-family: 'Montserrat_SB'; color:#042765; font-size: 1rem; text-align: center; padding:0; border-top:1px solid #eeeeee;  border-left:1px solid #eeeeee; position: relative; }
  section.res_calendar div.calendar table tr td.none{color:#d7d7d7;}
  section.res_calendar div.calendar table tr td:last-child{ text-align: center; border-top:1px solid #eeeeee; border-left:1px solid #eeeeee; border-right:1px solid #eeeeee; }
  section.res_calendar div.calendar table tr td.on01::after{ content:''; position: absolute; bottom:15%; left:15%;  border-radius:20px; width:70%; height:5px; background:#27cc7d;  }
  section.res_calendar div.calendar table tr td.on02::after{ content:''; position: absolute; bottom:15%; left:15%;  border-radius:20px; width:70%; height:5px; background:#5a85fc;  }
  section.res_calendar div.calendar table tr td.on03::after{ content:''; position: absolute; bottom:15%; left:15%;  border-radius:20px; width:70%; height:5px; background:#28487b;  }
  section.res_calendar div.calendar table tr td.on04::after{ content:''; position: absolute; bottom:15%; left:15%;  border-radius:20px; width:70%; height:5px; background:#2060aa;  }
  section.res_calendar div.calendar table tr td.on05::after{ content:''; position: absolute; bottom:15%; left:15%;  border-radius:20px; width:70%; height:5px; background:#2b467d;  }
  section.res_calendar div.calendar table tr td.on01:hover a{ color:#fff; background:#27cc7d;}
  section.res_calendar div.calendar table tr td.on02:hover a{ color:#fff; background:#5a85fc;}
  section.res_calendar div.calendar table tr td.on03:hover a{ color:#fff; background:#28487b;}
  section.res_calendar div.calendar table tr td.on04:hover a{ color:#fff; background:#2060aa;}
  section.res_calendar div.calendar table tr td.on05:hover a{ color:#fff; background:#2b467d;}
  section.res_calendar div.calendar table tr td a{ display:block; padding:35% 0; color:#021e50;}
  section.res_calendar div.calendar table tr td.on01.on{ color:#fff; background:#27cc7d;}
  section.res_calendar div.calendar table tr td.on02.on{ color:#fff; background:#5a85fc;}
  section.res_calendar div.calendar table tr td.on03.on{ color:#fff; background:#28487b;}
  section.res_calendar div.calendar table tr td.on04.on{ color:#fff; background:#2060aa;}
  section.res_calendar div.calendar table tr td.on05.on{ color:#fff; background:#2b467d;}
  section.res_calendar div.calendar table tr td.on01.on a{ color:#fff; background:#27cc7d;}
  section.res_calendar div.calendar table tr td.on02.on a{ color:#fff; background:#5a85fc;}
  section.res_calendar div.calendar table tr td.on03.on a{ color:#fff; background:#28487b;}
  section.res_calendar div.calendar table tr td.on04.on a{ color:#fff; background:#2060aa;}
  section.res_calendar div.calendar table tr td.on05.on a{ color:#fff; background:#2b467d;}

  section.res_calendar div.calendar table tr:last-child{ border-bottom:1px solid #eeeeee; }
  section.res_calendar div.tolist{width:33%; position: relative; margin-left:2%;  height:auto; float:left;}
  section.res_calendar div.tolist h4{ color: #5a85fc; font-family: 'Montserrat_M'; padding-top: 15%; padding-left: 14%; font-size: 34px; margin-bottom: 15%; font-style: italic; }
  section.res_calendar div.tolist h4 span{opacity: 0.5; font-size: 12px; display: inline-block; float:right;}
  section.res_calendar div.tolist ul li::after{ width: 10px; height:10px; border-radius: 50%; opacity: 0.5; position:absolute; top:28%; left:6%; background:#27cc7d;  content:'';}
  section.res_calendar div.tolist ul li{ color: #555; width:100%; padding:5% 15%; padding-right: 5%;  position: relative;  }
  section.res_calendar div.tolist ul li span.tit{ font-size: 16px; }
  section.res_calendar div.tolist ul li span.time{ opacity: 0.5; font-size: 12px; font-family: 'Montserrat_R';}
  section.res_calendar div.tolist ul li:nth-child(2n+1){ background:#f6f4f9; }
  section.res_calendar div.tolist button.bttn-unite{position: absolute; right:0px; top:0px;}

@media screen and (max-width:1024px) {
	section.res_calendar div.tolist h4{margin-bottom:1rem;}
	section.res_calendar div.tolist h4 span{float:none;}
}

@media screen and (max-width: 768px) {
  section.res_calendar{ width:100%; }
section.res_calendar div.calendar{ width:100%; height:auto; float:none;}
section.res_calendar div.cal_bg01{ display: none; }
section.res_calendar div.cal_bg02{ display: none; }
section.res_calendar div.tolist{ width:100%; float:none; margin-left:0; }
section.res_calendar div.tolist button.bttn-unite{position: absolute; right:0px; top:70px;}
section.res_calendar div.tolist h4 {  padding-top: 5%; padding-left: 2%; font-size:1.5rem;}
section.res_calendar div.tolist h4 span{margin-left:1rem;}
}

@media screen and (max-width: 640px) {
	section.res_calendar div.calendar h3{font-size:1.125rem;}
	section.res_calendar div.calendar table{font-size:0.8rem;}
	section.res_calendar div.calendar table tr th,
	section.res_calendar div.calendar table tr td{line-height:normal; padding:0.25rem;}
	section.res_calendar div.calendar table tr td a{padding:0.25rem 0; font-size:0.8rem;}
}

@media screen and (max-width: 480px) {
	section.res_calendar div.calendar div.ca_arrows img.left,
	section.res_calendar div.calendar div.ca_arrows img.right{top:15px;}
}

@media screen and (max-width: 425px) {
	section.res_calendar div.tolist h4{margin-bottom:0.5rem;}
	section.res_calendar div.tolist button.bttn-unite{position: absolute; right:0px; top:45px;}

	section.res_calendar div.calendar table tr td a{font-size:0.5rem;}
}

@media screen and (max-width: 375px) {
	section.res_calendar div.calendar div.ca_arrows img.left,
	section.res_calendar div.calendar div.ca_arrows img.right{top:10px;}
}

/*table*/

/* -- Material Design Table style -------------- */
section.res_calendar .table {
 font-style: normal;
  font-weight: 300;
  font-size:14px;
  line-height: 2px;
  
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  width: 100%;
  max-width: 100%;
  margin-bottom: 2rem;
  background-color: #fff;
}
section.res_calendar .table > thead > tr,
section.res_calendar .table > tbody > tr,
section.res_calendar .table > tfoot > tr {
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
section.res_calendar .table > thead > tr > th,
section.res_calendar .table > tbody > tr > th,
section.res_calendar .table > tfoot > tr > th,
section.res_calendar .table > thead > tr > td,
section.res_calendar .table > tbody > tr > td,
section.res_calendar .table > tfoot > tr > td {
  text-align: left;
  padding: 15px 10px;
  vertical-align: top;
  border-top: 0;
  font-size:14px;
  line-height: 1.5em;
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
section.res_calendar .table > thead > tr > th {
  font-weight: 400;
  font-family: 'Montserrat_M';
  color: #021e50;
  vertical-align: bottom;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
section.res_calendar .table > thead > tr > th:first-child{
 text-align: center;
}
section.res_calendar .table > tbody > tr > td:first-child{
 text-align: center;
 font-family: 'Montserrat_M';
}

section.res_calendar .table > thead > tr > th:last-child{
 text-align: center;
}
section.res_calendar .table > tbody > tr > td:last-child{
 text-align: center;
 font-family: 'Montserrat_M';
}
section.res_calendar .table > tbody > tr:last-child{
 border-bottom:10px solid #28487b ; 

}
section.res_calendar .table > caption + thead > tr:first-child > th,
section.res_calendar .table > colgroup + thead > tr:first-child > th,
section.res_calendar .table > thead:first-child > tr:first-child > th,
section.res_calendar .table > caption + thead > tr:first-child > td,
section.res_calendar .table > colgroup + thead > tr:first-child > td,
section.res_calendar .table > thead:first-child > tr:first-child > td {
  border-top: 0;
}
section.res_calendar .table > tbody + tbody {
  border-top: 1px solid rgba(0, 0, 0, 0.12);
}
section.res_calendar .table .table {
  background-color: #fff;
}
section.res_calendar .table .no-border {
  border: 0;
}
section.res_calendar .table-condensed > thead > tr > th,
section.res_calendar .table-condensed > tbody > tr > th,
section.res_calendar .table-condensed > tfoot > tr > th,
section.res_calendar .table-condensed > thead > tr > td,
section.res_calendar .table-condensed > tbody > tr > td,
section.res_calendar .table-condensed > tfoot > tr > td {
  padding: 0.8rem;
}
section.res_calendar .table-bordered {
  border: 0;
}
section.res_calendar .table-bordered > thead > tr > th,
section.res_calendar .table-bordered > tbody > tr > th,
section.res_calendar .table-bordered > tfoot > tr > th,
section.res_calendar .table-bordered > thead > tr > td,
section.res_calendar .table-bordered > tbody > tr > td,
section.res_calendar .table-bordered > tfoot > tr > td {
  border: 0;
  border-bottom: 1px solid #e0e0e0;
}
section.res_calendar .table-bordered > thead > tr > th,
section.res_calendar .table-bordered > thead > tr > td {
  border-bottom-width: 2px;
}
section.res_calendar .table-striped > tbody > tr:nth-child(odd) > td,
section.res_calendar .table-striped > tbody > tr:nth-child(odd) > th {
  background-color: #f5f5f5;
}
section.res_calendar .table-hover > tbody > tr:hover > td,
section.res_calendar .table-hover > tbody > tr:hover > th {
  background-color: rgba(0, 0, 0, 0.12);
}
@media screen and (max-width: 768px) {
  section.res_calendar .table-responsive-vertical > .table {
    margin-bottom: 0;
    background-color: transparent;
  }
  section.res_calendar .table-responsive-vertical > .table > thead,
  section.res_calendar .table-responsive-vertical > .table > tfoot {
    display: none;
  }
  section.res_calendar .table-responsive-vertical > .table > tbody {
    display: block;
  }
  section.res_calendar .table-responsive-vertical > .table > tbody > tr {
    display: block;
    border: 1px solid #e0e0e0;
    border-radius: 2px;
    margin-bottom: 1.6rem;
  }
  section.res_calendar .table-responsive-vertical > .table > tbody > tr > td {
    background-color: #fff;
    display: block;
    vertical-align: middle;
    text-align: right;
  }
  section.res_calendar .table-responsive-vertical > .table > tbody > tr > td[data-title]:before {
    content: attr(data-title);
    float: left;
    font-size: inherit;
    font-weight: 400;
    color: #021e50;
  }
  section.res_calendar .table-responsive-vertical.shadow-z-1 {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  section.res_calendar .table-responsive-vertical.shadow-z-1 > .table > tbody > tr {
    border: none;
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
    -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
  }
 section.res_calendar .table-responsive-vertical > .table-bordered {
    border: 0;
  }
  section.res_calendar .table-responsive-vertical > .table-bordered > tbody > tr > td {
    border: 0;
    border-bottom: 1px solid #e0e0e0;
  }
  section.res_calendar .table-responsive-vertical > .table-bordered > tbody > tr > td:last-child {
    border-bottom: 0;
  }
  section.res_calendar .table-responsive-vertical > .table-striped > tbody > tr > td,
  section.res_calendar .table-responsive-vertical > .table-striped > tbody > tr:nth-child(odd) {
    background-color: #fff;
  }
  section.res_calendar .table-responsive-vertical > .table-striped > tbody > tr > td:nth-child(odd) {
    background-color: #f5f5f5;
  }
  section.res_calendar .table-responsive-vertical > .table-hover > tbody > tr:hover > td,
  section.res_calendar .table-responsive-vertical > .table-hover > tbody > tr:hover {
    background-color: #fff;
  }
  section.res_calendar .table-responsive-vertical > .table-hover > tbody > tr > td:hover {
    background-color: rgba(0, 0, 0, 0.12);
  }
}
/*pagination*/
section.res_calendar [data-pagination],
section.res_calendar [data-pagination] *,
section.res_calendar [data-pagination] *:before,
section.res_calendar [data-pagination] *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-kerning: auto;
}
section.res_calendar [data-pagination] {
  width:100%;
  font-size: 8px;
  line-height: 1;
  font-weight: 400;
  font-family: 'Montserrat_M';
  -webkit-text-size-adjust: 100%;
  margin: 1em auto;
  text-align: center;
  transition: font-size .2s ease-in-out;

}
section.res_calendar [data-pagination] ul {
  list-style-type: none;
  display: inline;
  font-size: 85%;
  margin: 0;
  padding: .5em;
}
section.res_calendar [data-pagination] ul li {
  display: inline-block;
  font-size: 100%;
  float:none;
  width: auto;
  border-radius: 3px;
}
section.res_calendar [data-pagination] > a {

  font-size: 140%;
}
section.res_calendar [data-pagination] a {
  color: #fff;
  opacity: 0.6;
  font-size: 100%;
  padding: .5em;
}
section.res_calendar [data-pagination] a img{ width:30px;  position: relative; top:8px;}
section.res_calendar [data-pagination] a:focus,
section.res_calendar [data-pagination] a:hover {
  color: #fff;
  opacity: 0.9;
}
section.res_calendar [data-pagination] li.current {
  background: rgba(0,0,0,.1);
  line-height:1.5em;
}
/* Disabled & Hidden Styles */
section.res_calendar [data-pagination] .disabled,
section.res_calendar [data-pagination] [hidden],
section.res_calendar [data-pagination] [disabled] {
  opacity: .5;
  pointer-events: none;
}
@media (max-width: 320px) {
  section.res_calendar [data-pagination] {
    font-size: 10pt;
      }
 section.res_calendar [data-pagination] ul{position: relative;
    top:-3px;}
  [data-pagination] a{padding:0.2em;}
  div.calendar div.ca_arrows img.left{ top:10px}
  div.calendar div.ca_arrows img.right{ top:10px; right:20px;}
}
@media (max-width: 350px) {
 section.res_calendar [data-pagination] {
    font-size: 10pt;
      }
 section.res_calendar [data-pagination] ul{position: relative;
    top:-3px;}
  div.calendar div.ca_arrows img.left{ top:10px}
  div.calendar div.ca_arrows img.right{ top:10px}
}
@media (min-width: 500px) {
 section.res_calendar [data-pagination] {
    font-size: 12pt;

  }

 section.res_calendar [data-pagination] ul{
 width:100%;
 height:auto;
 position: relative;
    top:0px;
  left:0px;}
}
@media (min-width: 700px) {
 section.res_calendar [data-pagination] {
    font-size: 14pt;
  }
}
@media (min-width: 900px) {
 section.res_calendar [data-pagination] {
    font-size: 16pt;
  }
}



/*search*/
section.res_calendar .jTermau_searchform {
  background-color: #28487b;  
  margin: 0 auto;
  width:100%;
  float: left;
  margin-top: 2%;
}
section.res_calendar .jTermau_searchform select {
  width: 24%;
  padding:8px 12px;
}
section.res_calendar .jTermau_searchform option {
  width: 24%;
}
section.res_calendar .jTermau_searchformContainer {  
  width: 100%;
  margin: 0 auto;
  padding: 1%;
}

section.res_calendar input[type="text"].jTermau_textInput {
  border: none;
  overflow: hidden;
  text-overflow: ellipsis;
  width:49%;
  margin-left:0%;
  margin-right:1%;
  padding:8px 12px;
  font-size:14px;
  background:#fff;
  line-height:0.7em;
}

section.res_calendar .jTermau_sendButton {
  width:24%;
  cursor: pointer;
  margin-right:0px;
  background-color:#345a99;
  border:none;
  box-shadow: 0px 5px 10px #2d4f88;
  color:white;
  padding:8px 12px;
  text-transform:uppercase;
  font-family: 'Montserrat_M';
  font-size:14px;
}

