@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Klee+One&display=swap');
body {
    margin: 0;
    padding: 0;
    font-family: meiryo, 'MS PGothic', 'Hiragino Kaku Gothic Pro', sans-serif;
    -webkit-text-size-adjust: 100%;
    background-color:#FFFFEC;
    height:100vh;
    }
    div,p,form,input,textarea,dl {
    margin: 0;
    padding: 0;
    /* font-family: 'M PLUS Rounded 1c', sans-serif; */
    font-family: 'Ubuntu', sans-serif;
    background-color: transparent;
    
    }
    div {
        /* border:1px solid #c1dad7; */
        /* background:#fff; */
        /* background-color:#FFFFEC; */
        padding:6px 6px 6px 12px;
        color:#4f6b72;
    }
    .header
    {
        position: absolute;
        top:0;
        left:0;
        width:100%;
        height:10%;
        background:linear-gradient(90deg,transparent,#dadac5);
        padding: 0;
        border:none;
    }
    .header h2
    {
        position: absolute;
        font-size: 2.5em;
        bottom:0;
        right: 10%;
        color: rgba(0,0,0,0.2);
        font-weight: 700;
        letter-spacing: -2px;
        font-family: 'Ubuntu', sans-serif;
    }
    .header .logo
    {
        background: transparent;
        border:none;
        position: absolute;
        bottom:0;
        left:0;
        margin-left: 5%;
        padding: 0;
    
    }
    .header .logo img
    {
       height: 60px;
       filter:opacity(0.4);
    }
    .wrap {
        text-align:center;
        background-color:#FFFFEC;
      border:none;
    }
    .bottom{
        color:red;font-size:10px;
        /* background-color:#fff; */
    }
    .main_table { 
                    border:3px inset rgba(2, 122, 108, 0.397);
                    border-radius: 10px;
                    font-size:15px;
                    margin-left:auto;
                    margin-right:auto;
                    margin-top:100px;
                    width: 80%;
            background:#FFFFEC;
                }
    
    .tbcontent {
                background: #fff;
                color:#232323;
                border-style:solid;
                border:1px;
            }	
    
    input, textarea, select {
    font-size: 0.9em;
    line-height: 1.0em;
    padding: 2px;
    margin: 0px 0px 0px 0px;
    display: inline-block;
    white-space: nowrap;
    border-radius: 20px;
    border:1px solid #c1dad7;
    text-shadow: 0px 0px 1px #ccc;
    margin: 0px 0px 0px 2px;
    }
    p
    {
    font-size: 1.0em;
    font-weight: normal;
    font-style: normal;
    line-height: 1.4em;
    }
    .scale-table div {
    text-align: center;
    padding: 0px 4px 0px 4px;
    }
    span
    {
      position:relative;
    }
    .title
    {
      text-align:left;
      width:30%;
      border:none;
    }
    .contents
    {
      display:flex;
      border-bottom: 1px solid rgba(0,0,0,0.2);
      align-items: center;
    }
    .btn,
    input[type="submit"],
    input[type="reset"],
    input[type="button"]
    {
      padding:5px;
      background:#888;
      color:#fff;
      box-shadow: inset 2px 2px 3px rgba(255, 255, 255, .6),
                    inset -2px -2px 3px rgba(0, 0, 0, .6);
    }
    .toptitle
    {
      display:flex;
      align-items:flex-start;
      background:transparent;
    }
    .toptitle a 
    {
      text-decoration:none;
      font-size:1.5em;
      font-weight:500;
      color:#888;
    }
    .toptitle a:hover
    {
      color:orange;
    }
    
    @media (max-width: 992px){
    .main_table { 
      font-size:10px !important;
    }
    textarea, select {
    font-size: 0.7em !important;
    }
    p {
    font-size: 0.7em !important;
    
    }
    .tbhead {
      font-size:10px !important;
    }
    input{
      font-size:10px !important;
    }
    div{
        text-align:left !important;
    }
    }