@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600&display=swap');


#alumni-page .disp-pc {
    display: block;
}

#alumni-page .disp-sp {
    display: none;
}

@media screen and (max-width: 767px) {
    #alumni-page .disp-pc {
        display: none;
    }

    #alumni-page .disp-sp {
        display: block;
    }
}


/* - layout
---------------------------------- */
#Contents.alumni{
   background: #FAEBF3;
}

.global-footer{
    padding-top: 0px;   
}

#alumni-page {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(70%,rgb(255,255,255)), color-stop(100%,rgb(252,235,243)));
    background: -webkit-linear-gradient(top,  rgb(255,255,255) 70%,rgb(252,235,243) 100%);
    background: linear-gradient(to bottom,  rgb(255,255,255) 70%,rgb(252,235,243) 100%);
    position: relative;
    padding-bottom: 65px;
}

#alumni-page section{
    position: relative;
    z-index: 3;
}

#alumni-page .al-inner{
    width: calc(1000/1440 * 100%);
    margin: 0 auto;
    background: #fff;
    padding: 70px 0;
    border-radius: 5px;
    position: relative;
    z-index: 2;
}

#alumni-page .al-inner-box{
    width: calc(826/1000 * 100%);
    margin: 0 auto;
}

#alumni-page section + section{
    margin-top: 60px;
}

#alumni-page:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    background: url("/recruit/alumni/images/page_bg-pc.png") no-repeat 0 0;
    background-size: cover;
    width: 100%;
    height: 100%;
    z-index: 1;
}

@media screen and (max-width: 1024px) {
    #alumni-page .al-inner{
        width: 82%;
        padding: 30px;
        border-radius: 5px;
    }

    #alumni-page .al-inner-box{
        width: 90%;
    }
}

@media screen and (max-width: 768px) {
    #alumni-page .al-inner{
        width: 90%;
        padding: 30px;
        border-radius: 5px;
    }

    #alumni-page .al-inner-box{
        width: 100%;
    }
    
    #alumni-page section + section{
        margin-top: 20px;
    }
    
    #alumni-page:before{
        background: url("/recruit/alumni/images/page_bg-sp.png") no-repeat 0 0;
        background-size: contain;
    }
}

/*----------------------------------
  Typography
 ----------------------------------*/
#alumni-page {
    color: #7A4D3B;
    font-weight: 500;
    font-family: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
}

#alumni-page .al-title-text{
    color: #7A4D3B;
    font-size: min(calc(28 / 1000 * 100vw), 28px);
    line-height: 1.4;
}

#alumni-page .al-l-text{
    font-size: min(calc(24 / 1000 * 100vw), 24px);
    line-height: 1.6;
}

#alumni-page .al-text{
    font-size: min(calc(20 / 1000 * 100vw), 20px);
    line-height: 2;
    letter-spacing: -0.025em;
}


@media screen and (max-width: 768px) {
    #alumni-page .al-title-text{
        font-size: 4vw;
        line-height: 1.6;
    }

    #alumni-page .al-l-text{
        font-size: 3.5vw;
        line-height: 1.6;
    }

    #alumni-page .al-text{
        font-size: 3vw;
        line-height: 1.8;
        letter-spacing: -0.025em;
    }
}

/* - mv
---------------------------------- */
#alumni-page .al-main-vis{
    aspect-ratio: 1440/1440;
    position: relative;
}

#alumni-page .al-mv-copy-box{
    position: absolute;
    width: calc(667/1440 * 100%);
    top: calc(213/1440 * 100%);
    left: calc(252/1440 * 100%);
    z-index: 2;
}

@media screen and (max-width: 768px) {
    #alumni-page .al-main-vis{
        aspect-ratio: 750/920;
    }

    #alumni-page .al-mv-copy-box{
        width: calc(360/750 * 100%);
        top: calc(100/920 * 100%);
        left: calc(82/750 * 100%);
    }
}


/* - lead
---------------------------------- */
#alumni-page #alumni-lead{
    margin-top: calc(-530/1000 * 100%);
}

#alumni-page #alumni-lead .al-title-text{ 
    text-align: center;
    margin-bottom: 24px;
}

#alumni-page #alumni-lead .al-text{
    margin: -24px 0 0 0;
}

@media screen and (max-width: 768px) {
    #alumni-page #alumni-lead{
        margin-top: calc(-700/920 * 100%);
    }

    #alumni-page #alumni-lead .al-title-text{
        margin-bottom: 0;
    }

    #alumni-page #alumni-lead .al-text{
        margin: -2vw 0 0 0;
    }
}

/* - vision
---------------------------------- */
#alumni-page #alumni-vision .al-inner{
   padding: 70px 0 90px 0;
}

#alumni-page #alumni-vision .al-title-text{
    margin-bottom: 36px;
}

#alumni-page #alumni-vision .al-title-area{
    border-bottom: 1px solid #7A4D3B;
    padding-bottom: 8px;
    margin-bottom: 32px;
}

@media screen and (max-width: 768px) {
    #alumni-page #alumni-vision .al-inner{
       padding: 30px;
    }

    #alumni-page #alumni-vision .al-title-text{
        margin-bottom: 10px;
    }

    #alumni-page #alumni-vision .al-title-area{
        padding-bottom: 0;
        margin-bottom: 13px;
        position: relative;
    }
    
    #alumni-page #alumni-vision .al-title-area .al-l-text{
        line-height: 1.8;
    }
    
    #alumni-page #alumni-vision .al-title-area:after{
        content: "";
        position: absolute;
        width: 100%;
        height: 1px;
        background: #7A4D3B;
        left: 0;
        top: 6vw;
    }
}

/* - alumni-linkArea
---------------------------------- */
#alumni-page #alumni-linkArea{
    text-align: center;
    margin: 70px 0 85px 0;
}

#alumni-page #alumni-linkArea .al-inner{
    padding: 0;
    background: none;
}

#alumni-page #alumni-linkArea .al-flex_box{
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    gap: 0 45px;
    margin-bottom: 75px;
}

#alumni-page #alumni-linkArea .al-flex_box .box1{
    background : #E60A00;
}

#alumni-page #alumni-linkArea .al-flex_box .box2{
    background : #00A29A;
}

#alumni-page #alumni-linkArea .al-flex_box a{
    color: #fff;
    transition-duration: 0.3s;
}

#alumni-page #alumni-linkArea .al-link-text{
    font-size: min(calc(20 / 1440 * 100vw), 20px);
}

#alumni-page #alumni-linkArea .al-linktext-box{
    padding: 9px 0;
}

#alumni-page #alumni-linkArea .al-flex_box .al-link-text span{
    position: relative;
    padding-right: 30px;
}

#alumni-page #alumni-linkArea .al-flex_box .al-link-text span:after{
    content: "";
    position: absolute;
    background: url("/recruit/alumni/images/icon_link.svg") no-repeat 0 0;
    background-size: contain;
    width: 1.2rem;
    height: 1.2rem;
    right: -5px;
    top: 20%;
}

#alumni-page #alumni-linkArea .al-link-text-line{
    color: #7A4D3B;
    text-decoration: underline;
    text-underline-offset: 12px;
    transition-duration: 0.3s;
}


@media (any-hover: hover) {
    #alumni-page #alumni-linkArea a:hover{
        opacity: .7
    }
}

@media screen and (max-width: 1124px) {
    #alumni-page #alumni-linkArea .al-link-text{
        font-size: 13px;
    }
    
    #alumni-page #alumni-linkArea .al-flex_box .al-link-text span:after{
        width: 1rem;
        height: 1rem;
        top: 10%;
    }
}

@media screen and (max-width: 768px) {
    #alumni-page #alumni-linkArea{
        margin: 20px 0 40px 0;
    }

    #alumni-page #alumni-linkArea .al-flex_box{
        flex-flow: row wrap;
        gap: 30px 0;
        width: 85%;
        margin: 0 auto 20px auto;
    }

    #alumni-page #alumni-linkArea .al-link-text{
        font-size: 3vw;
    }

    #alumni-page #alumni-linkArea .al-linktext-box{
        padding: 6px 0;
    }

    #alumni-page #alumni-linkArea .al-flex_box .al-link-text span{
        padding-right: 20px;
    }

    #alumni-page #alumni-linkArea .al-flex_box .al-link-text span:after{
        width: 0.8rem;
        height: 0.8rem;
        top: 15%;
    }

    #alumni-page #alumni-linkArea .al-link-text-line{
        text-underline-offset: 8px;
    }
}



/* - alumni-faq
---------------------------------- */
#alumni-page #alumni-faq .al-inner{
    padding: 70px 0 30px 0;
}

#alumni-page #alumni-faq .al-title-text{
    margin-bottom: 45px
}

#alumni-page #alumni-faq .al-faq-box{
    border-bottom: 1px solid #7A4D3B;
    padding-bottom: 37px;
    margin-bottom: 38px;
}

#alumni-page #alumni-faq .al-faq-box:last-of-type{
    border-bottom: none;
}

#alumni-page #alumni-faq .al-faq-box dt,
#alumni-page #alumni-faq .al-faq-box dd{
    padding-left: 65px;
    font-size: 15px;
    line-height: 1.6;
    position: relative;
}

#alumni-page #alumni-faq .al-faq-box dt:after,
#alumni-page #alumni-faq .al-faq-box dd:after{
    content: "";
    position: absolute;
    width: 40px;
    height: 40px;
    left: 12px;
}

#alumni-page #alumni-faq .al-faq-box dt:after{
    background: url("/recruit/alumni/images/icon_q.svg") no-repeat 0 0;
    background-size: contain;
    top: -9px;
}

#alumni-page #alumni-faq .al-faq-box dd:after{
    background: url("/recruit/alumni/images/icon_a.svg") no-repeat 0 0;
    background-size: contain;
    top: -6px;
}

#alumni-page #alumni-faq .al-faq-box dt{
   margin-bottom: 25px;
}

#alumni-page #alumni-faq .al-faq-box dd{
    font-weight: 300;
}

@media screen and (max-width: 768px) {
    #alumni-page #alumni-faq .al-inner{
        padding: 30px 30px 1px 30px;
    }

    #alumni-page #alumni-faq .al-title-text{
        margin-bottom: 15px
    }

    #alumni-page #alumni-faq .al-faq-box{
        padding-bottom: 20px;
        margin-bottom: 20px;

    }

    #alumni-page #alumni-faq .al-faq-box dt,
    #alumni-page #alumni-faq .al-faq-box dd{
        padding-left: 25px; 
        font-size: 2.6vw;
        line-height: 1.6;
    }

    #alumni-page #alumni-faq .al-faq-box dt:after,
    #alumni-page #alumni-faq .al-faq-box dd:after{
        width: 20px;
        height: 20px;
        left: 0;
    }

    #alumni-page #alumni-faq .al-faq-box dt:after{
        top: -2px;
    }

    #alumni-page #alumni-faq .al-faq-box dd:after{
        top: 2px;
    }

    #alumni-page #alumni-faq .al-faq-box dt{
       margin-bottom: 5px;
    }

    #alumni-page #alumni-faq .al-faq-box dd{
        font-weight: 500;
    }
}