@font-face {
    font-family: "Noto Sans JP";
    font-style: normal;
    font-weight: 400;
    src: url("../font/NotoSansJP-Regular.woff2") format("woff2"), url("../font/NotoSansJP-Regular.woff") format("woff"), url("../font/NotoSansJP-Regular.otf") format("opentype")
}

@font-face {
    font-family: "Noto Sans JP";
    font-style: normal;
    font-weight: 500;
    src: url("../font/NotoSansJP-Medium.woff2") format("woff2"), url("../font/NotoSansJP-Medium.woff") format("woff"), url("../font/NotoSansJP-Medium.otf") format("opentype")
}

@font-face {
    font-family: "Noto Sans JP";
    font-style: normal;
    font-weight: 700;
    src: url("../font/NotoSansJP-Bold.woff2") format("woff2"), url("../font/NotoSansJP-Bold.woff") format("woff"), url("../font/NotoSansJP-Bold.otf") format("opentype")
}

@media screen and (min-width:576px) {
    .br__sp { display: none; }
}

.br__pc { display: none; }

@media screen and (min-width:576px) {
    .br__pc { display: inline; }
}

.fixed {
    position: fixed;
    width: 100%;
    top: 0;
    
}

html { scroll-behavior: smooth; }

body {
    color: #333;
    font-family: "Noto Serif JP", serif;
    font-size: 14px;
    line-height: 1.7;
    background-color: #fff;
}
@media screen and (max-width:575px) {
    html { overflow-x: hidden; }
    body {
        font-size: 3.4666vw;
        line-height: 1.7;
        overflow-x: hidden;
    }
}

a {
    -webkit-transition: all 0.2s ease-out 0s;
    transition: all 0.2s ease-out 0s
}

@media (hover:hover) {
    a:hover { opacity: 0.6; }
}

img {
    max-width: 100%;
    height: auto;
    border: none;
}

/* 共通 */
.contents_inner {
    max-width: 960px;
    margin: 0 auto;
}
.btn_square a {
    position: relative;
    display: inline-block;
    min-width: 220px;
    height: 50px;
    line-height: 46px;
    border: 1px solid #333;
    padding: 0 36px 0 18px;
    text-align: center;
}
.btn_square a::before {
    display: inline-block;
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    border-top: 1px solid #333;
    border-right: 1px solid #333;
    transform: translateY(-40%) rotate(45deg);
    top: 50%;
    right: 20px;
}
@media screen and (max-width:575px) {
    .contents_inner { width: 100%; }
    .btn_square { width: 100%; }
    .btn_square a {
        width: 100%;
        height: 13.3333vw;
        line-height: 13vw;
        padding: 0 6.4vw;
    }
    .btn_square a::before {
        width: 2vw;
        height: 2vw;
        right: 4vw;
    }
}

.tab {
    background-color: #333;
    padding: 22px 0 16px;
    z-index: 999;
}
.vol_list {
    display: flex;
    justify-content: space-between;
}
.vol_list li,
.vol_list li a {
    display: flex;
    align-items: center;
    color: #808080;
    font-size: 12px;
}
.vol_list li a { color: #333; }
.tab .vol_list li a {
    position: relative;
    color: #fff;
}
.vol_list li a.active,
.vol_list li a:hover {
    color: #fff;
/*    opacity: 1;*/
}
.tab .vol_list li a.active::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background-color: #fff;
    left: 0;
    bottom: -2px;
}
.vol_list li span:first-of-type {
    position: relative;
    font-size: 16px;
    margin-right: 30px;
}
.vol_list li span:first-of-type::before {
    position: absolute;
    content: "";
    width: 10px;
    height: 1px;
    background-color: #808080;
    top: 50%;
    right: -21px;
    transition: all 0.2s ease-out 0s;
}
.tab .vol_list li a span:first-of-type::before,
.vol_list li a.active span:first-of-type::before,
.vol_list li a:hover span:first-of-type::before { background-color: #fff; }
@media screen and (max-width:575px) {
    .vol_list li,
    .vol_list li a { font-size: 2.4vw; }
    .vol_list li span:first-of-type {
        font-size: 3.2vw;
        margin-right: 4.8vw;
    }
    .vol_list li span:first-of-type::before {
        width: 2.1333vw;
        right: -3.1333vw;
    }

    .tab { padding: 4vw 5.3333vw 3.5999vw; }
    .tab .vol_list li,
    .tab .vol_list li a {
        flex-direction: column;
        font-size: 2.9333vw;
    }
    .tab .vol_list li span:first-of-type {
        font-size: 3.7333vw;
        margin-right: 0;
    }
    .tab .vol_list li span:first-of-type::before { display:  none; }
}

/* MV */
.tab_contents .mv {
    width: 100%;
}
.tab_contents .mv .contents_inner {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
}
.tab_contents .mv .btn_square {
    position: absolute;
    bottom: 40px;
    right: 40px;
}
.tab_contents .mv .btn_square a {
    color: #fff;
    border-color: #fff;
}
.tab_contents .mv .btn_square a::before {
    border-top-color: #fff;
    border-right-color: #fff;
}
@media screen and (max-width:575px) {
    .tab_contents .mv { width: 100%; }
    .tab_contents .mv .btn_square {
        width: 81.3333vw;
        bottom: 6vw;
        right: 9.3333vw;
    }
}

/* COLLABORATION */
.collaboration { padding: 140px 0 130px; }
.collaboration h4 {
    width: 313px;
    margin: 0 auto 30px;
}
.collaboration h4 + p { text-align: center; }
.collaboration h5 {
    font-size: 24px;
    font-weight: 300;
    margin-bottom: 5px;
}
.collaboration .collabo_list {
    display: flex;
    justify-content: space-between;
    margin-top: 60px;
}
.collaboration .collabo_list div { width: 460px; }
.collaboration .collabo_list div dl {
    display: flex;
    justify-content: space-between;
}
.collaboration .collabo_list div dl dt { width: 184px; }
.collaboration .collabo_list div dl dd { width: 248px; }
.collaboration .collabo_list div dl dd p { margin-bottom: 10px; }
.collaboration .collabo_list div ul {
    display: flex;
    gap: 0 30px;
}
.collaboration .collabo_list div a { text-decoration: underline; }
@media screen and (max-width:575px) {
    .collaboration { padding: 19.3333vw 0 18.6666vw; }
    .collaboration .contents_inner { width: 82%; }
    .collaboration h4 {
        width: 57.9999vw;
        margin-bottom: 6.6666vw;
    }
    .collaboration h4 + p { text-align: left; }
    .collaboration h5 {
        font-size: 4.2666vw;
        margin-bottom: 1.3333vw;
    }
    .collaboration .collabo_list {
        flex-direction: column;
        gap: 9.6vw 0;
        margin-top: 9.6vw;
    }
    .collaboration .collabo_list div { width: 100%; }
    .collaboration .collabo_list div dl dt { width: 38.6666vw; }
    .collaboration .collabo_list div dl dd { width: 38.6666vw; }
    .collaboration .collabo_list div dl dd p { margin-bottom: 1.3333vw; }
    .collaboration .collabo_list div ul { gap: 0 1.8vw; }
}

/* COLLABORATION STORY */
.collaboration-story {
    background-color: #fafafa;
    padding: 80px 0;
}
.collaboration-story .contents_inner { max-width: 500px; }
.collaboration-story h4 {
    width: 488px;
    margin: 0 auto 50px;
}
.collaboration-story dl {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.collaboration-story dl dt { width: 198px; }
.collaboration-story dl dd { width: 262px; }
.collaboration-story dl dd p { margin-bottom: 10px; }
.collaboration-story dl dd a { text-decoration: underline; }
@media screen and (max-width:575px) {
    .collaboration-story { padding: 13.3333vw 0; }
    .collaboration-story .contents_inner { width: 82%; }
    .collaboration-story h4 {
        width: 63.7333vw;
        margin-bottom: 6.6666vw;
    }
    .collaboration-story dl { align-items: flex-start; }
    .collaboration-story dl dt { width: 36vw; }
    .collaboration-story dl dd { width: 40.6666vw; }
    .collaboration-story dl dd p { margin-bottom: 1.3333vw; }
}

/* フッター */
footer { padding-top: 40px; }
footer .contents_inner { max-width: 1080px; }
footer .table_of_contents {
    display: flex;
    margin-bottom: 30px;
}
footer .table_of_contents p {
    display: flex;
    align-items: center;
    color: #333;
    font-size: 12px;
    margin-right: 80px;
}
footer .table_of_contents p span:first-of-type {
    position: relative;
    font-size: 16px;
    margin-right: 30px;
}
footer .table_of_contents p span:first-of-type::before {
    position: absolute;
    content: "";
    width: 10px;
    height: 1px;
    background-color: #333;
    top: 50%;
    right: -21px;
}
footer .table_of_contents ul { display: flex; }
footer .table_of_contents ul li {
    font-size: 24px;
    font-weight: 200;
    margin-right: 100px;
}
footer .feature_link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}
footer .feature_link ul { gap: 0 80px; }
footer .vol_list li a:hover { color: #333; }
footer .vol_list li a:hover span:first-of-type::before { background-color: #333; }
footer .sns {
    display: flex;
    justify-content: space-between;
    font-family: "Noto Sans JP";
    font-weight: 500;
    border-top: 1px solid #707070;
    padding: 30px 0;
}
@media screen and (max-width:575px) {
    footer { padding-top: 10.4vw; }
    footer .contents_inner { width: 90%; }
    footer .table_of_contents {
        flex-direction: column;
        margin-bottom: 10.6666vw;
    }
    footer .table_of_contents p {
        font-size: 2.4vw;
        margin: 0 0 5.3333vw;
    }
    footer .table_of_contents p span:first-of-type {
        font-size: 3.2vw;
        margin-right: 4.8vw;
    }
    footer .table_of_contents p span:first-of-type::before {
        width: 2.1333vw;
        right: -3.1333vw;
    }
    footer .table_of_contents ul li {
        font-size: 4.5333vw;
        margin-right: 13.3333vw;
    }
    footer .feature_link {
        flex-direction: column;
        margin-bottom: 8vw;
    }
    footer .feature_link ul {
        flex-wrap: wrap;
        gap: 8vw 0;
    }
    footer .vol_list { margin: 0 0 10.4vw; }
    footer .vol_list li { width: 50%; }
    footer .sns {
        flex-direction: column;
        border-top: 1px solid #333;
        padding: 8vw 0;
    }
    footer .sns div + div { margin-top: 8vw; }
}

.tab_contents .flex-center {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.tab_contents .flex-end {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.tab_contents .txt_link { text-align: right; }
.tab_contents .txt_link p + p { margin-top: 20px; }
.tab_contents .txt_link a {
    position: relative;
    padding-right: 20px;
}
.tab_contents .txt_link a::before {
    display: inline-block;
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    border-top: 1px solid #333;
    border-right: 1px solid #333;
    transform: translateY(-40%) rotate(45deg);
    top: 50%;
    right: 0;
}
@media screen and (max-width:575px) {
    .tab_contents .flex-center,
    .tab_contents .flex-end { flex-direction: column; }
    .tab_contents .txt_link p + p { margin-top: 5.3333vw; }
}

.tab_contents_vol01 .about01 {
    background-color: #fafafa;
    margin-bottom: 140px;
    padding: 80px 0 120px;
}
.tab_contents_vol01 .about01 .txt_lead {
    font-size: 16px;
    line-height: 2.2;
    margin-bottom: 220px;
    text-align: center;
}
.tab_contents_vol01 .about01 dl dt { width: 526px; }
.tab_contents_vol01 .about01 dl dd { width: 348px; }
.tab_contents_vol01 .about01 dl dd h2 {
    position: absolute;
    width: 68px;
    top: -104px;
    right: 140px;
}

.tab_contents_vol01 .about02 { margin-bottom: 250px; }
.tab_contents_vol01 .about02 dl:first-of-type {
    flex-direction: row-reverse;
    margin-bottom: 140px;
}
.tab_contents_vol01 .about02 dl:first-of-type dt { width: 402px; }
.tab_contents_vol01 .about02 dl:first-of-type dd { width: 348px; }
.tab_contents_vol01 .about02 dl:first-of-type dd h2 {
    position: absolute;
    width: 68px;
    top: 0;
    left: 148px;
}

.tab_contents_vol01 .about02 dl:last-of-type dt { width: 460px; }
.tab_contents_vol01 .about02 dl:last-of-type dd { width: 348px; }
@media screen and (max-width:575px) {
    .tab_contents_vol01 .about01 {
        margin-bottom: 21.3333vw;
        padding: 18.6666vw 0;
    }
    .tab_contents_vol01 .about01 .txt_lead {
        font-size: 3.7333vw;
        margin-bottom: 20vw;
    }
    .tab_contents_vol01 .about01 dl dt {
        width: 90.6666vw;
        margin: 0 auto 5.3333vw 0;
    }
    .tab_contents_vol01 .about01 dl dd {
        width: 81.3333vw;
        margin: 0 auto;
    }
    .tab_contents_vol01 .about01 dl dd h2 {
        width: 12.4vw;
        top: -8vw;
        right: 6.6666vw;
    }

    .tab_contents_vol01 .about02 { margin-bottom: 32.2666vw; }
    .tab_contents_vol01 .about02 dl:first-of-type {
        flex-direction: column;
        margin-bottom: 13.3333vw;
    }
    .tab_contents_vol01 .about02 dl:first-of-type dt {
        width: 68.2666vw;
        margin: 0 0 10.6666vw auto;
    }
    .tab_contents_vol01 .about02 dl:first-of-type dd {
        width: 58.9333vw;
        margin: 0 9.3333vw 0 auto;
    }
    .tab_contents_vol01 .about02 dl:first-of-type dd h2 {
        width: 12.4vw;
        top: -5.3333vw;
        left: 9.3333vw;
    }

    .tab_contents_vol01 .about02 dl:last-of-type dt {
        width: 83.7333vw;
        margin: 0 auto 10.6666vw 0;
    }
    .tab_contents_vol01 .about02 dl:last-of-type dd {
        width: 74.4vw;
        margin: 0 auto 0 9.3333vw;
    }
}

/* 粉雪 */
.konayuki {
    background-color: #EAF0F0;
    padding: 180px 0 120px;
}
.konayuki .item_title {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    max-width: 1280px;
    margin: 0 auto 100px;
}
.konayuki .item_title dt {
    position: relative;
    width: 770px;
}
.konayuki .item_title dt .dishes {
    position: absolute;
    width: 618px;
    top: -272px;
    left: 52px;
}
.konayuki .item_title dd {
    width: 115px;
    margin: 50px 200px 0 0;
}
.konayuki .contents_inner { max-width: 1080px; }
.konayuki .img {
    width: 540px;
    margin-left: auto;
}
.konayuki .item_about {
    position: relative;
    display: flex;
    justify-content: space-between;
}
.konayuki .item_about dt {
    width: 514px;
    margin-left: 10px;
}
.konayuki .item_about dd {
    width: 410px;
    margin-top: 40px;
}
.konayuki .item_about dd h3 {
    position: absolute;
    width: 69px;
    top: -398px;
    left: 222px;
}
.konayuki .txt_link { margin-top: 250px; }
@media screen and (max-width:575px) {
    .konayuki { padding: 16vw 0 18.6666vw; }
    .konayuki .item_title {
        position: relative;
        flex-direction: column;
        width: 100%;
        margin-bottom: 12vw;
    }
    .konayuki .item_title dt {
        width: 100%;
        margin-top: -14.9333vw;
    }
    .konayuki .item_title dt div { width: 78.4vw; }
    .konayuki .item_title dt .dishes {
        width: 90.5333vw;
        top: -66.1333vw;
        left: -20.5333vw;
    }
    .konayuki .item_title dd {
        width: 20.5333vw;
        margin: 0 5.3333vw 0 auto;
    }
    .konayuki .contents_inner { width: 100%; }
    .konayuki .img {
        width: 78.6666vw;
        margin: 0 0 10.6666vw auto;
    }
    .konayuki .item_about { flex-direction: column; }
    .konayuki .item_about dt {
        width: 71.8666vw;
        transform: translateX(-6.9333vw);
    }
    .konayuki .item_about dd {
        width: 81.3333vw;
        margin: 9.6vw auto 0;
    }
    .konayuki .item_about dd h3 {
        width: 12.8vw;
        top: 7.7333vw;
        left: 77.3333vw;
    }
    .konayuki .txt_link { margin-top: 8vw; }
}

/* 蒼海 */
.soukai { padding: 345px 0 140px; }
.soukai .item_title {
    display: flex;
    justify-content: space-between;
    max-width: 1280px;
    margin: 0 auto 80px;
}
.soukai .item_title dt {
    position: relative;
    width: 735px;
    margin-top: 42px;
}
.soukai .item_title dt .dishes {
    position: absolute;
    width: 614px;
    top: -265px;
    left: -76px;
}
.soukai .item_title dd {
    width: 110px;
    margin-left: 200px;
}
.soukai .item_about {
    position: relative;
    display: flex;
    justify-content: space-between;
    max-width: 1136px;
    margin: 0 auto;
}
.soukai .item_about dt {
    width: 512px;
    margin-top: 384px;
}
.soukai .item_about dd {
    width: 410px;
    margin-left: 60px;
}
.soukai .item_about dd h3 {
    position: absolute;
    width: 68px;
    top: -18px;
    right: 241px;
}
.soukai .item_about dd .img { margin-bottom: 40px; }
.soukai .contents_inner { max-width: 1080px; }
.soukai .txt_link { margin-top: 80px; }
@media screen and (max-width:575px) {
    .soukai { padding: 0 0 18.6666vw; }
    .soukai .item_title {
        flex-direction: column-reverse;
        width: 100%;
        margin-bottom: 0;
    }
    .soukai .item_title dt {
        width: 100%;
        margin-top: 0;
    }
    .soukai .item_title dt div {
        width: 64.5333vw;
        margin-left: auto;
    }
    .soukai .item_title dt .dishes {
        width: 89.7333vw;
        top: 51.7333vw;
        left: 20.1333vw;
    }
    .soukai .item_title dd {
        width: 19.8666vw;
        margin: 0 0 0 8vw;
        transform: translateY(-90.2666vw);
    }
    .soukai .item_about {
        flex-direction: column;
        width: 100%;
        margin-top: 4vw;
    }
    .soukai .item_about dt {
        width: 77.3333vw;
        margin: 0 auto 0 0;
        transform: translateX(-10.1333vw);
    }
    .soukai .item_about dd {
        width: 100%;
        margin: 0 auto 10.6666vw;
    }
    .soukai .item_about dd p:not(.img) {
        width: 81.3333vw;
        margin: 0 auto;
    }
    .soukai .item_about dd .img {
        width: 67.7333vw;
        margin-bottom: 5.3333vw;
    }
    .soukai .item_about dd h3 {
        width: 12.2666vw;
        top: 14.7999vw;
        right: 10.6666vw;
    }
    .soukai .contents_inner { width: 81.3333%; }
    .soukai .txt_link { margin-top: 5.4666vw; }
}

/* 寒雲雀 */
.kanhibari {
    background-color: #E0DFD6;
    padding: 190px 0 140px;
}
.kanhibari .item_title {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    max-width: 1280px;
    margin: 0 auto 80px;
}
.kanhibari .item_title dt {
    position: relative;
    width: 780px;
    margin-top: 72px;
}
.kanhibari .item_title dt .dishes {
    position: absolute;
    width: 609px;
    top: -159px;
    left: 290px;
}
.kanhibari .item_title dd {
    width: 115px;
    margin-right: 200px;
}
.kanhibari .contents_inner { max-width: 1200px; }
.kanhibari .img {
    width: 540px;
    margin: 0 0 40px auto;
}
.kanhibari .item_about {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 1080px;
    margin: 0 auto;
}
.kanhibari .item_about dt {
    width: 500px;
    margin-left: 23px;
}
.kanhibari .item_about dd { width: 410px; }
.kanhibari .item_about dd h3 {
    position: absolute;
    width: 69px;
    top: -304px;
    left: 220px;
}
.kanhibari .txt_link { margin-top: 225px; }
.kanhibari .btn_square {
    margin-top: 60px;
    text-align: right;
}
@media screen and (max-width:575px) {
    .kanhibari { padding: 16vw 0 18.6666vw; }
    .kanhibari .item_title {
        position: relative;
        flex-direction: column;
        width: 100%;
        margin-bottom: 16vw;
    }
    .kanhibari .item_title dt {
        width: 100%;
        margin-top: -15.0666vw;
    }
    .kanhibari .item_title dt div { width: 76.4vw; }
    .kanhibari .item_title dt .dishes {
        width: 92vw;
        top: -41.8666vw;
        left: -20.5333vw;
    }
    .kanhibari .item_title dd {
        width: 20vw;
        margin: 0 8vw 0 auto;
        z-index: 5;
    }
    .kanhibari .contents_inner { max-width: 100%; }
    .kanhibari .img {
        width: 74.1333vw;
        margin: 0 0 16vw auto;
    }
    .kanhibari .item_about {
        width: 100%;
        flex-direction: column;
    }
    .kanhibari .item_about dt {
        width: 73.0666vw;
        transform: translateX(-9.2vw);
    }
    .kanhibari .item_about dd {
        width: 81.3333vw;
        margin: 10.9333vw auto 0;
    }
    .kanhibari .item_about dd h3 {
        width: 12vw;
        top: 15.0666vw;
        left: 75.2vw;
    }
    .kanhibari .txt_link { margin-top: 10.6666vw; }
    .kanhibari .btn_square { margin-top: 13.3333vw; }
}



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