@charset "utf-8";
/* CSS Document */

.error{
	margin:10px 0;
}

/*-------about-------*/
.newMember{
	border:4px #e5e5e5 solid;
	padding:30px 0 5px 0;
}
.newMember dt{
	font-size:112.5%;
	font-weight:bold;
	text-align:center;
}
.newMember dt .lineYellow{
	font-size:166.7%;
	color:#4b5ed9;
}
.newMember dd{
	padding:0 0 25px 0;
	text-align:center;
}
.newMember .btnArrowPink span{
	display:block;
	padding:22px 0;
	height:auto;
	font-size:156.3%;
}

/*-------regist-----------*/
.stepFlow{
  overflow: hidden;
  width: 100%;
		display:table;
		background:#e6e6e6;
}
.stepFlow li{
	border-top:2px #e6e6e6 solid;
	border-bottom:2px #e6e6e6 solid;
	display:table-cell;
	background:#FFFFFF;
	vertical-align:middle;
}
.stepFlow li:first-child{
	border-left:2px #e6e6e6 solid;
}
.stepFlow li:last-child{
	border-right:2px #e6e6e6 solid;
}
.stepFlow li p{
  padding: .6em 1.25em .6em 3.4em;
  float: left;
		color:#787878;
  position: relative;
		text-align:center;
		line-height:1.4em;
}
.stepFlow li:first-child p{
  padding-left: 2em;
}
.stepFlow li p::after,
.stepFlow li p::before{
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -2.1em;
  border-top: 2.1em solid transparent;
  border-bottom: 2.15em solid transparent;
  border-left: 1.8em solid;
  right: -2.1em;
}
.stepFlow li p::before{
  border-left-color: #e6e6e6;
  right: -2.25em;
  z-index: 1;
}  
.stepFlow li p::after{
  z-index: 2;
  border-left-color: #fff;
}
.stepFlow li span{
	color:#a0a0a0;
	font-size:75%;
}
 
.stepFlow li.stay{
	color:#505050;
	background:#e6e6e6;
}
.stepFlow li.stay p::after{
  border-left-color: #e6e6e6;
}
.stepFlow li.stay span{
	color:#505050;
}

.stepFlow li:last-child p{
  padding-left: 4em;
}
.stepFlow li:last-child p::after,
.stepFlow li:last-child p::before{
  content: normal;
}
/*--*/
.kiyaku{
	border:1px #e6e6e6 solid;
	padding:10px;
	font-size:12px;
}
/*--*/
.formBtnArea{
	font-size:0;
	text-align:center;
}
.formBtnArea p{
	display:inline-block;
	vertical-align:top;
}

.formBtnArea span{
	background:url(/members/element/images/arrow_gray.png) no-repeat bottom center;
	padding-bottom:12px;
	font-weight:bold;
	display:block;
	margin-bottom:10px
}

.formBtnArea a{
	margin:0 10px 10px 10px;
	vertical-align:top;
}

.formBtnArea a span{
	background:none;
	padding-bottom:0;
	display:inherit;
	padding:1.1em 0 0.5em 0;
	height:auto;
	width: 300px;
}

.formBtnArea a.line2 span{
	margin-bottom:0;
	line-height:0.2em;
	padding-top:1em;
}


/*--*/
.formBox{
	margin-top:35px;
}
.formBox dt{
	background:#e6e6e6;
	padding:5px 5px 5px 15px;
	margin:0 0 15px 0;
	font-size:112.5%;
	font-weight:bold;
	line-height:1.6em;
}
.formBox dd{
	padding:0 0 30px 0;
	line-height:1.6em;
	font-size:87.5%;
}
.formBox dd p{
	font-size:100%;
	line-height:1.7em;
}
.inputTtl{
	display:inline-block;
	*display: inline;
	*zoom: 1;
	padding:0 10px 0 0;
	font-size:100%;
	vertical-align:middle;
}
.formBox dd p.inputTtl{
	display:block;
	margin-bottom:5px;
	font-size:114.3%;
		font-weight:bold;
}
.formBox dd input{
/*	vertical-align:middle;*/
}
.formBox input[type=text],
.formBox input[type=password]{
	border:1px #b4b4b4 solid;
	line-height:30px;
	height:30px;
}
.formBox input.email,
.formBox input.name,
.formBox #nick_name,
.formBox #school_name{
	width:290px;
}
.zip1{
	width:48px;
	margin:0 5px 0 0;
}
.zip2{
	width:54px;
	margin:0 5px 0 5px;
}

#b_month,
#b_day{
	margin-left:10px;
}
#tel_2,
#tel_3{
	margin-left:5px;
}


#element dd .examp,
#element_form dd .inputExm{
	font-size:95%;
	color:#737373;
	margin-left:10px;
	
}

#element dd .direct-mail{
	margin-right:10px;
}

#element .formBox .caption{
	margin-left:20px;
}

#element .formBox dt .caution,
#element_form .formBox dt .caution{
	font-weight:normal;
	font-size:85%;
	margin-left:20px;
}

p.error_balloon{
	background:url(/members/common/images/bg_errorbaloon.png) no-repeat;
	padding:3px 3px 10px 3px;
	color:#fff;
	width:15em;
	margin-left:25px;
	margin-bottom:0;
	line-height: 1.7em;
}

#element_form h4 p.error_balloon{
	font-size:80%;
	margin-top:-68px;
	margin-bottom:33px;
	font-weight:normal;
	padding-bottom:12px;
	padding-left: 9px;
}

#element_form h4.error{
	margin-top:55px;
	color:#000;
}


input.error{
	background:#fcd9e1;
	margin-top:0;
}

#element_form dd ul{
	overflow:hidden;
}

#element_form dd li{
	width:45%;
	float:left;
	margin-bottom:10px;
}

#element_form dd li input{
	margin-right:5px;
}

/*----------mypage----------*/
#mypageMenu{
	overflow:hidden;
	font-size:0;
	padding:40px 0 45px 0;
	margin:0 0 0 -20px;
}
#mypageMenu dl{
	border:4px #c8c8c8 solid;
	display:inline-block;
	*display: inline;
	*zoom: 1;
	max-width:330px;
	width:45%;
	padding:6px 6px 20px 6px;
	margin:0 0 0 20px;
	vertical-align:top;
}
#mypageMenu dt{
	background:url(../../common/images/bg_slash_gray.png) repeat;
	padding:10px 0 8px 0;
	color:#FFFFFF;
	font-size:175%;
	font-weight:bold;
	line-height:1.4em;
	text-align:center;
}
#mypageMenu dt span{
	display:block;
	color:#a0a0a0;
	font-size:10px;
	line-height:1.2em;
}
#mypageMenu dd{
	position:relative;
	height:210px;
	padding:18px 0 0px 0;
	margin:0 20px;
	line-height:1.6em;
}
#mypageMenu dd a{
	display:table;
	position:absolute;
	bottom:0;
	width:98%;
}
#mypageMenu .order dd a:nth-of-type(1){
	bottom:62px;
}
#mypageMenu dd a span{
	width:100%;
	margin:0 auto;
}
#mypageMenu .posts{
	position:absolute;
	bottom:58px;
	background:url(../images/bg_fukidashi.png) no-repeat center top;
	background-size:100% 100%;
	width:100%;
	padding:5px 0 10px 0 ;
	color:#5064e7;
	font-weight:bold;
	text-align:center;
	line-height:1.4em;
}
#mypageMenu .posts span{
	color:#5064e7;
	font-weight:bold;
}
/*-learn-*/
#mypageMenu dl.learning{
	display:block;
	width:auto;
	max-width:inherit;
	margin:15px 0 0 20px;
}
#mypageMenu .learning li{
	overflow:hidden;
	padding:6px;
	margin:12px 0 0 0;
}
#mypageMenu .learning li:first-child{
	margin-top:0;
}
#mypageMenu .learning li p{
	line-height:1.5em;
}
.learn01{
	border:1px #d7603b solid;
}
.learn02{
	border:1px #b463d5 solid;
}
.learn03{
	border:1px #21ae6a solid;
}
.learn04{
	border:1px #f1004d solid;
}
#mypageMenu .learning dd{
	height:auto;
}
#mypageMenu .learning dd a{
	display:inline-block;
	*display: inline;
	*zoom: 1;
	position:relative;
	background:url(../../common/images/arrow_bar_white.png) no-repeat 98% center;
	width:42%;
	float:left;
	max-width:280px;
	margin:0 20px 0 0;
	color:#FFFFFF;	
	font-weight:bold;
	text-align:center;
	text-decoration:none;
    -webkit-transition: 0.2s ease-in-out;  
       -moz-transition: 0.2s ease-in-out;  
         -o-transition: 0.2s ease-in-out;  
            transition: 0.2s ease-in-out;  
}
#mypageMenu .learning a span{
	display:block;
	width:100%;
	line-height:46px;
	padding-right:24px;
	color:#FFFFFF;
	font-size:125%;
	vertical-align:middle;
	/*line-height:1.1em;*/
}
#mypageMenu .learning .learn01 a{
	border:3px #d7603b solid;
	background-color:#d7603b;
}
#mypageMenu .learning .learn02 a{
	border:3px #b463d5 solid;
	background-color:#b463d5;
} 
#mypageMenu .learning .learn03 a{
	border:3px #21ae6a solid;
	background-color:#21ae6a;
} 
#mypageMenu .learning .learn04 a{
	border:3px #f1004d solid;
	background-color:#f1004d;
}
#mypageMenu .learning a:hover{
	text-decoration:none;
}
#mypageMenu .learning .learn01 a:hover{
	background:url(../../common/images/arrow_bar_enji.png) no-repeat 98% center #ffffff;
	color:#d7603b;
}
#mypageMenu .learning .learn02 a:hover{
	background:url(../../common/images/arrow_bar_violet.png) no-repeat 98% center #ffffff;
	color:#b463d5;
}
#mypageMenu .learning .learn03 a:hover{
	background:url(../../common/images/arrow_bar_green.png) no-repeat 98% center #ffffff;
	color:#21ae6a;
}
#mypageMenu .learning .learn04 a:hover{
	background:url(../../common/images/arrow_bar_pink.png) no-repeat 98% center #ffffff;
	color:#f1004d;
}
#mypageMenu .learning .learn01 a:hover span{
	color:#d7603b;
}
#mypageMenu .learning .learn02 a:hover span{
	color:#b463d5;
}
#mypageMenu .learning .learn03 a:hover span{
	color:#21ae6a;
}
#mypageMenu .learning .learn04 a:hover span{
	color:#f1004d;
}

/*-----login----------*/
.login #mainColumn .baseTable{
	width:80%;
	margin:0 auto;
}
.login #mainColumn .baseTable th{
	min-height:2.2em;
	line-height:1.3em;
	white-space:nowrap;
}
.login #mainColumn .baseTable td input{
	width:95%;
}
.newRegist{
	border-top:1px #b4b4b4 solid;
	border-bottom:1px #b4b4b4 solid;
	padding:20px 0 10px 0;
	text-align:center;
}
.newRegist p{
	margin:0 0 20px 0;
	text-align:center;
	line-height:1.6em;
}

/*-----edit----------*/

#element_form td label{
	margin-right:25px;
}

#element_form td .direct-mail{
		display:block;
	float:left;
	margin-top:5px;
}

#element_form td .indent20{
	display:block;
	float:right;
	width:430px;
}

#element_form td .caption{
	font-size:80%;
	margin-left:20px;
}

/*--------hiroba-------------*/
.hirobaBox{
	background:#ffe685;
	border-radius:10px;
	padding:15px 35px 20px 35px;
	margin:80px 0 35px 0;
	text-align:center;
}
.hirobaBox h4{
	border-bottom:2px #dabf52 solid;
	padding:0 0 15px 0;
	margin:0 0 12px 0;
	text-align:center;
	font-size:162.5%;
}
.hirobaBox p{
	text-align:center;
}
.hirobaBox .btn{
	margin:20px 0 30px 0;
}
.hirobaBox .btn img{
	margin:0 10px;
}
.hirobaBox textarea{
	width:78%;
	margin-bottom:15px;
}
/*--*/
.hirobaList{
	margin:0 0 60px 0;
}
.hirobaList dl{
	border:2px #ffd230 solid;
	margin:0 0 20px 0;
}
.hirobaList dt{
	overflow:hidden;
	background:#ffe685;
	padding:10px 10px 10px 20px;
	line-height:40px;
	color:#000000;
}
.hirobaList dt a{
	color:#000000;
	text-decoration:underline;
}
.hirobaList dt span{
	font-size:75%;
}
.hirobaList dt .icon{
	float:right;
	height:40px;
}
.hirobaList dd{
	padding:10px 20px 10px 20px;
	line-height:1.8em;
}

/*--*/

.pageNavi{
	background:#faf5dc;
	padding:4px;
	text-align:center;
}
.pageNavi a,
.pageNavi span{
	display:inline-block;
	*display: inline;
	*zoom: 1;
	margin:0 10px;
	vertical-align:middle;
	line-height:1.6em;
}
.pageNavi a{
	text-decoration:underline;
}
/*-------------element ----------------*/

.element #contentsHead{
	background:url(/members/element/images/img_pagetitle.jpg) no-repeat scroll center top / cover ;
}

.element .stepFlow li p{
  padding: .6em 1.25em .6em 3.0em;
  float: left;
		color:#787878;
  position: relative;
		text-align:center;
		line-height:1.4em;
}
.element .stepFlow li:first-child p{
  padding-left: 1.5em;
}
.element .stepFlow li p::after,
.element .stepFlow li p::before{
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -2.1em;
  border-top: 2.1em solid transparent;
  border-bottom: 2.15em solid transparent;
  border-left: 1.8em solid;
  right: -1.9em;
}
.element .stepFlow li p::before{
  border-left-color: #e6e6e6;
  right: -2em;
  z-index: 1;
}
.element .stepFlow li p::after{
  z-index: 2;
  border-left-color: #fff;
}
.element .stepFlow li.stay p::after{
  border-left-color: #e6e6e6;
}
.element .stepFlow li:last-child p{
  padding-left: 3em;
}
.element .stepFlow li:last-child p::after,
.element .stepFlow li:last-child p::before{
  content: normal;
}
/*--*/
.siryoList{
	font-size:0;
	padding:0 0 30px 0;
	margin:0 0 0 -30px;
}
.siryoList li{
	border-bottom:1px #dcdcdc solid;
	display:inline-block;
	*display: inline;
	*zoom: 1;
	width:220px;
	padding:10px 0 15px 0;
	margin:0 0 0 30px;
	vertical-align:top;
	text-align:center;
}
.siryoList li img{
	/*height:220px;*/
}
.siryoList li dl{
	height:4.6em;
	padding:15px 5px 0 5px;
	text-align:left;
}
.siryoList li dt,
.siryoList2 li dt{
	padding-left:1.1em;
	text-indent:-1.1em;
	line-height:1.4em;
	color:#5064e7;
}
.siryoList li dt label,
.siryoList2 li dt label{
	color:#5064e7;
	font-weight:bold;
}
.siryoList li dt input,
.siryoList2 li dt input{
	margin:0 5px 0 0;
}
.siryoList li dd,
.siryoList2 li dd{
	padding-top:5px;
	padding-left:1.5em;
	font-size:75%;
}
/*--*/
.siryoList2{
	font-size:0;
	padding:1px 0 30px 0;
	margin-left:-2%;
}
.siryoList2 li{
	border-top:1px #dcdcdc solid;
	border-bottom:1px #dcdcdc solid;
	display:inline-block;
	*display: inline;
	*zoom: 1;
	width:48%;
	padding:15px 0 15px 0;
	margin-left:2%;
	margin-top:-1px;
	vertical-align:top;
	text-align:center;
}
.siryoList2 li img{
	float:left;
	width:80px;
	margin:0 0 0 10px;
}
.siryoList2 li dl{
	padding:0 10px 0 110px;
	text-align:left;
}
/*--*/
.kojin{
	border:1px #e6e6e6 solid;
	padding:10px;
	margin:0 0 10px 0;
}
.kojin p,
.kojin li{
	font-size:12px;
	line-height:2em;
}
.kojin ul{
	padding:10px 0 10px 15px;
}
/*-------element anq------*/
.anq .formBox ul{
	font-size:0;
}
.anq .formBox li{
	display:inline-block;
	*display: inline;
	*zoom: 1;
	width:50%;
	padding:0 0 10px 0;
	vertical-align:top;
}
.anq .formBox li input{
	margin:0 5px 0 0;
}





/*-------------learn ----------------*/
.learnTab{
	display:table;
	width:92%;
	margin:0 auto 25px auto;
	border-collapse:collapse;
}
.learnTab li{
	display:table-cell;
	border:1px #5064e7 solid;
	width:33%;
	vertical-align:middle;
}
.learnTab li a{
	display:block;
	padding:12px 2px;
	text-align:center;
	line-height:1.2em;
	font-size:87.5%;
}
.learnTab li.stay{
	background:#e2e6ff;
}
/*--*/
.studyBox{
	border-radius:3px;
	padding:20px 20px 30px 20px;
	margin:0 30px;
}
.studyBox h3{
	margin-bottom:10px;
}
.studyBox p{
	font-size:75%;
}
.subtxt{
	float:right;
	padding:5px 0 0 0;
	/*margin-top:-2.8em;
	text-align:right;*/
}

.studyBox .clearfix h3{
	float:left;
	margin:0;
}

.studyBox.english{
	background:#d9c8f5;
}
.studyBox.english .btnArrowBlue{
	border:3px #8c5fed solid;
	background-color: #8c5fed;
}
.studyBox.english .btnArrowBlue:hover{
	background:url(../../common/images/arrow_bar_violet.png) no-repeat 98% center #ffffff;
}
.studyBox.english .btnArrowBlue:hover span{
	color:#8c5fed;
}
.studyBox.english .btnBackGray{
	border:3px #8c5fed solid;
	background-color:#8c5fed;
}
.studyBox.english .btnBackGray:hover{
	background:url(../../common/images/arrow_back_bar_violet.png) no-repeat 2% center #ffffff;
}
.studyBox.english .btnBackGray:hover span{
	color:#8c5fed;
}
.studyBox.kanji{
	background:#bfcb96;
}
.studyBox.kanji .btnBackGray{
	border:3px #597900 solid;
	background-color:#597900;
}
.studyBox.kanji .btnBackGray:hover{
	background:url(../../common/images/arrow_back_bar_green.png) no-repeat 2% center #ffffff;
}
.studyBox.kanji .btnBackGray:hover span{
	color:#597900;
}


/*--*/
.topSelect{
	background:#FFFFFF;
	text-align:center;
	font-size:0;
	padding:25px 0;
	margin:20px 0 30px 0;
}
.topSelect li{
	display:inline-block;
	*display: inline;
	*zoom: 1;
	border:3px #8c5fed solid;
	width:35%;
	padding:5px;
	margin:0 15px;
	vertical-align:top;
	line-height:1.2em;
}
.topSelect li h3{
	font-size:150.0%;
	text-align:center;
	font-weight:bold;
	line-height:1.5em;
}
.topSelect li p{
	margin:0 0 8px 0;
	text-align:center;
	line-height:1.6em;
}
.topSelect li a{
	vertical-align:bottom;
}
/*--*/

.levelList{
	background:#FFFFFF;
	padding:20px 30px 20px 25px;
	margin:20px 0 30px 0;
	font-size:0;
}
.levelList li{
	display:inline-block;
	*display: inline;
	*zoom: 1;
	width:102px;
	margin:0 0 10px 10px;
	vertical-align:top;
}
.levelList li a{
	display:block;
	border:2px #9558f5 solid;
	color:#9558f5;
	font-size:14px;
	text-align:center;
	line-height:36px;
}
.levelList .orange a,
.kanji .levelList .orange a{
	border:2px #f58c32 solid;
	color:#f58c32;
}
.levelList .long{
	width:214px;
}
.kanji .levelList li a{
	border:2px #486900 solid;
	color:#486900;
}
/*--*/
.questionList{
	background:#FFFFFF;
	padding:20px 30px 20px 25px;
	margin:20px 0 30px 0;
}
.questionList li{
	border-bottom:1px #c9c9c9 dotted;
	padding:15px 0 20px 0;
}
.questionList li h4{
	overflow:hidden;
	margin-bottom:15px;
}
.questionList li h4 span{
	display:block;
	vertical-align:top;
	color:#9255f1;
}
.questionList li h4 .num{
	float:left;
	background:#9255f1;
	border-radius:2px;
	width:51px;
	color:#FFFFFF;
	text-align:center;
}
.questionList li h4 .txt{
	padding:0 0 0 65px;
}
.kanji .questionList h4 span{
	color:#597a00;
}
.kanji .questionList h4 .num{
	background:#597a00;
	color:#FFFFFF;
}
.questionList li dl{
	display:table;
}
.questionList li dt{
	display:table-cell;
	background:#d9c8f5;
	border-radius:2px;
	width:51px;
	color:#9255f1;
	font-weight:bold;
	vertical-align:middle;
	text-align:center;
}
.questionList li dd{
	display:table-cell;
	vertical-align:top;
	padding:0 0 0 12px;
}
.questionList li dd input{
	margin:0 5px 0 0;
	vertical-align:middle;
}
.questionList.answer li dd span{
	color:#f00050;
}
.kanji .questionList dt{
	background:#becd96;
	color:#597a00;
}
/*-*/
.questionList li.btn{
	border-bottom:none;
	padding:15px 0 0 0;
	text-align:center;
}
.english .questionList li.btn a,
.kanji .questionList li.btn a{
	border:3px #c84141 solid;
	background-color:#c84141;
}
.english .questionList li.btn a:hover,
.kanji .questionList li.btn a:hover{
	background:url(../../common/images/arrow_bar_red.png) no-repeat 98% center #ffffff;
}
.english .questionList li.btn a:hover span,
.kanji .questionList li.btn a:hover span{
	color:#c84141;
}
/*-*/
.retrytxt{
	background:#FFFFFF;
	padding:20px 30px 0 30px;
	margin:20px 0 0 0;
}
.levelList.retry,
.levelList.history{
	margin-top:0;
}
.levelList.history li a{
	line-height:1.6em;
	font-weight:bold;
}
.levelList.history li span{
	display:block;
	font-weight:normal;
	font-size:87.5%;
	color:#f58c32;
}
/*--------download-------------*/
.siryoList li p{
	height:2.5em;
	padding:10px 0 10px 0;
	text-align:center;
	line-height:1.4em;
	color:#5064e7;
	font-weight:bold;
}
.siryoList li p span{
	color:#5064e7;
	font-size:75%;
	font-weight:normal;
}
.siryoList .btnBlue.icPdf,
.siryoList .btnBlue.icBook{
	padding-left:30px;
}




/*=================================
 under 992px
=================================*/
@media only screen and (max-width: 979px) {

/*---------regist----------*/
.stepFlow{
	width:538px;
}
.stepFlow li p{
  padding: .5em 1em .5em 2em;
}
.stepFlow li:first-child p{
  padding-left: 1.5em;
}
.stepFlow li p::after,
.stepFlow li p::before{
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -2.3em;
  border-top: 2.3em solid transparent;
  border-bottom: 2.3em solid transparent;
  border-left: 1.8em solid;
  right: -1.9em;
}
.stepFlow li p::before{
  border-left-color: #e6e6e6;
  right: -2.0em;
  z-index: 1;
}  
.stepFlow li p::after{
  z-index: 2;
  border-left-color: #fff;
}
 
.stepFlow li.stay p::after{
  border-left-color: #e6e6e6;
}

.stepFlow li:last-child p{
  padding-left: 2em;
}
.stepFlow li:last-child p::after,
.stepFlow li:last-child p::before{
  content: normal;
}

/*--------------mypage----------*/
#mypageMenu{
	text-align:center;
}
#mypageMenu dl{
	width:42%;
	text-align:left;
}
/*-------login-----------*/
.login #mainColumn .baseTable{
	width:100%;
	margin:0 auto;
}
.login #mainColumn .baseTable th span{
	font-size:85%;
}

/*-----edit----------*/


#element_form td .direct-mail{
	float:none;
	display:inline;
}

#element_form td .indent20{
	float:none;
	display:inline;

}

#element_form td .caption{
	margin-left:0;
}


/*-------------element ----------------*/

.element .stepFlow li p{
  padding: .5em .5em .5em 1.9em;
}
.element .stepFlow li:first-child p{
  padding-left: 1.0em;
}
.element .stepFlow li p::after,
.element .stepFlow li p::before{
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -2.0em;
  border-top: 2.0em solid transparent;
  border-bottom: 2.10em solid transparent;
  border-left: 1.6em solid;
  right: -1.9em;
}
.element .stepFlow li p::before{
  border-left-color: #e6e6e6;
  right: -2.05em;
  z-index: 1;
}
.element .stepFlow li p::after{
  z-index: 2;
  border-left-color: #fff;
}
.element .stepFlow li.stay p::after{
  border-left-color: #e6e6e6;
}
.element .stepFlow li:last-child p{
  padding-left: 1.5em;
}
.element .stepFlow li:last-child p::after,
.element .stepFlow li:last-child p::before{
  content: normal;
}

}


/*=================================
 under 350px
=================================*/
@media only screen and (max-width: 767px) {
	
#mypageMenu .order dd a:nth-of-type(1){
	bottom:0;
}
	
/*-------about-------*/
.newMember{
	border-left:none;
	border-right:none;
	padding:20px 0 5px 0;
	margin:0 -10px;
}


/*---------regist----------*/
.stepFlow{
	width:300px;
	margin:0 auto;
}
.stepFlow li p{
  padding: .5em 0.5em .5em 1.5em;
	font-size:10px;
}
.stepFlow li:first-child p{
  padding-left: 1.0em;
}
.stepFlow li p::after,
.stepFlow li p::before{
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -3.4em;
  border-top: 3.4em solid transparent;
  border-bottom: 3.4em solid transparent;
  border-left: 1.5em solid;
}
.stepFlow li p::before{
  border-left-color: #e6e6e6;
  right: -1.7em;
  z-index: 1;
}  
.stepFlow li p::after{
  z-index: 2;
  right: -1.5em;
  border-left-color: #fff;
}
 
.stepFlow li.stay p::after{
  border-left-color: #e6e6e6;
}

.stepFlow li:last-child p{
  padding-left: 2em;
}
.stepFlow li:last-child p::after,
.stepFlow li:last-child p::before{
  content: normal;
}
/*--*/
.formBox input.email,
.formBox input.name,
.formBox #nick_name,
.formBox #school_name{
	width:50%;
}

p.error_balloon{
	padding:3px 3px 18px 3px;
}

#element_form h4 p.error_balloon{
	margin-top:-68px;
	margin-bottom:25px;
	padding-top:6px;
	padding-bottom:15px;
}


/*---------mypage-------------*/
#mypageMenu{
	margin:0;
}
#mypageMenu dl{
	width:auto;
	margin:0 0 20px 0;
}
#mypageMenu dd{
	height:auto;
	margin:0 10px;
}
#mypageMenu dd a,
#mypageMenu dd .posts{
	position:relative;
	bottom:0;
	margin:10px 0 0 0;
}
/*-learn-*/
#mypageMenu dl.learning{
	margin:0 0 20px 0;
}
#mypageMenu .learning li{
	overflow:hidden;
	padding:4px;
	margin:15px 0 0 0;
}
#mypageMenu .learning li:first-child{
	margin-top:0;
}
#mypageMenu .learning li p{
	padding:0 0 5px 0;
	text-align:center;
	line-height:1.3em;
}
#mypageMenu .learning dd a{
	display:block;
	width:auto;
	float:none;
	max-width:inherit;
	margin:0 0 10px 0; 
}

/*--------hiroba-------------*/
.hirobaBox{
	background:#ffe685;
	border-radius:10px;
	padding:10px 15px 20px 15px;
	margin:40px 0 20px 0;
	text-align:center;
}
.hirobaBox h4{
	border-bottom:2px #dabf52 solid;
	padding:0 0 15px 0;
	margin:0 0 12px 0;
	text-align:center;
	font-size:162.5%;
}
.hirobaBox p{
	text-align:left;
}
.hirobaBox .txtCenter{
	text-align:center;
}
.hirobaBox .btn{
	overflow:hidden;
	margin:20px 0 15px 0;
	text-align:center;
}
.hirobaBox .btn img{
	float:right;
	margin:0;
	width:48%;
	height:auto;
}
.hirobaBox .btn a:first-child img{
	float:left;
}

.hirobaBox textarea{
	width:99%;
	margin-bottom:15px;
}
/*--*/
.hirobaList{
	margin:0 0 30px 0;
}
.hirobaList dl{
	border:2px #ffd230 solid;
	margin:0 0 10px 0;
}
.hirobaList dt{
	overflow:hidden;
	background:#ffe685;
	padding:5px 5px 5px 10px;
	line-height:1.6em;
	color:#000000;
}
.hirobaList dt a{
	color:#000000;
	text-decoration:underline;
}
.hirobaList dt span{
	display:block;
	font-size:75%;
}
.hirobaList dt .icon{
	float:right;
	height:40px;
}
.hirobaList dd{
	padding:10px 10px 10px 10px;
	line-height:1.6em;
}

/*--*/
.pageNavi{
	padding:10px 5px;
}
.pageNavi a,
.pageNavi span{
	margin:0 5px;
}
.pageNavi a{
	text-decoration:underline;
}
/*-------------element ----------------*/
.element .stepFlow li p{
  padding: .5em .4em .5em 1.0em;
}
.element .stepFlow li:first-child p{
  padding-left: .5em;
}
.element .stepFlow li p::after,
.element .stepFlow li p::before{
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -3.1em;
  border-top: 3.1em solid transparent;
  border-bottom: 3.1em solid transparent;
  border-left: 1.5em solid;
  right: -1.0em;
}
.element .stepFlow li p::before{
  border-left-color: #e6e6e6;
  right: -1.2em;
  z-index: 1;
}
.element .stepFlow li p::after{
  z-index: 2;
  border-left-color: #fff;
}
.element .stepFlow li.stay p::after{
  border-left-color: #e6e6e6;
}
.element .stepFlow li:last-child p{
  padding-left: 1.5em;
}
.element .stepFlow li:last-child p::after,
.element .stepFlow li:last-child p::before{
  content: normal;
}
/*--*/
.siryoList{
	padding:0 0 0px 0;
	margin:0 0 0 -2%;
}
.siryoList li{
	width:48%;
	padding:10px 0 15px 0;
	margin:0 0 0 2%;
}
.siryoList li img{
	height:auto;
}
.siryoList li dl{
	height:6em;
	padding:15px 5px 0 5px;
	text-align:left;
}

/*--*/
.siryoList2{
	padding:1px 0 0px 0;
	margin-left:0;
}
.siryoList2 li{
	width:100%;
	margin-left:0;
}
/*-------element anq------*/
.anq .formBox ul{
	font-size:0;
}
.anq .formBox li{
	display:inline-block;
	*display: inline;
	*zoom: 1;
	width:100%;
	padding:0 0 10px 0;
	vertical-align:top;
}
.anq .formBox li input{
	margin:0 5px 0 0;
}

#element_form dd li{
	float:none;
	width:auto;
}

/*--*/
.formBtnArea a span{
	width: 274px;
}
.formBtnArea a{
	margin-left:0;
	margin-right:0;
}

/*-------------learn ----------------*/
.learnTab{
	display:table;
	width:100%;
	margin:0 0 25px 0;
	border-collapse:collapse;
}
.learnTab li{
	display:table-cell;
	border:1px #5064e7 solid;
	width:33%;
	vertical-align:middle;
}
.learnTab li a{
	display:block;
	padding:12px 2px;
	text-align:center;
	line-height:1.2em;
	font-size:87.5%;
}
.learnTab li.stay{
	background:#e2e6ff;
}
/*--*/
.studyBox{
	padding:10px 10px 15px 10px;
	margin:0;
}
.studyBox p{
	font-size:87.5%;
}
/*--*/
.topSelect{
	padding:10px 10px 10px 10px;
	margin:15px 0 20px 0;
}
.topSelect li{
	display:block;
	width:auto;
	padding:5px;
	margin:0 0 10px 0;
}
/*--*/
.studyBox .clearfix h3{
	float:none;
}
.subtxt{
	float:none;
}
.levelList{
	padding:20px 10px 20px 15px;
	margin:20px 0 30px 0;
}

/*--------download------------*/
.siryoList .btnBlue.icPdf,
.siryoList .btnBlue.icBook{
	background-size:22px auto;
	background-position:2px center;
	padding-left:25px;
}


input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

}