@charset "UTF-8";
/*
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*=================================== 
	Base 
===================================*/

body{
	overflow-x: hidden;
	height: 100%;
	background:url(../img/rogo-back.png) repeat-y top right,url(../img/110310200304.png) repeat;
	
}

/*=============文字サイズ=============*/
#main p {
	font-family: "Sawarabi Mincho";
	font-size:90%;
	line-height:2;
	letter-spacing: 0.08em;
	color:#595959;
	}
/* Noto Sans JP　font-family: "Noto Sans JP"; */
/* さらわび明朝　font-family: "Sawarabi Mincho"; */


/*=================================== 
	リンクの変化 
===================================*/
#side a{
	transition: 1.0s ;
}
#side a:hover {
	opacity: 0.5 ;
}

#main a{
	transition: 1.0s ;
}
#main a:hover {
	opacity: 0.5 ;
}

/*=================================== 
	左側 
===================================*/
#header{
	width:230px;
	position: fixed;
	text-align: center;
	padding-top: 30px;
	z-index: 101;
}
img.pc{
	width:160px;
}
#side{
	width:230px;
	background:url(../img/back.png) repeat-x #000;
	box-shadow: 3px 0 10px rgba(0, 0, 0, 0.5);
	position: fixed;
	text-align: center;
	padding-top: 310px;
	height: 100%;
	z-index: 100;
}

#side .kisetu{
	margin-top:20px;
}

#wagasi-nav{
	overflow:hidden;
	margin:0 40px;
	margin-top:5px;
	
}

#wagasi-nav ul li{
	float:left;
	padding-right:13px;
}
#wagasi-nav ul li:last-child{
	padding-right:0px;
}
/*=========メニュースタイル=========*/
#globalMenu{
	border-top:#fff 1px solid;
	margin:0 35px;
	text-align: center;
}
#globalMenu ul{
	overflow: hidden;
	display: inline-block;
	}
#globalMenu li{
	float: right;
}
#globalMenu a{
	display:block;
	width:22px;
	height:254px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	color: #fff;
	margin-top:30px;
	margin-left:20px;
	
}

#globalMenu .gnav01 a{
	background: url(../img/nav1.png) no-repeat;
}
#globalMenu .gnav02 a{
	background: url(../img/nav2.png) no-repeat;
}
#globalMenu .gnav03 a{
	background: url(../img/nav3.png) no-repeat;
}
#globalMenu .gnav04 a{
	background: url(../img/nav4.png) no-repeat;
	margin-left:0px;
}

/* ロゴ画像　パソコンで見たときは"pc"のclassがついた画像が表示される */
.sp { display: none !important; }
/* ロゴ画像　スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 800px) {
.pc { display: none !important; }
.sp { display: inline-block !important; }
}

/* ---------------------------------
   調整用レイアウト
　 ウィンドウ幅が800pxより大きく、
　 800px以下の場合
----------------------------------- */
@media only screen and (max-width: 800px) {
	#globalMenu ul {
		width: 100%;
	}

	#globalMenu ul li {
		width: 20%;
	}
	
	#header{
	width: 100%;
	padding: 10px 0;
	position: static;
	background:#000;
	opacity: 0.6;

}
	#header img{
	width: 160px;
}
	#side{
	display:none;
}
}

/* ---------------------------------
   モバイル向けナビゲーション
   ウィンドウ幅が800px以下の場合
---------------------------------- */
@media only screen and (max-width: 800px) {

/* PC用ナビゲーションメニューを非表示に */
	#globalMenu {
		display: none;
	}

/* メニューエリアのスタイル */
	#rwdMenuWrap {
		width: 100%;
		border-bottom: #aaa 1px solid;
	}

/* ボタンエリア全体のスタイル */
	#rwdMenuWrap #switchBtnArea {
		width: 100%;
		height: 60px;
		background: #3c3c3c;
		opacity: 0.6;
		position: relative;
		
	}

/* メニューを開くボタンのスタイル */
	#rwdMenuWrap #switchBtnArea #switchBtn {
		top: 10px;
		right: 10px;
		width: 40px;
		height: 40px;
		background: #a7a7a7 url(../img/btnOpen.png) no-repeat center center;
		border-radius: 5px;
		position: absolute;
	}

/* 閉じるボタンのスタイル */
	#rwdMenuWrap #switchBtnArea #switchBtn.btnClose {
		background-image: url(../img/btnClose.png);
	}

/* メニューリストのスタイル */
	#rwdMenuWrap ul {
		width: 100%;
		display: none;
	}

	#rwdMenuWrap ul li {
		width: 100%;
		border-bottom: #aaa 1px solid;
	}

	#rwdMenuWrap ul li a {
		padding: 15px 20px;
		text-align: left;
		background: #ebebeb url(../img/linkarw.png) no-repeat right center;
		display: block;
		color:#7f7f7f;
		text-decoration: none;
		
	}

	#contents {
		width: 100%;
	}

	#contents p {
		padding: 0 20px 2em 20px;
	}
}

/* ------------------------------
   CLEARFIX ELEMENTS
------------------------------ */
#globalMenu > ul:before,
#globalMenu > ul:after {
	content: " ";
	display: table;
}
#globalMenu > ul:after {clear: both;}
#globalMenu > ul {*zoom: 1;}


/*=================================== 
	右側 
===================================*/
#main{
	display:none;
	padding-left: 230px;
}



/* -----------------モバイル向けメイン----------------*/
@media only screen and (max-width: 800px) {
#main{
	padding:0;
	width: 100%;
	}
}

/*=================================== 
	フッター 
===================================*/
#footer{
	padding:8px 0;
	padding-left:50%;
	bottom: 0;
	width: 100%;
	
}

footer p{
	font-family: "Noto Sans JP";
	font-size:70%;
}

/* -----------------モバイル向けフッター----------------*/
@media only screen and (max-width: 800px) {
#footer{
	padding:0;
	width: 100%;
	text-align: center;
}
}

/* 「トップページへ」ボタンのスタイル */
#fixedTop {
	padding: 15px 20px;
	right: 10px;
	bottom: 10px;
	color: #fff;
	text-align: center;
	display: none;
	background: #996699;
	position: fixed;
	z-index: 99;
	text-decoration: none;
}

/*=================================== 
	アイコンフォント 
===================================*/
@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?v9wxgm');
  src:  url('fonts/icomoon.eot?v9wxgm#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?v9wxgm') format('truetype'),
    url('fonts/icomoon.woff?v9wxgm') format('woff'),
    url('fonts/icomoon.svg?v9wxgm#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-phone:before {
  content: "\e942";
}
.icon-mail4:before {
  content: "\ea86";
}
.icon-facebook2:before {
  content: "\ea91";
}