@charset "utf-8";

/* basic style
------------------------------------------------------------------------------------ */
body	{
		color:#555;
		background:url(../img/img_mainbg.gif) repeat-x top left;
		font-family:Meiryo,Osaka;
		font-size:13px;
	}

a:link,
a:visited{ color:#6457A7; text-decoration:underline;}
a:hover,
a:active{ color:#6457A7; text-decoration:none;}
a.opacity{ transition: 0.5s;}
a.opacity:hover{ opacity:0.85;}

img	{
	border:none;
	max-width:100%;
	height:auto;
}
table{
	border-collapse: collapse;
	border-spacing:0;
	width:100%;
}
table th,
table td{
	box-sizing: border-box;
	padding:10px 5px;
	text-align: left;
	vertical-align: top;
}
table th{
	border-bottom:#6457A7 solid 1px;
	font-weight:bold;
}
table td{
	border-bottom:#ccc solid 1px;
}
.ptitle_detail{
	font-weight:bold;
}
.clear { clear:both; }


/* wrapper
--------------------------------------------------------------------- \*/
#wrapper {
	width:90%;
	max-width:900px;
	margin:0 auto;
}


/* header 
--------------------------------------------------------------------- \*/
ul.spHeader {
	display: none;
}
header[role="banner"] {
  position: relative;
  width: 100%;
}
header[role="banner"] .innerBg {
  width: 100%;
}
header[role="banner"] .inner {
  letter-spacing: -.4em;
	padding:15px 0;
}
header .inner::after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
header[role="banner"] .inner h1,
header[role="banner"] .inner .company_info {
  width: 50%;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  letter-spacing: normal;
  vertical-align: middle;
}
header[role="banner"] .inner .company_info{
	text-align: right;
}
header[role="banner"] .inner .company_info h2{
	font-size:13px;
	margin-bottom:5px;
}
header[role="banner"] .inner .company_info p{
	font-size:12px;
	margin-bottom:10px;
}
header[role="banner"] .inner .company_info p span{
	margin-right:7px;
}


/* kv
--------------------------------------------------------------------- \*/
.KV {
	width:100%;
  height: auto;
  overflow: hidden;
  position: relative;
  margin: 0 auto;
}
.KV .KVtext a {
	width: 50%;
	max-width:210px;
	height:auto;
  z-index: 20;
	position: absolute;
	bottom:5%;
	right:2%;
}

/* global menu
--------------------------------------------------------------------- \*/
nav[role="navigation"] ul.global {
	letter-spacing: -0.4em;
  text-align: center;
}
nav[role="navigation"] ul.global li {
  position: relative;
  display: inline-block;
	background: linear-gradient(#06082F,#38436A);
  letter-spacing: normal;
  text-align: center;
  width: 22%;
	vertical-align: middle;
  *display: inline;
  *zoom: 1;
	transition: 0.5s;
}
nav[role="navigation"] ul.global li.navigationBnr{
  display: none;
  background-color: #ededed;
}
nav[role="navigation"] ul.global li.navigationBnr a{
  margin: 0;
}
nav[role="navigation"] ul.global li:nth-child(2) {
	width: 34%;
}
nav[role="navigation"] ul.global li a {
  border-left: 1px solid #747a92;
	display:block;
	text-decoration: none;
	margin:1em 0;
	padding:0;
}
nav[role="navigation"] ul.global li:first-child a {
  border-left: none;
}
nav[role="navigation"] ul.global li a span.mainText{
	background:url(../img/iconGoldArrow.png) no-repeat left top 2px;
	color:#fff;
	display:inline-block;
	font-size:12px;
	margin-left:-13px;
	padding-left:13px;
	padding-bottom:7px;
}
nav[role="navigation"] ul.global li a span.subText{
	color:#cfbf95;
	display:block;
	font-size:9px;
}
nav[role="navigation"] ul.global li:hover,
nav[role="navigation"] ul.global li.current{
	background:linear-gradient(#ffffff,#D9D9D9);
	background-size:cover;
}
nav[role="navigation"] ul.global li:hover a span.mainText,
nav[role="navigation"] ul.global li.current a span.mainText{
	color:#6457A7;
	font-weight:bold;
}
nav[role="navigation"] ul.global li:hover a span.subText,
nav[role="navigation"] ul.global li.current a span.subText{
	color:#666;
}


/* content
--------------------------------------------------------------------- \*/
#content{
	margin:0 auto;
	border-right:1px solid #dcdcdc;
	border-left:1px solid #dcdcdc;
	padding:20px 2% 50px;
	overflow:hidden;
}

/* main
--------------------------------------------------------------------- \*/
.main	{
	width:72%;
	max-width:660px;
	margin:0 3% 50px 0;
	float:left;
	}
.main .lead  {
	border-bottom:1px solid #ddd;
	padding-bottom:10px;
	margin-bottom:20px;
	overflow: auto;
}
.main h3{
	background:url(../img/iconFoot.png) no-repeat left top;
	background-size:18px 27px;
	color:#6457A7;
	font-size:18px;
	font-weight:bold;
	padding: 7px 0 10px 25px;
}
.main h4{
	color:#6457A7;
	font-size:16px;
	font-weight:bold;
	margin-bottom:10px;
}
.main p {
	margin-top:5px;
	line-height:1.5em;
}
.main p.pagetop{
	text-align: right;
	margin-bottom:15px;
}
.main dt{
	font-weight:bold;
}
.main dt span{
	color:#6457A7;
	margin:0 3px;
}
.main dd{
	margin-bottom:20px;
	line-height:1.6em;
}
.main .mainContents {
	padding-top:20px;
}
.main .mainContents	p{
	margin-bottom:50px;
}
.main .mainContents	ul	{
	text-align:center;
}
.main .mainContents	li	{
	margin:0 1em;
	padding:0;
	display:inline;
}


/* right banner
--------------------------------------------------------------------- \*/
.rightBnr	{
	width:25%;
	max-width:280px;
	float:right;
	background-color:#ededed;
}
.rightBnr ul{
	padding:20px;
	text-align: center;
}
.rightBnr li {
	margin-bottom:10px;
	padding:0;
	width:100%;
	transition: 0.5s;
}
.rightBnr li:hover{
	opacity: 0.7;
}
.rightBnr li img{
	width:100%;
	height:auto;
	max-width:190px;
}
.rightBnr span {
	font-size:9px;
	margin:3px 0 0 0;
	text-align:center;
	display:block;
}

.rightBnr .flBanner{
	position: relative;
	z-index:1;
}
.rightBnr object{
	width:100%;
	height:auto;
	min-height:58px;
}
.rightBnr .flBanner .flBannerBlock {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:2;
}
.rightBnr .flBanner .flBannerBlock a{
	display:block;
	width:100%;
	height:100%;
}
.rightBnr .flBannerBlock a:hover {
	background:none;
}
.rightBnr .flBannerBlock img{
	height:100%;
}


/* footer
--------------------------------------------------------------------- \*/
footer {
	clear:both;
	background: url(../img/img_footerbg.gif) repeat-x top left;
	font-size:11px;
	overflow:auto;
	padding:15px 0;
	width:100%;
}
footer #footerWrapper{
	width:90%;
	margin:0 auto;
	max-width:900px;
}
footer #footerWrapper  li {
	background:url(../img/iconGrayArrow.png) no-repeat left center;
	float:right;
	margin:0 0 10px 25px;
	padding-left:10px;
}
footer #footerWrapper li a:link,
footer #footerWrapper li a:visited,
footer #footerWrapper a:active{
	color:#666;
	text-decoration:none;
}
footer #footerWrapper li a:hover{
	text-decoration: underline;
}
footer #footerWrapper li.totop{
	background:none;
	position:fixed;
	bottom:30px;
	right:10px;
	text-align:right;
	z-index:2147483647;
}
footer #footerWrapper li.totop img{
	width:auto;
	height:auto;
}
footer #copyright{
	clear:both;
}



/** smartphone and smalltablet
--------------------------------------------------------**/
@media screen and (max-width:850px) and (min-width:641px){
	nav[role="navigation"] ul.global li{
		width: 50%!important;
	}
	nav[role="navigation"] ul.global li:nth-child(3) a {
  	border-left: none;
	}
}
@media screen and (max-width:640px){

	/** basic style **/
	body	{
		background:none;
		background-color:#fff;
	}

	/* wrapper */
	#wrapper {
		width:100%;
		max-width:100%;
	}

	/* header */
	ul.spHeader {
		display: inline-block;
    height: auto;
		position:absolute;
    top: 5px;
    right: 5px;
		z-index: 50;
	}
	ul.spHeader li {
    width: 50px;
    height: 50px;
		position: relative;
	}
	ul.spHeader li.spmenu li img {
    width: 100%;
    height: 100%;
	}

	header[role="banner"] .innerBg,
	header[role="banner"] .inner{
		height:60px;
	}
	header[role="banner"] .inner{
		padding:0;
	}
	header[role="banner"] .inner h1{
		padding:5px 15px;
	}
	header[role="banner"] .inner h1 img{
		height:50px;
	}
	header[role="banner"] .inner .company_info{
		display:none;
	}
	

	/* global navi */
	nav[role="navigation"] {
    display: none;
    margin: 0;
    padding: 0;
    z-index: 50;
    width: 100%;
    background: #2A3359;
    position: absolute;
    top: 60px;
    right: 0;
	}
	nav[role="navigation"] ul.global {
		border-top: #2A3359 solid 3px;
    width: 100%;
	}
	nav[role="navigation"] ul.global li{
		background: #2A3359;
		border-bottom:1px solid #747a92;
    width: 100%;
    text-align: left;
    border-left: none;
	}
  nav[role="navigation"] ul.global li.navigationBnr{
    display: block;
  }
  nav[role="navigation"] ul.global li:nth-child(2) {
  	width: 100%;
  }
	nav[role="navigation"] ul.global li:hover,
	nav[role="navigation"] ul.global li.current{
		background:#eee;
	}
	nav[role="navigation"] ul.global li a,
	nav[role="navigation"] ul.global li:hover a{
		border-left:none;
    display: block;
    padding: 1.5em 1.5em;
	}
	nav[role="navigation"] ul.global li a span.mainText{
		background:url(../img/iconGoldArrow.png) no-repeat left top 2px;
		display:block;
		font-size:13px;
		margin-left:0;
		padding-left:15px;
		padding-bottom:0;
	}
	nav[role="navigation"] ul.global li a span.subText{
		display:none;
	}

	
	/* content  */
	#content{
		width:95%;
		margin:0 auto;
		border-right:none;
		border-left:none;
		padding:20px 0 50px;
	}
	

	/* main & right banner */
	.main,
	.rightBnr{
		width:100%;
		max-width:100%;
		margin-right:0;
		float:none;
	}
	.main .mainContents	li{
		display:block;
		margin-bottom:15px;
	}
	.rightBnr ul{
		letter-spacing: -0.4em;
		padding:10px;
	}
	.rightBnr ul li{
		display:inline-block;
		letter-spacing: normal;
		vertical-align: top;
		width:48%;
		margin:0 1% 10px;
	}
	
	/** footer **/
	footer #footerWrapper  li{
		float:none;
		margin-left:0;
	}
}


@media screen and (max-width:320px){
	.rightBnr ul{
		letter-spacing: normal;
	}
	.rightBnr ul li{
		width:100%;
	}
}