@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
*/

/* ヘッダーメニュー すりがらす風に*/
.l-fixHeader {
	background-color: rgba(255, 255, 255, 0); /* 背景色・透過 */
	-webkit-backdrop-filter: blur(2px); /* ぼかし具合 */
	backdrop-filter: blur(2px); /* ぼかし具合 */
}
.l-header {
	background-color: rgba(255, 255, 255, 0); /* 背景色・透過 */
	-webkit-backdrop-filter: blur(2px); /* ぼかし具合 */
	backdrop-filter: blur(2px); /* ぼかし具合 */
}



/*  評価星の色を変える */
.c-reviewStars i {
    color: #544C40;
}


/*  評価星の色を変える */
.wide0{
	width:fit-content;
}

/*  キャプションボックスのテキスト色を変える */
.cap_box_ttl {
 color:#544C40;
}
/*  カテゴリリストのテキスト色を変える */
.c-categoryList__link {
 color:#544C40;
}

/*  カテゴリタグのテキスト色を変える */
.c-postThumb__cat {
 color:#544C40;
}
/**ハンバーガーメニュー**/
/* メニューアイコン（デフォルト時） */
.-menuBtn .c-iconBtn__icon {
	width: 24px;
	height: 2px;
	background-color: #333;
	display: grid;
	place-items: center;
	transition: transform .3s;
	
	&::before,
	&::after {
		grid-area: 1 / 1;
		content: '';
		display: block;
		inset: 0;
		width: 24px;
		height: 2px;
		background-color: #333;
		transition: transform .3s;
	}
	
	&::before {
		transform: translateY(-8px);
	}
	
	&::after {
		transform: translateY(8px);
	}
}

/* メニューアイコン（オープン時） */
[data-spmenu=opened] {
	
	.-menuBtn .c-iconBtn__icon::before {
			transform: rotate(45deg);
	}
	
	.-menuBtn .c-iconBtn__icon {
		background-color: transparent;
	}
	
	.-menuBtn .c-iconBtn__icon::after {
		transform: rotate(-45deg);
	}
}

/* ボタンラベル */
.l-header__menuBtn .c-iconBtn::after,
.p-spMenu__closeBtn .c-iconBtn::after {
	font-size: 10px;
	line-height: 10px;
	transform: translateY(12px);
}

/* ボタンラベル（開くボタン） */
.l-header__menuBtn .c-iconBtn::after {
/* 	content: 'MENU'; */
}

/* ボタンラベル（閉じるボタン） */
.p-spMenu__closeBtn .c-iconBtn::after {
/* 	content: 'CLOSE'; */
}

/* メニュー */
.p-spMenu__inner {
  width: 100%;
  height: 100%;
  transform: translateX(0)!important;
  opacity: 0;
  transition: opacity .5s ease-out!important;
}

/* メニュー（オープン時） */
[data-spmenu="opened"] .p-spMenu__inner {
  opacity: 1;
}

/* 背景色をぼかす */
.p-spMenu__inner::before {
	background: rgba(255, 255, 255, .8);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}

/* メニューをフェードイン */
.p-spMenu__body {
	opacity: 0;
	transform: translateY(20px);
}

[data-spmenu="opened"] .p-spMenu__body {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 1s ease-in, transform .7s ease-out;
}

/* 既存のメニューを削除 */
.c-widget__title.-spmenu,
.p-spMenu__nav {
  display:none;
}

/* リンクリストメニュー余白 */
.p-spMenu__body .swell-block-linkList {
	gap: 2em;
}

/* リンクリストメニュー中央寄せ */
.p-spMenu__body .swell-block-linkList__text {
	margin-inline: auto;
}

/* リストの行間調整 */
.-type-list .p-postList__item {
    margin-bottom: 0.5em;
    margin-top: 0;
}


/* 今日の1冊のスタイル変更 */
.-type-card .p-postList__thumb, .-type-card2 .p-postList__thumb {/* 画像の割合 */
    height: 200px;
	width: 200px;
    margin:  0 auto;      
}

.-type-big .p-postList__body, .-type-card .p-postList__body {
    padding-top: 1em;
	text-align: center;
}

/* 投稿リストの高さ調整 */
.-type-list .p-postList__thumb, .-type-list2 .p-postList__thumb {/* 画像の割合 */
    width: 20%;
}
.-type-list .p-postList__body, .-type-list2 .p-postList__body {/* テキストの割合 */
    width: 75%;
}
.-type-list .p-postList__item { /* 投稿リストのスキマ */
    margin-bottom: 0.5em;
    margin-top: 0;
}
 /* アイキャッチ画像のトリミング回避 */
.c-postThumb__img {
    object-fit: contain !important;
}
 /* アイキャッチ画像を縦長に */
.c-postThumb__figure {
	--list_posts_thumb_ratio: 130%;
}
/* 投稿一覧(リスト)タイトル行数制限 */
.-type-list .p-postList__title{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;/* 行数制限 */
}

/* 投稿一覧(リスト)カスタムフィールドの追加 */

@media screen and (max-width:767px) {
    .-type-list .p-postList__excerpt, .-type-list2 .p-postList__excerpt, .-type-card .p-postList__excerpt{
        font-size: 10px;
	}
}
@media screen and (min-width:768px){
    .-type-list .p-postList__excerpt, .-type-list2 .p-postList__excerpt, .-type-card .p-postList__excerpt {
        font-size: 16px;
	}
}
.-type-list .p-postList__excerpt, .-type-list2 .p-postList__excerpt, .-type-card .p-postList__excerpt {
    /*font-size: 14px;
    margin-top: .5em;*/
	margin-left:3em;
	padding-left: 0.5em !important;
	padding-right: 0.5em !important;
    margin: 0em 0;
    font-weight: bold;
/*    font-size: 10px;*/
    color: #FFFFFF;/*文字色*/
    border: solid 3px #F18D9E;/*線*/
    border-radius: 20px;/*角の丸み*/
	background-color: #F18D9E;
	display: inline-block;
	
}
.p-postList__excerpt {
    line-height: 1.5;
}



/*もっと見るボタンカスタマイズ*/
.is-style-more_btn a {
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 2em 0 3.5em;
  min-width: unset;
  box-shadow: none;
  transition: all 0.5s;
  border-radius: 999px;
  height: 36px;
  line-height: 36px;
  background: transparent;
}
.is-style-more_btn a::after {
  left: 18px;
  right: unset;
  font-family: icomoon!important;
  content: "\e921"!important;
  font-weight: bold;
  transform: translate(-50%, -50%);
}
.is-style-more_btn a::before {
  position: absolute;
  content: "";
  background-color: #efefef;
  left: 0;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  transition: all 0.25s ease-in-out;
}
.is-style-more_btn a:hover {
  background-color: unset;
  background-color: #000000;
}
.is-style-more_btn a:hover::before {
  width: 100%;
  background-color: var(--color_main);
  z-index: -1;
}
.btn_text{
 vertical-align: middle !important;
  line-height: 36px;
}


/*テキスト装飾*/
.textstyle01 {
  position: relative;
  color: #5D535E;
  font-size:18px;
	padding: 5px 0;
  text-align: center;
  margin: 1.5em 0;
}
.textstyle01:before {
  content: "";
  position: absolute;
  top: -12px;
  left: 50%;
  width: 120px;
  height: 58px;
  border-radius: 50%;
  border: 2px solid #5D535E;
  border-left-color: transparent;
  border-right-color: transparent;
  border-top-color: transparent;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}


