html{font-family: "新ゴ R", "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
body, h1{  margin:0;  }
a{  text-decoration: none;  }
a:link { color: #222; }
a:visited { color: #222; }
a:hover { color: #888; }
a:active { color: #888; }
.no-border{  border:0;  }
img{object-fit: cover;}

input{border:1px solid #888;}

#dialog-back{
  background-color:#000000;
  position:absolute;
  left:0px;
  top:0px;
  min-height:100%;
  min-width:100%;
  width:100%;
  height:100%;
  filter:alpha(opacity=50);
  -moz-opacity:0.5;opacity:0.5;
  z-index:99998;
  display:none;

  position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 9999; overflow-y: scroll; display: none;
}
.dialog{
  position:absolute;
  top:calc(50% - 175px);
  height:350px;
  width:100%;
  background-color:white;
  z-index:99999;
  text-align:center;
  display:none;
}
#register-dialog{
  height:400px;
}
.dialog-container{
  width:500px;
  margin:20px auto;
}
.dialog input{
  border-radius:5px;
  padding:15px;
}
.dialog input[type="email"], .dialog input[type="password"]{
  width:80%;
  margin:0 10% 10px 10%;
}
.dialog input[type="submit"]{
  width:200px;
  margin:0 10%;
}
.dialog-container > div{
  text-align:center;
}
.caution{
  color:red;
  font-size:0.95em;
}
.dialog-container p{
  font-size:0.9em;
  color:#666;
}
.dialog-container p:hover{
  cursor:pointer;
}





.header{
  margin:auto;
  max-width:1200px;
  height:95px;
  clear:both;
}
.header > div{
  float:left;
  height:95px;
}
.title{
  min-width:300px;
  padding:1px 0;
}
.title img{
  width:180px;
  top:-15px;
  padding-left:10px;
  z-index:99;
  margin-top:-5px;
}
.search-container{
  width:calc(100% - 500px);
  height:95px;
}
.search-inner{
  padding-top:calc((95px - 2.2em) / 2);
}
.navigation{
  min-width:170px;
  text-align:right;
  height:95px;
}
.navigation-inner{
  padding-top:calc((95px - 2.4em) / 2);
}
.link-button{
  display:inline-block;
  padding:0.4em 1em;
  border:1px solid #e3e3e3;
  border-radius:5px;
  color: #666;
  font-size:0.95em;
}
.link-button:hover{
  cursor:pointer;
  background-color:#fefefe;
}
.search{
  position: relative;
  box-sizing: border-box;
  display: block;
  padding: 3px 10px;
  border-radius: 5px;
  border:1px solid #f1f1f1;
  height: 2.4em;
  width:calc(100% / 1.5);
  margin:auto;
  min-width:150px;
  max-width:300px;
  overflow: hidden;
  background: #fafafa;
}
.search input[type="text"]{
  border: none;
  height: 2.4em;
  width:100%;
  background: #fafafa;
}
.search input[type="text"]:focus {
  outline: 0;
}
.search input[type="submit"]{
  cursor: pointer;
  font-family: FontAwesome;
  font-size: 1.3em;
  border: none;
  background: none;
  color: #666;
  position: absolute;
  height: 2.4em;
  right: 8px;
  top: -10px;
  outline : none;
}
.search ::-webkit-input-placeholder {
  color: #666;
  font-size:1.2em;
  padding-left:10px;
}




.bar{
  height:70px;
  width:100%;
  margin-top:2px;
  border-top:1.2px solid #f2f2f2;
  border-bottom:1.2px solid #f2f2f2;
  clear:both;
}
.bar-inner{
  margin:auto;
  max-width:1200px;
  height:70px;
  clear:both;
}
.bar-inner > div{
  float:left;
  padding-top:calc((70px - 2.4em)/2);
}
.location{
  min-width:200px;
  width:60%;
  padding-left:30px;
}
.number{
  min-width:100px;
  width:calc(40% - 70px);
  text-align:right;
  padding-right:30px;
}
#location-name, #location-number{
  font-size:1.2em;
  color:#666;
  margin-left:15px;
}







.slider{
    opacity: 0;
    transition: 3s;
}
.small-slider{
    opacity: 0;
    transition: 3s;
}
.small-slider::before{
  clear:both;
}
.small-slider::after{
  clear:both;
}
.slick-initialized{
    opacity: 1
}


.slider-container{
  margin:10px auto 0;
  max-width:1200px;
}
.slider-box{
  border:1px solid #e3e3e3;
}
.slider-box > div{
  float:left;
  width:100%;
}
.slider img{
  width:100%;
  height:450px;
  z-index:100;
}
.slider .slider-text{
  position:absolute;
  color:white;
  top:320px;
  padding-left:30px;
  z-index:999;
}
.slider .slider-text-inner{
  height:calc(2.5em + 5px);
}
.slider .slider-text-inner > a > h4{
  font-size:1.6em;
  bottom:0px;
  margin-bottom:0px;
  font-weight:500;
}
.slider .slider-text-inner > a > div{
  font-size:0.85em;
  color:#efefef;
  margin-top:5px;
  font-weight:600;
  word-wrap: break-word;
  max-width:90%;
}

.slider .slider-text-inner > a > div.returned{display:none;}
.slider .slider-text-inner > a > div.not-returned{display:block; max-width:780px}

.slider .slider-text-inner a:link { color: #efefef; }
.slider .slider-text-inner a:visited { color: #efefef; }
.slider .slider-text-inner a:hover { color: #efefef; }
.slider .slider-text-inner a:active { color: #efefef; }

.slider-button{
  display:none;
}

.small-slider-header > div, .new-header > div{
  float:left;
}
.small-slider-header h3{
  padding-top:15px;
  font-size:1.4em;
  width:400px;
}
.small-slider-header h3 > i{
  margin:0 10px;
}
.small-slider-title{
  width:260px;
}
.small-slider-button{
  width:calc(100% - 300px);
  text-align:right;
  z-index:999;
}
.small-slider-button button{
  margin:45px 0 0 0;
  padding:8px 20px;
  background-color:white;
  color:blue;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.slider-arrow{
  border:1px solid #dedede;
}
.small-slider-container{
  margin:30px auto 0;
  width:100%;
  clear:both;
}
.small-slider{
  width:100%;
  z-index:199;
}
.small-slider.slick-slider > div{
  width:100%;
}
.small-slider > div{
  float:left;
  border-radius:8px;
  clear:both;
  width:260px;
}
.small-slider img{
  width:260px;
  height:140px;
  border-top-left-radius:8px;
  border-top-right-radius: 8px;
}
.small-slider-box{
  width:260px !important;
  margin:0 5px;
}
.small-slider .slider-text{
  clear:both;
  height:5em;
  width:100%;
}
.small-slider .slider-text-inner{
  padding:0 15px;
}
.small-slider .slider-text-inner > p{
  font-size:0.75em;
  color:#666;
  margin-top:0;
  margin-bottom:0;

      overflow:hidden;
      white-space:nowrap;
      text-overflow:ellipsis;
}
.small-slider .slider-text-inner > h4{
  font-size:0.95em;
  font-weight:400;
  margin-bottom:3px;
  margin-top:8px;
}
.slider-text > .price{
  display:block;
  margin:10px 0 0 0;
  border-top:1px dashed #ccc;
  font-size:0.65em;
  width:calc(100% - 15px);
  color:#666;
  padding:8px 0 0 15px;

      overflow:hidden;
      white-space:nowrap;
      text-overflow:ellipsis;
}
.small-slider > .slick-list > .slick-track > .slick-slide{
  width:260px;
  margin:0 5px;
  border:1px solid #e3e3e3;
  border-radius:8px;
}
.small-slider > .slick-list > .slick-track > .slider-box{
  width:260px !important;
  height:230px !important;
}
.small-slider > .slick-list > .slick-track {
  height:232px !important;
}
.small-slider > .slick-list{
  height:232px !important;
}
.xsmall-slider > .slick-list > .slick-track > .slick-slide {
  height:200px !important;
}
.pickup-container > .slick-list, .new-container > .slick-list{
  height:360px !important;
}
.pickup-container > .slick-list > .slick-track, .new-container > .slick-list > .slick-track{
  height:350px !important;
}
.pickup .slick-list, .new .slick-list{
  height:240px !important;
}





.result-container{
  margin:30px auto 0;
  max-width:800px;
  width:100%;
  height:calc(240px + 5em)
  overflow:auto;
}
.result-inner{
  width:100%;
  height:calc(240px + 5em)
  z-index:199;
  overflow:auto;
}
.result-inner > div{
  float:left;
  border-radius:8px;
  width:380px;
  height:calc(240px + 5em)
}
.result-inner img{
  width:380px;
  height:220px;
  border-top-left-radius:8px;
  border-top-right-radius: 8px;
}
.result-box{
  width:390px;
  margin:0 5px 10px;
  border:1px solid #e3e3e3;
}
.result-inner .slider-text{
  clear:both;
  height:5em;
  width:100%;
}
.result-inner .slider-text-inner{
  padding:0 15px;
}
.result-inner .slider-text-inner > p{
  font-size:0.85em;
  color:#666;
  margin-top:0;
  margin-bottom:0;

      overflow:hidden;
      white-space:nowrap;
      text-overflow:ellipsis;
}
.result-inner .slider-text-inner > h4{
  font-size:1em;
  font-weight:400;
  margin-bottom:3px;
  margin-top:8px;
}
.result-inner .slider-text .price{

      overflow:hidden;
      white-space:nowrap;
      text-overflow:ellipsis;
}





.link-container{
  margin:50px auto 0;
  padding-top:8px;
  width:100%;
  height:200px !important;
  clear:both;
}
.link-inner{
  clear:both;
  height:200px;
}
.link-inner > div{
  float:left;
}
.link-header h3{
  padding-top:15px;
  font-size:1.4em;
}
.link-header h3 > i{
  margin:0 10px;
}
.link-image-container{
  overflow:hidden;
  width:145px;
  height:145px;
  border-radius:5px;
}
.link-image-container img{
  width:145px;
  height:145px;
  border-radius:5px;
	display: block;
	transition: 0.8s;
}
.link-image-container img:hover {
	transform: scale(1.04, 1.04);
}
.link-text-container{
  font-size:1em;
}
.link-box{
  width:145px !important;
  margin:10px 5px 20px 5px;
}
.line-inner > .slick-list{
  max-width:100%;
}
.line-inner > .slick-list > .slick-track{
  max-width:100%;
}







.footer{
  width:100%;
  background-color:#efefef;
  margin: 400px 0 0 0;
  padding:30px 0 0 0 ;
  height:600px;
}
.footer-container{
  width:100%;
  max-width:600px;
  clear:both;
  margin:30px auto 0;
}
.footer-title-logo img{
  width:220px;
  height:auto;
}
.footer-box img{
  width:150px;
}
.footer-inner > div{
  float:left;
  width:100%;
}
.footer-box p{
  font-weight:700;
}
.footer-box > div > a{
  font-size:0.9em;
  font-weight:300;
}











.big-image-container{
  width:100%;
  height:350px;
  margin:0 0;
}
.big-image-container img{
  width:100%;
  height:500px;
  z-index:10;
}

.main-container{
  max-width:1200px;
  margin:auto;
  overflow:auto;
  clear:both;
}
.main-container > div{
  float:left;
}

.left-container{
  max-width:860px;
  width:calc(100% - 340px);
}


.title-container{
  z-index:20;
}
.title-container h1{
  font-size:3em;
  margin-top:10px;
  margin-bottom:15px;
}
.experience-tags > span{
  border:1px solid white;
  color:white;
  padding:8px 13px;
  background-color:#00a0d0;
  border-radius:5px;
}

.frame{
  border:1.5px solid #00a0d0;
  border-radius:15px;
  padding:30px 20px;
  position:relative;
}
.frame.no-border{
  border:0;
  border-radius:15px;
  padding:30px 20px;
  position:relative;
}
.frame > .frame-title {
  position: absolute;
  display: inline-block;
  top: -13px;
  left: 35px;
  padding: 0 9px;
  line-height: 1;
  font-size: 19px;
  background: #FFF;
  color: #00a0d0;
  font-weight: bold;
}
.frame > .frame-title > i{
  margin-right:10px;
}
.frame table th{
  text-align:center;
  font-size:1.5em;
  padding: 10px 15px;
}
.frame table td{
  font-size:1.1em;
}

.description-container{
  margin-top:20px;
}

.detail-container{
  margin-top:30px;
}

.content-container{
  margin-top:30px;
}

.necessary-container{
  margin-top:30px;
}

.precaution-container{
  margin-top:30px;
}

.place-container{
  margin-top:30px;
}

.image-container{
  margin-top:30px;
  padding:30px 0px;
}
.image-container ul{
  padding-left:10px;
}
.images-slider img{
  width:220px;
  height:200px;
}

#google-map{
   width:400px;
   height:300px;
}

.right-container{
  width:310px;
  padding:110px 0 0 30px;
}

.reservation-container{
  font-size:1.3em;
}

.reservation-container select{
  font-size:1em;
  padding:10px 20px 15px;
  width:240px;
}

.reservation-container input[name="reserve"]{
  font-size:1em;
  padding:10px 30px 15px;
  width:260px;
  background-color:#f44336;
  color:white;
  border:0;
  margin-top:20px;
  border-radius:5px;
}

.reservation-container > hr{
  margin:20px 0;
  display:block;
}

#amount-price{
  margin-left:10px;
}












.place-basic-info-container{
  width:90%;
  margin:0 5%;
}
.place-info-container{
  width:90%;
  margin:0 5%;
  font-size:1em;
}

#small-google-map{
   width:700px !important;
   height:300px;
}

.place-info-container > div > div{
  margin:5px 0;
}
.place-info-container > div > div > b{
  margin-top: 10px;
  display:block;
}
.place-info-container > div > div > i{
  margin:0 10px;
}

.place-image-container{
  margin-top:30px;
  padding:30px 0px;
}
.placeimages-slider img{
  width:210px;
  height:190px;
}
.place-image-container > .images-slider{
  padding-left:30px;
}

.experience-list-container{
  width:100%;
  overflow:auto;
  clear:both;
  padding:0px 5px 30px 0px !important;
}
.experience-box{
  border-radius:8px;
  border:1px solid #e3e3e3;
  height:150px;
  margin:5px 20px 0 0 ;
}
.experience-box > div{
  float:left;
}
.experience-box .experience-image{
  width:200px;
  height:150px;
}
.experience-box .experience-image img{
  width:200px;
  height:150px;
  border-top-left-radius:8px;
  border-bottom-left-radius:8px;
}
.experience-box .experience-info{
  width:calc(100% - 280px);
  padding-left:20px;
  height:150px;
}
.experience-box .experience-title{
  font-size:1.2em;
  font-weight:600;
  height:30px;
}
.experience-box .experience-description{
  font-size:0.75em;
  color:#666;
  padding-left:10px;
  height:90px;
}
.experience-box .experience-detail{
  font-size:0.7em;
  padding-top:10px;
  height:30px;
}
.experience-box .experience-detail > i{
  margin:0 5px;
}

.experience-box-vertical{
  display:none;
}








#customer,#register_info,#do_pay,#reserve_complete{
  font-size:1em;
  padding:10px 30px 15px;
  width:400px;
  background-color:#f44336;
  color:white;
  border:0;
  margin-top:20px;
  text-align:center;
  border-radius:5px;
  cursor:pointer;
}
#customer:disabled,#register_info:disabled,#do_pay:disabled,#reserve_complete:disabled{
  background-color:#aaa;
  cursor:not-allowed;
}

.big-narrow-image-container{
  width:100%;
  height:300px;
  margin:0 0;
}
.big-narrow-image-container img{
  width:100%;
  height:300px;
  z-index:10;
}

.pay-info-container{
  width:100%;
}
.pay-info-inner{
  width:500px;
  margin:auto;
}
.pay-info-inner select{
  font-size:1em;
  padding:10px 20px 15px;
  width:140px;
}
.pay-info-inner{
  width:500px;
}
.pay-info-inner table {
  border-collapse: collapse;
}
.pay-info-inner table td,.pay-info-inner table th{
  height:2.5em;
  font-size:1.1em;
}
.total-price{
  text-align:right;
  font-weight:600;
  font-size:1.3em;
}
.pay-info-inner table th{
  padding:0 20px;
  text-align:left;
}
.pay-info-inner table td:first-child{
  text-align:center;
}
.pay-info-inner h2{
  margin:30px 0 30px 0;
}

.pay-information-table td{
    text-align:left !important;
}
.pay-information-table input{
    padding-left:20px;
    border-radius:5px;
    padding:10px 15px;
    border:1px solid #888;
    margin-left:40px !important;
}
.amount-price-row td, .amount-price-row th{
  border-top:2px double #333;
}
.amount-price-row{
  text-align:center;
  font-weight:600;
  font-size:1.3em;
}

.pay-login-container input{
  border-radius:5px;
  padding:15px;
}
.pay-login-container input[type="email"], .pay-login-container input[type="password"]{
  width:80%;
  margin:0 10% 10px 10%;
}
.pay-login-container input[type="submit"]{
  width:200px;
  margin:0 10%;
}





#payjp_checkout_box > input[type="button"]{
  font-size:1.15em !important;
}





.mypage-container{
    width:100%;
}
.mypage-container > div{
    width:100%;
}
.mypage-container > .menu-container > input, .mypage-container #update_info{
    font-size:1em;
    padding:10px 30px 15px;
    width:200px;
    background-color:#00a0d0;
    color:white;
    border:0;
    margin-top:20px;
    text-align:center;
    border-radius:5px;
    cursor:pointer;
}
.mypage-container > .menu-container{
  margin-bottom:25px;
}
.update-info-container > table{
  margin:auto;
}
.update-info-container > table td{
  padding:10px;
}
.update-info-container{
  text-align:center;
}
.mypage-container .experience-list-container{
  width:100%;
  overflow:auto;
  clear:both;
  padding:0px 5px 30px 0px !important;
}
.mypage-container .experience-box{
  border-radius:8px;
  border:1px solid #e3e3e3;
  height:250px;
  margin:5px 20px 0 0 ;
}
.mypage-container .experience-box > div{
  float:left;
}
.mypage-container .experience-image{
  width:350px;
  height:250px;
}
.mypage-container .experience-image img{
  width:350px;
  height:250px;
  border-top-left-radius:8px;
  border-bottom-left-radius:8px;
}
.mypage-container .experience-info{
  width:calc(100% - 380px);
  padding-left:20px;
  height:250px;
}
.mypage-container .experience-title{
  font-size:1.2em;
  font-weight:600;
  height:30px;
  padding-top:10px;
}
.mypage-container .experience-description{
  font-size:0.9em;
  padding:10px;
  color:#666;
  padding-left:10px;
  height:90px;
}
.paied{
  display:inline-block;
  padding:0.4em 1em;
  border-radius:5px;
  margin-left:10px;
  color: #666;
  background-color:#f44336;
  color:white;
  font-size:0.8em;
}
#cancel_complete{
  font-size:1em;
  padding:10px 30px 15px;
  width:400px;
  background-color:#f44336;
  color:white;
  border:0;
  margin-top:20px;
  text-align:center;
  border-radius:5px;
  cursor:pointer;
}
.mypage-container > div > table{
    width:500px;
    margin:auto;
}
.mypage-container > div > table td{
    padding:10px 0;
}



.review{
  display:inline-block;
  padding:0.4em 1em;
  border-radius:5px;
  margin-left:10px;
  background-color:#00a0d0;
  color:white;
  font-size:0.8em;
  cursor:pointer;
}
.reviewed{
  display:inline-block;
  padding:0.4em 1em;
  border-radius:5px;
  margin-left:10px;
  background-color:#00a0d055;
  color:white;
  font-size:0.8em;
  cursor:not-allowed;
}

.selected-star{
  color:gold;
}
#review_complete,#reserve_complete_prev,#reserve_complete_paypay{
  font-size:1em;
  padding:10px 30px 15px;
  width:400px;
  background-color:#f44336;
  color:white;
  border:0;
  margin-top:20px;
  text-align:center;
  border-radius:2px;
  cursor:pointer;
}
#reserve_complete_paypay{
background-color:#E4007F;
}
#total{
  margin-left:10px;
}
.review-container table td:first-child{
  text-align:center;
}
.review-container table th{
  padding:5px
}





.pay-phase-container {
  width:100%;
  overflow:auto;
  margin-top:10px;
}
.pay-phase-container > div{
  float:left;
}
.pay-phase-container > .current-phase{
  color:#f44336;
  font-weight:700;
}
.pay-phase-container i{
  margin:0 10px;
}

input[name="coupon"]{
  padding:10px;
  border-radius:5px;
}



#back-to-mypage{
    font-size:1em;
    padding:10px 30px 15px;
    width:200px;
    background-color:#00a0d0;
    color:white;
    border:0;
    margin-top:20px;
    text-align:center;
    border-radius:5px;
    cursor:pointer;
}













.little-slider > div{
  float:left;
  border-radius:8px;
  clear:both;
  width:150px;
  height:calc(240px + 5em)
}
.little-slider img{
  width:150px;
  height:180px;
  border-top-left-radius:8px;
  border-top-right-radius: 8px;
}
.little-slider > .small-slider-box{
  width:150px;
  margin:0 5px;
}
.little-slider .slider-text{
  clear:both;
  height:3em;
  width:100%;
}
.little-slider .slider-text-inner{
  padding:0 15px;
}
.little-slider .slider-text-inner > p{
  font-size:0.75em;
  color:#666;
  margin-top:0;
  margin-bottom:0;
}
.little-slider .slider-text-inner > h4{
  font-size:0.9em;
  font-weight:400;
  margin-bottom:0px;
  margin-top:8px;
}

.little-slider .slider-text > .price{
  display:block;
  margin:10px 0 0 0;
  border-top:1px dashed #ccc;
  font-size:0.65em;
  width:calc(100% - 15px);
  color:#666;
  padding:8px 0 0 15px;
}
.little-slider > .slick-list > .slick-track > .slick-slide{
  width:150px !important;
  margin:0 5px;
  border:1px solid #e3e3e3;
  border-radius:8px;
  height:220px;
}
.little-slider > .slick-list > .slick-track > .slick-slide {
  height:180px;
}
.category-container{
  margin-top:0 !important;
}









.area-wrapper{
  margin:-10px auto 0;
  max-width:1200px;
  width:100%;
}
.area-container{
  padding-top:100px;
}
.area-container > div{
  float:left;
}
.area-container > div > a{
  display:block;
  width:100%;
  height:100%;
}
.area-container > div > a > span{
  padding:15px 25px;
  border:1px solid #eee;
  border-radius:8px;
  color:#555;
  margin:2px 5px;
}
.area-container > div > a > span:hover{
  background-color:#e3e3e3;
}








.copyright-container{
  font-size:0.8em;
  color:#666;
}
.copyright-container > div > div{
  padding-top:40px;
}









.super-little-slider > div{
  float:left;
  border-radius:8px;
  clear:both;
  width:140px;
  height:calc(110px + 5em)
}
.super-little-slider img{
  width:140px;
  height:90px;
  border-top-left-radius:8px;
  border-top-right-radius: 8px;
}
.super-little-slider > .small-slider-box{
  width:140px;
  margin:0 5px;
}
.super-little-slider .slider-text{
  clear:both;
  height:3em;
  width:100%;
}
.super-little-slider .slider-text-inner{
  padding:0 15px;
}
.super-little-slider .slider-text-inner > p{
  font-size:0.7em;
  color:#666;
  margin-top:0;
  margin-bottom:0;
}
.super-little-slider .slider-text-inner > h4{
  font-size:1em;
  font-weight:400;
  margin-bottom:3px;
  margin-top:8px;
}

.super-little-slider .slider-text > .price{
  display:block;
  margin:10px 0 0 0;
  border-top:1px dashed #ccc;
  font-size:0.65em;
  width:calc(100% - 15px);
  color:#666;
  padding:8px 0 0 15px;
}
.super-little-slider > .slick-list > .slick-track > .slick-slide{
  width:140px !important;
  margin:0 5px;
  border:1px solid #e3e3e3;
  border-radius:8px;
  height:200px;
}
.super-little-slider > .slick-list > .slick-track > .slick-slide {
  height:130px;
}
.super-little-slider > .slick-list  {
  height:140px !important;
}
.emotion-container{
  height:140px !important;
}

.detail-container{
  display:block;
}
.simple-detail-container{
  display:none;
}
.read-more-container{
  display:none;
}
.right-container, .image-container, .place-container,.necessary-container,.precaution-container{
  display:block;
}


.full-caution{
  color:white;
  font-weight:700;
  font-size:1.1em;
  background-color:red;
  padding:40px 0;
  text-align:center;
  margin:20px 0;
}

.jump{
    animation:jump 5s infinite;
    -webkit-animation:jump 5s infinite;
    -moz-animation:jump 5s infinite;
}
@keyframes jump{
    0%{transform:translate(0,0px);}
    3%{transform:translate(0,-20px);}
    5%{transform:translate(0,0px);}
    6%{transform:translate(0,-5px);}
    7%{transform:translate(0,0px);}
    100%{transform:translate(0,0px);}
}
@-webkit-keyframes jump{
    0%{-webkit-transform:translate(0,0px);}
    3%{-webkit-transform:translate(0,-20px);}
    5%{-webkit-transform:translate(0,0px);}
    6%{-webkit-transform:translate(0,-5px);}
    7%{-webkit-transform:translate(0,0px);}
    100%{-webkit-transform:translate(0,0px);}
}
@-moz-keyframes jump{
    0%{-moz-transform:translate(0,0px);}
    3%{-moz-transform:translate(0,-20px);}
    5%{-moz-transform:translate(0,0px);}
    6%{-moz-transform:translate(0,-5px);}
    7%{-moz-transform:translate(0,0px);}
    100%{-moz-transform:translate(0,0px);}
}

.course-place-img{
  width:100%;
  height:300px;
}
.place-container{
  max-width:100%;
}
.images-row-slider img{
  width:220px;
  height:200px;
}
.couse-image-container{
  margin-top:-70px;
}



.random > .slick-list{
  height:270px !important;
}
.random > .slick-list > .slick-track{
  height:270px !important;
}
.random > .slick-list > .slick-track > .slick-slide img{
  width:235px;
  height:120px;
  border:none;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.random > .slick-list > .slick-track > .slick-slide {
  border:none !important;
}





.pickup-container{
  height:calc(240px + 4em);
  margin-top:0;
  padding-top:0;
}

.nearby-container{
   margin-top:0px;
   height:360px;
}

.resemble-container{
   margin-top:0px;
   height:360px;
}

.small-slider.nearby > .slick-list > .slick-track > .slick-slide{
  height:230px;
}
.small-slider.resemble > .slick-list > .slick-track > .slick-slide{
  height:230px;
}



.title-short{
  min-width:300px;
  padding:0 0 1px 0;
}
.title-short img{
  width:180px;
  top:-15px;
}
.search-container-short{
  width:calc(100% - 550px);
  height:95px;
}
.navigation-short{
  min-width:250px;
  text-align:right;
  height:95px;
}

#register{
  background-color:#E4007F;
  color:white;
}
#register:hover{
  background-color:#0068B7;
}

.header-line{
content:"";
display:block;
height:1px;
width:100%;
	background:-webkit-gradient(linear, left top, right bottom, from(#E4007F), color-stop(0.2, #F5BB1C),color-stop(0.4, #0068B7),color-stop(0.6, #F39800),color-stop(0.8, #009944),  to(#1D2088));
	background:-moz-linear-gradient(left, #E4007F, #F5BB1C,#0068B7,#F39800,#009944,#1D2088);
	background:linear-gradient(left, #E4007F, #F5BB1C,#0068B7,#F39800,#009944,#1D2088);
  z-index:99999;
}
#header-container{
    position:fixed;
    top:0;
    z-index:999;
    width:100%;
    background-color:white;
}
body{
  margin-top:105px;
}

.title-short{
  min-width:230px;
}
.search-container-short{
  width:240px;
}
.navigation-short{
  min-width:200px;
}
.jump-container{
  width:340px;
  height:95px;
}
.jump-container > a{
  display:inline-block;
  height:95px;
  font-size:1em;
  margin:0 10px;
  padding-top:calc(95px / 2 - 0.7em);
}
@media (max-width: 1030px) {
.jump-container > a{
  font-size:0.85em;
  margin:0 5px;
}
.jump-container{
  width:270px;
  height:95px;
}
.search-container{
  width:220px;
}
}
@media (max-width: 945px) {
    .jump-container{ display:none; }
}





table.access-guide-table td{
  font-size:80%;
}








.destination {
  clear:both;
  margin:25px 10px 20px;
}
.destination span{
  background-color:#E4007F;
  color:white;
  border-radius:20px;
  font-size:120%;
  padding:15px 25px;
  clear:both;
}

.destination-wrapper{
  clear:both;
  overflow:auto;
}
.list-wrapper{
  width:100%;
  max-width:1050px;
  margin:0 auto 150px;
}
.list-container{
  width:100%;
  overflow-y:auto;
}

.list-item{
  width:32%;
  margin:0.3%;
  float:left;
  height:280px;
  border:2px solid #e3e3e3;
  border-radius:6px;
  box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
}
.list-item:hover{
  border:2px solid #E4007F;
  cursor:pointer;
  box-shadow: 0px 2px 10px rgba(0,0,0,0.4);
}
.list-image{
  width:100%;
  height:100%;
  position:relative;
  background-size: cover;
  border-radius:6px;
  background-repeat: none;
}
.list-image img{
  width:100%;
  border-radius:6px;
  height:100%;
}
.list-title{
  position:absolute;
  display:block;
  top:-0px;
  color:white;
  width:100%;
  padding:7px 5px;
  text-shadow: 1px 2px 2px #555555;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.list-description{
  height:100px;
}
.list-description > div{
  height:30px;
}
.list-description > div > span{
  font-size:85%;
  max-height:14px;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}
.list-description-text{
  font-size:80%;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  line-height:30px;
  padding:5px;
}
.descriotion-title{
  padding:5px 10px;
  background-color:#E4007F;
  color:white;
  font-weight:700;
  border-radius:5px;
  margin:0 10px;
}











.map-wrapper{
  width:100%;
  height:100%;
  margin:0 auto 250px;
}
.map-wrapper input[type="text"]{
  padding:15px 15px;
  border-radius:8px;
  font-size:1.1em;
  margin:10px;
  width:250px;
}
.map-wrapper button{
  padding:15px 25px;
  border-radius:8px;
  border:none;
  font-size:1.1em;
  margin:10px;
  cursor:pointer;
}

.subtitle{
  font-size:1.4em;
  width:100%;
  text-align:center;
}

.mini-map{
  width:100%;
  height:350px;
  margin-bottom:15px;
}

.floating-buttons{
  position:fixed;
  bottom:0;
  left:0;
  height:80px;
  padding-bottom:10px;
  width:100%;
  color:white;
  font-size:16px;
  line-height:70px;
}

.floating-buttons > table{
  height:100px;
  width:100%;
}
#route_img_preview{
  max-width:100%;
}

.floating-buttons > table td{
  width:33%;
  margin:0;
  text-align:center;
  background-color:#E4007F;
  color:white;
  cursor:pointer;
}
td.disable{
  background-color:#a1a1a1 !important;
  cursor:not-allowed !important;
}
.floating-buttons a{  text-decoration: none;  }
.floating-buttons a:link { color: white; }
.floating-buttons a:visited { color: white; }
.floating-buttons a:hover { color: white; }
.floating-buttons a:active { color: white; }


.map-inner{
  text-align:center;
}
.full-route{
  width:100%;
  height:500px;
}


.floating-post{
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  height:70px;
  line-height:70px;
  background-color:#E4007F99;
  text-align:center;
}
.floating-post a{
  display:block;
  cursor:pointer;
  width:100%;
  height:100%;
  color:white;
  font-size:1.2em;
}
.floating-post a{  text-decoration: none;  }
.floating-post a:link { color: white; }
.floating-post a:visited { color: white; }
.floating-post a:hover { color: white; }
.floating-post a:active { color: white; }



#title-go{
  width:80px;
  top:20px;
  position:absolute;
}




#route_img_1,#route_img_2,#route_img_3,#route_img  {
display:none;
}
#route_img_1::before,#route_img_2::before,#route_img_3::before,#route_img::before {
content: “添付ファイル：”;
position: absolute;
background: #fff;
width: 110px;
height: 26px;
line-height: 1.8;
text-align: right;
}
#route_img_label span{
display: block;
color: #fff;
font-weight: bold;
font-size: 16px;
font-family: “游ゴシック”, “Yu Gothic”;
background: #F39800;
padding: 15px 10px;
border-radius: 10px;
max-width: 140px;
text-align: center;
transition: .3s;
cursor:pointer;
margin:0 auto;
}
#route_img_label span:hover{
background: #000;
}
#route_img_preview_1,#route_img_preview_2,#route_img_preview_3,
#route_img_preview_4,#route_img_preview_5,#route_img_preview_6,
#route_img_preview_7,#route_img_preview_8,#route_img_preview_9{
  max-width:100%;
}





.step-container {display:block; margin-top:25px;}
.step-container-mobile{display:none;}

.step-wrapper{
  max-width:1050px;
  margin:0 auto 50px;
}
.step-container .step-title{
  background-color:#E4007F;
  color:white;
  padding:10px 20px;
  border-radius:5px;
  margin:10px;
}
.step-container .step-image-container{
  margin:15px 0;
  height:auto;
  width:100%;
  position:relative;
}
.step-container .step-image-container div{
  display:none;
  width:32%;
  float:left;
  height:auto;
  margin:0 0.5%;
  background-size: cover;
  background-repeat: none;
  position:relative;
}
.step-container .step-image-container div > div{
  margin:-5px 0 0 0;
  color:#222222;
  font-size:0.9em;
  height:auto;
}
.step-container .step-image-container .caption{
  width:100% !important;
}
.step-container .step-image-container img{
  height:230px;
  width:100%;
  border-radius:10px;
  box-shadow: 0px 1px 5px rgba(0,0,0,0.5);
  object-fit: cover;
}
.step-container .map-link{
  background-color:#0068B7;
  color:white;
  padding:10px 20px;
  border-radius:5px;
  margin:10px;
}
.step-container .map-link:hover{
  background-color:#0068B799;
}
.step-direction{
  font-size:0.7em;
  margin-top:5px;
  margin-left:15px;
}

.good-button{
  position:fixed;
  bottom:10px;
  right:10px;
}
.good-button button{
    background-color:transparent;
    color:#aaaaaa;
    border:none;
    font-size:4em;
    cursor:pointer;
}
.button-on{
  color:#E4007F !important;
}
.good-button span{
  position:fixed;
  bottom:7px;
  right:7px;
  color:#E4007F !important;
  font-weight:700;
  font-size:0.9em;
}

.comment{
  margin:5px 10px 15px;
}

.route-wrapper{
  display:none;
}
#show-details{
  width:100%;
  height:90px;
  line-height:90px;
  background-color:#0068B799;
  color:white;
  text-align:center;
  display:none;
  cursor:pointer;
}


.departure{
  position:absolute;
  top:0;
  width:100%;
  background-color:#00000088;
  color:white;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.departure > span{
  display:block;
  padding:10px 5px;
  font-size:80%;
}
.author{
  font-size:0.4em;
  margin-left:4em;
  color:#333333;
}
.posted-by{
  position:absolute;
  bottom:0;
  right:0;
  width:100%;
  color:white;
  text-shadow: 1px 1px 1px #000000;
}
.posted-by > span{
  display:block;
  padding:10px 5px;
  font-size:0.75em;
}
.top-search-container{
  width:100%;
  text-align:center;
  padding:7% 0 10%;
}
.top-search-inner span{
  display:block;
  padding:15px;
  font-size:2em;
}
.top-search{
  position: relative;
  box-sizing: border-box;
  display: block;
  padding: 3px 10px;
  border-radius: 5px;
  border:1px solid #f1f1f1;
  height: 4em;
  width:40%;
  max-width:500px;
  min-width:300px;
  margin:auto;
  overflow: hidden;
  background: #fafafa;
}
.top-search input[type="text"]{
  border: none;
  height: 4em;
  width:100%;
  background: #fafafa;
}
.top-search input[type="text"]:focus {
  outline: 0;
}
.top-search input[type="submit"]{
  cursor: pointer;
  font-family: FontAwesome;
  font-size: 1.3em;
  border: none;
  background: none;
  color: #666;
  position: absolute;
  height: 4em;
  right: 8px;
  top: -10px;
  outline : none;
}
.top-search ::-webkit-input-placeholder {
  color: #666;
  font-size:1.2em;
  padding-left:10px;
}

.route-header{
  width:100%;
  padding:10px 5px;
}
.route-name{
  font-size:1.2em;
  font-weight:700;
  margin:15px 0;
}
.route-detail{
  font-size:0.9em;
  margin-bottom:10px;
}
.jump-to-page{
  width:100%;
  text-align:center;
}
.jump-to-page a{
  display:block;
  min-width:30%;
  max-width:60%;
  border-radius:8px;
  margin:20px auto;
  padding:20px 40px;
  background-color:#E4007F;
  color:white;
  cursor:pointer;
}




/* クリックできる要素 */
.ripple {
    /* エフェクトに直接関係はない */
    margin: 20px;
    background-color: #f7f7f7;
    height: 100px;
    width: 200px;
    text-align: center;
    line-height: 100px;
    cursor: pointer;

    /* 必須 */
    overflow: hidden;
    position: relative;
}

/* エフェクト要素 */
.ripple__effect {
    /* 値の変更はエフェクト形体・サイズ・スピードに影響する */
    width: 150px;
    height: 150px;

    /* 必須 */
    position: absolute;
    border-radius: 100%;
    pointer-events: none;
    transform: scale(0);
    opacity: 0;
}

/* エフェクト要素の色を指定 */
.ripple__effect.is-orange { background: #ffffffaa;}
.ripple__effect.is-blue   { background: #4aa3df;}
.ripple__effect.is-black  { background: #999;}

/* classが付与されたらアニメーションを実行 */
.ripple__effect.is-show {
    animation: ripple 0.75s ease-out;
}

/* アニメーションの定義 */
@keyframes ripple {
    from {
        opacity: 1;
    }
    to {
        transform: scale(2);
        opacity: 0;
    }
}

#post_title{
  line-height:2.3em;
  width:25em;
  padding: 1em;
}



#title-error,#image-error{
  display:none;
  color:red;
  width:100%;
  text-align:center;
}
