@charset "UTF-8";
@media screen and (min-width: 768px),print {  /* 3枚表示のbxslider
  -------------------------------------*/
  .slider-3mai-Box { overflow: hidden; position: relative; width: 100%; }
  .slider-3mai-Box .slider-3mai { position: relative; left: 50%; width: 3020px; margin-left: -1510px; }
  .slider-3mai-Box .slider-3mai li { width: 1000px !important; }
  .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; }
  
  .side-fix { display: none;}
  
  /* event -------------------------------------*/
  #event{ width: 100%; margin: 0 auto; padding: 80px 0; background: #ccc;}
  #event h2{ text-align: center; font-size: 32px; font-weight: bold; margin-bottom: 80px;}
  #event .btn{ text-align: center; }
  #event .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 16px; text-align: center; display: inline-block; background: #000; }
  #event .btn a:hover{ background: #333; text-decoration: none; }
  #event .inner-Box{ width: 1100px; margin: 0 auto; }
  #event .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; }
  #event .system-list li{ width: 24%; margin-right: 1%; background: #fff; padding: 0.5%; position: relative; margin-bottom: 20px; }
  #event .system-list li:nth-child(4n){ margin-right: 0;}
  #event .system-list li a:hover{ text-decoration: none; }
  #event .system-pic{ width: 100%; height: 190px; overflow: hidden; text-align: center; }
  #event .system-pic img{ max-width: 100%; max-height: 190px; width: auto; height: auto;}
  #event .system-date{ font-size: 12px; margin-bottom: 15px; }
  #event .system-date::before{ content: "■"; }
  #event .system-ttl-01{ font-size: 16px; margin-bottom: 20px; }
  #event .system-icon{ font-size: 12px; font-weight: bold; color: #fff; text-align: center; padding: 8px; background: #000; }
  #event .icon01{ background: #333; }
  #event .icon02{ background: #666; }
  #event .system-icon02 span { display: block; padding: 8px; background: #ccc; font-size: 12px; margin-bottom: 20px; }
  #event .system-icon02 span.icon02-01 { background: #999; }
  #event .system-icon02 span.icon02-02 { background: #ccc; }
  #event .system-icon02 span.icon02-03 { background: #eee; }
  
  /* case -------------------------------------*/
  #case{ width: 100%; margin: 0 auto; padding: 80px 0;}
  #case h2{ text-align: center; font-size: 32px; font-weight: bold; margin-bottom: 50px;}
  #case .btn{ text-align: center; margin-bottom: 100px;}
  #case .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 16px; text-align: center; display: inline-block; background: #000; }
  #case .btn a:hover{ background: #333; text-decoration: none; }
  #case .inner-Box{ width: 100%; margin: 0 auto; }
  #case .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; }
  #case .system-list li{ width: 19.6%; margin-right: 0.5%; background: #fff; position: relative; margin-bottom: 20px; }
  #case .system-list li:nth-child(5n){ margin-right: 0;}
  #case .system-list li a:hover{ text-decoration: none; }
  #case .system-pic{ width: 100%; height: 230px; overflow: hidden; text-align: center; }
  #case .system-pic img{ width: 100%; height: 230px; }
  #case .system-date{ font-size: 12px; margin-bottom: 15px; line-height: 1.4;}
  #case .system-date::before{ content: "■"; }
  #case .system-ttl-01{ font-size: 16px; margin-bottom: 20px; line-height: 1.4; }
  #case .system-category-set { margin-bottom: 15px;}
  #case .system-category{ margin-bottom: 1px; font-size: 12px; font-weight: bold; color: #fff; text-align: center; padding: 8px; background-color: #ccc;}
  #case .icon01{ background: #000; }
  #case .icon02{ background: #111; }
  #case .icon03{ background: #222; }
  #case .icon04{ background: #333; }
  #case .icon05{ background: #444; }
  #case .icon06{ background: #555; }
  #case .system-icon02{ padding: 5px 10px; background: #ccc; position: absolute; top: 35px; left: 0; }

  #case .slider-3mai-Box1 { overflow: hidden; position: relative; width: 100%; }
  #case .slider-3mai-Box1 .slider-3mai { position: relative; left: 50%; width: 2500px; margin-left: -1250px; }
  #case .slider-3mai-Box1 .slider-3mai li { width: 500px !important; padding: 0}
  #case .slider-3mai-Box1 .bx-wrapper .bx-controls-direction a { position: absolute; top: 35%; outline: 0; width: 50px; height: 100px; text-indent: -9999px; z-index: 9999; }
  #case .slider-3mai-Box1 .bx-wrapper .bx-prev { left: 970px; background-image: url(../images/index/bx-l.jpg); background-position: 0 0; }
  #case .slider-3mai-Box1 .bx-wrapper .bx-next { right: 925px; background-image: url(../images/index/bx-r.jpg); background-position: 0 0; }


  /* casetax-catego -------------------------------------*/
  #casetax-catego{ width: 100%; margin: 0 auto; padding: 50px 0; background: #efefef; }
  #casetax-catego h2{ text-align: center; font-size: 22px; font-weight: bold; margin-bottom: 50px;}
  #casetax-catego .btn{ text-align: center; }
  #casetax-catego .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 16px; text-align: center; display: inline-block; background: #000; }
  #casetax-catego .btn a:hover{ background: #333; text-decoration: none; }
  #casetax-catego .inner-Box{ width: 1100px; margin: 0 auto; }
  #casetax-catego .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; }
  #casetax-catego .system-list li{ width: 19.6%; margin-right: 0.5%; position: relative; margin-bottom: 20px; }
  #casetax-catego .system-list li:nth-child(5n){ margin-right: 0;}
  #casetax-catego .system-list li a:hover{ text-decoration: none; }
  #casetax-catego .system-pic{ width: 100%; height: 120px; margin-bottom: 10px; overflow: hidden; text-align: center; }
  #casetax-catego .system-pic img{ width: 100%; height: 120px; }
  #casetax-catego .system-date{ font-size: 12px; margin-bottom: 10px; line-height: 1.4; }
  #casetax-catego .system-date::before{ content: "■"; }
  #casetax-catego .system-ttl{ font-size: 16px; margin-bottom: 20px; line-height: 1.4; }
  
  /* case-reform -------------------------------------*/
  #case-reform{ width: 100%; margin: 0 auto; padding: 80px 0; background: #ccc}
  #case-reform h2{ text-align: center; font-size: 32px; font-weight: bold; margin-bottom: 80px;}
  #case-reform .btn{ text-align: center; }
  #case-reform .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 16px; text-align: center; display: inline-block; background: #000; }
  #case-reform .btn a:hover{ background: #333; text-decoration: none; }
  #case-reform .inner-Box{ width: 1100px; margin: 0 auto; }
  #case-reform .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; }
  #case-reform .system-list li{ width: 33%; margin-right: 0.5%; background: #fff; position: relative; margin-bottom: 20px; padding: 1%; }
  #case-reform .system-list li:nth-child(3n){ margin-right: 0;}
  #case-reform .system-list li a:hover{ text-decoration: none; }
  #case-reform .system-pic{ width: 100%; height: 220px; overflow: hidden; text-align: center; }
  #case-reform .system-pic img{ width: 100%; height: 220px; }
  #case-reform .system-date{ font-size: 12px; margin-bottom: 10px; line-height: 1.4; }
  #case-reform .system-date::before{ content: "■"; }
  #case-reform .system-ttl-01{ font-size: 16px; margin-bottom: 20px; line-height: 1.4; }
  #case-reform .system-category-set { margin-bottom: 15px;}
  #case-reform .system-category{ margin-bottom: 1px; font-size: 12px; font-weight: bold; color: #fff; text-align: center; padding: 8px; background-color: #ccc;}
  #case-reform .icon01{ background: #000; }
  #case-reform .icon02{ background: #111; }
  #case-reform .icon03{ background: #222; }
  #case-reform .icon04{ background: #333; }
  #case-reform .icon05{ background: #444; }
  #case-reform .icon06{ background: #555; }
  #case-reform .system-icon02{ padding: 5px 10px; background: #ccc; position: absolute; top: 35px; left: 0; }
  
  /* voice -------------------------------------*/
  #voice{ width: 100%; margin: 0 auto; padding: 80px 0; background: #f8f8f8;}
  #voice h2{ text-align: center; font-size: 32px; font-weight: bold; margin-bottom: 80px;}
  #voice .btn{ text-align: center; }
  #voice .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 16px; text-align: center; display: inline-block; background: #000; }
  #voice .btn a:hover{ background: #333; text-decoration: none; }
  #voice .inner-Box{ width: 1100px; margin: 0 auto; }
  #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{ width: 33%; margin-right: 0.5%; background: #fff; position: relative; margin-bottom: 20px; padding: 1%; }
  #voice .system-list li:nth-child(3n){ margin-right: 0;}
  #voice .system-list li a:hover{ text-decoration: none; }
  #voice .system-pic{ width: 100%; height: 220px; margin-bottom: 20px; overflow: hidden; text-align: center; }
  #voice .system-pic img{ width: 100%; height: 220px; }
  #voice .system-customer{ font-size: 12px; margin-bottom: 10px; line-height: 1.4; }
  #voice .system-customer::before{ content: "■"; }
  #voice .system-ttl-01{ font-size: 16px; margin-bottom: 20px; line-height: 1.4; }
  #voice .system-category{ margin-bottom: 10px; font-size: 12px; font-weight: bold; color: #fff; text-align: center; padding: 3px; background-color: rgba(35, 24, 21, 0.7);}
  
  #voice .slider-3mai-Box2 { overflow: hidden; position: relative; width: 100%; }
  #voice .slider-3mai-Box2 .slider-3mai { position: relative; left: 50%; width: 2500px; margin-left: -1250px; }
  #voice .slider-3mai-Box2 .slider-3mai li { width: 500px!important; padding: 0;}
  #voice .slider-3mai-Box2 .bx-wrapper .bx-controls-direction a { position: absolute; top: 35%; outline: 0; width: 50px; height: 100px; text-indent: -9999px; z-index: 9999; }
  #voice .slider-3mai-Box2 .bx-wrapper .bx-prev { left: 970px; background-image: url(../images/index/bx-l.jpg); background-position: 0 0; }
  #voice .slider-3mai-Box2 .bx-wrapper .bx-next { right: 925px; background-image: url(../images/index/bx-r.jpg); background-position: 0 0; }


  #blog-news{  width: 1100px; margin: 0 auto; padding: 80px 0; }
  
  /* blog -------------------------------------*/
  #blog{ width: 500px; float: left; margin-right: 40px; }
  #blog h2{ text-align: center; font-size: 32px; font-weight: bold; margin-bottom: 80px;}
  #blog .btn{ text-align: center; }
  #blog .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 10px 50px; font-size: 16px; text-align: center; display: inline-block; background: #000; }
  #blog .btn a:hover{ background: #333; text-decoration: none; }
  #blog .inner-Box{ }
  #blog .system-list{ margin-bottom: 50px; }
  #blog .system-list li{ width: 100%; overflow: hidden; background: #fff; border-bottom: 1px dotted #ccc; margin-bottom: 20px; padding-bottom: 20px; }
  #blog .system-list li a:hover{ text-decoration: none; }
  #blog .system-pic{ width: 18%; margin-right: 2%; height: auto; overflow: hidden; text-align: center; float: left;}
  #blog .system-pic img{ max-width: 100%; height: auto; }
  #blog .system-txt { width: 80%; float: left;}
  #blog .system-date{ font-size: 12px; margin-bottom: 10px; }
  #blog .system-date::before{ content: "■"; }
  #blog .system-ttl{ width: 80%; font-size: 16px; line-height: 1.4; }
  #blog .system-category{ font-size: 10px; color: #fff; text-align: center; padding: 3px; background-color: #111; width: 30%; margin-bottom: 10px;}
  #blog .blog-icon01{ background: #111; }
  #blog .blog-icon02{ background: #222; }
  #blog .blog-icon03{ background: #333; }
  #blog .blog-icon04{ background: #444; }
  #blog .blog-icon05{ background: #555; }
  #blog .blog-icon06{ background: #666; }
  #blog .system-icon02{ padding: 5px 10px; background: #ccc; position: absolute; top: 35px; left: 0; }
  
  /* topics -------------------------------------*/
  #topics{ width: 500px; float: left;}
  #topics h2{ text-align: center; font-size: 32px; 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: 16px; 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: 12px; margin-bottom: 10px; }
  #topics .system-date::before{ content: "■"; }
  #topics .system-ttl{ width: 80%; font-size: 16px; line-height: 1.4; }
  #topics .system-category{ font-size: 10px; color: #fff; text-align: center; padding: 3px; background-color: #111; width: 30%; margin-bottom: 10px;}
  #topics .icon01{ background: #111; }
  #topics .icon02{ background: #222; }
  #topics .icon03{ background: #333; }
  #topics .icon04{ background: #444; }
  #topics .icon05{ background: #555; }
  #topics .icon06{ background: #666; }
  #topics .system-icon02{ padding: 5px 10px; background: #ccc; position: absolute; top: 35px; left: 0; }
  

  
  }

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

#bx-sra {}

/* event -------------------------------------*/
#event{ width: 100%; margin: 0 auto; padding: 15% 3%; background: #ccc;}
#event h2{ text-align: center; font-size: 5vw; font-weight: bold; margin-bottom: 10%;}
#event .btn{ text-align: center; }
#event .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 5% 3%; text-align: center; display: block; background: #000; }
#event .btn a:hover{ background: #333; text-decoration: none; }
#event .inner-Box{  }
#event .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; }
#event .system-list li{ width: 49%; margin-right: 2%; background: #fff; position: relative; margin-bottom: 4%; line-height: 1.4;}
#event .system-list li:nth-child(2n){ margin-right: 0;}
#event .system-list li a:hover{ text-decoration: none; }
#event .system-pic{ width: 100%; height: 30vw; overflow: hidden; text-align: center; }
#event .system-pic img{ max-width: 100%; max-height: 35vw; width: auto; height: auto;}
#event .system-date{ font-size: 3.2vw; margin: 0 3% 5%; }
#event .system-ttl-01{ font-size: 3.6vw; margin: 0 3% 5%; line-height: 1.6; }
#event .system-icon{ font-size: 3.2vw; font-weight: bold; color: #fff; text-align: center; padding: 2vw; background: #000; }
#event .icon01{ background: #333; }
#event .icon02{ background: #666; }
#event .system-icon02 span { display: block; padding: 2vw; background: #ccc; font-size: 3.2vw; margin-bottom: 5%; }
#event .system-icon02 span.icon02-01 { background: #999; }
#event .system-icon02 span.icon02-02 { background: #ccc; }
#event .system-icon02 span.icon02-03 { background: #eee; }

/* case -------------------------------------*/
#case{ width: 100%; margin: 0 auto; padding: 15% 3%;}
#case h2{ text-align: center; font-size: 3.6vw; font-weight: bold; margin-bottom: 10%;}
#case .btn{ text-align: center; margin-bottom: 10vw}
#case .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 5% 3%; text-align: center; display: block; background: #000; }
#case .btn a:hover{ background: #333; text-decoration: none; }
#case .inner-Box{ width: 100%; margin: 0 auto; }
#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{ width: 49%; margin-right: 2%; background: #fff; position: relative; margin-bottom: 4%; line-height: 1.4;}
#case .system-list li:nth-child(2n){ margin-right: 0;}
#case .system-list li:nth-child(n+5){ display: none;}
#case .system-list li a:hover{ text-decoration: none; }
#case .system-pic{ width: 100%; height: 50vw; overflow: hidden; text-align: center; }
#case .system-pic img{ width: 100%; height: 50vw; }
#case .system-date{ font-size: 3.2vw; margin-bottom: 5%; }
#case .system-date::before{ content: "■"; }
#case .system-ttl-01{ font-size: 3.6vw; margin-bottom: 5%; line-height: 1.6;}
#case .system-category-set { margin-bottom: 5%;}
#case .system-category{ margin-bottom: 0.1vw; font-size: 3.2vw; font-weight: bold; color: #fff; text-align: center; padding: 2vw; background-color: #ccc;}
#case .icon01{ background: #000; }
#case .icon02{ background: #111; }
#case .icon03{ background: #222; }
#case .icon04{ background: #333; }
#case .icon05{ background: #444; }
#case .icon06{ background: #555; }
#case .system-icon02{ }

#case .slider-3mai-Box2 { position: relative; width: 100%; }
#case .slider-3mai-Box2 .slider-3mai { position: relative; left: 45%; width: 90%; margin-left: -40%; }
#case .slider-3mai-Box2 .slider-3mai li { width: 85vw!important; position: relative; }
#case .slider-3mai-Box2 .bx-wrapper .bx-controls-direction a { position: absolute; top: 30%; outline: 0; width: 50px; height: 100px; text-indent: -9999px; z-index: 10; }
#case .slider-3mai-Box2 .bx-wrapper .bx-prev { left: -5%; background-image: url(../images/index/bx-l.jpg); background-position: 0 0; background-size: 60%}
#case .slider-3mai-Box2 .bx-wrapper .bx-next { right: -13%; background-image: url(../images/index/bx-r.jpg); background-position: 0 0; background-size: 60%}


/* casetax-catego -------------------------------------*/
#casetax-catego{ width: 100%; margin: 0 auto; padding: 15% 3%; background: #efefef; }
#casetax-catego h2{ text-align: center; font-size: 3.6vw; font-weight: bold; margin-bottom: 10%;}
#casetax-catego .btn{ text-align: center; }
#casetax-catego .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 5% 3%; text-align: center; display: block; background: #000; }
#casetax-catego .btn a:hover{ background: #333; text-decoration: none; }
#casetax-catego .inner-Box{ width: 100%; margin: 0 auto; }
#casetax-catego .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; }
#casetax-catego .system-list li{ width: 49%; margin-right: 2%; position: relative; margin-bottom: 4%; line-height: 1.4; }
#casetax-catego .system-list li:nth-child(2n){ margin-right: 0;}
#casetax-catego .system-list li:nth-child(n+5){ display: none;}
#casetax-catego .system-list li a:hover{ text-decoration: none; }
#casetax-catego .system-pic{ width: 100%; height: 30vw; margin-bottom: 3vw; overflow: hidden; text-align: center; }
#casetax-catego .system-pic img{ width: 100%; height: 30vw; }
#casetax-catego .system-date{ font-size: 3.2vw; margin-bottom: 5%; }
#casetax-catego .system-date::before{ content: "■"; }
#casetax-catego .system-ttl{ font-size: 3.6vw; margin-bottom: 5%; }
#casetax-catego .system-ttl-01{font-size: 3.6vw; line-height: 1.6;}

/* case-reform -------------------------------------*/
#case-reform{ width: 100%; margin: 0 auto; padding: 15% 3%; background: #ccc}
#case-reform h2{ text-align: center; font-size: 3.6vw; font-weight: bold; margin-bottom: 10%;}
#case-reform .btn{ text-align: center; }
#case-reform .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 5% 3%; text-align: center; display: block; background: #000; }
#case-reform .btn a:hover{ background: #333; text-decoration: none; }
#case-reform .inner-Box{ width: 100%; margin: 0 auto; }
#case-reform .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-reform .system-list li{ width: 49%; margin-right: 2%; background: #fff; position: relative; margin-bottom: 4%; line-height: 1.4; padding: 1%; }
#case-reform .system-list li:nth-child(2n){ margin-right: 0;}
#case-reform .system-list li:nth-child(n+3){ display: none;}
#case-reform .system-list li a:hover{ text-decoration: none; }
#case-reform .system-pic{ width: 100%; height: 120px; overflow: hidden; text-align: center; }
#case-reform .system-pic img{ width: 100%; height: 120px; }
#case-reform .system-date{ font-size: 3.2vw; margin-bottom: 5%; }
#case-reform .system-date::before{ content: "■"; }
#case-reform .system-ttl-01{ font-size: 3.6vw; margin-bottom: 5%; line-height: 1.6;}
#case-reform .system-category-set { margin-bottom: 5%;}
#case-reform .system-category{ margin-bottom: 0.1vw; font-size: 3.2vw; font-weight: bold; color: #fff; text-align: center; padding: 2vw; background-color: #ccc;}
#case-reform .icon01{ background: #000; }
#case-reform .icon02{ background: #111; }
#case-reform .icon03{ background: #222; }
#case-reform .icon04{ background: #333; }
#case-reform .icon05{ background: #444; }
#case-reform .icon06{ background: #555; }
#case-reform .system-icon02{ }

/* voice -------------------------------------*/
#voice{ width: 100%; margin: 0 auto; padding: 15% 3%; background: #f8f8f8;}
#voice h2{ text-align: center; font-size: 3.6vw; font-weight: bold; margin-bottom: 10%;}
#voice .btn{ text-align: center; }
#voice .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 5% 3%; text-align: center; display: block; background: #000; }
#voice .btn a:hover{ background: #333; text-decoration: none; }
#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: 49%; margin-right: 2%; background: #fff; position: relative; margin-bottom: 4%; line-height: 1.4; padding: 1%; }
#voice .system-list li:nth-child(2n){ 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%; height: 30vw; margin-bottom: 5%; overflow: hidden; text-align: center; }
#voice .system-pic img{ width: 100%; height: 30vw; }
#voice .system-customer{ font-size: 3.2vw; margin-bottom: 5%; }
#voice .system-customer::before{ content: "■"; }
#voice .system-ttl-01{ font-size: 3.6vw; margin-bottom: 5%; line-height: 1.6;}
#voice .system-category{ }

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

/* blog -------------------------------------*/
#blog{ width: 100%; margin: 0 auto; padding: 15% 3%;}
#blog h2{ text-align: center; font-size: 3.6vw; font-weight: bold; margin-bottom: 10%; }
#blog .btn{ text-align: center; }
#blog .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 5% 3%; text-align: center; display: block; background: #000; }
#blog .btn a:hover{ background: #333; text-decoration: none; }
#blog .inner-Box{ width: 100%; margin: 0 auto; }
#blog .system-list{ margin-bottom: 10%; }
#blog .system-list li{ width: 100%; background: #fff; overflow: hidden; position: relative; border-bottom: 1px dotted #ccc; margin-bottom: 5%; padding-bottom: 5%; }
#blog .system-list li a:hover{ text-decoration: none; }
#blog .system-pic{ width: 28%; margin-right: 2%; height: auto !important; overflow: hidden; text-align: center; float: left;}
#blog .system-pic img{ max-width: 100%; height: auto !important; }
#blog .system-txt { width: 70%; float: right; }
#blog .system-date{ font-size: 3.2vw; margin-bottom: 3%; }
#blog .system-date::before{ content: "■"; }
#blog .system-ttl{ width: 70%; font-size: 3.6vw; margin-bottom: 5%; line-height: 1.6;}
#blog .system-category{ width: 28%; font-size: 3.2vw; color: #fff; text-align: center; padding: 1vw; background-color: #111; width: 50%; margin-bottom: 3%;}
#blog .blog-icon01{ background: #111; }
#blog .blog-icon02{ background: #222; }
#blog .blog-icon03{ background: #333; }
#blog .blog-icon04{ background: #444; }
#blog .blog-icon05{ background: #555; }
#blog .blog-icon06{ background: #666; }
#blog .system-icon02{ padding: 1vw; background: #ccc; position: absolute; top: 3vw; left: 0; }

/* topics -------------------------------------*/
#topics{ width: 100%; padding: 15% 3%;}
#topics h2{ text-align: center; font-size: 3.6vw; font-weight: bold; margin-bottom: 10%; }
#topics .btn{ text-align: center; }
#topics .btn a{ font-weight: bold; margin: 0 auto; color: #fff; padding: 5% 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: 3.2vw; margin-bottom: 3%; }
#topics .system-date::before{ content: "■"; }
#topics .system-ttl{ width: 80%; font-size: 3.6vw; margin-bottom: 5%; line-height: 1.6; }
#topics .system-category{ font-size: 3.2vw; color: #fff; text-align: center; padding: 1vw; background-color: #111; width: 28%; margin-bottom: 3%;}
#topics .icon01{ background: #111; }
#topics .icon02{ background: #222; }
#topics .icon03{ background: #333; }
#topics .icon04{ background: #444; }
#topics .icon05{ background: #555; }
#topics .icon06{ background: #666; }
#topics .system-icon02{ }




}
@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; }
}