/*--------------------------------------------------------------
	Common Settings
--------------------------------------------------------------*/
img {
	max-width: 100%;
	height: auto;
	width: auto\9;
}

time {
	font-size: 80%;
}

.end {
	display:inline-block;
	padding: 1px 5px 1px 5px !important;
	font-size: 80%;
	color:#fff !important;
	background:#F00 !important;
}
.bold {
	font-weight: bold;
}
.tR {
	text-align: right;
}
.red {
	color: #F00;
}
.redBlock {
	padding: 0px 5px;
	color: #fff;
	background:#F00;
}
.el { margin-left: 10px; }
.er { margin-right: 10px; }


..tel-link { color: #06F; }
.tel-link a { color: #06F; }

.onmouse { cursor: pointer !important; }
.link_bnr:hover { text-decoration: underline; }


/*	 img 100% 80%
---------------------------------------------------------------*/
.imgauto,
.img100,
.img80,
.img70,
.img60,
.img50,
.img30 {
	width: 100%;
	padding:0px;
	margin: 0px auto 10px;
	text-align:center;
	box-sizing:border-box;
}
.imgauto img {
	width:auto;
}
.img100 img {
	width: 100%;
}
.img80 img {
	width: 80% !important;
}
.img70 img {
	width: 70% !important;
}
.img60 img {
	width: 60% !important;
}
.img50 img {
	width: 50% !important;
}
.img30 img {
	width: 30% !important;
}
.img100 > a:hover,
.img80 > a:hover,
.img70 > a:hover,
.img60 > a:hover,
.img50 > a:hover,
.img30 > a:hover {
	opacity: 0.7;
}

@media only screen and (max-width: 479px) {
.img100sp img {
	width: 100%;
}
.img80sp img {
	width: 80% !important;
}
.img70sp img {
	width: 70% !important;
}
.img60sp img {
	width: 60% !important;
}
.img50sp img {
	width: 50% !important;
}
.img30sp img {
	width: 30% !important;
}
}


/*	 youtube
--------------------------------------*/
.youtube {
	position:relative;
	margin: 0px auto;
	text-align:center;
}

.yt100 {
	width:100%;
	padding-top:56.25%;
}
.yt80 {
	width:80%;
	padding-top:45%;
}
.yt50 {
	width:50%;
	padding-top:28.12%;
}

.youtube iframe {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*	 Margin / Padding
---------------------------------------------------------------*/
.marT {
	margin-top: 20px;
}
.marL {
	margin-left: 20px;
}
.marR {
	margin-right: 20px;
}
.marB {
	margin-bottom: 20px;
}

.padT {
	padding-top: 20px;
}
.padL {
	padding-left: 20px;
}
.padR {
	padding-right: 20px;
}
.padB {
	padding-bottom: 20px;
}

/*	 Normal Link , External Link
---------------------------------------------------------------*/

.link,
.linkEx,
.linkR,
.linkExR {
	position:relative;
	word-break:break-all;
}
.link a,
.linkEx a,
.linkR a,
.linkExR a {
	display:inline;
	width:auto;
	text-decoration: underline;
}
.link a,
.linkEx a {
	padding-left:0.5em;
}
	.link:before,
	.linkEx:before,
	.linkR:after,
	.linkExR:after {
		display: inline-block;
		position: relative;
		margin:0;
		top: 0px;
		height: 100%;
		vertical-align: top;
		color: #000;
		text-decoration: none;
		font-size: 12px;
		font-family: "FontAwesome";
	}
	.linkEx:before {
		top: 2px;
	}
	.linkExR:after {
		top: -1px;
	}
	.link:before {
		left:2px;
	}
	.linkR:after,
	.linkExR:after {
		top: 2px;
		margin-left: 0.5em;
	}
		.link:before {
			content: "\f0da";
		}
		.linkEx:before {
			content: "\f08e";
		}
		.linkR:after {
			content: "\f0da";
		}
		.linkExR:after {
			content: "\f08e";
		}
		.link > span,
		.linkEx > span,
		.linkR > span,
		.linkExR > span {
			display: inline;
			width: 97%;
			margin-right: 1%;
			vertical-align:middle;
			line-height: 120%;
		}

/*	 PDF / WORD / EXCEL
---------------------------------------------------------------*/

.i_pdf,
.i_word,
.i_excel {
	vertical-align:middle;
	margin-right: 10px;
	padding-top: 1px;
	padding-left: 22px;
	background-size: auto !important;
}

.i_pdf {
	background: url(../images/common/pdf.gif) no-repeat 0% 50%;
}
.i_word {
	background: url(../images/common/word.gif) no-repeat 0% 50%;
}
.i_excel {
	background: url(../images/common/excel.gif) no-repeat 0% 50%;
}

/*▼ float 回り込み解除 */
.c_both { clear:both; }
.clearfix:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}

.clearfix { display: inline-table; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

.clearfix {
    content: ".";  
    display: block;  
    visibility: hidden;  
    height: 0.1px;  
    font-size: 0.1em;  
    line-height: 0;  
    clear: both;
}
dl:after   {
    content: ".";  
    display: block;  
    visibility: hidden;  
    height: 0.1px;  
    font-size: 0.1em;  
    line-height: 0;  
    clear: both;
}
section:before,
section:after {
    content: ".";  
    display: block;  
    visibility: hidden;  
    height: 0.1px;  
    font-size: 0.1em;  
    line-height: 0;  
    clear: both;
}
/*▲ float 回り込み解除ここまで */

/*--------------------------------------------------------------
	List style Normal Default  [ txt ]
---------------------------------------------------------------*/
.lst-default {
	margin: 10px auto;
}
	
.lst-default {
	width: 100%;
	list-style:none;
	padding: 0px;
	margin:0px auto;
	box-sizing:border-box;
}
	.lst-default ul li {
		line-height: 200%;
	}
	
/*--------------------------------------------------------------
	List style Type disc  [ txt ]
---------------------------------------------------------------*/
.lst-disc {
	margin: 10px auto;
}
	
.lst-disc > ul {
	width: auto;
	max-width: 100%;
	list-style:none;
	padding: 0px;
	margin:0px auto;
	box-sizing:border-box;
}
	.lst-disc > ul > li {
		display:list-item;
		padding:0px;
		margin: 0px 0px 7px 20px;
		list-style:disc;
		line-height: 180%;
	}
	
/*--------------------------------------------------------------
	List style Type number  [ txt ]
---------------------------------------------------------------*/
.lst-num {
	margin: 10px auto;
}
	
.lst-num > ol {
	width: auto;
	max-width: 100%;
	list-style:none;
	padding: 0px;
	margin:0px auto;
	box-sizing:border-box;
}
	.lst-num > ol > li {
		display:list-item;
		padding:0px;
		margin: 0px 20px 7px 30px;
		list-style: decimal;
		line-height: 180%;
	}
	
/*--------------------------------------------------------------
	Normal Link  List [ txt ]
---------------------------------------------------------------*/
.listL,
.listR {
	width: 100%;
	margin: 0px auto 20px auto;
	box-sizing:border-box;
}
	.listL ul,
	.listR ul {
		width: 100%;
		margin: 0px auto 10px auto;
	}
		.listL ul li,
		.listR ul li {
			padding: 15px 10px;
			border-bottom: 1px dotted #999;
		}
		.listL ul li:first-child,
		.listR ul li:first-child {
			padding: 0px 10px 15px 10px;
		}
		.listL ul li a,
		.listR ul li a {
			display: inline-block !important;
		}
			.listL ul li > span {
				display: inline-block;
				vertical-align:middle;
			}
			.listR ul li > span {
				display: inline-block;
				width: 96%;
				vertical-align:middle;
			}
			.listL ul li > span {
				margin-left: 10px;
			}
			.listR ul li > span {
				margin-right: 10px;
			}
			.listL ul li:before {
				display: inline-block;
				font-family: "FontAwesome";
				content: "\f0da";
				width: 0px;
				height: 100%;
				vertical-align: top;
			}
			.listR ul li:after {
				display: inline-block;
				font-family: "FontAwesome";
				content: "\f0da";
				width: 0px;
				height: 100%;
				vertical-align: top;
			}
				.listL ul li > span  time,
				.listR ul li > span  time {
					margin-left: 5px;
				}
/*--------------------------------------------------------------
	Normal dl
---------------------------------------------------------------*/
.normal_dl {
	margin: 0px auto;
	padding: 0px;
}
	.normal_dl dl {
		display:table;
		width: 100%;
		margin: 0px auto;
	}
	.normal_dl dl:last-child {
		border-bottom: 1px dotted #666;
	}
		.normal_dl dt,
		.normal_dl dd {
			font-size: 100%;
			padding: 10px 10px 10px 10px;
			min-height: 25px;
			box-sizing:border-box;
		}
		.normal_dl dt:after,
		.normal_dl dd:after {
			display: inline-block;
			content:"";
			height: 100%;
		}
		.normal_dl dt {
			clear: left;
			float: left;
			min-width: 60px;
			margin-right: 1px;
			font-weight:bold;
			border-top: 1px dotted #666;
		}
		.normal_dl dt:after {
			clear: left;
			content: "";
		}
		.normal_dl dd {
			border-top: 1px dotted #666;
			overflow:hidden;
			background: #fff;
		}
		.normal_dl dt:first-child,
		.normal_dl dd:nth-child(2) {
			border-top: none;
		}

/*--- dt 調整 ---*/		
.w50 dt {
	min-width: 50px;
}
.w100 dt {
	min-width: 100px;
}
.w120 dt {
	min-width: 120px;
}
.w150 dt {
	min-width: 150px;
}
.w200 dt {
	min-width: 200px;
}
		
		
@media only screen and (max-width: 767px) {
	.normal_dl dl.forSP dt,
	.normal_dl dl.forSP dd {
		display:block;
		float:none;
		width: 100%;
		min-width: 100%;
		padding: 5px 5px 5px 5px;
		border-top: none;
	}
	.normal_dl dl.forSP dt {
		padding: 5px 5px 0px 5px;
	}
	.normal_dl dl.forSP dd {
		padding: 5px 5px 10px 5px;
		border-bottom: 1px dotted #666;
	}
}
@media only screen and (max-width: 479px) {
	.normal_dl dl:last-child {
		border-bottom: none;
	}
}

/*--------------------------------------------------------------
	lstBtn table type
---------------------------------------------------------------*/
.lstBtn {
	clear:both;
	margin-top: 40px;
}
	.lstBtn ul {
		width: 100%;
		display: table;
		margin: 0px auto;
		padding: 0px 10px;
		box-sizing:border-box;
	}
		.lstBtn ul li {
			display: table-cell;
			float:left;
			width: 33%;
			margin: auto;
			vertical-align:middle;
		}
			.lstBtn ul li span {
				position:relative;
				display: table;
				width: 100%;
				padding: 5px 15px;
				height: 50px;
				font-size: 95%;
				box-sizing:border-box;
			}
			.lstBtn ul li span i:after {
				position: absolute;
				right: 10px;
				top: 25%;
				height: 100%;
				width: 0%;
				margin-left: 5px;
				font-size: 150%;
				font-family: "FontAwesome";
				content: "\f105";
				text-decoration:none;
				font-style:normal;
			}
			.lstBtn ul li a {
				display:block;
			}
			.lstBtn ul li a:hover {
				opacity: 1;
				color: #fff;
				background:#00b3ec;
			}
				.lstBtn ul li span span {
					display: table-cell;
					vertical-align:middle;
					padding: 2px 20px 0px 10px;
}

/*	 lstBtn border
------------------------------------------------*/
.lstBtn ul li {
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
}
	.lstBtn ul li:nth-child(-n+3) {
		border-top: 1px solid #999;
	}
	.lstBtn ul li:nth-child(3n+2),
	.lstBtn ul li:nth-child(3n+1) {
		border-right: none;
	}
	.lstBtn ul li:last-child {
		border-right: 1px solid #999;
	}


/*--------------------------------------------------------------
	MAP [ about ]
--------------------------------------------------------------*/
.map {
	position:relative;
	width:100%;
	padding-top:56.25%;
	margin: 30px auto;
	text-align:center;
	border: 1px solid #CCC;
	overflow:hidden;
	box-sizing:border-box;
}
.map iframe {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*-- google map link btn --*/
div.gmap_btn {
	width: 100%;
	text-align:center;
}
div.gmap_btn a span:after {
	display: inline-block;
	position:relative;
	top: 1px;
	margin-left: 10px;
	font-family: "FontAwesome";
	content: "\f105";
	font-size:130%;
}
div.gmap_btn a {
	width: 30%;
	display:block;
	color:#fff;
	font-size: 100%;
	text-decoration:none;
	text-shadow: 1px 1px 0px #000;
	padding: 5px 10px;
	margin: 0px auto;
	border: 1px solid #194692;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	background: #4285f4;
}
div.gmap_btn a:hover {
	opacity: 1;
	background: #2962c0;
}

/*--------------------------------------------------------------
	List Img col Common
--------------------------------------------------------------*/

[class*="imgCol"] {
	position:relative;
	margin-top: 0px;
	/*margin-top: 50px;*/
	z-index: 100;
}
[class*="imgCol"] * {
	box-sizing:border-box;
}
[class*="imgCol"] ul {
	display:table;
	width: 100%;
	max-width: 1088px;
	padding:0;
	margin: 0px auto;
	box-sizing:border-box;
}
	[class*="imgCol"] ul li {
		position:relative;
		display: table-cell;
		float:left;
		/*
		display: inline-block;
		*/
		margin-top: 10px;
		margin-bottom: 20px;
		height: auto;
		padding: 0px;
		text-align:center;
		vertical-align: bottom;
		box-sizing:border-box;
	}
	[class*="imgCol"] ul li:after {
		clear:both;
		content: "";
	}


/*----- img Vertically and horizontally Fix 縦横比固定 -----*/
[class*="imgCol"] ul li > div {
	display: table-cell;
	margin: 0px auto;
	height: auto;
	vertical-align: bottom;
}
[class*="imgCol"] ul li > div span {
	display: inline-block;
}
[class*="imgCol"] ul li > div img {
	width: 100%;
	height: auto;
	max-width: 100%;
	/*max-height: 100%;*/
	border: 1px solid #ccc;
}

[class*="imgCol"] ul li a {
	display: inline-block;
	margin: 0px auto;
	width: auto;
	height: auto;
	vertical-align:bottom;
	text-decoration:none;
}

/*----- book tittle -----*/
[class*="imgCol"] ul li a p {
	color: #06F;
	text-decoration:underline;
}
[class*="imgCol"] ul li div p {
	text-align: center;
}
[class*="imgCol"] ul li p {
	width: 100%;
	padding: 0px;
	margin: 0px auto;
	text-align: left;
	line-height: 140%;
	overflow:hidden;
}

[class*="imgCol"] ul li p > small {
	color: #666;
}

/*----- Release date -----*/
[class*="imgCol"] ul li time {
	display:block;
	color: #666;
	text-decoration:none !important;
}

/*----- price -----*/
[class*="imgCol"] ul li > small,
[class*="imgCol"] ul li a > small {
	color:#F00;
	font-size: 100%;
	font-weight:bold;
}


/*----- icon -----*/
[class*="imgCol"] ul li span {
	position:relative;
}

[class*="imgCol"] ul li span i > small {
	position:relative;
	top: 5px;
	color: #fff;
	font-size: 80%;
	font-style: normal;
	font-weight:bold;
	text-shadow: 0 0 1px rgba(0,0,0,0.5), 0 0 2px rgba(0,0,0,0.5);
	z-index: 100;
}
[class*="imgCol"] ul li span i {
    position: absolute;
	top: -10px;
	left: -10px;
    width: 30px;
    height: 30px;
    text-align: center;
	background: #cc0000;
	z-index: 200;
}
[class*="imgCol"] ul li span i:before,
[class*="imgCol"] ul li span i:after {
    position: absolute;
    top: 0;
    left: 0;
    height: 30px;
    width: 30px;
    content: "";
	background: #cc0000;
}
[class*="imgCol"] ul li span i:before {
    -webkit-transform: rotate(30deg);
       -moz-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
         -o-transform: rotate(30deg);
}
[class*="imgCol"] ul li span i:after {
    -webkit-transform: rotate(60deg);
       -moz-transform: rotate(60deg);
        -ms-transform: rotate(60deg);
         -o-transform: rotate(60deg);
}

/*----- img Vertically and horizontally Fix 縦横比固定 -----*/

/*----- 下揃え 縦横比固定 -----*/
[class*="imgBlock"] ul li > div span {
	position:relative;
	display: inline;
	max-height: auto;
}

/*----- icon -----*/
[class*="imgBlock"] ul li span i {
    position: absolute;
	top: auto;
	left: -10px;
	margin-top: -10px;
}



/*--------------------------------------------------------------
	List Img 5col [ book list ]
--------------------------------------------------------------*/
	[class*="imgCol5"] ul li {
		width:18.4%;
		margin: 0px 1%;
	}
	[class*="imgCol5"] ul li:nth-child(5n+1) {
		clear:both;
		margin-left: 0%;
	}
	[class*="imgCol5"] ul li:nth-child(5n) {
		margin-right: 0%;
	}
	
/*----- img Vertically and horizontally Fix 縦横比固定 -----*/
[class*="imgCol5"] ul li > div {
	/*width: 200px;*/
	/*height: 160px;*/
	max-height: 160px;
	padding-bottom: 5px;
}
[class^="imgCol5"] ul li > div img,
[class*="imgCol5"] ul li > div img {
	/*max-height: 100%;*/
	max-height: 160px;
}

/*----- 下揃え 縦横比固定 -----*/
[class*="Block5"] ul li > div {
	width: 200px;
	height: 160px;
	max-height: 160px;
}

/*--------------------------------------------------------------
	List Img 4col
--------------------------------------------------------------*/
	[class*="imgCol4"] ul li {
		width:23.5%;
		margin: 0px 1%;
	}
	[class*="imgCol4"] ul li:nth-child(4n+1) {
		clear:both;
		margin-left: 0%;
	}
	[class*="imgCol4"] ul li:nth-child(4n) {
		float:right;
		margin-right: 0%;
	}
	
/*----- img Vertically and horizontally Fix 縦横比固定 -----*/
[class*="imgCol4"] ul li > div {
	/*width: 250px;*/
	/*height: 160px;*/
	max-height: 160px;
	padding-bottom: 5px;
}
[class*="imgCol4"] ul li > div img {
	max-height: 160px;
}

/*----- 下揃え 縦横比固定 -----*/
[class*="Block4"] ul li > div {
	width: 250px;
	height: 250px;
	max-height: 250px;
}


/*--------------------------------------------------------------
	List Img 3col
--------------------------------------------------------------*/
	[class*="imgCol3"] ul li {
		width:32%;
		margin: 0px 1%;
	}
	[class*="imgCol3"] ul li:nth-child(3n+1) {
		clear:both;
		margin-left: 0%;
	}
	[class*="imgCol3"] ul li:nth-child(3n) {
		float:right;
		margin-right: 0%;
	}
	
/*----- img Vertically and horizontally Fix 縦横比固定 -----*/
[class*="imgCol3"] ul li > div {
	/*width: 250px;*/
	/*height: 160px;*/
	max-height: 160px;
	padding-bottom: 5px;
}
[class*="imgCol3"] ul li > div img {
	max-height: 180px;
}

/*----- 下揃え 縦横比固定 -----*/
[class*="Block3"] ul li > div {
	width: 250px;
	height: 250px;
	max-height: 250px;
}

/*--------------------------------------------------------------
	List Flow
--------------------------------------------------------------*/
.flow ul li {
	padding: 10px;
}
.flow ul li * {
	box-sizing:border-box;
}
.flow ul li > div {
	height: auto;
	min-height: 100%;
	padding: 0px;
	border: 1px solid #ccc;
}
	.flow ul li h5 {
		display: block;
		width: 100%;
		text-align:left;
		background:#d3ebff;
		overflow:hidden;
	}
	.flow ul li h5 > i,
	.flow ul li h5 > span {
		display: table-cell;
		vertical-align: middle;
	}
	.flow ul li div h5 > span {
		padding: 5px!important;
		color: #0165ba;
		line-height: 1.1;
	}
	.flow ul li div h5 > i {
		width: 35px;
		padding: 5px 0px !important;
		color: #fff;
		font-size: 2vh;
		text-align:center;
		background:#0165ba;
	}
	.flow ul li p {
		padding: 10px;
		text-align:left !important;
	}
	.flow ul li h5:after {
		clear:both;
		content: "";
	}

