/*
Template:twentyseventeen
Theme Name:oe-terume
*/
html{
	font-size:100%;
}
html[lang="ja"] body, html[lang="ja"] button, html[lang="ja"] input, html[lang="ja"] select, html[lang="ja"] textarea {
    font-family: serif;
}

body {
	color:#565656;
}
.post-2 .wrap {/*トップページのwrap*/
  padding-left: 0;
  padding-right: 0;
}
.site-content-contain {
  background-image: url(/wp-content/themes/oe-terume/images/541639_1000.jpg);
  background-attachment: fixed;
}

.custom-logo-link img {
	display: inline-block;
	max-height: 155px;
	width: auto;
}

.mw100 {max-width: 100%;}

.wp-block-image figcaption {
  text-align: center!important;
  font-style: normal!important;
  font-family: sans-serif;
}
/*-----------------------------------------------------------------------------------------------ページのTOPへ戻るボタン*/
.pagetop { 
cursor: pointer;/*カーソルをリンクを示すポインター(指の形)にする*/
position: fixed;/*ｳｨﾝﾄﾞｳを基準に固定する*/
bottom: 20px;/*ｳｨﾝﾄﾞｳのフチからの距離 */
right: 20px;/*ｳｨﾝﾄﾞｳのフチからの距離 */
background-color: #073507;/*#192826;/*背景色*/
border-radius: 50%;/*円形にする */
width: 50px;/*幅 */
height: 50px;/*高さ*/
font-size: 20px;/*▲の大きさ*/
line-height: 50px;/*▲を中央に配置するために指定*/
text-align: center;/*▲を中央に配置 */
z-index: 1000;
}
a.pagetop {
color:#fff;
}
.pagetop:hover {
opacity: 0.5;/*透明度の指定*/
}
/* ------------------- オンマウスでフワッとなる ------------------- */
/*a:hover img {
	opacity: .5;
	-webkit-opacity: .5;
	-moz-opacity: .5;
	filter: alpha(opacity=50);	
	-ms-filter: "alpha(opacity=50)";}
a img {
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;}
a {
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all  0.5s ease;}
	*/
/*------------------------------------------------------------------*/
a {
	text-decoration:underline;
}
a:hover {
	text-decoration:none;
}
/*startページ区切りページネーション--------------------------*/

.pagesprit {
    color: #000000;
    background:white;
    margin: 1em auto;
    line-height:2em;
    text-align:center;
	clear:both;
}

.page-numbers a {
    display:inline;
    color: #00019b;
    border:solid 1px #ccc;
    text-decoration:none;
}

.page-numbers a:hover {
    color:white;
    background: #328ab2;
}

.numbers {
    margin: 0 10px;
}
/*endページ区切りページネーション--------------------------*/

#content p.menu{
	clear:both;
}
#content .menu a{
	display:block;
	float:left;
	width:33%;
	padding:5px;
	border:solid 1px #3366CC;
	background-color:#66CCFF;
}
.content p{
	padding:0 15px;
}

.single-featured-image-header{
  background-image: url(./images/sozai_image_149655.jpg);
}
/*------------------------------------------------------------------*/

/*サムネイル画像の装飾--------------------------*/

.post-thumbnail{
    margin:0.5em 0;
    position: relative;
    padding: 0;
    border: solid 2px #ffcb8a;
    border-radius: 3px 0 3px 0;
}
.post-thumbnail:before,.post-thumbnail:after
{
    content: '';
    position: absolute;
    width:10px;
    height: 10px;
    border: solid 2px #ffcb8a;
    border-radius: 50%;
}
.post-thumbnail:after {
    content: '';
    top:-12px;
    left:-12px;
}
.post-thumbnail:before {
    content: '';
    bottom:-12px;
    right:-12px;
}
.post-thumbnail p {
    margin: 0; 
    padding: 0;
}

/*------------------------------------------------------------------*/

/*トップページリストの装飾*/
h3.entry-title {
    padding: 0.2rem 0.5rem;
    margin: 0.5rem 0;
    color: #565656;
    background: #ffeaea;
    box-shadow: 0px 0px 0px 10px #ffeaea;
    border: dashed 2px #ffc3c3;
    border-radius: 8px;
	font-size: 1.375rem !important;
}

h3.entry-title a {
    margin: 0; 
    padding: 0;
}

/*カテゴリーリストの装飾*/
#primary h1.entry-title, h2.entry-title {
    padding: 0.2rem 0.5rem;
    margin: 0.5rem 1.0rem;
    color: #565656;
    background: #ffeaea;
    box-shadow: 0px 0px 0px 10px #ffeaea;
    border: dashed 2px #ffc3c3;
    border-radius: 8px;
	font-size: 1.625rem !important;
}
h2.entry-title a {
    margin: 0; 
    padding: 0;
}

.entry-content h3 {
	width:100%;
	height:100px;
  font-size: 1.625rem
}
.entry-content h3::after {
	display:block;
	content:"";
	width:100%;
	height:8px;
    background: radial-gradient(circle farthest-side, #fc9595, #fc9595 50%, #f7f4ef 50%, #f7f4ef); 
    background-size: 8px 8px;
}
.widget-area h3 {
	width: 100%;
  height: auto;
  font-size: 1.25rem;
}
.widget-area h3::after {
	display:block;
	content:"";
	width:100%;
	height:8px;
    background: radial-gradient(circle farthest-side, #99f3cb, #99f3cb 50%, #f7f4ef 50%, #f7f4ef); 
    background-size: 8px 8px;
}

.panel-content .wrap {
    padding-top: 1em;
}
/*------------------------------------------------------------------*/

/*サイドカラムページのタイトルの飾り*/
#secondary h1.entry-title {
    padding: 0.2rem 0.5rem;
    margin: 0.5rem 0 1.5rem;
    color: #00554a !important;
    background: #e6fdf3;
    box-shadow: 0px 0px 0px 10px #e6fdf3;
    border: dashed 2px #99f3cb;
    border-radius: 8px;
	font-size: 1.625rem !important;
}
/*構造ページのh2*/
h2.entry-page {
    padding: 0.2rem 0.5rem;
    margin: 0.5rem 0 1.5rem 0;
    color: #00554a !important;
    background: none;
    box-shadow: 0px 0px 0px 10px #e6fdf3;
    border: dashed 2px #99f3cb;
    border-radius: 8px;
	font-size: 1.375rem !important;
}
/*混雑・温泉色の設定*/
.congestion dt h3, .spa-color dt h3 {
  margin-bottom: 0;
}
.congestion dt p, .spa-color dt p {
  text-align: right;
  font-size: 0.75rem;
  font-weight: lighter;
  font-family: sans-serif;
}
.congestion dd, .spa-color dd {
  font-size: 1.5rem;
  margin-bottom: 2rem;
}
.congestion dd {
  /*background-color: #09571f;*/
  color: #09571f;
  margin-right: 0;
  padding-left: 0.5rem;
  border-bottom: 1px dotted #09571f;
}
@media screen and (max-width: 1399px) {
 .spa-color dd span {
    display: block;
  }
}
/*------------------------------------------------------------------*/

.entry-meta {
    text-align: right;
}
.entry-title a {
    color: #565656;
    text-decoration: none!important;
    margin-left: -2px;
}

/*リンクの黒い下線をカスタマイズ*/
.entry-title a:hover,
.entry-content a:hover,
.entry-summary a:hover,
.widget a:hover,
.site-footer .widget-area a:hover,
.posts-navigation a:hover,
.widget_authors a strong {
	-webkit-box-shadow: inset 0 0px 0 rgba(255, 0, 255, 1);/*下線の太さと色*/
	box-shadow: inset 0 0px 0 rgba(255, 0, 255, 1);/*下線の太さと色*/
	color:#ff00ff;
}
/*白い下線を削除*/
.entry-title a,
.entry-meta a,
.page-links a,
.page-links a .page-number,
.entry-footer a,
.entry-footer .cat-links a,
.entry-footer .tags-links a,
.edit-link a,
.post-navigation a,
.logged-in-as a,
.comment-navigation a,
.comment-metadata a,
.comment-metadata a.comment-edit-link,
.comment-reply-link,
a .nav-title,
.pagination a,
.comments-pagination a,
.site-info a,
.widget .widget-title a,
.widget ul li a,
.site-footer .widget-area ul li a,
.site-footer .widget-area ul li a {
	-webkit-box-shadow: inset 0 0px 0 rgba(172, 172, 172, 1);
	box-shadow: inset 0 0px 0 rgba(172, 172, 172, 1);
}
/*カテゴリーにクレヨンライン*/
h1.page-title,h2.page-title {
	    background-image: url(./images/line-blue.png);
		background-repeat: repeat-x;
		background-position:left bottom;
		font-size: 1.8rem;
}
/*グローバルナビに影（PCのみ）*/
@media screen and (min-width: 48em) {
.navigation-top {
	border-bottom:#CCC solid 1px;
}
}

/*コメント送信ボタンの背景色*/
button, input[type="button"], input[type="submit"] {
    background-color: #003f0d;
}

.entry-content {
	line-height: 2.0em;
}

.widget ul li a:hover {
	-webkit-box-shadow: inset 0 0px 0 rgba(255, 0, 255, 1);/*下線の太さと色*/
	box-shadow: inset 0 0px 0 rgba(255, 0, 255, 1);/*下線の太さと色*/
	color:#ff00ff;
}

/**/
@media screen and (min-width: 48em) {
.site-content {
    padding: 2rem 0;
}
}

/*パンくずナビ設定*/
ul.breadcrumb-list {
	list-style:none;
	padding: 1rem 0;
}
ul.breadcrumb-list li {
	float:left;
	margin-right:0.25rem;
}

/*リンクのアンダラインを消す*/
.entry-content a, .entry-summary a, .comment-content a, .widget a, .site-footer .widget-area a, .posts-navigation a, .widget_authors a strong {
    -webkit-box-shadow: none;
    box-shadow: none;
}

/*画像の周囲の白枠を消す*/
.entry-content a img, .comment-content a img, .widget a img {
    -webkit-box-shadow: none;
    box-shadow: none;
}

/*トップページだけに表示するウィジェットエリアを作る
https://usortblog.com/toppage-widget/*/
@media screen and (min-width: 48em) {
.top_main_widget {
    margin-bottom:20px;
    max-width: 1000px;
    padding-left: 3em;
    padding-right: 3em;
}
}

/*下層ページでヘッダ画像の高さを狭くする*/
@media screen and (min-width: 30em) {
.site-branding {
    padding: 1em 0;
}
}
/**/
.single-featured-image-header img {
	max-width:100%;
	height:auto;
}
/*ページのh2タイトルと本文の間を詰める*/
@media screen and (min-width: 48em) {
.page.page-one-column .entry-header, .twentyseventeen-front-page.page-one-column .entry-header, .archive.page-one-column:not(.has-sidebar) .page-header {
     margin-bottom: 2em; 
}
}

/*段落でフロートをリセットさせる*/
p{clear:both;}


/*--------------------------------------------------------------------------------------投稿のleftフロートの場合の調整*/
@media screen and (min-width: 30em){
img.alignleft {
    float: left;
    margin-right: 0.5em;
    margin-bottom: 0.5em;
}
}

/*@media screen and (min-width: 48em){*/
h2.widget-title {
    font-size: 16px!important;
    background-color: coral;
    padding: 3px 0px 3px 12px;
}
/*}*/

/*--------------------------------------------------------------------------------------トップページの背景画像間隔を狭くする*/
@media screen and (min-width: 48em){
  .background-fixed .panel-image {
    background-attachment: fixed;
    height: 50vh;
    background-size: contain;
  }
}
.panel-image:before {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 0%);
}
/*--------------------------------------------------------------------------------------トップページswiper設定*/
/*  main {
    display: block;
  }*/

  .l-inner {
    position: relative;
    box-sizing: content-box;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10rem;
  }

  .l-section {
    border-top: 1px solid #eee;
  }
  .l-section .l-inner {
    padding-top: 8rem;
    padding-bottom: 8rem;
  }

  [class*=swiper]:focus {
    outline: none;
  }

  .slide-media,
  .thumb-media {
    position: relative;
    overflow: hidden;
  }
  .slide-media img,
  .thumb-media img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }

  .gallery03 {
    margin-bottom: 16rem;
  }
  .gallery03 .l-inner {
    padding-bottom: 0;
  }
  .gallery03 .swiper-wrapper {
    transition-timing-function: linear !important;
  }
  .gallery03 .swiper-slide {
    width: max-content;
  }
  .gallery03 .slide {
    width: var(--slide-width);
    transition: var(--transition);
            backface-visibility: hidden;
    --slide-width: 300px;/*高さ調整*/
  }
  .gallery03 .slide-media {
    height: var(--slide-width);
  }
  .gallery03 .slide-content {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 3.2rem 1.6rem 1.6rem;
    transition: var(--transition);
    opacity: 0;
    color: #fff;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 50%);
  }
  .gallery03 .slide-title {
    font-size: 1.4rem;
    line-height: 1.4;
    display: -webkit-box;
    overflow: hidden;
  }
  .gallery03 .slide:hover {
    width: calc(var(--slide-width) * 1.5);
  }
  .gallery03 .slide:hover .slide-content {
    opacity: 1;
  }

.wrap {
   /* margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;*/
}
.wp-caption {
  margin: auto;
  text-align: center;
  max-width: 100%;
}

.wp-caption-text {
  display: inline-block;
  text-align: left;
  color: #8a8a8a;
  margin: 10px 0 0;
}

  @media only screen and (max-width: 1024px) {
    .l-inner {
      padding: 0 4rem;
    }
  }

  @media only screen and (max-width: 599px) {
    html {
      /*font-size: 50%;*/
    }
  }
  @media screen and (max-width: 599px) {
    body{
    /*font-size: 16px;*/
    }
  }

/*--------------------------------------------------------------------------------------新着情報*/

.news_top-page {
  padding-left: 0;
  margin-bottom: 0.5rem;
}
.news-item {
  list-style: none;
  border-bottom: 1px dotted #000;
}
.news-item .news-item__inner {
  max-width: 529px;
  width: 100%;
  margin: 1rem auto;
  display: block;
  justify-content: space-between;
  align-items: center;
  border-bottom: none !important;
  padding-bottom: 0;
}
.news-item .news-item__media {
    max-width: 100%;
    text-align: center;
}
@media only screen and (min-width: 769px){
.news-item .news-item__inner {
  max-width: 634px;
  /*width: 100%;
  margin: 0 auto;*/
  display: flex;
  /*justify-content: space-between;
  align-items: center;
  border-bottom: none !important;
  padding-bottom: 0;*/
}
.news-item .news-item__media {
  max-width: 125px;
}
}

.news-item .news-item__body {
  max-width: 413px;
  width: 100%;
}
.news-item .news_item__date {
  margin-top: 0.5rem;
}
h2.news-item__title span {
  display: inline;
}

/*@media only screen and (min-width: 1200px){*/
  h2.news-item__title {
    font-size: 1.0rem;
    line-height: 1.25rem;
    margin-top: 0;
    padding-top: 0;
  }
/*}*/
/*--------------------------------------------------------------------------------------新着アイコン設定*/
.entry-icon-new {
  color: #fff;
  padding: 5px;
  font-size: 0.8em;
  background-color: #f00;
  border-radius: 3px;
  margin-left: 5px;
}

/*--------------------------------------------------------------------------------------アコーディオン（主に料金表）*/
  /*ベース*/
.accordion .toggle {
	display: none;
}
.accordion .Label {		/*タイトル*/
	padding: 1em;
	display: block;
	color: #fff;
	background:#019ac6;
}
.accordion .Label::before{		/*タイトル横の矢印*/
	content:"";
	width: 6px;
	height: 6px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	position: absolute;
	top:calc( 50% - 3px );
	right: 20px;
	transform: rotate(135deg);
}
.accordion .Label,
.accordion .content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}

.accordion .content {		/*本文*/
	height: 0;
	margin-bottom:10px;
	padding:0 20px;
	overflow: hidden;
}
.accordion .toggle:checked + .Label + .content {	/*開閉時*/
	height: auto;
	padding:20px ;
	transition: all .3s;
}
.accordion .toggle:checked + .Label::before {
	transform: rotate(-45deg) !important;
}

.accordion table, .accordion th, .accordion td {
  border-collapse: collapse;
  border: #444 solid 1px;
}
.accordion th, .accordion td {
  padding: 0 0.5rem;
}

/*--------------------------------------------------------------------------------------ここまでアコーディオン（主に料金表）*/

/*--------------------------------------------------------------------------------------柳川温泉料金表*/
table.yanagawa-price, .yanagawa-price th, .yanagawa-price td {
  border-collapse: collapse;
  border: #444 solid 1px;
}
.yanagawa-price th, .yanagawa-price td {
  padding: 0 0.5rem;
  white-space: nowrap;
}


/*--------------------------------------------------------------------------------------Footer設定*/
.site-info {
    width: 100%;
    text-align: center;
}

/*--------------------------------------------------------------------------------------トップページサイドバー施設リンク用バナー設定*/
.facility_bnr dd { text-align: center; }


/*--------------------------------------------------------------------------------------モーダルウィンドウ*/
.img-zoom {
  cursor: pointer;
  /*max-width: 500px;*/
  overflow: visible;
  width: 100%;
}
.img-zoom img {
  height: auto;
  transition: transform .6s ease;/* ゆっくり変化させる */
}
.img-zoom:hover img {
  transform: scale(1.1);/* 拡大 */
}

.entry-content h4 {
  box-shadow:0px -6px 5px -5px #92FCFC inset,0px 8px 4px -8px #92FCFC;
  margin-bottom: 0.5rem;
  padding-bottom: 0.5rem;
}

.radius-facility_bnr {
  border-radius: 5px;
}

/*--------------------------------------------------------------------------------------トップページ浴室交代カレンダーの設定*/
.bathhouse_sift {}
.bathhouse_sift table {
  border-collapse: collapse;
  border: 2px solid #4787dc;
}
.bathhouse_sift td, .bathhouse_sift th {
  border: 1px solid #4787dc;
  padding: 0.25rem;
}
.bathhouse_sift .table01 {}
.bathhouse_sift .calendar {
  text-align: center;
}
.bathhouse_sift .sat {
  color: #00F;
}
.bathhouse_sift .sun {
  color: #F00;
}
.bathhouse_sift .gray {
  color: #999;
}
.bathhouse_sift .female {
  background-color: #fcf;
  color: #f0f;
}
.bathhouse_sift .male {
  background-color: #b1deff;
  color: #007bd3;
}
.bathhouse_sift .july {
  max-width: 100px;
  height: auto;
}
.bathhouse_sift .month_header {
  max-width: 100px;
  height: auto;
}

.bathhouse_sift .july_cell {
  background-color: #d6e4f7;
}
.bathhouse_sift .aug_cell {
  background-color: #e1e8fb;
}