/*   コメントヘッダー   */
@charset "utf-8";
/*
Theme Name: hirokikashiwagi
Theme URI: テーマのホームサイトのURL
Description: 柏木広樹のwebサイト
Author: oshimo
Version:1.0
License:
License URI:
Text Domain: hirokikashiwagi
Tested up to: 6.0
Requires PHP: 7.4.21 
*/

/*  

category共通
category-discography
single
single-news_only-member
single-live
single-discography

*/

/*-------------------------------------------
category共通
-------------------------------------------*/

.pc_none{
    display: none;
    }
    @media (max-width: 499px){
    .pc_none{
    display: block;
    }
    .sp_none{
    display: none;
    }
    }


.main.cat .wrapper{
margin-bottom: 50px;
}

.cat_title-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
padding: 50px 0;
}

.cat_title-wrapper .page-title {
font-family: Palatino, Georgia ,yumincho , 'yu mincho';
color: #0d2a67;
font-size: 2rem;
}

.select_wrap {
position: relative;
width: 184px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
position: relative;
font-weight: bold;
font-size: 0.825rem;
font-family: 'Hiragino Kaku Gothic ProN';
box-sizing: border-box;
border: #222 solid 1px;
transition: .3s;
cursor: pointer;
}

select{
    color: #0d2a67;
}

.select_wrap:after {
content: "";
position: absolute;
right: 30px;
top: 20px;
width: 8px;
height: 8px;
border-top: 2px solid #222;
border-left: 2px solid #222;
transform: translateY(-50%) rotate(-135deg);
font-size: 20px;
pointer-events: none;
}

#categories > select{
padding: 16px 30px;
cursor: pointer;
position: relative;
width: 100%;
}

.select_wrap:hover{
background-color:#d4ddf1 ;
}

.cat_fv > img {
width: 100%;
}

.cat .wrapper {
max-width: 1100px;
margin: 0 auto;
padding: 0 20px;
box-sizing: content-box;
}

.hide {
display: none;
}

@media (max-width: 499px){
.cat_title-wrapper {
    padding: 24px 0;
}
.select_wrap {
    width: 100%;
}
#categories > select{
    padding: 12px 24px 12px 16px;
}
.select_wrap:after {
    right: 10px;
    top: 18px;
    width: 6px;
    height: 6px;
}
.cat_title-wrapper .page-title{
    font-size:1.5rem ;
}
}

/*-------------------------------------------
category-live
-------------------------------------------*/
/* live/discography共通 ここから */

.live_filter > .tab.is-active,
.category-discography .disco_filter > .disco_filter-all,.category-cd .disco_filter > .cd
,.category-video .disco_filter > .video,.category-score .disco_filter > .score{
background-color: #0d2a67;
cursor: pointer;
}

.live_filter > .tab.is-active,
.category-discography .disco_filter > .disco_filter-all > a,.category-cd .disco_filter > .cd > a
,.category-video .disco_filter > .video > a ,.category-score .disco_filter > .score > a{
color: #fff;
}

.live_filter,.disco_filter{
display: flex;
}

.live_filter > a,.disco_filter > li{
list-style: none;
cursor: pointer;
background-color: #e5e5e5;
}

.live_filter > li:hover,.disco_filter > li:hover{
background-color: #d9d9d9;
}

.live_filter > a ,.disco_filter > li > a{
color: #0d2a67;
display: block;
padding: 8px 0px;
width: 80px;
font-size: 0.875rem;
text-align: center;
}

@media (max-width:599px) {
.cat_title-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    padding: 40px 0;
}
}

/* live/discography共通 ここまで */

.live_list {
display: flex;
flex-wrap: wrap;
list-style: none;
text-align: center;
justify-content: flex-start;
align-items: flex-start;
gap: 24px;
transition: ease-in-out;
}

.live_list  .box{
width: calc((100% / 3) - (24px * 2 / 3));
margin-bottom: 40px;
}

.live_filter .live_filter-all{
background-color: #0d2a67;
color: #fff;
}

.live-info{
max-width: 300px;
margin: 0 auto;
}

.live-info h3{
line-height: 170%;
}


.live_list > .box > a {
color: #222;
display: block;
}

.live_list  .size-thumbnail {
width: 300px;
height: 200px;
aspect-ratio: 3 / 2;
object-fit: contain;
object-position: center;
}

.live_list li .cat.live-live {
font-size: 0.625rem;
background-color: #0d2a67;
color: #fff;
padding: 4px 0;
width: 56px;
text-align: center;
margin: 0 auto;
}

.live_list li .cat {
font-size: 0.625rem;
background-color: #fff;
color: #0d2a67;
border: 1px solid #0d2a67;
padding: 4px 0;
width: 56px;
text-align: center;
margin: 0 auto;
}

.live_list  h3 {
padding-top: 8px;
font-size: 0.875rem;
}

.live_list .date{
font-size: 0.625rem;
padding-top: 8px;
}

.box.is-show{
    display:block;
}

@media (max-width:1099px) {
    .live_list  .size-thumbnail{
    width: 280px;
    height:auto;
}
.live-info{
    max-width: 280px;
    margin: 0 auto;
}
.live-list .tag_wrapper{
    padding-top: 8px;
}
}

@media (max-width:959px) {
.live-list  .size-thumbnail{
    width: 300px;
    height:auto;
}
.live-info{
    max-width: 100%;
    margin: 0 auto;
}
.live_list .box{
    width:calc((100% / 2) - (24px * 1 / 2));
    
}
}

@media (max-width:699px) {
.live_list .box{
    width: 100%;
    margin-bottom: 0;
}
.live-list  .size-thumbnail{
    width:100%;
    height:auto;
}
.live-info{
    max-width: 300px;
    margin: 0 auto;
}
}

@media (max-width:359px) {
.live_list  .size-thumbnail{
    max-height:270px;
    max-width: 270px;
}
.live-info{
    width: 270px;
}
.live_filter > li > a{
    width: 70px;
}
}

/*-------------------------------------------
category-discography
-------------------------------------------*/
.discography_list {
display: flex;
flex-wrap: wrap;
list-style: none;
text-align: center;
justify-content: flex-start;
align-items: center;
}

.discography_list .box{
width: calc(100% / 3);
margin-bottom: 40px;
}

.box{
opacity: 0;
transform: translate3d(0, 100px, 0);
transition: opacity 1s, transform 1s;
}

.box.is-animated img:hover{
opacity: .8;
}

.box.is-animated {
opacity: 1;
transform: translate3d(0, 0, 0);
}

.discography_list .fadein{
opacity: 1;
}

.discography_list .box h3 {
padding-top: 12px;
font-size: 1rem;
}

.discography_list  a{
text-decoration: none;
color: #222;
display: block;
}

.discography_list img{
box-shadow: 0px 0px 15px -5px #888;
max-height:300px;
max-width: 300px;
}

/* アスペクト比に関わらず、画像を左右上下中央寄せ */
.discography_list .img_wrapper{
display: flex;
justify-content: center;
align-items: center;
height:300px;
width: 300px;
margin: 0 auto;
}

.discography_list .box .cat {
font-size: 0.625rem;
background-color: #0d2a67;
color: #fff;
padding: 4px 0;
display: inline-block;
width: 56px;
text-align: center;
}

.discography_list .box .cat + .cat {
margin-left: 18px;
}

.discography_list .tag_wrapper{
padding-top: 12px;
}

.single.discography .flex_container{
display: flex;
}

@media (max-width:1099px) {
.discography_list img{
    max-height:240px;
    max-width: 240px;
}
.discography_list .img_wrapper{
    height:240px;
    width: 240px;
}
.discography_list .tag_wrapper{
    padding-top: 8px;
}
}

@media (max-width:859px) {
.discography_list .box{
    width: calc(100% / 2);
}
}

@media (max-width:599px) {
.discography_list .box{
    width: 100%;
    margin-bottom: 30px;
}
.discography_list img{
    max-height:320px;
    max-width: 320px;
}
.discography_list .img_wrapper{
    height:320px;
    width: 320px;
}
}

@media (max-width:359px) {
.discography_list img{
    max-height:270px;
    max-width: 270px;
}
.discography_list .img_wrapper{
    height:270px;
    width: 270px;
}
.disco_filter > li > a{
    width: 70px;
}
}

/*-------------------------------------------
single
-------------------------------------------*/
#single {
padding-bottom: 80px;
}

.cat-h2{
font-weight: bold;
font-size:2rem;
font-family: Palatino, Georgia;
color: #0d2a67;
border: none;
padding: 0;
margin-bottom: 50px;
}

/* wp投稿整形css ここから */
.main.single {
background: white;
padding-left:20px;
padding-right: 20px;
box-sizing: content-box;
max-width: 940px;
margin: 0 auto;
}

/* 投稿タイトル -必須- */
.main.single h1 {
font-weight: bold;
font-size: 24px;
color: #0d2a67;
margin: 0;
border-bottom: 1px solid #ddd;
padding: 16px 0;
}

#single .cat {
font-size: 0.75rem;
background-color: #0d2a67;
color: #fff;
padding: 4px;
min-width: 56px;
text-align: center;
display: inline-block;
margin-right: 8px;
}

#single .date {
font-size: 0.875rem;
color: #666;
display: inline-block;
}

.main .wysiwyg-editor h2{
font-weight: bold;
font-size: 1rem;
margin: 32px 0 0 0;
padding: 10px;
color: #0d2a67;
}

.main .wysiwyg-editor h3 {
font-size: 1rem;
font-weight: bold;
margin: 24px 0 0 0;
}

.main.wysiwyg-editor h4 {
font-size: 0.875rem;
margin: 24px 0 0 0;
}

.main .wysiwyg-editor h2:first-child,
.main .wysiwyg-editor h2+h3,
.main .wysiwyg-editor h3+h4 {
margin-top: 24px;
}

.main .wysiwyg-editor p,
.main .wysiwyg-editor ul,
.main .wysiwyg-editor ol,
.main .wysiwyg-editor table {
margin: 16px 0 0 0;
font-size: 0.875rem;
line-height: 1.7;
}

.main p{
line-height: 1.7;;
}

.main .wysiwyg-editor ul,
.main .wysiwyg-editor ol {
margin-left: 0px;
}

.main .wysiwyg-editor ul {
list-style-type: disc;
}

.main .wysiwyg-editor ol {
list-style-type: decimal;
}

.main .wysiwyg-editor table {
border-collapse: collapse;
}

.main .wysiwyg-editor table th,
.main .wysiwyg-editor table td {
/*border: 1px solid #ddd;*/
padding: 10px;
}

.main .wysiwyg-editor .wp-block-table figcaption {
font-size: 14px;
line-height: 1.6;
color: #666;
margin: 10px 0 0 0;
}

/* 画像投稿 */
.wp-block-image {
margin-top: 24px;
}

.back-to-cat {
background-color: #fff;
min-width: 184px;
padding: 16px 24px;
border: 1px solid #0d2a67;
margin: 50px auto 0;
font-size: 0.875rem;
text-decoration: none;
color: #0d2a67;
font-weight: 600;
display: block;
transition: .3s;
}

.back-to-cat:hover {
background-color: #eee;
}

.back-to-cat img {
height: 16px;
vertical-align: middle;
padding-right: 8px;
}

.wp-block-image .alignleft{
float: none;
}

@media (max-width:599px){
.main .wysiwyg-editor table td {
display: block;
}
}

/* 動画投稿 */
.wp-block-embed__wrapper{
margin-top: 24px;
}

.wp-block-table {
overflow-x:visible;
}

@media (max-width:899px) {
.cat-h2 {
    font-size:1.125rem;
    margin-bottom: 24px;
}
}

@media (max-width:599px) {
.main.single h1 {
    font-size: 1rem;
}
.back-to-cat {
    padding: 14px 24px;
    margin: 32px auto 0;
}
#single{
    padding-bottom: 40px;
}
}

/*-------------------------------------------
single-news_only-member
-------------------------------------------*/

.page_pass_wrap {
margin: 0 auto;
padding: 50px 20px;
}

.page_pass_input {
border: 1px solid #0d2a67;
display: block;
font-size: 16px;
padding: 10px;
width: 100%;
}

.page_pass_text {
text-align: center;
margin-bottom: 24px;
font-size:0.875rem ;
}

.page_pass_submit {
background: #0d2a67;
border: solid 1px #081e4d;
box-shadow: 0 1px 2px rgba(0,0,0,.2);
cursor: pointer;
color: #fff;
font-weight: 600;
display: block;
font-size: 1rem;
padding: 10px 0;
width: 100%;
-webkit-appearance: none;
}

.page_pass_submit:hover {
opacity: 0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha(opacity=70)";
}

.page_pass{
max-width: 380px;
margin: 0 auto!important;
box-sizing: border-box;
}

.only_member_img{
width:380px;
height: 110px; 
margin:0 auto 32px; 
display:block;
background-image: url(img/members_banner.png);
background-size: contain;
}

@media(max-width:459px) {
.page_pass_wrap {
    padding:20px 0px;
}
.only_member_img{
    width:100%;
    height: 110px; 
    background-position: center;
}
}

/*-------------------------------------------
single-Live
-------------------------------------------*/
.main.single.Live .wysiwyg-editor table,.main.single.Live .wysiwyg-editor table tr {
border: 1px solid #ddd;
}

/* ライブアーカイブ */
.archive_ttl{
font-family: Palatino, Georgia ,yumincho ,'yu mincho';
color: #0d2a67;
font-size: 2rem;
}

/*-------------------------------------------
single-discography
-------------------------------------------*/
.main.discography{
max-width: 1100px;
}

.main.discography h1 {
border: none;
padding: 0;
margin-bottom: 16px;
}

.flex_container{
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 40px;
}

.contnts_wrapper{
width: 100%;
}

.inner_flex_container{
display: flex;
width: 100%;
justify-content: space-between;
align-items: flex-start;
}

.inner_flex_container h3{
margin-bottom: 24px;
}

.main.discography .img_wrapper img{
height: 330px;
max-width: 330px;
width: 100%;
object-fit: contain;
object-position:center;
}

.to-shop {
background-color: #0d2a67;
width: 160px;
padding: 16px 0;
font-size: 0.875rem;
text-decoration: none;
color: #fff;
font-weight: 600;
display: block;
margin-bottom: 24px;
}

.to-shop:hover{
background-color: #203F81;
}

.to-shop img {
height: 18px;
vertical-align: middle;
padding-left: 8px;
}

.main.discography .tag_wrapper{
margin-bottom: 24px;
}

.main.discography .info_wrapper{
color: #666;
margin-bottom: 24px;
}

.main.discography .wysiwyg-editor{
margin-bottom: 24px;
}

/* table設定 */
.main.discography table {
counter-reset: rowCount;
width: 100%;
}

.main.discography table > tbody > tr > td {
counter-increment: rowCount;
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc;
padding: 16px 24px;
}

.main.discography table > tbody > tr > td:first-child::before {
content: counter(rowCount);
padding-right: 32px;
}

.main.discography th{
font-size: 1rem;
text-align: left;
padding-bottom: 8px;
}

.main.discography table,.main.discography th,td{
border-collapse: collapse;
}

@media (max-width:899px) {
.flex_container{
    flex-direction:column ;
    align-items: center;
    gap: 24px;
}
.inner_flex_container{
    display: flex;
    flex-direction:column ;
    align-items: center;
}
.inner_flex_container h3,.main.discography .tag_wrapper,.main.discography .info_wrapper,.main.discography .wysiwyg-editor{
    margin-bottom: 16px;
}
.flex_left{
    text-align: center;
}
.to-shop {
    background-color: #0d2a67;
    width: 100%;
    max-width: 330px;
    padding: 14px 0;
}
.to-shop img {
    height: 18px;
    vertical-align: middle;
    padding-left: 8px;
}
.main.discography table > tbody > tr > td {
    padding: 12px ;
}
.main.discography table > tbody > tr > td:first-child::before {
    padding-right: 16px;
}
}

@media (max-width:599px){
.main.single .wysiwyg-editor table td {
    padding: 8px 12px ;
    display: block;
}
.main.single .wysiwyg-editor table td + td{
    padding-top: 0px ;
}
}