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

#lp_{
	margin: 0 auto 150px;
	width: 1120px;
	/*background-color: antiquewhite;*/
}

#lp_ .frame_{
	margin: auto;
	width: 1100px;}

#lp_ img{
	width: 100%;
}

#lp_ .credit{
	font-family: serif;
	font-size: 1.6rem;
	font-weight: bold;
	margin: 4% auto 15%;
	text-align: center;
}

#lp_ .credit a{
	text-decoration: underline;
}


#lp_ .cooperation_{
	width: 100%;
	margin: 30px 0 0;
	text-align: center;
	font-size:1.5rem;
	line-height:2.2;
	font-family: serif;
}

/* -----------------------------------------------
フェードインの動きの大きさ設定
-------------------------------------------------- */
@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}

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

.content_1,.content_5,.content_8{
	position: relative;
}

.imgframe_{
	display: flex;
	gap: 8%;
}

.mojiitem_{
	position: absolute;
	width: 5%;
}

.content_1 .item_o_{
	top: 6%;
	left: 40.5%;
}
.content_1 .item_n_{
	width: 4.2%;
	top: 15.3%;
	left: 47%;
}
.content_1 .item_e1_{
	width: 3.5%;
	top: 25%;
	left: 53%;
}
.content_1 .item_p_{
	width: 4%;
	top: 43%;
	left: 47%;
}
.content_1 .item_i_{
	width: 2.3%;
	top: 53%;
	left: 53%;
}
.content_1 .item_e2_{
	width: 3.5%;
	top: 63%;
	left: 58%;
}
.content_1 .item_c_{
	top: 73%;
	left: 63%;
}
.content_1 .item_e3_{
	width: 3.5%;
	top: 81%;
	left: 69%;
}


.tileframe_{
	position: relative;
	height: auto;
}


.tileframe_:before{
    content: "";
    display: block;
    padding-top: 114.4%; 
}

.tileitem_{
	position: absolute;
}

.tilecredit_, .tilecredit2_{
	display: flex;
}

.tilecredit_ .credit{
	text-align: left !important;
	line-height: 2;
	margin: 2% auto 0 !important;
	width: 50%;
}

.tilecredit_ a,.tilecredit2_ a{
	color: #fff;
}




.content_2{
	margin: 10% auto 15%;
	padding: 5% 5% 4%;
	background-color: #e5c3db;
}

.content_2 .item1_, .content_6 .item1_{
	width: 45%;
	bottom: 0;
}

.content_2 .item2_,.content_6 .item2_{ 
	width: 45%;
	top:0;	
}
.content_2 .item3_, .content_6 .item3_{
	width: 51%;
	top:0;
	right: 0;
}




.content_4{
	margin: 10% auto 15%;
	padding: 5% 5% 4%;
	background-color: #da0d2c;
}
.content_4 .item1_{
	width: 45%;
	bottom: 0;
		right: 0;
	
}
.content_4 .item2_{
	width: 45%;
	top:0;	
		right: 0;
}
.content_4 .item3_{
	width: 51%;
	top:0;
}

.tilecredit2_ .credit{
	text-align: left !important;
	line-height: 2;
	margin: 2% 0 0 0 !important;
	width: 40%;
}

.tilecredit2_ .credit2{
	width: 55%;
}

.content_5 .item_b_{
	width: 4%;
	top: 3%;
	left: 30%;
}
.content_5 .item_l_{
	width: 2.5%;
	top: 15%;
	left: 38%;
}
.content_5 .item_o_{
	width: 4.5%;
	top: 28%;
	left: 45%;
}

.content_5 .item_u_{
	width: 4%;
	top: 38%;
	left: 52.5%;
}

.content_5 .item_s_{
	width: 3%;
	top: 49%;
	left: 60%;
}
.content_5 .item_e_{
	width: 3.6%;
	top: 58%;
	left: 66%;
}

.content_5 .item_s2_{
	width: 3%;
	top: 40%;
	left: 37%;
}

.content_5 .item_k_{
	width: 4%;
	top: 50%;
	left: 43%;
}
.content_5 .item_i_{
	width: 2.4%;
	top: 57%;
	left: 50%;
}

.content_5 .item_r_{
	width: 4.5%;
	top: 68%;
	left: 55%;
}
.content_5 .item_t_{
	width: 3.5%;
	top: 76%;
	left: 61.5%;
}



.content_6{
	margin: 10% auto 15%;
	padding: 5% 5% 4%;
	background-color: #9ec2dc;
}

.content_7{
	position: relative;
	height: auto;
}
.content_7:before{
    content: "";
    display: block;
    padding-top: 80%; 
}

.content_7 .item1_{
	width: 43%;
	top: 0;
	left: 5%
}

.content_7 .item2_{
	width: 43%;
	right: 5%;
	bottom:  0;
}

.content_7 .item3_{
	width: 100%;
	top: 50%;
	left: 0%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}


.content_8{
	margin-top: 10%;
}

.content_8 .item_k2_{
	width: 4%;
	top: 14%;
	left: 32%;
}
.content_8 .item_n_{
	width: 4%;
	top: 22.6%;
	left: 39%;
}
.content_8 .item_i2_{
	width: 2.3%;
	top: 33%;
	left: 46.4%;
}
.content_8 .item_t2_{
	width: 3.5%;
	top: 43%;
	left: 52%;
}

.content_8 .item_s2_{
	width: 3%;
	top: 50%;
	left: 37%;
}

.content_8 .item_k_{
	width: 4%;
	top: 60%;
	left: 43%;
}
.content_8 .item_i_{
	width: 2.4%;
	top: 67%;
	left: 50%;
}

.content_8 .item_r_{
	width: 4.1%;
	top: 77%;
	left: 55%;
}
.content_8 .item_t_{
	width: 3.5%;
	top: 86%;
	left: 61.5%;
}

.end_btn_{
	width: 500px;
	margin: auto;
	margin-top: 12%;
}
.end_btn_ img{
	box-shadow:
	2.8px 1.8px 2px rgba(0, 0, 0, 0.012),
	9.4px 6px 6.7px rgba(0, 0, 0, 0.018),
	42px 27px 30px rgba(0, 0, 0, 0.03);
}