@charset "utf-8";
/* CSS Document */


a{
text-decoration: none;
}

.side-menu h2,
.side-menu h3{
	margin: auto;
	font-size: 1.4em;
	font-weight: bold;
	padding-bottom: 10px;
	border-bottom:.5px solid #ccc;
	line-height:100%;
}


.ttl-jp{
	font-size: 0.65em;
	color:#666;
	font-weight: normal;
	margin:0;
}


/*セール商品ボタンとか３点まとめ買い系ボタン*/
.side-menu{
	font-family:'游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	max-width:100%;
	color:#333;
	text-align: center;
	font-size:1.0em;
}

.side-menu .button{
	list-style: none;
	margin-bottom: 50px;
	font-weight:bold;
}

.side-menu .button p a{
	display: block;
	color:#fff;
	padding: 12px 0;
	margin-bottom: 10px;
	background-color: #00b0bd;
	position:relative;
	transition: 0.3s;
}

.side-menu .button p a:hover{
	display: block;
	color:#666;
	background-color:rgba(255,235,170,1.00);
	position:relative;
	transition: 0.3s;
	
}

.side-menu .button li a{
	display: block;
	color:#363636;
	background-color:#EFEFEF;
	margin-bottom: 10px;
	padding: 12px 0;
	position: relative;
	transition: 0.3s;
}

.side-menu .button li a:hover{
	display: block;
	color:#fff;
	background-color:rgba(66,181,189,0.5);
	position:relative;
	transition: 0.3s;
	
}

.side-menu .button p a:after,
.side-menu .button li a:after{
    font-weight: 900;
    content: " > ";
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -7px;
}


/* カテゴリ一覧*/

.dropmenu {
  list-style-type: none;
  width: 100%;
  margin: 0 auto 10px;
  padding: 0;
  background: #fff;
}

.dropmenu .cat {
  position: relative;
  top:0%;
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: center;
  border-bottom: 1px solid #ccc; 
}

.dropmenu .cat a{
  display: block;
  margin: 0;
  color: #333;
  line-height: 1;
}

.dropmenu .cat .main{
	display: flex;
    justify-content: flex-start;
	align-items: center;
	text-align: left;
}

.dropmenu .cat .main img{
	display: block;
    margin-right: 10px;
}


.dropmenu .cat .main:after {
   font-weight: 900;
   content: " > ";
   position: absolute;
   top: 50%;
   right: 10px;
   margin-top: -7px;
	
}

.dropmenu .cat .main:hover >a,
.dropmenu .cat .main:hover{ 
	display: flex;
    justify-content: flex-start;
	align-items: center;
	text-align: left;
	color:#fff;
	background-color:#aaa;
	transition: 0.3s;
}


.dropmenu .cat .item li:hover > a{
  background:#DFDCDC;
  color:#363636;
}

.dropmenu .cat .item {
  list-style: none;
  position: absolute;
  width: 210px;
  height: auto;
  top: 0;
  left: 100%;
  margin: 0;
  padding: 0;
  z-index: 10;
}

.dropmenu .cat .item li{
  overflow: hidden;
  width: 100%;
  height: 0;
  color: #363636;
}

.dropmenu li:hover .item li{
  overflow: visible;  
  height: auto;
  border-bottom: 1px solid #ccc; 
}

.dropmenu .cat .item li a{
  padding: 18px 8%;
  background:#EFEFEF;
  text-align: left;
  font-weight: normal;
}

 .guide-menu{
	border-bottom: #00b0bd solid  .5px;
	 line-height:120%;
	padding:5px;
	color: #00b0bd;
	position: relative;
	list-style: none;
	transition: 0.3s;
	display: flex;
    justify-content: center; /*左右中央揃え*/
    align-items: center;     /*上下中央揃え*/
}

.guide-menu i{
	width: 30%;
	text-align: center;
}

.guide-menu li{
	width: 100%;
	text-align: left;
	margin-top: 6px;
	display: block;
	font-weight:bold;
	font-wize:1.5em;
}

.guide-menu:hover {
	background-color:rgba(0,176,189,0.2);
}
.guide-menu .txt{
	display: block;
	padding-top:5px;
	font-size:0.85em;
	color:#666;
	font-weight:normal;
}

.guide-menu > a{
	display: block;
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.side-menu .guide-menu li :visited,
.side-menu .guide-menu li:active{
	color:#00b0bd;
}

.side-menu .guide-menu .txt :visited,
.side-menu .guide-menu .txt:active{
	color:#333;
}


.info{
	display: block;
	margin-top: 5px;
	padding:5px;
	font-size: 1em;
	list-style-type: none;
	text-align:left;
}

.info .shop{
	display:block;
	width: 100%;
	margin:5px auto 10px;
	text-align: center;
	font-size:1.2em;
	font-weight:900;
}

.info .note{
	display:block;
	text-align: justify;
    text-justify: inter-ideograph;
	width:100%;
	margin:10px auto;
	padding:5px;
	line-height:1.2em;
	font-size:0.9em;
	
}

.info .hour{
	text-align:left;
	padding:0 20px;
	margin:0 auto 5px;
	display:block;
	font-size:0.8em;
}
.info .day{
	text-align:left;
	padding:0 20px;
	margin:0 0 0 1px;
	display:block;
	font-size:0.8em;
}


.info .tel{
	display:block;
	font-size: 1em;
	font-weight: bold;
	margin-top: 5px;
	text-align:center;
	background:#666;
	padding:5px;
	color:#fff;
}

.info .tel01{
	display:block;
	font-size: 1.5em;
	font-weight: bold;
	margin-top: 5px;
	text-align:center;
}

.side-menu img{
    height:auto;
    max-width:100%;
    max-height:100%;
}

.side-guide{
	margin-bottom:50px;
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.side-menu{
		display: none;
}
}

