@font-face {
        src:local("NotoSansJP-Regular.otf"),
        font-family:Noto Sans JP;
        font-style:normal;
        font-weight:400;
}
html:lang(ja), body:lang(ja), h1:lang(ja), h2:lang(ja), h3:lang(ja), h4:lang(ja), h5:lang(ja), h6:lang(ja), p:lang(ja), span:lang(ja), th:lang(ja), td:lang(ja) {
        font-family:'Roboto', 'Noto Sans JP', sans-serif;
}
html:lang(en), body:lang(en), h1:lang(en), h2:lang(en), h3:lang(en), h4:lang(en), h5:lang(en), h6:lang(en), p:lang(en), span:lang(en), th:lang(en), td:lang(en){
        font-family:'Roboto','Noto Sans', sans-serif;
}

#how-to > p:before{
        white-space: pre;
        content: "\0031\002e\0020\0043\0068\0072\006f\006d\0065\0020\0028\0046\006e\002b\0029\0046\0031\0031\0020\30ad\30fc\3067\5168\753b\9762\8868\793a \A \0032\002e\0020\0043\0074\0072\006c\002b\0030\3067\30ba\30fc\30e0\3092\0031\0030\0030\0025\306b \A \0033\002e\0020\77e2\5370\30ad\30fc\21c4\3067\30b9\30e9\30a4\30c9\304c\5909\308f\308a\307e\3059\3002";
        font-weight: bold;
        color: #f6a90c;
        border-radius: 5px; 
        background-color: #f6e9cf;
        display: block;
        padding: 10px 16px;
}
#how-to:lang(en) > p:before{
	content: "1. Set full screen with (Fn+)F11 key in Chrome \A 2. Set zoom to 100% with Ctrl+0 \A 3. The slide changes with the arrow keys \0020\2194.";
}
#how-to p{
        position: absolute;
        bottom: 5%;
        width: 29%;
        left: 3%;
        font-size: 2.1vmin;
}
.triangle{
        position: absolute;
        right: 0;
        width: 0;
        height: 0;
        bottom: 1px; 
        border-style: solid;
        border-width: 0 0 450px 450px;
        border-color: transparent transparent #00a0e9 transparent;
        z-index:-1;
        }