@charset "utf-8";
/* ////////////////////////////////////////
PC,SP
//////////////////////////////////////// */
/* ----- 背景用の動画ファイル ----- */
body{
	background-image: url(../img/bg-ebook.jpg);
}
span.kome {
vertical-align: super;
}
#contents{
	background-color: #FFFFFF;
	position: relative;
}
#contents::before{
	content:'';
	position: absolute;
	background-color: #00a0e9;
	top:0;
	left:0;
	width:100%;
	height:6px;
}
#contents .img-box{
	border:1px solid #ccc;
}
#contents h1{
	color:#303030;
	border-bottom: 1px dashed #b6b6b6;
	padding:10px 0;
	margin-bottom:20px;
}
#contents h2,#contents h3,#contents h4,#contents h5{
	color:#3c3c3c;
}
#contents h2 span{
	position: relative;
	display: inline-block;
	padding-left:30px;
}
#contents h2 span::before{
	content:'';
	position: absolute;
	background-image: url(../img/icon-book.png);
	background-size: contain;
	top:50%;
	left:0;
	margin-top:-10.5px;
	width:21px;
	height:21px;
}
#contents .view-btn a{
	border-radius:5px;
	background-color: #00a0e9;
	color:#fff;
	display: block;
	width:400px;
	padding:20px 5px;
	text-align: center;
	margin-top:10px;
	transition: 0.3s background;
}
#contents .view-btn a:hover{
	background-color: #018ecf;
}
#contents .spec-box{
	border:1px solid #c9c9c9;
	border-radius:10px;
}
#contents .spec-box dt{
	padding:20px 20px 10px 20px;
	border-bottom: 1px dashed #c9c9c9;
}
#contents .spec-box dd{
	padding:20px;
	color:#3c3c3c;
}
#contents .spec-box h4{
	border-left:5px solid #00a0e9;
	padding:10px 20px;
	line-height: 1.6em!important;
}
#contents .spec-table{
	width:100%;
}
#contents .spec-table th,#contents .spec-table td{
	padding:5px 20px;
}
#contents .spec-table th{
	background-color: #7c7c7c;
	color:#fff;
	width:25%;
	border-bottom:1px solid #fff;
}
#contents .spec-table td{
	border-top:1px solid #bfbfbf;
	border-right:1px solid #bfbfbf;
	border-bottom:1px solid #bfbfbf;
}
#contents a.text-link{
	color:#00a0e9;
	position: relative;
	display: inline-block;
	padding-left:10px;
}
#contents a.text-link:before{
	content:'';
	position: absolute;
	background-image: url(../img/icon-arrow.png);
	background-size: contain;
	width:6px;
	height:10.5px;
	top:50%;
	left:0;
	margin-top:-5.25px;
}
#contents a.text-link:hover{
	text-decoration: underline;
}
#contents .text-pink{
	color:#d6006f;
}
/* ////////////////////////////////////////
印刷時　PCのみ
//////////////////////////////////////// */
@media screen and (min-width:768px) , print{
	#contents{
		border:1px solid #c9c9c9;
		padding:45px 40px;
	}
	#contents .title-box{
		margin-left:3%;
		width:77%;
	}
	#contents .img-box{
		width:20%;
	}
	#contents .spec-box dd{
		height:300px;
		overflow-y: scroll;
	}
}
/* ////////////////////////////////////////
/* ////////////////////////////////////////
タブレット
//////////////////////////////////////// */
@media screen and (min-width:768px) and (max-width: 1240px){
	#contents .title-box{
		margin-left:3%;
		width:67%;
	}
	#contents .img-box{
		width:30%;
	}
	#contents .badgeGoogle img{
		height:60px;
	}
	#contents .badgeApple img{
		height:42px;
		margin-top:9px;
	}
	#contents .app-box{
		display: flex;
		width:100%;
		padding:10px 20px;
		align-items: center;
	}
	#contents .badgeList{
		padding-left:10px;
	}
	#contents .app-box-title img{
		wigth:50px;
		height:50px;
	}
}
/* ////////////////////////////////////////
タブレット以下
//////////////////////////////////////// */
@media screen and (max-width: 1240px){
	#contents .app-box{
		border-radius:10px;
		box-shadow:
			#c0c0c0 1px 1px 0, #c0c0c0 -1px -1px 0,/*右下、左上*/
			#c0c0c0 -1px 1px 0, #c0c0c0 1px -1px 0,/*右上、左下*/
			#c0c0c0 0px 1px 0, #c0c0c0  0-1px 0,/*右、左*/
			#c0c0c0 -1px 0 0, #c0c0c0 1px 0 0;/*上、下*/;
		border:1px solid #fff;
		background-image: -webkit-linear-gradient( rgba(229,229,229,1) 0%, rgba(255,255,255,1) 99%);
		background-image: -o-linear-gradient(rgba(229,229,229,1) 0%, rgba(255,255,255,1) 99%);
		background-image: linear-gradient(rgba(229,229,229,1) 0%, rgba(255,255,255,1) 99%);
		margin-bottom:10px;
	}
}
/* ////////////////////////////////////////
SPのみ
//////////////////////////////////////// */
@media screen and (max-width: 767px){
	#contents{
		border-top:1px solid #c9c9c9;
		border-bottom:1px solid #c9c9c9;
		padding:30px 20px;
	}
	#contents .title-box{
		width:100%;
	}
	#contents .img-box{
		width:40%;
	}
	#contents .view-btn a{
		width:100%;	
	}
	#contents .view-box{
		margin-left:3%;
		width:57%;
	}
	#contents .badgeList li{
		width:50%;
	}
	#contents .badgeList img{
		width:100%;
	}
	#contents .badgeApple img{
		padding-top:6%;
		padding-right:10%;
	}
	#contents .app-box{
		padding:15px 10px 5px 10px;
	}
	#contents .app-box-title{
		padding-left:12px;
	}
	#contents .app-box-title img{
		wigth:30px;
		height:30px;
	}
	#contents .spec-table th,#contents .spec-table td{
		padding:5px;
	}
}
/* ////////////////////////////////////////
印刷用
//////////////////////////////////////// */
@media print{
}