@charset "UTF-8";
@media screen and (min-width: 768px),print {  /* 3枚表示のbxslider
  -------------------------------------*/
.slideall{ background: url('../images/index/main-back.jpg') repeat-x bottom center; padding-top: 120px; padding-bottom: 160px; padding-right: 300px; position: relative; }
.slideall .main-logo{top: 24%;right: 30px;position: absolute;}
.slideall .main-banner01{ bottom: 210px; right: 0px; position: absolute; }
.slideall .main-banner02{ bottom: 130px; right: 0px; position: absolute; }
.slideall .main-banner03{ bottom: -32px; left: 40px; position: absolute; z-index: 100;}

.bx-wrapper .bx-pager { position: absolute; left: -35px; top: 415px; text-align: left; }
.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item{ display: block; }
  .slider-3mai-Box { overflow: hidden; position: relative; width: 100%!important; height: 47.448vw; padding-left: 50px;}
  .slider-3mai-Box .slider-3mai { width: 100%!important; height: auto;}
  .slider-3mai-Box .slider-3mai li { width: 100%!important; height: auto;}
  .slider-3mai-Box .slider-3mai li img{ width: 100%!important; height: auto;}
  .slider-3mai-Box .bx-wrapper .bx-controls-direction a { position: absolute; top: 40%; outline: 0; width: 50px; height: 100px; text-indent: -9999px; z-index: 9999; }
  .slider-3mai-Box .bx-wrapper .bx-prev { left: 950px; background-image: url(../images/index/bx-l.jpg); background-position: 0 0; }
  .slider-3mai-Box .bx-wrapper .bx-next { right: 950px; background-image: url(../images/index/bx-r.jpg); background-position: 0 0; }

#top #g-nav .snsb{ display: none; }
#top #g-nav ul { width: 100%; }
  .side-fix { display: none;}
header {     height: 120px; }
header .snsb{ position: absolute; top: 26px; right: 27px;}
header .snsb a{display: inline-block;margin-left: 10px;}
header .snsb a:nth-child(3){ position: relative; top: 4px; }
header .snsb a:nth-child(4){  position: relative; top: -1px; }
header .h-text{left: 320px;top: 22px;}
header .h-ar {left: 630px;top: 24px;}

.slideall .snsb2{ position: absolute; bottom: 325px; right: 68px;}
.slideall .snsb2 a{display: inline-block;margin-left: 10px;}
.slideall .snsb2 a:nth-child(3){ position: relative; top: 4px; }
.slideall .snsb2 a:nth-child(4){  position: relative; top: 1px; }
.slideall .snsb2 a:nth-child(5){  position: relative; top: 1px; }

  /*============================ #c-1 ============================*/
  #c-1 { padding-top: 103px; padding-bottom: 100px; background-color: #f2f1ec; }
  #c-1 .inner .ttl { font-size: 50px; font-weight: 700; line-height: 60px; letter-spacing: 1.8px; margin-bottom: 58px; text-align: center; position: relative; }
  #c-1 .inner .sy-list { width: 1400px; margin: 0 auto; margin-bottom: 35px; display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  #c-1 .inner .sy-list > li { width: 440px; margin-right: 40px; margin-bottom: 40px; position: relative; }
  #c-1 .inner .sy-list > li a:hover { text-decoration: none; }
  #c-1 .inner .sy-list > li:hover .sy-ttl { text-decoration: underline; }
  #c-1 .inner .sy-list > li:nth-child(3n) { margin-right: 0px; }
  #c-1 .system-icon02{ position: absolute; top: -8px; left: -8px; }
  #c-1 .system-icon02 .icon02-01{ display: inline-block; text-align: center; line-height: 1.2; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #FBC636; }
  #c-1 .system-icon02 .icon02-02{ display: inline-block; text-align: center; line-height: 1.2; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #D0121B; color: #fff; }
  #c-1 .system-icon02 .icon02-03{ display: inline-block; text-align: center; line-height: 1.2; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #000000; color: #fff; }
  #c-1 .system-icon02 .icon02-04{ display: inline-block; text-align: center; line-height: 1.2; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #cccccc; }
  #c-1 .system-icon02 .icon02-05{ display: inline-block; text-align: center; line-height: 1.2; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 22px 0 12px; background-color: #385495; color: #fff; }

  #c-1 .icon-box{ width: 200px; overflow: hidden; position: absolute; top: 283px; right: 0px; }
  #c-1 .system-icon001{ float: left; margin-right: 10px; }
  #c-1 .system-icon001 .icon001-01{ display: inline-block; text-align: center; line-height: 1.2; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #FBC636; }
  #c-1 .system-icon001 .icon001-02{ display: inline-block; text-align: center; line-height: 33px; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #D0121B; color: #fff; }
  #c-1 .system-icon001 .icon001-03{ display: inline-block; text-align: center; line-height: 33px; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #000000; color: #fff; }
  #c-1 .system-icon002{ float: left; margin-right: 10px; }
  #c-1 .system-icon002 .icon002-01{ display: inline-block; text-align: center; line-height: 1.2; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #FBC636; }
  #c-1 .system-icon002 .icon002-02{ display: inline-block; text-align: center; line-height: 33px; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #D0121B; color: #fff; }
  #c-1 .system-icon002 .icon002-03{ display: inline-block; text-align: center; line-height: 33px; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #000000; color: #fff; }
  #c-1 .system-icon003{ float: left; margin-right: 0px; }
  #c-1 .system-icon003 .icon003-01{ display: inline-block; text-align: center; line-height: 1.2; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #FBC636; }
  #c-1 .system-icon003 .icon003-02{ display: inline-block; text-align: center; line-height: 33px; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #D0121B; color: #fff; }
  #c-1 .system-icon003 .icon003-03{ display: inline-block; text-align: center; line-height: 33px; font-size: 14px;letter-spacing: 0; width: 60px; height: 60px; border-radius: 60px; padding: 12px 0; background-color: #000000; color: #fff; }

  #c-1 .new-icon{ width: 60px; height: 60px; color: #fff; position: absolute; top: -20px; left: -20px; }
  #c-1 .icon-event01{font-size: 16px;font-weight: bold;color: #fff; line-height: 60px; text-align: center;background-color: #cb2725; border-radius: 60px;}
  #c-1 .icon-event02{font-size: 16px;font-weight: bold;color: #000; line-height: 60px; text-align: center; background-color: #ffde69; border-radius: 60px;}
  #c-1 .icon-event03{font-size: 16px;font-weight: bold;color: #fff; line-height: 60px; text-align: center; background-color: #000; border-radius: 60px;}

  #c-1 .inner .sy-list .sy-pic { width: 440px; text-align: center; height: 300px; margin-bottom: 10px; }
  #c-1 .inner .sy-list .sy-pic img { max-width: 100%; max-height: 300px; height: auto; }
  #c-1 .inner .sy-list .ste-box { margin-bottom: 8px; display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  #c-1 .inner .sy-list .ste-box > p { font-size: 16px; font-weight: 500; }
  #c-1 .inner .sy-list .ste-box .ste-txt-n { width: 80px; height: 30px; background-color: #cd371f; color: #ffffff; padding-left: 19px; padding-top: 3px; }
  #c-1 .inner .sy-list .ste-box .ste-txt-on { width: 80px; height: 30px; background-color: #ffffff; color: #cd371f; padding-left: 16px; padding-top: 3px; }
  #c-1 .inner .sy-list .ste-box .ste-txt-off { width: 160px; height: 30px; background-color: #0d0d0d; color: #ffffff; padding-left: 32px; padding-top: 3px; }
  #c-1 .inner .sy-list .sy-ttl { color: #0d0d0d; font-size: 18px; font-weight: 700; letter-spacing: 0.9px; line-height: 28px; margin-bottom: 10px; }
  #c-1 .inner .sy-list .sy-dd-list > li { margin-bottom: 8px; display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  #c-1 .inner .sy-list .sy-dd-list .l { width: 60px; padding-bottom: 5px; background-image: url(../images/index/line-dt.jpg); background-repeat: repeat-x; background-position: 0 bottom; padding-left: 14px; padding-top: 1px; color: #999999; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-size: 14px; font-weight: 500; letter-spacing: normal; line-height: 28px; }
  #c-1 .inner .sy-list .sy-dd-list .r { width: calc(100% - 60px); padding-bottom: 5px; background-image: url(../images/index/line-dd.jpg); background-repeat: repeat-x; background-position: 0 bottom; padding-left: 15px; padding-top: 0px; color: #0d0d0d; font-size: 14px; font-weight: 500; letter-spacing: normal; line-height: 28px; }
  .btn-01_p1 a { display: block; width: 580px; margin: 0 auto; height: 60px; border: 1px solid #d2d1cc; background-color: #ffffff; color: #0d0d0d; font-size: 16px; font-weight: 500; letter-spacing: normal; text-align: center; padding-top: 16px; padding-left: 5px; background-image: url(../images/index/btn-deco.svg); background-repeat: no-repeat; background-position: right 17px top 22px; }
  .btn-01_p1 a:hover { background-color: #fbc600; text-decoration: none; }

#top-renovation { overflow-x: clip; } /* 移設で直した（ご判断 J13）：画面の外に出ている部分を切る・幅を詰める（見えている範囲は変えない。現行は文書の幅が画面より広かった）：中の .in-inner（1200px）が 1100px の枠から出る分 */
#top-renovation .bx{width: 100%; max-width: 1920px; margin: 0 auto 56px; background: url(../images/index/top-renovation-bg.png) no-repeat top 50px center; padding: 123px 0;}
#top-renovation .bx .inner{width: 1100px; margin: 0 auto; position: relative;}
#top-renovation .bx .inner .in-inner{width: 1200px; margin-right: auto;}
#top-renovation .bx .inner .in-inner .ttl{font-size: 18px; letter-spacing: 1.5px; margin-bottom: 25px; margin-left: 8px}
#top-renovation .bx .inner .in-inner .ttl1 {
  margin-bottom: 24px;
}

#top-renovation .bx .inner .in-inner .ttl1 .span1 {
  width: 590px;
  font-size: 31px;
  font-weight: bold;
  letter-spacing: 3.3px;
  margin-bottom: 3px;
  display: inline-block;
  background: #fff;
  padding: 0px 5px 0px 0;
}

#top-renovation .bx .inner .in-inner .ttl1 .span2 {
  width: 765px;
  font-size: 31px;
  font-weight: bold;
  letter-spacing: 3.3px;
  margin-bottom: 5px;
  display: inline-block;
  background: #fff;
  padding: 0px 5px 0px 0;
}

#top-renovation .bx .inner .in-inner .ttl1 .span3 {
  width: 840px;
  font-size: 31px;
  font-weight: bold;
  letter-spacing: 3.3px;
  margin-bottom: 5px;
  display: inline-block;
  background: #fff;
  padding: 0px 0px 0px 0;
}
#top-renovation .bx .inner .in-inner .ttl1 .span4 {
  width: 860px;
  font-size: 31px;
  font-weight: bold;
  letter-spacing: 3.3px;
  margin-bottom: 0px;
  display: inline-block;
  background: #fff;
  padding: 0px 0px 0px 0;
}
#top-renovation .bx .inner .in-inner .txt{font-size: 16px; font-weight: bold; color: #1E9A4C; line-height: 2.25; letter-spacing: 0.8px; margin-bottom: 75px}
#top-renovation .bx .inner .in-inner .img{}
#top-renovation .bx .inner .in-inner .btn{}


#contents06{ background: url('../images/index/contents06-back.jpg')no-repeat top center;color: #fff;}
#contents06 .inner-Box{ width: 1100px; margin: 0 auto; position: relative; height: 560px; padding-top: 70px; }
#contents06 .inner-Box h2{ font-size: 16px; font-weight: 700; letter-spacing: 1.6px; margin-bottom: 36px; line-height: 0.85; margin-left: 5px}
#contents06 .inner-Box h2 span{ margin-top: 30px; font-size: 48px; font-weight: 400; letter-spacing: 4.8px; display: block; }
#contents06 .inner-Box ul{ width: 600px; margin-bottom: 35px; }
#contents06 .inner-Box li{ display: inline-block; margin-bottom: 10px; padding: 14px 15px; background: #1e9a4c; font-size: 20px; font-weight: 700; line-height: 1; letter-spacing: 3px;}
#contents06 .inner-Box li span{ font-size: 24px; color: #ffff00; }


#case{ width: 1100px; margin: 0 auto; padding: 130px 0 50px 0; }
#case h2{ font-size: 38px; font-weight: 700; letter-spacing: 3.8px; line-height: 1.5; position: relative; padding-left: 128px; margin-bottom: 45px; }
#case h2 .span1{ display: block; font-size: 18px; font-weight: 400; letter-spacing: 1.8px; }
#case h2 .span2{ display: block; font-size: 16px; font-weight: 400; letter-spacing: 0.75px; }
#case h2::before{ content: url('../images/index/contents05-icon.png'); position: absolute; top: -10px; left: 0; }
#case .inner-Box{ position: relative; }
#case .inner-Box .btn{ position: absolute; top: 30px; right: 0px; }
#case .system-list{ margin-bottom: 30px; 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{ line-height: 1.4; width: 22.4%; margin-right: 3.4%; background: #fff; position: relative; margin-bottom: 20px;}
#case .system-list li:nth-child(4n){ margin-right: 0}
#case .system-list li a:hover{ text-decoration: none; }
#case .system-list .btn{ text-align: center; background: #333; color: #fff; font-size: 0.75em; position: absolute; bottom: 0; left: 0; width: 100%;}
#case .system-list .btn::after { content: ' >';}
#case .system-pic{ width: 100%; height: 180px; overflow: hidden; text-align: center; }
#case .system-pic img{ width: 100%; height: 180px; }
#case .system-date{ font-size: 14px; margin-bottom: 5px; line-height: 1.4; }
#case .system-coment{ font-size: 0.75em; margin-bottom: 5px; line-height: 1.4; }
#case .system-ttl-01{ font-size: 16px; margin-bottom: 20px; line-height: 1.4; }
#case .system-list .system-category { margin-bottom: -6px;  position: relative; font-size: 12px; text-align: center; }
#case .system-list .serchcategory{ margin-bottom: 100px;}
#case .system-list .system-category-set{ background-color: #FFFF00;  height: 30px;  padding-top: 8px; padding-right: 127px;}
#case .system-list .system-category .icon { height: 30px; width: 127px; position: absolute; top: 0; right: 0; display: inline-block; font-size: 0.688em; font-weight: bold; color: #fff; text-align: center; padding: 10px 20px; background-color: #111; }
#case .system-list .serchcategory{  }
#case .system-list .serchcategory a{ display: inline-block; padding: 7px 40px; margin-right: 20px; background-color: #FFFF00; font-size: 12px;}


#top-showroom {}
#top-showroom .bx{width: 1100px; margin: 0 auto 75px;}
#top-showroom .bx .ttl{font-size: 24px; font-weight: bold; letter-spacing: 2px; text-align: center; margin-bottom: 15px;}
#top-showroom .bx .inner{
  /* width: 1100px; */
  width: 800px;
  margin: 0 auto; background: url(../images/index/top-showroom-bg.jpg) no-repeat top center; padding: 30px 35px 38px; position: relative; }
#top-showroom .bx .inner .ttl1{margin-bottom: 120px;}
#top-showroom .bx .inner .icon{text-align: right; margin-right: 30px; margin-bottom: 40px;}
#top-showroom .bx .inner .btn{text-align: right; margin-right: 90px; margin-bottom: 220px;}

#top-showroom .bx .inner .in-bx1{width: 1000px; margin: 0 auto; position: relative;}
#top-showroom .bx .inner .in-bx1 .in-inner1{margin-left: 384px; line-height: 1.8}
#top-showroom .bx .inner .in-bx1 .in-inner1 .logo{ border-right: 1px solid #707070; position: absolute; left: 0; top: 0; padding-right: 25px;}
#top-showroom .bx .inner .in-bx1 .in-inner1 .in-txt{font-size: 16px; letter-spacing: 0.8px; line-height: 1.95}
#top-showroom .bx .inner .in-bx1 .in-inner1 .map{font-size: 18px; letter-spacing: 0.8px; position: absolute; right: 15px; top: 0}


	#top-showroom .bx .inner h3{font-size: 40px;font-weight: bold;text-align: center;color: #fff;margin-bottom: 20px;}
	#top-showroom .bx .inner ul{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;}
	/* #top-showroom .bx .inner ul li{width: 485px;margin-right: 60px;} */

#top-showroom .bx .inner ul li{
  width: 485px;
  margin: 0 auto;
}


	#top-showroom .bx .inner ul li:nth-child(2){margin-right: 0;}
	#top-showroom .bx .inner ul li dt{margin-bottom: 20px;}
	#top-showroom .bx .inner ul li dd{}
	#top-showroom .bx .inner ul li dd h4{font-size: 26px;font-weight: bold;margin-bottom: 3px;}
	#top-showroom .bx .inner ul li dd p{font-size: 16px; margin-bottom: 20px;}
	#top-showroom .bx .inner ul li dd .gmap-btn{width: 200px;}
	#top-showroom .bx .inner ul li dd .gmap-btn a{display: block; width: 100%;background-color: #fff;border: 1px solid #999;border-radius: 20px;font-size: 16px;text-align: center;padding: 5px 0 3px;}
	#top-showroom .bx .inner ul li dd .gmap-btn a:hover{text-decoration: none;}
	

#top-service {}
#top-service .ttl{font-size: 42px; font-weight: bold; letter-spacing: 3px; text-align: center; line-height: 1.5; margin-bottom: 50px}
#top-service .ttl span{font-size: 18px; font-weight: 500; letter-spacing: 2px;}
#top-service .bx{width: 100%; max-width: 1920px; margin: 0 auto; background: url(../images/index/top-service-bg1.jpg) no-repeat top center; padding: 110px 0 64px}
#top-service .bx .inner{width: 1000px; margin: 0 auto;}
#top-service .bx .inner .ttl1{text-align: center; margin-bottom: 38px;}
#top-service .bx .inner .btn{text-align: center; }
#top-service .bx1{width: 100%; max-width: 1920px; margin: 0 auto 48px; background: url(../images/index/top-service-bg2.jpg) no-repeat top center; padding: 75px 0 150px}
#top-service .bx1 .ttl2{font-size: 50px; font-weight: bold; letter-spacing: 2.5px; text-align: center; color: #fff;}
#top-service .bx1 .ttl3{font-size: 26px; letter-spacing: 1.3px; text-align: center; color: #fff; margin-bottom: 25px;}
#top-service .bx1 .inner1{width: 1188px; margin: 0 auto; background: #f5f4f2; padding: 10px 40px 50px 45px; border-radius: 20px;}
#top-service .bx1 .inner1 .btn1{text-align: center; margin-top: -18px; margin-bottom: 55px;}
#top-service .bx1 .inner1 .flex-bx{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; }
#top-service .bx1 .inner1 .flex-bx .list1{width: 520px;  margin: 0 auto;}
#top-service .bx1 .inner1 .flex-bx .list1 li{margin-bottom: 20px;}
#top-service .bx1 .inner1 .flex-bx .list1 li:last-child{margin-bottom: 0px;}
#top-service .bx1 .inner1 .flex-bx .list2{}
#top-service .bx1 .inner1 .flex-bx .list2 li{margin-bottom: 20px;}
#top-service .bx1 .inner1 .flex-bx .list2 li:last-child{margin-bottom: 0px;}


#contents07{ text-align: center; padding: 0px 0px 20px; background: url(../images/index/contents07-bg.jpg) no-repeat top 310px center;}
#contents07 .inner-Box h2{ margin-bottom: 17px; margin-right: -20px;}
#contents07 .inner-Box figure{ margin-right: 10px; margin-bottom: -25px;}
#contents07 .inner-Box p{ font-size: 20px; font-weight: 700; letter-spacing: 1px; line-height: 36px; margin-bottom: 90px; }
#contents07 .kurashi-img{ margin: 0 auto 40px;}
#contents07 .inner-Box{ overflow-x: clip; } /* 移設で直した（ご判断 J13）：画面の外に出ている部分を切る・幅を詰める（見えている範囲は変えない。現行は文書の幅が画面より広かった）：見出しの margin-right: -20px の分 */


  #blog-news{  width: 1200px; margin: 0 auto; padding: 145px 0 50px 0; border-bottom: 2px dashed #111; margin-bottom: 30px; }

  /* blog -------------------------------------*/
  #blog{ width: 360px; float: left; margin-right: 57px; position: relative; }
  #blog h2{ margin-bottom: 17px; }
  #blog .btn{ position: absolute; top: 0; right: 0; }
  #blog .inner-Box{ }
  #blog ul{ background-color: #f2f2f2; padding: 30px 20px; height: 480px; overflow-y:scroll; }
  #blog ul li{ border-bottom: 1px #111 dotted; padding-bottom: 16px; margin-bottom: 20px; }
  #blog ul .photo{ width: 36%; min-height: 90px; float: left; }
  #blog ul .system-pic{ width: 100%; }
  #blog ul .system-pic img{ max-width: 100%; height: auto; }
  #blog ul .text-b{ width: 61%; float: left; margin-left: 2%; }
  #blog .icon{ background: #E74863; line-height: 1; padding: 3px 10px; color: #fff; font-size: 12px;}
  #blog ul .system-date{ margin-bottom: 10px; font-size: 0.938em; line-height: 1.4; }
  #blog ul .system-ttl-01{ width: 100%; font-size: 0.938em; line-height: 1.6; margin-bottom: 10px; }
  #blog ul .system-category-set { width: 100%; float: right; margin-bottom: 15px;}
  #blog ul .system-category{ width: 100%; margin-right: 1px; font-size: 0.625em; font-weight: bold; color: #fff; text-align: center; padding: 4px; float: left; background: #111; margin-bottom: 2px;}
  #blog ul .system-contributor { width: 78%; float: right; color: #bbb; font-size: 0.75em; text-align: right;}
  

  /*#topics -------------------------------------*/
  #topics{ width: 360px; float: left; margin-right: 57px; position: relative; }
  #topics h2{ margin-bottom: 17px; }
  #topics .btn{ position: absolute; top: 0; right: 0; }
  #topics .inner-Box{ }
  #topics ul{ background-color: #f2f2f2; padding: 30px 20px; height: 480px; overflow-y:scroll; }
  #topics ul li{ border-bottom: 1px #111 dotted; padding-bottom: 16px; margin-bottom: 20px; }
  #topics .icon{ background: #E74863; line-height: 1; padding: 3px 10px; color: #fff; font-size: 12px;}
  #topics ul .system-date{ margin-bottom: 10px; font-size: 0.938em; line-height: 1.4; }
  #topics ul .system-ttl-01{ width: 100%; font-size: 0.938em; line-height: 1.6; margin-bottom: 10px; }
  #topics ul .system-category-set { width: 100%; float: right; margin-bottom: 15px;}
  #topics ul .system-category{ width: 100%; margin-right: 1px; font-size: 0.625em; font-weight: bold; color: #fff; text-align: center; padding: 4px; float: left; background: #111; margin-bottom: 2px;}
  #topics ul .system-contributor { width: 78%; float: right; color: #bbb; font-size: 0.75em; text-align: right;}

 .banner-box{ width: 360px; float: left; }
 .banner-box p{ margin-bottom: 20px; }

#contents-sns{ width: 1200px; margin: 0 auto 118px; }
#contents-sns h2{ float: left; width: 245px; padding-left: 20px; padding-top: 28px; }
#contents-sns p a{ display: inline-block; margin-right: 34px; }
#contents-sns p a:nth-child(5n){ margin-right: 0px; }

.seo{ width: 1100px!important; margin: 0 auto; color: #b3b3b3; padding-top: 20px; font-size: 12px; font-weight: 400; letter-spacing: 1.2px; line-height: 24px; }
#end-contact{  }

	#youtube{padding: 150px 0 0 0;position: relative;}
	#youtube .frame .en{font-size: 150px;font-weight: 500; text-align: center;letter-spacing: 8.0px;color: #f5f4f2; margin-bottom: 5px;position: absolute;top: 20px;left: 0;right: 0;text-align: center;}
	#youtube .frame h2{font-size: 24px;font-weight: bold;text-align: center; margin-bottom: 25px;position: relative;z-index: 1;}
	#youtube .frame h2 .red{color: #c50100;}
	#youtube .frame #youtube-list { width: 1200px; margin: 0 auto 35px; background: #fff; padding: 40px 0 5px;}
	#youtube .frame #youtube-list .bx-wrapper .bx-viewport{ min-height: 230px; }
	#youtube .frame #youtube-list .slider-3mai-Box1 { width: 1040px; margin: 0 auto 5px; }
	#youtube .frame #youtube-list .slider-3mai-Box1 li { width: 320px !important; margin-right: 40px; }
	#youtube .frame #youtube-list .slider-3mai-Box1 li img{ max-height: 180px; margin-bottom: 25px;}
	#youtube .frame #youtube-list .slider-3mai-Box1 li .text { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-size: 14px; font-weight: 500; line-height: 1.55; }
	#youtube .frame #youtube-list .slider-3mai-Box1 li a .text{text-decoration: underline;}
	#youtube .frame #youtube-list .slider-3mai-Box1 li a:hover .text{text-decoration: none;}
	#youtube .frame #youtube-list .slider-3mai-Box1 .bx-prev { top: 119px; left: -80px; background-image: url(../images/index/bxl.svg); background-repeat: no-repeat; background-position: center 0; width: 50px; height: 50px; }
	#youtube .frame #youtube-list .slider-3mai-Box1 .bx-prev:hover { opacity: 0.8; }
	#youtube .frame #youtube-list .slider-3mai-Box1 .bx-next { top: 119px; right: -80px; background-image: url(../images/index/bxr.svg); background-repeat: no-repeat; background-position: center 0; width: 50px; height: 50px; }
	#youtube .frame #youtube-list .slider-3mai-Box1 .bx-next:hover { opacity: 0.8; }
	
	
	
}

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

#bx-sra {}
	#bx-sra .bx-wrapper .bx-viewport ul li img{}
.bx-wrapper .bx-pager { text-align: right; margin-right: 4vw; height: 11vw; }
.sl-btm{ position: relative;width: 100%;height: 87vw; }
	.sl-btm figure img{width: 100%;height: 39vw;}
.sl-btm .main-banner03{ width: 41.721vw; top: -23.468vw; padding-left: 2.999vw; position: absolute; z-index: 100; }
	.sl-btm .main-banner03 img{width: 100%;height: 39vw;}
.sl-btm .main-banner01{ margin-top: 5.867vw; margin-bottom: 18.859vw; padding: 0px 2.608vw;  }
	.sl-btm .main-banner01 img{width: 100%;height: 23vw;}
.bx-wrapper .bx-pager.bx-default-pager a { border: none; background: #ccc; text-indent: -9999px; display: block; width: 3vw; height: 1vw; margin: 0vw 1vw 0; position: relative; right: 10vw; outline: 0; overflow: hidden; padding-top: 3vw;}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active { background: #111; border: none;}

/*============================ #c-1 ============================*/
#c-1 { padding-top: 15.217vw; padding-bottom: 16.908vw; background-color: #f2f1ec; }
#c-1 .bx-wrapper .bx-prev {left: -2.246vw; width: 9.662vw; height: 9.662vw;  background-image: url(../images/index/sp-bxl.svg); background-repeat: no-repeat; background-position: center 0; }
#c-1 .bx-wrapper .bx-next {right: -2.039vw; width: 9.662vw; height: 9.662vw;  background-image: url(../images/index/sp-bxr.svg); background-repeat: no-repeat; background-position: center 0; }
#c-1 .bx-wrapper .bx-controls-direction a { z-index: 100; top: 39.643vw; }
#c-1 .sy-list-box { width: 93.71vw; margin: 0 auto; margin-bottom: 5.314vw; }
#c-1 .inner .ttl { text-align: center; font-size: 9vw; font-weight: 700; line-height: 1.8; letter-spacing: 0.483vw; position: relative; margin-bottom: 4vw; }
#c-1 .inner .sy-list > li { margin-right: 7.246vw; position: relative; 
padding: 7vw 6vw 0;
}
#c-1 .system-icon02{ position: absolute; top: 0vw; left: 0vw; }
#c-1 .system-icon02 .icon02-01{ display: inline-block; text-align: center; line-height: 1.2; font-size: 2.8vw;letter-spacing: 0; width: 12.5vw; height: 12.5vw; border-radius: 60px; padding: 2.9vw 0; background-color: #FBC636; }
#c-1 .system-icon02 .icon02-02{ display: inline-block; text-align: center; line-height: 1.2; font-size: 2.8vw;letter-spacing: 0; width: 12.5vw; height: 12.5vw; border-radius: 60px; padding: 2.9vw 0; background-color: #D0121B; color: #fff; }
#c-1 .system-icon02 .icon02-03{ display: inline-block; text-align: center; line-height: 1.2; font-size: 2.8vw;letter-spacing: 0; width: 12.5vw; height: 12.5vw; border-radius: 60px; padding: 2.9vw 0; background-color: #000000; color: #fff; }
#c-1 .system-icon02 .icon02-04{ display: inline-block; text-align: center; line-height: 1.2; font-size: 2.8vw;letter-spacing: 0; width: 12.5vw; height: 12.5vw; border-radius: 60px; padding: 2.9vw 0; background-color: #cccccc; }
#c-1 .system-icon02 .icon02-05{ display: inline-block; text-align: center; line-height: 1.2; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 4.9vw 0 2.9vw; background-color: #385495; color: #fff; }

#c-1 .icon-box{ overflow: hidden; margin-bottom: 2.5vw; }
#c-1 .system-icon001{ float: left; margin-right: 1vw; }
#c-1 .system-icon001 .icon001-01{ display: inline-block; text-align: center; line-height: 1.2; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #FBC636; }
#c-1 .system-icon001 .icon001-02{ display: inline-block; text-align: center; line-height: 2.4; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #D0121B; color: #fff; }
#c-1 .system-icon001 .icon001-03{ display: inline-block; text-align: center; line-height: 2.4; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #000000; color: #fff; }
#c-1 .system-icon002{ float: left; margin-right: 1vw; }
#c-1 .system-icon002 .icon002-01{ display: inline-block; text-align: center; line-height: 1.2; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #FBC636; }
#c-1 .system-icon002 .icon002-02{ display: inline-block; text-align: center; line-height: 2.4; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #D0121B; color: #fff; }
#c-1 .system-icon002 .icon002-03{ display: inline-block; text-align: center; line-height: 2.4; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #000000; color: #fff; }
#c-1 .system-icon003{ float: left; margin-right: 0vw; }
#c-1 .system-icon003 .icon003-01{ display: inline-block; text-align: center; line-height: 1.2; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #FBC636; }
#c-1 .system-icon003 .icon003-02{ display: inline-block; text-align: center; line-height: 2.4; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #D0121B; color: #fff; }
#c-1 .system-icon003 .icon003-03{ display: inline-block; text-align: center; line-height: 2.4; font-size: 3.2vw;letter-spacing: 0; width: 14vw; height: 14vw; border-radius: 60px; padding: 2.9vw 0; background-color: #000000; color: #fff; }

#c-1 .new-icon{ width: 14vw; height: 14vw; line-height: 14vw; text-align: center; color: #fff; position: absolute; top: 0vw; left: 0vw; }
#c-1 .icon-event01{font-size: 3.6vw;font-weight: bold;letter-spacing: 0.05em;margin-bottom: 1.3vw;color: #fff; background-color: #cb2725; border-radius: 60px;}
#c-1 .icon-event02{font-size: 3.6vw;font-weight: bold;letter-spacing: 0.05em;margin-bottom: 1.3vw;color: #000;background-color: #ffde69; border-radius: 60px;}
#c-1 .icon-event03{font-size: 3.6vw;font-weight: bold;letter-spacing: 0.05em;margin-bottom: 1.3vw;color: #fff;background-color: #000; border-radius: 60px;}

#c-1 .inner .sy-list .sy-pic { width: 100%; height: 80vwvw; margin-bottom: 3.623vw; text-align: center; }
#c-1 .inner .sy-list .sy-pic img { max-width: 100%; height: auto; }
#c-1 .inner .sy-list .ste-box {display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;  margin-bottom: 3.382vw; -webkit-box-lines: multiple; -moz-box-lines: multiple; }
#c-1 .inner .sy-list .ste-box > p { font-size: 3.623vw; font-weight: 500; line-height: 6.28vw; letter-spacing: normal; }
#c-1 .inner .sy-list .ste-box .ste-txt-n { width: 19.324vw; height: 7.246vw; padding-top: 0.725vw; padding-left: 4.589vw; color: #fff; background-color: #cd371f; }
#c-1 .inner .sy-list .ste-box .ste-txt-on { width: 19.324vw; height: 7.246vw; padding-top: 0.725vw; padding-left: 3.865vw; color: #cd371f; background-color: #fff; }
#c-1 .inner .sy-list .ste-box .ste-txt-off { width: 38.647vw; height: 7.246vw; padding-top: 0.725vw; text-align: center; color: #fff; /* padding-left: 3.865vw; */ background-color: #0d0d0d; }
#c-1 .inner .sy-list .sy-ttl {font-size: 4.4vw; font-weight: 700; line-height: 1.6; margin-bottom: 3.865vw; letter-spacing: 0.181vw;  color: #0d0d0d; }
#c-1 .inner .sy-list .sy-dd-list > li {display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;  padding-bottom: 1.932vw; -webkit-box-lines: multiple; -moz-box-lines: multiple; }
#c-1 .inner .sy-list .sy-dd-list .l {font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-size: 3.382vw; font-weight: 500; line-height: 6.763vw;  width: 14.493vw; padding-top: 0.242vw; padding-bottom: 1.932vw; padding-left: 3.382vw; letter-spacing: normal; color: #999; background-image: url(../images/index/line-dt.jpg); background-repeat: repeat-x; background-position: 0 bottom; }
#c-1 .inner .sy-list .sy-dd-list .r {font-size: 3.382vw; font-weight: 500; line-height: 6.763vw;  width: calc(100% - 14.493vw); padding-top: 0; padding-left: 1.932vw; letter-spacing: normal; color: #0d0d0d; background-image: url(../images/index/line-dd.jpg); background-repeat: repeat-x; background-position: 0 bottom; }
.btn-01_p1 a {font-size: 3.382vw; font-weight: 500; line-height: 3.382vw;  display: block; width: 79.71vw; height: 14.493vw; margin: 0 auto; padding-top: 5.314vw; text-align: center; letter-spacing: normal; color: #0d0d0d; border: 1px solid #d2d1cc; background-color: #fff; background-image: url(../images/index/btn-deco.svg); background-repeat: no-repeat; background-position: right 3.14vw top 5.314vw; }
.btn-01_p1 a:hover {text-decoration: none;  background-color: #fbc600; }

#top-renovation {width: 100%;height: 226vw;}
#top-renovation .bx{width: 95vw; margin: 0 auto 5vw; background: url(../images/index/sp-top-renovation-bg.png) no-repeat top center; padding: 5vw 0 15vw; background-size: 103%}
#top-renovation .bx .inner{width: 90vw; margin: 0 auto; position: relative;}
#top-renovation .bx .inner .in-inner{}
#top-renovation .bx .inner .in-inner .ttl{font-size: 4vw; letter-spacing: 0.3vw; text-align: center; margin-bottom: 3vw; margin-left: 1vw}
#top-renovation .bx .inner .in-inner .ttl1 {margin-bottom: 5vw;}
#top-renovation .bx .inner .in-inner .ttl1 .span1{font-size: 3.75vw; font-weight: bold; letter-spacing: 0.1vw; margin-bottom: 1vw; display: inline-block; background: #fff; }
#top-renovation .bx .inner .in-inner .ttl1 .span2{font-size: 3.75vw; font-weight: bold; letter-spacing: 0.1vw; margin-bottom: 1vw; display: inline-block; background: #fff; }
#top-renovation .bx .inner .in-inner .ttl1 .span3{font-size: 3.75vw; font-weight: bold; letter-spacing: 0vw; margin-bottom: 1vw; display: inline-block; background: #fff; }
#top-renovation .bx .inner .in-inner .ttl1 .span4{font-size: 3.75vw; font-weight: bold; letter-spacing: 0vw; margin-bottom: 1vw; display: inline-block; background: #fff; }
#top-renovation .bx .inner .in-inner .txt{font-size: 3.6vw; font-weight: bold; color: #1E9A4C; line-height: 2; letter-spacing: 0.2vw; margin-bottom: 8vw}
#top-renovation .bx .inner .in-inner .img{text-align: center; margin-bottom: 8vw}
	#top-renovation .bx .inner .in-inner .img img{width: 100%;height: 87vw;}
#top-renovation .bx .inner .in-inner .btn{width: 65vw; margin: 0 auto;}
	#top-renovation .bx .inner .in-inner .btn img{width: 100%;height: 16vw;}


#contents06{ background: url('../images/index/sp-contents06-back.jpg')no-repeat top center;color: #fff; background-size: 100% auto; padding-bottom: 25vw; margin: 0 0 25vw 0;}
#contents06 .inner-Box{ margin: 0px 3.129vw; padding-top: 25.293vw;}
#contents06 .inner-Box h2{ text-align: center; font-size: 4.694vw; font-weight: 700; letter-spacing: 0.209vw; margin-bottom: 6.519vw; line-height: 1; }
#contents06 .inner-Box h2 span{ margin-top: 5.997vw; font-size: 13.258vw; font-weight: 400; letter-spacing: 0.626vw; display: block; }
#contents06 .inner-Box ul{ margin-bottom: 50.126vw; }
#contents06 .inner-Box li{ display: block; margin-bottom: 2.304vw; padding: 3.608vw 1vw 3.911vw 3vw; background: #1e9a4c; font-size: 3.6vw; font-weight: 700; line-height: 1; letter-spacing: 0.1vw}
#contents06 .inner-Box li span{ font-size: 4.2vw; color: #ffff00; }
#contents06 .btn{ width: 70vw; margin: 0 auto;  }
	#contents06 .btn img{width: 100%;height: 16vw;}


/* case_newly -------------------------------------*/
#case{ padding: 0vw 4.433vw 20vw; }
#case .spttl{ width: 82.008vw; margin: 0px auto 10vw auto;  }
	#case .spttl img{width: 100%;height: 36vw;}
#case .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; }
#case .system-list li{ position: relative; line-height: 1.4; width: 49%; margin-right: 2%; background: #fff; position: relative; margin-bottom: 5%; }
#case .system-list li:nth-child(2n){ margin-right: 0}
#case .system-list li a:hover{ text-decoration: none; }
#case .system-list .btn{ text-align: center; background: #333; color: #fff; font-size: 1.2rem; position: absolute; bottom: 0; left: 0; width: 100%; padding:4% 3%;}
#case .system-list .btn::after { content: ' >';}
#case .system-pic{ width: 100%; height: 120px; overflow: hidden; text-align: center; }
#case .system-pic img{ width: 100%; height: 120px; }
#case .system-date{ font-size: 1.2rem; margin-bottom: 5%; }
#case .system-ttl-01{ font-size: 1.4rem; margin-bottom: 5%; line-height: 1.6; }
#case .system-category-set { padding: 1vw 2vw; background: #FFFF00; text-align: center; font-size: 3vw; }
#case .icon { width: 100%; background: #111; display: inline-block;margin-right: 1%;margin-bottom: 3%;font-size: 1.2rem;color: #fff;text-align: center;padding: 1.5% 3%; }
#case .btn{ width: 60vw; margin: 0 auto;  }
	#case .btn img{width: 100%;height: 16vw;}


#top-showroom {}
#top-showroom .bx{width: 100vw; margin: 0 auto 5vw;}
#top-showroom .bx .ttl{font-size: 4vw; font-weight: bold; letter-spacing: 0.2vw; text-align: center; margin-bottom: 5vw;}
#top-showroom .bx .inner{width: 100vw; margin: 0 auto; background: url(../images/index/sp-top-showroom-bg.jpg) no-repeat top center; padding: 6vw 0 10vw; position: relative; background-size: 100%;}
#top-showroom .bx .inner .ttl1{width: 90vw; margin: 0 auto 98vw; }
	#top-showroom .bx .inner .ttl1 img{width: 100%;height: 28vw;}
#top-showroom .bx .inner .icon{width: 85vw; margin: 0 auto 43vw;}
	#top-showroom .bx .inner .icon img{width: 100%;height: 28vw;}
#top-showroom .bx .inner .btn{width: 65vw; margin: 0 auto 8vw;}

#top-showroom .bx .inner .in-bx1{width: 100vw; margin: 0 auto; position: relative; background: #F5F5F5; padding: 8vw 5vw 0;}
#top-showroom .bx .inner .in-bx1 .in-inner1{padding: 0 5vw 5vw}
#top-showroom .bx .inner .in-bx1 .in-inner1 .logo{ width: 100%; margin: 0 auto 5vw;}
#top-showroom .bx .inner .in-bx1 .in-inner1 .in-txt{font-size: 3.6vw; letter-spacing: 0.2vw; line-height: 1.9;}
#top-showroom .bx .inner .in-bx1 .in-inner1 .map{font-size: 4vw; letter-spacing: 0.2vw; margin-top: 3vw; margin-left: 15vw}

	
	
	#top-showroom .bx .inner h3{font-size: 6.8vw;font-weight: bold;text-align: center;color: #fff;margin-bottom: 5vw;}
	#top-showroom .bx .inner ul{width: 80%;margin: 0 auto;}
	#top-showroom .bx .inner ul li{margin-bottom: 10vw;}
	#top-showroom .bx .inner ul li:nth-child(2){margin-bottom: 0;}
	#top-showroom .bx .inner ul li dt{margin-bottom: 3vw;}
	#top-showroom .bx .inner ul li dt img{width: 100%;}
	#top-showroom .bx .inner ul li dd{}
	#top-showroom .bx .inner ul li dd h4{font-size: 5.8vw;font-weight: bold;margin-bottom: 2vw;}
	#top-showroom .bx .inner ul li dd p{font-size: 3.8vw; margin-bottom: 5vw;}
	#top-showroom .bx .inner ul li dd .gmap-btn{width: 80%;margin: 0 auto;}
	#top-showroom .bx .inner ul li dd .gmap-btn a{display: block; width: 100%;background-color: #fff;border: 1px solid #999;border-radius: 10vw;font-size: 3.8vw;text-align: center;padding: 2vw 0 1vw;}
	#top-showroom .bx .inner ul li dd .gmap-btn a:hover{text-decoration: none;}
	
	

#top-service {}
#top-service .ttl{font-size: 7vw; font-weight: bold; letter-spacing: 0.5vw; text-align: center; line-height: 1.5; margin-bottom: 5vw}
#top-service .ttl span{font-size: 3.6vw; font-weight: 500; letter-spacing: 0.2vw;}
#top-service .bx{width: 100vw; margin: 0 auto; background: url(../images/index/sp-top-service-bg1.jpg) no-repeat top center; padding: 10vw 0 12vw; background-size: 100%}
#top-service .bx .inner{width: 100vw; margin: 0 auto;}
#top-service .bx .inner .ttl1{text-align: center; margin-bottom: 37vw;}
#top-service .bx .inner .btn{width: 90vw; margin: 0 auto; }
#top-service .bx1{width: 100vw; margin: 0 auto 10vw; background: url(../images/index/sp-top-service-bg2.jpg) no-repeat top center; padding: 10vw 0 20vw; background-size: 100%}
#top-service .bx1 .ttl2{font-size: 6vw; font-weight: bold; letter-spacing: 0.5vw; text-align: center; color: #fff;}
#top-service .bx1 .ttl3{font-size: 4vw; letter-spacing: 0.1vw; text-align: center; color: #fff; margin-bottom: 5vw;}
#top-service .bx1 .inner1{width: 90vw; margin: 0 auto; background: #f5f4f2; padding: 5vw 2vw; border-radius: 3vw;}
#top-service .bx1 .inner1 .btn1{text-align: center; margin-top: -5vw; margin-bottom: 8vw;}
#top-service .bx1 .inner1 .flex-bx{padding: 0 3vw}
#top-service .bx1 .inner1 .flex-bx .list1{margin: 0 auto 5vw;}
#top-service .bx1 .inner1 .flex-bx .list1 li{margin: 0 auto 3vw;}
#top-service .bx1 .inner1 .flex-bx .list1 li:last-child{margin-bottom: 0;}
#top-service .bx1 .inner1 .flex-bx .list2{}
#top-service .bx1 .inner1 .flex-bx .list2 li{margin: 0 auto 3vw;}
#top-service .bx1 .inner1 .flex-bx .list2 li:last-child{margin-bottom: 0;}


#contents07{ text-align: center; padding: 0 0 15vw; background: url(../images/index/contents07-bg.jpg) no-repeat top 49vw center; background-size: 280%}
#contents07 .inner-Box h2{ width: 60vw; margin: 0 auto 5vw;}
#contents07 .inner-Box figure{ margin: 0 auto 3vw;}
#contents07 .inner-Box p{ font-size: 4.6vw; font-weight: 700; letter-spacing: 0.2vw; line-height: 1.6; margin-bottom: 10vw; }
#contents07 .inner-Box .btn{ width: 70vw; margin: 0 auto;}
#contents07 .kurashi-img{width: 90vw; margin: 0 auto 6vw;}


  #blog-news{  margin: 0vw 4vw; padding: 10vw 0 6vw 0; border-bottom: 1px dashed #111; margin-bottom: 6vw; }
  
  /* blog -------------------------------------*/
  #blog{ position: relative; margin-bottom: 14vw; }
  #blog h2{ width: 40.156vw; margin-bottom: 17px; }
  #blog .btn{ width: 36.506vw; position: absolute; top: 0; right: 0; }
  #blog .inner-Box{ }
  #blog ul{ background-color: #f2f2f2; padding: 4vw; height: 480px; overflow-y:scroll; }
  #blog ul li{ border-bottom: 1px #111 dotted; padding-bottom: 16px; margin-bottom: 20px; }
  #blog ul .photo{ width: 40%; min-height: 90px; float: left; }
  #blog ul .system-pic{ width: 100%; }
  #blog ul .system-pic img{ max-width: 100%; height: auto; }
  #blog ul .text-b{ width: 57%; float: left; margin-left: 2%; }
  #blog .icon{ background: #E74863; line-height: 1; padding: 3px 10px; color: #fff; font-size: 12px;}
  #blog ul .system-date{ margin-bottom: 10px; font-size: 4.172vw; line-height: 1.4; }
  #blog ul .system-ttl-01{ width: 100%; font-size: 4.172vw; line-height: 1.6; margin-bottom: 10px; }
  #blog ul .system-category-set { width: 100%; float: right; margin-bottom: 15px;}
  #blog ul .system-category{ width: 100%; margin-right: 1px; font-size: 3vw; font-weight: bold; color: #fff; text-align: center; padding: 4px; float: left; background: #111; margin-bottom: 2px;}
  #blog ul .system-contributor { width: 78%; float: right; color: #bbb; font-size: 0.75em; text-align: right;}
  

  /*#topics -------------------------------------*/
  #topics{ position: relative; margin-bottom: 14vw; }
  #topics h2{ width: 40.156vw; margin-bottom: 17px; }
  #topics .btn{ width: 36.506vw; position: absolute; top: 0; right: 0; }
  #topics .inner-Box{ }
  #topics ul{ background-color: #f2f2f2; padding: 4vw; height: 480px; overflow-y:scroll; }
  #topics ul li{ border-bottom: 1px #111 dotted; padding-bottom: 16px; margin-bottom: 20px; }
  #topics .icon{ background: #E74863; line-height: 1; padding: 3px 10px; color: #fff; font-size: 12px;}
  #topics ul .system-date{ margin-bottom: 10px; font-size: 0.938em; line-height: 1.4; }
  #topics ul .system-ttl-01{ width: 100%; font-size: 0.938em; line-height: 1.6; margin-bottom: 10px; }
  #topics ul .system-category-set { width: 100%; float: right; margin-bottom: 15px;}
  #topics ul .system-category{ width: 100%; margin-right: 1px; font-size: 0.625em; font-weight: bold; color: #fff; text-align: center; padding: 4px; float: left; background: #111; margin-bottom: 2px;}
  #topics ul .system-contributor { width: 78%; float: right; color: #bbb; font-size: 0.75em; text-align: right;}

 .banner-box{ margin: 0 8.866vw; }
 .banner-box p{ margin-bottom: 4vw; }

#contents-sns{ margin: 0 7vw 11.734vw; }
#contents-sns h2{ width: 39.505vw; margin: 0 auto; margin-bottom: 5.737vw; }
#contents-sns p a{ width: 50vw; margin: 0 auto 5vw; display: block;}
#contents-sns p a img{ margin: 0 auto 5vw; display: block;}
#contents-sns p a:nth-child(2n){ margin-bottom: 0px; }

.seo{ margin: 0 auto; color: #b3b3b3; padding: 9vw 5vw 5vw 5vw; font-size: 3vw; font-weight: 400; letter-spacing: 1.2px; line-height: 1.6; }
#end-contact{}
	
	#youtube{padding: 0 0 15vw 0;position: relative;}
	#youtube .frame .en{font-size: 22.0vw;text-align: center;color: #f5f4f2;margin-bottom: 1vw;position: absolute;top: -14vw;left: 0;right: 0;text-align: center;}
	#youtube .frame h2{font-size: 5.0vw;font-weight: bold;text-align: center; margin-bottom: 8vw;position: relative;z-index: 1;}
	#youtube .frame h2 .red{color: #c50100;}
	#youtube .frame #youtube-list { width: 62.802vw; margin: 0 auto 8vw; }
	#youtube .frame #youtube-list .slider-3mai-Box1 { width: 100%; margin: 0 auto -1px; }
	#youtube .frame #youtube-list .slider-3mai-Box1 li img{margin-bottom: 5vw;}
	#youtube .frame #youtube-list .slider-3mai-Box1 li .text { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-size: 3.382vw; font-weight: 500; line-height: 5.072vw; letter-spacing: normal; }
	#youtube .frame #youtube-list .slider-3mai-Box1 li a .text{text-decoration: underline;}
	#youtube .frame #youtube-list .slider-3mai-Box1 li a:hover .text{text-decoration: none;}
	#youtube .frame #youtube-list .slider-3mai-Box1 .bx-prev { top: 27.053vw; left: -15.7vw; width: 9.662vw; height: 9.662vw; background-image: url(../images/index/sp-bxl.svg); background-repeat: no-repeat; background-position: center 0; }
	#youtube .frame #youtube-list .slider-3mai-Box1 .bx-prev:hover { opacity: 0.8; }
	#youtube .frame #youtube-list .slider-3mai-Box1 .bx-next { top: 27.053vw; right: -14.493vw; width: 9.662vw; height: 9.662vw; background-image: url(../images/index/sp-bxr.svg); background-repeat: no-repeat; background-position: center 0; }
	#youtube .frame #youtube-list .slider-3mai-Box1 .bx-next:hover { opacity: 0.8; }

	

}
@media screen and (max-width: 380px) {
  #case .system-list .system-pic { height: 120px; }
  #case .system-list .system-pic img { height: 120px; }
  #casetax-catego .system-list .system-pic { height: 120px; }
  #casetax-catego .system-list .system-pic img { height: 120px; }
  #casetax-reform .system-list .system-pic { height: 120px; }
  #casetax-reform .system-list .system-pic img { height: 120px; }
  #voice .system-list .system-pic { height: 120px; }
  #voice .system-list .system-pic img { height: 120px; }
}
@media screen and (max-width: 321px) {
  #case .system-list .system-pic { height: 100px; }
  #case .system-list .system-pic img { height: 100px; }
  #casetax-catego .system-list .system-pic { height: 100px; }
  #casetax-catego .system-list .system-pic img { height: 100px; }
  #casetax-reform .system-list .system-pic { height: 100px; }
  #casetax-reform .system-list .system-pic img { height: 100px; }
  #voice .system-list .system-pic { height: 100px; }
  #voice .system-list .system-pic img { height: 100px; }
}