/* common */
#campaign .note {
    font-size: 0.75rem;
    margin-top: 1rem;
}

#price-block h3 {
    color: #31302B;
    font-size: 1rem;
    font-weight: 700;
    border-bottom: 2px solid #CCAC00;
    margin-bottom: 20px;
    margin-top: 40px;
    padding-bottom: 5px;
}

.point,
.price {
    font-size: 0.875rem;
    margin: 10px 0;
}
.point{
    height: 2rem;
    margin-top: 30px;
}

.price {
    text-align: right;
    margin: 10px 0 20px;
    border-bottom: 1px solid #c9c9c8;
}

.price-note {
    font-size: 0.75rem;
    font-weight: 500;
    text-align: right;
    margin-top: 1.5rem;
}

.price-list dd span {
    display: inline-block;
    width: 6rem;
}
.price span,
.price-list dd span {
    color: #666;
}
.price-list dt,
.price-list dd {
    padding: 5px 0;
    font-size: 0.875rem;
}
.price-list dt {
    float: left;
    clear: left;
    font-weight: 400;
    margin-bottom: 0;
}
.price-list dd {
    text-align: right;
}
.price-list dd.last {
    border-bottom: 1px solid #c9c9c8;
}
.price-list dd.caution {
    text-align: right;
    padding: 0 0 5px 0;
    font-size: 77%;
}
.caution {
    text-align: right;
    padding: 0 0 5px 0;
    font-size: 77%;
}
.price-list dd.sub-text {
    text-align: left!important;
    padding: 0 0 5px 0;
    font-size: 77%;
}
.red {
    color: #C1272D !important;
}
.blue {
    color: #0071BC !important;
}

.length-type {
    background-color: #fff;
    padding: 10px;
    margin-bottom: 20px;
    padding-bottom: 10px!important;
    justify-content: center;
}
.length-type>.columns {
    padding: 5px 5px 0;
}
.length-card {
    max-width: 200px;
}
.length-a {
    font-size: 40px;
    font-family: 'Playfair Display', serif;
    font-style: italic;
    text-align: center;
    margin-bottom: 0;
}
.length-k {
    font-size: 0.875rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 5px;
}
.length-desc {
    font-size: 0.625rem;
    margin-bottom: 0;
}

#nakatani {
    margin-bottom: 20px;
}
#nakatani #col-img {
    background-color: #000;
}
#nakatani #col-text {
    background-color: #fff;
    padding: 20px;
}
#nakatani #col-text .ttl {
    background-color: #CCAC00;
    color: #fff;
    text-align: center;
    border-radius: 30px;
    font-size: 0.875rem;
    padding: 3px 0;
}
#nakatani #col-text .description {
    font-size: 0.75rem;
}

/* Small only */
@media screen and (max-width: 39.9375em) {
    section.service-menu-item h2 {
        font-size: 0.75rem;
        font-weight: 700;
        border: 1px solid #CACACA;
        background-color: #fff;
        padding: 20px 10px;
        position: relative;
    }
    section.service-menu-item h2::after {
        content: none!important;
    }

    #page-catch {
        background-image: url("../_img/hair/sp_catch_hair.png");
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 130px;
        margin-bottom: 100px;
        position: relative;
        background-color: #ffffff;
    }
    #catch-txt {
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        top: 90px;
    }
    .page-title {
        font-size: 43px;
        font-family: 'Playfair Display', serif;
        color: #CCAC00;
        text-align: center;
        line-height: 1;
        /*margin-top: -30px;*/
        letter-spacing: .5rem;
    }
    .page-title small {
        font-size: 1rem;
        color: #CCAC00;
        display: block;
        line-height: 2;
    }
    .lead {
        font-size: 0.75rem;
        padding: 0 15px;
        /*margin-bottom: 5rem;*/
        text-align: center;
    }

    #campaign {
        position: relative;
    }
    #campaign h2 {
        font-size: 0.938rem;
        font-family: 'Playfair Display', serif;
        font-style: italic;
        font-weight: 700;
        display: block;
        text-align: center;
        position: absolute;
        top: -40px;
        width: 80%;
        left: 0;
        right: 0;
        margin: auto;
    }
    .cp-date {
        font-size: 1rem;
        display: block;
        text-align: center;
        font-family: initial;
        font-style: initial;
        color: #C1272D;
    }
    #campaign img {
        width: 100%;
    }
    .cp-txt {
        float: inherit;
    }

    .price-list dt {
        float: none;
        font-weight: 700;
        line-height: 1rem;
        margin-top: 0.5rem;
    }
    .price-list dt:before {
        content: "■";
        color: #CBAB00;
    }
    .point{
      font-weight: 700;
    }
    .point::before{
      content: "■";
      color: #CBAB00;
    }

    .btn-toggle {
        cursor: pointer;
        background-image: url(/_img/btn_close.png);
        background-repeat: no-repeat;
        background-size: 21px;
        background-position: 95%;
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        z-index: 9999;
        top: 0;
        left: 0;
    }
    .btn-toggle.close {
        background-image: url("/_img/btn_open.png");
    }
    #price-block {
        display: none;
    }

    #staff {
        text-align: center;
    }
    #staff h2 {
        text-align: center;
        font-weight: 700;
        margin: 40px 0 20px 0;
    }
    #staff p {
        font-size: 0.75rem;
        margin-top: 1rem;
    }
    .pricelist-title{
      text-align: center;
      font-weight: 700;
      margin: 40px 0 20px 0;
    }
    .length-card .column, .length-card .columns {
        padding-left: 5%!important;
        padding-right: 5%!important;
    }
    .length-desc {
        margin-bottom: 15px;
    }
    .length-card, .length-card .column, .length-card .columns {
        display: flex;
        flex-direction: column;
    }
    .length-card .columns img {
        margin-top: auto;
    }
}

/* Medium and up */
@media screen and (min-width: 40em) {}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
  section.service-menu-item h2 {
      font-size: 0.75rem;
      font-weight: 700;
      border: 1px solid #CACACA;
      background-color: #fff;
      padding: 20px 10px;
      position: relative;
  }
    section.service-menu-item h2::after {
        content: none !important;
    }

    #page-catch {
        background-image: url("../_img/hair/sp_catch_hair.png");
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 130px;
        margin-bottom: 100px;
        position: relative;
        background-color: #ffffff;
    }
    #catch-txt {
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        top: 90px;
    }
    .page-title {
        font-size: 43px;
        font-family: 'Playfair Display', serif;
        color: #CCAC00;
        text-align: center;
        line-height: 1;
        /*margin-top: -30px;*/
        letter-spacing: .5rem;
    }
    .page-title small {
        font-size: 1rem;
        color: #CCAC00;
        display: block;
        line-height: 2;
    }
    .lead {
        font-size: 0.75rem;
        padding: 0 15px;
        /*margin-bottom: 5rem;*/
        text-align: center;
    }

    #campaign {
        position: relative;
    }
    #campaign h2 {
        font-size: 0.938rem;
        font-family: 'Playfair Display', serif;
        font-style: italic;
        font-weight: 700;
        display: block;
        text-align: center;
        position: absolute;
        top: -40px;
        width: 80%;
        left: 0;
        right: 0;
        margin: auto;
    }
    .cp-date {
        font-size: 1rem;
        display: block;
        text-align: center;
        font-family: initial;
        font-style: initial;
        color: #C1272D;
    }
    #campaign img {
        width: 100%;
    }
    .cp-txt {
        float: inherit;
    }

    .price-list dt {
        float: none;
        font-weight: 700;
        line-height: 1rem;
    margin-top: 0.5rem;
    }
    .price-list dt:before {
        content: "■";
        color: #CBAB00;
    }

    .btn-toggle {
        cursor: pointer;
        background-image: url(/_img/btn_close.png);
        background-repeat: no-repeat;
        background-size: 21px;
        background-position: 95%;
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        z-index: 9999;
        top: 0;
        left: 0;
    }
    .btn-toggle.close {
        background-image: url("/_img/btn_open.png");
    }
    #price-block {
        display: none;
    }

    #staff {
        text-align: center;
    }
    #staff h2 {
        text-align: center;
        font-weight: 700;
        margin: 40px 0 20px 0;
    }
    #staff p {
        font-size: 0.75rem;
        margin-top: 1rem;
    }
    .pricelist-title{
      text-align: center;
      font-weight: 700;
      margin: 40px 0 20px 0;
    }
    .length-desc {
        margin-bottom: 15px;
    }
    .length-card, .length-card .column, .length-card .columns {
        display: flex;
        flex-direction: column;
    }
    .length-card .columns img {
        margin-top: auto;
    }
}

/* Large and up */
@media screen and (min-width: 64em) {
    #page-catch {
        margin-bottom: 30px;
        background-image: url("../_img/hair/catch_hair.png");
        background-position: center;
        background-repeat: no-repeat;
        height: 310px;
        background-color:#ffffff;
    }
    #catch-inner {
        position: relative;
    }
    #catch-txt {
        max-width: 330px;
        top: 50px;
        position: absolute;
        padding: 0 10px;
    }
    .page-title {
        font-size: 43px;
        font-family: 'Playfair Display', serif;
        color: #CCAC00;
        text-align: center;
        line-height: 1;
        letter-spacing: .5rem;
    }
    .page-title small {
        font-size: 1rem;
        color: #CCAC00;
        display: block;
        line-height: 2.5;
        border-bottom: 1px solid #CCAC00;
        padding-bottom: 13px;
        margin-bottom: 25px;
    }
    .lead {
        font-size: 0.75rem;
        line-height: 1.8;
    }

    #main section {
        padding-bottom: 50px;
    }
    #main section h2 {
        font-size: 1.875rem;
        font-family: 'Playfair Display', serif;
        font-style: italic;
        font-weight: 700;
        margin-bottom: 30px;
    }
    #main section h2:before {
        content: "";
        display: block;
        background-color: #CCAC00;
        width: 18px;
        height: 4px;
    }
    #campaign h2 {
        margin-bottom: 0 !important;
    }
    #campaign h2:before {
        content: "";
        background-image: url("/_img/img_light.png");
        width: 40px !important;
        height: 22px !important;
        background-color: inherit !important;
        background-size: contain;
        margin-bottom: -7px;
    }
    #campaign h2 img {
        width: 180px;
    }
    .cp-date {
        font-family: initial;
        font-style: initial;
        font-size: 1.188rem;
        color: #C1272D;
        font-weight: 400;
        margin-left: 1rem;
    }
    .cp-txt {
        float: right;
    }

    #side {
        position: relative;
    }
    #fixed-area {
        width: 160px;
        margin-top: 30px;
    }
    #side h2 {
        font-size: 1.25rem;
        color: #CCAC00;
        text-align: center;
        letter-spacing: .1rem;
    }
    #side h2:before {
        content: "";
        background-image: url("/_img/line_side_menu.png");
        background-size: cover;
        background-repeat: no-repeat;
        height: 8px;
        height: 6px;
        display: block;
        margin-bottom: 5px;
    }

    #side ul {
        font-size: 0.688rem;
        font-weight: 700;
        margin: 0;
        padding-bottom: 10px;
    }
    #side ul:before {
        content: "";
        background-image: url("/_img/line_side_menu.png");
        background-size: cover;
        background-repeat: no-repeat;
        height: 8px;
        height: 6px;
        display: block;
        margin-bottom: 10px;
    }
    #side ul li {
        position: relative;
        list-style: none;
        padding: 5px 0 5px 30px;
    }
    #side ul li:hover,
    #side ul li.current {
        background-color: #fff;
    }
    #side ul li a {
        display: block;
    }
    #side .service-menu li a:before {
        content: "";
        background-image: url("/_img/arrow04.png");
        background-repeat: no-repeat;
        background-position: left;
        background-size: cover;
        width: 6px;
        height: 10px;
        display: block;
        position: absolute;
        left: 10px;
        top: 9px;
    }
    #side .side-shop-info li a:before {
        content: "";
        background-image: url("/_img/icon_window.png");
        background-repeat: no-repeat;
        background-position: left;
        background-size: cover;
        width: 11px;
        height: 10px;
        display: block;
        position: absolute;
        left: 10px;
        top: 9px;
    }
    #side .side-shop-info li:first-child a:before {
        content: "ー";
        color: #CCAC00;
        width: 11px;
        height: 10px;
        display: block;
        position: absolute;
        left: 10px;
        top: 9px;
        background-image: url();
    }
    #side .controller li a:before {
        content: "";
        background-image: url("/_img/icon_up.png");
        background-repeat: no-repeat;
        background-position: left;
        background-size: cover;
        width: 11px;
        height: 11px;
        display: block;
        position: absolute;
        left: 10px;
        top: 9px;
    }
}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {
}