@charset "utf-8"; 
/* playguide.css */

/********************************************************************

	BEGINNER GUIDE
	  
********************************************************************/

/*beginner guide navi*/
.mainArea{ width:760px; padding:0; float:right;}
.mainArea .navBeginner{ height:90px; margin: 9px 10px 0;}
.mainArea .navBeginner li{ float:left;}
.mainArea .navBeginner li a{ height:90px; display:block; text-indent:-9999px; overflow:hidden; background:url(http://images.plaync.jp/bluetears/guide/nav_beginner.jpg) no-repeat;}

.mainArea .navBeginner li.begi1 a { width:124px; background-position: 0 0;}
.mainArea .navBeginner li.begi1 a:hover { background-position: 0 -90px;}
.mainArea .navBeginner li.begi1.bs1 a { background-position: 0 -90px;}

.mainArea .navBeginner li.begi2 a { width:122px; background-position: -124px 0;}
.mainArea .navBeginner li.begi2 a:hover { background-position: -124px -90px;}
.mainArea .navBeginner li.begi2.bs2 a { background-position: -124px -90px;}

.mainArea .navBeginner li.begi3 a { width:125px; background-position: -246px 0;}
.mainArea .navBeginner li.begi3 a:hover { background-position: -246px -90px;}
.mainArea .navBeginner li.begi3.bs3 a { background-position: -246px -90px;}

.mainArea .navBeginner li.begi4 a { width:123px; background-position: -371px 0;}
.mainArea .navBeginner li.begi4 a:hover { background-position: -371px -90px;}
.mainArea .navBeginner li.begi4.bs4 a { background-position: -371px -90px;}

.mainArea .navBeginner li.begi5 a { width:125px; background-position: -494px 0;}
.mainArea .navBeginner li.begi5 a:hover { background-position: -494px -90px;}
.mainArea .navBeginner li.begi5.bs5 a { background-position: -494px -90px;}

.mainArea .navBeginner li.begi6 a { width:121px; background-position: -619px 0;}
.mainArea .navBeginner li.begi6 a:hover { background-position: -619px -90px;}
.mainArea .navBeginner li.begi6.bs6 a { background-position: -619px -90px;}


/*beginner guide contents wrap*/
.mainArea .pgArea{ width:700px; padding: 40px 31px 100px 29px; font-size:13px; color:#252525; line-height:1.5;}

/*title*/
.pgArea h2.tn{ display:none;}

/*nav*/
.pgArea .nav { height:214px; margin-bottom:25px;} 
.pgArea .nav li { float:left;}
.pgArea .nav li a { height:177px; display:block; text-indent:-9999px; overflow:hidden; background:url(http://images.plaync.jp/bluetears/guide/nav2.jpg) no-repeat;}

.pgArea .nav li.step1 a { width:172px; margin-right:17px; background-position: 0 0;}
.pgArea .nav li.step1 a:hover { background-position: 0 -177px;}
.pgArea .nav li.step1.a1 a { background-position: 0 -177px;}

.pgArea .nav li.step2 a { width:167px; margin-right:16px; background-position: -172px 0;}
.pgArea .nav li.step2 a:hover { background-position: -172px -177px;}
.pgArea .nav li.step2.a2 a { background-position: -172px -177px;}

.pgArea .nav li.step3 a { width:167px; margin-right:18px; background-position: -339px 0;}
.pgArea .nav li.step3 a:hover { background-position: -339px -177px;}
.pgArea .nav li.step3.a3 a { background-position: -339px -177px;}

.pgArea .nav li.step4 a { width:143px; background-position: -506px 0;}
.pgArea .nav li.step4 a:hover { background-position: -506px -177px;}
.pgArea .nav li.step4.a4 a { background-position: -506px -177px;}

.pgArea .nav .desc { height:37px; clear:both; position:relative;}
.pgArea .nav .desc span { text-indent:-9999px; display:block; position:absolute; top:3px;}
.pgArea .nav .desc .d1 { width:458px; height:14px; left:0; background:url(http://images.plaync.jp/bluetears/guide/nav_t1.gif) no-repeat;}
.pgArea .nav .desc .d2 { width:200px; height:12px; left:168px; background:url(http://images.plaync.jp/bluetears/guide/nav_t2.gif) no-repeat;}
.pgArea .nav .desc .d3 { width:371px; height:28px; left:271px; background:url(http://images.plaync.jp/bluetears/guide/nav_t3.gif) no-repeat;}
.pgArea .nav .desc .d4 { width:276px; height:12px; left:425px; background:url(http://images.plaync.jp/bluetears/guide/nav_t4.gif) no-repeat;}

/*table base*/
.pgArea .table1 table { width:100%; border-collapse: collapse;}
.pgArea .table1 th { padding:10px 0; background: #ff4b2b; border:1px solid #ffb3b3; color:#fff;}
.pgArea .table1 td { padding:10px; border:1px solid #ffb3b3; color:#2a2520; font-size:13px;}
.pgArea .table1 tr.even { background:#ffefec;}

/************ playGuide begginer step1 ************/
#begginerStep1 { padding-top:20px;}/*mainID*/

#begginerStep1 .leftBox { width:600px; margin:0 0 45px 0;}
#begginerStep1 .leftBox .txt { margin-right:31px;} 
#begginerStep1 .rightBox { width:600px; margin: 0 0 45px 100px; position:relative;}
#begginerStep1 .rightBox h3 { text-align:right;}
#begginerStep1 .rightBox .txt { margin-left:41px;}
#begginerStep1 .rightBox .chara { position:absolute; left:-96px; bottom:-92px;}

#begginerStep1 .ss { margin-bottom:10px;}
#begginerStep1 .sp1 { margin-bottom:20px;}

#begginerStep1 .table1 { width:560px;}
#begginerStep1 .table1 th.i { width:80px;}
#begginerStep1 .table1 th.c { width:320px;}
#begginerStep1 .table1 th.j,
#begginerStep1 .table1 td.j { width:120px;}
#begginerStep1 .table1 td strong { margin-bottom:5px; display:block; color:#ff4b2b;}

/************ playGuide begginer step2 ************/
#begginerStep2 { padding-top:20px;}/*mainID*/
#begginerStep2 table { width:100%;}
#begginerStep2 tr { background:url(http://images.plaync.jp/bluetears/guide/line1.gif) repeat-x 0 bottom;}
#begginerStep2 tr.bN { background:none;} 
#begginerStep2 th { width:200px; padding: 25px 0 25px 10px; font-size:17px; text-align:left;}
#begginerStep2 th span { display:inline-block; height:29px; background:url(http://images.plaync.jp/bluetears/guide/icon_g.gif) no-repeat 0 0; padding-left:33px; line-height:27px;} 
#begginerStep2 td { width:490px; padding: 25px 0; font-size:13px;}
#begginerStep2 td.img { padding:0 0 10px 0;}
#begginerStep2 td.info { padding: 40px 0;}
#begginerStep2 td.system { padding: 55px 0;}
#begginerStep2 td.system p { position:relative;}
#begginerStep2 td.system span { position:absolute; top:-106px; right:17px; display:block;}

/************ playGuide begginer step3 ************/
#begginerStep3 { padding-top:20px;}/*mainID*/

#begginerStep3 .sectionS3 { margin-bottom:50px; clear:both;}
#begginerStep3 .sectionS3:after{content:url(http://images.plaync.jp/bluetears/common/image/spacer.gif);display:block;clear:both;height:0;}
#begginerStep3 .sectionS3 {display:inline-block;}
#begginerStep3 .sectionS3 {display:block;}

/*table*/
#begginerStep3 .table1 th.titKey { width:110px;}
#begginerStep3 .table1 th.desc { width:585px;}
#begginerStep3 .table1 th.hyper { width:200px;}
#begginerStep3 .table1 th.class { width:120px;}
#begginerStep3 .table1 th.desc2 { width:374px;}

#begginerStep3 .table1 td.key { text-align:center; font-weight:bold;}
#begginerStep3 .table1 td.key.c1 { color:#679938;}
#begginerStep3 .table1 td.key.c2 { color:#d74373;}
#begginerStep3 .table1 td.key.c3 { color:#dbb41c;}
#begginerStep3 .table1 td.key.c4 { color:#2db4ca;}
#begginerStep3 .table1 td.hm { padding:6px;}
#begginerStep3 .table1 td.tcb { text-align:center; font-weight:bold;}

#begginerStep3 .at1 { color:#ff4b2b;}
#begginerStep3 .sp1 { margin-bottom:10px;}
#begginerStep3 .imgArea { float:left;}
#begginerStep3 .descArea { margin-left:288px;}

/************ playGuide begginer step3 ************/
#begginerStep4 { padding-top:20px;}/*mainID*/
#begginerStep4 .descBox { height:64px; padding:10px 0 0 150px; background:url(http://images.plaync.jp/bluetears/guide/img_t_1.gif) no-repeat;}/*mainID*/

/*table*/
#begginerStep4 .table1 th.command { width:90px;}
#begginerStep4 .table1 th.enter { width:410px;}
#begginerStep4 .table1 th.desc { width:180px;}
#begginerStep4 .table1 td.tcb { text-align:center; font-weight:bold;}

/************ playGuide goQuest ************/
#goQuest {}/*mainID*/
#goQuest h2 { height:246px; background:url(http://images.plaync.jp/bluetears/guide/tit_gq_1.jpg) no-repeat; text-indent:-9999px;}
#goQuest .sectionGq1 { margin-bottom:50px; background:url(http://images.plaync.jp/bluetears/guide/tit_gq_2.jpg) no-repeat;}
#goQuest .sectionGq1 h3 { height:158px; text-indent:-9999px;}
#goQuest .sectionGq1 p { margin-bottom:20px;}

#goQuest .sectionGq2 { margin-bottom:45px;}
#goQuest .sectionGq2 h3 { height:257px; margin-bottom:20px; text-indent:-9999px; background:url(http://images.plaync.jp/bluetears/guide/tit_gq_3.jpg) no-repeat;}
#goQuest .sectionGq2 dl { margin-left:144px;}
#goQuest .sectionGq2 dt { font-weight:bold;}
#goQuest .sectionGq2 dd { margin-bottom:25px;}

#goQuest .sectionGq3 { background:url(http://images.plaync.jp/bluetears/guide/tit_gq_4.jpg) no-repeat;}
#goQuest .sectionGq3 h3 { height:125px; text-indent:-9999px;}
#goQuest .sectionGq3 .txt { width:384px; margin-bottom:25px;}
#goQuest .sectionGq3 .img { margin-bottom:20px;}

/*table*/
#goQuest .table1 th.i { width:80px;}
#goQuest .table1 th.c { width:450px;}
#goQuest .table1 th.j,
#goQuest .table1 td.j { width:130px;}
#goQuest .table1 td strong { margin-bottom:5px; display:block; color:#ff4b2b;}

/************ playGuide goPlayHint ************/
#goPlayHint {}/*mainID*/
#goPlayHint h2 { height:213px; background:url(http://images.plaync.jp/bluetears/guide/tit_ph_1.jpg) no-repeat; text-indent:-9999px;}
#goPlayHint .sectionPh1 { margin-bottom:30px;}
#goPlayHint .sectionPh1 h3 { height:32px; background:url(http://images.plaync.jp/bluetears/guide/tit_ph_2.jpg) no-repeat; text-indent:-9999px;}
#goPlayHint .sectionPh1 .tb { width:560px;}

#goPlayHint .sectionImgBox { margin-bottom:45px; clear:both;}
#goPlayHint .sectionImgBox:after{content:url(http://images.plaync.jp/bluetears/common/image/spacer.gif);display:block;clear:both;height:0;}
#goPlayHint .sectionImgBox {display:inline-block;}
#goPlayHint .sectionImgBox {display:block;}
#goPlayHint .imgArea { float:left;}
#goPlayHint .descArea { margin-left:292px;}
#goPlayHint .descArea strong { color:#f80c28;}
#goPlayHint .descArea.bIcon { width:400px; padding-top:80px; position:relative;}
#goPlayHint .descArea.bIcon span { display:block; position:absolute; top:-44px; right:0;}

#goPlayHint .sectionPh2 { margin-bottom:90px; background:url(http://images.plaync.jp/bluetears/guide/tit_ph_8.jpg) no-repeat;}
#goPlayHint .sectionPh2 h3 { height:134px; text-indent:-9999px;}
#goPlayHint .sectionPh2 p { margin-left:137px;}

#goPlayHint .sectionPh3 h3 { height:368px; margin-bottom:15px; background:url(http://images.plaync.jp/bluetears/guide/tit_ph_9.jpg) no-repeat; text-indent:-9999px;}
#goPlayHint .sectionPh3 p.sp1 { margin-bottom:30px;}

/*table*/
#goPlayHint .table1 th.image { width:260px;}
#goPlayHint .table1 th.job { width:220px;}
#goPlayHint .table1 th.desc { width:220px;}
#goPlayHint .table1 td.tc { text-align:center;}


/********************************************************************

	CLASS GUIDE
	  
********************************************************************/

/************ classguide common ************/
/*.mainArea{ width:760px; padding:0; float:right;}*/
.mainArea .nav_cg{ height:90px; margin: 9px 10px 0;}
.mainArea .nav_cg li{ float:left;}
.mainArea .nav_cg li a{ width:246px; height:90px; display:block; text-indent:-9999px; overflow:hidden; background:url(http://images.plaync.jp/bluetears/guide/class/nav_cg.jpg) no-repeat;}
.mainArea .nav_cg li.class1 a { width:248px; background-position: 0 0;}
.mainArea .nav_cg li.class1 a:hover { background-position: 0 -90px;}
.mainArea .nav_cg li.class1.select1 a { background-position: 0 -90px;}
.mainArea .nav_cg li.class2 a { background-position: -248px 0;}
.mainArea .nav_cg li.class2 a:hover { background-position: -248px -90px;}
.mainArea .nav_cg li.class2.select2 a { background-position: -248px -90px;}
.mainArea .nav_cg li.class3 a { background-position: -494px 0;}
.mainArea .nav_cg li.class3 a:hover { background-position: -494px -90px;}
.mainArea .nav_cg li.class3.select3 a { background-position: -494px -90px;}

/*class guide contents wrap*/
#cgWrap { padding: 0 0 100px; color:#252525; font-size:13px;line-height:1.6;} 
.bgClassGuide1 { background:url(http://images.plaync.jp/bluetears/guide/class/bg_img_w1.jpg) no-repeat right top;}
.bgClassGuide2 { background:url(http://images.plaync.jp/bluetears/guide/class/bg_img_m1.jpg) no-repeat right top;}
.bgClassGuide3 { background:url(http://images.plaync.jp/bluetears/guide/class/bg_img_a1.jpg) no-repeat right top;}
#cgWrap .cgInner { padding: 0 33px;}

/*sectionMain*/
#cgWrap .sectionMain { margin: 0 0 42px; color:#4e4e4e; font-size:14px;}
#cgWrap .sectionMain.class1 { padding-top:100px;}
#cgWrap .sectionMain.class2 { padding-top:100px;}
#cgWrap .sectionMain.class3 { padding-top:100px;}

/*section1*/
#cgWrap .section1 { margin-bottom:35px;}
#cgWrap .section1 h3 { margin-bottom:6px;}

/*sectionImg*/
#cgWrap .sectionImg { margin-bottom:40px;}
#cgWrap .sectionImg:after{content:url(http://images.plaync.jp/bluetears/common/image/spacer.gif);display:block;clear:both;height:0;}
#cgWrap .sectionImg {display:inline-block;}
#cgWrap .sectionImg {display:block;}
#cgWrap .sectionImg h3 { margin-bottom:6px;}
#cgWrap .sectionImg .imgArea { width:214px; float:left;}
#cgWrap .sectionImg .descArea { margin-left:230px;}

/*bnrArea*/
#cgWrap .bnrArea { margin-bottom:37px;}

/*.rBox*/
#cgWrap .rBox { margin:0 53px; padding-bottom:15px; background: url(http://images.plaync.jp/bluetears/guide/class/bg_bottom.gif) no-repeat 0 bottom;}
#cgWrap .rBox.boxTop { margin-bottom:40px;}
#cgWrap .rBox .rBoxInn { padding: 0 31px 0 30px; background: url(http://images.plaync.jp/bluetears/guide/class/bg_repeat.gif);}

/*section2*/
#cgWrap .rBox .section2 { padding-bottom:30px;}
#cgWrap .rBox .section2.sp1 { padding-bottom:10px;}
#cgWrap .rBox .section2 h3 { margin-bottom:10px;}
#cgWrap .rBox .section2 .sp2 { margin-bottom:20px;}

/*movArea*/
#cgWrap .rBox .movArea { zoom:1;}
#cgWrap .rBox .movArea .movie { width:407px; height:335px; padding:8px; border:1px solid #e2e2e2; float:left;}

#cgWrap .rBox .movArea .thumb { width:168px; float:left;}
#cgWrap .rBox .movArea .thumb li { margin-bottom:3px; font-size:12px; color:#4d4d4d;}
#cgWrap .rBox .movArea .thumb li span { margin-left:22px; text-indent:-0.08em; font-size:11px;}
#cgWrap .rBox .movArea .thumb li a { width:168px; height:99px; display:block; text-indent:-9999px; overflow:hidden;}
#cgWrap .rBox .movArea .thumb li a:hover { background-position: 0 -99px!important;}
#cgWrap .rBox .movArea .thumb li.active a { background-position: 0 -99px!important;}

#cgWrap .rBox .movArea .thumb li.rMov1 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_r1.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.rMov2 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_r2.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.rMov3 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_r3.jpg) no-repeat;}

#cgWrap .rBox .movArea .thumb li.tMov1 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_t1.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.tMov2 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_t2.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.tMov3 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_t3.jpg) no-repeat;}

#cgWrap .rBox .movArea .thumb li.sMov1 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_s1.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.sMov2 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_s2.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.sMov3 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_s3.jpg) no-repeat;}

#cgWrap .rBox .movArea .thumb li.dMov1 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_d1.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.dMov2 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_d2.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.dMov3 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_d3.jpg) no-repeat;}

#cgWrap .rBox .movArea .thumb li.soMov1 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_so1.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.soMov2 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_so2.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.soMov3 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_so3.jpg) no-repeat;}

#cgWrap .rBox .movArea .thumb li.alMov1 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_al1.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.alMov2 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_al2.jpg) no-repeat;}
#cgWrap .rBox .movArea .thumb li.alMov3 a { background: url(http://images.plaync.jp/bluetears/guide/class/thumb_al3.jpg) no-repeat;}

#cgWrap .rBox .movArea .list { padding:10px 0; clear:both;}