@import url("/css/jcarousel.css");


body{
	background-repeat:no-repeat;
	background-position:right 1050px top -100px;
	background-image:url(/img/ebook/ipad-body-bg_.jpg);
	background-size:1024px auto;
}

.inner{
	width:682px;
	float:right;
}

h2{
	float:left;
}

h3{
	font-size:70px;
	font-family: kozuka-mincho-pr6n, "A1 Mincho", "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", "MS Mincho", serif;
	font-weight: 400;
	line-height:70px;
	margin:48px 0 42px;
}

h2 span, h3 span{
	color:#808080;
}

p.published1{
	font-size:15px;
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	line-height:20px;
	margin:48px 0 42px 0;
	float:left;
	position:relative;
	top:5px;
	left:12px;
}

p.published2{
	margin:40px auto 15px;
	font-size:21px;
	font-family: kozuka-gothic-pr6n,"Gothic MB101 Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, Arial, Helvetica, sans-serif;
	font-weight: 400;
	line-height:30px;
}

p.mincho{
	font-size:15px;
	font-family: kozuka-gothic-pr6n, "Shuei Mincho L", "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", "MS Mincho", serif;
	font-weight: 300;
	line-height:27px;
}

div.works1 div{
	width:47%;
	height:160px;
	border-top:solid 1px #c2c2c2;
	overflow:hidden;
}

div.works1 div:nth-child(odd){
	float:left;
}

div.works1 div:nth-child(even){
	float:right;
}

div.works1 img{
	width:100px;
	float:left;
	margin-top:10px;
	margin-right:21px;
	border:solid 1px #808080;
}

div.works1 a:hover img{
	border:solid 1px #2361de;
}

div.works1 p{
	margin:4px auto;
}

div.works1 p.title2{
	margin-top:11px;
	font-size:18px;
	font-family: kozuka-gothic-pr6n, "Gothic MB101 DemiBold", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, Arial, Helvetica, sans-serif;
	font-weight: 500;
	line-height:24px;
	margin:11px 0 5px 0;
}

div.works1 p.title3{
	font-size:14px;
	font-family: kozuka-gothic-pr6n, "Hiragino Kaku Gothic ProN", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3",  "ＭＳ Ｐゴシック", "MS P Gothic", YuGothic, Verdana, Arial, Helvetica, sans-serif;
	line-height:20px;
	font-weight: 400;

}

div.works1 p.author{
	font-size:12px;
	font-family: kozuka-gothic-pr6n, "Gothic MB101 Regular", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, Arial, Helvetica, sans-serif;
	line-height:17px;
	font-weight: 400;
}

p.sequel{
	font-size:13px;
	margin-top:0;
	text-align:right;
}

div.sequel{
	display:none;
}

.package{
	margin-top:30px;
}

p.img620{
	margin-top:30px;
	text-align:center;
}

p.img620 img{
	width:620px;
}

.usermerit, .providermerit{
	margin-top:18px;
	margin-bottom:20px;
	background-color:white;
	border-radius:10px;
	width:48%;
}

.usermerit h4, .providermerit h4{
	text-align:center;
	margin:20px 0 10px;
}

.usermerit li, .providermerit li{
	margin:10px;
}

.usermerit{
	float:left;
}

.providermerit{
	float:right;
}

.usermerit *{
	color:#0091b0;
}

.providermerit *{
	color:#e55e87;
}


.format h4.expand{
	font-size:24px;
	margin-top:40px;
	margin-bottom:-5px;
}

p.caption{
	margin:24px auto;
	font-size:11px;
	font-family: kozuka-gothic-pr6n, "Gothic MB101 Regular", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, Arial, Helvetica, sans-serif;
	font-weight: 400;
	line-height:16px;
}


div.expand.process{
	margin-top:50px;
	padding-bottom:50px;
}

.process > div{
	margin-left:40px;
}

.process h4{
	padding-top:16px;
	margin-top:16px;
	margin-bottom:0;
	position:relative;
}

.process h4 span{
	display:inline-block;
	width:30px;
	text-align:right;
	margin-left:-50px;
	margin-right:20px;
}

.process p, .process li{
	font-size:14px;
	margin:8px auto;
}

.process table{
	margin:0 auto;
}

.process td{
	font-family:"Roboto", "Shuei KakuGo Kin L", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, Arial, Helvetica, sans-serif;
	font-size-16px;
	padding:0;
}

.process li img{
	position:relative;
	left:-40px;
}

p.img450, p.img320{
	margin:32px auto;
	text-align:center;
	position-relative;
}


.fixandreflow{
	background-color:#ddeef4;
}

.fixandreflow h3{
	font-size:56px;
}

.fix, .reflow{
	width:47%;
}

.fix h4, .reflow h4{
	margin:20px 0 10px;
}

.fix{
	float:left;
}

.reflow{
	float:right;
}


div.works2 div{
	width:210px;
	height:110px;
	float:left;
	margin:20px 16px 0 0;
	overflow:hidden;
}

div.works2 img{
	width:48px;
	float:left;
	margin-right:5px;
	border:solid 1px #808080;
}

div.works2 a:hover img{
	border:solid 1px #2361de;
}

div.works2 p{
	font-size:11px;
	line-height:15px;
	margin:0 0 2px 60px;
	position:relative;
	top:-3px;
}

div.works2 p.title2{
	font-size:15px;
	line-height:21px;
	font-family: kozuka-gothic-pr6n, "Gothic MB101 Regular", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", Verdana, Arial, Helvetica, sans-serif;
	font-weight:400;
	height:40px;
	margin:0 0 4px 61px;
	overflow:hidden;
}

div.works2 p.author{
	height:17px;
	overflow:hidden;
}

div.works2 hr{
	display:none;
}


@media (max-width:1023px){

.process > div{
	margin-left:0;
}

.process h4 span{
	margin-left:0;
	width:auto;
}

}


@media (min-width:768px){

div.works2 hr:nth-child(3n-2){
	display:block;
}

div.works2 p.title2{
	max-height:52px;
	overflow-y:hidden;
}

}


@media (max-width:767px){

body{
	background:none;
}

h3{
	font-size:25px !important;
	line-height:25px;
	margin:25px 0 19px;
}

div.works2 div{
	width:47%;
}

div.works2 div:nth-child(4n-3){
	float:left;
}

div.works2 div:nth-child(4n-2){
	float:right;
}

div.works2 hr:nth-child(4n-3){
	display:block;
}

}


@media (max-width:628px){

div.works1 div{
	float:none;
	width:100%;
}

.usermerit, .providermerit{
	float:none;
	width:100%;
	padding:1px 0;
	margin:22px auto;
}

p.img620{
	margin:32px 11px
}
p.img450{
	margin:32px 47px
}
p.img320{
	margin:32px 75px
}

.fix, .reflow{
	float:none;
	width:100%;
	padding:1px 0;
	margin:22px auto;
}

div.works2 div{
	float:none !important;
	width:100%;
}

div.works2 p{
	float:none;
	width:auto;
}

div.works2 hr:nth-child(n){
	display:block;
}

}


/*jcarousel関連追加*/
.jcarousel-wrapper li{
	text-align:center;
	overflow: hidden;
}
.jcarousel-wrapper {
	height: 240px;
	padding:0;
	position:relative;
}
.next {
	width:17px;
	right:8px;
	left:inherit;
}
.prev {
	left:-270px;
}

.jcarousel-wrapper img {
	height: 240px;
	width:auto !important;
	max-width:none;
}

@media screen and (min-width: 1024px) {

.jcarousel-wrapper {
	height: 240px !important;
}

.jcarousel-wrapper img {
	height: 240px !important;
	width: auto !important;
}

.prev {
	height: 240px !important;
}

.next {
	height: 240px !important;
}

}

@media screen and (min-width:768px) and ( max-width:1023px) {

.jcarousel {
	width: 100%;
}

}

@media screen and (max-width: 767px) {

.jcarousel-wrapper{
	padding:0 52px;
}
.jcarousel {
	width: 100%;
}
.next {
	width:17px;
	right:30px;
}
.prev {
	width:17px;
	left:30px;
}

}