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


body {
	background-color: #e9eff2;
	font: 90%;
	color: #212121;
	text-rendering: optimizelegibility;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	-moz-tap-highlight-color:rgba(0, 0, 0, 0);
	-moz-text-size-adjust: none;
	-moz-font-smoothing: antialiased;
	-ms-tap-highlight-color:rgba(0, 0, 0, 0);
	-ms-text-size-adjust: none;
	-ms-font-smoothing: antialiased;
}
a {
	text-decoration: none;
	color:#3a7297;
	-webkit-tap-highlight-color: rgba(0, 0, 215, 0.20);
}
a:hover {
	text-decoration:underline;
}
h2 {
	padding-bottom: 10px;
	font-size:120%;
}
.none {
	display:none;
}
.container {
	overflow: hidden;
	background-color: #000;
	/*  Prevents Flickering  */
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
}
.container {
	position: relative;
	background-color: #e9eff2;
	max-width: 1100px;
	margin: 0 auto;
	padding: 20px 20px 0;
}
header {
	position: relative;
	background-color: #243640;
	padding:10px 20px;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
}
header h1 {
	color: #ffffff;
	text-align: left;
	font-weight: bold;
	line-height:1.0;
	padding:5px 0 10px 0;
}
header h1 img {
	height:25px;
}
.topimg,
.topimg02 {
	background:url(../image/mainimg_bg.jpg) no-repeat;
	background-size:cover;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	position:relative;
	height:450px;
}

.mainimg {
	float:left;
	padding:30px 0 0 7%;
}

.mainimg_text{
	float:right;
	padding:40px 5% 0 0;
}

.mainimg_text02 {
	float:right;
	padding:70px 5% 0 0;
}
@media only screen and (max-width: 1010px) {
.mainimg {
	display:none;
}
.mainimg_text {
	float:none;
	padding:30px 0 0 0;
	text-align:center;
}
}
@media only screen and (max-width: 630px) {
.mainimg_text{
	float:none;
	padding:30px 15px;
	text-align:center;
}
.mainimg_text02{
	float:none;
	padding:70px 15px 30px 15px;
	text-align:center;
}
.mainimg_text img,
.mainimg_text02 img{
	width:100%;
}
.topimg {
	height:450px;
}
.topimg02 {
	height:350px;
}
}

.loginform ul {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content:center;
	padding:25px 0;
}
.loginform ul li {
	width:60%;
	margin:0 15px;
}
.loginform ul li a {
	font-size:130%;
	padding:13px 0;
	text-align:center;
	font-weight:bold;
	display:block;
	border:3px solid #ffffff;
	border-radius:10px;
	display:block;
	color:#ffffff;
}
/*---.loginform ul li:first-of-type a {
	background: #31e600;
	background: -moz-linear-gradient(top, #31e600 0%, #11b800 100%);
	background: -webkit-linear-gradient(top, #31e600 0%, #11b800 100%);
	background: linear-gradient(to bottom, #31e600 0%, #11b800 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#31e600', endColorstr='#11b800', GradientType=0 );
}
.loginform ul li:first-of-type a:hover {
	background:#31e600;
	text-decoration:none;
}---*/
.loginform ul li:last-of-type a {
	background: #7a83f3; /* Old browsers */
	background: -moz-linear-gradient(top, #7a83f3 0%, #5f68de 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #7a83f3 0%, #5f68de 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #7a83f3 0%, #5f68de 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7a83f3', endColorstr='#5f68de', GradientType=0 ); /* IE6-9 */
}
.loginform ul li:last-of-type a:hover {
	background:#7a83f3;
	text-decoration:none;
}
@media only screen and (max-width: 500px) {
.topimg {
	height:320px;
}
.topimg02 {
	height:240px;
}
.loginform ul {
	display: block;
	padding:25px 0;
}
.loginform ul li{
	width:100%;
	margin:0 0 15px 0;
	}
.loginform ul li a {
	width:100%;
	font-size:130%;
	padding:13px 0;
	text-align:center;
	font-weight:bold;
	border:3px solid #ffffff;
	border-radius:10px;
	display:block;
	color:#ffffff;
}
.mainimg_text02{
	float:none;
	padding:40px 15px 30px 15px;
	text-align:center;
}
}
.burger {
	position: absolute;
	float: left;
	padding: 10px;
	top: 4px;
	left: 10px;
	display: none;
}
.burger li {
	width: 30px;
	height: 4px;
	background-color: #fff;
	border-radius: 3px;
	margin: 5px 0;
}
.burger.open li {
	background-color: #d9dde1;
}
nav {
	width:100%;
	position: absolute;
	top: 0;
	right: 5px;
}
nav.slide ul {
	width:60%;
	padding:45px 0 0 170px;
	font-size:80%;
}
nav.slide ul li a {
	color: #ffffff;
	padding: 0 15px;
	display: block;
}
nav.slide ul li.none a {
	padding:0;
	display:none;
}
nav.slide ul li.name a {
	padding:0;
}
nav.slide ul li a:hover {
	color: #ffffff;
}
nav.slide ul li {
	display:inline-block;
}
nav.slide ul li.name {
	position:absolute;
	right:40px;
	top:28px;
	float:none;
	display:block;
	color:#acacac;
	font-size:90%;
}
nav.slide ul li.form {
	position:absolute;
	right:40px;
	top:50px;
	float:none;
	display:block;
}
.search_field {
	width:150px;
	background:#d9d9d9;
}
.btn_search {
	cursor:pointer;
}
.contentbox {
	padding:10px 25px;
}
.contentbox2 {
	padding:25px;
}
.qr {
	text-align:center;
	display:block;
	font-size:70%;
	padding:10px;
}
.login_wrapper {
	width:500px;
	margin:20px auto;
}
.reader {
	margin:0 0 30px 0;
	padding:10px;
	background:#fbffbc;
	border:4px solid #bfd21e;
}
.reader h3 {
	background:#c5ce3e;
	margin:0 0 10px 0;
	border-left:7px solid #858b2e;
	color:#ffffff;
	padding:6px 3px 3px 10px;
	font-size:100%;
}
.issuer {
	margin:0 0 30px 0;
	padding:10px;
	background:#dbddf9;
	border:4px solid #7f85dd;
}
.issuer h3 {
	background:#6f75c4;
	margin:0 0 10px 0;
	border-left:7px solid #4e54a9;
	color:#ffffff;
	padding:6px 3px 3px 10px;
	font-size:100%;
}
.reader table, .issuer table {
	width:100%;
	margin:0 0 15px 0;
}
.reader table th, .issuer table th {
	font-weight:normal;
	width:30%;
	padding:5px 0;
	font-size:80%;
}
.reader table td, .issuer table td {
	padding:10px;
}
.login_box_btn {
	width:250px;
	font-size:100%;
	text-align:center;
	margin:0 auto 20px auto;
	padding:7px 25px;
	font-weight:bold;
	cursor:pointer;
	display:block;
	border-radius:5px;
}
.reader .login_box_btn {
	background: #d5d813;
	color:#ffffff;
	border:1px solid #B3BA34;
	border-radius:5px;
}
.reader .login_box_btn:hover {
	background: #E5ED53;
	text-decoration:none;
}
.issuer .login_box_btn {
	background: #499bea;
	color:#ffffff;
	border:1px solid #367ec3;
	border-radius:5px;
}
.issuer .login_box_btn:hover {
	background: #75baff;
	text-decoration:none;
}
.fg_ps {
	text-align:center;
	font-size:80%;
}
.reader table .ml, .issuer table .ml {
	width:95%;
	font-size:100%;
}
.reader table .ps, .issuer table .ps {
	width:95%;
	font-size:100%;
}
.item_list li {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content: flex-start;
	padding:0 0 8px 0;
	margin:0 0 8px 0;
	border-bottom:1px dotted #cccccc;
	position:relative;
}
.item_list li a {
	font-weight:bold;
}
.item_list li p {
	font-size:75%;
	margin:5px 0;
	line-height:1.4;
}
.item_list li span {
	display:block;
	color:#999999;
	font-size:75%;
	line-height:1.4;
}
.item_list li span span {
	color:#ffffff;
	padding:3px;
	font-size:90%;
	display:inline-block;
	line-height:1.0;
}
.item_list li span span.pc {
	background:#ccdd5d;
	margin:0 5px 0 0;
}
.item_list li span span.mb {
	background:#88c4da;
	margin:0 5px 0 0;
}
.item_list li .item_list_inner {
	padding:0 0 0 10px;
}
.item_list li a img {
	border:1px solid #cccccc;
	padding:1px;
}
.rank_number {
	position:absolute;
	top:-3px;
	left:-3px;
	background:#d72e45;
	color:#ffffff!important;
	padding:3px 5px;
	display:block;
	border-radius:2px;
}
.cat_list li {
	font-size:90%;
	margin:0 0 5px 0;
	padding:0 0 2px 0;
	border-bottom:1px dotted #cccccc;
}

.pager_box{
	text-align:center;
	}
	
.pager_box span,
.pager_box a{
	display:inline-block;
	margin:0 5px;
	}

/*  Removable CSS  */
.header-section {
}
.body-section, .footer-section {
	padding: 20px 0;
	clear:both;
}
.header-section {
	background-color: #ffffff;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
}
.body-section {
	background-color: #e9eff2;
}
.footer-section {
	background-color: #243640;
	color:#6b7b83;
	text-align:center;
}
.footer-section a {
	color:#6b7b83;
}
.placefiller {
	text-align: center;
	font-size: 20px;
}
.header-section .placefiller {
	line-height: 300px;
}
.body-section .placefiller {
	line-height: 900px;
}
.footer-section .placefiller {
	line-height: 200px;
	border: 1px dashed rgba(190, 196, 202, 0.9);
}
.ranking_list {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content: space-between;
}
.ranking_list div {
	width:32%;
	background:#ffffff;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
}
.ranking_list ul {
	padding:15px;
}
.ranking_list div h2 {
	padding:20px 0 0 0;
	text-align:center;
	font-weight:normal;
}
.ranking_list div h2 img {
	height:70px;
}
.ranking_list div h2 span {
	display:block;
	background:#ffffff;
	text-align:center;
	margin:10px 0 0 0;
	padding:10px 0 0 0;
}
.ranking_list div:nth-of-type(1) h2 span:after, .ranking_list div:nth-of-type(2) h2 span:after, .ranking_list div:nth-of-type(3) h2 span:after {
 content:" -"
}
.ranking_list div:nth-of-type(1) h2 span:before, .ranking_list div:nth-of-type(2) h2 span:before, .ranking_list div:nth-of-type(3) h2 span:before {
 content:"- "
}
 .ranking_list div:nth-of-type(1) h2 span {
 color:#c0e053;
}
.ranking_list div:nth-of-type(2) h2 span {
 color:#c26c8b;
}
.ranking_list div:nth-of-type(3) h2 span {
 color:#88c4da;
}
.ranking_list div:nth-of-type(1) h2 {
 background:url(../image/ranking_bg1.jpg) center;
 background-size:cover;
}
.ranking_list div:nth-of-type(2) h2 {
 background:url(../image/ranking_bg2.jpg) center;
 background-size:cover;
}
.ranking_list div:nth-of-type(3) h2 {
 background:url(../image/ranking_bg3.jpg) center;
 background-size:cover;
}
.rank_list1 li, .rank_list2 li, .rank_list3 li {
	margin:0 0 10px 0;
	font-weight:bold;
}
.rank_list1 span, .rank_list2 span, .rank_list3 span {
	line-height:1.0;
	padding:2px 5px;
	text-align:center;
	color:#ffffff;
	font-size:80%;
}
.rank_list1 span {
	background:#c0e053;
}
.rank_list2 span {
	background:#c26c8b;
}
.rank_list3 span {
	background:#88c4da;
}
.ranking_list div:first-of-type a.btn_r_page, .ranking_list div:nth-of-type(2) a.btn_r_page, .ranking_list div:last-of-type a.btn_r_page {
 width:200px;
 display:block;
 margin:10px auto 20px auto;
 padding:5px;
 text-align:center;
 font-size:75%;
 border-radius:8px;
}
 .ranking_list div:first-of-type a.btn_r_page:hover, .ranking_list div:nth-of-type(2) a.btn_r_page:hover, .ranking_list div:last-of-type a.btn_r_page:hover {
 text-decoration:none;
}
.ranking_list div:first-of-type a.btn_r_page {
	background:#b9de3a;
	color:#ffffff;
}
.ranking_list div:first-of-type a.btn_r_page:hover {
	background:#94bb0f;
}
 .ranking_list div:nth-of-type(2) a.btn_r_page {
 background:#c26c8b;
 color:#ffffff;
}
.ranking_list div:nth-of-type(2) a.btn_r_page:hover {
 background:#c60f51;
}
.ranking_list div:last-of-type a.btn_r_page {
	background:#88c4da;
	color:#ffffff;
}
.ranking_list div:last-of-type a.btn_r_page:hover {
	background:#3d98b9;
}
#search_nav, #ranking_nav {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content:space-between;
	margin:0 0 25px 0;
}
#search_nav li {
	width:25%;
	text-align:center;
	font-size:80%;
}
.title_ranking {
	text-align:center;
	font-weight:bold;
	height:100px;
	padding:10px 0;
	font-size:120%;
	color:#ffd325;
	background:#732530;
	position:relative;
	border-top:2px solid #252525;
	font-weight:normal;
}
.title_ranking span.bg_l {
	width:172px;
	height:120px;
	background:url(../image/bg_ranking_l.png) no-repeat;
	background-size:172px 120px;
	position:absolute;
	top:0;
	left:0;
	display:block;
	z-index:1;
}
.title_ranking span.bg_r {
	width:172px;
	height:120px;
	background:url(../image/bg_ranking_r.png) no-repeat;
	background-size:172px 120px;
	position:absolute;
	top:0;
	right:0;
	display:block;
	z-index:1;
}
.title_ranking .ranking_image {
	height:60px;
}
#ranking_nav li {
	width:33%;
	text-align:center;
	font-size:80%;
}
#ranking_nav li:last-of-type {
	width:34%;
}
#ranking_nav li a img {
	width:30px;
	vertical-align:bottom;
}
#search_nav li a img {
	width:25px;
	vertical-align:bottom;
}
#search_nav li a {
	color:#333333;
	background: #fcfcfc; /* Old browsers */
	background: -moz-linear-gradient(top, #fcfcfc 0%, #f4f4f4 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #fcfcfc 0%, #f4f4f4 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #fcfcfc 0%, #f4f4f4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#f4f4f4', GradientType=0 ); /* IE6-9 */
	padding:5px 0;
	display:block;
	border-right:1px solid #6b7b83;
	border-bottom:1px solid #6b7b83;
}
#ranking_nav li a {
	color:#ea2121;
	background: #fcfcfc; /* Old browsers */
	background: -moz-linear-gradient(top, #fcfcfc 0%, #f4f4f4 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #fcfcfc 0%, #f4f4f4 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #fcfcfc 0%, #f4f4f4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#f4f4f4', GradientType=0 ); /* IE6-9 */
	padding:5px 0;
	display:block;
	border-right:1px solid #ea2121;
	border-bottom:1px solid #ea2121;
}
#search_nav li a:hover, #search_nav li a.active {
	background:#dcebf5!important;
	font-weight:bold;
	text-decoration:none;
}
#ranking_nav li a:hover, #ranking_nav li a.active {
	background:#fffb8e!important;
	font-weight:bold;
	text-decoration:none;
}
#search_nav li:last-of-type a, #ranking_nav li:last-of-type a {
	border-right:none;
}
.pagenavi {
	text-align:center;
}
.pagenavi .current {
	font-weight:bold;
}
.pagenavi a{
	text-decoration:underline;
	}
	
.top_content_listbox {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content:space-between;
	margin:0 0 20px 0;
}
.top_content_listbox aside h2 {
	padding:5px 10px;
	color:#ffffff;
	background:#1eade1;
	font-size:80%;
	font-weight:normal;
}
.top_content_listbox aside h2 span {
	background:url(../image/icon_cat.png) no-repeat;
	background-size:23px 17px;
	padding:0 0 0 30px;
	display:block;
}
.top_content_listbox div h2 {
	font-size:80%;
	font-weight:normal;
	padding:5px 10px;
	color:#ffffff;
}
.top_content_listbox div:nth-of-type(1) h2 {
 background:#5e9795;
}
 .top_content_listbox div:nth-of-type(1) h2 span {
 background:url(../image/icon_new.png) no-repeat;
 background-size:20px 20px;
 padding:0 0 0 30px;
 display:block;
}
 .top_content_listbox div:nth-of-type(2) h2 {
 background:#09c200;
}
 .top_content_listbox div:nth-of-type(2) h2 span {
 background:url(../image/icon_reader.png) no-repeat;
 background-size:23px 17px;
 padding:0 0 0 30px;
 display:block;
}
.top_content_listbox aside {
	width:18%;
	background:#ffffff;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
}
.top_content_listbox .index_box1 {
	width:39%;
	background:#ffffff;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
}
.top_content_listbox aside ul, .top_content_listbox div ul {
	padding:10px;
}
.mg_header {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	margin:0 0 30px 0;
}
.mg_header img {
	width:100px;
	height:100px;
	display:block;
	padding:1px;
	border:1px solid #cccccc;
}
.mg_name {
	padding:0 0 0 20px;
}
.mg_name h1 {
	font-size:200%;
	line-height:1.3;
	margin:0 0 10px 0;
}
.mg_name h1 span {
	font-size:40%!important;
	display:block;
	margin:0 0 10px 0;
	font-weight:normal;
	font-size:70%;
}
.mg_name p {
	font-size:75%;
}
.mg_name_cat {
	background:#1eade1;
	color:#ffffff;
	margin:0 10px 0 0;
	padding:3px;
}
.mg_regist_form {
	width:600px;
	margin:0 auto 30px auto;
}
.mg_regist_form h2 {
	color:#ffffff;
	background:#243640;
	line-height:1.0;
	font-size:80%;
	padding:10px 0 10px 15px;
	font-weight:normal;
}
.mg_regist_form div {
	padding:15px;
	border-right:3px solid #243640;
	border-bottom:3px solid #243640;
	border-left:3px solid #243640;
	background:#f6f6f6;
}
.mg_regist_form .mailform {
	padding:3px;
	font-size:100%;
	width:300px;
}
.mg_regist_form .btn_submit {
	background: #00ACD3;
	color:#ffffff;
	font-size:100%;
	text-align:center;
	margin:0 0 0 20px;
	padding:7px 25px;
	font-weight:bold;
	border-radius:5px;
	cursor:pointer;
}
.mg_regist_form .btn_submit:hover {
	background: #009ABC; /* Old browsers */
}
.mg_intro_text {
	margin:0 0 30px 0;
}
.mg_title_form {
	margin:0 0 10px 0;
	font-size:100%;
}
.mg_title_form a {
	text-decoration:underline;
}
.mg_title_form a:hover {
	text-decoration:none;
}
.mg_table {
	width:600px;
	margin:0 auto 50px auto;
	border-top:1px solid #cccccc;
	border-left:1px solid #cccccc;
	background:#f7f7f7;
}
.mg_table th {
	text-align:left;
	font-weight:normal;
	padding:10px;
	font-size:85%;
	border-right:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	background:#efefef;
}
.mg_table td {
	padding:10px;
	border-right:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
}
.powered-by {
	text-align:right;
	margin:10px 0 0 0;
	font-size:75%;
}
.backnumber_list li {
	border-bottom:1px dotted #cccccc;
	padding:0 0 5px 10px;
	margin:0 0 10px 0;
}
.backnumber_list li span {
	display:block;
}
.backnumber_list li:before {
	left: 3px;
	width: 4px;
	height: 4px;
	border-top: 2px solid #dddddd;
	border-right: 2px solid #dddddd;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.lower_box {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content:space-between;
	margin:0 0 20px 0;
}
.lower_box aside {
	width:18%;
	background:#ffffff;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
}
.lower_wrapper {
	width:78%;
	background:#ffffff;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
	padding:0 0 20px 0;
}
.lower_box aside h2 span {
	background:url(../image/icon_cat.png) no-repeat;
	background-size:23px 17px;
	padding:0 0 0 30px;
	display:block;
}
.lower_box aside ul {
	padding:15px;
}
.lower_wrapper h1.titlebar {
	background:#243640;
	font-size:80%;
	font-weight:normal;
	padding:5px 10px;
	color:#ffffff;
}
.titlebar2 {
	font-size:150%;
	border-left:8px solid #999900;
	margin:0 0 30px 0;
	padding:0 0 0 15px;
}
.titlebar3 {
	font-size:120%;
	border-bottom:4px double #252525;
	margin:0 0 10px 0;
	padding:0 0 2px 0;
}
.titlebar4 {
	font-size:90%;
	border-left:4px solid #252525;
	margin:0 0 10px 0;
	padding:0 0 0 5px;
}
.cat_list h2 {
	padding:5px 10px;
	color:#ffffff;
	background:#1eade1;
	font-size:80%;
	font-weight:normal;
}
.login_cat_list h2 {
	padding:5px 10px;
	color:#ffffff;
	background:#fd7976;
	font-size:80%;
	font-weight:normal;
}
.login_cat_list li {
	font-size:90%;
	margin:0 0 5px 0;
	padding:0 0 2px 0;
	border-bottom:1px dotted #cccccc;
}
.pagenavi {
	margin:30px 0;
}
.pagenavi li {
	display:inline;
	margin:0 15px;
}
.bk_history {
	width:250px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#499bea+0,207ce5+100;Blue+3d+%237 */
background: #499bea; /* Old browsers */
	background: -moz-linear-gradient(top, #499bea 0%, #207ce5 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #499bea 0%, #207ce5 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #499bea 0%, #207ce5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5', GradientType=0 );
	color:#ffffff;
	font-size:100%;
	text-align:center;
	margin:0 auto;
	padding:7px 25px;
	border:0;
	font-weight:bold;
	border-radius:5px;
	cursor:pointer;
	display:block;
}
.bk_history:hover {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#75baff+0,5eaeff+100 */
background: #75baff; /* Old browsers */
	background: -moz-linear-gradient(top, #75baff 0%, #5eaeff 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #75baff 0%, #5eaeff 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #75baff 0%, #5eaeff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75baff', endColorstr='#5eaeff', GradientType=0 ); /* IE6-9 */
	text-decoration:none;
}
.dl_type1 {
	margin:0 0 30px 0;
}
.dl_type1 dt {
	font-weight:bold;
	margin:0 0 5px 0;
	border-bottom:1px dotted #cccccc;
}
.dl_type1 dd {
	margin:0 0 5px 0;
	font-size:90%;
}

.howto li{
	margin:0 0 20px 0;
}

.howto li div{
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content: space-between;
	margin:0 0 15px 0;
	-webkit-box-direction:reverse;
    -webkit-flex-direction:row-reverse;
    flex-direction:row-reverse;
}

.number_list{
	margin:0 0 40px 0;
	}
	
.regist_btn {
	padding:0 15%;
}
.regist_btn a {
	width:100%;
	font-size:130%;
	padding:13px 0;
	text-align:center;
	font-weight:bold;
	display:block;
	border:3px solid #5e4ab2;
	border-radius:10px;
	display:block;
	color:#ffffff;
	background: #7a83f3; /* Old browsers */
	background: -moz-linear-gradient(top, #7a83f3 0%, #5f68de 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #7a83f3 0%, #5f68de 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #7a83f3 0%, #5f68de 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7a83f3', endColorstr='#5f68de', GradientType=0 ); /* IE6-9 */
}
.regist_btn a:hover {
	background:#7a83f3;
	text-decoration:none;
}
	
.howto .number_list li{
	list-style:decimal;
	list-style-type: none;
	counter-increment: number;
	}
	
.howto .number_list li::before{
  content: counter(number) ".";
  margin-right: 5px;
  color: #09c200;
  float:left;
  font-weight:bold;
  font-size:90%;
}

.howto li h3{
	margin:0 0 10px 0;
	font-size:95%;
	color:#09c200
	}
	
.normal_list h3{
	border-left:5px solid #09c200;
	padding:0 0 0 10px;
	}
	
.howto li figure{
	display:block;
	width:50%;
	}
	
.howto li figure img{
	width:100%;
	display:block;
	padding:1px;
	border:1px solid #cccccc;
	}
	
.howto li p{
	width:47%;
	font-size:90%;
	}
		

/*-------------------------ログイン後---------------------------*/
.loginmenu_box {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
}
.loginmenu_box div {
	width:32%;
	margin:0 15px 0 0;
}
.loginmenu_box div h2 {
	font-size:110%;
	margin:0 0 20px 0;
	padding:0 0 10px 37px;
	border-bottom:1px solid #cccccc;
}
.loginmenu_box div:nth-of-type(1) h2 {
 background:url(../image/icon_mail.png) no-repeat 0 1px;
 background-size:25px 25px;
}
.loginmenu_box div:nth-of-type(2) h2 {
 background:url(../image/icon_hum.png) no-repeat;
 background-size:25px 25px;
}
.loginmenu_box div ul li {
	margin:0 0 5px 0;
	padding:0 0 0 17px;
	position:relative;
}
.loginmenu_box div ul li:before {
	content: "";
	width: 5px;
	height: 5px;
	border: 0px;
	border-top: solid 2px #ff69b4;
	border-right: solid 2px #ff69b4;
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	top: 49%;
	left: 0;
	margin-top: -4px;
}
.mg_list_table {
	width:100%;
	margin:0 0 15px 0;
	border-top:1px solid #cccccc;
	border-left:1px solid #cccccc;
	background:#f7f7f7;
}
.mg_list_table th {
	min-width:40px;
	font-weight:normal;
	padding:5px 0;
	font-size:70%;
	border-right:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	background:#efefef;
}
.mg_list_table td {
	text-align:center;
	padding:5px;
	border-right:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	font-size:80%;
}
.mg_list_table td.small {
	font-size:70%!important;
	letter-spacing:-1px;
}
.form_temp dl {
	margin:0 0 30px 0;
}
.form_temp dt {
	margin:0 0 10px 0;
	padding:0 0 2px 0;
	font-size:80%;
	border-bottom:1px dotted #cccccc;
	font-weight:bold;
}
.form_temp dd {
	margin:0 0 20px 0;
}
.form_temp dd .text1 {
	padding:3px;
	font-size:100%;
	width:50%;
}
.form_temp dd .select1 {
	padding:3px;
	font-size:100%;
}
.form_temp dd .textarea1 {
	padding:3px;
	font-size:110%;
	width:50%;
	height:150px;
}
.form_temp dt .alert {
	font-size:85%;
}
.login_box_btn {
	border-radius:5px;
}
.form_temp .login_box_btn {
	background:#499bea;
	color:#ffffff;
	border:1px solid #367ec3;
	display:block;
	border-radius:5px;
}
.form_temp .login_box_btn:hover {
	background: #75baff;
	text-decoration:none;
}
.form_temp_confirm {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content:center;
}
.form_temp_confirm input {
	display:block;
	margin:0 15px;
	padding:7px 20px;
	font-size:100%;
	font-weight:bold;
}
.form_temp_confirm input:first-of-type {
	background:#bfbfbf;
	color:#ffffff;
	border:1px solid #a1a1a1;
	display:block;
	border-radius:5px;
}
.form_temp_confirm input:first-of-type:hover {
	background: #d4d4d4;
}
.form_temp_confirm input:last-of-type {
	background:#499bea;
	color:#ffffff;
	border:1px solid #367ec3;
	display:block;
	border-radius:5px;
}
.form_temp_confirm input:last-of-type:hover {
	background: #75baff;
}
.form_rule {
	text-align:center;
	margin:0 0 15px 0;
	font-size:85%;
}
.mg_list_edit {
	display: box;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	justify-content:center;
}
.mg_list_edit a {
	display:block;
	margin:0 15px;
	padding:10px 25px;
	font-size:110%;
}
.mg_list_edit a:first-of-type {
	background:#bfbfbf;
	color:#ffffff;
	border:1px solid #a1a1a1;
	display:block;
	border-radius:5px;
}
.mg_list_edit a:first-of-type:hover {
	background: #d4d4d4;
	text-decoration:none;
}
.mg_list_edit a:last-of-type {
	background:#499bea;
	color:#ffffff;
	border:1px solid #367ec3;
	display:block;
	border-radius:5px;
}
.mg_list_edit a:last-of-type:hover {
	background: #75baff;
	text-decoration:none;
}
.widget_code {
	width:100%;
	height:300px;
	margin:0 0 30px 0;
	font-size:80%;
	display:block;
	background:#f8f8f8;
	border:1px solid #cccccc;
	overflow-y:auto;
	overflow-x:auto;
}
.widget_code code {
	display:block;
	padding:10px;
}
.code_box {
	margin:0 0 30px 0;
	border-bottom:2px dotted #cccccc;
}
.btn_type1 {
	width:250px;
	font-size:100%;
	text-align:center;
	margin:0 auto 20px auto;
	padding:7px 25px;
	font-weight:bold;
	cursor:pointer;
	display:block;
	background:#499bea;
	color:#ffffff;
	border:1px solid #367ec3;
	display:block;
	border-radius:5px;
}
.btn_type1:hover {
	background: #75baff;
}
.submit_btn2 {
	border-radius:5px;
	background:#3a7297;
	color:#ffffff;
	margin:0 0 10px 0;
	padding:5px 10px;
	font-size:70%;
}
@media only screen and (max-width: 860px) {
header {
 z-index: 2;
 background-color: #243640;
 position: fixed;
 top: 0;
 right: 0;
 left: 0;
		/* starting point */
-webkit-transform: translate3d(0, 0, 0);
 -moz-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0);
}
header h1 {
 color: #ffffff;
 text-align: center;
 padding-left: 0;
 line-height:0;
}
.contentbox2 {
 padding:15px;
}
.titlebar2 {
 font-size:120%;
 border-left:8px solid #999900;
 margin:0 0 20px 0;
 padding:0 0 0 15px;
}
.titlebar3 {
 font-size:100%;
 border-bottom:4px double #252525;
 margin:0 0 10px 0;
 padding:0 0 2px 0;
}
 nav.slide ul {
width:67%;
 padding:15px 0 0 0;
}
nav.slide ul li {
 display:block;
}
 nav.slide ul li a {
 color: #ffffff;
 padding: 10px 15px;
 display: block;
}
 nav.slide ul li a:hover {
 color: #ffffff;
}
 nav.slide ul li.name {
 position:relative;
 left:0;
 top:0;
 padding:0 0 15px 15px;
}
 nav.slide ul li.form {
 position:relative;
 left:0;
 top:0;
 padding:0 0 0 15px;
}
 .btn_search {
 display:none;
}
.cat_list li, .login_cat_list li {
 font-size:90%;
 margin:0;
 padding:0;
 display:inline-block;
 border:none;
}
.cat_list li:after, .login_cat_list li:after {
 content:"｜"
}
 .qr {
 display:none;
}
 .top_content_listbox, .ranking_list, .loginform {
display:block;
}
.item_list li a img {
 width:50px;
 height:50px;
}
 .login_wrapper {
 width:100%;
 margin:0;
}
 .title_ranking {
 height:100px;
}
 .title_ranking_text {
 text-align:center;
 z-index:999;
 display:block;
 position:relative;
 -moz-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.86);
-webkit-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.86);
-ms-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.86);
text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.86);
}
.ranking_list div h2 {
 padding:0;
}
.ranking_list div h2 img {
 padding:5px 0;
}
.ranking_list div h2 span {
 margin:0;
 padding:10px 0 0 0;
}
 .btn_r_page {
 margin-top:0;
}
 .ranking_list div {
 padding-bottom:5px;
}
 .ranking_list div, .top_content_listbox div, .top_content_listbox aside, .loginform div {
 width:auto;
}
 .burger {
display: block;
}
 .container {
 position:inherit;
 background-color:none;
 width: 100%;
 margin:0;
 padding:0;
}
.howto li{
	margin:0 0 15px 0;
}
.howto li div{
	display: block;
	margin:0 0 15px 0;
}
.howto li figure{
	display:block;
	width:100%;
	margin:0 0 10px 0;
	}
	
.howto li figure img{
	width:100%;
	display:block;
	padding:1px;
	border:1px solid #cccccc;
	}
	
.howto li p{
	width:100%;
	font-size:90%;
	}

/*-----------------------ログイン後-------------------------------*/

.loginmenu_box {
 display: block;
}
 .loginmenu_box div {
 width:100%;
 margin:0 0 30px 0;
}
 .form_temp dd .text1 {
 font-size:100%;
 width:97%;
}
 .form_temp dd .select1 {
 font-size:100%;
}
 .form_temp dd .textarea1 {
 font-size:100%;
 width:97%;
 height:150px;
}

/*  Nav Drawer Layout  */
nav {
position: relative;
}
 nav ul {
 height: 100%;
 overflow-y: auto;
}
nav li {
 display: block;
 float: none;
}
nav li a {
 padding:25px;
 font-size:120%;
 display:block;
}
nav li a.logo {
 display: none;
}
nav li a.active {
 color: #fff;
 background-color: #141e23;
}
nav li a:hover {
 color: #fff;
 background-color: #19252c;
}
nav li:first-child a.active, nav li:first-child a:hover {
border-radius: 10px 0 0 0;
}
 .header-section {
margin-top: 60px;
}

.search_field {
 width:200px;
 font-size:120%;
 margin:0 0 20px 0;
}
 #search_nav li {
 font-size:65%;
}
 .lower_box {
 display: block;
}
.lower_wrapper {
 width: auto;
}
.lower_box aside {
 width: auto;
}
 .top_content_listbox .index_box1 {
 width:100%;
}
 .ranking_list div h2 img {
 height:50px;
}
 .sitelink {
 display:block;
}
 .mg_name h1 {
 font-size:120%;
 margin:0 0 5px 0;
}
.mg_name h1 span {
 margin:0 0 5px 0;
}
.mg_header img {
 width:50px;
 height:50px;
 display:block;
 padding:1px;
 border:1px solid #cccccc;
}
 .mg_regist_form {
 width:100%;
 margin:0 0 30px 0;
}
.mg_table {
 width:100%;
 font-size:85%;
}
 .mg_table th, .mg_table td {
 padding:5px;
}
.mg_table th {
 width:20%;
}

 .mg_regist_form span.radio_box {
 display:block;
 margin:25px 0;
 text-align:center;
}
.mg_regist_form .mailform {
 width:100%;
 padding:0;
}
 .mg_regist_form .btn_submit {
 width:100%;
 margin:0;
 padding:10px 0;
}


/* NAVIGATION ANNIMATION */
nav {
 width: 93%;
 height: 100%;
 position: fixed;
 left: 0;
 top: 0;
 margin: 0;
 background-color: #1d2d35;
 border-radius: 0;
opacity: 0;
 -webkit-transform: translate3d(5%, 0, 0)scale(.97);
 -moz-transform: translate3d(5%, 0, 0)scale(.97);
 transform: translate3d(5%, 0, 0)scale(.97);
}

/*Nav Expanding Open Effect*/
nav.open {
 opacity: 1;
 -webkit-transform: translate3d(0, 0, 0)scale(1);
 -webkit-animation: slideIn .35s ease-in-out;
 -moz-transform: translate3d(0, 0, 0)scale(1);
 -moz-animation: slideIn .35s ease-in-out;
 transform: translate3d(0, 0, 0)scale(1);
 animation: slideIn .35s ease-in-out;
}
@-webkit-keyframes slideIn {
 0% {
opacity: .3;
 -webkit-transform: translate3d(5%, 0, 0)scale(.97);
}
 100% {
opacity: 1;
 -webkit-transform: translate3d(0, 0, 0)scale(1);
}
}
@-moz-keyframes slideIn {
 0% {
opacity: .3;
 -moz-transform: translate3d(5%, 0, 0)scale(.97);
}
 100% {
opacity: 1;
 -moz-transform: translate3d(0, 0, 0)scale(1);
}
}
@keyframes slideIn {
 0% {
opacity: .3;
 transform: translate3d(5%, 0, 0)scale(.97);
}
 100% {
opacity: 1;
 transform: translate3d(0, 0, 0)scale(1);
}
}

/*Nav Shrinking Closed Effect*/
nav.close {
 opacity:0;
 -webkit-transform: translate3d(5%, 0, 0)scale(.97);
 -webkit-animation: slideOut .3s ease-in-out;
 -moz-transform: translate3d(5%, 0, 0)scale(.97);
 -moz-animation: slideOut .3s ease-in-out;
 transform: translate3d(5%, 0, 0)scale(.97);
 animation: slideOut .3s ease-in-out;
}
@-webkit-keyframes slideOut {
 0% {
opacity: 1;
 -webkit-transform: translate3d(0, 0, 0)scale(1);
}
 100% {
opacity: .3;
 -webkit-transform: translate3d(5%, 0, 0)scale(.97);
}
}
@-moz-keyframes slideOut {
 0% {
opacity: 1;
 -moz-transform: translate3d(0, 0, 0)scale(1);
}
 100% {
opacity: .3;
 -moz-transform: translate3d(5%, 0, 0)scale(.97);
}
}
@keyframes slideOut {
 0% {
opacity: 1;
 transform: translate3d(0, 0, 0)scale(1);
}
 100% {
opacity: .3;
 transform: translate3d(5%, 0, 0)scale(.97);
}
}



/* CONTENT ANNIMATION */
.content {
	/* starting point */
	-webkit-transform: translate3d(0, 0, 0);
 -moz-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0);
 z-index: 1;
}

/*Content Sliding Open Effect*/
header.open, .content.open {
 -webkit-transform: translate3d(240px, 0, 0);
 -webkit-animation: open .5s ease-in-out;
 -moz-transform: translate3d(240px, 0, 0);
 -moz-animation: open .5s ease-in-out;
 transform: translate3d(240px, 0, 0);
 animation: open .5s ease-in-out;
}
@-webkit-keyframes open {
 0% {
-webkit-transform: translate3d(0, 0, 0);
}
 70% {
-webkit-transform: translate3d(260px, 0, 0);
}
 100% {
-webkit-transform: translate3d(240px, 0, 0);
}
}
@-moz-keyframes open {
 0% {
-moz-transform: translate3d(0, 0, 0);
}
 70% {
-moz-transform: translate3d(260px, 0, 0);
}
 100% {
-moz-transform: translate3d(240px, 0, 0);
}
}
@keyframes open {
 0% {
transform: translate3d(0, 0, 0);
}
 70% {
transform: translate3d(260px, 0, 0);
}
 100% {
transform: translate3d(240px, 0, 0);
}
}

/*Content Sliding Closed Effect*/
header.close, .content.close {
 -webkit-transform: translate3d(0, 0, 0);
 -webkit-animation: close .3s ease-in-out;
 -moz-transform: translate3d(0, 0, 0);
 -moz-animation: close .3s ease-in-out;
 transform: translate3d(0, 0, 0);
 animation: close .3s ease-in-out;
}
@-webkit-keyframes close {
 0% {
-webkit-transform: translate3d(240px, 0, 0);
}
 100% {
-webkit-transform: translate3d(0, 0, 0);
}
}
@-moz-keyframes close {
 0% {
-moz-transform: translate3d(240px, 0, 0);
}
 100% {
-moz-transform: translate3d(0, 0, 0);
}
}
@keyframes close {
 0% {
transform: translate3d(240px, 0, 0);
}
 100% {
transform: translate3d(0, 0, 0);
}
}
}

@media only screen and (max-width: 500px) {
.spimg img{
	width:100%;
}