/****************************
	* レイアウト・全体
	****************************/
	html,
	body {
		font-family: 'Noto Sans JP',"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
		font-weight:400;
		font-size: 62.5%;
		line-height: 170%;
		width: 100%;
		height:auto;
		margin: 0;
		padding: 0;
		letter-spacing: 1px;
		color: #333;
		background: #fff;
	}
	a {
		transition:0.5s;
	}
	.pc_only {
		display: block;
	}
	.sp_only {
		display: none;
	}
	aside {
		font-size: 1.8rem;
		color: #555;
		margin-left:1.6em;
	}
	aside p
	{
		font-size:0.95em;
		display: inline-block;
		text-indent: -0.7em;
	}
	aside p::before
	{
		content:"※";
		display: inline-block;
		padding-right:0.3em;
	}

	figure
	{
		margin:0;
		padding:0;
	}
	img
	{
		width:100%;
		height:auto;
		margin:0;
		padding:0;
		pointer-events: none;
	}

	article,section
	{
		width: 100%;
		padding:30px 0;
	}

	.wrap
	{
		position: relative;
		width: 1000px;
		margin: 0px auto 0px;
		text-align: center;
	}

	/****************************
	* ヘッダー
	****************************/
	header
	{
		margin:0px auto 0px;
		text-align:center;
		background:#fff;
	}
	header h1.wrap
	{
		display:flex;
		align-items: center;
		justify-content: space-between;
		width: 1000px;
		margin:auto;
		padding:50px 0px 50px 45px;
	}
	header h1 > figure
	{
		width:440px;
		aspect-ratio: 22 / 31;
		padding:0 0px;
		line-height: 1;
		border:1px solid rgba(237, 235, 238, 1);
	}
	header h1 > div
	{
		display: flex;
		flex-direction: column;
		align-items: center;
		width:450px;
		padding:120px 0px 0;
	}
	header h1 > div a img
	{
		width:50px;
		margin:30px 0px 0;
	}

	/****************************
	* フッター
	****************************/
	footer {
		font-size: 1rem;
		position: relative;
		z-index: 1;
		/* height: 50px; */
		padding: 5px 0;
		text-align: center;
		color: #fff;
		background: #013dd6;
		line-height: 1.3;
	}


	/****************************
	* main
	****************************/
	main
	{
		display: block;
	}

	/****************************
	* read
	****************************/
	.read h2
	{
		font-size:2.3rem;
		line-height: 1.6;
		letter-spacing: 0.1em;
		margin-bottom:45px;
	}
	.read p
	{
		font-size:1.8rem;
		line-height: 2;
		text-align: justify;
	}

	/****************************
	* spec
	****************************/
	.spec
	{
		margin:50px 0;
		padding:80px 0 100px;
		background:url(../images/book_info_bg.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}
	.spec .bookinfo
	{
		width:90%;
		margin:auto;
		padding: 45px 50px;
		background: #fff;
		font-size:1.8rem;
		line-height: 1.8;
		text-align: left;
	}
	.spec .bookinfo h3
	{
		font-size: 2.8rem;
		letter-spacing: 0.1em;
		font-weight: 600;
		margin-bottom: 1em;
	}
	.spec .bookinfo dl
	{
		display: flex;
		gap:0px;
		justify-content: flex-start;
		width:100%;
		margin:10px 0 0;
	}
	.spec .bookinfo dt
	{
		width:5em;
		text-align-last: justify;
		display: inline-block;
		font-weight: normal;
	}
	.spec .bookinfo dt::after
	{
		content:"：";
	}
	.spec .bookinfo .spec_wrap
	{
		display: flex;
		gap:30px;
		margin-top:45px;
	}
	.spec .bookinfo .spec_wrap > div
	{
		padding:30px 25px;
		background:#f1f5ff;
		position: relative;
		width:calc( ( 100% - 30px ) / 2);
	}
	.spec .bookinfo .spec_wrap > div h4
	{
		font-weight: normal;
		position: absolute;
		font-size:2.5rem;
		top:-1em;
	}
	.spec_inner .cover
	{
		/* max-width:255px; */
		max-width:330px;
		margin:0 auto 10px;
	}
	.spec_inner > p
	{
		font-size:1.4rem;
	}
	.spec_inner > ul
	{
		font-size:1.4rem;
	}
	.spec_inner > ul li
	{
		list-style-type: disc;
		margin:0 0 0.3em 1.3em;
		letter-spacing: 0;
	}
	.spec .bookinfo aside
	{
		display:block;
		margin:20px 0 0 1.8em;
	}

	/****************************
	* event
	****************************/
	.event
	{
		background: #fff;
		margin-bottom:80px;
	}
	.event h2
	{
		font-size: 3.5rem;
		line-height: 1.3;
		color: #000;
		font-weight: 600;
		padding: 30px 0px 32px;
		position: relative;
	}
	.event h3
	{
		font-size: 2.8rem;
		letter-spacing: 0.1em;
		font-weight: 500;
		line-height: 1.8;
	}
	.event ul
	{
		font-size: 2rem;
		margin:40px auto 50px;
		width:fit-content;
		max-width: 800px;
		text-align: left;
		display: flex;
		gap:30px;
		text-align: center;
		flex-wrap: wrap;
	}
	.event ul li
	{
		width: calc((100% - 30px) / 2);
		display: block;
	}
	.event ul li a
	{
		display: block;
		padding:0px 0 20px;
		border-left:1px solid #4574e9;
		border-bottom:1px solid #4574e9;
		/* border-radius: 999px; */
		color:#333;
		pointer-events: none;
	}
	.event ul li a:hover
	{
		background-color: #4574e9;
		color:#fff;
		text-decoration: none;
	}

	.event .btn
	{
		margin:0px auto 50px;
	}
	.event .btn a
	{
		font-size: 1.8rem;
		display:flex;
		justify-content: center;
		align-items: center;
		width: fit-content;
		min-width:320px;
		text-align: center;
		background: #DEDEFF;
		padding:10px 45px 13px 20px;
		line-height: 1;
		margin:auto;
		color:#333;
		font-weight: 700;
		margin-bottom:30px;
		clip-path: polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0% 50%);
		position: relative;
		letter-spacing: normal;
	}
	.event .btn a:after
	{
		content:url(../images/btn_arrow.svg);
		width:15px;
		position: absolute;
		right:18px;
		top:50%;
		transform: translate(0, -50%);
		transition: 0.2s;
	}

	.event .btn a:hover
	{
		text-decoration: none;
		color:#fff;
		background: #ADABFF;
	}
	.event .btn a:hover:after
	{
		right:12px;
	}

	.event_info
	{
		width:80%;
		margin:auto;
		padding:25px 30px;
		border:2px solid #DEDEFF;
		outline-offset: 5px;
		outline: 2px solid #ADABFF;
		text-align: left;
	}
	.event_info h3
	{
		font-family: 'Noto Sans JP',sans-serif;
		font-weight:bold;
		font-size:2rem;
		letter-spacing: normal;
		margin:0 0 20px 0;
	}
	.event_info > div
	{
		font-size:1.8rem;
		line-height: 1.8;
	}
	.event_info > div:not(:last-child)
	{
		border-bottom:1px dotted #ADABFF;
		margin-bottom:20px;
		padding-bottom:20px;
	}
	.event_info > div strong
	{
		font-size:1.8rem;
		display: block;
		width:fit-content;
		padding:5px 10px;
		margin-bottom:5px;
		background:#EEEBFF;
	}
	.event_info > div figure
	{
		max-width:548px;
		margin:10px auto 0;
	}

	/****************************
	* shop
	****************************/
	.shop
	{
		background: linear-gradient(rgba(255,255,255,0) 199px, #EAF5FF 199px);
		overflow-x: hidden;
		padding-bottom:70px;
		margin-top:-250px
	}
	.shop h2
	{
		position:relative;
		overflow:hidden;
		width:100%;
		height:199px;
	}
	.shop h2 img
	{
		position:absolute;
		left:50%;
		width:1920px;
		height:100%;
		transform: translate(-50%, 0);
	}
	.shop .wrap > aside
	{
		display: block;
		width: 80%;
		margin:20px auto 55px;
		text-align: left;
		font-size:1.8rem;
		line-height: 1.8;
	}
	.shop_wrap
	{
		width: 100%;
		margin: auto;
		display: flex;
		flex-wrap: wrap;
		gap:70px 30px;
		font-size:1.8rem;
		line-height: 1.8;
	}
	.shop_wrap > div
	{
		padding:35px 30px 20px;
		background:#fff;
		position: relative;
	}
	.shop_wrap > div.shop_container.wide
	{
		width:100%
	}
	.shop_wrap > div.shop_container
	{
		width:calc(( 100% - 30px ) / 2 );
	}
	.shop_wrap > div > h4
	{
		font-size: 2.8rem;
		position: absolute;
		top:-0.7em;
		left:50%;
		transform: translate(-50%, 0);
		width:100%;
		line-height:1.2;
		text-shadow: 3px 1px 0 #fff;
	}
	.shop_wrap > div > h4.indention
	{
		top:-1.7em;
	}
	.shop_container .inner
	{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}
	.shop_container .inner > div
	{
		text-align:center;
		margin:0 auto;
		width: 100%;
	}
	.shop_container .inner .tokuten p
	{
		font-size:2rem;
		text-align: left;
		letter-spacing: normal;
	}
	.shop_container .inner .tokuten p span
	{
		font-size:1.6rem;
	}
	.shop_container .inner .tokuten p strong
	{
		font-weight: bold;
		display: block;
		padding:0 0.5em;
		font-size:2.3rem;
	}

	.shop_container .inner.exile p
	{
		text-align: center;
		margin-bottom:20px;
	}
	.shop_container .inner.exile .tokuten p strong
	{
		display: inline-block;
	}
	.shop_container .inner > div
	{
		height:100%;
		display: flex;
		flex-direction: column;
	}
	.shop_container .inner .tokuten > aside
	{
		text-align: left;
	}
	.shop_container .inner .tokuten > aside p
	{
		font-size:0.8em;
	}
	.shop_container .inner.partition > div:first-child
	{
		width:57%;
		margin-right:2.5%;
		padding-right:2.5%;
		padding-top:20px;
		border-right:2px dotted #eaf5ff;
	}
	.shop_container .inner.partition > div:last-child
	{
		width:38%;
		padding-top:20px;
	}
	.shop_container .inner.partition > div:last-child .tokuten > p
	{
		margin-bottom:3.7em;
	}
	.shop_container .inner.partition > div:last-child .btn
	{
		margin-top:1em;
	}
	.shop_container .inner > div > aside
	{
		text-align: left;
		font-size: 0.8em;
	}

	.shop_container .inner .tokuten > p + figure
	{
		width:210px;
		height:210px;
		margin:20px auto 30px;
	}
	.shop_container .inner .tokuten > aside + figure
	{
		width:330px;
		height:230px;
		margin:20px auto 30px;
	}
	.shop_container .inner .tokuten figure img
	{
		width:100%;
		height:100%;
		object-fit: contain;
	}

	.shop_container .btn
	{
		text-align: center;
	}
	.shop_container .btn a
	{
		display:flex;
		justify-content: center;
		align-items: center;
		width: fit-content;
		min-width:320px;
		text-align: center;
		background: #eaf5ff;
		padding:10px 45px 10px 20px;
		line-height: 1;
		margin:auto;
		color:#333;
		font-weight: 700;
		margin-bottom:30px;
		clip-path: polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0% 50%);
		position: relative;
		letter-spacing: normal;
	}
	.shop_container .btn a:after
	{
		content:url(../images/btn_arrow.svg);
		width:15px;
		position: absolute;
		right:18px;
		top:50%;
		transform: translate(0, -50%);
		transition: 0.2s;
	}

	.shop_container .btn a:hover
	{
		text-decoration: none;
		color:#3D72A9;
	}
	.shop_container .btn a:hover:after
	{
		right:12px;
	}

	.shop_container .global .btn h6
	{
		font-size:0.8em;
		margin-bottom:10px;
		padding-left:20px;
		text-align: left;
	}