.h2-shared {
    position: relative;
    text-align: center;
    padding-top: 9vw;
    font-size: 6.4vw;
    font-weight: 500;
    letter-spacing: .1em;
    line-height: 1;
    font-family: "Shippori Mincho", serif
}

.h2-shared::before {
    content: "";
    position: absolute;
    background-color: #ffe63a;
    height: 4px;
    width: 28%;
    top: 0;
    left: 50%;
    transform: translateX(-50%)
}

.h2-shared span {
    display: block;
    margin-top: 5vw;
    color: #6e6e6e;
    font-size: 3.2vw;
    letter-spacing: .15em;
    font-family: "Cormorant Garamond", serif
}

.h3-shared {
    padding-top: 16vw;
    text-align: center;
    font-size: 5.3vw;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .1em;
    background-size: 11vw auto;
    background-position: center top;
    background-repeat: no-repeat
}

.h4-shared {
    position: relative;
    z-index: 1
}

.h4-shared::before {
    content: "";
    position: absolute;
    background-color: #ffe63a;
    height: 3px;
    width: 100%;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1
}

.h4-shared span {
    display: inline-block;
    font-size: 4.5vw;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .1em;
    padding-right: 2%;
    background-color: #fff
}

.table {
    box-sizing: border-box;
    margin-top: 5vw
}

.table .row {
    display: flex;
    text-align: center;
    position: relative
}

.table .row::before {
    content: "";
    position: absolute;
    border: 1px dashed #bababa;
    bottom: 0;
    left: 0;
    right: 0
}

.table .row .item {
    width: 33.3333333333%;
    box-sizing: border-box;
    border-left: 1px solid #bababa;
    line-height: 18px;
    padding: 7px 2px
}

.table .row .item a {
    display: block;
    padding: 4px 0;
    font-size: 13px;
    letter-spacing: .05em
}

.table .row .item a span {
    display: block
}

.table .row .item a span.fs-1 {
    font-size: 10px
}

.table .row .item a span.fs-2 {
    font-size: 9px
}

.table .row .item a:hover {
    background-color: #ffe63a;
    border-radius: 11px
}

.table .row .item a+a {
    margin-top: 5px
}

.table .row .item a.bg-none:hover {
    background: none
}

.table .row .item:nth-child(3) {
    border-right: 1px solid #bababa
}

.table .row.row1 .item {
    border-top: 1px solid #bababa;
    border-bottom: 1px solid #bababa;
    background-color: #ffe63a;
    font-weight: bold;
    padding: 1vw 0;
    font-size: 16px;
    letter-spacing: .1em;
    min-height: auto !important
}

.table .row.row4 .item {
    border-bottom: 1px solid #bababa
}

.table .row:first-child::before {
    display: none
}

.table .row:last-child::before {
    display: none
}

.table.sp {
    margin-top: 0
}

.table.sp .row::before {
    width: 66%
}

.table.sp .row .item:last-child {
    border-right: 1px solid #bababa
}

.table.sp .row:first-child .item {
    border-top: none
}

.table.sp .row.row3 {
    border-bottom: none
}

.table.sp .row:last-child::before {
    display: none
}

.table.sp .row:last-child .item {
    border-bottom: 1px solid #bababa
}

@media screen and (min-width: 1000px) {
    .table .row .item {
        width: 20%;
        min-height: auto !important;
        line-height: 24px;
        padding: 7px 5px 9px
    }

    .table .row .item a {
        padding: 4px 0;
        font-size: 15px
    }

    .table .row .item a span {
        line-height: 20px
    }

    .table .row .item a span.fs-1 {
        font-size: 12px
    }

    .table .row .item a span.fs-2 {
        font-size: 11px
    }

    .table .row .item a+a {
        margin-top: 11px
    }

    .table .row .item:nth-child(3) {
        border-right: none
    }

    .table .row .item:last-child {
        border-right: 1px solid #bababa
    }

    .table .row.row1 .item {
        padding: 12px 0 8px 0 !important;
        font-size: 18px
    }
}

.container .left {
    position: sticky;
    top: 0;
    right: 0;
    height: 0;
    z-index: 9
}

.container .left .fix-nav {
    display: flex
}

.container .left .fix-nav .nav {
    position: relative;
    width: 50%;
    height: 60px
}

.container .left .fix-nav .nav h3 {
    position: relative;
    background-color: #ffe63a;
    border-top: 1px solid #4e4e4e;
    border-bottom: 1px solid #4e4e4e;
    box-sizing: border-box;
    font-weight: 600;
    font-size: 18px;
    line-height: 1;
    padding: 5vw 0 5vw 18%;
    height: 60px;
    letter-spacing: .05em
}

.container .left .fix-nav .nav h3::before {
    content: "";
    position: absolute;
    background: #000;
    width: 13px;
    height: 2px;
    top: 45%;
    transform: translateY(-50%);
    left: 8%
}

.container .left .fix-nav .nav h3::after {
    content: "";
    position: absolute;
    background: #000;
    width: 13px;
    height: 2px;
    top: 55%;
    transform: translateY(-50%);
    left: 8%
}

.container .left .fix-nav .nav:nth-child(2) h3 {
    border-left: none
}

.container .left .fix-nav .nav ul {
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    transition: .3s all linear
}

.container .left .fix-nav .nav ul li {
    background-color: #fff191;
    border-bottom: 1px solid #b1a133
}

.container .left .fix-nav .nav ul li a {
    display: block;
    letter-spacing: -0.02em;
    padding: 2vw 0 2.5vw 8%
}

.container .left .fix-nav .nav ul li a:hover,
.container .left .fix-nav .nav ul li a.active {
    background: #ffe63a;
    font-weight: 600
}

.container .left .fix-nav .nav.active ul {
    opacity: 1;
    pointer-events: auto;
    visibility: visible
}

.container .left .fix-nav .nav:nth-child(1) h3 {
    border-right: 1px solid #4e4e4e
}

.container .left .fix-nav .nav:nth-child(1) ul {
    border-right: 1px solid #b1a133
}

@media screen and (min-width: 1000px) {
    .h2-shared {
        padding-top: 46px;
        font-size: 38px;
        letter-spacing: -0.03em
    }

    .h2-shared::before {
        width: 99px
    }

    .h2-shared span {
        margin-top: 31px;
        font-size: 13.26px
    }

    .h3-shared {
        padding-top: 90px;
        font-size: 30px;
        background-size: 62px auto;
        letter-spacing: 0
    }

    .h4-shared span {
        font-size: 24px;
        line-height: 48px;
        padding: 0px 17px 0 22px;
        letter-spacing: .05em
    }

    .container {
        display: flex;
        align-items: flex-start
    }

    .container .left {
        background: #ffe63a;
        height: 100vh;
        width: 20.4%
    }

    .container .left .fix-nav {
        padding: 57px 17px 0 0;
        width: -moz-fit-content;
        width: fit-content;
        box-sizing: border-box;
        margin-left: auto
    }

    .container .left .fix-nav .nav {
        height: auto
    }

    .container .left .fix-nav .nav h3 {
        font-size: 20px;
        line-height: 60px;
        font-weight: 600;
        letter-spacing: .05em;
        position: relative;
        padding-left: 25px
    }

    .container .left .fix-nav .nav h3::before {
        content: "";
        position: absolute;
        background: #fff;
        width: 13px;
        height: 4px;
        top: 50%;
        transform: translateY(-50%);
        left: 0
    }

    .container .left .fix-nav .nav ul {
        padding: 11px 0 0 25px
    }

    .container .left .fix-nav .nav ul li a {
        font-size: 18px;
        line-height: 34px;
        letter-spacing: -0.02em;
        display: inline-block;
        padding: 1px 17px 0 12px
    }

    .container .left .fix-nav .nav ul li a:hover,
    .container .left .fix-nav .nav ul li a.active {
        font-weight: 600;
        background-color: #fff
    }

    .container .left .fix-nav .nav ul li+li {
        margin-top: 14px
    }

    .container .left .fix-nav .nav.nav2 {
        margin-top: 31px
    }

    .container .left .fix-nav {
        flex-direction: column;
        padding: 57px 17px 0 0;
        width: -moz-fit-content;
        width: fit-content;
        box-sizing: border-box;
        margin-left: auto
    }

    .container .left .fix-nav .nav {
        width: auto
    }

    .container .left .fix-nav .nav h3 {
        border: none !important;
        font-size: 20px;
        line-height: 60px;
        padding: 0 0 0 25px
    }

    .container .left .fix-nav .nav h3::before {
        background: #fff;
        height: 4px;
        top: 50%;
        left: 0
    }

    .container .left .fix-nav .nav h3::after {
        display: none
    }

    .container .left .fix-nav .nav ul {
        opacity: 1;
        pointer-events: auto;
        visibility: visible;
        border: none !important
    }

    .container .left .fix-nav .nav ul li {
        background: none;
        border: none
    }

    .container .left .fix-nav .nav ul li a {
        font-size: 18px;
        line-height: 34px;
        letter-spacing: -0.02em;
        display: inline-block;
        padding: 1px 17px 0 12px
    }

    .container .left .fix-nav .nav ul li a:hover {
        opacity: 1;
        font-weight: 600;
        background-color: #fff
    }

    .container .left .fix-nav .nav ul li+li {
        margin-top: 14px
    }

    .container .right {
        flex: 1
    }
}

@media screen and (min-width: 1000px)and (max-width: 1470px) {
    .container .left {
        width: 100%;
        max-width: 300px
    }

    .container .left .fix-nav {
        padding-left: 17px
    }

    .container .right {
        width: calc(100% - 300px);
        overflow: hidden;
        box-sizing: border-box;
        padding: 0 10px 0
    }
}

#lesson {
    padding-top: 30vw
}

#lesson .price {
    box-sizing: border-box;
    text-align: center;
    font-weight: bold;
    width: 80%;
    margin: 7vw auto 0;
    padding: 3vw 0;
    border: 1px solid #bababa
}

#lesson .price dt {
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto 2vw;
    border-bottom: 1px solid #d6d6d6;
    padding: 0 4% 1vw;
    letter-spacing: .1em
}

#lesson .price dd {
    font-size: 18px;
    letter-spacing: .1em
}

#lesson .txt {
    text-align: center;
    margin-top: 5vw
}

#lesson .set1 {
    margin-top: 12vw
}

#lesson .set1 h3 {
    background-image: url("../img/class_hirabari/lesson_icon1.png")
}

#lesson .set2 {
    margin-top: 12vw
}

#lesson .set2 h3 {
    background-image: url("../img/class_hirabari/lesson_icon2.png")
}

@media screen and (min-width: 1000px) {
    #lesson {
        padding-top: 136px
    }

    #lesson .price {
        width: 350px;
        margin-top: 38px;
        padding: 13px 0 5px
    }

    #lesson .price dt {
        margin-bottom: 8px;
        padding: 0 8px 0
    }

    #lesson .price dd {
        font-size: 20px
    }

    #lesson .set1 {
        margin-top: 71px
    }

    #lesson .set1 .txt {
        margin-top: 32px
    }

    #lesson .set1 .bnr-shared {
        margin-top: 35px
    }

    #lesson .set2 {
        margin-top: 107px
    }

    #lesson .set2 h3 {
        padding-top: 93px
    }

    #lesson .set2 .txt {
        margin-top: 40px
    }

    #lesson .set2 .price {
        padding: 8px 0 14px
    }

    #lesson .set2 .price dt {
        padding-bottom: 2px
    }
}

#group {
    border-bottom: 1px solid #bababa;
    padding: 20vw 0 8vw
}

#group h2 {
    text-align: center;
    border-left: 3px solid #ffe63a;
    border-right: 3px solid #ffe63a;
    padding: 1vw 4vw 0;
    line-height: 1;
    font-size: 4.8vw;
    font-weight: 600;
    letter-spacing: .1em;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto
}

#group h3 {
    margin-top: 10vw;
    line-height: 1;
    font-size: 4vw;
    font-weight: 600;
    letter-spacing: .1em
}

#group .note {
    text-align: center;
    margin-top: 7vw
}

@media screen and (min-width: 1000px) {
    #group {
        padding: 100px 0 0;
        border: none
    }

    #group .wrap {
        max-width: 846px;
        border-bottom: 1px solid #ababab;
        padding-bottom: 79px
    }

    #group h2 {
        position: relative;
        left: -5px;
        margin-top: 0;
        padding: 0 0 1px 10px;
        font-size: 26px;
        width: 438px;
        box-sizing: border-box;
        letter-spacing: 0
    }

    #group h3 {
        margin: 35px 0 0 7px;
        font-size: 20px
    }

    #group .table {
        margin-top: 21px
    }

    #group .table .row .item a {
        padding: 11px 0
    }

    #group .note {
        margin-top: 44px;
        letter-spacing: 0
    }

    #group .bnr-shared {
        margin-top: 53px
    }
}

#shucho {
    padding-top: 12vw
}

#shucho h3 {
    background-image: url("../img/class_hirabari/shucho_icon1.png")
}

#shucho .txt {
    text-align: center
}

@media screen and (min-width: 1000px) {
    #shucho {
        padding-top: 68px
    }

    #shucho .wrap {
        max-width: 846px
    }

    #shucho h3 {
        letter-spacing: .07em
    }

    #shucho .txt {
        margin-top: 40px
    }

    #shucho .table {
        margin-top: 47px
    }
}

#access {
    padding-top: 20vw
}

#access .set1 .photo {
    margin-top: 8vw
}

#access .set1 .box-info {
    margin-top: 12vw
}

#access .set1 .box-info .h4-shared span {
    font-size: 4.26vw
}

#access .set1 .box-info .info {
    border: 1px solid #bababa;
    margin-top: 5vw
}

#access .set1 .box-info .info dl {
    display: flex;
    border-bottom: 1px solid #bababa;
    line-height: 24px
}

#access .set1 .box-info .info dl dt {
    letter-spacing: .1em;
    border-right: 1px solid #bababa;
    background-color: #ffe63a;
    max-width: 20vw;
    width: 100%;
    padding: 4vw 0 5vw 2%;
    box-sizing: border-box
}

#access .set1 .box-info .info dl dd {
    flex: 1;
    letter-spacing: .1em;
    padding: 4vw 0 5vw 2%
}

#access .set1 .box-info .info dl:last-child {
    border-bottom: none
}

#access .set2 {
    margin-top: 12vw
}

#access .set2 .map {
    margin-top: 5vw;
    height: 70vw
}

@media screen and (min-width: 1000px) {
    #access {
        padding-top: 155px
    }

    #access .wrap {
        max-width: 872px
    }

    #access .h2-shared {
        padding-top: 39px
    }

    #access .h2-shared span {
        margin-top: 37px
    }

    #access .set1 {
        display: flex;
        margin: 74px 0 0 11px
    }

    #access .set1 .photo {
        margin-top: 0
    }

    #access .set1 .box-info {
        margin: 3px 0 0 46px;
        flex: 1
    }

    #access .set1 .box-info .h4-shared span {
        font-size: 22px;
        padding: 0 17px 0 3px;
        letter-spacing: .1em
    }

    #access .set1 .box-info .info {
        margin-top: 14px
    }

    #access .set1 .box-info .info dl {
        line-height: 28px
    }

    #access .set1 .box-info .info dl dt {
        max-width: 105px;
        padding: 12px 0 38px 20px
    }

    #access .set1 .box-info .info dl dd {
        padding: 12px 15px 0 23px
    }

    #access .set1 .box-info .info dl:nth-child(1) dd {
        letter-spacing: .05em
    }

    #access .set1 .box-info .info dl:nth-child(2) dt {
        padding: 17px 0 14px 20px
    }

    #access .set1 .box-info .info dl:nth-child(2) dd {
        padding: 17px 0 0 22px
    }

    #access .set1 .box-info .info dl:nth-child(3) dt {
        letter-spacing: -0.05em
    }

    #access .set1 .box-info .info dl:nth-child(3) dd {
        letter-spacing: .045em
    }

    #access .set1 .box-info .info dl:nth-child(4) dt {
        padding-top: 18px;
        padding-bottom: 23px
    }

    #access .set1 .box-info .info dl:nth-child(4) dd {
        padding-top: 18px
    }

    #access .set2 {
        margin-top: 128px
    }

    #access .set2 .map {
        margin: 15px 0 0 12px;
        height: 500px
    }

    #access .set2 .bnr-shared {
        margin-top: 56px
    }

    #access .set2 .bnr-shared a span {
        letter-spacing: .08em;
        padding-left: 6px
    }
}

#classroom {
    padding-top: 12vw
}

#classroom .inner-class {
    margin-top: 5vw;
    height: 70vw
}

@media screen and (min-width: 1000px) {
    #classroom {
        padding-top: 93px
    }

    #classroom .wrap {
        max-width: 872px
    }

    #classroom .inner-class {
        margin: 15px 0 0 12px;
        height: 500px
    }
}

#menu .note-lead {
    text-align: center;
    margin-top: 7vw
}

#menu .admission-fee {
    border: 1px solid #bababa;
    margin-top: 4vw
}

#menu .admission-fee dl {
    display: flex;
    text-align: center;
    font-weight: 500;
    border-bottom: 1px solid #bababa;
    font-size: 16px;
    line-height: 24px
}

#menu .admission-fee dl dt {
    background-color: #ffe63a;
    border-right: 1px solid #bababa;
    box-sizing: border-box;
    width: 100%;
    max-width: 35vw;
    letter-spacing: .15em;
    padding: 3.5vw 0;    
    font-weight:bold;
}

#menu .admission-fee dl dt span {
    display: block;
    font-size: 12px;
    letter-spacing: .15em
}

#menu .admission-fee dl dd {
    flex: 1;
    letter-spacing: .15em;
    height: -moz-fit-content;
    height: fit-content;
    margin: auto;
    font-weight:bold;
}

#menu .admission-fee dl dd span {
    letter-spacing: .15em;
    font-weight:normal;
}

#menu .admission-fee dl dd span.fs-1 {
    font-size: 12px
}

#menu .admission-fee dl dd span.fs-2 {
    display: block;
    font-size: 10px
}

#menu .admission-fee dl:last-child {
    border-bottom: none
}

#menu .set1 {
    margin-top: 10vw
}

#menu .set1 .h3-shared {
    background-image: url("../img/class_hirabari/menu_icon1.png")
}

#menu .set1 .row1 {
    margin-top: 10vw
}

#menu .set1 .row2 {
    margin-top: 12vw
}

#menu .set1 .row2 .note {
    font-weight: 600;
    font-size: 16px;
    letter-spacing: 0;
    margin-top: 7vw
}

#menu .set1 .row2 .note span {
    display: block
}

#menu .set1 .row2 .note span.note1 {
    font-size: 14px
}

#menu .set1 .row2 .note span.note2 {
    font-size: 12px;
    font-weight: normal
}

#menu .set1 .row2 .list-class-costs {
    border: 1px solid #bababa;
    margin-top: 2vw
}

#menu .set1 .row2 .list-class-costs .item {
    border-bottom: 1px solid #bababa
}

#menu .set1 .row2 .list-class-costs .item dl {
    display: flex;
    font-size: 15px
}

#menu .set1 .row2 .list-class-costs .item dl dt {
    font-weight: 600;
    letter-spacing: .15em;
    border-right: 1px solid #bababa;
    max-width: 35vw;
    width: 100%
}

#menu .set1 .row2 .list-class-costs .item dl dt span:nth-child(1) {
    display: block;
    background: #ffe63a;
    text-align: center;
    padding: 1vw 0
}

#menu .set1 .row2 .list-class-costs .item dl dt span i {
    font-size: 11px
}

#menu .set1 .row2 .list-class-costs .item dl dd {
    border-bottom: 1px dashed #bababa;
    padding: 1vw 0;
    text-align: center;
    font-weight: 600;
    letter-spacing: .15em;
    flex: 1
}

#menu .set1 .row2 .list-class-costs .item dl dd span {
    font-size: 9.5px;
    margin-left: 5%;
    font-weight: normal;
    letter-spacing: .09em
}

#menu .set1 .row2 .list-class-costs .item p {
    font-size: 10px;
    letter-spacing: 0;
    padding: 1.3vw 0 1.5vw 2%;
    text-align: left
}

#menu .set1 .row2 .list-class-costs .item:last-child {
    border-bottom: none
}

#menu .set1 .row2 .list-note {
    margin-top: 5vw
}

#menu .set1 .row2 .list-note li {
    font-size: 12px;
    letter-spacing: .1em
}

#menu .set1 .row2 .list-note li:nth-child(2) {
    line-height: 24px
}

#menu .set1 .row2 .bnr {
    margin-top: 8vw
}

#menu .set2 {
    padding-top: 15vw
}

#menu .set2 .h3-shared {
    background-image: url("../img/class_hirabari/menu_icon2.png")
}

#menu .set2 .row1 {
    margin-top: 7vw
}

#menu .set2 .row2 {
    margin-top: 7vw
}

#menu .set2 .row3 {
    margin-top: 7vw
}

#menu .set2 .row3 .list-note {
    margin-top: 5vw
}

#menu .set2 .row3 .list-note li {
    font-size: 12px;
    letter-spacing: .1em
}

#menu .set2 .row3 .bnr {
    margin-top: 8vw
}

@media screen and (min-width: 1000px) {
    #menu {
        padding-top: 145px
    }

    #menu .wrap {
        max-width: 620px;
        padding-left: 12px
    }

    #menu .h2-shared {
        padding-top: 39px;
        letter-spacing: .07em
    }

    #menu .h2-shared span {
        margin-top: 37px
    }

    #menu .h4-shared span {
        font-size: 20px;
        padding: 0 19px 0 6px
    }

    #menu .note-lead {
        margin-top: 33px
    }

    #menu .admission-fee {
        margin-top: 8px
    }

    #menu .admission-fee dl {
        font-size: 18px
    }

    #menu .admission-fee dl dt {
        max-width: 174px
    }

    #menu .admission-fee dl dt span {
        font-size: 14px
    }

    #menu .admission-fee dl dd span.fs-1 {
        font-size: 14px
    }

    #menu .admission-fee dl dd span.fs-2 {
        display: block;
        font-size: 12px
    }

    #menu .set1 {
        margin-top: 71px
    }

    #menu .set1 .row1 {
        margin-top: 55px
    }

    #menu .set1 .row1 .admission-fee dl:nth-child(1) dt {
        padding: 19px 0 13px
    }

    #menu .set1 .row1 .admission-fee dl:nth-child(2) dt {
        padding: 24px 0 22px;
        line-height: 20px;
        letter-spacing: .05em
    }

    #menu .set1 .row2 {
        margin-top: 63px
    }

    #menu .set1 .row2 .admission-fee dl dt {
        padding: 13px 0 11px;
        
    }

    #menu .set1 .row2 .note {
        margin-top: 35px;
        letter-spacing: .1em
    }

    #menu .set1 .row2 .note span {
        display: inline-block;
        letter-spacing: .085em
    }

    #menu .set1 .row2 .note span.note1 {
        margin-left: 2px
    }

    #menu .set1 .row2 .note span.note2 {
        margin-left: 9px
    }

    #menu .set1 .row2 .list-class-costs {
        margin-top: 10px
    }

    #menu .set1 .row2 .list-class-costs .item dl {
        font-size: 18px;
        line-height: 24px
    }

    #menu .set1 .row2 .list-class-costs .item dl dt {
        max-width: 414px
    }

    #menu .set1 .row2 .list-class-costs .item dl dt span:nth-child(1) {
        width: -moz-fit-content;
        width: fit-content;
        padding: 10px 24px 4px 38px
    }

    #menu .set1 .row2 .list-class-costs .item dl dt span:nth-child(2) {
        position: relative;
        font-weight: normal;
        padding: 10px 10px 6px 24px;
        font-size: 12px;
        letter-spacing: .055em
    }

    #menu .set1 .row2 .list-class-costs .item dl dt span:nth-child(2)::before {
        content: "";
        position: absolute;
        border-top: 1px dotted #bababa;
        top: -1px;
        right: 0;
        width: calc(100% - 178px)
    }

    #menu .set1 .row2 .list-class-costs .item dl dt span i {
        font-size: 14px;
        margin-left: -7px
    }

    #menu .set1 .row2 .list-class-costs .item dl dd {
        border-bottom: none;
        padding: 19px 0 0;
        text-align: center
    }

    #menu .set1 .row2 .list-class-costs .item dl dd span {
        display: block;
        font-size: 12px;
        margin: 4px 0 0;
        letter-spacing: .09em
    }

    #menu .set1 .row2 .list-note {
        margin: 31px 0 0 3px
    }

    #menu .set1 .row2 .list-note li {
        font-size: 14px;
        line-height: 36px;
        letter-spacing: .022em
    }

    #menu .set1 .row2 .bnr {
        margin-top: 60px
    }

    #menu .set2 {
        padding-top: 95px
    }

    #menu .set2 .h3-shared {
        padding-top: 93px
    }

    #menu .set2 .row1 {
        margin-top: 46px
    }

    #menu .set2 .row1 .admission-fee dl:nth-child(1) dt {
        padding: 19px 0 13px
    }

    #menu .set2 .row1 .admission-fee dl:nth-child(2) dt {
        padding: 20px 0 19px;
        letter-spacing: .05em
    }

    #menu .set2 .row2 {
        margin-top: 62px
    }

    #menu .set2 .row2 .admission-fee dl:nth-child(1) dt {
        padding: 13px 0 12px
    }

    #menu .set2 .row3 {
        margin-top: 35px
    }

    #menu .set2 .row3 .admission-fee dl:nth-child(1) dt {
        padding: 14px 0 10px
    }

    #menu .set2 .row3 .admission-fee dl:nth-child(2) dt {
        padding: 17px 0 25px
    }

    #menu .set2 .row3 .list-note {
        margin: 22px 0 0 3px
    }

    #menu .set2 .row3 .list-note li {
        font-size: 14px;
        line-height: 30px;
        letter-spacing: .034em
    }

    #menu .set2 .row3 .bnr {
        margin-top: 76px
    }
}

#flow {
    padding-top: 20vw
}

#flow .row.row1 {
    margin-top: 10vw
}

#flow .row.row1 .bnr-shared a span::before {
    content: "";
    position: absolute;
    background: url("../img/shared/icon_mail_black.png") no-repeat;
    background-size: 100%;
    width: 15px;
    height: 11px;
    top: 50%;
    transform: translateY(-50%);
    left: 10%
}

#flow .row.row1 .bnr-shared a:hover span::before {
    background-image: url("../img/shared/icon_mail_white.png")
}

#flow .row+.row {
    margin-top: 15vw
}

#flow .row dl {
    border: 3px solid #ffe63a;
    box-sizing: border-box;
    position: relative
}

#flow .row dl dt {
    font-style: italic;
    line-height: 1;
    font-size: 9.3vw;
    letter-spacing: -0.05em;
    position: absolute;
    background: #fff;
    top: -5vw;
    left: 3%;
    padding: 0 2% 0
}

#flow .row dl dd {
    font-weight: bold;
    text-align: center;
    padding: 3vw 0;
    font-size: 4vw;
    letter-spacing: .15em
}

#flow .row .txt {
    margin-top: 6vw;
    text-align: center;
    letter-spacing: 0
}

#flow .row .list-note {
    margin-top: 4vw
}

#flow .row .list-note li {
    font-size: 12px;
    text-align: center;
    line-height: 24px
}

@media screen and (min-width: 1000px) {
    #flow {
        padding: 158px 0 132px
    }

    #flow .wrap {
        max-width: 620px;
        padding-left: 10px
    }

    #flow .h2-shared {
        padding-top: 39px;
        letter-spacing: .1em
    }

    #flow .h2-shared span {
        margin-top: 37px
    }

    #flow .row dl dt {
        font-size: 60px;
        top: -31px;
        left: 26px;
        padding: 0 11px 0 6px
    }

    #flow .row dl dd {
        padding: 15px 0 14px;
        font-size: 22px
    }

    #flow .row .txt {
        margin-top: 28px
    }

    #flow .row .bnr-shared {
        width: 298px;
        margin-top: 27px;
        position: relative;
        left: -4px
    }

    #flow .row .bnr-shared a {
        padding: 15px 0
    }

    #flow .row .bnr-shared a span {
        font-size: 18px;
        letter-spacing: .04em
    }

    #flow .row .list-note {
        margin-top: 5px
    }

    #flow .row .list-note li {
        font-size: 14px;
        line-height: 30px;
        letter-spacing: .01em
    }

    #flow .row.row1 {
        margin-top: 66px
    }

    #flow .row.row1 .bnr-shared a span {
        padding-left: 17px
    }

    #flow .row.row1 .bnr-shared a span::before {
        left: 57px
    }

    #flow .row.row2 {
        margin-top: 67px
    }

    #flow .row.row2 .txt {
        margin-top: 19px
    }

    #flow .row.row3 {
        margin-top: 67px
    }

    #flow .row.row4 {
        margin-top: 75px
    }

    #flow .row.row4 .txt {
        margin-top: 19px
    }
}

#recruit {
    border-bottom: 1px solid #fff
}

#recruit .box-parallax {
    padding: 15vw 0 5vw
}

#recruit .wrap {
    padding-bottom: 8vw
}

#recruit .photo {
    position: absolute;
    bottom: 0;
    right: 4%;
    width: 30%;
    z-index: -1
}

#recruit .inner {
    position: relative;
    box-sizing: border-box;
    margin: 0 -4.5% 0;
    padding: 15vw 12%;
    color: #fff;
    background: url("../img/index/recruit_deco_top.png") no-repeat right 2vw top 2vw/30%, url("../img/index/recruit_deco_bot.png") no-repeat left 2vw bottom 2vw/30%
}

#recruit .inner::before {
    content: "";
    position: absolute;
    background: rgba(17, 17, 17, .8);
    inset: 0;
    z-index: -2
}

#recruit .inner h2 {
    font-size: 7.1vw;
    text-align: center;
    line-height: 1.4;
    letter-spacing: .15em
}

#recruit .inner .txt {
    margin-top: 7vw
}

@media screen and (min-width: 1000px) {
    #recruit .box-parallax {
        padding: 160px 0 114px
    }

    #recruit .wrap {
        padding-bottom: 0
    }

    #recruit .photo {
        inset: auto -137px 3px auto;
        width: auto;
        z-index: 1
    }

    #recruit .inner {
        max-width: 950px;
        margin: 0 auto;
        padding: 109px 0 93px;
        background-position: right top, left bottom;
        background-size: auto
    }

    #recruit .inner::before {
        inset: 24px
    }

    #recruit .inner h2 {
        font-size: 36px;
        line-height: 36px;
        letter-spacing: .02em
    }

    #recruit .inner .txt {
        text-align: center;
        max-width: 700px;
        line-height: 44px;
        margin: 42px auto 0;
        letter-spacing: .1em
    }
}

@media screen and (min-width: 1000px)and (max-width: 1300px) {
    #recruit .photo {
        right: calc(-50vw + 50%)
    }

    #recruit .inner .txt {
        position: relative;
        z-index: 1
    }
}

#contact {
    background-color: #000;
    color: #fff;
    border-bottom: 1px solid #fff;
    padding: 15vw 0 13vw
}

#contact h2 {
    font-size: 6vw;
    text-align: center;
    line-height: 1.5;
    letter-spacing: .05em
}

#contact .bnr-shared {
    width: 75%;
    margin: 8vw auto 0
}

@media screen and (min-width: 1000px) {
    #contact {
        padding: 77px 0 82px
    }

    #contact h2 {
        font-size: 34px;
        line-height: 66px;
        letter-spacing: -0.045em
    }

    #contact .bnr-shared {
        width: 438px;
        margin-top: 66px;
        position: relative;
        left: 20px
    }
}

#class {
    background-color: #fff
}

#class .item {
    padding: 10vw 0;
    border-top: 2px solid #b6b6b6
}

#class .item .photo {
    width: 70%;
    margin: 0 auto
}

#class .item dl {
    margin-top: 10vw;
    text-align: center
}

#class .item dl dt {
    font-size: 5.3vw;
    line-height: 1;
    font-weight: bold;
    letter-spacing: .1em
}

#class .item dl dd {
    letter-spacing: .1em;
    margin-top: 3vw
}

#class .item .bnr-shared {
    width: 80%;
    margin: 5vw auto 0
}

#class .item .bnr-shared a {
    border-radius: 10px;
    border: none;
    background-color: #000;
    color: #000
}

#class .item .bnr-shared a span {
    font-size: 18px;
    font-weight: bold
}

#class .item .bnr-shared a::before {
    background: #ffe63a
}

#class .item .bnr-shared a:hover {
    color: #fff
}

#class .item .bnr-shared a:hover span::before {
    background: #fff
}

#class .item:last-child {
    border-bottom: 2px solid #b6b6b6
}

@media screen and (min-width: 1000px) {
    #class .inner {
        max-width: 1500px;
        margin: 0 auto;
        display: flex
    }

    #class .item {
        padding: 51px 37px 63px;
        box-sizing: border-box;
        width: 33.3333333333%;
        border-left: 1px solid #b6b6b6;
        border-top: none
    }

    #class .item .photo {
        width: auto;
        margin: 0
    }

    #class .item .photo img {
        width: 100%;
        height: auto
    }

    #class .item dl {
        margin: 27px 0 0 23px;
        text-align: left
    }

    #class .item dl dt {
        font-size: 30px;
        line-height: 60px
    }

    #class .item dl dd {
        line-height: 30px;
        margin-top: 8px
    }

    #class .item .bnr-shared {
        max-width: 383px;
        width: 100%;
        margin-top: 45px
    }

    #class .item .bnr-shared a {
        padding: 24px 14px 20px 0
    }

    #class .item .bnr-shared a span {
        letter-spacing: .14em
    }

    #class .item .bnr-shared a span::before {
        width: 6px;
        height: 8px;
        right: 47px
    }

    #class .item:last-child {
        border-bottom: none;
        border-right: 1px solid #b6b6b6
    }
}

@media screen and (min-width: 1000px)and (max-width: 1300px) {
    #class .item {
        padding-left: 15px;
        padding-right: 15px
    }

    #class .item dl {
        margin-left: 5px
    }

    #class .item dl dd {
        letter-spacing: 0
    }
}

#class_hirabari #group .table .row .item {
    min-height: 19vw
}

#class_hirabari #shucho .table .row .item {
    min-height: 40vw
}

#class_atsuta #group .table .row .item {
    min-height: 30vw
}

@media screen and (min-width: 1000px) {
    #class_atsuta #group .wrap {
        border: none;
        padding-bottom: 0
    }

    #class_atsuta #group .table .row .item {
        padding: 6px 5px
    }

    #class_atsuta #group .table .row .item a {
        padding: 7px 0;
        line-height: 24px
    }

    #class_atsuta #access {
        padding-top: 108px
    }

    #class_obu #group .wrap {
        border: none;
        padding-bottom: 0
    }

    #class_obu #group .table .row .item {
        padding: 6px 5px 8.5px
    }

    #class_obu #group .table .row .item a {
        padding: 5px 0;
        line-height: 24px
    }

    #class_obu #group .table .row .item a+a {
        margin-top: 15px
    }

    #class_obu #group .table .row:last-child .item {
        padding-bottom: 18px
    }

    #class_obu #group .note {
        margin-top: 35px
    }

    #class_obu #access {
        padding-top: 167px
    }
}

.popup-shared {
    position: relative;
    margin: 0 4% 0;
    padding-top: 11vw
}

.popup-shared .box {
    background: #fff;
    box-sizing: border-box;
    border-radius: 26px;
    padding: 4vw
}

.popup-shared .txt-lead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    background: #ffe63a;
    line-height: 1;
    border-radius: 14px;
    font-weight: 600;
    padding: 3.5vw 4% 3.5vw 7%
}

.popup-shared .txt-lead dt {
    font-size: 4vw;
    letter-spacing: .1em
}

.popup-shared .txt-lead dd {
    letter-spacing: .1em;
    border-left: 2px solid #000;
    padding: 3px 0 1px 4%;
    font-size: 3.4vw
}

.popup-shared .txt-inner {
    text-align: center;
    font-size: 3.7vw;
    font-weight: 600;
    margin-top: 4vw
}

.popup-shared .txt-inner span {
    letter-spacing: 0;
    margin-left: 5%
}

.popup-shared .txt-bot {
    font-size: 12px;
    margin: 2vw 0 5vw
}

.popup-shared .txt-bot .tel {
    display: block;
    letter-spacing: .1em;
    font-weight: 600;
    text-align: center
}

@media screen and (min-width: 1000px) {
    .popup-shared {
        position: relative;
        max-width: 620px;
        margin: 0 auto;
        padding-top: 45px
    }

    .popup-shared .box {
        padding: 39px 41px 56px
    }

    .popup-shared .txt-lead {
        padding: 20px 19px 19px 39px
    }

    .popup-shared .txt-lead dt {
        font-size: 22px
    }

    .popup-shared .txt-lead dd {
        font-size: 16px;
        padding: 9px 0 7px 19px;
        letter-spacing: .045em
    }

    .popup-shared .txt-inner {
        font-size: 18px;
        margin: 21px 0 0
    }

    .popup-shared .txt-inner span {
        letter-spacing: .06em;
        margin-left: 22px
    }

    .popup-shared .txt-bot {
        font-size: 15px;
        width: 506px;
        margin: 17px auto 0;
        line-height: 31.5px;
        letter-spacing: .01em
    }
}