/*
Theme Name: Iknow Child
Theme URI: https://wow-company.com/wp-theme-iknow/
Template: iknow
Author: Wow-Company
Author URI: https://wow-company.com
Description: Introducing the Iknow WordPress Theme - the epitome of minimalism and mobile-friendly design. This lightweight and speedy theme is tailor-made for Knowledge Bases, Helpdesks, Wikis, and FAQ platforms. Personalize your website with custom icons for categories and tags. Organize how categories appear on your homepage with ease. Engage users with our integrated post rating system, VoteUp/VoteDown. Breadcrumbs ensure seamless navigation. Plus, our custom widget keeps users oriented whether they're in a category or an individual post. Experience the theme's aesthetics and functionalities firsthand at [theme demo website](https://themes.wow-company.com/iknow/). For guidance, consult our comprehensive [documentation](https://wow-company.com/faq/category/wow-themes/iknow/).
Tags: blog,education,entertainment,two-columns,right-sidebar,custom-logo,custom-menu,featured-images,theme-options,threaded-comments,translation-ready
Version: 1.3.1774406267
Updated: 2026-03-25 11:37:47

*/

/* START BOOK REVIEW CUSTOM R-TSUCHIYA */

/* 指定の固定ページはヘッダーに表示させない ページIDが 4278(おすすめ図書登録),4280(図書編集),4282(図書詳細),4284(購入依頼登録) のリンクを非表示 */
.navbar-collapse .mywiki-header-menu .page-item-4278,
.navbar-collapse .mywiki-header-menu .page-item-4280,
.navbar-collapse .mywiki-header-menu .page-item-4282,
.navbar-collapse .mywiki-header-menu .page-item-4284 {
    display: none !important;
}

/* 削除確認ダイアログ内ボタン */
.my-solid-btn-delete{
    color: #fff;
    background-color: #a33137;
    border-radius: 5px;
    padding: 8px 15px 8px 15px;
    border: 0 !important;
    margin-left: 3px;
    font-size: 15px;
    transition: background-color 0.3s ease;
    cursor: pointer;
}
.my-solid-btn-delete:hover{
    color: #fff;
    background: #6a2023;
}
.my-solid-btn-cancel{
    color: #fff;
    background-color: gray;
    border-radius: 5px;
    padding: 8px 15px 8px 15px;
    border: 0 !important;
    margin-left: 3px;
    font-size: 15px;
    transition: background-color 0.3s ease;
    cursor: pointer;
}
.my-solid-btn-cancel:hover{
    color: #fff;
    background: rgb(90, 90, 90);
}
/* 未レビュー通知ダイアログ内ボタン */
.my-solid-btn-ok{
    color: #fff;
    background-color: #7da3a1;
    border-radius: 5px;
    padding: 8px 15px 8px 15px;
    border: 0 !important;
    margin-left: 3px;
    font-size: 15px;
    transition: background-color 0.3s ease;
    cursor: pointer;
}
.my-solid-btn-ok:hover{
    color: #fff;
    background: #324851;
}
/* リスト内チェックボックス アニメーション付き */
.animationCheckbox {
    display: inline-block;
    position: relative;
}
.list-checkbox {
    appearance: none;
    height: 17px;
    width: 17px;
    border: 1px solid gray;
    border-radius: 4px;
    transition: all 0.3s ease;
    position: relative;
    z-index: 1;
    top: 4px;
    cursor: pointer;
}
.list-checkbox:checked {
    transform: rotate(-45deg);
    opacity: 0;
}
.list-checkbox:focus {
    outline: none !important;
}
.list-check {
    position: absolute;
    top: 0;
    left: 0;
    width: 17px;
    height: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
}
.list-check::before {
    content: "";
    width: 9px;
    height: 14px;
    border-width: 0 3px 3px 0;
    border-style: solid;
    border-color: transparent #7da3a1 #7da3a1 transparent;
    transform: rotate(45deg);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.list-checkbox:checked + .list-check::before {
    opacity: 1;
}
.list-checkbox-all {
    appearance: none;
    height: 17px;
    width: 17px;
    margin: 4px 0;
    border: 1px solid #fff;
    border-radius: 4px;
    transition: all 0.3s ease;
    position: relative;
    z-index: 1;
    cursor: pointer;
}
.list-checkbox-all:checked {
    transform: rotate(-45deg);
    opacity: 0;
}
.list-checkbox-all:focus {
    outline: none !important;
}
.list-check-all {
    position: absolute;
    top: 0;
    left: 0;
    width: 17px;
    height: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
}
.list-check-all::before {
    content: "";
    width: 9px;
    height: 14px;
    border-width: 0 3px 3px 0;
    border-style: solid;
    border-color: transparent #fff #fff transparent;
    transform: rotate(45deg);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.list-checkbox-all:checked + .list-check-all::before {
    opacity: 1;
}

/* リスト内アイコンボタン */
.btn-delete{
    background: #f9e9ea;
    /* background: transparent; */
    color: #a33137;
    border: 0 !important;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    font-size: 1rem;
    cursor: pointer;
    transition: background-color 0.3s ease;
    position: relative;
}
.btn-delete:hover{
    background: #fff;
}
.btn-edit {
    background: #fdf0e3;
    /* background: transparent; */
    color: #f59f49;
    border: 0 !important;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    font-size: 1rem;
    cursor: pointer;
    transition: background-color 0.3s ease;
    position: relative;
}
.btn-edit:hover {
    background: #fff;
}
.btn-show {
    background: #f2f8f6;
    /* background: transparent; */
    color: #7da3a1;
    border: 0 !important;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    font-size: 1rem;
    cursor: pointer;
    transition: background-color 0.3s ease;
    position: relative;
}
.btn-show:hover {
    background: #fff;
}
.btn-like {
    background: transparent;
    color: #f0628d;
    border: 0 !important;
    height: 2rem;
    font-size: 1rem;
    cursor: pointer;
    transition: background-color 0.3s ease;
    position: relative;
}
.btn-like:hover i{
    font-weight: 900;
}
.btn-like-disabled {
    background: transparent;
    color:gray;
    border: 0 !important;
    height: 2rem;
    font-size: 1rem;
    cursor: default;
    transition: background-color 0.3s ease;
    position: relative;
}
/* いいねアニメーション */
.btn-like.like-animation {
    animation: likePop 0.35s ease;
}
@keyframes likePop {
    0% {
        transform: scale(1);
    }
    40% {
        transform: scale(1.35);
    }
    70% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}
/* いいね済み */
.btn-like.liked {
    background: transparent;
    color: #f0628d;
    border: 0 !important;
    cursor: default;
    opacity: 0.9;
}
.like-wrapper {
    position: relative;
    display: inline-block;
    right: 3px
}
.like-count{
    color: #4a4a4a;
}
.btn-disabled {
    background: transparent;
    color:gray;
    border: 0 !important;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    font-size: 1rem;
    cursor: default;
}
/* ツールチップ */
.btn-show::after,
.btn-edit::after,
.btn-delete::after,
.btn-like::after,
.btn-like-disabled::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%) translateY(4px);
    background: rgba(50, 72, 81, 0.96);
    color: #fff;
    font-size: 12px;
    line-height: 1.6;
    padding: 10px 14px;
    border-radius: 12px;
    display: table;
    width: max-content;
    max-width: min(260px, calc(100vw - 32px));
    white-space: normal;
    word-break: break-all;
    text-align: center;
    box-sizing: border-box;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    z-index: 1000;
}
.btn-show::before,
.btn-edit::before,
.btn-delete::before,
.btn-like::before,
.btn-like-disabled::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: calc(100% + 2px);
    transform: translateX(-50%) translateY(4px);
    border-width: 6px;
    border-style: solid;
    border-color:
        rgba(50, 72, 81, 0.96)
        transparent
        transparent
        transparent;
    opacity: 0;
    visibility: hidden;
    transition:
        opacity .18s ease,
        transform .18s ease,
        visibility .18s;
    z-index: 1001;
}
.btn-show:hover::after,
.btn-show:hover::before,
.btn-edit:hover::after,
.btn-edit:hover::before,
.btn-delete:hover::after,
.btn-delete:hover::before,
.btn-like:hover::after,
.btn-like:hover::before,
.btn-like-disabled:hover::after,
.btn-like-disabled:hover::before {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}
/* 一覧の操作ボタン */
.my-solid-btn,
a.my-solid-btn {
    color: #fff;
    background-color: #7da3a1;
    border-radius: 5px;
    padding: 8px 15px 8px 15px;
    border: 0 !important;
    margin-left: 3px;
    font-size: 15px;
    transition: background-color 0.3s ease;
    cursor: pointer;
}
.my-solid-btn:hover,
a.my-solid-btn:hover {
    color: #fff;
    background: #324851;
}
.my-solid-btn:disabled,
a.my-solid-btn:disabled {
    background-color: gray;
    cursor: not-allowed;
}
.my-solid-btn-edit,
a.my-solid-btn-edit {
    color: #fff;
    background-color: #f59f49;
    border-radius: 5px;
    padding: 8px 15px 8px 15px;
    border: 0 !important;
    margin-left: 3px;
    font-size: 15px;
    transition: background-color 0.3s ease;
    cursor: pointer;
}
.my-solid-btn-edit:hover,
a.my-solid-btn-edit:hover {
    color: #fff;
    background: #9b5208;
}
.my-solid-btn-like,
a.my-solid-btn-like {
    color: #f0628d;
    background-color: transparent;
    border-radius: 5px;
    padding: 8px 15px 8px 15px;
    border: 0 !important;
    margin-left: 3px;
    font-size: 15px;
    transition: background-color 0.3s ease;
    cursor: pointer;
    position: relative;
}
.my-solid-btn-like i,
a.my-solid-btn-like i{
    font-size: 20px;
}
.my-solid-btn-like:hover i,
a.my-solid-btn-like:hover i{
    font-weight: 900;
}
.my-solid-btn-like:disabled,
a.my-solid-btn-like:disabled {
    color: #f0628d;
    cursor: not-allowed;
}
/* いいねアニメーション */
.my-solid-btn-like.like-animation {
    animation: likePop 0.35s ease;
}
/* ツールチップ */
.my-solid-btn-like::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%) translateY(4px);
    background: rgba(50, 72, 81, 0.96);
    color: #fff;
    font-size: 12px;
    line-height: 1.6;
    padding: 10px 14px;
    border-radius: 12px;
    display: table;
    width: max-content;
    max-width: min(260px, calc(100vw - 32px));
    white-space: normal;
    word-break: break-all;
    text-align: center;
    box-sizing: border-box;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    z-index: 1000;
}
.my-solid-btn-like::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: calc(100% + 2px);
    transform:
        translateX(-50%)
        translateY(4px);
    border-width: 6px;
    border-style: solid;
    border-color:
        rgba(50, 72, 81, 0.96)
        transparent
        transparent
        transparent;
    opacity: 0;
    visibility: hidden;
    transition:
        opacity .18s ease,
        transform .18s ease,
        visibility .18s;
    z-index: 1001;
}
.my-solid-btn-like:hover::after,
.my-solid-btn-like:hover::before {
    opacity: 1;
    visibility: visible;
    transform:
        translateX(-50%)
        translateY(0);
}
.my-solid-btn-like:disabled {
    opacity: 1;
    pointer-events: auto;
}
@keyframes likePop {
    0% {
        transform: scale(1);
    }
    40% {
        transform: scale(1.35);
    }
    70% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}
.solid-like-count{
    color: #4a4a4a;
}
/* 検索パネル調整 */
.custom-content {
    position: relative;
}
#search_conditions {
    position: absolute;
    right: 0;
    z-index: 20;
    width: min(500px, 100%);
    padding: 20px 24px;
    max-width: 500px;
    margin-left: auto;
    font-size: 0.9rem;
    box-shadow: 0 12px 32px rgba(50, 72, 81, 0.18);
}
#search_conditions .has-text-right {
    margin-bottom: 15px;
}
#search_conditions .wpcf7-form p {
    margin-bottom: 12px;
    color: #4a4a4a;
}

/* 詳細画面の評価表示用の星 */
.star5-rating{
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: LightGray;
    font-size: 25px;
}
.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: #f59f49;
}
.star5-rating[data-rate="5"]:after{ width: 100%; } /* 星5 */
.star5-rating[data-rate="4"]:after{ width: 80%; } /* 星4 */
.star5-rating[data-rate="3"]:after{ width: 60%; } /* 星3 */
.star5-rating[data-rate="2"]:after{ width: 40%; } /* 星2 */
.star5-rating[data-rate="1"]:after{ width: 20%; } /* 星1 */
.star5-rating[data-rate="0"]:after{ width: 0%; } /* 星0 */

/* 検索ボックス */
table.table-search {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    overflow: hidden;
    border: 0 !important;
    margin-top: 40px;
}
table.table-search tr {
    border: 0 !important;
}
table.table-search th {
    vertical-align: top;
    width: 25%;
    border: 0 !important;
    font-weight: bold;
    cursor: default;
}
table.table-search td {
    width: 75%;
    border: 0 !important;
}
table.table-search input,select {
    border: solid 1px #cfcfcf;
    padding: 2px, 5px;
    border-radius: 3px;
    height: 32px;
    background: #fff !important;
    color: #4a4a4a;
}
table.table-search input:focus {
    border: solid 1px #324851 !important;
    outline: none;
}
/* dateだけsafariだと崩れるので */
input[type="date"] {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    text-align: left !important;
    line-height: 32px;
}
input[type="date"]::-webkit-date-and-time-value {
    text-align: left;
}
input[type="date"]::-webkit-calendar-picker-indicator {
    margin-left: 0;
}
/* Datatables */
/* ソートアイコン非表示 */
table.dataTable thead .sorting{
    background-image: none !important;
}
/* 昇順ソートアイコン */
table.dataTable thead .sorting_asc {
    background-image: none !important;
}
table.dataTable thead .sorting_asc::after {
    font-family: "Font Awesome 5 Free";
    content: "\f0d8";
    color: #fff;
    margin-left:5px;
}
/* 降順ソートアイコン */
table.dataTable thead .sorting_desc {
    background-image: none !important;
}
table.dataTable thead .sorting_desc::after {
    font-family: "Font Awesome 5 Free";
    content: "\f0d7";
    color: #fff;
    margin-left:5px;
}

/* ページネーションボタン */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    background: none !important;
    border: 0 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: none !important;
    border: 0 !important;
    color: #7da3a1 !important;
    border-bottom: solid 1px #7da3a1 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: none !important;
    border-bottom: solid 1px #7da3a1 !important;
    color: #7da3a1 !important;
    font-weight: bold;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: none !important;
    border-bottom: solid 1px #7da3a1 !important;
    color: #7da3a1 !important;
    font-weight: bold;
}

/* DataTables 上部（表示件数・検索） */
.dataTables_length,
.dataTables_filter {
  font-size: 0.85rem;
}

/* 下部（ページネーション・件数表示） */
.dataTables_info,
.dataTables_paginate {
  font-size: 0.85rem;
}

/* 余白 */
.dataTables_wrapper .dataTables_filter {
  margin-bottom: 12px;
}

.dataTables_wrapper .dataTables_length {
  margin-bottom: 12px;
}

/* 購入書籍一覧表 */
table.table-list {
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    overflow: visible;
    font-size: 1rem;
    border-radius: 6px;
    background: #fff;
    cursor: default;
    box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
}

/* ヘッダー */
table.table-list thead th {
    background-color: #7da3a1;
    color: #fff;
    vertical-align: middle;
    padding: 10px 10px !important;
    border: none !important;
}
/* 左上 */
table.table-list thead th:first-child {
    border-top-left-radius: 6px;
}
/* 右上 */
table.table-list thead th:last-child {
    border-top-right-radius: 6px;
}
/* 行 */
table.table-list tbody tr {
    transition: 0.2s;
}
/* 行下線 */
table.table-list tbody tr:not(:last-child) td {
    border-bottom: 1px solid rgba(125, 163, 161, 0.15) !important;
}
table.table-list.dataTable.no-footer {
    border-bottom: 1px solid rgba(125, 163, 161, 0.15) !important;
}
/* hover */
table.table-list tbody tr:hover {
    background-color: #d7e3e3;
}
/* セル */
table.table-list td {
    padding: 8px 10px !important;
    vertical-align: middle;
}
/* 7〜10列目だけ */
table.table-list td:nth-child(7),
table.table-list td:nth-child(8),
table.table-list td:nth-child(9),
table.table-list td:nth-child(10) {
    padding: 8px 0 !important;
}
/* paddingはみ出し防止 */
table.dataTable th,
table.dataTable td {
    box-sizing: border-box !important;
}
/* ボタン群中央寄せ */
table.table-list th:nth-child(1),
table.table-list th:nth-child(7),
table.table-list th:nth-child(8),
table.table-list th:nth-child(9),
table.table-list th:nth-child(10),
table.table-list td:nth-child(1),
table.table-list td:nth-child(7),
table.table-list td:nth-child(8),
table.table-list td:nth-child(9),
table.table-list td:nth-child(10) {
    text-align: center;
}

/* 図書一覧スピナー表示 */
.table-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: visible;
}
.datatable-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(255, 255, 255, 0.8);
    z-index: 1000;
    width: 100%;
    height: 100%;
}
.spinner {
    border: 6px solid #f3f3f3;
    border-top: 6px solid #7da3a1;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1.5s linear infinite;
}
.spinner-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    align-items: center; /* 水平方向の中央揃え */
    justify-content: center; /* 垂直方向の中央揃え */
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* レビューへのコメントテーブル */
.review-comment-list {
    margin-bottom: 30px;
}
.review-comment-item {
    padding: 20px 0;
    border-bottom: 1px dotted #7da3a1;
    cursor: default;
}
.review-comment-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.review-comment-user {
    font-size: 1rem;
    font-weight: 700;
    color: #7da3a1;
    min-width: 160px;
}
.review-comment-star {
    min-width: 100px;
}
.review-comment-date {
    font-size: 1rem;
    color: #4a4a4a;
}
.review-comment-body {
    font-size: 1rem;
    color: #4a4a4a;
    word-break: break-word;
}

.flexbox{
    width: 100%;
    display: flex;
}
.inner{
    flex-grow: 1;
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.book-image-empty {
    width: 80%;
    height: 80%;
    background: #f2f8f6;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
    color: #7da3a1;
}
.book-image-empty i {
    font-size: 50px;
}
.book-image-empty span {
    font-size:1rem;
    font-weight: 500;
}

/* Contact Form7スマホ・タブレット用カスタマイズ */
@media(max-width:767px){
    /* 一覧テーブル */
    table.table-list {
        border-radius: 0;
        text-align: left;
    }
    table.table-list thead {
        display:none;
    }
    table.table-list tr {
        background-color: unset;
    }
    table.table-list tr:hover {
        background-color: #d7e3e3;
    }
    table.table-list tbody tr.selected {
        background-color: #d7e3e3;
    }
    table.table-list th, table.table-list td {
        display: block;
        border: 0;
    }
    table.table-list tbody th{
        background: #7da3a1;
        color: #fff;
        text-align: center;
    }
    table.table-list td::before{
        content: attr(data-label);
        background-color: #7da3a1;
        color: #fff;
        font-weight: bold;
        display: inline-block;
        width: 20%;
        min-width: 4em;
        text-align: center;
        margin-right: 0.5em;
        padding: 4px;
        border-radius: 3px;
    }
    table.table-list td:first-child::before {
        content: none;
    }
    /* td の線を消す */
    table.table-list tbody tr:not(:last-child) td {
        border-bottom: none !important;
    }
    /* 行をカード化 */
    table.table-list tbody tr {
        display: block;
        border-bottom: double 3px #ddd !important;
        padding-bottom: 8px;
    }
    /* 最後だけ線なし */
    table.table-list tbody tr:last-child {
        border-bottom: none !important;
    }
    /* ボタン群中央寄せ解除 */
    table.table-list th:nth-child(1),
    table.table-list th:nth-child(7),
    table.table-list th:nth-child(8),
    table.table-list th:nth-child(9),
    table.table-list th:nth-child(10),
    table.table-list td:nth-child(1),
    table.table-list td:nth-child(7),
    table.table-list td:nth-child(8),
    table.table-list td:nth-child(9),
    table.table-list td:nth-child(10) {
        text-align: left;
    }
    /* 操作系ラベル(before)非表示 */
    table.table-list td[data-label="いいね"]::before,
    table.table-list td[data-label="詳細"]::before,
    table.table-list td[data-label="編集"]::before,
    table.table-list td[data-label="削除"]::before {
        display: none;
        content: none;
    }
    /* 操作ボタンセルを横並び */
    table.table-list td[data-label="いいね"],
    table.table-list td[data-label="詳細"],
    table.table-list td[data-label="編集"],
    table.table-list td[data-label="削除"] {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        width: auto !important;
        min-width: auto !important;
        padding: 10px 0px 5px 10px !important;
        border: 0 !important;
        clear: none !important;
    }
    /* 右寄せ */
    table.table-list td[data-label="いいね"] {
        margin-left: calc(100% - 185px);
    }
    .check-label{
        padding-left: 10px;
    }

    /* contactform7 */
    .pcdate{
        display: none;
    }

    .table-form,
    .table-show,
    .book-review {
        border: 0 !important;
        vertical-align: middle;
        width: 100%;
        border-collapse: collapse;
    }
    .flexbox{
        display: inline;
    }
    .inner{
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .book-image-empty {
        width: 90%;
        height: 300px;
    }

    /* テーブルの見出しとフォーム */
    table.table-form th {
       display:block;
       padding:30px 0px 10px 0px!important;
       width:100%;
       border:0;
    }
    table.table-form td {
       display:block;
       padding:10px 0px 30px 0px !important;
       width:100%;
       border:0;
    }

    /* 送信ボタン */
    input.wpcf7-submit{
       margin-bottom:30px;
       width:100%;
    }

    /* 一覧ボタン */
    .my-solid-btn,
    a.my-solid-btn {
        color: #fff;
        background-color: #324851;
        border-radius: 5px;
        padding: 5px 10px 5px 10px;
        border: 0 !important;
        transition: background-color 0.3s ease;
    }
    #btnToggleSearch {
        order: 99;
        text-align: right;
    }
    /* ラベル横の横線削除 */
    .table-show-review p::th::after {
        display: none;
        content: none;
    }
    .table-show-detail th p::after {
        display: none;
        content: none;
    }
    .table-show th {
        padding: 10px 0 0 0 !important;
    }
    .table-show td {
        padding: 0 0 10px 0 !important;
    }
    .tab-show .tab-switch:checked+.tab-label+.tab-content {
        padding: 0 !important;
    }
    table.table-form th.icon-id {
        padding-top: 10px !important;
    }
}
@media(min-width: 768px) and (max-width: 991px) {
    /* 一覧テーブル */
    table.table-list {
        font-size: 0.8rem;
    }
    .btn-delete{
        width: 1.6rem;
        height: 1.6rem;
        font-size: 0.8rem;
    }
    .btn-edit {
        width: 1.6rem;
        height: 1.6rem;
        font-size: 0.8rem;
    }
    .btn-show {
        width: 1.6rem;
        height: 1.6rem;
        font-size: 0.8rem;
    }
    .btn-like {
        height: 1.6rem;
        font-size: 0.8rem;
    }
    .btn-disabled {
        height: 1.6rem;
        font-size: 0.8rem;
    }
    .btn-like-disabled {
        height: 1.6rem;
        font-size: 0.8rem;
    }
    .btn-disabled {
        width: 1.6rem;
        height: 1.6rem;
        font-size: 0.8rem;
    }
    .star5-rating-list{
        font-size: 0.8rem !important;
    }

    .spdate{
        display: none;
    }
    /* 日付タグの幅を調整 */
    .wpcf7-date.dateform{
        width: 25%;
    }

    /*テーブル下に余白.枠線・テキストの行間 */
    .table-form {
        margin: 0px auto;
        margin-bottom: 30px;
        border: 0 !important;
        vertical-align: middle;
        width: 90%;
    }
    .table-show {
        margin: 10px auto;
        margin-bottom: 30px;
        border: 0 !important;
        vertical-align: middle;
        width: 90%;
    }
    .book-review {
        margin: 30px 0 20px 0;
        margin-bottom: 30px;
        border: 0 !important;
        vertical-align: middle;
        width: 100%;
        border-collapse: collapse;
    }
    /* 一覧テーブル　ホバーとセレクトカラー */
    table.table-list tr:hover {
        background-color: #d7e3e3 !important;
    }
    table.table-list tbody tr.selected {
        background-color: #d7e3e3;
    }
    /* 一覧テーブルチェックボックス横の書籍ID非表示 */
    .check-label{
        display: none;
    }
    /* 一覧テーブルの状態ラベル */
    .status-label {
        padding: 4px 8px !important;
        font-size: 8px !important;
    }
}
@media(min-width:992px){
    .spdate{
        display: none;
    }
    /* 日付タグの幅を調整 */
    .wpcf7-date.dateform{
        width: 25%;
    }

    /*テーブル下に余白.枠線・テキストの行間 */
    .table-form {
        margin: 10px auto;
        margin-bottom: 30px;
        border: 0 !important;
        vertical-align: middle;
        width: 80%;
    }
    .table-show {
        margin: 10px auto;
        margin-bottom: 30px;
        border: 0 !important;
        vertical-align: middle;
        width: 80%;
    }
    .book-review {
        margin: 30px 0 20px 0;
        margin-bottom: 30px;
        border: 0 !important;
        vertical-align: middle;
        width: 100%;
        border-collapse: collapse;
    }
    /* 一覧テーブル　ホバーとセレクトカラー */
    table.table-list tr:hover {
        background-color: #d7e3e3 !important;
    }
    table.table-list tbody tr.selected {
        background-color: #d7e3e3;
    }
    /* 一覧テーブルチェックボックス横の書籍ID非表示 */
    .check-label{
        display: none;
    }
}

/*ContactForm7カスタマイズ*/
/*
****
    登録編集画面のテーブルデザイン
****
*/
/* 自動入力されるPタグを無効にする */
.table-form p,
.table-show p,
.table-comment p{
    display: inline;
}
.table-show {
    border-collapse: separate; /* セルの境界を分ける */
    border-spacing: 20px; /* セルの間隔を設定 */
}
/* テーブル下線を表示 */
table.table-form tr {
    border-bottom: 1px solid #eee;
}
/* テーブルの最終行は下線を表示させない */
table.table-form tr:last-child {
    border: 0 !important;
}
/* テーブルの下線を表示させない */
table.table-show tr {
    border: 0 !important;
}
/* テーブル下線を表示 */
table.book-review tr {
    border-bottom: 1px solid #eee;
}
/* テーブルの最終行は下線を表示させない */
table.book-review tr:last-child {
    border: 0 !important;
}
.book-review td{
    padding: 20px 10px 20px 10px;
    cursor: default;
}
/* アイコン側 */
table.book-review td:first-child {
    width: 100px;
    padding-right: 12px;
    vertical-align: middle;
}
/* テキスト側 */
table.book-review td:last-child {
    padding-left: 0;
}
/* 丸アイコン */
.label-circle {
    background: #f4f4f4;
    color: #7da3a1;
    border: 0 !important;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
/* アイコンサイズ */
.label-circle i {
    font-size: 26px;
}
/* ラベル（書籍名とか） */
.book-review .label-title {
    display: block;
    font-size: 1rem;
    color: #4a4a4a;
    margin-bottom: 8px;
}
/* 値 */
.book-review .label-value {
    display: block;
    font-size: 1.2rem;
    color: #4a4a4a;
    line-height: 1.3;
}
/* テーブルの見出し側 */
.table-form th{
    border: 0 !important;
    text-align: left;
    padding: 2em 0.5em;
    background: #fff;
    white-space: nowrap;
    font-weight: bold;
    vertical-align: middle;
    color: #4a4a4a;
    cursor: default;
}
.table-show-review th {
    border: 0 !important;
    background: transparent;
    display: table-cell !important;
    padding: 20px 10px 10px 0;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    cursor: default;
}
.table-show-review th p {
    display: flex;
    align-items: center;
    gap: 14px;
    color: #7da3a1;
    font-size: 1.1rem;
}
.table-show-detail th {
    border: 0 !important;
    background: transparent;
    display: table-cell !important;
    padding: 20px 10px 10px 0;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    cursor: default;
}
.table-show-detail th p {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #7da3a1;
    margin: 0;
}
.table-show-detail th span {
    font-size: 1rem;
}
/* 丸アイコン */
.table-show-review th p::before {
    font-family: "Font Awesome 5 Free";
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #7da3a1;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.table-show-detail th p::before {
    font-family: "Font Awesome 5 Free";
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #7da3a1;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
/* アイコン個別 */
.icon-content p::before {
    content: "\f044";
}
.icon-comment p::before {
    content: "\f4ad";
}
.icon-category p::before {
    content: "\f02b";
}
.icon-recommend p::before {
    content: "\f507";
}
.icon-id p::before {
    content: "\f02d";
}
.icon-state p::before {
    content: "\f058";
}
.icon-created p::before {
    content: "\f073";
}
.icon-kindle p::before {
    content: "\f3fa";
}
.icon-purchase p::before {
    content: "\f07a";
}
.icon-client p::before {
    content: "\f007";
}
.icon-shop p::before {
    content: "\f54e";
}
.icon-price p::before {
    content: "\f53a";
}
.icon-location p::before {
    content: "\f3c5";
}
.icon-media p::before {
    content: "\f1d8";
}
.icon-return p::before {
    content: "\f0e2";
}
.icon-memo p::before {
    content: "\f303";
}
.icon-author p::before {
    content: "\f4ff";
}
.icon-user p::before {
    content: "\f5da";
}
.icon-bookname p::before {
    content: "\f518";
}
.icon-bookurl p::before {
    content: "\f5fc";
}
.icon-slack p::before {
    content: "\f086";
}
.icon-star p::before {
    content: "\f005";
}
.table-show-review th p::after {
    content: "";
    flex: 1;
    height: 2px;
    background: #cfdedd;
    margin-left: 10px;
}
.table-show-detail th::after {
    display: none;
    content: none;
}
.table-show-detail th p::after {
    content: "";
    flex: 1;
    height: 2px;
    background: #d7e3e3;
}
.table-form th p {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
}

/* 丸アイコン */
.table-form th p::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #eef6f5;
    color: #7da3a1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* 必須と任意タグ */
.input-req,.input-opt{
    font-size: 0.8rem;
    padding: 2px 5px 2px 5px ;
    background: #fdf0e3;
    color: #f59f49;
    border-radius: 3px;
    margin-right: 5px;
}
/* 任意タグの背景カラー */
.input-opt{
    background: #a3bdc7;
    color: #324851;
}
/* テーブルフォーム側 */
.table-form td{
    border: 0 !important;
    padding: 2em 0.5em;
}
.table-show td{
    border: 0 !important;
    padding: 0px 10px 20px 10px;
}
/* 入力エリア幅最大 */
.wpcf7-form-control {
    width: 100%;
}

/* フォーム入力欄の余白・背景カラー・枠線消す指定 */
.table-form input {
    background: #fff;
    border: solid 1px #ddd;
    border-radius: 3px;
    height: 40px;
    padding: 5px;
    font-size: 1rem;
    color: #4a4a4a;
}
.table-form select {
    background: #fff;
    border: solid 1px #ddd;
    border-radius: 3px;
    height: 40px;
    padding: 5px;
    font-size: 1rem;
    color: #4a4a4a;
}
.table-form textarea {
    background: #fff;
    border: solid 1px #ddd;
    border-radius: 3px;
    padding: 8px 5px 8px 5px;
    font-size: 1rem;
    color: #4a4a4a;
}
.table-form input:focus {
    border: solid 1px #324851 !important;
    outline: none;
}
.table-form textarea:focus {
    border: solid 1px #324851 !important;
    outline: none;
}

/* コメントフォーム入力欄の余白・背景カラー・枠線消す指定 */
.table-comment input,.table-comment select {
    background: #fff;
    border: solid 1px #ddd;
    border-radius: 3px;
    font-size: 1rem;
}
.table-comment textarea {
    background: #fff;
    border: solid 1px #ddd;
    border-radius: 3px;
    padding: 2px 5px;
    font-size: 1rem;
    color: #4a4a4a;
}
.table-comment input:focus {
    border: solid 1px #324851 !important;
    outline: none;
}
.table-comment textarea:focus {
    border: solid 1px #324851 !important;
    outline: none;
}

/* 読み取り専用のinputフィールドのスタイル */
.table-form input[readonly],
.table-show input[readonly],
.table-comment input[readonly] {
    background-color: transparent;
    border: none !important;
    outline: none;
    cursor: default;
    font-size: 1rem;
    color: #4a4a4a;
}
.table-form textarea[readonly],
.table-show textarea[readonly],
.table-comment textarea[readonly] {
    background-color: #fff;
    margin-top: 8px;
    outline: none;
    cursor: default;
    border: solid 1px #ddd;
    border-radius: 3px;
    color: #4a4a4a;
    padding: 8px 5px 8px 5px;
    font-size: 1rem;
}
.table-form input[readonly]:focus,
.table-show input[readonly]:focus,
.table-comment input[readonly]:focus {
    border: none !important;
    outline: none;
}

/* ラジオボタンのデザイン */
.custom-radio input[type=radio] {
    display: none;
}

.custom-radio span.wpcf7-list-item {
    margin-left: 0;
}

.custom-radio span.wpcf7-list-item ~ span.wpcf7-list-item {
    margin-left: 20px;
}

.custom-radio input[type=radio] + .wpcf7-list-item-label,
.table-show input[type=radio] + .wpcf7-list-item-label {
    padding-left: 1.5em;
    display: inline-flex;
    align-items: center;
    position: relative;
    font-weight: normal;
}

.custom-radio input[type=radio] + .wpcf7-list-item-label::after,
.table-show input[type=radio] + .wpcf7-list-item-label::after,
.table-form input[type=radio] + .wpcf7-list-item-label::before,
.table-show input[type=radio] + .wpcf7-list-item-label::before {
    content: '';
    display: block;
    position: absolute;
    border: 1px solid #aaa;
    width: 20px;
    height: 20px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    border-radius: 50%;
}

.custom-radio input[type=radio] + .wpcf7-list-item-label::after,
.table-show input[type=radio] + .wpcf7-list-item-label::after {
    opacity: 0;
    width: 14px;
    height: 14px;
    top: 50%;
    left: 3px;
    transform: translateY(-50%);
    border: none;
    background: #7da3a1;
}

.custom-radio input[type=radio]:checked + .wpcf7-list-item-label {
    color: #4a4a4a;
    font-weight: bold;
}

.custom-radio input[type=radio]:checked + .wpcf7-list-item-label::after {
    opacity: 1;
}

/* disabled時のスタイル */
.custom-radio input[type=radio]:disabled + .wpcf7-list-item-label {
    color: #4a4a4a;
}
.custom-radio input[type=radio]:disabled + .wpcf7-list-item-label::after {
    background-color: #4a4a4a;
}

/* 評価設定用の星ラジオボタン */
.radio-star input[type=radio] {
    display: none;
}
.my-wrap {
    position: relative;
}
.my-wrap .wpcf7-form-control-wrap {
    position: static !important;
}
.radio-star .wpcf7-list-item {
    position: absolute;
    top: 0px;
    left: 0px;
}
.radio-star .wpcf7-list-item-label {
    color: Lightgray;
    font-size: 1rem;
    letter-spacing: 1px;
    cursor: pointer;
}
.radio-star .wpcf7-list-item:hover .wpcf7-list-item-label,
.radio-star .wpcf7-list-item:hover ~ .wpcf7-list-item .wpcf7-list-item-label {
    color: #f59f49;
}
.radio-star:not(:hover) .wpcf7-list-item.checked .wpcf7-list-item-label,
.radio-star:not(:hover) .wpcf7-list-item.checked ~ .wpcf7-list-item .wpcf7-list-item-label {
    color: #f59f49;
}

/* チェックボックスのデザイン */
.custom-checkbox input[type=checkbox] {
    display: none;
}

.custom-checkbox span.wpcf7-list-item,
.table-show span.wpcf7-list-item {
    margin-left: 0;
}

.custom-checkbox span.wpcf7-list-item ~ span.wpcf7-list-item {
    margin-left: 10px;
}

.custom-checkbox input[type=checkbox] + .wpcf7-list-item-label {
    padding-left: 1.7em;
    display: inline-block;
    position: relative;
    font-weight: normal;
}

.custom-checkbox input[type=checkbox] + .wpcf7-list-item-label::after,
.custom-checkbox input[type=checkbox] + .wpcf7-list-item-label::before {
    content: '';
    display: block;
    position: absolute;
    border: 1px solid #aaa;
    width: 20px;
    height: 20px;
    top: 0;
    left: 0;
}

.custom-checkbox input[type=checkbox] + .wpcf7-list-item-label::after {
    opacity: 0;
    width: 10px;
    height: 15px;
    transform: rotate(45deg);
    left: 5px;
    border: none;
    border-right: 3px solid #7da3a1;
    border-bottom: 3px solid #7da3a1;
}

.custom-checkbox input[type=checkbox]:checked + .wpcf7-list-item-label {
    color: #4a4a4a;
    font-weight: bold;
}

.custom-checkbox input[type=checkbox]:checked + .wpcf7-list-item-label::after {
    opacity: 1;
}

/* 詳細画面でdisabledにしたチェックボックスのチェックしていない項目を薄くする */
.checkbox-disabled input[type=checkbox]:not(:checked) + .wpcf7-list-item-label {
    opacity: 0.4;
}

/* disabled時のスタイル */
.custom-checkbox input[type=checkbox]:disabled + .wpcf7-list-item-label {
    color: #4a4a4a;
}

.custom-checkbox input[type=checkbox]:disabled + .wpcf7-list-item-label::after {
    border-right: 3px solid #4a4a4a;
    border-bottom: 3px solid #4a4a4a;
}

/* 購入依頼フォームの追加使用者枠 */
.add-user-group{
    margin: 10px 0 0 0;
}
.add-user-group p {
    display: block;
    margin-bottom: 5px;
}

/* 送信ボタンのデザイン */
.wpcf7-submit{
    display: block;
    margin: 10px auto;
    width: auto;
    padding: 0 3em;
    height: 2.5em;
    background: #7da3a1;
    color: #fff;
    font-size: 15px;
    border-radius: 5px;
    border: none;
    transition: background-color 0.3s ease;
    cursor: pointer;
}
.wpcf7-submit:hover{
    color: #fff;
    background: #324851;
}
.wpcf7-submit:disabled {
    background: #ccc;
}

/* フォーム上部に表示されるエラーメッセージを非表示 */
/* .screen-reader-response {
    display: none;
} */

/* フォーム内バリデーションエラーメッセージのデザイン */
.wpcf7-not-valid-tip{
    box-sizing: border-box;
    border-radius: 5px;
    background-color: #f59f49;
    color: #fff;
    display: block;
    font-size: 0.8rem;
    font-weight: bold;
    margin-top: 10px;
    padding: 5px 10px;
    position: relative;
}
.wpcf7-not-valid-tip::before{
    content: "";
    border: 10px solid transparent;
    border-bottom: 15px solid #f59f49;
    position: absolute;
    top: -20px;
    left: 5%;
}

/* 送信後メッセージのデザイン */
/* 送信ボタン下成功時 */
.wpcf7 form.sent .wpcf7-response-output {
    background:rgba(125,163,161,0.2);
    color: #34675c;
    padding: 10px 15px;
    border-radius: 5px;
    border: none;
}
.wpcf7 form.sent .wpcf7-response-output:before {
    content: "\f058";
    display: inline-block;
    color: #34675c;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    font-size: 1.2em;
    margin-right: 10px;
}
/* 送信ボタン下未入力警エラーまたはサーバーエラー */
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
    background:rgba(163,49,55,0.2);
    color: #a33137;
    padding: 10px 15px;
    border-radius: 5px;
    border: none;
}
.wpcf7 form.aborted .wpcf7-response-output:before,
.wpcf7 form.invalid .wpcf7-response-output:before,
.wpcf7 form.unaccepted .wpcf7-response-output:before {
    content: "\f071";
    display: inline-block;
    color: #a33137;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    font-size: 1.2em;
    margin-right: 10px;
}

/* スピナー非表示（送信後メッセージが下に行き過ぎるため） */
div.wpcf7 .wpcf7-spinner {
    display: none !important;
}

/* タブのデザイン */
.tab-wrap {
    display: flex;
    flex-wrap: wrap;
    margin:20px 0;
}
.tab-label {
    color: #4a4a4a;
    background: #f4f4f4;
    white-space: nowrap;
    text-align: center;
    order: -1;
    position: relative;
    z-index: 1;
    cursor: pointer;
    border-radius: 10px 10px 0 0;
    border: 1px solid #ddd;
    flex: 1;
    padding: 1em 1em;
}
.tab-content {
    width: 100%;
    height: 0;
    overflow: hidden;
    opacity: 0;
    border-radius: 6px;
    box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
    background-color: #fff;
}
.tab-switch:checked+.tab-label {
    background: #7da3a1;
    color: #fff;
    font-weight: bold;
    border: none !important;
}
.tab-switch:checked+.tab-label+.tab-content {
    height: auto;
    overflow: auto;
    padding: 15px;
    opacity: 1;
    transition: .5s opacity;
}
.tab-switch {
    display: none;
}

/* コメントフォームのテーブルデザイン */
.table-comment{
    border-collapse: collapse;
    width: 100%;
    overflow: hidden;
    border: 0 !important;
}
.table-comment tr{
    border: 0 !important;
    border-bottom: 8px solid transparent !important;
}
.table-comment td{
    border: 0 !important;
}

/* コメントラベル */
.input-req-comment{
    border-right: 0 !important;
    text-align: left;
    white-space: nowrap;
    color: #7da3a1;
}
.div-comment{
    padding: 10px 20px 10px 20px;
    border-bottom: solid 1px #ddd;
}
.span-comment{
    margin-left: 20px;
}
.p-comment{
    margin: 5px 0 5px 0;
}

/* star-rating　コメントレビュー歴内表示用 */
.star5-rating-comment{
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: LightGray;
    font-size: 1rem;
}
.star5-rating-comment:before, .star5-rating-comment:after{
    content: '★★★★★';
}
.star5-rating-comment:after{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #f59f49;
}
.star5-rating-comment[data-rate="5"]:after{ width: 100%; } /* 星5 */
.star5-rating-comment[data-rate="4"]:after{ width: 80%; } /* 星4 */
.star5-rating-comment[data-rate="3"]:after{ width: 60%; } /* 星3 */
.star5-rating-comment[data-rate="2"]:after{ width: 40%; } /* 星2 */
.star5-rating-comment[data-rate="1"]:after{ width: 20%; } /* 星1 */
.star5-rating-comment[data-rate="0"]:after{ width: 0%; } /* 星0 */
.wpcf7-list-item {
    margin: 0;
}

/* コメントレビュー内の送信ボタン用 */
#wpcf7-f4288-o3 .wpcf7-submit{
    background-color: #324851;
    border-color: transparent;
    border-width: 1px;
    border-radius: 2px;
    font-size: 0.75rem;
    color: #fff;
    cursor: pointer;
    justify-content: center;
    padding-bottom: calc(0.5em - 1px);
    padding-left: 1em;
    padding-right: 1em;
    padding-top: calc(0.5em - 1px);
    text-align: center;
    white-space: nowrap;
    width: auto;
    display: inline-block;
    margin: 0;
    cursor: pointer;
}
#wpcf7-f4288-o3 .wpcf7-submit:hover{
    color: #fff;
    background: #7da3a1 !important;
}
#wpcf7-f4288-o3 .wpcf7-submit:disabled {
    background: #ccc !important;
}

/* star-rating　図書一覧内表示用 */
.star5-rating-list{
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: LightGray;
    font-size: 15px;
}
.star5-rating-list:before, .star5-rating-list:after{
    content: '★★★★★';
}
.star5-rating-list:after{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #f59f49;
}
.star5-rating-list[data-rate="5"]:after{ width: 100%; } /* 星5 */
.star5-rating-list[data-rate="4"]:after{ width: 80%; } /* 星4 */
.star5-rating-list[data-rate="3"]:after{ width: 60%; } /* 星3 */
.star5-rating-list[data-rate="2"]:after{ width: 40%; } /* 星2 */
.star5-rating-list[data-rate="1"]:after{ width: 20%; } /* 星1 */
.star5-rating-list[data-rate="0"]:after{ width: 0%; } /* 星0 */

/* モーダルダイアログ */
.info-item{
    border-bottom: 1px solid #eee;
    margin-bottom: 10px;
}
.info-row {
    display: flex;
}
.info-row .label {
    font-weight: bold;
    color: #4a4a4a;
}
.info-row .value {
    flex: 1;
    word-break: break-word;
}
.review-modal {
    background-color: #7da3a1;
}
.delete-modal {
    background-color: #a33137;
}
.modal-card-title {
    color: #fff;
}

.no-show-message {
    color: #324851;
    text-align: center;
    font-weight: bold;
    margin: 10px 0px;
}
.no-edit-message {
    color: #dc3545;
    text-align: center;
    font-weight: bold;
    margin: 10px 0px;
}

/* content-archiveスタイル */
.archive-title {
    font-size: 1.1rem;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
.archive-title a:hover{
    text-decoration: underline;
}
.archive-category {
    margin-left: 10px;
}
.archive-category a:hover{
    text-decoration: underline;
}
.archive-excerpt {
    font-size: 0.9rem;
    margin-top: 1rem;
    margin-bottom: 1rem;  
    overflow-wrap: break-word;
    word-break: break-word;
}
.archive-readmore a:hover{
    text-decoration: underline;
}

/* 一覧の状態ラベルスタイル */
/* 共通 */
.status-label {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}
/* 購入依頼 */
.status-request {
    background: #e8f3ff;
    color: #3498db;
}
/* キャンセル */
.status-cancel {
    background: #fdecec;
    color: #e74c3c;
}
/* 購入済み */
.status-purchased {
    background: #fff6df;
    color: #d4a017;
}
/* レビュー済み */
.status-reviewed {
    background: #f2e9ff;
    color: #9b59b6;
}
/* 返却済み */
.status-returned {
    background: #eeeeee;
    color: #666666;
}
/* 貸出中 */
.status-rental {
    background: #fff0f5;
    color: #e91e63;
}
/* おすすめ図書 */
.status-recommend {
    background: #eafaf1;
    color: #27ae60;
}

/* カテゴリー・おすすめ用ツールチップ */
.tooltip-wrapper {
    position: relative;
    display: inline-block;
    overflow: visible;
}
.tooltip-wrapper::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%) translateY(4px);
    background: rgba(50, 72, 81, 0.96);
    color: #fff;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 12px;
    line-height: 1.7;
    display: inline-block;
    inline-size: fit-content;
    max-width: min(320px, calc(100vw - 32px));
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: break-word;
    text-align: left;
    box-sizing: border-box;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    z-index: 9999;
}
.tooltip-wrapper::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: calc(100% + 1px);
    transform: translateX(-50%) translateY(4px);
    border-width: 6px;
    border-style: solid;
    border-color: rgba(50, 72, 81, 0.96) transparent transparent transparent;
    opacity: 0;
    visibility: hidden;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    z-index: 10000;
}
.tooltip-wrapper:hover::after,
.tooltip-wrapper:hover::before {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}
/* END BOOK REVIEW CUSTOM R-TSUCHIYA */

/* START THEME COMMON CUSTOM R-TSUCHIYA */
/* ボディ背景色 */
body {
    background-color: #fff;
}

/* タイトルの色 */
.hero.is-primary {
    background-color: #324851;
    color: #fff;
}
.hero.is-primary.is-bold {
    background-image: none;
}

/* ボタンの色 */
.button.is-primary {
	background-color: #7da3a1;
}
.button.is-primary:hover, .button.is-primary.is-hovered {
	background-color: #86ac41;
}
.button.is-primary:focus:not(:active), .button.is-primary.is-focused:not(:active) {
	box-shadow: 0 0 0 0.125em rgba(125, 163, 161, 0.25);
}
.button.is-primary:active, .button.is-primary.is-active {
	background-color: #86ac41;
	border-color: transparent;
	color: #fff;
}
.button.is-primary[disabled], fieldset[disabled] .button.is-primary {
	background-color: #7da3a1;
}
.button.is-primary.is-outlined {
	border-color: #7da3a1;
	color: #7da3a1;
}
.button.is-primary.is-outlined:hover, .button.is-primary.is-outlined.is-hovered, .button.is-primary.is-outlined:focus, .button.is-primary.is-outlined.is-focused {
	background-color: #7da3a1;
	border-color: #7da3a1;
}
.button.is-primary.is-outlined.is-loading::after {
	border-color: transparent transparent #7da3a1 #7da3a1 !important;
}
.button.is-info {
    background-color: #324851;
    border-color: transparent;
    color: #fff;
}
.button.is-info:hover, .button.is-info.is-hovered {
    background-color: #7da3a1;
    border-color: transparent;
    color: #fff;
}
.button.is-info[disabled] {
    background-color: #4a4a4a;
    border-color: #fff;
}
.button.is-info.is-outlined {
    background-color: transparent;
    border-color: #324851;
    color: #324851;
}
.button.is-info.is-outlined:hover, .button.is-info.is-hovered {
    background-color: #324851;
    border-color: transparent;
    color: #fff;
}
.button.is-info:focus:not(:active), .button.is-info.is-focused:not(:active) {
	box-shadow: 0 0 0 0.125em rgba(125, 163, 161, 0.25);
}
.button.is-danger {
    background-color: #a33137;
    border-color: transparent;
    color: #fff;
}
.button.is-danger:hover, .button.is-danger.is-hovered {
    background-color: #6a2023;
    border-color: transparent;
    color: #fff;
}

/* テキスト色調整 */
.has-text-success {
    color: #7da3a1 !important;
}

/* パネルの色調整 */
.panel {
    background-color: #fff;
}
.panel.is-dark .panel-heading {
    background-color: #7da3a1;
    color: #fff;
    margin-bottom: 0.5rem;
}
.panel-heading:hover {
    opacity: 0.9;
}
.panel-block {
    color: #324851;
}

/* aタグの色調整 */
a {
    color: #324851;
}
a:hover {
    color: #7da3a1;
}
.card-content a:hover {
    color: #7da3a1;
    text-decoration: underline;
}
.breadcrumb a {
    color: #324851;
}
.breadcrumb a:hover {
    color: #7da3a1;
    text-decoration: underline;
}

/* 右カラム（サイドバー）を非表示 */
.columns.is-desktop > .column:last-child {
  display: none !important;
}

/* 左カラムを全幅に */
.columns.is-desktop > .column:first-child {
  width: 100% !important;
  flex: none !important;
}

/* コメント数非表示 */
.comment-number {
  display: none !important;
}
.single .level-right .level-item a[href="#respond"] {
  display: none;
}
.box .table thead th:last-child,
.box .table tbody td:last-child {
  display: none;
}

/* 全セルにボーダー */
.content table td,
.content table th {
  border: 1px solid #ddd;
}

/* 最下行も表示 */
.content table tbody tr:last-child td,
.content table tbody tr:last-child th {
  border-bottom: 1px solid #ddd !important;
}

/* ホームパネルの全て表示ボタン */
.panel-block .button {
    font-size: 0.9rem;
}

/* ホームパネルの最後の投稿の下線非表示 */
.panel .panel-block:last-of-type {
    border-bottom: none;
}

/* ボタンがないパネルの最後の投稿に余白 */
.panel:not(:has(.panel-block-button)) {
    padding-bottom: 0.5rem;
}
/* ボタンがあるパネルだけ、ボタンの下に余白 */
.panel:has(.panel-block-button) .panel-block-button {
    padding-bottom: 0.8rem;
}

/* 並び替え（左のselect）だけ非表示 */
/* 左の「newest」セレクトを丸ごと消す */
form#order .level-item:first-child {
    display: none !important;
}

/* ページ内コンテンツマップ */
#toc_container.toc_light_blue {
    background: #f7f7f7;
}

/* モーダル内ボタンの右寄せ */
.modal-card-foot {
    justify-content: flex-end;
}

/* セレクトボックスの色調整 */
.select.is-primary:not(:hover)::after {
	border-color: #324851;
}
.select.is-primary select {
	border-color: #324851;
}
.select.is-primary select:hover, .select.is-primary select.is-hovered {
	border-color: #324851;
}
.select.is-primary select:focus, .select.is-primary select.is-focused, .select.is-primary select:active, .select.is-primary select.is-active {
	box-shadow: 0 0 0 0.125em rgba(50, 72, 81, 0.25);
}

/* パンくずのマージン調整 */
.breadcrumbs-wrapper > .level:not(:last-child) {
    margin-bottom: 0;
}
.breadcrumbs-wrapper > .level:last-of-type {
    margin-bottom: 20px !important;
}

/* ナビバータイトル調整 */
.navbar-item {
  color: #324851 !important;
}
.navbar-start > a.menu-item span {
    position: relative;
}
.navbar-start > a.menu-item span::after {
    content: "";
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: -4px;
    height: 1px;
    background: currentColor;
    opacity: 0;
    transition: all .22s ease;
}
.navbar-start > a.menu-item:hover span::after {
    left: 0;
    right: 0;
    opacity: 1;
}
a.navbar-item:hover,
a.navbar-item:focus {
    background: transparent !important;
}
@media screen and (min-width: 1024px) {
    .navbar-menu {
        display: flex;
        align-items: flex-end !important;
    }
    .navbar-end {
        display: flex;
        align-items: flex-end !important;
    }
    .navbar-brand {
        display: flex;
        align-items: flex-end !important;
        min-height: unset !important;
    }
    .navbar-brand .navbar-item {
        display: flex;
        align-items: flex-end !important;
        font-size: 2rem;
        font-weight: bold;
    }
    .navbar.is-spaced .navbar-start, .navbar.is-spaced .navbar-end {
        font-size: 0.9rem;
    }
    .header-user {
        width: 100%;
        text-align: right;
        padding-right: 0.75rem;
    }
}
@media screen and (max-width: 1023px){
    .header-user {
        display: none;
    }
    .brand-description {
        display: none;
    }
    .navbar-brand .navbar-item {
        font-size: 1.5rem;
        font-weight: bold;
    }
    .navbar-brand {
        align-items: center !important;
    }
}

/* スマホ用ブルーバック消去 */
a {
    -webkit-tap-highlight-color: rgba(0,0,0,0.1);
}

/* ページボタン */
.page-numbers {
    color: #324851;
}
.page-numbers.current {
    background-color: #324851;
    border-color: #324851;
}

/* フッター最新リンクの色調整 */
footer .wp-block-latest-posts a:hover {
    text-decoration: underline;
}

/* サイトマップスタイル変更 */
/* 丸消す */
.content ul,
.content ul li {
    list-style: none !important;
}
/* 大カテゴリ */
.wsp-category-title {
    display: block;
    font-weight: bold;
    padding-bottom: 5px;
    border-bottom: 1px dotted #ccc;
    margin-bottom: 8px;
}
/* リスト */
.wsp-posts-list li {
    position: relative;
    padding-left: 20px;
}
.wsp-posts-list li a:hover {
    text-decoration: underline;
}
/* 1階層（caret-square-right） */
.wsp-posts-list li::before {
    content: "\f152";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 3px;
    color: #324851;
    font-size: 12px;
}
/* 2階層（angle-right） */
.wsp-posts-list > li > ul > li::before {
    content: "\f101";
}
/* 3階層（angle-double-right） */
.wsp-posts-list > li > ul > li > ul > li::before {
    content: "\f105";
}

/* 右寄せ */
.has-text-right {
    text-align: right !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

/* ログインフォーム */
#wpmem_restricted_msg {
    text-align: center;
}
/* 全体カード風 */
#wpmem_login {
    max-width: 500px;
    margin: 0 auto;
    padding: 10px 50px;
    background: #f7f7f7;
    margin-bottom: 50px;
}
@media(max-width:767px) {
    #wpmem_login {
        min-width: 100%;
        padding: 30px;
        background: #f7f7f7;
        margin-bottom: 50px;
    }
}
#wpmem_login legend, #wpmem_reg legend {
    margin-bottom: 30px !important;
}
/* 入力欄 */
#wpmem_login input[type="text"],
#wpmem_login input[type="password"] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
}
/* ログインボタン */
#wpmem_login input[type="submit"] {
    width: 100%;
    background: #7da3a1;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    padding: 8px 15px 8px 15px;
    margin-top: 40px;
}
/* ホバー */
#wpmem_login input[type="submit"]:hover {
    background: #324851;
}
/* ログインエラー */
.wpmem_msg {
    background: none !important;
    border: none !important;
    padding: 0px !important;
    margin-bottom: 20px;
    text-align: center;
    margin: 0 auto 20px !important;
    color: #dc3545;
}
.wpmem_msg p {
    margin: 0 !important;
}

/* インプットのフォーカス時の色調整 */
.input:focus {
    border-color: #324851;
    box-shadow: 0 0 0 0.125em rgba(50, 72, 81, 0.25);
}

/* サイトマップのリスト調整 */
@media (max-width: 767px) {
  .page-id-127 .wsp-posts-list {
    margin-left: 0;
    padding-left: 0;
  }
}

/* コメントテキストエリアの調整 */
#commentform textarea {
    border: 1px solid #ddd;
    box-shadow: none;
}
#commentform textarea.textarea:focus {
    border-color: #324851 !important;
    box-shadow: none !important;
    outline: none;
}
#commentform textarea:hover {
    border-color: #ddd;
}

/* コメントキャンセルボタン */
#cancel-comment-reply-link {
    color: #a33137;
    border: 1px solid #a33137;
    background-color: #fff;
}
#cancel-comment-reply-link:hover,
#cancel-comment-reply-link:focus,
#cancel-comment-reply-link:active {
    color: #fff;
    border-color: #a33137;
    background-color: #a33137;
    box-shadow: none;
}

/* コンテント内の改行 */
.content a {
    overflow-wrap: anywhere;
    word-break: break-word;
}
/* END THEME COMMON CUSTOM R-TSUCHIYA */