
/*******************************
** 横長テーブル
*******************************/
.p-sticky-table{
  white-space: nowrap;
  line-height:1.6;
}
.p-sticky-table table{
  border:none;
  border: 1px solid #dedede;
  border-bottom: none;
  border-collapse: collapse;
  word-break: break-all;
  table-layout: fixed;
  display:block;
  overflow:scroll;
  max-height: 80vh;
}
.p-sticky-table thead th:first-child {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
  z-index: 3;
}
.p-sticky-table thead th {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 2;
  text-align:center;
}
.p-sticky-table tbody th:first-child{
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  z-index: 1;
  border:none;
  white-space: normal;
  min-width: 130px;
}
.p-sticky-table th, .p-sticky-table td {
  min-width: 50px;
  text-align: left;
  font-size: 16px !important;
  position: relative;
  padding: 13px !important;
  color: #333;
  border: none !important;
  z-index: 0;
  vertical-align:middle !important;
  background:#fff;
}
.p-sticky-table th{
  background:#f0f9ff !important;
  letter-spacing: 1px;
  font-weight: 500 !important;
  color: #555 !important;
}
.p-sticky-table tr{
  border-bottom:none !important;
}
.p-sticky-table img{
  margin: 10px auto;
  display: block;
  padding: 0;
  max-width: 80% !important;
}
.p-sticky-table table th::before, .p-sticky-table table td::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border-right: 1px solid #dedede;
  border-bottom: 1px solid #dedede;
  z-index: -1;
}
/* スマホ */
@media screen and (max-width: 560px) {
  .p-sticky-table table {
    max-height: 60vh;
    }
  .p-sticky-table thead th:first-child, .p-sticky-table tbody th:first-child {
        min-width: 25vw;
    }
   .p-sticky-table th, .p-sticky-table td {
        font-size: 12px !important;
        padding: 7px !important;
    }
}
/* 中央寄せ */
.pst-center td {
  text-align: center;
}




/*-------------------------------
BOX2401吹き出し風BOX(丸み）赤20200523追加
------------------------------*/
.box2401 {
position: relative;
padding: 0.5em 1.5em;
margin: 2em 0;
background: #F2BAA9;
color: #ffffff;
font-weight: bold;
border-radius: 25px;/*角丸にする*/
}
.box2401:after {
position: absolute;
content: '';
top: 100%;
left: 30px;
border: 15px solid transparent;
border-top: 15px solid #F2BAA9;
width: 0;
height: 0;
}
.box2401 p {
margin: 0; 
padding: 0;
}


/*-------------------------------
BOX2402吹き出し風BOX(丸み）青20200523追加
------------------------------*/
.box2402 {
position: relative;
padding: 0.5em 1.5em;
margin: 2em 0;
background: #B1D1E3;
color: #ffffff;
font-weight: bold;
border-radius: 25px;/*角丸にする*/
}
.box2402:after {
position: absolute;
content: '';
top: 100%;
left: 30px;
border: 15px solid transparent;
border-top: 15px solid #B1D1E3;
width: 0;
height: 0;
}
.box2402 p {
margin: 0; 
padding: 0;
}
/*-------------------------------
BOX2400吹き出し風BOX(丸み）黒20200523追加
------------------------------*/
.box2400 {
position: relative;
padding: 0.5em 1.5em;
margin: 2em 0;
background: #595959;
color: #ffffff;
font-weight: bold;
border-radius: 25px;/*角丸にする*/
}
.box2400:after {
position: absolute;
content: '';
top: 100%;
left: 30px;
border: 15px solid transparent;
border-top: 15px solid #595959;
width: 0;
height: 0;
}
.box2400 p {
margin: 0; 
padding: 0;
}

/*------------------------------
BOX2601の色(灰色)
「記事の信頼性」20200523追記
-------------------------------*/
.box2601 {
    position: relative;
	margin: 2em 0;
	padding: 1.5em 1em;
	border: solid 1.5px #D9D9D9;
    border-radius: 8px;
}
.box2601 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
color: #404040;
    font-weight: bold;
}
.box2601 p {
    margin: 0; 
    padding: 0;
}

/*------------------------------
???
-------------------------------*/
table{
width:100%;
}
.scroll{
overflow: auto;
white-space: nowrap;
}
.scroll::-webkit-scrollbar{
 height: 5px;
}
.scroll::-webkit-scrollbar-track{
 background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb {
 background: #BCBCBC;
}


/*-------------------------------
ボックス_ストライプ31_1_6修正
----------------------------*/.box16strp{
    padding: 0.5em 1em;
    margin: 2em 0;
    background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
    background: repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
}
.box16strp p {
    margin: 0; 
    padding: 0;
}
/*-------------------------------
リボン_オレンジ31_1_6修正
----------------------------*/.ribbon4 {
    display: inline-block;
    position: relative;
    height: 60px;/*高さ*/
    line-height: 60px;/*高さ*/
    vertical-align: middle;
    text-align: center;
    padding: 0 40px 0 18px;/*文字の左右の余白*/
    font-size: 18px;/*文字サイズ*/
    background: #ffc668;/*背景色*/
    color: #FFF;/*文字色*/
    box-sizing: border-box;
}

.ribbon4:after {
    position: absolute;
    content: '';
    width: 0px;
    height: 0px;
    z-index: 1;
}

.ribbon4:after {
    top: 0;
    right: 0;
    border-width: 30px 15px 30px 0px;
    border-color: transparent #fff transparent transparent;
    border-style: solid;
}
/*-------------------------------
サルワカのBOX 題名あり30_12_23修正
-------------------------------*/.box30 {
margin: 2em 0;
background: #f1f1f1;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.box30 .box-title {
font-size: 1.2em;
background: #f2c64d;
padding: 4px;
text-align: center;
color: #8B5735;
font-weight: bold;
letter-spacing: 0.05em;
}
.box30 p {
padding: 15px 20px;
margin: 0;
}
/*-------------------------------
サルワカの枠 題名頭抜（桃
-------------------------------*/
.box2701 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 2px #FB9D7E;
    background: #FFFBF4;

}
.box2701 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #FB9D7E;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.box2701 p {
    margin: 0; 
    padding: 0;
	color: #FB9D7E;
}
/*-------------------------------
ゴールドの吹き出し
-------------------------------*/
.gold-huki{
    display: inline-block;
    position: relative;
    padding: 0 25px;
    color: #F3C54B;
    font-size: 22px;
    font-weight: bold;
    line-height: 1;
    letter-spacing: 1px;
}
.gold-huki:before {
    left: 0;
    -webkit-transform: rotate(50deg);
    transform: rotate(50deg);
    display: inline-block;
    position: absolute;
    top: 50%;
    width: 20px;
    height: 3px;
    border-radius: 3px;
    background-color: #F3C54B;
    content: "";
}
.gold-huki:after {
    right: 0;
    -webkit-transform: rotate(-50deg);
    transform: rotate(-50deg);
    display: inline-block;
    position: absolute;
    top: 50%;
    width: 20px;
    height: 3px;
    border-radius: 3px;
    background-color: #F3C54B;
    content: "";
}
/*------------------------------
BOX26(グラデション)30_11_5追記

.entry-content .box26 {
    border-color: #EE5C54;
}
.entry-content .box26 .box-title {
  color: #EE5C54;
}
-------------------------------*/
/*------------------------------
BOX21(グラデション)30_11_5追記
-------------------------------*/
.box21{
  background: linear-gradient(to left,#EE5C54
,#F3C54B);
}
/*------------------------------
箇条書き「灰色」のメンテ30_11_4追記
-------------------------------*/
.entry-content .li-beige shadow ul {background-color: #efefef;
}

/*------------------------------
BOX20「コの字」のメンテ30_11_4追記
-------------------------------*/
.box20 {
 position: relative;
 top: 0;
 margin: 2em 0;
 padding: 1.5em 1em;
 background: #efefef;
}
.box20:before,
.box20:after {
 display: inline-block;
 box-sizing: border-box;
 position: absolute;
 top: 0;
 width: 15px;
 height: 100%;
 content: "";
}
.box20:before {
 left: 0;
 border-top: dotted 2px #453D3F;
 border-bottom: dotted 2px #453D3F;
 border-left: dotted 2px #453D3F;
}
.box20:after {
 right: 0;
 border-top: dotted 2px #453D3F;
 border-right: dotted 2px #453D3F;
 border-bottom: dotted 2px #453D3F;
}/*------------------------------
赤ボタン単一30_11_03追記
-------------------------------*/
.square_btn02{
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
    background: #EE5C54
;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #d9d9d9;
    border-radius: 3px;
}
.square_btn02:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}
/*------------------------------
  tableの設定
-------------------------------*/
table {
width: 100%;
table-layout: fixed;
word-break: break-all;
word-wrap: break-all;
}
/*--------------------------------------
  モバイル用フッター固定メニュー
--------------------------------------*/
.fixed-menu ul {/*メニュー部分*/
    width: auto;/*幅調整*/
    padding: 0.2em 1.1em;/*内側の余白設定*/
    right: 10px;/*位置調整（右からの距離）*/
    left: auto;/*位置調整（左からの距離）*/
    bottom: 10px;/*位置調整（下からの距離）*/
    border-radius: 50%;/*円にする*/
    background: #ff5959!important;/*背景色（強制）*/
}
.fixed-menu a {/*メニューの文字*/
    color: #fff!important;/*文字の色（強制）*/
}
.fixed-menu ~ .totop {/*上に戻るボタンの位置*/
    bottom: 80px;/*位置調整（下からの距離）*/
}
.totop {/*上に戻るボタン*/
    background: #fff!important;/*背景色（強制）*/
    border: 1px solid #424242;/*枠線*/
    width: 64px;/*幅調整*/
    height: 64px;/*高さ調整*/
}
.totop .fa {/*上に戻るボタンのアイコン*/
    line-height: 58px;/*行の高さ*/
    font-size: 1.15em;/*アイコンの大きさ*/
    color: #424242;/*アイコンの色*/
}
.fixed-menu {/*フッターメニューの余白設定*/
    margin-bottom: 0;/*下の余分な余白を削除*/
}

/*------------------------------
  モバイル用フッター固定メニュー30_10_21追加10_27修正
-------------------------------*/
.fixed-menu ul {
width: auto;
padding: 0.2em 1.1em;
right: 10px;
left: auto;
bottom: 10px;
border-radius: 50%;
background: #453D3F
!important;
}
.fixed-menu a {
    color: #F3C54B!important;
}
.fixed-menu ~ .totop {
    bottom: 80px;
}
.totop {
background: #F3C54B!important;
border: 1px solid #F3C54B
;
width: 64px;
height: 64px;
}
.totop .fa {
line-height: 58px;
font-size: 1.15em;
color: #453D3F
;
}
.fixed-menu {
    margin-bottom: 0;
}

/*-------------------------------
左右に水平線30_10_25追加
------------------------------*/
.s80 {
color: #444;
font-size: 80%;
display: flex;
align-items: center;
}
.s80:before, .s80:after {
content: "";
flex-grow: 1;
height: 1px;
background: #444;
display: block;
}
.s80:before {
margin-right: .4em;
}
.s80:after {
margin-left: .4em;
}
/*------------------------------
  ヘッダーの設定（h2
-------------------------------*/
.entry-content h2 {
font-size: 120%;
background: #453D3F; /*背景色*/
padding: 0.85em 1em .85em 1em;/*文字周りの余白*/
color: #F3C54B;/*文字色*/
border-radius: 0.2em;/*角の丸み*/
}
/*------------------------------
  ヘッダーの設定（h3
-------------------------------*/
.entry-content h3 {
font-size: 110%;
color: #494949;/*文字色*/
background: #EADBC6;/*背景色*/
position: relative;
padding: .75em 1.2em .75em 1.8em;
border: 0px solid #ccc;
}
.entry-content h3::after {
position: absolute;
top: .5em;
left: .5em;
content: '';
width: 6px;
height: -webkit-calc(80% - 40em);
height: calc(100% - 1em);
background-color: #D50B18;/*左端対象物*/
border-radius: 4px;
}
/*------------------------------
  ヘッダーの設定（h4
-------------------------------*/
.entry-content h4 {
position: relative;
padding-left: 1.2em;/*アイコン分のスペース*/
line-height: 1.4;
font-size: 120%;
color: #494949;/*文字色*/
}
.entry-content h4:before{ 
font-family: FontAwesome;
content: "\f0c8";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size: 1em;/*サイズ*/
left: 0;/*アイコンの位置*/
top: 0;/*アイコンの位置*/
color: #494949; /*アイコン色*/
}
/*------------------------------
上下_太線_黒
-------------------------------*/
.subh1 {
color: #404040;/*文字色*/
width: auto;
font-size: 120%;
padding: 0.6em;/*上下の余白*/
border-top: solid 1.5px #404040;/*上線*/
border-bottom: solid 1.5px #404040;/*下線*/
}
/*------------------------------
上下_細線_黒
-------------------------------*/
.subh2 {
color: #404040;/*文字色*/
font-size: 90%;
padding: 1em;/*上下の余白*/
border-top: solid 1px #404040;/*上線*/
border-bottom: solid 1px #404040;/*下線*/
}
/*------------------------------
下のみ_太線_黒
-------------------------------*/
.subh3 {
color: #404040;/*文字色*/
width: auto;
font-size: 120%;
padding: 0.2em;/*上下の余白*/
border-bottom: solid 1.5px #404040;/*下線*/
}
/*------------------------------
下のみ_細線_黒
-------------------------------*/
.subh4 {
color: #404040;/*文字色*/
font-size: 80%;
padding: 0.5em;/*上下の余白*/
border-bottom: solid 1px #404040;/*下線*/
}
/*------------------------------
ボックスカード
-------------------------------*/
.hatenablogcard{
  width:100% !important;
  height:1550px !important;
  margin:15px 0 !important;
}
/*------------------------------
ボックス二重線 
-------------------------------*/
.box5 {
    padding: 0.5em 1em;
    margin: 2em 0;
    border: double 3px #000000;
}
.box5 p {
    margin: 0; 
    padding: 0;
}
/*------------------------------
ボックス点線
-------------------------------*/
.box6 {
padding: 0.5em 1em;
margin: 2em 0;
background: #fff;
border: dashed 1px #000000;/*点線*/ }
.box6 p {
margin: 0;
padding: 0;
} 

/*------------------------------
引用
-------------------------------*/
.entry-content blockquote {
    position: relative;
    padding: 30px 15px 8px 15px;
    box-sizing: border-box;
    background: #efefef;
    color: #555;
}
.entry-content blockquote:before{
display: inline-block;
position: absolute;
top: 5px;
left: 15px;
vertical-align: middle;
content: "\f10d";
font-family: FontAwesome;
color: #cfcfcf;
font-size: 28px;
line-height: 1;
}
.entry-content blockquote p {
padding: 0;
margin: 10px 0;
line-height: 1.7;
}
.entry-content blockquote cite {
display: block;
text-align: right;
color: #888888;
font-size: 0.9em;
}
/************************************
** 横長テーブル
************************************/
.p-sticky-table{
	white-space: nowrap;
	line-height:1.6;
}
.p-sticky-table table{
	border:none;
	border-left:1px solid #dedede;
	border-right:1px solid #dedede;
	border-bottom: 1px solid #dedede;
    border-collapse: collapse;
	word-break: break-all;
	table-layout: fixed;
	display:block;
	overflow:scroll;
}
.p-sticky-table th{
	background:#F8F9FA !important; /* 見出し背景色 */
	color: #404040;/* 見出し文字色 */
	font-weight: 1000 !important;/* 見出し文字太さ */
	font-size:16px !important; /* 見出し文字サイズ */
font-size:17px !important; /* 見出し文字サイズ */
}
.p-sticky-table td{
	font-size: 16px !important; /* 文字サイズ */
	color:#404040; /* 文字色 */
}
.p-sticky-table thead th:first-child,.p-sticky-table tbody th:first-child{
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    z-index: 1;
	border:none;
}
.p-sticky-table tr{
	border-top:1px solid #dedede;
	border-bottom:none !important;
}
.p-sticky-table tr:last-child{
	border-bottom:1px solid #dedede;
}
.p-sticky-table th, .p-sticky-table td {
	vertical-align:middle !important;
	border: none !important;
	background:#fff;
	text-align:center;
	padding:12px !important;
}
.p-sticky-table img{
	margin:0;
	padding:0;
	max-width:70px !important; /* 画像最大サイズ */
}
/* スマホ */
@media screen and (max-width: 560px) {
	.p-sticky-table th{
		font-size:11px !important; /* スマホ見出し文字サイズ */
	}
	.p-sticky-table td{
		font-size: 11px !important; /* スマホ文字サイズ */
	}
	.p-sticky-table thead th:first-child,.p-sticky-table tbody th:first-child{
		white-space:normal;
		min-width:80px; /* スマホ見出し横幅 */
	}
	.p-sticky-table th, .p-sticky-table td {
		padding:8px !important;
	}
	.p-sticky-table img{
		max-width:50px !important; /* スマホ画像最大サイズ */
	}
}

/*---------------------------------
固定ヘッダー（スマホ・タブレット）
---------------------------------*/
@media only screen and (max-width: 767px) {
  .header {
    position: fixed; /* ヘッダーを固定 */
    width: 100%;/* 横幅を100％に変更 */
    top: 0;/* 画面の上から0地点に固定 */
    left: 0;/* 画面の左から0地点に固定 */
  }
  /* ヘッダーのスペースを確保 */
  #container {
    padding-top: 62px;
  }
  /* 目次からジャンプ後の着地点を調整 */
  h2 span, h3 span {
    padding-top: 77px;/* お好みで調整 */
  }
}

