@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Myanmar&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
@import url('https://fonts.gstatic.com/s/googlesans/v14/4UaGrENHsxJlGDuGo1OIlL3Owp4.woff2') format('woff');

@font-face {
  font-family: 'googlesans';
  src: url('https://fonts.gstatic.com/s/googlesans/v14/4UabrENHsxJlGDuGo1OIlLU94YtzCwY.woff2') format('woff');
}
html{
  margin:none;
  display:block;
  box-sizing:border-box;
  height:100%;
}
body{
  font-family: roboto,"Noto Sans Myanmar UI",arial,sans-serif;
  vertical-align:middle;
  box-sizing:border-box;
  height:96%;
  position: relative;
}
.bigbox {
  color:#202124;
  display:block;
  box-sizing:border-box;
  font-family: roboto,"Noto Sans Myanmar UI",arial,sans-serif;
  border:1px solid #d6d6d6;
  border-radius:6px;
  width:450px;
  padding:44px 22px 71px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-　transform: translateY(-50%) translateX(-50%);
  font-size:15px;
  overflow:hidden;
  height:520px;
}
.title-box{
  text-align:center;
}
.login-title{
  display:inline-block;
  margin-top:10px;
  margin-bottom:8px;
  font-size:24px;
  font-family: roboto,"Noto Sans Myanmar UI",arial,sans-serif;
}
.text-box{
  all:initial;
  font-family: 'Roboto', sans-serif;
  display:block;
  height:54px;
  width:324px;
  padding:0px 16px 0px;
  font-size:17px;
  border-radius:3px;
  border:1px solid #d6d6d6;
  margin:36px auto 0px;
}
.text-box:focus{
  outline:2px solid #4285f4;
  outline-offset: -1px;
}
.mailaddres-details{
  position:fixed;
  bottom:294px;
  left: calc(50% - 166px);
  font-size:17px;
  background-color:#ffffff;
  padding:2px;
  transition: bottom 0.15s, font-size 0.15s;
  color:#737373;
}
.details{
  display:inline-block;
  padding:10px 24px 0px;
  height:30px;
  width:360px;
  font-size:15px;
  color:#737373;
}
.middle-detail{
  margin-top:44px;
}
.blue-link{
  color:#4285f4;
  text-decoration:none;
}
.button{
  display:inline-block;
  color:#ffffff;
  background-color:#4285f4;
  border:none;
  padding:8px 24px;
  border-radius:3px;
  cursor:pointer;
  transform:translate(280px,-24px);
}
.cover{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-　transform: translateY(-50%) translateX(-50%);
  background-color:#ffffff;
  width:1000px;
  opacity:0.5;
}
.icon{
  vertical-align:middle;
}
.toggle{
  cursor:pointer;
  margin-left:25px;
  color:black;
}
input[type=checkbox]{
  display:none;
}
.vr-check{
  display:inline-block;
  border:2px solid #5f6368;
  border-radius:2px;
  height:14px;
  width:14px;
  vertical-align:middle;
  cursor:pointer;
}
.vr-check-checked{
  display:inline-block;
  border:2px solid #5f6368;
  border-radius:2px;
  height:14px;
  width:14px;
  vertical-align:middle;
  cursor:pointer;
  
}
.mail-addres-preview{
  cursor:pointer;
  margin:auto auto;
  font-family: "googlesans",sans-serif;
  display:block;
  border:1px solid #d6d6d6;
  border-radius:15px;
  width:fit-content;
  padding:3px;
  color:#525252;
  font-size:15px;
}
.batsu {
  display: inline-block;
  vertical-align:middle;
  position: relative;
  width: 22px;
  height: 22px;
}
 
.batsu::before, .batsu::after { /* 共通設定 */
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.5px; /* 棒の幅（太さ） */
  height: 7px; /* 棒の高さ */
  background: #333000;
}
 
.batsu::before {
  transform: translate(150%,-50%) rotate(45deg);
}
 
.batsu::after {
  transform: translate(-150%,-50%) rotate(-45deg);
}
.lang-chose,.japanese,.triangle,.ft1,.ft2,.ft3{
  display:inline-block;
}
.triangle{
  position:absolute;
  left:40%;
}
.lang-chose{
  width:40%;
}
.ft1,.ft2,.ft3{
  padding:0 15px 0;
  font-size:12px;
}
.ft1{
  padding-left:60px;
}
.ft3{
  padding-right:0;
}
.footer{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(275px) translateX(-50%);
  width:440px;
  font-size:13px;
  color:#3e3e3e;
}
