body
    {
        background: lightgray;
    }

    .kantancontainer {
        margin-top: 20px;
    }

    .kantanpic {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .kantancard {
        background: #bcbcbc;
    }

    .kantancardpic {
        width: 500px;
        height: 300px;
        object-fit: cover;
    }

    .kantancardtitle
    {
       text-align: center;
       font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;
    }

    .kantancarddate
    {
       text-align: right;
       font-size: 12px;
       font-family: monospace;
    }

    .index_title {
      font-size: 18px;
      font-weight: bold;
      font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;
    }

    .index_date {
      font-size: 12px;
      text-align: right;
      font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;
    }

    .jp_word { 
      font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;
      letter-spacing: 1.5px;
      font-size: 18px;
    }

    .eng_def {
	font-size: 12px;
    }

    .published {
        text-align: right;
    }

    .title {
        margin-top: 40px;
        text-align: center;
    }

    .dictionaryTable
    {
        margin-top: 20px;
    }

    .dictionaryTable th
    {
	text-align: center;
    }

    .tableword {
        width: 150px;
    }

    .dottedUnderline 
    { 
        border-bottom: 1px dashed; 
        border-color: red;
    }

    .dottedUnderlineProper
    { 
        border-bottom: 1px dashed;
        border-color: blue;
    }

    .dottedUnderlineN2
    { 
        border-bottom: 1px solid; 
        border-color: darkgreen;
    }

    .pretty
    {
        font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;
        padding-top: 30px;
        letter-spacing: 1.5px;
        font-size: 18px;
    }

    #tooltip
    {
        text-align: center;
        color: #fff;
        background: #111;
        position: absolute;
        z-index: 100;
        padding: 15px;
	pointer-events: none;
    }

    #tooltip:after /* triangle decoration */
    {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #111;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }

    #tooltip.top:after
    {
        border-top-color: transparent;
        border-bottom: 10px solid #111;
        top: -20px;
        bottom: auto;
    }

    #tooltip.left:after
    {
        left: 10px;
        margin: 0;
    }

    #tooltip.right:after
    {
        right: 10px;
        left: auto;
        margin: 0;
    }

    a.previous {
      text-decoration: none;
      display: inline-block;
      padding: 8px 16px;
    }

    a.previous:hover {
      background-color: #ddd;
      color: black;
    }

    a.next {
      text-decoration: none;
      display: inline-block;
      padding: 8px 16px;
    }

    a.next:hover {
      background-color: #ddd;
      color: black;
    }

    .previous {
      background-color: #f1f1f1;
      color: black;
    }

    .next {
      background-color: #4CAF50;
      color: white;
    }