@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/*コンタクト・フォームの設定*/
/************************************
** お問い合わせフォームの入力
************************************/
#cf-tbl{
width: 800px;
}

#cf-tbl table{
width: 100%;
border-collapse: collapse;
border: solid #CCC;
border-width: 1px;
color: #444;
}
#cf-tbl table tr th,
#cf-tbl table tr td{
padding: 0.5em;
text-align: left;
vertical-align: top;
border: solid #CCC;
border-width: 1px;
vertical-align: middle;
}
#cf-tbl table tr th{
width: 35%;
background: #eee;
}
@media screen and (max-width:768px){
#cf-tbl{
width: 100%;
}

#cf-tbl table,
#cf-tbl table tbody,
#cf-tbl table tr,
#cf-tbl table tr th,
#cf-tbl table tr td{
display: block;
}

#cf-tbl table{
width: 100%;
border-width: 0 0 1px 0;
}

#cf-tbl table tr th,
#cf-tbl table tr td{
width: 100%;
padding: 3% 5%;
}

#cf-tbl table tr td{
border-width: 0px 1px 0px 1px;
}
}
/*「必須」文字デザイン*/
.required{
font-size:.8em;
padding: 5px;
background: #F57500;
color: #fff;
border-radius: 3px;
margin-right: 5px;
}

/*「任意」文字デザイン*/
.optional{
font-size:.8em;
padding: 5px;
background: #000080;
color: #fff;
border-radius: 3px;
margin-right: 5px;
}

/* 入力項目を見やすく */
input.wpcf7-form-control.wpcf7-text,
textarea.wpcf7-form-control.wpcf7-textarea {
	width: 100%;
	padding: 8px 15px;
	margin-right: 10px;
	margin-top: 10px;
	border: 1px solid #d0d5d8;
	border-radius: 3px;
	background-color: #eff1f5;
}
textarea.wpcf7-form-control.wpcf7-textarea {
	height: 200px;
}

/* 「送信する」ボタン */
input.wpcf7-submit {
    display: block;
    padding: 15px;
    width: 400px;
    background: #ffaa56;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    border-radius: 2px;
    margin: 15px auto 0
}
@media screen and (max-width:768px){
input.wpcf7-submit {
width: 250px;
}
}

input.wpcf7-submit:hover {
	box-shadow: 0 15px 30px -5px rgba(0,0,0,.15), 0 0 5px rgba(0,0,0,.1);
	transform: translateY(-4px);
	opacity:0.7;
}
/* エラーメッセージを見やすく */
span.wpcf7-not-valid-tip,
.wpcf7-response-output.wpcf7-validation-errors {
	color: red;
	font-weight: 600;
}
/*タイトルの背景イメージ*/
.h2-title{
	background-image: url(https://learning.ukkiuki-piano.com/wp-content/uploads/アセット-2@1x.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
	padding:3rem 0;
	text-shadow: 1px 2px 3px #808080; 
	letter-spacing:0.5em;
}
.home-acodion{
	letter-spacing:0.5em;
	font-weight:bold;

}
/*タイトル用CSS*/
/* .h1-ptn_1{
	background-image: url(https://learning.ukkiuki-piano.com/wp-content/uploads/stepImg-01.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_2{
	background-image: url(https://learning.ukkiuki-piano.com/wp-content/uploads/stepImg-02.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.h1-ptn_3{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_03.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.h1-ptn_4{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_04.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.h1-ptn_5{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_05.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_6{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_06.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_7{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_07.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_8{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_08.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_9{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_09.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_10{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_10.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_11{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_11.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_12{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_12.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_13{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_13.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_14{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_14.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_15{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_15.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.h1-ptn_16{
	background-image: url(http://learning.ukkiuki-piano.com/wp-content/uploads/stepImg_16.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
 */

/*登録画面の送信ボタン*/
.buttons{
	display: inline-block;
  padding: 0.8em 3em;
  background-color: #e3364a; /* 背景色 */
  box-shadow: 0 5px 0 #ca1c30; /* 影の太さ・色 */
  border-radius: 60px;
  color: #fff;
  cursor: pointer;
  text-decoration: none; /* 文字の下線を消す */
}
.buttons:hover {
  box-shadow: none;
  transform: translateY(5px);
}

/*スマートフォン以下*/
@media screen and (max-width:600px){
	.tab-only{
		display:none;
	}
	#wpmem_login{
		width:100%;
	}
	#wpmem_reg{
		width:100%;
	}
	#pagetop{
		display:none;
	}
	
}
		.p-fixBtnWrap{
		display:none;
	}
.p-mainVisual__scroll.c-plainBtn{
display:none;
}

.resson_tag_fixed{
	position: fixed;
    top: 10%;
    right: 0;
    border-radius: 0;
}
.tag-btn-off{
display:none;
	
}
.off-btn{
	pointer-events: none;
}
.off-btn>a{
	background-color:#e1e0e1;
	box-shadow:none;
}
.on-btn{
	display:block;
	transition:0.3s;
}

.resson_tag_fixed>.swell-block-button__link{
		border-radius:0.5rem;
	
}

.lesson_acdion{
	border-radius: 0.5rem;
    box-shadow: 0px 10px 16px 0px rgb(0 0 0 / 30%), 0px 5px 10px rgb(255 255 255 / 75%) inset;
	transition:0.3s;
}
.lesson_acdion:hover{
	opacity:0.8;
	box-shadow:none;
}
.lesson_0>a{
	background-color:#B0D1A7;
}
.lesson_0_acdion{
		background-color:#B0D1A7;
}

.lesson_1>a{
	background-color:#ECB7A3;
}
.lesson_1_acdion{
	background-color:#ECB7A3;
}

.lesson_2>a{
	background-color:#C5C5DC;
}
.lesson_2_acdion{
	background-color:#C5C5DC;
}
.lesson_2_acdion:hover{
	opacity:0.8;
	box-shadow:none;
}


.lesson_3>a{
	background-color:#F0BED3;
}
.lesson_3_acdion{
	background-color:#F0BED3;
}

.lesson_4>a{
	background-color:#F7D27C;
}
.lesson_4_acdion{
	background-color:#F7D27C;
}

.lesson_5>a{
	background-color:#7DC196;
}
.lesson_5_acdion{
	background-color:#7DC196;
}

.lesson_6>a{
	background-color:#F1AE78;
}
.lesson_6_acdion{
	background-color:#F1AE78;
}

.lesson_7>a{
	background-color:#ABBFDD;
}
.lesson_7_acdion{
	background-color:#ABBFDD;
}


.lesson_8>a{
	background-color:#ED978A;
}
.lesson_8_acdion{
	background-color:#ED978A;
}


.lesson_9>a{
	background-color:#A9D9F0;
}
.lesson_9_acdion{
	background-color:#A9D9F0;
}


.lesson_10>a{
	background-color:#F6CA8B;
}
.lesson_10_acdion{
	background-color:#F6CA8B;
}


.lesson_11>a{
	background-color:#ADD9D5;
}
.lesson_11_acdion{
	background-color:#ADD9D5;
}

.lesson_12>a{
	background-color:#F4C5C1;
}
.lesson_12_acdion{
	background-color:#F4C5C1;
}

.lesson_13>a{
	background-color:#8FBEE1;
}
.lesson_13_acdion{
	background-color:#8FBEE1;
}

.lesson_14>a{
	background-color:#BCD177;
}
.lesson_14_acdion{
	background-color:#BCD177;
}
.lesson_15>a{
	background-color:#F1B6B6;
}
.lesson_15_acdion{
	background-color:#F1B6B6;
}

.lesson_16>a{
	background-color:#bbbad9;
}
.lesson_16_acdion{
	background-color:#bbbad9;
}
.lesson_acdion > .swell-block-accordion__title{
	color:#fff;	
	font-weight:bold;
}
.flowpaper-logo-bg{
	display:none !important;
	
}
.p-articleMetas{
	display:none !important;
}

.-type-simple>li>a>div>h2{
color:white !important;
}
.-type-simple li:nth-child(1) {
	background-color: #B0D1A7;
}

.-type-simple li:nth-child(2) {
	background-color: #ECB7A3;
}

.-type-simple li:nth-child(3) {
	background-color: #C5C5DC;
}

.-type-simple li:nth-child(4) {
	background-color: #F0BED3;
}

.-type-simple li:nth-child(5) {
	background-color: #F7D27C;
}

.-type-simple li:nth-child(6) {
	background-color: #7DC196;
}

.-type-simple li:nth-child(7) {
	background-color: #F1AE78;
}

.-type-simple li:nth-child(8) {
	background-color: #ABBFDD;
}

.-type-simple li:nth-child(9) {
	background-color: #ED978A;
}

.-type-simple li:nth-child(10) {
	background-color: #A9D9F0;
}

.-type-simple li:nth-child(11) {
	background-color: #F6CA8B;
}

.-type-simple li:nth-child(12) {
	background-color: #ADD9D5;
}

.-type-simple li:nth-child(13) {
	background-color: #F4C5C1;
}

.-type-simple li:nth-child(14) {
	background-color: #8FBEE1;
}

.-type-simple li:nth-child(15) {
	background-color: #BCD177;
}

.-type-simple li:nth-child(16) {
	background-color: #F1B6B6;
}

.-type-simple li:nth-child(17) {
	background-color: #bbbad9;
}

.-type-simple>li>a{
	padding:2em 5.25em !important;
}

.list-off{
	background-color:#e1e0e1 !important;
}
.list-off>a{
	pointer-events: none
}
.off-link{
	pointer-events: none
}

.pwainstall_button >a{
		pointer-events: none
}
.list-off-end{
	display:none;
}
.list-on-end{
/* 	background-color:#bbbad9; */
}
.page-numbers.current{
	display:none;
}
.large-size{
--swl-fz--content: 25px !important;	
}
.sheet-list{
	display:flex;
	flex-wrap:wrap;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
.dl-btn{
	white-space:nowrap;
}
.dl-btn>a{
	font-size:0.8rem;
}
.menu-item>a{
	font-size:0.8rem;
	font-weight:700;
}
.c-postTitle__ttl{
	display:none;
}
.h1-ptn{
  background-size: contain !!important;

}
.resson_tag_fixed{
z-index:9999;
}
.ytp-large-play-button{
	background-color:#c4302b !important;
}
	
.inner_link{
	margin-bottom:0 !important;
/* 	padding:0 !important; */
}
.inner_link >a{
color:#fff;
	display:block;
	width:100%;
	height:100%;
	
}

.inner_link:hover{
	transition:0.3s;
	opacity: 0.5;
	cursor:pointer;
}
.display-active{
	display:none;
	transition:0.3s;
}
.icon-menu-thin:before{
	content:'メニューをひらく';
	white-space: nowrap;
	font-size: 13px;
	font-weight:bold;
margin-left:0.8rem;
	padding:0.5rem 0.5rem;
	border:2px solid #333;
background:#fff;
	border-radius:0.5rem;
	color:#333;
	height:100%;
}
.ex_acdion{
	  background-color: #e3364a; 
}
.ex_acdion>.swell-block-accordion__body{
	background-color:#fff;
	border:1px solid  #e3364a;
}
.icon-menu-thin:before:hover{
	color:#fff;
	background:#333;
	
}
.c-iconBtn.c-plainBtn{
	justify-content:flex-start;
}
.icon-search{
	display:none;
}
.icon-close-thin{
	margin-left:1rem;
}
.p-pnLinks{
/* 	display:none; */
}
.l-mainContent__inner>#after_article{
	display:none;
}
.news__inner>#after_article{
	display:block !important;
}
@media screen and (max-width:768px){
		.no_sp{
		display:none;
	}
		.p-fixBtnWrap{
		display:none;
	}


}
@media screen and (max-width:600px){
	.resson_tag_fixed{
	position: fixed;
    top: 8%;
    right: 0;
    border-radius: 0;
		z-index:9999;
}
	.h1-ptn_1{
	font-size:1.2rem !important;
			
}

	.wp-block-embed-youtubeP{
				z-index:99999;
	}
#pagesContainer_documentViewer_play{
		display:hidden !important;
	}
.p-postList__link{
	padding:1.5rem 0 1.5em 1.5rem !important;
}

}

/*iframe埋め込み用のcss*/
/* .lesson_acdion>.swell-block-accordion__body{
	height:800px;
} */
/* #pdf_view{
	width:100%;
	height:780px;
}
@media screen and (max-width:600px){
.lesson_acdion>.swell-block-accordion__body{
	height:500px;
}
#pdf_view{
	width:100%;
	height:480px;
}	

} */

/*ぜんぶひけたらチャレンジ*/
.-type-simple li:nth-child(18){
	background-image: url(https://learning.ukkiuki-piano.com/wp-content/uploads/アセット-2@1x.png);	
	text-align:center;
}

.-type-simple li:nth-child(18)>a>div>h2{
	color:#000 !important;
		text-align:center;
}
/*カテゴリ表記を消す*/
.c-pageTitle__subTitle{
	display:none;
}

/*pwaボタンのcss*/
.pwa-btn {
  position: fixed;
  bottom: 0;
	left:0;
  display: flex;
  width: 100vw;
  margin: 0;
	z-index:9999999;
}

.pwa-btn__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  padding: 0.8rem 0;
  text-align: center;
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  font-size: 1.8rem;

}
.pwa-btn__link::first-child{
	border-right:1px solid #fff;
}

.pwa-btn__icon {
  color: #fff;
  fill: #fff;
  width: 18px;
  margin-right: 2rem;
}

.pwa-btn__icon.home {
  width: 35px;
}

.pwa-btn__btn {
  width: 100%;
  height: 100%;
}

.pwa-off {
  display: none;
}

@media screen and (min-width: 959px) {
 
  .pwa-btn {
    display: none;
  }
}
@media (display-mode: minimal-ui) {
  .pwa-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.post_content h2{
	z-index:auto;
}

/*ログイン画面のCSS*/
.link-text{
	margin-top:0.6rem;
}
.link-text:last-child{

	text-align:left;
}
.link-text:last-child>.link-text-register>a{
	display:inline-block;
	background-color:#7DC196;
	color:#fff;
	padding:10px;
	border-radius:60px;
	box-shadow:0 5px 0 #4B765B;
	font-weight:bold;
}
.link-text:last-child>.link-text-register>a:hover{
	box-shadow:none;
	transform:translateY(5px);
}
.link-text:last-child>.link-text-register{
	padding:1rem 0 ;
	font-size:18px;
}

/*練習用楽譜*/
.practice-box{
	position:relative;
	border: 3px solid #E87AAD !important;
		background-image: url(https://learning.ukkiuki-piano.com/wp-content/uploads/アセット-2@1x.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;

}
.practice-title{
    position: absolute;
    top: -8%;
    left: 50%;
    transform: translateX(-50%);
    font-size: 1.76rem;
	background:#fff;
	padding:0 10px;
}
.pructice-sub-title{
	text-shadow: 1px 2px 3px #808080;
    letter-spacing: 0.5em;
	
}
.practice-box>div>p>strong>a{
	color:#000;
	text-decoration:underline;
}


@media screen and (max-width: 600px) {
.practice-title{
    top: -5%;
}
}
	
/*ログイン画面のCSS*/
.wpmem_msg{
	border:1px solid red !important;
	padding:50px 25px !important;
}