﻿@charset "UTF-8";
/* 画面幅別レイアウト設定 */
/* フォント設定 */
/* -------------------------------- */
/* コンテンツ用ボックス */
#contents {
  width: 100%;
  text-align: left;
  background-color: #D5CBB5; }
  #contents p {
    padding: 5px 20px; }
    @media screen and (min-width: 401px) and (max-width: 899px) {
      #contents p {
        padding: 5px 8px; } }
    @media screen and (max-width: 400px) {
      #contents p {
        padding: 5px 8px; } }

/*#contents .calendar {
    padding: 10px 50px;
}*/
.lesson {
  width: 800px;
  padding: 10px 25px;
  margin: 10px auto;
  background-color: #F7F2E6; }
  @media screen and (min-width: 401px) and (max-width: 899px) {
    .lesson {
      width: 96%;
      padding: 10px 8px; } }
  @media screen and (max-width: 400px) {
    .lesson {
      width: 96%;
      padding: 10px 4px; } }
  .lesson img {
    width: 100%;
    height: auto; }
  .lesson table {
    width: 800px; }
    @media screen and (min-width: 401px) and (max-width: 899px) {
      .lesson table {
        width: 100%; } }
    @media screen and (max-width: 400px) {
      .lesson table {
        width: 100%; } }
  .lesson table.price {
    width: 400px; }
    @media screen and (min-width: 401px) and (max-width: 899px) {
      .lesson table.price {
        width: 86%; } }
    @media screen and (max-width: 400px) {
      .lesson table.price {
        width: 100%; } }
    .lesson table.price td {
      border: none; }

.lesson td {
  vertical-align: top;
  border-bottom: 1px solid #A08563; }
  .lesson td + td {
    border: none; }

@media screen and (max-width: 400px) {
  td.naiyou .cell1 span {
    font-size: 10px;
    font-size: 1rem;
    font-weight: normal; } }

td.naiyou span {
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: normal; }

td.price-text {
  vertical-align: middle; }

.cell0 {
  width: 100px; }
  @media screen and (min-width: 401px) and (max-width: 899px) {
    .cell0 {
      width: 40%; } }
  @media screen and (max-width: 400px) {
    .cell0 {
      width: 40%; } }

.cell1 {
  width: 300px; }
  @media screen and (min-width: 401px) and (max-width: 899px) {
    .cell1 {
      width: 60%; } }
  @media screen and (max-width: 400px) {
    .cell1 {
      width: 60%;
      font-size: 12px;
      font-size: 1.2rem;
      font-weight: normal; } }

.lesson th {
  width: 150px;
  padding: 5px 0px;
  text-align: center; }
  @media screen and (min-width: 401px) and (max-width: 899px) {
    .lesson th {
      width: 30%; } }
  @media screen and (max-width: 400px) {
    .lesson th {
      width: 26%; } }

.lesson td.naiyou {
  padding: 5px 0px; }
  @media screen and (min-width: 401px) and (max-width: 899px) {
    .lesson td.naiyou {
      width: 70%; } }
  @media screen and (max-width: 400px) {
    .lesson td.naiyou {
      width: 74%; } }

.lesson table.lesson-time {
  width: 100%;
  text-align: center;
  margin-top: 16px; }

.lesson table.lesson-time,
.lesson table.lesson-time tr,
.lesson table.lesson-time th,
.lesson table.lesson-time td {
  border: 2px solid #000000;
  border-collapse: collapse;
  padding: 4px;
  vertical-align: middle; }

.lesson-time th {
  background-color: #A08563;
  color: #FFF;
  width: 150px; }
  .lesson-time th.cell2 {
    width: 32px; }
    @media screen and (min-width: 401px) and (max-width: 899px) {
      .lesson-time th.cell2 {
        width: 32px; } }
    @media screen and (max-width: 400px) {
      .lesson-time th.cell2 {
        width: 32px; } }

.lbg-g {
  background-color: #94dc80; }

.lbg-p {
  background-color: #cb8ae6; }

.lbg-b {
  background-color: #8db3ea; }

.lbg-o {
  background-color: #f6ad6d; }

.lbg-y {
  background-color: #e9df92; }

.point-area {
  margin-top: 16px;
  background-color: #ebe3cf;
  box-shadow: 5px 5px 5px rgba(104, 77, 57, 0.5); }
  .point-area span.font-b,
  .point-area span.font-red {
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold; }

.font-b::before {
  display: block;
  content: "";
  float: left;
  width: 104px;
  height: 64px;
  background-image: url("img/icon02.png");
  background-size: 104px 64px;
  background-repeat: no-repeat;
  margin: 10px 8px 0 0; }
