@charset "UTF-8";
/* CSS Document */


body
 {
width: 100%;
height: auto;
margin: 0 auto;
background: none;/*#000033*/
padding:0; 
color: black;
}

div#wrapper {
	width: 100%;
	height: auto;
	float: left;
	background: none;
}


/* header */
head {
	z-index: 999;
}


div#entry a{
	color: white;
}


/* 問い合わせフォーム　*/
/* clearfix */
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

/* 親要素（中央寄せ用） */


.contact-banner-wrapper {
  display: flex;
  justify-content: center;
width:100%;
	height:auto;
	
  margin: 20px 0;
}

.contact-banner {
  background-color:#F7A003;
  color: #ffffff;
  text-align: center;
  padding: 15px 0;
  font-size: 1.2em;
  font-weight: bold;
  border-radius: 8px;
  width: 80%;
  max-width: 600px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}



/*1201px */
@media(min-width: 1201px) {
	
	
header {
	width: 100%;
	height: 60px;
	padding: 0px;
	float:  left;
	box-sizing: border-box;
	border-bottom: 1px solid black;
	background: none;
}

div.header{
	width: 100%;
	height: auto;
	float: left;
	padding: 0px;
	}
	
div.header p{
	width: 100%;
	text-align: left;
}


	div.top {
		width: 100%;
		height: 60px;
		float: left;
		background: none;
		vertical-align: middle;
		
	}
	
		div.top div {
			width:100%;
			height: auto;
			float: left;
			margin-top: 5px;
			
	}
		div.top div p{
			width: 100%;
			height: auto;
			text-align: center;
			display: flex;
			justify-content: center;
			background: none;
	}
	
	
			
.shop-image{
	width: 20%;
	height: auto;
	display: inline;
	}
		
	
.logo {
	width: auto;
	height: 50px;
	background: none;
	display: block;
	margrin: 0 auto;
}

	
.pr-image {
	width: 100%;
}


div#tab-box {
	width: 100%;
	background: rgba(0,0,0,7);
	float: left;
	padding: 10px 0px;	
	border-bottom: 5px solid white;
}

	
	div.header-menu{
		width: 100%;
		height: auto;
		float: left;
		background: none;
	}

/*		sp-menu.css		-------------------= */


ul#menu {
	width: 100%;
	height: 50px;
	padding: 10px 0px;
	float: left;
	list-style-type : none;
	background: white;
		display: flex;
		justify-content: center;
	z-index: 999;
	
}

ul#menu p{
	color: black;
}



ul#menu li {
	width: 80%;
	height: auto;
	text-align : center;
	box-sizing: border-box;
	float: left;
	background: none;
	font-size: 1rem;
	line-height: 1em;
	margin: 10px 0px;
}
	
	
#menu li a:after{content:"｜";
	
	float: left;
	position: absolute; /* 追加 */
	
	}

ul#menu li a {
	width: 100%;
	text-decoration : none;
	display : block;
	text-align: center;
	line-height: 1.5em;
	box-sizing: border-box;
	background: none;
	float: left;
	color: black;
}


ul#menu li a:hover {
	background :none;
	opacity : 0.9;
}

	

span.menu-title-text {
	font-size: 100%;
	font-weight: bold;
}



span.menu-text {
	width: 80%;
	height: auto;
	background: none;
	float: left;
	text-align: center;
	vertical-align: middle;
}


	
.icon-menu{
	width: 10%;
	height: auto;
	float: left;
	margin-left: 2%;
	background: none;
}

	

				/*				========- delivery-content (perfomance & delivery & online )*/
				
div.delivery-content {
width: 100%;
height: auto;
float: left;
}

div.delivery-content div{
width: 50%;
height: auto;
border-top: 1px solid whitesmoke;
padding: 10px 0px;
float: left;
}


div.delivery-content ul{
width: 90%;
height: auto;
display: block;
margin: 0 auto;
}

div.delivery-content ul li{
	width: 90%;
	height: auto;
	margin: 10px auto;
	display: block;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
	background: tan;
	text-align: center;
list-style-type: none;
}

div.delivery-content ul li a{
	display: block;
	width: 100%;
	height: auto;
	line-height: 3em;
	color: black;
}


/*  決定キー */

div.lead {
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 30px;
}

p#lead {
	width: 70%;
	height: auto;
	margin: 70px auto;
	display: block;
	text-align: center;
	font-size: 1.3rem;
	line-height: 2em;
	background: orange;
	color: white;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
}


p#lead a{
	width: 100%;
	height: auto;
	display: block;
	color:white;
}



/*footer*/

/*		========= フッター固定	=======*/

		footer{
			width: 100%;
			height: auto;
			float: left;
			margin-top: 30px;
			padding: 30px 0px;
			background: rgba(94,112,116,1.00);
		}		
		
		
		div#f-top {
			width: 100%;
			height: auto;
			float: left;
			padding: 10px 0px;
			background: rgba(31,203,91,1.00);
		}

		.f_logo{
			width: 20%;
			height: auto;
			display: block;
			margin: auto;
		
		}
.footer-icon {
	width: 20%;
	height: auto;
	display: block;
	margin: 0px auto;
}
	
}



@media(min-width: 1025px) and (max-width: 1200px){
	
header {
	width: 100%;
	height: 60px;
	padding: 0px;
	float:  left;
	box-sizing: border-box;
	border-bottom: 1px solid black;
	background: none;
}

div.header{
	width: 100%;
	height: auto;
	float: left;
	padding: 0px;
	}
	
div.header p{
	width: 100%;
	text-align: left;
}


	div.top {
		width: 100%;
		height: 60px;
		float: left;
		background: none;
		vertical-align: middle;
		
	}
	
		div.top div {
			width:100%;
			height: auto;
			float: left;
			margin-top: 5px;
			
	}
		div.top div p{
			width: 100%;
			height: auto;
			text-align: center;
			display: flex;
			justify-content: center;
			background: none;
	}
	
	
			
.shop-image{
	width: 20%;
	height: auto;
	display: inline;
	}
		
	
.logo {
	width: auto;
	height: 50px;
	background: none;
	display: block;
	margrin: 0 auto;
}

	
.pr-image {
	width: 100%;
}


div#tab-box {
	width: 100%;
	background: rgba(0,0,0,7);
	float: left;
	padding: 10px 0px;	
	border-bottom: 5px solid white;
}

	
	div.header-menu{
		width: 100%;
		height: auto;
		float: left;
		background: none;
	}

/*		sp-menu.css		-------------------= */


ul#menu {
	width: 100%;
	height: 50px;
	padding: 10px 0px;
	float: left;
	list-style-type : none;
	background: white;
		display: flex;
		justify-content: center;
	z-index: 999;
	
}

ul#menu p{
	color: black;
}



ul#menu li {
	width: 80%;
	height: auto;
	text-align : center;
	box-sizing: border-box;
	float: left;
	background: none;
	font-size: 1rem;
	line-height: 1em;
	margin: 10px 0px;
}
	
	
#menu li a:after{content:"｜";
	
	float: left;
	position: absolute; /* 追加 */
	
	}

ul#menu li a {
	width: 100%;
	text-decoration : none;
	display : block;
	text-align: center;
	line-height: 1.5em;
	box-sizing: border-box;
	background: none;
	float: left;
	color: black;
}


ul#menu li a:hover {
	background :none;
	opacity : 0.9;
}

	

span.menu-title-text {
	font-size: 100%;
	font-weight: bold;
}



span.menu-text {
	width: 80%;
	height: auto;
	background: none;
	float: left;
	text-align: center;
	vertical-align: middle;
}


	
.icon-menu{
	width: 10%;
	height: auto;
	float: left;
	margin-left: 2%;
	background: none;
}

	

				/*				========- delivery-content (perfomance & delivery & online )*/
				
div.delivery-content {
width: 100%;
height: auto;
float: left;
}

div.delivery-content div{
width: 50%;
height: auto;
border-top: 1px solid whitesmoke;
padding: 10px 0px;
float: left;
}


div.delivery-content ul{
width: 90%;
height: auto;
display: block;
margin: 0 auto;
}

div.delivery-content ul li{
	width: 90%;
	height: auto;
	margin: 10px auto;
	display: block;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
	background: tan;
	text-align: center;
list-style-type: none;
}

div.delivery-content ul li a{
	display: block;
	width: 100%;
	height: auto;
	line-height: 3em;
	color: black;
}


/*  決定キー */

div.lead {
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 30px;
}

p#lead {
	width: 70%;
	height: auto;
	margin: 70px auto;
	display: block;
	text-align: center;
	font-size: 1.3rem;
	line-height: 2em;
	background: orange;
	color: white;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
}


p#lead a{
	width: 100%;
	height: auto;
	display: block;
	color:white;
}



/*footer*/

/*		========= フッター固定	=======*/

		footer{
			width: 100%;
			height: auto;
			float: left;
			margin-top: 30px;
			padding: 30px 0px;
			background: rgba(94,112,116,1.00);
		}		
		
		
		div#f-top {
			width: 100%;
			height: auto;
			float: left;
			padding: 10px 0px;
			background: rgba(31,203,91,1.00);
		}

		.f_logo{
			width: 20%;
			height: auto;
			display: block;
			margin: auto;
		
		}
.footer-icon {
	width: 20%;
	height: auto;
	display: block;
	margin: 0px auto;
}	

}





/*781px */
@media(min-width: 781px) and (max-width: 1024px){



div#sp-icon {
	width : 50px;
	height : 50px;
	position : absolute;
	right : 0px;
	top : 0px;
	z-index : 999;
	background: black;
}

div#sp-icon:hover {
	cursor : pointer;
	opacity : 0.9;
}

div#sp-icon span,
div#sp-icon span:before,
div#sp-icon span:after {
	display : inline-block;
	width : 30px;
	height : 3px;
	background : white;
	transition-property : transform;
	transition-duration : 0.3s;
}

div#sp-icon span {
	position : absolute;
	left : 50%;
	top : 50%;
	transform : translate( -50%, -50% );
}

div#sp-icon span:before {
	content : "";
	position : absolute;
	transform : translateY( -10px ) rotate( 0deg );
}

div#sp-icon span:after {
	content : "";
	position : absolute;
	transform : translateY( 10px ) rotate( 0deg );
}


div.sp-close span {
	background : transparent !important;
}

div.sp-close span:before {
	transform : rotate( 45deg ) !important;
}

div.sp-close span:after {
	transform : rotate( -45deg ) !important;
}


	
	
/*----------header-----*/

header {
	
  width: 100%;
  height: 60px;
  background: white;
  color: white;
  position: fixed !important;  
  position: absolute;  
  top: 0;  
  float: left;
  box-sizing: border-box;
  padding: 0px 10px;
  z-index: 998;
}

div.header{
	width: 100%;
	height: auto;
	float: left;
	padding: 0px;
	}
	
div.header p{
	width: 100%;
	text-align: left;
}


	div.top {
		width: 100%;
		height: auto;
		float: left;
		background: none;
		
	}
	
		div.top div {
			
			width:100%;
			height: auto;
			float: left;
			box-sizing: border-box;
	}
		div.top div p{
			width: 100%;
			height: auto;
			text-align: center;
			display: flex;
			justify-content: center;
			background: none;
	}
	
	
			
.shop-image{
	width: 20%;
	height: auto;
	display: inline;
	}
		
	
.logo {
	width: auto;
	height: 50px;
	background: none;
	display: block;
	margrin: 0 auto;
}

	
.pr-image {
	width: 100%;
}


div#tab-box {
	width: 100%;
	background: rgba(0,0,0,7);
	float: left;
	padding: 10px 0px;	
	border-bottom: 5px solid white;
}


/*		sp-menu.css		-------------------= */
ul#menu {
	width: 100%;
	height: auto;
	float: left;
	list-style-type : none;
	background:rgba(255, 255, 255,1.0);
	position : absolute;
	left : 0px;
	top : 0px;
	z-index : 999;
	display : none;
}

ul#menu p{
	color: black;
}



ul#menu li {
	width: 100%;
	height: auto;
	text-align : left;
	background: none;
	margin: 5px auto;
	line-height: 2em;
	display:flex;
	justify-content: center;
}


span.menu-title-text {
	font-size: 100%;
	color: red;
	font-weight: bold;
	margin-left: 5px;
}


span.menu-text {
	width: 85%;
	height: auto;
	background: none;
	padding-top: 8px;
	margin-left: 3%;
	float: right;
	text-align: left;
	vertical-align: middle;
}
.icon-menu{
	width: 10%;
	height: auto;
	float: left;
	margin-left: 2%;
	background: none;
}

	
ul#menu li a {
	width: 100%;
	color: black;
	text-decoration : none;
	display : block;
}

ul#menu li a:hover {
	background : #a9a9a9;
	opacity : 0.9;
}

	
	

				/*				========- delivery-content (perfomance & delivery & online )*/
				
div.delivery-content {
width: 100%;
height: auto;
float: left;
}

div.delivery-content div{
width: 50%;
height: auto;
border-top: 1px solid whitesmoke;
padding: 10px 0px;
float: left;
}


div.delivery-content ul{
width: 90%;
height: auto;
display: block;
margin: 0 auto;
}

div.delivery-content ul li{
	width: 90%;
	height: auto;
	margin: 10px auto;
	display: block;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
	background: tan;
	text-align: center;
list-style-type: none;
}

div.delivery-content ul li a{
	display: block;
	width: 100%;
	height: auto;
	line-height: 3em;
	color: black;
}


/*  決定キー */

div.lead {
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 30px;
}

p#lead {
	width: 70%;
	height: auto;
	margin: 70px auto;
	display: block;
	text-align: center;
	font-size: 1.3rem;
	line-height: 2em;
	background: orange;
	color: white;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
}


p#lead a{
	width: 100%;
	height: auto;
	display: block;
	color:white;
}




/*footer*/

/*		========= フッター固定	=======*/

		footer{
			width: 100%;
			height: auto;
			float: left;
			margin-top: 30px;
			padding: 30px 0px;
			background: rgba(94,112,116,1.00);
		}		
		
		
		div#f-top {
			width: 100%;
			height: auto;
			float: left;
			padding: 10px 0px;
			background: rgba(31,203,91,1.00);
		}

		.f_logo{
			width: 20%;
			height: auto;
			display: block;
			margin: auto;
		
		}

.footer-icon {
	width: 35%;
	height: auto;
	display: block;
	margin: 0px auto;
}	
	
}



/*521px-780px */
@media(min-width: 521px) and (max-width: 780px){
	


div#sp-icon {
	width : 50px;
	height : 50px;
	position : absolute;
	right : 0px;
	top : 0px;
	z-index : 999;
	background: none;
  position: fixed !important;  
}

div#sp-icon:hover {
	cursor : pointer;
	opacity : 0.9;
}

div#sp-icon span,
div#sp-icon span:before,
div#sp-icon span:after {
	display : inline-block;
	width : 30px;
	height : 3px;
	background : black;
	transition-property : transform;
	transition-duration : 0.3s;
}

div#sp-icon span {
	position : absolute;
	left : 50%;
	top : 50%;
	transform : translate( -50%, -50% );
}

div#sp-icon span:before {
	content : "";
	position : absolute;
	transform : translateY( -10px ) rotate( 0deg );
}

div#sp-icon span:after {
	content : "";
	position : absolute;
	transform : translateY( 10px ) rotate( 0deg );
}


div.sp-close span {
	background : transparent !important;
}

div.sp-close span:before {
	transform : rotate( 45deg ) !important;
}

div.sp-close span:after {
	transform : rotate( -45deg ) !important;
}


	
	
/*----------header-----*/

header {
	
  width: 100%;
  height: 50px;
  background: white;
  color: black;
  position: fixed !important;  
  position: absolute;  
  top: 0;  
  float: left;
  box-sizing: border-box;
  padding: 0px 10px;
  z-index: 998;
}

div.header{
	width: 100%;
	height: auto;
	float: left;
	padding: 0px;
	}
	
div.header p{
	width: 100%;
	text-align: left;
}


	div.top {
		width: 100%;
		height: auto;
		float: left;
		background: none;
		
	}
	
		div.top div {
			
			width:100%;
			height: auto;
			float: left;
			box-sizing: border-box;
	}
		div.top div p{
			width: 100%;
			height: auto;
			text-align: center;
			display: flex;
			justify-content: center;
			background: none;
	}
	
	
			
.shop-image{
	width: 20%;
	height: auto;
	display: inline;
	}
		
	
.logo {
	width: auto;
	height: 50px;
	background: none;
	display: block;
	margrin: 0 auto;
}

	
.pr-image {
	width: 100%;
}


div#tab-box {
	width: 100%;
	background: rgba(0,0,0,7);
	float: left;
	padding: 10px 0px;	
	border-bottom: 5px solid white;
}



/*		sp-menu.css		-------------------= */
ul#menu {
	width: 100%;
	height: auto;
	float: left;
	list-style-type : none;
	background: rgba(255, 255, 255,1.0);
	position : absolute;
	left : 0px;
	top : 0px;
	z-index : 999;
	display : none;
}

ul#menu p{
	color: black;
}



ul#menu li {
	width: 100%;
	height: auto;
	text-align : left;
	background: none;
	margin: 5px auto;
	line-height: 2em;
	display:flex;
	justify-content: center;
}


span.menu-title-text {
	font-size: 100%;
	color: red;
	font-weight: bold;
	margin-left: 5px;
}


span.menu-text {
	width: 85%;
	height: auto;
	background: none;
	padding-top: 8px;
	margin-left: 3%;
	float: right;
	text-align: left;
	vertical-align: middle;
}
.icon-menu{
	width: 10%;
	height: auto;
	float: left;
	margin-left: 2%;
	background: none;
}

	
ul#menu li a {
	width: 100%;
	color: black;
	text-decoration : none;
	display : block;
}

ul#menu li a:hover {
	background : #a9a9a9;
	opacity : 0.9;
}


	
	
	
	

				/*				========- delivery-content (perfomance & delivery & online )*/
				
div.delivery-content {
width: 100%;
height: auto;
float: left;
}

div.delivery-content div{
width: 50%;
height: auto;
border-top: 1px solid whitesmoke;
padding: 10px 0px;
float: left;
}


div.delivery-content ul{
width: 90%;
height: auto;
display: block;
margin: 0 auto;
}

div.delivery-content ul li{
	width: 90%;
	height: auto;
	margin: 10px auto;
	display: block;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
	background: tan;
	text-align: center;
list-style-type: none;
}

div.delivery-content ul li a{
	display: block;
	width: 100%;
	height: auto;
	line-height: 3em;
	color: black;
}


/*  決定キー */

div.lead {
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 30px;
}

p#lead {
	width: 70%;
	height: auto;
	margin: 70px auto;
	display: block;
	text-align: center;
	font-size: 1.3rem;
	line-height: 2em;
	background: orange;
	color: white;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
}


p#lead a{
	width: 100%;
	height: auto;
	display: block;
	color:white;
}




/*footer*/

/*		========= フッター固定	=======*/

		footer{
			width: 100%;
			height: auto;
			float: left;
			margin-top: 30px;
			padding: 30px 0px;
			background: rgba(94,112,116,1.00);
		}		
		
		
		div#f-top {
			width: 100%;
			height: auto;
			float: left;
			padding: 10px 0px;
			background: rgba(31,203,91,1.00);
		}

		.f_logo{
			width: 20%;
			height: auto;
			display: block;
			margin: auto;
		
		}

.footer-icon {
	width: 35%;
	height: auto;
	display: block;
	margin: 0px auto;
}	


}


/*520px*/
@media (min-width: 381px) and (max-width : 520px) {


div#sp-icon {
	width : 50px;
	height : 50px;
	position : absolute;
	right : 0px;
	top : 0px;
	z-index : 999;
	background: none;
  position: fixed !important;  
}

div#sp-icon:hover {
	cursor : pointer;
	opacity : 0.9;
}

div#sp-icon span,
div#sp-icon span:before,
div#sp-icon span:after {
	display : inline-block;
	width : 30px;
	height : 3px;
	background : black;
	transition-property : transform;
	transition-duration : 0.3s;
}

div#sp-icon span {
	position : absolute;
	left : 50%;
	top : 50%;
	transform : translate( -50%, -50% );
}

div#sp-icon span:before {
	content : "";
	position : absolute;
	transform : translateY( -10px ) rotate( 0deg );
}

div#sp-icon span:after {
	content : "";
	position : absolute;
	transform : translateY( 10px ) rotate( 0deg );
}


div.sp-close span {
	background : transparent !important;
}

div.sp-close span:before {
	transform : rotate( 45deg ) !important;
}

div.sp-close span:after {
	transform : rotate( -45deg ) !important;
}


	
	
/*----------header-----*/

header {
	
  width: 100%;
  height: 50px;
  background: white;
  color: black;
  position: fixed !important;  
  position: absolute;  
  top: 0;  
  float: left;
  box-sizing: border-box;
  padding: 0px 10px;
  border-bottom: 1px solid green;
  z-index: 998;
}

div.header{
	width: 100%;
	height: auto;
	float: left;
	padding: 0px;
	}
	
div.header p{
	width: 100%;
	text-align: left;
}


	div.top {
		width: 100%;
		height: auto;
		float: left;
		background: none;
		
	}
	
		div.top div {
			
			width:100%;
			height: auto;
			float: left;
			box-sizing: border-box;
	}
		div.top div p{
			width: 100%;
			height: auto;
			text-align: center;
			display: flex;
			justify-content: center;
			background: none;
	}
	
	
			
.shop-image{
	width: 20%;
	height: auto;
	display: inline;
	}
		
	
.logo {
	width: auto;
	height: 50px;
	background: none;
	display: block;
	margrin: 0 auto;
}

	
.pr-image {
	width: 100%;
}


div#tab-box {
	width: 100%;
	background: rgba(0,0,0,7);
	float: left;
	padding: 10px 0px;	
	border-bottom: 5px solid white;
}


/*		sp-menu.css		-------------------= */
ul#menu {
	width: 100%;
	height: auto;
	float: left;
	list-style-type : none;
	background: rgba(255, 255, 255,1.0);
	position : absolute;
	left : 0px;
	top : 0px;
	z-index : 999;
	display : none;
}

ul#menu p{
	color: black;
}



ul#menu li {
	width: 100%;
	height: auto;
	text-align : left;
	background: none;
	margin: 5px auto;
	line-height: 2em;
	display:flex;
	justify-content: center;
}


span.menu-title-text {
	font-size: 100%;
	color: red;
	font-weight: bold;
	margin-left: 5px;
}


span.menu-text {
	width: 85%;
	height: auto;
	background: none;
	padding-top: 8px;
	margin-left: 3%;
	float: right;
	text-align: left;
	vertical-align: middle;
}
.icon-menu{
	width: 10%;
	height: auto;
	float: left;
	margin-left: 2%;
	background: none;
}

	
ul#menu li a {
	width: 100%;
	color: black;
	text-decoration : none;
	display : block;
}

ul#menu li a:hover {
	background : #a9a9a9;
	opacity : 0.9;
}

	
	

				/*				========- delivery-content (perfomance & delivery & online )*/
				
div.delivery-content {
width: 100%;
height: auto;
float: left;
}

div.delivery-content div{
width: 50%;
height: auto;
border-top: 1px solid whitesmoke;
padding: 10px 0px;
float: left;
}


div.delivery-content ul{
width: 90%;
height: auto;
display: block;
margin: 0 auto;
}

div.delivery-content ul li{
	width: 90%;
	height: auto;
	margin: 10px auto;
	display: block;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
	background: tan;
	text-align: center;
list-style-type: none;
}

div.delivery-content ul li a{
	display: block;
	width: 100%;
	height: auto;
	line-height: 3em;
	color: black;
}


/*  決定キー */

div.lead {
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 30px;
}

p#lead {
	width: 70%;
	height: auto;
	margin: 70px auto;
	display: block;
	text-align: center;
	font-size: 1.3rem;
	line-height: 2em;
	background: orange;
	color: white;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
}


p#lead a{
	width: 100%;
	height: auto;
	display: block;
	color:white;
}




/*footer*/

/*		========= フッター固定	=======*/

		footer{
			width: 100%;
			height: auto;
			float: left;
			margin-top: 30px;
			padding: 30px 0px;
			background: rgba(94,112,116,1.00);
		}		
		
		
		div#f-top {
			width: 100%;
			height: auto;
			float: left;
			padding: 10px 0px;
			background: rgba(31,203,91,1.00);
		}

		.f_logo{
			width: 20%;
			height: auto;
			display: block;
			margin: auto;
		
		}

.footer-icon {
	width: 35%;
	height: auto;
	display: block;
	margin: 0px auto;
}	

}



/*380px*/
	
	@media(min-width: 351px) and (max-width :380px) {
		


div#sp-icon {
	width : 50px;
	height : 50px;
	position : absolute;
	right : 0px;
	top : 0px;
	z-index : 999;
	background: white;
}

div#sp-icon:hover {
	cursor : pointer;
	opacity : 0.9;
}

div#sp-icon span,
div#sp-icon span:before,
div#sp-icon span:after {
	display : inline-block;
	width : 30px;
	height : 3px;
	background : black;
	transition-property : transform;
	transition-duration : 0.3s;
}

div#sp-icon span {
	position : absolute;
	left : 50%;
	top : 50%;
	transform : translate( -50%, -50% );
}

div#sp-icon span:before {
	content : "";
	position : absolute;
	transform : translateY( -10px ) rotate( 0deg );
}

div#sp-icon span:after {
	content : "";
	position : absolute;
	transform : translateY( 10px ) rotate( 0deg );
}


div.sp-close span {
	background : transparent !important;
}

div.sp-close span:before {
	transform : rotate( 45deg ) !important;
}

div.sp-close span:after {
	transform : rotate( -45deg ) !important;
}


	
	
/*----------header-----*/

header {
	
  width: 100%;
  height: 50px;
  background: white;
  color: black;
  position: fixed !important;  
  position: absolute;  
  top: 0;  
  float: left;
  box-sizing: border-box;
  padding: 0px 10px;
  border-bottom: 1px solid gold;
  z-index: 998;
}

div.header{
	width: 100%;
	height: auto;
	float: left;
	padding: 0px;
	}
	
div.header p{
	width: 100%;
	text-align: left;
}


	div.top {
		width: 100%;
		height: auto;
		float: left;
		background: none;
		
	}
	
		div.top div {
			
			width:100%;
			height: auto;
			float: left;
			box-sizing: border-box;
	}
		div.top div p{
			width: 100%;
			height: auto;
			text-align: center;
			display: flex;
			justify-content: center;
			background: none;
	}
	
	
			
.shop-image{
	width: 20%;
	height: auto;
	display: inline;
	}
		
	
.logo {
	width: auto;
	height: 50px;
	background: none;
	display: block;
	margrin: 0 auto;
}

	
.pr-image {
	width: 100%;
}


div#tab-box {
	width: 100%;
	background: rgba(0,0,0,7);
	float: left;
	padding: 10px 0px;	
	border-bottom: 5px solid white;
}


/*		sp-menu.css		-------------------= */
ul#menu {
	width: 100%;
	height: auto;
	float: left;
	list-style-type : none;
	background: rgba(255, 255, 255,1.0);
	position : absolute;
	left : 0px;
	top : 0px;
	z-index : 999;
	display : none;
}

ul#menu p{
	color: black;
}



ul#menu li {
	width: 100%;
	height: auto;
	text-align : left;
	background: none;
	margin: 5px auto;
	line-height: 2em;
	display:flex;
	justify-content: center;
}


span.menu-title-text {
	font-size: 100%;
	color: red;
	font-weight: bold;
	margin-left: 5px;
}


span.menu-text {
	width: 85%;
	height: auto;
	background: none;
	padding-top: 8px;
	margin-left: 3%;
	float: right;
	text-align: left;
	vertical-align: middle;
}
.icon-menu{
	width: 10%;
	height: auto;
	float: left;
	margin-left: 2%;
	background: none;
}

	
ul#menu li a {
	width: 100%;
	color: black;
	text-decoration : none;
	display : block;
}

ul#menu li a:hover {
	background : #a9a9a9;
	opacity : 0.9;
}

	
	

				/*				========- delivery-content (perfomance & delivery & online )*/
				
div.delivery-content {
width: 100%;
height: auto;
float: left;
}

div.delivery-content div{
width: 50%;
height: auto;
border-top: 1px solid whitesmoke;
padding: 10px 0px;
float: left;
}


div.delivery-content ul{
width: 90%;
height: auto;
display: block;
margin: 0 auto;
}

div.delivery-content ul li{
	width: 90%;
	height: auto;
	margin: 10px auto;
	display: block;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
	background: tan;
	text-align: center;
list-style-type: none;
}

div.delivery-content ul li a{
	display: block;
	width: 100%;
	height: auto;
	line-height: 3em;
	color: black;
}


/*  決定キー */

div.lead {
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 30px;
}

p#lead {
	width: 70%;
	height: auto;
	margin: 70px auto;
	display: block;
	text-align: center;
	font-size: 1.3rem;
	line-height: 2em;
	background: orange;
	color: white;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
}


p#lead a{
	width: 100%;
	height: auto;
	display: block;
	color:white;
}



/*footer*/

/*		========= フッター固定	=======*/

		footer{
			width: 100%;
			height: auto;
			float: left;
			margin-top: 30px;
			padding: 30px 0px;
			background: rgba(94,112,116,1.00);
		}		
		
		
		div#f-top {
			width: 100%;
			height: auto;
			float: left;
			padding: 10px 0px;
			background: rgba(31,203,91,1.00);
		}

		.f_logo{
			width: 20%;
			height: auto;
			display: block;
			margin: auto;
		
		}
.footer-icon {
	width: 35%;
	height: auto;
	display: block;
	margin: 0px auto;
}	

		
}




/*350px*/
	
	@media(min-width: 321px) and (max-width :350px) {
		
		


div#sp-icon {
	width : 50px;
	height : 50px;
	position : absolute;
	right : 0px;
	top : 0px;
	z-index : 999;
	background: none;
}

div#sp-icon:hover {
	cursor : pointer;
	opacity : 0.9;
}

div#sp-icon span,
div#sp-icon span:before,
div#sp-icon span:after {
	display : inline-block;
	width : 30px;
	height : 3px;
	background: black;
	transition-property : transform;
	transition-duration : 0.3s;
}

div#sp-icon span {
	position : absolute;
	left : 50%;
	top : 50%;
	transform : translate( -50%, -50% );
}

div#sp-icon span:before {
	content : "";
	position : absolute;
	transform : translateY( -10px ) rotate( 0deg );
}

div#sp-icon span:after {
	content : "";
	position : absolute;
	transform : translateY( 10px ) rotate( 0deg );
}


div.sp-close span {
	background : transparent !important;
}

div.sp-close span:before {
	transform : rotate( 45deg ) !important;
}

div.sp-close span:after {
	transform : rotate( -45deg ) !important;
}


	
	
/*----------header-----*/

header {
	
  width: 100%;
  height: 50px;
  background: white;
  color: black;
  position: fixed !important;  
  position: absolute;  
  top: 0;  
  float: left;
  box-sizing: border-box;
  padding: 0px 10px;
  border-bottom: 1px solid red;
  z-index: 998;
}

div.header{
	width: 100%;
	height: auto;
	float: left;
	padding: 0px;
	}
	
div.header p{
	width: 100%;
	text-align: left;
}


	div.top {
		width: 100%;
		height: auto;
		float: left;
		background: none;
		
	}
	
		div.top div {
			
			width:100%;
			height: auto;
			float: left;
			box-sizing: border-box;
	}
		div.top div p{
			width: 100%;
			height: auto;
			text-align: center;
			display: flex;
			justify-content: center;
			background: none;
	}
	
	
			
.shop-image{
	width: 20%;
	height: auto;
	display: inline;
	}
		
	
.logo {
	width: auto;
	height: 50px;
	background: none;
	display: block;
	margrin: 0 auto;
}

	
.pr-image {
	width: 100%;
}


div#tab-box {
	width: 100%;
	background: rgba(0,0,0,7);
	float: left;
	padding: 10px 0px;	
	border-bottom: 5px solid white;
}


/*		sp-menu.css		-------------------= */
ul#menu {
	width: 100%;
	height: auto;
	float: left;
	list-style-type : none;
	background: rgba(255, 255, 255,1.0);
	position : absolute;
	left : 0px;
	top : 0px;
	z-index : 999;
	display : none;
}

ul#menu p{
	color: black;
}



ul#menu li {
	width: 100%;
	height: auto;
	text-align : left;
	background: none;
	margin: 5px auto;
	line-height: 2em;
	display:flex;
	justify-content: center;
}


span.menu-title-text {
	font-size: 100%;
	color: red;
	font-weight: bold;
	margin-left: 5px;
}


span.menu-text {
	width: 85%;
	height: auto;
	background: none;
	padding-top: 8px;
	margin-left: 3%;
	float: right;
	text-align: left;
	vertical-align: middle;
}
.icon-menu{
	width: 10%;
	height: auto;
	float: left;
	margin-left: 2%;
	background: none;
}

	
ul#menu li a {
	width: 100%;
	color: black;
	text-decoration : none;
	display : block;
}

ul#menu li a:hover {
	background : #a9a9a9;
	opacity : 0.9;
}

	
	

	
/*footer*/

/*		========= フッター固定	=======*/

div#footerArea {  
    position: fixed !important;  
    position: absolute;  
    bottom: 0;  
	text-align: center;
    left: 0;  
	border-top: 1px solid red;
    width: 100%;  
    height: auto;
    background: white;  
    color: silver;  
	font-weight: bold;
	padding: 2px 0px;
	z-index: 999;
}  

div#footerArea ul{
	width: 100%;
	height: auto;
	float: left;
	padding: 1px;
	border-sizing: border-box;
	display: flex;
	justify-content: center;
}
div#footerArea ul li{
	width: 35%;
	height: auto;
	background: none;
	float: left;
	text-align: center;
	margin: 0 1px;
	font-size: 6pt;
	border-sizing: border-box;
	list-style-type: none;
	
}

div#footerArea ul li a{
	width: 100%;
	height: auto;
	float: left;
	display: block;
	color: silver;
	
}

.footer-icon {
	width: 35%;
	height: auto;
	display: block;
	margin: 0px auto;
}	
	
		
		
		
		
}




/*320px*/
@media screen and (max-width : 320px) {

	

div#sp-icon {
	width : 50px;
	height : 50px;
	position : absolute;
	right : 0px;
	top : 0px;
	z-index : 999;
	background: none;
}

div#sp-icon:hover {
	cursor : pointer;
	opacity : 0.7;
}

div#sp-icon span,
div#sp-icon span:before,
div#sp-icon span:after {
	display : inline-block;
	width : 30px;
	height : 3px;
	background : black;
	transition-property : transform;
	transition-duration : 0.3s;
}

div#sp-icon span {
	position : absolute;
	left : 50%;
	top : 50%;
	transform : translate( -50%, -50% );
}

div#sp-icon span:before {
	content : "";
	position : absolute;
	transform : translateY( -10px ) rotate( 0deg );
}

div#sp-icon span:after {
	content : "";
	position : absolute;
	transform : translateY( 10px ) rotate( 0deg );
}


div.sp-close span {
	background : transparent !important;
}

div.sp-close span:before {
	transform : rotate( 45deg ) !important;
}

div.sp-close span:after {
	transform : rotate( -45deg ) !important;
}


	
	
/*----------header-----*/

header {
	
  width: 100%;
  height: auto;
  background: white;
  color: black;
  position: fixed !important;  
  position: absolute;  
  top: 0;  
  float: left;
  box-sizing: border-box;
  padding: 0px 10px;
  border-bottom: 1px solid red;
  z-index: 998;
}

div.header{
	width: 100%;
	height: auto;
	float: left;
	padding: 0px;
	}
	
div.header p{
	width: 100%;
	text-align: left;
}


	div.top {
		width: 100%;
		height: auto;
		float: left;
		background: none;
		
	}
	
		div.top div {
			
			width:100%;
			height: auto;
			float: left;
			box-sizing: border-box;
	}
		div.top div p{
			width: 100%;
			height: auto;
			text-align: center;
			display: flex;
			justify-content: center;
			background: none;
	}
	
	
			
.shop-image{
	width: 20%;
	height: auto;
	display: inline;
	}
		
	
.logo {
	width: auto;
	height: 50px;
	background: none;
	display: block;
	margrin: 0 auto;
}

	
.pr-image {
	width: 100%;
}


div#tab-box {
	width: 100%;
	background: rgba(0,0,0,7);
	float: left;
	padding: 10px 0px;	
	border-bottom: 5px solid white;
}


/*		sp-menu.css		-------------------= */
ul#menu {
	width: 100%;
	height: auto;
	float: left;
	list-style-type : none;
	background:rgba(255, 255, 255,1.0);
	position : absolute;
	left : 0px;
	top : 0px;
	z-index : 999;
	display : none;
}

ul#menu p{
	color: black;
}



ul#menu li {
	width: 100%;
	height: auto;
	text-align : left;
	background: none;
	margin: 5px auto;
	line-height: 2em;
	display:flex;
	justify-content: center;
}


span.menu-title-text {
	font-size: 100%;
	color: red;
	font-weight: bold;
	margin-left: 5px;
}


span.menu-text {
	width: 85%;
	height: auto;
	background: none;
	padding-top: 8px;
	margin-left: 3%;
	float: right;
	text-align: left;
	vertical-align: middle;
}
.icon-menu{
	width: 10%;
	height: auto;
	float: left;
	margin-left: 2%;
	background: none;
}

	
ul#menu li a {
	width: 100%;
	color: black;
	text-decoration : none;
	display : block;
}

ul#menu li a:hover {
	background : #a9a9a9;
	opacity : 0.7;
}

	
	
	
	
	
	
	
	

				/*				========- delivery-content (perfomance & delivery & online )*/
				
div.delivery-content {
width: 100%;
height: auto;
float: left;
}

div.delivery-content div{
width: 50%;
height: auto;
border-top: 1px solid whitesmoke;
padding: 10px 0px;
float: left;
}


div.delivery-content ul{
width: 90%;
height: auto;
display: block;
margin: 0 auto;
}

div.delivery-content ul li{
	width: 90%;
	height: auto;
	margin: 10px auto;
	display: block;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
	background: tan;
	text-align: center;
list-style-type: none;
}

div.delivery-content ul li a{
	display: block;
	width: 100%;
	height: auto;
	line-height: 3em;
	color: black;
}


/*  決定キー */

div.lead {
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 30px;
}

p#lead {
	width: 70%;
	height: auto;
	margin: 70px auto;
	display: block;
	text-align: center;
	font-size: 1.3rem;
	line-height: 2em;
	background: orange;
	color: white;
	-wekbkit-border-radius: 8px;/*chrome,safari */
	-moz-border-radius: 8px;    /*Firefox */
	border-radius: 8px;        /*css3*/
}


p#lead a{
	width: 100%;
	height: auto;
	display: block;
	color:white;
}



/*footer*/

/*		========= フッター固定	=======*/

		footer{
			width: 100%;
			height: auto;
			float: left;
			margin-top: 30px;
			padding: 30px 0px;
			background: rgba(94,112,116,1.00);
		}		
		
		
		div#f-top {
			width: 100%;
			height: auto;
			float: left;
			padding: 10px 0px;
			background: rgba(31,203,91,1.00);
		}

		.f_logo{
			width: 20%;
			height: auto;
			display: block;
			margin: auto;
		
		}

.footer-icon {
	width: 35%;
	height: auto;
	display: block;
	margin: 0px auto;
}	

}
