@charset "UTF-8";


header *, main * {
  margin: 0;
  padding: 0
}

/* title */

#slider {
  width: 100%;
  height: auto;
  position: relative;
  background-size: cover;
}
.title img {
  width: 100%;
  height: auto;
  display: block;
}

/* cnt1 */
.container.cnt1 {
  position: relative;
  height: 840px;
  background:
  url("../images/bg_01.png") no-repeat calc(50% - 30px) 22px;
  background-color: #dff4fd;
}
.inner.cnt1 {
  position: relative;
  height: 840px;
}
.maincopy {
  position: absolute;
  left: 261px;
  top: 62px;
}
.mc-photo-01 {
  position: absolute;
  left: 95px;
  top: 171px;
}
.mc-photo-02 {
  position: absolute;
  left: 772px;
  top: 57px;
}
.mc-photo-03 {
  position: absolute;
  left: 5px;
  top: 389px;
}
.mc-photo-04 {
  position: absolute;
  left: 797px;
  top: 449px;
}
.btn-01 {
  position: absolute;
  left: 339px;
  top: 539px;
}
.btn-02 {
  position: absolute;
  left: 95px;
  top: 667px;
}

/* cnt2 */
.container.cnt2 {
  position: relative;
  height: 2930px;
  background:
  url("../images/bg_02.png") no-repeat center top;
  background-color: #caecfb;
}
.inner.cnt2 {
  position: relative;
  height: 2930px;
}
.askt-01 {
  position: absolute;
  left: 137px;
  top: 100px;
}
.activity-intro-photo-01 {
  position: absolute;
  left: 20px;
  top: 278px;
}
.activity-intro-photo-02 {
  position: absolute;
  left: 800px;
  top: 295px;
}
.activity-intro-photo-03 {
  position: absolute;
  left: 877px;
  top: 461px;
}
.activity-pt {
  position: absolute;
  left: 250px;
  top: 616px;
}
.activity-intro-copy {
  position: absolute;
  left: 70px;
  top: 317px;
}
.gourmet-intro-photo-01 {
  position: absolute;
  left: 170px;
  top: 817px;
}
.gourmet-intro-photo-02 {
  position: absolute;
  left: 39px;
  top: 831px;
}
.gourmet-intro-photo-03 {
  position: absolute;
  left: -20px;
  top: 944px;
}
.gourmet-pt {
  position: absolute;
  left: -60px;
  top: 1174px;
}
.gourmet-intro-copy {
  position: absolute;
  left: 700px;
  top: 855px;
}
.view-intro-photo-01 {
  position: absolute;
  left: 20px;
  top: 1341px;
}
.view-intro-photo-02 {
  position: absolute;
  left: 788px;
  top: 1366px;
}
.view-intro-photo-03 {
  position: absolute;
  left: 837px;
  top: 1541px;
}
.view-pt {
  position: absolute;
  left: 250px;
  top: 1684px;
}
.view-intro-copy {
  position: absolute;
  left: 70px;
  top: 1380px;
}
.remote-intro-photo-01 {
  position: absolute;
  left: 170px;
  top: 1873px;
}
.remote-intro-photo-02 {
  position: absolute;
  left: 63px;
  top: 1914px;
}
.remote-intro-photo-03 {
  position: absolute;
  left: 21px;
  top: 2049px;
}
.remote-pt {
  position: absolute;
  left: -60px;
  top: 2225px;
}
.remote-intro-copy {
  position: absolute;
  left: 700px;
  top: 1910px;
}
.kagoshima-intro-photo-01 {
  position: absolute;
  left: 20px;
  top: 2404px;
}
.kagoshima-intro-photo-02 {
  position: absolute;
  left: 833px;
  top: 2407px;
}
.kagoshima-intro-photo-03 {
  position: absolute;
  left: 794px;
  top: 2561px;
}
.kagoshima-pt {
  position: absolute;
  left: 290px;
  top: 2724px;
}
.kagoshima-intro-copy {
  position: absolute;
  left: 70px;
  top: 2442px;
}

/* cnt3 */
.container.cnt3  {
  position: relative;
  height: auto;
  padding-top: 145px;
  padding-bottom: 65px;
  background:
  url("../images/bg_06.png") no-repeat center top;
  background-color: #70b4eb;
}
#tab-box ul {
	list-style: none;
	position: relative;
}
#tab-box ul li {
	font-size: 0;
}
.askt-02 {
  position: relative;
  width: 716px;
  height: 89px;
  margin: 0 auto;
}
.mainnavi {
  position: relative;
  width: 920px;
  height: 160px;
  margin: 60px auto 55px;
}
.mainnavi li {
	width: 160px;
  height: 160px;
  float: left;
	display: inline;
	margin-right: 12px;
	margin-left: 12px;
}
.tab-1 {
  background-image: url("../images/tab_01.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.tab-2 {
  background-image: url("../images/tab_02.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.tab-3 {
  background-image: url("../images/tab_03.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.tab-4 {
  background-image: url("../images/tab_04.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.tab-5 {
  background-image: url("../images/tab_05.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.tab-1:hover {
  background-image: url("../images/tab_01.png");
  background-repeat: no-repeat;
  background-position: 0px -170px;
}
.tab-2:hover {
  background-image: url("../images/tab_02.png");
  background-repeat: no-repeat;
  background-position: 0px -170px;
}
.tab-3:hover {
  background-image: url("../images/tab_03.png");
  background-repeat: no-repeat;
  background-position: 0px -170px;
}
.tab-4:hover {
  background-image: url("../images/tab_04.png");
  background-repeat: no-repeat;
  background-position: 0px -170px;
}
.tab-5:hover {
  background-image: url("../images/tab_05.png");
  background-repeat: no-repeat;
  background-position: 0px -170px;
}

.number {
  position: relative;
  width: 350px;
  height: 50px;
  margin: 0 auto;
  padding-top: 50px;
  clear:both;
}
.number li {
	width: 50px;
  height: 50px;
  float: left;
	display: inline;
	margin-right: 10px;
	margin-left: 10px;
}
.no1 {
  background-image: url("../images/no1.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.no2 {
  background-image: url("../images/no2.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.no3 {
  background-image: url("../images/no3.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.no4 {
  background-image: url("../images/no4.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.no5 {
  background-image: url("../images/no5.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
}
.no1:hover {
  background-image: url("../images/no1.png");
  background-repeat: no-repeat;
  background-position: 0px -60px;
}
.no2:hover {
  background-image: url("../images/no2.png");
  background-repeat: no-repeat;
  background-position: 0px -60px;
}
.no3:hover {
  background-image: url("../images/no3.png");
  background-repeat: no-repeat;
  background-position: 0px -60px;
}
.no4:hover {
  background-image: url("../images/no4.png");
  background-repeat: no-repeat;
  background-position: 0px -60px;
}
.no5:hover {
  background-image: url("../images/no5.png");
  background-repeat: no-repeat;
  background-position: 0px -60px;
}
.no1act {
  background-image: url("../images/no1.png");
  background-repeat: no-repeat;
  background-position: 0px -120px;
}
.no2act {
  background-image: url("../images/no2.png");
  background-repeat: no-repeat;
  background-position: 0px -120px;
}
.no3act {
  background-image: url("../images/no3.png");
  background-repeat: no-repeat;
  background-position: 0px -120px;
}
.no4act {
  background-image: url("../images/no4.png");
  background-repeat: no-repeat;
  background-position: 0px -120px;
}
.no5act {
  background-image: url("../images/no5.png");
  background-repeat: no-repeat;
  background-position: 0px -120px;
}

/* tab-contents */
#tabcnt0 {
  position: relative;
  width: 978px;
  height: 5350px;
  margin: 0 auto;
}
#tabcnt1 {
  position: relative;
  width: 978px;
  height: 1170px;
  margin: 0 auto;
}
#tabcnt2 {
  position: relative;
  width: 978px;
  height: 1170px;
  margin: 0 auto;
}
#tabcnt3 {
  position: relative;
  width: 978px;
  height: 1170px;
  margin: 0 auto;
}
#tabcnt4 {
  position: relative;
  width: 978px;
  height: 1170px;
  margin: 0 auto;
}
#tabcnt5 {
  position: relative;
  width: 978px;
  height: 1170px;
  margin: 0 auto;
}
.cassette-1, .cassette-2, .cassette-3, .cassette-4, .cassette-5 {
  display: inline-block;
  width: 302px;
  height: 511px;
  margin: 12px;
  position: relative;
  float: left;
  background:
  url("../images/more.png") no-repeat center top;
}
.cassette-1 a, .cassette-2 a, .cassette-3 a, .cassette-4 a, .cassette-5 a {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.cassette-1:hover, .cassette-2:hover, .cassette-3:hover, .cassette-4:hover, .cassette-5:hover {
  opacity: 0.7;
}
.cassette-copy {
  position: absolute;
  left: 19px;
  top: 17px;
}
.cassette-photo {
  position: absolute;
  left: 6px;
  top: 91px;
}


/* cnt4 */
.container.cnt4 {
  position: relative;
  height: 735px;
}
.inner.cnt4 {
  position: relative;
  height: 735px;
}
.area-st {
  position: absolute;
  left: 270px;
  top: 55px;
}
.area-map {
  position: absolute;
  left: 28px;
  top: 143px;
}
.area-click {
  position: absolute;
  left: 815px;
  top: 124px;
}
.btn-03 {
  position: absolute;
  left: 503px;
  top: 233px;
}
.btn-04 {
  position: absolute;
  left: 783px;
  top: 263px;
}
.btn-05 {
  position: absolute;
  left: 554px;
  top: 389px;
}
.btn-06 {
  position: absolute;
  left: 785px;
  top: 477px;
}
.btn-07 {
  position: absolute;
  left: 526px;
  top: 521px;
}
.btn-08 {
  position: absolute;
  left: 341px;
  top: 620px;
}

/* cnt5 */
.container.cnt5 {
  position: relative;
  height: 1010px;
  background:
  url("../images/bg_07.png") repeat-x center bottom;
}
.inner.cnt5 {
  position: relative;
  height: 1010px;
}
.plan-st {
  position: absolute;
  left: 270px;
  top: 55px;
}
.plan-click {
  position: absolute;
  left: 802px;
  top: 64px;
}
.plan-slider-wrap {
  position: absolute;
  left: 0px;
  top: 150px;
  width: 990px;
  height: 370px;
}
.plan-slider img {
  display: block;
  margin: 0 auto;
}
.arrow-box {
  position: absolute;
  top: 165px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.prev-arrow,
.next-arrow {
  display: block;
  width: 36px;
  height: 36px;
  background: #fff;
  border: 1px solid #336888;
  border-radius: 50%;
  transition: all .3s ease;
  cursor: pointer;
  position:relative;
}
.prev-arrow {
  transform: rotate(180deg);
  margin-right: 280px;
}
.prev-arrow::before,
.next-arrow::before{
  position:absolute;
  content: "";
  width: 13px;
  height: 13px;
  border-right: 2px solid #336888;
  border-top: 2px solid #336888;
  top:0;
  bottom:0;
  left:-5px;
  right:0;
  margin:auto;
  transform:rotate(45deg);
}
.prev-arrow:hover,
.next-arrow:hover {
  opacity: 0.7;
}

.btn-02b {
  position: absolute;
  left: 95px;
  top: 780px;
}
.btn-09 {
  position: absolute;
  left: 95px;
  top: 605px;
}
.cooperation {
  position: absolute;
  left: 327px;
  top: 962px;
  line-height: 0;
}

#top {
	position: fixed;
	bottom: 60px;
	right: -71px;
	z-index: 1000;
}