@charset "UTF-8";
/* mainVisual
-------------------------------------------------- */
.mainVisual {
  height: 66.458333333333333vw;
  color: #FFF;
  font-size: 32px;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Sawarabi Mincho", serif;
  position: relative; }
  .mainVisual .inner {
    display: block;
    position: absolute;
    top: 90px;
    left: 50%;
    -ms-transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    height: auto;
    width: 100%; }
  @media screen and (max-width: 767px) {
    .mainVisual {
      font-size: 21px; } }
  @media screen and (max-width: 767px) {
    .mainVisual .inner {
      top: 45px; } }
  .mainVisual span {
    font-size: 45px; }
    @media screen and (max-width: 767px) {
      .mainVisual span {
        font-size: 30px; } }
  @media screen and (max-width: 991px) {
    .mainVisual {
      height: calc(100vh - 146px); } }

/* newsSec
-------------------------------------------------- */
.newsSec dl {
  border-bottom: 1px solid #CCCCCC;
  margin-bottom: 20px;
  padding-bottom: 20px;
  margin-right: 0;
  margin-left: 0; }
  @media screen and (max-width: 767px) {
    .newsSec dl {
      margin-right: -15px;
      margin-left: -15px; } }
  .newsSec dl dt {
    color: #076462;
    text-align: left; }
  .newsSec dl dd {
    text-align: left; }
    .newsSec dl dd a {
      color: #231815; }
.newsSec p {
  text-align: right; }

.newmark {
  padding: 2px 5px;
  background: #FF0000;
  color: #FFF;
  font-size: 15px;
  margin-right: 10px; }

/* calendarSec
-------------------------------------------------- */
.calendarSec {
  background: url(../img/slide2.jpg) no-repeat 50% 50%;
  background-size: cover;
  padding: 0; }
  .calendarSec .inner {
    padding-top: 50px;
    padding-bottom: 50px;
    background: rgba(7, 100, 98, 0.5); }
    @media screen and (max-width: 767px) {
      .calendarSec .inner {
        padding-top: 25px;
        padding-bottom: 25px; } }
    @media screen and (max-width: 767px) {
      .calendarSec .inner iframe {
        /* width: calc(100% - 30px); */ } }

/* scrollerSec
-------------------------------------------------- */
.scrollerSec {
  padding-top: 20px;
  padding-bottom: 0; }
  @media screen and (max-width: 767px) {
    .scrollerSec {
      padding-top: 10px; } }

/* menuSec
-------------------------------------------------- */
.menuSec .container {
  width: 950px; }
  @media screen and (max-width: 1199px) {
    .menuSec .container {
      width: 100%; } }
  .menuSec .container .menuBox {
    display: block;
    border: 1px solid #9FA0A0;
    box-shadow: 0 1px #727171;
    height: 220px;
    color: #231815;
    font-size: 18px;
    position: relative;
    position: relative;
    position: relative; }
    .menuSec .container .menuBox .inner {
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      -ms-transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      height: auto;
      width: 100%; }
    .menuSec .container .menuBox::after {
      content: ' ';
      display: block;
      position: absolute;
      top: 184px;
      left: 50%;
      -ms-transform: translate(-50%, 0);
      -webkit-transform: translate(-50%, 0);
      transform: translate(-50%, 0);
      height: 20px;
      width: 20px; }
    .menuSec .container .menuBox::before {
      content: ' ';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      -ms-transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
      height: 44px;
      width: 44px; }
    .menuSec .container .menuBox::after {
      border: 1px solid #727171;
      background: url(../img/next_gray.svg) no-repeat 50% 50%;
      background-size: 100% 100%; }
    .menuSec .container .menuBox h3 {
      font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Sawarabi Mincho", serif; }
    .menuSec .container .menuBox p {
      text-align: center; }
      .menuSec .container .menuBox p img {
        width: 100px;
        height: 100px; }
  .menuSec .container #menuSec1::before {
    background: url(../img/num1.svg) no-repeat 50% 50%;
    background-size: 100% 100%; }
    @media screen and (max-width: 767px) {
      .menuSec .container #menuSec1::before {
        width: 30px;
        height: 30px; } }
  .menuSec .container #menuSec2::before {
    background: url(../img/num2.svg) no-repeat 50% 50%;
    background-size: 100% 100%; }
    @media screen and (max-width: 767px) {
      .menuSec .container #menuSec2::before {
        width: 30px;
        height: 30px; } }
  .menuSec .container #menuSec3::before {
    background: url(../img/num3.svg) no-repeat 50% 50%;
    background-size: 100% 100%; }
    @media screen and (max-width: 767px) {
      .menuSec .container #menuSec3::before {
        width: 30px;
        height: 30px; } }
  .menuSec .container #menuSec4::before {
    background: url(../img/num4.svg) no-repeat 50% 50%;
    background-size: 100% 100%; }
    @media screen and (max-width: 767px) {
      .menuSec .container #menuSec4::before {
        width: 30px;
        height: 30px; } }
  .menuSec .container #menuSec5::before {
    background: url(../img/num5.svg) no-repeat 50% 50%;
    background-size: 100% 100%; }
    @media screen and (max-width: 767px) {
      .menuSec .container #menuSec5::before {
        width: 30px;
        height: 30px; } }
  .menuSec .container #menuSec6::before {
    background: url(../img/num6.svg) no-repeat 50% 50%;
    background-size: 100% 100%; }
    @media screen and (max-width: 767px) {
      .menuSec .container #menuSec6::before {
        width: 30px;
        height: 30px; } }
  .menuSec .container #menuSec7::before {
    background: url(../img/num7.svg) no-repeat 50% 50%;
    background-size: 100% 100%; }
    @media screen and (max-width: 767px) {
      .menuSec .container #menuSec7::before {
        width: 30px;
        height: 30px; } }
  .menuSec .container #menuSec8::before {
    background: url(../img/num8.svg) no-repeat 50% 50%;
    background-size: 100% 100%; }
    @media screen and (max-width: 767px) {
      .menuSec .container #menuSec8::before {
        width: 30px;
        height: 30px; } }

/* implantSec
-------------------------------------------------- */
.implantSec {
  padding-top: 0;
  padding-bottom: 0; }
  @media screen and (max-width: 767px) {
    .implantSec {
      border-bottom: 1px solid rgba(7, 100, 98, 0.2); } }
  .implantSec .container {
    padding-top: 50px;
    padding-bottom: 50px;
    background: url(../img/implantSec_bg.jpg) no-repeat 50% 50%;
    background-size: cover;
    position: relative;
    position: relative; }
    .implantSec .container::before {
      content: ' ';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      -ms-transform: translate(-100%, 0);
      -webkit-transform: translate(-100%, 0);
      transform: translate(-100%, 0);
      height: 100%;
      width: 100%; }
    .implantSec .container::after {
      content: ' ';
      display: block;
      position: absolute;
      top: 0;
      left: 100%;
      -ms-transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
      height: 100%;
      width: 100%; }
    @media screen and (max-width: 767px) {
      .implantSec .container {
        padding-top: 300px;
        padding-bottom: 25px;
        background: url(../img/implantSec_bg.jpg) no-repeat 50% 0;
        background-size: contain; } }
    @media screen and (max-width: 575px) {
      .implantSec .container {
        padding-top: 200px; } }
    .implantSec .container::before {
      background: url(../img/implantSec_bg2.jpg) no-repeat 50% 50%;
      background-size: cover; }
    .implantSec .container::after {
      background: url(../img/implantSec_bg2.jpg) no-repeat 50% 50%;
      background-size: cover; }
    .implantSec .container .inner {
      width: 950px;
      margin: 0 auto; }
      @media screen and (max-width: 1199px) {
        .implantSec .container .inner {
          width: 100%; } }
      @media screen and (max-width: 767px) {
        .implantSec .container .inner {
          width: 90%; } }
      @media screen and (max-width: 575px) {
        .implantSec .container .inner {
          width: 100%; } }
      .implantSec .container .inner p {
        position: relative; }
        .implantSec .container .inner p::after {
          content: ' ';
          display: block;
          position: absolute;
          top: 100%;
          left: 50%;
          -ms-transform: translate(-50%, 25px);
          -webkit-transform: translate(-50%, 25px);
          transform: translate(-50%, 25px);
          height: 1px;
          width: calc(100% + 50px); }
        .implantSec .container .inner p::after {
          background: rgba(7, 100, 98, 0.2); }
      .implantSec .container .inner dl {
        font-weight: bold;
        text-align: left;
        line-height: 28px;
        margin-bottom: 15px; }
        .implantSec .container .inner dl dt span {
          background: #076462;
          padding: 7px;
          color: #FFF;
          font-size: 14px; }
      .implantSec .container .inner .btn-basic {
        font-size: 14px; }
      @media screen and (max-width: 575px) {
        .implantSec .container .inner .simpleBox {
          padding: 15px 10px; } }

/* featureSec
-------------------------------------------------- */
.featureSec .noBox {
  padding-top: 45px;
  position: relative; }
  .featureSec .noBox::before {
    content: ' ';
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    -ms-transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    height: 44px;
    width: 44px; }
  .featureSec .noBox .titleBlock {
    height: 50px;
    margin-bottom: 15px;
    position: relative; }
    .featureSec .noBox .titleBlock .inner {
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      -ms-transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      height: auto;
      width: 100%; }
    .featureSec .noBox .titleBlock h3 {
      margin-bottom: 0; }
.featureSec #featureSec1::before {
  background: url(../img/green1.svg) no-repeat 50% 50%;
  background-size: 100% 100%; }
.featureSec #featureSec2::before {
  background: url(../img/green2.svg) no-repeat 50% 50%;
  background-size: 100% 100%; }
.featureSec #featureSec3::before {
  background: url(../img/green3.svg) no-repeat 50% 50%;
  background-size: 100% 100%; }
.featureSec #featureSec4::before {
  background: url(../img/green4.svg) no-repeat 50% 50%;
  background-size: 100% 100%; }
.featureSec #featureSec5::before {
  background: url(../img/green5.svg) no-repeat 50% 50%;
  background-size: 100% 100%; }
.featureSec #featureSec6::before {
  background: url(../img/green6.svg) no-repeat 50% 50%;
  background-size: 100% 100%; }

/* greetingSec
-------------------------------------------------- */
.greetingSec {
  padding-bottom: 0;
  background: url(../img/greetingSec_bg.jpg) no-repeat 100% 60px;
  background-size: cover; }
  @media screen and (max-width: 991px) {
    .greetingSec {
      background: url(../img/greetingSec_bg2.jpg) no-repeat 100% 60px;
      background-size: cover; } }
  @media screen and (max-width: 767px) {
    .greetingSec {
      background: url(../img/greetingSec_bg.jpg) no-repeat 100% 60px;
      background-size: cover; } }
  @media screen and (max-width: 575px) {
    .greetingSec {
      background: url(../img/greetingSec_bg.jpg) no-repeat 60% 60px;
      background-size: cover; } }
  .greetingSec .container {
    background: url(../img/incho.png) no-repeat calc(100% - 60px) 100%;
    background-size: auto 80%; }
    @media screen and (max-width: 991px) {
      .greetingSec .container {
        background: url(../img/incho.png) no-repeat 100% 100%;
        background-size: auto 80%; } }
    @media screen and (max-width: 767px) {
      .greetingSec .container {
        background: url(../img/incho.png) no-repeat 100% 100%;
        background-size: auto 50%; } }
    @media screen and (max-width: 575px) {
      .greetingSec .container {
        background: url(../img/incho.png) no-repeat 100% 100%;
        background-size: auto 300px;
        padding-right: 15px;
        padding-bottom: 50px; } }
    @media screen and (max-width: 575px) {
      .greetingSec .container .mb50 {
        margin-bottom: 0 !important; } }
    .greetingSec .container h3 {
      text-align: left; }
      .greetingSec .container h3 span {
        position: relative; }
        .greetingSec .container h3 span::after {
          content: ' ';
          display: block;
          position: absolute;
          top: 50%;
          left: 100%;
          -ms-transform: translate(0, -50%);
          -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
          height: 1px;
          width: 80px; }
        .greetingSec .container h3 span::after {
          background: #076462; }
    .greetingSec .container .greetingBlock {
      background: rgba(255, 255, 255, 0.9);
      padding-top: 40px;
      padding-bottom: 40px;
      position: relative;
      position: relative; }
      .greetingSec .container .greetingBlock::before {
        content: ' ';
        display: block;
        position: absolute;
        top: 0;
        left: -100%;
        -ms-transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        height: 100%;
        width: 100%; }
      .greetingSec .container .greetingBlock::after {
        content: ' ';
        display: block;
        position: absolute;
        top: 0;
        left: 100%;
        -ms-transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        height: 100%;
        width: 100px; }
      @media screen and (max-width: 767px) {
        .greetingSec .container .greetingBlock {
          padding-top: 20px;
          padding-bottom: 20px; } }
      @media screen and (max-width: 575px) {
        .greetingSec .container .greetingBlock {
          margin-bottom: 20px; } }
      .greetingSec .container .greetingBlock::before {
        background: rgba(255, 255, 255, 0.9); }
      .greetingSec .container .greetingBlock::after {
        background: -webkit-gradient(linear, left, right, from(rgba(255, 255, 255, 0.9)), to(rgba(255, 255, 255, 0)));
        background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0));
        background: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)); }
      .greetingSec .container .greetingBlock .btn-simple:hover {
        background: rgba(7, 100, 98, 0.2); }

/* accessSec
-------------------------------------------------- */
.accessSec {
  background: url(../img/accessSec_bg.jpg) no-repeat 50% 0;
  background-size: cover;
  padding-top: 80px;
  padding-bottom: 80px; }
  @media screen and (max-width: 767px) {
    .accessSec {
      padding-top: 40px;
      padding-bottom: 40px; } }
  .accessSec .simpleBox {
    padding: 25px; }
    @media screen and (max-width: 767px) {
      .accessSec .simpleBox {
        padding: 10px; } }
    .accessSec .simpleBox dl {
      margin-left: 0;
      margin-right: 0; }
      .accessSec .simpleBox dl dt {
        color: #076462;
        border-bottom: 1px solid #076462;
        text-align: left;
        padding-bottom: 20px;
        margin-bottom: 20px; }
      .accessSec .simpleBox dl.parkingInfo dt {
        border-top: 1px solid #076462;
        padding-top: 20px;
        margin-top: 20px; }
      .accessSec .simpleBox dl dd {
        border-bottom: 1px solid #E6E6E5;
        text-align: left;
        padding-bottom: 20px;
        margin-bottom: 20px; }
        @media screen and (max-width: 767px) {
          .accessSec .simpleBox dl dd.col-sm-9 {
            border-bottom: none;
            padding-bottom: 0; } }
      .accessSec .simpleBox dl.parkingInfo dd {
        border-top: 1px solid #E6E6E5;
        padding-top: 20px;
        margin-top: 20px; }

table.timeTable {
  margin-bottom: 5px;
  width: 100%; }
  @media screen and (max-width: 575px) {
    table.timeTable {
      font-size: 14px; } }
  @media screen and (max-width: 350px) {
    table.timeTable th {
      padding: 5px; } }
  @media screen and (max-width: 350px) {
    table.timeTable td {
      padding: 5px; } }
  table.timeTable tbody th {
    color: #231815;
    padding: 10px; }
    @media screen and (max-width: 350px) {
      table.timeTable tbody th {
        padding: 5px; } }
  table.timeTable tbody td {
    padding: 10px; }
    @media screen and (max-width: 350px) {
      table.timeTable tbody td {
        padding: 5px; } }

/* bnrSec
-------------------------------------------------- */
.bnrSec {
  padding-top: 25px;
  padding-bottom: 25px;
  line-height: 1; }
  .bnrSec .container {
    width: 950px; }
    @media screen and (max-width: 1199px) {
      .bnrSec .container {
        width: 100%; } }
    .bnrSec .container .noBox {
      padding-top: 95px;
      text-align: right;
      position: relative; }
      .bnrSec .container .noBox::after {
        content: ' ';
        display: block;
        position: absolute;
        top: 100%;
        left: 100%;
        -ms-transform: translate(-100%, -100%);
        -webkit-transform: translate(-100%, -100%);
        transform: translate(-100%, -100%);
        height: 15px;
        width: 15px; }
      .bnrSec .container .noBox::after {
        background: #076462 url(../img/next_white.svg) no-repeat 50% 50%;
        background-size: 8px 8px; }
      .bnrSec .container .noBox#bnrSec1 {
        position: relative; }
        .bnrSec .container .noBox#bnrSec1::before {
          content: ' ';
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          -ms-transform: translate(0, 0);
          -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
          height: 85px;
          width: 100%; }
        .bnrSec .container .noBox#bnrSec1::before {
          background: url(../img/bnrSec1.jpg) no-repeat 50% 50%;
          background-size: cover; }
      .bnrSec .container .noBox#bnrSec2 {
        position: relative; }
        .bnrSec .container .noBox#bnrSec2::before {
          content: ' ';
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          -ms-transform: translate(0, 0);
          -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
          height: 85px;
          width: 100%; }
        .bnrSec .container .noBox#bnrSec2::before {
          background: url(../img/bnrSec2.jpg) no-repeat 50% 50%;
          background-size: cover; }
      .bnrSec .container .noBox#bnrSec3 {
        position: relative; }
        .bnrSec .container .noBox#bnrSec3::before {
          content: ' ';
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          -ms-transform: translate(0, 0);
          -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
          height: 85px;
          width: 100%; }
        .bnrSec .container .noBox#bnrSec3::before {
          background: url(../img/bnrSec3.jpg) no-repeat 50% 50%;
          background-size: cover; }
      .bnrSec .container .noBox span {
        padding-right: 25px; }

/* basicSec
-------------------------------------------------- */
.basicSec {
  border-bottom: 1px solid rgba(7, 100, 98, 0.2); }
  .basicSec dl {
    margin-left: 0;
    margin-right: 0; }
    .basicSec dl dt {
      color: #076462;
      border-bottom: 1px solid #076462;
      text-align: left;
      padding-bottom: 20px;
      margin-bottom: 20px; }
      @media screen and (max-width: 767px) {
        .basicSec dl dt {
          border-bottom: none;
          padding-bottom: 0;
          margin-bottom: 0; } }
    .basicSec dl dd {
      border-bottom: 1px solid #E6E6E5;
      text-align: left;
      padding-bottom: 20px;
      margin-bottom: 20px; }
  @media screen and (max-width: 767px) {
    .basicSec .basicTable {
      font-size: 14px;
      margin-left: -10px;
      margin-right: -10px;
      width: calc(100% + 20px); } }
  .basicSec .basicTable th {
    min-width: 40px; }
    @media screen and (max-width: 767px) {
      .basicSec .basicTable th {
        padding: 5px; } }
  @media screen and (max-width: 767px) {
    .basicSec .basicTable td {
      padding: 5px; } }
  @media screen and (max-width: 767px) {
    .basicSec .basicTable td img {
      width: 100%; } }
  .basicSec .implantTable {
    table-layout: fixed;
    border-right: 1px solid rgba(7, 100, 98, 0.2);
    border-bottom: 1px solid rgba(7, 100, 98, 0.2); }
    .basicSec .implantTable thead th {
      border-left: 1px solid #FFF;
      border-top: 1px solid rgba(7, 100, 98, 0.2); }
      .basicSec .implantTable thead th:first-child {
        width: 150px;
        border-left: 1px solid rgba(7, 100, 98, 0.2); }
        @media screen and (max-width: 767px) {
          .basicSec .implantTable thead th:first-child {
            width: 100px; } }
    .basicSec .implantTable tbody th {
      border-top: 1px solid rgba(7, 100, 98, 0.2);
      border-left: 1px solid rgba(7, 100, 98, 0.2); }
    .basicSec .implantTable tbody td {
      border-top: 1px solid rgba(7, 100, 98, 0.2);
      border-left: 1px solid rgba(7, 100, 98, 0.2); }

@media screen and (max-width: 767px) {
  body.single .basicSec img {
    width: 100%;
    height: auto; } }

/* articleSec
-------------------------------------------------- */
.articleSec h3 {
  text-align: left; }
.articleSec .row {
  padding-bottom: 30px;
  margin-bottom: 30px;
  border-bottom: 1px solid rgba(7, 100, 98, 0.2); }
  .articleSec .row:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: none; }