html {
    height: 100%;
}

body {
    background-color: white;
    font-family: "MS Gothic", "-3 ��ï", "MS ��ï", Msgothic, "���� ProN", sans-serif;
    font-size: 14px;
    background-repeat: no-repeat;
    color: #4a3a3a;
    text-align: justify;
}

#maincontainer {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding-top: 270px;
    max-width: 500px;
    margin: 0 auto;
}

#main-content {
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.15);
    background: #ffffff;
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 10px;
   
    border-radius: 15px;
}

/* inside the main container */
.content-with-image {
    display: flex; /* image + text side by side */
    align-items: flex-start;
    gap: 10px;
    width: 100%;
}

.soobin {
    width: 120px; /* size */
    height: auto; /* proportions */
    margin-top: 5px;
    margin-right: 5px; 
    margin-bottom: 5px; 
    border-radius: 100px; 
    flex-shrink: 0;
}

.highlight {
    font-size: 14px;
    color: #888888;
    font-style: italic;
    background: #eae0e2;
    padding: 1px;
}

.wings {
    /* aligning the pixel wing inline with the content text */
    vertical-align: middle;
    height: 20px; 
}