/*
Theme Name: oita-centuryhotel-01
Theme URI: 
Author: 
Author URI: 
Description: oita-centuryhotel
Requires at least: 6.6
Tested up to: 6.6
Requires PHP: 7.0
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: oita-centuryhotel-01
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/* heade画像の角丸をなくす */
.wp-post-image{
    border-radius: 0px;
}

/* ページトップに戻る*/
html {
	scroll-behavior: smooth;
}

#page_top {
	a {
		position: fixed;
		bottom: 90px;
		right: 32px;
		width: 58px;
		height: 58px;
		/* text-decoration: none; */
		background-color: #00908b;
		/* display: block; */
		text-align: center;
		border-radius: 29px;
		z-index: 10;
		padding-top: 5px;
	}
	a::before {
		content: '\f062';   /* Font Awesome Unicord*/
		font-family: 'Font Awesome 6 Free';
		font-size: 32px;
		font-weight: 900;
		color: #fff;
		line-height: 48px;
	}
	@media only screen and (max-width: 750px) {
  		a {
    		right: 10px;
  		}
	}
}


.wp-site-blocks {
	margin-top: -20px;
}

/* マウスオーバーで色を変える */
@media (hover: hover) and (pointer: fine) {
    .pagetop:hover, .pagetop:hover .pagetop__arrow {
        border-color: #3293e7;
    }
}

:where(.wp-site-blocks) > :first-child {
  margin-block-start: -20px;
}        

/* マウスオンで画僧を暗くする */
.image-hober-shadow img:hover{
        opacity:0.5;
        transition:0.3s;
}

/* ページ移動 */
nav {
	/*	justify-content: center;*/
	display: flex;
	align-items: center;
}
/* prev page */
.wp-block-query-pagination-previous {
}
/* next page */
.wp-block-query-pagination-next {
}
/* page numbers */
.page-numbers {
	padding: 8px 16px;
	border: 1px solid #00908b; /* Gray */
}
.wp-block-query-pagination-numbers {
	justify-content: center;
	a {
		transition: background-color .3s;
	}
	a:hover {
		background-color: #00908b;
		color: white;
	}
}

/* current page numbers */
.current {
	background-color: #00908b;
	color: white;
}


/* マウスでテキストの選択が出来ない様にする */
.user-select-none {
    user-select: none;
}

/* sticky header */
header {
	position: sticky;
	top: 0;
	z-index:5;
	background-color: var(--wp--preset--color--base);
}

/* サイドバーのカテゴリーリスト */
.wp-block-categories-list {
	list-style-type: none;
	padding-inline-start: 0px;
	a{
		text-decoration: none;
	}
	a::before {
		padding-inline-start: 0px;
		font-family:"Font Awesome 5 Free";
		content: "\f138";
		font-weight:800;
		color:#fff;/*アイコン色*/
		margin-right:5px;
		padding-right: 2px;
	}
	ul{
		list-style-type:none;
		padding-left: 0;
	}
	/* 子カテゴリー以外 */
	li:not(.children) a{
		display: block;
		padding: 10px;
		padding-left: 20px;
		margin: 1px;
		margin-bottom: 3px;
		color: #fff;
		background: #00908B;
		transition: .5s;
	}
	li:not(.children) a:hover{
		background: #00a6a1;
	}
	/* 子カテゴリー */
	.children li a{
		display: block;
		padding: 10px;
		padding-left: 20px;
		margin: 1px;
		margin-bottom: 3px;
		color: #fff;
		background: #00908B;
		transition: .5s;
	}
	.children li a:hover{
		background: #00a6a1;
	}
}

/* Slide in Overlay from the Bottom */
.slidein-bottom {
	position: relative;
	width: 100%;  /* slidein-bottom width */
	/* base image */
	.image {
		display: block;
		width: 100%;
		height: auto;
	}
	/* overlay setting */	
	.overlay {
		position: absolute;
		bottom: 0;
		right: 0;
		background-color: #363b3b;
		opacity: 0.8;
		overflow: hidden;
		width: 100%;
		height: 0;
		transition: .5s ease;
		color: white;
	}
	.text-block {
		color: white;
		font-size: 20px;
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		text-align: center;
		opacity: 1;
		background-color: #1b1b1b;
	}
}

/* hover overlay hight */	    
.slidein-bottom:hover .overlay {
	height: 40%;
}


/* スクロールすると表示する scroll-effect */
/*
@media(min-width:751px) {
	.scroll-effect {
		opacity: 0;
		transform: translateY(50px);
		transition: opacity 1s, transform 1s;
	}
	.scroll-effect.visible {
		opacity: 1;
		transform: translateY(0);
	}
}
*/

/* ボタン */
/*
.button-effect {
	a {
		color: #fff;
		font-size: 16px;
		font-weight: bold;
		background: #333;
		padding: 10px 20px;
		border-radius: 6px;
		position: relative;
		z-index: 1;
		display: inline-block;
		transition: .3s;
	}
	a::before {
		content: "";
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		border: 3px solid #026a66;
		border-radius: 6px;
		box-sizing: border-box;
		z-index: -1;
		transform: scale(1.2);
		opacity: 0;
		transition: transform ease .3s, opacity .3s;
	}
	a:hover {
		color: white;
		background: transparent;
	}
	a:hover::before {
		transform: scale(1);
		opacity: 1;
	}
}
*/
/* XOスライダーのリンク有効化 */
.xo-slider .slide-content {
  pointer-events: none;
}

/* ヘッダーメニューのサブメニュー */
.sub-menu {
    width: 200px;
    margin-left: 8px;  
}

/* ボタン */
.wp-block-button {
	a {
      	color: #fff;
            background-color:  #00908B;
	}
	a:hover {
		color: #ffffff;
		background: #00a6a1;
	}
}
/* -------------------------------------- */
/* デバイス別に表示を切り替える */
/* -------------------------------------- */
@media(max-width:1024px) {
	/* メニュー */
	.wp-block-navigation__container {
		display:none
	}
}

@media(min-width: 768px){
	/* 電話番号リンクはスマホの幅以上ではリンク無効にする */
	a[href^="tel:"]{
		pointer-events: none;
	}
}

@media(min-width:751px) {
	/* 携帯のみ for-pc表示しない */
	.for-mobile {
           display:none !important;
    }
}


/* 幅max750pxまで有効 */
/* スマホ専用 */
@media(max-width:750px) {
      /* for-pcは表示しない */
      .for-pc {
           display:none !important;
      }

      /* ヘッダーメニュー */
      header .wp-block-group-is-layout-flex {
            display:none !important;
      }

      /* パンくずリストのマージン変更 */
      nav {
	      margin-top: 10px;
      }
      
      /* コンテンツの左右の間隔を小さくする */
      .has-global-padding {
          /*
          padding-right: var(--wp--preset--spacing--10);  
		  padding-left: var(--wp--preset--spacing--10);
		  */
      }
	  .overlay {
            font-size: 12px;
      }
	.padding-left-m{
		padding-left: var(--wp--preset--spacing--40);
	}
	/* フッターが予約と重ならない様に */

}


/* ホームフッター　リンクの下線消す*/
.home-footer a {
	text-decoration: none;
}
.text-decoration-none a {
	text-decoration: none;
}
.footer-line {
    padding-top: 20px;
	padding-bottom: 20px;
	@media(max-width:750px) {
		padding-bottom: 50px;
	}
}
.container {
  position: relative;
  margin: 0 auto; /* Center it */
}

.container .content {
  position: absolute; /* Position the background text */
  bottom: 0; /* At the bottom. Use top:0 to append it to the top */
  background: rgba(0, 0, 0, 0.2); /* Black background with 0.5 opacity */
  color: #f1f1f1; /* Grey text */
  width: 100%; /* Full width */
}


/* 20240123 ADD Vacancy search banner */
.pc {
  opacity:0.7;
  display: block !important;
  position: fixed;
  top: 160px;
  right: 0px;
  padding: 6px 0px;
  z-index: 9999;
  width: 65px;
/*  border-top-left-radius: 1.2em; */
/*  border-bottom-left-radius: 1.2em; */
}
.sp {
  display: none;
}

@media screen and (min-width:768px) and ( max-width:1024px) {
    /*　画面サイズが768pxから1024pxまではここを読み込む　*/
  .pc { width:80px; }
}

/* smartphone */
@media only screen and (max-width: 750px) {
  .pc { display: none !important; }
  .sp {
    display: flex;
    position: fixed;
    justify-content: center;
/*    align-items: center; */
    bottom: 0px;
  left: 0px;
    width: 38%;
/*    bottom: 0px; */
    z-index:9999;
  }
  .mymaxwide-header {
    padding-right: 0px !important;
  }
}

/* 2024.02.04 Added reservation inquiry banner */
.pc2 {
  opacity:0.7;
  display: block !important;
  position: fixed;
  top: 340px;
  right: 0px;
  padding: 6px 0px;
  z-index: 9999;
  width: 65px;
/*  border-top-left-radius: 1.2em; */
/*  border-bottom-left-radius: 1.2em; */
}
.sp2 {
  display: none;
}

@media screen and (min-width:768px) and ( max-width:1024px) {
    /*　画面サイズが768pxから1024pxまではここを読み込む　*/
  .pc2 { width:80px; }
}

/* smartphone */
@media only screen and (max-width: 750px) {
  .pc2 { display: none !important; }
  .sp2 {
    display: flex;
    position: fixed;
    justify-content: center;
    bottom: 0px;
/*  align-items: center; */
  left: 44%;
  width: 38%;
  z-index:9999;
  }
  .mymaxwide-header {
    padding-right: 0px !important;
  }
}

.img-banner:hover{ 
  opacity:1;
  transition:0.3s;
}

/* 20240920 ADD best rate banner */
.brb_pc { display: block !important; }
.brb_sp { display: none !important; }
 
@media only screen and (max-width: 750px) {
    .brb_pc { display: none !important; }
    .brb_sp { display: block !important; }
}

/* -------------------------------------- */
/* お問い合わせ
/* -------------------------------------- */