@charset "UTF-8";
/* CSS Document */
h2 {
	text-align: left;
}
h3 {
	margin: 0.2em;
	padding: 0.5em 2em;
	font-family: "Sawarabi Mincho";
	font-size: 1.3em;
	display: inline-block;
	background: #F0F7F1;
}
h3.other {
	background: #fff
}

/*--------------------------------------------- 
 tatami
 --------------------------------------------- */
.base {
	text-align: center;
}
.base h3 {
	margin: 2em 0 1em 0;;
}
.baseArea,
.typeArea,
.dFlex {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	text-align: left;
}
.baseArea .rebox,
.typeArea ul,
.detailPrice {
	width: 100%;
	max-width: 460px;
}
.pageTtl {
	position: relative;
}
.pageTtl img {
	width: 100%;
	height: 180px;
	vertical-align: bottom;
	object-fit: cover;
}
.pageName {
	color: #fff;
	font-size: 1.4em;
	letter-spacing: .1em;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.baseArea img,
.typeArea img {
	width: 100%;
	hight: auto;
}
h4 {
	font-size: 1.4em;
	letter-spacing: .1em
}
.tatamiSize {
	color: #00573f;
	font-size: 1.2em;
	text-align: center;
}

.typeArea ul{
	text-align: left;
	margin: 0 0 2em 0;;
	padding: 0 1.5em;
	border-top: 5px double #b5b243;
	border-radius: 24px;
}
.typeArea ul li {
	padding: 0.5em 0;
}
.price,
.promise {
	background: #F0F7F1;
	padding: 2em 0;
}
.priceArea .detailPrice dl {
	margin: 0.5em 0;
}
.pricTtl {
	margin : 2em 0 0 0;
	font-size: 1.6em;
	text-align: center;
	letter-spacing: .1em;
	border-bottom: 5px dotted #fff;
}
.pricTtl span {
	display: block;
	font-size: 0.7em;
	color: #9b3842;
	padding: 0 0 0.5em 0; ;
}
.priceArea .center {
	font-size: 1.2em;
	padding: 1em 0 ;
}
.priceArea .center span{
	color:  #9b3842;
	font-size: 1.6em;
}
.priceArea .center.sale {
	text-align: center;
	padding: 1em 0 0 0;
}
.promiseBox {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.promiseBox .promiseItem {
	border: 1px solid #b5b243;
	background: #fff;
	width: 90%;
	max-width: 460px;
	margin: 1em auto;
	padding: 1em;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	line-height: 1.8;
}
.promiseItem .itemImg {
	text-align: center;
}
.promiseBox img {
	width: 200px;
	height: auto;
}
.escontents {
	padding: 3rem 0;
}
.priceArea .contactArea {
	background: #fff;
	padding: 1em;
	margin: 2em auto;
}
.notes {
	padding: 1em;
}
.notes li {
	border-bottom: 1px dotted #ccc;
	padding: 0.2em 0;
}
.notes li:last-child {
	border: none;
	padding: 0.2em 0 0 0;
}
.priceFusuma {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.included {
	margin: 0 0 0 0.5em;
}
.included li{
	padding: 0.2em 0;
	list-style-type: circle;
}
.priceArea .pricTtl {
	margin: 1em 0 0 0;
	border: none;
}
.typeFusuma {
	background: #F0F7F1;
	padding: 2em 0;;
}
.detailPoint .ttlG {
	font-size: 1.2em;
	margin: 0.5em 0;
}
.detailPoint .tLeft {
	padding: 0.5em 0;
}
.lengthPoint {
	margin: 0 0 3em 0;
}
.ttlPaper {
	font-size: 1.2em;
}
.plus {
	color: #00573f;
	text-align: center;
	padding: 1em 0 0 0;
}
.paperFusuma ol {
	width: 90%;
	margin: 1em auto;
	padding: 1em;
	border: 1px solid #b5b243;
}
.paperFusuma ol li {
	list-style-type: inherit;
	padding: 0.2em 0;
	margin: 0 0 0 2em;;
}
.paperEx {
	width: 90%;
	margin: 0 auto 2em auto;
	line-height: 2;
}
.paperEx strong {
	color: #9b3842;
	padding: 0 0.2em;
	font-size: 1.2em;
}
.merit {
	margin: 2em auto;
}
.ttlBox {
	text-align: center;
}
.merit img {
	margin: 2em;
	display: block;
}
.meritArea,
.demeritArea {
	margin: 1em auto;
	padding: 1.4em;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	border: 1px solid #b5b243;
}
.meritArea h4,
.demeritArea h4{
	font-size: 1.2em;
	text-align: center
}
.toguruma, .mohair {
	width: 100%;
	padding: 0 1em 1em 1em;
	background: #fff;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
.toguruma {
	border-bottom: 5px solid #F0F7F1;
}
.toguruma .ttlG,
.mohair .ttlG{
	flex: 0 0 100%;
}
.togurumaInner01 img {
	width: 160px;
	height: auto;
	margin: 1em;
}
.togurumaInner02 img {
	width: 200px;
	height: auto;
}
.togurumaInner01 {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 98%;
	padding: 1em;
	position: relative;
	box-shadow: 5px 5px 20px 0px rgba(0,0,0,0.15);
	z-index: 2;
}
.togurumaInner02{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 90%;
	padding: 2em 0.5em 0.5em;
	background: #F0F7F1;
}
.mohair img {
	width: 200px;
	margin: 0 0 2em 0;
}
.amido .rankBox {
	margin: 3em auto;
}
.amido .ttlG {
	margin: 0 0 2em 0;
}
.mosquito .ttlG {
	margin: 0 0 0.5em 0;
}
.performance p {
	padding: 0 0 0.5em 0;
}
.performance .high {
	padding: 0.5em 0 2em 0;
}
.performanceItem{
	margin: 0 0 3em 0;
	border: 1px solid #b5b243;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.performanceItem.mos {
	border: 1px solid #ddd;
}
.performanceItem .rank {
	width: 100%;
	text-align: center;
}
.performanceItem .rank img {
	width: 100%;
	max-width: 360px;
	padding: 1em;
}
.performanceItem p {
	width: 100%;
	color: #fff;
	padding: 1.6em 0.5em;
	font-size: 1.1em;
	text-align: center;
	font-family: "Sawarabi Gothic";
	background: #b5b243;
}
.performanceItem.mos p {
	background: #ddd;
	color: #333;
}
.performanceItem p span {
	display: block;
	font-size: 0.8em;
}
.performance .ttlG {
	margin: 0;
}
.reamido {
	background: #fff;
	padding: 1em;;
}
.reamido h4 {
	margin: 1em 0;
}
.reamido p {
	padding: 0 0 0.5em 0;
}
.reamido p:nth-child(5) {
	padding: 0 0 2em 0;
}

table {
	border-collapse: collapse;
	width:100%;
	margin: 3em auto 6em auto;
	border: 2px solid #F0F7F1;
}
table th{
	padding: 0.5em;
	background-color: #F0F7F1;
	display: block;
}
table td {
	display: block;
	padding: 0.8em;
}
.backGreen {
	background: #F0F7F1;
	padding: 2em 0;
}
/*-----  tablet ------- */
@media screen and (min-width: 768px) {
	.priceArea .detailPrice {
		flex-wrap: wrap;
		align-items: center;
	}
	.quality {
		font-size: 1.2em;
		text-align: center;
	}
}

/*-----  pc ------- */
@media screen and (min-width: 1024px) {
	.pageTtl {
		padding: 75px 0 0 0;
	}
	.pageName {
		top: 62%;
		font-size: 2.2em;
	}
	.baseArea {
		justify-content: space-between;
	}
	.baseArea .rebox {
		width: 460px;
		padding: 1em 2em;
	}
	.typeArea ul {
		max-width: 100%;
		display: flex;
		align-items: center;
		border-top: none;
		border-left: 5px double #b5b243;
	}
	.typeArea ul li{
		line-height: 1.8;
	}
	.typeArea ul li.typeImg img {
		width: 360px;
		margin: 0 2em 0 0;
	}
	.priceArea .dFlex{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.promiseBox .promiseItem {
		max-width: 100%;
		flex-wrap: nowrap;
	}
	.promiseBox .promiseItem ul{
		display: flex;
		align-items: center;
		justify-content: space-around;
	}
	.promiseItem .itemImg {
		flex: 0 0 36%;
	}
	.promiseBox img {
		width: 160px;
		margin: 0 2em 0 0;
	}
	.typeFusuma ul.rebox {
		width: 32%;
	}
	.typeFusuma .detailPoint ul.rebox.large {
		width: 48%;
	}
	.ttlPaper {
		text-align: center;
	}
	.meritArea,
	.demeritArea {
		flex-direction: row;
		align-items: flex-start;
	}
	.demeritArea,
	.meritArea.shouji{
		align-items: center;
	}
	.demeritArea li {
		padding: 0.5em 0;
	}
	.ttlBox {
		margin: 0 2em 0 0;
	}
	.togurumaInner01,.togurumaInner02 {
		width: 50%;
	}
	.togurumaInner02 {
		padding: 1em;
	}
	.toguruma {
		border: none;
	}
	.mohair img {
		margin: 0;
	}
	.mohair .mohairText {
		margin-left: 3em;
	}
	.performanceItem {
		padding: 1em 0 0 0;
		align-items: center;
	}
	.performanceItem p{
		flex: 0 0 100%;
	}
	.performanceItem .rank {
		width: 46%;
	}
	.amidoReccomend .reccomend {
		flex-direction: column;
	}
	.reamido h4 {
		margin: 0;
	}
	.reamido ul {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.reamido ul li {
		width: 40%;
	}
	.reamido ul li.amidoText {
		width: 60%;
	}
	.reccomend img {
		width: 100%;
	}
	.reamido p {
		padding: 0;
	}
	table {
		width: 80%;
		margin: 2em auto 8em auto;
	}
	table tr {
		display: flex;
	}
	table th{
		width: 30%;
		padding: 1em;
		border-bottom: 2px solid #fff;
	}
	.tLast {
		border: none;
	}
	table td {
		width: 70%;
		border-bottom: 2px dotted #F0F7F1;
	}
}