@charset "UTF-8";


/* indexlayout ---------------------------------------*/

.l-indextop{padding-top:32px;}
.l-indextop-main{width: 928px;}
.l-indextop-side{width: 232px;}
.l-indexfeature-half-1{
	width: 408px;
	padding-right: 24px;
}

.l-indexfeature-half-2{
	width: 431px;
	padding-left: 24px;
	border-left: 1px solid #dbdbdb;
}

.l-indexfeature-half-3{width: 560px;}
.l-indexfeature-half-4{width: 240px;}

.l-half-1 {
	width: calc(43% + 24px);
}
.l-half-2 {
	width: calc(53% + 24px);
}

/* toppickup ---------------------------------------*/

.toppickup a{display: block;}

.toppickup-image{
	margin-bottom: 10px;
	width: 100%;
	height: 263px;
	position:relative;
	overflow: hidden;
}

.toppickup-image img{
	width: 100%;
	height: 263px;
	object-fit: cover;
	font-family: 'object-fit: cover;';
}

.toppickup-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	border:1px solid #dbdbdb;
	width:100%;
	height:100%;
	box-sizing:border-box;
	z-index: 1;
}

.toppickup-detail{overflow: hidden;}

.toppickup .title-section,
.toppickup .title-block{color:#484848;}

.toppickup-shoulder,
.toppickup-shoulder-nolink{
	font-weight:600;
	font-size: 2.0rem;
	line-height: 1.5;
	color: #767676;
}

.toppickup-shoulder:hover{text-decoration: underline;}

.toppickup-title{
	font-weight:600;
	font-size: 3.2rem;
	line-height: 1.5;
	color: #484848;
}

.is-center .toppickup-title{
	font-size: 3.2rem;
}

a:hover .toppickup-title{text-decoration: underline;}


/* toppickuplist ---------------------------------------*/

.toppickuplist > li{border-top: solid 1px #dbdbdb;}
.toppickuplist > li:first-child{border-top:none;}

.toppickuplist > li a{
	display: block;
	padding: 10px 0;
}

.toppickuplist-item{overflow: hidden;}

.toppickuplist-image{
	float: right;
	width: 96px;
	height: 64px;
	margin-left: 20px;
	position: relative;
}

.toppickuplist-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	border:1px solid #dbdbdb;
	width:100%;
	height:100%;
	box-sizing:border-box;
	z-index: 1;
}

.toppickuplist-image img{
	object-fit: cover;
	font-family: 'object-fit: cover;';
	width: 96px;
	height: 64px;
}

.toppickuplist-detail{overflow: hidden;}

.toppickuplist-shoulder,
.toppickuplist-shoulder-nolink{
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.5;
	color: #767676;
}

.toppickuplist-shoulder:hover{text-decoration: underline;}

.toppickuplist-item-more{display: none;}

.toppickuplist-title{
	color: #484848;
	font-weight:600;
	font-size: 1.5rem;
	line-height: 1.53;
	margin-bottom: 5px;
/*
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
*/
}

.toppickuplist > li a:hover .toppickuplist-title{text-decoration: underline;}

.toppickup-btn{
	border-top: 1px solid #dbdbdb;
	text-align:center;
	padding-top: 24px;
}

.toppickup-btn small{
	font-size:1.0rem;
	color: #767676;
	display: block;
	line-height: 1.5;
	padding-top: 12px;
}

.toppickuplist.is-ranking .toppickuplist-item{
	padding-left: 40px;
	position: relative;
}

.toppickuplist-ranking-num{
	position: absolute;
	left: -5px;
	top: 0px;
	color: #A8A8A8;
	font-size:1.8rem;
	line-height:1.0;
	width: 30px;
	text-align: right;
	letter-spacing: -1px;
	font-family:Roboto;
}

/* toprecommend ---------------------------------------*/

.toprecommend > li{border-top: solid 1px #dbdbdb;}
.toprecommend > li:first-child{border-top:none;}

.toprecommend > li a{
	display: block;
	padding: 12px 0;
}

.toprecommend-item{overflow: hidden;}

.toprecommend-image{
	float: right;
	width: 64px;
	height: 64px;
	margin-left: 10px;
	position: relative;
}

.toprecommend-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	border:1px solid #dbdbdb;
	width:100%;
	height:100%;
	box-sizing:border-box;
	z-index: 1;
}

.toprecommend-image img{
	object-fit: cover;
	font-family: 'object-fit: cover;';
	width: 64px;
	height: 64px;
}

.toprecommend-detail{overflow: hidden;}

.toprecommend-shoulder{
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.5;
	color: #767676;
}

.toprecommend-shoulder:hover{text-decoration: underline;}

.toprecommend-item-more{display: none;}

.toprecommend-title{
	color: #484848;
	font-weight:600;
	font-size: 1.5rem;
	line-height: 1.53;
	margin-bottom: 5px;
}

.toprecommend > li a:hover .toprecommend-title{text-decoration: underline;}


/* topflashlist ---------------------------------------*/
.topflashlist {
	overflow: hidden;
	height: 500px;
}
.topflashlist li{border-top: solid 1px #dbdbdb;}
.topflashlist li:first-child{border-top:none;}

.topflashlist li a{
	display: block;
	padding: 10px 0;
}

.topflashlist-item{overflow: hidden;}

.topflashlist-detail{overflow: hidden;}

.topflashlist-shoulder,
.topflashlist-shoulder-nolink{
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.5;
	color: #767676;
}

.topflashlist-shoulder:hover{text-decoration: underline;}

.topflashlist-title{
	color: #484848;
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.53;
	margin-bottom: 5px;
}

.topflashlist li a:hover .topflashlist-title{text-decoration: underline;}

.topflashlist-btn{
	text-align:center;
}

.topflashlist-btn a{
	font-size:1.2rem;
	color: #0078C6;
	display: inline-block;
	line-height: 1.5;
	padding-top: 12px;
}

.topflashlist-btn a:hover {
	text-decoration: underline;
}

.topflashlist.is-ranking .topflashlist-item{
	padding-left: 40px;
	position: relative;
}

.topflashlist .articletag-date {
	margin:0 0 4px;
	color: #B42121;
	font-weight: 600;
}

/* topremarkable ---------------------------------------*/

.topremarkable-title-sub{
	vertical-align: middle;
	margin-left: 16px;
	font-size:1.2rem;
	color:#7c7c7c;
	font-weight:300;
	line-height: 1.67;
	position: relative;
	top: -2px;
}

.topremarkable a{display: block;}
.topremarkable-image{margin-bottom: 10px;}

.topremarkable-image img{
	object-fit: cover;
	font-family: 'object-fit: cover;';
	width: 384px;
	height: 256px;
}

.topremarkable-detail{overflow: hidden;}

.topremarkable .title-section,
.topremarkable .title-block{color:#484848;}

.topremarkable-title{
	font-weight:600;
	font-size: 1.6rem;
	line-height: 1.53;
	color: #484848;
}

a:hover .topremarkable-title{text-decoration: underline;}


/* topremarkablelist ---------------------------------------*/

.topremarkablelist{
	width:100%;
	display:flex;
	flex-wrap:wrap;
}

.topremarkablelist > li{
	border-top: solid 1px #dbdbdb;
	width: 404px;
}

.topremarkablelist > li:nth-child(2n){
	margin-left:32px;
}

.topremarkablelist > li:first-child,
.topremarkablelist > li:nth-child(2){
	border-top:none;
}

.topremarkablelist > li a{
	display: block;
	padding: 12px 0;
}

.topremarkablelist > li:first-child a,
.topremarkablelist > li:nth-child(2) a{
	padding-top: 0;
}

.topremarkablelist > li:nth-child(3) a,
.topremarkablelist > li:nth-child(4) a{
	padding-bottom: 0;
}

.topremarkablelist li > * {padding:12px 0;}
.topremarkablelist li:first-child > *,
.topremarkablelist li:nth-child(2) > * {padding-top:0;}
.topremarkablelist li:nth-child(3) > *,
.topremarkablelist li:nth-child(4) > * {padding-bottom:0;}

.topremarkablelist-item{overflow: hidden;}

.topremarkablelist-image{
	float: left;
	width: 144px;
	height: 96px;
	margin-right: 16px;
	position: relative;
}

.topremarkablelist-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	border:1px solid #dbdbdb;
	width:100%;
	height:100%;
	box-sizing:border-box;
	z-index: 1;
}

.topremarkablelist-image img{
	object-fit: cover;
	font-family: 'object-fit: cover;';
	width: 144px;
	height: 96px;
}

.topremarkablelist-detail{overflow: hidden;}

.topremarkablelist-title{
	color: #484848;
	font-weight:600;
	font-size: 1.6rem;
	line-height: 1.53;
	margin-bottom: 5px;
}

.topremarkablelist > li a:hover .topremarkablelist-title{text-decoration: underline;}


/* topmemberremarkable ---------------------------------------*/

.topmemberremarkable{
	display:flex;
	flex-wrap:wrap;
	margin-bottom: 28px;
}

.topmemberremarkable-title-icon{
	padding-right:36px;
	display:inline-block;
	position: relative;
}

.topmemberremarkable-title-icon::after{
	content:'';
	position: absolute;
	right: 0;
	top: 2px;
	background: url('../../../images/v2/common/icon_key.svg') 0 0 no-repeat;
	background-size: 100%;
	width:22px;
	height:22px;
}

.topmemberremarkable > li{
	width: 264px;
	margin-left: 32px;
}

.topmemberremarkable > li:nth-child(2n+1){margin-left: 0;}
.topmemberremarkable > li a{display: block;}
.topmemberremarkable-detail{padding: 0 0 0;}

.topmemberremarkable-image{
	position: relative;
	width: 264px;
	height: 176px;
	margin-bottom: 12px;
}

.topmemberremarkable-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	border:1px solid #dbdbdb;
	width:100%;
	height:100%;
	box-sizing:border-box;
	z-index: 1;
}

.topmemberremarkable-image img{
	object-fit: cover;
	font-family: 'object-fit: cover;';
	width: 264px;
	height: 176px;
}

.topmemberremarkable-title{
	font-weight:600;
	font-size: 1.6rem;
	line-height: 1.5;
	color: #484848;
	margin-bottom: 2px;
}

.topmemberremarkable > li a:hover .topmemberremarkable-title{text-decoration: underline;}


/* topmemberremarkablelist ---------------------------------------*/

.topmemberremarkablelist{
	display:flex;
	flex-wrap:wrap;
}

.topmemberremarkablelist > li{
	border-top: solid 1px #dbdbdb;
	width: calc(50% - 16px);
}

.topmemberremarkablelist > li:first-child,
.topmemberremarkablelist > li:nth-child(2){border-top:none;}
.topmemberremarkablelist > li:nth-child(2n){margin-left: 32px;}

.topmemberremarkablelist > li a{
	display: block;
	padding: 16px 0;
}

.topmemberremarkablelist > li:first-child a,
.topmemberremarkablelist > li:nth-child(2) a{padding-top: 0;}
.topmemberremarkablelist > li:last-child a{padding-bottom: 0;}
.topmemberremarkablelist-item{overflow: hidden;}

.topmemberremarkablelist-image{
	float: left;
	width: 94px;
	height: 62px;
	margin-right: 12px;
	position: relative;
	overflow: hidden;
}

.topmemberremarkablelist-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	border:1px solid #dbdbdb;
	width: 100%;
	height: 100%;
	box-sizing:border-box;
	z-index: 1;
}

.topmemberremarkablelist-image img{
	object-fit: cover;
	font-family: 'object-fit: cover;';
	width: 94px;
	height: 62px;
}

.topmemberremarkablelist-detail{overflow: hidden;}

.topmemberremarkablelist-title{
	color: #484848;
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.5;
	margin-bottom: 2px;
}

.topmemberremarkablelist > li a:hover .topmemberremarkablelist-title{text-decoration: underline;}


/* toptile ---------------------------------------*/

.toptile{margin-bottom: 40px;}

.toptile > li{
	width: 240px;
	margin-left: 32px;
}

.toptile > li:nth-child(2n+1){margin-left: 0;}
.toptile > li a{display: block;}
.toptile-detail{padding: 0 0 0;}

.toptile-image{
	position: relative;
	width: 240px;
	margin-bottom: 12px;
	overflow: hidden;
}

.is-movie .toptile-image{height:126px;}
.is-photo .toptile-image{height:160px;}

.toptile-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	border:1px solid #dbdbdb;
	width:100%;
	height:100%;
	box-sizing:border-box;
	z-index: 1;
}

.is-movie .toptile-image img{
	object-fit: cover;
	font-family: 'object-fit: cover;';
	width: 240px;
	height: 126px;
}

.is-photo .toptile-image img{
	object-fit: cover;
	font-family: 'object-fit: cover;';
	width: 240px;
	height: 160px;
}

.toptile-title{
	font-weight:600;
	font-size: 1.6rem;
	line-height: 1.5;
	color: #484848;
	margin-bottom: 2px;
}

.toptile > li a:hover .toptile-title{text-decoration: underline;}


/* toprelatedservice ---------------------------------------*/

.toprelatedservice{
	display:flex;
	flex-wrap:wrap;
}

.toprelatedservice > li{
	border-top: solid 1px #dbdbdb;
	width: calc(33.3333% - 16px);
	margin-left: 24px;
}

.toprelatedservice > li:nth-child(1),
.toprelatedservice > li:nth-child(2),
.toprelatedservice > li:nth-child(3){
	border-top:none;
}

.toprelatedservice > li:nth-child(3n + 1){margin-left: 0px;}

.toprelatedservice > li a{
	display: block;
	padding: 12px 0;
}

.toprelatedservice-item{overflow: hidden;}

.toprelatedservice-image{
	float: left;
	width: 64px;
	height: 64px;
	margin-right: 16px;
	position: relative;
	overflow: hidden;
}

.toprelatedservice-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	width:100%;
	height:100%;
	box-sizing:border-box;
	z-index: 1;
}

.toprelatedservice-image img{
	position:absolute;
	left:0%;
	top:50%;
	transform:translate(0%,-50%);
	width: 100%;
}

.toprelatedservice-detail{overflow: hidden;}

.toprelatedservice-title{
	color: #484848;
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.5;
}

.toprelatedservice > li a:hover .toprelatedservice-title{text-decoration: underline;}

.toprelatedservice-text{
	color: #767676;
	font-weight: 300;
	font-size: 1.2rem;
	line-height: 1.5;
}


/* topmember ---------------------------------------*/

.topmember{
	display:flex;
	flex-wrap:wrap;
	margin-bottom: 32px;
}

.topmember > li{
	width: calc(50% - 12px);
	margin-left: 12px;
	text-align: center;
	margin-bottom: 16px;
}

.topmember > li:nth-child(2n+1){margin-left: 0;}

.topmember > li a{
	display: block;
}

.topmember-item{
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.16);
	background-color: #f8f8f8;
	height: 164px;
	position: relative;
}

.topmember-detail{padding: 20px 5px 0;}

.topmember-shoulder{
	font-weight: 300;
	font-size: 1.2rem;
	line-height: 1.5;
	color: #002b48;
	margin-bottom: 5px;
}

.topmember-title{
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.5;
	color: #484848;
	margin-bottom: 5px;
}

.topmember > li a:hover .topmember-title{text-decoration: underline;}
.topmember-image{position: relative;}
.topmember-image img{width:96px;}

.topmember-premium{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	background-color: #002b48;
	font-size: 1.1rem;
	color: #fff;
	text-align: center;
	line-height: 1.5;
	padding: 3px 0;
	font-weight:600;
}


/* toppopular ---------------------------------------*/

.toppopular{margin-bottom: 42px;}
.toppopular > li{border-top: solid 1px #dbdbdb;}
.toppopular > li:nth-child(1){border-top:none;}

.toppopular > li a{
	display: block;
	padding: 12px 0;
}

.toppopular-item{overflow: hidden;}

.toppopular-image{
	float: left;
	width: 64px;
	height: 64px;
	margin-right: 16px;
	position: relative;
	overflow: hidden;
}

.toppopular-image::before{
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	width:100%;
	height:100%;
	box-sizing:border-box;
	z-index: 1;
}

.toppopular-image img{
	position:absolute;
	left:0%;
	top:50%;
	transform:translate(0%,-50%);
	width: 100%;
}

.toppopular-detail{overflow: hidden;}

.toppopular-shoulder{
	color: #484848;
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.5;
}

.toppopular-title{
	color: #767676;
	font-weight: 300;
	font-size: 1.2rem;
	line-height: 1.5;
	position: relative;
}

.toppopular > li a:hover .toppopular-title{text-decoration: underline;}


.toppopular-title.is-limited::after{
	display: inline-block;
	content:'';
	background:url('../../../images/v2/common/icon_key.svg') no-repeat left center;
	background-size:100%;
	width:16px;
	height:16px;
	margin-left: 10px;
	vertical-align: middle;
	position: relative;
	top: -2px;
}


/* topapology ---------------------------------------*/

.topapology li{margin-bottom: 8px;}

.topapology li a{
	display: block;
	background-color: #e2eef5;
	padding: 12px 16px;
}

.topapology-date{
	font-family: Roboto;
	font-size: 1.2rem;
	line-height: 1.57;
	color: #00609e;
	margin-bottom: 4px;
}

.topapology-title{
	font-size: 1.4rem;
	line-height: 1.57;
	color: #00609e;
}

a:hover .topapology-title{text-decoration: underline;}


/* indexbottom ---------------------------------------*/

.l-indexbottom{
	border-top:1px solid #dbdbdb;
	background: #f8f8f8;
	padding: 18px 40px 23px;
}

.indexbottom-inner{
	max-width: 1200px;
	position: relative;
	margin: 0 auto;
}

.indexbottom-nav{margin-top: 15px;}

.indexbottom-nav-title{
	font-weight:600;
	font-size: 1.2rem;
	line-height: 1.5;
	color: #484848;
	margin-bottom: 15px;
}

.indexbottom-nav-list{font-size: 0;}

.indexbottom-nav-list li{
	display: inline-block;
	font-weight: normal;
	font-size: 1.2rem;
	line-height: 1.1;
	margin: 0 15px 15px 0;
	padding-right: 15px;
	border-right: solid 1px #dbdbdb;
}

.indexbottom-nav-list li a{
	color: #484848;
	display: block;
}

.indexbottom-nav-list li:last-child{border-right:none;}
.indexbottom-nav-list li a:hover{text-decoration: underline;}

.indexbottom-nav-list li:first-child a{
	padding-left: 0;
	border-left: none;
}