@charset "utf-8";
/* CSS Document */

#topics-container {
/* 	background: transparent url(/img/content/home/bg_topics-container.jpg) left top /cover no-repeat scroll; */
	margin-top: -119px;
	padding-top: 119px;
}
#topics-container .container {
	padding: 0 0 4em 0;
}
#topics-container h2 {
	font-size: xx-large;
	padding: 0 0 .5em 0;
	margin-top: 0;
	margin-bottom: 0;
	font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif; 
}
#topics-container .info-more-btn{
width: 270px;
height: 48px;
margin:0 auto 80px;
}
#topics-container .info-more-btn a{
	width: 100%;
	height: 100%;
	border: 1px solid black;
	position: relative;
	font-size: 16px;
	line-height: 48px;		
	display: flex;
	justify-content: center;
	align-items: center;
}
#topics-container .info-more-btn a::after{
	content: "";
	width: 8px;
	height: 8px;
	border-top: 1px solid #000;
	border-right: 1px solid #000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	display: block;
	position: absolute;
	right: 20px;
	top: 50%;
	margin-top: -4px;
}
#topics-container .thumbnail.bg-white > img {
	height: 180px;
}
#topics-container .caption {
	padding: 0.5em 0 1.0em 0;
}
#topics-container h3 {
	min-height: 3.2em;
	font-size: small;
	text-align: center;
	line-height: 1.6em;
}
#topics-container a:hover{
	text-decoration: none;
}
#topics-container a img{
	transition: .3s;	
}
#topics-container a:hover img{
	opacity: .6;
}
.row-slope {
	background-color: #F6F6F6;
	margin-top: 4em;
}
.row-slope .linear {
	height: 4em;
	margin: 0 -2em;
	background: white;
	transform: rotate(-2deg);
	transform-origin: left center;
}
#brandstory-container {
	background: #F6F6F6 url(/img/content/home/bg_brandstory-container.png) left top /contain no-repeat scroll;
	padding: 9em 0 1.5em 0;
}
.sm-slider{
	display: none;
}

@media (max-width: 1023px) {
#brandstory-container {
	padding-top: 5em;
}
}
#brandstory-container .figure-ratio-visual .image-background {
	background-image: url(/img/content/home/bg_brandstory-visual.jpg);
}
#mattress-container {
	background-color: #F6F6F6;
	padding: 1.5em 0;
}
#mattress-container .figure-ratio-visual .image-background {
	background-image: url(/img/content/home/bg_mattress-visual.jpg);
	background-position: left bottom;
}
#bed-container {
	background-color: #F6F6F6;
	padding: 1.5em 0;
}
#bed-container .figure-ratio-visual .image-background {
	background-image: url(/img/content/home/bg_bed-visual.jpg);
}
#accessory-container {
	background-color: #F6F6F6;
	padding: 1.5em 0;
}
#accessory-container .figure-ratio-visual .image-background {
	background-image: url(/img/content/home/bg_accessory-visual.jpg);
}

@media (max-width: 1023px) {
.row-parallax {
	height: auto;
}
/*.lap-absolute {
    position: relative;
  }*/
  /*.figure-ratio-visual,
  .figure-ratio-panel {
    top: inherit;
    width: 100%;
  }*/
.figure-ratio-button {
	position: absolute;
	margin-left: -6em;
}
.figure-ratio-button .btn-lg {
	width: 10em;
	;
}
.figure-ratio-panel .panel .panel-body {
	height: 0;
	min-height: 22em;
}
}

/******TABCODE追加↓↓↓↓↓↓↓↓↓↓↓↓↓↓********/
#topics-container .top-topics-row{
	display: flex;
	flex-wrap: wrap;
	margin-top: 20px;
}
@media (max-width: 767px) {
#topics-container .top-topics-row{
	display: block;
	}
}

#topics-container .top-topics-row .col-md-4{
	float: none;
}
#topics-container .col-sm-6.col-md-4 .center-block .thumbnail {
    padding-bottom: 0;
}
.gutter-30 > div {
    padding-right: 10px;
    padding-left: 10px;
}

.gutter-30{
	margin-left: -10px;
    margin-right: -10px;
}

#topics-container .thumbnail.bg-white > img {
    height: auto;
/*     width: 100%; */
	max-width: 100%;
}
#topics-container .col-sm-6.col-md-4 .thumbnail .caption h3 {
	margin-bottom: 0;
	margin-top: 0;
	min-height: auto;
}
#topics-container .caption {
	padding: 0;
 	height: 110px; 
	display: flex;
	justify-content: center;
	align-items: center;
}
#topics-container .caption .in-wrap{
	text-align: center;
}
#topics-container h3 {
	font-size: 14px;
	text-align: center;
	line-height: 1.5;
	font-weight: bold;
}
#topics-container .caption p.topic-txt{
margin: 10px 0 0;
text-align: left;	
font-size: 12px;
color: #707070;
padding: 0 15px;
line-height: 1.6;
}
#brandstory-container {
	background: #F6F6F6;
	padding: 0 0 2px 0;
}

#mattress-container {
    padding: 0 0 2px;
}
#bed-container {
   padding: 0 0 2px;
}

#accessory-container {
    padding: 0;
}
.figure-ratio-panel .panel .panel-body {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	width: 100%;
	height: 420px;
	padding: 0;
}
.container-fluid .figure-ratio-panel .panel .panel-body h3 {
	font-size: 25px;
	margin: 0;
	font-weight: bold;
}
.container-fluid .figure-ratio-panel .panel .panel-body h3 small {
	padding: 8px 0 0;
}
.figure-ratio-panel .panel .panel-body h3 small {
	display: block;
	padding: 0 0 0.5em 0;
}
.container-fluid .material-icons {
	line-height: 70px;
}
.row-parallax {
	position: relative;
	height: 420px;
}
.container-fluid .btn-lg {
	padding: 0;
	width: 270px;
	height: 48px;
	font-size: 16px;
	line-height: 48px;
}
.container-fluid .figure-ratio-panel .panel .panel-body p {
	line-height: 1.8em;
	text-align: center;
	font-size: 15px;
	letter-spacing: normal;
}
#information-container {
	padding: 80px 0;
}
#information-container .infoTitle {
/* 	border-bottom: 1px solid #9797A6; */
	/* padding-bottom: 2em; */
    /* margin-bottom: 2em; */
	position: relative;
	max-width: 1000px;
	margin: 0 auto 40px;
/* 	padding: 0 0 30px; */
}
#information-container h2 {
	font-size: 32px;
	margin-top: 0px;
	margin-bottom: 0;
	letter-spacing: 3px;
}
#information-container .btn-info-all {
	position: absolute;
	top: 8px;
	text-align: right;
	padding-right: 0;
	width: auto;
	right: 0;
	padding: 0;
}
#information-container .swiper-area {
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 30px;
	position: relative;
}
#information-container .swiper-area a.btn-info-prev {
	position: absolute;
	left: -10px;
	top: 50%;
	margin-top: -16px;
}
#information-container .swiper-area a.btn-info-next {
	position: absolute;
	right: -10px;
	top: 50%;
	margin-top: -16px;
}
#information-container .swiper-area a .material-icons {
	line-height: 1;
}
#information-container .swiper-info-container {
	overflow: hidden;
}
#information-container .swiper-info-slide {
	padding: 0 1em;
	float: left;
}
#information-container dl {
	margin-bottom: 0;
}
#information-container .swiper-info-slide dt {
	font-weight: normal;
	padding-bottom: 1em;
}

@media (max-width: 1023px) and (min-width: 992px) {
#information-container {
	padding: 80px 30px;
}

	.gutter-30 {
    margin-left: 10px;
    margin-right: 10px;
}

	
}

@media (max-width: 991px) {
#brandstory-container {
	padding-top: 5em;
}
.row-parallax {
	height: auto;
}
.figure-ratio-visual, .figure-ratio-panel {
	top: inherit;
	width: 100%;
}
.lap-absolute {
	position: relative;
}
.figure-ratio-panel .panel .panel-body {
	height: 0px;
	min-height: 360px;
}
.figure-ratio-visual .image-background {
	display: none;
}
#brandstory-container .visible-xs-block {
	display: block !important;
}
#mattress-container .visible-xs-block {
	display: block !important;
}
#bed-container .visible-xs-block {
	display: block !important;
}
#accessory-container .visible-xs-block {
	display: block !important;
}
#information-container {
	padding: 80px 20px;
}
#information-container h2 {
	font-size: 22px;
	letter-spacing: 1px;
	text-align: left;
}
#information-container .infoTitle {
	margin: 0px auto 20px;
	padding: 0px 0px 20px;
}
#topics-container h2 {
	font-size: 30px;
	padding: 0 0 20px;
	letter-spacing: 3px;
}
#visual-container {
	margin-bottom: 50px;
}
#topics-container .caption {
	padding: 0 20px;
}
#brandstory-container {
	padding: 40px 0 20px 0;
}
	
	#mattress-container {
    padding: 20px 0;
}
#bed-container {
   padding: 20px 0;
}

#accessory-container {
    padding: 20px 0 40px;
}
.figure-ratio-panel .panel .panel-body .wrap {
	margin: 0;
	padding: 0 20px;
}
	.gutter-30 {
    margin-left: 0px;
    margin-right: 0px;
}
}

@media (max-width: 767px) {

.sm-slider {
    overflow: hidden;
    box-sizing: border-box;
    display: none;
/*
	position: absolute!important;
	z-index: -1;
	background: #000;
	display: block;
*/
}
	.embed-responsive {
    background-color: transparent;
}
	#static {
    background:none;
}
	#visual-container {
	margin-bottom: 70px;
}
	#topics-container {
    margin-top: -70px;
    padding-top: 70px;
}
#topics-container .gutter-30 {
	text-align: center;
}
#topics-container .center-block {
	display: inline-block;
}
.container-fluid .material-icons {
	line-height: 40px;
}
#information-container .infoTitle {
	margin: 0 auto 20px;
	padding: 0 0 20px;
}
#information-container h2 {
	font-size: 26px;
	letter-spacing: 1px;
	text-align: center;
}
#information-container .btn-info-all {
	position: static;
	display: block;
	text-align: center;
	padding: 10px 0 0;
}
#information-container .swiper-area {
	padding: 0 20px;
}
}
