/*basic トップ*/
.basic-top{
    display: flex;
    justify-content: center;
    gap: 30px;
    line-height: 1.8;
    flex-wrap: wrap;
}
.basic-top li{
    width: 35%;
    padding: 25px;
    transition: border 0.25s cubic-bezier(.215, .61, .355, 1);
    box-shadow: 0px 1px 5px 0px rgba(4, 0, 0, 0.28);
    border: 1px solid #fff;
    position: relative;
}

.basic-top li *{
    transition: color 0.25s cubic-bezier(.215, .61, .355, 1);
}
.basic-top li .title{
    font-size: 1.8rem;
    font-weight: bold;
}
.basic-top li .text{
    font-size: 1.6rem;
    margin-top: 10px;
}
.basic-top li .img{
    
}
.basic-top li .update{
    color: #525b5c;
    font-size: 90%;
    display: flex;
    justify-content: end;
    transition: all 0.25s cubic-bezier(.215, .61, .355, 1);
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.basic-top li:hover{
    border: 1px solid #ea002a;
}

.basic-top li:hover *{
    color:#ea002a;
}

.brackets span{
    line-height: 1.3;
}

@media screen and (max-width: 768.9px) {

    .basic-top li{
        width: 100%;
        margin: 0 20px;
    }

}

/*----------------------------------------------------------
.indexBox
----------------------------------------------------------*/
.indexBox {
    background: #efefef;
    padding: 15px 15px 0;
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
    margin-bottom: 40px;
    margin-top: 40px;
}

.indexBox h2, .indexBox h3 {
    font-size: 2.0rem;
    font-weight: bold;
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 2px solid #333;
}

.indexBox ol {
    list-style-type: decimal;
    margin: 30px 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 0 50px;
}

.indexBox ol li {
    font-size: 1.8rem;
    line-height: 1.4;
    margin-bottom: 20px;
    width: 100%;
}

.indexBox ol li:last-child {
    margin-bottom: 0;
}

.indexBox ol li a:hover {
    text-decoration: underline;
}

@media screen and (max-width: 768.9px) {

    .indexBox ol li {
        font-size: 1.4rem;
        width: 100%;
    }

}

/*basic 下層*/
.contents>.update{
    display: flex;
    margin-bottom: 20px;
    margin-top: -20px;
    justify-content: end;
    font-size: 90%;
}

.box-border-top{
    border-top: 1px solid #edeeee;
    margin-top: 20px;
}

.box h3{
    margin-top: 80px!important;
}

.flex-box{
    display: flex;
    gap: 30px;
}
.flex-box.reverse{
    flex-direction: row-reverse;
}
.flex-box-text{

}

.flex-box-img{
    flex-shrink: 0;
    width: 250px;
}
.flex-box-img-wide{
    width: 400px;
}

.caption {
    text-align: center;
    font-weight: bold;
    margin: 60px auto 10px;
}

span.notice {
    margin-top: 10px;
    display: block;
}

dl.notice{
    display: flex;
    line-height: 1.8;
    margin-top: 10px !important;
}

dl.notice dt{
    white-space: nowrap;
}

.img-wide{
    padding: 40px 0;
    margin-top: 0 !important;
}

.text-link{
    text-decoration: underline;
}

.text-link:hover{
    text-decoration: none;
}

.contact-btn{
    margin-top: 80px;
}

@media screen and (max-width:768.9px) {

    .flex-box,
    .flex-box.flex-box.reverse {
        flex-direction: column;
        flex-direction: column-reverse;
    }

    .flex-box-img {
        width: auto;
    }
    .img-wide {
        padding: 40px 0;
    }

}

@media screen and (min-width: 769px) {
    .leftRight.left > span {
       text-align: left;
    }
}