@charset "UTF-8";
/* ======================================================================================
    Reset
====================================================================================== */
html {
  font-size: 62.5%;
}

main div, main span, main applet, main object, main iframe,
main h1, main h2, main h3, main h4, main h5, main h6, main p, main blockquote, main pre,
main a, main abbr, main acronym, main address, main big, main cite, main code,
main del, main dfn, main em, main img, main ins, main kbd, main q, main s, main samp,
main small, main strike, main strong, main sub, main sup, main tt, main var,
main b, main u, main i, main center,
main dl, main dt, main dd, main ol, main ul, main li,
main fieldset, main form, main label, main legend,
main table, main caption, main tbody, main tfoot, main thead, main tr, main th, main td,
main article, main aside, main canvas, main details, main embed,
main figure, main figcaption, main footer, main header, main hgroup,
main menu, main nav, main output, main ruby, main section, main summary,
main time, main mark, main audio, main video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  box-sizing: border-box;
}
main ol, main ul {
  list-style-type: none;
}
main table {
  border-collapse: collapse;
  border-spacing: 0;
}
main caption, main th, main td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}
main q, main blockquote {
  quotes: none;
}
main q:before, main q:after, main blockquote:before, main blockquote:after {
  content: "";
  content: none;
}
main button {
  background: none;
  border: none;
}
main a {
  text-decoration: none;
}
main a img {
  border: none;
}
main img {
  vertical-align: bottom;
  font-size: 0;
  line-height: 0;
}
main article, main aside, main details, main figcaption, main figure, main footer, main header, main hgroup, main main, main menu, main nav, main section, main summary {
  display: block;
}

/* ======================================================================================
    ORIGINAL RUG style css
    	- Base
    	- Layout
    		- common
    		- top
====================================================================================== */
/* ======================================================================================
	Base
====================================================================================== */
main {
  font-size: 1.6rem;
}
main a {
  color: #282828;
}
main a:hover {
  opacity: 0.6;
}
main img {
  max-width: 100%;
  height: auto;
}
main p {
  font-size: 1.6rem;
  line-height: 2em;
}

#page-top {
  z-index: 100;
}

/* ======================================================================================
	Layout
====================================================================================== */
main {
  /* ----------------------------------------
  	common parts
  ---------------------------------------- */
  /* ----------------------------------------
     	top
  ---------------------------------------- */
  /* ----------------------------------------
     	comfortable
  ---------------------------------------- */
  /* ----------------------------------------
     	clean
  ---------------------------------------- */
  /* ----------------------------------------
     	appeal
  ---------------------------------------- */
  /* ----------------------------------------
     	faq
  ---------------------------------------- */
}
main > section, main > aside {
  margin-bottom: 7em;
  padding-top: 3em;
}
main > section::after, main > aside::after {
  content: "";
  display: block;
  clear: both;
}
main > section > section, main > aside > section {
  margin-bottom: 2em;
}
main #lpNav {
  background: linear-gradient(to bottom, #00769F 30%, #00506c 100%);
}
main #lpNav ul {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  max-width: 1200px;
  margin: auto;
  align-items: center;
}
main #lpNav ul::after {
  content: "";
  display: block;
  clear: both;
}
main #lpNav ul li {
  justify-content: space-between;
  flex-grow: 1;
  padding: 1.5rem 0;
  text-align: center;
}
main #lpNav ul li a {
  display: block;
  line-height: 0;
  height: 100%;
  padding: 0 2rem;
  border-right: 1px #fff solid;
}
main header#title {
  text-align: center;
}
main header#title h2 {
  padding: 6rem 0 2rem;
}
main header#title p {
  font-size: 2rem;
}
main .billboard {
  position: relative;
  margin-bottom: 5rem;
  background-color: #EDEDED;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: auto 100%;
  text-align: center;
}
main .billboard figure {
  position: absolute;
  bottom: 5rem;
  width: 100%;
  text-align: center;
}
main .right {
  float: right;
  margin-left: 2rem;
}
main .link {
  text-align: center;
}
main .link ul li {
  margin-bottom: 12rem;
}
main .link ul li a {
  display: inline-block;
  box-shadow: 0 3px 5px 0 rgba(40, 40, 40, 0.5);
}
main#rugTop header {
  position: relative;
  background: #EDEDED url(../images/top/bg_header.png) left bottom repeat-x;
  margin-top: 5rem;
  padding-top: 3rem;
}
main#rugTop header h2 {
  width: 100%;
  max-width: 1200px;
  margin: auto;
  position: relative;
  z-index: 2;
}
main#rugTop header h2::after {
  content: "";
  display: block;
  clear: both;
}
main#rugTop header h2 img {
  position: absolute;
  right: 5%;
  top: -105px;
}
main#rugTop header .billboard {
  position: relative;
  border-top: 0.5rem #00769F solid;
  padding-top: 1rem;
  margin-bottom: 0;
  overflow: hidden;
  width: 100%;
}
main#rugTop header .billboard .slider {
  display: none;
  width: 1200px;
  margin: 0 auto;
}
main#rugTop header .billboard .slider.slick-initialized {
  display: block;
}
main#rugTop header .billboard .slider .slick-list {
  overflow: visible !important;
}
main#rugTop header .billboard .slider .slick-list img {
  width: 1200px;
}
main#rugTop header .billboard .slider .slick-dots {
  left: 0;
  bottom: 0.5em;
  width: 100%;
  z-index: 3;
  text-align: center;
}
main#rugTop header .billboard .slider .slick-dots li button::before {
  font-family: "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, Arial, Verdana, sans-serif;
  font-size: 4rem;
  opacity: 1;
  color: #00769F;
}
main#rugTop header .billboard .slider .slick-dots li.slick-active button::before {
  color: #fff;
}
main#rugTop header .logo {
  width: 100%;
  max-width: 1200px;
  margin: auto;
  margin-top: 2rem;
  padding-right: 3%;
  text-align: right;
}
main#rugTop header .logo::after {
  content: "";
  display: block;
  clear: both;
}
main#rugTop #intro {
  text-align: center;
}
main#rugTop #intro p.lead {
  margin-bottom: 6rem;
  font-size: 2rem;
}
main#rugTop #intro nav a {
  display: inline-block;
  box-shadow: 0 0 5px 0 rgba(40, 40, 40, 0.5);
}
main#rugTop #intro nav ul {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  justify-content: center;
  background-color: #EDEDED;
  margin-bottom: 10rem;
}
main#rugTop #intro nav ul li {
  position: relative;
  bottom: -3rem;
}
main#rugTop #intro nav ul li:not(:last-child) {
  margin-right: 2%;
}
main#rugTop #intro nav p {
  background-color: #EDEDED;
  text-align: center;
}
main#rugTop #intro nav p a {
  display: inline-block;
  position: relative;
  bottom: -3rem;
}
main#rugComfor #solution dl {
  width: 100%;
  max-width: 960px;
  margin: auto;
}
main#rugComfor #solution dl::after {
  content: "";
  display: block;
  clear: both;
}
main#rugComfor #solution dl dt, main#rugComfor #solution dl dd {
  position: relative;
  padding: 1.5em 2em;
  border: 2px #00769F solid;
  border-radius: 1em;
}
main#rugComfor #solution dl dt {
  z-index: 2;
  width: 75%;
  margin-top: 3rem;
  text-align: center;
  background-color: #fff;
  font-weight: bold;
  font-size: 2rem;
  color: #00769F;
}
main#rugComfor #solution dl dt:hover {
  opacity: 1;
}
main#rugComfor #solution dl dt span::after {
  content: "▼";
  margin-left: 0.5em;
}
main#rugComfor #solution dl dt span:hover {
  opacity: 0.7;
}
main#rugComfor #solution dl dd {
  margin-left: 15%;
  top: -3rem;
  background-color: #EDEDED;
  padding-top: 5rem;
}
main#rugComfor #comfortable #floor h4 {
  text-align: center;
  font-weight: bold;
  font-size: 2rem;
  color: #00769F;
}
main#rugComfor #comfortable #floor h4 span {
  display: inline-block;
  padding: 0 2em 0.5em;
  border-bottom: 1px #00769F solid;
}
main#rugComfor #comfortable #floor #floormap {
  position: relative;
  width: 970px;
  margin: 2rem auto;
  text-align: center;
}
main#rugComfor #comfortable #floor #floormap ul li {
  position: absolute;
  height: auto;
}
main#rugComfor #comfortable #floor #floormap ul li.flrLiving {
  top: 0;
  left: 3.4%;
  width: 14.4%;
}
main#rugComfor #comfortable #floor #floormap ul li.flrPlayspace {
  top: 11.8%;
  left: 27.7%;
  width: 16.1%;
}
main#rugComfor #comfortable #floor #floormap ul li.flrBedroom {
  top: 35.5%;
  left: 37.4%;
  width: 13.1%;
}
main#rugComfor #comfortable #floor #floormap ul li.flrWIC {
  top: 0;
  left: 61.9%;
  width: 22.7%;
}
main#rugComfor #comfortable #floor #floormap ul li.flrChild {
  top: 20.8%;
  left: 79.3%;
  width: 16.8%;
}
main#rugComfor #comfortable #floor #floormap ul li.flrDining {
  top: 51.2%;
  left: 16.7%;
  width: 16.8%;
}
main#rugComfor #comfortable #floor #floormap ul li.flrPantry {
  top: 80.5%;
  left: 35.6%;
  width: 16.7%;
}
main#rugComfor #comfortable #floor #floormap ul li.flrShoes {
  top: 53.8%;
  left: 60.9%;
  width: 19.7%;
}
main#rugComfor #comfortable #floor #floormap ul li.flrEntrance {
  top: 57.6%;
  left: 82.7%;
  width: 16.8%;
}
main#rugComfor #comfortable #floor #floormapDetail li {
  display: none;
}
.fancybox-container .fancybox-bg {
  background-color: rgba(0, 0, 0, 0.9);
}
.fancybox-container .floormapDetail {
  border-radius: 2rem;
}
.fancybox-container .floormapDetail h5, .fancybox-container .floormapDetail ul {
  min-width: 35rem;
  border: 2px #00769F solid;
}
.fancybox-container .floormapDetail h5 {
  padding: 0.5em 0;
  border-radius: 2rem 2rem 0 0;
  background-color: #00769F;
  text-align: center;
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 1em;
  color: #fff;
}
.fancybox-container .floormapDetail ul {
  padding: 1em;
  border-radius: 0 0 2rem 2rem;
}
.fancybox-container .floormapDetail ul li {
  margin-bottom: 0.25em;
  text-align: center;
  color: #00769F;
}
.fancybox-container .floormapDetail ul li:last-of-type {
  margin-bottom: 0;
}

main#rugComfor #comfortable #function {
  width: 100%;
  max-width: 960px;
  margin: auto;
}
main#rugComfor #comfortable #function::after {
  content: "";
  display: block;
  clear: both;
}
main#rugComfor #comfortable #function li {
  padding: 3em 10%;
  background-color: #EDEDED;
  margin-bottom: 6rem;
}
main#rugComfor #comfortable #function li h5 {
  color: #00769F;
  margin-bottom: 1em;
  font-size: 2.4rem;
  text-align: center;
}
main#rugClean #clean ul#cleaning {
  width: 100%;
  max-width: 960px;
  margin: auto;
}
main#rugClean #clean ul#cleaning::after {
  content: "";
  display: block;
  clear: both;
}
main#rugClean #clean ul#cleaning li {
  display: flex;
  width: 100%;
}
main#rugClean #clean ul#cleaning li .photo {
  width: 50%;
  margin-right: 5%;
}
main#rugClean #clean ul#cleaning li .ttl {
  font-size: 2.5rem;
  color: #00769F;
  line-height: 1.4em;
  margin-bottom: 0.5em;
}
main#rugClean #clean ul#cleaning li .txt {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-between;
  width: 45%;
}
main#rugClean #clean ul#cleaning li .txt .ex-btn {
  margin-top: 0.5em;
}
main#rugClean #clean ul#cleaning li .btn-area {
  margin: 0 auto;
}
main ul.inner {
  display: flex;
}
main ul.inner li {
  width: 50%;
  margin-bottom: 0 !important;
}
main ul.inner li:not(:last-child) {
  margin-right: 2%;
}
main ul.btn-area {
  display: flex;
  background-color: #f0f0e4;
}
main ul.btn-area li {
  margin-bottom: 0 !important;
}
main ul.btn-area li:first-child {
  margin-left: 2em;
}
main ul.btn-area li:not(:last-child) {
  margin-right: 2%;
}
main#rugAppeal .ttl {
  font-size: 2rem;
  color: #00769F;
}
main#rugAppeal .ttlgry {
  width: 110%;
  padding: 0.5em 1em;
  margin-bottom: 1.5em;
  background-color: #EDEDED;
}
main#rugAppeal #kodawari {
  margin-bottom: 15rem;
}
main#rugAppeal #kodawari #outline {
  margin: 0 auto 5rem;
  padding: 7rem 0 5rem;
  background: #464646 url(../images/appeal/bg_kodawari.jpg) center center/cover no-repeat;
  color: #fff;
}
main#rugAppeal #kodawari #outline::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #kodawari #outline h3 {
  text-align: center;
}
main#rugAppeal #kodawari #outline .lead {
  margin: 3rem 0 8rem;
  text-align: center;
  font-size: 2rem;
}
main#rugAppeal #kodawari #outline .detail {
  width: 100%;
  max-width: 960px;
  margin: auto;
}
main#rugAppeal #kodawari #outline .detail::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #kodawari #outline .detail .movie {
  float: right;
  width: 40%;
  margin-left: 6%;
  margin-bottom: 4rem;
  text-align: right;
}
main#rugAppeal #kodawari #outline .detail .text {
  width: 54%;
  margin: 2rem 0 4rem;
}
main#rugAppeal #kodawari #outline .detail .tango {
  clear: both;
  padding: 1rem;
  border: 1px #fff solid;
  text-align: center;
  line-height: 0;
}
main#rugAppeal #kodawari #handmade {
  width: 100%;
  max-width: 960px;
  margin: auto;
  margin-bottom: 10rem;
}
main#rugAppeal #kodawari #handmade::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #kodawari #handmade > ul li {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-bottom: 8rem;
}
main#rugAppeal #kodawari #handmade > ul li::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #kodawari #handmade > ul li .photo {
  width: 50%;
  margin-right: 5%;
}
main#rugAppeal #kodawari #handmade > ul li .txt {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-between;
  width: 45%;
}
main#rugAppeal #kodawari #handmade > ul li .txt h4 {
  line-height: 1.4em;
}
main#rugAppeal #kodawari #handmade .suminoe {
  background-color: #F0F0E4;
  padding: 3rem;
}
main#rugAppeal #kodawari #handmade .suminoe h4 {
  margin-bottom: 0.5em;
}
main#rugAppeal #kodawari #handmade .suminoe ul {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-top: 1em;
}
main#rugAppeal #kodawari #handmade .suminoe ul > * {
  width: 30%;
  margin-right: 5%;
}
main#rugAppeal #kodawari #handmade .suminoe ul > *:nth-of-type(3n) {
  margin-right: 0;
}
main#rugAppeal #kodawari #handmade .suminoe ul li {
  margin-bottom: 0;
}
main#rugAppeal #function {
  padding-top: 0;
}
main#rugAppeal #function > .ttl.ttlgry {
  width: 100%;
  text-align: center;
}
main#rugAppeal #function #tripleflesh {
  width: 100%;
  max-width: 960px;
  margin: auto;
  margin-top: 8rem;
  margin-bottom: 10rem;
}
main#rugAppeal #function #tripleflesh::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #function #tripleflesh::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #function #tripleflesh h4 span {
  font-size: 2rem;
}
main#rugAppeal #function #tripleflesh .detail {
  margin-top: 10rem;
  width: 110%;
}
main#rugAppeal #function #bodani, main#rugAppeal #function #tainetsu, main#rugAppeal #function #boen {
  width: 100%;
  max-width: 960px;
  margin: auto;
  margin-bottom: 5rem;
  /*p{
  	margin-right:10%;
  }*/
}
main#rugAppeal #function #bodani::after, main#rugAppeal #function #tainetsu::after, main#rugAppeal #function #boen::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #function #bodani::after, main#rugAppeal #function #tainetsu::after, main#rugAppeal #function #boen::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #lineup::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #lineup .ttlgry {
  position: relative;
  width: 100%;
  text-align: center;
}
main#rugAppeal #lineup > section {
  width: 100%;
  max-width: 960px;
  margin: auto;
  margin-bottom: 10rem;
}
main#rugAppeal #lineup > section::after {
  content: "";
  display: block;
  clear: both;
}
main#rugAppeal #lineup > section#color h4 {
  margin-bottom: 3rem;
  text-align: center;
}
main#rugAppeal #lineup > section#color .items > dt {
  margin-bottom: 1em;
}
main#rugAppeal #lineup > section#color .items > dd .list {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: flex-start;
}
main#rugAppeal #lineup > section#color .items > dd .list > * {
  width: 30%;
  margin-right: 5%;
}
main#rugAppeal #lineup > section#color .items > dd .list > *:nth-of-type(3n) {
  margin-right: 0;
}
.modal,
.design {
  position: relative;
  padding: 1em;
  margin-bottom: 3em;
  background-color: #f6f6f6;
}
.modal .classTitle,
.design .classTitle {
  display: none;
}
.modal .name,
.design .name {
  margin-bottom: 0.5em;
  text-align: center;
  font-size: 1.8rem;
}
.modal .photo,
.design .photo {
  width: 95%;
  transform: translateX(-1em);
  margin-bottom: 0.5em;
}
.modal .colorPremium,
.design .colorPremium {
  color: #b18bab;
}
.modal .colorBasic,
.design .colorBasic {
  color: #8dc556;
}
.modal .colorCasual,
.design .colorCasual {
  color: #f5a616;
}
.modal .itemCodeButton,
.design .itemCodeButton {
  position: relative;
  width: 100%;
  text-align: right;
}
.modal .itemCodeButton a,
.design .itemCodeButton a {
  display: block;
  position: absolute;
  bottom: 1em;
  right: 0;
  width: 40%;
}
.modal .itemCodeButton a:hover,
.design .itemCodeButton a:hover {
  cursor: pointer;
}
.modal .itemCode,
.design .itemCode {
  display: none;
}
.modal .lead,
.design .lead {
  margin-bottom: 1em;
  font-size: 1.2rem;
  line-height: 1.4em;
}
.modal .colorList,
.design .colorList {
  margin-bottom: 0.5em;
}
.modal .colorList > dt,
.design .colorList > dt {
  margin-top: 0.5em;
}
.modal .moreDetail > dt,
.design .moreDetail > dt {
  padding: 1em 0;
}

.modal {
  max-width: 400px;
  background-color: #f6f6f6;
  padding: 1em;
}
.modal .classTitle {
  display: block;
  margin-bottom: 1em;
}
.modal img {
  max-width: 100%;
  height: auto;
}

.fancybox-container .fancybox-bg {
  background-color: rgba(0, 0, 0, 0.3);
}

.fancybox-content.itemCode {
  width: 80%;
  max-width: 1000px;
  text-align: center;
  font-size: 1.6rem;
  line-height: 2em;
}
.fancybox-content.itemCode .itemCode_photo img {
  max-width: 100%;
}

main#rugAppeal #lineup > section#size .size {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
main#rugAppeal #lineup > section#size .size > * {
  width: 48%;
  margin-right: 4%;
}
main#rugAppeal #lineup > section#size .size > *:nth-of-type(2n) {
  margin-right: 0;
}
main#rugAppeal #lineup > section#size p.notes {
  margin-top: 5rem;
  font-size: 1.4rem;
}
main#rugAppeal #lineup > section#simulator {
  width: 100%;
  max-width: none;
  text-align: center;
  background: url(../images/appeal/bg_3d.png) center bottom repeat-x;
}
main#rugFaq h2.billboard {
  margin-top: 7rem;
}
main#rugFaq .ttl {
  font-size: 2.5rem;
  color: #00769F;
}
main#rugFaq .howto {
  width: 100%;
  max-width: 960px;
  margin: auto;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
main#rugFaq .howto::after {
  content: "";
  display: block;
  clear: both;
}
main#rugFaq .howto > * {
  width: 48%;
  margin-right: 4%;
}
main#rugFaq .howto > *:nth-of-type(2n) {
  margin-right: 0;
}
main#rugFaq .howto li {
  padding-bottom: 1.5em;
  border-bottom: 1px #282828 solid;
  margin-bottom: 2em;
}
main#rugFaq .howto li:nth-last-of-type(1), main#rugFaq .howto li:nth-last-of-type(2) {
  border-bottom: none;
}
main#rugFaq .howto li .ttl {
  margin-bottom: 0.5em;
}
main#rugFaq .faq {
  width: 100%;
  max-width: 960px;
  margin: auto;
}
main#rugFaq .faq::after {
  content: "";
  display: block;
  clear: both;
}
main#rugFaq .faq dt, main#rugFaq .faq dd {
  position: relative;
  padding: 1.5em 4.5em;
  border: 2px #00769F solid;
  border-radius: 1em;
}
main#rugFaq .faq dt {
  z-index: 2;
  width: 75%;
  margin-top: 3rem;
  background: #fff url(../images/faq/icn_Q.png) 2em center no-repeat;
  font-size: 2rem;
  font-weight: bold;
  color: #00769F;
}
main#rugFaq .faq dd {
  margin-left: 15%;
  top: -3rem;
  background: #EDEDED url(../images/faq/icn_A.png) 2em center no-repeat;
  padding-top: 5rem;
}

/*# sourceMappingURL=style.css.map */