.balloonoya {
    position   : relative;                /* 指定した分だけ相対的に移動 */
}
.balloonoya:hover .balloon {
    display: inline;                /* インライン要素として表示 */
}
.balloon {
    position   : absolute;                /* 親要素を基準 */
    display: none;                        /* 要素を非表示 */
    padding: 10px;                         /* テキストの前後の余白 */
    background-color: #a4d1ff;       /* 背景色（透明度） */
    width: 600px;                          /* 吹き出し全体の幅 */
    right : -10%;                           /* 表示位置 */
    top : 100%;                        /* 表示位置 */
    margin-top : 12px;                 /* 表示位置 */
    font-size: 100%;                       /* 文字サイズ */
    border-radius: 10px;
    z-index: 100;
}
.balloon:after{
    border-bottom: 12px solid #a4d1ff;    /* 吹き出し口の高さ・色 */
    border-left: 10px solid transparent;    /* 吹き出し口の幅１／２ */
    border-right: 10px solid transparent;   /* 吹き出し口の幅１／２ */
    top: -12px;                          /* 吹き出し口の位置調整 */
    right : 2%;                              /* 吹き出し口の横位置 */
    content: "";                       /* コンテンツの挿入 */
    position: absolute;                /* 親要素を基準 */
}

.balloonoya2 {
    position   : relative;                /* 指定した分だけ相対的に移動 */
}
.balloonoya2:hover .balloon2 {
    display: inline;                /* インライン要素として表示 */
}
.balloon2 {
    position   : absolute;                /* 親要素を基準 */
    display: none;                        /* 要素を非表示 */
    padding: 10px;                         /* テキストの前後の余白 */
    background-color: #a4d1ff;       /* 背景色（透明度） */
    width: 600px;                          /* 吹き出し全体の幅 */
    right : -10%;                           /* 表示位置 */
    height: 200px;
    vertical-align: middle;
    top : -220px;                        /* 表示位置 */
    margin-top : 12px;                 /* 表示位置 */
    font-size: 100%;                       /* 文字サイズ */
    border-radius: 10px;
    z-index: 100;
}
.balloon2:after{
    border-top: 12px solid #a4d1ff;    /* 吹き出し口の高さ・色 */
    border-left: 10px solid transparent;    /* 吹き出し口の幅１／２ */
    border-right: 10px solid transparent;   /* 吹き出し口の幅１／２ */
    top: 200px;                          /* 吹き出し口の位置調整 */
    right : 2%;                              /* 吹き出し口の横位置 */
    content: "";                       /* コンテンツの挿入 */
    position: absolute;                /* 親要素を基準 */
}

.balloonoyaul {
    position   : relative;                /* 指定した分だけ相対的に移動 */
}
.balloonoyaul:hover .balloonul {
    display: inline;                /* インライン要素として表示 */
}
.balloonul {
    position   : absolute;                /* 親要素を基準 */
    display: none;                        /* 要素を非表示 */
    padding: 10px;                         /* テキストの前後の余白 */
    background-color: #a4d1ff;       /* 背景色（透明度） */
    width: 600px;                          /* 吹き出し全体の幅 */
    left : -10%;                           /* 表示位置 */
    top : 100%;                        /* 表示位置 */
    margin-top : 12px;                 /* 表示位置 */
    font-size: 100%;                       /* 文字サイズ */
    border-radius: 10px;
    z-index: 100;
}
.balloonul:after{
    border-bottom: 12px solid #a4d1ff;    /* 吹き出し口の高さ・色 */
    border-left: 10px solid transparent;    /* 吹き出し口の幅１／２ */
    border-right: 10px solid transparent;   /* 吹き出し口の幅１／２ */
    top: -12px;                          /* 吹き出し口の位置調整 */
    left : 2%;                              /* 吹き出し口の横位置 */
    content: "";                       /* コンテンツの挿入 */
    position: absolute;                /* 親要素を基準 */
}