@charset "UTF-8";
/*----------------------------------------------------------------------------------------------------
 *
 * Theme Name: ドリームミュージック（子供向け音楽教室）のホームページ ver2.7（地域拡大）
 * Theme URI: 
 * Author: 
 * Author URI: 
 * Description: ドリームミュージック（子供向け音楽教室）のホームページ
 * Version: 2.5
 * License: GNU General Public License v2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: 
 *
 *--------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------
 *
 *
 * リセット
 *
 *
--------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; font:inherit; font-size:100%; vertical-align:baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
html, body { width:100%; height:100%; line-height:1; }
ol, ul { list-style:none; }
blockquote, q {quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
table { border-collapse:collapse; border-spacing:0; }
* { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }

/*--------------------------------------------------

   Clearfix

--------------------------------------------------*/
.cf { zoom:1; } .cf:before,.cf:after { content:""; display:table; } .cf:after { clear:both; }

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * 基本設定
 *
 *
 *
 *
--------------------------------------------------------------------------------*/
html { overflow:auto; }
@media screen and (max-width:1000px){ body { width:1000px; } }
@media screen and (max-width:768px){ body { width:100%; background:none; } }
body { font-family:'tsukushi_bold', serif; font-weight:300; font-style:normal; color:#47331c; 
font-size:100%; line-height:1.75; font-weight:normal; background:#fef5e4 url(img/index/bg.png); position:relative; font-size:16px; }
a:link,
a:visited { color:inherit; text-decoration:none; transition:.3s ease; }
a:hover,
a:active { color:inherit; text-decoration:none; transition:.3s ease; }
img { max-width:100%; height:auto; vertical-align:top; backface-visibility:hidden; }
a:link img,
a:visited img {opacity:1.0; transition:.3s ease; }
a:hover img,
a:active img {opacity: 0.6; transition: .3s ease; }
video::-webkit-media-controls-enclosure { overflow:hidden; }
video::-webkit-media-controls-panel { width: calc(100% + 30px); }

/* ------------------------------小見出し属性------------------------------　*/
h1 , h2 ,h3 ,h4 ,h5 { margin:0; padding:0; line-height:1.7; }
h1 { font-size:30px; }
h2 { font-size:26px; }
h3 { font-size:20px; }
h4 { font-size:18px; }
h5 { font-size:16px; }

@media screen and (max-width:768px){
	h1 { font-size:20px; }
	h2 { font-size:19px; }
	h3 { font-size:18px; }
	h4 { font-size:16px; }
	h5 { font-size:16px; }
}
p { margin-top:20px; padding:0; line-height:2; display:block; }
p:first-child { margin:0; }
ul { margin:0; padding:0; }
li { margin:0; padding:0; }
i { padding-right:6px; }
img { max-width:100%; height:auto; display:block; }
hr { border-top:1px solid #dbdbd9; border-bottom:1px solid #ffffff; border-right:none; border-left:none; margin:30px 0 40px 0; }
.center,.aligncenter { margin:0 auto; display:block; }
.left { float:left; margin:30px 30px 30px 0; }
.right { float:right; margin:30px 0 30px 30px; }
.photo00 { background:#ffffff; padding:5px; box-shadow:0px 0px 5px 5px rgba(0,0,0,0.05); }
.photo-left { transform:rotate(-4deg); -moz-transform:rotate(-4deg); -webkit-transform:rotate(-4deg); background:#ffffff; padding:5px; box-shadow:0px 0px 5px 5px rgba(0,0,0,0.05); }
.photo-right { transform:rotate(4deg); -moz-transform:rotate(4deg); -webkit-transform:rotate(4deg); background:#ffffff; padding:5px; box-shadow:0px 0px 5px 5px rgba(0,0,0,0.05); }
table { width:100%; font-size:12px; }
table tr { border-bottom:1px solid #cccccc; }
table th { vertical-align:baseline; font-weight:bold; }
table td { }
table th,
table td { padding:10px 10px; }
table img { width:50%; float:left; }
table tr:nth-child(even) { background:#f7f7f7; }
figure { display:inline-block; } /* 図 */
figcaption { text-align:center; font-size:12px; margin-top:10px; } /* 図のキャプション */
.bold { font-weight:bold; }
.small { font-size:12px; margin-bottom:16px; }
.underline { text-decoration:underline; font-weight:bold; }
.red { color:#d32226; font-weight:bold; }
.blue { color:#00acf6; font-weight:bold; }
.red_underline { background:linear-gradient(transparent 60%, #ff9999 60%); }
.yellow { color:#000000; font-weight:bold; background:linear-gradient(transparent 60%, #ffff00 60%); }
.marker { font-weight:bold; background:linear-gradient(transparent 60%, #f9e799 60%); line-height:1.5;}
.center { text-align:center; }
.big { font-size:24px; }
.sp00 { margin-top:0 !important; }
.sp10 { margin-top:10px !important; }
.sp20 { margin-top:20px !important; }
.sp30 { margin-top:30px !important; }
.sp40 { margin-top:40px !important; }
.sp50 { margin-top:50px !important; }
.sp60 { margin-top:60px !important; }
.sp70 { margin-top:70px !important; }
.sp100 { margin-top:100px !important; }
.align_left { text-align:left; }
.align_right { text-align:right; }
.align_center { text-align:center; }
.clear { clear:both; }
.ffffff { background:#ffffff!important; }
.f7f7f7 { background:#f7f7f7!important; }
.tategaki { writing-mode:tb-rl; /* IE独自仕様 */ writing-mode:vertical-rl; -moz-writing-mode:vertical-rl; -o-writing-mode:vertical-rl; -webkit-writing-mode:vertical-rl; /*縦文字に*/}
@media screen and (max-width:768px){
	.tategaki {	writing-mode:lr-tb; /* IE独自仕様 */ writing-mode:horizontal-tb; -webkit-writing-mode:horizontal-tb; -ms-writing-mode:horizontal-tb; -o-writing-mode:horizontal-tb; /*横文字に*/ }
}
.flex {display:-webkit-box; display:-ms-flexbox; display:flex;
-webkit-box-pack:center;-ms-flex-pack:center; justify-content:center;/*中央に配置*/
-webkit-box-pack:justify;-ms-flex-pack:justify; justify-content:space-between;/*左右に配置*/
-webkit-box-align:center;-ms-flex-align:center; align-items:center;/*上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap;/*折り返す*/ }

.video {
  position:relative;
  padding-bottom:56.25%;
  width:100%;
  height:0;
  overflow:hidden;
}
.video iframe {
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}
.video + p { margin-top:10px; }



@media screen and (max-width:768px){
	.left , .right  { float:none; margin:20px auto 20px auto; display:block; }
	.big { font-size:16px; }
}
.pc { display:block!important; }
.sp { display:none!important; }
@media screen and (max-width:768px){
	.pc { display:none!important; }
	.sp { display:block!important; }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * ヘッダー
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

/* header#header { width:100%; height:auto; padding:0; z-index:9999; position:absolute; background:url(img/top_border.png) repeat-x 50% 0;} */
header#header{
	position:relative;
	z-index:10;
	height:220px;
	background:url(img/index/bg01.png);
}
@media screen and (max-width:768px){
	header#header { width:100%; height:auto; }
	header#header #inner { width:100%; height:auto; }
}

header#header ul.two_row { width:1000px; height:120px; margin:0 auto;
display:-webkit-box; display:-ms-flexbox; display:flex;
/*-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;中央に配置*/
-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;/*左右に配置*/
-webkit-box-align:center;-ms-flex-align:center; align-items:center; /*上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ }
header#header ul.two_row li p { line-height:1; margin:0; padding:0; }
header#header ul.two_row li p span { display:inline!important; }
header#header ul.two_row li:nth-child(1) { }
header#header ul.two_row li:nth-child(2) p { font-size:14px; line-height:1.5; }
header#header ul.two_row li:nth-child(3) a { font-size:30px; color:#e60012; pointer-events:none; }
header#header ul.two_row li:nth-child(4) a { display:block; background:#e60012; color:#fff; padding:16px 32px; border-radius:100px; box-shadow:0 5px 0 rgba(190,25,55,1); font-size:18px; }
.fa-phone {
	transform: scaleX(-1) rotate(-15deg);
}

@media screen and (max-width:768px){
	header#header ul.two_row { width:100%; height:70px; background:#fff; position:fixed; top:0; z-index:9998; box-shadow:0 10px 10px rgba(0,0,0,0.01);}
	header#header ul.two_row li p span { display:none!important; }
	header#header ul.two_row li:nth-child(1) { width:160px; margin-left:5px; }
	header#header ul.two_row li:nth-child(2) p { display:none }
	header#header ul.two_row li:nth-child(3) { display:none;/*position:absolute; right:95px;*/}
	header#header ul.two_row li:nth-child(3) a { /*pointer-events:auto; display:block; background:#e60012; color:#fff; padding:0; border-radius:100px; font-size:18px; width:36px; height:36px; line-height:36px; text-align:center; box-shadow:0 2px 0 rgba(190,25,55,1);*/ }
	header#header ul.two_row li:nth-child(4) a { margin-right:50px; box-shadow:none; border-radius:5px; font-weight:normal; text-align:center; box-shadow:0 2px 0 rgba(190,25,55,1); font-size:12px; padding:12px 8px; }
	header#header i { margin:0 5px 0 0; padding:0; }
	header#header ul.two_row img {
		margin-left:5px;
		width:155px;
	}
}

/* スクロールした時、navに.is-fixedを付与 */
.is-fixed  { top:0; width:100%!important; padding:10px 0; z-index:9999;
height:auto!important; position:fixed!important; background:#fef5e4 url(img/index/bg.png);
-webkit-transition:all .4s ease 0s,background .6s ease .2s; transition:all .4s ease 0s,background .6s ease .2s; -webkit-overflow-scrolling:touch; overflow-scrolling:touch; }

@media screen and (max-width:768px){
	.is-fixed  { background:transparent; }
}


/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * グローバルナビゲーション
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

/* ------------------------------グローバルナビゲーション（PC）------------------------------　*/
nav#header-nav { clear:both; width:1000px; height:auto; margin:0 auto; padding:0; z-index:9999; }
nav#header-nav ul { width:100% }
nav#header-nav ul li { 
	flex:1;
	padding:12px 20px;
	text-align:center;
	border-left:1px dotted #47331c; 
}
nav#header-nav ul li:last-child { border-right:1px dotted #47331c; }
nav#header-nav ul li a {
	display:block;
	font-size:18px;
	padding:0;
	line-height:1.2;
	color:#47331c;
	white-space:nowrap; 
	text-align:center;
}
nav#header-nav ul li a:before { font-family:"Font Awesome 5 Free"; font-weight:900; font-size:20px; }
nav#header-nav ul.flex { 
display:flex;
align-items:center; /*上下中央*/
justify-content:center;
width:100%;
padding:0;
margin:0;
}
.nav-unshown { display:none; }
/* ------------------------------グローバルナビゲーション（モバイル）------------------------------　*/
@media screen and (max-width:768px){
nav#header-nav { width:100%; margin:0; padding:0; border:none; }
nav#header-nav ul { width:100%; margin:0; padding:20px 0 0 0; }
nav#header-nav ul li { width:80%; text-align:center; padding:20px 30px; margin:0 auto; border-bottom:1px dotted #ccc; }
nav#header-nav ul li a { font-size:16px; color:#333; }
nav#header-nav ul li { border-left:none; }
nav#header-nav ul li:last-child { border-right:none; }
nav#header-nav ul.flex { display:block; }


/*ヘッダーまわりはご自由に*/
#sp_menu { 
	padding:0px;
	background:none; 
	position:fixed; 
	top:0; 
	right:0; 
	z-index:9998;/*最前面に*/
 height:70px;
}
#nav-drawer { position:relative; }
/*チェックボックス等は非表示に*/
.nav-unshown { display:none; }
/*アイコンのスペース*/
#nav-open { 
	display:inline-block; 
	z-index:9999;/*最前面に*/ 
	position:relative;
	width:50px;
	height:50px;
	vertical-align:middle;
	float:right;
	background:#fff;
	margin-top:10px;
}
/*ハンバーガーアイコンOpen前*/
#nav-open,
#nav-open span {display:inline-block; transition:all .4s; box-sizing:border-box; }
#nav-open span {position:absolute; left:30%; width:40%; height:2px; background-color:#333; border-radius:4px; }
#nav-open span:nth-of-type(1) {top: 16px; }
#nav-open span:nth-of-type(2) {top: 24px; }
#nav-open span:nth-of-type(3) {bottom: 16px; }
/*ハンバーガーアイコンOpen後*/
#nav-open.active { background-color:#fff; }
#nav-open.active span { background-color:#333; }
#nav-open.active span:nth-of-type(1) {-webkit-transform: translateY(8px) rotate(-315deg); transform: translateY(8px) rotate(-315deg); }
#nav-open.active span:nth-of-type(2) {opacity: 0; }
#nav-open.active span:nth-of-type(3) {-webkit-transform: translateY(-8px) rotate(315deg); transform: translateY(-8px) rotate(315deg); }
/*閉じる用の薄黒カバー*/
#nav-close {display: none;/*はじめは隠しておく*/ position: fixed; z-index:99; top: 0;/*全体に広がるように*/ right: 0; width: 100%; height: 100%; background: black; opacity: 0; transition: .3s ease-in-out; }
/*中身*/
#nav-content {
overflow:auto; position:fixed; top:0; right:0; z-index:9999;/*最前面に*/ width:90%;/*右側に隙間を作る*/ max-width:330px;/*最大幅*/ height:100%; background:#fff;/*背景色*/ transition: .3s ease-in-out;/*滑らかに表示*/ -webkit-transform: translateX(105%); transform: translateX(105%);/*左に隠しておく*/ }
/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close { display: block;/*カバーを表示*/ opacity: .5; }
#nav-input:checked ~ #nav-content {z-index:9997; -webkit-transform: translateX(0%); transform: translateX(0%);/*中身を表示*/ box-shadow: 6px 0 25px rgba(0,0,0,.15); }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * パンくずリスト
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

nav#pan { text-align:left; margin:0; padding:0; }
nav#pan ol { max-width:1000px; margin:0 auto; padding:0; text-align:center;  }
nav#pan ol li { display:inline; list-style-type:none; font-size:12px; color:#fff; margin:0; padding:0; border-radius:5px; position:relative; }
nav#pan ol li:after { content:">"; margin:0 5px; }
nav#pan ol li:last-child:after { border-width:0; content:""; }
nav#pan ol li a { color:#fff; }
@media screen and (max-width:768px){
	nav#pan { margin:0; }
	nav#pan ol { width:100%; }
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * FV
 *
 *
 *
 *
--------------------------------------------------------------------------------*/
.page_fv img{
	width:100%;
	height:auto;
	display:block;
}

.page_fv .sp{
	display:none;
}

@media screen and (max-width:768px){
	.page_fv .pc{
		display:none;
	}

	.page_fv .sp{
		display:block;
	}

	.page_fv img{
	padding-top:70px;
	}
}



/* ------------------------------トップページ------------------------------　*/
header#fv { width:100%; height:870px; background:url(img/index/header_bg.png) no-repeat 50% 220px; background-size:1600px 650px; }
header#fv #inner { width:1000px; height:auto; margin:0 auto; padding:0; position:relative; }
header#fv #logo { margin:0; padding:0; }
header#fv p { margin:0; padding:0; }
@media screen and (max-width:768px){
	header#fv { background:none; width:100%; height:auto; background:none; padding-top:50px; }
	header#fv #inner { width:100%; height:auto; }
}

/* ------------------------------固定ページ------------------------------　*/
header#mv { width:100%; height:870px; background:url(img/common/black_filter03.png) repeat 0 0 , url(img/common/header_bg.jpg) no-repeat 50% 0; background-size:auto, cover;
display:-webkit-box; display:-ms-flexbox; display:flex;
-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;/*中央に配置*/
/*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
-webkit-box-align:center;-ms-flex-align:center; align-items:center; /*上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ }
header#mv #inner { width:1000px; margin:0 auto; padding:0; position:relative; }
header#mv h1 { margin:0; padding:0; color:#fff; text-align:center; font-size:40px; text-shadow:1px 1px 0 rgba(0,0,0,0.2); }
@media screen and (max-width:768px){
	header#mv { width:100%; height:320px; background:url(img/common/black_filter03.png) repeat 0 0 , url(img/common/header_bg_sp.png) no-repeat 50% 0; position:relative; top:50px; margin-bottom:50px; background-size:cover; }
	header#mv #inner { width:100%; margin:0; padding:20px 20px; }
	header#mv h1 { margin:0; padding:0; font-size:24px; line-height:1.4; }
}


.seo_h1{
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	white-space:nowrap;
	border:0;
}



/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * コンテンツ
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

/* ------------------------------共通------------------------------　*/
article {  }
section { width:100%; }
section .inner { width:1000px; margin:0 auto; padding:60px 0; }

@media screen and (max-width:768px) {
	section .inner { width:90%; padding:30px 0; }
}
@font-face { font-family:'tsukushi'; src:url('font/TsukushiAMaru.woff') format('woff'); }
@font-face { font-family:'tsukushi_bold'; src:url('font/TsukushiAMaruGothic.woff') format('woff'); }
@font-face { font-family: 'din-alternate-bold'; src: url("font/din-alternate-bold.ttf"); }

@media screen and (max-width:768px) {
	.frame { width:100%; height:auto; background-size:contain; padding: 3.5% 4% 5% 4%; }
}

a.button { border:2px solid #000; font-weight:bold; padding:20px; text-align:center; }
a.button:hover { background:#000; color:#fff; }
@media screen and (max-width:768px) {
}

article#index h2 { font-size:50px; text-align:center; line-height:1.2; }
article#index h2 span.subttl { font-size:30px; 
display:inline-block;
	background:#d91f1f;
	color:#fff;
	padding:12px 40px;
	border-radius:999px;
	text-align:center;
	margin-bottom:20px;
	}
article#index h2 span.small { font-size:30px; }
article#index h3 { font-size:26px; line-height:1.2; }
article#index p { font-size:18px; margin:0; padding:0; }
article#index img.h2_bottom { display:block; margin:20px auto 0 auto; padding:0; }

@media screen and (max-width:768px) {
	article#index h2 { font-size:34px; }
	article#index h2 span.small { font-size:16px; }
	article#index h3 { 
	font-size:18px;
	line-height:1.5; 
}
	article#index p { 
		font-size:14px;	
	}
	article#index img.h2_bottom { width:80%; margin-top:10px; }
	article#index h2 span.subttl { 
	font-size:18px; 
 padding:12px 32px;
	margin-bottom:10px;
	}
}

/*--------------------------------------------------------------------------------
 *
 * opening
 *
--------------------------------------------------------------------------------*/
#opening { background:url(img/index/bg03.png) no-repeat 50% 50%; }
#opening ul { display:-webkit-box; display:-ms-flexbox; display:flex;
/*-webkit-box-pack:center;-ms-flex-pack:center; justify-content:center;中央に配置*/
-webkit-box-pack:justify;-ms-flex-pack:justify; justify-content:space-between;/*左右に配置*/
-webkit-box-align:center;-ms-flex-align:center; align-items:center;/*上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap;/*折り返す*/ }
#opening ul li { width:32%; } 
#opening .txt1 { text-align:center; font-size:24px; line-height:2; margin:40px 0px;} 
#opening .front_txt1 { text-align:center; font-size:24px; line-height:2; margin:40px 0 0 0} 
#opening .front_txt2 { text-align:center; font-size:26px; line-height:2; margin:0 0 40px 0} 
#opening .front_txt3 { text-align:center; font-size:26px; line-height:2; margin:40px 0;} 
#opening p.small { font-size:12px!important; margin-top:15px; } 
.opening_photo_wrap {
	display:flex;
	justify-content:center;
	gap:40px;
	flex-wrap:wrap;
}
.opening_photo {
	width:100%;
}
.opening_photo img {
	width:100%;
	height:auto;
	display:block;
}



@media screen and (max-width:768px){
	#opening ul li { width:100%; margin:0 auto; } 
	#opening ul li:first-child { margin-top:0; } 
	#opening ul li { margin-top:0px; }
	#opening p { font-size:16px!important; } 
	#opening .txt1 {
	margin:24px 0px;
	} 
	#opening .front_txt1 {
	margin:24px 0 0 0;
		font-size:18px!important;
	} 
	#opening .front_txt2 {
	margin:0 0 24px 0;
	} 
	#opening .front_txt3 { 
	margin:24px 0px;
	font-size:18px!important;
	} 
	.opening_photo_wrap {
	gap:0px;
	flex-wrap:nowrap;


}

}
@media screen and (max-width:460px){
 #opening .front_txt2 br,
	#opening .front_txt3 br {
	display:none; } 

	#opening .front_txt2 { 
	text-align:left;
	} 
	#opening .front_txt3 { 
	text-align:left;
	} 
}


/*--------------------------------------------------------------------------------
 *
 * recommend
 *
--------------------------------------------------------------------------------*/
#recommend { background-color:#FFF; }
.recommend_list{
	margin:40px auto 0;
	padding:0;
	list-style:none;
	display:flex;
	flex-direction:column;
	gap:24px;
}
.recommend_item{
	background:#f8eddf;
	border-radius:10px;
	overflow:hidden;
}
.recommend_item h3{
	display:flex;
	align-items:center;
	gap:20px;
	margin:0;
	padding:24px;
	color:#fff;
	font-size:32px!important;
	font-weight:700;
	line-height:1.4;
}
.recommend_label{
	display:inline-block;
	padding:6px 18px;
	background:#fff;
	border-radius:999px;
	font-size:24px;
	line-height:1;
	white-space:nowrap;
	font-weight:700;
}
.recommend_content{
	display:flex;
	align-items:stretch;
}
.recommend_content p{
	width:60%;
	margin:0;
	margin:40px!important;
	font-size:18px;
	line-height:2;
}
.recommend_content figure{
	width:40%;
	margin:0;
}
.recommend_content img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.recommend_item01 h3,
.recommend_item .rhythmic {
	background:#E50012;
}
.recommend_item01 .recommend_label,
.recommend_item .rhythmic .recommend_label {
	color:#E50012;
}
.recommend_item02 h3,
.recommend_item .babyrhythmic {
	background:#EC6918;
}
.recommend_item02 .recommend_label,
.recommend_item .babyrhythmic .recommend_label {
	color:#EC6918;
}
.recommend_item03 h3,
.recommend_item .piano{
	background:#21AC38;
}
.recommend_item03 .recommend_label,
.recommend_item .piano .recommend_label {
	color:#21AC38;
}
.recommend_item .kidsdrum {
	background:#18499D;
}
.recommend_item .kidsdrum .recommend_label {
	color:#18499D;
}

@media screen and (max-width:768px){
	.recommend_list{
	margin:24px auto 0;
	gap:20px;
}
	.recommend_item h3{
	font-size:24px!important;
	padding:20px;
	flex-direction: column;
	gap:12px;
	text-align:center;
}
.recommend_label{
	font-size:20px;
}
.recommend_content{
	flex-direction:column-reverse;
	align-items:stretch;
}
.recommend_content p{
	width:93%;
	margin:20px!important;
}
.recommend_content figure{
	width:100%;
}
}

/*--------------------------------------------------------------------------------
 *
 * course
 *
--------------------------------------------------------------------------------*/
#course { background:url(img/index/bg02.png); }
#course ul { margin:40px 0 0 0;
display:-webkit-box; display:-ms-flexbox; display:flex;
/*-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;中央に配置*/
/* -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; */
/*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ 
gap: 20px;
}
#course li { width:48%; border-radius:10px; padding:20px; background:#E50012; display:flex;	flex-direction:column; }
#course li:nth-child(2) { background:#EC6918; }
#course li:nth-child(3) { background:#21AC38; }
#course li:nth-child(4) { background:#18499D; }
#course li{
	display:flex;
	flex-direction:column;
}

#course li a.course_link{
	display:flex;
	flex-direction:column;
	flex:1;
	width:100%;
	height:100%;
	color:inherit;
	text-decoration:none;
}

#course li a.course_link .box{
	flex:1;
	display:flex;
	flex-direction:column;
}

#course li a.course_link .box > p{
	flex:1;
}
#course h3 { color:#fff; text-align:center; font-size:32px!important; margin-bottom:20px; }
#course .box { background:#fff; padding:0!important; margin:0; border:none; display:flex; flex-direction:column; flex:1; }
#course .box > p { padding:20px; }
#course img { display:inline; }



@media screen and (max-width:768px){
	#course ul { margin:24px 0 0 0;}
	#course li { width:100%; padding:20px; }
	#course p.old { font-size:14px; }
	#course h3 { font-size:24px!important; }
	#course .box { padding:20px; }
	#course .box > p { font-size:14px;  }
}

.box_online { background:#fff; border:4px solid #47331c; border-radius:10px; padding:30px 30px 40px 30px; }
.box_online p { font-size:20px!important; margin-top:20px; text-align:center; }
.box_online a { background:#ff0000; border-radius:100px; text-align:center; display:block; margin:20px auto 0 auto; padding:20px 0; width:400px; color:#fff; box-shadow:0 6px 0 rgba(200,0,20,1); font-size:20px }
@media screen and (max-width:460px){
	.box_online { padding:20px 20px 40px 20px; }
	.box_online a { font-size:20px; width:100%; }
	.box_online p { font-size:12px!important; margin-top:20px!important; text-align:left; }
	.box_online p br { display:none }

}

/*--------------------------------------------------------------------------------
 *
 * voice
 *
--------------------------------------------------------------------------------*/
.box_online + h2 { margin-top:50px; }
#voice { background:url(img/index/bg03.png) no-repeat 50% 50%; }
#voice ul { margin-top:40px;
display:-webkit-box; display:-ms-flexbox; display:flex;
-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;/*中央に配置*/
/*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
/*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ gap:24px; }
#voice li { width:100%; background:#fff; padding:20px; box-shadow:0 1px 2px rgba(0,0,0,0.3); border-radius:10px; border:4px solid #47331c; display:flex;}
#voice li img {  width:200px; height:200px; border-radius:150px; margin:0 auto; background:#fff; }
#voice p { padding-left:20px!important; }
#voice p .who { font-size:16px;  }

@media screen and (max-width:768px){
	#voice ul { margin-top:24px; gap:20px; }	
	.box_online + h2 { margin-top:30px; }
	#voice h3 { margin:10px 0; font-size:16px!important; }
	#voice li {
		width:100%;
 	display: flex;
  flex-direction: column;
	}
	#voice p { padding:20px 0 0 0!important; }
	#voice p .who { font-size:12px;  }
}


/*--------------------------------------------------------------------------------
 *
 * message
 *
--------------------------------------------------------------------------------*/
#message{	background:#ECF6EF;}
#message h2{	text-align:center;}
.message_movie{	max-width:800px; margin:40px auto 60px; aspect-ratio:16 / 9; }
.message_movie iframe{	width:100%;	height:100%;	display:block;}
.message_profile{	display:flex;	align-items:center;	justify-content:center;	gap:40px;	margin:0 auto;}
.message_profile figure{ width:70%;	margin:0;}
.message_profile img{	width:100%;	height:auto;	display:block;}
.message_text{	width:100%;}
.message_position{	margin-bottom:8px;	font-size:14px;}
.message_text h3{	margin-bottom:20px; padding-bottom:20px; border-bottom: 1px dotted #47331c;}
.message_text h3 span{	font-size:14px;	margin-left:8px;}
.message_text p{	font-size:15px;	line-height:2;}


@media screen and (max-width:768px){
	.message_movie { margin:24px 0; }
	.message_profile {		flex-direction: column; gap:20px;	margin:0 }
	.message_text h3{	font-size:20px!important;	margin-bottom:14px; padding-bottom:14px; }
	.message_profile figure { width:100%;}
}

/*--------------------------------------------------------------------------------
 *
 * 背景ループ
 *
--------------------------------------------------------------------------------*/

#roop {width:100%; height:500px; background:url(img/index/bg_roop.png) repeat-x; background-position:0 0; background-size:2200px 500px; -webkit-animation:bgroop 20s linear infinite; animation:bgroop 20s linear infinite; }
@-webkit-keyframes bgroop {
    from {
        background-position:0  0;
    }
    to {
        background-position:-1956px 0;
    }
}
@keyframes bgroop {
    from {
        background-position:0 0;
    }
    to {
        background-position:-1956px 0;
    }
}

@media screen and (max-width:460px){
	#roop { height:200px; background-size:880px 200px; }

}

/*--------------------------------------------------------------------------------
 *
 * access
 *
--------------------------------------------------------------------------------*/
#access { background:url(img/index/bg02.png); }
#access iframe { width:100%; height:240px; }
#access ul { margin-top:40px;
display:-webkit-box; display:-ms-flexbox; display:flex;
-webkit-box-pack:center; -ms-flex-pack:center; justify-content:flex-start;/*中央に配置*/
/*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
/*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ }
#access li { width:49%; background:#fff; margin-top:20px; padding:20px; box-shadow:0 1px 2px rgba(0,0,0,0.3); border-radius:10px; border:4px solid #47331c; }
#access li:nth-child(1) { margin-top:0; }
#access li:nth-child(2) { margin-top:0; }
#access li:nth-child(odd) {  }
#access li:nth-child(even) { margin-left:2%; }
#access a { display:block; width:120px; height:110px; background:#e60012; color:#fff; padding:10px 0 0 0; border-radius:10px; box-shadow:0 5px 0 rgba(190,25,55,1); text-align:center; line-height:1.4; }
#access a:before { font-family:"Font Awesome 5 Free"; font-weight:900; font-size:40px; content:'\f5a0\A'; white-space:pre; }
#access li:nth-child(1) a {  }
#access li:nth-child(2) a { background:#fccb00; box-shadow:0 5px 0 rgba(220,180,50,1); }
#access li:nth-child(3) a { background:#22ac38; box-shadow:0 5px 0 rgba(40,150,60,1); }
#access li:nth-child(4) a { background:#007bc7; box-shadow:0 5px 0 rgba(10,100,160,1); }
#access li:nth-child(5) a { background:#e60012; box-shadow:0 5px 0 rgba(190,25,55,1); }
#access li:nth-child(6) a { background:#fccb00; box-shadow:0 5px 0 rgba(220,180,50,1); }
#access li:nth-child(7) a { background:#22ac38; box-shadow:0 5px 0 rgba(40,150,60,1); }
#access .cf { margin-top:20px; }
#access .left_box { float:left; }
#access .left_box h3 { font-size:24px;line-height:1.5; margin-bottom:8px;}
#access .left_box p .atn { font-size:16px;}

@media screen and (max-width:768px){
	#access ul { margin-top:24px;}
	#access li {  width:100% }
	#access li:nth-child(2) { margin-top:20px; }
  #access li:nth-child(even) { margin-left:0; }
	#access a { width:100%; height:auto; margin-top:20px; padding:10px 0; border-radius:10px; box-shadow:0 3px 0 rgba(190,25,55,1); border-radius:30px; }
	#access a:before { font-size:14px; content:'\f5a0'; white-space:normal; margin-right:6px; }
	#access .cf { margin-top:12px; }
	#access .left_box { float:none; }
	#access .right_box { float:none; }
	#access .left_box h3 { font-size:20px; }
	#access .left_box p .atn { font-size:12px;}
}

/*--------------------------------------------------------------------------------
 *
 * page_access
 *
--------------------------------------------------------------------------------*/
#page_access { 	
	background:url(img/index/bg-003-1.jpg);
	background-repeat:repeat-y;
	background-position:center top;
	background-size:100% auto; }
#page_access iframe { width:100%; height:240px; }
#page_access ul { margin-top:40px;
display:-webkit-box; display:-ms-flexbox; display:flex;
-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;/*中央に配置*/
/*-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;左右に配置*/
/*-webkit-box-align:center;-ms-flex-align:center; align-items:center;上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ gap:24px; }
#page_access li { width:600px; background:#fff; margin-top:20px; padding:20px; box-shadow:0 1px 2px rgba(0,0,0,0.3); border-radius:10px; border:4px solid #47331c; }
#page_access li:nth-child(1) { margin-top:0; }
#page_access li:nth-child(2) { margin-top:0; }
#page_access li:nth-child(odd) {  }
#page_access a { display:block; width:120px; height:110px; background:#e60012; color:#fff; padding:10px 0 0 0; border-radius:10px; box-shadow:0 5px 0 rgba(190,25,55,1); text-align:center; line-height:1.4; }
#page_access a:before { font-family:"Font Awesome 5 Free"; font-weight:900; font-size:40px; content:'\f5a0\A'; white-space:pre; }
#page_access li:nth-child(1) a {  }
#page_access li:nth-child(2) a { background:#fccb00; box-shadow:0 5px 0 rgba(220,180,50,1); }
#page_access li:nth-child(3) a { background:#22ac38; box-shadow:0 5px 0 rgba(40,150,60,1); }
#page_access li:nth-child(4) a { background:#007bc7; box-shadow:0 5px 0 rgba(10,100,160,1); }
#page_access li:nth-child(5) a { background:#e60012; box-shadow:0 5px 0 rgba(190,25,55,1); }
#page_access li:nth-child(6) a { background:#fccb00; box-shadow:0 5px 0 rgba(220,180,50,1); }
#page_access li:nth-child(7) a { background:#22ac38; box-shadow:0 5px 0 rgba(40,150,60,1); }
#page_access .cf { margin-top:20px; }
#page_access .left_box { float:left; }
#page_access .left_box h3 { font-size:24px;line-height:1.5; margin-bottom:8px;}
#page_access .left_box p .atn { font-size:16px;}

@media screen and (max-width:768px){
	#page_access ul { margin-top:24px; gap:0;}
	#page_access li {  width:100% }
	#page_access li:nth-child(2) { margin-top:20px; }
 #page_access li:nth-child(even) { margin-left:0; }
	#page_access a { width:100%; height:auto; margin-top:20px; padding:10px 0; border-radius:10px; box-shadow:0 3px 0 rgba(190,25,55,1); border-radius:30px; }
	#page_access a:before { font-size:14px; content:'\f5a0'; white-space:normal; margin-right:6px; }
	#page_access .cf { margin-top:12px; }
	#page_access .left_box { float:none; }
	#page_access .right_box { float:none; }
	#page_access .left_box h3 { font-size:20px; }
	#page_access .left_box p .atn { font-size:12px;}
	#page_access h2 {	line-height:0.9!important; }
}


/*--------------------------------------------------------------------------------
 *
 * access（下層ページでの表示）
 *
--------------------------------------------------------------------------------*/
.access h3 { margin:0!important; padding:0;  }
.access p { margin:0; padding:0; font-size:12px!important; }
.access .cf { margin-top:10px!important; }
.access .left { margin-right:0px!important; }
.access .right { margin-left:0px!important; }
.access a:before { content:'\f1d8\A'!important; }




/* ------------------------------コンタクトフォーム ------------------------------　*/

article#cta h2 { font-size:50px; text-align:center; line-height:1.2; }
article#cta h2 span { font-size:30px; }
article#cta img.h2_bottom { display:block; margin:20px auto 0 auto; padding:0; }

@media screen and (max-width:768px) {
	article#cta h2 { font-size:30px; }
	article#cta h2 span { font-size:16px; }
	article#cta img.h2_bottom { width:50%; margin-top:10px; }
}

#cta { background:url(img/index/bg02.png); }
#cta .form_box { width:80%; padding:60px 100px 30px 100px; margin:30px auto 0 auto; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,0.3); border-radius:10px; border:4px solid #47331c; }
#cta h3 { border-top:1px solid #333; border-bottom:1px solid #333; padding:5px 0; text-align:center; }
#cta p.center + h3 { margin-top:30px!important; }
#cta p { margin-top:0; }
#cta .tel { font-size:50px; text-align:center; font-weight:bold; letter-spacing:0; line-height:1; margin:20px 0 40px 0; }
#cta .tel small { font-size:16px; }
#cta .tel a { color:#47331c; pointer-events:none; }


#cta h2 span .a-color {
	color:#E61F19;
}
.cta_box_wrap{
	display:flex;
	justify-content:center;
	gap:24px;
	margin:40px auto 0;
}
.cta_box{
	width:50%;
	text-align: center;
	background:#fff;
	border:4px solid #47331c;
	border-radius:10px;
	padding:24px;
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	justify-content:center;
}
.cta_label{
	font-size:28px!important;
line-height:1;
	margin-bottom:20px!important;
}
.cta_number{
	font-size:48px!important;
	line-height:1;
	margin-bottom:20px!important;
	display:flex;
	align-items:center;
	justify-content:center;
}
.cta_number i {
	font-size:0.8em;
}
.cta_note{
	text-align:left;
	line-height:1.5;
}
.cta_btn{
	display:inline-block;
	background:#E61F19;
	color:#fff!important;
	border-radius:999px;
 box-shadow: 0 5px 0 #A31430;
	padding:16px 60px;
	font-size:32px;
	text-decoration:none;
	line-height:0;
}
.cta_note .atn { font-size:16px; }


@media screen and (max-width:768px){
	#cta .form_box { width:100%; padding:30px 20px 30px 20px; margin-top:30px;  }
	#cta .tel { font-size:22px; line-height:1; margin:20px 0 40px 0; }
	#cta .tel small { font-size:12px; }
	#cta .tel a { display:block; background:#e60012; box-shadow: 0 5px 0 rgba(190,25,55,1); color:#fff; pointer-events:auto; padding:20px 0; border-radius:10px }
	#cta .tel .marker { background:none; }
	.cta_box_wrap{
	flex-direction:column;
	gap:20px;
	margin:24px auto 0;
}
.cta_box{
	width:100%;
	padding:20px;
}
.cta_label{
	font-size:20px!important;
	margin-bottom:16px!important;
}
.cta_number{
	font-size:32px!important;
	margin-bottom:16px!important;
}
.cta_btn{
	padding:12px 28px;
	font-size:22px;
}
.cta_note .atn { font-size:12px; }
}

/*--------------------------------------------------------------------------------
 *
 * news
 *
--------------------------------------------------------------------------------*/
#news .inner{
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
	max-width:1000px;
	margin:0 auto;
}

.news_title{
	width:28%;
	text-align:center;
}

.news_title h2 { font-size:36px!important;}

.news_title p{
	font-size:12px;
	letter-spacing:0.3em;
	margin-bottom:12px;
}

.news_title h2{
	font-size:28px;
	color:#40210D;
	margin-bottom:12px;
}

.news_title img{
	width:180px;
	height:auto;
}

.news_list{
	width:68%;
	border-top:1px solid #40210D;
}

.news_list dl{
	display:flex;
	align-items:center;
	border-bottom:1px solid #40210D;
	padding:12px 0;
	margin:0;
}

.news_list dt{
	width:100px;
	color:#40210D;
	text-align:center;
	font-size:16px;
}

.news_list dd{
	display:flex;
	align-items:center;
	gap:18px;
	margin:0;
	flex:1;
}

.news_list dd span{
	background:#40210D;
	color:#fff;
	border-radius:999px;
	padding:4px 28px;
	font-size:14px;
	line-height:1;
}

.news_list dd a{
	color:#40210D;
	text-decoration:none;
	font-size:16px;
}

.news_more{
	text-align:right;
	margin-top:12px!important;
}

.news_more a{
	color:#40210D;
	text-decoration:none;
	font-size:14px;
	display:inline-flex;
	align-items:center;
	gap:4px;
}

.news_more span{
	width:18px;
	height:18px;
	background:#40210D;
	border-radius:50%;
	position:relative;
	display:block;
}

.news_more span::after{
	content:"▶";
	color:#fff;
	font-size:10px;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-45%,-50%);
}

@media screen and (max-width:768px){
	#news .inner{
	flex-direction:column;
	align-items:flex-start;
	max-width:1000px;
	margin:0 auto;
}
.news_title{
	width:100%;
}
.news_title h2 { font-size:34px!important;}
.news_list{
	width:100%;
	margin-top:24px;
}
.news_list dt{
	width:70px;
	font-size:12px;
	text-align:left;
}
.news_list dd span{
	padding:4px 16px;
	font-size:10px;
	white-space:nowrap;
}
.news_list dd a{
	font-size:12px;
	line-height:1.5;
}
.news_more{
	text-align:center;
}
}

ul#notice { 
display:-webkit-box; display:-ms-flexbox; display:flex;
/*-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;中央に配置*/
-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;/*左右に配置*/
/*-webkit-box-align:center;-ms-flex-align:center; align-items:center; 上下中央*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ }
ul#notice > li:nth-child(1) { width:26%; border-top: solid 1px #9d9190; position:relative; }
ul#notice > li:nth-child(2) { width:70%; border-top: solid 1px #9d9190; position:relative; }

ul#notice h2 { font-size:24px; text-align:center; margin-top:20px; }
ul#notice a.link_area { display:block; width:100%; border:1px solid #adadad; color:#404040; text-align:center; padding:10px 10px; letter-spacing:2px; font-size:10px; }
ul#notice a.link_area:before { content:">"; margin-right:10px; }

@media screen and (max-width:768px){
	ul#notice > li:nth-child(1) { width:100%; }
	ul#notice > li:nth-child(2) { width:100%; border:none; }
	ul#notice > li:nth-child(2):before { border:none; }
}

dl.news_line{ width:100%; margin:0; }
dl.news_line dt,dl.news_line dd { height:40px; padding:20px 0 40px 0; border-bottom:1px solid #ccc; letter-spacing:.2em; }
dl.news_line dt { clear:left; float:left; width:31%; font-size:12px; color:#666666; }
dl.news_line dt > a { background:#b39b57; color:#fff; padding:4px 20px; border-radius:3px; margin-right:10px; pointer-events:none; }
dl.news_line dd { margin-left:31%; font-size:12px; }
dl.news_line dd > a { color:#1c1c1c; }
dl.news_line dt:first-child,
dl.news_line dt:first-child + dd { border-top:0; }

@media screen and (max-width:768px){
	dl.news_line dt,dl.news_line dd { height:auto; padding:0; }
	dl.news_line dt { clear:both; float:none; width:100%; font-size:10px; padding:20px 0 10px 0; border-bottom:0; }
	dl.news_line dd { margin-left:0%; border-top:none; padding-bottom:20px; font-size:12px; }
}





/* ------------------------------モーダルウィンドウ------------------------------　*/
.content{ margin:0 auto; }
.modal{ display:none; height:100vh; position:fixed; top:0; width:100%; z-index:9999; }
.modal__bg{ background:rgba(0,0,0,0.8); height:100vh; position:absolute; width:100%; }
.modal__content{ left:50%; position:absolute; top:50%; transform:translate(-50%,-50%); width:700px; height:90vh; overflow:scroll; }
.modal__content a { color:#fff; font-size:14px; }

@media screen and (max-width:768px){
	.modal__content{ width:90%; height:90vh; }
}



/*--------------------------------------------------------------------------------
 *
 * feature
 *
--------------------------------------------------------------------------------*/
.feature_box{
 width:100%;
	margin:0 auto;
	padding:56px;
	background:#fff;
	border-radius:24px;
	box-sizing:border-box;
	box-shadow: 2px 2px 5px 0px #D8C7B2;
}
.feature_box h3{
	text-align:center;
	font-size:40px!important;
}
.feature_box h3 span{
	display:block;
	font-size:18px;
	margin-bottom:8px;
}
.feature_grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:12px 24px;
	margin-top:40px;
 align-items:center;
}
.feature_item img{
	width:100%;
	display:block;
	margin-bottom:16px;
}
#opening .feature_item p{
	font-size:18px;
	line-height:2;
	margin:0;
}
@media screen and (max-width:768px){
.feature_box{
	padding:20px;
		border-radius:18px;
	}
.feature_grid{
	grid-template-columns:1fr;
	margin-top:24px;
}
 .feature_item:nth-child(3){
  grid-row:4;
  }
  .feature_item:nth-child(4){
  grid-row:3;
  }
		.feature_item img{
	margin-bottom:0;
}
.feature_box h3{
	font-size:22px!important;
}
.feature_box h3 span{
	font-size:15px;
}
#opening .feature_item p{
	font-size:14px!important;
}
.feature_item p br {
	display:none;
}

}


/*--------------------------------------------------------------------------------
 *
 * lesson
 *
--------------------------------------------------------------------------------*/
#lesson{
	background:url(img/index/bg02.png);
	text-align:center;
}
#lesson .inner{
	padding:60px 0;
}
#lesson h2{
	text-align:center;
	line-height:1.4;
}
#lesson .h2_bottom{
	display:block;
	margin:16px auto 0;
}
.lesson_photo{
	display:flex;
	justify-content:center;
	gap:24px;
	margin:40px auto;
	max-width:100%;
}
.lesson_photo img{
	width:calc((100% - 16px) / 2);
	height:auto;
	display:block;
}
.lesson_text{
	font-size:16px;
	line-height:2;
	text-align:center;
	margin:0 auto;
}

#lesson .kidsdrum {
	margin-top:40px;
}

@media screen and (max-width:768px){
	#lesson .inner{
		padding:40px 0;
	}
	.lesson_photo{
		flex-direction:column;
		gap:16px;
		margin:24px auto 20px;
	}
	.lesson_photo img{
		width:100%;
	}
	.lesson_text{
		font-size:14px;
		text-align:left;
	}
	.lesson_text br{
		display:none;
	}
}

/*--------------------------------------------------------------------------------
 *
 * piano_course
 *
--------------------------------------------------------------------------------*/
#piano_course{
	background:url(img/index/bg02.png);
	text-align:center;
}
#piano_course .inner{
	padding:60px 0;
}
#piano_course h2{
	text-align:center;
	line-height:1.4;
}
#piano_course .h2_bottom{
	display:block;
	margin:16px auto 40px;
}
.piano_course_list{
	max-width:100%;
	margin:40px 0 0 0;
}
.piano_course_item{
	display:grid;
	grid-template-columns:1fr 1fr;
	align-items:center;
	gap:24px;
	margin-bottom:24px;
}
.piano_course_item:last-child{
	margin-bottom:0;
}
.piano_course_item figure{
	margin:0;
}
.piano_course_item img{
	width:100%;
	display:block;
}
.piano_course_text{
	text-align:left;
}
.piano_course_text h3{
	margin-bottom:12px;
}


@media screen and (max-width:768px){
	#piano_course .inner{
		padding:40px 0;
	}
	.piano_course_list{
	margin:24px 0 0 0;
}
	.piano_course_item{
		display:block;
		margin-bottom:24px;
	}
	.piano_course_text{
	margin-top:8px;;
}
	.piano_course_text h3{
	font-size:20px!important;
	margin-bottom:4px;
}
}


/*--------------------------------------------------------------------------------
 *
 * page_voice
 *
--------------------------------------------------------------------------------*/
#page_voice{
	background:#f8eddf;
}
.page_voice_box{
	max-width:100%;
	margin:0 auto;
	padding:56px;
	background:#fff;
	border-radius:24px;
	box-shadow:2px 2px 5px 0 #D8C7B2;
	box-sizing:border-box;
}
#page_voice h2{
	text-align:center;
	font-size:34px;
	line-height:1.4;
}
#page_voice h2 .small{
	font-size:16px;
}
#page_voice .h2_bottom{
	display:block;
	margin:12px auto 32px;
}
.page_voice_list{
	margin:40px 0 0 0;  
	padding:0;
	list-style:none;
}
.page_voice_list li{
	display:flex;
	align-items:center;
	gap:16px;
	margin-bottom:18px;
}
.page_voice_list li:last-child{
	margin-bottom:0;
}
.page_voice_list figure{
	width:100px;
	margin:0;
	flex-shrink:0;
}
.page_voice_list figure img{
	width:100%;
	display:block;
}
.page_voice_list p{
	flex:1;
	margin:0;
	padding:24px!important;
	border-radius:6px;
	font-size:14px;
	line-height:1.8;
	text-align:left;
	background:#FFF3C8;
	position:relative;
}
.page_voice_list p::before{
	content:"";
	position:absolute;
	left:-12px;
	top:22px;
	width:0;
	height:0;
	border-top:8px solid transparent;
	border-bottom:8px solid transparent;
	border-right:12px solid #FFF3C8;
}
.page_voice_list li:nth-child(even) p{
	background:#DFF1FA;
}
.page_voice_list li:nth-child(even) p::before{
	border-right-color:#DFF1FA;
}

@media screen and (max-width:768px){
	.page_voice_box{
		padding:20px;
		border-radius:18px;
	}
	#page_voice h2{
		font-size:28px;
	}
	.page_voice_list li{
		gap:10px;
		align-items:flex-start;
	}
	.page_voice_list figure{
		width:50px;
	}
	.page_voice_list p{
		font-size:13px;
		padding:14px!important;
	}
}


/*--------------------------------------------------------------------------------
 *
 * teacher
 *
--------------------------------------------------------------------------------*/
#teacher .inner {
	padding:0 0 60px 0!important;
}
#teacher .babyrhythmic {
	padding:60px 0 60px 0!important;
}
.teacher_box{
background:#fff;
border-radius:30px;
padding:56px;
max-width:100%;
margin:0 auto;
box-shadow:2px 2px 5px #D8C7B2;
box-sizing:border-box;
}
#teacher h2{
text-align:center;
}
.teacher_photo{
max-width:500px;
margin:40px auto 24px;
}
.teacher_photo img{
width:100%;
display:block;
}
.teacher_name{
text-align:center;
padding-bottom:20px;
border-bottom:1px dotted #999;
margin-bottom:20px;
}
.teacher_name h3{
font-size:36px!important;
margin:0;
}
.teacher_name span{
font-size:14px;
margin-left:10px;
}
.teacher_profile{
font-size:15px;
line-height:2.2;
text-align:left;
}
.teacher_profile p{
margin-bottom:20px;
}
.teacher_message{
text-align:center;
margin:60px 0 40px;
}
.teacher_message p{
font-size:18px;
margin-bottom:10px;
}
.teacher_message h4{
font-size:28px;
line-height:1.8;
}

@media screen and (max-width:768px){
	#teacher .inner {
	padding:0 0 30px 0!important;
}
#teacher .babyrhythmic {
	padding:30px 0 30px 0!important;
}
.teacher_box{
padding:20px;
border-radius:18px;
}
.teacher_photo{
max-width:100%;
margin:20px auto 20px;
}
.teacher_name h3{
font-size:22px!important;
}
.teacher_name{
padding-bottom:14px;
margin-bottom:14px;
}
.teacher_profile{
font-size:14px;
line-height:2;
}
.teacher_profile br {
display:none;
}
.teacher_message{
margin:40px 0 30px;
}
.teacher_message h4{
font-size:16px;
}
.teacher_bottom br {
display:none;
}
}


/*--------------------------------------------------------------------------------
 *
 * price
 *
--------------------------------------------------------------------------------*/
#price .inner {
	padding:0 0 60px 0!important;
}
.price_box{
max-width:100%;
margin:0 auto;
padding:56px;
background:#fff;
border-radius:30px;
box-shadow:2px 2px 5px #D8C7B2;
box-sizing:border-box;
}
#price h2{
text-align:center;
}
.price_box .h2_bottom{
display:block;
margin:12px auto 40px;
}
.price_table{
max-width:600px;
margin:40px auto 0 auto;
border:1px solid #40210D;
}
.price_head{
background:#FBCB00;
font-size:20px;
font-weight:bold;
padding:14px;
text-align:center;
border-bottom:1px solid #40210D;
}
.price_body{
padding:30px 20px;
text-align:center;
}

.price_fee{
font-size:34px;
font-weight:bold;
margin-bottom:10px;
}
.price_body p{
margin:0;
line-height:1.8;
font-size:22px!important;
}

@media screen and (max-width:768px){
	#price .inner {
	padding:0 0 30px 0!important;
}
.price_box h2 {
	line-height:0.9!important;
}
.price_box{
padding:20px;
border-radius:18px;
}
.price_table{
margin:24px auto 0 auto;
}
.price_body{
padding:20px;
}
.price_body p{
font-size:18px!important;
}
.price_head{
font-size:16px;
}
}


/*--------------------------------------------------------------------------------
 *
 * schedule
 *
--------------------------------------------------------------------------------*/
#schedule .inner {
	padding:0 0 60px 0!important;
}
.schedule_box{
	max-width:100%;
	margin:0 auto;
	padding:56px;
	background:#fff;
	border-radius:30px;
	box-shadow:2px 2px 5px #D8C7B2;
	box-sizing:border-box;
}
#schedule h2{
	text-align:center;
}
.schedule_box .h2_bottom{
	display:block;
	margin:12px auto 40px;
}
.schedule_table{
	max-width:600px;
	margin:40px auto 0 auto;
	border-collapse:collapse;
}
.schedule_table th,
.schedule_table td{
	border:1px solid #40210D;
	padding:20px;
	font-size:18px;
	line-height:1.8;
	background:#fff;
}
.schedule_table th{
	width:90px;
	background:#FBCB00;
	text-align:center;
	font-weight:bold;
	vertical-align:middle;
}
.schedule_table td{
	text-align:left;
}

@media screen and (max-width:768px){
	#schedule .inner {
	padding:0 0 30px 0!important;
}
	.schedule_box{
		padding:20px;
		border-radius:18px;
	}
	.schedule_table{
	margin:24px auto 0 auto;
}
	.schedule_table th,
	.schedule_table td{
		padding:12px;
		font-size:14px;
	}
	.schedule_table th{
		width:64px;
	}
	.schedule_box h2 {
	line-height:0.9!important;
}
}


/*--------------------------------------------------------------------------------
 *
 * info
 *
--------------------------------------------------------------------------------*/
.info { background:#ccc; }
.info p { margin:0; }
.info ul { 
display:-webkit-box; display:-ms-flexbox; display:flex;
-webkit-box-orient:horizontal;-webkit-box-direction:normal; -ms-flex-direction:row; flex-direction:row; /*左から配置*/
-ms-flex-wrap:wrap; flex-wrap:wrap;  }/*折り返す*/
.info li { width:24.25%; margin-right:1%; box-shadow:0 1px 2px rgba(0,0,0,0.3); }
.info li:nth-child(4n+4) { margin-right:0; }

@media screen and (max-width:768px) {
	.info li { width:100%; margin-right:0%; margin-bottom:5%; }
}

/* ------------------------------アコーディオン------------------------------　*/
dl.accordion , .accordion dt, .accordion dd { margin:0; padding:0; }
dl.accordion { margin:20px 0; padding-bottom:20px; }
.accordion dt { display:block; width:100%; height:auto; line-height:1.4; cursor:pointer; margin:0 auto; text-align:center; 
	width:100%; border:2px solid #000; font-weight:bold; padding:20px; text-align:center; }
.accordion dt:after { font-family:"Font Awesome 5 Free"; content:'\f107'; font-weight:900; margin-left:10px }
.accordion dt.close { box-shadow:none }
.accordion dt.close:after { font-family:"Font Awesome 5 Free"; content:'\f106'; font-weight:900; }
.accordion dd { width:100%; height:auto; display:none; margin:0; padding:30px 0 10px 0; }
.accordion dd p { width:100%; color:#000000; }
.accordion dd img { border-radius:20px; }
.accordion br { display:inline; }
.accordion dt,
.accordion dd { font-size:14px; }

@media screen and (max-width:768px){
	dl.accordion { font-size:14px; }
	.accordion dd p { font-size:14px; }
	.accordion dd { padding:30px 00px 10px 0px; }
}




/*--------------------------------------------------------------------------------
 *
 * ３列メニュー
 *
--------------------------------------------------------------------------------*/
ul.box_menu { padding-top:60px; margin-top:2px;
background:url(img/box_menu_bg.png) no-repeat 50% 0,url(img/instagram_bg.png) repeat 0 0;
display:-webkit-box; display:-ms-flexbox; display:flex;
-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;/*中央に配置*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ }
ul.box_menu li { box-shadow:3px 3px 3px rgba(0,0,0,.1); }
ul.box_menu li:nth-child(2) { margin:0 20px; }
ul.box_menu li a { margin:0; padding:0; }

@media screen and (max-width:768px){
	ul.box_menu li { margin:10px 0; }
	ul.box_menu li:nth-child(2) { margin:10px 0 10px 20px; }
}

@media screen and (max-width:660px){
	ul.box_menu li:nth-child(2) { margin:10px 0; }
}



/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * 問い合わせフォーム
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

#contact{
	background:url(img/index/bg02.png);
}

#contact h2{
	text-align:center;
	font-size:34px;
	line-height:1.5;
	margin-bottom:16px;
}

#contact .h2_bottom{
	display:block;
	margin:0 auto 50px;
}

.contact_form_box{
	width:760px;
	max-width:100%;
	margin:40px auto 0 auto;
	background:#fff;
	border:4px solid #47331c;
	border-radius:16px;
	padding:40px;
	box-sizing:border-box;
}

.contact_form_title{
	text-align:center;
	font-size:18px;
	padding:12px 0;
	border-top:1px solid #47331c;
	border-bottom:1px solid #47331c;
	margin-bottom:30px;
	font-weight:bold;
}

dl.form{
	width:100%;
	margin:0;
	display:flex;
	flex-wrap:wrap;
}

dl.form dt,
dl.form dd{
	padding:15px 0;
}

dl.form dt{
	width:33%;
	font-size:14px;
	border-top:1px solid #ccc;
	font-weight:bold;
	line-height:2;
}

dl.form dt:first-child{
	border-top:0;
}

dl.form dd{
	width:calc(100% - 33%);
	border-top:1px solid #ccc;
}

dl.form dt:first-child,
dl.form dt:first-child + dd{
	border-top:0;
}

dl.form span.small{
	font-size:12px;
	font-weight:normal;
	display:block;
	margin-top:8px;
	line-height:1.8;
}

/* ------------------------------プレースホルダー------------------------------ */

input::-webkit-input-placeholder{
	color:#ccc;
	font-size:14px;
}

input:-moz-placeholder{
	color:#ccc;
	font-size:14px;
}

textarea::-webkit-input-placeholder{
	color:#ccc;
	font-size:14px;
}

textarea:-moz-placeholder{
	color:#ccc;
	font-size:14px;
}

/* ------------------------------Contact Form 7------------------------------ */

div.wpcf7{
	display:block;
	width:100%;
	margin:0 auto!important;
	box-shadow:none;
	background:transparent;
}

div.wpcf7 p{
	padding:0;
	margin:0;
	line-height:2;
}

div.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select{
	width:100%;
	border:1px solid #ccc;
	padding:14px;
	font-size:16px;
	border-radius:4px;
	box-sizing:border-box;
}

div.wpcf7 textarea{
	height:215px;
}

div.wpcf7 select{
	height:60px;
}

.wpcf7 input:focus,
.wpcf7 textarea:focus{
	border:1px solid #009de1;
}

.wpcf7-captchac{
	border:1px solid #ccc;
}

/* ------------------------------エラー------------------------------ */

.wpcf7 .wpcf7-not-valid{
	background:#ffb6c1;
}

.wpcf7 span.wpcf7-not-valid-tip{
	font-size:80%;
}

.wpcf7 .wpcf7-response-output{
	margin:10px 0 0;
	padding:8px 35px 8px 14px;
	border-radius:4px;
}

.wpcf7 .wpcf7-validation-errors{
	color:#B94A48;
	background-color:#F2DEDE;
	border:1px solid #EED3D7;
}

.wpcf7 .wpcf7-mail-sent-ok{
	color:#3A87AD;
	background-color:#D9EDF7;
	border:1px solid #BCE8F1;
}


/* ------------------------------必須・任意------------------------------ */

.wpcf7 .required{
	color:#000000;
}

.wpcf7 .any{
	color:#080;
}

.hissu{
	background:#cd4a38;
	color:#ffffff;
	margin:0 0 0 5px;
	padding:3px 7px;
	font-weight:bold;
	border-radius:3px;
	font-size:10px;
}

.nini{
	background:#777777;
	color:#ffffff;
	margin:0 0 0 5px;
	padding:3px 7px;
	font-weight:bold;
	border-radius:3px;
	font-size:10px;
}

/* ------------------------------プライバシー------------------------------ */

.privacy_box{
	height:140px;
	overflow-y:scroll;
	border:1px solid #ccc;
	padding:14px;
	line-height:1.8;
	margin-bottom:12px;
	background:#fff;
}
.privacy_box p {
		font-size:14px!important;
}

/* ------------------------------送信ボタン------------------------------ */

.submit_box{
	margin:40px auto 0;
	width:80%;
}

input[type="submit"]{
	-webkit-appearance:none;
	display:block;
	width:100%;
	height:90px;
	border:none!important;
	border-radius:10px!important;
	color:#fff;
	background:#e60012;
	box-shadow:0 8px 0 #a31430;
	font-weight:bold;
	font-size:22px!important;
	cursor:pointer;
}

input[type="submit"]:hover{
	opacity:.85;
	transition:.3s ease;
}

/* ------------------------------チェックボックス------------------------------ */

input[type=checkbox]{
	display:none;
}

.wpcf7-list-item{
	padding:10px 20px 10px 0;
	margin:0;
}

/* checkboxだけ装飾 */
input[type=checkbox] + .wpcf7-list-item-label{
	position:relative;
	padding:0 0 0 40px;
	top:0;
}

input[type=checkbox] + .wpcf7-list-item-label:hover:after{
	border-color:#00b498;
}

input[type=checkbox] + .wpcf7-list-item-label:after,
input[type=checkbox] + .wpcf7-list-item-label:before{
	position:absolute;
	content:"";
	display:block;
	top:50%;
}

input[type=checkbox] + .wpcf7-list-item-label:after{
	left:0;
	margin-top:-12px;
	width:22px;
	height:22px;
	border:2px solid #ccc;
	border-radius:3px;
}

input[type=checkbox] + .wpcf7-list-item-label:before{
	left:8px;
	margin-top:-5px;
	width:5px;
	height:10px;
	border-right:3px solid #00b498;
	border-bottom:3px solid #00b498;
	transform:rotate(45deg);
	opacity:0;
}

input[type=checkbox]:checked + .wpcf7-list-item-label:before{
	opacity:1;
}

/* radioは標準の丸だけ */
.wpcf7 input[type="radio"]{
	width:auto;
	margin-right:8px;
	transform:scale(1.4);
}

.wpcf7 .wpcf7-radio .wpcf7-list-item-label{
	padding-left:0;
}
/* input[type=checkbox]{
	display:none;
}

.wpcf7-list-item{
	padding:10px 20px 10px 0;
	margin:0;
}

.wpcf7-list-item-label{
	position:relative;
	padding:0 0 0 40px;
	top:0;
}

.wpcf7-list-item-label:hover:after{
	border-color:#00b498;
}

.wpcf7-list-item-label:after,
.wpcf7-list-item-label:before{
	position:absolute;
	content:"";
	display:block;
	top:50%;
}

.wpcf7-list-item-label:after{
	left:0;
	margin-top:-12px;
	width:22px;
	height:22px;
	border:2px solid #ccc;
	border-radius:3px;
}

.wpcf7-list-item-label:before{
	left:8px;
	margin-top:-5px;
	width:5px;
	height:10px;
	border-right:3px solid #00b498;
	border-bottom:3px solid #00b498;
	transform:rotate(45deg);
	opacity:0;
}

input[type=checkbox]:checked + .wpcf7-list-item-label:before{
	opacity:1;
} */

/* ------------------------------レスポンシブ------------------------------ */

@media screen and (max-width:768px){


	#contact h2{
		font-size:26px;
		padding-top:60px;
	}

	.contact_form_box{
		width:100%;
		padding:30px 20px;
		border-radius:16px;
		margin:24px auto 0 auto;
	}

	.contact_form_title{
		font-size:16px;
		margin-bottom:20px;
	}

	dl.form dt,
	dl.form dd{
		padding:0;
	}

	dl.form dt{
		width:100%;
		font-size:12px;
		border-top:1px solid #ccc;
		padding:10px 0 2px;
	}

	dl.form dd{
		width:100%;
		border-top:none;
		padding-bottom:10px;
	}

	div.wpcf7{
		width:100%;
	}

	div.wpcf7 p{
		padding:0;
	}

	input[type="submit"]{
		font-size:16px!important;
		height:80px;
	}

	.submit_box{
		width:100%;
	}

	.wpcf7-list-item{
		display:block;
		padding:12px 0;
	}

	.wpcf7 input[type="date"]{
	background:#fff !important;
}

/* iPhone Safari date input対策 */
.wpcf7-form-control-wrap[data-name="birthday"]{
	display:block;
	width:100%;
	max-width:100%;
	min-width:0;
}

.wpcf7-form-control-wrap[data-name="birthday"] input[type="date"]{
	display:block;
	width:100% !important;
	max-width:100% !important;
	min-width:0 !important;
	box-sizing:border-box !important;
	background:#fff !important;
	-webkit-appearance:none;
	appearance:none;
	height:50px;
}
	
}




/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * フッター
 *
 *
 *
 *
--------------------------------------------------------------------------------*/
footer{
	position:relative;
	width:100%;
	margin:0;
	background:#fff url(img/top_border.png) repeat-x 50% 0;
}

.footer_inner{
	width:800px;
	margin:0 auto;
	padding:45px 0 38px;
	display:flex;
	justify-content:center;
}

.footer_logo{
	width:30%;
	padding:0 24px 0 0;
	display:flex;
	align-items:center;
}

.footer_logo img{
	width:100%;
	display:block;
}

.footer_nav{
	width:200px;
	min-height:142px;
	border-left:1px dotted #40210D;
	padding:0 24px;
	box-sizing:border-box;
}

.footer_nav p{
	width:100%;
	background:#40210D;
	color:#fff;
	font-size:14px;
	line-height:1;
	text-align:center;
	padding:4px 0;
	border-radius:999px;
	margin:0 0 13px;
}

.footer_nav ul{
	padding:0;
	margin:0;
	list-style:none;
}

.footer_nav li{
	font-size:16px;
	line-height:1.9;
	color:#40210D;
}

.footer_nav li a{
	color:#40210D;
	text-decoration:none;
}

.footer_sns{
	width:110px;
	border-left:1px dotted #40210D;
	padding-left:24px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	box-sizing:border-box;
}

.footer_sns img{
	width:100%;
	height:auto;
	display:block;
	margin:0 auto 16px;
}

.footer_sns a{
	display:block;
	background:#D946B0;
	border-radius:4px;
	box-shadow:0 5px 0 #B33B92; 
	color:#fff;
	font-size:14px;
	line-height:1.4;
	padding:8px;
	text-decoration:none;
	margin:0 auto;
}

.footer_bottom{
	background:#F7EDE1;
	text-align:center;
	padding:20px 0;
	font-size:12px;
}

@media screen and (max-width:768px){
	.footer_inner{
		width:100%;
		box-sizing:border-box;
		padding:40px 20px;
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
	}
	.footer_logo{
		width:100%;
		margin:0 auto;
		padding:0;
	}
	.footer_logo img{
	width:90%;
	margin:0 auto;
}
	.footer_nav{
	width:50%;
	margin-bottom:20px;
	padding:12px;
	border:none;
}
.footer_sns{
		width:100%;
	}
	.footer_nav ul{
		width:fit-content;
		margin:0 auto;
		text-align:left;
}
	.footer_nav p{
  width:100%;
		margin:0 auto 12px;
	}
	.footer_nav li a{
	font-size:14px;
}
	.footer_sns img{
		width:30%;
		margin:0 auto 12px;
	}
	.footer_sns {
		padding:0;
		border:none;
	}
	.footer_sns a{
		margin:0 auto;

	}
	.footer_sns a br {
		display:none;
	}

	.footer_bottom{
	font-size:10px;
}
}

/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 * その他（jQuery、文字装飾なと）
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

/* ------------------------------ページトップへ戻る------------------------------　*/
#pageTop { position:fixed; bottom:20px; right:20px;}
#pageTop a { display:block; z-index:999; margin:0; padding:0; width:60px; height:60px; background:url(img/top.png) no-repeat 0 0; }
#pageTop a:hover { text-decoration:none; opacity:0.7; }
@media screen and (max-width:768px){
	#pageTop , #pageTop a { display:none; }
}

/* ------------------------------グローバルナビ上部固定------------------------------　*/
.fixed { position:fixed; top:0; width:100%; z-index:10000; }
@media screen and (max-width:768px){
.fixed { position:static; }
}

/* ------------------------------フェードインアニメーション------------------------------　*/
.sa {opacity: 0; transition: all .5s ease; } /* ノーマル */
.sa.show {opacity: 1; transform: none; } /* ノーマル */
.sa-lr {transform: translate(-100px, 0); } /* 右から */
.sa-rl {transform: translate(100px, 0); } /* 左から */
.sa-up {transform: translate(0, 100px); } /* 下から */
.sa-down {transform: translate(0, -100px); } /* 上から */
.sa-scaleUp {transform: scale(.5); } /* 縮小→拡大 */
.sa-scaleDown {transform: scale(1.5); } /* 拡大→縮小 */
.sa-rotateL {transform: rotate(180deg); } /* 左回転 */
.sa-rotateR {transform: rotate(-180deg); } /* 右回転 */

/* ------------------------------ふわふわ------------------------------　*/
@keyframes horizontal {
    0% { transform:translateX( -5px); }
  100% { transform:translateX(  0px); }
}
@keyframes vertical {
    0% { transform:translateY(-5px); }
  100% { transform:translateY(  0px); }
}
img.huwahuwa { animation: horizontal 2s ease-in-out infinite alternate; }
img.huwahuwa { animation: vertical 2s ease-in-out infinite alternate; }
img.huwa01 { animation-duration: 1.1s}
img.huwa02 { animation-duration: 1.3s}
img.huwa03 { animation-duration: 1.5s}

/* ------------------------------吹き出しを作る------------------------------　*/
.balloon { margin:20px 0; padding-top:20px; position:relative; }
.balloon:before,.balloon:after { clear:both; content: ""; display: block; }
.balloon figure { width:100px; height:100px; margin:0; padding:0; }
.balloon-image-left {float:left; margin-right:20px; margin-left:0; }
.balloon-image-right {float:right; margin-left:20px; }
.balloon figure img { width:100%; height:100%; border-radius:50%; border:solid 3px #ffe2e9; }
.balloon-image-description { padding:0; margin-top:0; font-size:12px; text-align:center; }

.balloon-text-right,
.balloon-text-left { position:relative; padding:15px; border-radius:10px; max-width: -webkit-calc(100% - 110px); max-width: calc(100% - 110px); display:inline-block; background:#ffffff; }
.balloon-text-right { float:left; margin-left:10px; background:#ffe2e9;}
.balloon-text-left { float:right; margin-right:10px; background:#fff; border:2px solid #ffe2e9; }
.balloon-text-left p {  }

.balloon p { margin:0; padding:0; font-size:16px; }
.balloon p:last-child { margin-bottom:0; }
/* 三角部分 */
.balloon-text-right:before {position:absolute; content: ''; border:10px solid transparent; border-right:10px solid #ffe2e9; top:15px; left:-20px; }
.balloon-text-right:after {position:absolute; content: ''; border:10px solid transparent; border-right:10px solid #ffe2e9; top: 15px; left:-19px; }
.balloon-text-left:before {position:absolute; content: ''; border:10px solid transparent; border-left:10px solid #ffe2e9; top: 15px; right:-20px; }
.balloon-text-left:after {position:absolute; content: ''; border:10px solid transparent; border-left:10px solid #fff; top:15px; right:-17px; }

@media screen and (max-width:768px){
	.balloon { margin:0 0 30px 0; }
	.balloon figure { width:60px; height:60px; }
	.balloon figure img { border:3px solid #f5f5f5; }
	.balloon-text-right,.balloon-text-left { max-width: -webkit-calc(100% - 70px); max-width: calc(100% - 70px); }
	.balloon p { font-size:12px; }
}

/* ------------------------------内心------------------------------　*/
.mind {
    position: relative;
    width: 90%;
    margin: 2em 0 2em 40px;
    padding: 20px;
    border-radius: 30px;
    background: #bce59f;
}

.mind:before {
    position: absolute;
    bottom: 0;
    left: -40px;
    color: #bce59f;
    font-family: FontAwesome;
    font-size: 15px;
    content: "\f111";
}
.mind:after {
    position: absolute;
    bottom: 0;
    left: -23px;
    color: #bce59f;
    font-family: FontAwesome;
    font-size: 23px;
    content: "\f111";
}




/*--------------------------------------------------------------------------------
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *  記事ページ
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
 *
--------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------
 *
 * ブログ一覧ページ(トップページ)
 *
--------------------------------------------------------------------------------*/
#blog_top_container { width:1000px; margin:0 auto; padding:60px 0 60px 0; }

@media screen and (max-width:768px) {
	#blog_top_container { width:90%; }
	#blog_top_container article section { width:100%; padding-top:0px; float:none; }
	#blog_top_container article h2 { width:100%; max-width:320px; margin:0 auto 10px auto; padding:10px; font-size:12px; }
}

aside#blog { width:31%; float:right; }
aside#blog .inner { background:#fff url(img/common/aside_bg.jpg) no-repeat 50% 0; box-shadow:0 1px 2px rgba(0,0,0,0.3); padding:60px 40px 40px 40px; }
aside#blog img { border-radius:60px; margin:0 auto; display:block; }
aside#blog h3 { font-size:20px; margin:0; padding:20px 0; text-align:center; }
aside#blog p { font-size:12px; margin:0; }
aside#blog p.name { font-size:20px; text-align:center; }
@media screen and (max-width:768px) {
	aside#blog { width:100%; max-width:320px; float:none; margin:4% auto 0 auto; }
}

/* ------------------------------新着情報（トップページ）------------------------------　*/
ul.post { display:-webkit-box; display:-ms-flexbox; display:flex;
-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;/*中央に配置*/
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ }
ul.post li { width:31%; margin-bottom:4%; padding:0 0 20px 0; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,0.3); }
ul.post li:nth-child(3n+2) { margin:0 3.5% 4% 3.5%; }
ul.post li p { font-size:12px; margin:0; padding:0 20px; color:#7b7b7b; }
ul.post img { width:100%; height:200px; object-fit:cover; object-position:50% 0; margin:0 auto 15px auto; padding:0;
font-family: 'object-fit:cover; object-position:50% 0;';/*ie対応*/  }
ul.post li h3 { font-size:20px; font-weight:bold; padding:10px 20px; margin:0; }
ul.post li h3 a { color:#7b7b7b; }

@media screen and (max-width:768px){
	ul.post {
		padding-top:40px;
	}
	ul.post li { width:100%; max-width:320px; margin:10px 0; padding:0 0 20px 0; }
	ul.post li:nth-child(3n+2) { margin:10px 0px 10px 20px; }
}
@media screen and (max-width:660px){
	ul.post li:nth-child(3n+2) { margin:10px 0; }
}

/*---ガテゴリーを画像の上に---*/
.relative { position:relative; }
.relative ul.post-categories { margin:0; padding:0; list-style:none; position:absolute; bottom:10px; left:20px;}
.relative ul.post-categories li { position:relative; display:inline-block; width:auto; height:30px; line-height:30px; margin:0; padding:0 1em; background-color:#333; border-radius:30px; color:#fff; text-decoration:none; -webkit-transition:.2s; transition:.2s; list-style:none; box-shadow:0 1px 2px rgba(0,0,0,0.3); }
.relative ul.post-categories li a { display:block; max-width:300px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:10px; color:#fff; }



/* ------------------------------新着情報（トップページ）------------------------------　*/
ul.post02 {
display:-webkit-box; display:-ms-flexbox; display:flex;
-ms-flex-wrap:wrap; flex-wrap:wrap; /*折り返す*/ }
ul.post02 li { width:46.7%; max-width:320px; margin-bottom:6%; padding:0 0 20px 0; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,0.3); }
ul.post02 li:nth-child(2n+2) { margin:0 0 6% 5.5%; }
ul.post02 li p { font-size:12px; margin:0; padding:0 20px; color:#7b7b7b; }
ul.post02 img { width:100%; height:200px; object-fit:cover; margin:0 auto 15px auto; padding:0;
font-family: 'object-fit:cover; object-position:50% 0;';/*ie対応*/  }
ul.post02 li h3 { font-size:20px; font-weight:bold; padding:10px 20px; margin:0; }
ul.post02 li h3 a { color:#7b7b7b; }

@media screen and (max-width:768px){
	ul.post02 { -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;/*中央に配置*/ }
	ul.post02 li { width:100%; max-width:320px; margin:10px 0; padding:0 0 20px 0; }
	ul.post02 li:nth-child(3n+2) { margin:10px 0px 10px 20px; }
}
@media screen and (max-width:660px){
	ul.post02 li:nth-child(3n+2) { margin:10px 0; }
}

/* ------------------------------ページャー------------------------------　*/
#pagenation{text-align:center; margin-top:30px;}
#pagenation #pagenation-list{display:inline-block;}#pagenation:after{content:".";display:block;clear:both;height:0;visibility:hidden;}#pagenation #pagenation-list li{float:left;background:none;list-style:none;padding:0;margin:0 5px 5px 0;}#pagenation #pagenation-list li:last-child{margin-left:0;}#pagenation #pagenation-list a,#pagenation #pagenation-list span{background:none;display:block;margin:0;padding:4px 9px;font-size:12px;line-height:1.5;text-align:center;}#pagenation #pagenation-list .current{background:#DEDEDE;color:#696969;border:1px solid #E3E3E3;}#pagenation #pagenation-list .omit{padding:4px 2px;color:#777777;}#pagenation #pagenation-list li a{color:#333333;border:1px solid #6B6B6B;text-decoration:none;}#pagenation #pagenation-list a:hover{background:#F0F0F0;color:#000000;border:1px solid #121212;text-decoration:none;}

/*--------------------------------------------------------------------------------
 *
 * 記事ページ
 *
--------------------------------------------------------------------------------*/
#blog_single_container { width:1000px; margin:0 auto; padding:30px 0 60px 0; }
@media screen and (max-width:1000px) {
	#blog_single_container { width:100%; padding:50px 0 30px 0; }
}

#blog_single_container section { width:100%; background:#fff; padding:40px 100px; box-shadow:0 1px 2px rgba(0,0,0,0.3); }
@media screen and (max-width:768px){
	#blog_single_container section { width:100%; float:none; padding:40px 20px; }
}

#blog_single_container h1 { font-size:26px; font-weight:bold; padding:10px 0; margin:0; color:#7b7b7b; text-align:center; }
#blog_single_container h2 { font-size:26px; background:#f7f7f7; margin-top:40px; padding:30px; color: #333;border-left:9px solid #333; line-height: 40px; }
#blog_single_container h3 { font-size:20px; letter-spacing:1.6px; margin-top:40px; padding: 0px 15px 0px;border-left: 6px solid #333;}
#blog_single_container h4 { font-size:16px; letter-spacing:1.6px; margin-top:40px; }
#blog_single_container p.ymd { font-size:12px; color:#7b7b7b; text-align:center; margin:0; }
#blog_single_container p.ymd a { color:#4773BA; }
#blog_single_container img.attachment-thumb768 { width:100%; margin:40px auto; }
#blog_single_container img.attachment-thumb1200 { width:100%; margin:40px auto; }

@media screen and (max-width:768px){
	#blog_single_container h1 { font-size:18px; }
	#blog_single_container h2 { font-size:18px; padding:20px 20px; }
	#blog_single_container h3 { font-size:18px; }
}

p.point { font-weight:bold; }
p.point:before { font-family:"Font Awesome 5 Free"; content:'\f00c'; font-weight:900; margin-right:6px; color:#c0b288; }
@media screen and (max-width:768px){
	p.point {  }
}

.content ul { background-color:#f7f7f7; border:dashed 1px #333; padding:20px 20px; margin:2em 0; }
.content ul li { margin-top:10px; }
.content ul li:first-child { margin-top:0; }
.content ul li:before { content: "●"; margin-right:10px; }

.content ol { background-color:#f7f7f7; border:dashed 1px #333; padding:20px 20px 20px 30px; margin:2em 0; list-style-type:decimal; }
.content ol li { margin-top:10px; }
.content ol li:first-child { margin-top:0; }

/* ------------------------------関連記事一覧------------------------------　*/
p.kanren { font-size:14px; margin:40px 0 0 0; padding:0; font-weight:bold; }
ul.related { margin:0; }
ul.related li { border-bottom:1px dotted #cccccc; padding:20px 0; }
ul.related img { display:block; width:100px; height:100px; float:left; margin:0 20px 0 0; padding:0; }
ul.related a { font-size:10px; font-weight:normal; }
ul.related p { margin:0; padding:0; font-size:10px; }
ul.related p.title a { font-size:14px; }




/* ------------------------------ページ下部固定CTA_PC------------------------------　*/
#buttonPc { position:fixed; bottom:0; background:#800000; width:100%; height:auto; z-index:1000; }
#buttonPc a { display:block; width:100%; height:auto; color:#ffffff; padding:10px 0; text-align:center; font-size:16px; text-shadow:1px 1px 0 rgba(0,0,0,0.2) }
#buttonPc a:hover { text-decoration:none }
#buttonPc i { padding-right:5px; }

@media screen and (max-width:768px){
	#buttonPc,
	#buttonPc a {  }
}

/* ------------------------------カルーセルスライダーカスタマイズ ------------------------------　*/
.slick-next { right:0 !important; }
.slick-prev { left:0 !important; }
.slick-prev:before, .slick-next:before { opacity:.5!important; color:#333!important; }

/* ------------------------------カウントダウンタイマー ------------------------------　*/
.cdt_wrapper { text-align:center; background:#fff; color:#333; margin:0; padding:10px; }
.cdt_wrapper + p { margin:0; }
@media screen and (max-width:768px){
	.cdt_wrapper { font-size:12px; }
}
/* ------------------------------トップへ戻る------------------------------　*/
#page_top{width: 60px; height: 60px; position: fixed; right: 30px; bottom: 30px; background: #c5b88f; opacity: 0.8; border-radius: 50%; z-index:9999; }
#page_top a{position: relative; display: block; width: 60px; height: 60px; text-decoration: none; }
#page_top a::before{ content: url(img/arrow.svg); font-size: 20px; color: #fff; position: absolute; width: 20px; height: 20px; top: -40px; bottom: 0; right: 0; left: 0; margin: auto; text-align: center; }
#page_top a::after{content: 'Top'; font-size: 13px; color: #fff; position: absolute; top: 30px; bottom: 0; right: 0; left: 0; margin: auto; text-align: center; }
@media screen and (max-width:768px){
	#page_top{ width:40px; height:40px; right:10px; bottom:10px; }
	#page_top a{ width:40px; height:40px; }
	#page_top a::before{ top:-25px; }
	#page_top a::after{content: ''; }
}

/* ------------------------------バナーエリア------------------------------　*/
#bana { background-color:#f6ecdf; padding:0!important; }
#bana .inner {  padding:50px 0 0 0!important; }
#bana ul { display:flex; justify-content:center; flex-wrap:wrap; /*折り返す*/}
#bana ul li { max-width:400px; margin:0 10px; }
@media screen and (max-width:768px){
	#bana { padding:20px 0 0 0!important; }
	#bana .inner {  padding:0 0 0 0!important; }
	#bana ul li { margin:10px 0 ; }
}