/****************************************************************************************************************************/
/*
/*
/* = Overview Page Style
/*
/*
/****************************************************************************************************************************/
/*
/* = visual
/*
/* ------------------------------------------------------------------------------------------------------------------------ */
.visual.overview-visual .visual-inner--ttl span::before {
  background-image: url(../media/images/top/topnav-inner--list_lm6_hv.png); }

/*
/* = Main
/*
/* ------------------------------------------------------------------------------------------------------------------------ */
#main .greeting .greet {
  width: 600px;
  margin: 0 auto; }
  @media print, screen and (max-width: 767px) {
    #main .greeting .greet {
      width: 100%;
      max-width: 600px; } }
  #main .greeting .greet-name {
    text-align: center;
    margin: 1em auto;
    font-size: 1.25em;
    font-weight: 700; }
    #main .greeting .greet-name span {
      display: block; }
  #main .greeting .greet-txt {
    margin-bottom: 2em; }
  #main .greeting .greet-prof {
    padding: 0; }
    #main .greeting .greet-prof dt {
      padding: 1em;
      font-size: 1.125em;
      font-weight: 700;
      border-bottom: 1px solid #bdbdbd; }
    #main .greeting .greet-prof dd {
      padding: 1em; }
#main .introduction .system-fig {
  padding: 60px 100px 60px 100px;
  background-color: #d0eefe;
  text-align: center; }
  @media print, screen and (max-width: 767px) {
    #main .introduction .system-fig {
      padding: 40px 0; } }
  #main .introduction .system-fig--map {
    position: relative; }
    #main .introduction .system-fig--map_ship {
      position: absolute;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
      top: 0;
      z-index: 2; }
  #main .introduction .system-fig--tbl {
    margin-top: 60px;
    padding: 40px 100px;
    background-color: #ffffff; }
    @media print, screen and (max-width: 767px) {
      #main .introduction .system-fig--tbl {
        margin: 40px 20px 0 20px;
        padding: 20px; } }
#main .organization .chart {
  position: relative; }
  #main .organization .chart::before {
    position: absolute;
    left: 30px;
    top: 1px;
    z-index: -1;
    content: "";
    width: 1px;
    height: 100%;
    background-color: #d0d0d0; }
    @media print, screen and (max-width: 767px) {
      #main .organization .chart::before {
        left: 10px; } }
  #main .organization .chart-1st {
    margin-bottom: 1.667em;
    padding: 1em;
    border: 1px solid #d0d0d0;
    font-size: 1.5em;
    color: #018deb;
    font-weight: 700;
    background-color: #ffffff; }
  #main .organization .chart-2nd {
    position: relative;
    border: 1px solid #d0d0d0;
    margin-left: 60px; }
    @media print, screen and (max-width: 767px) {
      #main .organization .chart-2nd {
        margin-left: 20px; } }
    #main .organization .chart-2nd + .chart-2nd {
      margin-top: 40px; }
      @media print, screen and (max-width: 767px) {
        #main .organization .chart-2nd + .chart-2nd {
          margin-top: 20px; } }
    #main .organization .chart-2nd::before {
      position: absolute;
      left: -30px;
      top: 30px;
      content: "";
      width: 30px;
      height: 1px;
      background-color: #d0d0d0; }
      @media print, screen and (max-width: 767px) {
        #main .organization .chart-2nd::before {
          left: -10px;
          width: 10px; } }
    #main .organization .chart-2nd--ttl {
      padding: 1em;
      border-bottom: 1px solid #d0d0d0;
      font-size: 1.45em;
      color: #018deb;
      font-weight: 700;
      background-color: #ffffff; }
    #main .organization .chart-2nd--cnt {
      padding: 2em; }
      @media print, screen and (min-width: 768px) {
        #main .organization .chart-2nd--cnt {
          display: flex;
          flex-wrap: wrap;
          flex-direction: row;
          justify-content: flex-start; }
          #main .organization .chart-2nd--cnt > p {
            width: 100%; }
          #main .organization .chart-2nd--cnt > ul {
            min-width: 150px;
            margin-right: 20px; }
          #main .organization .chart-2nd--cnt_fig {
            display: flex;
            flex-wrap: wrap;
            flex-direction: row;
            justify-content: flex-start; }
            #main .organization .chart-2nd--cnt_fig li {
              width: 140px; }
              #main .organization .chart-2nd--cnt_fig li + li {
                margin-left: 5px; } }
      @media print, screen and (max-width: 767px) {
        #main .organization .chart-2nd--cnt {
          padding: 1em; } }
    #main .organization .chart-2nd--link {
      padding: 2em;
      background-color: rgba(189, 189, 189, 0.1); }
      @media print, screen and (max-width: 767px) {
        #main .organization .chart-2nd--link {
          padding: 1em; } }
      #main .organization .chart-2nd--link dl {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: stretch; }
        @media print, screen and (max-width: 767px) {
          #main .organization .chart-2nd--link dl {
            flex-direction: column; } }
        #main .organization .chart-2nd--link dl dt {
          width: 100px;
          font-weight: 700; }
          @media print, screen and (max-width: 767px) {
            #main .organization .chart-2nd--link dl dt {
              width: 100%; } }
        #main .organization .chart-2nd--link dl dd {
          width: calc(100% - (100px + 20px)); }
          @media print, screen and (max-width: 767px) {
            #main .organization .chart-2nd--link dl dd {
              width: 100%; } }
          #main .organization .chart-2nd--link dl dd ul {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: flex-start;
            align-items: stretch; }
            @media print, screen and (max-width: 767px) {
              #main .organization .chart-2nd--link dl dd ul {
                flex-direction: column; } }
            #main .organization .chart-2nd--link dl dd ul + ul {
              margin-top: 0.5em; }
            @media print, screen and (max-width: 767px) {
              #main .organization .chart-2nd--link dl dd ul {
                margin: 0.5em 0 0 0.5em; } }
            @media print, screen and (min-width: 768px) {
              #main .organization .chart-2nd--link dl dd ul li + li {
                margin-left: 2em; } }
            #main .organization .chart-2nd--link dl dd ul li a {
              position: relative; }
              #main .organization .chart-2nd--link dl dd ul li a::before {
                position: absolute;
                left: 0;
                bottom: 0px;
                display: block;
                content: '';
                width: 100%;
                height: 1px;
                background-color: #018deb;
                transform: scale(0, 1);
                transform-origin: left top;
                transition: transform .3s; }
              #main .organization .chart-2nd--link dl dd ul li a:hover::before {
                transform: scale(1, 1); }
    #main .organization .chart-2nd:last-of-type::after {
      position: absolute;
      left: -31px;
      bottom: -1px;
      z-index: -1;
      content: "";
      width: 1px;
      height: calc(100% - 30px);
      background-color: #ffffff; }
      @media print, screen and (max-width: 767px) {
        #main .organization .chart-2nd:last-of-type::after {
          left: -11px; } }
#main .photo-tbl .model {
  white-space: nowrap;
  width: 4em; }
#main .photo-tbl .ship {
  white-space: nowrap;
  width: 2em; }
#main .photo-album {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch; }
  @media print, screen and (max-width: 767px) {
    #main .photo-album {
      flex-direction: column; } }
  @media print, screen and (min-width: 768px) {
    #main .photo-album::after {
      display: block;
      content: "";
      width: calc((100% - (30px * 2)) / 3); } }
  #main .photo-album dl {
    width: calc((100% - (30px * 2)) / 3);
    margin-bottom: 30px; }
    @media print, screen and (max-width: 767px) {
      #main .photo-album dl {
        width: 100%;
        text-align: center; }
        #main .photo-album dl img {
          max-width: 400px; } }
    #main .photo-album dl dt {
      margin-bottom: 10px; }
      #main .photo-album dl dt img {
        object-fit: cover;
        height: 240px; }
.tag {
  display: inline-block;
  padding: 0 0.5em;
  margin-left: 0.5em;
  font-size: 0.75em;
  color: #ffffff; }
  .tag.tag--bst {
    background-color: #f39800; }
  .tag.tag--koi {
    background-color: #e35d84; }
  .tag.tag--clb {
    background-color: #008000; }
#main .story .lineup-cnt {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: stretch; }
  @media print, screen and (max-width: 767px) {
    #main .story .lineup-cnt {
      flex-direction: column; } }
  #main .story .lineup-cnt--fig {
    width: 500px; }
    @media print, screen and (max-width: 767px) {
      #main .story .lineup-cnt--fig {
        width: 100%; } }
  #main .story .lineup-cnt--list {
    width: calc(100% - (40px + 500px)); }
    @media print, screen and (max-width: 767px) {
      #main .story .lineup-cnt--list {
        width: 100%;
        margin-top: 30px; } }
    #main .story .lineup-cnt--list > li {
      padding: 0.5em 1em;
      border-bottom: 1px solid #bdbdbd; }
      @media print, screen and (max-width: 767px) {
        #main .story .lineup-cnt--list > li {
          width: 100%; } }
.lineup-lity {
  background-color: #ffffff;
  width: 96vw;
  max-width: 1200px;
  height: 90vh;
  padding: 30px;
  overflow-y: scroll;
  line-height: 1.6; }
  @media print, screen and (max-width: 767px) {
    .lineup-lity {
      padding: 5.3vw;
      font-size: 0.875em; } }
.lineup-dtl--ex {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: stretch; }
.lineup-dtl--desc {
  margin-top: 3em;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: stretch; }
  @media print, screen and (max-width: 767px) {
    .lineup-dtl--desc {
      flex-direction: column; } }
  .lineup-dtl--desc_fig {
    width: 340px; }
    @media print, screen and (max-width: 767px) {
      .lineup-dtl--desc_fig {
        width: 100%; } }
  .lineup-dtl--desc_txt {
    width: calc(100% - (340px + 40px)); }
    @media print, screen and (max-width: 767px) {
      .lineup-dtl--desc_txt {
        width: 100%;
        margin-top: 30px; } }
.lineup-dtl--tbl {
  margin-top: 3em; }
  .lineup-dtl--tbl_access {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch; }
    @media print, screen and (max-width: 767px) {
      .lineup-dtl--tbl_access {
        flex-direction: column; } }
    .lineup-dtl--tbl_access__desc {
      width: calc(100% - (240px + 40px)); }
      @media print, screen and (max-width: 767px) {
        .lineup-dtl--tbl_access__desc {
          width: 100%; } }
    .lineup-dtl--tbl_access__fig {
      width: 240px;
      border: 2px solid rgba(189, 189, 189, 0.1); }
      @media print, screen and (max-width: 767px) {
        .lineup-dtl--tbl_access__fig {
          width: 100%;
          margin-top: 20px;
          text-align: center; }
          .lineup-dtl--tbl_access__fig img {
            max-width: 400px; } }
#main .story .restoration .tbl td {
  text-align: center; }
#main .story .safeinfo .tbl td {
  word-break: break-all; }

/*
/* = aside
/*
/* ------------------------------------------------------------------------------------------------------------------------ */

/*# sourceMappingURL=page-overview.css.map */