@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*横のサイズを固定スマフォ    */
@media (min-width: auto) {
#main {
float: center;
position: center;
box-sizing: border-box;
width: 100%;
padding: 10px;
border:8px solid #ffffff;
background-color:#fff;
border-radius: 5px;
margin-bottom: 10px;
}
}
/* ミドルメニューの色変 */
/* 背景色 */
.slicknav_menu {
border:0px solid #ffffff;
background-color: #ffffff;
font-size: 18px;
}
/* 文字色 */
.slicknav_nav a{
color: #000000;	
}
/* ホバー背景色 */
.slicknav_item
.slicknav_nav
a:hover{
background-color: #969696;
}

/* トップへ戻るボタン   */
/* の位置を変更         */
#go-to-top {
bottom: 80px;
}
.go-to-top-button {
color:#fff;
width:60px;
height:60px;
box-shadow:1px 1px 1px 
#ccc;
border-radius:50%;
text-align:center;
background-color: 
#aaa;
display:block; 
/* 使用 none に */
position:relative; 
/* 使用するときはfixedに*/
font-size:60px;
}
/*       目次のデザイ      */
.toc,
.sidebar.widget_toc {
background-color: 
#B4C8FA;
border: 0;
border-radius: 10px;
overflow: hidden;
}
.main.toc,
.sidebar.toc-content {
font-size: 16px;
text-align:center;
	
}
.sidebar.widget_toc {
margin: 5px 0 1em;
}
.main .toc {
padding: 5px;
}
.toc-title, 
.sidebar.widget_toc h3 {
padding: 5px 10px 10px 10px;
background-color: #6b96bf;
color: #fff;
}
.toc-title {
padding-left: 0.6em; 
font-size: 1.2em; 
font-weight: 500; 
text-align: center; /*目次*/
} 
.sidebar.widget_toc h2 {
margin: 0; 	
padding-left: 1.1em; 
border-radius: 0; 
}
.sidebar.widget_toc.toc {
margin: 0; 
padding-left: 1.1em;
text-align: left;
} 
.main .toc-content > ul {
margin:1.1em;
margin-top:0.5em; 
}
.toc .toc-content > ul 
> li > ul { 	
padding-left: 0.5em; 
} 
.toc .toc-content > ul
> li > ul > li > ul {
padding-left: 0.5em;
} 
.toc .toc-content > ul >
li > ul > li > ul > li >
ul {
padding-left: 0.5em; 
}
.toc .toc-content > ul >
li > ul > li > ul > li >
ul > li > ul {
padding-left: 0.15em; 
} 
.toc-content a { 
padding: 1px; 
color: #8224e3; 
font-weight: 500;
letter-spacing: 1px; 
} 
.toc-content a:hover { 
box-shadow:0px 1px 4px 
1px
rgba(0,0,0,0.3), 
0px 0px 4px 1px 
rgba(0,0,0,0.3); 
}
.toc-content > ul > 
li > a { 
padding-top: 6px; 
font-size: 1.1em; 
padding-left: 0.5em; 
}
.toc-content > ul > li 
> ul > li > a { 
padding-top: 5px; 	
font-size: 1.6em; 
padding-left: 0.5em;
} 
.toc-content > ul > 
li > ul > li > ul > 
li > a { font-size: 1.6em; 
padding-left: 1em; 
} 
.toc-content > ul > li 
> ul > li > ul > li > 
ul li a {
font-size: 1.6em; 
padding-left: 0.5em;
} 
/* タイトルをボカスデザイン  */
.entry-title{
color: #fff; 
/* テキスト色 */
font-size: 1.2em; 
/* フォントサイズ */
font-weight: bold; 
/* フォント太さ */
text-align: center; 
/* テキスト位置 */
/*font-family: "Book Antiqua", */
/*Palatino Linotype, serif; */
/*フォント種類 043c78 */
text-shadow: 0 0 10px 
#7100e2, 0 0 20px 
#7100e2, 0 0 30px 
#7100e2, 0 0 40px 
#7100e2, 0 0 70px 
#7100e2, 0 0 80px 
#7100e2, 0 0 100px 
#7100e2, 0 0 150px 
#7100e2; 
/* カラー　順にテキスト近い影 */
}
/* 点滅 */
.blink {
	animation: blinking 1s ease-in-out infinite alternate;
color: #dd3333; 
}
 
@keyframes blinking {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
/* 見出しリセット */
/* 見出し2 */
.article h2{
background:none;
padding: 10px 20p 10px 20pxx;
}
.article h2{
  color: #010079;
  text-shadow: 0 0 5px white;
  border-left: solid 7px #010079;
  background: -webkit-repeating-linear-gradient(-45deg, #cce7ff, #cce7ff 3px,#e9f4ff 3px, #e9f4ff 7px);
  background: repeating-linear-gradient(-45deg, #cce7ff, #cce7ff 3px,#e9f4ff 3px, #e9f4ff 7px);
padding:16px; 
}0% {opacity: 1;}
}
/* 見出しリセット */
/* 見出し2 */
.article h2{
background:none;
padding: 10px 20p 10px 20pxx;
}
.article h2{
  color: #010079;
  text-shadow: 0 0 5px white;
  border-left: solid 7px #010079;
  background: -webkit-repeating-linear-gradient(-45deg, #cce7ff, #cce7ff 3px,#e9f4ff 3px, #e9f4ff 7px);
  background: repeating-linear-gradient(-45deg, #cce7ff, #cce7ff 3px,#e9f4ff 3px, #e9f4ff 7px);
padding:16px; 
}
7ff 3px,#e9f4ff 3px, #e9f4ff 7px);
padding:16px; 
}
/************************************
**　　グローバルナビメニュー 
************************************/

/*マウスオーバーでアンダーライン*/
#navi .navi-in a:after{
position: absolute;/*線の位置を絶対配置に*/
content: "";/*文字はなし*/
left: 10px;/*線の位置*/
bottom: 10px;/*線の位置*/
height: 3px;/*線の高さ*/
width: 84%;/*線の幅*/
background: #fff200;/*線の色*/
transform: scale(0,1);/*マウスオーバーの前は線を消す*/
transition: 0.3s;/*線が0→100%になるまでの秒数*/
}

#navi .navi-in a:hover:after{
transform: scale(1);/*マウスオーバー後、線を100%出す*/
}

/*スマホメニューを横スクロール*/
#header-container .navi-in > ul li {
   height: auto;
   font-weight: 600;
   line-height:1.3;
}
#header-container #navi a{
   color:#666666; /* 文字色 */
   padding:0.8em 1em;
}
#header-container #navi a:hover{
   color:#fff200; /* マウスホバー時の文字色 */
}
#header-container .navi-in > ul > .menu-item-has-children > a::after {
   top: 0.8em;
   font-size: 1.2em;
   font-weight: 600;
}
#header-container .sub-menu .caption-wrap{
   padding-left:1em;
}
.navi-in > ul .menu-item-has-description > a > .caption-wrap{
   height:auto;
}
@media screen and (max-width: 1030px){
  #header-container .menu-mobile{
    display:none;
  }
  .navi-in > .menu-mobile{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    overflow-x: scroll;
    white-space: nowrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
  }
  #header-container #navi a{
    font-size:0.8em;
    padding: 0.8em 1.2em;
  }
  #header-container .navi-in > ul > .menu-item-has-children > a::after{
    display:none;
  }
  #navi .navi-in > .menu-mobile li {
    height: auto;
    line-height: 1.8;
  }
  .mblt-header-mobile-buttons {
    margin-top: 53px;
  }
}
/************************************
**　　移動マーカー
************************************/
.markerslide {
    font-weight:bold;
    background: -webkit-linear-gradient(left, rgb(255,233,50) 50%, transparent 50%);
    background: -moz-linear-gradient(left, rgb(255,233,50) 50%, transparent 50%);
    background: linear-gradient(left, rgb(255,233,50) 50%, transparent 50%);
    background-repeat: no-repeat;
    background-size: 200% .8em; 
    background-position: 100% .5em;
    transition: 2s;
}
.markerslide.is-active{
    background-position: 0% .5em;
}
/* コメントエリア 編集 */
.comment-list {
  border: 2px solid #72c7e6;
  padding: 0;
  border-radius: 10px;
}
.comment-title {
  margin: 0;
  font-size: 24px;
  background: #72c7e6;
  color: #fff;
  padding-left: 20px;
  font-weight: normal;
}
.comment-title:before {
font-family: FontAwesome;
content: '\f27b';
  color: #fff;
  margin-right: 4px;
}
.commets-list {
  padding: 20px 20px 0 20px;
}
.commets-list > li {
  border-top: 2px dashed #72c7e6;
  margin: 30px 0;
  padding-top: 20px;
}
.commets-list > li:first-child {
  border: none;
  margin-top: 0;
  padding-top: 0;
}
.commets-list .children {
  border-left: 2px solid #ccc;
  margin: 0;
}
.commets-list .avatar {
  float: left;
  border-radius: 50%;
  margin-right: 10px;
}

.st-comment-content {
  background: #e2e2e2;
  padding: 2px 10px;
  margin: 20px 0 6px 0;
  border-radius: 10px;
  position: relative;
}
.st-comment-content::before {
  content: "";
  position: absolute;
  top: -14px;
  left: 50px;
  border-style: solid;
  border-color: transparent
  transparent #e2e2e2 
  transparent;
  border-width: 0 20px 20px 0;
}
.st-comment-content p {
  font-size: 14px;
  margin: 1em 0;
  line-height: 1.5em;
}
.comment-reply-link {
  color: #fff;
  border: none;
  border-radius: 20px;
  background: #72c7e6;
  padding: 1px 12px;
  transition: 0.5s;
}
.comment-reply-link:hover {
  color: #fff;
  background: #49add1;
  transition: 0.5s;
}
.commets-list .st-comment-body {
  margin-bottom: 0;
}
#commentform input[type="submit"] { /*送信ボタンの装飾*/
  -webkit-appearance: none;
  padding: 20px;
width: 100%;
  margin: 0;
  cursor: pointer;
  background: #72c7e6;
  color: #fff;
  border: none;
  font-size: 16px;
  transition: 0.5s;
border-radius: 10px;
}
#commentform input[type="submit"]:hover { /*送信ボタンのマウスホバー時*/
  background: #49add1;
  transition: 0.5s;
}
/*『コメント＊』を消す*/
.comment-respond .comment-form-comment label { 
  display:none
}