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

h2{
  display: inline-block;
	padding: 10px 0 50px;
  margin-bottom: 50px;
	font-size: 150%;/*24px*/
	font-weight: 500;
	line-height: 1.75;
	background: url(../img/global/ornament.png) no-repeat center bottom;
	background-size: 90px;
	color: #425760;
}
#index-main {
	width: 100%;
	height: 500px;
	vertical-align: middle;
	background-image:url(../img/index/main-image.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.2) inset;
}
#index-main-inner {
	width: 100%;
	max-width: 1120px;
	height: 500px;
	margin: 0 auto;
	vertical-align: middle;
	background-image:url(../img/index/key_topimg.png);
	background-size: 980px;
	background-repeat: no-repeat;
	background-position: left bottom;
}
#index-main h3 {
	text-align: right;
	padding-top: 180px;
  color: #4d4d4d;
  font-size: 200%;/*36px*/
	letter-spacing: 0.1em;
}
#index-main  .more-info {
  display: block;
	float: right;
  width: 300px;
	height: auto;
  text-align: center;
	background-color: #736891;
  font-size: 112.5%;/*18px*/
  color: #fff;
  text-decoration: none;
	margin:50px 20px;
  padding: 10px 0;
  transition: .4s;
}
#index-main  .more-info a {
  color: #FFF;
	padding: 10px 30px;
}
#index-main .more-info:hover {
  background-color: #8d7bbd;
  border-color: #8d7bbd;
}
#index-main .bl_inline {
	display: inline-block;
	width: 100%;
/*	max-width: 100px;*/
	margin: 10px 0;
	text-align: right;
}
#index-main .bl_inline a{
	margin: 10px 0;
}
#index-main .bl_inline a:link{
	text-decoration: none;
	color: #fff;
}
#index-main .bl_inline a:hover{
  background-color: #fff;
  border-color: #8d7bbd;
	color:#8d7bbd;
}
#index-main .el_btn {
	display: inline-block;
	width: auto;
	font-size: 1.0rem;
	padding: 10px 20px;
	background-color: #8d7bbd;
  border-color: #8d7bbd;
}


#aboutus {
	width: 100%;
	text-align: center;
	padding: 50px 0 100px;
	background-color: #e6ebe8;
}
#aboutus-inner{
	width: 100%;
	max-width: 1120px;
	text-align: center;
	margin: 0 auto;
}
#aboutus p{
	text-align: left;
}

#aboutus .bl_inline {
	margin: 30px auto 0;
}
#aboutus .el_btn {
	display: inline-block;
	width: 100%;
	max-width: 300px;
	font-size: 1.0rem;
/*	padding: 10px 5%;*/
	background-color: #007f89;
  border-color: #007f89;
}

#aboutus .el_btn:hover {
	background-color: #fff;
	color: #007f89;
}
#aboutus .bl_inline a:link{
	text-decoration: none;
	color: #fff;
}
#aboutus .el_btn a:hover {
	background-color: #fff;
	color: #007f89;
}

.firstcontact {
	width:100%;
	text-align: center;
	padding: 50px 0;
	background-color: #f0e4e4;
}
.firstcontact-in {    
  display: inline-block;
	margin: 20px 20px 0 0;
	text-align: center;
	width: 100%;
  max-width: 350px;
	height: 400px;
}
.firstcontact p{    
  display: block;
	font-size: 125%;/*20px*/
	font-weight: 300;
	margin: 20px 20px 0 0;
	text-align: center;
  padding: 10px;
  width: 350px;
	background-color: #fff;
	border: 1px solid #ddd;
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.2);
}

/*#shimi{
	width:100%;
	text-align: center;
	padding: 50px 0;
	margin: 0 auto;
	background: url(../img/index/shimi-bg.jpg) no-repeat top right;
	background-size: 80%;
}
#shimi-inner{
	width: 100%;
	max-width: 1120px;
	margin: 0 auto;
}
.shimicare1 {    
  display: inline-block;
	float: left;
	margin: 20px 20px 0 0;
	text-align: center;
	width: 100%;
  max-width: 350px;
	height: 400px;
}
.shimicare1 p{
  display: block;
	font-size: 125%;
	font-weight: 300;
	margin: 20px 20px 0 0;
	text-align: center;
  padding: 10px;
  width: 350px;
	background-color: #fff;
	border: 1px solid #ddd;
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.2);
}
.shimicare1-img{
	display: block;
	width: 350px;
	height: 350px;
	border-radius: 50%;
	background: url(../img/index/shimicare1.jpg) no-repeat top right;
	background-size: contain;
	border: 8px solid #e6ebe8;
}
.shimicare2 {    
  display: inline-block;
	margin: 20px 20px 0 0;
	text-align: center;
	width: 100%;
	max-width: 350px;
	height: 400px;
}
.shimicare2 p{    
  display: block;
	font-size: 125%;
	font-weight: 300;
	margin: 20px 20px 0 0;
	text-align: center;
  padding: 10px;
  width: 350px;
	background-color: #fff;
	border: 1px solid #ddd;
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.2);
}
.shimicare2-img{
	display: block;
	width: 350px;
	height: 350px;
	border-radius: 50%;
	background: url(../img/index/shimicare2.jpg) no-repeat top right;
	background-size: contain;
	border: 8px solid #e6ebe8;
}
.shimicare3 {    
  display: inline-block;
	float: left;
	margin:20px 0 0 0;
	text-align: center;
	width: 100%;
  max-width: 350px;
	height: 400px;
}
.shimicare3 p{    
  display: block;
	font-size: 125%;
	font-weight: 300;
	margin:20px 20px 0 0;
	text-align: center;
  padding: 10px;
  width: 350px;
	background-color: #fff;
	border: 1px solid #ddd;
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.2);
}
.shimicare3-img{
	display: block;
	width: 350px;
	height: 350px;
	border-radius: 50%;
	background: url(../img/index/shimicare3.jpg) no-repeat top right;
	background-size: contain;
	border: 8px solid #e6ebe8;
}
#shimi .more-info {
	clear: both;
  display: block;
	width: 100%;
  max-width: 340px;
	height: auto;
	border-radius: 40px;
  text-align: center;
	background-color: #736891;
  font-size: 112.5%;
  color: #fff;
  text-decoration: none;
	margin: 50px auto 20px;
  padding: 20px 0;
  transition: .4s;
}
#shimi .more-info a {
  color: #FFF;
	margin: auto;
	padding: 20px;
}
#shimi .more-info:hover {
  background-color: #8d7bbd;
  border-color: #8d7bbd;
}*/


#shimi {
	width:100%;
	text-align: center;
	margin: 0 auto;
	padding: 50px 0;
	background-color: #f0e4e4;
	background: url(../img/index/shimi-bg.jpg) no-repeat top right;
	background-size: contain;
}
.shimi-l {
	float: left;
	width: 50%;
	padding:20px;
	text-align: left;
}
.shimi-r {
	float: right;
	width: 50%;
	padding:20px;
}
.shimi-r img{
	width: 100%;
	max-width: 90%;
	border: 8px solid #e6ebe8;
}
.shimi p{
	text-align: left;
}
#shimi .more-info {
	clear: both;
  display: block;
	width: 100%;
  max-width: 340px;
	height: auto;
	border-radius: 40px;
  text-align: center;
	background-color: #736891;
  font-size: 112.5%;
  color: #fff;
  text-decoration: none;
	margin: 50px auto 20px;
  padding: 20px 0;
  transition: .4s;
}
#shimi .more-info a {
  color: #FFF;
	margin: auto;
	padding: 20px 50px;
}

#shimi .more-info:hover {
  background-color: #8d7bbd;
  border-color: #8d7bbd;
}


#aroma{
	width:100%;
	text-align: center;
	padding: 50px 0;
	margin: 0 auto;
	background: url(../img/index/aroma-bg.jpg) no-repeat center bottom;
	background-size: cover;
}
#aroma-inner{
	width: 100%;
	max-width: 1120px;
	text-align: center;
	padding: 50px 0;
	margin: 0 auto;
}
.aroma-l {
	float: left;
	width: 50%;
	padding:20px;
	text-align: left;
}
.aroma-r {
	float: right;
	width: 50%;
	padding:20px;
}
.aroma-r img{
	width:400px;
	border: 8px solid #e6ebe8;
}
.aroma-l p{
	text-align: left;
}
#aroma .more-info {
	clear: both;
  display: block;
	width: 100%;
  max-width: 340px;
	height: auto;
	border-radius: 40px;
  text-align: center;
	background-color: #736891;
  font-size: 112.5%;/*18px*/
  color: #fff;
  text-decoration: none;
	margin: 50px auto 20px;
  padding: 20px 0;
  transition: .4s;
}
#aroma .more-info a {
  color: #FFF;
	margin: auto;
	padding: 20px 80px;
}

#aroma .more-info:hover {
  background-color: #8d7bbd;
  border-color: #8d7bbd;
}


#babymassage {
	width:100%;
	text-align: center;
	padding: 50px 0;
	background-color: #f0e4e4;
}
.babymassage-l {
	float: left;
	width: 50%;
	padding:20px;
	text-align: left;
}
.babymassage-r {
	float: right;
	width: 50%;
	padding:20px;
}
.babymassage-r img{
	width:400px;
	border: 8px solid #e6ebe8;
}
.babymassage-l p{
	text-align: left;
}
#lipocele {
	width:100%;
	text-align: center;
	padding: 50px 0;
	background-color: #f0e4e4;
}
.lipocele-l {
	float: left;
	width: 50%;
	padding:20px;
	text-align: left;
}
.lipocele-r {
	float: right;
	width: 50%;
	padding:20px;
}
.lipocele-r img{
	width:400px;
	border: 8px solid #e6ebe8;
}
.lipocele-l p{
	text-align: left;
}
#lipocele .more-info {
	clear: both;
  display: block;
	width: 100%;
  max-width: 340px;
	height: auto;
	border-radius: 40px;
  text-align: center;
	background-color: #736891;
  font-size: 112.5%;/*18px*/
  color: #fff;
  text-decoration: none;
	margin: 50px auto 20px;
  padding: 20px 0;
  transition: .4s;
}
#lipocele .more-info a {
  color: #FFF;
	margin: auto;
	padding: 20px 80px;
}

#lipocele .more-info:hover {
  background-color: #8d7bbd;
  border-color: #8d7bbd;
}


#contact {
	width:100%;
	text-align: center;
	padding: 50px 0;
	background-color: #fff;
}
#contact-inner {
	width: 100%;
	max-width: 1120px;
	text-align: center;
	padding: 30px 0;
	margin: 0 auto 30px;
	border: 5px solid #e6ebe8;
}
.reservation {
	font-size: 200%;/*32px*/
	color: #736891;
	line-height: 1.2;
	padding: 10px;
}
#contact .tel{
	font-size: 250%;/*40px*/
	font-weight: 500;
	color: #000;
	line-height: 1.2;
	padding: 10px 0;
}
#contact .caution {
	font-size: 75%;/*12px*/
	line-height: 1.6;
	padding: 10px;
}
#contact .open{
	font-size: 150%;/*24px*/
	font-weight: 500;
	color: #555;
	line-height: 1.2;
	padding: 10px 10px 5px;
}
#contact .close{
	font-size: 150%;/*24px*/
	font-weight: 500;
	color: #555;
	line-height: 1.2;
	padding: 5px 10px 10px;
}
#contact .more-info {
  display: block;
	width: 100%;
  max-width: 380px;
	height: auto;
	border-radius: 40px;
  text-align: center;
	background-color: #736891;
	background-image: url(../img/index/cellphone.png);
	background-repeat: no-repeat;
	background-position: 1.8em 0.7em;
	background-size: 40px;
  font-size: 112.5%;/*18px*/
  color: #fff;
  text-decoration: none;
	margin:80px auto 50px;
  padding: 20px 0 20px 20px;
  transition: .4s;
}
#contact .more-info a {
  padding: 20px 50px 20px;
  color: #FFF;
}
#contact .more-info:hover {
  background-color: #8d7bbd;
  border-color: #8d7bbd;
}

#contact .bl_inline {
	display: inline;
	width: 100%;
	max-width: 100px;
	margin: 10px 0;
/*	text-align: center;*/
}
#contact .bl_inline a{
	margin: 10px 0;
}
#contact .bl_inline a:link{
	text-decoration: none;
	color: #fff;
}
#contact .bl_inline a:hover{
  background-color: #fff;
  border-color: #8d7bbd;
	color:#8d7bbd;
}
#contact .el_btn {
	display: inline-block;
	width: 100%;
	max-width: 300px;
	font-size: 1.0rem;
/*	padding: 10px 5%;*/
	background-color: #8d7bbd;
  border-color: #8d7bbd;
}


#infomation {
	width: 100%;
	text-align: center;
	padding: 50px 0;
	background: #f0e4e4;
}
#news {
	width: 100%;
	max-width: 1120px;
	text-align: center;
	padding: 50px 0;
	margin: 0 auto;
	background: #fff;
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.2);
}
#news ul {
   margin:30px;
   padding:0;
}
#news li {
	text-align: left;
   padding:15px 0 15px 7em;
   text-indent: -7em;
   border-bottom:1px solid #b3b3b3;
}
#news .date {
   display:inline-block;
   width:7em;
   text-indent:0;
}
#news li a {
   text-decoration:none;
}
#news li a:hover {
   color:#c6d7e7;
}

#aboutus .menu-top-h2 {
	margin: 20px auto 0;
	padding: 20px;
  border: 1px solid #007f89;
	border-radius: 3px;
  width: 30%;
  text-align: center;
	color: #007f89;
}
/*#menu{
	width:100%;
	text-align: center;
	padding: 50px 0;
	margin: 0 auto;
	background: url(../img/index/aroma-bg.jpg) no-repeat center bottom;
	background-size: cover;
}*/

@media screen and (min-width: 0px) and (max-width: 1119px) {
#title {
	padding: 180px 20px 0 0;
  font-size: 200%;/*36px*/
	letter-spacing: 0.1em;
}
#shimi{
	background-size: cover;
}
.shimicare1 {    
	clear: both;
	float: none;
	margin: 40px auto;
}
.shimicare1 p{
  width: 100%;
}
.shimicare1-img{
	width: 100%;
}
.shimicare2 {    
	clear: both;
	float: none;
	margin: 40px auto;
}
.shimicare2 p{
  width: 100%;
}
.shimicare2-img{
	width: 100%;
}
.shimicare3 {    
	clear: both;
	float: none;
	margin: 40px auto;
}
.shimicare3 p{
  width: 100%;
}
.shimicare3-img{
	width: 100%;
}
#contact {
	padding: 50px 50px;
}
#aroma-inner{
	width:100%;
}
#news {
	padding: 10px 10px;
}
#news ul {
   margin:30px;
   padding:0;
}
#news li {
	text-align: left;
   padding:15px 0 15px 7em;
   text-indent: -7em;
   border-bottom:1px solid #b3b3b3;
}
#news .date {
   display:inline-block;
   width:7em;
   text-indent:0;
	}
}
@media screen and (min-width: 0px) and (max-width: 980px) {
#index-main {
	background-size:cover;
	background-position: center;
}
#news li {
	text-align: left;
	padding:15px 0 15px 0;
	text-indent: none;
	border-bottom:1px solid #b3b3b3;
}
#news .date {
   display:block;
   width:100%;
	}
}
@media screen and (min-width: 0px) and (max-width: 860px) {
#index-main h3 {
  font-size: 150%;/*24px*/
}
}
@media screen and (min-width: 0px) and (max-width: 768px) {
#index-main {
	height: 200px;
}
#index-main h3 {
  font-size: 150%;/*24px*/
	padding-top: 80px;
}

#index-main-inner {
	height: 200px;
	background-size: contain;
}
#index-main  .more-info {
	margin: 10px 20px;
  padding: 10px 0;
}
#title {
	text-align: right;
	padding-top: 90px;
  font-size: 125%/*20px*/;
}
#shimi{
	background: none;
}
.shimi-l {
	width: 100%;
	padding:20px;
}
.shimi-r {
	width: 100%;
	padding: 10px;
}
.shimi-r img{
	width: 100%;
	border: 5px solid #e6ebe8;
}
.shimi-l p{
	text-align: left;
}



.lipocele-l {
	width: 100%;
	padding:20px;
}
.lipocele-r {
	width: 100%;
	padding: 10px;
}
.lipocele-r img{
	width: 100%;
	border: 5px solid #e6ebe8;
}
.lipocele-l p{
	text-align: left;
}

.aroma-l {
	width: 100%;
	padding:20px;
}
.aroma-r {
	width: 100%;
	padding: 10px;
}
.aroma-r img{
	width: 100%;
	border: 5px solid #e6ebe8;
}
.aroma-l p{
	text-align: left;
}
.babymassage-l {
	width: 100%;
	padding:20px;
}
.babymassage-r {
	width: 100%;
	padding: 10px;
}
.babymassage-r img{
	width: 100%;
	border: 5px solid #e6ebe8;
}
#contact {
	padding: 50px 20px 10px;
}
.reservation {
	font-size: 150%;/*24px*/
}
#contact .tel{
	font-size: 200%;/*32px*/
}
#contact .caution {
	font-size: 75%;/*12px*/
}
#contact .open{
	font-size: 125%;/*20px*/
}
#contact .close{
	font-size: 125%;/*20px*/
}
#contact .more-info {
	margin: 60px auto 50px;
  padding: 20px 0 20px 20px;
}
}
@media screen and (min-width: 0px) and (max-width: 705px) {
h2{
  margin-bottom: 30px;
}
.shimicare1 {    
	margin: 20px auto;
}
.shimicare1 p{
	margin: 20px auto;
  padding: 10px;
}
.shimicare2 {    
	margin: 20px auto;
}
.shimicare2 p{
	margin: 20px auto;
  padding: 10px;
}
.shimicare3 {    
	margin: 20px auto;
}
.shimicare3 p{
	margin: 20px auto;
  padding: 10px;
}
#infomation {
	padding: 20px 0 50px;
}
}
@media screen and (min-width: 0px) and (max-width: 560px) {
#index-main h3 {
  font-size: 125%;/*20px*/
}
#index-main  .more-info {
  display: none;
}
#index-main .bl_inline {
	display: none;
}
#shimi{
	padding: 30px 0;
}
#aroma{
	padding: 30px 0;
}
#babymassage {
	padding: 30px 0;
}
#lipocele {
	padding: 30px 0;
}
#contact .more-info {
	margin: 30px auto 10px;
}
}
@media screen and (min-width: 0px) and (max-width: 480px) {
#title {
  font-size: 100%/*16px*/;
}
#index-main {
	height: 150px;
}
#index-main-inner {
	height: 150px;
}
#index-main h3 {
	padding-top: 80px;
  font-size: 100%;/*16px*/
}
.container {
	padding: 0 20px;
}
#aboutus {
	padding: 20px 0 50px;
}
.shimicare1 {
	margin: 10px auto;
}
.shimicare2 {
	margin: 50px auto;
}
.shimicare3 {
	margin: 20px auto;
}
.shimicare1 p{
  padding: 10px 0;
}
.shimicare2 p{
  padding: 10px 0;
}
.shimicare3 p{
  padding: 10px 0;
}
.reservation {
	font-size: 125%;/*20px*/
}

#contact .tel{
	font-size: 150%;/*24px*/
}
#contact .caution {
	font-size: 75%;/*12px*/
}
#contact .open{
	font-size: 112.5%;/*18px*/
}
#contact .close{
	font-size: 112.5%;/*18px*/
}
#contact .more-info {
  width: 320px;
	background-position: 0.5em 1.0em;
	background-size: 30px;
}
#contact .more-info a {
  padding: 20px 10px;
}
#shimi .more-info {
	margin: 50px auto 20px;
  padding: 20px 0;
	}
}
@media screen and (min-width: 0px) and (max-width: 420px) {
#title {
  font-size: 100%/*16px*/;
}
#index-main h3 {
	padding: 70px 10px 0;
  font-size: 100%;/*16px*/
}
/* ... */	
.textbox {
  position: relative;
  width: 100%;
/*  height: 200px;*/
  margin: 0 auto;
  overflow: hidden;
  line-height: 1.3;
}
/*.textbox:before, .textbox:after {
  position: absolute;
  background: #e6ebe8;
}
.textbox:before {
  content: "･･･";
  bottom: 0;
  right: 0;
}
.textbox:after {
  content: "";
  width: 100%;
  height: 100%;
}*/
}
@media screen and (min-width: 0px) and (max-width: 380px) {
.shimicare1 {
	height: auto;
	margin: 0 auto;
}
.shimicare2 {
	height: auto;
	margin: 0 auto;
}
.shimicare3 {
	height: auto;
	margin: 0 auto;
}
	
.shimicare1-img{
	width: 300px;
	height: 300px;
	margin: 0 auto;
}
.shimicare2-img{
	width: 300px;
	height: 300px;
	margin: 0 auto;
}
.shimicare3-img{
	width: 300px;
	height: 300px;
	margin: 0 auto;
}
#shimi .more-info {
	margin: 30px auto 20px;
}
}
@media screen and (min-width: 0px) and (max-width: 375px) {
#shimi .more-info {
	width: 100%;
	max-width: 340px;
}
/*.textbox:before {
  right: 6px;
}*/
}
@media screen and (min-width: 0px) and (max-width: 374px) {
#title {
  font-size: 93.75%/*15px*/;
}
#index-main h3 {
	padding: 70px 10px 0;
  font-size: 93.75%;/*15px*/
}
}

@media screen and (min-width: 0px) and (max-width: 360px) {
#title {
  font-size: 87.5%/*14px*/;
}
#index-main h3 {
	padding: 70px 10px 0;
  font-size: 87.5%;/*14px*/
}
.textbox:before {
  right: 0;
}
}

@media screen and (min-width: 0px) and (max-width: 350px) {
.shimicare1-img{
	width: 270px;
	height: 270px;
}
.shimicare2-img{
	width: 270px;
	height: 270px;
}
.shimicare3-img{
	width: 270px;
	height: 270px;
}
}
@media screen and (min-width: 0px) and (max-width: 340px) {
#index-main h3 {
  font-size: 81.25%;/*13px*/
}
#contact .more-info {
	max-width: 280px;
	font-size: 100%;
}
#shimi .more-info a {
	padding: 20px 10px;
}
}