@charset "UTF-8";

body {
	font-family: "Hiragino Sans" , "Hiragino Kaku Gothic ProN" , "ヒラギノ角ゴ Pro W3" , メイリオ , Meiryo , "ＭＳ Ｐゴシック" , sans-serif;
}

/* =============================================================
共通設定
================================================================ */
/*汎用class*/
.pc { display: block; }
.sp { display: none; }
.mt50 { margin-top: 50px; }
.cat1 { background: #00C29E; }/*講師*/
.cat2 { background: #A82D6E; }/*インストラクター*/

/*.rowの代わりにflexを使用する*/
.flex {
	display: flex;
	flex-wrap: wrap;
	margin-left: -15px;
	margin-right: -15px;
}

/*左右padding 15pxを打ち消す*/
.container.resetPadding{
	overflow: hidden;/*横幅320pxで横スクロールバーが出るのを解消*/
	padding-left: 0;
	padding-right: 0;
}

/*見出し*/
.lessonHeader h1, .lessonWrapper h1,
.lessonHeader h2, .lessonWrapper h2,
.lessonHeader h3, .lessonWrapper h3,
.lessonHeader h4, .lessonWrapper h4,
.lessonHeader h5, .lessonWrapper h5,
.lessonHeader h6, .lessonWrapper h6{
	color: #000;
}

/*全体*/
.lessonHeader, .lessonWrapper{
	color: #000;
}

/* iOSでのデフォルトスタイルをリセット */
.lessonWrapper input[type="text"],
.lessonWrapper input[type="email"],
.lessonWrapper select,
.lessonWrapper textarea{
	-webkit-appearance: none;
	border-radius: 0;
	font-size: 16px;
}
.lessonWrapper input[type="submit"],
.lessonWrapper input[type="button"] {
	-webkit-appearance : none;
	-webkit-appearance: button;
	appearance: button;
	border: none;
	-webkit-box-sizing: content-box;
	box-sizing: border-box;
	cursor: pointer;
	border-radius: 0;
	font-size: 16px;
}
.lessonWrapper input[type="submit"]::-webkit-search-decoration,
.lessonWrapper input[type="button"]::-webkit-search-decoration {
	display: none;
}
.lessonWrapper input[type="submit"]::focus,
.lessonWrapper input[type="button"]::focus {
	outline-offset: -2px;
}

/* =============================================================
ボタンリンク設定
================================================================ */

/* カラー設定
---------------------------------------------------------------- */
/*btn-default*/
body.oll .btn.btn-default{
	background-color: #CAE7EA;
	color: #000;
}
body.oll .btn.btn-default:hover,
body.oll .btn.btn-default:active,
body.oll .btn.btn-default:focus{
	background-color: #00AFE1;
	color: #FFF;
}
/*btn-action*/
body.oll .btn.btn-action{
	background-color: #8880FF;
	color: #FFF;
}
body.oll .btn.btn-action:hover,
body.oll .btn.btn-action:active,
body.oll .btn.btn-action:focus{
	background-color: #EE7800;
	color: #FFF;
}
/*btn-submit*/
body.oll .btn.btn-submit{
	background-color: #00AFE1;
	color: #FFF;
}
body.oll .btn.btn-submit:hover,
body.oll .btn.btn-submit:active,
body.oll .btn.btn-submit:focus{
	background-color: #8880FF;
	color: #FFF;
}

/*トップページ「体験レッスンを申し込む」
---------------------------------------------------------------- */

a.p-top-action--button {
	display: block;
	max-width: 500px;
	background: #8880FF;
	color: #fff;
	font-size: 180%;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	box-shadow: 5px 5px 0 rgba(34, 34, 34, 0.15);
	margin: auto;
	padding:20px 10px;
}
a.p-top-action--button:hover,
a.p-top-action--button:focus {
	background: #ee7800;
	color: #FFF;
	transition: .2s;
}
a.p-top-action--button span{
	display: inline-block;
}
a.p-top-action--button small{
	font-size: 75%;
	vertical-align: middle;
	margin-left: -.3em;
	margin-right: -.3em;
}
/*直後の料金表示*/
a.p-top-action--button + p.note{
	font-size: 87%;
	margin-top: 20px;
}

/*指導者ページ「この指導者でオンライン体験レッスンを申し込む」
---------------------------------------------------------------- */
a.p-teacher-action--button {
	display: block;
	background: #8880FF;
	color: #fff;
	font-size: 156%;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	box-shadow: 5px 5px 0 rgba(34, 34, 34, 0.15);
	padding: 20px 10px;
	margin: auto;
}
a.p-teacher-action--button:hover,
a.p-teacher-action--button:focus {
	color: #FFF;
	background: #ee7800;
	transition: .2s;
}
a.p-teacher-action--button span{
	display: inline-block;
}
a.p-teacher-action--button small{
	font-size: 75%;
	vertical-align: middle;
	margin-left: -.3em;
	margin-right: -.3em;
}
/*直後の料金表示・注意書き*/
a.p-teacher-action--button + p.note,
a.p-teacher-action--button + ul.notes{
	font-size: 87%;
	margin-top: 20px;
}

/* =============================================================
テキストリンク設定
================================================================ */
/*テキストリンク用ブロック要素*/
.txtLink{
	line-height: 1.3;
	text-align: center;
	margin-top: 30px;
}
/*リンク設定*/
.txtLink a{
	color: #000;
	border-bottom:1px solid #000;
}

/* =============================================================
ヘッダー：音楽教室ヘッダー
================================================================ */
/*全体*/
body.oll .lessonHeader{
	background-color: #00AFE1;
}
@media screen and (max-width: 639px){
	body.oll .lessonHeader{
		border-top: 4px solid #8880FF;
	}
}
/* タイトル（島村楽器のオンラインレッスン）
---------------------------------------------------------------- */
body.oll .lessonNavBar > h1{
	text-align: center;
}
body.oll .lessonNavBar > h1 a{
	padding-left: 0;
}

/* メニュー開閉ボタン
---------------------------------------------------------------- */
@media screen and (max-width: 639px){
	body.oll .lessonHeader .lessonNavBtn p{
		background-color: #C7F8FF;
	}
	body.oll .lessonNavBar .lessonNavBtn p svg{
		fill: #00AFE1;
	}
}

/* メニュー本体
---------------------------------------------------------------- */
/*全体*/
body.oll nav.lessonNavMenu{
	background: rgba( var(--vivid-green-rgb), .98);
}
/*リンク設定-メイン*/
body.oll nav.lessonNavMenu > ul > li > a,
body.oll nav.lessonNavMenu > ul > li.hasSubMenu > p{
	border-bottom: 1px solid #8880FF;
}

/*=========================================================
メインセクション
===========================================================*/
main.l-main {
}

/*404ページ*/
body.notFound main.l-main,
main.l-main.simple{
	max-width: 900px;
	padding: 50px 15px;
	margin: 0 auto;
}
body.notFound main.l-main h2,
main.l-main.simple h2{
	font-weight: bold;
	text-align: center;
	margin-bottom: 2em;
}
body.notFound main.l-main p,
main.l-main.simple p{
	text-align: center;
	margin-bottom: 1em;
}

/*=========================================================
トップページ
===========================================================*/
/*各セクションのコンテナ
------------------------------ */
.p-top-container {
	padding: 150px 0 200px 0;
	margin: 0 auto;
	max-width: 1400px;
	background-origin: padding-box;
}
.p-top-container:first-child {
	max-width: 100%;
	position: relative;
}
.p-top-container:last-child {
	padding-bottom: 100px;
}
.p-top-container:nth-child(even) {
	padding: 0 0 100px 0;
	background-image: url(/lesson/online/img/bg-plan-pc.png);
	position: relative;
	max-width: 100%;
	background-repeat: no-repeat;
}

/*キャンペーンテキスト
------------------------------ */
p.cp-text {
	color: #EE7800;
	font-size: 125%;
	font-weight: bold;
	line-height: 1;
	text-align: center;
	margin-bottom: 20px;
}
p.cp-text span.lg {
	display: block;
	font-size: 180%;
	line-height: 1.2;
}
p.cp-text a{
	color: #EE7800;
	display: inline-block;
	text-decoration: underline;
}
p.cp-text a:hover,
p.cp-text a:focus{
	transition: .1s;
	opacity: .8;
	text-decoration: none;
}
p.cp-text a:after {
	display: inline-block;
	content: '\f101';
	font-family: FontAwesome;
	margin-left: .3em;
}

/* ヘッダー内キャンペーン
------------------------------ */
.p-top-home__action {
	position: absolute;
	bottom: 50px;
	width: 100%;
	text-align: center;
	z-index: 300;
}
.p-top-home__action p,
.p-top-home__action p a{
	color: #FFF;
	font-weight: bold;
	text-shadow: 0 3px 6px #000;
}
.p-top-home__action p.cp-text a{
	text-decoration: none;
}

/*ヘッダー外キャンペーン
------------------------------ */
/*全体*/
.p-top-action{
	text-align: center;
	margin-top: 150px;
}

/*コンセプトメッセージ
------------------------------ */
/*文章*/
.mainView p{
	text-align: center;
	font-size: 20px;
	line-height: 2.75;
	letter-spacing: 0.1em;
	max-width: 1000px;
	margin: auto;
	font-weight: bold;
}

/*共通要素（point・Step）
------------------------------ */
/*見出し部分全体*/
.p-top-lead {
	position: relative;
	text-align: center;
	margin-bottom: 50px;
	padding-bottom: 40px;
}
/*見出し（例：what we do）*/
h2.p-top-lead__heading {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 568%;
	font-weight: bold;
	font-style: italic;
	margin-bottom: 30px;
	line-height: 1;
}
/*リード文（例：私たちができること）*/
p.p-top-lead__description {
	font-size: 200%;
	line-height: 2rem;
}
/* テキスト */
p.c-text {
	line-height: 1.81;
}

/* campaign
------------------------------ */
.p-top-campaign {
	margin-bottom: 240px;
	text-align: center;
}
/*単体バナー*/
.p-top-campaign__banner{
	max-width: 860px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 auto;
}
/*季節のキャンペーンバナー(ul)*/
.p-top-campaign__list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	list-style-type: none;
}
.p-top-campaign__list li a {
	position: relative;
	display: block;
	max-width: 400px;
}
.p-top-campaign__list li a::after{
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	background-color: #FFF;
	opacity: 0;
	transition: .2s;
}
.p-top-campaign__list li a:focus::after,
.p-top-campaign__list li a:hover::after{
	opacity: 0.5;
}

@media screen and (max-width: 859px) {
	.p-top-campaign {
		margin-left: 4%;
		margin-right: 4%;
		margin-bottom: 90px;
	}
	.p-top-campaign__banner{
		display: block;
	}
/*	.p-top-campaign__img {
		width: 100%;
		margin-bottom: 20px;
	}*/
}

/*体験レッスンに関するお知らせ
------------------------------ */
.trial_info {
	margin: 20px auto 0;
	padding: 23px;
	background: #dedede;
	width: 56%;
}
.trial_info h2 {
	text-align: center;
	font-weight: bold;
	margin: 0 0 10px;
	font-size: 17px;
}
.trial_info h3 {
	text-align: left;
	font-weight: normal;
	font-size: 16px;
}
.trial_info strong {
	color: brown;
	font-weight:bold;
}
.trial_info p {
	margin-top: 5px;
	font-size:0.8em;
}

@media screen and (max-width: 767px) {
	.trial_info {
		width: 90%;
	}
}

/* point
------------------------------ */
/*全体*/
.p-top-point__box {
	max-width: 1400px;
	margin: 0 auto;
}
@media screen and (min-width: 1201px){
	/*各ポイント全体（イメージ画像＋文章）*/
	.p-top-point__contents {
		display: flex;
		margin-top: 200px;
		margin-left: 50px;
		margin-right: 50px;
	}
	.p-top-point__contents:first-child {
		margin-top: 0;
	}
	.p-top-point__contents:nth-child(2) {
		margin-right: 50px;
		flex-direction: row-reverse;
	}
	/*各ポイント：文章全体*/
	.p-top-point__text {
		margin: 0 0 0 50px;
	}
	.p-top-point__contents:nth-child(2) .p-top-point__text {
		margin: 0 50px 0 0;
	}
	/*各ポイント：見出し部分*/
	.p-top-subheading {
		display: flex;
		margin-bottom: 50px;
	}
	.p-top-subheading img{
		height: 80px;
	}
	.p-top-subheading h3 {
		font-size: 187%;
		margin-left: 20px;
	}
	.p-top-subheading h3 span{
		display: inline-block;
	}
	/*各ポイントイメージ画像*/
	img.p-top-point__img {
		max-width: 650px;
		height: 325px;
		object-fit: cover;
	}
}
@media screen and (max-width: 1200px){
	/*各ポイント全体（イメージ画像＋文章）*/
	.p-top-point__contents {
		display: block;
		max-width: 700px;
		margin: 50px auto 0;
	}
	/*各ポイント：文章全体*/
	.p-top-point__text {
		margin: 20px 0;
		width: 100%;
	}
	/*各ポイント：見出し部分*/
	.p-top-subheading {
		display: flex;
		align-items: center;
		min-height: 60px;
		margin-bottom: 20px;
	}
	.p-top-subheading img {
		width: 60px;
		height: 60px;
	}
	.p-top-subheading h3 {
		font-size: 150%;
		font-weight: bold;
		line-height: 1.9;
		margin-left: 10px;
	}
	/*各ポイントイメージ画像*/
	img.p-top-point__img {
		width: 100%;
		height: auto;
	}
}

/* step
------------------------------ */
/*リスト本体*/
ul.p-top-step__container {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	text-align: center;
	margin: 0 4%;
}
/*各ステップ*/
li.p-top-step__contents {
	position: relative;
	border: 1px solid #000;
	/*width: 32%;*/
	padding: 20px;
}
li.p-top-step__contents:nth-child(n + 4) {
	/*margin-top: 30px;*/
}
@media screen and (min-width: 1201px){
	li.p-top-step__contents {
		width: 32%;
	}
	li.p-top-step__contents:nth-child(n + 4) {
		margin-top: 30px;
	}
}
@media screen and (max-width: 1200px){
	li.p-top-step__contents {
		width: 49%;
	}
	li.p-top-step__contents:nth-child(n + 3) {
		margin-top: 30px;
	}
}
/*各ステップの画像（例：STEP1）*/
img.p-top-step__number {
	position: absolute;
	left: 0;
	top:0;
	width: 70px;
}
/*各ステップのイラスト画像*/
img.p-top-step__img {
	margin: 20px 0 20px;
}
/*ステップごとの見出し（例：体験レッスンに申し込む）*/
h3.p-top-step__subheading {
	text-align: center;
	font-size: 150%;
	font-weight: bold;
	margin-bottom: 20px;
	line-height: 1.4;
}
@media screen and (max-width: 1200px){
	h3.p-top-step__subheading {
		font-size: 125%;
	}
}

/*2つのレッスン
------------------------------ */
/*見出し*/
h2.p-top-price__heading {
	position: relative;
	top: -1em;
	background: #fff;
	color: #000;
	max-width: 580px;
	font-size: 40px;
	font-weight: 600;
	line-height: 1;
	border: 2px solid #000;
	text-align: center;
	margin: 0 auto 1.25em;
	padding-top: .5em;
	padding-bottom: .5em;
}
h2.p-top-price__heading span {
	font-size: 130%;
}
/*スクール・サロンのコンテナ*/
.p-top-price__container {
	max-width: 1400px;
	margin: auto;
	display: flex;
	justify-content: space-between;
}
/*見出し*/
.p-top-price__container h3 {
	font-weight: bold;
	text-align: center;
}
.p-top-price__container h3 span:first-of-type{
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 412%;
	font-style: italic;
	line-height: 0.7;
}
.p-top-price__container h3 span:last-of-type{
	font-size: 23px;
}
/*スクール側*/
.p-top-price__school {
	width: 48%;
}
/*サロン側*/
.p-top-price__salon {
	width: 48%;
}
.p-top-price__salon h3 span:first-of-type{
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 412%;
	font-style: italic;
	line-height: 0.7;
}
.p-top-price__salon h3 span:last-of-type{
	font-size: 23px;
}
/*◯◯の方におすすめ*/
.p-top-price__recommend {
	text-align: center;
	padding-top: 60px;
	height: 160px;
}
.p-top-price__recommend p{
	font-size: 125%;
}
.p-top-price__recommend p.note{
	font-size: 75%;
	margin-top: 1em;
}

/*料金リスト
------------------------------ */
/*リスト全体*/
ul.p-top-price__list {
	display: flex;
	justify-content: space-between;
	max-width: 700px;
	margin: 0 auto;
}
/*各項目*/
.p-top-price__school li.p-top-price__item { border: 1px solid #00C29E; }/*スクール*/
.p-top-price__salon li.p-top-price__item { border: 1px solid #A82D6E; }/*サロン*/
/*各項目の見出し*/
p.p-top-price__item--header {
	font-size: 125%;
	font-weight: 600;
	width: 320px;
	height: 4.5em;
	line-height: 1.3;
	text-align: center;
	padding: .75em;
}
.p-top-price__school p.p-top-price__item--header {/*スクール*/
	background: #00C29E;
	color: #fff;
}
.p-top-price__salon p.p-top-price__item--header {/*サロン*/
	background:#A82D6E;
	color: #fff;
	line-height: 3em;
}
p.p-top-price__item--header span.lgTxt{ font-size: 150%; }
p.p-top-price__item--header span.smTxt{ font-size: 75%; }
/*月額費用*/
p.p-top-price__item--cost {
	background: #fff;
	font-size: 187%;
	text-align: center;
	line-height: 1;
	padding-top: 20px;
}
p.p-top-price__item--cost span.lgTxt{ font-size: 150%; }
p.p-top-price__item--cost span.smTxt{ font-size: 50%; }
/*金額詳細*/
.p-top-price__detail {
	background: #fff;
	padding: 20px;
}
.p-top-price__detail div {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top: 1px solid #CDD6DD;
	padding: 10px 5px;
}
.p-top-price__detail div:last-child {
	border-bottom: 1px solid #CDD6DD;
}
.p-top-price__school .p-top-price__detail div { padding: 22px 5px; }/*スクール*/
.p-top-price__detail div >p {
	line-height: 1;
}
.p-top-price__detail div > p:last-of-type { font-size: 125%; }
.p-top-price__detail div > p:last-of-type span.lgTxt{ font-size: 125%; }

/*キャンペーン価格*/
.p-top-price__detail div > p:last-of-type del{ text-decoration: line-through; }
.p-top-price__detail div > p:last-of-type ins{ text-decoration: none; color: #F00; }

/*料金注意事項*/
p.p-top-price__note {
	font-size: 87%;
	line-height: 1.7;
	max-width: 700px;
	margin: 20px auto 0;
}

/*=========================================================
フッター
===========================================================*/
.l-footer {
	position: relative;
	background: #C7F8FF;
}

/*フッターメニュー*/
ul.c-footer-menu {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 630px;
	margin: auto;
	padding: 50px 0;
}
a.c-footer-menu__item {
	color: #000;
	text-decoration: none;
}
a.c-footer-menu__item:hover,
a.c-footer-menu__item:focus {
	color: #00afe1;
	transition: .2s;
}

/*copyright*/
.c-copyirght {
	text-align: center;
	background: #00AFE1;
	color: #fff;
	padding: 20px;
	font-size: 15px;
	font-weight: normal;
}

/*=========================================================
指導者検索 (search)
===========================================================*/
/*指導者コンテナ*/
.p-teacher-container {
	padding: 150px 4% 200px;
	margin: 0 auto;
	max-width: 1400px;
	background-origin: padding-box;
}
.p-teacher-container:nth-child(even) {
	padding: 150px 0 100px 0;
	background-color: #DFE0DF;
	position: relative;
	max-width: 100%;
}
/*ヘッダーカバータイトル部分*/
.p-search-home__cover {
	position: relative;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(/lesson/online/img/bg-vheader-pc.png);
	height: 200px;
	z-index: -1;
}
.p-search-home__text {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
	width: 100%;
}
.p-search-home__text--title {
	color: #fff;
	font-weight: bold;
	line-height: 1.5;
	text-shadow: 1px 1px 1px #000;
}

/*コンテナ*/
.p-search-container {
	padding: 50px 0 90px;
}

/*見出し*/
.p-search-lead {
	text-align: center;
	padding-bottom: 20px;
}
h2.p-search-lead__heading {
	font-size: 125%;
	font-weight: bold;
	padding-bottom: 50px;
}
p.p-search-lead__description {
	font-weight: bold;
}

/*検索画面
-----------------------------------*/
/*ラジオボタン・チェックボックス*/
ul.p-search-check li{
	display: flex;
	align-items: center;
	line-height: 1.4;
	font-weight: bold;
	margin-bottom: 20px;
}
ul.p-search-check label {
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	background: #CAE7EA;
	padding: 20px;
}
ul.p-search-check label:hover,
ul.p-search-check label:focus {
	background: #00afe1;
	color: #000;
	cursor: pointer;
	transition: .2s;
}
ul.p-search-check label span{
	display: inline-block;
}
ul.p-search-check li input {
	width: 20px;
	height: 20px;
	margin-right: 10px;
}
ul.p-search-check label.selected {
	background: #00afe1;
	color: #000;
}

/*セレクトボックス（プルダウン）*/
.p-search-select {
	text-align: center;
}
.p-search-select select {
	position: relative;
	background-color: #FFF;
	color: #000;
	max-width: 510px;
	width: 100%;
	padding: 18px;
	border: 1px solid #000;
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4Ni42IDc1Ij48Zz48cG9seWdvbiBmaWxsPSIjMDAwIiBwb2ludHM9IjQzLjMgNzUgODYuNiAwIDAgMCA0My4zIDc1Ii8+PC9nPjwvc3ZnPg==");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 10px auto;
}

/*キーワード検索*/
.p-search-keyword {
	text-align: center;
}
.p-search-keyword input {
	max-width: 510px;
	width: 100%;
	height: 3em;
	background: #FFF;
	color: #000;
	line-height: 3;
	padding: 0 10px;
	border: 1px solid #000;
}

/*検索ボタン下の文言*/
.p-search-button p{
	font-size: 87%;
	text-align: center;
}

/*検索結果画面
-----------------------------------*/
/*検索した条件*/
.p-search-conditions {
	overflow: hidden;
	max-width: 510px;
	line-height: 2;
	border: 1px solid #DDD;
	margin: auto;
	padding: 10px;
}
.p-search-conditions dl{
	font-size: 87%;
}
.p-search-conditions dt{
	float: left;
	clear: both;
	width: 6.5em;
	background: #00afe1;
	color: #FFF;
	text-align: center;
}
.p-search-conditions dd{
	padding-left: 7em;
}
.p-search-conditions dd:not(:last-of-type){
	border-bottom: 1px solid #DDD;
	margin-bottom: .75em;
	padding-bottom: .75em;
}

/*条件にマッチした指導者リスト*/
.p-search-result {
	position: relative;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	max-width: 1040px;
	margin: auto;
	margin-bottom: 50px;
}
.p-search-result::after {
	position: absolute;
	top: -20px;
	left: 75px;
	width: 892px;
	/* height: 120%; */
	height: 111%;
	content: "";
	background-image: url(/lesson/online/img/bg-result-pc.png);
	background-repeat: no-repeat;
	z-index: -1;
}
/*リスト項目*/
.p-search-result li {
	width: 223px;
	margin-top: 30px;
	margin-left: 30px;
	box-shadow: 0 2px 0 rgb(34, 34, 34, 0.15);
}
/*リンク*/
.p-search-result a {
	display: block;
	text-decoration: none;
}
/*写真*/
.p-tsearch-result__img {
	width: 100%;
	overflow: hidden;
	height: 0;
	padding-bottom: 100%;
}
.p-tsearch-result__img img {
	width: 100%;
	height: auto;
}
/*講師orINST*/
.p-tsearch-result__cat {
	text-align: center;
	color: #fff;
	font-size: 11px;
	padding: 7px 0;
	width: 223px;
}
.p-search-result .cat1 {
	background: #00C29E;
}
.p-search-result .cat2 {
	background: #A82D6E;
}
/*名前*/
.p-tsearch-result__name {
	text-align: center;
	background: #fff;
	padding: 13px 0;
	color: #000;
	font-size: 18px;
	font-weight: bold;
	width: 223px;
}

/*ページ送り*/
.m-pagenation__body {
	position: relative;
	max-width: 350px;
	margin: auto;
	display: flex;
	justify-content: center;
}
.m-pagenation__body .-current {
	padding: 10px 10px;
	color: #000;
}
.m-pagenation__body li {
	padding-top: 10px;
}
.m-pagenation__body li a{
	padding: 10px 10px;
	text-decoration: none;
	color: #ccc;
}
.m-pagenation__body .p-search-next {
	position: absolute;
	right: 0;
}
.m-pagenation__body .p-search-preview {
	position: absolute;
	left: 0;
}
.m-pagenation__body li a:hover,
.m-pagenation__body li a:focus{
	background: #FAFAFA;
	color: #000;
	transition: .2s;
}
/*前へ戻る*/
li.p-search-preview a {
	background: #FAFAFA;
	color: #000;
}
li.p-search-preview a:hover,
li.p-search-preview a:focus {
	background: #E9E9E9;
	color: #000;
	transition: .2s;
}
/*次へ進む*/
li.p-search-next a {
	background: #FAFAFA;
	color: #000;
}
li.p-search-next a:hover,
li.p-search-next a:focus {
	background: #E9E9E9;
	color: #000;
	transition: .2s;
}

/*検索結果（該当なし）*/
p.search-result-none {
	font-size: 112%;
	font-weight: bold;
	text-align: center;
	line-height: 1.7;
	letter-spacing: 0.1rem;
}
p.search-result-none + p{
	font-size: 87%;
	text-align: center;
	margin-top: 30px;
	padding: 0 4%;
}

/*=========================================================
フォーム (apply)
===========================================================*/

/*ヘッダーカバータイトル部分*/
.p-contact-home__cover {
	position: relative;
	background-size: cover;
	background-image: url(/lesson/online/img/bg-vheader-pc.png);
	height: 200px;
}
.p-contact-home__text {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
	width: 100%;
}
.p-contact-home__text--title {
	color: #fff;
	font-weight: bold;
	line-height: 1.5;
	text-shadow: 1px 1px 1px #000;
}

/*見出し*/
.p-contact-lead {
	text-align: center;
}
h2.p-contact-lead__heading {
	font-size: 118%;
	font-weight: bold;
	margin: 50px 0;
}


/*オンライン体験レッスンをする講師
-----------------------------------*/
.p-contact-teacher__cover {
	position: relative;
	background-size: cover;
	background: #E0F1F3;
	text-align: center;
	padding: 50px 4%;
}
/*見出し*/
p.p-contact-teacher__text {
	font-size: 118%;
	font-weight: bold;
}
/*指導者名*/
p.p-contact-teacher__name {
	background: #FFF;
	color: #000;
	max-width: 510px;
	font-weight: bold;
	line-height: 2.7;
	margin: 2em auto;
}

/*オンライン体験レッスンをするコース
-----------------------------------*/
/*コンテナ*/
.p-contact-container {
	max-width: 510px;
	margin: auto;
}
/*ラジオボタン*/
.p-contact-container p{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.p-contact-container span.mwform-radio-field {
	display: block;
	flex-basis: 49%;
	margin-bottom: 10px;
}
.p-contact-container span.mwform-radio-field:nth-of-type(odd) {
	margin-left: 0;
}
.p-contact-container span.mwform-radio-field label {
	display: block;
	width: 100%;
	height: 100%;
	background: #CAE7EA;
	color: #000;
	font-size: 87%;
	font-weight: bold;
	line-height: 1;
	padding: 20px;
}
.p-contact-container span.mwform-radio-field label:hover,
.p-contact-container span.mwform-radio-field label:focus {
	background: #00afe1;
	color: #000;
	cursor: pointer;
	transition: .2s;
}

/*フォーム入力項目
-----------------------------------*/
/*全体*/
.p-contact-form {
	max-width: 510px;
	margin: auto;
}
/*項目名（メイン）*/
p.p-contact-text {
	font-size: 87%;
	font-weight: bold;
	text-align: left;
	margin: 30px 0 10px;
}
/*項目名（サブ）*/
p.p-contact-subtext {
	font-size: 87%;
	text-align: left;
	margin-bottom: .5em;
}
/*説明文*/
.p-contact-formtext {
	margin-bottom: 20px;
}
.p-contact-formtext p{
	font-size: 87%;
	line-height: 1.7;
}
.p-contact-formtext p:not(:last-of-type){
	margin-bottom: 10px;
}
.p-contact-formtext a{
	text-decoration: underline;
}
.p-contact-formtext a:hover,
.p-contact-formtext a:focus{
	text-decoration: none;
}
/*各入力欄*/
.form_input_area {
	font-size: 87%;
	margin-bottom: 30px;
}
/*希望日時の入力欄（第n希望ごと）*/
.preferred-date .form_input_area:first-of-type{
	margin-bottom: 10px;
}
/*セレクトボックス（プルダウン）*/
.p-contact-form select {
	position: relative;
	width: 510px;
	padding: 18px;
	border: 1px solid #000;
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4Ni42IDc1Ij48Zz48cG9seWdvbiBmaWxsPSIjMDAwIiBwb2ludHM9IjQzLjMgNzUgODYuNiAwIDAgMCA0My4zIDc1Ii8+PC9nPjwvc3ZnPg==");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 10px auto;
}
/*日付が指定されていないときの時間選択欄*/
.disable_select {
	pointer-events: none;
}
.disable_select select {
	background-color: #CCC;
	border-color: #999;
	color: #666;
	opacity: .5;
}
/*テキストボックス*/
.p-contact-form input[type="email"],
.p-contact-form input[type="text"]{
	width: 510px;
	padding: 18px;
	border: 1px solid #000;
}
/*テキストエリア*/
.p-contact-form textarea {
	width: 510px;
	padding: 18px;
	border: 1px solid #000;
}
/*ラジオボタン*/
p.radio-normal span.mwform-radio-field {
	display: inline-block;
	margin-left: 0;
}
p.radio-normal span.mwform-radio-field label {
	display: inline-block;
	background: #FFF;
	color: #555;
	border: 1px solid #CCC;
	border-radius: 5px;
	font-size: 87%;
	font-weight: bold;
	line-height: 1;
	margin: 5px 0;
	padding: 1em;
}
p.radio-normal span.mwform-radio-field label:hover,
p.radio-normal span.mwform-radio-field label:focus,
p.radio-normal span.mwform-radio-field label input:hover {
	cursor: pointer;
	transition: .2s;
}
p.radio-normal span.mwform-radio-field label input[type="radio"]{
	vertical-align:middle;
	margin: 0 .4em 0 0;
}
p.radio-normal span.mwform-radio-field.horizontal-item{
	margin-left: 0;
	margin-right: 5px;
}
/*個人情報の取り扱いについて*/
.p-contact-privacy {
	background: #E0F1F3;
	margin-top: 20px;
	margin-bottom: 40px;
	padding-top: 50px;
	padding-bottom: 50px;
}
.p-contact-privacy h3 {
	max-width: 510px;
	margin: 0 auto;
	font-weight: bold;
	padding-bottom: 1em;
}
.p-contact-privacy p {
	max-width: 510px;
	margin: 0 auto;
	line-height: 1.7;
	font-size: 87%;
}
/*注意事項*/
.p-contact-form p.note,
.p-contact-form ul.notes{
	font-size: 87%;
	margin-top: 10px;
}
/*送信ボタンエリア*/
.form-submit_container{
	max-width: 510px;
	margin: 0 auto;
}
/*送信ボタンエリア-注意事項*/
.form-submit_container ul.notes{
	font-size: 87%;
	line-height: 1.7;
}
.form-submit_container ul.notes li:not(:first-of-type){
	padding-top: .5em;
}
/*必須・任意マーク*/
.required::after {
	content: "必須";
	background: #EE7800;
	color: #fff;
	font-size: 87%;
	font-weight: normal;
	line-height: 1.5;
	border-radius: 3px;
	margin-left: .6em;
	padding-left: .6em;
	padding-right: .6em;
}
.optional::after {
	content: "任意";
	background: #CFCFCF;
	color: #000;
	font-size: 87%;
	font-weight: normal;
	line-height: 1.5;
	border-radius: 3px;
	margin-left: .6em;
	padding-left: .6em;
	padding-right: .6em;
}


/* =============================================================
フォーム確認画面 (apply-confirm)
================================================================ */

/*背景塗りつぶし*/
body.apply-confirm .lessonWrapper{
	background: #E0F1F3;
}

/*確認画面で不要な要素を非表示*/
.mw_wp_form_confirm .p-contact-privacy { display: none;}
.mw_wp_form_confirm .p-contact-note { display: none;}
.mw_wp_form_confirm .p-contact-back { display: none;}
.mw_wp_form_confirm .p-contact-formtext { display: none;}

/*オンライン体験レッスンをするコース
-----------------------------------*/
.mw_wp_form_confirm .p-contact-container p {
	justify-content: center;
	background: #fff;
	color: #000;
	font-weight: bold;
	line-height: 2.7;
}

/*フォーム入力項目
-----------------------------------*/
/*項目名（メイン）*/
.mw_wp_form_confirm .p-contact-form p.p-contact-text {
	background: initial;
	padding: 0;
}
/*項目名（サブ）*/
.mw_wp_form_confirm .p-contact-form p.p-contact-subtext {
	background: initial;
	padding: 0;
}
/*入力した内容の表示（希望日時）*/
.mw_wp_form_confirm .preferred-date {
	background: #FFF;
	padding: 20px;
}
.mw_wp_form_confirm .preferred-date *{
	display: inline;
}
/*入力した内容の表示（その他）*/
.mw_wp_form_confirm .p-contact-form p {
	background: #FFF;
	padding: 20px;
}
/*送信前の確認を促す文言*/
.mw_wp_form_confirm .form-submit_text {
	font-size: 87%;
	text-align: center;
	margin-top: 50px;
}


/* =============================================================
フォームエラー画面 (apply-error)
================================================================ */

/*エラー画面で不要な要素を非表示*/
.mw_wp_form_error .p-contact-privacy { display: none; }
.mw_wp_form_error .p-contact-note { display: none; }

/*オンライン体験レッスンをするコース
-----------------------------------*/
/*エラーメッセージ*/
.mw_wp_form_error .p-contact-container span.error{
	font-size: 87%;
}

/*フォーム入力項目
-----------------------------------*/
/*エラーメッセージ*/
.mw_wp_form_error span.error {
	color: #EE7800;
	font-size: 100%;
	text-indent: -1.1em;
	line-height: 1.5;
	margin-top: 10px;
	padding-left: 1.1em;
}
.mw_wp_form_error span.error::before {
	content: '\f06a\0020';
	font-family: FontAwesome;
}
.mw_wp_form_error span.error {
}
/*入力欄の色を変更*/
.hasError select,
.hasError input[type="text"],
.hasError input[type="email"],
.hasError textarea{
	background-color: #FCE3CB;
	border: 1px solid #EE7800;
}

/* =============================================================
フォーム完了画面 (apply-conplete)
================================================================ */
/*見出し*/
p.p-contact-complete {
	text-align: center;
	font-size: 118%;
	font-weight: bold;
	margin: 45px 0 75px;
	line-height: 1.7;
}
/*テキスト*/
p.p-contact-complete__text {
	width: 520px;
	margin: 0 auto;
	font-size: 87%;
	line-height: 1.7;
	letter-spacing: 0.02rem;
}


/*=========================================================
各指導者のページ
===========================================================*/
.p-teacher-about {
	position: relative;
	display: flex;
	justify-content: space-between;
	max-width: 900px;
	margin: auto;
}
/*写真
-----------------------------------*/
.p-teacher-about__left{
	width: 47%;
}
.p-teacher-about img{
	width: 100%;
	height: auto;
}
/*文字情報
-----------------------------------*/
.p-teacher-about__right {
	width: 48%;
}
/*講師orINST*/
p.p-teacher-about__type {
	color: #fff;
	font-size: 112%;
	text-align: center;
	line-height: 1;
	padding: 20px;
}
/*名前*/
p.p-teacher-about__name {
	text-align: center;
	margin: 40px 0 120px;
}
p.p-teacher-about__name span:first-child {
	font-size: 225%;
	line-height: 1;
}
p.p-teacher-about__name span:last-child {
	font-size: 100%;
	line-height: 2;
}
/*担当コース*/
.p-teacher-about__course {
	position: absolute;
	bottom: 0;
}
.p-teacher-about__course h2{
	font-size: 125%;
	font-weight: bold;
}
/*担当コースリスト*/
.p-teacher-about__course ul {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	font-size: 87%;
}
.p-teacher-about__right ul li {
	color: #fff;
	line-height: 1;
	font-size: 87%;
	margin-top: 10px;
	margin-right: 10px;
	padding: 10px 20px;
}
/*見出し*/
h2.p-teacher-profile {
	text-align: center;
	font-size: 125%;
	line-height: 2.75;
	letter-spacing: 0.1em;
	font-weight: bold;
	margin: 100px 0 20px;
	font-size: 24px;
}
/*プロフィール・講師コメント*/
p.p-teacher-profile__text {
	font-size: 110%;
	line-height: 1.7;
	letter-spacing: 0.02em;
	max-width: 900px;
	margin: auto;
}
/*レッスン可能な曜日・時間帯*/
.p-teacher-available {
	max-width: 665px;
	margin: auto;
}
.p-teacher-available table {
	width: 100%;
	margin-bottom: 50px;
	vertical-align: middle;
}
.p-teacher-available table th {
	border: 1px solid #000;
	padding: 10px 0;
	color: #fff;
	font-size: 110%;
	line-height: 1.5;
	font-weight: bold;
	text-align: center;
}
.p-teacher-available table td {
	border: 1px solid #000;
	padding: 10px;
	text-align: center;
	font-size: 26px;
	font-weight: bold;
}
.p-teacher-available table td.disabled {
	background: #959595;
}
.p-teacher-available table th:first-child {
	padding: 15px 20px;
}
/*月2回コース（年間24回）／月3回コース（年間36回）*/
p.p-teacher-course {
	font-size: 110%;
	font-weight: bold;
	padding-bottom: 10px;
}
/*注意事項*/
p.p-teacher-note {
	font-size: 87%;
	line-height: 1.7;
	margin-bottom: 100px;
}

/*=========================================================
キャンペーンページ
===========================================================*/

/* 共通
------------------------------ */
.campaign-bg {
	background-color: #fcfce4;
}
.campaign-container{
	border: 2px solid #000;
	background-color: #fff;
	padding: 0px 50px 100px;
	max-width: 1270px;
	margin: 0 auto;
	font-size: 20px;
	margin-top: 140px;
	margin-bottom: 120px;
	line-height: 1.5;
}
@media screen and (max-width: 1439px) {
	.campaign-container{
		margin-left:4%;
		margin-right: 4%;
	}
}
@media screen and (max-width: 639px) {
	.campaign-container{
		padding: 0 15px 40px;
		margin-top: 70px;
		margin-bottom: 50px;
	}
	.campaign-container:first-child {
		margin-top: 50px;
	}
}
@media screen and (min-width: 639px) {
	.br-responsive{
		display: none;
	}
}
/* 共通テキスト
------------------------------ */
h2.campaign-ttl {
	position: relative;
	top: -1em;
	background: #fff;
	color: #000;
	max-width: 580px;
	font-size: 200%;
	font-weight: 600;
	line-height: 1;
	border: 2px solid #000;
	text-align: center;
	margin: 0 auto 1.25em;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
.campaign-txt {
	text-align: left;
	font-weight: 600;
	line-height: 1.8!important;
}
/*注意書き*/
.campaign-note {
	font-size: 70%;
	padding-top: 20px;
	text-align: left;
}
.campaign-note-list{
	font-size: 70%;
	text-align: left;
}

@media screen and (max-width: 639px) {
	h2.campaign-ttl{
		font-size: 100%;
		width: 100%;
	}
	.campaign-txt{
		font-size: 80%;
	}
	.campaign-note{
		font-size: 60%;
	}
	.campaign-note-list{
		font-size: 60%;
	}
}
/* トップ
------------------------------ */
.campaign-top-container {
	max-width: 1270px;
	margin: 0 auto;
	padding-top: 100px;
	margin-bottom: 100px;
	text-align: center;
}
/*PC用トップ画像*/
.campaign-top-img-pc {
	width: 100%;
}
/*SP用トップ画像*/
.campaign-top-img-sp {
	display: none;
}
/*トップ テキスト*/
.campaign-top-txt {
	display: none;
}
h1.campaign-top-ttl {
	display: none;
}
@media screen and (max-width: 1439px) {
	.campaign-top-container{
		margin-left:4%;
		margin-right: 4%;
	}
}
@media screen and (max-width: 639px) {
	.campaign-top-container{
		width: 100%;
		padding: 0;
		margin: 0 0 20px 0;
	}
	.campaign-top-img-pc{
		display: none;
	}
	.campaign-top-img-sp{
		display: block;
		width: 100%;
	}
}
/* プラン
------------------------------ */
.campaign-plan-container {
	display: flex;
	text-align: center;
	justify-content: center;
	flex-wrap: wrap;
	margin: 0 auto;
}
.campaign-plan-detail {
	padding-top: 15px;
	padding-bottom: 20px;
}


/*スクール*/
.campaign-plan-list_school {
	border: solid 2px #00C29E;
	width: 400px;
	margin: 0 auto!important;
	margin-bottom: 20px!important;
}
.campaign-plan-list-head_school{
	background-color: #00C29E;
	color: #fff;
	font-weight: 600;
	text-align: center;
	padding: 15px;
}
/*サロン*/
.campaign-plan-list_salon {
	border: solid 2px #A82D6E;
	width: 400px;
	margin-bottom: 20px!important;
}
.campaign-plan-list-head_salon {
	background-color: #A82D6E;
	color: #fff;
	font-weight: 600;
	text-align: center;
	padding: 15px;
}

/*ライン*/
.campaign-plan-line {
	margin: 0 7% 0;
	border: solid 1px #000;
}

/*プラン テキスト*/
h3.campaign-plan-ttl {
	font-weight: bold;
}
.campaign-plan-ttl-lead {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 300%;
	font-weight: bold;
	font-style: italic;
	line-height: 0.7;
}
.campaign-plan-txt {
	padding-top: 20px;
	padding-bottom: 20px;
	font-size: 80%;
}
.campaign-plan-price {
	font-family: 'Roboto', sans-serif;
	font-size: 225%;
}
.campaign-plan-en {
	font-size: 150%;
}
.campaign-plan-tax {
	font-size: 75%;
}
.campaign-plan-list {
	max-width: 411px;
}

@media screen and (max-width: 1200px) {
	.campaign-plan-container {
		display: block;
	}
	.campaign-plan-list_school {
		width: 100%;
	}
	.campaign-plan-list_salon {
		width: 100%;
	}
	.campaign-plan-line {
		margin: 50px 0 50px;
	}
	h3.campaign-plan-ttl {
		font-size: 70%;
	}
	.campaign-plan-list {
		max-width: 100%;;
	}
}
@media screen and (max-width:639px) {
	.campaign-plan-ttl-lead {
		font-size: 200%;
	}
}


/* ステップ
------------------------------ */
/*リスト本体*/
ul.campaign-step__container {
	display: flex;
	flex-wrap: wrap;
}
/*各ステップ*/
li.campaign-step__contents {
	border: 1px solid #000;
	width: 32%;
	height: 100%;
	display:table;
}
li.campaign-step__contents:not(:nth-child(3)) {
	margin-right: 2%;
}

li.campaign-step__contents:nth-child(n + 4) {
	margin-top: 50px;
}
/*各ステップの画像（例：STEP1）*/
img.campaign-step__number {
	width: 70px;
	height: auto;
}
.campaign-step__subheading {
	font-size: 60%;
	line-height: 1.2 !important;
	display:table-cell;
	vertical-align:middle;
	width: 100%;
	padding: 8px;
}
@media screen and (max-width: 1250px) {
	ul.campaign-step__container {
		justify-content: space-between;
	}
	li.campaign-step__contents {
		width: 49%;
		justify-content: space-between;
	}
	li.campaign-step__contents:not(:nth-child(3)) {
		margin-right: 0;
	}
	li.campaign-step__contents:nth-child(n + 3) {
		margin-top: 30px;
	}
}
@media screen and (max-width: 768px) {
	li.campaign-step__contents {
		width: 100%;
	}
	li.campaign-step__contents:nth-child(2n) {
		margin-top: 30px;
	}
	img.campaign-step__number {
		width: 60px;
		height: 100%;
	}
	.campaign-step__subheading {
		padding: 0 8px 0 8px;
	}
}
/* 特典
------------------------------ */
.campaign-benefit-txt {
	text-align: center;
}
.campaign-benefit-txt-lg {
	font-size: 250%;
}
.campaign-benefit-txt-sm {
	font-size: 80%;
}
.campaign-benefit-txt-bold {
	font-weight: 600;
}
@media screen and (max-width: 639px) {
	.campaign-benefit-txt-lg {
		font-size: 150%;
	}
	.campaign-benefit-txt-sm {
		font-size: 70%;
	}
	.campaign-benefit-txt-xs {
		font-size: 60%;
	}
}


.float_banner{
	position: fixed;
	right: 0;
	bottom: 0;
	width: 240px;
	visibility: hidden;
	opacity: 0;
	transition: .5s;
}
@media only screen and (max-width:750px){
	.float_banner{
		width: 40%;
	}
}
.float_banner.on{
	visibility: unset;
	opacity: 1;
}