@charset "utf-8";

/*========================================================================================================================


  ◇◆◇ トップページ ◇◆◇
  
  
========================================================================================================================*/

/*-----------------------------------------------------------------------------------
  見出し
-----------------------------------------------------------------------------------*/

.headline {
  font-weight:normal;
  line-height:1;
}

.headline_en {
  font-family:"Roboto Condensed";
  font-weight:300;
  font-size:250%;
  color:#0d579a;
  display:inline-block;
  margin-right:0.3em;
}

@media screen and (max-width:640px) {
  .headline_en { font-size:220%; }
}


/*----------------------------------------------------------------------------------------------------

  header
  
----------------------------------------------------------------------------------------------------*/

header {
  position:absolute;
  left:0;
  top:0;
}

@media screen and (max-width:640px) {
  header {
    position:relative;
    left:inherit;
    top:inherit;
  }
}


/*-----------------------------------------------------------------------------------
  ロゴ
-----------------------------------------------------------------------------------*/

.hd_logo a {
  background-image:url(../image/logo-white.png);
}

.no-backgroundsize .hd_logo a {
  background-image:url(../image/logo-white_s.png);
}


@media screen and (max-width:640px) {
  .hd_logo a {
    background-image:url(../image/logo-black.png);
  }

  .no-backgroundsize .hd_logo a {
    background-image:url(../image/logo-black_s.png);
  }
}


/*-----------------------------------------------------------------------------------
  language
-----------------------------------------------------------------------------------*/

.hd_lang li {
  border-color:#0a3764;
}

.hd_lang li.active {
  background-color:#fff;
  border-color:#fff;
}

.no-csstransitions .hd_snav li:after {
  color:#fff;
}


/*-----------------------------------------------------------------------------------
  snav
-----------------------------------------------------------------------------------*/

.hd_snav li a,
.hd_snav li a:visited { color:#fff; text-decoration:none; }
.hd_snav li a:hover { color:#fff; text-decoration:underline; }

.hd_snav li:after {
  border-right-color:#fff;
}


/*----------------------------------------------------------------------------------------------------

  nav
  
----------------------------------------------------------------------------------------------------*/

#glNav-warp {
  width:100%;
  background-color:rgba(13,87,154,0.9);
  position:absolute;
  left:0;
  top:580px;
  z-index: 9999;
}

.no-rgba #glNav-warp {
  background-color:#0d579a;
}


/*----------------------------------------------------------------------------------------------------

  main slide
  
----------------------------------------------------------------------------------------------------*/

#mainSlide-warp {
  width:100%;
  height:650px;
  z-index:10;
  position:relative;
  overflow:hidden;
}

#mainSlide {
  width:100%;
  height:650px;
  position:relative;
  list-style:none;
  background-color:#0d579a;
}

#mainSlide li:after {
  content:"";
  display:block;
  width:100%;
  height:100%;
  background:url(../image/top/slide/gr.png) repeat-x left top;
  position:absolute;
  left:0;
  top:0;
  z-index:2;
}

#mainSlide li:before {
  content:"";
  display:block;
  width:100%;
  height:100%;
  background:url(../image/top/slide/logo.png) no-repeat left top;
  position:absolute;
  left:0;
  top:0;
  z-index:2;
}

#mainSlide li {
  position:relative;
  height:650px;
}

#mainSlide li .txt {
  width:100%;
  height:100%;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:800px auto;
  text-align:center;
  position:absolute;
  left:0;
  bottom:70px;
  z-index:3;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
}

.no-csstransitions #mainSlide li .txt {
  bottom:0;
}

#mainSlide li .photo {
  width:100%;
  height:650px;
  background-repeat:no-repeat;
  background-position:center bottom;
  background-size:cover;
}

.csstransitions #mainSlide .slick-list li.active-zoom .photo {
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  overflow:hidden;
  -webkit-animation:imageAnimation 15s linear forwards;
  -moz-animation:imageAnimation 15s linear forwards;
  -o-animation:imageAnimation 15s linear forwards;
  -ms-animation:imageAnimation 15s linear forwards;
  animation:imageAnimation 15s linear forwards;
}

@media screen and (max-width:640px) {
  #mainSlide-warp {
    height:inherit;
  }
  
  #mainSlide,
  #mainSlide li .photo,
  #mainSlide li {
    height:500px;
  }
  
  #mainSlide li:before {
    display:none;
  }
  
  #mainSlide li .txt {
    background-size:640px auto;
    bottom:0;
  }
}

@-webkit-keyframes imageAnimation {
  0% {
    -webkit-animation-timing-function:ease-in;
  }
  4% {
    -webkit-transform:scale(1);
  }
  100% {
    -webkit-transform:scale(1.2);
  }
}

@-moz-keyframes imageAnimation {
  0% {
    -moz-animation-timing-function:ease-in;
  }
  4% {
    -moz-transform:scale(1);
  }
  100% {
    -moz-transform:scale(1.2);
  }
}

@-o-keyframes imageAnimation {
  0% {
    -o-animation-timing-function:ease-in;
  }
  4% {
    -o-transform:scale(1);
  }
  100% {
    -o-transform:scale(1.2);
  }
}

@-ms-keyframes imageAnimation {
  0% {
    -ms-animation-timing-function:ease-in;
  }
  4% {
    -ms-transform:scale(1);
  }
  100% {
    -ms-transform:scale(1.2);
  }
}

@keyframes imageAnimation {
  0% {
    animation-timing-function:ease-in;
  }
  4% {
    transform:scale(1) rotate(0.1deg);  /* IEカクつき対処（rotate） */
  }
  100% {
    transform:scale(1.2) rotate(0.1deg);
  }
}


#mainSlide .slick-list li .txt {
  display:none;
  opacity:0;
  bottom:20px;
}

.no-csstransitions #mainSlide .slick-list li .txt {
  display:block;
  opacity:1;
  bottom:0;
}

.csstransitions #mainSlide .slick-list li.active-zoom .txt {
  display:block;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  overflow:hidden;
  animation:textAnimation 1.5s linear forwards;
}

@keyframes textAnimation {
  0% {
    animation-timing-function:ease-in;
    opacity:0;
    bottom:20px;
  }
  40% {
    opacity:0;
    bottom:20px;
  }
  80% {
    opacity:1;
    bottom:0;
  }
  100% {
    opacity:1;
    bottom:0;
  }
}

#mainSlide li.slide01 .photo { background-image:url(../image/top/slide/01.jpg); }
#mainSlide li.slide02 .photo { background-image:url(../image/top/slide/02.jpg); }
#mainSlide li.slide03 .photo { background-image:url(../image/top/slide/03.jpg); }

#mainSlide li.slide01 .txt { background-image:url(../image/top/slide/01_txt.png?v=1); }
#mainSlide li.slide02 .txt { background-image:url(../image/top/slide/02_txt.png?v=1); }
#mainSlide li.slide03 .txt { background-image:url(../image/top/slide/03_txt.png?v=1); }


/*-----------------------------------------------------------------------------------
  arrow
-----------------------------------------------------------------------------------*/

.mainSlide__arrow .slick-prev:before,
.mainSlide__arrow .slick-next:before {
  content:"";
  display:inline-block;
  width:30px;
  height:30px;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
}

.mainSlide__arrow .slick-next:before { -webkit-transform:rotate(-45deg); transform:rotate(-45deg); }
.mainSlide__arrow .slick-prev:before { -webkit-transform:rotate(135deg); transform:rotate(135deg); }

.lte-ie8 .mainSlide__arrow .slick-prev:before,
.lte-ie8 .mainSlide__arrow .slick-next:before { display:none; }

.mainSlide__arrow .slick-prev,
.mainSlide__arrow .slick-next {
  position:absolute;
  top:50%;
  margin-top:-40px;
  font-size:0;
  color:#fff;
  display:inline-block;
  width:80px;
  height:80px;
  z-index:9;
  background-position:center center;
  background-repeat:no-repeat;
  filter:alpha(opacity=60);
  opacity:0.6;
  -moz-opacity:0.6;
  transition:opacity 0.2s ease;
}

.mainSlide__arrow .slick-prev:hover,
.mainSlide__arrow .slick-next:hover {
  filter:alpha(opacity=100);
  opacity:1;
  -moz-opacity:1;
}

.mainSlide__arrow .slick-prev { left:-80px; transition:left 0.3s ease; }
.mainSlide__arrow .slick-next { right:-80px; transition:right 0.3s ease; }
#mainSlide-warp:hover .mainSlide__arrow .slick-prev,
.lte-ie8 .mainSlide__arrow .slick-prev { left:0; }
#mainSlide-warp:hover .mainSlide__arrow .slick-next,
.lte-ie8 .mainSlide__arrow .slick-next { right:0; }

.lte-ie8 .mainSlide__arrow .slick-prev { background-image:url(../image/icon/prev-white_b.png); }
.lte-ie8 .mainSlide__arrow .slick-next { background-image:url(../image/icon/next-white_b.png); }

@media screen and (max-width:640px) {
  .mainSlide__arrow { display:none; }
}


/*----------------------------------------------------------------------------------------------------

  contents
  
----------------------------------------------------------------------------------------------------*/

.ct-main { min-height:inherit !important; }

@media screen and (max-width:640px) {
  .ct-main { padding-bottom:2rem; }
}


/*----------------------------------------------------------------------------------------------------

  info 空き情報・パンフ
  
----------------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------
  info
-----------------------------------------------------------------------------------*/

#info {
  position:relative;
  box-sizing:border-box;
  text-align:center;
}

#info .headline { margin-top:-0.25em; text-align:left; }
.lte-ie8 #info .headline { margin-top:0; }

#info .l-btn {
  position:absolute;
  right:0;
  top:0;
}

#infoList {
  list-style:none;
  margin-top:25px;
  text-align:left;
}

#infoList li {
  border-bottom:1px solid #dcdcdc;
  padding:0.75em;
  line-height:1.4;
}

#infoList li:first-child {
  border-top:1px solid #dcdcdc;
}

#infoList li:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

#infoList a,
#infoList a:visited { text-decoration:none; }
#infoList a:hover,
#infoList li:hover a { text-decoration:underline; }

#infoList li .date {
  width:9em;
  display:inline-block;
  float:left;
  clear:both;
  margin-right:-9.25em;
}

#infoList li a,
#infoList li .title {
  display:block;
  padding-left:9.25em;
}

.info-error {
  border-top:1px solid #dcdcdc;
  margin-top:25px;
  padding-top:1em;
  text-align:left;
}

@media screen and (max-width:640px) {
  #info .headline { margin-top:0; }
  #info .l-btn {
    position:relative;
    right:inherit;
    top:inherit;
    margin-left:auto;
    margin-right:auto;
    margin-top:2rem;
    font-size:100%;
  }
  #infoList { margin-top:1.5rem; }
}


/*-----------------------------------------------------------------------------------
  空き情報・パンフ
-----------------------------------------------------------------------------------*/

@media screen and (max-width:640px) {
  .ctBtnList {
    padding-bottom:2.5rem;
  }
}


/*----------------------------------------------------------------------------------------------------

  For User
  
----------------------------------------------------------------------------------------------------*/

#for-user-warp {
  background-color:#eee;
}

#for-user {
  width:1112px;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
  position:relative;
}

#for-user .headline {
  padding:0 6px;
}

#for-userSlide {
  list-style:none;
  margin-top:25px;
  overflow:hidden;
}

#for-userSlide li {
  width:266px;
  float:left;
  text-align:center;
  margin:0 6px;
  position:relative;
}

#for-userSlide li a {
  display:block;
  position:relative;
  overflow:hidden;
  background-color:#fff;
}

#for-userSlide li a,
#for-userSlide li a:visited,
#for-userSlide li a:hover { color:#fff; text-decoration:none; }

#for-userSlide li .txt {
  display:block;
  background-color:rgba(13,87,154,0.9);
  color:#fff;
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:0.65em 1em;
  box-sizing:border-box;
  -webkit-transition:background 0.3s ease;
  -moz-transition:background 0.3s ease;
  -ms-transition:background 0.3s ease;
  -o-transition:background 0.3s ease;
  transition:background 0.3s ease;
  z-index:2;
}

.no-rgba #for-userSlide li .txt { background-color:#0d579a; }
#for-userSlide li a:hover .txt { color:#fff; }

#for-userSlide li .txt:before {
  display:block;
  content:"";
  width:100%;
  height:100%;
  position:absolute;
  left:0;
  right:0;
  bottom:-100%;
  background-color:#148cc8;
  -webkit-transition:bottom ease 0.25s;
  -moz-transition:bottom ease 0.25s;
  -ms-transition:bottom ease 0.25s;
  -o-transition:bottom ease 0.25s;
  transition:bottom ease 0.25s;
  z-index:-2;
}

@media screen and (min-width:641px) {
  #for-userSlide li a:hover .txt:before { bottom:0; }
}

#for-userSlide li .photo {
  -webkit-transition:transform ease 0.5s, opacity 0.3s ease;
  -moz-transition:transform ease 0.5s, opacity 0.3s ease;
  -ms-transition:transform ease 0.5s, opacity 0.3s ease;
  -o-transition:transform ease 0.5s, opacity 0.3s ease;
  transition:transform ease 0.5s, opacity 0.3s ease;
}

@media screen and (min-width:641px) {
  #for-userSlide li a:hover .photo {
    -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -o-transform:scale(1.1);
    -ms-transform:scale(1.1);
    transform:scale(1.1) rotate(0.1deg);
    filter:alpha(opacity=60);
    opacity:0.6;
    -moz-opacity:0.6;
  }
}

.preload #for-userSlide li .txt:before,
.preload #for-userSlide li .photo {
  -webkit-transition:none;
  -moz-transition:none;
  -ms-transition:none;
  -o-transition:none;
  transition:none;
}

@media screen and (max-width:640px) {
  #for-user-warp {
    overflow:hidden;
  }
  
  #for-user { width:100%; }
  #for-user .headline { padding:0 1rem; }

  #for-userSlide-warp {
    width:100%;
  }
  
  #for-userSlide {
    margin-top:1.5rem;
    padding-right:1rem;
    font-size:100%;
  }
  
  #for-userSlide li {
    width:25%;
    margin:0 0;
    padding-left:1rem;
  }
}


/*-----------------------------------------------------------------------------------
  arrow
-----------------------------------------------------------------------------------*/

.for-userSlide__arrow .slick-prev:before,
.for-userSlide__arrow .slick-next:before {
  content:"";
  display:inline-block;
  width:12px;
  height:12px;
  border-right:1px solid #0d579a;
  border-bottom:1px solid #0d579a;
}

.for-userSlide__arrow .slick-next:before { -webkit-transform:rotate(-45deg); transform:rotate(-45deg); margin-right:6px; }
.for-userSlide__arrow .slick-prev:before { -webkit-transform:rotate(135deg); transform:rotate(135deg); margin-left:6px; }

.lte-ie8 .for-userSlide__arrow .slick-prev:before,
.lte-ie8 .for-userSlide__arrow .slick-next:before { display:none; }

.for-userSlide__arrow .slick-prev,
.for-userSlide__arrow .slick-next {
  overflow:hidden;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  display:inline-block;
  box-sizing:border-box;
  border:none;
  margin:0;
  outline:none;
  text-align:center;
  text-decoration:none;
  font-size:inherit;
  
  position:absolute;
  top:50%;
  font-size:0;
  color:#fff;
  display:inline-block;
  width:44px;
  height:44px;
  z-index:9;
  border-radius:44px;
  background-position:center center;
  background-repeat:no-repeat;
  background-color:#fff;
  -webkit-transition:background ease 0.2s;
  -moz-transition:background ease 0.2s;
  -ms-transition:background ease 0.2s;
  -o-transition:background ease 0.2s;
  transition:background ease 0.2s;
  text-align:center;
}

.for-userSlide__arrow .slick-prev { left:-55px; }
.for-userSlide__arrow .slick-next { right:-55px; }

.lte-ie8 .for-userSlide__arrow .slick-prev { background-image:url(../image/icon/prev-blue_m.png?v=1); }
.lte-ie8 .for-userSlide__arrow .slick-next { background-image:url(../image/icon/next-blue_m.png?v=1); }
.lte-ie8 .for-userSlide__arrow .slick-prev:hover { background-image:url(../image/icon/prev-white_m.png?v=1); }
.lte-ie8 .for-userSlide__arrow .slick-next:hover { background-image:url(../image/icon/next-white_m.png?v=1); }

.lte-ie8 .for-userSlide__arrow .slick-prev:hover,
.lte-ie8 .for-userSlide__arrow .slick-next:hover {
  background-color:#0a3764;
}
  
@media screen and (min-width:641px) {
  .for-userSlide__arrow .slick-prev:hover:before,
  .for-userSlide__arrow .slick-next:hover:before {
    border-color:#fff;
  }
  
  .for-userSlide__arrow .slick-prev:hover,
  .for-userSlide__arrow .slick-next:hover {
    background-color:#0a3764;
  }
}

@media screen and (max-width:640px) {
  .for-userSlide__arrow .slick-prev,
  .for-userSlide__arrow .slick-next {
    border-radius:0;
  }
  
  .for-userSlide__arrow .slick-prev { left:0; }
  .for-userSlide__arrow .slick-next { right:0; }
}
