*,*::before,*::after{box-sizing:border-box}ul[class],ol[class]{padding:0}body,h1,h2,h3,h4,p,ul[class],ol[class],figure,blockquote,dl,dd{margin:0}html{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}ul[class],ol[class]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}article>*+*{margin-top:1em}input,button,textarea,select{font:inherit}img:not([alt]){filter:blur(10px)}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}

body {
    font-family:"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,"游ゴシック Medium",YuGothic,YuGothicM,sans-serif;
    position: absolute;
    z-index: 1;
    width: 100%;
    transition: 0.4s;
}
a {
    text-decoration: none;
    color: #209cb5;
    font-weight: bold;
    transition: 0.4s;
}
a:hover {
    text-decoration: none;
    color: #afa58f;
    font-weight: bold;
    text-shadow: 1px 1px 1px #696969;
    border-bottom: dotted 1px;
}

h2 {
    text-align: center;
    font-size: 2rem;
    font-weight: bold;
    color: #209cb5;
    text-shadow: 3px 3px 6px #b7b7b7;
    padding: 4rem 0 0 0;
}

ul {
    width: 65%;
    margin: 0 auto;
    position: absolute;
    top: 13rem;
    left: 0;
    right: 0;
    padding: 2.3rem;
    background-color: #ffffffd1;
    font-size: 1.4rem;
    border: solid 2px #209cb5;
    border-radius: 10px;
    box-shadow: 0 0 25px -10px black;
}

li {
    list-style: none;
    margin-bottom: 1rem;
    height: 45px;
}

.bgimg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    background-image: url("../images/mainVisual.jpg");
    background-size: cover;
    width:100%;
    height:100%;
    filter: blur(10px);
    opacity: 0.5;
}
.bgimg-wp{
    position: absolute;
    background-image: url(../images/cube.png);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    z-index: 10;
    width:100%;
    height:100%;
    }
main {
    width: 100%;
    z-index: 1000;
    position: relative;
    padding: 2.5rem 0 0 0;
}
.dlwrap {
    width: 1024px;
    margin: 0 auto;
    position: relative;
    background-size: 51%;
    background-repeat: no-repeat;
}

.siotmg {
    filter: blur(0px) brightness(106%) saturate(155%) sepia(16%);
    width: 350px;
    -webkit-animation: sotmg-floating 15s ease-in-out infinite;
    animation: sotmg-floating 15s ease-in-out infinite;
    will-change: transform;
}
li.extscr {
    width: 77%;
    margin-left: auto;
}

ul span {
    font-size: 0.85rem;
    font-weight: bold;
    color: #4d4d4d;
    width: 100%;
    display: block;
    text-align-last: justify;
    text-justify: inter-ideograph;
}
li a {
    display: flex;
    justify-content: space-between;
    height: 35px;
}

li > a:hover ~ span {
    text-decoration: none;
    color: #947b40;
    font-weight: bold;
    text-shadow: 0px 1px 0px #947b40;
}

.tick-flip,.tick-text-inline {
    font-size:60px;
    width:80px;
}


@-webkit-keyframes sotmg-floating{
    0%{
        -webkit-transform:translate(1%,2%) rotate(-1deg);transform:translate(1%,2%) rotate(-1deg)
    }
    65%{
        -webkit-transform:translate(-1%,-2%) rotate(3deg);transform:translate(-1%,-2%) rotate(3deg)
    }to{
        -webkit-transform:translate(2%,4%) rotate(-1deg);transform:translate(2%,4%) rotate(-1deg)}
}
@keyframes sotmg-floating{
    0%{
        -webkit-transform:translate(1%,2%) rotate(-1deg);transform:translate(1%,2%) rotate(-1deg)
    }
    65%{
        -webkit-transform:translate(-1%,-2%) rotate(3deg);transform:translate(-1%,-2%) rotate(3deg)
    }to{
        -webkit-transform:translate(1%,2%) rotate(-1deg);transform:translate(1%,2%) rotate(-1deg)}
}



section.frm-wrap {
    margin: 0 auto;
    padding: 2.3rem;
    background-color: #ffffffd1;
    font-size: 1.4rem;
    border: solid 2px #209cb5;
    border-radius: 10px;
    box-shadow: 0 0 25px -10px black;
    width: 65%;
    margin-top: -3rem;
    margin-bottom: 2rem;
}
section.frm-wrap h2 {
    padding: 0rem 0 0 0;
}
section.frm-wrap .note {
    font-size: 0.9rem;
    width: 85%;
    margin: 0 auto;
    text-align: justify;
    font-weight: 600;
    color: #3c3c3c;
}
section.frm-wrap form {
    width: 100%;
    float: left;
    padding: 1rem;
}
section.frm-wrap form input[type="text"] {
    width: 65%;
    margin: 0 auto;
    display: block;
    margin-top: 1rem;
    border: solid 1px #489eb5;
    transition: all 0.3s;
}
section.frm-wrap form input[type="text"]:focus {
    outline: none;
    border: solid 2px #489eb5;
    border-radius: 5px;
}
section.frm-wrap form input[type="submit"] {
    cursor: pointer;
    text-align: center;
    margin: 0 auto;
    display: block;
    font-size: 0.9rem;
    font-weight: 900;
    color: #209cb5;
    border: solid 3px;
    padding: 0.3rem 2rem;
    transition: all 0.3s;
}
section.frm-wrap form input[type="submit"]:hover {
    border-radius: 7px;
    box-shadow: 0 0 10px -3px #124e5a;
}
section.frm-wrap form input[type="submit"]:focus {
    outline: none;
    border: solid 4px #128cad;
    border-radius: 7px;
}
#simsearch {
    text-align: center;
    font-size: 1rem;
    font-weight: bold;
    color: #209cb5;
    text-shadow: 3px 3px 6px #b7b7b7;
}
.fails {
    color: #F60;
}
.done {
    font-weight: 500;
    font-size: 0.9rem;
    width: 53%;
    margin: 0 auto;
}
.done strong {
    font-size: 1.1rem;
    color: #7b7b7b;
    font-weight: 900; 
}
.done-sn,.done-ims {
    margin-top: 1rem;
    display: flex;
    justify-content: space-between;
}
.done-ims strong {
    color: #1d8ca2;
}