@charset "UTF-8";


.top-message {
    background: url(../img/top/img_main-smp.png) no-repeat center top;
    background-size: contain;
    min-height: 418px;
    position: relative;
    z-index: 2;
}
.top-message .achievement {
    width: 90%;
    max-width: 90%;
    transform: translate(0);
    top: 230px;
    left: 0;
    right: 0;
    position: absolute;
    margin: auto;
}
a.top_banner_voice {
    position: absolute;
    display: block;
    right: -15px;
    bottom: -35px;
    -webkit-animation: fuwafuwa 3s infinite linear alternate;
    animation:fuwafuwa 3s infinite linear alternate;
    width: 70px;
    height: auto;
}
@-webkit-keyframes fuwafuwa {
    0% {-webkit-transform:translate(0, 0);}
    50% {-webkit-transform:translate(0, -5px);}
    100% {-webkit-transform:translate(0, 0);}
}

@keyframes fuwafuwa {
    0% {transform:translate(0, 0);}
    50% {transform:translate(0, -5px) rotate(0deg);}
    100% {transform:translate(0, 0)}
}


.top-introduction {padding-top: 10vh;}
.top-message .inner {
    margin: 40px auto;
    width: 90%;
}

.top-message .lead {
    background: #fd7e01;
    color: #FFF;
    font-size: 12px;
    text-align: center;
    border-radius: 200px;
    padding: 10px 0;
    margin-bottom: 10px;
}

.top-message h2 {
    font-size: 6.5vw;
    text-align: center;
}


.top-message .inner:after {
    content: " ";
    background: url(../img/top/img_top-message01.png) no-repeat;
    background-size: 100%;
    width: 70px;
    height: 70px;
    position: absolute;
    bottom: 0px;
    bottom: -34px;
    z-index: 3;
}



.top-introduction {
    background: url(../img/common/bg_star.png) repeat center top;
    background-size: 150%;
    position: relative;
    margin: -100px 0;
    z-index: 1;
}

.top-introduction .inner {
    margin: 0 auto;
    padding: 50px 0;
    width: 90%;
    position: relative;
}

.top-introduction .inner .notice_box {
    max-width: 533px;
    width: 100%;
    margin: 20px auto;
    padding: 10px;
    border: 2px solid #f39800;
    text-align: center;
    background: #f7f5f2;
    display: flex;
    align-items: center;
    justify-content: center;
}
.top-introduction .inner .notice_box .title{
    line-height: 2;
}
.top-introduction .inner .notice_box .title a{
    color: #333;
    border-bottom: 2px solid #f39800;
    font-size: 4.2vw;
    font-weight: bold;
}
.top-introduction .inner .notice_box .title a:hover{
    text-decoration: none;
    opacity: 0.6;
}
.top-introduction .inner .banner_box {
    max-width: 1000px;
    margin: auto;
    padding: 0;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.top-introduction .inner .banner_box .banner a{
    display: block;
    margin: 10px auto;
    height: 100%;
}
.top-introduction .inner .banner_box .banner a:hover img{
    opacity: 0.6;
}
.top-introduction h3 {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.top-introduction h3 img {
    height: 16px;
}

.top-introduction h3 span {
    font-size: 20px;
    color: #fd7e01;
    display: block;
}

.top-introduction p {
    font-size: 13px;
}



.top-junbi {
    background: url(../img/top/bg_top-junbi-smp.png) no-repeat center top;
    background-size: 100%;
    min-height: 430px;
    position: relative;
    z-index: 3;
}

.top-junbi:after {
    content: " ";
    background: url(../img/top/img_top-message02.png) no-repeat;
    background-size: 100%;
    width: 88px;
    height: 85px;
    position: absolute;
    top: -40px;
    right: 20px;
    z-index: 30;
}

.top-junbi:before {
    content: " ";
    background: url(../img/top/img_top-message03.png) no-repeat;
    background-size: 100%;
    width: 98px;
    height: 85px;
    position: absolute;
    top: -40px;
    left: 20px;
    z-index: 30;
}

.top-junbi .inner {
    margin: 100px auto;
    padding: 60px 0;
    width: 90%;
}

.top-junbi h3 {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.top-junbi p {
    font-size: 13px;
    margin-right: 34%;
}


.top-anshin {
    background: #f7f0d2;
    position: relative;
    z-index: 1;
}

.top-anshin .inner {
    margin: -20px auto 0;
    padding: 60px 0 30px;
    width: 90%;
}

.top-anshin h3 {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.top-anshin h3 img {
    height: 16px;
}

.top-anshin h3 span {
    font-size: 20px;
    color: #fd7e01;
    display: block;
}

.top-anshin ul {
    text-align: center;
}

.top-anshin li {
    width: 48%;
    display: inline-block;
    box-sizing: border-box;
    padding: 5px;
    margin-bottom: 10px;
}

.top-anshin li p {
    font-size: 12px;
}

.top-anshin li figure {
    position: relative;
}

.top-anshin li figure:after {
    position: absolute;
    left: 0;
    top: 5px;
    background: url(../img/common/bg_num.png) no-repeat;
    background-size: 100%;
    width: 50px;
    height: 50px;
    line-height: 50px;
    display: block;
    color: #FFF;
    font-weight: bold;
    font-size: 14px;
}

.top-anshin li:nth-child(1) figure:after {
    content: "1";
}

.top-anshin li:nth-child(2) figure:after {
    content: "2";
}

.top-anshin li:nth-child(3) figure:after {
    content: "3";
}

.top-anshin li:nth-child(4) figure:after {
    content: "4";
}

.top-anshin li:nth-child(5) figure:after {
    content: "5";
}

.top-anshin li:nth-child(6) figure:after {
    content: "6";
}

.top-anshin li:nth-child(2n) {
    margin-left: 2%;
}



.top-shikaku {
    background: #FFF;
    position: relative;
    z-index: 3;
}

.top-shikaku:before {
    content: " ";
    display: block;
    width: 100%;
    height: 30px;
    background: url(../img/top/bg_anshin-smp.png) no-repeat center top;
    background-size: 100%;
}

.top-shikaku .inner {
    margin: 0 auto;
    padding: 40px 0;
    width: 90%;
}

.top-shikaku h3 {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.top-shikaku p {
    font-size: 13px;
}

.top-shikaku .photo {
    margin-top: 20px;
    margin-right: -10px;
}

.top-shikaku ul {
    width: 90%;
    margin: 0 auto;
    clear: both;
}

.top-shikaku li {
    margin-top: 20px;
}

.top-shikaku a {
    background: #fd7e01;
    border: 2px solid #fd7e01;
    border-radius: 32px;
    display: block;
    text-align: center;
    padding: 10px 0;
    font-size: 12px;
    color: #FFF;
}

.top-shikaku a:hover {
    background: #FFF;
    color: #fd7e01;
}

.top-shikaku a span {
    position: relative;
    display: inline-block;
    padding: 0 0 0 20px;
}

.top-shikaku a span:before,
.top-shikaku a span:after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: " ";
    display: block;
    vertical-align: middle;
}

.top-shikaku a span:before {
    left: 0px;
    top: -0.5px;
    width: 11px;
    height: 1px;
    background: #FFF;
}

.top-shikaku a span:after {
    left: 3px;
    width: 8px;
    height: 8px;
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.top-shikaku a:hover span:before {
    background: #fd7e01;
}

.top-shikaku a:hover span:after {
    border-top: 1px solid #fd7e01;
    border-right: 1px solid #fd7e01;
}

.top-shikaku li:nth-child(2) a {
    background: #feb267;
    border: 2px solid #feb267;
}

.top-shikaku li:nth-child(2) a:hover {
    background: #FFF;
    color: #feb267;
}

.top-shikaku li:nth-child(2) a span:before {
    left: 0px;
    top: -0.5px;
    width: 24px;
    height: 14px;
    background: url(../img/common/ico_site.svg) no-repeat;
}

.top-shikaku li:nth-child(2) a:hover span:before {
    background: url(../img/common/ico_site_on.svg) no-repeat;
}

.top-shikaku li:nth-child(2) a span:after {
    display: none;
}

.top-oneday {
    background: url(../img/common/bg_top-hum-smp.png) no-repeat center bottom,
    url(../img/common/bg_star.png) repeat center top;
    background-size: 80%, 150%;
}

.top-oneday .inner {
    margin: 0 auto;
    padding: 50px 0 140px;
    width: 90%;
    position: relative;
}

.top-oneday h3 {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.top-oneday p {
    font-size: 13px;
}

.top-oneday .photo {
    max-width: 500px;
}

.top-oneday .photo img {
    border-radius: 8px;
}

.top-oneday a {
    background: #fd7e01;
    border: 2px solid #fd7e01;
    border-radius: 32px;
    display: block;
    text-align: center;
    padding: 10px 0;
    font-size: 12px;
    color: #FFF;
}

.top-oneday a:hover {
    background: #FFF;
    color: #fd7e01;
}

.top-oneday a span {
    position: relative;
    display: inline-block;
    padding: 0 0 0 20px;
}

.top-oneday a span:before,
.top-oneday a span:after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: " ";
    display: block;
    vertical-align: middle;
}

.top-oneday a span:before {
    left: 0px;
    top: -0.5px;
    width: 11px;
    height: 1px;
    background: #FFF;
}

.top-oneday a span:after {
    left: 3px;
    width: 8px;
    height: 8px;
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.top-oneday a:hover span:before {
    background: #fd7e01;
}

.top-oneday a:hover span:after {
    border-top: 1px solid #fd7e01;
    border-right: 1px solid #fd7e01;
}

.top-oneday .btn_link {
    width: 90%;
    margin: 20px auto;
}




.top-news .inner {
    margin: 0 auto 0;
    padding: 40px 0 30px;
    width: 90%;
}

.top-news h3 {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.top-news h3 img {
    height: 16px;
}

.top-news h3 span {
    font-size: 20px;
    color: #fd7e01;
    display: block;
}

.top-news p {
    font-size: 12px;
}

.blog-top-post {
    margin: 15px 2% 20px;
    display: inline-block;
    vertical-align: top;
    width: 44%;
}

.blog-top-post .tit {
    font-size: 16px;
    padding: 0;
    font-weight: bold;
    text-align: left;
}

.blog-top-post .tit a {
    color: #fd7e01;
}

.blog-top-post p.time {
    font-size: 12px;
    margin: 10px 0 0px;
}

.blog-top-post .photo {
    text-align: center;
    position: relative;
    height: 120px;
    margin-bottom: 10px;
}

.blog-top-post .photo img {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: #FFF;
    object-fit: cover;
}
.blog-top-post .photo .office a {
    position: absolute;
    background: #87ce47;
    font-size: 12px;
    padding: 4px 12px;
    left: 0;
    top: 0;
    border-radius: 0 0 10px 0;
    color: #fff;
}
.blog-top-post .cat a {
    display: block;
    padding: 5px 10px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    font-size: 12px;
    background: #fdad01;
    border-radius: 4px;
}

.blog-top-post .cat.schedule a {
    background: #fdd101;
}

.top-news .btn_link a {
    background: #FFF;
    border: 2px dotted #fd7e01;
    border-radius: 32px;
    display: block;
    text-align: center;
    padding: 10px 0;
    font-size: 12px;
    color: #fd7e01;
}

.top-news .btn_link a:hover {
    background: #fd7e01;
    color: #FFF;
}

.top-news .btn_link a span {
    position: relative;
    display: inline-block;
    padding: 0 0 0 20px;
}

.top-news .btn_link a span:before,
.top-news .btn_link a span:after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: " ";
    display: block;
    vertical-align: middle;
}

.top-news .btn_link a span:before {
    left: 0px;
    top: -0.5px;
    width: 11px;
    height: 1px;
    background: #fd7e01;
}

.top-news .btn_link a span:after {
    left: 3px;
    width: 8px;
    height: 8px;
    border-top: 1px solid #fd7e01;
    border-right: 1px solid #fd7e01;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.top-news .btn_link a:hover span:before {
    background: #FFF;
}

.top-news .btn_link a:hover span:after {
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
}

.top-news .btn_link {
    width: 70%;
    margin: 20px auto;
}



.top-support {
    background: url(../img/common/bg_pa01.png) repeat center top;
    position: relative;
    padding: 20px 0;
    margin: 40px 0;
}

.top-support .inner {
    margin: 20px auto;
    width: 90%;
}

.top-support h3 {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.top-support h3 img {
    height: 16px;
}

.top-support h3 span {
    font-size: 20px;
    color: #fd7e01;
    display: block;
}

.top-support h4 {
    color: #482400;
    text-align: center;
    border-bottom: 2px dotted #482400;
    padding: 10px 0;
    margin-bottom: 10px;
}

.top-support p {
    font-size: 12px;
}

.top-support:before {
    content: " ";
    background: url(../img/common/bg_wave-top.png) repeat-x left bottom;
    width: 100%;
    height: 50px;
    position: absolute;
    top: -50px;
}

.top-support:after {
    content: " ";
    background: url(../img/common/bg_wave-bottom.png) no-repeat left top;
    width: 100%;
    height: 50px;
    position: absolute;
    bottom: -50px;
}

.top-support ul li {
    margin: 20px 0 40px;
}

.top-support ul .thumb {
    text-align: center;
}

.top-support a {
    background: #fd7e01;
    border: 2px solid #fd7e01;
    border-radius: 32px;
    display: block;
    text-align: center;
    padding: 10px 0;
    font-size: 12px;
    color: #FFF;
}

.top-support a:hover {
    background: #FFF;
    color: #fd7e01;
}

.top-support a span {
    position: relative;
    display: inline-block;
    padding: 0 0 0 20px;
}

.top-support a span:before,
.top-support a span:after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: " ";
    display: block;
    vertical-align: middle;
}

.top-support a span:before {
    left: 0px;
    top: -0.5px;
    width: 11px;
    height: 1px;
    background: #FFF;
}

.top-support a span:after {
    left: 3px;
    width: 8px;
    height: 8px;
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.top-support a:hover span:before {
    background: #fd7e01;
}

.top-support a:hover span:after {
    border-top: 1px solid #fd7e01;
    border-right: 1px solid #fd7e01;
}





@media (min-width: 768px) {

    .top-message {
        background: url(../img/top/img_main.png) no-repeat center top;
        background-size: auto;
        min-height: 625px;
        padding-top: 1px;
    }

    .top-message .inner {
        margin: 60px auto 30px;
        width: 100%;
        max-width: 1000px;
    }

    .top-message .inner h2 {
        font-size: 38px;
        text-align: left;
    }

    .top-message .inner .lead {
        width: 47%;
        margin: 0 0 10px 1.5%;
        font-size: 14px;
    }
.top-message .inner .lead span.large{
        font-size: 18px;    
}
    .top-message .inner:after {
        width: 176px;
        height: 170px;
        bottom: -150px;
        left: auto;
        margin-left: -60px;
    }
    .top-message {
        min-height: 600px;
    }

    .top-message .achievement {
        width: 100%;
        max-width: 1000px;
        margin: auto;
        transform: translateX(-30px);
        top: auto;
        position: relative;
    }
    a.top_banner_voice {
        position: absolute;
        display: block;
        right: 353px;
        bottom: -20px;
        -webkit-animation: fuwafuwa 3s infinite linear alternate;
        animation:fuwafuwa 3s infinite linear alternate;
        width: 151px;
        height: auto;
    }
    a.top_banner_voice:hover {
        animation-play-state: paused;
        opacity: 0.9;
    }


    .top-introduction {
        background-size: auto;
        margin: -40px 0;
        z-index: 1;
    }

    .top-introduction .inner {
        padding: 40px 0 80px;
        position: relative;
    }

    .top-introduction .inner:before {
        content: " ";
        background: url(../img/top/img_top-message02.png) no-repeat;
        background-size: 100%;
        width: 191px;
        height: 168px;
        position: absolute;
        top: -30px;
        right: 40px;
        z-index: -1;
        opacity: 0;
    }
    .top-introduction .inner .notice_box{
        margin: 20px auto;
        padding: 30px;
    }
    .top-introduction .inner .notice_box .title a{
        font-size: 20px;
    }

    .top-introduction .inner .banner_box {
        max-width: 1000px;
        margin: 20px auto;
        padding: 0;
        text-align: center;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .top-introduction .inner .banner_box .banner img{
        height: 200px;
    }
    .top-introduction .inner .banner_box .banner.right img {
        width: 447px;
        height: 100%;
    }
    .top-introduction .inner .notice_box {
        margin: 0;
    }
    .top-introduction .inner .banner_box .banner a{
        margin: 0
    }
    .top-introduction .inner .banner_box {
        margin: 20px auto 0;
    }


    .top-introduction .inner .banner_box.mb100 {margin-bottom: 100px;}


    .top-introduction p {
        text-align: center;
        font-size: 22px;
    }

    .top-introduction h3 {
        font-size: 26px;
    }

    .top-introduction h3 span {
        font-size: 42px;
    }

    .top-introduction h3 img {
        height: auto;
    }


    .top-junbi {
        background: url(../img/top/bg_top-junbi.png) no-repeat center top;
        padding: 120px 0;
        background-size: 100%;
    }

    .top-junbi:after {
        display: none;
    }

    .top-junbi:before {
        display: none;
    }

    .top-junbi .inner {
        margin: 0px auto;
        padding: 0;
        width: 100%;
        max-width: 1000px;
        position: relative;
    }

    .top-junbi .inner:before {
        content: " ";
        background: url(../img/top/img_top-message03.png) no-repeat;
        background-size: 100%;
        width: 229px;
        height: 202px;
        position: absolute;
        top: -160px;
        left: -80px;
        z-index: 3;
    }

    .top-junbi h3 {
        font-size: 26px;
        margin-bottom: 30px;
        padding-bottom: 20px;
    }

    .top-junbi p {
        font-size: 22px;
    }


    .top-anshin {
        z-index: 4;
    }

    .top-anshin:before,
    .top-anshin:after {
        content: " ";
        width: 100%;
        height: 30px;
        position: absolute;
    }

    .top-anshin:before {
        background: url(../img/common/bg_wave-top4.png) repeat-x left top;
        top: -30px;
    }

    .top-anshin:after {
        background: url(../img/common/bg_wave-bottom4.png) repeat-x left bottom;
        bottom: -50px;
    }

    .top-anshin .inner {
        margin: 0 auto;
        width: 100%;
        max-width: 1000px;
    }

    .top-anshin h3 {
        font-size: 26px;
    }

    .top-anshin h3 span {
        font-size: 42px;
    }

    .top-anshin h3 img {
        height: auto;
    }

    .top-anshin li {
        width: 30%;
        margin-bottom: 20px;
    }

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

    .top-anshin li figure:after {
        width: 80px;
        height: 80px;
        line-height: 80px;
        font-size: 24px;
    }


    .top-shikaku .inner {
        padding: 100px 0;
        width: 100%;
        max-width: 1000px;
    }

    .top-shikaku h3 {
        font-size: 26px;
        padding-bottom: 20px;
    }

    .top-shikaku .half-box {
        margin: 40px 0 0;
    }

    .top-shikaku .photo {
        float: right;
        margin-top: 0;
    }

    .top-shikaku p {
        font-size: 20px;
        line-height: 1.8;
    }

    .top-shikaku ul li {
        width: 48%;
        display: inline-block;
    }

    .top-shikaku ul li a {
        font-size: 20px;
    }

    .top-oneday {
        background: url(../img/common/bg_star.png) repeat center top;
        background-size: 100%;
    }

    .top-oneday .inner {
        padding: 100px 0;
        width: 100%;
        max-width: 1000px;
        background: url(../img/common/bg_top-hum01.png) no-repeat left bottom,
        url(../img/common/bg_top-hum02.png) no-repeat right bottom;
    }

    .top-oneday h3 {
        font-size: 26px;
        padding-bottom: 20px;
    }

    .top-oneday p {
        font-size: 22px;
        text-align: center;
        margin: 40px auto;
    }

    .top-oneday .half-box {
        display: flex;
        align-items: center;
        flex-direction: column-reverse;
    }

    .top-oneday .half-box p {
        width: 60%;
        padding-left: 20px;
        text-align: left;
    }

    .top-oneday .half-box .photo {
        max-width: 1000px;
        width: 100%;
        padding-left: 0;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 16px;
    }

    .top-oneday .btn_link {
        width: 40%;
    }

    .top-oneday a {
        font-size: 20px;
    }


    .top-news h3 {
        font-size: 26px;
        padding-bottom: 20px;
    }

    .top-news h3 img {
        height: auto;
    }

    .top-news .btn_link {
        width: 15%;
    }

    .top-news .btn_link a {
        font-size: 20px;
    }

    .blog-top-list .blog-top-post:nth-child(2n) {
        margin-left: 14px;
    }

    .blog-top-post {
        display: inline-block;
        width: 46%;
        vertical-align: top;
        margin: 0 1.5% 20px;
    }

    .blog-top-post .tit {
        padding: 0;
        font-size: 18px;
    }

    .blog-top-post .txt {
        padding: 10px 20px 0;
        font-size: 14px;
    }

    .blog-top-post ul {
        padding: 25px 20px 20px;
    }

    .blog-top-post .cat a {
        margin-bottom: 10px;
    }

    .blog-top-post a:hover img {
        opacity: 0.7;
    }

    .blog-top-post a:hover {
        text-decoration: underline;
    }
    .blog-top-post .photo {
        height: 210px;
    }
    .top-support {
        padding: 60px 0;
    }

    .top-support:after {
        background-size: 100%;
    }

    .top-support .inner {
        margin: 0 auto;
        width: 100%;
        max-width: 1000px;
    }

    .top-support h3 {
        font-size: 26px;
    }

    .top-support h3 span {
        font-size: 42px;
    }

    .top-support h3 img {
        height: auto;
    }

    .top-support ul {
        text-align: center;
        margin-top: 20px;
    }

    .top-support ul li {
        width: 30%;
        display: inline-block;
        vertical-align: top;
    }

    .top-support ul li:nth-child(2) {
        margin: 20px 3% 40px;
    }

    .top-support p {
        font-size: 16px;
        text-align: left;
    }

    .top-support .btn_link {
        text-align: center;
    }

    .top-support a {
        font-size: 20px;
        display: inline-block;
        padding: 10px 20px;
    }

    .top-support a br {
        display: none;
    }


    .top-access .inner {
        padding: 50px 0;
        width: 100%;
        max-width: 1000px;
    }

    .top-access h3 {
        font-size: 26px;
        padding-bottom: 20px;
    }

    .top-access h3 img {
        height: auto;
    }

    .top-access .half-box {
        overflow: hidden;
        margin-top: 30px;
    }

    .top-access .half-box .photo {
        width: 70%;
        float: left;
    }
.top-access .half-box iframe {
        width: 100%;
        height: 450px;
    }

    .top-access .half-box .txt {
        width: 40%;
        float: left;
        margin: 60px 0 0 -10%;
    }

    .top-access .half-box .txt h4 {
        font-size: 16px;
    }

    .top-access .half-box .txt h4 span {
        font-size: 26px;
    }

    .top-access .half-box .txt p {
        font-size: 18px;
    }

    .top-access a {
        font-size: 20px;
    }

    .top-access .half-box .txt .tel {
        background: #FFF;
        border: none;
        font-size: 34px;
        color: #fd7e01;
    }

    .top-access .tel span {
        padding-left: 30px;
    }

    .top-access .tel span:before {
        width: 24px;
        height: 24px;
    }

}

@media (min-width: 940px) {

    .blog-top-list {
        text-align: left;
        width: 1000px;
        margin: 20px auto;
        display: flex;
        justify-content: space-between;
    }

    .blog-top-list li,
    .blog-top-list li:nth-child(2n) {
        width: 310px;
        margin: 0 0 30px 0!important;
    }

    .blog-top-list li:nth-child(3) {
        margin-right: 0 !important;
    }

    .blog-top-list .thumb {
        width: 300px;
        height: 240px;
    }


}




.top-office-links {
    padding: 50px 0 0;
}

.top-office-links__inner {
    max-width: 1000px;
    margin: auto;
    border: 2px solid #5a2d00;
    border: 0;
    border-radius: 20px;
    padding: 50px;
    background: #f7f5f2;
}

.top-office-links__tit {
    text-align: center;
    color: #5a2d00;
    font-size: 28px;
    margin: 0 0 20px;
}

.top-office-links__btn-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    max-width: 600px;
    margin: auto;
}

.top-office-links__btn {
    width: 50%;
    text-align: center;
    padding-top: 30px;
    position: relative;
}

.top-office-links__btn__link {

    padding: 20px 20px;
    border-radius: 200px;
    display: block;
    width: 80%;
    margin: auto;
    background: #fd7e01;
    border: 2px solid #fd7e01;
    padding: 10px 0;
    color: #FFF;
    font-weight: bold;
    font-size: 18px;
    transition: 0.4s;
}
.top-office-links__btn__link:hover{
    color: #fd7e01;
    background: #fff;    
    text-decoration: none;
}
.top-office-links__btn__txt01 {
    display: inline-block;
    position: absolute;
    margin: 0 0 10px;
    font-weight: bold;
    background:linear-gradient(transparent 60%, #FFEB3B 60%);
    left: 0;
    right: 0;
    margin: auto;
    width: 180px;
    top: 0;
    -webkit-animation: fuwafuwa 4.5s infinite linear alternate;
    animation: fuwafuwa 4.5s infinite linear alternate;
}

.top-office-links__btn__txt01::before {
    content: "";
    border: 1px solid #5a2d00;
    width: 1px;
    height: 100%;
    transform: rotate(-45deg);
    position: absolute;
    left: -16px;
}

.top-office-links__btn__txt01::after {
    content: "";
    border: 1px solid #5a2d00;
    width: 1px;
    height: 100%;
    transform: rotate(45deg);
    position: absolute;
    right: -16px;
}

.top-office-links__btn__txt02 {
    font-size: 14px;
    margin-top: 10px;
}



@media (max-width: 767px) {

.top-office-links__inner {
    padding: 20px 10px;
    border-radius: 0;
}

.top-office-links__tit {
    font-size: 16px;
}

.top-office-links__btn__link {
    width: 95%;
    font-size: 14px;
}

.top-office-links__btn__txt02 {
    font-size: 12px;
}

.top-office-links__btn__txt01 {
    font-size: 12px;
    width: 142px;
}
.top-office-links__btn__txt01::before {
    content: "";
    border: 1px solid #5a2d00;
    width: 1px;
    height: 80%;
    transform: rotate(-45deg);
    position: absolute;
    left: -16px;
    top: 2px;
}

.top-office-links__btn__txt01::after {
    content: "";
    border: 1px solid #5a2d00;
    width: 1px;
    height: 80%;
    transform: rotate(45deg);
    position: absolute;
    right: -16px;
    top: 2px;
}

}


/* Topics */
.top-topics {
    padding: 50px 0 0;
    position: relative;
    z-index: 2;
}

.top-topics__inner {
    max-width: 1000px;
    margin: auto;
    border: 2px solid #fd7e01;
    border-radius: 20px;
    padding: 50px;
}

.top-topics__tit {
    text-align: center;
    color: #5a2d00;
    font-size: 28px;
    margin: 0 0 20px;
}

.top-topics__wrap {
    display: flex;
    gap: 40px;
    margin: auto;
    max-width: 800px;
}

.top-topics__content {
    width: 50%;
    padding-top: 30px;
    display: flex;
    flex-direction: column;
}

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

.top-topics__text span.color {
    color: #fd7e01;
}

.top-topics__btn{
    margin-top: auto;
}

.top-topics__link {
    border-radius: 200px;
    display: block;
    width: 80%;
    margin: auto;
    background: #fd7e01;
    border: 2px solid #fd7e01;
    padding: 10px 0;
    color: #FFF;
    font-weight: bold;
    font-size: 18px;
    transition: 0.4s;
    text-align: center;
    cursor: pointer;
}
.top-topics__link:hover{
    color: #fd7e01;
    background: #fff;
    text-decoration: none;
}

.top-topics__link.top-topics__link--pale {
    background: #fdad01;
    border: 2px solid #fdad01;
}
.top-topics__link.top-topics__link--pale:hover{
    color: #fdad01;
    background: #fff;
    text-decoration: none;
}

.top-topics__content figcaption {
    font-size: 12px;
    text-align: center;
}

.top-topics__btn--accordion {
    position: relative;
}

.top-topics__accordion-wrap {
    border: 2px solid #fdad01;
    padding: 10px 20px;
    border-radius: 10px;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 10px auto;
    width: calc(100% - 50px);
    background: #fff;
}

.top-topics__accordion-contents {
    display: block;
    color: #5a2d00;
    text-decoration: underline;
}

.top-topics__accordion-contents:nth-child(n+2) {
    margin-top: 10px;
}

details {
  /* --------アコーディオンの中身のスタイル-------- */
  &::details-content {
    transition:
      height 0.4s,
      opacity 0.4s,
      content-visibility 0.4s allow-discrete;
    height: 0;
    opacity: 0;
    overflow: clip;
    background-color: #f0f2ff;
  }

  /* --------アコーディオンの中身のスタイル（開いている時）-------- */
  &[open]::details-content {
    opacity: 1;
  }

}

@supports (interpolate-size: allow-keywords) {
  :root {
    interpolate-size: allow-keywords; /* height:0（数値型） → auto（文字型） のアニメーションを可能にするための指定 */
  }
  details[open]::details-content {
    height: auto;
  }
}

/* height:0→autoへのアニメーションが対応していない場合は、固定値にアニメーションさせる */
@supports not (interpolate-size: allow-keywords) {
  details[open]::details-content {
    height: 150px;
    overflow-y: scroll;
  }
}


@media (max-width: 767px) {

    .top-topics__inner {
        padding: 20px 10px;
        margin: 0 20px;
    }

    .top-topics__tit {
        font-size: 16px;
    }

    .top-topics__wrap {
        flex-direction: column;
    }

    .top-topics__content {
        width: 100%;
        padding-top: initial;
    }

    .top-topics__text {
        font-size: 16px;
    }

    .top-topics__btn{
        margin-top: 20px;
    }

    .top-topics__link {
        width: 100%;
        font-size: 12px;
        font-weight: normal;
    }

}

.top-oneday a {
    /* background: #fd7e01; */
    border: 2px solid #fd7e01;
    border-radius: 32px;
    display: block;
    text-align: center;
    padding: 10px 0;
    font-size: 12px;
    color: #FFF;
}
