@charset "UTF-8";

/*
================================================================
 ページヘッダー
================================================================
*/

.subpage-header {
    display: block;
    padding: 65px 0 40px;
    background-color: var(--themeval-color-theme-15);
    background-image: linear-gradient(45deg, var(--themeval-color-theme-15), var(--themeval-color-theme-14));
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: 50% 50%;
}
.subpage-header__heading {
    display: block;
    margin: 0;
    padding: 0;
    text-align: center;
    line-height: 1.5;
}
.subpage-header__heading .this__title {
    display: block;
    color: var(--themeval-color-theme-text-black);
    font-size: calc( 40rem / var(--themeval-root-font-size) );
    font-weight: 700;
}
.subpage-header__heading .this__subtitle {
    margin: 4px 0 0;
    display: block;
    color: var(--themeval-color-theme-text-white);
    font-size: calc( 34rem / var(--themeval-root-font-size) );
    font-weight: 700;
}

.subpate-breadcrumb {
    padding: 15px 0 25px;
}
.breadcrumb-nav {
    display: block;
    margin: 0;
    padding: 0;
    list-style-type: none;
    color: var(--themeval-color-theme-text-black);
    font-size: calc( 14rem / var(--themeval-root-font-size) );
    font-weight: 500;
}
.breadcrumb-nav > li {
    display: inline-block;
    margin: 0;
    padding: 0 0.4em 0 0;
    list-style-type: none;
}
.breadcrumb-nav > li:not(:first-child) {
    padding-left: 1.6em;
}
.breadcrumb-nav > li:not(:first-child)::before {
    content: "";
    display: inline-block;
    width: 1.2em;
    height: 0.8em;
    margin: 0 0.4em 0 -1.6em;
    padding: 0;
    text-align: center;
    background-image: url(../img/ico/ico_link_simple_black.svg);
    background-repeat: no-repeat;
    background-size: 1.4em 1.4em;
    background-position: 50% 50%;
}

.breadcrumb-nav > li a {
    color: inherit;
    text-decoration: inherit;
    opacity: 1;
    transition: opacity var(--themeval-hover-transition);
}
html:not(.agent-prop--Touch) .breadcrumb-nav > li a:hover {
    opacity: var(--themeval-hover-opacity); /* $hover-opacity */
}


@media (max-width: 767px) {
        
    .subpage-header {
        padding: 40px 0 30px;
    }
    .subpage-header__heading .this__title {
        font-size: calc( 24rem / var(--themeval-root-font-size) );
    }
    .subpage-header__heading .this__subtitle {
        margin: 2px 0 0;
        font-size: calc( 18rem / var(--themeval-root-font-size) );
    }

    .subpate-breadcrumb {
        padding: 10px 0 25px;
    }
    .breadcrumb-nav {
        font-size: calc( 12rem / var(--themeval-root-font-size) );
    }

}


/*
================================================================
 WPブロック
================================================================
*/

.main-content-block {
    min-height: 100vh;
    min-height: 100lvh;
}

.main-content-block.content-block-area {
    margin-top: 40px;
    margin-bottom: 120px;
    min-height: calc(100vh - var(--themeval-global-header-height) - var(--main-content-bottom) - 120px);
}
.main-content-block.content-block-area.no-margin-bottom {
    margin-bottom: 0;
    min-height: calc(100vh - var(--themeval-global-header-height) - var(--main-content-bottom));
}

.main-content-block.content-block-area.no-min-height {
    min-height: 0 !important;
}

@media (max-width: 767px) {
    .main-content-block.content-block-area {
        margin-top: 20px;
        margin-bottom: 80px;
        min-height: 0;
    }
}



/*
================================================================
 デザインフッター
================================================================
*/

.design-footer {
    display: block;
    width: 100%;
}
.design-footer-layout {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
}
.design-footer-layout .this__catch {
    display: block;
    width: 460px;
    max-width: calc( 100% * 460 / 1100 );
    margin: 0 calc( 50% - 100% * 230 / 1100 ) calc( -100% * 120 / 1100 );
    padding: 0;
}
.design-footer-layout .this__catch img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}
.design-footer-layout .this__junior,
.design-footer-layout .this__senior {
    display: block;
    width: 380px;
    max-width: calc( 100% * 380 / 1100 );
    padding: 0;
    aspect-ratio: 38/28;
    transform: translateX(5%);
}
.design-footer-layout .this__junior {
    margin: 0 calc( 50% - 100% * 380 / 1100 ) 0 0;
}
.design-footer-layout .this__senior {
    margin: 0 0 0 calc( 50% - 100% * 380 / 1100 );
}
.design-footer-layout .this__junior img,
.design-footer-layout .this__senior img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    object-fit: cover;
    object-position: center top;
}

@media (max-width: 639px) {

    .design-footer-layout .this__catch {
        max-width: 90%;
        margin: 0 0 0;
    }
    .design-footer-layout .this__junior,
    .design-footer-layout .this__senior {
        max-width: 50%;
        aspect-ratio: 60/50;
        transform: none;
    }
    .design-footer-layout .this__junior {
        margin: 0 0 0 0;
    }
    .design-footer-layout .this__senior {
        margin: 0 0 0 0;
    }

}






/*
================================================================
 投稿システム
================================================================
*/

.post-system-block {
    display: block;
}


/*
================================================================
 投稿システム カテゴリーアイコン
================================================================
*/

.post-system-block__category-icon {
    display: block;
    box-sizing: border-box;
    min-width: 6em;
    border: 0.1em solid currentColor;
    padding: 0em 0.5em 0.1em;
    text-align: center;
    background-color: var(--themeval-color-theme-white);
    color: var(--themeval-color-theme-text-white);
    font-style: normal !important;
    font-weight: 700;
    font-size: 90%;
    line-height: 1.4;
}
.post-system-block__category-icon .this__ico-checked {
    position: relative;
    display: inline-block;
    vertical-align: baseline;
    box-sizing: border-box;
    width: 0.8em;
    height: 0.8em;
    margin: 0 0.4em 0 0;
}
.post-system-block__category-icon .this__ico-checked svg {
    position: absolute;
    left: -10%;
    top: -10%;
    display: block;
    width: 120%;
    height: 120%;
}


/*
================================================================
 投稿システム カテゴリーブロック
================================================================
*/

.post-system-block__category {
    display: block;
}
.post-system-block__category-current {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-end;
    width: calc(100% + 1em);
    margin: -0.5em;
    padding: 0;
}
.post-system-block__category-current > * {
    margin: 0.5em;
}
.post-system-block__category-current .post-system-block__category-icon {
    padding: 0.5em 1em 0.6em;
}
.post-system-block__category-current > .this__current .post-system-block__category-icon {
    font-size: 120%;
}
.post-system-block__category-current > a,
.post-system-block__category-current > .as-link {
    display: block;
    text-decoration: none;
    color: inherit;
}
.post-system-block__category-current ul.post-system-block__category-nav-menu {
    margin: 0;
    width: 100%;
}

.post-system-block__category .shizugaku-simple-accordion-details {
    margin-top: 1em;
}

ul.post-system-block__category-nav-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    box-sizing: border-box;
    width: calc(100% + 1em);
    margin: -0.5em;
    padding: 0;
    list-style-type: none;
}
ul.post-system-block__category-nav-menu > li.menu-item {
    display: block;
    margin: 0.5em 0.5em;
    padding: 0;
    list-style-type: none;
}
ul.post-system-block__category-nav-menu > li.menu-item > a,
ul.post-system-block__category-nav-menu > li.menu-item > .as-link {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items:flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    text-decoration: none;
    color: var(--themeval-color-theme-text-black);
}



/*
================================================================
 投稿システム 記事リスト
================================================================
*/

ul.post-system-block__list-nav-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style-type: none;
}
ul.post-system-block__list-nav-menu > li.menu-item {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 10px 5px 5px;
    list-style-type: none;
    border-bottom: 1px solid var(--themeval-color-theme-text-black);
}
ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item {
    width: 31.6667%;
    margin-left: 2.5%;
    margin-top: 2.5%;
    border-bottom: 0 none;
    padding: 0;
}
ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(3n+1) {
    margin-left: 0;
}
ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(1),
ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(2),
ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(3) {
    margin-top: 0;
}
ul.post-system-block__list-nav-menu > li.menu-item > a,
ul.post-system-block__list-nav-menu > li.menu-item > .as-link {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items:flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    text-decoration: none;
    color: var(--themeval-color-theme-text-black);
}
ul.post-system-block__list-nav-menu > li.menu-item > a .this__thumb,
ul.post-system-block__list-nav-menu > li.menu-item > .as-link .this__thumb {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 0.5em;
    padding: 0;
    background-color: var(--themeval-color-theme-white);
    border: 0.525em solid currentColor;
}
ul.post-system-block__list-nav-menu > li.menu-item > a .this__figure,
ul.post-system-block__list-nav-menu > li.menu-item > .as-link .this__figure {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: var(--themeval-color-theme-white);
    border: 2px solid var(--themeval-color-theme-white);
    aspect-ratio: 3/2;
    overflow: hidden;
}
ul.post-system-block__list-nav-menu > li.menu-item > a .this__thumb img,
ul.post-system-block__list-nav-menu > li.menu-item > .as-link .this__thumb img {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--themeval-hover-transition);
}
ul.post-system-block__list-nav-menu > li.menu-item > a .this__date,
ul.post-system-block__list-nav-menu > li.menu-item > .as-link .this__date {
    display: block;
    box-sizing: border-box;
    min-width: 5em;
    padding: 0.05em 0.5em 0.15em 0;
    font-weight: 700;
    text-align: left;
    line-height: 2;
}
ul.post-system-block__list-nav-menu > li.menu-item > a .this__category,
ul.post-system-block__list-nav-menu > li.menu-item > .as-link .this__category {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    box-sizing: border-box;
    width: calc(100% - 4em);
    margin: 0 -0.5em;
    padding: 0;
}
ul.post-system-block__list-nav-menu > li.menu-item > a .this__category > *,
ul.post-system-block__list-nav-menu > li.menu-item > .as-link .this__category > * {
    display: block;
    margin: 0.5em 0.5em;
}
ul.post-system-block__list-nav-menu > li.menu-item > a .this__title,
ul.post-system-block__list-nav-menu > li.menu-item > .as-link .this__title {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0 0 0.5em;
    font-style: normal !important;
    font-weight: 700;
    text-align: justify;
    line-height: 2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

html:not(.agent-prop--Touch) ul.post-system-block__list-nav-menu > li.menu-item > a:hover .this__thumb img {
    transform: scale(1.05);
}

@media (max-width: 959px){
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item {
        width: 48%;
        margin-left: 4%;
        margin-top: 4%;
    }
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(3n+1) {
        margin-left: 4%;
    }
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(2n+1) {
        margin-left: 0;
    }
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(3) {
        margin-top: 4%;
    }
}
@media (min-width: 640px) and (max-width: 959px){
    .post-system-block__list--limited-max ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:last-child:nth-child(2n+1):not(:first-child) {
        display: none;
    }
}
@media (max-width: 639px){
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item {
        width: 100%;
        margin-left: 0%;
        margin-top: 1em;
    }
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(3n+1) {
        margin-left: 0%;
    }
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(2n+1) {
        margin-left: 0;
    }
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(2),
    ul.post-system-block__list-nav-menu.this--with-thumb > li.menu-item:nth-child(3) {
        margin-top: 1em;
    }
}



/*
================================================================
 投稿システム ページャー
================================================================
*/

.post-system-block__pager {
    display: block;
}
.post-system-block__pager-nav {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    line-height: 1.4;
    font-size: 120%;
}
.post-system-block__pager-nav-menu-prev,
.post-system-block__pager-nav-menu-next {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    width: 3em;
}
.post-system-block__pager-nav-menu-prev .this__separator,
.post-system-block__pager-nav-menu-next .this__separator {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 1em;
    height: 1em;
}
.post-system-block__pager-nav-menu-prev .this__item,
.post-system-block__pager-nav-menu-next .this__item {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 2em;
    background-color: var(--themeval-color-theme-white);
    border: 1px solid var(--themeval-color-theme-text-black);
    border-radius: 50%;
    transition: 
        color var(--themeval-hover-transition),
        background-color var(--themeval-hover-transition),
        border-color var(--themeval-hover-transition);
}
.post-system-block__pager-nav-menu-prev .this__item::before,
.post-system-block__pager-nav-menu-next .this__item::before {
    content: "";
    display: block;
    box-sizing: content-box;
    width: 100%;
    height: 0;
    padding: 100% 0 0;
    background-image: url(../img/ico/ico_link_simple.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 30px 30px;
    opacity: 1;
    transition: opacity var(--themeval-hover-transition);
}
.post-system-block__pager-nav-menu-prev .this__item::after,
.post-system-block__pager-nav-menu-next .this__item::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    box-sizing: content-box;
    width: 100%;
    height: 0;
    padding: 100% 0 0;
    background-image: url(../img/ico/ico_link_simple_white.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 30px 30px;
    opacity: 0;
    transition: opacity var(--themeval-hover-transition);
}
.post-system-block__pager-nav-menu-prev .this__item::before,
.post-system-block__pager-nav-menu-prev .this__item::after {
    transform: rotateY(180deg);
}
.post-system-block__pager-nav-menu-prev {
    justify-content: flex-start;
}
.post-system-block__pager-nav-menu-next {
    justify-content: flex-end;
}
ul.post-system-block__pager-nav-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-items: center;
    align-items: center;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
ul.post-system-block__pager-nav-menu > li.menu-item {
    display: block;
    list-style-type: none;
    margin: 0 0.25em;
    padding: 0;
}
ul.post-system-block__pager-nav-menu > li.menu-item > a,
ul.post-system-block__pager-nav-menu > li.menu-item > .as-link {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 2em;
    color: var(--themeval-color-theme-text-black);
    background-color: var(--themeval-color-theme-white);
    border: 1px solid var(--themeval-color-theme-text-black);
    border-radius: 50%;
    text-decoration: none;
    text-align: center;
    font-weight: 700;
    transition: 
        color var(--themeval-hover-transition),
        background-color var(--themeval-hover-transition),
        border-color var(--themeval-hover-transition);
}
ul.post-system-block__pager-nav-menu > li.menu-item > .as-link {
    cursor: default;
}
ul.post-system-block__pager-nav-menu > li.menu-item.current-menu-item > a,
ul.post-system-block__pager-nav-menu > li.menu-item.current-menu-item > .as-link {
    color: var(--themeval-color-theme-text-white);
    background-color: var(--themeval-color-theme-02);
    border: 1px solid var(--themeval-color-theme-02);
}
ul.post-system-block__pager-nav-menu > li.menu-item > a::before,
ul.post-system-block__pager-nav-menu > li.menu-item > .as-link::before {
    content: "";
    display: block;
    box-sizing: content-box;
    width: 100%;
    height: 0;
    padding: 100% 0 0;
}
ul.post-system-block__pager-nav-menu > li.menu-item > a .this__no,
ul.post-system-block__pager-nav-menu > li.menu-item > .as-link .this__no {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    margin: -0.1em 0 0;
    font-style: normal;
    transform: translate(-50%,-50%);
}

html:not(.agent-prop--Touch) .post-system-block__pager-nav-menu-prev .this__item:hover,
html:not(.agent-prop--Touch) .post-system-block__pager-nav-menu-next .this__item:hover,
html:not(.agent-prop--Touch) ul.post-system-block__pager-nav-menu > li.menu-item > a:hover {
    color: var(--themeval-color-theme-text-white) !important;
    border-color: var(--themeval-color-theme-13) !important;
    background-color: var(--themeval-color-theme-13) !important;
}
html:not(.agent-prop--Touch) .post-system-block__pager-nav-menu-prev .this__item:hover::before,
html:not(.agent-prop--Touch) .post-system-block__pager-nav-menu-next .this__item:hover::before {
    opacity: 0;
}
html:not(.agent-prop--Touch) .post-system-block__pager-nav-menu-prev .this__item:hover::after,
html:not(.agent-prop--Touch) .post-system-block__pager-nav-menu-next .this__item:hover::after {
    opacity: 1;
}



/*
================================================================
 投稿システム 個別ページヘッダー
================================================================
*/

.post-system-heading {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items:flex-start;
    box-sizing: border-box;
    width: 100%;
    padding-top: 0 !important;
    text-decoration: none;
    color: var(--themeval-color-theme-text-black);
}
.post-system-heading .this__date {
    display: block;
    box-sizing: border-box;
    min-width: 5em;
    padding: 0.15em 0.5em 0.25em 0;
    font-weight: 700;
    text-align: left;
    line-height: 2;
    font-size: 66.67%;
}
.post-system-heading .this__category {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    box-sizing: border-box;
    width: calc(100% - 4em);
    margin: 0 -0.5em;
    padding: 0;
    font-size: 66.67%;
}
.post-system-heading .this__category > * {
    display: block;
    margin: 0.5em 0.5em;
}
.post-system-heading .this__title {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0 0 0;
    font-style: normal !important;
    font-weight: 700;
    text-align: justify;
    line-height: 1.4;
}



/*
================================================================
 部活動投稿システム 部活動リスト
================================================================
*/

ul.post-system-club-list-nav-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style-type: none;
}
ul.post-system-club-list-nav-menu > li.menu-item {
    display: block;
    box-sizing: border-box;
    width: 31.6667%;
    margin: 2.5% 0 0 2.5%;
    padding: 0;
    list-style-type: none;
    border-bottom: 1px solid var(--themeval-color-theme-11);
    /* border-bottom: 0.525em solid var(--themeval-color-theme-11); */
}
ul.post-system-club-list-nav-menu > li.menu-item:nth-child(3n+1) {
    margin-left: 0;
}
ul.post-system-club-list-nav-menu > li.menu-item:nth-child(1),
ul.post-system-club-list-nav-menu > li.menu-item:nth-child(2),
ul.post-system-club-list-nav-menu > li.menu-item:nth-child(3) {
    margin-top: 0;
}
ul.post-system-club-list-nav-menu > li.menu-item > a,
ul.post-system-club-list-nav-menu > li.menu-item > .as-link {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items:flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    text-decoration: none;
    color: var(--themeval-color-theme-text-black);
}
ul.post-system-club-list-nav-menu > li.menu-item > a .this__thumb,
ul.post-system-club-list-nav-menu > li.menu-item > .as-link .this__thumb {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 0.5em;
    padding: 0;
    background-color: var(--themeval-color-theme-white);
}
ul.post-system-club-list-nav-menu > li.menu-item > a .this__figure,
ul.post-system-club-list-nav-menu > li.menu-item > .as-link .this__figure {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: var(--themeval-color-theme-white);
    aspect-ratio: 3/2;
    overflow: hidden;
}
ul.post-system-club-list-nav-menu > li.menu-item > a .this__thumb img,
ul.post-system-club-list-nav-menu > li.menu-item > .as-link .this__thumb img {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--themeval-hover-transition);
}
ul.post-system-club-list-nav-menu > li.menu-item > a .this__title,
ul.post-system-club-list-nav-menu > li.menu-item > .as-link .this__title {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0 0 0.5em;
    font-style: normal !important;
    font-weight: 700;
    text-align: right;
    font-size: 133%;
    line-height: 1.5;
    color: var(--themeval-color-theme-text-black);
    /* -webkit-text-stroke: 1px var(--themeval-color-theme-text-black);
    text-stroke: 1px var(--themeval-color-theme-text-black);
    paint-order: stroke; */
}

html:not(.agent-prop--Touch) ul.post-system-club-list-nav-menu > li.menu-item > a:hover .this__thumb img {
    transform: scale(1.05);
}

@media (max-width: 959px){
    ul.post-system-club-list-nav-menu > li.menu-item {
        width: 48%;
        margin-left: 4%;
        margin-top: 4%;
    }
    ul.post-system-club-list-nav-menu > li.menu-item:nth-child(3n+1) {
        margin-left: 4%;
    }
    ul.post-system-club-list-nav-menu > li.menu-item:nth-child(2n+1) {
        margin-left: 0;
    }
    ul.post-system-club-list-nav-menu > li.menu-item:nth-child(3) {
        margin-top: 4%;
    }
}
@media (max-width: 639px){
    ul.post-system-club-list-nav-menu > li.menu-item {
        width: 100%;
        margin-left: 0%;
        margin-top: 1em;
    }
    ul.post-system-club-list-nav-menu > li.menu-item:nth-child(3n+1) {
        margin-left: 0%;
    }
    ul.post-system-club-list-nav-menu > li.menu-item:nth-child(2n+1) {
        margin-left: 0;
    }
    ul.post-system-club-list-nav-menu > li.menu-item:nth-child(2),
    ul.post-system-club-list-nav-menu > li.menu-item:nth-child(3) {
        margin-top: 1em;
    }
}



/*
================================================================
 部活動投稿システム 詳細
================================================================
*/

.post-system-club-heading {

}
.post-system-club-main-img {
    display: block;
    padding: 0;
}
.post-system-club-main-img img {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: auto;
}
.post-system-club-actinfo-block {
    display: block;
}
.post-system-club-actinfo {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    width: 104.1667%;
    margin: -2.0833% -2.0833%;
}
.post-system-club-actinfo-section {
    position: relative;
    display: block;
    box-sizing: border-box;
    min-width: 46%;
    width: max-content;
    max-width: 96%;
    flex-grow: 0;
    margin: 2% 2%;
    padding: 20px 30px 2em;
    border: 1px solid var(--themeval-color-theme-text-black);
    background-color: var(--themeval-color-theme-white);
    color: var(--themeval-color-theme-text-black);
}
.post-system-club-actinfo-section::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    display: block;
    box-sizing: content-box;
    width: 0;
    height: 0;
    border-bottom: 2em solid var(--themeval-color-theme-01);
    border-left: 2em solid rgba(255,255,255,0);
}
.post-system-club-actinfo-section .post-system-club-actinfo-section-title {
    padding: 0 0 0.5em;
    margin: 0 0 1em;
    color: var(--themeval-color-theme-01);
    border-bottom: 1px solid var(--themeval-color-theme-01);
    font-weight: 700;
    font-size: 120%;
    line-height: 1.5;
}
.post-system-club-actinfo-section p {
    margin: 0.5em 0 0;
}

@media (max-width: 1279px){
    .post-system-club-actinfo-section {
        padding-top: 20px;
        padding-left: 20px;
        padding-right: 20px;
    }
}
@media (max-width: 1079px){
    .post-system-club-actinfo-section {
        min-width: 26%;
        flex-grow: 1;
        padding-top: 20px;
        padding-left: 20px;
        padding-right: 20px;
        font-size: 90%;
    }
}
@media (max-width: 959px){
    .post-system-club-actinfo-section {
        padding-top: 20px;
        padding-left: 20px;
        padding-right: 20px;
        font-size: 80%;
    }
}
@media (max-width: 767px){
    .post-system-club-actinfo-section {
        width: 96%;
        padding-top: 20px;
        padding-left: 30px;
        padding-right: 30px;
        font-size: 100%;
    }
}
@media (max-width: 479px){
    .post-system-club-actinfo-section {
        width: 96%;
        padding-top: 10px;
        padding-left: 10px;
        padding-right: 10px;
        font-size: 90%;
    }
}



/*
================================================================
 インタビュー投稿システム インタビューリスト
================================================================
*/

ul.post-system-interview-list-nav-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style-type: none;
}
ul.post-system-interview-list-nav-menu > li.menu-item {
    display: block;
    box-sizing: border-box;
    width: 31.6667%;
    margin: 2.5% 0 0 2.5%;
    padding: 0;
    list-style-type: none;
    border-bottom: 1px solid var(--themeval-color-theme-11);
    /* border-bottom: 0.525em solid var(--themeval-color-theme-11); */
}
ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(3n+1) {
    margin-left: 0;
}
ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(1),
ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(2),
ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(3) {
    margin-top: 0;
}
ul.post-system-interview-list-nav-menu > li.menu-item > a,
ul.post-system-interview-list-nav-menu > li.menu-item > .as-link {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items:flex-start;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    text-decoration: none;
    color: var(--themeval-color-theme-text-black);
}
ul.post-system-interview-list-nav-menu > li.menu-item > a .this__thumb,
ul.post-system-interview-list-nav-menu > li.menu-item > .as-link .this__thumb {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 0.5em;
    padding: 0;
    background-color: var(--themeval-color-theme-white);
}
ul.post-system-interview-list-nav-menu > li.menu-item > a .this__figure,
ul.post-system-interview-list-nav-menu > li.menu-item > .as-link .this__figure {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: var(--themeval-color-theme-white);
    aspect-ratio: 3/2;
    overflow: hidden;
}
ul.post-system-interview-list-nav-menu > li.menu-item > a .this__thumb img,
ul.post-system-interview-list-nav-menu > li.menu-item > .as-link .this__thumb img {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 30%;
    transition: transform var(--themeval-hover-transition);
}
ul.post-system-interview-list-nav-menu > li.menu-item > a .this__title,
ul.post-system-interview-list-nav-menu > li.menu-item > .as-link .this__title {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    font-style: normal !important;
    font-weight: 700;
    text-align: right;
    font-size: 133%;
    line-height: 1.5;
    color: var(--themeval-color-theme-text-black);
}
ul.post-system-interview-list-nav-menu > li.menu-item > a .this__dep,
ul.post-system-interview-list-nav-menu > li.menu-item > .as-link .this__dep {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0 0 0.5em;
    font-style: normal !important;
    font-weight: 700;
    text-align: right;
    font-size: 90%;
    line-height: 1.5;
    color: var(--themeval-color-theme-text-black);
}
ul.post-system-interview-list-nav-menu > li.menu-item > a .this__integrated,
ul.post-system-interview-list-nav-menu > li.menu-item > .as-link .this__integrated {
    position: absolute;
    left: 0.5em;
    top: 0.5em;
    display: block;
    box-sizing: border-box;
    width: 5em;
    height: 5em;
    margin: 0;
    padding: 1em 0.2em 0;
    color: var(--themeval-color-theme-text-white);
    background-image: linear-gradient(60deg,var(--themeval-color-theme-15),var(--themeval-color-theme-14));
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
    border: 1px solid var(--themeval-color-theme-white);
    border-radius: 50%;
    font-style: normal !important;
    font-weight: 700;
    text-align: center;
    font-size: 80%;
    line-height: 1.5;
    transform: rotate(-15deg);
}

html:not(.agent-prop--Touch) ul.post-system-interview-list-nav-menu > li.menu-item > a:hover .this__thumb img {
    transform: scale(1.05);
}

@media (max-width: 959px){
    ul.post-system-interview-list-nav-menu > li.menu-item {
        width: 48%;
        margin-left: 4%;
        margin-top: 4%;
    }
    ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(3n+1) {
        margin-left: 4%;
    }
    ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(2n+1) {
        margin-left: 0;
    }
    ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(3) {
        margin-top: 4%;
    }
}
@media (max-width: 639px){
    ul.post-system-interview-list-nav-menu > li.menu-item {
        width: 100%;
        margin-left: 0%;
        margin-top: 1em;
    }
    ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(3n+1) {
        margin-left: 0%;
    }
    ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(2n+1) {
        margin-left: 0;
    }
    ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(2),
    ul.post-system-interview-list-nav-menu > li.menu-item:nth-child(3) {
        margin-top: 1em;
    }
}



/*
================================================================
 インタビュー投稿システム 詳細
================================================================
*/

.post-system-interview-layout {
    position: relative;
    z-index: 1;
    display: block;
    box-sizing: border-box;
    padding: 50px 60px 60px min(40%, 768px);
    max-width: 1920px !important;
    width: 100% !important;
    min-height: min(50vw, 960px);
}
.post-system-interview-catch {
    position: relative;
    z-index: 11;
    margin: 0 auto 0 0 !important;
    display: block;
    box-sizing: border-box;
    max-width: calc(600px + (100% + 60px) / 6);
    width: 100%;
}
.post-system-interview-main-img {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    display: block;
    margin: 0;
    padding: 0;
    width: 50%;
    height: 100%;
    max-height: min(75vw, 1280px);
    mask-image: linear-gradient(-90deg, rgba(255,255,255,0), rgba(255,255,255,1) 20%);
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
    mask-position: right center;
    overflow: hidden;
}
.post-system-interview-main-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 66% 33%;
}
.post-system-interview-student {
    position: relative;
    z-index: 11;
    display: block;
    box-sizing: border-box;
    margin: 70px auto 0 0 !important;
    max-width: calc(600px + (100% + 60px) / 6);
    width: 100%;
    text-align: right;
}
.post-system-interview-student .this__integrated {
    position: absolute;
    z-index: 12;
    right: 0.5em;
    top: -5em;
    display: block;
    box-sizing: border-box;
    width: 5em;
    height: 5em;
    margin: 0;
    padding: 1em 0.2em 0;
    color: var(--themeval-color-theme-text-white);
    background-image: linear-gradient(60deg,var(--themeval-color-theme-15),var(--themeval-color-theme-14));
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
    border: 1px solid var(--themeval-color-theme-white);
    border-radius: 50%;
    font-style: normal !important;
    font-weight: 700;
    text-align: center;
    font-size: 80%;
    line-height: 1.5;
    transform: rotate(-15deg);
}
.post-system-interview-student .this__name {
    display: block;
    width: 100%;
    font-weight: 700;
    font-size: 150%;
}
.post-system-interview-student .this__dep {
    display: block;
    width: 100%;
    font-weight: 700;
    font-size: 100%;
}
.post-system-interview-comment {
    position: relative;
    z-index: 11;
    display: block;
    box-sizing: border-box;
    margin: 20px auto 0 0 !important;
    padding: 20px 0 20px 30px;
    max-width: calc(600px + (100% + 60px) / 6);
    width: 100%;
    background-color: rgba(255,255,255,0.7);
    text-align: justify;
}

.post-system-interview-educator {
    display: block;
}
.post-system-interview-educator::after {
    content: "";
    clear: both;
    display: block;
    width: 100%;
    height: 0;
}
.post-system-interview-educator .this__catch {
    position: relative;
    float: left;
    display: block;
    margin: 0 auto 0 0; 
    padding: 3em 0;
    width: max-content;
    max-width: 60%;
    color: var(--themeval-color-theme-01);
    text-align: center;
    font-family: var(--themeval-font-serif);
    font-weight: 700;
    font-size: 150%;
    line-height: 1.3333;
    letter-spacing: -0.05em;
}
.post-system-interview-educator .this__catch::before {
    content: "";
    position: absolute;
    top: 0;
    left: 4em;
    display: block;
    width: 2.4em;
    height: 2em;
    background-image: url(../img/heading/comm_start.svg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
}
.post-system-interview-educator .this__catch::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: calc(50% + 3em);
    display: block;
    width: 2.4em;
    height: 2em;
    background-image: url(../img/heading/comm_end.svg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
}
.post-system-interview-educator .this__person {
    float: right;
    display: block;
    width: 30%;
    text-align: right;
}
.post-system-interview-educator .this__person .this__photo {
    display: block;
    margin: 0;
    width: 100%;
    aspect-ratio: 3/4;
    border-radius: 50%;
    overflow: hidden;
}
.post-system-interview-educator .this__person .this__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.post-system-interview-educator .this__person .this__name {
    display: block;
    width: 100%;
    font-size: 120%;
}
.post-system-interview-educator .this__person .this__dep {
    display: block;
    width: 100%;
    font-size: 80%;
}
.this__comment {
    float: left;
    display: block;
    margin: 30px auto 0 0;
    width: 60%;
    text-align: justify;
}

@media (max-width: 959px) {
    
    .post-system-interview-layout {
        padding: 40px 50px 50px 35%;
        min-height: 45vw;
    }
    .post-system-interview-catch {
        max-width: 100%;
    }
    .post-system-interview-main-img {
        width: 50%;
        height: 100%;
        max-height: 75vw;
        mask-image: linear-gradient(-90deg, rgba(255,255,255,0), rgba(255,255,255,1) 30%);
    }
    .post-system-interview-student {
        margin: 50px auto 0 0 !important;
        max-width: 100%;
    }
    .post-system-interview-comment {
        margin: 20px auto 0 0 !important;
        padding: 20px 0 20px 20px;
        max-width: 100%;
    }

    .post-system-interview-educator .this__catch {
        max-width: 65%;
        font-size: 150%;
    }
    .post-system-interview-educator .this__person {
        width: 30%;
    }
    .post-system-interview-educator .this__person .this__photo {
        aspect-ratio: 3/4;
        border-radius: 50%;
    }
    .post-system-interview-educator .this__person .this__name {
        font-size: 120%;
    }
    .post-system-interview-educator .this__person .this__dep {
        font-size: 80%;
    }
    .this__comment {
        margin: 20px auto 0 0;
        width: 65%;
    }

}

@media (max-width: 767px) {
    
    .post-system-interview-layout {
        padding: 30px 50px 50px 30%;
        min-height: 45vw;
    }
    .post-system-interview-catch {
        max-width: 100%;
    }
    .post-system-interview-main-img {
        width: 45%;
        height: 100%;
        max-height: 66vw;
        mask-image: linear-gradient(-90deg, rgba(255,255,255,0), rgba(255,255,255,1) 30%);
    }
    .post-system-interview-student {
        margin: 50px auto 0 0 !important;
        max-width: 100%;
    }
    .post-system-interview-comment {
        margin: 20px auto 0 0 !important;
        padding: 20px 0 20px 20px;
        max-width: 100%;
    }

    .post-system-interview-educator .this__catch {
        max-width: 65%;
        font-size: 150%;
    }
    .post-system-interview-educator .this__person {
        width: 30%;
    }
    .post-system-interview-educator .this__person .this__photo {
        aspect-ratio: 3/4;
        border-radius: 50%;
    }
    .post-system-interview-educator .this__person .this__name {
        font-size: 120%;
    }
    .post-system-interview-educator .this__person .this__dep {
        font-size: 80%;
    }
    .this__comment {
        margin: 20px auto 0 0;
        width: 65%;
    }

}

@media (max-width: 639px) {
    
    .post-system-interview-layout {
        padding: 0 0 0;
        min-height: initial;
    }
    .post-system-interview-catch {
        width: 90%;
        max-width: 90%;
        margin: 0 auto 30px !important;
    }
    .post-system-interview-main-img {
        position: static;
        width: 100%;
        height: 125vw;
        max-height: initial;
        mask-image: linear-gradient(0deg, rgba(255,255,255,0), rgba(255,255,255,1) 30%);
    }
    .post-system-interview-student {
        margin: -75vw 0 0 auto !important;
        padding: 10px 5% 10px;
        max-width: 95%;
        width: max-content;
        background-color: rgba(255,255,255,0.7);
    }
    .post-system-interview-student .this__integrated {
        top: -5.5em;
    }
    .post-system-interview-comment {
        margin: 20px auto 0 0 !important;
        padding: 20px 5% 20px;
        width: 100%;
        max-width: 100%;
        min-height: calc(75vw - 125px);
    }

    .post-system-interview-educator .this__catch {
        float: none;
        max-width: 100%;
        font-size: 120%;
    }
    .post-system-interview-educator .this__person {
        float: none;
        margin: -20px 0 0;
        width: 100%;
        display: flex;
        flex-direction: row-reverse;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: flex-end;
    }
    .post-system-interview-educator .this__person .this__photo {
        width: 150px;
        margin: 0; 
        aspect-ratio: 3/4;
        border-radius: 50%;
    }
    .post-system-interview-educator .this__person .this__data {
        width: max-content;
    }
    .post-system-interview-educator .this__person .this__name {
        font-size: 120%;
    }
    .post-system-interview-educator .this__person .this__dep {
        font-size: 80%;
    }
    .this__comment {
        float: none;
        margin: 20px auto 0 0;
        width: 100%;
    }

}