@charset "utf-8";

/* ===========================
common
=========================== */
html {
    font-size: 62.5%;
}

body {
    font-family:
        "M PLUS 1p",
        "Bangers",
        "Kiwi Maru";
    font-style: normal;
    color: #757575;
    background-color: #FFF4E0;
    line-height: 1.5;
}

img {
    max-width: 100%;
    height: auto;
}

.section__topic {
    font-size: 2.4rem;
    color: #61C359;
    text-align: center;
    font-family: Bangers;
    margin: 15px auto;
}
.section__topic span{
    margin: 0 auto;
    font-family: "Kiwi Maru";
    display: block;
    font-size: 1rem;
    line-height: 0px;
}

/* pc common */
@media screen and (min-width: 769px) {
    .section__topic {
        font-size: 4.8rem;
        margin-top: 22px;
    }
    .section__topic span{
        margin: 0 auto;
        font-family: "Kiwi Maru";
        display: block;
        font-size: 1.6rem;
        line-height: 0px;
    }
}

/* ===========================
header
=========================== */
.header {
    padding: 17px 4.2%;
    height: 38px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header__topic,
.nav__topic {
    display: block;
    width: 16px;
    height: 16px;
}

.header__btn {
    display: block;
    width: 20px;
    height: 16px;
    cursor: pointer;
}

/* pc header */
@media screen and (min-width: 769px) {
    .header {
        width: 100%;
        margin: 0 auto;
        height: 90px;
        padding: 20px 4.2%;
    }

    .header__topic {
        display: block;
        width: 50px;
        height: 50px;
    }

    .header__btn {
        display: none;
    }
}

/* navigation */
.nav {
    background: rgba(255, 244, 224, 0.9);
    width: 100%;
    height: 100vh;
    padding: 24px 4.2%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    transform: translateX(-100%);
    transition: transform 0.4s;
}

.nav__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.nav__btn {
    width: 20px;
    height: 16px;
}

.nav__list {
    margin-top: 46px;
    margin-left: 28px;
}

.nav__item {
    color: #61C359;
    font-family: Bangers;
    font-size: 3.2rem;
    margin-top: 10px;
}
.nav__topic,
.header__topic{
    display: block;
    width: 16px;
}

/*  nav active表示*/
.nav.active {
    transform: translateX(0);
}


@media screen and (min-width: 769px) {
    .nav__header {
        display: none;
    }

    .nav {
        border: 0;
        border-radius: 0;
        background: transparent;
        width: auto;
        height: auto;
        padding: 0;
        position: static;
        transform: translateX(0);
    }

    .nav__list {
        margin-top: 0;
        display: flex;
        align-items: center;
    }

    .nav__item {
        text-align: center;
        font-size: 3.2rem;
        margin: 0 0 0 5vw;
        color: #FCAA00;
    }
    .nav__topic,
.header__topic{
    display: block;
    width: 60px;
}
}

/* ====================
article header
=========================== */
.mainImg .mainImg__pc {
    display: none;
}

/* Article header pc */

@media screen and (min-width:769px) {
    .mainImg .mainImg__pc {
        display: block;
        margin: 0 auto;
    }

    .mainImg .mainImg__sp {
        display: none;
    }
}

/* news */
.section--news {
    padding: 40px 4.2% 0px;
    margin: 0 auto;
}

.news__list {
    margin-top: 33px;
    margin: 0 auto;
    background-color: #fff;
    padding: 20px 10px;
    border-radius: 15px;
}

.news__topic time {
    color: #FCAA00;
    text-align: center;
    font-family: Bangers;
    font-size: 1.2rem;
    padding: 4px 8px;
}

.news__topic span {
    color: #757575;
    text-align: center;
    font-family: "M PLUS 1p";
    font-size: 1rem;
}
.news__topic a{
    text-decoration: none;
    }
    
    .news__topic a:hover{
    text-decoration: underline;
    color: #FCAA00;
    }
@media screen and (min-width:769px) {
    .section--news {
        margin: 0 auto;
        padding: 64px 0px 0px;
    }

    .news__list {
        max-width: 1160px;
        margin: 33px auto;
        padding: 48px 96px;
    }

    .news__topic time {
        font-size: 2.4rem;

    }

    .news__topic span {
        font-size: 2rem;
        margin-left: 30px;
    }

}

/* entry */
.section--entry {
    padding: 40px 4.2% 0px;
    margin: 0 auto;;
}

.entryTopic {
   margin-top: 10px;
        color: #757575;
        font-family: "M PLUS 1p";
        font-size: 1rem;
        background-color: #fff;
        padding: 20px 10px;
        border-radius: 50px;
        margin-bottom: 10px;
        margin: 0px 40px;
}


.title {
    color: #4E4B46;
    text-align: center;
    font-family: "M PLUS 1p";
    font-size: 1.6rem;
}

.title span {
    color: #FCAA00;
    font-family: "Bangers";
}

.entryText,
.entryText2 {
    margin-top: 10px;
        color: #757575;
        text-align: center;
        font-family: "M PLUS 1p";
        font-size: 1rem;
        background-color: #fff;
        padding: 30px 10px;
        border-radius: 15px;
        margin-bottom: 10px;
}

.entryText3{
    margin-top: 10px;
        color: #757575;
        font-family: "M PLUS 1p";
        font-size: 1rem;
        background-color: #fff;
        padding: 30px 10px;
        border-radius: 15px;
        margin-bottom: 10px;
}

@media screen and (min-width:769px) {
    .section--entry {
        margin: 0 auto;
        padding: 64px 0px 0px;
    }

    .entryTopic {
        margin-top: 10px;
        color: #757575;
        font-family: "M PLUS 1p";
        font-size: 2rem;
        background-color: #fff;
        padding: 20px 80px;
        border-radius: 50px;
        margin-bottom: 100px;
        margin: 0px 40px;
    }

    .title {
        color: #4E4B46;
        text-align: center;
        font-family:"M PLUS 1p";
        font-size: 3.2rem;
    }

    .title span {
        color: #FCAA00;
        font-family:"Bangers";
    }

    .entryText,
    .entryText2 {
        margin-top: 10px;
        text-align: center;
        color: #757575;
        font-family: "M PLUS 1p";
        font-size: 2rem;
        background-color: #fff;
        padding: 20px 100px;
        border-radius: 15px;
        margin-bottom: 100px;
    }
    .entryText3{
    margin-top: 10px;
        color: #757575;
        font-family: "M PLUS 1p";
        font-size: 2rem;
        background-color: #fff;
        padding: 30px 100px;
        border-radius: 15px;
        margin-bottom: 100px;
}

}


.btn {
    background-color: #FCAA00;
    ;
    display: block;
    /* width: 311px;
    height: 52px; */
    padding: 16px 0px 18px;
    text-align: center;
    text-decoration: none;
    color: #fff;
    font-family: "M PLUS 1p";
    font-size: 1.2rem;
    line-height: 1;
    border-radius: 15px;
    margin-top: 16px;
    transition: 0.4s;
    position: relative;
    margin: 10px auto;
    width: 250px;
}

@media screen and (min-width:769px) {
  
    

    .btn {
        font-size: 2.4rem;
        width: 500px;
    }
}




/* footer */
.footer {
    padding: 40px 4.2% 0px;
    margin: 0 auto;
}

.footer__topic {
    display: block;
    width: 95px;
    height: auto;
    margin: 0 auto;
}

.mail {
    text-align: center;
    font-family: Bangers;
    font-size: 1.2rem;
    color: #61C359;
    margin-top: 5px;
}
.copy {
    color: #757575;
    text-align: center;
    font-family: Bangers;
    font-size: 1.0rem;
    margin-top: 22px;
}


/* footer pc*/
@media screen and (min-width:769px) {
    .footer {
        max-width: 1280px;
        margin: 0 auto;
        padding: 64px 60px 0px;
    }

    .footer__topic {
        display: block;
        width: 275px;
        height: auto;
        margin: 20px auto;
    }
    .mail {
        text-align: center;
        font-family: Bangers;
        font-size: 2rem;
        color: #61C359;
        margin-top: 8px;
    }
    .copy {
        color: #757575;
        text-align: center;
        font-family: Bangers;
        font-size: 1.6rem;
        margin-top: 30px;
    }
}
