@charset "utf-8";
/*
Theme Name: そらやまゲストハウス
Description: そらやまゲストハウス
Theme URI: http://ur.float-jp.com/sorayama/
Author: FLOAT
Version: 1.0.0
*/



/*  BODY
----------------------------------------------------------- */  

/*コンテンツの背景*/
div.post,p.feed,#domments {background-color: #FFF;}	


body {
	padding-top: 0px;
	margin: 0 auto;
	font-family: 'Noto Sans JP', sans-serif,'游ゴシック体', YuGothic, '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'メイリオ', sans-serif;
	font-feature-settings : "palt" ;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; 
    font-size: 13px;
	letter-spacing: 0.1em;
    line-height: 2.2;
    color: #000;
	background-color: #f5f5f5;
}
img {
    max-width: 100%;
	height: auto;
}
a {
	text-decoration: none;
	color: #696969;
}
a img:hover {
	opacity: 0.8;
	color: #fff;
}

ul {
    list-style: none;
}
.pc {
	display: block!important;
}
.pc a {
	text-decoration: none;
}
.sp {
	display: none!important;
}
.sp a {
	text-decoration: none;
}
#main {
	word-break:break-all;
}

.parent {
    text-align: center;
}
.tbtn {
    /* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
    font-size: 1.2em;
    letter-spacing: 0.05em;
    margin: 2% auto 4% auto;
    border-radius: 2em;
    border: solid 1px #696969;
    padding: 0.5% 8%;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.3s;
}
.tbtn:hover {
	color: #fff;
    background: #696969;
}

.fslide {
    width: 100%;
    margin: 0 auto;
}
.wraper {
    width: 100%;
    margin: 0 auto;
}
.wraper1 {
    width: 100%;
    margin: 0 auto;
	padding: 0 10% 0 0;
}
.wraper2 {
    width: 1100px;
    margin: 0 auto;
}
.wraper3 {
    width: 80%;
    margin: 0 auto;
	padding: 0 7%;
}
.w01 {
	width: 100%;
    margin: 0 auto;
    padding: 0 0 0 10%;
}
.w02 {
	width: 80%;
	margin: 0 auto;
}
.w03 {
	width: 100%;
    margin: 0 auto;
    padding: 0 10% 0 20%;
}
.topbox {
    width: 100%;
	height: auto;
    margin: 0 auto 0 auto;
}
.topimg {
    width: 100%;
	height: auto;
    margin: 0 0 0 0;
	padding: 0;
}
.movbox {
    width: 100%;
	padding:56.25% 0 0 0;
	position:relative;
	top: 120px;
    left: 0;
	margin: 0 0 100px 0;
}


@media screen and (max-width: 767px) {
	
	.tbtn {
		font-size: 1.2em;
        margin: 10% auto 15% auto;
        padding: 0.5% 25%;
	}
	.fslide {
    	width: 100%;
    	padding: 0 0;
    }
	.fslide img{
    	width: auto;
    	height: 100vh;
		object-fit: cover; 
    }
	.wraper {
    	width: 100%;
    	padding: 0 0;
    }
	.wraper1 {
    	padding: 0 4%;	
    }
	.wraper2 {
		width: 100%;
    	padding: 0 4%;	
    }
	.wraper3 {
		width: 90%;
    	padding: 0 4%;	
    }
	.w01 {
		width: 90%;
		margin: 0 auto;
    }
	.w02 {
		width: 90%;
		margin: 0 auto;
    }
	.w03 {
		width: 90%;
		margin: 10% auto 0 auto;
		padding: 0;
    }
	
}
iframe {
	max-width: 100%;
	margin: 0 0 5% 0;
}
.full {
    width: 100%;
    margin: 30px 0 0 0;
}
.bold {
	font-weight: bold;
}
.center {
	text-align:center;
}

.b-gray {
	width: 100%;
	background-color: #f3f0ed;
	padding: 35px 0 35px 0;
}
.b-black {
	width: 100%;
	background-color: #000000;
	padding: 35px 0 35px 0;
}
.b-white {
	width: 100%;
	background-color: #fff;
	padding: 35px 0 35px 0;
}
.w100 {
	width: 100%;
	height: auto;
}
.w70 {
	width: 70%;
	margin: 0 10px 50px 20px;
    padding: 2%;
	float: left;
}
.w80 img{
	width: 80%;
	text-align:center;
}

/*線*/
hr {
  border: 1px solid #000000;
  margin: 20px 0;
}
.left {
	float: left;
}
.right {
	float: right;
}


/* Clearfix -------------------------*/
.clearfix:after{
	content: '';
	display: block;
	clear: both;
}
.clearfix{
	zoom: 1; /* for IE6/7 */
}

.clear{ clear:both; }


.bg2 {
    width: 100%;
    background-color: #f5f5f5;
    padding: 8% 0;
}
@media screen and (max-width: 767px) {
    .bg2 {
        padding: 15% 0;
    }
}


/*  マージン
----------------------------------------------------------- */ 

.mar-t10 {
	margin: 10px 0 0 0;
}
.mar-b10 {
	margin: 0 0 10px 0;
}
.mar-t20 {
	margin: 20px 0 0 0;
}
.mar-b20 {
	margin: 0 0 20px 0;
}
.mar-t30 {
	margin: 30px 0 0 0;
}
.mar-b30 {
	margin: 0 0 30px 0;
}
.mar-t40 {
	margin-top: 40px;
}
.mar-t50 {
	margin-top: 50px;
}
.mar-t-20 {
	margin-top: -20px;
}
.mar-t-30 {
	margin-top: -30px;
}
.mar-t-40 {
	margin-top: -40px;
}
.mar-t-50 {
	margin-top: -50px;
}


/*  タイトル
----------------------------------------------------------- */  

.topm {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    font-size: 1.1em;
    letter-spacing: 0.15em;
    font-feature-settings: 'pkna';
    margin: 0 auto;
    text-align: left; /* 日本語部分のテキストを左揃えにする */
    padding: 0 0 0 20%;
    line-height: 1.8; /* 通常の行間 */
}
.vertical-text {
    writing-mode: vertical-rl; /* 縦書きにする */
    line-height: 3; /* 日本語の行間 */
    padding: 0; /* 日本語のパディング */
}

@media screen and (max-width: 767px) {
    .topm {
        font-size: 1.1em;
        writing-mode: unset;
        margin: 0 5%;
        text-align: left; /* 小さい画面での日本語部分のテキストを左揃えにする */
        padding: 0;
        line-height: 2.4; /* 小さい画面での通常の行間 */
    }
	.vertical-text {
		font-size: 1.1em;
        writing-mode: unset;
        margin: 0 5%;
        text-align: left; /* 小さい画面での日本語部分のテキストを左揃えにする */
        padding: 0;
        line-height: 2.4; /* 小さい画面での通常の行間 */
	}
}





/*  タイトル
----------------------------------------------------------- */  

.t-title {
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
	font-size: 1.4em;
	font-weight:bold;
	text-align: center;
	padding: 10% 0% 2% 0;
}

.t-title2 {
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
	font-size: 1.4em;
	letter-spacing: 0.05em;
	text-align:center;
	padding: 0 0;
	margin: 3% 0 0 0;
	color: #736d71;
}

.t-title3 {
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
	font-size: 1.4em;
	letter-spacing: 0.05em;
	text-align:center;
	padding: 20px 0px 0px 0px;
	margin: 2% 0 0 0;
	color: #736d71;
	border-bottom:1px dotted #ddd;
}

.s-title {
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
    font-size: 1.8em;
	font-weight:bold;
    color: #736d71;
    letter-spacing: 0.1em;
    padding-left: 70px;
    margin: 0 0 5% 0;
    position: relative;
}
.s-title::before {
    content: '';
    width: 50px;
    height: 1px;
    background: #736d71;
    position: absolute;
    top: 23px;
    left: 0;
}

.contp {
	margin: 5% 0 10% 0;
	text-align:center;
}
.contig {
	width: 60%;
	height: auto;
	margin: 0 auto;
}
.ttt {
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
	font-size: 2.4em;
    line-height: 1.8;
    letter-spacing: 0.05em;
	text-align: center;
    color: #736d71;
	padding: 2% 0;
}
.stt {
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
	font-size: 2.4em;
    line-height: 1.8;
    letter-spacing: 0.05em;
	text-align: center;
    color: #736d71;
	padding: 0;
}
@media screen and (max-width: 767px) {

	.t-title {
		width: 100%;
		height: auto;
		padding: 25% 0% 2% 0;
	}
	.contp {
		margin: 5% 0 15% 0;
	}
	.contig {
		width: 90%;
	}
	.ttt {
		width: 100%;
		height: auto;
		padding: 0;
	}
	.stt {
		width: 100%;
		height: auto;
		padding: 10% 0% 2% 0;
	}
}


/*  WORKS
----------------------------------------------------------- */

.wks {
	width: 100%;
	margin: 2% auto;
}
.w_mid {
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
	font-size: 0.9em;
	font-weight: bold;
	letter-spacing: 0.05em;
	color: #696969;
}
.w_tit {
	display: inline-block;
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
	font-size: 1.4em;
    line-height: 1.8;
    letter-spacing: 0.05em;
    margin: 2% auto;
    padding: 0.2em 0.8em;
    border: solid 1px;
}
.w_tit2 {
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
	font-size: 1em;
	letter-spacing: 0.05em;
	margin: 3% auto 0 auto;
}
.w_tex {
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
	font-size: 1em;
	letter-spacing: 0.05em;
	margin: 1% auto;
}
.w_tag {
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
	font-size: 1em;
	letter-spacing: 0.05em;
	margin: 2% auto;
}
.w_tag span {
	border-radius: 2em;
    border: solid 1px #696969;
    padding: 1% 2%;
    margin-right: 01%;
}
.w_tag li {
	display: inline;
	line-height: 3em;
}
.w_link {
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
	font-size: 1em;
	letter-spacing: 0.05em;
	margin: 0 auto;
}
.w_link a{
	text-decoration: underline;
	color: #000;
}
.w_box {
	display: flex;
	width: 100%;
	justify-content: space-between;
	flex-wrap: wrap; 
}
.w_box img{
	width: 100%;
	height: auto;
}
.w_box .witem_l {
	width: 30%;
	padding: 2% 2% 5% 0;
}
.w_box .witem_r {
	width: 66%;
	padding: 2% 0 5% 0;
}
.l_link {
	width: 70%;
    font-size: 1.6em;
    line-height: 1.8;
    letter-spacing: 0.05em;
    margin: 15% auto;
    padding: 2%;
    text-align: center;
    border: solid 1px;
}
@media screen and (max-width: 768px) {

	.wks {
		width: 100%;
		margin: 10% auto;
	}
	.w_tit {
		font-size: 1.5em;
		margin: 5% auto;
	}
	.w_tit2 {
		font-size: 0.9em;
		margin: 5% auto 0 auto;
	}
	.w_tex {
		font-size: 1.1em;
		margin: 0 auto;
	}
	.w_box {
		width: 100%;
	}
	.w_box .witem_l{
		width: 100%;
		padding: 2% 0 5% 0;
	}
	.w_box .witem_r{
		width: 100%;
	}
	.w_box .witem2 {
		width: 100%;
		margin: 0 0;
	}
}

/*  テキスト
----------------------------------------------------------- */  

#infotext {
	font-size: 14px;
	list-style: none;
	color: #000000;
	text-align:center;
}
#infotext a{
	color: #808080;
}
#infotext p{
	font-size: 14px;
	list-style: none;
	display:inline;
	letter-spacing: 0.1em;
	line-height: 1.8em;
}
#infotext li{
	padding: 1% 0;
	list-style: none;
	border-bottom: 1px dotted #ddd;
}

.text-13 {
	font-size: 13px;
	letter-spacing: 0.2em;
	line-height: 1.8em;
}
.text-14 {
	font-size: 14px;
}
.text-15 {
	font-size: 15px;
	letter-spacing: 0.2em;
	line-height: 2.2em;
}
.text-16 {
	font-size: 16px;
	line-height: 2.2em;
}
.text-20 {
	font-size: 20px;
}
.text-25 {
	font-size: 25px;
}
.text-30 {
	font-size: 30px;
}
.toptit {
	font-size: 1.5em;
	margin: 2% 0 2% 0;
	text-align:center;
}
.line1 {
    border-bottom: 1px solid #4F7067;
    margin: 0px 0 20px 0;
}
.line2 {
    border-bottom: 1px solid #4F7067;
    margin: 20px 0 0px 0;
}
.shop {
    font-size: 1.4em;
    line-height: 1.8;
	letter-spacing: 0.05em;
    font-weight: bold;
    color: #4F7067;
}


/*  トップへ戻るボタン
----------------------------------------------------------- */ 

/*ボタンの領域*/
#re-top {
	position:fixed; /*画面に固定*/
	bottom:0%; /*画面下へ*/
	right:0%; /*画面右へ*/
	z-index:10; /*レイヤー順序を上に*/
	background-color:transparent; /*領域の背景色（透明）*/
}
/*丸ボタン*/
.re-topB {
	position:relative;
	display:block; 
	background-color:rgba(0,0,0,0.3); /*丸ボタンの色*/
	color:rgb(255,255,255); /*三角と文字色*/
	text-decoration:none;
	font-weight:bold;
	font-size:12px;
	width:50px;
	height:50px;
	text-align:center;
	line-height:20px;
	padding-top:30px;
}
/*三角部分*/
.re-topB:before {
	font-family: FontAwesome;
	content:'\f106';
	position:absolute;
	top:15px;
	left:2px;
	width:100%;
	text-align:center;
	font-size:40px;
}

.center2 {
	text-align: center;
	margin-top: 0px; 
	margin-bottom: 0px;
}

.mlink {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.mlink::before,
.mlink::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.mlink,
.mlink::before,
.mlink::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.mlink {
  background-color: #caac71;
  color: #fff;
}
.mlink:hover {
  background-color: #eedcb3;
  color: #fff;
}


/* header1
----------------------------------------------------------- */  


#header {
	width: 100%;
    margin-top: 0px;  
	background: #fff;
}
#header .logo {
	width: 100%;
	text-align: left;
	padding: 1% 2%;
	position: fixed;
	/* mix-blend-mode:difference; */
	z-index: 200;
	-webkit-filter: drop-shadow(0px 3px 10px rgba(0, 0, 0, 0.8));
    filter: drop-shadow(1px 0 5px #000);
}
#header .logo img{
	width: 20%;
	height: auto;
}

#header .power {
	font-size: 8px;
	text-align: right;
}
#header .power img{
	width: 45%;
	height: auto;
	margin-top: 0px;
	margin-bottom: 0px;
}
#header .power2 {
	font-size: 8px;
	text-align: right;
}
#header .power2 img{
	width: 45%;
	height: auto;
	margin-top: 0px;
	margin-bottom: 0px;
}
#header h1 {
	display: none;
	text-align:center;
	margin: 0;
}

@media screen and (max-width: 767px) {
	
	#header .logo {
		width: 50%;
        padding: 0;
        margin: 3% 0 0 2%;
    }
	#header .logo img{
		width: 100%;
		height: auto;
	}
	#header .power {
		display: none;
	}
	#header .power2 {
		width: 100%;
		text-align: center;
		padding: 15px 0 0 0;
	}
	#header .power2 img{
		width: 60%;
		height: auto;
	}
}

/*  NAVI
----------------------------------------------------------- */

#nav {
	position: absolute;
    right: 0;
    /* float: right; */
    margin: 1.5% 0 0 0;
    z-index: 300;
    background: #fff;
    opacity: 0.8;
    border-radius: 8px 0 0 8px;
}
#nav ul {
	list-style: none;
	margin: auto;
	padding: 0.5em 4em 0.5em 1em;
}
.main-navigation {
	margin: 0 auto;
}

ul.nav-menu,
div.nav-menu > ul {
	margin: 0;
	padding: 0;
}
.nav-menu li {
	display: inline-block;
    position: relative;
    text-align: center;
    margin: 0 0;
    color: #696969;
    font-size: 1.2em;
    letter-spacing: 0.08em;
    text-decoration: none;
    padding: 2px 14px;
}
.menu_item {
	font-size: 1em;
}
.menu-item-description {
	font-size: 0.6em;
	line-height: 1;
	display: block;
}

.nav-menu li a {
	color: #696969;
    display: block;
    font-family: '游ゴシック体', YuGothic, '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'メイリオ', sans-serif;
}
.nav-menu li:hover > a,
.nav-menu li a:hover {
	opacity:0.7;
}
.nav-menu .sub-menu,
.nav-menu .children {
	background-color: #fff;
	display: none;
	padding: 0;
	position: absolute;
	text-align:left;
}
.nav-menu .sub-menu ul,
.nav-menu .children ul {
	border-left: 0;
	left: 100%;
	top: 0;
	text-align:left;
}
ul.nav-menu ul a,
.nav-menu ul ul a {
	color: #696969;
	margin: 0;
	width: 100px;
}
ul.nav-menu ul a:hover,
.nav-menu ul ul a:hover {
	opacity:0.7;
}
ul.nav-menu li:hover > ul,
.nav-menu ul li:hover > ul {
	display: block;
}
.nav-menu .current_page_item > a,
.nav-menu .current_page_ancestor > a,
.nav-menu .current-menu-item > a,
.nav-menu .current-menu-ancestor > a {
	color: #696969;
}

.menu-container {
    position: fixed;
    right: 3%;
    top: 2.5%;
    z-index: 210;
    background-color: rgba(255, 255, 255, 0);
    padding: 10px; /* 内側の余白を追加 */
	
}
.menu {
    display: inline-block; /* ラベルのデフォルトのインライン表示を変更 */
    cursor: pointer; /* カーソルをポインタに変更 */
    position: relative;
    width: 26px;
    height: 20px;
}
.menu__line {
    display: block;
    position: absolute;
    height: 2px;
    width: 30px;
    background-color: black; /* 線の色 */
    transition: transform 0.3s, top 0.3s, bottom 0.3s, scaleX 0.3s;
}
.menu__line--top {
    top: 0;
}
.menu__line--center {
    top: 9px;
}
.menu__line--bottom {
    bottom: 0;
}
.menu__line--top.active {
    top: 8px;
    transform: rotate(45deg);
}
.menu__line--center.active {
    transform: scaleX(0);
}
.menu__line--bottom.active {
    bottom: 10px;
    transform: rotate(135deg);
}


/*gnav*/
.gnav{
    background: rgba(255,255,255,0.9);
    display: none;
    height: 100%;
    position: fixed;
    width: 100%;
    z-index: 105;
}
.gnav__wrap{
    align-items:center;
    display: flex;
    height: 100%;
    justify-content: center;
    position: absolute;
    width: 100%;
}
.gnav__menu__item{
    margin: 40px 0;
}
.gnav__menu__item a{
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
    color: #000000;
    font-size: 1.7em;
    transition: .5s;
	letter-spacing: 0.15em;
	line-height: 3.5;
}
.gnav__menu__item a:hover{
    color: #666;
}

.hero{
    background:url(../3bt-v2/images/hero.jpg) no-repeat;
    background-position: 50% 50%;
    background-size: cover;
}

.sub-menu li{
	padding: 0 0 0 15%;
	position: relative;
}
.sub-menu li :before {
    border-top: 1px solid;
    content: "";
    position: absolute;
    top: 50%;
    left: 0%;
    width: 5%;
}

@media screen and (max-width: 767px) {

    .menu{
		right: 4.5%;
		top: 4%;
		}
}

/* グリッドレイアウト masonry
----------------------------------------------------------- */ 

.js-masonry {
    width: 100%;
}
.width_grid {
    width: 20%;
    margin: 0 0;
}
.width_grid img{
    width: 100%;
    height: auto;
}

@media (max-width: 1500px) {

	.width_grid {
	    width: 25%;
		height: auto;
		margin: 0 0;
	}
}
@media (max-width: 1250px) {

	.width_grid {
	    width: 33.33%;
		height: auto;
		margin: 0 0;
	}
}
@media (max-width: 900px) {

	.width_grid {
	    width: 50%;
		height: auto;
		margin: 0 0;
	}
}
@media (max-width: 767px) {

	.width_grid {
	    width: 50%;
		height: auto;
		margin: 0 0;
	}
}


.imgbox {
	width: auto;
	height: auto;
}

.itemBox{
	display:inline-block;
	position:relative;
}
.itemBoxThumb{
	display:inline-block;
	max-width: 100%;
	max-height: 100%;
}
.post-thumbnail{
	display:inline-block;
	max-width: 100%;
	max-height: 100%;
}
.itemBoxCaption{
	background-color: rgba(0,0,0,0.3);
	color:#FFF;
	padding: 20px 20px 20px 25px;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	opacity:0;
	overflow:scroll;
}
.itemBoxCaption p {
	font-size: 0.85em;
	letter-spacing: 0.1em;
	line-height: 1.8em;
}
.itemBoxCaption:hover{
	opacity:1;
}
::-webkit-scrollbar {
    width: 0px;
}
.item-title {
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
	font-size: 1em;
	letter-spacing: 0.1em;
	line-height: 1.8em;
	padding: 0 2% 0 2%;
}
.item-cat {
	font-size: 0.8em;
	letter-spacing: 0.1em;
	line-height: 1.8em;
	color:#808080;
	padding: 0 2% 0 2%;
}

@media screen and (max-width: 767px) {

    .item-title {
		font-size: 0.8em;
	}
}

/*  コンテンツ
----------------------------------------------------------- */

#content {
    margin: 0 auto;
	padding: 120px 0 0 0;
}

#content .wraper {
    overflow: hidden;
}

/* ページャー */
#next {
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
    font-size: 85%;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
}

#next-archives {
    font-size: 85%;
    text-align: center;
    margin-top: -50px;
    padding-bottom: 30px;
}

.next-pagenavi {
    text-align: center;
    margin-top: 20px;
	margin-bottom: 20px;
}

/* ページャー（テーマオリジナル） */

.pager{
	width: 100%;
	margin: 20px 0 20px 0;
	text-align:center;
}




/*about*/
.about {
    display: flex;
	width: 100%;
	margin: 0 0 0 0;
	align-content: space-between;
	flex-wrap: wrap;
	padding: 100px 0 80px 0;
}
.about__box1 {
    width: 50%;
}
.about__box1 img{
    width: 100%;
	height: auto;
}
.about__box2 {
    width: 50%;
}
.about__content {
    align-items: center;
    padding: 0 0 0 10%;
}
.small-title {
    font-size: 1.5em;
    font-weight: bold;
    color: #d6cc54;
    letter-spacing: 0.1em;
    padding-left: 70px;
    margin-top: 0px;
    position: relative;
}
.small-title::before {
    content: '';
    width: 50px;
    height: 1px;
    background: #d6cc54;
    position: absolute;
    top: 23px;
    left: 0;
}
.medium-title {
    font-size: 3em;
    font-weight: bold;
    line-height: 1.4;
}
.medium-title2 {
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 20px;
    line-height: 1.4;
}
.about__text {
    width: 100%;
	line-height: 1.7;
}


@media (max-width: 767px) {

	.about {
		width: 100%;
		margin-bottom: 5%;
		padding: 100px 3% 80px 3%;
	}
	.about__box1 {
		width: 100%;
		padding: 0 0;
	}
	.about__box2 {
		width: 100%;
		padding: 0 0;
	}
	.about__content {
		align-items: center;
		padding: 5% 0 0 0;
	}
	.small-title {
		font-size: 1.2em;
		margin-bottom: 0px;
	}
	.small-title::before {
		top: 18px;
	}
	.about__text {
		width: 100%;
	}
}




.w_slide {
    width: 100%;
    height: auto;
    margin: 0 auto;
	text-align: center;
}
.w_slide img{
    width: 100vw;
    height: auto;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
	
	.w_slide {
		width: 90%;
	}
	.w_slide img{
		height: auto;
	}
}



/* シングルPAGE
----------------------------------------------------------- */ 

.tit {
	margin: 0px 0 5% 0;
    font-size: 1.6em;
    font-weight: bold;
    line-height: 1.4;
}
.infobox {
    padding: 10px 0;
    overflow: hidden;
	border-bottom: solid 1px;
}
.cat a img {
    margin: 1% 0% 1% 0%;
	height: 30px;
	width: auto;
}
.date {
	color: #58595B;
    font-size: 14px;
	letter-spacing: 1px;
}
.tag a {
	text-decoration:none;
	color: #000000;
    font-size: 13px;
	letter-spacing: 1px;
}

.container_news {
    margin-top: 35px;
    margin-top: 60px;
}
.container_news img {
    height: 100%;
}
.par_news {
    font-size: 11px;
    line-height: 3;
}
.img_news {
    margin-top: 10px;
}
.back_post {
    float: left;
}
.next_post {
    float: right;
}
.box_href {
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
    padding-bottom: 10px;
}
.box_href a {
    text-decoration: none;
    color: #000;
    font-size: 15px;
}
.box_href a:hover {
    text-decoration: underline;
}
.box_right {
    display: none;
    text-align: right;
}
.box_right .img_feature {
    float: right;
    width: 98px;
    height: 78px;
}
.box_right .img_feature img {
    text-align: center;
    max-width: 100%;
    max-height: 100%;
}
#content .list_page li {
    width: 100%;
    padding-right: 10px;
    display: inline;
    margin-bottom: 7px;
}

#content .list_page li a {
    letter-spacing: 1px;
    text-decoration: none;
    font-weight: bold;
    font-size: 11px;
    color: #000;
}

#content .list_page li a:hover {
    text-decoration: underline;
}
.title_list {
    text-align: center;
    font-size: 11px;
    margin-bottom: 10px;
    margin-top: 20px;
}


/* SP
----------------------------------------------------------- */

@media (max-width: 767px) {
	body,html {
		width: 100%;
	}
    .pc {
        display: none!important;
    }
    .sp {
        display: block!important;
    }
	#content {
		padding: 60px 0 0 0;
	}
	#content .wraper .sidebar {
		width: 90%!important;
		position: fixed;
		height: 90%!important;
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
		right: 15px;
		top: 10%;
		display: none;
		padding-bottom: 100px;
	}
    #content .row_list ul li, #content .row_icon ul li {
        margin: 0!important;
        width: 50%!important;
    }
    .fixed {
	  position: fixed;
	  width: 100%;
	  height: 100%;
	}
	.img_side {
		display: none;
	}
	.bx-has-pager {
		display: none;
	}
	#content .wraper .content_left {
	    width: 100%;
	    float: none;
	}
	#content .wraper .row_another .list_other li {
	    width: 100%;
		min-height: inherit;
	}
	#content .wraper .row_another .list_other li .img_other {
	    width: 100%;
	    height: auto;
	}
	#content .wraper .row_another .list_other li .sub_other {
	    display: block;
	    margin-top: 10px;
	}
	.cat_news a {
        display: inline-block;
	}
	#content .wraper .row_another .list_other li .img_other img {
	   max-width: 100%;
	   width: 100%;
	   height: auto;
	   min-height: auto;
	   max-height: auto!important;
	   position: static;
	}
	#content .wraper .row_another .sub_other .title_other {
	   font-size: 10pt;
	}
	
	
	/*contents*/
	#content .wraper .content_left {
        width: 100%;
        float: none;
    }
    .content_detail {
        width: 100%!important;
        padding: 20px;
    }
    .container_news {
        width: 100%!important;
        border-top: 1px solid #e9e9e9;
        margin-top: 30px;
    }
    .box_left {
        display: block;
        width: 100%;
    }
    .box_right {
        display: none;
    }
    .content_detail .tag_news {
        margin-bottom: 30px;
    }
    .movie-wrap iframe {
        width: 100%;
    }
	#footer .foot_right {
	float: none;
    }
    #footer .foot_right ul {
	display: inline-block;
    }
    #footer .foot_right ul li {
	display: inline-block;
	float: none;
	margin-bottom: 12px;
    }
	iframe {
		max-width: 100%;
		height: 350px;
		margin: 0 0 5% 0;
	}
	/*シングルtit*/
	.tit {
    font-size: 1.6em;
    font-weight: bold
	}
}


/* footer
----------------------------------------------------------- */   
   
#footer {
	width: 100%;
	margin-top: 40px;
	padding-bottom: 0px;
	overflow: hidden;
}
#footer .push {
	height: 50px;
}
#footer .foot_in {
	margin-bottom: 40px;
}
#footer .foot_left {
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
	text-align: left;
	font-size: 13px;
	line-height: 3;
	letter-spacing: 1px;
}
#footer .foot_left a{
	color: #000000;
}
#footer .foot_right {
	/* font-family: 'Rubik', sans-serif;*/
	/* font-style: italic;*/
    font-size: 1em;
	float: right;
	text-align: right;
	line-height: 3;
	letter-spacing: 0.5px;
}

@media screen and (max-width: 768px) {

	#footer {
		padding: 0 3% 9px 3%;
	}
	#footer .foot_left {
	}
	#footer .foot_right {
		float: unset;
		text-align: center;
		bottom: 0;
		position: relative;
		display: block;
		margin: 10% 0 0 0;
	}
}



/* 記事
----------------------------------------------------------- */
.content_detail {
    width: 100%;
    padding: 35px;
    background: #fff;
}
.box_left {
    display: table-cell;
    width: 85%;
    vertical-align: top;
}
.box_left .title_news {
    font-size: 30px;
    font-weight: bold;
} 
.row_title {
    width: 100%;
    overflow: hidden;
    display: table;
}
.content_detail #nav #navleft {
	float: left;
}
.content_detail #nav #navleft:before {
	content:'＜';
	margin-right: 0.5em;
	color: #999;
}
.content_detail #nav #navright {
	float: right;
	text-align: right;
}
.content_detail #nav #navright:after {
	content:'＞';
	margin-left: 0.5em;
	color: #999;
}
.container_news .post-data a {
	color: #575757;
}
.container_news .post-data a:hover {
	color: #999;
}

#blog-foot { /* パンくず */
	/* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
	margin: 2% 0 0 0;
	padding: 0px 5px 2px 3px;
	color:#999;
}

@media screen and (max-width: 768px) {

	#blog-foot { /* パンくず */
	margin: 10% 0 0 0;
	color:#999;
	}
}


/* 固定ページ
----------------------------------------------------------- */
.page_detail {
    width: 100%;
	margin-top: 2%;
    padding: 10px 0px 0px 0px;
}
.content_detail .txt-c {
	font-size: 1.5em;
	line-height: 2em;
	text-align: center;
}

.content_detail .photo-lib li img{
	height: auto;
	width: 100%;
}

@media screen and (max-width: 768px) {

	.page_detail {
		margin-top: 15%;
	}
}


/* ==========================================================================
   レスポンシブページネーション
   ========================================================================== */
   
.pagination{
  list-style-type: none;
  padding-left: 0;
  margin: 30px 0;
}

.pagination,
.pagination li a {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.pagination a {
  font-weight: 300;
  padding-top: 1px;
  text-decoration:none;
  border: 1px solid #ddd;
  border-left-width: 0;
  min-width:36px;
  min-height:36px;
  color: #333;
}

.pagination li:not([class*="current"]) a:hover {
  background-color: #eee;
}

.pagination li:first-of-type a {
  border-left-width: 1px;
}

.pagination li.first span,
.pagination li.last span,
.pagination li.previous span,
.pagination li.next span {
  /* screen readers only */
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.pagination li.first a::before,
.pagination li.last a::after,
.pagination li.previous a::before,
.pagination li.next a::after {
  display: inline-block;
  font-family: Fontawesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}

.pagination li.first a::before { content: "\f100"; }
.pagination li.last a::after { content: "\f101"; }

.pagination li.previous a::before { content: "\f104"; }
.pagination li.next a::after { content: "\f105"; }

.pagination li.current a {
 background-color: #ddd;
 cursor: default;
 pointer-events: none;
}

.pagination > li:first-child > a {
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
}

.pagination > li:last-child > a {
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px;
}
#post .section .post-data {
	margin-bottom: 1em;
}
.addtoany_list {
	display: inline-block !important;
	margin-bottom: 3em;
}



/* instashow-gallery　マウスオンカラー
---------------------------------------------------- */
.instashow-gallery .instashow-gallery-media-cover {
    background: #808080 !important;
}

.instashow-gallery .instashow-gallery-control-arrow::after, .instashow-gallery .instashow-gallery-control-arrow::before {
    background: #808080 !important;
}

/* fadein
---------------------------------------------------- */
.fadein {
opacity : 0;
transform: translateY(20px);
transition: all 1s;
}

/* SNS-box
---------------------------------------------------- */

.sns_box {
  top: 22%;
  left: 5%;
  transform: translateX(-50%);
  margin: auto;
  position: fixed;
  z-index: 100;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.sns_button {
  border-radius: 50%;
  transition: all 280ms ease;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-bottom: 15px;
}

.sns_button a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: #3e3a39;
  text-align: center;
  vertical-align: middle;
  transition: all 280ms ease;
}

.sns_button i {
  font-size: 20px;
  padding: 0;
}

.sns_button:hover {
  box-shadow: inset 0 0 0 22px #3e3a39;
  color: #fff;
}

.instagram:hover a,
.mail:hover a,
.calendar:hover a {
  color: #fff;
}

.txx {
    font-size: 1em;
    line-height: 1.2;
    letter-spacing: 0.05em;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(90deg);
    white-space: nowrap;
    position: fixed;
    top: 150%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(90deg);
	background-color: rgba(255, 255, 255, 0.8);
    padding: 10px 10px;
    z-index: 300;
}

@media screen and (max-width: 768px) {
	
	.txx {
		font-size: 1.2em;
        top: 8%;
        right: 25%;
        transform: translate(25%, -100%) rotate(0deg);
        background-color: rgba(255, 255, 255, 0.8);
        padding: 10px 0;
	}
}

.bogo-language-switcher {
  display: flex;
  align-items: center;
  justify-content: center;
}

.bogo-language-switcher li {
  margin: 0 5px;
}

.bogo-language-switcher li:not(:last-child)::after {
  content: '/';
  margin-left: 5px;
}


@media screen and (max-width: 768px) {

	.sns_button {
		float: left;
		border-radius: 100%;
		-moz-transition: all 280ms ease;
		-o-transition: all 280ms ease;
		-webkit-transition: all 280ms ease;
		transition: all 280ms ease;
	}
	.sns_button a {
		display: table-cell;
		width: 44px;
		height: 44px;
		color: #000;
		text-align: center;
		vertical-align: middle;
		-moz-transition: all 280ms ease;
		-o-transition: all 280ms ease;
		-webkit-transition: all 280ms ease;
		transition: all 280ms ease;
	}
	.sns_button + .sns_button {
		margin: 0 0 0 15px;
}
}
	

	
	

/*  PHPメール
----------------------------------------------------------- */ 

#formWrap {
	width:100%;
	margin:0 auto;
	color:#555;
	line-height:120%;
	font-size:90%;
}
table.formTable{
	width:100%;
	margin:0 auto;
	border-collapse:collapse;
}
table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:10px;
}
table.formTable th{
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
}

/*プライバシーポリシー*/
.box1 {
	height: 250px;
	margin:2em auto;
	padding:2em;/*内側余白*/
	border:solid 1px #A5A19A;/*線の種類・太さ・色*/
	overflow: scroll;
}
.pp_tm1{
	font-size: 1.8em;
    margin: 0 auto 6% auto;
}
.pp_tt1{
	font-size: 1.4em;
    font-weight: bold;
    line-height: 1.8;
    margin: 2% auto;
}
.pp_tx1{
	font-size: 1em;
    line-height: 2;
    color: #000;
    margin: 2% auto 0 auto;
}
#formWrap input[type="text"] {
	cursor: pointer;
	padding: 1% 2%;
}
#formWrap input[type="submit"] {
    cursor: pointer;
	padding: 1% 2%;
}
#formWrap input[type="reset"]{
    cursor: pointer;
	padding: 1% 2%;
}
#formWrap select {
    cursor: pointer;
	padding: 1% 2%;
}
/*　簡易版レスポンシブ用CSS（必要最低限のみとしています。ブレークポイントも含め自由に設定下さい）　*/
@media screen and (max-width:572px) {

	.box1 {
		padding:2em 1em;/*内側余白*/
	}
#formWrap {
	width:100%;
	margin:0 auto;
}
table.formTable th, table.formTable td {
	width:auto;
	display:block;
}
table.formTable th {
	margin-top:5px;
	border-bottom:0;
}
form input[type="text"], form textarea {
	width:96%;
	padding:5px;
	font-size:110%;
	display:block;
}
form input[type="submit"], form input[type="reset"], form input[type="button"] {
	display:block;
	width:100%;
	height:40px;
}
}


.timg img{
	position:relative;
	width: 100%;
	height: 100vh;
	object-fit: cover;
}
.timg_logo {
	position: absolute;
	width: 25%;
	height: auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.timg_logo img{
	width: 100%;
	height: auto;
}

@media screen and (max-width: 767px) {

	.timg img{
		height: 90vh;
	}
	.timg_logo {
		width: 40%;
		height: auto;
	}
	.timg_logo img{
		width: 100%;
		height: auto;
	}
}


.fade_slide {
	opacity: 0;
	transition: opacity .3s linear;
}
.fade_slide.slick-initialized{
	opacity: 1;
}
@keyframes fadezoom {
  0% {
	  transform: scale(1);
  }
  100% {
	  transform: scale(1.15); /* 拡大率 */
  }
}
.add-animation {
	animation: fadezoom 10s linear 0s normal both;
}



.w100 {
    width: 100%;
    margin: 0 auto;
}
.w80 {
    width: 60%;
    margin: 0 auto;
}
.right {
	text-align: right;
}
.ttit {
    /* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
    font-size: 2.4em;
    line-height: 1.8;
    letter-spacing: 0.05em;
    /* margin: 3% 0 0 0; */
    color: #736d71;
}
.btit {
    /* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
    font-size: 2.4em;
    line-height: 1.8;
    letter-spacing: 0.05em;
    color: #fff;
}
.tmid {
    font-family: 'Noto Sans JP', sans-serif;
	/* font-style: italic;*/
    font-size: 1em;
    line-height: 1.8;
    letter-spacing: 0.05em;
    margin: -1% 0 2% 0;
    color: #736d71;
}
.ttx {
    font-family: 'Noto Sans JP', sans-serif;
	/* font-style: italic;*/
    font-size: 1.2em;
    line-height: 1.8;
    letter-spacing: 0.05em;
}
/*flexbox*/
.tcbx {
	display: flex;
	width: 100%;
	align-content: space-between;
	flex-wrap: wrap;
	margin: 0 auto;
	padding: 6% 0 0 0;
}
.tcbx .tc1 {
	width: 30%;
	height: auto;
}
.tcbx .tc2 {
	width: 70%;
	height: auto;
}

@media screen and (max-width: 767px) {

	.w80 {
		width: 90%;
	}
	.ttit {
		font-size: 2.4em;
	}
	.tmid {
		font-size: 0.8em;
	}
	.ttx {
		font-size: 1em;
	}
	.tcbx {
		width: 100%;
	}
	.tcbx .tc1 {
		width: 100%;
		margin: 5% auto;
		text-align: left;
	}
	.tcbx .tc2 {
		width: 100%;
		margin: 0 auto 5% auto;
		text-align: left;	
	}
}


/*  404
----------------------------------------------------------- */ 

.c404 { 
	background-color: #f5f5f5;
    color: #fff;
    height: 80vh;
}
.button {
    color: #000;
    background: #f5f5f5;
    font-size: 1.2em;
    text-decoration: none;
    border: 1px solid #000;
    padding: 0.5em 1em;
    border-radius: 3px;
    margin: 5% auto;
    transition: all .3s linear;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
}
.button:hover {
	background-color: #007aff;
	color: #fff;
}
.t404 {
  text-align: center;
  font-size: 15em;
  font-weight: 100;
  text-shadow: #0062cc 1px 1px, #0062cc 2px 2px, #0062cc 3px 3px, #0062cd 4px 4px, #0062cd 5px 5px, #0062cd 6px 6px, #0062cd 7px 7px, #0062ce 8px 8px, #0063ce 9px 9px, #0063ce 10px 10px, #0063ce 11px 11px, #0063cf 12px 12px, #0063cf 13px 13px, #0063cf 14px 14px, #0063cf 15px 15px, #0063d0 16px 16px, #0064d0 17px 17px, #0064d0 18px 18px, #0064d0 19px 19px, #0064d1 20px 20px, #0064d1 21px 21px, #0064d1 22px 22px, #0064d1 23px 23px, #0064d2 24px 24px, #0065d2 25px 25px, #0065d2 26px 26px, #0065d2 27px 27px, #0065d3 28px 28px, #0065d3 29px 29px, #0065d3 30px 30px, #0065d3 31px 31px, #0065d4 32px 32px, #0065d4 33px 33px, #0066d4 34px 34px, #0066d4 35px 35px, #0066d5 36px 36px, #0066d5 37px 37px, #0066d5 38px 38px, #0066d5 39px 39px, #0066d6 40px 40px, #0066d6 41px 41px, #0067d6 42px 42px, #0067d6 43px 43px, #0067d7 44px 44px, #0067d7 45px 45px, #0067d7 46px 46px, #0067d7 47px 47px, #0067d8 48px 48px, #0067d8 49px 49px, #0068d8 50px 50px, #0068d9 51px 51px, #0068d9 52px 52px, #0068d9 53px 53px, #0068d9 54px 54px, #0068da 55px 55px, #0068da 56px 56px, #0068da 57px 57px, #0068da 58px 58px, #0069db 59px 59px, #0069db 60px 60px, #0069db 61px 61px, #0069db 62px 62px, #0069dc 63px 63px, #0069dc 64px 64px, #0069dc 65px 65px, #0069dc 66px 66px, #006add 67px 67px, #006add 68px 68px, #006add 69px 69px, #006add 70px 70px, #006ade 71px 71px, #006ade 72px 72px, #006ade 73px 73px, #006ade 74px 74px, #006bdf 75px 75px, #006bdf 76px 76px, #006bdf 77px 77px, #006bdf 78px 78px, #006be0 79px 79px, #006be0 80px 80px, #006be0 81px 81px, #006be0 82px 82px, #006be1 83px 83px, #006ce1 84px 84px, #006ce1 85px 85px, #006ce1 86px 86px, #006ce2 87px 87px, #006ce2 88px 88px, #006ce2 89px 89px, #006ce2 90px 90px, #006ce3 91px 91px, #006de3 92px 92px, #006de3 93px 93px, #006de3 94px 94px, #006de4 95px 95px, #006de4 96px 96px, #006de4 97px 97px, #006de4 98px 98px, #006de5 99px 99px, #006ee5 100px 100px, #006ee5 101px 101px, #006ee6 102px 102px, #006ee6 103px 103px, #006ee6 104px 104px, #006ee6 105px 105px, #006ee7 106px 106px, #006ee7 107px 107px, #006ee7 108px 108px, #006fe7 109px 109px, #006fe8 110px 110px, #006fe8 111px 111px, #006fe8 112px 112px, #006fe8 113px 113px, #006fe9 114px 114px, #006fe9 115px 115px, #006fe9 116px 116px, #0070e9 117px 117px, #0070ea 118px 118px, #0070ea 119px 119px, #0070ea 120px 120px, #0070ea 121px 121px, #0070eb 122px 122px, #0070eb 123px 123px, #0070eb 124px 124px, #0071eb 125px 125px, #0071ec 126px 126px, #0071ec 127px 127px, #0071ec 128px 128px, #0071ec 129px 129px, #0071ed 130px 130px, #0071ed 131px 131px, #0071ed 132px 132px, #0071ed 133px 133px, #0072ee 134px 134px, #0072ee 135px 135px, #0072ee 136px 136px, #0072ee 137px 137px, #0072ef 138px 138px, #0072ef 139px 139px, #0072ef 140px 140px, #0072ef 141px 141px, #0073f0 142px 142px, #0073f0 143px 143px, #0073f0 144px 144px, #0073f0 145px 145px, #0073f1 146px 146px, #0073f1 147px 147px, #0073f1 148px 148px, #0073f1 149px 149px, #0074f2 150px 150px, #0074f2 151px 151px, #0074f2 152px 152px, #0074f3 153px 153px, #0074f3 154px 154px, #0074f3 155px 155px, #0074f3 156px 156px, #0074f4 157px 157px, #0074f4 158px 158px, #0075f4 159px 159px, #0075f4 160px 160px, #0075f5 161px 161px, #0075f5 162px 162px, #0075f5 163px 163px, #0075f5 164px 164px, #0075f6 165px 165px, #0075f6 166px 166px, #0076f6 167px 167px, #0076f6 168px 168px, #0076f7 169px 169px, #0076f7 170px 170px, #0076f7 171px 171px, #0076f7 172px 172px, #0076f8 173px 173px, #0076f8 174px 174px, #0077f8 175px 175px, #0077f8 176px 176px, #0077f9 177px 177px, #0077f9 178px 178px, #0077f9 179px 179px, #0077f9 180px 180px, #0077fa 181px 181px, #0077fa 182px 182px, #0077fa 183px 183px, #0078fa 184px 184px, #0078fb 185px 185px, #0078fb 186px 186px, #0078fb 187px 187px, #0078fb 188px 188px, #0078fc 189px 189px, #0078fc 190px 190px, #0078fc 191px 191px, #0079fc 192px 192px, #0079fd 193px 193px, #0079fd 194px 194px, #0079fd 195px 195px, #0079fd 196px 196px, #0079fe 197px 197px, #0079fe 198px 198px, #0079fe 199px 199px, #007aff 200px 200px;
}

.col_box {
	position: absolute;
    margin: 2% auto;
    padding: 1% 88px 1% 3%;
    text-align: left;
    bottom: 2%;
    background: #fff;
    opacity: 0.8;
    border-radius: 8px 0 0 8px;
    right: 0;
}
#col_text p{
	font-size: 1em;
	list-style: none;
	display:inline;
	letter-spacing: 0.1em;
	line-height: 1.8em;
}
#col_text li{
	font-family: 'Noto Sans JP', sans-serif;
    list-style: none;
    line-height: 1.8;
}
span.newMark {
    color: #ffffff;
    font-size: 0.8em;
    background: #504946;
    position: relative;
    top: -2px;
    display: inline-block;
    margin-left: 10px;
    padding: 1px 10px;
}
@media (max-width: 767px) {

	.col_box {
		width: 100%;
		margin: 5% auto;
		padding: 0 0;
		display: inline-block;
	}
	#col_text li{
		padding: 4% 0;
		list-style: none;
		line-height: 1.8;
	}
}


/*  MW WP Form
----------------------------------------------------------- */  

.cfmd {
	font-family: '游ゴシック体', YuGothic, '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'メイリオ', sans-serif;
	font-size: 1.4em;
	font-weight: bold;
	letter-spacing: 0.1em;
	color: #000;
    text-align: center;
	background: #FFF03C;
	padding: 4% 0;
	margin: 11% auto 5% auto;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}
.cform th {
	width: 30%;
	text-align:left;
	color:#444;
	padding:2%;
	background:#f7f7f7;
	border:solid 1px #d7d7d7;
}
.cform td {
	width: 70%;
	font-size: 1.1em;
	border:solid 1px #d7d7d7;
	text-align: left;
	padding:2%;
}
.cform {
	width: 100%;
	margin: auto;
}
.cform [type=submit] {
	display: inline-block;
	font-size: 20px;
	padding: 10px 30px;
	text-decoration: none;
	background: #ff8f00;
	color: #FFF;
	border-bottom: solid 4px #B17C00;
	border-radius: 3px;
}
.cform option,
.cform textarea,
.cform input[type=text],
.cform input[type=email],
.cform input[type=search],
.cform input[type=url] {
	width: 100%;
	font-size: 0.9em;
	padding: 3% 0 3% 1%;
}
.cform select{
	width: 100%;
	font-size: 0.9em;
	padding: 4% 0 4% 1%;
}
.cform .error {
	font-size: 0.8em;
	line-height: 1.8;
	text-align: right;
}
.cform text{
	font-size: 1.1em;
	border:solid 1px #d7d7d7;
	text-align: left;
	padding:2%;
}
/*横の行とテーブル全体*/
.entry-content .cform tr,.entry-content table{
 border:solid 1px #d7d7d7;	
}
.required-srt {
	font-size: 8pt;
	padding: 5px;
	background: #000;
	color: #fff;
	border-radius: 2px;
	margin-right: 10px;
	vertical-align: middle;
}
.any {
    font-size: 8pt;
	padding: 5px;
    background: #a9a9a9;
    color: #fff;
    border-radius: 2px;
    margin-right: 10px;
    vertical-align: middle;
}
.cfbx{
	width: 100%;
	background: #dcdcdc;
	padding: 3%;
}
.cfth{
	font-size: 1em;
	line-height: 2.4;
}

@media only screen and (max-width:767px) {

	.cfmd {
		margin: 14% auto 10% auto;
	}
	.cform th,
	.cform td {
		width: 100%;
		display: block;
	}
}
.submit-btn input {
	background: #00142c;
	width: 60%;
	max-width: 550px;
	min-width: 220px;
	margin: 30px auto;
	display: block;
	border: 1px #00142c solid;
	text-align: center;
	padding: 5px;
	color: #fff;
	transition: all 0.4s ease;
}

.submit-btn input:hover {
	background: #fff;
	color: #00142c;
}


/*  parallax
----------------------------------------------------------- */

.parallax_c{
  min-height: 400px;
  background-position: center top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}
.front_c{
  padding: 60px;
  background-color: #fff;
}
.parallax_c.img_bg_01{
  background-image: url();
}
.parallax_c.img_bg_02{
  background-image: url();
}
.parallax_c.img_bg_03{
  background-image: url();
}

@media screen and (max-width: 768px){
  .parallax_c{
    height: 100%;
    background-image: none;
  }
  .parallax::before{
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    -webkit-transform: translate3d(0, 0, -1px);
    transform: translate3d(0, 0, -1px);
    width: 100%;
    min-hieght: 100%;
    -webkit-background-size: cover;
    background-size: cover;
    z-index: -1;
  }
  .parallax_c.img_bg_01::before{
    background-image: url();
  }
  .parallax_c.img_bg_02::before{
    background-image: url();
  }
  .parallax_c.img_bg_03::before{
    background-image: url();
  }
}

/*  plan
----------------------------------------------------------- */

.wplan {
    width: 80%;
    margin: 2% auto;
	padding: 0 7%;
}
.planm {
    margin-top: 5%;
}
.plan {
  border-collapse: collapse;
  margin: 0 auto;
  padding: 0;
  width: 1000px;
  table-layout: fixed;
}
.plan tr {
  /*background-color: #fff;*/
  padding: .35em;
  border: 2px solid #fff;
}
.plan tr:last-child{
  border: none;
}
.plan th{
  padding: 2em;
  border-right: 2px solid #fff;
}
.plan td {
  padding: 1em .5em;
  border-right: 2px solid #fff;
  text-align: center;
}
.plan th {
  font-size: .85em;
}
.plan thead tr{
  background-color: #736d71;
  color:#fff;
}
.plan tbody th {
    border-right: 2px solid #fff;
}
th.non {
    border-right: none;
}
.txt{
   text-align: left;
   font-size: .85em;
}
.price{
  color: #000;
  font-weight: bold;
  font-size:1.3em
}
.price span {
    font-size: .6em;
}
.red_bk{
  background:#e81010;
}
.red-txt{
  color:#e81010;
}

@media screen and (max-width: 600px) {
	
	.wplan {
		width: 90%;
		margin: 5% auto;
		padding: 0 0;
	}
	.wrap {
		overflow-x: scroll;
	}
}

/*  btn
----------------------------------------------------------- */

.btn_c {
	width: 100%;
	margin: auto;
	background: #c0c0c0;
}
/* .btn_c {
    background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
    box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75);
} */
.btn_c span{
	display: block;
    text-align: center;
    margin: auto;
    color: #3e3a39;
    transition: 0.5s;
	padding: 5% 0;
}
.btn_c span:hover {
	color: #fff;
	background: #87cefa;
}
.btntt {
    /* font-family: 'Rubik', sans-serif;*/
    /* font-style: italic;*/
    font-size: 2em;
    line-height: 1.8;
    letter-spacing: 0.05em;
    /* margin: 3% 0 0 0; */
    color: #736d71;
}
@media screen and (max-width: 768px){

	.btn_c span{
		padding: 10% 0;
	}
}

.bn_k {
	width: 100%;
	margin: auto;
	background-image: url("img/sl_04.webp");
	background-size: cover;
}
.bn_k span{
	display: block;
    text-align: center;
    margin: auto;
    color: #fff;
    transition: 0.5s;
	padding: 5% 0;
}
.bn_k span:hover {
	color: #3e3a39;
	background: #fff;
	opacity: 0.6;
}

@media screen and (max-width: 768px){

	.bn_k span{
		padding: 10% 0;
	}
}

.bn_w {
	width: 100%;
	margin: auto;
	background-image: url("img/sl_01.webp");
	background-size: cover;
}
.bn_w span{
	display: block;
    text-align: center;
    margin: auto;
    color: #3e3a39;
    transition: 0.5s;
	padding: 5% 0;
}
.bn_w span:hover {
	color: #3e3a39;
	background: #fff;
	opacity: 0.6;
}

@media screen and (max-width: 768px){

	.bn_w span{
		padding: 10% 0;
	}
}


/* fadein
---------------------------------------------------- */
.fadein {
opacity : 0;
transform: translateY(20px);
transition: all 1s;
}


/* Muuriのレイアウトのための調整
---------------------------------------------------- */

.grid {
	position: relative;/*並び替えの基準点を指定*/
}

/*各画像の横幅などの設定*/
.item {
	display: block;
	position: absolute;
	width: 18%;/*横並びで5つ表示*/
	margin:0 1% 2% 1%;/*画像に余白をつける*/
	z-index: 1;
	list-style:none;
}

/*内側のボックスの高さが崩れないように維持*/
.item-content {
	position: relative;
	width: 100%;
	height: 100%;
}

/*画像の横幅を100%にしてレスポンシブ化*/
.grid img{
	width:100%;
	height:auto;
	vertical-align: bottom;/*画像の下にできる余白を削除*/
}

/*横幅が1800px以下になった際の指定*/
@media only screen and (max-width: 1800px) {

	.item {
		width: 23%;/*横並びで4つ表示*/
		margin:0 1% 2% 1%;
	}
}
/*横幅が1500px以下になった際の指定*/
@media only screen and (max-width: 1500px) {

	.item {
		width: 31.333%;/*横並びで3つ表示*/
		margin:0 1% 2% 1%;
	}
}
/*横幅が900px以下になった際の指定*/
@media only screen and (max-width: 900px) {

	.item {
		width: 46%;/*横並びで2つ表示*/
    margin: 0 2% 2% 2%;
	}
}
/*横幅が768px以下になった際の指定*/
@media only screen and (max-width: 768px) {

	.item {
		width: 48%;/*98%*/
		 margin: 0 1% 2% 1%;/*0 1% 2% 1%*/
	}
}


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

.cbg1 {
    width: 100%;
    background-color: #fff;
    padding: 4% 0;
}
@media screen and (max-width: 767px) {

	.cbg1 {
        padding: 15% 0;
    }
}
.cont1 {
	width: 100%;
    height: auto;
    padding: 5% 0 0 10%;
}
.cont2 {
	width: 100%;
    height: auto;
    padding: 0 0 0 10%;
}
.cont3 {
	width: 100%;
    height: auto;
    padding: 10% 0 0 10%;
}
.cmd1 {
    font-size: 1.6em;
    padding: 0.15em 1em;
    border-left: solid 6px #3e3a39;
    background: transparent;
}
.cobx {
	display: flex;
	width: 100%;
	justify-content: space-between;
    flex-wrap: wrap;
}
.cobx .co2 {
	width: 48%;
	height: auto;
	text-align: left;
	margin-bottom: 3%;
}
.cobx .cotx1 {
	padding: 2%;
}

@media screen and (max-width: 767px) {

	.cont1 {
		width: 96%;
		height: auto;
		margin: 0 auto;
		padding: 15% 0 0 0;
	}
	.cont2 {
		width: 96%;
		height: auto;
		margin: 0 auto;
		padding: 0 0;
	}
	.cont3 {
		width: 96%;
		height: auto;
		margin: 0 auto;
		padding: 20% 0 0 0;
	}
	.cobx {
		width: 100%;
		flex-direction: column;
	}
	.cobx .co2 {
		width: 100%;
	}
    .cobx .co2:nth-child(3) {
        order: 4; 
    }
	.cobx .co2:nth-child(4) {
        order: 3;
    }
	.cobx .co2:nth-child(5) {
        order: 5;
    }
	.cobx .co2:nth-child(6) {
        order: 6;
    }
	
}

.btn01 {
    font-size: 1.4em;
	letter-spacing: 0.05em;
    cursor: pointer;
	transition: background-color 0.3s;
	background: #fff;
    border: 1px solid #000;
    color: #000;
	display: inline-block;
    text-align: center;
    padding: 4px 20px;
	margin: 5% auto 10% auto;
}
.btn01:hover {
	color: #fff;
    background: #000;
	border: 1px solid #000;
}

.rmbx {
    display: flex;
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 0 3%;
}
.rmbx .rm2 {
    width: calc(48% - 10px); /* 幅を調整して余白を考慮 */
    height: auto;
    text-align: left;
    margin-bottom: 3%;
    box-sizing: border-box; /* ボックスモデルを border-box に設定 */
}

.rmbx .rmtx1 {
    padding: 2%;
}
.rmbx .rmtx2 {
    padding: 2%;
}
.rmbx .rmmd1 {
    font-size: 1.6em;
    padding: 0.15em 0;
}
.rmbx .rmmd2 {
    font-size: 1.4em;
    padding: 0.15em 0;
}
@media screen and (max-width: 767px) {

	.rmbx {
		width: 94%;
        margin: 5% auto;
        padding: 0 0;
	}
	.rmbx .rm2 {
        width: 100%; /* レスポンシブ時には100%幅にする */
        margin-bottom: 5%; /* マージンの調整 */
    }
}


/* POPUP
---------------------------------------------------- */

.showDetailsBtn {
    font-size: 1.4em;
	letter-spacing: 0.05em;
    cursor: pointer;
	transition: background-color 0.3s;
	background: #fff;
    border: 1px solid #000;
    color: #000;
	display: inline-block;
    text-align: center;
    padding: 8px 20px;
	margin: 5% auto 10% auto;
}
.showDetailsBtn:hover {
	color: #fff;
    background: #000;
	border: 1px solid #000;
}
.popup {
    display: none; /* デフォルトでは非表示 */
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5); /* 背景の暗さ */
}
.popup-content {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    max-height: 90vh;
    overflow-y: auto;
    background-color: #fff;
    padding: 0 20px 20px 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.close {
    color: #aaa;
    position: absolute;
    right: 20px;
    top: 20px;
    font-size: 16px;
    font-weight: bold;
    background: none;
    border: none;
    cursor: pointer;
}
.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}
.close-btn {
	font-size: 2em;
	display: block;
    text-align: right;
}

/* PC画面の場合 */
@media (min-width: 600px) {
    .popup-content {
        width: 70%;
		max-height: 80vh;
		padding-bottom: 5%;
    }
}

/* スマートフォン画面の場合 */
@media (max-width: 599px) {
    .popup-content {
        width: 80%;
		max-height: 80vh;
		padding-bottom: 15%;
    }
}

.acf-map {
    width: 100%;
    height: 400px;
}
.acf-map img {
   max-width: inherit !important;
}


.spbx {
	display: flex;
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 0 4%;
}
.spbx .sp3 {
	width: 32%;
	height: auto;
}
.spbx .sp3 img {
	width: 100%;
	height: auto;
}

@media screen and (max-width: 767px) {

	.spbx {
		width: 100%;
        margin: 0 0;
        margin-bottom: 5%;
        padding: 5% 3%;
	}
	.spbx .sp3 {
		width: 48%;
		height: auto;
		text-align: left;
	}
}


/* 天気予報
---------------------------------------------------- */

.weather {
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 5px;
    position: absolute;
    right: 0;
    bottom: -14px;
}

.weather-area {
    font-size: 1.2em;
    margin-right: 15px;
}

.weather-info {
    display: flex;
    align-items: center;
}

.weather-icon img {
    width: 45px;
    height: auto;
}

.weather-temp {
    font-size: 1.5em;
    margin-left: 10px;
	margin-right: 15px;
}

.weather-temp em {
    font-style: normal;
    font-weight: bold;
}

.weather a {
    text-decoration: none;
    color: #00bfff;
    margin-left: auto;
}



/* ROOMのスライド
---------------------------------------------------- */

.slick-prev, .slick-next {
    position: absolute;
    top: 50%; /* 矢印を上下の中央に配置 */
    transform: translateY(-50%); /* 上下の中央に正確に配置 */
    background: transparent; /* 背景を透明に */
    color: rgba(255, 255, 255, 0.5); /* 透過した白（50%の透明度） */
    border: none; /* 枠線を削除 */
    font-size: 30px; /* 矢印のサイズを調整 */
    z-index: 1; /* 矢印を前面に表示 */
    cursor: pointer;
    outline: none; /* フォーカス時の枠を非表示に */
}
.slick-prev {
    left: 10px; /* 左矢印の位置調整 */
}
.slick-next {
    right: 10px; /* 右矢印の位置調整 */
}
/* ホバー効果をなくす */
.slick-prev:hover, .slick-next:hover {
    background: transparent; /* ホバー時も背景を透明に */
}

@media screen and (max-width: 767px) {

	.slick-prev {
		left: 0px; /* 左矢印の位置調整 */
	}
	.slick-next {
		right: 0px; /* 右矢印の位置調整 */

	}
}