@charset "UTF-8";

/* ----------------------------------------------------------------------
CSSのカスタマイズはこのファイルを使用してください。
これ以外のCSSファイルは改変不可！
---------------------------------------------------------------------- */
/* ----------------------------------------------------------------------
ここから　全サイト共通　変更不可　※変更の場合は後述で上書き※　*/
html,
body {
  width: 100%;
  height: 100%;
}

body {
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, "メイリオ", "Meiryo", sans-serif;
  color: #000;
  font-size: 1.5vw;
  line-height: 1.6;
  margin: 0;
}

ul,
li {
  list-style: none;
}

.clearfix:after {
  content: " ";
  display: block;
  clear: both;
}

h1,
h2,
h3,
h4,
h5,
h6,
ul,
dl,
dt,
dd,
p {
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box;
}

/* ----------------------------------------------------------------------
Font
---------------------------------------------------------------------- */
.fontMin {
  font-family: "ヒラギノ明朝 ProN W3", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", serif;
}

.fontGoth {
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, "メイリオ", "Meiryo", sans-serif;
}

/* ----------------------------------------------------------------------
Text
---------------------------------------------------------------------- */
.bold {
  font-weight: bold;
}

.fontL {
  font-size: 160%;
}

.fontM {
  font-size: 120%;
}

.fontS {
  font-size: 85%;
}

.justify {
  text-align: justify;
  text-justify: inter-ideograph;
}

.textV {
  -ms-writing-mode: tb-rl;
  /* IE用　*/
  -webkit-writing-mode: vertical-rl;
  /* chrome用　*/
  -o-writing-mode: vertical-rl;
  /* opera用　*/
  writing-mode: vertical-rl;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

@media (max-width: 1023px) {
  .textV {
    -ms-writing-mode: initial;
    /* IE用　*/
    -webkit-writing-mode: initial;
    /* chrome用　*/
    -o-writing-mode: initial;
    /* opera用　*/
    writing-mode: initial;
  }
}

/* ----------------------------------------------------------------------
img
---------------------------------------------------------------------- */
img {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
}

a img:hover {
  opacity: 0.85;
  filter: alpha(opacity=85);
  -ms-filter: "alpha(opacity=85)";
}

/* ----------------------------------------------------------------------
Table
---------------------------------------------------------------------- */
table {
  border-collapse: collapse;
}

/* ----------------------------------------------------------------------
Parts
---------------------------------------------------------------------- */
.t_center {
  text-align: center;
}

.t_right {
  text-align: right;
}

.t_left {
  text-align: left;
}

.f_left {
  float: left;
}

.f_right {
  float: right;
}

.d_none {
  display: none;
}

.d_block {
  display: block;
}

/* 表示 */
@media (min-width: 768px) {
  .pc_none {
    display: none !important;
  }
  .mb_none {
    display: block;
  }
}
@media (max-width: 1023px) {
  .pc_none {
    display: block !important;
  }

  .mb_none {
    display: none !important;
  }
}

/* ----------------------------------------------------------------------
Margin/Padding
---------------------------------------------------------------------- */
.mt10 {
  margin-top: 10px;
}
.mt20 {
  margin-top: 20px;
}
.mt30 {
  margin-top: 30px;
}
.mt40 {
  margin-top: 40px;
}
.mt50 {
  margin-top: 50px;
}
.mb10 {
  margin-bottom: 10px;
}
.mb20 {
  margin-bottom: 20px;
}
.mb30 {
  margin-bottom: 30px;
}
.mb40 {
  margin-bottom: 40px;
}
.mb50 {
  margin-bottom: 50px;
}
.ml10 {
  margin-left: 10px;
}
.ml20 {
  margin-left: 20px;
}
.ml30 {
  margin-left: 30px;
}
.ml40 {
  margin-left: 40px;
}
.ml50 {
  margin-left: 50px;
}
.mr10 {
  margin-right: 10px;
}
.mr20 {
  margin-right: 20px;
}
.mr30 {
  margin-right: 30px;
}
.mr40 {
  margin-right: 40px;
}
.mr50 {
  margin-right: 50px;
}

.mt1p {
  margin-top: 1%;
}
.mt2p {
  margin-top: 2%;
}
.mt3p {
  margin-top: 3%;
}
.mt5p {
  margin-top: 5%;
}
.mt7p {
  margin-top: 7%;
}
.mt10p {
  margin-top: 10%;
}
.mb1p {
  margin-bottom: 1%;
}
.mb2p {
  margin-bottom: 2%;
}
.mb3p {
  margin-bottom: 3%;
}
.mb5p {
  margin-bottom: 5%;
}
.mb7p {
  margin-bottom: 7%;
}
.mb10p {
  margin-bottom: 10%;
}
.ml1p {
  margin-left: 1%;
}
.ml2p {
  margin-left: 2%;
}
.ml3p {
  margin-left: 3%;
}
.ml5p {
  margin-left: 5%;
}
.ml7p {
  margin-left: 7%;
}
.ml10p {
  margin-left: 10%;
}
.mr1p {
  margin-right: 1%;
}
.mr2p {
  margin-right: 2%;
}
.mr3p {
  margin-right: 3%;
}
.mr5p {
  margin-right: 5%;
}
.mr7p {
  margin-right: 7%;
}
.mr10p {
  margin-right: 10%;
}

.mb1em {
  margin-bottom: 1em;
}

/* ----------------------------------------------------------------------
Flex
---------------------------------------------------------------------- */
.flex,
.flexBox {
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

.flex-nowrap {
  -webkit-flex-wrap: nowrap;
  /* Safari */
  flex-wrap: nowrap;
}

.flex-center {
  -webkit-justify-content: center;
  /* Safari用 */
  justify-content: center;
  -webkit-align-items: center;
  /* Safari用 */
  align-items: center;
}

.flex-between {
  -webkit-justify-content: space-between;
  /* Safari */
  justify-content: space-between;
}

.flex-start {
  -webkit-justify-content: flex-start;
  /* Safari */
  justify-content: flex-start;
}

/*
ここまで　全サイト共通　変更不可　※変更の場合は後述で上書き※
---------------------------------------------------------------------- */
/* ----------------------------------------------------------------------
以下、　サイトごとのCSS
/* ----------------------------------------------------------------------*/

/* ----------------------------------------------------------------------
All
---------------------------------------------------------------------- */
body {
  color: #fff;
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, "メイリオ", "Meiryo", sans-serif;
  background: #000;
}

a {
  color: #fff;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

section {
  width: 100%;
}
section .inner {
  width: 100%;
  height: 100%;
  padding: 2% 10%;
  position: relative;
  overflow: hidden;
}

dl.add {
}
dl.add dt {
  width: 5em;
  margin: 0 0 1em 0;
  float: left;
}
dl.add dd {
  margin: 0 0 1em 5em;
}

.h-01 {
  width: 100%;
  height: 120px;
  margin: 0 0 3% 0;
}
.h-01 img {
  width: auto;
  height: 100%;
}

.content-slide img {
  width: 100%;
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
  background: #fff !important;
}

@media (max-width: 1023px) {
  body {
    font-size: 3.4vw;
  }
  section .inner {
    padding: 0 10%;
  }
  .h-01 {
    height: 60px;
  }
  dl.add dt {
    margin: 0 0 0.2em 0;
  }
  dl.add dd {
    margin: 0 0 0.2em 5em;
  }
  #fp-nav.fp-right {
    right: 0.5% !important;
  }
}

/* ----------------------------------------------------------------------
home
---------------------------------------------------------------------- */

.webp .home .inner {
  background: url(../images/webp/image001-min.webp) right top no-repeat;
  background-size: cover;
}
.home .inner {
  background: url(../images/image001-min.jpg) right top no-repeat;
  background-size: cover;
}
.home .logo {
  position: absolute;
  margin: auto;
  top: 34%;
  left: 0;
  right: 0;
}
.home .logo2 {
  width: 18%;
  margin: 0 auto;
}
.home .box1 {
  text-align: center;
  margin: auto;
  position: absolute;
  bottom: 17%;
  left: 0;
  right: 0;
  text-shadow: 0 0 5px #000, 0 0 5px #000, 0 0 5px #000, 0 0 5px #000;
}

@media (max-width: 1023px) {
  .home .logo2 {
    width: 60%;
    margin: 5% auto;
  }
  .home .logo {
    top: 45%;
  }
}
/* ------------------------------------------
SP
------------------------------------------*/
@media (max-width: 767px) {
  .home .box1 p {
    font-size: 4vw;
  }
}

/* ----------------------------------------------------------------------
topics
---------------------------------------------------------------------- */
.webp .topics .inner {
  background: url(../images/webp/image002-min.webp) center top no-repeat;
  background-size: cover;
}
.topics .inner {
  background: url(../images/image002-min.png) center top no-repeat;
  background-size: cover;
}
.topics .box1 {
  width: 40%;
  height: 350px;
  margin: 5% 0 0 0;
  overflow-y: auto;
  background: rgba(0, 0, 0, 0.5);
  padding: 2%;
}
.topics .box1 .newsList {
}
.topics .box1 .newsList dd {
  margin: 0 0 3% 0;
}

@media (max-width: 1023px) {
  .topics .h-01 {
    margin-top: 5%;
  }
  .topics .box1 {
    width: 80%;
    height: 280px;
  }
}
/* -----------------------------------
SP
---------------------------------------*/
@media (max-width: 767px) {
  .topics .box1 dl {
  }
  .topics .box1 dt {
    font-size: 4.266666vw;
  }
  .topics .box1 dd {
    font-size: 4.266666vw;
  }
}

/* ----------------------------------------------------------------------
business
---------------------------------------------------------------------- */
.webp .business .inner {
  background: url(../images/webp/image003-min.webp) center top no-repeat;
  background-size: cover;
}
.business .inner {
  background: url(../images/image003-min.jpg) center top no-repeat;
  background-size: cover;
}
.business .content-slide {
  height: 65%;
  background: rgba(0, 0, 0, 0.5);
  margin: 0 auto 10%;
  padding: 3% 5%;
  overflow-y: auto;
}
.fp-controlArrow.fp-prev {
  border-color: transparent #fff transparent transparent !important;
  left: 11% !important;
}
.fp-controlArrow.fp-next {
  border-color: transparent transparent transparent #fff !important;
  right: 11% !important;
}
.fp-tableCell {
  vertical-align: top !important;
}
.business .h-01 img {
  float: right;
}
.business .h-02 {
  width: 100%;
  height: auto;
  margin: 0 0 3% 0;
  border-bottom: 1px solid #fff;
}
.business h4 {
  font-weight: bold;
  margin: 3% 0 1% 0;
}
.business .slideInnrt {
  width: 98%;
  height: 48%;
  padding: 0 2%;
  overflow-y: auto;
}
.business .planImg {
  width: 70%;
}

@media (max-width: 1023px) {
  .business .h-01 {
    margin-top: 5%;
  }
  .business .h-01 img {
    height: auto;
  }
  .fp-controlArrow.fp-prev {
    border-width: 28.5px 25px 28.5px 0 !important;
  }
  .fp-controlArrow.fp-next {
    border-width: 28.5px 0 28.5px 25px !important;
  }
  .business .content-slide {
    max-width: 100%;
    margin: 2% auto 10%;
    padding: 3% 10%;
  }
  .business .content-slide,
  .business .slideInnrt {
    height: 78%;
  }
  .business .content-slide,
  .business .slideInnrt img {
    max-height: 95%;
  }
}

@media (min-width: 768px) {
  .fp-controlArrow {
    top: 53% !important;
  }
}

/* ----------------------------------------------------------------------
philosophy
---------------------------------------------------------------------- */
.philosophy .inner {
  background: #1b1464;
}
.philosophy .h-01 {
}
.philosophy .h-02 {
  width: 45%;
  margin: 3% auto 1%;
}
.philosophy .box1 ul {
  margin: 3% 0 0 0;
}
.philosophy .box1 li {
  width: calc(80% / 3);
  margin: 1% 3%;
  display: inline-block;
  vertical-align: top;
}
.philosophy .box1 li img {
  width: 100%;
}

@media (max-width: 1023px) {
  .philosophy .h-01 {
    margin-top: 5%;
  }
  .philosophy .h-02 {
    width: 100%;
    margin: 10% auto 3%;
  }
  .philosophy .box1 li {
    width: calc(92% / 2);
    margin: 3% 2% 0;
  }
  .philosophy .box1 li br {
    display: none;
  }
}
/* --------------------------------------
SP
----------------------------------------*/
@media (max-width: 767px) {
  .philosophy .box1 h5 {
    font-size: 3.75vw;
  }
  .philosophy .box1 p {
    font-size: 3.75vw;
  }
}

/* ----------------------------------------------------------------------
company
---------------------------------------------------------------------- */
.webp .company .inner {
  background: url(../images/webp/image005-min.webp) center top no-repeat;
  background-size: cover;
}
.company .inner {
  background: url(../images/image005-min.png) center top no-repeat;
  background-size: cover;
}
.company .h-01 img {
  float: right;
}
.company table {
  background: rgba(0, 0, 0, 0.5);
  width: 50%;
  margin: 0 0 0 auto;
  border: 1px solid #fff;
}
.company table th,
.company table td {
  line-height: 1.3em;
  text-align: left;
  vertical-align: top;
  padding: 0.5% 4%;
  border-bottom: 1px solid #fff;
}
.company table th {
  white-space: nowrap;
}
.company table td span {
  font-size: 80%;
}

/* ------------------------------------------------
SP
--------------------------------------------------*/

@media (max-width: 1023px) {
  .company .h-01 {
    margin-top: 5%;
  }
  .company table {
    width: 100%;
    margin: 15% 0 0 0;
  }
}

/* ------------------------------------------------
SP
--------------------------------------------------*/
@media (max-width: 767px) {
  .company table {
    /* margin-top: 1.2em; */
    margin-top: 0.5em;
  }
  .company table tr {
    display: block;
    /* padding: 1em 0; */
  }
  .company table th {
    /* font-size: 4vw; */
    font-size: 3.5vw;
    display: block;
    width: 100%;
    padding-top: 0.4em;
    border-bottom: none;
  }
  .company table td {
    /* font-size: 4vw; */
    font-size: 3.5vw;
    display: block;
    width: 100%;
    padding-left: 2em;
    padding-bottom: 0.4em;
  }
  .company table td span {
    /* font-size: 4vw; */
    font-size: 3.5vw;
  }
}

/* ----------------------------------------------------------------------
contact
---------------------------------------------------------------------- */
.webp .contact .inner {
  background: url(../images/webp/image006-min.webp) center top no-repeat;
  background-size: cover;
}
.contact .inner {
  background: url(../images/image006-min.jpg) center top no-repeat;
  background-size: cover;
}
.contact .h-01 {
}
.contact .box1 {
  width: 40%;
  background: rgba(0, 0, 0, 0.5);
  padding: 2%;
}
.contact .box1 a {
  color: #fff;
  text-decoration: none;
}
.contact .conBtn {
  display: inline-block;
  padding: 1% 3%;
  text-decoration: none;
  background: #1b1464;
  border-bottom: solid 4px #627295;
  border-radius: 5px;
}
.contact .conBtn:active {
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  border-bottom: none;
}
.modaal-container {
  background: none !important;
  box-shadow: none !important;
}
.form-control {
  width: 100%;
  border: 2px solid rgba(0, 0, 0, 1);
  height: auto;
  padding: 0.5em;
  margin: 0.5em 0 1em 0;
}
#submit {
  color: #fff;
  display: inline-block;
  padding: 1% 3%;
  text-decoration: none;
  background: #1b1464;
  border: none;
  border-bottom: solid 4px #627295;
  border-radius: 5px;
}
#submit:active {
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  border-bottom: none;
}
#formWrap {
  text-align: center;
}
#formWrap table {
  color: #000;
  width: 50%;
  background: #fff;
  margin: 5% auto;
  border: 1px solid #1b1464;
}
#formWrap table td,
#formWrap table th {
  text-align: left;
  border: 1px solid #1b1464;
  padding: 1%;
}
#formWrap table tr:last-of-type {
  display: none;
}
#formWrap .btnArea {
  width: 30%;
  margin: auto;
}
#formWrap .formBtn {
  border: 2px solid #1b1464;
  color: #fff;
  background: #1b1464;
  padding: 1% 5%;
}
#formWrap .formBtn:hover {
  background: #32289d;
  color: white;
}

/* -------------------------------------
reCAPTCHA
---------------------------------------*/
#warning {
  color: #fff;
}
@media (max-width: 1023px) {
  .contact .h-01 {
    margin-top: 5%;
  }
  .contact .box1,
  .contact .box2 {
    width: 100%;
  }
  .contact .box1 {
    margin: 7% 0 0 0;
  }
  .contact .conBtn,
  #submit {
    border-bottom: solid 2px #627295;
  }
  .contact .conBtn:active,
  #submit:active {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
  }
  .form-control {
    margin: 0.3em 0 0.3em 0;
  }
  #formWrap table {
    width: 80%;
  }
  #formWrap .btnArea {
    width: 60%;
  }
}

@media (max-width: 767px) {
  .contact .box1 p a {
    font-size: 4vw;
  }
  .contact .add {
  }
  .contact .add dd {
    font-size: 4vw;
  }
  .contact .add dt {
    font-size: 4vw;
  }
}

/* ----------------------------------------------------------------------
access
---------------------------------------------------------------------- */
.webp .access .inner {
  margin-top: 1px;
  background: url(../images/webp/image007-min.webp) center top no-repeat;
  background-size: cover;
}
.access .inner {
  margin-top: 1px;
  background: url(../images/image007-min.png) center top no-repeat;
  background-size: cover;
}
.access .h-01 img {
  float: right;
}
.access .box1 {
  width: 50%;
  background: rgba(0, 0, 0, 0.5);
  margin: 0 5% 0 0;
  padding: 2%;
}
.access .flexBox .google_map {
  width: 45%;
  height: 300px;
}
.access .flexBox .google_map iframe {
  width: 100%;
  height: 100%;
}

@media (max-width: 1023px) {
  .access .h-01 {
    margin-top: 5%;
  }
  .access .box1 {
    width: 100%;
    margin: 7% 0;
  }
  .access .flexBox .google_map {
    width: 100%;
    height: 180px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .access .flexBox .google_map {
    width: 100%;
    height: 250px;
  }
}

@media (max-width: 767px) {
  .access .inner {
    padding: 0 9%;
  }
  .access .box1 dt {
    font-size: 4vw;
  }
  .access .box1 dd {
    font-size: 4vw;
  }
}

/* ----------------------------------------------------------------------
footer
---------------------------------------------------------------------- */
.footer {
  width: 100%;
  position: fixed;
  bottom: 0px;
  z-index: 9;
  background: -moz-linear-gradient(
    top,
    rgba(27, 20, 100, 0) 0%,
    rgba(27, 20, 100, 0.71) 9%,
    rgba(27, 20, 100, 1) 99%,
    rgba(27, 20, 100, 1) 100%
  ); /* FF3.6-15 */
  background: -webkit-linear-gradient(
    top,
    rgba(27, 20, 100, 0) 0%,
    rgba(27, 20, 100, 0.71) 9%,
    rgba(27, 20, 100, 1) 99%,
    rgba(27, 20, 100, 1) 100%
  ); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(
    to bottom,
    rgba(27, 20, 100, 0) 0%,
    rgba(27, 20, 100, 0.71) 9%,
    rgba(27, 20, 100, 1) 99%,
    rgba(27, 20, 100, 1) 100%
  ); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001b1464', endColorstr='#1b1464',GradientType=0 ); /* IE6-9 */
}
.footer .footer-inner {
  width: 100%;
  padding: 1% 0 0.5%;
}
.footer .copyright {
  font-size: 65%;
  position: relative;
  z-index: 1;
  margin: -1% 0 0 3%;
}

@media (max-width: 1023px) {
  .footer .copyright {
    z-index: 0;
    margin: 1.5% 0;
    text-align: center;
  }
}
/* --------------------------------------
SP
--------------------------------------- */
@media (max-width: 767px) {
  .footer .copyright {
    font-size: 3.75vw;
  }
}

/* ----------------------------------------------------------------------
animate.css
---------------------------------------------------------------------- */
.animated.inner {
  animation-delay: 0; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
}

/* home
-------------------------------------*/
.home .logo2 {
  animation-delay: 1s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.home .logo {
  animation-delay: 1.5s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.home .box1 {
  animation-delay: 2s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}

/* topics
-------------------------------------*/
.topics .h-01 {
  animation-delay: 0.5s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.topics .box1 {
  animation-delay: 1.5s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}

/* business
-------------------------------------*/
.business .h-01 {
  animation-delay: 0.5s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.business .content-slide {
  animation-delay: 1.5s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}

/* philosophy
-------------------------------------*/
.philosophy .h-01 {
  animation-delay: 1s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.philosophy .h-02 {
  animation-delay: 2s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.philosophy .h-03 {
  animation-delay: 2.5s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.philosophy li:nth-child(1) {
  animation-delay: 3s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}
.philosophy li:nth-child(2) {
  animation-delay: 3.5s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}
.philosophy li:nth-child(3) {
  animation-delay: 4s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}
.philosophy li:nth-child(4) {
  animation-delay: 4.5s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}
.philosophy li:nth-child(5) {
  animation-delay: 5s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}

/* company
-------------------------------------*/
.company .h-01 {
  animation-delay: 0.5s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.company table {
  animation-delay: 1.5s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}

/* contact
-------------------------------------*/
.contact .h-01 {
  animation-delay: 0.5s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.contact .box1 {
  animation-delay: 1.5s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}

/* access
-------------------------------------*/
.access.h-01 {
  animation-delay: 1s; /* アニメーション開始時間 */
  animation-duration: 2s; /* アニメーションの時間 */
  opacity: 0;
}
.access .box1 {
  animation-delay: 1.5s; /* アニメーション開始時間 */
  animation-duration: 1.5s; /* アニメーションの時間 */
  opacity: 0;
}
.access .box2 {
  animation-delay: 2s; /* アニメーション開始時間 */
  animation-duration: 1s; /* アニメーションの時間 */
  opacity: 0;
}