@charset "UTF-8";

/* ----------------------------------------------------
作成日: 2009.07.15
最終更新日: 2009.07.24
作成者: AY
最終編集者:NT

startguideTutorial-mainArea.css
---------------------------------------------------- */

body#startguide-tutorial h2,
body#startguide-tutorial-step1 h2,
body#startguide-tutorial-step2 h2,
body#startguide-tutorial-step3 h2,
body#startguide-tutorial-step4 h2,
body#startguide-tutorial-step5 h2,
body#startguide-tutorial-step6 h2,
body#startguide-tutorial-step7 h2 {
	background:url(../image/h2_tutorial.gif) no-repeat left top;
}

/* ----------------------------------------------------

---------------------------------------------------- */

#mainArea p.center {
	width: 640px;
	margin:10px auto;
	text-align: center;
	display:block;
	clear:both;
}

/* ----------------------------------------------------
メニューページ
---------------------------------------------------- */

#mainArea #tutorialMenu-block ul {
	width:638px;
	margin:0 auto;
}

#mainArea #tutorialMenu-block ul li {
	width:638px;
	height:85px;
	margin:0;
	padding:0;
}

#mainArea #tutorialMenu-block ul li a {
	width:638px;
	height:85px;
	line-height: 0;
	font-size: 0;
	text-indent: -9999px;
	display:block;
}

#mainArea #tutorialMenu-block ul li#step1 a {
	background:url(../image/li_tutorial_menu.jpg) no-repeat 0 0;
}

#mainArea #tutorialMenu-block ul li#step2 a {
	background:url(../image/li_tutorial_menu.jpg) no-repeat 0 -85px;
}

#mainArea #tutorialMenu-block ul li#step3 a {
	background:url(../image/li_tutorial_menu.jpg) no-repeat 0 -170px;
}

#mainArea #tutorialMenu-block ul li#step4 a {
	background:url(../image/li_tutorial_menu.jpg) no-repeat 0 -255px;
}

#mainArea #tutorialMenu-block ul li#step5 a {
	background:url(../image/li_tutorial_menu.jpg) no-repeat 0 -340px;
}

#mainArea #tutorialMenu-block ul li#step6 a {
	background:url(../image/li_tutorial_menu.jpg) no-repeat 0 -425px;
}

#mainArea #tutorialMenu-block ul li#step7 a {
	background:url(../image/li_tutorial_menu.jpg) no-repeat 0 -510px;
}

/* -------------------------------------------------------------
見出し
------------------------------------------------------------- */

#tutorial-block h3 {
	width: 640px;
	height: 103px;
	margin: 10px auto 10px;
	padding: 0;
	line-height: 0;
	font-size: 0;
	text-indent: -9999px;
}

body#startguide-tutorial-step1 #tutorial-block h3 {
	background:url(../image/h3_step1.jpg) no-repeat center top;
}
body#startguide-tutorial-step2 #tutorial-block h3 {
	background:url(../image/h3_step2.jpg) no-repeat center top;
}
body#startguide-tutorial-step3 #tutorial-block h3 {
	background:url(../image/h3_step3.jpg) no-repeat center top;
}
body#startguide-tutorial-step4 #tutorial-block h3 {
	background:url(../image/h3_step4.jpg) no-repeat center top;
}
body#startguide-tutorial-step5 #tutorial-block h3 {
	background:url(../image/h3_step5.jpg) no-repeat center top;
}
body#startguide-tutorial-step6 #tutorial-block h3 {
	background:url(../image/h3_step6.jpg) no-repeat center top;
}
body#startguide-tutorial-step7 #tutorial-block h3 {
	background:url(../image/h3_step7.jpg) no-repeat center top;
}

/* -------------------------------------------------------------
会話
------------------------------------------------------------- */

#mainArea dl.talk {
	width: 620px;
	margin: 0 auto 10px;
	padding: 0;
	text-align: left;
}
#mainArea dl.talk dt {
	line-height: 0;
	font-size: 0;
	text-indent: -9999px;
}
#mainArea dl.talk dd {
	width: 505px;
	min-height: 80px;
	_height: 80px;
	display:block;
	line-height: 1.5;
}
#mainArea dl.talk dd.tanaka {
	background:url(../image/balloon_bg_t.gif) no-repeat right top;
	margin: 0 0 10px 0;
	padding: 0;
	float:left;
}
#mainArea dl.talk dd.tanaka p {
	width:380px;
	min-height: 70px;
	_height: 70px;
	margin: 0;
	padding:10px 15px 10px 110px;
}
#mainArea dl.talk dd.tanaka p.tanaka1 {
	background:url(../image/balloon_tanaka1.jpg) no-repeat right bottom;
}
#mainArea dl.talk dd.tanaka p.tanaka2 {
	background:url(../image/balloon_tanaka2.jpg) no-repeat right bottom;
}
#mainArea dl.talk dd.tanaka p.tanaka3 {
	background:url(../image/balloon_tanaka3.jpg) no-repeat right bottom;
}
#mainArea dl.talk dd.tanaka p.tanaka4 {
	background:url(../image/balloon_tanaka4.jpg) no-repeat right bottom;
}
#mainArea dl.talk dd.secretary {
	background:url(../image/balloon_bg_s.gif) no-repeat left top;
	margin: 0 0 10px 0;
	padding: 0;
	float:right;
}
#mainArea dl.talk dd.secretary p {
	width:380px;
	min-height: 70px;
	_height: 70px;
	margin: 0;
	padding:10px 110px 10px 15px;
}
#mainArea dl.talk dd.secretary p.yamada1 {
	background:url(../image/balloon_yamada1.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.yamada2 {
	background:url(../image/balloon_yamada2.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.yamada3 {
	background:url(../image/balloon_yamada3.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.yamada4 {
	background:url(../image/balloon_yamada4.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.sakamaki1 {
	background:url(../image/balloon_sakamaki1.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.sakamaki2 {
	background:url(../image/balloon_sakamaki2.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.sakamaki3 {
	background:url(../image/balloon_sakamaki3.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.sakamaki4 {
	background:url(../image/balloon_sakamaki4.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.shimamoto1 {
	background:url(../image/balloon_shimamoto1.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.shimamoto2 {
	background:url(../image/balloon_shimamoto2.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.shimamoto3 {
	background:url(../image/balloon_shimamoto3.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.shimamoto4 {
	background:url(../image/balloon_shimamoto4.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.hirahata1 {
	background:url(../image/balloon_hirahata1.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.hirahata2 {
	background:url(../image/balloon_hirahata2.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.hirahata3 {
	background:url(../image/balloon_hirahata3.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.hirahata4 {
	background:url(../image/balloon_hirahata4.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.mayar1 {
	background:url(../image/balloon_mayar1.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.mayar2 {
	background:url(../image/balloon_mayar2.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.mayar3 {
	background:url(../image/balloon_mayar3.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.mayar4 {
	background:url(../image/balloon_mayar4.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.kamikawa1 {
	background:url(../image/balloon_kamikawa1.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.kamikawa2 {
	background:url(../image/balloon_kamikawa2.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.kamikawa3 {
	background:url(../image/balloon_kamikawa3.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.kamikawa4 {
	background:url(../image/balloon_kamikawa4.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.wakazono1 {
	background:url(../image/balloon_wakazono1.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.wakazono2 {
	background:url(../image/balloon_wakazono2.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.wakazono3 {
	background:url(../image/balloon_wakazono3.jpg) no-repeat left bottom;
}
#mainArea dl.talk dd.secretary p.wakazono4 {
	background:url(../image/balloon_wakazono4.jpg) no-repeat left bottom;
}

/* -------------------------------------------------------------
TIPS
------------------------------------------------------------- */

#mainArea dl.tips {
	width: 640px;
	margin: 0 auto 10px;
	padding: 0;
	background:url(../image/tips_bg.gif) repeat-y center top;
	text-align: left;
	clear:both;
}

#mainArea dl.tips dt {
	width: 640px;
	height: 29px;
	margin: 0 auto;
	background:url(../image/tips_top.gif) no-repeat center top;
	line-height: 0;
	font-size: 0;
	text-indent: -9999px;
}

#mainArea dl.tips dd {
	background:url(../image/tips_bottom.gif) no-repeat center bottom;
	padding-bottom: 20px;
}

/* TIPS内部 */

#mainArea dl.tips p {
	margin:10px 20px 0px;
}

#mainArea dl.tips table {
	background:#CDCDCD;
	border-collapse:separate;
	border-spacing:3px;
	margin:0px auto 0px;
}

body#startguide-tutorial-step1 #mainArea dl.tips table {
	width:600px;
}

#mainArea dl.tips table th {
	background:#666;
	padding:10px;
	text-align:center;
	font-weight:bold;
	color:#FFF;
	white-space: nowrap;
}

#mainArea dl.tips table td {
	background:#FFF;
	padding:8px 8px 10px;
	text-align:left;
}

#mainArea dl.tips table td.center {
	text-align:center;
	white-space: pre;
}

#mainArea dl.tips ul {
	margin:0 auto 0 30px;
}
#mainArea dl.tips li {
	display:inline;
}

/* -------------------------------------------------------------
ページ遷移
------------------------------------------------------------- */
ul#pager-tutorial {
	width:620px;
	height:70px;
	margin:0 auto 20px;
	padding:0;
}

ul#pager-tutorial li {
	height:70px;
	display:inline;
	text-decoration:none;
	text-indent:-9999px;
	font-size:0;
	line-height:0;
	float:left;
}

ul#pager-tutorial li#pagerBack {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat 0 -420px;
}

ul#pager-tutorial li#pagerTop {
	width:110px;
	margin:0 5px 0;
}

ul#pager-tutorial li#pagerNext {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat -250px -420px;
}

ul#pager-tutorial li a {
	height:70px;
	display:block;
	text-decoration:none;
	text-indent:-9999px;
	font-size:0;
	line-height:0;
}


/*前へ*/
body#startguide-tutorial-step2 ul#pager-tutorial li#pagerBack a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat 0 -350px;
}

body#startguide-tutorial-step2 ul#pager-tutorial li#pagerBack a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -500px -350px;
}

body#startguide-tutorial-step3 ul#pager-tutorial li#pagerBack a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat 0 0;
}

body#startguide-tutorial-step3 ul#pager-tutorial li#pagerBack a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -500px 0;
}

body#startguide-tutorial-step4 ul#pager-tutorial li#pagerBack a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat 0 -70px;
}

body#startguide-tutorial-step4 ul#pager-tutorial li#pagerBack a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -500px -70px;
}

body#startguide-tutorial-step5 ul#pager-tutorial li#pagerBack a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat 0 -140px;
}

body#startguide-tutorial-step5 ul#pager-tutorial li#pagerBack a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -500px -140px;
}

body#startguide-tutorial-step6 ul#pager-tutorial li#pagerBack a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat 0 -210px;
}

body#startguide-tutorial-step6 ul#pager-tutorial li#pagerBack a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -500px -210px;
}

body#startguide-tutorial-step7 ul#pager-tutorial li#pagerBack a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat 0 -280px;
}

body#startguide-tutorial-step7 ul#pager-tutorial li#pagerBack a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -500px -280px;
}


/*次へ*/
body#startguide-tutorial-step1 ul#pager-tutorial li#pagerNext a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat -250px 0;
}

body#startguide-tutorial-step1 ul#pager-tutorial li#pagerNext a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -750px 0;
}

body#startguide-tutorial-step2 ul#pager-tutorial li#pagerNext a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat -250px -70px;
}

body#startguide-tutorial-step2 ul#pager-tutorial li#pagerNext a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -750px -70px;
}

body#startguide-tutorial-step3 ul#pager-tutorial li#pagerNext a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat -250px -140px;
}

body#startguide-tutorial-step3 ul#pager-tutorial li#pagerNext a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -750px -140px;
}

body#startguide-tutorial-step4 ul#pager-tutorial li#pagerNext a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat -250px -210px;
}

body#startguide-tutorial-step4 ul#pager-tutorial li#pagerNext a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -750px -210px;
}

body#startguide-tutorial-step5 ul#pager-tutorial li#pagerNext a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat -250px -280px;
}

body#startguide-tutorial-step5 ul#pager-tutorial li#pagerNext a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -750px -280px;
}

body#startguide-tutorial-step6 ul#pager-tutorial li#pagerNext a {
	width:250px;
	background:url(../image/btn_pager.jpg) no-repeat -250px -350px;
}

body#startguide-tutorial-step6 ul#pager-tutorial li#pagerNext a:hover {
	background:url(../image/btn_pager.jpg) no-repeat -750px -350px;
}

/*目次へ戻る*/
ul#pager-tutorial li#pagerTop a {
	width:110px;
	background:url(../image/btn_pager.jpg) no-repeat -500px -420px;
}

ul#pager-tutorial li#pagerTop a:hover {
	width:110px;
	background:url(../image/btn_pager.jpg) no-repeat -610px -420px;
}