@charset "UTF-8";
/*
Theme Name: GAZA-C
Description: AMX-003 / MMT-1 ■1.0.1アップデートテスト。■1.0.2スマホ表示で#breadcrumbに{line-height: 2em;}設定。■1.0.3フロントページを固定ページにせず投稿0の時構造化データエラーが出るのを解消。(最初の画像をアイキャッチ画像　を投稿0の時無効にした。)■1.0.4見た目のみの改良。ul,olのbottomをpと同じ10pxに。■1.2.0 NeoZeonの機能(キーワードトップ、地域ページのコンテンツを、共通or個別で簡単に選択)に対応。■1.2.1 canonicalをパラメータ付きURL対応に。■2.0.0以降、admin.php?page=gazac_setting01に記録。
Author: グレミー・トト
Version: 3.0.4
*/
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//全体用
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
/*◆◆初期設定◆◆*/
*, *:before, *:after{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
/*▼▼▼▼▼フロート解除の定番▼▼▼▼▼*/
.clearfix:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix{
	display: inline-table;
}
/* Hides from IE-mac \*/
* html .clearfix{
	height: 1%;
}
.clearfix{
	display: block;
}
/*▲▲▲▲▲フロート解除の定番▲▲▲▲▲*/
/*◆◆リストの見栄え◆◆*/
ul,ol{
    padding: 0 0 1em 2em; /*main p のbottomを1emにしてるので、このbottomも1em*/
}

h1,h2,h3,h4,h5,h6,p,li{
    line-height: 1.5em;
}
p,li{
    font-size: 110%;
}
img {
    max-width: 100%;
    height: auto;
}
/*◆◆youtube埋め込み(heightは指定したらおかしくなる）◆◆*/
iframe{
	width: 100%;
}
/*◆◆wordpress標準class（このcssを記述しておかないと投稿内の画像真ん中とかが効かない。）◆◆*/
.aligncenter{
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.alignright{
	float: right;
	margin-left: 1.5em;
}
.alignleft{
	float: left;
	margin-right: 1.5em;
}
.alignleft{
	float: left;
	margin-right: 1.5em;
}
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//枠組み
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
body{
    background-color: gainsboro;
}
header{
    width: 100%;
    text-align: center;
    background-color: white;
}
#wrap{
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1em;
}
#main{
    width: 75%;
    float: left;
    padding: 1em;
    margin-bottom: 1em;
    background-color: white;
}
#mainfull{
    width: 100%;
    padding: 1em;
    margin-bottom: 1em;
    background-color: white;
}
#sidebar{
    width: 23%;
    float: right;
    padding: 1em;
    margin-bottom: 1em;
    background-color: white;
}
footer{
    width: 100%;
    text-align: center;
    background-color: white;
    padding: 1em 0 80px 0; /*フッターメニュー分の幅を取る*/
}
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//全体的装飾
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
header{
    padding: 0.5em 0em;
}
.font_size_reset{
    font-size: 100%;
}
.head_h1{
    font-size: 100%;
    font-weight: normal;
}
.site_logo_txt{
    font-size: 150%;
    font-weight: bold;
}

main h2{
    font-size: 150%;
    font-weight: bold;
    padding: 0.5em;
    margin-bottom: 10px;
}
main h3{
    font-size: 120%;
    font-weight: bold;
    padding: 0.5em;
    margin-bottom: 10px;
    width: 90%;
}
main h4{
    font-size: 100%;
    font-weight: bold;
    padding: 0.5em;
    margin-bottom: 10px;
    width: 80%;
}
main h5, main h6{
    font-size: 100%;
}
main p,figure{
    margin-bottom: 1em;
}
.post_thumbnail img{
    border: 1px solid blue;
}
.post_div{
    padding: 1em 0em ;
    border-bottom: 1px solid #000;
}
/*
//=========================================================================================================
//配色
//=========================================================================================================
*/
:root{
    --bgcolor_white : #F2F2F2; 
    --h_white : #D8D8D8;
    --h_text_white : #000;
    --bgcolor_pink : #BE008D; 
    --h_pink : #F0F;
    --h_text_pink : #FFF;
    --bgcolor_blue : #8DCCF7; 
    --h_blue : #1D9BF0;
    --h_text_blue : #FFF;
    --bgcolor_green : #8CABD8; 
    --h_green : #07B53B;
    --h_text_green : #FFF;
    --bgcolor_orenge : #F3E2A9; 
    --h_orenge : #FACC2E;
    --h_text_orenge : #000;
}
/*◆◆配色_white◆◆*/
#body_white{
    background-color: var(--bgcolor_white);
}
#body_white main h2, #body_white main h3{
    background-color: var(--h_white);
    color: var(--h_text_white);
}
#body_white main h4{
    border-bottom: 5px solid var(--h_white);
}
/*◆◆配色_pink◆◆*/
#body_pink{
    background-color: var(--bgcolor_pink);
}
#body_pink main h2, #body_pink main h3{
    background-color: var(--h_pink);
    color: var(--h_text_pink);
}
#body_pink main h4{
    border-bottom: 5px solid var(--h_pink);
}
/*◆◆配色_blue◆◆*/
#body_blue{
    background-color: var(--bgcolor_blue);
}
#body_blue main h2, #body_blue main h3{
    background-color: var(--h_blue);
    color: var(--h_text_blue);
}
#body_blue main h4{
    border-bottom: 5px solid var(--h_blue);
}
/*◆◆配色_green◆◆*/
#body_green{
    background-color: var(--bgcolor_green);
}
#body_green main h2, #body_green main h3{
    background-color: var(--h_green);
    color: var(--h_text_green);
}
#body_green main h4{
    border-bottom: 5px solid var(--h_green);
}
/*◆◆配色_orenge◆◆*/
#body_orenge{
    background-color: var(--bgcolor_orenge);
}
#body_orenge main h2, #body_orenge main h3{
    background-color: var(--h_orenge);
    color: var(--h_text_orenge);
}
#body_orenge main h4{
    border-bottom: 5px solid var(--h_orenge);
}
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//パンくず
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
#breadcrumb{
    padding: 1em 0em;
	font-size: 100%;
}
#breadcrumb ol{
    padding-left: 0em;
}
#breadcrumb ol li{
	display: inline;
	line-height: 1em;
}
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//その他、各所装飾
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/

/*
//=========================================================================================================
//目次
//=========================================================================================================
*/
.toc__list{
    padding-bottom: 0em;
}
.toc__sublist{
    padding-bottom: 0em;
}
/*
//=========================================================================================================
//フッターメニュー
//=========================================================================================================
*/
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//アイコン配置
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
.footer_navi{
	position: fixed;
	bottom: 0;
    width: 100%;
    text-align: center;
    padding: 1em;
    background-color: white;
    opacity: 0.8;
}
.footer_navi ul{
    padding-left: 0em;
}
.footer_navi ul li{
	display: inline;
    padding: 2em 1em;
}
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//モーダルウィンドウの中身
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
.main_navi h1{
    font-size: 100%;
    font-weight: normal;
}
.main_navi ul li{
    padding-top: 1em;
}
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//メニューボタンでモーダルウィンドウ
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
/*https://recooord.org/jquery-modal-window/*/
/*モーダル本体の指定 + モーダル外側の背景の指定*/
.modal-container{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background: rgba(0,0,0,50%);
	padding: 40px 20px;
	overflow: auto;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
    box-sizing: border-box;
}
/*モーダル本体の擬似要素の指定*/
.modal-container:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
/*モーダル本体に「active」クラス付与した時のスタイル*/
.modal-container.active{
	opacity: 1;
	visibility: visible;
}
/*モーダル枠の指定*/
.modal-body{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	max-width: 500px;
	width: 90%;
}
/*モーダルを閉じるボタンの指定*/
.modal-close{
	position: absolute;
	display: flex;
    align-items: center;
    justify-content: center;
	top: -40px;
	right: 0px;
	width: 40px;
	height: 40px;
	font-size: 40px;
	color: #fff;
	cursor: pointer;
}
/*モーダル内のコンテンツの指定*/
.modal-content{
	background: #fff;
	text-align: left;
	padding: 1em;
}
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//ページチェック用アドミンフッター
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
.gazac_admin_footer {
    font-size: 80%;
    position: fixed;
    bottom: 0;
    padding: 5px;
    background-color: #1D2327;
    opacity: 0.5;
    width: 100%;
    color: #fff;
    text-align: center;
}
.gazac_admin_footer a {
    color: #fff;
}
.gazac_admin_footer ul {
    padding: 0 !important;
}
.gazac_admin_footer li {
    display: inline;
    padding: 0 1em;
}
.gazac_txt_bold {
    font-weight: bold;
}
.gazac_txt_yellow{
    color: #ff0;
}
/*
//=========================================================================================================
//投稿日・更新日、カテゴリー・タグ
//=========================================================================================================
*/
.post_date {
    font-size: 80%;
    margin: 0;
    padding: 1em 0 1em 0;
    text-align: right;
    font-style: italic;
}
.post_date li {
    display: inline;
}
.gazac_cate_tag_area{
    background-color: #f0f0f0;
    font-style: italic;
}
/*
//=========================================================================================================
//アコーディオン
//=========================================================================================================
*/
/* .gazac_tocは目次。等、他のアコーディオンを作るならclass名で個別設定しよう。 */
.gazac_toc {
    margin-bottom: 2em;
    color: #000;
    outline: 1px solid #aaa;
    /*border-radius: 3px;*/
}
/* ▼▼▼Neo Zeonと完全に同じ記述だが、Neo Zeonを使わない時に必要なので記述している。 */
summary {
    cursor: pointer;
    padding: 0.5em;
    background-color: #f6f7f7;
}
details[open] {
    animation: fadein 0.5s ease;
}
@keyframes fadein {
	0% {
		opacity: 0;
		transform: translateY(-1px);
	}
	100% {
		opacity: 1;
		transform: none;
	}
}
details[open] > summary {
    background-color: #F2F2F2;
}
details:not([open]) > summary {
    background-color: #f6f7f7;
}
/* ▲▲▲Neo Zeonと完全に同じ記述だが、Neo Zeonを使わない時に必要なので記述している。 */
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//レスポンシブ
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/
/*◆◆タブレット縦の幅をブレイクポイントにする◆◆*/
@media (max-width: 768px){

#main{
    width: 100%;
    float: none;
}
#sidebar{
    width: 100%;
    float: none;
}
#breadcrumb{
    line-height: 2em;
}

.post_date li {
    display: block;
}
}
/*
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
//end of file
//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
*/