@charset 'UTF-8';
/*
 *  Remodal - v1.0.6
 *  Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
 *  http://vodkabears.github.io/remodal/
 *
 *  Made by Ilya Makarov
 *  Under MIT License
 */
/* ==========================================================================
   Remodal's necessary styles
   ========================================================================== */
/* Hide scroll bar */
html.remodal-is-locked
{
    overflow: hidden;

    -ms-touch-action: none;
        touch-action: none;
}

/* Anti FOUC */
.remodal,
[data-remodal-id]
{
    display: none;
}

/* Necessary styles of the overlay */
.remodal-overlay
{
    position: fixed;
    z-index: 9999;
    top: -5000px;
    right: -5000px;
    bottom: -5000px;
    left: -5000px;

    display: none;
}

/* Necessary styles of the wrapper */
.remodal-wrapper
{
    position: fixed;
    z-index: 10000;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    display: none;
    overflow: auto;

    text-align: center;

    -webkit-overflow-scrolling: touch;
}

.remodal-wrapper:after
{
    display: inline-block;

    height: 100%;
    margin-left: -.05em;

    content: '';
}

/* Fix iPad, iPhone glitches */
.remodal-overlay,
.remodal-wrapper
{
    -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
         backface-visibility: hidden;
}

/* Necessary styles of the modal dialog */
.remodal
{
    position: relative;

    outline: none;

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

.remodal-is-initialized
{
    /* Disable Anti-FOUC */
    display: inline-block;
}

/*
 *  Remodal - v1.0.6
 *  Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
 *  http://vodkabears.github.io/remodal/
 *
 *  Made by Ilya Makarov
 *  Under MIT License
 */
/* ==========================================================================
   Remodal's default mobile first theme
   ========================================================================== */
/* Default theme styles for the background */
/* Default theme styles of the overlay */
.remodal-overlay
{
    background: #0c60c4;
    background: rgba(8, 16, 34, .85);
}

.remodal-overlay.remodal-is-opening,
.remodal-overlay.remodal-is-closing
{
    -webkit-animation-duration: .3s;
            -moz-animation-duration: .3s;
              -o-animation-duration: .3s;
         animation-duration: .3s;

    -webkit-animation-fill-mode: forwards;
            -moz-animation-fill-mode: forwards;
              -o-animation-fill-mode: forwards;
         animation-fill-mode: forwards;
}

.remodal-overlay.remodal-is-opening
{
    -webkit-animation-name: remodal-overlay-opening-keyframes;
            -moz-animation-name: remodal-overlay-opening-keyframes;
              -o-animation-name: remodal-overlay-opening-keyframes;
         animation-name: remodal-overlay-opening-keyframes;
}

.remodal-overlay.remodal-is-closing
{
    -webkit-animation-name: remodal-overlay-closing-keyframes;
            -moz-animation-name: remodal-overlay-closing-keyframes;
              -o-animation-name: remodal-overlay-closing-keyframes;
         animation-name: remodal-overlay-closing-keyframes;
}

/* Default theme styles of the wrapper */
.remodal-wrapper
{
    padding: 50px 25px;
}

/* Default theme styles of the modal dialog */
.remodal
{
    -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
         box-sizing: border-box;
    margin-bottom: 10px;

    -webkit-transform: translate3d(0, 0, 0);
            -moz-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0);
}

.remodal.remodal-is-opening,
.remodal.remodal-is-closing
{
    -webkit-animation-duration: .3s;
            -moz-animation-duration: .3s;
              -o-animation-duration: .3s;
         animation-duration: .3s;

    -webkit-animation-fill-mode: forwards;
            -moz-animation-fill-mode: forwards;
              -o-animation-fill-mode: forwards;
         animation-fill-mode: forwards;
}

.remodal.remodal-is-opening
{
    -webkit-animation-name: remodal-opening-keyframes;
            -moz-animation-name: remodal-opening-keyframes;
              -o-animation-name: remodal-opening-keyframes;
         animation-name: remodal-opening-keyframes;
}

.remodal.remodal-is-closing
{
    -webkit-animation-name: remodal-closing-keyframes;
            -moz-animation-name: remodal-closing-keyframes;
              -o-animation-name: remodal-closing-keyframes;
         animation-name: remodal-closing-keyframes;
}

/* Vertical align of the modal dialog */
.remodal,
.remodal-wrapper:after
{
    vertical-align: middle;
}

/* Close button */
.remodal-close
{
    position: absolute;
    top: 0;
    left: 0;

    display: block;
    overflow: visible;

    width: 35px;
    height: 35px;
    margin: 0;
    padding: 0;

    cursor: pointer;
    -webkit-transition: color .2s;
            -o-transition: color .2s;
            -moz-transition: color .2s;
            transition: color .2s;
    text-decoration: none;

    color: #95979c;
    border: 0;
    outline: 0;
    background: transparent;
}

.remodal-close:hover,
.remodal-close:focus
{
    color: #2b2e38;
}

.remodal-close:before
{
    font-family: Arial, 'Helvetica CY', 'Nimbus Sans L', sans-serif !important;
    font-size: 25px;
    line-height: 35px;

    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 35px;

    content: '\00d7';
    text-align: center;
}

/* Dialog buttons */
.remodal-confirm,
.remodal-cancel
{
    font: inherit;

    display: inline-block;
    overflow: visible;

    min-width: 110px;
    margin: 0;
    padding: 12px 0;

    cursor: pointer;
    -webkit-transition: background .2s;
            -o-transition: background .2s;
            -moz-transition: background .2s;
            transition: background .2s;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;

    border: 0;
    outline: 0;
}

.remodal-confirm
{
    color: #fff;
    background: #81c784;
}

.remodal-confirm:hover,
.remodal-confirm:focus
{
    background: #66bb6a;
}

.remodal-cancel
{
    color: #fff;
    background: #e57373;
}

.remodal-cancel:hover,
.remodal-cancel:focus
{
    background: #ef5350;
}

/* Remove inner padding and border in Firefox 4+ for the button tag. */
.remodal-confirm::-moz-focus-inner,
.remodal-cancel::-moz-focus-inner,
.remodal-close::-moz-focus-inner
{
    padding: 0;

    border: 0;
}

/* Keyframes
   ========================================================================== */
@-webkit-keyframes remodal-opening-keyframes
{
    from
    {
        -webkit-transform: scale(1.05);
                transform: scale(1.05);

        opacity: 0;
    }
    to
    {
        -webkit-transform: none;
                transform: none;

        opacity: 1;
    }
}

@-moz-keyframes remodal-opening-keyframes
{
    from
    {
        -webkit-transform: scale(1.05);
                -moz-transform: scale(1.05);
             transform: scale(1.05);

        opacity: 0;
    }
    to
    {
        -webkit-transform: none;
                -moz-transform: none;
             transform: none;

        opacity: 1;
    }
}

@-o-keyframes remodal-opening-keyframes
{
    from
    {
        -webkit-transform: scale(1.05);
                -o-transform: scale(1.05);
           transform: scale(1.05);

        opacity: 0;
    }
    to
    {
        -webkit-transform: none;
                -o-transform: none;
           transform: none;

        opacity: 1;
    }
}

@keyframes remodal-opening-keyframes
{
    from
    {
        -webkit-transform: scale(1.05);
                -moz-transform: scale(1.05);
                  -o-transform: scale(1.05);
             transform: scale(1.05);

        opacity: 0;
    }
    to
    {
        -webkit-transform: none;
                -moz-transform: none;
                  -o-transform: none;
             transform: none;

        opacity: 1;
    }
}

@-webkit-keyframes remodal-closing-keyframes
{
    from
    {
        -webkit-transform: scale(1);
                transform: scale(1);

        opacity: 1;
    }
    to
    {
        -webkit-transform: scale(.95);
                transform: scale(.95);

        opacity: 0;
    }
}

@-moz-keyframes remodal-closing-keyframes
{
    from
    {
        -webkit-transform: scale(1);
                -moz-transform: scale(1);
             transform: scale(1);

        opacity: 1;
    }
    to
    {
        -webkit-transform: scale(.95);
                -moz-transform: scale(.95);
             transform: scale(.95);

        opacity: 0;
    }
}

@-o-keyframes remodal-closing-keyframes
{
    from
    {
        -webkit-transform: scale(1);
                -o-transform: scale(1);
           transform: scale(1);

        opacity: 1;
    }
    to
    {
        -webkit-transform: scale(.95);
                -o-transform: scale(.95);
           transform: scale(.95);

        opacity: 0;
    }
}

@keyframes remodal-closing-keyframes
{
    from
    {
        -webkit-transform: scale(1);
                -moz-transform: scale(1);
                  -o-transform: scale(1);
             transform: scale(1);

        opacity: 1;
    }
    to
    {
        -webkit-transform: scale(.95);
                -moz-transform: scale(.95);
                  -o-transform: scale(.95);
             transform: scale(.95);

        opacity: 0;
    }
}

@-webkit-keyframes remodal-overlay-opening-keyframes
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}

@-moz-keyframes remodal-overlay-opening-keyframes
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}

@-o-keyframes remodal-overlay-opening-keyframes
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}

@keyframes remodal-overlay-opening-keyframes
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}

@-webkit-keyframes remodal-overlay-closing-keyframes
{
    from
    {
        opacity: 1;
    }
    to
    {
        opacity: 0;
    }
}

@-moz-keyframes remodal-overlay-closing-keyframes
{
    from
    {
        opacity: 1;
    }
    to
    {
        opacity: 0;
    }
}

@-o-keyframes remodal-overlay-closing-keyframes
{
    from
    {
        opacity: 1;
    }
    to
    {
        opacity: 0;
    }
}

@keyframes remodal-overlay-closing-keyframes
{
    from
    {
        opacity: 1;
    }
    to
    {
        opacity: 0;
    }
}

/* Media queries
   ========================================================================== */
/* IE8
   ========================================================================== */
.lt-ie9 .remodal-overlay
{
    background: #081022;
}

.oldie .remodal-overlay
{
    background-color: #0c60c4;
}

.remodal .wrap .btn_close
{
    position: absolute;
    top: -20px; 
    right: -20px;

    overflow: hidden;

    width: 66px;
    height: 66px;

    cursor: pointer;
}
.remodal .wrap .btn_close:hover img
{
    margin-top: -66px;
}

.remodal.page1 .wrap .btn_close
{
    right: 15px; 

    margin-top: 11px;
}

/* Slider */
.slick-slider
{
    position: relative;

    display: block;

    -moz-box-sizing: border-box;
         -webkit-box-sizing: border-box;
            box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
     -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-slider *:focus
{
    outline: none;
}

.slick-list
{
    position: relative;

    display: block;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table; 

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none; 
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}

.slick-arrow.slick-hidden
{
    display: none;
}

/* Slider */
/* Icons */
@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;
}

/* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 20px;
    height: 20px;
    margin-top: -10px\9;
    padding: 0;

    cursor: pointer;
    /*lte IE 8*/
    -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
            -moz-transform: translate(0, -50%);
              -o-transform: translate(0, -50%);
         transform: translate(0, -50%);

    color: transparent;
    border: none;
    outline: none; 
    background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    outline: none;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: -25px;
}
[dir='rtl'] .slick-prev
{
    right: -25px; 
    left: auto;
}
.slick-prev:before
{
    content: '←';
}
[dir='rtl'] .slick-prev:before
{
    content: '→';
}

.slick-next
{
    right: -25px;
}
[dir='rtl'] .slick-next
{
    right: auto; 
    left: -25px;
}
.slick-next:before
{
    content: '→';
}
[dir='rtl'] .slick-next:before
{
    content: '←';
}

/* Dots */
.slick-slider
{
    margin-bottom: 30px;
}

.slick-list
{
    overflow: visible !important;
}

.slick-slide img
{
    width: 100%;
    height: auto;
}

#header nav
{
    position: absolute;
    z-index: 100;
    top: 0;

    width: 100%;
    min-width: 1000px;
    height: 130px;

    -webkit-filter: drop-shadow(rgba(0, 0, 0, .13) 0px 0px 5px);

            filter: drop-shadow(rgba(0, 0, 0, .13) 0px 0px 5px);
}
#header nav .bg
{
    position: relative;
    top: -50px;

    width: 100%;
    height: 180px;

    background-color: #fff;
    background-image: url(../images/nav_bg.png);
}
#header nav .bg2
{
    display: none;
}
#header nav .kose
{
    border-right: 1px solid #fff;
}
#header nav .share .trigger,
#header nav .lang .trigger
{
    margin-left: -1px; 

    border-left: 1px solid #fff;
}
#header nav .page-nav
{
    position: absolute;
    top: 60px;
    left: 50%;

    width: 976px;
    height: 70px;
    margin-left: -472px;

    background-image: url(../images/nav_line.png);
    background-repeat: no-repeat;
    background-position: left 20px;
}
#header nav .page-nav .btn_about
{
    position: absolute;
    top: 0;
    left: 1px;

    display: block;
    overflow: hidden;

    width: 192px;
    width: 192px;
    height: 70px;
    height: 70px; 

    text-decoration: none;

    background-image: url('../images/nav_1.png');
}
#header nav .page-nav .btn_about span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/nav_1.png');
    background-position: 0 -70px;

    filter: alpha(opacity=0);
}
#header nav .page-nav .btn_about:hover span
{
    opacity: 1;
}
#header nav .page-nav .btn_lineup
{
    position: absolute;
    top: 0;
    left: 194px;

    display: block;
    overflow: hidden;

    width: 192px;
    width: 192px;
    height: 70px;
    height: 70px; 

    text-decoration: none;

    background-image: url('../images/nav_2.png');
}
#header nav .page-nav .btn_lineup span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/nav_2.png');
    background-position: 0 -70px;

    filter: alpha(opacity=0);
}
#header nav .page-nav .btn_lineup:hover span
{
    opacity: 1;
}
#header nav .page-nav .btn_labo
{
    position: absolute;
    top: 0;
    left: 590px;

    display: block;
    overflow: hidden;

    width: 218px;
    width: 218px;
    height: 70px;
    height: 70px; 

    text-decoration: none;

    background-image: url('../images/nav_3.png');
}
#header nav .page-nav .btn_labo span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/nav_3.png');
    background-position: 0 -70px;

    filter: alpha(opacity=0);
}
#header nav .page-nav .btn_labo:hover span
{
    opacity: 1;
}
#header nav .page-nav .btn_ad_gallery
{
    position: absolute;
    top: 0;
    left: 809px;

    display: block;
    overflow: hidden;

    width: 166px;
    width: 166px;
    height: 70px;
    height: 70px; 

    text-decoration: none;

    background-image: url('../images/nav_4.png');
}
#header nav .page-nav .btn_ad_gallery span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/nav_4.png');
    background-position: 0 -70px;

    filter: alpha(opacity=0);
}
#header nav .page-nav .btn_ad_gallery:hover span
{
    opacity: 1;
}
#header nav .logo
{
    position: absolute;
    z-index: 1;
    top: 13px;
    left: 50%;

    width: 102px;
    height: 102px;
    margin-left: -35px;

    background-image: url(../images/logo_base.png);
}
#header nav .logo img
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    margin: auto;
}

#contents
{
    overflow: hidden; 

    padding-top: 130px;

    background-color: #fff;
}
#contents .inner
{
    position: relative;

    overflow: visible;

    width: 100%;
    max-width: none;
    max-width: 1400px;
    margin-right: auto; 
    margin-left: auto;
}
#contents .main-wrap
{
    position: relative;
    z-index: 10;

    visibility: hidden;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 

    opacity: 0;
}
#contents .main-wrap.active
{
    visibility: visible;

    opacity: 1;
}
#contents .main-wrap .mv-area
{
    position: relative;

    overflow: hidden; 

    width: 100%;
    max-width: 1100px;
    height: auto;
    margin-right: auto;
    margin-bottom: 20px;
    margin-left: auto;
}
#contents .main-wrap .mv-area .vis
{
    position: relative;

    width: 100%;
    height: auto;
}
#contents .main-wrap .mv-area span
{
    cursor: pointer;
}
#contents .main-wrap .prd
{
    position: absolute;
    bottom: 20%; 
    left: 0;

    width: 100%;
}
#contents .main-wrap .prd .parts
{
    position: absolute;
    bottom: 10%;
}
#contents .main-wrap .prd .prd1
{
    position: absolute;
    left: 18%;

    display: block;

    width: 34%;
    height: auto;

    cursor: pointer;
}
#contents .main-wrap .prd .prd1 img
{
    width: 100%;
    height: auto;
}
#contents .main-wrap .prd .prd2
{
    position: absolute;
    left: 13.857%;

    display: block;

    width: 24.57%;
    height: auto;
}
#contents .main-wrap .prd .prd2 img
{
    width: 100%;
    height: auto;
}
#contents .main-wrap .prd .prd3
{
    position: absolute;
    left: 38.428%;

    display: block;

    width: 15%;
    height: auto;
}
#contents .main-wrap .prd .prd3 img
{
    width: 100%;
    height: auto;
}
#contents .main-wrap .slider
{
    max-width: 1100px;
    min-height: 514px;
    margin: 0 auto;
}
#contents .main-wrap .slider .list
{
    visibility: hidden;
}
#contents .main-wrap .slider .list.slick-initialized
{
    visibility: visible;
}
#contents .main-wrap .trigger_fragrance_modal
{
    cursor: pointer;
}
#contents .main-wrap .mv-btn
{
    overflow: hidden;

    width: 80px;
    height: 79px;

    cursor: pointer;
    vertical-align: top;
}
#contents .main-wrap .mv-btn img
{
    vertical-align: top;
}
#contents .main-wrap .mv-btn:hover img
{
    margin-top: -80px;
}
#contents .main-wrap .mv-btn.mv-left
{
    position: absolute;
    top: 50%;
    left: -69px;

    margin-top: -40px;
}
#contents .main-wrap .mv-btn.mv-right
{
    position: absolute;
    top: 50%;
    right: -69px;

    margin-top: -40px;
}
#contents .main-wrap .slider
{
    position: relative;
}
#contents .main-wrap .slider .slick-slider
{
    margin-bottom: 40px;
}
#contents .main-wrap .slider .slick-slide
{
    position: relative;
}
#contents .main-wrap .slider .slick-slide .parts
{
    position: absolute;
    right: 0;
    bottom: 12%;

    width: 100%;
    height: auto;

    -webkit-transition: opacity .2s linear .2s, bottom .7s cubic-bezier(0, .68, .43, 1) .2s;

    -o-transition: opacity .2s linear .2s, bottom .7s cubic-bezier(0, .68, .43, 1) .2s;

    -moz-transition: opacity .2s linear .2s, bottom .7s cubic-bezier(0, .68, .43, 1) .2s;

    transition: opacity .2s linear .2s, bottom .7s cubic-bezier(0, .68, .43, 1) .2s;

    opacity: 0;

    filter: alpha(opacity=0);
}
#contents .main-wrap .slider .slick-slide .parts.pt0
{
    bottom: 28.33333%;
    left: 9.27273%;

    width: 38.36364%;

    -webkit-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -o-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -moz-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;
}
#contents .main-wrap .slider .slick-slide .parts.pt1
{
    bottom: 23.73016%;
    left: 9.27273%;

    width: 39.27273%;

    -webkit-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -o-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -moz-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;
}
#contents .main-wrap .slider .slick-slide .parts.pt2
{
    left: 50%;

    width: 42.27273%;

    -webkit-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -o-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -moz-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;
}
#contents .main-wrap .slider .slick-slide .parts.pt3
{
    left: 11.27273%;

    width: 41.09091%;

    -webkit-transition: opacity .2s linear .3s, bottom .65s cubic-bezier(0, .68, .43, 1) .3s;

    -o-transition: opacity .2s linear .3s, bottom .65s cubic-bezier(0, .68, .43, 1) .3s;

    -moz-transition: opacity .2s linear .3s, bottom .65s cubic-bezier(0, .68, .43, 1) .3s;

    transition: opacity .2s linear .3s, bottom .65s cubic-bezier(0, .68, .43, 1) .3s;
}
#contents .main-wrap .slider .slick-slide .parts.pt6
{
    bottom: 17.69841%;
    left: 15.63636%;

    width: 69%;

    -webkit-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -o-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -moz-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;
}
#contents .main-wrap .slider .slick-slide .parts.pt7
{
    bottom: 27.06349%;
    left: 6.36364%;

    width: 38.09091%;

    -webkit-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -o-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -moz-transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    transition: opacity .2s linear .25s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;
}
#contents .main-wrap .slider .slick-slide .parts.pt8
{
    bottom: -2.77778%;
    left: 70.90909%;

    width: 26.18182%;

    -webkit-transition: opacity .2s linear .3s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -o-transition: opacity .2s linear .3s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    -moz-transition: opacity .2s linear .3s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;

    transition: opacity .2s linear .3s, bottom .65s cubic-bezier(0, .68, .43, 1) .25s;
}
#contents .main-wrap .slider .slick-slide .layer
{
    position: absolute;
    top: 0;

    width: 100%;
    height: auto;
}
#contents .main-wrap .slider .slick-slide .johnny-cover
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;
}
#contents .main-wrap .slider .slick-slide.slick-center .item
{
    cursor: pointer;
}
#contents .main-wrap .slider .slick-slide.slick-center .item .cover
{
    opacity: 0;

    filter: alpha(opacity=0);
}
#contents .main-wrap .slider .slick-slide.slick-center .item .parts
{
    opacity: 1;

    filter: alpha(opacity=100);
}
#contents .main-wrap .slider .slick-slide.slick-center .item .parts.pt0
{
    bottom: 13.33333%;
}
#contents .main-wrap .slider .slick-slide.slick-center .item .parts.pt1
{
    bottom: 8.73016%;
}
#contents .main-wrap .slider .slick-slide.slick-center .item .parts.pt2
{
    bottom: 4.7619%;
}
#contents .main-wrap .slider .slick-slide.slick-center .item .parts.pt3
{
    bottom: 2.53968%;
}
#contents .main-wrap .slider .slick-slide.slick-center .item .parts.pt6
{
    bottom: 2.69841%;
}
#contents .main-wrap .slider .slick-slide.slick-center .item .parts.pt7
{
    bottom: 12.06349%;
}
#contents .main-wrap .slider .slick-slide.slick-center .item .parts.pt8
{
    bottom: 2.22222%;
}
#contents .main-wrap .slider .item .cover
{
    position: absolute;
    z-index: 2; 
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear;

    opacity: 1;
    background-image: url(../images/mv_cover.png);

    filter: alpha(opacity=100);
}
#contents .cnt-wrap
{
    position: relative;
    z-index: 10; 
    top: 0;

    min-width: 1000px;
    max-width: 1110px;
    margin: 0 auto;
    padding-top: 131px;
    padding-bottom: 78px;
}
#contents .cnt-wrap .btn_autumn-winter
{
    position: absolute;
    top: 0;
    left: 50%;

    cursor: pointer;
    -webkit-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    transition: opacity .2s linear; 
    -webkit-transform: translateX(-50%); 
       -moz-transform: translateX(-50%); 
        -ms-transform: translateX(-50%); 
         -o-transform: translateX(-50%); 
            transform: translateX(-50%);
}
#contents .cnt-wrap .btn_autumn-winter:hover
{
    opacity: .8;
}
#contents .cnt-wrap .btn_sakura
{
    position: absolute;
    top: 0;
    left: 3.4%;

    cursor: pointer;
    -webkit-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    transition: opacity .2s linear;
}
#contents .cnt-wrap .btn_sakura:hover
{
    opacity: .8;
}
#contents .cnt-wrap .btn_sakura *
{
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
}
#contents .cnt-wrap .btn_fragrance
{
    position: absolute;
    top: -5px;
    left: 3.4%;

    cursor: pointer;
    -webkit-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    transition: opacity .2s linear;
}
#contents .cnt-wrap .btn_fragrance:hover
{
    opacity: .8;
}
#contents .cnt-wrap .btn_fragrance *
{
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
}
#contents .cnt-wrap .btn_kingsize
{
    position: absolute;
    top: 0;
    left: 50%;

    cursor: pointer;
    -webkit-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    transition: opacity .2s linear; 
    -webkit-transform: translateX(-50%); 
       -moz-transform: translateX(-50%); 
        -ms-transform: translateX(-50%); 
         -o-transform: translateX(-50%); 
            transform: translateX(-50%);
}
#contents .cnt-wrap .btn_kingsize:hover
{
    opacity: .8;
}
#contents .cnt-wrap .btn_cm
{
    position: absolute;
    top: 7px;
    right: 19.1%;

    display: block;

    width: 314px;
    height: 74px;
    margin-right: -167px;

    background-image: url(../images/cm_shadow.png);
    background-repeat: no-repeat;

    -webkit-backface-visibility: hidden;

       -moz-backface-visibility: hidden;

            backface-visibility: hidden;
}
#contents .cnt-wrap .btn_cm *
{
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
}
#contents .cnt-wrap .btn_cm .btn
{
    display: block;
    overflow: hidden;

    width: 309px;
    height: 64px;
    margin: 4px 0 0 4px;

    text-decoration: none; 

    background-image: url('../images/cm_btn.png');
}
#contents .cnt-wrap .btn_cm .btn span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/cm_btn.png');
    background-position: 0 -64px;

    filter: alpha(opacity=0);
}
#contents .cnt-wrap .btn_cm .btn:hover span
{
    opacity: 1;
}
#contents .cnt-wrap .btn_cm .ico
{
    position: absolute;
    top: 24px; 
    left: -1px;
}
#contents .cnt-wrap .btn_cm .fk
{
    position: absolute;
    top: -13px; 
    left: -37px;
}
#contents .cnt-wrap .btn_cm a
{
    font-size: 0; 

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

    display: block;

    width: 309px;
    height: 63px;
}
#contents .cnt-wrap .btn_cm:hover .btn span
{
    opacity: 1;
}
#contents .cnt-wrap .btn_aw
{
    position: absolute;
    top: 2px;
    left: 50%;

    margin-left: -166px;

    cursor: pointer;
    -webkit-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    transition: opacity .2s linear;
}
#contents .cnt-wrap .btn_aw:hover
{
    opacity: .7;
}
#contents .cnt-wrap .btn_aw *
{
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
}
#contents .cnt-wrap .btn_dis
{
    position: absolute;
    top: -28px;
    left: 27px;

    display: block;

    width: 281px;
    height: 103px;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear;
}
#contents .cnt-wrap .btn_dis:hover
{
    opacity: .7;
}
#contents .cnt-wrap .btn_dis *
{
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
}
#contents .cnt-wrap .btn_dis .btn
{
    display: block;
    overflow: hidden;

    width: 281px;
    height: 103px;

    text-decoration: none; 

    background-image: url('../images/cm_btn_d.png');
}
#contents .cnt-wrap .btn_dis .btn span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/cm_btn_d.png');
    background-position: 0 -103px;

    filter: alpha(opacity=0);
}
#contents .cnt-wrap .btn_dis .btn:hover span
{
    opacity: 1;
}
#contents .cnt-wrap .btn_dis a
{
    font-size: 0; 

    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;
}
#contents .cnt-wrap .btn_king
{
    position: absolute;
    top: -15px;
    left: 322px;

    display: block;

    width: 270px;
    height: 90px;

    cursor: pointer;
    -webkit-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    transition: opacity .2s linear;
}
#contents .cnt-wrap .btn_king:hover
{
    opacity: .7;
}
#contents .cnt-wrap .btn_king *
{
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
}
#contents .cnt-wrap .btn_king .btn
{
    display: block;
    overflow: hidden;

    width: 270px;
    height: 90px;

    text-decoration: none;

    background-image: url('../images/cm_btn_king.png');
    background-repeat: no-repeat;
}
#contents .cnt-wrap .btn_king .btn span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/cm_btn_king.png');
    background-position: 0 -90px;

    filter: alpha(opacity=0);
}
#contents .cnt-wrap .btn_king .btn:hover span
{
    opacity: 1;
}
#contents .cnt-wrap .btn_king a
{
    font-size: 0; 

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

    display: block;

    width: 100%;
    height: 100%;
}
#contents .cnt-wrap .btn_fre
{
    position: absolute;
    top: -19px;
    left: 598px;

    display: block;

    width: 278px;
    height: 95px;

    cursor: pointer;
    -webkit-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    transition: opacity .2s linear;
}
#contents .cnt-wrap .btn_fre:hover
{
    opacity: .7;
}
#contents .cnt-wrap .btn_fre *
{
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
}
#contents .cnt-wrap .btn_fre .btn
{
    display: block;
    overflow: hidden;

    width: 278px;
    height: 95px;

    text-decoration: none;

    background-image: url('../images/btn_fre.png');
    background-repeat: no-repeat;
}
#contents .cnt-wrap .btn_fre .btn span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/btn_fre.png');
    background-position: 0 -95px;

    filter: alpha(opacity=0);
}
#contents .cnt-wrap .btn_fre .btn:hover span
{
    opacity: 1;
}
#contents .cnt-wrap .btn_fre a
{
    font-size: 0; 

    position: absolute;
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;
}
#contents .cnt-wrap .page-links
{
    height: 196px;
}
#contents .cnt-wrap .page-links a .more
{
    position: absolute;
    top: 138px; 
    left: 31px;
}
#contents .cnt-wrap .page-links .btn_1
{
    position: absolute;
    left: 18.29%;

    margin-left: -173px; 

    cursor: pointer;
}
#contents .cnt-wrap .page-links .btn_1 .more
{
    display: block;
    overflow: hidden;

    width: 89px;
    height: 30px;

    text-decoration: none; 

    background-image: url('../images/more_1.png');
}
#contents .cnt-wrap .page-links .btn_1 .more span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/more_1.png');
    background-position: 0 -30px;

    filter: alpha(opacity=0);
}
#contents .cnt-wrap .page-links .btn_1 .more:hover span
{
    opacity: 1;
}
#contents .cnt-wrap .page-links .btn_1:hover .more span
{
    opacity: 1;
}
#contents .cnt-wrap .page-links .btn_2
{
    position: absolute;
    left: 50%;

    margin-left: -173px; 

    cursor: pointer;
}
#contents .cnt-wrap .page-links .btn_2 .more
{
    display: block;
    overflow: hidden;

    width: 89px;
    height: 30px;

    text-decoration: none; 

    background-image: url('../images/more_2.png');
}
#contents .cnt-wrap .page-links .btn_2 .more span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/more_2.png');
    background-position: 0 -30px;

    filter: alpha(opacity=0);
}
#contents .cnt-wrap .page-links .btn_2 .more:hover span
{
    opacity: 1;
}
#contents .cnt-wrap .page-links .btn_2:hover .more span
{
    opacity: 1;
}
#contents .cnt-wrap .page-links .btn_3
{
    position: absolute;
    left: 81.7%;

    margin-left: -173px; 

    cursor: pointer;
}
#contents .cnt-wrap .page-links .btn_3 .more
{
    display: block;
    overflow: hidden;

    width: 89px;
    height: 30px;

    text-decoration: none; 

    background-image: url('../images/more_3.png');
}
#contents .cnt-wrap .page-links .btn_3 .more span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/more_3.png');
    background-position: 0 -30px;

    filter: alpha(opacity=0);
}
#contents .cnt-wrap .page-links .btn_3 .more:hover span
{
    opacity: 1;
}
#contents .cnt-wrap .page-links .btn_3:hover .more span
{
    opacity: 1;
}
#contents .cnt-wrap .notes
{
    font-size: 9px;
    line-height: 1;

    position: absolute;
    right: 11.5%;

    width: 100%;
    margin-right: -173px;
    padding-top: 6px;

    text-align: right; 

    color: #666;
}
#contents .sns_wrap
{
    width: 1232px;
    margin-left: -66px; 

    text-align: center;
}
#contents .tw_official
{
    display: block;
    display: inline-block;
    overflow: hidden;

    width: 306px;
    height: 96px;
    margin: 14px 1px 16px; 

    text-decoration: none;

    background-image: url('../images/btn_tw.png');
}
#contents .tw_official span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/btn_tw.png');
    background-position: 0 -96px;

    filter: alpha(opacity=0);
}
#contents .tw_official:hover span
{
    opacity: 1;
}
#contents .fb_official
{
    display: block;
    display: inline-block;
    overflow: hidden;

    width: 306px;
    height: 96px;
    margin: 14px 1px 16px; 

    text-decoration: none;

    background-image: url('../images/btn_fb.png');
}
#contents .fb_official span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/btn_fb.png');
    background-position: 0 -96px;

    filter: alpha(opacity=0);
}
#contents .fb_official:hover span
{
    opacity: 1;
}
#contents .yt_official
{
    display: block;
    display: inline-block;
    overflow: hidden;

    width: 306px;
    height: 96px;
    margin: 14px 1px 16px; 

    text-decoration: none;

    background-image: url('../images/btn_yt.png');
}
#contents .yt_official span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/btn_yt.png');
    background-position: 0 -96px;

    filter: alpha(opacity=0);
}
#contents .yt_official:hover span
{
    opacity: 1;
}
#contents .ig_official
{
    display: block;
    display: inline-block;
    overflow: hidden;

    width: 306px;
    height: 96px;
    margin: 14px 1px 16px; 

    text-decoration: none;

    background-image: url('../images/btn_ig.png');
}
#contents .ig_official span
{
    display: block;
    overflow: hidden;

    width: 100%;
    height: 100%;

    -webkit-transition: opacity .2s linear;

    -o-transition: opacity .2s linear;

    -moz-transition: opacity .2s linear;

    transition: opacity .2s linear; 
    white-space: nowrap;
    text-indent: 100%;

    opacity: 0;
    background-image: url('../images/btn_ig.png');
    background-position: 0 -96px;

    filter: alpha(opacity=0);
}
#contents .ig_official:hover span
{
    opacity: 1;
}
#contents .notes_on_use
{
    width: 2000px;
    margin-top: 22px;
    margin-bottom: 9px;
    margin-left: -450px; 
    padding-top: 25px;
    padding-bottom: 25px;

    background-image: url(../images/notes_on_use__ptn.png);
}
#contents .notes_on_use .notes_on_use__btn
{
    display: block;

    width: 336px;
    height: 50px;
    margin: 0 auto;

    background-image: url(../images/notes_on_use__btn.png);
    background-repeat: no-repeat;
}
#contents .notes_on_use .notes_on_use__btn span
{
    display: block;
    overflow: hidden; 

    white-space: nowrap;
    text-indent: 100%;
}
#contents .notes_on_use .notes_on_use__btn:hover
{
    background-position: 0 -60px;
}

.oldie #contents .main-wrap .slider .slick-slide .item .cover
{
    background-color: #19428d; 
    background-image: none;
}