/* 公開側 CSS */


@charset "utf-8";

/* ------------------------------------------------ */
/* 基本・汎用
/* ------------------------------------------------ */

    html {
        padding-top: 100px;
    }

    html, body {
        height:           100%;
        background-color: #000000;
        color:            #FFFFFF;
        font-family:      Meiryo, "MS PGothic", arial, sans-serif;
    }

    .reset-padding {
        padding:        0 !important;
        padding-top:    0 !important;
        padding-right:  0 !important;
        padding-left:   0 !important;
        padding-bottom: 0 !important;
    }

    .sentence {
        display:     inline-block;
        white-space: nowrap;
    }

    .simple-wrap {
    }

  /* CSSアニメーション */
    .mt-fadein-up {
        opacity:   0.0;
        transform: translate(0, 15px);
    }

    .mt-fadein-left {
        opacity:   0.0;
        transform: translate(-30px, 0);
    }

    .mt-fadein-right {
        opacity:   0.0;
        transform: translate(30px, 0);
    }

    .mt-fadein-up,
    .mt-fadein-left,
    .mt-fadein-right {
        /*
        transition-property:        all;
        transition-duration:        0.6s;
        transition-delay:           0.6s;
        transition-timing-function: ease;
        */
        transition:         all 0.6s 0.4s ease;
        -webkit-transition: all 0.6s 0.4s ease;
        -moz-transition:    all 0.6s 0.4s ease;
        -ms-transition:     all 0.6s 0.4s ease;
        -o-transition:      all 0.6s 0.4s ease;
    }

    .delay {
        transition:         all 0.6s 0.8s ease;
        -webkit-transition: all 0.6s 0.8s ease;
        -moz-transition:    all 0.6s 0.8s ease;
        -ms-transition:     all 0.6s 0.8s ease;
        -o-transition:      all 0.6s 0.8s ease;
    }

    .run {
        opacity:   1.0             !important;
        transform: translate(0, 0) !important;
    }

  /* フォーム */
    .form-horizontal .control-label {
        padding-top:      5px;
        padding-bottom:   5px;
        background-color: #333333;
        color:            #FFFFFF;
    }


/* ------------------------------------------------ */
/* ラッパ
/* ------------------------------------------------ */

    div#wrapper {
        position:   relative;
        width:      100%;
        height:     auto;
        min-height: 100%;
        -webkit-font-smoothing: subpixel-antialiased;
    }


/* ------------------------------------------------ */
/* フィルタ
/* ------------------------------------------------ */

    div#filter {
        display:    none;
        position:   fixed;
        top:        0;
        left:       0;
        z-index:    9999;
        width:      100%;
        height:     100%;
        background: rgba(0, 0, 0, 0.2);
    }

    .spinner {
        position:          absolute;
        top:               50%;
        left:              50%;
        width:             1em;
        height:            1em;
        margin:            -0.5em auto;
        border-radius:     50%;
        font-size:         10px;
        text-indent:       -9999em;
        animation:         spinner 1.0s infinite ease;
        -webkit-animation: spinner 1.0s infinite ease;
        transform:         translateZ(0);
        -webkit-transform: translateZ(0);
        -ms-transform:     translateZ(0);
    }

    @-webkit-keyframes spinner {
        0%, 100% { box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7); }
        12.5%    { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5); }
        25%      { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        37.5%    { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        50%      { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        62.5%    { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        75%      { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        87.5%    { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff; }
    }

    @keyframes spinner {
        0%, 100% { box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7); }
        12.5%    { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5); }
        25%      { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        37.5%    { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        50%      { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        62.5%    { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        75%      { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
        87.5%    { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff; }
    }


/* ------------------------------------------------ */
/* ヘッダ
/* ------------------------------------------------ */

    div#header {
    }

  /* ナビゲーションバー */

    .navbar {
        background-color: #000000;
    }

    .navbar-brand {
        height:  60px;
        padding: 10px;
    }

    .navbar-brand img {
        height: 100%;
    }

    .navbar .logo {
        width:      168px;
        height:     80px;
        margin:     10px auto;
        padding:    0px;
        text-align: center;
    }

    .navbar .logo img {
        height: 100%;
    }

    .navbar-toggle {
        padding:          9px 5px;
        border:           none;
        background-color: #000000;
    }

    /* language */
    .language_wrap{
        background-color: #728089;
        padding:0 5px 0 0;
    }
    .language_inner{
        text-align:right;
        max-width:1140px;
        margin:0 auto;
    }
    .language_inner a{
        display: inline-block;
        color:#fff;
        background-color: #4B545A;
        padding:1px 15px 0 15px;
    }
    .language_link{
        margin-right:3px;
    }


/* ------------------------------------------------ */
/* フッタ
/* ------------------------------------------------ */

    div#footer {
        padding-left:   0;
        padding-right:  0;
        padding-bottom: 20px;
    }

    div#footer-bar {
        margin:  10px 0;
        padding: 8px 0;
    }

    .footer-link {
        margin:     15px 0;
        text-align: right;
    }

    .footer-link a {
        padding:     5px 15px;
        border-left: solid 1px #FFFFFF;
        color:       #FFFFFF;
    }

    .footer-link a:last-child {
        border-right: solid 1px #FFFFFF;
    }

    .banner {
        margin:    10px 0;
        text-align: center;
    }


/* ------------------------------------------------ */
/* コンテンツ
/* ------------------------------------------------ */

    div#contents {
        margin: auto;
    }

  /* メインビジュアル */
    .main-visual {
        display:        table;
        table-layout:   fixed;
        width:          100%;
        height:         50vw;
        min-height:     212px;
        max-height:     520px;

        background-position:     50% 0; /* 横・縦 */
        background-size:         cover;
        -webkit-background-size: cover;
        -moz-background-size:    cover;
        -ms-background-size:     cover;
        -o-background-size:      cover;
        background-repeat:       no-repeat;
        /*background-attachment:   fixed;*/
        background-origin:       initial;
        background-clip:         initial;
    }

  /* メインビジュアル上に表示するコピー */
    .copy {
        display:     table-cell;
        vertical-align: middle;
        width:       100%;
        height:      100%;
        font-size:   6vw;
        font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, serif;
        text-align:  center;
        line-height: 1.6;
    }

  /* パラグラフ */
    .paragraph {
        margin-top:     15px;
        margin-bottom:  15px;
        padding-top:    10px;
        padding-bottom: 10px;
        font-size:      28px;
        text-align:     center;
        line-height:    1.6;
    }

  /* 概要 */
    .overview {
        margin-top:     15px;
        margin-bottom:  15px;
        padding-top:    10px;
        padding-bottom: 10px;
        font-size:      14px;
        text-align:     center;
        line-height:    1.6;
    }

  /* 背景エフェクト */
    .bg-grad {
        padding-top:         1px;
        background-image:    url('../../inc/img/bg_grad.png');
        background-position: bottom;
        background-repeat:   repeat-x;
    }

    .bg-gray {
        margin-bottom:   -60px !important;
        padding-bottom:   60px;
        background-color: #1A1A1A;
    }

  /* 商品画像 */
    .product {
        width: 100%;
    }

    .product-subject {
        height:  60px;
        padding: 4px;
    }

    a[data-lity="data-lity"] {
        display:          inline-block;
        background-color: #FFFFFF;
    }

    a[data-lity="data-lity"]:hover img.product {
        opacity: 0.8;
        filter:  alpha(opacity=80);
    }

    .lity-content img {
        width:     100%  !important;
        max-width: 800px !important;
    }

  /* ムービー */
    .poster {
        width: 100%;
    }

    video {
        width: 100%;
    }
    /*
    video::-webkit-media-controls-enclosure {
        overflow: hidden;
    }

    video::-webkit-media-controls-panel {
        width: calc(100% + 30px);
    }
    */

  /* お問合せ */
    .contact {
        padding:          20px 0px;
        background-color: #CCCCCC;
        color:            #333333;
    }

  /* textile */
    .container .textile_row{
        margin-bottom: 10px;
    }
    .container .textile_row .col-sm-6{
        border-left: 1px solid #000; 
        border-right: 1px solid #000; 
    }

/* ------------------------------------------------ */
/* レスポンシブ対応
/* ------------------------------------------------ */

    /* 横幅 1040px以上 */
    @media (min-width: 1040px) {
        .copy {
            font-size: 62.52px;
        }
    }

    /* 横幅 767px以上 */
    @media (min-width: 768px) {
        .nav>li {
            font-size: 90%
        }
        .nav>li {
            display: inline-block;
        }

        .nav>li>a:focus,
        .nav>li>a:hover {
            text-decoration:  none;
            background-color: #333333;
        }

        .navbar-nav>li {
            float: none;
        }

        .header-link {
            margin-top: -100px;
            text-align: center;
        }

        .header-link ul {
            width:  100%;
            margin: auto;
        }

        .header-link li {
            width:         100%;
            max-width:     158px;
            margin-top:    20px;
            margin-bottom: 20px;
        }

        .header-link a {
            display:      inline-block;
            margin-left:  -1px;
            padding:      18px 2px !important;
            border-left:  solid 1px #FFFFFF;
            border-right: solid 1px #FFFFFF;
            color:        #FFFFFF;
            text-align:   center;
        }

        .header-link li.avoid-left {
            margin-right: 90px;
        }

        .header-link li.avoid-right {
            margin-left: 90px;
        }


.dl-horizontal dt{
    width:210px;
}
.dl-horizontal dd{
    margin-left: 260px;
}


    }

    /* 横幅 1199px以下 */
    @media (max-width: 1199px) {
        .header-link li {
            width: auto;
            min-width: 126px;
        }
    }

    /* 横幅 1039px以下 */
    @media (max-width: 1039px) {
        .header-link li {
            width: auto;
            min-width: 90px;
        }
    }

    /* 横幅 767px以下 */
    @media (max-width: 767px) {
        html {
            padding-top: 51px;
        }

        .navbar {
            border-bottom:    none;
        }

        .navbar-header {
            border-bottom:    solid 1px #666666;
        }

        .navbar-brand {
            height:  48px;
            padding: 4px 6px;
        }

        .navbar-nav {
            margin: 0 -15px;
        }

        .nav>li>a:focus,
        .nav>li>a:hover {
            text-decoration:  none;
            background-color: #332211;
        }

        .header-link a {
            padding:          6px 10px !important;
            border-bottom:    1px #666666 solid;
            background-color: #000000;
            color:            #FFFFFF;
            text-align:       center;
        }

        .footer-link {
            text-align: center;
        }

        .icon-bar {
            background-color: #FFFFFF;
        }

        .paragraph {
            margin-top:    10px;
            margin-bottom: 10px;
            font-size:     24px;
        }

        .overview {
            margin-top:    10px;
            margin-bottom: 10px;
            font-size:     13px;
        }

        .contents_top .container .col-sm-6{
            margin-top:    10px;
        }

        .form-horizontal .control-label {
            min-width: 100%;
        }
    }

    /* 横幅 425px以下 */
    @media (max-width: 425px) {
        .copy {
            font-size: 25.5px;
        }

        .paragraph {
            margin-top:    8px;
            margin-bottom: 8px;
            font-size:     20px;
        }
    }

    /* 横幅 320px以下 */
    @media (max-width: 320px) {
        .paragraph {
            margin-top:    6px;
            margin-bottom: 6px;
            font-size:     18px;
        }
    }


/* ------------------------------------------------ */
/* グリッド5等分対応
/* ------------------------------------------------ */

    .col-xs-1-5, .col-sm-1-5, .col-md-1-5, .col-lg-1-5,
    .col-xs-2-5, .col-sm-2-5, .col-md-2-5, .col-lg-2-5,
    .col-xs-3-5, .col-sm-3-5, .col-md-3-5, .col-lg-3-5,
    .col-xs-4-5, .col-sm-4-5, .col-md-4-5, .col-lg-4-5 {
        position:      relative;
        min-height:    1px;
        padding-right: 15px;
        padding-left:  15px;
    }
    .col-xs-1-5 {
        width: 20%;
        float: left;
    }
    .col-xs-2-5 {
        width: 40%;
        float: left;
    }

    .col-xs-3-5 {
        width: 60%;
        float: left;
    }

    .col-xs-4-5 {
        width: 80%;
        float: left;
    }

    @media (min-width: 768px) {
        .col-sm-1-5 {
            width: 20%;
            float: left;
        }
        .col-sm-2-5 {
            width: 40%;
            float: left;
        }
        .col-sm-3-5 {
            width: 60%;
            float: left;
        }
        .col-sm-4-5 {
            width: 80%;
            float: left;
        }
    }

    @media (min-width: 992px) {
        .col-md-1-5 {
            width: 20%;
            float: left;
        }
        .col-md-2-5 {
            width: 40%;
            float: left;
        }
        .col-md-3-5 {
            width: 60%;
            float: left;
        }
        .col-md-4-5 {
            width: 80%;
            float: left;
        }
    }

    @media (min-width: 1200px) {
        .col-lg-1-5 {
            width: 20%;
            float: left;
        }
        .col-lg-2-5 {
            width: 40%;
            float: left;
        }
        .col-lg-3-5 {
            width: 60%;
            float: left;
        }
        .col-lg-4-5 {
            width: 80%;
            float: left;
        }
    }