@charset "utf-8";
/*body{font-family: "ヒラギノ角ゴ Pro N W6"}*/
#Contents img{max-width: 100%;}
div#Contents{background-color:#fff;max-width:750px;margin-top:auto;color:#32363A;}
section{padding: 0;}
/* ===============================
PC共通
===============================*/
@media all and (min-width: 767px) {
	div#Contents{margin-top: 0;}
}

/*font-size指定*/
.fs10{
	font-size: 2.667vw;
}
.fs12{
	font-size: 3.2vw;
}
.fs13{
	font-size: 3.467vw;
}
.fs14{
	font-size: 3.733vw;
}
.fs15{
	font-size: 4vw;
}
.fs18{
	font-size: 4.8vw;
}
.fs20{
	font-size: 5.333vw;
}
.fs24{
	font-size: 6.4vw;
}
.font_bold{
	font-weight: bold;
}
.red{
	color: #EB5F2B;
}
.blue{
	color: #2BA1EB;
}
a.blue{
	color: #2A80B9;
	text-decoration: underline;
}
@media screen and (min-width: 750px){
	.fs10{
		font-size: 20px;
	}
	.fs12{
		font-size: 24px;
	}
	.fs13{
		font-size: 26px;
	}
	.fs14{
		font-size: 28px;
	}
	.fs15{
		font-size: 30px;
	}
	.fs18{
		font-size: 36px;
	}
	.fs20{
		font-size: 40px;
	}
	.fs24{
		font-size: 48px;
	}
}
/*------------*/

a._blank{
	padding-right: 1.2em;
	position: relative;
}
a._blank::after{
	content: '';
	position: absolute;
	background-image: url('/portal/images/icon-outlink.png');
	background-size: contain;
	background-repeat: no-repeat;
	width: 0.7em;
	height: 0.7em;
	right: 0.3em;
	top: 0;
	bottom: 0;
	margin: auto;
}

#KV_area{
	position: relative;
	margin-bottom: 5.33vw;
}
.kv_anchor{
	background-color: #ffffff;
	border-radius: 6px;
	width: 90%;
	line-height: 1;
	margin: auto;
	position: absolute;
	bottom: 5.33vw;
	left: 0;
	right: 0;
}
.kv_anchor p{
	border-bottom: solid 1px #C4CDDC;
	box-sizing: border-box;
	padding: 4vw;
}
.kv_anchor ul{
	box-sizing: border-box;
	padding: 4vw;
}
.kv_anchor ul li{
	margin-bottom: 4vw;
	cursor: pointer;
	position: relative;
}
.kv_anchor ul li:last-of-type{
	margin-bottom: 0;
}
.kv_anchor ul li::before{
	content: '';
	border: 1px solid;
	border-color:  transparent transparent #0c3752 #0c3752;
	transform: rotate(-45deg);
	width: 2vw;
	height: 2vw;
	left: 0.5em;
	position: absolute;
	top: -0.5em;
	bottom: 0;
	margin: auto;
}
.kv_anchor ul li a{
	padding-left: 8vw;
	display: block;
}

@media screen and (min-width: 750px){
	#KV_area{
		border-radius: 12px;
		margin-bottom: 40px;
	}
	.kv_anchor{
		bottom: 40px;
	}
	.kv_anchor p{
		padding: 30px;
	}
	.kv_anchor ul{
		padding: 30px;
	}
	.kv_anchor ul li{
		margin-bottom: 30px;
	}
	.kv_anchor ul li::before{
		width: 15px;
		height: 15px;
	}
	.kv_anchor ul li a{
		padding-left: 60px;
	}
}
@media screen and (min-width: 768px){
	.anchor_box{
		display: block;
		padding-top: 117px;
		margin-top: -117px;
	}
}

#Contents h1{
	background: -moz-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
	background: -webkit-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
	background: linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
	color: #fff;
	line-height: 1;
	width: 100%;
	text-align: center;
	padding: 5.33vw;
}

@media screen and (min-width: 750px){
	#Contents h1{
		padding: 40px;
	}
}

h2{
	background-color: #32363A;
	color: #fff;
	font-weight: normal;
	padding: 4vw;
	line-height: 1;
}

@media screen and (min-width: 750px){
	h2{
		padding: 30px;
	}
}

.mainContents{
	width: 90%;
	margin: 5.33vw auto 10.66vw;
}
.mainContents_inner{
	padding-bottom: 10.67vw;
}
.bottomVector .mainContents_inner{
	padding-bottom: 5px;
}
.mainContents_box{
	background-color: #ECECF6;
	border-radius: 6px 6px 0 0;
	margin-bottom: 5.33vw;
}
.mainContents_box h2{
	border-radius: 6px 6px 0 0;
}
.bottomVector{
	position: relative;
	margin-bottom: 16vw;
}
.bottomVector::after{
	content: '';
	position: absolute;
	border-top: 11.66vw solid #ECECF6;
	border-left: 45vw solid transparent;
	border-right: 45vw solid transparent;
	transition: auto;
}

@media screen and (min-width: 750px){
	.mainContents{
		margin: 40px auto 80px;
	}
	.mainContents_inner{
		padding-bottom: 80px;
	}
	.mainContents_box{
		border-radius: 12px 12px 0 0;
		margin-bottom: 40px;
	}
	.mainContents_box h2{
		border-radius: 12px 12px 0 0;
	}
	.mainContents_box.bottomVector{
		margin-bottom: 120px;
	}
	.bottomVector::after{
		border-top: 87.487px solid #ECECF6;
		border-left: 337.675px solid transparent;
		border-right: 337.675px solid transparent;
	}
}

.chara_outer{
	display: flex;
	width: 90%;
	margin: 5.33vw auto;
	align-items: flex-start;
	justify-content: space-between;
}
.chara_outer p{
	background-color: #fff;
	border-radius: 6px;
	box-sizing: border-box;
	box-shadow: 4px 4px 18px -6px rgba(0,0,0,0.3);
	padding: 4vw 3vw;
	position: relative;
	width: 45.33vw;
	line-height: 1.8;
	text-align: center;
}
.chara_outer p:after{
	border-left: 4.8vw solid #fff;
	border-top: 4.8vw solid transparent;
	content: ' ';
	display: block;
	position: absolute;
	top: 18%;
	right: -9%;
}
.chara_outer img{
	width: 31.2vw;
}

@media screen and (min-width: 750px){
	.chara_outer{
		margin: 40px auto;
	}
	.chara_outer p{
		border-radius: 12px;
		box-shadow: 4px 4px 18px -6px rgba(0,0,0,0.3);
		padding: 30px 22.5px;
		width: 340px;
	}
	.chara_outer p:after{
		border-left: 36px solid #fff;
		border-top: 36px solid transparent;
	}
	.chara_outer img{
		width: 234px;
	}
}

.monthSelect_box{
	display: flex;
	justify-content: space-between;
	width: 90%;
	margin: auto;
}
.monthSelect_inner{
	border-radius: 6px 6px 0 0;
	color: #fff;
	width: 39vw;
	padding: 4.267vw 0;
	position: relative;
	line-height: 1;
	text-align: center;
}
.monthSelect_inner._select{
	background: -moz-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
	background: -webkit-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
	background: linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
}
.monthSelect_inner._select:after{
	border-left: 4.8vw solid linear-gradient(to right,#F67F88 50%,#B9B8F0);
	border-top: 4.8vw solid transparent;
	content: ' ';
	display: block;
	position: absolute;
	bottom: -4.8vw;
	left: 0;
	right: 0;
	margin: auto;
}
.monthSelect_inner._gray{
	color: #32363A;
	background-color: #D8D8D8!important;
	font-weight: normal;
	cursor: pointer;
}
.monthSelect_content{
	background-color: #fff;
	width: 90%;
	margin: 0 auto 5.33vw;
	padding: 5.33vw 2.667vw;
	position: relative;
}
.monthSelect_content._03 li{
	border-bottom: solid 1px #DDDDDD;
	display: flex;
	line-height: 2.8;
	justify-content: space-between;
	align-items: center;
}
.monthSelect_content._03 li .ranking{
	display: inline-block;
	padding-right: 1em;
}
.monthSelect_content._03 li.crown{
	position: relative;
	padding-left: 12vw;
}
.monthSelect_content._03 li.crown p::after{
	content: '';
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	width: 10.667vw;
	height: 9.6vw;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.monthSelect_content._03 li.crown._1st p::after{
	background-image: url('/report/2010/images/icon_1st.png');
}
.monthSelect_content._03 li.crown._2nd p::after{
	background-image: url('/report/2010/images/icon_2nd.png');
}
.monthSelect_content._03 li.crown._3rd p::after{
	background-image: url('/report/2010/images/icon_3rd.png');
}
.monthSelect_content._03 li:nth-of-type(1){
	border-bottom: solid 1px #EBB72B;
}
.monthSelect_content._03 li:nth-of-type(2){
	border-bottom: solid 1px #6B757A;
}
.monthSelect_content._03 li:nth-of-type(3){
	border-bottom: solid 1px #855B2D;
}
.monthSelect_content._03 li .line_height{
	line-height: 1.3;
}
.monthSelect_content_inner{
	position: relative;
}
._01 ._01_box1{
	height: 83vw;
}
._01 ._01_box2{
	height: 83vw;
}
._02 ._02_box1{
	height: 115vw;
}
._02 ._02_box2{
	height: 115vw;
}
._03 ._03_box1{
	height: 157vw;
}
._03 ._03_box2{
	height: 157vw;
}
.monthSelect_content_inner .listOuter{
	position: absolute;
	width: 75.73vw;
	transition: 0.4s;
}
.monthSelect_content_inner .popular_box{
	position: absolute;
	transition: 0.4s;
}
.monthSelect_content_inner ._visible{
	opacity: 0;
	z-index: -1;
}
.btn a{
	width: 90%;
	font-size: 4vw!important;
	height: 15.33vw;
	line-height: 15.33vw;
	position: relative;
	background: -moz-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
	background: -webkit-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
	background: linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
}
.btn_icon{
	display: block;
	border-top: 0.5vw solid #fff;
	border-right: 0.5vw solid #fff;
	transform: rotate(45deg);
	width: 3vw;
	height: 3vw;
	position: absolute;
	top: 0;
	right: 5.337vw;
	bottom: 0;
	margin: auto;
}
.beforeList .btn_icon{
	border-top: 0.3vw solid #2A80B9;
	border-right: 0.3vw solid #2A80B9;
	left: -7.5em;
}
.caution{
	margin-top: 5.333vw;
}

@media screen and (min-width: 750px){
	.monthSelect_inner{
		border-radius: 12px 12px 0 0;
		padding: 32px 0;
		width: 290px;
	}
	.monthSelect_content{
		margin: 0 auto 40px;
		padding: 40px 20px;
	}
	.monthSelect_content._03 li.crown{
		padding-left: 90px;
	}
	.monthSelect_content._03 li.crown p::after{
		width: 80px;
		height: 72px
	}
	._01  ._01_box1{
		height: 610px;
	}
	._01 ._01_box2{
		height: 610px;
	}
	._02  ._02_box1{
		height: 890px;
	}
	._02 ._02_box2{
		height: 890px;
	}
	._03  ._03_box1{
		height: 1160px;
	}
	._03  ._03_box2{
		height: 1160px;
	}
	.monthSelect_content_inner img,.monthSelect_content_inner ul{
		width: 568.275px;
	}
	.btn a{
		font-size: 30px!important;
		height: 115px;
		line-height: 115px;
	}
	.btn_icon{
		border-top: 3.75px solid #fff;
		border-right: 3.75px solid #fff;
		width: 18.75px;
		height: 18.75px;
		right: 40px;
	}
	.beforeList .btn_icon{
		border-top: 2.25px solid #2A80B9;
		border-right: 2.25px solid #2A80B9;
		width: 16.5px;
		height: 16.5px;
	}
	.caution{
		margin-top: 40px;
		width: 568.275px;
	}
}

.beforeList{
	display: flex;
	background-color: #fff;
	box-sizing: border-box;
	padding: 5.33vw 4vw;
	width: 90%;
	margin: auto;
}
.beforeList ul{
	width: 50%;
}
.beforeList ul li{
	line-height: 2.4;
	padding-left: 3.5rem;
	position: relative;
}
.beforeList ul a{
	color: #2A80B9;
}
.bannerList li{
	position: relative;
}
.bannerList li._blank::after{
	position: absolute;
	content: '';
	background-image: url('/portal/images/icon-outlink.png');
	background-size: contain;
	background-repeat: no-repeat;
	width: 5vw;
	height: 5vw;
	max-width: 31px;
	max-height: 31px;
	bottom: 0;
	right: 5%;
}
.bannerList a{
	display: block;
	margin: 0 auto 0 5%;
	margin-bottom: 5.33vw;
	width: 83%;
}
.bannerList li:last-of-type a{
	margin-bottom: 0;
}
@media screen and (min-width: 750px){
	.beforeList{
		padding: 40px 30px;
	}
	.bannerList a{
		margin-bottom: 40px;
	}
}