@charset "utf-8";

/* RESET
 ============================================================ */
* { font-style: normal;}
i { font-style: italic;}
html { overflow-y: scroll;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td { margin: 0; padding: 0;}
table { border-collapse: collapse; border-spacing: 0;}
fieldset, img { border: 0;}
address, caption, cite, code, dfn, em, strong, th, var, optgroup { font-style: inherit; font-weight: inherit;}
del, ins { text-decoration: none;}
li { list-style: none;}
caption, th { text-align: left;}
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: bold;}
small { font-size: 100%; font-weight: normal;}
img { vertical-align: middle;}
q:before, q:after { content: '';}
abbr, acronym { border: 0; font-variant: normal;}
sup { font-size: 60%; vertical-align: super; }
sub { font-size: 60%; vertical-align: sub; }
legend { color: #000;}
input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit;}
a { outline: 0;}
strong { font-weight: bold;}
/* RESET HTML5 */
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}

/* Base
 ============================================================ */
body { text-align: center; background-color: #fff; color: #1a1a1a; font: 15px/1.6 Helvetica, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', HirakakuProN-W3, sans-serif; -webkit-text-size-adjust: 100%;}
a { -webkit-touch-callout: none;}
a:link,
a:visited { color: #2F6BE6; text-decoration: underline;}
a:hover,
a:active { color: #2F6BE6; text-decoration: none;}
a img { vertical-align: bottom;}

/* module
 ============================================================ */
input,
select { font-size: 16px;}
.skip { position: absolute; left: -9999px;}
.left { float: left; display: inline;}
.right { float: right; display: inline;}
.note { font-size: 75%; line-height: 1.2;}
.caption { margin-top: 9px; font-size: 75%; line-height: 1.2;}
.b { font-weight: bold;}
.morebtn { text-align: right;}
.url { word-wrap: break-word;}

.grid01 { width: 100%;}
/*.grid02.grid1.left { width: 770px;}*/
.grid02.grid1.right { width: 190px;}
.grid02.grid2.left { width: 640px;}
.grid02.grid2.right { width: 300px;}
.grid021leftwrap,
.grid022leftwrap { margin: 0;}

/* page top
 ============================================================ */
.infoArea {border-top: 1px #CCCCCC solid; border-bottom: 1px #CCCCCC solid; margin: 0 auto; padding: 8px 24px; font-weight: bold; }

.title { padding: 14px 0 20px; font-size: 186.7%;}
h3.ttl { margin: 25px 0 4px;}
h3.ttl02 { margin: 0 0 4px;}
.links li { border-top: 1px solid #e6e6e6;}
.links a { display: block; padding: 7px 0 7px; color: #1a1a1a; line-height: 1.4; text-decoration: none;}
.links a:hover { background-color: #fafafa;}
ul.links a { padding-left: 12px; background: url(/image/pc/ico_ar.png) no-repeat 0 -185px;}
ol.links li a span { display: block; float: left; display: inline; padding-right: 12px;}
.links li .time { font-size: 73.3%;}

.relLinks li { border-top: 1px solid #e6e6e6;}
.relLinks a { display: block; padding: 7px 0 7px; line-height: 1.4; text-decoration: none;}
.relLinks a:hover { background-color: #fafafa;}
.relLinks .linkTitle { display: block; margin-bottom: 5px;}
.relLinks .linkDesc { display: block; color: #808080; font-size: 0.9em;}

.disclist { zoom: normal; padding-left: 1.5em;}
.disclist li { zoom: normal; list-style: disc;}
.numlist { zoom: normal; padding-left: 1.5em;}
.numlist li { zoom: normal; list-style: decimal outside;}

div.page_link_marker { height: 0; position: relative; top: -120px; }

/* dictionary
 ============================================================ */
.pagination { overflow: hidden; position: relative; padding: 40px 0;}
.pagination ul { position: relative; left: 50%; float: left; margin-right: 20px;}
.pagination li { position: relative; left: -50%; float: left; display: inline; margin-left: 20px;}
.pagination li.prev { margin-right: 20px;}
.pagination li.next { margin-left: 40px;}
.pagination li a,
.pagination li span { text-align: center; display: block; width: 38px; line-height: 38px; font-weight: bold; text-decoration: none; border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px;}
.pagination li a { border: 1px solid #ccc; color: #000;}
.pagination li a:hover { border: 1px solid #000;}
.pagination li span { border: 1px solid #000; background-color: #000; color: #fff;}
.pagination li.prev a,
.pagination li.prev span { padding: 0 12px 0 28px; background: url(/image/pc/ico_pagination.png) no-repeat 0 -52px;}
.pagination li.next a,
.pagination li.next span { padding: 0 28px 0 12px; background: url(/image/pc/ico_pagination.png) no-repeat 100% 0;}

#loading,
.loading { text-align: center; background: url(/image/loading.gif) no-repeat center center;}

/* search
 ============================================================ */
section.searchSerp { margin: 0px 13px 50px 13px;}
section.searchSerp dl { margin-bottom: 20px;}
section.searchSerp h4 { display: inline; font-size: 16px; font-weight: normal;}
section.searchSerp a { text-decoration: none;}
section.searchSerp dd.dictionary_name { color: #008008; font-size: 14px; margin: 0;}
section.searchSerp dd { margin-bottom: 10px; font-size: 80%; color:#444;}
section.serpTitle p.info { color: #676767; font-size: 13px; margin: 4px 4px 10px 13px;}
section.serpTitle hr { border: none; background-color: #eee; height: 1px;}

/* base layout
 ============================================================ */
.bodyWrap { padding: 0 20px;}
#contentArea { zoom: 1; text-align: left; overflow: hidden; position: relative; width: 980px; margin: 0 auto;}

#hdMenu { position: absolute; top: 0; left: 0;}
#hdMenu .trigger a { display: block; text-indent: -9999px; width: 40px; height: 40px; background: url(/image/pc/ico_ar.png) no-repeat 0 10px;}
#hdMenu .trigger a:hover { background-position: 0 -40px;}
#searchArea { position: relative; margin-left: 238px; margin-bottom: 16px;}
#searchArea form { position: absolute; top: 0; right: 0;}
#searchArea input,
#searchArea select,
.customSelect { float: left; display: inline; width: 120px; height: 40px; margin-top: 10px; border: 1px solid #1a1a1a; cursor: pointer; border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -webkit-appearance: none; box-sizing: border-box;}
#searchArea input#search_input { width: 482px; padding-right: 10px; padding-left: 10px; cursor: auto; box-sizing: border-box; margin-right: 10px;}
#searchArea .selectwrap { position: relative; float: left; display: block; width: 120px;}
#searchArea select { left: 0;}
.customSelect { padding: 6px 10px; background: #1a1a1a url(/image/pc/ico_ar.png) no-repeat 86% -238px; color: #fff; font-weight: bold; box-sizing: border-box;}
#searchArea input.searchbtn { height: 40px; margin-left: 10px; background-color: #1a1a1a; color: #fff; font-weight: bold;}
#searchArea input.searchbtn:hover,
.customSelect.customSelectHover { border: 1px solid #808080; background-color: #808080;}

/* 下部検索窓
 ============================================================ */
#searchAreaWordBottom { padding-bottom: 45px;}
#searchAreaWordBottom .search_inputwrap { display: inline-block;}
#searchAreaWordBottom input { display: inline-block; width: 120px; height: 40px; margin-top: 10px; border: 1px solid #1a1a1a; cursor: pointer; border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -webkit-appearance: none; box-sizing: border-box;}
#searchAreaWordBottom input#search_input { width: 700px; padding-right: 10px; padding-left: 10px; cursor: auto; box-sizing: border-box;}
#searchAreaWordBottom .selectwrap { display: inline-block; height: 40px; margin-left: 10px; width: 120px; vertical-align: bottom; margin-bottom: 10px;}
#searchAreaWordBottom input.searchbtn { height: 40px; margin-left: 10px; background-color: #1a1a1a; color: #fff; font-weight: bold;}
#searchAreaWordBottom input.searchbtn:hover { border: 1px solid #808080; background-color: #808080;}

.easy-select-box { zoom: 1; position: relative; float: left; display: inline; width: 120px; height: 40px; margin-top: 10px;}
.easy-select-box .esb-dropdown{ position: absolute; top: 100%; left: 0; z-index: 99; display: none;}
.easy-select-box .esb-displayer{ width: 100px; height: 38px; padding: 0 10px; line-height: 38px; background: #1a1a1a url(/image/pc/ico_ar.png) no-repeat 86% -238px; color: #fff; font-weight: bold; border: 1px solid #1a1a1a; cursor: pointer; border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px;}
.easy-select-box:hover .esb-displayer{ border: 1px solid #808080; background-color: #808080;}
.easy-select-box .esb-dropdown{ overflow: auto; width: 118px; max-height: 200px; border: 1px solid #ccc; background: #fff;}
.easy-select-box .esb-dropdown .esb-item{ padding: 3px; background: #fff; color: #0c2245; cursor: default;}
.easy-select-box .esb-dropdown .esb-item:hover{ background: #3399ff; color: #fff; text-decoration: none;}

#hdWrap .search_inputwrap { margin-right: 0;}
#hdWrap #searchArea form { width: 742px;}
#hdWrap #search_input { width: 742px;}
#hdMenuCont { z-index: 999; text-align: left; display: none; position: absolute; top: 0; left: -320px; width: 299px; padding-left: 20px; border-right: 1px solid #e6e6e6; background-color: #fff; font-size: 86.7%;}
#hdMenuCont .box { padding: 6px 0 26px;}
#hdMenuCont #hdTodayWord.box { padding-right: 20px;}
#hdTodayWord h2 { padding-bottom: 7px;}
#hdTodayWord p { line-height: 1.3;}
#hdTodayWord p.more,
#hdNav .links { margin-top: 5px;}
#hdNav .links li { border-top: 0;}
#hdNav .links li a { padding: 0 0 0 12px; background-position: 0 -190px; line-height: 2; font-weight: bold;}
#hdNav .links li.ft a { font-weight: normal;}
#hdBtn h3 { padding-bottom: 2px;}
#hdBtn .bn a { display: block; padding-bottom: 8px; text-indent: -9999px; width: 136px; height: 39px; background: url(/image/pc/bt_app.gif) no-repeat 0 0;}
#hdBtn .bnAndroid a { display: block; padding-bottom: 8px; text-indent: -9999px; width: 136px; height: 33px; background:url(/image/pc/google-play-badge.png) no-repeat 0 0; background-size: cover;}
#overlay { z-index: 900; display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: 0.1; filter: alpha(opacity=10);}

#ftWrap { background-color: #1a1a1a; font-size: 73.3%; color: #fff;}
#ftWrap .bodyWrap { padding: 0 20px;}
#ftWrap .inner { zoom: 1; text-align: left; overflow: hidden; position: relative; width: 100%; max-width: 1020px; margin: 0 auto; padding: 38px 0; background-color: #1a1a1a;}
#sponsor { float: left; display: inline;}
#sponsor li { float: left; display: inline; height: 30px; margin-right: 20px;}
#sponsor li:last-of-type { margin-right: 0;}
#sponsor a.spoa img { width: 98px; height: 30px;}
#sponsor a.spov img { width: 115px; height: 22px;}
#ftWrap .menu { float: right; display: inline;}
#ftWrap .menu li:first-child {margin-left: 0;}
#ftWrap .menu li { float: left; display: inline; margin-left: 20px;}
#ftWrap .menu li a { color: #fff; font-weight: bold;}
#copyright { clear: both; padding-top: 30px; color: #808080;}
#copyright a.spoy { display: none;}

/* media
 ============================================================ */
@media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 641px) {
	ul.links a,
	#hdMenu .trigger a,
	.customSelect { background-image: url(/image/pc/ico_ar@2x.png); -webkit-background-size: 50px 300px; -moz-background-size: 50px 300px; background-size: 50px 300px;}
	#hdBtn a { background-image: url(/image/pc/bt_app@2x.gif); -webkit-background-size: 136px 39px; -moz-background-size: 136px 39px; background-size: 136px 39px;}
}

/* pagination
 ============================================================ */
#pagination { display: flex; justify-content: center; align-items: center; margin: 40px 70px;}
#pagination .button { display: flex; justify-content: center; align-items: center; width: 80px; height: 40px; border: none; border-radius: 4px; background-color: #f2f2f2; margin: 0 5px; cursor: pointer;}
#pagination .button:hover { background-color: #e3e3e3;}
#pagination .chevron { fill: #333;}
#pagination .numbered-page { font-size: 16px; font-weight: bold; margin: 0 10px; color: #333;}
#pagination .previous { padding-left: 10px;}
#pagination .next { padding-right: 10px;}

/* TOP 情報
 ============================================================ */
#topInfo { text-align: center; margin-top: 70px; }

/* モーダル
 ============================================================ */
.kotobankModal { display: none; position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4); }
.kotobankModal .modal-content { background-color: #fefefe; margin: 15% auto; padding: 35px 35px 35px 35px; border: 1px solid #888; width: 75%; position: relative; }
.kotobankModal .modal-button { display: flex; justify-content: center; align-items: center; color: #000; width: 90%; height: 50px; padding: 10px; text-align: center; margin: 10px auto; border: 1px solid #888; border-radius: 4px; text-decoration: none; }
.kotobankModal .modal-button:hover { background-color: #eee; }
.kotobankModal .modal-arrow { display: inline-block; width: 20px; height: 20px; border: 1px solid #000; border-radius: 50%; text-align: center; line-height: 18px; margin-left: 10px; }
.kotobankModal .modal-close { position: absolute; top: 10px; right: 10px; font-size: 20px; cursor: pointer; }

/* 課金誘導情報
 ============================================================ */
#payment_info a { text-decoration: none; }
#payment_info div.info { display: inline-block; margin: 20px 0px 10px 0px; padding: 7px 12px 8px 12px; border-radius: 12px; border: 1px solid; border-color: #DAE2ED; color: #0073E6; background-color: #EBF5FF; font-size: 90%; font-weight: bold; width: 740px }
#payment_info div.info:hover { background-color: #D6E9FF; }
body.payment .plan-container { display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1400px; margin: 0 auto; }
body.payment .plan { flex: 1 1 calc(50% - 20px); margin: 10px; min-width: 300px; }
body.payment .plan-box { padding: 10px; border: 1px solid #666; margin-bottom: 14px; }
body.payment .plan-description { font-size: 85%; }
@media (max-width: 768px) { body.payment .plan { flex: 1 1 100%; } }

/* 下部検索窓 モバイル
 ============================================================ */
@media only screen and (max-width: 1020px) {
	.winpc #contentArea { width: 100%;}
	.winpc #hdWrap #searchArea { margin-left: 238px;}
	.winpc #hdWrap #searchArea form { width: 100%;}
	.winpc #hdWrap .search_inputwrap { margin-right: 270px;}
	.winpc #hdWrap #searchArea input#search_input { width: 100%;}
	.winpc .grid021leftwrap { margin-right: 200px;}
	.winpc .grid02.grid1.left { width: 100%;}
	.winpc .grid02.grid2.left { width: 100%;}
	.winpc #searchAreaWordBottom form { width: 100%;}
	.winpc #searchAreaWordBottom input#search_input { width: 100%;}
}
@media only screen and (max-width: 940px) {
}
@media only screen and (max-width: 840px) {
	#payment_info div.info { width: 95%; }
}
@media only screen and (max-width: 660px) {
	body.winsp,
	.winsp input,
	.winsp select { font-size: 30px;}
	.winsp .grid02.grid1.left,
	.winsp .grid02.grid1.right,
	.winsp .grid02.grid2.left,
	.winsp .grid02.grid2.right { float: none; display: block; width: auto;}
	.winsp #contentArea { width: 100%;}
	.winsp #contentArea .title { text-indent: 0; height: auto; padding-left: 20px; padding-right: 20px; background: none; font-size: 140%;}
	.winsp ul.links a { padding-left: 24px; background: url(/image/sp/ico_ar.png) no-repeat 0 -180px;}
	.winsp #pagination { margin: 0px 0px;}

	.winsp .bodyWrap { padding: 0;}
	.winsp #hdMenu { top: 20px; left: 0;}
	.winsp #hdMenu .trigger a { width: 100px; height: 90px; background: url(/image/sp/ico_ar.png) no-repeat 20px 20px;}
	.winsp #hdMenu .trigger a:hover { background-position: 20px -54px;}
	.winsp #searchArea { margin-top: 36px; margin-left: 0;}
	.winsp #searchArea form { position: relative;}
	.winsp #searchArea .selectwrap,
	.winsp #searchArea select,
	.winsp .customSelect { display: none;}
	.winsp #searchArea input { float: none; display: block; width: 160px; height: 80px; margin-top: 0; border: 0; border-radius: 0; -o-border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -webkit-appearance: none;}
	.winsp #searchArea input#search_input { width: 100%; margin-right: 0; padding-right: 180px; padding-left: 20px; border-top: 1px solid #1a1a1a; border-right: 0; border-bottom: 1px solid #1a1a1a; border-left: 0;}
	.winsp #searchArea input.searchbtn { z-index: 30; position: absolute; top: 0; right: 0; width: 160px; height: 80px; margin-left: 0;}
	.winsp #searchAreaWordBottom .selectwrap { display: none;}

	.winsp #hdWrap #searchArea form,
	.winsp #hdWrap #search_input { width: 100%; box-sizing: border-box;}
	.winsp #hdMenuCont .box { padding: 28px 0 26px; font-size: 73.3%;}
	.winsp #hdMenuCont .todayWordDesc { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
	.winsp #hdNav .links li a { padding: 0 0 0 12px; background-position: 0 -185px; line-height: 2; font-weight: bold;}
	.winsp #ftWrap .bodyWrap {}
	.winsp #sponsor { position: relative; float: none; display: block;}
	.winsp #sponsor li {}
	.winsp #sponsor a,
	.winsp #copyright a.spoy { display: block; }
	.winsp #sponsor a.spoa img { width: 142px; height: 44px;}
	.winsp #sponsor li.spoy { display: none;}
	.winsp #sponsor a.spov img { width: 160px; height: 36px;}
	.winsp #ftWrap .menu { position: relative; float: none; display: block; padding-top: 36px;}
	.winsp #ftWrap .menu li {}
	.winsp #copyright { line-height: 1.4;}
	.winsp #copyright a.spoy { position: relative; float: left; width: 58px; height: 36px; margin: 0 5px 3px 0; background-position: 0 -100px;}

	#topInfo { margin-top: 10px; font-size: 73.3%; }
}
@media only screen and (max-width: 500px) {
	body.winsp,
	.winsp input,
	.winsp select { font-size: 18px;}
	.winsp input,
	.winsp select { font-size: 18px;}
	.winsp #contentArea .title { padding-left: 10px; padding-right: 10px;}
	.winsp ul.links a { padding-left: 12px; background: url(/image/sp/ico_ar.png) no-repeat 0 -90px; -webkit-background-size: 50px 200px; -moz-background-size: 50px 200px; background-size: 50px 200px;}
	.winsp #pagination { margin: 0px 0px;}

	.winsp #hdMenu { top: 10px;}
	.winsp #hdMenu .trigger a { width: 50px; height: 45px; background: url(/image/sp/ico_ar.png) no-repeat 10px 10px; -webkit-background-size: 50px 200px; -moz-background-size: 50px 200px; background-size: 50px 200px;}
	.winsp #hdMenu .trigger a:hover { background-position: 10px -27px;}
	.winsp #searchArea { margin: 18px 0;}
	.winsp #searchArea input { width: 80px; height: 40px;}
	.winsp #searchArea input#search_input { padding-right: 90px; padding-left: 10px;}
	.winsp #searchArea input.searchbtn { width: 80px; height: 40px;}

	.winsp #searchAreaWordBottom { margin: 0;}
	.winsp #searchAreaWordBottom .search_inputwrap { width: calc(100% - 80px); vertical-align: top;}
	.winsp #searchAreaWordBottom input { width: 80px; height: 40px; border-radius: 0; box-sizing: border-box;}
	.winsp #searchAreaWordBottom input#search_input { padding-right: 10px; padding-left: 10px; margin: 0; width: 100%;}
	.winsp #searchAreaWordBottom input.searchbtn { width: 80px; height: 40px; margin: 0; border: 0;}
	.winsp #searchAreaWordBottom .selectwrap { display: none;}

	.winsp #hdMenuCont { left: -210px; width: 199px; padding-left: 10px;}
	.winsp #hdMenuCont .box { padding: 14px 0 13px;}
	.winsp #hdNav .links li a { padding: 0 0 0 10px; background-position: 0 -92px;}
	.winsp #ftWrap .bodyWrap { padding: 0 10px;}
	.winsp #ftWrap .inner { padding: 20px 0 18px;}
	.winsp #sponsor {}
	.winsp #sponsor li { margin-right: 10px;}
	.winsp #sponsor a,
	.winsp #copyright a.spoy { -webkit-background-size: 100px 150px; -moz-background-size: 100px 150px; background-size: 100px 150px;}
	.winsp #sponsor a.spoa img { width: 71px; height: 22px;}
	.winsp #sponsor a.spov img { width: 80px; height: 18px;}
	.winsp #ftWrap .menu { padding-top: 20px;}
	.winsp #ftWrap .menu li:first-child {  margin-left: 0;}
	.winsp #ftWrap .menu li {  margin-left: 10px; padding-bottom: 0;}
	.winsp #copyright { padding-top: 20px;}
	.winsp #copyright a.spoy { width: 29px; height: 18px; margin-top: 0; background-position: 0 -50px;}
}

/* clear
 ============================================================ */
.cf,
#hdWrap, #searchArea, #ftWrap .menu, #sponsor { zoom: 1;}

.cf:after,
#hdWrap:after, #searchArea:after, #ftWrap .menu:after, #sponsor:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}