.pgs-support-ui {
  touch-action: manipulation;
  font-size: 22px !important;
}

.pgs-support-ui svg {
  vertical-align: middle;
}

/* キーボード全体のスタイル */
.pgs-support-ui.app-footer {
  background-color: #ffffff;
  color: red;
  position: fixed;
  bottom: 0;
  z-index: 99999;
  left: 0px;
}

.pgs-support-ui.input-suggestion {
  width: 100%;
  min-height: 320px;
  z-index: 9999999;
}

.pgs-support-ui.backtap {
  width: 100%;
  height: 100%;
  position: fixed;
  display: block;
  top: 0;
  background-color: #FFFFFF01;
  z-index: 9999998;
}

.pgs-support-ui .gap-1 {
  gap: .25rem !important;
}

.pgs-support-ui .p-0 {
  padding: 0 !important;
}

.pgs-support-ui .mt-2 {
  margin-top: .5rem !important;
}

.pgs-support-ui .d-flex {
  display: flex !important;
}

.pgs-support-ui .vertical-box {
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  display: flex;
  margin: 1px;
}

.pgs-support-ui .mini {
  font-size: .975rem !important;
}

/* 各ボタンのスタイル */
.pgs-support-ui .pad {
    background-color: #cbd5e1;
    cursor: pointer;
    text-align: center;
    border-radius: 5px;
    color: #0f172a;
    height: 50px;
    line-height: 50px;
    border: none;
    border-bottom: 1px solid #adadad;
    /*font-size: 1.4rem;*/
    font-weight: 500;
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    margin: 2px;
}

.pgs-support-ui .double {
  height: 104px;
  line-height: 104px;
}

/* キーインプット */
.pgs-support-ui .keyInput {
  color: #b91c1c;
  font-size: 22px !important;
  line-height: 36px;
  min-height: 30px;
  display: block;
  text-align: center;
  overflow-wrap: anywhere;
  --tw-text-opacity: 1;
}

/* タイトル */
.pgs-support-ui .text-gray-700 {
    color: #4a5568;
}

.pgs-support-ui .keyPadTitle {
    font-size: 15px !important;
    border-bottom: 1px solid #efefef;
    color: gray;
    padding: 0 0 4px;
    text-align: center;
}

.pgs-support-ui .p-1 {
  padding: .25rem !important;
}

.pgs-support-ui .h-4 {
  height: 1.5rem;
}

.pgs-support-ui .w-4 {
  width: 1.5rem;
}

.pgs-support-ui .align-items-center {
  align-items: center !important;
}

.pgs-support-ui .justify-content-center {
  justify-content: center !important;
}

.layout_horizontal {
  display: flex;
  flex-direction: row;
}

.justify-content-between {
  justify-content: space-between !important;
}

/* キーインプット(i) */
.pgs-support-ui .ping-box {
  width: 1.5px;
  height: 15px;
  display: inline-block;
  background-color: rgba(37, 99, 235, .9);
  vertical-align: inherit;
}

.pgs-support-ui .ml-1 {
  margin-left: .1rem;
}

@keyframes pgs-support-ui-ping{0%{transform:scale(1);opacity:1}75%,100%{transform:scale(2);opacity:0}}

.pgs-support-ui .animate-ping {
  animation: pgs-support-ui-ping 1s cubic-bezier(1, 1, 1, 1) infinite;
}

.pgs-support-ui .border-r-2 {
  border-right-width: 2px;
}

/* 色 */
.pgs-support-ui .red {
  background-color: #fef2f2;
  color: #b91c1c;
  border-bottom: 1px solid #c4c1c1;
}

.pgs-support-ui .blue {
    background-color: #dbeafe;
    color: #1e40af;
    border-bottom: 1px solid #c4c1c1;
}

.pgs-support-ui .inputRed {
  color: #b91c1c;
}

.pgs-support-ui .inputBlue {
    color: #1e40af;
}

.pgs-support-ui .border-blue {
  border-color: rgba(37, 99, 235, .9);
}

.pgs-support-ui .mt-1 {
  margin-top: .25rem !important;
}

.pgs-support-ui .empty {
  background-color: rgba(0, 0, 0, 0);
  border-bottom: none;
}

.pgs-support-ui .assist {
  height: 32px;
  line-height: 32px;
  border-radius: 50px;
  margin-bottom: 4px;
}