@charset "UTF-8";
/* CSS Document */
/*
  ------------------------------------
   MediaScreen指定
  ------------------------------------
*/
/*
  ------------------------------------
   ベースプロパティ
  ------------------------------------
*/
/*
  ------------------------------------
   CSSからのIMGロード
  ------------------------------------
*/
/*
  ------------------------------------
   FONT指定
  ------------------------------------
*/
/*
  ------------------------------------
   FORM設定
  ------------------------------------
*/
/*
  ------------------------------------
   Responsive指定
  ------------------------------------
*/
#page .inner_box, #service .inner_box, #information .inner_box {
  max-width: 1080px;
}

@media screen and (max-width: 1080px) {
  #page .inner_box, #service .inner_box, #information .inner_box {
    max-width: 94%;
  }
}

#page {
  margin: -55px 0 50px;
  position: relative;
}

@media screen and (max-width: 767px) {
  #page {
    margin: -25px 0 0;
  }
}

#page p {
  font-size: 170%;
  font-weight: 600;
  color: #333;
  box-sizing: border-box;
  background-color: #bdbdbd;
  position: absolute;
  right: 0;
}

@media screen and (max-width: 767px) {
  #page p {
    font-size: 180%;
    text-align: center;
    width: 100%;
    left: 0;
    margin: auto;
  }
}

#page p a {
  display: block;
  padding: 28px 50px;
  color: #333;
  position: relative;
}

#page p a:after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 13px;
  background: url("../img/arrow_01.png") no-repeat center;
  position: absolute;
  top: 0;
  right: 33px;
  bottom: 0;
  margin: auto;
}

@media screen and (max-width: 767px) {
  #page p a {
    padding: 16px 20px;
  }
  #page p a:after {
    right: 8px;
  }
}

#page p:hover a, #page p.active a {
  opacity: 1;
  background-color: #cb1c1d;
  color: #fff;
}

#page p:hover a:after, #page p.active a:after {
  border-right-color: #FFF;
  border-bottom-color: #FFF;
}

#page + #information {
  margin-top: 140px;
}

@media screen and (max-width: 767px) {
  #page + #information {
    margin-top: 70px;
  }
}

#service {
  padding: 75px 0 30px;
  background-color: #f6f6f6;
}

@media screen and (max-width: 767px) {
  #service {
    padding: 100px 0 30px;
  }
}

#service .service_list {
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 767px) {
  #service .service_list {
    flex-wrap: wrap;
  }
}

#service .service_list .service_item {
  width: 33.3333%;
}

@media screen and (max-width: 767px) {
  #service .service_list .service_item {
    width: 100%;
  }
}

#service .service_list .service_item a {
  display: block;
  color: #333;
  padding-bottom: 7%;
}

@media screen and (max-width: 767px) {
  #service .service_list .service_item a {
    padding-bottom: 0;
    margin-bottom: 5%;
  }
}

#service .service_list .service_item a .service_title {
  font-size: 180%;
  font-weight: 600;
  padding-bottom: 67.2222%;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  #service .service_list .service_item a .service_title {
    font-size: 140%;
  }
}

#service .service_list .service_item a .service_title img {
  width: 101%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: .5s;
}

#service .service_list .service_item a .service_title p {
  width: 100%;
  box-sizing: border-box;
  padding: 1em;
  /* FF3.6-15 */
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0.8) 88%, rgba(0, 0, 0, 0.8) 99%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  color: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  margin: auto;
}

#service .service_list .service_item a .text {
  font-size: 160%;
  letter-spacing: -0.001em;
  margin-top: 5%;
  padding: 0 8%;
  border-left: 1px solid #eee;
}

#service .service_list .service_item a .text dl dd {
  font-size: 81.25%;
  text-indent: 1em;
}

@media screen and (max-width: 767px) {
  #service .service_list .service_item a .text {
    font-size: 140%;
    margin: 2% auto;
    padding: 0;
  }
  #service .service_list .service_item a .text dl dt {
    display: inline-block;
  }
  #service .service_list .service_item a .text dl dd {
    display: inline-block;
    font-size: 100%;
    text-indent: 0em;
  }
}

#service .service_list .service_item a:hover .service_title 　
img {
  width: 120%;
}

@media screen and (max-width: 767px) {
  #service .service_list .service_item a:hover .service_title 　
img {
    width: 100%;
  }
}

#information {
  margin-top: 70px;
}

@media screen and (max-width: 767px) {
  #information {
    margin-top: 20px;
  }
}

#information .info_tag {
  margin-bottom: 50px;
}

@media screen and (max-width: 767px) {
  #information .info_tag {
    margin-bottom: 20px;
    text-align: center;
  }
}

#information .info_tag .tag_list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

#information .info_tag .tag_list::before {
  content: "";
  display: block;
  width: 24%;
  order: 1;
}

#information .info_tag .tag_list::after {
  content: "";
  display: block;
  width: 24%;
}

@media screen and (max-width: 767px) {
  #information .info_tag .tag_list {
    display: none;
  }
}

#information .info_tag .tag_list .tag_category {
  width: 24%;
  display: flex;
  align-items: center;
  padding: 0.7em 1.7em;
  justify-content: center;
  font-size: 130%;
  font-weight: 600;
  letter-spacing: -.001em;
  box-sizing: border-box;
  border: 2px solid;
  position: relative;
  cursor: pointer;
  transition: ease .8s;
  margin-bottom: 1%;
}

#information .info_tag .tag_list .tag_category:hover {
  opacity: 0.7;
}

#information .info_tag .tag_list .tag_category:before {
  content: "";
  position: absolute;
  width: 15px;
  height: 15px;
  top: 50%;
  transform: translate3d(0, -50%, 0) rotate(0deg) scale(1);
  right: 5px;
  background: url("/jp/cmn_2020/img/icn_sort_wh.png") center center;
  background-size: contain;
}

#information .info_tag .tag_list .tag_category:not(.on) {
  color: #fff !important;
}

#information .info_tag .tag_list .tag_category.on {
  background-color: #fff !important;
}

#information .info_tag .tag_list .tag_category.on:before {
  content: none;
}

#information .info_tag .tag_list .all {
  color: #fff;
  background-color: #cb1c1d;
  border: 2px solid #cb1c1d;
}

#information .info_tag .tag_list .all:after {
  border-top: 12px solid #cb1c1d;
}

#information .info_tag .tag_list .all:hover {
  color: #fff;
}

#information .info_tag .tag_list .all.on {
  color: #cb1c1d;
  border-color: #cb1c1d;
  background-color: #fff;
}

#information .info_tag .tag_list .monitoring {
  color: #fff;
  background-color: #556fb5;
}

#information .info_tag .tag_list .monitoring:after {
  border-top: 12px solid #556fb5;
}

#information .info_tag .tag_list .monitoring:hover {
  color: #fff;
}

#information .info_tag .tag_list .monitoring.on {
  color: #556fb5;
  border-color: #556fb5;
  background-color: #fff;
}

#information .info_tag .tag_list .inspection {
  color: #fff;
  background-color: #28a562;
}

#information .info_tag .tag_list .inspection:after {
  border-top: 12px solid #28a562;
}

#information .info_tag .tag_list .inspection:hover {
  color: #fff;
}

#information .info_tag .tag_list .inspection.on {
  color: #28a562;
  border-color: #28a562;
  background-color: #fff;
}

#information .info_tag .tag_list .communication {
  color: #fff;
  background-color: #e17b00;
}

#information .info_tag .tag_list .communication:after {
  border-top: 12px solid #e17b00;
}

#information .info_tag .tag_list .communication:hover {
  color: #fff;
}

#information .info_tag .tag_list .communication.on {
  color: #e17b00;
  border-color: #e17b00;
  background-color: #fff;
}

#information .info_tag .tag_list .sensing {
  color: #fff;
  background-color: #eb6877;
}

#information .info_tag .tag_list .sensing:after {
  border-top: 12px solid #eb6877;
}

#information .info_tag .tag_list .sensing:hover {
  color: #fff;
}

#information .info_tag .tag_list .sensing.on {
  color: #eb6877;
  border-color: #eb6877;
  background-color: #fff;
}

#information .info_tag .tag_list .network {
  color: #fff;
  background-color: #448aca;
}

#information .info_tag .tag_list .network:after {
  border-top: 12px solid #448aca;
}

#information .info_tag .tag_list .network:hover {
  color: #fff;
}

#information .info_tag .tag_list .network.on {
  color: #448aca;
  border-color: #448aca;
  background-color: #fff;
}

#information .info_tag .tag_list .printer {
  color: #fff;
  background-color: #a84200;
}

#information .info_tag .tag_list .printer:after {
  border-top: 12px solid #a84200;
}

#information .info_tag .tag_list .printer:hover {
  color: #fff;
}

#information .info_tag .tag_list .printer.on {
  color: #a84200;
  border-color: #a84200;
  background-color: #fff;
}

#information .info_tag .tag_list .design {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .design:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .design:hover {
  color: #fff;
}

#information .info_tag .tag_list .design.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .erp {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .erp:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .erp:hover {
  color: #fff;
}

#information .info_tag .tag_list .erp.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .efficiency_support {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .efficiency_support:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .efficiency_support:hover {
  color: #fff;
}

#information .info_tag .tag_list .efficiency_support.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .financial_accounting {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .financial_accounting:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .financial_accounting:hover {
  color: #fff;
}

#information .info_tag .tag_list .financial_accounting.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .chemical_substance {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .chemical_substance:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .chemical_substance:hover {
  color: #fff;
}

#information .info_tag .tag_list .chemical_substance.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .management_service_support {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .management_service_support:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .management_service_support:hover {
  color: #fff;
}

#information .info_tag .tag_list .management_service_support.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .purchasing_service {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .purchasing_service:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .purchasing_service:hover {
  color: #fff;
}

#information .info_tag .tag_list .purchasing_service.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .euc {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .euc:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .euc:hover {
  color: #fff;
}

#information .info_tag .tag_list .euc.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .manufacturing_iot {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .manufacturing_iot:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .manufacturing_iot:hover {
  color: #fff;
}

#information .info_tag .tag_list .manufacturing_iot.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .sales_solution {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .sales_solution:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .sales_solution:hover {
  color: #fff;
}

#information .info_tag .tag_list .sales_solution.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .maintenance {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .maintenance:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .maintenance:hover {
  color: #fff;
}

#information .info_tag .tag_list .maintenance.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .communication {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .communication:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .communication:hover {
  color: #fff;
}

#information .info_tag .tag_list .communication.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .central_authorities {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .central_authorities:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .central_authorities:hover {
  color: #fff;
}

#information .info_tag .tag_list .central_authorities.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .disaster_prevention {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .disaster_prevention:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .disaster_prevention:hover {
  color: #fff;
}

#information .info_tag .tag_list .disaster_prevention.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .iot_ai {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .iot_ai:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .iot_ai:hover {
  color: #fff;
}

#information .info_tag .tag_list .iot_ai.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .contact_center {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .contact_center:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .contact_center:hover {
  color: #fff;
}

#information .info_tag .tag_list .contact_center.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .video_meeting {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .video_meeting:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .video_meeting:hover {
  color: #fff;
}

#information .info_tag .tag_list .video_meeting.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .store {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .store:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .store:hover {
  color: #fff;
}

#information .info_tag .tag_list .store.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .counter_lobby {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .counter_lobby:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .counter_lobby:hover {
  color: #fff;
}

#information .info_tag .tag_list .counter_lobby.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .cs_corner {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .cs_corner:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .cs_corner:hover {
  color: #fff;
}

#information .info_tag .tag_list .cs_corner.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .cash_processing_machine {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .cash_processing_machine:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .cash_processing_machine:hover {
  color: #fff;
}

#information .info_tag .tag_list .cash_processing_machine.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .back_office {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .back_office:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .back_office:hover {
  color: #fff;
}

#information .info_tag .tag_list .back_office.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .headquarters {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .headquarters:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .headquarters:hover {
  color: #fff;
}

#information .info_tag .tag_list .headquarters.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .guest_smartphone {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .guest_smartphone:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .guest_smartphone:hover {
  color: #fff;
}

#information .info_tag .tag_list .guest_smartphone.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .cloud {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .cloud:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .cloud:hover {
  color: #fff;
}

#information .info_tag .tag_list .cloud.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .middleware {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .middleware:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .middleware:hover {
  color: #fff;
}

#information .info_tag .tag_list .middleware.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .platform {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .platform:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .platform:hover {
  color: #fff;
}

#information .info_tag .tag_list .platform.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .broadband {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .broadband:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .broadband:hover {
  color: #fff;
}

#information .info_tag .tag_list .broadband.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .video {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .video:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .video:hover {
  color: #fff;
}

#information .info_tag .tag_list .video.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .server {
  color: #fff;
  background-color: #000000;
}

#information .info_tag .tag_list .server:after {
  border-top: 12px solid #000000;
}

#information .info_tag .tag_list .server:hover {
  color: #fff;
}

#information .info_tag .tag_list .server.on {
  color: #000000;
  border-color: #000000;
  background-color: #fff;
}

#information .info_tag .tag_list .on {
  color: #fff;
}

#information .info_tag .tag_list_sp {
  display: none;
}

@media screen and (max-width: 767px) {
  #information .info_tag .tag_list_sp {
    display: inline-block;
    width: 100%;
    border: 1px solid #333;
    box-sizing: border-box;
    position: relative;
    color: #cb1c1d;
    border: 2px solid;
    border-color: #cb1c1d;
  }
  #information .info_tag .tag_list_sp.color1:after, #information .info_tag .tag_list_sp.color1 em {
    border-top: 12px solid #cb1c1d;
  }
  #information .info_tag .tag_list_sp.color1 select {
    color: #cb1c1d;
  }
  #information .info_tag .tag_list_sp.black select {
    color: #000;
  }
  #information .info_tag .tag_list_sp.color2 {
    background: #556fb5;
    border-color: #556fb5;
  }
  #information .info_tag .tag_list_sp.color2:after, #information .info_tag .tag_list_sp.color2 em {
    border-top: 12px solid #556fb5;
  }
  #information .info_tag .tag_list_sp.color3 {
    background: #28a562;
    border-color: #28a562;
  }
  #information .info_tag .tag_list_sp.color3:after, #information .info_tag .tag_list_sp.color3 em {
    border-top: 12px solid #28a562;
  }
  #information .info_tag .tag_list_sp.color4 {
    background: #e17b00;
    border-color: #e17b00;
  }
  #information .info_tag .tag_list_sp.color4:after, #information .info_tag .tag_list_sp.color4 em {
    border-top: 12px solid #e17b00;
  }
  #information .info_tag .tag_list_sp.color5 {
    background: #eb6877;
    border-color: #eb6877;
  }
  #information .info_tag .tag_list_sp.color5:after, #information .info_tag .tag_list_sp.color5 em {
    border-top: 12px solid #eb6877;
  }
  #information .info_tag .tag_list_sp.color6 {
    background: #448aca;
    border-color: #448aca;
  }
  #information .info_tag .tag_list_sp.color6:after, #information .info_tag .tag_list_sp.color6 em {
    border-top: 12px solid #448aca;
  }
  #information .info_tag .tag_list_sp.color7 {
    background: #a84200;
    border-color: #a84200;
  }
  #information .info_tag .tag_list_sp.color7:after, #information .info_tag .tag_list_sp.color7 em {
    border-top: 12px solid #a84200;
  }
  #information .info_tag .tag_list_sp:after {
    content: "";
  }
  #information .info_tag .tag_list_sp em {
    display: block;
    margin: 0 auto;
    width: 0;
    height: 0;
    border-right: 10px solid transparent !important;
    border-left: 10px solid transparent !important;
    position: absolute;
    bottom: -12px;
    left: 32px;
  }
  #information .info_tag .tag_list_sp select {
    text-align: -webkit-center;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    border: none;
    border-radius: 0;
    cursor: pointer;
    width: 99%;
    margin: 0.5% 0;
    padding: 10px 20px 10px;
    font-size: 160%;
    background: url("../img/arrow_06.png") no-repeat right 2% center;
    background-size: 12px;
  }
  #information .info_tag .tag_list_sp select option {
    color: #fff;
    background: #000;
  }
}

#information .info_contents {
  margin-bottom: 40px;
}

#information .info_contents .info_list {
  display: flex;
  flex-wrap: wrap;
}

#information .info_contents .info_list .info_item {
  width: 33.3333%;
  position: relative;
  /*sort部分 */
  display: none;
  /*sort部分 */
}

#information .info_contents .info_list .info_item.show {
  display: block;
}

@media screen and (max-width: 767px) {
  #information .info_contents .info_list .info_item {
    width: 100%;
  }
}

#information .info_contents .info_list .info_item a {
  display: block;
  color: #333;
  padding-bottom: 7%;
}

#information .info_contents .info_list .info_item a .category {
  color: #fff;
  min-width: 82px;
  font-size: 130%;
  letter-spacing: -.001em;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.3em 1em;
  box-sizing: border-box;
  position: absolute;
  z-index: 9;
  right: 0;
  top: 0;
}

@media screen and (max-width: 767px) {
  #information .info_contents .info_list .info_item a .category {
    font-size: 110%;
  }
}

#information .info_contents .info_list .info_item a .all {
  background-color: #cb1c1d;
}

#information .info_contents .info_list .info_item a .monitoring {
  background-color: #556fb5;
}

#information .info_contents .info_list .info_item a .inspection {
  background-color: #28a562;
}

#information .info_contents .info_list .info_item a .communication {
  background-color: #e17b00;
}

#information .info_contents .info_list .info_item a .sensing {
  background-color: #eb6877;
}

#information .info_contents .info_list .info_item a .network {
  background-color: #448aca;
}

#information .info_contents .info_list .info_item a .printer {
  background-color: #a84200;
}

#information .info_contents .info_list .info_item a .design, #information .info_contents .info_list .info_item a .erp, #information .info_contents .info_list .info_item a .efficiency_support, #information .info_contents .info_list .info_item a .financial_accounting, #information .info_contents .info_list .info_item a .chemical_substance, #information .info_contents .info_list .info_item a .management_service_support, #information .info_contents .info_list .info_item a .purchasing_service, #information .info_contents .info_list .info_item a .euc, #information .info_contents .info_list .info_item a .manufacturing_iot, #information .info_contents .info_list .info_item a .sales_solution, #information .info_contents .info_list .info_item a .maintenance, #information .info_contents .info_list .info_item a .communication, #information .info_contents .info_list .info_item a .central_authorities, #information .info_contents .info_list .info_item a .disaster_prevention, #information .info_contents .info_list .info_item a .iot_ai, #information .info_contents .info_list .info_item a .contact_center, #information .info_contents .info_list .info_item a .video_meeting, #information .info_contents .info_list .info_item a .store, #information .info_contents .info_list .info_item a .counter_lobby, #information .info_contents .info_list .info_item a .cs_corner, #information .info_contents .info_list .info_item a .cash_processing_machine, #information .info_contents .info_list .info_item a .back_office, #information .info_contents .info_list .info_item a .headquarters, #information .info_contents .info_list .info_item a .guest_smartphone, #information .info_contents .info_list .info_item a .cloud, #information .info_contents .info_list .info_item a .middleware, #information .info_contents .info_list .info_item a .platform, #information .info_contents .info_list .info_item a .broadband, #information .info_contents .info_list .info_item a .video, #information .info_contents .info_list .info_item a .server {
  background-color: #000000;
}

#information .info_contents .info_list .info_item a .category_title {
  padding-bottom: 67.2222%;
  position: relative;
  overflow: hidden;
}

#information .info_contents .info_list .info_item a .category_title img {
  width: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: .5s;
}

#information .info_contents .info_list .info_item a .category_title p {
  font-size: 160%;
  color: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  /* FF3.6-15 */
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0.8) 88%, rgba(0, 0, 0, 0.8) 99%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  width: 100%;
  box-sizing: border-box;
  padding: 1em;
  height: 6em;
}

@media screen and (max-width: 767px) {
  #information .info_contents .info_list .info_item a .category_title p {
    font-size: 140%;
    display: flex;
    align-items: flex-end;
  }
}

#information .info_contents .info_list .info_item a .text {
  font-size: 160%;
  letter-spacing: -0.001em;
  margin-top: 5%;
  padding: 0 8%;
  border-left: 1px solid #eee;
}

@media screen and (max-width: 767px) {
  #information .info_contents .info_list .info_item a .text {
    margin-top: 10px;
    font-size: 140%;
    padding: 0;
  }
}

#information .info_contents .info_list .info_item a:hover .category_title img {
  width: 120%;
}

@media screen and (max-width: 767px) {
  #information .info_contents .info_list .info_item a:hover .category_title img {
    width: 100%;
  }
}

#information .info_contents .more_btn {
  text-align: center;
  font-size: 170%;
  cursor: pointer;
  visibility: hidden !important;
}

#information .info_contents .more_btn p {
  position: relative;
  display: block;
  padding: .9em;
  box-sizing: border-box;
  background-color: #cb1c1d;
  color: #fff;
}

#information .info_contents .more_btn p:before, #information .info_contents .more_btn p:after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 2px;
  background-color: #fff;
  position: absolute;
  right: 10px;
  top: 50%;
}

#information .info_contents .more_btn p:before {
  transform: rotate(90deg);
}

@media screen and (max-width: 767px) {
  #information .info_contents .more_btn {
    display: block;
  }
  #information .info_contents .more_btn p {
    font-size: 120%;
  }
}

#information .bannerArea .bannerList01 {
  text-align: center;
  margin: 5% 0;
}

#information .bannerArea .bannerList01 li {
  margin: 0 1%;
  width: 30%;
  display: inline-block;
}

#information .bannerArea .bannerList01 li img {
  width: 100%;
}

#information .bannerArea .bannerList01 li p {
  padding: 0.5em;
  font-size: 140%;
}

@media screen and (max-width: 767px) {
  #information .bannerArea .bannerList01 li {
    width: 100%;
    margin: 0 0 20px;
  }
}