#index {
  margin: -100px 0 0 0;
  padding: 0; }
  @media (max-width: 720px) {
    #index {
      margin: 0;
      padding: 50px 0 0 0; } }
  @media (max-width: 720px) {
    #index .sectionHeader {
      line-height: 20px;
      background-color: #333333;
      padding: 5px 0 5px 30px;
      margin: 0 0 1em 0;
      color: #ffffff;
      position: relative;
      border: none; } }
  @media (max-width: 720px) {
    #index .sectionHeader:before {
      content: "";
      width: 20px;
      height: 4px;
      position: absolute;
      left: 0;
      top: 50%;
      margin: -2px 0 0 0;
      background-color: #ED1C24; } }
  @media (max-width: 720px) {
    #index .sectionHeader h1, #index .sectionHeader h2, #index .sectionHeader h3, #index .sectionHeader h4, #index .sectionHeader h5, #index .sectionHeader h6 {
      color: #ffffff;
      margin: 0;
      padding: 5px 0;
      line-height: 20px;
      font-size: 15px; } }
  @media (max-width: 720px) {
    #index .sectionHeader p.detail {
      margin: 0 10px 0 0; } }
  @media (max-width: 720px) {
    #index .sectionHeader p.detail a {
      display: block;
      color: #ffffff;
      background: none;
      border: 1px solid #dddddd;
      transition: all 0.0s ease-in-out;
      padding: 2px 30px 2px 10px;
      font-size: 12px;
      line-height: 20px; } }
  @media (max-width: 720px) {
    #index .sectionHeader p.detail a:before {
      border-right: 1px solid #ffffff;
      border-bottom: 1px solid #ffffff;
      transition: all 0.0s ease-in-out; } }
  @media (max-width: 720px) {
    #index .sectionHeader p.detail + p {
      width: 95%;
      margin: 1em auto; } }
  @media (max-width: 720px) {
    #index .sectionHeader + p {
      padding: 0 10px; } }

#index #key {
  height: 380px;
  border: none;
  padding: 0;
  margin: 0;
  text-align: center; }
  @media (max-width: 720px) {
    #index #key {
      height: auto;
      padding: 0 0 0;
      width: 100%;
      overflow: hidden;
      position: relative; } }
  @media (min-width: 721px) and (max-width: 1280px) {
    #index #key {
      height: auto;
      padding: 0 0 40px 0;
      width: 100%;
      overflow: hidden;
      position: relative; } }
  @media (max-width: 720px) {
    #index #key .slider {
      width: 100%;
      height: auto; } }
  @media (min-width: 721px) and (max-width: 1280px) {
    #index #key .slider {
      position: relative;
      width: 100%;
      height: auto;
      left: 0;
      top: 0;
      margin: 0 0 0 0;
      background-color: #f7f7f7; } }
  #index #key .slider .bigBanner {
    padding: 100px 0 0 0;
    height: 280px;
    overflow: hidden;
    position: relative;
    width: 100%; }
    @media (max-width: 720px) {
      #index #key .slider .bigBanner {
        padding: 0;
        height: auto;
        margin: 0; } }
    @media (min-width: 721px) and (max-width: 1280px) {
      #index #key .slider .bigBanner {
        height: auto; }
        #index #key .slider .bigBanner .bigBanner {
          padding: 110px 0 0 0;
          margin: 0;
          height: auto;
          overflow: hidden; } }
    #index #key .slider .bigBanner img {
      max-width: none;
      height: 280px;
      width: auto;
      margin: 0 auto; }
      @media (min-width: 721px) and (max-width: 1280px) {
        #index #key .slider .bigBanner img {
          width: 100%;
          height: auto; } }
      @media (max-width: 720px) {
        #index #key .slider .bigBanner img.pc {
          display: none; } }
      #index #key .slider .bigBanner img.sp {
        display: none; }
        @media (max-width: 720px) {
          #index #key .slider .bigBanner img.sp {
            display: block;
            width: 100%;
            height: auto; } }
  #index #key .slick-dots {
    width: 960px;
    position: absolute;
    bottom: 20px;
    list-style: none;
    display: block;
    padding: 0;
    left: 50%;
    margin: 0 0 0 -480px;
    text-align: left;
    z-index: 9999; }
    @media (max-width: 1280px) {
      #index #key .slick-dots {
        width: 100%;
        height: 40px;
        position: absolute;
        bottom: -40px;
        list-style: none;
        display: block;
        padding: 0;
        left: 0;
        margin: 0;
        text-align: center;
        background-color: #f7f7f7; } }
    #index #key .slick-dots li {
      width: 40px;
      height: 20px;
      position: relative;
      margin: 0 15px; }
      @media (max-width: 960px) {
        #index #key .slick-dots li {
          width: 30px;
          height: 40px;
          margin: 0;
          padding: 0; } }
      @media (min-width: 961px) and (max-width: 1280px) {
        #index #key .slick-dots li {
          width: 30px;
          height: 40px;
          margin: 0 15px; } }
      #index #key .slick-dots li button {
        position: relative;
        z-index: 9999;
        padding: 0;
        margin: 0;
        width: 40px;
        height: 20px;
        background: transparent; }
        @media (max-width: 960px) {
          #index #key .slick-dots li button {
            margin: 0;
            padding: 0;
            width: 30px;
            height: 40px; } }
        @media (min-width: 961px) and (max-width: 1280px) {
          #index #key .slick-dots li button {
            width: 30px;
            height: 40px; } }
        #index #key .slick-dots li button:after {
          position: absolute;
          top: 0;
          left: 0;
          content: "";
          width: 40px;
          height: 6px;
          text-align: center;
          background-color: #ffffff;
          opacity: 0.7;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
          box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
          -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
          -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
          -ms-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
          -o-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2); }
          @media (max-width: 960px) {
            #index #key .slick-dots li button:after {
              content: "";
              top: 15px;
              left: 10px;
              width: 10px;
              height: 10px;
              margin: 0;
              padding: 0;
              background-color: #000000;
              opacity: 0.25;
              border-radius: 5px;
              -moz-border-radius: 5px;
              -webkit-border-radius: 5px;
              -ms-border-radius: 5px;
              -o-border-radius: 5px; } }
          @media (min-width: 961px) and (max-width: 1280px) {
            #index #key .slick-dots li button:after {
              top: 50%;
              left: 0;
              width: 30px;
              height: 4px;
              margin: -2px 0 0 0;
              background-color: #000000;
              opacity: 0.25; } }
        #index #key .slick-dots li button:hover {
          box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0);
          -moz-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0);
          -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0);
          -ms-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0);
          -o-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0); }
      #index #key .slick-dots li.slick-active button:after {
        opacity: 1;
        background-color: #ED1C24; }

#indexContact {
  margin: 0 auto;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ffffff;
  position: relative;
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1);
  height: auto;
  overflow: hidden; }
  #indexContact .inner {
    display: flex;
    display: -ms-flex;
    display: -webkit-flex; }
    @media (max-width: 960px) {
      #indexContact .inner {
        flex-direction: column-reverse; } }
    @media (min-width: 961px) and (max-width: 1280px) {
      #indexContact .inner {
        flex-direction: column-reverse; } }
    #indexContact .inner form#indexSearch {
      flex: 1;
      margin: 10px 20px 10px 0; }
      @media (max-width: 720px) {
        #indexContact .inner form#indexSearch {
          flex: none;
          margin: 10px; } }
      @media (min-width: 721px) and (max-width: 960px) {
        #indexContact .inner form#indexSearch {
          flex: 1;
          margin: 10px 10px 10px 0; } }
      #indexContact .inner form#indexSearch div {
        display: flex;
        display: -ms-flex;
        display: -webkit-flex;
        background-color: #ffffff;
        height: 45px;
        border: 1px solid #dddddd;
        border-radius: 3px; }
        @media (max-width: 720px) {
          #indexContact .inner form#indexSearch div {
            height: 40px; } }
        #indexContact .inner form#indexSearch div i {
          line-height: 45px;
          padding: 0 15px;
          color: #777777; }
          @media (max-width: 720px) {
            #indexContact .inner form#indexSearch div i {
              line-height: 40px;
              padding: 0 10px; } }
          @media (min-width: 721px) and (max-width: 960px) {
            #indexContact .inner form#indexSearch div i {
              padding: 0 10px; } }
        #indexContact .inner form#indexSearch div #indexProdutInput {
          flex: 1;
          height: 45px;
          line-height: 45px;
          padding: 0;
          margin: 0;
          outline: none;
          border: none;
          font-size: 16px; }
          @media (max-width: 720px) {
            #indexContact .inner form#indexSearch div #indexProdutInput {
              height: 40px;
              line-height: 40px; } }
        #indexContact .inner form#indexSearch div #indexProdutSubmit {
          margin: 0px 0;
          padding: 0;
          background: #222222;
          color: #ffffff;
          width: 80px;
          height: 45px;
          line-height: 45px;
          border: none;
          outline: none;
          border: none;
          box-shadow: 0px 1px 2px 0px rgba(34, 34, 34, 0.3);
          border-radius: 0 3px 3px 0; }
          @media (max-width: 720px) {
            #indexContact .inner form#indexSearch div #indexProdutSubmit {
              width: 60px;
              height: 40px;
              line-height: 40px; } }
    #indexContact .inner #indexTel {
      position: relative;
      flex: none;
      width: auto;
      margin: 10px 0 0 20px;
      padding: 0;
      position: relative; }
      @media (min-width: 961px) and (max-width: 1280px) {
        #indexContact .inner #indexTel {
          flex: 1; } }
      #indexContact .inner #indexTel .flex {
        box-sizing: border-box;
        display: block;
        flex-wrap: wrap;
        width: 100%;
        height: 100%;
        padding: 0;
        position: relative; }
        #indexContact .inner #indexTel .flex h3 {
          margin: 0 0 10px 0;
          padding: 0;
          line-height: 35px;
          border-top: 1px solid #dddddd;
          border-bottom: 1px solid #dddddd; }
        #indexContact .inner #indexTel .flex p {
          margin: 0;
          padding: 0; }
          @media (min-width: 961px) and (max-width: 1280px) {
            #indexContact .inner #indexTel .flex p {
              line-height: 1.25; } }
        #indexContact .inner #indexTel .flex p.tel {
          font-size: 24px;
          font-weight: bold;
          margin: 0;
          padding: 0 0 3px 0;
          line-height: 26px; }
          @media (min-width: 721px) and (max-width: 1280px) {
            #indexContact .inner #indexTel .flex p.tel {
              font-size: 21px;
              padding: 0 0 5px 0; } }
          #indexContact .inner #indexTel .flex p.tel img {
            display: inline-block;
            height: 20px;
            margin: 0 5px 0 0;
            vertical-align: middle; }
        #indexContact .inner #indexTel .flex p.smallText {
          font-size: 11px; }
      #indexContact .inner #indexTel .flexBox {
        padding: 0;
        margin: 0; }
        @media (min-width: 721px) and (max-width: 1280px) {
          #indexContact .inner #indexTel .flexBox {
            justify-content: center; } }
      #indexContact .inner #indexTel dl {
        border: none;
        justify-content: center;
        align-content: center;
        align-items: center;
        margin: 0 0 0 0;
        padding: 0 20px;
        width: auto;
        border-right: 1px solid #dddddd; }
        @media (max-width: 1280px) {
          #indexContact .inner #indexTel dl {
            border: none;
            margin: 5px 0; } }
        #indexContact .inner #indexTel dl dt {
          flex: none;
          line-height: 1.2;
          margin: 3px 0 5px 0;
          padding: 0;
          font-size: 13px; }
          #indexContact .inner #indexTel dl dt span {
            font-size: 12px;
            display: inline-block;
            margin: 0 0 0 10px;
            font-weight: normal;
            color: #777777; }
        #indexContact .inner #indexTel dl dd {
          flex: none;
          line-height: 1.2;
          margin: 0;
          padding: 0;
          font-size: 18px;
          font-weight: bold;
          width: auto; }
          #indexContact .inner #indexTel dl dd span {
            display: inline-block;
            margin: 0 10px 0 0;
            font-weight: bold;
            font-size: 16px; }

#indexApplicationContainer {
  border-top: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
  background: #f7f7f7;
  padding: 40px 0 30px 0; }
  @media (max-width: 720px) {
    #indexApplicationContainer {
      border: none;
      padding: 0; } }
  @media (min-width: 721px) and (max-width: 960px) {
    #indexApplicationContainer {
      padding: 20px 0; } }
  #indexApplicationContainer .sectionHeader {
    margin-top: 0; }
  #indexApplicationContainer ul.flexBox {
    flex-wrap: wrap;
    margin: 0;
    padding: 0; }
    #indexApplicationContainer ul.flexBox li {
      width: 33.33%;
      flex: none;
      margin: 0;
      padding: 0; }
      @media (max-width: 720px) {
        #indexApplicationContainer ul.flexBox li {
          width: 100%; } }
      @media (min-width: 721px) and (max-width: 960px) {
        #indexApplicationContainer ul.flexBox li {
          width: 50%; } }
      #indexApplicationContainer ul.flexBox li a {
        padding: 10px 100px 10px 15px;
        background-color: #ffffff;
        display: block;
        position: relative;
        margin: 0 -1px -1px 0;
        border: 1px solid #dddddd;
        transition: all 0.2s ease-in-out;
        color: #222222; }
        #indexApplicationContainer ul.flexBox li a:after {
          content: "";
          width: 10px;
          height: 10px;
          display: block;
          border-right: 2px solid #cccccc;
          border-bottom: 2px solid #cccccc;
          transform: rotate(-45deg);
          position: absolute;
          right: 20px;
          top: 50%;
          margin: -6px 0 0 0;
          transition: all 0.2s ease-in-out; }
          @media (max-width: 720px) {
            #indexApplicationContainer ul.flexBox li a:after {
              right: 25px;
              transition: all 0s ease-in-out; } }
        #indexApplicationContainer ul.flexBox li a:hover {
          border: 1px solid #0066CC;
          z-index: 1;
          text-decoration: none;
          color: #0066CC; }
          #indexApplicationContainer ul.flexBox li a:hover:after {
            right: 15px;
            border-right: 2px solid #0066CC;
            border-bottom: 2px solid #0066CC; }

#indexDemo {
  display: flex;
  display: -ms-flex;
  display: -webkit-flex;
  justify-content: space-between;
  align-content: stretch;
  align-items: stretch;
  margin: 0 auto 20px auto; }
  @media (max-width: 720px) {
    #indexDemo {
      flex-wrap: wrap;
      background-color: #eeeeee;
      padding: 0 6px 6px 6px;
      margin: 0 auto; } }
  @media (min-width: 961px) and (max-width: 1280px) {
    #indexDemo {
      margin: 0 auto 40px auto; } }
  #indexDemo > section {
    width: -webkit-calc(50% - 5px);
    width: calc(50% - 5px);
    position: relative;
    margin: 0;
    padding: 0; }
    @media (max-width: 720px) {
      #indexDemo > section {
        width: 100%;
        border-top: 1px solid #ffffff;
        box-sizing: border-box; } }
  @media screen and (max-width: 720px) and (min-width: 640px) and (max-width: 720px) {
    #indexDemo > section {
      width: 50%;
      border-right: 1px solid #ffffff; } }

    @media (min-width: 961px) and (max-width: 1280px) {
      #indexDemo > section {
        width: -webkit-calc(50% - 10px);
        width: calc(50% - 10px); } }
    #indexDemo > section a {
      display: block;
      width: 100%;
      height: 100%;
      padding: 15px 20px 20px 160px;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      position: relative;
      box-sizing: border-box;
      color: #ffffff;
      background: #222222;
      transition: all 0.2s ease-in-out; }
      @media (max-width: 720px) {
        #indexDemo > section a {
          padding: 10px 80px 10px 150px;
          transition: all 0s ease-in-out; } }
      #indexDemo > section a:before {
        content: "";
        box-sizing: border-box;
        width: -webkit-calc(100% - 4px);
        width: calc(100% - 4px);
        height: -webkit-calc(100% - 4px);
        height: calc(100% - 4px);
        border: 1px solid rgba(255, 255, 255, 0.5);
        position: absolute;
        left: 2px;
        top: 2px;
        display: block;
        transition: all 0.2s ease-in-out; }
        @media (max-width: 720px) {
          #indexDemo > section a:before {
            display: none; } }
      @media (max-width: 720px) {
        #indexDemo > section a:after {
          content: "";
          width: 10px;
          height: 10px;
          display: block;
          border-right: 2px solid #ffffff;
          border-bottom: 2px solid #ffffff;
          transform: rotate(-45deg);
          position: absolute;
          right: 25px;
          top: 50%;
          margin: -6px 0 0 0;
          transition: all 0s ease-in-out; } }
      #indexDemo > section a h3 {
        margin: 0; }
      #indexDemo > section a p {
        line-height: 1.25;
        font-size: 14px; }
      #indexDemo > section a p.btn {
        margin: 0.5em auto 0 auto;
        text-align: center;
        line-height: 40px;
        height: 40px;
        display: inline-block;
        width: auto;
        position: relative;
        color: #ffffff;
        padding: 0 60px 0 20px;
        background-color: #0066CC; }
        @media (max-width: 720px) {
          #indexDemo > section a p.btn {
            display: none; } }
        #indexDemo > section a p.btn:after {
          content: "";
          width: 6px;
          height: 6px;
          display: block;
          border-right: 2px solid #ffffff;
          border-bottom: 2px solid #ffffff;
          transform: rotate(-45deg);
          transition: all 0.2s ease-in-out;
          position: absolute;
          right: 20px;
          top: 50%;
          margin: -4px 0 0 0; }
      #indexDemo > section a:hover {
        text-decoration: none; }
        #indexDemo > section a:hover:before {
          width: -webkit-calc(100% - 10px);
          width: calc(100% - 10px);
          height: -webkit-calc(100% - 10px);
          height: calc(100% - 10px);
          border: 1px solid #ffffff;
          left: 5px;
          top: 5px; }
        #indexDemo > section a:hover p.btn:after {
          right: 15px; }
    #indexDemo > section#indexWarranty a {
      background-repeat: no-repeat;
      background-image: url(../images/warranty.png), -webkit-linear-gradient(left, #333333 0%, #111111 100%);
      background-image: url(../images/warranty.png), -o-linear-gradient(left, #333333 0%, #111111 100%);
      background-image: url(../images/warranty.png), linear-gradient(to right, #333333 0%, #111111 100%);
      background-size: 140px auto , cover;
      background-position: 10px center ,left center; }
      @media (max-width: 720px) {
        #indexDemo > section#indexWarranty a {
          background-size: 100px auto , cover; } }
    #indexDemo > section#indexFaq a {
      background-image: url(../images/faq.png), -webkit-linear-gradient(left, #333333 0%, #111111 100%);
      background-image: url(../images/faq.png), -o-linear-gradient(left, #333333 0%, #111111 100%);
      background-image: url(../images/faq.png), linear-gradient(to right, #333333 0%, #111111 100%);
      background-size: 140px auto , cover;
      background-position: 10px center ,left center;
      background-repeat: no-repeat; }
      @media (max-width: 720px) {
        #indexDemo > section#indexFaq a {
          background-size: 100px auto , cover; } }

#indexProductsContainer {
  display: flex;
  display: -ms-flex;
  display: -webkit-flex;
  margin: 0 auto;
  padding: 10px 0;
  align-content: stretch;
  align-items: stretch; }
  @media (max-width: 960px) {
    #indexProductsContainer {
      flex-direction: column; } }
  #indexProductsContainer section {
    margin: 0;
    padding: 0; }
  #indexProductsContainer #indexProducts {
    flex: 3.5;
    margin: 0 20px 0 0; }
    @media (max-width: 960px) {
      #indexProductsContainer #indexProducts {
        flex: none;
        margin: 0; } }
    #indexProductsContainer #indexProducts ul {
      display: flex;
      display: -ms-flex;
      display: -webkit-flex;
      padding: 4px;
      width: 100%;
      box-sizing: border-box;
      background-color: #eeeeee;
      position: relative;
      flex-wrap: wrap;
      align-content: stretch;
      align-items: stretch; }
      @media (max-width: 720px) {
        #indexProductsContainer #indexProducts ul {
          padding: 5px; } }
      #indexProductsContainer #indexProducts ul li {
        box-sizing: border-box;
        width: 33.33%;
        padding: 2px; }
        @media (max-width: 720px) {
          #indexProductsContainer #indexProducts ul li {
            padding: 1px;
            margin: 0; } }
        @media (min-width: 721px) and (max-width: 960px) {
          #indexProductsContainer #indexProducts ul li {
            margin: 0; } }
        @media (min-width: 961px) and (max-width: 1280px) {
          #indexProductsContainer #indexProducts ul li {
            padding: 1px;
            margin: 0; } }
        #indexProductsContainer #indexProducts ul li a {
          display: flex;
          display: -ms-flex;
          display: -webkit-flex;
          text-decoration: none;
          border: 1px solid #ffffff;
          color: #222222;
          padding: 10px;
          height: 100%;
          position: relative;
          transition: all 0.2s ease-in-out;
          justify-content: flex-start;
          align-content: center;
          align-items: center;
          background-color: #ffffff;
          position: relative;
          overflow: hidden;
          font-weight: bold;
          box-sizing: border-box;
          font-size: 13px; }
          @media (max-width: 720px) {
            #indexProductsContainer #indexProducts ul li a {
              display: block;
              padding: 5px 5px 10px 5px;
              transition: all 0s ease-in-out; } }
          #indexProductsContainer #indexProducts ul li a:before {
            content: "";
            width: 0;
            height: 0;
            border: 5px solid transparent;
            border-right: 5px solid #dddddd;
            border-bottom: 5px solid #dddddd;
            position: absolute;
            right: -10px;
            bottom: 0;
            transition: all 0.2s ease-in-out; }
            @media (max-width: 720px) {
              #indexProductsContainer #indexProducts ul li a:before {
                display: none; } }
          #indexProductsContainer #indexProducts ul li a figure {
            width: 70px;
            height: auto;
            margin: 0 5px 0 0; }
            @media (max-width: 720px) {
              #indexProductsContainer #indexProducts ul li a figure {
                width: 65px;
                height: auto;
                margin: 0 auto;
                text-align: center; } }
            @media (min-width: 961px) and (max-width: 1280px) {
              #indexProductsContainer #indexProducts ul li a figure {
                width: 70px; } }
            #indexProductsContainer #indexProducts ul li a figure img {
              width: 100%;
              height: 100%;
              object-fit: contain; }
          #indexProductsContainer #indexProducts ul li a ul {
            flex: 1;
            background: none;
            margin: 0;
            padding: 0 0 0 5px;
            display: block; }
            #indexProductsContainer #indexProducts ul li a ul li {
              position: relative;
              padding: 3px 0 3px 10px;
              box-sizing: border-box;
              width: 100%;
              line-height: 20px;
              color: #333333;
              font-weight: 600;
              font-size: 15px;
              line-height: 1.25; }
              @media (max-width: 720px) {
                #indexProductsContainer #indexProducts ul li a ul li {
                  padding: 5px 0 0 10px;
                  line-height: 1.3;
                  font-size: 12px; } }
              @media (min-width: 961px) and (max-width: 1280px) {
                #indexProductsContainer #indexProducts ul li a ul li {
                  font-size: 13px;
                  line-height: 1.25;
                  margin: 0; } }
              #indexProductsContainer #indexProducts ul li a ul li span {
                font-size: 12px;
                display: block;
                line-height: 1.25;
                padding: 4px 0 0 0;
                font-weight: normal; }
                @media (max-width: 720px) {
                  #indexProductsContainer #indexProducts ul li a ul li span {
                    font-size: 11px; } }
                @media (min-width: 961px) and (max-width: 1280px) {
                  #indexProductsContainer #indexProducts ul li a ul li span {
                    font-size: 11px; } }
              #indexProductsContainer #indexProducts ul li a ul li:after {
                content: "";
                width: 3px;
                height: 3px;
                display: block;
                border-right: 1px solid #0066CC;
                border-bottom: 1px solid #0066CC;
                transform: rotate(-45deg);
                position: absolute;
                left: 0px;
                top: 11px; }
          #indexProductsContainer #indexProducts ul li a:hover {
            border: 1px solid #ED1C24; }
            #indexProductsContainer #indexProducts ul li a:hover p {
              color: #de1219; }
            #indexProductsContainer #indexProducts ul li a:hover:before {
              border-right: 5px solid #ED1C24;
              border-bottom: 5px solid #ED1C24;
              right: 0; }
  #indexProductsContainer #indexNews {
    flex: 1;
    margin: 0 0 0 0;
    display: flex;
    display: -ms-flex;
    display: -webkit-flex;
    flex-direction: column;
    justify-content: space-between; }
    @media (min-width: 721px) and (max-width: 960px) {
      #indexProductsContainer #indexNews {
        margin: 10px 0; } }
    #indexProductsContainer #indexNews .sectionHeader {
      margin-top: 0; }
    @media (max-width: 720px) {
      #indexProductsContainer #indexNews .indexNews {
        display: none; } }
    @media (min-width: 721px) and (max-width: 960px) {
      #indexProductsContainer #indexNews .indexNews {
        flex: 2;
        margin: 0 10px 0 0; } }
    #indexProductsContainer #indexNews ul {
      border-top: 1px dotted #dddddd;
      margin: 0 0 0 0; }
      @media (max-width: 720px) {
        #indexProductsContainer #indexNews ul {
          margin: 5px 10px; } }
      @media (min-width: 721px) and (max-width: 960px) {
        #indexProductsContainer #indexNews ul {
          flex: 1.5; } }
      #indexProductsContainer #indexNews ul li {
        border-bottom: 1px dotted #dddddd; }
        @media (max-width: 720px) {
          #indexProductsContainer #indexNews ul li {
            margin: 0; } }
        @media (min-width: 721px) and (max-width: 960px) {
          #indexProductsContainer #indexNews ul li {
            padding: 0;
            margin: 0; } }
        #indexProductsContainer #indexNews ul li a {
          text-decoration: none;
          color: #222222;
          justify-content: flex-start;
          align-content: center;
          align-items: center;
          transition: all 0.2s ease-in-out;
          padding: 10px 0;
          position: relative;
          display: block; }
          @media (max-width: 720px) {
            #indexProductsContainer #indexNews ul li a {
              transition: all 0s ease-in-out; } }
          #indexProductsContainer #indexNews ul li a p {
            font-size: 13px;
            margin: 0 0 0.5em 0; }
            @media (min-width: 961px) and (max-width: 1280px) {
              #indexProductsContainer #indexNews ul li a p {
                font-size: 12px;
                margin: 0.25em 0; } }
            #indexProductsContainer #indexNews ul li a p span {
              display: inline-block;
              margin: 0 10px 0 0; }
              #indexProductsContainer #indexNews ul li a p span.cat {
                background-color: #000000;
                padding: 0 20px;
                color: #ffffff; }
              #indexProductsContainer #indexNews ul li a p span.event {
                background-color: #43A047; }
              #indexProductsContainer #indexNews ul li a p span.information {
                background-color: #00ACC1; }
              #indexProductsContainer #indexNews ul li a p span.campaign {
                background-color: #5E35B1; }
              #indexProductsContainer #indexNews ul li a p span.products_info {
                background-color: #D81B60; }
          #indexProductsContainer #indexNews ul li a h4 {
            margin: 0.5em 0 0 0;
            line-height: 1.25;
            padding: 0 20px 0 0;
            font-weight: normal;
            border: none;
            color: #222222;
            font-size: 13px;
            position: relative; }
            @media (max-width: 720px) {
              #indexProductsContainer #indexNews ul li a h4 {
                margin: 0.5em 0;
                font-size: 14px;
                line-height: 20px; } }
            @media (min-width: 721px) and (max-width: 960px) {
              #indexProductsContainer #indexNews ul li a h4 {
                font-size: 14px;
                line-height: 20px; } }
            @media (min-width: 961px) and (max-width: 1280px) {
              #indexProductsContainer #indexNews ul li a h4 {
                margin: 0.5em 0;
                padding: 0 16px 0 0;
                line-height: 16px; } }
            #indexProductsContainer #indexNews ul li a h4:after {
              content: "";
              width: 8px;
              height: 8px;
              display: block;
              border-right: 1px solid #cccccc;
              border-bottom: 1px solid #cccccc;
              transform: rotate(-45deg);
              position: absolute;
              right: 5px;
              top: 50%;
              margin: -5px 0 0 0;
              transition: all 0.2s ease-in-out; }
              @media (max-width: 720px) {
                #indexProductsContainer #indexNews ul li a h4:after {
                  transition: all 0s ease-in-out; } }
          #indexProductsContainer #indexNews ul li a:hover {
            color: #222222; }
            #indexProductsContainer #indexNews ul li a:hover h4:after {
              border-right: 1px solid #0066CC;
              border-bottom: 1px solid #0066CC;
              right: 0px; }
    #indexProductsContainer #indexNews .indexContact {
      padding: 0 15px 15px 15px;
      border: 1px solid #dddddd;
      margin: 0 0 20px 0;
      flex: 1; }
      @media (max-width: 720px) {
        #indexProductsContainer #indexNews .indexContact {
          padding: 15px 15px;
          border: none; } }
      @media (min-width: 721px) and (max-width: 960px) {
        #indexProductsContainer #indexNews .indexContact {
          margin: 0 0 20px 0; } }
      @media (min-width: 961px) and (max-width: 1280px) {
        #indexProductsContainer #indexNews .indexContact {
          padding: 0 10px 10px 10px;
          margin: 0 0 15px 0; } }
      #indexProductsContainer #indexNews .indexContact h3 {
        margin: 0 0 1em 0;
        padding: 0;
        border: none;
        border-bottom: 1px solid #dddddd;
        line-height: 45px; }
        @media (min-width: 961px) and (max-width: 1280px) {
          #indexProductsContainer #indexNews .indexContact h3 {
            line-height: 35px; } }
      #indexProductsContainer #indexNews .indexContact p {
        line-height: 1.5;
        margin: 0; }
        #indexProductsContainer #indexNews .indexContact p a {
          color: #ffffff; }
      #indexProductsContainer #indexNews .indexContact p.tel {
        font-size: 21px;
        font-weight: bold;
        line-height: 24px;
        margin: 0.5em 0; }
        #indexProductsContainer #indexNews .indexContact p.tel img {
          width: 30px;
          height: auto;
          display: inline-block;
          padding: 0 10px 0 0; }

/*#indexColumnContainer{
	padding: 20px 0;
	position: relative;
	@include sptab {
		padding: 0;
	}
	&:before{
		content: "";
		width: 1px;
		height: 100%;
		position: absolute;
		left: 50%;
		top: 0;
		background-color: #dddddd;
		@include sptab {
			display: none;
		}
	}
	.inner{
		@include flex;
		justify-content: space-between;
		@include sp {
			flex-direction: column;
		}
		@include tab {
			flex-wrap: wrap;
			width: 100%;
		}
		section{
			width : -webkit-calc(50% - 40px) ;
			width : calc(50% - 40px) ;
			position: relative;
			padding: 0;
			margin: 0 0 20px 0;
			border-bottom: 1px dotted #dddddd;
			@include sp {
				width: 100%;
				margin: 0 0 10px 0;
			}
			@include tab {
				width: 100%;
				position: relative;
				padding: 15px;
				margin: 0 0 0px 0;
				border-bottom: 1px solid #dddddd;
			}
			&:last-of-type{
				@include tab {
					background-color: #f7f7f7;
					figure{
						background-color: #ffffff;
					}
				}
			}
			div.article{
				border-top: 1px dotted #dddddd;
				@include sp {
					margin: 0 10px;
				}
				a{
					@include flex;
					position: relative;
					padding: 10px 30px 10px 0;
					align-content: stretch;
					align-items: stretch;
					transition: all 0.2s ease-in-out;
					color: $black;
					@include sp {
						padding: 5px 60px 5px 0px;
						transition: all 0s ease-in-out;
					}
					&:after{
						content: "";
						width: 10px;
						height: 10px;
						display: block;
						border-right: 2px solid #cccccc;
						border-bottom: 2px solid #cccccc;
						transform: rotate(-45deg);
						position: absolute;
						right: 5px;
						top: 50%;
						margin: -6px 0 0 0;
						transition: all 0.2s ease-in-out;
						@include sp {
							right: 25px;
							transition: all 0s ease-in-out;
						}
					}
					figure{
						width: 120px;
						height: 120px;
						border: 1px solid #eeeeee;
						margin: 0 10px 0 0;
						transition: all 0.2s ease-in-out;
						@include sp {
							width: 60px;
							height: 60px;
							transition: all 0s ease-in-out;
						}
						img{
							padding: 9px;
							width: 100px;
							height: 100px;
							object-fit: contain;
							@include sp {
								padding: 4px;
								width: 50px;
								height: 50px;
							}
						}
					}
					div{
						flex: 1;
						@include flex;
						flex-direction: column;
						justify-content: center;
						padding: 0;
						p{
							margin: 0 0 0.5em 0;
							transition: all 0.2s ease-in-out;
							@include sp {
								margin: 0;
								transition: all 0s ease-in-out;
							}
							&.smallText{
								transition: all 0.2s ease-in-out;
								line-height: 1.25;
								@include sp {
									display: none;
								}
							}
							span.time{
									color: #777777;
									font-size: 13px;
								}
						}
						h4{
							margin: 0.5em 0;
							padding: 0;
							border: none;
							transition: all 0.2s ease-in-out;
							position: relative;
							@include sp {
								margin: 0;
								font-weight: normal;
								font-size: 14px;
								transition: all 0s ease-in-out;
							}
						}
					}
					&:hover{
						text-decoration: none;
						&:after{
							right: 0;
							border-right: 2px solid $blue500;
							border-bottom: 2px solid $blue500;
							@include sp {
								right: 25px !important;
							}
						}
						figure{
							border: 1px solid $blue500;
						}
						div{
							color: $black;
							p{
								color: $black;
								&.smallText{
									color: $black;
								}
								
							}
						}
					}
				}
			}
		}
	}
}*/
#indexColumnContainer {
  padding: 20px 0;
  position: relative;
  /*&:before{
  	content: "";
  	width: 1px;
  	height: 100%;
  	position: absolute;
  	left: 50%;
  	top: 0;
  	background-color: #dddddd;
  	@include sptab {
  		display: none;
  	}
  }*/ }
  @media (max-width: 960px) {
    #indexColumnContainer {
      padding: 0; } }
  @media (max-width: 720px) {
    #indexColumnContainer .inner {
      flex-direction: column; } }
  @media (min-width: 721px) and (max-width: 960px) {
    #indexColumnContainer .inner {
      flex-wrap: wrap;
      width: 100%; } }
  #indexColumnContainer .inner section {
    width: 100%;
    position: relative;
    padding: 0; }
    @media (max-width: 720px) {
      #indexColumnContainer .inner section {
        width: 100%;
        margin: 0 0 10px 0; } }
    @media (min-width: 721px) and (max-width: 960px) {
      #indexColumnContainer .inner section {
        width: 100%;
        padding: 15px;
        margin: 0; } }
    #indexColumnContainer .inner section div.article {
      width: calc(20% - 8px);
      flex: none;
      margin: 0 10px 0 0;
      text-align: center;
      background-color: #fff;
      align-self: stretch;
      border: 1px solid #eee; }
      #indexColumnContainer .inner section div.article:last-child {
        margin-right: 0; }
      @media (max-width: 720px) {
        #indexColumnContainer .inner section div.article {
          margin: 0 10px 4px 10px;
          width: calc(100% - 20px); } }
      #indexColumnContainer .inner section div.article a {
        display: block;
        position: relative;
        align-content: stretch;
        align-items: stretch;
        transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -webkit-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        color: #222222;
        /*@include flex;
        position: relative;
        padding: 10px 30px 10px 0;
        align-content: stretch;
        align-items: stretch;
        transition: all 0.2s ease-in-out;
        color: $black;
        @include sp {
        	padding: 5px 60px 5px 0px;
        	transition: all 0s ease-in-out;
        }*/
        /*&:after{
        	content: "";
        	width: 10px;
        	height: 10px;
        	display: block;
        	border-right: 2px solid #cccccc;
        	border-bottom: 2px solid #cccccc;
        	transform: rotate(-45deg);
        	position: absolute;
        	right: 5px;
        	top: 50%;
        	margin: -6px 0 0 0;
        	transition: all 0.2s ease-in-out;
        	@include sp {
        		right: 25px;
        		transition: all 0s ease-in-out;
        	}
        }*/ }
        @media (max-width: 720px) {
          #indexColumnContainer .inner section div.article a {
            display: -webkit-flex;
            display: -moz-flex;
            display: -ms-flex;
            display: -o-flex;
            display: flex;
            padding: 0;
            transition: all 0s ease-in-out;
            -moz-transition: all 0s ease-in-out;
            -webkit-transition: all 0s ease-in-out;
            -ms-transition: all 0s ease-in-out;
            -o-transition: all 0s ease-in-out; } }
        #indexColumnContainer .inner section div.article a figure {
          /*width: 120px;
          height: 120px;
          border: 1px solid #eeeeee;
          margin: 0 10px 0 0;
          transition: all 0.2s ease-in-out;
          @include sp {
          	width: 60px;
          	height: 60px;
          	transition: all 0s ease-in-out;
          }*/
          width: 100%;
          background-color: #fafafa;
          margin: 0;
          transition: all 0.2s ease-in-out;
          -moz-transition: all 0.2s ease-in-out;
          -webkit-transition: all 0.2s ease-in-out;
          -ms-transition: all 0.2s ease-in-out;
          -o-transition: all 0.2s ease-in-out; }
          @media (max-width: 720px) {
            #indexColumnContainer .inner section div.article a figure {
              width: 100px;
              height: auto;
              transition: all 0s ease-in-out;
              -moz-transition: all 0s ease-in-out;
              -webkit-transition: all 0s ease-in-out;
              -ms-transition: all 0s ease-in-out;
              -o-transition: all 0s ease-in-out; } }
          #indexColumnContainer .inner section div.article a figure img {
            							/*padding: 9px;
            							width: 100px;
            							height: 100px;
            
            							object-fit: contain;*/
            width: calc(52% - 18px);
            object-fit: contain;
            margin: 0 auto;
            /*@include sp {
            	padding: 4px;
            	width: 50px;
            	height: 50px;
            }*/ }
            @media (max-width: 720px) {
              #indexColumnContainer .inner section div.article a figure img {
                padding: 4px;
                width: calc(100% - 8px);
                height: auto; } }
        #indexColumnContainer .inner section div.article a div {
          display: flex;
          display: -moz-flex;
          display: -webkit-flex;
          display: -ms-flex;
          display: -o-flex;
          flex-direction: column;
          justify-content: center;
          padding: 15px;
          margin: 0;
          text-align: left; }
          @media (max-width: 720px) {
            #indexColumnContainer .inner section div.article a div {
              flex: none;
              width: calc(100% - 100px); } }
          #indexColumnContainer .inner section div.article a div p {
            margin: 0 0 0.5em 0;
            transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -webkit-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out; }
            @media (max-width: 720px) {
              #indexColumnContainer .inner section div.article a div p {
                margin: 0;
                transition: all 0s ease-in-out;
                -moz-transition: all 0s ease-in-out;
                -webkit-transition: all 0s ease-in-out;
                -ms-transition: all 0s ease-in-out;
                -o-transition: all 0s ease-in-out; } }
            #indexColumnContainer .inner section div.article a div p.smallText {
              transition: all 0.2s ease-in-out;
              -moz-transition: all 0.2s ease-in-out;
              -webkit-transition: all 0.2s ease-in-out;
              -ms-transition: all 0.2s ease-in-out;
              -o-transition: all 0.2s ease-in-out;
              line-height: 1.25; }
              @media (max-width: 720px) {
                #indexColumnContainer .inner section div.article a div p.smallText {
                  display: none; } }
            #indexColumnContainer .inner section div.article a div p span.time {
              color: #777777;
              font-size: 13px; }
          #indexColumnContainer .inner section div.article a div h4 {
            margin: 0.5em 0;
            padding: 0;
            border: none;
            transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -webkit-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            position: relative; }
            @media (max-width: 720px) {
              #indexColumnContainer .inner section div.article a div h4 {
                margin: 0;
                font-weight: normal;
                font-size: 14px;
                transition: all 0s ease-in-out; } }
        #indexColumnContainer .inner section div.article a:hover {
          text-decoration: none;
          opacity: .6;
          /*&:after{
          	right: 0;
          	border-right: 2px solid $blue500;
          	border-bottom: 2px solid $blue500;
          	@include sp {
          		right: 25px !important;
          	}
          }*/
          /*figure{
          	border: 1px solid $blue500;
          }*/ }
          #indexColumnContainer .inner section div.article a:hover div {
            color: #222222; }
            #indexColumnContainer .inner section div.article a:hover div p {
              color: #222222; }
              #indexColumnContainer .inner section div.article a:hover div p.smallText {
                color: #222222; }
    @media (min-width: 721px) and (max-width: 960px) {
      #indexColumnContainer .inner section:last-of-type {
        background-color: #f7f7f7; } }
    @media (min-width: 721px) and (max-width: 960px) {
      #indexColumnContainer .inner section:last-of-type figure {
        background-color: #ffffff; } }

#indexNewsSP {
  display: none; }
  @media (max-width: 720px) {
    #indexNewsSP {
      display: block; }
      #indexNewsSP ul {
        margin: 5px 10px; }
        #indexNewsSP ul li {
          margin: 0;
          border-bottom: 1px dotted #dddddd; }
          #indexNewsSP ul li a {
            text-decoration: none;
            color: #222222;
            justify-content: flex-start;
            align-content: center;
            align-items: center;
            transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -webkit-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            padding: 10px 0;
            position: relative;
            display: block; }
            #indexNewsSP ul li a p {
              font-size: 13px;
              margin: 0.5em 0; }
              #indexNewsSP ul li a p span {
                display: inline-block;
                margin: 0 10px 0 0; }
                #indexNewsSP ul li a p span.cat {
                  background-color: #000000;
                  padding: 0 20px;
                  color: #ffffff; }
                #indexNewsSP ul li a p span.event {
                  background-color: #43A047; }
                #indexNewsSP ul li a p span.news {
                  background-color: #00ACC1; }
                #indexNewsSP ul li a p span.campaign {
                  background-color: #5E35B1; }
            #indexNewsSP ul li a h4 {
              margin: 0.5em 0;
              line-height: 1.25;
              padding: 0 20px 0 0;
              font-weight: normal;
              border: none;
              color: #222222;
              font-size: 14px;
              line-height: 20px;
              position: relative; }
              #indexNewsSP ul li a h4:after {
                content: "";
                width: 8px;
                height: 8px;
                display: block;
                border-right: 1px solid #cccccc;
                border-bottom: 1px solid #cccccc;
                transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -webkit-transform: rotate(-45deg);
                -ms-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                position: absolute;
                right: 10px;
                top: 50%;
                margin: -5px 0 0 0;
                transition: all 0.2s ease-in-out;
                -moz-transition: all 0.2s ease-in-out;
                -webkit-transition: all 0.2s ease-in-out;
                -ms-transition: all 0.2s ease-in-out;
                -o-transition: all 0.2s ease-in-out; }
            #indexNewsSP ul li a:hover {
              color: #222222; }
              #indexNewsSP ul li a:hover h4:after {
                border-right: 1px solid #0066CC;
                border-bottom: 1px solid #0066CC;
                right: 5px; } }

@media screen and (min-width: 961px) and (max-width: 1280px) {
  #index {
    margin: -100px 0 0 0;
    padding: 0; }

  #indexContact {
    margin: 0 auto;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ffffff;
    position: relative;
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1);
    height: auto;
    overflow: hidden; }
    #indexContact .inner {
      display: flex;
      display: -ms-flex;
      display: -webkit-flex; }
      #indexContact .inner form#indexSearch {
        margin: 10px 20px 10px 0; }
        #indexContact .inner form#indexSearch div {
          display: flex;
          display: -ms-flex;
          display: -webkit-flex;
          background-color: #ffffff;
          height: 45px;
          border: 1px solid #dddddd;
          border-radius: 3px; }
          #indexContact .inner form#indexSearch div i {
            padding: 0 15px;
            color: #777777; }
          #indexContact .inner form#indexSearch div #indexProdutInput {
            flex: 2;
            padding: 0;
            margin: 0;
            outline: none;
            border: none;
            font-size: 16px; }
          #indexContact .inner form#indexSearch div #indexProdutSubmit {
            margin: 0px 0;
            padding: 0;
            background: #222222;
            color: #ffffff;
            width: 80px;
            border: none;
            outline: none;
            border: none;
            box-shadow: 0px 1px 2px 0px rgba(34, 34, 34, 0.3);
            border-radius: 0 3px 3px 0; }
      #indexContact .inner #indexTel {
        flex: 1;
        margin: 10px 0 0 0;
        position: relative; }
        #indexContact .inner #indexTel .flex {
          box-sizing: border-box;
          display: block;
          flex-wrap: wrap;
          width: 100%;
          height: 100%;
          padding: 0;
          position: relative; }
          #indexContact .inner #indexTel .flex h3 {
            margin: 0 0 10px 0;
            padding: 0;
            line-height: 35px;
            border-top: 1px solid #dddddd;
            border-bottom: 1px solid #dddddd; }
          #indexContact .inner #indexTel .flex p {
            margin: 0;
            padding: 0;
            line-height: 1.25; }
          #indexContact .inner #indexTel .flex p.tel {
            font-size: 24px;
            font-weight: bold;
            margin: 0;
            padding: 0 0 5px 0;
            line-height: 26px; }
            #indexContact .inner #indexTel .flex p.tel img {
              display: inline-block;
              height: 20px;
              margin: 0 5px 0 0;
              vertical-align: middle; }

  #indexApplicationContainer {
    background-image: url(../images/dot.png);
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    padding: 40px 0 30px 0; }
    #indexApplicationContainer .sectionHeader {
      margin-top: 0; }
    #indexApplicationContainer #indexCaseArticleList {
      display: flex;
      display: -ms-flex;
      display: -webkit-flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-content: stretch;
      align-items: stretch; }
      #indexApplicationContainer #indexCaseArticleList .article {
        width: 50%;
        width: -webkit-calc(50% - 10px);
        width: calc(50% - 10px);
        text-align: center;
        margin: 0 0 10px 0; }
        #indexApplicationContainer #indexCaseArticleList .article a {
          position: relative;
          background-color: #ffffff;
          border: 1px solid #dddddd;
          transition: all 0.2s ease-in-out;
          box-sizing: border-box;
          height: 100%;
          display: flex;
          display: -ms-flex;
          display: -webkit-flex;
          justify-content: flex-start;
          align-content: center;
          align-items: center;
          padding: 0 100px 0 0;
          color: #222222; }
          #indexApplicationContainer #indexCaseArticleList .article a:after {
            content: "";
            width: 10px;
            height: 10px;
            display: block;
            border-right: 2px solid #cccccc;
            border-bottom: 2px solid #cccccc;
            transform: rotate(-45deg);
            position: absolute;
            right: 20px;
            top: 50%;
            margin: -6px 0 0 0;
            transition: all 0.2s ease-in-out; }
          #indexApplicationContainer #indexCaseArticleList .article a figure {
            width: 20%;
            height: 0;
            position: relative;
            padding: 20% 0 0 0;
            margin: 0 20px 0 0;
            overflow: hidden; }
            #indexApplicationContainer #indexCaseArticleList .article a figure img {
              position: absolute;
              left: 0;
              top: 0;
              width: 100%;
              height: 100%;
              object-fit: contain;
              display: block;
              margin: 0 auto; }
          #indexApplicationContainer #indexCaseArticleList .article a h3 {
            transition: all 0.2s ease-in-out;
            margin: 0;
            flex: 1;
            padding: 1em 0;
            border: none;
            text-align: left; }
          #indexApplicationContainer #indexCaseArticleList .article a:hover {
            border: 1px solid #0066CC;
            text-decoration: none; }
            #indexApplicationContainer #indexCaseArticleList .article a:hover:after {
              border-right: 2px solid #0066CC;
              border-bottom: 2px solid #0066CC;
              right: 15px; }
            #indexApplicationContainer #indexCaseArticleList .article a:hover h3 {
              color: #0066CC; }

  #indexDemo {
    display: flex;
    display: -ms-flex;
    display: -webkit-flex;
    justify-content: space-between;
    align-content: stretch;
    align-items: stretch;
    margin: 0 auto 40px auto; }
    #indexDemo > section {
      width: -webkit-calc(50% - 10px);
      width: calc(50% - 10px);
      position: relative;
      margin: 0;
      padding: 0; }
      #indexDemo > section a {
        display: block;
        width: 100%;
        height: 100%;
        padding: 15px 20px 20px 150px;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        position: relative;
        box-sizing: border-box;
        color: #ffffff;
        background-color: #222222;
        transition: all 0.2s ease-in-out; }
        #indexDemo > section a:before {
          content: "";
          box-sizing: border-box;
          width: -webkit-calc(100% - 4px);
          width: calc(100% - 4px);
          height: -webkit-calc(100% - 4px);
          height: calc(100% - 4px);
          border: 1px solid rgba(255, 255, 255, 0.5);
          position: absolute;
          left: 2px;
          top: 2px;
          display: block;
          transition: all 0.2s ease-in-out; }
        #indexDemo > section a h3 {
          margin: 0; }
        #indexDemo > section a p {
          line-height: 1.25;
          font-size: 14px; }
        #indexDemo > section a p.btn {
          margin: 0.5em auto 0 auto;
          text-align: center;
          line-height: 40px;
          height: 40px;
          display: inline-block;
          width: auto;
          position: relative;
          color: #ffffff;
          padding: 0 60px 0 20px;
          background-color: #0066CC; }
          #indexDemo > section a p.btn:after {
            content: "";
            width: 6px;
            height: 6px;
            display: block;
            border-right: 2px solid #ffffff;
            border-bottom: 2px solid #ffffff;
            transform: rotate(-45deg);
            transition: all 0.2s ease-in-out;
            position: absolute;
            right: 20px;
            top: 50%;
            margin: -4px 0 0 0; }
        #indexDemo > section a:hover {
          text-decoration: none; }
          #indexDemo > section a:hover:before {
            width: -webkit-calc(100% - 10px);
            width: calc(100% - 10px);
            height: -webkit-calc(100% - 10px);
            height: calc(100% - 10px);
            border: 1px solid #ffffff;
            left: 5px;
            top: 5px; }
          #indexDemo > section a:hover p.btn:after {
            right: 15px; }
      #indexDemo > section#indexDemoRoom a {
        background-image: url(../images/demo.jpg); }
      #indexDemo > section#indexRental a {
        background-image: url(../images/rental.jpg); }

  #indexProductsContainer #indexProducts {
    flex: 3.5;
    margin: 0 20px 0 0; } }
  @media screen and (min-width: 961px) and (max-width: 1280px) and (max-width: 960px) {
    #indexProductsContainer #indexProducts {
      margin: 0;
      border: none; } }
@media screen and (min-width: 961px) and (max-width: 1280px) {
    #indexProductsContainer #indexProducts ul li {
      padding: 1px;
      margin: 0; }
      #indexProductsContainer #indexProducts ul li a {
        display: flex;
        display: -ms-flex;
        display: -webkit-flex;
        text-decoration: none;
        border: 1px solid #ffffff;
        color: #222222;
        padding: 5px;
        height: 100%;
        position: relative;
        transition: all 0.2s ease-in-out;
        justify-content: flex-start;
        align-content: center;
        align-items: center;
        background-color: #ffffff;
        position: relative;
        overflow: hidden;
        font-weight: bold;
        box-sizing: border-box; }
        #indexProductsContainer #indexProducts ul li a figure {
          width: 80px;
          height: auto;
          margin: 0 5px 0 0; }
          #indexProductsContainer #indexProducts ul li a figure img {
            width: 100%;
            height: 100%;
            object-fit: contain; }
        #indexProductsContainer #indexProducts ul li a ul li {
          font-size: 13px;
          line-height: 1.25;
          margin: 0; }
          #indexProductsContainer #indexProducts ul li a ul li span {
            font-size: 11px; }
  #indexProductsContainer #indexNews {
    flex: 1;
    margin: 0 0 0 0;
    display: flex;
    display: -ms-flex;
    display: -webkit-flex;
    flex-direction: column;
    justify-content: space-between; }
    #indexProductsContainer #indexNews .sectionHeader {
      margin-top: 0; }
    #indexProductsContainer #indexNews ul {
      border-top: 1px dotted #dddddd;
      margin: 0 0 0 0; }
      #indexProductsContainer #indexNews ul li {
        border-bottom: 1px dotted #dddddd; }
        #indexProductsContainer #indexNews ul li a {
          text-decoration: none;
          color: #222222;
          justify-content: flex-start;
          align-content: center;
          align-items: center;
          transition: all 0.2s ease-in-out;
          padding: 5px 0;
          position: relative;
          display: block; }
          #indexProductsContainer #indexNews ul li a p {
            font-size: 12px;
            margin: 0.25em 0; }
            #indexProductsContainer #indexNews ul li a p a {
              padding: 0 10px; }
          #indexProductsContainer #indexNews ul li a h4 {
            margin: 0.5em 0;
            line-height: 1.25;
            padding: 0 16px 0 0;
            font-size: 13px;
            line-height: 16px; }
    #indexProductsContainer #indexNews .indexContact {
      padding: 0 10px 10px 10px;
      margin: 0 0 15px 0; }
      #indexProductsContainer #indexNews .indexContact h3 {
        margin: 0 0 1em 0;
        line-height: 35px; }
      #indexProductsContainer #indexNews .indexContact p {
        line-height: 1.5;
        margin: 0; }
        #indexProductsContainer #indexNews .indexContact p a {
          color: #ffffff; } }
/* Scss Document */

/*# sourceMappingURL=index.css.map */