[data-page-path="190830-ron-herman"] {
    display: block;
}

[data-page-path="190830-ron-herman"] * {
    box-sizing: border-box;
}


[data-page-path="190830-ron-herman"] a {
    color: inherit;
}

[data-page-path="190830-ron-herman"] .hidden {
    display: none !important;
}

/* アニメーション */
[data-page-path="190830-ron-herman"] [data-animation-state] {
    transition: all 1s cubic-bezier(.4, 0, .2, 1);
}

[data-page-path="190830-ron-herman"] [data-animation-state="opacity"] {
    opacity: 0;
    transform: translateY(20px);
}

[data-page-path="190830-ron-herman"] [data-animation-state="active"] {
    transform: translateY(0);
    opacity: 1;
}

[data-page-path="190830-ron-herman"] img[data-animation-state] {
    transition: all 3s cubic-bezier(.4, 0, .2, 1) .5s;
    transform: scale(1);
}

[data-page-path="190830-ron-herman"] img[data-animation-state="zoom"] {
    transform: scale(1.06529);
}

@keyframes photo-iamge-loop-right {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 2560px 0;
    }
}

@keyframes photo-iamge-loop-left {
    0% {
        background-position: 2560px 0;
    }
    100% {
        background-position: 0 0;
    }
}

@media screen and (min-width: 768px) {
    [data-page-path="190830-ron-herman"] [data-view="mobile"],
    [data-page-path="190830-ron-herman"] img[src*="/mobile/"] {
        display: none!important;
    }

    [data-page-path="190830-ron-herman"] .content-inner {
        margin: 0 auto;
        width: 1280px;
    }

    [data-page-path="190830-ron-herman"] .article-header,
    [data-page-path="190830-ron-herman"] .article-information {
        color: rgb(255, 255, 255);
        background-image: url(../img/background/stone.png);
        background-repeat: no-repeat;
        background-position: center top;
        background-size: cover;
        text-align: center;
    }

    [data-page-path="190830-ron-herman"] .photo-image {
        width: 100%;
        height: 235px;
        background-image: url(../img/main.jpg);
        background-repeat: repeat-x;
        background-size: auto 100%;
    }

    [data-page-path="190830-ron-herman"] .photo-image[data-animation="right"] {
        animation: photo-iamge-loop-right 100s linear infinite;
    }

    [data-page-path="190830-ron-herman"] .photo-image[data-animation="left"] {
        animation: photo-iamge-loop-left 100s linear infinite;
    }

    [data-page-path="190830-ron-herman"] .article-header {
        position: relative;
        margin-bottom: 80px;
    }

    [data-page-path="190830-ron-herman"] .article-header-body {
        padding: 30px 0 25px;
        width: 100%;
    }

    [data-page-path="190830-ron-herman"] .article-header h1 {
        font-size: 30px;
    }

    [data-page-path="190830-ron-herman"] .article-header h1 > img {
        display: block;
        margin: 0 auto 30px;
    }

    [data-page-path="190830-ron-herman"] .article-header h1 + p {
        margin-top: 30px;
        line-height: 1.5;
        font-size: 16px;
    }

    .article-header small {
        position: absolute;
        top: 20px;
        right: 20px;
    }

    /* Brand Section */

    [data-section-brand-name] {
        padding-bottom: 80px;
        color: rgb(255, 255, 255);
        background-repeat: no-repeat;
        background-position: center top;
        background-size: cover;
    }

    [data-section-brand-name] .section-inner {
        position: relative;
        margin: 0 auto;
        width: 1020px;
    }

    [data-section-photo-layout="left"] .section-inner,
    [data-section-photo-layout="right"] .section-inner {
        display: flex;

        justify-content: space-between;
    }

    [data-section-photo-layout="right"] .section-inner {
        display: flex;

        flex-direction: row-reverse;
    }

    [data-section-photo-layout="center"] .section-inner {
        margin: 0 auto;
        width: 920px;
    }

    [data-section-brand-name] .section-photo {
        display: block;
        position: relative;
        top: -40px;
        left: 0;
        overflow: hidden;
    }

    [data-section-brand-name] .section-photo img {
        max-width: 100%;
    }

    [data-section-brand-name] .section-body h2 {
        position: relative;
        padding-bottom: 60px;
        font-family: "DIN Alternate", sans-serif;
        font-weight: bold;
        font-size: 52px;
    }

    [data-section-brand-name] .section-body h2::after {
        display: block;
        position: absolute;
        bottom: 30px;
        left: 0;
        margin: 0 auto;
        width: 100px;
        height: 2px;
        content: "";
        background-color: #fff;
    }

    [data-section-brand-name] .section-body h2 > span {
        display: none;
    }

    [data-section-brand-name] .section-body h2 + h3 {
        line-height: 1;
        font-weight: bold;
        font-size: 26px;
    }

    [data-section-brand-name] .section-body h2 + h3 > img {
        margin-top: 15px;
        display: block;
    }

    [data-section-brand-name] .section-body h2 + h3 > span {
        display: none;
    }

    [data-section-brand-name] .section-body h2 + h3 + p {
        margin: 30px 0;
        line-height: 1.5;
        font-size: 16px;
    }

    [data-section-brand-name] .section-body h2 + h3 + p + small {
        line-height: 1.571;
        font-size: 14px;
    }

    [data-section-photo-layout="right"] .section-photo,
    [data-section-photo-layout="left"] .section-photo {
        width: 600px;
    }

    [data-section-photo-layout="right"] .section-body,
    [data-section-photo-layout="left"] .section-body {
        padding-top: 225px;
        width: 380px;
    }

    [data-section-brand-name="mizuki"] .section-inner,
    [data-section-brand-name="anya-hindmarch"] .section-inner,
    [data-section-brand-name="bettina-javaheri"] .section-inner,
    [data-section-brand-name="tanner's-indian-arts"] .section-inner,
    [data-section-brand-name="bettina-javaheri"] .section-inner,
    [data-section-brand-name="hoorsenbuhs"] .section-inner {
        padding: 0 50px;
    }

    [data-section-brand-name="mizuki"] .section-body,
    [data-section-brand-name="anya-hindmarch"] .section-body,
    [data-section-brand-name="bettina-javaheri"] .section-body,
    [data-section-brand-name="tanner's-indian-arts"] .section-body,
    [data-section-brand-name="bettina-javaheri"] .section-body,
    [data-section-brand-name="hoorsenbuhs"] .section-body {
        padding-top: 100px;
        width: 420px;
    }

    [data-section-brand-name="mizuki"] .section-photo,
    [data-section-brand-name="anya-hindmarch"] .section-photo,
    [data-section-brand-name="bettina-javaheri"] .section-photo,
    [data-section-brand-name="tanner's-indian-arts"] .section-photo,
    [data-section-brand-name="bettina-javaheri"] .section-photo,
    [data-section-brand-name="hoorsenbuhs"] .section-photo {
        width: 460px;
    }

    [data-section-brand-name="jil-sander"] {
        background-image: url(../img/background/1.png);
    }

    [data-section-brand-name="missoni"] {
        background-image: url(../img/background/2.png);
    }

    [data-section-brand-name="maison-margiela"] {
        background-image: url(../img/background/3.png);
    }

    [data-section-brand-name="manolo-blahnik"] {
        background-image: url(../img/background/4.png);
    }

    [data-section-brand-name="oscar-de-la-renta"] {
        background-image: url(../img/background/5.png);
    }

    [data-section-brand-name="oscar-de-la-renta"] .section-body h2 {
        font-size: 51px;
    }

    [data-section-brand-name="mame-kurogouchi"] {
        background-image: url(../img/background/6.png);
    }

    [data-section-brand-name="anya-hindmarch"] {
        background-image: url(../img/background/7.png);
    }

    [data-section-brand-name="tanner's-indian-arts"] {
        background-image: url(../img/background/8.png);
    }

    [data-section-brand-name="bettina-javaheri"] {
        background-image: url(../img/background/9.png);
    }

    [data-section-brand-name="mizuki"] {
        background-image: url(../img/background/10.png);
    }

    [data-section-brand-name="hoorsenbuhs"] {
        background-image: url(../img/background/11.png);
    }

    [data-section-brand-name="rh-jewelry-featuring-forevermark"] {
        background-image: url(../img/background/12.png);
    }

    [data-section-brand-name="rh-jewelry-featuring-forevermark"] .section-inner {
        width: 1100px!important;
    }

    [data-section-brand-name="rh-jewelry-featuring-forevermark"] .section-inner .section-body {
        padding: 0 40px;
    }

    [data-section-brand-name="the-row"] {
        background-image: url(../img/background/13.png);
    }

    [data-section-brand-name] h2 {
        line-height: 1.154;
        font-weight: bold;
        font-size: 26px;
    }

    /* Information */

    [data-page-path="190830-ron-herman"] .article-information {
        padding: 100px 0;
    }

    [data-page-path="190830-ron-herman"] .article-information h2 {
        position: relative;
        padding-bottom: 80px;
        font-weight: bold;
        font-size: 52px;
    }

    [data-page-path="190830-ron-herman"] .article-information h2 span {
        display: none;
    }

    [data-page-path="190830-ron-herman"] .article-information h2::after {
        display: block;
        position: absolute;
        bottom: 40px;
        left: 50%;
        margin: 0 auto;
        width: 100px;
        height: 4px;
        content: "";
        background-color: #fff;

        transform: translate(-50%, 0);
    }

    [data-page-path="190830-ron-herman"] .article-information h2 + p {
        line-height: 1.5;
        font-size: 16px;
    }

    /* フッター */
    [data-page-path="190830-ron-herman"] .article-footer {
        padding: 100px 0 100px;
        line-height: 1.571;
        color: rgb(27, 27, 27);
        font-size: 14px;
        text-align: center;
    }

    [data-page-path="190830-ron-herman"] .article-footer a:link,
    [data-page-path="190830-ron-herman"] .article-footer a:visited,
    [data-page-path="190830-ron-herman"] .article-footer a:hover,
    [data-page-path="190830-ron-herman"] .article-footer a:active {
        color: inherit;
        text-decoration: none;
        outline: none;
    }

    [data-page-path="190830-ron-herman"] .article-footer h2 {
        display: inline-block;
        margin-bottom: 20px;
        padding-bottom: 15px;
        border-bottom: 1px solid rgba(27, 27, 27, 1);
        font-size: 15px;
        letter-spacing: .04em;
    }


    [data-page-path="190830-ron-herman"] .article-footer h3 {
        font-weight: normal;
        font-size: 22px;
    }

    [data-page-path="190830-ron-herman"] .article-footer h3 + p {
        line-height: 1.5;
        font-size: 20px;
    }

    [data-page-path="190830-ron-herman"] .article-footer-credit {
        margin-bottom: 100px;
    }

    [data-page-path="190830-ron-herman"] .article-contact-list {
        margin-bottom: 100px;
    }

    [data-page-path="190830-ron-herman"] .article-contact-list li:not(:first-child) {
        margin-top: 20px;
    }

    [data-page-path="190830-ron-herman"] .article-footer a[href^="tel"] {
        pointer-events: none;
    }

    [data-page-path="190830-ron-herman"] .article-footer a[href="#top"] {
        display: inline-block;
        padding-bottom: 5px;
        border-bottom: 1px solid rgba(27, 27, 27, 1);
    }
}

@media screen and (max-width: 767px) {
    [data-page-path="190830-ron-herman"] [data-view="pc"],
    [data-page-path="190830-ron-herman"] img[src*="/pc/"] {
        display: none!important;
    }

    [data-page-path="190830-ron-herman"] .content-inner {
        padding: 0 20px;
    }

    [data-page-path="190830-ron-herman"] .article-header,
    [data-page-path="190830-ron-herman"] .article-information {
        color: rgb(255, 255, 255);
        background-image: url(../img/background/stone.png);
        background-repeat: no-repeat;
        background-position: center top;
        background-size: cover;
        text-align: center;
    }

    [data-page-path="190830-ron-herman"] .photo-image {
        width: 100%;
        height: 120px;
        background-image: url(../img/main.jpg);
        background-repeat: repeat-x;
        background-size: auto 100%;
    }

    [data-page-path="190830-ron-herman"] .photo-image[data-animation="right"] {
        animation: photo-iamge-loop-right 100s linear infinite;
    }

    [data-page-path="190830-ron-herman"] .photo-image[data-animation="left"] {
        animation: photo-iamge-loop-left 100s linear infinite;
    }

    [data-page-path="190830-ron-herman"] .article-header {
        position: relative;
        margin-bottom: 40px;
    }

    [data-page-path="190830-ron-herman"] .article-header-body {
        padding: 25px 0 30px;
        width: 100%;
    }

    [data-page-path="190830-ron-herman"] .article-header h1 {
        font-size: 16px;
    }

    [data-page-path="190830-ron-herman"] .article-header h1 > span {
        display: block;
        margin-bottom: 15px;
        font-family: "DIN Alternate", sans-serif;
        font-weight: bold;
        font-size: 35px;
    }

    [data-page-path="190830-ron-herman"] .article-header h1 > img {
        width: 176px;
        margin: 0 auto 15px;
        display: block;
    }

    [data-page-path="190830-ron-herman"] .article-header h1 + p {
        margin-top: 15px;
        line-height: 1.5;
        font-size: 11px;
    }

    [data-page-path="190830-ron-herman"] .article-header small {
        display: block;
        position: absolute;
        top: 10px;
        right: 10px;
        line-height: 1;
        font-size: 10px;
    }

    /* Brand Section */

    [data-section-brand-name] {
        padding-bottom: 60px;
        color: rgb(255, 255, 255);
        background-repeat: no-repeat;
        background-position: center top;
        background-size: cover;
    }

    [data-section-brand-name="the-row"] {
        padding-bottom: 40px;
    }

    [data-section-brand-name] .section-inner {
        position: relative;
        margin: 0 auto;
        padding: 0 20px;
    }

    [data-section-brand-name] .section-photo {
        display: block;
        position: relative;
        top: -20px;
        left: 0;
        overflow: hidden;
    }

    [data-section-brand-name] .section-photo img {
        max-width: 100%;
    }

    [data-section-brand-name] .section-body h2 {
        position: relative;
        padding-bottom: 40px;
        font-family: "DIN Alternate", sans-serif;
        font-weight: bold;
        font-size: 34px;
    }
    
    [data-section-brand-name] .section-body h2 > span {
        display: none;
    }
    
    [data-section-brand-name] .section-body h2::after {
        display: block;
        position: absolute;
        bottom: 20px;
        left: 0;
        margin: 0 auto;
        width: 50px;
        height: 2px;
        content: "";
        background-color: #fff;
    }

    [data-section-brand-name] .section-body h2 + h3 {
        line-height: 1;
        font-weight: bold;
        font-size: 17px;
    }

    [data-section-brand-name] .section-body h2 + h3 > span {
        margin-top: 8px;
        line-height: 1;
        font-family: "DIN Alternate", sans-serif;
        font-size: 14px;
        display: none;
    }

    [data-section-brand-name] .section-body h2 + h3 > img {
        margin-top: 8px;
        display: block;
    }

    [data-section-brand-name] .section-body h2 + h3 + p {
        margin: 15px 0;
        line-height: 1.5;
        font-size: 13px;
    }

    [data-section-brand-name] .section-body h2 + h3 + p + small {
        line-height: 1.571;
        font-size: 11px;
    }

    [data-section-brand-name="jil-sander"] {
        background-image: url(../img/background/1.png);
    }

    [data-section-brand-name="missoni"] {
        background-image: url(../img/background/2.png);
    }

    [data-section-brand-name="maison-margiela"] {
        background-image: url(../img/background/3.png);
    }

    [data-section-brand-name="manolo-blahnik"] {
        background-image: url(../img/background/4.png);
    }

    [data-section-brand-name="oscar-de-la-renta"] {
        background-image: url(../img/background/5.png);
    }

    [data-section-brand-name="mame-kurogouchi"] {
        background-image: url(../img/background/6.png);
    }

    [data-section-brand-name="anya-hindmarch"] {
        background-image: url(../img/background/7.png);
    }

    [data-section-brand-name="tanner's-indian-arts"] {
        background-image: url(../img/background/8.png);
    }

    [data-section-brand-name="bettina-javaheri"] {
        background-image: url(../img/background/9.png);
    }

    [data-section-brand-name="mizuki"] {
        background-image: url(../img/background/10.png);
    }

    [data-section-brand-name="hoorsenbuhs"] {
        background-image: url(../img/background/11.png);
    }

    [data-section-brand-name="rh-jewelry-featuring-forevermark"] {
        background-image: url(../img/background/12.png);
    }
    [data-section-brand-name="the-row"] {
        background-image: url(../img/background/13.png);
    }


    [data-section-brand-name="jil-sander"] .section-body > img {
        width: 143px;
    }

    [data-section-brand-name="jil-sander"] .section-body h3 > img {
        width: 125px;
    }

    [data-section-brand-name="missoni"] .section-body > img {
        width: 104px;
    }

    [data-section-brand-name="missoni"] .section-body h3 > img {
        width: 178px;
    }

    [data-section-brand-name="maison-margiela"] .section-body > img {
        width: 227px;
    }

    [data-section-brand-name="maison-margiela"] .section-body h3 > img {
        width: 82px;
    }

    [data-section-brand-name="manolo-blahnik"] .section-body > img {
        width: 214px;
    }

    [data-section-brand-name="manolo-blahnik"] .section-body h3 > img {
        width: 96px;
    }

    [data-section-brand-name="oscar-de-la-renta"] .section-body > img {
        width: 245px;
    }

    [data-section-brand-name="oscar-de-la-renta"] .section-body h3 > img {
        width: 89px;
    }

    [data-section-brand-name="mame-kurogouchi"] .section-body > img {
        width: 251px;
    }

    [data-section-brand-name="mame-kurogouchi"] .section-body h3 > img {
        width: 157px;
    }

    [data-section-brand-name="anya-hindmarch"] .section-body > img {
        width: 232px;
    }

    [data-section-brand-name="anya-hindmarch"] .section-body h3 > img {
        width: 67px;
    }

    [data-section-brand-name="tanner's-indian-arts"] .section-body > img {
        width: 155px;
    }

    [data-section-brand-name="tanner's-indian-arts"] .section-body h3 > img {
        width: 156px;
    }

    [data-section-brand-name="bettina-javaheri"] .section-body > img {
        width: 222px;
    }

    [data-section-brand-name="bettina-javaheri"] .section-body h3 > img {
        width: 102px;
    }

    [data-section-brand-name="mizuki"] .section-body > img {
        width: 86px;
    }

    [data-section-brand-name="mizuki"] .section-body h3 > img {
        width: 167px;
    }

    [data-section-brand-name="hoorsenbuhs"] .section-body > img {
        width: 184px;
    }

    [data-section-brand-name="hoorsenbuhs"] .section-body h3 > img {
        width: 83px;
    }

    [data-section-brand-name="rh-jewelry-featuring-forevermark"] .section-body > img {
        width: 318px;
    }

    [data-section-brand-name="rh-jewelry-featuring-forevermark"] .section-body h3 > img {
        width: 157px;
    }

    [data-section-brand-name="the-row"] .section-body > img {
        width: 121px
    }

    [data-section-brand-name="the-row"] .section-body h3 > img {
        width: 88px
    }

    [data-section-brand-name] h2 {
        line-height: 1.154;
        font-weight: bold;
        font-size: 26px;
    }

    [data-section-brand-name="anya-hindmarch"] .section-photo,
    [data-section-brand-name="tanner's-indian-arts"] .section-photo,
    [data-section-brand-name="bettina-javaheri"] .section-photo,
    [data-section-brand-name="mizuki"] .section-photo,
    [data-section-brand-name="hoorsenbuhs"] .section-photo {
        padding: 0 40px;
    }

    /* Information */

    [data-page-path="190830-ron-herman"] .article-information {
        padding: 60px 0;
    }

    [data-page-path="190830-ron-herman"] .article-information > img {
        width: 157px;
    }

    [data-page-path="190830-ron-herman"] .article-information h2 {
        position: relative;
        padding-bottom: 40px;
        font-weight: bold;
        font-size: 34px;
    }

    [data-page-path="190830-ron-herman"] .article-information h2 > span {
        display: none;
    }

    [data-page-path="190830-ron-herman"] .article-information h2::after {
        display: block;
        position: absolute;
        bottom: 20px;
        left: 50%;
        margin: 0 auto;
        width: 100px;
        height: 2px;
        content: "";
        background-color: #fff;

        transform: translate(-50%, 0);
    }

    [data-page-path="190830-ron-herman"] .article-information h2 + p {
        line-height: 1.5;
        font-size: 13px;
    }

    /* フッター */
    .article-footer {
        padding: 50px 0;
        line-height: 1;
        z-index: 1;
        color: rgba(27, 27, 27, 1);
        text-align: center;
    }

    .article-footer a:link,
    .article-footer a:visited,
    .article-footer a:hover,
    .article-footer a:active {
        color: inherit;
        text-decoration: none;
        outline: none;
    }

    .article-footer h2 {
        display: inline-block;
        margin-bottom: 15px;
        padding-bottom: 5px;
        border-bottom: 1px solid rgba(27, 27, 27, 1);
        font-size: 12px;
        letter-spacing: .04em;
    }

    .article-contact-list {
        margin-bottom: 50px;
    }

    .article-footer h3,
    .article-footer h3 + p {
        line-height: 1.542;
        font-size: 12px;
    }

    .article-footer-credit {
        margin-bottom: 50px;
        line-height: 21px;
        font-size: 11px;
    }

    .article-footer a[href="#top"] {
        display: inline-block;
        padding-bottom: 5px;
        border-bottom: 1px solid rgba(27, 27, 27, 1);
        font-size: 13px;
    }
}


@media screen and (max-width: 320px) {
    [data-view="small-mobile"] {
        display: block;
    }

    [data-page-path="190830-ron-herman"] img {
        max-width: 280px;
    }

    [data-page-path="190830-ron-herman"] .article-header h1 + p {
        font-size: 10px;
    }

    [data-section-brand-name] .section-body h2 + h3 {
        font-size: 15px;
    }

    [data-section-brand-name] .section-body h2 {
        font-size: 28px;
    }
}


