#s03-1{
    background: #c2e9d8;
    padding-bottom: 40px;
    margin-bottom: 0px;
}
#s03-1 p.container3{
    line-height: 2;
}
#s03-1 ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#s03-1 ul li{
    padding: 0 20px 20px;
    width: 46%;
    margin: 1%;
    box-shadow: 0 0 8px rgba(120,197,167);
    background: #fff;
}
#s03-1 ul li .ttl{
    margin-bottom: 20px;
    color: #4cb3b7;
    font-size:120%;
    background: url("images/hstyle02.png") no-repeat center top;
    padding-top: 30px;
    text-align: center;
    font-weight: bold;
}
#s03-1 ul li figure{
    text-align: center;
    margin-bottom: 20px;
}
#s03-1 ul li p{
    font-size:90%;
}
#arealist{
    border-top: 13px solid rgb(249, 169, 201);
    background: url("../images/top/officelist_bg1.png") center top / 100% no-repeat;
}

#arealist .inner1 .boxstyle01 figure{
        width: 52%;
    text-align: center;
    }
#arealist .inner1 .boxstyle01 .list{
        width: 45%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    }
#arealist .inner1 .boxstyle01 .list .left-s,#arealist .inner1 .boxstyle01 .list .right-s{
    width: 48%;
}
#arealist .inner1 .boxstyle01 h3{
        padding: 5px;
        background: #fff;
        border:solid 1px #ccc;  
        color: #fff;
        text-align: center;
    text-shadow: 1px 1px 2px #666;
    }
#arealist .inner1 .boxstyle01 ul{
    padding: 10px;
        margin-bottom: 20px;
    border: solid 1px #ccc;
    border-top:none;
    }
#arealist .inner1 .boxstyle01 ul li a{
        display: block;
        background: #fff;
    }
#arealist .inner1 .boxstyle01 h3.sapporo{
        background: #c398df;
    }
#arealist .inner1 .boxstyle01 h3.sendai{
        background: #e3cc61;
    }
#arealist .inner1 .boxstyle01 h3.tokyo{
        background: #f29e9e;
    }
#arealist .inner1 .boxstyle01 h3.hiroshima{
        background: #ffe927;
    }
#arealist .inner1 .boxstyle01 h3.ehime{
        background: #FFA500;
    }
#arealist .inner1 .boxstyle01 h3.fukuoka{
        background: #7bc9f4;
    }
#arealist .inner1 .boxstyle01 h3.kokura{
        background: #3281ba;
    }
#arealist .inner1 .boxstyle01 h3.kumamoto{
        background: #fb7ca4;
    }
#arealist .inner1 .boxstyle01 h3.nagasaki{
        background: #9b4369;
    }
#arealist .inner1 .boxstyle01 h3.oita{
        background: #5673bd;
    }
#arealist .inner1 .boxstyle01 h3.miyazaki{
        background: #FF9872;
    }
#arealist .inner1 .boxstyle01 h3.kagoshima{
        background: #c27373;
    }
#arealist .container3{
    padding-bottom:40px;
    background: url("../images/common/bg_d_p.png");
}
#arealist .container3 h3{
    margin-top: -40px;
    display: inline-block;
    padding:10px 20px;
    font-size:140%;
    border:solid 1px #f9a9c9;
    border-radius: 0 10px 0 10px;
    box-shadow: 5px 5px #f9a9c9;
    background: #fff;
}
#arealist .container3 .area{
    background: #fff;
    width: 18%;
}
#arealist .container3 .area h4{
    text-align: center;
    font-size:110%;
    color: #fff;
    background: #f571a6;
    padding: 5px;
}
#arealist .container3 .area ul{
    padding: 10px 20px;
}
#arealist .container3 .area ul li{
    position: relative;
    margin-bottom: 10px;
}
#arealist .container3 .area ul li:last-of-type{
    margin-bottom: 5px;
}
#arealist .container3 .area ul li::before{
    content: "・";
}
#s03-1 .hstyle01.pink .en {
    background: url(../images/common/ttl_bg01_p.png) no-repeat center bottom;
}
#s03-1 .hstyle01 .en {
    padding-bottom: 15px;
    margin-bottom: 10px;
    background: url(../images/common/ttl_bg01_g.png) no-repeat center bottom;
    font-family: "Zen Maru Gothic", serif;
    font-weight: 700;
    font-style: normal;
    font-size: 350%;
    color: #fff;
    text-shadow: 1px 1px 0 #333, -1px -1px 0 #333, -1px 1px 0 #333, 1px -1px 0 #333, 0px 1px 0 #333, -1px 0 #333, -1px 0 0 #333, 1px 0 0 #333;
    text-align: center;
    position: relative;
    z-index: 2;
}
#s03-1 .hstyle01 .ttl {
    text-align: center;
    font-size: 110%;
}
.boxstyle01.rev {
    flex-direction: row-reverse;
}

.boxstyle01 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●
↑pcサイズ
----------------------------------
↓タブレットサイズ
●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/

@media (max-width: 999px) {
    #s03-1 ul{
        justify-content: center;
    }
    #s03-1 ul li{
        width: 46%;
        margin: 2%;
    }
}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●
↑タブレットサイズ
----------------------------------
↓spサイズ
●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
@media (max-width: 767px) {
    #s03-1 ul li{
        width: 100%;
        padding: 0 10px 10px;
        margin-bottom: 20px;
    }
    #s03-1 ul li:last-of-type{
        margin-bottom: 0;
    }
    #s03-1 ul li p{font-size:100%;
    }
    #arealist .inner1 .boxstyle01 figure{
        width: 100%;
    }
    #arealist .inner1 .boxstyle01 .list{
        width: 100%;
    }
    #arealist .container3 .area{
        width: 48%;
        margin: 1%;
    }
    #arealist .container3 .area:last-of-type{
        width: 98%;
    }
    #arealist .container3 .area:last-of-type ul{
        display: flex;
        flex-wrap: wrap;
    }
    #arealist .container3 .area:last-of-type ul li{
        width: 50%;
    }
}