@charset "utf-8";

/*    Contents
---------------------------------------------------------------------------

  HOME              [ / ]
  商品一覧            [ /products/list ]
  商品詳細            [ /products/detail/ ]
  カテゴリー            [ /user_data/category ]
  よくあるご質問          [ /user_data/faq ]
  取扱学校一覧          [ /user_data/school ]
  お店紹介            [ /help/about ]
  学校選択            [ /mypage/select_school ]

------------------------------------------------------------------------ */

/* ========================================================================
  HOME              [ / ]
======================================================================== */
#homepage{
	overflow:hidden;
	padding:160px 0 0 0;
}

@media screen and (max-width: 767px) {
#homepage{
	padding:0;
}
}


/* ----------------------------------------
  home_key
---------------------------------------- */
.home_key {
  max-width: 1440px;
  margin: 0 auto 100px;
  padding: 0 20px;
}

.home_key .inner {
  display: flex;
  align-items: center;
  width: auto;
  height: 670px;
  background: url(../../img/home/bg_key.png) no-repeat center;
  background-size: cover;
  border-radius: 10px;
}

.home_key .block {
  width: 1080px;
  margin: 0 auto;
}

.home_key .block p {
  font-size: 2rem;
  line-height: 4rem;
}

.home_key .block p.lead {
  padding: 0 0 15px 0;
  font-size: 6rem;
  font-weight: 500;
  line-height: 7.4rem;
  letter-spacing: 0.3em;
}

@media screen and (max-width: 767px) {
  .home_key {
    max-width: none;
	margin-bottom: 30px;
    padding: 0 15px;
  }

  .home_key .inner {
    height: auto;
    min-height: 200px;
  }

  .home_key .block {
    width: auto;
    margin: 0;
    padding: 20px 15px;
  }

  .home_key .block p {
    text-shadow: 0 0 10px rgba(255, 255, 255, 1);
    font-size: 1.6rem;
    line-height: 3.2rem;
  }

  .home_key .block p.lead {
    padding: 0 0 2px 0;
    font-size: 3rem;
    line-height: 4rem;
  }
}

/* ----------------------------------------
  home_information
---------------------------------------- */
.home_information{
	padding:0 0 100px 0;
}

@media screen and (max-width: 767px) {
.home_information{
	padding:0 0 10px 0;
}
}


/* ----------------------------------------
  home_login
---------------------------------------- */
.home_login{
	padding:100px 0;
	background:#e7f7f5;
}

.home_login p{
	margin:0 0 50px 0;
	text-align:center;
	font-size:2.0rem;
	line-height:3.8rem;
}

.home_login ul{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:20px 40px;
}

@media screen and (max-width: 767px) {
.home_login{
	padding:30px 0 10px 0;
}

.home_login p{
	margin:0 0 20px 0;
	font-size:1.8rem;
	line-height:3.6rem;
}

.home_login ul{
	display:block;
}

.home_login ul li{
	margin:0 0 20px 0;
}
}


/* ----------------------------------------
  joy
---------------------------------------- */
#homepage .joy{
	min-height:562px;
	margin:0 0 120px 0;
	background:url(../../img/home/bg_joy.png) no-repeat center;
	background-size:cover;
}

#homepage .joy .inner{
	padding:50px 0 50px 660px;
}

#homepage .joy .inner > img{
	position:absolute;
	top:-40px;
	right:50%;
	margin:0 -50px 0 0;
	border-radius:14px;
}

#homepage .joy h2{
	margin:0 0 40px 0;
	padding:0;
}
#homepage .joy h2::before{ content:none; }

@media screen and (max-width: 767px) {
#homepage .joy{
	min-height:auto;
	margin:0;
}

#homepage .joy .inner{
	padding:30px 15px;
}

#homepage .joy .inner > img{
	display:block;
	position:static;
	margin:0 0 20px 0;
}

#homepage .joy h2{
	margin:0 0 20px 0;
}
}


/* ========================================================================
  商品一覧            [ /products/list ]
======================================================================== */
#product_list .txt {
  padding: 0 0 120px 0;
  text-align: center;
}

#product_list .txt p {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4.4rem;
}

#product_list .txt p.note {
  color: #13b2b9;
}

@media screen and (max-width: 767px) {
  #product_list .inner {
    padding: 0 15px;
  }

  #product_list .txt {
    padding: 0 0 30px 0;
  }

  #product_list .txt p {
    font-size: 1.6rem;
    line-height: 2.125;
  }
}

/* ----------------------------------------
  widget_name
---------------------------------------- */
#product_list .widget_name {
  background: #e7f7f5;
}

/* ----------------------------------------
  result
---------------------------------------- */
#product_list .result {
  padding: 60px 0 120px 0;
}

#product_list .result p {
  padding: 0 0 60px 0;
  text-align: center;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 3.4rem;
}

@media screen and (max-width: 767px) {
  #product_list .result {
    padding: 30px 0 10px 0;
  }

  #product_list .result p {
    padding: 0 0 20px 0;
    font-size: 2rem;
    line-height: 3rem;
  }
}

/* list
---------------------------------------- */
#product_list .result .list{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:45px;
	margin:0 0 60px 0;
}

#product_list .result .list li{
	width:330px;
}

#product_list .result .list a{
	display:block;
	font-size:1.8rem;
	line-height:2.8rem;
	text-decoration:none;
}
#product_list .result .list a:hover{ color:#333333; }

#product_list .result .list img{
	border-radius:5px;
}

#product_list .result .list .name{
	padding:15px 0 10px 0;
	font-weight:700;
	transition-duration:0.2s;
}
#product_list .result .list a:hover .name{
	color:#13b2b9;
	text-decoration:underline;
}

#product_list .result .list .price{
	text-align:right;
}

@media screen and (max-width: 767px) {
#product_list .result .list{
	grid-template-columns:repeat(2,1fr);
	gap:30px 15px;
	margin:0 0 30px 0;
}

#product_list .result .list li{
	width:auto;
}

#product_list .result .list a{
	font-size:1.6rem;
	line-height:2.6rem;
}

#product_list .result .list img{
	display:block;
	margin:0 auto;
}

#product_list .result .list a:hover .name{
	color:#333333;
	text-decoration:none;
}

#product_list .result .list .price{
	font-size:1.4rem;
	line-height:2.4rem;
}
}


/* ========================================================================
  商品詳細            [ /products/detail/ ]
======================================================================== */
#product_detail .column {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  #product_detail .column {
    display: block;
  }
}

/* ----------------------------------------
  gallery
---------------------------------------- */
#product_detail .gallery {
  width: 500px;
  padding: 0 0 100px 0;
}

#product_detail .gallery span {
  overflow: hidden;
  display: block;
  border-radius: 10px;
}

#product_detail .gallery ul {
  display: flex;
  flex-wrap: wrap;
}

#product_detail .gallery ul li {
  width: 110px;
  margin: 20px 20px 0 0;
  cursor: pointer;
  transition-duration: 0.2s;
}
#product_detail .gallery ul li:hover {
  opacity: 0.8;
}
#product_detail .gallery ul li:nth-child(4n) {
  margin-right: 0;
}

@media screen and (max-width: 767px) {
  #product_detail .gallery {
    width: auto;
    padding: 0 0 30px 0;
  }

  #product_detail .gallery img {
    display: block;
    margin: 0 auto;
  }

  #product_detail .gallery ul {
    margin: 0 -5px;
  }

  #product_detail .gallery ul li {
    width: 25%;
    margin: 10px 0 0 0;
    padding: 0 5px;
  }
}

/* ----------------------------------------
  detail
---------------------------------------- */
#product_detail .detail {
  width: 540px;
  padding: 0 0 100px 0;
}

#product_detail .detail table {
  margin: 0 0 60px 0;
}

#product_detail .detail table tr {
	border-bottom:2px solid #e6eeed;
}
#product_detail .detail table tr:first-child th,
#product_detail .detail table tr:first-child td {
	padding-top:0;
}

#product_detail .detail table th {
  width: 100px;
  padding: 30px 0;
  text-align: left;
  vertical-align: middle;
  font-size: 1.8rem;
  color: #00acb3;
  line-height: 1;
}

#product_detail .detail table td {
  padding: 30px 0;
}

#product_detail .detail table td span {
  display:block;
  font-size:1.4rem;
  line-height:2.4rem;
}

#product_detail .detail table td input {
  width: 140px;
  height: 42px;
  margin: 0;
  background: #ffffff;
  border: 2px solid #13b2b9;
  border-radius: 4px;
}

@media screen and (max-width: 767px) {
  #product_detail .detail {
    width: auto;
    padding: 0;
  }

  #product_detail .detail table {
    margin: 0 0 20px 0;
    font-size: 1.4rem;
    line-height: 2.4rem;
  }
  #product_detail .detail table th {
    width: 80px;
	padding:20px 0;
  }
  #product_detail .detail table td {
	padding:20px 0;
  }
}


/* btn
---------------------------------------- */
#product_detail .detail .btn{
	display:flex;
	justify-content:center;
}

#product_detail .detail .btn a{
	display:flex;
	justify-content:center;
	align-items:center;
	position:relative;
	width:240px;
	height:42px;
	padding:0 8px 0 0;
	background:#ffffff;
	border:2px solid #13b2b9;
	border-radius:4px;
	font-size:1.4rem;
	color:#13b2b9;
	line-height:1;
	text-decoration:none;
	transition-duration:0.2s;
}

#product_detail .detail .btn a::before{
	content:"";
	position:absolute;
	top:0;
	right:12px;
	width:8px;
	height:100%;
	background:url(../../img/common/arrow.png) no-repeat center;
	background-size:8px auto;
}

#product_detail .detail .btn img{
	margin:0 8px 0 0;
	transition-duration:0.2s;
}

#product_detail .detail .btn a:hover{
	background:#13b2b9;
	color:#ffffff;
}
#product_detail .detail .btn a:hover::before{ background-image:url(../../img/common/arrow_on.png); }
#product_detail .detail .btn a:hover img{ opacity:1; filter:brightness(0) invert(1); }

@media screen and (max-width: 767px) {
#product_detail .detail .btn{
	margin:0 0 30px 0;
}
}


/* widget_select
---------------------------------------- */
#product_detail .detail .widget_select {
  width: 180px;
  height: 42px;
  margin: 0 0 10px 0;
  padding: 0 10px;
}

#product_detail .detail .widget_select::before {
  width: 29px;
  height: 38px;
}

#product_detail .detail .widget_select::after {
  right: 10px;
  width: 9px;
  background-size: 9px auto;
}

#product_detail .detail .widget_select select,
#product_detail .detail .widget_select select option {
  height: 38px;
  font-size: 1.4rem;
}


/* ----------------------------------------
  widget_btn
---------------------------------------- */
#product_detail .widget_btn {
  padding: 0 0 120px 0;
}

@media screen and (max-width: 767px) {
  #product_detail .widget_btn {
    padding: 0 0 30px 0;
  }
}

/* ========================================================================
  カテゴリー            [ /user_data/category ]
======================================================================== */
#user_data .category ul {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0 106px 0;
}

#user_data .category ul li {
  width: 25%;
  line-height: 4.4rem;
}

#user_data .category ul li::before {
  content: '・';
}

#user_data .category ul li a {
  text-decoration: none;
}

@media screen and (max-width: 767px) {
  #user_data .category ul {
    padding: 0 0 10px 0;
  }

  #user_data .category ul li {
    width: 33.33%;
    padding: 0 10px 20px 1em;
    text-indent: -1em;
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
}

/* ========================================================================
  よくあるご質問          [ /user_data/faq ]
======================================================================== */
#user_data .faq dl {
  padding: 0 0 90px 0;
}

#user_data .faq dl dt {
  position: relative;
  padding: 0 0 10px 30px;
  font-weight: 500;
}

#user_data .faq dl dd {
  position: relative;
  margin: 0 0 30px 0;
  padding: 0 0 30px 30px;
  border-bottom: 1px dotted #cacaca;
}

#user_data .faq dl dt::before,
#user_data .faq dl dd::before {
  content: 'Q.';
  position: absolute;
  top: 7px;
  left: 0;
  font-size: 2rem;
  font-weight: 500;
  color: #13b2b9;
  line-height: 1;
}

#user_data .faq dl dd::before {
  content: 'A.';
}

@media screen and (max-width: 767px) {
  #user_data .faq dl {
    padding-bottom: 10px;
  }

  #user_data .faq dl dd {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
}

/* ========================================================================
  取扱学校一覧          [ /user_data/school ]
======================================================================== */
#user_data .school .inner > section {
  padding: 0 100px 60px;
}

#user_data .school table {
  margin: 0 0 60px 0;
}

#user_data .school table th {
  padding: 5px 0;
  border: 1px solid #cacaca;
}

#user_data .school table td {
  padding: 5px 0;
  width: 120px;
  border: 1px solid #cacaca;
  text-align: center;
}

@media screen and (max-width: 767px) {
  #user_data .school .inner > section {
    padding: 0 0 30px 0;
  }
  #user_data .school .inner > section:last-of-type {
    padding-bottom: 0;
  }

  #user_data .school table {
    margin: 0 0 30px 0;
    font-size: 1.4rem;
    line-height: 2.4rem;
  }

  #user_data .school table th {
    padding: 5px;
  }

  #user_data .school table td {
    width: auto;
    padding: 5px;
  }
}

/* ========================================================================
  特定商取引法に基づく表記          [ /help/tradelaw ]
======================================================================== */
#help_tradelaw .tradelaw .inner > section {
  padding: 0 100px 60px;
}

/*#help_tradelaw .tradelaw table {
  margin: 0 0 60px 0;
}*/

#help_tradelaw .tradelaw table th {
  padding: 5px 0;
  border: 1px solid #cacaca;
}

#help_tradelaw .tradelaw table td {
  padding: 5px 0;
  width: 120px;
  border: 1px solid #cacaca;
  text-align: center;
}

@media screen and (max-width: 767px) {
  #help_tradelaw .tradelaw .inner > section {
    padding: 0 0 30px 0;
  }
  #help_tradelaw .tradelaw .inner > section:last-of-type {
    padding-bottom: 0;
  }

  #help_tradelaw .tradelaw table {
    margin: 0 0 30px 0;
    font-size: 1.4rem;
    line-height: 2.4rem;
  }

  #help_tradelaw .tradelaw table th {
    padding: 5px;
  }

  #help_tradelaw .tradelaw table td {
    width: auto;
    padding: 5px;
  }
}

/* ========================================================================
  お店紹介            [ /help/about ]
======================================================================== */
#help_about .inner > section {
  padding: 0 0 120px 0;
}
#help_about .inner > section:last-of-type {
  padding: 0;
}

#help_about .column {
  display: flex;
  align-items: flex-start;
  margin: 0 50px 60px;
}

#help_about .column > img {
  margin: 0 60px 0 0;
}

#help_about .column table tr {
  border-bottom: 1px dotted #cacaca;
}

#help_about .column table th {
  width: 140px;
  padding: 10px 2em 10px 0;
  text-align: left;
  vertical-align: top;
  font-weight: 500;
  white-space: nowrap;
}

#help_about .column table td {
  padding: 10px 0;
}

#help_about .map {
  text-align: center;
}

@media screen and (max-width: 767px) {
  #help_about .inner > section {
    padding: 0 0 60px 0;
  }

  #help_about .column {
    display: block;
    margin: 0 0 20px 0;
  }

  #help_about .column > img {
    display: block;
    margin: 0 auto 10px;
  }

  #help_about .column table th {
    display: block;
    width: auto;
    padding: 10px 0 0 0;
  }

  #help_about .column table td {
    display: block;
    padding: 0 0 10px 0;
  }
}

/* ========================================================================
  学校選択            [ /mypage/select_school ]
======================================================================== */
#mypage_select_child .ec-off2Grid__cell, 
#mypage_select_school .ec-off2Grid__cell {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

#mypage_select_child .ec-off2Grid__cell a,
#mypage_select_school .ec-off2Grid__cell a {
  display: inline-block;
  position: relative;
  margin: 0 25px;
  padding: 0 0 0 20px;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 5.4rem;
  text-decoration: none;
}

#mypage_select_child .ec-off2Grid__cell a::before,
#mypage_select_school .ec-off2Grid__cell a::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 100%;
  background: url(../../img/common/arrow.png) no-repeat center;
  background-size: 10px auto;
}

@media screen and (max-width: 767px) {
  #mypage_select_child,
  #mypage_select_school {
    padding: 0 0 10px 0;
  }

  #mypage_select_child .ec-off2Grid__cell a,
  #mypage_select_school .ec-off2Grid__cell a {
    margin: 0 15px 20px;
    padding: 0 0 0 18px;
    font-size: 1.8rem;
    line-height: 2.6rem;
  }

  #mypage_select_child .ec-off2Grid__cell a::before,
  #mypage_select_school .ec-off2Grid__cell a::before {
    width: 8px;
    background-size: 8px auto;
  }
}

/* ========================================================================
  新規会員登録            [ /entry ]
======================================================================== */
#entry h2 {
  margin: 0 0 20px 0;
}

#entry .txt {
  padding: 0 0 10px 0;
  text-align: center;
}

#entry .txt p {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4.4rem;
}

#entry .txt p.note {
  color: #13b2b9;
}

@media screen and (max-width: 767px) {
  #entry .inner {
    padding: 0 15px;
  }

  #entry .txt {
    padding: 0 0 30px 0;
  }

  #entry .txt p {
    font-size: 1.6rem;
    line-height: 2.125;
  }
}

/* ========================================================================
  マイページ            [ /mypage/change ]
======================================================================== */
#mypage_change h2 {
  margin: 0 0 20px 0;
}

#mypage_change .txt {
  padding: 0 0 10px 0;
  text-align: center;
}

#mypage_change .txt p {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 4.4rem;
}

#mypage_change .txt p.note {
  color: #13b2b9;
}

#mypage_change .alert {
  color: #de5d50;
}

@media screen and (max-width: 767px) {
  #mypage_change .inner {
    padding: 0 15px;
  }

  #mypage_change .txt {
    padding: 0 0 30px 0;
  }

  #mypage_change .txt p {
    font-size: 1.6rem;
    line-height: 2.125;
  }
}

/* ========================================================================
  マイページ            [ /mypage/reserve ]
======================================================================== */

/*****
navi
*****/

.reserveNavi-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: -2em;
}
.reserveNavi-list li {
  margin-right: 3rem;
}
.reserveNavi-list li a {
  display: inline-block;
  position: relative;
  padding: 0 0 0 20px;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 5.4rem;
  text-decoration: none;
  cursor: pointer;
}
.reserveNavi-list li a::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 100%;
  background: url(../../img/common/arrow.png) no-repeat center;
  background-size: 10px auto;
}

@media screen and (max-width: 767px) {
  .reserveNavi-list {
    margin-top: 0em;
    margin-left: -1%;
  }
  .reserveNavi-list li {
    width: 49%;
    margin-right: 0;
    margin-bottom: 5px;
    margin-left: 1%;
  }
  .reserveNavi-list li a {
    display: block;
    padding: 1.25em 0 1.2em 1.5em;
    font-size: 1.4rem;
    line-height: 1rem;
    background-color: #f5f5f5;
    border-radius: 5px;
    border: 1px solid #ccc;
  }
  .reserveNavi-list li a::before {
    top: 0;
    left: 0.5em;
  }
  .reserveNavi-list li.is-active a {
    background-color: #13b2b9;
    color: #fff;
  }
  .reserveNavi-list li.is-active a::before {
    filter: brightness(1000%);
  }
}

/******
reserveContent
*****/

.reserveContent {
  padding-top: 4em;
}
.reserveContent-container {
  display: flex;
  justify-content: space-between;
}
.reserveContent-upper {
  width: 50%;
}
.reserveContent-lower {
  width: 45%;
}

/*
header
*/

.reserveContent-header {
  display: flex;
  justify-content: space-between;
  padding-bottom: 1em;
}
.reserveContent-header-upper {
  padding-top: 0.4em;
}
.reserveContent-header-lower {
}

.reserveContent-calSelect {
  display: flex;
}
.reserveContent-calSelect-cal {
}
.reserveContent-calSelect-date {
  height: 46px;
  font-size: 18px;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  margin: 0;
  padding: 0 1em;
}

.reserveContent-calSelect-control button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  border: none;
  box-shadow: none;
  border-radius: 0;
  background-color: #ddd;
  width: 46px;
  height: 46px;
}

.reserveContent-calSelect-control svg {
  fill: #555;
  width: 14px;
  height: 14px;
}

@media screen and (max-width: 767px) {
  .reserveContent-lower {
    padding-top: 2em;
  }
  .reserveContent {
    padding-top: 2em;
  }
  .reserveContent-container {
    display: block;
  }
  .reserveContent-upper {
    width: auto;
  }
  .reserveContent-lower {
    width: auto;
  }

  /*
  header
  */
  .reserveContent-header {
    display: block;
  }

  .reserveContent-calSelect {
    display: flex;
  }
  .reserveContent-calSelect-date {
    font-size: 16px;
  }
}

/******
reserveForm
*****/

.reserveForm {
  padding-bottom: 5em;
}
.reserveForm-item {
  padding-bottom: 1.5em;
}
.reserveForm-item dt {
  font-size: 1.7rem;
  font-weight: 500;
  border-left: 3px solid #13b2b9;
  line-height: 1.2;
  margin-bottom: 1em;
  padding-left: 0.5em;
}
.reserveForm-item dd {
}
.reserveForm-accent {
  display: inline-block;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.2;
}

.reserveForm-choice {
  display: flex;
  flex-wrap: wrap;
}
.reserveForm-choice input {
  display: none;
}
.reserveForm-choice label {
  display: inline-block;
  padding: 0.2em 1em 0.3em;
  background-color: #e7f7f5;
  background-color: rgba(255, 95, 8, 0.2);
  border-radius: 5px;
  margin: 0 10px 10px 0;
  font-weight: 500;
}
.reserveForm-choice input:checked + label {
  color: #fff;
  background-color: #13b2b9;
}
.reserveForm-choice input:disabled + label {
  background-color: #f5f5f5;
  color: #ccc;
  cursor: not-allowed;
}

.reserveForm-select {
  height: 46px;
  border: 1px solid #aaa;
  border-radius: 5px;
  min-width: 240px;
  font-size: 16px;
  box-shadow: none;
  background: none;
}

.reserveForm-submit {
  padding-top: 1em;
}
.reserveForm-submit.is-center {
  padding-top: 4em;
  text-align: center;
}
.reserveForm-submit-btn {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  border: none;
  box-shadow: none;
  border-radius: 0;
  background-color: #525263;
  border-radius: 5px;
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  width: 100%;
  max-width: 22em;
  padding: 1.5em 1em;
}
.reserveForm-submit-btn:hover {
  background-color: #13b2b9;
}

/*
comfirm
*/

.reserveForm-confirm {
  border-top: 1px solid #aaa;
  margin-top: 2em;
}
.reserveForm-confirm tr {
  border-bottom: 1px solid #aaa;
}
.reserveForm-confirm th {
  padding: 1em 0;
  width: 15em;
  text-align: left;
  color: #13b2b9;
  font-weight: 500;
}
.reserveForm-confirm td {
  padding: 1em 0;
  font-weight: 500;
}

@media screen and (max-width: 767px) {
  .reserveForm-choice label {
    margin: 0 5px 5px 0;
  }
  .reserveForm-submit {
    padding-top: 1em;
    text-align: center;
  }

  /*
  comfirm
  */

  .reserveForm-confirm {
    font-size: 1.2rem;
  }
  .reserveForm-confirm tr {
  }
  .reserveForm-confirm th {
    padding: 1em 0;
    width: 10em;
  }
  .reserveForm-confirm td {
    font-weight: 500;
  }
}

/***********
reserveCalendar
************/

.reserveCalendar {
}
.reserveCalendar-table {
  width: 100%;
  border: 1px solid #ccc;
  table-layout: fixed;
}
.reserveCalendar-table th,
.reserveCalendar-table td {
  border: 1px solid #ccc;
}

.reserveCalendar-table thead th {
  background-color: #f5f5f5;
  padding: 0.2e 0;
  font-weight: 500;
}
.reserveCalendar-table thead th.reserveCalendar-week-san {
  color: #e00;
}
.reserveCalendar-table thead th.reserveCalendar-week-sat {
  color: #00e;
}

.reserveCalendar-table tbody td {
}
.reserveCalendar-table tbody td .reserveCalendar-day-btn {
  display: block;
  color: #333;
  text-decoration: none;
  text-align: center;
  padding: 0.5em 0;
}

.reserveCalendar-day-box {
  width: 100%;
  min-height: 80px;
  padding-top: 0.5em;
  line-height: 1;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}
.reserveCalendar-day-date {
  position: absolute;
  left: 2px;
  top: 2px;
  font-size: 16px;
  white-space: nowrap;
}

.reserveCalendar-day-btn {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  border: none;
  box-shadow: none;
  border-radius: 0;
  width: 100%;
}

.reserveCalendar-day-inner {
}
.reserveCalendar-day-icon {
  display: block;
  font-size: 2rem;
  font-weight: 700;
  color: #13b2b9;
}
.reserveCalendar-day-text {
  display: block;
  font-weight: 500;
  font-size: 1.5rem;
  color: #13b2b9;
}

.reserveCalendar-table tbody td.is-today {
  background-color: #e7f7f5;
}
.reserveCalendar-table tbody td.is-disabread .reserveCalendar-day-btn {
  pointer-events: none;
}
.reserveCalendar-table tbody td.is-disabread .reserveCalendar-day-icon,
.reserveCalendar-table tbody td.is-disabread .reserveCalendar-day-text {
  color: #aaa;
}

@media screen and (max-width: 767px) {
  .reserveCalendar-table thead th {
    font-size: 1.2rem;
  }
  .reserveCalendar-day-box {
    min-height: 50px;
  }
  .reserveCalendar-day-date {
    left: 2px;
    top: 2px;
    font-size: 1.1rem;
  }

  .reserveCalendar-day-inner {
  }
  .reserveCalendar-day-icon {
    font-size: 1.6rem;
  }
  .reserveCalendar-day-text {
    font-size: 1.1rem;
    white-space: nowrap;
  }
}

#reserve_form .txt {
  padding: 30px 0 10px 0;
  text-align: center;
}

#reserve_form .txt p {
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 3rem;
}

#reserve_form .txt_cancel {
  padding: 30px 0 10px 0;
  /*text-align: center;*/
}

#reserve_form .txt_cancel p {
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 3rem;
}

#reserve_form p.note {
  color: #ff0000;
}