@charset "Shift_JIS";
@import "reset.css";


/* COMMON */
/**************************************************/
body{}

h2{margin:0; line-height:1em;}

.liquid-box{width:100%;min-width:990px;text-align:center;}
.solid-box{width:990px;margin-left:auto;margin-right:auto;}



/* MAINVISUAL
***************************************************/
#mainvisual{height:1160px; background: url("../images/map_bg.png") repeat-x left bottom;}
#mainvisual .solid-box{width:100%; height:1160px; position: relative; background:url("../images/kv_agakita.png") no-repeat center top;}
#mainvisual #mv-title{width:112px; height:394px; margin-left:-56px; position:absolute; left:50%; top:50px;}
#mainvisual #mv-copy{width:691px; height:84px; margin-left:-345px; position:absolute; left:50%; top:480px;}

/* MAP
***************************************************/
#map{width:990px; height:580px; margin-left:-495px; position: absolute; left:50%; bottom:0;}
#map #map-box{width:990px; height:580px; position:relative;}
#map .map-box{position:absolute;}
#map #map-img{width:465px; height:369px; right:0px; bottom:-246px;}
#map #area-map{width:705px; height:561px; left:-28px; bottom:0px;}
#map #about1{width:354px; height:242px; left:0px; top:260px;}
#map #about2{width:451px; height:320px;	right: 0px;	top: 60px;}

/* AREA
***************************************************/
#area01{background: url("../images/map_bg.png") repeat-x left 0px bottom 440px;}
#area01-intro{width:990px; height:744px; margin-top:90px; position: relative;}
#area01-intro .area-box{position:absolute;}
#area01-intro #area01-title{width:240px; height:247px; left:28px; top:0px; z-index:5;}
#area01-intro #area01-text{width:132px; height:342px; left:82px; top:270px; z-index:4;}
#area01-intro #area01-img1{width:701px; height:420px; right:44px; top:165px; z-index:1;}
#area01-intro #area01-img2{width:399px; height:286px; right:50px; top:495px; z-index:2;}
#area01-intro #area01-hd{width:566px; height:61px; left:82px; bottom:0px; z-index:3;}

#area02{background: url("../images/map_bg.png") repeat-x left 0px bottom 440px;}
#area02-intro{width:990px; height:732px; margin-top:90px; position: relative;}
#area02-intro .area-box{position:absolute;}
#area02-intro #area02-title{width:240px; height:247px; left:28px; top:0px; z-index:5;}
#area02-intro #area02-text{width:183px; height:350px; left:54px; top:270px; z-index:4;}
#area02-intro #area02-img1{width:750px; height:401px; right:0px; top:-40px; z-index:1;}
#area02-intro #area02-img2{width:514px; height:408px; right:19px; top:280px; z-index:2;}
#area02-intro #area02-hd{width:566px; height:61px; left:82px; bottom:0px; z-index:3;}

#area03{background: url("../images/map_bg.png") repeat-x left 0px bottom 440px;}
#area03-intro{width:990px; height:848px; margin-top:90px; position: relative;}
#area03-intro .area-box{position:absolute;}
#area03-intro #area03-title{width:240px; height:247px; right:28px; top:0px; z-index:5;}
#area03-intro #area03-text{width:183px; height:348px; right:50px; top:270px; z-index:4;}
#area03-intro #area03-img1{width:720px; height:401px; left:26px; top:26px; z-index:1;}
#area03-intro #area03-img2{width:646px; height:357px; left:94px; top:375px; z-index:2;}
#area03-intro #area03-hd{width:566px; height:61px; left:82px; bottom:0px; z-index:3;}

.area-sopt{width:950px; margin:90px auto 0;}
.area-sopt .spot-box{width:950px; height:341px; margin-bottom:60px; position: relative;}
.area-sopt .spot-box img{position:absolute; top:0px; left:0px;}
.area-sopt .spot-box img.pos-r{left:auto;right:0px;}
.area-gourmet{width:900px; height: 506px; position: relative;}
.area-gourmet .gourmet-l{width:474px; position:absolute; left:-20px;}
.area-gourmet .gourmet-r{width:474px; position:absolute; right:-20px;}

.area-link{width:900px; height:208px; margin:80px auto 0; position: relative;}
.area-link .area-label{width:377px; height:86px; margin-left:-188px; position: absolute; top:-60px; left:50%; z-index: 1;}
.area-link .yado-bt{width:430px; height:120px; position: absolute; left:0px;}
.area-link .asobi-bt{width:430px; height:120px; position: absolute; right:0px;}
.area-link ul{width:740px; margin:0 auto; padding-top:140px; overflow: hidden;}
.area-link li{width:230px; margin: 0 8px; padding:0; float:left;}


/* ZEKKEI
***************************************************/
#zekkei{height: 580px; margin:80px auto 120px; background: url("images/zekkei_bg.jpg") no-repeat cover center center;}
#zekkei .solid-box{height: 580px; position: relative;}
#zekkei .zk-box{width:278px; height:278px; position: absolute;}
#zekkei #zk-title{width:83px; height:364px; margin-left:-41px; position: absolute; left:50%; top:50px;}
#zekkei #zk-agano{left:150px; top:-50px;}
#zekkei #zk-tainai{left:0px; top:200px;}
#zekkei #zk-gosen{right:100px; top:18px;}
#zekkei #zk-senami{right:30px; top:280px;}
#zekkei #zk-aga{left:350px; bottom:-120px;}
#zekkei #zk-caption{width:126px; height:42px; position: absolute;left:10px; bottom:10px;}


/* ACCESS
***************************************************/
#access{}
#access .solid-box{height:884px; position: relative;}
#access .access-box{ position:absolute;}
#access #access-title{width:189px; height:201px; left:30px; top:-12px; z-index: 5;}
#access #access-map{width:465px; height:628px; left:0px; top:180px;}
#access #access-railway{width:474px; height:302px; right:0; top:0px;}
#access #access-highway{width:474px; height:248px; right:0; top:322px;}
#access #access-airplane{width:474px; height:279px; right:0; top:590px;}
#access #access-peach{width:250px; height:40px; right:0; top:590px;}

.ft-link{width:940px; height:163px; margin:60px auto 90px; position: relative;}
.ft-link .yado-bt{width:445px; height:163px; position: absolute; left:0px;}
.ft-link .asobi-bt{width:445px; height:163px; position: absolute; right:0px;}


.fadeInUpObj, .fadeInObj{visibility:hidden;}

/* animate.css */
.animated, .fadeInUp, .fadeOutDown, .fadeIn, .fadeOut{
    visibility: visible;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}


@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}



/* ANCHOR
***************************************************/
#anchor{position:fixed;right:10px;bottom:60px;}
#anchor a{display:block;}


/* FOOTER
***************************************************/
#ft .solid-box{height:140px;}
#ft #recruit-logo{width:104px; position:absolute; left:0; top:10px;}
#ft #copyright{width:300px; position:absolute; left:116px; top:28px; }
#ft #copyright p{color:#4F636E; font-size:12px; font-weight:bold;}
#ft #jalan-logo{width:132px; position:absolute; right:15px; top:0;}
#ft #group-link{width:200px; position:absolute; left:0; top:54px;}
#ft #group-link a{text-decoration:underline;}
#ft #group-link a:hover{text-decoration:none;}