body.sub    {
    background-position: center top 67.1875vw;
}

.key:before {
    height: 78.125vw;
}

.sub .key   {
    aspect-ratio: 64 / 31;
    overflow-y: visible;
}

@media screen and (max-width: 1512px) and (min-width: 835px)    {
    .sub .key {
        aspect-ratio: auto;
        height: 52.5vw;
    }    
}


.sub main section .inner .box .titlearea > .roboto-condensed:after  {
    display: none;
}

.relative > .robot    {
    position: absolute;
    top: 0;
}

.relative > .robot.left    {
    left: 0;
}

.relative > .robot.right    {
    right: 0;
}

.button.flex {
    gap: 10px;
    justify-content: flex-start;
    
}

.button.flex a   {
    width: auto;
    min-width: 110px;
    justify-content: flex-start;
    position: relative;
    padding: 0 min(0.7813vw, 15px) 0 min(0.6250vw, 12px);
    gap: min(0.5291vw, 8px);
    line-height: 1;
}

.button.flex a:before    {
    content: "▶︎";
    color: #F00;
    font-size: min(0.5291vw, 8px);
}

.related    {
    border-top: 1px dashed #CCCCCC;
}

.hasborder  {
    border: 1px solid #999999;
}

.scrollhint {
    width: 100%;
    position: relative;
    max-width: 900px;
    overflow-x: scroll;
    margin-left: auto;
    margin-right: auto;
}

.scrollhint::-webkit-scrollbar {
  display: none;
}

.scrollhint img {
    width: 100%;
    height: auto;
    max-width: none;
}


@media screen and (max-width: 834px)    {
    .key:before {
        height: 199vw;
    }
    
    .sub .key   {
        aspect-ratio: 25 / 37;
        overflow-y: visible;
    }    

    .button.flex {
        flex-wrap: wrap;
        flex-direction: column;
        gap: 2.04vw;
        align-items: flex-start;
    }
    
    .button.flex a   {
        width: auto;
        height: 10.18vw;
        border-radius: 5.09vw;
        padding: 0 2vw;
        gap: 1vw;
    }
    
    .button.flex a:before {
        font-size: 2.04vw;
        left: 2.54vw;
    }
    
    .scrollhint {
        width: calc(100% + 10vw);
        position: relative;
        left: -5vw;
        padding-left: 5vw;
        padding-right: 5vw;
        
    }
 
    .scrollhint img {
        min-width: 675px;
    }
}