@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:#003258;
background: url(../images/bg_ptn.png), linear-gradient(180deg, rgba(255, 195, 255, 1), rgba(149, 233, 243, 1));
}



a {
  text-decoration: none;
  color: #0625a1; 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{margin:120px auto 0 auto;}

#top img{width:100%; height:auto; max-width: 880px; display: block; margin:20px auto;}



p{margin: 1em;}

#about{width:90%; height:auto; max-width:840px; margin:1em auto; color:#FF278E; font-size:1.2em; background:#ffffac; border-radius: 16px; padding:.5em 1em;}


@media (min-width: 480px){
#item div{display: flex; align-items: center; justify-content: center;}
}

.itembox{background: #ffffac; padding:1px 3px; font-weight:bold; font-size:1.4em; line-height: 2em}
.itemname{color:#FF278E;}

@media (max-width: 480px){
#about{display: block;}
}

#about img{display: block;}
.clearfile{margin:1em auto; width:320px; height:auto;}

#item h2, #books h2, #list h2{text-align: center; padding:4px; background:#FF278E; border-radius: 24px; margin:.5em auto; color:#fff; width:8em;}

#item, #books, #list{width:90%; max-width:840px; border-radius: 16px; background: rgba(255,255,255, 0.6); margin:2em auto; padding:1em;}


@media (min-width: 480px){
#about{display: block;}
#books > div{display: flex; flex-wrap: wrap; justify-content:center; align-items: flex-start;}
#books article{width:200px;} 
    
}

#books article{margin:10px 15px; padding:10px; display: block;}

#books > div img{display: block; width:180px; height:auto; margin-bottom:10px;}
.bookstitle{font-weight: bold; color:#FF278E;}
.booksauther span, .booksill span{font-size:11px}

#list ul, #list li{margin:0; padding:0; list-style: none;}
#list li{display: inline-block; margin:.5em 1em; padding:2px 12px; background: #fff; border-radius: 16px;}

.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(255 255 135 / 0.8);

}

#page-top a:hover{
	background: rgb(255 255 135 / 1);
}