/*============================================
responsive
============================================*/
@media screen and (max-width: 897px) {
  body {
    padding-top: 0; } }

.inner-sy {
  max-width: 960px;
  margin: 0 auto; }
  @media screen and (max-width: 897px) {
    .inner-sy {
      margin: 0 20px; } }

p {
  text-align: justify; }

/*============================================
common
============================================*/
.unit-base {
  max-width: 100% !important; }

.copy-0002 {
  margin: 0 !important; }

.unit-wrapper .unit-base > * {
  max-width: none !important;
  margin: 0 auto !important; }

/*============================================
mainview
============================================*/
.mainview {
  height: 40vh;
  background: url("../img/index/mainview-bg.jpg");
  background-size: cover;
  position: relative; }
  @media screen and (max-width: 897px) {
    .mainview {
      height: 30vh;
      background-size: auto; } }
  .mainview__box {
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center; }
    @media screen and (max-width: 897px) {
      .mainview__box {
        width: 100%; } }
    .mainview__box h1 {
      font-size: 5.0rem;
      line-height: 1;
      letter-spacing: 2px;
      padding: 0 0 20px 0; }
      @media screen and (max-width: 897px) {
        .mainview__box h1 {
          font-size: 3.0rem; } }
    .mainview__box p {
      font-size: 2.0rem;
      text-align: center;
      font-family: "Times New Roman", Times, "serif";
      font-style: italic;
      letter-spacing: 2px; }
      @media screen and (max-width: 897px) {
        .mainview__box p {
          font-size: 1.4rem;
          text-align: center; } }

.mainview-02 {
  max-width: 1600px;
  margin: auto; }

.alphard__box {
  max-width: 1100px;
  margin: auto;
  padding: 0; }
  @media screen and (max-width: 897px) {
    .alphard__box {
      margin: 0 20px;
      padding: 0; } }
  .alphard__box .alphard__history > li {
    overflow: hidden;
    margin: 0;
    position: relative; }
    .alphard__box .alphard__history > li .alphard__history-date {
      width: 110px;
      float: left;
      margin-top: 70px;
      font-size: 2.0rem;
      font-weight: 700;
      font-family: "Times New Roman", Times, "serif";
      font-style: italic; }
      @media screen and (max-width: 897px) {
        .alphard__box .alphard__history > li .alphard__history-date {
          width: 100%;
          text-align: center;
          color: #666;
          display: block;
          margin-top: 0; } }
    .alphard__box .alphard__history > li .alphard__history-content {
      width: 87%;
      float: left;
      border-left: 3px #ccc solid;
      padding: 74px 0 0 30px; }
      @media screen and (max-width: 897px) {
        .alphard__box .alphard__history > li .alphard__history-content {
          width: 100%;
          padding: 0 0 20px 0;
          border-left: none; } }
      .alphard__box .alphard__history > li .alphard__history-content:before {
        content: '';
        width: 12px;
        height: 12px;
        background: #fff;
        border: 2px solid #222;
        position: absolute;
        left: 104px;
        top: 80px;
        border-radius: 100%; }
        @media screen and (max-width: 897px) {
          .alphard__box .alphard__history > li .alphard__history-content:before {
            display: none; } }
      .alphard__box .alphard__history > li .alphard__history-content h2 {
        font-size: 3.2rem;
        line-height: 1;
        font-weight: 700;
        padding: 0 0 30px 0; }
        @media screen and (max-width: 897px) {
          .alphard__box .alphard__history > li .alphard__history-content h2 {
            text-align: center; } }
        .alphard__box .alphard__history > li .alphard__history-content h2 span {
          font-size: 2.0rem;
          position: relative;
          display: inline-block;
          width: 70%; }
          @media screen and (max-width: 897px) {
            .alphard__box .alphard__history > li .alphard__history-content h2 span {
              display: inline; } }
          .alphard__box .alphard__history > li .alphard__history-content h2 span::after {
            position: absolute;
            width: 100%;
            height: 1px;
            background: #e4e4e4;
            content: "";
            bottom: 1%;
            margin: 0 0 0 3%; }
            @media screen and (max-width: 897px) {
              .alphard__box .alphard__history > li .alphard__history-content h2 span::after {
                display: none; } }
      .alphard__box .alphard__history > li .alphard__history-content.last {
        padding: 74px 0 90px 30px; }
        @media screen and (max-width: 897px) {
          .alphard__box .alphard__history > li .alphard__history-content.last {
            width: 100%;
            padding: 0 0 40px 0;
            border-left: none; } }
    .alphard__box .alphard__history > li .inbox {
      display: flex;
      justify-content: space-between;
      flex-flow: row-reverse; }
      @media screen and (max-width: 897px) {
        .alphard__box .alphard__history > li .inbox {
          display: block; } }
      .alphard__box .alphard__history > li .inbox .txt {
        width: 44%;
        font-size: 1.65rem;
        line-height: 2.0; }
        @media screen and (max-width: 897px) {
          .alphard__box .alphard__history > li .inbox .txt {
            width: 100%; } }
        .alphard__box .alphard__history > li .inbox .txt p:not(:last-of-type) {
          margin: 0 0 15px 0; }
      .alphard__box .alphard__history > li .inbox .img {
        width: 52%; }
        @media screen and (max-width: 897px) {
          .alphard__box .alphard__history > li .inbox .img {
            width: 100%;
            margin: 0 0 15px 0; } }
        @media screen and (max-width: 897px) {
          .alphard__box .alphard__history > li .inbox .img.first {
            margin: 30px 0 15px 0; } }
    .alphard__box .alphard__history > li .caution {
      padding: 20px;
      border: 2px solid #f4f4f4;
      margin: 40px 0 0 0;
      background: #f7f7f7; }
      @media screen and (max-width: 897px) {
        .alphard__box .alphard__history > li .caution {
          margin: 20px 0 0 0;
          padding: 15px; } }
      .alphard__box .alphard__history > li .caution h3 {
        font-size: 1.7rem;
        margin: 0 0 10px 0;
        padding: 0 0 10px 0;
        border-bottom: 1px solid #e4e4e4; }
      .alphard__box .alphard__history > li .caution h4 {
        font-size: 1.6rem;
        margin: 10px 0; }
      .alphard__box .alphard__history > li .caution ul li {
        font-size: 1.45rem;
        line-height: 1.5;
        list-style-type: disc;
        margin: 0 0 5px 30px; }
        @media screen and (max-width: 897px) {
          .alphard__box .alphard__history > li .caution ul li {
            margin: 0 0 5px 15px; } }
      .alphard__box .alphard__history > li .caution a {
        color: #0044cc; }
        .alphard__box .alphard__history > li .caution a:hover {
          text-decoration: underline; }
    @media screen and (max-width: 897px) {
      .alphard__box .alphard__history > li:not(:first-of-type)::after {
        position: absolute;
        content: "";
        width: 2px;
        height: 30px;
        background: #e4e4e4;
        left: 50%;
        transform: translateX(-50%);
        top: 0; } }
    @media screen and (max-width: 897px) {
      .alphard__box .alphard__history > li:not(:first-of-type) .alphard__history-date {
        padding: 40px 0 0 0; } }

.alphard__history > li:first-of-type .inbox {
  align-items: flex-start; }

.alphard__slider {
  margin: 30px 0 0 0; }
  @media screen and (max-width: 897px) {
    .alphard__slider {
      margin: 20px 0 40px 0; } }

.alphard__slider h3 {
  display: inline-block;
  letter-spacing: 1px;
  font-weight: 400;
  background: #222;
  color: #fff;
  padding: 20px 20px;
  line-height: 1;
  border: 1px solid #ccc;
  border-bottom: none;
  box-sizing: content-box; }
  @media screen and (max-width: 897px) {
    .alphard__slider h3 {
      font-size: 1.4rem;
      line-height: 1.4;
      padding: 10px 20px; } }

.slick-box {
  display: flex;
  justify-content: space-between;
  border: 1px solid #ccc;
  padding: 10px; }
  @media screen and (max-width: 897px) {
    .slick-box {
      padding: 8px 8px 0 8px; } }

/*
.slick-box .slide {
  width: 23%;
    margin:0 0.5%;
}
*/
.slide .in {
  margin: 0 10px; }
  @media screen and (max-width: 897px) {
    .slide .in {
      margin: 0; } }

.slide img {
  width: 100%; }

.alphard__nav {
  max-width: 980px;
  margin: auto auto 60px auto;
  padding: 60px;
  border: 1px solid #ccc; }
  @media screen and (max-width: 897px) {
    .alphard__nav {
      padding: 20px;
      margin: auto 20px 40px 20px; } }
  .alphard__nav .inbox {
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 897px) {
      .alphard__nav .inbox {
        display: block; } }
    .alphard__nav .inbox .alphard__nav__item {
      text-align: center;
      width: 47%; }
      @media screen and (max-width: 897px) {
        .alphard__nav .inbox .alphard__nav__item {
          width: 100%; } }
      @media screen and (max-width: 897px) {
        .alphard__nav .inbox .alphard__nav__item:last-of-type {
          margin: 20px 0 0 0; } }
  .alphard__nav .button001 a {
    background: #222;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    font-size: 1.8rem;
    padding: 25px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 500;
    text-decoration: none;
    border: 1px solid #222; }
    @media screen and (max-width: 897px) {
      .alphard__nav .button001 a {
        padding: 15px;
        font-size: 1.6rem; } }
  .alphard__nav .button001 a:hover {
    background: #eee;
    color: #000;
    border: 1px solid #222; }
  .alphard__nav .button001 a:after {
    content: '';
    width: 5px;
    height: 5px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out; }
  .alphard__nav .button001 a:hover:after {
    border-color: #222; }
  .alphard__nav .caution {
    margin: 30px 0 0 0; }
    @media screen and (max-width: 897px) {
      .alphard__nav .caution {
        margin: 20px 0 0 0; } }
    .alphard__nav .caution a {
      color: #0044CC !important; }

.alphard__nav-top {
  max-width: 980px;
  margin: 60px auto 0 auto;
  padding: 60px;
  border: 1px solid #ccc; }
  @media screen and (max-width: 897px) {
    .alphard__nav-top {
      padding: 20px;
      margin: 20px 20px 20px 20px; } }
  .alphard__nav-top .inbox {
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 897px) {
      .alphard__nav-top .inbox {
        display: block; } }
    .alphard__nav-top .inbox .alphard__nav__item {
      text-align: center;
      width: 47%; }
      @media screen and (max-width: 897px) {
        .alphard__nav-top .inbox .alphard__nav__item {
          width: 100%; } }
      @media screen and (max-width: 897px) {
        .alphard__nav-top .inbox .alphard__nav__item:last-of-type {
          margin: 20px 0 0 0; } }
  .alphard__nav-top .button001 a {
    background: #222;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    font-size: 1.8rem;
    padding: 25px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 500;
    text-decoration: none;
    border: 1px solid #222; }
    @media screen and (max-width: 897px) {
      .alphard__nav-top .button001 a {
        padding: 15px;
        font-size: 1.6rem; } }
  .alphard__nav-top .button001 a:hover {
    background: #eee;
    color: #000;
    border: 1px solid #222; }
  .alphard__nav-top .button001 a:after {
    content: '';
    width: 5px;
    height: 5px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out; }
  .alphard__nav-top .button001 a:hover:after {
    border-color: #222; }
  .alphard__nav-top .caution {
    margin: 30px 0 0 0; }
    @media screen and (max-width: 897px) {
      .alphard__nav-top .caution {
        margin: 20px 0 0 0; } }
    .alphard__nav-top .caution a {
      color: #0044CC !important; }