@charset "UTF-8";

/* 共通 
------------------------------------------------------------*/

.cas {
  text-align: center; /*中央寄せ*/
}

.cas:before{/*疑似要素*/
  content: 'candy shop with cafe restaurant';
  color: rgba(133,143,140,0.8); /*文字色*/
  font-size: 0.7em; /*サイズ*/
  display: block; /*改行するように*/
}

/* フォーム */
.inq	{display: inline-block;
	padding: 15px 15px 0 15px;
	color: #ffffff;
	}

.inq i	{margin-left: 10px;
background-color: ;
}

/* 申し込み 赤 */
.req {display: inline-block;
    margin-top: 5px;
	padding: 10px 50px 10px 53px;
	border-radius: 2px;
	background-color: #F7402C;
	font-weight: bold;
	color: #ffffff}

.req i	{margin-left: 10px;
      margin-right: 10px;
}

.req a:hover {background-color: #eeeeee!important;
        }


/* 申し込み rakuten */
.req-rakuten {display: inline-block;
    margin-top: 5px;
	padding: 15px 60px 15px 63px;
	border-radius: 2px;
	background-color: #669900;
	font-weight: bold;
	color: #ffffff}

.req-rakuten i	{margin-left: 10px;
      margin-right: 10px;
}

.req-rakuten a:hover {background-color: #eeeeee!important;
        }


/* 申し込み Airbnb */
.req-Airbnb {display: inline-block;
    margin-top: 5px;
	padding: 15px 60px 15px 63px;
	border-radius: 2px;
	background-color: #00708B;
	font-weight: bold;
	color: #ffffff}

.req-Airbnb i	{margin-left: 10px;
      margin-right: 10px;
}

.req-Airbnb a:hover {background-color: #eeeeee!important;
        }

/* ページネーション foot */
.pagenation	{text-align: center}

.pagenation ul	{display: inline-block;
	margin: 0 5px 35px 20px;
	padding: 0;
	list-style: none}

.pagenation li a	{display: block;
	margin-left: 4px;
	margin-right: 4px;
	margin-bottom: 10px;
	padding: 5px 10px;
	border: solid 1px #aaaaaa;
	color: #000000;
	font-size: 13px;
	text-decoration: none}

.pagenation li a.active	{color: #ffffff; background-color: #bbb}

.pagenation li a:hover	{color: #ffffff; background-color: #bbb}

.pagenation ul:after	{content: "";
	display: block;
	clear: both}

.pagenation li	{float: left;
	width: auto}




/* 記事 
------------------------------------------------------------*/
.kiji h1	{margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	color: rgba(120,158,145,1); /*#789E91*/
}



.kiji h2	{margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
	font-size: 15px;
	font-weight: bold}

.kiji h2 i	{margin-right: 7px;
	color: #888888}

.kiji h3	{margin-top: 15px;
	margin-bottom: 5px;
	text-align: center;
	font-size: 15px;
	font-weight: bold}

.kiji h4	{margin-top: 10px;
	margin-bottom: 5px;
	font-size: 18px;
	font-weight: bold}
	
.kiji p	{max-width: 100%;
	margin-top: 0;
	margin-bottom: 20px}
	
.kiji p i {margin-left: 7px;
      margin-right: 5px;
	color: }

.kiji .lead	{max-width: 800px;
	font-size: 20px;
	color: #444444}

.kiji .tanka	{
    text-align: center;
	font-size: ;
	font-weight: bold;
	color: #212222}

.kijiimg	{max-width: 100%;
	height: auto;
	margin-bottom: 20px}



/* 1組 */
.kiji-1set {
	margin-bottom: 30px}
	
.kiji-1set p {max-width: 100%;
    text-align: center;
	margin: 0 130px;
	}
	
.kiji-1set p.bot20 {max-width: 100%;
    text-align: center;
	margin: 0 130px 20px 130px;
	}

.kiji-1set h1 {
    margin: 0 0 30px 0;
    padding: 10px 20px;
	border: solid 1px #cccccc;
	text-align: center;
	font-size: 20px;
	font-weight: bold}

/*.kiji-1set h1	{margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
	font-size: 22px;
	font-weight: }*/

.kiji-1set h2	{margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
	font-size: 17px;
	font-weight: bold}

.kiji-1set h3	{margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
	font-size: 16px;
	font-weight: bold}

/* 左寄せ*/
.kiji-1setA {
	margin-bottom: 30px}
	
.kiji-1setA p {max-width: 100%;
    text-align: left;
	margin: 0 50px 10px 55px;
	}
	
.kiji-1setA h1 {
    margin: 0 0 30px 0;
    padding: 10px 20px;
	border: solid 1px #cccccc;
	text-align: center;
	font-size: 20px;
	font-weight: bold}

.kiji-1setB p {max-width: 100%;
    text-align: right;/* 右寄せ*/
	margin: 0 50px 10px 55px;
	}

	
/* 新着情報ページ
------------------------------------------------------------*/
.dateimg {max-width: 100%;
	height: auto;
	margin: 20px 0}
	
.date {margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
	font-size: ;
	font-weight: }
	
.date time {
	font-size: 13px;
	text-decoration: underline;
	 }
	 
	 
/*  2組 kiji-R/L
------------------------------------------------------------*/

/* 右画像 */
.kiji-R	{padding: 0 0 0 0;
	}
.kiji-R .text	{float: none;
	width: auto;
	margin-left: 5px}

.kiji-R img	{max-width: 100%;
	height: auto;
	border: none;
	margin: 0;
	vertical-align: bottom}


/* 左画像 */
.kiji-L	{padding: 0 0 0 0;
	}
.kiji-L .text	{float: none;
	width: auto;
	margin-right: 5px}

.kiji-L img	{max-width: 100%;
	height: auto;
	border: none;
	margin: 0;
	vertical-align: bottom}


/*  3組
------------------------------------------------------------*/
.pickup a	{display: block;
	background-color: #773F43; /*#222222 */
	color: #ffffff;
	text-align: center;
	text-decoration: none}

.pickup a:hover	{opacity: 0.8}

.pickup i	{display: block;
	padding-top: 40px;
	padding-bottom: 40px;
	font-size: 38px}

.pickup .fa-database	{background-color: #bfbd13}

.pickup .fa-bar-chart-o	{background-color: #c58839}

.pickup .fa-envelope	{background-color: #859f46}

.pickup h1	{margin-top: 0;
	margin-bottom: 0;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
	font-size: 16px;
	font-weight: normal}

.pickup p	{margin-top: 0;
	margin-bottom: 0;
	padding: 15px;
	background-color: #524e3c;
	text-align: center;
	color: #ffffff;
	font-size: 13px}


/*  box
------------------------------------------------------------*/
.box7 {padding: 0;
	margin: 0 20px 20px 20px;
	background-color:  rgba(120,158,145,0.1)
	}

.box4	{padding: 0;
	margin: 0 20px 20px 20px;
	background-color:  rgba(120,158,145,0.3)}

.box4-1	{padding-bottom: 20px}

.box-2set	{padding: 20px 0;
	margin: 0 20px 20px 20px;
	background-color:  }

.box-2seta	{padding: 0 0 20px 0;
	margin: 0 20px 20px 20px;
	background-color:  }

.box6 {padding: 20px 15px 0 15px}
.box6a {padding: 0 15px 0 15px}
.box6b {margin-bottom: 50px;
padding: 0 15px 0 15px}

.box6-1, .box6-2, .box6-3
	{padding-bottom: 10px}


/*  NEWS
------------------------------------------------------------*/

.news-A	{padding: 10px 50px;
	border: solid 5px #eee}

.news-A h1	{margin-top: 0;
	margin-bottom: 1px;
	font-size: 14px;
	text-align: center;
	color: rgba(120,158,145,1)}
	
.news-A ul	{margin: 0;
	padding: 0;
	list-style: none}

.news-A li a	{display: block;
	padding: 1px;
	border-bottom: ;
	color: #000000;
	font-size: 14px;
	text-align: center;
	text-decoration: none}

.news-A li a:hover {background-color: #ffffff;
     text-decoration: underline
}

.news-A p { margin-bottom: 1em;}


/*** 店舗情報 ***/

.face {
  width:100%;
  margin-bottom: 15px;
  overflow: hidden;
  word-break: break-all;
  word-wrap: break-word;
}
 
.face th{
  padding: 5px 0 5px 5px;
  width: 14%;
  overflow: hidden;
  color: #13131e;
  font-style: normal;
  font-weight: normal;
  font-size: 90%;
  text-align: left;
  word-break: break-all;
  word-wrap: break-word;
  vertical-align: top;
  background-color: ;
}
 
.face td{
padding: 5px;
text-align: left;
vertical-align: top;
font-size: 95%;
color: #000000;
background-color: #ffffff;
overflow: hidden;
word-break: break-all;
word-wrap: break-word;
}


/*** スケジュール ***/

.face-01 {
  width:100%;
  margin-bottom: 15px;
  border: 2px solid rgba(181,227,129,0.7);
  overflow: hidden;
  word-break: break-all;
  word-wrap: break-word;
}
 
.face-01 th{
  padding: 5px;
  border-top: solid 1px #ffffff;
  width: 20%;
  overflow: hidden;
  color: #000000;
  font-style: normal;
  font-weight: normal;
  font-size: 100%;
  text-align: left;
  word-break: break-all;
  word-wrap: break-word;
  vertical-align: top;
  background-color: rgba(181,227,129,0.7);
}
 
.face-01 td{
padding: 5px 5px;
text-align: left;
vertical-align: top;
font-size: 105%;
font-weight: ;
color: #000000;
background-color: #ffffff;
border-top: dotted 1px rgba(181,227,129,0.7);
overflow: hidden;
word-break: break-all;
word-wrap: break-word;
}

blockquote{
max-width: 600px;
padding: 20px 20px 5px 20px;
background-color: #eeeeee;

}

/*------------------------------------------------------------
フォント サイズ、カラー
-------------------------------------------------------------*/
.itempink{ color: #e9546b!important; font-weight: bold; }/*ピンク色*/
.black105{ color: #333!important; font-weight: bold; font-size: 105%;}/*黒色*/
.black{ color: #000!important; }/*黒色*/
.blacka{ color: #666!important; }/*黒色*/
.blackab{ color: #555!important; font-weight: bold; }/*黒色*/
.red{ color: #cc0000!important; }/*赤色*/
.redb{ color: #cc0000!important; font-weight: bold; }/*赤色*/
.redb105{ color: #cc0000!important; font-weight: bold; font-size: 105%; }/*赤色*/
.redb115{ color: #cc0000!important; font-weight: bold; font-size: 115%; }/*赤色*/
.blue{ color: #000099!important; }/*青色*/
.green{ color: #008000!important; }/*緑色*/
.greena{ color: rgba(130,182,74,1.0)!important; }/*緑色*/
.yellow{ color: #ffff00!important; }/*黄色*/
.navy{ color: #1F26A9!important; }/*紺色*/
.gray{ color: #ccc!important; }/*灰色*/
.orange{ color: #ff6600!important; }/*橙色*/
.purple{ color: #660099!important; }/*紫色*/
.olive{ color: #808000!important; }/*黄土色*/
.lime{ color: #00ff00!important; }/*黄緑*/
.aqua{ color: #167FA6!important; font-size: 14px;}/*水色*/

.small { font-size: 87%!important;}
.smallp { font-size: 90%!important; padding-top: 10px}
.smalla { font-size: 12px;}
.smallb { font-size: 10px;}
.middle { font-size: 16px;}


.large15 { font-size: 115%;}
.large20red { font-size: 120%; color: #cc0000}
.large20b { font-size: 120%;font-weight: bold;}
.large40b { font-size: 140%;font-weight: bold;}
.large80bred { font-size: 180%;font-weight: bold; color: #cc0000;text-decoration: underline;}

.right {text-align:right}
.center {text-align:center}

.normal { color: #333!important; font-weight: normal;}

/* 続きを読む */
.more	{display: inline-block;
    border-radius: 3px;
	padding: 3px 6px 3px 10px;
	background-color: #C1BEBA;
	color: #ffffff}

.more i	{margin-left: 10px}

/* youtube */
.youtube {
  position:relative;
  width:100%;
  padding-top:56.25%;
  margin:10px 0 30px 0;
  z-index: ;
}


.youtube iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
  
}

/* youtube60 */
.youtube60 {
  position:relative;
  width:100%;
  padding-top:56.25%;
  margin:10px 0 10px 0;
  z-index: ;
}


.youtube60 iframe{
  position:absolute;
  top:0;
  right:0;
  width:60%;
  height:60%;
}

/* ########### 359px以下 ########### */
@media (max-width: 359px) {
.kiji-1set .bot20 {
    text-align: left;
	margin: 0 0 15px 0;
	}

.youtube iframe{
  width: 100%;
  height: auto;
}

}


/* ########### 599px以下 ########### */
@media (max-width: 599px) {

.pagenation li a	{display: block;
	margin-left: 5px;
	margin-right: 5px;
	padding: 5px 10px;
	border: solid 1px #aaaaaa;
	color: #000000;
	font-size: 10px;
	text-decoration: none}

/* 記事 */
.kiji h1	{font-size: 18px}

.kiji h2	{font-size: 14px}

.kiji .lead	{font-size: 13px}

.kiji, .kiji-1set, .date h2 {font-size: 13px}

.kiji-1set h1	{
	font-size: 18px;
	}
	
.kiji-1set p {
	margin: 0;
	text-align: left;
	}

.kiji-1set p.bot20 {
    text-align: left;
	margin: 0 0 15px 0;
	}

.kiji-1setA p {
	margin: 0 0 10px 0;
	text-align: left;
	font-size: 87%;
	}

.kiji-1setB p {
	margin: 0 0 10px 0;
	text-align: right;
	font-size: 87%;
	}

.kiji-R, .kiji-L {margin: 0; padding: 0}

.news-A	{padding: 10px 20px;}
.news-A li a	{font-size: 12px;}

.news-A p { margin-bottom: 1em;}

.face th{
  width:100%;
  font-size: 90%;
  display:block;
  margin: 0 auto;
  border:none;
  text-align: left;
  border-radius: 3px;
  background-color: #eeece4;
}

.face td{
  display: list-item;
  width: 100%;
  font-size: 90%;
  padding: 5px 3px 5px 2px;
  border-top: none !important;
}

.menu-cafe th{
  width:100%;
  font-size: 90%;
  display:block;
  padding-right: 5px;
  margin: 0 auto;
  border:none;
  text-align: left;
  border-radius: 3px;
  background-color: #eeece4;
}

.menu-cafe td{
  display: list-item;
  width: 100%;
  font-size: 90%;
  padding: 5px 3px 5px 2px;
  border-top: none !important;
}

.face-01 {
  border: none;
}

.face-01 th{
  width:100%;
  font-size: 90%;
  display:block;
  margin: 0 auto;
  border:none;
  border-radius: 3px;
}

.face-01 td{
  display: list-item;
  width: 100%;
  font-size: 100%;
  padding: 5px 3px 5px 2px;
  border-top: none !important;
}

.box4-2A, .box7-2A {
	padding: 0 10px 10px 10px;
	}


/* youtube */
.youtube60 {
  position:relative;
  width:100%;
  padding-top:56.25%;
  margin:10px 0 10px 0;
}


.youtube60 iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

}


/* ########### 600px以上 ########### */
@media (min-width: 600px) {

/* 概要を横に並べる設定 */
.boxA-1:after	{content: "";
	display: block;
	clear: both}

.boxA-1 .gaiyou	{float: left;
	width: 50%}

.boxA-1 .gaiyou:nth-child(odd)
	{padding-right: 15px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	clear: both}

.boxA-1 .gaiyou:nth-child(even)
	{padding-left: 15px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}


.news-A li a	{font-size: 13px; }

}


/* ########### 600px以上～767px以下 ########### */
@media (min-width: 600px) and (max-width: 767px) {

.kiji-R, .kiji-L {margin: 0;
padding: 0}

.box4-2A, .box7-2A {
	padding: 0 10px 10px 10px;
	}

.kiji-1set p {
	margin: 0;
	text-align: left;
	}

.kiji-1setA p {
	margin: 0;
	text-align: left;
	}

.kiji-1setB p {
	margin: 0;
	text-align: right;
	}

.face-01 {
  border: none;
}

.face-01 th{
  width:100%;
  font-size: 90%;
  display:block;
  margin: 0 auto;
  border:none;
  border-radius: 3px;
}

.face-01 td{
  display: list-item;
  width: 100%;
  font-size: 90%;
  padding: 5px 3px 5px 2px;
  border-top: none !important;
}


}


/* ########### 768px以上 ########### */
@media (min-width: 768px) {

/* BOX4-1とBOX4-2を横に並べる設定 */
.box4:after	{content: "";
	display: block;
	clear: both}

.box4-1	{float: left;
	width: 70%;
	padding-right: 35px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}

.box4-2	{float: left;
	width: 30%}

.box4-1A {float: left;
	width: 50%;
	padding: 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}

.box4-2A {float: left;
	width: 50%;
	padding-top: 40px;
	padding-left: 30px;
	padding-right: 30px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}
	
	
/* BOX7-1とBOX7-2を横に並べる設定 */
.box7:after	{content: "";
	display: block;
	clear: both}

.box7-1	{float: right;
	width: 80%;
	padding-left: 50px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}

.box7-2	{float: left;
	width: 20%}


.box7-1A {float: right;
	width: 50%;
	padding: 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}

.box7-2A {float: right;
	width: 50%;
	padding-top: 40px;
	padding-left: 30px;
	padding-right: 30px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}


/* BOX-2set-1とBOX-2set-2を横に並べる設定 */
.box-2set:after	{content: "";
	display: block;
	clear: both}

.box-2seta:after	{content: "";
	display: block;
	clear: both}

.box-2set-1	{float: left;
	width: 70%;
	padding-right: 35px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}

.box-2set-2	{float: left;
	width: 30%}

.box-2set-1A {float: left;
	width: 50%;
	padding-right: 5px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}

.box-2set-2A {float: left;
	width: 50%;
	padding-top: ;
	padding-left: 6px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}


/* BOX6-1、BOX6-2、BOX6-3を横に並べる設定
-------------------------------------*/
.box6:after	{content: "";
	display: block;
	clear: both}
	
.box6a:after	{content: "";
	display: block;
	clear: both}

.box6b:after	{content: "";
	display: block;
	clear: both}

.box6-1	{float: left;
	width: 32%;
	margin-right: 2%}

.box6-2	{float: left;
	width: 32%;
	margin-right: 2%}

.box6-3	{float: left;
	width: 32%}
	
}


/* ########### 1190px以上 ########### */
@media (min-width: 1190px) {

/* 全体の横幅を固定 */
.box4, .box7, .box-2set, .box-2seta, .box6, .box6a, .box6b
	{width: 1140px;
	margin-left: auto;
	margin-right: auto}


}