@charset "utf-8";


/* layout =============================================================

======================================================================== */


/* =====================================================================

	container
	
======================================================================== */


	.l-container-sp,
	.l-container-w,
	.l-container {
		margin-right: auto;
		margin-left: auto;
		}
	.l-container-sp:before, .l-container-sp:after,
	.l-container-w:before, .l-container-w:after,
	.l-container:before, .l-container:after {
		display: table;
		content: " ";
		}
	.l-container:after,
	.l-container:after {
		clear: both;
		}
	.l-container-1920 {
		overflow: hidden;
		}


	@media print, screen and (min-width: 768px) {
		.l-container-w {
			width: 100%;
			min-width: 1000px;
			}
		.l-container {
			width: 1000px;
			padding-left: 10px;
			padding-right: 10px;
			box-sizing: border-box;
			}
		.l-side {
			float: left;
			width: 230px;
			margin-bottom: 5.0rem;
			}
		.l-main {
			float: right;
			width: 730px;
			}
		.l-minwidth {
			min-width: 1000px;
			}
	}
	@media (max-width: 767px) {
		.l-container-w {
			width: 100%;
			}
		.l-container {
			width: 92%;
			}
		.l-container-sp {
			width: 100%;
			}
	}




/* =====================================================================

	header
	
======================================================================== */

header {
	width: 100%;
	background-color: #fff;
	box-shadow: 0px 1px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.3);
	position: fixed;
	top: 0px;
	left: 0;
	z-index: 1000;
	}
.l-header {
	background-repeat: no-repeat;
	background-position: top 5px right 340px;
	}
.l-header a {
	text-decoration: none !important;
	}

	@media print, screen and (min-width: 768px) {
		header {
			height: 110px;
			}

		/* hlogo */
		.l-header h1 {
			float: left;
			margin-left: 10px;
			}

		/* l-hnav */
		.l-hnav {
			float: right;
			width: 321px;
			margin-right: 10px;
			}
			.l-hnav > ul {
				margin-bottom: 6px;
				}
			.l-hnav > ul > li {
				margin-bottom: 0px !important;
				}
		
		@media (max-width: 767px) {
			header {
				background-position: top 5px left 50px;
			}
		}
		
		@media print {
			header {
				position: static;
			}
		}

		/* l-gnav */
		.l-gnav {
			width: 100%;
  			height: 50px;
			background-color: #FF9900;
			box-shadow: 0 5px 5px -3px  rgba(0,0,0,0.3) inset, 0px 1px 3px rgba(0,0,0,0.3);
			-webkit-box-shadow: 0 5px 5px -3px rgba(0,0,0,0.3) inset, 0px 1px 3px rgba(0,0,0,0.3);
			-moz-box-shadow: 0 5px 5px -3px rgba(0,0,0,0.3) inset, 0px 1px 3px rgba(0,0,0,0.3);
			}
		.l-gnav li,
		.l-gnav ul {
			margin-bottom: 0;
			}
			/* IE11 hack */
			_:-ms-lang(x)::-ms-backdrop, .l-gnav {
				position: relative;
				top: -3px;
			}
  	}
	@media print, screen and (min-width: 1101px) {
		.l-header h1 {
			width: 680px;
			}
		.p-hdiscS {
			display: none;
			}
  	}
	@media screen and (min-width:768px) and ( max-width:1100px) {
		.l-header h1 {
			width: 640px;
			}
		.p-hdiscL {
			display: none;
			}
  	}

	@media screen and (min-width:768px) and ( max-width:1100px) {
		.l-header {
			background-position: top 40px right 340px;
			background-size: 60px 60px;
		}
		.p-hdiscS {
				width: 200px;
				height: auto;
			}
	}


	@media (max-width: 767px) {
		.l-header {
			height: 65px;
			background-position: top 8px right 80px;
			background-size: 50px 50px;
  			}
		.l-header h1 {
			margin-left: 10px;
			margin-top: 7px;
			}
		.l-header h1 img {
			width: auto;
			height: 50px;
			}
		.l-hnav {
			display: none;
			}
		.p-hdiscL,
		.p-hdiscS {
			display: none;
			}
	}





/* sp-menu >>> */

	@media print, screen and (min-width: 768px) {
		.sp-hnav02,
		.sp-header,
		.menu-button {
			display: none;
			}
	}
	@media (max-width: 767px) {
	.sp-header {
		width: 100%;
		z-index: 9450;
		}
	}


    /* menu list */
	.nav-content {
		display: none;
		position: absolute;
		width: 100%;
		right: 0px;
		background: rgba(255,255,255,0.8);
		z-index: 9400;
		-webkit-transition: .5s top;
			  transition: .5s top;
		max-height: calc(100vh - 65px);
		overflow: scroll;
		-webkit-overflow-scrolling: touch;
		}
			
	/* sp-hnav */
	.nav-content ul {
		list-style: none;
		}

	.sp-hnavMain {
		margin-top: 5px;
		margin-bottom: 5px;
		}
	.sp-hnav01 {
		background-color: #ff9900;
		margin-bottom: 3px;
		}
	.sp-hnav02 {
		background-color: #ff9999;
		margin-bottom: 3px;
		}
	.sp-hnav03 {
		background-color: #009999;
		margin-bottom: 12px;
		}

	.sp-hnav03 dt,
	.sp-hnav02 dt,
	.sp-hnav01 dt {
		padding: 12px 5px 12px 40px;
		font-weight: bold;
		font-size: 1.6rem;
		color: #fff;
		background: url(../img/common/icon_sphnav.png) no-repeat 2% center;
		background-size: auto 25px;
		}
			.sp-hnav03 dt::after,
			.sp-hnav02 dt::after,
			.sp-hnav01 dt::after {
				content: '\f067';
				font-family: 'Font Awesome 5 Free';
				font-weight: bold;
				float: right;
				right: 0;
				padding-right: 2%;
				position: relative;
				}
			.sp-hnav03 dt.active::after,
			.sp-hnav02 dt.active::after,
			.sp-hnav01 dt.active::after {
				content: '\f068';
				font-family: 'Font Awesome 5 Free';
				font-weight: bold;
				}
		.sp-hnav03 dd,
		.sp-hnav02 dd,
		.sp-hnav01 dd {
			padding-bottom: 1%;
			display: none;
			}
		.sp-hnav03 ul,
		.sp-hnav02 ul,
		.sp-hnav01 ul,
		.sp-hnavMain ul {
			padding: 0 1% 1% 1%;
			margin-bottom: 0;
			}

		.sp-hnavList {
			width: 48%;
			box-sizing: border-box;
			margin: 0 1% 1% 1%;
			background-color: #fff;
			}
			.sp-hnavList a {
				 display: -webkit-flex;
				 display: flex;
				 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
				 align-items: center; /* 縦方向中央揃え */
				width: 100%;
				height: 100%;
				padding: 10px 15px 10px 25px;
				box-sizing: border-box;
				text-decoration: none;
				position: relative;
				color: #795f5a;
				}
			.sp-hnavMain .sp-hnavList a {
				color: #fff;
				padding: 10px 15px 10px 10px;
				}
			.sp-hnavList a:hover {
				}
			.sp-hnav03 .sp-hnavList a::before,
			.sp-hnav02 .sp-hnavList a::before,
			.sp-hnav01 .sp-hnavList a::before {
				position: absolute;
				content: '●';
				left: 5px;
				}
			.sp-hnav01 .sp-hnavList a::before {
				color: #ff9900;
				}
			.sp-hnav02 .sp-hnavList a::before {
				color: #ff9999;
				}
			.sp-hnav03 .sp-hnavList a::before {
				color: #009999;
				}
			.sp-hnavList a::after {
				position: absolute;
				content: '\f105';
				font-family: 'Font Awesome 5 Free';
				font-weight: bold;
				right: 5px;
				}


	.is-open .nav-content {
		top: 65px;
	  	}


	
/* button */
	.button-open {
		position: absolute;
		width: 60px;
		height: 50px;
		z-index: 9500;
		top: 7px;
		right: 10px;
		text-align: center;
		background: #ff9900;
		color: #fff;
		box-sizing: border-box;
		-webkit-border-radius: 4px;
			 -moz-border-radius: 4px;
						border-radius: 4px;
				-ms-border-radius: 4px;
		}
		.button-open i {
			display: block;
			height: 3px;
			width: 25px;
			left: 17px;
			top: 18px;
			border-radius: 2px;
			background: #fff;
			-webkit-transition: background 0.5s;
					transition: background 0.5s;
			position: relative;
		}
		.button-open i:before,
		.button-open i:after {
			content: "";
			display: block;
			height: 3px;
			width: 25px;
			border-radius: 2px;
			background: #fff;
			position: absolute;
			-webkit-transform: rotate(0deg);
				-ms-transform: rotate(0deg);
					transform: rotate(0deg);
			-webkit-transition: all 0.3s !important;
					transition: all 0.3s !important;
			}
		.button-open i:before {
			-webkit-transform: translateY(8px);
				-ms-transform: translateY(8px);
					transform: translateY(8px);
			}
		.button-open i:after {
			-webkit-transform: translateY(-8px);
				-ms-transform: translateY(-8px);
					transform: translateY(-8px);
			}
		.button-open span {
			display: block;
			font-size: 1.2rem;
			margin-top: 28px;
			letter-spacing: -2px;
			font-weight: bold;
			}

	
	
	.is-open .button-open i {
		background-color: transparent;
		}
		.is-open .button-open i:after {
			-webkit-transform: translateY(0px) rotate(-45deg);
				-ms-transform: translateY(0px) rotate(-45deg);
					transform: translateY(0px) rotate(-45deg);
					}
		.is-open .button-open i:before {
			-webkit-transform: translateY(0px) rotate(45deg);
				-ms-transform: translateY(0px) rotate(45deg);
					transform: translateY(0px) rotate(45deg);
					}
	


/* <<< sp-menu */




/* =====================================================================

	article
	
======================================================================== */

	.l-article {
		position: relative;
		word-break: break-all;
		background-color: #fff;
		}


	@media screen and (min-width: 768px) {
		.l-article {
			padding-bottom: 135px;
			margin-top: 160px;
			}
	}

	@media screen and (max-width: 767px) {
		.l-article {
			padding-bottom: 80px;
			margin-top: 65px;
			}
	}
	@media print {
		.l-article {
			padding-bottom: 35px;
			margin-top: 0;
			}
	}




/* =====================================================================

	page
	
======================================================================== */


	@media print, screen and (min-width: 768px) {
		.l-pageLead {
			background: url(../img/page/bg_page.jpg) no-repeat center top;
			}
		.l-pageLead p {
			margin-left: 50%;
			height: 100px;
			width: 500px;
			text-align: center;
			box-sizing: border-box;
			padding-top: 11px;
			font-weight: bold;
			}
	}
	@media (max-width: 767px) {
		.l-pageLead {
			display: none;
			}
	}





/* =====================================================================

	side
	
======================================================================== */

  /* -- sideNav -- */
  @media print, screen and (min-width: 768px) {
	.l-sideNav {
		background-color: #c5b8a5;
		box-sizing: border-box;
		padding: 0px 15px 15px 15px;
		}

	/* dt */
	.l-sideNav dt {
		padding: 15px 0 2px 0;
		}

	/* li */
	.l-sideNav ul {
		padding: 10px;
		background-color: #fff;
		box-sizing: border-box;
		}
	.l-sideNav li {
		display: block;
		width: 100%;
		}
	.l-sideNav li a {
		display: inline-block;
		width: 100%;
		font-weight: bold;
		color: #665843;
		text-decoration: none;
		padding: 2px 5px;
		box-sizing: border-box;
		}
		.l-sideOrange li a:hover {
		    text-decoration: none;
			background-color: rgba(255,153,0,0.2);
			}
		.l-sidePink li a:hover {
		    text-decoration: none;
			background-color: rgba(255,153,153,0.2);
			}
		.l-sideBlue li a:hover {
		    text-decoration: none;
			background-color: rgba(0,153,153,0.2);
			}

	/* icon */	
	.l-sideOrange a::before,
	.l-sidePink a::before,
	.l-sideBlue a::before {
		content: '●';
		margin-right: 5px;
		}
	.l-sideOrange a::before {
		color: #ff9900;
		}
	.l-sidePink a::before {
		color: #ff9999;
		}
	.l-sideBlue a::before {
		color: #009999;
		}
  }
  @media (max-width: 767px) {
	.l-sideNav {
		display: none;
		}
  }


  /* -- sideBn -- */
  @media print, screen and (min-width: 768px) {
	.l-sideBn {
		border: #C5B8A5 solid 5px;
		box-sizing: border-box;
		padding: 15px 15px;
		margin-top: 30px;
		}
	.l-sideBn li {
		display: block;
		width: 100%;
		padding: 5px 0;
		text-align: center;
		}
	.l-sideBn li:not(:last-child) {
		margin-bottom: 0;
		}
  }
  @media (max-width: 767px) {
	.l-sideBn {
		background-color: #C5B8A5;
		margin-top: 30px;
		}
	.l-sideBn ul {
		padding: 3%;
		}
	.l-sideBn li {
		width: 48%;
		text-align: center;
		}
	.l-sideBn li {
		margin-bottom: 0;
		}
  }





/* =====================================================================

	search form
	
======================================================================== */

	.l-search {
		background-color: #c5b8a5;
		box-sizing: border-box;		
		}

		.l-search .search-form {
			border: none;
			text-align: center;
			}
		.l-search .search-form .form-control {
			display: inline-block;
			float: left;
			height: 35px;
			width: 80%;
			width: -webkit-calc(100% - 90px);
			width: -moz-calc(100% - 90px);
			width: calc(100% - 90px);
			padding-left: 10px;
			box-sizing: border-box;
			background-color: #fff;
			}

	@media print, screen and (min-width: 768px) {
		.l-search {
			padding: 15px;
			}
		.l-search > div {
			width: 180px;
			text-align: center;
			float: left;
			}
			.l-search > div >img {
				margin-top: 3px;
				}
		.l-search > form {
			width: 760px;
			float: right;
			}
	}
	@media (max-width: 767px) {
		.l-search {
			padding: 2%;
			}
		.l-search .search-form .form-control {
			width: 60%;
			widht: -webkit-calc(100% - 85px);
			width: -moz-calc(100% - 85px);
			width: calc(100% - 85px);  
			}
	}




/* =====================================================================

	footer
	
======================================================================== */

.l-footer {
	clear: both;
	color: #000;
	font-weight: bold;
	position: relative;
	background-color: #ff9900;
	}
	.l-footer a {
		text-decoration: none !important;
		color: #fff;
		}
	.l-footer a:hover {
		text-decoration: none !important;
		color: #FFCC66;
		}
	@media print, screen and (min-width: 768px) {
		.l-footer {
			padding-top: 30px;
			}
	}
	@media (max-width: 767px) {
		.l-footer {
			padding-top: 20px;
			}
	}

	/* Logo & Address & QR */

	.l-fLogo {
		text-align: center;
		}

	.l-fLogo h1 {
		margin-bottom: 15px;
		text-align: center;
		}
	.l-fLogo address {
		font-style: normal;
		color: #fff;
		}
	@media print, screen and (min-width: 768px) {
		.l-fLogo {
			}
	}
	@media (max-width: 767px) {
		.l-fLogo {
			}
		.l-fLogo h1 img {
			/*max-width: 100px;
			width: 60%;*/
			}
		.l-fLogo address {
			line-height: 1.4;
			}
	}


	/* Footer menu for pc */
	@media print, screen and (min-width: 768px) {
		.l-fNav {
			text-align: center;
			padding: 60px 0 0 0;
			}
		.l-fNav a {
			color: #000;
			padding: 0 15px 0 10px; 
			}
		.l-fNav a:hover {
			color: #669933;
			}
		.l-fNav li:not(:last-child) {
			border-right: #000 solid 1px;
			}
	}

	
	/* copyright */
	.l-copyright {
		background-color: #000;
		color: #fff;
		text-align: center;
		line-height: 50px;
		font-weight: bold;
		}
	@media print, screen and (min-width: 768px) {
		.l-copyright {
			margin-top: 30px;
			}
	}
	@media (max-width: 767px) {
		.l-copyright {
			margin-top: 20px;
			}
		.l-copyright span {
			display: none;
			}
	}




	/* Pagetop for pc */

	.l-fBtn {
		position: fixed;
		opacity: 0;
		transition: all .7s;
		z-index: 100;
		pointer-events: none;
		box-sizing: border-box;
		}
		.l-fBtn li {
			}
	.l-fBtn-on {
		opacity: 1;
		pointer-events: auto;
		}
	@media print, screen and (min-width: 768px) {
		.l-fBtn {
			padding: 0 10px;
			right: 10px;
			}
		.l-fContact,
		.l-fTel {
			display: none;
			}
	}
	@media (max-width: 767px) {
		.l-fBtn {
			width: 100%;
			left: 0px;
			}
		.l-fBtn ul {
			padding: 0 2%;
			box-sizing: border-box;
			width: 100%;
			}
		.l-fBtn ul > li {
			width: 32%;
			}
			.l-fBtn ul > li img {
				width: 40px;
				height: 40px;
				}
		.l-fTel {
			text-align: left;
			}
		.l-fPagetop {
			text-align: center;
			}
		.l-fContact {
			text-align: right;
			}
	}


