@charset "utf-8";


/*========================================
    全体設定
=========================================*/
/* フォントと行間 */
body {
    font-family: "BIZ UDPゴシック", 'BIZ UDGothic', sans-serif;
    line-height: 35px;
}

@media screen and (max-width:480px) {
    body {
        line-height: 30px;
    }
}

/* h1のタイトル */
h1.title {
    width: auto;
    background-image: url("../img/h1.png");
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
    font-size: 25px;
    font-weight: bold;
    text-align: center;
    color: #fff;
    padding: 75px;
    margin-top: 172px;
}

@media screen and (max-width:820px) {
    h1.title {
        background-image: url("../img2/h1sp.png");
        font-size: 20px;
        padding: 23px 0;
        margin-top: 80px;
    }
}




/* リスト */
li {
    list-style: none;
}

a {
    text-decoration: none;
}


/* リンクボタン　*/
.button {
    background: #87CE78 url(../img/link.png) no-repeat right 10px center;
    width: 299px;
    margin: auto;
    border-radius: 30px;
    text-align: center;
    display: block;
    color: #fff;
    padding: 5px 0;
    font-size: 16px;
    font-weight: bold;
}

@media screen and (max-width:820px) {
    .button {
        width: 250px;
        font-size: 14px;
    }
}


/* 埋め込みYoutube */
iframe.youtube {
    display: block;
    margin: 0 auto;
    margin-bottom: 65px;
}

.youtubeset iframe.youtube:last-child {
    margin-bottom: 0;
}

img {
    margin: auto;
    display: block;
}

.border {
    width: 589px;
    margin: auto;
}

@media screen and (max-width:1100px) {
    .border {
        width: 489px;
    }
}

@media screen and (max-width:820px) {
    .border {
        width: 389px;
    }
}

@media screen and (max-width:480px) {
    .border {
        width: 90%;
    }
}

.subtitle {
    color: #87CE78;
    border-bottom: 3px solid #87CE78;
    padding-bottom: 10px;
    text-align: center;
    font-size: 30px;
    font-weight: bold;
}

@media screen and (max-width:1100px) {}

@media screen and (max-width:820px) {
    .subtitle {
        font-size: 22px;
    }
}

@media screen and (max-width:480px) {
    .subtitle {
        font-size: 18px;
    }
}

/* ボタン系 */
.contactbutton {
    background-color: #87CE78;
    border-radius: 20px;
    display: block;
    width: 474px;
    margin: auto;
    padding-top: 31px;
    padding-bottom: 20px;
}

.contactbutton img {
    display: block;
    margin: auto;
}

.contactbutton p {
    text-align: center;
    color: #fff;
}

@media screen and (max-width:1100px) {
    .contactbutton {
        width: 55%;
    }
}

@media screen and (max-width:820px) {
    .contactbutton {
        width: 80%;
        padding: 18px 0;
    }
}

@media screen and (max-width:480px) {}


/*========================================
    ヘッダー
=========================================*/
header {
    display: flex;
}

h1.logo {
    width: 171px;
    position: absolute;
    top: 27px;
    left: 45px;
}

h1.logo img {
    width: 100%;
    height: auto;
}

header .pcnav nav {
    background-color: #87CE78;
    position: fixed;
    z-index: 999;
    right: 0;
    top: 35px;
    max-width: 1100px;
    width: 80%;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 10px 0 0 10px;
}

header .pcnav ul {
    display: flex;
}

header .pcnav li {
    font-size: 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 14.28%;
}

header .pcnav li+li {
    border-left: 1px solid #fff;
}

header .pcnav li p {
    color: #fff;
    text-align: center;
    line-height: 1.4em;
}

header .phonenav {
    display: none;
}

header .pcnav.down nav{
    opacity: 0;
    right: -1000px;
    transition-duration: 0.5s;
}

/*.toggle_btn*/
.toggle_btn {
    display: block;
    position: fixed;
    top: 16px;
    right: 0;
    width: 65px;
    height: 50px;
    transition: all .5s;
    cursor: pointer;
    z-index: 12;
    background-color: #87CE78;
    border-radius: 10px 0 0 10px;
}

.toggle_btn p {
    text-align: center;
    color: #FFF;
    position: absolute;
    bottom: 5px;
    font-size: 0.75rem;
    width: 100%;
}

.toggle_btn span {
    display: block;
    position: absolute;
    left: 15px;
    width: 30px;
    height: 2px;
    background-color: #FFF;
    border-radius: 4px;
    transition: all .5s;
}

.toggle_btn span:nth-child(1) {
    top: 16px;
}

.toggle_btn span:nth-child(2) {
    top: 24px;
}

.toggle_btn span:nth-child(3) {
    top: 32px;
}

.open .toggle_btn span {
    background-color: #fff;
}

.open .toggle_btn span:nth-child(1) {
    -webkit-transform: translateY(8px) rotate(-315deg);
    transform: translateY(8px) rotate(-315deg);
}

.open .toggle_btn span:nth-child(2) {
    opacity: 0;
}

.open .toggle_btn span:nth-child(3) {
    -webkit-transform: translateY(-8px) rotate(315deg);
    transform: translateY(-8px) rotate(315deg);
}

/*#mask*/
#mask {
    display: none;
    transition: all .5s;
}

.open #mask {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .8;
    z-index: 11;
    cursor: pointer;
}

.pctoggle{
    right: -100px;
    top:0;
}
.pctoggle.display{
    right: 0;
    transition-delay: 0.3s;
}

@media screen and (max-width:1100px) {
    header .pcnav nav {
        width: 70%;
    }

    header .pcnav li {
        font-size: 12px;
    }
}

@media screen and (max-width:820px) {
    h1.logo {
        width: 108px;
        top: 16px;
        left: 5%;
    }

    header .phonenav {
        display: block;
        position: fixed;
        top: 80px;
        left: -820px;
        width: 100%;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        transition: all .5s;
        z-index: 999;
    }

    header .phonenav.open {
        left: 0;
        opacity: 1;
    }

    header .pcnav {
        display: none;
    }

    header .phonenav nav {
        background-color: #87CE78;
        position: fixed;
        max-width: 1100px;
        width: 100%;
        padding-top: 10px;
        padding-bottom: 10px;
        /* border-radius: 10px 0 0 10px; */
        z-index: 1000;
        opacity: 1;
    }

    header .phonenav ul {
        display: flex;
        flex-wrap: wrap;
        padding: 30px;
    }

    header .phonenav li {
        font-size: 14px;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 33%;
        margin-bottom: 20px;
        border-left: 1px solid #fff;
    }


    header .phonenav li:nth-child(3),
    header .phonenav li:nth-child(6),
    header .phonenav li:nth-child(7) {
        border-right: 1px solid #fff;
    }

    header .phonenav li:last-child {
        margin-bottom: 0;
    }



    header .phonenav li p {
        color: #fff;
        text-align: center;
        line-height: 1.4em;
    }


    

}

@media screen and (max-width:480px) {
    header .phonenav li {
        width: 32%;
        font-size: 12px;
    }
}

/*========================================
    フッター
=========================================*/
footer nav {
    background-color: #87CE78;
    right: 0;
    top: 35px;
    max-width: 1100px;
    width: 80%;
    padding: 10px 0;
    border-radius: 10px;
    position: absolute;
    top: -46px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

footer ul {
    display: flex;
}

footer li {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 16.66%;
}

footer li+li {
    border-left: 1px solid #fff;
}

footer li p {
    font-size: 14px;
    color: #fff;
    text-align: center;
    line-height: 1.4em;
}

.footerbg {
    background: url(../img/footer.png) #F7F7F7 center bottom/100% no-repeat;
    height: 433px;
    position: relative;
    padding-top: 157px;
}

.footertext {
    width: 1000px;
    margin: auto;
    position: relative;

}

.footertext h3 {
    font-size: 25px;
    font-weight: bold;
    color: #87CE78;
    margin-bottom: 34.5px;
}

.footertext p {
    font-size: 18px;
}


.footertext .tree {
    font-size: 18px;
    color: #000;
    margin-top: 23px;
    display: inline-block;
    border-left: 5px solid #87CE78;
    padding-left: 19px;
}

.footertext .tree:hover {
    text-decoration: underline;
    color: orange;
}

.youtuber {
    position: absolute;
    top: 0;
    right: 0;
}

.copy {
    position: absolute;
    bottom: 33px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14px;
    text-align: center;
    line-height: 1.4;
}

#page_top {
    position: fixed;
    right: 5px;
    z-index: 9998;
    display: block;
}

#page_top img {
    display: block;
}

@media screen and (max-width:1100px) {
    .footerbg {
        background: url(../img2/footer2.png) #F7F7F7 center bottom/100% no-repeat;
        height: 433px;
        padding-top: 157px;
    }

    .footertext {
        width: 90%;
    }

    .youtuber {
        position: static;
        margin: 23px auto 0 0;
    }
}

@media screen and (max-width:820px) {
    footer nav {
        width: 90%;
        top: -120px;
    }

    footer ul {
        flex-wrap: wrap;
    }

    footer li {
        width: 33%;
        margin-bottom: 12px;
    }

    footer li+li:nth-child(4) {
        border-left: 0px;
    }

    footer li:nth-child(n+4) {
        margin-bottom: 0;
    }

    footer li p {
        font-size: 12px;
    }

    .copy {
        font-size: 12px;
        width: 95%;
    }

}

@media screen and (max-width:480px) {
    footer nav {
        top: -70px;
    }

    .footerbg {
        height: 350px;
        background: url(../img2/footer3.png) #F7F7F7 center bottom/100% no-repeat;
    }

    .footertext h3 {
        font-size: 20px;
        margin-bottom: 28px;
    }

    .footertext p {
        font-size: 15px;
    }

    .footertext .tree {
        font-size: 14px;
    }

    .copy {
        font-size: 10px;
        bottom: 15px;
    }

    #page_top {
        right: 5px;
        width: 44px;
    }

    #page_top img {
        width: 100%;
        height: auto;
    }


}

/*========================================

    トップページ

=========================================*/
/*========================================
    メインビジュアル
=========================================*/
.mainvisual {
    width: 100%;
    position: relative;
}

.slide {
    margin: 83px auto 66px auto;
    width: 90%;
}

.slide.sp {
    display: none;
}

.slide .item img {
    width: 100%;
    height: auto;
}

/*slick*/
.slick-dots {
    bottom: -35px;
    z-index: 999;
}

.slick-dots li {
    margin: 0;
}

.slick-dots li button {
    padding: 3px;
}

.slick-dots li button:before {
    font-size: 6px;
    line-height: 20px;
    width: 20px;
    height: 20px;
    opacity: .25;
    color: black;
}

.slick-dots li.slick-active button:before {
    opacity: 1;
    color: #87CE78;
}

/*-----*/
.maintext {
    position: absolute;
    bottom: 174px;
    left: 15%;
}

.maintext p {
    margin-bottom: 23px;
}

.maintext p span {
    color: #fff;
    background-color: #87CE78;
    font-size: 30px;
    font-weight: bold;
    padding: 10px 20px;
    letter-spacing: 0.3em;
}

.toppng {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
}

.toppng2 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: auto;
}

.toppng.sp {
    display: none;
}


@media screen and (max-width:1100px) {
    .maintext {
        bottom: 110px;
        left: 10%;
    }

    .maintext p {
        margin-bottom: 13px;
    }

    .maintext p span {
        font-size: 22px;
        padding: 9px 18px;
    }
}

@media screen and (max-width:820px) {
    .maintext {
        bottom: 90px;
    }

    .maintext p {
        margin-bottom: 8px;
        line-height: 2;
    }

    .maintext p span {
        font-size: 20px;
        padding: 8px 16px;
    }
}

@media screen and (max-width:480px) {
    .slick-dotted.slick-slider {
        margin-bottom: 55px;
    }

    .slide.pc {
        display: none;
    }

    .slide.sp {
        display: block;
    }

    .maintext p {
        margin-bottom: 3px;
    }

    .maintext p span {
        font-size: 15px;
        padding: 7px 13px;
        letter-spacing: 0.1em;
    }

    .toppng.pc {
        display: none;
    }

    .toppng2.pc {
        display: none;
    }

    .toppng.sp {
        display: block;
    }
}


/*========================================
    お知らせ
=========================================*/
.top .noticeback {
    background-color: #EDFDFB;
    padding: 33px 0;
    margin-top: 150px;
}

.top .notice {
    width: 1200px;
    margin: auto;
    background-color: #fff;
    border-radius: 60px;
    padding-top: 30px;
    padding-bottom: 69px;
    box-sizing: border-box;
}

.top .notice h2 {
    padding: 53px 0;
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    background: url(../img/know.png) no-repeat center center;
}

.top .notice table {
    margin: 0 auto 25px;
}

.top .notice table tr {
    border-bottom: 1px solid #959595;
}

.top .notice table tr:last-child {
    border-bottom: none;
}

.top .notice table th,
.top .notice table td {
    box-sizing: border-box;
    padding: 25px 22px;
    font-size: 18px;
}

.top .notice table td:last-child {
    padding: 0 15px;
}

.top .notice table th {
    text-align: center;
    font-weight: bold;
    color: #87CE78;
}

.top .notice table td a {
    color: #000;
}

.top .notice table td a:hover {
    text-decoration: underline;
    color: orange;
}

@media screen and (max-width:1200px) {
    .top .notice {
        width: 90%;
        padding: 0 5% 40px;
        border-radius: 20px;
    }
}

@media screen and (max-width:820px) {
    .top .noticeback {
        margin-top: 70px;
    }

    .top .notice table th,
    .top .notice table td {
        display: inline-block;
    }

    .top .notice table th {
        width: 100%;
        padding: 20px 0 0;
        text-align: left;
    }

    .top .notice table td {
        width: 85%;
        padding: 0 0 16px;
    }

    .top .notice table td:last-child {
        width: 15%;
        padding: 0 0 16px;
    }
}

@media screen and (max-width:480px) {
    .top .notice {
        padding: 20px 5% 30px;
    }

    .top .noticeback {
        margin-top: 25px;
    }

    .top .notice h2 {
        padding: 20px 0;
        font-size: 16px;
        background: url(../img/know.png) no-repeat center center / 80%;
    }

    .top .notice table {
        margin: 0 auto 5px;
    }

    .top .notice table th,
    .top .notice table td p {
        font-size: 15px;
        line-height: 2;
    }

    .top .notice table td img {
        width: 24px;
        height: auto;
    }
}

/*========================================
    トランポビクスとは
=========================================*/
.top .trampo {
    width: 1040px;
    margin: auto
}

.top .trampo .border {
    margin-top: 209px;
    margin-bottom: 65px;
}

.top .trampo .text {
    text-align: center;
    margin: 0 auto 139px;
}

.top .trampo .text p {
    font-size: 20px;
    display: inline-block;
    text-align: justify;
}

.top .trampo .what {
    width: 560px;
    margin: auto;
}

.top .trampo .what img {
    display: inline;
    text-align: left;
}

.top .trampo .youtube {
    width: 560px;
    height: 315px;
}

.top .trampo a {
    margin-top: 100px;
}

@media screen and (max-width:1100px) {
    .top .trampo {
        width: 90%;
        margin: 0 5%;
    }
}

@media screen and (max-width:820px) {
    .top .trampo .border {
        margin-top: 93px;
        margin-bottom: 24px;
    }

    .top .trampo .text {
        width: 90%;
        margin: 0 auto 41px;
    }


    .top .trampo .what {
        width: 90%;
        margin: 0 5%;
    }

    .top .trampo .youtube {
        width: 380px;
        height: 214px;
    }

    .top .trampo a {
        margin-top: 29px;
    }
}

@media screen and (max-width:480px) {
    .top .trampo {
        width: 95%;
        margin: 0 2.5%;
    }

    .top .trampo .text p {
        font-size: 15px;
        line-height: 2;
    }

    .top .trampo .what img {
        width: 130px;
        height: auto;
    }

    .top .trampo .youtube {
        width: 320px;
        height: 180px;
    }

    .top .trampo iframe.youtube {
        margin-bottom: 33px;
    }
}


/*========================================
    教室のご案内
=========================================*/
/* サンプル */
.top .classroom .border {
    margin-top: 281px;
    margin-bottom: 70px;
}

.top .classmate {
    width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.top .classmate .classSP {
    display: none;
}

.top .classmatetext {
    width: 515px;
    margin: 0 auto;
    font-size: 19px;
    text-align: justify;
}

.top .classroom .contactbutton {
    margin-top: 55px;
    margin-bottom: 135px;
}

@media screen and (max-width:1100px) {
    .top .classmate {
        display: block;
        width: 90%;
    }

    .top .classmatetext {
        width: 90%;
        margin-top: 30px;
    }
}

@media screen and (max-width:820px) {
    .top .classroom .border {
        margin-top: 150px;
        margin-bottom: 50px;
    }
}

@media screen and (max-width:480px) {
    .top .classroom .border {
        margin-top: 100px;
        margin-bottom: 30px;
    }

    .top .classmate .classmateimg {
        width: 100%;
        max-width: 320px;
        margin: auto;
    }

    .top .classmate .classmateimg img {
        width: 100%;
        height: auto;
    }

    .top .classmate .classPC {
        display: none;
    }

    .top .classmate .classSP {
        display: block;
    }

    .top .classmatetext {
        width: 100%;
    }

    .top .classmatetext p {
        font-size: 15px;
        line-height: 2;
    }

    .top .classroom .contactbutton {
        margin-top: 40px;
        margin-bottom: 80px;
    }
}

/* 補足 */
.top .goannai {
    width: 1000px;
    display: flex;
    justify-content: space-between;
    margin: auto;
}

.top .goannai_1 {
    width: 47%;
    background-color: #FFFEDB;
    border-radius: 50px;
    position: relative;
    padding: 115px 60px 180px;
    box-sizing: border-box;
}

.top .goannai_1 h3 {
    font-size: 25px;
    font-weight: bold;
    color: #87CE78;
    text-align: center;
}

.top .goannai_1 .button {
    position: absolute;
    bottom: 94px;
    left: 50%;
    transform: translateX(-50%);
}

.top .goannai_1 h3.goannai_left {
    margin-bottom: 37px;
}

.top .goannai_1 h3.goannai_right {
    margin-bottom: 72px;
}

.top .goannai_1 p {
    font-size: 18px;
}

.top .goannai .bubble1 {
    display: block;
    position: absolute;
    top: -40px;
    left: -40px;
}

.top .goannai .bubble2 {
    display: block;
    position: absolute;
    bottom: -40px;
    right: -40px;
}

@media screen and (max-width:1100px) {
    .top .goannai {
        width: 90%;

    }
}

@media screen and (max-width:820px) {
    .top .goannai {
        display: block;
        width: 80%;
    }

    .top .goannai_1 {
        width: 100%;
        border-radius: 40px;
        padding: 67px 35px;
        margin-bottom: 30px;
    }

    .top .goannai_1 h3 {
        font-size: 20px;
        line-height: 1.8;
    }

    .top .goannai_1 h3.goannai_left {
        margin-bottom: 18px;
    }

    .top .goannai_1 h3.goannai_right {
        margin-bottom: 40px;
    }

    .top .goannai_1 p {
        line-height: 2;
    }

    .top .goannai_1 .pleft {
        margin-bottom: 20px;
    }

    .top .goannai_1 .pright {
        margin-bottom: 40px;
    }

    .top .goannai_1 .button {
        position: relative;
        bottom: 0;
        left: 0;
        transform: none;
    }

    .top .goannai .bubble1 {
        width: 80px;
        height: auto;
        top: -20px;
        left: -20px;
    }

    .top .goannai .bubble2 {
        width: 80px;
        height: auto;
        display: block;
        position: absolute;
        bottom: -20px;
        right: -20px;
    }

}

@media screen and (max-width:480px) {
    .top .goannai_1 p {
        font-size: 16px;
    }
}


/*========================================
    会報誌
=========================================*/
.top .newsletter .border {
    margin-top: 250px;
    margin-bottom: 70px;
}

.top .backnumber {
    background-color: #EDFDFB;
    width: auto;
    padding-top: 84px;
    padding-bottom: 72px;
    margin-bottom: 41px;
}

@media screen and (max-width:480px) {
    .top .newsletter .border {
        margin-top: 95px;
        margin-bottom: 30px;
    }

    .top .backnumber {
        padding-top: 36px;
        padding-bottom: 39px;
        margin-bottom: 34px;
    }
}


/*========================================
    お問い合わせ
=========================================*/
.top .contactgo .border {
    margin-top: 198px;
    margin-bottom: 70px;
}

.top .contactgo p {
    text-align: center;
}

.top .contactgo p.free {
    font-size: 20px;
}

.top .contactgo p.here {
    font-size: 23px;
    font-weight: bold;
    margin-top: 40px;
}

.top .contactgo .contactbutton {
    margin-top: 12px;
    margin-bottom: 266px;
}

@media screen and (max-width:480px) {
    .top .contactgo .border {
        margin-top: 120px;
        margin-bottom: 23px;
    }

    .top .contactgo p.free {
        font-size: 14px;
    }

    .top .contactgo p.here {
        font-size: 21px;
        margin-top: 25px;
    }

    .top .contactgo .contactbutton {
        margin-bottom: 200px;
    }
}



/*========================================

    お知らせ一覧のページ

=========================================*/
.noticetable {
    width: 1000px;
    margin: 148px auto 292px;
}

.noticetable table tr {
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
}

.noticetable table th,
.noticetable table td {
    font-size: 18px;
    padding: 41px 0;
}

.noticetable table th {
    font-weight: bold;
    color: #87CE78;
    width: 150px;
    padding-right: 22px;
}


.noticetable table td a {
    color: #000;
}

.noticetable table td a:hover {
    text-decoration: underline;
    color: orange;
}

.noticetable table tr td:last-child {
    text-align: right;
}

.noticetable .buttondetail {
    background: #87CE78 url(../img/link3.png) no-repeat right 10px center;
    width: 159px;
    border-radius: 30px;
    text-align: center;
    display: inline-block;
    color: #fff;
    padding: 3px 0;
    font-size: 16px;
    font-weight: bold;
}

@media screen and (max-width:1100px) {
    .noticetable {
        width: 90%;
        margin: 148px auto 292px;
    }

}

@media screen and (max-width:820px) {

    .noticetable table tr {
        padding: 41px 0;
    }

    .noticetable table th,
    .noticetable table td {
        display: block;
        padding: 0;
        border: none;
    }

    .noticetable table th {
        padding-top: 27px;
    }

    .noticetable table td:last-child {
        padding-bottom: 27px;
    }
}

@media screen and (max-width:480px) {
    .noticetable {
        width: 95%;
        margin: 50px auto 160px;
    }
}

/*========================================

    お知らせのページ

=========================================*/
.noticesyousai {
    width: 1000px;
    margin: 108px auto 239px;
}

.noticesyousai .date {
    color: #87CE78;
    font-size: 18px;
    font-weight: bold;
}

.noticesyousai h2 {
    font-size: 22px;
    font-weight: bold;
    margin: 59px 0;
    text-align: justify;
}

.noticesyousai .noticetext {
    font-size: 18px;
    margin-bottom: 99px;
}
.noticesyousai p {
    font-size: 18px;
}
.noticesyousai .indent4 {
    padding-left: 4em;
    text-indent: -4em;
}
.noticesyousai .indent5 {
    padding-left: 5em;
    text-indent: -5em;
}
.noticesyousai li{
    list-style-type: disc;
    margin-left: 1em;
}
.noticesyousai table{
    margin-bottom: 50px;
}
.noticesyousai th{ 
    font-size: 18px;
    font-weight: bold;
    vertical-align: top;
    width: 15%;
    border-bottom: solid 2px #87CE78;
    padding: 0.3em;
}
.noticesyousai td{
    font-size: 18px;
    width: 85%;
    border-bottom: solid 1px #CCC;
    padding: 0.3em;
    text-align: justify;
}
.noticesyousai .nopicture2colum{
    display: flex;
    flex-wrap: wrap;
}
.noticesyousai .nopicture {
    width: 40%;
    margin: 0 auto 63px;
    text-align: center;
}

.noticesyousai .nopicture img {
    width: 100%;
    height: auto;
    margin-bottom: 14px;
    border: 1px solid #000;
}

.noticesyousai .nopicture p {
    background-color: #87CE78;
    color: #fff;
    font-size: 16px;
    text-align: center;
    margin: auto;
}

@media screen and (max-width:1100px) {
    .noticesyousai {
        width: 90%;
    }

    .noticesyousai .noticetext {
        text-align: justify;
    }

    .noticesyousai .nopicture {
        width: 70%;
    }
}

@media screen and (max-width:820px) {
    .noticesyousai .nopicture {
        width: 80%;
        margin-bottom: 50px;
    }
}

@media screen and (max-width:480px) {
    .noticesyousai {
        margin: 50px auto 100px;
    }
    
    .noticesyousai .date {
        font-size: 13px;
    }

    .noticesyousai h2 {
        font-size: 15px;
        margin: 25px 0;
    }
    .noticesyousai .noticetext {
        font-size: 14px;
        margin-bottom: 50px;
    }
    .noticesyousai p {
        font-size: 14px;
    }
    .noticesyousai table{
        margin-bottom: 30px;
    }
    .noticesyousai th{ 
        font-size: 14px;
        width: 20%;
        padding: 0.2em 0;
    }
    .noticesyousai td{
        font-size: 14px;
        width: 80%;
        padding: 0.2em 0;
    }
}


/*========================================

    トランポビクスとは？のページ

=========================================*/
/* @media screen and (max-width:480px) {
    .trampobikusu {
        width: 335px;
        margin: 0 auto;
        line-height: 25px;
    }
} */

/*========================================
    トランポビクスってどんなスポーツ？
=========================================*/
.trampobikusu .main1 .border {
    margin-top: 94.5px;
    margin-bottom: 17px;
}


.trampobikusu .main1 .trampobicsSP {
    display: none;
}

.trampobikusu .main1 .tramptext {
    text-align: center;
    font-size: 20px;
    margin: 17px auto 161px;
    line-height: 50px;
}

@media screen and (max-width:1100px) {
    .trampobikusu .main1 .trampobicsPC {
        display: none;
    }

    .trampobikusu .main1 .trampobicsSP {
        display: block;
    }
}

@media screen and (max-width:820px) {
    .trampobikusu .main1 .border {
        margin-top: 50px;
        margin-bottom: 30px;
    }

    .trampobikusu .main1 .tramptext {
        width: 90%;
        margin-top: 40px;
        margin-bottom: 74px;
    }

    .trampobikusu .main1 .tramptext p {
        display: inline-block;
        text-align: justify;
        line-height: 25px;
    }

}

@media screen and (max-width:480px) {}



/* ========================================
    こんな人におすすめ
========================================= */
.trampobikusu .main2 h2 {
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 40px;
}

.trampobikusu .main2 .osusumegroup {
    width: 1132px;
    margin: auto;
}

.trampobikusu .main2 .osusumelist {
    display: flex;
    justify-content: space-between;
}

.trampobikusu .main2 .osusumetext,
.trampobikusu .main2 .osusumetext3 {
    width: 354px;
    margin: auto;
    background-color: #FFFEDB;
    border-radius: 30px;
}

.trampobikusu .main2 .osusumelist li dl {
    padding: 67.5px 34px 55px;
}

.trampobikusu .main2 .osusumelist li dt {
    font-size: 22px;
    font-weight: bold;
    color: #87CE78;
    text-align: center;

}

.trampobikusu .main2 .osusumetext li dt {
    margin-bottom: 15px;
}

.trampobikusu .main2 .osusumetext3 li dt {
    margin-bottom: 50px;
}

.trampobikusu .main2 .osusumelist li dd {
    font-size: 18px;
    text-align: justify;
}

@media screen and (max-width:1100px) {
    .trampobikusu .main2 .osusumegroup {
        width: 90%;
        margin: auto;
    }

    .trampobikusu .main2 .osusumelist {
        display: block;
        width: 90%;
        margin: auto;
    }
}

@media screen and (max-width:820px) {
    .trampobikusu .main2 .osusumetext {
        margin-bottom: 30px;
    }

    .trampobikusu .main2 .osusumelist li dl {
        padding: 45px 28px 34px;
    }

    .trampobikusu .main2 .osusumelist li dt {
        font-size: 20px;
    }
}

@media screen and (max-width:480px) {
    .trampobikusu .main2 h2 {
        font-size: 24px;
    }

    .trampobikusu .main2 .osusumegroup {
        width: 335px;
    }

    .trampobikusu .main2 .osusumetext,
    .trampobikusu .main2 .osusumetext3 {
        width: 100%;
    }

    .trampobikusu .main2 .osusumelist li dt {
        font-size: 18px;
    }
}


/* ========================================
    トランポビクスをもっと知りたい
========================================= */
.trampobikusu .mottomotto {
    position: relative;
    width: 1000px;
    margin: auto;
}

.trampobikusu .main3 .mottomotto .mottoPC {
    margin-top: 157px;
}


.trampobikusu .main3 .mottomotto p {
    text-align: center;
    font-size: 18px;
    margin-top: 50px;
}

.trampobikusu .mottomotto .woman {
    position: absolute;
    right: 0;
    bottom: -8%;
}

.trampobikusu .main3 .mottomotto .youtube {
    width: 560px;
    height: 315px;
}

@media screen and (max-width:1100px) {
    .trampobikusu .mottomotto {
        width: 90%;
    }

    .trampobikusu .mottomotto .mottoPC {
        width: 100%;
    }

}

@media screen and (max-width:820px) {
    .trampobikusu .mottomotto {
        width: 80%;
    }

    .trampobikusu .main3 .mottomotto .mottoPC {
        margin-top: 78px;
        margin-bottom: 20px;
    }

    .trampobikusu .main3 .mottomotto .youtube {
        width: 100%;
    }

    .trampobikusu .main3 .mottomotto p {
        width: 50%;
        text-align: left;
        margin-top: 33px;
    }

    .trampobikusu .main3 .mottomotto .woman {
        width: 143px;
        height: auto;
        bottom: -6%;
    }

}

@media screen and (max-width:600px) {
    .trampobikusu .main3 .mottomotto .youtube {
        height: 250px;
    }
}

@media screen and (max-width:480px) {
    .trampobikusu .main3 .mottomotto .youtube {
        height: 200px;
    }

    .trampobikusu .main3 .mottomotto .woman {
        bottom: -8%;
    }
}

/* トランポビクスの用具紹介 */
.trampobikusu .main3 .tool {
    width: 1000px;
    margin: auto;
    background-color: #EDFDFB;
    border-radius: 30px;
    display: flex;
    justify-content: space-between;
    padding: 80px 98px;
    box-sizing: border-box;
    margin-top: 174px;
}


.trampobikusu .main3 .tool .intro {
    margin-left: 37px;
}

.trampobikusu .main3 .tool h3 {
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 19px;
}

.trampobikusu .main3 .tool h4 {
    font-size: 20px;
    font-weight: bold;
    color: #87CE78;
    margin-bottom: 5px;
}

.trampobikusu .main3 .tool p {
    font-size: 18px;
    text-align: justify;
}

@media screen and (max-width:1100px) {
    .trampobikusu .main3 .tool {
        width: 70%;
        flex-direction: column-reverse;
        padding: 70px 80px;
    }

    .trampobikusu .main3 .tool img {
        width: 60%;
    }

    .trampobikusu .main3 .tool .intro {
        margin-left: 0;
    }

    .trampobikusu .main3 .tool p {
        margin-bottom: 30px;
    }
}

@media screen and (max-width:820px) {

    .trampobikusu .main3 .tool {
        width: 80%;
        padding: 60px 40px;
        margin-top: 178px;
    }

    .trampobikusu .main3 .tool h3 {
        font-size: 24px;
    }

}

@media screen and (max-width:480px) {
    .trampobikusu .main3 .tool {
        width: 90%;
    }

    .trampobikusu .main3 .tool h3 {
        font-size: 18px;
    }

    .trampobikusu .main3 .tool h4 {
        font-size: 16px;
    }

    .trampobikusu .main3 .tool p {
        font-size: 16px;
        line-height: 25px;
    }

    .trampobikusu .main3 .tool img {
        width: 80%;
        height: 160px;
    }
}

/* ========================================
    トランポビクスチームチャレンジ（演技）
========================================= */
.trampobikusu .main4 .border {
    margin-top: 214px;
    margin-bottom: 70px;
}

.trampobikusu .main4 .team {
    border: 2.1px solid #87CE78;
    width: 760px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 42px;
    padding: 65px;
    margin-bottom: 226px;
    box-sizing: border-box;
}

.trampobikusu .main4 dl {
    text-align: center;
    font-size: 18px;
}

.trampobikusu .main4 dt {
    background-color: #87CE78;
    color: #fff;
    margin-bottom: 10px;
    font-weight: bold;
}

.trampobikusu .main4 dd p {
    text-align: justify;
}

.trampobikusu .main4 .sanka {
    margin-top: 60px;
}

@media screen and (max-width:1100px) {
    .trampobikusu .main4 .team {
        width: 90%;
    }
}

@media screen and (max-width:820px) {
    .trampobikusu .main4 .border {
        margin-top: 190px;
        margin-bottom: 38px;
    }

    .trampobikusu .main4 .team {
        padding: 36px;
        margin-bottom: 250px;
    }

    .trampobikusu .main4 .sanka {
        margin-top: 30px;
    }
}

@media screen and (max-width:530px) {
    .trampobikusu .main4 .teamPC {
        width: 80%;
    }

}

@media screen and (max-width:480px) {
    .trampobikusu .main4 dl {
        font-size: 16px;
    }
}

/* ========================================

    協会についてのページ
    
========================================= */
/* ========================================
    日本トランポビクス協会について
========================================= */
.kyoukai .syousai .border {
    margin-top: 94.5px;
    margin-bottom: 54px;
}


.kyoukai .greetback {
    width: 1000px;
    background-color: #FFFEDB;
    margin: auto;
    border-radius: 30px;
    padding: 84px 122px;
    box-sizing: border-box;
}

.kyoukai .greet {
    margin: auto;
}

.kyoukai .greetflex {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 32px;
}

.kyoukai .greet h3 {
    font-size: 25px;
    font-weight: bold;
    margin-bottom: 40px;
}

.kyoukai .greet h4 {
    font-size: 18px;
}



.kyoukai .greet p {
    font-size: 16px;
    text-align: justify;
}

@media screen and (max-width:1100px) {
    .kyoukai .greetback {
        padding: 76px 90px;
        width: 90%;
        margin: auto;
    }

    .kyoukai .greet {
        padding-top: 0;
    }

    .kyoukai .greet h3 {
        font-size: 23px;
        margin-bottom: 0;
    }

    .kyoukai .greet h4 {
        font-size: 17px;
    }

    .kyoukai .greet img {
        margin-bottom: 35px;
    }
}

@media screen and (max-width:820px) {
    .kyoukai .syousai .border {
        margin-top: 49px;
        margin-bottom: 28px;
    }

    .kyoukai .greetback {
        padding: 68px 60px;
    }

    .kyoukai .greetflex {
        display: block;
    }


}

@media screen and (max-width:480px) {
    .kyoukai .greetback {
        padding: 60px 30px;
    }

    .kyoukai .greet h3 {
        font-size: 21px;
    }

    .kyoukai .greet h4 {
        font-size: 16px;
    }

    .kyoukai .greet p {
        font-size: 16px;
        line-height: 25px;
    }
}


/* ========================================
    沿革
========================================= */

.kyoukai .enkaku .border {
    margin-top: 190px;
    margin-bottom: 73px;
}

.kyoukai .enkaku .enkakuSP {
    display: none;
}

.kyoukai .enkaku .since {
    margin-top: 18px;
}

.kyoukai .enkaku .since img {
    display: inline;
    text-align: left;
}

.kyoukai .enkakutable {
    width: 1000px;
    margin: auto;
}

.kyoukai table {
    margin-top: 15px;
}

.kyoukai table th,
.kyoukai table td {
    font-size: 18px;
    vertical-align: middle;
    height: 70px;
}

.kyoukai .enkaku table th {
    font-weight: bold;
    color: #87CE78;
    width: 139px;
    text-align: center;
    border-left: 1px solid #959595;
    border-right: 1px solid #959595;
}

.kyoukai .enkaku table td {
    padding-left: 31px;
}

@media screen and (max-width:1100px) {
    .kyoukai .enkaku .enkakuPC {
        display: none;
    }

    .kyoukai .enkaku .enkakuSP {
        display: block;
    }

    .kyoukai .enkaku .enkakuSP img {
        margin-bottom: 35px;
    }

    .kyoukai .enkakutable {
        width: 90%;
    }

}

@media screen and (max-width:820px) {
    .kyoukai .enkaku .border {
        margin-top: 109px;
        margin-bottom: 31px;
    }

    .kyoukai .enkaku .enkakuSP img {
        margin-bottom: 25px;
    }



    .kyoukai .enkaku table th {
        width: 80px;
    }

    .kyoukai .enkaku table td {
        padding: 10px 12px;
    }

}

@media screen and (max-width:480px) {
    .kyoukai .enkaku .enkakuPhone img {
        margin-bottom: 15px;
    }

    .kyoukai table th,
    .kyoukai table td {
        font-size: 16px;
        line-height: 25px;
    }

}

/* イベント参加実績 */
.kyoukai .enkaku .event {
    width: 1000px;
    margin: auto;
    margin-top: 69px;
}

.kyoukai .enkaku .event h3 {
    margin-bottom: 26px;
}

.kyoukai .enkaku .event h3 span {
    font-size: 18px;
    font-weight: bold;
    background-color: #87CE78;
    color: #fff;
    padding: 13px 58px 15px 60px;
    border-radius: 9999px;
}

.kyoukai .enkaku .event h4 {
    font-size: 20px;
    font-weight: bold;
    color: #87CE78;
}

.kyoukai .enkaku .event p {
    font-size: 16px;
    margin-bottom: 20px;
}

@media screen and (max-width:1100px) {
    .kyoukai .enkaku .event {
        width: 90%;
    }
}

@media screen and (max-width:480px) {
    .kyoukai .enkaku .event h4 {
        font-size: 16px;
    }

    .kyoukai .enkaku .event p {
        font-size: 14px;
    }
}


/* 指導者紹介 */
.kyoukai .sidousya {
    width: 1000px;
    margin: auto;
    background-color: #F7F7F7;
    padding: 98px 0 129px;
    margin-top: 198px;
}

.kyoukai .sidousya .sidousya_intro {
    width: 786px;
    margin: auto;
}

.kyoukai .sidousya h2 {
    background-color: #87CE78;
    color: #fff;
    font-size: 25px;
    font-weight: bold;
    text-align: center;
    border-radius: 50px;
    padding: 10px 0;
}

.kyoukai .sidousya h3 {
    width: 232px;
    background-color: #87CE78;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 50px;
    margin-bottom: 10px;
}

.kyoukai .sidousya ul {
    display: flex;
    justify-content: space-between;
}



.kyoukai .sidousya li::first-letter {
    color: #87CE78;
}

.kyoukai .sidousya .exa {
    margin-top: 52px;
}

.kyoukai .sidousya .master,
.kyoukai .sidousya .coach {
    margin-top: 71px;
}

.kyoukai .sidousya .exa li {
    font-size: 20px;
}

.kyoukai .sidousya .master li,
.kyoukai .sidousya p {
    font-size: 18px;
}

@media screen and (max-width:1100px) {
    .kyoukai .sidousya {
        width: 90%;
        padding: 98px 40px 129px;
        box-sizing: border-box;
    }

    .kyoukai .sidousya .sidousya_intro {
        width: 100%;
    }
}

@media screen and (max-width:820px) {

    .kyoukai .sidousya {
        width: 100%;
        padding: 54px 47px 57px;
        box-sizing: border-box;
        margin-top: 66px;
    }

    .kyoukai .sidousya ul {
        display: block;
    }

    .kyoukai .sidousya li {
        margin-bottom: 10px;
    }
}

@media screen and (max-width:480px) {
    .kyoukai .sidousya h2 {
        font-size: 20px;
    }

    .kyoukai .sidousya h3 {
        padding: 10px 0;
        font-size: 17px;
    }

    .kyoukai .sidousya .exa li {
        font-size: 18px;
    }

    .kyoukai .sidousya .master li,
    .kyoukai .sidousya p {
        font-size: 16px;
    }
}

/* ========================================
    事務局情報
========================================= */
.kyoukai .jimu .border {
    margin-top: 216px;
    margin-bottom: 70px;
}

.kyoukai .jimu p {
    text-align: center;
}

.kyoukai .jimu p.map {
    font-size: 20px;
}

.kyoukai .jimu p.address {
    font-size: 23px;
    margin-top: 27px;
    margin-bottom: 29px;
}

.kyoukai .jimu p br {
    display: none;
}

@media screen and (max-width:820px) {
    .kyoukai .jimu .border {
        margin-top: 120px;
        margin-bottom: 31px;
    }

    .kyoukai .jimu p br {
        display: block;
    }

    .kyoukai .jimu p.map {
        font-size: 18px;
    }

    .kyoukai .jimu p.address {
        font-size: 20px;
        margin-top: 5px;
    }
}

@media screen and (max-width:480px) {
    .kyoukai .jimu p.map {
        font-size: 15px;
    }

    .kyoukai .jimu p.address {
        font-size: 17px;
    }
}

/* ========================================
    商標・登録商標について
========================================= */
.kyoukai .syouhyou .border {
    margin-top: 190px;
    margin-bottom: 70px;
}

.kyoukai .syouhyou .touroku {
    width: 759px;
    border: 2px solid #87CE78;
    margin: auto;
    text-align: center;
    padding-bottom: 66px;
    margin-bottom: 71px;
}

.kyoukai .touroku p {
    font-size: 18px;
    text-align: justify;
    padding: 53px 76px 18px;
}


.kyoukai .syouhyou .contactbutton {
    margin-bottom: 254px;
}

@media screen and (max-width:1100px) {
    .kyoukai .syouhyou .touroku {
        width: 90%;
    }
}

@media screen and (max-width:820px) {
    .kyoukai .syouhyou .border {
        margin-top: 117px;
        margin-bottom: 30px;
    }

    .kyoukai .syouhyou .touroku {
        padding-bottom: 33px;
        margin-bottom: 33px;
    }
}

@media screen and (max-width:700px) {
    .kyoukai .syouhyou .syouhyouPC {
        width: 90%;
    }

    .kyoukai .touroku p {
        padding: 35px 24px 24px;
    }

    .kyoukai .syouhyou .contactbutton {
        margin-bottom: 207px;
    }

}

@media screen and (max-width:480px) {
    .kyoukai .touroku p {
        font-size: 16px;
        line-height: 25px;
    }
}


/* ========================================

    指導者資格のページ

========================================= */
/* ========================================
    指導者資格制度について
========================================= */
.sidousya .main1 .border {
    margin-top: 95px;
    margin-bottom: 51px;
}

.sidousya .main1 .seido {
    text-align: center;
    width: 90%;
    margin: auto;
}

.sidousya .main1 p {
    font-size: 20px;
}

@media screen and (max-width:820px) {
    .sidousya .main1 .border {
        margin-top: 50px;
        margin-bottom: 40px;
    }

    .sidousya .main1 p {
        display: inline-block;
        text-align: start;
        font-size: 19px;
    }
}

@media screen and (max-width:480px) {
    .sidousya .main1 p {
        font-size: 16px;
    }
}

/* ========================================
    資格の種類
========================================= */
.sidousya .main2 .border {
    margin-top: 240px;
    margin-bottom: 70px;
}


.sidousya .main2 .shikaku {
    border: 2px solid #87CE78;
    width: 759px;
    margin: auto;
    padding: 0 70px 68px;
    box-sizing: border-box;
}


.sidousya .main2 dt {
    background-color: #87CE78;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin-top: 60px;
}

.sidousya .main2 dd {
    font-size: 18px;
}

.sidousya .main2 dd p {
    display: inline-block;
    text-align: justify;
}


@media screen and (max-width:820px) {
    .sidousya .main2 .border {
        margin-top: 120px;
        margin-bottom: 40px;
    }

    .sidousya .main2 .shikaku {
        width: 90%;
        padding: 0 36px 38px;
    }

    .sidousya .main2 dt {
        margin-top: 38px;
    }
}

@media screen and (max-width:480px) {
    .sidousya .main2 .shikaku {
        width: 90%;
    }

    .sidousya .main2 dt {
        font-size: 14px;
    }

    .sidousya .main2 dd {
        font-size: 15px;
    }
}


/* ========================================
    指導員（コーチ）資格の取得方法
========================================= */
.sidousya .main3 .border {
    margin-top: 200px;
    margin-bottom: 70px;
}

.sidousya .main3 .kouchisikaku {
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.sidousya .main3 p {
    text-align: center;
    margin: 10px auto;
}


.sidousya .main3 p.waku {
    font-size: 20px;
    border: 2px solid #87CE78;
    padding: 20px;
}


.sidousya .main3 p.orange {
    font-size: 25px;
    font-weight: bold;
    color: #fff;
    background-color: #F5BD63;
    padding: 33px;
}

@media screen and (max-width:1100px) {
    .sidousya .main3 .kouchisikaku {
        width: 90%;
    }
}

@media screen and (max-width:820px) {
    .sidousya .main3 .border {
        margin-top: 120px;
        margin-bottom: 40px;
    }

    .sidousya .main3 p.orange {
        padding: 27px 20px 21px;
    }
}

@media screen and (max-width:480px) {
    .sidousya .main3 .kouchisikaku {
        width: 90%;
    }

    .sidousya .main3 p.waku {
        font-size: 16px;
    }

    .sidousya .main3 p.orange {
        font-size: 20px;
        padding: 20px 14px 14px;
    }
}

/*========================================
    講習会について
========================================= */
.sidousya .main4 .border {
    margin-top: 180px;
    margin-bottom: 70px;
}

.sidousya .main4 .workPC {
    display: none;
}

.sidousya .main4 .studySP {
    display: none;
}

.sidousya .main4 .kousyu {
    border: 2px solid #87CE78;
    width: 759px;
    margin-top: 32px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 18px;
    padding: 65px;
    box-sizing: border-box;
}

.sidousya .main4 .kousyu .left {
    text-align: justify;
}

.sidousya .main4 .kousyu .jukou {
    margin-top: 44px;
    background-color: #87CE78;
    color: #fff;
    font-weight: bold;
}


@media screen and (max-width:820px) {
    .sidousya .main4 .border {
        margin-top: 120px;
        margin-bottom: 40px;
    }

    .sidousya .main4 .studyPC {
        display: none;
    }

    .sidousya .main4 .workPC {
        display: block;
    }

    .sidousya .main4 .workPC img {
        margin-bottom: 25px;
    }

    .sidousya .main4 .kousyu {
        width: 90%;
        padding: 45px 36px 33px;
    }

    .sidousya .main4 .kousyu .jukou {
        margin-top: 18px;
    }
}

@media screen and (max-width:480px) {
    .sidousya .main4 .workPC {
        display: none;
    }

    .sidousya .main4 .studySP {
        display: block;
    }

    .sidousya .main4 .studySP img {
        margin-bottom: 25px;
    }

    .sidousya .main4 .kousyu {
        width: 90%;
    }


    .sidousya .main4 .kousyu p.left {
        font-size: 15px;
    }

    .sidousya .main4 .kousyu p.jukou {
        font-size: 14px;
    }
}

/*========================================
    資格更新について
========================================= */
.sidousya .main5 .border {
    margin-top: 200px;
    margin-bottom: 70px;
}

.sidousya .main5 .shikakukousin {
    border: 2px solid #87CE78;
    width: 759px;
    margin-left: auto;
    margin-right: auto;
    padding: 65px;
    font-size: 18px;
    text-align: center;
    margin-bottom: 36px;
    box-sizing: border-box;
}

.sidousya .main5 p.left {
    text-align: justify;
}

.main5 {
    margin-bottom: 341.5px;
}


@media screen and (max-width:820px) {
    .sidousya .main5 .border {
        margin-top: 120px;
        margin-bottom: 40px;
    }

    .sidousya .main5 .shikakukousin {
        width: 90%;
        padding: 36px;
    }
}

@media screen and (max-width:480px) {

    .sidousya .main5 .shikakukousin {
        width: 90%;
        font-size: 16px;
        line-height: 25px;
    }
}

/*========================================

    会報誌のページ

=========================================*/
/*========================================
    会報誌バックナンバー
========================================= */
.news .backnumber {
    background-color: #EDFDFB;
    margin-top: 76px;
    margin-bottom: 240px;
    padding-bottom: 217px;
}

.news .backnumber h2 {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    padding-top: 155px;
    padding-bottom: 63px;
}

.kaihoushi {
    display: flex;
    flex-wrap: wrap;
    max-width: 805px;
    width: 100%;
    margin: auto;
    justify-content: space-between;
}

.kaihoushi li {
    width: 25.1%;
    margin: 0 auto 63px;
    text-align: center;
}

.kaihoushi li img {
    width: 100%;
    height: auto;
    margin-bottom: 14px;
    max-width: 207px;
}

.kaihoushi li p {
    background-color: #87CE78;
    color: #fff;
    font-size: 16px;
    text-align: center;
    max-width: 207px;
    margin: auto;
}

.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 8px;
    list-style-type: none;
    padding: 0;
}


.pagination a {
    display: flex;
    justify-content: center;
    align-items: center;
    width:2em;
    height: 2em;
    border: 2px solid #87ce78;
    border-radius: 25px;
    color: #87ce78;
    background-color: #fff;
}

.pagination .current a {
    background-color: #87ce78;
    color: #fff;
    pointer-events: none;
}


@media screen and (max-width:820px) {
    .kaihoushi li {
        width: 46%;
        margin-bottom: 50px;
    }
}

@media screen and (max-width:480px) {
    .news .backnumber h2 {
        font-size: 20px;
        padding-top: 53px;
        padding-bottom: 32px;
    }

    .news .backnumber {
        margin-top: 40px;
        margin-bottom: 160px;
        padding-bottom: 60px;
    }

    .kaihoushi li {
        width: 75%;
        margin: 0 auto 39px;
    }
}

/*========================================

    お問い合わせのページ

=========================================*/
/*========================================
    お気軽にご相談・お問い合わせください
========================================= */
.contact .contactform h2 {
    font-size: 20px;
    text-align: center;
    margin-top: 85px;
    margin-bottom: 71px;
}

.contact .contable {
    width: 1000px;
    margin: auto;
}

.contact table {
    margin: auto;
    width: 820px;
}

.contact table tr {
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
}

.contact table th,
.contact table td {
    vertical-align: middle;
    padding: 19px 0;
}

.contact table th {
    color: #87CE78;
    width: 221px;
    font-size: 18px;
    font-weight: bold;
    padding-right: 50px;
    position: relative;
    box-sizing: border-box;
}

.contact .attention {
    text-align: right;
}

.contact .required {
    background-color: red;
    color: #fff;
    font-size: 16px;
    font-weight: normal;
    border-radius: 3px;
    padding: 4px;
    position: absolute;
    right: 1em;
    top: 50%;
    transform: translateY(-50%);
    line-height: 1.0;
}

.detail .required {
    top: 17%;
}

.contact table td label {
    font-size: 16px;
}

.contact table .checkcontact {
    transform: scale(1.5);
    margin-right: 9px;
}

.contact table .classcontact {
    margin-right: 24.5px;
}

.contact .form-text {
    width: 575px;
    height: 50px;
    border: 1px solid #959595;
    font-size: 20px;
    padding-left: 4px;
    box-sizing: border-box;
}

.contact .detail {
    vertical-align: top;
}

.contact table td textarea {
    width: 575px;
    height: 168px;
    border: 1px solid #959595;
    font-size: 20px;
    padding-top: 4px;
    padding-left: 4px;
    box-sizing: border-box;
}

@media screen and (max-width:1100px) {
    .contact .contable {
        width: 90%;
    }
}

@media screen and (max-width:920px) {
    .contact table {
        width: 100%;
    }

    .contact .form-text {
        width: 100%;
    }


    .contact table tr {
        width: 80%;
        margin: auto;
    }

    .contact table th,
    .contact table td {
        display: block;
        padding: 0;
        width: 100%;
    }

    .contact table th {
        padding-top: 20px;
    }

    .contact table td {
        padding-bottom: 15px;
    }

    .contact table td textarea {
        width: 100%;
    }

    .contact .required {
        top: 65%;
    }
}

@media screen and (max-width:820px) {
    
}

@media screen and (max-width:480px) {
    .contable label {
        width: 100%;
        display: block;
    }
}


/*========================================
    個人情報保護方針
========================================= */
.contact .information {
    width: 823px;
    margin: 45px auto 239px;
}

.contact .information h2 {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #87CE78;
    margin-bottom: 23px;
}

.contact .informationtext {
    border: 1px solid #959595;
    padding: 13px 25px;
    overflow-y: auto;
}

.contact .informationtext p {
    font-size: 16px;
    text-align: justify;
    height: 201px;
}

.contact .information label {
    font-size: 18px;
    display: block;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 67px;
}

.contact .information .check {
    transform: scale(1.5);
    border-radius: 0%;
}

.contact .information label span {
    background-color: red;
    color: #fff;
    font-size: 16px;
    font-weight: normal;
    border-radius: 3px;
    padding: 4px;
    margin-left: 5px;
}

.contact .send {
    background: #87CE78 url(../img/link.png) no-repeat right 10px center;
    width: 299px;
    margin: auto;
    border-radius: 30px;
    display: block;
    color: #fff;
    padding: 13px 0;
    cursor: pointer;
    border: none;
    font-size: 16px;
    font-weight: bold;
}

@media screen and (max-width:1100px) {
    .contact .information {
        width: 80%;
    }
}

@media screen and (max-width:820px) {

    .contact .informationtext p {
        height: 291px;
    }

    .contact .information label {
        text-align: left;
    }
}

@media screen and (max-width:480px) {
    .contact .information label {
        font-size: 16px;
    }
}



/*========================================

    サイトポリシーのページ

=========================================*/
.sitepolicy {
    width: 1000px;
    margin: 70px auto 231px;
}


.sitepolicy .text p {
    text-align: justify;
}

.sitepolicy .extext p {
    font-size: 20px;
}

.sitepolicy h2 {
    margin-top: 100px;
    font-size: 20px;
    font-weight: bold;
    background-color: #87CE78;
    color: #fff;
    text-align: left;
    padding: 10px 23px;
}

.sitepolicy .text p,
.sitepolicy li {
    font-size: 18px;
}

.sitepolicy .policytext {
    margin-top: 10px;
}

.sitepolicy ol {
    margin-top: 36px;
}

@media screen and (max-width:1100px) {
    .sitepolicy {
        width: 90%;
    }
}

@media screen and (max-width:820px) {
    .sitepolicy {
        margin: 20px auto 175px;
    }

    .sitepolicy h2:not(#kinshi) {
        margin-top: 80px;
    }

    .sitepolicy h2#kinshi {
        margin-top: 40px;
    }

}

@media screen and (max-width:480px) {

    .sitepolicy p,
    .sitepolicy li {
        line-height: 25px;
    }


    .sitepolicy .extext p {
        font-size: 18px;
    }

    .sitepolicy .text p,
    .sitepolicy li {
        font-size: 16px;
    }
}

/*========================================

    お問い合わせ送信後のthanksページ

=========================================*/
.thanks h2 {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-top: 300px;
    margin-bottom: 300px;
}

@media screen and (max-width:480px) {
    .thanks h2 {
        font-size: 18px;
        margin-top: 100px;
        margin-bottom: 200px;
    }
}



/* アニメーション */
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
  opacity: 0;
    &.infinite {
      -webkit-animation-iteration-count: infinite;
      animation-iteration-count: infinite;
    }
  }
  
  @-webkit-keyframes fadeIn {
    from {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
  }
  
  @keyframes fadeIn {
    from {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
  }
  
  .fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
  }
  
  @-webkit-keyframes fadeInLeft {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  @keyframes fadeInLeft {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  .fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
  }
  
  @-webkit-keyframes fadeInRight {
    from {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  @keyframes fadeInRight {
    from {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  .fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
  }
  
  @-webkit-keyframes fadeInUp {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  @keyframes fadeInUp {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  .fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
  }