/* ******************************************************************
 *	File name		: style.css
 *	Summary			: page layout
 * ******************************************************************
 */

/*
茶 背景 #F9F2E6　rgb(249,242,230)
茶 濃い #5D3800　rgba(93,56,0,0.5)
*/

/* -----------------------------------------------------------------
   header
----------------------------------------------------------------- */
#wrapper{
	padding-top:70px;
}
/* --- responsive --- */
@media(max-width:767px){
	#wrapper{
		padding-top:50px;
	}
}

header{
	position:fixed;
	top:-30px;
	width:100%;
	height:100px;
	z-index:100;
	transition:0.5s;
	background:rgba(255,255,255,0.9);
	animation:h_slide 0.5s ease-out 0s 1 forwards;
	}
	header *{
		transition:0.5s;
	}
	header #head_contents{
		position:relative;
		z-index:10;
	}
	header h1{
		position:absolute;
		top:0px;
		left:0px;
		background:url(../../image/base/logo.png) no-repeat 0 0;
		background-size:cover;
		z-index:10;
	}
	header h1 a{
		display:block;
		width:100%;
		height:100%;
	}
	header h1 img{
		position:absolute;
		top:38px;
		left:40px;
		width:131px;
		height:55px;
		opacity:1;
}
header nav{
	position:relative;
	width:100%;
}
header nav ul{
	position:relative;
	list-style:none;
	text-align:right;
	padding:45px 20px 0 0;
	/*padding:45px 340px 0 0;*/
	}
	header nav ul:after{
		content:" ";
		display:block;
		clear:both;
	}
	header nav ul li{
		display:inline-block;
	}
	header nav ul li a{
		display:block;
		width:100%;
		height:44px;
		padding:0 7px;
		font-weight:bold;
		font-size:0.87rem;
		text-align:center; 
		text-decoration:none;
		line-height:44px;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
		border-radius:3px;
		color:#000;
		text-shadow:rgba(255,255,255,1) 0px 0px 0px;
		}
		header nav > ul > li a:hover{
			text-decoration:none;
			background:rgba(107,181,26,0.2);
	}
	#sub_nav{
		display:none;
}
#head_contact{
	display:none;
	position:absolute;
	top:35px;
	right:20px;
	height:64px;
	padding:10px;
	/*width:320px;*/
	font-size:0.80rem;
	text-align:left;
	line-height:1.35;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
}
#head_contact .tel{
	display:inline-block;
	margin:0 0 0 5px;
	padding:0 0 0 25px;
	font-weight:bold;
	font-size:1.0rem;
	background:url(../../image/base/tel.png) no-repeat 0 0;
	color:#07A729;
}

/* -----------------------------------------------------------------
   pnkz h2
----------------------------------------------------------------- */

#title_block{
	position:relative;
	width:100%;
	height:200px;
}

#pnkz{
	position:absolute;
	width:100%;
	bottom:0px;
	left:0px;
	z-index:12;
	text-align:left;
	}
	#pnkz:after{
		content:" ";
		display:inline-block;
		position:absolute;
		bottom:0px;
		left:auto;
		padding:0px;
		border:17px solid transparent;
		border-bottom:17px solid rgba(105,86,56,0.7);
		border-left:17px solid rgba(105,86,56,0.7);
	}
	#pnkz p{
		display:inline-block;
		height:34px;
		padding:5px 20px;
		font-size:0.8rem;
		color:#FFF;
		background:rgba(105,86,56,0.7);
	}
	#pnkz p a{
		color:#FFF;
		text-decoration:underline;
}

/* --- responsive --- */

@media(max-width:767px){
	#pnkz{
		display:none;
	}
}

h2{
	display:-webkit-flex;
	display:flex;
	justify-content: center;
	align-items:center;
	position:relative;
	left:0px;
	width:100%;
	height:200px;
	padding:0px 0;
	font-family: 'Kosugi Maru', sans-serif;
	font-weight:normal;
	font-size:2rem;
	color:#000;
	text-shadow:rgba(0,0,0,0.4) 0px 0px 0px,rgba(0,0,0,0.4) 0px 0px 0px;
	background:url(../../image/base/h2_bg.jpg) no-repeat top center;
	background-size:cover;
	}
	h2:after{
		display:block;
		content:" ";
		position:absolute;
		top:0px;
		left:0px;
		width:100%;
		height:100%;
		background:url(../../image/base/h2_slash.png) repeat 0 0;
}
@media(max-width:767px){
}


/* -----------------------------------------------------------------
   main all
----------------------------------------------------------------- */

main{
	width:100%;
	padding:20px 0;
	overflow:hidden;
}
section{
	position:relative;
	width:100%;
	margin-bottom:25px;
	text-align:center;
}
section .contents{
	position:relative;
	width:1040px;
	max-width:100%;
	margin:0 auto;
	padding:0 20px;
	text-align:left;
	}
	section .contents:after{
    content:" ";
    display:block;
    clear:both;
}

/* h3 */
main h3{
	position:relative;
	left:25px;
	display:block;
	min-width:767px;
	min-height:60px;
	margin-bottom:12px;
	padding:14px 70px 0px 20px;
	font-family: 'Kosugi Maru', sans-serif;
	font-weight:normal;
	font-size:1.3rem;
	text-align:center;
	text-shadow:rgba(0,0,0,0.4) 0px 0px 0px,rgba(0,0,0,0.4) 0px 0px 0px;
	background:url(../../image/base/h3_bg.png) no-repeat center 0px;
	color:#000;
}

/* --- responsive --- */
@media(max-width:767px){
	main h3{
		left:0px;
		width:100%;
		min-width:0px;
		min-height:0px;
		padding:10px 20px;
		text-align:left;
		background:#ECDAC1;
	}
}

main h4{
	position:relative;
	font-weight:bold;
}
main p{
	margin-bottom:10px;
	font-size:0.9em;
}
main img{
	max-width:100%;
	height:auto;
}

/* -----------------------------------------------------------------
   ul
----------------------------------------------------------------- */

ul.default{
	list-style:none;
	}
	ul.default li{
		margin-bottom:10px;
		font-size:0.9em;
}
ul.disc{
	list-style:disc;
	padding-left:20px;
	}
	ul.disc li{
		margin-bottom:7px;
		font-size:0.9em;
}
ul.num{
	list-style:decimal;
	padding-left:20px;
	}
	ul.num li{
		margin-bottom:7px;
		font-size:0.9em;
}

/* -----------------------------------------------------------------
   arrow
----------------------------------------------------------------- */

/* .arrow */
main .arrow{
	display:block;
	position:relative;
	width:100%;
	height:auto;
	margin:0 0 10px 0;
	padding:0px 0 0px 30px;
	font-weight:normal;
	font-size:1.2rem;
	border-radius:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border:none;
	background:none;
	color:#222222;
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
	text-shadow:rgba(0,0,0,0.4) 0px 0px 0px,rgba(0,0,0,0.4) 0px 0px 0px;
	}
	main .arrow:before{
		content:" ";
		display:block;
		position:absolute;
		top:1px;
		left:0px;
		width:20px;
		height:20px;
		margin-left:0;
		background:url(../../image/base/arrow.png) no-repeat 0 0;
	}
	main .arrow:after{
		display:none;
}
/* .arrowline */
main .arrowline{
	display:block;
	position:relative;
	width:100%;
	height:auto;
	margin:0 0 10px 0;
	padding:0px 10px 10px 30px;
	font-weight:normal;
	font-size:1.3em;
	text-align:left;
	border-radius:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border:none;
	background:url(../../image/base/arrow_border.png) repeat-x 0 bottom;
	color:#222222;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
	main .arrowline:before{
		content:" ";
		display:block;
		position:absolute;
		top:1px;
		left:0px;
		width:20px;
		height:20px;
		margin-left:0;
			background:url(../../image/base/arrow.png) no-repeat 0 0;
	}
	main .arrowline:after{
		display:none;
}

/* -----------------------------------------------------------------
   btn
----------------------------------------------------------------- */

.btn a{
	display:inline-block;
	position:relative;
	padding:6px 20px 6px 30px;
	text-decoration:none !important;
	background:rgba(93,56,0,0.7);
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	color:#FFF;
	transition-duration:0.5s;
	}
	.btn a:before{
		content:" ";
		position:absolute;
		top:11px;
		left:18px;
		border: 6px solid transparent;
		border-left: 6px solid #FFF;
	}
	.btn a:hover{
		opacity:0.85;
}

/* -----------------------------------------------------------------
   colorbox
----------------------------------------------------------------- */

main .colorbox{
	position:relative;
	margin-bottom:20px;
	padding:20px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	background:rgba(105,86,56,0.15);
	border:1px solid rgba(105,86,56,0.4);
}
main .colorbox p:last-child{
	margin-bottom:0px;
}