@charset "UTF-8";

/*!
Theme Name: livechat
Template:   cocoon-master
Version:    1.1.3
*/

@import url('https://fonts.googleapis.com/css2?family=LINE+Seed+JP:wght@700;800&display=swap');

/************************************
** 子テーマ用のスタイルを書く
************************************/

/*サイトタイトルサイズ*/
.site-name-text {
	font-family: "LINE Seed JP", sans-serif;
	font-weight: 700;
	font-style: normal;
	line-height: 0.7em;
	font-size: 39px!important;
}
/*サイトタイトル行間*/
.logo-text {
	line-height: 0em;
	margin: 0 0;
}
/*サイトキャッチフレーズサイズ*/
.tagline{
	font-size: 0.85em;
	line-height: 0.7em;
	letter-spacing: 0;
	margin: 1.5em 0 0 0;
}


/*グローバルメニューのデザイン*/
#navi .navi-in .menu-header .item-label{
	font-size: 0.85em;
	font-weight: normal;
}
#navi .navi-in > ul > li{
	border-left: 0px dotted #2b2934;
}
#navi .navi-in > ul > li:last-child{
	border-right: 0px dotted #2b2934;
}


/* ホームでタイトル非表示 */
.entry-title {
	display: none;
}


/* 通知エリア */
.notice-area {
	padding: 0.7em 0 0.6em 0;
	font-size: 0.88em;
	color: #666666;
	background-color: #ffffff;
    border-bottom: 1px solid #ececec;
}


/*カラム背景色*/
.header-container,
.main,
.sidebar,
.footer {
background-color: #ffffff;
}


/*投稿日・更新日カスタム*/
.post-date, .post-update {
	font-weight: normal;
    font-size: 0.9em;
	color: #67637c;
	margin: 0 0;
}


/*デフォルトリンク*/
a {
	color: #e93161;
	text-decoration: none; 
}
a:hover {
	color: #e93161;
	text-decoration: underline; 
}


/*罫線*/
.line {
	border-top: 0px ;
	border-bottom: 1px solid #ddd;
	margin: 1.5em 0;
}


/* 黄色マーカーの色 */
.marker {
	background-color: #fbe67a;
	padding: 4px 2px ;
}


/*見出しリセット*/
.article h1 {
	padding: 0;
	background: none;
}
.article h2 {
	padding: 0;
	background: none;
}
.article h3 {
	border: none;
	padding: 0;
}
.article h4 {
	border: none;
	padding: 0;
}
.article h5 {
	border: none;
	padding: 0;
}
.article h6 {
	border: none;
	padding: 0;
}
/*見出しデザイン*/
/*h1*/
.article h1 {
	font-size: 28px;
	line-height: 1.5em;
	margin: 0 0 2em 0;
}
/*h2*/
.article h2 {
	font-size: 1.2em;
	line-height: 1.5em;
	color: #ffffff;
	background: #e93161;
	border-radius: 0.2;
	margin: 3em 0 1.5em 0;
	padding: 1.2em 1em;
}
/*h3*/
.article h3 {
	font-size: 1.2em;
	line-height: 1.5em;
	background: transparent;
	border-left: solid 5px #ea2d67;
	padding: 0.05em 0.4em 0.01em 0.4em;
	margin: 0 0 1.5em 0;
}


/*キャプション*/
p.cap {
	font-size: 0.8em;
	font-weight: normal;
	line-height: 2em;
	margin: -2em 0 0 0;
	color: #777777;
}


/*出所*/
p.source {
	font-size: 0.8em;
	font-weight: normal;
	line-height: 2em;
	margin: -0.5em 0 0 0;
	color: #777777;
}


/*-- PCで表示 --*/
@media screen and (max-width: 480px){
.spOff { display: none;}
}
/*-- SPで表示 --*/
@media screen and (min-width: 480px){
.spOn { display: none;}
}


/************************************
**リンクボタン
************************************/
/*--緑ボタン --*/
.btn_green {
	display: inline-block;
	font-size: 1.2em;
	font-weight: bold;
	padding: 0.8em 2em;
	margin: -2em 0 1em 0;
	background-color: #62b86f;
	box-shadow: 0 5px 0 #569a60;
	border-radius: 5px;
	color: #fff;
	cursor: pointer;
	text-decoration: none;
}
.btn_green:hover {
	color: #fff;
}
.btn_green:active {
	box-shadow: none;
	transform: translateY(5px);
}


/************************************
**テーブル
************************************/
.table-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	font-size: 0.9em;
	font-weight: normal!important;
	line-height: 1.6em;
	table-layout: fixed;
}
table {
	min-width: 720px; /* スマホでも横スクロールできるように */
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95em;
	white-space: nowrap;
}
th,td {
	padding: 1em 2em!important;
	border: 1px solid #dddddd!important;
	background-color: #ffffff;
	vertical-align: top;
}
th {
	background-color: #f3f3f3!important;
	font-weight: normal!important;
	width: 20%;
	text-align: center;
	padding: 1em 2em!important;
}



/************************************
**口コミ
************************************/
/*口コミBOX*/
.KuchiBox {
	padding: 1.2em 2em  0.2em 2em;
	margin: 1em 0;
	border-radius: 6px;
	background: #f7f7f7;
	border: 1px solid #ddd;
}
/*口コミユーザー名*/
p.KuchiName {
	font-weight: bold;
	font-size: 0.9em;
	color: #666; 
	margin-bottom: -5px;
}
/*口コミテキスト*/
p.KuchiTxt {
	font-size: 0.9em;
	line-height: 1.6em;
	margin-top: -20px;
}
/*口コミ星*/
.KuchiStar {
    display: inline-block;
}
/*レーティング*/
.star5_rating{
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #ddd; 
    font-size: 1em;
}
.star5_rating:before, .star5_rating:after{
    content: '★★★★★';
}
.star5_rating:after{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #f8d043;
}
.star5_rating[data-rate="5"]:after{ width: 100%; } /* 星5 */
.star5_rating[data-rate="4.5"]:after{ width: 90%; } /* 星4.5 */
.star5_rating[data-rate="4"]:after{ width: 80%; } /* 星4 */
.star5_rating[data-rate="3.5"]:after{ width: 70%; } /* 星3.5 */
.star5_rating[data-rate="3"]:after{ width: 60%; } /* 星3 */
.star5_rating[data-rate="2.5"]:after{ width: 50%; } /* 星2.5 */
.star5_rating[data-rate="2"]:after{ width: 40%; } /* 星2 */
.star5_rating[data-rate="1.5"]:after{ width: 30%; } /* 星1.5 */
.star5_rating[data-rate="1"]:after{ width: 20%; } /* 星1 */
.star5_rating[data-rate="0.5"]:after{ width: 10%; } /* 星0.5 */
.star5_rating[data-rate="0"]:after{ width: 0%; } /* 星0 */



/************************************
**SNSボタン
************************************/
/*SNSシェアボタンのデザイン*/
#main .button-caption {
	display: none; /*キャプション非表示*/
}
.sns-share-message{
	font-weight: bold; /*太字*/
	color: #875d5b; /*文字色*/
}
.sns-share-buttons {
	flex-wrap: nowrap; /*折り返さない*/
	justify-content: center; /*中央寄せ*/
}
.sns-share-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 16px; /*アイコンのサイズ*/
	margin: 0.05em!important; /*ボタン同士の間隔*/
}
#main .sns-share a {
	width: 33px; /*ボタンの横幅*/
	height: 33px; /*ボタンの高さ*/
}
/*SNSシェアボタンの非表示ページ*/
.page-id-12 .sns-share,
.page-id-12 .sns-follow{
  display: none;
}



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

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

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

/*-- 通知エリア --*/
.notice-area {
	font-size: 0.9em;
	color: #444;
	background-color: #f4f4f4;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	padding: 0.6em 0 0.7em  0;
	margin : 0 0 -12px 0;
}


/* 黄色マーカーの色 */
.marker {
	background-color: #fbe67a;
	padding: 1.5px 1px 3px 1px;
}

/*本文*/
.body, .menu-content {
	font-size: 1em!important;
	font-weight: normal!important;
}

/*見出しデザイン*/
/*h1*/
.article h1 {
	font-size: 22px;
	line-height: 1.5em;
	margin: 0 0 2em 0;
}

}