@charset "UTF-8";

/* layout
++--------------------------------------------++*/
@media (min-width: 768px){
	.page-inner{
		min-width: var(--width-min);
		max-width: var(--width-max);
		margin: 0px auto;
		padding: 0 2em 1em;
		background-color: rgba(255,255,255,0.98);}
}

@media (max-width: 767px){
	.page-inner{
		max-width: 95%;
		margin: 0px auto;
		background-color: rgba(255,255,255,0.9);}
}

.page-bk{
	/*background-image: linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.1)), url(../../../../uploads/img/object/11.jpg);
	background-position: left center;*/
	/*background: url(../../../../uploads/img/bg/back_20_01.png) repeat left top;*/
	background: url(../../../uploads/img/bg/layer/white4x4_03.png) repeat left top,
							url(../../../uploads/img/object/11.jpg) no-repeat center top;
	background-size: auto, cover;
	/*background-size: contain;*/
	background-attachment: fixed;}

.page-inner section{
	padding: 0 0 3em;}

.page-inner h2{
	text-align: center;
	background-color: var(--color-bk2);
	color: #404040;
	font-family: var(--font-gothic);
	font-size: 24px; font-size: 2.4rem;
	margin: 0px 0px 1em;
	padding: 0.5em 0;}

.page-inner p{
	color: var(--color-p1);
	font-size: 16px; font-size: 1.6rem;
	padding: 0 0 16px 0;}

.first-left h3{
	padding-bottom: 1em;}

@media (min-width: 768px){
	.first-inner{
		display: flex;
		padding: 0px 0;}

	.first-left{
		flex:2;
		border: solid 2px #C6AB63;
		border-radius: 6px;
		padding: 3em;
		margin-right: 3em;}

	.first-right{
		flex:1}
}

@media (max-width: 767px){
	.first-left{
		border: solid 2px #C6AB63;
		border-radius: 6px;
		margin: 1em;
		padding: 1em;}

	.first-right{
		width: 70%;
		height: auto;
		margin: 0 auto;}
}

/*guide*/
.guide-sec h3, .first-sec h3{
	font-size: 20px; font-size: 2.0rem;
	color:#666;
	margin: 0 0 1em 0;
	padding: 0.5em 1em;
	border-left:5px solid #C6AB63;}

@media (min-width: 768px){
	.guide-inner{
		display: flex;
		margin: 0 1em;
		padding: 0 0 1em;}

	.guide-left{
		flex: 2;}

	.guide-right{
		flex: 1;
		text-align: right;}

	.guide-sec img{
		width: 300px;
		height: auto;
		padding: 4em 0 0;}
}

@media (max-width: 767px){
	.guide-inner{
		margin: 0 1em;
		padding: 0 0 1em;}

	.guide-right{
		text-align: center;}

	.guide-sec img{
		width: 80%;
		height: auto;
		padding: 1em 0;}
}


/* first-sec
++--------------------------------------------++*/
.guide-sec p, .first-sec2 p, .first-sec3 p, .first-sec4 p{
	padding: 0.5em 1.5em;}

.first-sec2 ul{
	padding: 0.5em 0 2em 1.5em;
	list-style: disc inside;}

.first-sec2 ul li span{
	display: inline-block;
	width: 180px;}

.first-sec4 p{
	padding: 0 0 1em;}