/*-------------------------------------------------------------

top.css

-------------------------------------------------------------*/
.topSlide{
	position: relative;
	background-color: #f5f0d6;
	margin-bottom: 60px;
	padding: 50px 0;
	//background: url(../image/top_slide_bg_01.jpg) center center no-repeat;
	background: url(../image/top_slide_bg_02.jpg) center center no-repeat;
	background-size: cover;
	overflow: hidden;
}
.topSlide::after{
	content: "";
	position: absolute;
	width:100%;
	height:100%;
	//background-color: rgba(0,0,0,0.3);
	background-color: rgba(255,255,255,0.7);
	top:0;
	left:0;
	z-index: 1;
}
.topSlideBox{
	position: relative;
	max-width:1500px;
	margin:0 auto;
	z-index: 2;
}
.topSlideImage{

}
.topSlideImage img{
	width:100%;
	height:auto;
}

.slider li{
	display:none;
}


.topMainBox{

}
.topMainBoxInner{
	width:1200px;
	padding:0 50px 50px 50px;
	box-sizing: border-box;
	display: flex;
	margin: 0 auto;
}

.topMainBox h2{
	font-size:20rem;
	color:#099;
	margin-bottom: 30px;
	letter-spacing: 0.1em;
}

.topLeftBox,
.topRighttBox{
	width:50%;
	box-sizing: border-box;
}
.topRighttBox{
	width:50%;
	padding-left:80px;
}

.topCom{
	margin-bottom: 20px;
}
.topCom p{
	font-size:20rem;
	line-height: 1.8;
	text-align: left;
	margin-bottom: 10px;
}

.topLabelSample{
	margin-bottom:30px;
	background-color: #f3f5f4;
}
.topLabelSampleBox{
	padding:20px 0;
}
.topLabelSampleBox img{
	width:300px;
	height:auto;
}

.topInfo{
	text-align: left;
}
.topInfo h2{
	float: left;
	width:50%;
}
.topInfo .topInfoIchiran{
	float: left;
	width:50%;
	text-align: right;
}
.topInfo .topInfoIchiran a{
	display: inline-block;
	text-align: right;
	color:#099;
	border: solid 1px #099;
	padding:8px 1em 6px 1em;
	font-size: 14rem;
	text-align: center;
	transition: 0.2s;
	margin-top: -7px;
}
.topInfo .topInfoIchiran a:hover{
	background-color: #cee;
}
.topInfo ul{
	clear: both;
}
.topInfo li{
}
.topInfo li a{
	display: block;
	color: #666;
	padding-bottom: 8px;
	margin-bottom: 14px;
	border-bottom: dashed 1px #ccc;
	transition: 0.2s;
}
.topInfo li a span:nth-child(1){
	display: block;
	font-size: 14rem;
	margin-bottom: 5px;
}
.topInfo li a span:nth-child(2){
	display: block;
	font-size: 16rem;
	line-height: 1.5;
}
.topInfo li a:hover{
	color:#099;
}

.topToroku{
	background-color: #f5f0f0;
	padding:25px 40px;
	margin-bottom: 10px;
	text-align: left;
}
.topToroku h2{
	margin-bottom:20px;
	color: #c69;
}

.topTorokuBtn{
	margin-bottom:20px;
}
.topTorokuBtn ul{
	display: flex;
	justify-content: center;
}
.topTorokuBtn li{
	width:50%;
}
.topTorokuBtn li a{
	display: block;
	font-size:20rem;
	padding:15px 0 13px 0;
	text-align: center;
	transition: 0.2s;
	color:#fff;
	background-color: #c69;
	border: solid 1px #c69;
	margin-right:8px;
}
.topTorokuBtn li a:hover{
	color: #c69;
	background-color: rgba(255,255,255,0.9);
}

.topTorokuCom p{
	color: #555;
	font-size: 15rem;
	line-height:1.6;
	text-indent:-1em;
	margin-left:1em;
	color: #c69;
}
.topTorokuCom p span{
	display:iline-block;
	margin:0 0.5em 0 -0.5em;
}

.topLogin{
	background-color: #f3f5f4;
	padding:25px 40px;
	margin-bottom: 40px;
	text-align: left;
}
.topLoginForm{
	margin-bottom:30px;
}
.topLoginForm li{
	display: flex;
	align-items: flex-end;
	margin-bottom:30px;
	padding-bottom: 8px;
	border-bottom: solid 1px #ccc;
}
.topLoginForm li span:nth-child(1){
	width:23%;
}
.topLoginForm li span:nth-child(2){
	width:77%;
}
.topLoginForm li span:nth-child(2)::before{
	content: "：";
}
.topLoginForm li input{
	font-size: 16rem;
	padding:0;
	border: none;
	background-color: rgba(0,0,0,0);
	width:90%;
}

.topLoginBtn{
	margin-bottom:30px;
}
.topLoginBtn ul{
	display: flex;
}
.topLoginBtn ul.topLoginCenter{
	justify-content: center;
}
.topLoginBtn li{
	width:50%;
}
.topLoginBtn li a{
	display: block;
	font-size:20rem;
	border: solid 1px #000;
	padding:15px 0 13px 0;
	text-align: center;
	transition: 0.2s;
}
.topLoginBtn li.logout a{
	color:#c69;
	border-color: #c69;
	margin-right:8px;
}
.topLoginBtn li.login a{
	color:#099;
	border-color: #099;
	margin-left:8px;
}
.topLoginBtn li a:hover{
	background-color: rgba(255,255,255,0.9);
}

.topLoginLink li:first-of-type{
	margin-bottom: 20px;
}
.topLoginLink li a{
	display: block;
	position: relative;
	color: #666;
	font-size: 14rem;
	padding-left:14px;
	transition: 0.2s;
}
.topLoginLink li a::before{
	content: "";
	position: absolute;
	left:0;
	top:50%;
	margin-top: -4px;
	border-left: solid 6px #099;
	border-top: solid 4px rgba(0,0,0,0);
	border-bottom: solid 4px rgba(0,0,0,0);
	transition: 0.2s;
}
.topLoginLink li a:hover{
	color: #099;
}
.topLoginLink li a:hover::before{
	left:5px;
}

.topGuideLine,
.topPamphlet{
	margin-bottom: 40px;
}
.topLinks{
	text-align: left;
}

.topLinks li{
	margin-bottom: 15px;
}

.topLinks li a{
	display: block;
	font-size: 16rem;
	color: #666;
	line-height: 1.5;
	text-indent:-1em;
	padding-left:1em;
}
.topLinks li a::before{
	content: "・";
}
.topLinks li a:hover{
	color:#099;
}

/*-----print-----*/
@media print{
	html{
		zoom:47%;
	}
}

/*-----834以下-----*/
@media screen and (max-width: 834px) {

	.topSlide{
		background-color: #f5f0d6;
		margin-bottom: 20px;
		padding: 30px 0;
	}

	.topMainBoxInner{
		width:auto;
		padding:0 0 50px 0;
		display: block;
	}

	.topMainBox h2{
		font-size:20rem;
		color:#099;
		margin-bottom: 20px;
		letter-spacing: 0.1em;
	}

	.topLeftBox,
	.topRighttBox{
		width:auto;
	}
	.topRighttBox{
		width:auto;
		padding-left:0;
	}

	.topCom{
		margin-bottom: 20px;
		padding:0 4%;
	}
	.topCom p{
		font-size:16rem;
	}

	.topLabelSampleBox img{
		width:75%;
		height:auto;
	}

	.topInfo{
		padding: 0 4%;
		margin-bottom: 40px;
	}
	.topInfo li a span:nth-child(1){
		font-size: 14rem;
	}
	.topInfo li a span:nth-child(2){
		font-size: 16rem;
	}




	.topToroku{
		padding:30px 4%;
		margin-bottom: 10px;
		text-align: left;
	}
	.topToroku h2{
		color: #c69;
	}
	.topTorokuBtn li a{
		font-size:16rem;
	}

	.topLogin{
		padding:30px 4%;
		margin-bottom: 30px;
	}
	.topLoginForm li span:nth-child(1){
		width:30%;
	}
	.topLoginForm li span:nth-child(2){
		width:70%;
	}

	.topLoginBtn li a{
		font-size:16rem;
	}

	.topGuideLine,
	.topPamphlet{
		margin-bottom: 40px;
	}
	.topLinks{
		padding:0 4%;
	}

	.topLinks li{
		margin-bottom: 10px;
	}

	.topLinks li a{
		font-size: 15rem;
	}

}
