html {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-text-size-adjust: 100%;
    font-size: 62.5%
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, select, p, blockquote, th, td {
    margin: 0;
    padding: 0
}

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

fieldset, img {
    border: 0
}

address, button, caption, cite, code, dfn, em, input, optgroup, option, select, strong, textarea, th, var {
    font: inherit
}

del, ins {
    text-decoration: none
}

li {
    list-style: none
}

caption, th {
    text-align: left
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal
}

q:before, q:after {
    content: ''
}

abbr, acronym {
    border: 0;
    font-variant: normal
}

sup {
    vertical-align: baseline
}

sub {
    vertical-align: baseline
}

legend {
    color: #000
}

.cf:before, .cf:after {
    content: "";
    display: table
}

.cf:after {
    clear: both
}

.cf {
    zoom: 1
}

body, html {
    width: 100%;
    height: 100%;
    font-family:'Arial', 'scnr_grotesklight', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "liga" 0
}

body {
    font-size: 1.4rem;
    background: #f3f3f3;
    position: relative
}

a {
    text-decoration: none
}

body, a {
    color: #080a15;
}

* {
    outline: none
}

img {
    vertical-align: bottom
}

a {
    text-decoration: none
}

.table {
    display: table;
    height: 100%;
    width: 100%
}

.cell {
     display: table-cell;
     vertical-align: middle
 }

.cell2 {
    display: table-cell;
    vertical-align: bottom;
}

.in {
    position: relative;
    height: 100%;
    width: 100%
}

@font-face {
    font-family: 'scnr_grotesklight';
    src: url('../fonts/scnrgrotesk-light.woff2') format('woff2'), url('../fonts/scnrgrotesk-light.woff') format('woff');
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: 'i';
    src: url('../fonts/i.eot');
    src: url('../fonts/i.eot') format('embedded-opentype'), url('../fonts/i.ttf') format('truetype'), url('../fonts/i.woff') format('woff'), url('../fonts/i.svg') format('svg');
    font-weight: normal;
    font-style: normal
}

[class^="i-"], [class*=" i-"] {
    font-family: 'i' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.i-right:before {
    content: "\e903"
}

.i-left:before {
    content: "\e904"
}

.i-up:before {
    content: "\e905"
}

.i-down:before {
    content: "\e906"
}

.i-tw:before {
    content: "\74"
}

.i-brand:before {
    content: "\74"
}

.i-tweet:before {
    content: "\74"
}

.i-social:before {
    content: "\74"
}

.i-inst:before {
    content: "\69"
}

.i-brand2:before {
    content: "\69"
}

.i-social2:before {
    content: "\69"
}

.i-fb:before {
    content: "\66"
}

.i-brand3:before {
    content: "\66"
}

.i-social3:before {
    content: "\66"
}

.spacer {
    display: block;
    width: 100%;
    clear: both
}

p {
    line-height: 1.85em;
    /*opacity: 0.8*/
}

input, button, textarea, select {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    border-radius: 0;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

section, label {
    display: block
}

b, strong {
    font-weight: bold
}

.is_scrolled .toggle .in div, .support-header-body li a.active, .toggle-link, .buttons .hr {
    background: #6a6b75
}

.slider-controls .i {
    color: #6a6b75
}

.buttons {
    display: block;
    width: 120px;
    line-height: 60px;
    height: 60px;
    overflow: hidden
}

.buttons span {
    display: block
}

.buttons .hr {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 100%
}

.buttons .txt {
    font-weight: 400;
    /*font-family: 'Roboto';*/
    font-family: Arial;
    /*opacity: 0.5;*/
    letter-spacing: 0.05em
}

.body {
    width: 100%;
    margin: 0 auto;
    padding: 0 120px;
    box-sizing: border-box
}

.body, .body.thin, .section-products .body {
    max-width: 80%
}

.body-inside {
    margin: 0 auto;
    padding: 0 120px;
    width: 100%;
    box-sizing: border-box
}

<!--.add-bg-white {
    background: #fff
}

.add-bg-gray {
    background: #f3f3f3
}

.add-bg-midblue {
    background: #080a15;
    color: #fff
}

.side {
    position: absolute;
    left: 0;
    top: 150px;
    width: 400px;
    line-height: 60px;
    height: 60px;
    font-size: 0.85vw;

    text-align: center;
    margin-left: -200px;
    transform: rotate(-90deg)
}

.side.side-right {
    left: auto;
    right: 0;
    margin-left: 0px;
    margin-right: -200px;
    transform: rotate(90deg)
}

.section-products .side-left {
    top: 420px
}

.section-products .side-right {
    top: 420px
}

.contents {
    overflow: hidden;
    width: 100%;
    transition: all 0.8s
}

.scroll {
    background: #fff
}

.first-view .slider-controls {
    position: absolute;
    right: 0
}

.slider-controls, .controls-num {
    display: inline-block;
    vertical-align: top
}

.slider-controls {
    font-size: 0;
    height: 60px
}

.slider-controls .js-slider-to {
    display: inline-block;
    vertical-align: top;
    text-align: center;
    line-height: 60px;
    height: 60px;
    width: 60px;
    font-size: 20px;
    background: #fff;
    cursor: pointer
}

.slider-controls .i {
    opacity: 1;
    position: relative;
    z-index: 2
}

.js-slider-to {
    cursor: pointer
}

.main-title {
    font-size: 3.8vw;
    line-height: 1.3em;
    font-weight: bold;
    font-family: Arial;
}

.subpages .main-title {
    font-size: 5vw
}

.js-slider-to > .in {
    display: block;
    overflow: hidden
}

.js-slider-to .bg {
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 1;
    background: #f3f3f3;
    top: 0;
    left: 0
}

.js-slider-hover-left .bg, .js-slider-hover-right .bg {
    transform: translate(-100%, 0)
}

.js-hover {
    overflow: hidden
}

.js-hover > .in {
    display: block
}

.js-hover .bg {
    display: block;
    height: 101%;
    width: 101%;
    position: absolute;
    z-index: 1;
    background: #272727;
    top: 0;
    left: 0
}

.menu .js-hover .bg {
    height: 101%;
    background: #b9b9b9
}

.toggle-link .txt {
    position: relative;
    z-index: 2
}

/*.logo {
    display: block;
    width: 138px;
    height: 32px;
    text-indent: -9999px;
    background: url(../images/bllogo.png) center no-repeat;
    background-size: cover;
    background-position: center top;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -15px
}

.header {
    width: 100%;
    height: 110px;
    position: absolute;
    left: 0;
    top: 0;
    padding: 0 60px;
    box-sizing: border-box;
    z-index: 3
}

.header .logo {
    z-index: 2
}

.nav {
    text-align: right;
    font-size: 0
}

.nav li {
    display: inline-block;
    vertical-align: top
}

.nav li a {
    padding: 0 20px;
    font-size: 1.45rem;
    line-height: 110px;
    height: 110px;
    display: block;
    color: #fff
}

.nav-ol {
    padding-right: 80px
}*/

.toggle .in div {
    background: #fff;
    position: absolute
}

.toggle {
    cursor: pointer;
    height: 60px;
    width: 60px;
    position: fixed;
    top: 25px;
    right: 50px;
    box-sizing: border-box;
    z-index: 99
}

.toggle-in {
    padding: 24px 23px 24px 22px;
    
    position: relative
}

.toggle-in > div {
    height: 2px;
    width: 100%
}

.t2 {
    margin: 3px 0
}

.toggle-in > div.t4 {
    top: 50%;
    left: 50%;
    position: absolute;
    height: 16px;
    width: 16px;
    margin: -8px 0 0 -8px
}

.t4 > .in > div {
    opacity: 0;
    transition: all 0.6s;
    background: #fff;
    position: absolute
}

.t4 > .in > div.t4-1 {
    transition-delay: 0.0s;
    transform: translate(0px, -5px);
    top: 0;
    left: 50%;
    height: 5px;
    width: 2px;
    margin-left: -1px
}

.t4 > .in > div.t4-2 {
    transition-delay: 0.02s;
    transform: translate(-5px, 0px);
    top: 50%;
    left: 0;
    width: 5px;
    height: 2px;
    margin-top: -1px
}

.t4 > .in > div.t4-3 {
    transition-delay: 0.04s;
    transform: translate(5px, 0px);
    top: 50%;
    right: 0;
    width: 5px;
    height: 2px;
    margin-top: -1px
}

.t4 > .in > div.t4-4 {
    transition-delay: 0.06s;
    transform: translate(0px, 5px);
    bottom: 0;
    left: 50%;
    height: 5px;
    width: 2px;
    margin-left: -1px
}

.t4 {
    transition: all 0.6s;
    opacity: 0;
    transform: rotate(45deg)
}

.t1 > .in > div, .t2 > .in > div, .t3 > .in > div {
    opacity: 1;
    transition: all 0.6s
}

.is_menu_opened .t4 {
    opacity: 1
}

.t3 > .in > div.t1-1 {
    transition-delay: 0.0s
}

.t3 > .in > div.t1-2 {
    transition-delay: 0.02s
}

.t3 > .in > div.t2-1 {
    transition-delay: 0.04s
}

.t3 > .in > div.t2-2 {
    transition-delay: 0.06s
}

.t3 > .in > div.t3-1 {
    transition-delay: 0.08s
}

.t3 > .in > div.t3-2 {
    transition-delay: 0.1s
}

.is_menu_opened .t1 > .in > div, .is_menu_opened .t2 > .in > div, .is_menu_opened .t3 > .in > div {
    opacity: 0;
    transform: translate(0px, 5px)
}

.is_menu_opened .t4 > .in > div.t4-1, .is_menu_opened .t4 > .in > div.t4-2, .is_menu_opened .t4 > .in > div.t4-3, .is_menu_opened .t4 > .in > div.t4-4 {
    transform: translate(0px, 0px);
    opacity: 1
}

.t1-2, .t2-2, .t3-2 {
    height: 2px;
    background: #fff;
    width: 10px;
    position: absolute;
    right: 0;
    top: 0
}

.t1-1, .t2-1, .t3-1 {
    height: 2px;
    background: #fff;
    width: 2px;
    position: absolute;
    left: 0;
    top: 0
}

.is_menu_opened .toggle {
    position: fixed
}

.is_scrolled .toggle {
    right: 50px;
    position: fixed
}

.is_scrolled .toggle-in {
    background: #f3f3f3
}

.is_menu_opened.is_scrolled .toggle-in {
    background: none
}

.is_menu_opened.is_scrolled .toggle .in div {
    background: #fff
}

.logo-footer {
    display: block;
    padding-right: 60px
}

.logo-footer span {
    height: 39px;
    width: 140px;
    display: block;
    background: url(../images/logo_black.png) no-repeat center;
    background-size: cover;
    text-indent: -9999px
}

.sitemap {
    width: 180px;
    font-size: 0
}

.sitemap li {
    display: inline-block;
    vertical-align: top
}

.sitemap li a {
    display: block;
    line-height: 30px;
    height: 30px;
    width: 90px;
    font-size: 14px
}

.sitemap-ol {
    float: left;
    width: 360px;
    margin-top: 67px;
}

.footer {
    position: relative;
    width: 100%;
    height: 100%;
    background: #fff;
    padding: 60px;
    box-sizing: border-box;
    overflow: hidden;
    z-index: 2;
}

.links {
    float: right;
    width: 420px
}

.links .toggle-link {
    width: 120px
}

.sns {
    font-size: 0
}

.sns li {
    display: inline-block;
    vertical-align: top
}

.sns li a {
    display: block;
    width: 40px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 1.4rem
}

address {
    font-size: 14px;
    width: 270px;
    text-align: right;
    display: block;
	color:#8a8b90;
}

address a{
		color:#8a8b90;
}

.toggle-link {
    width: 180px;
    text-align: center;
    /*height: 60px;*/
    line-height: 60px;
    color: #fff;
    display: block;
    font-size: 1.5rem;
    font-family: 'Roboto';
    clear: both
}

.js-change-lang {
    display: none
}

.desktop .footer .sitemap li a, .desktop .footer .sns li a {
    /*opacity: 0.6;*/
    /*transition: opacity 0.6s*/
	color:#8a8b90;
}

.desktop .footer .sitemap li a:hover, .desktop .footer .sns li a:hover {
    opacity: 1
}

.first-view {
    height: 100vh
}

.main-title {
    position: absolute;
    top: 35%;
    left: 20%;
    color: #fff;
    margin-top: -1.5em;
    z-index: 3
}

.canvas-slider {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1
}

.first-view .controls-ol {
    position: absolute;
    z-index: 4;
    bottom: 0
}

.controls-ol {
    width: 100%
}

.controls-in {
    height: 60px;
    line-height: 60px
}

.controls-num-in {
    display: inline-block;
    vertical-align: top;
    line-height: 60px;
    width: 30px;
    text-align: center;
    cursor: pointer;
    font-size: 1.3rem;
    position: relative;
    opacity: 0.4;
    font-weight: 400;
    color: #080a15;
    font-family: 'Roboto';
    overflow: hidden;
    transition: all 0.6s
}

.controls-num-in .n {
    display: block;
    text-align: center
}

.controls-num-in.active {
    opacity: 1
}

.controls-num-in .hr {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #080a15;
    left: 0;
    opacity: 0;
    transform: scale(0, 1);
    transition: all 0.6s;
    transform-origin: center left
}

.controls-num-in.active .hr {
    opacity: 1;
    transform: scale(1)
}

.first-view .controls-num {
    position: absolute;
    right: 20px;
    top: 0
}

.scroll-to-down {
    /*opacity: 0.6;*/
    font-size: 1.2rem;
    padding: 0 30px;
    box-sizing: border-box;
    cursor: pointer
}

.sub-title {
    font-size: 2.8vw;
    line-height: 60px
}

.two-col-layout {
    height: 100%;
    width: 100%
}

.cols {
    height: 100%;
    width: 50%;
    float: left
}

.cols-text {
    height: 100%;
  /*  width: 50%;*/
    margin: 0 auto;
    padding: 0 80px;
    min-width: 280px
}

.slider-concept .js-background-img {
    background-size: cover;
    background-position: top center;
    height: 100%
}

.slider-concept {
    position: absolute;
    right: 0;
    bottom: 0px;
    width: 50vw
}

.slider-concept .js-slider-wrap {
    position: absolute;
    right: 0;
    top: 0;
    width: 50%
}

.slider-concept, .slider-concept .js-slider-wrap {
    max-height: 600px
}

.slider-concept .js-slider-wrap.slider-concept-left {
    right: 50%;
    top: 60px
}

.js-slider-img {
    height: 100%;
    background-size: cover;
    background-position: center;
    float: left
}

.js-slider-move {
    height: 100%;
    width: 100%
}

.js-slider-wrap > .in {
    overflow: hidden
}

.slider-concept .slider-controls {
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    margin: 0 0 0 -60px
}

.slider-concept .controls-num {
    position: absolute;
    bottom: -120px;
    left: 50%;
    padding: 0 20px
}

.js-slider-wrap {
    background: #6a6b75
}

.js-slider-img {
    opacity: 0;
    transition: opacity 0.6s
}

.js-slider-img.is_bg_loaded {
    opacity: 1
}

.teams-ol {
    padding: 30px;
    background: #fff
}

.section-products .sub-header, .section-products .sub-footer {
    padding: 0 80px
}

.support-header-hr {
    height: 2px;
    width: 48px;
    background: #4d4f63;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -1px
}

.support-header-body {
    font-size: 0;
    box-sizing: border-box;
    padding-left: 80px
}

.support-header-body li {
    display: inline-block;
    vertical-align: top
}

.support-header-body li a {
    line-height: 22px;
    display: block;
    text-decoration: underline;
    font-family: 'Arial';
    font-size: 1.4rem;
    padding: 0 15px;
    opacity: 0.6
}

.support-header-body li a.active {
    opacity: 1;
    color: rgba(255, 255, 255, 0.8);
    margin-left: 15px
}

.products-ol {
    margin: 0 -8px
}

.products {
    float: left;
    width: 33.333%;
    box-sizing: border-box;
    padding: 8px;
    padding-top: 2px;
}

.myp{
    line-height: 34px;background: #ffffff;text-align: center;color: #010101;margin-top: 10px;font-size: 1.45rem;font-family: Arial;
}

.products-thumb {
    display: block;
    height: 420px;
    position: relative
}

.products-thumb span {
    display: block;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center
}

.products-cats {
    height: 3.2em
}

.products-cats li {
    padding-right: 12px;
    padding-bottom: 8px;
    display: inline-block;
    vertical-align: baseline
}

.products-cats li a {
    font-size: 1.2rem;
    text-decoration: underline
}

.products-cats li a.category-link {
    color: #b4362a
}

.products-cats li p {
    font-size: 1.2rem;
    line-height: 1.4em;
    margin-bottom: 0
}

.products .products-cats li {
    display: block
}

.products-body {
    padding: 30px;
    background: #fff
}

.products-title a {
    font-weight: bold;
    height: 4em;
    font-size: 1.2vw;
    line-height: 1.4em;
    overflow: hidden;
    margin: 1em 0;
    display: block
}

.products-price {
    display: block;
    opacity: 0.6
}

.products-price span {
    display: inline-block;
    vertical-align: bottom
}

.yen {
    font-size: 2rem;
    font-weight: 400;
    font-family: 'Roboto'
}

.tax {
    font-size: 1.4rem;
    font-family: 'Roboto'
}

.buttons-right {
    float: right
}

.section-products .buttons-right {
    padding-right: 20px
}

.desktop .products-thumb:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #f3f3f3;
    opacity: 0;
    transition: all .4s ease-in-out;
    background: rgba(255, 255, 255, 0.25);
    background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 1) 100%);
    background: -webkit-gradient(right bottom, left top, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(40%, rgba(255, 255, 255, 0.1)), color-stop(60%, rgba(255, 255, 255, 0)), color-stop(100%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 1) 100%);
    background: -o-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 1) 100%);
    background: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 1) 100%);
    background: linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 1) 100%)
}

.desktop .products:hover {
    z-index: 3
}

.desktop .products:hover .products-thumb:before {
    opacity: 1;
    box-shadow: -5px -5px 60px 0 rgba(20, 20, 20, 0.05)
}

.products-thumb:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform-origin: 0% 100%;
    background: #f3f3f3;
    transform: scaleY(0);
    transition: all .4s ease-in-out
}

.products-thumb.go-detail:after {
    transform: scaleY(1)
}

.slider-middle .js-slider-wrap, .slider-middle.js-canvas-slider-ol {
    height: 70vh
}

.slider-middle-ol {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative
}

.slider-middle-in {
    padding: 0 60px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.slider-middle-ol .slider-controls {
    position: absolute;
    z-index: 3;
    bottom: 0;
    left: 0
}

.slider-middle-ol .controls-num {
    position: absolute;
    z-index: 3;
    left: 120px;
    bottom: -60px
}

.slider-middle-bg {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff
}

.sub-header-left {
    /*width: 37.5%;*/
    width: 90%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.sub-header-cols .cell {
    vertical-align: top
}

.bnr {
    float: left;
    padding-right:2%;
    width: 32%;
    display: block
}



.bnr span {
    display: block
}

.bnr .js-background-img {
    width: 100%;
    height: 420px;
    background-size: cover;
    background-position: center
}

.panels-inside .t, .bnr .t {
    position: absolute;
    bottom: 0;
    padding: 0 20px;
    line-height: 60px;
    z-index: 4;
    font-size: 1.8rem;
    font-weight: 400;
    letter-spacing: 0.05em;
    color: #fff;
    font-family: 'Roboto';
    pointer-events: none
}

.connected-header-bg {
    height: 480px;
    width: 100%;
    background-position: center;
    background-size: cover;
    position: absolute;
    top: -50%
}

.connected {
    width: 25%;
    display: block;
    height: 240px;
    float: left
}

.connected .in {
    display: block
}

.connected-title {
    z-index: 3;
    position: relative;
    text-align: center
}

.connected .js-background-img {
    display: block;
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%
}

.support-header-title {
    line-height: 60px;
    color: #fff;
    font-size: 24px;
    font-family: 'Roboto';
    font-weight: 400
}

.section-connected .support-header {
    position: absolute;
    top: -90px;
    left: 0
}

.connected-ol {
    margin-top: 25%
}

.section-connected .support-header-hr {
    background: #fff
}

.connected-title .cell span {
    color: #fff;
    display: block;
    text-align: center
}

.connected-title .account {
    font-size: 1.3rem;
    margin-top: 1em
}

.connected-title .i {
    font-size: 2rem
}

.re .connected-title .cell span {
    color: #434343
}

.bnr-hover {
    position: relative
}

.desktop .bnr-hover:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
    transition: all .4s ease-in-out;
    background: rgba(255, 255, 255, 0.25);
    background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.2) 100%);
    background: -webkit-gradient(right bottom, left top, color-stop(0%, rgba(255, 255, 255, 0.4)), color-stop(40%, rgba(255, 255, 255, 0.1)), color-stop(60%, rgba(255, 255, 255, 0)), color-stop(100%, rgba(255, 255, 255, 0.2)));
    background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.2) 100%);
    background: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.2) 100%);
    background: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.2) 100%);
    background: linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.2) 100%)
}

.desktop .bnr-hover:hover {
    z-index: 3
}

.desktop .bnr-hover:hover:before {
    opacity: 1;
    box-shadow: 0 -1px 30px 0 rgba(20, 20, 20, 0.05)
}

.sub-sub-pages .first-view {
    height: 60vh
}

.sub-sub-pages .main-title-ol {
    height: 100%
}

.sub-sub-pages.subpages .main-title {
    width: 100%;
    font-size: 5vw;
    margin-bottom: 0.5em
}

.main-sub-title span {
    display: block;
    color: #fff;
    opacity: 0.6;
    padding-bottom: 1em
}

.main-title-spacer {
    display: block;
    width: 100%;
    height: 24vh
}

.subpages .first-view .slider-controls {
    display: none
}

.sub-sub-title span {
    display: block;
    font-size: 2.8rem;
    opacity: 0.9
}

.subpages .main-title {
    left: 0;
    width: 100%;
    position: relative;
    top: 0;
    margin: 0
}

.main-title-ol {
    position: absolute;
    z-index: 3;
    width: 100%;
    bottom: 0
}

.em {
    font-style: italic
}

.js-canvas-fv {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.main-title-ol .hr {
    display: block;
    height: 3px;
    width: 45px;
    background: #fff
}

.slider-large .js-slider-wrap, .slider-large.js-canvas-slider-ol {
    height: 100%
}

.slider-middle, .slider-large-ol > .body {
    z-index: 2;
    position: relative
}

.slider-large-ol {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative
}

.slider-large-ol .slider-controls {
    position: absolute;
    z-index: 3;
    bottom: 0;
    left: -60px
}

.slider-large-ol .controls-num {
    position: absolute;
    z-index: 3;
    left: 120px;
    bottom: -60px
}

.slider-large-bg {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff
}

.cols-left .cols-in {
    padding: 0 60px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.floating-img {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -300px;
    width: 50%;
    height: 600px
}

.floating-img .in {
    padding: 0 0 0 60px;
    box-sizing: border-box
}

.floating-img.floating-img-left .in {
    padding: 0 60px 0 0
}

.floating-img.floating-img-single .in {
    padding: 0 60px
}

.floating-img .background-img {
    height: 100%;
    width: 100%;
    background-size: cover
}

.teams {
    float: left;
    width: 33.333%;
    height: 240px
}

.teams .background-img {
    display: block;
    height: 100%;
    width: 100%;
    background-color: #fff;
    background-size: contain;
    background-repeat: no-repeat
}

.section-team {
    padding: 0 60px
}

.section-team-body {
    background-color: #cac6c1;
    background-size: 1280px;
    background-repeat: no-repeat;
    background-position: bottom center
}

.panels-inside span, .panels-inside {
    display: block
}

.panels-inside {
    height: 300px;
    width: 100%
}

.panels-ol {
    padding: 60px 40px 0 40px;
    margin: 0 auto;
    max-width: 1040px
}

.panels-inside .background-img {
    height: 100%;
    width: 100%;
    background-position: center bottom;
    background-size: cover;
    background-repeat: no-repeat
}

.panels {
    float: left;
    box-sizing: border-box
}

.panles-1-4 {
    padding-right: 40px;
    width: 25%
}

.panles-1-2 {
    width: 50%
}

.box-text-slider, .box-text-slider-ol {
    height: 600px
}

.box-text-slider {
    position: absolute;
    top: 0;
    opacity: 0
}

.box-text-slider.active {
    opacity: 1
}

.cols-right {
    float: right
}

.cols-right .cols-in {
    padding: 0 60px
}

.floating-img.floating-img-left {
    right: auto;
    left: 0
}

.section-hr-contents .cols-in {
    height: 600px
}

.hr-text-ol {
    box-sizing: border-box;
    padding: 0 120px
}

.hr-text {
    opacity: 0.1;
    font-size: 6vw;
    line-height: 1em;
    text-align: left;
    text-align: center;
    display: block;
    margin-bottom: 0.35em
}

.pulldown-ol {
    padding: 30px 0 60px
}

.pulldown-ol .sub-sub-title {
    opacity: 0.6;
    margin-top: 0
}

.pulldown {
    position: relative;
    z-index: 2;
    margin: 20px 0;
    font-size: 1.8vw;
    height: 80px
}

.pulldown span {
    font-family: 'Roboto';
    height: 80px;
    line-height: 80px;
    display: block;
    font-weight: 400;
    cursor: pointer
}

.pulldown span.t {
    position: relative;
    z-index: 2
}

.pulldown span.bg {
    position: absolute;
    z-index: 1;
    top: 0;
    left: -100%;
    display: block;
    background: rgba(0, 0, 0, 0.05);
    height: 100%;
    width: 100%
}

.pulldown span.in {
    overflow: hidden;
    padding: 0 1em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #d3d3d3;
    border-right: 1px solid #d3d3d3;
    border-left: 1px solid #d3d3d3
}

.pulldown li {
    background: #fff;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    overflow: hidden
}

.pulldown-ul {
    cursor: pointer;
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.pulldown-ul span.t {
    font-weight: 300;
    font-size: 1.4vw
}

.pulldown span.pulldown-change {
    display: block;
    position: absolute;
    right: 20px;
    top: 50%;
    background: #272727;
    width: 120px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    font-size: 1.2rem;
    text-align: center;
    margin-top: -15px;
    z-index: 3
}

.products-footer {
    margin-bottom: 20px;
    overflow: hidden
}

.products-loaded {
    font-size: 0;
    text-align: center
}

.products-loaded span {
    display: inline-block;
    vertical-align: bottom;
    font-family: 'Roboto';
    margin-bottom: -0.35em
}

.products-loaded .n {
    font-size: 2vw;
    padding: 0 0.1em
}

.products-loaded .t {
    font-size: 1.5vw;
    opacity: 0.6;
    padding-left: 0.5em
}

.products-loadmore {
    display: block;
    height: 70vh;
    width: 100%;
    padding: 0 60px
}

.products-loadmore .table {
    background-size: cover;
    background-repeat: no-repeat
}

.products-loadmore .t {
    display: block;
    font-weight: 500;
    font-family: 'Roboto';
    color: rgba(255, 255, 255, 0.9);
    letter-spacing: 0.05em;
    line-height: 60px;
    font-size: 1.5rem;
    height: 60px;
    width: 120px;
    text-align: center;
    margin: 0 auto;
    border-bottom: 2px solid #fff
}

.section-products-list .products {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding: 0;
    margin-bottom: 60px
}

.pulldown-current {
    cursor: pointer;
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    background: #fff;
    border-top: 1px solid #d3d3d3;
    box-sizing: border-box;
    overflow: hidden
}

.current-category {
    display: block;
    overflow: hidden;
    line-height: 1.2em;
    height: 1.2em
}

.current-category span {
    display: block;
    line-height: 1.2em;
    height: 1.2em
}

.current-category .in {
    height: 200%
}

.pulldown span.current-category {
    margin: 20px 0;
    line-height: 40px;
    height: 40px
}

.pulldown span.current-category .before, .pulldown span.current-category .after {
    line-height: 40px;
    height: 40px
}

.pulldown span.current-category .in {
    border: none;
    padding: 0
}

.inf-layout-ol {
    margin-bottom: 30px
}

.sub-title .logo-black {
    display: block;
    width: 85px;
    height: 30px;
    background: url(../images/logo_black.png) no-repeat center;
    background-size: cover
}

.input-ol .input-head, .input-ol .input-body, .inf-layout dd, .inf-layout dt {
    box-sizing: border-box;
    padding-top: 30px;
    padding-bottom: 30px;
    line-height: 1.5em
}

.input-ol .input-head, .inf-layout dt {
    padding-right: 15px;
    clear: both;
    float: left;
    position: relative
}

.input-ol .input-body, .inf-layout dd {
    opacity: 0.8;
    position: relative
}

.input-ol .input-head:after, .input-ol .input-body:after, .inf-layout dt:after, .inf-layout dd:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0
}

.input-ol .input-head:after, .inf-layout dt:after {
    z-index: 2;
    height: 2px;
    width: 100%;
    background: rgba(0, 0, 0, 1)
}

.input-ol .input-body:after, .inf-layout dd:after {
    width: 100%;
    z-index: 1;
    height: 1px;
    background: rgba(0, 0, 0, 0.1)
}

.inf-layout.inf-layout-text dl {
    clear: both
}

.inf-layout.inf-layout-text dt {
    font-size: 1.5rem;
    line-height: 1.8em
}

.inf-layout.inf-layout-text dd {
    line-height: 1.8em
}

.slider-middle-ol .slider-controls {
    bottom: 0
}

.is_scrolling_on .js-slider-controls-fixed-ol {
    position: fixed;
    z-index: 10;
    top: 50%;
    left: 0;
    width: 100%
}

.is_scrolling_on .js-slider-controls-fixed {
    max-width: 1320px;
    width: 100%;
    margin: 0 auto;
    padding: 0 120px;
    box-sizing: border-box
}

.is_scrolling_on .js-slider-controls-fixed .in {
    margin-left: -60px
}

.slider-middle-ol .is_scrolling_over .slider-controls, .slider-large-ol .is_scrolling_over .slider-controls {
    top: auto;
    bottom: 0
}

.inf-layout-icons li {
    display: inline-block;
    vertical-align: middle;
    padding-right: 0.5em
}

.slider-middle-ol .is_scrolling_on .js-slider-controls-fixed-ol {
}

.slider-middle-ol .is_scrolling_on .js-slider-controls-fixed {
    max-width: 100%
}

.desktop .inf-layout dd a, .desktop .inf-layout dt a {
    opacity: 0.6;
    transition: all .6s
}

.desktop .inf-layout dd a:hover, .desktop .inf-layout dt a:hover {
    opacity: 1
}

.input-ol {
    clear: both
}

.input-ol .input-head {
    display: block;
    font-weight: bold
}

.input-ol-bottom {
    border-top: 2px solid rgba(0, 0, 0, 1);
    padding-top: 30px
}

.input-body input {
    width: 100%;
    margin-bottom: 5px
}

.input-body textarea {
    width: 100%;
    height: 180px;
    resize: none
}

.inf-layout dt {
    width: 180px
}

.inf-layout dd {
    margin-left: 180px
}

.input-ol .input-head, .inf-layout.inf-layout-text dt {
    width: 280px;
    padding-right: 30px
}

.input-ol .input-body, .inf-layout.inf-layout-text dd {
    margin-left: 280px
}

.mwform-checkbox-field label {
    display: flex;
    align-items: center;
    line-height: 1.45em
}

.input-ol .input-body-confirm {
    float: left;
    width: 60%;
    font-size: 1.3rem
}

.input-ol .input-body-confirm label {
    cursor: pointer
}

.input-ol .input-body-confirm input {
    border: 2px solid #000;
    display: block;
    width: 30px;
    height: 32px;
    border-radius: 4px;
    float: left;
    margin: 0.25em 1em 0.25em 0
}

.input-ol .input-body-confirm input:after {
    transition: all .3s ease-in-out
}

.input-ol .input-body-confirm input:checked:after {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background: #6a6b75;
    margin: 9px 8px
}

.desktop .input-ol .input-body-confirm label:hover input:not(:checked):after {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background: #6a6b75;
    margin: 9px 8px;
    opacity: 0.2
}

.input-ol .input-body-submit {
    opacity: 1;
    float: right;
    text-align: right
}

.input-body-submit input {
    width: 100%;
    line-height: 60px;
    height: 60px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    position: relative;
    z-index: 2
}

.input-submit-ol {
    float: right;
    display: block;
    width: 180px;
    line-height: 60px;
    height: 60px
}

.error-title {
    background: rgba(47, 40, 40, 0.6)
}

.complete-title {
    background: rgba(60, 60, 60, 0.4)
}

.inf-layout.inf-layout-text p {
    opacity: 1;
    margin-bottom: 1em
}

.inf-layout.inf-layout-text dd > p {
    margin-bottom: 2em
}

.inf-layout.inf-layout-text li {
    margin-bottom: 1em;
    position: relative
}

.inf-layout.inf-layout-text ul, .inf-layout.inf-layout-text ol {
    box-sizing: border-box;
    padding-left: 2em;
    counter-reset: my-counter;
    margin-bottom: 1em;
    overflow: hidden
}

.inf-layout.inf-layout-text ul > li:before {
    content: '';
    display: block;
    position: absolute;
    left: -20px;
    top: 11px;
    width: 6px;
    height: 6px;
    background: #000;
    border-radius: 100%
}

.inf-layout.inf-layout-text ul ul > li:before {
    background: none;
    border: 1px solid #000;
    border-radius: 100%
}

.inf-layout.inf-layout-text ol > li:before {
    content: counter(my-counter);
    counter-increment: my-counter;
    position: absolute;
    left: -2em;
    top: 0;
    font-family: 'Roboto';
    font-weight: bold
}

.simple-slider {
    display: none !important;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.simple-slider .js-slider-wrap, .simple-slider .js-slider {
    width: 100%;
    height: 100%
}

.is_not_webgl .simple-slider {
    display: block !important
}

.is_not_webgl .is_webgl {
    display: none !important
}

.is_item .header .logo {
    background-position: center bottom
}

.is_item .nav li a {
    color: #080a15
}

.is_item .toggle .in div {
    background: #080a15
}

.is_menu_opened.is_item .toggle .in div {
    background: #fff
}

.is_item .item-first-view {
    background: #fff
}

.item-side {
    position: absolute;
    z-index: 1;
    top: 50%;
    width: 60vh;
    height: 40px;
    font-size: 0.85vw;
    font-size: 1.2rem;
    padding: 10px 30px;
    border: 1px solid #e4e6e8
}

.item-side .bg {
    background: rgba(8, 10, 21, 0.1);
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)
}

.item-side .txt {
    position: relative;
    z-index: 2;
    display: inline-block;
    width: 100%;
    height: 100%
}

.item-side.item-side-left {
    left: -30vh;
    text-align: left;
    margin-left: -1px;
    transform: rotate(-90deg)
}

.item-side.item-side-right {
    right: -30vh;
    text-align: right;
    margin-right: -1px;
    transform: rotate(-90deg)
}

.item-side .arrow {
    position: absolute;
    width: 15px;
    height: 15px
}

.item-side.item-side-left .arrow {
    right: 0;
    top: 15px;
    transform: rotate(-90deg)
}

.item-side.item-side-right .arrow {
    left: 0;
    top: 10px;
    transform: rotate(90deg)
}

.item-side .arrow .in {
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.item-side .arrow .in .a1-1, .item-side .arrow .in .a1-2, .item-side .arrow .in .a2-1, .item-side .arrow .in .a2-2 {
    position: absolute;
    display: block;
    width: 8px;
    height: 1.8px;
    right: 2px;
    top: 50%;
    background: #080a15;
    transform-origin: right center;
    transition: all .4s ease-in-out
}

.item-side .arrow .in .a1-1 {
    transform: rotate(45deg) translate3d(0, 0, 0)
}

.item-side .arrow .in .a1-2 {
    transform: rotate(-45deg) translate3d(0, 0, 0)
}

.item-side .arrow .in .a2-1 {
    opacity: 0;
    transform: rotate(45deg) translate3d(-75%, 0, 0)
}

.item-side .arrow .in .a2-2 {
    opacity: 0;
    transform: rotate(-45deg) translate3d(-75%, 0, 0)
}

.item-side.is_hovered .arrow .in .a1-1 {
    opacity: 0;
    transform: rotate(45deg) translate3d(75%, 0, 0)
}

.item-side.is_hovered .arrow .in .a1-2 {
    opacity: 0;
    transform: rotate(-45deg) translate3d(75%, 0, 0)
}

.item-side.is_hovered .arrow .in .a2-1 {
    opacity: 1;
    transform: rotate(45deg) translate3d(0, 0, 0)
}

.item-side.is_hovered .arrow .in .a2-2 {
    opacity: 1;
    transform: rotate(-45deg) translate3d(0, 0, 0)
}

.item-mainvisual {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh
}

.item-mainvisual .background-img {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center
}

.item-title-ol {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 120px;
    z-index: 2
}

.item-title-in {
    width: 37%
}

.item-title-ol .body-inside {
    padding: 30px 30px 45px 30px
}

.item-title-ol .body-inside h2 {
    font-size: 2.4rem;
    margin-bottom: 15px
}

.item-title-ol .products-price {
    margin-bottom: 30px
}

.item-title-ol p {
    opacity: 1
}

.item-title-ol .yen {
    font-size: 2.8rem
}

.item-title-ol .tax {
    font-size: 1.8rem
}

.btn-shop {
    display: inline-block;
    box-sizing: border-box;
    border: 2px solid #fff;
    color: #fff;
    border-radius: 30px;
    font-weight: bold;
    font-size: 1.6rem;
    line-height: 4rem;
    white-space: nowrap;
    transition: all .2s ease-in-out
}

.btn-shop .bg {
    background: #fff
}

.btn-shop .txt {
    padding: 0 30px;
    position: relative;
    z-index: 2;
    top: -1px
}

.btn-shop.is_hovered {
    color: #080a15;
    transition: all .4s ease-in-out
}

.js-background-lazy {
    opacity: 0;
    transition: opacity 0.6s
}

.js-background-lazy.is_bg_loaded {
    opacity: 1
}

.section-item-info h2.item-info-title {
    font-size: 20vw;
    opacity: 0.5;
    position: absolute;
    left: 0;
    top: 30px;
    line-height: 1;
    white-space: nowrap;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    width: 100%
}

.section-item-info .two-col-layout {
    position: relative;
    padding-top: 60px
}

.section-item-info .cols-left .cols-in {
    padding: 30px
}

.item-info .background-img {
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

.item-info-single {
    width: 100%
}

.item-info-main {
    width: 80%
}

.item-info-sub {
    width: 80%;
    position: absolute;
    right: -60px;
    bottom: -60px
}

.section-category-theme p {
    text-align: justify
}

.section-category-theme .body-inside {
    padding: 0 30px
}

.item-info p {
    font-size: 1.4rem;
    margin-bottom: 0.5em
}

.item-info .topic-title {
    color: #6a6b75;
    margin-bottom: 1.5rem;
    font-size: 1.25em
}

.item-info .products-dl {
    font-size: 1.3rem;
    line-height: 1.8em
}

.item-info .products-dl dt {
    width: 110px;
    float: left;
    padding: 0 0 1em;
    font-weight: bold
}

.item-info .products-dl dd {
    margin-left: 110px;
    padding: 0 0 1em;
    opacity: 0.8
}

.item-info .products-dl dd li {
    margin-bottom: 1em
}

.item-info .products-list-dl {
    position: relative;
    padding: 3px 0 3px 15px
}

.item-info .products-list-dl dt {
    margin: 0 0 1em;
    font-weight: bold;
    font-size: 1.4rem
}

.item-info .products-list-dl dt .sub-text {
    display: inline-block;
    margin: 0 10px;
    font-size: 1.1rem
}

.item-info .products-list-dl dd {
    margin: 0 0 1em;
    opacity: 0.8
}

.item-info .products-list-dl dt:before, .item-info .products-list-dl dt:after {
    content: '';
    display: block;
    width: 3px;
    height: 3px;
    background: #080a15;
    position: absolute;
    left: 0;
    top: 8px
}

.item-info .products-list-dl dt:after {
    top: 13px
}

.item-info blockquote {
    padding: 24px;
    background: #fff;
    margin: 1rem 0
}

.item-info blockquote p {
    font-size: 1.4rem
}

.item-info blockquote .topic-title {
    color: #080a15;
    font-weight: bold
}

.section-related {
    padding: 0 60px;
    max-width: 1040px;
    margin: 0 auto
}

.section-related h4 {
    font-weight: bold;
    opacity: 0.6
}

.related-ol {
    margin: 0 -8px
}

.related-ol .products {
    float: left;
    width: 25%;
    box-sizing: border-box;
    padding: 0 8px
}

.related-ol .products-thumb {
    display: block;
    height: 420px;
    max-width: 320px;
    margin: 0 auto
}

.related-ol .products-thumb span {
    display: block;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center
}

.related-ol .products-body {
    position: absolute;
    box-sizing: border-box;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    visibility: hidden
}

.item-slide {
    position: relative;
    cursor: pointer;
    cursor: crosshair;
    cursor: -webkit-zoom-in
}

.item-slide .background-img {
    display: block;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

.item-slide-large {
    height: 100vh
}

.item-slide-medium {
    height: 70vh
}

.item-slide iframe {
    width: 100%;
    height: 100%
}

.item-slide .js-iframe {
    cursor: default
}

.btn-zoom {
    visibility: hidden;
    position: absolute;
    box-sizing: border-box;
    z-index: 99;
    height: 60px;
    width: 60px;
    margin: -30px 0 0 -30px;
    pointer-events: none
}

.btn-zoom-in {
    padding: 20px;
    width: 16px;
    height: 16px;
    position: relative
}

.btn-zoom-in > .z {
    top: 50%;
    left: 50%;
    position: absolute;
    height: 16px;
    width: 16px;
    margin: -8px 0 0 -8px;
    transition: all 0.6s;
    opacity: 0
}

.btn-zoom-in > .z > .in > div {
    opacity: 0;
    transition: all 0.6s;
    background: #080a15;
    position: absolute
}

.btn-zoom-in > .z > .in > div.z-1 {
    transition-delay: 0.0s;
    transform: translate(0px, -5px);
    top: 0;
    left: 50%;
    height: 9px;
    width: 2px;
    margin-left: -1px
}

.btn-zoom-in > .z > .in > div.z-2 {
    transition-delay: 0.02s;
    transform: translate(-5px, 0px);
    top: 50%;
    left: 0;
    width: 9px;
    height: 2px;
    margin-top: -1px
}

.btn-zoom-in > .z > .in > div.z-3 {
    transition-delay: 0.04s;
    transform: translate(5px, 0px);
    top: 50%;
    right: 0;
    width: 5px;
    height: 2px;
    margin-top: -1px
}

.btn-zoom-in > .z > .in > div.z-4 {
    transition-delay: 0.06s;
    transform: translate(0px, 5px);
    bottom: 0;
    left: 50%;
    height: 5px;
    width: 2px;
    margin-left: -1px
}

.btn-zoom.on {
    visibility: visible
}

.btn-zoom.on .z {
    opacity: 1
}

.btn-zoom.on .z > .in > div.z-1, .btn-zoom.on .z > .in > div.z-2, .btn-zoom.on .z > .in > div.z-3, .btn-zoom.on .z > .in > div.z-4 {
    transform: translate(0px, 0px);
    opacity: 1
}

.zoom-img-ol {
    display: block;
    visibility: hidden;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999
}

.zoom-img-in {
    width: 100%;
    height: 100%
}

.zoom-img-body {
    width: 100%;
    position: relative;
    transform: matrix(1, 0, 0, 1, 0, 0)
}

.close {
    cursor: pointer;
    height: 60px;
    width: 60px;
    position: fixed;
    top: 25px;
    right: 50px;
    box-sizing: border-box;
    z-index: 99;
    background: #090A14
}

.close-in {
    padding: 24px 23px 24px 22px;
    width: 15px;
    height: 12px;
    position: relative
}

.close-in > div {
    height: 2px;
    width: 100%
}

.close-in > div.t4 {
    top: 50%;
    left: 50%;
    position: absolute;
    height: 16px;
    width: 16px;
    margin: -8px 0 0 -8px;
    opacity: 1
}

.is_zoom_opened .t4 > .in > div.t4-1, .is_zoom_opened .t4 > .in > div.t4-2, .is_zoom_opened .t4 > .in > div.t4-3, .is_zoom_opened .t4 > .in > div.t4-4 {
    transform: translate(0px, 0px);
    opacity: 1
}

.item-shopbtn-ol {
    position: fixed;
    z-index: 10;
    right: 10px;
    bottom: 10px;
    transform: translateY(82px);
    transform: translateY(calc(100% + 10px));
    transition: all .4s ease-in-out
}

.item-shopbtn-in {
    padding: 15px 30px
}

.item-shopbtn-ol h2 {
    display: inline-block;
    font-size: 1.4rem;
    margin-right: 15px
}

.item-shopbtn-ol .products-price {
    display: inline-block;
    margin-right: 30px
}

.item-shopbtn-ol .products-price .yen {
    font-size: 1.4rem
}

.item-shopbtn-ol .products-price .tax {
    font-size: 1.2rem
}

.item-shopbtn-ol .btn-shop {
    float: right;
    font-size: 1.3rem
}

.is_scrolled .item-shopbtn-ol {
    transform: translateY(0)
}

.is_itemend .item-shopbtn-ol {
    transform: translateY(82px);
    transform: translateY(calc(100% + 10px))
}

.is_enter_transition .item-shopbtn-ol {
    display: none
}

.menu-ol {
    overflow: hidden;
    position: fixed;
    z-index: 98;
    top: 0;
    left: -9999px;
    height: 100%;
    width: 100%;
    transition: left 0s 0.8s
}

.menu-bg {
    transform: translate(0px, 100%);
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(84, 85, 86, 0.95)
}

.menu {
    z-index: 3;
    width: 1000px;
    height: 450px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -225px 0 0 -500px
}

.menu-header {
    width: 40%;
    height: 100%;
    float: left
}

.menu-header .logo {
    top: 0;
    margin: 0
}

.menu-header .toggle-link {
    position: absolute;
    bottom: 0;
    left: 0;
    background: none
}

.menu-header .toggle-link > .in {
    box-sizing: border-box;
    border: 1px solid #b9b9b9
}

.menu-body {
    width: 60%;
    height: 100%;
    float: right
}

.menu-nav {
    margin-bottom: 2rem;
    overflow: hidden
}

.menu-nav a {
    line-height: 56px;
    font-size: 58px;
    display: block;
    color: rgb(158, 158, 158);
    margin-bottom: 20px;
    display: block;
    vertical-align: top
}

.menu-side-nav li a, .menu-sns li a, .menu-nav a, .lang a .t {
    transition: color 0.6s
}

.lang .hr {
    transition: all 0.6s
}

.menu-side-nav li a:hover, .menu-sns li a:hover, .menu-nav a:hover, .lang a:hover .t, .menu-nav .active a {
    color: rgba(255, 255, 255, 1)
}

.js-hover-menu {
    display: block;
    overflow: hidden
}

.nav li, .nav li a {
    transition: all 0.6s
}

.nav li a {
    /*opacity: 0.6*/
}

.nav li.active a {
    font-weight: bold;
    opacity: 1
}

.nav li a:hover {
    opacity: 1
}

.menu-sns {
    position: absolute;
    bottom: 0;
    left: 0
}

.menu-sns li, .menu-side-nav li {
    display: inline-block;
    vertical-align: top;
    font-size: 0
}

.menu-sns li a {
    line-height: 60px;
    height: 60px
}

.menu-side-nav li a {
    padding-right: 30px;
    display: block;
    font-size: 1.4rem;
    color: rgb(158, 158, 158)
}

.menu-side-nav li.active a {
    color: rgba(255, 255, 255, 1)
}

.menu-sns li a {
    padding-right: 30px;
    display: block;
    font-size: 2rem;
    color: rgb(158, 158, 158)
}

.lang {
    margin-bottom: 10px
}

.lang a {
    display: block;
    line-height: 30px;
    text-align: center;
    width: 36px;
    padding: 10px 0;
    box-sizing: border-box;
    overflow: hidden
}

.lang .t {
    color: rgba(255, 255, 255, 0.4)
}

.lang span {
    display: block
}

.lang .hr {
    position: absolute;
    height: 1px;
    width: 100%;
    bottom: 0;
    left: 0;
    transform: translate(-100%, 0);
    background: #fff
}

.lang .active .t {
    color: rgba(255, 255, 255, 1)
}

.lang .active .hr {
    transform: translate(0%, 0)
}

.widget_wpglobus a img, .widget_wpglobus a .name, .widget_wpglobus a .code:before, .widget_wpglobus a .code:after {
    display: none !important
}

.is_menu_opened .menu-ol {
    left: 0;
    transition: left 0s 0s
}

.menu .js-fade-in {
    opacity: 0;
    transform: translate(0px, 100%)
}

.menu-mask, .menu-background .js-background-img, .menu-background-img, .menu-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.menu-mask {
    z-index: 100;
    display: none
}

.menu-background {
    position: fixed;
    z-index: 1;
    top: 0;
    left: -9999px;
    width: 100%;
    height: 100%;
    background: none
}

.is_menubg_opened .menu-background {
    z-index: 97;
    left: 0
}

.is_page_transition .menu-mask {
    display: block
}

.menu-background {
    background: rgba(84, 85, 86, 1)
}

.menu-background-img .js-background-img {
    opacity: 0;
    z-index: 1;
    background-size: cover;
    background-position: center
}

.is_menubg_opened .menu-background-img .js-background-img {
    transition: opacity 1s
}

.is_not_menued .menu-background-img .js-background-img {
    transition: opacity 0s
}

.menu-background-img.active .js-background-img {
    opacity: 0.1;
    z-index: 2
}

.js-loading-mask {
    z-index: 100
}

.loading-mask {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    overflow: hidden
}

.loading-mask .in {
    position: fixed;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    background: #6a6b75
}

.js-transiiton-mask {
    z-index: 100
}

.transiiton-mask {
    position: fixed;
    z-index: 1000;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ccc
}

.is_menu_opened .js-canvas-slider {
    opacity: 1;
    transition: opacity 0s
}

.toggle-in {
    opacity: 0;
    transform: translate(0px, 60px);
    transition: opacity 0.6s, transform 0.6s, background 0.2s
}

.slider-middle-bg, .header .logo, .header .nav, .main-sub-title, .first-view .main-title {
    opacity: 0;
    transform: translate(0px, 60px);
    transition: opacity 0.6s, transform 0.6s
}

.is_page_loaded .toggle-in, .is_page_loaded .slider-middle-bg, .is_page_loaded .header .logo, .is_page_loaded .header .nav, .is_page_loaded .main-sub-title, .is_page_loaded .first-view .main-title {
    opacity: 1;
    transform: translate(0px, 0px)
}

.is_enter_transition .toggle-in, .is_enter_transition .slider-middle-bg, .is_enter_transition .header .logo, .is_enter_transition .header .nav, .is_enter_transition .main-sub-title, .is_enter_transition .first-view .main-title {
    opacity: 0;
    transform: translate(0px, -60px)
}

.is_leave_transition .toggle-in, .is_leave_transition .slider-middle-bg, .is_leave_transition .header .logo, .is_leave_transition .header .nav, .is_leave_transition .main-sub-title, .is_leave_transition .first-view .main-title {
    opacity: 0;
    transform: translate(0px, 60px)
}

.is_menubg_opened .toggle-in {
    opacity: 1;
    transform: translate(0px, 0px)
}

#js-page-wrapper {
    position: relative;
    z-index: 2
}

.canvas-background-ol {
    z-index: 1;
    height: 100vh;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0
}

#js-canvas-background {
    height: 100%;
    width: 100%
}

.js-scroll-fade-in {
    transition: all 1s;
    opacity: 0;
    transform: translate(0px, 120px)
}

.is_over.js-scroll-fade-in {
    opacity: 1;
    transform: translate(0px, 0px)
}

.is_products_loaded .js-scroll-fade-in {
    opacity: 1;
    transform: translate(0px, 0px)
}

.is_products_loaded .products {
    opacity: 0
}

.huge-text-background {
    position: fixed;
    z-index: 200;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.js-shutter-text {
    opacity: 0 !important
}

.is_start.js-shutter-text {
    opacity: 1 !important
}

.is_not_menued .toggle {
    z-index: 96
}

.laptop-show, .sp-show, .pad-show {
    display: none !important
}

@media screen and (min-width: 1700px) {
    html {
        font-size: 71.5%
    }

    .body, .body.thin, .section-products .body {
        max-width: 1280px
    }

    .products-title a {
        font-size: 21px
    }
}

@media screen and (min-width: 1600px) {
    .subpages .main-title {
        font-size: 4.6vw
    }
}

@media screen and (max-width: 1700px) {
    html {
        font-size: 71.5%
    }
}

@media screen and (max-width: 1600px) {
    html {
        font-size: 68.5%
    }
}

@media screen and (max-width: 1500px) {
    html {
        font-size: 65.5%
    }
}

@media screen and (max-width: 1400px) {
    html {
        font-size: 62.5%
    }

    .body, .body.thin, .section-products .body {
        max-width: 100%
    }
}

@media screen and (max-width: 1300px) {
    .cols-text {
        min-width: 250px
    }

    .slider-concept {
        bottom: 60px
    }

    .laptop-show {
        display: block !important
    }

    .laptop-hide {
        display: none !important
    }

    .menu {
        width: 800px;
        margin-left: -400px
    }
}

@media screen and (max-width: 1100px) {
}

@media screen and (max-width: 1024px) {
    .body, .body.thin, .section-products .body {
        max-width: 100%
    }

    .js-scroll-fade-in {
        opacity: 1;
        transform: translate(0px, 0px)
    }

    .cols-text {
        padding: 0
    }

    .pad-show {
        display: block !important
    }

    .main-title-spacer, .main-title-ol .spacer, .pad-hide, .controls-num, .side {
        display: none !important
    }

    .body {
        padding: 0 60px
    }

    .slider-concept {
        position: relative;
        right: 0;
        top: auto;
        width: 100%
    }

    .cols-text {
        width: 100%
    }

    .cols {
        height: 100%;
        width: 100%;
        float: none;
        padding: 0 60px;
        box-sizing: border-box
    }

    .spacer {
        height: 30px !important
    }

    .section-concept-body {
        height: auto
    }

    .section-concept-body .add-bg-gray {
        padding: 60px 0;padding-top: 0px;
    }

    .slider-concept {
        margin-top: -60px;
        margin-bottom: 90px
    }

    .products-ol {
        font-size: 0
    }

    .products-body {
        font-size: 1.2rem
    }

    .products {
        float: none;
        width: 50%;
        display: inline-block;
        vertical-align: top;
        box-sizing: border-box;
        padding: 10px;
    }

    .myp{margin-top: 4px;}

    .js-slider-controls-fixed-ol .slider-controls {
        position: absolute !important;
        top: auto !important;
        bottom: -1px !important
    }

    .js-slider-controls-fixed {
        padding: 0px !important
    }

    .slider-middle .js-slider-wrap, .slider-middle.js-canvas-slider-ol {
        height: 30vh
    }

    .slider-middle-ol {
        padding-top: 30px
    }

    .sub-header-cols .cell {
        display: block
    }

    .section {
        padding: 30px 0
    }

    .section.section-header {
        padding: 0
    }

    .section-products .sub-header, .section-products .sub-footer {
        padding: 0 20px
    }

    .sitemap-ol {
        padding-bottom: 30px
    }

    .links {
        width: 100%
    }

    .links .toggle-link {
        margin-left: auto
    }

    .links .sns {
        margin-left: -10px
    }

    .links address {
        margin: 0 auto
    }

    .slider-concept {
        bottom: 0px
    }

    .section-connected {
        padding: 0
    }

    .subpages .main-title-ol {
        display: table;
        height: 100%;
        width: 100%
    }

    .subpages .main-title-ol .body {
        vertical-align: middle;
        height: 100% !important;
        display: table-cell
    }

    .body-inside {
        padding: 0 60px
    }

    .subpages .body-inside {
        padding: 0;
        text-align: left
    }

    .subpages .first-view .body-inside {
        padding: 30px
    }

    .section-products-header .body-inside, .section-concept .body-inside, .section-infomation .body-inside {
        padding: 0 30px
    }

    .sub-sub-title span {
        font-size: 2.8vw
    }

    .subpages .section.section-concept .add-bg-white {
        padding-bottom: 60px
    }

    .section-hr-contents .cols-in {
        height: auto
    }

    .floating-img {
        position: relative;
        right: 0;
        top: 0;
        margin-top: 0;
        width: 100%;
        height: 400px
    }

    .cols-left .cols-in, .cols-right .cols-in {
        padding-left: 0px;
        padding-right: 0px
    }

    .cols-left .cols-in {
        padding-bottom: 60px
    }

    .section-item-info .two-col-layout {
        padding-top: 30px
    }

    .panles-1-4 {
        padding-right: 30px;
        width: 25%
    }

    .section-team-body {
        padding-bottom: 90px
    }

    .pulldown-ol {
        padding: 15px 0 30px
    }

    .pulldown-select {
        margin-top: 20px;
        height: 60px;
        line-height: 60px;
        font-family: 'Roboto';
        display: block;
        font-weight: 400;
        cursor: pointer;
        border: 1px solid #d3d3d3;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

    .pulldown-select > .in {
        padding: 0 0 0 1em;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

    .pulldown-select select {
        width: 100%;
        position: relative;
        z-index: 2
    }

    .section-products-header {
        padding: 0
    }

    .pulldown-select .pulldown-change {
        display: block;
        position: absolute;
        right: 0px;
        top: -1px;
        background: #272727;
        width: 60px;
        height: 60px;
        line-height: 60px;
        color: #fff;
        font-size: 1.1rem;
        text-align: center;
        margin-top: 0;
        z-index: 1
    }

    .products-footer {
        margin-bottom: 0px
    }

    .products-loadmore {
        height: 30vh
    }

    .section-products .body {
        padding: 0 40px
    }

    .products-cats {
        height: 3em
    }

    .products .products-cats li {
        display: inline-block;
        padding-right: 12px;
        padding-bottom: 4px
    }

    .products-title a {
        margin: 0.5em 0;
        height: 3em;
        font-size: 2.4vw;
        line-height: 1.4em
    }

    .sub-title .logo-black {
        width: 85px;
        height: 30px
    }

    .input-ol .input-body-confirm {
        float: none;
        width: 100%;
        margin-bottom: 15px
    }

    .input-ol .input-body-submit {
        opacity: 1;
        float: none;
        text-align: right
    }

    .menu-body {
        width: 100%;
        float: none
    }

    .menu-header {
        height: auto;
        width: auto;
        float: none
    }

    .menu-header > .in {
        position: static
    }

    .menu {
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 20px 30px
    }

    .menu-body {
        display: table;
        padding: 0 0 0 180px;
        box-sizing: border-box
    }

    .menu-body > .in {
        vertical-align: middle;
        display: table-cell
    }

    .menu-header .toggle-link, .menu-header .lang, .menu-header .logo {
        position: absolute;
        top: 0;
        left: 30px;
        z-index: 10
    }

    .menu-header .logo {
        top: 20px;
        background-position: center top
    }

    .menu-header .toggle-link {
        bottom: 20px;
        top: auto
    }

    .menu-header .lang {
        top: 50%;
        margin-top: -60px
    }

    .menu-nav a {
        display: block;
        margin: 0;
        padding: 0.5em 0;
        font-size: 4rem;
        line-height: 3rem
    }

    .menu-side-nav li {
        display: block
    }

    .menu-side-nav li a {
        display: block;
        font-size: 1.6rem;
        padding: 0.5em 0
    }

    .menu-sns li a {
        padding-right: 0px;
        padding-left: 20px;
        font-size: 1.3rem
    }

    .menu-sns {
        left: auto;
        right: 0
    }

    .is_menu_opened .toggle .in div, .is_menu_opened .t4 > .in > div {
        background: #fff
    }

    .item-side {
        display: none
    }

    .item-mainvisual {
        height: 75vh
    }

    .item-mainvisual .background-img {
        background-position: 60% 50%
    }

    .item-title-ol {
        bottom: 60px
    }

    .item-title-in {
        width: 66%
    }

    .item-title-ol .yen {
        font-size: 2rem
    }

    .item-title-ol .tax {
        font-size: 1.4rem
    }

    .section-item-info .cols-left .cols-in {
        padding: 0
    }

    .item-info-single {
        width: 80%;
        margin: 0 auto
    }

    .item-info-main {
        width: 45%
    }

    .item-info-sub {
        width: 58%;
        position: absolute;
        right: 0;
        bottom: 60px
    }

    .section-related {
        margin-top: -60px;
        padding-right: 60px;
        padding-left: 60px
    }

    .section-item-slides {
        padding: 0
    }

    .item-slide-large {
        height: 60.7vw
    }

    .item-slide-medium {
        height: 64.3vw
    }

    .section-item-slides .cols {
        width: 50%;
        float: left;
        padding: 0
    }

    .zoom-img-in {
        overflow: scroll;
        -webkit-overflow-scrolling: touch
    }

    .item-shopbtn-ol {
        position: relative;
        z-index: 1;
        right: auto;
        bottom: auto;
        transform: translateY(0);
        transition: none
    }

    .item-shopbtn-in {
        padding: 30px 60px
    }

    .item-shopbtn-ol h2 {
        display: block;
        font-size: 1.8rem;
        margin-right: 15px;
        margin-bottom: 5px
    }

    .item-shopbtn-ol .products-price {
        display: block;
        margin-right: 15px;
        margin-bottom: 1.5em
    }

    .item-shopbtn-ol .products-price .yen {
        font-size: 1.8rem
    }

    .item-shopbtn-ol .btn-shop {
        float: none;
        font-size: 1.6rem
    }

    .item-shopbtn-ol .btn-shop .txt {
        padding: 0 20px
    }

    .item-shopbtn-ol .cell {
        display: block
    }

    .is_itemend .item-shopbtn-ol {
        transform: translateY(0)
    }
}

@media screen and (max-width: 680px) {
    .toggle-in, .slider-middle-bg, .header .logo, .header .nav, .first-view .controls-ol {
        opacity: 1 !important;
        transform: translate(0px, 0px)
    }

    .is_enter_transition .toggle-in, .is_enter_transition .slider-middle-bg, .is_enter_transition .header .logo, .is_enter_transition .header .nav, .is_enter_transition .first-view .main-title, .is_enter_transition .first-view .controls-ol {
        transform: translate(0px, 0px)
    }

    .is_leave_transition .toggle-in, .is_leave_transition .slider-middle-bg, .is_leave_transition .header .logo, .is_leave_transition .header .nav, .is_leave_transition .first-view .main-title, .is_leave_transition .first-view .controls-ol {
        transform: translate(0px, 0px)
    }

    .first-view .main-title {
        opacity: 0;
        transform: translate(0px, 30px)
    }

    .is_page_loaded .main-sub-title {
        opacity: 1;
        transform: translate(0px, 0px)
    }

    .is_enter_transition .main-sub-title {
        opacity: 0;
        transform: translate(0px, 0px)
    }

    .is_leave_transition .main-sub-title {
        opacity: 0;
        transform: translate(0px, 30px)
    }

    .sub-sub-title span, .products-loaded .n, .products-loaded .t {
        font-size: 1.4rem;
        line-height: 2em
    }

    .subpages .main-title {
        width: 100%
    }

    .sp-show {
        display: block !important
    }

    .sp-hide {
        display: none !important
    }

    html, body {
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        overflow-scrolling: touch
    }

    .subpages .slider-middle {
        padding: 0 15px;
        box-sizing: border-box
    }

    .header {
        padding: 0 30px;
        background: #fff
    }

    .sub-sub-pages .first-view, .first-view {
        height: 100vw;
        padding-bottom: 0
    }

    .contents > .spacer, .section, .footer {
        background: #fff
    }

    .footer {
        position: relative;
        z-index: 2
    }

    .add-bg-gray, .add-bg-gray .spacer {
        background: #f3f3f3
    }

    .add-bg-white .spacer {
        background: #fff
    }

    .first-view .controls-ol {
        bottom: -30px
    }

    .first-view .controls-ol .js-slider-canvas-controls {
        position: absolute;
        right: 0
    }

    .logo {
        position: relative;
        margin: 20px 0;
        top: 0;
        left: 0;
        width: 85px;
        height: 30px;
        background-position: center bottom
    }

    .header {
        overflow: hidden;
        width: 100%;
        height: auto;
        position: relative
    }

    .nav li a {
        opacity: 0.6;
        padding: 0 15px 0 0;
        font-size: 1.4rem;
        line-height: 60px;
        height: 60px;
        display: block;
        color: #000
    }

    .nav li a.active {
        opacity: 1
    }

    .nav-ol {
        padding: 0
    }

    .nav {
        text-align: left;
        font-size: 0
    }

    .toggle .in div, .t4 > .in > div {
        background: #000
    }

    .toggle {
        top: 10px;
        right: 10px
    }

    .cols, .body {
        padding: 0 30px
    }

    .section-products .body {
        padding: 0 30px
    }

    .section-products .sub-header, .section-products .sub-footer {
        padding: 0
    }

    .controls-ol .body, .section-concept-body {
        padding: 0
    }

    .sub-sub-pages.subpages .main-title, .subpages .main-title {
        font-size: 3rem
    }

    .sub-title, .main-title {
        font-size:20px;
        left: 30px
    }

    .sub-title {
        line-height: 30px
    }

    .sub-sub-title {
        margin-top: 0.5em
    }

    .support-header-hr {
        width: 15px
    }

    .support-header-body li a {
        padding: 0;
        margin: 0 10px 0 0
    }

    .support-header-body li a.active {
        padding: 0 5px;
        margin-left: 0
    }

    .support-header-body {
        padding-left: 30px
    }

    .slider-middle-in {
        padding: 0 15px
    }

    .slider-middle .js-slider-wrap, .slider-middle.js-canvas-slider-ol {
        height: 50vh
    }

    .sub-header-left {
        width: 100%;
        padding: 0 0 30px 0
    }

    .bnr {
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 0 0 3px
    }
    .bnr2{
        width: 100%;
        padding-top: 6px;
        padding-left: 0px;
    }


    .bnr:first-child {
        padding: 0 3px 0 0
    }

    .connected {
        width: 25%
    }

    .section-connected {
        padding: 0
    }

    .section-connected .support-header {
        position: absolute;
        top: -70px;
        left: 0
    }

    .footer {
        padding: 30px
    }

    .links, .sitemap-ol {
        width: 100%;
        float: none
    }

    address {
       /* width: 100px;*/ width: 100%;
    }

    .sitemap-ol{
        margin-top: 0;
    }

    .addresspos{
        top:0px;
    }

    .sns li a {
        width: 30px
    }

    .connected-header-bg {
        top: -33%
    }

    .controls-in {
        height: 30px;
        line-height: 30px
    }

    .scroll-to-down {
        display: none
    }

    .subpages .first-view .controls-ol, .body-inside {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 30px
    }

    .subpages .first-view .controls-ol {
        bottom: 0
    }

    .slider-large-ol .slider-controls {
        left: 0
    }

    .cols-text-plane {
        padding: 0 0 30px 0
    }

    .floating-img {
        height: 25vh
    }

    .floating-img .in, .floating-img.floating-img-left .in {
        padding: 0 30px
    }

    .section-team-body {
        background-size: 100%
    }

    .teams {
        width: 50%
    }

    .panels-ol {
        padding: 30px 27px 0 30px
    }

    .panles-1-4 {
        width: 50%
    }

    .panles-1-2 {
        padding-top: 3px;
        padding-right: 3px;
        width: 100%
    }

    .panles-1-4 {
        padding-right: 3px
    }

    .section-team-body {
        padding-top: 30px
    }

    .subpages .section-products .body {
        padding: 0 28px
    }

    .input-ol .input-head, .input-ol .input-body, .inf-layout dd, .inf-layout dt {
        line-height: 1.5
    }

    .inf-layout dt {
        width: 120px
    }

    .inf-layout dd {
        padding-left: 120px;
        margin-left: 0
    }

    .input-ol .input-head, .inf-layout.inf-layout-text dt {
        width: 100%;
        padding-bottom: 30px
    }

    .input-ol .input-body, .inf-layout.inf-layout-text dd {
        padding-left: 0;
        float: none;
        margin-left: 0
    }

    .inf-layout.inf-layout-text dd {
        line-height: 1.7em
    }

    .input-body textarea {
        height: 120px
    }

    .floating-img.floating-img-single .in {
        padding: 0 30px
    }

    .body .body-inside .inf-layout dt {
        width: 100%;
        float: none
    }

    .body .body-inside .inf-layout dd {
        padding-left: 0;
        padding-bottom: 48px
    }

    .sort-ol {
        margin: 0 -30px
    }

    .pulldown-ol {
        padding: 0 0 30px
    }

    .products-ol {
        margin: 0 -18px
    }

    .products-ol-home .products:last-child {
        display: none
    }

    .products {
        padding: 2px
    }

    .myp{margin-top: 4px}

    .products-body {
        padding: 15px
    }

    .products .products-cats li {
        display: block;
        padding-right: 0
    }

    .products-title a {
        margin-top: 1.5em;
        height: 4.3em;
        font-size: 3.2vw;
        line-height: 1.4em
    }

    .yen {
        font-size: 1.5rem
    }

    .section-category-theme {
        opacity: 0.75
    }

    .menu-nav {
        margin-bottom: 1rem
    }

    .menu-nav a {
        font-size: 2.8rem;
        line-height: 2.4rem
    }

    .menu-side-nav li a, .menu-nav a {
        padding: 0.3em 0
    }

    .menu-body {
        padding: 0 0 0 60px
    }

    .canvas-background-ol {
        height: 55vh;
        top: 150px;
        background: #f3f3f3
    }

    .sub-sub-pages .first-view .controls-ol, .sub-sub-pages .body-inside {
        padding: 0
    }

    .remove-bg-gray {
        background: #fff
    }

    .footer .sns {
        margin-left: -8px
    }

    .is_item .first-view {
        padding-top: 100vw;
        padding-bottom: 30px;
        height: auto
    }

    .item-mainvisual {
        height: 100vw
    }

    .item-mainvisual .background-img {
        background-position: 75% 50%
    }

    .item-title-ol {
        bottom: auto;
        position: relative
    }

    .item-title-in {
        width: 100%
    }

    .is_item .subpages .item-title-ol .main-title {
        font-size: 2rem
    }

    .item-shopbtn-in {
        padding: 30px
    }

    .section-item-info .cols-right {
        padding: 0
    }

    .item-info-single {
        width: 80%;
        margin: 0 auto
    }

    .item-info-main {
        width: 45%
    }

    .item-info-sub {
        width: 58%;
        position: absolute;
        right: 0;
        bottom: 30px
    }

    .section-related {
        padding-right: 30px;
        padding-left: 30px
    }

    .related-ol {
        margin: 0 -1px
    }

    .related-ol .products {
        width: 50%;
        padding: 1px
    }

    .section-item-slides .body {
        padding: 0
    }

    .section-item-slides .cols {
        width: 100%
    }

    .section-item-slides .cols .item-slide-medium {
        height: 100vw
    }

    .section-item-slides .cols .item-slide-large {
        height: 100vw
    }

    .section-item-slides .item-slide-large {
        height: 100vw
    }

    .close {
        top: 10px;
        right: 10px
    }

    .close .in div {
        background: #fff
    }

    .section-line {
        opacity: 0;
        transition: opacity 0.6s
    }

    .is_page_loaded .section-line {
        opacity: 1
    }

    .is_leave_transition.is_page_loaded .section-line {
        opacity: 0;
        transition: opacity 0s
    }
}

@media screen and (max-width: 320px) {
    .sp-min-hide {
        display: none !important
    }

    address {
        text-align: left
    }

    .connected-title .account {
        font-size: 1.1rem
    }

    .sub-title, .main-title {
        font-size: 2.6rem
    }
}

.xm1 input{
    width: 100%;
    border: 1px solid #a3a3a3;
    margin-top: 10px;
    text-indent: 10px;

}

.xm1 textarea{
    width: 100%;
    border: 1px solid #a3a3a3;
    margin-top: 20px;
    text-indent: 10px;
    height: 110px;
}

.insubmit{
    cursor: pointer;
    background: #9b4f11;
    color: #ffffff;
    font-size: 16px;
    border: 0 !important;
	line-height: 40px;
    border-radius: 20px;
}






/*新闻*/
.bnr p{
	color:#000000 !important;
	line-height:60px;
	font-family:"Arial";
}







/*******数字滚动*******/
/* home */
.mImg {
	display: none;
}

/* .homeBannerSwiper {
  height: 100vh;
} */

.homeBannerSwiper .swiper-slide {
	/* width: 100%;
  height: 100%; */
	font-size: 0;
}

.homeBannerSwiper .swiper-slide-active {
	z-index: 9;
}

.homeBannerSwiper .textBox {
	position: absolute;
	top: 20%;
	left: 50%;
	transform: translate(-50%, 0);
	max-width: 1260px;
	width: 100%;
	text-align: center;
}

.homeBannerSwiper .h1 {
	font-size: 38px;
	color: #fff;
	line-height: 1;
	font-family: OPPOSans-B;
	margin-bottom: 10px;
}

.homeBannerSwiper .h2 {
	font-size: 24px;
	color: #fff;
	line-height: 36px;
	font-family: OPPOSans-M;
	margin-bottom: 7px;
}

.homeBannerSwiper .btn {
	display: inline-block;
	font-size: 14px;
	color: #fff;
	line-height: 36px;
	border-radius: 36px;
	padding-right: 16px;
	background-image: url(../images/icon13.png);
	background-repeat: no-repeat;
	background-position: right center;
	transition: all 0.5s;
	cursor: pointer;
	font-family: OPPOSans-L;
}

.homeBannerSwiper .btn:hover {
	text-decoration: underline;
}

.homeBannerSwiper .videoBox .video {
	position: absolute;
	min-width: 1920px;
	top: 55%;
	left: 50%;
	transform: translate(-50%, -50%);
	object-fit: fill;
}

.homeBannerSwiper .swiper-slide-active .video {
	z-index: 2;
}

/* .homeBannerSwiper .swiper-slide img {
  position: absolute;
  min-width: 1920px;
  height: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
} */

.homeBannerSwiper .swiper-pagination {
	bottom: 75px;
}

.homeBannerSwiper .swiper-pagination-bullet {
	width: 16px;
	height: 2px;
	margin: 0 2px !important;
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 5px;
	opacity: 1;
}

.homeBannerSwiper .swiper-pagination-bullet-active {
	background-color: #fff;
}

.brandUser {
	padding: 20px;
}

.brandUser .wrap {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.brandUser a {
	width: calc(50% - 10px);
	position: relative;
	margin-right: 20px;
}

.brandUser a:last-child {
	margin-right: 0;
}

.brandUser .textBox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	padding: 175px 20px 20px;
}

.brandUser .h1 {
	font-size: 32px;
	color: #fff;
	line-height: 36px;
	margin-bottom: 8px;
	font-family: OPPOSans-B;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.brandUser .h2 {
	font-size: 20px;
	color: #fff;
	line-height: 36px;
	font-family: OPPOSans-R;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.brandUser .btn {
	display: inline-block;
	font-size: 14px;
	color: #fff;
	line-height: 36px;
	margin-top: 10px;
	padding-right: 14px;
	background-image: url(../images/icon12.png);
	background-repeat: no-repeat;
	background-position: right center;
	transition: all 0.5s;
	font-family: OPPOSans-L;
}

.brandUser a .btn:hover {
	text-decoration: underline;
}

.homeProdSwiper {
	margin-bottom: 20px;
}

.homeProdSwiper .swiper-slide {
	font-size: 0;
}

.homeProdSwiper .swiper-button-prev,
.homeProdSwiper .swiper-button-next {
	width: 50px;
	height: 50px;
	border-radius: 25px;
	background-position: center center;
	background-size: auto;
	transition: all 0.5s;
}

.homeProdSwiper .swiper-button-prev {
	left: 15%;
	background-image: url(../images/icon2.png);
}

.homeProdSwiper .swiper-button-next {
	right: 15%;
	background-image: url(../images/icon3.png);
}

.homeProdSwiper .swiper-button-prev:hover,
.homeProdSwiper .swiper-button-next:hover {
	background-color: #b2bcc5;
}

.homeProdSwiper .swiper-pagination {
	bottom: 50px;
}

.homeProdSwiper .swiper-pagination-bullet {
	width: 16px;
	height: 2px;
	margin: 0 2px !important;
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 5px;
	opacity: 1;
}

.homeProdSwiper .swiper-pagination-bullet-active {
	background-color: #fff;
}

.homeProdSwiper .textBox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

	text-align: center;
	padding: 65px 20px 20px;
}

.homeProdSwiper .h1 {
	font-size: 38px;
	color: #414349;
	color: #fff;
	line-height: 1;
	font-family: OPPOSans-B;
	margin-bottom: 10px;
	transform: scale(0.6);
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-o-transform: scale(0.6);
	-moz-transform: scale(0.6);
}

.homeProdSwiper .h2 {
	font-size: 24px;
	color: #646464;
	color: #fff;
	line-height: 36px;
	font-family: OPPOSans-R;
	transform: scale(0.6);
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-o-transform: scale(0.6);
	-moz-transform: scale(0.6);
}

.homeProdSwiper .number {
	font-family: OPPOSans-B;
}

.homeProdSwiper .btn {
	display: inline-block;
	font-size: 14px;
	color: #474645;
	color: #fff;
	line-height: 36px;
	border-radius: 18px;
	margin-top: 10px;
	padding-right: 14px;
	background-image: url(../images/icon12.png);
	background-image: url(../images/icon13.png);
	background-repeat: no-repeat;
	background-position: right center;
	transition: all 0.5s;
	font-family: OPPOSans-L;
}

.homeProdSwiper .btn:hover {
	text-decoration: underline;
}

.homeProdSwiper .videoColor .h1 {
	color: #fff;
}

.homeProdSwiper .videoColor .h2 {
	color: #fff;
}

.homeProdSwiper .videoColor .btn {
	color: #fff;
}

.homeProdSwiper .mask {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.3);
	transition: all 0.3s;
}

.homeProdSwiper .swiper-slide-active .mask {
	display: none;
}

.homeService .back {
	text-align: center;
	padding: 145px 0 165px;
	background-position: center center;
	background-size: cover;
}

.homeService .textBox {
	max-width: 1260px;
	margin: 0 auto;
	margin-bottom: 125px;
}

.homeService .h1 {
	font-size: 38px;
	color: #333333;
	line-height: 1;
	font-family: OPPOSans-B;
	margin-bottom: 20px;
}

.homeService .text {
	max-width: 730px;
	width: 100%;
	margin: 0 auto;
	font-size: 14px;
	color: #646464;
	line-height: 24px;
	margin-bottom: 15px;
	font-family: OPPOSans-R;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.homeService .btn {
	display: inline-block;
	font-size: 16px;
	color: #474645;
	line-height: 36px;
	padding-right: 14px;
	background-image: url(../images/icon12.png);
	background-repeat: no-repeat;
	background-position: right center;
	transition: all 0.5s;
	font-family: OPPOSans-L;
}

.homeService .btn:hover {
	text-decoration: underline;
}

.homeService .dataBox {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	padding: 50px 70px;
}

.w144 {
	max-width: 1440px;
	width: 100%;
	margin: 0 auto;
}

.homeService .topBox {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	font-size: 26px;
	color: #FFF;
	line-height: 1;
	font-family: OPPOSans-H; 
}

.homeService .number {
	font-size: 52px;
	line-height: 50px;
	margin-right: 5px;
	text-align: center;
	font-family: 'Arial', 'scnr_grotesklight', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
font-feature-settings: "liga" 0; font-weight:bold; padding-top:20px;
}

.homeService .number1 {
	width: 86px;
}

.homeService .number2 {
	width: 150px;
}

.homeService .number3 {
	width: 115px;
}

.homeService .number4 {
	width: 87px;
}
@media (max-width:1023px) {.homeService .column{ width:50%; padding-top: 30px;}}


@media (min-width: 1024px) and (max-width:1920px ) {.homeService .column{ width:25%;}}



.homeService .name {
	display: inline-block;
	font-size: 14px;
	color: #FFF;
	line-height: 26px;
	font-family: OPPOSans-R;
}

.homeShop {
	padding: 140px 0 118px;
}

.homeShop .listBox {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

.homeShop .column {
	width: 33.33%;
	text-align: center;
	padding: 0 10px;
	box-sizing: border-box;
}

.homeShop .icon {
	display: inline-block;
	font-size: 0;
}

.homeShop .name {
	font-size: 24px;
	color: #414349;
	line-height: 36px;
	margin-top: 20px;
	font-family: OPPOSans-B;
}

.homeShop .btn {

	display: inline-block;
	font-size: 16px;
	line-height: 36px;
	color: #474645;
	margin-top: 10px;
	padding-right: 11px;
	background-image: url(../images/icon12.png);
	background-repeat: no-repeat;
	background-position: right center;
	font-family: OPPOSans-L;
}

.homeShop .btn:hover {
	text-decoration: underline;
}

/* 媒体查询 */
/* header footer home */
@media only screen and (max-width: 1600px) {
	.brandUser .textBox {
		padding: 50px 20px 20px;
	}

	.brandUser .btn {
		margin-top: 0;
	}

	.homeProdSwiper .textBox {
		padding: 50px 20px 20px;
	}

	.homeProdSwiper .btn {
		margin-top: 0;
	}

	.homeBannerSwiper .textBox {
		top: 15%;
	}
}

@media only screen and (max-width: 1440px) {
	.header .navBox .item>a {
		font-weight: 600;
	}
}

@media only screen and (max-width: 1280px) {
	.w12 {
		width: 90%;
	}

	.header .navBox .dropDownList .img {
		width: 150px;
	}

	.header .navBox .dropDownList .nav {
		width: calc(100% - 150px);
	}

	.homeBannerSwiper .h1 {
		font-size: 24px;
		line-height: 30px;
	}

	.homeBannerSwiper .h2 {
		font-size: 18px;
		line-height: 30px;
	}

	.homeBannerSwiper .btn {
		line-height: 30px;
	}

	.brandUser {
		padding: 10px;
	}

	.brandUser a {
		width: calc(50% - 5px);
		margin-right: 10px;
	}

	.brandUser .textBox {
		padding: 30px 20px 20px;
	}

	.brandUser .h1 {
		font-size: 24px;
		line-height: 30px;
		margin-bottom: 5px;
	}

	.brandUser .h2 {
		font-size: 18px;
		line-height: 30px;
	}

	.brandUser .btn {
		line-height: 30px;
	}

	.homeProdSwiper {
		margin-bottom: 10px;
	}

	.homeProdSwiper .textBox {
		padding: 30px 20px 20px;
	}

	.homeProdSwiper .h1 {
		font-size: 24px;
		line-height: 30px;
		margin-bottom: 5px;
	}

	.homeProdSwiper .h2 {
		font-size: 18px;
		line-height: 30px;
	}

	.homeProdSwiper .btn {
		line-height: 30px;
	}

	.homeService .back {
		padding: 100px 0 120px;
	}

	.homeService .textBox {
		margin-bottom: 90px;
	}

	.homeService .h1 {
		font-size: 24px;
	}

	.homeService .btn {
		line-height: 30px;
	}

	.homeService .dataBox {
		padding: 0 20px;
	}

	.homeService .topBox {
		font-size: 18px;
	}

	.homeService .number {
		font-size: 30px;
		line-height: 40px;
	}

	.homeService .number1 {
		width: 62px;
	}

	.homeService .number2 {
		width: 72px;
	}

	.homeService .number3 {
		width: 41px;
	}

	.homeService .number4 {
		width: 82px;
	}

	.homeShop {
		padding: 100px 0 80px;
	}

	.homeShop .name {
		font-size: 18px;
		line-height: 30px;
	}

	.homeShop .btn {
		font-size: 14px;
		line-height: 30px;
	}
}

.w12 {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto; background:rgb(133,29,5,0.8); color:#FFF
}