@charset "utf-8";

/* ==================================================================

    about.css

=================================================================== */

/* --------------------------------
■mv
-------------------------------- */ 
.secondary .contents .visual{
    background-image: url("../../images/about/visual.jpg");
}

.contents .appeal{
    text-align: center;
    font-size: 3.2rem;
    font-weight: 700;
    letter-spacing: 0.17em;
}
.contents * + .appeal{
    margin-top: 48px;
}
.contents .appeal em{
    background: -webkit-linear-gradient(transparent 88%, #FFF000 0%);
    background: -o-linear-gradient(transparent 88%, #FFF000 0%);
    background: linear-gradient(transparent 88%, #FFF000 0%);
}

/* SP用
----------- */
@media only screen and
(max-width : 767px) {
    
    .contents .appeal{
        text-align: center;
        font-size: 2.0rem;
        font-weight: 700;
        letter-spacing: 0;
        line-height: 1.5;
    }
    .contents * + .appeal{
        margin-top: 24px;
    }

}

/* --------------------------------
■lead
-------------------------------- */ 
#lead{
}
#lead p{
    margin-bottom: 0;
}
#lead p + p{
    margin-top: 2em;
}

#lead .chart{
    max-width: 1228px;
    margin-left: auto;
    margin-right: auto;
    background: #EEECE3;
    padding: 80px 10px;
}


/* SP用
----------- */
@media only screen and
(max-width : 767px) {
    
    #lead p + p{
        margin-top: 1.2em;
    }
    
    #lead .chart{
        padding: 30px 10px;
    }
    
}

/* --------------------------------
■media
-------------------------------- */ 
#media .container{
    padding-top: 70px;
    padding-bottom: 70px;
}

#media .heading .flexbox{
    max-width: 1000px;
    margin-left:auto;
    margin-right:auto;
}
#media .heading .flexbox .image{
    width: 34%;
}

#media .achievements .title._lv3 + * {
    margin-top: 50px;
}

#media .achievements .pickup{
    margin-top: 50px;
}
#media .achievements .pickup li{
    overflow: hidden;
    border-radius: 8px;
    background: #efefef;
}
#media .achievements .pickup p.image{
    margin: 0;
}
#media .achievements .pickup p.image img{
    height: 250px;
    object-fit: cover;
}
#media .achievements .pickup li figcaption{
    padding: 8px;
    text-align: center;
}


/* SP用
----------- */
@media only screen and
(max-width : 767px) {
    
    #media{
        margin-top: 0;
    }
    
    #media .container{
        padding-top: 40px;
        padding-bottom: 40px;
    }

    #media .heading .flexbox{

    }
    #media .heading .flexbox .image{
        width: auto;
    }

    #media .achievements .title._lv3 + * {
        margin-top: 26px;
    }

    #media .achievements .pickup p.image img{
        height: 250px;
        object-fit: cover;
    }
    #media .achievements .pickup li figcaption{
        padding: 8px;
        text-align: left;
        font-size: 1.5rem;
    }
    
}

/* --------------------------------
■alliance
-------------------------------- */ 
#alliance{
    padding-top: 0px;
}
.contents .introduction a{
    color: #333;
}

.contents .introduction .title._lv4{
    line-height: 1.8;
}
.contents .introduction .title._lv4 + *{
    margin-top: 34px;
}

.introduction ul.nameList{
}


.introduction ul.nameList{
}

/* --------------------------------
■history
-------------------------------- */ 
#history{
    margin-top: 0;
    background: #E6E6E6;
    padding: 90px 0;
}


/* SP用
----------- */
@media only screen and
(max-width : 767px) {
    
    #outline{
        padding: 40px 0;
    }

    #history{
        padding: 40px 0;
    }

}

/* --------------------------------
■lineStyle
-------------------------------- */ 
table.lineStyle{
    width: 100%;
    border-top: 1px solid #B5B5B5;
}

table.lineStyle th,
table.lineStyle td{
    font-size: 1.8rem;
    padding: 40px 0 ;
    border-bottom: 1px solid #B5B5B5;
}

table.lineStyle th{
    width: 300px;
}

/* SP用
----------- */
@media only screen and
(max-width : 767px) {

    table.lineStyle th,
    table.lineStyle td{
        font-size: 1.5rem;
        padding: 14px 2px ;
        line-height: 1.4;
    }

    table.lineStyle th{
        width: 7em;
    }

}


/* --------------------------------
■facility
-------------------------------- */ 
#facility h2{
    margin-bottom: 80px;
}

#facility ul.list{
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
    gap: 100px 7.890017931%;
}


#facility ul.list li{
    width: 43.87328153%
}
#facility ul.list li p.image{
    margin-bottom: 20px;
}

/* SP用
----------- */
@media only screen and
(max-width : 767px) {

    #facility h2{
        margin-bottom: 40px;
    }

    #facility ul.list{
        gap: 30px 4%;
    }


    #facility ul.list li{
        width: 46%
    }
    #facility ul.list li p.image{
        margin-bottom: 14px;
    }
    #facility ul.list li figcaption{
        font-size: 1.4rem;
    }


}