@charset "utf-8";

/** ***************************************************************************
 * 定数
 * ************************************************************************* */

:root {

  /**
   * 文字色
   */
  --color-basic: 0, 0, 0;

  /**
   * 配色
   */
  --accentcolor-1: xxx, xxx, xxx;

  /**
   * レイアウト用
   */
  --innerWidth: calc(100vw - calc(100vw - 100cqw));
  --innerCenter: calc(50% - calc(var(--innerWidth) / 2));

}

/** ***************************************************************************
 * タイトル
 * ************************************************************************* */

[class*="title-style"] + * {
  margin-top: 0;
}

/**
 * 1
 */

[class*="title-style-1"] {
}

@media screen and (min-width:768px) {
}

/** ***************************************************************************
 * テキスト
 * ************************************************************************* */

#main .align-center {
  text-align: center;
}

#main .align-center-sp {
  text-align: center;
}

#main .align-center-pc {
  text-align: inherit;
}

#main .memo {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

@media screen and (min-width:768px) {

  #main .align-center-sp {
    text-align: inherit;
  }

  #main .align-center-pc {
    text-align: center;
  }

  [href*="tel:"] {
    color: inherit;
    cursor: default;
    pointer-events: none;
    text-decoration: none !important;
  }

}

/** ***************************************************************************
 * ボタン
 * ************************************************************************* */

[class*="button-style"] {
  margin: 0;
  padding: 0;
  appearance: none;
  cursor: pointer;
  color: inherit;
  border: none;
  border-radius: 0;
  font: inherit;
  text-decoration: none !important;
  background: none;
  box-sizing: border-box;
  vertical-align: middle;
  display: inline-block;
}

[class*="button-style"]::-webkit-search-decoration {
  display: none;
}

[class*="button-style"]::focus {
  outline-offset: -2px;
}

/**
 * 1
 */

.button-style-1 {
  min-width: 170px;
  min-height: 35px;
  padding: 4px 10px 6px;
  letter-spacing: 1px;
  text-align: center;
  border: 1px solid #000;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition:
    color 0.3s ease-in-out 0.0s,
    background-color 0.3s ease-in-out 0.0s;
  color: #fff !important;
  background-color: #000;
}

.button-style-1:hover {
  color: rgb(var(--color-basic)) !important;
  background-color: #fff;
}

/**
 * 2
 */

.button-style-2 {
  min-width: 170px;
  min-height: 35px;
  padding: 4px 10px 6px;
  color: rgb(var(--color-basic)) !important;
  letter-spacing: 1px;
  text-align: center;
  border: 1px solid;
  background-color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.3s ease-in-out 0.0s;
  border-color: #fff;
}

.button-style-2:hover {
  border-color: #000;
}

/**
 * 3
 */

.button-style-3 {
  min-width: 170px;
  min-height: 35px;
  padding: 4px 10px 6px;
  letter-spacing: 1px;
  text-align: center;
  border: 1px solid #7f8f99;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition:
    color 0.3s ease-in-out 0.0s,
    background-color 0.3s ease-in-out 0.0s;
  color: #fff !important;
  background-color: #7f8f99;
}

.button-style-3:hover {
  color: rgb(var(--color-basic)) !important;
  background-color: #fff;
}

/**
 * 4
 */

.button-style-4 {
  min-width: 170px;
  min-height: 35px;
  padding: 4px 10px 6px;
  letter-spacing: 1px;
  text-align: center;
  border: 1px solid #a39c97;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition:
    color 0.3s ease-in-out 0.0s,
    background-color 0.3s ease-in-out 0.0s;
  color: #fff !important;
  background-color: #a39c97;
}

.button-style-4:hover {
  color: rgb(var(--color-basic)) !important;
  background-color: #fff;
}

/** ***************************************************************************
 * テーブル
 * ************************************************************************* */

[class*="table-style"] + * {
  margin-top: 1.125rem;
}

* + [class*="table-style"] {
  margin-top: 1.125rem;
}

@media screen and (min-width:1001px) {

  [class*="table-style"] + * {
    margin-top: 1.5rem;
  }

  * + [class*="table-style"] {
    margin-top: 1.5rem;
  }

}

/**
 * 1
 */

.table-style-1 th {
  color: #000000;
  background-color: #f4f3f2;
}

/* SP表示 */

@media screen and (max-width:1000px) {

  .table-style-1 {
    display: block;
  }

  .table-style-1 tbody {
    display: block;
  }

  .table-style-1 caption {
    margin-bottom: 20px;
    font-size: 1.25em;
    display: block;
  }

  .table-style-1 tr {
    display: block;
  }

  .table-style-1 tr ~ tr {
    margin-top: 1em;
  }

  .table-style-1 th {
    width: 100%;
    padding: 0 0 6px;
    border-bottom: 1px solid rgb(var(--accentcolor-1));
    display: block;
  }

  .table-style-1 td {
    width: 100%;
    padding: 6px 0 0;
    display: block;
  }

}

/* PC表示 */

@media screen and (min-width:1001px) {

  .table-style-1 {
    border-collapse: collapse;
    font-size: 1.214em;
  }

  .table-style-1 th {
    border-bottom: 1px solid #000000;
  }

  .table-style-1 td {
    border-bottom: 1px solid #000000;
  }
  .table-style-1 tr:first-child th {
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
  }

  .table-style-1 tr:first-child td {
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
  }

}

/**
 * 2
 */

.table-style-2 caption {
  line-height: 1.4;
  font-weight: 600;
}

/* SP表示 */

@media screen and (max-width:1000px) {

  .table-style-2 {
    display: block;
  }

  .table-style-2 tbody {
    display: block;
  }

  .table-style-2 caption {
    margin-bottom: 20px;
    font-size: 1.25em;
    display: block;
  }

  .table-style-2 tr {
    display: block;
  }

  .table-style-2 tr ~ tr {
    margin-top: 1.5em;
  }

  .table-style-2 th {
    width: 100%;
    padding: 0 0 6px;
    display: block;
  }

  .table-style-2 td {
    width: 100%;
    padding: 6px 0 0;
    display: block;
  }

}

/* PC表示 */

@media screen and (min-width:1001px) {

  .table-style-2 {
    border-collapse: collapse;
  }

  .table-style-2 caption {
    margin-bottom: 15px;
    font-size: 1.625em;
    text-align: left;
  }

}

/** ***************************************************************************
 * 表示／非表示
 * ************************************************************************* */

@media screen and (max-width:767px) {

  [pc] {
    display: none !important;
  }

}

@media screen and (min-width:768px) {

  [sp] {
    display: none !important;
  }

}