@charset "utf-8";

/* 個別モーダル */

#reinousha .modal-btn  {width: 270px; margin: 0 auto;}
#reinousha .modal-btn a {display: block; margin: 50px auto 0;padding: 10px;text-align: center;background-image: linear-gradient(to bottom, #d87f64, #aa4527);font-size: 20px;display: block;border: 2px solid #9a493f;border-radius: 30px;font-family: '游明朝', 'Yu Mincho', YuMincho, serif;font-weight: bold;text-shadow: 1px 1px 2px #572924, 0 0 1em #572924, 0 0 0.2em #572924;}

@media only screen and (max-width: 599px){
#reinousha .modal-btn a {display: block; margin: 20px auto 0;}}

.modal-open{}
.modal-container{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);padding: 40px 20px;overflow: auto;opacity: 0;visibility: hidden;transition: .3s;box-sizing: border-box;z-index: 9999;}
.modal-container:before{content: "";display: inline-block;vertical-align: middle;height: 100%;}
.modal-container.active{opacity: 1;visibility: visible;display: flex;}
.modal-body{position: relative !important;display: inline-block !important;vertical-align: middle !important;}


.modal-container .modal-close{
  margin-top: 15px;
  display:inline-block;
  cursor:pointer;
  padding:5px;
	width: 30px;
	height: 30px;
	position: relative;
	border: 1px solid #808080;
}

.modal-container .modal-close::before,
.modal-container .modal-close::after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 84%;
	height: 8%;
	margin: -8% 0 0 -42%;
	background: #f5f5f5;
}

.modal-container .modal-close::before {
	transform: rotate(-45deg);
}
.modal-container .modal-close::after {
	transform: rotate(45deg);
}


.modal-container .modal-body .modal-content {display: block;width: 100px;font-size: 14px;line-height: 35px;text-align: center; cursor: pointer;background-position: center bottom;background-color: #040404;background-image: url(/images/common/modal-bg.jpg);padding: 1px;cursor: default;}

.modal-container .modal-body .modal-content .inner {padding: 0 10px;box-shadow: 5px 3px 27px 5px #040404 inset;}

.modal-content{position: fixed;top: 50%!important;left: 50%!important;transform: translate(-50%, -50%);color: #FFF;max-width: 400px; min-width: 300px;}
.modal-content .tit-reservation {background: linear-gradient(#fff0 59%, #333 40%);font-size: 23px;margin-bottom: 20px;font-family: '游明朝', 'Yu Mincho', YuMincho, serif;width: 40%;margin: 0 auto 20px;text-shadow: 1px 1px 2px #000, 0 0 1em #000, 0 0 0.2em #000;font-weight: bold;}
.modal-content a {text-decoration: none;display: block;}
.modal-content ul {display: flex;list-style-type: none;gap: 0 10px;}
/*.modal-content ul li {flex: 1;x}*/

.modal-content .btn-phone,.modal-content .btn-mypage {
  font-size: 15px;
  margin: 20px auto;
  padding: 5px 10px;
  text-align: left;
  border-radius: 5px;
  display: block;
  font-weight: bold;
  line-height: 1.8;
}

.modal-content .btn-mypage {
  background-image: linear-gradient(to bottom, #d87f64, #aa4527);
  border: 2px solid #9a493f;
  font-family: '游明朝', 'Yu Mincho', YuMincho, serif;
  text-shadow: 1px 1px 2px #572924, 0 0 1em #572924, 0 0 0.2em #572924;
}

.modal-content .btn-phone {
  background-image: linear-gradient(to bottom, #76324b,#5f112e);
  border: 2px solid #60112e;
  font-family: '游明朝', 'Yu Mincho', YuMincho, serif;
  text-shadow: 1px 1px 2px #60112e, 0 0 1em #60112e, 0 0 0.2em #60112e;
  }

.modal-content .btn-member {
  background-image: linear-gradient(to bottom, #b58c1a,#645119);
  border: 2px solid #645119;
  font-family: '游明朝', 'Yu Mincho', YuMincho, serif;
  text-shadow: 1px 1px 2px #645119, 0 0 1em #645119, 0 0 0.2em #645119;
  font-size: 20px;
  font-weight: bold;
  border-radius: 5px;
  padding-top: 10px;
}

.modal-content .btn-member span {
display: block;
  position: relative;
  width: 180px;
  margin: 0 auto;
  font-size: 18px;
}

.modal-content .btn-member span::before,
.modal-content .btn-member span::after {
  position: absolute;
  width: 100%;
  height: 1px;
  content: '';
  background: #b3a855;
}

.modal-content .btn-member span::before {
  top: 0;
  left: 0;
}

.modal-content .btn-member span::after {
  right: 0;
  bottom: 0;
}

.modal-content .btn-mypage span,.modal-content .btn-phone span {
  display: block;
  width: 42px;
  text-align: center;
  font-size: 10px;
  line-height: 1.8;
    font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}

.modal-content .btn-mypage span {
  background-color: #733730;
}

.modal-content .btn-phone span {
    background-color: #2b0b17;
}

#reinousha-prof .modal-btn:hover, .modal-content .btn-phone:hover, .modal-content .btn-member:hover,.modal-content .btn-mypage:hover,.modal-close:hover {opacity: 0.65;}


/*
.modal-content .btn-member {
    position: relative;background-color: #000;margin: 0 2px;
  text-align: center;
  border-radius: 5px;
  background-image: linear-gradient(to bottom,#464646,#000);
  box-shadow: 0 0 10px #454048 inset;
  border: 1px solid #464646;
font-family: '游明朝',YuMincho,'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro',serif;
  font-weight: bold;font-size: 17px;line-height: 1.2;
  padding: 5px 0;}
/*





/*.modal-content .btn-mypage span {font-size: 14px;}
.modal-content .btn-phone span,.modal-content .btn-member span {display: block;font-size: 12px;}
*/