@charset 'UTF-8';
/*----------------------------------------------------
  basic
----------------------------------------------------*/

/*@media (min-width: 960px) {
}*/

/*@media only screen and (max-width: 768px) {
}*/

.mb0{
  margin-bottom: 0 !important;
}

/*----------------------------------------------------
  sec-opn
----------------------------------------------------*/

.logo-top{
}
.logo-link{
/*  width: 9.92857rem;
  height: 8.92857rem;*/
  padding: 1.28571rem 0;
  background: #FEFEFE;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 5vw;
}
.logo-image {
    width: 10rem;
    line-height: 0;
    display: block;
    margin: 0 auto;
}
.image img{
    width: 100%;
    max-width: 100%;
    height: auto;
}

.sec-opn{
	width: 100vw;
	height: 100vh;
	background: #444;
  position: relative;
}

.swiper-container{
  height: 100vh;
}

.slide-bgimg01{
  background: url(../img/top/kv_img01.jpg) center center;
  background-size: cover;
}
.slide-bgimg02{
  background: url(../img/top/kv_img02.jpg) center center;
  background-size: cover;
}
.slide-bgimg03{
  background: url(../img/top/kv_img03.jpg) center center;
  background-size: cover;
}

.overlay{
  position: absolute !important;
  top: 0 !important;
  left: 0% !important;
  width: 100%;
  width: 100vw !important;
  height: 100vh !important;
  /*background: rgba(51,211,243,0.6) !important;*/
  background: url(../img/top/overlay.png) center center;
  display: block !important;
  z-index: 5 !important;
}

.opening-area{
  text-align: center;
  position: absolute;
  z-index: 2;
  width: 100%;
  top: 38%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: #FFF;
  letter-spacing: .1rem;
}
.ttl-cap{
  color: #FFF;
  letter-spacing: .1rem;
  padding: 0 15px;
}
/*
.opening-cap{
  margin-top: 30px;
  letter-spacing: .1rem;
  line-height: 1.8;
  color: #FFF;
}*/
.large-ttl{
  line-height: 1.2;
  color: #FFF;
  font-size: 3.6rem;
  font-weight: 600;
  letter-spacing: .1rem;
  margin-bottom: 30px;
}
.large-ttl span{
  color: #FFF;
  font-size: 1.2rem;
}
.small-ttl{
  color: #FFF;
  font-size: 1.2rem;
  letter-spacing: .1rem;
  font-weight: 600;
}

@media (min-width: 960px) {

  .swiper-container img{
    max-width: 100%;
    width: 100%;
    height: auto;
  }
  .swiper-slide span{
    position: absolute;
      top: 0;
      left: 0% !important;
      width: 100vw;
      height: 100vh;
      display: block;
      z-index: 4;
  }
  .logo-image {
      width: 7.22857rem;
  }
	.sec-opn{
		margin-top: 104px;
	}

}

@media only screen and (max-width: 768px) {

header{
	width: 100%;
	min-height: 80px;
	background: #FFF;
}
.large-ttl{
  padding: 0 15px;
  font-size: 2.0rem;
}
.small-ttl{
  padding: 0 15px;
  font-size: 1.0rem;
}
/*
	.slide-bgimg01_sp{
    background: url(../img/top/kv_img01_sp.jpg) center center;
    background-size: cover;
  }
  .slide-bgimg02_sp{
    background: url(../img/top/kv_img02_sp.jpg) center center;
    background-size: cover;
  }
  .slide-bgimg02_sp{
    background: url(../img/top/kv_img02_sp.jpg) center center;
    background-size: cover;
  }
*/

  .swiper-container{
    height: 100vh;
  }
  .swiper-slide span{
    position: absolute;
      top: 0;
      left: 0% !important;
      width: 100vw;
      height: 100vh;
      display: block;
      z-index: 4;
  }
  .opening-area{
    top: 50%;
    width: 100%;
  }
  .logo-link{
/*    width: 7.92857rem;
    height: 7.92857rem;*/
    padding: 1.28571rem 15px;
    background: #FEFEFE;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
  }

}

/*----------------------------------------------------
  sec01
----------------------------------------------------*/

.sec01{
  background: #f0f0f0;
}

.sec01_bg{
	padding: 150px 30px 320px 30px;
	background: #FFF;
	position: relative;
	z-index: 6;
  	background: url(../img/top/sec01_bg.png) center center;
  	background-size: cover;
}
.txt-box{
	color: #4b4b4b;
	max-width: 500px;
	margin: 0 auto;
}
.sec-ttl{
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 2.4rem;
	font-weight: 700;
	text-align: center;
	margin-bottom: 50px;
	letter-spacing: .2rem;
  line-height: .6;
}
.sec-ttl span{
  font-size: 1rem;
  font-weight: 500;
  text-align: center;
  letter-spacing: .2rem;
}


@media (min-width: 960px) {

  .sec01{
    position: relative;
    top: -280px;
  }
	.sec01_bg{
		padding: 280px 0;
	}
	.sec-ttl{
		font-size: 3.6rem;
	}

}

@media only screen and (max-width: 768px) {

  .sec01{
    position: relative;
    top: -140px;
  }
  .sec-ttl{
    margin-bottom: 30px;
    line-height: .9;
  }

}

/*----------------------------------------------------
  sec02
----------------------------------------------------*/

.sec02{
	position: relative;
	z-index: 6;
}

.sec02_bg{
	padding: 60px 30px 0 30px;
	position: relative;
	z-index: 5;
}

.card-txt-area{
  background: #FFF;
  padding: 2rem;
}
.card-ttl{
  margin-top: -10px;
  font-size: 21px;
  font-weight: 400;
  letter-spacing: .2rem;
  margin-bottom: 15px;
  line-height: 1.4;
}
.card-ttl span{
  font-size: 12px;
  font-weight: 600;
  color: #00dcad;
  letter-spacing: .1rem;
}
.color-01{
  color: #8b8b8b;
}
.color-02{
  color: #00dcad;
}

.img-box-bg0a{
  width: 100%;
  min-height:  240px;
  background: url(../img/top/sec02_bg01.jpg) center center;
  background-size: cover;
}
.img-box-bg0b{
  width: 100%;
  min-height:  240px;
  background: url(../img/top/sec02_bg02.jpg) center center;
  background-size: cover;
}
.img-box-bg0c{
  width: 100%;
  min-height:  240px;
  background: url(../img/top/sec02_bg03.jpg) center center;
  background-size: cover;
}

@media (min-width: 960px) {

	.sec02_bg{
    margin-top: -440px;
/*		padding-bottom: 100px;*/
	}

}

@media only screen and (max-width: 768px) {


  .sec02{
    margin-top: -420px;
  }
  .sec02_bg {
    background: #f0f0f0;
  }
  .img-box-bg0a,
  .img-box-bg0b,
  .img-box-bg0c{
    width: 100%;
    min-height:  180px;
  }

}

/*----------------------------------------------------
  sec03
----------------------------------------------------*/

.sec03{
  position: relative;
  z-index: 5;
}

.sec03_bg{
  padding: 60px 30px;
  background: #f0f0f0;
  position: relative;
  z-index: 5;
/*    background: url(../img/top/sec01_bg.png) center center;
    background-size: cover;*/
}

@media (min-width: 960px) {

.sec03_bg{
    margin-top: -450px;
    min-height: 500px;
  }

}

/*----------------------------------------------------
  sec04
----------------------------------------------------*/

.sec04{
  background: #f0f0f0;
  position: relative;
  z-index: 5;
}

.sec04_bg{
  padding: 60px 30px;
  position: relative;
  z-index: 5;
  background: url(../img/top/sec04_bg.png) center center;
  background-size: cover;
}

table {
  width: 100%;
}

th  {
  font-weight: 400;
  padding: 20px;
  border-bottom: 1px solid #6c6c6c;
  letter-spacing: .05em;
}
td  {
  padding: 20px;
  border-bottom: 1px solid #ccc;
  letter-spacing: .05em;
}

.timeline th{
  width: 30%;
  font-size: 16px;
  vertical-align: top;
}

@media (min-width: 960px) {

  .sec04_bg{
    padding: 120px 0;
  }
  .pl-0{
    padding-left: 0;
  }
  .bb-noen{
    border-bottom: none;
  }
  .t-head{
    width: 30%;
  }

}

@media only screen and (max-width: 768px) {

    .timeline th,
    .timeline td{
      width: 100%;
      display: block;
      border-top: none;
    }
  .timeline th{
    padding: 20px 0;
    border-right: none;
  }
  .timeline td{
    padding: 20px 0;
    line-height: 1.6;
  }

}

/*----------------------------------------------------
  sec05
----------------------------------------------------*/

.gmap{
	position: relative;
	width: 100%;
	padding-top: 42%;
}
.gmap iframe{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
@media only screen and (max-width: 468px) {
	.gmap{
		padding-top: 82%;
	}
}

/*----------------------------------------------------
  sec06
----------------------------------------------------*/

.sec06{
}

.sec06_bg{
  padding: 60px 0 0 0;
  background: url(../img/top/sec06_bg.png) center center;
  background-size: cover;
}

.txt-sec{
  padding: 3rem;
  background: #FFF;
  width: 90%;
  position: relative;
  right: -5%;
}
.corner{
  position: absolute;
  bottom: 0;
  right: 0;
  border-top: 30px solid transparent;
  border-right: 30px solid #f0f0f0;
}
.sec-subttl{
  font-size: 1.2rem;
  font-weight: 400;
  letter-spacing: .2rem;
}
.card-tagline {
  margin-top: 10px;
}
.card-tagline:after {
  content: ' ';
  display: inline-block;
  width: 30px;
  height: 2px;
  background: #00dcad;
  margin-bottom: 10px;
  line-height: 1;
  letter-spacing: .1em;
}

.img-box-bg01{
  width: 100%;
  min-height:  280px;
  background: url(../img/top/sec06_bg01.jpg) center center;
  background-size: cover;
}
.img-box-bg02{
  width: 100%;
  min-height:  280px;
  background: url(../img/top/sec06_bg02.jpg) center center;
  background-size: cover;
}

@media (min-width: 960px) {

  .sec06_bg{
    padding: 120px 0 0 0;
  }
  .txt-sec{
    top: -13%;
  }

}

@media only screen and (max-width: 768px) {

  .sec-subttl{
    font-size: 1.2rem;
  }
  .txt-sec{
    margin-top: -10%;
  }
  .img-box-bg01,
  .img-box-bg02{
    width: 100%;
    min-height:  180px;
  }

}

/*----------------------------------------------------
  sec07
----------------------------------------------------*/

.sec07{
}

.sec07_bg{
  z-index: 6;
  padding: 60px 30px;
  background: url(../img/top/sec07_bg.png) center center;
  background-size: cover;
}

.sec-box{
  padding: 3rem;
  background: #FFF;
}

@media (min-width: 960px) {

  .sec07_bg{
    padding: 120px 0;
  }

}

@media only screen and (max-width: 768px) {

  .sec-box{
    padding: 2rem;
  }

}

/*----------------------------------------------------
  sec08
----------------------------------------------------*/

.img-box-bg03{
  width: 100%;
  min-height:  370px;
  background: url(../img/top/sec08_bg01.jpg) center center;
  background-size: cover;
}
.img-box-bg04{
  width: 100%;
  min-height:  370px;
  background: url(../img/top/sec08_bg02.jpg) center center;
  background-size: cover;
}
.img-box-bg05{
  width: 100%;
  min-height:  370px;
  background: url(../img/top/sec08_bg03.jpg) center center;
  background-size: cover;
}
.img-box-bg06{
  width: 100%;
  min-height: 370px;
  background: url(../img/top/sec08_bg04.jpg) center center;
  background-size: cover;
}

@media only screen and (max-width: 768px) {

  .img-box-bg03,
  .img-box-bg04,
  .img-box-bg05,
  .img-box-bg06{
    width: 100%;
    min-height:  210px;
  }

}

/*----------------------------------------------------
  sec09
----------------------------------------------------*/

.sec09_bg{
  padding: 60px 30px;
  background: #33d3f3;
  color: #FFF;
}

.tel{
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 3.6rem;
  font-weight: 700;
  letter-spacing: .3rem;
}
.time{
  font-size: 1.2rem;
  letter-spacing: .1rem;
}


@media (min-width: 960px) {

  .sec09_bg{
    padding: 120px 0;
  }

}

@media only screen and (max-width: 768px) {

  .tel{
    font-size: 2.4rem;
  }
  .time{
    font-size: 1.0rem;
    letter-spacing: .1rem;
  }

}

/*----------------------------------------------------
  button
----------------------------------------------------*/

.btn-width{
  width: 450px;
  margin: 0 auto;
}

.button05 {
  width: 100%;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .2em;
  position: relative;
  display: inline-block;
  padding: 20px;
  color: #00bcee;
  text-align: center;
  transition: all .3s;
  background-color: #FFF;
}
.button05:before{
  vertical-align: -5px;
  font-size: 32px;
  font-family: "Font Awesome 5 Free";
  font-weight: 400;
  content: '\f0e0';
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  transition: all .3s;
  color: #00bcee;
}
.button05:hover {
  background-color: #00bcee;
  text-decoration: none;
  color: #FFF !important;
}
.button05:hover::before{
  color: #FFF;
  background: transparent;
}

@media only screen and (max-width: 768px) {

  .btn-width{
    width: 100%;
  }
  .button05 {
    font-size: 14px;
  }

}