@charset "utf-8";
/* CSS Document */
@keyframes slider-1 {
  0% {
			background-image: url('../img/slider-img4.jpg');
    transform: scale(1);
			opacity: 1;
  }
	25%{
		opacity: 0;
	}
  50% {
			background-image: url('../img/slider-img3.jpg');
 opacity: 1;
    transform: scale(1.2);
  }
	60%{
	opacity: 1;
	transform: scale(1.2);
		background-image: url("../img/suimin.jpg")
	}
	65%{
		opacity: 0;
	}
	70%{
		opacity: 1;
		background-image: url("../img/suiminn.jpg")
	}
	75%{
		opacity: 0;
	}
	90%{
		opacity: 0;
	}
	100%{
		background-image: url('../img/slider-img3.jpg');
    opacity: 0;
		animation: infinite;
	}
}

body::after{
 content: "";
	display: block;
 position:fixed;
 left: 0;
 top: 0;
 bottom: 0;
 right: 0;
 z-index: -10;
	
 background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
animation: slider-1 10s ease 0s infinite normal;
-webkit-animation: slider-1 15s ease 2s infinite normal;
}
body {
 box-sizing: border-box;
 font-family: 'Shippori Mincho';
 -webkit-text-size-adjust: 100%;
 text-align: center;
 font-size: 20px;
 line-height: normal;
	background: transparent;	
}

main {
 display: block;
 position:relative;
	z-index: 5;
}
.main {
 width: 500px;
 margin: 0 auto 0 auto;
 overflow: hidden;
 box-shadow: 0px 5px 50px 0px rgba(57, 69, 53, 0.58);
 background: #faf9f3;
}
h1 {
 text-align: center;
 padding-bottom: 30px;
 color: #aa8726;
}
h2 {
 text-align: center;
 padding: 20px;
 color: #aa8726;
	font-size: 4vh;
}
h3 {
 padding: 30px;
 color: #aa8726;
 font-size: 40px;
}
h4 {
 font-size: 25px;
 color: #00275b;
 margin: 20px;
}
.parent {
 display: flex;
 justify-content: space-between;
}
.chp {
 margin: 10px;
 font-size: 20px;
}
.ex h4{
	font-size: 4vh;
	padding-top: 30px;
}
.sheet{
	padding: 20px 0 30px 0;
}
.boxsheet h2 {
 margin: 30px 0;
 font-size: 4vh;
 color: #00275b;
 text-shadow:
  0 0 13px #fff, 0 0 18px #FFF27D, 0 0 18px #FFF27D, 0 0 18px #FFF27D, 0 0 18px #FFF27D;
 border-bottom: #FF0004;
}
/*アコーディオン全体*/
.accordion-area {
 list-style: none;
 width: 96%;
 max-width: 900px;
 margin: 0 auto;
}
.accordion-area li {
 margin: 10px 0;
}
.fs {
 font-size: 3vh;
}
.accordion-area section {
 border: 5px solid #2a2a2a;
}
/*アコーディオンタイトル*/
.title {
 position: relative; /*+マークの位置基準とするためrelative指定*/
 cursor: pointer;
 font-weight:700;
 padding: 3% 3% 3% 50px;
 transition: all .5s ease;
}
/*アイコンの＋と×*/
.title::before, .title::after {
 position: absolute;
 content: '';
 width: 15px;
 height: auto;
 background-color: #333;
}
.title::before {
 top: 48%;
 left: 15px;
 transform: rotate(0deg);
}
.title::after {
 top: 48%;
 left: 15px;
 transform: rotate(90deg);
}
/*　closeというクラスがついたら形状変化　*/
.title.close::before {
 transform: rotate(45deg);
}
.title.close::after {
 transform: rotate(-45deg);
}
/*アコーディオンで現れるエリア*/
.box {
 display: none; /*はじめは非表示*/
 background: #f3f3f3;
 margin: 0 3% 3% 3%;
 padding: 3%;
}
/*ボタンのコード*/
a.btn--orange {
 color: #fff;
 background-color: #eb6100;
 border-bottom: 5px solid #b84c00;
	border-radius: 4px;
}
a.btn--orange:hover {
 margin-top: 3px;
 color: #fff;
 background: #f56500;
 border-bottom: 2px solid #b84c00;
}
a.btn--shadow {
 -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
 box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
}
/*ここまでボタン*/
/*imgの設定　ここから*/
#top img {
 width: 100%;
 height: 550px;
}
.ex img {
 width: 100%;
}
#feature-wrapper{
	background-color: #FFFFFF;
	margin-top: 100px;
}
#feature-wrapper img {
 width: 50%;
}
.ch {
 display: flex;
}
.cv_wrapper img {
 width: 100%;
 justify-content: space-between;
}
.boxp {
 margin: 10px 20px;
}
.boxsheet img {
 height: auto;
 width: 100%;
}
.topex img{
	width:200px;
	height:200px;
	padding: 20px;
}
.mattress img{
	margin: 30px 0;
	background: #FFFFFF;
}
.footerp{
	padding: 10px 0;
}
.cv_wrapper p{
	padding-bottom: 20px;
}
.qah2 h2{
	font-size: 4vh;
}
#footer{
	background:#faf9f3;
}
.fotp{
	padding:30px 0;
	line-height: normal;
}
.fotp-4{
	color: #FF4700;
}
.footerp{
	background: #FFFFFF
}
.foimg{
	justify-content: space-between;
	width: 100%;
}

/* ------------------------------------------------------------------------------------------
SP
------------------------------------------------------------------------------------------*/
@media screen and (max-width: 500px) {
  #top {
    position: relative;
    overflow: hidden;
  }
  .main {
    width: 100vw;
    margin: 0 auto;
    border-radius: 0;
    box-shadow: none;
    border: none;
  }
	.ch {
 display: block;
}
	#feature-wrapper{
		padding-top: 40px;
	}
}