@charset "UTF-8";
/* CSS Information ===========
File name:style.css
Description: Tanoshima Special Vol.28 Sunset Night Tour
Date: 2019.4
Contents: *this page only
=============================== */
/* public ====================*/
body{background:url("../img/bk_night.jpg") repeat 0 0;}
.flex{display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;}
.flex--horizon--end{-webkit-justify-content:flex-end; -ms-flex-pack:end; justify-content:flex-end;}
.flex--horizon--ctr{-webkit-justify-content:center; -ms-flex-pack:center; justify-content:center;}
.flex--vertical--end{-webkit-align-items:flex-end; -ms-align-items:flex-end; align-items:flex-end;}
.flex--vertical--ctr{-webkit-box-align:center; -ms-flex-align:center; -webkit-align-items:center; align-items:center;}
.flex--wrap{-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
.flex--direction--reverse{-ms-flex-direction:row-reverse; -webkit-flex-direction:row-reverse; flex-direction:row-reverse;}
/* Micro Clearfix [ IE9 Hack ] */
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf--ie9:before, .cf--ie9:after{content:"";display:table;}}/*IE9*/
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf--ie9:after{clear:both;}}/*IE9*/
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf--ie9{zoom:1;}}/*IE9*/
/* Plan Header =====================*/
.plan__body{width:100%; background:url("../img/awa.png") repeat-y 0 0; background-size:100% auto;}
.plan__wrap{width:100%; position:relative; padding-bottom:40px;}
.plan__line{background:url("../img/line.jpg") repeat-x 0 0; background-size:60px auto; width:100%; height:10px;
-ms-filter:invert(100%); -moz-filter:invert(100%); -webkit-filter:invert(100%); filter:invert(100%);}
.svg--bg{position:absolute; width:100%; height:500px; top:0; left:0; z-index:-1;}
.plan__bg{width:100%; height:100%; max-width:1280px; margin:0 auto 0; padding:0 20px;}
.plan__discription{width:100%; padding:70px 0 0; text-align:center; color:#fff; margin-bottom:60px;}
.plan__tourlead{font-size:2.5rem; margin-bottom:25px; line-height:1.2em;}
.plan__tourlead span{display:inline-block;}
.plan__shopname{font-size:1.25rem; padding:15px 20px; border:solid 1px #fff; display:inline-block; border-radius:40px;}
.plan__shopname span{display:inline-block; margin:0 2px;}
.plan__special{width:100%; margin:0 auto; max-width:1024px;}
/* Plan Info */
.plan__info{width:100%; background:#000; padding:40px 40px 0; color:#fff;}
.plan__info.box--radius{border-radius:20px 20px 0 0;}
.plan__info:last-child{padding-bottom:40px;}
.plan__info__data{width:100%; display:table; border-bottom:solid 1px #ccc;}
.plan__info__data:first-child{border-top:solid 1px #ccc;}
.plan__info__data dt{display:table-cell; border-right:solid 1px #ccc; width:200px; padding:10px; background:#0f001a; text-align:center; color:#dd7!important;}
.plan__info__data dd{display:table-cell; padding:10px; padding:10px;}
.plan__info__data dd span{display:inline-block; margin-right:10px;}
.plan__info__data dd a{color:#fff;}
.plan__info__note{margin-top:40px;}
.plan__info__etc{text-align:right; display:block; margin-bottom:15px;}
.gmap__wrap{width:100%; position:relative; height:auto; max-width:1024px; margin:0 auto;}
.gmap__wrap:before{display:block; content:""; padding-top:40%;}
.gmap__wrap iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}
/* Carousel =====================*/
.view__wrap {display:none;}
.view__wrap.initialized {display:block;}
.view__wrap .slick-list{padding-bottom:20px;}
.view__crs.slick-dotted.slick-slider{margin-bottom:50px;}
.view__crs{width:100%; max-width:1024px; margin:0 auto 0;}
.view__tile{margin:0; box-shadow:0 1px 5px 0 rgba(0,0,0,.5); -moz-box-shadow:0 1px 5px 0 rgba(0,0,0,.5); -webkit-box-shadow:0 1px 5px 0 rgba(0,0,0,.5); border-radius:40px; border:solid 1px #999;}
.view__tile a{display:block; width:100%;}
.view__photo{position:relative; height:auto; width:100%; border-radius:40px;}
.view__photo:before{content:""; display:block; padding-top:64%;}
.view__photo img{position:absolute; top:0; left:0; z-index:1; width:100%; height:100%;}
.view__wrap .slick-prev, .view__wrap .slick-next{z-index:2;}
.view__wrap .slick-prev{left:0px; top:45%;}
.view__wrap .slick-prev:before{content:"\f053"; font-family:"FontAwesome"; background:rgba(0,0,0,.5); color:#fff; width:35px; height:40px; line-height:40px; display:block; border-radius:0 10px 10px 0;}
.view__wrap .slick-next{right:15px; top:45%;}
.view__wrap .slick-next:before{content:"\f054"; font-family:"FontAwesome"; background:rgba(0,0,0,.5); color:#fff; width:35px; height:40px; line-height:40px; display:block; border-radius:10px 0 0 10px;}
.view__wrap .sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
.view__wrap .slick-dots li.slick-active button:before{color:#b8860b;}
.view__wrap .slick-dots li button:before{font-size:1rem; color:#fff;}
.view__wrap .slick-dots li{margin:0 5px;}
/* Overview =====================*/
.plan__overview__wrap{width:100%; background:url("../img/awa_50.png") repeat-y 0 0; background-size:100% auto; padding:60px;}
.plan__overview{width:100%; max-width:1024px; margin:0 auto 50px; color:#ccc;}
.plan__overview__lead{font-size:1.125rem; line-height:1.7em; margin-bottom:40px;}
.plan__overview__lead span{display:block; margin-bottom:20px;}
.plan__overview__lead span:last-child{margin-bottom:0;}
.plan__overview__main{width:100%; max-width:1024px; margin:0 auto 40px; border:solid 2px #ccc;}
.plan__overview__sub{width:100%; border:solid 1px #ccc; margin-bottom:40px;}
.plan__overview__sub li{width:25%; border:solid 1px #ccc;}
.plan__overview__sub li span{display:block; width:100%; height:auto; position:relative;}
.plan__overview__sub li span:before{display:block; content:""; padding-top:70%;}
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.plan__overview__sub li{float:left;}}/*IE9*/
.plan__overview__copyright{font-size:0.75rem; text-align:right; border-bottom:solid 1px #ccc; padding-bottom:10px;}
.plan__overview__copyright span{display:inline-block;}
/* Anchor =====================*/
.plan__nav{width:100%; max-width:800px; margin:0 auto 0;}
.plan__nav li{width:25%; margin-bottom:25px;}
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.plan__nav li{float:left;}}/*IE9*/
.plan__nav li a{display:block; width:100%; padding:10px;}
.plan__nav__icon{display:block; position:relative; width:100%; height:auto; border-radius:50%; box-shadow:0 1px 5px 0 rgba(0,0,0,.5); -moz-box-shadow:0 1px 5px 0 rgba(0,0,0,.5); -webkit-box-shadow:0 1px 5px 0 rgba(0,0,0,.5);}
.plan__nav__icon:before{content:""; display:block; padding-top:100%;}
.plan__nav__icon img{position:absolute; top:0; left:0; width:100%; height:100%;}
.plan__nav li p{position:absolute; bottom:-20px; left:0; z-index:2; width:100%; text-align:center; line-height:1.2em;}
.plan__nav li p em{background:rgba(255,255,255,.8); display:block; width:96%; padding:4px 0; font-size:0.6875rem; font-style:normal; margin:0 auto; border:solid 1px #ccc; border-radius:4px;}
.plan__nav li p em span{display:inline-block; padding:0 2px;}
/* Visual =====================*/
.visual{width:100%; background:url("../img/bg_night.jpg") no-repeat center bottom; background-size:cover; height:100vh;}
.visual__inner{width:100%; position:relative;}
.visual__title{width:100%; padding:40px; text-align:right;}
.visual__title img{max-width:768px;}
/* Caution =====================*/
.caution{width:100%; background:#0f001a; color:#fff;}
.caution__inner{width:100%; max-width:1024px; margin:0 auto; padding:40px 0;}
.caution__inner h3{font-size:1.25rem; margin-bottom:20px;}
/* Responsive =====================*/
@media (max-width:1024px){
  .plan__bg{padding:0 30px;}
  .caution__inner{padding:20px;}
  .caution__inner h3{margin-bottom:10px;}
  .plan__tourlead{font-size:1.875rem;}
  .plan__shopname{font-size:1rem;}
  .plan__nav{width:100%;}
  .plan__discription{padding-top:40px; margin-bottom:40px;}
  .plan__overview__wrap{padding:30px;}
  .plan__overview__main,.plan__overview__sub{margin-bottom:20px;}
  .plan__overview__lead{font-size:1rem; margin-bottom:20px;}
  }
@media (max-width:880px){
  .plan__tourlead{font-size:1.5rem;}
  }
@media (max-width:768px){
  .plan__nav li{width:33.33333333%; margin-bottom:20px;}
  .plan__overview{margin-bottom:25px;}
  .visual__title{padding:20px;}
  }
@media (max-width:700px){
  .plan__info__data,.plan__info__data dt,.plan__info__data dd{display:block; width:100%;}
  .plan__info__data dt{border-right:0; text-align:left;}
  .caution__inner h3{font-size:1rem;}
  }
@media (max-width:550px){
  .plan__info{padding:20px 20px 0;}
  .plan__info__note{margin-top:20px;}
  .gmap__wrap:before{padding-top:55%;}
  .plan__shopname{width:100%; padding:10px;}
  .view__tile,.view__photo{border-radius:20px;}
  .plan__nav{width:100%;}
  .plan__overview__wrap{padding:20px;}
  .plan__overview__sub li{width:50%;}
  .plan__overview__lead{font-size:0.875rem;}
  }
@media (max-width:450px){
  .plan__bg{padding:0 15px;}
  .plan__tourlead{font-size:1.375rem;}
  .view__crs.slick-dotted.slick-slider{margin-bottom:40px;}
  .plan__nav li{width:50%;}
  .plan__nav li p em{font-size:0.625rem;}
  .visual{height:80vh;}
  }
@media (max-width:360px){
  .plan__discription{padding-top:25px; margin-bottom:25px;}
  .plan__tourlead{font-size:1.25rem;}
  .gmap__wrap:before{padding-top:70%;}
  .plan__info{padding:20px 10px 0;}
  }
@media screen and (orientation:landscape) {
  .visual__title{padding-left:58.7761675%;}
  }

span.en{font-size:70% !important;display:block;font-weight:normal;}