@import "/css/font-awesome/css/font-awesome.min.css";



.wrapper img {
	max-width: 100%;
}
.wrapper ol {
	list-style: none;
}
.pc_only {
	display: none;
}
.note {
	font-size: 75%;
	padding: 0;
}
.note2 {
	font-size: 75%;
	padding: 1.5rem 0 2rem;
}
.wrapper a {
	text-decoration: none;
}

#pagetop {
	position: fixed;
	bottom: 50px;
	right: 25px;
}
#pagetop a {
	display: block;
	z-index: 10000;
	width: 35px;
	height: 35px;
}

sup {
	vertical-align: super;
	font-size: smaller;
}

@media only screen and (min-width: 640px) {
	.wrapper {
		font-size: 110%;
	}
	.wrapper a {
		transition: 0.5s;
	}
	.wrapper a:hover {
		text-decoration: none;
		opacity: 0.7;
		transition: 0.5s;
	}
	.wrapper img {
		width: auto;
	}
	.pc_only {
		display: block;
	}
	.sp_only {
		display: none;
	}
	.moreinfo {
		width: 50%;
		margin: 0 auto;
	}
	.moreinfo a {
		font-size: 90%;
	}
	.em {
		font-size: 140%;
		font-weight: bold;
		text-align: center;
	}
	.note {
		font-size: 75%;
		padding: 0.5rem 0 0;
	}
	.note2 {
		font-size: 75%;
		padding: 1.5rem 0 3rem;
	}
}


/* ********** COMMON ********** */

* {
  box-sizing: border-box; }

html, body {
  height: 100%;
  color: #111;	
}

html {
  //overflow-y: scroll;
}

body {
  background: #fff;
  text-align: center;
  color: #222;
  margin: 0;
  padding: 0;
  min-height: 100vh;
}

body {
  overflow-x: hidden;
  overflow-y: scroll;
}


/* ********** HEADER ********** */
.linktxt,
.articlecard__txt,
.header__menu__product__list__txt {
	display:block;
	text-align:left;
}


/* ********** HEADER ********** */
.header__menu__product__list,
.header__menu__product__foot,
.header__menu__product__brandlist,
.header__menu__features,
.header__menu__shopinfo__main,
.header__menu__services__main,
.header__menu__content,
.linklist__item
 {
	display:block;
	text-align:left;
}


/* ********** sns icon ********** */
.sns_fixed {
	position: fixed;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-align-items: center;
	align-items: center;
	line-height: 1;
	z-index: 99999;
}
.sns_fixed img {
	width: 34.3px;
}
.sns_fixed ul {
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-align-items: center;
	align-items: center;
}
.sns_fixed li {
	flex: auto;
}
.sns_fixed a {
	display: block;
	background-color: #fff;
}



@media only screen and (max-width: 414px) {	
	.sns_fixed {
		display: none;
	}
}

/* ********** top ********** */
.top {
	margin-top: 1rem;
}
.mv {
	text-align: center;
}
.lead {
	margin: 3em 1em;
	line-height: 1.4;
}
.lead br {
	/* display: none; */
}
@media only screen and (min-width: 640px) {
	.top .lead {
		margin: 5em auto;
		line-height: 2.2;
	}
	.top .lead br {
		display: inline;
	}
}
@media only screen and (min-width: 960px) {
}

/* ********** form_btn ********** */
.btn_area {
	background-color:#f8e9d7;
	border:1px solid #f8e9d7;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	padding:1em;
}
.cta {
	margin: 1em 0;
}
.cta a {
	display: block;
	padding: 1em;
	border-radius: 5px;
	background-color: #ff8a00;
	box-shadow: 0 3px #E67A00;
	color: #fff;
	font-size:140%;
	font-weight: bold;
	text-align: center;
}
.cta a:active {
	box-shadow: none;
	transform: translateY(3px);
}
@media only screen and (min-width: 640px) {
	.cta {
		margin: 1em;
	}
	
	.cta a {
		display: block;
		padding: 1em;
		border-radius: 5px;
		background-color: #ff8a00;
		box-shadow: 0 3px #E67A00;
		color: #fff;
		font-size:150%;
		font-weight: bold;
		text-align: center;
	}
	.cta a:hover {
		box-shadow: none;
		transform: translateY(3px);
	}
}
@media only screen and (min-width: 960px) {
	.cta p {
		width: 60%;
		margin: 1em auto;
	}
}
.answer_detail {
	margin: 3em 0;
}
.wrapper .answer_detail:nth-child(2n + 1) {
	/* background-color: #f8f8f8; */
	padding: 0 0 1.5em;
}
.answer_detail > *:not(.answer_detail_header){
	margin-left: 1em;
	margin-right: 1em;
}
.answer_detail_header {
	margin-bottom: 1.5em;
	padding: 1.5em 1em;
	background-color: #841821;
	color:#fff;
}
.answer_detail h3 {
	margin: 2em auto 1em;
}
.text {
	margin-bottom: 2em;
}
.text p {
	font-size:0.85rem;
	line-height:1.6;
	text-align:left;
}
.col2 li {
	margin-bottom: 1.5em;
}
.col2 .image {
	margin: 0 0 0.5em;
}
.brand01_logo {
	text-align:center;
}
#type h2 {
	padding:1.5em;
	text-align:center;
	/*font-size:120%;*/
}
#type .mds01 {
	font-size:110%;
	margin:2em auto 1em;
	text-align: center;
}
#type .mds01 span {
	font-size:150%;
	font-weight:bold;
}
#type .col2 {
	border-bottom:none;
	border-bottom:1px solid #ccc;
	margin-bottom:2em;
	padding-bottom:2em;
}
#type .more_btn {
	background-color:#000;
	padding:.5em;
	border:3px solid #000;
	text-align:center;
	margin:1.5em auto 0;
	width:70%;
}
#type .more_btn a {
	color:#fff;
	display: block;
	position: relative;
}
#type .more_btn a::after {
	content: "\f105";
	font-family: FontAwesome;
	position: absolute;
	right: 0.5em;
	top: 50%;
	transform: translateY(-50%);
}
.img_tile {
	margin: 1.5em 0;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
}
.img_tile li {
	width: 50%;
	line-height: 0;
}
.img_tile a {
	display: block;
	position: relative;
}
.img_tile a::after {
	content: "\f00e";
	position: absolute;
	bottom: 0.5em;
	right: 0.5em;
	z-index: 99;
	color: #ffffff;
	font-family: FontAwesome;
	font-size: 1.2em;
	line-height: 1.4;
	background-color: rgba(255, 255, 255, 0.3);
	border: solid 2px #ffffff;
	border-radius: 5px;
	padding: 0.2em 0.5em;
}
.slider {
	display: -webkit-flex;
	display: flex;
}
#fabric_sample {
	margin: 0 1em;
}
.slider li img {
	width: 90%;
	margin: 0 auto;
}
.slider_control {
	width: 2em;
}
a.bx-prev,
a.bx-next {
	display: block;
	background-color: #666;
	color: #fff;
	width: 100%;
	height: 100%;
	position: relative;
}
.bx-prev {
	border-radius: 5px 0 0 5px;
}
.bx-next {
	border-radius: 0 5px 5px 0;
}
.bx-prev::after,
.bx-next::after {
	content: "\f053";
	font-family: FontAwesome;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.bx-next::after {
	content: "\f054";
}

.brand_tile {
	margin: 1.5em 0;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: center;
	justify-content: center;
}
.brand_tile li {
	width: calc(33.333% - 1em);
}
.col3 {
	margin-bottom: 2em;
}
.col3 li {
	margin: 0 0 1em;
}
.col3 dl {
	margin: 0.5em 0 0;
	font-size: 90%;
}
.col3 dt {
	margin: 0.5em 0;
	font-weight: bold;
}
#lineup .col2 .image {
	margin-bottom:1em;
}
#item .em {
	color: #c00;
	font-size: 140%;
	font-weight: bold;
}
#item dt {
	font-weight: bold;
}
#item dd {
	font-size: 90%;
}
@media only screen and (min-width: 640px) {
	.answer_detail_header {
		text-align: center;
	}
	.answer_detail_header h2 {
		font-size: 140%;
	}
	.answer_detail_header sup {
		font-size: 60%;
	}
	.answer_detail h3 {
		margin-top: 6em;
		font-size: 140%;
		text-align: center;
	}
	.text {
		margin-bottom: 1em;
	}
	.text p {
		font-size:1rem;
	}
	.col2 {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		border:none;
	}
	.col2 > * {
		width: calc(50% - 1.25em);
	}
	div.col2 {
		-webkit-align-items: center;
		align-items: center;
	}
	#lineup .lead {
		margin: 2em auto;
		line-height: 1.8;
	}
	#lineup .col2 {
		border-bottom:none;
		margin-bottom:1.5em;
	}
	#type h2 {
		margin-bottom:2em;
	}
	#type .col2 {
		border-bottom:none;
		margin-bottom:2em;
	}
	#type .mds01 {
		font-size:110%;
		margin:0 auto 1em;
	}
	#type .mds01 span {
		font-size:150%;
		font-weight:bold;
	}
	.col3 {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-justify-content: space-between;
		justify-content: space-between;
	}
	.col3 li {
		width: calc(33% - 1em);
	}
	.col3 dt {
		font-size: 120%;
	}
	.img_tile li {
		width: 25%;
	}
	.brand_tile {
		width: 80%;
	}
	.brand_tile li {
		width: calc(20% - 1em);
	}
}
@media only screen and (min-width: 960px) {
}


.newitem {
	margin: 3em 1em;
}
.newitem h2 {
	padding:1.5em;
	text-align:center;
	font-size:130%;
}
.newitem .new_bg {
	padding:1em;
	background-color:#f1eaeb;
}
.newitem dl {
	margin: 0.5em 0 0;
	font-size: 90%;
}
.newitem dt {
	font-weight: bold;
}
.newitem .col2 {
	border:none;
}
#gentei h3 {
	padding: 1.5em 0 0;
	text-align:
	center;
	font-size:120%;
}
#gentei h3 span {
	font-size:80%;
	font-weight:normal;
}
.more_type_btn {
	padding:1em;
	border:1px solid #ccc;
	text-align:center;
	margin:1.5em 1em 0;
}
.more_type_btn a {
	display: block;
	position: relative;
}
.more_type_btn a::after {
	content: "\f105";
	font-family: FontAwesome;
	position: absolute;
	right: 0.5em;
	top: 50%;
	transform: translateY(-50%);
}
.service {
	margin: 3em 1em;
}
.service h2 {
	margin-bottom: 1.5em;
	padding: 0.5em 1em;
}
.service dl {
	margin: 0.5em 0 0;
	font-size: 90%;
}
.service dt {
	font-weight: bold;
	font-size:1.1rem;
}
.service dd {
	text-align:left;
	line-height:1.6;
	font-size:0.8rem;
	margin-top:0.5rem;
}
#banner_area {
	margin-top: 4em;
	background-color:#fff;
}
#banner_area .em {
	margin: 2em auto 1em;
}
@media only screen and (min-width: 640px) {
	.newitem h2 {
		font-size: 140%;
		text-align: center;
		padding:2em;
	}
	#gentei {
		margin-bottom:5em;
	}
	.more_type_btn {
		padding:1em;
		border:1px solid #ccc;
		text-align:center;
		margin:1.5em 1em 0;
	}
	.service h2 {
		font-size: 140%;
		text-align: center;
	}
	.service dt {
		font-weight: bold;
	}
	.service dd {
		text-align:left;
		line-height:1.6;
		font-size:0.8rem;
		margin-top:0.5rem;
	}
}
@media only screen and (min-width: 960px) {
	.more_type_btn {
		padding:1em;
		border:1px solid #ccc;
		text-align:center;
		margin:1.5em auto 0;
	}
}

/* ********** showroom ********** */
.shoplist {
	margin: 3em 0;
}
.shoplist .em {
	margin: 0 1em 1.5em;
}
.tenpo_headline {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	margin: 0 0.5em;
	line-height: 2em;
}
.tenpo_area {
		text-align:left;
	}
.tenpo_area:first-child {
	border-top: solid 1px #ccc;
}
.tenpo_area_title {
	padding: 0.5em;
	background-color: #eee;
	border-bottom: solid 1px #ccc;
	position: relative;
}
.tenpo_area_title::after {
	content: "\f107";
	font-family: FontAwesome;
	position: absolute;
	right: 0.5em;
	top: 50%;
	transform: translateY(-50%);
}
.tenpo_area_title.active::after {
	content: "\f106";
	font-family: FontAwesome;
	position: absolute;
	right: 0.5em;
	top: 50%;
	transform: translateY(-50%);
}
.tenpo_area > ul {
	border-bottom: solid 1px #ccc;
	font-size: 90%;
}
.tenpo_area > ul > li {
	border-bottom: solid 1px #ccc;
}
.tenpo_area > ul > li:last-child {
	border-bottom: none;
}
.tenpo_area a {
	display: block;
	padding: 1em 0.5em;
	position: relative;
}
.tenpo_area a::after {
	content: "\f105";
	font-family: FontAwesome;
	position: absolute;
	right: 0.5em;
	top: 50%;
	transform: translateY(-50%);
}
.tenpo_area br,
.tenpo_area span {
	display: none;
}
@media only screen and (min-width: 640px) {
	.shoplist {
		margin-left: 1em;
		margin-right: 1em;
	}
	.tenpo_area {
		margin-top: 0.5em;
		text-align:left;
	}
	.tenpo_area:first-child {
		border: none;
	}
	.tenpo_area_title {
		position: relative;
		border: solid 1px #ccc;
	}
	.tenpo_area_title::after {
		content: "";
	}
	.tenpo_area > ul {
		border: none;
		font-size: 80%;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
	}
	.tenpo_area > ul > li {
		width: calc(100% / 3);
		padding: 0.5em;
		border: none;
	}
	.tenpo_area a {
		border-bottom: solid 1px #ccc;
	}
}
@media only screen and (min-width: 960px) {
	.tenpo_area {
		margin: 0;
		text-align:left;
	}
	.tenpo_area_title {
		margin-top: 1em;
	}
	.tenpo_area a {
		display: inline;
		padding: 0;
		border: none;
	}
	.tenpo_area a::before {
		content: "\f105  ";
		font-family: FontAwesome;
	}
	.tenpo_area a::after {
		content: none;
	}
	.tenpo_area a:hover {
		text-decoration: underline;
	}
	.tenpo_area br,
	.tenpo_area span {
		display: inline;
		font-size: 90%;
	}
	.tenpo_area span:not(.popup_area_title) {
		margin-left: 1em;
	}
}

/* ********** footer ********** */
.footer {
	margin: 3em 0;
	font-size: 60%;
	text-align: center;
}


@media only screen and (min-width: 960px) {
	.top .lead,
	.cta,
	.question,
	.answer,
	.answer_detail > *:not(.answer_detail_header),
	.newitem,
	.service,
	.shoplist,
	.footer {
		width: 960px;
		margin-left: auto;
		margin-right: auto;
	}
}