@charset 'utf-8';
body.state-header header[role=global] {
  top: 0;
  margin-top: 0 !important;
  -webkit-transition: margin .45s, opacity .45s;
  -moz-transition: margin .45s, opacity .45s;
  -ms-transition: margin .45s, opacity .45s;
  -o-transition: margin .45s, opacity .45s;
  transition: margin .45s, opacity .45s;
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
  opacity: 1
}

header[role=global] {
  top: -99999px;
  -webkit-transition: margin .3s cubic-bezier(.55, .085, .68, .53), opacity .3s cubic-bezier(.55, .085, .68, .53);
  -moz-transition: margin .3s cubic-bezier(.55, .085, .68, .53), opacity .3s cubic-bezier(.55, .085, .68, .53);
  -ms-transition: margin .3s cubic-bezier(.55, .085, .68, .53), opacity .3s cubic-bezier(.55, .085, .68, .53);
  -o-transition: margin .3s cubic-bezier(.55, .085, .68, .53), opacity .3s cubic-bezier(.55, .085, .68, .53);
  transition: margin .3s cubic-bezier(.55, .085, .68, .53), opacity .3s cubic-bezier(.55, .085, .68, .53);
  -webkit-animation: fade-out-top .3s cubic-bezier(.55, .085, .68, .53);
  -moz-animation: fade-out-top .3s cubic-bezier(.55, .085, .68, .53);
  -ms-animation: fade-out-top .3s cubic-bezier(.55, .085, .68, .53);
  -o-animation: fade-out-top .3s cubic-bezier(.55, .085, .68, .53);
  animation: fade-out-top .3s cubic-bezier(.55, .085, .68, .53);
  opacity: 0
}

header[role=global].immediate {
  -webkit-transition-duration: 1ms !important;
  -moz-transition-duration: 1ms !important;
  -ms-transition-duration: 1ms !important;
  -o-transition-duration: 1ms !important;
  transition-duration: 1ms !important;
  -webkit-animation-duration: 1ms !important;
  -moz-animation-duration: 1ms !important;
  -ms-animation-duration: 1ms !important;
  -o-animation-duration: 1ms !important;
  animation-duration: 1ms !important
}

footer[role=global] > div:last-child a:last-of-type {
  display: none
}

[role=visual] {
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
}

[role=visual].state-ready img {
  opacity: 0
}

[role=visual] * {
  position: absolute;
  top: 0;
  left: 50%;
  height: 100%;
  -webkit-transform: translate3d(-50%, 0, 0);
  -moz-transform: translate3d(-50%, 0, 0);
  -ms-transform: translate3d(-50%, 0, 0);
  -o-transform: translate3d(-50%, 0, 0);
  transform: translate3d(-50%, 0, 0);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden
}

[role=visual] img {
  -webkit-transition: opacity .45s cubic-bezier(.47, 0, .745, .715);
  -moz-transition: opacity .45s cubic-bezier(.47, 0, .745, .715);
  -ms-transition: opacity .45s cubic-bezier(.47, 0, .745, .715);
  -o-transition: opacity .45s cubic-bezier(.47, 0, .745, .715);
  transition: opacity .45s cubic-bezier(.47, 0, .745, .715)
}

[role=background] {
  left: 0;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  -webkit-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -moz-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -ms-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -o-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 0
}

[role=background]:not([data-active='0']) > div img, [role=background]:not([data-active='0']) > div video {
  display: block
}

[role=background][data-active='1'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  opacity: 1
}

[role=background][data-active='2'] {
  opacity: 1
}

[role=background][data-active='2'] > img:nth-of-type(1) {
  opacity: 1
}

[role=background][data-active='3'] {
  opacity: 1
}

[role=background][data-active='3'] > img:nth-of-type(1), [role=background][data-active='3'] > img:nth-of-type(2) {
  opacity: 1
}

[role=background]:not(.pos-fixed):not(.pos-bottom) {
  position: absolute;
  top: 0;
  bottom: auto !important
}

[role=background].pos-fixed {
  position: fixed;
  top: 0;
  bottom: auto !important
}

[role=background] > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

[role=background] > div img, [role=background] > div video {
  position: absolute;
  top: 50%;
  left: 50%;
  display: none;
  height: 100%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  -moz-transform: translate3d(-50%, -50%, 0);
  -ms-transform: translate3d(-50%, -50%, 0);
  -o-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden
}

[role=background] > img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transition: opacity 10ms;
  -webkit-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -moz-transition: opacity 10ms;
  -moz-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -ms-transition: opacity 10ms;
  -ms-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -o-transition: opacity 10ms;
  -o-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  transition: opacity 10ms;
  transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -webkit-transform: translate3d(-50%, -50%, 0);
  -moz-transform: translate3d(-50%, -50%, 0);
  -ms-transform: translate3d(-50%, -50%, 0);
  -o-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  opacity: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden
}

#page {
  padding-top: 0
}

#page > header {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex
}

#page > header > div {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  width: 100%;
  min-height: 100vh;
  -webkit-box-align: center;
  -moz-box-align: center;
  -o-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -o-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center
}

#page > header > div h1 {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  color: #fff
}

#page > header > div > a {
  position: absolute
}

#page > header > div img {
  display: block;
  width: 100%
}

#page > header > div > div:nth-of-type(1) {
  width: 100%;
  white-space: nowrap
}

#page > header > div > div:nth-of-type(1) p {
  display: table;
  margin: 0 auto;
  color: #fff
}

#page > header > div > div:nth-of-type(1) ul {
  display: table;
  margin: 0 auto
}

#page > header > div > div:nth-of-type(1) ul:empty {
  display: none
}

#page > header > div > div:nth-of-type(2) > a {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  background-image: url(../../2019/common/images/icon_arrow_w.svg);
  background-repeat: no-repeat;
  -webkit-background-size: 100% auto;
  -moz-background-size: 100% auto;
  background-size: 100% auto
}

#lead {
  position: relative;
  z-index: 1;
  background: rgba(255, 255, 255, .85)
}

#lead h2 span {
  color: #ff4000
}

#plus1 {
  position: relative;
  z-index: 1;
  color: #fff;
  background: rgba(60, 40, 30, .9)
}

#plus1 h3 {
  line-height: 1
}

#plus1 h3:before {
  display: block;
  width: 232px;
  padding-top: 24px;
  content: '';
  background: url(../images/title_plus1.svg) no-repeat;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  background-size: 100% 100%
}

.products {
  position: relative;
  z-index: 1
}

.products h3 {
  text-align: center;
  color: #000
}

.products h3 strong {
  display: block;
  letter-spacing: .01em
}

.products p {
  letter-spacing: .02em;
  color: #000
}

.products ul {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -o-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -o-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between
}

.products ul li a {
  display: block
}

.products ul li a dl dd {
  position: relative
}

.products ul li a dl dd span {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%
}

.products ul li a dl dd span img {
  display: block
}

.products ul li a dl dd span img:nth-child(1) {
  width: 100%
}

.products ul li a dl dd span img:nth-child(1).state-ready + img {
  opacity: 0
}

.products ul li a dl dd span img:nth-child(1)[data-src] + img {
  -webkit-transition: opacity .3s;
  -moz-transition: opacity .3s;
  -ms-transition: opacity .3s;
  -o-transition: opacity .3s;
  transition: opacity .3s
}

.products ul li a dl dd span img:nth-child(2) {
  position: absolute
}

.products ul li a dl dt {
  text-align: center;
  color: #000
}

.products ul li a dl dt:after {
  display: block;
  content: '詳細ページへ >';
  color: #ff4000
}

#colors {
  position: relative;
  z-index: 1;
  overflow: hidden;
  height: 300vh
}

#colors section {
  overflow: hidden;
  width: 100%;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden
}

#colors section:not(.pos-fixed):not(.pos-bottom) {
  position: absolute;
  top: 0;
  bottom: auto !important
}

#colors section.pos-fixed {
  position: fixed;
  bottom: auto !important
}

#colors section.pos-bottom {
  position: absolute;
  bottom: 0
}

#colors section h3 {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  color: #fff
}

#colors section > div {
  position: relative;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
}

#colors section > div.state-standby h4 {
  -webkit-transform: translate3d(0, -25%, 0) scale(1.1);
  -moz-transform: translate3d(0, -25%, 0) scale(1.1);
  -ms-transform: translate3d(0, -25%, 0) scale(1.1);
  -o-transform: translate3d(0, -25%, 0) scale(1.1);
  transform: translate3d(0, -25%, 0) scale(1.1);
  opacity: 0
}

#colors section > div > img {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 0, 0);
  -moz-transform: translate(-50%, 0, 0);
  -ms-transform: translate(-50%, 0, 0);
  -o-transform: translate(-50%, 0, 0);
  transform: translate(-50%, 0, 0);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden
}

#colors section > div h4 {
  position: absolute;
  -webkit-transition: opacity .45s cubic-bezier(.47, 0, .745, .715), -webkit-transform .45s cubic-bezier(.39, .575, .565, 1);
  -moz-transition: opacity .45s cubic-bezier(.47, 0, .745, .715), -moz-transform .45s cubic-bezier(.39, .575, .565, 1);
  -ms-transition: opacity .45s cubic-bezier(.47, 0, .745, .715), -ms-transform .45s cubic-bezier(.39, .575, .565, 1);
  -o-transition: opacity .45s cubic-bezier(.47, 0, .745, .715), -o-transform .45s cubic-bezier(.39, .575, .565, 1);
  transition: opacity .45s cubic-bezier(.47, 0, .745, .715), transform .45s cubic-bezier(.39, .575, .565, 1);
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
}

#colors section > div h4 img {
  width: 100%
}

#colors section > div p {
  position: absolute;
  letter-spacing: .02em;
  color: #fff
}

#contents {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -o-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}

#contents > div:not([role=background]) {
  position: relative;
  width: 100%
}

#aw .products {
  background: rgba(255, 255, 255, .85)
}

#ss {
  position: relative;
  width: 100%
}

#ss .products {
  background: rgba(15, 20, 30, .7)
}

#ss .products h3 {
  color: #fff
}

#ss .products p {
  position: relative;
  color: #fff
}

#ss .products p:after {
  position: absolute;
  bottom: 0;
  left: 50%;
  content: '';
  -webkit-transform: translate3d(-50%, 0, 0);
  -moz-transform: translate3d(-50%, 0, 0);
  -ms-transform: translate3d(-50%, 0, 0);
  -o-transform: translate3d(-50%, 0, 0);
  transform: translate3d(-50%, 0, 0);
  background: url(../images/icon_products_colors.svg) no-repeat;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  background-size: 100% 100%
}

#ss .products ul li a dl dt {
  color: #fff
}

#ss .products ul li a dl dt:after {
  color: #d4bb92
}

#ensembles {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  width: 100%;
  -webkit-box-align: center;
  -moz-box-align: center;
  -o-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center
}

#ensembles > div {
  width: 100%;
  background: rgba(152, 117, 81, .8)
}

#ensembles > div div {
  color: #fff
}

#ensembles > div div h3 {
  line-height: 1
}

#ensembles > div div h3:before {
  display: block;
  width: 223px;
  padding-top: 18px;
  content: '';
  background: url(../../2019/images/title_ensembles.svg) no-repeat;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  background-size: 100% 100%
}

#ensembles > div > a {
  margin: 0 auto
}

#making {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  width: 100%;
  -webkit-box-align: center;
  -moz-box-align: center;
  -o-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center
}

#making > div {
  width: 100%;
  background: rgba(255, 255, 255, .8)
}

#making > div h3 {
  text-align: center
}

#making > div h4 strong {
  color: #ff4000
}

#showroom {
  position: relative;
  background: rgba(255, 255, 255, .8)
}

#showroom h3 {
  text-align: center
}

#showroom > div > dl dt {
  position: relative;
  display: table;
  letter-spacing: .02em
}

#showroom > div > dl dt:before {
  position: absolute;
  top: 0;
  right: 0;
  overflow: hidden;
  content: attr(data-index) '';
  -webkit-transform: translate(200%, 0);
  -moz-transform: translate(200%, 0);
  -ms-transform: translate(200%, 0);
  -o-transform: translate(200%, 0);
  transform: translate(200%, 0);
  text-align: center;
  background: url(../../2019/common/images/icon_frame.svg) no-repeat;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  background-size: 100% 100%
}

#showroom > div > dl dt strong {
  display: block
}

#showroom > div > dl dd {
  position: relative;
  padding-top: 55.56%
}

#showroom > div > dl dd:after {
  position: absolute;
  top: 0;
  right: 0;
  content: '';
  background: url(../../2019/common/images/icon_new.svg) no-repeat;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  background-size: 100% 100%
}

#showroom > div > dl dd img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

#curation > div > div {
  background: rgba(255, 255, 255, .8)
}

#curation > div > div h3 {
  text-align: center
}

#curation > div > div > dl dt > strong {
  display: block
}

#curation > div > div > dl dt > span {
  display: block
}

#curation > div > div > ul {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -o-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}

#curation > div > div > ul li a {
  display: block
}

#curation > div > div > ul li a dl dd {
  position: relative
}

#curation > div > div > ul li a dl dd img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

#select > div {
  background: rgba(255, 255, 255, .8)
}

#select > div > ul {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -o-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}

#select > div > ul li a {
  display: block
}

#select > div > ul li a dl dd {
  position: relative
}

#select > div > ul li a dl dd img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

#nabe {
  position: relative
}

#nabe > div {
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  -webkit-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -moz-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -ms-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -o-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 0
}

#nabe > div[data-active='1'] {
  opacity: 1
}

#nabe > div img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  -moz-transform: translate3d(-50%, -50%, 0);
  -ms-transform: translate3d(-50%, -50%, 0);
  -o-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden
}

#nabe section {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  width: 100%;
  -webkit-box-align: center;
  -moz-box-align: center;
  -o-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center
}

#nabe section > div {
  width: 100%;
  color: #f5f5f5;
  background: rgba(60, 40, 30, .85)
}

#nabe section > div h3 {
  text-align: center
}

#nabe section > div div h4 small {
  display: block;
  letter-spacing: .01em
}

#nabe section > div a {
  margin: 0 auto
}

#monitor {
  position: relative;
  height: 80vh;
  min-height: 500px;
  background-image: url("../../monitor/images/bg_1.jpg");
  background-size: cover;
  background-position: center center;
}

#monitor > div {
  background: rgba(255, 255, 255, .85);
  position: absolute;
  top: 50%;
  left: 0;
  overflow: hidden;
  width: 100%;
  height: auto;
  -webkit-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -moz-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -ms-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -o-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
  -webkit-transform: translate3d(0, -50%, 0);
  -moz-transform: translate3d(0, -50%, 0);
  -ms-transform: translate3d(0, -50%, 0);
  -o-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
}

#monitor > div img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  -moz-transform: translate3d(-50%, -50%, 0);
  -ms-transform: translate3d(-50%, -50%, 0);
  -o-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden
}

#monitor section {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  width: 90%;
  -webkit-box-align: center;
  -moz-box-align: center;
  -o-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  flex-wrap: wrap;
  max-width: 1000px;
  margin: 0 auto;
  padding: 80px 0;
}

#monitor section > div {
  width: 50%;
  color: #000000;
}

#monitor section > div.full {
  width: 100%;
  padding: 50px 0 20px;
}

#monitor section > div h3 {
  text-align: center
}

#monitor section div p {
  font-size: 15px;
}

#monitor section a.btn-primary {
  color: #000;
  border-color: #000;
}

#monitor section > div div h4 small {
  display: block;
  letter-spacing: .01em
}

#monitor section > div a {
  margin: 0 auto
}

@media all and (min-width: 641px) {
  header[role=global] {
    margin-top: -2.08em
  }

  [role=visual] {
    min-width: 1100px
  }

  [role=background] {
    min-width: 1100px
  }

  #page > header > div h1 {
    top: 38px;
    width: 428px
  }

  #page > header > div > a {
    top: 38px
  }

  #page > header > div > a:nth-of-type(1) {
    left: 50px;
    width: 76px
  }

  #page > header > div > a:nth-of-type(2) {
    right: 50px;
    width: 109px
  }

  #page > header > div > div:nth-of-type(1) {
    padding: 130px 0
  }

  #page > header > div > div:nth-of-type(1) p {
    font-size: 32px
  }

  #page > header > div > div:nth-of-type(1) ul {
    padding-top: 15px
  }

  #page > header > div > div:nth-of-type(1) ul li + li {
    margin-top: 25px
  }

  #page > header > div > div:nth-of-type(1) ul li a {
    padding-right: 23px;
    padding-left: 23px
  }

  #page > header > div > div:nth-of-type(2) {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
  }

  #page > header > div > div:nth-of-type(2) ul {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    padding-bottom: 75px;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -o-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center
  }

  #page > header > div > div:nth-of-type(2) ul li + li {
    margin-left: 2.05em
  }

  #page > header > div > div:nth-of-type(2) ul li a {
    font-size: 15px;
    color: #fff
  }

  #page > header > div > div:nth-of-type(2) > a {
    bottom: 22px;
    width: 27px;
    padding-top: 27px
  }

  #lead {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    padding: 77px 0;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -o-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -o-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center
  }

  #lead h2 {
    font-size: 45px;
    line-height: 1.56;
    width: 550px
  }

  #lead p {
    font-size: 15px;
    width: 450px;
    letter-spacing: .02em
  }

  #plus1 {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    padding: 70px 0;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -o-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -o-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -o-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center
  }

  #plus1 h3 {
    font-size: 24px;
    width: 550px
  }

  #plus1 h3:before {
    width: 9.67em;
    margin-bottom: 1em;
    padding-top: 1em
  }

  #plus1 p {
    font-size: 15px;
    width: 450px;
    letter-spacing: .02em
  }

  #carousel {
    width: 100%;
    margin-top: 70px;
    padding-top: 40.91%
  }

  #carousel > div > ul:nth-child(1) {
    width: 32.73%;
    margin-left: 0
  }

  .products {
    padding: 68px 0 70px
  }

  .products h3 {
    font-size: 19px;
    line-height: 2
  }

  .products h3 strong {
    font-size: 32px;
    line-height: 1
  }

  .products p {
    font-size: 15px;
    display: table;
    margin: 0 auto;
    padding-top: 10px
  }

  .products ul {
    width: 1020px;
    margin: 0 auto;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -o-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
  }

  .products ul li {
    width: 315px;
    margin-left: 37px
  }

  .products ul li:nth-child(3n+1) {
    margin-left: 0
  }

  .products ul li:nth-child(3) ~ li {
    padding-top: 53px
  }

  .products ul li a dl dd span img:nth-child(2) {
    top: -10px;
    right: 60px;
    width: 50px
  }

  .products ul li a dl dt {
    font-size: 15px;
    line-height: 2.13;
    padding-top: 5px
  }

  .products ul li a dl dt:after {
    font-size: 13px;
    line-height: 2.46
  }

  #ss {
    margin-top: -2.08em;
    padding-top: 2.07em
  }

  #ss .products p {
    padding-bottom: 210px
  }

  #ss .products p:after {
    width: 371px;
    padding-top: 183px
  }

  #ss .products ul {
    padding-top: 80px
  }

  #ss .products ul li dd {
    padding-bottom: 101.59%
  }

  #ss .products ul li:nth-child(3) ~ li dd {
    padding-bottom: 98.41%
  }

  #ss .products ul li:nth-child(6) ~ li dd {
    padding-bottom: 61.9%
  }

  #aw {
    margin-top: -2.08em;
    padding-top: 2.07em
  }

  #aw .products ul {
    padding-top: 40px
  }

  #aw .products ul li dd {
    padding-bottom: 101.59%
  }

  #aw .products ul li:nth-child(3) ~ li dd {
    padding-bottom: 98.41%
  }

  #aw .products ul li:nth-child(6) ~ li dd {
    padding-bottom: 87.3%
  }

  #aw .products ul li:nth-child(9) ~ li dd {
    padding-bottom: 77.14%
  }

  #colors section {
    min-width: 1100px;
    height: calc(100vh - 2.08em)
  }

  #colors section.pos-fixed {
    top: 2.08em
  }

  #colors section h3 {
    font-size: 19px;
    padding-top: 40px
  }

  #colors section > div h4 {
    top: 55px;
    right: 50px;
    width: 116px
  }

  #colors section > div p {
    font-size: 15px;
    right: 0;
    bottom: 40px;
    min-width: 480px
  }

  #contents > div:not([role=background]) {
    min-height: calc(100vh - 2.08em);
    padding: 13.18% 0 6.59%
  }

  #ensembles {
    min-height: calc(100vh - 2.08em);
    padding: 12.27% 0
  }

  #ensembles > div {
    padding: 80px 0
  }

  #ensembles > div div {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    padding-bottom: 65px;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -o-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -o-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -o-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center
  }

  #ensembles > div div h3 {
    font-size: 38px;
    width: 550px
  }

  #ensembles > div div h3:before {
    width: 5.87em;
    margin-bottom: .47em;
    padding-top: .47em
  }

  #ensembles > div div p {
    font-size: 15px;
    width: 450px;
    letter-spacing: .02em
  }

  #making {
    min-height: calc(100vh - 2.08em);
    padding: 6.59% 0 13.18%
  }

  #making > div {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    padding-top: 70px;
    padding-bottom: 50px;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -o-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -o-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center
  }

  #making > div h3 {
    font-size: 19px;
    width: 100%;
    padding-bottom: 57px
  }

  #making > div h4 {
    font-size: 38px;
    line-height: 1.71;
    width: 565px
  }

  #making > div p {
    font-size: 15px;
    width: 435px;
    letter-spacing: .02em
  }

  #making > div ul {
    width: 100%;
    padding-top: 56px
  }

  #making > div ul li + li {
    padding-top: 22px
  }

  #making > div ul li a {
    width: 180px;
    margin: 0 auto
  }

  #curation > div {
    margin-top: -2.08em;
    padding-top: 2.07em
  }

  #curation > div > div {
    padding: 68px 0 42px
  }

  #curation > div > div h3 {
    font-size: 19px
  }

  #curation > div > div > dl {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    width: 1000px;
    margin: 0 auto;
    padding: 42px 0 58px;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -o-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between
  }

  #curation > div > div > dl dt {
    width: 480px
  }

  #curation > div > div > dl dt > strong {
    font-size: 45px
  }

  #curation > div > div > dl dt > span {
    font-size: 17px;
    line-height: 1.94;
    padding-top: 8px
  }

  #curation > div > div > dl dt > span b {
    font-size: 21.5px;
    line-height: 1.53
  }

  #curation > div > div > dl dd {
    font-size: 15px;
    width: 480px;
    padding-top: 16px;
    letter-spacing: .02em
  }

  #curation > div > div h4 {
    font-size: 19px;
    width: 1000px;
    margin: 0 auto
  }

  #curation > div > div > ul {
    width: 1000px;
    margin: 0 auto;
    padding-top: 15px
  }

  #curation > div > div > ul li {
    width: 300px;
    margin-right: 50px
  }

  #curation > div > div > ul li:nth-child(3n) {
    margin-right: 0
  }

  #curation > div > div > ul li:nth-child(3n) ~ li {
    padding-top: 25px
  }

  #curation > div > div > ul li a dl dd {
    padding-top: 66.67%
  }

  #curation > div > div > ul li a dl dd img:nth-child(2) {
    display: none
  }

  #curation > div > div > ul li a dl dd img:nth-child(3) {
    top: 15px;
    left: 15px;
    width: 50px;
    height: auto
  }

  #curation > div > div > ul li a dl dt {
    font-size: 15px;
    line-height: 2.27;
    padding-top: 5px;
    white-space: nowrap
  }

  #select {
    padding-top: 4.55%
  }

  #select > div {
    padding: 42px 0 42px
  }

  #select > div h3 {
    font-size: 19px;
    width: 1000px;
    margin: 0 auto
  }

  #select > div p {
    font-size: 16px;
    width: 1000px;
    margin: 0 auto
  }

  #select > div > ul {
    width: 1000px;
    margin: 0 auto;
    padding-top: 28px
  }

  #select > div > ul li {
    width: 300px;
    margin-right: 50px
  }

  #select > div > ul li:nth-child(3n) {
    margin-right: 0
  }

  #select > div > ul li:nth-child(3n) ~ li {
    padding-top: 28px
  }

  #select > div > ul li a dl dd {
    padding-top: 66.67%
  }

  #select > div > ul li a dl dd img:nth-child(2) {
    display: none
  }

  #select > div > ul li a dl dd img:nth-child(3) {
    top: 15px;
    left: 15px;
    width: 50px;
    height: auto
  }

  #select > div > ul li a dl dt {
    font-size: 15px;
    line-height: 1.47;
    padding-top: 12px;
    white-space: nowrap
  }

  #showroom {
    padding: 70px 0 55px
  }

  #showroom h3 {
    font-size: 19px
  }

  #showroom > div {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    width: 1000px;
    margin: 0 auto;
    padding: 62px 0 39px;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -o-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between
  }

  #showroom > div > div {
    width: 500px
  }

  #showroom > div > div h4 {
    font-size: 24px;
    line-height: 1.67;
    padding-bottom: 21px
  }

  #showroom > div > div p {
    font-size: 14px;
    line-height: 2.14
  }

  #showroom > div > dl {
    width: 360px;
    margin-right: 70px;
    padding-top: 6px
  }

  #showroom > div > dl dt {
    font-size: 13px;
    line-height: 1.92;
    padding-bottom: 16px
  }

  #showroom > div > dl dt:before {
    width: 1.85em;
    height: 1.62em
  }

  #showroom > div > dl dt strong {
    font-size: 20px;
    line-height: 1.25
  }

  #showroom > div > dl dd:after {
    width: 61px;
    padding-top: 61px;
    -webkit-transform: translate(36px, -46px);
    -moz-transform: translate(36px, -46px);
    -ms-transform: translate(36px, -46px);
    -o-transform: translate(36px, -46px);
    transform: translate(36px, -46px)
  }

  #showroom > a {
    width: 150px;
    margin: 0 auto
  }

  #nabe > div {
    min-width: 1100px
  }

  #nabe section {
    min-height: calc(100vh - 2.08em);
    padding: 10.91% 0 10.91%
  }

  #nabe section > div {
    padding: 70px 0
  }

  #nabe section > div h3 {
    font-size: 19px;
    width: 100%
  }

  #nabe section > div > div {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    padding: 60px 0;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -o-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -o-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center
  }

  #nabe section > div > div h4 {
    font-size: 38px;
    line-height: 1.71;
    width: 550px;
    margin-top: -.11em
  }

  #nabe section > div > div h4 small {
    font-size: 24px;
    line-height: 1.96;
    margin-left: .17em;
    letter-spacing: .01em
  }

  #nabe section > div > div p {
    font-size: 15px;
    line-height: 2;
    width: 450px;
    letter-spacing: .02em
  }

  .ua-desktop body.state-anim [role=visual] {
    -webkit-transition: opacity .75s cubic-bezier(.47, 0, .745, .715);
    -moz-transition: opacity .75s cubic-bezier(.47, 0, .745, .715);
    -ms-transition: opacity .75s cubic-bezier(.47, 0, .745, .715);
    -o-transition: opacity .75s cubic-bezier(.47, 0, .745, .715);
    transition: opacity .75s cubic-bezier(.47, 0, .745, .715)
  }

  .ua-desktop body.state-anim #page > header > div h1 {
    -webkit-transition: -webkit-transform .6s cubic-bezier(.445, .05, .55, .95), top .6s cubic-bezier(.445, .05, .55, .95);
    -moz-transition: -moz-transform .6s cubic-bezier(.445, .05, .55, .95), top .6s cubic-bezier(.445, .05, .55, .95);
    -ms-transition: -ms-transform .6s cubic-bezier(.445, .05, .55, .95), top .6s cubic-bezier(.445, .05, .55, .95);
    -o-transition: -o-transform .6s cubic-bezier(.445, .05, .55, .95), top .6s cubic-bezier(.445, .05, .55, .95);
    transition: transform .6s cubic-bezier(.445, .05, .55, .95), top .6s cubic-bezier(.445, .05, .55, .95)
  }

  .ua-desktop body.state-anim #page > header > div > a {
    -webkit-transition: -webkit-transform .75s cubic-bezier(.39, .575, .565, 1), top .75s cubic-bezier(.39, .575, .565, 1), left .6s cubic-bezier(.39, .575, .565, 1) .15s, right .6s cubic-bezier(.39, .575, .565, 1) .15s, opacity .4s cubic-bezier(.39, .575, .565, 1) .35s;
    -moz-transition: -moz-transform .75s cubic-bezier(.39, .575, .565, 1), top .75s cubic-bezier(.39, .575, .565, 1), left .6s cubic-bezier(.39, .575, .565, 1) .15s, right .6s cubic-bezier(.39, .575, .565, 1) .15s, opacity .4s cubic-bezier(.39, .575, .565, 1) .35s;
    -ms-transition: -ms-transform .75s cubic-bezier(.39, .575, .565, 1), top .75s cubic-bezier(.39, .575, .565, 1), left .6s cubic-bezier(.39, .575, .565, 1) .15s, right .6s cubic-bezier(.39, .575, .565, 1) .15s, opacity .4s cubic-bezier(.39, .575, .565, 1) .35s;
    -o-transition: -o-transform .75s cubic-bezier(.39, .575, .565, 1), top .75s cubic-bezier(.39, .575, .565, 1), left .6s cubic-bezier(.39, .575, .565, 1) .15s, right .6s cubic-bezier(.39, .575, .565, 1) .15s, opacity .4s cubic-bezier(.39, .575, .565, 1) .35s;
    transition: transform .75s cubic-bezier(.39, .575, .565, 1), top .75s cubic-bezier(.39, .575, .565, 1), left .6s cubic-bezier(.39, .575, .565, 1) .15s, right .6s cubic-bezier(.39, .575, .565, 1) .15s, opacity .4s cubic-bezier(.39, .575, .565, 1) .35s
  }

  .ua-desktop body.state-anim #page > header > div > div:nth-of-type(1) {
    -webkit-transition: opacity .45s cubic-bezier(.47, 0, .745, .715) .75s;
    -moz-transition: opacity .45s cubic-bezier(.47, 0, .745, .715) .75s;
    -ms-transition: opacity .45s cubic-bezier(.47, 0, .745, .715) .75s;
    -o-transition: opacity .45s cubic-bezier(.47, 0, .745, .715) .75s;
    transition: opacity .45s cubic-bezier(.47, 0, .745, .715) .75s
  }

  .ua-desktop body.state-anim #page > header > div > div:nth-of-type(1).state-standby {
    opacity: 0
  }

  .ua-desktop body.state-anim #page > header > div > div:nth-of-type(2) {
    -webkit-transition: opacity .6s cubic-bezier(.39, .575, .565, 1);
    -moz-transition: opacity .6s cubic-bezier(.39, .575, .565, 1);
    -ms-transition: opacity .6s cubic-bezier(.39, .575, .565, 1);
    -o-transition: opacity .6s cubic-bezier(.39, .575, .565, 1);
    transition: opacity .6s cubic-bezier(.39, .575, .565, 1)
  }

  .ua-desktop body.state-standby [role=visual] {
    opacity: 0
  }

  .ua-desktop body.state-standby #page > header > div h1 {
    top: 40%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
  }

  .ua-desktop body.state-standby #page > header > div > a {
    z-index: -1;
    top: 30%;
    opacity: 0
  }

  .ua-desktop body.state-standby #page > header > div > a:nth-of-type(1) {
    left: 15%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
  }

  .ua-desktop body.state-standby #page > header > div > a:nth-of-type(2) {
    right: 15%;
    -webkit-transform: translate(50%, -50%);
    -moz-transform: translate(50%, -50%);
    -ms-transform: translate(50%, -50%);
    -o-transform: translate(50%, -50%);
    transform: translate(50%, -50%)
  }

  .ua-desktop body.state-standby #page > header > div > div {
    z-index: -1
  }

  .ua-desktop body.state-standby #page > header > div > div:nth-of-type(1) {
    opacity: 0
  }

  .ua-desktop body.state-standby #page > header > div > div:nth-of-type(2) {
    opacity: 0
  }

  .ua-desktop [role=visual] img {
    display: none
  }

  .ua-desktop [role=background] > div img {
    display: none !important
  }

  .ua-mobile [role=visual] img {
    display: block
  }
}

@media screen and (max-width: 640px) {
  header[role=global] {
    margin-top: -3.75em
  }

  [role=visual] img {
    display: block
  }

  [role=visual] video {
    display: none
  }

  [role=background] > div video {
    display: none !important
  }

  #page > header > div h1 {
    top: 0;
    width: 73.44%;
    padding-top: 11.72%
  }

  #page > header > div > a {
    top: 0
  }

  #page > header > div > a:nth-of-type(1) {
    left: 4.69%;
    width: 10.63%;
    padding-top: 4.69%
  }

  #page > header > div > a:nth-of-type(2) {
    right: 4.69%;
    width: 15.47%;
    padding-top: 4.69%
  }

  #page > header > div > div:nth-of-type(1) {
    padding: 28.13% 0
  }

  #page > header > div > div:nth-of-type(1) p {
    font-size: 141.67%;
    padding: 0 6.25%
  }

  #page > header > div > div:nth-of-type(1) ul {
    padding-top: 1.25em
  }

  #page > header > div > div:nth-of-type(1) ul li + li {
    padding-top: 2.08em
  }

  #page > header > div > div:nth-of-type(1) ul li a {
    padding-right: 1.35em;
    padding-left: 1.35em
  }

  #page > header > div > div:nth-of-type(2) ul {
    display: none
  }

  #page > header > div > div:nth-of-type(2) > a {
    bottom: 0;
    width: 7.81%;
    padding-top: 14.84%
  }

  #lead {
    padding: 12.5% 0 8.59%
  }

  #lead h2 {
    font-size: 291.67%;
    line-height: 1.55;
    padding: 0 0 10.63% 6.25%;
    letter-spacing: .02em
  }

  #lead p {
    font-size: 104.17%;
    padding: 0 6.25%
  }

  #plus1 {
    padding: 10.16% 0
  }

  #plus1 h3 {
    font-size: 1.38em;
    padding: 0 6.25%
  }

  #plus1 h3:before {
    width: 10.55em;
    margin-bottom: 1.09em;
    padding-top: 1.09em
  }

  #plus1 p {
    font-size: 104.17%;
    padding: 6.25%
  }

  #carousel {
    padding-top: 48.44%
  }

  #carousel > div > ul:nth-child(1) {
    width: 38.75%;
    margin-left: 0
  }

  .products {
    padding: 6.25% 3.91% 7.03%
  }

  .products h3 {
    font-size: 112.5%;
    line-height: 2
  }

  .products h3 strong {
    font-size: 166.67%;
    line-height: 1
  }

  .products p {
    font-size: 104.17%;
    padding: 4.24% 2.54% 0
  }

  .products ul li {
    width: 47.97%
  }

  .products ul li:nth-child(2) ~ li {
    padding-top: 8.47%
  }

  .products ul li a dl dd span img:nth-child(2) {
    top: -4.76%;
    right: 7.14%;
    width: 26.5%
  }

  .products ul li a dl dt {
    font-size: 87.5%;
    line-height: 2.19;
    padding-top: 2.47%
  }

  .products ul li a dl dt:after {
    font-size: 90.48%;
    line-height: 2.42
  }

  #ss {
    margin-top: -3.75em;
    padding-top: 3.74em
  }

  #ss .products p {
    padding-bottom: 52.54%
  }

  #ss .products p:after {
    width: 88.39%;
    padding-top: 44.11%
  }

  #ss .products ul {
    padding-top: 14%
  }

  #ss .products ul li dd {
    padding-bottom: 101.59%
  }

  #ss .products ul li:nth-child(2) ~ li dd {
    padding-bottom: 78.1%
  }

  #ss .products ul li:nth-child(4) ~ li dd {
    padding-bottom: 98.41%
  }

  #ss .products ul li:nth-child(6) ~ li dd {
    padding-bottom: 61.9%
  }

  #aw {
    margin-top: -3.75em;
    padding-top: 3.74em
  }

  #aw .products ul {
    padding-top: 7%
  }

  #aw .products ul li dd {
    padding-bottom: 101.59%
  }

  #aw .products ul li:nth-child(2) ~ li dd {
    padding-bottom: 74.6%
  }

  #aw .products ul li:nth-child(4) ~ li dd {
    padding-bottom: 98.41%
  }

  #aw .products ul li:nth-child(6) ~ li dd {
    padding-bottom: 87.3%
  }

  #aw .products ul li:nth-child(8) ~ li dd {
    padding-bottom: 77.14%
  }

  #aw .products ul li:nth-child(10) ~ li dd {
    padding-bottom: 49.52%
  }

  #colors section {
    height: calc(100vh - 3.75em)
  }

  #colors section.pos-fixed {
    top: 3.75em
  }

  #colors section h3 {
    font-size: 112.5%;
    padding-top: 6.25%
  }

  #colors section > div h4 {
    top: 4.58em;
    right: 7.03%;
    width: 5.63em
  }

  #colors section > div p {
    font-size: 104.17%;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0 6.25% 14.06%
  }

  #contents > div:not([role=background]) {
    min-height: calc(100vh - 3.75em);
    padding: 19.53% 0 9.77%
  }

  #ensembles > div {
    padding: 8.59% 0 10.16%
  }

  #ensembles > div div h3 {
    font-size: 2.46em;
    padding: 0 6.25%
  }

  #ensembles > div div h3:before {
    width: 5.88em;
    margin-bottom: .54em;
    padding-top: .46em
  }

  #ensembles > div div p {
    font-size: 104.17%;
    padding: 6.25% 6.25% 7.81%
  }

  #making {
    min-height: calc(100vh - 3.75em);
    padding: 9.77% 0 19.53%
  }

  #making > div {
    padding: 6.25% 6.25% 8.59%
  }

  #making > div h3 {
    font-size: 112.5%;
    padding-bottom: 3.57%
  }

  #making > div h4 {
    font-size: 179.17%;
    line-height: 1.86;
    display: table;
    margin: 0 auto
  }

  #making > div p {
    font-size: 104.17%;
    padding-top: 4.46%
  }

  #making > div ul {
    padding-top: 10.71%
  }

  #making > div ul li + li {
    padding-top: 11.61%
  }

  #making > div ul li a {
    width: 10.59em
  }

  #curation > div {
    margin-top: -3.75em;
    padding-top: 3.74em
  }

  #curation > div > div {
    padding: 6.25%
  }

  #curation > div > div h3 {
    font-size: 104.17%
  }

  #curation > div > div > dl {
    padding: 4.46% 0 10.71%
  }

  #curation > div > div > dl dt {
    text-align: center
  }

  #curation > div > div > dl dt > strong {
    font-size: 129.17%
  }

  #curation > div > div > dl dt > span {
    font-size: 91.67%;
    line-height: 1.82;
    padding-top: .89%;
    letter-spacing: 0
  }

  #curation > div > div > dl dt > span b {
    font-size: 113.64%;
    line-height: 1.6
  }

  #curation > div > div > dl dd {
    font-size: 91.67%;
    line-height: 1.82;
    padding-top: 9.82%;
    letter-spacing: .02em
  }

  #curation > div > div h4 {
    line-height: 1.67
  }

  #curation > div > div > ul {
    padding-top: 3.57%;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -o-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between
  }

  #curation > div > div > ul li {
    width: 46.43%
  }

  #curation > div > div > ul li:nth-child(2n) ~ li {
    padding-top: 9.82%
  }

  #curation > div > div > ul li a dl dd {
    padding-top: 140%
  }

  #curation > div > div > ul li a dl dd img:nth-child(1) {
    display: none
  }

  #curation > div > div > ul li a dl dd img:nth-child(3) {
    top: 4.12%;
    left: 5.77%;
    width: 28.85%;
    height: auto
  }

  #curation > div > div > ul li a dl dt {
    font-size: 87.5%;
    line-height: 1.67;
    margin-right: -1em;
    padding-top: 5.77%
  }

  #select {
    padding-top: 8.59%
  }

  #select > div {
    padding: 7.03% 6.25% 6.25%
  }

  #select > div h3 {
    line-height: 1.67
  }

  #select > div p {
    line-height: 1.67
  }

  #select > div > ul {
    padding-top: 7.14%;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -o-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between
  }

  #select > div > ul li {
    width: 46.43%
  }

  #select > div > ul li:nth-child(2n) ~ li {
    padding-top: 2.68%
  }

  #select > div > ul li a dl dd {
    padding-top: 140%
  }

  #select > div > ul li a dl dd img:nth-child(1) {
    display: none
  }

  #select > div > ul li a dl dd img:nth-child(3) {
    top: 4.12%;
    left: 5.77%;
    width: 28.85%;
    height: auto
  }

  #select > div > ul li a dl dt {
    font-size: 87.5%;
    line-height: 1.67;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    min-height: 3.33em;
    margin-right: -1em;
    padding-top: 5.77%
  }

  #showroom {
    padding: 6.25% 6.25% 8.59%
  }

  #showroom h3 {
    font-size: 112.5%
  }

  #showroom > div {
    padding-top: 4.46%
  }

  #showroom > div > div h4 {
    font-size: 125%;
    padding-bottom: 3.57%
  }

  #showroom > div > div p {
    font-size: 104.17%
  }

  #showroom > div > dl {
    padding: 13.39% 0 9.82%
  }

  #showroom > div > dl dt {
    font-size: 83.33%;
    padding-bottom: 4.46%
  }

  #showroom > div > dl dt:before {
    width: 1.9em;
    height: 1.6em
  }

  #showroom > div > dl dt strong {
    font-size: 155%;
    line-height: 1.29
  }

  #showroom > div > dl dd:after {
    width: 17.14%;
    padding-top: 17.14%;
    -webkit-transform: translate(16.67%, -73.96%);
    -moz-transform: translate(16.67%, -73.96%);
    -ms-transform: translate(16.67%, -73.96%);
    -o-transform: translate(16.67%, -73.96%);
    transform: translate(16.67%, -73.96%)
  }

  #showroom > a {
    width: 10.59em
  }

  #nabe section {
    min-height: calc(100vh - 3.75em);
    padding: 18.75% 0 18.75%
  }

  #nabe section > div {
    padding: 6.25% 6.25% 10.16%
  }

  #nabe section > div h3 {
    font-size: 112.5%
  }

  #nabe section > div div {
    padding: 2.68% 0 8.04%
  }

  #nabe section > div div h4 {
    font-size: 245.83%;
    line-height: 1.71
  }

  #nabe section > div div h4 small {
    font-size: 55.93%;
    line-height: 1.97;
    margin-left: .12em
  }

  #nabe section > div div p {
    font-size: 104.17%;
    padding-top: 5.36%
  }

  #monitor {
    position: relative;
    height: 80vh;
    min-height: 80vh;
    background-image: url("/monitor/images/bg_1_sp.jpg");
    background-size: cover;
    background-position: center center;
  }

  #monitor > div {
    background: rgba(255, 255, 255, .85);
    position: absolute;
    top: 50%;
    left: 0;
    overflow: hidden;
    width: 100%;
    height: auto;
    -webkit-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
    -moz-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
    -ms-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
    -o-transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
    transition: opacity .45s cubic-bezier(.39, .575, .565, 1) .15s;
    -webkit-transform: translate3d(0, -50%, 0);
    -moz-transform: translate3d(0, -50%, 0);
    -ms-transform: translate3d(0, -50%, 0);
    -o-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
  }

  #monitor > div img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate3d(-50%, -50%, 0);
    -o-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden
  }

  #monitor section {
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    width: 90%;
    -webkit-box-align: center;
    -moz-box-align: center;
    -o-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    max-width: 1000px;
    margin: 0 auto;
    padding: 40px 0;
    flex-direction: column;
  }

  #monitor section > div {
    width: 100%;
    color: #000000;
  }

  #monitor section > div.full {
    width: 100%;
    padding: 30px 0 10px;
  }

  #monitor section > div h3 {
    text-align: center
  }

  #monitor section div p {
    font-size: 15px;
  }

  #monitor section a.btn-primary {
    color: #000;
    border-color: #000;
  }

  #monitor section > div h4 {
    font-size: 27px;
    line-height: 1.7;
    margin-bottom: 1em;
  }

  #monitor section > div div h4 small {
    display: block;
    letter-spacing: .01em
  }

  #monitor section > div a {
    margin: 0 auto
  }
}