@charset 'UTF-8';

.kn-btn._inactive:hover {
  transition: none;
  box-shadow: none;
  cursor: default;
}

.kn-anchor-btn.-red {
  color: #ff6666;
  border-color: #ff6666;
}

.kn-anchor-btn.-red:hover {
  box-shadow: 0 0 8px 0 rgba(244,71,71,.75);
}

.kn-box.-decoration.-red {
  border-color: #f44747;
}

.kn-box.-decoration.-red {
  box-shadow: inset 0 0 0 4px #fff3f3;
}

.kn-box.-decoration.-red:after {
  background: linear-gradient(-45deg,#fff 50%,#f44747 50%);
}


.kn-ttl.-h2.-red {
  color: #f44747; 
  border-color: #f44747;
}

.kn-btn.-red{
    background-color: #f44747;
}

.kn-btn.-red {
  padding: 20px 0;
  color: #fff;
  border: none;
}

.kn-btn.-red.-forward:before {
  border-color: #fff;
}


.kn-txt.-red {
  color: #ff6666;
}

@media screen and (max-width:767px) {
  .kn-btn.-red {
    padding: 13px 0;
  }
}

.kn-anchor-btn.-yellow {
  color: #ffcc00;
  border-color: #ffcc00;
}

.kn-anchor-btn.-yellow:hover {
  box-shadow: 0 0 8px 0 rgba(255,224,102,.75);
}

.kn-box.-decoration.-yellow {
  border-color: #ffe066;
}

.kn-box.-decoration.-yellow {
  box-shadow: inset 0 0 0 4px #fff8e0;
}

.kn-box.-decoration.-yellow:after {
  background: linear-gradient(-45deg,#fff 50%,#ffe066 50%);
}

.kn-ttl.-h2.-yellow {
  color: #ffe066;
  border-color: #ffe066;
}

.kn-btn.-yellow{
    background-color: #ffe066;
}

.kn-btn.-yellow {
  padding: 20px 0;
  color: #fff;
  border: none;
}

.kn-btn.-yellow.-forward:before {
  border-color: #fff;
}

.kn-txt.-yellow {
  color: #ffcc00;
}

@media screen and (max-width:767px) {
  .kn-btn.-yellow {
    padding: 13px 0;
  }
}


.kn-anchor-btn.-yellowgreen {
  color: #27ba62;
  border-color: #27ba62;
}

.kn-anchor-btn.-yellowgreen:hover {
  box-shadow: 0 0 8px 0 rgba(125,213,160,.75);
}

.kn-box.-decoration.-yellowgreen {
  border-color: #7dd5a0;
}

.kn-box.-decoration.-yellowgreen {
  box-shadow: inset 0 0 0 4px #e5f6ec;
}

.kn-box.-decoration.-yellowgreen:after {
  background: linear-gradient(-45deg,#fff 50%,#7dd5a0 50%);
}

.kn-ttl.-h2.-yellowgreen {
  color: #7dd5a0;
  border-color: #7dd5a0;
}

.kn-btn.-yellowgreen{
    background-color: #7dd5a0;
}

.kn-btn.-yellowgreen {
  padding: 20px 0;
  color: #fff;
  border: none;
}

.kn-btn.-yellowgreen.-forward:before {
  border-color: #fff;
}

.kn-txt.-yellowgreen {
  color: #7dd5a0;
}

@media screen and (max-width:767px) {
  .kn-btn.-yellowgreen {
    padding: 13px 0;
  }
}


.kn-tbl.-yellow>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #ffe066;
}

.kn-tbl.-yellow>thead>tr>th, .kn-tbl.-yellow>tbody>tr>th, .kn-tbl.-yellow>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #ffeca3;
}

.kn-tbl.-yellow>tbody>tr>th {
    font-weight: 400;
    background-color: #fff8e0;
}

.kn-tbl.-red>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #f44747;
}

.kn-tbl.-red>thead>tr>th, .kn-tbl.-red>tbody>tr>th, .kn-tbl.-red>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #f89090;
}

.kn-tbl.-red>tbody>tr>th {
    font-weight: 400;
    background-color: #fcdada;
}

.kn-tbl.-yellowgreen>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #7dd5a0;
}

.kn-tbl.-yellowgreen>thead>tr>th, .kn-tbl.-yellowgreen>tbody>tr>th, .kn-tbl.-yellowgreen>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #b1e5c6;
}

.kn-tbl.-yellowgreen>tbody>tr>th {
    font-weight: 400;
    background-color: #e5f6ec;
}

.kn-tbl.-pink>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #e86875;
}

.kn-tbl.-pink>thead>tr>th, .kn-tbl.-pink>tbody>tr>th, .kn-tbl.-pink>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #f1a4ac;
}

.kn-tbl.-pink>tbody>tr>th {
    font-weight: 400;
    background-color: #fae0e3;
}

.kn-tbl.-bluegreen>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #23a1ba;
}

.kn-tbl.-bluegreen>thead>tr>th, .kn-tbl.-bluegreen>tbody>tr>th, .kn-tbl.-bluegreen>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #7bc6d5;
}

.kn-tbl.-bluegreen>tbody>tr>th {
    font-weight: 400;
    background-color: #d3ecf1;
}

.kn-tbl.-green>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #61a624;
}

.kn-tbl.-green>thead>tr>th, .kn-tbl.-green>tbody>tr>th, .kn-tbl.-green>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #a0c97b;
}

.kn-tbl.-green>tbody>tr>th {
    font-weight: 400;
    background-color: #dfedd3;
}

.kn-tbl.-orange>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #ff6e0c;
}

.kn-tbl.-orange>thead>tr>th, .kn-tbl.-orange>tbody>tr>th, .kn-tbl.-orange>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #ffa86d;
}

.kn-tbl.-orange>tbody>tr>th {
    font-weight: 400;
    background-color: #ffe2ce;
}

.kn-tbl.-orange>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #ff6e0c;
}

.kn-tbl.-orange>thead>tr>th, .kn-tbl.-orange>tbody>tr>th, .kn-tbl.-orange>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #ffa86d;
}

.kn-tbl.-orange>tbody>tr>th {
    font-weight: 400;
    background-color: #ffe2ce;
}

.kn-tbl.-orange>thead>tr>th {
    text-align: center;
    color: #fff;
    background-color: #ff6e0c;
}

.kn-tbl.-orange>thead>tr>th, .kn-tbl.-orange>tbody>tr>th, .kn-tbl.-orange>tbody>tr>td {
    line-height: 1.7;
    padding: 8px 10px;
    text-align: left;
    vertical-align: middle;
    border: 1px solid #ffa86d;
}

.kn-tbl.-orange>tbody>tr>th {
    font-weight: 400;
    background-color: #ffe2ce;
}