/* h4見出し　ここから */
.entry-content h4{
/* 後色の線の設定 */
border-bottom: solid 5px #a4a0a0 !important;
position: relative;
}

.entry-content h4:after {
/* 始めの色の短い線の設定 */
position: absolute;
left: 0px;
content: " ";
display: block;
border-bottom: solid 5px #373535;
bottom: -5px;
width: 20%;
}

/* h4見出し　ここまで */

.keikoup {
background: linear-gradient(transparent 40%, #FAD5DC 40%);
padding-bottom: .2em;
font-weight:bold;
}

.box17 {
    margin:2em 0;
    position: relative;
    padding: 0.5em 1.5em;
    border-top: solid 2px black;
    border-bottom: solid 2px black;
}
.box17:before, .box17:after{
    content: '';
    position: absolute;
    top: -10px;
    width: 2px;
    height: -webkit-calc(100% + 20px);
    height: calc(100% + 20px);
    background-color: black;
}
.box17:before {left: 10px;}
.box17:after {right: 10px;}
.box17 p {
    margin: 0; 
    padding: 0;
}
/* rink */

a.button{
   display:block;
   padding:20px;
   margin:0 auto;
   color:#337ab7;/* 文字色 */
   text-align:center;
   font-size:20px;
   font-weight: bold;
   border-radius: 0px;   
   text-decoration: none;
   width: 100%;
   border: 3px solid #337ab7;/*枠*/
}
/* マウスオーバー時 */
a.button:hover{
   color:#ffffff!important;
   background: #337ab7;/* 反転背景色 */
}

/* table of contents */

/*目次カスタマイズ*/ @media only screen and (min-width: 767px){ /* 目次の枠線 */ #toc_container{ border-top: solid 8px  #6bb6ff; background:#f9f9f9 !important; } /* 目次タイトルのフォント設定 */ p.toc_title { font-size:24px; color:#6bb6ff; position:relative; left:-39% !important; top:10px; } /* 目次のh2フォント設定 */ ul.toc_list li a { font-size:18px; font-weight:bold; color:#777; } ul.toc_list li a:hover{ color:#f05689; text-decoration:none; } /* 目次のh3フォント設定 */ .toc_list ul li a { font-size:16px; font-weight:normal; color:#888; } .toc_list ul li a:hover { color:#f05689; text-decoration:none; } span.toc_toggle{ font-size: 14px !important; } span.toc_toggle a{ font-size: 14px; color:#6bb6ff; } #toc_container .toc_title::before { display: inline-block; color: #fff; font-family: FontAwesome; font-size: 20px; line-height: 50px; content: "\f0ca"; } #toc_container .toc_title:before { display:inline-block; width: 50px; height: 50px; border-radius: 50%; background:#6bb6ff; margin-right:8px; } #toc_container li a{ border-top-width:0px; line-height:30px; } } @media only screen and (max-width: 766px){ /* 目次の枠線 */ #toc_container{ border-top: solid 8px  #6bb6ff; background:#f9f9f9 !important; } /* 目次のアイコン */ #toc_container .toc_title:before{ content: "\f0f6";/*アイコンの種類*/ font-family: FontAwesome; display: inline-block; margin-right:5px; width: 1.2em; color:#6bb6ff; } /* 目次のタイトル設定 */ p.toc_title { text-align: center; font-size:17px; color:#6bb6ff; } /* 目次のh2フォント設定 */ ul.toc_list li a { font-size:16px; font-weight:bold; line-height: 2em; color:#777; text-decoration:none; } ul.toc_list li a:hover{ color:#6bb6ff; } /* 目次のh3フォント設定 */ .toc_list ul li a { font-size:14px; font-weight:normal; color:#888; text-decoration:none; } }

/* 枠　青塗り潰し */

.box10 {
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #00BCD4;
    background: #e4fcff;/*背景色*/
    border-top: solid 6px #1dc1d6;
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);/*影*/
}
.box10 p {
    margin: 0; 
    padding: 0;
}

/* 枠　ポイント */

.box28 {
    position: relative;
    margin: 2em 0;
    padding: 25px 10px 7px;
    border: solid 2px #FFC107;
}
.box28 .box-title {
    position: absolute;
    display: inline-block;
    top: -2px;
    left: -2px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #FFC107;
    color: #ffffff;
    font-weight: bold;
}
.box28 p {
    margin: 0; 
    padding: 0;
}

/* 枠　注意 box29 */

.box29 {
    position: relative;
    margin: 2em 0;
    padding: 25px 10px 7px;
    border: solid 2px #FFC107;
}
.box29 .box-title {
    position: absolute;
    display: inline-block;
    top: -2px;
    left: -2px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #FFC107;
    color: #ffffff;
    font-weight: bold;
}
.box29 p {
    margin: 0; 
    padding: 0;
}

/* メモ　クリップ　Ａ */
.clip-box-a {
 position: relative;
 margin: 2em auto;
 padding: 15px 35px 15px 25px;
 width: 90%; /* ボックス幅 */
 background-color: #fff; /* ボックス背景色 */
 color: #555555; /* 文章色 */
 border: 1px solid #ccc; /* 枠線 */
 box-shadow: 1px 1px 1px #acacac; /* 影の色 */
}
.clip-box-a::before {
 position: absolute;
 content: '';
 top: -15px;
 right: 10px;
 height: 55px;
 width: 15px;
 border: 3px solid #555555; /*クリップ色 */
 background-color: none;
 border-radius: 12px;
 box-shadow: 1px 1px 2px #999;
 transform: rotate(10deg);
 z-index: 1;
}
.clip-box-a::after {
 position: absolute;
 content: '';
 top: 0px;
 width: 10px; 
 right: 20px;
 border: solid 5px #fff; /*背景色と同じ色にする*/
 z-index: 2;
}

/* ホワイトボード風　タイトル　3 */
.wboard-w3 {
 position: relative;
 margin: 2em auto;
 padding: 3em 1em 1em;
 width: 90%; /* ボックス幅 */
 background-color: #fff; /* ボックス背景色 */
 color: #000000; /* 文章色 */
 border: 5px solid #c6c6c6; /* 枠線 */
 box-shadow: 0 0 8px #333, 0 0 2px #555 inset;
}
.wboard-w3::before,
.wboard-w3::after {
 position: absolute;
 content: '';
 bottom: 4px;
 width: 25px; 
 border-radius: 2px;
 box-shadow: 1px 1px 3px #666;
} 
.wboard-w3::before {
 right: 60px;
 border: solid 3px #333; /*飾ペン黒 */
 transform: rotate(2deg); /*飾ペン角度 */
}
.wboard-w3::after {
 right: 22px;
 border: solid 3px #ff0000; /*飾ペン赤 */
 transform: rotate(9deg); /*飾ペン角度 */
}
.title-w3 {
 position: absolute;
 left: 1em;
 top: .5em;
 font-weight: bold;
 font-size: 1.1em; /* 文字サイズ */
 color: #ff0000; /* タイトル文字色 */
 border-style: none none solid;
 border-color: #ff0000; /*タイトル下線 */
 border-width: 3px;
}

/*あわせてよみたい */
.box26 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #3E3E3E;
    border-radius: 8px;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #3E3E3E;
    font-weight: bold;
}
.box26 p {
    margin: 0; 
    padding: 0;
}

/*表のスクロール */

.scrollable-table table{
  border-collapse: collapse;
  margin: 2em 0;
  max-width: 100%;
}

.scrollable-table th{
  background-color: #eee;
}

.scrollable-table th,
.scrollable-table td{
  border: solid 1px #ccc;
  padding: 3px 5px;
  white-space: nowrap;
}

.scrollable-table {
  overflow-x: auto;
  margin-bottom: 1em;
  max-width: 770px;
}

/*表のスクロールとレスポンシブ */

@media (max-width: 480px) {
  .sp-scrollable-table table{
    border-collapse: collapse;
    margin: 2em 0;
    max-width: 100%;
  }

  .sp-scrollable-table th{
    background-color: #eee;
  }

  .sp-scrollable-table th,
  .sp-scrollable-table td{
    border: solid 1px #ccc;
    padding: 3px 5px;
    white-space: nowrap;
  }

  .sp-scrollable-table {
    overflow-x: auto;
    margin-bottom: 1em;
    max-width: 770px;
  }
}

/* 画像に影 */

img.kage {
box-shadow: 5px 5px 10px rgba(0,0,0,0.25);
overflow: visible;
} 

/*画像に枠 */

img.waku {
    border:1px solid #dddddd;
}

/*枠　背景黒塗り潰しのみ */

.box20 {
    position: relative;
    padding: 0.25em 1em;
    margin: 2em 0;
    top: 0;
    background: #efefef;
}
.box20:before, .box20:after{ 
    position: absolute;
    top: 0;
    content:'';
    width: 10px;
    height: 100%;
    display: inline-block;
    box-sizing: border-box;
}
.box20:before{
    border-left: dotted 2px #15adc1;
    border-top: dotted 2px #15adc1;
    border-bottom: dotted 2px #15adc1;
    left: 0;
}
.box20:after{
    border-top: dotted 2px #15adc1;
    border-right: dotted 2px #15adc1;
    border-bottom: dotted 2px #15adc1;
    right: 0;
}
.box20 p {
    margin: 0; 
    padding: 0;
}