@charset "UTF-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 1em;
}

body,
table,
input, textarea, select, option {
	-webkit-text-size-adjust: none;
	font-style:normal;
}

article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary {
	display: block;
}

ol, ul {
	list-style: none;
}

img{
	border:0;
}

input,select{
	font-family: "メイリオ", "ヒラギノ角ゴ Pro W3", "MS PGothic", "MS UI Gothic", Helvetica, Arial, sans-serif;
}

body{
	/*
	font-family:Roboto,sans-serif;
	font-size:90%;
	*/
	font-size:95%;
	font-family:"メイリオ",Hiragino Kaku Gothic Pro,Osaka,"MS PGothic","MS UI Gothic",Helvetica,Arial,sans-serif;
	
	background:#ecf0f1;
	line-height:150%;
}
header .pr{
	background:#fff;
}
header #top h1{
	float:right;
}

header #top p{
	float:left;
	font-size:12px;
}

header #top .pr{
	height:18px;
	padding:3px;
	overflow:hidden;
}

header #top .pr p span{
	background:#bfc6c6;
	color:#fff;
	padding:2px 5px 2px 5px;
	margin: 0 5px 0 0;
	font-weight:normal;
	text-align:center;
	border-radius: 10px;
	font-size:12px;
	line-height:100%;
	display: inline-block;
	vertical-align:1px;
}


#header{
	/*
	background:#fff;
	*/
}

#header header h1{
	padding:2px 5px 3px 5px;
	text-align:right;
}

#header h1 img{
	width:100px;
}

#hougen_header{
	clear:both;
	background:#fdc44f;
	padding:4px 0 5px 0;
	height:40px;
}

#hougen_header h2{
	width:100%;
	text-align:center;
}


.ad_header{
	text-align:center;
	padding:5px 0 5px 0;
}

#search{
	background:#4d4d4d;
	padding:10px;
	text-align:center;
}


#footer{
	clear:both;
	padding:10px 0 0 0:
}

footer{
	padding:40px 10px 20px 10px;
	background:#000;
	color:#fff;
	text-align:center;
}


/* common end */

a{color:#3498db;text-decoration:none;}
a:link{color:#3498db;text-decoration:none;}
a:visited{color:#3498db;text-decoration:none;}
a:active{color:#3498db;text-decoration:underline;}
a:hover{color:#3498db;text-decoration:underline;}



#content{
	width:950px;
	margin:0 auto 10px auto;
	padding:10px 0 20px 0;
}

.main{
	width:630px;
	float:right;
}

.side{
	float:left;
	width:300px;
	position:relative;
	padding:260px 0 0 0;
}

#footer_area{
	clear:both;
	padding:10px 0 0 0;
}

.btn_search{
	width:36px;
	height:36px;
	vertical-align:middle;
	background : #fdc44f url(/img/ic_search_black_36dp.png) center center;
	border:0;
	padding:0;
	margin:0;
	font-size:0;
	cursor:pointer;
	-webkit-appearance: none;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	-khtml-border-radius: 0px;
	border-radius: 0px;
}

#q{
	height:36px;
	padding:0 5px;
	margin:0;
	vertical-align:middle;
	font-size:15px;
	-webkit-appearance: none;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	-khtml-border-radius: 0px;
	border-radius: 0px;
}

.ad_side{
	margin:0 0 10px 0;
	text-align:center;
	position:absolute;
	top:0px;
}

.gmenu{
	background:#fdc44f;
}
.gmenu a{
	color:#000;
	display:block;
	padding:5px;
	border-bottom:1px solid #fff;
}

.gmenu li a img{
	width:22px;
	vertical-align:bottom;
	font-size:15px;
	margin:0 3px 0 0;
}

.gmenu li a.left{
	border-right:1px solid #fff;
}
.gmenu li.col2{
	width:50%;
	float:left;
}

.gmenu li.col1{
	clear:both;
}


.midashi_l{
	background:#fff;
	border-bottom:2px solid #fdc44f;
	padding:23px 5px 12px 65px;
	margin:0px 0px 15px 0px;
	background              : url(/img/ico_hougen50.png) 6px center;
	background-repeat       : no-repeat;
}
.midashi_l h1,
.midashi_l h2{
	font-size:25px;
	padding:0 0 8px 0;
	line-height:140%;
}

.midashi_s{
	padding:8px 5px 4px 32px;
	font-size:105%;
	background : url(/img/ico_sisa.png) left bottom no-repeat;
	border-bottom:2px solid #fdc44f;
}

.sp{
	padding:10px;
}
.quiz{
	margin:10px 0 10px 0;
	padding: 0 0 10px 0;
	background:#fff;
}

.quiz h2{
	padding:8px 5px 4px 32px;
	font-size:105%;
	background : url(/img/ico_sisa.png) left bottom no-repeat;
	border-bottom:2px solid #fdc44f;
}

.side .ranking h2 a,
.side f.quiz h2 a{
	display:block;
	color:#000;
	background :  url(/img/ic_chevron_right_grey600_18dp.png) 100% center no-repeat;
}

.quiz p{
	padding:10px;
}

.quiz p span{
	color:#0071ba;
}

.quiz ol{
	padding:5px 10px 10px 10px;
}
.quiz ol li{
	padding:0 0 5px 0;
}

.quiz_next{
	clear:both;
	text-align:center;
	padding:15px 0;
}

.quiz_next nav{
	background : url(/img/ic_arrow_bottom_black_36dp.png) left center no-repeat;
	display:inline;
	padding:5px 0 5px 35px;
}
/* quiz */

.quiz .quiz_hougen{
	padding:0 0 6px 0;
	text-align:center;
}

.quiz .quiz_hougen span{
	display:inline-block;
	padding:7px 7px 2px 7px;
	font-size:200%;
	border:2px solid #808080;
	border-radius: 5px;
	font-weight:bold;
	line-height:120%;
}


.side .quiz .quiz_hougen span{
	font-size:120%;
}

.quiz_ans_jump{
	background:#fff3dc;
	clear:both;
	margin:0 10px;
	padding:10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-radius: 10px;
}

.ans_image{
	text-align:center;
}

.ans_image img{
	width:280px;
	height:auto;
}


.quiz_ans_jump .a1{
	color:#f9ae3b;
}

.quiz_ans_jump .lang{
	font-size:20px;
	color:#000;
}

.answer_list{
	background:#fff;
	border-bottom:1px solid #bdc3c7;
	padding:10px;
}

.answer_list li{
	border-top:1px solid #bdc3c7;
}

input[type=radio]{
  display: none;
}

.radio:hover{
  background-color: #fee1a8;
}

.radio:hover:after{
  border-color: #ccc;
}

.radio:after{
  width:100%;
  position: absolute;
  top: 50%;
  left: 15px;
  display: block;
  margin-top: -10px;
  width: 16px;
  height: 16px;
  border: 2px solid #ccc;
  border-radius: 9px;
  content: '';
}

.radio:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;
  left: 20px;
  display: block;
  margin-top: -5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #666;
  content: '';
  opacity: 0;
}

input[type=radio]:checked + .radio:before {
  opacity: 1;
}

input[type=radio]:checked + .radio{
  background-color:#fee1a7;
}


.radio{
  position: relative;
  display: block;
  margin: 0 0;
  padding: 12px 12px 12px 42px;
  width:auto;
  background-color: #fff3dc;
  vertical-align: middle;
  cursor: pointer;
}

.radio_ans{
  position: relative;
  display: block;
  margin: 0 0;
  padding: 12px 12px 12px 42px;
  width:auto;
  color:#b2b2b2;
  background-color: #f6f7f8;
  vertical-align: middle;
}

.btn_ans{
	clear:both;
	display:block;
	border: 0;
	margin:10px auto 5px auto;
	width:90%;
	text-align:center;
	padding:5px;
	background:#1abc9c;
	font-weight:bold;
	color:#ffffff;
	font-size:110%;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
	-moz-border-radius: 10px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px;
	-webkit-appearance: none;
	cursor:pointer;
}

a.btn_ans{
	color:#fff;
}

/* ranking */

.side .ranking{
	margin:10px 0 10px 0;
	padding: 0 0 10px 0;
	background:#fff;
}

.side .ranking h2{
	padding:8px 5px 4px 32px;
	font-size:105%;
	background : url(/img/ico_sisa.png) left bottom no-repeat;
	border-bottom:2px solid #fdc44f;
}

.side .ranking ol{
	padding:10px 10px 0 10px;
	line-height:100%;
}


.side .ranking ol a{
	display:block;
	padding: 7px 3px 7px 18px;
	margin:3px 0;
}

.side .ranking ol .rank1 a{
	background : url(/img/1.png) left 5px no-repeat;
}

.side .ranking ol .rank2 a{
	background : url(/img/2.png) left 5px no-repeat;
}

.side .ranking ol .rank3 a{
	background : url(/img/3.png) left 5px no-repeat;
}

.side .ranking ol .rank4 a{
	background : url(/img/4.png) left 5px no-repeat;
}

.side .ranking ol .rank5 a{
	background : url(/img/5.png) left 5px no-repeat;
}

/* main */

.midashi{
	padding:8px 5px 4px 32px;
	font-size:110%;
	background : url(/img/ico_sisa.png) left bottom no-repeat;
	border-bottom:2px solid #fdc44f;
}

.midashi a{
	display:block;
	color:#000;
	background :  url(/img/ic_chevron_right_grey600_18dp.png) 100% center no-repeat;
}

.midashi2{
	font-size:105%;
	background: #fff3dc;
	padding:5px 3px 5px 15px;
}

.midashi2 a{
	display:block;
	color:#000;
	background :  url(/img/ic_chevron_right_grey600_18dp.png) 100% center no-repeat;
}

.midashi span{
	background:#c0342b;
	color:#fff;
	padding:1px 5px 1px 5px;
	margin: 0 0 0 5px;
	font-weight:normal;
	text-align:center;
	border-radius: 10px;
	font-size:11px;
	line-height:100%;
	display: inline;
	vertical-align:4px;
	
}

.midashi2 span{
	background:#c0342b;
	color:#fff;
	padding:1px 5px 1px 5px;
	margin: 0 0 0 8px;
	font-weight:normal;
	text-align:center;
	border-radius: 10px;
	font-size:11px;
	line-height:100%;
	display: inline;
	vertical-align:3px;
}

.lang_list{
	padding:10px;
}

.lang_list li .lang{
	padding:5px 5px 4px 0;
	font-weight:bold;
}
.lang_list li .yaku{
	padding:0 5px 0 2px;
}
.lang_list li .yaku_detail{
	padding:5px 1px 0 2px;
	font-size:90%;
	color:#666;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}



.lang_list li .yomi{
	padding:0 5px 0 2px;
	font-size:80%;
}

.lang_list li .detail{
	padding:5px 5px 0 2px;
}


.lang_list li a{
	display:block;
	font-size:110%;
}

.lang_list .image{
	float:left;
}

.main .box{
	margin:0 0 10px 0;
	background:#fff;
}

.main .lang_list .image{
	margin: 0 10px 0 0;
}
.main .lang_list .image img{
	width:150px;
}

.main .pickup_category{
	height:155px;
	clear:both;
}

.main .pickup_category2{
	height:120px;
	clear:both;
}

.ad_main_bottom{
	text-align:center;
	padding:20px 0;
}

#footer_area{
	background:#4d4d4d;
	padding:0;
}

#footer_area .social{
	clear:both;
	padding:10px 0;
	background:#808080;
	text-align:center;
}

#footer_area nav ul{
	border-top:1px solid #ccc;

}

#footer_area nav ul li{
	float:left;
	width:50%;
	padding:0;
	margin:0;
}

#footer_area nav ul a{
	color:#fff;
	display:block;
	border-bottom:1px solid #ccc;

	padding:5px;
}



#footer{
	clear:both;
}


#hougen_header{
	position:relative;
}

#btn_menu{
	position:absolute;
	right:5px;
	top:10px;
}

#navigation{
	background:#4d4d4d;
}

#header nav ul li{
	padding:0 20px;
}

#header nav ul a{
	display:block;
	padding:10px;
	color:#fff;
	border-bottom:1px solid #fff;
}

.nav_hide{
	display:none;
}

.nav_show{
	display:block;
}

#btn_menu span {
    height: 10px;
    border: 10px solid transparent; 
    border-bottom-color: #4d4d4d;
    content: "";
    position: absolute;
    bottom: -5px;
    right: 5px;
}


#q{
	width:300px;
}


/* detail */

article.detail .midashi{
	background:#fff;
	border-bottom:2px solid #fdc44f;
	padding:23px 5px 12px 65px;
	margin:0px 0px 15px 0px;
	background              : url(/img/ico_hougen50.png) 6px center;
	background-repeat       : no-repeat;
}

article.detail h1{
	font-size:25px;
	padding:0 0 8px 0;
	line-height:140%;
}

article.detail header p{
	padding:0 5px 0 5px;
	font-size:90%;
}

article.detail .detail_image{
	padding:5px;
	text-align:center;
}

article.detail .detail_image img{
	width:70%;
	min-width:240px;
	max-width:400px;
	height:auto;
}

article.detail .detail_sub{
	font-size:110%;
	padding:5px;
	margin:15px 0 10px 0;
	color:#fdc44f;
	border-bottom:2px solid #e5e5e5;
}

article.detail .detail_body{
	padding:0 5px;
}

.detail_body ol{
	list-style-type: decimal;
	padding:5px 5px 5px 35px;
}

.detail_body ol li{
	font-size:105%;
	padding:0 0 2px 0;
}

.detail_body .kaisetsu{
	padding:0 5px;
}

.detail_body .cat{
	padding:0 5px;
}

.detail_body dl.kanren{
	padding:15px 10px 0 5px;
}

.detail_body dl.sonota{
	padding:0 5px 10px 5px;
}

.detail_body dt{
	font-weight:bold;
}

.detail_body dl.sonota dt{
	clear:both;
	float:left;
	padding:0 0 5px 0;
	width:100px;
	text-align:right;
	font-size:95%;
}

.detail_body dl.sonota dd{
	float:left;
	padding:0 0 5px 5px;
	font-weight:bold;
	font-size:95%;
}

.rcrumbs{
	padding:0 0 10px 0;
}


/* リスト */

.list_body{
	padding:10px;
}
.list_body .list_hougen li{
	padding:10px;
	border-bottom:1px solid #ccc;
	background : url(/img/ic_chevron_right_grey600_18dp.png) 100% center no-repeat;
	height:50px;
}

.list_body .list_hougen a{
	overflow:hidden;
	height:52px;
	display:block;
}

.list_body .list_hougen li .text{
	width:63%;
	float:left;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.list_body .list_hougen .image{
	width:76px;
	display:block;
	float:right;
	padding:0 13px 0 0;
}

.list_body .list_hougen .image img{
	width:100%;
}

.list_body .list_hougen li h1{
	font-size:90%;
}

.list_body .list_hougen li .std{
	color:#ccc;
	font-size:85%;
}

/* カテゴリ */
.cat1{
	padding:0;
}

.cat2{
	padding:0 0 0 30px;
}

.cat3{
	padding:0 0 0 30px;
}

.cat1 a,
.cat2 a,
.cat3 a{
	display:block;
	border-bottom:1px solid #ccc;
	padding:10px 0;
	background : url(/img/ic_chevron_right_grey600_18dp.png) 100% center no-repeat;
}

/* 五十音 */
.gojyuon_body{
	padding:10px;
}

.gojyuon_body .gojyuon{
	clear:both;
	border-top:1px solid #ccc;

}

.gojyuon_body .gojyuon li{
	width:20%;
	float:left;

}

.gojyuon_body .gojyuon li a{
	display:block;
	border-right:1px solid #ccc;
	text-align:center;
	padding:10px;
	background:#f5f5f5;
	font-size:130%;
	font-weight:bold;
}

.gojyuon_body .gojyuon li span{
	display:block;
	border-right:1px solid #ccc;
	padding:10px;
}

.gojyuon_outer{
	border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;
}

/* 翻訳 */
#henkan_result span{
	color:#ff4500;
}

/*ページナビ*/
.page_link{
	padding:10px;
	text-align:right;
}

.page_link a{
	display:inline-block;
	padding:5px;
	border:1px solid #ccc;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
	border-radius: 3px;
}

#pagetop{
	display:none;
	position:fixed;
	right:10px;
	bottom:10px;
	z-index:1000;
	filter: alpha(opacity=90); /* IE */
	-moz-opacity:0.9; /* Firefox(old) */
	-khtml-opacity: 0.9; /* Safari(old) */
	opacity: 0.9;
}

#pagetop a{
	color:#000;
}

.side .box{
	margin:0 0 10px 0;
	background:#fff;
	text-align:center;

}


.SnsArea{
	height:70px;
	display:inline-block;
}

.SnsArea li{
	display:block;
	float:left;
	margin:0 10px 0 0;
}

@media screen and (max-width: 970px){

	
	#content{
		width:auto;
		padding:10px 5px;
		position:relative;
	}
	
	.main{
		float:none;
		margin: 0 0 0 310px;
		width:auto;
	}

	.side{
		float:none;
		width:300px;
		position:absolute;
		left:5px;
		top:10px;
	}

}

@media screen and (max-width: 760px){

	.main{
		float:none;
		margin: 0;
	}

	.side{
		width:auto;
		position:static;
		padding-top:0;
	}
	
	.ad_side{
		position:static;
	}

	
	
	#footer_area nav ul li{
		float:left;
		width:50%;
	}
}


@media screen and (max-width: 680px){
	.ad_bottom {
		text-align:center;
			padding:0;
			margin:0;
	}
	
	.ad_bottom .right{
		display:none;
	}
	.ad_bottom .left{
		padding:10 0;
		margin:0;
	}
	
	#q{
		width:230px;
	}
	
	.ad_side{
		background:#fff;
		padding:20px 0;
	}
}

@media screen and (max-width: 480px){
	article.detail h1{
		font-size:20px;
	}
}
