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

/* numchildrenの定義をプロトで追加。201909 */

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&subset=japanese');


/* ----------------------------------------------
   基本設定
------------------------------------------------ */
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;
}
article, aside, canvas, details, figcaption, figure,footer, header, hgroup, menu, nav, section, summary {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
label,
button,
input[type="button"],
input[type="submit"] {
	cursor: pointer;
}
button,
input[type="button"],
input[type="submit"] {
	-webkit-appearance: none;
	border-radius: 0;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #666;
}
::-moz-placeholder { /* Firefox 19+ */
	color: #666;
}
:-ms-input-placeholder { /* IE 10+ */
	color: #666;
}
:-moz-placeholder { /* Firefox 18- */
	color: #666;
}


/* ----------------------------------------------
   レイアウト
------------------------------------------------ */
* {
	font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	position: relative;
	min-width: 1100px;
	height: auto !important;
	line-height: 1.5;
	color: #333;
	background: #fff;
	text-align: center;
	-webkit-text-size-adjust: none;
}
body.ipad {
	min-height: 1500px;
}
h1, h2, h3, h4, h5, h6 {
	font-feature-settings: "palt" on;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}
button,
input,
textarea,
select {
	font-size: 100%;
}
table {
	border-collapse: collapse;
}
a, a:link {
	color: #4a6bb2;
	text-decoration: none;
}
a:visited {
	color: #4a6bb2;
	text-decoration: none;
}
a:hover, a:active {
	text-decoration: none;
}
a.blank:after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f35d";
	margin-left: 5px;
}
a.link:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f054";
	margin-right: 5px;
}

#container {
	overflow: hidden;
}
.wrap {
	position: relative;
	width: 1000px;
	margin: 0 auto;
	text-align: left;
}
.sp {
	display: none;
}
.orange {
	color: #ea5933;
}
.youtube {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}
.youtube iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* ボタン */
.submitBtn {
	position: relative;
	display: inline-block;
	min-width: 240px;
	height: 55px;
	font-size: 20px;
	line-height: 20px;
	color: #fff !important;
	margin: 0 20px;
	padding: 15px 10px;
	background: #333;
	border: none;
	border-bottom: 3px solid #000;
	border-radius: 30px;
	text-align: center;
	box-shadow: none !important;
	text-shadow: none !important;
	white-space: nowrap;
	overflow: hidden;
	transition: .5s;
}
.submitBtn:hover {
	opacity: 0.8;
}
.submitBtn:disabled {
	background: #c8c8c8;
	border-color: #c8c8c8;
	cursor: default;
	opacity: 1 !important;
}
.backBtn {
	position: relative;
	display: inline-block;
	min-width: 240px;
	height: 55px;
	font-size: 20px;
	line-height: 20px;
	color: #333 !important;
	margin: 0 20px;
	padding: 15px 10px;
	background: #ccc;
	border: none;
	border-bottom: 3px solid #999;
	border-radius: 30px;
	text-align: center;
	box-shadow: none !important;
	text-shadow: none !important;
	white-space: nowrap;
	overflow: hidden;
	transition: .5s;
}
.backBtn:hover {
	opacity: 0.8;
}


/* フォーム */
.form textarea {
	width: 100%;
	height: 150px;
	padding: 0.5em;
	border: 2px solid #ccc;
	border-radius: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.form input[type="text"],
.form input[type="password"] {
	width: 100%;
	padding: 5px 0.5em;
	border: 2px solid #ccc;
	border-radius: 0;
	vertical-align: middle;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.form input[type="text"]:disabled {
	background: #f0f4fe;
	border: 2px solid #ccc;
}
.form input[type="checkbox"],
.form input[type="radio"] {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.form label.checkbox {
	position: relative;
	display: inline-block;
	word-break: break-all;
}
.form label.checkbox span {
	display: inline-block;
	padding: 5px 30px;
}
.form label.checkbox input[type="checkbox"] {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
.form label.checkbox input[type="checkbox"] + span:before {
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 0;
	width: 20px;
	height: 20px;
	content: "";
	margin: -10px 0 0;
	background-color: transparent;
	border: 2px #ccc solid;
	box-sizing: border-box;
	z-index: 0;
}
.form label.checkbox input[type="checkbox"]:checked + span:after {
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 6px;
	width: 4px;
	height: 8px;
	content: "";
	margin: -7px 0 0;
	-moz-transform: rotate(40deg);
	-webkit-transform: rotate(40deg);
	-o-transform: rotate(40deg);
	-ms-transform: rotate(40deg);
	transform: rotate(40deg);
	border-bottom: 4px solid #231815;
	border-right: 4px solid #231815;
	z-index: 1;
}
.form label.radio {
	position: relative;
	display: inline-block;
	word-break: break-all;
}
.form label.radio span {
	display: inline-block;
	padding: 5px 30px;
}
.form label.radio input[type="radio"] {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
.form label.radio input[type="radio"] + span:before {
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 0;
	width: 20px;
	height: 20px;
	content: "";
	margin: -10px 0 0;
	background-color: transparent;
	border: 2px #ccc solid;
	border-radius: 20px;
	box-sizing: border-box;
	z-index: 0;
}
.form label.radio input[type="radio"]:checked + span:after {
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 5px;
	width: 10px;
	height: 10px;
	content: "";
	margin: -5px 0 0;
	background-color: #2c3b64;
	border-radius: 10px;
	box-sizing: border-box;
	z-index: 1;
}
.form label.checkbox input[type="checkbox"]:disabled + span,
.form label.radio input[type="radio"]:disabled + span {
	color: #aaa;
}
.form ul.checkbox {
	overflow: hidden;
}
.form ul.checkbox li {
	float: left;
	padding: 0 30px 0 0;
}
.form ul.checkbox li label.checkbox span {
	padding-right: 0;
}
.form ul.checkbox li input[type="text"] {
	width: 440px;
	margin-left: 10px;
}
.form .selectBox {
	position: relative;
	display: inline-block;
	width: 130px;
	margin-right: 5px;
	border: 2px solid #ccc;
	vertical-align: middle;
}
.form .selectBox.wide {
	width: 350px;
}
.form .selectBox.full {
	width: 100%;
}
.form .selectBox:after {
	position: absolute;
	display: block;
	top: 50%;
	right: 5px;
	width: 30px;
	height: 30px;
	font-family: "Font Awesome 5 Free";
	font-size: 16px;
	font-weight: 900;
	content: "\f078";
	margin-top: -15px;
	background: #eee;
	text-align: center;
	pointer-events: none;
}
.form .selectBox select {
	position: relative;
	width: 100%;
	height: 40px;
	padding: 5px;
	background: #fff;
	border: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.form .selectBox select:disabled {
	background-color: #f0f4fe;
}
.form .selectBox select::-ms-expand {
	display: none;
}

/* モーダルウィンドウ */
.modal {
	position: fixed;
	top: 0px;
	left: 0px;
	display: none;
	z-index: 10000;
	opacity: 0;
}
.modalBody {
	position: fixed;
	top: 45%;
	left: 50%;
	width: 1000px;
	height: 680px;
	margin: -280px 0 0 -500px;
	padding: 30px;
	background: #fff;
	text-align: left;
	z-index: 10;
}
.modalBody #keywordSearch {
	margin: 0 0 30px;
}
.modalBody #searchOption .resultStats {
	margin: 0 0 20px;
}
.modalBody #searchOptionToggleBtn {
	display: none;
}
.modalBody .modalClose {
	position: absolute;
	top: -40px;
	right: 0px;
	z-index: 20;
	cursor: pointer;
}
.modalBody .modalClose:before {
	display: block;
	width: 40px;
	font-family: "Font Awesome 5 Free";
	font-size: 24px;
	line-height: 40px;
	font-weight: 900;
	color: #fff;
	content: "\f00d";
	background: #000;
	text-align: center;
}
.modalBG {
	position: fixed;
	width: 100%;
	height: 100%;
	background: #000;
	z-index: 1;
	opacity: 0.7;
}

.fav_modal {
	display: none;
	opacity: 0;
}
.fav_modal .main {
	position: fixed;
	left: 50%;
	top: 50%;
	width: 440px;
	height: 380px;
	line-height: 1.5;
	margin: -220px 0 0 -190px;
	padding: 40px;
	background: #fff;
	text-align: center;
	z-index: 20001;
}
.fav_modal h2 {
	font-size: 16px;
	margin: 0;
}
.fav_modal p {
	margin: 20px 0 0;
}
.fav_modal .btn a {
	display: block;
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	padding: 10px;
	background: #e6230f;
	border: 3px solid #e6230f;
	border-radius: 30px;
	cursor: pointer;
	transition: .3s;
}
.fav_modal .btn a:hover {
	opacity: 0.5;
}
.fav_modal .link span {
	font-size: 16px;
	color: #5776b8;
	text-decoration: underline;
	cursor: pointer;
	transition: .3s;
}
.fav_modal .link span:hover {
	opacity: 0.5;
}
.fav_modal_bg {
	position: fixed;
	width: 100%;
	height: 100%;
	background: #000;
	z-index: 20000;
	opacity: 0.5;
}


/* ----------------------------------------------
   ヘッダー
------------------------------------------------ */
#header {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	background: #fff;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
	z-index: 10000;
}
#header .catchcopy {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	font-size: 12px;
	font-weight: bold;
	line-height: 26px;
	color: #fff;
	background: #666;
}
#header .logo {
	position: absolute;
	top: 40px;
	left: 0px;
	transition: .3s;
}
#header .logo a {
	display: inline-block;
	width: 308px;
	height: 130px;
	background: url(/static/images/common/header_logo.png) no-repeat center center;
	text-align: left;
	text-indent: -777px;
	overflow: hidden;
}
#header .header-conversion {
	position: absolute;
	bottom: 70px;
	right: 360px;
	transition: .3s;
}
#header .header-conversion a {
	display: inline-block;
	padding: 4px 10px;
	background-color: #fee301;
	color: #000;
	border-radius: 6px;
}
#keywordSearch {
	position: relative;
}
#keywordSearch input[type="text"] {
	height: 34px;
	padding: 0 0 0 15px;
	border: 2px solid #333;
	border-radius: 20px;
}
#keywordSearch button {
	position: absolute;
	display: inline-block;
	top: 50%;
	right: 90px;
	width: 30px;
	height: 30px;
	content: "";
	margin-top: -15px;
	background: none;
	border: none;
	overflow: hidden;
}
#gNav #headerSearch #keywordSearch {
	padding: 0 80px 0 0;
}
#gNav #headerSearch #keywordSearch #searchOptionToggleBtn {
	position: absolute;
	display: inline-block;
	top: 50%;
	right: 0px;
	font-size: 14px;
	line-height: 30px;
	content: "";
	margin-top: -15px;
	text-align: right;
	overflow: hidden;
	white-space: nowrap;
	cursor: pointer;
}
#gNav #headerSearch #keywordSearch #searchOptionToggleBtn:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f067";
	margin-right: 3px;
}
#gNav #headerSearch #keywordSearch #searchOptionToggleBtn.active:before {
	content: "\f068";
}
#gNav #headerSearch #searchOption {
	display: none;
	padding: 15px;
	background: #fff;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
}
#searchOption .options p {
	font-weight: bold;
}
#searchOption .options ul li {
	white-space: nowrap;
}
#searchOption .options ul ul {
	display: inline-block;
	vertical-align: -8px;
}
#searchOption .options ul ul li {
	font-size: 12px;
	padding: 0 0 0 15px;
}
#searchOption .resultStats {
	font-size: 14px;
	margin: 0 0 10px;
	padding: 5px 10px;
	background: #eee;
	border-radius: 5px;
}
#searchOption .btn {
	margin: 10px 0 0;
	text-align: center;
}
#searchOption .btn button {
	display: inline-block;
	line-height: 40px;
	color: #fff;
	padding: 0 30px;
	background: #333;
	border: none;
	border-radius: 20px;
	cursor: pointer;
	transition: .3s;
}
#searchOption .btn button:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f002";
	margin-right: 10px;
}
#searchOption .btn button:hover {
	opacity: 0.7;
}
#gNav .sub ul.sns li a {
	color: #666;
}

/* ログイン前後の表示・非表示 */
#header .mypage,
#header .logout,
body.loggedin #header .registration,
body.loggedin #header .login {
	display: none;
}
body.loggedin #header .mypage,
body.loggedin #header .logout {
	display: block;
}


/* ----------------------------------------------
   フッター
------------------------------------------------ */
#footer {
	clear: both;
	text-align: center;
}
#footer a {
	color: #333;
}
#footer .copyright {
	font-size: 11px;
	line-height: 1.2;
	color: #fff;
	padding: 15px 0;
	background: #333;
}
#footer .copyright p {
	margin: 8px 0;
}

/* ページトップへ戻るボタン */
.pageTopBtn {
	position: fixed;
	display: block;
	right: 10px;
	bottom: -250px;
	width: 140px;
	height: 208px;
	background: url("/static/images/common/pagetop.png") no-repeat center center;
	cursor: pointer;
	transition: .5s;
}
.pageTopBtn:hover {
	opacity: 0.7;
}
body.form .pageTopBtn {
	display: none;
}


/* ----------------------------------------------
   コンテンツ
------------------------------------------------ */

/* パンくず */
#breadcrumb {
	font-size: 0;
	background: #e3e3e3;
	padding: 10px 0;
}
#breadcrumb li {
	display: inline;
	font-size: 13px;
	line-height: 1.5;
}
#breadcrumb li:after {
	content: ">";
	margin: 0 10px;
}
#breadcrumb li:last-child:after {
	display: none;
}
#breadcrumb li a {
	color: #333;
}

/* 速報枠 */
#contents .alertbox .alert {
	font-weight: bold;
	line-height: 1.2;
	margin: 15px 0 10px;
}
#contents .alertbox .alert,
#contents .alertbox .alert a {
	color: #e5220e;
}
#contents .alertbox .alert a {
	text-decoration: underline;
}

/* 基本設定 */
#contents {
	font-size: 16px;
	line-height: 1.7;
	padding: 150px 0 30px;
	background: #f2f2f2 url("/static/images/common/bg_patterns.png");
}
body.kotoba #contents {
	background: url("/static/images/common/bg_kotoba.png");
}
body.kazu #contents {
	background: url("/static/images/common/bg_kazu.png");
}
body.hyougen #contents {
	background: url("/static/images/common/bg_hyougen.png");
}
body.karada #contents {
	background: url("/static/images/common/bg_karada.png");
}
body.special #contents {
	background: url("/static/images/common/bg_special.png");
}
/* 20191217追加 */
body.special_porepore #contents {
	background: url("/static/images/common/bg_special_porepore.png");
}

#contents .pageTitle {
	font-size: 32px;
	line-height: 1.3;
	margin: 30px 0 20px;
}
#contents .pageBox {
	padding: 30px 60px;
	background: #fff;
	border: 3px solid #333;
	border-radius: 10px;
}

/* 記事 */
#contents .entryBody {
	line-height: 1.7;
}
#contents .entryBody a {
	text-decoration: underline;
}
#contents .entryBody h2 {
	font-size: 122.22222%;
	color: #1f2e55;
	margin: 50px 0 30px;
}
#contents .entryBody p {
	margin: 20px 0;
}
#contents .entryBody ul {
	margin: 20px 0;
}
#contents .entryBody li {
	margin-top: 10px;
}
#contents .entryBody ul li {
	margin-left: 20px;
	list-style-type: disc;
}
#contents .entryBody ol li {
	margin-left: 30px;
	list-style-type: decimal;
}
#contents .entryBody .chess_picture_c {
	text-align: center;
}
#contents .entryBody .chess_picture_l {
	float: left;
	width: 30%;
	margin: 0 30px 30px 0;
	text-align: center;
}
#contents .entryBody .chess_picture_r {
	float: right;
	width: 30%;
	margin: 0 0 30px 30px;
	text-align: center;
}
#contents .entryBody .chess_picture_c div.block,
#contents .entryBody .chess_picture_l div.block,
#contents .entryBody .chess_picture_r div.block {
	margin: 30px auto;
	padding: 0;
	overflow: hidden;
}
#contents .entryBody .chess_picture_c small,
#contents .entryBody .chess_picture_l small,
#contents .entryBody .chess_picture_r small {
	display: block;
	font-size: 77.77778%;
	line-height: 1.3;
	color: #60666a;
	padding: 15px 0 0;
	text-align: left;
	word-break: break-all;
}
#contents .entryBody .chess_picture_c a,
#contents .entryBody .chess_picture_l a,
#contents .entryBody .chess_picture_r a {
	white-space: normal;
	word-break: break-all;
}

/* 表 */
#contents table.basic {
	width: 100%;
	border-top: 1px solid #e1eaf1;
}
#contents table.basic th,
#contents table.basic td {
	padding: 25px 15px;
	border-bottom: 1px solid #e1eaf1;
	text-align: left;
	vertical-align: top;
}
#contents table.basic th {
	width: 180px;
}
#contents table.basic th p,
#contents table.basic td p {
	margin: 0;
}
#contents table.basic td li {
	margin-top: 5px;
}
#contents table.basic td p + p,
#contents table.basic td ul + p {
	margin-top: 15px;
}

/* リスト */
#contents ul.basic li {
	position: relative;
	line-height: 24px;
	padding: 0 0 0 15px;
}
#contents ul.basic li:before {
	position: absolute;
	left: 2px;
	font-size: 6px;
	content: "●";
}

/* タグ */
#contents .tag1 {
	font-size: 13px;
	line-height: 22px;
	margin: 10px 0 0;
}
#contents .tag1 .txt {
	display: inline-block;
	font-weight: bold;
	margin-right: 5px;
}
#contents .tag1 a {
	display: inline-block;
	min-width: 60px;
	color: #fff;
	margin-right: 5px;
	padding: 0 10px;
	background: #599fda;
	border-radius: 3px;
	text-align: center;
}
#contents .tag1 a.kazu {
	background-color: #6ebe50;
}
#contents .tag1 a.hyougen {
	background-color: #e6230f;
}
#contents .tag1 a.karada {
	background-color: #b964a5;
}
#contents .tag1 a.special {
	color: #ffe200;
	background-color: #333;
}

#contents .tag2 {
	font-size: 13px;
	line-height: 22px;
	margin: 10px 0 0;
}
#contents .tag2 a {
	display: inline-block;
	color: #666;
	margin-right: 5px;
	padding: 0 5px;
	border: 1px solid #ccc;
	border-radius: 3px;
}
#contents .meta {
	font-size: 13px;
	line-height: 22px;
	margin: 10px 0 0;
}
#contents .meta .guide {
	font-weight: bold;
	margin-right: 10px;
}
#contents .meta .guide:before {
	font-family: "Font Awesome 5 Free";
	font-size: 16px;
	font-weight: 400;
	content: "\f15c";
	margin-right: 5px;
}
#contents .meta .limited {
	display: inline-block;
	width: 132px;
	height: 24px;
	font-size: 0;
	background: url("/static/images/common/limited_icon.png") no-repeat center center;
	background-size: contain;
	vertical-align: middle;
}


/* 記事一覧 */
#contents #searchNavBtn {
	display: inline-block;
	font-size: 14px;
	line-height: 34px;
	color: #fff;
	padding: 0 15px;
	background: #333;
	border-radius: 20px;
	cursor: pointer;
}
#contents #searchNavBtn:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f002";
	margin-right: 5px;
}
#contents .list .nav {
	padding: 0 0 20px;
	border-bottom: 3px solid #333;
}
#contents .list .item {
	padding: 30px 0;
	border-bottom: 2px dotted #ddd;
	overflow: hidden;
}
#contents .list .item .img {
	float: left;
	width: 190px;
	height: 190px;
	line-height: 190px;
	margin-right: 50px;
	text-align: center;
	vertical-align: middle;
}
#contents .list .item .img img {
	max-height: 100%;
	border: 1px #808080 solid;
}
#contents .list .item .txt {
	overflow: hidden;
}
#contents .list .item .txt h2 {
	font-size: 24px;
	line-height: 1.3;
	margin: 0 0 10px;
}
#contents .list .item .txt h2 .fa-video {
	font-size: 16px;
	color: #333;
	margin-left: 10px;
	vertical-align: 3px;
}

/* ページャー */
#contents .pagination {
	position: relative;
	font-size: 0;
	margin: 30px 0;
	text-align: center;
}
#contents .pagination li {
	position: relative;
	display: inline-block;
	width: 34px;
	font-size: 16px;
	line-height: 34px;
	margin: 0 5px;
	overflow: hidden;
}
#contents .pagination li a {
	display: block;
	color: #000;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 20px;
	text-decoration: none;
}
#contents .pagination li.active a {
	color: #fff;
	background: #333;
	border-color: #333;
}
#contents .pagination li.disabled a {
	cursor: not-allowed;
	color: #ccc;
}

/* ランキング */
#contents .ranking {
	margin: 60px 0 30px;
	overflow: hidden;
}
#contents .ranking .title {
	margin: 0 0 20px;
	text-align: center;
}
body.kotoba #contents .ranking .title {
	margin: 0 0 20px;
	color:#333;
	text-align: center;
}
body.kazu #contents .ranking .title {
	margin: 0 0 20px;
	color:#333;
	text-align: center;
}
body.hyougen #contents .ranking .title {
	margin: 0 0 20px;
	color:#333;
	text-align: center;
}
body.karada #contents .ranking .title {
	margin: 0 0 20px;
	color:#333;
	text-align: center;
}
body.special #contents .ranking .title {
	margin: 0 0 20px;
	color:#EEEEEE;
	text-align: center;
}
/* 20191217追加 */
body.special_porepore #contents .ranking .title {
	margin: 0 0 20px;
	color:#333;
	text-align: center;
}

#contents .ranking .title h2 {
	position: relative;
	display: inline-block;
	font-size: 32px;
	line-height: 1;
}
#contents .ranking .title h2:before,
#contents .ranking .title h2:after {
	position: absolute;
	display: block;
	top: 0px;
	width: 100px;
	height: 40px;
	content: "";
}
#contents .ranking .title h2:before {
	left: -130px;
	background: url("/static/images/common/ranking_icon1.png") no-repeat center center;
}
#contents .ranking .title h2:after {
	right: -130px;
	background: url("/static/images/common/ranking_icon2.png") no-repeat center center;
}
#contents .ranking .list .item {
	position: relative;
	padding: 15px 12px;
	background: #fff;
	border: 3px solid #333;
	border-radius: 10px;
	overflow: visible;
}
#contents .ranking .list .item .no {
	position: absolute;
	top: -30px;
	left: 50%;
	width: 40px;
	height: 42px;
	font-weight: bold;
	line-height: 20px;
	color: #fff;
	margin-left: -20px;
	padding-top: 18px;
	background: url("/static/images/common/ranking_number_bg.png") no-repeat center center;
	text-align: center;
	z-index: 1;
}
#contents .ranking .list .item:nth-child(1) .no {
	background-image: url("/static/images/common/ranking_number1_bg.png");
}
#contents .ranking .list .item:nth-child(2) .no {
	background-image: url("/static/images/common/ranking_number2_bg.png");
}
#contents .ranking .list .item:nth-child(3) .no {
	background-image: url("/static/images/common/ranking_number3_bg.png");
}
#contents .ranking .list .item .rankingImg {
	position: relative;
	height: 170px;
	line-height: 170px;
	text-align: center;
	vertical-align: middle;
}
#contents .ranking .list .item .rankingImg a {
	display: inline-block;
	line-height: 1;
}
#contents .ranking .list .item.supported .rankingImg a:after {
	position: absolute;
	top: -5px;
	left: -5px;
	width: 30px;
	height: 30px;
	content: "";
	background: url("/static/images/common/supported_icon.png") no-repeat center center;
}
#contents .ranking .list .item .rankingImg img {
	max-width: 160px;
	max-height: 160px;
	border: 1px #808080 solid;
}
#contents .ranking .list .item .txt h2 {
	font-size: 16px;
	margin: 5px 0 0;
}
#contents .ranking .list .item .txt h2 a {
	color: #333;
}
#contents .ranking .list .item .txt h2 .limited {
	display: block;
	font-size: 12px;
	line-height: 2;
	color: #e6230f;
}

/* おすすめコンテンツ */
#contents .recommended {
	margin: 40px 0;
	overflow: hidden;
}
#contents .recommended h2 {
	position: relative;
	font-size: 20px;
	padding-left: 50px;
}
#contents .recommended h2:before {
	position: absolute;
	top: 4px;
	left: 0px;
	width: 40px;
	height: 40px;
	content: "";
	background: url("/static/images/common/icon_pancho.png") no-repeat top left;
	background-size: contain;
}
#contents .recommended .list .item {
	border: none;
}
#contents .recommended .list .item .recommendedImg {
	height: 200px;
	line-height: 200px;
	background-image: url("/static/images/common/bg_stripe.png");
	text-align: center;
	vertical-align: middle;
}
#contents .recommended .list .item .recommendedImg a {
	position: relative;
	display: inline-block;
	line-height: 1;
}
#contents .recommended .list .item.supported .recommendedImg a:after {
	position: absolute;
	top: -15px;
	left: -15px;
	width: 30px;
	height: 30px;
	content: "";
	background: url("/static/images/common/supported_icon.png") no-repeat center center;
}
#contents .recommended .list .item .recommendedImg img {
	position: relative;
	max-width: 170px;
	max-height: 170px;
	border: 1px #808080 solid;
}
#contents .recommended .list .item .txt h3 {
	font-size: 16px;
	margin: 5px 0 0;
}
#contents .recommended .list .item .txt h3 a {
	color: #333;
}
#contents .recommended .list .item .txt h3 .limited {
	display: block;
	font-size: 12px;
	line-height: 2;
	color: #e6230f;
}

/* 著者プロフィール・監修者 */
#contents .profile {
	margin: 40px 0;
	overflow: hidden;
}
#contents .profile .img img {
	width: 140px;
}
#contents .profile h2 {
	position: relative;
	font-size: 20px;
	line-height: 1.3;
}
#contents .profile h2 .label {
	display: block;
	font-size: 14px;
	margin: 0 0 10px;
}
#contents .profile h2 .kana {
	font-size: 14px;
}
#contents .profile p {
	margin: 15px 0 0;
}
#contents .profile ul {
	margin: 10px 0 0;
}
#contents .profile ul li {
	font-size: 14px;
}
#contents .profile ul li .label,
#contents .profile ul li .fab {
	margin-right: 10px;
}
#contents .profile ul li .label {
	font-weight: bold;
}

/* 一記事 */
#contents #article {
	margin: 30px 0;
}
#contents #article .alert {
	font-weight: bold;
	line-height: 1.2;
	margin: -15px 0 15px;
}
#contents #article .alert,
#contents #article .alert a {
	color: #e5220e;
}
#contents #article .alert a {
	text-decoration: underline;
}
#contents #article .articleTitle {
	position: relative;
	margin: 0 0 30px;
	padding: 0 0 20px;
	border-bottom: 3px solid #333;
}
#contents #article .articleTitle:after {
	position: absolute;
	top: -60px;
	right: -120px;
	width: 160px;
	height: 140px;
	content: "";
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain !important;
}
body.kotoba #contents #article .articleTitle:after {
	background-image: url("/static/images/common/article_title_kotoba.png");
}
body.kazu #contents #article .articleTitle:after {
	background-image: url("/static/images/common/article_title_kazu.png");
}
body.hyougen #contents #article .articleTitle:after {
	background-image: url("/static/images/common/article_title_hyougen.png");
}
body.karada #contents #article .articleTitle:after {
	background-image: url("/static/images/common/article_title_karada.png");
}
body.special #contents #article .articleTitle:after {
	background-image: url("/static/images/common/article_title_special.png");
}
/* 20191217追加 */
body.special_porepore #contents #article .articleTitle:after {
	background-image: url("/static/images/common/article_title_special_porepore.png");
}

#contents #article .articleTitle .supported {
	font-size: 13px;
	line-height: 28px;
	margin: 0 0 15px;
	padding-left: 40px;
}
#contents #article .articleTitle .supported .icon {
	position: absolute;
	left: 0px;
}
#contents #article .articleTitle .supported .txt {
	margin-right: 10px;
}
#contents #article .articleTitle .supported .asahiLogo {
	vertical-align: -3px;
}
#contents #article .articleTitle h1 {
	font-size: 32px;
	line-height: 1.3;
}
#contents #article .articleTitle h1 .fa-video {
	font-size: 16px;
	margin-left: 10px;
	vertical-align: 5px;
}
#contents #article .articleTitle .tag2 .group {
	margin-right: 10px;
}
#contents #article .articleTitleNav {
	margin-bottom: -5px;
	text-align: right;
}
#contents #article .articleTitleNav a {
	text-decoration: underline;
}
#contents #article .articleTitleNav li {
	position: relative;
	display: inline-block;
	line-height: 32px;
}
#contents #article .articleTitleNav li+li {
	margin-left: 15px;
}
#contents #article .articleTitleNav li.printHistory {
	padding-left: 25px;
	background: url("/static/images/common/icon_print.png") no-repeat left center;
	background-size: 21px 15px;
}
#contents #article .articleTitleNav li.favorite i {
	font-size: 32px;
	color: #e6230f;
	vertical-align: bottom;
	cursor: pointer;
}
#contents #article .articleTitleNav li.favorite .favoriteHelp {
	position: absolute;
	display: none;
	right: -20px;
	padding-top: 10px;
}
#contents #article .articleTitleNav li.favorite .favoriteHelp .box {
	font-size: 14px;
	line-height: 1.5;
	padding: 20px 15px;
	background: #fff;
	border: 1px solid #dbdbdb;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
	text-align: center;
}
#contents #article .articleTitleNav li.favorite .favoriteHelp p {
	white-space: nowrap;
}
#contents #article .articleTitleNav li.favorite .favoriteHelp p+p {
	margin-top: 15px;
}
#contents #article .slide {
	text-align: center;
}
#contents #article .slide .slick-slide {
	vertical-align: middle;
}
#contents #article .slide .slick-slide img {
	display: inline;
	max-width: 90%;
	max-height: 90%;
	border: 1px #808080 solid;
}
#contents #article .slide #mainSlide {
	position: relative;
	background-image: url("/static/images/common/bg_stripe.png");
}
#contents #article .slide #mainSlide .slick-prev,
#contents #article .slide #mainSlide .slick-next {
	position: absolute;
	top: 50%;
	width: 30px;
	height: 60px;
	font-size: 0;
	margin-top: -30px;
	background: rgba(102,102,102,0.60);
	border: none;
	outline: none;
	overflow: hidden;
	cursor: pointer;
	z-index: 10;
	transition: .3s;
}
#contents #article .slide #mainSlide .slick-prev:hover,
#contents #article .slide #mainSlide .slick-prev:focus,
#contents #article .slide #mainSlide .slick-next:hover,
#contents #article .slide #mainSlide .slick-next:focus {
	opacity: 0.5;
}
#contents #article .slide #mainSlide .slick-prev {
	left: 0px;
}
#contents #article .slide #mainSlide .slick-next {
	right: 0px;
}
#contents #article .slide #mainSlide .slick-prev:after,
#contents #article .slide #mainSlide .slick-next:after {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	font-family: "Font Awesome 5 Free";
	font-size: 20px;
	font-weight: 900;
	line-height: 60px;
	color: #fff;
	text-align: center;
}
#contents #article .slide #mainSlide .slick-prev:after {
	content: "\f053";
}
#contents #article .slide #mainSlide .slick-next:after {
	content: "\f054";
}
#contents #article .slide #sliderCaption {
	font-size: 14px;
	line-height: 1.3;
	margin: 10px 0 0;
	text-align: left;
}
#contents #article .slide #sliderCaption a {
	text-decoration: underline;
}
#contents #article .slide #sliderNav {
	margin: 20px 0;
}
#contents #article .slide #sliderNav .slick-slide {
	border: 3px solid #fff;
	cursor: pointer;
}
#contents #article .slide #sliderNav .slick-slide.slick-current {
	border-color: #e6230f;
	cursor: default;
}
#contents #article .slide #asobiShare {
	padding: 10px;
	background: #f3f3f3;
	text-align: center;
}
#contents #article .slide #asobiShare h2,
#contents #article .slide #asobiShare ul,
#contents #article .slide #asobiShare li {
	display: inline-block;
	line-height: 1;
	vertical-align: middle;
}
#contents #article .slide #asobiShare h2 {
	font-size: 14px;
}
#contents #article .slide #asobiShare li {
	font-size: 36px;
	margin-left: 10px;
}
#contents #article .slide #asobiShare li.facebook a {
	color: #4267b2;
}
#contents #article .slide #asobiShare li.twitter a {
	color: #1da1f2;
}
#contents #article .slide #asobiShare li.line a {
	color: #00b900;
}
#contents #article .articleBody h2 {
	margin: 0 0 15px;
}
#contents #article .articleBody h2 .fas {
	margin-right: 10px;
}
#contents #article .articleBody p.body a span {
	text-decoration: underline;
}
#contents #article .articleBody p.body+p.body {
	margin-top: 15px;
}
#contents #article .articleBody p.body+p.meta {
	margin-top: 15px;
}
#contents #article .articleBody .reserve {
	margin: 20px 0 0;
	padding: 15px 0 0;
	border-top: 2px dotted #ddd;
}
#contents #article .articleBody .reserve h2 {
	margin: 0 0 5px;
}
#contents #article .articleBody .reserve ul {
	overflow: hidden;
}
#contents #article .articleBody .reserve ul li {
	position: relative;
	float: left;
	min-width: 50%;
	font-size: 14px;
	line-height: 24px;
	padding-left: 15px;
}
#contents #article .articleBody .reserve ul li:before {
	position: absolute;
	left: 2px;
	font-size: 6px;
	content: "●";
}
#contents #article .articleBody .btn {
	line-height: 1.2;
	margin: 20px 0 0;
	padding: 20px 0 0;
	border-top: 2px dotted #ddd;
	text-align: center;
}
#contents #article .articleBody .btn h2 {
	text-align: left;
}
#contents #article .articleBody .btn p+p {
	margin-top: 15px;
}
#contents #article .articleBody .btn ul {
	margin-right: -20px;
	overflow: hidden;
}
#contents #article .articleBody .btn ul li {
	float: left;
	width: 50%;
	padding-right: 20px;
}
#contents #article .articleBody .btn .redBtn,
#contents #article .articleBody .btn .redLineBtn {
	display: block;
	font-size: 18px;
	font-weight: bold;
	line-height: 30px;
	padding: 10px 0;
	background: #fff;
	border: 3px solid #fff;
	border-radius: 30px;
}
#contents #article .articleBody .btn .redBtn {
	color: #fff;
	background: #e6230f;
	border-color: #e6230f;
}
#contents #article .articleBody .btn .redLineBtn {
	color: #e6230f;
	border-color: #e6230f;
}
#contents #article .articleBody .btn .redBtn.disabled {
	background: #c8c8c8;
	border-color: #c8c8c8;
}
#contents #article .articleBody .btn .redLineBtn.disabled {
	color: #c8c8c8;
	border-color: #c8c8c8;
}
#contents #article .articleBody .btn .pdf:before {
	font-family: "Font Awesome 5 Free";
	font-size: 20px;
	font-weight: 400;
	content: "\f1c1";
	margin-right: 10px;
	vertical-align: -1px;
}
#contents #article .articleBody .homeLink {
	font-size: 14px;
	margin: 15px 0 0;
}
#contents #article .articleBody .homeLink a {
	text-decoration: underline;
}
#contents #article .articleBody .adobeReader {
	font-size: 14px;
	margin: 15px 0 0;
}
#contents #article .articleBody .adobeReader a {
	text-decoration: underline;
}
#contents #article .articleBody .adobeReader .txt2 {
	font-size: 11px;
}
#contents #article .articleBody .guide {
	margin: 20px 0 0;
}
#contents #article .articleBody .guide ul {
	margin-right: -2px;
	overflow: hidden;
}
#contents #article .articleBody .guide ul li {
	float: left;
	width: 50%;
	padding-right: 2px;
}
#contents #article .articleBody .guide ul li a {
	display: block;
	font-size: 14px;
	line-height: 40px;
	color: #333;
	background: #f3f3f3;
	text-align: center;
}
#contents #article .articleBody .guide ul li a:before {
	display: inline-block;
	width: 20px;
	height: 20px;
	content: "";
	margin-right: 5px;
	vertical-align: middle;
}
#contents #article .articleBody .guide ul li a.introduction:before {
	background: url("/static/images/common/icon_introduction.png") no-repeat center center;
}
#contents #article .articleBody .guide ul li a.userguide:before {
	background: url("/static/images/common/icon_userguide.png") no-repeat center center;
}
#contents #article .articleBody .link {
	margin: 20px 0 0;
}
#contents #article .articleBody .link li {
	margin: 10px 0 0;
}
#contents #article .articleBody .link li .far {
	margin-right: 10px;
}
#contents #article .articleBody .link li a {
	text-decoration: underline;
}
#contents #article .articleBody .sns {
	margin: 20px 0 0;
}
#contents #article .articleBody .warning {
	font-size: 12px;
	margin: 10px 0 0;
}
#contents #article .articleFooter {
	margin: 15px 0 0;
	padding: 10px 0 0;
	border-top: 2px dotted #ddd;
}
#contents #article .articleFooter .txt {
	font-weight: bold;
}
#contents #article .articleFooter a {
	margin-bottom: 5px;
}

/* フォーム */
#contents #asobiForm .stepBar {
	display: table;
	width: 100%;
	margin: 10px 0 30px;
}
#contents #asobiForm .stepBar li {
	position: relative;
	display: table-cell;
	width: 20%;
	font-size: 14px;
	line-height: 40px;
	padding: 0 5px;
	background-color: #eee;
	text-align: center;
	vertical-align: middle;
	white-space: nowrap;
}
#contents #asobiForm .stepBar li:before,
#contents #asobiForm .stepBar li:after {
	position: absolute;
	left: -5px;
	display: block;
	width: 10px;
	height: 20px;
	content: '';
	background-color: #eee;
	border-left: 4px solid #fff;
}
#contents #asobiForm .stepBar li:after {
	top: 0;
	-moz-transform: skew(30deg);
	-ms-transform: skew(30deg);
	-webkit-transform: skew(30deg);
	transform: skew(30deg);
}
#contents #asobiForm .stepBar li:before {
	bottom: 0;
	-moz-transform: skew(-30deg);
	-ms-transform: skew(-30deg);
	-webkit-transform: skew(-30deg);
	transform: skew(-30deg);
}
#contents #asobiForm .stepBar li:first-child {
	-moz-border-radius-topleft: 4px;
	-webkit-border-top-left-radius: 4px;
	border-top-left-radius: 4px;
	-moz-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
	border-bottom-left-radius: 4px;
}
#contents #asobiForm .stepBar li:first-child:before,
#contents #asobiForm .stepBar li:first-child:after {
	content: none;
}
#contents #asobiForm .stepBar li:last-child {
	-moz-border-radius-topright: 4px;
	-webkit-border-top-right-radius: 4px;
	border-top-right-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-webkit-border-bottom-right-radius: 4px;
	border-bottom-right-radius: 4px;
}
#contents #asobiForm .stepBar li.current {
	color: #fff;
	background-color: #4a6db3;
}
#contents #asobiForm .stepBar li.current:before,
#contents #asobiForm .stepBar li.current:after {
	background-color: #4a6db3;
}
#contents #asobiForm .form .banner {
	margin: 0 0 30px;
}
#contents #asobiForm .form .formHead {
	padding: 0 0 5px;
	border-bottom: 3px solid #333;
}
#contents #asobiForm .form .formHead h2,
#contents #asobiForm .form .formHead p {
	margin: 0 0 10px;
}
#contents #asobiForm .form .formHead h2 {
	position: relative;
	font-size: 20px;
	line-height: 1.3;
	padding: 1px 0 1px 50px;
}
#contents #asobiForm .form .formHead h2:before {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 40px;
	height: 40px;
	content: "";
	background: url("/static/images/common/icon_pancho.png") no-repeat top left;
	background-size: contain;
}
#contents #asobiForm .form .formHead h2 small {
	font-size: 16px;
	font-weight: normal;
	margin-left: 15px;
}
#contents #asobiForm .form .formHead p.indent {
	padding-left: 50px;
}
#contents #asobiForm .form .entryBody+.formHead {
	margin-top: 40px;
}
#contents #asobiForm .form .requiredMark,
#contents #asobiForm .form .freeMark {
	display: inline-block;
	font-size: 14px;
	line-height: 24px;
	color: #fff;
	padding: 0 5px;
	background: #ea5f67;
	border-radius: 3px;
}
#contents #asobiForm .form .freeMark {
	background: #4d6db3;
}
#contents #asobiForm .form .alert {
	font-weight: bold;
	line-height: 1.3;
	color: #e62311;
	margin: 30px 0;
	text-align: center;
}
#contents #asobiForm .form table {
	width: 100%;
	margin: 30px 0;
}
#contents #asobiForm .form th {
	position: relative;
	width: 300px;
	font-weight: bold;
	line-height: 1.3;
	padding-right: 80px;
	text-align: left;
	vertical-align: top;
	white-space: nowrap;
}
#contents #asobiForm .form th p {
	margin: 6px 0;
}
#contents #asobiForm .form td {
	position: relative;
	padding: 0 0 30px;
}
#contents #asobiForm .form table.confirm td {
	padding: 5px 0 20px;
}
#contents #asobiForm .form dl {
	margin: 30px 0;
}
#contents #asobiForm .form dt {
	font-weight: bold;
}
#contents #asobiForm .form dd {
	position: relative;
	padding: 5px 0 0;
}
#contents #asobiForm .form .input.bb {
	border-bottom: 2px dotted #ddd;
}
#contents #asobiForm .form .errorTxt {
	color: #c00;
}
#contents #asobiForm .form .hint {
	display: none;
	font-size: 14px;
	color: #999;
}
#contents #asobiForm .form .subBtn {
	margin-left: 5px;
	padding: 5px 10px;
	background: #e4e4e4;
	border: 2px solid #ccc;
	border-radius: 5px;
	vertical-align: middle;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
#contents #asobiForm .form .passwordCtrl {
	color: #1f2e55;
	margin: 5px 0 0;
}
#contents #asobiForm .form .passwordCtrl input {
	margin-right: 5px;
}
#contents #asobiForm .form .numchildren,
#contents #asobiForm .form .zip1,
#contents #asobiForm .form .zip2,
#contents #asobiForm .form .name,
#contents #asobiForm .form .name .label {
	position: relative;
	display: inline-block;
}
#contents #asobiForm .form .numchildren,
#contents #asobiForm .form .zip1 {
	width: 70px;
}
#contents #asobiForm .form .zip2 {
	width: 110px;
}
#contents #asobiForm .form .name {
	padding-left: 3em;
}
#contents #asobiForm .form .name .label {
	position: absolute;
	top: 4px;
	left: 0px;
}
#contents #asobiForm .form .terms {
	margin: 50px 0 0;
	padding: 10px;
	border: 2px solid #ccc;
}
#contents #asobiForm .form .terms .box {
	height: 220px;
	overflow: auto;
}
#contents #asobiForm .form .terms h2 {
	font-size: 112.5%;
	padding: 15px 0 0;
	text-align: center;
}
#contents #asobiForm .form .terms .content {
	font-size: 87.5%;
	line-height: 1.7;
	padding: 20px;
}
#contents #asobiForm .form .terms .content p {
	margin: 0 0 15px;
}
#contents #asobiForm .form .terms .content strong {
	font-size: 114.3%;
}
#contents #asobiForm .form .campaignCode {
	margin-top: -30px;
	padding-top: 30px;
	border-top: 2px dotted #ddd;
}
#contents #asobiForm .form .campaignCode table.input {
	margin: 0;
}
#contents #asobiForm .form .inputImageAuth {
	padding: 30px 0 0;
	border-top: 2px dotted #ddd;
	text-align: center;
}
#contents #asobiForm .form .inputImageAuth .captchaImage {
	margin: 10px 0;
}
#contents #asobiForm .form .inputImageAuth input {
	max-width: 500px;
}
#contents #asobiForm .form .agreementCtrl {
	margin: 10px 0;
}
#contents #asobiForm .form .agreementCtrl p {
	position: relative;
	margin: 0;
	padding-left: 50px;
}
#contents #asobiForm .form .agreementCtrl p .requiredMark {
	position: absolute;
	top: 50%;
	left: 0px;
	margin-top: -12px;
}
#contents #asobiForm .form .btn {
	margin: 30px 0;
	text-align: center;
}
#contents #asobiForm .form .btn .txt {
	display: inline-block;
	font-size: 14px;
	margin: 0 0 5px;
}
#contents #asobiForm .formFootLink a span {
	text-decoration: underline;
}
#contents #asobiForm #login .registLink {
	margin: 30px 0 0;
}
#contents #asobiForm #login .registLink .formHead h2 {
	padding-left: 35px;
}
#contents #asobiForm #login .registLink .formHead h2:before {
	background-image: url("/static/images/common/icon_introduction_l.png");
	background-size: auto;
}
#contents #asobiForm #login .registLink .submitBtn {
	background: #e62311;
	border-color: #cc1d08;
}
#contents #asobiForm #error .box {
	margin: 0 0 30px;
	padding: 0 0 30px;
	border-bottom: 2px dotted #ddd;
	text-align: center;
}
#contents #asobiForm #error .box h2 {
	font-size: 20px;
	line-height: 1.3;
	margin: 0;
}
#contents #asobiForm #error .box p {
	margin: 20px 0 0;
}
#contents #asobiForm #error .box p a {
	text-decoration: underline;
}

#contents #asobiForm .form table.favlist th.del:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 400;
	content: "\f004";
	margin-right: 5px;
}
#contents #asobiForm .form table.favlist th.date {
	padding-left: 25px;
	background: url("/static/images/common/icon_print.png") no-repeat left center;
	background-size: 21px 15px;
}
#contents #asobiForm .form table.favlist td.del span {
	display: inline-block;
	font-size: 14px;
	line-height: 32px;
	padding: 0 10px;
	background: #e3e3e3;
	border-radius: 5px;
	cursor: pointer;
	transition: .3s;
}
#contents #asobiForm .form table.favlist td.del span:hover {
	opacity: 0.5;
}
#contents #asobiForm .form table.favlist td.date ul {
	position: relative;
	display: inline-block;
	padding-right: 30px;
}
#contents #asobiForm .form table.favlist td.date ul:after {
	position: absolute;
	top: 2px;
	right: 0px;
	font-family: "Font Awesome 5 Free";
	font-size: 16px;
	font-weight: 900;
	color: #c6c6c6;
}
#contents #asobiForm .form table.favlist td.date ul.close {
	height: 32px;
	overflow: hidden;
}
#contents #asobiForm .form table.favlist td.date ul.close,
#contents #asobiForm .form table.favlist td.date ul.open {
	cursor: pointer;
}
#contents #asobiForm .form table.favlist td.date ul.close:after {
	content: "\f067";
}
#contents #asobiForm .form table.favlist td.date ul.open:after {
	content: "\f068";
}


/* ----------------------------------------------
   Media Queries
------------------------------------------------ */
@media (min-width: 768px) {

	/* レイアウト */
	a {
		transition: .3s;
	}
	a:hover {
		opacity: 0.5;
	}

	/* ヘッダー */
	#header {
		min-width: 1000px;
	}
	#header .catchcopy {
		text-align: center;
	}
	#header .catchcopy p {
		width: 1000px;
		margin: 0 auto;
		text-align: left;
	}
	#header .wrap {
		position: relative;
		height: 150px;
	}
	#gNav {
		display: block !important;
	}
	#gNav a {
		position: relative;
		display: block;
		color: #333;
	}
	#gNav #headerSearch {
		position: absolute;
		right: 0px;
		bottom: 20px;
		width: 340px;
	}
	#gNav #headerSearch #keywordSearch input[type="text"] {
		font-size: 14px;
	}
	#gNav #headerSearch #searchOption {
		position: absolute;
		right: 0px;
		width: 1000px;
		margin-top: 10px;
		padding: 20px;
		z-index: 100;
	}
	#searchOption .options p {
		float: left;
		width: 160px;
		margin: 5px 0 0;
	}
	#searchOption .options ul {
		margin: 0 0 15px;
	}
	#searchOption .options ul ul {
		margin: 0;
	}
	#gNav .main {
		position: absolute;
		display: table;
		left: 0px;
		bottom: 20px;
		width: 648px;
		height: 34px;
		border-left: 2px dotted #ddd;
	}
	#gNav .main li {
		position: relative;
		display: table-cell;
		width: 20%;
		font-size: 15px;
		font-weight: bold;
		padding: 0 10px;
		border-right: 2px dotted #ddd;
		text-align: center;
		vertical-align: middle;
		white-space: nowrap;
	}
	#gNav .main li:after {
		position: absolute;
		display: block;
		top: 50px;
		left: 0;
		width: 100%;
		height: 4px;
		content: "";
	}
	#gNav .main li.kotoba:hover:after,
	body.kotoba #gNav .main li.kotoba:after {
		background-color: #81c0e9;
	}
	#gNav .main li.kazu:hover:after,
	body.kazu #gNav .main li.kazu:after {
		background-color: #6fbf50;
	}
	#gNav .main li.hyougen:hover:after,
	body.hyougen #gNav .main li.hyougen:after {
		background-color: #e6230f;
	}
	#gNav .main li.karada:hover:after,
	body.karada #gNav .main li.karada:after {
		background-color: #b964a5;
	}
	#gNav .main li.special:hover:after,
	body.special #gNav .main li.special:after {
		background-color: #333;
	}
	#gNav .sub {
		position: absolute;
		top: 38px;
		right: 0px;
	}
	#gNav .sub ul {
		float: left;
		overflow: hidden;
	}
	#gNav .sub ul.link li {
		float: left;
		font-size: 13px;
		line-height: 24px;
		padding-left: 10px;
		vertical-align: middle;
	}
	#gNav .sub ul.link li .fas {
		margin-right: 3px;
	}
	#gNav .sub ul.link li.login a,
	#gNav .sub ul.link li.logout a {
		font-weight: bold;
		color: #e6230f;
	}
	#gNav .sub ul.link li.registration a,
	#gNav .sub ul.link li.mypage a {
		font-size: 12px;
		color: #fff;
		//padding: 0 12px;
		padding: 0 6px;
		background: #e6230f;
		border-radius: 20px;
	}
	#gNav .sub ul.sns li {
		float: left;
		font-size: 18px;
		line-height: 24px;
		padding-left: 12px;
	}
	body.scrollNavi #header {
		position: fixed;
		top: -64px;
	}
	body.scrollNavi #header.simple {
		position: absolute;
	}
	body.scrollNavi #contents {
	}

	/* 20200221ヘッダー更新 */
	#contents {
    padding-top: 180px;
  }

  #header .wrap {
    height: 180px;
  }

  #gNav .main {
    bottom: 0px;
    height: 50px;
    width: 1000px;
  }

  #gNav .main .spacOpen {
    display: none;
  }

  #gNav .main a:hover {
    opacity: 1;
  }

  #gNav .main .fa-chevron-down {
    font-size: 8px;
    padding-left: 8px;
  }

  #gNav .main .fa-chevron-up {
    font-size: 8px;
    padding-left: 8px;
  }

  #gNav .main>li {
    position: relative;
    width: 180px;
    font-size: 14px;
    padding: 0;
    cursor: pointer;
  }

  #gNav .main>li>div {
    display: table;
    width: 100%;
    height: 100%;
  }

  #gNav .main>li>a {
    height: 100%;
    width: 100%;
    line-height: 50px;
  }

  #gNav .main>li>div>a {
	display: table-cell;
	vertical-align: middle;
  }

  #gNav .main li .submenu {
    position: absolute;
    top: 50px;
    left: 0;
    display: none;
    background-color: #fff;
	box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.5);
  }

  #gNav .main li .submenu.active {
    display: block;
  }

  #gNav .main li .submenu li {
	display: block;
	width: auto;
	padding: 0;
    text-align: left;
    border: none;
  }

  #gNav .main li .submenu li a {
	display: block;
	padding: 15px 40px;
  }

  #gNav .main li .submenu li a:hover {
    background-color: #e3e3e3;
  }

  #gNav .main li:after {
    top: 0px;
  }

  #gNav #headerSearch {
    bottom: 60px;
  }

  #gNav .main li.column:hover:after {
    background-color: #666;
  }

  #gNav .main li.supporter:hover:after {
    background-color: #ffe300;
  }

  #gNav .main li.supporter img {
    width: 16px;
    padding-right: 2px;
    padding-bottom: 1px
  }

	/* フッター */
	#footer #spFooter {
		display: none;
	}
	#footer #pcFooter {
		font-size: 14px;
		padding: 50px 0;
		border-top: 3px solid #333;
	}
	#footer #pcFooter .cols {
		display: table;
		width: 100%;
	}
	#footer #pcFooter .col {
		display: table-cell;
		width: 25%;
		vertical-align: top;
	}
	#footer #pcFooter .col.logo p {
		width: 160px;
		text-align: center;
	}
	#footer #pcFooter .col.logo p.asahiLogo {
		margin-top: 30px;
	}
	#footer #pcFooter .col p.head {
		font-weight: bold;
		margin: 0 0 15px;
	}
	#footer #pcFooter .col ul li {
		margin: 5px 0 0;
	}
	#footer #pcFooter .col ul+p.head {
		margin-top: 20px;
	}
	#footer #pcFooter .col.link a:before {
		display: inline-block;
		font-family: "Font Awesome 5 Free";
		font-size: 8px;
		font-weight: 900;
		content: "\f054";
		margin-right: 5px;
		vertical-align: 2px;
	}

	/* 記事一覧 */
	#contents .genreTitle {
		position: relative;
		margin: 50px 0 -50px;
		padding: 0 60px;
		z-index: 1;
	}
	#contents .alertbox .alert {
		margin: 15px 0 10px;
	}

	#contents .genreTitle:before {
		position: absolute;
		width: 160px;
		height: 160px;
		margin: -10px 0 0;
		content: "";
		z-index: 2;
	}
	#contents .genreTitle .box {
		position: relative;
		margin-left: 190px;
		padding: 20px 0;
		background: #fff;
		border: 3px solid #333;
		border-radius: 10px;
	}
	#contents .genreTitle .box:before {
		position: absolute;
		top: 50%;
		left: -22px;
		width: 0;
		height: 0;
		content: "";
		margin-top: -12px;
		border-style: solid;
		border-width: 12px 22px 12px 0;
		border-color: transparent #333 transparent transparent;
	}
	#contents .genreTitle .box:after {
		position: absolute;
		top: 50%;
		left: -16px;
		width: 0;
		height: 0;
		content: "";
		margin-top: -8px;
		border-style: solid;
		border-width: 8px 16px 8px 0;
		border-color: transparent #fff transparent transparent;
	}
	body.kotoba #contents .genreTitle:before {
		background: url("/static/images/common/title_kotoba.png") no-repeat center center;
		background-size: contain;
	}
	body.kazu #contents .genreTitle:before {
		background: url("/static/images/common/title_kazu.png") no-repeat center center;
		background-size: contain;
	}
	body.hyougen #contents .genreTitle:before {
		background: url("/static/images/common/title_hyougen.png") no-repeat center center;
		background-size: contain;
	}
	body.karada #contents .genreTitle:before {
		background: url("/static/images/common/title_karada.png") no-repeat center center;
		background-size: contain;
	}
	body.special #contents .genreTitle:before {
		background: url("/static/images/common/title_special.png") no-repeat center center;
		background-size: contain;
	}
	/* 20191217追加 */
	body.special_porepore #contents .genreTitle:before {
		background: url("/static/images/common/title_special_porepore.png") no-repeat center center;
		background-size: contain;
	}

	body.kotoba #contents .genreTitle .box {
		background: #dbedf9;
	}
	body.kazu #contents .genreTitle .box {
		background: #e6f4df;
	}
	body.hyougen #contents .genreTitle .box {
		background: #fddcd7;
	}
	body.karada #contents .genreTitle .box {
		background: #f0e3ed;
	}
	body.special #contents .genreTitle .box {
		background: #FFD700;
	}
	/* 20191217追加 */
	body.special_porepore #contents .genreTitle .box {
		background: #C1DB81;
	}
	body.kotoba #contents .genreTitle .box:after {
		border-right-color: #dbedf9;
	}
	body.kazu #contents .genreTitle .box:after {
		border-right-color: #e6f4df;
	}
	body.hyougen #contents .genreTitle .box:after {
		border-right-color: #fddcd7;
	}
	body.karada #contents .genreTitle .box:after {
		border-right-color: #f0e3ed;
	}
	body.special #contents .genreTitle .box:after {
		border-right-color: #FFD700;
	}
	/* 20191217追加 */
	body.special_porepore #contents .genreTitle .box:after {
		border-right-color: #C1DB81;
	}

	#contents .genreTitle .box h1,
	#contents .genreTitle .box p {
		display: table-cell;
		height: 90px;
		vertical-align: middle;
	}
	#contents .genreTitle .box h1 {
		width: 220px;
		font-size: 32px;
		line-height: 1.2;
		text-align: center;
		white-space: nowrap;
	}
	#contents .genreTitle .box p {
		font-size: 15px;
		padding: 0 25px;
		border-left: 2px dotted #333;
	}

	/* 20191212追加 */
	#contents .banner_asodoro {
		margin: 40px 0 0;
	}
	#contents .banner_asodoro img {
		width: 100%;
	}

	/* 記事一覧 */
	#contents #searchNavBtn {
		position: absolute;
		top: 5px;
		right: 0px;
	}
	body.kotoba #contents .list .nav,
	body.kazu #contents .list .nav,
	body.hyougen #contents .list .nav,
	body.karada #contents .list .nav,
	body.special #contents .list .nav,
	body.special_porepore #contents .list .nav {
		padding-top: 50px;
	}

	/* ランキング */
	#contents .ranking .list {
		margin-right: -12px;
		overflow: hidden;
	}
	#contents .ranking .list .item {
		float: left;
		width: 190px;
		margin: 50px 12px 0 0;
	}

	/* おすすめコンテンツ */
	#contents .recommended .list {
		margin: 30px -25px 0 0;
		overflow: hidden;
	}
	#contents .recommended .list .item {
		float: left;
		width: 25%;
		padding: 0 25px 0 0;
	}

	/* 著者プロフィール・監修者 */
	#contents .profile .pageBox {
		overflow: hidden;
	}
	#contents .profile .img {
		float: left;
		width: 200px;
	}
	#contents .profile .txt {
		overflow: hidden;
	}

	/* 一記事 */
	#contents #article .articleMain {
		overflow: hidden;
	}
	#contents #article .articleTitleNav li.favorite:hover .favoriteHelp {
		display: block;
	}
	#contents #article .articleMain .slide {
		float: left;
		width: 420px;
	}
	#contents #article .articleMain .articleBody {
		float: right;
		width: 420px;
	}
	#contents #article .articleFooter .tag1 {
		float: left;
		margin-right: 20px;
	}


	/* バナー */
	#contents #article .banner {
		margin: 40px 0 0;
	}
	#contents #article .banner img {
		width: 100%;
	}

	#contents #article .homeBanner {
		padding: 60px 0;
	}
	#contents #article .homeBanner img {
		width: 100%;
	}
	#contents #article .homeBanner ul {
		margin-right: -60px;
		overflow: hidden;
	}
	#contents #article .homeBanner ul li {
		float: left;
		width: 50%;
		padding-right: 60px;
	}


	/* フォーム */
	#header.simple .wrap {
		height: 130px;
	}
	body.form #contents {
		padding-top: 100px;
	}
	#contents #asobiForm .form th .requiredMark,
	#contents #asobiForm .form th .freeMark {
		position: absolute;
		top: 6px;
		right: 25px;
	}
	#contents #asobiForm .form .id,
	#contents #asobiForm .form .password,
	#contents #asobiForm .form .email,
	#contents #asobiForm .form .tel {
		position: relative;
		display: inline-block;
	}
	#contents #asobiForm .form .id,
	#contents #asobiForm .form .password {
		width: 50%;
	}
	#contents #asobiForm .form .email,
	#contents #asobiForm .form .tel {
		width: 60%;
	}
	#contents #asobiForm .form .name {
		width: 40%;
		margin-right: 5%;
	}
	#contents #asobiForm .form .btn ul {
		display: table;
		margin: 0 auto;
	}
	#contents #asobiForm .form .btn li {
		display: table-cell;
		vertical-align: bottom;
	}

	#contents #asobiForm.login {
		margin: 0 220px;
	}

	#contents #asobiForm .form table.favlist {
		margin: 0 0 30px;
	}
	#contents #asobiForm .form table.favlist th {
		width: auto;
		line-height: 32px;
		padding: 15px 0;
		border-bottom: 2px dotted #ddd;
	}
	#contents #asobiForm .form table.favlist th.title {
		width: 580px;
	}
	#contents #asobiForm .form table.favlist td {
		line-height: 32px;
		padding: 15px 0;
		border-bottom: 2px dotted #ddd;
		vertical-align: top;
	}
	#contents #asobiForm .form table.favlist td.title {
		font-weight: bold;
	}

	/* キッズサポーター掲載エリア */
	#footer #supporter-area {
		padding: 60px 0;
		border-top: 3px solid #333;
	}
	#footer #supporter-area h2 {
		margin: 0 0 20px;
		font-size: 32px;
		font-weight: bold;
		text-align: center;
	}
	#footer #supporter-area .lead {
		margin: 0 0 40px;
	}
	#footer #supporter-area h3 {
		margin: 0 0 20px;
		font-size: 24px;
		font-weight: bold;
		text-align: center;
	}
	#footer #supporter-area .collaboration-list {
		margin: 0 0 40px;
		text-align: center;
	}
	#footer #supporter-area .collaboration-list ul {
		display: inline-flex;
		flex-wrap: wrap;
		margin: -30px -15px 0;
	}
	#footer #supporter-area .collaboration-list li {
		width: 342px;
		padding: 30px 15px 0;
	}
	#footer #supporter-area .collaboration-list li a {
		display: flex;
		flex-direction: column;
		height: 100%;
		border: 3px solid #DDDDDD;
		border-radius: 10px;
		overflow: hidden;
	}
	#footer #supporter-area .collaboration-list li .image {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 153px;
	}
	#footer #supporter-area .collaboration-list li .image span {
		width: 200px;
	}
	#footer #supporter-area .collaboration-list li .image img {
		max-width: 100%;
	}
	#footer #supporter-area .collaboration-list li .title {
		position: relative;
		display: flex;
		align-items: center;
		flex: auto;
		padding: 20px 50px 20px 30px;
		color: #666666;
		background: #DDDDDD;
		text-align: left;
	}
	#footer #supporter-area .collaboration-list li .title::after {
		content: "\f105";
		position: absolute;
		top: 50%;
		right: 30px;
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		transform: translateY(-50%);
	}
	#footer #supporter-area .support-list {
		text-align: center;
	}
	#footer #supporter-area .support-list ul {
		display: inline-flex;
		flex-wrap: wrap;
	}
	#footer #supporter-area .support-list li {
		width: 166px;
		min-height: 100px;
		border-right-width: 3px;
		border-bottom-width: 3px;
		border-style: solid;
		border-color: #DDDDDD;
	}
	#footer #supporter-area .support-list li a {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
		overflow: hidden;
	}
	#footer #supporter-area .support-list li span {
		width: 110px;
	}
	#footer #supporter-area .support-list li:nth-child(-n+6) {
		border-top-width: 3px;
	}
	#footer #supporter-area .support-list li:nth-child(6n+1) {
		border-left-width: 3px;
	}
	#footer #supporter-area .support-list li:first-child {
		border-top-left-radius: 10px;
	}
	#footer #supporter-area .support-list li:nth-child(6n):nth-child(-n+6),
	#footer #supporter-area .support-list li:nth-child(-n+5):last-child {
		border-top-right-radius: 10px;
	}
	#footer #supporter-area .support-list li:nth-child(6n+1):nth-last-child(-n+6) {
		border-bottom-left-radius: 10px;
	}
	#footer #supporter-area .support-list li:nth-child(6n):nth-last-child(-n+6),
	#footer #supporter-area .support-list li:last-child {
		border-bottom-right-radius: 10px;
	}
}


#project-capture {
	background: #F6F6F6;
	padding: 30px 0;
	border-radius: 10px;
	margin-bottom: 60px;
}

#project-capture .capture-lead {
	text-align: center;
	margin-bottom: 20px;
}

#project-capture .capture-item {
	display: flex;
	justify-content: center;
	align-items: center;
}

#project-capture .capture-image {
	width: 65px;
	padding-left: 3px;
}

@media (max-width: 767px) {

	/* レイアウト */
	*:hover {
		opacity: 1 !important;
	}
	body {
		min-width: inherit;
	}
	.wrap {
		width: auto;
	}
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	.backBtn,
	.submitBtn {
		display: block;
		min-width: inherit;
		width: 100%;
		height: auto;
		font-size: 16px;
		margin: 15px 0;
		padding: 15px 0;
		white-space: normal;
	}
	.form .selectBox {
		width: 100% !important;
	}

	/* モーダルウィンドウ */
	.modalBody {
		position: fixed;
		top: 60px;
		left: inherit;
		width: auto;
		height: 80%;
		margin: 0 15px;
		padding: 0;
	}
	.modalBody #modalContent {
		height: 100%;
		padding: 30px  20px 0;
		overflow: auto;
	}
	.modalBody #searchOption .btn {
		padding: 10px 0 30px;
	}

	.fav_modal .main {
		width: 320px;
		height: auto;
		margin: -160px 0 0 -160px;
		padding: 25px 0;
	}
	.fav_modal p {
		margin: 15px 0 0;
	}
	.fav_modal .btn a {
		display: inline-block;
		padding: 5px 20px;
	}

	/* ヘッダー */
	#header {
		position: fixed;
		min-width: 300px;
		height: auto;
		padding: 22px 0 0;
	}
	#header .catchcopy {
		line-height: 22px;
		padding: 0 15px;
		text-align: left;
		font-size: 10px;
	}
	#header .headerWrap {
		position: relative;
		height: 55px;
		background: #fff;
		overflow: hidden;
	}
	#header .logo {
		top: 0px;
		left: -32px;
		/* padding: 0 0 0 15px !important; */
	}
	#header .logo a {
		width: 250px;
		height: 55px;
		background-size: contain;
	}
	#header .header-conversion {
		bottom: 14px;
		right: 50px;
	}
	#header .header-conversion a {
		padding: 4px 6px;
		font-size: 13px;
	}
	#header #headerNavToggleBtn {
		position: absolute;
		top: 2px;
		right: 0px;
		width: 50px;
		height: 50px;
		text-align: center;
		cursor: pointer;
	}
	#header #headerNavToggleBtn p {
		position: relative;
		width: 24px;
		height: 19px;
		margin: 16px auto 0;
	}
	#header #headerNavToggleBtn span {
		position: absolute;
		display: inline-block;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #e62210;
		border-radius: 3px;
		transition: all .4s;
	}
	#header #headerNavToggleBtn span:nth-child(1) {
		top: 0px;
	}
	#header #headerNavToggleBtn span:nth-child(2) {
		top: 8px;
	}
	#header #headerNavToggleBtn span:nth-child(3) {
		top: 16px;
	}
	#header #headerNavToggleBtn.active span:nth-of-type(1) {
		top: 8px;
		-webkit-transform: rotate(315deg);
		-moz-transform: rotate(315deg);
		transform: rotate(315deg);
	}
	#header #headerNavToggleBtn.active span:nth-of-type(2) {
		display: none;
	}
	#header #headerNavToggleBtn.active span:nth-of-type(3) {
		top: 8px;
		-webkit-transform: rotate(-315deg);
		-moz-transform: rotate(-315deg);
		transform: rotate(-315deg);
	}
	#gNav {
		display: none;
		position: fixed;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		padding: 72px 0 0;
		text-align: left;
		z-index: -1;
	}
	#gNav a {
		position: relative;
		display: inline-block;
		color: #333;
	}
	#gNav .gNavWrap {
		max-height: 100%;
		background: #fff;
		box-shadow: 0px 0px 7px rgba(0,0,0,0.7);
		overflow: auto;
	}
	#gNav .nav {
		position: relative;
		z-index: 100;
	}
	#gNav #headerSearch #keywordSearch {
		margin: 15px;
	}
	#searchOption .options p {
		margin: 15px 0 5px;
	}
	#gNav ul.main {
		float: none;
		display: block;
		height: auto;
		margin: 0;
		background: #f2f2f2;
		border-top: 1px solid #e3e3e3;
	}
	#gNav ul.main li {
		float: none;
		display: block;
		font-size: 16px;
		line-height: 48px !important;
		padding: 0;
		border-bottom: 1px solid #e3e3e3;
		text-align: left;
	}
	#gNav ul.main li a {
		position: relative;
		display: block;
		height: auto;
		color: #333 !important;
		padding: 0 15px;
	}
	#gNav ul.main li a:before {
		display: none !important;
	}
	#gNav ul.main li a:after {
		position: absolute;
		right: 0px;
		width: 50px;
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		color: #e62210;
		content: "\f054";
		margin: 0;
		text-align: center;
	}
	#gNav ul.main li.subNav > a:after {
		content: "\f067";
	}
	#gNav ul.main li.subNav > a.open:after {
		content: "\f068";
	}
	#gNav ul.main li ul {
		position: relative;
		left: inherit;
		margin: 0;
		padding: 0;
		background: #19416d;
		border: none;
	}
	#gNav ul.main li ul li {
		line-height: 48px !important;
		padding: 0;
		border: none;
		border-top: 1px solid #112e51;
	}
	#gNav .sub ul.link li {
		margin: 15px;
	}
	#gNav .sub ul.link li .fas {
		margin-right: 3px;
	}
	#gNav .sub ul.link li.login a {
		font-weight: bold;
		color: #e6230f;
	}
	#gNav .sub ul.link li.registration a {
		display: block;
		color: #fff;
		padding: 10px;
		background: #e6230f;
		border-radius: 30px;
		text-align: center;
	}
	#gNav .sub ul.sns {
		padding: 0 0 15px;
		overflow: hidden;
	}
	#gNav .sub ul.sns li {
		float: left;
		width: 33.33333%;
		font-size: 24px;
		text-align: center;
	}
	#gNav #headerSearch #keywordSearch input[type="text"] {
		font-size: 12px;
	}

	/* 20201223ヘッダー更新 */
	#gNav .main .hyougenWrap, #gNav .main .kazuWrap, #gNav .main .specialWrap, #gNav .main .columnWrap, #gNav .main .karadaWrap, #gNav .main .kotobaWrap {
	    width: 100%;
	    display: flex;
	  }

	#gNav .main li>div>.spacOpen {
	    display: block;
	    border: none;
	    width: 10%;
	    margin: 5px;
	  }

	#gNav .main li>div>a {
	    width: 90%;
	  }

	#gNav ul.main li .submenu.active {
	    display: block;
	  }

	#gNav ul.main li .submenu {
	    position: relative;
	    left: inherit;
	    margin: 0;
	    padding: 0;
	    background: #ccc;
	    color: #fff;
	    border: none;
	    display: none;
	    width: 100%;
	    height: 100%
	  }

	#gNav ul.main li .submenu li {
	    display: inline-flex;
	    justify-content: space-between;
	    width: 49%;
	    text-align: center;
	    margin: 0;
	    padding: 0;
	    font-size: 14px;
	    border-top: none;
	  }

	#gNav ul.main li .submenu li a {
	    line-height: initial;
	    display: block;
	    width: 100%;
	    height: 100%;
	    padding: 8px;
	  }

	#gNav ul.main li .submenu li a:after {
	    display: none;
	  }

	#gNav ul.main li a i {
	    display: none;
	  }

    /* 20201223 spサイズのメニューの先頭空白調節 */
	#gNav ul.main .karada a{
	    padding-left: 62px;
	}

	#gNav .main li.supporter img {
	    width: 22px;
	    padding-bottom: 2px;
	    padding-right: 4px;
	  }


	/* フッター */
	#footer #pcFooter {
		display: none;
	}
	#footer #spFooter {
		font-size: 14px;
		padding: 15px;
	}
	#footer #spFooter .logo {
		margin: 0;
		padding: 10px 0 15px;
	}
	#footer #spFooter .footerLinks {
		font-size: 0;
		margin: 0;
	}
	#footer #spFooter .footerLinks li {
		display: inline-block;
		font-size: 13px;
		margin: 4px 8px;
	}
	#footer #spFooter .footerLinks li.asahiLogo {
		display: block;
		margin: 0;
		padding-top: 10px;
	}
	#footer .copyright {
		font-size: 10px;
		padding: 10px 10px 120px;
	}
	.pageTopBtn {
		width: 70px;
		height: 100px;
		background-size: contain;
	}

	
	#project-capture {
		background: #F6F6F6;
		padding: 15px 0;
		border-radius: 10px;
		margin-bottom: 40px;
	}
	
	#project-capture .capture-lead {
		margin: 0 15px 10px;
		font-size: 14px;
		text-align: center;
	}

	#project-capture .capture-lead p {
		display: inline-block;
		text-align: left;
	}

	#project-capture .capture-item {
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	#project-capture .capture-image {
		width: 55px;
		padding-left: 3px;
	}
	
	/* コンテンツ */
	#breadcrumb {
		margin: 0 -15px;
		padding: 10px;
	}
	#breadcrumb li {
		font-size: 10px;
	}
	#contents {
		padding: 77px 15px 15px;
	}
	#contents .pageTitle {
		font-size: 24px;
		margin: 15px 0;
	}
	#contents .pageBox {
		clear: both;
		padding: 15px;
	}

	/* 表 */
	#contents table.basic,
	#contents table.basic tbody,
	#contents table.basic tr,
	#contents table.basic th,
	#contents table.basic td {
		display: block;
		width: auto;
	}
	#contents table.basic th {
		padding: 15px 15px 0;
		border: none;
	}
	#contents table.basic td {
		padding: 0 15px 15px;
	}

	/* リスト */
	#contents ul.basic li {
		position: relative;
		line-height: 24px;
		padding: 0 0 0 15px;
	}
	#contents ul.basic li:before {
		position: absolute;
		left: 0px;
		font-family: "Font Awesome 5 Free";
		font-weight: normal;
		font-size: 8px;
		color: #3779b8;
		content: "\f111";
	}

	/* 記事一覧 */
	#contents #searchNavBtn {
		float: right;
		margin: 0 0 15px;
	}
	#contents .genreTitle {
		position: relative;
		margin: 20px 0;
		padding: 0;
		z-index: 1;
	}
	#contents .genreTitle:before {
		position: absolute;
		width: 120px;
		height: 120px;
		content: "";
		margin-top: -20px;
		z-index: 2;
	}
	#contents .genreTitle h1 {
		position: relative;
		font-size: 24px;
		line-height: 1.2;
		text-align: center;
		margin: 30px 0 30px 140px;
		padding: 20px 0;
		background: #fff;
		border: 3px solid #333;
		border-radius: 10px;
		white-space: nowrap;
		overflow: visible;
	}
	#contents .genreTitle h1 br {
		display: none;
	}
	#contents .genreTitle h1:before {
		position: absolute;
		top: 50%;
		left: -22px;
		width: 0;
		height: 0;
		content: "";
		margin-top: -12px;
		border-style: solid;
		border-width: 12px 22px 12px 0;
		border-color: transparent #333 transparent transparent;
	}
	#contents .genreTitle h1:after {
		position: absolute;
		top: 50%;
		left: -16px;
		width: 0;
		height: 0;
		content: "";
		margin-top: -8px;
		border-style: solid;
		border-width: 8px 16px 8px 0;
		border-color: transparent #fff transparent transparent;
	}

	/* 20191212追加 */
	#contents .banner_asodoro {
		position: relative;
		z-index: 20;
		padding: 15px 15px 50px;
	}

	body.kotoba #contents .genreTitle:before {
		background: url("/static/images/common/title_kotoba.png") no-repeat center center;
		background-size: contain;
	}
	body.kazu #contents .genreTitle:before {
		background: url("/static/images/common/title_kazu.png") no-repeat center center;
		background-size: contain;
	}
	body.hyougen #contents .genreTitle:before {
		background: url("/static/images/common/title_hyougen.png") no-repeat center center;
		background-size: contain;
	}
	body.karada #contents .genreTitle:before {
		background: url("/static/images/common/title_karada.png") no-repeat center center;
		background-size: contain;
	}
	body.special #contents .genreTitle:before {
		background: url("/static/images/common/title_special.png") no-repeat center center;
		background-size: contain;
	}
	/* 20191217追加 */
	body.special_porepore #contents .genreTitle:before {
		background: url("/static/images/common/title_special_porepore.png") no-repeat center center;
		background-size: contain;
	}

	body.kotoba #contents .genreTitle h1 {
		background: #dbedf9;
	}
	body.kazu #contents .genreTitle h1 {
		background: #e6f4df;
	}
	body.hyougen #contents .genreTitle h1 {
		background: #fddcd7;
	}
	body.karada #contents .genreTitle h1 {
		background: #f0e3ed;
	}
	body.special #contents .genreTitle h1 {
		background: #FFD700;
	}
	/* 20191217追加 */
	body.special_porepore #contents .genreTitle h1 {
		background: #C1DB81;
	}

	body.kotoba #contents .genreTitle h1:after {
		border-right-color: #dbedf9;
	}
	body.kazu #contents .genreTitle h1:after {
		border-right-color: #e6f4df;
	}
	body.hyougen #contents .genreTitle h1:after {
		border-right-color: #fddcd7;
	}
	body.karada #contents .genreTitle h1:after {
		border-right-color: #f0e3ed;
	}
	body.special #contents .genreTitle h1:after {
		border-right-color: #FFD700;
	}
	/* 20191217追加 */
	body.special_porepore #contents .genreTitle h1:after {
		border-right-color: #C1DB8;
	}

	body.kotoba #contents .genreTitle .box p {
		font-size: 15px;
		color: #333;
	}
	body.kazu #contents .genreTitle .box p {
		font-size: 15px;
		color: #333;
	}
	body.hyougen #contents .genreTitle .box p {
		font-size: 15px;
		color: #333;
	}
	body.karada #contents .genreTitle .box p {
		font-size: 15px;
		color: #333;
	}
	body.special #contents .genreTitle .box p {
		font-size: 15px;
		color: #EEEEEE;
	}
	/* 20191217追加 */
	body.special_porepore #contents .genreTitle .box p {
		font-size: 15px;
		color: #333;
	}

	#contents .list .nav {
		padding: 0 0 10px;
	}
	#contents .list .item {
		padding: 20px 0;
	}
	#contents .list .item .img {
		float: none;
		width: auto;
		margin: 0 0 15px;
	}
	#contents .list .item .txt h2 {
		font-size: 20px;
		line-height: 1.5;
	}
	#contents .list .item .txt h2 .fa-video {
		font-size: 14px;
		margin-left: 5px;
		vertical-align: 2px;
	}

	/* ランキング */
	#contents .ranking {
		margin: 40px 0 0;
	}
	#contents .ranking .title {
		margin: 0 0 40px;
	}
	#contents .ranking .title h2 {
		font-size: 20px;
	}
	#contents .ranking .title h2:before,
	#contents .ranking .title h2:after {
		top: 3px;
		width: 50px;
		height: 20px;
		background-size: contain;
	}
	#contents .ranking .title h2:before {
		left: -60px;
	}
	#contents .ranking .title h2:after {
		right: -60px;
	}
	#contents .ranking .list .item {
		float: none;
		width: auto;
		margin: 0 0 40px;
		padding: 15px;
	}

	/* おすすめコンテンツ */
	#contents .recommended .list .item {
		padding: 20px 0 0;
	}

	/* 著者プロフィール・監修者 */
	#contents .profile .img {
		margin: 0 0 15px;
		text-align: center;
	}

	/* 一記事 */
	#contents #article {
		margin: 20px 0;
	}
	#contents #article .alert {
		margin: -5px 0 15px;
	}
	#contents #article .articleTitle {
		min-height: 0px;
		margin: 0 0 20px;
		padding: 0 0 20px;
	}
	#contents #article .articleTitle:after {
		display: none;
	}
	#contents #article .articleTitle .supported {
		line-height: 1.5;
		margin: 0 0 10px;
		padding: 0;
	}
	#contents #article .articleTitle .supported .icon {
		display: none;
	}
	#contents #article .articleTitle h1 {
		font-size: 24px;
		margin: 0;
	}
	#contents #article .articleTitle h1 .fa-video {
		font-size: 14px;
		margin-left: 5px;
		vertical-align: 3px;
	}
	#contents #article .articleTitle .tag2 {
		font-size: 12px;
	}
	#contents #article .articleTitle .tag2 .group {
		display: inline-block;
		margin: 10px 10px 0 0;
	}
	#contents #article .articleTitleNav {
		position: relative;
		min-height: 40px;
		margin: 10px 0 -10px;
		text-align: left;
	}
	#contents #article .articleTitleNav li {
		display: block;
		line-height: 1.7;
	}
	#contents #article .articleTitleNav li+li {
		margin: 0;
	}
	#contents #article .articleTitleNav li.favorite {
		position: absolute;
		top: 50%;
		right: 0px;
		margin-top: -20px;
	}
	#contents #article .articleTitleNav li.favorite i {
		font-size: 40px;
		line-height: 40px;
	}
	#contents #article .slide #asobiShare h2 {
		font-size: 12px;
	}
	#contents #article .slide #asobiShare li {
		margin-left: 8px;
	}
	#contents #article .articleBody {
		margin: 20px 0 0;
	}
	#contents #article .articleBody .btn ul {
		margin-right: -10px;
	}
	#contents #article .articleBody .btn ul li {
		padding-right: 10px;
	}
	#contents #article .articleBody .btn .redBtn,
	#contents #article .articleBody .btn .redLineBtn {
		font-size: 16px;
		padding: 5px 0;
	}


	/* バナー */
	#contents #article .banner {
		margin: 20px 15px 0;
	}
	#contents #article .homeBanner {
		padding: 30px 15px;
	}
	#contents #article .homeBanner ul li {
		margin: 15px 0;
	}
	#contents #article .homeBanner ul li img {
		width: 100%;
	}


	/* フォーム */
	#contents #asobiForm .form .spHide {
		display: none !important;
	}
	#contents #asobiForm .form .formHead h2 small {
		display: block;
		font-size: 15px;
		line-height: 1.5;
		margin: 10px 0 0 -50px;
	}
	#contents #asobiForm .form table,
	#contents #asobiForm .form tbody,
	#contents #asobiForm .form tr,
	#contents #asobiForm .form th,
	#contents #asobiForm .form td {
		display: block;
		width: auto;
	}
	#contents #asobiForm .form th {
		padding: 0 0 3px;
	}
	#contents #asobiForm .form th .requiredMark,
	#contents #asobiForm .form th .freeMark {
		margin-left: 10px;
	}
	#contents #asobiForm .form td {
		padding: 0 0 20px;
	}
	#contents #asobiForm .form .hint {
		font-size: 14px;
	}
	#contents #asobiForm .form .name {
		display: block;
		margin-bottom: 5px;
	}
	#contents #asobiForm .form .numchildren,
	#contents #asobiForm .form .zip1 {
		width: 50px;
	}
	#contents #asobiForm .form .zip2 {
		width: 70px;
	}
	#contents #asobiForm .form .subBtn {
		margin-left: 5px;
		padding: 3px 5px;
	}
	#contents #asobiForm .form .subBtn.change {
		width: 100%;
		margin: 10px 0 0;
	}
	#contents #asobiForm .form .campaignCode {
		padding-top: 10px;
	}
	#contents #asobiForm .form .inputImageAuth {
		font-size: 14px;
	}
	#contents #asobiForm .form .terms .content {
		padding: 10px;
	}
	#contents #asobiForm .form .agreementCtrl {
		font-size: 14px;
	}
	#contents #asobiForm .form .btn .backBtn,
	#contents #asobiForm .form .btn .submitBtn {
		margin-top: 0;
	}

	#contents #asobiForm .form table.favlist {
		margin: 0 0 20px;
	}
	#contents #asobiForm .form table.favlist th {
		display: none;
	}
	#contents #asobiForm .form table.favlist td {
		line-height: 32px;
		padding: 10px 0;
	}
	#contents #asobiForm .form table.favlist td.title {
		font-weight: bold;
	}
	#contents #asobiForm .form table.favlist td.del {
		padding: 0;
	}
	#contents #asobiForm .form table.favlist td.date {
		border-bottom: 2px dotted #ddd;
	}

	/* キッズサポーター掲載エリア */
	#footer #supporter-area {
		padding: 60px 15px;
		border-top: 3px solid #333;
	}
	#footer #supporter-area h2 {
		margin: 0 0 20px;
		font-size: 24px;
		font-weight: bold;
		text-align: center;
	}
	#footer #supporter-area .lead {
		margin: 0 0 40px;
	}
	#footer #supporter-area h3 {
		margin: 0 0 20px;
		font-size: 18px;
		font-weight: bold;
		text-align: center;
	}
	#footer #supporter-area .collaboration-list {
		margin: 0 0 40px;
		text-align: center;
	}
	#footer #supporter-area .collaboration-list ul {
		display: flex;
		flex-wrap: wrap;
		margin: -10px -5px 0;
	}
	#footer #supporter-area .collaboration-list li {
		width: 50%;
		padding: 10px 5px 0;
	}
	#footer #supporter-area .collaboration-list li a {
		display: flex;
		flex-direction: column;
		height: 100%;
		border: 3px solid #DDDDDD;
		border-radius: 10px;
		overflow: hidden;
	}
	#footer #supporter-area .collaboration-list li .image {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 100px;
	}
	#footer #supporter-area .collaboration-list li .image span {
		width: 85%;
	}
	#footer #supporter-area .collaboration-list li .image img {
		max-width: 100%;
	}
	#footer #supporter-area .collaboration-list li .title {
		position: relative;
		display: flex;
		align-items: center;
		flex: auto;
		padding: 15px 40px 15px 15px;
		font-size: 13px;
		color: #666666;
		background: #DDDDDD;
		text-align: left;
	}
	#footer #supporter-area .collaboration-list li .title .pc {
		display: none;
	}
	#footer #supporter-area .collaboration-list li .title::after {
		content: "\f105";
		position: absolute;
		top: 50%;
		right: 16px;
		font-family: "Font Awesome 5 Free";
		font-size: 14px;
		font-weight: 900;
		transform: translateY(-50%);
	}
	#footer #supporter-area .support-list {
		text-align: center;
	}
	#footer #supporter-area .support-list ul {
		display: flex;
		flex-wrap: wrap;
	}
	#footer #supporter-area .support-list li {
		position: relative;
		width: 33.333%;
		border-right-width: 3px;
		border-bottom-width: 3px;
		border-style: solid;
		border-color: #DDDDDD;
	}
	#footer #supporter-area .support-list li::before {
		content: "";
		display: block;
		padding-top: 100%;
	}
	#footer #supporter-area .support-list li a {
		position: absolute;
		display: flex;
		align-items: center;
		justify-content: center;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		overflow: hidden;
	}
	#footer #supporter-area .support-list li span {
		width: 70%;
	}
	#footer #supporter-area .support-list li:nth-child(-n+3) {
		border-top-width: 3px;
	}
	#footer #supporter-area .support-list li:nth-child(3n+1) {
		border-left-width: 3px;
	}
	#footer #supporter-area .support-list li:first-child {
		border-top-left-radius: 10px;
	}
	#footer #supporter-area .support-list li:nth-child(3n):nth-child(-n+3),
	#footer #supporter-area .support-list li:nth-child(-n+2):last-child {
		border-top-right-radius: 10px;
	}
	#footer #supporter-area .support-list li:nth-child(3n+1):nth-last-child(-n+3) {
		border-bottom-left-radius: 10px;
	}
	#footer #supporter-area .support-list li:nth-child(3n):nth-last-child(-n+3),
	#footer #supporter-area .support-list li:last-child {
		border-bottom-right-radius: 10px;
	}
}

@media (max-width: 320px) {

	#contents .genreTitle h1 {
		font-size: 18px;
	}

}