@charset "utf-8";

html     ,
body     ,
article  ,
section  ,
div      ,
h1       ,
h2       ,
h3       ,
h4       ,
h5       ,
dl       ,
dt       ,
dd       ,
ul       ,
ol       ,
li       ,
p        ,
input    ,
select   ,
textarea {
	margin:0;
	padding:0;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
	color:#231815;
	font-size:15px;
    font-weight:500;
	font-feature-settings:"palt"1;
	line-height:2;
	letter-spacing:0.15em;
	-webkit-text-size-adjust:100%;
	border:none;
    text-align: center;
}

.en ,
footer small {font-family:"Oswald", sans-serif;}

html{margin: 0 auto;}

@media only screen and (max-width:640px){
    
    html     ,
    body     ,
    article  ,
    section  ,
    div      ,
    h1       ,
    h2       ,
    h3       ,
    h4       ,
    h5       ,
    dl       ,
    dt       ,
    dd       ,
    ul       ,
    ol       ,
    li       ,
    p        ,
    input    ,
    select   ,
    textarea {
        font-size:14px;
        letter-spacing:0.05em;
    }
}

ul ,
ol {list-style:none;}
li {list-style-position:outside;}

table {border-collapse:collapse;}
th,td {padding:0; text-align:left; vertical-align:top;}

a {color:#1e1e1e; text-decoration:none; transition: .2s;}
a:hover {opacity:.6;}

p {text-align:justify; text-justify:inter-ideograph;}

* {-webkit-appearance: none;}

::selection {background:#d2d2d2;}
::-moz-selection {background:#d2d2d2;}


header h1 img {
    margin:50px auto 0; 
    display:block; 
}

@media only screen and (min-width:641px){
    .sp { display:none !important;}
}

@media only screen and (max-width:640px){
    
    .pc { display:none !important;}
    header h1 img{
        max-width: 90%;}
}

/* main */

main {padding: 20px 0;}
main h2 {margin:0 0 30px; font-size:1.7rem;}
main p {text-align:center;}


/* book */

article {width:60%; margin:0 auto;}
article .book{display: flex; justify-content: center; margin-top: 30px;}
article .book img{width:80%; margin: 0 10px;}
article .book a{text-decoration: none; color: #e63764; position: relative;}
article .book a:hover{color: #EB7291;}
article .book a.sns1::after {
	content: '';
	position: absolute;
	bottom: -5px;
	left:0;
	width: 100%;
	height: 2px;
	background-color: #EB7291;
	transform: scaleX(0);
	transition: transform 0.3s;
}
article .book a.sns2::after {
	content: '';
	position: absolute;
	bottom: -5px;
	left:0;
	width: 100%;
	height: 2px;
	background-color: #EB7291;
	transform: scaleX(0);
	transition: transform 0.3s;
}
article .book a:hover::after {
	transform: scaleX(1);
}
article .book p {
	font-size: 1.5rem;
    font-weight: bold;
	text-align:center;
}

/* sns */
article .sns{
    margin: 50px auto 20px; 
    border: solid 1px #000;
    width: 400px;
    border-radius: 4px;
    padding: 5px 0;
}
article .sns a {text-decoration: none;}
article .sns img{width: 10%; padding-top: 5px;}
article .sns a p {text-align:center;}

@media only screen and (max-width:640px){
	
	article {width:90%;}
	article .book{display: block; margin-top: 10px;}
	article .book img{margin-top: 20px;}
	article .sns{
		margin: 30px auto 20px; 
		width: 300px;
		padding: 5px 0;
	}
	article .sns img{width: 10%; padding-top: 5px;}

}