@charset "UTF-8";

/* ----------------------------------------------- CSS Information
 Style Info:     強み
 Notes:          
--------------------------------------------------------------- */
.main-wrap{
width:100%;

}

.main-title_bg{
width:100%;
line-height: 100%;
text-align: center;
    background: url("../img/common/head02_bg.png") 0 0 no-repeat;
height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 14.84375%;
    background-size: contain;
margin-bottom: 5%;
}
.main-title{
width:42.4479%;
margin: -9% auto;
}
.main-title img{
width:100%;
}

.main{
width:100%;
margin: 0 auto;
}

.sec01{
width:100%;
margin-bottom: 8%;
background-color: #f9d1e3;
padding: 4% 0 3%;
position: relative;
}

.sec-in{
width:59.79%;
margin: 0 auto;
position: relative;
}

.title01{
position: absolute;
top:-26%;
left: 0;
margin-bottom: 3%;
width:81.445%;
}
.title01 img{
width:100%;
}

.tuyomibox{
width:100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;

}

.tuyomi-pic{
width: 49.3%;
line-height: 0;
z-index: 100;
}

.tuyomi-txt{
width: 40.94%;
line-height: 180%;
    font-size: 1.2vw;
position: relative;
}
.tuyomi-txt p{
position: absolute;
bottom: 0;
}

.txt-s{
 font-size: 1vw;
}

.ma01{
position: absolute;
bottom: -20%;
    right: -25%;
width: 26.829%;
}
.ma01 img{
width: 100%;
}

.ma04{
position: absolute;
top: 40%;
    left: -20.557%;
width: 20.557%;
}
.ma04 img{
width: 100%;
}

.ma05{
position: absolute;
top: -40%;
    right: -28%;
width: 26.829%;
}
.ma05 img{
width: 100%;
}

.ma08{
position: absolute;
bottom: -32%;
    left: -15%;
width: 20.557%;
}
.ma08 img{
width: 100%;
}

.ma09{
position: absolute;
top: 40%;
    right: -28%;
width: 26.829%;
}
.ma09 img{
width: 100%;
}

.sec02{
width:100%;
margin-bottom: 8%;
background-color: #f8c89c;
padding: 4% 0 3%;
position: relative;
}

.ma02{
position: absolute;
bottom: -28%;
    left: -20%;
width: 20.557%;
}
.ma02 img{
width: 100%;
}

.ma03{
position: absolute;
top: 10%;
    right: -30%;
width: 26.829%;
}
.ma03 img{
width: 100%;
}

.ma06{
position: absolute;
bottom: -25%;
    left: -18%;
width: 20.557%;
}
.ma06 img{
width: 100%;
}

.ma07{
position: absolute;
top: 0;
    right: -29%;
width: 26.829%;
}
.ma07 img{
width: 100%;
}

/* ================= smartphone ================= */
@media only screen and (max-width:699px) {

.main-title_bg{
width:100%;
line-height: 100%;
text-align: center;
    background: url("../img/common/head02_bg_sm.png") 0 0 no-repeat;
height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 33.5294%;
    background-size: contain;
margin-bottom: 5%;
}
.main-title{
width:90%;
margin: -20% auto;
}

.sec-in {
    width: 90%;
    margin: 0 auto;
    position: relative;
}

.title01 {
    position: absolute;
    top: -7%;
    left: 0;
    margin-bottom: 3%;
    width: 100%;
}

.tuyomi-pic {
    width: 100%;
    margin-bottom: 3%;
}

.tuyomi-txt {
    width: 100%;
    line-height: 180%;
    font-size: 14px;
    position: relative;
}

.txt-s {
    font-size: 13px;
}

.tuyomi-txt p {
    position: relative;
    bottom: 0;
}


}