@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent
}
ol, ul {
	list-style: none
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: 400;
}
body {
	min-width: 320px;
}
em {
	font-style: normal;
	font-weight: 700;
}
@font-face {
	font-family: YakuHanJP;
	src: url(../fonts/YakuHanJP-Regular.eot);
	src: url(../fonts/YakuHanJP-Regular.woff2) format("woff2"), url(../fonts/YakuHanJP-Regular.woff) format("woff")
}
@font-face {
	font-family: YakuHanJP;
	font-weight: 700;
	src: url(../fonts/YakuHanJP-Bold.eot);
	src: url(../fonts/YakuHanJP-Bold.woff2) format("woff2"), url(../fonts/YakuHanJP-Bold.woff) format("woff")
}
#feature {
	font-family: YakuHanJP, "ヒラギノ角ゴ Pro", Hiragino Kaku Gothic Pro, "メイリオ", Meiryo, sans-serif;
	position: relative;
	overflow: hidden;
	line-height: 1.6;
	color: #2f353d;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-feature-settings: "pkna";
	font-feature-settings: "pkna";
	text-size-adjust: 100%;
	font-size: 15px;
	font-size: .9375rem
}
#feature img {
	vertical-align: top;
	max-width: 100%;
}
@font-face {
	font-family: Yu Gothic;
	src: local("Yu Gothic Medium")
}
.pc {

}
.sp {
	display: none;
}

/**section & wrap-------------------------------------------------------**/
.ftr-section {
	margin-bottom: 100px;
}
.ftr-section p {
	line-height: 2;
	margin-bottom: 2.2em;
}
.ftr-section p:last-child {
	margin-bottom: 0;
}
.l-contents {
	margin-right: auto;
	margin-left: auto;
	max-width: 1200px;
	width: 94%
}
.l-contents-inr {
	margin-right: auto;
	margin-left: auto;
	width: 94%;
	max-width: 1000px
}
.contents-block {
	padding-top: 9%
}
.showroom,
.c10 {
	color: #000;
}
p.showroom_lead {
	margin-top: 7%;
	padding-bottom: 3%;
}
/**anchor navi-------------------------------------------------------**/
.l-ftr-topnavi {
	background: #f1f1f1;
	padding: 55px 0;
}
.ftr-topnavi {
	text-align: center;
	margin: 0 -10px -20px -10px;
	display: flex;
	flex-wrap: wrap;
}
.ftr-topnavi-list {
	width: calc(50% - 20px);
	margin: 0 10px 20px 10px;
	font-size: 94%;
}
.ftr-topnavi-btn {
	width: 100%;
	background: #fff;
	line-height: 1.5;
	text-align: center;
	position: relative;
	border-bottom: solid 2px #bdbdbd;
	display: table;
	transition: all .5s ease !important;
}
.ftr-topnavi-btn .inr {
	display: table-cell;
	height: 120px;
	vertical-align: middle;
	padding: 0 .5em;
}
.ftr-topnavi-btn:hover {
	color: #fff;
	background: #5787f4;
	text-decoration: none;
}
.ftr-topnavi-btn .ico {
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -.5em;
}

/**anchor navi sticky -------------------------------------------------------**/
.l-navi {
	position: relative;
	z-index: 1000;
	max-width: 1260px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
#ftr-navi {
	width: 15px;
	position: absolute;
	right: 0
}
.ftr-navi-list {
	margin-bottom: 1px;
	position: relative
}
.ftr-navi-list:before, .ftr-navi-list:after {
    content: "";
    display: table;
}
.ftr-navi-list:after {
	clear: both;
}
.ftr-navi-list span {
	position: absolute;
	top: 50%;
	left: 0;
	display: block;
	width: 100%;
	text-align: center;
	vertical-align: middle;
	margin-top: -.75em;
	letter-spacing: 0;
	font-family: "游ゴシック", YuGothic, Hiragino Kaku Gothic ProN, Hiragino Kaku Gothic Pro, "ＭＳ ゴシック", sans-serif
}
.ftr-navi-list .ftr-navi-over {
	position: absolute;
	width: 360px;
	right: -360px;
	top: 0;
	text-align: left;
	height: 60px;
	display: table;
	font-size: 13px;
	background: #799ef7;
	transition: all .5s
}
.ftr-navi-list .ftr-navi-over p {
	display: table-cell;
	vertical-align: middle;
	padding-left: 2em;
	position: relative
}
.ftr-navi-list .ftr-navi-over .ico {
	display: block;
	position: absolute;
	left: 10px;
	top: 50%;
	margin-top: -.5em
}
.ftr-navi-btn {
	text-align: center;
	background: #9c9ca6;
	color: #fff;
	display: block;
	transition: all .3s;
	height: 60px;
	width: 15px;
	position: relative;
	overflow: hidden;
	float: right;
}
.ftr-navi-btn:hover, .ftr-navi-btn.current {
	color: #fff;
	background: #799ef7;
	transition: all .3s;
	text-decoration: none
}
.ftr-navi-btn.current {
	cursor: default
}
.ftr-navi-btn.open {
	width: 360px
}
.ftr-navi-btn.open span {
	display: none
}
.ftr-navi-btn.open .ftr-navi-over {
	opacity: 1;
	right: 0
}
/**title-------------------------------------------------------**/
.l-ftr-title {
	position: relative;
	background: #fff;
	border-top: solid 1px #f9f8f6;
	border-bottom: solid 1px #f9f8f6;
	min-height: 260px;
}
.l-ftr-title.ttl01 {
	background: url("../img/ttl_01.jpg") no-repeat top center / cover;
}
.l-ftr-title.ttl02 {
	background: url("../img/ttl_02.jpg") no-repeat top center / cover;
}
.l-ftr-title.ttl03 {
	background: url("../img/ttl_03.jpg") no-repeat top center / cover;
}
.l-ftr-title.ttl04 {
	background: url("../img/ttl_04.jpg") no-repeat top center / cover;
}
.l-ftr-title.ttl05 {
	background: url("../img/ttl_05.jpg") no-repeat top center / cover;
}
.showroom .l-ftr-title {
	border-top: solid 1px #f1f1f1;
	border-bottom: solid 1px #f1f1f1;
	background: #f6f6f6 url("../img/c100_image.jpg") no-repeat top center / cover;
}
.showroom .l-title-inr {
	width: 94%;
	min-height: 300px;
	max-width: 1200px;
	position: relative;
	margin-right: auto;
	margin-left: auto;
}
.showroom .ftr-title-text {
	padding: 0;
	font-size: 225%;
	line-height: 1.6;
	text-align: left;
	width: auto;
	text-shadow: #fff 1px 1px 4px, #fff -1px 1px 4px, #fff 1px -1px 4px, #fff -1px -1px 4px, #fff 1px 1px 4px, #fff -1px 1px 4px, #fff 1px -1px 4px, #fff -1px -1px 4px;
}
.showroom .ftr-title-text span {
	display: inline-block;
	text-align: center
}
.ftr-title-text {
	font-family: YakuHanJP, "游ゴシック", YuGothic, Hiragino Kaku Gothic ProN, Hiragino Kaku Gothic Pro, "ＭＳ ゴシック", sans-serif;
	text-align: center;
	width: 100%;
	left: 0;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	font-size: 200%;
	line-height: 2;
	padding: 0 20px;
	box-sizing: border-box;
}
.ftr-title-text .sub {
	font-size: 80%;
}
.title-white {
	border-top: solid 1px #f1f1f1;
	border-bottom: solid 1px #f1f1f1;
	background: #fff
}
.heading-level0 {
	border-top: solid 1px #000;
	padding: 8% 0;
	text-align: center;
	font-size: 30px;
	font-size: 1.875rem
}
.heading-level0.is-margin_top {
	margin-top: 15%
}
.heading-level1 {
	padding-top: 10%;
	padding-bottom: 10%;
	text-align: center;
	font-size: 175%;
	font-weight: 700
}
.heading-level2 {
	font-size: 175%;
	padding-bottom: 1em;
	margin-bottom: 1em;
	border-bottom: solid 1px #ccc
}
.heading-level3 {
	font-size: 118.75%;
	padding-bottom: 1.8em;
	font-weight: 700
}
.heading-level3.center {
	text-align: center
}
/**column-------------------------------------------------------**/
.ftr-imgs {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.ftr-imgs .child {
	flex: 0 1 48%;
}
.ftr-photo_txt {
	display: flex;
}
.ftr-photo_txt.ratio-4_6 .photo {
}
.ftr-photo_txt .photo {
	margin-right: 50px;
}
.ftr-photo_txt .txt + .photo {
	margin-right: 0;
	margin-left: 50px;
}
.ftr-photo_txt.ratio-5_5 .txt {
	flex: 0 1 47%;
}
.ftr-photo_txt.ratio-4_6 .txt {
	flex: 0 1 60%;
}
.ftr-profcol {
	margin-bottom: 50px;
	display: flex;
}
.ftr-profcol .photo {
	flex: 0 1 220px;
	margin-right: 50px;
}
.ftr-profcol .txt {
	flex: 0 1 73%;
}
.ftr-profcol .head {
	line-height: 1.3;
}
.ftr-profcol .pos {
	font-size: 12px;
}
.ftr-profcol .name {
	font-size: 18px;
}
.ftr-profcol .name_roma {
	font-size: 10px;
}
/**caption-------------------------------------------------------**/
p.ftr-caption {
	text-align: center;
	margin-bottom: 15px !important;
}
.ftr-small {
	font-size: 86%;
	padding-top: 5px;
	line-height: 1.5;
	display: inline-block;
}

/**btn-------------------------------------------------------**/
.ftr-btn-black {
	background: #000;
	color: #fff;
	width: 50%;
	padding: 1.5em 0;
	display: block;
	transition: all .3s;
	border: solid 1px #000;
	margin-right: auto;
	margin-left: auto;
	z-index: 2;
	position: relative;
	overflow: hidden;
	text-decoration: none;
	text-align: center;
	line-height: 1
}
.ftr-btn-black:after {
	background: #fff;
	content: '';
	transform: scale(0);
	transition: all .3s;
	z-index: -1;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
}
.ftr-btn-black:hover {
	color: #000;
	text-decoration: none
}
.ftr-btn-black:hover:after {
	transform: scale(1);
	opacity: 1;
}
.ftr-btn-black .s5-icon-window {
	position: absolute;
	top: .5em;
	right: .2em
}
.zoom {
	position: relative;
	display: inline-block;
	background-color: #000;
	overflow: hidden;
}
.zoom:after {
	content: '';
	background: url(../img/ico-zoom.png) no-repeat center center / 100% 100%;
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 60px;
	height: 60px;
	opacity: 0;
	transition: all .3s;
	z-index: 10;
}
.zoom img {
	transition: opacity .3s;
	position: relative;
	z-index: 1;
}
.zoom:hover img {
	opacity: .5;
}
.zoom:hover:after {
	opacity: 1;
	top: 0;
}

/**img-------------------------------------------------------**/
.fit-image {
	width: 100%
}
.ftr-imgwrap {
	display: inline-block;
}

/**text-------------------------------------------------------**/
.comment-name {
	font-weight: 700;
	padding-right: .4em
}
.comment {
	color: #8d7346;
}
.strong {
	font-weight: 700;
}
.sup {
	font-size: 70%
}
.note {
	padding-top: 1em;
	display: inline-block;
	font-size: 75%
}

/**decoration-------------------------------------------------------**/
.hr-glay {
	padding: 0;
	margin: 0;
	border: none;
	border-top: solid 1px #efefef;
	margin-top: 9%;
}
.line {
	font-weight: 400;
	margin-right: .2em;
	position: relative;
	padding-left: 1em
}
.line:after {
	content: '\00a0';
	position: absolute;
	width: 100%;
	height: 1px;
	background: #000;
	top: 50%;
	left: 0
}

/**icon-------------------------------------------------------**/
.ico {
	font-family: icon;
	speak: none;
	font-style: normal;
	font-weight: 400;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	vertical-align: baseline;
	display: inline-block;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}
.ico-right:before {
	content: "\f0da";
	margin: 0 .2em 0 0
}
.ico-down:before {
	content: "\f0d7"
}
.ico-close:before {
	content: "\f00d"
}
.ico-border {
	position: absolute;
	left: 0;
	display: block;
	width: 1em;
	height: 1px;
	border-top: solid 1px #000;
	top: .75em;
}

/**product-------------------------------------------------------**/
.ss-product__colwrap {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 0 -16px;
}
.ss-product__colwrap + * {
	margin-top: 80px;
}
.ss-product__col {
	text-align: center;
	flex: 0 1 30%;
	margin: 0 16px 40px 16px;
}
.ss-product__name {
	text-align: center;
	/*font-size: 110%;*/
	margin-bottom: 20px;
	font-weight: bold;
}
.ss-product__colwrap .s5-button {
	margin: 15px 0 0;
	padding: 14px 15px 12px;
	width: 100%;
	line-height: 1.2;
	color: #fff!important
}

/**footer banner-------------------------------------------------------**/
.l-other-link {
	padding: 1em 0;
	overflow: hidden;
}
.other-link-list {
	float: left;
	width: 23%;
	margin-right: 2.5%;
	margin-bottom: .4em
}
.other-link-list a {
	display: block;
	transition: all .3s;
	font-size: 90%
}
.other-link-list a:hover {
	opacity: .6;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	filter: alpha(opacity=60);
	text-decoration: none
}
.other-link-list img {
	border: solid 1px #ccc;
	display: block;
	width: 100%;
	margin-bottom: .3em
}
.other-link-list-end {
	margin-right: 0
}
.ftr-footer-note {
	margin: 30px 0;
	color: #999;
	font-size: 11px;
	font-size: .6875rem
}

@media screen and (max-width:960px) {
.l-ftr-topnavi {
	padding: 20px 0;
}
.ftr-topnavi {
	display: block;
	margin: 0;
}
.ftr-topnavi-list {
	width: 100%;
	margin: 0 0 .3em 0;
	font-size: 90%;
}
	.ftr-topnavi-list:last-child {
		margin-bottom: 0;
	}
.ftr-topnavi-btn {
	text-align: left;
	line-height: 1.5;
	min-height: 4em
}
.ftr-topnavi-btn .inr {
	height: auto;
	padding: .5em 0 .5em 2em;
	position: relative;
}
.ftr-topnavi-btn .inr.is-oneline {
	padding-top: 1.25em;
	padding-bottom: 1.25em;
}
.ftr-topnavi-btn .ico {
	bottom: auto;
	top: 50%;
	left: 0;
	margin-left: .75em;
	margin-top: -.5em
}
}

@media screen and (max-width:767px) {
#feature {
	font-size: 13px;
	font-size: .8125rem;
	overflow-x: hidden
}
.sp {
	display: block
}
.pc {
	display: none
}
.l-contents {
	width: auto;
	padding: 0 20px
}
.l-contents-inr {
	width: auto;
	padding: 0 20px;
}
.contents-block {
	/*padding-top: 11.71875%*/
}
.l-title-inr {
	width: 90%
}
.ftr-title-bg {
	width: 100%
}
.heading-level0 {
	font-size: 16px;
	font-size: 1rem
}
.heading-level1 {
	font-size: 123.07692%;
	padding-top: 7.14286%;
	padding-bottom: 7.14286%
}
.heading-level2 {
	font-size: 123.07692%;
	font-weight: 700;
	padding-bottom: 1.2em;
	text-align: center
}
.heading-level3 {
	font-size: 100%;
	font-weight: 700;
	padding-bottom: 1.1em
}
.ftr-btn-black {
	width: auto
}
.other-link-list {
	width: 100%
}
.ftr-footer-note {
	margin: 15px 0
}
.ftr-section {
	margin-bottom: 13%;
}
.ftr-section p {
	margin-bottom: 1.3em;
}
.ftr-title-text {
	font-size: 20px;
	line-height: 1.5;
}
.l-ftr-title {
	min-height: 180px;
}
.showroom .l-ftr-title {
	background-image: url("../img/c100_image_sp.jpg");
	min-height: 0;
}
	.showroom .ftr-title-text {
		top: auto;
		left: 20px;
		transform: translateY(0);
		bottom: 20px;
		font-size: 4vw;
	}
	.showroom .l-title-inr {
		min-height: 0;
		padding-top: 46%;
		width: auto;
	}
	.showroom .ftr-title-text span {
		text-align: left;
	}
.ftr-imgs.sp-cp1 {
	display: block;
	text-align: center;
}
.ftr-imgs.sp-cp1 .child:not(:last-child) {
	margin-bottom: 30px;
}
.ftr-photo_txt {
	display: block;
}
.ftr-photo_txt .photo {
	margin: 0 0 30px 0;
	text-align: center;
}
.ftr-photo_txt .txt + .photo {
	margin: 30px 0 0 0;
}
	.ftr-profcol {
		display: block;
	}
	.ftr-profcol .head {
		text-align: center;
	}
	.ftr-profcol .photo {
		margin: 0 0 20px 0;
		text-align: center;
	}
	.ftr-profcol .photo img {
		max-width: 50% !important;
	}
.lead_img {
	padding: 0 10%;
}
	.ss-product__colwrap {
		display: block;
		max-width: 86%;
		margin: 0 auto;
	}
	.ss-product__col:not(:last-child) {
		margin-bottom: 30px;
	}
	.zoom:after {
		width: 30px;
		height: 30px;
	}
}
