@charset "utf-8";

/* HEADER
------------------------------------------------------------*/

.header {
	position: relative;
	padding: 0;
	width:100%;
	height: 36px;
	text-align: left;
	background: #f4d6df url(../images/bg_topbelt.png) repeat-x center 0;
	background-size: 1500px 36px;
}

.header h1 {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.header .inner {
	display: none;
}



/* global-nav
------------------------------------------------------------*/

#gnavi {
	width: 100%;
	height: 240px;
	padding: 0;
	z-index: 9999;
	background: #fefaf7;
}
#gnavi .global-nav-inner {
	width: 1000px;
	height: 200px;
	margin: 0 auto;
	padding: 20px 0 0;
}
#gnavi.fixed .global-nav-inner {
	margin-top: -50px;
}
#gnavi .global-nav-inner .grid {
	height: 200px;
	width: auto;
	padding: 0;
}
#gnavi .global-nav-inner .grid img {
	height: 100%;
	width: auto;
	padding: 0;
	z-index: 9999;
}
#gnavi .global-nav-inner .grid.grid01 {
	width: 32%;
	padding: 0;
	text-align: right;
}
#gnavi .global-nav-inner .grid.grid01 img {
	margin-right: 7%;
}
#gnavi .global-nav-inner .grid.grid02 {
	width: 47%;
	padding: 0;
}
#gnavi .global-nav-inner .grid.grid03 {
	width: 7%;
	padding: 0 0 0 10px;
}
#gnavi .global-nav-inner .grid.grid03 p {
	padding: 15px 0 0;
}
#gnavi .global-nav-inner .grid.grid03 img {
	width: 80%;
	height: auto;
}
#gnavi .global-nav-inner .grid.grid04 {
	width: 14%;
	padding: 0;
}
#gnavi ul {
	float: left;
	width: 470px;
	height: 200px;
}
#gnavi ul li {
	float: left;
	display: inline;
	overflow: hidden;
	text-align: center;
}
#gnavi ul li a {
	display: block;
	height: 200px;
}
#gnavi ul li a span {
	display: block;
	width: 100%;
	text-indent: -9999px;
}
#gnavi ul li.nv01 a {
	width: 70px;
	background: url(../images/gnavi/01.png) no-repeat;
	background-size: 70px 400px;
}
#gnavi ul li.nv02 a {
	width: 80px;
	background: url(../images/gnavi/02.png) no-repeat;
	background-size: 70px 400px;
}
#gnavi ul li.nv03 a {
	width: 80px;
	background: url(../images/gnavi/03.png) no-repeat;
	background-size: 80px 400px;
}
#gnavi ul li.nv04 a {
	width: 70px;
	background: url(../images/gnavi/04.png) no-repeat;
	background-size: 70px 400px;
}
#gnavi ul li.nv05 a {
	width: 100px;
	background: url(../images/gnavi/05.png) no-repeat;
	background-size: 100px 400px;
}
#gnavi ul li.nv06 a {
	width: 70px;
	background: url(../images/gnavi/06.png) no-repeat;
	background-size: 70px 400px;
}
#gnavi ul li a:hover {
	background-position: 0 bottom;
}
##gnavi.fixed {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 75px;
	height: 240px;
	z-index: 9999;
	background: #fefaf7;
}


/* FIXED HEADER
------------------------------------------------------------*/

.fheader {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100px;
	text-align: left;
	background: url(../images/bg_fheader.png) repeat-x center 0;
	z-index: 9999;
}
.fheader .inner {
	position: relative;
	width: 1000px;
	margin: 0 auto;
}
.fheader h1 {
	position: absolute;
	top: 5px;
	left: 60px;
	width: 100px;
	height: 90px;
	margin: 0;
}
.fheader .inner h1 img {
	height: 90px;
	width: auto;
}
.fheader .fixnv {
	position: absolute;
	top: 10px;
	left: 200px;
	height: 74px;
	display: block;
}
.fheader .fixnv ul {
	display: inline;
	list-style: none;
}
.fheader .fixnv ul li {
	float: left;
	display: inline;
	margin: 0;
}
.fheader .fixnv ul li a {
	display: block;
	height: 74px;
}
.fheader .fixnv ul li a span {
	display: block;
	text-indent: -9999px;
}
.fheader .fixnv ul li.fixnv01 a {
	width: 100px;
	background: url(../images/fixnavi/01.png) no-repeat;
	background-size: 100px 148px;
}
.fheader .fixnv ul li.fixnv02 a {
	width: 100px;
	background: url(../images/fixnavi/02.png) no-repeat;
	background-size: 100px 148px;
}
.fheader .fixnv ul li.fixnv03 a {
	width: 100px;
	background: url(../images/fixnavi/03.png) no-repeat;
	background-size: 100px 148px;
}
.fheader .fixnv ul li.fixnv04 a {
	width: 110px;
	background: url(../images/fixnavi/04.png) no-repeat;
	background-size: 100px 148px;
}
.fheader .fixnv ul li.fixnv05 a {
	width: 90px;
	background: url(../images/fixnavi/05.png) no-repeat;
	background-size: 90px 148px;
}
.fheader .fixnv ul li a:hover {
	background-position: 0 bottom;
}
.fheader .fixnv ul li.fixnv01,
.fheader .fixnv ul li.fixnv02,
.fheader .fixnv ul li.fixnv03 {
	width: 100px;
}
.fheader .fixnv ul li.fixnv04 {
	width: 110px;
}
.fheader .fixnv ul li.fixnv05 {
	width: 90px;
}
.fheader nav ul li img {
	height: 90px;
	width: auto;
}

.fheader .fcontact {
	position: absolute;
	top: 22px;
	left: 720px;
}
.fheader .fcontact img {
	height: 45px;
	width: auto;
}


/* 全体
------------------------------------------------------------*/
.wrapper {
	width: 100%;
	margin: 0 auto;
	padding: 0 0 40px;
	background: #fff;
}
.wrapper.fixed {
	padding: 75px 0 40px;
}
.lowdir .wrapper {
	width: 100%;
	margin: 0 auto;
	padding: 40px 0;
}

.pgancbox {
	/* padding: 50px 0 0 0;*/
	/* margin: -50px 0 40px 0;*/
}
.box {
	width: 1000px;
	margin: 0 auto;
}
.widebox {
	width:100%;
	margin: 0;
}
.imgbox {
	overflow: hidden;
	width: 100%;
	clear: both;
	text-align: center;
}
.imgbox img {
	border: 0;
}
.textbox {
	font-size: 1.2em;
	color: #111;
	text-align: left;
	line-height: 2.4em;
}


.widecolumn {
	float: left;
	width: 750px;
	padding: 0;
}
.sidecolumn {
	float: right;
	width: 210px;
	padding: 0;
}



/**************************
/* グリッド
**************************/


.gridWrapper {
	display: block;
	width: 100%;
}
* html .gridWrapper{height:1%;}

.grid {
	float: left;
}
.grid2 {
	display: inline-block;
}
.rgrid {
	margin-left: 5%;
}
.recBox {
	margin: 0;
	background:url(../images/bg_recbox.jpg);
}
.recBox a {
	display: block;
	width: 100%;
	height: 100%;
}


/*************
/* タイトル
*************/

h1.csub {
	width: 100%;
	padding: 5px 0;
	font-size: 2.6em;
	color: #197835;
	text-align: center;
}
h1.csub img {
	height: 80px;
	width: auto;
	margin: 0 auto;
}

h1.csub2 {
	width: 100%;
	padding: 5px 0;
	border-bottom: 1px solid #a23554;
}

h4.csub3 {
	width: 100%;
	padding: 4px 0;
	font-size: 1.7em;
	color: #197835;
	color: #111;
	text-align: center;
}
.widesub {
	width: 100%;
	height: 150px;
	padding: 0;
	text-align: center;
	background: #666;
}
.widesub h1 {
	width: 440px;
	height: 42px;
	margin: 0 auto;
	padding: 54px 0 0;
	text-align: center;
}
h4.evsub {
	margin: 0 auto 25px;
	padding: 0 0 12px 0;
	font-size: 1.6em;
	color: #111;
	text-align: center;
	border-bottom: dotted 1px #ccc;
}
.ctgsub {
	width: 50%;
	margin: 0 auto 30px;
	padding: 3px 6px;
	font-size: 1.5em;
	color: #197835;
	font-weight: normal;
	line-height: 1.6em;
	text-align: center;
	border: 1px solid #197835;
}


/*************
ボタン
*************/

.btn01 {
	display: block;
	width: 100%;
	padding: 5px 0;
	background: #eee0cc;
	text-align: center;
}
.btn01 a {
	display: block;
	width: 100%;
	height: auto;
}

.btn01:hover {
	background: #eee;
}
.btn02 {
	display: block;
	width: 100%;
	padding: 5px 0;
	background: #c68992;
	border: 1px solid #ab4a64;
	text-align: center;
}
.btn02 a {
	display: block;
	width: 100%;
	height: auto;
}
.btn02:hover {
	background: #ab4a64;
}
.btn03 {
	display: block;
	width: 100%;
	padding: 5px 0;
	background: #fff;
	border: 1px solid #ab4a64;
	text-align: center;
}
.btn03 a {
	display: block;
	width: 100%;
	height: auto;
}
.btn03:hover {
	background: #c68992;
}

.bline {
	width: 100%;
	height: 24px;
	margin: 5px 0;
	background:url(../images/beans_line.png);
}


/*************
メイン コンテンツ
*************/
section.content{
	margin-bottom:20px;
	font-size:14px;
	overflow:hidden;
}

* html section.content{height:1%;}












/* FOOTER
------------------------------------------------------------*/

.footer {
	width: 100%;
	padding:  10px 0 36px;
	background: #f5dce3 url(../images/bg_btmbelt.png) repeat-x center bottom;
	background-size: 1500px 36px;
}


/* #footnavi
==========================*/
#footnavi {
	position: relative;
	width: 100%;
	margin:0 auto;
	color: #fff;
	text-align: center;
	overflow: hidden;
}
#footnavi ul {
	float: left;
	left: 50%;
	margin: 0;
	padding: 2px 0 10px;
	line-height: 1.0em;
	position: relative;
}
#footnavi li {
	float: left;
	left: -50%;
	margin: 0;
	position: relative;
}
#footnavi li a {
	display: block;
	padding: 0 4px;
}
#footnavi li img {
	height: 22px;
	width: auto;
}

.footer .copyright {
	width: 100%;
	padding: 8px 0;
	font-size: 0.9em;
	color: #fff;
	letter-spacing: 0.1em;
	text-align: center;
	background: #c26790;
}

/* pagetop
------------------------------------------------------------*/

#pageTop {
	position: fixed;
	right: 2px;
	bottom: 128px;
	z-index: 13;
}
#pageTop a {
	width: 100px;
	height: 100px;
	display: block;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background-image: url(../images/pagetop.png);
	background-size: 200px 100px;
}
a.pageTopBtn {
	background-position: 0px 0px;
}
a.pageTopBtn:hover{ background-position:-100px 0;}

/* IE6 */
* html #pageTop {
	position: absolute;
	top: expression(eval(document.documentElement.scrollTop+100));
	right:0;
}


/*--------------------------------------------------------------------------
   PdNavi
---------------------------------------------------------------------------*/

/* type1 */
a.btn-type1{
	display: block;
	background: #b13c67;
	text-align:center;
	padding: 3px;
	font-size: 0;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
	border-radius: 4px;
}

#PdNavi{
	display:none;
	position:absolute;
	top: 108px;
	left:0;
	z-index:11111;
	width:100%;
	min-width:320px;
}
#PdNavi:before{
	content:" ";
	position:absolute;
	bottom:100%;
	width:0;
	height:0;
	border:solid transparent;
	pointer-events:none;
}
#PdNavi:before{
	right:35px;
	margin-left:-5px;
	border-color:rgba(1,119,175,0);
	border-bottom-color: #cc6685;
	border-width:5px;
}
#PdNavi.open{
	display:block !important;
}

#PdNavi nav{
	position:relative;
	z-index:10;
	margin:0 10px 0 10px;
	padding:0 0 3px;
	background: #cc6685;
}
#PdNavi nav ul li.level01{
	border-bottom:1px solid #f7e9ee;
}
#PdNavi nav ul li.level01:after{
	content:"";
	display:block;
}
#PdNavi nav ul li.level01.low,
#PdNavi nav ul li.level01.low:after,
#PdNavi nav ul li.level01:last-child,
#PdNavi nav ul li.level01:last-child:after{
	border-bottom:none;
}
#PdNavi nav ul li a{
	display:block;
	padding:8px 10px 7px;
}
#PdNavi nav ul li a:hover {
	color: #fff;
	background: #b13c67;
}
#PdNavi nav ul li a.first{
	padding:8px 12px 7px 12px;
	color:#FFF;
	font-size:117%;
}
#PdNavi nav ul li a.first span{
	display:block;
	background-size:8px 12px;
}

/* acd */
#PdNavi nav ul.acd{
	margin:0;
	background: #b13c67;
}
#PdNavi nav ul.acd li{
	border-bottom:1px solid #f7e9ee;
}
#PdNavi nav ul.acd li:first-child{
	border-top:1px solid #f7e9ee;
}
#PdNavi nav ul.acd li:last-child{
	border-bottom:1px solid #f7e9ee;
}
#PdNavi nav ul.acd li span.ico-open2{
	display:block;
	padding:0 8px 0 10px;
	cursor:pointer;
	color:#fff;
	font-size:117%;
	/* background: url(../images/icon_open.png) no-repeat 100% 50%; */
}
#PdNavi nav ul.acd li span.ico-open:hover {
	/* background: #000 url(../images/icon_open.png) no-repeat 100% 50%; */
	background: #000;
}
#PdNavi nav ul.acd li span.ico-open2 span{
	display:block;
	padding:8px 0 7px;
}
#PdNavi nav ul.acd li span.ico-open.open span{
	background-size:26px 28px;
}
#PdNavi nav ul.acd li span.ico-open.open{
	/* background:url(../images/icon_close.png) no-repeat 100% 50%; */
}
#PdNavi nav ul.acd li span.ico-open.open:hover {
	/* background: #000 url(../images/icon_close.png) no-repeat 100% 50%; */
	background: #b13c67;
}

/* third */
#PdNavi nav ul li ul.third{
	/*display:none;*/
	margin:0;
	color:#fff;
	background: #b13c67;
}
#PdNavi nav ul.acd li ul.third li:last-child{
	border-bottom: none;
}
#PdNavi nav ul.acd li ul.third li span{
	display:block;
	background-size:8px 12px;
}
#PdNavi nav ul li li a {
	padding-left: 17px;
	color:#fff;
}

/* close */
#PdNavi nav p.close {
	display:block;
	cursor:pointer;
	margin:0 3px;
	padding:15px 0;
	color:#fff;
	background: #b13c67;
	text-align:center;
}
#PdNavi nav p.close:hover {
	background: #b13c67;
}

a#rightArea {
	width: 87px;
	position: fixed;
	top: 100px;
	right: -20px;
	display: inline-block;
	transition: all .2s ease;
	z-index: 9999;
}
a#rightArea:hover {
	right: 0;
}
#footAreaB {
	display: none;
}


@media only screen and (max-width: 767px){

	.fheader {
			display: none !important;
	}
	#pgnavbox {
		position:fixed;
		width: 100%;
		padding: 0px 0 0;
		top: 0;
		left: 0;
		z-index:11111;
	}
	.header,
	.lowdir .header {
		position: fixed;
		width: 100%;
		height: 70px;
		background: #fff;
		z-index: 9999;
	}
	.header .inner {
		display: block;
		position: relative;
		width: 100%;
		margin: 0 auto;
	}
	.header h1 {
		display: none;
	}
	.header h2 {
		width: 40%;
		position: relative;
		margin-left: 10px;
		z-index: 99;
	}
	.header .inner h2 img.logo {
		width: 100%;
		max-width: 120px;
		height: auto;
	}
	.header nav {
		display: block;
	}
	.header nav ul {
    		position: absolute;
		top: 18px;
		right: 10px;
	}
	.header nav ul li {
		margin: 0 0 0 10px;
		display: inline-block;
	}
	.header nav ul li img {
		width: 32px;
		height: auto;
	}
	.header .topmail {
		top: 5px;
		right: 0;
		width: 140px;
	}
	.lowdir .header .inner {
		display: block;
		height: 70px;
	}
	.lowdir .header .topmail {
		top: 5px;
		right: 30px;
	}
	.header .topmail img {
		width: 140px;
		height: auto;
	}
	.lowdir .header .topfbook {
		top: 7px;
		right: 0;
		width: 32px;
		z-index: 1;
	}
	.lowdir .header .topfbook img {
		width: 28px;
		height: auto;
	}
	#gnavi {
		display: none;
	}

	.box {
		width: 94%;
		margin: 0 3%;
		padding: 0;
	}


	h1.csub img {
		height: 80px;
		width: auto;
		margin: 0 auto;
	}
	h1.csub2 img {
		width: 90%;
		max-width: 500px;
		height: auto;
		margin: 0 auto;
	}

	.btn01,
	.btn02,
	.btn03  {
		width: 100%;
		padding: 2px 0;
	}
	.btn01 img,
	.btn02 img,
	.btn02 img {
		width: 80%;
		max-width: 280px;
		height: auto;
	}


	.wrapper {
		width: 100%;
    		padding: 10px 0 0;
	}
	.lowdir .wrapper {
		width: 90%;
		margin: 0px auto;
	}
	.pgproduct .wrapper {
		width: 100% !important;
		margin: 0;
	}
	.grid {
		margin: 0;
	}


	.footer .copyright {
		padding: 6px 0 4px;
		font-size: 0.9em;
		letter-spacing: 0em;
	}

	a#rightArea {
		display: none;
	}
	a#rightArea:hover {
		display: none;
	}
	#footAreaB {
		display: block;
		width: 100%;
		position: fixed;
		left: 0px;
		bottom: 0px;
		z-index: 9999;
		text-align: center;
		padding: 0 auto;
	}
	#footAreaB img {
		max-width: 100%;
	}


}