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

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

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

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

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


.searchandfilter > ul > li {
	display: inline-block;
	vertical-align: top;
	padding: 0 20px;
}
/* ==================================================
header-telbox
================================================== */
.header-telbox {
	display: none;
	position: absolute;
	z-index: 9999;
	top: 65px;
	width: calc(100% + 16px);
	font-size: 1.2rem;
	margin: 0 -8px;
	padding: 20px;
	background: rgba(211, 84, 129,.8);
}
.header-telbox.on {
	display: block;
}
.header-telbox li {
	display: flex;
	justify-content: space-between;
}
.header-telbox li:nth-child(n+2) {
	margin-top: 20px;
}
.header-telbox .close {
	display: block;
	text-align: center;
	color: #fff;
	padding: 10px;
	margin: -20px -20px 20px;
	background: rgba(211, 84, 129,.8);
	cursor: pointer;
}
.header-telbox div {
	width: 73%;
	padding: 10px;
	color: #d35481;
	background: #fff;
}
.header-telbox .ttl {
	font-size: 1.6rem;
}
.header-telbox .link a {
	text-decoration: underline;
	color: inherit;
}
.header-telbox div .tel {
	display: none;
}
.header-telbox li > .tel {
	width: 25%;
}
.header-telbox li > .tel a {
	display: block;
	height: 100%;
	text-align: center;
	color: #fff;
	padding: 10px;
	background: rgba(211, 84, 129,.8);
}
.header-telbox li > .tel a i {
	display: block;
	font-size: 2em;
	color: inherit;
}
@media screen and (max-width: 991px) {
.header-phone {
	display: block !important;
}
}
@media screen and (min-width: 992px) {
.header-telbox {
	justify-content: space-between;
	top: 70px;
	text-align: center;
}
.header-telbox.on {
	display: flex;
}
.header-telbox li {
	display: block;
	width: 15%;
	margin-top: 0 !important;
}
.header-telbox .close {
	display: none;
}
.header-telbox div {
	width: auto;
	padding: 0;
	color: #fff;
	background: transparent;
}
.header-telbox .ttl {
	font-size: inherit;
}
.header-telbox div .tel {
	display: block;
	font-size: 1.6rem;
	font-weight: bold;
}
.header-telbox .link a {
	display: block;
	text-decoration: none;
	color: #d35481;
	padding: .5em;
	background: #fff;
}
.header-telbox li > .tel {
	display: none;
}
}


/*====================
{{スマホを基本設計にする}}
 - 縲鰀479px：SP縦
 - 480px縲鰀599px：SP横
 - 600px縲鰀959px：タブレット
 - 960px縲鰀1279px：小型PC
 - 1280px縲怐F大型PC
====================*/


.flexitem h3{
	margin: 3px !important;
}


/* 縲鰀599px：SP横
------------------------------ */
@media screen and  (max-width:599px) { 


.flexcontainer{
  display: flex;
  flex-direction: column;
}

}

/* 600px縲鰀959px：タブレット
------------------------------ */
@media screen and (min-width:600px) and (max-width:959px) {


.flexcontainer{
  display: flex;
  flex-wrap: wrap;
}


.flexitem{
  width: 30%;
  font-size:60%;  
}

}

/* 960px縲怐F小型PC
------------------------------ */
@media screen and (min-width:960px) {

.flexcontainer{
  display: flex;
  flex-wrap: wrap;

}


.flexitem{
  width: 25%;
  font-size:80%;
}

}

/*****************************************************************
  add koshio
*****************************************************************/
.salt26_print_area {
  display: none;
}

.class_info_table {
  text-align: center;
}

.class_info_table th {
  width: 10em;
}

/* ==================================================
	add takahashi	single-page
================================================== */
*{
	overflow: visible;
}
.single .article-body .lesson_koumoku{
	margin-bottom: 40px;
}


.mobile-only{
	display: none;
}
.pc-only{
	display: block;	
}
@media screen and  (max-width:599px){
	.mobile-only{
		display: block;
	}
	.pc-only{
		display: none;	
	}

}