.kifu_body{
    margin: 0;
    color: #222222;
    font-family: sans-serif;
    display: grid;
    grid-template-rows: auto 1fr auto;
    grid-template-columns: 100%;
    min-height: 100vh;
}

.kifu_top{
    padding: clamp(45px, 6vw, 80px) 0;
    background-image: url("../img/top_background.png");
    background-size: cover;
}

.w-container{
    width: min(92%, 1166px);
    margin: auto;
    position: relative;
}

.h1_font{
    font-size: clamp(25px, 4.1vw, 55px);
    min-height: 0vw;
    text-align: center;
    line-height: 1.5;
    color: #0f5cd6;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
    margin: 0;
    padding: 0;
    margin-bottom: 20px;
}

.h1_font rt{
    font-size: clamp(0.8rem, 2vw, 1.2rem);
    font-weight: bold;
    color: #00aa3c;
    text-shadow: none;
    margin-bottom: .1em;
    transform: translateY(-.1em);
}

.h2_font{
    font-size: clamp(15px, 3vw, 35px);
    min-height: 0vw;
    text-align: center;
    line-height: 1.5;
    color: #808080;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
    margin: 0;
    padding: 0;
}

.h2_font rt{
    font-size: clamp(0.5rem, 2vw, 1.0rem);
    font-weight: bold;
    color: #00aa3c;
    text-shadow: none;
    margin-bottom: .1em;
    transform: translateY(-.1em);
}

.chapter-container{
    width: min(92%, 1200px);
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2rem;
    margin: 20px auto;
    font-size: clamp(14px, 2vw, 16px);
}

.main {
    flex: 3;
}

.side {
    flex:1;
}

.donation{
    display: flex;
    flex-direction: column;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
    border-radius: 10px;
    padding: 20px 15px 0 15px;
    position: sticky;
    top: 30px;
}

.donation_ttl{
/*    font-size: 1rem;*/
    font-weight: bold;
    line-height: 1.8;
}

.donation_subttl{
    border-top: 3px solid #ffb6c1;
    margin: 10px 0 5px;
    padding: 10px 0 10px;
    color: #000;
    line-height: 1.8;
    text-align: left;
}

.donation_btn{
    width: fit-content;
    background: #f0ffff;
    font-family: sans-serif;
    color: #0f5cd6;
    border-radius: 10px;
    font-weight: bold;
    border: solid 2px #0f5cd6;
    padding: 10px 20px 10px;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    display: block;
    margin: 20px auto;
    display: flex;
    justify-contnet: center;
    align-items: center;
    gap: 10px;
}

.donation_btn:visited{
    color: #0f5cd6;
}

.donation_btn:hover{
    border: solid 2px #00aa3c;
    background: #f0fff0;
    color: #00aa3c; /*#6f5436*/
}

.guide_a{
    display: inline-block;
    word-break: break-all;
    text-decoration: none;
    color: #1e90ff;
    cursor: pointer;
}

.guide_a:hover{
    color: #ff4500;
}

/**
* footer
**/
.footer_wrap{
    background-color: #f5fcff;
}

.guide_footer{
    width: min(92%, 1166px);
    margin: auto;
    position: relative;
    padding: 4rem 0 1rem;
    color: #707070;
    font-size: 13px;
}

.guide_footer-container{
    display: grid;
    gap: 20px;
    justify-items: center;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
}

.guide_footer-container > .guide_footer-site{
    margin-bottom: 10px;
}

.footer-site{
    display: flex;
    align-items: center;
    gap: 10px;
}

.guide_footer-container > *:not(.guide_footer-sns){
     justify-self: start;
}

.guide_footer-container > .guide_footer-sns{
    grid-column: 2;
    grid-row: 1/3;
    justify-self: end;
    align-self: start;
    margin: 0;
    padding: 0;
    list-style: none;
}

.guide_footer-menu{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.guide_footer-copy{
    margin-top: 20px;
    text-align: center;
}

@media screen and (max-width: 960px){
    .chapter-container{
        flex-direction: column;
    }
}

@media screen and (max-width: 767px){
    .guide_footer-container{
        display: block;
    }

    .guide_footer-container{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .guide_footer-container > .guide_footer-sns{
        align-self: center;
    }

    .guide_footer-menu{
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 20px;
    }
}
