@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.2
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*固定ページの投稿名と日付非表示*/
.page .date-tags,
.page .author-info {
    display: none;
} 

.new-entry-card-date {
  display: block;
}

/* ========追従メニュー======== */

@media (min-width: 769px) {
.fixedbnr {
    position: fixed;
    top: 300px;
    right: 10px;
    line-height: 1.2;
}

 
.fixedbnr a {
    width: 1em;
    font-family: "Yu Gothic", 游ゴシック, YuGothic, 游ゴシック体, "ヒラギノ角ゴ Pro W3", メイリオ, sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    box-sizing: content-box;
    padding: 1.2em 1em;
	 display: block;
	 text-decoration: none;
}

.fixedbnr a:hover {
    opacity: 0.6;
}	
	
.fixedbnr .reserved {
    background-color: #32cd32;
}
.fixedbnr .reserved a {
    color: #fff;
}
	
.fixedbnr .icon {
    margin: 0 0 .8em -30%;
    width: 160%;
}
	
.fixedbnr .icon img {
    width: 24px;
    height: 24px;
    vertical-align: top;
}		
	
.fixedbnr .yoyakumenu {
    margin-top: 18px;
    background-color: #06c;
    border: 1px  solid #242424;
}

.fixedbnr .yoyakumenu a {
    color: #242424;
	color: #fff;
}
}	


.mobile-menu-buttons .menu-icon {
    text-align: center;
    width: 100%;
    display: block;
    color: #214694;
}
	
.am-body {
	width: 80%;
}

 .main,.sidebar{
    background-color: transparent;
}

.slider_b {
	background-image: url(https://asunabarou.com/wp-content/uploads/2021/03/h1-midashi.jpg);
}

/**
.body {
  cursor: url(https://bar-rex.com/asunaro/wp-content/uploads/2021/03/kyu.png), auto;
}
*/

/*みだし*/

.article h1{
    line-height: 1.25;
    font-weight: bold;
    border-left: solid 5px #4682b4;
    margin: 10px;
    padding: 0.5em;
}
.article h2,.sidebar h3,#header-container .navi, #footer {
	background-image: url(https://asunabarou.com/wp-content/uploads/2021/03/h1-midashi.jpg);
}

.midashi {
	text-align: center;
	color: #1e90ff;
	font-size: 1.4em;
	margin-bottom: 10px;
	font-weight: bold;
}

.article h3, .article h4, .article h5, .article h6, .cat-link, .tag-link {
    border-color: #0072bc;
    background-color: #f5f5dc;
}

#header-container .navi {
	border-top :solid 1px #fff;
}

/*お問い合わせフォーム*/

.required {
	color: red;
}

input[type="submit"] {
    -webkit-appearance: none;
    border: 1px solid #ddd;
    background-color: #06c;
	color: #fff;
}

.cat-link, .tag-link {
    border-color: #0072bc;
    background-color: #214694;
}

/*ボタン*/
.btn,
a.btn,
button.btn {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #fff;
  border-radius: 0.5rem;
background-color: #0064b5;	
	border: 2px solid #ddd;
	width: 100%;
}

a.btn--red.btn--cubic {
  border-bottom: 5px solid #efefef;
}

a.btn--red.btn--cubic:hover {
  margin-top: 3px;
  border-bottom: 2px solid #ddd;
}

a.btn--radius {
  border-radius: 100vh;
}

.fa-position-right {
  position: absolute;
  top: calc(50% - .5em);
  right: 1rem;
}

/*予約*/
.btn--orange,
a.btn--orange {
  color: #fff;
  background-color: #eb6100;
 padding: 16px;
	height: 100%;
}
.btn--orange:hover,
a.btn--orange:hover {
  color: #fff;
  background: #f56500;
}

.fa-position-left {
  position: absolute;
  top: calc(50% - .5em);
  left: 1rem;
}





/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1024px){
}
/*768px以下*/
@media only screen and (max-width: 768px) {
	.fixedbnr {
		display: none;
	}
	
	/*フッターボタン*/
.mobile-menu-buttons .menu-caption {
    font-size: 9px;
    text-align: center;
    opacity: 0.8;
    display: block;
    color: #fff;
}

.mobile-menu-buttons .menu-icon {
    text-align: center;
    width: 100%;
    display: block;
    color: #fff;
}

.mobile-menu-buttons {
    display: flex;
    align-items: stretch;
    background-color: #214694;
}
	
	
/*表示順変更*/
.box{
  flex-direction: column;
 }
	
.order1 {
  order: 1;
}
.order2 {
  order: 2;
}
.order3 {
  order: 3;
}
.order4 {
  order: 4;
}
.order5 {
  order: 5;
}	
	
}

/*480px以下*/
@media screen and (max-width: 480px){
	.wp-block-image .alignleft {
		text-align: center;
		clear: both;
	}

	.sp-center {
		text-align: center;
	}
	
	.wp-block-media-text .wp-block-media-text__content {
		padding: 8% 8%;
	}	
	
}


/* スマホドロワーメニュー改善 */
@media (max-width: 767px) {

  /* メニュー全体 */
  ul.menu-drawer {
    padding: 15px 20px 35px;
    margin: 0;
    list-style: none;
  }

  /* 親メニュー */
  ul.menu-drawer > li {
    margin: 0;
    border-bottom: 1px solid #e5edf2;
  }

  ul.menu-drawer > li > a {
    display: block;
    padding: 16px 10px;
    color: #24465b;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
  }

  /* 子メニュー */
  ul.menu-drawer .sub-menu {
    margin: 0 0 12px 12px;
    padding: 0 0 0 14px;
    border-left: 2px solid #d4e8f3;
    list-style: none;
  }

  ul.menu-drawer .sub-menu li a {
    display: block;
    padding: 9px 8px;
    color: #607987;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6;
    text-decoration: none;
  }

  /* 酸素ルームを目立たせる */
  ul.menu-drawer > li.menu-item-8473 {
    margin: 12px 0;
    border: none;
  }

  ul.menu-drawer > li.menu-item-8473 > a {
    padding: 14px 16px;
    border-radius: 8px;
    background: #e7f5fc;
    color: #0875ae;
    font-weight: 700;
    border-left: 4px solid #1595d0;
  }

  /* タップ時の反応 */
  ul.menu-drawer a:active {
    background-color: #f1f8fc;
  }
}


/* 酸素ルームを他のメニューと統一 */
@media (max-width: 767px) {
  ul.menu-drawer > li.menu-item-8473 {
    margin: 0;
    border: none;
    border-bottom: 1px solid #e5edf2;
  }

  ul.menu-drawer > li.menu-item-8473 > a {
    display: block;
    padding: 16px 10px;
    border: none;
    border-radius: 0;
    background: transparent;
    color: #24465b;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.6;
    box-shadow: none;
  }
}


/* PC用ナビゲーションの横幅調整 */
@media (min-width: 1024px) {

  /* メニューを1行に */
  ul.menu-header,
  ul.menu-pc,
  ul.menu {
    flex-wrap: nowrap;
  }

  /* メニュー項目の改行を防ぐ */
  .menu-item > a {
    white-space: nowrap;
  }

  /* メニュー間の余白を調整 */
  .menu-item > a {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 14px;
  }
}