@charset "utf-8";

/* TOP PAGE
=========================================*/
#contents.topArea {
}

/* category
=========================================*/
#contents.topArea #topCategory { margin-bottom: 50px; }
#contents.topArea #topCategory .topCategory_main { margin-bottom: 35px; }
#contents.topArea #topCategory .topCategory_main ul { display: flex; font-family: 'Roboto', sans-serif; line-height: 1.2; text-align: center; }
#contents.topArea #topCategory .topCategory_main ul li { -webkit-box-sizing: border-box; box-sizing: border-box; width: 50%; }
#contents.topArea #topCategory .topCategory_main ul li:nth-of-type(1) { border-right: 1px solid #ffffff; }
#contents.topArea #topCategory .topCategory_main ul li:nth-of-type(2) { border-left: 1px solid #ffffff; }
#contents.topArea #topCategory .topCategory_main ul li a { color: #5b5228; display: block; text-decoration: none; }
#contents.topArea #topCategory .topCategory_main ul li a img { width: 100%; }
#contents.topArea #topCategory .topCategory_main ul li a span:nth-of-type(1) { display: block; font-size: 0; line-height: 0; }
#contents.topArea #topCategory .topCategory_main ul li a:hover span:nth-of-type(1) { opacity: 0.7; }
#contents.topArea #topCategory .topCategory_main ul li a span:nth-of-type(2) { display: block; font-size: 16px; padding-top: 10px; }
#contents.topArea #topCategory .topCategory_list { border-left: 1px solid #cdcabb; border-top: 1px solid #cdcabb; display: flex; flex-wrap: wrap; line-height: 1.2; text-align: center;}
#contents.topArea #topCategory .topCategory_list a { -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #f5f5f5; border-right: 1px solid #cdcabb; border-bottom: 1px solid #cdcabb; color: #5b5228; display: block; padding: 15px 0; width: 25%; text-decoration: none; }
#contents.topArea #topCategory .topCategory_list a:hover { background-color: #cdcabb; color: #ffffff; }
#contents.topArea #topCategory .topCategory_list a span:nth-of-type(1) { display: block; font-size: 12px; font-family: 'Roboto', sans-serif; }
#contents.topArea #topCategory .topCategory_list a span:nth-of-type(2) { display: block; font-size: 14px; font-weight: normal; padding-top: 8px; }

/* banner
=========================================*/
#contents.topArea #topBanner {
	clear: both;
	text-align: left;
	margin: 0 10px 20px;
	
}
	#contents.topArea #topBanner p {
		font-size: 130%;
		line-height: 1.5;
	}

/* social
=========================================*/
#contents.topArea #social {
	clear: both;
	margin-bottom: 20px;
	padding: 0 5px;
}
	#contents.topArea #social #social-banner {
		float: left;
		font-size: 0;
		line-height: 0;
		width: 480px;
	}
		#contents.topArea #social #social-banner li {
			padding-bottom: 1px;
		}
    #contents.topArea #social #social-banner li a:hover img {
		filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
		-moz-opacity: 0.7;
		opacity: 0.7;
	}
	#contents.topArea #social #social-twitter {
		float: right;
		width: 477px;
	}
	#contents.topArea #social #social-facebook {
		float: left;
		font-size: 0;
		line-height: 0;
		padding-top: 5px;
		width: 970px;
	}
		#contents.topArea #social #social-facebook li {
			float: left;
			padding-top: 20px;
			width: 890px;
		}
		#contents.topArea #social #social-facebook li.icon {
			font-size: 0;
			line-height: 0;
			margin-right: 10px;
			padding-top: 0px;
			width: 60px;
		}

/* ご利用にあたって
=========================================*/
#contents.topArea #topUse {
	clear: both;
	margin-bottom: 20px;
}
	#contents.topArea #topUse h2 {
		line-height: 0;
		position: relative;
		width: 980px;
		height: 34px;
	}
	#contents.topArea #topUse h2 a {
		position: absolute;
		top: 6px;
		right: 10px;
	}
	#contents.topArea #topUse  h3 {
		color: #0f6d52;
		font-size: 11px;
		font-weight: bold;
		padding-bottom: 5px;
	}
	#contents.topArea #topUse  h4 {
		font-size: 11px;
		font-weight: bold;
		padding-bottom: 5px;
	}
	#contents.topArea #topUse p {
		font-size: 11px;
	}
	#contents.topArea #topUse .inner {
		width: 343px;
	}
	#contents.topArea #topUse .bgGuide01 {
		background: url(../../images/bg_guide_01.jpg) no-repeat 390px center;
		border: #d8d8c8 solid 1px;
		padding: 10px 130px 10px 10px;
	}
	#contents.topArea #topUse .bgGuide01 .inner {
		min-height: 106px;
		*height: 106px;
	}
	#contents.topArea #topUse .bgGuide02 {
		background: url(../../images/bg_guide_02.gif) no-repeat 365px center;
		border: #d8d8c8 solid 1px;
		padding: 10px 130px 10px 10px;
	}
	#contents.topArea #topUse .bgGuide03 {
		background: url(../../images/bg_guide_03.gif) no-repeat 370px center;
		border: #d8d8c8 solid 1px;
		padding: 10px 130px 10px 10px;
	}
	#contents.topArea #topUse .bgGuide03 .inner {
		min-height: 113px;
		*height: 113px;
	}
	#contents.topArea #topUse .bgGuide04 {
		background: url(../../images/bg_guide_04.gif) no-repeat 375px center;
		border: #d8d8c8 solid 1px;
		padding: 10px 130px 10px 10px;
	}
	#contents.topArea #topUse .bgGuide05 {
		border: #d8d8c8 solid 1px;
		padding: 10px;
	}
	#contents.topArea #topUse .bgGuide05 .inner {
		float: right;
		margin-left: 10px;
		width: auto;
	}

/* LOGIN PAGE
=========================================*/
#contents.loginArea {
}
#contents.loginArea h2 {
	line-height: 0;
	margin-bottom: 40px;
}
#contents.loginArea #dvLogin{
	float:left;
	position:relative;
	margin-bottom:20px;
	width:980px;
}
#contents.loginArea #dvLogin p{
	margin:5px 20px 10px 12px;
}
#contents.loginArea #dvLogin p.tx-center{
	text-align:center;
	margin:5px 0px 10px 0px;
}
#contents.loginArea #dvLogin #dvLoginWrap{
	float:left;
	width:490px;
	display:inline;
	border-right:1px solid #ccc;
	padding-bottom:17px;
}
#contents.loginArea h3 {
	margin: 0 0 20px 12px;
}
#contents.loginArea #dvLogin .dvLoginLogin{
	margin-left:82px;
	padding-top:17px;
	width:324px;
}
#contents.loginArea #dvLogin .dvLoginLogin ul{
	padding:5px 40px 10px 10px;
}
/* ログイン情報 */
#contents.loginArea #dvLogin .dvLoginLogin ul li{
	margin:3px;
	margin-left:10px;
}
/* ログインボタン */
#contents.loginArea #dvLogin .dvLoginLogin ul li.loginBtn{
	margin-top:-50px;
	margin-left:150px;
}
/* パスワードリマインダー */
#contents.loginArea #dvLogin #dvLoginWrap .dvLoginReminder{
	margin:10px 0 0 82px;
	padding-top:20px;
	width:324px;
}

/* 会員登録 */
#contents.loginArea #dvLogin #dvLoginRegistWrap{
	float:right;
	width:464px;
	padding-top:17px;
}
#contents.loginArea #dvLogin #dvLoginRegistWrap h3 {
	margin-left: 12px;
}
#contents.loginArea #dvLogin #dvLoginRegistWrap .dvLoginRegist{
	margin-right:60px;
	width:324px;
}

#contents.loginArea #dvLogin #dvLoginRegistWrap .dvLoginRegist p{
	margin-right:0px;
}

/* LOGIN ERROR
=========================================*/
#contents.errorArea {
}
#contents.errorArea h2 {
	line-height: 0;
	margin-bottom: 40px;
}
#dvErrorInfoBox #dvErrorInfo{
	border:1px solid #b2b48f;
	margin-bottom:30px;
	background-color:#fff;
}
#dvErrorInfoBox #dvErrorInfo h6{
	text-align:center;
	margin:0px;
	border-bottom:1px solid #b2b48f;
	background-color:#f4f4f4;
}

#dvErrorInfoBox #dvErrorInfo h6 img{
	padding:5px 10px;
}

#dvErrorInfoBox #dvErrorInfo #dvErrorContents{
	padding:20px 10px;
	text-align:center;
	line-height:1.4;
	color:#ff0000;
}
#dvErrorBtnBox {
	text-align:center;
	line-height:0;
	margin-bottom:20px;
}

/* topSlide
=========================================*/
#contents.topArea #topSlide {
	font-size: 0;
	line-height: 0;
	position: relative;
	margin-bottom: 40px;
}
	#contents.topArea #topSlide .btn {
		text-align: center;
	}
		#contents.topArea #topSlide .btn a {
			 font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
			border: 1px solid #e5e5e5;
			background-color: #cdcaba;
			display: inline-block;
			color: #ffffff;
			font-size: 14px;
			font-weight: bold;
			line-height: 38px;
			text-decoration: none;
			padding: 0 25px;
		}
		#contents.topArea #topSlide .btn a:hover {
			opacity: 0.7;
		}
	#contents.topArea #topSlide .photo {
		overflow: hidden;
		position: relative;
		margin-bottom: 20px;
		width: 976px;
		height: 294px;
	}
		#contents.topArea #topSlide .photo li {
			float: left;
			width: 980px;
		}
		#contents.topArea #topSlide .photo li img {
			width: 100%;
			height: auto;
		}
	#contents.topArea #topSlide .page {
		display: flex;
		justify-content: center;
		text-align: center;
		position: relative;
		margin-bottom: 30px;
	}
		#contents.topArea #topSlide .page a {
			background-color: #cdcaba;
			display: inline-block;
			overflow: hidden;
			margin: 0 5px;
			width: 34px;
			height: 2px;
		}
		#contents.topArea #topSlide .page a.selected {
			background-color: #87826a;
		}
	#contents.topArea #topSlide .prev {
		cursor: pointer;
		position: absolute;
		top: 0px;
		left: 0px;
	}
	#contents.topArea #topSlide .next {
		cursor: pointer;
		position: absolute;
		top: 0px;
		right: 0px;
	}

/* topNews
=========================================*/
#contents.topArea #topNews {
	position: relative;
	margin-bottom: 20px;
}
	#contents.topArea #topNews .title {
		border-bottom: 1px solid #000000;
		font-size: 0;
		line-height: 0;
		position: relative;
		margin-bottom: 17px;
		padding: 0 10px 10px 10px;
	}
		#contents.topArea #topNews .title h2 {
			float: left;
			padding-top: 2px;
		}
		#contents.topArea #topNews .title p {
			float: right;
		}
			#contents.topArea #topNews .title p a:hover img {
				filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
				-moz-opacity: 0.7;
				opacity: 0.7;
			}
	#contents.topArea #topNews .list {
		overflow: hidden;
	}
		#contents.topArea #topNews .list ul {
			padding-left: 10px;
			width: 1050px;
		}
		#contents.topArea #topNews .list li {
			float: left;
			margin-right: 20px;
			padding-bottom: 20px;
			width: 300px;
		}
		#contents.topArea #topNews .list li.cl {
			clear: left;
		}
			#contents.topArea #topNews .list li dt {
				float: left;
				font-size: 0;
				line-height: 0;
			}
				#contents.topArea #topNews .list li dt a {
					display: block;
					text-align: center;
					width: 80px;
				}
				#contents.topArea #topNews .list li dt a img {
					width: auto;
					height: auto;
					max-width: 80px;
					max-height: 80px;
				}
				#contents.topArea #topNews .list li dt a:hover img {
					filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
					-moz-opacity: 0.7;
					opacity: 0.7;
				}
			#contents.topArea #topNews .list li dd {
				font-size: 11px;
				line-height: 1.4;
				padding-left: 90px;
			}
				#contents.topArea #topNews .list li dd a {
					color: #000000;
					text-decoration: none;
				}
				#contents.topArea #topNews .list li dd a:hover {
					text-decoration: underline;
				}

/* topStyling
=========================================*/
#contents.topArea #topStyling {
	position: relative;
	margin-bottom: 50px;
}
	#contents.topArea #topStyling h2 {
		border-bottom: 1px solid #000000;
		font-size: 0;
		line-height: 0;
		margin-bottom: 17px;
		padding: 0 10px 10px 10px;
	}
	#contents.topArea #topStyling .list {
		overflow: hidden;
		width: 980px;
	}
		#contents.topArea #topStyling .list ul {
			width: 1050px;
		}
		#contents.topArea #topStyling .list li {
			float: left;
			margin-right: 11px;
			width: 187px;
		}
			#contents.topArea #topStyling .list li .category {
				line-height: 1.2;
				margin-bottom: 5px;
				padding: 0 5px;
			}
			#contents.topArea #topStyling .list li dl {
			}
			#contents.topArea #topStyling .list li dt {
				font-size: 0;
				line-height: 0;
			}
			#contents.topArea #topStyling .list li dd {
				padding: 8px 5px;
			}

/* topList
=========================================*/
#contents.topArea .topList {
	position: relative;
	margin-bottom: 50px;
}
	#contents.topArea .topList h2 {
		border-bottom: 1px solid #000000;
		font-size: 0;
		line-height: 0;
		margin-bottom: 17px;
		padding: 0 10px 10px 10px;
	}
	#contents.topArea .topList .list {
		overflow: hidden;
		width: 980px;
	}
		#contents.topArea .topList .list ul {
			padding-left: 1px;
			width: 1050px;
		}
		#contents.topArea .topList .list li {
			float: left;
			margin-right: 13px;
			width: 185px;
		}
			#contents.topArea .topList .list li dt {
				font-size: 0;
				line-height: 0;
				padding-bottom: 8px;
			}
				#contents.topArea .topList .list li dt a:hover img {
					filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
					-moz-opacity: 0.7;
					opacity: 0.7;
				}
			#contents.topArea .topList .list li p {
				padding: 0 5px;
			}
			#contents.topArea .topList .list li .date {
				line-height: 1.2;
				margin-bottom: 5px;
			}
			#contents.topArea .topList .list li .icon {
				font-size: 0;
				line-height: 0;
				margin-bottom: 8px;
			}
			#contents.topArea .topList .list li .name {
				line-height: 1.2;
				margin-bottom: 5px;
			}
			#contents.topArea .topList .list li .code {
				font-size: 10px;
				line-height: 1.2;
				margin-bottom: 15px;
			}

/* topinfo
=========================================*/
#contents.topArea #info {
	position: relative;
	margin-bottom: 25px;
}
	
#contents.topArea #info p{
	line-height: 1.5;
	font-size: 14px;
	
}
	
	
/* topmodal
=========================================*/
.home_modal_balance {
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 200;
}
.home_modal_balance .modal_overlay {
	background-color: rgba(0,0,0,0.7);
	display: none;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}
.home_modal_balance .modal_box {
	display: none;
	font-size: 0;
	line-height: 0;
	position: relative;
}
.home_modal_balance .modal_box .modal_close{
	cursor: pointer;
	position: absolute;
	top: 0px;
	right: 0px;
}