@charset "UTF-8";
/*=============================================================
#mainimage
=============================================================*/
#mainimage {
width: 100%;
height: 200px;
background-image: url("../image/mainimage.jpg");
background-size: cover;
position: relative;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
z-index: -1000;
 border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-right-radius: 2000px 300px;
border-bottom-left-radius: 2000px 300px;
}
#mainimage .copy{
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
display: flex;
align-items: center;
justify-content: center;
max-width: 250px;
}
/*=============================================================
#box1
=============================================================*/
#box1{
margin: 100px 0;
text-align: center;
}
#box1 .title{
width: 80%;
max-width: 400px;
text-align: center;
}
#box1 p{
font-size: 18px;
line-height: 1.8em;
margin-bottom: 30px;
text-align: left;
}
#box1 .img_01{
margin-bottom: 30px;
}
#box1 .img_02{
width: 80%;
max-width: 400px;
text-align: center;
margin: auto;
}

/*=============================================================
#box2
=============================================================*/
#box2{
margin: 100px 0;
text-align: center;
}
#box2 .title_right{
width: 80%;
max-width: 400px;
}
#box2 .box .left{
text-align: center;
margin-bottom: 30px;
}
#box2 .box .left p{
text-align: left;
}
#box2 .box .right img{
border-radius: 40px;
}

/*=============================================================
#box3
=============================================================*/
#box3{
margin: 100px 0;
}
#box3 .title_left{
width: 90%;
max-width: 400px;
}
#box3 .box .left{
text-align: center;
margin-bottom: 30px;
}
#box3 .box .left p{
text-align: left;
}
#box3 .box .right img{
border-radius: 40px;
}