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


/*-　※※ 変数 スタイルガイド参考 ない場合は直打ち　-*/


/************************************
 フォント、カラーのroot設定 
*************************************/
:root {
    --xxxl:  2.625rem; /* 42px   h1 */
	--xxl:   2.25rem;  /* 36px   h2 */
	--xl:    1.75rem;  /* 28px   h3 */
	--l:     1.5rem;   /* 24px   h4 */
	--l:     1.5rem;   /* 24px   h5 ※h4と同じにした*/
	--lm:    1.25rem;  /* 20px   h6 */

/* 見出し以外 pタグ */
	--m: 1rem;    /* 16px */
	--s: 0.75rem; /* 12px */


/* 色のroot設定 (背景色グラデーション含む）*/
    --pink: #ee9ab8;
	--lightblue: #e0f1f4;
	--light-pink: #fce8e8;
	--little-light-pink: #ffe3f3;
	--other-little-pink: #fdeff5;
	--very-light-pink: #fef7fa;
	--very-light-blue: #def8fc;
	--light-yellow: #ffecd9;
	--light-gray: #e6e6e6;
	--footer-gray: #f2f2f2; /*(footerの色)*/
	
/* ボタンの色 */
	--dark-pink: #d34091;
    --dark-purple: #4b3a45; 
}



/***************************************
 レスポンシブ用のフォントサイズroot設定
***************************************/
@media screen and (max-width : 768px){
    :root {
          --xxxl: 1.75rem; /* 28px   h1 */
          --xxl:  1.5rem;  /* 24px   h2 */ 
          --xl:   1.25rem;  /* 20px  h3 */ 	    
          --l:    1.125rem; /* 18px  h4 */ 	     
          --l:    1.125rem; /* 18px  h5 ※h4と同じにした */ 	     
          --lm:   1rem;  /*    16px  h6 */
    }
}



/************************************
 見出し 
************************************/
/* ※ 当てはまらない場合は手入力 */
h1{
	 font-size: var(--xxxl) !important;
 }
h2 {
	 font-size: var(--xxl) ;
}
h3 {
	 font-size: var(--xl) !important; 
}
h4 {
	 font-size: var(--l) !important;
}
h5 {
	 font-size: var(--l) !important; /* h4と同じにした */
	}
h6 {
	 font-size: var(--lm) !important;
}

/* articleのh2にvarが効いていないのでいれる */
.article h2{
    font-size: var(--xxl);
}
/* フォントカラー */
h1,h2,h3,h4,p {
    color: #4b3a45!important;
}


/**************************************
フォントファミリー 指定
**************************************/
body {
	font-family: "游明朝体","YuMincho","游明朝 Medium","Yu Mincho Medium","游明朝","Yu Mincho", serif !important;
}


/**************************************
iphoneリセットcss（submit）
**************************************/
input[type="submit"] {
  appearance: none;
  -webkit-appearance: none;
  }

/**************************************
reCAPTCHA非表示設定
**************************************/
.grecaptcha-badge { visibility: hidden; }


/**********************************************
             共通（基本）
**********************************************/
/* はみ出し問題を調整 */
div#container {
    width: 100%;
}

/*---WP バージョンアップに伴う修正 -----20240313kase*/

/* 各固定ページのグラデ-ション背景画像を全幅にする */
.wp-block-cover.is-light.overall {
  margin: 0 calc(50% - 50vw);
  width: 100vw 
}

/* カバー背景内のコンテンツ左右にpaddingいれる
 20240329:テーマ更新後の修正::加勢記*/
.spaceRL {
    padding: 0 3rem;  
}

/* 全ページのコンテンツ幅 1100pxに */
div#content-in {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}
/* 固定ページタイトルを非表示にする */
.entry-title {
    display: none;
}

/* h2の背景を透過させる */
.article h2 {
	background:transparent;
    margin: 0;
	padding: 1rem 0;
}

/* ヘッダータイトル下の余白を消す */
.content{
  margin: 0;
}
.main{
  padding: 0;
}
.entry-content{
    margin: 0;
}

/* ヘッダーとタイトル画像間の空白を消す */
.wp-block-cover.is-light.bg_title {
    margin-top: -1px!important;
}

/* ボトム：フッターとコンテンツ間の余白を消す */
.wp-block-cover.alignfull.is-light {
    margin-bottom: 0;
}
/* article全体のボトムの余白消す */
.article#post-3,
.article#post-8,
.article#post-11,
.article#post-13,
.article#post-15,
.article#post-17,
.article#post-19,
.article#post-21,
.article#post-23,
.article#post-25,
.article#post-27,
.article#post-29,
.article#post-31,
.article#post-33,
.article#post-35,
.article#post-37,
.article#post-39 {
	margin-bottom: 0;
}

/* ボトムの背景カバーと問合せフッター間の余白を消す */
.wp-block-cover.is-light {
    margin-bottom: 0;
}

/* aタグの設定 (マウスオーバー時)*/
body a {
	text-decoration:none;
	color: #4b3a45;
}
a:hover,
#navi .navi-in a:hover,
div#header-in a:hover,
span.site-name-text:hover,
#footer a:hover {
    color: #d34091!important;
    transition: all 0.3s ease-in-out;
}

ul li{
    list-style:none;
}

/* 上へ戻るボタンの大きさ、位置調整 */
div#go-to-top {
    right: 3%;
    bottom: 4%;
}
.go-to-top-button {
    width: 100%;    
}
/* figcaptionのフォントサイズ */
figcaption.wp-element-caption {
    font-size: 14px;
}


/*****************************************************
 グローバルメニュー（國分さん作成）加勢追記
*****************************************************/
/* グローバルメニューの区切り線 （短いもの）設定 */
ul.menu-top li + li{
	 position:relative;
}
.navi-in > ul li {
    height: 40px;
    line-height: 20px;
}
#navi .navi-in>ul>li{
    width: 182px;
}
.item-label { 
    height: 20px;
}
.navi-in > ul li a {
    border-right: #4b3a45 solid 1px;
}
.navi-in > ul li:last-child a {
    border-right: none;
}


/* サブメニュー */
ul.sub-menu li a .caption-wrap .item-label {
    margin-top: 1rem;
}
ul.sub-menu li a {
    border-right: none;
}



/********************************************
 header / PCサイズ 
*********************************************/
/* ヘッダー コンテナー内 位置調整 */
header#header {
    max-width: 1200px;
    width: auto;
    justify-content: space-between;
    margin: 0 auto;
    display: flex;
    padding-top: 1em;
}

/* ヘッダーの右側にあった不明なもの */
.cf::after{
    display: none;
}

/* コンテナー　左 */
/* 左側社名「丸松博愛舎」の位置リセット */
 header#header .wrap {
    width: 100%!important;
}
div#header-in {
    margin: 0;
}
/* 株式会社とタイトルを横並びに する*/
.logo.logo-header.logo-text {
    display: flex;
}
/* 株式会社の行間 を調整*/
p.stock-company {
   line-height: 31px;
	font-size: var(--l);
	padding-top:18px;
}
/* 株式会社・丸松博愛舎の位置調整 */
.logo.logo-header.logo-text {
    padding: 0px 0px 30px;
	margin-top: -16px;
}
/* 丸松タイトル文字の調整・クリック時 */
span.site-name-text {
    font-size: 54px;
}
a.site-name.site-name-text-link{
    color:#4b3a45;
}

/*  キャッチコピー位置調整 */
.tagline {
    margin: 0.3em 0 0 0;
    font-size: var(--lm);
    text-align: left;
}

/* コンテナ― 右 */ 
.header-container-right {
    width: 100%;
    display: flex;
    justify-content: right;
    margin-top: 0.3em;
    gap: 1rem;
}
.inner-Right {
    text-align: right;
}
/* 365日24時間対応）位置調整 */
.reception-time {
    text-align: right;
    font-size: var(--lm);
    letter-spacing: 0.16em;
}
/* フリーダイヤル */
span.header-telNO {
    font-size: var(--xxl);
    letter-spacing: .2rem;
    line-height: 2.5rem;
}
/* アスカネット注文バナー位置調整 */
.bnr-orderFlowers {
    padding-top: 1rem;
}

/* スマホ用電話アイコンを601pxまで非表示にする */
.inner-Right_sp {
    display: none;
}



/**************************************
    footer
***************************************/
/* モバイル用を非表示にする:20240412改修kase */
.footer-mobile {
    display: none;
    text-align: center;
}

/* フッター背景を全幅に */
#footer {
    margin: 0 calc(50% - 50vw);
    width: 100vw;
}
div#footer-in {
    max-width: 1100px;
    width: auto;
}

/* フッターのグローバルメニュー非表示に */
div#navi-footer-in {
    display: none;
}

/* テキストの調整 */
.footer-widgets {
	margin-bottom: 0;
}
/* 左側テキスト調整 丸松博愛舎部分 */
aside#custom_html-2 .textwidget.custom-html-widget {
  display: flex;
}
div#footer-companyName a{
 font-size: 2.5rem;
 padding-left: .5rem
}
/* 株式会社部分 */
.footer-corporation {
    line-height: 1.5rem;
    display: flex;
    align-items: center;
}
/* 右側テキスト */
aside#custom_html-4 .textwidget.custom-html-widget {
    text-align: right;
}
.textwidget.custom-html-widget a{
	text-decoration-line: none;
}
aside#custom_html-4 {
    margin-bottom: 10px;
}
/* キャッシュレスアイコン */
aside#media_image-3 {
    text-align: right;
    margin-bottom: 0;
  }
/* copylight部分 */
.footer-bottom{
	margin-top: 0;
	padding: 0;
}


/***********************************************
  再利用ブロック/ ボトムの問合せ・TEL部分
 ***********************************************/
 h2.has-text-align-center.text-inquiry {
    padding-bottom: 0.5rem;
} 

  /*-----　20240711追記：加勢 ----------------------*/
/* ボタン同士の感覚を狭くする */
figure.wp-block-image.aligncenter.size-full.btn-freedial,
figure.wp-block-image.aligncenter.size-full.btn-contactUs {
    margin-bottom: 10px;
}
/* ボタン上のPタグ下にmargin */
p.has-text-align-center.inquiry-information {
    margin-bottom: 1rem;
}
/*　ひなぎくの会入会ボタンを一時非表示にする */
/*
figure.wp-block-image.aligncenter.size-full.btn-hinagikuApp {
	display: none;
}
*/
/* ボタンサイズを少し小さくする:　この記述キープする
.btn-freedial,
.btn-contactUs,
.btn-hinagikuApp {
    width: 375px
    }
*/


/* コンテンツ下のマージン調整 fotterとの隙間を消すため */
.wp-block-cover.is-light.reuse-inquiry {
	margin-bottom: -1px;
}


/****************************************
     投稿ページ 
*****************************************/
/* ヘッダー画像を全幅にする */
.wp-block-cover.is-light.post-BG-title {
    margin: 0 calc(50% - 50vw);
  }
/* ヘッダーとタイトル画像間の空白を消す */
.wp-block-cover.is-light.post-BG-title {
    margin-top: -1px!important;
}
.wp-block-cover.is-light.post-BG-title {
    margin: 0 calc(50% - 50vw);
  }
h1.post-BG-title {
    text-align: center;
}

.single-post h1.entry-title{
    display: block;
    font-size: var(--xxl)!important;
}

/* コンテンツ幅 900pxにする */
.single-post div#block-7 {
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }




/*=======================================
-----------------------------------------
     レスポンシブデザイン (共通)
----------------------------------------
=========================================*/
/*--------------
   1536px以下
---------------*/
@media screen and (max-width: 1536px) {
/* ヘッダー左 */
/* ロゴ(丸松博愛舎）*/ 
span.site-name-text {
    font-size: var(--xxl);
}
.site-name-text-link {
    padding: 5px;
}
/* 創業16年～ */
.tagline{
    font-size: var(--m);
}
/* 株式会社 部分*/
p.stock-company {
    line-height: 20px;
    padding-top: 14px;
    font-size: var(--m);
}
/* ヘッダー 右 */
.header-container-right{
    margin-right: 2rem;
}
div#header-in{
    margin-left: 2rem;
}
/* コンテンツ幅調整 */
.header-container-right {
    flex-basis: fit-content;
    gap:10px;
}
/* 365日、フリーダイヤルのブロック */
.inner-Right {
    display: inline-block;
}
/* 365日24時間対応 */
.reception-time{
    font-size: var(--m);
}
/* フリーダイヤル */
span.header-telNO {
    font-size: 2rem;
    line-height: 1.75rem;
    text-align: right;
    overflow-wrap: normal;
}
/* アスカネット注文バナー調整 */
header#header .wrap {
    flex-basis: fit-content;
}
.bnr-orderFlowers {
    padding-top: 0.5rem;
}

}


/*-----------------
   1440px以下
------------------*/
@media screen and (max-width: 1440px){
#navi .navi-in > ul > li > a {
    padding: 0 2em;
    }
}


/*-------------------------------------
   1366px以下(タブレット）
-------------------------------------*/
@media screen and (max-width: 1366px){
/* 【共通】tコンテンツ全体の左右に余白いれる */
div#content{
    padding: 0 3rem;
}

/* 上に戻るボタン 位置 大きさ */
div#go-to-top {
    right: 1%;
    bottom: 1%;
}
.go-to-top-button {
    width: 7vw;
    height: 7vw;
}
}


/*--------------
  1280px以下
--------------*/
@media screen and (max-width: 1280px) {
/* グローバルメニュー幅の調整 */
#navi .navi-in>ul>li {
    width: auto;
}
}


/*--------------
   1024px以下
--------------*/
@media screen and (max-width: 1024px){
/* ヘッダー左 */
/* ロゴ(丸松博愛舎）*/ 
span.site-name-text {
    font-size: 2rem;
}
/* 創業16年～ */
.tagline{
    font-size: 0.875rem;
}
/* 株式会社 部分*/
p.stock-company {
    font-size: 0.875rem;
}
/* ヘッダー 右 */
/* フリーダイヤル */
span.header-telNO {
    font-size: var(--l);
}
/*--- フッター ----*/
.footer-left, .footer-center, .footer-right {
    width: auto;
}
.footer-widgets {
    margin-bottom: 0;
    justify-content: space-between;
}
}


/*--------------
  1023px以下
--------------*/
@media screen and (max-width: 1023px){

/* ヘッダー 
----------------------------*/
/* PC版の社名「丸松博愛舎」を出す。※cocoonテーマで消えるため */
.no-mobile-header-logo #header .logo-header {
    display: flex;
}
/*モバイルタイトル分の予約が出るので、消す*/
.mblt-header-mobile-buttons {
 margin-top: 0!important;
}

/* フッター
-----------------------------*/
.footer-widgets {
    display: flex;
}
.footer-widgets > div{
    width: auto;
}
}


/*----------------------
 （600px ～ 1022px）
------------------------*/

/* PC用グローバルメニューの調整/ ヘッダーまわり調整 */
/* グローバルメニュー 601pxから1022pxまで表示させる */
/*（デフォルトは1023pxまで表示になっている） */
@media screen and (min-width:601px) and (max-width:1023px){
.navi-in .menu-pc{
	display: flex;
}
/* メニューを2段にする*/
.navi-in > ul{
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
}

.site-name-text-link{
    padding: 5px;
}
}


/*----------------
  835px以下
----------------*/
@media screen and (max-width: 835px){

/*---【再利用ブロック】「お問い合わせ」---*/
h2.text-inquiry {
    font-size: 1.75rem!important;
}

/*------- フッター ------*/
/* 社名のフォントサイズ調整 */
div#footer-companyName a{
    font-size: 2rem;
	padding-left: 5px;
}
.footer-corporation {
    line-height: 1.2;
    font-size: 13px;
}
}


/*----------------
  834px以下
----------------*/
@media screen and (max-width: 834px){
/* 【共通】ヘッダー・フッターと、カバーブロック背景との間の余白を消す */
main#main {
	padding: 0;
}

/*ヘッダー 左 */
/* 創業106年～*/ 
div#header-in {
    margin-left: 2rem;
    margin-bottom: 1.5rem;
}
.tagline {
    font-size: var(--s);
    min-width: 250px;
}
/* 株式会社 */
p.stock-company {
    line-height: 1rem!important;
    font-size: var(--s);
    padding-top: 0px;
    padding-bottom: 0;
}
/* ロゴ「丸松博愛舎」 */
#header .site-name-text {
    font-size: 1.75rem;
}
a.site-name.site-name-text-link {
    line-height: 0.8;
}
.logo.logo-header.logo-text {
    padding: 0px;
    margin-top: 0px;
}

/* ヘッダー 右 */
/* 365日24時間対応 */
.reception-time {
    font-size: var(--s);
}
/* フリーダイヤル */
span.header-telNO{
    line-height: 0;
}

/* アスカネット 注文バナー */
.bnr-orderFlowers img {
    max-width: 90%;
}
.bnr-orderFlowers {
    text-align: right;
}
.bnr-orderFlowers {
    padding-top:0;
}

}


/*----------------
    768px以下
----------------*/
@media screen and (max-width: 768px){
/*--- ヘッダー部分 ---*/
header#header{
    padding-top: 0;
}
/* グローバルメニュー上部 */
.navi-in > ul {
    margin-top: 1.5rem;
}

/* ヘッダー 右 */
/* フリーダイヤル */
.inner-Right {
    min-width: 160px;
}

/*フッター 左 */
div#footer-companyName a {
    font-size: 1.5rem;
}
/*フッター 右 */
.textwidget.custom-html-widget a{
    font-size: 14px;
}

/*------【再利用ブロック】～お問い合わせ～ -------*/
h2.has-text-align-center.text-inquiry.has-ex-a-color.has-text-color.has-large-font-size {
    font-size: var(--xxl)!important;
}
}


/*---------------------
     601px以上
---------------------*/
/******************************************
モバイル用グローバルメニュー/ ヘッダー
******************************************/
/* ハンバーガーメニューと社名を
  601pxまで非表示にする */

@media screen and (min-width: 601px){
ul.mobile-header-menu-buttons.mobile-menu-buttons.has-logo-button{
    display: none;
}
}


/*================================================
    600px以下 ※ここからヘッダーがスマホデザイン
=================================================*/
@media screen and (max-width: 600px){
/* 【共通】コンテンツ全体の左右に余白いれる */
div#content{
    padding: 0 1.25rem;
}

/* 20240401:テーマ更新後の修正::加勢記*/
/* 【共通】背景画カバー内のコンテンツ全体の左右に余白いれる */
.spaceRL {
    padding: 0 1.25rem;
  }

/* --------------------------------------------------------------
ハンバーガーメニューとスマホ版ヘッダー部分を600px以下で表示させる */
ul.mobile-header-menu-buttons.mobile-menu-buttons.has-logo-button{
    display: flex;
	background: #fff2f8;	
}
/* ハンバーガーメニューのキャプション消す */
.mobile-menu-buttons .menu-caption{
    display: none;
}
/* ハンバーガーメニュー 右側に置く */
span.fas.fa-bars{
    font-size: 28px;
}
	
/* ハンバーガーメニューとモーダルウィンドウ */
 /*モーダルウィンドウ非表示*/
#navi-menu-close {
    background: transparent;
}
div#navi-menu-content {
    max-width: 220px;
    width: 100%;
}
.menu-content{
    background: #fef7fa;
}

/* PC版の社名  丸松博愛舎を消す */
.no-mobile-header-logo #header .logo-header {
    display: none;
}
/* ヘッダーにでる検索マークを消す */
label#search-menu-open {
   display: none;
}
/* PC版の社名・キャッチコピー.365日～を消す */
.tagline,
.logo.logo-header.logo-text,
.reception-time{
    display: none;
}
/* 社名の位置調整 */
.has-logo-button .menu-button {
    width: 50px;
    text-align: left;
}

/*-------------------------------------------
 PC用フリーダイヤル・365日～を600pxから非表示にする */
span.header-telNO,
.inner-Right {
    display: none;
}


/*---------------------------------------
スマホ用電話アイコンを600pxから表示させる */

 .inner-Right_sp {
    display: inline-block;
}


/* 電話アイコンをヘッダーに置く */
header#header{
    position: fixed;
    display: flex;
    top: 7px;
    right: 0px;
    z-index: 5;
    max-height: 50px;
    height: auto; 
}
.header-container-right{
    margin-right: .5rem;
}


/*-- アスカネット  弔電・お花のご注文バナー 
::モバイル版 600pxから) ヘッダーの下に固定配置  ---
.bnr-orderFlowers {
    display: block;
    width: 200px;
    position: fixed;
    top: 60px;
    right: 7px;
    z-index: 6;
    margin-bottom: 0;
    margin-top: 3px;
    padding-top:0;
}
.bnr-orderFlowers img {
    max-width: 100%;
}*/


/* 上へ戻るボタンの大きさ、位置調整 */
div#go-to-top {
    right: 3%;
}
.go-to-top-button {
    width: 50px;
    height: 50px;
  }


/*metaスライーダーがhead title帯に隠れてしまうのを調整 */
div#metaslider_645 {
    margin-top: 50px;
}



/*------【再利用ブロック】～下部  お問い合わせボタン～ -------*/
/* コンテンツ高さ調整 */
.wp-block-cover.is-light.reuse-inquiry {
    min-height: 400px!important;
}
h2.text-inquiry {
   padding-top: 0;
}


/*------ フッター （モバイル用）----------------------------*/
/* モバイル用を表示させる :20240412改修 kase */
.footer-mobile {
    display: block;
}

/* PC用を非表示にする :20240412改修 kase */
.footer-widgets.cf {
    display: none;
}

/* テキストの行間調整 */
aside#custom_html-6 {
    margin-bottom: 3px;
}
aside#media_image-4 {
    margin-bottom: 0;
}
}

/*--------------
  428px以下
---------------*/
@media screen and (max-width: 428px){
/* ヘッダー フリーダイヤル */
span.header-telNO {
    font-size: 1rem;
    letter-spacing: 0;
}

/* 上へ戻るボタン 大きさ */

}


/*-----------------
  320px以下
-----------------*/
@media screen and (max-width: 320px){
    
/* フリーダイヤル */
span.header-telNO {
    font-size: 14px;
}

/* フッター 文字調整 */
div#footer-companyName a{
	font-size: 1.25rem;
}
.textwidget.custom-html-widget a{
	font-size: 12px;
}
.footer-corporation {
	font-size: 10px;
}
}


/****************************
  投稿ページ
****************************/
div#block-7 h1{
    margin: 2em 0;
}

.pager-post-navi {
    margin-top: 100px;
}



/* アスカネットご注文バナー  一旦非表示 :: 2023/4/3 */
.bnr-orderFlowers {
    display: none;
  }



/*----End----------------------------*/