@charset "UTF-8";

.inner {
    padding: 0 40px 0 80px;
    max-width: 100%;
}

.cmnhd {
    color: #fff;
}

.cmnnav_btn span {
	background: #fff;
}

/* hero */

.hero {
    display: flex;
    justify-content: center;
    position: relative;
    height: 100vh;
}

.hero::after {
    content: '';
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .3;
    position: absolute;
    top: 0;
    left: 0;
}

.hero_movie,
.hero_img {
    width: 100%;
    height: 100vh;
}

.hero img {
    width: 100%;
    /* max-width: 50%; */
    height: 100%;
    object-fit: cover;
}

.hero_cnt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
    z-index: 10;
    width: 100%;
}

.hero_ttl_cnt {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: row-reverse;
    gap: 20px;
    margin-bottom: 20px;
}

.hero_ttl {
    color: #fff;
    text-align: center;
}

.hero_ttl.-ja {
    writing-mode: vertical-rl;
    font-size: 24px;
    letter-spacing: 10px;
}

.hero_info {
    position: absolute;
    bottom: 20px;
    left: 30px;
    background: #000;
    width: fit-content;
    padding: 12px 17px;
    display: flex;
    align-items: center;
    z-index: 101;
}

.hero_info.vis-sp {
    display: none;
}

.hero_info:hover {
    opacity: .7;
}

.hero_info_label {
    font-size: 15px;
    padding-right: 20px;
    margin-right: 20px;
    border-right: solid 1px #797979;
    color: #fff;
}

.hero_info_ttl {
    font-size: 14px;
    color: #fff;
}

.hero_link {
    position: fixed;
    bottom: 20px;
    right: 30px;
    display: flex;
    justify-content: right;
    gap: 20px;
    width: 100%;
    z-index: 1000;
}

.hero_link a {
    display: block;
    text-align: center;
    width: 100%;
    max-width: 211px;
    padding: 10px 20px;
    color: #fff;
    border-radius: 3px;
    background: linear-gradient(to right, #2637BA, #0E1738 40%);
}

.hero_link a:hover {
    opacity: .7;
}


/* intro */

.intro {
    position: relative;
    padding: 130px 0 50px;
}

.intro::before {
    content: '';
    width: 434px;
    height: 434px;
    background: url(/img/cmn/bg-circle.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    top: 560px;
    left: 50%;
    transform: translateX(-50%);
}
.intro::after {
    content: '';
    width: 434px;
    height: 434px;
    background: url(/img/cmn/bg-circle.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    bottom: 50px;
    left: -5%;
    z-index: -1;
}

.intro_ttl {
    writing-mode: vertical-rl;
    font-size: 17px;
    letter-spacing: 5px;
    position: absolute;
    top: 45px;
    left: 3%;
}

.intro_cnt {
    display: flex;
    justify-content: space-between;
    gap: 10%;
    position: relative;
    margin-bottom: 100px;
}

.icon-toyama_sushi {
    position: absolute;
    right: 0%;
    bottom: -22%;
}

.intro_cnt.-right {
    justify-content: right;
}

.intro_cnt.-left {
    justify-content: left;
    align-items: center;
    gap: 20%;
}

.intro_cnt.-left .intro_cnt_img {
    width: 45%;
}

.intro_cnt.-left .intro_cnt_img img {
    position: absolute;
    bottom: -5%;
    right: -15%;
    z-index: 10;
}

.intro_cnt.-center {
    align-items: center;
}

.intro_cnt_row_ttl {
    font-size: 28px;
    line-height: 60px;
    margin-bottom: 20px;
    font-weight: 700;
}

.intro_cnt_row_date {
    padding: 20px 10px;
    font-size: 22px;
    line-height: 50px;
    border-top: solid 1px #000;
    border-bottom: solid 1px #000;
    margin-bottom: 20px;
}

.intro_cnt_row_txt {
    font-size: 15px;
    line-height: 30px;
}


/* info */

.info {
    margin-bottom: 300px;
}

.info_wrapper {
    display: flex;
    justify-content: right;
    gap: 5%;
}

.info_ttl {
    font-size: 24px;
}

.info_list {
    width: 100%;
    max-width: 990px;
    margin-bottom: 30px;
}

.info_list li a {
    display: block;
    padding: 25px 30px 25px 10px;
    border-bottom: solid 1px #B4B4B4;
    position: relative;
}

.info_list li a::after {
    content: '';
    width: 8px;
    height: 7px;
    background: url(/img/cmn/icon-arrow.svg) no-repeat center center;
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    transition-duration: .5s;
}

.info_list li a:hover::after {
    right: 0px;
}

.info_list li:first-child a {
    border-top: solid 1px #B4B4B4;
}

.info_list li a .info_date,
.info_list li a .info_ttl {
    font-size: 15px;
}


/* course */

.course {
    background: linear-gradient(to bottom, #0C1534, #203076, #151848, #000000);
    padding: 400px 0 150px;
    position: relative;
}

.course .inner {
    max-width: 1140px;
}

.hero_course {
    position: absolute !important;
    top: -70px;
    left: 0;
}

.course_ttl {
    writing-mode: vertical-rl;
    font-size: 17px;
    position: absolute;
    top: -107px;
    right: 5%;
    letter-spacing: 5px;
}

.course_ttl span {
    color: #fff;
}

.course_intro {
    color: #fff;
    font-size: 28px;
    writing-mode: vertical-rl;
    letter-spacing: 10px;
    position: absolute;
    top: 160px;
    right: 12%;
}

.course_cnt {
    width: 80%;
    padding: 30px;
    margin-bottom: 120px;
    border: solid 1px #fff;
    /* background: linear-gradient(to right, #514B21, #514B21, rgba(0, 0, 0, 0)); */
}

.course_cnt_ttl {
    color: #fff;
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 30px;
}

.course_price {
    display: flex;
    margin-bottom: 30px;
}

.course_txt {
    color: #fff;
}

.course_price_ttl {
    padding-right: 30px;
    margin-right: 30px;
    border-right: solid 0.5px #fff;
    color: #fff;
    font-size: 22px;
    font-weight: bold;
}

.course_price_txt {
    font-weight: 400;
    color: #fff;
    font-size: 22px;
    font-weight: bold;
}

.course_wrapper {
    display: flex;
    justify-content: space-between;
    gap: 120px 30px;
    flex-wrap: wrap;
    margin-bottom: 190px;
}

.img-course {
    margin-bottom: 40px;
}

.course_item {
    width: 100%;
    max-width: 452px;
}

.course_item:nth-child(2) {
    margin-top: 150px;
}

.course_item:nth-child(3) {
    margin-top: -180px;
}

.course_item_ttl {
    font-size: 23px;
    margin-bottom: 20px;
    color: #fff
}

.course_item_txt {
    color: #fff;
}

.acquisition {
    display: flex;
    align-items: center;
    justify-content: right;
    gap: 12%;
    position: relative;
    padding-left: 40px;
}

.acquisition::before {
    content: '';
    width: 640px;
    height: 640px;
    background: url(/img/cmn/bg-acquisition.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    top: -130px;
    right: 290px;
}

.acquisition_ttl {
    font-size: 32px;
    line-height: 50px;
    color: #fff;
    margin-bottom: 60px;
}

.acquisition_txt {
    color: #fff;
}

.img-acquisition {
    position: relative;
}

/* bnr */

.bnr {
    width: 100%;
    position: relative;
}

.bnr::after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .3;
    position: absolute;
    top: 0;
    left: 0;
}

.bnr img {
    width: 100%;
    height: auto;
}


/* flow */

.flow {
    padding: 150px 0 100px;
    position: relative;
}

.flow .inner {
    max-width: 1220px;
}

.flow_ttl {
    writing-mode: vertical-rl;
    font-size: 17px;
    letter-spacing: 5px;
    position: absolute;
    top: 45px;
    left: 3%;
}

.flow_cnt {
    display: flex;
    justify-content: space-between;
    gap: 10%;
    position: relative;
}

.flow_cnt_row_ttl {
    font-size: 28px;
    line-height: 60px;
    margin-bottom: 20px;
}

.teacher_wrap {
    display: flex;
    gap: 40px;
    margin-bottom: 20px;
}

.img-teacher {
    width: 100%;
    max-width: 270px;
}

.img-teacher img {
    width: 100%;
    height: auto;
}

.teacher_cnt {
    flex: 1;
}

.teacher_cnt_ttl {
    margin-bottom: 20px;
}

.teacher_cnt_name.-ja {
    font-size: 24px;
    line-height: 35px;
}

.teacher_cnt_name.-en {
    margin-bottom: 30px;
}

.flow_cnt_row_txt {
    font-size: 15px;
    line-height: 30px;
    margin-bottom: 80px;
}

.img-flow {
    margin-bottom: 30px;
}

.flow_cnt_img {
    position: absolute !important;
    bottom: 7%;
    right: 0;
    width: 100%;
    max-width: 530px;
}

.flow_cnt_img a {
    display: block;
    padding: 45px 30px;
    width: 100%;
    border: solid 1px #777777;
    text-align: center;
}

.flow_cnt_img a:hover {
    opacity: .7;
}

.flow_list_ttl {
    font-size: 28px;
    margin-bottom: 35px;
}

.flow_list ul {
    display: flex;
    justify-content: space-between;
}

.flow_list ul li {
    width: 100%;
    max-width: 280px;
    height: 170px;
    position: relative;
    padding: 20px 25px;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 19px;
    background: linear-gradient(to right, #746217, rgba(126, 105, 22, 0.7));
}

.flow_number {
    font-size: 20px;
    position: absolute;
    top: 10px;
    right: 20px;
}

.flow_recruit img {
    margin: 0 auto;
}


/* 動き */

.scroll_event {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 2s ease, transform 2s ease;
  will-change: opacity, transform;
}

/* ▼ フェードイン発火 */
.scroll_event.visible {
  opacity: 1;
  transform: translateY(0);
}

.scroll_img {
  position: relative;
}

/* ▼ 中の画像をスクロールで動かす用。transform-origin: center; 推奨 */
.scroll_img img {
  display: block;
  /* width: 100%; */
  height: auto;
  transform: translateY(var(--float, 0px));
  transition: transform 0.2s ease-out; /* 少し滑らかに追従 */
  will-change: transform;
}


@media screen and (max-width:1240px) {
}

@media screen and (max-width:767px) {

    .inner {
        padding: 0 20px 0 15px;
    }
    

    /* hero */

    .hero {
        flex-flow: column-reverse;
    }

    .hero_ttl.-ja {
        font-size: 20px;
        letter-spacing: 7px;
    }

    .hero_movie,
    .hero_img {
        height: 50vh;
    }

    .hero_info {
        position: unset;
        width: 90%;
        margin: 30px auto 0;
        flex-flow: column;
        align-items: start;
    }

    .hero_info.vis-sp {
        display: flex;
    }

    .hero_info.hide-sp {
        display: none;
    }

    .hero_info_label {
        border-right: none;
        position: relative;
    }

    .hero_info_label::after {
        content: '';
        width: 20px;
        height: 1px;
        background: #797979;
        position: absolute;
        right: -10px;
        top: 50%;
        transform: translateY(-50%);
    }

    .hero_link {
        bottom: 2%;
        right: 50%;
        transform: translateX(50%);
        width: 95%;
    }

    .hero_link a {
        max-width: unset;
    }

    .intro {
        overflow-x: clip;
    }

    .intro_cnt {
        flex-flow: column;
        gap: 40px;
        margin-bottom: 50px;
    }

    .intro_cnt.-right {
        flex-flow: column-reverse;
        align-items: end;
    }

    .intro_cnt.-left {
        align-items: start;
    }

    .intro_cnt_img {
        max-width: 290px;
        margin-bottom: 60px;
    }

    .intro_cnt.-left .intro_cnt_img {
        width: 100%;
    }

    .intro_cnt.-left .intro_cnt_img img {
        width: 60%;
    }

    .intro_cnt_row_ttl {
        font-size: 22px;
        line-height: 40px;
    }

    .intro_cnt_row_date {
        font-size: 17px;
        line-height: 30px;
        padding: 10px;
    }

    .intro::before {
        width: 300px;
        height: 300px;
        top: 280px;
        left: 10%;
    }

    .intro::after {
        width: 300px;
        height: 300px;
        bottom: 330px;
        left: unset;
        right: -25%;
    }

    .icon-toyama_sushi {
        right: 0;
        bottom: -64%;
        width: 70px;
    }

    .info {
        margin-bottom: 150px;
    }

    .info_wrapper {
        flex-flow: column;
        align-items: start;
    }

    .info_ttl {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .info_list li a {
        padding: 20px 30px 20px 10px;
    }

    /* course */

    .course {
        padding: 130px 0 100px;
    }

    .hero_course {
        width: 85%;
        top: -60px;
    }

    .course_intro {
        position: unset;
        margin: 0 auto 50px;
        font-size: 24px;
    }

    .course_ttl {
        top: 130px;
        color: #fff;
    }

    .course_cnt {
        width: 100%;
    }

    .course_cnt_ttl {
        font-size: 24px;
    }

    .course_price {
        flex-flow: column;
    }

    .course_price_ttl {
        padding-bottom: 30px;
        margin-bottom: 30px;
        border-right: none;
        border-bottom: solid 0.5px #fff;
        margin-right: 0;
    }

    .course_price_txt {
        font-size: 20px;
    }

    .course_txt {
        font-size: 14px;
    }

    .course_wrapper {
        gap: 70px;
    }

    .course_item:first-child {
        max-width: 92%;
    }

    .course_item:nth-child(2) {
        max-width: 80%;
        margin: 0 0 0 auto;
    }

    .course_item:nth-child(3) {
        max-width: 86%;
    }

    .course_item:nth-child(4) {
        max-width: 80%;
        margin: 0 0 0 auto;
    }




    .course_item:nth-child(2),
    .course_item:nth-child(3) {
        margin-top: 0;
    }

    .course_item .img-course {
        max-width: 273px;
    }

    .course_item:nth-child(2n) .img-course {
        max-width: 228px;
    }

    .img-course {
        margin-bottom: 20px;
    }

    .course_item_ttl {
        margin-bottom: 10px;
        font-size: 17px;
    }

    .course_item_txt {
        font-size: 14px;
    }



    /* acquisition */

    .acquisition {
        flex-flow: column-reverse;
        padding-left: 24px;
    }

    .img-acquisition {
        width: 90%;
        margin: 0 0 50px auto;
    }

    .acquisition::before {
        width: 350px;
        height: 350px;
        top: -100px;
        right: 50%;
        transform: translateX(50%);
    }

    .acquisition_cnt {
        padding: 0 24px;
    }

    .acquisition_ttl {
        font-size: 22px;
        line-height: 35px;
        margin-bottom: 30px;
    }

    .acquisition_txt {
        font-size: 14px;
    }

    .bnr {
        height: 270px;
    }

    .bnr img {
        height: 100%;
        object-fit: cover;
    }

    /* flow */

    .flow {
        padding: 100px 0 0;
    }

    .flow_cnt {
        flex-flow: column;
        padding-left: 15%;
        margin-bottom: 100px;
    }

    .flow_cnt_row_ttl {
        font-size: 22px;
        line-height: 35px;
    }

    .teacher_wrap {
        flex-flow: column;
        gap: 20px;
    }

    .teacher_cnt_ttl {
        margin-bottom: 10px;
    }

    .teacher_cnt_name.-en {
        margin-bottom: 10px;
    }

    .flow_cnt_img {
        position: relative !important;
        bottom: unset;
        right: unset;
    }

    .flow_cnt_row_txt {
        font-size: 14px;
        margin-bottom: 50px;
    }

    .flow_recruit img {
        max-width: 128px;
        margin: 0 auto;
    }

    .flow_cnt_img a {
        padding: 20px 30px;
    }

    .flow_list_ttl {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .flow_list ul {
        flex-flow: column;
        gap: 10px;
    }

    .flow_list ul li {
        max-width: 100%;
        height: 103px;
    }




    


}