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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* フッター上部のマージン */
.footer-bottom {
  margin-top: 0px;
}


/* ヘッダーの高さ設定 */
.mobile-menu-buttons {
    min-height: 70px !important;
}


/* 背景色#0037a6のaタグのフォント色指定 */
td[style*="background-color:#0037a6"] a {
    color: #e3f2fd;
    text-decoration: underline;
}

/* 背景色#0037a6のaタグホバー時の色指定 */
td[style*="background-color:#0037a6"] a:hover {
    color:#e53900;
	  text-decoration-color: #e53900;
}


/* h3見出し変更 */
.article h3 {
    border-left: 7px solid #4d2e5e;
    border-right: none;
    border-top: none;
    border-bottom: none;
    font-size: 22px;
    padding: 12px 20px;
}


/* 1. ボタンが入っているpタグ同士を囲うための調整 */
.wpcf7-form p:has(.wpcf7-previous), 
.wpcf7-form p:has(.wpcf7-submit) {
    display: inline-block !important;
    margin: 1em 1.5em 0em 0em !important;
    padding: 0 !important;
    vertical-align: middle; /* これで上下の位置を揃えます */
}

/* 2. 送信ボタンの横幅固定を解除（重要！） */
.wpcf7-form-control.wpcf7-submit {
    width: auto !important;  /* 100%を解除 */
    display: inline-block !important;
    padding: 15px 67px !important;
    font-size: 18px !important;
    font-weight: bold !important;
    background-color: #ff8d1b !important;
    color: #FFFFFF !important;
    border: 0 !important;
  	border-radius: 4px !important;
    margin: 0 !important;
}

/* 3. 戻るボタンの修正 */
.wpcf7-form-control.wpcf7-previous {
    display: inline-block !important;
    padding: 15px 20px !important;
    font-size: 16px !important;
  	color: #595959 !important;
    margin: 0 !important;
    border: 1px solid #ccc !important;
    background-color: #f0f0f0 !important; 
    box-shadow: none !important;
	  border-radius: 4px !important;
}

/* 4. 送信ボタンの横にあるスピナーを非表示にする */
.wpcf7-spinner {
    display: none !important;
}



/* TOP二中生のために枠の文字変更 */
.cocoon-block-caption-box.has-border-color.not-nested-style > .box-label {
    color: #0037A6 !important;
}


/* お知らせ上テキストマージン */
.article p.has-text-align-center {
  margin-top: 1.0em;
  margin-bottom: 1.0em;
}


/* ヘッダーと本文の間の余白 */
#main.main {
  padding: 0 20px !important;
}

/* TOPヘッダーした枠上の余白*/
:root {
  --cocoon-box-padding: 8px;
}


/* 入塾相談、体験授業受付中上の余白*/
p.has-border {
  margin-bottom: 0;
}

/* お知らせ内の行間を0*/

.tab-content.is-active p {
  margin-bottom: 0;
}

/* お知らせ枠画像 */
.wp-block-columns.is-not-stacked-on-mobile.is-layout-flex.wp-block-columns-is-layout-flex {
    gap: 0rem;
}

p[style*="padding-right"] {
    padding-right: 0.5em !important;
}


/*ヘッダーモバイルボタンの文字色と背景色を変更*/
.search-menu-button.menu-button,
.navi-menu-button.menu-button{
	background:#4D2E5E;
	color: #ffffff;
}

.search-menu-button.menu-button{
    opacity: 0.8;
}

.logo-menu-button.menu-button{
	background: #4D2E5E;
}

.logo-menu-button img {
    max-height: 65px;
}

.mobile-menu-buttons{
	background: #4D2E5E;
	line-height: 1.2;
}


/*スマホヘッダーのメニューボタン*/
.mobile-menu-buttons .menu-icon {
	font-size: 30px !important;
	opacity: 0.8;
}


#navi-menu-content .navi-menu-close-button .fa-close {
    color: #696969;


	
/* SPヘッダー下タイトルの間の余白 */
@media screen and (max-width: 834px) {
    .content {
        margin-top: 0px;
    }
}


/* 表のフォントサイズ */
@media screen and (max-width: 834px) {
    table th, table td {
        padding: 3px;
        font-size: 16px;
    }
}

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

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

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