@charset "UTF-8";
/* CSS Document */
div.compare {
 max-width: 1200px;
 div.table_wrap {
  @media(max-width: 896px) {
   overflow-x: scroll;
  }
  table#compare {
   min-width: 840px;
   border: none;
   margin: 0 0 2em;
   p,th,td{
    font-size: min(.75rem, .875rem);
   }
  }
  colgroup {
   width: calc(100% / 6);
  }
  tr {
   &:nth-of-type(odd) {
    th {
     background-color: #D2EBF0;
    }
   }
   &:nth-of-type(even) {
    th {
     background-color: #F2F2F2;
    }
   }
   th, td {
    min-width: 137px;
    padding: .75em 1em;
    background: #fff;
    border: 1px solid #aaa;
    em {
     font-style: normal;
     font-weight: bold;
     color: #f33;
    }
   }
   &:first-of-type {
    th {
     background-color: #397DCE;
     color: #fff;
     &:first-of-type {
      background: none;
      border-top: none;
      border-left: none;
     }
    }
   }
   th {
    font-weight: normal;
   }
   td {
    text-align: center;
    a {
     text-decoration: none;
     color: inherit;
     img {
      width: 100%;
     }
     p {
      position: relative;
      margin-block: 1em 0;
      padding: .7em 14px .7em .5em;
      background-color: #9CE6DA;
      border-radius: calc(1px / 0);
      transition: background .3s;
      @media(max-width: 896px) {
       padding-inline: 1.5em;
       line-height: 1.4;
      }
      &::before {
       position: absolute;
       top: 50%;
       right: 7px;
       content: "";
       display: block;
       width: 6px;
       height: 6px;
       border-top: 2px solid #42E1C7;
       border-right: 2px solid #42E1C7;
       translate: -50% -50%;
       rotate: 45deg;
       z-index: 10;
      }
      &::after {
       position: absolute;
       top: 50%;
       right: -2px;
       content: "";
       display: block;
       width: 14px;
       height: 14px;
       background: #fff;
       border-radius: calc(1px / 0);
       translate: -50% -50%;
      }
     }
     @media(any-hover:hover) {
      &:hover {
       p {
        background-color: #65D9FF;
        transition: background .3s;
       }
      }
     }
    }
   }
  }
  + p:has(small) {
   padding-inline: .5em;
   font-size: .75rem;
  }
 }
}