/**
* Theme Name: Customizr
* Theme URI: http://presscustomizr.com/customizr
* Description: Customizr is a versatile and easy to customize WordPress theme, instantly giving a professional look to your online presence. Designed with visitor engagement in mind, it allows anyone to create a beautiful, fast and mobile friendly website compatible with all browsers and devices. Customizr works fine with major WordPress plugins like WooCommerce, bbPress, JetPack and many others. Top rated by hundreds and with a very active community of users and developers, the Customizr theme is a safe and reliable design option to publish your WordPress content.
* Version: 3.4.16
* Author: nikeo
* Author URI: http://presscustomizr.com/
* Tags: gray, white, light, blue, red, yellow, green, purple, orange, black, one-column, two-columns, three-columns, left-sidebar, right-sidebar, fluid-layout, responsive-layout, buddypress, custom-menu, custom-colors, featured-images, full-width-template, theme-options, threaded-comments, translation-ready, sticky-post, post-formats, rtl-language-support, editor-style
* Text Domain: customizr
* Copyright: (c) 2015 Nicolas GUILLAUME (nikeo), Nice, France
* License: GNU General Public License v2.0 or later
* License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


/**
* The styleheets of Customizr are located in inc/assets/css. Each skin has its own stylesheet : blue.css, green.css, ...
* The current stylesheet is loaded after the main skin stylesheet.
*
* IMPORTANT : If you write your CSS code below, it will be deleted when you'll update the theme.
* If you want to make quick style test / changes, consider using the Custom CSS section in appearance > customize > advanced options > Custom CSS, it will persist on update since it is saved in your database.
* To make important CSS customizations, you'll want to use a child theme and add your css code in the style.css file of it.
*/


/*Webフォント*/
@font-face {
  font-family: 'hannari';
  src: url('/toco/font/hannari.eot');
  src: url('/toco/font/hannari.eot?#iefix') format('embedded-opentype');
  src: url('/toco/font/hannari.otf') format('opentype'); 
}
html,
body {
  width: 100%;
  height: 100%;
  margin:0px;
  padding:0px;
}

html.js.flexbox.flexboxlegacy.canvas.canvastext.webgl.no-touch.geolocation.postmessage.websqldatabase.indexeddb.hashchange.history.draganddrop.websockets.rgba.hsla.multiplebgs.backgroundsize.borderimage.borderradius.boxshadow.textshadow.opacity.cssanimations.csscolumns.cssgradients.cssreflections.csstransforms.csstransforms3d.csstransitions.fontface.generatedcontent.video.audio.localstorage.sessionstorage.webworkers.applicationcache.svg.inlinesvg.smil.svgclippaths {
  margin-top: 0 !important;
}

/*トップ案内 */
#ec { text-align: center;  margin: 20px 0 60px; }
#ec .btn-gradient-radius { display: inline-block; padding: 7px 20px; border-radius: 25px; text-decoration: none; color: #FFF; background-image: linear-gradient(45deg, #07d9ffcc 0%, #5f6bffcc 100%); transition: .4s; }
#ec .btn-gradient-radius:hover { background-image: linear-gradient(45deg, #07d9ff 0%, #5f6bff 100%); }

.popup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: .6s;
}
.popup.is-show {
  opacity: 1;
  visibility: visible;
}
.popup.is-show .box {
  width: 100%;
}
.popup-inner {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 80%;
  max-width: 600px;
  padding: 50px;
  background-color: #fff;
  z-index: 2;
}
.popup-inner img {
  width: 100%;
}
.close-btn {
  position: absolute;
  right: 0;
  top: 0;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  cursor: pointer;
}
.close-btn i {
  font-size: 20px;
  color: #333;
}
.black-background {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.8);
  z-index: 1;
  cursor: pointer;
}

@media screen and (max-width: 896px) {
#ec { /*display: none;*/ margin: 20px 0 20px; }
.popup.is-show { overflow: scroll; }
.popup-inner { padding: 25px; overflow: scroll; margin-top: 30px; margin-bottom: 30px; }
}

/*ここまで*/

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: normal;
    text-shadow: none;
}
ol, ul {
    padding: 0;
    margin: 0;
}
li {
    list-style: none;
}
p {
    line-height: 1.75;
    margin-bottom: 5px;
}
body, .navbar .nav>li>a {
    font-size: 16px;
    line-height: 1.75;
    letter-spacing: 1px;
}
.navbar .nav>li>a {
    line-height: 1.5;
    text-align: center;
    letter-spacing: 2px;
    padding: .5rem;
    text-shadow: none;
}
#top-slide-wrap {
    position: relative;
}
#top-slide-wrap .bx-wrapper {
    max-height: 990px;
}
.slide-inner {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    text-align: center;
}
.home .logo {
    margin: auto;
}
.movie {
    width: 40%;
    margin: auto;
}
.movie p {
    font-family: 'Sorts Mill Goudy', serif;
    color: #fff;
    letter-spacing: .1em;
    font-style: italic;
    margin: 50px 0 10px;
}
.beautifuldays {
    width: 50%;
    margin: auto;
}
.slide-inner a.play:hover {
    color: #fff;
}
.play-btn {
    position: relative;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: rgba(255,255,255,0.5);
    margin: 0 auto;
    cursor: pointer;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}
.play-btn:hover {
    background-color: rgba(255,255,255,0);
}
.center {
    width: 100%;
}
.banner-inner, .center {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
#about {
    box-sizing: border-box;
    text-align: center;
    margin: 100px auto;
    font-family: "Times New Roman", 游明朝, "Yu Mincho", 游明朝体, YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, HGS明朝E, serif;
}
#about h1 {
    font-size: 26px;
    letter-spacing: 3px;
    margin-bottom: 25px;
    font-weight: 600;
}
#en #about p {
    margin-bottom: 5px;
}
#en #about h1 {
    font-size: 1.75em;
}
#about p {
    font-size: 20px;
    letter-spacing: .1em;
    line-height: 2;
    margin-bottom: 20px;
}
.content-title {
    text-align: center;
    padding: 100px 0 75px;
}
.content-title img {
    height: 101px;
    width: auto;
}
.tocoinfo-box {
    padding-bottom: 6em;
}
.tocoinfo-box.living {
margin-top: 70px;
}
.tocoinfo-box.living .tocoinfo-btn {
	float: right;
}
#bar h3,
#tocoinfo h3 {
    letter-spacing: 3px;
    font-size: 1.75em;
    font-family: 'Sorts Mill Goudy', serif;
}
#tocoinfo .box.pic {
    width: 60%;
}
#tocoinfo .box {
    height: 390px;
    margin: 0;
}
#tocoinfo .cafeinfo-box {
    padding-bottom: 6em;
}
#tocoinfo .cafeinfo-box .box {
	height: 335px;
}
#tocoinfo .box .sub {
    letter-spacing: 1px;
}
#tocoinfo p {
    line-height: 2;
}
#banner {
    width: 100%;
    height: 400px;
    position: relative;
}
#banner .banner-inner img {
    height: 180px;
    width: auto;
}
#banner.banner-movie {
    background: url('https://backpackersjapan.mom/toco/img/banner_movie.jpg') no-repeat 50% 25%/cover;
    height: 450px;
    text-align: center;
}
.banner-movie p {
    color: #fbfbfb;
    padding: 30px 0;
    letter-spacing: .2em;
    line-height: 2;
    font-family: "Times New Roman", 游明朝, "Yu Mincho", 游明朝体, YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, HGS明朝E, serif;
}
#en .banner-movie p {
    letter-spacing: .1em;
    line-height: inherit;
}
.tc-header {
    border-bottom: 0;
    background-image: url(https://backpackersjapan.mom/toco/img/bg.png);
}

body {
    font-family: Avenir, 'Open Sans', 'Helvetica Neue', Helvetica, Arial, Verdana, Roboto, 游ゴシック, 'Yu Gothic', 游ゴシック体, YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', メイリオ, Meiryo, sans-serif;
    color: #000;
    background-color: #F9F9F7;
    background-image: url(https://backpackersjapan.mom/toco/img/bg.png);
    overflow-x: hidden;
}

#news {
    text-align: center;
    width: 90%;
    margin: 0 auto;
}

li.post {
    width: 25%;
    margin: 0 4%;
    list-style-type: none;
    float: left;
    position: relative;
    box-sizing: border-box;
}
.post_thumbs {
    height: 245px;
    overflow: hidden;
    border: 10px solid #fff;
    background: #fff;
}
.post_thumbs img {
    margin: -20% -70%;
    height: 380px;
    width: auto;
    max-width: none;
}
.post_text {
    background: #fff;
    border: 10px solid #fff;
    margin: 10px 0 0;
}
li.post .post_title {
    margin: 5px 0 10px;
    font-size: 21px;
}
li.post .upload {
    margin: 15px 0 5px;
    letter-spacing: 1px;
    font-style: italic;
}

li.post-archive .post-title {
    font-size: 1.5rem;
}
li.post-archive {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #aaa;
}

.row-fluid .tc-grid {
    box-shadow: none;
}

.tc-grid-border .tc-grid {
    border-bottom: 0;
}

.tc-grid {
    border: 0;
}

.featurette-divider {
    border: 0;
    border-top: 0;
    border-bottom: 0;
}

.tc-hot-crumble.container {
    display: none;
}

.entry-header {
    display: none;
}
#staff-wrap {
    text-align: center;
    margin: 3em auto;
}
.single #main-wrapper, .page #main-wrapper {
    padding-top: 100px;
    margin-top: 0;
}

.container, .page #content {
    width: 100%;
}

/*--------------------------------------------
 
　　　SINGLE
 
---------------------------------------------*/
.archive .main_section,
.single .main_section {
    padding: 160px 0;
}
.left_section {
    width: 62.4%;
    height: auto;
    margin: 0;
    padding: 0;
    float: left;
    max-width: 100%;
}
.section_post > h3 {
    margin: 20px 0;
    padding: 0;
    color: #212121;
    font-size: 24px;
    width: 100%;
    font-weight: bolder;
}
.section_post > h4 {
    margin-bottom: 10px;
    padding: 0;
    color: #212121;
    font-size: 16px;
    width: 100%;
}
.side_bar {
    width: 300px;
    margin: 45px 0 0 0;
    padding: 0;
    float: right;
    max-width: 100%;
}
.widget {
    width: 100%;
    height: auto;
    padding: 0;
    margin-bottom: 14px;
    float: left;
    max-width: 100%;
}
.side_bar h3 {
    color: rgb(52, 52, 52);
    font-size: 18px;
    font-weight: normal;
    margin: 10px 0 5px 0;
}
.side_bar h3:before {
    display: none;
}
.widget_recent_entries ul li {
    width: 100%;
    height: auto;
    padding: 10px 0;
    margin: 0;
    float: left;
    max-width: 100%;
    border-bottom: 1px solid #c5c5c5;
}
/*--------------------------------------------
 
　　　ROOM&FACILITY
 
---------------------------------------------*/
#room .section-padding {
    padding-top: 3em;
    padding-bottom: 3em;
}

#plan {
	overflow: hidden;
}

#section-room .pic div {
    width: 98%;
    height: 300px;
    margin: 1%;
}
#section-room .pic ul li {
    width: 48%;
    height: 150px;
    float: left;
    margin: 0 1%;
    box-sizing: border-box;
}
#section-room .text {
    min-height: 460px;
    position: relative;
}

#section-plan {
	overflow: hidden;
	padding-top: 25px;
	max-width: 1000px;
	padding-bottom: 80px;
}

#section-plan .box {
	width: 100%;
	margin: 0 auto;
}

#section-plan .type {
   font-size: 1.5em;
   line-height: 1.5;
   text-align: center;
	border-bottom: 1px dotted;
	/*display: inline-block;*/
	margin: 0 auto;
}

#section-plan .parent {
	display: flex;
	flex-wrap: wrap;
	margin: 50px 0;
}

#section-plan .children {
	 width: 40%;
    padding: 0% 5% 50px;
}

#section-plan .children .bd {
	font-weight: bold;
}

#section-plan .info {
	font-size: 14px;
	background-color: #fff;
	width: 90%;
	border: 1px solid;
	text-align: center;
	margin: 0 auto;
	padding: 20px; 10px;
}

#section-plan .info .bd {
	font-weight: bold;
}
	
#section-facility {
   background-color: #fff;
	padding-top: 80px;
}

#section-gallery {
	padding-top: 80px;
}

#section-room .type {
    font-size: 1.5em;
    line-height: 1.5;
}
#section-room .type small {
    display: block;
}
#section-room a.button {
    position: absolute;
    right: 0;
    margin: 1%;
    bottom: 0;
}
#section-facility .box, #section-facility .box-item {
    min-height: 280px;
    margin: 2%;
}
#section-facility .box .entry, #section-facility .box-item .entry {
    text-align: center;
    padding-bottom: .75em;
    border-bottom: 1px dotted #aaa;
    margin-bottom: .75em;
    font-weight: 600;
    text-transform: uppercase;
}

.box-item li, .box-item li {
    float: left;
    width: 25%;
    box-sizing: border-box;
    margin-bottom: 10px;
}
.roomtype {
    clear: both;
}
.gallery {
    width: 20%;
    float: left;
    padding: 5px;
    box-sizing: border-box;
}
#section-gallery br {
    display: none;
}

/*--------------------------------------------
 
　　　BAR
 
---------------------------------------------*/
.intro {
    padding-bottom: 15px;
    border-bottom: 1px dashed;
    width: 900px;
    margin: 0 auto;
    text-align: center;
    font-size: 20px;
}
.menu th {
    text-align: center;
    border: none;
    font-weight: normal;
    font-size: 1.5em;
    letter-spacing: 3px;
}

li.menu {
    clear: both;
    padding: 30px;
    background-color: #fff;
}
.menu td.right {
    text-align: right;
}
.menu tr:nth-child(even) td,
.menu tr:nth-child(even) th,
.menu tr:nth-child(odd) td,
.menu tr:nth-child(odd) th {
    background-color: inherit;
    padding: 10px;
    }
.menu table {
    border-bottom: 0;
    font-size: 15px;
}
/*--------------------------------------------
 
　　　BOOKING
 
---------------------------------------------*/
.notice h4, .tel h4, .mail h4, .bookhere h4 {
    margin-bottom: 25px;
    text-align: center;
    letter-spacing: 1px;
    font-weight: 600;
}
.calendar .button {
    display: none;
}
.notice {
    padding: 2rem;
    border: 1px dotted #aaa;
}
.tel-box {
    width: 49.5%;
}

.tel-box p {
    letter-spacing: 1px;
    text-align: center;
    margin: 0;
}

.tel-box a:hover {
    text-decoration: none;
}
.tel-box-1 {
    background: #D8D8D8;
    color: #666;
    padding: 5px 0;
}
.tel-box-2 {
    font-size: 1.5em;
    padding: 10px 0;
    background: #fff;
}
table.mailform {
    text-align: left;
    letter-spacing: 1px;
    margin-top: 25px;
}
table.mailform th {
    width: 40%;
}
table.mailform td {
    width: 60%;
}
table.mailform th,
table.mailform td {
    padding: 2rem;
    box-sizing: border-box;
    font-weight: 400;
}
table.mailform td.number br {
    display: none;
}
.mailform input[type=text],
.mailform input[type=date],
.mailform input[type=number],
.mailform input[type=email],
.mailform input[type=tel],
.mailform textarea {
    margin: 0;
    height: auto;
    border-radius: 0;
    -webkit-border-radius: 0;
    width: 100%;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    box-sizing: border-box;
}

.mailform input[type=number] {
    width: 10%;
}
.mailform input[type=radio],
.mailform input[type=checkbox],
.mailform label {
    margin: 0;
    line-height: 0;
}
select {
    width: 150px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.mailform .wpcf7-list-item.last label { margin-bottom: -20px; }

/*--------------------------------------------
 
　　　ACCESS
 
---------------------------------------------*/
#route {
    text-align: left;
}

#route h4 img {
    margin-right: 10px;
    margin-bottom: 5px;
    width: 32px;
}
#route h4 span {
    font-size: 70%;
    margin-left: 15px;
    padding: 5px;
    background-color: #E5E5E5;
}

#acMenu dt {
    display: block;
    width: 100%;
    border-bottom: #7B7975 1px solid;
    cursor: pointer;
    background: url(https://backpackersjapan.mom/toco/img/plus.svg) 95% 18px no-repeat;
    clear: both;
    padding: .75em 0;
    color: #7B7975;
}
#acMenu dd {
    width: 100%;
    height: auto;
    display: none;
    padding: 1em 0;
    box-sizing: border-box;
    margin-left: 0;
}

#acMenu dt.active {
    background: url(https://backpackersjapan.mom/toco/img/minus.svg) 95% 20px no-repeat;
    color: #000;
}
/*--------------------------------------------
 
　　　RECRUITMENT
 
---------------------------------------------*/
#recruit .box {
    border: 1px solid #aaa;
    box-sizing: border-box;
    padding: 25px;
}
#recruit .box p {
    margin-bottom: 15px;
}
#recruit h4 {
    text-align: center;
    margin: 2em 0;
}
/*--------------------------------------------
 
　　　PLANS
 
---------------------------------------------*/
#plans .tocoinfo-btn {
	margin-top: 30px;
}

#bj .parent {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 50px;
   padding-bottom: 50px;
   border-bottom: 1px dashed #aaa;
}

#bj .children {
	margin-top: 80px;
	width: 40%;
	padding: 0 5%;
}

#bj .children h2 {
	text-align: left;
}

#neighbor .parent {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 50px;
   padding-bottom: 50px;
   border-bottom: 1px dashed #aaa;
}

#neighbor .children {
	margin-top: 80px;
	width: 40%;
	padding: 0 5%;
}

#neighbor .children h2 {
	text-align: left;
}

#chillnn {
	padding-bottom: 200px;
}

#chillnn .parent {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

#chillnn .children {
	margin-top: 80px;
	width: 40%;
	padding: 0 5%;
}

#chillnn .children h2 {
	text-align: left;
	margin-top: 20px;
}

/*--------------------------------------------
 
　　　FOOTER
 
---------------------------------------------*/
footer#footer {
    border-top: 0;
    clear: both;
}
footer#footer a, footer#footer p {
    font-size: 14px;
}
footer#footer .top_footer .left p {
    text-align: left;
    margin-bottom: 1.5em;
}
.top_footer .left .link a { padding: 0 10px; color:#ffffff; margin: 0; }
.top_footer .left .link a:hover {  }
.top_footer .right {
    position: absolute;
    right: 0;
    bottom: 0;
}
.top_footer {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 30px 0;
    float: left;
    max-width: 100%;
    background-color: #1c1c1c;
}
.bottom_footer {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 20px 0;
    float: left;
    max-width: 100%;
    background-color: #2a2a2a;
}
footer#footer .bottom_footer p {
    float: left;
    padding: 0;
    margin: 0px 0;
    color: #b3b3b3;
    font-size: 14px;
    font-weight: normal;
}
.customize-container {
    position: relative;
    max-width: 1230px;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}
.top_footer .right a {
    margin-left: 50px;
}
.top_footer .right a img.citan { width: 115px; }

/*--------------------------------------------
 
　　　COMMON
 
---------------------------------------------*/
.btn:focus, a:focus {
    outline: #262626 auto 5px;
}
.mobile_on { display: none; }
.primary {
    padding-right: 0%;
    width: 80%;
    max-width: 1170px;
    margin: auto auto;
}
.margin {
    margin-bottom: 3em;
}
.padding {
    padding-bottom: 3em;
}
.button {
    display: inline-block;
    background-color: rgba(0, 0, 0, 0.1);
    width: 200px;
    height: 50px;
    text-align: center;
    text-decoration: none;
    line-height: 50px;
    outline: none;
    color: #5F6F81;
    font-family: 'Sorts Mill Goudy', 'hannari', serif;
}

#recruit .button { z-index: 5000; }

.button span {
    position: relative;
    padding-right: 1em;
    transition: all .3s;
}
.button span::after {
    position: absolute;
    top: 50%;
    right: -7px;
    content: '';
    margin-top: -5px;
    border: 7px solid transparent;
    border-top-width: 5px;
    border-bottom-width: 5px;
    border-left-color: #5F6F81;
    transition: all .3s;
}
.button:hover span {
    padding: 0 .5em;
}
.button:hover span::after {
    right: 0;
    opacity: 0;
}
a.button:hover {
    background-color:  rgba(0, 0, 0, 0.05);
    text-decoration: none;
    color: #5F6F81;
}

a.stores.button span::after, a.staff.button span::after{
	 top: 0;
    right: 0;
    content: '';
    margin-top: 0px;
    border: 0px solid transparent;
    border-top-width: 0px;
    border-bottom-width: 0px;
    border-left-color: ;
    transition: ;
}

a.stores.button span, a.staff.button span {
    padding-right: 0;
}
	
a.stores.button {
    position: absolute;
    right: 20px;
    top: 20px;
    color: #ca5f13;
    height: 30px;
    line-height: 33px;
    font-weight: bold;
    font-size: 15px;
    width: 175px;
    background: rgba(255, 255, 255);
    margin: 0px 0px;
    z-index: 5000;
    font-family: Avenir, 'Open Sans', 'Helvetica Neue', Helvetica, Arial, Verdana, Roboto, 游ゴシック, 'Yu Gothic', 游ゴシック体, YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', メイリオ, Meiryo, sans-serif;
}

a.button.staff {
    position: absolute;
    right: 20px;
    top: 60px;
    color: #fff;
    height: 30px;
    line-height: 33px;
    font-weight: bold;
    font-size: 15px;
    width: 175px;
    background-color: #ca5f13e6;
    margin: 0;
    z-index:5000;
    font-family: Avenir, 'Open Sans', 'Helvetica Neue', Helvetica, Arial, Verdana, Roboto, 游ゴシック, 'Yu Gothic', 游ゴシック体, YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', メイリオ, Meiryo, sans-serif;
}
a.button.googlemap {
    color: #fff;
    height: 30px;
    line-height: 30px;
    font-size: 13px;
    width: 120px;
    background: rgba(0, 0, 0, 0.65);
    margin: 10px 0;
}
a.button.googlemap span::after,
a.button.staff span::after  {
    border-left-color: #fff;
}
a.button.googlemap:hover,
a.button.staff:hover {
    color: #fff;
}


.page h2 {
    margin-bottom: 15px;
    text-align: center;
}
.section-title {
    font-family: 'Sorts Mill Goudy', serif;
    text-align: center;
    padding: 8px 80px;
    border: 1px solid;
    font-size: .75em;
    letter-spacing: 2px;
    font-style: italic;
    background: #fefefe;
    font-weight: 400;
}
.page .sub {
    letter-spacing: 1px;
    text-align: center;
    font-size: .85em;
    margin-bottom: 3rem;
}
.box, .box-item {
    float: left;
    width: 46%;
    margin: 0 2%;
    position: relative;
    text-align: left;
}
.clear {
    clear: both;
    line-height: 0;
}

#customizr-slider-1 {
    display: none;
}
.home #tc-page-wrap {
    display: none;
}
.home.tc-sticky-header #tc-reset-margin-top {
    margin-top: 0!important;
}
table {
    border-bottom: 0;
}
.datepicker tr:nth-child(odd) td, .datepicker tr:nth-child(odd) th {
    background-color: #fff;
}

/*--------------------------------------------
　　　NAV MENU
---------------------------------------------*/
.navbar-wrapper.clearfix.span9.tc-submenu-fade.tc-submenu-move.tc-open-on-hover.pull-menu-right {
    float: right;
}
.no-navbar .navbar .navbar-inner, .sticky-enabled .navbar .navbar-inner {
    margin: 0;
    padding: 10px 30px;
    height: 100px;
    box-sizing: border-box;
}
.navbar .navbar-inner .span5, .navbar .navbar-inner .span7 {
	display: none;
}
#global {
    position: absolute;
    height: 100px;

    z-index: 200;
}
#global .brand .site-logo img {
    display: none;
}

.page #global, .single #global {
    display: none;
}
.lang-btn {
    font-size: 90%;
    font-family: 'Sorts Mill Goudy', serif;
    padding-left: 30px;
    float: left;
}
.lang-btn .choosen {
    color: #5F6F81;
}
.lang-btn a {
    color: #000;
}
#global.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 200;
    height: 100px;
}
.page .tc-header, .single .tc-header, .archive .tc-header {
    height: 100px;
    position: fixed;
    top: 0;
}

#global.fixed .brand .site-logo img,
.page .tc-header .brand .site-logo img,
.single .tc-header .brand .site-logo img,
.archive .tc-header .brand .site-logo img {
    display: block;
    width: 200px;
    padding-left: 20px;
}
#global.fixed .lang-btn, .page .tc-header .lang-btn, .single .tc-header .lang-btn, .archive .tc-header .lang-btn {
    padding-left: 90px;
}
.navbar .nav>li {
    margin-left: 25px;
}
img {
max-width : 100% ;
height : auto ;
}

.navbar-wrapper.clearfix { clear: none; } 

/* 特定商取引に基づく表記ページ追記 */
#law {
	margin-top: 50px;	
}
footer#footer a.law {
	font-size: 13px;
	padding: 0px;
}
.law_table {
    width: 100%;
    text-align: left;
    border: none;
    border-collapse: separate;
    border-spacing : 6px 4px;
	margin-top: 100px;
    margin-bottom: 100px;
	border-spacing: 0px;
  }
  .law_table th{
    width: 24%;
    background-color: #E6E6FA;
	border-top: 1px solid #ededed;
	border-bottom: 0px;
  }
  .law_table td{
    background-color: #EFF2F7;
	padding-left: 30px;
  }
  @media (max-width: 640px) {
    .law_table{
      font-size: 14px;
    }
  }	

/*--------------------------------------------
　　　@Media screen
---------------------------------------------*/
@media (max-width: 1250px) {
  .customize-container { width: auto; }
}
@media screen and (max-width: 1200px) {
  .primary { width: 85%; }
}
@media screen and (max-width: 1024px) {
  .primary { width: 90%; }
  .customize-container { width: 95%; }
}

/* ここから979px以下用（タブレット用）の記述 */
@media screen and (max-width: 979px) {
  body { font-size: 15px; }
  .nav-collapse, .nav-collapse.collapse {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    top: 60px;
    padding: 0 1rem;
    box-sizing: border-box;
  }
  .no-navbar .navbar .navbar-inner { padding: 0; }
  .navbar .nav>li { float: none; }
  .page-inner, .gallery-inner { width: 100%!important; }
  #tocoinfo .box { padding: 0!important;  margin-bottom: 10px; height: auto; }
  #tocoinfo .cafeinfo-box .box { height: auto; }
  #tocoinfo .cafeinfo-box { padding-bottom: 0; }
  #tocoinfo .button { position: relative; }
  .tocoinfo-box.living .tocoinfo-btn { float: none; }
  .primary { width: 100%; padding: 0 10%; box-sizing: border-box; }
  .logo img { display: inline !important; }
  .home .play a { font-size: 70%; padding: 10px 6%; }
  #tocoinfo-gh,　#tocoinfo-bar { margin-bottom: 50px; }
  #tocoinfo .tocoinfo-btn { text-align: right; }
  .box { width: 100%!important; }
#section-facility .box, #section-facility .box-item {
    width: 100%;
    min-height: inherit!important;
}
  li.post { width: 30%;  margin: 0 1.5%; }
  li.post .post_title { font-size: 17px; line-height: 1.5; }
  #global.fixed .brand .site-logo img, .page .tc-header .brand .site-logo img, .single .tc-header .brand .site-logo img { width: 140px; padding-left: 10px; }
  #global.fixed, .page .tc-header, .single .tc-header { height: 60px; }
  .box-item li, .box-item li { width: 12.5%; }
  .mobile_navbar {  position: relative; }
  .single #main-wrapper, .page #main-wrapper { padding-top: 60px; }
  .content-title { padding: 50px 0; }
  .left_section {  width: 100%; box-sizing: border-box; }
  .side_bar { width: 100%; box-sizing: border-box; }
#global {
    bottom: inherit!important;
    top: 0;
    height: 60px;
    box-sizing: border-box;
}
#global .brand .site-logo img {
    display: block;
    width: 140px;
    padding-left: 10px;
}
#global .lang-btn, #global.fixed .lang-btn, .page .tc-header .lang-btn, .single .tc-header .lang-btn {
    position: absolute;
    top: 0;
    right: 0;
    line-height: 60px;
    z-index: 200;
    margin-right: 50px;
    padding: 0;
}
#global .navbar .btn-navbar, .tc-header .navbar .btn-toggle-nav {
    margin: 14px 0;
}
.page .sub {
    margin-bottom: 1rem;
}

#section-room .pic div {
    height: 320px;
    margin: 2% auto;
    width: 98%;
}
#section-room .pic ul li {
    height: 180px;
}
#section-room .text {
    min-height: inherit;
    padding-top: 15px;
}
#section-room a.button {
    position: inherit;
    margin: 0;
}
.menu table {
    margin-top: 1em;
}
.intro {
    width: 100%;
    text-align: left;
    border: 0;
    padding: 0;
    font-size: inherit;
    letter-spacing: inherit;
}
.intro br {
    display: none;
}
.box, .box-item {
    margin: 0;
}
.tocoinfo-box {
    padding-bottom: 3em;
}
.tc-header .brand {
    width: auto;
    z-index: 201;
    position: absolute;
}
.mobile_navbar .navbar-wrapper.clearfix.span9 {
    position: absolute;
    right: 0;
    top: 0;
}
#global {
    position: fixed;
}
a.staff.button {
    bottom: inherit;
}
#about h1 {
    font-size: 21px;
}
#about p {
    font-size: inherit;
}
.banner-movie p {
    font-size: inherit;
}
.home .logo {
    width: 24%;
}
#top-slide-wrap {
    padding-top: 60px;
}
  #top-slide-wrap .bx-wrapper { max-height: inherit; }
  .no-navbar .navbar .navbar-inner, .sticky-enabled .navbar .navbar-inner { height: inherit; }

#recruit .box {
    padding: 20px;
    margin-bottom: 1.5em;
}
}

/* ここから767px以下用（タブレット／スマートフォン用）の記述 */
@media screen and (max-width: 767px) {
  body, table { font-size: 14px; }
  #news li.post { float: none; width: 100%; margin: 0; }
  #main-wrapper { padding-left: 0; padding-right: 0; }
  .mailform tbody, .mailform tr, .mailform th, .mailform td { display: block; }
  .datepicker tr { display: flex; }
  table.mailform th { width: 100%; border: none; padding: 10px 10px 0; }
  table.mailform th p { margin: 0; }
  table.mailform td { width: 100%; padding: 10px; border-top: 0;}
  #reservation .tel-box { float: none; width: 100%; margin-bottom: 20px; }
  .film-inner-r, .cal { display: none; }
  footer#footer a, footer#footer p { text-align: left; }
  footer#footer .top_footer .customize-container { width: 96%; }
  .tc-btt-wrapper.show { display: none; }
  .gallery { width: 33.3%; padding: 2px;}
  .top_footer .right a { margin: 0; }
  .top_footer .right { position: relative; }
  .page .section-form.primary { width: 100%; padding: 0!important; }
  .button { width: 100%; }
.menu span {
    display: none;
}
  .notice { padding: 1rem; }
  .section-title { font-size: 70%; }
  .primary { width: 90%; padding: 0; }
  .box, .box-item { margin: 0; }
  .thumbs { display: none; }
  .home .play { bottom: 10%; }
  .home .play a { font-size: 55%; padding: 1.5% 5%; }
  .post_text { margin: 0 0 30px; }
  .slide-inner .button { font-size: 90%; height: 35px; width: 180px; line-height: 35px; }
  .left_section, .side_bar { padding: 0 2%; }
  .single .main_section { padding: 60px 0; }
  h3 { line-height: normal; }
  .section_post > h3, li.post-archive .post-title { font-size: initial; }
.movie p {
    margin: 10px 0;
}
.links {
position: relative;
overflow: hidden;
height: 100%;
}
.links p {
top: inherit;
bottom: 10px;
/* right: inherit; */
margin: auto;
text-align: center;
position: absolute;
display: block;
z-index: 5000;
height: 30px;
width: 100%;
	}
.links p.ab {
	bottom: 70px;
	}
.links p.cd {
	bottom: 30px;
	}
a.stores.button {
	font-size: 14px;
    position: initial;
    right: inherit;
    top: inherit;
}
a.staff.button {
	font-size: 14px;
    position: initial;
    right: inherit;
    top: inherit;  
    bottom: initial
}
#staff-wrap a.button {
    margin-bottom: 1em;
}
.navbar .nav>li {
    margin: 0;
}
.nav-collapse.collapse .nav {
    padding: 0;
    margin: 10px 0;
}
.mobile_off { display: none; }
.mobile_on { display: block; }
#route h4 span {
    font-size: 60%;
    margin-left: 15px;
}
#acMenu dt {
    padding: 10px 0;
    background: url(https://backpackersjapan.mom/toco/img/plus.svg) 95% 12px no-repeat;
}
#footer .bottom_footer p {
    text-align: center;
    width: 100%;
}
#section-room .pic div {
    height: 180px;
}
#section-room .pic ul li {
    height: 130px;
}
#section-plan .children {
    width: 90%;		
	}
.home .logo {
    width: 28%;
}
	
#bj .parent {
	display: flex;
	flex-wrap: wrap;
	flex-flow: wrap-reverse;
}

#bj .children {
	width: 100%;
	padding: 0 15px;
}
	
#neighbor .parent {
	display: flex;
	flex-wrap: wrap;
	flex-flow: wrap-reverse;
}

#neighbor .children {
	width: 100%;
	padding: 0 15px;
}

#chillnn .parent {

}

#chillnn .children {
	width: 100%;
	padding: 0 15px;
}
}


/* ここから479px以下用（スマートフォン用）の記述 */
@media screen and (max-width: 479px) { 
  .slide-inner .button { font-size: 80%; height: 25px; width: 160px; line-height: 25px; }
  .tocoinfo-img, .calendar iframe { display: none; }
  .calendar .button { display: block; }
  .box-item li { width: 25%; }
  body, table { font-size: 13px }
#about {
    margin: 50px auto;
}
#about h1 {
    font-size: 16px;
}
#about p {
    font-size: inherit;
    line-height: 1.75;
 margin-bottom: 15px;

}
  #route h4 img { width: 25px; }
  #bar li.box { margin-bottom: 30px; }
  .content-title img { height: 80px; }
  #banner.banner-movie { height: 200px; }
  .page #banner {  height: 200px; }
  #banner .banner-inner img { height: 130px; }
  .play-btn { width: 50px; height: 50px; }
  .top_footer .right a img { width: 30%; }
  .top_footer .right a img.citan { width: 20%; }
#tocoinfo h4 {
    font-size: 1.5em;
}
.facility {
    padding: 50px 0 0;
}
.beautifuldays {
    width: 70%;
    margin-bottom: 1rem;
}
  .slide-inner .center {
    top: 50%;
  }
}