html {
    scroll-behavior: smooth;
}

/* @media screen and (min-width: 801px) { */
@media screen and (min-width: 1200px) {
    body {
        width: 1200px;
        font-family: Noto Serif JP;
    }
    .ly_menu-2 {
        display: none;
    }

    .hamburger {
        display: none;
    }

    .ly_body {
        height: 100%;
        position: relative;
        background: white;
        flex-direction: column;
        align-items: flex-start;
        display: flex;
    }

    .ly_auto-height {
        height: calc(var(--vh, 1vh) * 100);
    }

    .ly_top {
        width: 100vw;
        min-width: 100%;
        min-height: 700px;
        background-image: url(../../assets/images/top.jpg);
        display: flex;
        align-items: center;
        justify-content: center;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .ly_top-wrapper {
        width: 1200px;
        height: 100%;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        display: flex;
    }

    .ly_header { 
        width: 409px;
        height: 100%;
        /* height: 1164px; */
        padding-top: 40px;
        padding-bottom: 70px;
        padding-left: 66px;
        padding-right: 49px;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        display: flex;
    }

    .ly_menu {
        align-items: flex-start;
        display: inline-flex;
        flex-direction: column;
        gap: 7px;
        justify-content: flex-start;
        width: 172px;
    }

    .el_menu {
        width: 132px;
        height: 33px;
        color: #FFFCFC;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
    }

    .bl_header {
        padding-left: 52px;
    }

    .bl_header-logo {
        width: 312px;
        height: 458px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-end;
    }

    .el_header-logo {
        width: 100px;
    }

    .el_header-logo-caption {
        width: 142px;
        height: 89px;
        color: #FFFCFC;
        font-size: 19px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
        padding-bottom: 120px;
        margin-left: -28px;
    }

    .ly_top-right {
        display: flex;
        justify-content: flex-end;
        align-items: flex-end;
        gap: 10px;
        flex-direction: column;
        height: 100%;
        padding-top: 80px;
        padding-right: 32px;
        padding-bottom: 40px;
    }

    .bl_tel {
        width: 41px;
        height: 296px;
        background: #4F7302;
        display: flex;
        flex-direction: row;
        align-items: center;
        writing-mode: vertical-rl;
        padding-top: 12px;
        gap: 12px;
        position: fixed;
        top: 20px;
        right: 30px;
        z-index: 1000;
    }

    .el_tel {
        color: #FFFBFB;
        font-size: 20px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 8.20px;
        word-wrap: break-word;
    }

    .ly_news {
        width: 500px;
        padding-left: 30px;
        padding-right: 30px;
        padding-top: 27px;
        padding-bottom: 27px;
        background: rgba(75, 75, 75, 0.51);
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 19px;
        display: flex;
    }

    .ly_news-header {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 12px;
    }

    .ly_news h2 {
        color: #FFFEFE;
        font-size: 18px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
    }

    #news_content {
        display: contents;
        gap: 19px;
    }

    .ly_news #news_content dl {
        color: #FFFDFD;
        font-size: 14px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
        display: table;
        width: 100%;
    }

    .ly_news #news_content dt {
        display: table-cell;
    }

    .ly_news #news_content dd {
        padding-left: 32px;
        display: table-cell;
        width: 100%;
    }

    .bl_scroll {
        width: 100vw;
        writing-mode: vertical-rl;
        display: flex;
        flex-direction: row;
        position: absolute;
        align-items: center;
        top: -68px;
    }

    .bl_scroll span {
        color: #FFFBFB;
        font-family: Noto Serif JP;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        font-size: 12px;
    }

    .el_scroll-line {
        font-size: 18px;
        padding-top: 8px;
        padding-right:3px;
    }

    .ly_about-wrapper {
        width: 100vw;
        min-width: 100%;
        padding-top: 80px;
        padding-bottom: 80px;
        padding-left: 100px;
        padding-right: 100px;
        background: linear-gradient(102deg, #4F7302 0%, rgba(10.35, 14.88, 0.68, 0.92) 100%, rgba(79, 115, 2, 0) 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        min-height: 800px;
    }

    .ly_about {
        width: 1000px;
        justify-content: center;
        align-items: flex-start;
        gap: 59px;
        display: flex;
        flex-direction: row-reverse;
        /* writing-mode: vertical-rl; */
        text-orientation: upright;
        /* min-height: 800px; */
    }

    .ly_about h2 {
        width: 56px;
        color: #FFFDFD;
        font-size: 32px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        word-wrap: break-word;
        text-orientation: upright;
        border-left: 1px solid #FFFDFD;
        height: auto;
    }

    .ly_about h3 {
        padding-right: 16px;
        word-wrap: break-word;
        text-orientation: sideways;
        writing-mode: vertical-rl;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
    }

    .ly_about div {
        width: 100%;
        /* height: auto; */
        color: #FFFDFD;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 300;
        line-height: normal;
        writing-mode: vertical-rl;
        letter-spacing: 10px;
    }

    .ly_about .bl_header {
        height: 328px;
    }

    .bl_about-title {
        justify-content: center;
        align-items: flex-start;
        gap: 15px;
        display: flex;
    }

    .el_about-content {
        height: 450px;
    }

    .ly_course {
        width: 100vw;
        min-width: 100%;
        background: #262626;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 25px;
        display: inline-flex;
    }

    .bl_course-content {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        padding-top: 156px;
    }

    .bl_course-header {
        display: flex;;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .bl_course-content h2 {
        writing-mode: vertical-rl;
        color: #FFF;
        font-family: Noto Serif JP;
        font-size: 32px;
        line-height: normal;
        padding: 40px;
    }

    .bl_course-content h3 {
        padding: 30px;
        color: #FFF;
        font-family: Noto Serif JP;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 16.83px;
        text-indent: 16.83px;
    }

    .bl_course-content hr {
        width: 100%;
        height: 1px;
        color: #FFF;
        stroke-width: 1px;
    }

    .bl_course-content span {
        color: #FFF8F8;
        text-align: center;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 2.97px;
        text-indent: 2.97px;
    }

    .bl_course-content table {
        color: #FFF;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 2.97px;
        text-indent: 2.97px;
        table-layout: fixed;
    }

    .bl_course-content img {
        padding-top: 28px;
        width: 810px;
    }

    .bl_course-content-supplementation {
        padding-top: 112px;
        text-align: center;
        hegiht: 100%;
        padding-bottom: 112px;
    }

    .el_course-name {
        width: 180px;
    }

    .el_course-price {
        width: 180px;
        text-align: end;
    }

    .ly_course-detail {
        width: 1006px;
        height: 689px;
    }

    .ly_shokuzai {
        min-height: 700px;
        height: 100vh;;
        width: 100vw;
        min-width: 100%;
        background: #262626;
        display: flex;
        height: 936px;
        padding: 56px 41px;
        align-items: flex-start;
        gap: 37px;
        flex-shrink: 0;
        color: #FFF8F8;
        justify-content: center;
    }

    .bl_shokuzai-img {
        position: relative;
    }

    .bl_shokuzai-img img {
        width: 810px;
    }

    .bl_shokuzai-content {
        margin-left: 25px;
        padding-top: 20px;
        padding-left: 29px;
        padding-right: 29px;
        padding-bottom: 29px;
        width: 516px;
        background: rgba(0, 0, 0, 0.53);
    }

    .el_align-left_buttom {
        position: absolute;
        left: 29px;
        bottom: 29px;
    }

    .el_align-right_buttom {
        position: absolute;
        right: 29px;
        bottom: 29px;
    }

    .bl_shokuzai-content h2 {
        color: #FFFDFD;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 10.56px;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .bl_shokuzai-content span {
        padding-top: 18px;
        color: #FFFDFD;
        text-align: justify;
        font-family: Noto Serif JP;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 3.92px;
        text-indent: 3.92px;
    }

    .bl_shokuzai-header {
        writing-mode: vertical-rl;
    }

    .bl_shokuzai-header h3 {
        color: #FFF;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 13.36px;
        text-indent: 13.36px;
        padding-right: 10px;
    }

    .bl_shokuzai-header h2 {
        overflow: hidden;
        color: #FFF;
        text-overflow: ellipsis;
        white-space: nowrap;
        letter-spacing: 13.36px;
        text-indent: 13.36px;

        /* 基本 */
        font-family: Noto Serif JP;
        font-size: 32px;
        font-style: normal;
        font-weight: 300;
        line-height: normal;
        border-left: 1px solid #FFFDFD;
        height: fit-content;
        padding-left: 10px;
    }

    .ly_drink-wrapper {
        width: 100vw;
        min-width: 100%;
        background: #B7B0B0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .ly_drink {
        width: 1200px;
        padding-top: 100px;
        padding-bottom: 40px;
        background: #B7B0B0;
        justify-content: flex-end;
        align-items: center;
        display: flex;
        flex-direction: column;
    }

    .ly_drink-header {
        background: #B7B0B0;
        justify-content: flex-end;
        align-items: flex-end;
        display: flex;
        flex-direction: row;
        gap: 20px;
    }

    .ly_drink-header h2 {
        width: 205px;
        height: 44px;
        color: #151010;
        font-size: 32px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        text-indent: 14.08px;
        word-wrap: break-word;
        border-bottom: 1px solid #151010; /* 下線のスタイルを設定 */
    }

    .ly_drink-header h3 {
        width: 201px;
        height: 29px;
        color: #151010;
        font-size: 18px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
        text-indent: 13.50px;
        word-wrap: break-word;
        padding-top: 20px;
    }

    .ly_drink-header img {
        box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.25);
    }

    .ly_drink-detail {
        padding-top: 24px;
        color: #4B4B4B;
    }

    .ly_kenzo-wrapper {
        width: 100vw;
        min-width: 100%;
        background: #B7B0B0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .ly_kenzo {
        width: 1200px;
        padding-bottom: 45px;
        background: #B7B0B0;
        justify-content: flex-start;
        align-items: flex-end;
        display: flex;
        flex-direction: row;
        gap: 59px;
    }

    .bl_kenzo-img {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-end;
    }

    .bl_kenzo-img p {
        color: #4B4B4B;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 2.64px;
        text-indent: 2.64px;
    }

    .el_kenzo-img {
        box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.25);
    }

    .ly_kenzo-detail {
        width: 100%;
    }

    .ly_kenzo-detail h2 {
        color: #4B4B4B;
        width: 100%;
        height: 44px;
        color: #151010;
        font-size: 32px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        text-indent: 14.08px;
        word-wrap: break-word;
    }

    .ly_kenzo-detail hr {
        width: 205px;
    }

    .ly_kenzo-detail-content {
        color: #4B4B4B;
        width: 400px;
        padding-top: 70px;
        padding-bottom: 23px;
    }

    .ly_pictures {
        width: 100vw;
        min-width: 100%;
        padding-left: 245px;
        padding-right: 245px;
        padding-bottom: 173px;
        background: #262626;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 142px;
        display: inline-flex
    }

    .ly_pictures-title {
        padding-top: 173px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        display: flex;
    }

    .ly_pictures-title-h2 {
        width: auto;
        /* TODO ↓のheightが効かず、下線の位置がずれる */
        height: 48px; 
        color: #FFFDFD;
        font-size: 32px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        text-indent: 14.08px;
        word-wrap: break-word;
        border-bottom: 1px solid white; /* 下線のスタイルを設定 */
    }

    .ly_pictures-title-h3 {
        width: auto;
        height: 29px;
        color: #FFFBFB;
        font-size: 18px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
        text-indent: 13.50px;
        word-wrap: break-word;
        padding-top: 20px;
    }

    .ly_pictures-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        column-gap: 42px;
        row-gap: 82px;
    }

    .el_pictures-grid-img {
        width: 323px;
        /* height: 323px; */
    }

    .ly_chef-wrapper {
        width: 100vw;
        min-width: 100%;
        background: #262626;
        display: flex;
        justify-content: center;
        align-items: center;
        padding-top: 100px;
        min-height: 700px;
        height: 100vh;
    }

    .ly_chef {
        width: 1200px;
        padding-top: 180px;
        padding-bottom: 34px;
        align-items: flex-end;
        display: flex;
        flex-direction: row;
        gap: 59px;
    }

    .ly_chef-detail {
        /* flex-direction: column; */
        /* justify-content: space-between; */
        /* align-items: flex-start; */
        gap: 19px;
        /* display: inline-flex; */
        height: auto;
        flex-wrap: wrap;
        flex: 1;
        /* align-self: stretch; */
    }

    .ly_chef-detail h2 {
        width: 205px;
        height: 44px;
        color: #151010;
        font-size: 32px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        word-wrap: break-word;
        border-bottom: 1px solid #FFFDFD; /* 下線のスタイルを設定 */
        color: #FFFDFD;
    }

    .ly_chef-detail h3 {
        width: 201px;
        height: 29px;
        color: #151010;
        font-size: 18px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
        word-wrap: break-word;
        padding-top: 20px;
        color: #FFFDFD;
    }

    .el_chef-detail-content {
        padding-top: 40px;
        color: #151010;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 2.97px;
        text-indent: 2.97px;
        word-wrap: break-word;
        /* padding-top: 371px; */
        color: #FFFDFD;
    }


    .ly_footer {
        width: 100vw;
        min-width: 100%;
        padding-top: 128px;
        background: #334804;
        justify-content: space-between;
        align-items: center;
        display: flex;
        flex-direction: column;
    }

    .ly_footer-sentence {
        font-size: 16px;
        letter-spacing: 0.97px;
        text-indent: 0.97px;
        color: #B7B0B0;
    }

    .ly_footer-sentence dl {
        font-weight: 400;
        word-wrap: break-word;
        display: table;
        width: 100%;
    }

    .ly_footer-sentence dt {
        width: 144px;
        display: table-cell;
        font-weight: 400;
        word-wrap: break-word;
        padding-top : 44px;
    }

    .ly_footer-sentence dd {
        display: table-cell;
        color: white;
        font-weight: 400;
        word-wrap: break-word;
    }

    .ly_footer-sentence dd p {
        border-bottom: solid 1px white;
    }


    .el_text-underline {
        position: relative;
        display: inline-block;
        margin-right: 12px;
    }

    .el_text-underline::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -10px; /* テキストの下に線を配置する位置を調整 */
        width: 100%; /* テキストの幅と同じに線を引く */
        border-bottom: 1px solid white; /* 線のスタイルを設定 */
    }

    .bl_footer-logo img {
        width: 100px;
    }

    .bl_footer-img img {
        width: 366px;
        position: relative;
        top: 10px;
    }

    .ly_footer-content-wrapper {
        display: flex;
        flex-direction: column;
        min-height:700px;
        height: 100vh;
        align-items: center;
        justify-content: space-between;
    }

    .ly_footer-content {
        display: flex;
        padding-top: 128px;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-end;
        width: 1200px;
        padding-left: 40px;
        padding-right: 40px;
    }

    .bl_footer-copyright {
        padding-top: 60px;
        padding-bottom: 86px;
    }

    .bl_footer-copyright span {
        color: #FFF;
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 2.97px;
        text-indent: 2.97px;
    }

    .el_link-icon {
        width: 16px;
    }
}


@media screen and (max-width: 1199px) {
/* @media screen and (max-width: 800px) { */
    body {
        width: 100%;
        font-family: Noto Serif JP;
    }

    .ly_header { 
        width: 100%;
        height: calc(100vw / 2);
        background-image: url(../../assets/images/top.jpg);
        display: flex;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .ly_menu-2 ul {
        list-style: none;
        text-align: center;
    }

    .ly_menu-2 ul li {
        margin-bottom: 20px;
    }

    .ly_menu-2 ul li a {
        text-decoration: none;
        color: #333;
        font-size: 18px;
        transition: color 0.3s ease;
    }

    /* Rotating lines for X icon effect */
    .hamburger.show .line:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    .hamburger.show .line:nth-child(2) {
        opacity: 0;
    }

    .hamburger.show .line:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    .ly_menu-2.show {
        right: 0;
    }

    .hamburger {
        position: fixed;
        top: 10px;
        right: 10px;
        display: block;
        cursor: pointer;
        padding: 10px;
        z-index: 100000;
    }

    .line {
        display: block;
        width: 25px;
        height: 3px;
        background: #fff;
        margin: 5px auto;
        transition: all 0.3s ease;
    }

    .ly_menu-2 {
        background: rgba(0, 0, 0, 0.7); /* 透明度を調整した背景色 */
        transition: all 0.3s ease;
        top: 0;
        right: -300px; /* Initially off-screen */
        position: fixed;
        align-items: flex-start;
        display: inline-flex;
        flex-direction: column;
        gap: 7px;
        justify-content: flex-start;
        width: 100px;
        transform: translateX(100%);
        z-index: 10000;
        padding: 10px;
        width: 200px;
    }
    
    .ly_menu-2 .el_menu {
        padding: 10px;
        width: auto;
    }

    /* Show menu when hamburger is clicked */
    .ly_menu-2.show {
        transform: translateX(0);
    }

    .ly_menu {
        align-items: flex-start;
        display: inline-flex;
        flex-direction: column;
        gap: 7px;
        justify-content: flex-start;
        width: 172px;
        display: none;
    }

    .el_menu {
        width: 132px;
        height: 33px;
        color: #FFFCFC;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
    }

    .bl_header {
    }

    .bl_header-logo {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-end;
    }

    .el_header-logo {
        width: 44px;
        padding-left: 10px;
        padding-bottom: 10px
    }

    .el_header-logo-caption {
        width: 56px;
        color: #FFFCFC;
        font-size: 11px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
        padding-bottom: 32px;
    }

    .ly_top-right {
        height: 100%;
    }

    .bl_tel {
        width: 24px;
        height: auto;
        background: #4F7302;
        display: flex;
        flex-direction: row;
        align-items: center;
        writing-mode: vertical-rl;
        padding-top: 6px;
        position: fixed;
        top: 80px;
        right: 20px;
        z-index: 1000;
        padding-bottom: 8px;
    }

    .el_tel {
        color: #FFFBFB;
        font-size: 10px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 4.10px;
        text-indent: 4.10px;
        padding-top: 6px;
        word-wrap: break-word;
    }

    .bl_tel img {
        width: 17px;
    }

    .ly_news {
        padding-left: 30px;
        padding-right: 30px;
        padding-top: 27px;
        padding-bottom: 27px;
        background: rgba(75, 75, 75, 0.51);
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 19px;
        display: flex;
    }

    .ly_news-header {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 12px;
    }

    .ly_news h2 {
        color: #FFFEFE;
        font-size: 18px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
    }

    #news_content {
        display: contents;
        gap: 19px;
    }

    .ly_news #news_content dl {
        color: #FFFDFD;
        font-size: 14px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
        display: table;
        width: 100%;
    }

    .ly_news #news_content dt {
        display: table-cell;
    }

    .ly_news #news_content dd {
        padding-left: 32px;
        display: table-cell;
        width: 100%;
    }

    .bl_scroll {
        display: none;
    }

    .ly_about-wrapper {
        width: 100%;
        padding-top: 80px;
        padding-bottom: 80px;
        background: linear-gradient(102deg, #4F7302 0%, rgba(10.35, 14.88, 0.68, 0.92) 100%, rgba(79, 115, 2, 0) 100%);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .ly_about {
        justify-content: center;
        align-items: center;
        gap: 10px;
        display: flex;
        flex-direction: column;
    }

    .ly_about h2 {
        color: #FFFDFD;
        font-size: 20px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
        text-align: center;
        border-bottom: 1px solid #ffffff; /* 下線のスタイルを設定 */
        padding-bottom: 16px;
    }

    .ly_about h3 {
        word-wrap: break-word;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
        text-indent: 13.50px;
        text-align: center;
        padding-top: 16px;
        padding-bottom: 30px;
    }

    .ly_about div {
        width: 100%;
        height: auto;
        color: #FFFDFD;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 300;
        line-height: normal;
        letter-spacing: 2px;
        text-indent: 2px;
        text-align: center;
    }

    .bl_about-title {
        justify-content: center;
        align-items: flex-start;
        gap: 15px;
        display: flex;
    }

    .ly_course {
        width: 100%;
        background: #262626;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 25px;
        display: inline-flex;
    }

    .bl_course-content {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        padding-top: 156px;
    }

    .bl_content-header {
        width: 306px;
    }

    .bl_content-header h2 {
        color: #FFF;
        /* font-family: Noto Serif JP; */
        /* font-size: 20px; */
        /* line-height: normal; */
        /* padding: 40px; */
        font-size: 20px;
        font-family: Noto Serif JP;
        font-weight: 400;
        word-wrap: break-word;
        text-align: center;
        border-bottom: 1px solid #ffffff; /* 下線のスタイルを設定 */
        padding-bottom: 16px;
        width: 100%;
    }

    .bl_content-header h3 {
        /* padding: 30px; */
        color: #FFF;
        /* font-family: Noto Serif JP; */
        /* font-size: 16px; */
        /* font-style: normal; */
        /* font-weight: 400; */
        /* line-height: normal; */
        /* letter-spacing: 16.83px; */
        /* margin-right: -16.83px; */
        word-wrap: break-word;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
        text-indent: 13.50px;
        text-align: center;
        padding-top: 16px;
        padding-bottom: 30px;
    }


    .bl_course-content hr {
        width: 100%;
        height: 1px;
        color: #FFF;
        stroke-width: 1px;
    }

    .bl_course-content span {
        color: #FFF8F8;
        text-align: center;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 2.97px;
        text-indent: 2.97px;
    }

    .bl_course-content table {
        color: #FFF;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 2.97px;
        text-indent: 2.97px;
        table-layout: fixed;
    }

    .bl_course-content img {
        padding-top: 28px;
        width: 100%;
    }

    .bl_course-content h3{
        padding: 30px;
        color: #fff;
    }

    .bl_course-content-supplementation {
        padding-top: 112px;
        text-align: center;
        hegiht: 100%;
        padding-bottom: 112px;
    }

    .el_course-name {
        width: 180px;
    }

    .el_course-price {
        width: 180px;
        text-align: end;
    }

    .ly_course-detail {
        width: 100%;
    }


    .ly_shokuzai {
        min-height: 700px;
        width: 100%;
        background: #262626;
        display: flex;
        align-items: center;
        gap: 37px;
        flex-shrink: 0;
        color: #FFF8F8;
        justify-content: center;
        flex-direction: column;
        padding-top: 173px;
    }

    .ly_shokuzai-reverse {
        min-height: 700px;
        width: 100%;
        background: #262626;
        display: flex;
        align-items: center;
        gap: 37px;
        flex-shrink: 0;
        color: #FFF8F8;
        justify-content: center;
        flex-direction: column-reverse;
    }

    .bl_shokuzai-img {
        position: relative;
        width: 100%;
    }

    .bl_shokuzai-img img {
        width: 100%;
    }

    .bl_shokuzai-content {
        padding-top: 20px;
        padding-left: 29px;
        padding-right: 29px;
        padding-bottom: 29px;
    }

    .bl_shokuzai-content h2 {
        color: #FFFDFD;
        font-family: Noto Serif JP;
        font-size: 20px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 10.56px;
        text-indent: 10.56px;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .bl_shokuzai-content span {
        padding-top: 18px;
        color: #FFFDFD;
        text-align: justify;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 3.92px;
        text-indent: 3.92px;
    }

    .bl_shokuzai-header {
    }

    .bl_shokuzai-header h3 {
        color: #FFF;
        font-family: Noto Serif JP;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 10.6px;
        text-indent: 10.6px;
        text-align: center;
        padding-top: 20px;
    }

    .bl_shokuzai-header h2 {
        overflow: hidden;
        color: #FFF;
        text-overflow: ellipsis;
        white-space: nowrap;
        letter-spacing: 13.36px;
        text-indent: 13.36px;

        /* 基本 */
        font-family: Noto Serif JP;
        font-size: 20px;
        font-style: normal;
        font-weight: 300;
        line-height: normal;
        border-bottom: 1px solid #ffffff; /* 下線のスタイルを設定 */
        text-align: center;
    }

    .ly_drink-wrapper {
        width: 100%;
        background: #B7B0B0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .ly_drink {
        width: 100%;
        padding-top: 100px;
        padding-bottom: 40px;
        background: #B7B0B0;
        justify-content: flex-end;
        align-items: center;
        display: flex;
        flex-direction: column;
    }

    .ly_drink-header {
        background: #B7B0B0;
        justify-content: center;
        align-items: center;
        display: flex;
        flex-direction: column;
        gap: 20px;
        width: 100%;
    }

    .ly_drink-header h2 {
        height: 44px;
        color: #151010;
        font-size: 20px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        text-indent: 14.08px;
        word-wrap: break-word;
        border-bottom: 1px solid #151010; /* 下線のスタイルを設定 */
        text-align: center;
    }

    .ly_drink-header h3 {
        height: 29px;
        color: #151010;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
        text-indent: 13.50px;
        word-wrap: break-word;
        padding-top: 20px;
        text-align: center;
        padding-bottom: 60px;
    }

    .ly_drink-header img {
        box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.25);
        width: 100%;
    }

    .ly_drink-detail {
        padding-top: 24px;
        color: #4B4B4B;
        text-align: center;
    }


    .ly_kenzo-wrapper {
        width: 100%;
        background: #B7B0B0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .ly_kenzo {
        width: 100%;
        padding-bottom: 45px;
        background: #B7B0B0;
        justify-content: center;
        align-items: center;
        display: flex;
        gap: 59px;
        flex-direction: column-reverse;
    }

    .bl_kenzo-img {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-end;
    }

    .bl_kenzo-img p {
        color: #4B4B4B;
        font-family: Noto Serif JP;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 2.64px;
        text-indent: 2.64px;
    }

    .el_kenzo-img {
        width: 100%;
        box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.25);
    }

    .ly_kenzo-detail {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding-top: 110px;
    }

    .bl_kenzo-header {
        width: 306px;
    }

    .ly_kenzo-detail h2 {
        color: #4B4B4B;
        width: 100%;
        color: #151010;
        font-size: 20px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        text-indent: 14.08px;
        word-wrap: break-word;
        text-align: center;
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .ly_kenzo-detail hr {
        width: 100%;
    }

    .ly_kenzo-detail-content {
        color: #4B4B4B;
        width: 100%;
        padding-top: 70px;
        padding-bottom: 23px;
        padding-left: 20px;
        padding-right: 20px;
        text-align: center;
    }

    .ly_pictures {
        width: 100%;
        padding-bottom: 173px;
        background: #262626;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 142px;
        display: inline-flex
    }

    .ly_pictures-title {
        padding-top: 173px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        display: flex;
    }

    .ly_pictures-title-h2 {
        /* TODO ↓のheightが効かず、下線の位置がずれる */
        color: #FFFDFD;
        font-size: 20px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        text-indent: 14.08px;
        word-wrap: break-word;
        border-bottom: 1px solid white; /* 下線のスタイルを設定 */
    }

    .ly_pictures-title-h3 {
        color: #FFFBFB;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
        text-indent: 13.50px;
        word-wrap: break-word;
    }

    .ly_pictures-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        column-gap: 30px;
        row-gap: 30px;
    }

    .el_pictures-grid-img {
        width: calc(100vw / 2 - 60px);
        /* height: 323px; */
    }


    .ly_chef-wrapper {
        width: 100%;
        background: #262626;
        display: flex;
        justify-content: center;
        align-items: flex-end;
        padding-top: 100px;
    }

    .ly_chef {
        width: 100%;
        align-items: center;
        display: flex;
        flex-direction: column-reverse;
        gap: 59px;
    }

    .ly_chef img {
        width: 100%;
    }

    .ly_chef-detail {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 19px;
        display: flex;
        height: auto;
        flex-wrap: wrap;
        flex: 1;
        /* align-self: stretch; */
    }

    .ly_chef-detail h2 {
        color: #151010;
        font-size: 20px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 14.08px;
        text-indent: 14.08px;
        word-wrap: break-word;
        border-bottom: 1px solid #FFFDFD; /* 下線のスタイルを設定 */
        color: #FFFDFD;
    }

    .ly_chef-detail h3 {
        color: #151010;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 13.50px;
        text-indent: 13.50px;
        word-wrap: break-word;
        padding-top: 20px;
        color: #FFFDFD;
    }

    .el_chef-detail-content {
        padding-top: 40px;
        color: #151010;
        font-size: 16px;
        font-family: Noto Serif JP;
        font-weight: 400;
        letter-spacing: 2.97px;
        text-indent: 2.97px;
        word-wrap: break-word;
        padding-top: 100px;
        color: #FFFDFD;
    }

    .bl_footer-img img {
        display: none;
    }

    .ly_footer {
        width: 100%;
        padding-top: 128px;
        background: #334804;
        justify-content: space-between;
        align-items: center;
        display: flex;
        flex-direction: column;
    }

    .ly_footer-content-wrapper {
        display: flex;
        flex-direction: column;
        min-height:700px;
        height: 100vh;
        align-items: center;
        justify-content: space-between;
    }

    .ly_footer-content {
        display: flex;
        padding-top: 128px;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-end;
        width: 100%;
        padding-left: 40px;
        padding-right: 40px;
    }

    .ly_footer-sentence {
        font-size: 16px;
        letter-spacing: 0.97px;
        text-indent: 0.97px;
        color: #B7B0B0;
    }

    .ly_footer-sentence dl {
        font-weight: 400;
        word-wrap: break-word;
        display: table;
        width: 100%;
    }

    .ly_footer-sentence dt {
        width: 80px;
        display: table-cell;
        font-weight: 400;
        word-wrap: break-word;
        padding-top : 44px;
    }

    .ly_footer-sentence dd {
        display: table-cell;
        color: white;
        font-weight: 400;
        word-wrap: break-word;
    }

    .ly_footer-sentence dd p {
        border-bottom: solid 1px white;
    }



    .bl_footer-logo img {
        width: 60px;
    }

    .bl_footer-copyright {
        padding-top: 60px;
        padding-bottom: 86px;
    }

    .bl_footer-copyright span {
        color: #FFF;
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 2.97px;
        text-indent: 2.97px;
    }
    .el_link-icon {
        width: 16px;
    }
    .el_white-space-pre {
        white-space: pre;
    }
}