



*				{ box-sizing:border-box; font-family:"Hiragino Kaku Gothic ProN", Meiryo, sans-serif; }
body			{ font-size:14px; padding:0; margin:0; color:#444; }

/* -------------------------------------*
	回りこみ解除
 * -------------------------------------*/
.clearfix:after		{ display: block; clear: both; height: 0px; visibility: hidden; content: "."; }
.clearfix			{ min-height: 1px; /* IE6、7対策 */ }
* html .clearfix	{ height: 1px; /*¥*//*/	/* MAC IE5.x対策 */ height: auto; overflow: hidden; }


/* --------------------------------------------------------------------------*

	ページ定義

 * --------------------------------------------------------------------------*/

.page_wrapper	{ width:1024px; margin:0 auto; }
.page_wrapper2	{ width:820px; margin:0 auto;  }



/* --------------------------------------------------------------------------*

	共通定義

 * --------------------------------------------------------------------------*/

.ta-c		{ text-align:center; }
.mincho		{ font-family:"ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; }
.mgn-l		{ margin-left:1em; }
.mgn-xl		{ margin-left:2em; }
.mgn-r		{ margin-right:1em; }

.fxl		{ font-size:24px; }
.fl			{ font-size:20px; }
.fm			{ font-size:18px; }
.fs			{ font-size:14px; }
.fxs		{ font-size:12px; }

.kugiri		{ padding:1.2em 0 1.2em 2em; letter-spacing:3em; text-align:center; color:#ffcc00; font-size:20px; }
.ul_marker	{ background: linear-gradient(transparent 70%, #ffff99 70%); }

h1			{ margin:2em 0 1.5em 0; line-height:1.2em; }
h2			{ margin:2.5em 0 1.5em 0; line-height:1.2em; }
img			{ max-width:100%; }
img.cover	{ border:1px #ccc solid; }
h1.mincho	{ font-size:50px; }
h2.mincho	{ font-size:26px; }

p.catch		{ font-size:18px; line-height:1.8em; }

div.kugiri	{ border-top:2px dashed #999; transform: rotate(-5deg); }
div.sepa	{ background:url(../images/bg_kugiri.svg) center bottom no-repeat; background-size:1920px; height:120px; }

/* --------------------------------------------------------------------------*

	最上段ナビ

 * --------------------------------------------------------------------------*/

#nav			{ background:#000; color:#fff; font-size:12px; padding: .5em 1em; }
#nav span		{ color:#D4AB4F; }
#nav a			{ color:#fff; text-decoration:none; }
#nav a:hover	{ color:#D4AB4F; }


/* --------------------------------------------------------------------------*

	メイン

 * --------------------------------------------------------------------------*/

#header	{
	z-index:1;
	min-width:100%;
	background:#efefef;
/*	padding:60px 0px 60px 0px;
*/	padding:60px 0px 0px 0px;
	box-sizing:border-box;
	background: linear-gradient(57deg, #1B553D, #000000, #782225);
	color:#fff;
/*
	background: linear-gradient(57deg, #313137, #377fdc, #fcd104);
*/
	background-size: 600% 600%;
/*	margin-bottom:120px;
*/	margin-bottom:0px;
	position: relative;

	-webkit-animation: bg_gradation 13s ease infinite;
	-moz-animation: bg_gradation 13s ease infinite;
	animation: bg_gradation 13s ease infinite;
}
/*
#header .wrapper					{ background:url(../images/bg_head.png) center bottom no-repeat; }
*/
#header .wrapper					{ background:url(../images/bg_head.svg) center bottom no-repeat; background-size:1920px; }
#header .page_wrapper				{ padding: 40px 10px 160px 10px; position:relative; }
#header .page_wrapper .humming_bird	{ position:absolute; top:20px; right:0; }
#header .catch						{ font-size:32px; padding:0; margin:0; line-height:1.4em;  }

#header ul				{ list-style:none; padding:0; margin:0; width:100%; }
#header li				{ float:left; width:400px; padding:0; margin:0; }
#header li + li			{ float:right; width:580px; padding:0 0 0 30px; margin:0; }

#header h1.title				{ font-size:28px; line-height:30px; margin:1.2em 0 .3em 0; border-top:1px #efefef solid; padding:1em 0 0 0; letter-spacing:0.1em; color:#D4AB4F; }
#header h1.title span			{ display: block; font-size:16px; margin-left:1em; }
#header h1.title span:before	{ content: '― '; }
#header p.exp					{ padding:10px 10px 15px 10px; text-align:justify; font-size:13px; line-height:1.8em; }
#header div.price				{ text-align:right; font-size:16px; }
#header table					{ margin:1.8em 0; }
#header td						{ vertical-align:top; font-size:14px; }
#header td + td					{ padding-left:40px; width:160px; }
#header td p					{ line-height:1.6em; }
#header .code					{ text-align:right; font-size:12px; }

#header h2					{ margin:1em 0 .5em 0; font-size:16px; }
#header h2 span				{ display:block; }
#header a					{ display:inline-block; width:240px; background:#ff6699; color:#fff; padding:.6em 0; margin-top:.6em; text-align:center; text-decoration:none; border-radius:3px; }
#header a:hover				{ background:#000; }
#header a + a				{ margin-left:10px; }

#header .btn_block			{ background:#fff; padding:10px 20px 20px 20px; border:2px solid #ccc; border-radius:10px; }
#header .btn_block .price	{ font-size:14px; font-weight:bold; }
#header .btn_block table	{ margin:0; width:100%; color:#333; }
#header .btn_block td		{ width:50%; vertical-align:middle; }
#header .btn_block td + td	{ padding-left:1.6em; }
#header .btn_block td p		{ line-height:1.6em; }

@-webkit-keyframes bg_gradation {
	0%{background-position:0% 74%}
	50%{background-position:100% 27%}
	100%{background-position:0% 74%}
}
@-moz-keyframes bg_gradation {
	0%{background-position:0% 74%}
	50%{background-position:100% 27%}
	100%{background-position:0% 74%}
}
@keyframes bg_gradation { 
	0%{background-position:0% 74%}
	50%{background-position:100% 27%}
	100%{background-position:0% 74%}
}


/* --------------------------------------------------------------------------*

	特集的なブロック

 * --------------------------------------------------------------------------*/

#special					{ margin-bottom:120px; }
#special p					{ margin:60px 110px 0 110px; line-height:2.0em; font-size:16px; text-align:justify; }
#special .slider-pro		{ background:#000; /*transform:rotate(-5deg);*/ }
#special .slider-pro:before	{ height:30px; content:''; display:block; background:url(../images/film_frame.png) bottom repeat-x; }
#special .slider-pro:after	{ height:30px; content:''; display:block; background:url(../images/film_frame.png) top repeat-x; }

#special .bg-rising			{ padding:50px 0 5px 0; background:url(../images/rising_circle.svg) center no-repeat; background-size:450px; }
#special .bg-rising h1		{ background:#fff; padding:20px 0; }


/* --------------------------------------------------------------------------*

	共感部

 * --------------------------------------------------------------------------*/

#empathy			{ z-index:999; margin-top:-120px; position: relative; }
#empathy h1			{ margin-top:0; }


/* 問題点 */
.problem			{ width:800px; margin:0 auto; }
.problem table		{ width:800px; }
.problem table th	{ width:260px; }
.problem table td	{ width:540px; }
.problem p			{ width:70%; padding:.5em 1em; font-size:16px; border:solid 1px #ccc; border-radius:10px; }
.problem p + p		{ margin:30px 0 0 26%; }
.problem table +table	{ margin-top:-20px; }


/* --------------------------------------------------------------------------*

	説明

 * --------------------------------------------------------------------------*/
.img_guideline		{ margin:40px 0; }

.merit p.catch		{ font-size:16px; line-height:1.8em; }
.merit ul			{ list-style:none; padding:0; margin:60px 0; }
.merit li			{ float:left; width:260px; padding:0; margin:0; }
.merit li div		{ color:#CC0000; font-size:16px; font-weight:bold; text-align:center; padding-top:1em; }
.merit li p			{ padding:1em 0; margin:0px; }
.merit li + li		{ margin-left:20px; }


/* --------------------------------------------------------------------------*

	目次

 * --------------------------------------------------------------------------*/
#book_index 					{ font-size:16px; padding:3em 0; }
#book_index .title				{ font-size:26px; line-height:22px; }
#book_index .title span			{ vertical-align: middle; }
#book_index .title span.note	{ font-size:12px; display:inline-block; border:1px solid #666; padding:0 1em; margin-right:.8em; }

#book_index h1					{ margin:2em 0 3em 0; font-size:36px; font-weight:normal; }
#book_index h1 span				{ position:relative; display:inline-block; padding:0 75px; }
#book_index h1 span:before		{ content: ''; position:absolute; top:50%; display:inline-block; width:65px; height:1px; background-color:#666; }
#book_index h1 span:after		{ content: ''; position:absolute; top:50%; display:inline-block; width:65px; height:1px; background-color:#666; }
#book_index h1 span:before		{ left:0; }
#book_index h1 span:after		{ right:0; }

#book_index ul						{ list-style:none; }
#book_index li						{ width:30%; float:left; }
#book_index li + li					{ width:59%; float:right; }
#book_index li .sample-page			{ margin-bottom:40px; position:relative; /*transform:rotate(-2deg);*/}
#book_index li .sample-page img		{ border:1px #efefef solid; }
#book_index li .sample-page a:hover	{ opacity:0.5; }

.mark_new {
	z-index: 1;
	background-color: #f264a5;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	color: #ffffff;
	height: 40px;
	width: 40px;
	position: absolute;
	top: -14px;
	right: -14px;
	text-align: center;
	padding: 15px 0;
	line-height: 1;
	text-decoration: none;
	font-size:10px;
}

#book_index dl					{ margin:0 0 2em 0; /* font-size:14px; */ }
#book_index dl + dl				{ margin:2em 0; }
#book_index dt, dd				{ margin:0; padding:0; }
#book_index dt					{ /*color:#782225;*/ font-weight:bold; }
#book_index dt span				{ display:inline-block; padding-right:.5em; }
/*
#book_index dd					{ padding: .5em 1em .5em 1em; border-left:solid 4px #efefef; margin-left:.5em; }
*/
#book_index dd					{ padding: .5em 0 .5em 0;  }

#book_index						{ margin-bottom:4em; }



/* --------------------------------------------------------------------------*

	著者紹介

 * --------------------------------------------------------------------------*/

#author						{ margin-bottom:80px; }
#author .page_wrapper2		{ border-top:1px solid #666; padding: 30px 0; }
#author h1					{ font-size:26px; }
#author .name				{ color:#006699; font-size:18px; padding-top:20px; }

#author ul					{ margin:40px 0 0 0; padding:0; box-sizing:border-box; list-style:none; }
#author ul li.dtail			{ float:right; width:540px; font-size:16px; padding-top: 0.8em; }
#author ul li.image			{ float:left;  width:260px; text-align:center;	}
#author ul li .url			{ font-size:14px; margin-top:1em; }
#author ul li .url:after	{ content: url(../images/icon-link_02.png?v0.1); padding-left: 0.6em; }



/* --------------------------------------------------------------------------*

	購入ブロック

 * --------------------------------------------------------------------------*/

.purchase					{ 
/*	background:#efefef; 
*/	padding:0 0 100px 0; 
	box-sizing:border-box;
	background: linear-gradient(57deg, #1B553D, #000000, #782225);
	background-size: 600% 600%;
	position: relative;

	-webkit-animation: bg_gradation 13s ease infinite;
	-moz-animation: bg_gradation 13s ease infinite;
	animation: bg_gradation 13s ease infinite;
}

.purchase .wrapper			{ background:url(../images/bg_foot.svg) center top no-repeat; background-size:1920px; padding-top:140px; }
.purchase .page_wrapper		{ padding: 40px 0; border:solid 3px #ccc; border-radius:10px; background:#fff; }
.purchase ul				{ list-style:none; padding:0; margin:0; width:100%; }
.purchase li				{ float:left; width:260px; padding:0; margin:0; }
.purchase li + li			{ float:right; width:500px; padding:0; margin:0; }

.purchase h1.title				{ font-size:26px; line-height:24px; margin:.3em 0 .3em 0; border-bottom:1px #333 solid; padding:0 0 .3em 0; letter-spacing:0.1em; }
.purchase h1.title span			{ vertical-align: middle; }
.purchase h1.title span.note	{ font-size:12px; display:inline-block; border:1px solid #666; padding:0 1em; margin-right:1.2em; letter-spacing:0; }
.purchase div.price				{ text-align:right; font-size:16px; }
.purchase table					{ margin:2em 0; }
.purchase td + td				{ padding-left:1.6em; }
.purchase td p					{ line-height:1.6em; }
.purchase .code					{ text-align:right; font-size:12px; padding-top:10px; }



.purchase span.autor		{ font-size:12px; border-top:solid 1px #999; margin-top:.5em; padding-top:.5em; }
.purchase h2				{ margin:1em 0 .5em 0; font-size:16px; }
.purchase h2 span			{ display:block; }
.purchase a					{ display:inline-block; width:240px; background:#ff6699; color:#fff; padding:.6em 0; margin-top:.6em; text-align:center; text-decoration:none; border-radius:3px; }
.purchase a:hover			{ background:#000; }
.purchase a + a				{ margin-left:14px; }



.treat_option	li	{ color:#ff6699; }




/* --------------------------------------------------------------------------*

	販売店リスト

 * --------------------------------------------------------------------------*/

#store_list h1				{ position:relative; padding:15px 20px; text-align:center; color:#000; font-weight:normal; border-top:#000 solid 3px; border-bottom:#000 solid 3px; }
#store_list h1:before		{ content:" "; position:absolute; top:100%; left:50%; width:0; height:0; border-width:20px; margin-left:-20px; border-style:solid; border-color:transparent; border-top-color:#000; }
#store_list h1:after		{ content:" "; position:absolute; top:100%; left:50%; width:0; height:0; border-width:12px; margin-left:-12px; border-style:solid; border-color:transparent; border-top-color:#000; z-index:1; }
/*
#store_list h1:before		{ content:" "; position:absolute; top:100%; left:480px; width:0; height:0; border-width:12px; border-style:solid; border-color:transparent; border-top-color:#000; }
#store_list h1:after		{ content:" "; position:absolute; top:100%; left:484px; width:0; height:0; border-width:8px; border-style:solid; border-color:transparent; border-top-color:#000; z-index:1; }
*/
#store_list h1 span			{ display:block; font-size:16px; }

#store_list h2				{ position:relative; text-align:center; margin:60px auto 60px auto; width:20em; }
#store_list h2:before		{ content:""; display:block; border-top:solid 1px #aaa; width:20em; height:1px; position:absolute; top:50%; z-index:1; margin:auto; }
#store_list h2 span			{ background:#fff; padding:0 2em; position:relative; z-index:5; }

#store_list p.catch span	{ font-size:12px; }
#store_list p.note			{ padding:0.5em 1em; font-size:12px; text-align:center; }

#store_list ul				{ list-style:none; margin:40px 0 0 0; padding:0; margin-bottom:100px; }
#store_list ul li			{ float:left; width:25%; padding:0 5px; box-sizing:border-box; }
#store_list ul dl			{ margin:0; font-size:12px; }
#store_list ul dl + dl		{ margin-top:2em; }
#store_list ul dt			{ margin:0 0 0.5em 0; padding:0.5em 1em; letter-spacing:0.1em; background:#efefef url(../images/icon-open.svg) right no-repeat; background-size:16px; }
#store_list ul dt:before	{ content:"\25CE"; padding-right:0.5em; }
#store_list ul dt:hover		{ background:#ff6699 url(../images/icon-close.svg) right no-repeat; background-size:16px; color:#fff; cursor:pointer; }
#store_list ul dt.hover		{ background:#ff6699 url(../images/icon-close.svg) right no-repeat; background-size:16px; color:#fff; }

#store_list ul dt.nodata	{ margin:0 0 0.5em 0; padding:0.5em 1em; letter-spacing:0.1em; background:none; background-color:#ccc; }


#store_list ul dd			{ margin:0; padding:0.8em 0.8em; letter-spacing:0.05em; line-height:1.4em; display:none; }
#store_list ul dd a			{ text-decoration:none; color:#006699; }

#store_list ul dd a:hover, 
#store_list ul dd a:hover strong, 
#store_list ul dd a:hover span {
	text-decoration: underline;
	color: #ff3300;
}

#store_list ul dd a:after	{ content: "●"; content: url(../images/ecalic033/ecalic033_001.png?v0.1); padding-left:0.6em; }
#store_list ul dd strong	{ font-weight:normal; white-space:nowrap; color:#333; }
#store_list ul dd span		{ display:inline-block; white-space:nowrap; }


/* --------------------------------------------------------------------------*

	フッタ

 * --------------------------------------------------------------------------*/
#footer					{ border-top:1px solid #333; padding:.5em 0; text-align:center; background:#000; color:#fff; }





