@charset "utf-8";

/* 共通 */


.flex1{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.triangle_b{
    border-top: clamp(27.5px, 2.9vw, 55px) solid #333;
    border-right: clamp(17px, 1.78vw, 34px) solid transparent;
    border-left: clamp(17px, 1.78vw, 34px) solid transparent;
}
.triangle_r{
    border-top: clamp(6px, 0.73vw, 14px) solid transparent;
    border-bottom: clamp(6px, 0.73vw, 14px) solid transparent;
    border-left: clamp(12px, 1.5vw, 28px) solid #333;
    margin: .2vw 0.88vw 0;
}
/* 共通 end*/

/*history背景の線*/
.history-wrap{position: relative;}
.history_page .line{
    position: absolute;
    /*border: 100px solid #D6D6D6;*/
    background: #DDE2EA;
    height: clamp(160px, 12.5vw, 240px);
    /*width: clamp(2500px, 210vw, 4000px);*/
    width: 172vw;
    z-index: -1;
    left: -29vw;
}
.history_page .line1{
    transform: rotateZ(-40deg);
    transform-origin: top left;
        top: 77vw;
        /* top: 87vw; */

}
.history_page .line2{
    transform: rotateZ(40deg);
    transform-origin: top left;
        top: 56vw;
}
.history_page .line3{
    display: none;
    transform: rotateZ(-40deg);
    transform-origin: top left;
        top: 185vw;
}
.history_page .line4{
    display: none;
    transform: rotateZ(40deg);
    transform-origin: top left;
    top: 185vw;
}
.history_page .line5{
    display: none;
    transform: rotateZ(-40deg);
    transform-origin: top left;
    top: 345vw;
}
.history_page .line6{
    display: none;
    transform: rotateZ(40deg);
    transform-origin: top left;
    top: 345vw;
}
/*history背景の線*/
/*history_page*/
.history_page .under_head{
    display: flex;
    justify-content: center;
    /* flex-wrap: wrap; */
    gap: clamp(27px, 4.2vw, 80px);
    margin-top: clamp(40px, 6.3vw, 120px);
}
.under_head .head_item_l img{
    width: clamp(150px, 16.7vw, 320px);
}
.under_head h2{
    text-align: left;
    margin-top: clamp(16px, 2.92vw, 56px);
    line-height: 1.5;
    font-size: clamp(14px, 2.92vw, 56px);
}
.under_head .head_item_r {
    width: clamp(180px, 38vw, 720px);
}
/*history_page テキスト*/
.history_page .inner{
    padding-bottom: clamp(110px,12.5vw,160px);
}
.history_page .history-wrap{margin-top: clamp(40px, 6.3vw, 120px);}
.history_page .text_wrap{
    /* margin-left: 6.45vw; */
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 0 56px;
}
.history_page .text_wrap h2{
    /* margin-right: 56px; */
    font-size: clamp(16px, 2.1vw, 40px);
    /* display: flex;
    justify-content: center;
    align-items: center; */
}
.history_page .text_wrap .text{
    width: calc(100% - (56px + 9em));
}
.history_page .text_wrap .text h3{
    font-size: clamp(16px, 1.67vw, 32px);
}
.history_page .text_wrap .text h3:not(:last-of-type){
    margin-bottom: clamp(14px, 2.5vw, 48px);
}
.history_page.school .history_sec h2 {
    font-size: clamp(16px, 2.1vw, 40px);
    margin: clamp(40px, 6.3vw, 120px) 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.history_page.school .flex1{gap: clamp(27px, 4.2vw, 80px);}
.history_page.school .flex1 p{
    font-size: clamp(16px, 1.67vw, 32px);
    font-weight: 500;
}
@media screen and (max-width: 768px){
    .history_page.school .flex1 p span{
        display: block;
    }
    .history_page.school .flex1 p span:not(:last-of-type){margin-bottom: 20px;}
}
@media screen and (max-width: 500px){
    .history_page .text_wrap{margin-left: 0;}
    .history_page .text_wrap .text{width: 100%;}
}
