@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/* 横スクロールバーの抑制 */
body{overflow-x: hidden;}

/* フロント固定ページの各種情報を全て非表示 */
.home.page .entry-title,
.home.page .sns-share,
.home.page .sns-follow,
.home.page .date-tags,
.home.page .author-info{
  display: none;
}

/* 全ての固定ページで記事タイトルを非表示 */
.page .entry-title{
  display: none;
}

/* 全ての固定ページで投稿日・更新日・投稿者の情報を非表示 */
.page .date-tags,
.page .author-info {
    display: none;
} 

/* ロゴの表示を調整 */
.logo-image {
    padding: 10px 0 0 0;
    font-size: inherit;
}

/* メニューの区切り線 */
#navi .navi-in > ul > li{
  border-left: 1px solid #36ad4f;
}

#navi .navi-in > ul > li:last-child{
  border-right: 1px solid #36ad4f;
}

.navi-in > ul > .menu-item-has-children > a::after{
  right: 10px;
} 

/* Cocoon 見出しリセット */
.article h2{
background:none;
padding: 0;
}
 
.article h3{
border-top:none;
border-bottom:none;
border-left:none;
border-right:none;
padding: 0;
}
 
.article h4{
border-top:none;
border-bottom:none;
padding: 0;
}
 
.article h5{
border-bottom:none;
padding: 0;
}
 
.article h6{
border-bottom:none;
padding: 0;
}

/* 見出しの再定義 */
/* h1タグ */
h1 {
  position: relative;
  padding-bottom: 15px;
}

h1:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
  background: -webkit-repeating-linear-gradient(-45deg, #2ba044, #2ba044 2px, #fff 2px, #fff 4px);
  background: repeating-linear-gradient(-45deg, #2ba044, #2ba044 2px, #fff 2px, #fff 4px);
}

/* h2タグ */
.article h2{
background:none;
padding: 0;
}

.article h2 {
  background: #2B9152;
  padding: 0.6em;
  font-color: #FFFFFF;
  margin-top: 50px;
}

/* h3タグ */
.article h3{
border-top:none;
border-bottom:none;
padding: 0;
}

.article h3{
  border-top: 2px solid #2B9152;
  border-bottom: 2px solid #2B9152;
  font-size: 20px;
  padding: 9px 10px;
  margin-top: 50px;
}

/* h4タグ */

/* h5タグ */


/* 学ぶ力教室関連リンク見出し(span) */
.manabu-school-head {
  border-top:none;
  border-bottom:none;
  border-left:none;
  border-right:none;
  padding: 0;
}

.manabu-school-head {
  font-size: 22px;
  position: relative;
  display: inline-block;
  padding: 0 55px;
  margin-top: 0;
}

.manabu-school-head:before, .manabu-school-head:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color: black;
}

.manabu-school-head:before {
  left:0;
}
.manabu-school-head:after {
  right: 0;
}


/* テキストリンクの下線を非表示 */
a { text-decoration: none; }


#menu-item-20 { background-color: #008000 }
#navi .navi-in>ul>li#menu-item-166>a { padding: 0; }


.new-entry-cards .display-none {
	display: block;
	padding-top: 0.2em;
	text-align: right;
}
.new-entry-card-update-date {
	display: none;
}


/* 塾情報のためのテーブルCSS */
table.school-info{
  width: 100%;
  border-collapse: collapse;
}

table.school-info tr{
  border-bottom: solid 2px white;
}

table.school-info tr:last-child{
  border-bottom: none;
}

table.school-info th{
  position: relative;
  text-align: center;
  width: 30%;
  background-color: #2B9152;
  color: white;
  padding: 10px 0;
}

table.school-info td{
  text-align: left;
  width: 70%;
  text-align: left;
  background-color: #eee;
  padding: 10px 0 10px 20px;
}


/* スクウェアボタンCSS */
.square_btn {
    position: relative;
    display: inline-block;
    padding: 0.25em 0.5em;
    text-decoration: none;
    color: #FFF;
    background: #FE2E64;
    border: solid 1px #FF0040;
    border-radius: 4px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
    text-shadow: 0 1px 0 rgba(0,0,0,0.2);
}

.square_btn:active {
    border: solid 1px #03A9F4;
    box-shadow: none;
    text-shadow: none;
}

.square_blue_btn {
    position: relative;
    display: inline-block;
    padding: 0.25em 0.5em;
    text-decoration: none;
    color: #FFF;
    background: #642EFE;
    border: solid 1px #4000FF;
    border-radius: 4px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
    text-shadow: 0 1px 0 rgba(0,0,0,0.2);
}

.square_blue_btn:active {
    border: solid 1px #03A9F4;
    box-shadow: none;
    text-shadow: none;
}

.square_green_btn {
    position: relative;
    display: inline-block;
    padding: 0.25em 0.5em;
    text-decoration: none;
    color: #FFF;
    background: #04B45F;
    border: solid 1px #088A4B;
    border-radius: 4px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
    text-shadow: 0 1px 0 rgba(0,0,0,0.2);
}

.square_green_btn:active {
    border: solid 1px #03A9F4;
    box-shadow: none;
    text-shadow: none;
}


/* よくあるご質問CSS(QA) */
dl.qa {
 overflow: hidden;
 _zoom: 1;
}
 
dl.qa dd,
dl.qa dt {
 text-indent: -2.6em; 
 padding: 0 20px 0px 50px;
}
 
dl.qa dt {
 margin: 20px 20px 0 0;
}
 
dl.qa dd:first-letter,
dl.qa dt:first-letter {
 font-size: 1.6em;
 font-weight: bold;
 margin-right: 10px;
 padding: 5px;
}
 
dl.qa dd {
 margin: 10px 0 -1px 0;
 padding-bottom: 20px;
 border-bottom: solid 1px #aaa;
}
 
dl.qa dt:first-letter {
 color: #3498db;
}
 
dl.qa dd:first-letter {
 color: #ff6767;
}


/* ボックス用CSS */
.yellow-box01 {
    position: relative;
    margin: 25px 5px 25px 10px;
    background: #fff0cd;
    box-shadow: 0px 0px 0px 5px #fff0cd;
    border: dashed 2px white;
    padding: 0.2em 0.5em;
    color: #454545;
}
.yellow-box01:after {
    position: absolute;
    content: '';
    right: -7px;
    top: -7px;
    border-width: 0 15px 15px 0;
    border-style: solid;
    border-color: #ffdb88 #fff #ffdb88;
    box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.15);
}
.yellow-box01 p {
    margin: 0; 
    padding: 0;
}

.green-box01 {
    position: relative;
    margin: 2.6em 0;
    padding: 1.2em 1em;
    border: solid 2px #04B486;
    border-radius: 8px;
}
.green-box01 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 16px;
    background: #FFF;
    color: #04B486;
    font-weight: bold;
}
.green-box01 p {
    margin: 0; 
    padding: 0;
}

.green-box02 {
    position: relative;
    margin: 40px 0px 20px 0px;
    padding: 0px 5px;
    border: solid 3px #04B45F;
    border-radius: 3px;
}
.green-box02 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 14px;
    background: #04B45F;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.green-box02 p {
    margin: 0; 
    padding: 0;
}

.green-box03 {
    padding: 1.5em 1.5em;
    margin: 2em 0;
    background: #E0F8EC;
    border: dashed 2px #088A29;
}
.green-box03 p {
    margin: 0; 
    padding: 0;
}

.green-box04 {
    margin: 2em 0;
    background: #EFFBF8;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.green-box04 .box-title {
    font-size: 1.2em;
    background: #04B486;
    padding: 4px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.green-box04 p {
    padding: 15px 20px;
    margin: 0;
}


.blue-box01 {
    padding: 1em 1em 0 1em;
    margin: 2em 0;
    border: double 5px #4ec4d3;
}
.blue-box01 p {
    margin: 0; 
    padding: 0;
}

.blue-box02 {
    position: relative;
    margin: 2em 0;
    padding: 1.5em 1em;
    border: solid 3px #95ccff;
    border-radius: 8px;
}
.blue-box02 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #95ccff;
    font-weight: bold;
}
.blue-box02 p {
    margin: 0; 
    padding: 0;
}

.blue-box03 {
    position: relative;
    margin: 2em 0;
    padding: 1em 1em;
    border: solid 2px #4682b4;
    border-radius: 8px;
}
.blue-box03 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #4682b4;
    font-weight: bold;
}
.blue-box03 p {
    margin: 0; 
    padding: 0;
}


/* カリキュラム リンクテーブル */
.curriculum-link-table {
  border-collapse:collapse;
  margin:0 auto;
  font-size: 15px;
}

.curriculum-link-table-title tr{
  color:#fff;
  background:#088A4B;
}
.curriculum-link-table td,th{
  padding:7px;
  border-bottom:1px solid #ccc;
}


/* お問い合わせフォーム用CSS */
.form-small-comments {
    font-size: 13px;
    color: #A4A4A4;
    margin: -30px 0px 30px 5px;
}

.form-must{
	color: #fff;
	font-size: 14px;
	margin-right: 5px;
	padding: 1px 4px;
	background: #F92931;
	border-radius: 10px;
}

.form-free {
	color: #fff;
	font-size: 14px;
	margin-right: 5px;
	padding: 1px 4px;
	background: #01DFA5;
	border-radius: 10px;
}


/* ブログカードカスタマイズ */
.blogcard-snippet,
.blogcard-footer {
  display: none;
}
.blogcard-wrap {
  transition: all .3s;
  max-width: 600px;
  margin: 2em auto;
}
.blogcard {
  border:1px solid #eaeaea !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .15);
  padding: 10px;
  margin: -20px auto;
}
.blogcard-wrap:hover {
  background: none;
  transform: translateY(-3px);
  box-shadow: 0px 10px 20px rgba(0, 0, 0, .1);
}
.blogcard-thumbnail {
  margin: 0;
}
.blogcard-thumbnail img {
  display: block;
}
.blogcard-title {
  color: #555;
  letter-spacing: 0.5px;
  font-size: 15px;
  line-height: 1.5;
  margin: 10px 0 0 0;
  height: 45px;
  overflow: hidden;
}
.blogcard-content {
  min-height: auto;
  margin-left: 185px;
  padding-right: 6px;
}
.blogcard-label {
  top: -11px;
  left: 9px;
  padding: 3px 0.6em;
  background:#aaa;
  padding: 1px 10px;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 1px;
}
.blogcard-content:after {
  content: "クリックして読む";
  background: #04B486;
  display: block;
  text-align: center;
  color: #fff;
  font-weight: 600;
  letter-spacing: 1px;
  width: 180px;
  border-radius: 20px;
  font-size: 13px;
  padding: 1px 0;
  margin-top: 6px;
}
@media screen and (max-width: 834px) {
  .blogcard-content {
    margin-left: 130px;
  }
  .blogcard-title {
    font-size:12px;
    line-height: 1.5;
    height: 35px;
    margin:0;
  }
  .blogcard-content:after {
    content: "タップして読む";
  }
  .blogcard-thumbnail{
    width:120px;
  }
}
@media screen and (max-width: 560px) {
  .blogcard-content:after {
    width: 120px;
    font-size: 12px;
  }
  .blogcard-title {
    margin:0;
  }
}
@media screen and (max-width: 320px) {
  .blogcard-thumbnail {
    width: 100px;
  }
  .blogcard-content {
    margin-left: 110px;
  }
  .blogcard-title {
    height: 35px;
  }
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}