@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);	
/* CSS Document */
body, h1, h2, h3, h4, h5, h6, p, address, ul, ol, li, dl, dt, dd, table, th, td, img, form{
	font-size: 1em;
}
body{
	color:#000 !important;
	font-family: "Noto Sans CJK JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size:16px!important;
	margin-right: auto;
	margin-left : auto;
	line-height: 2em;
	letter-spacing:0.05em; 
	width:100vw;
}
body,p{
	color:#000 !important;
	font-family: "Noto Sans CJK JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}
#wrap{
	max-width: 980px;
	margin:auto;
}
li{
	list-style-type: none;
	font-size: 1em;
}
ul{
	padding: 0;
}
#contents{
	width:100vw;
}
.text_box{
	
}
.small_text{
	font-size:0.875em;
	line-height:1.714; 
}
.indexafter_sttl01{
	text-align: center;
    line-height: 1.7;
    color: #000;
	font-size: 0.875em;
}
.ttl{
	text-align: center;
	font-size: 1.688em;
    margin: 2% 0;
	color:#000;
	letter-spacing: 0.05em;
	line-height: 1.481;
	
}
.sttl{
	margin-bottom: 5em;
}
.product_ttl{
	font-size: 21px !important;
	color: #3C3C3C;
	line-height: 3em;
	margin-top: 5.714em;
	margin-bottom: 1.905em;	
}
#homa_top{
	margin:2.938em 2.04% 5em;	
}
#slider_top img{
	max-width: 940px;
	max-height: 460px;
}
.homa-logo{
	text-align: center;
	margin-top:2.5em;
	margin-bottom: 3.125em;
}
.homa-logo img{
	width: 15.043em;
}
.sub_ttl01{
	font-size: 1em;
	text-align: center;
	margin-bottom: 1.875em;
	
}
.sub_ttl02{
	font-size: 1em;
	text-align: center;
	color: #333;
	line-height: 1.5;
}
.flexbox01 .sub_ttl02{
	margin-bottom: 1em;
}
#design{
	
}
.design_image img{
	width: 100vw;
	margin: 0 calc(50% - 50vw);
}
.design_ttl{
	margin:60px 0;
	
}

.flex{
	display:flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.flexbox01{
	margin:0 5.1%;
}
.flexbox02{
	margin: 0 2%;
}
#homa_type .flexbox02:first-child{
	margin-bottom: 4.25em;
}
.flex3{
	width:25%;
}

.icon{
	text-align: center;
	margin-bottom: 15%;
}

.flex4{
	width:20%;
}
.flex4 dl dd{
	font-size: 0.75em;
	text-align: center;
	margin: 0;
}
.type_image img{
	width:100%;
}
span.type_name{
	font-weight: bold;
	font-size: 1.313em;
	
}
.homa-{
	margin: 5%;
	font-size: 0.625em;
}
.flex4 dt{
	line-height: 4em;
	text-align: center;
	margin: 2%;
}
.flex4 dd{
	text-align: center;
}
.homa_gallery{
	margin-bottom: 9.375em;
}
#gallery_slider{
	max-width: 850px;
	margin: auto;
}

.slider-pro .sp-image-container img.sp-image{
	max-width: 850px;
	max-height: 500px;
}

footer{
	width:100vw;
}
@media screen and (max-width: 480px) {
/* 480pxまでの幅の場合に適応される */
	
	span.type_name {
    font-size: 1.5em;
	}
	.flex3{
		width:100%;
		margin-bottom: 10%;
	}
	
	.flex4{
		width:50%;
		margin-bottom: 10%;
	}
	#homa_type .flexbox02:first-child {
    	margin-bottom: 0;
	}
}
/*下部スライダー*/
.sp-arrow, .sp-thumbnail-arrow{
    height: 35px !important;
}
.sp-previous-arrow:before, .sp-previous-arrow:after, .sp-next-arrow:before, .sp-next-arrow:after,.sp-next-thumbnail-arrow:before,.sp-next-thumbnail-arrow:after, .sp-previous-thumbnail-arrow:before,.sp-previous-thumbnail-arrow:after{ content: none !important;}

.sp-horizontal .sp-previous-arrow, .sp-horizontal .sp-next-arrow,.sp-previous-thumbnail-arrow,.sp-next-thumbnail-arrow{
	background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2215.374%22%20height%3D%2234.396%22%20viewBox%3D%220%200%2015.374%2034.396%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_48%22%20data-name%3D%22%E3%83%91%E3%82%B9%2048%22%20d%3D%22M1095.3%2C159.488a1.4%2C1.4%2C0%2C1%2C1%2C2.186%2C1.738l-11.816%2C14.886%2C11.892%2C14.979a1.4%2C1.4%2C0%2C1%2C1-2.186%2C1.738L1082.805%2C177a1.4%2C1.4%2C0%2C0%2C1-.016-1.758Z%22%20transform%3D%22translate(-1082.486%20-158.96)%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E')!important;
	background-repeat: no-repeat;
}
.sp-next-thumbnail-arrow{
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}
.sp-bottom-thumbnails .sp-thumbnail-container {
	margin-right: 20px !important;
}

.sp-bottom-thumbnails { margin-top: 1.25em!important; }

.sp-fade-arrows {
	opacity: 1 !important;
}
.sp-horizontal .sp-previous-arrow {
    left: 10px !important;
}
.sp-horizontal .sp-next-arrow {
    right: 10px !important;
}