@charset "UTF-8";

/* about ページ (/about) 専用スタイル */

[data-pagename="about"] #gradient-bg-img {
    background-image: none;
    background-color: #fff;
}

.about-mv{
width:100%;
height:83.20vw;
background:url(../../img/mv-about-sp.jpg) no-repeat center center;
background-size:cover;
margin:0;
position:relative;
}


.about-lead{
background:#14B4FF;
padding:4.27vw 0;
}
.about-lead h2{
font-size:6.40vw;
width:87.20vw;
margin:0 auto;
font-weight:900;
color:#fff;
}


.ab-cont01{
background:#fff;
padding:6.40vw 0 0;
}
.ab-col{
display:flex;
flex-wrap:wrap;
}
.ab-desc{
width:87.20vw;
margin:0 auto;
font-size:3.73vw;
line-height:1.928;
margin:0 auto;
}
.ab-bg{
width:100%;
height:65.07vw;
background:url(../../img/ab-sch.png) no-repeat right bottom;
background-size:cover;
}


.ab-cont02{
background:#ebebeb;
padding:8.00vw 0;
}

.ab-cont02 h3{
font-size:4.80vw;
line-height:1;
font-weight:bold;
padding:0 0 0 2.00vw;
border-left:0.53vw solid #14B4FF;
width:87.20vw;
margin :0 auto 4.80vw;
}

.esp-school{
width:87.20vw;
margin:0 auto 8.53vw;
display:flex;
justify-content:space-between;
}
.esp-school li{
width:27.73vw;
}

.ab-full-img{
width:87.20vw;
margin:0 auto 4.27vw;
}

.mi-logo{
width:42.67vw;
margin:0 auto 4.27vw;
}
.mi-lead{
text-align:center;
font-size:3.20vw;
line-height:1.75;
margin:0 0 4.27vw;
}



.ab-cont03{
background:#fff;
padding:10.67vw 0 0;
}
.ab-cont03 h2{
width:87.20vw;
margin:0 auto 6.40vw;
font-size:8.00vw;
line-height:1;
}
.philo-list{
width:87.20vw;
margin:0 auto 10.67vw;
display:flex;
flex-wrap:wrap;
gap:4.27vw;
}
.philo-list li{
width:87.20vw;
border:0.27vw solid #ADADAD;
padding:8.53vw 6.40vw;
font-size:3.20vw;
line-height:1.75;
}
.philo-ttl{
text-align:center;
color:#057BA2;
font-size:4.80vw;
line-height:1;
margin:0 0 4.27vw;
font-weight:bold;
}

.his01{
width:100%;
background:url(../../img/ab-his01.jpg) no-repeat;
background-size:cover;
padding:8.53vw 0;
color:#fff;
text-shadow:0 0 1.60vw #4C5F64;
}
.his02{
width:100%;
background:url(../../img/ab-his02.jpg) no-repeat;
background-size:cover;
padding:10.67vw 0;
color:#fff;
text-shadow:0 0 1.60vw #4C5F64;
}
.his-ttl{
text-align:center;
font-size:4.80vw;
line-height:1.5;
margin:0 0 6.40vw;
font-weight:bold;
}
.his-desc{
width:87.20vw;
margin:0 auto;
font-size:3.20vw;
line-height:1.75;
}

.maker{
display:flex;
flex-wrap:wrap;
width:87.20vw;
margin:4.27vw auto 0;
gap:4.27vw;
}
.maker li{
width:87.20vw;
background:rgba(0,0,0,.5);
padding:6.40vw;
}
.maker-gunre{
text-align:center;
font-size:3.20vw;
font-weight:500;
line-height:1;
margin:0 0 4.27vw;
}
.maker-logos-l,
.maker-logos-r{
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:center;
gap:6.40vw;
}
.maker-logos-l div:nth-child(1){ width:23.47vw; }
.maker-logos-l div:nth-child(2){ width:31.20vw; }

.maker-logos-r div:nth-child(1){ width:23.47vw; }
.maker-logos-r div:nth-child(2){ width:35.20vw; }



.ab-cont04{
background:#ebebeb;
padding:10.67vw 0 14.93vw;
}

.his-wrap{
background:#fff;
width:87.20vw;
margin:0 auto;
padding:2.67vw;
position:relative;
}

.his-wrap::after{
content:'';
width:6.40vw;
height:calc(100% - 14.93vw);
background:
linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3)),
linear-gradient(to bottom, #00ccff 0%, #742AD5 23%, #5DDF46 51%, #ffe500 76%, #ff0079 100%);
position:absolute;
top:2.67vw;
left:2.67vw;
z-index:1;
}


.history{
position:relative;
display:flex;
flex-direction:column;
gap:5.33vw;
z-index:2;
}

.history::before{
content:'';
width:6.40vw;
height:2.13vw;
background:rgba(255, 0, 121, .7);
position:absolute;
bottom:4.80vw;
left:0;
}
.history::after{
content:'';
width:6.40vw;
height:1.33vw;
background:rgba(255, 0, 121, .7);
position:absolute;
bottom:1.07vw;
left:0;
}


.history li{
}
.his-y{
font-size:6.40vw;
font-weight:900;
color:#057BA2;
padding-left:6.2vw;
position:relative;
}
.his-y::before{
content:'';
width:4.00vw;
height:4.00vw;
border-radius:50%;
border:0.80vw solid #057BA2;
background:#fff;
position:absolute;
top:3.20vw;
left:-1.60vw;
}
.his-c{
font-size:3.20vw;
line-height:1.75;
margin-left:6.93vw;
}


























@media (min-width: 768px) {

.about-mv{
width:100%;
height:372px;
background:url(../../img/mv-about-pc.jpg) no-repeat center center;
background-size:cover;
margin:0;
}

.about-lead{
background:#14B4FF;
height:85px;
display:flex;
align-items:center;
padding:0;
}
.about-lead h2{
font-size:30px;
width:1260px;
margin:0 auto;
font-weight:900;
color:#fff;
}

.ab-cont01{
background:#fff;
padding:56px 0 0;
}
.ab-col{
width:1260px;
margin:0 auto;
display:flex;
}
.ab-desc{
width:683px;
font-size:22px;
line-height:1.7;
margin:0;
}
.ab-bg{
width:577px;
height:376px;
background:url(../../img/ab-sch.png) no-repeat right bottom;
background-size:cover;
}

.ab-cont02{
background:#ebebeb;
padding:40px 0;
}

.ab-cont02 h3{
font-size:24px;
line-height:1.4;
font-weight:bold;
padding:0 0 0 16px;
border-left:6px solid #14B4FF;
width:1260px;
margin :0 auto 24px;
}

.esp-school{
width:1200px;
margin:0 auto 46px;
display:flex;
justify-content:space-between;
}
.esp-school li{
width:354px;
}

.ab-full-img{
width:1260px;
margin:0 auto 24px;
}

.mi-logo{
width:480px;
margin:0 auto 24px;
}
.mi-lead{
text-align:center;
font-size:22px;
line-height:1.7;
margin:0 0 40px;
}


.ab-cont03{
background:#fff;
padding:40px 0 0;
}
.ab-cont03 h2{
width:1260px;
margin:0 auto 24px;
font-size:42px;
line-height:1;
}
.philo-list{
width:1260px;
margin:0 auto 40px;
display:flex;
flex-wrap:wrap;
gap:24px 40px;
}
.philo-list li{
width:610px;
border:1px solid #ADADAD;
padding:24px 40px;
font-size:16px;
line-height:1.7;
}
.philo-ttl{
text-align:center;
color:#057BA2;
font-size:24px;
line-height:1;
margin:0 0 24px;
font-weight:bold;
}

.his01{
width:100%;
background:url(../../img/ab-his01.jpg) no-repeat;
background-size:cover;
padding:40px 0;
color:#fff;
text-shadow:0 0 6px #4C5F64;
}
.his02{
width:100%;
background:url(../../img/ab-his02.jpg) no-repeat;
background-size:cover;
padding:40px 0;
color:#fff;
text-shadow:0 0 6px #4C5F64;
}
.his-ttl{
text-align:center;
font-size:24px;
line-height:1;
margin:0 0 32px;
font-weight:bold;
}
.his-desc{
width:668px;
margin:0 auto;
font-size:16px;
line-height:1.75;
}

.maker{
display:flex;
width:668px;
margin:16px auto 0;
gap:16px;
}
.maker li{
width:326px;
background:rgba(0,0,0,.5);
padding:24px;
}
.maker-gunre{
text-align:center;
font-size:16px;
font-weight:500;
line-height:1;
margin:0 0 24px;
}
.maker-logos-l,
.maker-logos-r{
display:flex;
justify-content:center;
align-items:center;
gap:24px;
}
.maker-logos-l div:nth-child(1){ width:103px; }
.maker-logos-l div:nth-child(2){ width:141px; }

.maker-logos-r div:nth-child(1){ width:109px; }
.maker-logos-r div:nth-child(2){ width:150px; }


.ab-cont04{
background:#ebebeb;
padding:32px 0 64px;
}

.his-wrap{
background:#fff;
width:745px;
margin:0 auto;
padding:10px;
position:relative;
}

.his-wrap::after{
content:'';
width:24px;
height:calc(100% - 56px);
background:
linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3)),
linear-gradient(to bottom, #00ccff 0%, #742AD5 23%, #5DDF46 51%, #ffe500 76%, #ff0079 100%);
position:absolute;
top:10px;
left:10px;
z-index:1;
}


.history{
position:relative;
display:flex;
flex-direction:column;
gap:20px;
z-index:2;
}

.history::before{
content:'';
width:24px;
height:8px;
background:rgba(255, 0, 121, .7);
position:absolute;
bottom:18px;
left:0;
}
.history::after{
content:'';
width:24px;
height:5px;
background:rgba(255, 0, 121, .7);
position:absolute;
bottom:4px;
left:0;
}


.history li{
}
.his-y{
font-size:24px;
font-weight:900;
color:#057BA2;
padding-left:25px;
position:relative;
}
.his-y::before{
content:'';
width:15px;
height:15px;
border-radius:50%;
border:3px solid #057BA2;
background:#fff;
position:absolute;
top:12px;
left:-6px;
}
.his-c{
font-size:12px;
line-height:1.75;
margin-left:26px;
}