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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/***********************************
 * 
 *  全ページ 共通
 * 
 ***********************************/

/* メインエリア */
.main,
.skin-grayish.front-top-page .content .main {
	padding-top: 0;
}
@media screen and (max-width: 834px) {
	main.main, div.sidebar {
		padding-top: 0;
	}
}

/* PCヘッダーメニュー（トップページ以外） */
.skin-grayish:not(.front-top-page) .header-container { /* 背景色 */
	background-color: #ffa500;
	color: #fff;
}
ul.menu-pc li a {
	color: #fff;
}
ul.menu-pc li a:hover {
	scale: 1.2;
	color: #fff;
}
.skin-grayish .navi-in .search-menu-icon span::before { /* 右上 検索ボタン */
	color: #fff;
}


/* モバイルヘッダー */
@media screen and (max-width: 1023px){
	.skin-grayish .mobile-header-menu-buttons.mobile-menu-buttons { /* モバイルヘッダーメニュー */
		background-color: #ffa500;
	}
	.skin-grayish .mobile-menu-buttons .menu-button { /* モバイルヘッダーメニュー 文字色 */
		color: #fff;
	}
	.navi-menu-close-button { /* モバイルスライドメニュー ×ボタン */
		color: #ffa500;
	}
	.skin-grayish .search-submit { /* モバイルスライドメニュー 検索ボタン */
		color: #ffa500;
	}
}


/* フッター */
.footer-bottom-logo {
	display: none;
}
.widget-footer-right-title { /* フッター：右 */
	margin-top: 0 !important;
}

.skin-grayish .copyright { /* コピーライト */
	letter-spacing: 1.5px;
}

/* モバイルフッターボタン　非表示 */
.mobile-footer-menu-buttons {
	display: none !important;
}


/* h2 */
.article h2 {
	margin-top: 3em;
}

/* h4 */
.article h4 {
	margin-bottom: 0.5em;
}


/* サイドバー：検索ボタン */
.wp-block-search__button {
	background-color: #ffa500;
	border: 1px solid #ffa500;
}
.wp-block-search__button:hover {
	background: #32373c;
}

/* ボックスメニュー */
.box-menu .box-menu-icon {
	color: #ffa500;
}

/* 改行 */
br.sp {	display: none; } /* スマホ用を非表示 */

@media (max-width: 767px) { /* スマホ時 */
	br.pc { display: none } /* PC用を非表示 */
	br.sp { display: inline; }
}



/* 固定ページの投稿日・更新日・投稿者を非表示 */
.page .date-tags,
.page .author-info {
    display: none;
}

/***********************************
 * 
 *  トップページ
 * 
 ***********************************/

/* ヘッダー画像：トップページ */
.skin-grayish .header-in .logo-header img {
	max-width: 100%;
	max-height: 60vh;
}
@media screen and (max-width: 480px){
	.skin-grayish .header-in .logo-header img {
		max-width: 100%;
		max-height: 100vh;
	}
}

/* ヘッダー画像・文字 */
.skin-grayish .header-in .site-name-text:hover {
	text-decoration: none;
	color: #535252;
	scale: 1.0;
}
.tagline {
	background: #eee;
	font-size: 15px;
	font-weight: 600;
	opacity: 0.8;
	border-radius: 15px;
}

/* スクロールアニメーション */
.skin-grayish.front-top-page .skinadd-topmv-scroll { /* "scroll"文字 */
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	bottom: 15px;
}
.skin-grayish.front-top-page .skinadd-topmv-scroll::before { /* 下矢印 */
	border-width: 0px 0px 4px 4px;
	border-color: #ffa500;
}



@media screen and (max-width: 960px){
	
	/* モバイル：ヘッダーロゴ */
	.skin-grayish.front-top-page .header .header-in { 
		margin-top: 43vh;
	}
	
}

/* ヘッダーメニュー */
.skin-grayish #navi-in {
	background-color: #ffa500;
	opacity: 1.0;
}





/***********************************
 * 
** 　こうだ★ランド：詳細テーブル
 *
 ***********************************/

.land-top {
    position: relative;
    z-index: 10;
    margin: 0 auto;
    text-align: center;
}
.badge {
    display: inline-block;
    padding: 6px 16px;
    background: #ffedd5;
    border: 1px solid #fed7aa;
    color: #ea580c;
    font-size: 11pt;
    font-weight: bold;
    border-radius: 50px;
    margin-bottom: 24px;
    letter-spacing: 1px;
}
.title {
    font-size: 24pt;
    font-weight: 800;
    margin: 0 0 12px 0;
    line-height: 1.3;
    color: #431407;
}
.subtitle {
    font-size: 14pt;
    font-weight: 500;
    color: #7c2d12;
    margin: 0 0 32px 0;
}
.info-table {
    display: table;
    width: 100%;
    margin: 0 auto 36px auto;
    border-collapse: separate;
    border-spacing: 0 12px;
}
.info-row {
    display: table-row;
}
.info-label {
    display: table-cell;
    width: 120px;
    padding: 14px 16px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-right: none;
    border-radius: 12px 0 0 12px;
    font-size: 14pt;
    font-weight: bold;
    color: #ea580c;
    text-align: center;
    vertical-align: middle;
}
.info-value {
    display: table-cell;
    padding: 14px 20px;
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid #fed7aa;
    border-left: none;
    border-radius: 0 12px 12px 0;
    font-size: 14pt;
    color: #475569;
    text-align: left;
    vertical-align: middle;
    line-height: 1.5;
}
.status-alert {
    display: block;
    margin-top: 4px;
    font-size: 10pt;
    color: #16a34a;
    font-weight: bold;
}
.sub-address { /* 場所補足：住所 */
    display: block;
    font-size: 12pt;
    color: #64748b;
	margin-left: 15px;
	margin-top: 5px;
}
.action-container {
    margin-top: 16px;
}
.btn-primary {
    display: inline-block;
    padding: 14px 40px;
    background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
    border: none;
    border-radius: 14px;
    color: #ffffff;
    font-size: 12pt;
    font-weight: bold;
    text-decoration: none;
    box-shadow: 0 10px 20px rgba(234, 88, 12, 0.25);
}
.organizer-info { /* 主催者情報 */
    margin: 40px 0;
    padding-top: 24px;
    font-size: 11pt;
    color: #7c2d12;
    line-height: 1.6;
}
.organizer-info span {
    color: #9a3412;
}

/* ==   【重要】スマートフォン対応（画面幅 767px 以下の時のスタイル切り替え） == */

@media (max-width: 767px) {
    /* テーブルレイアウトの概念をすべて解除し、通常のブロック要素にします */
    .info-table {
        display: block;
        margin-bottom: 24px;
    }
    
    /* ひとつの情報セット（行）を独立した「カード」としてマージンを持たせます */
    .info-row {
        display: block;
        margin-bottom: 16px; 
    }
    
    /* ラベルを一番上のヘッダー帯のように変形 */
    .info-label {
        display: block;
        width: 100%;
        padding: 8px 16px;
        text-align: left; /* 左詰めに変更してスマホで読みやすく */
        border: 1px solid #fed7aa;
        border-bottom: none; /* 下の要素と結合するため */
        border-radius: 12px 12px 0 0; /* 上側だけ角を丸く */
        font-size: 12pt;
    }
    
    /* テキスト内容を下の広いエリアとして結合 */
    .info-value {
        display: block;
        width: 100%;
        padding: 14px 16px;
        border: 1px solid #fed7aa;
        border-top: none; /* 上のラベルと隙間なく結合 */
        border-radius: 0 0 12px 12px; /* 下側だけ角を丸く */
        font-size: 11pt;
    }
	.sub-address { /* 場所補足：住所 */
    	font-size: 10pt;
		margin-left: 0;
	}
	.organizer-info {
		font-size: 9pt;
		text-align: left;
	}
    
    /* タイトルなどのサイズもスマホ用に少しだけ縮小 */
    .title {
        font-size: 22px;
    }
    .subtitle {
        font-size: 14px;
        margin-bottom: 20px;
    }
    .btn-primary {
        width: 100%; /* ボタンを横幅いっぱいに広げて親指で押しやすく */
        padding: 14px 20px;
    }
}


/***********************************
 * 
** 　こうだ★ランド：協賛
 *
 ***********************************/

ul.land-sponsor,
ul.land-shop { /* 出店情報にもスタイル反映 */
	display: flex;
  	flex-wrap: wrap;
  	padding: 0;
  	margin: 2em 0;
  	list-style-type: none;
}
ul.land-sponsor li,
ul.land-shop li { /* 出店情報にもスタイル反映 */
  	padding: 10px;
	margin: 0;
  	margin-right: 1%;
  	margin-bottom: 2px;
  	border: 1px solid #ccc;
  	box-sizing: border-box;
	background: #fafafa;
	text-align: center;
}
ul.land-sponsor1 li {
	width: 100%;
	padding-right: 0;
    font-size: 1.1rem;
}
ul.land-sponsor0 li { /* 臨時追記のため、sponsor0 */
    font-size: 1.3rem;
}
ul.land-sponsor2 li {
	width: calc( 99% / 2 );
	font-size: 0.9rem;
}
ul.land-sponsor3 li {
	width: calc( 98% / 3 );
	font-size: 0.85rem;
}
ul.land-sponsor4 li {
	width: calc( 97% / 4 );
	font-size: 0.75rem;
}
ul.land-sponsor1 li,
ul.land-sponsor2 li:nth-child(2n),
ul.land-sponsor3 li:nth-child(3n),
ul.land-sponsor4 li:nth-child(4n) { /* 各右端のmargin消去 */
	margin-right: 0;
}
ul.land-sponsor li a {
	display: block;
	text-decoration: none;
	height: 100%;
	width: 100%;
}
ul.land-sponsor li a:hover {
	color: #ffa500;
}

/* スマホ */
@media screen and (max-width: 480px){
	
	/* PC：2カラム→1カラムへ */
	ul.land-sponsor2 li {
		width: 100%; 
		margin-right: 0;
		padding: 5px;		
	}
	/* PC：3・4カラム→2カラムへ */
	ul.land-sponsor3 li,
	ul.land-sponsor4 li {
		width: calc( 99% / 2 ); 
		padding: 3px;			/* paddingは小さく */
	}
	ul.land-sponsor3 li:nth-child(3n),
	ul.land-sponsor4 li:nth-child(4n) { /* PCでの右端marginを一旦リセット（3・4カラム時の） */
		margin-right: 1%;
	}
	ul.land-sponsor3 li:nth-child(2n),
	ul.land-sponsor4 li:nth-child(2n) { /* 2カラム用に */
		margin-right: 0;
	}
}



/***********************************
 * 
** 　こうだ★ランド：出店情報
 *
 ***********************************/

/* 出店情報：スポンサー情報のcss流用する形で */
ul.land-shop li {
	width: calc( 99% / 2 );
	font-size: 0.9rem;
	padding: 5px;
}
ul.land-shop li:nth-child(2n) {
	margin-right: 0;
}
/* スマホ */
@media screen and (max-width: 480px){
	ul.land-shop li {
		width: 100%;
		margin-right: 0;
	}
}


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

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

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