.title {
    margin:  3vw;
    margin-bottom: 1vw;
    font-size:  24px;       /* 文字サイズ指定 */
    font-weight:  normal;   /* 文字の太さ調整 */
    background: linear-gradient(to right, rgb(48, 224, 192) 0%,rgba(96,155,208,0.7) 30%,rgba(125,185,232,0) 100%);/* グラデーション指定 */
    padding:  1vw;         /* 余白指定 */
    padding-left: 2vw;
    border-radius:  1vw;    /* 角丸指定 */
    font-family: 'arial',sans-serif;
}

.headline {
    font-size:  20px;           /* 文字サイズ指定 */
    font-weight:  normal;       /* 文字の太さ調整 */
    background-color: #95ffddb8;  /* 背景色指定 */
    padding-top:  1vw;             /* 余白指定 */
    padding-bottom: 1vw;
    padding-left: 2vw;
    margin-bottom: 3vw;        /* 周りの余白指定 */
    border-radius:  3vw;        /* 角丸指定 */
    font-family: 'arial',sans-serif;
}

.frame {
    margin: 3vw 5vw 5vw;
}

.sub_frame {
    margin: 3vw 3vw 5vw;
    border-bottom: dotted 2px;
    .headline {
        background-color: #61f7f0b8;
    }
}

.paragraph {
    margin: 0 5vw 2vw;
    font-size: 18px;
    line-height: 45px;
    word-break: break-all;
}

.quotation {
    margin: 0 5vw 0 7vw;
    padding-left: 1vw;
    font-size: 18px;
    line-height: 45px;
    color: gray;
    border-left: solid;
    word-break: break-all;
}

footer {
    width: 80%;
    margin: auto;
    border-top: dotted black 2px;
}

.links {
    margin-top: 30px;
    img {
        margin-left: 50%;
        transform: translate(-50%, 0);
        width: 8%;
    }  
}