@charset "utf-8";

@media screen and (max-width: 690px){

	
	
/**************************************************
 common
**************************************************/
#wrapper{
	top: 60px;
	min-width: 100%;
}

h2{
	height: 180px;
	font-size: 4.0rem;
}
h2 small{
	font-size: 1.6rem;
	letter-spacing: 2px;
	margin-top: 15px;
}
h2::before,
h2::after{height: 40px;}
h2::before{
	background: url("../img/h2_bg_top.png") no-repeat 0 0;
	background-size: 100% 40px;
}
h2::after{
	background: url("../img/h2_bg_bottom.png") no-repeat 0 0;
	background-size: 100% 40px;
}

main{
	width: 100%;
	margin: 0 auto 70px auto;
	padding: 0 20px;
}

main h3{
	margin: 80px 0 0 0;
	padding: 30px 0 0 0;
	font-size: 2.3rem;
	letter-spacing: 3px;
}
main h3.style1{margin: 60px 0 0 0;}
main h3::before{width: 40px;}
	
main h4{
	margin: 50px 0 0 0;
	font-size: 1.9rem;
	letter-spacing: 2px;
}

main p{
	font-size: 1.5rem;
	padding: 40px 0 0 0;
}
	
main ol{
	font-size: 1.5rem;
	padding: 30px 0 0 25px;
}

table{
	margin: 40px 0 0 0;
	font-size: 1.5rem;
}
table th{
	display: block;
	padding: 15px 10px;
	width: 100%;
}
table td{
	display: block;
	padding: 15px 10px;
}


.imageHanger,
.imageHanger2{margin: 30px 0 0 0;}
.imageHanger2 img{width: 100%;}



/**************************************************
 products
**************************************************/
.proIndex{padding: 10px 0 0 0;}
.proIndex dl{
	margin: 20px 0 0 0;
	padding: 10px;
}
.proIndex dl dt{width: 100%;}
.proIndex dl dt img{
	display: block;
	width: 100%;
	margin: 0;
}
.proIndex dl dt img:nth-child(2){margin: 10px 0 0 0;}
.proIndex dl dt img.style1{width: 100%;}
.proIndex dl dd{
	width: 100%;
	font-size: 1.5rem;
	padding: 10px 0 0 0;
}
.proIndex dl dd strong{
	font-size: 1.8rem;
	letter-spacing: 1px;
	margin-bottom: 10px;
}
.proIndex dl dd div small{
	font-size: 1.5rem;
	width: 65px;
}
.proIndex dl dd div span{width: calc(100% - 65px);}

main p.products{
	font-size: 1.8rem;
	letter-spacing: 1px;
	padding: 60px 0 0 0;
}
main p.products br{display: block;}

.proImage{margin: 20px 0 0 0;}
	
main p.proDesc{
	padding: 15px;
	margin: 30px 0 0 0;
	border: 5px solid #F2F3F7;
	text-align: left;
}
main p.proDesc strong{
	font-size: 1.8rem;
	letter-spacing: 1px;
	text-align: center;
}
main p.proDesc span{
	left: calc(50% + 60px);
	padding: 12px 11px 12px 12px;
}
	
.movieHanger{margin: 50px 0 0 0;}
	
.howTo ol{width: 100%;}
.howToImage{
	width: 100%;
	margin: 30px 0 0 0;
}



/**************************************************
 company
**************************************************/
main p.sign{padding: 20px 0 0 0;}
main p.sign strong{
	font-size: 2.0rem;
	letter-spacing: 2px;
}

#map{
	margin: 40px 0 0 0;
	height: 70vw;
}

#flowerStore{margin: 40px 0 0 0;}
#flowerStore dl{
	width: 100%;
	padding: 25px 20px;
}
#flowerStore dl dt{
	font-size: 1.7rem;
	letter-spacing: 1px;
}
#flowerStore dl dt strong{
	font-size: 2.6rem;
	letter-spacing: 2px;
	padding: 10px 20px;
}
#flowerStore dl dt strong::before,
#flowerStore dl dt strong::after{
	width: 20px;
	height: 20px;
}
#flowerStore dl dd{font-size: 1.5rem;}
#flowerStore dl dd a{
	margin: 20px auto 0 auto;
	padding: 15px 0;
	font-size: 1.8rem;
}
#flowerStore dl dd a:hover{opacity: 0.5;}
#flowerStore div{
	width: 100%;
	height: 50vw;
}
	
	
	
/**************************************************
 inquiry
**************************************************/
table.inquiry th{width: 100%;}
table.inquiry td input[type="text"],
table.inquiry td select,
table.inquiry td textarea{
	width: 100%;
	font-size: 15px;
	font-size: 1.5rem;
}

.form_buttons{
	width: 280px;
	margin: 30px auto 0 auto;
}
.form_buttons input[type="submit"],
.form_buttons input[type="button"]{
	font-size: 15px;
	font-size: 1.5rem;
}
	
	

}
