@charset "UTF-8";

/* Background data (Original source: https://subtlepatterns.com/grid-me/) */
/* Animations */
@-webkit-keyframes bg-scrolling-reverse {
  100% {
    background-position: 100% 100%; } }
@-moz-keyframes bg-scrolling-reverse {
  100% {
    background-position: 100% 100%; } }
@-o-keyframes bg-scrolling-reverse {
  100% {
    background-position: 100% 100%; } }
@keyframes bg-scrolling-reverse {
  100% {
    background-position: 100% 100%; } }
@-webkit-keyframes bg-scrolling {
  0% {
    background-position: 100% 100%; } }
@-moz-keyframes bg-scrolling {
  0% {
    background-position: 100% 100%; } }
@-o-keyframes bg-scrolling {
  0% {
    background-position: 100% 100%; } }
@keyframes bg-scrolling {
  0% {
    background-position: 100% 100%; } }
/* Main styles */
/***********************

common

**********************/
* {
  box-sizing: border-box; }

a {
  text-decoration: none;
  color: inherit; }

li {
  list-style: none; }

i, em {
  font-style: normal; }

body, html {
  margin: 0px;
  padding: 0px;
  font-feature-settings: 'palt';
  font-weight: 500; }


/**************************************

trialend

***************************************/
.trial-end {
  display: block;
  background: #fff;
  height: 400px;
  margin: 85px auto 30px;
  width: calc(100% - 30px);
  padding: 30px;
  text-align: center; }
  .trial-end a {
    display: block;
    font-weight: bold;
    text-decoration: underline;
    width: 210px;
    margin: 30px auto; }

img.logo {
  width: 300px;
  display: block;
  margin: 30px auto;
  max-width: 100%;
  height: auto; }
  img.logo.awc {
    width: 400px;
    max-width: 100%; }

.hidden {
  display: none; }

.bg {
  animation: slide 3s ease-in-out infinite alternate;
  background-image: linear-gradient(-60deg, #6c3 50%, #00ffad 50%);
  bottom: 0;
  left: -50%;
  opacity: .5;
  position: fixed;
  right: -50%;
  top: 0;
  z-index: 1; }

.bg2 {
  animation-direction: alternate-reverse;
  animation-duration: 4s;
  opacity: .4; }

.bg3 {
  animation-duration: 5s; }

@keyframes slide {
  0% {
    transform: translateX(-25%); }
  100% {
    transform: translateX(25%); } }
.login .tit {
  position: absolute;
  top: 130px;
  left: calc(50% - 250px);
  text-align: center;
  width: 500px;
  height: 280px;
  background: #fff;
  border-radius: 6px;
  padding: 40px 50px;
  z-index: 3; }
  .login .tit h1 {
    text-align: center; }
    .login .tit h1 img {
      display: block;
      width: 80%;
      margin: 0 auto; }
  .login .tit a {
    display: block;
    width: 180px;
    max-width: 100%;
    padding: 7px;
    border-radius: 40px;
    text-align: center;
    color: #fff;
    margin: 20px auto;
    background: #a1cf55;
    transition: 0.3s ease; }
    .login .tit a:hover {
      background: #64BCFC;
      transition: 0.3s ease; }
.login button {
  background: #38c17c;
  margin-top: 10px; }

body.kc .informations_lists {
  position: relative;
  top: 0;
  width: 100%;
  left: 0;
  padding: 0;
  border: none; }
  body.kc .informations_lists ul li {
    font-size: 16px;
    margin-bottom: 20px; }
    body.kc .informations_lists ul li .date {
      font-size: 14px;
      width: 130px;
      padding: 7px; }

.informations_lists {
  width: 620px;
  padding: 20px 20px 10px;
  border: 3px solid #e1e1e1;
  background: #fff;
  position: absolute;
  top: 440px;
  left: calc(50% - 310px);
  max-width: 100%;
  z-index: 3; }
  .informations_lists ul li {
    font-size: 14px;
    margin-bottom: 10px;
    text-align: left;
    position: relative; }
    .informations_lists ul li:after {
      content: "\e5cc";
      font-family: material icons;
      position: absolute;
      right: -5px;
      top: 3px;
      font-size: 18px; }
    .informations_lists ul li .date {
      display: inline-block;
      font-size: 12px;
      padding: 3px 7px;
      margin-right: 10px;
      width: 120px;
      background: #41ce8a;
      color: #fff; }
    .informations_lists ul li:nth-child(5) {
      margin-bottom: 0; }
    .informations_lists ul li:nth-child(n+6) {
      display: none; }

ul.seminars li {
  margin-bottom: 15px;
  font-size: 14px;
  border-bottom: 1px dashed #ddd;
  padding-bottom: 13px; }
  ul.seminars li .date {
    display: inline-block;
    margin-right: 10px;
    font-weight: bold; }

.login_box {
  position: absolute;
  top: 180px;
  left: calc(50% - 250px);
  text-align: center;
  width: 500px;
  min-height: 280px;
  height: auto;
  background: #fff;
  border-radius: 6px;
  padding: 20px 50px;
  z-index: 3; }

.remember_me label {
  display: inline-block;
  width: auto; }

.panlist {
  background: #f1f1f1;
  margin-top: 76px; }
  .panlist .ib {
    padding: 10px 0;
    font-size: 12px; }

  h2.checked:before {
    font-family: material icons;
    content: "\e834";
    font-size: 122%;
    position: relative;
    margin-right: 5px;
    color: #2bc7ac;
    top: 4px;
    line-height: 1; }

  p.remark {
    padding: 10px;
    background: #f1f1f1; }
  p.remark.kc {
    padding: 30px;
    background: #fff;
    border: 1px solid #2bc7ac;
    border-radius: 4px;
    margin: 50px auto; }

.df_row {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 5px; }
  .df_row select {
    width: 49%; }

form {
  width: 100%; }


input[type="submit"] {
  display: block;
  margin: 30px auto 15px;
  padding: 15px;
  max-width: 100%;
  width: 210px;
  text-align: center;
  background: #2bc7ac;
  border-radius: 4px;
  color: #fff;
  border: none;
  cursor: pointer;
  -webkit-appearance: none; }

.btn_row {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  width: 440px;
  margin: 0 auto;
  justify-content: space-between; }
  .btn_row a {
    padding: 15px;
    border-radius: 4px;
    text-align: center;
    width: 49%;
    font-size: 14px; }
    .btn_row a.btn {
      width: 100%;
      font-size: 20px; }
      .btn_row a.btn span {
        font-size: 14px; }
  .btn_row .login {
    background: #fff;
    border: 1px solid #2bc7ac;
    color: #2bc7ac; }
  .btn_row .register {
    background: #2bc7ac;
    color: #fff; }

input[type="file"] {
  padding: 20px;
  border: 1px solid  #ddd;
  border-radius: 4px;
  width: 100%; }

textarea {
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px;
  width: 100%;
  height: 150px; }

.container {
  min-height: 700px; }
  .container .tab {
    width: 400px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .container .tab span {
      padding: 12px;
      border: 1px solid  #ddd;
      width: calc(100% / 3);
      text-align: center;
      font-size: 13px;
      cursor: pointer;
      background: #f1f1f1;
      border-radius: 0; }
      .container .tab span.active {
        background: #fff;
        border: none;
        color: #2bc7ac;
        border-radius: 0;
        border-top: 5px solid #2bc7ac;
        font-weight: bold; }
  .container.bg_on {
    background: url(../img/bg02.png) repeat 0 0; }
  .container .ib {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background: none;
    padding: 50px 0;
    margin: 30px auto;
    width: 1100px; }
    .container .ib.full {
      width: 100%;
      padding-top: 80px;
      padding-left: 0;
      padding-right: 50px;
      display: block; }
      .container .ib.full.close .side_l {
        left: -320px;
        transition: 0.3s ease; }
      .container .ib.full.close .main {
        left: 40px;
        transition: 0.3s ease;
        width: calc(100% - 100px); }
    .container .ib .side_l {
      width: 340px;
      padding: 15px 25px 15px 0;
      background: #e9fff0;
      position: fixed;
      transition: 0.3s ease;
      left: 0;
      top: 60px;
      height: 100%; }
      .container .ib .side_l ::-webkit-scrollbar {
        width: 6px; }
      .container .ib .side_l ::-webkit-scrollbar-thumb {
        background: #43e2c6;
        border-radius: 3px; }
      .container .ib .side_l ::-webkit-scrollbar-track {
        background: #fff; }
      .container .ib .side_l .side_ib {
        height: calc(100% - 50px);
        overflow-y: scroll;
        padding-right: 7px;
        background: #fff; }
      .container .ib .side_l .toggle_hz {
        position: absolute;
        right: 0px;
        background: #e1e1e1;
        top: 100px;
        width: 25px;
        height: 54px;
        position: absolute;
        display: block;
        border-right: none;
        cursor: pointer; }
        .container .ib .side_l .toggle_hz:before {
          content: "\e314";
          font-family: material icons;
          position: absolute;
          font-size: 24px;
          top: 14px; }
        .container .ib .side_l .toggle_hz.open:before {
          content: "\e315"; }
      .container .ib .side_l .df_box {
        width: 100%;
        padding: 15px 5px 15px 15px;
        margin-bottom: 10px;
        border-radius: 0;
        position: relative;
        border: none;
        border-bottom: 1px solid  #ddd; }
        .container .ib .side_l .df_box .toggle {
          width: 26px;
          height: 26px;
          position: absolute;
          display: block;
          right: 4px;
          top: 12px;
          border-radius: 3px;
          cursor: pointer;
          background: #e1e1e1;
          color: #333; }
          .container .ib .side_l .df_box .toggle.open {
            background: #2bc7ac;
            color: #fff; }
            .container .ib .side_l .df_box .toggle.open:before {
              content: "\e313"; }
          .container .ib .side_l .df_box .toggle:before {
            content: "\e316";
            font-family: material icons;
            position: absolute;
            font-size: 22px;
            top: 2px;
            left: 2px; }
        .container .ib .side_l .df_box:nth-last-child(1) {
          margin-bottom: 0; }
        .container .ib .side_l .df_box h2 {
          font-size: 16px;
          margin-top: 0;
          margin-bottom: 20px; }
        .container .ib .side_l .df_box p {
          font-size: 13px;
          margin: 15px 0; }
        .container .ib .side_l .df_box .btn_row {
          width: 100%; }
          .container .ib .side_l .df_box .btn_row button, .container .ib .side_l .df_box .btn_row input[type="submit"] {
            width: 49%;
            margin-bottom: 0;
            margin-top: 15px; }
    .container .ib .multi_file {
      position: relative; }
      .container .ib .multi_file .d_none {
        display: none; }
      .container .ib .multi_file .form-control {
        margin-bottom: 5px;
        padding: 15px; }
      .container .ib .multi_file .add {
        cursor: pointer;
        display: block;
        color: #333;
        font-size: 20px;
        font-weight: bold;
        background: #f1f1f1;
        width: 32px;
        height: 32px;
        margin-top: 10px;
        text-align: center;
        border-radius: 4px;
        padding: 5px;
        line-height: 1.3; }
    .container .ib .main {
      width: calc(100% - 400px);
      left: 360px;
      position: absolute;
      top: 70px;
      transition: 0.3s ease;
      min-width: 1100px;
      margin-bottom: 40px; }
    .container .ib .df_box {
      width: calc(50% - 15px);
      padding: 30px;
      background: #fff;
      border-radius: 6px;
      margin-bottom: 20px;
      border: 1px solid  #ccc; }
    .container .ib .results {
      width: 100%;
      padding: 20px;
      background: #fff;
      min-height: 500px;
      height: 100%;
      position: relative; }
      .container .ib .results h2 {
        margin-top: 0;
        font-size: 20px; }
      .container .ib .results img {
        height: auto;
        max-width: 100%;
        display: block;
        width: 600px; }
      .container .ib .results .img_detail {
        background: #fff;
        padding: 15px;
        border: 1px solid  #ccc;
        border-radius: 4px;
        margin-bottom: 20px; }
    .container .ib .result {
      position: absolute;
      top: 0;
      left: 0;
      padding: 20px;
      background: #fff;
      width: 100%;
      min-height: 500px;
      opacity: 0; }
      .container .ib .result.active {
        z-index: 2;
        opacity: 1; }
      .container .ib .result .record p span {
        display: inline-block;
        color: #2bc7ac; }

.alert {
  background: #ffefee;
  padding: 20px;
  border-radius: 4px;
  border: #FFB2AE 1px solid;
  margin-bottom: 20px; }
  .alert.alert-success {
    background: #fff;
    background: #e9f6ff;
    border-color: #0085b8; }
  .alert.importance_ng strong:before {
    content: 'NG';
    color: #fff;
    background: #ee5253;
    font-size: 90%;
    padding: 3px 10px;
    border-radius: 4px;
    margin-right: 5px; }
  .alert.importance_risk strong:before {
    content: 'RISK';
    color: #fff;
    background: #eeb852;
    font-size: 90%;
    padding: 3px 10px;
    border-radius: 4px;
    margin-right: 5px; }
  .alert.importance_alternative strong:before {
    content: '代替案アリ';
    color: #fff;
    background: #2bc7ac;
    font-size: 90%;
    padding: 3px 10px;
    border-radius: 4px;
    margin-right: 5px; }
  .alert.importance_evidence strong:before {
    content: '事実確認';
    color: #fff;
    background: #800080;
    font-size: 90%;
    padding: 3px 10px;
    border-radius: 4px;
    margin-right: 5px; }
  .alert p {
    margin: 0; }

/************************************

results
吹き出し位置調整

*************************************/
.result_area {
  position: relative; }
  .result_area svg {
    width: auto; }
  .result_area .balloon_group.importance_ng .num {
    background: #ee5253; }
  .result_area .balloon_group.importance_ng span.highlight {
    background: #ff999a;
    opacity: 0.7;
    border-color: #e66b83; }
  .result_area .balloon_group.importance_ng p.ng_content {
    border: 2px solid #ee5253;
    color: #ee5253; }
    .result_area .balloon_group.importance_ng p.ng_content .word {
      border-color: #ee5253; }
      .result_area .balloon_group.importance_ng p.ng_content .word:before {
        content: 'NG';
        font-family: inherit;
        color: #ee5253;
        border: 1px solid #ee5253;
        padding: 2px 7px; }
  .result_area .balloon_group.importance_risk .num {
    background: #eeb852; }
  .result_area .balloon_group.importance_risk span.highlight {
    background: #f7e97f;
    opacity: 0.7;
    border-color: #eeb852; }
  .result_area .balloon_group.importance_risk p.ng_content {
    border: 2px solid #eeb852;
    color: #eeb852; }
    .result_area .balloon_group.importance_risk p.ng_content .word {
      border-color: #eeb852; }
      .result_area .balloon_group.importance_risk p.ng_content .word:before {
        content: 'RISK';
        font-family: inherit;
        color: #eeb852;
        border: 1px solid #eeb852;
        padding: 2px 7px; }
  .result_area .balloon_group.importance_evidence .num {
    background: #800080; }
  .result_area .balloon_group.importance_evidence span.highlight {
    background: #9B95C9;
    opacity: 0.7;
    border-color: #800080; }
  .result_area .balloon_group.importance_evidence p.ng_content {
    border: 2px solid #800080;
    color: #800080; }
    .result_area .balloon_group.importance_evidence p.ng_content .word {
      border-color: #800080; }
      .result_area .balloon_group.importance_evidence p.ng_content .word:before {
        content: '事実確認';
        font-family: inherit;
        color: #800080;
        border: 1px solid #800080;
        padding: 2px 7px; }
  .result_area .balloon_group.importance_alternative .num {
    background: #2bc7ac; }
  .result_area .balloon_group.importance_alternative span.highlight {
    background: #7de0cf;
    opacity: 0.7;
    border-color: #2bc7ac; }
  .result_area .balloon_group.importance_alternative p.ng_content {
    border: 2px solid #2bc7ac;
    color: #2bc7ac; }
    .result_area .balloon_group.importance_alternative p.ng_content .word {
      border-color: #2bc7ac; }
      .result_area .balloon_group.importance_alternative p.ng_content .word:before {
        content: '代替案アリ';
        font-family: inherit;
        color: #2bc7ac;
        border: 1px solid #2bc7ac;
        padding: 2px 7px; }
  .result_area span.highlight {
    position: absolute;
    background: #7de0cf;
    opacity: 0.7;
    border-radius: 6px;
    mix-blend-mode: multiply;
    border: 3px solid #2bc7ac;
    cursor: pointer; }
  .result_area .zi999 {
    z-index: 999; }
  .result_area .num {
    font-size: 12px;
    width: 24px;
    height: 24px;
    display: inline-block;
    border-radius: 50%;
    background: #2bc7ac;
    color: #fff;
    position: absolute;
    top: -30px;
    padding-top: 3px;
    text-align: center;
    font-weight: normal;
    left: -20px;
    opacity: 1;
    z-index: 2;
    margin-top: -48px; }
  .result_area .click_fin p.ng_content {
    background: #fff5e6;
    pointer-events: none; }
  .result_area p.ng_content {
    z-index: 3;
    position: absolute;
    padding: 10px;
    background: rgba(255, 255, 255, 0.94);
    font-weight: bold;
    color: #2bc7ac;
    border-radius: 6px;
    display: none;
    width: 400px;
    border: 1px solid  #ddd; }
    .result_area p.ng_content i {
      display: block;
      margin-top: 20px;
      color: #2bc7ac;
      font-weight: normal;
      padding: 15px;
      border-radius: 4px;
      border: 1px solid  #2bc7ac; }
      .result_area p.ng_content i a {
        text-decoration: underline; }
    .result_area p.ng_content .word {
      display: block;
      font-size: 18px;
      margin-bottom: 10px;
      border-bottom: 1px solid #2bc7ac; }
      .result_area p.ng_content .word:before {
        font-family: material icons;
        content: "\e876";
        font-size: 20px;
        color: #2bc7ac;
        margin-right: 5px; }
    .result_area p.ng_content em {
      position: absolute;
      width: 30px;
      height: 30px;
      top: 10px;
      right: 10px;
      border: 1px solid  #ddd;
      border-radius: 3px;
      cursor: pointer;
      display: block; }
      .result_area p.ng_content em:before {
        font-family: material icons;
        content: "\e897";
        font-size: 20px;
        top: 5px;
        line-height: 1;
        left: 4px;
        position: absolute;
        color: #999; }
    .result_area p.ng_content.pe_none {
      opacity: 1 !important;
      display: block !important; }
      .result_area p.ng_content.pe_none em:before {
        content: "\e898"; }