/* ---------- ---------- ---------- ---------- ---------- 

	共通 CSS
	common.css

 ---------- ---------- ---------- ---------- ---------- */
/*	テスト・作業用	*/
.caution{font-size:14px;padding:10px;background: var(--key-O1-color);}
/*
,
:before,
:after {box-sizing: inherit;}
tml {box-sizing: border-box;}
*/
/*		-----		フォントサイズ・装飾		-----	*/
.f26{font-size:26px;}
.f24{font-size:24px;}
.f22{font-size:22px;}
.f20{font-size:20px;}
.f18{font-size:18px;}
.f16{font-size:16px;}
.f14{font-size:14px;}
.f12{font-size:12px;}

h1,h2,h3,h4,h5,h6{font-weight:normal;line-height:120%;}
h1{font-size:24px;}
h2{font-size:18px;}
h3{font-size:16px;}
h4{font-size:14px;}
h5{font-size:14px;}

.pnt1{
	line-height: 100%;
	margin: auto;
	margin: 10px 5px;
    margin-bottom:10px;
	padding: 0;
//	border-bottom: 2px solid var(--main-color);
}
.pnt1::before,
.pnt1::after {
	font-size:10px;
	color: var(--sub-color);
	padding: 10px;
	content: '■';
}
/*.pnt1::before {
//	top: .10px;
	left: .10px;
	z-index: 0;
	width: 18px;
	height: 18px;
	background: var(--sub2-color);
}
.pnt1::after {
//	top: 6px;
	left: 6px;
	width: 15px;
	height: 15px;
	background: var(--sub-color);
}*/
.line-g{
    text-align: center;
    width: auto;
    margin: 10px 5px;
    margin-bottom:10px;
    padding: 2px;
    border-radius: 3px;
    border-top: 1px solid var(--key-S1-color);
    border-bottom: 1px solid var(--key-S1-color);
}
.line-g::before,.line-g::after{
	content: " ■ ";
	color: var(--h5--G-color);
}
.square-g{
	line-height: 200%;
    text-align: center;
    margin: 10px 5px;
    margin-bottom:10px;
    border-top: solid 1px var(--sub-color);
    border-bottom: solid 1px var(--sub-color);
}
.square-g::before,.square-g::after{
	content: " ■ ";
    color: var(--sub2-color);
}
.square-o{
	line-height: 200%;
    text-align: center;
    margin: 10px 5px;
    margin-bottom:10px;
    border-top: solid 1px var(--key-O1-color);
    border-bottom: solid 1px var(--key-O1-color);
}
.square-o::before,.square-o::after{
	content: " ■ ";
    color: var(--key-O3-color);
}
.headline_pipe_main{
	line-height: 100%;
    text-align: center;
//    margin: 20px 0;
    padding: 0;
    border-left: solid 5px #556B2F;
    border-right: solid 5px #556B2F;
}
.headline_pipe_sub{
	line-height: 100%;
    text-align: center;
 //   margin: 20px 0;
    padding: 0;
    border-left: solid 5px #9ACD32;
    border-right: solid 5px #9ACD32;
}
.headline_pipe_key{
	line-height: 100%;
    text-align: center;
    margin:  0;
    padding: 0;
    border-left: solid 5px var(--key-O1-color);
    border-right: solid 5px var(--key-O1-color);
}
.firstletter:first-letter{
	font-size:150%;
	margin:0;
	padding:0;
	color:#DAA520;
	color:var(--key-O1-color);
}
.underline{
	text-align:left;
	margin:10px 0;
	padding:0;
	border-bottom: solid 1px #DAA520;
}
.font-small{font-size:90%;font-weight:normal;}
/* テキスト寄せ */
.c{text-align:center !important;}
.l{text-align:left !important;}
.r{text-align:right !important;}
.fc{border:1px solid var(--key-S1-color);}
.red{color:#CC0000;}
hr{
	margin:10px;
}
.arrow{
    padding-left: 20px;
    background: url(/inc/img/leftarrow16g.png) no-repeat;
    display: inline;
    vertical-align:middle;
}
/* weel color */
.sun{color:#8e3d3e;font-weight:bold;}
.sat{color:#16558a;font-weight:bold;}
.hday{color:#8e3d3e;font-weight:bold;}
/* ---------- CSS Variables					 ---------- */
/*
	グローバル変数扱いは、:root
	変数を呼び出しは、var()関数を使用
	変数設定
	:root {
	    --key-color: red;
	}
	使用例
	.hoge {
	    color: var(--key-color);
	}
	var()関数は、変数が未定義時のデフォルト値も第二引数に設定できる
	.hoge {
	    color: var(--key-color, blue);
	}
	
	CSS内で計算式ができるcalc()関数を使う
	:root {
	    --base-size: 8px;
	}
	.sample {
	    font-size: calc(var(base-size) * 2);
	    padding: calc(var(base-size) / 4);
	}
*/
/*	サイトカラー設定	*/
:root {
/* HEADER・FOOTER・各種BUTTON　*/
	--main-color:#556B2F;
	--sub-color:#6B8E23;
	--sub2-color:#9ACD32;
	--page-color:#F7F8F0;
	
/* H属性 */
	--h1-bg-color:#cfbcbf;
	--h2-bg-color:#cfbcbf;
	--h3-bg-color:#cc6600;
	--h4-bg-color:#f1eae5;
	--h5-bg-color:#ecf1e8;
	--h6-bg-color:#f4f3ee;
/* key-color */
	--key-Y1-color:#dedecb;	/*#a3a36d;*/
	--key-Y2-color:#e7e7da;	/*#baba91;*/
	--key-Y3-color:#eeeee5; /*#d1d1b5;*/
	--key-Y9-color:#c6c623;
	
	--key-R1-color:#990000;
	--key-R2-color:#b74c4c;
	--key-R3-color:#d69999;
	--key-R9-color:#660000;
	
	--key-O1-color:#a77e18;
	--key-O2-color:#daa520;
	--key-O3-color:#e5bb50;
	--key-O9-color:#735711;
/*
	--key-O1-color:#f9b510;
	--key-O2-color:#fac749;
	--key-O3-color:#fcd983;
	--key-O9-color:#c99005;
*/
	--key-Br1-color:#9f754a;
	--key-Br2-color:#b4885d;
	--key-Br3-color:#c09c78;
	--key-Br9-color:#775738;
	
/*
	--key-G1-color:#556b2f;
/*	--key-G2-color:#88976d;
	--key-G2-color:#abb698;
/*	--key-G4-color:#c4cbb6;
	--key-G3-color:#d5dacb;
	--key-G9-color:#6b8e23;
*/
	--key-G1-color:#abb698;
	--key-G2-color:#c7ceba;
	--key-G3-color:#e3e7dd;
	--key-G9-color:#8f9e76;
	
	--key-B1-color:#3a5c84;
	--key-B2-color:#889db5;
	--key-B3-color:#b7c4d2;
	--key-B9-color:#44578b;
	
	--key-S1-color:#bdbdbd;
	--key-S2-color:#dbdbdb;
	--key-S3-color:#f8f8f8;
	--key-B9-color:#828282;
	
	--key-P1-color:#b69a9e;
	--key-P2-color:#cfbcbf;
	--key-P3-color:#e8dee0;
	--key-P9-color:#9e777e;
	
	--key-W1-color:#ffffff;
	--key-W2-color:#fafafa;
	--key-W3-color:#f4f4f4;
	--key-W9-color:#efefef;

	--h5--Y-color:#e3e0cc;
	--h5--G-color:#adb79a;
	--h5--R-color:#e0a7a7;
	--h5--O-color:#DAA520;
	
	--kichi-color:#dcaa19;
	
/* 暦九星飾りライン h5.y */
	--h5--y9-color: #e3e0cc;
/* 方位距離計算 h5.map */
	--h5--map-color: #EAE5E3;

	--btn-G-bg-color:#e8eee4;	/* フォームボタン BG */
	--btn-G-line-color:#b5c8a8;	/* フォームボタン 枠 */
	
	--frm-S-line-color:#cccccc;	/* Table枠 */
	--maru-S-line-color:#cccccc;/* 角丸枠 */
/*	最大吉方	*/
	--kichi-ok-line-color: #dcaa19;		/* 有効 */
	--kichi-ng-line-color: #999999;		/* 無効 */
	--kichi-nil-line-color: #C5C5C7;	/* 無し */
/*	年月日 通し判定 */
	--kichi-dok-bg-color: #e7c300;		/* 年月日全て吉　有効 */
	--kichi-dng-bg-color: #c0c0c0;		/* 年月日凶あり　無効 */
	--kichi-nil-bg-color: #C5C5C7;		/* 無し（中宮）	*/
/*	吉凶判定	*/
	--kichi-ymok-bg-color: #d5b712;		/*	年月有効	*/
	--kichi-yok-bg-color: #c3ab24;		/*	年のみ有効	*/
	
/*	吉方位	*/
	--seiki-bg-color: #efda39;	/* 生気 */
	--hiwa-bg-color: #ede080;	/* 比和 */
	--taiki-bg-color: #ede8c7;	/* 退気 */
/*	凶方位	*/
	--ha-line-color: #94a6a1;	/* 破れ 枠 */
	--ha-bg-color: #94a6a1;		/* 破れ */
	--an-bg-color: #b7bbcc;		/* 暗剣殺 */
	--go-bg-color: #c5ccb7;		/* 五黄殺 */
	--bad-bg-color: #e2e2e2;	/* 凶方位 */
/* その他凶方位 */
	--taichu-line: #42307c;		/* 定位対冲 */
	--shoni-line: #683c34;		/* 小児殺 */
	--doyo-line: #333333;		/* 土用殺 */
/* 地図 方位凡例 */
	--hki--bg-color: #f4ecb2;	/* 気学方位(8) */
	--hha--bg-color: #dce5d5;	/* 八卦方位(8) */
	--het--bg-color: #c6cabf;	/* 干支方位(12) */
	--hju--bg-color: #e3e0cc;	/* 十六方位(16) */
	--hni--bg-color: #ddd0d2;	/* 二十四山方位(24) */
	--hra--bg-color: #d5d7e1;	/* 羅針方位(32) */
}
/*	Gradation		---------- ---------- */
.grad_Yellw{
	border: solid 1px #FFB600;
	background: linear-gradient(#f2d85d, #d9a21a);
}
.grad_Green{
	/*	Green Gradation	*/
    border: solid 1px #6B8E23;
    background:linear-gradient(#87A84A, #556B2F);
}
.grad_DarkYellow{
    /*	Dark Yellow	*/
	border: solid 1px #838352;
    background:linear-gradient(#eeeee5,#b2b285);
}
.grad_Orange{
	/*	Orange Gradation	*/
	color: #333;
    border: solid 1px #FFB600;
	background:linear-gradient(#e7b614, #d9a21a);
}
#ureg{
	font-size: 13px;
	color: #000;
    text-align: center;
    letter-spacing: 2px;
    padding: 10px;
    border: solid 1px #FFB600;
	background: linear-gradient(#f2d85d, #d9a21a);
}
#ureg .edgeline{
	border-bottom: 1px solid var(--key-Br1-color);
}
#ureg .edgeline:before, #ureg .edgeline:after {
    content: '';
    position: absolute;
    top: 30%;
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: var(--key-Br2-color);
}
#ureg .btnLink {
    text-align: center;
    line-height: 120%;
    padding: 0;
    background: var(--key-Y2-color);
    border: 1px solid var(--key-S1-color);
    border-radius: 3px;
}
/*  ショップリンクパネル		---------- */
#sign{
	font-size: 13px;
	color: #fff;
    text-align: center;
    letter-spacing: 2px;
    padding: 10px;
	/*	Green Gradation	*/
    border: solid 1px #6B8E23;
    background:linear-gradient(#87A84A, #556B2F);
}