/**
Theme Name: yoshikouji
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: yoshikouji
Template: astra
*/

/* about-31ページでWooCommerce CSSを無効化 */
body.page-id-2534 .woocommerce,
body.page-id-2534 .woocommerce-page,
body.page-id-2534 [class*="woocommerce"] {
    display: none !important;
}



/* 1. トップページ以外のヘッダー下余白を完全に削除 */
body:not(.home) .site-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body:not(.home) .ast-container {
    padding-top: 0 !important;
    margin-top: 0 !important;
    max-width: 100% !important;  /*コンテナの幅制限を解除 */
}

body:not(.home) #primary {
    margin-top: 0 !important;
}

/* 2. タイトルエリアを復活させ、指定の画像で全幅表示にする */
.page-id-2534 .entry-header {
    display: flex !important; /* 非表示を解除し、中央配置に設定 */
    flex-direction: column;
    justify-content: center;
    align-items: center;

    /* 背景画像の設定 */
    background-image: url('http://kouji-cook.com/wp-content/uploads/2026/01/top.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    /* 画面幅いっぱいにする設定 */
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    margin-left: -50vw !important;

    /* 画像の高さ（上下の余白） */
    padding: 120px 20px !important;
    margin-bottom: 50px !important;
}

/* 3. タイトル文字を白く、読みやすく表示する */
body:not(.home) .entry-header .entry-title {
    display: block !important; /* 非表示を解除 */
    color: #ffffff !important;
    font-size: 2.5rem;
    font-weight: bold;
    text-shadow: 0 2px 10px rgba(0,0,0,0.7);
    margin: 0 !important;
}


/* 4. 【重要】本文（コンテンツ）の横幅を固定して中央に寄せる */
body:not(.home) .ast-container {
    max-width: 1200px !important; /* 本文の最大幅を制限 */
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* 5. .consept クラスのレスポンシブ設定 */
.consept {
    width: 600px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 921px) {
    .consept {
        width: 100% !important;
        padding: 0 20px;
        box-sizing: border-box;
    }
}

.consept{width:700px;
	line-height: 2.333 !important;
    letter-spacing: 0.07em;

/* 画面幅が921px以下（スマホ・タブレット）の指定 */
@media (max-width: 921px) {
    .consept {
        width: 100% !important;
        padding-left: 20px;  /* 左右に少し余白を入れると読みやすくなります */
        padding-right: 20px;
        box-sizing: border-box; /* パディングを含めて100%にする設定 */
    }
	
/* 1. トップページ以外のサイト全体の背景を白にする */
body:not(.home) {
    background-color: #ffffff !important;
}

/* 2. セパレートレイアウトの外枠背景（Astra特有）も白に固定 */
body:not(.home).ast-separate-container {
    background-color: #ffffff !important;
    background-image: none !important; /* 背景画像が設定されている場合を考慮 */
}

/* 3. コンテンツエリア自体の背景も白にする（念のため） */
body:not(.home), .ast-separate-container  {
    background-color: #ffffff !important;
    border: none !important; /* 記事の周りの境界線が気になる場合は追加 */
    box-shadow: none !important; /* 記事の影を消したい場合は追加 */
}
	
.ast-separate-container .ast-article-single {
    padding: 0em 6.67em !important;
}
	
	/* トップページ以外の背景色を白にする */
body, 
body.ast-separate-container {
    background-color: #ffffff !important;
    background-image: none !important;
}
	
	
	/***************/
	
	/* =============================================
   1. トップページ以外の背景色を完全に白にする
   ============================================= */
/* サイト全体の背景 */
body:not(.home), 
body:not(.home).ast-separate-container,
body:not(.home) #page {
    background-color: #ffffff !important;
    background-image: none !important;
}

/* 記事コンテンツの外枠（グレーに見える部分）を白に上書き */
body:not(.home) .site-content,
body:not(.home) .ast-separate-container .ast-article-single,
body:not(.home) .ast-separate-container .ast-article-post {
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

/* =============================================
   2. ヘッダー下の隙間をゼロにしてタイトル画像を全幅にする
   ============================================= */
/* コンテンツ全体の上の余白を消去 */
body:not(.home) .site-content {
    padding-top: 0 !important;
}

/* タイトルエリア（entry-header）を画面幅いっぱいの画像にする */
body:not(.home) .entry-header {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

    /* 背景画像と黒フィルター */
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), 
                      url('http://kouji-cook.com/wp-content/uploads/2026/01/top.jpg') !important;
    background-size: cover !important;
    background-position: center !important;

    /* 全幅にするための設定 */
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    
    padding: 120px 20px !important;
    margin-top: 0 !important;
    margin-bottom: 50px !important;
}

/* タイトル文字を白にする */
body:not(.home) .entry-header .entry-title {
    color: #ffffff !important;
    text-shadow: 0 2px 10px rgba(0,0,0,0.7);
    display: block !important;
}

/* =============================================
   3. 本文の横幅を適切に保つ
   ============================================= */
body:not(.home) .ast-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* =============================================
   4. .consept クラスのレスポンシブ
   ============================================= */
.consept {
    width: 600px;
    margin: 0 auto;
}
@media (max-width: 921px) {
    .consept {
        width: 100% !important;
        box-sizing: border-box;
    }
}
	
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single {
    padding: 0 !important;
}
	
	.site-content {
    background-color: red !important;
}
	.ast-desktop-header{
		background-color:#000000 !important;}
	
	.site-content{background-color:#ffffff !important;
}