@charset "utf-8";


/*基本設定-----------------------------------------*/
/* 隙間なく表示させるおまじない */
html, body { 
  margin: 0px;
  padding: 0px;
 }

/* ページ内全体の文字の設定と背景の設定 */
body {

  background-color: rgb(181, 181, 181);
  font-family: "Geologica", sans-serif;
  
}

/* 親要素 */
#container{

  background-color:white;
  margin: 0 auto ;
  width: 100%;
  max-width: 390px;
  height: 100%;

}

/* 親要素 */
#keyvisual{

  display: block;
  background-color: #A1B7D2;
  margin: 0 auto;
  width: 100%;
  max-width: 390px;
  height: 334.5px;
  
    
}

/* 親要素 */
#top {
   
  width: 95%;
  height: 54px;
  margin: auto;
  padding-top: 30px;
  display: flex;
  align-items: start; /* 垂直方向の中央揃え */
  vertical-align:top;
}

#top img {
  justify-self: start;
  margin-top: 10px;
}

#user {

  display: flex;
  flex-direction: column;
  align-items: center;
  padding-left: 89px;
  
} 

#username{
  font-size: 28px;
  font-weight:600 ;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 0,
    "SHRP" 0;
}

#userid{

  font-size: 15px;
  font-weight:600 ;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 0,
    "SHRP" 0;
  color: rgba(0, 0, 0, 50%);
  margin: 0.2em auto;
  display: inline;
}

#follow{

  padding-top: 28px;
  padding-left: 55px;
  padding-right: 55px;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
  color: #E0ECFA;

}

#follower,#followlist,#haime{

  font-size: 20px;
  font-weight:600 ;
  display: flex;
  flex-direction: column;
  align-items: center;


}

.nihongo{

  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
  font-style: normal;
  font-size: 11px;
  color: #E0ECFA;
}

.usericon{

  /* display: inline; */
  display: flex;
  justify-content: center;
  margin: 0 auto;
  margin-bottom: 0;
  
}

/* 親要素 */
.profile{

  width: 90%;
  margin: 0 auto;
  color: #A1B7D2;
  font-size: 13px;
}

.kousei{

  display: flex;
  width: 96%;
  margin: 0 auto;
  justify-content: space-between;
}

.kouseimei{

  display: grid;
  grid-template-columns: max-content;
  gap: 8px;
  font-size: 15px;
  font-weight: 500;
  color: #A1B7D2;
  padding-bottom: 8px;
}

.nakami{

  display: grid;
  grid-template-columns: max-content;
  gap: 8px;
  font-family: "Geologica", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: black;
  padding-bottom: 8px;

}

.report{
  width: 90%;
  margin: 0 auto;
  padding-bottom: 6px;
  color: #A1B7D2;
  font-size: 13px;
}

/* ーーーーー謎ーーーーー */
.report h2{
  color: #A1B7D2;
  /* font-size: 1.5em; */
}
.toukou img{

  width: 128px;
  height: 128px;

}

.toukou1,.toukou2,.toukou3{

  width: 100%;
  margin: 6% auto;
  background-color: rgba(239, 239, 239, 0.2);
  box-shadow: 2px 10px 15px -6px rgba(0, 0, 0, 0.2);
  display: flex;

}

.icons img{

  width: 16px;
  height: 16px;
  
}

.icons{
  display: grid;
  grid-template-columns: 16px;
  gap: 13px;
  margin: 29px auto;
  margin-left: 31px;
}

.honbun{

  font-family: "Geologica", sans-serif;
  font-size: 13px;
  font-weight: 550;
  color: black;
  display: grid;
  grid-template-columns: 117px;
  gap: 13px;
  margin: 29px auto;
  margin-left: 0;
}