@charset "UTF-8";

/*ここから追加*/
#contents .title-head{
    color:#6b9ed2;
    font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","游明朝", YuMincho,"ＭＳ Ｐ明朝", "MS PMincho", serif;
}

#contents .TitleTextBox :nth-child(n + 3){
    font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","游明朝", YuMincho,"ＭＳ Ｐ明朝", "MS PMincho", serif;
    text-align: left;
    display:block;
    margin: auto;
}

.TitleTextBox{
    border-bottom:1px solid #6b9ed2;
}

.Title-text-box02 {
    display:flex;
    justify-content:center;
    position:relative;
    align-items: center;
}

.cardLayoutBox {
    box-shadow:0 1px 2px rgb( 0 0 24 /16%);
    border-radius:4px;
    background:pink;
}

.cardTitle-head{
    font-weight:bold;
}

.cardLayoutBox p{
    margin:20px;
}

.cardTitle-text{
    text-align: left;
}

.cardLayoutBox img{
    display:block;
    width:90%;
    height:auto;
    margin:20px auto;
}

.cardLayout-wrap{
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
width: 100%;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
justify-content: space-between;
    
}    

@media screen and (min-width:768px){
    .TitleTextBox{
        margin:0 0 56px 0;
    }
    
    .Title-text-box02 {
        margin: 0 0 40px 0;
    }

    .Title-text-box02 img{
        width:20%;
        padding:0 10px 0 0;
    }

    .title-img-head{
        color:#6b9ed2;
        font-size:24px;
        padding:10px 0 0 0; 
    }

    .title-head{
        font-size:56px;
        line-height: 84px;
        padding:0 0 40px 0px;
    }

    .TitleTextBox :nth-child(n + 3){
        font-size:32px;
        padding:0 0 20px 0;
        width: 50%;
    }

    
    .TitleTextBox :nth-child(7){
    padding-bottom:56px;
}
    .cardLayout-wrap{
        max-width: 910px;
    }

    .cardLayoutBox{
        width:calc(100% / 3 - 20px);
        align-items:flex-start;
        margin-bottom:20px;
    } 
}

@media screen and (max-width:767px){
    #contents .TitleTextBox{
        margin:0 0 20px 0;
    }

    #contents .title-head{
        font-size:24px;
        line-height: 36px;
        padding:0 0 20px 0;
    }

    #contents .TitleTextBox :nth-child(n + 3){
        font-size:20px;
        padding:0 0 10px 0;
        width: 90%;
    }

    
    #contents .TitleTextBox :nth-child(7){
    padding-bottom:30px;
    }

    .Title-text-box02 {
        margin: 0 0 20px 0;
    }

    .Title-text-box02 img{
        width:40%;
        padding:0 10px 0 0;
    }

    .title-img-head{
        color:#6b9ed2;
        font-size:24px;
        padding:10px 0 0 0; 
    }

    .cardLayout-wrap{
        max-width: 767px;
        }

    .cardLayoutBox{
        margin:0 0 1em;
        width:calc(100% / 2 - 4px);
        }

    .cardLayoutBox p{
        margin:8px;
    }
}