@charset "utf-8";
/* CSS Document */

@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Tangerine:wght@400;700&display=swap");

/*---------

section

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

:root{
    --bg-site-top-main: rgba(252, 244, 225, 1); /* fcf4e1 */
    --bg-site-top-gray: rgba(243, 243, 243, 1); /*f3f3f3 */
}

.top-course-lineup{
    margin-bottom: 5rem; /* fukugou only */
    background-position: 50% 50%;
    background-image: linear-gradient(135deg, #87c8e2 25%, transparent 25%, transparent 50%, #87c8e2 50%, #87c8e2 75%, transparent 75%, transparent);
    background-size: 40px 40px;
    background-color: #9fd3e8;
}

.top-event-information{
    background-color: var(--bg-site-top-main);
}

.top-event-banner{
    background-color: var(--bg-site-top-main);
    background-image: repeating-linear-gradient(45deg, var(--bg-site-top-main) 25%, transparent 25%, transparent 75%,  var(--bg-site-top-main) 75%,  var(--bg-site-top-main)),
                      repeating-linear-gradient(45deg, var(--bg-site-top-main) 25%, #fff 25%, #fff 75%,  var(--bg-site-top-main) 75%,  var(--bg-site-top-main));          
    background-position: 0 0, 2rem 2rem;
    background-size: 4rem 4rem;
}

.top-campus-life{
    background-size: auto auto;
    background-image: linear-gradient(180deg, rgba(231,242,250, 1) 0%, rgba(251,240,234, 1) 100%);
}

.top-news,
.top-access{ background-color: var(--bg-site-top-gray);} /* #fffce4 */

.top-course-lineup,
.top-event-information,
.top-campus-life,
.top-news,
.top-access{ padding-top: 5rem; padding-bottom: 5rem;}

.area-school{
    padding-top: 3rem;
    padding-bottom: 3rem;
    /*background-color: rgba(221, 221, 221, 1);*/
}

@media not all and (min-width:768px){

    .top-information,
    .KvSwiper + main .top-course-lineup{ padding-top: 7rem;}
}

@media (min-width:768px){

    .top-information,
    .KvSwiper + main .top-course-lineup{ padding-top: 10rem;}
}

/*---------

title & p

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

section > h2{ margin-bottom: 0.6em;}
.course-lineup_item h2{ font-weight: 500; padding-right: 1.1em;}
h3{ font-weight: 600;}

@media not all and (min-width:768px){
    
    h1{ font-size: 2.8rem;}

    .top-course-lineup h1,
    .top-event-information h1{ font-size: 3.5rem;}
    
    .top-course-lineup h1 span,
    .top-event-information h1 span{ font-size: 2.5rem;}
    
    h1 ~ p.title-lead{ font-size: 1.4rem;}

    section > h2,
    .course-lineup_item h2,
    .campus-life_item h2{
        font-size: 2.0rem;
    }
    .campus-life_item h2 {
    padding: 5% 8% 0;
    background: rgb(255 255 255 / 80%);
}

}

@media (min-width:768px){

	section:not(.top-course-lineup):not(.top-event-information) h1{ font-size: 4rem;}
    section:not(.top-course-lineup):not(.top-event-information) h1 span{ font-size: 3rem;}

    .top-course-lineup h1, .top-event-information h1{ font-size: 4.6rem;}
    .top-course-lineup h1 span, .top-event-information h1 span{ font-size: 3.6rem;}

    section > h2{ font-size: 2.6rem;}
    .course-lineup_item h2{ font-size: 3.0rem;}
    .campus-life_item h2{ font-size: 2.4rem;
        padding: 10% 8% 4%;
        background: rgb(255 255 255 / 80%);
    }
    h1 ~ p.title-lead{ font-size: 2.2rem;}
    h2 ~ p.title-lead{ font-size: 1.8rem;}
}

/*---------

link

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

a,
a:link,
a:visited{ text-decoration: none;}

.top-information div[class*=banner] a img:hover,
.top-information div[class*=banner] a img:active,
.top-visitor-guide div[class*=banner] a img:hover,
.top-visitor-guide div[class*=banner] a img:active,
.banner-list div[class*=banner] a img:hover,
.banner-list div[class*=banner] a img:active{ opacity: .75;}


/*--- heading-sub-text
----------------------------**/

.heading-sub-text{
    margin: .5em auto .5rem;
    text-align: center;
}

/* .heading-sub-text span{
    font-family: 'Tangerine', cursive;
    font-size: 3.0rem;
    line-height: 1.0;
    color: rgb(29, 47, 91);
    display: inline-block;
    padding: 0 .5em;
    position: relative;
} */

/* @media (min-width:768px){

    .heading-sub-text span{
        font-size: 3.4rem;
    }
} */

/*---------

key-visual

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

.KvSwiper.swiper.swiper-horizontal{
    max-width: 110rem;
    position: relative;
}

.KvSwiper .swiper-horizontal >.swiper-pagination-bullets,
.KvSwiper .swiper-pagination-bullets.swiper-pagination-horizontal{
   bottom: -4rem;
}

.icon-school{
    width: 16%;
    display: block;
    line-height: 1.6;
    text-align: center;
    position: absolute;
    bottom: 0;
    right: 1rem;
    z-index: 10;
    letter-spacing: .25em;
}

.icon-school span{
    display: inline-block;
    border-top: 1px solid #000;
    padding-left: .5em;
    padding-right: .5em;
}

@media not all and (min-width:1024px){

    .icon-school{ font-size: 1.2rem;}
    .KvSwiper .swiper-slide{ width: 100%;}
}

@media (min-width:1024px){

    .icon-school{
        width: 19.5%;
        right: 0;
        font-size: 1.8rem;
    }

    .icon-school span{
        padding-left: 1em;
        padding-right: 1em;
    }
}

/*---------

information

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

.top-information{
    padding-bottom: 2.5rem;
    display: grid;
    justify-content: center;
    grid-template-columns: minmax( 30rem, 103.6rem);
    background: #bddce9;
}

@media not all and (min-width:1024px){

    .top-information{
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media (min-width:768px){

    .top-information{ padding-bottom: 5rem;}
}



/*--- top-information > banner
----------------------------**/

.top-information .banner{
    width: 100%;
    max-width: 103.6rem;
    margin: 0 auto;
    display: grid;
    grid-auto-rows: 1fr;
    grid-auto-columns: 1fr;
    gap: 1rem;   
}

@media (min-width:767px){

    .top-information .banner{
        grid-template-columns: repeat(2 , minmax(30rem, 51.3rem));
        justify-content: space-between;
    }
}

/*---------

course lineup

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

.top-course-lineup_body{
    width: 100%;
    display: flex;
    position: relative;
}

.top-course-lineup_body:not(:first-child){ margin-top: 3.8vh;}

.course-lineup_item > a{
    display: block;
    padding: 5.8% 3.2%;
    background-color: #FFF;
}

.course-lineup_item h2{
    display: inline-block;
    position: relative;
}

.course-lineup_item h2:before,
.course-lineup_item h2:after{
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
}

.course-lineup_item h2:before{
    width: 17px;
    height: 17px;
    /* border-radius: ; */
    transform:translateY(-7px);
}

.course-lineup_item h2::after {
    width: 5px;
    height: 5px;
    right: 7px;
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
    transform:translateY(-1px) rotate(45deg);
}

.top-course-lineup_body.civil-servant h2:before{ background-color: var(--theme-civil-servant);}
.top-course-lineup_body.police-firefighter h2:before{ background-color: var(--theme-police-firefighter);}
.top-course-lineup_body.accountant h2:before{ background-color: var(--theme-accountant);}
.top-course-lineup_body.business h2:before{ background-color: var(--theme-business);}
.top-course-lineup_body.it h2:before{ background-color: var(--theme-it);}
.top-course-lineup_body.medical h2:before{ background-color: var(--theme-medical);}
.top-course-lineup_body.sports h2:before{ background-color: var(--theme-sports);}
.top-course-lineup_body.daigaku h2:before{ background-color: var(--theme-daigaku);}

.course-lineup_item{ background-size: auto auto;}
.top-course-lineup_body.civil-servant .course-lineup_item{ background-color: rgba(92, 161, 167, .6);}
.top-course-lineup_body.police-firefighter .course-lineup_item{ background-color: rgba(106, 163, 102, .6);}
.top-course-lineup_body.accountant .course-lineup_item{ background-color: rgba(99, 121, 172, .6);}
.top-course-lineup_body.business .course-lineup_item{ background-color: rgba(51, 173, 241, .6);}
.top-course-lineup_body.it .course-lineup_item{ background-color: rgba(94, 167, 138, .6);}
.top-course-lineup_body.medical .course-lineup_item{ background-color: rgba(255, 125, 185, .6);}
.top-course-lineup_body.sports .course-lineup_item{ background-color: rgba(255, 185, 51, .5);}
.top-course-lineup_body.daigaku .course-lineup_item{ background-color: rgb(205, 118, 183, .6);}

.course-lineup_item dl{ margin-top: 1em;}

.top-course-lineup_body dt{ font-size: 1.4rem;}
.top-course-lineup_body.civil-servant dt{ color: var(--theme-civil-servant);}
.top-course-lineup_body.accountant dt{ color: var(--theme-accountant);}
.top-course-lineup_body.accountant dt{ color: var(--theme-accountant);}
.top-course-lineup_body.business dt{ color: var(--theme-business);}
.top-course-lineup_body.it dt{ color: var(--theme-it);}
.top-course-lineup_body.medical dt{ color: var(--theme-medical);}
.top-course-lineup_body.sports dt{ color: var(--theme-sports);}
.top-course-lineup_body.daigaku dt{ color: var(--theme-daigaku);}

.top-course-lineup_body.civil-servant p{ color: var(--theme-civil-servant);}
.top-course-lineup_body.police-firefighter p{ color: var(--theme-police-firefighter);}
.top-course-lineup_body.accountant p{ color: var(--theme-accountant);}
.top-course-lineup_body.business p{ color: var(--theme-business);}
.top-course-lineup_body.it p{ color: var(--theme-it);}
.top-course-lineup_body.medical p{ color: var(--theme-medical);}
.top-course-lineup_body.sports p{ color: var(--theme-sports);}
.top-course-lineup_body.daigaku p{ color: var(--theme-daigaku);}


.course-lineup_item dd ul{ display: inline;}

.course-lineup_item dd li{
    display: inline-block;
    position: relative;
    margin-right: 1.4rem;
}

.course-lineup_item dd li:not(:last-child):after{
    content: "";
    width: 1px;
    height: 12px;
    background-color: #CCC;
    position: absolute;
    bottom: 7px;
    right: -8px;
}

.course-lineup_item dd{ font-size: 1.0rem;}
.top-course-lineup_body.medical dl dd sup{ color: var(--theme-medical);}

/*--- courselineup a hover
----------------------------**/

.course-lineup_item > a::before,
.course-lineup_item > a::after {
    content:"";
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    box-sizing: border-box;
    opacity: 0;
    transition: width 0.5s, height 0.5s, opacity 0.5s;
}

.course-lineup_item > a::before {
    top: 0;
    left: 0;
    border-top: .1rem solid #FFF;
    border-left: .1rem solid #FFF;
}

.course-lineup_item > a::after {
    right:0;
    bottom:0;
    border-right: .1rem solid #FFF;
    border-bottom: .1rem solid #FFF;
}

.course-lineup_item > a:hover{ opacity: 1;}

.course-lineup_item > a:hover::before,
.course-lineup_item > a:hover::after {
    width:100%;
    height:100%;
    opacity:1;
}
.civil-servant .course-lineup_item > a::before{ border-top-color: var(--theme-civil-servant); border-left-color: var(--theme-civil-servant);}
.civil-servant .course-lineup_item > a::after { border-bottom-color: var(--theme-civil-servant); border-right-color: var(--theme-civil-servant);}
.police-firefighter .course-lineup_item > a::before{ border-top-color: var(--theme-police-firefighter); border-left-color: var(--theme-police-firefighter);}
.police-firefighter .course-lineup_item > a::after { border-bottom-color: var(--theme-police-firefighter); border-right-color: var(--theme-police-firefighter);}
.accountant .course-lineup_item > a::before{ border-top-color: var(--theme-accountant); border-left-color: var(--theme-accountant);}
.accountant .course-lineup_item > a::after { border-bottom-color: var(--theme-accountant); border-right-color: var(--theme-accountant);}
.business .course-lineup_item > a::before{ border-top-color: var(--theme-business); border-left-color: var(--theme-business);}
.business .course-lineup_item > a::after { border-bottom-color: var(--theme-business); border-right-color: var(--theme-business);}
.it .course-lineup_item > a::before{ border-top-color: var(--theme-it); border-left-color: var(--theme-it);}
.it .course-lineup_item > a::after { border-bottom-color: var(--theme-it); border-right-color: var(--theme-it);}
.medical .course-lineup_item > a::before{ border-top-color: var(--theme-medical); border-left-color: var(--theme-medical);}
.medical .course-lineup_item > a::after { border-bottom-color: var(--theme-medical); border-right-color: var(--theme-medical);}
.sports .course-lineup_item > a::before{ border-top-color: var(--theme-sports); border-left-color: var(--theme-sports);}
.sports .course-lineup_item > a::after { border-bottom-color: var(--theme-sports); border-right-color: var(--theme-sports);}
.daigaku .course-lineup_item > a::before{ border-top-color: var(--theme-daigaku); border-left-color: var(--theme-daigaku);}
.daigaku .course-lineup_item > a::after { border-bottom-color: var(--theme-daigaku); border-right-color: var(--theme-daigaku);}



@media not all and (min-width:768px){

    .top-course-lineup_body{ flex-direction: column-reverse; }

    .course-lineup_item{
        padding: 0 2rem 2rem 0;
        margin-top: -2.4rem;}

    .course-lineup_item > a{
        padding-top: 5.8%;
        padding-bottom: 5.8%;}
    
    .course-lineup_item h2 + p,
    .course-lineup_item{ font-size: 1.2rem;}

    .course-lineup_item dt,
    .course-lineup_item dd li span{ font-size: 1.2rem;}
    .top-course-lineup_img{ z-index: -1;}
}

@media (min-width: 768px){

    .top-course-lineup_body{
        width: 95vw;
        align-items: flex-start;
    }

    .course-lineup_item{
        flex: 1 1 50%;
        padding: .1rem 0;
        /* max-width: 780px; */    
        max-width: 50%;
        position: relative;
    }

    .course-lineup_item > a{
        max-width: 50rem;
        min-width: 45rem;
        margin-left: auto;
        padding: 3.2%;
    }

    .course-lineup_item h2:before{
        width: 24px;
        height: 24px;
        /* border-radius: ; */
        transform:translateY(-10px);
    }
    
    .course-lineup_item h2::after {
        width: 8px;
        height: 8px;
        right: 10px;
        transform:translateY(-2px) rotate(45deg);
    }

    .top-course-lineup_img{
        flex: 0 0 50%;
        max-width: 68rem;
        transform: translateX(-55px);
        z-index: -1;
    }

    .top-course-lineup_img img{
        height: 27rem;
        object-fit: cover;
        object-position: 0 -5px;
    }

    .course-lineup_item dd{ font-size: 1.2rem;}
    .course-lineup_item dd li span{ font-size: 1.4rem;}

    .top-course-lineup_body:nth-of-type(2n){ transform: translateX(5vw);}
    .top-course-lineup_body:nth-of-type(2n){ flex-direction: row-reverse;}
    .top-course-lineup_body:nth-of-type(2n) .course-lineup_item > a{ margin-left: 0;}
    .top-course-lineup_body:nth-of-type(2n) .top-course-lineup_img{ transform: translateX(55px);}
}

/*---------

event information

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

/*--- event-catch-text
----------------------------**/

.event-catch-text{
    display: grid;
    max-width: 88.4rem;
    margin: 2rem auto 0;
    place-content: center;
    place-items: center;
}

.event-catch-text span{ 
    font-size: 1.4rem;
    width: 170px;
    background-color: var(--site-point-color);
    text-align: center;
    padding: .25em;
    border:1px solid #000;
}

/*--- event-banner-swiper
----------------------------**/

.event-banner-swiper li a img{
    position: relative;
    transform: translateZ(0);
}

.event-banner-swiper li a:hover img{ filter: drop-shadow(-.2rem -.2rem .6rem rgba(0, 0, 0, 0.2));}

@media not all and (min-width:768px){

    .event-catch-text{
        grid-template-columns: repeat(2, 50%);
        grid-auto-rows: minmax(3em, 1fr);
    }
}

@media (min-width:768px){

    .event-catch-text{
        width: max-content;
        grid-template-columns: repeat(2, minmax(25rem, 1fr));
        grid-auto-rows: minmax(2em, 1fr);
        gap: 1.5rem;
    }

    .event-catch-text span{
        width: 100%;
        padding: .25em;
        font-size: 1.8rem;
        text-align: center;
        background-color: var(--site-point-color);
        border:1px solid #000;
    }
}

/*---------

top visitor guide

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

.top-visitor-guide .section-inner,
.top-visitor-guide .request-banner,
.top-visitor-guide .banner{ max-width: var(--width);}
.top-visitor-guide .result-banner{ max-width: 68.4rem;}

.top-visitor-guide div[class*="banner"]{ margin-left: auto; margin-right: auto;}

/*--- visitor guide > banner
----------------------------**/

.top-visitor-guide .banner{ display: grid;}

@media not all and (min-width:768px){

    .top-visitor-guide div[class*="banner"]{
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    .top-visitor-guide .request-banner{ padding-top: 5rem;}
    .top-visitor-guide .banner{ padding-top: 7.5rem; row-gap: 2.4rem;}
    .top-visitor-guide .result-banner{ padding-top: 2.4rem;}
}

@media (min-width:768px){

    .top-visitor-guide .request-banner{ padding-top: 6.4rem;}

    .top-visitor-guide .banner{
        padding-top: 10rem;
        grid-template-columns: repeat(auto-fit , 49%);
        column-gap: 2%;
    }

    .top-visitor-guide .result-banner{ padding-top: 5rem;}
}

/*---------

campus life

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

.top-campus-life .section-inner{
    display: grid;
    max-width: var(--width);
}

.top-campus-life a{
    display: block;
    position: relative;
    overflow: hidden;
}

.top-campus-life a img{
    position: relative;
    transition: .6s;
    transition-delay: .2s;
    z-index: -1;
}

.top-campus-life a:hover img{ transform: scale(1.1);}

.campus-life_item{
    width: 100%;
    height: 100%;
    padding: 0% 34% 0 0%;
    position: absolute;
}

.campus-life_item p{
    font-size: 1.2rem;
    line-height: 1.8;
    padding: 1.5em 0 1em;
    padding: 1.5em 8%;
    background: rgb(255 255 255 / 80%);
    min-height: 165px;
}

/*
.top-campus-life .section-inner a:nth-of-type(2) h2,
.top-campus-life .section-inner a:nth-of-type(2) p{ color: #FFF;}
*/

@media not all and (min-width:768px){

    .top-campus-life .section-inner{
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        row-gap: 1rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media (min-width:768px){

    .top-campus-life .section-inner{
        grid-template-columns: repeat(auto-fit ,32%);
        column-gap: 2%;
    }

    .campus-life_item{ padding: 0;}
    .campus-life_item p{ font-size: 1.8rem;
        padding: 5% 8%;
        background: rgb(255 255 255 / 80%);
        min-height: 165px;
    }
}

/*---------

admission info

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

.top-admission-info ul{
    max-width: 68rem;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.top-admission-info li{
    line-height: 1.5;
    padding: .5em;
    margin: 0 .5em 0.5em 0;
    border-radius: .8rem;
    position: relative;
    border: 1px solid #bfbfbf;
}

@media not all and (min-width:768px){

    .top-admission-info ul{
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .top-admission-info li{ font-size: 1.3rem;}
}

/*---------

sns

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

.top-sns{
    position: relative;
    /*padding-top: 10rem;**/
    padding-bottom: 5rem;
}

.top-sns_body{
    max-width: var(--width);
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: 1.5rem 2%;
}

.top-sns_body .twitter{
    position: relative;
    padding: .8rem 1rem .8rem;
    background-color: #FFF;
    border-radius: 2rem;
    border: 1px solid #CCC;
}

.top-sns_body .twitter::before{
    content: "";
    display: block;
    width: 4.8rem;
    height: 4.8rem;
    margin: -7.2rem auto 1.6em;
    /*background: url(../images/icon/icon-twitter.png) no-repeat center top;**/
    background-size: cover;
}

.top-sns_body > .banner{
    display: grid;
    grid-auto-rows: auto;
    gap: 1.5rem;
    align-content: baseline;
}

.top-sns_body > .banner img{
    border-radius: 1.6rem;
    overflow: hidden;
}

.top-sns_body > .banner a:hover img{
    filter: drop-shadow(-.2rem -.2rem .6rem rgba(0, 0, 0, 0.2));
}

.top-sns_body > .banner img[src*="ig"]{
    border: 1px solid #CCC;
}

.top-sns_body ~ .youtube{
    max-width: 68rem;
    padding-top: 1.5rem;
    margin-left: auto;
    margin-right: auto;
}

.top-sns_body ~ .sns-icon{
    padding-top: 5rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, 3.3rem);
    grid-auto-rows: auto;
    gap: 16%;
    justify-content: center;
}

@media not all and (min-width:768px){

    .top-sns_body{ padding-left: 1rem; padding-right: 1rem;}
}

@media (min-width:768px){

    .top-sns_body{ grid-template-columns: repeat(2 , 49%);}
    .top-sns_body .twitter{ padding: .8rem 4rem .8rem;}
    .top-sns_body ~ .youtube{ padding-top: 5rem;}
    .top-sns_body ~ .sns-icon{ gap: 4%;}
}

/*--- top-access
----------------------------**/

.top-access{ text-align: center;}
.top-access li span{ text-decoration: underline dotted;}

/*--- top affiliated school list
----------------------------**/



/*---------

information-list

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

/* border: 1px solid #a0a0a0; */

.information-list,
.information-list + .about-school{
    margin-left: auto;
    margin-right: auto;
	display: grid;
    grid-auto-rows: 1fr;
    grid-template-columns: 1fr;
}

.information-list{
    max-width: var(--width);
	column-gap: 2%;
}

.information-list + .about-school{
    padding-top: 4rem;
    width: 100%;
    max-width: var(--width-min);
    align-content: center;
    position: relative;
}

.information-list + .about-school::after{
    content: "";
	display: inline-block;
	width: 4.8rem;
	min-height: 3rem;
	position: absolute;
	top: 50%;
	left: 12em;
	background: url(../images/img-emblem.png) no-repeat 50%;
	background-size: contain;
    transform: translateY(.3rem);
}

.information-list a,
.information-list + .about-school a{
    background-color: #fff;
    border: 1px solid #000;
	position: relative;
}

.information-list + .about-school a{
    border-left: .4rem solid #e20f21;
    padding: 1em 5rem 1em 1em;
}

.information-list a::before,
.information-list a::after,
.information-list + .about-school a::before,
.information-list + .about-school a::after{
    content: "";
    display: block;
    width: 1rem;
    height: .1rem;
    background-color: #000;
    position: absolute;
    top: 50%;
    right: 2rem;
    transition: .3s;
}

.information-list a:hover::before,
.information-list a:hover::after,
.information-list + .about-school a:hover::before,
.information-list + .about-school a:hover::after{ right: 1.2rem;}

.information-list a::before,
.information-list + .about-school a::before{ width: 2rem;}

.information-list a::after,
.information-list + .about-school a::after{ transform:translateY(-.4rem) rotate(45deg);}

.information-item{
	width: 100%;
	min-height: 6.5rem;
    padding-right: 4rem;
	line-height: 1.6;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
}

.information-item small{
	font-size: 3.2vw;
	line-height: 1.2;
    padding-left: 1em;
}

.information-item dt{
    font-weight: bold;
	font-size: 1.8rem;
}

@media not all and (min-width:768px){

    .information-list,
    .information-list + .about-school{
        padding-left: 1rem;
        padding-right: 1rem;
    }

	.information-list{
		row-gap: 1rem;
		grid-template-columns:1fr;
	}

    .information-item{
        text-align: left;
        padding-left: 5%;
	}

	.information-item rt{ display: none;}
    .information-item dd{ font-size: 1.2rem;}

    /* 項目1つ中心対応 */
    .information-list > .information-item:nth-child(1){
        display: none;
	}

}

@media (min-width:768px){

	.information-list{
		grid-template-columns: repeat(3 , 32%);
	}

    .information-list + .about-school{
        min-height: 8rem;
        text-align: center;
    }

    .information-list + .about-school::after{
        height: 4rem;
        left: 50%;
        transform: translate( 5em , -.2rem);
    }
    
    .information-item{
		min-height: 10rem;
        flex-direction: column;
        text-align: center;
        justify-content: center;
	}

	.information-item small{
		display: block;
		font-size: 1.4rem;
	}

	.information-item dt{ font-size: 2rem;}
}

/*---------

top-link-area

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

.top-link-area{
    width: 100%;
    text-align: center;
    padding-left: 1rem;
    padding-right: 1rem;
    margin: 3.2rem auto 0;
    display: grid;
    gap: 3.2rem;
    place-content: center;
}

.top-link-area a:not([class]){
    padding: .75em 1.5em;
    color: #FFF;
    background-color: rgba(0, 0, 0, 1);
    border: 2px solid rgba(0, 0, 0, 1);
    border-radius: .5em;
}

.top-link-area a:not([class]):hover{
    color: #000;
    background-color: rgba(255, 255, 255);
}

.to-more,
.to-more:link,
.to-more:visited{
	display: inline-block;
	padding: .25em 1.5em;
	margin: 0 auto;
	text-align: center;
	background-color: #FFF;
	border: 1px solid #000;
	border-radius: .5em;
}

.to-more:hover,
.to-more:active{
    color: #FFF;
	background-color: #000;
}

@media not all and (min-width:768px){

    .top-link-area a:not([class]){ width: 90vw;}
}

@media (min-width:768px){

    .top-link-area{ max-width: max-content;}
    .top-link-area a:not([class]){ min-width: 36rem;}
}

/*--- top-event-information
----------------------------**/

.top-event-information{ padding-bottom: 5rem;}

.top-event-information a:not([class]){
    font-size: 2.2rem;
    padding: 1em 1.5em;
    background: #FFF;
    color: #000;
}

.top-event-information a:not([class]):hover {
    background: var(--site-point-color);
}
    
.top-event-information a:not([class]) span::before,
.top-event-information a:not([class]) span::after{
    content: "";
    display: block;
    width: 1.5rem;
    height: .1rem;
    background-color: #000;
    position: absolute;
    top: 50%;
    right: 3rem;
    transition: .3s;
}

.top-event-information a:not([class]) span::before{ width: 2.8rem;}
.top-event-information a:not([class]) span::after{ transform:translateY(-.6rem) rotate(45deg);}

.top-event-information a:not([class]):hover span::before,
.top-event-information a:not([class]):hover span::after{ right: 2rem;}

.top-event-information a:not([class])::after{
    content: "";
    display: inline-block;
    width: 6rem;
    min-height: 4.5rem;
    position: absolute;
    top: 50%;
    left: 3.8em;
    background: url("/assets/images/icon/icon-schedule.png") no-repeat 50%;
    background-size: contain;
    transform: translateY(-2.2rem);
    z-index: 10;
}

@media not all and (min-width:768px){
    .top-event-information a:not([class]){
        line-height: 1.5;
        width: 94vw;
    }
    
    .top-event-information a:not([class]) span::before,
    .top-event-information a:not([class]) span::after{
        right: 2rem;
    }
    
    .top-event-information a:not([class]):hover span::before,
    .top-event-information a:not([class]):hover span::after{ right: 1rem;}
    
    .top-event-information a:not([class])::after{
        width:12vw;
        left: 4vw;
    }
}

@media (min-width:768px){
    .top-event-information a:not([class]){
        width: 68.4rem;
    }
}

@media (max-width:320px){
    .top-event-information a:not([class]){
        font-size: 1.8rem;
    }
}

/** tokyo only title icon **/

.section-inner{
    padding-top: 10rem;
    position: relative;
}

.top-event-information .event-catch-text{
    margin-top: 10rem;
    position: relative;
}

.section-inner::before{
    content: "";
    display: block;
    width: 4.8rem;
    height: 4.8rem;
    position: absolute;
    left: 50%;
    top: 2.4rem;
    transform: translateX(-50%);
    background-repeat: no-repeat;
    background-size: contain;
}

.top-event-information .event-catch-text::before{
    content: "";
    display: block;
    width: 4.8rem;
    height: 4.8rem;
    position: absolute;
    left: 50%;
    top: -7.2rem;
    transform: translateX(-50%);
    background-repeat: no-repeat;
    background-size: contain;
}

.top-course-lineup .section-inner::before{ background-image:url(../images/icon/top/title01.png);}
.top-event-information .event-catch-text::before{ background-image:url(../images/icon/top/title02.png);}
/* .top-visitor-guide .section-inner::before{ background-image:url(../images/icon/top/title03.png);} */
.top-campus-life .section-inner::before{ background-image:url(../images/icon/top/title04.png);}
.top-admission-info section:nth-of-type(1) .section-inner::before{ background-image:url(../images/icon/top/title05.png);}
.top-admission-info section:nth-of-type(2) .section-inner::before{ background-image:url(../images/icon/top/title06.png);}
.top-news .section-inner::before{ background-image:url(../images/icon/top/title07.png);}
.top-access .section-inner::before{ background-image:url(../images/icon/top/title08.png);}
.information .section-inner::before{ background-image:url(../images/icon/top/title09.png);}

/*---------

.modal-layer

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

.modal-layer {
    display: none;
    position: fixed;
    z-index: 999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.7);
    transition: all 1s ease-in-out;
  }
  
.modal-content {
    width: 100vw;
    max-width: 96rem;
    height: auto;
    max-height: 90vh;
    padding: 1.6rem 0;
    background-color: rgba(0, 0, 0, 0);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: show 0.6s linear 0s;
    overflow-y: none;
}

.modal-content iframe{
    width: 100%;
    min-height: 30rem;
}

.modal-content button{
    content: "";
    display: block;
    width: 3.2rem;
    height: 3.2rem;
    background-color: var(--site-main-orange-color);
    clip-path: inset(0 round 1rem);
    border: none;
    z-index: 1000;
    appearance: none;
    position: absolute;
    right: 0;
    top: 0;
}

.modal-content button::after {
    content: "";
    display: block;
    width: 1.8rem;
    height: 1.8rem;
    background-color: #FFF;
    clip-path: polygon(10% 0%, 0% 10%, 40% 50%, 0% 90%, 10% 100%, 50% 60%, 90% 100%, 100% 90%, 60% 50%, 100% 10%, 90% 0%, 50% 40%);
}

@keyframes show{
    
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

@media (min-width:768px){

    .modal-content { width: 98vw; padding: 2.4rem 2.4rem;}
    .modal-content iframe{ min-height: 54rem;}
}

/*---------

sns202401

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

.top-sns_body {
    display: block;
}

.top-sns_body .banner a:hover {
    opacity: .75;
}

.top-sns_body>.banner a:hover img {
    filter: none;
}

@media (min-width:768px) {
    .top-sns_body .banner {
        display: flex;
        justify-content: center;
        gap: 2%;
    }

    .top-sns_body .banner a {
        width: 32%;
    }
}


/*---------

visitor-list 202507

----------------------------**/
.top-visitor-guide .visitor-guide-area{
    background: var(--bg-site-main-gray);
}
.top-visitor-guide .section-inner{
    padding: 5rem 0;
}
.visitor-list{
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-auto-rows: 1fr;
    grid-template-columns: 1fr;
    justify-content: center;
    max-width: var(--width);
    column-gap: 2%;
}
.visitor-list a{
    border: 1px solid #000;
    position: relative;
    margin-bottom: 0;
    background-color: #fff;
    background-image: url(../../../design/common/images/visitor/top-list-img01.png);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
.visitor-list a:nth-of-type(1){ background-image: url(../../../design/common/images/visitor/top-list-img01.png);}
.visitor-list a:nth-of-type(2){ background-image: url(../../../design/common/images/visitor/top-list-img02.png);}
.visitor-list a:nth-of-type(3){ background-image: url(../../../design/common/images/visitor/top-list-img03.png);}
.visitor-list a:nth-of-type(4){ background-image: url(../../../design/common/images/visitor/top-list-img04.png);}

.visitor-list a::before,
.visitor-list a::after{
    content: "";
    display: block;
    width: 1rem;
    height: .1rem;
    background-color: #000;
    position: absolute;
    top: 50%;
    right: 2rem;
    transition: .3s;
}
.visitor-list a:hover::before,
.visitor-list a:hover::after{ right: 1.2rem;}

.visitor-list a::before{ width: 2rem;}
.visitor-list a::after{ transform:translateY(-.4rem) rotate(45deg);}

.visitor-item{
    width: 100%;
    min-height: 10rem;
    padding: 0 4rem 0 12rem;
    line-height: 1.6;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.visitor-item small{
    font-size: 1.2rem;
    line-height: 1.2;
}

.visitor-item dt{
    font-weight: bold;
    font-size: 1.8rem;
}

@media not all and (min-width:768px){

    .visitor-list{
        padding-left: 1rem;
        padding-right: 1rem;
        row-gap: 1rem;
        grid-template-columns:1fr;
    }
    .visitor-item rt{ display: none;}
    .visitor-item dd{ font-size: 1.2rem;}
}

@media (min-width:768px){
    .visitor-list{
        grid-template-columns: repeat(2 , 49%);
        row-gap: 20px;
    }
    .visitor-item{
        min-height: 10rem;
        padding: 0 4rem 0 10rem;
        flex-direction: column;
        text-align: center;
        justify-content: center;
        align-items: center;
    }
    .visitor-item small{
        display: block;
        font-size: 1.4rem;
    }
    .visitor-item dt{ font-size: 2rem;}
}

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

experience-school-swiper

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


/* .experience .experience-school-swiper li a {
    border-style: none;
    padding-left: 0;
}
.experience .experience-school-swiper li {
    width: 68%;
}
.experience .swiper {
    overflow: visible;
}

@media (min-width:768px){

.experience .experience-school-swiper li{
    width: 300px
    } 

.experience .experience-school-swiper li a {
    min-height: 0;
    }

.experience-school-swiper{
    max-width: 128rem;
    padding-top: 2rem;
}
}

.experience-school-swiper li{
    line-height: 1.4;
    background-color: #FFF;
    border-radius: 10px;
    padding: 2px;
    background-repeat: no-repeat;
    background-position: left 10px bottom -8px;
}

.experience-school-swiper li a{
    display: flex;
    align-items: center;
    min-width: 20rem;
    min-height: 10rem;
    border-style: solid;
    border-width: 1.5px;
    border-radius: 1rem;
    padding-left: 5.8rem;
}


@media not all and (min-width:1024px){

    .experience-school-swiper li{ background-size: 60%;}
}

@media (min-width:768px){

    .experience-school-swiper ul{
        display: flex;
        justify-content: center;
        margin: 0 auto;
        gap: 30px;
    }

    .experience-school-swiper li{
        font-size: 1.8rem;
        width: 24rem;
        background-position: left 10px bottom 0;
    }

    .experience-school-swiper li a{
        min-height: 13rem;
        padding-left: 7rem;
    }
}

.experience .swiper-pointer-events ul{
    justify-content: normal;
} */


/* --------------------------------------
　スライダー追加記述
 --------------------------------------*/
 @media (max-width:960px){
    .experience-school-swiper .swiper-pagination .swiper-pagination-bullet {
        margin: -0.5rem 0.8rem;
    }
    .experience-school-swiper .swiper-pagination {
        line-height: 1.2;
    }
}

/*-------------------
202407 special-movie
------------------*/

.top-special-movie{
	background-size: 32px 32px;
	background-position: 50% 50%;
	background-image: repeating-linear-gradient( 90deg, rgba(255, 255, 255, .5), rgba(255 , 255, 255, .5) 1px, transparent 1px, transparent 32px),
                      repeating-linear-gradient( 0deg, rgba(255, 255, 255, .5), rgba(255, 255, 255, .5) 1px, rgba(222, 236, 247, 1) 1px, rgba(222, 236, 247, 1) 32px);
	padding:5em 0;
}
.top-special-movie .youtube{
    max-width: 68rem;
    padding-top: 3rem;
    margin-left: auto;
    margin-right: auto;
}

 @media (max-width:960px){
    .top-special-movie  .youtube{
    max-width: 90%;
    }
 }

 /* ==========================
  フローティングバナー（追従バナー）
========================== */
.bl_floatingBanner {
    position: fixed;
    top: 395px;
    right: 105px;
    width: 290px;
    max-width: 100%;
    z-index: 55;
  }

  @media (max-width:960px){
    .bl_floatingBanner {
        position: fixed;
        top: 280px;
        right: 24px;
        width: 170px;
        max-width: 100%;
        z-index: 55;
      }
    }

  .bl_floatingBanner.js_close {
    display: none;
  }
  .bl_floatingBanner_img {
    display: block;
    transition: 0.3s;
  }
  .bl_floatingBanner_img:hover {
    opacity: 0.6;
  }
  .bl_floatingBanner_close {
    width: 30px;
    height: 30px;
    position: absolute;
    right: -17px;
    top: -15px;
    cursor: pointer;
    background-color: #127FF2;
    border-radius: 30px;
  }
  .bl_floatingBanner_close span:nth-of-type(1) {
    position: absolute;
    top: 13px;
    right: 7px;
    width: 15px;
    height: 3px;
    background-color: #fff;
    transform: rotate(45deg);
  }
  .bl_floatingBanner_close span:nth-of-type(2) {
    position: absolute;
    top: 7px;
    right: 13px;
    width: 3px;
    height: 15px;
    background-color: #fff;
    transform: rotate(45deg);
  }

 /* --------------------------------------
20240820
スクロール時の矢印追加
--------------------------------------*/
.swiper.swiper-initialized .swiper-button-prev,
.swiper.swiper-initialized .swiper-button-next {
    width: 44px;
    height: 44px;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    border-radius: 50%;
    /* border: 1px solid #111; */
    background-color: #fff;
    transform:translateY(-10px);
    box-shadow: 0px 0px 12px 0px rgba(155 155 155 / 90%);
}

.swiper.swiper-initialized .swiper-button-prev::after,
.swiper.swiper-initialized .swiper-button-next::after {
    content: "";
    position: absolute;
    top: 0;
}
.swiper.swiper-initialized .swiper-button-prev::before,
.swiper.swiper-initialized .swiper-button-prev::after {
    left: 0
}
.swiper.swiper-initialized .swiper-button-next::before,
.swiper.swiper-initialized .swiper-button-next::after {
    right: 0
}

.swiper.swiper-initialized .swiper-button-prev::after {
    width: 20px;
    height: 20px;
    left: 16px;
    top: 13px;
    border-bottom: 2px solid #8f8f8f;
    border-left: 2px solid #8f8f8f;
    transform: translateY(-2px) rotate(45deg);
}

.swiper.swiper-initialized .swiper-button-next::after {
    width: 20px;
    height: 20px;
    right: 16px;
    top: 13px;
    border-top: 2px solid #8f8f8f;
    border-right: 2px solid #8f8f8f;
    transform:translateY(-2px) rotate(45deg);
}

.swiper:not(.swiper-initialized) .swiper-button-prev,
.swiper:not(.swiper-initialized) .swiper-button-next {
    visibility: hidden;
}

/* --コース体験 experience-school-swiper --*/
@media (min-width: 768px){
    .experience-school-swiper.swiper.swiper-initialized {
        max-width: unset;
    }
    .experience-school-swiper.swiper.swiper-initialized .swiper-button-next {
        right: 2%;
    }
    .experience-school-swiper.swiper.swiper-initialized .swiper-button-prev {
        left: 2%;
    }
}
/*--------------------
20250428 大原追記 SNS
--------------------*/

.top-sns_body > .banner{
    display:flex;
    flex-wrap:wrap;
    justify-content: space-between;
}

.round-btn{
    width:30%;
    margin: 10px 0px;
    text-align: center;
}

.round-btn div.round-btn-name{
    color:#000000;
    font-weight:bold;
    background:#ffffff;
    border:1px solid #000000;
    border-radius:25px;
    box-shadow:3px 2px 1px #4f4f4f;
    width: 100px;
    height: 35px;
    margin: 0 auto 20px;
}

.top-sns_body > .banner img{
    border-radius: 0rem;
    width: 75px;
}

.top-sns_body > .banner img[src*="ig"]{
    border:none;
}

@media (min-width:768px) {
    .top-sns_body > .banner{
       max-width: 400px;
       margin: auto;
    }
        
    .top-sns_body .banner a.round-btn{
      max-width: 100px;
    }
    
}

.slidein02 {
    opacity: 0;
    transform: translate(0,0);
    transition: all 1.0s;
    &.slidein-left{
        transform: translate(-100%,0);
    }
    &.slidein-right{
        transform: translate(100%,0);
    }
    &.slidein-up{
        transform: translate(0,-100%);
    }
    &.slidein-bottom{
        transform: translate(0,100%);
    }
    &.scrollin{
    transform: translate(0, 0)!important;
    opacity: 1!important;
    }
}

/* 20250625トップ学科下線 */

.civil-servant{
    --top-theme-course-border: rgba(92, 161, 167, .3); /* 5ca1a7 */
}

.police-firefighter{
    --top-theme-course-border: rgba(106, 163, 102, .3); /* 6aa366 */
}
.business{
    --top-theme-course-border: rgb(0, 153, 238, .3); /* 0099ee */
}

.accountant{
    --top-theme-course-border: rgba(60, 87, 151, .3); /* 3c5797 */
}
.sports{
    --top-theme-course-border: rgba(255, 174, 0, .3); /* ffae00 */
}

.it{
    --top-theme-course-border: rgba(54, 145, 109, .3); /* 36916d */
}

.medical{
    --top-theme-course-border: rgba(255,92,168, .3); /* ff5ca8 */
}

.nursery{
    --top-theme-course-border: rgba(255, 155, 26,.3); /* ff9b1a */
}

.welfare{
    --top-theme-course-border: rgba(90, 173, 65, .3); /* 5aad41 */
}

.seika{
	--top-theme-course-border: rgba(210, 163, 0, .3); /* d2a300 */
}

.bridal{
	--top-theme-course-border: rgba(241, 122, 194, .3); /* f17ac2 */
}

.beauty{
	--top-theme-course-border: rgba(230, 110, 149, .3); /* e66e95 */
}

.anime{
	--top-theme-course-border: rgba(255, 122, 51, .3); /* ff7a33 */
}

.travel{
	--top-theme-course-border: rgba(139, 184, 0, .3); /* 8bb800 */
}

.hotel{
	--top-theme-course-border: rgba(235, 100, 157, .3); /* eb6480 */
}

.airline{
	--top-theme-course-border: rgba(32, 168, 213, .3); /* 20a8d5 */
}

.hair{
	--top-theme-course-border: rgba(128, 0, 128, .3); /* 800080 */
}

.creator{
	--top-theme-course-border: rgba(89, 183, 134, .3); /* 59b786 */
}
.emergency{
    --top-theme-course-border: rgba(234, 126, 110, .3); /* ea7e6e */
}

.daigaku{
    --top-theme-course-border: rgba(185, 99, 164, .3);/* #b963a4 */
}

.top-course-lineup_body h2 {
    background:linear-gradient(transparent 70%, var(--top-theme-course-border, #fff) 50%);
    display: inline-block;
	background-repeat: no-repeat;
    background-size: 0% 100%;
    transition:background-size 1.5s;
    background-clip: content-box;
  }
  
  .top-course-lineup_body h2.is-active {
    /* background-position: left center; */
    background-size: 100% 100%;
  }

/* --------------------------------------
20250625 お知らせ在校生のみ表示時のcss調整
--------------------------------------------*/
#news_overview-hidden.top-link-area{
    margin-bottom: 5.2rem;
}
#news_student-hidden.top-link-area{
    margin-top: 0;
}
#news_student-hidden.top-link-area .title-lead{
    margin-top: 0;
}

/*--- urgent-news
----------------------------**/
.urgent-news {
    width: 100%;
    padding-bottom: 1.6rem;
    margin: 0 auto;
}
.urgent-news a{
    font-size: 1.6rem;
    line-height: 1.6;
    min-height: 5rem;
    padding: .25em 3em .25em 1em;
    margin-bottom: 1rem;
    border-radius: .5rem;
    background-color: #FFF;
    display: grid;
    align-content: center;
    position: relative;
}
.urgent-news a:after{
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 1rem;
    width: .8rem;
    height: .8rem;
    transform: translate(-1.2rem , -50%) rotate(45deg);
    z-index: 3;
}
/* 緊急のお知らせ表示時css */
.urgent-news.emergency a{
    color: #ed5b5c;
    border: 1px solid #ed5b5c;
}
.urgent-news.emergency a:after{
    border-top :1px solid #ed5b5c;
    border-right :1px solid #ed5b5c;
}
/* 通常のお知らせ表示時css */
.urgent-news a{
    color: #000000;
    border: 1px solid #000000;
}
.urgent-news a:after{
    border-top :1px solid #000000;
    border-right :1px solid #000000;
}
@media not all and (min-width:768px){
    .urgent-news a{ font-size: 1.4rem;}
}
/* 20250820 youtubeモーダル化 */
.p-top-movie__iframebox {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
  }
  
  .p-top-movie__iframebox iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  
  .p-top-movie__modal {
    display: none; /* デフォルトでは非表示 */
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 20px);
    max-width: 1030px;
    height: auto;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 1000;
  }
  .p-top-movie__modal.active {
    display: block; /* activeクラスが追加されたら表示 */
  }
  .p-top-movie__modal--close {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 30px;
    height: 30px;
    background-color: #fff;
    color: #222;
    cursor: pointer;
    z-index: 1001;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: bold;
  }
  .p-top-movie__bg {
    background: none;
  }
  .p-top-movie__bg.active {
    position: absolute;
    content: "";
    background: rgba(0, 0, 0, 0.6);
    left: 0;
    top: 0;
    width: 100vw;
    height: 100%;
    z-index: 3;
  }
  .p-top-movie__play {
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 10px;
    -moz-column-gap: 10px;
    column-gap: 10px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 27px;
  }

.youtube-modal.active {
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999999;
}
.p-top-movie__thumb{
	cursor:pointer;
}
 
 
/* =================

20250913TOP改修

======================== */
/* =========
フローティングバナー
=======================*/
.bl_floatingBanner{
  top: 430px;
  right: 5px;
}
.bl_floatingBanner_close{
  right: 10px;
  top: -20px;
}
@media (max-width:960px){
  .bl_floatingBanner{
    right: 2px;
  }
}
/* =========
共通css
=======================*/
main {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}
section,
.section-wrap{
  padding: 0;
}
section > h1,
section > h2{
  font-weight: 400;
}
.top-course-lineup h1,
.top-event-information h1 {
  font-size: 3rem;
  font-weight: 400;
}
.heading-sub-text {
  font-family: "Tangerine", cursive;
  font-size: 2.5rem;
  line-height: 1;
  color: #000000;
}
h1 {
  display: block;
  font-size: 2.8rem;
  font-weight: 400;
  margin-top: 2rem;
  line-height: 1;
}
.top-course-lineup h1,
.top-event-information h1 {
  font-size: 2.8rem;
}
h1 ~ p.title-lead{
  font-size: 1.4rem;
  line-height: 1.5;
  margin-top: 2rem;
}
@media screen and (min-width: 768px) {
  .heading-sub-text {
    font-size: 3.5rem;
  }
  .top-course-lineup h1,
  .top-event-information h1 {
    font-size: 4.0rem;
    margin-top: 40px;
  }
  section:not(.top-course-lineup):not(.top-event-information) h1{
    margin-top: 30px;
  }
  section:not(.top-course-lineup):not(.top-event-information) h1 span{
    font-size: 4rem;
  }
  h1 ~ p.title-lead{
    font-size: 1.6rem;
  }
}
.top-link-area a:not([class]) {
  margin: 1rem auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  height: 100%;
  background: #000;
  position: relative;
  z-index: 1;
  transition: 0.3s ease-in-out;
  border: solid #000 1px;
  border-radius: 8px;
  width: 23.5rem;
  font-size: 1.3rem;
}
.guide-item a span,
.top-link-area a:not([class]) span{
  position: relative;
  display: inline-flex;
  align-items: center;
  vertical-align: bottom;
  padding: 0;
  font-size: 1.3rem;
  letter-spacing: 0.1em;
  line-height: 1;
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .top-link-area a:not([class]) {
    margin: 0 auto;
    font-size: 1.6rem;
  }
  .guide-item a span {
    font-size: 16px;
    align-items: inherit;
  }
}
.guide-item a span:before,
.top-link-area a:not([class]):before,
.top-news .section-inner .news-item a:before,
.top-event-information a:not([class]) span:before,
.visitor-list a:before,
.to-more:before,
.guide-item a span:after,
.top-link-area a:not([class]):after,
.top-news .section-inner .news-item a:after,
.visitor-list a:after,
.to-more:after {
  content: "";
  display: inline-block;
}

.guide-item a span:before,
.top-link-area a:not([class]):before,
.top-news .section-inner .news-item a:before,
.top-event-information a:not([class]) span:before,
.visitor-list a:before,
.to-more:before {
  border-radius: 50%;
  background-color: #ffffff;
  transition: 0.3s ease-out;
  width: 1.5rem;
  height: 1.5rem;
  left: 0;
  margin-right: 1rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .guide-item a span:before,
  .top-link-area a:not([class]):before,
  .top-news .section-inner .news-item a:before,
  .top-event-information a:not([class]) span:before,
  .visitor-list a:before,
  .to-more:before {
    width: 22px;
    height: 22px;
    margin-right: 15px;
  }
}
.guide-item a span:after,
.top-link-area a:not([class]):after,
.top-news .section-inner .news-item a:after,
.top-event-information a:not([class]) span:after,
.visitor-list a:after,
.to-more:after {
  position: absolute;
  top: 47.5%;
  left: 0.4rem;
  width: 0.5rem;
  height: 0.5rem;
  -webkit-transform: translateY(-50%) rotate(45deg);
  transform: translateY(-50%) rotate(45deg);
  border-top: 0.1rem solid #001446;
  border-right: 0.1rem solid #001446;
}

.guide-item a[target=_blank]:not([href$=pdf])::after{
    content: "";
    display: inline-block;
    width: .75em;
    height: .75em;
    position: relative;
    top: 0.2em;
    right: -0.5em;
    background: url(../images/icon/blank.png) no-repeat;
    background-size: contain;
}

.top-link-area a:not([class]):after{
  left: 32.5%;
  top: 50%;
}
@media screen and (min-width: 768px) {
  .guide-item a span:after,
  .top-link-area a:not([class]):after,
  .top-news .section-inner .news-item a:after,
  .top-event-information a:not([class]) span:after,
  .visitor-list a:after,
  .to-more:after {
    width: 7px;
    height: 7px;
    left: 6px;
    top: 50%;
  }
  
.top-link-area a:not([class]):after{
    left: 35.2%;
  }
}
.to-more,
.to-more:link,
.to-more:visited {
  width: 23.5rem;
  margin-top: 2rem;
  display: inline-flex;
  justify-content: center;
  text-decoration: none;
  padding: .75em 1.5em;
  border: solid 1px;
  border-radius: 8px;
  font-size: 1.3rem;
  align-items: center;
  line-height: 2;
}
.to-more:before{
  opacity: 0;
}
.to-more:after{
  left: 7.6rem;
}
.to-more:hover:before,
.to-more:active:before{
  opacity: 1;
}

@media screen and (min-width: 768px){
  .to-more,
  .to-more:link,
  .to-more:visited {
    margin-top: 40px;
    min-width: 36rem;
    font-size: 1.6rem;
  }
  .to-more:after{
    left: 12.6rem;
  }
}
.experience-school-swiper a:hover,
.visitor-list a:hover,
.top-sns_body > .banner a:hover img,
.p-top-movie__thumb:hover{
  opacity: 0.75;
}
/* ============
KV下バナー
==================== */
.top-information{
  padding-bottom: 5rem;
}
@media screen and (min-width: 768px){
  .top-information{
    padding-bottom: 7rem;
  }
}
/* =============
学科・コース
=================== */
.top-course-lineup{
  margin-bottom: 0;
  padding-top: 7rem;
  padding-bottom: 7rem;
}
.top-course-lineup .section-inner{
  padding-top: 3.5rem;
}
.top-course-lineup .section-inner::before{
  display: none;
}
.top-course-lineup_body:not(:first-child){
  margin-top: 3rem;
}
@media (min-width: 768px){
  .top-course-lineup{
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
  .top-course-lineup p.title-lead{
    font-size: 1.6rem;
  }
  .top-course-lineup_body{
    width: 97%;
  }
  .top-course-lineup_body:nth-of-type(2n){
    margin-left: auto;
    transform: unset;
  }
  .top-course-lineup_body:not(:first-child){
    margin-top: 4.5rem;
  }
  .course-lineup_item{
    width: 50%;
  }
  .course-lineup_item > a{
    width: 66%;
    max-width: 600px;
    margin-left: auto;
    padding: 3.2%;
  }
  .top-course-lineup_body:nth-of-type(2n) .course-lineup_item > a{
    margin-right: auto;
  }
  .top-course-lineup_img{
    max-width: 660px;
    width: 36%;
  }
}
@media (min-width: 768px) and (max-width: 1410px){
  .top-course-lineup_img img{
    height: 23.571vw;

  }
  .course-lineup_item > a{
    max-width: 35.714vw;
    min-width: 35.714vw;
  }
  .course-lineup_item h2{
    font-size: clamp(16px, 2.143vw, 30px);
  }
  .course-lineup_item h2:before{
    width: 1.714vw;
    height: 1.714vw;
  }
  .course-lineup_item h2::after{
    width: 0.571vw;
    height: 0.571vw;
    right: 0.714vw;;
    transform: translateY(calc(-2px - ( (1400px - 100vw) * 0.00475 ))) rotate(45deg);
  }
  .course-lineup_item p{
    font-size: clamp(10px, 1.143vw, 16px);
  }
  .top-course-lineup_body dt,
  .course-lineup_item dd li span{
    font-size: clamp(10px, 1vw, 14px);
  }
}
/* =============
近隣校
=================== */
.area-school{
  padding-top: 7rem;
  padding-bottom: 7rem;
  background: #f9f2e0;
}
.area-school h1{
  line-height: 1.3;
}
@media (min-width: 768px){
  .area-school{
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
  .area-school h2{
    font-size: 2.6rem;
  }
  .area-school p.title-lead{
    font-size: 1.8rem;
  }
}
/* =============
お知らせ
=================== */
.top-news{
  background: #f7f7f9;
  padding-top: 7rem;
  padding-bottom: 7rem;
}
.top-news .section-inner{
  padding: 3rem 0 1rem;
}
.top-news .section-inner::before{
  display: none;
}
.top-news .section-inner .news-item a{
  padding: 1rem 40px 1rem 0;
  border-bottom: 1px dashed #ddd;
  transition: 0.3s ease-out;
}
.top-news .section-inner .news-item a:hover{
  opacity: 0.3;
}
.news-item_head time{
  font-size: 1.4rem;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}
.news-item_head span[class^="icon"]{
  font-size: 1.3rem;
  padding: 0 0.5rem;
}
.top-news .section-inner .news-item a p{
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  font-size: 1.6rem;
}
.news-item:first-child a{
  border-top: 1px dashed #ddd;
}
.top-news .section-inner .news-item a:before{
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 0.5rem;
  left: auto;
}
.top-news .section-inner .news-item a:after{
  left: auto;
  right: 1.1rem;
  top: 50%;
}
#news_overview-hidden.top-link-area{
  margin: 0 auto;
  display: block;
}
.top-news #news_student-hidden a{
  margin: 2rem auto 0;
  height: auto;
  font-size: 1.3rem;
}
#news_student-hidden.top-link-area{
  margin: 3rem auto 0;
  gap: 0;
}
#news_overview-hidden.top-link-area + #news_student-hidden.top-link-area{
  margin: 4rem auto 0;
  gap: 0;
}
.top-news #news_student-hidden.top-link-area a:not([class]):after{
  left: 21.5%;
}
@media screen and (min-width: 768px){
  .top-news{
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
  .top-news h1{
    margin: 30px auto 60px;
  }
  .top-news .section-inner{
    padding: 0;
  }
  .top-news .section-inner .news-item a{
    padding: 2.4vh 110px 2.4vh 0;
  }
  .news-item_head time,
  .news-item_head span,
  .news-item_head span[class^="icon"]{
    font-size: 14px;
  }
  .top-news .section-inner .news-item a p{
    font-size: 16px;
  }
  .top-news .section-inner .news-item a:after{
    right: 1.4rem;
  }
  #news_overview-hidden.top-link-area + #news_student-hidden.top-link-area{
    margin: 60px auto 0;
  }
  .top-news #news_student-hidden.top-link-area a:not([class]):after{
    left: 26.5%;
  }
  .top-news #news_student-hidden.top-link-area a:not([class]){
    font-size: 1.6rem;
    margin: 40px auto 0;
  }
}
/* =============
オープンキャンパス
=================== */
@keyframes gradient {
  0% {
    background-position: 0 0;
  }
  50% {
    background-position: 100% 0;
  }
  to {
    background-position: 0 0;
  }
}
.top-oc{
  background-image: linear-gradient(125deg, #a3e1be, #d0e5ed)!important;
  background-size: 200% 100%;
  animation: gradient 10s cubic-bezier(0.445, 0.05, 0.55, 0.95) infinite;
  padding-bottom: 7rem;
  padding-top: 7rem;
}
.top-event-information,
.area-school.experience,
.area-school.experience h2{
  background-color: unset !important;
}
.top-event-information{
  padding-bottom: 0;
  padding-top: 0;
}
.top-event-information h2{
  font-size: 1.8rem;
}
.top-event-information p.title-lead{
  font-size: 1.4rem;
  line-height: 1.5;
}
.top-event-information .event-catch-text{
  margin: 2.5rem auto;
  max-width: 30rem;
  gap: 1rem;
}
.top-event-information .event-catch-text::before{
  display: none;
}
.event-catch-text span{
  font-size: 1.2rem;
  width: 100%;
  padding: 1em 0;
  line-height: 1;
}
.top-event-information .top-link-area{
  margin: 0 auto;
}
.top-event-information .top-link-area a:not([class]){
  width: 30rem;
  background-color: #fff;
  color: #101112;
  text-align: center;
  min-height: 7rem;
  margin: 0 auto;
  padding: 0 1.5rem;
  justify-content: unset;
}
.top-event-information .top-link-area a:not([class]):after{
  content: "";
  display: block;
  width: 3.3rem;
  height: 2.5rem;
  background-image: url(../../assets/images/icon/icon-schedule.png);
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  transform: unset;
  opacity: unset;
  left: auto;
  border: none;
}
.top-event-information .top-link-area a:not([class]) span{
  font-size: 2rem;
}
.top-event-information .top-link-area a:not([class]) span:before{
  opacity: 0;
}
.top-event-information .top-link-area a:not([class]) span:after{
  background-color: unset;
}
.top-event-information .top-link-area a:not([class]):hover{
  opacity: 1;
  background: var(--site-point-color);
}
.top-oc .area-school{
  padding-top: 5rem;
  padding-bottom: 0;
}
.experience p{
  font-size: 1.4rem;
} 
@media screen and (min-width: 768px){
  .top-oc{
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
  .top-oc .area-school{
    padding-top: 8rem;
  }
  .top-event-information p.title-lead{
    font-size: 1.6rem;
    margin-top: 40px;
  }
  .top-event-information .event-catch-text{
    margin: 40px auto 30px;
  }
  .event-catch-text span{
    font-size: 1.8rem;
  }
  .top-event-information .top-link-area a:not([class]){
    min-height: 9rem;
    padding: 0 50px;
    max-width: 100%;
    width: 68.4rem;
  }
  .top-event-information .top-link-area a:not([class]) span{
    font-size: 2.2rem;
  }
  .top-event-information .top-link-area a:not([class]):after{
    width: 5.8rem;
    height: 4.5rem;
  }
  .experience p{
    font-size: 1.6rem;
  }
}
/* =============
訪問者別
=================== */
.top-visitor-guide .visitor-guide-area{
  padding: 0 1rem;
  background: #f9f2e0;
}
.top-visitor-guide .section-inner{
  padding: 7rem 0;
}
.top-visitor-guide .section-inner::before{
  display: none;
}
.visitor-list a{
  display: inline-flex;
  justify-content: center;
  background-size: 10rem auto;
}
.visitor-list{
  padding: 0;
}
.visitor-list a::before{
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 12.1rem;
}
.visitor-list a::after{
  background-color: unset;
  top: 50%;
  left: 12.5rem;
}
.visitor-item{
  padding: 0 0 0 15rem;
}
.top-visitor-guide div[class*="banner"]{
  padding-top: 7rem;
  background: #f7f7f9;
  max-width: 100%;
}
.top-visitor-guide div[class*="banner"]:last-child{
  padding-top: 5rem;
  padding-bottom: 7rem;
}
.top-visitor-guide div[class*="banner"] a{
  display: block;
  max-width: var(--width);
  margin: 0 auto;
}
@media screen and (min-width: 768px){
  .top-visitor-guide .section-inner{
    padding: 10rem 0;
  }
  .visitor-list a{
    background-size: auto 100%;
  }
  .visitor-item{
    min-height: 14rem;
    text-align: left;
    align-items: flex-start;
    padding: 0 0 0 21rem;
  }
  .visitor-list a::before{
    left: 17.3rem;
  }
  .visitor-list a::after{
    left: 18rem;
  }
  .top-visitor-guide div[class*="banner"]{
    padding-top: 100px;
  }
  .top-visitor-guide div[class*="banner"]:last-child{
    padding-top: 6rem;
    padding-bottom: 100px;
  }
}
.visitor-list a[target=_blank]:not([href$=pdf]) .visitor-item span::after{
	content: "";
	display: inline-block;
	width: .75em;
	height: .75em;
	position: relative;
	right: -0.5em;
	background: url(../images/icon/blank.png) no-repeat;
	background-size: contain;
}
/* =============
入学案内以下共通css
=================== */
.top-guide {
  padding: 7rem 1rem;
}
.top-guide .guide-list {
  padding: 3rem 0 2.5rem;
  margin: 0 auto;
  max-width: 1280px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.top-guide .guide-list .guide-item {
  flex: 0 1 100%;
  border-bottom: 1px dashed #898989;
  margin: 0;
}
.top-guide .guide-list .guide-item:first-child {
  border-top: 1px dashed #898989;
}
.top-guide .guide-list .guide-item a {
  width: 100%;
  background: none;
  margin: 0;
  padding: 1.5rem 1.3rem;
  border: none;
  display: block;
}
.top-guide .guide-list .guide-item a:before {
  display: none;
}
.top-guide .guide-list .guide-item a span {
  margin: 0;
  font-size: 1.6rem;
  padding-left: 3.2rem;
  line-height: 1.5;
}
.top-guide .guide-list .guide-item a span:before {
  position: absolute;
  width: 2.2rem;
  height: 2.2rem;
  top: 50%;
  transform: translateY(-50%);
}
.top-guide .guide-list .guide-item a span:after{
  width: 0.7rem;
  height: 0.7rem;
  top: 50%;
  left: 0.6rem;
}
.top-guide .guide-list .guide-item a:hover{
        opacity: 0.3;
}
.top-guide .top-link-area{
  display: flex;
  gap: unset;
  margin: 0 auto;
}
/* 項目が2行になるとき */
.top-guide .guide-list .guide-item a .two-line-character {
  display: block;
  text-align: left;
}
.top-guide .guide-list .guide-item a .two-line-character span {
  padding-left: 0;
}
.top-guide .guide-list .guide-item a .two-line-character span:before,
.top-guide .guide-list .guide-item a .two-line-character span:after{
  display: none;
}
.top-guide .guide-list .guide-item a span span:before,
.top-guide .guide-list .guide-item a span span:after {
  display: none;
}
/* 項目のフォントサイズが2種類あるとき */
.top-guide .guide-list .guide-item a .two-font-sizes{
  align-items: baseline;
}
.top-guide .guide-list .guide-item a .two-font-sizes span {
  font-size: 1.2rem;
  display: inline-block;
  padding-left: 0;
}
@media screen and (min-width: 768px) {
  .top-guide {
    padding: 100px 20px;
  }
  .top-guide .guide-list {
    padding: 60px 0 40px;
    display: flex;
    flex-wrap: wrap;
    max-width: 700px;
    align-items: stretch;
  }
  .top-guide .guide-list .guide-item {
    flex: 0 2 50%;
    display: flex;
    align-items: center;
  }
  .top-guide .guide-list .guide-item:nth-child(2) {
    border-top: 1px dashed #898989;
  }
  .top-guide .guide-list .guide-item a {
    padding: 30px 0;
  }
  .top-guide .guide-list .guide-item a span {
    font-size: 18px;
    padding-left: 47px;
  }
  .top-guide .guide-list .guide-item a span:before {
    width: 32px;
    height: 32px;
  }
  .top-guide .guide-list .guide-item a span:after {
    width: 10px;
    height: 10px;
    left: 9px;
  }
  .top-guide .top-link-area .guide-item a {
    padding: 20px 10px;
  }
  /* 項目が奇数の時 */
  .top-guide .guide-list.odd-item{
    border-bottom: 1px dashed #898989;
        padding: 60px 0 0;
  }
        .top-guide .guide-list.odd-item + .top-link-area{
                margin-top: 40px;
        }
  .top-guide .guide-list .guide-item.no-border {
    border: none;
  }
  /* 項目が奇数の時ここまで */
  /* 項目が1つの時 */
  .top-guide .guide-list.single-item{
    border-top: 1px dashed #898989;
        padding: 0;
    margin: 60px auto 0;
  }
        .top-guide .guide-list.single-item + .top-link-area{
                margin-top: 40px;
        }
  /* 項目が1つの時ここまで */
  /* 項目のフォントサイズが2種類あるとき */
  .top-guide .guide-list .guide-item a .two-font-sizes span {
    font-size: 14px;
  }
}
/* =============
入学案内
=================== */
.top-admission {
  background-color: #e2eaf0;
}
/* =============
学費サポート
=================== */
.top-support {
  background-color: #f9f2e0;
}
/* =============
キャンパスライフ
=================== */
.top-campuslife {
  position: relative;
  /* background-color: #f7f7f9; */
  background-color: #f9f2e0; /* 20251222 一時的な対応 */
}
.top-campuslife .guide-list{
  padding-bottom: 0;
}
/* =============
SNS
=================== */
.top-sns {
  padding: 7rem 2rem;
  position: relative;
  background: #e2eaf0;
}
/*.top-sns_body > .banner img{
  width: 6rem;
}
.round-btn div.round-btn-name{
  font-weight: normal;
  background: none;
  border: none;
  border-radius: 25px;
  box-shadow: none;
  width: auto;
  font-size: 1rem;
  line-height: 1;
  height: auto;
  margin: 1.5rem auto 0;
}
@media screen and (min-width: 768px){
  .top-sns{
    padding: 100px 20px;
  }
  .top-sns_body{
    margin-top: 50px;
  }
  .round-btn div.round-btn-name{
    font-size: 1.4rem;
  }
} */
/* =============
アクセス
=================== */
.top-access {
  padding: 7rem 0;
  background: #f9f2e0;
}
.top-access .section-inner {
  margin: 30px auto auto;
  padding: 0 1rem;
}
.top-access .section-inner::before{
  display: none;
}
.top-access h3 {
  font-size: 2.0rem;
  line-height: 1.5;
  text-align: center;
  letter-spacing: 0.06em;
  font-weight: 400;
}
.top-access p,
.top-access li{
  font-size: 1.6rem;
}
.top-access li span{
  text-decoration: none;
}
.top-access .top-link-area{
  display: flex;
  gap: unset;
  margin: 1.5rem auto 0;
}

@media screen and (min-width: 768px) {
  .top-access {
    padding: 100px 20px;
  }
  .top-access .section-inner {
    margin: 50px auto 0;
  }
  .top-access .section-inner h3 {
    font-size: 26px;
  }
  .top-access p, .top-access li{
    font-size: 1.6rem;
  }
  .top-access .section-inner .p-access__address-area {
    margin-top: 30px;
    font-size: 16px;
    line-height: 2;
    letter-spacing: 0.04em;
  }
  .top-access .top-link-area{
    margin: 3rem auto 0;
  }
}
/* =============
インフォーメーション
=================== */
.top-information-guide {
  background: #f7f7f9;
}
/* =============
教育実績
=================== */
.top-achievement {
  background: #e2eaf0;
}
.top-achievement .guide-list{
  padding-bottom: 0;
}
/* YouTube */
.top-special-movie{
  padding: 7rem 0;
  position: relative;
  background: none;
}
.top-special-movie:before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(135deg, rgb(249, 242, 224), rgb(249, 242, 224) 3px, transparent 3px, transparent 6px);
    background-size: auto auto;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
/* section.top-special-movie h1{
  font-size: 1.8rem;
} */
@media screen and (min-width: 768px){
  .top-special-movie{
    padding: 100px 0 ;
  }
  .top-special-movie:before{
    background: repeating-linear-gradient(135deg, #f9f2e0, #f9f2e0 2px, transparent 2px, transparent 4.8px);
  }
  /* section.top-special-movie.top-special-movie h1{
    font-size: 26px;
  } */
  .top-special-movie .youtube{
    padding-top: 60px;
  }
}

.top-event-information .top-link-area a:not([class]):before{
  visibility: hidden;
}