html {
    overflow: hidden;
    position: fixed;
    margin: 0;
    height: 100%;
    width: 100%;
    background-color: rgb(0, 0, 0);
    /*  touch-action: none;*/


    touch-action: manipulation;
    /*        image-rendering: pixelated; */
    /* 二本指スワイプの進む戻るの無効化 */
    overscroll-behavior-x: none;
    scroll-behavior: smooth;

}

body {

    margin: 0;
    /*padding: 0;*/
    height: 100%;
    width: 100%;
    color: rgb(36, 36, 36);
    /*
    background-color: rgb(50, 35, 97);
    */
    background-color: rgb(255, 255, 255);
    background-repeat: no-repeat;
    background-size: 100% auto;
    -webkit-text-size-adjust: 100%;
    /*    font-family: 'Hiragino Kaku Gothic Pro', sans-serif;*/
    font-family: 'Roboto', sans-serif;
    overflow: hidden;
    /*image-rendering: crisp-edges;*/
}

/* 選択不可能モード */
* {
    -ms-user-select: none;
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.enableUserSelect {
    -ms-user-select: auto;
    -moz-user-select: -moz-auto;
    -khtml-user-select: auto;
    -webkit-user-select: auto;
    user-select: auto;
}

.pixelated {
    -ms-interpolation-mode: nearest-neighbor;
    /* IE8+ */
    image-rendering: -webkit-optimize-contrast;
    /* Safari (WebKit) */
    image-rendering: crisp-edges;
    image-rendering: -webkit-crisp-edges;
    /* Safari */
    image-rendering: -moz-crisp-edges;
    /* Firefox (Gecko) */
    image-rendering: -o-crisp-edges;
    /* Opera 12.x */
    image-rendering: pixelated;
    /* Chrome 41+, Opera 29+ (CSS4) */

    user-select: none;
    /* CSS3 */
    -moz-user-select: none;
    /* Firefox */
    -webkit-user-select: none;
    /* Safari、Chromeなど */
    -ms-user-select: none;
    /* IE10かららしい */
}

.inputEx {
    text-align: center;
}

/* お金マークを左寄せ */
.inputEx::placeholder {
    text-align: center;
}

::placeholder {
    text-align: center;
}

.headerMenu {
    margin-top: env(safe-area-inset-top);
    /*margin-top: 2rem;*/
}

/* 上記で入力フォーカス問題回避 */

.selectable {
    -ms-user-select: text;
    -moz-user-select: -moz-text;
    -khtml-user-select: text;
    -webkit-user-select: text;
    user-select: text;
    font-family: 'Hiragino Kaku Gothic Pro', sans-serif;
}

input,
textarea {
    -ms-user-select: auto;
    -moz-user-select: -moz-auto;
    -khtml-user-select: auto;
    -webkit-user-select: auto;
    user-select: auto;
    font-family: 'Hiragino Kaku Gothic Pro', sans-serif;

    border: none;
    outline: none;
    /*        outline: solid 1px rgb(255, 255, 255);*/
}

.textarea {
    border-color: rgb(255, 255, 255);
    /* 枠線の色 */
    background-color: #ffc;
    /* 背景色 */
    outline: none;
    border: none;
    /* ※ブラウザが標準で付加する線を消したいとき */
}

.testCss {
    /*    background-color: #ffc; */
    border: 5px solid green;
}

.input:focus,
.textarea:focus {
    border-color: rgb(10, 218, 255);
    /* 枠線の色 */
    background-color: #ffc;
    /* 背景色 */

    outline: none;
    /* ※ブラウザが標準で付加する線を消したいとき */
}

.input:focus {
    border-color: rgb(10, 218, 255);
    /* 枠線の色 */
    background-color: #ffc;
    /* 背景色 */

    outline: none;
    /* ※ブラウザが標準で付加する線を消したいとき */
}

.de-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    background: var(--deSliderThumbBackground);
    width: var(--deSliderThumbSize);
    height: var(--deSliderThumbSize);
    border-radius: 50%;
    accent-color: hotpink;
}

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

::-webkit-scrollbar {
    width: 3px;
}

::-webkit-scrollbar-track {
    background: #4c3a543a;
    border-radius: 2px;
}

::-webkit-scrollbar-thumb {
    background: #ffffff20;
    border-radius: 2px;
}

.messageBoxShadow {
    background-color: rgb(100, 0, 200, 0.6);
    /*box-shadow: 0px 0px 50px 60px rgba(0, 0, 100, 0.8);*/
    box-shadow: 0px 0px 200px 40px rgba(100, 0, 200, 0.8);
}

span.readingLoader {
    display: inline-block;
    white-space: nowrap;
    font-size: 100%;
    color: #EEEEEE;
}

span.readingLoader span {
    display: inline-block;
    width: 100px;
    height: 2px;
    vertical-align: middle;
    background-position: 0 0;
    background-repeat: repeat-x;
    background-size: 4px 100px;
    background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(0.5, transparent), color-stop(0.5, #EEEEEE), to(#EEEEEE));
    background-image: -webkit-linear-gradient(left, transparent 2px, #EEEEEE 4px);
    background-image: linear-gradient(to right, transparent 2px, #EEEEEE 4px);
    vertical-align: middle;
    -webkit-animation: animation_readingLoader 2.0s linear infinite;
    animation: animation_readingLoader 2.0s linear infinite;
}

@-webkit-keyframes animation_readingLoader {
    0% {
        width: 0;
    }

    100% {
        width: 30%;
    }
}

@keyframes animation_readingLoader {
    0% {
        width: 0;
    }

    100% {
        width: 30%;
    }
}

.blinking {
    -webkit-animation: blink 0.5s ease-in-out infinite alternate;
    -moz-animation: blink 0.5s ease-in-out infinite alternate;
    animation: blink 0.5s ease-in-out infinite alternate;
}

@-webkit-keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.uiUserMenu {
    /*  filter: drop-shadow(0.1rem 0.1rem 0.1rem rgba(0,0,0,0.8));*/
    box-shadow: 0rem 0em 0.1rem 0.05rem rgba(0, 0, 0, 0.3);
}

::placeholder {
    text-align: center;
}

.placeholderLeft::placeholder {
    text-align: left;
}

.placeholderRight::placeholder {
    text-align: right;
}

a:link {
    color: #fdfff6;
    text-decoration: none;
}

a:visited {
    color: #fdfff6;
    text-decoration: none;
}

/* loader */
.loader {
    border-radius: 50%;
    border: solid 8px;
    border-color: #fefeffb0 #00000010 #00000010;
    position: relative;
    animation-name: loaderSpin;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes loaderSpin {
    to {
        transform: rotate(360deg);
    }
}

.footerFixed {
    min-height: 100vh;
    /* ←コンテンツの高さの最小値＝ブラウザの高さに指定 */
    position: relative;
    /* ←相対位置 */
    padding-bottom: 4rem;
    /* ←フッターの高さを指定 */
    box-sizing: border-box;
    /* ↑ヘッダーやフッターを含むすべての要素の高さ＝min-height:100vhになるように指定 */
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"] {
    -moz-appearance: textfield;
}


.selectbox-gray:focus {
    outline: 0px solid #303030;
}