@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;700;800&family=Zen+Kaku+Gothic+New:wght@400;700&display=swap');


body{
font-size:16px;
line-height:1.6;
font-family:'Zen Kaku Gothic New', sans-serif,"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo; margin:0;
padding:0;
color:#000;
background:url(../images/bg_ill.jpg);
  background-size: cover;
background-repeat: no-repeat;
background-position: center;
    background-attachment:fixed;
}


a {
  text-decoration: none;
  color: #a564f2; transition: all 300ms 0s ease;
}

a:hover{position:relative;
top:1px;
}



.pc{display: block;}
.smp{display: none;}

@media (max-width: 480px){
.pc{display: none;}
.smp{display: block;}
body{font-size:14px;}
}

section,article{margin:0;　padding:0; box-sizing: border-box;}
h1,h2,h3,h4,h5{margin:0; padding:0; font-weight:700;}
header{padding:0; margin:0; box-sizing: border-box;}

#top, #about, #list{width:100%; max-width: 960px; margin:0 auto; padding:0;}

#top{margin:0 auto;}

#top img{width:100%; height:auto; display: block; margin:0;}


p{margin: 1em;}

#about{font-size:1.2em; background-image: linear-gradient(90deg, rgba(255, 0, 120, 1), rgba(165, 100, 242, 1)); padding:1em;}

#about p{background: #fff; border-radius: 12px; padding:1em; margin:auto; max-width:640px;}

#list{padding:1em; text-align: center;}


#list ul, #list li{margin:0; padding:0; list-style: none;
}
#list li{ background: #fff; border-radius: 16px; border:solid 1px #a564f2;padding:1em; font-size:1.4em; margin:1em auto;}
#list li span{font-size:.7em; color:#ff0078; padding:0 4px;}
#list li a img{width:240px; height:auto; display: block; margin:3px auto;}


@media (min-width: 480px){
#list li{  
display: flex; justify-content: space-between; align-items: center; 
    }
}




.books h3{font-size:1.5em; line-height: 1.3em; color:#ff0078; padding-top:1rem;}

.books h4,.books h5,.books h6{ display: inline-block; font-size:1em;
padding:.2em 0;}

.books h4, #newrelease h5{font-weight: 700;}
.books h6{font-weight: 400;}

.books {
display: flex; /* 横並び */
flex-direction: column;
margin:2rem auto;
width:100%;
max-width:780px;
width:90%; max-width:840px; border-radius: 16px; background: rgba(255,255,255, 0.8); padding:1em;
}

.books>div {
display: contents; 
}
.books p{margin:1em 0;}

@media not all and (max-width: 768px){   
.bookcover{margin:0;}    
.books{
justify-content: space-between; 
align-items: flex-start;
flex-wrap: wrap;
flex-direction:row;
}  
.books h4,.books h5,.books h6{margin-right:1em;
padding:1em 0;}
    
.books>div {
display:block;
width:65%;
    } 
.books p{margin:0 0 1em 0;}

.books .link a.btn__sample, .books .link a.btn__buy{width:180px; margin-right:.5em;}     
}



.copyright{text-align: center; font-size:12px; margin-top:3em;}





.share-button{display: flex;
    justify-content: center;
    margin:2vw auto;
    background: transparent;
}

.caption{font-size:12px;}


/*page-top リンクの形状*/
#page-top a{

	background-color:rgb(165 100 242 / 0.8);

}

#page-top a:hover{
	background: rgb(165 100 242 / 1);
}


