@charset "UTF-8";

html #container .inner .main_area{
	float: left;
	width: 690px;
}

/* fade_box */
html #container .fade_box{
	width: 100%;
	height: 382px;
	position: absolute;
	top: 178px; left: 0;
	background: #fff;
	z-index: 50;
}

html #container .fade_box .inner{
	width: 940px;
	margin: 0 auto;
}

/* course_list */

html #container .inner .main_area .course_list_cp{
	margin: 0 0 15px;
	padding: 10px 0 0;
	width: 688px;
	border: 1px solid #dcd6c5;
	background: #fff;
	position: relative;
	text-align:center;
}

html #container .inner .main_area .course_list{
	margin: 0 0 28px;
	padding: 25px 0 0;
	width: 688px;
	height: 530px;
	border: 1px solid #dcd6c5;
	background: #fff;
	position: relative;
}

html #container .inner .main_area .course_list h3{
	width: 585px; height: 23px;
	margin: 0 auto 33px auto;
	background: url(../img/top/title_01.gif) left top no-repeat;
	text-indent: -9000px;
	font-size: 0;
	overflow: hidden;
}

html #container .inner .main_area .course_list li{
	float:left;
}

html #container .inner .main_area .course_list .list_01,
html #container .inner .main_area .course_list .list_02,
html #container .inner .main_area .course_list .list_03{
	height: 170px;
}

html #container .inner .main_area .course_list .list_04,
html #container .inner .main_area .course_list .list_05,
html #container .inner .main_area .course_list .list_06{
	height: 157px;
}

html #container .inner .main_area .course_list .list_07,
html #container .inner .main_area .course_list .list_08{
	height: 120px;
}

html #container .inner .main_area .course_list .list_01,
html #container .inner .main_area .course_list .list_04,
html #container .inner .main_area .course_list .list_07{
	margin: 0 11px 0 0;
}

html #container .inner .main_area .course_list .list_02,
html #container .inner .main_area .course_list .list_05,
html #container .inner .main_area .course_list .list_08{
	margin: 0 7px 0 0;
}

html #container .inner .main_area .course_list li p{
	text-indent: -9000px;
	font-size: 0;
	overflow: hidden;
}

html #container .inner .main_area .course_list .list_01 p{
	margin: 0 0 8px;
	width: 224px; height: 47px;
	background: url(../img/top/list_tit_01.gif)
}
html #container .inner .main_area .course_list .list_02 p{
	margin: 0 0 8px;
	width: 215px; height: 47px;
	background: url(../img/top/list_tit_02.gif)
}
html #container .inner .main_area .course_list .list_03 p{
	margin: 0 0 8px;
	width: 222px; height: 47px;
	background: url(../img/top/list_tit_03.gif)
}
html #container .inner .main_area .course_list .list_04 p{
	margin: 0 0 14px;
	width: 224px; height: 60px;
	background: url(../img/top/list_tit_04.gif) no-repeat left bottom;
}
html #container .inner .main_area .course_list .list_05 p{
	margin: 0 0 14px;
	width: 215px; height: 60px;
	background: url(../img/top/list_tit_05.gif) no-repeat left bottom;
}
html #container .inner .main_area .course_list .list_06 p{
	margin: 0 0 14px;
	width: 222px; height: 60px;
	background: url(../img/top/list_tit_06.gif) no-repeat left bottom;
}
html #container .inner .main_area .course_list .list_07 p{
	margin: 0 0 14px;
	width: 224px; height: 60px;
	background: url(../img/top/list_tit_07.gif) bottom left no-repeat;
}
html #container .inner .main_area .course_list .list_08 p{
	margin: 0 0 14px;
	width: 215px; height: 49px;
	background: url(../img/top/list_tit_08.gif)
}

html #container .inner .main_area .course_list li ul li{
	float: none;
	padding: 0 0 0 15px;
	margin: 0 0 10px;
	font-size: 14px;
	background: url(../img/top/arrow_01.gif) left 4px no-repeat;
}

html #container .inner .main_area .course_list li ul li.end{
	margin-bottom: 0;
}

html #container .inner .main_area .course_list .list_01 li,
html #container .inner .main_area .course_list .list_04 li,
html #container .inner .main_area .course_list .list_07 li{
	margin: 0 0 10px 9px;
}

html #container .inner .main_area .course_list li ul li a{
	text-decoration: none;
	color: #2c2c2c;
}

html #container .inner .main_area .course_list li ul li a:hover{
	color: #c33920;
}

html #container .inner .main_area .course_list .btn{
	width: 183px; height: 40px;
	text-indent: -9000px;
	overflow: hidden;
	font-size: 0;
	background: url(../../img/top/btn.gif) left top no-repeat;
	position: absolute;
	right: 12px; bottom: 12px;
}

html #container .inner .main_area .course_list .btn:hover{
	background-position: right bottom;
}

/* information_area */
html #container .inner .main_area .information_area{
	margin: 0 0 50px;
}

html #container .inner .main_area .information_area .inner{
	width: 690px; height: 120px;
}

html #container .inner .main_area .information_area h3{
	margin: 0 0 20px;
	width: 690px; height: 29px;
	text-indent: -9000px;
	overflow: hidden;
	font-size: 0;
	background: url(../img/top/title_02.gif) left top no-repeat;
}

html #container .inner .main_area .information_area .inner a{
	display: block;
	text-indent: -9000px;
	overflow: hidden;
	font-size: 0;
}

html #container .inner .main_area .information_area .inner .btn_01{
	float: left;
	width: 350px; height: 120px;
	background: url(../img/top/btn_info_01.gif) left top no-repeat;
}

html #container .inner .main_area .information_area .inner .btn_02{
	float: right;
	width: 340px; height: 120px;
	background: url(../img/top/btn_info_02.gif) left top no-repeat;
}

html #container .inner .main_area .information_area .inner .btn_01:hover,
html #container .inner .main_area .information_area .inner .btn_02:hover{
	background-position: right bottom;
}

/* contents_area */
html #container .inner .main_area .contents_area{
	margin: 0 0 50px;
}

html #container .inner .main_area .contents_area h3{
	margin: 0 0 20px;
	width: 690px; height: 30px;
	text-indent: -9000px;
	overflow: hidden;
	font-size: 0;
	background: url(../img/top/title_03.gif) left top no-repeat;
}

html #container .inner .main_area .contents_area .inner{
	width: 690px; height: 453px;
	position: relative;
}

html #container .inner .main_area .contents_area .inner p a{
	display: block;
	text-indent: -9000px;
	overflow: hidden;
	font-size: 0;
}

html #container .inner .main_area .contents_area .inner .title{
	margin: 0 0 7px;
}

html #container .inner .main_area .contents_area .inner .sec_01{
	width: 345px; height: 214px;
	position: absolute;
	top: 0; left: -6px;
}
html #container .inner .main_area .contents_area .inner .sec_02{
	width: 349px; height: 214px;
	position: absolute;
	top: 0; right: -2px;
}
html #container .inner .main_area .contents_area .inner .sec_03{
	width: 340px; height: 214px;
	position: absolute;
	bottom: 0; left: 0;
}
html #container .inner .main_area .contents_area .inner .sec_04{
	width: 353px; height: 214px;
	position: absolute;
	bottom: 0; right: -2px;
}

html #container .inner .main_area .contents_area .inner .sec_01 .title a{
	margin-left: 6px;
	width: 174px; height: 23px;
	background: url(../img/top/tit_contents_01.gif) left top no-repeat;
}
html #container .inner .main_area .contents_area .inner .sec_02 .title a{
	margin-left: 11px;
	width: 188px; height: 23px;
	background: url(../img/top/tit_contents_02.gif) left top no-repeat;
}
html #container .inner .main_area .contents_area .inner .sec_03 .title a{
	width: 189px; height: 23px;
	background: url(../img/top/tit_contents_03.gif) left top no-repeat;
}
html #container .inner .main_area .contents_area .inner .sec_04 .title a{
	margin-left: 15px;
	width: 172px; height: 23px;
	background: url(../img/top/tit_contents_04.gif) left top no-repeat;
}

html #container .inner .main_area .contents_area .inner .sec_01 .image a{
	width: 345px; height: 184px;
	background: url(../img/top/img_contents_01.jpg) left top no-repeat;
}
html #container .inner .main_area .contents_area .inner .sec_02 .image a{
	width: 349px; height: 184px;
	background: url(../img/top/img_contents_02.jpg) left top no-repeat;
}
html #container .inner .main_area .contents_area .inner .sec_03 .image a{
	width: 339px; height: 184px;
	background: url(../img/top/img_contents_03.jpg) left top no-repeat;
}
html #container .inner .main_area .contents_area .inner .sec_04 .image a{
	width: 353px; height: 184px;
	background: url(../img/top/img_contents_04.jpg) left top no-repeat;
}

/* study_style_area */
html #container .inner .main_area .study_style_area{
	margin: 0 0 50px;
}
html #container .inner .main_area .study_style_area h3{
	margin: 0 0 20px;
	width: 690px; height: 30px;
	text-indent: -9000px;
	overflow: hidden;
	font-size: 0;
	background: url(../img/top/title_04.gif) left top no-repeat;
}

html #container .inner .main_area .study_style_area .inner{
	width: 690px;
}

html #container .inner .main_area .study_style_area a{
	overflow: hidden;
 	display: inline-block;
	*display: inline; /* ie6,7 */
	*zoom: 1; /* ie6,7 */
	font-size: 0;
}

html #container .inner .main_area .study_style_area .btn_01{
	float: left;
}
html #container .inner .main_area .study_style_area .btn_02{
	float: right;
}

html #container .inner .main_area .study_style_area a:hover{
  	border: 2px solid #ce442b;
}
 
html #container .inner .main_area .study_style_area a:hover img{
	margin: -2px;
}

/* news_area */
html #container .inner .main_area .news_area{
	padding: 10px 4px;
	margin: 0 0 50px;
	width: 680px;
	border: 1px solid #dcd6c5;
	background: #fff;
	position: relative;
}

html #container .inner .main_area .news_area h3{
	margin: 0 0 20px 5px;
	width: 81px; height: 29px;
	text-indent: -9000px;
	overflow: hidden;
	font-size: 0;
	background: url(../img/top/titile_05.gif) left top no-repeat;
}

html #container .inner .main_area .news_area ul li{
	margin: 0 0 10px;
	padding: 0 18px 10px 18px;
	border-bottom: 1px solid #e5e5e5;
	font-size: 10px;
}

html #container .inner .main_area .news_area ul li p a{
	color: #333333;
	text-decoration: none;
}

html #container .inner .main_area .news_area ul li p a:hover{
	text-decoration: underline;
}

html #container .inner .main_area .news_area ul li p{
	line-height: 19px;
	font-size: 120%;
}

html #container .inner .main_area .news_area ul li.end{
	border-bottom: none;
}

html #container .inner .main_area .news_area ul li .date{
	float: left;
	width: 68px;
}

html #container .inner .main_area .news_area ul li .text{
	float: right;
	padding: 0 0 0 70px;
	width: 506px;
}

html #container .inner .main_area .news_area ul li .news{
	background: url(../img/top/icon_news.gif) left no-repeat;
}
html #container .inner .main_area .news_area ul li .answer{
	background: url(../img/top/icon_answer.gif) left no-repeat;
}

html #container .inner .main_area .news_area .more_btn{
	display: block;
	width: 60px; height: 20px;
	text-indent: -9000px;
	overflow: hidden;
	font-size: 0;
	background: url(../img/top/btn_news_more.gif) left top no-repeat;
	position: absolute;
	top: 16px; right: 13px;
}

html #container .inner .main_area .news_area .more_btn:hover{
	background-position: right bottom;
}


/* course_list 追記2018.01.31 */
.col_1{
	text-align: left;
    margin-left: 5px;
}

/* course_list 追記2018.07.23 */
html #container .inner .main_area .course_list{
	padding: 25px 0;
}
html #container .inner .main_area .course_list .list_04, html #container .inner .main_area .course_list .list_05, html #container .inner .main_area .course_list .list_06{
	height: 190px;
}
html #container .inner .main_area .course_list .list_07{
	height: 120px;
}


/* course_list 追記2019.11.27 */
html #container .inner .main_area .course_list .new .list_05{
	height: 170px;
	margin: 0 3px 0 10px;
}
html #container .inner .main_area .course_list .new .list_05 p{
	margin: 0 0 8px;
    height: 47px;
    background: url(../img/top/list_tit_05_new.gif) no-repeat left bottom;
}
html #container .inner .main_area .course_list .new .list_01{
	margin: 0 10px 0 0;
}
html #container .inner .main_area .course_list .new .list_04{
	margin: 0 10px 0 0;
}
html #container .inner .main_area .course_list .new .list_02{
    margin: 0;
}
html #container .inner .main_area .course_list .new .list_03{
	height: 190px;
	margin: 0 3px 0 10px;
}
html #container .inner .main_area .course_list .new .list_03 p{
	margin: 0 0 14px;
    width: 215px;
    height: 60px;
    background: url(../img/top/list_tit_03_new.gif) no-repeat bottom left;
    background-repeat: no-repeat;
}
html #container .inner .main_area .course_list .new .list_06 p{
    background: url(../img/top/list_tit_06_new.gif) no-repeat left bottom;
}
html #container .inner .main_area .course_list .new .list_06 ul{
    padding-left: 3px;
}



/* 模擬問題 */
.topmogi{
	background: #fef5f7;
	padding:20px;
	position: relative;
	margin: 20px auto;
    border: 2px #ce442b solid;
    font-family: "Noto Sans Japanese", "Helvetica Neue", "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
}
.topmogi .txtarea {
    font-size: 1.5rem;
    line-height: 1.5;
    font-weight: bold;
    position: inherit;
    margin-bottom: 10px;
}

.topmogi img {
	display: block;
	position: absolute;
	top: 0;
    right: -10px;
	width: 200px;
	height: auto;
}

.topmogi p{
    font-size: 90%;
    padding-left: 1em;
    text-indent: -1em;
}

.btn_area li.btn_comments.limit > div img {
	display: block;
	position: absolute;
	top: -30px;
	left: 30px;
	width: 180px;
	height: auto;
	transform: rotate(-20deg);
}

.topmogi .txtarea span {
    color: #ce442b;
    font-weight: bold;
    background: linear-gradient(transparent 50%, #ffff66 0%);
}

.limit_date{
    text-align: center;
    line-height: 1.6;
    display: block;
    font-size: 19px;
    font-weight: bold;
    border-radius: 30px;
	width: 240px;
	background: #ce442b;
	color: #fff;
    position: absolute;
    bottom: 20px;
    right: 70px;
    z-index: 999;
}