@charset "UTF-8";

body article{
	max-width: 100vw;
	padding: 0 0 120px;
}
body article section{
	margin: 0 auto 50px;
	overflow-x: hidden;
}
body article section .inner{
	max-width: 660px;
	margin: 0 auto;
}
body article p,
body article li,
body article dt,
body article dd{
	line-height: 180%;
}
body article figure,
body article ul{
	margin: 0;
	padding: 0;
}
body article img{
	max-width: 100%;
}
body article a{
	text-decoration: none;
}

body header#globalHeader ul{
	flex-grow: 1;
	margin: 0 0 0 10px;
}
@media screen and (max-width: 420px) {
	body header#globalHeader ul{
		flex-grow: 0;
		margin: 0 5px;
	}
}
body header#globalHeader ul.hnav{
	flex-grow: 0;
	margin: 0;
}
/***********************************************************
	footer
***********************************************************/
body footer{
	position: relative;
	padding: 60px 0;
	background: #E72406 url("../_img/picturebooks/bg_footer.png") center top repeat-x;
	text-align: center;
}
body footer p.pagetop{
	display: none;
	position: absolute;
	top: -30px;
	right: 10px;
	z-index: 999;
}
body footer p.pagetop.fixed{
	position: fixed;
	top: auto;
	bottom: 10px;
}
body footer p.pagetop a{
	display: block;
	width: 50px;
	height: 50px;
	background-color: #ff9300;
	background-image: linear-gradient(0deg, #ff9300 0%, #ff010c 100%);
	border-radius: 25px;
	text-align: center;
	line-height: 50px;
}
body footer p.pagetop a img{
	vertical-align: middle;
	transform: translateY(-2px);
}
body footer p.btn{
	width: 260px;
	margin: 0 auto 35px;
}
body footer p.btn a{
	display: block;
	background: #fff;
	border-radius: 30px;
	line-height: 60px;
	color: #E72406;
	font-size: 14px;
	text-decoration: none;
}
body footer small{
	color: #fff;
}
/***********************************************************
	.kv
***********************************************************/
body article .kv h2{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	height: 197px;
	padding: 30px 0 0;
	background: url("../_img/picturebooks/bg_kv.png") center center no-repeat;
	background-size: 3000px auto;
	color: #fff;
	font-size: 26px;
	line-height: 140%;
	text-align: center;
}
body article .kv h2:before{
	content: " ";
	position: absolute;
	left: calc(50% - 21px);
	top: 28px;
	width: 42px;
	height: 34px;
	background: url("../_img/picturebooks/ico_books.svg") center center no-repeat;
}
body article .kv figure{
	position: relative;
	height: 610px;
	margin: -35px auto 30px;
}
body article .kv figure svg{
	position: absolute;
	left: calc(50% - 480px);
	top: 0;
	z-index: 2;
}
body article .kv figure img{
	position: absolute;
	z-index: 3;
}
body article .kv figure img:nth-of-type(1){
	left: calc(50% + 555px);
	top: -27px;
}
body article .kv figure img:nth-of-type(2){
	left: calc(50% + 315px);
	top: 20px
}
body article .kv figure img:nth-of-type(3){
	left: calc(50% + 250px);
	top: 530px
}
body article .kv figure img:nth-of-type(4){
	left: calc(50% + 430px);
	top: 395px
}
body article .kv figure img:nth-of-type(5){
	right: calc(50% + 310px);
	top: 525px;
}
body article .kv figure img:nth-of-type(6){
	right: calc(50% + 500px);
	top: 195px;
}
body article .kv figure img:nth-of-type(7){
	right: calc(50% + 302px);
	top: 8px;
}
body article .kv figure img.under{
	z-index: 1;
	top: 445px;
	right: calc(50% + 402px);
}
body article .kv p{
	margin: 0 0 20px;
}
body article .kv p:last-of-type{
	margin-bottom: 0;
}
/***********************************************************
	nav.table
***********************************************************/
body article nav.table{
	width: 576px;
	height: 393px;
	margin: 0 auto 40px;
	background: url("../_img/picturebooks/bg_table.png") center center no-repeat;
	background-size: 100% auto;
}
body article nav.table .inner{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}
body article nav.table .inner h3{
	margin: 0 auto 20px;
	font-size: 16px;
}
body article nav.table .inner ul li{
	position: relative;
	margin: 0 0 10px;
	padding: 0 0 0 25px;
	background: url("../_img/picturebooks/ico_table01.png") left 4px no-repeat;
	background-size: 16px auto;
}
body article nav.table .inner ul li:nth-child(even){
	background-image: url("../_img/picturebooks/ico_table02.png");
}
body article nav.table .inner ul li:last-child{
	margin-bottom: 0;
}
body article nav.table .inner ul li a{
	color: #000;
}
/***********************************************************
	section.contents
***********************************************************/
body article section.contents{
	margin-bottom: 90px;
}
body article section.contents h3{
	position: relative;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 750px;
	height: 122px;
	margin: 0 auto 35px;
	padding: 30px 0 0;
	background: url("../_img/picturebooks/tit_contents01.png") center center no-repeat;
	background-size: 750px auto;
	color: #fff;
	font-size: 26px;
	line-height: 140%;
	text-align: center;
	z-index: 2;
}
body article section.contents > figure{
	position: relative;
	width: 750px;
	margin: -65px auto 35px;
	border-radius: 0 0 100px 100px;
	overflow: hidden;
	z-index: 1;
}
body article section.contents dl{
	position: relative;
	padding: 40px 30px;
	margin: 30px auto 0;
}
body article section.contents dl:before,
body article section.contents dl:after{
	content: " ";
	position: absolute;
	width: 660px;
	height: 17px;
	background: url("../_img/picturebooks/line_contents01.png") center center no-repeat;
	background-size: 662px auto;
	left: 0;
	top: 0;
}
body article section.contents dl:after{
	top: auto;
	bottom: 0;
	transform:rotate(180deg);
}
body article section.contents dl dt{
	margin: 0 0 15px;
}
body article section.contents dl dd{
	margin: 0 0 10px;
	padding: 0 0 0 20px;
	background: url("../_img/picturebooks/ico_contents01.png") 0 6px no-repeat;
	background-size: 12px auto;
}
body article section.contents dl dd:last-of-type{
	margin: 0;
}
body article section.contents dl dd a{
	color: #000;
}
body article section.contents ul{
	display: flex;
	flex-wrap: wrap;
	margin: 30px auto 0;
}
body article section.contents ul li{
	margin: 0 10px 10px 0;
}
body article section.contents ul li a{
	display: block;
	padding: 0 20px;
	background: #FF7869;
	border-radius: 18px;
	line-height: 36px;
	color: #fff;
}
body article section.contents p.btn{
	width: 410px;
	margin: 80px auto 0;
}
body article section.contents p.btn a{
	display: block;
	background: #fff;
	border: #FF7869 2px solid;
	border-radius: 30px;
	line-height: 54px;
	text-align: center;
	color: #000;
}
/* other color */
body article section.contents#contents01,
body article section.contents#contents04{
	background-image: url("../_img/picturebooks/deco08.png"),url("../_img/picturebooks/deco09.png");
	background-repeat: no-repeat,no-repeat;
	background-position: calc(50% - 560px) 80px,calc(50% + 270px) 585px;
	background-size: 473px auto,640px auto;
}
body article section.contents#contents02 h3,
body article section.contents#contents05 h3{
	background-image: url("../_img/picturebooks/tit_contents02.png");
}
body article section.contents#contents03 h3{
	background-image: url("../_img/picturebooks/tit_contents03.png");
}
body article section.contents#contents06 h3{
	background-image: url("../_img/picturebooks/tit_contents06.png");
}
body article section.contents#contents02 dl:before,
body article section.contents#contents02 dl:after,
body article section.contents#contents05 dl:before,
body article section.contents#contents05 dl:after{
	background-image: url("../_img/picturebooks/line_contents02.png");
}
body article section.contents#contents03 dl:before,
body article section.contents#contents03 dl:after,
body article section.contents#contents06 dl:before,
body article section.contents#contents06 dl:after{
	background-image: url("../_img/picturebooks/line_contents03.png");
}
body article section.contents#contents02 dl dd,
body article section.contents#contents05 dl dd{
	background-image: url("../_img/picturebooks/ico_contents02.png");
}
body article section.contents#contents03 dl dd,
body article section.contents#contents06 dl dd{
	background-image: url("../_img/picturebooks/ico_contents03.png");
}
body article section.contents#contents02 ul li a,
body article section.contents#contents05 ul li a{
	background: #ffb30f;
}
body article section.contents#contents03 ul li a,
body article section.contents#contents06 ul li a{
	background: #78B48C;
}
body article section.contents#contents02 p.btn a,
body article section.contents#contents05 p.btn a{
	border-color: #FFC700;
}
body article section.contents#contents03 p.btn a,
body article section.contents#contents06 p.btn a{
	border-color: #78B48C;
}
/***********************************************************
	div.more
***********************************************************/
body article div.more{
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin: 0 auto 90px;
	width: 556px;
	height: 284px;
	padding: 25px 0 0;
	background: url("../_img/picturebooks/bg_more.png") center center no-repeat;
	background-size: 100% auto;
}
body article div.more p{
	margin: 0 0 15px;
	font-size: 18px;
	text-align: center;
}
body article div.more p.btn{
	width: 180px;
	line-height: 40px;
	font-size: 16px;
}
body article div.more p.btn a{
	display: block;
	background: #FC7979;
	border-radius: 20px;
	color: #fff;
}
body article div.more p.btn a span{
	padding: 0 0 0 22px;
	background: url("../_img/picturebooks/ico_more.svg") left center no-repeat;
}
/***********************************************************
	section.author
***********************************************************/
body article section.author{
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 750px;
	height: 1308px;
	padding: 0 50px;
	margin-bottom: 0;
	background: url("../_img/picturebooks/bg_author.png") center center no-repeat;
	background-size: 100% auto;
}
body article section.author .profile{
	display: flex;
	justify-content: space-between;
	padding: 40px 30px;
	margin: 0 0 40px;
	background: #fff;
	border-radius: 20px;
}
body article section.author .profile figure{
	width: 165px;
}
body article section.author .profile figure img{
	border-radius: 100px;
}
body article section.author .profile .text{
	width: calc(100% - 190px);
}
body article section.author .profile .text h3{
	margin: 0 0 15px;
	font-size: 20px;
}
body article section.author .profile .text h3 span{
	margin: 0 0 0 10px;
	font-size: 16px;
}
body article section.author .profile .text p{
	line-height: 180%;
	font-size: 14px;
}
body article section.author > h3{
	padding: 0 0 0 40px;
	margin: 0 0 15px;
	background: url("../_img/picturebooks/ico_books.svg") left center no-repeat;
	background-size: 28px auto;
	color: #fff;
	font-size: 18px;
	line-height: 180%;
}
body article section.author .books{
	padding: 30px;
	background: #fff;
	border-radius: 20px;
}
body article section.author .books .info{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 0 30px;
}
body article section.author .books .info figure{
	width: 165px;
}
body article section.author .books .info figure img{
	box-shadow: 0 3px 6px 0 rgba(0,0,0,0.16);
}
body article section.author .books .info .text{
	width: calc(100% - 190px);
	color: #FF669E;
}
body article section.author .books .info .text h4{
	margin: 0 0 15px;
	font-size: 18px;
	line-height: 140%;
}
body article section.author .books .info .text h4 a{
	color: #FF669E;
}
body article section.author .books > p{
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 180%;
}
body article section.author .books > p:last-of-type{
	margin: 0;
}