﻿.btn {
  display: inline-block;
  vertical-align: top;
  padding: 2px 5px;
  background: yellow;
  color: #111111;
  border-bottom: solid 4px gray;
  border-radius: 4px;
  font-size: 22px;
}
.btn:active {
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
  border-bottom: none;
}
   .btn2 {
    display: inline-block;
    vertical-align: top;
    padding: 2px 5px;
    background: rgb(115, 249, 128);
    color: #111111;
    border-bottom: solid 5px gray;
    border-radius: 4px;
    font-size: 22px;
    /* font: size 12px; はだめ*/
   }
   .btn2:active {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    border-bottom: none;
   }  
   .btn3 {
    display: inline-block;
    vertical-align: top;
    padding: 2px 5px;
    background: lightcyan;
    color: #111111;
    border-bottom: solid 5px gray;
    border-radius: 4px;
    font-size: 22px;
   }
   .btn3:active {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    border-bottom: none;
   }  
   .btn4 {
    padding: 2px 5px;
    background: lightpink;
    color: #111111;
    border-bottom: solid 5px gray;
    border-radius: 4px;
    font-size: 22px;
   }
   .btn4:active {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    border-bottom: none;
   }     
   /* 以下　input の幅 */
   /* input.haba { width: 80px; } 140px:


  /* 以下　分数表示のcss */
  .bunsu{
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    }
    .bunsu span{
    display: block;
    }
    .bunsu span:nth-of-type(2){
    border-top: solid 3px #000;
    }
   .parent {
    position: fixed;
  } 
  
/* .canvas-wrap{
            width: 1000px;
            max-width: 100%;
            position: relative;
            padding: 0;
            box-sizing: content-box;
}
.canvas_warp:before{
            content:"";
            display: block;
            padding-top: 50%;
}
.canvas{
            position: absolute;
            left:0;
            top:50;
            border: 0;
            max-width:100%;
            box-sizing: content-box;
            padding: 0;
            margin: 0;
} */