@charset "UTF-8";
/********************************************************* reset*/
html, body, p, li, dl, dt, dd, blockquote, td, form {
	margin: 0;
	padding: 0;
}

html,
body,
#home,
#wrapper,
#gMain,
#gMainInner,
#main-wrap{
	min-height:100%;
}



h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	font-size: 100%;
}

ul, ol {
	list-style: none outside none;
	margin: 0;
	padding: 0;
}

address, em, code, cite, dfn, var, optgroup {
	font-style: normal;
}

caption, th {
	font-style: normal;
	font-weight: normal;
	margin: 0;
	padding: 0;
	text-align: left;
}

img {
	border: none;
	vertical-align: bottom;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 100%;
	line-height: inherit;
}

input, select, textarea {
	font-size: inherit;
	font-family: inherit;
}

fieldset {
	border: none;
	margin: 0;
	padding: 0;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
	display: block;
	margin: 0;
	padding: 0;
}

i {
	font-style: italic;
}

.clear:after {
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

.text-red{
	color:#d61518;
}


/********************************************************* base*/
body {
	-webkit-text-size-adjust: 100%;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', Helvetica, Arial, Verdana, sans-serif;
	/*font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", Verdana, Arial, Helvetica, sans-serif;*/
	color: #2c353f;
	line-height: 1.7;
	background-color: #fff;
	font-size: 113%; /*--113だと18pxがベースとなる(デフォルト)--*/
	/*font-size: 62.5%;　62.5だと10pxがベースとなる--*/
}

body.large {
	font-size: 125%;
}

body.small {
	font-size: 100%;
}

a:link,
a:visited {
	color: #3683EF;

}

.inner {
	max-width: 940px;
	margin: 0 auto;
}


/*-------------------------------------------------1144px▼より小さいとき----------------------------------------------------------*/
	@media screen and (max-width : 1144px)
	{
		.container {
		}
	}
/*-------------------------------------------------1144px▲----------------------------------------------------------*/




/********************************************************* header*/
#gHeaderWrap {
	position: absolute;
	ba9ckground: url(/images/top001.jpg) center center / cover no-repeat fixed;
	/*background-color: rgba(0,0,0,0.82);---------------------------トップ画面サイド　サイドメニュー　ベースカラー　ピックルオリジナル-------------------------*/
	background-color: rgba(255,255,255,0.82);
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ccffffff,EndColorStr=#ccffffff);
	/*background:url(/images/new-hp-side-backimg-006.jpg) no-repeat #fff;*/
	height: 3000px;
	width: 160px;
	position: fixed;

	/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼下層のサイドメニューの画像設定　ピックルオリジナル▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/
	/*
	background:url(/images/bg_gmenu_subpage.png) no-repeat #e2e8f3;
	width:160px;
	position: fixed;
	*/
	/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/

}

#gHeader {
	padding: 16px 0;
	position: relative;
	z-index: 20;
}

#gHeader .logo {
	line-height: 1;
	width: 120px;
	text-align: center;
	margin: 0 auto;
}

#gHeader .logo img{
	width: 100%;
	height: auto;
}

#openmenu, #closemenu {
	display: none;
	opacity: 0;
	z-index: 20;
}

#gNav {
	padding-top: 4px;
}

#gNav li {
	position: relative;
	margin: 0 auto;
	width: 140px;
	display: table;
}

/*---------------------------トップ画面　サイドメニュー日本語　文字位置　とサイズなど---------------------*/
#gNav a {
	position: relative;
	/*color: #FFF;--------------------ピックルデザイン-----------------------*/
	color: #1d2858;/*---------------サイド日本語フォントカラー----------------------*/
	vertical-align: middle;
	display: table-cell;
	-webkit-transition: background-color 0.3s ease;
	-moz-transition: background-color 0.3s ease;
	-ns-transition: background-color 0.3s ease;
	-o-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
	text-align: left;
	font-size:12.5px;
}


.word a {
	display:inline!important;
	text-align: center!important;
	color: #1978d5!important;
}


.word{
	font-family: "メイリオ",'Lucida Grande', 'Lucida Sans Unicode', "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', Helvetica, Arial, Verdana, sans-serif;
	font-size: 12.5px;
	letter-spacing: 0.05em;
	line-height: 1.3em;
	text-align: center;
	margin: 40px 0 10px;
}


#gNav a:hover {
	/*background-color: rgba(0,0,0,0.3);--------------トップ及び下層の左項目オーバー時のカラー-----------------------*/
	background-color: rgba(190,225,250,0.7);
}

#hdInfo li {
	letter-spacing: 0.1em;
	/*---------------------　トップも下層もこれを使用　文字間隔--0.1----------------------------------------------*/
	/*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
	/*border-bottom: 1px solid rgba(255,255,255,0.5);--------------トップ　ピックル左項目下部のラインカラー--------------*/
	border-bottom: 1.2px solid rgba(5,22,99,0.5);
	/*border-bottom: 1px solid rgba(0,255,0,1);*/
	/*
	-webkit-transform-origin: 0 0!important;
	-webkit-transform: scale(1, 1.01)!important;
	-moz-transform-origin: 0 0!important;
	-moz-transform: scale(1, 1.01)!important;
	-ms-transform-origin: 0 0!important;
	*/
	/*
	-ms-transform: scale(1, 1.02)!important; *//* IE9だけ1.02
	*/
	/*
	-o-transform-origin: 0 0!important;
	-o-transform: scale(1, 1.01)!important;
	*/
}

#hdInfo a {
display: block;
overflow: hidden;
height: 48px;
}
/*-----------ＰＣの左の日本語--------------------------*/
#hdInfo a span.ja{
position: absolute;
left: 4px;
top: 20px;
letter-spacing:0.15rem !important;
} 
/*-------------ＰＣの左の英語-----------------*/
#hdInfo a span.en{
position: absolute;
left:4px;
top: 6px;
/*font-size: 70%;-----------------------デフォルト-------------*/
font-size: 8.5px;
color: #1978d5;/*------------------サイドメニュー英語フォントカラー　薄い青　----------------*/
/*color: #000;----------------------サイドメニュー英語フォントカラー----------------------*/
/*color: #2883dd;-----------------------サイドメニュー英語フォントカラー　濃い青　----------------*/
letter-spacing:0.05rem !important;
}

#hdInfo li a::before,#hdInfo li a::after{
	content: "";
	position: absolute;
	display: block;
	width:10px;
	height:10px;
	/*margin-top: -7px;-------------------▼の縦位置調整　オリジナル マイナスで上に移動-----------------*/
	margin-top: -6px;
	right:0.7em;
	top:52%!important;
	/*border-top: solid 2px #fff;--------------------------ピックルデザイン右の＞カラー-------------------*/
	border-top: solid 1.2px rgba(5,22,99,0.7);
	-webkit-transform: rotate(50deg);
	transform: rotate(50deg);
}

#hdInfo li a::after{
	-webkit-transform: rotate(130deg);
	transform: rotate(130deg);
}

/**-------------------------------左項目のＣＳＳ------------------------------**/
#hdEtc {
	padding-top: 80px;
}

#hdEtc li {
	/*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
}

#hdEtc li span {
	display: block;
	padding-left: 14px;
}

#hdEtc li a {
  font-size:11px;
  letter-spacing: 0.1em;
  height: 34px;
  line-height: 1.4em;
  text-decoration: none;
}

#hdEtc li a::before,#hdEtc li a::after{
	content: "";
	position: absolute;
	display: block;
	width:7px;
	height:7px;
	margin-top: -4px;
	left:-3px;
	top:50%;
	border-top: solid 1.2px #555;
	-webkit-transform: rotate(50deg);
	transform: rotate(50deg);
}

/*------------請求書download-----ここから--------------*/
#hdEtc-dl {
	margin:0 0 0 8px;
}

#hdEtc-dl p {
	margin-bottom:-3px;
	padding-top: 5px;
    font-size:11px;
	color: #1d2858;
	letter-spacing: 0.1em;
}

#hdEtc-dl a {
	text-decoration: none;
    font-size:11px;
	color: #1d2858;
	letter-spacing: 0.12em;
	vertical-align: 2px !important;
}

.mgn-dl:hover{
	background-color: rgba(255,255,255,0)!important;
}

/*------------請求書download------ここまで-------------*/




/*----------------------------------------------------------------------------下記の記述でIEでの”＞”記号のずれを修正▼-----------------------------------------*/
	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
		#hdEtc li:nth-child(1) a::before, #hdEtc li:nth-child(1) a::after{
			top:50% !important;
		}
	}
	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
		#hdEtc li:nth-child(2) a::before, #hdEtc li:nth-child(2) a::after{
			top:100% !important;
		}
	}
/*-----------------------------------------------------------------------------------------------------------------------*/

#hdEtc li:nth-child(3){
	margin-top: 10px;
}

#hdEtc li a span.en{
	color: #ff0000;
}


#hdEtc li a::after{
	-webkit-transform: rotate(130deg);
	transform: rotate(130deg);
}

.copyright{
  /*font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;*/
  
  color: #999;
  font-size: 10px;
  letter-spacing: 0.05em;
  line-height: 1.3em;
  text-align: center;
  padding-top: 10px;
}


/*--------------------------------------------------------------------1144px▼より小さいとき-----------------------------------------*/
	@media screen and (max-width : 1144px)
	{
		#gHeaderWrap {
		b9ackground-color: rgba(0,0,0,0.3);
		width: 100%;
		height: 66px;
		z9-index: 101;
		z-index: 101;
		position:absolute !important;
		}

		#gHeader {
		padding: 8px 0;
		z-9index: 119;
		z-9index: 101;
		}

		#gHeader .logo {
		width: 100%;
		text-align: center;
		padding: 7px 0 0;
		}

		#gHeader .logo img {
		height: 40px;
		width: auto;
		}

		#openmenu.active {
		display: block;
		opacity: 1;
		z-index: 21;
		}

		#openmenu, #closemenu {
		position: absolute;
		width: 60px;
		height: 60px;
		top: 0px;
		right:2%;
		}

		#closemenu.active {
		display: block;
		opacity: 1;
		z-index: 21;
		}

		/*スマホ画面上部タイトルバー*/
		#openmenu span::before,#openmenu span::after,#openmenu::after{
			content: "";
			position: absolute;
			display: block;
			width:60%;
			height:1px;
			left:20%;
			top:20%;
			/*スマホ画面上部メニューＯＰＥＮアイコンの色*/
			border-top: solid 4px #003399;
		}

		#openmenu::after{
			top:45%;
		}
		#openmenu span::after{
			top:70%;
		}
		/*スマホ上部メニューの閉じるアイコン*/
		#closemenu span::before,#closemenu span::after{
			content: "";
			position: absolute;
			display: block;
			width:80%;
			height:1px;
			margin-top: 20%;
			left:10%;
			top:25%;
			/*アイコンカラー*/
			border-top: solid 4px #003399;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		#closemenu span::after{
			-webkit-transform: rotate(135deg);
			transform: rotate(135deg);
		}

		#openmenu:hover, #closemenu:hover {
			/*------------------------------トップ　スマホ　メニュー　オープン　アイコンオーバー時の色*/
			/*background-color: rgba(0,0,0,0.3);*/
			background-color: rgba(0,0,0,0.2);
			cursor:pointer;
			-webkit-transition-duration:0.4s;
			transition-duration:0.4s;
		}

		#gNav {
			display: none;
			/*display: block;
			position: absolute;*/
			width: 100%;
			/*top: -1000px;
			opacity: 0;
			he9ight: 1px;*/
			/*----------------------トップ　スマホ　メニューバーのバックカラー--------------------------*/
			/*background-color: rgba(0,0,0.3,0.82);*/
			background-color: rgba(255,255,255,0.9);
			/* -webkit-transition-duration:0.5s;
			transition-duration:0.5s;*/
			position:absolute;
			top:66px;
			border-top: 1px solid rgba(0,0,0,0.5);
			z-index:100;
		}

		#gNav.active {
			display: block;
			z-index: 10;
			top: 88px;
			opacity: 1;
		}

		#gNav li {
		margin-left: 5%;
		width: 90%;
		display: table;
		}

		#gNav a:hover {
			/*background-color: rgba(0,0,0,0.1);-------------------------------トップ　スマホ　メニュー　オーバー　カラー--------------------*/
			background-color: rgba(190,225,250,0.7);
		}

		#hdInfo li {
			border-bottom: 1px solid #bbb;
			border-bottom: 1px solid rgba(0,0,0,0.2);
		}

		#hdInfo a {
			display: block;
			overflow: hidden;
			height:auto;
			text-align: center;
			padding: 12px 0;
			text-decoration: none;
		}

		/*----------------------------------------------トップも下層もすべてスマホのメニューフォントデザインはここ----------------------------*/
		#hdInfo a span.ja{
			color: #555;
			top: 35px;
			position:static;
			width: 100%;
			font-size: 14pt;
		}  

		#hdInfo a span.en{
			display:none;
		}
		
		#hdInfo li a::before,#hdInfo li a::after{
			width: 0;
			height: 0;
		}

		#hdEtc {
		padding-top: 0px;
		}
		#hdEtc li {
		margin-left: 5%;
		width: 90%;
		border-bottom: 1px solid #bbb;
		border-bottom: 1px solid rgba(0,0,0,0.2);
		}
		#hdEtc li:nth-child(2){
		display: none;
		}
		#hdEtc p br:nth-child(1){
		display: none;
		}
		#hdEtc li span {
		display: block;
		padding-left: 12px;
		}
		
		#hdEtc li a {
		color: #555;
		/*スマホサイズのサイトご利用フォントカラー*/
		font-size: 14pt;
		/*スマホサイズのサイトのご利用Ｈサイズ*/
		height: 90px;
		text-align: center;
		width: 100%;
		}
		#hdEtc li a::before,#hdEtc li a::after{
		width: 0;
		height: 0;
		}
		
		#hdEtc .word a {
		font-size: 18px;
		color: #888;
		}

		.word{
		margin: 15px 0 0 0;
		height: 25px;
		}
		
		.copyright{
		/*color: #555;
		font-size: 130%;
		padding-top: 50px;*/
		display:none;
		}
		
		#hdEtc-dl{
		display:none;
		}


	}
/*-----------------------------------------------------------------------------1144px▲------------------------------------------*/

/********************************************************* main*/
#gMain {
	overflow: hidden;
	float: right;
	width: 100%;
	margin: 0 0 0 -201px;
}

#gMainInner {
	position: relative;
	margin: 0 0 0 201px;
	padding: 10px;
}

#gPath {
	padding: 16px 0 44px 0;
	font-size: 88%;
}

#gPath li {
	display: inline;
}

#gPath a {
	color: #0073bd;
	text-decoration: underline;
}

#gPath a:hover {
	text-decoration: none;
	color: #27cdd7;
}

#pageHead {
	margin-bottom: 32px;
}

#pageHead h1 {
	font-size: 163%;
}


/*------------------------------------------------------1144px追加より小さいとき-------------------------------------------------------*/
	@media screen and (max-width : 1144px)
	{
		#gMain {
			width: 100%;
			margin: 88px 0 0 0;
		}
		
		#gMainInner {
			margin: 0;
		}
		
	}
	
/*------------------------------------------------------1144px追加-------------------------------------------------------*/






/********************************************************* hover*/
.hover {
-webkit-transition: opacity 0.3s ease;
-moz-transition: opacity 0.3s ease;
-ns-transition: opacity 0.3s ease;
-o-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
}
.hover:hover {
opacity: .7;
}

/********************************************************* clearfix*/
.cf:before, .cf:after {
content: "";
display: table;
}

.cf:after {
clear: both;
}

.cf {
zoom: 1;
}

html body .landscape{
position:absolute !important;
z-index: 100;
}