
html, body {
    margin: 0;
    padding: 0;
    font-family: "Helvetica Neue", "Arial", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Meiryo", sans-serif; 
    background-color: #f0f2f5; 
    color: #333;
  }
  
  #container {
    background-color: rgb(255, 254, 242); 
    margin: 0 auto;
    width: 100%;
    max-width: 390px;
    padding-bottom: 30px; 
  }
  
  /* プロフィール*/
  .back-image {  
    position: relative;

  }

  #profile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom: 20px;
  }
  
  .circle {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 3px solid rgb(255, 254, 242);
  position: absolute;
  top: 75px;
  left: 50%;
  transform: translateX(-50%);
}
 
  .effect{
    width: 20%;  
  }
  #useeffect{
    width: 400px;
   display: flex;
    justify-content:space-evenly;
  }

  
  #username {
    position: absolute;
    top: 165px;
    margin: 6px 0 2px 0;
    font-size: 1.2em;
    font-weight: bold;
    color: #222;
  }
  
  #userid p {
    text-align: center;
    margin: 0;
    color: rgb(55, 65, 115);
    font-size: 0.9em;
  }
  
  #stats {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 15px;
  }
  .stat {
    text-align: center;
  }
  .stat .count {
    font-size: 1.1em;
    font-weight: bold;
    display: block;
    color: #222;
  }
  .stat .label {
    font-size: 0.85em;
    color: rgb(55, 65, 115);
  }
  
  /* 情報 */
  a.top_btn_block + a.top_btn_block .post-block {
    margin-top: 15px;
  }
  
  .photo-row {
    justify-content: center;
    align-items: stretch;
    gap: 6px;
    padding: 5px;
  }
  
  /* メイン写真 */
  .main-photo-top {
    display: block;
    margin-bottom: 12px; 
  }
  
  
  
 
  
  /*投稿*/
  .post-text-content {
    padding: 6px 12px 4px; 
  }
  
  .post-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 4px;
  }
  
  .h2txt {
    display: inline-block;
    font-size: 1em;
    margin: 0; 
    color: rgb(0,0,0);
    font-weight: 500; 
    width: 100%; 
  }
  
  .see-more {
    text-align: left;
    color: rgb(55, 65, 115);
    font-size: 0.9em;
    
  }
  
  .place {
    font-size: 0.85em;
    color: rgb(55, 65, 115);
    display: flex;
    gap: 4px;
  }
  .btncopy i {
    font-size: 0.9em;
  }
  
  .post-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.9em;
  }
  
  .info-left span {
    margin-right: 15px;
    color: rgb(55, 65, 115);
  }
  
  .info-left i {
    margin-right: 4px;
    color: #888;
  }

  .mark{
    width: 12%;
  }

  .location_on{
    width: 6%;
  }
  
    /*３枚写真*/
.sub-photo{
  border-radius: 15pt;
}
 
  a.top_btn_block {
    text-decoration: none;
  }
  

 .hedder{
    width: 380px;
    height: 54px;
    margin: 0px;
    padding: 5px;
    background-color: rgba(55, 65, 115, 1);
    position: fixed;
    bottom: 0px;
    display: flex;
    align-items: center;
 }

 #bottom{
   width: 380px;
   display: flex;
    justify-content:space-evenly;
 }

   .bar_icon{
   width: 40px;
   height: auto; 
 }

  .bar_icon1{
   width: 56px;
   height: 40px;

 }

 
  