@charset "utf-8";

main h1 {
    width: 620px;
    float: right;
    border-top: 10px solid #707070;
    margin: 0 39px 95px 0;
    padding-top: 10px;
    text-align: center;
    font-size: 6.0rem;
    line-height: 1em;
    font-family: "FOT-筑紫アンティークL明朝 Std L{pm}";
}

.txtBlock {
    float: left;
    width: 508px;
}

.txtBlock h2 {
    font-size: 3.6rem;
    line-height: 1em;
    font-family: "I-OTFゴシックオールドPro H{pm}";
    color: #707070;
    margin-bottom: 45px;
}

.txtBlock p {
    font-size: 2.0rem;
    line-height: 1.8em;
    font-family: "FOT-筑紫アンティークS明朝 Std L";
}

.txtBlock > div {
    border-left: 1px solid #707070;
    padding-left: 8px;
    margin: 0 0 45px 15px;
}

.txtBlock > div:before {
    content: "";
    display: block;
    width: 14px;
    height: 200px;
    margin: 0 0 0 -23px;
    background-color: #ccc;
    float: left;
    background: url("../../common/images/bg_kireiya.svg") no-repeat left 0px top 57px;
}

.txtBlock > div:after {
    content: "";
    display: block;
    clear: both;
}

.imgBlock {
    float: right;
}

.imgBlock ul {
    width: 303px;
}

.imgBlock ul li {
    margin-bottom: 7px;
    line-height: 0;
}

.imgBlock ul li img {
    width: 100%;
}

#subContent {
    background-color: #1DCE53;
}

#subContent .inner {
    width: 1280px;
    margin: 0 auto;
    padding-bottom: 70px;
}

#subContent .inner:after {
    content: "";
    display: block;
    clear: both;
}

#subContent .section1 {
    width: 440px;
    margin-left: 159px;
    float: left;
}

#subContent .section2 {
    width: 440px;
    margin-left: 111px;
    float: left;
}

#subContent h2 {
    color: #fff;
    font-size: 4.0rem;
    letter-spacing: 1em;
    line-height: 1.25em;
    font-family: "FOT-筑紫B明朝 Pr6 L";
    margin-bottom: 24px;
    position: relative;
    top: -9px;
}

#subContent h3 {
    font-size: 3.0rem;
    line-height: 1.2em;
    font-family: "FOT-筑紫B見出ミン Std E{pm}";
    margin-bottom: 24px;
}

#subContent p {
    font-size: 1.8rem;
    line-height: 1.5em;
    font-family: "FOT-筑紫アンティークS明朝 Std L";
}

#subContent ul li {
    font-size: 1.8rem;
    line-height: 1.5em;
    font-family: "FOT-筑紫アンティークS明朝 Std L";
}

/* Responsive Styles
============================================================= */

@media screen and (max-width: 750px) {
    main h1 {
        width: auto;
        float: right;
        border-top: 0;
        margin: 6.27vw 3.07vw 22.4vw 0;
        padding-top: 0;
        font-size: 4.0rem;
    }

    main h1:before {
        content: "";
        display: block;
        width: 54.4vw;
        height: 2.67vw;
        background-color: #707070;
        float: right;
    }

    main h1 span {
        display: block;
        clear: both;
        padding-top: 2vw;
    }

    .txtBlock {
        float: none;
        width: 100%;
        position: relative;
    }

    .txtBlock:after {
        content: "";
        display: block;
        width: 50vw;
        height: 50vw;
        position: absolute;
        right: 0;
        top: -10vw;
        background: url("../../common/images/bg_kireiya.svg") no-repeat right top;
    }

    .txtBlock h2 {
        font-size: 3.0rem;
        line-height: 1.36em;
    }

    .txtBlock p {
        font-size: 1.8rem;
        line-height: 1.55em;
    }

    .txtBlock > div {
        border-left: 0;
        padding-left: 0;
        margin: 0;
    }

    .txtBlock > div:before {
        display: none;
    }

    .txtBlock .section1 {
        margin-bottom: 13.33vw;
    }

    .txtBlock .section1 h2 {
        text-align: right;
        margin: 0 9.87vw 6.93vw 0;
    }

    .txtBlock .section1 p {
        padding: 0 24.8vw 0 4vw;
        background: url("../images/about_bg_section1_sp.png") no-repeat right top;
        background-size: 23.47vw;
    }

    .txtBlock .section2 {
        margin-bottom: 7.2vw;
    }

    .txtBlock .section2 h2 {
        text-align: left;
        margin: 0 0 6.93vw 8vw;
    }

    .txtBlock .section2 p {
        padding: 0 4vw 0 24.8vw;
        background: url("../images/about_bg_section2_sp.png") no-repeat left top;
        background-size: 23.2vw;
    }

    .imgBlock {
        float: none;
        padding: 0 4vw;
    }

    .imgBlock ul {
        width: 100%;
        margin-bottom: 14.13vw;
    }

    .imgBlock ul li {
        margin-bottom: 2.67vw;
    }

    #subContent {
        margin-bottom: 30vw;
    }

    #subContent .inner {
        width: 100%;
        margin: 0 auto;
        padding-bottom: 8vw;
    }

    #subContent .section1 {
        width: 100%;
        margin-left: 0;
        padding: 0 4.27vw 8vw 23.73vw;
        float: none;
    }

    #subContent .section2 {
        width: 100%;
        margin-left: 0;
        padding: 0 4.27vw 0 23.73vw;
        float: none;
    }

    #subContent h2 {
        font-size: 2.0rem;
        letter-spacing: 0.8em;
        line-height: 1.25em;
        margin-bottom: 7.47vw;
        top: -4px;
    }

    #subContent h3 {
        font-size: 3.0rem;
        line-height: 1.2em;
        margin-bottom: 2.13vw;
    }

    #subContent p {
        font-size: 1.8rem;
        line-height: 1.55em;
    }

    #subContent ul li {
        font-size: 1.8rem;
        line-height: 1.55em;
    }
}