@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");

/*---------

bg setting

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

:root{
	--bg-top-green: rgb(200, 229, 174); /* c8e5ae */
    --bg-top-gray: rgb(232, 237, 238); /* e8edee */
    --top-site-color: rgba(56, 198, 241, 1); /* 38c6f1 */
}

/*--- course color set
----------------------------**/

.civil-servant{
    --top-theme-color : rgba(092, 160, 167, 1); /* 00b2e5 */
    --top-border-color: rgba(169, 213, 246, 1); /* f8db94 */
    --top-bg-color    : rgba(239, 246, 230, 1); /* fad4c1 */
}

.police-firefighter{
    --top-theme-color : rgba(106, 163, 102, 1); /* 00b2e5 */
    --top-border-color: rgba(255, 220, 114, 1); /* f8db94 */
    --top-bg-color    : rgba(216, 223, 241, 1); /* fad4c1 */
}

.business{
    --top-theme-color : rgba(000, 178, 229, 1); /* 00b2e5 */
    --top-border-color: rgba(255, 220, 114, 1); /* f8db94 */
    --top-bg-color    : rgba(216, 223, 241, 1); /* fad4c1 */
}

.accountant{
    --top-theme-color : rgba(073, 098, 163, 1); /* 4962a3 */
    --top-border-color: rgba(236, 191, 244, 1); /* ecbff4 */
    --top-bg-color    : rgba(255, 232, 231 , 1); /* ffe8e7 */
}

.it{
    --top-theme-color : rgba(054, 145, 109, 1); /* 36916d */
    --top-border-color: rgba(210, 235, 232, 1); /* f8db94 */
    --top-bg-color    : rgba(248, 219, 193, 1); /* fad4c1 */
}

.sports{
    --top-theme-color : rgba(255, 174, 000, 1); /* 36916d */
    --top-border-color: rgba(254, 203, 066, 1); /* fecb42 */
    --top-bg-color    : rgba(248, 234, 255, 1); /* f8eaff */
}

.daigaku{
    --top-theme-color :rgba(185, 99, 164, 1);/* #b963a4 */
    --top-border-color: rgba(173, 215, 249, 1);
    --top-bg-color: rgba(247, 240, 246, 1);
}

.top-event-banner{
    background-size: auto auto;
    background-color: rgba(255, 255, 255, 1);
    background-image: repeating-linear-gradient(135deg, transparent, transparent 4px, var(--bg-site-main-gray) 4px, var(--bg-site-main-gray) 8px);
}

.top-information,
.top-course-lineup,
.area-school{ background-color: var(--bg-top-green);}

.top-campus-life{ background-color: var(--bg-top-gray);}
.top-event-information{ background-color: var(--bg-top-gray);}
.top-access{ background-color: rgb(228, 242, 215); padding-top: 5rem;} /* e4f2d7 */

.top-news{ background: url(../images/bg_pattern.png) repeat left top;}
.top-sns{ background-color: #edf7fb;}

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


@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: 7.2rem;}
}

/*---------

title & p

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

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

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

    section:not(.top-course-lineup):not(.top-event-information) 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,
    .top-course-lineup_body h2,
    .campus-item h2{
      font-size: 2.0rem;
      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: 4.0rem;}

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

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

	section > h2{ font-size: 2.6rem;}
    .top-course-lineup_body h2{ font-size: 3.2rem;}
    .campus-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: 'Spartan', sans-serif;
    font-size: 1.2rem;
    line-height: 1.0;
    display: flex;
    padding: 0 .5em;
    position: relative;
    place-content: center;
    place-items: center;
}

/* .heading-sub-text span::before,
.heading-sub-text span::after{
    content: "";
    display: inline-block;
    width: 1.6rem;
    height: .1rem;
    background-color: #000;
    transform: translateY(-.2rem);
}

.heading-sub-text span::before{ margin-right: .5em;}
.heading-sub-text span::after{ margin-left: .5em;} */

@media (min-width:768px){

    .heading-sub-text{ margin-top: 1em;}
    .heading-sub-text span{ font-size: 1.8rem;}
        /* .heading-sub-text span::before,
    .heading-sub-text span::after{ width: 2.4rem; transform: translateY(-.3rem);} */
}

/*---------

key-visual

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

.KvSwiperWrap{
    width: 100%;
    background-image: url(../images/bg-kv_sp.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
}

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

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

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

    .KvSwiper .swiper-slide{ width: 100%;}
}

@media (min-width:1024px){

    .KvSwiperWrap{
        width: 100vw;
        max-height: 54rem;
        background-image: url(../images/bg-kv_pc.png);
    }

    .KvSwiper .swiper-horizontal >.swiper-pagination-bullets,
    .KvSwiper .swiper-pagination-bullets.swiper-pagination-horizontal{ bottom: -3.2rem;}
    .KvSwiperWrap .swiper.swiper-horizontal{ width: 110rem; max-width: 110rem;}
}

/*---------

information

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

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

@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: var(--width);
    margin: 0 auto;
    display: grid;
    grid-auto-rows: 1fr;
    grid-template-columns: repeat(2 , 49%);
    gap: 1rem;
    justify-content: space-between;
}*/

.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;
    }
}

/*---------

top section

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

.top-course-lineup_body{
    max-width: var(--width);
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.top-course-lineup_body:not(:first-child){ margin-top: 3.2rem;}

.top-course-lineup_body::after{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    min-height: 20rem;
    background-color: rgba(255, 255, 255, 1);
    -webkit-mask-image: url("../images/bg_dot.png");
    mask-image: url("../images/bg_dot.png");
    position: absolute;
    top: 1.4rem;
    left: 2.4rem;
    z-index: -1;
}

.top-course-lineup_body a{
    min-height: 28rem;
    padding-bottom: 6.4rem;
    border: 2px solid #000;
    display: grid;
    grid-template-columns: 1fr 17rem;
    grid-template-rows: auto 1fr;
}

.top-course-lineup_body h2{
    min-height: 5rem;
    padding-left: 2rem;
    background-color: #FFF;
    border-bottom: 2px solid #000;
    display: grid;
    align-content: center;
    grid-column: 1 / 3;
}

.course-lineup_item{ padding-top: 1rem;}
.course-lineup_item p{ margin-bottom: 1em;}
.course-lineup_item dl{ max-width: 46rem;}

.course-lineup_item dd li{
    font-weight: 600;
    line-height: 1.4;
    padding-right: 1em;
    margin-left: .8em;
    position: relative;
}

.course-lineup_item dd li:before{
    content: "";
    width: .2rem;
    height: 1em;
    position: absolute;
    left: -.5em;
}

.top-course-lineup_img{
    width: 18rem;
    height: 100%;
    position: absolute;
    overflow: hidden;
}

.top-course-lineup_img img{
    object-fit: contain;
    z-index: 1;
}

.top-course-lineup_img::after{
    content: "";
    display: block;
    width: 14rem;
    height: 14rem;
    border-width: .1rem;
    border-style: solid;
    position: absolute;
    right: 2.4rem;
}

.to-detail{
    color: #FFF;
    text-align: center;
    position: absolute;
    left: 50%;
    bottom: 1.4rem;
    box-sizing: border-box;
    transform: translateX(-50%);
    z-index: 5;
}

/*--- course lineup hover
----------------------------**/

.top-course-lineup_body a{
    background-color: rgba(255, 254, 131, 1); /* fffe83 */
    background-image: linear-gradient(90deg, rgba(255, 254, 131, 1) 0%, rgba(255, 254, 131, 1) 50%, rgba(253, 252, 102, 1) 50%, rgba(255, 255, 255, .8) 100%);
    transition: .3s;
    background-size: 200% 100%;
}
.top-course-lineup_body a:hover{ background-position: 100% 0;}

/*--- course lineup body color set
----------------------------**/

.top-course-lineup_body .top-course-lineup_img::after{ border-color: var(--top-border-color); background-color: var(--top-bg-color);}
.top-course-lineup_body dt{ color: var(--top-theme-color);}
.top-course-lineup_body dt span{
	display: inline-block;
	padding-right: 0.7em;
	margin-right: 0.7em;
	position: relative;
}

.top-course-lineup_body dt span::after{
	content: '';
	background: var(--top-theme-color);
	display: block;
	width: 1px;
	height: 1.1em;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
}
.top-course-lineup_body .to-detail{ background-color: var(--top-theme-color);}
.course-lineup_item dd li:before{ background-color: var(--top-theme-color);}

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

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

    .top-course-lineup_body h2{ text-align: center;}

    .top-course-lineup_body::after{
        -webkit-mask-size: 4.8%;
        mask-size: 4.8%;
    }

    .course-lineup_item{
        padding-left: 1rem;
        z-index: 1;
    }

    .course-lineup_item p{ font-size: 1.2rem;}
    .course-lineup_item dl{ font-size: 1rem;}
    .course-lineup_item dd li:before{ top: .3em;}
    .course-lineup_item dd span{ font-size: 1.2rem;}

    .top-course-lineup_img{ bottom: 0; right: -.6rem;}
    .top-course-lineup_img img{
        width: 16.8rem;
        height: 18.6rem;
        position: absolute;
        top: 10.4rem;
        right: 0;
        transform: translateY(-5.2rem);
    }

    .top-course-lineup_img::after{ top: 24%;}

    .to-detail{
        width: calc(100% - 2rem);
        font-size: 1.4rem;
        line-height: 3.8rem;
    }
}

@media (min-width: 768px){

    .top-course-lineup_body::after{
        width: 100%;
        height: 100%;
        max-width: 102rem;
        min-height: 26.4rem;
    }

    .top-course-lineup_body h2{ min-height: 6.4rem;}

    .top-course-lineup_body > a{
        min-height: 26rem;
        grid-template-columns: 1fr 32rem;
        grid-template-rows: auto 1fr;
        padding-bottom: 4rem;
    }

    .course-lineup_item{ padding-left: 2rem;}
    .course-lineup_item dl{ font-size: 1.4rem;}
    .course-lineup_item dd li{ display: inline-block;}
    .course-lineup_item dd li:before{ top: .2rem;}

    .top-course-lineup_img{
        width: 25rem;
        bottom: 0;
        right: 4rem;
    }

    .top-course-lineup_img img{
        position: relative;
        width: 25rem;
    }

    .top-course-lineup_img::after{
        width: 22rem;
        height: 22rem;
        top:5.4rem;
    }

    .to-detail{
        width: 14rem;
        line-height: 4rem;
        bottom: 0;
    }
}

/*---------

event information

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

.top-event-information{ position: relative;}

.top-event-information::before,
.top-event-information::after{
    content: "";
    display: block;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: -1;
}

.top-event-information::before{ background-image: url(/assets/images/bg_event01.png);}
.top-event-information::after { background-image: url(/assets/images/bg_event02.png);}

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

.event-catch-text{
    display: grid;
    max-width: 88.4rem;
    margin: 2rem auto 0;
    grid-auto-rows: minmax(3em, 1fr);
    place-content: center;
    place-items: center;
}

.event-catch-text span{
    font-size: 1.4rem;
    width: 170px;
    background-color: rgba(255, 239, 0, 1);
    text-align: center;
    padding: .25em;
    color: rgba(19, 113, 242, 1); /* 1371f2 */
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

/*--- 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%);
    }

    .top-event-information::before,
    .top-event-information::after{
        width: 12rem;
        height: 16rem;
        /*bottom: 18rem;*/
        bottom: 22rem;
        background-size: cover;
    }

    .top-event-information::before{ left: -2%;;}
    .top-event-information::after { right: -8%;}
}

@media (min-width:768px){

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

    .event-catch-text span{
        width: 100%;
        padding: .25em;
        font-size: 1.8rem;
        text-align: center;
        background-color: rgba(255, 239, 0, 1); /* ffef00 */;
    }

    .top-event-information::before,
    .top-event-information::after{
        width: 23rem;
        height: 30rem;
        left: 50%;
        bottom: 0;
        background-size: cover;
    }

    /*.top-event-information::before{ transform: translateX(-200%);}
    .top-event-information::after { transform: translateX(116%);}*/
    .top-event-information::before{ transform: translateX(-203%);}
    .top-event-information::after { transform: translateX(118%);}
}

/*---------

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 .result-banner img{ border: .2rem solid #000; box-sizing: content-box;}

.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;
    border: .2rem solid #000;
    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-item{
    width: 100%;
    height: 100%;
    padding: 0% 34% 0 0%;
    position: absolute;
}

.campus-item p{
    font-size: 1.2rem;
    line-height: 1.8;
    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: 1.6rem;
        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-item{ padding: 0;}
    .campus-item p{ font-size: 1.8rem; padding: 5% 8%;background: rgb(255 255 255 / 80%);min-height: 165px;}
}

/*--- campus life bg
----------------------------**/

.top-campus-life{ position: relative;}
.top-campus-life .section-inner::before,
.top-campus-life .section-inner::after{
    content: "";
    display: block;
    height: 24rem;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: -2;
    top: 4%;
}

.top-campus-life .section-inner::before{
    width: 12.8rem;
    left: -2%;
    background-image: url(../images/bg_campus01.png);
}

.top-campus-life .section-inner::after{
    width: 20rem;
    right: -12%;
    background-image: url(../images/bg_campus02.png);
}

@media (min-width:768px){
    
    .top-campus-life .section-inner::before,
    .top-campus-life .section-inner::after{
        width: 24rem;
        height: 38rem;
    }

    .top-campus-life .section-inner::before{
        top: -6%;
        left: 50%;
        transform: translateX(-184%);
    }
    
    .top-campus-life .section-inner::after{
        width: 34rem;
        top: -8%;
        left: 48%;
        transform: translateX(35%);
    }
}

@media (min-width:1024px){
     .top-campus-life .section-inner::after{
        width: 38rem;
        top: -8%;
        left: 48%;
        transform: translateX(72%);
     }
}

/*---------

admission info

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

.top-admission-info ul{
    max-width: var(--width-min);
    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;**/
}

.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;
}

.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 a img{ transition: all .3s;}
.top-sns_body > .banner a:hover img{ filter: drop-shadow(-.2rem -.2rem .6rem rgba(0, 0, 0, 0.2));}

.top-sns_body ~ .youtube{
    max-width: 68rem;
    padding-top: 2.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{ 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%;}
}

/*---------

access

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

.top-access{ text-align: center;}
.top-access h3:not([class]){ font-size: 1.8rem; margin-bottom: 0.5em;}
.top-access li span{ text-decoration: underline dotted;}


/*---------

information-list

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

.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: .2rem 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;}
}

@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{ transition: all .6s;}

.top-link-area a:not([class]){
    padding: .5em 1.5em;
    color: #FFF;
    background-color: var(--top-site-color);
    border: 2px solid var(--top-site-color);
    border-radius: 4rem;
}

.top-link-area a:not([class]):hover{
    background-color: #FFF;
    color: rgba(0, 162, 230);
}

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

.to-more:hover,
.to-more:active{
    border-color: #FFF;
    filter: drop-shadow(-0.2rem -0.2rem 0.6rem rgba(0, 0, 0, 0.2));
}

a.to-more,
a.to-more:link,
a.to-more:hover,
a.to-more:active,
a.to-more:visited{ text-decoration: none;}

@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;
    border-radius: 4.5rem;
}

.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: #FFF;
    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; background: var(--top-site-color);}

.top-event-information a:not([class])::after{
    content: "";
    display: inline-block;
    width: 6rem;
    min-height: 4.5rem;
    position: absolute;
    top: 50%;
    left: 2em;
    background: url("../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;
        border-radius: 1.5rem;
        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: 60.4rem;
    }
}

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

/*---------

.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: 2px 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%;
    }
 }

 /*-------------------
20240830大原追加 在校生のお知らせ修正
------------------*/

.top-link-area .title-lead{
	font-size: 2.0rem;
	margin-top:20px;
}

@media (min-width:768px) {
	.top-link-area .title-lead{
		font-size: 2.2rem;
	}
}

 /* --------------------------------------
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%;
    }
}

/* ==========================
フローティングバナー（追従バナー）
========================== */
.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);
}

    
.slideinRight {
    animation: slideinRight 3s infinite;
}

@keyframes slideinRight {
    0% {
        transform: translateX(-50px);
    }
    100% {
        transform: translateX(0);
    }
}

.fadeRight{
    animation-name:fadeRightAnime;
    animation-duration:2.0s;
    animation-fill-mode:forwards;
    opacity:0;
}

@keyframes fadeRightAnime{
    from {
        opacity: 0;
        transform: translateX(100px);
    }
    
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* その場で */
.fadeIn{
    animation-name:fadeInAnime;
    animation-duration:2.0s;
    animation-fill-mode:forwards;
    opacity:0;
    }
    
@keyframes fadeInAnime{
    from {
        opacity: 0;
    }
    
    to {
        opacity: 1;
    }
}

.slidein {
    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;
    }
}

.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;
    }
}
/*--------------------
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;
    }
    
}

/* 20250624 */
.civil-servant{
    --top-theme-course-border : rgba(092, 160, 167, .3); /* 00b2e5 */
}

.police-firefighter{
    --top-theme-course-border : rgba(106, 163, 102, .3); /* 00b2e5 */
}

.business{
    --top-theme-course-border : rgba(000, 178, 229, .3); /* 00b2e5 */
}

.accountant{
    --top-theme-course-border : rgba(073, 098, 163, .3); /* 4962a3 */
}

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

.sports{
    --top-theme-course-border : rgba(255, 174, 000, .3); /* 36916d */
}

.daigaku{
    --top-theme-course-border :rgba(185, 99, 164, .3);/* #b963a4 */
}
.top-course-lineup_body h2{
    display: block;
}
.top-course-lineup_body h2 span{
    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 span {
    /* 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 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 {
    margin-top: .5em;
  }
  .heading-sub-text span {
    font-size: 3.4rem;
  }
}
.heading-sub-text {
  font-family: "Tangerine", cursive;
  font-size: 2.5rem;
  line-height: 1;
  color: #1d2f5b;
}
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]) {
  padding: .75em 1.5em;
  color: #FFF;
  background-color: rgba(0, 0, 0, 1);
  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;
}
.top-link-area a:not([class]):hover {
  color: #000;
  background-color: rgba(255, 255, 255);
}
.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 {
  margin: 0 auto;
  text-align: center;
  background-color: #FFF;
  width: 23.5rem;
  margin-top: 2rem;
  display: inline-flex;
  justify-content: center;
  text-decoration: none;
  padding: .75em 1.5em;
  border: 1px solid #000;
  border-radius: 8px;
  font-size: 1.3rem;
  align-items: center;
  line-height: 2;
}
.to-more:hover,
.to-more:active {
  color: #FFF;
  background-color: #000;
}
.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;
  background-color: #dcf0f4;
}
@media screen and (min-width: 768px){
  .top-information{
    padding-bottom: 7rem;
  }
}
body:has(.header-f5) {
  h1, h2, .course-name, .heading-sub-text {
      font-family: 'Noto Sans JP',
        sans-serif;
      font-weight: 500;
  }
}
body:has(.header-f5) {
    section > h1, section > h2 {
        font-weight: 400;
    }
}
.index:has(.header-f5) .title-lead {
    font-family: 'Noto Sans JP',sans-serif;
}
/* =============
学科・コース
=================== */
.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: #f7f7f9;
}
.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: #eff2e4;
  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;
  }
}
body:has(.header-f5) {
  .news-item:first-child a {
    border-top: 1px dashed #ddd;
  }
}
/* =============
オープンキャンパス
=================== */
@keyframes gradient {
  0% {
    background-position: 0 0;
  }
  50% {
    background-position: 100% 0;
  }
  to {
    background-position: 0 0;
  }
}
.top-oc{
  background-image: linear-gradient(125deg, #ffde81, #f3e896)!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{
  width: auto;
  margin: 2.5rem auto;
  max-width: 30rem;
  gap: 1rem;
}
.top-event-information .event-catch-text::before{
  display: none;
}
.event-catch-text span {
  background-color: var(--site-point-color);
  text-align: center;
  border: 1px solid #000;
  font-size: 1.2rem;
  width: 100%;
  padding: 1em 0;
  line-height: 1;
  border-radius: 0;
  color: #000;
  font-weight: 400;
}
.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::before,
  .top-event-information::after{
      width: 27rem;
      height: 36rem;
      left: 50%;
      bottom: -5rem;
  }
  .top-event-information p.title-lead{
    font-size: 1.6rem;
    margin-top: 40px;
  }
  .top-event-information .event-catch-text{
    width: max-content;
    grid-template-columns: repeat(2, minmax(25rem, 1fr));
    grid-auto-rows: minmax(2em, 1fr);
    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;
  }
}
@media not all and (min-width: 768px) {
  .event-catch-text {
    grid-template-columns: repeat(2, 50%);
    grid-auto-rows: minmax(3em, 1fr);
  }
  .top-event-information::before,
  .top-event-information::after{
      bottom: 19rem;
  }
}
/* =============
訪問者別
=================== */
.top-visitor-guide .visitor-guide-area{
  padding: 0 1rem;
  background: #f7f7f9;
}
.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;
  border: 1px solid #000;
}
.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: #eff2e4;
  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: #dbecf1;
}
/* =============
学費サポート
=================== */
.top-support {
  background-color: #f7f7f9;
}
/* =============
キャンパスライフ
=================== */
.top-campuslife {
  position: relative;
  background-color: #eff2e4;
}
.top-campuslife .guide-list{
  padding-bottom: 0;
}
/* =============
SNS
=================== */
.top-sns {
  padding: 7rem 2rem;
  position: relative;
  background: #dbecf1;
}
/* .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: #f7f7f9;
}
.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: #eff2e4;
}
/* =============
教育実績
=================== */
.top-achievement {
  background: #dbecf1;
}
.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, #f7f7f9, #f7f7f9 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, #f7f7f9, #f7f7f9 2px, transparent 2px, transparent 4.8px);
  }
  /* section.top-special-movie.top-special-movie h1{
    font-size: 26px;
  } */
  .top-special-movie .youtube{
    padding-top: 60px;
  }
}
/* @media not all and (min-width: 768px) {
  section.top-special-movie:not(.top-course-lineup):not(.top-event-information) h1{
    font-size: 1.8rem;
  }  
} */
.top-event-information .top-link-area a:not([class]):before{
  visibility: hidden;
}