@charset "UTF-8";

/*メイン*/
div.main{background:#4ea8da;}
div.main img{max-width:1290px;}

div.main div.txt{
    border-color:#fff;
    background:inherit;
}
div.main div.txt p{color:#fff;}

/*ボタン*/
a.btn{
    font-size:1.8rem;
    text-shadow:-1px -1px 1px #af204c;
    background:#da5278;
    box-shadow:3px 3px 0px #af204c;
}
a.btn:hover{box-shadow:0 0 0 #af204c;}
div.contents h2{color:#4ea8da;}

/*お悩みありませんか？*/
div.flex.voice{
    display:flex;
    justify-content: space-between;
    margin-bottom:60px;
}
div.flex.voice div{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #333;
    width: 220px;
    height: 220px;
    padding:30px 20px 20px;
    background:#fff;
    border:3px solid #4ea8da;
    border-radius: 50%;
}
div.flex.voice div::after{
    position:absolute;
    content:"";
    left:50%;
    margin-left:-30px;
    top:40px;
    display:inline-block;
    width:60px;
    height:60px;
    background:url(../img/icon01.png) center/60px no-repeat;
}
div.flex.voice div:nth-child(2)::after{background:url(../img/icon02.png) center/60px no-repeat;}
div.flex.voice div p{
    position:relative;
    display:inline;
    font-size:2rem;
    line-height:1.6;
    text-align:center;
    color:#333;
    font-weight:600;
    padding-top:20px;
}
div.flex.voice div p span{
    padding-bottom:3px;
    border-bottom:3px solid #f3d24a;
}

/*プロモロジに物流を代行すると*/
div.flex.acting::before{background:url(../img/yazi01.png) center no-repeat;}
div.flex.acting div.question{background:#4ea8da;}
div.flex.acting div.question::after{background:url(../img/yazi02.png) center no-repeat;}

/*プロモロジのここがすごい*/
div.label{border-color:#4ea8da;}
div.label span{color:#4ea8da;}

div.flex.reason div p.img_title{color:#4ea8da;}


@media screen and (max-width:1112px) {

/*お悩みありませんか？*/
div.flex.voice div{
    width: 200px;
    height: 200px;
    padding:20px;
}
div.flex.voice div::after{
    margin-left:-25px;
    width:50px;
    height:50px;
    background:url(../img/icon01.png) center/50px no-repeat;
}
div.flex.voice div:nth-child(2n)::after{background:url(../img/icon02.png) center/50px no-repeat;}
div.flex.voice div p{font-size:1.8rem;}

}



@media screen and (max-width:991px) {

/*お悩みありませんか？*/
div.flex.voice div{
    width: 24%;
    height: 24vw;
    box-sizing:border-box;
}
div.flex.voice div::after{top:20px;}
div.flex.voice div p{font-size:1.8vw;}

/*ぐるうぱいに物流を代行すると*/
div.flex.acting::before{background:url(../img/yazi01.png) center /50vw no-repeat;}
div.flex.acting div.question::after{background:url(../img/yazi02.png) center/48px no-repeat;}

}

@media screen and (max-width:768px) {

/*お悩みありませんか？*/
div.flex.voice{flex-wrap:wrap;}
div.flex.voice div{
    display:block;
    width: 49%;
    height: auto;
    padding:20px 20px 20px 80px;
    border-radius:16px;
}
div.flex.voice div:nth-child(n + 3){margin-top:15px;}

div.flex.voice div::after{
    left:10px;
    margin-left:0;
    width:60px;
    height:60px;
    background:url(../img/icon01.png) center/60px no-repeat;
}
div.flex.voice div:nth-child(2n)::after{
    top:20px;
    background:url(../img/icon02.png) center/60px no-repeat;
}
div.flex.voice div p{
    font-size:1.8rem;
    padding-top:0;
}

/*ぐるうぱいに物流を代行すると*/
div.flex.acting::before{background:url(../img/yazi01.png) center /50vw no-repeat;}
div.flex.acting div.question::after{background:url(../img/yazi02.png) center/48px no-repeat;}

/*ボタン*/
a.btn{font-size:1.6rem;}


}


@media screen and (max-width:599px) {


/*お悩みありませんか？*/
div.flex.voice div{
    width: 100%;
    height: auto;
    padding:15px 10px 15px 60px;
    border-radius:16px;
    border-width:2px;
}
div.flex.voice div:nth-child(n + 2),
div.flex.voice div:nth-child(n + 3){margin-top:10px;}

div.flex.voice div::after{
    top:10px;
    width:40px;
    height:40px;
    background:url(../img/icon01.png) center/40px no-repeat;
}
div.flex.voice div:nth-child(2n)::after{
    top:10px;
    background:url(../img/icon02.png) center/40px no-repeat;
}

/*ぐるうぱいに物流を代行すると*/
div.flex.acting div.question::after{background:url(../img/yazi02.png) center/contain no-repeat;}

/*ボタン*/
a.btn{font-size:4.2vw;}

}

@media screen and (max-width:480px) {

/*ボタン*/
a.btn{font-size:4vw;}

}

@media screen and (max-width:399px) {

/*お悩みありませんか？*/
div.flex.voice div p{font-size:1.6rem;}


}