@charset "utf-8";



/* CSS Document */







#header-bar #sample {

	display: block;

}



#header-bar #msg-china {

	display: none;

}



#header #btn-inquiry {



	width: 223px;



	height: 53px;



	position: absolute;



	top: 20px;



	right: 10px;



	z-index: 1;



}







#header #btn-inquiry a {



	width: 223px;



	height: 53px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/btn-inquiry.png) no-repeat;



}







#header #btn-inquiry a:hover {



	background-position: left bottom;



}











/*  gnavi



=======================================================*/







#gnavi {



	margin: 0 auto;



	width: 970px;



	height: 50px;



}







#gnavi li {



	height: 50px;



	float: left;



}







#gnavi #gnavi01 a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi01.jpg) no-repeat;



}







#gnavi #gnavi02 a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi02.jpg) no-repeat;



}







#gnavi #gnavi03 a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi03.jpg) no-repeat;



}







#gnavi #gnavi04 a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi04.jpg) no-repeat;



}







#gnavi #gnavi05 a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi05.jpg) no-repeat;



}







#gnavi #gnavi06 a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi06.jpg) no-repeat;



}







#gnavi #gnavi01_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi01.jpg) left bottom no-repeat;



}







#gnavi #gnavi02_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi02.jpg) left bottom no-repeat;



}







#gnavi #gnavi03_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi03.jpg) left bottom no-repeat;



}







#gnavi #gnavi04_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi04.jpg) left bottom no-repeat;



}







#gnavi #gnavi05_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi05.jpg) left bottom no-repeat;



}







#gnavi #gnavi06_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi06.jpg) left bottom no-repeat;



}







#gnavi #gnavi01 a:hover {



	background-position: left bottom;



}







#gnavi #gnavi02 a:hover {



	background-position: left bottom;



}







#gnavi #gnavi03 a:hover {



	background-position: left bottom;



}







#gnavi #gnavi04 a:hover {



	background-position: left bottom;



}







#gnavi #gnavi05 a:hover {



	background-position: left bottom;



}







#gnavi #gnavi06 a:hover {



	background-position: left bottom;



}







#gnavi2 {



	margin: 0 auto;



	width: 970px;



	height: 50px;



}







#gnavi2 #gnavi-l {



	width: 595px;



	height: 50px;



	float: left;



}







#gnavi2 #gnavi-r {



	width: 370px;



	height: 50px;



	float: right;



}







#gnavi-l li {



	height: 50px;



	float: left;



}







#gnavi-r li {




	height: 50px;



	float: left;



}







#gnavi2 #gnavi-l01 a {


	width: 595px;
	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/gnavi/l01.png) no-repeat;



}




#gnavi2 #gnavi-r01 a {
	width: 118px;
	height: 50px;
	font-size: 0;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	background: url(../img/gnavi/r01.png) no-repeat;
}


#gnavi2 #gnavi-r02 a {
	width: 112px;
	height: 50px;
	font-size: 0;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	background: url(../img/gnavi/r02.png) no-repeat;
}

#gnavi2 #gnavi-r03 a {
	width: 139px;
	height: 50px;
	font-size: 0;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	background: url(../img/gnavi/r03.png) no-repeat;
}















#gnavi2 #gnavi-l01_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi-l01.jpg) left bottom no-repeat;



}







#gnavi2 #gnavi-l02_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi-l02.jpg) left bottom no-repeat;



}







#gnavi2 #gnavi-l03_on a {



	width: 188px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi-l03.jpg) left bottom no-repeat;



}







#gnavi2 #gnavi-r01_on a {



	width: 180px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi-r01.jpg) left bottom no-repeat;



}







#gnavi2 #gnavi-r02_on a {



	width: 180px;



	height: 50px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../../member/img/gnavi-r02.jpg) left bottom no-repeat;



}







#gnavi2 #gnavi-l01 a:hover {



	background-position: left bottom;



}







#gnavi2 #gnavi-l02 a:hover {



	background-position: left bottom;



}







#gnavi2 #gnavi-l03 a:hover {



	background-position: left bottom;



}







#gnavi2 #gnavi-r01 a:hover {



	background-position: left bottom;



}







#gnavi2 #gnavi-r02 a:hover {



	background-position: left bottom;



}











/*  layout(input-btn)



=============================*/







input#cancel-btn {



	width: 168px;



	height: 52px;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	cursor: pointer;



	background: url(../img/btn-cancel.jpg) no-repeat;



	border: none;



}







input#cancel-btn:hover {



	background-position: left bottom;



}







input#renew-btn {



	width: 168px;



	height: 52px;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	cursor: pointer;



	background: url(../img/btn-renew.jpg) no-repeat;



	border: none;



}







input#renew-btn:hover {



	background-position: left bottom;



}















/*  member



=============================*/







#main #records-wrap {



	width: 700px;



	height: 72px;



	background: url(../img/records-bg2.jpg) no-repeat;



	position: relative;



}







#btn-olympic {



	margin: 0 auto;



	width: 500px;



	height: 100px;



}







#btn-olympic a {



	width: 500px;



	height: 100px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-olympic.png) no-repeat;



}







#btn-olympic a:hover {



	background-position: left bottom;



}







.prg-cate .prg-btn {



	margin: 10px auto 0;



	width: 345px;



	height: 49px;



}







.prg-cate .prg-btn a {



	width: 345px;



	height: 49px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-detail.jpg) no-repeat;



}







.prg-cate .prg-btn a:hover {



	background-position: left bottom;



}







#prg-panel #prg-btn01, #prg-panel #prg-btn02 {



	margin-bottom: 20px;



	width: 236px;



	height: 56px;



}







#prg-panel #prg-btn03, #prg-panel #prg-btn04 {



	width: 236px;



	height: 56px;



}







#prg-panel #prg-btn01 a {



	width: 236px;



	height: 56px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-prg-menu01.jpg) no-repeat;



}







#prg-panel #prg-btn01 a:hover {



	background-position: left bottom;



}







#prg-panel #prg-btn02 a {



	width: 236px;



	height: 56px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-prg-menu02.jpg) no-repeat;



}







#prg-panel #prg-btn02 a:hover {



	background-position: left bottom;



}







#prg-panel #prg-btn03 a {



	width: 236px;



	height: 56px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-prg-menu03.jpg) no-repeat;



}







#prg-panel #prg-btn03 a:hover {



	background-position: left bottom;



}







#prg-panel #prg-btn04 a {



	width: 236px;



	height: 56px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-prg-menu04.jpg) no-repeat;



}







#prg-panel #prg-btn04 a:hover {



	background-position: left bottom;



}







#about-img {



	margin: 20px auto 0;



	width: 940px;



	height: 159px;



	background: url(../img/img-about.jpg) no-repeat;



	position: relative;



}







#about-img #btn-material2 {



	width: 264px;



	height: 74px;



	position: relative;



	top: 70px;



	left: 650px;



}







#btn-material2 a {



	width: 264px;



	height: 74px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-material2.jpg) no-repeat;



}







#btn-material2 a:hover {



	background-position: left bottom;



}







#select-contents {



	margin: 0 auto;



	width: 640px;



	height: 74px;



}







#select-contents #select-sentence {



	width: 304px;



	height: 74px;



	float: left;



}







#select-contents #select-movie {



	width: 304px;



	height: 74px;



	float: right;



}







#select-contents #select-sentence a {



	width: 304px;



	height: 74px;



	font-size: 0px;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-select01.jpg) no-repeat;



}







#select-contents #select-movie a {



	width: 304px;



	height: 74px;



	font-size: 0px;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-select02.jpg) no-repeat;



}







#select-contents #select-sentence a:hover, #select-contents #select-movie a:hover {



	background-position: left bottom;



}











/*  member(login)



=============================*/







.btn-area #btn-login {



	width: 168px;



	height: 42px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-login3.jpg) no-repeat;



	cursor: pointer;



	border: none;



}







.btn-area #btn-login:hover {



	background-position: left bottom;



}







.btn-area #btn-send {



	width: 168px;



	height: 42px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-send.jpg) no-repeat;



	cursor: pointer;



	border: none;



}







.btn-area #btn-send:hover {



	background-position: left bottom;



}







#btn-back a {



	width: 168px;



	height: 42px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-back.jpg) no-repeat;



}







#btn-back a:hover {



	background-position: left bottom;



}







.trial-btn {



	margin: 10px auto 0;



	width: 345px;



	height: 49px;



}







.trial-btn a {



	width: 345px;



	height: 49px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-trial.png) no-repeat;



}







.trial-btn a:hover {



	background-position: left bottom;



}















/*  training



=============================*/







#training-box1 .training-title, #training-box2 .training-title, #training-box3 .training-title {



	margin: 20px 0 0 10px;



	padding-top: 5px;



	width: 170px;



	min-height: 28px;



	font-size: 12px;



	font-weight: bold;



	text-align: left;



	text-indent: 25px;



	vertical-align: middle;



	background: url(../img/icon-training.jpg) no-repeat;



	float: left;



}







.btn-level01, .btn-level02, .btn-level03, .btn-level04 {



	margin-right: 5px;



	width: 98px;



	height: 49px;



	float: left;



}







.btn-level05 {



	width: 98px;



	height: 49px;



	float: left;



}







.btn-level01 a {



	width: 98px;



	height: 49px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-level01.png) no-repeat;



}







.btn-level02 a {



	width: 98px;



	height: 49px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-level02.png) no-repeat;



}







.btn-level03 a {



	width: 98px;



	height: 49px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-level03.png) no-repeat;



}







.btn-level04 a {



	width: 98px;



	height: 49px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-level04.png) no-repeat;



}







.btn-level05 a {



	width: 98px;



	height: 49px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-level05.png) no-repeat;



}







.btn-level01 a:hover, .btn-level02 a:hover, .btn-level03 a:hover,



.btn-level04 a:hover, .btn-level05 a:hover {



	background-position: left bottom;



}







.step-box .step01 a, .step-box .step01 span {



	width: 148px;



	height: 77px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-step01.jpg) no-repeat;



}







.step-box .step02 a, .step-box .step02 span {



	width: 148px;



	height: 77px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-step02.jpg) no-repeat;



}







.step-box .step03 a, .step-box .step03 span {



	width: 148px;



	height: 77px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-step03.jpg) no-repeat;



}







.step-box .step04 a, .step-box .step04 span {



	width: 148px;



	height: 77px;



	font-size: 0;



	display: block;



	text-indent: -9999px;



	overflow: hidden;



	background: url(../img/btn-step04.jpg) no-repeat;



}







.step-box .step01 a:hover, .step-box .step02 a:hover, .step-box .step03 a:hover,



.step-box .step04 a:hover, .step-box .step05 a:hover {



	background-position: left bottom;



}





#jr-head-r #jr-navi {

	width: 400px;

	height: 48px;

}



#jr-navi #jr-navi01, #jr-navi #jr-navi02 {

	margin-right: 5px;

	width: 127px;

	height: 48px;

	float: left;

}



#jr-navi #jr-navi03 {

	float: left;

}



#jr-navi #jr-navi01 a {

	width: 127px;

	height: 48px;

	font-size: 0;

	display: block;

	text-indent: -9999px;

	overflow: hidden;

	background: url(../img/jr-navi01.jpg) no-repeat;

}



#jr-navi #jr-navi02 a {

	width: 127px;

	height: 48px;

	font-size: 0;

	display: block;

	text-indent: -9999px;

	overflow: hidden;

	background: url(../img/jr-navi02.jpg) no-repeat;

}



#jr-navi #jr-navi03 a {

	width: 127px;

	height: 48px;

	font-size: 0;

	display: block;

	text-indent: -9999px;

	overflow: hidden;

	background: url(../img/jr-navi03.jpg) no-repeat;

}



#jr-navi #jr-navi01 a:hover, #jr-navi #jr-navi02 a:hover, #jr-navi #jr-navi03 a:hover {

	background-position: left bottom;

}





#jr-step #btn-step01 a {

	width: 148px;

	height: 96px;

	font-size: 0;

	display: block;

	text-indent: -9999px;

	overflow: hidden;

	background: url(../img/step-btn01.png) no-repeat;

}



#jr-step #btn-step02 a {

	width: 148px;

	height: 96px;

	font-size: 0;

	display: block;

	text-indent: -9999px;

	overflow: hidden;

	background: url(../img/step-btn02.png) no-repeat;

}



#jr-step #btn-step03 a {

	width: 148px;

	height: 96px;

	font-size: 0;

	display: block;

	text-indent: -9999px;

	overflow: hidden;

	background: url(../img/step-btn03.png) no-repeat;

}



#jr-step #btn-step01 a:hover, #jr-step #btn-step02 a:hover, #jr-step #btn-step03 a:hover {

	background-position: left bottom;

}







.sbnr-com2 {

	width: 210px;

	height: 60px;

}



.sbnr-com2 a {

	width: 210px;

	height: 122px;

	font-size: 0;

	display: block;

	text-indent: -9999px;

	overflow: hidden;

	background: url(../img/sbnr-sample.jpg) no-repeat;

}



.sbnr-com2 a:hover {

	background-position: left bottom;

}