/*
Theme Name: portal-k2
Template: nishiki
*/
@import url("css/style-top.css");
@import url("css/style-page.css");
@import url("css/style-article.css");
@import url(//use.fontawesome.com/releases/v5.15.2/css/all.css);

/* 見出し */

/* ボタン */
.is-layout-flex.wp-block-buttons {
    justify-content: center;
    width: 90%;
    max-width: 375px;
    margin: 1.313rem auto;
}
.wp-block-button {
    width: 100%;
}
.wp-block-button__link {
    display: flex;
    width: 100%;
    height: 4rem;
    color: #0063AF;
    background-color: #fff;
    border: solid 2px #0063AF;
    font-family: 'Noto Sans JP';
    font-size: 1.25rem;
    justify-content: center;
    gap: 1.125rem;
    align-items: center;
}
.wp-block-button__link:hover {
    color: #FDD000;
    background-color: #00AFE5;
    border: 2px solid #FDD000;
}
.wp-block-button__link::before {
    content: "\f35a";
    font-family: 'Font Awesome 5 Free';
    font-weight: 400;
}

/* ヘッダー */
#masthead {
    border-bottom: dotted 1px #221815;
}
#masthead .site-info a {
    gap: 0.5rem;
}
span.site-info_sub {
    margin: 0;
    padding-top: 1rem;
    color: #221815;
    font-weight: 900;
    font-family: 'Rounded Mplus 1c';
    font-size: 1rem;
    white-space: nowrap;
    box-sizing: border-box;
}
#masthead #menu-collapse > ul > li {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 1rem;
}
@media only screen and (max-width: 1024px){
    #masthead .global-nav #menu-collapse-button {
        display: block;
    }
    #masthead .global-nav #menu-collapse.panel {
        position: fixed;
        z-index: 3;
        top: 0;
        left: 0;
        visibility: hidden;
        overflow: auto;
        zoom: 1;
        width: 100%;
        height: 100%;
        padding-top: 7.5rem;
        background: rgba(0, 0, 0, 0.75);
        text-align: center;
        transition: transform 0.5s;
        transform: translateX(-100%);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
}
@media (min-width:1025px) {
    span.site-info_sub {
        padding-top: 1.3rem;
        font-size: 1.3rem;
    }
    #masthead #menu-collapse > ul > li > a {
        padding: 0 0.78vw !important;
    }
    #masthead #menu-collapse > ul > li:last-child > a {
        display: flex;
        height: 48px;
        padding: 0 min(2.782vw, 2.313rem) !important;
        color: #fff;
        background-color: #0063AF;
        border: solid 2px #0063AF;
        border-radius: 50px;
        box-sizing: border-box;
        align-items: center;
        justify-content: center;
    }
    #masthead #menu-collapse > ul > li:last-child > a:hover {
        color: #0063AF;
        background-color: #FDD000;
    }
}

/* ページタイトル部 */
main > header {
    background-image: url(./images/header_img.png);
    background-size: cover !important;
    height: 21.962vw;
    max-height: 300px;
    border-bottom: solid 5px #00AFE5;
    
}

.single #main > header .page-header, 
.page #main > header .page-header,
.archive #main > header .page-header,
.blog #main > header .page-header {
    overflow: visible !important;
}
.page-id-2 main > header,
main > header.mc-events {
    border-bottom: solid 5px #E60012;
}
.post-type-archive-experiences  main > header,
main > header.experiences {    
    border-bottom: solid 5px #FDD000;
}
.page-header::after {
    content: "";
    display: block;
    width: 100vw;
    height: 100%;
    margin: 0 calc(50% - 50vw);
    position: absolute;
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 20vw;
    z-index: 0;
}
main > header > .page-header::after {
    background-image: url(./images/header_common_deco.png);
}
.page-id-2 main > header > .page-header::after, 
main > header.mc-events > .page-header::after {
    background-image: url(./images/header_events_deco.png);
}
.post-type-archive-experiences  main > header > .page-header::after,
main > header.experiences > .page-header::after {
    background-image: url(./images/header_experiences_deco.png);
}
main > header.post > .page-header::after {
    background-image: url(./images/header_news_deco.png);
}

.page-header {
    display: flex;
    /* width: 100vw !important; */
    height: 100% !important;
    color: #221815 !important;
    font-family: 'Rounded Mplus 1c';
    padding: 0 !important;
    justify-content: center;
    align-items: center;
}
.page-header h1 {
    margin: 0 !important;
    width: 100%;
    text-align: left;
}
header::after {
    opacity: 0 !important;
}
@media (min-width:768px) {
    .page-header h1 {
        font-size: 2.25rem !important;
    }
}
@media (min-width:1000px) { 
    .page-header {
        justify-content: flex-start;
    }
    .page-header h1 {
        font-size: 2.25rem !important;
        text-align: left;
        /* padding-left: 6.25rem; */
    }
    main > header > .page-header::after {
        background-size: min(40vw, 507px);
    }
    .page-id-2 main > header > .page-header::after, 
    main > header.mc-events > .page-header::after {
        background-size: min(40vw, 549px);
    }
    .post-type-archive-experiences  main > header > .page-header::after,
    main > header.experiences > .page-header::after {
        background-size: min(40vw, 542px);
    }
    main > header.post > .page-header::after {
        background-size: min(40vw, 387px);
    }
}

/* フッター */

#footer .footer-content {
    background-image: url(./images/footer_line_img.png);
    background-repeat: repeat-x;
    background-position: bottom 5px left;
}
#footer .footer-content .container {
    max-width: 1200px !important;
}
#footer-widget {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}
#footer-widget .widget {
    margin: 0;
    width: calc(100% - 1rem) !important;
    flex-basis: calc(100% - 1rem) !important;
}
.footer_logo_img {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
    gap: 0.75rem;
}
.footer_logo_img img {
    width: 60vw;
    max-width: 286px;
    height: auto;
}
figcaption.wp-element-caption {
    margin: 0;
    color: #221815;
    font-weight: 900;
    font-family: 'Rounded Mplus 1c';
    font-size: clamp(1rem, 4.267vw, 1.313rem);
    white-space: nowrap;
}
#menu-footer_nav > li > a::before {
    font-family: 'Font Awesome 5 Free';
    content: "\f35a";
    font-weight: 400;
    margin-right: 0.3rem;
}
.footer-widget a:hover {
    color: #FDD000;
}
ul#menu-footer_nav {
    font-family: 'Noto Sans JP', sans-serif;
}

@media (min-width:768px) {
    ul#menu-footer_nav {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.5rem 2rem;
    }
    #menu-footer_nav > li {
    width: calc(50% - 1rem);
    }
}
@media (min-width:1000px) {
    #footer-widget {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        flex-wrap: nowrap;
        gap: 2rem !important;
    }
    #footer-widget .widget {
        width: auto !important;
        flex-basis: fit-content !important;
    }
    section.widget_media_image {
        max-width: 400px;
    }
    ul#menu-footer_nav {
        justify-content: flex-end;
    }
    #menu-footer_nav > li {
        width: auto;
        border-bottom: none;
        white-space: nowrap;
        padding: 0;
        font-size: 1rem;
    }
    #footer .wrap .copyright {
        padding: 55px 0 0 !important;
    }

}

