@charset "UTF-8";

* {
  margin: 0;
  padding: 0;
  vertical-align: bottom;
  outline: none;
  font-family: heisei-kaku-gothic-std, sans-serif;
}

.view_pc {display: block;}
.view_sp {display: none;}

.warp {
  overflow: hidden;
}

#loading{
  position: absolute;
  width: 27em;
  height: 25em;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

#loading p {
  text-transform: uppercase;
  letter-spacing: 1.5em;
  display: inline-block;
  border: 4px double gba(255,255,255,.25);
  border-width: 4px 0;
  padding: 1.5em 0em;
  position: absolute;
  width: 40em;
}

.l1,.l2,.l3 {
  position: absolute;
}

.l1 {top:0}
.l2 {top:100px}
.l3 {top:200px}

#loading p span {
  font-size: 45px;
  font-weight: bold;
  letter-spacing: 20px;
  line-height: 120px;
  background: url(../images/top_back.jpg) repeat-y;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-animation: aitf 4s linear infinite;
  -webkit-transform: translate3d(0,0,0);
  -webkit-backface-visibility: hidden;
  font-family: "メイリオ", sans-serif;
  }

@-webkit-keyframes aitf {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

#loader-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #FFF;
  z-index: 1000;
}

.loader_bottom {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 90px;
  background: url(../images/line_bottom.png);
  text-align: center;
}

#cont_base {
  width: 100%;
}

.slider{
}
.slider img {
    height: auto;
    width: 100%;
}

/*slick setting*/
.slick-prev:before,
.slick-next:before {
    color: #000;
}

.slider_title {
  position: absolute;
  top: 20px;
  left: 30px;
  font-size: 50px;
  letter-spacing: 18px;
  line-height: 85px;
  font-weight: normal;
  color: #fff;
  z-index: 11;
}

.slider_head {
  position: absolute;
  top: 0;
  left: 0;
  max-width: 560px;
  width: 37.33vw;
  z-index: 10;
}

.cont_top {
  position: relative;
  margin: 0 auto 150px;
  max-width: 1500px;
  width: 90%;
}

.line_top {
  position: relative;
  width: 100%;
  height: 123px;
  background: url(../images/line_top.png);
}

.line_bottom {
  position: relative;
  width: 100%;
  height: 174px;
  background: url(../images/line_bottom.png);
  text-align: center;
}

.osae_title {
  display: inline-block;
  margin-top: -27px;
  text-align: left;
  font-size: 35px;
  letter-spacing: 10px;
  line-height: 60px;
  color: #696969;
}

.osae {
  position: relative;
  left: 50%;
  margin-left: -960px;
}

.cont_title {
  position: relative;
  top: -33px;
  text-align: center;
  font-size: 18px;
  letter-spacing: 10px;
  line-height: 50px;
  color: #696969;
}

.cont_title1 {
  position: relative;
  top: -33px;
  text-align: center;
  font-size: 18px;
  letter-spacing: 10px;
  line-height: 50px;
  color: #696969;
}

.gaiyou {
  margin: 30px 0 150px;
}

.gaiyou_box {
  display: -webkit-flex;
  display: flex;
  position: relative;
  width: 1024px;
  height: 284px;
  left: 50%;
  margin-left: -512px;
  text-align: center;
  background: #f6f2ee;
}

.gaiyou_box2 {
  display: -webkit-flex;
  display: flex;
  position: relative;
  width: 1024px;
  height: 350px;
  left: 50%;
  margin-left: -512px;
  text-align: center;
  background: #f6f2ee;
}

.gaiyou_cont {
  width: 341px;
  height: 284px;
  padding-top: 100px;
}

.gaiyou_cont2 {
  width: 341px;
  height: 284px;
  padding-top: 60px;
}

.gaiyou_cont_title p {
  display: inline;
  padding: 12px 25px 6px;
  font-size: 26px;
  letter-spacing: 5px;
  color: #fff;
  background: #32bebe;
}

.gaiyou_cont_text {
  margin-top: 30px;
  font-size: 20px;
  line-height: 30px;
  letter-spacing: 4px;
  color: #696969;
}

.gaiyou_cont_text span {
  font-size: 15px;
}

.schedule {
  position: relative;
  width: 1920px;
  height: 1464px;
  left: 50%;
  margin-left: -960px;
}

#day_1st {
  display: block;
  position: absolute;
  top:0;
  left: 0;
  z-index: 60;
}

#day_2nd {
  display: block;
  position: absolute;
  top:0;
  left: 0;
  z-index: 50;
}

.oubo {
  width: 420px;
  margin: 200px auto 150px;
  transition: all 0.3s;
  opacity: 1;
}

.oubo:hover {
  opacity: 0.7;
}

.about {
  position: relative;
  width: 1024px;
  height: 826px;
  left: 50%;
  margin-left: -512px;
  background: url(../images/about_main.png);
}

.slider2 {
  width: 778px;
  position: absolute;
  top: 453px;
  left: 124px;
}

.prev-arrow {
  position: absolute;
  top: 278px;
  left: 280px;
  cursor: pointer;
}

.next-arrow {
  position: absolute;
  top: 278px;
  left: 488px;
  cursor: pointer;
}

.ijyu {
  position: relative;
  width: 1049px;
  height: 330px;
  left: 50%;
  margin-left: -524px;
}

.note {
  position: relative;
  width: 1920px;
  height: 861px;
  left: 50%;
  margin-left: -960px;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: 2px;
  color: #696969;
  background: url(../images/note.png);
}

.note1,.note2,.note3,.note4,.note5 {
  position: absolute;
}

.note1 {top:100px;left:26%;}
.note2 {top:531px;left:877px;}
.note3 {top:482px;left:1035px;}
.note4 {top:687px;left:906px;}
.note5 {top:627px;left:1036px;}

.cont_footer {
  position: relative;
  width: 1024px;
  left: 50%;
  margin-left: -512px;
  padding: 18px 0;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  font-size: 15px;
  letter-spacing: 2px;
  color: #afa8a3;
}

.cont_footer a {
  text-decoration: none;
  font-weight: normal;
  color: #afa8a3;
}

@media screen and ( max-width:1499px) {
  .slider_title {
    font-size: 3.33vw;
    top: 1.33vw;
    left: 2vw;
    letter-spacing: 1.2vw; line-height: 5.6vw;
  }
}

@media screen and ( max-width:700px) {

  .view_pc {display: none;}
  .view_sp {display: block;}
  .smp {width: 100%;}

  #loading{
    position: absolute;
    width: 17.5em;
    height: 20em;
  }

  .l1 {top:0}
  .l2 {top:20vw}
  .l3 {top:40vw}

  #loading p span {
    font-size: 9vw;
    letter-spacing: 2vw;
    line-height: 20vw;
    -webkit-animation: aitf 10s linear infinite;
    }

  .loader_bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 30vw;
    background: url(../images/line_bottom.png);
    text-align: center;
  }

  #menu {
    position: fixed;
    left: 0;
    bottom: 25.2vw;
    z-index: 100;
  }

  #menu img {
    width: 50%;
  }

  .line_top {
    position: relative;
    width: 100%;
    height: 123px;
    background: url(../images/line_top.png);
  }

  .line_bottom {
    position: relative;
    width: 100%;
    height: 174px;
    background: url(../images/line_bottom.png);
    text-align: center
  }

  .slider_head {
    position: absolute;
    top: -2.5vw;
    left: -5vw;
    width: 70vw;
    z-index: 10;
  }

  .cont_top {
    position: relative;
    margin: 2.5vw auto 30vw;
    width: 95%;
  }

  .osae_title {
    position: relative;
    left: 2vw;
    width: 75%;
    margin: 0 auto;
    display: inline-block;
    margin-top: -14.5vw;
    text-align: left;
    font-size: 5vw;
    letter-spacing: 2vw;
    line-height: 10vw;
    color: #696969;
  }

  .osae {
    position: relative;
    width: 100%;
    left: 0;
    margin-left: 0;
  }

  .cont_title {
    position: relative;
    top: -10vw;
    text-align: center;
    font-size: 5vw;
    letter-spacing: 10px;
    line-height: 50px;
    color: #696969;
  }

  .cont_title1 {
    position: relative;
    top: -10vw;
    text-align: center;
    font-size: 5vw;
    letter-spacing: 10px;
    line-height: 50px;
    color: #696969;
  }

  .cont_title2 {
    padding-top: 5vw;
    position: relative;
    top: -8vw;
    text-align: center;
    font-size: 3.5vw;
    letter-spacing: 6px;
    line-height: 50px;
    color: #696969;
  }

  .cont_title img {
    width: 70%;
  }

  .cont_title1 img {
    width: 55%;
  }

  .cont_title2 img {
    width: 70%;
  }

  .gaiyou {
    position: relative;
    width: 80%;
    margin: 0 auto 150px;
  }

  .gaiyou_box {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
    height: auto;
    left: 0;
    margin-left: 0;
    text-align: center;
    background: #f6f2ee;
  }

  .gaiyou_box2 {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
    height: auto;
    left: 0;
    margin-left:0;
    padding-bottom: 20vw;
    background: #f6f2ee;
  }

  .gaiyou_cont {
    width: 90%;
    height: auto;
    margin: 0 auto;
    padding-top: 20vw;
  }

  .gaiyou_cont2 {
    width: 90%;
    height: auto;
    margin: 0 auto;
    padding-top: 20vw;
  }

  .gaiyou_cont_title p {
    display: inline;
    padding: 12px 25px 6px;
    font-size: 21px;
    letter-spacing: 5px;
    color: #fff;
    background: #32bebe;
  }

  .gaiyou_cont_text p {
    margin-top: 30px;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 4px;
    color: #696969;
  }

  .gaiyou_cont_text span {
    font-size: 10px;
  }

  .schedule_sp {
    position: relative;
    width: 100%;
    height: 395.5vw;
    left: 0;
    margin-left: 0;
  }

  #day_1st_sp img,#day_2nd_sp img {
    width: 100%;
    height: auto;
  }

  #day_1st_sp {
    display: block;
    position: absolute;
    top:0;
    left: 0;
    z-index: 60;
  }

  #day_2nd_sp {
    display: block;
    position: absolute;
    top:0;
    left: 0;
    z-index: 50;
  }

  .about {
    position: relative;
    width: 80%;
    margin: 0 auto;
    height: 240vw;
    left: 0;
    background: url(../images/about_sp.png);
    background-size: cover;
  }

  .slider2 {
    width: 100%;
    position: absolute;
    top: 125vw;;
    left: 0;
  }

  .oubo {
    width: 80%;
    margin: 30vw auto;
    transition: all 0.3s;
    opacity: 1;
  }

  .oubo img {
    width: 100%;
  }

  .prev-arrow {
    position: absolute;
    top: 101vw;
    left: 10vw;
    cursor: pointer;
  }

  .next-arrow {
    position: absolute;
    top: 101vw;
    left: 67vw;
    cursor: pointer;
  }

  .sp_about_slider ul li img {
    width: 100%;
    margin: 12vw auto 0;
  }

  .slick-dots
  {
      bottom: -6.5vw !important;
  }

  .ijyu {
    position: relative;
    width: 100%;
    height: auto;
    left: 0;
    margin-left: 0;
  }

  .note {
    position: relative;
    width: 100%;
    height: 215.06vw;
    left: 0;
    margin-left: 0;
    padding-top: 15vw;
    font-size: 10px;
    line-height: 20px;
    letter-spacing: 2px;
    color: #696969;
    background: url(../images/tyuui_sp.png);
    background-size: cover;
  }

  .note1,.note2,.note3,.note4,.note5 {
    position: relative;
    width: 80%;
    margin: 0 auto;
  }

  .note1 {top:0;left:0;}
  .note2 {top:1em;left:0;}
  .note3 {top:1em;left:0;}
  .note4 {top:3em;left:0;}
  .note5 {top:3em;left:0;}

  .cont_footer {
    position: relative;
    display: block;
    width: 100%;
    left: 0;
    margin-left: 0;
    padding: 18px 0;
    text-align: center;
    font-size: 15px;
    letter-spacing: 2px;
    line-height: 25px;
    color: #afa8a3;
  }

  .cont_footer a {
    text-decoration: none;
    font-weight: normal;
    color: #afa8a3;
  }

  /* overlay ----------- */

  #overlay {
	position: fixed;
  top: 0;
	width: 100%;
  height:100%;
	display: none;
  text-align: center;
  z-index: 100;
  background: rgba(255,255,255,0.90);
}

#close {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 30;
	padding: 3.73vw 4.13vw;
}

#close img {
  width: 10vw;
	height: 10vw;
}

#menu_list {
	position: relative;
	width:  100%;
	height: 100%;
}

#menu_box {
	position: absolute;
	top: -30vw;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100vw;
	height: 65.06vw;
	margin: auto;
}

#menu_box li {
	margin-bottom: 10.4vw;
	list-style-type: none;
}

#menu_box li a {
  text-decoration: none;
  font-size: 6.5vw;
  line-height: 10vw;
  color: #65cbdc;
}

}
