@charset "UTF-8";
.area-label {
  font-size: 2.0rem;
  font-weight: bold;
  color: #636363;
  position: absolute; }
  @media screen and (max-width: 1024px) {
    .area-label {
      font-size: 1rem; } }
  .area-label .title {
    display: block; }
  .area-label .caption {
    display: block;
    color: #9a3412;
    font-size: 0.8rem;
    font-weight: normal;
    vertical-align: top; }
  .area-label#area-label-assesment {
    left: 30px;
    top: 110px; }
    @media screen and (max-width: 1024px) {
      .area-label#area-label-assesment {
        left: 19px;
        top: 99px; } }
    @media screen and (max-width: 640px) {
      .area-label#area-label-assesment .caption {
        width: 120px; } }
  .area-label#area-label-management {
    left: 487px;
    top: 86px; }
    @media screen and (max-width: 1024px) {
      .area-label#area-label-management {
        right: 30px;
        top: 30px;
        left: unset; } }
  .area-label#area-label-common {
    left: 37%;
    top: 184px; }
    @media screen and (max-width: 1024px) {
      .area-label#area-label-common {
        top: 213px;
        left: 36%; } }
    @media screen and (max-width: 640px) {
      .area-label#area-label-common {
        top: 174px; } }
  .area-label#area-label-engineering {
    left: 459px;
    top: 666px; }
    @media screen and (max-width: 1024px) {
      .area-label#area-label-engineering {
        left: unset;
        right: 10px; } }
    @media screen and (max-width: 640px) {
      .area-label#area-label-engineering {
        top: 562px; } }

/* ボタンの位置 */
#btn-assessor {
  /* アセッサコース */
  left: 20px;
  top: 173px;
  background-color: #6A5D21; }
  @media screen and (max-width: 1024px) {
    #btn-assessor {
      top: 158px;
      left: 10px; } }

.group-assessor button {
  background-color: #6A5D21; }

#btn-sani {
  /* 三位一体統合マネジメントコース */
  left: 491px;
  top: 168px;
  background-color: #852E1A; }
  @media screen and (max-width: 1024px) {
    #btn-sani {
      top: 72px;
      right: 10px;
      left: unset; } }

#btn-kinou {
  /* 機能安全管理者コース */
  left: 548px;
  top: 257px;
  background-color: #852E1A; }
  @media screen and (max-width: 1024px) {
    #btn-kinou {
      top: 119px;
      right: 10px;
      left: unset; } }
  @media screen and (max-width: 640px) {
    #btn-kinou {
      top: 114px; } }

#btn-keiei {
  /* 経営・監督者コース */
  left: 581px;
  top: 356px;
  background-color: #852E1A; }
  @media screen and (max-width: 1024px) {
    #btn-keiei {
      top: 167px;
      right: 10px;
      left: unset; } }
  @media screen and (max-width: 640px) {
    #btn-keiei {
      top: 158px; } }

#btn-cmn-anzen {
  /* 安全コンセプト(SC)構築コース */
  left: 37%;
  top: 263px;
  background-color: #393F4C; }
  @media screen and (max-width: 1024px) {
    #btn-cmn-anzen {
      left: 33%;
      top: 268px; } }
  @media screen and (max-width: 640px) {
    #btn-cmn-anzen {
      top: 225px; } }

.group-anzen button {
  background-color: #393F4C; }

#btn-cmn-kikaku {
  /* 規格全編読解コース  */
  left: 37%;
  top: 304px;
  background-color: #393F4C; }
  @media screen and (max-width: 1024px) {
    #btn-cmn-kikaku {
      left: 33%;
      top: 307px; } }
  @media screen and (max-width: 640px) {
    #btn-cmn-kikaku {
      top: 261px; } }

#btn-cmn-kinou {
  /* 機能安全速習コース */
  left: 37%;
  top: 346px;
  background-color: #393F4C; }
  @media screen and (max-width: 1024px) {
    #btn-cmn-kinou {
      left: 33%;
      top: 344px; } }
  @media screen and (max-width: 640px) {
    #btn-cmn-kinou {
      top: 297px; } }

#btn-cmn-sotif {
  /* SOTIF速習コース */
  left: 37%;
  top: 388px;
  background-color: #393F4C; }
  @media screen and (max-width: 1024px) {
    #btn-cmn-sotif {
      left: 33%;
      top: 385px; } }
  @media screen and (max-width: 640px) {
    #btn-cmn-sotif {
      top: 330px; } }


 #btn-cmn-odd {
   /* ODD仕様(ISO 34503ベース)速習コース */
  left: 37%;
  top: 429px;
  background-color: #393F4C; }
  @media screen and (max-width: 1024px) {
  #btn-cmn-odd {
    left: 33%;
    top: 385px; } }
  @media screen and (max-width: 640px) {
     #btn-cmn-odd {
       top: 364px; } }




#btn-cmn-furukawa {
  /* 古川さんの新設コース */
  left: 37%;
  top: 470px;
  background-color: #004d29; }
  @media screen and (max-width: 1024px) {
    #btn-cmn-furukawa {
      left: 33%;
      top: 424px; } }
  @media screen and (max-width: 640px) {
    #btn-cmn-furukawa {
      top: 398px; } }

#btn-sw {
  /* SW専門コース */
  left: 95px;
  top: 526px;
  background-color: #2E2467; }
  @media screen and (max-width: 1024px) {
    #btn-sw {
      top: 526px;
      left: 10px; } }
  @media screen and (max-width: 640px) {
    #btn-sw {
      top: 435px;
      height: 45px; } }

.group-sw button, .group-engineer button {
  background-color: #2E2467; }

#btn-sotif {
  /* SOTIF研修コース */
  left: 476px;
  top: 526px;
  background-color: #2E2467; }
  @media screen and (max-width: 1024px) {
    #btn-sotif {
      top: 526px;
      right: 10px;
      left: unset; } }
  @media screen and (max-width: 640px) {
    #btn-sotif {
      top: 435px;
      height: 45px; } }

#btn-scenario {
  /* シナリオベース安全性評価速習コース 2024.3 追加 */
  left: 476px;
  top: 574px;
  background-color: #2E2467; }
  @media screen and (max-width: 1024px) {
    #btn-scenario {
      top: 577px;
      right: 10px;
      left: unset; } }
  @media screen and (max-width: 640px) {
    #btn-scenario {
      top: 490px;
      height: 45px; } }

#btn-engineer {
  /* エンジニアコース */
  left: 95px;
  top: 574px;
  background-color: #2E2467; }
  @media screen and (max-width: 1024px) {
    #btn-engineer {
      top: 577px;
      left: 10px; } }
  @media screen and (max-width: 640px) {
    #btn-engineer {
      top: 490px;
      height: 45px; } }

.chart-wrap-width {
  max-width: 800px;
  margin: 0 auto; }
  @media screen and (max-width: 1024px) {
    .chart-wrap-width {
      width: 100%; } }

.dg-chart-area {
  height: 800px;
  background-image: url(/assets/images/fs/fs_iso26262_base_circle.gif);
  background-position-y: 21%;
  background-size: contain;
  background-repeat: no-repeat; }
  @media screen and (max-width: 1024px) {
    .dg-chart-area {
      background-position-y: 31%; } }
  @media screen and (max-width: 640px) {
    .dg-chart-area {
      background-position-y: 47%;
      height: 650px; } }

.dg-chart {
  height: 100%;
  width: 100%;
  margin: 0; }
  .dg-chart button.widewidth {
    width: 250px; }
    @media screen and (max-width: 1024px) {
      .dg-chart button.widewidth {
        width: 180px; } }
    @media screen and (max-width: 640px) {
      .dg-chart button.widewidth {
        width: 170px; } }
  .dg-chart button.middlewidth {
    width: 190px; }
  @media screen and (max-width: 640px) {
    .dg-chart button.sp-middlewidth {
      width: 150px; } }
  .dg-chart button.btngroup, .dg-chart button.btnsingle {
    position: absolute;
    border: none;
    border-radius: 20px;
    padding: 10px;
    color: #ffffff; }
    @media screen and (max-width: 1024px) {
      .dg-chart button.btngroup, .dg-chart button.btnsingle {
        font-size: 10px; } }
  .dg-chart .block {
    margin: 0px 0px 0px 0px;
    vertical-align: middle;
    height: auto;
    padding: 10px; }
    @media screen and (max-width: 1024px) {
      .dg-chart .block {
        font-size: 10px; } }
  .dg-chart .groupblock {
    background-color: #fefefe;
    box-shadow: 0 10px 25px 0 rgba(0, 0, 0, 0.5);
    height: 250px;
    width: 600px;
    padding: 10px;
    display: none;
    position: absolute;
    z-index: 10;
    height: auto;
    min-height: 400px; }
    .dg-chart .groupblock .group-title {
      color: #535353;
      font-size: 1.5rem;
      font-weight: bold;
      text-align: center;
      padding: 10px 0 10px 0; }
    .dg-chart .groupblock .group-desc {
      padding: 10px 10px 10px 10px; }
    .dg-chart .groupblock .buttons-block {
      display: flex;
      justify-content: space-between;
      padding: 5px 0 15px 0;
      margin: 0 auto; }
      .dg-chart .groupblock .buttons-block.twobuttons {
        width: 80%; }
      .dg-chart .groupblock .buttons-block .block {
        width: 160px;
        border-radius: 30px;
        margin: 0 3px 0 3px; }
        .dg-chart .groupblock .buttons-block .block .sub-name {
          color: white;
          line-height: 1.3em; }
        .dg-chart .groupblock .buttons-block .block .sub-name2 {
          color: white;
          font-size: 10px; }
      .dg-chart .groupblock .buttons-block .triangle {
        width: 0;
        height: 0;
        border-left: 20px solid #c7c5d9fc;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        margin: 13px 0 0 0; }
    .dg-chart .groupblock .inner-summary-block .dg-chart-popup {
      position: initial;
      padding: 0 6px 0 6px;
      box-shadow: none; }

/* popup */
.dg-chart-popup {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: 0 10px 25px 0 rgba(0, 0, 0, 0.5);
  font-size: 14px;
  text-align: left; }
  .dg-chart-popup.practitioner {
    background-color: #fefefe; }
  .dg-chart-popup .title {
    font-size: 2em;
    font-weight: bold;
    color: #535353;
    margin: 0px 0px 0px 0px;
    padding: 0 0 10px 0;
    text-align: center; }
  .dg-chart-popup .summary {
    padding: 0 0 10px 0; }

/* chart title */

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