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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
body{}
span.hissu{color:#FF0004;}
.ark-block-accordion__title{color:#333333;}
.contactform{color:#333333;}
.wpcf7-response-output{color:#333333;}

/*cat_itemlist*/
.itemlist_cat_list{
}
.itemlist_cat_list ul{
	margin:1em!important;
	padding:0!important;
}
.itemlist_cat_list ul li{
	padding:0!important;
	
	display:inline-block;
width:140px;
height:260px;
vertical-align:top;
margin:5px;
}
.itemlist_cat_list_img{
width:140px;
height:130px;
overflow:hidden;
border-radius: 6px;
text-align:center;
}
.itemlist_cat_list_img img{
border-radius: 6px;
border:1px solid #F0F0F0;
}
.itemlist_cat_list_ttl{
margin-top:10px;
line-height: normal;
font-size:14px;
}
.itemlist_cat_list_ttl a{text-decoration:none;}
.itemlist_cat_list_ttl a:hover{text-decoration:underline;}
#content_kakou h1{text-align:center;}
#content_kakou h2{
padding:0 15px;
	background:#10701B;
}
#content_kakou h2 a{color:#fff;text-decoration:none;}
#content_kakou h2 a:hover{text-decoration:underline;}
.video-container {
margin: 0px auto;
}
.video-container iframe {
border:1px solid #fff;	
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}



/************************************
** トップページだけタイトルを非表示にする
************************************/
.site-name-text {
display: none;
}
article#post-6 .entry-title{
display: none;	
}
/************************************
** 背景を黒に
************************************/


// Code from https://shuhu-marketing.com/web-marketing/google-analytics/tracking-contactform7-ga4/
add_action( 'wp_footer', function () { //<footer>内で実行します
?>
<script>
    document.addEventListener( 'wpcf7mailsent', function( event ) {
      if ( '6' == event.detail.contactFormId ) { //contactform7のidが1の場合のみ
        window.dataLayer = window.dataLayer || [];
        window.dataLayer.push({ 'event': 'wpcf7_submission', 'wpcf7_type': 'お問い合わせ' });
      }
      else { //上記以外のフォームの場合
        window.dataLayer = window.dataLayer || [];
        window.dataLayer.push({ 'event': 'wpcf7_submission', 'wpcf7_type': 'その他のフォーム' });
      }      
    });
</script>
<?php
}, 10, 0 );
.cat_list{
border:1px solid #941719;
margin:1em;
}

.cat_list ul{
margin:0 0 0 2em;
padding:0;

}

.cat_list li{
padding:.5em;
border-bottom:#828282 1px dotted;
margin-bottom:.5em;
}







/************************************
** フッター
************************************/
/*
 * PC/デフォルトのスタイル (静的フッター)
 */
#global-footer {
    width: 100%;
    position: static; 
    padding: 30px 0;
    background-color: #006400; 
    color: #fff !important; 
    box-sizing: border-box;
    z-index: 99; 
}

.footer-buttons-container {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1000px;
    margin: 0 auto;
    gap: 20px; 
}

/* ボタンの共通スタイル */
.btn {
    flex-grow: 1;
    max-width: 300px;
    display: block;
    padding: 15px 10px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 6px;
    transition: opacity 0.3s;
    text-align: center;
    color: #fff !important; 
}

/* PCでのホバー効果 */
.btn:hover {
    opacity: 0.8;
}

/* ⚠️ タッチデバイスでの色崩れ防止スタイル (PC/SP共通) */
/* タップ時やフォーカス時に背景色とテキスト色を維持 */
.btn-tel:active, .btn-tel:focus, .btn-tel:focus-visible {
    background-color: #003300 !important; 
    color: #fff !important;
}
.btn-mail:active, .btn-mail:focus, .btn-mail:focus-visible {
    background-color: #05514d !important; 
    color: #fff !important;
}
.btn-line:active, .btn-line:focus, .btn-line:focus-visible {
    background-color: #177774 !important; 
    color: #fff !important;
}

/* PC/SP 共通のボタン色設定 */
.btn-tel { 
    background-color: #003300; 
} 
.btn-mail { 
    background-color: #05514d; 
} 
.btn-line { 
    background-color: #177774; 
} 

/* PCでのアイコンと文字の配置調整 */
.btn i {
    font-style: normal;
    margin-right: 5px;
    color: #fff !important;
}

/* ------------------------------------------- */
/* * スマートフォン用のスタイル（768px以下で適用） */
/* ------------------------------------------- */
@media screen and (max-width: 768px) {
    
    /* ⚠️ 修正点: スマホではホバー効果を完全に無効化 (透明度を1に固定) */
    .btn:hover {
        opacity: 1;
    }
    
    /* 画面下部固定フッターの設定（フローティング） */
    #global-footer {
        position: fixed; 
        bottom: 0;
        left: 0;
        z-index: 9999; 
        padding: 0; 
        background-color: #ffffff; 
        border-top: 1px solid #ccc; 
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
        color: #333 !important; 
    }

    .footer-buttons-container {
        width: 100%;
        margin: 0;
        gap: 0; 
    }

    .btn {
        flex: 1 1 33.33%; 
        padding: 20px 5px; 
        border-radius: 0; 
        font-size: 0.8rem;
        color: #fff !important; 
        
        display: flex;
        flex-direction: column; 
        align-items: center;
        justify-content: center;
    }
    
    .btn i {
        font-size: 1.5rem; 
        margin-right: 0;
        margin-bottom: 2px;
        display: block;
        color: #fff !important;
    }
    
    /* ボタンの間の区切り線 */
    .btn:not(:last-child) {
        border-right: 1px solid rgba(0, 0, 0, 0.1); 
    }
    
    /* SP固定フッターでコンテンツが隠れないように、bodyにpadding-bottomを追加する */
    body {
        padding-bottom: 85px; 
    }
}