/*----------------------------------------------------
@File: テンプレートCSS以外に独自で追加したスタイル
---------------------------------------------------- */
a.external {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAVklEQVR4Xn3PgQkAMQhDUXfqTu7kTtkpd5RA8AInfArtQ2iRXFWT2QedAfttj2FsPIOE1eCOlEuoWWjgzYaB/IkeGOrxXhqB+uA9Bfcm0lAZuh+YIeAD+cAqSz4kCMUAAAAASUVORK5CYII=') no-repeat scroll right center transparent;
  padding-right: 13px;
}

a.external-menu {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAEt2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNS41LjAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iCiAgICB4bWxuczpleGlmPSJodHRwOi8vbnMuYWRvYmUuY29tL2V4aWYvMS4wLyIKICAgIHhtbG5zOnBob3Rvc2hvcD0iaHR0cDovL25zLmFkb2JlLmNvbS9waG90b3Nob3AvMS4wLyIKICAgIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIKICAgIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIgogICAgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIKICAgdGlmZjpJbWFnZUxlbmd0aD0iMTAiCiAgIHRpZmY6SW1hZ2VXaWR0aD0iMjAiCiAgIHRpZmY6UmVzb2x1dGlvblVuaXQ9IjIiCiAgIHRpZmY6WFJlc29sdXRpb249IjcyLjAiCiAgIHRpZmY6WVJlc29sdXRpb249IjcyLjAiCiAgIGV4aWY6UGl4ZWxYRGltZW5zaW9uPSIyMCIKICAgZXhpZjpQaXhlbFlEaW1lbnNpb249IjEwIgogICBleGlmOkNvbG9yU3BhY2U9IjEiCiAgIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiCiAgIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIKICAgeG1wOk1vZGlmeURhdGU9IjIwMjEtMDItMTJUMTA6MDg6MzErMDk6MDAiCiAgIHhtcDpNZXRhZGF0YURhdGU9IjIwMjEtMDItMTJUMTA6MDg6MzErMDk6MDAiPgogICA8eG1wTU06SGlzdG9yeT4KICAgIDxyZGY6U2VxPgogICAgIDxyZGY6bGkKICAgICAgc3RFdnQ6YWN0aW9uPSJwcm9kdWNlZCIKICAgICAgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWZmaW5pdHkgUGhvdG8gKEZlYiAgMSAyMDIxKSIKICAgICAgc3RFdnQ6d2hlbj0iMjAyMS0wMi0xMlQxMDowODozMSswOTowMCIvPgogICAgPC9yZGY6U2VxPgogICA8L3htcE1NOkhpc3Rvcnk+CiAgPC9yZGY6RGVzY3JpcHRpb24+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgo8P3hwYWNrZXQgZW5kPSJyIj8+AMr47gAAAYBpQ0NQc1JHQiBJRUM2MTk2Ni0yLjEAACiRdZHPK0RRFMc/8xAxolAWFpOwGr9rYqOMhJI0Rvm1efNm3oyaH6/3ZtJkq2wVJTZ+LfgL2CprpYiU7JQ1sUHPefPUSObczj2f+733nO49F5RwUktZ5T2QSmfN0FjQNze/4Kt8QqGaJrrxq5plDE9PT1LS3m/xOPG606lV+ty/VhONWRp4qoSHNMPMCo8LT65kDYe3hBu1hBoVPhH2m3JB4RtHj7j87HDc5U+HzXBoBJR6YV/8F0d+sZYwU8LyctpSyZz2cx/nJd5YenZGYqt4CxYhxgjiY4JRRgjQy6DMATrpo0tWlMjvKeRPkZFcTWaDPCbLxEmQxS9qTqrHJOqix2QkyTv9/9tXS+/vc6t7g1DxaNuv7VC5CV8btv1xYNtfh1D2AOfpYn5mHwbeRN8oam17ULcGpxdFLbINZ+vQfG+oplqQysQVXYeXY6idh4YrqF50e/azz9EdhFflqy5hZxc65Hzd0jeGJWf0bdFUQAAAAAlwSFlzAAALEwAACxMBAJqcGAAAAINJREFUKJGlkVEKxDAIBcelN8qd7JnMmfRM7kcJbZPu0rQDQhB5GROhRzOHHkAVuez/o5inmmfPz0tuoZmlC50JXFAfhrWU50Kon0yanPluOrey+mUYupWaTwV+2sEUIoIasFaAgCoSMPnDh5Wb2WY8vu2UIYAWSHsSs7MAyBrvUg58AdankMXjeGy2AAAAAElFTkSuQmCC') no-repeat scroll right center transparent;
  padding-right: 13px;
}

/* flexbox */
.flex-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; /* flexbox */
  align-content: space-around;
}
.flex-container img {
  flex: 0 0 auto;
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  object-fit: scale-down;
}
.flex-container .img-icon{
  width: 128px;
  height: 128px;
  margin-right: 16px;
}
.flex-container .flex-item a h4:hover{
  color: #10b3d6;
}

/* アプリケーション情報 */
.app-info {
  margin-top: 18px;
}
.app-info ul {
  list-style: none;
}
.app-info ul li {
  padding-left: 1em;
  text-indent: -1em;
}
.app-info ul li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f071";
  font-weight: 900;
  color: #ff8c00;
  padding-right: 8px;
}

/* ダウンロードアイコン＆アニメーション */
.icon-wrap {
  margin: 8px 8px 8px -4px;
  padding-right: 4px;
  box-sizing: border-box;
  position: relative;
  width: 100%;
  height: 100%;
}
/* 矢印の受け皿アイコン */
.icon-download {
  box-sizing: border-box;
  position: relative;
  display: block;
  width: 1.75rem;
  height: 0.8rem;
  margin: auto;
  border: solid 0.3rem #06a8cb;
  border-top: none;
}
.icon-download:before, .icon-download:after {
  content: '';
  box-sizing: border-box;
  display: block;
  position: absolute;
  animation: icon-bounce .5s infinite alternate;
}
/* 矢印の棒部分アイコン */
.icon-download:before {
  box-sizing: border-box;
  left: 0.30rem;
  top: -0.6rem;
  width: 0.5rem;
  height: 0.6rem;
  background: #06a8cb;
}
/* 矢印の先端アイコン */
.icon-download:after {
  box-sizing: border-box;
  left: 0.05rem;
  top: -0.125rem;
  width: 0;
  height: 0;
  border-left: solid 0.5rem transparent;
  border-right: solid 0.5rem transparent;
  border-top: solid 0.5rem #06a8cb;
}
@keyframes icon-bounce {
  from {
    transform: translateY(-5px);
  }
  to {
    transform: translateY(0);
  }
}

.app-version {
  font-size: 1em;
}

.app-version .logo {
  width: 16px;
  height: 16px;
}

.app-download {

}
.app-download button {
  margin-top: 8px;
  border-radius: 0;
}
.app-download .os-icon {
  width: 86px;
  height: 86px;
  margin: 16px;
}
.app-download .download-icon {
  width: 16px;
  height: 16px;
}
.app-download .small {
  font-size: 0.75em;
}