@charset "UTF-8";

/*----------------------------------------------------
               1. 基本設定
----------------------------------------------------*/
/* テキストの自動拡大を無効化 */
body {
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
}

/* リセット(margin&padding reset)
--------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
}
/* HTML5
-------------------------------------*/
article,aside,canvas,details,figcaption,figure, header,footer,main,menu,nav,section,summary {
	display: block;
}

/* ページ全体の設定 */
body {
	margin: 0;
	font-family: Hiragino Sans,Hiragino Kaku Gothic ProN,BIZ UDPGothic,Meiryo,sans-serif;
	color: #333333;
	background: linear-gradient(to bottom, #f7f4ea 0%,#e1d7d0 30%,#f3efe6 100%);
	font-size: 16px;
	letter-spacing: 0.05em;
	font-size: 14px;
	letter-spacing: 0.05em;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}

/* リンク */
a {
	color: #0287bf;
	text-decoration: none;
}

a:hover {
	opacity: 0.7;
}

h1 {
	font-size: 15px;
}

p {
	line-height: 1.5;
}

/* 画像 */
img {
	width: 100%;
	height: auto;
}

figure {
	margin: 0;
}
li {list-style: none;}/* link do not want a dot */

/* 汎用クラス
--------------------*/
/* 画面幅いっぱいにしたい要素にあてるクラス */
.widthMax { 
  margin: 0 calc(50% - 50vw);
}
.h100 {
    overflow-y: auto;
    min-height: 100vh;
}
.h100ver2 {
	/* overflow-y: auto; */
	min-height: calc(100vh - 288px);
	min-height: calc(100svh - 328px);
}

/*----------------------------------------------------
               2. レイアウト設定
----------------------------------------------------*/
/* 「ヘッダー」ブロック */
header {
	padding: 20px 0px 15px;
	color: #8f735e;
	font-size: 36px;
	font-weight: bold;
	text-align: center;
	/* background: #f5f1ee; */
	height: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-top: 3px solid #8f735e;
}
/* 「コンテンツ」ブロック */
.contents {
	padding: 0px 15px;
}

/* 「メイン (column)」 ブロック*/
main {
	/* background-color: #ffffff; */
	/* padding: 25px 5px; */
	margin: 10px 0 50px;
}
/* 「フッター」ブロック */
footer {
	/* background-color: #f5f1ee; */
	background-image: url("line5.svg");
	background-repeat: no-repeat;
	background-position: 60% top;
	background-size: cover;
	/* padding: 25px 15px 25px; */
	color: #ffffff;
	font-size: 15px;
	font-weight: bold;
	width: 100%;
	box-sizing: border-box;
	height: 180px;
	line-height: 80px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.secretLink {
    display: flex;
    justify-content: right;
}
.secretLink a{
	color: transparent;
	text-align: right;
	padding: 0 5px;
	margin: 0 10px;
}

.dividing-line {
	fill: #8f735e;
	display: block;
}

/*----------------------------------------------------
               3. ヘッダー詳細
----------------------------------------------------*/
.back-title {
	padding: 0;
	margin: 0;
}
.back-title p{
	font-size: 13px;
	font-weight: normal;
}


/*「ヘッダー」ブロック内のコンテナ */
header .container {
	display: flex;
	justify-content: space-between;
}

header .container section h1{
	margin: 12px;
	padding: 0.5rem 0 1rem;
	background: linear-gradient(90deg, #C780A9 0% 33%, #e8e833 33% 66%, #81c682 66%);
	background-size: 4rem 0.4rem;
	background-position: bottom;
	background-repeat: no-repeat;
	/* border-bottom: 1px dotted #7f5d43; */
}
header .container .back {
	margin: 0;
	padding: 0;
}
header .container .back a{
	margin: 0;
	padding: 0;
	color: #fff;
	font-weight: normal;
	font-size: 36px;
}
header .container .hbmn {
	margin: 0;
	padding: 0;
}
header .container .hbmn a{
	margin: 0;
	padding: 0;
	color: #fff;
	font-weight: normal;
}









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

               「マイページ」ページ

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

/* マイページ
-------------------------------------*/

/* マイページ：ログイン */
.myLogin {
	color: #333333;
	padding: 10px 20px 10px;
	box-sizing: border-box;
	border: 2px solid #ffffff;
	border-radius: 10px;
	background: #fbfbfb;
	margin-bottom: 10px;
	box-shadow: 0px 0px 0px 2px #d8c6b8, inset 0px 0px 10px 0px #8f735e;
}

.myLogin h2 {
    font-size: 22px;
    color: #425456;
    text-align: left;
    margin-bottom: 15px;
    width: 100%; /* IE11用の設定 */
    border-bottom: 2px solid #4f7277;
}

.myLogin p {
	font-size: 20px;
	color: #333333;
	font-weight: bold;
	margin-bottom: 10px;
}
.myLogin p span{
	font-size: 16px;
	color: #333333;
	font-weight: bold;
	margin-left: 1em;
}

.myLogin ul {
	list-style-type: none;
	padding: 0;
	color: #666666;
	font-size: 14px;
	display: block;
}
.myLogin ul li {
	margin-bottom: 7px;
	font-size: 16px;
}
.myLogin ul li:before {
	content: "●";
	color:#5787b7;
	padding-right:5px;
	font-size:18px;
}
.myLogin ul li ul{
	margin-left: 20px;
}
.myLogin ul li ul li a{
	color: #0287bf;
}

/* リスト表示*/

.globalNav  {

width: 100%;
}
ol.sample1,
ol.sample1 ol{
	counter-reset: list;
	list-style: none;
	padding: 0px 0px 0 7px;
	width: 100%;
	font-size: 11px;
}
ol.sample1 ol{
  margin: 0 0 0 15px;
  width: calc(100% - 20px);
  font-size: 11px;
  line-height: 20px;
}
ol.sample1 {
	position: relative;
}
ol.sample1:before {
    content: "PAGE LIST";
    position: absolute;
    display: block;
    top: -29px;
    left: -13px;
    background: #faf9f8;
    font-size: 12px;
    font-weight: bold;
    padding: 0 10px;
    color: #816246;
    text-shadow: 1px 1px #c7cbcf;
    display: none;
}

.sample1 a{
  position: relative;
  display: block;
  padding: 6px 0px 4px 26px;
  margin: 7px 0;
  background: #f3f3f3;
  color: #8f735e;
  font-weight: bold;
  text-decoration: none;
  border-radius: 5px;
  transition: background ease-in-out 0.3s;
}
 
.sample1 a:hover{
  background: #f0ebe2;
  opacity: 1;
}
 

 
.sample1 a:before{
  content: counter(list);
  counter-increment: list;
  position: absolute;
  top: 36%;
  left: -15px;
  height: 30px;
  width: 30px;
  margin-top: -15px;
  background: #8f735e;
  color: #fff;
  border: 2px solid #fff;
  font-weight: bold;
  border-radius: 26px;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -ms-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
  font-size: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 1px 0px 1px #d3d3d3;
}
.sample1 ol li a:before{
	  background: #318fbd;
	  color: #fff;
}
.sample1 a.spring:before{
	  background: #4caf50!important;
}
.sample1 a.summer:before{
	  background: #77b4ff!important;
}
.sample1 a.autumn:before{
	  background: #c38411!important;
}
.sample1 a.winter:before{
	  background: #ff9800!important;
}
.nowMaking {
    display: inline-flex;
    vertical-align: middle;
    padding: 2px 0px;
    margin-left: 3px;
    background: #c21313;
    border-radius: 2px;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    width: 40px;
    height: 20px;
    justify-content: center;
    align-items: center;
}
.icon-description {
    text-align: right;
}
.icon-item {display: inline-block;font-size: 13px;margin-right: 5px;}
.icon-description_text {margin-left: 3px;}

/* マイページ： お知らせ*/
.info {
	color: #333333;
	padding: 10px;
	box-sizing: border-box;
	border: 3px solid #B8860B;
}

.info h3{
	margin: 0 0 3px 0;
	font-size: 16px;
	color: #e2b229;
	font-family: sans-serif;
	text-align: left;
	font-weight: bold;
	width: 100%;
}


.info ul{
	margin: 2px 0;
	padding: 0;
}
.info li{
	display: flex;
	padding:0px;
}

.info .day{
	margin:0 10px 0 0;
}
.info .text{
 	word-break: break-all;
}
/* ナビ（サブ）ゲーションメニュー*/
.subNav ul {
	margin: 0;
	padding: 0px;
	list-style: none;
	background: #000;
}
.subNav ul li {
	margin: 0;
	padding: 0;
	text-align: center;
	border-top: 0px solid #FFFFFF;
	border-bottom: 1px solid #886911;
}
.subNav ul li a {
    display: block;
    padding: 10px;
    text-decoration: none;
    font-size: 16px;
    color: #fff;
    position: relative;
}
.subNav li a:after {
display: block;
    position: absolute;
    top: 50%;
    right: 10px;
    width: 6px;
    height: 6px;
    margin-top: -4px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    content: "";
}
/*----------------------------------------------------

               「会員様ログイン」ページ

----------------------------------------------------*/
/* 会員様ログイン：入力*/
.kaiinLogin {
	color: #333333;
	padding: 0px 10px;
	box-sizing: border-box;
}
.kaiinLogin h2 {
    font-size: 16px;
    color: #333333;
    font-family: sans-serif;
    text-align: center;
    margin: 0;
    padding: 10px;
    background: #ccc;
    border-top: 3px solid #353232;
    border-bottom: 3px solid #353232;
    width: 100%; /* IE11用の設定 */
}

.kaiinLogin p {
	font-size: 20px;
	color: #333333;
	font-weight: bold;
	margin-bottom: 10px;
}
/* 入力フォーム */
.form-horizontal {
	margin: 30px 0;
	padding: 0;	
}
.form-group {
	margin-bottom: 5px;
}
.form-group p{
	margin-bottom: 5px;
}
label {
	display: inline-block;
	max-width: 100%;
	margin-bottom:  10px;
	font-weight: bold;
}
.label-danger {
    background-color: #d9534f;
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
    margin-left: 5px;
}
input, textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 10px;
}
.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

textarea {
	height: 120px;
}

input[type="submit"] {
	background-color: #ffaa00;
	border: none;
	-webkit-appearance: none;
}


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

               testCSS

----------------------------------------------------*/
/* 予約一覧 */
.reservationList {
	display: flex;
	margin: 20px 0;
	padding: 0;
	box-sizing: border-box;
}
.reservationList figure {
	margin-right: 10px;
	width: 300px;

}
.reservationList figure img {
	vertical-align: top;
}
.reservationList .text_content {
	font-size: 13px;
}



/* ==== PC版==== */
@media (min-width: 1025px) {
/*----------------------------------------------------
               1. 基本設定（PC版 ）
----------------------------------------------------*/
h1 {
	font-size: 16px;
}

p {
	font-size: 16px;
}
/*----------------------------------------------------
               2. レイアウト設定（PC版 ）
----------------------------------------------------*/

/* PC版：コンテナ */
.container {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
}
/* PC版：「コンテンツ」ブロック内のコンテナ */
.contents .container {
	display: block;
}

/* PC版：「メイン (column)」 ブロック*/
main {
	width: 100%;
	box-sizing: border-box;
}
/* 「フッター」ブロック */
footer {
    background-position: 0% top;
}


/*----------------------------------------------------
               3. ヘッダー詳細（PC版）
----------------------------------------------------*/
/* PC版：「ヘッダー」ブロック内のコンテナ */
header .container section h1{
	margin: 7px;
	/* padding: 0; */
	/* background-size: 39px; */
}


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

               「マイページ」ページ

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

/* マイページ
-------------------------------------*/

/* マイページ：ログイン */
ol.sample1,
ol.sample1 ol{
	font-size: 14px;
	padding: 0 0 0 10px;
	width: calc(100% - 15px);
}
}
/* ===== PC版（大）の設定ここまで ===== */