@charset "utf-8";
@import url(common.css);
@import url(side.css);
@import url(../text.css);
@import url(faq.css);
@import url(shoplist.css);
@import url(shop.css);
@import url(news.css);
@import url(company.css);
@import url(contact.css);


@media screen and (max-width:480px) { 
/*  【スマホ縦用】画面サイズが480pxまで  */

#instafeed_sp{
width:100%;
}


#instafeed_sp img{ 	
	width:30%;
	margin:1px;
 } 

#instafeed_hirasho_sp{
}


#instafeed_hirasho_sp img{ 
 } 



/* layout
-------------------------------- */


a{
	color:#e3007f;
}

h1{
	display:none;
	}

h2{
	padding-top: 20px;
	margin:0 0 20px 0;
}

h2 img{
	width:100%;
	height:auto;
	}

h3{
	background-image: url(../../images/h3_bg.png);
	background-repeat: no-repeat;
	height: 25px;
	width: auto;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 18px;
	color: #464646;
	padding-top: 25px;
	padding-left: 60px;
	margin-bottom: 20px;
	margin-top: 5px;
}



h4{
	font-size: 18px;
	font-weight: bold;
	color: #464646;
	padding-left: 30px;
	background-image: url(../../images/h4_parts.png);
	background-repeat: no-repeat;
	background-position: left center;
}




#Main {
	float: none;
	width: 90%;
	margin:auto;
	padding-bottom: 50px;
}




/* ヘッダーメニュー（１）*/

header #Wrapper nav {
	}


.menu-text {
	width:		100%;
	font-size:	11px;
	margin-top:	14px;
	color:		#ff0099;
	display:	block;
}

button.active .menu {
      display: none
    }
    
button.active .close {
      display: block
    }
	
	button .close {
      letter-spacing: 0.08em;
      display: none
    }
    
    button .menu {
      display: block
    }
	.drawer-toggle{
		color:#F15A24;
	}





h5{
	font-size: 18px;
	font-weight: bold;
	color: #333;
	padding-left: 15px;
	height: 24px;
	background-image: url(../../images/h5_bg.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	line-height: 24px;
	margin-top: 0px;
	padding-top: 0px;
	margin-bottom: 10px;
}






a img{
	border: 0;
}


p{
	margin:0 0 20px 0;
}


.mt5{
	margin-top:5px;
}

.mt20{
	margin-top:20px;
}

.mb5{
	margin-bottom:5px;
}

.mb10{
	margin-bottom:10px;
}

.mb15{
	margin-bottom:15px;
}

.mr8{
	margin-right: 8px;
}

.pt10{
	padding-top:10px;
}

.pt20{
	padding-top:20px;
}

.pt30{
	padding-top:30px;
}

.pr20{
	padding-right:20px;
}

.pb20{
	padding-bottom:20px;
}


.pb30{
	padding-bottom:30px;
}

.pb50{
	padding-bottom:50px;
}


/* 【TOPページ】メインイメージ */

#top_main_img{
	padding-top:0;
	padding-bottom:0;
}


#top_main_img img{
width: 100%;
height:auto;
margin-left: auto;
margin-right: auto;
}

/* 【TOPページ】お知らせ 店舗案内 よくあるご質問 求人情報の案内 */


#content01{
	padding: 0 0 20px 0;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}


/* お知らせ*/

.innner {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 75%;
}

.innner:before {
    content:"";
    display: block;
  padding-top: 121%; /* calc(画像高さ ÷ 画像横幅 × 100%) */
	}
	
.content {
    position: absolute;
    top: -100%;
	width: 100%;
    height: 85%;
}



#content01 .left{
	/*　floatを解除 */
	float: none;
	background-image: url(../../images/top_news_bg_sp.png);
	background-size: 100%;
	background-repeat: no-repeat;
	width: 100%;
	height: 0;
	margin-left: auto;
	margin-right: auto;
	padding-top: 121%; /* calc(画像高さ ÷ 画像横幅 × 100%) */
}


div.overflow_scroll{
	border: 1px;
	border-style: solid;
	border-color: #c0c0c0;
overflow: auto;　　　　/*tableをスクロールさせる*/
white-space: nowrap;　　/*tableのセル内にある文字の折り返しを禁止*/
	margin-left: auto;
	margin-right: auto;
	margin : 0 auto;
    padding : 0;
}




.overflow_scroll::-webkit-scrollbar{　　/*tableにスクロールバーを追加*/
 height: 5px;
}
.overflow_scroll::-webkit-scrollbar-track{　　/*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.overflow_scroll::-webkit-scrollbar-thumb {　　/*tableにスクロールバーを追加*/
 background: #BCBCBC;
}


#content01 .right{
	/*　floatを解除 */
	float: none;
	clear:both;
	width: 100%;
	margin-top: -20px;
}
	

#content01 .right #shoplist{
	width: 100%;
	height:auto;
}

#content01 .right #shoplist .shoplist{
	position: relative; /*DIV要素全体にリンクを効かせる*/
	padding-top: 0;
	padding-left: 3%;
	float: left;
	width: 50%;
	height:auto;
}

/*DIV要素全体にリンクを効かせる*/
#content01 .right #shoplist .shoplist a{ 
display: block;
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
}


#content01 .right #shoplist .shoplist a:hover{
    background-color:#FFF;
    filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}


#content01 .right #shoplist .garland01{
	padding-top: 10%;
	padding-right: 3%;
	float: right;
	width: 40%;
	height:auto;
}

#content01 .right #faq{
	clear:both;
}

#content01 .right #faq .garland02{
	margin-top:5%;
	padding-right: 3%;
	width: 40%;
	height:auto;
	float:left;
}

#content01 .right #faq .faq{
	position: relative;/*DIV要素全体にリンクを効かせる*/
	margin-top:-27%;
	padding-right: 3%;
	float:right;
	width: 50%;
	height:auto;
}


/*DIV要素全体にリンクを効かせる*/
#content01 .right #faq .faq a{ 
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
}


#content01 .right #recrut{
	clear:both;
	z-index:1;
	position:relative;
}

#content01 .right #recrut .recrut{
	position: relative; /*DIV要素全体にリンクを効かせる*/
	margin-top:-25px;
	padding-right: 2%;
	padding-left: 2%;
	width: 96%;
	height:auto;
	float:left;
}

/*DIV要素全体にリンクを効かせる*/
#content01 .right #recrut .recrut a{ 
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
}



#content01 .middle{
		width: auto;
		float:left;
		
			margin-left: auto;
	margin-right: auto;
	position:absolute;
}

	


#content01 .middle .shoplist{
	padding-left:5px;
	height:200px;
}


#content01 .middle .garland02{
	padding-left: 10px;
	height:74px;
}

#content01 .middle .recrut{
	margin-top:-10px;
	width: 100%;
	max-width: 390px;
	height:auto;
	max-height: 204px;
	margin-left: auto;
	margin-right: auto;
}

#content01 .right .garland01{
	padding-top: 15px;
	height:74px;
}

#content01 .right .faq{
	padding-top: 15px;
	height:207px;
}


/* 【TOPページ】Instargramの案内 */

#content02{
	padding: 10px 0;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;

}
#content02 .left{
	float:none;
	width: 100%;
	height: auto;
}

#content02 .left img{
width: 90%;
height:auto;
margin-bottom:10px;
}


#content02 .left img:after{
	display: block;
	content: "";
	height: 0;
	padding-top: 40%; /* calc(画像高さ ÷ 画像横幅 × 100%) */
}


#content02 .right{
	float:none;
	width: 100% !important;
	height: auto;
}

#right{
	width: 100%;
}




/* 【TOPページ】新商品の案内 */
#content03{
	width: 98%;
	height: auto;
	padding-bottom:0;
	background-image:none;

}

/* 
#content03 .navi{
	padding-left:59%;
	margin-top:-30%;
	width:90%;
	}
	

#content03 .navi img{
	width:40%;
	height:auto;
	}
 */


#content03 .outer .inner .sp{
	width: 85%;
margin-left: auto;
margin-right: auto;
}

#content03 .outer .inner img{
 width: 46%; 
height:auto;
margin-left: 5px;
margin-right: auto;
	padding-top:0;
	padding-bottom:0;
}

#content03 .outer img{
width: 100%;
height:auto;
margin-left: auto;
margin-right: auto;
	padding-top:0;
	padding-bottom:0;
}


#content03 .outer {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	background-size: 100%;
	width:100%;
	background:
	url(../../images/top_product_sp03.png) no-repeat bottom;
	background-size: contain;
}

#content03 .outer:before{
}

#content03 .outer:after{
	display: inline-block;
	content: "";
	height:0;
-webkit-background-size: 100%;
	padding-top: 22%; /* calc(画像高さ ÷ 画像横幅 × 100%) */
	margin-top:-4%;

}

#content03 .outer .inner {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	background: url(../../images/top_product_sp02.png) repeat-y 0 0;
	background-size: 100%;
	width:100%;
	margin-top:-2.5%;
	}


#content03 .outer .inner:before{
	display: inline-block;
	content: "";
	background-size: contain;
}

#content03 .outer .inner ul{
	width:80%;
	padding: 0 10% 0;
	list-style-type: none;
	margin:0;
	
	}
	
#content03 .outer .inner ul li{
	width: 100%;
	padding-right:30px;
	float: left;
	margin-left: auto;
	margin-right: auto;
	height: 50%;
	margin-top:0;
	margin-bottom:5%;
}

#content03 .outer .inner  ul li img{
		float: left;
	width: 50%;
	height:auto;
	margin-right:3%
}

#content03 .outer .inner ul p {
	margin:0;
	padding:0;
}


}