@charset "UTF-8";


/* ------------------------------------------------------------
   base.css
------------------------------------------------------------ */
/*
* subhead
* layer__contents
*
*/
/* subhead
------------------------------------------------------------ */
.subhead {
    background-color: #f5d7ab;
}

.subhead h1 {
    max-width: 231px;
}

/* layer__contents
------------------------------------------------------------ */
.layer__contents img {
    width: 100%;
}

.layer__contents .catch {
    font-size: 3.0rem;
    font-weight: bold;
    text-align: center;
    margin-bottom: 5%;
}

.layer__contents .work__box {
    background: url(../img/work__box__en.png) no-repeat right top/248px auto;
    margin-bottom: 5%;
}

.layer__contents .work__box .read__blue {
    margin-bottom: 50px;
}

.layer__contents .work__box p {
    margin-bottom: 20px;
}

.layer__contents .works__list .box {
    background: #f5f57a;
    border-radius: 15px;
    padding: 40px;
    margin-bottom: 20px;
}

.layer__contents .works__list .box .box__catch {
    font-size: 1.8rem;
    font-weight: bold;
}

.layer__contents .works__list .box__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.layer__contents .works__list .box__bottom .box {
    width: 49%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.layer__contents .works__list .box__bottom .box.num02 .box__icon {
    max-width: 84px;
}

.layer__contents .works__list .box__bottom .box.num03 .box__icon {
    max-width: 85px;
}

.layer__contents .works__list .box__bottom .box .box__icon {
    width: 25%;
    margin-right: 5%;
}

.layer__contents .works__list .box__bottom .box .box__catch {
    width: 70%;
}

.layer__contents .works__list .box__top .box {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.layer__contents .works__list .box__top .box .box__left {
    width: 35%;
}

.layer__contents .works__list .box__top .box .box__left .box__icon {
    max-width: 103px;
    margin: 0 auto 30px;
}

.layer__contents .works__list .box__top .box .box__left .box__catch {
    text-align: center;
}

.layer__contents .works__list .box__top .box .box__right {
    width: 60%;
}

.layer__contents .works__list .box__top .box li {
    font-size: 1.6rem;
}

.layer__contents .works__pho {
    display: flex;
    justify-content: space-between;
    margin: 5% 0 10%;
}

.layer__contents .works__pho .box {
    width: 48%;
}

.layer__contents .works__pho p {
    margin-top: 20px;
    font-size: 1.6rem;
    text-align: center;
}

.runner {
    background: #dff7f1 url(../img/runner__en.png) no-repeat right bottom/494px auto;
}

.runner p, .runner div, .runner li, .runner th, .runner td {
    font-size: 1.6rem;
    line-height: 190%;
}

.runner h2.read__blue {
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 190%;
    color: #023894;
}

.runner h3.subtit__blue {
    background: #6cbcd9;
    border-radius: 4px;
    color: #fff;
    font-size: 2.4rem;
    font-weight: bold;
    padding: 30px;
    margin-bottom: 50px;
}

.runner .blue_bg {
    background: #c8edfa;
}

.runner .innar {
    max-width: 1200px;
    margin: auto;
    width: 95%;
    padding: 5% 0;
}

.runner .innar p {
    margin-bottom: 20px;
}

.runner .read__blue {
    text-align: center;
    margin-bottom: 3%;
}

.runner .archive {
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
}

.runner .pho {
    width: 40%;
}

.runner .pho img {
    width: 100%;
    box-shadow: 20px 20px #f5bfab;
}

.runner .text {
    width: 55%;
}

.bg__img {
    height: 400px;
    background: url(../img/runner__bg.jpg) no-repeat 50% 50%/cover;
    background-attachment: fixed;
}

.point {
    padding: 7% 0;
    background: url(../img/point__en.png) no-repeat bottom left/265px auto;
}

.point .read__blue {
    text-align: center;
}

.point .point__box {
    display: flex;
    justify-content: space-between;
}

.point .box {
    width: 48%;
    padding: 4%;
    border-radius: 10px;
    margin: 4% 0 3%;
}

.point .box:nth-child(1) {
    background: #dff7f1;
}

.point .box:nth-child(2) {
    background: #dff5f7;
}

.point .box .catch {
    font-size: 2.0rem;
    color: #023894;
    margin-bottom: 2%;
}

.point .box p {
    margin-bottom: 0;
    text-align: center;
}

.point p {
    margin-bottom: 20px;
}

@media screen and (min-width: 1090px) and (max-width: 1300px) {
    /* ▼PC用================================================================== */
    /* ▲PC用================================================================== */
}

@media screen and (min-width: 768px) and (max-width: 1089px) {
    /* ▼Tab用================================================================= */
    /* layer__contents
	------------------------------------------------------------ */
    .layer__contents .archive .pho {
        width: 40%;
    }
    .layer__contents .archive .text {
        width: 55%;
    }
    .layer__contents .catch__last {
        font-size: 2.0rem;
    }
    /* ▲Tab用================================================================= */
}

@media screen and (min-width: 0px) and (max-width: 767px) {
    /* ▼SP用================================================================ */
    /* subhead
	------------------------------------------------------------ */
    .subhead h1 {
        width: 40%;
    }
    /* layer__contents
	------------------------------------------------------------ */
    .layer__contents .catch {
        margin-bottom: 30px;
        font-size: 2.0rem;
    }
    .layer__contents .work__box {
        background-size: 40% auto;
    }
    .layer__contents .work__box h2.read__blue {
        margin-bottom: 30px;
    }
    .layer__contents .works__list .box {
        padding: 5%;
    }
    .layer__contents .works__list .box .box__catch {
        font-size: 1.6rem;
    }
    .layer__contents .works__list .box__bottom {
        display: block;
    }
    .layer__contents .works__list .box__bottom .box {
        width: auto;
        display: block;
    }
    .layer__contents .works__list .box__bottom .box .box__icon {
        margin: 0 auto;
    }
    .layer__contents .works__list .box__bottom .box .box__catch {
        margin-top: 3%;
        width: auto;
        text-align: center;
    }
    .layer__contents .works__list .box__top .box {
        display: block;
    }
    .layer__contents .works__list .box__top .box .box__left {
        width: auto;
    }
    .layer__contents .works__list .box__top .box .box__left .box__icon {
        margin: 0 auto 20px;
    }
    .layer__contents .works__list .box__top .box .box__right {
        width: auto;
        margin-top: 30px;
    }
    .layer__contents .works__list .box__top .box .box__right li {
        font-size: 1.4rem;
        padding-left: 1em;
        text-indent: -1em;
    }
    .layer__contents .works__pho {
        display: block;
        margin-top: 10%;
    }
    .layer__contents .works__pho .box {
        width: auto;
        margin-bottom: 5%;
    }
    .layer__contents .works__pho p {
        font-size: 1.4rem;
    }
    .runner {
        background-size: 80% auto;
    }
    .runner p, .runner div, .runner li, .runner th, .runner td {
        font-size: 1.4rem;
    }
    .runner h2.read__blue {
        font-size: 1.8rem;
        font-weight: bold;
    }
    .runner h3.subtit__blue {
        font-size: 1.6rem;
        padding: 20px;
        margin-bottom: 30px;
    }
    .runner .innar {
        padding: 10% 0;
    }
    .runner .archive {
        display: block;
    }
    .runner .pho {
        width: 80%;
        margin: 0 auto 7%;
    }
    .runner .text {
        width: auto;
    }
    .bg__img {
        height: 250px;
        background-attachment: inherit;
    }
    .point {
        padding: 7% 0;
        background-size: 40% auto;
    }
    .point .read__blue {
        text-align: center;
    }
    .point .point__box {
        display: block;
    }
    .point .box {
        width: auto;
        padding: 5% 3%;
        margin: 4% 0 3%;
    }
    .point .box .catch {
        font-size: 1.6rem;
    }
    /* ▲SP用================================================================ */
}
