@charset "UTF-8";
/* --------------------------------------------------
 Block
-------------------------------------------------- */

/* Common Block --------------- */

.commBlc {
    max-width: 1200px;
    width: 96%;
    padding: 0 2%;
    margin: 0 auto;
    position: relative;
    box-sizing: content-box;
}

.commBlc.style01 {
    max-width: 1000px;
    width: 96%;
    padding: 0 2%;
    margin: 0 auto;
    position: relative;
    box-sizing: content-box;
}

.commBlc.style03 {
    max-width: 1400px;
    width: 96%;
    padding: 0 2%;
    margin: 0 auto;
    position: relative;
    box-sizing: content-box;
}

.commBlc02 {
    margin: 0 auto;
    position: relative;
    box-sizing: content-box;
}

@media screen and (max-width: 1000px) {
    .commBlc02 {
        width: 96%;
        padding: 0 2%;
    }
}

.boxComm {
    padding-top: 7%;
    padding-bottom: 7%;
}

.boxNormal {
    position: relative;
    padding: 0.1px;
}

.minBoxComm {
    padding-top: 4%;
    padding-bottom: 4%;
}

.tinyBoxComm {
    padding-top: 2%;
    padding-bottom: 2%;
}

.container {
    display: none;
    opacity: 0;
}

#blc01,
#blc02 {
    padding-bottom: 4rem;
}

.bgStyle01 {
    position: relative;
    margin-bottom: 80px;
}

.bgStyle01::before {
    position: absolute;
    display: block;
    content: '';
    max-width: 1400px;
    width: calc(100% - 10px);
    height: 100%;
    background-color: #F2F2F2;
    top: 60px;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: -1;
}

.img {
    text-align: center;
}

/* --------------------------------------------------
Keyvisual
-------------------------------------------------- */

#keyvisual {
    position: relative;
    background-image: url('../img/top/main_bg.png');
    background-position: right center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 20px;
    min-height: 500px;
}

#index #keyvisual {
    background-image: url('../img/top/main_bg.png');
    background-position: left center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 70px;
    min-height: 600px;
}

#index #keyvisual .cont {
    width: 91%;
    max-width: 685px;
    background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 55%);
    padding: 68px 7% 68px 2%;
}

#index #keyvisual .cont>.txt {
    font-size: 260%;
    font-weight: 800;
    color: #000;
    line-height: 1.2;
    margin-bottom: 7%;
    margin-left: 17px;
}

#index #keyvisual .cont>.logo {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

#index #keyvisual .cont>.logo>li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 145px;
    height: 55px;
    box-shadow: 0 0 5px rgb(150, 150, 150, .5);
    background-color: #fff;
    border-radius: 10px;
    margin: 15px 50px 33px 0;
}

#index #keyvisual .cont>.logo>li:nth-child(3n+3) {
    margin: 15px 0 33px 0;
}

#keyvisual>.inner {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    max-width: 1200px;
    width: 96%;
    margin: auto;
}

#index #keyvisual>.inner {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
}

#keyvisual>.inner>.content {
    position: relative;
    width: 100%;
    color: #fff;
}

#index #keyvisual>.inner>.content {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-wrap: wrap;
    flex-direction: column;
    width: 50%;
    min-height: 630px;
    bottom: -50px;
}

#keyvisual>.inner>.content>.ttl {
    position: relative;
    line-height: 100%;
    font-family: 'Arial', sans-serif;
    font-size: 440%;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 0 3px rgba(0, 0, 0, .69);
    margin: 0 2% 20px;
}

#index #keyvisual>.inner>.content>.ttl {
    font-size: 680%;
    margin: 0 auto 20px;
}

#keyvisual>.inner>.content>.ttl::before {
    content: '- ';
}

#keyvisual>.inner>.content>.ttl::after {
    content: ' -';
}

#keyvisual>.inner>.content>.ttl.style01::before {
    content: '';
}

#keyvisual>.inner>.content>.ttl.style01::after {
    content: '';
}

#keyvisual>.inner>.content>.txt01 {
    line-height: 140%;
    font-family: 'Arial', sans-serif;
    font-size: 255%;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 0 3px rgba(0, 0, 0, .56);
    margin: 0 auto;
}

#keyvisual>.inner>.content>.txt01>.indent {
    display: inline-block;
    text-indent: 120px;
}

#keyvisual>.inner>.content>.txt02 {
    font-size: 195%;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 0 3px rgba(0, 0, 0, .51);
    margin: 0 2%;
}

#index #keyvisual>.inner>.content>.txt02 {
    margin: 0 auto;
}

#keyvisual>.inner>.content>.txtBlc {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    min-height: 146px;
    font-size: 155%;
    font-weight: bold;
    background: rgb(78, 150, 172);
    background: url('../img/top/main_subbg_main.png') repeat-x left center;
    background-size: auto 100%;
    padding: 30px 30px 30px 20px;
    margin: 30px 122px 0 10px;
    box-sizing: border-box;
}

#keyvisual>.inner>.content>.txtBlc::before {
    position: absolute;
    top: 0;
    left: -10px;
    display: block;
    content: '';
    width: 10px;
    height: 100%;
    background: url('../img/top/main_subbg_first.png') no-repeat center center;
    background-size: 100% 100%;
}

#keyvisual>.inner>.content>.txtBlc::after {
    position: absolute;
    top: 0;
    right: -122px;
    display: block;
    content: '';
    width: 122px;
    height: 100%;
    background: url('../img/top/main_subbg_end.png') no-repeat center center;
    background-size: 100% 100%;
}

#keyvisual>.inner>.img {
    position: relative;
    display: block;
    text-align: right;
    width: 50%;
}

#keyvisual>.inner>.img>img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50px;
    max-width: none;
    height: auto;
    margin: auto;
}

#keyvisual>.img {
    position: absolute;
    right: 2%;
    bottom: -127px;
    display: block;
    width: 770px;
    height: 325px;
    text-align: right;
    padding: 0 2%;
}

#keyvisual>.img img {
    width: 100%;
    height: 100%;
    clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
    object-fit: cover;
}

@media screen and (min-width: 1700px) {
    #index #keyvisual {
        background-image: url('../img/top/main_bg.png');
    }
}

@media screen and (max-width: 1500px) {
    #keyvisual>.inner>.img>img {
        width: 500px;
    }

    #keyvisual>.img {
        max-width: 400px;
        height: 188px;
        bottom: -80px;
    }
}

@media screen and (max-width: 1210px) {
    #index #keyvisual>.inner>.content {
        width: 60%;
    }

    #keyvisual>.inner>.content>.txtBlc {
        padding: 20px 20px 20px 10px;
    }

    #keyvisual>.inner>.img {
        width: 40%;
    }

    #keyvisual>.inner>.img>img {
        left: 0;
        width: 450px;
    }

    #keyvisual>.img {
        max-width: 380px;
        height: 178px;
    }
}

@media screen and (max-width: 1100px) {
    #keyvisual {
        font-size: 90%;
    }
}

@media screen and (max-width: 1000px) {
    #keyvisual {
        font-size: 80%;
        margin-bottom: 20px;
        min-height: 300px;
    }

    #index #keyvisual {
        min-height: 400px;
    }

    #keyvisual>.img {
        max-width: 200px;
        height: 94px;
        bottom: 10px;
    }

    #index #keyvisual>.inner>.content {
        text-align: center;
        width: 100%;
        min-height: 0;
        bottom: 0;
        margin-top: 50px;
    }

    #keyvisual>.inner>.content>.txt01 {
        text-align: left;
    }

    #keyvisual>.inner>.content>.txtBlc {
        max-width: calc(100% - 400px);
        min-height: 0;
        text-align: left;
        padding: 15px 0 15px 10px;
        margin: 30px 50px 0 10px;
    }

    #keyvisual>.inner>.content>.txtBlc::after {
        right: -50px;
        width: 50px;
    }

    #keyvisual>.inner>.img {
        width: 100%;
    }

    #keyvisual>.inner>.img>img {
        position: relative;
        width: auto;
        height: 250px;
        margin-top: -150px;
    }
}

@media screen and (max-width: 767px) {
    #keyvisual {
        font-size: 75%;
    }

    #index #keyvisual {
        background-position: left top 55px;
    }

    #index #keyvisual .cont {
        width: 96%;
        background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 80%);
        padding: 68px 2% 68px 2%;
    }

    #index #keyvisual .cont>.txt {
        font-size: 220%;
        line-height: 2;
    }

    #keyvisual>.inner>.content>.ttl {
        font-size: 280%;
    }

    #index #keyvisual>.inner>.content>.ttl {
        font-size: 500%;
        padding-top: 40px;
    }

    #keyvisual>.inner>.content>.txt01 {
        font-size: 220%;
    }

    #keyvisual>.inner>.content>.txt02 {
        font-size: 140%;
    }

    #keyvisual>.inner>.content>.txtBlc {
        max-width: 100%;
        font-size: 100%;
    }

    #keyvisual>.inner>.img {
        text-align: center;
    }

    #keyvisual>.inner>.img>img {
        height: 200px;
        margin: 20px 0 10px;
    }
}

@media screen and (max-width: 560px) {
    #index #keyvisual .cont>.logo {
        justify-content: center;
    }

    #index #keyvisual .cont>.logo>li {
        margin: 15px 10px 33px 0;
    }

    #index #keyvisual .cont>.logo>li:nth-child(3n+3) {
        margin: 15px 0 33px 0;
    }
}

@media screen and (max-width: 480px) {
    #index #keyvisual {
        min-height: 350px;
    }

    #index #keyvisual .cont>.txt {
        font-size: 150%;
    }

    #index #keyvisual .cont>.logo>li {
        margin: 5px 10px 5px 0;
    }

    #index #keyvisual .cont>.logo>li:nth-child(3n+3) {
        margin: 5px 10px 5px 0;
    }

    #index #keyvisual .cont>.logo>li:nth-child(2n+2) {
        margin: 5px 0 5px 0;
    }

    #keyvisual>.inner>.content>.ttl {
        font-size: 200%;
    }

    #index #keyvisual>.inner>.content>.ttl {
        font-size: 460%;
    }

    #keyvisual>.inner>.content>.txt01 {
        text-align: center;
        font-size: 200%;
    }

    #keyvisual>.inner>.content>.txt01>.indent {
        text-indent: 0;
    }
}

#breadCrb {
    display: block;
    margin-bottom: 90px;
}

#breadCrb>.txt {
    font-size: 100%;
    font-weight: bold;
}

#breadCrb>.txt::before {
    position: relative;
    display: inline-block;
    content: '';
    width: 19px;
    height: 22px;
    top: 4px;
    background: url('../img/common/home_icn.png')no-repeat bottom center;
    margin-right: 8px;
}

#breadCrb a {
    color: #333 !important;
    text-decoration: none !important;
}

#breadCrb a:hover {
    text-decoration: underline !important;
}

@media screen and (max-width: 1200px) {
    #breadCrb {
        margin-bottom: 50px;
    }
}

@media screen and (max-width: 767px) {
    #breadCrb {
        font-size: 90%;
        margin-bottom: 30px;
    }
}

.blcStyle01 {
    display: flex;
    justify-items: center;
    align-items: center;
}

.blcStyle01>.bx {
    width: 50%;
}

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

    .blcStyle01>.bx {
        width: 100%;
    }
}

/* --------------------------------------------------
 Text Block
-------------------------------------------------- */

.txtBlc01 {
    margin-bottom: 20px;
}

.txtBlc01>.ttl {
    font-size: 200%;
    font-weight: bold;
    margin-bottom: 20px;
    word-break: break-all;
}

.txtBlc01>.ttl.size01 {
    font-size: 220%;
}

.txtBlc01.style01>.ttl {
    color: #4EAEB2;
}

.txtBlc01>.txt {
    font-size: 100%;
    word-break: break-all;
}

.txtBlc01>.txt.size01 {
    font-size: 110%;
}

@media screen and (max-width: 1000px) {
    .txtBlc01>.ttl {
        font-size: 180%;
    }

    .txtBlc01>.ttl.size01 {
        font-size: 190%;
    }

    .txtBlc01>.txt.size01 {
        font-size: 100%;
    }
}

@media screen and (max-width: 767px) {
    .txtBlc01>.ttl {
        text-align: center;
        font-size: 160%;
    }

    .txtBlc01>.ttl.size01 {
        font-size: 170%;
    }

    .txtBlc01>.txt,
    .txtBlc01>.txt.size01 {
        font-size: 90%;
    }
}

.txtBlc02 {
    display: flex;
    align-items: center;
    flex-direction: column;
    flex-wrap: wrap;
}

.txtBlc02.style01 {
    background-color: #F4F4F4;
    box-shadow: 0 0 20px #f4f4f4;
}

.txtBlc02>.content {
    width: 100%;
    margin-bottom: 10px;
}

.txtBlc02>.content>.img {
    text-align: center;
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
}

.txtBlc02.installBlc>.content>.img {
    height: 260px;
}

.txtBlc02.installBlc>.content>.img>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.txtBlc02>.content>.img.style01 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 10px;
}

.txtBlc02>.content>.ttl {
    width: 100%;
    font-size: 120%;
    padding-left: 4%;
    padding-right: 4%;
    margin-bottom: 10px;
    word-break: break-all;
    box-sizing: border-box;
}

.txtBlc02>.content>.ttl.style01 {
    text-align: center;
    font-weight: bold;
    margin-bottom: 20px;
}

.txtBlc02>.content>.txt {
    width: 100%;
    font-size: 100%;
    padding-left: 4%;
    padding-right: 4%;
    margin-bottom: 10px;
    word-break: break-all;
    box-sizing: border-box;
}

.txtBlc02>.content>.txt>.icn {
    display: flex;
    flex-wrap: wrap;
}

.txtBlc02>.content>.txt>.icn>li {
    max-width: 90px;
}

#index .txtBlc02>.content>.txt>.icn>li {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 105px;
}

.txtBlc02>.content>.date {
    display: block;
    position: relative;
    width: 100px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    background: #4EAEB2;
    padding: 5px;
    margin: -25px 4% 15px 4%;
}

.txtBlc02>.content>.date:after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid #277774;
    top: 3px;
    left: 3px;
}

.txtBlc02>.btn {
    width: 100%;
    font-size: 100%;
    box-sizing: border-box;
}

.txtBlc02.style01>.btn a {
    display: block;
}

.txtBlc02>.btn.style01 {
    padding-left: 4%;
    padding-right: 4%;
    margin-bottom: 20px;
}

.txtBlc03 {
    margin-bottom: 10px;
}

.txtBlc03>.ttl {
    text-align: center;
    font-size: 250%;
    font-weight: bold;
    margin-bottom: 10px;
    word-break: break-all;
}

.txtBlc03>.txt {
    text-align: center;
    font-size: 150%;
    margin-bottom: 10px;
    word-break: break-all;
}

@media screen and (max-width: 1000px) {
    .txtBlc03>.ttl {
        font-size: 220%;
    }

    .txtBlc03>.txt {
        font-size: 140%;
    }
}

@media screen and (max-width: 767px) {
    .txtBlc03>.ttl {
        font-size: 180%;
    }

    .txtBlc03>.txt {
        font-size: 120%;
    }
}

@media screen and (max-width: 480px) {
    .txtBlc03>.ttl {
        font-size: 150%;
    }

    .txtBlc03>.txt {
        font-size: 100%;
    }
}

.txtBlc04 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.txtBlc04>.ttl {
    width: 40%;
    font-size: 500%;
    font-weight: bold;
    word-break: break-all;
}

.txtBlc04>.txt {
    width: calc(60% - 30px);
    font-size: 125%;
    margin-left: 30px;
    word-break: break-all;
}

@media screen and (max-width: 1300px) {
    .txtBlc04>.ttl {
        width: 35%;
        font-size: 400%;
    }

    .txtBlc04>.txt {
        width: calc(55% - 30px);
        font-size: 115%;
    }
}

@media screen and (max-width: 1200px) {
    .txtBlc04>.ttl {
        width: 35%;
        font-size: 340%;
    }

    .txtBlc04>.txt {
        width: calc(55% - 30px);
        font-size: 110%;
    }
}

@media screen and (max-width: 1000px) {
    .txtBlc04>.ttl {
        text-align: center;
        width: 100%;
        font-size: 300%;
        margin-bottom: 10px;
    }

    .txtBlc04>.txt {
        text-align: center;
        width: 100%;
        font-size: 100%;
        margin-left: 0;
    }
}

.txtBlc05 {
    border: 5px solid #F2F2F2;
    background-color: #fff;
}

.txtBlc05>.img {
    position: relative;
    max-width: 100%;
}

.txtBlc05>.img .caption {
    position: absolute;
    display: flex;
    align-items: flex-start;
    width: 100%;
    background: rgba(78, 174, 178, .6);
    bottom: 0;
    left: 0;
}

.txtBlc05>.img .caption>.ttl01 {
    position: relative;
    display: inline-block;
    width: 92px;
    text-align: center;
    line-height: 42px;
    font-size: 120%;
    color: #fff;
    background: rgb(78, 174, 178);
    border: 1px solid #707070;
    padding: 0 10px;
    box-sizing: border-box;
}

.txtBlc05>.img .caption>.ttl02 {
    position: relative;
    display: inline-block;
    width: calc(100% - 92px);
    line-height: 42px;
    text-align: left;
    font-size: 120%;
    font-weight: bold;
    color: #fff;
    border: 1px solid #707070;
    border-left: none;
    padding: 0 10px;
    box-sizing: border-box;
}

.txtBlc05>.txt {
    margin-top: 10px;
    padding: 10px;
    word-break: break-all;
}

@media screen and (max-width: 1000px) {
    .txtBlc05>.img .caption>.ttl01 {
        font-size: 100%;
    }

    .txtBlc05>.img .caption>.ttl02 {
        font-size: 90%;
    }
}

.txtBlc06 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 30px;
    box-sizing: border-box;
}

.txtBlc06.style01 {
    align-items: flex-start;
}

.txtBlc06>.txt {
    width: calc(100% - 300px);
    padding-right: 2%;
    box-sizing: border-box;
    word-break: break-all;
}

.txtBlc06.left>.txt {
    padding-left: 2%;
    padding-right: 0;
}

.txtBlc06>.img {
    width: 300px;
}

@media screen and (max-width: 1000px) {
    .txtBlc06>.txt {
        width: 100%;
        padding: 0;
        margin-bottom: 20px;
    }

    .txtBlc06>.img {
        text-align: center;
        width: 100%;
    }
}

.txtBlc07.max580 {
    max-width: 580px;
    width: 98%;
}

.txtBlc07>.ttl {
    position: relative;
    font-size: 163%;
    font-weight: bold;
    padding: 0 2% 0 30px;
    margin-bottom: 20px;
    word-break: break-all;
}

.txtBlc07>.txt {
    font-size: 100%;
}

.txtBlc07>.img {
    text-align: center;
    margin-bottom: 20px;
}

.txtBlc07.small>.ttl {
    font-size: 120%;
}

.txtBlc07>.ttl::before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    content: '';
    width: 5px;
    height: 100%;
    background-color: #3E90B4;
}

.txtBlc07.style01>.ttl {
    position: relative;
    font-size: 120%;
    color: #0E498F;
    font-weight: bold;
    padding: 0 10px;
    margin-bottom: 20px;
}

.txtBlc07.style01>.ttl::before {
    display: none;
}

.txtBlc07.style01.blueCol>.ttl {
    color: #3E90B4;
}

.txtBlc07>.txt {
    word-break: break-all;
}

@media screen and (max-width: 1000px) {
    .txtBlc07>.ttl {
        font-size: 140%;
    }

    .txtBlc07.small>.ttl {
        font-size: 110%;
    }

    .txtBlc07>.txt {
        font-size: 90%;
    }

    .txtBlc07.max550 {
        max-width: none;
    }

    .txtBlc07.max580 {
        max-width: none;
    }
}

@media screen and (max-width: 767px) {
    .txtBlc07>.ttl {
        font-size: 120%;
    }

    .txtBlc07.small>.ttl {
        font-size: 100%;
    }

    .txtBlc07>.txt {
        font-size: 90%;
    }
}

.txtBlc08.col2 {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 20px;
    box-sizing: border-box;
}

.txtBlc08.maxWidth {
    width: 100%;
}

.txtBlc08.marginNone {
    margin-bottom: 0 !important;
}

.txtBlc08.middle {
    align-items: center;
}

.txtBlc08.deMiddle>div {
    display: flex;
    align-items: center;
}

.txtBlc08.col2>div,
.txtBlc08.col2>li {
    position: relative;
    width: 48%;
    margin-right: 4%;
}

.txtBlc08.col2.style01>div {
    width: 50%;
    margin-right: 0;
}

.txtBlc08.col2>div:nth-child(2n+2),
.txtBlc08.col2>li:nth-child(2n+2) {
    margin-right: 0;
}

.txtBlc08.col2.style02>div:nth-child(2n+1) {
    width: 35%;
    margin-right: 20px;
}

.txtBlc08.col2.style02>div:nth-child(2n+2) {
    width: calc(65% - 20px);
}

.txtBlc08.mb01 {
    margin-bottom: 30px;
}

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

    .txtBlc08.col2>div,
    .txtBlc08.col2>li,
    .txtBlc08.col2.style01>div,
    .txtBlc08.col2.style02>div:nth-child(2n+1),
    .txtBlc08.col2.style02>div:nth-child(2n+2) {
        width: 100%;
        margin-right: 0;
        margin-bottom: 40px;
    }

    .txtBlc08.marginSplittle>div {
        margin-bottom: 10px !important;
    }

    .txtBlc08.marginSpNone>div {
        margin-bottom: 0 !important;
    }
}

.txtBlc09 {
    text-align: center;
    background-color: #41ABC4;
    padding: 8px;
    box-sizing: border-box;
}

.txtBlc09.style01 {
    padding: 0;
}

.txtBlc09.blueColor {
    background-color: #0e4992;
}

.txtBlc09>.ttl {
    display: block;
    width: 100%;
    font-size: 110%;
    font-weight: bold;
    color: #fff;
    padding: 10px 20px;
    box-sizing: border-box;
    word-break: break-all;
}

.txtBlc09>.ttl.shadow {
    text-shadow: 1px 1px 3px #333;
    font-weight: 500;
}

.txtBlc09>.ttl.style01 {
    font-size: 170%;
}

.txtBlc09>.ttl.style02 {
    font-size: 270%;
    font-weight: 500;
}

.txtBlc09>.content {
    display: block;
    width: 100%;
    background-color: #fff;
    padding: 20px;
    margin: 0 auto;
    box-sizing: border-box;
}

.txtBlc09>.content.mid {
    display: flex;
    align-items: center;
}

.txtBlc09>.content.center {
    display: flex;
    justify-content: center;
}

.txtBlc09>.content.left {
    display: flex;
    justify-content: flex-start;
}

.txtBlc09>.content.style01 {
    background-color: #fdfdfd;
    border: 1px solid #eeeeee;
}

.txtBlc09>.content.style02 {
    font-size: 130%;
    font-weight: 500;
    text-align: left;
    padding: 20px 30px 40px;
}

@media screen and (max-width: 1000px) {
    .txtBlc09>.ttl.style01 {
        font-size: 150%;
    }

    .txtBlc09>.ttl.style02 {
        font-size: 200%;
    }

    .txtBlc09>.content.style02 {
        font-size: 120%;
    }
}

@media screen and (max-width: 767px) {
    .txtBlc09>.ttl.style01 {
        font-size: 130%;
    }

    .txtBlc09>.ttl.style02 {
        font-size: 180%;
    }

    .txtBlc09>.content.style02 {
        font-size: 110%;
    }
}

.txtBlc10>.ttl {
    display: inline-block;
    color: #fff;
    background-color: #3E90B4;
    padding: 10px 15px;
    word-break: break-all;
}

.txtBlc10>.txt {
    display: block;
    font-size: 90%;
    padding: 15px 20px;
    word-break: break-all;
}

.txtBlc11 {
    display: block;
    font-size: 90%;
    border: 2px solid #707070;
    padding: 15px 20px;
}

.txtBlc11>.ttl {
    position: relative;
    top: -35px;
    text-align: center;
    display: table;
    font-size: 150%;
    color: #3E90B4;
    font-weight: bold;
    background-color: #fff;
    padding: 0 10px;
    margin: 0 auto;
    word-break: break-all;
}

.txtBlc12>.ttl {
    text-align: center;
    display: table;
    line-height: 40px;
    width: 40px;
    height: 40px;
    vertical-align: middle;
    color: #fff;
    background-color: #3E90B4;
    border-radius: 100%;
    margin: 0 auto 20px;
    word-break: break-all;
}

@media screen and (max-width: 1000px) {
    .txtBlc11.ttl {
        font-size: 130%;
    }
}

@media screen and (max-width: 767px) {
    .txtBlc11.ttl {
        font-size: 110%;
    }
}

.txtBlc13 {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    background-color: #D9E4EB;
    padding: 15px;
}

.txtBlc13>.ttl {
    position: relative;
    top: -30px;
    text-align: center;
    font-size: 125%;
    color: #3E90B4;
    font-weight: bold;
    word-break: break-all;
}

.txtBlc13>.box50,
.txtBlc13>.box100 {
    width: calc(100% - 20px);
    background-color: #fff;
    border-radius: 30px;
    padding: 20px;
    margin: 0 10px 20px;
    box-sizing: border-box;
}

.txtBlc13>.box50 {
    width: calc(50% - 20px);
}

@media screen and (max-width: 767px) {
    .txtBlc13>.box50 {
        width: calc(100% - 20px);
    }
}

.txtBlc14 {
    position: relative;
    padding: 10px 30px 20px;
    margin-bottom: 50px !important;
    box-sizing: border-box;
}

.txtBlc14>.ttl {
    text-align: center;
    display: table;
    line-height: 40px;
    font-size: 130%;
    font-weight: bold;
    color: #4EAEB2;
    border-radius: 100%;
    margin: -30px auto 20px;
    word-break: break-all;
}

.txtBlc15 {
    position: relative;
    display: table;
    font-size: 110%;
    font-weight: bold;
    background-color: #fff;
    border: 5px solid #41ABC4;
    mix-blend-mode: hard-light;
    padding: 20px 30px;
    margin: -60px auto 50px;
    z-index: 10;
}

/* --------------------------------------------------
 img Style
-------------------------------------------------- */

.imgStyle01 {
    float: left;
    text-align: center;
    margin: 0 15px 15px 0;
}

.imgStyle02 {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    text-align: center;
    margin-bottom: 15px;
}

.imgStyle02.marginNone {
    margin-bottom: 0;
}

.imgStyle02>.txt {
    text-align: left;
    font-size: 120%;
    color: #313030;
}

@media screen and (max-width: 767px) {
    .imgStyle02>.txt {
        font-size: 100%;
    }
}

@media screen and (max-width: 480px) {
    .imgStyle02>.txt {
        text-align: center;
        width: 100%;
        margin-top: 10px;
    }
}

.imgStyle03 {
    position: relative;
    width: 100%;
    box-sizing: border-box;
}

.imgStyle03>.img {
    text-align: center;
    max-width: 52%;
    padding-bottom: 120px;
}

.imgStyle03>.img:nth-child(2) {
    position: absolute;
    right: 0;
    top: 120px;
    max-width: 52%;
}

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

    .imgStyle03>.img,
    .imgStyle03>.img:nth-child(2) {
        position: relative;
        max-width: 100%;
        width: 100%;
        right: auto;
        top: auto;
        padding-bottom: 0;
        margin-bottom: 20px;
    }
}

/* --------------------------------------------------
 text Style
-------------------------------------------------- */

.txtNormal {
    font-weight: 500;
    padding: 5px 20px;
}

.txtStyle01 {
    font-size: 100%;
}

@media screen and (max-width: 767px) {
    .txtStyle01 {
        font-size: 90%;
    }
}

.txtStyle02 {
    font-size: 90%;
}

@media screen and (max-width: 767px) {
    .txtStyle02 {
        font-size: 80%;
    }
}

.txtStyle03 {
    font-size: 110%;
}

@media screen and (max-width: 767px) {
    .txtStyle03 {
        font-size: 100%;
    }
}

.txtStyle04 {
    font-size: 190%;
}

@media screen and (max-width: 1000px) {
    .txtStyle04 {
        font-size: 160%;
    }
}

@media screen and (max-width: 767px) {
    .txtStyle04 {
        font-size: 140%;
    }
}

@media screen and (max-width: 480px) {
    .txtStyle04 {
        font-size: 120%;
    }
}

.txtStyle05 {
    font-size: 125%;
}

@media screen and (max-width: 767px) {
    .txtStyle05 {
        font-size: 100%;
    }
}

.txtStyle06 {
    display: inline-block;
    text-align: center;
    background-color: #e6ecf4;
    color: #0e4992;
    font-weight: 800;
    padding: 5px 20px;
}

.txtStyle07 {
    position: relative;
    display: inline-block;
    text-align: center;
    font-size: 110%;
    font-weight: 500;
    padding: 5px;
}

.txtStyle07.border::after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 1px;
    content: '';
    background-color: #0e4992;
    margin: 0 auto;
}

.txtStyle08 {
    font-size: 250%;
    font-weight: bold;
    color: #fe2a4e;
    text-shadow: 0 0 1px #fff, 1px 0 1px #fff, 0 1px 1px #fff, 1px 1px 1px #fff, -1px 0 1px #fff, 0 -1px 1px #fff, -1px -1px 1px #fff, 0 0 1px #fff, 1px 0 1px #fff, 0 1px 1px #fff, 1px 1px 1px #fff, -1px 0 1px #fff, 0 -1px 1px #fff, -1px -1px 1px #fff, 0 0 2px #fff, 2px 0 2px #fff, 0 2px 2px #fff, 2px 2px 1px #fff, -2px 0 2px #fff, 0 -2px 2px #fff, -2px -2px 2px #fff, 0 0 2px #fff, 2px 0 2px #fff, 0 2px 2px #fff, 2px 2px 1px #fff, -2px 0 2px #fff, 0 -2px 2px #fff, -2px -2px 2px #fff, 0 0 2px #fff, 2px 0 2px #fff, 0 2px 2px #fff, 2px 1px 2px #fff, 1px 2px 2px #fff, 1px 1px 2px #fff, -2px 0 2px #fff, 0 -2px 2px #fff, -2px -1px 2px #fff, -1px -2px 2px #fff, -1px -1px 2px #fff, 0 0 2px #fff, 2px 0 2px #fff, 0 2px 2px #fff, 2px 1px 2px #fff, 1px 2px 2px #fff, 1px 1px 2px #fff, -2px 0 2px #fff, 0 -2px 2px #fff, -2px -1px 2px #fff, -1px -2px 2px #fff, -1px -1px 2px #fff;
}

/* --------------------------------------------------
 list Style
-------------------------------------------------- */

.listStyle01 {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.listStyle01.mid {
    align-items: center;
}

.listStyle01>li {
    margin-bottom: 20px;
}

.listStyle01.bott01>li {
    margin-bottom: 40px;
}

.listStyle01.col2>li {
    width: calc(50% - 15px);
    box-sizing: border-box;
    margin-right: 5px;
    margin-left: 5px;
}

.listStyle01.col3>li {
    width: calc(33.33% - 20px);
    box-sizing: border-box;
    margin-right: 6.66px;
    margin-left: 6.66px;
}

#telephone-construction .listStyle01.col3.boxlist>li,
#telephone-construction .listStyle01.col3.boxlist>li.merCol {
    width: calc(100%);
}

.listStyle01.col3>li.merCol {
    width: calc((66.66% + 13.32px) - 40px);
    box-sizing: border-box;
    margin-right: 6.66px;
    margin-left: 6.66px;
}

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

    .listStyle01.col3>li,
    .listStyle01.col3>li.merCol {
        width: calc(50% - 15px);
        margin-right: 5px;
        margin-left: 5px;
    }
}

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

    .listStyle01.col3>li,
    .listStyle01.col3>li.merCol {
        max-width: 450px;
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }
}

@media screen and (max-width: 480px) {
    .listStyle01.col2>li {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }
}

.listStyle02 {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.listStyle02>dt {
    width: 200px;
    font-weight: bold;
    border-bottom: 1px solid #AFAFAF;
    padding: 10px 20px;
    box-sizing: border-box;
}

.listStyle02>dd {
    width: calc(100% - 200px);
    border-bottom: 1px solid #AFAFAF;
    padding: 10px 20px;
    box-sizing: border-box;
}

.listStyle02>dd:nth-last-of-type(1),
.listStyle02>dt:nth-last-of-type(1) {
    border-bottom: none;
}

@media screen and (max-width: 767px) {
    .listStyle02>dt {
        width: 100%;
        border-bottom: none;
    }

    .listStyle02>dd {
        width: 100%;
    }
}

.listStyle03 {
    width: 100%;
    margin: 0 auto;
}

.listStyle03.max800 {
    max-width: 800px;
}

.listStyle03>dt {
    width: 100%;
    font-weight: bold;
    border-bottom: none;
    margin-bottom: 10px;
}

.listStyle03.ttlBig>dt {
    font-size: 125%;
}

.listStyle03>dd {
    width: 100%;
    margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
    .listStyle03.ttlBig>dt {
        font-size: 110%;
    }
}

.listStyle04 {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    border: 3px solid #41ABC4;
    box-sizing: border-box;
}

.listStyle04.nonBorder {
    border: none;
}

.listStyle04.bgBlue {
    border-radius: 20px;
    background-color: #EFFCFC;
}

.listStyle04>li {
    position: relative;
    width: 33.33%;
    padding: 30px 10px;
    box-sizing: border-box;
    margin-bottom: 20px;
}

@media screen and (min-width: 767px) {
    .listStyle04.noneBottom>li {
        margin-bottom: 0;
    }
}

.listStyle04>li:nth-child(3n+1)::after,
.listStyle04>li:nth-child(3n+2)::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    content: '';
    display: block;
    width: 1px;
    height: calc(100% - 50px);
    background-color: #41ABC4;
    margin: auto 0;
}

.listStyle04.plus>li:nth-child(3n+1)::after,
.listStyle04.plus>li:nth-child(3n+2)::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: -10px;
    content: '+';
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    color: #fff;
    font-weight: bold;
    border-radius: 10px;
    background-color: #41ABC4;
    margin: auto 0;
}

.listStyle04.borderDot>li:nth-child(3n+1)::after,
.listStyle04.borderDot>li:nth-child(3n+2)::after {
    border-right: 1px dotted #71C3BF;
    background-color: transparent;
}

.listStyle04.borderRightGray>li:nth-child(3n+1)::after,
.listStyle04.borderRightGray>li:nth-child(3n+2)::after {
    background-color: #D1D1D1;
}

@media screen and (max-width: 767px) {
    .listStyle04 {
        padding: 20px 10px;
    }

    .listStyle04>li {
        width: 100%;
        padding: 0;
    }

    .listStyle04>li .business {
        text-align: center;
    }

    .listStyle04>li:nth-child(3n+1)::after,
    .listStyle04>li:nth-child(3n+2)::after {
        display: none;
    }

    .listStyle04.plus>li:nth-child(3n+1),
    .listStyle04.plus>li:nth-child(3n+2) {
        padding-bottom: 30px;
        margin-bottom: 20px;
    }

    .listStyle04.plus>li:nth-child(3n+1)::after,
    .listStyle04.plus>li:nth-child(3n+2)::after {
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
    }
}

.listStyle05 {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    box-sizing: border-box;
    margin: 0 auto;
}

.listStyle05.max1000 {
    max-width: 1000px;
}

.listStyle05.max1200 {
    max-width: 1200px;
}

.listStyle05.max1400 {
    max-width: 1400px;
}

.listStyle05.max1600 {
    max-width: 1600px;
}

.listStyle05.col3.spaceTB>li {
    padding-top: 40px;
    padding-bottom: 40px;
}

.listStyle05.bold>li {
    font-weight: bold;
}

.listStyle05.deMiddle>li {
    display: flex;
    align-items: center;
}

.listStyle05.deCenter>li {
    display: flex;
    justify-content: center;
}

.listStyle05>li {
    position: relative;
    text-align: center;
    width: 100%;
    color: #fff;
    padding: 10px 20px;
    box-sizing: border-box;
}

.listStyle05.col3>li {
    width: 33.33%;
}

.listStyle05.col4>li {
    width: 25%;
}

.listStyle05.col5>li {
    width: 20%;
}

.listStyle05>li::after {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    content: '';
    width: 1px;
    height: 100%;
    background-color: #fff;
}

.listStyle05.col3>li:nth-child(3n+3):after {
    display: none;
}

.listStyle05.col4>li:nth-child(4n+4):after {
    display: none;
}

.listStyle05.col5>li:nth-child(5n+5):after {
    display: none;
}

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

    .listStyle05>li,
    .listStyle05.col3>li,
    .listStyle05.col4>li,
    .listStyle05.col5>li {
        width: 100%;
    }

    .listStyle05>li::after {
        display: block;
        position: absolute;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        content: '';
        width: 100%;
        height: 1px;
        background-color: #fff;
    }
}

.listStyle06 {
    width: 100%;
    margin-bottom: 20px;
}

.listStyle06>li {
    position: relative;
    border-bottom: 1px solid #eeeeee;
    padding: 20px 0;
}

.listStyle06.center>li {
    display: flex;
    justify-content: center;
}

.listStyle06>li.plus::after {
    position: absolute;
    bottom: -10px;
    left: 35px;
    content: '+';
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    color: #fff;
    background-color: #0e4992;
    border-radius: 100%;
}

.listStyle07 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    flex: 0 0 100%;
}

.listStyle07.left {
    justify-content: flex-start;
}

.listStyle07.bottom {
    align-items: flex-end;
}

.listStyle07.style01 {
    max-width: 380px;
}

.listStyle07>li {
    text-align: left;
    width: 33.33%;
    font-size: 110%;
    font-weight: 500;
    padding-right: 20px;
    box-sizing: border-box;
}

.listStyle07>li:nth-last-child(1) {
    padding-right: 0;
}

.listStyle07.style01>li {
    width: 40%;
}

.listStyle07.style01>li.ttl {
    width: 20%;
}

.listStyle07>li.ttl {
    font-weight: bold;
    color: #0e4992
}

.listStyle07.nonWidth>li {
    width: auto;
}

@media screen and (max-width: 1000px) {
    .listStyle07>li {
        font-size: 100%;
    }
}

@media screen and (max-width: 767px) {
    .listStyle07.style01 {
        max-width: none;
    }
}

@media screen and (max-width: 560px) {
    .listStyle07.sp {
        flex-wrap: wrap;
    }

    .listStyle07.sp>li {
        width: 100%;
    }
}

/* --------------------------------------------------
 Title Style
-------------------------------------------------- */

.ttlStyle01 {
    text-align: center;
    font-size: 250%;
    color: #4EAEB2;
    font-weight: bold;
    margin-bottom: 30px;
}

.ttlStyle01.style01 {
    font-size: 190%;
}

.ttlStyle01.style02 {
    font-size: 170%;
}

.ttlStyle01.style03 {
    font-size: 170%;
}

.ttlStyle01.style04 {
    font-size: 300%;
}

.ttlStyle01.nonBt {
    margin-bottom: 0;
}

.ttlStyle01.nonColor {
    color: initial;
}

.ttlStyle01.grayColor {
    color: #464646;
}

.ttlStyle01.left,
.ttlStyle01.style01.left {
    text-align: left;
}

.ttlStyle01.lowBold {
    font-weight: 500;
}

@media screen and (max-width: 1000px) {
    .ttlStyle01 {
        font-size: 200%;
    }

    .ttlStyle01.style01 {
        font-size: 180%;
    }

    .ttlStyle01.style02 {
        font-size: 150%;
    }

    .ttlStyle01.style03 {
        font-size: 160%;
    }

    .ttlStyle01.style04 {
        font-size: 250%;
    }
}

@media screen and (max-width: 646px) {
    .ttlStyle01 {
        font-size: 180%;
    }

    .ttlStyle01.style01 {
        font-size: 150%;
    }

    .ttlStyle01.style02 {
        font-size: 130%;
    }

    .ttlStyle01.style03 {
        font-size: 140%;
    }

    .ttlStyle01.style04 {
        font-size: 200%;
    }
}

@media screen and (max-width: 480px) {
    .ttlStyle01 {
        font-size: 160%;
    }

    .ttlStyle01.style01 {
        font-size: 120%;
    }

    .ttlStyle01.style04 {
        font-size: 160%;
    }
}

.ttlStyle02 {
    position: relative;
    font-size: 200%;
    color: #fff;
    font-weight: bold;
    z-index: 2;
    margin-bottom: 30px;
}

.ttlStyle02.style01 {
    color: #3E90B4;
}

.ttlStyle02.style02 {
    color: #4EAEB2;
}

.ttlStyle02.style03 {
    color: #BF4242;
}

.ttlStyle02.center {
    display: table;
    margin: 0 auto 30px;
}

.ttlStyle02 .sub {
    position: absolute;
    top: -50px;
    left: 50px;
    line-height: 1.2;
    font-family: "Times New Roman";
    font-size: 160%;
    color: #fff;
    font-weight: 100;
    opacity: .5;
    z-index: -1;
    white-space: nowrap;
    opacity: .2;
}

.ttlStyle02.style01 .sub {
    color: #3E90B4;
}

@media screen and (max-width: 1000px) {
    .ttlStyle02 {
        font-size: 160%;
    }

    .ttlStyle02 .sub {
        position: relative;
        top: 0;
        left: 10px;
        display: block;
        white-space: normal;
        font-size: 110%;
    }
}

@media screen and (max-width: 767px) {
    .ttlStyle02 {
        font-size: 120%;
    }
}

.ttlStyle03 {
    position: relative;
    font-size: 163%;
    font-weight: bold;
    padding: 0 2% 0 30px;
    margin-bottom: 20px;
}

.ttlStyle03::before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    content: '';
    width: 5px;
    height: 100%;
    background-color: #3E90B4;
}

@media screen and (max-width: 1000px) {
    .ttlStyle03 {
        font-size: 140%;
    }
}

@media screen and (max-width: 767px) {
    .ttlStyle03 {
        font-size: 120%;
    }
}

.ttlStyle04 {
    position: relative;
    margin-bottom: 40px;
}

.ttlStyle04::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #cccccc;
    margin: auto 0;
}

.ttlStyle04>.txt {
    position: relative;
    font-size: 112%;
    color: #3E90B4;
    background-color: #fff;
    padding: 0 2%;
    z-index: 5;
}

.ttlStyle04>.txt>img {
    margin-right: 15px;
}

.ttlStyle05 {
    font-weight: bold;
    font-size: 100%;
    margin-bottom: 15px;
}

.ttlStyle05.style01 {
    font-size: 125%;
}

@media screen and (max-width: 767px) {
    .ttlStyle05.style01 {
        font-size: 90%;
    }

    .ttlStyle05.style01 {
        font-size: 110%;
    }
}

.ttlStyle06 {
    position: relative;
    display: table;
    font-size: 163%;
    font-weight: bold;
    margin-bottom: 15px;
    background: linear-gradient(transparent 50%, #97E0E3 0%);
    margin: 0 auto 40px;
}

@media screen and (max-width: 1000px) {
    .ttlStyle06 {
        font-size: 140%;
    }
}

@media screen and (max-width: 767px) {
    .ttlStyle06 {
        font-size: 120%;
    }
}

.ttlStyle07 {
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    max-width: 96%;
    text-align: center;
    font-weight: bold;
    margin: 0 auto;
}

.ttlStyle07>.txt {
    position: relative;
    display: inline-block;
    background-color: #DB3C9E;
    font-size: 120%;
    color: #fff;
    font-weight: bold;
    padding: 5px 30px;
}

.ttlStyle07>.txt::after {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -10px;
    content: '';
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #DB3C9E;
    margin: 0 auto;
}

@media screen and (max-width: 1000px) {
    .ttlStyle07 {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        text-align: center;
        font-weight: bold;
        margin: 10px auto;
    }

    .ttlStyle07>.txt {
        font-size: 100%;
    }
}

.ttlStyle08 {
    position: relative;
    top: 20px;
    display: table;
    font-size: 160%;
    font-weight: bold;
    color: #41ABC4;
    background-color: #fff;
    padding: 0 40px;
    margin: -20px auto 0;
}

.ttlStyle08.small {
    font-size: 120%;
    padding: 0 20px;
}

@media screen and (max-width: 1000px) {
    .ttlStyle08 {
        font-size: 140%;
        padding: 0 20px;
    }

    .ttlStyle08.small {
        font-size: 100%;
    }
}

@media screen and (max-width: 767px) {
    .ttlStyle08 {
        font-size: 120%;
    }
}

.ttlStyle09 {
    position: relative;
    background: linear-gradient(transparent 50%, #97E0E3 0%);
    display: inline;
    font-size: 150%;
    font-weight: bold;
    padding: 0 2px 2px;
}

@media screen and (max-width: 767px) {
    .ttlStyle09 {
        font-size: 120%;
    }
}

/* --------------------------------------------------
 Button Style
-------------------------------------------------- */

.btnStyle01 {
    display: block;
    width: 94%;
    max-width: 260px;
    background: rgb(235, 241, 246);
    background: linear-gradient(170deg, rgb(105, 211, 231) 0%, rgb(116, 208, 213) 50%, rgb(97, 199, 204) 51%, rgb(58, 196, 203) 100%);
    border-radius: 30px;
    padding: 3px;
    box-shadow: 0 0 5px #6395a5;
    transition: .3s all;
}

.btnStyle01:hover {
    opacity: .8;
}

.btnStyle01.center {
    margin: 0 auto;
}

.btnStyle01>a {
    position: relative;
    display: block;
    text-decoration: none;
    text-align: left;
    font-weight: bold;
    width: calc(100% - 2px);
    color: #fff;
    border: 1px solid #fff;
    border-radius: 28px;
    padding: 10px 40px 10px 20px;
    margin: 0 auto;
    box-sizing: border-box;
    cursor: pointer;
}

.btnStyle01>a:before {
    content: "▲";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    display: inline-block;
    text-align: center;
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-size: 6px;
    color: #4EAEB2;
    border-radius: 12px;
    background: #fff;
    margin: auto 0;
    transform: rotate(90deg) scale(0.8, 0.8);
    box-shadow: 0 0 10px #6395a5;
}

.btnStyle02 {
    text-align: center;
    color: #fff;
    background-color: #4EAEB2;
    transition: .3s all;
}

.btnStyle02:hover {
    opacity: .8;
}

.btnStyle02>a {
    display: block;
    text-decoration: none;
    color: #fff;
    padding: 10px 20px;
}

.btnStyle02.style01>a::after {
    content: ">";
    padding-left: 10px;
    transform: scale(1.5, 1);
    font-style: normal;
    font-size: 100%;
}

.btnStyle03 {
    min-width: 450px;
    display: inline-block;
    background: rgb(235, 241, 246);
    background: linear-gradient(170deg, rgb(105, 211, 231) 0%, rgb(116, 208, 213) 50%, rgb(97, 199, 204) 51%, rgb(58, 196, 203) 100%);
    border: 3px solid #fff;
    box-shadow: 0 0 5px #6395a5;
    transition: .3s all;
    margin: 0 auto;
    box-sizing: border-box;
    cursor: pointer;
}

.btnStyle03:hover {
    opacity: .8;
}

.btnStyle03>a {
    text-decoration: none;
    display: block;
    text-align: center;
    width: 100%;
    font-size: 125%;
    font-weight: bold;
    color: #fff;
    letter-spacing: .1rem;
    padding: 15px 10px;
    margin: 0 auto;
    box-sizing: border-box;
}

@media screen and (max-width: 767px) {
    .btnStyle03 {
        min-width: 0;
        width: 96%;
    }

    .btnStyle03>a {
        font-size: 105%;
    }
}

.btnStyle04 {
    display: block;
    max-width: 350px;
    width: 100%;
    background: linear-gradient(170deg, rgb(230, 208, 117) 0%, rgb(240, 175, 88) 50%, rgb(226, 174, 3) 51%, rgb(229, 212, 82) 100%);
    padding: 3px;
    box-shadow: 0 0 5px rgb(226 174 3);
    transition: .3s all;
    cursor: pointer;
}

.btnStyle04:hover {
    opacity: .8;
}

.btnStyle04.style01 {
    background: linear-gradient(170deg, rgb(105, 192, 230) 0%, rgb(81, 166, 211) 50%, rgb(35, 146, 195) 51%, rgb(106, 177, 237) 100%);
    box-shadow: 0 0 5px rgb(106 177 237);
}

.btnStyle04.style02 {
    background: linear-gradient(170deg, #75ccb4 0%, #43D0AA 50%, #43B294 51%, #74b1a0 100%);
    box-shadow: 0 0 5px rgb(106 177 237);
}

.btnStyle04>a {
    position: relative;
    display: block;
    text-decoration: none;
    text-align: left;
    width: calc(100% - 2px);
    font-weight: bold;
    color: #fff;
    border: 1px solid #fff;
    margin: 0 auto;
    padding: 15px 40px 15px 15px;
    box-sizing: border-box;
    cursor: pointer;
}

.btnStyle04>a:before {
    content: "▲";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    display: inline-block;
    text-align: center;
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-size: 6px;
    color: #fff;
    border-radius: 12px;
    background: #D89921;
    margin: auto 0;
    transform: rotate(90deg) scale(0.8, 0.8);
    box-shadow: 0 0 5px #d89921;
}

.btnStyle04.style01>a:before {
    background: #2788C4;
    box-shadow: 0 0 5px rgb(81, 166, 211);
}

.btnStyle04.style02>a:before {
    background: #389078;
    box-shadow: 0 0 5px #43D0AA;
}

.btnStyle05 {
    position: relative;
    text-decoration: none;
    display: table;
    font-size: 125%;
    color: #fff;
    background: linear-gradient(170deg, #E86A6A 0%, #FF4A4A 100%);
    border-radius: 50px;
    padding: 10px 70px;
    margin: 0 auto;
    box-sizing: border-box;
    cursor: pointer;
}

.btnStyle05.style01 {
    background: linear-gradient(170deg, #3AB5A7 0%, #1A81AF 100%);
}

.btnStyle05::before {
    content: "▲";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    display: inline-block;
    text-align: center;
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-size: 10px;
    color: #D93939;
    font-weight: bold;
    border-radius: 12px;
    background: #fff;
    margin: auto 0;
    transform: rotate(90deg) scale(0.8, 0.8);
}

.btnStyle05.style01::before {
    color: #1A81AF;
}

.btnStyle05:hover {
    color: #fff;
    opacity: .9;
}

@media screen and (max-width: 767px) {
    .btnStyle05 {
        font-size: 100%;
        padding: 10px 40px;
        margin: 0 auto 90px;
    }
}

.btnStyle06 {
    position: relative;
    text-decoration: none;
    display: table;
    font-size: 110%;
    color: #fff;
    background: linear-gradient(180deg, #ED99A6 0%, #F84369 48%, #FF002F 52%, #BC1D48 100%);
    border-radius: 50px;
    padding: 20px 100px;
    margin: 0 auto;
    border: 1px solid #FFEBEB;
    box-shadow: 0 0 3px #CE2C5D;
    box-sizing: border-box;
}

.btnStyle06:hover {
    position: relative;
    text-decoration: none;
    display: table;
    font-size: 110%;
    color: #fff;
    background: linear-gradient(180deg, #ED99A6 0%, #F84369 48%, #FF002F 52%, #BC1D48 100%);
    border-radius: 50px;
    padding: 20px 100px;
    margin: 0 auto;
    border: 1px solid #FFEBEB;
    box-shadow: 0 0 3px #CE2C5D;
    box-sizing: border-box;
}

/* --------------------------------------------------
 Table
-------------------------------------------------- */

.tblStyle01 {
    max-width: 900px;
    width: 100%;
    border-collapse: collapse;
    background-color: #f8f8f8;
    margin: 20px auto 40px;
    box-shadow: 0 0 9px rgba(0, 0, 0, .13);
    box-sizing: border-box;
}

.tblStyle01 th,
.tblStyle01 td {
    vertical-align: middle;
    border: 1px solid #fff;
    padding: 15px 20px;
    box-sizing: border-box;
}

.tblStyle01 tr th {
    text-align: center;
    font-size: 120%;
    font-weight: bold;
    color: #fff;
    width: 240px;
    background: linear-gradient(160deg, rgb(77, 206, 196) 0%, rgb(32, 174, 180) 50%, rgb(82, 150, 186) 100%);
    padding: 10px 10px;
}

.tblStyle01 tr:nth-child(2n+2) th {
    background: linear-gradient(160deg, rgb(25, 170, 159) 0%, rgb(11, 144, 150) 50%, rgb(6, 105, 157) 100%);
}

.tblStyle01 tr:nth-child(3n+3) th {
    background: linear-gradient(160deg, rgb(25, 137, 170) 0%, rgb(11, 102, 150) 50%, rgb(6, 76, 157) 100%);
}

.tblStyle01 tr td {
    width: calc(100% - 240px);
}

.tblStyle02 {
    border-collapse: collapse;
    background-color: #f8f8f8;
    margin: 0 auto;
}

.tblStyle02 th {
    color: #fff;
    background-color: #4DCEC4;
    padding: 10px 15px;
}

.tblStyle02 th.none {
    color: #fff;
    background-color: #fff;
}

.tblStyle02 th.green02 {
    color: #fff;
    background-color: #159698;
}

.tblStyle02 th.blue01 {
    color: #fff;
    background-color: #0B6596;
}

.tblStyle02 th.blue02 {
    color: #fff;
    background-color: #0C699D;
}

.tblStyle02 th.blue03 {
    color: #fff;
    background-color: #105DAA;
}

.tblStyle02 th.blue04 {
    color: #fff;
    background-color: #074C9D;
}

.tblStyle02 td {
    padding: 10px 15px;
}

@media screen and (max-width: 1000px) {
    .tblStyle01 {
        width: 100%;
    }
}

@media screen and (max-width: 767px) {
    .tblStyle01 tr th {
        width: 200px;
        font-size: 100%;
    }

    .tblStyle01 tr td {
        width: calc(100% - 240px);
        font-size: 90%;
    }
}

@media screen and (max-width: 767px) {
    .tblStyle02 {
        font-size: 90%;
    }

    .tblStyle01 tr th,
    .tblStyle01 tr td {
        display: block;
        width: 100%;
        padding: 10px 15px;
    }
}

/* Common Table --------------- */

.tblComm {
    border-top: 1px dotted #fff;
}

.tblComm th,
.tblComm td {
    padding: 7px 15px;
    border-bottom: 1px dotted #ccc;
    box-sizing: border-box;
}

.tblComm th {
    background-color: #fff;
    width: 20%;
}

.tblComm th[align="center"],
.tblComm td[align="center"] {
    text-align: center;
}

.tblComm th[align="right"],
.tblComm td[align="right"] {
    text-align: right;
}

.tblRespon {
    overflow-x: auto;
}

.tblRespon .tblComm {
    min-width: 600px;
}

.noteTbl {
    color: red;
    text-align: center;
    margin: 2% 0;
    display: none;
}

/* Form Table --------------- */

.tblForm th {
    background-color: #fff;
    width: 25%;
    padding: 2%;
    text-align: left;
}

.tblForm td {
    padding: 2%;
    text-align: left;
}

.tblForm th,
.tblForm td {
    border-bottom: 1px dotted #ccc;
}

/* tblRespon --------------- */

.tblRespon {
    overflow-x: auto;
}

.noteTblRespon {
    font-size: 80%;
    color: red;
    margin: 2% 0;
    text-align: center;
    display: none;
}

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

    /* Common Table --------------- */
    .tblComm th,
    .tblComm td {
        font-size: 90%;
    }

    .tblComm th {
        width: 30%;
    }

    .tblComm.singleRow th,
    .tblForm.singleRow th {
        display: block;
        font-weight: bold;
        padding-bottom: 5px;
    }

    .tblComm.singleRow td,
    .tblForm.singleRow td {
        display: block;
    }

    .noteTbl {
        display: block;
    }

    /* Form Table --------------- */
    .tblForm th {
        width: auto;
    }

    /* tblRespon --------------- */
    .noteTblRespon {
        display: none;
    }
}

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

    /* tblRespon --------------- */
    .noteTblRespon {
        display: block;
    }
}

/* --------------------------------------------------
 Text
-------------------------------------------------- */

.txtCenter {
    text-align: center;
}

.txtBottom {
    display: table-cell;
    vertical-align: bottom;
}

.txtUnderline {
    text-decoration: underline;
}

.txtUnderline2 {
    display: inline;
    border-bottom: 2px solid #fe2a4e;
}

.txtBig {
    font-size: 115%;
}

.txtLarge {
    font-size: 135%;
}

.txtVLarge {
    font-size: 220%;
}

.txtSmall {
    font-size: 85%;
}

.txtlittle {
    font-size: 70%;
}

.txtWeight {
    font-weight: bold;
}

.txtInlineBlc {
    text-align: left;
    display: inline-block;
}

.txtBlack {
    color: #000;
}

.txtWhite {
    color: #fff;
}

.txtRed {
    color: #BD2D2B;
}

.txtGreen {
    color: #1C9100;
}

.txtBlue {
    color: #0e4992;
}

.bgWhite {
    background-color: #fff;
}

.bgGray {
    background-color: #EEEDF2;
}

.bgBlue {
    background-color: #0E498F;
}

.bgBlue02 {
    background-color: #2F69BC;
}

.bgSky {
    background-color: #3E90B4;
}

.bgSky02 {
    background-color: #A9DBE8;
}

.bgSky03 {
    background-color: #41ABC4;
}

.bgGreen {
    background-color: #C3EFA7;
}

.bgPink {
    background-color: #EA6776;
}

.marker {
    background: linear-gradient(transparent 50%, #efff00 0%);
    display: inline;
    padding: 0 2px 2px;
}

@media screen and (max-width: 767px) {
    .txtForSp {
        text-align: left !important;
    }

    .txtForSp br {
        display: none !important;
    }

    span.txtForSp {
        display: inline-block;
    }
}

@media screen and (min-width: 650px) {
    .br-pc {
        display: block;
    }

    .br-sp {
        display: none;
    }
}

@media screen and (max-width: 650px) {
    .br-pc {
        display: none;
    }

    .br-sp {
        display: block;
    }
}

/* --------------------------------------------------
 Other Classes
-------------------------------------------------- */

/* Spacing --------------- */

.mt-1 {
    margin-top: 1% !important;
}

.mt-2 {
    margin-top: 2% !important;
}

.mt-3 {
    margin-top: 3% !important;
}

.mt-4 {
    margin-top: 4% !important;
}

.mt-5 {
    margin-top: 5% !important;
}

.mt-6 {
    margin-top: 6% !important;
}

.mt-7 {
    margin-top: 7% !important;
}

.mt-8 {
    margin-top: 8% !important;
}

.mb-1 {
    margin-bottom: 1% !important;
}

.mb-2 {
    margin-bottom: 2% !important;
}

.mb-3 {
    margin-bottom: 3% !important;
}

.mb-4 {
    margin-bottom: 4% !important;
}

.mb-5 {
    margin-bottom: 5% !important;
}

.mb-6 {
    margin-bottom: 6% !important;
}

.mb-7 {
    margin-bottom: 7% !important;
}

.mb-8 {
    margin-bottom: 8% !important;
}

.padd {
    padding: 15px;
    box-sizing: border-box;
}

.padd02 {
    padding-left: 2%;
    padding-right: 2%;
    box-sizing: border-box;
}

.padd04 {
    padding-top: 2%;
    padding-bottom: 2%;
    box-sizing: border-box;
}

.padd05 {
    padding-top: 4%;
    padding-bottom: 4%;
    box-sizing: border-box;
}

@media screen and (max-width: 767px) {
    .padd03 {
        padding-left: 2%;
        padding-right: 2%;
        box-sizing: border-box;
    }
}

.marg {
    margin-top: 2%;
    margin-bottom: 2%;
}

.bottomSpace {
    padding-bottom: 40px;
}

.bottomSpace01 {
    padding-bottom: 80px;
}

/* Clear fix --------------- */

.clearFix:after {
    content: "";
    clear: both;
    display: block;
}

/* Clear --------------- */

.clear {
    clear: both;
}

/* Hide --------------- */

.hidden {
    opacity: 0;
}

.visible {
    opacity: 1;
}

.disnon {
    display: none;
}

/* imgDeco --------------- */

.imgDeco {
    border: 1px solid #cdcdcd;
    padding: 1px;
    box-sizing: border-box;
}

/* imgCircle --------------- */

.imgCircle {
    -webkit-border-radius: 999px;
    -moz-border-radius: 999px;
    border-radius: 999px;
}

/* imgRightBlc --------------- */

.imgRightBlc {
    margin: 0 0 20px 20px;
    float: right;
}

/* imgZoomEffect --------------- */

.imgZoom {
    overflow: hidden;
}

.imgZoom img,
.imgZoom .img {
    -ms-transform: translateZ(0px);
    -webkit-transform: translateZ(0px);
    transform: translateZ(0px);
    transition: all 200ms ease-in-out 0s;
}

.imgZoom img:hover,
.imgZoom .img:hover {
    -ms-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

/* PDF icon --------------- */

.icnPdf {
    vertical-align: bottom;
    margin: 0px 3%;
}

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

    /* Hide --------------- */
    .post.hidden {
        opacity: 1;
    }
}

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

    /* imgRightBlc --------------- */
    .imgRightBlc {
        margin: 0 auto 20px;
        float: none;
    }

    /* Popup --------------- */
    .popup {
        display: block;
        position: relative;
    }
}

/* Form required --------------- */

.required,
.nRequired {
    background-color: #FF004E;
    color: #fff;
    font-size: 90%;
    font-weight: bold;
    display: inline-block;
    margin: 0 8px;
    padding: 5px 12px;
    text-align: center;
    line-height: 1.6;
}

.nRequired {
    background-color: #999;
}

input.narrowSize {
    width: 15%;
}

input.middleSize {
    width: 50%;
}

input.smallSize {
    width: 35%;
}

input.wideSize {
    width: 80%;
}

.fullSize {
    width: 100%;
}

textarea {
    width: 100%;
    height: 200px;
}

.maxWid01 {
    max-width: 450px;
}

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

    .required,
    .nRequired {
        top: 12px;
    }

    input.narrowSize {
        width: 30%;
    }

    input.middleSize {
        width: 70%;
    }

    input.smallSize {
        width: 60%;
    }

    input.wideSize {
        width: 100%;
    }
}

input,
textarea {
    border: 1px solid #C9C9C9;
    border-radius: 5px;
}

input[type=checkbox] {
    margin-right: 10px;
}

.focusAnimation:focus {
    border: 1px solid #39c;
    box-shadow: 0 0 5px #39c;
    outline: medium none;
    transition: all 0.3s ease-in-out 0s;
}

.tblForm tr:nth-last-child(1) th,
.tblForm tr:nth-last-child(1) td {
    border: none;
}

.boxCheck {
    display: table;
    background-color: #F7F7F7;
    margin: 30px auto 20px;
    padding: 30px 60px;
}

.txtPrivacy a {
    color: #198B95;
}

.wpcf7-response-output {
    text-align: center;
    border: none !important;
    color: #dc3232;
    margin: 30px 0 !important;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
    color: #ffb900;
}

.wpcf7 form.sent .wpcf7-response-output {
    color: #46b450;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
    color: #dc3232;
    /* Red */
}

.wpcf7 form.spam .wpcf7-response-output {
    color: #f56e28;
    /* Orange */
}

.imgPopup {
    position: relative;
    display: block;
}

.imgPopup::after {
    position: absolute;
    bottom: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    content: '+';
    font-size: 200%;
    font-weight: bold;
    color: #fff;
    width: 60px;
    height: 60px;
    background-color: #3E90B4;
    border: 1px solid #3E90B4;
    transition: all 200ms ease-in-out 0s;
}

.imgPopup:hover::after {
    color: #3E90B4;
    background-color: #fff;
    opacity: .9;
}

/* --------------------------------------------------
 main-single-post
-------------------------------------------------- */
#main-single-post.single-post {
    margin-top: 40px;
}

#main-single-post a:hover {
    text-decoration: none;
    opacity: 0.7;
}

#main-single-post a {
    color: #007bff;
    text-decoration: underline;
}

#main-single-post .thumbnail-image {
    margin-bottom: 30px;
    text-align: center;
}

#main-single-post .thumbnail-image img {
    height: 100%;
}

/* --------------------------------------------------
 main-category-post
-------------------------------------------------- */

#main-category-post a:hover {
    text-decoration: none;
    opacity: 0.7;
}

#main-category-post a {
    color: #007bff;
    text-decoration: underline;
}

#main-category-post .category-no-link a {
    text-decoration: none;
    pointer-events: none;
    text-align: center;
    color: #4EAEB2;
    font-weight: bold;
    margin-bottom: 30px;
}

/* --------------------------------------------------
 content-single-post
-------------------------------------------------- */

#content-single-post .news-blc {
    border-bottom: 1px solid #000;
    margin-bottom: 7%;
    padding-bottom: 7%;
}

#content-single-post .ttlStyle02 {
    line-height: 1.8;
    margin-bottom: 30px;
    text-align: center;
}

#content-single-post .date {
    display: block;
    position: relative;
    width: 100px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    background: #4EAEB2;
    padding: 5px;
    margin: 0 0 30px 0;
}

#content-single-post .date::before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid #277774;
    top: 3px;
    left: 3px;
}

#content-single-post .image {
    text-align: center;
    margin-bottom: 30px;
}

#content-single-post .image>img {
    height: auto;
}

@media screen and (max-width:480px) {
    #content-single-post .news-blc {
        margin-bottom: 14%;
        padding-bottom: 14%;
    }

    #content-single-post .ttlStyle02,
    #content-single-post .image,
    #content-single-post .date {
        margin-bottom: 4%;
    }
}

/* --------------------------------------------------
 display-posts-listing
-------------------------------------------------- */

.display-posts-listing {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.display-posts-listing>li {
    width: calc(50% - 15px);
    box-sizing: border-box;
    margin-right: 5px;
    margin-left: 5px;
    max-width: 280px;
    margin-bottom: 20px;
    background-color: #fff;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    position: relative;
    padding-bottom: 48px;
}

.display-posts-listing>li:nth-last-child(2),
.display-posts-listing>li:last-child {
    margin-bottom: 0;
}

.display-posts-listing>li .image {
    text-align: center;
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
    width: 100%;
    display: block;
    order: 1;
}

.display-posts-listing>li .image .wp-post-image {
    height: auto;
}

.display-posts-listing>li .date::before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid #277774;
    top: 3px;
    left: 3px;
}

.display-posts-listing>li .date {
    display: block;
    position: relative;
    width: 100px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    background: #4EAEB2;
    padding: 5px;
    margin: 4% 4% 15px 4%;
    order: 2;
}

.display-posts-listing>li .image+.title+.date {
    margin: -25px 4% 15px 4%;
}

.display-posts-listing>li .title {
    width: 100%;
    font-size: 100%;
    padding-left: 4%;
    padding-right: 4%;
    margin-bottom: 10px;
    word-break: break-all;
    box-sizing: border-box;
    display: block;
    order: 3;
}

.display-posts-listing>li .excerpt {
    order: 4;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.display-posts-listing>li .excerpt-more {
    text-align: center;
    background-color: #4EAEB2;
    transition: .3s all;
    display: block;
    text-decoration: none;
    color: #fff;
    padding: 10px 20px;
    width: 100%;
    box-sizing: border-box;
}

.display-posts-listing>li .excerpt-more:hover {
    opacity: 0.7;
}

.display-posts-listing>li .excerpt-more::after {
    content: ">";
    padding-left: 10px;
    transform: scale(1.5, 1);
    font-style: normal;
    font-size: 100%;
}

@media screen and (max-width:480px) {
    .display-posts-listing>li {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
        margin-bottom: 20px !important;
    }

    .display-posts-listing>li:last-child {
        margin-bottom: 0 !important;
    }
}

/* --------------------------------------------------
 pagination
-------------------------------------------------- */

/*WP-PageNavi */

.nav-links {
    clear: both;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 20px;
    font-size: 12px;
    display: flex;
    justify-content: center;
    box-sizing: border-box;
}

.nav-links a,
.nav-links span {
    text-decoration: none !important;
    padding: 10px 16px;
    margin: 3px;
}

.page-numbers.dots {
    margin: 0;
    padding-left: 12px;
    padding-right: 12px;
}

.nav-links span.pages {
    color: #FFF;
    background: #4eaeb2;
}

.nav-links span.current {
    background: #BBB;
    color: #FFF;
}

.nav-links a {
    color: #FFF !important;
    background: #4eaeb2;
}

.nav-links a:hover {
    background: #9DB0C4;
}

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

    .nav-links a,
    .nav-links span {
        text-decoration: none;
        padding: 7px 12px;
        margin: 3px;
    }
}

.liquid-speech-balloon-wrap {
    max-width: 1200px;
    width: 96%;
    padding: 0 2%;
    position: relative;
    box-sizing: content-box;
    margin: 0 auto;
}

/* トピックス */
.tel-topics {

    /* 状通 */
    .display-posts-listing {
        margin-bottom: 100px;
        gap: 20px;
    }

    .listing-item {
        margin: 0;
    }

    /* 固定ページ */
    &.page {
        background: url(../img/top/news-bg.jpg) no-repeat;
        background-size: cover;
        padding: 100px 0;
    }

    /* 一覧ページ */
    &.archive {
        .listing-item {
            background-color: #F4F4F4;
            box-shadow: 0 0 20px #f4f4f4;
        }
        .excerpt-more {
            text-decoration: none !important;
            color: #fff !important;
        }
    }
}