@charset 'UTF-8';
.mt20
{
    margin-top: 20px;
}

html
{
    font-family: 'Helvetica Neue','HelveticaNeue-CondensedBold', 'HelveticaNeueBoldCondensed', 'HelveticaNeue-Bold-Condensed', 'Helvetica Neue Bold Condensed', 'HelveticaNeueBold', 'HelveticaNeue-Bold', 'Helvetica Neue Bold', 'HelveticaNeue', 'Helvetica Neue',  'Helvetica',  'Arimo','游ゴシック体', YuGothic, '游ゴシック Medium', 'Yu Gothic Medium', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', sans-serif;
    font-size: 62.5%; 
    font-weight: 400;

    overflow-x: hidden;

    color: #111;
    background: #fff;
}

body
{
    font-size: 1.4rem;

    margin: 0;

    -webkit-text-size-adjust: 100%;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary
{
    display: block;
}

blockquote,
dd,
div,
dl,
dt,
h1,
h2,
h3,
h4,
h5,
h6,
li,
ol,
p,
pre,
span,
td,
th,
ul
{
    margin: 0;
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6
{
    font-size: 1rem;
}

a
{
    transition: color .1s linear,opacity .3s linear; 
    text-decoration: none;

    color: #333;
}

a:active,
a:hover
{
    outline: 0;
}

b,
strong
{
    font-weight: bold;
}

h1,
h2,
h3,
p,
div,
table
{
    margin: 0;
}

ul,
li
{
    list-style: none;
}

small
{
    font-size: 80%;
}

sub,
sup
{
    font-size: 75%;
    line-height: 0;

    position: relative;

    vertical-align: baseline;
}

sup
{
    top: -.5em;
}

sub
{
    bottom: -.25em;
}

img
{
    vertical-align: bottom; 

    border: 0;
}

pre
{
    overflow: auto;
}

table
{
    border-spacing: 0; 
    border-collapse: collapse;
}

figure
{
    margin: 0;
    padding: 0;
}

input,
textarea
{
    padding: 0;
}

input[type='submit']
{
    border: none; 
    border-radius: 0;

    -webkit-appearance: none;
}

input[type='text'],
input[type='password'],
input[type='email'],
input[type='tel'],
textarea
{
    border: 1px solid #eee;
    border-radius: 0; 

    -webkit-appearance: none;
}

address
{
    font-size: 1rem;
    font-style: normal;
}

i
{
    font-style: normal;
}

.loader-wrap
{
    position: fixed;
    z-index: 20000;
    top: 0;
    left: 0;

    display: -ms-flexbox;
    display: flex;

    width: 100%;
    height: 100%;

    background: white;

    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
}

.loader,
.loader:before,
.loader:after
{
    width: 2em;
    height: 2em;

    animation: load7 1.8s infinite ease-in-out; 

    border-radius: 50%;

    animation-fill-mode: both;
}

.loader
{
    font-size: 10px;

    position: relative;

    transform: translateZ(0);
    animation-delay: -.16s; 
    text-indent: -9999em;

    color: #000;
}

.loader:before,
.loader:after
{
    position: absolute;
    top: 0;

    width: 2em;
    height: 2em; 

    content: '';
}

.loader:before
{
    left: -3.5em;

    animation-delay: -.32s;
}

.loader:after
{
    left: 3.5em;
}

@keyframes load7
{
    0%,
    80%,
    100%
    {
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40%
    {
        box-shadow: 0 2.5em 0 0;
    }
}

header
{
    display: -ms-flexbox;
    display: flex;

    height: 100vh;
    padding: 20px; 

    text-align: center;

    background: #000;

    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}
header h1 img
{
    max-width: 100%;
}

article .bg
{
    display: -ms-flexbox;
    display: flex;

    height: 250px;
    padding: 20px;

    background: #000;
    background-size: cover !important;
    box-shadow: 0 0 0 20px #000 inset; 

    -ms-flex-pack: justify;
    justify-content: space-between;
}
article .bg .left,
article .bg .right
{
    width: calc(50% - 10px);
    height: 250px;
}
@media screen and (min-width: 1000px)
{
    article .bg
    {
        height: 90vh;
    }
    article .bg .left,
    article .bg .right
    {
        height: 90vh;
    }
}

article section#landscape01 .left
{
    background: url('../img/bg-landscape02_1.jpg') no-repeat center center;
    background-size: cover;
}

article section#landscape01 .right
{
    background: url('../img/bg-landscape02_2.jpg') no-repeat center center;
    background-size: cover;
}

article section#landscape02
{
    background: url('../img/bg-landscape03.jpg') no-repeat center center #000;
    background-size: cover;
}

article section#landscape03 .left
{
    background: url('../img/bg-landscape04_1.jpg') no-repeat center bottom;
    background-size: cover;
}

article section#landscape03 .right
{
    background: url('../img/bg-landscape04_2.jpg') no-repeat center center;
    background-size: cover;
}

article section#landscape04 .left
{
    background: url('../img/bg-landscape05_1.jpg') no-repeat center bottom;
    background-size: cover;
}

article section#landscape04 .right
{
    background: url('../img/bg-landscape05_2.jpg') no-repeat center center;
    background-size: cover;
}

article .inner
{
    max-width: 1000px;
    margin: 0 auto;
    padding: 40px 20px;
}
@media screen and (min-width: 1000px)
{
    article .inner.flex
    {
        display: -ms-flexbox;
        display: flex;
    }
}

article section#agenda
{
    background: url('../img/bg-landscape01.jpg');
    background-size: cover;
}
article section#agenda .inner.flex .left
{
    margin-bottom: 120px;
}
article section#agenda .inner.flex .left nav
{
    font-weight: bold; 

    color: #fff;
}
article section#agenda .inner.flex .left nav dl dt
{
    font-size: 1.2rem;

    margin-bottom: 10px;
}
article section#agenda .inner.flex .left nav dl dd
{
    margin-bottom: 40px;

    background: url('../img/ico-arrow-r-dash.svg') no-repeat center left;
    background-size: 10px auto;
}
article section#agenda .inner.flex .left nav dl dd a
{
    font-size: 2.4rem;
    line-height: 1;

    display: inline-block;

    margin-left: 30px;
    padding: 5px;

    transition: all ease .3s; 

    color: #fff;
    background-image: linear-gradient(to right, transparent 50%, white 50%);
    background-position: 0 0;
    background-size: 200% auto;
}
article section#agenda .inner.flex .left nav dl dd a:hover
{
    color: #111; 
    background-position: -100% 0;
}
article section#agenda .inner.flex .left nav dl dd a ul li
{
    margin-bottom: 10px;
}
article section#agenda .inner.flex .left nav dl dd a ul li:last-child
{
    margin-bottom: 0;
}
article section#agenda .inner.flex .right
{
    margin-bottom: 40px; 

    text-align: center;
}
@media screen and (min-width: 1000px)
{
    article section#agenda .inner.flex
    {
        min-height: 80vh;

        -ms-flex-align: center;
        align-items: center;
    }
    article section#agenda .inner.flex .left,
    article section#agenda .inner.flex .right
    {
        width: 50%;
    }
    article section#agenda .inner.flex .left
    {
        margin-bottom: 0;
    }
    article section#agenda .inner.flex .left nav dl dt
    {
        font-size: 1.4rem;

        margin-bottom: 20px;
    }
    article section#agenda .inner.flex .left nav dl dd
    {
        margin-bottom: 60px;

        background-size: 14px 27px;
    }
    article section#agenda .inner.flex .left nav dl dd:last-child
    {
        margin-bottom: 0;
    }
    article section#agenda .inner.flex .left nav dl dd a
    {
        font-size: 3.0rem;
    }
    article section#agenda .inner.flex .left nav dl dd a br
    {
        display: none;
    }
    article section#agenda .inner.flex .right figure img
    {
        width: 350px;
    }
}

article section.product .ttl-area
{
    position: relative;
}
article section.product .ttl-area .bg-cross
{
    position: relative;
    z-index: 1;

    padding: 30px 0 0;

    text-align: center;

    color: #fff;
    background: url('../img/bg-cross.png') repeat rgba(0, 0, 0, .3);
}
article section.product .ttl-area span
{
    font-size: 1.2rem;
    font-weight: bold; 

    display: inline-block;
}
article section.product .ttl-area h2
{
    font-size: 3.0rem;
    font-weight: bold;
    line-height: 1; 

    margin: 5px 0 25px;
}
article section.product .ttl-area h2:first-of-type
{
    margin-bottom: 0;
}
article section.product .ttl-area h2:last-of-type
{
    margin-bottom: 25px;
}
article section.product .ttl-area .link img
{
    width: 40px;
    height: auto;
}
article section.product .ttl-area .inline-YTPlayer
{
    position: absolute !important;
    top: 0;
    left: 0;

    overflow: hidden; 

    width: 100%;
    height: 100%;
}
article section.product .ttl-area .js-bg-youtube
{
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;
    padding-bottom: 58% !important;
}

@media screen and (min-width: 1000px)
{
    article section.product .ttl-area .bg-cross
    {
        padding: 60px 0 10px;
    }
    article section.product .ttl-area .bg-cross h2
    {
        font-size: 12rem;

        margin-top: 0;
    }
    article section.product .ttl-area .bg-cross .link img
    {
        width: 50px;
    }
}

article section.product .item-outline .look
{
    height: 120vw;
}

article section.product .item-outline .info
{
    padding: 40px 20px 20px;
}
article section.product .item-outline .info.center
{
    background: #f6f6f6;
}
article section.product .item-outline .info.right
{
    background: #e8e8e8;
}
article section.product .item-outline .info figure
{
    text-align: center;
}
article section.product .item-outline .info figure img
{
    max-width: 100%;
}
article section.product .item-outline .info .name
{
    font-size: 1.8rem;
    font-weight: bold;

    margin-top: 20px;
    margin-bottom: 10px;

    border-bottom: 1px solid #111;
}

article section.product .item-outline .info .detail
{
    display: -ms-flexbox;
    display: flex;

    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}
article section.product .item-outline .info .detail dl
{
    width: 50%;
}
article section.product .item-outline .info .detail dl.full
{
    width: 100%;
}
article section.product .item-outline .info .detail dl dt
{
    font-size: 1rem;
    font-weight: bold;

    margin-bottom: 5px; 

    color: #989898;
}
article section.product .item-outline .info .detail dl dd
{
    font-size: 1.2rem;
    font-weight: bold; 

    margin-bottom: 15px;
    padding-right: 5px;

    word-wrap: break-word;
}
article section.product .item-outline .info .detail dl dd ul li
{
    margin-bottom: 3px;
}

@media screen and (min-width: 768px)
{
    article section.product .item-outline
    {
        display: -ms-flexbox;
        display: flex;

        max-width: 1500px;
        margin: 0 auto;
    }
    article section.product .item-outline > div
    {
        box-sizing: border-box; 
        width: 33.33333%;
    }
    article section.product .item-outline .look
    {
        height: auto;
    }
    article section.product .item-outline .info .name
    {
        font-size: 1.8rem; 

        padding-bottom: 5px;
    }
    article section.product .item-outline .info .detail dl
    {
        width: 33%;
    }
}

@media screen and (min-width: 1000px)
{
    article section.product .item-outline .info .detail dl.full
    {
        width: 33%;
    }
}

article section.product .item-introduction
{
    margin-bottom: 30px;
    padding-bottom: 30px; 

    border-bottom: 1px solid #000;
}
article section.product .item-introduction .txt
{
    margin-bottom: 20px;
}
article section.product .item-introduction .txt h3.name
{
    font-size: 3.3rem;

    margin-bottom: 20px;
}
article section.product .item-introduction .txt .marker
{
    font-size: 1.3rem;

    margin-bottom: 15px; 

    color: #fff;
}
article section.product .item-introduction .txt .marker span
{
    display: inline-block;

    margin-bottom: 2px; 
    padding: 3px 5px;

    transition: all ease .3s;

    background-image: linear-gradient(to right, transparent 50%, black 50%);
    background-position: -100% 0;
    background-size: 200% auto;
}
article section.product .item-introduction .txt .explanatory
{
    font-size: 1.3rem;
    line-height: 1.84615;
}
article section.product .item-introduction .txt .explanatory img
{
    display: inline-block;

    max-width: 100%;
    height: auto;
    margin-bottom: 15px;
}
article section.product .item-introduction .img figure
{
    text-align: center;
}
article section.product .item-introduction .img figure img
{
    max-width: 100%;
}
article section.product .item-introduction .img .system
{
    font-weight: bold;
}
article section.product .item-introduction .img .system > span
{
    font-size: 1.4rem;
}
article section.product .item-introduction .img .system p
{
    font-size: 2.0rem; 

    margin-bottom: 5px;
    padding-top: 2px;
}
article section.product .item-introduction .img .system p span
{
    font-weight: normal;
}
@media screen and (min-width: 1000px)
{
    article section.product .item-introduction .flex
    {
        display: -ms-flexbox;
        display: flex;
    }
    article section.product .item-introduction .flex .txt
    {
        padding-right: 50px; 

        -ms-flex: 1;
            flex: 1;
    }
    article section.product .item-introduction .flex .txt h3.name
    {
        font-size: 4.8rem;
    }
    article section.product .item-introduction .flex .txt .marker
    {
        font-size: 1.5rem;
        font-weight: bold;
    }
    article section.product .item-introduction .flex .img
    {
        width: 560px;
    }
    article section.product .item-introduction .flex .explanatory
    {
        font-size: 1.4rem;
        line-height: 2.14286;
    }
    article section.product .item-introduction .flex .system
    {
        margin-bottom: 30px;
    }
    article section.product .item-introduction .flex .system > span
    {
        font-size: 1.8rem;
    }
    article section.product .item-introduction .flex .system p
    {
        font-size: 3.0rem;
    }
}

article section.product .item-point + .item-introduction
{
    margin-top: 60px;
}
@media screen and (min-width: 1000px)
{
    article section.product .item-point + .item-introduction
    {
        margin-top: 100px;
    }
}

article section.product .item-point
{
    margin-bottom: 60px;
}

article section.product .item-construction
{
    margin-bottom: 60px;
}
article section.product .item-construction h4.ttl
{
    font-size: 1.6rem;

    display: -ms-flexbox;
    display: flex;

    text-align: center;

    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}
article section.product .item-construction h4.ttl::before
{
    display: inline-block;

    width: 10px;
    height: 14px;
    margin-bottom: 2px; 

    content: '';

    background: url('../img/ico-parenthesis-l.svg') no-repeat center left;
    background-size: contain;
}
article section.product .item-construction h4.ttl::after
{
    display: inline-block;

    width: 10px;
    height: 14px;
    margin-bottom: 2px; 

    content: '';

    background: url('../img/ico-parenthesis-r.svg') no-repeat center right;
    background-size: contain;
}
article section.product .item-construction .img
{
    margin-bottom: 60px;
}
article section.product .item-construction .img h4 + p
{
    font-size: 1.2rem;
    line-height: 1.5;
}
article section.product .item-construction .img figure img
{
    max-width: 100%;
    height: auto;
}
article section.product .item-construction .txt .ttl
{
    font-size: 1.6rem;
    font-weight: bold;

    display: inline-block;

    margin-bottom: 15px; 

    border-bottom: 2px solid #000;
}
article section.product .item-construction .txt ol
{
    counter-reset: number;
}
article section.product .item-construction .txt ol li
{
    font-size: 1.3rem;
    font-weight: bold;

    position: relative;

    margin-bottom: 15px;
    padding-left: 30px;
}
article section.product .item-construction .txt ol li::before
{
    font-size: 1rem;

    position: absolute;
    top: 3px;
    left: 0;

    display: -ms-flexbox;
    display: flex;

    width: 16px;
    height: 16px;

    content: counter(number); 
    counter-increment: number;

    color: #b6b6b6;
    border: 1px solid #b6b6b6;

    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}
article section.product .item-construction .txt ul.sup li
{
    font-size: 1rem;

    margin-bottom: 5px;
}
@media screen and (min-width: 1000px)
{
    article section.product .item-construction
    {
        display: -ms-flexbox;
        display: flex;
    }
    article section.product .item-construction > div
    {
        width: 50%;
    }
    article section.product .item-construction .img
    {
        text-align: center;
    }
    article section.product .item-construction .img .ttl
    {
        margin-bottom: 5px;
    }
    article section.product .item-construction .img .ttl + p
    {
        margin-bottom: 20px;
    }
    article section.product .item-construction .img .ttl + p br
    {
        display: none;
    }
    article section.product .item-construction .txt ol li
    {
        margin-bottom: 20px;
    }
}

article section.product .item-mechanism h4.ttl
{
    font-size: 1.6rem;
    font-weight: bold;

    margin-bottom: 25px;
}
article section.product .item-mechanism h4.ttl span
{
    display: inline-block; 

    border-bottom: 2px solid #000;
}

@media screen and (min-width: 1000px)
{
    article section.product .item-mechanism .ttl
    {
        text-align: center;
    }
}

article section#wear .item-outline .look
{
    background: url('../img/img-wear-look.jpg') no-repeat left bottom;
    background-size: cover;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2)
{
    article section#wear .item-outline .look
    {
        background: url('../img/img-wear-look@2x.jpg') no-repeat left bottom;
        background-size: cover;
    }
}

article section#shoes .item-outline .look
{
    background: url('../img/img-shoes-look.jpg') no-repeat left bottom;
    background-size: cover;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2)
{
    article section#shoes .item-outline .look
    {
        background: url('../img/img-shoes-look@2x.jpg') no-repeat left bottom;
        background-size: cover;
    }
}

@media screen and (min-width: 1000px)
{
    article .item-outline .info figure
    {
        padding: 0 30px;
    }
}

article section#backpack .item-outline .look
{
    background: url('../img/img-bp-look.jpg') no-repeat left bottom;
    background-size: cover;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2)
{
    article section#backpack .item-outline .look
    {
        background: url('../img/img-bp-look@2x.jpg') no-repeat left bottom;
        background-size: cover;
    }
}

article section#backpack .item-outline .look.look02
{
    background: url('../img/img-bp-look02.jpg') no-repeat center center;
    background-size: cover;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2)
{
    article section#backpack .item-outline .look.look02
    {
        background: url('../img/img-bp-look02@2x.jpg') no-repeat center center;
        background-size: cover;
    }
}

@media screen and (min-width: 1000px)
{
    article .item-outline .info figure
    {
        padding: 0 30px;
    }
}

article section#footprint
{
    padding: 0 20px 20px; 

    text-align: center;

    background: #000;
}
article section#footprint figure img
{
    max-width: 100%;
    height: auto;
}
@media screen and (min-width: 1000px)
{
    article section#footprint
    {
        padding: 40px;
    }
}

article #gallery
{
    background: #000;
}
article #gallery .inner
{
    padding-top: 0;
}
article #gallery ul
{
    display: -ms-flexbox;
    display: flex;

    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}
article #gallery ul li
{
    width: 20%;
}
article #gallery ul li a
{
    display: block;
}
article #gallery ul li a img
{
    max-width: 100%;
    height: auto;
}
article #gallery ul li a:hover
{
    opacity: .2;
}
@media screen and (min-width: 1000px)
{
    article #gallery ul
    {
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    article #gallery ul li
    {
        width: 190px;
        height: 190px;
        margin-bottom: 15px;
    }
}

.sl-wrapper.simple-lightbox .sl-close
{
    background: url('../img/ico-close.svg') no-repeat center center;
    background-size: cover;
}

.sl-wrapper.simple-lightbox .sl-next
{
    background: url('../img/ico-next.svg') no-repeat center center;
    background-size: cover;
}

.sl-wrapper.simple-lightbox .sl-prev
{
    background: url('../img/ico-prev.svg') no-repeat center center;
    background-size: cover;
}

.sl-wrapper.simple-lightbox .sl-close
{
    width: 30px;
    height: 30px;
}

.sl-wrapper.simple-lightbox .sl-next,
.sl-wrapper.simple-lightbox .sl-prev
{
    background-size: 20px 30px;
}

@media screen and (min-width: 1000px)
{
    .sl-wrapper.simple-lightbox .sl-next,
    .sl-wrapper.simple-lightbox .sl-prev
    {
        background-size: 29px 56px;
    }
}

html .sl-overlay
{
    opacity: .9;
}

#sidenav
{
    position: fixed;
    z-index: 1000000;
    top: 20px;
    right: -50px;

    transition: all ease .1s;
}
#sidenav ul li
{
    margin: 3px 0;
}
#sidenav ul li a
{
    display: -ms-flexbox;
    display: flex;

    width: 36px;
    height: 36px;

    transition: all ease .3s; 

    background: rgba(255, 255, 255, .8);

    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
}
#sidenav ul li a img
{
    width: 20px;
    height: auto;
}
#sidenav ul li a:hover
{
    background: white;
}
@media screen and (min-width: 1000px)
{
    #sidenav
    {
        top: 70%;

        transform: translateY(-50%);
    }
    #sidenav ul li a
    {
        width: 50px;
        height: 50px;
    }
    #sidenav ul li a img
    {
        width: 30px;
    }
}

.scroll #sidenav
{
    right: 0;
}

.swiper-container .swiper-slide
{
    position: relative; 

    text-align: center;
}
.swiper-container .swiper-slide .num
{
    font-size: .9rem;
    line-height: 20px;

    position: relative;
    top: -10px; 

    display: inline-block;

    width: 20px;
    height: 20px;

    color: #fff;
    border-radius: 20px;
    background: #989898;
}
.swiper-container .swiper-slide .ttl
{
    font-size: 1.4rem;
    font-weight: bold;

    margin: 0; 

    text-align: center;
}
.swiper-container .swiper-slide p
{
    font-size: 1.2rem;
    line-height: 1.5;

    margin-top: 10px;
    padding: 0 20px; 

    text-align: left;
}
.swiper-container .swiper-slide img
{
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
}
.swiper-container .swiper-slide.wide .not-figure .ttl
{
    font-size: 1.6rem;
}
.swiper-container .swiper-slide.wide .left,
.swiper-container .swiper-slide.wide .right
{
    padding-top: 20px;
}
.swiper-container .swiper-slide.wide .left .num,
.swiper-container .swiper-slide.wide .right .num
{
    top: 0;

    margin-bottom: 10px;
}

.swiper-container .swiper-button-next,
.swiper-container .swiper-button-prev
{
    width: 20px;
    height: 20px;
    margin-top: 0;

    transform: translateY(-50%);
}

.swiper-container .swiper-button-next
{
    right: 0; 

    background: url('../img/ico-arrow-r.svg') no-repeat center center #000;
    background-size: 7px auto;
}

.swiper-container .swiper-button-prev
{
    left: 0; 

    background: url('../img/ico-arrow-l.svg') no-repeat center center #000;
    background-size: 7px auto;
}

.swiper-container .swiper-pagination
{
    font-family: 'Yu Gothic', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif; 
    font-size: 1.2rem;

    right: 10px;
    left: auto;

    display: inline-block;

    width: auto;
    padding: 3px 15px;

    color: #fff;
    border-radius: 50px;
    background: rgba(255, 0, 94, .7);
    background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(255, 0, 94, .7)), color-stop(100%, rgba(255, 170, 0, .7)));
    background: linear-gradient(135deg, rgba(255, 0, 94, .7) 0%, rgba(255, 170, 0, .7) 100%);

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff005e', endColorstr='#ffaa00', GradientType=1 );
}

@media screen and (min-width: 1000px)
{
    .swiper-container
    {
        overflow: visible;
    }
    .swiper-container .swiper-wrapper
    {
        height: auto !important;

        transform: unset !important;

        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }
    .swiper-container .swiper-wrapper .swiper-slide
    {
        width: 25% !important;
    }
    .swiper-container .swiper-wrapper .swiper-slide.wide
    {
        width: 50% !important;
    }
    .swiper-container .swiper-wrapper .swiper-slide.wide .not-figure
    {
        height: 130px;
    }
    .swiper-container .swiper-wrapper .swiper-slide.wide .not-figure .ttl + p
    {
        font-size: 1.4rem;
    }
    .swiper-container .swiper-wrapper .swiper-slide.wide .flex
    {
        display: -ms-flexbox;
        display: flex;
    }
    .swiper-container .swiper-wrapper .swiper-slide.wide .flex .left,
    .swiper-container .swiper-wrapper .swiper-slide.wide .flex .right
    {
        padding-top: 0;
    }
    .swiper-container .swiper-wrapper .swiper-slide.wide .flex .left .num,
    .swiper-container .swiper-wrapper .swiper-slide.wide .flex .right .num
    {
        top: -10px;

        margin-bottom: 0;
    }
    .swiper-container .swiper-button-next,
    .swiper-container .swiper-button-prev
    {
        display: none;
    }
    .swiper-container .swiper-button-next
    {
        right: 0; 

        background: url('../img/ico-arrow-r.svg') no-repeat center center #000;
        background-size: 13px auto;
    }
    .swiper-container .swiper-button-prev
    {
        left: 0; 

        background: url('../img/ico-arrow-l.svg') no-repeat center center #000;
        background-size: 13px auto;
    }
    .swiper-container .swiper-pagination
    {
        right: auto;
        left: 50%;

        transform: translateX(-50%);
    }
}

body.hidden-scroll
{
    overflow: hidden;
}

.sl-overlay
{
    position: fixed;
    z-index: 1050; 
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    display: none;

    opacity: .7;
    background: #000;
}

.sl-wrapper
{
    z-index: 1040;
}
.sl-wrapper button
{
    font-size: 28px;

    padding: 0;

    cursor: pointer; 

    border: 0 none;
    background: transparent;
}
.sl-wrapper button:hover
{
    opacity: .7;
}
.sl-wrapper .sl-close
{
    font-family: Arial, Baskerville, monospace;
    font-size: 3rem; 
    line-height: 44px;

    position: fixed;
    z-index: 1060;
    top: 30px;
    right: 30px;

    display: none;

    width: 44px;
    height: 44px;
    margin-top: -14px;
    margin-right: -14px;

    color: #000;
}
.sl-wrapper .sl-close:focus
{
    outline: none;
}
.sl-wrapper .sl-counter
{
    font-size: 1rem; 

    position: fixed;
    z-index: 1060;
    top: 30px;
    left: 30px;

    display: none;

    color: #000;
}
.sl-wrapper .sl-navigation
{
    display: none; 

    width: 100%;
}
.sl-wrapper .sl-navigation button
{
    font-family: Arial, Baskerville, monospace;
    line-height: 44px;

    position: fixed;
    z-index: 1060;
    top: 50%;

    display: block;

    width: 22px;
    height: 44px;
    margin-top: -22px;

    text-align: center;

    color: #000;
}
.sl-wrapper .sl-navigation button.sl-next
{
    font-size: 2rem; 

    right: 5px;
}
.sl-wrapper .sl-navigation button.sl-prev
{
    font-size: 2rem; 

    left: 5px;
}
.sl-wrapper .sl-navigation button:focus
{
    outline: none;
}
@media (min-width: 35.5em)
{
    .sl-wrapper .sl-navigation button
    {
        width: 44px;
    }
    .sl-wrapper .sl-navigation button.sl-next
    {
        font-size: 3rem; 

        right: 10px;
    }
    .sl-wrapper .sl-navigation button.sl-prev
    {
        font-size: 3rem; 

        left: 10px;
    }
}
@media (min-width: 50em)
{
    .sl-wrapper .sl-navigation button
    {
        width: 44px;
    }
    .sl-wrapper .sl-navigation button.sl-next
    {
        font-size: 3rem; 

        right: 20px;
    }
    .sl-wrapper .sl-navigation button.sl-prev
    {
        font-size: 3rem; 

        left: 20px;
    }
}
.sl-wrapper .sl-image
{
    position: fixed;
    z-index: 10000; 

    -ms-touch-action: none;
        touch-action: none;
}
.sl-wrapper .sl-image img
{
    display: block;

    margin: 0;
    padding: 0;

    border: 0 none;
}
@media (min-width: 35.5em)
{
    .sl-wrapper .sl-image img
    {
        border: 0 none;
    }
}
@media (min-width: 50em)
{
    .sl-wrapper .sl-image img
    {
        border: 0 none;
    }
}
.sl-wrapper .sl-image iframe
{
    border: 0 none; 
    background: #000;
}
@media (min-width: 35.5em)
{
    .sl-wrapper .sl-image iframe
    {
        border: 0 none;
    }
}
@media (min-width: 50em)
{
    .sl-wrapper .sl-image iframe
    {
        border: 0 none;
    }
}
.sl-wrapper .sl-image .sl-caption
{
    position: absolute;
    right: 0; 
    bottom: 0;
    left: 0;

    display: none;

    padding: 10px;

    color: #fff;
    background: rgba(0, 0, 0, .8);
}
.sl-wrapper .sl-image .sl-caption.pos-top
{
    top: 0; 
    bottom: auto;
}
.sl-wrapper .sl-image .sl-caption.pos-outside
{
    bottom: auto;
}
.sl-wrapper .sl-image .sl-download
{
    position: absolute;
    z-index: 1060; 
    right: 5px;
    bottom: 5px;

    display: none;

    color: #000;
}

.sl-spinner
{
    position: fixed;
    z-index: 1007;
    top: 50%;
    left: 50%;

    display: none;

    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px;

    animation: pulsate 1s ease-out infinite; 

    opacity: 0;
    border: 5px solid #333;
    border-radius: 40px;
}

.sl-scrollbar-measure
{
    position: absolute;
    top: -9999px;

    overflow: scroll; 

    width: 50px;
    height: 50px;
}

@keyframes pulsate
{
    0%
    {
        transform: scale(.1);

        opacity: .0;
    }
    50%
    {
        opacity: 1;
    }
    100%
    {
        transform: scale(1.2);

        opacity: 0;
    }
}


/*add20180428*/
article section.product .item-outline .info{
	display: block;
	transition: opacity 0.2s ease;
}
article section.product .item-outline a.info .name:after{
	content: 'Buy';
	font-size: 0.6em;
	display: inline-block;
	background-color: #000;
	color: #fff;
	font-weight: bold;
	letter-spacing: 0.05em;
	padding: 0 0.6em;
	margin-left: 1em;
	line-height: 1.6;
	vertical-align: middle;
	position: relative;
	&[href="#"]{
		display: none;
	}
}
@media screen and (min-width: 768px){
	article section.product .item-outline a.info:hover{
		opacity: 0.6;
	}
}
@media screen and (max-width: 1000px){
	article section.product .item-outline .info .name{
		font-size: 1.8vw;
		padding-bottom: 0.2em;
	}
}
@media screen and (max-width: 768px){
	article section.product .item-outline .info .name{
		font-size: 1.8rem;
	}
}