@charset "utf-8";

/* ======================================================== blackboard */

#blackboard {
width: 940px;
height: 274px;
margin: 0 auto;
padding-top: 30px;
background: url("../img/blackboard.gif") left top no-repeat;
}

#blackboard h1 {
width: 430px;
height: 120px;
margin: 0px 0px 0px 30px;
text-indent: -9999px;
text-decoration: none;
background: url("../img/h1.gif") left top no-repeat;
}

#blackboard .point {
width: 360px;
height: 110px;
margin: 0px 0px 0px 200px;
text-indent: -9999px;
text-decoration: none;
background: url("../img/point.gif") left top no-repeat;
}

/* ======================================================== paper */

#paperTop {
width: 900px;
height: 59px;
margin: 0 auto;
padding: 24px 0px 0px 40px;
background: url("../img/paper_top.gif") left top no-repeat;
}

#paperTop a {
display:block;
width: 188px;
height: 45px;
text-indent: -9999px;
text-decoration: none;
}

#paperTop a:link, #paperTop a:visited {
background:url("../img/btn_return.gif") left top no-repeat;
}

#paperTop a:hover, #paperTop a:active {
background:url("../img/btn_return.gif") -200px top no-repeat;
}

#paper {
width: 840px;
margin: 0 auto;
padding: 0 50px;
background: url("../img/paper.gif") left top repeat-y;
}

h2 {
width: 840px;
height: 90px;
margin: 0 auto;
text-indent: -9999px;
text-decoration: none;
background: url("../img/h2.gif") left top no-repeat;
}

.lead {
width: 840px;
height: 70px;
margin: 0 auto 53px;
text-indent: -9999px;
text-decoration: none;
background: url("../img/lead.gif") left top no-repeat;
}

/* ==================== point1～5 共通 */

#paper p.proBtn a {
display:block;
width: 124px;
height: 28px;
margin: 0 auto;
text-indent: -9999px;
text-decoration: none;
}

#paper p.proBtn a:link, #paper p.proBtn a:visited {
background:url("../img/btn_pro.gif") 0 0 no-repeat;
}

#paper p.proBtn a:hover, #paper p.proBtn a:active {
background:url("../img/btn_pro.gif") -124px 0 no-repeat;
}

/* ==================== point1 */

#paper #point1 {
width: 840px;
}

#point1 h3 {
width: 840px;
height: 45px;
margin: 0 0 15px 0;
text-indent: -9999px;
text-decoration: none;
background: url("../img/p1_ttl.gif") left top no-repeat;
}

.boxLeft1{
width: 500px;
float:left;
}

.boxRight1{
width: 340px;
float:right;
}

#pro01{
margin:0 0 55px 0;
}

/* ==================== point2 */

#paper #point2 {
width: 840px;
margin: 0 auto 50px;
}

#point2 h3 {
width: 840px;
height: 45px;
margin: 0 0 15px 0;
text-indent: -9999px;
text-decoration: none;
background: url("../img/p2_ttl.gif") left top no-repeat;
}

.box{
width:840px;
}

.boxLeft2{
width: 340px;
float:left;
}

.boxRight2{
width: 500px;
float:right;
}

#proArea{
width: 780px;
margin:20px auto 40px;
}

.proLeft{
float:left;
width: 410px;
}

.proRight{
float:right;
width: 370px;
}

/* -------------------- comment */

/* ==================== pink */

.commentP{
width: 470px;
margin:0 auto;
background: url("../img/pink_middle.gif") left top repeat-y;
}

.commentPtop{
height: 5px;
background: url("../img/pink_top.gif") left top no-repeat;
}

.commentPbtm{
width: 470px;
margin:0 auto 20px;
height: 10px;
background: url("../img/pink_bottom.gif") left top no-repeat;
}

.commentP p{
width:400px;
margin:0 auto;
padding:10px 0;
font-size:100%;
line-height:145%;
color:#333333;
}

.commentP p .bold{
font-weight:bold;
color:#ff3e5f;
}

.commentP p .age{
font-size:85%;}

/* ==================== blue */

.commentB{
width: 470px;
margin:0 auto;
background: url("../img/blue_middle.gif") left top repeat-y;
}

.commentBtop{
height: 5px;
background: url("../img/blue_top.gif") left top no-repeat;
}

.commentBbtm{
width: 470px;
margin:0 auto 20px;
height: 10px;
background: url("../img/blue_bottom.gif") left top no-repeat;
}

.commentB p{
width:400px;
margin:0 auto;
padding:10px 0;
font-size:100%;
line-height:145%;
color:#333333;
}

.commentB p .bold{
font-weight:bold;
color:#4876d4;
}

.commentB p .age{
font-size:85%;}

/* ==================== balloon */

#balloon {
width: 760px;
height: 310px;
margin: 0 auto 30px;
text-indent: -9999px;
text-decoration: none;
background: url("../img/balloon.gif") left top no-repeat;
}

#btm_txt {
width: 600px;
height: 50px;
margin: 0 auto;
text-indent: -9999px;
text-decoration: none;
background: url("../img/btm_txt.gif") left top no-repeat;
}


/* ==================== paperBtm */


#paperBtm {
width: 940px;
height: 18px;
text-indent: -9999px;
text-decoration: none;
background: url("../img/paper_btm.gif") left top no-repeat;
}