@charset "UTF-8";
/*-----------------------------------------------------------------*/	
/*----------------------------------------------------------共通設定*/	

html {
  font-size: clamp(10px, calc(9px + 1.25vw), 18px);
}
#main_uramiya img{width:100%;}
body{
  margin: 0;
  background-image: 
    url('../img/bg.jpg');        /* 背面（下にくる）空画像 */
  background-position: center;         /* 空画像は中央に配置 */
  background-repeat: no-repeat;
  background-attachment: fixed; /* 空画像は固定、人物画像は通常スクロール */
  background-size:  cover;                 /* 空画像は全体をカバー */
    overflow-x: hidden;  /* 横スクロール禁止 */
  overflow-y: auto;    /* 縦スクロールは必要なとき表示 */
}
header {
    width: 100%;
    background: #FFF;
    position: relative;
    z-index: 11;
}
#wrapper {
width: 100%;
display: flex;
flex-wrap: wrap;align-items: end;
}
#pcLeft {
  position: fixed;
  top: 104px; /* ヘッダーの下から配置 */
  bottom: 0;
  right: calc(50% + 250px);
  width: calc(50vw - 250px);

  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.chara1 img {
  display: block;
  max-width: 100%;
  max-height: calc(100vh - 104px);
  object-fit: contain;
}

#main_uramiya{width:500px;margin:0 auto;background:url(../img/bg_sp.jpg) center top;  
  background-attachment: fixed;  text-align: center; color:#fff; border-left:1px solid #ccc; border-right:1px solid #ccc; 
  padding-bottom:0.5rem; position: relative; z-index:1;}
#main_uramiya #top, .kv1, .kv2, .kv3{width:100%; aspect-ratio: 700 / 1130; position: relative; overflow: hidden;}

#main_uramiya #top .kv{width:100%; position: absolute;}
#main_uramiya #top .kv1 .copy1{width:80%;margin:1rem auto 0;}
#main_uramiya #top .kv1 .koma1{width:65%;margin:0 auto 0;}
#main_uramiya #top .kv1 .copy2{width:90%;margin:0 auto 0;}

#main_uramiya #top .kv2 .copy1{position:absolute; width:90%;margin:0 auto;top:1rem; left:0; right:0; z-index:1;}
#main_uramiya #top .kv2 .chara1{ position:absolute;  width:120%;top:4.8rem; left:-38%;z-index:2;}
#main_uramiya #top .kv2 .chara1 img {
  display: block;width: 100%;}
.character__silhouette {
  position: absolute;
  inset: 0;
  filter: brightness(0);
}
#main_uramiya #top .kv2 .copy2{position:absolute; width:27%; top:6rem; right:0.5rem;z-index:3;}
#main_uramiya #top .kv2 .copy3{position:absolute; width:28%; bottom:2%; right:5rem;z-index:4;}

#main_uramiya #top .kv3 .copy1{position:absolute; width:20%; top:13rem; right:5rem;z-index:4;}
#main_uramiya #top .kv3 .bg{position: absolute; width:100%;z-index:1;}
#main_uramiya #top .kv3 .copy2{position:absolute; width:20%; top:13rem; left:5rem;z-index:4;}
#main_uramiya #top .kv3 .logo1{position:absolute; width:86%; bottom:2%; left:1.5rem;z-index:4;}

/*---新刊コミックス---*/	
#comics{width:100%;padding:1rem; display:flex; flex-wrap:nowrap;background:#ff007e;}
#comics .comicsText{display:flex; margin-left:0.5rem; flex-direction: column; color:#000;
  text-align: center; font-size:1.5rem;font-weight:bold;}
  #comics .comicsText P{margin-bottom:0.5rem;}
    #comics .comicsText P.midashi{font-size:1.1em;}
    #comics .comicsText P.title{color:#FFFF00;}
    #comics .comicsText a{background:#3af9e6; padding:0.2rem; letter-spacing: 0.2rem; font-size:0.8em;margin-bottom:0.5rem;}
    #comics .comicsImg{width:30%;}

/*---ノベルティ---*/	
#main_uramiya section#novelty{width:100%;}
#main_uramiya section#novelty .kv{width:100%; position:relative;aspect-ratio: 500 / 655; overflow: hidden;}

#main_uramiya section#novelty .chara{position:absolute; top:0;z-index:2; }
#main_uramiya section#novelty .item1{width:60%; top:3rem; left:0; right:0; margin:0 auto; z-index:11; }
#main_uramiya section#novelty .item2{width:86%; top:19rem; left:0; right:-5%; margin:0 auto; z-index:11; }


#main_uramiya section#novelty .chara1{width:60%; right:-0.5rem; }
#main_uramiya section#novelty .chara2{width:60%;left:-2rem; top:10rem; }
#main_uramiya section#novelty .chara3{width:60%; left:-1.5rem;top:-0.6rem; }

#main_uramiya section#novelty .copy1{width:80%; top:16rem; left:0; right:0; margin:0 auto; z-index:21; }
#main_uramiya section#novelty .copy2{width:86%; top:auto;bottom:0.5rem; left:0; right:0; margin:0 auto;}

/*---SALE情報---*/	
.saleBg{width:100%; margin:0 auto; position: relative; z-index:0; }

/*---デジタル版アコーディオン---*/	
#main_uramiya #digital ul{display:flex; flex-wrap:wrap; }
#main_uramiya #digital ul li{width:23%;margin:1%;}
#main_uramiya #digital ul li span{width:100%; font-size:0.7rem;display:block; background:#FFF; color:#0066cc; padding:0.2rem; box-sizing: border-box;}
#main_uramiya #digital .more{display:none;}

#main_uramiya #digital .comicList{
  padding:0.5rem; font-size:1rem; font-weight:bold; margin-bottom:0.5rem;
background: linear-gradient(to right, #7800cc, #c4018a);
}

.btn100{ width:90%; margin:0 auto; display:block; font-size:1.1rem; letter-spacing:0.2rem; 
  padding:0.8rem; font-weight:bold; margin-bottom:0.5rem; color:#FFF;
background: linear-gradient(to right, #7800cc, #c4018a);
}


ul.caution{text-align:left;width:90%; margin:0 auto; }
/*---button初期化---*/	
button.nav-open {
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: inherit;
  background: none;
  font: inherit;
  line-height: inherit;
  cursor: pointer;
}
button.nav-open, .btn_inner {width:100%;background:#fff;margin-top:0.5rem;color:#0066cc;font-size:0.8rem;padding:0.1rem;}

footer{width:100%;}




@media screen and (max-width: 667px) {
    
#main_uramiya{width:100%;margin:0 auto; box-shadow:none;overflow: hidden;}
    
#pcLeft{display:none;}
}