@charset "utf-8";

/* -------------------------------------
	case 1400px (PCサイト/メインビジュアルよりも大きい時 ) */
@media screen and (max-width: 1400px) {
/*----------------------------------------*/
body{
	min-height:5px;
}
/*----------------------------------------*/
}
/*	end case 1400px (PCサイト/メインビジュアルより大きい時 ここまで)
----------------------------------------*/





/* -------------------------------------
	case 1080px (PCサイト/コンテンツ幅より小さい時) */
@media screen and (max-width: 1100px) {
/*----------------------------------------*/
body{
	min-height:4px;
}
.header_inner{
	padding: 0 20px;
}
.header .item{
	width: 50%;
}
.header .item_right{
	width: 50%;
}

.content_mypage_message{
	display: block;
	padding: 90px 20px 30px;
	font-size: 1.8rem;
}
.mypage_message,
.content .mypage_message {
	display: none;
}
.content{
	padding: 0 20px 0;
}
.header_inner,
.footer_inner,
.content_inner{
	margin:auto;
	width:100%;
}
.header_navi .navi_item:last-child:not(:first-child){
	max-width: 50%;
}


.box{
	padding: 30px 2.7%;
}
.white_box{
	padding: 30px 2.7%;
}
.account_area{
	right: 20px;
}


.score_list .item{
	width: 49%;
}
.score_list .item .inner{
	padding: 5px;
	height: calc(21vw + 2.5rem);
}

.score_list .img{
	position: relative;
	top: 0;
	left: 0;
	width: 30%;
	display: table-cell;
}
.score_list .data{
	display: table;
	table-layout: fixed;
	width: 100%;
	margin-bottom: 5px;
	position: relative;
}
.score_list .data .info{
	display: table-cell;
	vertical-align: top;
	padding-left: 5px;
	width: 70%;
}
.score_list .data .title,
.score_list .data .result{
	display: block;
}
.score_list .data .title{
	width: 100%;
	padding-top: 3.12%;
}

.score_list .data .result{
	width: 100%;
	position: absolute;
	right: 0;
	bottom: 0;
}
.score_list .data .result .num{
	font-size: 6.2rem;
}
.score_list .item a.result_zero,
.score_list .result_zero{
	padding: 0 20px;
	display: table-cell;
	width: 70%;
	vertical-align: middle;
}
.score_area{
	border-top: 2px solid #ffffff;
}
.result_list{
	border-top: none;
}

.score_area .dl_date{
	position: absolute;
	right: 5px;
	bottom: 5px;
}
.score_list a.thumb:after,
.print_list a.thumb:after{
	line-height: 30px;
	width: 30px;
	height: 30px;
}

.modalBox {
	width: calc(100% - 40px);
}

.no_data{
	padding: 30px 0;
}
.no_data .ico{
	font-size: 6rem;
	margin-bottom: 3.12%;
}

.no_data .txt{
	font-size: 3rem;
}

/*----------------------------------------*/
}
/*	end case 1080px (PCサイト/コンテンツ幅より小さい時 ここまで)
----------------------------------------*/

@media screen and (max-width: 945px) {
	.score_list .item .inner{
		padding: 5px;
		height: calc(24vw + 2.5rem);
	}
}



/* -------------------------------------
	case 768px (iPadの縦想定) */
@media screen and (max-width: 768px) {
/*----------------------------------------*/
body{
	min-height:3px;
}
.score_list .data .result .num{
	font-size: 5.2rem;
}

/*----------------------------------------*/
}
/*	end case 768px (iPadの縦想定 ここまで)
----------------------------------------*/





/* -------------------------------------
	case 736px (スマホサイズ)			*/
@media screen and (max-width: 736px) {
/*----------------------------------------*/
html{
	font-size:1.5625vw;	/* 1rem = 10px */
}
body{
	min-height:2px;
	font-size: 2.0rem;
}
a,
a:before,a:after,
a *:before,a *:after,
.link,
.link:before,
.link:after{
	-webkit-transition: 0s;
	-o-transition: 0s;
	transition: 0s;
}
.container{
	padding-bottom: 170px;
}
.footer{
	height: 170px;
}
.footer_inner{
	padding: 5% 0 0;
}
.footer .navi .long_txt{
	display: block;
	margin: 0 auto 15px;
}
.footer .navi li{
	font-size: 1.8rem;
	margin: 0 2em 0;
}
.copyright{
	font-size: 1.4rem;
}


.pc{
	display:none!important;
}
.pc_inline{
	display:none!important;
}
.pc_inline_block{
	display:none!important;
}
.sp{
	display:block!important;
}
.sp_inline{
	display:inline!important;
}
.sp_inline_block{
	display:inline-block!important;
}
img{
	max-width:100%;
}
.select select,
input.text,
textarea.text{
	font-size:2.4rem;	/* iPhoneの入力時のズーム防止 */
}
.select,
.select select{
	width: 100%;
}
.select:after{
	top: calc(50% - 0.5em);
	font-weight: 2.4rem;
}
.user_input{
	font-size: 2.4rem;
}
.content{
	padding: 0 3.12% 0;
}
.content_mypage_message{
	padding: 20% 3.12% 3.12%;
	font-size: 2.8rem;
}
/* header */
.header{
	height: auto;
	max-height: 110px;
}
.header_inner{
	padding: 0 3.12%;
}

.header .logo{
	padding: 3.12% 0;
}
.header .logo .img,
.header .logo .txt{
	display: block;
}
.header .logo .img{
	width: 100%;
}
.header .logo .txt{
	margin-left: 0;
	font-size: 1.8rem;
	padding: 2px 0;
	text-align: center;
	margin-top: 2px;
}

.header .item{
	float: left;
	width: 50%;
	max-width: 320px;
	padding: 1.5% 0 1.5%;
}
.header .item_right{
	width: 50%;
	padding: 2% 0 1% 5%;
	float: right;
}
.header_navi{
	padding-top: 0;
}
.header_navi .navi_item{
	margin-left: 0;
	width: 50%;
	vertical-align: top;
	padding-top: 2%;
}
.header_navi .navi_item:last-child:not(:first-child){
	padding-top: 0;
	margin-left: 0;
	max-width: 50%;
}
.site_link{
	font-size: 1.5rem;
	background: #eff0f2;
	border-radius: 5px;
	border: 2px solid #d3d5d8;
	box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
	padding: 8px;
	width: 90%;
	text-align: center;
	margin-bottom: 5px;
}
.site_link .ico{
	display: block;
	margin: 0 0 5px;
	font-size: 1.8rem;
}
.account_link{
	display: block;
	cursor: pointer;
	padding: 0 8px;
	font-weight: 700;
	font-size: 1.4rem;
	width: 100%;
	text-align: center;
	position: relative;
	top: 3px;
}
.account_link .ico{
	display: block;
	margin: 0 0 0;
}

.account_link .ico:before{
	content: "\f007";	/*　あとで変える　*/
	font-size: 3.0rem;
}
.account_link:after{
	font-size: 2.4rem;
	margin-left: 0;
	display: block;
}
.account_link:hover{
	color: #0e6eb8;
}


.form_item{
	max-width: 100%;
	margin-bottom: 7%;
}

.form_title{
	margin-bottom: 5px;
}
.form_title .title{
	float: none;
	margin: 0 0 5px;
	font-size: 2.4rem;
}
.form_title .error_area{
	padding-top: 0;
	font-size: 2.4rem;
}

.btn_area{
	padding: 30px 0 0;
}
.btn_area ul li{
	display: inline-block;
	width: 43%;
	margin: 0 2%;
}
.long_btn_area ul li{
	width: 80%;
	max-width: none;
}

.btn_area ul .large_btn{
	width: 80%;
	margin-top: 5%;
	max-width: none;
}
.btn_area ul .large_btn:first-child{
	margin-bottom: 5%;
}
.main{
	padding: 5.5% 5%;
}

/*	パンくず */
.breadcrumb .inner{
	font-size: 1.6rem;
}

/*	item */
.txt_link{
	font-size: 2.4rem;
}
.page_title{
	font-size: 3.2rem;
	padding: 0 0 7.14% 0;
}
.txt_title{
	margin-bottom: 3.12%;
	font-size: 2.8rem;
}
.icon_title .ico{
	font-size: 5rem;
	width: 70px;
	height: 70px;
	line-height: 70px;
}
.icon_title .title{
	font-size: 2.8rem;
}
.flow{
	padding: 0 0 5% 0;
}
.flow .item{
	padding: 0;
}
.flow04 .item{
}
.flow .item .mark{
	height: 50px;
	width: 50px;
}

.flow .item .mark .ico{
	font-size: 2.8rem;
}
.flow:after{
	top: 25px;
	width: 75%;
	left: 10%;
}
.box{
	padding: 25px 5%;
}

.base_btn{
	font-size: 2.4rem;
}
.search_btn{
	width: 100%;
	padding: 4% 0;
}
.tokuten_btn{
	padding: 1.56% 0;
}
.pagetop{
	right: 3%;
	bottom: 10px;
}
.first_btn{
	padding: 10px;
}

/* column */
.column02{
	display: block;
	width: 100%;
}
.column02 .col{
	width: 100%;
	padding: 0;
	display: block;
}
.column02 .col:last-child{
	padding: 0;
}

/* -------------------------------------
	ログインボタン
---------------------------------------- */
.sns_login_area{
	margin-bottom: 40px;
}
.sns_login_area li{
	max-width: 100%;
	margin-bottom: 3.12%;
}
.sns_login_fb,
.sns_login_tw,
.sns_login_line,
.sns_login_yahoo{
	font-size: 2.2rem;
}
.sns_login_fb{
	padding: 12px 0 12px 45px;
}

.sns_login_tw{
	padding: 12px 0 12px 45px;
}

.sns_login_line{
	padding: 14px 0 14px 45px;
}
.sns_login_yahoo{
	padding: 12px 0 12px 60px;
}
.sns_login_yahoo:before{
	left: 56px;
}


/* -------------------------------------
	ヘッダーのログインエリア
---------------------------------------- */
.account_area{
	position: absolute;
	right: -100%;
	width: 100%;
	border: none;
	background-color: #9caabb;
	box-shadow: none;
	display: none;
	opacity: 0;
	margin-top: 0;
}
.account_area:after{
	display: none;
}
.account_area .inner{
	padding: 20px 20px 15px;
	font-size: 2.4rem;
}

.user_name{
	color: #ffffff;
}
.logout_area a{
	color: #ffffff;
}

body.account_open .account_area{
	z-index: 101;
	display: block;
	right: 0;
}



/* -------------------------------------
	マイページ
---------------------------------------- */
.mypage_navi{
	width: 100%;
	table-layout: fixed;
}
.mypage_navi li{
	width: calc(100% / 3);
	text-align: center;
}
.mypage_navi .tab{
	padding: 4% 0 4.25%;
	font-size: 2.0rem;
}
.mypage_navi .txt,
.mypage_navi i{
	display: block;
	text-align: center;
}

.mypage_navi i{
	font-size: 3rem;
}
.mypage_navi .txt{
	font-size: 2.4rem;
}

.search_area{
	margin-bottom: 5%;
}
.search_area .item{
	display: block;
	width: 100%;
	margin-bottom: 5%;
}
.search_area .btn{
	text-align: center;
}

.pager:not(:last-of-type){
	margin-bottom: 4%;
}
.pager{
	display: table;
	min-width: 60%;
	table-layout: fixed;
}
.pager .list{
	display: table-cell;
}

.pager .list li{
	display: table-cell;
	padding-right: 3%;
	margin-right: 0;
}
.pager .list li > *{
	line-height: 32px;
	height: 32px;
	width: 32px;
	font-size: 1.8rem;
}

.pager .num{
	display: table-cell;
	padding-left: 2%;
	font-size: 1.8rem;
	vertical-align: middle;
	min-width: 103px;
}
.pager .num .now{
	margin-right: 2px;
}
.pager .num .all{
	margin-left: 2px;
}

.item_close{
	line-height: 34px;
}

.print_list{
	margin-bottom: 30px;
}
.print_list .line{
	height: 5px;
	width: 100%;
}
.print_list .item{
	margin-bottom: 10px;
}
.print_list .item .inner{
	display: block;
	padding: 3% 2% 2%;
}
.print_list .data{
	display: table;
	width: 100%;
	letter-spacing: normal;
}
.print_list .img,
.print_list .info{
	display: table-cell;
}
.print_list .img{
	width: 22%;
}

.print_list .info{
	width: 78%;
	line-height: 1.25;
}
.print_list .btn{
	display: block;
	width: 100%;
	padding-top: 3.12%;
}

.print_list .date{
	font-size: 1.8rem;
	margin-bottom: 3px;
}

.score_list{
}
.score_list .item{
	width: 100%;
	max-width: none;
	float: none;
	margin-bottom: 3.12%;
}
.score_list .item:nth-child(2n){
	float: none;
}
.score_list .item .info{
	padding: 3.12% 3.12% 0;
}
.score_list .item .inner{
	height: auto;
	min-height: 0;
}
.score_list .not_result .data{
	margin-bottom: 0;
}
.score_list .data .title,
.score_list .data .result{
}
.score_list .data .title{
	font-size: 2.4rem;
	padding-top: 0;
}

.score_list .data .result{
	font-size: 3.6rem;
	padding: 3.12% 0 0;
	position: relative;
}
.score_list .data .result .num{
	font-size: 9rem;
}
.score_list .data .result .ten{
	font-size: 3.6rem;
}

.result_list{
	border-top: 2px solid #ffffff;
}
.result_list th{
	font-size: 2.0rem;
}
.result_list td{
	font-size: 3.2rem;
}
.score_area{
	border-top: none;
}
.score_list .dl_date{
	position: relative;
	right: 0;
	bottom: 0;
	text-align: right;
	font-size: 1.8rem;
}
.not_result .dl_date{
	padding: 0;
	position: absolute;
	right: 5px;
	bottom: 5px;
}
.dl_date .dl_title{
	font-size: 1.8rem;
	margin-right: 5px;
}
.modal_content .form_title .title{
	font-weight: 700;
	font-size: 2.4rem;
}
.modal_content .form_column .col{
	width: 100%;
	margin: 0 0 6.25%;
	display: block;
}
.modal_content .box{
	padding: 25px 5%;
}
.switch_radio{
	width: 100%;
}
.switch_radio .label{
	width: 100%;
}
.switch_radio .label .txt{
	line-height: 1;
	height: auto;
	font-size: 2.4rem;
	padding: 1em 0;
}
.modal_content .result_count .txt{
	font-weight: 2.4rem;
}
.input_result_list li{
	display: table;
	table-layout: fixed;
	width: 100%;
	margin-right: 0;
	margin-bottom: 3.12%;
}
.input_result_list .title,
.input_result_list .input{
	display: table-cell;
	vertical-align: middle;
}
.input_result_list .title{
	width: 25%;
	font-size: 2.4rem;
	text-align: left;
}
.input_result_list .input{
	width: 75%;
}
/* -------------------------------------
	モーダルボックス
---------------------------------------- */

.modalBoxContents {
}

.modalBox {
	 padding:4.6875%;
	 width:90%;
	 height:90%;
}

.close.spClose{
	font-size: 4.8rem;
	color: #9caabb;
	font-family: FontAwesome;
	cursor:pointer;
	position:fixed;
	top:5px;
	right:5px;
	z-index:2002;
}
.loading .txt{
	font-size:2.4rem;
}
/*----------------------------------------*/
}
/*	end case 736px (スマホサイズ ここまで)
----------------------------------------*/





/* -------------------------------------
	case 640px (スマホの小さめのサイズ)   */
@media screen and (max-width: 640px) {
/*----------------------------------------*/
body{
	min-height:1px;
}
.container{
	max-width:640px;
	width:100%;
	margin:0 auto;
	padding-bottom: 150px;
}

.footer{
	height: 150px;
}

/*----------------------------------------*/
}
/*	end case 640px (スマホの小さめのサイズ ここまで)
----------------------------------------*/

@media screen and (max-width: 450px) {
	.container{
		padding-bottom: 120px;
	}

	.footer{
		height: 120px;
	}
}