#bg{
z-index: -1;
position: fixed;
top:0;
left: 0;
width: 100vw;
height: calc(100vh - 60px);
}


@media (min-width: 767px){

#h{
background: rgba(255,255,255,.8);
width: 750px;
position: absolute;
left: 50%;
transform: translate(-50%,0);
}

#h nav a {
color: #000;
}
}



main{
display: flex;
justify-content: space-between;
padding: 20px;
}
.main{
width: 670px;
}

#info{
width: 240px;
}

.cont_header h1{
display: flex;
justify-content: space-between;
}


.cont_header h1 a{
text-shadow: none;
font-size: .8rem;
color: #fff;
}


@media (max-width: 767px){
  #bg{
    display: none;
  }
  
  main,
  .main,
  .info{
    display: block;
    width: 100%;
    padding: 0;
  }
  .girls{
    width: 100%;
    padding: 0;
  }
  
}


#newface.pc .girl{
width: 100%;
}

@media (max-width: 767px){

  #newface .girl:nth-of-type(n+9),
  #newface .girl .info ul,
  #newface .girl .time,
  #newface .girl .info div{
    display: none;
  }
  #newface .girls{
    width: 100%;
    overflow-x: scroll;
  }
  
  #newface .girls .inner{
  }
}





#diary .body{
display: flex;
flex-wrap: wrap;
padding-top: 10px;
justify-content: space-between;
}

#diary article{
width: calc(100% / 4 - 10px);
background-size: contain;
background-repeat: no-repeat;
padding: 0 0 0 0;
line-height: 1;
position: relative;
margin-bottom: 20px;
}
#diary time{
font-size: .8rem;
}

#diary article:before{
content: "";
display: block;
margin-top: 20px;
}


#diary article .thumb{
display: block;
width: 35%;
position: absolute;
top:0;
right: 0;
background-size: cover;
border-radius: 100px;
border:solid 1px #fff;
}

#diary article .thumb:before{
content: "";
display: block;
padding-top: 109%;
}


#diary article .body{
display: block;
line-height: 1.5;
width: 100%;
position: absolute;
bottom: 0;
left: 0;
padding: 10px;
background: rgba(255,255,255,.8);
}

#diary article .body time{
display: block;
}

#diary article .body a{
display: none;
}

#diary article h2{
font-weight: normal;
font-size: .8rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

@media (max-width: 767px){
  #diary article .body{
    padding: 0px 5px;
  }
  #diary .body h2,
  #diary .body time{
    font-size: .7rem;
  }
  #diary article{
    width: calc(100% / 3 - 5px);
  }
  
  #diary article:nth-of-type(n+7){
    display: none;
  }
  #spHeader h1 i{
    display: block;
  }
}



#scheduleGirls .inner{
gap:0;
}

#scheduleGirls .girl{
width: calc(100% / 5);
}
#scheduleGirls .girl .info{
padding: 5px;

}

#scheduleGirls .girl .info *{
font-size: .7rem;
}
#scheduleGirls .girl .time{
font-size: .8rem;
}

#scheduleGirls .girl .size{
white-space: nowrap;
}

@media (max-width: 767px){
  
  #scheduleGirls .girl{
  width: calc(100% / 3);
  }
  
  #scheduleGirls .girl .time{
    font-size: .7rem  !important;
  }
  #scheduleGirls .girl .info{
    padding: 0 3px;
  }
  #scheduleGirls .size{
    display: none;
  }
}






#stanbygirl .inner{
background: #eee;
}

#stanbygirl .sub_title{

text-align: center;
margin: 10px auto;
width: auto;
height: 34px;
color: white;
margin-bottom: 14px;
font-size: 18px;
display: table;
background-color: #f40d8e;
border-radius: 5px;
padding: 10px;
line-height: 1;

-webkit-border-radius: 5px;
}

#stanbygirl .sub_title a{
color: #fff;
text-decoration: none;
}


#stanbygirl .cont_header h1{
display: block;
background: #fff url(//www.cityheaven.net/img/shopimg/gradient_black.png);
font-weight: bold;
line-height: 34px;
height: auto;
font-size: 16px;
background-size: 100% 100%;
background-position: bottom center;

text-align: center;
font-size: 34px;
color: #f40d8e;
line-height: 1;
padding-top: 16px;
margin-bottom: 15px;
font-weight: bold;

text-shadow: none;

}

#stanbygirl .girl{
background: #fff;
}
#stanbygirl .girl .ladys-detail{
padding: 5px;
}

#stanbygirl .girl .txt{
text-align: center;
color: #f00;
}
#stanbygirl .girl a{
color: #000;
text-decoration: none;
font-size: .8rem;
}

  
@media (max-width: 767px){
  #stanbygirl .cont_header h1{
        background: none;
        color: #ff0;
        padding: 15px 10px;
        font-size: 1rem;
        text-align: left;
        
  }
  #stanbygirl .sub_title{
    display: none;
  }
  #stanbygirl .inner{
    background: transparent;
  }
  #stanbygirl .girl{
    background: transparent;
    width: 22vw;
    box-sizing: border-box;
    margin: 0 5px;
    margin-bottom: 10px;
    padding: .1%;
  }
  
    
  /*
  ======================================================================
  
  #soon
  
  ======================================================================
  */
  
  #stanbygirl{
  width: 100%;
  margin: 0 auto;
  overflow-x: hidden;
  }
  
  #stanbygirl .body{
  overflow-x: scroll;
  overflow-y: hidden;
  /* IE, Edge 対応 */
  -ms-overflow-style: none;
  /* Firefox 対応 */
  scrollbar-width: none;
  }
  #stanbygirl .body::-webkit-scrollbar {
   display:none;
  }
  
  
  #stanbygirl .inner{
  display: flex;
  }
  
  #stanbygirl article.girl a{
  display: block;
  color: #fff;
  text-decoration: none;
  }
  
  
  #stanbygirl article.girl .ladys-detail h3,
  #stanbygirl article.girl .txt{
  font-size: 3.26vw;
  text-align: center;
  line-height: 100%;
  }
  
  #stanbygirl article.girl{
  width: 22vw;
  box-sizing: border-box;
  margin: 0 5px;
  margin-bottom: 10px;
  padding: .1%;
  }
  
  #stanbygirl article .title{
  display: block;
  }
  
  #stanbygirl .girls-photo{
        position: relative;
        border: solid 1px #fff;
        flex: 0 0 14%;
        aspect-ratio: 1 / 1;
        border-radius: 50%;
        overflow: hidden;
        background: #000;
        }
  
  #stanbygirl article img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  
  #stanbygirl .ladys-detail p{
    display: none;
  }
  

  
}



#event .ev{
background: #eee;
}

#event .ev h1{
font-size: .8rem;
}
#event .ev .body{
padding: 10px;
font-size: .8rem;

}

@media (max-width: 767px){
.shopinfobox-buttons-box {
    padding: 6px 3px;
/*  background: rgba(255,255,255,0.8);*/
    margin-bottom: 8px;
    border-radius: 3px;
}
.shopinfobox-buttons-wrap {
    clear: both;
    display: flex;
    justify-content: space-between;
}
.shopinfobox-buttons-wrap:first-child{
/*  margin-bottom: 6px;*/
}
.shopinfobox-buttons-wrap:nth-child(2){
    margin-top: 6px;
}

a.shopinfobox-button {
    border: 1px solid #a3a3a3;
    color: #333;
    width: 100%;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    text-align: center;
    background: -ms-linear-gradient(top,#fff,#e1e1e1);
    background: -moz-linear-gradient(top,#fff,#e1e1e1);
    background: -webkit-gradient(linear,center top,center bottom,from(#fff),to(#e1e1e1));
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#FFFFFF,EndColorStr=#E1E1E1);
    display: block;
    font-weight: bold;
    padding: 5px 0;
    text-align: center;
    box-sizing: border-box;
    margin: 0 3px;
}
a.shopinfobox-button.is-active {
    background: -webkit-gradient(linear,center top,center bottom,from(#e6e6e6),to(#dcdcdc));
    box-shadow: 0px 1px 1px rgba(0,0,0,0.2) inset;
}
.shopinfobox-button-text-wrap {
    display: inline-block;
    padding-left: 32px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: auto 100%;
}
a.shopinfobox-button.m-one-row .shopinfobox-button-text-wrap {
    padding: 8px 0 4px 32px;
}
a.shopinfobox-button.m-one-row.m-small .shopinfobox-button-text-wrap {
    padding: 3px 0 2px 22px;
}
/* ↓ プラチナメール マイヘブン受信仕様変更 @SC 2021/08/31 */
a.shopinfobox-button.m-one-row.is-platinum .shopinfobox-button-text-wrap {
    padding: 0;
}
/* ↑ プラチナメール マイヘブン受信仕様変更 @SC 2021/08/31 */
.shopinfobox-button-text-wrap.m-telicon {
    background-image: url(//img.cityheaven.net/img/icon/keep/icon-tel-o.png);
}
.shopinfobox-button-text-wrap.m-reserveicon {
    background-image: url(//img.cityheaven.net/img/icon/keep/icon-reserve-o.png);
}
div.shopinfobox-buttons-wrap a.m-keep {
    display: none;
}
.shopinfobox-button-text-wrap.m-keep {
    background-image: url(//img.cityheaven.net/img/icon/keep/icon-star.png);
}
.shopinfobox-button-text-wrap.m-like {
    background-image: url(//img.cityheaven.net/img/icon/keep/icon-heart.png);
}
.shopinfobox-button-text-wrap.m-mail {
    background-image: url(//img.cityheaven.net/img/button/smartphone/mymailbtn.png);
}
.shopinfobox-button-text-wrap.m-yen {
    background-image: url(/images/yen.png);
}
.shopinfobox-button-text-wrap.m-trophy {
    background-image: url(/images/trophy.png);
}
/* ↓ プラチナメール マイヘブン受信仕様変更 @SC 2021/08/31 */
.is-platinum .shopinfobox-button-text-wrap.m-like {
    background-image: none;
}
/* ↑ プラチナメール マイヘブン受信仕様変更 @SC 2021/08/31 */

span.shopinfobox-button-text {
    display: block;
    line-height: 15px;
    font-size: 13px;
    color: #555;
    text-align: left;
}
span.shopinfobox-button-text.m-small {
    font-size: 11px;
    line-height: 12px;
    font-weight: normal;
}
a.shopinfobox-button.m-one-row.m-small .shopinfobox-button-text-wrap span.shopinfobox-button-text {
    font-size: 11px;
    white-space: nowrap;
}
.informaiton {
    position: fixed;
    top: -30px;
    left: 0;
    width: 100%;
    height: 30px;
    box-sizing: border-box;
    padding: 5px;
    color: #fff;
    line-height: 20px;
    font-size: 12px;
/* ↓ 女の子プロフィールデザイン変更 2022/05/24 */
    /* z-index: 1000; */
    z-index: 1100;
/* ↑ 女の子プロフィールデザイン変更 2022/05/24 */
    text-align: left;
}
.information-name {
    display: inline-block;
    max-width: 40%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}
.information-status {
    display: inline-block;
    vertical-align: middle;
}

/* ↓ 女の子系 */
.shopheader-buttons {
    clear: both;
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}
body a.shopheader-button,
body a.shopheader-button:link,
body a.shopheader-button:visited{
    position: relative;
    display: block;
    width: 100%;
    height: 40px;
    padding: 8px 0;
    box-sizing: border-box;
    border: 1px solid #eee;
    border-radius: 4px;
    color: #555;
    background: #fff;
    box-shadow: 0 2px 0 #cecece;
}
body a.shopheader-button.m-keep{
    display: none;
    margin-right: 8px;
    border-left: 4px solid #ffc13c;
}
body a.shopheader-button.m-like{
    border-left: 4px solid #ff2b53;
}
a.shopheader-button.m-keep.is-active {
    box-shadow: 0 0px 0 #cecece;
    background: #fff7e7;
    top: 2px;
}
a.shopheader-button.m-like.is-active {
    box-shadow: 0 0px 0 #cecece;
    background: #fff0f3;
    top: 2px;
}
.shopheader-button-icon,
.shopheader-button-text{
    height: 100%;
    vertical-align: middle;
}
span.shopheader-button-text {
    font-size: 12px;
    font-weight: bold;
    color: #555;
}


}


@media (max-width: 767px){
  #event .ev .body{
    display: none;
  }
}


@media (max-width: 767px){
  
  #spHeader{
    text-align: center;
    padding: 10px;
  }
  #spHeader h1,
  #spHeader .info{
    color: #fff;
    font-size: .8rem;
  }
  
  #spHeader ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 10px;
  }
  #spHeader li{
    width: calc(100% / 2 - 10px);
    margin-bottom: 10px;
  }
  #spHeader li{
    width: calc(100% / 3 - 10px);
  }
  
  #spHeader li a{
    display: block;
    width: 100%;
    padding: 10px 0;
    background: #ddd;
    text-decoration: none;
    color: #000;
    border-radius: 5px;
    font-size: .8rem;
  }
  
  #spHeader li{
    padding: 5px 0;
  }
  
  #spHeader .icn{
    background: #fff;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 35px;
    margin-right: 5px;
    padding: 3px;
  }
  #spHeader .icn:before{
    content: "";
    display: block;
    padding-top: 100%;
  }
  #spHeader i.i{
    position: absolute;
    top:50%;
    left: 50%;
    color: #000;
    transform: translate(-50%,-50%);
  }
  
  #spHeader i.i i,
  #spHeader i.i span{
    color: #fff;
    font-size: 1.5rem;
  }
  
  #spHeader li .icn{
    background: #f8860a;
    color: #fff;
  }
  
  #spHeader li:nth-of-type(n+3) .icn{
    width: 15px;
  }
  #spHeader li:nth-of-type(n+3) i.i i,
  #spHeader :nth-of-type(n+3) i.i span{
    font-size: 1.2rem;
  }
  #spHeader li:nth-of-type(3) .icn{background: #ee0;}
  #spHeader li:nth-of-type(4) .icn{background: transparent;}
  #spHeader li:nth-of-type(4) i.i i{color: var(--anc)}
  #spHeader li:nth-of-type(5) .icn{background: transparent;}

#spTop {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.spTop-track {
  display: flex;
  transition: transform 0.3s ease;
  will-change: transform;
}

.spTop-track .ev {
  flex: 0 0 100%;
  min-width: 100%;
}

.spTop-track .ev img {
  width: 100%;
  height: auto;
  display: block;
}

/* ドットインジケーター */
#spTop-dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  padding: 6px 0;
}

#spTop-dots span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ccc;
  display: block;
  cursor: pointer;
}

#spTop-dots span.on {
  background: var(--accent, #f40d8e);
}
}