@CHARSET "UTF-8";

.spView
{
	display: none;
}

@media(max-width:960px){
	
	.spView
	{
		display: none;
	}
		
	div.head{
		width: 100%;
	}
	
	div.body>div.inner{
		width: 100%;
	}



	body.afterLogin div.body{
		padding: 0;
	}

	body.afterLogin div.body p.userName{
		-webkit-border-radius: 0;
		        border-radius: 0;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar th.date{
		width: 130px;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar th.join{
		width: 100px;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar th.reception{
		width: 90px;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar th.print{
		width: auto !important;
	}

	body.afterLogin div.body div.contents>div.section.entryHistory th{
		text-align: left;
	}

	/*申し込みページ*/

	#entry div.body div.userData div.wrap_entry{
		
	}

	#entry div.body div.userData div.wrap_entry table{
		
	}

	#entry div.body div.userData table.entry th.lodging{
		width: 100px;
	}

	#entry div.body div.userData table.entry th.rental{
		width: 88px;
	}

	#entry div.body div.userData table.entry th.comment{
		width: auto;
	}
	
	/*新規登録・個人情報編集ページ*/

	#profile div.body p.submit button{
		margin-bottom: 10px;
	}
}

@media(max-width:840px){

	.spView
	{
		display: none;
	}
	body.afterLogin div.body div.contents>div.section.eventCalendar th,
	body.afterLogin div.body div.contents>div.section.eventCalendar td,
	body.afterLogin div.body div.contents>div.section.entryHistory th,
	body.afterLogin div.body div.contents>div.section.entryHistory td{
		padding: 8px 5px;
		font-size: 12px;
	}

	#entry div.body div.userData table.entry td select{
		font-size: 14px;
	}

	/*パスワードリセットページ*/
	
	#passwordReset div.body{
		padding: 0;
	}

	#passwordReset div.body>div.inner{
		width: 100%;
	}

	#passwordReset div.body h1{
		padding: 10px;
		font-size: 16px;
		font-size: 1.6rem;
		font-weight: bold;
		-webkit-border-radius: 0;
		        border-radius: 0;
	}
}

@media(max-width:720px){

	.spView
	{
		display: block;
	}
	
	body.afterLogin div.body div.contents>div.section.eventCalendar th{
		display: none;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar td{
		display: block;
		border-bottom: none;
		padding: 5px 10px;
		width: 100% !important;
		text-align: left !important;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar td.date{
		padding-top: 10px;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar td.print{
		padding-bottom: 10px;
		border-bottom: 1px solid #EEE;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar td.date br{
		display: none;
	}

	body.afterLogin div.body div.contents>div.section.eventCalendar td > div:before{
		display: block;
		margin-bottom: 3px;
		font-weight: bold;
		content: attr(data-attr);
		color: #333;
	}

	#entry div.body div.userData table.entry tr{
		display: block;
		border-bottom: 1px solid #EEE;
		padding: 2px 10px 10px;
	}

	#entry div.body div.userData table.entry tr:nth-child(even){
		background: #FAFAFA;
	}

	#entry div.body div.userData table.entry th{
		display: none;
	}

	#entry div.body div.userData table.entry td{
		display: block;
		padding: 0;
		border: none;
		width: 100% !important;
		text-align: left;
		font-size: 12px;
	}

	#entry div.body div.userData table.entry td > div:before{
		display: block;
		margin-top: 8px;
		margin-bottom: 3px;
		font-weight: bold;
		content: attr(data-attr);
		color: #333;
	}

	#entry div.body div.userData table.entry td select{
		font-size: 12px;
	}

	/*新規登録・個人情報編集ページ*/

	#profile div.body div.userData th,
	#profile div.body div.userData td{
		display: block;
		width: 100%;
		border: none;
	}

	#profile div.body div.userData th.col2-1,
	#profile div.body div.userData th.col2-2{
		width: 100%;
	}

	#profile div.body div.userData th.col2-1{
		background: #AAA;
	}

	#profile div.body div.userData th.col2-2:before{
		content: "ー ";
		font-weight: normal;
	}

}

@media(max-width:640px){

	.spView
	{
		display: block;
	}
	
	body.mini div.body{
		padding: 0;	
	}

	body.mini div.body>div.inner{
		width: 100%;
	}

	body.mini div.body h1{
		padding: 10px;
		font-size: 16px;
		font-size: 1.6rem;
		font-weight: bold;
		-webkit-border-radius: 0;
		        border-radius: 0;
	}

	body.afterLogin div.body h1{
		text-align: center;
	}

	body.afterLogin div.body h1{
		border: none;
		padding-left: 0;
		padding-right: 0;
		font-size: 20px;
		font-size: 2rem;
	}	

	body.afterLogin div.body div.wrap.contents{
		padding-left: 0;
		padding-right: 0;
	}

	input[type="file"]{
		font-size: small;
		width: 100%;
	}

	input[type="button"]{
		font-size: small;
	}

	select{
		font-size: small;
	}

	input[name="mail_address"],
	input[name="mail_address_confirm"],
	input[name="oe_user_hoken_name"],
	input[name="address"],
	input[name="phone_number"],
	input[name="cellular_number"],
	input[name="fax_number"],
	input[name="emergency_address"],
	input[name="emergency_phone_number"],
	input[name="emergency_cellular_number"],
	input[name="emergency_fax_number"],
	input[name="jaf_no"],
	input[name="msev_member_number"]{
		width: 100%;
	}

	/*新規登録・個人情報編集ページ*/

	#profile div.body p.submit{
		text-align: center;
	}

	#profile div.body p.submit button{
		max-width: 300px;
		width: 100%;
	}

	/*申し込みページ*/

	#entry div.body div.userData th{
		width: 25%;
		max-width: 200px;
	}
	
}

@media(max-width:480px){

	
	.spView
	{
		display: block;
	}
	
	div.head{
		padding: 10px;
	}

	div.head ul{
		position: absolute;
		top: -18px;
		left: 0;
		width: 100vw;
		font-size: 0;
		text-align: center;
	}

	div.head ul li{
		position: static;
		display: inline-block;
		padding-left: 5px;
		padding-right: 5px;
	}

	div.head ul li a{
		text-decoration: none;
	}

	div.head ul li a:before{
		display: block;
		font-size: 11px;
	}

	div.head ul li.flow a:before{
		content: "イベント参加申請手順";
	}

	div.head ul li.profile.change a:before{
		content: "個人情報の変更";
	}

	div.head ul li.profile.view a:before{
		content: "個人情報の表示";
	}

	div.head ul li img{
		display: none;
	}

	div.head p.logo img{
		width: 25vw;
	}
	
	body.mini div.body>div.inner>div.wrap{
		padding: 10px;
	}

	/*ログインページ*/

	#login div.body p.submit button{
		max-width: 300px;
		width: 100%;
	}

	#login div.body p.explanation{
		text-align: left;
	}

	#login div.body th,
	#login div.body td{
		display: block;
		width: 100%;
		text-align: left;
	}
	

	/*パスワードリセットページ*/

	#passwordReset div.body th,
	#passwordReset div.body td{
		display: block;
		text-align: left;
		width: 100%;
	}

	#passwordReset div.body th{
		font-weight: bold;
	}

	#passwordReset div.body td input{
		width: 100%;
	}

	#passwordReset div.body p.explanation{
		text-align: left;
	}

	/*マイページトップ*/

	#myPageTop div.body div.entry>div.wrap{
		border-top: 3px solid #EEE;
		padding: 0;
	}


	/*申し込みページ*/

	body.afterLogin div.body div.contents>div.section.eventInformation div.wrap{
		overflow: scroll;
	}

	body.afterLogin div.body div.contents>div.section.eventInformation table{
		width: 600px;
	}


	/*個人情報編集ページ*/

	#profile div.body p.submit input{
		top: 60px;
		left: 50%;
		transform: translateX(-50%);
	}
}