@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed);

@media (max-width: 60em) {

    html {
        visibility: hidden;
    }
    html.wf-active {
        visibility: visible;
    }
    
    .visuallyhidden {
        position: absolute;
        margin: -1px;
        padding: 0;
        width: 1px;
        height: 1px;
        border: 0;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }

    .feature_article {
        position: relative;
        background: url(https://s3-ap-northeast-1.amazonaws.com/statics.pen-online.jp/image/special/bottegaveneta2017/smartphone/footer.jpg) center bottom no-repeat;
        font-family: "source-han-sans-japanese",sans-serif;
        -webkit-font-feature-settings: "palt" 1;
        font-feature-settings: "palt" 1;
        background-size: 100%;
    }
    
    /* ヘッダー */
    
    .article_header {
        padding-top: 30px;
    }
    
    .article_header_image {
        position: relative;
        margin: 0 auto;
        width: 100%;
        height: 480px;
        background: url(https://s3-ap-northeast-1.amazonaws.com/statics.pen-online.jp/image/special/bottegaveneta2017/smartphone/main.png) no-repeat;
        background-size: 100%;
    }
    
    .article_header h1 + p {
        padding: 30px 40px;
        line-height: 2;
        color: #8e3754;
        font-size: 14px;
        letter-spacing: .025em;
        text-align: center;
    }
    
    .feature_movie_container {
        padding: 0 15px;
        margin-bottom: 50px;
    }
    
    .section-inner {
        position: relative;
        margin: 0 auto;
    }
    
    section[data-bottegaveneta-scene] {
        position: relative;
    }
    
    section[data-bottegaveneta-scene] h2 {
        text-align: center;
        margin: 25px 0 35px;
        color: #666;
        line-height: 1;
        font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
        font-size: 14px;
        letter-spacing: .1em;
    }
    
    .section-text-block {
        position: absolute;
        color: #666;
        background: #eee;
        padding: 60px 30px;
    }
    
    .section-text-block > p {
        line-height: 1.69;
        font-size: 13px;
        letter-spacing: .05em;
    }
    
    .section-text-block > p + p {
        margin-top: 15px;
        line-height: 1.58;
        font-size: 12px;
        letter-spacing: .02em;
    }
    
    section[data-bottegaveneta-scene="1"] .section-inner{
        /*height: 1358px;*/
        height: 1328px;
    }
    
    img[src*="bottegaveneta2017/smartphone/section1-photo1.jpg"] {
        position: relative;
        margin-left: 30px;
        width: 195px;
        z-index: 1000;
    }
    
    [data-bottegaveneta-slider="1"] {
        position: absolute;
        top: 255px;
        right: 15px;
        width: 267px;
    }
    
    section[data-bottegaveneta-scene="1"] .slick-dots {
        position: absolute;
        bottom: 0;
        left: -20px;
    }
    
    img[src*="bottegaveneta2017/smartphone/section1-photo2.jpg"] {
        position: absolute;
        right: 15px;
        /*top: 1155px;*/
        bottom: 0px;
        width: 302px;
    }
    
    section[data-bottegaveneta-scene="1"] .section-text-block {
        top: 630px;
        left: 0;
        margin: 0 60px 0 15px;
    }
    
    
    /* Scene 2 */
    
    section[data-bottegaveneta-scene="2"] {
        margin-top: 50px;
    }
    
    section[data-bottegaveneta-scene="2"] .section-inner {
        position: relative;
        height: 2167px;
    }
    
    section[data-bottegaveneta-scene="2"] .section-text-block {
        top: 545px;
        margin: 0 15px 0 60px;
    }
    
    img[src*="bottegaveneta2017/smartphone/section2-photo1.jpg"] {
        float: right;
        margin-right: 15px;
        width: 224px;
        position: relative;
        z-index: 1000;
    }
    
    img[src*="bottegaveneta2017/smartphone/section2-photo2.jpg"] {
        position: absolute;
        top: 135px;
        left: 30px;
        width: 263px;
    }
    
    img[src*="bottegaveneta2017/smartphone/section2-photo3.jpg"] {
        position: absolute;
        top: 1017px;
        left: 15px;
        width: 264px;
        z-index: 1005;
    }
    
    [data-bottegaveneta-slider="2"] {
        position: absolute;
        top: 1135px;
        right: 15px;
        width: 307px;
        height: 348px;
    }
    
    section[data-bottegaveneta-scene="2"] .slick-dots {
        position: absolute;
        bottom: 0;
        left: -20px;
    }
    
    img[src*="bottegaveneta2017/smartphone/section2-photo4.jpg"] {
        position: absolute;
        bottom: 384px;
        left: 15px;
        width: 160px;
        z-index: 1000;
    }
    
    img[src*="bottegaveneta2017/smartphone/section2-photo5.jpg"] {
        position: absolute;
        bottom: 130px;
        right: 15px;
        width: 240px;
    }
    
    img[src*="bottegaveneta2017/smartphone/section2-photo6.jpg"] {
        position: absolute;
        bottom: 0px;
        left: 45px;
        width: 196px;
    }
    
    img[src*="bottegaveneta2017/smartphone/main2.png"] {
        display: block;
        margin: 65px auto 60px;
    }
    
    
    /* Scene 3 */
    
    section[data-bottegaveneta-scene="3"] .section-inner {
        position: relative;
        height: 1850px;
    }
    
    section[data-bottegaveneta-scene="3"] .section-text-block {
        top: 710px;
        margin: 0 45px 0 30px;
        padding: 60px 25px;
    }
    
    [data-bottegaveneta-slider="3"] {
        position: absolute;
        top: 0;
        right: 15px;
        width: 299px;
        height: 252px;
    }
    
    section[data-bottegaveneta-scene="3"] .slick-dots {
        position: absolute;
        top: 0;
        left: -20px;
    }
    
    img[src*="bottegaveneta2017/smartphone/section3-photo1.jpg"] {
        position: absolute;
        top: 252px;
        left: 30px;
        width: 153px;
        z-index: 1000;
    }
    
    img[src*="bottegaveneta2017/smartphone/section3-photo2.jpg"] {
        position: absolute;
        top: 322px;
        right: 30px;
        width: 251px
    }
    
    img[src*="bottegaveneta2017/smartphone/section3-photo3.jpg"] {
        position: absolute;
        top: 1131px;
        right: 30px;
        width: 257px;
    }
    
    img[src*="bottegaveneta2017/smartphone/section3-photo4.jpg"] {
        position: absolute;
        bottom: 202px;
        left: 30px;
        width: 217px;
        z-index: 1000;
    }
    
    img[src*="bottegaveneta2017/smartphone/section3-photo5.jpg"] {
        position: absolute;
        bottom: 50px;
        right: 15px;
        width: 280px;
    }
    
    .article-footer {
        padding: 65px 0 130px;
        line-height: 1.64;
        font-size: 11px;
        text-align: center;
        letter-spacing: 0.08em;
    }
    
    
    /* スライダー */
    
    [data-bottegaveneta-slider] .slick-prev,
    [data-bottegaveneta-slider] .slick-next {
        position: absolute;
        top: 50%;
        margin-top: -17px;
        width: 34px;
        height: 34px;
        border: 0;
        z-index: 1005;
        color: transparent;
        font: 0/0 a;
        font-size: 0;
        text-shadow: none;
        outline: none;
    }
    
    [data-bottegaveneta-slider] .slick-prev:hover,
    [data-bottegaveneta-slider] .slick-next:hover {
        opacity: .5;
    }
    
    [data-bottegaveneta-slider] .slick-prev {
        left: 0;
        background: #8e3754 url(https://s3-ap-northeast-1.amazonaws.com/statics.pen-online.jp/image/special/bottegaveneta2017/smartphone/arrow-left.png) center center no-repeat;
        background-size: 100%;
    }
    
    [data-bottegaveneta-slider] .slick-next {
        right: 0;
        background: #8e3754 url(https://s3-ap-northeast-1.amazonaws.com/statics.pen-online.jp/image/special/bottegaveneta2017/smartphone/arrow-right.png) center center no-repeat;
        background-size: 100%;
    }
    
    [data-bottegaveneta-slider] .slick-dots {
        position: absolute;
        font-size: 0;
        text-align: center;
    }
    
    [data-bottegaveneta-slider] .slick-dots li {
        display: block;
    }
    
    [data-bottegaveneta-slider] .slick-dots li.slick-active button {
        color: #8e3754;
    }
    
    [data-bottegaveneta-slider] .slick-dots button {
        display: block;
        padding: 0;
        line-height: 1;
        border: 0;
        color: rgba(133, 117, 86, .35);
        background: transparent;
        font-family: "Roboto Condensed", sans-serif;
        font-weight: bold;
        font-size: 15px;
        cursor: pointer;
        outline: none;
    }
    
    [data-bottegaveneta-slider] .slick-dots li:not(:first-child) {
        margin-top: 20px;
    }
    
    [data-bottegaveneta-slider] .slick-dots li:not(:first-child) button::before {
        display: block;
        position: absolute;
        left: 50%;
        margin-top: -15px;
        margin-left: -1px;
        width: 1px;
        height: 9px;
        content: "";
        background-color: rgba(133, 117, 86, .35);
    }
    
    /* アニメーション  */
    
    [data-animation="fadeInUp"] {
        z-index: 1;
        visibility: hidden;
    }
    
    [data-animation="fadeInUp"][data-animation-flag="true"] {
        visibility: visible;
    
        -webkit-animation-name: fadeInUp;
        animation-name: fadeInUp;
        -webkit-animation-duration: .7s;
        animation-duration: .7s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }
    
    @-webkit-keyframes fadeInUp {
        0% {
            opacity: 0;
            -webkit-transform: translateY(20px);
            transform: translateY(20px);
        }
        100% {
            opacity: 1;
            -webkit-transform: translateY(0);
            transform: translateY(0);
        }
    }
    
    @keyframes fadeInUp {
        0% {
            opacity: 0;
            -webkit-transform: translateY(20px);
            transform: translateY(20px);
        }
        100% {
            opacity: 1;
            -webkit-transform: translateY(0);
            transform: translateY(0);
        }
    }

}