@charset "UTF-8";
/*ーーーーーーーーーー
フォントサイズ指定
ーーーーーーーーーーー*/
html {
  /*font-size: 62.5%;*/
  font-size: 10px;
  transition: .15s; }
  @media (max-width: 850px) {
    html {
      font-size: 9px; } }

body {
  /*font-size: 1.6rem;*/
  /*font-size: 10px; */
  transition: .15s; }

/*ーーーーーーーーーー
変更ボタン
ーーーーーーーーーーー*/
:root {
  --pink-to-yellow: #ff82a5;
  --to-bgColor: white;
  --to-white: black; }

button:hover {
  cursor: pointer; }

.btn_wrap {
  /*margin: 20px;*/
  margin: 6px 24px 0 0; }
  .btn_wrap span {
    color: #333;
    font-size: 14px;
    letter-spacing: 0; }

.btn_wrap button {
  font-size: 14px;
  padding: 5px 10px;
  border: 1px solid #666;
  border-radius: 6px;
  background: transparent;
  /*color: var(--to-white);*/ }
  .btn_wrap button.sizeBtn {
    width: 50px;
    text-align: center;
    background: #fff; }
    .btn_wrap button.sizeBtn.is_active {
      background: #727171;
      color: #fff; }
  .btn_wrap button#bg-white {
    background: #fff;
    color: #333; }
  .btn_wrap button#bg-black {
    background: #000;
    color: #fff; }
  .btn_wrap button#bg-blue {
    background: #0411c4;
    color: #fff; }
  .btn_wrap button#bg-green {
    background: #d9efd4;
    color: #333; }
  .btn_wrap button#bg-yellow {
    background: #ffff00;
    color: #333; }

.btn_wrap button.is_active {
  /*background: var(--pink-to-yellow);
  color: var(--to-bgColor);*/ }