body {
                background-color: rgb(235, 246, 239);
                font-family: 'Ubuntu', sans-serif;
            }
            /*吹き出し用追加CSS*/


td{
  line-height: 25px; 
 }

.balloon {
  width: 100%;
  margin: 10px 0;
  overflow: hidden;
}

.balloon .faceicon {
  float: left;
  margin-right: -50px;
  width: 40px;
}

.balloon .faceicon img{
  width: 100%;
  height: auto;
  border-radius: 50%;
}
.balloon .chatting {
  width: 100%;
  text-align: left;
}
.says {
  display: inline-block;
  position: relative; 
  margin: 0 0 0 50px;
  padding: 10px;
  max-width: 250px;
  border-radius: 12px;
  background: #edf1ee;
}

.says:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 3px; 
  left: -19px;
  border: 8px solid transparent;
  border-right: 18px solid #edf1ee;
  -webkit-transform: rotate(35deg);
  transform: rotate(35deg);
}
.says p {
  margin: 0;
  padding: 0;
}

/*以下、③右側の緑コメント*/
.mycomment {
    text-align: right;
  margin: 10px 0;
}
.mycomment p {
  display: inline-block;
  position: relative; 
  margin: 0 10px 0 0;
  padding: 8px;
  max-width: 250px;
  border-radius: 12px;
  background: #30e852;
  font-size: 15px:
}

.mycomment p:after {
  content: "";
  position: absolute;
  top: 3px; 
  right: -19px;
  border: 8px solid transparent;
  border-left: 18px solid #30e852;
  -webkit-transform: rotate(-35deg);
  transform: rotate(-35deg);
}
            .main {
                background-color: #FFFFFF;
                width: 400px;
                height: auto;
                margin: 7em auto;
                border-radius: 1.5em;
                padding-bottom: 1em;
                box-shadow: 0px 11px 35px 2px rgba(0, 0, 0, 0.14);
            }
            
            .sign {
                padding-top: 40px;
                color: rgb(85, 170, 95);
                font-family: 'Ubuntu', sans-serif;
                font-weight: bold;
                font-size: 23px;
            }
            
            .un {
                width: 76%;
                color: rgb(38, 50, 56);
                font-weight: 700;
                font-size: 14px;
                letter-spacing: 1px;
                background: rgba(136, 126, 126, 0.04);
                padding: 10px 20px;
                border: none;
                border-radius: 20px;
                outline: none;
                box-sizing: border-box;
                border: 2px solid rgba(0, 0, 0, 0.02);
                margin-bottom: 50px;
                margin-left: 46px;
                text-align: center;
                margin-bottom: 27px;
                font-family: 'Ubuntu', sans-serif;
            }
            
            form.login {
                padding-top: 40px;
            }
            
            .pass {
                width: 76%;
                color: rgb(38, 50, 56);
                font-weight: 700;
                font-size: 14px;
                letter-spacing: 1px;
                background: rgba(136, 126, 126, 0.04);
                padding: 10px 20px;
                border: none;
                border-radius: 20px;
                outline: none;
                box-sizing: border-box;
                border: 2px solid rgba(0, 0, 0, 0.02);
                margin-bottom: 50px;
                margin-left: 46px;
                text-align: center;
                margin-bottom: 27px;
                font-family: 'Ubuntu', sans-serif;
            }
            
            .un:focus,
            .pass:focus {
                border: 2px solid rgba(0, 0, 0, 0.18) !important;
            }
            
            .submit {
                cursor: pointer;
                border-radius: 5em;
                color: #fff;
                background: linear-gradient(to right, rgb(39, 176, 78), rgb(64, 251, 86));
                border: 0;
                padding-left: 40px;
                padding-right: 40px;
                padding-bottom: 10px;
                padding-top: 10px;
                font-family: 'Ubuntu', sans-serif;
                margin-left: 35%;
                font-size: 13px;
                box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.04);
            }
            
            .goto {
                cursor: pointer;
                border-radius: 5em;
                color: #fff;
                background: linear-gradient(to right, rgb(39, 176, 78), rgb(64, 251, 86));
                border: 0;
                padding-left: 40px;
                padding-right: 40px;
                padding-bottom: 10px;
                padding-top: 10px;
                font-family: 'Ubuntu', sans-serif;
                margin-left: auto;
                font-size: 13px;
                box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.04);
            }
            
            .createaccount {
                text-shadow: 0px 0px 3px rgba(117, 117, 117, 0.12);
                color: rgb(191, 231, 190);
                padding-top: 15px;
            }
            
            a {
                text-shadow: 0px 0px 3px rgba(117, 117, 117, 0.12);
                color: rgb(132, 223, 141);
                text-decoration: none
            }
            
            @media (max-width: 600px) {
                .main {
                    border-radius: 0px;
                }
            }