@charset "UTF-8";


*:has(>wbr) {word-break: keep-all;}

/* 学科に「なるには」と相互リンクするため */
a.naruniha {
    color: #fff;
    font-weight: 700;
    background: #005038;
    padding: 0px 6px;
    border-radius: 10px;
    box-shadow: 0px 2px 2px 0px gray;
}

/* トップ_３つの理由_リンクボタン風のため */

.more-link {
	color: #005038;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
    padding-bottom: 0px;
    gap: 16px;
    border-bottom: 1px solid #e2e2e2;
    font-size: 1.4rem;
    letter-spacing: .03em;
    transition: border-color .3s cubic-bezier(.65,0,.35,1)
}
.more-link .icon-chv {
    flex-shrink: 0
}

/* 学科ページ_職種一覧追加_一部more化のため */

.gakka .gakka-detail__about-record .hidden-view{
    display: none;
}
.gakka .gakka-detail__about-record .button::before {
    content: "＞＞もっと見る";
    color: #023d2b;
	line-height: 3;
}
.gakka .gakka-detail__about-record input[type="checkbox"]#trigger{
    display: none;
}
.gakka .gakka-detail__about-record input[type="checkbox"]#trigger:checked ~ .hidden-view{
    display: block;
}
.gakka .gakka-detail__about-record input[type="checkbox"]#trigger:checked ~ .button::before{
    content: "＞＞閉じる";
    color: #023d2b;
	line-height: 3;
}
.gakka .gakka-detail__about-record dd .sub p, .gakka .gakka-detail__about-record dd .sub p+p {
    text-align: justify;
}

/*--ハンバーガーに高3とAOの画像ボタン設置--*/
.hbg-gazo {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    width: 96%;
    padding: 0;
    margin: 0 auto;
}
.hbg-gazo li {
    width: 100%;
}
.hbg-gazo li img {
    width: 100%;
}

/*--高3ページのAO強化コンテンツの追加--*/
.kou3-kyoka .l-inner {
    position: relative;
}
.kou3-kyoka .kou3-kyoka-inner{
    position: absolute;
    top: 0;
    right: 0;
    width: 47%;
}
.kou3-kyoka h2 {
    width: 88%;
    margin: 0 auto;
}
.kou3-kyoka .text-area{
    width: 80%;
    margin: 0 auto;
 }
.kou3-kyoka p {
    font-size: 13px;
    line-height: 1.6;
    font-weight: 700;
    margin: 0;
}
.kou3-kyoka .tokuten {
}
.kou3-kyoka ul {
    display: flex;
    justify-content: center;
}

.kou3-kyoka ul li {
    width: 32%;
    background: none;
    padding: 0;
}

.kou3-kyoka ul li a img {
    width: 100%;
}

.kou3-kyoka ul li{
    display:inline-block;
    position:relative;
    overflow:hidden;
    border-radius: 50%;
}
 
.kou3-kyoka ul li:after {
    content:"";
    height:100%;
    width:30px;
    position:absolute;
    top:-180px;
    left:0;
    background-color: #fff;
    opacity:0;
    -webkit-transform: rotate(45deg);
    -webkit-animation: reflection 2s ease-in-out infinite;
}
 
@keyframes reflection {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

@media only screen and (max-width: 767px) {
    .kou3-kyoka .kou3-kyoka-inner{
        position: absolute;
        top: auto;
        bottom: -15vw;
        width: 100%;
    }
}
/*-- 高3ページ_フローティングボタンの追加 ------------------------------------------------------------*/

.kou3-btn {
    position: fixed;
    z-index: 901;
    bottom: 0;
    left: 3.8%;
}
.kou3-btn .btn {
    color: #fff;
    background: #333;
    padding: 0 0.35em;
    border-radius: 50%;
    text-align: center;
    display: table;
    font-size: 20px;
    cursor: pinter;
}
.kou3-btn .btn:hover {
    cursor: pinter;
}
.kou3-btn .btn:active {
    background: #f4d600;
}
.kou3-btn .box {
    max-width: 200px;
    max-height: 200px;
}
 
/* close button */
.kou3-btn .action-close {
    position: relative;
    margin-top: 2em;
}
.kou3-btn .action-close .btn {
    position: absolute;
    right: 0;
    top: -1em;
}
.kou3-btn .action-close .box {
    margin-bottom: 2em;
}
 
/* checkbox 非表示 */
.kou3-btn .add-control .checkbox {
    display: none;
}
 
/* close button's control */
.kou3-btn .add-control .action-close #close:checked ~ .btn {
    display: none;
}
.kou3-btn .add-control .action-close #close:checked ~ .box {
    display: none;
}


.kou3-btn .box .yureru-j {
    animation: yureru-j 2s infinite;
}
@keyframes yureru-j {
    0% {
        transform: translate(0px, 2px);
    }
    5% {
        transform: translate(0px, -2px);
    }
    10% {
        transform: translate(0px, 2px);
    }
    15% {
        transform: translate(0px, -2px);
    }
    20% {
        transform: translate(0px, 2px);
    }
    25% {
        transform: translate(0px, -2px);
    }
    30% {
        transform: translate(0px, 0px);
    }
}


@media only screen and (max-width: 767px) {
    .kou3-btn {
        bottom: 4%;
    }
    .kou3-btn .box {
        max-width: 24vw;
        max-height: 24vw;
    }
    .kou3-btn .btn {
        font-size: 12px;
    }    
}



.gakka .gakka-detail__calendar .calendar-item h4 {
    width: -moz-fit-content;
    width: fit-content;
    margin-bottom: 16px;
    padding: 6px 20px;
    border: 1px solid var(--main-color);
    border-radius: 20px;
    color: var(--main-color);
}

/*-- 留学生フローティングボタンの追加 ------------------------------------------------------------*/

.rgs-btn {
    position: fixed;
    z-index: 200;
    bottom: 20px;
    left: -1.5%;
}
.rgs-btn .btn {
    color: #fff;
    background: #333;
    padding: 0 0.35em;
    border-radius: 50%;
    text-align: center;
    display: table;
    font-size: 20px;
    cursor: pinter;
}
.rgs-btn .btn:hover {
    cursor: pinter;
}
.rgs-btn .btn:active {
    background: #f4d600;
}
.rgs-btn .box {
    max-width: 250px;
    max-height: 120px;
}
 
/* close button */
.rgs-btn .action-close {
    position: relative;
    margin-top: 2em;
}
.rgs-btn .action-close .btn {
    position: absolute;
    left: 8%;
    top: -6%;
}
.rgs-btn .action-close .box {
    margin-bottom: 3em;
}
 
/* checkbox 非表示 */
.rgs-btn .add-control .checkbox {
    display: none;
}
 
/* close button's control */
.rgs-btn .add-control .action-close #close-rgs:checked ~ .btn {
    display: none;
}
.rgs-btn .add-control .action-close #close-rgs:checked ~ .box {
    display: none;
}


@media only screen and (max-width: 767px) {
    .rgs-btn {
        bottom: 10px;
        left: -2.5%;
    }
    .rgs-btn .box {
        max-width: 28vw;
        max-height: 28vw;
    }
    .rgs-btn .btn {
        font-size: 12px;
    }    
}




/*「このサイトでは、アクセス状況〜Cookie（クッキー）を使用しています。」を非表示*/
.l-cookie-notice.show {
    display: none;
}

/*トップ_体験講座の要素の高さを揃える*/
li.oc-info__item.splide__slide {
	display: flex;
}
article.c-card-article {
	width: 100%;
	padding: 5px;
	display: flex;
	flex-direction: column;
    background: #fff;
    border-radius: 10px;
	box-shadow: 3px 3px 6px 0px rgba(0, 0, 0, 0.2);
	margin-bottom:10px;
}
.c-card-article__desc {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}
.c-card-article__desc .info, .c-card-article__desc .data, .c-card-article__desc .time {
	flex-grow: 1;
}
.c-card-article__desc .date {
	letter-spacing: .04em
}



/*========= 学科のグリットレイアウト ===============*/
.gakka .gakka-detail__training__item .grid-container{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    grid-template-rows: repeat(auto-fit, minmax(80px, 1fr));
    gap: 20px;
	padding: 3% 0;
}
.gakka .gakka-detail__training__item .grid-item {
    grid-row: span 2;
    display: grid;
    grid-template-rows: subgrid;
    row-gap: 2px;
}
.gakka .gakka-detail__training__item figure .grid-img img{
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: var(--radius);
    height: auto;
}
.gakka .gakka-detail__training__item .thumb-cap{
    font-weight: bold;
}

.gakka .gakka-detail__training__item .inner{
    max-width: 980px;
    width: 100%;
    margin: 0 auto;
	background: #f6f5ef;
    padding: 0 120px 0 20px;
}
@media only screen and (max-width: 767px){
    .gakka .gakka-detail__training__item .grid-container{
        grid-template-columns: repeat(auto-fit, minmax(40%, 1fr));
        grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));
        gap: 10px;
    }
    .gakka .gakka-detail__training__item .grid-item {
        row-gap: 0;
      }
    .gakka .gakka-detail__training__item .inner{
        padding: 0 30px 40px;
    }
}


/*========= 学科の交互にレイアウト設定を偶数番目に変更 ===============*/
.gakka .gakka-detail__training__item:nth-of-type(2n) figure {
    margin-left: auto;
}
.gakka .gakka-detail__training__item:nth-of-type(2n) .txt {
    right: auto;
    left: 0;
}
.gakka .gakka-detail__training__item:nth-of-type(2n) .deco-txt {
    z-index: -1;
    right: auto;
    left: calc(50% - 680px);
}

/*========= 学科の3カラムとキャプションの設定 ===============*/
.u-d-grid--col-3 {
    display: grid
}
.gakka .gakka-detail .u-d-grid--col-3 .has-caption-pht figcaption {
    position: relative;
    }
@media print, screen and (min-width: 768px) {
    .u-d-grid--col-3 {
        grid-template-columns: repeat(3, 1fr);
    }
}

/*========= 学科_数字部分の高さ揃え ===============*/
@media print, screen and (min-width: 768px) {
    .gakka .gakka-detail__about-data .outer:nth-of-type(2), .gakka .gakka-detail__about-data.-col-4 .outer:nth-of-type(4) {
        translate: 0;
    }
}

/*========= 学科_就職先一覧の文字色を濃くした ===============*/
.gakka .gakka-detail__about-record dd .sub {
    color: #999;
}

/*========= 全ページ_学校ロゴをh1からdivに変更、新規でタイトル自動読み込みのh1タグを設置して小さく表示 ===============*/
h1.not_title {
    color: #fff;
    position: relative;
    padding-right: 2vw;
    text-align: end;
    width: 100%;
    font-size: 12px;
    background: linear-gradient(90deg, #005038 0, #a29452);
}
/*========= 全ページ_h2の英語表記をdata-xxに変更する ===============*/
.l-page-head__ttl::after {
content: attr(data-title);
    margin-top: 10px;
    color: #a29452;
    font-size: 1.3rem;
    line-height: 1.6153846154;
    font-family: Hanken Grotesk, sans-serif;
    text-transform: uppercase;
}
.gakka .gakka-detail__ttl h2::after {
content: attr(data-year);
    height: fit-content;
    margin-top: 20px;
    padding: 2px 12px;
    border-radius: 12px;
    background-color: #f8f4e4;
    color: #a29452;
    font-size: 1.5rem;
    line-height: 1.4666666667;
}
.gakka .gakka-detail__ttl h2 span.txt::after {
content: attr(data-title);
    color: var(--main-color);
    font-size: 1.3rem;
    font-family: Hanken Grotesk, sans-serif;
}
@media print, screen and (max-width: 767px) {
    .l-page-head__ttl::after {
        margin-top: 2.6666666667vw;
        font-size: 1.2rem
    }
    .gakka .gakka-detail__ttl h2::after {
        margin-top: 3.2vw;
        padding: .5333333333vw 3.2vw;
        border-radius: 3.2vw;
        font-size: 1.2rem;
        white-space: nowrap;
    }
}


/*========= 全ページ_h3/h4の英語表記をdata-xxに変更する ===============*/
.c.c-list-course__item.-railway .card-ttl::after {
    color: #3b5c8d
}
.c-list-course__item.-airport .card-ttl::after {
    color: #1bb699
}
.c-list-course__item.-hotel .card-ttl::after {
    color: #38ab5c
}
.c-list-course__item.-travel .card-ttl::after {
    color: #2fbcc6
}
.c-list-course__item.-bridal .card-ttl::after {
    color: #f36a44
}
.c-list-course__item.-beauty .card-ttl::after {
    color: #f48c9d
}
.c-list-course__item.-funeraldirector .card-ttl::after {
    color: #9082bc
}
.c-list-course__item.-global .card-ttl::after {
    color: #80c158
}
.c-list-course__item.-korean .card-ttl::after {
    color: #d06449
}
.c-list-course__item.-business .card-ttl::after {
    color: #6c594a
}
.c-list-course__item .card-ttl::after {
    content: attr(data-title);
    margin-top: 4px;
    font-weight: 700;
    font-size: 1.3rem;
    font-family: Hanken Grotesk, sans-serif;
    letter-spacing: .048em;
}
.c-ttl-base::after, .korean__about__ttl::after, .gakko .gakko-cont__box .box-ttl::after, .c-ttl-pht--underline::after, .c-ttl-pht--lg::after, .blog .blog-ttl::after {
    content: attr(data-title);
    margin-top: 12px;
    color: #a29452;
    font-weight: 700;
    font-size: 1.3rem;
    line-height: 1.6153846154;
    font-family: Hanken Grotesk, sans-serif;
    letter-spacing: .116em;
    text-transform: uppercase;
    white-space: pre;
}
.korean__about__ttl::after, .gakko .gakko-cont__box .box-ttl::after, .c-ttl-pht--lg::after, .blog .blog-ttl::after {
    display: block;
    text-align: center;
}
.gakko .gakko-lead__ttl::before {
    content: attr(data-title);
    color: #cfc286;
    font-weight: 700;
    font-size: 1.8rem;
    line-height: 1.1666666667;
    font-family: Hanken Grotesk, sans-serif;
    letter-spacing: .118em;
    text-transform: uppercase;
}
.blog .blog-ttl::after {
    margin-top: -12px;
    color: #f6f5ef;
    font-size: 8rem;
    line-height: 1;
}
.l-post-related .blog-ttl::after {
    color: #fff;
}
@media screen and (max-width: 767px) {
    .c-list-course__item .card-ttl::after {
        margin-top: .5333333333vw;
        font-size: 1.2rem;
    }
    .c-ttl-base::after, .gakko .gakko-cont__box .box-ttl::after {
        margin-top: 2.1333333333vw;
        font-size: 1.1rem;
    }
    .korean__about__ttl::after, .c-ttl-pht--lg::after {
        margin-top: 3.2vw;
        font-size: 1.1rem;
    }
    .gakko .gakko-lead__ttl::before {
        font-size: 1.6rem;
    }
    .c-ttl-pht--underline::after {
        font-size: 1.1rem;
    }
    .blog .blog-ttl::after, .blog .blog-ttl::after {
        margin-top: -3.2vw;
        font-size: 6rem;
    }
}


/*========= 強化月間_学科ページ_業界EXPOコンテンツを追加する ===============*/
.gakka .gakka-detail__about-data.-point {
    grid-template-columns: repeat(auto-fit, 31%);
    padding-bottom: 0;
    justify-content: space-around;
    align-items: stretch;
    @media (768px <=width) {
    padding-bottom: 40px;
    }
}
.gakka .gakka-detail__about-data.-point .about-data__item, .gakka .gakka-detail__about-data.-flex .about-data__item {
    padding: 2px 6px;
    @media (768px <=width) {
        padding: 20px;
    }

}
.gakka .gakka-detail__about-data.-point .about-data__item .num, .gakka .gakka-detail__about-data.-flex .about-data__item .num {
    font-size: 0.7rem;
    letter-spacing: normal;
    margin-bottom: 0;
    @media (768px <=width) {
        font-size: 1.5rem;
    }
}
.gakka .gakka-detail__about-data.-flex .about-data__item .num strong {
    margin-right: 4px;
    font-size: 2.6rem;
    @media (768px <=width) {
        font-size: 9.2rem;
    }
}
.gakka .gakka-detail__about-data.-point .about-data__item .icon, 
.gakka .gakka-detail__about-data.-flex .about-data__item .icon,
.gakka .gakka-detail__about-data .about-data__item .num .icon{
    position: absolute;
    top: 8px;
    right: 8px;
    width: 36px;
    height: 36px;
    @media (768px <=width) {
        top: 8px;
        right: 8px;
        width: 104px;
        height: 104px;    }

}
.gakka .gakka-detail__about-data.-flex .about-data__item .unit {
    display: flex;
    padding-bottom: 0;
    justify-content: center;
    position: relative;
    margin-bottom: 1rem;
}
.gakka .gakka-detail__about-data.-flex .about-data__item .unit .item {
    margin: 0 auto;
}
.gakka .gakka-detail__about-data.-flex .about-data__item .unit .item {
    width: 100%;
}
.gakka .gakka-detail__about-data.-flex .about-data__item .ttl {
    text-align: left;
    position: relative;
}
.gakka .gakka-detail__about-data.-flex {
    margin-bottom: 40px;
    flex-wrap: nowrap;
}
.gakka .gakka-detail__about-data.-flex .outer {
    @media (768px <=width) {
        width: 48%;
    }
}
.gakka .gakka-detail__about-data.-flex .about-data__item .tani {
    display: inline-block;
    line-height: normal;
    text-align: left;
    position: relative;
}
.gakka .gakka-detail__about-data .about-data__item .gaiyo {
    color: #000;
    line-height: normal;
    font-weight: normal;
}
.expo_title {
    text-align: center;
    margin-bottom: 20px;
    @media (768px <=width) {
        margin- bottom: 80px;
    }
}
.gakka .gakka-detail__about-data.-point .c-ttl-pointBbl {
    display: flex;
    align-items: center;
    margin-bottom: 0;
    gap: 2px;
    @media (768px <=width) {
        gap: 8px;
    }

}
.gakka .gakka-detail__about-data.-point .c-ttl-pointBbl .num {
    color: #fff;
    @media (width < 768px) {
        width: 10vw;
    }
}
.gakka .gakka-detail__about-data.-point .c-ttl-pointBbl .ttl {
    margin-bottom: 0;
    line-height: normal;
}
.gakka .gakka-detail__about-data.-point .about-data__item .icon {
    position: relative;
    margin: 0 auto 1vw;
    top: 0;
    right: 0;
    @media (768px <=width) {
        margin: 0 auto 20px;
    }
}
.gakka .gakka-detail__about-data.-point .outer {
    display: block;
    width: 33%;
    @media (768px <=width) {
        display: flex;
        width: 100%;
    }
}
.expo__about {
    --main-color: #005038;
    --gradient-end: #000;
    --icon-bg: #b2cac3;
}
.global__about, .global__about__sec, .funeral__about__sec, .bridal__about__sec, .beauty__about__sec, .business__about {
    padding-bottom: 48px;
}
@media screen and (max-width: 767px) {
    .gakka .gakka-detail__about-data {
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 2vw;
    }
    .gakka .gakka-detail__about-data .about-data__item {
        padding: 2vw;
        border-radius: calc(var(--radius) * 1);
    }
    .gakka .gakka-detail__about-data .about-data__item .ttl {
        margin-bottom: 1vw;
        font-size: 0.8rem;
    }
    .gakka .gakka-detail__about-data .about-data__item .num {
        font-size: 0.7rem;
    }
    .gakka .gakka-detail__about-data .about-data__item .num strong {
        margin-right: 1vw;
        font-weight: 700;
        font-size: 2.6rem;
    }
    .gakka .gakka-detail__about-data .about-data__item .gaiyo {
        margin-bottom: 1vw;
        font-size: 0.7rem;
    }
    .gakka .gakka-detail__voice-card>li .card-head .item-info .course {
        width: 90%;
    }
}







/*-- 学科ページ_卒業生インタビュー_スライダー＆モーダル --------------------------------------------------------------------------*/
.gakka-interview .modal-checkbox {
  display: none;
}
.gakka-interview .modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 60%);
}

.gakka-interview .close {
  position: absolute;
  top: 20px;
  right: 20px;
  transform: translate(50%, -50%);
  z-index: 10;
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 50%;  /* 丸みの度合い */
  background: #333; /* ボタンの背景色 */
}
 
.gakka-interview .close::before, .gakka-interview .close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px;
  height: 21px;
  background: #fff; /* バツ印の色 */
}
 
.gakka-interview .close::before {
  transform: translate(-50%,-50%) rotate(45deg);
}
 
.gakka-interview .close::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}    
.gakka-interview .modal-wrapper {
  position: relative;
  width: 80%;
  max-width: 500px;
  max-height: 70%;
  padding: 20px;
  margin: auto;
  overflow: scroll;
  background-color: #FEFEFE;
  border-radius: 5px;
}



.gakka-interview .modal-checkbox:checked + .modal {
  display: flex;
}
.gakka-interview .splide__slide{
    padding-bottom: 50px;
    border-radius: var(--radius);
	background: #fff;
	border: solid #999 1px;
    @media (width < 768px) {
    padding-bottom: 12VW;
    }
}
.gakka-interview .company-name.-column {
    padding: 10px;
}
.gakka .gakka-interview .has-comment-pht p {
    padding-inline: 10px;
    font-size: 1.3rem;

}
.gakka-interview .btn {
    margin-top: 16px;
    display: block;
    min-height: 30px;
    border: 1px solid #005038;
    border-radius: 24px;
    color: #fff;
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 2.4;
    letter-spacing: .06em;
    background-color: #005038;
    position: absolute;
	right: 60px;
	bottom: 10px;
	left: 60px;
	text-align: center;
}

/* ページネーションのスタイル */
.gakka-interview .your-class-page {
  background-color: #ccc;
  height: 12px;
  transition: .5s all;
  width: 12px;
}
/* 現在表示されているページネーションのスタイル */
.gakka-interview .your-class-page.is-active {
  background-color: #005038;
  opacity: 1;
}
/* ページネーションの位置 */
.gakka-interview .your-class-pagination {
  display: flex!important;
  position: static;
  margin-top: 20px;
}
/* ページネーション間の余白 */
.gakka-interview .your-class-pagination li {
  margin-left: 5px;
  margin-right: 5px;
}
/* 矢印の高さ */
.gakka-interview .splide__arrow {
    top: 30%;
}

/*-- 学科ページ_カリキュラムPICK UP_スライダー --------------------------------------------------------------------------*/
.gakka_pickup .gakka-detail__pickup__cont{
    display: flex;
    gap: 0;
}
/* スライド共通のスタイル */
.gakka_pickup .splide__slide  {
  opacity: .4; /* 左右のスライドを薄くする */
}
/* アクティブなスライドのスタイル */
.gakka_pickup .splide__slide.is-active  {
  opacity: 1; /* 中央のスライドは薄くしない */
}
@media screen and (max-width: 767px) {
    .gakka .gakka_pickup .gakka-detail__pickup__cont>li {
        grid-template-columns: 30vw 1fr;
    }
    .gakka .gakka_pickup .gakka-detail__pickup__cont>li dl dd {
        font-size: 1.1rem;
		line-height: 1.3;
    }
}
.gakka_pickup .splide__pagination {
    padding: 1em 0;
    position:relative ;
}
/* ページネーションのスタイル */
.gakka_pickup .your-class-page {
  background-color: #ccc;
  height: 20px;
  transition: .5s all;
  width: 20px;
    @media (width < 768px){
        height: 3vw;
        width: 3vw;
    }
}
/* 現在表示されているページネーションのスタイル */
.gakka_pickup .your-class-page.is-active {
  background-color: #005038;
  opacity: 1;
}
/* ページネーション間の余白 */
.gakka_pickup .your-class-pagination li {
  margin-left: 5px;
  margin-right: 5px;
}


/*-- 学科ページ_学べること・おすすめのアコーディオン化 ----------------------------------------------------------------*/
.osusume.accordion {
  margin: 0;
}
.osusume .accordion__summary {
  display: block;
  font-weight: bold;
  position: relative;
  list-style: none; /* 矢印を消す */
  cursor: pointer;
  padding: 10px 38px 10px 10px;
    padding-block: 8px;
    border-radius: var(--radius) var(--radius) 0 0;
    background-color: var(--main-color);
    color: #fff;
    font-weight: 700;
    font-size: 1.8rem;
    text-align: center;
}
.osusume .accordion__summary::-webkit-details-marker {
  display: none;
}
.osusume .accordion__summary::after {
  content: "+";
  font-size: 1.4em; /* 記号のサイズ */
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}
.osusume.accordion[open] .accordion__summary::after {
  content: "−";
}
.osusume .accordion__detail {
  margin: 10px 0;
    position: relative;
    padding: 32px;
    border-radius: 0 0 var(--radius) var(--radius);
    background-color: var(--icon-bg);
    font-size: 1.6rem;
    line-height: 1.875;
}
.osusume .accordion__text {
  margin: 0;
}
.osusume .accordion__text strong {
    font-size: 1.4rem;
}

.osusume .accordion__text ul {
  list-style: none;
  padding-left: 0;
  margin: 0 0 1.5em 0;
}

.osusume .accordion__text ul li {
  position: relative;
  padding-left: 1.8em;
  margin-bottom: 0.5em;
  line-height: 1.6;
    font-size: 1.2rem;
}

.osusume .accordion__text ul li::before {
  content: "✔"; /* または "\2713" */
  color: #007BFF; /* ブランドカラーなどに変更可 */
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1em;
  line-height: 1.6;
}

/*-- 学生マンション＆寮のアクティブ時の黒枠を削除 -------------------------------------------------------------------------------------------------*/
.splide__track--nav>.splide__list>.splide__slide.is-active {
    border: none !important;
}



/*-- 学科ページにバリュー追加 ------------------------------------------------------------------------------------20250218-------------*/
.value {
    padding-top: 110px;
    background-color: var(--main-color);
    @media (width < 768px) {
        padding-top:5vw;
    }

}
.value .ttl_lead {
    text-align: center;
    color: #fff;
    @media (width < 768px) {
        text-align: left;
    }
}
.value .l-sec-lineTop:before {
    background-color: var(--gradient-end);
    top: 1rem;
}
.value .c-decor-summary .summary-ttl .main {
    color: #fff;
  text-shadow:
    1px 1px 0 var(--main-color),
    -1px 1px 0 var(--main-color),
    -1px -1px 0 var(--main-color),
    1px -1px 0 var(--main-color);
}
.value .c-decor-summary:after{
    aspect-ratio: 200 / 212;
    width: 200px;
    @media (width < 768px) {
        width: 30vw;
    }

}

.value .c-decor-summary:before {
    background: none;
}
.airport .value .c-decor-summary:after {
    background: url(/assets/images/gakka/airport/value_airline_05.png) no-repeat 50% / contain;
}
.railway .value .c-decor-summary:after {
    background: url(/assets/images/gakka/railway/value_railway_eye_catch.png) no-repeat 50% / contain;
}
.hotel .value .c-decor-summary:after {
    background: url(/assets/images/gakka/hotel/value_hotel_eye_catch.png) no-repeat 50% / contain;
}
.travel .value .c-decor-summary:after {
    background: url(/assets/images/gakka/travel/value_travel_eye_catch.png) no-repeat 50% / contain;
}
.value .c-ttl-pointBbl .kasen {
    font-style: normal;
    background: linear-gradient(transparent 60%, var(--gradient-end) 60%);
}
/* ページネーションのスタイル */
.your-class-page {
  background-color: #ccc;
  height: 3rem;
  transition: .5s all;
  width: 3rem;
}
/* 現在表示されているページネーションのスタイル */
.value .your-class-page.is-active {
  background-color: #666;
  opacity: 1;
}
/* ページネーションの位置 */
.value .your-class-pagination {
  bottom: -2rem;
}
/* ページネーション間の余白 */
.value .your-class-pagination li {
  margin-left: .5rem;
  margin-right: .5rem;
}
/* スライドのサイズ調整 */
.value .splide__slide img {
  height: auto;
  width: 100%;
}

/* トップページ_ページネーションの位置 */
.top .oc-info .splide__pagination,.top .curriculum .splide__pagination {
    bottom: -1em;
}

/* 学科-設備紹介_ページネーションの位置 */
.gakka .gakka-detail__facility-slide .splide__pagination {
    top: -480px;
        @media (width < 768px) {
        top: -98vw;
    }
}

/*--------------固定メニュー改（メインフロートメニュー）--ココから------------------------20250203--------------------------------------------------ここから-------*/
.main-float {
    position: fixed;
    right: 0;
    color: #fff;
    z-index: 300;
    @media (width < 768px) {
        bottom: 0px;
        left: 0px;
        transition: transform 0.3s ease;
    }
}
.main-float-list {
    @media (width < 768px) {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(10px, 1fr));
        gap: 0px 1px;
    }
}

.main-float-list__item-in {
    position: relative;
    display: block;
    height: 100%;
    background: #fff;
    color: #fff;
}

.main-float-list__item:first-of-type .main-float-list__item-in {
    color: #fff;
    @media (width < 768px){
        border-radius: 5px 0 0 0;
    }
}
.main-float-list__item:nth-of-type(1) .main-float-list__item-in {
    background: #005038;
}
.main-float-list__item:nth-of-type(2) .main-float-list__item-in {
    background: #fff;
}
.main-float-list__item:last-of-type .main-float-list__item-in {
    background: #EF8A45;
    @media (width < 768px){
        border-radius: 0 5px 0 0;
    }
}







.main-float-list__item-head {
    text-align: center;
    line-height: 1.2;
    @media (width < 768px){
        padding: 5px;
    }
}
.main-float-list__item-head-ico {
    display: block;
    margin: 0px auto;
    @media (width < 768px){
        width: 25px;
    }
}
.main-float-list__item-head-txt {
    display: block;
    @media (width < 768px){
        font-size: 1.1rem;
    }
}    
.main-float-list__item-head-txt.is-large {
    @media (width < 768px){
        margin-top: 7px;
        font-size: 1.2rem;
    }
}
.main-float-list__item-head-ico img {
    block-size: auto;
    max-inline-size: 100%;
    display: block;
    width: 100%;
}

/*--------------固定メニュー改（メインフロートメニュー）--ココまで------------------------20250203--------------------------------------------------ここから-------*/


/*-------------- メインビジュアル変更 250403 -------------- */
/* ----- slick */
/* slider */
.slick-slider {position:relative; display:block; box-sizing:border-box; -webkit-user-select:none; -moz-user-select:none; user-select:none; -webkit-touch-callout:none; -khtml-user-select:none; touch-action:pan-y; -webkit-tap-highlight-color:transparent}
.slick-list {position:relative; display:block; overflow:hidden; margin:0; padding:0}
/*.slick-list:focus {outline:none}*/
.slick-list.dragging {cursor:pointer}
.slick-slider .slick-track,.slick-slider .slick-list {translate:0 0 0}
.slick-track {position:relative; top:0; left:0; display:block; margin-left:auto; margin-right:auto}
.slick-track:before,.slick-track:after {display:table; content:''} .slick-track:after {clear:both}
.slick-loading .slick-track {visibility:hidden}
.slick-slide {display:none; float:left; height:100%; min-height:1px} [dir='rtl'] .slick-slide {float:right}
.slick-slide img {display:block}
.slick-slide.slick-loading img {display:none}
.slick-slide.dragging img {pointer-events:none}
.slick-initialized .slick-slide {display:block}
.slick-loading .slick-slide {visibility:hidden}
.slick-vertical .slick-slide {display:block; height:auto; border:1px solid transparent}
.slick-arrow.slick-hidden {display:none}
.slick-loading .slick-list {background:#fff url('../js/slick/ajax-loader.gif') center center no-repeat}
/* Icons */
@font-face {font-family:'slick'; font-weight:normal; font-style:normal; src:url('../js/slick/slick.eot'); src:url('../js/slick/slick.eot?#iefix') format('embedded-opentype'),url('../js/slick/slick.woff') format('woff'),url('../js/slick/slick.ttf') format('truetype'),url('../js/slick/slick.svg#slick') format('svg')}
/* Arrows */
.slick-prev,.slick-next {font-size:0; line-height:0; position:absolute; top:50%; z-index:100; display:block; width:1.25rem; height:1.25rem; padding:0; translate:0 -50%; cursor:pointer; color:transparent; border:none; background:transparent}
.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus {color:transparent; /*outline:none;*/ background:transparent}
.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before {opacity:1}
.slick-prev.slick-disabled:before,.slick-next.slick-disabled:before {opacity:.25}
.slick-prev:before,.slick-next:before {font-family:'slick'; font-size:1.25rem; line-height:1; opacity:.75; color:rgba(100,100,100,.5); /*-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;*/}
.slick-prev {left:.625rem}            [dir='rtl'] .slick-prev {right:-1.5625rem; left:auto}
.slick-prev:before {content:'←'}  [dir='rtl'] .slick-prev:before {content:'→'}
.slick-next {right:.625rem}           [dir='rtl'] .slick-next {right:auto; left:-1.5625rem}
.slick-next:before {content:'→'}  [dir='rtl'] .slick-next:before {content:'←'}
/* Dots */
.slick-dotted.slick-slider {margin-bottom:1.875rem}
.slick-dots {position:absolute; bottom:-1.5625rem; display:block; width:100%; padding:0; margin:0; list-style:none; text-align:center}
.slick-dots li {position:relative; display:inline-block; width:.875rem; height:.875rem; margin:0 .3125rem; padding:0; cursor:pointer}
.slick-dots li button {font-size:0; line-height:0; display:block; width:1.25rem; height:1.25rem; padding:.3125rem; cursor:pointer; color:transparent; border:0; background:transparent}
/*.slick-dots li button:hover,.slick-dots li button:focus {outline:none}*/
.slick-dots li button:hover:before, .slick-dots li button:focus:before {opacity:1}
.slick-dots li button:before {font-family:'slick'; font-size:.375rem; line-height:1.25rem; position:absolute; top:0; left:0; width:1.25rem; height:1.25rem; content:'•'; text-align:center; opacity:.25; color:black; /*-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;*/}
.slick-dots li.slick-active button:before {opacity:.75; color:black}

.fv_main .-railway {--main-color:#3b5c8d;}
.fv_main .-bridal {--main-color:#f36a44;}
.fv_main .-beauty {--main-color:#f48c9d;}
.fv_main .-hotel {--main-color:#38ab5c;}
.fv_main .-travel {--main-color:#2fbcc6;}
.fv_main .-airport {--main-color:#1bb699;}
.fv_main .-global {--main-color:#80c158;}
.fv_main .-funeraldirector {--main-color:#9082bc;}
.fv_main .-korean {--main-color:#ce6248;}
.fv_main .-business {--main-color:#6c594a;}

.fv_main {position:relative; display:grid;}
.fv_main ._copy {position:relative; z-index:3;}
.fv_main ._copy picture {display:block;}
.fv_main ._slide {overflow:hidden;}
.fv_main ._slide > ul > li {opacity:0;}
.fv_main .slick_track {padding-bottom:15px;}
.fv_main .slick-slide {display:grid;}
.fv_main .slick-slide:has(a+a) {grid-template-rows:1fr 1fr;}
.fv_main .slick-slide a {display:block; position:relative;}
.fv_main .slick-slide a > img {width:100%; height:100%; object-fit:cover; box-shadow:0 2px 8px #0002;}
.fv_main .slick-slide ._label {position:absolute; width:fit-content; max-width:95%; right:0; bottom:1.4em; padding:.3em .6em .3em 1em; border-radius:2em 0 0 2em; background:var(--main-color); line-height:1.33; font-weight:bold; color:#fff;}
.fv_main .slick-slide ._label span {display:inline-block;}
.fv_main .slick-dots li button {scale:1.8;}
.fv_main ._rslt {position:relative;}
.fv_main ._rslt p {margin-top:1em; line-height:1.33; text-align:center; font-size:85%; color:#666;}
.fv_main ._rslt img {position:absolute; left:50%; top:0; translate:-50% 0;}
.fv_main ._rslt ._fig {line-height:1; text-align:center; font-family:"Urbanist",sans-serif; font-weight:bold; color:#a19353;}
.fv_main ._rslt ._fig b {font-size:140%; font-weight:inherit;}
.fv_main ._rslt ._fig i {font-size:70%; font-style:normal;}

@media (min-width:768px) {
  .fv_main {min-width:1200px; grid-template-columns:2fr 3fr; grid-template-rows:auto 1fr;}
  .fv_main ._copy {padding-block:6% 3%;}
  .fv_main ._copy picture {width:100%; translate:7% 0; margin-bottom:2rem;}
  .fv_main ._slide {grid-row:1/3; padding-block:4%;}
  .fv_main .slick-slider {padding-inline:1rem;}
  .fv_main .slick-slide:has(a+a) {gap:max(2.5vw,3rem)}
  .fv_main .slick-slide a {margin-inline:max(1.25vw,1.5rem)}
  .fv_main .slick-slide:has(a:only-child) {aspect-ratio:5/7;}
  .fv_main .slick-slide:has(a+a) a {aspect-ratio:5/3.6;}
  .fv_main .slick-slide a > img {border-radius:1em;}
  .fv_main .slick-slide ._label {font-size:max(140%,1.5vw);}
  .fv_main .slick-dots {bottom:-3rem;}
  .fv_main ._rslt {grid-column:1/2; grid-row:2/3; padding-top:max(3vw,36px);}
  .fv_main ._rslt img {width:70%;}
  .fv_main ._rslt ._fig {font-size:max(5.8vw,6.5rem);}
  .fv_main ._visitorNav {position:absolute; left:0; bottom:0; display:flex;}
}
@media (max-width:767px) {
  body:has(.fv_main) .l-body {overflow:hidden;}
  .fv_main ._copy {padding-block:4vw 1vw;}
  .fv_main ._copy picture {width:90%; margin-inline:auto;}
  .fv_main ._slide {padding-bottom:3vw;}
  .fv_main .slick-slider {padding-inline:2vw;}
  .fv_main .slick-slide {padding:2vw;}
  .fv_main .slick-slide:has(a+a) {gap:4vw;}
  .fv_main .slick-slide a {margin-inline:.5vw;}
  .fv_main .slick-slide:has(a:only-child) {aspect-ratio:3/5;}
  .fv_main .slick-slide:has(a+a) a {aspect-ratio:3/2.51;}
  .fv_main .slick-slide a > img {border-radius:3vw;}
  .fv_main .slick-slide ._label {font-size:3.3vw;}
  .fv_main .slick-slide .-funeraldirector ._label {font-size:3vw;}
  .fv_main .slick-dots {bottom:-5vw;}
  .fv_main ._rslt {width:100%; aspect-ratio:5/3; padding-top:7vw;}
  .fv_main ._rslt img {width:75%;}
  .fv_main ._rslt p {width:60%; margin-inline:auto; font-size:80%;}
  .fv_main ._rslt ._fig {font-size:13vw;}
}
/*-------------- メインビジュアル変更 ここまで -------------- */





/*----------------  学科ページ、OC用CTAボタン  --------------------------*/

.gakka .gakka-detail__foot-bnr a.btn_oc {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50px;
  position: relative;
  background: #000000;
  border: 1px solid #000000;
  border-radius: 30px;
  box-sizing: border-box;
  padding: 0 45px 0 25px;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
      transition: transform 0.2s;
}
    .gakka .gakka-detail__foot-bnr a.btn_oc:active {
    transform: scale(0.95);
    }
.gakka .gakka-detail__foot-bnr a.btn_oc:before {
  content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 25px;
  margin-top: -6px;
}
.gakka .gakka-detail__foot-bnr {
    @media (width < 768px){
        margin-top: 5vw;
    }
}



   

/*-------------------  学科ページ、5つのバリューアコーディオン  -------------------*/
.value_acc_toggle {
	display: none;
}
.value_acc_Label {
  position: relative;
  display: block;
  padding-right: 30px;
}
.value_acc_Label::before {
  content: "";
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: #005038;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
.value_acc_Label::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-40%) rotate(0deg);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid #fff;
  transition: transform 0.3s ease;
}
.value_acc_Label,
.value_acc_content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}
.value_acc_content {
	height: 0;
	overflow: hidden;
}
.value_acc_toggle:checked + .value_acc_Label + .value_acc_content {
	height: auto;
	transition: all .3s;
}
.value_acc_toggle:checked + .value_acc_Label::before {
  background-color: #D4C45F; 
}
.value_acc_toggle:checked + .value_acc_Label::after {
  transform: translateY(-60%) rotate(180deg);
}










/*  ----------------  目指せる職業  ------------------  */
.shokugyo {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}
.shokugyo .item {
    display: block;
    color: #666;
    border: solid 1px #666;
    padding: 16px 72px;
    font-weight: 700;
    border-radius: 999px;
     transition: transform .2s;
    &:active{
        transform: scale(.95);
    }
        @media (width < 768px){
            padding: 4px 12px;
            font-size: 12px;
    }
}
.shokugyo a.item {
    color: var(--main-color);
    border-color: var(--main-color);
     transition: transform .2s;
    &:active{
        transform: scale(.95);
    }
}

.railway .railway-job__voice {
    margin-top: 0;
    @media (width < 768px){
        margin-top: 0;
    }
}
.gakka .gakka-detail .railway-job__voice.bg-circle.-gradient-half:before {
    background: linear-gradient(#fff, var(--gradient-end), #fff);
    opacity: .3;
}

/*---------------  鉄道サービス学科のMVを中央へ移動  -----------------------*/
.railway.gakka .gakka-detail__mv img {
    border-radius: var(--radius);
}
.railway.gakka .gakka-detail__mv {
    margin: 0 auto;
}




.railway.gakka p {
    @media (width < 768px){
        font-size: 12px;
    }
    
}.railway.gakka .l-sec-lineTop {
    padding-block: 20px;
}
.railway.gakka .c-ttl-pointBbl {
    margin-bottom: 10px;
}
.railway.gakka .l-sec-lineTop + .l-sec-lineTop {
    margin-top: 40px;
    @media (width < 768px){
        margin-top: 7vw;
    }
}



/*---------------------------  左サイドメニュー  -----------------------*/
.side_nav {
    position: relative;
    z-index: 9999;
}
.side_nav > aside {
    background-color: var(--main-color);
    width: 350px;
    height: 100%;
    top: 0%;
    left: -350px;
    position: fixed;
    opacity: 0.9;
}
.side_nav > aside ul {
    margin: 0;
    padding: 0;
    top: 100px;
    left: 114px;
    position: absolute;
}
.side_nav > aside li {
    margin: 20px auto;
    list-style: none;
}
.side_nav > aside button {
    background-color: var(--main-color);
    display: block;
    position: absolute;
    top: 35%;
    left: 350px;
    width: 32px;
    height: 132px;
    margin: 0;
    padding: 0;
    border-radius: 0 5px 5px 0;
}
.side_nav a {
    color: #fff;
}


/*---------------------------  ヘッダーにLINEを追加  -----------------------*/
@media screen and (max-width: 767px) {
    .l-header__inner {
        gap: 1.6vw
    }
    .l-header__logo {
        flex-basis: 64vw;
    }
    .sp_line_btn a {
        display: grid;
        width: 8vw;
        height: 8vw;
    }
}


























/* ホテル学科の改修 --------------------------------------------------------------------------------------------------------------------------------------------*/

/* FV下のタイトル文字 ----------------------------------------------------------------------*/
.c-ttl-base.gakka {
    color: var(--main-color);
}
/* 就職率100％ */
.gakka .ssr100{
    position: absolute;
    left: calc(50% + 290px);
    bottom: 130px;
    @media (width < 768px){
          width: 20vw;
          left: auto;
          right: 8%;
          bottom: 8%;
    }
}
.gakka .toeic{
	width:160px;
    left: calc(50% + 340px);
    @media (width < 768px){
          width: 13vw;
    }
}
/* ページ内リンクボタン ----------------------------------------------------------------------*/
.gakka .toc-container {
    margin: 0 auto;
    width: 90%;
    max-width: 450px;
    background-color: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    @media (768px <= width){
        max-width: 600PX;
    }
}
.gakka .toc-header {
    background-color: var(--main-color);
    color: #ffffff;
    font-size: 1.2rem;
    font-weight: bold;
    padding: 10px 20px;
    appearance: none;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.gakka .toc-header::after {
    content: "+";
    font-size: 1.5rem;
    font-weight: normal;
    transition: transform 0.3s ease;
    line-height: 1;
}
.gakka .toc-container:not(.closed) .toc-header::after {
    content: "−";
    transform: rotate(0deg); 
}
.gakka .toc-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
}
.gakka .toc-container:not(.closed) .toc-content {
    max-height: 500px; 
}
.gakka .toc-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.gakka .toc-item {
    border-bottom: 1px solid #e0e0e0;
}
.gakka .toc-item:last-child {
    border-bottom: none;
}
.gakka .toc-item a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    color: #333333;
    padding: 10px 20px;
    font-size: 1.2rem;
    transition: background-color 0.2s;
    position: relative;
}
.gakka .toc-item a:hover {
    background-color: #f9f9f9;
}
.gakka .toc-item-text {
    font-weight: 1000;
}
.gakka .toc-item-icon {
    display: block;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid var(--main-color);
    transform: translateY(2px);
    transition: transform 0.3s;
    @media (768px <= width){
        transform: translateX(10px);
    }
}
/* 背景のグラデーション */
.gakka .gakka-detail__toc__bg .bg-shape {
    top: 50%;
    right: -320px;
    width: 600px;
    transform: translateY(-50%)
    @media(width < 767px) {
        right: -40vw;
        width: 80vw;
    }
}

/*-- ５つのポイント ------------------------------------------------------------*/
.value.five-p {
    background-color: var(--icon-bg);
}
.value.five-p .c-ttl-pointBbl .kasen {
    font-style: normal;
    background: linear-gradient(transparent 60%, #cfc286 90%);
}
.value.five-p small {
    font-size: 50%;
}
.c-ttl-pointBbl .ja {
    font-size: 2.6rem;
    line-height: 1.0;
    @media (width < 768px){
        font-size: 1.6rem;
        line-height: 1.2;
    }
}
.five-p_container {
    display: flex;
    align-items: center;
    margin: 15px auto;
}
.five-p_container .check-box {
    background-color: color-mix(in srgb, var(--main-color) 10%, white); /* 背景色 */
    color: var(--main-color); /* テキスト色 */
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 20px;
    font-size: 1.0rem;
    margin-right: 15px;
    white-space: nowrap;
}
.five-p_container .hashtag-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
/*    flex-wrap: wrap;*/
}
.five-p_container .hashtag-item {
    color: var(--main-color); /* テキスト色 */
    font-size: 1.2rem;
    font-weight: bold;
    margin-right: 15px;
    white-space: nowrap;
}
.value.five-p .feature-reason__btn {
    text-align: center;
    display: block;
    margin: 0 auto;
}
/* スマートフォンでの表示を考慮 */
@media (max-width: 767px) {
    .five-p_container .container {
        flex-direction: column;
        align-items: flex-start;
    }
    .five-p_container .check-box {
        margin-right: 10px;
        margin-bottom: 10px;
    }
    .five-p_container .hashtag-item {
        margin-bottom: 5px;
    }
}
/* モーダルウィンドウ */
.fp_modal {
  display: none;
  position: fixed;
  z-index: 1099;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.5);
}
.fp_modal .fp_modal-box {
  background-color: #fff;
  margin: 10% auto;
  max-width: 1046px;
  width: 90%;
  border-radius: 10px;
  animation-name: fp_modalopen;
  animation-duration: 1s;
  position: relative;
}
.fp_modal .fp_modal-box .fp_modalClose {
  position: absolute;
  top: 0;
  right: 0;
}
.fp_modalClose .batsu {
  display: block;
  position: relative;
  width: 30px;
  height: 30px;
}
 
.fp_modalClose .batsu::before, .fp_modalClose .batsu::after { /* 共通設定 */
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px; /* 棒の幅（太さ） */
  height: 16px; /* 棒の高さ */
  background: #333;
}
.fp_modalClose .batsu::before {
  transform: translate(-50%,-50%) rotate(45deg);
}
.fp_modalClose .batsu::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}
.gakka .fp_modal-box .gakka-detail__about-record {
    margin: 0;
    border: none;
}
@media screen and (max-width: 767px) {
    .gakka .fp_modal-box .gakka-detail__box .box-sec__lead .txt-underbar {
        font-size: 3.2vw;
    }
    .fp_modal-box .l-page-desc {
        font-size: 3.2vw;
    }
    .gakka .gakka-detail .fp_modal-box .has-caption-pht figcaption {
        padding: 1vw 2vw 0;
        font-size: 3.2vw;
        line-height: 1.4;
        margin-bottom: -2vw;
    }
    .fp_modal-box .setumei {
        font-size: 2.4vw;
        margin-top: 4vw;
    }
    .gakka .fp_modal-box .gakka-detail__about-record {
        padding: 0;
    }
}
.five-p .l-row-pointBox .pointBox-wrap {
    align-items: anchor-center;
}

/*-- コース紹介 ------------------------------------------------------------*/
.course.value .ttl_lead {
    text-align: center;
    color: #fff;
    @media (width < 768px) {
        text-align: center;
    }
}
.course .c-ttl-base .-lh {
    color: #fff;
}
.course .gakka-detail__course-list__item {
    border-radius: 15px;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    padding: 0;
    border: 2px solid #005038;
}
.course .gakka-detail__course-list__item:before {
    content:none;
}

.course .gakka-detail__course-list__item dl {
    padding: 14px;
    gap: 12px;
    @media (width < 768px){
        gap: 2vw;
    }
}
.course .gakka-detail__course-list__item dt {
    padding-left: 70px;
    position: relative;
    line-height: 1.2;
    @media (width < 768px){
    padding-left: 14vw;
    }
}
.course .gakka-detail__course-list__item dt::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    background-size: contain;
    background-repeat: no-repeat;
    @media (width < 768px){
        width: 12vw;
        height: 12vw;
    }
}
.course .gakka-detail__course-list__item.course01 dt::before {
    background-image: url("/assets/images/gakka/hotel/hotel_icon_01.svg");
}
.course .gakka-detail__course-list__item.course02 dt::before {
    background-image: url("/assets/images/gakka/hotel/hotel_icon_02.svg");
}
.course .gakka-detail__course-list__item.course03 dt::before {
    background-image: url("/assets/images/gakka/hotel/hotel_icon_03.svg");
}
.course .gakka-detail__course-list__item.course04 dt::before {
    background-image: url("/assets/images/gakka/hotel/hotel_icon_04.svg");
}
.course .gakka-detail__course-list__item.course05 dt::before {
    background-image: url("/assets/images/gakka/hotel/hotel_icon_05.svg");
}
.course .gakka-detail__course-list__item dt .sub {
    font-size: 18px;
    font-weight: bold;
    @media (width < 768px){
        font-size: 3.6vw;
    }
}
.course .gakka-detail__course-list__item dt .main {
    color: #005038;
}
.course .gakka-detail__course-list__item dd {
    font-size: 1.8rem;
    line-height: 1.6;
    margin: 0;
    position: relative;
    margin-bottom: -20px;
    @media (width < 768px){
        font-size: 3.6vw;
        margin-bottom: 0;
    }

}





/*-- 目指せる職業 ------------------------------------------------------------*/
.career .ttl_lead {
    text-align: center;
    @media (width < 768px){
        text-align: center;
    }
}
.gakka .gakka-detail__career-list {
    display: grid;
    gap: 32px;
    @media (768px <= width){
        grid-template-columns: repeat(2, 1fr);
    }
}
.gakka-detail__career-data {
    position: relative;
}
.gakka-detail__career-data .career-title-tag {
    position: absolute;
    top: -20px;
    left: 20px;
    z-index: 10;
    background-color: #cfc286;
    border-radius: 50px 30px 30px 8px;
    padding: 8px 25px;
    @media (width < 768px){    
        top: -4vw;
        left: 4vw;
        border-radius: 9vw 6vw 6vw 2vw;
        padding: 1vw 5vw;
    }
}
.career-title-tag p {
    margin: 0;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    @media (width < 768px){    
        font-size: 4.2vw
    }

}
.gakka-detail__career-data .career-content {
    display: flex;
    background-color: #f8f4e4;
    border-radius: 15px;
    overflow: hidden;
    padding: 20px;
    padding-top: 40px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    @media (width < 768px){
        padding: 8vw 3vw 3vw;
    }
}
.career-content .career-image-wrapper {
    flex-shrink: 0;
    width: 40%;
    margin-right: 20px;
    @media (width < 768px){
        margin-right: 3vw;
    }
}
.career-image-wrapper figure {
    margin: 0;
    width: 100%;
    border-radius: 15px; 
    overflow: hidden;
}
.career-image-wrapper img {
    display: block;
    width: 100%;
    height: 100%; 
    object-fit: cover;
}
.career-content .career-text-area {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    position: relative;
}
.career-text-area .description-text {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 1.8rem;
    line-height: 1.6;
    @media (width < 768px){
        font-size: 3.6vw;
        line-height: 1.4;
    }
}
.career-text-area .description-text.gold {
    color: #cfc286;
    margin-bottom: 0;
}
.career-text-area .detail-link {
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 18px;
    font-weight: bold;
    color: #005038;
    margin: 0;
    padding-right: 35px;
    cursor: pointer;
    @media (width < 768px){
        font-size: 3.6vw;
        padding-right: 8vw;
    }
}

.career-text-area .detail-link::after {
    content: "▶";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 25px;
    height: 25px;
    background-color: #005038;
    border-radius: 50%;
    color: white;
    font-size: 12px;
    text-align: center;
    line-height: 25px;
    padding-left: 2px;
    @media (width < 768px){
        width: 6vw;
        height: 6vw;
        font-size: 3.6vw;
        line-height: 1.6;
        padding-left: 1vw;
    }
}
/*-- 在校生の声 ------------------------------------------------------------*/
.gakka .gakka-detail__box.interview .box-sec__student-card>li {
    border: 0;
    background: #fff;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
}
@media print, screen and (min-width: 768px) {
    .gakka .gakka-detail__box.interview .box-sec__student-card {
        grid-template-columns: repeat(1, 1fr);
        max-width: 600px;
        margin: 0 auto;
    }
}
/*-- 豊富なカリキュラム ------------------------------------------------------------*/
.gakka-detail__calendar .scroll {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    @media (768px <=width) {
        overflow: visible;
    }
}
.gakka-detail__calendar .scroll::-webkit-scrollbar {
    height: 8px;
    @media (768px <=width) {
        display: none;
    }
}
.gakka-detail__calendar .scroll::-webkit-scrollbar-thumb {
    background: #999;
    border-radius: 4px;
}
.gakka-detail__calendar .scroll::-webkit-scrollbar-track {
    background: #eee;
}
.gakka-detail__calendar .scroll .calendar-item {
    flex: 0 0 100%;
    scroll-snap-align: start;
    margin-bottom: 2rem;
    @media (768px <=width) {
        flex: 1;
        margin-bottom: 0;
    }
}
/*-- 訪問者別 ------------------------------------------------------------*/
.gakka-homonsha ul li {
    border-bottom: 1px solid #ccc;
}
.gakka-homonsha ul li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    color: #000;
    padding: 12px 16px;
    font-size: 16px;
    transition: background-color 0.3s;
}
.gakka-homonsha ul li a:hover {
    background-color: #f5f5f5;
}
@media screen and (min-width: 768px) {
    .gakka-homonsha ul {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4px 40px;
    }
    .gakka-homonsha ul li {
        border-bottom: none;
    }
    .gakka-homonsha ul li a {
        border-bottom: 1px solid #ccc;
    }
}
.gakka .gakka-detail__tab__btn .btn-nav.four-types {
    grid-template-columns: repeat(4, 1fr);
}












.ta-center_pc {
    text-align: center;
    @media (width < 768px){
        text-align: start;
    }
}
.micro-copy{
    position: absolute;
    color: var(--icon-bg);
    text-align: center;
    top: -40px;;
    right: 0;
    left: 0;
    font-weight: 700;
    font-size: 2.2rem;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000;
    @media (width < 768px){
        position: relative;
        top: 0;
        font-size: 4.8vw;
    }    
}
@media screen and (max-width: 767px) {
    .gakka .gakka-detail__head {
        padding-block: 14.9333333333vw 6vw;
    }
}

/*-----  トップスライダーバナー  ---------------------------------------------------------------------------------ここから-----*/
.top_sb .top_slide {
    position: relative;
}
.top_sb .l-inner {
    max-width: 1106px;
    @media (width < 768px) {
        padding-inline: 0;
    }
}
.top_sb .banner_bg {
    width: 70%;
    height: 100%;
    top: 0;
    background-color: #f8f4e4;
    position: absolute;
    margin: 0 15%;
    border-radius: 20px;
    @media (width < 768px) {
        width: 90%;
        margin: 0 5%;
    }
}
.top_sb .top_slide ul {
    padding: 40px 0;
}
.top_sb .top_slide li {
    padding: 10px;
}
.top_sb .top_slide a {
    display: block;
    text-decoration: none;
    position: relative;
}
.top_sb .top_slide img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.top_sb .pickup-tag {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: #CCCD22;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    padding: 2px 12px;
    border-radius: 16px 16px 16px 0;
    z-index: 8;
}
.top_sb .slick-dots {
    bottom: -30px;
}
.top_sb .slick-dots li button:before {
    font-size: 10px;
    color: #ccc;
}
.top_sb .slick-dots li.slick-active button:before {
    color: #333;
}
.top_sb .slick-prev, .top_sb .slick-next {
    z-index: 7;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #222222 !important;
    opacity: 0.8;
    transition: opacity 0.2s;
}
.top_sb .slick-prev:hover, .top_sb .slick-next:hover {
    opacity: 1;
}
.top_sb .slick-prev:before, .top_sb .slick-next:before {
    font-size: 20px;
    line-height: 1;
    color: white;
    font-weight: bold;
}
.top_sb .slick-prev:before {
    content: '＜';
}
.top_sb .slick-next:before {
    content: '＞';
}
@media screen and (max-width: 767px) {
    .top_sb .slick-prev {
        left: 0px;
    }
    .top_sb .slick-next {
        right: 0px;
    }
    .top_sb .top_slide .slick-slide {
        opacity: 0.4;
        transition: opacity .3s;
    }
    .top_sb .top_slide .slick-center {
        opacity: 1;
    }
}
@media screen and (min-width: 768px) {
    .top_sb .slick-prev {
        left: -50px;
    }
    .top_sb .slick-next {
        right: -50px;
    }
}

/* ヘッダー部分のレイアウト */
.topics_sb .topics_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.topics_sb .topics_title {
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 0.1em;
}
.topics_sb .topics_nav {
    display: flex;
    align-items: center;
    gap: 15px;
}
/* 分数表示のスタイル */
.topics_sb .slick-counter {
    font-weight: bold;
    background: transparent; /* 背景透過 */
    padding: 0 15px;
    font-size: 14px;
    min-width: 60px;
    text-align: center;
}
/* Slickの矢印をヘッダー内に収める設定 */
.topics_sb .slick-arrows {
    display: flex;
    gap: 5px;
}
.topics_sb .slick-prev, .topics_sb .slick-next {
    position: static !important;
    transform: none !important;
    width: 35px !important;
    height: 35px !important;
    background: #000;
    border-radius: 4px;
    margin: 0 0 -34px 0;
    display: flex !important;
    align-items: center;
    justify-content: center;
}
/* スライド間の余白調整 */
.topics_sb .top_slide ul li {
    margin: 0 10px;
}
.topics_sb .top_slide img {
    width: 100%;
    height: auto;
    border-radius: 0; /* 必要に応じて調整 */
}
.topics_sb .slick-prev:before, .topics_sb .slick-next:before {
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 0.3;
    opacity: 1 !important;
    font-family: serif; /* 記号を綺麗に見せるため */
}
.topics_sb .slick-prev:before {
    content: '<';
}
.topics_sb .slick-next:before {
    content: '>';
}
.topics_sb .custom-pager {
    display: flex;
    align-items: center;
    border-radius: 4px;
    padding: 4px;
    gap: 0;
}
/* 矢印ボタンの共通設定 */


/* 矢印をホバーした時の色（お好みで） */
.topics_sb .slick-prev:hover, .topics_sb .slick-next:hover {
    background: #666;
}


/* PC版の横幅を上のバナーと合わせる */
@media screen and (min-width: 768px) {
    .topics_sb .l-inner {
        max-width: 1046px; /* 上のバナーを囲っている要素の最大幅 */
        margin: 0 auto;
        padding: 0; /* 左右のパディングを一度リセット */
    }

    /* 画像同士の隙間をmarginで作るとハミ出すため、paddingで調整します */
    .topics_sb .top_slide ul {
        margin: 0 -10px; /* 左右の隙間を打ち消してバナーと端を合わせる */
    }

    .topics_sb .top_slide ul li {
        margin: 0; 
        padding: 0 10px; /* ここで隙間を作る */
        box-sizing: border-box;
    }
    /* スライドが少ない時にナビゲーションを隠す */
    .topics_sb .topics_nav.is-hidden {
        display: none;
    }
}
/*-----  トップスライダーバナー  ---------------------------------------------------------------------------------ここまで-----*/

/*----  韓国語学科ページ改修  ----------------------------------------------------------------------------------------*/
.korean figure .circle.henko {
    display: grid;
    position: absolute;
    bottom: 50px;
    right: 74px;
    place-items: center;
    width: 128px;
    height: 128px;
    translate: 0 -50%;
    border-radius: 50%;
    background-color: var(--main-color);
    color: #fff;
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.5;
    text-align: center;
    @media (width < 768px) {
        top:54%;
        right: 6%;
        font-size: 1.3rem;
        line-height: 1.5;
        width: 20vw;
        height: 20vw;
    }
}
.korean figure .circle.henko small {
    font-weight: 500;
    font-size: 1.6rem;
    @media (width < 768px) {
        font-weight: 500;
        font-size: 1rem;
    }
}
.korean .henko .korean__about__cont .splide__pagination { position: relative;}
.gakka .gakka-detail__course-list__item.henko>dl>dt span.main {
    color: var(--main-color);
}
.gakka .gakka-detail__course-list__item.henko>dl>dd.sub {
    font-weight: 700;
    font-size: 1.4rem;
}
.gakka .gakka-detail__course-list__item>dl>dd .global-course {
    flex-wrap: wrap;
}



/* ====  学科紹介セクション（.course）改修用追加スタイル  ====ここから= */

/* セクション全体の背景色調整 */
.course.kaishu {
    background-color: #fdfde3 !important; /* 画像に基づいた薄い黄色 */
}
.course.kaishu .c-ttl-bubble .sub {
    background: #8b8b65; /* オリーブ色のラベル */
}
/* グリッドレイアウトの設定 */
.course.kaishu .course__list.c-list-course {
    display: grid !important;
    gap: 15px !important;
}

/* PC版：5カラム  SP版：2カラム */
    .course.kaishu .course__list.c-list-course {
        grid-template-columns: repeat(5, 1fr) !important;
        grid-template-rows: repeat(2, 1fr); !important;
    }
        @media (width < 768px) {
            .course.kaishu .course__list.c-list-course {
                grid-template-columns: repeat(2, 1fr) !important;
                gap: 20px 10px !important;
            }
        }

/* カードのデザイン */
.course.kaishu .course__item.c-list-course__item {
    width: 100% !important;
    margin: 0 !important;
}

.course.kaishu .course__item.c-list-course__item a {
    display: block;
    text-decoration: none;
    transition: opacity 0.3s;
}

.course.kaishu .course__item.c-list-course__item a:hover {
    opacity: 0.8;
}

.course.kaishu .card-head {
    position: relative;
    overflow: hidden;
    border-radius: 12px; /* 画像のような角丸 */
    aspect-ratio: 16 / 11;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.course.kaishu .card-head img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 各学科のタイトルバー（画像下部にオーバーレイ） */
.course.kaishu .card-ttl {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0;
    padding: 5px 2px;
    text-align: center;
    color: #fff;
}

.course.kaishu .card-ttl .main {
    font-size: 13px;
    font-weight: bold;
    display: block;
    letter-spacing: -0.05em;
}

/* --- 各学科のイメージカラー設定（画像33333.jpgに基づく） --- */
.course.kaishu .course__item.-railway .card-ttl { background-color: #3b5a9a; }        /* 鉄道 */
.course.kaishu .course__item.-airport .card-ttl { background-color: #40c091; }        /* エアライン */
.course.kaishu .course__item.-hotel .card-ttl { background-color: #56a75a; }          /* ホテル */
.course.kaishu .course__item.-travel .card-ttl { background-color: #7cb0c2; }         /* 旅行 */
.course.kaishu .course__item.-bridal .card-ttl { background-color: #ef6e55; }         /* ブライダル */
.course.kaishu .course__item.-beauty .card-ttl { background-color: #e98297; }         /* ビューティ */
.course.kaishu .course__item.-funeraldirector .card-ttl { background-color: #b18b5b; } /* 葬祭 */
.course.kaishu .course__item.-global .card-ttl { background-color: #72a551; }         /* グローバル */
.course.kaishu .course__item.-korean .card-ttl { background-color: #c45c47; }         /* 韓国語 */
.course.kaishu .course__item.-business .card-ttl { background-color: #4e637b; }       /* ビジネス */

/* ボタンエリアの調整 */
.course.kaishu .top-more-btn {
    margin-top: 40px;
    text-align: center;
}

.course.kaishu .course__list>li a {
     border:none; 
}
        @media (width < 768px) {
    .course.kaishu .course__list>li a {
        padding: 0;
    }
}







/* --- 窓の役割を a タグに持たせる --- */
.l-nav-lg a {
    transition: .3s cubic-bezier(.65,0,.35,1);
    overflow: hidden; /* ここで中の文字を隠す */
    display: block;   /* インライン要素だと overflow が効かないため */
}

/* --- span を「2行分」の高さを持つブロックにする --- */
.l-nav-lg a .link-item {
    display: block;
    position: relative;
    transition: transform .3s cubic-bezier(.65,0,.35,1);
    will-change: transform;
}

/* --- 下に隠れている2行目の文字を CSS で生成する --- */
.l-nav-lg a .link-item::after {
    content: attr(data-text); /* HTMLの data-text の値を表示 */
    position: absolute;
    top: 100%; /* 本体の真下に配置 */
    left: 0;
    width: 100%;
    display: block;
    white-space: nowrap;
}

/* --- ホバー時に span 全体を上にずらす --- */
.l-nav-lg a:hover .link-item {
    transform: translateY(-100%);
}

/* --- 特殊なレイアウト（map等）の微調整 --- */
.l-nav-lg__info a.map {
    display: inline-flex; /* inline-flex でも overflow は効きます */
    align-items: center;
    padding-top: 4px;
    gap: 4px;
}
    
/* --- ボタンのテキスト見切れ修正用の追加スタイル --- */
.l-nav-lg__info a.btn-fill,.l-nav-lg__info a.btn-line {
  padding: 0; /* 削除 */
}

/* ボタンの中のテキスト要素にパディングを移す */
.l-nav-lg__info a.btn-fill .link-item,
.l-nav-lg__info a.btn-line .link-item {
  padding: 8px 24px;
}

/* 擬似要素にも同じパディングを適用し、ボックスサイズを調整する */
.l-nav-lg__info a.btn-fill .link-item::after,
.l-nav-lg__info a.btn-line .link-item::after {
  padding: 8px 24px;
  box-sizing: border-box; /* 重要：パディングを幅・高さに含める */
}



/* --- 最終確定版：アニメーション＋負荷軽減 --- */

/* 1. 閉じている時 */
.l-nav-mega__menu > li > ul.js-accordion-panel {
    display: block !important;
    max-height: 0 !important;
    overflow: hidden !important; /* ←【重要】高さ0からはみ出す中身を隠す */
    opacity: 0;
    visibility: hidden;         /* ←【重要】閉じている時は計算をサボらせる(負荷軽減) */
    transition: max-height 0.5s ease, opacity 0.4s ease, padding 0.4s ease, visibility 0.5s;
    padding: 0 !important;      /* ← 閉じている時は余白も0に（隙間対策の再確認） */
}

/* 2. 開いた時 */
.l-nav-mega__menu > li > .js-accordion-btn.is-opened + ul.js-accordion-panel {
    max-height: 1000px !important; 
    opacity: 1;
    visibility: visible;        /* ← 表示状態にする */
    padding-top: 10px !important;   /* お好みの数値 */
    padding-bottom: 10px !important; /* お好みの数値 */
}





/* --- OCページのトップに戻るボタン設定 --- */
.oc-back-to-anchor {
  position: fixed;
  right: 16px;
  bottom: 16px;
  width: 40px;
  height: 40px;
    z-index: 999;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 18px;
  border: none;
  border-radius: 50%;

  color: #555;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);

  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  cursor: pointer;
}

.oc-back-to-anchor.is-visible {
  opacity: 1;
  pointer-events: auto;
}

/* hover（PC） */
.oc-back-to-anchor:hover {
  background: #fff;
  color: #000;
}

/* スマホ */
@media (max-width: 768px) {
  .oc-back-to-anchor {
    right: 12px;
    bottom: 72px;
    width: 36px;
    height: 36px;
    font-size: 16px;
  }
}




/*-------------- トップページのFV無限ループアニメーション 修正版 --------------*/
.fv_loop {
    width: 100%;
    height: 50svh; /* 親要素にも高さを明示 */
    overflow: hidden;
    position: relative;
    background: #fff;
    touch-action: pan-y; 
}

.fv_loop__inner {
    display: flex;
    width: max-content; 
    min-width: 200%;
    animation: fv_infinity-loop 30s linear infinite;
    will-change: transform;
}

.fv_loop picture {
    flex-shrink: 0;
    line-height: 0;
}

/* 背景ループ画像 */
.fv_loop__inner img {
    display: block;
    width: auto;
    height: 50svh;
    max-height: 50svh;
    object-fit: cover;
}

/* --- 追加：前面固定コピーのスタイル --- */
.fv_loop__copy {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* 真ん中寄せ */
    z-index: 5; /* ループ画像より上に配置 */
    width: 80%; /* スマホ時の横幅（デザインに合わせて調整） */
    max-width: 600px; /* PC時の最大サイズ（デザインに合わせて調整） */
    height: auto;
    pointer-events: none; /* コピー画像の下にあるリンクなどをクリック可能にする */
}

/* モバイル対応 */
@media screen and (max-width: 767px) {
    .fv_loop__inner img {
        height: 50svh;
        width: auto;
    }
    .fv_loop__copy {
        width: 100%; /* スマホでは少し大きく表示 */
    }
}

/* アニメーション：3D加速を有効化 */
@keyframes fv_infinity-loop {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-50%, 0, 0);
    }
}

/*260311 ホテル学科コース改訂*/
.course-section{
max-width:1100px;
margin:auto;
padding:80px 15px;
}

.course-grid{
display:grid;
grid-template-columns:repeat(6,1fr);
gap:25px;
}

/* カード */

.course-card{
background:#fff;
border-radius:12px;
padding:26px 20px 20px;
position:relative;
overflow:hidden;

opacity:0;
transform:translateX(-40px);
transition:all .7s ease;
box-shadow:5px 0px 14px rgba(0,0,0,0.30);	
/*border: 2px solid #000;*/

grid-column:span 2;

display:flex;
flex-direction:column;
}
	
.desc{
font-size:13px;
color:#555;
margin-bottom:12px;
margin-top: 10px;
flex-grow:1;
}	


.course-card.show{
opacity:1;
transform:translateX(0);
}

/* 上の緑ライン */

.card-top{
position:absolute;
top:0;
left:50%;
transform:translateX(-50%);
width:80%;
height:5px;
background:#4abc64;
/*border-radius:3px;*/
}

/* 画像ダミー */

.img img{
border-radius:6px;
margin-bottom:15px;
}

/* タイトル */

.course-card h3{
color:#2fa84f;
font-size:18px;
margin-bottom:10px;
}

/* リード */

.course-card p{
font-size:15px;
line-height:1.8;
margin-bottom:15px;
}

/* 説明 */

.desc{
font-size:13px;
color:#555;
margin-bottom:20px;	
}

/* タグ */

.tags{
margin-top:auto;
display:flex;
flex-wrap:wrap;
gap:6px;
}

.tags span{
font-size:12px;
background:#e7f5ea;
color:#2fa84f;
padding:4px 8px;
border-radius:8px;
}
	
.card-tag{
margin-top:auto;
display:inline-block;
background:#2fa84f;
color:#fff;
padding:6px 14px;
border-radius:20px;
font-size:14px;
}	

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

.course-card:nth-child(4){
grid-column:2 / span 2;
}

.course-card:nth-child(5){
grid-column:4 / span 2;
}

}*/	
	
/* -------------------
タブレット
------------------- */

@media(min-width:501px){

.course-grid{
grid-template-columns:repeat(2,1fr);
}

.course-card{
grid-column:auto;
}

}


/* -------------------
スマホ
------------------- */

@media(max-width:500px){

.course-grid{
  grid-template-columns:1fr;
}

.course-card{
  grid-column:span 1;
  width:100%;
}

}

/*260313 floating banner*/
/* PC・基本サイズ */
.floating-banner {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 180px;
    z-index: 9999;
/* ふわっと表示（任意） */
  transition: opacity 0.3s ease;
}



.floating-banner:hover {
  opacity: 0.85;
}

/* スマホ用の設定 (画面幅が768px以下の時) */
@media screen and (max-width: 768px) {
    .floating-banner {
        width: 120px;
        bottom: 70px;
        right: 10px;
    }

    .close-btn {
        width: 28px;
        height: 28px;
        top: -10px;
        right: -10px;
        font-size: 18px;
    }
    
    /* スマホでは震えないようにする（操作性の低下防止） */
    .floating-banner img:hover {
        animation: none;
    }
}

/* バナー画像 */
.floating-banner img {
    width: 100%;
    height: auto;
    display: block;
    cursor: pointer;
    /* 影をつけて背景と切り離す */
    filter: drop-shadow(0 4px 6px rgba(0,0,0,0.2));
}

/* 閉じるボタン */
.close-btn {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 24px;
    height: 24px;
    background-color: #000;
    color: #fff;
    border-radius: 50%;
    border: 2px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    z-index: 10000;
    text-shadow: none;
}

/* 閉じるボタンのホバー時は震えさせない */
.close-btn:hover {
    animation: none !important;
}

.is-hidden {
    display: none;
}