@charset "utf-8";
.sec_detail {
    padding: 140px 0;
    background: url(../imgs/detail/bg_detail.jpg) no-repeat center center / cover;
    color: #fff;
}
.plan_name {
    color: #cdc091;
    font-size: 8rem;
    letter-spacing: 0.06em;
    line-height: 1;
    margin: 0 0 10px;
    text-align: center;
}
.plan_name .small {
    font-size: 50%;
}
.plan_cont {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    align-items: flex-end;
    margin: 0 0 60px;
    text-align: center;
}
.plan_cont .type {
    font-size: 2rem;
    letter-spacing: 0.1em;
    line-height: 1;
}
.plan_cont .type .large {
    font-size: 240%;
}
.plan_cont .type .medium {
    font-size: 170%;
}
.plan_cont .txt {
    font-size: 1.2rem;
    line-height: 1.25;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    align-items: flex-end;
}
.plan_cont .txt .line + .line {
    line-height: 1.5;
}
.plan_cont .txt .num01 { font-size: 284%; }
.plan_cont .txt .large01 { font-size: 217%; }
.plan_cont .txt .medium01 { font-size: 150%; }
.plan_cont .txt .num02 { font-size: 184%; }
.plan_cont .txt .large02 { font-size: 117%; }
.plan_cont .txt .medium02 { font-size: 117%; }
.detail_inner {
    background: rgba(255,255,255,0.8);
    color: #333;
    width: 100%;
    max-width: 770px;
    margin: 0 auto;
    padding: 80px 120px;
}
.detail_inner .image {
    width: 100%;
    max-width: 410px;
    margin: 0 auto 30px;
}
.detail_inner .notes img {
    max-width: 300px/*494px*/;
}
.detail_inner .notes .capt {
    font-size: 1.2rem;
    letter-spacing: 0.05em;
    margin-top: 15px;
}
@media screen and (max-width: 767px) {
    .sec_detail {
        padding: 60px 0;
    }
    .plan_name {
        font-size: 6rem;
    }
    .plan_cont .type {
        font-size: 1.6rem;
        letter-spacing: 0.01em;
        width: 100%;
    }
    .plan_cont .txt {
        font-size: 1rem;
    }
    .detail_inner {
        padding: 30px 15px;
    }
    .detail_inner .notes .capt {
        font-size: 1rem;
        letter-spacing: 0;
        margin-top: 5px;
    }
}

.sec_thumb {
    background: url(../imgs/detail/bg_thumb.jpg) no-repeat center center / cover;
    color: #fff;
    padding: 100px 0;
}
.thumb_list {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 30px;
}
.thumb_list .item {
    text-align: center;
}
.thumb_list .item .img {
    margin: 0 0 15px;
}
.thumb_list .item .ttl_en {
    color: #cdc091;
    font-size: 1.8rem;
    letter-spacing: 0.05em;
    margin: 0 0 10px;
}
.thumb_list .item .ttl_jp {
    font-size: 1.8rem;
    letter-spacing: 0.1em;
    margin: 0 0 20px;
}
.thumb_list .item .txt {
    font-size: 1.4rem;
    letter-spacing: 0.1em;
    line-height: 1.7;
}
@media screen and (max-width: 1000px) {
    .thumb_list .item .ttl_en {
        font-size: 1.6rem;
    }
    .thumb_list .item .ttl_jp {
        font-size: 1.6rem;
        letter-spacing: 0.01em;
    }
    .thumb_list .item .txt {
        font-size: 1.2rem;
        letter-spacing: 0.01em;
    }
}
@media screen and (max-width: 767px) {
    .sec_thumb {
        padding: 60px 0;
    }
    .thumb_list {
        grid-template-columns: auto;
        gap: 40px;
    }
}

.sec_another {
    background: url(../imgs/detail/bg_another.jpg) no-repeat center center / cover;
    padding: 140px 0;
}
.another_list {
    width: 100%;
    max-width: 770px;
    margin: 0 auto;
}
.another_list .item {
    min-height: 400px;
    display: grid;
    grid-template-columns: auto 300px;
}
.another_list .item .more {
    position: absolute;
    bottom: 15px;
    left: 15px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}
.another_list .item:hover .more {
    opacity: 1;
    visibility: visible;
    transition-delay: 0.3s;
}
.another_list .item .it_cover {
    background-image: url(../imgs/detail/bg_hover.jpg);
}
.another_list .item .cont {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.another_list .item .pic_cap {
    transition: all 0.3s ease;
}
.another_list .item:hover .pic_cap {
    opacity: 0;
    visibility: hidden;
}
@media screen and (max-width: 767px) {
    .sec_another {
        padding: 60px 0;
    }
    .another_list .item {
        grid-template-columns: auto 50%;
        min-height: 250px;
    }
}