﻿@charset "UTF-8";
/**
 :一行説明 "「コンテンツ名」 スタイル設定";
 :作成日 "2013-XX-XX";
*/

/* --------------------------------
	 全体レイアウト（支援コンテンツ 共通）
-------------------------------- */

body {
	position: relative;
}
#main{
	font-size: 75%;
	line-height: 1.5;
}
#main img ,#main input {
	vertical-align: bottom;
}


/* --------------------------------
	 支援コンテンツ 共通パーツ
-------------------------------- */

#main p.toPageTop{
	margin-top: 2em;
	padding-bottom: 1em;
	padding-top: 1em;
	clear: both;
	text-align: right;
}
#main div.section p.toPageTop{
	margin-bottom: 2em;
}
#main p.toPageTop a{
	background: url(../../images/share/icon12.gif) no-repeat right center;
	padding-right: 16px;
}
#main p.toPageTop a.toCatTop{
	background: url(../../images/share/icon05.gif) no-repeat right center;
}


/* --------------------------------
	 btn.css無効
-------------------------------- */

a.btn01,
button.btn01,
input.btn01 {
	border-radius:25px;
	border:1px solid #3088f3;
	padding:0;
	background-image:none;
	background:none;
	background:-moz-none;
	background:-webkit-none;
	background-color:#fff;
	color:#3088f3;
	cursor:pointer;
	font-weight: 300 !important;
}

a.btn01:hover,
a.btn01:active,
a.btn01:focus,
button.btn01:hover,
button.btn01:active,
button.btn01:focus,
input.btn01:hover,
input.btn01:active,
input.btn01:focus {
	background-image:none;
	background:none;
	background:-moz-none;
	background:-webkit-none;
	background-color: #FFF;
	text-decoration:none !important;
}



/* ↓ここから各コンテンツ用スタイル
--------------------------------------------- */

/*
--------------------------------------------- */
.sp__only { display: none; }

#main {
	width: 960px;
}
#main.no-result {
	width: 1130px !important;
	margin: 0 auto;
}
.conts {
	width: 1000px;
	margin: 0 -20px 0 -20px;
}

.conts p {
	font-size: 14px;
}

.conts__lead {
	margin-bottom: 40px;
	font-weight: bold;
	text-align: center;
	line-height: 1.8;
}

.conts__lead .term {
	color: #ff6e16;
}

.float__left {
	float: left;
}

.float__right {
	float: right;
}

.align__left {
	text-align: left;
}

.align__center {
	text-align: center;
}

.align__right {
	text-align: right;
}

.btn01 {
	font-weight: bold;
}

.btn01.size01 {
	padding: 6px 0;
}
a.btn01:hover{
	opacity:.8;
}
.btn01.size02 {
	font-size: 14px;
	/*margin-bottom: 10px;*/
	background-color: #fff;
	min-width: 200px;
	min-height: 43px;
	padding: 12px 20px;
	text-align: center;
	text-decoration: none;
	/*box-shadow: 0 0 5px 0 rgba(0, 0, 0, .25);*/
}
a.btn01.em {
	background: #ff8b0f;
	border-radius: 25px;
	/*box-shadow: 0 0 5px -1px rgba(0, 0, 0, .5);*/
	transition: opacity .2s;
	color: #fff;
	font-weight: normal;
	padding: 10px;
	width: 200px;
	margin-bottom: 10px;
}
a.btn01.em2 {
	background: #00abeb;
	border-radius: 25px;
	/*box-shadow: 0 0 5px -1px rgba(0, 0, 0, .5);*/
	transition: opacity .2s;
	color: #fff;
	font-weight: normal;
	padding: 6px;
	width: 170px;
}
.btn01.em3{
	background-color: #fff;
	/*box-shadow: 0 0 5px -1px rgba(0, 0, 0, .5);*/
	color: #06c;
	text-decoration: none;
	transition: color .2s;
	background-image: none;
	font-weight: normal;
	border-radius: 25px;
	border: none;
	padding: 6px;
	width: 170px;
}
a.btn01.em2:hover {
	opacity: .8;
}

.btn01.size03 {
	padding: 4px 0;
	font-size: 12px;
	line-height: 1.2;
}

.btn01.size04 {
	position: relative;
	padding: 12px 80px 12px 60px;
	font-size: 16px;
}

.btn01.size04:after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 26px;
	width: 15px;
	height: 8px;
	margin-top: -4px;
	background: url(../img/pc_icn_arw_01.png) no-repeat;
}

.btn01.size04:hover:after {
	background-image: url(../img/pc_icn_arw_02.png);
}
.btn .btn03 {
	background: #006bcd;
	border-radius: 25px;
	box-shadow: 0 0 5px 0 rgb(0 0 0 / 25%);
	transition: opacity .2s;
	color: #fff;
	font-weight: normal;
	min-height: 43px;
	padding: 12px 20px;
	width: 100%;
	transition: background .2s;
	-webkit-transition: background .2s;
}
.btn a.btn03:hover {
	background: #0186ff;
}

/*
--------------------------------------------- */
.conts .mv {
	height: 170px;
	margin-bottom: 40px;
	background: url(../img/pc_mv_pct_01.jpg) no-repeat;
}

.conts .mv__ttl {
	display: table-cell;
	vertical-align: middle;
	width: 1000px;
	height: 170px;
	font-weight: bold;
	text-align: center;
	color: #fff;
}

.conts .mv__ttl dl > * {
	display: inline-block;
}

.conts .mv__ttl .tag {
	position: relative;
	top: -2px;
	margin-right: 15px;
	padding: 2px 12px;
	font-size: 15px;
	color: #010101;
	border-radius: 3px;
	background: #f1ff16;
}

.conts .mv__ttl .txt-1 {
	font-size: 22px;
}

.conts .mv__ttl .txt-2 {
	font-size: 26px;
	color: #f1ff16;
}

.error {
	color: #848484;
	font-size: 	50px;
	font-weight: bold;
	text-align: center;
}

.error a {
    background: #fff;
    border: 1px solid #b0b0b0;
    color: #3088f3;
    align-items: center;
    border-radius: 25px;
    cursor: pointer;
    display: inline-flex;
    font-size: 14px;
    justify-content: center;
    height: 30px;
    min-width: 160px;
    padding: 4px 8px;
    text-align: center;
    transition: background .2s;
}

.error a:hover,
.error a:active,
.error a:focus {
	opacity: .8 !important;
    /*color: #349eff;
    border: 1px solid #b0b0b0;*/
    text-decoration: none;
}


/*
--------------------------------------------- */
.conts .loginbox {
	border-radius: 6px;
	background: #f3f7d9;
}

.conts .loginbox,
.conts .loginbox p {
	font-size: 12px;
}

.conts .loginbox .loginArea {
	background: #e2e6ca;
	border-radius: 0 0 6px 6px;
}


/*
--------------------------------------------- */
.entry_ranking {
	border-top: 1px solid #d9d9d9;
}

.entry_ranking__header {
	margin: 1px 0;
	padding: 14px 0;
	text-align: center;
	/* background: #f2f2f2; */
}

.entry_ranking__header .cell {
	display: inline-block;
}

.entry_ranking__header .cell + .cell,
.entry_ranking__header .item + .item {
	margin-left: 30px;
}

.entry_ranking__header .item {
	display: inline-block;
	vertical-align: middle;
	font-size: 12px;
	color: #0066cc;
}

.entry_ranking__header .item label {
	cursor: pointer;
}

.entry_ranking__header .item input[type=checkbox] {
	margin-right: 10px;
}

.entry_ranking__header .btn01.small {
	padding: 5px 20px 6px;
	font-size: 12px;
	box-shadow: 0 0 5px -1px rgba(0, 0, 0, .5);
	background: #fff;
	border-radius: 3px;
}

.entry_ranking__block {
	border-top: 1px solid #d9d9d9;
}

.entry_ranking__group.hidden {
	display: none;
}

.entry_ranking__group:first-child .entry_ranking__box:nth-of-type(-n+5) {
	background: #ffffed;
}

.entry_ranking__box {
	border-bottom: 2px solid #dedede;
}

.entry_ranking__box > * {
	display: table-cell;
	vertical-align: middle;
	box-sizing: border-box;
}

.entry_ranking__box .cell-1 {
	position: relative;
	width: 115px;
	padding: 0 0 0 20px;
	border-right: 1px dotted #b3b3b3;
}

.entry_ranking__box .cell-2 {
	width: 885px;
	padding: 20px 20px 20px 30px;
}

.entry_ranking__box .cell-3 {
	width: 170px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.entry_ranking__box .cell-1 label {
	display: block;
	padding: 20px 0;
	cursor: pointer;
}

.entry_ranking__box .cell-1 input {
	position: relative;
	top: -.5em;
}

.entry_ranking__box .cell-1 span {
	display: inline-block;
	width: 70px;
	font-size: 20px;
	font-weight: bold;
	text-align: center;;
	color: #595959;
}

.entry_ranking__box.ranking-1 .cell-1 input,
.entry_ranking__box.ranking-2 .cell-1 input,
.entry_ranking__box.ranking-3 .cell-1 input {
	top: -1.6em;
}

.entry_ranking__box.ranking-1 .cell-1 span { color: #959a1e; }
.entry_ranking__box.ranking-2 .cell-1 span { color: #808080; }
.entry_ranking__box.ranking-3 .cell-1 span { color: #ba9577; }

.entry_ranking__box.ranking-1 .cell-1 span:before,
.entry_ranking__box.ranking-2 .cell-1 span:before,
.entry_ranking__box.ranking-3 .cell-1 span:before {
	content: '';
	display: block;
	width: 24px;
	height: 20px;
	margin: 0 auto 5px;
}

.entry_ranking__box.ranking-1 .cell-1 span:before {background: url(../img/sp_icn_ranking_01.png) no-repeat;width: 37px;height: 29px;margin: 0 auto;}
.entry_ranking__box.ranking-2 .cell-1 span:before { background: url(../img/sp_icn_ranking_02.png) no-repeat;width: 37px;height: 29px;margin: 0 auto;}
.entry_ranking__box.ranking-3 .cell-1 span:before { background: url(../img/sp_icn_ranking_03.png) no-repeat;width: 37px;height: 29px;margin: 0 auto;}

.entry_ranking__box .cell-2 > * {
	display: table-cell;
	/*vertical-align: top;*/
	vertical-align: middle;
}

.entry_ranking__box .pct {
	padding-right: 30px;
}

.entry_ranking__box .info {
	width: 475px;
	padding-right: 30px;
}

.entry_ranking__box .info .name {
	margin: 5px 0 20px;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.7;
	color: #0066cc;
}

.entry_ranking__box .list__tag li {
	display: inline-block;
	vertical-align: top;
	margin-right: 6px;
	padding: 3px 6px;
	font-size: 12px;
	font-weight: bold;
	border: 1px solid;
	border-radius: 2px;
	background: #fff;
}

.entry_ranking__box .list__tag .tag-1 {
	color: #0096cc;
	border-color: #118bb8;
}

.entry_ranking__box .list__tag .tag-2 {
	color: #7cae1d;
	border-color: #7cae1d;
}

.entry_ranking__box .btn__wrap {
	vertical-align: middle;
	width: 146px;
}

.entry_ranking__box .btn__wrap .btn + .btn {
	margin-top: 10px;
}

.entry_ranking__box .cell-3 .btn {
	margin-right: 25px;
}

.entry_ranking__box .cell-3 .btn + .btn {
	margin-top: 15px;
}

.entry_ranking__more {
	padding: 1px 0;
	text-align: center;
	border-bottom: 1px solid #dedede;
}

.entry_ranking__more .btn__more {
	padding: 20px 0;
	background: #e5f6fd;
}

.ranking__conts .toPageTop {
	display: none !important;
}

.toPageTop {
	position:absolute;
	bottom:20px;
	right:15px;
	z-index:100;
}
.toPageTop a {
	position:relative;
	display:block;
	height:50px;
	width:50px;
	background:#00abeb;
	border-radius:50%;
	color:transparent;
	font-size:0;
}
.toPageTop a:after,
.toPageTop a:before{
	position:absolute;
	bottom:0;
	right:0;
	top:2px;
	content:"";
	display:block;
	height:2px;
	width:13px;
	margin:auto;
	background:#fff;
	border-radius:2px;
}
.toPageTop a:before{
	left:-8px;
	transform:rotate(134deg);
	-webkit-transform:rotate(134deg);
}
.toPageTop a:after{
	left:8px;
	transform:rotate(-134deg);
	-webkit-transform:rotate(-134deg);
}

@media screen and (min-width:767px){
	.toPageTop{
		position:absolute;
		bottom:86px;
		right:50px;
	}
	.toPageTop a{
		position:relative;
		display:block;
		height:70px;
		width:70px;
		background:#00abeb;
		border-radius:50%;
		color:transparent;
		font-size:0;
		transition:background .2s;
		-webkit-transition:background .2s;
	}
	.toPageTop a:after,
	.toPageTop a:before{
		position:absolute;
		bottom:0;
		right:0;top:2px;
		content:"";
		display:block;
		height:4px;
		width:22px;
		margin:auto;
		background:#fff;
		border-radius:2px;
	}
	.toPageTop a:before{
		left:-12px;
		transform:rotate(134deg);
		-webkit-transform:rotate(134deg);
	}
	.toPageTop a:after{
		left:13px;
		transform:rotate(-134deg);
		-webkit-transform:rotate(-134deg);
	}
	.toPageTop a:active,
	.toPageTop a:focus,
	.toPageTop a:hover{
		background:#1fc2ff;
	}
}
.js-scroll-top{
	opacity:1;
	transition:opacity .5s;
	-webkit-transition:opacity .5s;
}
.js-scroll-top.is-hidden{
	opacity:0;
}
.js-scroll-top.is-fixed{
	position:fixed;
	bottom:68px;
}

/* --------------------------------
	 印刷用（支援コンテンツ 共通）
-------------------------------- */
@media print{
	html,body{
		background:#FFF;
	}
	#header,#footer,#secondary,#topicpathArea{
		display:none;
	}
	#main{
		padding: 0;
	}
	#primary{
		float: none;
		margin: 0 auto;
	}
}
