/* ---------- ＪＳ聴音用 ----------*/
.dict_wrap { height:440px;}
body{
	font-family:'Lato', 'Noto Sans JP', sans-serif;
}

h1 {
	font-size:16px;
	line-height:24px;
	padding:0 0 0 8px;
	margin:0;
}
#dict_slct {
	width:100%;
	height:30px;
	margin-bottom:40px;
}
#dict_slct ul {
	float:right;
}
#dict_slct li {
	width:99px;
	list-style:none;
	display:block;
	float:left;
	padding:8px 0;
	border-left:#aaa 1px solid;
}
#dict_slct li.first {
	border-left:none;
	width:100px;
}
#dict_slct li a {
	display:block;
	color:#06C;
	text-align:center;
	font-size:18px;
}
#dict_slct li a:hover {
	color:#39e;
}
#dict_content {
	clear:both;
	max-width:744px;
	margin:0 auto 40px;
	padding:25px;
	text-align:center;
	border:rgba(255,100,170,0.5) 3px dotted;
}
#view_Q {
	padding:12px 0;
}
#view_M {
	margin:30px 0 0;
	padding:12px 0;
	height:40px;
}
#view_M p {
	font-size:20px;
	line-height:40px;
	color:#666;
}
#dict_ctrl {
	height:40px;
}
	
/*-------- TOP画面で使用 --------*/
.tone_btn {
	background-color:#3B94E4;
	color:#FFF;
	}
	
.tone_btn a:link {
    color: #FFF;
    text-decoration: none;
	transition: all ease-out 0.2s;
}

.tone_btn a:visited {
    color: #FFF;
    text-decoration: none;
}

.tone_btn a:hover {
	background-color:rgba(255,255,255,0.3);
    color: #FFF;
    text-decoration: underline;
}

.bg_dict {
	color: #FFF;
	background-color:#1e82dc;
}
	
.bg_dict a:link {
    color: #FFF;
    text-decoration: none;
}
	
.bg_dict a:visited {
    color: #FFF;
    text-decoration: none;
}

.bg_dict a:hover {
    color: #FFF;
    text-decoration: underline;
}

.dict_slct{
	display:block;
	position:relative;
	font-size:28px;
	width:320px;
	line-height:180px;
	height:100%;
	background-color:#3B94E4;
	color:#FFF;
	border-radius:1px;
}

.dict_slct a:link {
	color: #FFF;
	text-decoration: none;
	transition: all ease-out 0.2s;
}

.dict_slct a:visited {
	color: #FFF;
	text-decoration: none;
}

.dict_slct a:hover {
	color: #FFF;
	font-size:36px;
	text-decoration: none;
	background-color:rgba(255,100,170,0.9);
	}

.select_icons{
	position: absolute;
	top: 0;
	left:0;
	z-index: 0;
}

.bg_logo{
	background-image:url("images/dict810logo_1000px.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 1000px 240px;
	height:415px;
}
	
.f-slctbtn {justify-content:space-between;}
	
.slct_pt{
	padding-top:25px;
}

.slct_cm{
	margin-top:20px;
}

.koro{
	display: none;
}
	
.f-btn{
	overflow: hidden;
}
	
/*-------- STEP選択画面から追加 --------*/
.dict_step{
	display:block;
	position:relative;
	font-size:28px;
	width:320px;
	line-height:80px;
	height:100%;
	color:#FFF;
	border-radius:1px;
	margin:5px;
	flex:1 1 320px;
}
	
#st01 > .dict_step{
	background-color:#3B94E4;
}

#st02 > .dict_step{
	background-color:#29679F;
}

#st03 > .dict_step{
	background-color:#173B5B;
}
	
.dict_step a:link {
	color: #FFF;
	text-decoration: none;
	transition: all ease-out 0.2s;
}

.dict_step a:visited {
	color: #FFF;
	text-decoration: none;
}

.dict_step a:hover {
	color: #FFF;
	font-size:36px;
	text-decoration: none;
	background-color:rgba(255,100,170,0.9);
	}
	
.step_t{
	margin-top:35px;
}

.slct_title{
    font-size:28px;
	color:#1D7DD3;
	border-bottom:3px solid #92BFE9;
	display: inline-block;
	transition: all ease-out 0.2s;
}
	
.sidebtn{
	color:#3B94E4;
	font-size: 40px;
	transition: all ease-out 0.2s;
}
		
.sidebtn:hover{
	color: #75B4EC;
}

@media only screen and (max-width:1253px) {
	.sidebtn{
		line-height: 50px;
	}
}
		
/*-------- 課題選択画面から追加 --------*/
.dict_kadai{
	display:block;
	position:relative;
	font-size:20px;
	width:320px;
	line-height:52.4px;
	color:#FFF;
	border-radius:1px;
	margin:1px;
	flex:1 1 100px;
	background-color:#2F76B6;
}
	
.dict_blnk {
	width:320px;
	flex:1 1 100px;
}
	
.kadai-block > ul{
	flex:1 1 60px;
}
	
.dict_kadai a:link {
	color: #FFF;
	text-decoration: none;
	transition: all ease-out 0.2s;
}

.dict_kadai a:visited {
	color: #FFF;
	text-decoration: none;
}

.dict_kadai a:hover {
	color: #FFF;
	font-size:26px;
	text-decoration: none;
	background-color:rgba(255,100,170,0.9);
	}

.pale {
	opacity:0.5;
}

.pale a:hover {
	font-size:20px !important;
	background-color:#2F76B6 !important;
}

#search_window {
	display: none;
	width:90%;
	max-width: 500px;
	background-color: #FFF;
	position:fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding:15px;
	z-index:10;
	border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

#modal-back {
	display: none;
	width:100%;
	height:100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 1;
	position:fixed;
	top:0; left:0;
}
		
.search-width{
	width:100px;
}

.check-font{
	font-size:14px;
}
	
.OKbtn{
	display:block;
	position:relative;
	font-size:16px;
	width:160px;
	line-height:40px;
	background-color:#3B94E4;
	color:#FFF;
	margin:10px;
	border-radius:3px;
}
	
.OKbtn a:link {
	color: #FFF;
	text-decoration: none;
	transition: all ease-out 0.2s;
}

.OKbtn a:visited {
	color: #FFF;
	text-decoration: none;
}
	
.OKbtn a:hover {
	color: #FFF;
	background-color:#29679F;
	text-decoration: none;
}
	
.cnclbtn{
	display:block;
	position:relative;
	font-size:16px;
	width:160px;
	line-height:40px;
	background-color:#64727F;
	color:#FFF;
	margin:10px;
	border-radius:3px;
}
	
.cnclbtn a:link {
	color: #FFF;
	text-decoration: none;
	transition: all ease-out 0.2s;
}

.cnclbtn a:visited {
	color: #FFF;
	text-decoration: none;
}
	
.cnclbtn a:hover {
	color: #FFF;
	background-color:#464F58;
	text-decoration: none;
}
	
.check{
	width: 90%;
	margin:auto;
}
		

	
/*-------- もどるボタン STEP選択と課題選択で使用 --------*/
.dict_back{
	display:block;
	position:relative;
	font-size:16px;
	width:160px;
	line-height:40px;
	background-color:#3B94E4;
	color:#FFF;
	margin:10px;
	border-radius:3px;
}
	
.dict_back a:link {
	color: #FFF;
	text-decoration: none;
	transition: all ease-out 0.2s;
}

.dict_back a:visited {
	color: #FFF;
	text-decoration: none;
}
	
.dict_back > a .b-hover{
	display: none;
}
	
.dict_back > a:hover .b-nomal{
	display: none;
}

.dict_back > a:hover .b-hover{
	display: inline;
}

.dict_back a:hover {
	color: #FFF;
	text-decoration: none;
	}
	
.space_k-2{
	height:162px;
}

.space_k-r{
	height:54px;
}

/*-------- 課題再生ページから追加 --------*/

.dict_ctrlbtn{
	display:block;
	position:relative;
	font-size:20px;
	width:320px;
	line-height:40px;
	height:100%;
	color:#FFF;
	border-radius:1px;
	margin:1px;
	flex:1 1 320px;
	background-color:#3B94E4;
}
	
.dict_ctrlbtn a:link{
	color:#FFF;
    text-decoration: none;
}

.dict_ctrlbtn a:hover{
	color:#FFF;
    text-decoration: none;
}

.dict_ctrlbtn a:active{
	color:#FFF;
	opacity: 0.5;
}

.dict_ctrlbtn_m{
	display:none;
}

.answerbtn {
	display:block;
	background-color:#3B94E4;
	border-radius: 2px;
	font-size: 20px;
	width: 80px;
	height:42px;
	line-height: 42px;
	text-align: center;
}
	
.answerbtn a{
	display:block;
}

.answerbtn a:link{
	color:#FFF;
    text-decoration: none;
	transition: all ease-out 0.2s;
}
	
.answerbtn a:visited{
	color:#FFF;
    text-decoration: none;
}
	
.answerbtn a:hover{
	font-size: 24px;
	background-color: rgba(255,100,170,0.9);
	color:#FFF;
    text-decoration: none;
	border-radius: 2px;
}
	
.f-answer{
	justify-content: flex-end;
}
	
.slctQ_margin{
		margin-top: 30px;
		margin-bottom: 5px;
	}
	
/*--------  --------*/
.max990{max-width: 990px;}
.wid_key{width:990px; height:252px;}
	
/*-------- 擬似iflame --------*/
.over-scroll {
	overflow-x:scroll;
	-ms-overflow-style:none;
}
	
.scroll-frm {
	background-color:#FFF;
	border:1px solid #999;
}

	
@media only screen and (max-width:480px) {

	.dict_step{
		font-size:20px;
	}
	.dict_step a:hover {
		font-size:26px;
	}

	.dict_kadai{
		font-size:16px;
	}
	.dict_kadai a:hover {
		font-size:20px;
	}
	
	.slct_title{
		font-size:22px;
	}
	
	.f-answer{
		justify-content: center;
	}
		
}
	
@media only screen and (max-width:662px) {
	.space_k-2{
		height:0px;
	}

	.space_k-r{
		height:0px;
	}
	
	.dict_ctrlbtn{
		display: none;
	}
	
	.dict_ctrlbtn_m{
		display:block;
		position:relative;
		font-size:20px;
		width:320px;
		line-height:40px;
		align-items:center;
		color:#FFF;
		border-radius:1px;
		margin:1px;
		flex:1 1 320px;
		background-color:#3B94E4;
	}

	.dict_ctrlbtn_m a:link{
		color:#FFF;
		text-decoration: none;
	}

	.dict_ctrlbtn_m a:hover{
		color:#FFF;
		text-decoration: none;
	}

	.dict_ctrlbtn_m a:active{
		color:#FFF;
		opacity: 0.5;
	}
}
	
@media only screen and (max-width:890px) {
	.bg_logo{
		background-image:none;
		height:259px ;
	}
	.key_mt6{
		margin-top:0px;
	}
	.bg_logo_mb{
		background-image:url("images/dict810logo_mb.svg");
		background-position: center;
		background-repeat: no-repeat;
		background-size: 200px 200px;
		height:180px;
	}
	.f-slctbtn {
		justify-content:center;
	}
	.slct_pt{
		padding-top:0px;
	}
	.slct_cm{
		margin-top:0px;
	}
	.dict_slct{
		width:208px;
		line-height:117px;
		font-size:20px;
	}
	.dict_slct a:hover {
		font-size:26px;
	}
	.select_icons{
		width:208px;
		height:117px;
	}
	
	.dict_step{
		margin:1px;
		line-height:88px;
		flex:1 1 250px;
	}
	
}

	@media only screen and (max-width:1000px) {
		.bg_logo{
			background-size: 100%;
		}
	}

	@media only screen and (min-width:1010px) {
		.over-scroll::-webkit-scrollbar {
			display:none;
		}
	}

	@media only screen and (min-width:1298px) {
		.koro{
			display: block;
	}
		.dict_wrap{
			background:url(images/dict_back_810-w1280.png); background-position: 50% 0%;
		}
}
