@charset "utf-8";
/* ---------------------------
/includes/school/strength.inc
お金の教養スクールの3つの特徴
--------------------------- */
.reason .inner{ padding-top: 0;}

/* .top_img */
.top_img{
    background: url(/school/image/strength/top_img.jpg) center/cover no-repeat;
    color: #fff;
    padding: 50px 70px;
    font-size: 20px;
    margin-bottom: 60px;
}
.top_img .ttl{
    font-size: 1.6em;
    line-height: 1.5;
    margin-bottom: 1.5em;
}
@media screen and (max-width: 599px) {
    .top_img{
        background-image: url(/school/image/strength/top_img_sp.jpg);
        padding: 25px 5% 85px;
    }
    .top_img .ttl{ margin-bottom: 5em;}
    .top_img .txt{ font-size: 18px;}
}

/* .list_reason */
.list_reason {
    counter-reset: list_reason;
}
.list_reason .item:not(:first-child) {
    margin-top: 35px;
}
.list_reason .item .ttl::before {
    counter-increment: list_reason;
    content: counter(list_reason) '.';
    font-family: 'Josefin Slab', serif;
    color: #1c236d;
    font-size: 52px;
    text-align: center;
    line-height: 1;
    margin-right: 10px;
}
.list_reason .item:first-child .ttl::before{ color: #c36380;}
.list_reason .item:nth-child(2) .ttl::before{ color: #5e76a7;}
.list_reason .item:nth-child(3) .ttl::before{ color: #8a9f55;}

.list_reason .ttl {
    font-size: 32px;
    font-weight: normal;
    color: #1c236d;
    margin-bottom: 15px;
}
.list_reason .item:first-child .ttl{ color: #c36380;}
.list_reason .item:nth-child(2) .ttl{ color: #5e76a7;}
.list_reason .item:nth-child(3) .ttl{ color: #8a9f55;}

.list_reason .lead {
    text-align: center;
    margin-bottom: 15px;
}

.list_reason .main {
    border-top: 1px solid #1c236d;
    border-bottom: 1px solid #1c236d;
    background-color: #efefef;
    padding: 15px 30px 30px;
}
.list_reason .item:first-child .main {
    border-top-color: #c36380;
    border-bottom-color: #c36380;
    background-color: rgba(195, 99, 128, .1);
}
.list_reason .item:nth-child(2) .main {
    border-top-color: #5e76a7;
    border-bottom-color: #5e76a7;
    background-color: rgba(95, 117, 167, .1);
}
.list_reason .item:nth-child(3) .main {
    border-top-color: #8a9f55;
    border-bottom-color: #8a9f55;
    background-color: rgba(138, 159, 85, .1);
}

.list_reason .arw {
    color: #1c236d;
    font-size: 1.25rem;
    text-align: center;
}
.list_reason .item:first-child .arw{ color: #c36380;}
.list_reason .item:nth-child(2) .arw{ color: #5e76a7;}
.list_reason .item:nth-child(3) .arw{ color: #8a9f55;}
.list_reason .arw::after {
    content: '';
    display: block;
    width: 70px;
    height: 70px;
    border-left: 1px solid;
    border-bottom: 1px solid;
    transform: rotate(-45deg) skew(8deg, 8deg);
    margin: -2.5em auto 20px;
}

.list_reason .result {
    color: #1c236d;
    font-size: 1.5em;
    text-align: center;
    margin-bottom: 10px;
}
.list_reason .item:first-child .result{ color: #c36380;}
.list_reason .item:nth-child(2) .result{ color: #5e76a7;}
.list_reason .item:nth-child(3) .result{ color: #8a9f55;}

.list_reason .main .inner{
    width: 100%;
    padding: 0;
    display: flex;
    justify-content: space-between;
}
.list_reason .item:nth-child(even) .main .inner {
    flex-direction: row-reverse;
}
.list_reason .main .photo-wrap {
    width: 50%;
    max-width: 435px;
}
.list_reason .item:nth-child(odd) .photo-wrap {
    margin-right: 20px;
}
.list_reason .item:nth-child(even) .photo-wrap {
    margin-left: 20px;
}
.list_reason .main .photo {
    width: 100%;
    height: 0;
    padding-top: 52.8735632%;/* 230/435 */
    position: relative;
}
.list_reason .main .photo img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}
.list_reason .main .txt {
    width: 50%;
    font-size: 16px;
    text-align: justify;
}
.list_reason .txt_bold {
    font-weight: bold;
}
.list_reason .marker {
    background: linear-gradient( rgba(0, 0, 0, 0) 30%, rgba(215, 186, 65, 0.2) 30% );
    padding-bottom: 3px;
}
.list_reason .item:first-child .marker{ background: linear-gradient( rgba(0, 0, 0, 0) 30%, rgba(195, 99, 128, 0.2) 30% );}
.list_reason .item:nth-child(2) .marker{ background: linear-gradient( rgba(0, 0, 0, 0) 30%, rgba(95, 117, 167, 0.2) 30% );}
.list_reason .item:nth-child(3) .marker{ background: linear-gradient( rgba(0, 0, 0, 0) 30%, rgba(138, 159, 85, 0.2) 30% );}

.list_reason .link {
    display: block;
    text-align: right;
}

@media screen and (max-width: 999px) {
    .list_reason{ margin-top: 30px;}
}
@media screen and (max-width: 599px) {
    .reason .inner{
        width: 100%;
    }

    .list_reason .lead{
        font-size: 20px;
        text-align: center;
    }

    .list_reason .item:not(:first-child) {
        margin-top: 60px;
    }
    .list_reason .item .ttl::before {
        font-size: 50px;
        top: -42px;
    }
    .list_reason .ttl {
        font-size: 26px;
        margin-bottom: 15px;
    }

    .list_reason .main {
        padding-right: 5%;
        padding-left: 5%;
    }
    .list_reason .main .inner{
        display: block;
    }
    .list_reason .item:nth-child(odd) .photo-wrap {
        margin-right: 0;
    }
    .list_reason .item:nth-child(even) .photo-wrap {
        margin-left: 0;
    }
    .list_reason .main .photo-wrap {
        width: 100%;
        max-width: none;
    }
    .list_reason .main .txt {
        width: 100%;
        font-size: 14px;
        line-height: 1.6;
        margin-top: 2em;
    }
    .list_reason .arw,
    .list_reason .result{
        font-size: 20px;
    }
}