@charset "UTF-8";

#container{
    aspect-ratio: 1000 / 567;
    margin-top: 7rem;
    border-radius: 6px;
}
/* sp */
@media only screen and (max-width: 767px) {

    #container{
        margin-top: 3rem;
    }
}
/*　
---------------------------------------------------------*/


.facility{
    position: relative;
    z-index: 1;
}
.facility_inner{
    padding-top: 18rem;
    padding-bottom: 18rem;
    position: relative;
    z-index: 5;
}

.facility_box{
    /* display: flex; */
    align-items:flex-start;
}
.facility_main{
    flex: 1;
}

.facility_img{
    border-radius: var(--radius-m);
    overflow: hidden;
    /* width: 50rem; */
    margin-top: 5rem;
}
.facility_mes{
    font-size: var(--f16);
}

.facility .c-textSlide2{
    top: 10rem;
}
.facility .c-textSlide2_main{width: 477rem;}

@media only screen and (max-width: 930px) {
    .facility_box{
        display: block;
    }
    .facility_img{
        margin: 7rem auto 0;
    }
}

/* hover  */
@media (hover: hover) and (pointer: fine) {
}

/* sp */
@media only screen and (max-width: 767px) {
    .facility{}
    .facility_inner{
    padding-top: 7rem;
    padding-bottom: 6rem;
}
    .facility_img{
    width: auto;
    margin: 3rem auto 0;
}
    .facility_mes{
    font-size: 1.4rem;
    margin-top: 2rem;
}
    .facility .c-textSlide2{
    top: 4rem;
}
    .facility .c-textSlide2_main{
        width: 240rem;
    }
}


/*　
---------------------------------------------------------*/

.experience{
    position: relative;
    z-index: 1;    
}
.experience_inner{
    padding-top: 18rem;
    padding-bottom: 18rem;
    position: relative;
    z-index: 5;    
}

.experience_list{
    display: flex;
    gap: 0 4rem;
    margin-top: 7rem;
}
.experience_list li{
    flex: 1;
    overflow: hidden;
    border-radius: var(--radius-m);
}


.experience .c-textSlide2{
    top: 10rem;
}
.experience .c-textSlide2_main{width: 530rem;}


/* hover  */
@media (hover: hover) and (pointer: fine) {
}

/* sp */
@media only screen and (max-width: 767px) {
    .experience{}
    .experience_inner{
    padding-top: 7rem;
    padding-bottom: 6rem;
}

    .experience_list{
    margin-top: 3rem;
    display: grid;
    gap: 1rem 0;
}
    .experience_list li{}

    .experience .c-textSlide2{
    top: 3rem;
}
    .experience .c-textSlide2_main{
    width: 267rem;
}
}


/*　
---------------------------------------------------------*/

.pioneer{
    position: relative;
    z-index: 1;     
}
.pioneer_inner{
    padding-top: 18rem;
    padding-bottom: 18rem;
    position: relative;
    z-index: 5;    
}


.pioneer .c-textSlide2{
    top: 10rem;
}
.pioneer .c-textSlide2_main{
    width: 616rem;
}
/* hover  */
@media (hover: hover) and (pointer: fine) {
}

/* sp */
@media only screen and (max-width: 767px) {
    .pioneer{}
    .pioneer_inner{
    padding-top: 7rem;
    padding-bottom: 6rem;
}

    .pioneer .c-textSlide2{
    top: 3rem;
}
    .pioneer .c-textSlide2_main{
    width: 309rem;
}
}


/*　
---------------------------------------------------------*/

.sdgs{
    position: relative;
    z-index: 1;      
}
.sdgs_inner{
    padding-top: 18rem;
    padding-bottom: 18rem;
    position: relative;
    z-index: 5;        
}

.sdgs_zu{
    margin-top: 7rem;
}

.sdgs .c-textSlide2{
    top: 10rem;
}
.sdgs .c-textSlide2_main{
    width: 552rem;
}

/* hover  */
@media (hover: hover) and (pointer: fine) {
}

/* sp */
@media only screen and (max-width: 767px) {
    .sdgs{}
    .sdgs_inner{
    padding-top: 7rem;
    padding-bottom: 6rem;
}

    .sdgs_zu{
    margin-top: 3rem;
}
    .sdgs .c-textSlide2{
    top: 3rem;
}
    .sdgs .c-textSlide2_main{
    width: 276rem;
}
}


/*　
---------------------------------------------------------*/

.seminar{
    position: relative;
    z-index: 1; 
    background: #14162d url(../img/outreach/seminar_bg.svg) 50% 50% no-repeat;
    background-size: auto 100%; 
}

.seminar_inner{
    padding-top: 13rem;
    padding-bottom: 18rem;
    position: relative;
    z-index: 5;
}


.seminar_btn{
    text-align: center;
    margin-top: 7rem;
}

.seminar_btn .c-btn1 {
    font-size: var(--f20);
    /* line-height: 9.5rem; */
    height: 9.5rem;
    padding: 0 7rem 0;
}

/* hover  */
@media (hover: hover) and (pointer: fine) {
}

/* sp */
@media only screen and (max-width: 767px) {
    .seminar{}
    .seminar_inner{
    padding-top: 7rem;
    padding-bottom: 6rem;
}


    .seminar_btn{
    margin-top: 3rem;
}

    .seminar_btn .c-btn1 {
    font-size: 1.6rem;
    height: 6.5rem;
    padding: 0 4rem 0;
}


}


/*　
---------------------------------------------------------*/


.activity{
    position: relative;
    z-index: 1;      
}
.activity_inner{
    padding-top: 18rem;
    padding-bottom: 18rem;
    position: relative;
    z-index: 5;        
}

.activity_btn{
    display: flex;
    margin-top: 4.7rem;
    gap:  1rem;
    flex-wrap: wrap;
}
.activity_btn a{
    border: 1px solid rgba(51, 51, 51, 0.2);
    border-radius: 100px;
    font-size: var(--f14);
    line-height: 1;
    padding: 0.7rem 1.6rem;
}
.activity_btn a.on{
    border-color: #333;
    background: #333;
    color: #fff;
}
.activity_main{
    background: rgba(51, 51, 51, 0.05);
    margin-top: 2.5rem;
    padding: 5rem 3.5rem 5rem 6rem;
}
.activity_slide{
    height: 45rem;
}
.activity_box{
    display: none;
}
.activity_box.on{
    display: block;
}
.activity_list{}
.activity_list li{

    border-bottom: 1px solid rgba(51, 51, 51, 0.1);
}
.activity_list .a,
.activity_list a{
    display: block;
    padding-bottom: 2.5rem;
    padding-top: 2.5rem;
}
.activity_list_date{
    font-size: var(--f14);
    margin-bottom: 0.3rem;
}
.activity_list_ttl{
    font-size: var(--f16);
    line-height: var(--line-height-min);
    font-weight: var(--font-normal);
}

.activity_link{
    font-size: var(--f14);
    text-align: right;
    margin-top: 2rem;
}
.activity_link img{margin: -3px 7px 0 0;}
.activity_link a{}




.activity .c-textSlide2{
    top: 10rem;
}
.activity .c-textSlide2_main{
    width: 527rem;
}

/* hover  */
@media (hover: hover) and (pointer: fine) {
}

/* sp */
@media only screen and (max-width: 767px) {
    .activity{}
    .activity_inner{
    padding-top: 7rem;
    padding-bottom: 6rem;
}


    .activity_btn{
    margin-top: 3rem;
}
    .activity_btn a{
    font-size: 1.2rem;
    padding: 0.7rem 1.5rem;
}
    .activity_btn a.on{}
    .activity_main{
    margin-top: 2rem;
    padding: 2rem 1.5rem 2rem 2rem;
}
    .activity_slide{}
    .activity_box{}
    .activity_box.on{}
    .activity_list{}
    .activity_list li{}

    .activity_list .a,    
    .activity_list a{
    padding-bottom: 1.5rem;
    padding-top: 1.5rem;
}
    .activity_list_date{
    font-size: 1.2rem;
    line-height: 1.5;
}
    .activity_list_ttl{
    font-size: 1.4rem;
}
    .activity_link{
    font-size: 1.2rem;
}
    .activity_link img{}
    .activity_link a{}



    .activity .c-textSlide2{
    top: 3rem;
}
    .activity .c-textSlide2_main{
    width: 264rem;
}
}


/*　
---------------------------------------------------------*/


.sync{
    position: relative;
    z-index: 1;       
}
.sync_inner{
    padding-top: 18rem;
    padding-bottom: 18rem;
    position: relative;
    z-index: 5;        
}


.sync_ttl{
    font-size: var(--f32);
    line-height: var(--line-height-min);
    margin-bottom: 4rem;
}
.sync_btn{
    text-align: center;
    margin-top: 5rem;
}

.sync .c-textSlide2{
    top: 10rem;
}
.sync .c-textSlide2_main{
    width: 762rem;
}



/* hover  */
@media (hover: hover) and (pointer: fine) {
}

/* sp */
@media only screen and (max-width: 767px) {
    .sync{}
    .sync_inner{
    padding-top: 7rem;
    padding-bottom: 6rem;
}

    .sync_ttl{font-size: 2rem;margin-bottom: 2rem;}
    .sync_btn{
    margin-top: 3rem;
}
    .sync .c-textSlide2{
    top: 3rem;
}
    .sync .c-textSlide2_main{
    width: 382rem;
}


}
