@charset "UTF-8";
@media screen and (min-width: 768px),print {  /* 3枚表示のbxslider
-------------------------------------*/

.top-osirase{
	width: 1200px;
	margin: 0 auto;
}


.top-osirase li{
    margin-bottom: 40px;
    border: 1px solid #8c8c8c;
    border-radius: 10px;
    padding: 32px 24px;
	}
	.top-osirase li .wysiwyg{
		margin-bottom: 0;
	}


.new-bnr{
	text-align: center;
}

.slider-fullinner{
position: relative; 
background-color: #f5f6f6;
margin-left: 247px;
background-image: url(../images/index/bg-space.jpg);
background-repeat: repeat-y;
background-position: left 0;
}

.slider-3mai-Box { overflow: hidden; position: relative; width: 100%; padding: 115px 0 60px 0; margin-bottom: 130px;  }
.slider-3mai-Box .main-ttl{ position: absolute; top: 0px; right: 5%; z-index: 198; width: 100%; text-align: right; }

.main-txt{
	position: absolute;
	left: 24px;
	bottom: 24px;
}

.slider-3mai-Box .main-ttl img{ width: 100%; position: relative; right: 0%; }
.slider-3mai-Box .slider-3mai { position: relative; left: 50%; width: 100%; margin-left: -50%; height: auto; padding-top: 0px; }
.slider-3mai-Box .slider-3mai li {  width: 100%; text-align: right; }
.slider-3mai-Box .slider-3mai li img{ position: relative;  width: 100%;}

header .h-logo{
position: absolute;
    top: 30px;
	left: 27px;
z-index: 100;	
}
	header .catch{font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;font-size: 24px;letter-spacing: 5px; font-weight: bold;position: absolute;top: 105px;left: 245px;z-index: 999;}
	
	
header{ width: 100%; margin: 0px;  padding: 0px; position: relative; }


header .h-form{ float: right; width: 400px; position: absolute; z-index: 100; top: 40px; right: 100px;}
header .h-form li{ float: left; }
header .h-form li:last-child{ float: right; }


.main-next-arrow{
	width: 1000px;
	margin:0 auto -17px;;
}

.main-next{ text-align: center;  margin: 0 auto;
    width: 1000px; position: absolute;  bottom: -47px; z-index: 200;}


.main-next-img{
  animation: img_box_9955 3s linear infinite;
  transform-origin: 50% 50%;
  margin: 1rem 0 !important;
}
	
	.modelhouse-bnr{width: 1200px;margin: 0 auto 100px;}
 
@keyframes img_box_9955 {
  0% { transform: translateY(0) }
  33.33333% { transform: translateY(50px) }
  66.66667% { transform: translateY(0) }
  100% { transform: translateY(0) }
}



#g-nav{ display: none; }
body{ position: relative;}
/* page-cold */

.request{ width: 100%;
	background: url('../images/index/request-bg.jpg') top center no-repeat;
	background-color: #f5f6f6;
	padding: 91px 0 140px; text-align: center; margin-bottom: 0px;
}

.request-adjustment{
    margin-top: -24px;
}

.quality{ width: 100%;
	background-color: #f5f6f6;
	padding: 30px 0 0; position: relative;
margin-bottom: 72px;
}

.quality-inner{}

.quality-inner-ttl{
	position: relative;
	z-index: 40;
	width: 100% !important;}

.quality-inner-ttl h4{}
.quality .quality-inner-bg{
	position: absolute;
	right: 0;
	top:-70px;
	text-align: right;
	z-index: 10;}

.quality .quality-inner-bg img{
	width: 90%;}

.quality .quality-inner-bg-black{
	position: absolute;
    bottom: 155px;
	z-index: 80;
}

.quality .quality-inner-bg-black img{
	width: 100%;
}

.quality h4{ text-align: center; margin-bottom: 45px; }
.quality ul{ 
    max-width: 1805px;
    width: 100%;
    margin: 0 auto;
    padding: 0 40px 0 40px;
    position: relative;
    z-index: 100;
}
.quality ul li{ max-width: 33.2%; width: 100%; margin-right: 1px; float: left; margin-bottom: 65px; }

.quality ul li p{
	width: 75%;
    text-align: left;
    margin: 0 auto;
    font-size: 15px;
    line-height: 1.75;
}


.quality ul.quality-adjustment li{ width: 100%; float: left; margin-right: 0;}
.quality ul.quality-adjustment li:nth-child(2){ margin-right: 0; border: none; }
.quality ul.quality-adjustment li p{
	width: 75%;
    margin: 0 auto;
    font-size: 15px;
	line-height: 1.75;
	text-align: center;
	margin-top: 40px;
}




.quality ul li figure{ margin-bottom: 20px; position: relative; }
.quality ul li figure .out{  }
.quality ul li figure .out{ opacity: 1;  transition: 0.3s; position: absolute; left: 0; top: 0; }
.quality ul li figure .out:hover{ opacity: 0;}
.quality ul li img{ width: 100%; }
.quality ul li:nth-child(3){ max-width: 33.2%; margin-right: 0px; }
.quality ul li:nth-child(4){ max-width: 50%; margin-right: 0px; float: left; }
.quality ul li:nth-child(5){ max-width: 50%; margin-right: 0px; float: right; }
.quality .quality-point{ position: absolute; left: 10px; top: 30%; }

#concept{ width: 1900px; position: relative; margin-bottom: 200px; }
#concept .inner{ padding-left: 70px; }
#concept .point{ position: absolute; bottom: 496px; left: 16px; }
#concept .inner h4{ max-width: 680px; width: 100%; font-size: 60px; margin-bottom: 114px; }
#concept .inner h5{
	max-width: 575px;
    width: 100%;
    font-size: 22px;
    line-height: 2.4;
    margin-bottom: 45px;
    font-weight: bold;
}
#concept .inner .txt-bx{ float: left;  }
#concept .inner .txt-bx .btn{ padding-top: 65px; }
#concept .inner .in-txt{ max-width: 530px; width: 100%; font-size: 14px; line-height: 2; }
#concept .inner .in-img{ float: right; padding-top: 100px; margin-left: -200px; }
#concept .inner .in-img img{ width: 100%; }

#concept .adjustment-mb{
margin-bottom: 1.5em;
}

#model-con{ width: 1280px; margin: 0 auto 90px; }
#model-con .ttl{ margin-bottom: 20px; }
#model-con .txt{ font-size: 16px; line-height: 26px; letter-spacing: 0.8px; margin-top: 10px; margin-bottom: 60px; width: 600px; display: inline-block; }
#model-con .btn-area{ width: 580px; float: right; margin-right: 80px; }
#model-con .btn-area .list{ display: flex; justify-content: space-between; }
#model-con .txt1{ font-size: 22px; line-height: 39px; letter-spacing: 1.2px; text-align: center; }

.bnr-box00{ width: 1100px; margin: 0 auto 0; }
.bnr-box00 .list li{ margin-bottom: 70px; }

/*============================
#concept02
============================*/
#concept02 {
	max-width: 1900px;
	margin: 180px auto 170px;
}
#concept02 .bg-box {
	background-image: url(../images/index/concept-bg-full.jpg);
	background-position: center bottom;
	background-repeat: no-repeat;
	position: relative;
	width: 100%;
	padding-left: 100px;
	min-height: 920px;
}
#concept02 .bg-box .abs-box {
	position: absolute;
top: 44px;
left: 0;
}

#concept02 .concept02-ttl{
	max-width: 1900px;
	margin: 0 auto;
font-size: 60px;
margin-bottom: 65px;
margin-left: 100px;
letter-spacing: 0.1em;
}

#concept02 .concept02-ttl02{
    font-size: 22px;
    line-height: 2.4;
    margin-bottom: 45px;
	font-weight: bold;
	letter-spacing: 0.1em;
	padding-left: 100px;
}
#concept02 .bg-box .responsive-box {
	width: 32%;
	margin-right: auto;
padding-top: 300px;
}

#concept02 .bg-box .responsive-box .in-txt {
font-size: 13px;
width: 100%; font-size: 14px; line-height: 2; 
}
#concept02 .bg-box .in-img {
	position: absolute;
	left: 0;
	z-index: 100;
}
#concept02 .bg-box .point {
	position: absolute;
    left: 10px;
	top: 32%;
	height: 145px;
}

#concept02 .adjustment-mb{
	margin-bottom: 1.5em;
	}
#concept02 .adjustment-mb02{
		margin-bottom: 64px;
		}


.bnr-bx{ width: 1100px; margin: 0 auto 97px; }
.bnr-bx li{ float: left; }
.bnr-bx li:last-child{ float: right; }

.msg{ width: 100%; background: #eee; padding: 50px 0; margin-bottom: 72px; }
.msg h6{ width: 1100px; margin: 0 auto 25px; padding: 0 30px; }
.msg .msg-txt{ font-size: 13px; line-height: 1.8; width: 1100px; padding: 0 30px; margin: 0 auto; color: #595757; }

/* --page-cold-- */
/* event -------------------------------------*/
#event{ margin: 0 auto 128px;}
#event h2{ text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 52px;}
#event .btn{ text-align: center; }
#event .inner-Box{ max-width: 1380px; width: 100%; margin: 0 auto;

}
#event .system-list{ margin-bottom: 40px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }

#event .system-list li{ width: 30%; margin-right: 5%; background: #fff; position: relative; margin-bottom: 20px; padding-bottom: 16px; }

#event .system-list li:nth-child(3n){ margin-right: 0;}
#event .system-list li:nth-child(4){ display: none;}
#event .system-list li a:hover{ text-decoration: none; }

#event .system-pic{ width: 100%; height: 345px; overflow: hidden; text-align: center; border: 1px solid #dedede; margin-bottom: 24px; }
#event .system-pic img{ width: auto;height: 100%;display: block;margin: 0 auto;}


#event .system-date{ font-size: 0.75em; margin-bottom: 24px; }
#event .date{ font-size: 16px; }
#event .date span{ display: inline-block; font-size: 10px; padding: 6px 9px 3px; border: 1px solid #000; margin-bottom: 13px; }

#event .system-ttl-01{ 
	letter-spacing: 0.05em;
	font-size: 1em; margin-bottom: 20px; font-weight: bold; line-height: 1.6;}

#event .system-arrow{
	margin: 0px 0px 0px 0px;
	transition: all 1s;
	position: absolute;
	bottom: 0;
	left: 0;
}




/* modelhouse */
#modelhouse{ width: 100%; margin: 0 auto;padding: 100px 0 0px;position: relative; background: url('../images/index/model-bg.jpg') top left no-repeat; background-size: 73%;}
#modelhouse h2{ text-align: left; margin-bottom: 60px; padding-left: 13px;}
#modelhouse .btn{ position: absolute; right: 0; top: 130px; }

#modelhouse .inner-Box{ width: 1200px; margin: 0 auto 112px; }

#modelhouse .system-list{ margin-bottom: 50px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#modelhouse .system-list li{ width: 100%; margin-right: 2%; padding: 0.5%; position: relative; }
#modelhouse .system-list li a:hover{ text-decoration: none; }
#modelhouse .system-pic{ width: 100%; height: 550px; overflow: hidden; text-align: center; }
#modelhouse .system-pic img{ max-width: 100%; max-height: 550px; width: auto; height: auto;}
#modelhouse .system-date{ font-size: 0.75em; margin-bottom: 15px; }
#modelhouse .system-ttl-01{ font-size: 1em; margin-top: 24px; margin-bottom: 16px; font-weight: bold; }
#modelhouse .system-ttl-01 span{ display: inline-block; background: #000;    padding: 8px 25px 6px; color: #fff; margin-right: 15px; font-size: 13px;}

#modelhouse .system-list .system-comment{
	line-height: 1.8;
	margin-bottom: 16px;
	letter-spacing: 0.05em;
}

.system-arrow{
	margin:0px 0px 0px 0px;
	position: relative;
transition: all 1s;}


a:hover .system-arrow{
	transform: translate(50px,0px);
}


	#pickup{width: 1280px;margin: 100px auto 0;border: 1px solid #000;border-radius: 40px;padding-top: 70px;padding-bottom: 50px;margin-bottom: 100px;position: relative;padding-left: 50px;padding-right: 50px;}
	#pickup h4{position: absolute;top: -30px;left: 50px;}
	#pickup .system-list{margin-bottom: 0px;padding: 0px;display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;}
	#pickup .system-list li{ width: 22%; margin-right: 4%; background: #fff; position: relative; }
	#pickup .system-list li:nth-child(4n){ margin-right: 0;}
	#pickup .system-list li a:hover{ text-decoration: none; }
	#pickup .system-pic{ width: 100%; height: 225px; margin-bottom: 15px; overflow: hidden; text-align: center; }
	#pickup .system-pic img{ width: 100%; height: 225px; }
	#pickup .system-date{ font-size: 0.75em; margin-bottom: 5px; line-height: 1.4;}
	#pickup .system-date::before{ }
	#pickup .system-ttl-01{ font-size: 14px;margin-bottom: 28px;line-height: 1.8;font-weight: bold;}
	#pickup .system-arrow{margin: 0px 0px 0px 0px;transition: all 1s;position: absolute;bottom: 0;left: 0;}
	
	
/* case -------------------------------------*/
#case{ max-width: 1400px; width: 100%; margin: 0 auto 100px; padding: 0 0;}
#case h2{ text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 50px;}
#case .btn{ text-align: center; }
#case .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 0px; font-size: 1em; text-align: center; display: inline-block; background: #000; }
#case .btn a:hover{ text-decoration: none; }

#case .inner-Box{ width: 100%; margin: 0 auto;
}

#case .system-list{ margin-bottom: 0px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#case .system-list li{ width: 22%; margin-right: 4%; background: #fff; position: relative; margin-bottom: 45px; }
#case .system-list li:nth-child(4n){ margin-right: 0;}
#case .system-list li a:hover{ text-decoration: none; }
#case .system-pic{ width: 100%; height: 225px; margin-bottom: 15px; overflow: hidden; text-align: center; }
#case .system-pic img{ width: 100%; height: 225px; }
#case .system-date{ font-size: 0.75em; margin-bottom: 5px; line-height: 1.4;}
#case .system-date::before{ }
#case .system-ttl-01{ 
	font-size: 14px;
    margin-bottom: 10px;
    line-height: 1.8;
    font-weight: bold;
}

#case .system-arrow{
	margin: 0px 0px 0px 0px;
	transition: all 1s;
	position: absolute;
	bottom: 0;
	left: 0;
}
#case .system-list .s-txt1{ font-size: 14px; margin-bottom: 5px; line-height: 1.8; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }
#case .system-list .s-txt2{ font-size: 14px; margin-bottom: 30px; line-height: 1.8; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }




/* voice -------------------------------------*/
.slider-3mai-Box2 { overflow: hidden; position: relative; width: 100%; padding-left: 35%; }
.slider-3mai-Box2 .slider-3mai2 {	position: relative;
    left: 10%;
    width: 140%;
    margin-left: -50%;
    margin-top: 81px;  }
.slider-3mai-Box2 .slider-3mai2 li { width: 290px !important; margin-right: 70px !important; }
.slider-3mai-Box2 .bx-wrapper .bx-controls-direction a { position: absolute; top: 40%; outline: 0; width: 50px; height: 100px; text-indent: -9999px; z-index: 9999; }
.slider-3mai-Box2 .bx-wrapper .bx-prev {  left: -50px; background-image: url(../images/index/bx-l.png); background-position: 0 0; }
.slider-3mai-Box2 .bx-wrapper .bx-next { right: 260px; background-image: url(../images/index/bx-r.png); background-position: 0 0; }

#voice{ width: 100%; margin: 0 auto 265px; padding: 0; position: relative;}
#voice h2{ text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 30px;}
#voice .btn{ text-align: center; }
#voice .btn a{ font-weight: lighter; margin: 0 auto; color: #fff;  padding: 13px 52px; font-size: 0.8em; text-align: center; display: inline-block; background: #000; }
#voice .btn a:hover{ background: #333; text-decoration: none; }
#voice .inner-Box{ width: ; margin: 0 auto; position: relative;  }
#voice .ttl-bx{ 
    position: absolute;
    left: 0px;
    top: -10px;
    z-index: 33;
    background: url(../images/index/v-ttl-bg.jpg) top center;
    display: block;
    padding: 182px 90px 190px 100px;
}
#voice .system-list{ margin-bottom: 20px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#voice .system-list li{ 
	padding-bottom: 32px;
	margin-right: 1%; background: #fff; position: relative; margin-bottom: 20px; }
#voice .system-list li a:hover{ text-decoration: none; }

#voice .system-pic{ width: 100%; height: 220px; margin-bottom: 10px; overflow: hidden; text-align: center; position: relative;}

#voice .system-pic img{ width: 100%; height: 220px;}

#voice .system-pic::before{
    content: url(../images/index/bx-deco-l.png);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}

#voice .system-pic::after{
    content: url(../images/index/bx-deco-r.png);
	position: absolute;
	bottom: -3px;
	right: 0;
	z-index: 100;
}

#voice .voice-deco-txt{
position: absolute;
bottom: 0;
left: 0;
}
#voice .voice-deco-txt img{
height: auto;
	}


#voice .system-customer{ font-size: 0.75em; margin-bottom: 10px; line-height: 1.4; }
#voice .system-ttl-01{ font-size: 1em; line-height: 1.4; font-weight: bold; }

#voice .custom-control {
	width: 100%;
	z-index: 300;
	position: absolute;
    top: 222px;
}

#voice .custom-control .custom-prev .bx-prev {
left: 0;
position: absolute;
width: 50px;
height: 50px;
background-image: url(../images/index/bx-l.png);
z-index: 100;
}

#voice .custom-control .custom-next .bx-next {
	width: 50px;
height: 50px;
	right: 0;
position: absolute;
	background-image: url(../images/index/bx-r.png);
	z-index: 100;
}

#voice .system-arrow{
	position: absolute;
	bottom: 0;
	left: 0;
	}




#blog-news{  width: 1100px; margin: 0 auto; padding: 80px 0; }

/* blog -------------------------------------*/
#column{ background: url('../images/index/blog-bg.jpg') top 140px center no-repeat;}
#column h2{ text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 50px;}
#column .btn{ text-align: center; position: relative; bottom: -30px; margin-top: -40px; }
#column .inner-Box{   max-width: 1385px; width: 100%; margin:0 auto 130px;}
#column .system-list{ margin-bottom: 50px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#column .system-list li{
    position: relative;
    width: 23%;
    margin-right: 2.6%;
    overflow: hidden;
    background: #fff;
    margin-bottom: 20px;
    padding-bottom: 32px;
}
#column .system-list li:nth-child(4n){ width: 23%; margin-right: 0%; }

#column .system-pic{ width: 100%; height: 165px; overflow: hidden; text-align: center; margin-bottom: 3%; }
#column .system-pic img{ width: 100%; height: auto; }




#column .system-txt { width: 100%; margin: 0 auto; }
#column .system-date{ font-size: 14px; margin-bottom: 10px; color: #f39700;padding: 3% 5% 0 5%; }
#column .system-date::before{ content: "■"; }
#column .system-ttl{ width: 100%; font-size: 14px; line-height: 1.6; padding: 0 5% 0 5%;
margin-bottom: 16px;
}

#column .system-arrow02{
    position: absolute;
    right: 10px;
    bottom: 16px;
}

#column .name-label-box-dl{
	padding: 0 5% 0 5%;
	display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
	-webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
}

#column .name-label-box-dl .pic{
width: 40px;
margin-right: 16px;
}

#column .name-label-box-dl .name{
font-size: 12px;
padding-top: 14px;
color: #3e3a39;
}




/* topics -------------------------------------*/
#topics{ width: 500px; float: left;}
#topics h2{ text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 80px;}
#topics .btn{ text-align: center; }
#topics .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 1em; text-align: center; display: inline-block; background: #000; }
#topics .btn a:hover{ background: #333; text-decoration: none; }
#topics .inner-Box{ }
#topics .system-list{ margin-bottom: 50px; }
#topics .system-list li{ width: 100%; overflow: hidden; background: #fff; position: relative; border-bottom: 1px dotted #ccc; margin-bottom: 20px; padding-bottom: 20px; }
#topics .system-list li a:hover{ text-decoration: none; }
#topics .system-date{ font-size: 0.75em; margin-bottom: 10px; }
#topics .system-date::before{ content: "■"; }
#topics .system-ttl{ width: 80%; font-size: 1em; line-height: 1.4; }
#topics .system-category{ font-size: 0.625em; color: #fff; text-align: center; padding: 3px; background-color: #111; width: 30%; margin-bottom: 10px;}




/* information -------------------------------------*/
#information{ max-width: 800px; width: 100%; margin: -40px auto 80px; padding: 0 0;}
#information .ttl{ text-align: center; margin: 0 auto 37px;}
#information .btn{ text-align: center; margin-top: 10px;}
#information .inner-Box{ width: 100%; margin: 0 auto;}
#information .system-list{ margin-bottom: 0px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#information .system-list li{ width: 100%; background: #fff; position: relative; margin-bottom: 18px; border-bottom: 1px solid #C2C2C2; padding-bottom: 7px;}
#information .system-list li a:hover{ text-decoration: none; }
#information .system-date{ font-size: 14px; margin-bottom: 5px; letter-spacing: 1px; line-height: 1.4; color: #AF1E23; font-weight: bold;}
#information .system-date a{ color: #AF1E23; }
#information .system-ttl-01{ font-size: 14px;line-height: 1.8;font-weight: bold;letter-spacing: 0.8px;}
#information .system-arrow{margin: 0px 0px 0px 0px;transition: all 1s;position: absolute;bottom: 0;left: 0;}


/* plan-bx -------------------------------------*/
#plan-bx {width: 900px; margin: 0 auto 80px;}
#plan-bx .bnt{text-align: center;}

}














@media screen and (max-width: 1820px) {
	#column{
		padding-left: 60px;
		padding-right: 60px;
	}
	}


@media screen and (max-width: 1750px) {
#concept02 .bg-box .responsive-box {
	width: 30%;
	padding-right: 5em;
}
}


@media screen and (max-width: 1520px) {
		#case .inner-Box{
			padding-left: 60px;
			padding-right: 60px;
		}
		#event .inner-Box{ max-width: 1380px; width: 100%; margin: 0 auto;
			padding-left: 60px;
			padding-right: 60px;
		}
		#modelhouse .inner-Box {
width: 100%;
			padding-left: 60px;
			padding-right: 60px;
		}
}
@media screen and (max-width: 1200px) {
#voice {
    width: 120%;
}
}

@media screen and (max-width: 1130px) {
.quality .quality-inner-bg-black{
	position: static;
}
}

@media screen and (max-width: 767px) {

	.new-bnr{
		width: 94vw;
		margin: 0 auto;
		}

		.top-osirase{
			width: 94vw;
			margin: 6vw auto 0;
		}

		.top-osirase li{
			margin-bottom: 5vw;
			border: 1px solid #8c8c8c;
			border-radius: 12px;
			padding: 16px;
		}
		.top-osirase li .wysiwyg{
			margin-bottom: 0;
		}



#bx-sra { height: 131vw; margin-top: 18%; }
.request{ width: 100%; background: url('../sp-images/index/req-bg.jpg') top center no-repeat; background-size: 100%; padding: 6% 0; text-align: center; margin-bottom: 16.4%; }
.request h3{ width: 49.2%; margin: 0 auto 2%; }

.quality{ width: 100%; position: relative;  margin-bottom: 13%;}
.quality h4{ text-align: center; margin-bottom: 8%; }

.quality ul{ width: 100%; margin: 0 auto;
}

.quality ul li:nth-child(3){margin-bottom: 10%;}
.quality ul li:nth-child(4){margin: 0 auto 6%; }
.quality ul li:nth-child(5){margin: 0 auto 10%; }

.quality ul li{ width: 100%; margin: 0 auto 10%; padding:0 3% 0 3%; }
.quality ul li p{ width: 100%; text-align: left; margin: 0 auto; font-size: 0.875em; line-height: 1.6;}
.quality ul li figure{ margin-bottom: 3%; }
.quality ul li img{ width: 100%; }
.quality .quality-point{ display: none; }

.quality .quality-adjustment{
	background-color: #f5f6f6;
	padding-top: 10%;
}

.quality .quality-adjustment p{

}


#model-con{ margin: 10vw 5vw 14vw; }
#model-con .ttl{ margin-bottom: 3vw; }
#model-con .txt{ font-size: 3.6vw; line-height: 1.6; letter-spacing: 0.242vw; margin-bottom: 5vw; text-align: center; }
#model-con .btn-area .list{ display: flex; justify-content: space-between; margin-bottom: 5vw; }
#model-con .btn-area .list li{ width: 46%; }
#model-con .txt1{ font-size: 4.6vw; line-height: 1.6; letter-spacing: 0.242vw; text-align: center; }

.bnr-box00{ margin: 9vw 5vw 0; }
.bnr-box00 .list li{ margin-bottom: 8vw; }

#concept02{
margin-bottom: 22%;
}


#concept02 .bg-box .responsive-box {
	width: 100%;
	margin-right: 0;
padding-top: 0px;

padding-left: 2.66%;
padding-right: 2.66%;

}

#concept02 .in-txt{
	font-size: 0.813em;
	line-height: 1.7;
	letter-spacing: 0.05em;
}

#concept02 .adjustment-mb{
margin-bottom: 1.5em;
}

#concept02 .adjustment-mb02{
	margin-bottom: 10%;
	}

.bnr-bx{ width: 100%; margin: 0 auto 10%; }
.bnr-bx li{ float: none; width: 95%; margin: 0 auto 10%; }

.msg{ width: 100%; background: #f5f6f6; padding: 8% 5%;}
.msg h6{ width: 100%; margin: 0 auto 6%; }
.msg .msg-txt{ font-size: 0.75em; line-height: 1.9; width: 100%; padding: 0; margin: 0 auto; color: #595757; }

/* event -------------------------------------*/
#event{ width: 100%; margin: 0 auto;     padding: 10px 0 0px;
margin-bottom: 24%;	
}

#event .inner-Box{ max-width: 100%; width: 100%; margin: 0 auto;
padding-left: 2.66%;
padding-right: 2.66%;

}


#event h2{ text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 9%;}
#event .btn{ text-align: center; width: 53.3%; margin: 0 auto; }

#event .system-list{ margin-bottom: 4.5%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#event .system-list li{ width: 48%; margin-right: 4%; background: #fff; position: relative; margin-bottom: 7%; }
#event .system-list li:nth-child(2n){ margin-right: 0;}
#event .system-list li a:hover{ text-decoration: none; }

#event .system-pic{ width: 100%; overflow: hidden; text-align: center; margin-bottom: 5%; }
#event .system-pic img{ max-width: 100%; width: auto; height: auto;}

#event .system-date{ font-size: 0.813em; margin-bottom: 5%; }
#event .date{ font-size: 0.813em; line-height: 1.6; }

#event .date span{ display: inline-block; font-size: 0.6em; padding: 2% 5% 1%; border: 1px solid #000; margin-bottom: 10px; }

#event .system-ttl-01{ font-size: 0.875em; margin-bottom: 13%; line-height: 1.6; font-weight: bold;
}

#event .system-arrow{
position: absolute;
bottom: 0;
left: 0;
}


/* modelhouse */
#modelhouse{ width: 100%; margin: 0 auto 14%; padding: 8% 2.66% 0 2.66%; position: relative; background: url('../images/index/model-bg.jpg') top left no-repeat;background-size: 190%; }


#modelhouse h2{ text-align: center; margin-bottom: 11%; }
#modelhouse .btn{ text-align: center; padding: 0 5%; width: 66%; margin:0 auto; }


#modelhouse .inner-Box{ width: 100%; margin: 0 auto;
padding-left: 0%;
padding-right: 0%;
}


#modelhouse .system-list{ 
		margin-bottom: 11%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#modelhouse .system-list li{ width: 100%; position: relative; margin-bottom: 0; }
#modelhouse .system-list li a:hover{ text-decoration: none; }
#modelhouse .system-pic{ width: 100%;  text-align: center; margin: 0 0 3% 0; }
#modelhouse .system-pic img{ max-width: 100%; width: auto; height: auto;}
#modelhouse .system-date{ font-size: 0.75em; margin-bottom: 15px; }

#modelhouse .system-ttl-01{ font-size: 1em; margin-bottom: 2%; font-weight: bold; line-height: 1.7; }
#modelhouse .system-ttl-01 span{ 
	display: block;
    background: #000;
    padding: 1.5% 4%;
    color: #fff;
	font-size: 0.625em;
	margin-bottom: 2%;
	width: 11em;
	text-align: center;
}


#modelhouse .system-comment{ font-size: 0.8em; margin-bottom: 3%; line-height: 1.8;
}

.system-arrow{
	margin:0px 0px 0px 0px;
	position: relative;
transition: all 1s;}


a:hover .system-arrow{
	transform: translate(50px,0px);
}


	#pickup{width: 94%;margin: 0 auto 0;border: 1px solid #000;border-radius: 20px;padding-top: 5%;padding-bottom: 5%;margin-top:15%;margin-bottom: 15%;position: relative;}
	#pickup h4{width: 35%; position: absolute;top: -4vw;left: 5vw;}
	#pickup .system-list{margin-bottom: 0px;padding: 0px;padding: 3%;background-image: url("../images/index/bg-space.jpg");display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;}
	#pickup .system-list li{ width: 48%; margin-right: 4%; background: #fff; position: relative; margin-bottom: 10%;  }
	#pickup .system-list li:nth-child(2n){ margin-right: 0;}
	#pickup .system-list li:nth-child(3){margin-bottom: 0px;}
	#pickup .system-list li:nth-child(4){margin-bottom: 0px;}
	#pickup .system-list li a:hover{ text-decoration: none; }
	#pickup .system-pic{ width: 100%; height: 140px; margin-bottom: 15px; overflow: hidden; text-align: center; }
	#pickup .system-pic img{ width: 100%; height: 140px; }
	#pickup .system-date{ font-size: 0.75em; margin-bottom: 3%; line-height: 1.4;}
	#pickup .system-ttl-01{ font-size: 0.875em; margin-bottom: 16%; line-height: 1.4; font-weight: bold;}
	#pickup .system-arrow{position: absolute;bottom: 0;left: 0;}
	
	
	
/* case -------------------------------------*/
#case{ width: 100%; margin: 0 auto 13%; padding: 0px 0;}
#case h2{ text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 6%;}
#case .btn{ text-align: center; padding: 0 5%; width: 66%; margin: 0 auto; }
#case .inner-Box{ width: 100%; margin: 0 auto;
padding-left: 2.66%;
padding-right: 2.66%;
}


#case .system-list{ margin-bottom: 0px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#case .system-list li{ width: 48%; margin-right: 4%; background: #fff; position: relative; margin-bottom: 10%;  }
#case .system-list li:nth-child(2n){ margin-right: 0;}
#case .system-list li a:hover{ text-decoration: none; }
#case .system-pic{ width: 100%; height: 140px; margin-bottom: 15px; overflow: hidden; text-align: center; }
#case .system-pic img{ width: 100%; height: 140px; }
#case .system-date{ font-size: 0.75em; margin-bottom: 3%; line-height: 1.4;}
#case .system-ttl-01{ font-size: 0.875em; margin-bottom: 5%; line-height: 1.4; font-weight: bold;}

#case .system-list li:nth-child(n+7){ 
display: none;
 }


#case .system-arrow{
	position: absolute;
	bottom: 0;
	left: 0;
	}
#case .system-list .s-txt1{ font-size: 0.8rem; margin-bottom: 1vw; line-height: 1.8; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }
#case .system-list .s-txt2{ font-size: 0.8rem; margin-bottom: 6vw; line-height: 1.8; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }


/* voice -------------------------------------*/
#voice{ width: 100%; margin: 0 auto 14vw; padding: 13% 2.66%;
background-image: url(../sp-images/index/voice-bg.png);
}

#voice .btn{ text-align: center;
width: 57.14%;
margin: 0 auto;
}

#voice .inner-Box{ width: 100%; margin: 0 auto; }
#voice .system-list{ margin-bottom: 10%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#voice .system-list li{ width: 48%; margin-right: 4%; position: relative; margin-bottom: 4%; line-height: 1.4; padding: 0; }
#voice .system-list li:nth-child(2){ margin-right: 0; }

#voice .system-list li:nth-child(n+3){
display: none;
}

#voice .system-list li a:hover{ text-decoration: none; }

#voice .system-pic{ width: 100%; max-height: 141px; height: auto; margin-bottom: 6%; overflow: hidden; text-align: center; position: relative; }

#voice .system-pic img{ width: 100%; height: 141px; }

#voice .system-pic::before{
    content: url(../sp-images/index/bx-deco-l.png);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}
#voice .system-pic::after{
    content: url(../sp-images/index/bx-deco-r.png);
	position: absolute;
	bottom: -5%;
	right: 0;
	z-index: 100;
}


#voice .voice-deco-txt{
	position: absolute;
	bottom: 0;
	left: 0;
	}
	#voice .voice-deco-txt img{
	height: auto;
		}

#voice .system-customer{ font-size: 0.8rem; margin-bottom: 4%; }
#voice .system-ttl-01{ font-size: 0.9rem; margin-bottom: 16%;
font-weight: bold;
}

#voice .ttl-bx{
width: 27.88%;
margin: 0 auto 6%;
}

#voice .system-arrow{
	position: absolute;
	bottom: 0;
	left: 0;
	}



#blog-news{ width: 100%; margin: 0 auto; }

/* blog -------------------------------------*/
#column{ padding: 0; 
margin-bottom: 14%;
}

#column h2{
    text-align: center;
    font-size: 2em;
    font-weight: bold;
    width: 75%;
	margin: 0 auto 6%;
	padding: 0 2.66%;
}


#column h2.ano{
	width: 94vw;
}

#column .btn{ 
	width: 57.1%;
	margin: 0 auto;
}

#column .sp-bg{
		
	background-image:
	url(../sp-images/index/bg-space.jpg),
	url(../sp-images/index/bg-space.jpg),
	url(../sp-images/index/voice-bg.png);
background-position:
	right top,
	right bottom,
	0 0;
background-repeat:
	repeat-x,
	repeat-x,
	repeat;
	background-size:
	2%,
	2%,
	auto;


	padding: 0 2.66%;



}


#column .inner-Box{  }
#column .system-list{ 
display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#column .system-list li{ width: 48%; margin-right: 4%; overflow: hidden; background: #fff; margin-bottom: 5%; padding-bottom: 8%; position: relative; }
#column .system-list li:nth-child(2n){ width: 48%; margin-right: 0%; }
#column .system-pic{ width: 100%; height: auto; overflow: hidden; text-align: center; margin-bottom: 3%; }
#column .system-pic img{ max-width: 100%; height: auto; }
#column .system-txt { margin-bottom: 24%;}
#column .system-date{ font-size: 0.813em; margin-bottom: 10px; color: #f39700; padding: 5% 5% 0 5%; }
#column .system-date::before{ content: "■"; }
#column .system-ttl{ width: 100%; font-size: 0.813em; line-height: 1.6; padding: 0% 5% 0 5%; }

#column .system-arrow02{
    position: absolute;
    right: 10px;
    bottom: 16px;
}

#column .name-label-box-dl{
position: absolute;
bottom: 8%;
left: 5%;
width: 94%;
margin: 0 auto;
display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
-webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
}

#column .name-label-box-dl .pic{
	width: 20%;
	margin-right: 5%;
}
#column .name-label-box-dl .name{
	width: 75%;
	font-size: 0.625em;
	line-height: 1.5;
}


/* topics -------------------------------------*/
#topics{ width: 100%; padding: 15% 3%;}
#topics h2{ text-align: center; font-size: 1.4rem; font-weight: bold; margin-bottom: 10%; }
#topics .btn{ text-align: center; }
#topics .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 3%; text-align: center; display: block; background: #000; }
#topics .btn a:hover{ background: #333; text-decoration: none; }
#topics .inner-Box{ width: 100%; margin: 0 auto; }
#topics .system-list{ margin-bottom: 10%; }
#topics .system-list li{ width: 100%; background: #fff; overflow: hidden; position: relative; border-bottom: 1px dotted #ccc; margin-bottom: 5%; padding-bottom: 5%; }
#topics .system-list li a:hover{ text-decoration: none; }
#topics .system-date{ font-size: 0.8rem; margin-bottom: 3%; }
#topics .system-date::before{ content: "■"; }
#topics .system-ttl{ width: 80%; font-size: 0.9rem; margin-bottom: 5%; }


#end-contact {
	margin: 0% auto 0; 
	background-image: url(../sp-images/common/cv-bg.jpg);
	background-size: cover;
	}


/* information -------------------------------------*/
#information{ width: 100vw; margin: 10vw auto 15vw; padding: 0 0;}
#information .ttl{ text-align: center; width: 40vw; margin: 0 auto 5vw;}
#information .btn{ text-align: center; width: 80vw; margin: 3vw auto;}
#information .inner-Box{ width: 90vw; margin: 0 auto;}
#information .system-list{ margin-bottom: 0px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#information .system-list li{ width: 100%; background: #fff; position: relative; margin-bottom: 3vw; border-bottom: 1px solid #C2C2C2; padding-bottom: 1vw }
#information .system-list li:nth-child(2n){ margin-right: 0;}
#information .system-date{ font-size: 3.6vw; margin-bottom: 1vw; line-height: 1.4; color: #AF1E23; font-weight: bold;}
#information .system-date a{ color: #AF1E23;}
#information .system-ttl-01{ font-size: 3.6vw; margin-bottom: 2vw; line-height: 1.6; font-weight: bold;}
#information .system-list li:nth-child(n+4){ display: none;}
#information .system-arrow{position: absolute;bottom: 0;left: 0;}

/* plan-bx -------------------------------------*/
#plan-bx {width: 90%; margin: 0 auto 15vw;}
#plan-bx .bnt{text-align: center;}

}