@charset "UTF-8";

/***************
  main
****************/

main {
  margin-bottom: 0px;
  overflow: hidden;
	background: #ef93bb;
}

.moreLink a {
  border: 1px solid;
  border-radius: 3px;
  color: #90BE59;
  display: block;
  padding: 10px;
  text-align: center;
  text-decoration: none;
}

.mtimg img {
	width: 100%;
	margin: 10px;
}

.logo5 {
  width: 100%;
  height: 580px;
background:#ddd url(../../images/top.jpg) no-repeat center center;
background-size: 100%;
}

.toplink {
	padding-top: 500px;
}

.logo-r {
  width: 100%;
  height: 580px;
background:#ddd url(../../images/recruit4.jpg) no-repeat center center;
background-size: 100%;
}

/* mainImage */

.mainImage {
  padding: 5px;
}

.mainImage .imageScroll {
  border: 1px solid #eee;
  border-radius: 3px;
}

.mainImage img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
}

.pimg img {
	width: 100%;
}

.boxbase {
	box-sizing: border-box;
}

.boxbase .box {
    margin: 5px 5px;
	text-align: left;
	border: #DCDCDC 0.5px solid;
	border-radius: 3px;
	padding: 5px 5px;
}

.boxbase .box .boximg {
  max-height: 100%;
  max-width: 100%;
	text-align: center;
}

.boxbase .box .boximg img {
  display: block;
  max-height: 100%;
  max-width: 100%;
  text-align: center;
}

.topss {
  overflow: hidden;
  background-color: #ffffff;
}

.topss2 {
  margin: 10px auto 10px;
  overflow: hidden;
}

.topss2 p {
	padding: 0 5px;
	font-size: 13px;
	margin: 10px 10px;
	line-height: 25px;
}


.logo-b {
  width: 100%;
  height: 600px;
background:#ddd url(../../images/beauty4.jpg) no-repeat center center;
background-size: 100%;
}


/* product */


.product {
 	  background: #FCF7E9;
}

.product .toph1{
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    margin-bottom: 30px;
  width: 250;
  height: 300px;
	text-align: center;
}

.boxiba {
	overflow:hidden;
	background: #FCF7E9;
	width: 100%;
}

.boxibase {
	box-sizing: border-box;
	text-align: center;
	background: #FCF7E9;
	padding: 0 10px;
}

.boxibase .boxi {
    margin: 5px 5px;
	width: 46%;
	float: left;
}

.boxibase .boxi .boxiimg {
    margin: 5px 0px;
	text-align: center;
}

.boxibase .boxi .boxiimg img {
  max-height: 100%;
  max-width: 100%;
  text-align: center;
}

.shopp {
	font-size: 18px;
	text-align: center;
  max-width: 100%;
	margin: 10px 0px 10px;
}

.shopp span {
	font-family: "Lemosty";
}





/*==================================================
ふわっ
===================================*/


/* fadeUp */

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}


/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.fadeUpTrigger{
    opacity: 0;
}




/* s2 */


.s2 {
  overflow: hidden;
  background-color: #FFFFFF;
	text-align: center;
}

.ds2 {
  margin: 10px auto 20px;
  overflow: hidden;
}

.s22 {
  overflow: hidden;
  background-color: #F3F3F3;
	text-align: center;
}

.ds22 {
  margin: 10px auto 20px;
  overflow: hidden;
}

.s222 {
  overflow: hidden;
  background-color: #FCF7E9;
	text-align: center;
}

.ds222 {
  margin: 10px auto 20px;
  overflow: hidden;
}

.mtimg {
	text-align: center;
	width: 100%;
}

.img{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
}

.btn {
	position: relative;
	width: 100%;
	height: 280px;
	margin: 5px auto;
	display: block;
	overflow: hidden;
	cursor: pointer;
	float: left;
}
.btn img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	display: block;
	-webkit-transition: .4s ease-in-out;
	transition: .4s ease-in-out;
}
.btn:hover img:nth-of-type(2) {
	opacity: 0;
}

.btn2 {
	position: relative;
	width: 100%;
	height: 300px;
	margin: 5px auto;
	display: block;
	overflow: hidden;
	cursor: pointer;
	float: left;
}
.btn2 img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	display: block;
	-webkit-transition: .4s ease-in-out;
	transition: .4s ease-in-out;
	object-fit: cover;
}
.btn2:hover img:nth-of-type(2) {
	opacity: 0;
}


.img2{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
}


.img3{
  width:100%;
  height:280px;
	float: left;
}


.img4{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
}

.img5{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
}


.img6{
  width:100%;
  height:280px;
	float: left;
}



.mtimg2 {
	text-align: center;
	  height:280px;
}



.imgr{
	margin: 30px auto;
	float: left;
}

.imgr img{
  max-width: 100%;
}



.pps2 {
font-family: 'Barlow Condensed','Noto Sans','Noto Sans JP', sans-serif;
font-size: 40px;
color: #fff;
  top: 50%;
  left: 50%;
padding: 130px 0 0 0;
margin: 0px;	
}


.pps3 {
color: #fff;
text-align: center;
margin: 0px;
}

.pps22 {
font-family: 'Barlow Condensed','Noto Sans','Noto Sans JP', sans-serif;
font-size: 40px;
color: #000;
  top: 50%;
  left: 50%;
padding: 130px 0 0 0;
margin: 0px;	
}


.pps33 {
color: #000;
text-align: center;
margin: 0px;
}

.toph2{
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 10px;
	text-align: left
}


/***************
  footer
****************/

/* contact */

.contact {
  background: #fafafa;
  padding: 50px 20px;
}

.contact h2 {
  font-size: 30px;
  text-align: center;
}

.contact form {
  margin: 30px auto 0;
}

.contact form dl {
  margin-bottom: 30px;
}

.contact form dl dt {
  font-size: 13px;
  margin-bottom: 10px;
}

.contact form dl.required dt:after {
  color: #f30;
  content: "*必須";
  font-size: 10px;
  margin-left: 10px;
  vertical-align: super;
}

.contact form dl dd input,
.contact form dl dd textarea,
.contact form dl dd select {
  /* width: 100% と padding: 10px が干渉してしまうのを防ぐ */
  box-sizing: border-box; /* border と padding を 幅と高さに含めます */
  border: 1px solid #d2d2d2;
  border-radius: 3px;
  padding: 10px;
  width: 100%;
}

.contact form dl dd textarea {
  height: 200px;
}

.contact form dl dd select {
  background: #fff;
  height: 46px;
}

.contact form .buttonArea {
  text-align: center;
}

.contact form .buttonArea button {
  background-color: #90BE59;
  border: none;
  border-radius: 3px;
  box-shadow: 2px 2px #1a6ea0;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  padding: 8px 0 10px;
  text-decoration: none;
  width: 200px;
}

.ds2 {
  margin: 10px auto 20px;
  overflow: hidden;
}

.mtimg {
	text-align: center;
	width: 100%;
}

.img{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
  background:url('../../images/yamanoue2.jpg');
}

.img:hover{
  background:url('../../images/yamanoue.jpg');
}

.img2{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
  background:url('../../images/miyanosaka2.jpg');
}

.img2:hover{
  background:url('../../images/miyanosaka.jpg');
}

.img3{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
  background:url('../../images/beauty2.jpg');
}

.img3:hover{
  background:url('../../images/beauty.jpg');
}


.imgr{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
  background:url('../../images/r-st.jpg');
}

.imgr:hover{
  background:url('../../images/r-st2.jpg');
}

.imgr2{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
  background:url('../../images/r-as.jpg');
}

.imgr2:hover{
  background:url('../../images/r-as2.jpg');
}

.imgr3{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
  background:url('../../images/r-na.jpg');
}

.imgr3:hover{
  background:url('../../images/r-na2.jpg');
}

.imgr4{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
  background:url('../../images/r-el.jpg');
}

.imgr4:hover{
  background:url('../../images/r-el2.jpg');
}

.imgr5{
  width:100%;
  height:280px;
  margin: 5px auto 20px;
	float: left;
  background:url('../../images/r-eb.jpg');
}

.imgr5:hover{
  background:url('../../images/r-eb2.jpg');
}
