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

/* 中身======================================================================================================== */

#top_copy{
}
#top_copy .text{
}
#top_copy .text h3{
padding: 0;
margin-bottom: 10px;
}
#top_copy .text em{
display: block;
color: #ff7f7f;
font-size: 18px;
font-weight: bold;
}
#top_copy .text strong{
display: block;
font-size: 20px;
color: #e50000;
}


.howto{
margin-top: 60px;
}
.howto li{
padding-top: 60px;
}

.howto li .box{
padding: 80px 20px 20px;
border: solid 3px #06c755;
border-radius: 20px;
position: relative;
}
.howto#line li .box{
border-color: #06c755;
}
.howto#instagram li .box{
border-color: #ea338a;
}
.howto li:nth-child(even) .box{
margin-left: auto;
}
.howto li .box .n{
display: grid;
place-items: center;
width: 100px;
height: 100px;
border-radius: 50%;
position: absolute;
top: -30px;
left: -3px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
margin: 0 auto;

}
.howto#line li .box .n{
background-color: #06c755;
}
.howto#instagram li .box .n{
background-color: #ea338a;
}
.howto li .text{
}
.howto li .text h4{
font-size: 18px;
font-weight: bold;
margin-bottom: 10px;
}


.howto li .img{
text-align: center;
margin-top: 20px;
}
.howto li .img .btn img{
width: 150px;
margin-bottom: 20px;
}
.howto li .img .qr img{
max-width: 150px;
max-height: 150px;
}
.howto li .img .ss{
text-align: right;
}

.howto li .sumaira{
position: absolute;
}
.howto li:nth-child(odd) .sumaira{
width: 90px;
top: -20px;
right: 10px;
}
.howto li:nth-child(even) .sumaira{
width: 120px;
bottom: 10px;
left: 20px;
}