@charset "utf-8";



/* [01.全般的な設定]
---------------------------------------------------------*/

body{
	background:url(../../images/beginner/bg.png) #27e07a;
}

.wrapper {
width: 960px;
margin: 0 auto;
padding-bottom:20px;
text-align: left;
font-size:14px;
color:#333;
}

img{
	vertical-align:bottom;
}
.notice_prepaid{
	display: block;
	width: 100%;
	max-width: 920px;
	height: auto;
	margin: 0 auto;
	margin-top:40px;
	margin-bottom:20px;
	padding:18px;
	text-align: center;
	font-size:16px;
	font-weight: bold;
	color:#614102;
	border: 2px solid #614102;
	border-radius:5px;
	box-sizing: border-box;
}

/* [02.第1話]
---------------------------------------------------------*/

#header{
	min-height:226px;
	background:url(../../images/beginner/header_bg.png) no-repeat center top;
}

#header .inner{
	margin:auto;
	width:960px;
}


#header ul{
	text-align:center;
}

#header li{
	display:inline;
	padding:0 5px;
}

#header li img{
	vertical-align:bottom;
}

#contents{
	background-color:#fff;
	border-top:solid 4px #ffffae;
}


#manga01,
#manga02,
#manga03,
#manga04,
#now,
#moreInfo{
	min-width:960px;
	width:100%;
	text-align:center;
}

#manga01{
	margin:33px 0 23px;
}

#manga02{
	margin:14px 0 33px;
}

#manga03{
	margin:32px 0 36px;
}

#manga04{
	margin-top:14px;
}

.info{
	background-image:url(../../images/beginner/info_bg.png);
	background-repeat:no-repeat;
	background-color:#ffffae;
	line-height:1.4em;
/*---- for IE7 --*/	
	*display:inline-block;
}

.info .wrapper{
	position:relative;
	text-align:center;
}

.info h2{
	position:absolute;
	z-index:6;
	top:-50px;
	left:0;
	text-align:left;
}

.info h3{
	position:relative;
	z-index:5;
	text-align:center;
}

.info .wL,
.info .wR{
	display:inline-block;
	margin:0 8px;
	border:solid 2px #ffde28;
	background-color:#fff;
	text-align:left;
	vertical-align:top;
/*---- for IE7 --*/	
	*display:block;
	*float:left;

}

.info .wL p,
.info .wR p{
	padding:0 10px;
}

#trouble01{
	background-position:center top;
}

#trouble01 .wL{
	margin-top:-27px;
	width:451px;
	min-height:210px;
}

#trouble01 .wR{
	margin-top:-27px;
	width:453px;
	min-height:210px;
}

#trouble02{
	background-position:center -20px;
}

#trouble02 .wL{
	margin-top:-27px;
	width:501px;
	min-height:212px;
}

#trouble02 .wR{
	margin-top:-27px;
	width:403px;
	min-height:212px;
}

#trouble03{
	background-position:center -20px;
}

#trouble03 .for{
	margin:-27px auto 0;
	border:solid 2px #ffde28;
	width:924px;
	background-color:#fff;
}

#trouble03 .for ul{
	padding-top:145px;
	padding-bottom:10px;
	background:url(../../images/beginner/for03_flow.png) no-repeat center top;
	text-align:center;
/*---- for IE7 --*/	
	*display:inline-block;
	*padding-left:27px;
}

#trouble03 .for li{
	display:inline-block;
	width:265px;
	text-align:center;
/*---- for IE7 --*/	
	*display:block;
	*float:left;
}

#trouble03 .flow01{
	margin-left:;
	margin-right:38px;
}

#trouble03 .flow02{
	margin-left:;
	margin-right:37px;
}


#now{
	padding-bottom:19px;
}

#moreInfo{
	padding-bottom:29px;
	border-bottom:dashed 1px #d5f9e5;
}

#moreInfo li{
	display:inline;
	padding:0 8px;
}

#moreInfo li img{
	vertical-align:bottom;
}


#footer{
	padding:30px 0 75px;
	min-width:960px;
	width:100%;
	text-align:center;
	font-size:12px;
	color:#fff;
}

#btnHOME{
	margin-bottom:20px;
	font-weight:bold;
}

#btnHOME a{
	display:block;
	margin:auto;
	padding:8px 18px;
	width:228px;
	border-radius:18px;
	background-color:#fff;
	background-color:rgba(2155,255,255,0.8);
	text-decoration:none;
	color:#04ba66;
}

#btnHOME img{
	margin-right:10px;
	vertical-align:middle;
}


/* [03.第2話]
---------------------------------------------------------*/

#chapt02manga01,
#chapt02manga02,
#chapt02manga03,
#chapt02manga04{
	min-width:980px;
	width:100%;
	text-align:center;
}

#chapt02manga01{
	margin:0 0 23px;
}

#chapt02manga02{
	margin:0 0 29px;
}

#chapt02manga03{
	margin:0 0 32px;
}

#difference01,
#difference02,
#same{
	background-color:#ffffae;
	font-size:14px;
	line-height:1.4em;
	text-align:center;
}

#difference01 .wrapper,
#difference02 .wrapper,
#same .wrapper{
	position:relative;
	text-align:center;
}

#difference01 h2,
#difference02 h2,
#same h2{
	position:absolute;
	text-align:left;
}

#difference01 h2{
	top:-50px;
	left:18px;
}

#difference01 p{
	padding-top:10px;
}

#difference01 li{
	display:inline-block;
	padding:0 5px;
}

#same{
	padding:33px 0 0;
}

#same h2{
	top:-84px;
	left:18px;
}

#same p{
	padding-top:10px;
}

#same li{
	display:inline-block;
	padding:0 5px;
}

#difference02{
	padding:34px 0 0;
}

#difference02 h2{
	top:-84px;
	left:18px;
}

#difference02 .wL,
#difference02 .wR{
	display:inline-block;
	border:2px solid #ffde28;
	vertical-align:top;
}

#difference02 .wL{
	margin-right:15px;
	width:370px;
	min-height:256px;
	background:url(../../images/beginner/img_difference02_01.png) no-repeat center top #fff;
}

#difference02 .wR{
	width:541px;
	min-height:256px;
	background:url(../../images/beginner/img_difference02_02.png) no-repeat center top #fff;
}


#difference02 .wAll{
	margin:15px auto 0;
	width:930px;
	min-height:196px;
	border:2px solid #ffde28;
	background:url(../../images/beginner/img_difference02_03.png) no-repeat center top #fff;
}


#difference02 .wL p, 
#difference02 .wR p{
	margin-top:145px;
	padding-bottom:9px;
}


#difference02 .wAll h3{
	text-align:left;
}

#difference02 .wAll p{
	padding-left:12px;
	text-align:left;
}

#more{
	padding-bottom:30px;
	text-align:center;
}