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


body{
    position: relative;
    margin: 0px;
    padding: 0px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	}

header{
	
	}
	
.headerback{
	width: 100%;
	}
	
/*.logo{
	position: absolute;
	top: 10px;
	left: 10px;
	}*/
	
.title{
	position: absolute;
	top: 115px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}



.bin{
	position: absolute;
	top: 500px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}
.ichijiku{
	position: absolute;
	top: 260px;
	left: 30px;	
	}



.blueberryplate{
	position: absolute;
	top: 170px;
	right: 20px;	
	}
	



.pinkrose{
	position: absolute;
	top: 580px;
	left: 150px;	
	}

.pinkredrose{
	position: absolute;
	top: 810px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}
	
.plam{
	position: absolute;
	top: 520px;
	right: 50px;
	}


.essence{
	position: absolute;
	top: 1080px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}



.sozaikudamono{
	position: absolute;
	top: 1280px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}


.main1{

	}
	
.mainback1{
	width: 100%;
	}

.bin_flower{
	position: absolute;
	top: 1670px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	
}

/*.blackberry{
	position: absolute;
	top: 1500px;
	left: 80px;
	}*/

/*.orange1{
	position: absolute;
	top: 1650px;
	right: 20px;
	}
*/


.nopreservertive{
	position: absolute;
	top: 2100px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}

.shinsen{
	position: absolute;
	top: 2300px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	
}
	
.talto{
	position: absolute;
	top: 2545px;
	left: 330px;	
	}


.jamcake2{
	position: absolute;
	top: 2640px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}


.lemon{
	position: absolute;
	top: 2565px;
	right: 340px;
	}

	
.main2{

	}
	
.mainback2{
	width: 100%;
	}



.shiroobi{
	position: absolute;
	top: 2900px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}

.hereour{
	position: absolute;
	top: 3000px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}

.gokonyu{
	position: absolute;
	top: 3080px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}
	
.shopping1{
	position: absolute;
	top: 3300px;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
	box-shadow: 0 5px 20px 0px rgb(0 0 0 / 80%);
	
	}

  
.img_wrap1 img{
  cursor: grab;
 /* filter: grayscale(100%);*/
  transition-duration: 0.5s;
}
.img_wrap1 img:hover{
  filter: grayscale(0);
  transition-duration: 0.5s;
  box-shadow: 5px 5px 5px 5px rgba(0,0,0,0.4);
  transform: translateX(-10px) translateY(-10px);
  transition-duration: 0.5s;
}


.shoppingsait{
	position: absolute;
	top: 3480px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}

.shopping2{
	position: absolute;
	top: 3700px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	box-shadow: 0 5px 20px 0px rgb(0 0 0 / 80%);
	
	}

.img_wrap2 img{
  cursor: grab;
 /* filter: grayscale(100%);*/
  transition-duration: 0.5s;
}
.img_wrap2 img:hover{
  filter: grayscale(0);
  transition-duration: 0.5s;
  box-shadow: 5px 5px 5px 5px rgba(0,0,0,0.4);
  transform: translateX(-10px) translateY(-10px);
  transition-duration: 0.5s;
}
	
.creemamoji{
	position: absolute;
	top: 3880px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}


.redrose{
	position: absolute;
	top: 3950px;
	left: 300px;
	}

.yellorederose{
	position: absolute;
	top: 4050px;
	right: 280px;
	}

	
.main3{
	
	}
.mainback3{
	width: 100%;
	}
.adress{
	position: absolute;
	top: 4350px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}
.map{
	position: absolute;
	top: 4650px;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
	}
	
.footer{
	position: absolute;
	right: 20px;
	bottom: 20px;
	font-size: 13px;
	}
	
	
@media screen and (max-width:559px) {
	
.title{
	/*width: 73vw;
	height: vh;*/
	width: 80%;
	height: 2%;
	}

.bin{
	/*width: 48.8vw;
	height: vh;*/
	width: 80%;
	height: 5%;
	}


.ichijiku{
	display: none;
	/*width: 30%;
	height: 2%;*/
	}

.blueberryplate{
	display: none;
	/*width: 30%;
	height: 2%;	*/
	}

.pinkrose{
	display: none;
	}

.pinkredrose{
	width: 40%;
	height: 3%;	
	}
	
.plam{
	display: none;
	/*width: 30%;
	height: 2%;*/
	}

.essence{
	width: 80%;
	height: 2%;
	}

.sozaikudamono{
	width: 90%;
	height: 0.8%;
	}
	
.mainback1{

	}

.bin_flower{
	width: 80%;
	height: 4%;
	
}

.blackberry{
	display: none;
	}

.orange1{
	display: none;
	}

.nopreservertive{
	width: 80%;
	height: 1.3%;
	}

.shinsen{
	width: 80%;
	height: 0.8%;
}
	
.talto{
	
	}

.jamcake2{
	}
	
.lemon{
	
		}
		
.mainback2{
	}

.shiroobi{
	}

.hereour{
	width: 90%;
	height: 0.8%;
	}

.gokonyu{
	}
	
.shopping1{
	width: 70%;
	height: 2%;
	}

.shopimg1{
	width: 100%;
	height: 1%;
	}

.shoppingsait{
	display: none;
	}

.shopping2{
	width: 70%;
	height: 2%;
	}

.shopimg2{
	width: 100%;
	height: 1%;
	}
	
.creemamoji{
		display: none;
	}


.redrose{
	text-align: center;
	width: 30%;
	height: 4%;	
	}

.yellorederose{

	width: 40%;
	height: 4%;	
	}

	
.main3{
	
	}
.mainback3{
	
	}
.adress{
    width: 80%;
	height: 2.5%;
	}
	
.map{
	 width: 80%;
	height: 3%;
	}
	
.footer{
	
	}
	 }