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

html{
  font-size: 10px;
}
#lp_{
	width: 1120px;
	margin: 0 auto 17%;
}
.frame_{
	width: 1050px;
}
::selection{
  color: #A0A0A0;
  background-color: none;
}
#lp_ article{
	margin: auto;
}
#lp_ li{
  list-style: none;
}
#lp_ img{
	width: 100%;
}
#lp_ .credit_{
	font-family: serif;
	font-size: 2.1rem;
	font-weight: 200;
	text-align: left;
  line-height: 1.8;
  letter-spacing: 0.05rem;

}
#lp_ .credit_ span{
	font-size: 1.8rem;

}
#lp_ .credit_ a{
    	text-decoration: none;
}

/* -----------------------------------------------
フェードインの動きの大きさ設定
-------------------------------------------------- */
@keyframes fadeInUpsmall{
	0%{opacity:0;transform:translate3d(0,10%,0)}
	to{opacity:1;transform:none}
}
.fadeInUpsmall{	animation-name:fadeInUpsmall}

@keyframes fadeInDownsmall{
	0%{opacity:0;transform:translate3d(0,-10%,0)}
	to{opacity:1;transform:none}
}
.fadeInDownsmall{animation-name:fadeInDownsmall}

@keyframes fadeInRightsmall{
	0%{opacity:0;transform:translate3d(10%,0,0)}
	to{opacity:1;transform:none}
}
.fadeInRightsmall{animation-name:fadeInRightsmall}

@keyframes fadeInLeftsmall{
	0%{opacity:0;transform:translate3d(-10%,0,0)}
	to{	opacity:1;transform:none}
}
.fadeInLeftsmall{animation-name:fadeInLeftsmall}

/* -----------------------------------------------
/フェードインの動きの大きさ設定
-------------------------------------------------- */

#lp_ section{
margin-bottom:200px;
}
#lp_ .flex_,#lp_ .flex2_{
display: flex;
justify-content: center;

}
#lp_ .rela_,#lp_ .rela_ li{
position: relative;
}
#lp_ .rela_,#lp_ .flex2_{
margin-top: 120px;
}
#lp_ .back_,#lp_ .back2_{
position: absolute;  
}
#lp_ .mozi_{
position: absolute !important;
width: 34%;
}
.slick-prev:before,
.slick-next:before{
color: #555;
}

/*cont_1*/
#lp_ .cont_1 .back_{
  background-color: #dabec1;
  width: 80%;
  height: 67%;
  top: 10%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
#lp_ .cont_1 .back2_{
  background-color: #b98388;
  width: 80%;
  height: 17%;
  top: 10%;
  left: 10%;
}
#lp_ .cont_1 .photo_3{
  width: 54%;
  margin: 0 0 0 4%;
}
#lp_ .cont_1 .photo_4{
  position: absolute !important;
  width: 45%;
  top: 18%;
  right: 4%;
}
#lp_ .cont_1 .photo_5{
  width: 40%;
  margin: 3% 0 0 7%;
}
#lp_ .cont_1 .credit_{
  position: absolute !important;
  left: 52%;
  bottom: 13%;
}

/*cont_2*/
#lp_ .cont_2 .back_{
  background-color: #f4edd8;
  width: 80%;
  height: 67%;
  top: 13%;
  right: 4%;
}
#lp_ .cont_2 .back2_{
  background-color: #e9ddb4;
  width: 40%;
  height: 27%;
  bottom: 20%;
  left: 16%;
}
#lp_ .cont_2 .photo_3{
  width: 40%;
  margin: 0 0 0 53%;
}
#lp_ .cont_2 .photo_4{
  position: absolute !important;
  width: 47%;
  top: 8%;
  left: 4%;
}
#lp_ .cont_2 .photo_5{
  width: 40%;
  margin: 3% 0 0 48%;
}
#lp_ .cont_2 .mozi_{
  bottom: 20%;
  left: 3%;
}
#lp_ .cont_2 .credit_{
  position: absolute !important;
  left: 21%;
  bottom: 15%;
}

/*cont_3*/
#lp_ .cont_3 .flex2_{
  gap: 0 50px;
  align-items: center;
}
#lp_ .cont_3 .fleximg1_{
width: 45%;
}
#lp_ .cont_3 .fleximg2_{
  width: 40%;
}

#lp_ .cont_3 .back_{
  background-color: #d0d8e4;
  width: 78%;
  height: 95%;
  top: 7%;
  right: 0%;
}
#lp_ .cont_3 .back2_{
  background-color: #edf0f3;
  width: 40%;
  height: 70%;
  top: 7%;
  right: 0%;
}
#lp_ .cont_3 .photo_3{
  width: 30%;
  margin: 0 0 0 14%;
}
#lp_ .cont_3 .photo_4{
  position: absolute !important;
  width: 52%;
  top: 8%;
  right: 4%;
}
#lp_ .cont_3 .photo_5{
  width: 40%;
  margin: 6% 0 0 4%;
}
#lp_ .cont_3 .mozi_{
  bottom: -13%;
  left: 5%;
}
#lp_ .cont_3 .credit_{
  position: absolute !important;
  left: 50%;
  bottom: 10%;
}

/*cont_4*/
#lp_ .cont_4 .flex2_{
gap: 0 50px;
}
#lp_ .cont_4 .flex2_ li{
width: 45%;
}
#lp_ .cont_4 .fleximg2_{
  margin-top: 130px;
}
#lp_ .cont_4{
margin-top: 19%;
position: relative;
}
#lp_ .cont_4 .mozi_{
  bottom: 2%;
  left: 1%;
}
#lp_ .cont_4 .credit_{
position: absolute !important;
bottom: 0%;
left: 9%;
}

/*cont_5*/
#lp_ .cont_5 .back_{
background-color: #f9f8e4;
width: 79%;
height: 72%;
bottom: 20%;
right: 0%;
}
#lp_ .cont_5 .back2_{
background-color: #f2eebf;
width: 48%;
height: 24%;
bottom: 17%;
right: 0%;
}
#lp_ .cont_5 .photo_1{
width: 46%;
margin: 0 0 0 4%;
}
#lp_ .cont_5 .photo_2{
position: absolute !important;
width: 48%;
top: 14%;
right: 0;
}
#lp_ .cont_5 .photo_3{
width: 43%;
margin: 4% 0 0 14%;
}
#lp_ .cont_5 .credit_{
position: absolute !important;
left: 61%;
bottom: 6%;
}

/*cont_6*/
#lp_ .cont_6 .flex2_{
gap: 0 50px;
}
#lp_ .cont_6 .flex2_ li{
width: 45%;
}
#lp_ .cont_6 .fleximg1_{
  margin-top: 120px;
}
#lp_ .cont_6 .rela1_ .credit_{
position: absolute !important;
left: 53%;
bottom: 2%;
}

#lp_ .cont_6 .back_{
background-color: #f8e3dc;
width: 80%;
height: 57%;
left: 0;
bottom: 21%;
}
#lp_ .cont_6 .back2_{
background-color: #efc2b4;
width: 20%;
height: 24%;
right: 20%;
bottom: 21%;
}
#lp_ .cont_6 .photo_3{
width: 48%;
margin: 0 0 0 4%;
}
#lp_ .cont_6 .photo_4{
position: absolute !important;
width: 42%;
top: 19%;
right: 4%;
}
#lp_ .cont_6 .photo_5{
width: 43%;
margin: 9% 0 0 18%;
}
#lp_ .cont_6 .mozi_{
  bottom: 46%;
  left: 5%;
}
#lp_ .cont_6 .rela2_ .credit_{
text-align: center;
margin-top: 4%;
}

/*btn_*/
#lp_ .btn_{
width: 500px;
margin: 16% auto 0;
box-shadow: 2.8px 1.8px 2px rgb(0 0 0 / 1%), 9.4px 6px 6.7px rgb(0 0 0 / 2%), 42px 27px 30px rgb(0 0 0 / 3%);
}