@charset "UTF-8";

@media screen and (min-width: 768px),print {  
header .h-logo{-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); }
header .h-logo img{ width: 63.7px; height: auto; }

body{ background: url(../images/index/body-back01.png)no-repeat top center; background-attachment: fixed; background-size: cover;}
header{position: absolute;top: 0;left: 0;z-index: 3;background: none;}
#contentsmain {margin: 0 auto;position: relative;color: #fff;}
#contentsmain .inner-Box { margin: 0 auto; position: relative; }
#contentsmain .inner-Box figure.photo {position: relative;top: 0;left: 0;}
#contentsmain .inner-Box figure.photo img{ width: 100%; height: auto; }
#contentsmain .inner-Box span.icon01 {display: block;line-height: 1;position: absolute;bottom: 40px;left: 80px;}
#contentsmain .inner-Box span.icon01 img {  }
#contentsmain .inner-Box h2 {position: absolute;top: 22.4vw;left: 50%;transform: translateX(-50%);}
#contentsmain .inner-Box h2 span{  }
#contentsmain .inner-Box h2 img {  }
#contentsmain .inner-Box p{font-size: 9px;letter-spacing: 0.45px;line-height: 1.67;font-weight: 400;position: absolute;text-align: center;bottom: 32px;left: 50%;transform: translateX(-50%);}
#contentsmain .inner-Box span.scroll {display: block;line-height: 1;position: absolute;top: -79px;right: 4px;}
#contentsmain .inner-Box span.scroll img {  }

.scrollmark {position: absolute;right: 80px;bottom: 42px;display: flex;align-items: center;gap: 5px;z-index: 50;}
.scrollmark__text {writing-mode: vertical-rl; letter-spacing: 0.2em; color: #fff; font-size: 12px; opacity: .9;}
.scrollmark__bars {display: flex; flex-direction: column; align-items: flex-end; gap: 8px;}
.scrollmark__bars span {display: block;width: 14px;height: 2px;background: #fff;border-radius: 2px;opacity: .7;transform-origin: right center;transition: all 0.3s ease-in-out;margin-bottom: -3px;}
.scrollmark__bars span.acv{ width: 28px; opacity: 1;}
#conback{ background: rgba(0, 0, 0, 1);}
#contents01 {margin: 0 auto 50px;position: relative;height: 1310px;}
#contents01 .inner-Box {margin: 0 auto;position: relative;text-align: center;color: #fff;padding: 169px 0 0;}
#contents01 .inner-Box h2 {margin: 0 0 20px;}
#contents01 .inner-Box h2 span{  }
#contents01 .inner-Box h2 img {  }
#contents01 .inner-Box p.text1 {font-size: 16px;line-height: 1.88;font-weight: 500;letter-spacing: 0.8px;margin-bottom: 62px;position: relative;}
#contents01 .inner-Box h3 {font-size: 28px;line-height: 2.07;font-weight: 500;letter-spacing: 1.4px;margin-bottom: 65px;position: relative;}
#contents01 .inner-Box p.text2 {font-size: 19px;line-height: 2.63;font-weight: 400;letter-spacing: 0.95px;margin-bottom: 12px;position: relative;}
#contents01 .inner-Box p.mgtop{margin-top: 50px;margin-bottom: 83px;}
#contents01 .inner-Box p.text2 span  {font-size: 19px;line-height: 1.38;font-weight: 500;letter-spacing: 0.95px;margin-bottom: 62px;position: relative;text-decoration: underline;display: block;padding-top: 12px;}

#contents02 {margin: 0 auto;position: relative;background: url('../images/index/contents02-back01.png')no-repeat top center;padding: 32px 0 170px;}
#contents02 .inner-Box { margin: 0 auto; position: relative; }
#contents02 .inner-Box .beforeicon{position: absolute;z-index: 3;left: 50%;transform: translateX(-50%);top: 153px;}
#contents02 .inner-Box ul.concept-slide { margin-bottom: 45px; }
#contents02 .inner-Box .concept-slide li img { transform: scale(.8); transition: transform .5s; }
/* 中央のスライド */
#contents02 .inner-Box .concept-slide .slick-center img { transform: scale(1); }
#contents02 .inner-Box figure img{  }
#contents02 .inner-Box p.f-en {text-align: center;font-size: 9px;line-height: 1.88;font-weight: 400;letter-spacing: 0.45px;margin-bottom: 30px;position: relative;}

.slide img { transform: scale(.8); transition: transform .3s; }
.slide.slick-center img { transform: scale(1); }

#contents03 {margin: 0 auto;position: relative;background: url('../images/index/contents03-back01.png')no-repeat top center #F2F2F2;padding-bottom: 120px;}
#contents03 .inner-Box1 {margin: 0 auto;position: relative;width: 1200px;color: #fff;padding: 209px 0 0 0;min-height: 780px;}
#contents03 .inner-Box1 h2.f-en2 {font-size: 72px;line-height: 1.38;font-weight: 400;letter-spacing: 0.95px;margin-bottom: 41px;position: relative;}
#contents03 .inner-Box1 p.text {font-size: 19px;line-height: 2.63;font-weight: 400;letter-spacing: 0.95px;margin-bottom: 26px;position: relative;z-index: 3;}
#contents03 .inner-Box1 p.text2 {font-size: 9px;line-height: 1.67;font-weight: 400;letter-spacing: 0.45px;margin-bottom: 30px;position: relative;}
#contents03 .inner-Box1 span.icon01 {display: block;line-height: 1;position: absolute;top: 139px;right: -40px;z-index: 3;/* 回転アニメーション */ animation: spin 15s linear infinite; /* 6秒で1回転、ずっとループ */ transform-origin: center center;   /* 中央基準で回転 */}
#contents03 .inner-Box1 span.icon01 img {  }
#contents03 .inner-Box1 span.icon02 {display: block;line-height: 1;position: absolute;top: 178px;right: -3px;z-index: 3;}
    @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
#contents03 .inner-Box1 span.icon02 img {  }
#contents03 .inner-Box1 ul.sev-slide {position: absolute;top: 190px;right: 0;width: 730px;height: 500px;}
#contents03 .inner-Box1 ul li { position: relative; }
#contents03 .inner-Box1 figure.photo {  }
#contents03 .inner-Box1 figure.photo img{  }
#contents03 .inner-Box2 {margin: 0 auto;position: relative;width: 1200px;}
#contents03 .inner-Box2 ul.list {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;margin-bottom: 30px;}
#contents03 .inner-Box2 ul li {margin-right: 0px;border-right: #E7E7E7 1px solid;}
#contents03 .inner-Box2 ul li:nth-child(3n) {border-right: none;margin-right: -2px;}
#contents03 .inner-Box2 ul li figure {  }
#contents03 .inner-Box2 ul li a {  }
#contents03 .inner-Box2 ul li a:hover {  }
#contents03 .inner-Box2 p.btn {text-align: center;}
#contents03 .inner-Box2 p.btn img {  }

#contents04 {margin: 0 auto;position: relative;background: url('../images/index/contents04-back01.png')no-repeat top center;padding: 126px 0 140px 0;}
#contents04 .inner-Box {margin: 0 auto;position: relative;background: #F2F2F2;max-width: 1400px;padding-bottom: 110px;}
#contents04 .inner-Box h2 {text-align: center;position: relative;top: -25px;margin-bottom: 36px;}
#contents04 .inner-Box h2 span{  }
#contents04 .inner-Box h2 img {  }
#contents04 .inner-Box ul{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;margin: 0 auto;width: 940px;}
#contents04 .inner-Box ul li {margin-right: 20px;margin-bottom: 20px;}
#contents04 .inner-Box ul li:nth-child(3n) { margin-right: 0px; }
#contents04 .inner-Box ul li:nth-child(6) {margin-top: 40px;position: relative;left: -10px;}
#contents04 .inner-Box ul li figure {  }
#contents04 .inner-Box ul li a {  }
#contents04 .inner-Box ul li a:hover {  }

.backk{background: #F2F2F2;padding-bottom: 60px;}

#works {margin: 0 auto 97px;position: relative;width: 1200px;padding: 138px 0 0;}
#works .inner-Box {margin: 0 auto;position: relative;}
#works .inner-Box h2{ font-size: 47px; font-weight: 600; letter-spacing: 0.47px; line-height: 1; margin-bottom: 45px; }
#works .morebtn{position: absolute;top: -4px;right: 0;}
#works .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;}
#works .system-list li{line-height: 1.4;width: 31.7%;margin-right: 2.4%;position: relative;margin-bottom: 73px;}
#works .system-list li:nth-child(3n){ margin-right: 0}
#works .system-list li a:hover{ text-decoration: none; }
#works .system-list .btn{ text-align: center; background: #333; color: #fff; font-size: 14px; position: absolute; bottom: 0; left: 0; width: 100%; padding: 3%;}
#works .system-list .btn::after { content: ' >';}
#works .system-list li .system-pic {width: 100%;aspect-ratio: 38 / 28;overflow: hidden;text-align: center;position: relative;margin-bottom: 18px;}
#works .system-list li .system-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
#works .system-list li .system-fu{font-size: 15px;letter-spacing: 0.75px;margin-bottom: 10px;}
#works .system-list li .system-fu .cate{display: inline-block;background: #fff;padding: 4px 20px;border-radius: 32px;margin-right: 10px;}
#works .system-list li .system-fu .arer{ }
#works .system-list li .ssttl{font-size: 18px;letter-spacing: 0.9px;line-height: 2.22;font-weight: bold;}
#works .system-date::before{}
#works .system-coment{ font-size: 14px; margin-bottom: 5px; line-height: 1.4; }
#works .system-ttl-01{font-size: 16px;margin-bottom: 10px;line-height: 1.4;}
#works .system-category-set { margin-bottom: 15px; margin-top: -15px;}
#works .serchcategory{ margin-bottom: 100px;}
#works .serchcategory .icon { display: inline-block; margin-bottom: 15px; font-size: 14px; font-weight: bold; color: #fff; text-align: center; padding: 10px 20px; }
#works .system-category1{margin-bottom: 1px; font-size: 16px; font-weight: bold; color: #fff; text-align: center; padding: 10px 20px; background-color: #ccc; position: relative;}

#column {margin: 0 auto 0;position: relative;width: 1200px;}
#column .inner-Box {margin: 0 auto;position: relative;}
#column .inner-Box h2{ font-size: 47px; font-weight: 600; letter-spacing: 0.47px; line-height: 1; margin-bottom: 45px; }
#column .morebtn{position: absolute;top: -4px;right: 0;}

#column .system-list{padding: 1px;margin-bottom: 50px;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;}
#column .system-list li{overflow: hidden;line-height: 1.4;width: 23.7%;margin-right: 1.7%;margin-bottom: 50px;padding: 0 0 45px;position: relative;background: #fff;}
#column .system-list li:nth-child(4n){ margin-right: 0}
#column .system-list li a:hover{ text-decoration: none; }
#column .system-list li .system-pic {width: 100%;aspect-ratio: 285 / 190;overflow: hidden;text-align: center;position: relative;margin-bottom: 18px;}
#column .system-list li .system-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
#column .system-list li .system-fu{ font-size: 13px; }
#column .system-list li .listtext{font-size: 13px;color: #999999;letter-spacing: 0.65px;line-height: 1.54;margin: 0 14px;font-weight: 400;}

#column .system-list .system-date{font-size: 13px;line-height: 1.4;margin-bottom: 5px;color: #1A1A1A;position: relative;padding: 0 17px;}
#column .system-list .system-date::before{content: "";display: block;width: 20px;height: 1px;background: #808080;position: absolute;top: 10px;left: -30px;}
#column .system-list .system-ttl-01{font-size: 16px;line-height: 1.6;letter-spacing: 0.8px;display: block;font-weight: bold;margin: 0 16px 13px;}

.seo{background: #1A1A1A;color: #808080;padding: 120px 0 55px 0;}
.seo .inbox{width: 1000px;margin: 0 auto;}
.seo .inbox p{font-size: 13px;letter-spacing: 0.65px;line-height: 1.77;}

}

@media screen and (min-width:768px) and ( max-width:1400px) {



}

@media screen and (max-width: 767px) {
.sppback{width: 100vw;height: 100vh;position: fixed;top: 0;left: 0;background: url(../images/index/sp-body-back01.png)no-repeat top center;z-index: 0;}
header{background: #fff;position: relative;z-index: 3;}
#contentsmain {position: relative;color: #fff;margin: -1.6vw 0 0;}
  #contentsmain .inner-Box {position: relative;}
  #contentsmain .inner-Box figure.photo {position: relative;top: 0;left: 0;}
  #contentsmain .inner-Box figure.photo img{ width: 100%; height: auto; }
  #contentsmain .inner-Box span.icon01 {display: block;line-height: 1;position: absolute;bottom: 9.66vw;left: 19.32vw;}
  #contentsmain .inner-Box span.icon01 img {  }
  #contentsmain .inner-Box h2 {position: absolute;top: 55.1vw;width: 84vw;left: 8.2vw;}
  #contentsmain .inner-Box h2 span{  }
  #contentsmain .inner-Box h2 img {  }
  #contentsmain .inner-Box p{font-size: 1.69vw;letter-spacing: 0.08vw;line-height: 1.67;font-weight: 400;position: absolute;text-align: center;bottom: 4.73vw;left: 50%;transform: translateX(-50%);width: 100vw;}
  #contentsmain .inner-Box span.scroll {display: block;line-height: 1;position: absolute;top: -14.4vw;right: 1.77vw;width: 3.1vw;}
  #contentsmain .inner-Box span.scroll img {  }
  
  .scrollmark {position: absolute;right: 3.52vw;bottom: 4.44vw;display: flex;align-items: center;gap: 1.21vw;z-index: 50;}
  .scrollmark__text {writing-mode: vertical-rl; letter-spacing: 0.2em; color: #fff; font-size: 2.9vw; opacity: .9;}
  .scrollmark__bars {display: flex; flex-direction: column; align-items: flex-end; gap: 1.93vw;}
  .scrollmark__bars span {display: block;width: 3.38vw;height: 0.48vw;background: #fff;border-radius: 0.48vw;opacity: .7;transform-origin: right center;transition: all 0.3s ease-in-out;margin-bottom: -0.7vw;}
  .scrollmark__bars span.acv{ width: 6.76vw; opacity: 1;}
  #conback{background: rgba(0, 0, 0, 1);position: relative;z-index: 2;}
  #contents01 {margin: 0 auto 19.08vw;position: relative;}
  #contents01 .inner-Box {position: relative;/* text-align: center; */color: #fff;padding: 16.12vw 0 0;}
  #contents01 .inner-Box h2 {margin: 0 18.6vw 1.93vw;}
  #contents01 .inner-Box h2 span{  }
  #contents01 .inner-Box h2 img {  }
  #contents01 .inner-Box p.text1 {font-size: 3.14vw;line-height: 1.88;font-weight: 500;letter-spacing: 0.16vw;margin-bottom: 10.38vw;position: relative;text-align: center;}
  #contents01 .inner-Box h3 {font-size: 4.59vw;line-height: 2;font-weight: 500;letter-spacing: 0.23vw;margin-bottom: 11.5vw;position: relative;text-align: center;}
  #contents01 .inner-Box p.text2 {font-size: 3.38vw;line-height: 2.21;font-weight: 400;letter-spacing: 0.17vw;margin: 0  6.4vw 7.9vw;position: relative;}
  #contents01 .inner-Box p.mgtop{margin-top: 6.08vw;margin-bottom: 17.05vw;}
  #contents01 .inner-Box p.text2 span {font-size: 3.38vw;line-height: 1.38;font-weight: 500;letter-spacing: 0.23vw;margin-bottom: 14.98vw;position: relative;text-decoration: underline;}
  
  #contents02 {position: relative;background: url('../images/index/sp-contents02-back01.png')no-repeat top center;padding: 2.03vw 0 25.96vw;background-size: 100% auto;}
  #contents02 .inner-Box {position: relative;}
  #contents02 .inner-Box .beforeicon{position: absolute;z-index: 3;left: 50%;transform: translateX(-50%);top: 35.86vw;width: 38.7vw;}
  #contents02 .inner-Box ul.concept-slide {margin-bottom: -2.63vw;}
  #contents02 .inner-Box .concept-slide li img { transform: scale(.8); transition: transform .5s; }
  /* 中央のスライド */
  #contents02 .inner-Box figure img{  }
  #contents02 .inner-Box p.f-en {text-align: center;font-size: 1.69vw;line-height: 1.88;font-weight: 400;letter-spacing: 0.11vw;margin-bottom: 7.25vw;position: relative;}
  
  
  #contents03 {position: relative;background: url('../images/index/sp-contents03-back01.png')no-repeat top center #F2F2F2;padding-bottom: 22.99vw;background-size: 100% auto;}
  #contents03 .inner-Box1 {position: relative;color: #fff;padding: 15.28vw 0 0 0;margin: 0 6.5vw 7.3vw;}
  #contents03 .inner-Box1 h2.f-en2 {font-size: 8.70vw;line-height: 1.38;font-weight: 600;letter-spacing: 0.09vw;margin-bottom: 1.9vw;position: relative;}
  #contents03 .inner-Box1 p.text {font-size: 3.38vw;line-height: 2.21;font-weight: 400;letter-spacing: 0.17vw;margin-bottom: 4.88vw;position: relative;z-index: 3;}
  #contents03 .inner-Box1 p.text2 {font-size: 1.69vw;line-height: 1.71;font-weight: 400;letter-spacing: 0.08vw;margin-bottom: 11.05vw;position: relative;}
  #contents03 .inner-Box1 span.icon01 {display: block;line-height: 1;position: absolute;top: 75.57vw;right: -3.2vw;z-index: 3;/* 回転アニメーション */animation: spin 15s linear infinite; /* 6秒で1回転、ずっとループ */transform-origin: center center;   /* 中央基準で回転 */width: 17.1vw;}
  #contents03 .inner-Box1 span.icon01 img {  }
  #contents03 .inner-Box1 span.icon02 {display: block;line-height: 1;position: absolute;top: 80.5vw;right: 0.9vw;z-index: 3;width: 8vw;}
      @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  #contents03 .inner-Box1 span.icon02 img {  }
  #contents03 .inner-Box1 ul.sev-slide {margin: 0 0vw;}
  #contents03 .inner-Box1 ul li { position: relative; }
  #contents03 .inner-Box1 figure.photo {  }
  #contents03 .inner-Box1 figure.photo img{  }
  #contents03 .inner-Box2 {margin: 0 3vw;position: relative;}
  #contents03 .inner-Box2 ul.list {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;margin-bottom: 7.25vw;}
  #contents03 .inner-Box2 ul li {  }
  #contents03 .inner-Box2 ul li:nth-child(3n) { margin-right: 0.0vw; }
  #contents03 .inner-Box2 ul li figure {  }
  #contents03 .inner-Box2 ul li a {  }
  #contents03 .inner-Box2 ul li a:hover {  }
  #contents03 .inner-Box2 p.btn {text-align: center;}
  #contents03 .inner-Box2 p.btn img {  }
  
  #contents04 {position: relative;background: url('../images/index/sp-contents04-back01.png')no-repeat top center;padding: 14.43vw 0 16.02vw 0;background-size: 100% auto;}
  #contents04 .inner-Box {margin: 0 2.9vw;position: relative;}
  #contents04 .inner-Box h2 {text-align: center;position: relative;top: 0vw;margin: 0 15.5vw 5.1vw;}
  #contents04 .inner-Box h2 span{  }
  #contents04 .inner-Box h2 img {  }
  #contents04 .inner-Box ul{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;margin: 0 2.4vw;}
  #contents04 .inner-Box ul li {margin-right: 2.53vw;margin-bottom: 2.43vw;width: 43.4vw;}
  #contents04 .inner-Box ul li:nth-child(2n) { margin-right: 0.0vw; }
  #contents04 .inner-Box ul li:nth-child(6) {
    width: auto;
    margin: 0 -2.3vw;
    padding-top: 4.6vw;
}
  #contents04 .inner-Box ul li figure {  }
  #contents04 .inner-Box ul li a {  }
  #contents04 .inner-Box ul li a:hover {  }
  
  .backk{background: #F2F2F2;padding-bottom: 0;position: relative;}
  
  #works {margin: 0 auto -6.17vw;position: relative;padding: 18.53vw 0 0;}
  #works .inner-Box {position: relative;}
  #works .inner-Box h2{font-size: 5.80vw;font-weight: 600;letter-spacing: 0.06vw;line-height: 1;margin-bottom: 8.47vw;margin-left: 4.6vw;}
  #works .morebtn{position: absolute;top: 0vw;right: 4.5vw;}
  #works .system-list{margin-bottom: 12.08vw;}
  #works .system-list li.slick-slide{line-height: 1.4;width: 67.63vw;margin: 0 2.42vw;position: relative;margin-bottom: 5.03vw;}
  #works .system-list li.slick-slide a:hover{ text-decoration: none; }
  #works .system-list li.slick-slide .system-pic {width: 100%;aspect-ratio: 38 / 28;overflow: hidden;text-align: center;position: relative;margin-bottom: 2.15vw;}
  #works .system-list li.slick-slide .system-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
  #works .system-list li.slick-slide .system-fu{font-size: 2.90vw;letter-spacing: 0.18vw;margin-bottom: 0.02vw;}
  #works .system-list li.slick-slide .system-fu .cate{display: inline-block;background: #fff;padding: 0.27vw 2.83vw;border-radius: 7.73vw;margin-right: 2.42vw;}
  #works .system-list li.slick-slide .system-fu .arer{ }
  #works .system-list li.slick-slide .ssttl{font-size: 3.62vw;letter-spacing: 0.22vw;line-height: 2.22;font-weight: bold;}
  #works .system-date::before{}
  #works .system-coment{ font-size: 3.38vw; margin-bottom: 1.21vw; line-height: 1.4; }
  #works .system-ttl-01{font-size: 3.86vw;margin-bottom: 2.42vw;line-height: 1.4;}
  #works .system-category-set { margin-bottom: 3.62vw; margin-top: 0vw;}
  #works .serchcategory{ margin-bottom: 24.15vw;}
  #works .serchcategory .icon { display: inline-block; margin-bottom: 3.62vw; font-size: 3.38vw; font-weight: bold; color: #fff; text-align: center; padding: 2.42vw 4.83vw; }
  #works .system-category1{margin-bottom: 0.24vw; font-size: 3.86vw; font-weight: bold; color: #fff; text-align: center; padding: 2.42vw 4.83vw; background-color: #ccc; position: relative;}
  
 .slick-dots{ }
 .slick-dots li{ width: 1.21vw!important; height: 1.21vw!important; margin:0 1.93vw!important;}
 .slick-dots li button{ width: 1.21vw!important; height: 1.21vw!important; background: #AAAAAA!important; border-radius: 50%; }
 .slick-dots li.slick-active button{ background: #333!important; }

  #column {margin: 0 auto 23.43vw;position: relative;padding: 18.53vw 0 0;}
  #column .inner-Box {position: relative;}
  #column .inner-Box h2{font-size: 5.80vw;font-weight: 600;letter-spacing: 0.06vw;line-height: 1;margin-bottom: 8.47vw;margin-left: 4.6vw;}
  #column .morebtn{position: absolute;top: 0vw;right: 4.5vw;}
 
  #column .system-list{margin-bottom: 2.08vw;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;}
  #column .system-list li.slick-slide{line-height: 1.4;width: 67.63vw;margin: 0 2.42vw;position: relative;margin-bottom: 5vw;background: #fff;padding-bottom: 6.8vw;}
  #column .system-list li a:hover{ text-decoration: none; }
  #column .system-list li .system-pic {width: 100%;aspect-ratio: 285 / 190;overflow: hidden;text-align: center;position: relative;margin-bottom: 4.35vw;}
  #column .system-list li .system-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
  #column .system-list li .system-fu{ font-size: 3.14vw; }
  #column .system-list li .listtext{font-size: 3.14vw;color: #999999;letter-spacing: 0.16vw;line-height: 1.54;margin: 0 3.38vw;font-weight: 400;}
  
  #column .system-list .system-date{font-size: 3.14vw;line-height: 1.4;margin-bottom: 1.21vw;color: #1A1A1A;position: relative;padding: 0 4.11vw;}
  #column .system-list .system-date::before{display: block;width: 4.83vw;height: 0.24vw;background: #808080;position: absolute;top: 2.42vw;left: 0vw;}
  #column .system-list .system-ttl-01{font-size: 3.86vw;line-height: 1.6;letter-spacing: 0.19vw;display: block;font-weight: bold;margin: 0 3.86vw 3.14vw;}
  
  .seo{background: #1A1A1A;color: #808080;padding: 9.89vw 0 13.29vw 0;position: relative;}
  .seo .inbox{margin: 0 4vw;}
  .seo .inbox p{font-size: 2.66vw;letter-spacing: 0.16vw;line-height: 1.77;}
  




}

