@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

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

/* モバイル用ナビゲーション(トップメニュー版) *//* ナビの背景色の指定 */
.slicknav_menu{
	/*background: #fdeff2; 	*/
	background: #ffffff;
}

.slicknav_btn{
	background-color: #e95464; /* MENUボタンの色 */	
}
.slicknav_menu .slicknav_menutxt{
	text-shadow: 0 1px 3px rgb(0 0 0 / 45%); /* 「MENU」の文字の影の濃さ */
　　　　　color: #ffffff;  /* 「MENU」の文字の色 */
}
/*ハンバーガーメニューの中*//* ナビ中の文字色 */
.slicknav_nav a{
	color: #e95464; 
	border-bottom: dotted 1px #CCC;
	text-align:center;
}

/*.mobile-header-menu-buttons{
  display: none;
}*/
/*使用カラーについて
見出しの色　#e95464
背景の色 #fdeff2
説明スライドの背景の色 #f5b2b2
説明スライドの文字色
ご利用方法の吹き出しの色 #f5b2b2
*/

/* モバイル用アピールエリア */
@media screen and (max-width: 1023px) {
	div.appeal-in {
		display: none;
	}
	
}
/* モバイル用メニュー非表示設定 */
/*	#navi {
		display: none;
	}*/

/*投稿記事*/
.article-header {
	display: flex; /*フレックスボックスレイアウト*/
	flex-direction: column; /*ブロック要素を縦に並べる*/
}
.eye-catch-wrap {
	order: -1; /*順番*/
	overflow: hidden; /*はみ出した部分を非表示 ※IE対策*/
}
/*アイキャッチ*/
.eye-catch {
	display:none;
	margin-top: 0px;
	margin-bottom: 5px; /*下の余白*/
	height:100%;
}


/*見出し*/
h2 {
  padding: 1rem 2rem;
  border-bottom: 3px dotted;
  background: #f4f4f4;
}
/* 記事タイトル */
/* 文字の設定 */
main h1.entry-title{ 
  font-weight: 600;
  font-size: 25px;
  color: #e95464;
}
/* 記事タイトル非表示 */
.entry-title {
display: none;
}

/* PC余白 */
main .article-header.entry-header{ 
  margin-top: 0;
  margin-bottom: -3em;
  text-align: left;
}
/* モバイル余白*/
@media screen and (max-width: 1023px){
  main h1.entry-title{
    font-size: 20px;
    padding: .6em .4em;
	 margin-top: 0em;
	 margin-bottom: 0em;
  }
}

/* テーブル */
table td {
	border: 1px solid #e95464;
	background: #ffffff;
	border-right:hidden;
	border-left:hidden;
}
table th {
	border: 1px solid #e95464;
	background: #ffffff;
	border-top:hidden;
	border-right:hidden;
	border-left:hidden;
}

td.table-doremi-header{
	border: 1px dotted #e95464;
	background: #fdeff2;
	color: #6c272d;
	border-right:hidden;
	border-left:hidden;
	text-align:center;
}
td.table-doremi-desc{
	border: 1px dotted #e95464;
	border-right:hidden;
	border-left:hidden;
	text-align:center;
}
td.table-doremi-desc-left{
	border: 1px dotted #e95464;
	border-left:hidden;
	text-align:center;
	table-layout: fixed;
	width: 50%;
}
td.table-doremi-desc-right{
	border: 1px dotted #e95464;
	border-right:hidden;
	text-align:center;
	table-layout: fixed;
	width: 50%;
}
/*レッスンスケジュール*/
table td.lesson{
	border: 1px solid #e95464;
	background: #ffffff;
	border-right:hidden;
	border-left:hidden;
	width:100%;
}
table th.lesson{
	border: 1px solid #e95464;
	background: #ffffff;
	border-top:hidden;
	border-right:hidden;
	border-left:hidden;
}


td.table-doremi-header-lesson{
	border: 1px dotted #e95464;
	background: #fdeff2;
	color: #6c272d;
	border-right:hidden;
	border-left:hidden;
	text-align:center;
	width:20%;
}
td.table-doremi-desc-lesson{
	border: 1px dotted #e95464;
	border-right:hidden;
	border-left:hidden;
	text-align:center;
	width:80%;
}
/*施設情報*/
table td.facility{
	border: 1px solid #e95464;
	background: #ffffff;
	border-right:hidden;
	border-left:hidden;
	width:100%;
}
table th.facility{
	border: 1px solid #e95464;
	background: #ffffff;
	border-top:hidden;
	border-right:hidden;
	border-left:hidden;
}


td.table-doremi-header-facility{
	border: 1px dotted #e95464;
	background: #fdeff2;
	color: #6c272d;
	border-right:hidden;
	border-left:hidden;
	text-align:center;
	width:30%;
}
td.table-doremi-desc-facility{
	border: 1px dotted #e95464;
	border-right:hidden;
	border-left:hidden;
	text-align:left;
	width:70%;
}

/* ページ更新日付非表示 */
.page .date-tags {
display: none;
}

/* 色変更 */
/*フッター*/
/* 不要な余白をリセット */
.footer-bottom {
 margin-top: 0;
}
/* 不要な余白をリセット */
.copyright {
 margin-top: 0;
}

/*サイドバー*/
/*見出し*/
.sidebar h3 {
  border-bottom:2px solid #e95464;/*下線の太さ、種類、色*/
  background:transparent;/*背景を透明に*/
  padding:10px 0 5px 3px;
  text-align:center;
}

/*ご利用の流れの吹き出し*/
.balloon {
    position: relative;
    display: inline-block;
    background-color: #fff;
    border-bottom: solid 1px #e95464;
    padding: 16px;
    width: 100%;
    text-align: left;
	
}
.balloon:before,
.balloon:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
	color:#333333;
}
.balloon:before {
    border: solid 30px transparent;
    border-top: solid 30px #e95464;
	
}
.balloon:after {
    border: solid 33px transparent;
    border-top: solid 33px #fff;
    margin-top: -5px;
	
}
.balloon p {
    margin: 0;
    padding: 0;
}
/*ご利用の流れ最後の線*/
div.balloon-end{
	position: relative;
    display: inline-block;
    background-color: #fff;
    border-bottom: solid 1px #e95464;
    padding-top: 16px;
    width: 100%;
}

/*登録の流れリスト*/
li.list-regist{
	padding-bottom:40px;
	font-size: 25px;
    transform: translateX(3%);
}
p.list-regist-desc{
	color:#333333;
	font-size: medium;
}
div.list-title{
	color:#333333;
	font-size: medium;
	text-align: left;
	font-weight: 800; 
	margin: 0;
    padding: 0;
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

/*サービス内容説明用の装飾*/
div.explain-background{
	padding: 10px; 
	margin-bottom: 10px; 
	border: 1px solid #ffffff; 
	color: #6c272d; 
	font-family: "Tsukushi A Round Gothic"; 
	background-color: #f5b2b2;
}

div.explain-title{
	color: #ffffff; 
	text-align: center; 
	font-size:130%;
	font-weight: 800; 
}

div.explain-desc{
	padding: 10px; 
	margin-bottom: 10px; 
	border: 1px solid #ffffff; 
	border-radius: 10px;
	background-color: #ffffff;
}

/*QAの装飾*/
.qa-list dl {
    position: relative;
    margin: 0;
    padding: 28px 80px 28px 30px;
    cursor: pointer;
    border-bottom: 1px dotted #000;
}

.qa-list dl:first-child {
    border-top: 1px dotted #000;
}
.qa-list dl::before {
    position: absolute;
    top: 35px;
    right: 35px;
    display: block;
    width: 7px;
    height: 7px;
    margin: auto;
    content: '';
    transform: rotate(135deg);
    border-top: 2px solid #000;
    border-right: 2px solid #000;
}
.qa-list .open::before {
    transform: rotate(-45deg);
}
.qa-list dl dt {
    position: relative;
    margin: 0;
    padding: 0 0 0 50px;
    font-weight: bold;
    font-size: normal;
}
.qa-list dl dt::before {
    font-size: 25px;
    line-height: 1;
    position: absolute;
    top: 3px;
    left: 0;
    display: block;
    content: 'Q.';
    color: #e95464;
}
.qa-list dl dd::before {
    font-size: 25px;
    line-height: 1;
    position: absolute;
    top: 3px;
    left: 2px;
    display: block;
    content: 'A.';
    font-weight: bold;
    color: #e95464;
}
.qa-list dl dd {
    position: relative;
    display: none;
    height: auto;
    margin: 20px 0 0;
    padding: 0 0 0 50px;
}
.qa-list dl dd p {
    margin: 30px 0 0;
}
.qa-list dl dd p:first-child{
    margin-top: 0;
}

@media screen and (max-width: 1023px) {
.qa-list dl {
    position: relative;
    padding: 15px 40px 15px 10px;
}
.qa-list dl::before {
    top: 20px;
    right: 20px;
    width: 7px;
    height: 7px;
}
.qa-list dl dt {
    padding: 0 0 0 30px;
    font-size: normal;
}
.qa-list dl dt::before {
    font-size: 20px;
    top: 3px;
    left: 5px;
    content: 'Q.';
}
.qa-list dl dd::before {
    font-size: 20px;
    top: 5px;
    left: 5px;
    content: 'A.';
}
.qa-list dl dd {
    margin: 10px 0 0;
    padding: 0 0 0 30px;
    font-size: normal;
}
.qa-list dl dd p {
    margin: 30px 0 0;
}
.qa-list dl dd p:first-child{
    margin-top: 0;
}
}
/*投稿一覧*/
.ect-vertical-card .entry-card-wrap{
    max-width: 43%;
    box-shadow: 0 2px 4px rgb(0 0 0 / 25%);
    border-radius: 3px;
    padding:0;
}
@media screen and (max-width:1023px){
    .ect-vertical-card .entry-card-wrap{
        max-width: 46%;
    }
    .e-card-title {
        font-size: 16px;
		padding-left:0px;
		padding-right:0px;
		padding-top:0px;
		padding-bottom:0px;
    }
}
@media screen and (min-width:1023px){
    .e-card-title {
        font-size: 18px;
		padding-left:0px;
		padding-right:0px;
		padding-top:0px;
		padding-bottom:0px;
    }
}
.entry-card-title{
    color: #e95464; /*見出しの色*/
	background-color: #ffffff;
	border:none;
    
}
.ect-vertical-card .entry-card-wrap .entry-card-content {
	color: #333333;
    margin: 8px 12px 9px 12px;
}
.entry-card-meta, .related-entry-card-meta {

    color: #333333;
    margin: 4px 8px;
}
.entry-card-wrap .cat-label{
    display: none; /*カテゴリを非表示に*/
}
.ect-vertical-card {
    justify-content: space-around;
}

/*ロゴ*/
.header-in .logo {
text-align:cener;

	height:100%;

}

/*スマホで表示した場合の処理*/
@media screen and (max-width: 1023px) {
	/*モバイルヘッダー画像の変更*/
		.header {
		background-image: none;
		background: url("http://rentalspace.doremi-houkago.com/wp-content/uploads/2022/04/header_mobile.png") no-repeat;
		background-size: contain;
		background-position: center;
		height:100%;
		margin-top:-1.4em;
		margin-bottom:-1.8em;

			
	}
}
		/*メニューヘッダーボタン*/
	.mobile-menu-buttons .menu-button > a,
	.menu-button{
			color:#ffffff;
		background-color:#f5b2b2;
		height:50px;
	}
	.mobile-menu-buttons .menu-button:hover{
		background-color: #f5b2b2;
		color:#ffffff;
	}
	/*ロゴの大きさを変更*/
	img.site-logo-image{
		height:100%;
		padding:0 0 0 0;
		padding-top:5px;
		padding-bottom:5px;
		padding-left:5px;
}
	/*ハンバーガーメニューの編集*/
.navi-menu-content{
	background-color:#ffffff;
}
	/*ハンバーガーメニューの文字の編集*/
.menu-drawer a{
	font-size: 18px;/*文字の大きさ*/
	height: 2.5em;/*行の高さ*/
	color:#e95464;
	border-bottom: dotted 1px #CCC;
	text-align:center;
}

/*PCで表示した場合の処理*/
@media screen and (min-width: 1023px) {

	/* 元のロゴ画像を非表示 */
.logo > a img {
		visibility: hidden;
	}
		.logo > a .site-name-text {
		display: inline-block;
		background: url("http://rentalspace.doremi-houkago.com/wp-content/uploads/2022/04/logo_PC.png") no-repeat;
		background-size: contain;
		background-position: center;
		height:300px;
		
	}
	.header {
		background-size: cover;
		max-width:100%;
	}
}
/*スタッフ紹介テーブル*/
//*PC表示*/
   table, td.table-introduce{
		border:none;
    }
    table {
        table-layout: fixed;
		height: 100%;
        width: 100%;
    }
    
    td.td-pic {
        width: 25;
		height: 40%;
		text-align:right;
		border:none;
		padding-left:40px;
    }
    
    td.td-name {
        width: 75%;
		height 40%;
		border:none;
		vertical-align:top;
		text-align:left;
		padding-left:50px;
    }
    td.td-car{
		 width: 100%;
        height: 60%;
		border:none;
		text-align:left;
		vertical-align:top;
    }
div.profile-box{
	/*border:none;*/
	color: #ffffff;
	border: 2px #e95464 solid;
	background-color:#ffffff;
}
div.profile-name{
	font-size:40px;
	padding-left: 20px;/*文字周りの余白*/
  	color: #333333;/*文字色*/
  	background: #ffffff;/*背景色*/
  	border-left: solid 5px #e95464;/*左線（実線 太さ 色）*/
	font-family:"YuGothic"; 
	font-weight: 600;
}
ul.ul-introduce{
	text-align:left;
	color:#e95464;
	list-style: none;
	font-size:23px;
	padding 0px 0px;
	margin-left:0px;
	margin-top:0px;
	margin-bottom:0px;
}
p.p-introduce{
	font-size:16px;
	color:#333333;
	font-family:"YuGothic";
	
}
p.staff-status{
	font-size:16px;
	font-family:"YuGothic"; 
	font-weight: 400;
	margin-bottom:0px;
}
p.staff-roma{
	text-align:center;
	margin-left:-50px;
}
.introduce-photo{
	width:135px;
	height:180px;
}
hr.staff-line{
	color:#e95464;
	border: 0.5px solid #e95464;
}
/*モバイル表示*/
@media screen and (max-width: 1023px) {
	
	
   table, td.table-introduce{
		border:none;
    }
    table {
        table-layout: fixed;
		height: 100%;
        width: 100%;
    }
    
    td.td-pic {
        width: 40%;
		height: 30%;
		text-align:center;
		border:none;
		vertical-align:top;
		padding-left:0;
    }
    
    td.td-name {
        width: 60%;
		height: 30%;
		border:none;
		vertical-align:top;
		padding-left:0;
    }
    td.td-car{
		 width: 100%;
        height: 70%;
		border:none;
		vertical-align:top;
		padding-left:0;
    }
div.profile-box{
	/*border:none;*/
	color: #ffffff; 
	border: 2px #e95464 solid;
	background-color:#ffffff;
}
div.profile-name{
	font-size:30px;
	padding-left: 20px;/*文字周りの余白*/
  	color: #333333;/*文字色*/
  	background: #ffffff;/*背景色*/
  	border-left: solid 5px #e95464;/*左線（実線 太さ 色）*/
	margin-left:10px;
	font-family:"YuGothic"; 
	font-weight: 600;
}
ul.ul-introduce{
	text-align:left;
	color:#e95464;
	list-style: none;
	font-size:18px;
	padding-left:0;
}
p.p-introduce{
	font-size:16px;
	color:#333333;
	font-family:"YuGothic";
}
p.staff-status{
	font-size:14px;
	font-family:"YuGothic"; 
	font-weight: 400;
}
p.staff-roma{
	font-size:14px;
	text-align:center;
}
.introduce-photo{
	width:135px;
	height:180px;
}
	hr.staff-line{
	border: 0.5px solid #e95464;
}
}
/*利用者の声*/
/*PCでの表示*/
@media screen and (min-width: 1023px){
.boxmi28 {
  position: relative;
  margin: 3em 5em  5em 5em;
  background: #fff6e6;
  box-shadow: 0 2px 3px rgba(0,0,0,.22);
  padding: 22px 8px 22px 8px;
  background-color: #fff6e6;
  background-image:
  linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff6e6 0%, #fff6e6 100%), linear-gradient(180deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 95%, #ed7780 100%);
  background-size: 8px 100%,100% 2em;
  line-height: 2;
  color: #6c272d;
  font-size: 18px;
}
.boxmi28-title {
  background: #fff6e6;
  font-size: 18px;
  padding: 17px 0 0 16px;
  margin: -16px -8px 16px -8px;
  color:  #6c272d;
  font-weight:400;
text-align:center;
}
.boxmi28:after {
  position: absolute;
  content: "";
  top: 25px;
  width: 30%;
  height: 35px;
  opacity: 0.9;
  margin: -45px auto 10px 35%;
  background: repeating-linear-gradient(-45deg, #ffefef, #ffefef 2px,#ffd1d1 3px, #ffd1d1 7px);
  transform: rotate(-2deg);
  left: 10px;
  right: 10px;
  box-shadow:0 0 5px rgba(0,0,0,.2);
}
.boxmi28 p {
  margin: 0;
  padding: 0;
}
}
/*スマホでの表示*/
@media screen and (max-width: 1023px){
.boxmi28 {
  position: relative;
  margin: 3em 0 1em 0;
  background: #fff6e6;
  box-shadow: 0 2px 3px rgba(0,0,0,.22);
  padding: 22px 8px 22px 8px;
  background-color: #fff6e6;
  background-image:
  linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff6e6 0%, #fff6e6 100%), linear-gradient(180deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 95%, #ed7780 100%);
  background-size: 8px 100%,100% 2em;
  line-height: 2;
  color:  #6c272d;
}
.boxmi28-title {
  background: #fff6e6;
  font-size: 16px;
  padding: 10px 0 0 16px;
  margin: -16px -8px 16px -8px;
  color: #6c272d;
	text-align:center;
}
.boxmi28:after {
  position: absolute;
  content: "";
  top: 25px;
  width: 30%;
  height: 35px;
  opacity: 0.9;
  margin: -45px auto 10px 35%;
  background: repeating-linear-gradient(-45deg, #ffefef, #ffefef 2px,#ffd1d1 3px, #ffd1d1 7px);
  transform: rotate(-2deg);
  left: 10px;
  right: 10px;
  box-shadow:0 0 5px rgba(0,0,0,.2);
}
.boxmi28 p {
  margin: 0;
  padding: 0;
}

}

/*SNSフォローボタン*/
/************************************
** SNS ボタンをまとめて丸くする
************************************/

/*シェア・フォローボタンの枠組み*/
.sns-share.ss-top .sns-share-buttons,
.sns-share.ss-bottom .sns-share-buttons,
.sns-follow.sf-bottom .sns-follow-buttons,
.sns-follow.sf-widget .sns-follow-buttons {
	justify-content: center; /*中央に寄せる*/
	flex-wrap: wrap; /*折り返す*/
}

/*シェア・フォローボタンのリンク*/
.sns-share.ss-top .sns-buttons a,
.sns-share.ss-bottom .sns-buttons a,
.sns-follow.sf-bottom .sns-buttons a,
.sns-follow.sf-widget .sns-buttons a {
	width: 40px; /*横幅*/
	height: 40px; /*高さ*/
	margin-right: 4px; /*右側の余白*/
	margin-left: 4px; /*左側の余白*/
	border-radius: 50%; /*丸み*/
}

/*プロフィールウィジェットのリンク*/
.sns-follow.sf-profile .sns-buttons a {
	border-radius: 50%; /*丸み*/
}

/*シェアボタンのアイコン*/
.sns-share.ss-top .sns-buttons a .social-icon,
.sns-share.ss-bottom .sns-buttons a .social-icon {
	font-size: 18px; /*アイコンの大きさ*/
}

/*フォローボタンのアイコン*/
.sns-follow.sf-bottom .sns-follow-buttons .follow-button,
.sns-follow.sf-widget .sns-follow-buttons .follow-button {
	font-size: 24px; /*アイコンの大きさ*/
}

/*シェアボタンのキャプション*/
.sns-share.ss-top .sns-buttons a .button-caption,
.sns-share.ss-bottom .sns-buttons a .button-caption {
	display: none; /*非表示*/
}

/*シェア・フォローボタンのシェア数*/
.sns-share.ss-top .sns-buttons a .share-count,
.sns-share.ss-bottom .sns-buttons a .share-count,
.sns-follow.sf-bottom .sns-buttons a .follow-count,
.sns-follow.sf-widget .sns-buttons a .follow-count {
	right: -2px; /*右側からの距離*/
	bottom: -2px; /*下側からの距離*/
	padding: 2px; /*内側の余白*/
	font-size: 10px; /*文字の大きさ*/
	border: solid 1px; /*線*/
	border-radius: 3px; /*丸み*/
	background-color: inherit; /*背景色*/
}

/*シェア数の表示が必要ないシェア・フォローボタン*/
.sns-share.ss-top .sns-buttons a .share-count:empty,
.sns-share.ss-bottom .sns-buttons a .share-count:empty,
.sns-follow.sf-bottom .sns-buttons a .follow-count:empty,
.sns-follow.sf-widget .sns-buttons a .follow-count:empty {
	padding: 0; /*内側の余白*/
	border: 0; /*線*/
}
/*色の変更*/
	.sns-follow.sf-widget .instagram-button,
    .sidebar .instagram-button {
      background-color: #c522b8 !important;

    }

/*アクセス　駐車場*/
.doremi_parking{
	/*width:2862px;
	height:1460px;*/
	width:954pxx;
	height:auto;
}


/*Top サービス説明*/
.service-box {
    padding: 1em 1.5em;
    margin: 1.5em 0;
    background-color: #fff6e6;/*背景色*/
    box-shadow: 0 0 0 8px #fff4ea;/*背景色外側*/
    border: 1.5px dashed  #ed7780;/*線*/
    border-radius: 8px;/*角の丸み*/
    color: #6c272d;/*文字色*/

}
.service-box p {
    margin: 0; 
    padding: 0;

}

.service-title{
	display: inline-block;
	color: #6c272d;
	text-align:left;
	font-weight: bold;
	border-bottom: 1px solid #6c272d;
}

div.service-desc{
	color:#6c272d;
	text-align:left;
	}	

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

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

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