@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.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* メニューホバー時の文字色 */
#navi .navi-in a:hover {
color:#b80038;
}

.container {
background:#faf2e1 url(https://hotarubashi.com/wp-content/themes/cocoon-child-master/images/header-bg.png) repeat-x left top;
}

#header-container {
background-color:transparent;
}

#header-container .header-in {
display:flex;
flex-wrap:nowrap;
flex-direction:row;
justify-content:center;
}

.header-in .left-header,
.header-in .right-header {
width:50%;
}

.header-in .tagline {
text-align:left;
color:#32641f;
margin:2em 0 0 0;
line-height:1.2;
}

.header-in .logo {
text-align:left;
}

.header-in .logo-header .site-name .site-name-text {
max-width:231px;
max-height:67px;
padding-bottom:2.6em;
}

.header-in .tel-header {
font-size:12px;
text-align:right;
color:#231815;
line-height:1.4;
margin:3em 0 0 0;
}

.tel-header .tel-text {
font-size:1.3em;
background:linear-gradient(transparent, 65%, #ffe99b, 75%, transparent);
}

.tel-header .tel-text-icon {
font-size:0.9em;
color:#32641f;
}

.tel-header .tel-number {
color:#32641f;
font-size:2.4em;
line-height:1.0;
font-weight:bold;
margin:0;
padding:0;
}

#navi {
background:transparent url(https://hotarubashi.com/wp-content/themes/cocoon-child-master/images/gnav-bg.png) repeat-x left bottom;
}

#footer {
background-color:transparent;
margin-top:0;
padding-top:0;
}

.footer-in .footer-bottom {
margin-top:0;
border-top:#A09681 dotted 1.5px;
border-bottom:#A09681 dotted 1.5px;
}

.footer-in .footer-bottom .footer-bottom-logo .logo {
text-align:left;
}

.footer-in .footer-bottom .footer-bottom-logo .logo img {
max-height:50px;
height:auto;
width:auto;
}

#navi-footer-in .menu-footer .menu-item a,
.footer-bottom-content .copyright {
color:#231815;
}

.content {
  margin-top: 0;
}

.main {
background-color:transparent;
padding:3px;
}

.article .flex-2box-area {
text-align:center;
margin-bottom:1em;
}

.article .flex-2box-area-in {
display:flex;
flex-wrap:wrap;
flex-direction:row;
justify-content:center;
}

.article .flex-2box-area-in div {
width:50%;
}

.article .flex-2box-area-in .area-map {
padding:0 3px;
}

.article .tel-header,
.content .tel-header {
display:none;
}

.article .eye-catch-wrap {
display:none;
}

.article .container_img {
position:relative;
width:984px;
max-height:722px;
height:auto!important;
margin:0 auto 1em auto;
text-align:center;
}

.article .css_image {
width:100%;
height:auto;
animation-delay:0s;
animation: change-img-anim-start 15s forwards;
}

.article .css_image-main {
opacity:0;
animation: change-img-anim-end 15s forwards;
}

@keyframes change-img-anim-start {
0% { opacity:1;}
50% { opacity:0;}
}

@keyframes change-img-anim-end {
0% { opacity:0;}
100% { opacity:1;}
}

.sb_instagram_header,
#sbi_images {
padding:5px 0!important;
}

.article .content-free {
padding:0 1em;
}

.article .back-white {
display:block;
background-color:#ffffff;
border-radius:20px;
padding:1em;
}

.article .kisetsu-bg {
border:solid rgba(255, 255, 255, 0.7) 0.34em;
border-radius:6px;
max-width:970px;
margin:0 auto;
}

.article .sp-top,
.article .sp-top tr,
.article .sp-top th,
.article .sp-top td,
.article .pc-top,
.article .pc-top tr,
.article .pc-top th,
.article .pc-top td {
background-color:#ffffff;
border:none;
}

.article .message-bg {
background:url(https://hotarubashi.com/wp-content/themes/cocoon-child-master/images/content-bg.png) no-repeat center 40px;
width:100%;
min-height:500px;
}

.article .box-2-left {
display:flex;
flex-wrap:wrap;
flex-direction:row;
justify-content:flex-start;
margin:0 3em;
}

.article .box-2-left-left {
flex:1 0 50%;
text-align:left;
width:auto;
}

.article .box-2-left-right {
flex:1 0 50%;
text-align:right;
width:auto;
padding-left:1em;
}

.article .pr-970px,
.article .area-970px {
display:block;
text-align:center;
}

.article .pr-480px,
.article .area-480px {
display:none;
text-align:center;
}

.article .pc-top-td {
width:25%;
}

.article .td-nabeuri {
max-width:292px;
max-height:180px;
text-align:center;
vertical-align:middle;
}

.article .hotaru-va-top {
vertical-align:top;
}

.article .hotaru-ta-center {
text-align:center;
}

.article .hotaru-wd100 {
width:100%;
}

.article .top-basyo {
margin-bottom:1em;
line-height:2.0;
}

.article .top-basyo-icon {
width:1em;
text-align:center;
color:#32641f;
}

.article .hotaru-price {
font-size:1.3em;
font-weight:bold;
color:#ea3e5e;
}

.article .hotaru-uline {
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-color: #ffedab;
text-decoration-thickness: 3px;
}

.article .hotaru-uline-m2em-0 {
font-size:1.2em;
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-color: #ffedab;
text-decoration-thickness: 5px;
margin:2em 0;
}

.article .hotaru-uline-m1em {
font-size:1em;
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-color: #ffedab;
text-decoration-thickness: 5px;
margin:1em;
}

.article .hotaru-indent {
text-indent:-1.5em;
padding-left:1.5em;
}

.article .sitemap-p {
margin-left:2em;
}

.article .sitemap-a-color {
color:#231815;
}

.article .sitemap-icon-color {
color:#32641f;
}

.article .message-bold {
font-weight:bold;
font-size:1.2em;
padding-top:1em;
}

.article .jikan-bold {
font-weight:bold;
font-size:1.2em;
}

.article .otoiawase-p {
margin-top:0;
}

.article .otoiawase-tel {
color:#32641f;
font-size:1.6em;
line-height:0.8;
font-weight:bold;
padding:0.5em 0 0;
display:block;
}

.article .otoiawase-icon {
width:1em;
text-align:center;
color:#32641f;
font-size:0.7em;
vertical-align:top;
}

.article .hotaru-linear {
background:linear-gradient(transparent, 65%, #ffe99b, 75%, transparent);
}

.content .breadcrumb {
margin-bottom:0;
}

ol, ul {
	padding-left:5px;
}
/* ヘッダーロゴの上下を調整 */
.logo-text {
	padding: 5px 0 10px;
}
/* モバイル時のサイドメニュー */
.navi-menu-content {
	background-color:#f1ecda;
}
/* 画像ホバーで薄く表示する */
.img_hover:hover {
  opacity:0.5;
  transition: 1s;
}
/* 途中改行の禁止 */
.no-wrap {
  display: inline-block; /* インラインブロック化 */
}
/* 固定ページの日付を非表示 */
.page .date-tags {
  display: none;
}
/*タイトル*/
h1,h2,h3 {
  text-align:center;
}

.article h1, .article h2 {
  padding:10px 0;
  font-weight:normal;
  /*color:#ffffff;*/
}

.article h1 {
  /*background-color:#34602f;*/
  /*font-size:95%;*/
font-family: 'Zen Kaku Gothic Antique', sans-serif;
font-size:32px;
line-height:1.2;
padding-top:1.2em;
padding-bottom:1.7em;
color:#231815;
border-radius:10px;
background:url(https://hotarubashi.com/wp-content/themes/cocoon-child-master/images/h1.png) no-repeat center bottom #ffffff;
/*min-height:127px;*/
}

.article h2 {
  /*background-color:#3079ac;*/
text-align:left;
font-size:28px;
margin-bottom:1em;
border-bottom:rgba(160, 150, 129, 0.4) dotted 0.2em;
color:#32641f;
font-family: 'Zen Kaku Gothic Antique', sans-serif;
font-weight:400;
background:url(https://hotarubashi.com/wp-content/themes/cocoon-child-master/images/h2.png) no-repeat 8px center;
padding-left:50px;
padding-top:0.4em;
padding-bottom:0.4em;
line-height:0.8;
}

.article .h2-small {
font-size:0.6em;
font-weight:500;
}

.article h3 {
text-align:left;
font-size:24px;
margin-bottom:1.2em;
border-bottom:rgba(160, 150, 129, 0.7) dotted 0.1em;
border-top:none;
border-left:none;
border-right:none;
color:#231815;
font-family: 'Zen Kaku Gothic Antique', sans-serif;
font-weight:700;
background:url(https://hotarubashi.com/wp-content/themes/cocoon-child-master/images/h3.png) no-repeat 18px center;
padding-left:50px;
padding-top:0.2em;
padding-bottom:0.2em;
}

.article .sbi_header_text h3 {
font-family:"Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-weight:bold;
background:none;
}

.article h3.otoiawase {
margin-bottom:0.2em;
margin-top:1em;
font-weight:normal;
}



/* 注文フォーム [ここから] */

.article .no-br br { display:none; }
.article .no_p p { display:inline; }
.article .no_line { text-decoration-line:none; }

.article .attention-box {
border-radius:10px;
border:rgba(255, 255, 255, 0.8) solid 3px;
padding:0.5em 1em;
margin-bottom:1em;
}

.article .hotaru-color-black {
color:#231815;
}

.article .hotaru-color-green {
color:#32641f;
}

.article .hotaru-color-blue {
color:#73ADB4;
}

.article .hotaru-color-red {
color:#ea3e5e;
}

.article .hotaru-font-bold {
font-weight:bold;
}

.article .hotaru-font-16px {
font-size:16px;
}

.article .hotaru-font-14px {
font-size:14px;
}

.article .hotaru-icon-inline {
display:inline;
}

.article .hotaru-icon-set {
display:inline-block;
text-align:right;
width:1.5em;
padding-right:0.5em;
}

.article .hotaru-tindent-0 {
text-indent:0;
}

.article .hotaru-infoicon {
display:inline;
color:#73ADB4;
font-size:18px;
width:18px;
}

.article .hotaru-cart-icon::before {
display:inline;
content:url(https://hotarubashi.com/wp-content/themes/cocoon-child-master/images/cart-icon.png);
vertical-align:-3.5px;
}

.article .hotaru-sousa-text {
text-indent:-1.5em;
padding-left:2.5em;
margin:0.5em 0;
line-height:20px;
}

.article .hotaru-disp-block {
display:block;
}

.article .hotaru-sousa-method {
display:block;
border-radius:8px;
background-color:#ffffff;
text-indent:-1.5em;
padding:0.2em 1em 0 2.5em;
margin:0 1em 0.5em 1em;
}

.wqe--name {
  font-size:85%;
}
.wqe--price {
  color:#a20101;
}
.wqe--note {
text-align:left;
}
.wqe-Form .wqe-Product>.wqe--info>.wqe--ribbon.wqe-ribbon-1 {
top: 136px !important;
}

.wqe-Form .wqe-NavBar.wqe-belongs-hnavigator>.wqe--menuWrap>.wqe--menu>.wqe--item {
border-left:rgba(255, 255, 255, 0.4) solid 1.5px;
border-right:rgba(255, 255, 255, 0.4) solid 1.5px;
border-radius :1.5px / 40px;
}

.wqe-Form .wqe-Group>.wqe--body {
justify-content: space-around!important;
}

.wqe-Form .wqe-Product {
background-color:#ffffff;
padding:0!important;
margin:3px 0!important;
border:#ffffff solid 2px;
max-width:296px;
}

.wqe-Form .wqe-Product>.wqe--info>.wqe--main {
flex-direction: column!important;
}

.wqe-Form .wqe-Product>.wqe--info>.wqe--main>.wqe--prices {
text-align:right;
line-height:1.3;
}

.wqe--name {
text-align:left;
line-height:1.3;
}

.wqe--price {
color:#ea3e5e;
}

.wqe-Form .wqe-Product>.wqe--info>.wqe--main>.wqe--note {
text-align:center;
}

.scroll_description {
  /*font-size:60%;*/
  /*text-align:center;*/
  /*margin-bottom:0em;*/
  display:none;
}
@media screen and (max-width: 780px){
.scroll_description {
  display:inline
}
}
.wqe-Form .wqe-TextInput, .wqe-Form .wqe-TextArea {
  background-color:#ffffff !important;
}

/* 蛍橋食堂用ボタン色 */
.btn-hotaru {
  background-color:#b9143b;
}

/* 注文フォーム [ここまで] */

/* GoogleMap をレスポンシブで表示する */
.map_iframe_wrap_change{
    position:relative;
    width:100%;
    height:0;
    padding-top:60%;/*10:6なので60%*/
}

.map_iframe_wrap_change iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

/* Youtube をレスポンシブで表示する */
.video-container {
margin: 0px auto;
}

/*フェードインアニメーションの指定　ここから*/
/* スクロールCSS */
.fade-in {
  opacity: 0;
  transition-duration: 500ms;
  transition-property: opacity, transform;
}

.fade-in-up {
  transform: translate(0, 50px);
}

.fade-in-down {
  transform: translate(0, -50px);
}

.fade-in-left {
  transform: translate(-50px, 0);
}

.fade-in-right {
  transform: translate(50px, 0);
}

.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}
/*フェードインアニメーションの指定　ここまで*/

/* モバイル用下部ボタンカスタマイズ */
.mobile-menu-buttons {
	background-color:#34602f;
}
.mobile-menu-buttons .menu-icon::before {
	font-size: 1.15em;/*フッターメニューのフォントアロウズの大きさを変更*/
	color:#fff;/*フッターメニューのフォントアロウズの色を変更*/
}
.mobile-menu-buttons .menu-caption {
	color:#fff;/*フッターメニューのフォントの色を変更*/
}
.mobile-menu-buttons .menu-button,
.mobile-menu-buttons .menu-button > a {
	color:#fff;
}
/* モバイル版メニュー「Ｘ」ボタンが白になるので黒に戻す */
.navi-menu-close-button,
.menu-close-button {
color:#000;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
@media screen and (min-width: 1024px){
	.sp-br {
	  display: none;
	}
	.pc-br {
	  display: block;
	}
}
/*1023px以下*/
@media screen and (max-width: 1023px){
	.sp-br {
	  display: block;
	}
	.pc-br {
	  display: none;
	}

.main {
  padding:1px 3px;
}

	
.sidebar-menu-button {
  display: none;
}
.header-in .left-header {
width:100%;
}

.header-in .right-header {
display:none;
}

.header-in .tagline {
text-align:center;
}

.header-in .logo {
padding-left:3em;
text-align:center;
}

.footer-in .footer-bottom .footer-bottom-logo .logo {
text-align:center;
padding-left:3em;
}

.article .flex-2box-area-in div {
width:100%;
}

.article .tel-header,
.content .tel-header {
display:block;
font-size:14px;
text-align:center;
color:#231815;
line-height:1.5em;
margin-bottom:3em;
}

.mobile-menu-buttons {
background-color:#32641f;
}

.article .box-2-left {
flex-direction:column;
}

.article .box-2-left-left {
flex:1 0 auto;
}

.article .box-2-left-right {
text-align:center;
flex:1 0 auto;
padding-left:0;
}

.article .pr-970px,
.article .area-970px {
display:none;
text-align:center;
}

.article .pr-480px,
.article .area-480px {
display:block;
text-align:center;
}



.article h1 {
font-size:24px;
}

.article h2 {
font-size:24px;
}

}

/*834px以下*/
@media screen and (max-width: 834px){
  main.main, div.sidebar {
    padding:1px 3px;
  }
  .article ul, .article ol {
    padding-left: 3px;
	font-size:80%;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  .map_iframe_wrap_change{
    position:relative;
    width:100%;
    height:0;
    padding-top:100%;/*1:1なので100%*/
  }
}