@charset "utf-8";

.htMigoro2{
  position:absolute;
  z-index: 10;
  padding:4px 6px 3px;
  background-color:#FFF;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  text-align: center;
  font-weight: bold;
  margin-left:135px;
}
#map .htMigoro2{color:var(--a6)}
#no1 .htMigoro2{color:var(--a4)}
#no2 .htMigoro2{color:var(--a5)}
#no3 .htMigoro2{color:var(--a2)}


/*SP only */
@media screen and (max-width:599px){
  .pub .snsBox{
    margin-top:.3em
  }
  .htMigoro2{
    font-size:.85em;
    top:0;left:0;
  }
  .htMigoro2 span.htJiki:after{
    content:"：";
  }
}

/*TB以上 */
@media screen and (min-width:600px){
  .htMigoro2{
    top:auto;top:-20px;left:10px;
    display:flex;
    flex-wrap:wrap;
    align-content:center;
    justify-content:center;
    width:8em;
    height:8em;
    border-radius:8em;
  }
  .htMigoro2 span.htJiki{
    display:inline-block;
    padding:2px 10px 1px;
    margin-bottom:8px;
    color:#FFF;
    border-radius:100px;

  }
  #no1 .htMigoro2 span.htJiki{background-color:var(--a4)}
  #no2 .htMigoro2 span.htJiki{background-color:var(--a5)}
  #no3 .htMigoro2 span.htJiki{background-color:var(--a2)}
  .htMigoro2 span.htKara{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    width:100%;
    writing-mode: vertical-rl;
  }
}
