@charset "utf-8";
/* ------------------------------------------------------ *
	icon
 * ------------------------------------------------------ */
@font-face {
	font-family: 'webicon';
	src:url('fonts/webicon.eot?-5nmdhq');
	src:url('fonts/webicon.eot?#iefix-5nmdhq') format('embedded-opentype'),
		url('fonts/webicon.woff?-5nmdhq') format('woff'),
		url('fonts/webicon.ttf?-5nmdhq') format('truetype'),
		url('fonts/webicon.svg?-5nmdhq#webicon') format('svg');
	font-weight: normal;
	font-style: normal;
}

#footer li a:before,
[class^="icon-"]:before, [class*=" icon-"]:before,
[class^="icon-"]:after, [class*=" icon-"]:after {
	font-family: 'webicon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	vertical-align:middle;
	color:#418559;
}
[class^="icon-bf"]:before, [class*=" icon-bf"]:before {	margin-right:0.5em;}
[class^="icon-af"]:after, [class*=" icon-af"]:after {	margin-left:0.5em;}
.bfR:before,
.afR:after {	float:right; padding-top:0.15em!important;}
.bfL:before,
.afL:after {	float:left; padding-top:0.15em!important;}

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

.icon-af-home01:after,
.icon-bf-home01:before {	content: "\e600";}
.icon-af-arrow02:after,
.icon-bf-arrow02:before {	content: "\e601";}
.icon-af-arrow01:after,
.icon-bf-arrow01:before {	content: "\e602";	padding:0 0.2em 0 0.2em;}
.icon-af-search01:after,
.icon-bf-search01:before {	content: "\e603";}
	.lt-ie8 .icon-af-search01:after,
	.lt-ie8 .icon-bf-search01:before {	content: "　"; background:url(../img/lt-ie8_icon-search01.png) left center no-repeat;}
.act.icon-af-search01:after,
.act.icon-bf-search01:before,
.act.icon-af-menu:after,
.act.icon-bf-menu:before,
.icon-af-x:after,
.icon-bf-x:before {	content: "\e604";}
	.lt-ie8 .icon-af-x:after,
	.lt-ie8 .icon-bf-x:before{ 	content: "　"; background:url(../img/lt-ie8_icon-x.png) left center no-repeat;}
.icon-af-blank01:after,
.icon-bf-blank01:before {	content: "\e605";}
.icon-af-arrow03:after,
.icon-bf-arrow03:before {	content: "\e606";}
.icon-af-menu:after,
.icon-bf-menu:before {	content: "\e607";}
	.act .icon-af-menu:after,
	.act .icon-bf-menu.act:before {	content: "\e604";}
.icon-af-circle01:after,
.icon-bf-circle01:before {	content: "\e608";}
.icon-af-printer:after,
.icon-bf-printer:before {	content: "\e60a";}
.icon-af-tel:after,
.icon-bf-tel:before {	content: "\e609";}
.icon-af-add:after,
.icon-bf-add:before {	content: "\e60b";}
.icon-af-remove:after,
.icon-bf-remove:before {	content: "\e60e";}
.icon-af-inquiry:after,
.icon-bf-inquiry:before {	content: "\e60c";}

}

.icon-circle{	display:block;	background:#FFF;	color:#8B455C!important;	text-align:left;	border:solid 1px #EEE1E9;	padding:3px 0 1px 35px!important;	line-height:1.5em!important;	font-size:123.1%!important;	text-indent:-35px!important;}
	.icon-circle:before{ content:"";	display:inline-block;	width:23px;	height:23px;	margin:0px 5px;	background:url(../img/common.png) -282px -72px no-repeat; vertical-align:top;}
/* ===================================================================
 style info : サイト内共通のモジュール設定
=================================================================== */

p,h1,h2,h3,h4,h5{	background-image:url(bg-p.gif);}

body {	height:100%; background:url(../img/bg-body.png) repeat;	color: #333333;	-webkit-text-size-adjust: none;/*webkitフォントサイズ対策*/}
body > *{	min-width:980px;}
	@media screen and (max-width: 640px){
		html,body{	-webkit-font-smoothing: antialiased;	-moz-osx-font-smoothing: grayscale;-webkit-backface-visibility: hidden;	-moz-backface-visibility: hidden;	-ms-backface-visibility: hidden;	-o-backface-visibility: hidden;	backface-visibility: hidden;}
		body > *{	min-width:320px;}
	}

/* ------------------------------------------------------ *
	logo & btn
 * ------------------------------------------------------ */
[class^="logo"]{	display:block;	background:url(../img/common.png);	text-indent:110%;	white-space:nowrap;	overflow:hidden;	margin-bottom:20px;}
	.logo01{	width:353px;	height:73px;	background-position:0 0;	float:left;}
	.logo02{	width:379px;	height:106px;	background-position:-363px 0;}
	@media screen and (max-width: 640px){
		[class^="logo"]{	display:block;	background:url(../img/sp-logo.png) no-repeat;	background-size:contain;	width:150px;	height:23px;	margin:12px 0;}
	}

#btn-totop{	display:block;	width:40px;	height:40px;	position:absolute;	right:0; bottom:20px;	background:url(../img/common.png) -752px 0 no-repeat;	text-indent:110%;	white-space:nowrap;	overflow:hidden;}
	@media screen and (max-width: 640px){
		#btn-totop{	margin:0 10px 0 0;	background:#418559;	border-radius:50%;}
		#btn-totop:after{	content:'';	display:block;	width:12px;	height:12px;	border-width: 2px 2px 0 0;	border-color:#FFF;	border-style:solid;	position:absolute;	left:50%;	top:50%;	margin:-3px 0 0 -7px;	-webkit-transform:rotate(-45deg);	transform:rotate(-45deg);}
	}
/* ------------------------------------------------------ *
	header 
 * ------------------------------------------------------ */
#header{	width:100%;	background:url(../img/bg-loop-x01.png) 0 0 repeat-x;	position:relative;	z-index:+2;}
	
#headerInner{	display:block;	max-width:960px;	margin:0 auto;	position:relative;}
		#headerInner > div > p{	position:absolute;	width:280px;	left:370px;	top:32px;	color:#333;	font-size:85%;	line-height:1.2em;}
	
#headerBtnBox{	float:right;	margin:8px 0 0;}
	#headerBtnBox a{	display:block;	/*padding:15px 0 18px;*/	float:right; vertical-align:middle; color:#545454; text-align:center; line-height:1em;	text-decoration:none;}
		#headerBtnBox span{	display:table-cell;	width:50px!important;	height:50px!important;	vertical-align:middle;}
	#headerBtnBox a span:after{ margin:0!important;	line-height:30px;}
	
	#headerBtnShop{	display:block;float:right;width:130px;color:#418559!important;font-weight:bold;text-align:center;padding:8px 22px;background-color:#fff;border:2px solid #418559;margin:10px 0;}

	.btn-sns{margin:15px 0 10px 10px;width:20px;}

	a[class^="btn-lang"]{	width:64px;	height:31px;	margin:0 5px;	background:url(../img/btn-lang.png) 0 0 no-repeat;}
	a.btn-lang-ja{	background-position:0 0;}
	a.btn-lang-en{	background-position:-84px 0;}
	a.btn-lang-fr{	background-position:-168px 0;}
	a.btn-lang-cn{	background-position:-252px 0;}
	a.btn-lang-tcn{	background-position:-335px 0;}
	a[class^="btn-lang"] span{	 font-size:0;}

	.ja .btn-lang-ja,
	.en .btn-lang-en,
	.fr .btn-lang-fr,
	.zh-CN .btn-lang-cn,
	.zh-TW .btn-lang-tcn{	display:none!important;}
@media screen and (max-width: 640px){
	#header{	height:50px;	overflow:visible;	box-shadow:0 0 4px #B6B6B6;	border-top:solid 1px #418559;}
	#headerInner{	padding:0 0 0 10px;}
	#headerBtnBox{	margin:0;}
	#headerBtnShop{	display:none!important;}
	
	.btn-sns{display:none!important;}

	a[class^="btn-lang"]{margin:0;}
	[class^="btn-lang"] span:after{	font-family:"Courier New", Courier, monospace!important; font-size:16px;	font-weight:bold;}
	.btn-lang-ja span:after{	content:"Ja";}
	.btn-lang-en span:after{	content:"En";}
	.btn-lang-cn span:after{	content:"Cn";}
	.btn-lang-fr span:after{	content:"Fr";}
	.btn-lang-tcn span:after{	content:"Tcn";}
	
	#headerBtnBox a{	width:40px!important;	padding:0;	height:50px!important; font-size:123.1%;	background-image:none!important;	border-left:solid 1px #EEE;}
	#headerBtnBox span{	display:table-cell;	width:40px!important;	height:50px!important;	}
	#headerBtnBox a.act{	 color:#FFF!important; 	background-color:#418559;}
	#headerBtnBox a.act span:after{	 color:#FFF!important;}
}

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

@media screen and (min-width: 641px){
	.global-nav{	display:block;	width:960px;	height:30px;	overflow:hidden;	box-shadow:0px 0px 3px #999;	margin:0 auto;}
		.global-nav ul{	display:block;	width:960px; margin:0 auto;	background:url(../img/common.png) 0 -146px no-repeat; zoom:1;}
		.global-nav li{	display:block;	list-style:none; width:137px;	height:30px; float:left;}
		.global-nav a{	display:block;	width:inherit;	height:inherit;	background:url(../img/common.png) no-repeat; zoom:1; text-indent:100%;	white-space:nowrap;	overflow:hidden;}
			.global-nav .n01 a{	background-position:0 -116px;}
			.global-nav .n02 a{	background-position:-137px -116px;}
			.global-nav .n03 a{	background-position:-274px -116px;}
			.global-nav .n04 a{	background-position:-411px -116px;}
			.global-nav .n05 a{	background-position:-548px -116px;}
			.global-nav .n06 a{	background-position:-685px -116px;}
			.global-nav .n07 a{	background-position:-822px -116px;}
			
			.root .global-nav li.n01 a,
			.function .global-nav li.n02 a,
			.item .global-nav li.n03 a,
			.process .global-nav li.n04 a,
			.partnership .global-nav li.n05 a,
			.profile .global-nav li.n06 a,
			.inquiry .global-nav li.n07 a,
			.global-nav a:hover{	opacity:0;}

			header .n11{display:none;}
			header .n12{display:none;}

			#nav-footer .n09 a{display:none!important;}
			#nav-footer .n10 a{display:none!important;}

}

@media screen and (max-width: 640px){
	.global-nav{	height:0;	overflow:hidden;	width:100%;	-webkit-box-sizing:border-box;	box-sizing:border-box;	padding:0;	background:#C81138;	position:relative;	z-index:+1;}
		.global-nav.act{	height:auto;}
		.global-nav li{	display:block;	list-style:none;}
		.global-nav li + li{	border-top:solid 1px #EEE;}
		.global-nav a{	display:block;	padding:15px;	font-size:123.1%;	text-align:center;	font-weight:bold;	color:#FFF;}
		.global-nav .n08 a{	border:2px solid #C81138;	background:#fff;	color:#C81138;}
		.global-nav .n09,.global-nav .n10{	border:2px solid #C81138;		border-style:none solid solid;	background:#fff;	width:50%;	float:left;}
		.global-nav .n09{border-right-width:1px;}
		.global-nav .n10{border-left-width:1px;}
}

.nav-lineup{	display:block;	border:solid 1px #EEEEEE;	padding:1px;	background:#FFF;	margin-bottom:30px;}
	.nav-lineup li{	display:block;	list-style:none;}
	.nav-lineup ul{	padding:10px 10px 20px;}
	.nav-lineup .title{	display:block;	background:#EEE1E9;	font-size:108%;	color:#545454;	text-align:center;	padding:9px 0 6px;}
	.nav-lineup ul a{	display:block;	position:relative;	padding-left:17px;	line-height:1.75em;}
	.nav-lineup ul a:before{	content:"";	display:block;	width:13px;	height:13px;	font-size:93%;	background:url(../img/common.png) -136px -73px no-repeat;	position:absolute;	top:4px;	left:0;}
	
	/*.nav-lineup li.act{	background:#C81138;}
		.nav-lineup li.act a{	color:#FFF!important;}*/
	@media screen and (max-width: 640px){
			.nav-lineup ul{	padding:0px;}
			.nav-lineup ul li + li{	border-top:solid 1px #EEE;}
			.nav-lineup ul a{	padding:10px 10px 10px 27px;	font-size:108%;}
			.nav-lineup ul a:before{	top:16px;	left:10px;}
	}
/* ------------------------------------------------------ *
	contents
 * ------------------------------------------------------ */
#contents{ display:block;	padding:0;	margin:0 auto; clear:both;}
#contents-inner{	width:960px;	margin:0 auto;	padding-bottom:50px;	position:relative;}

#main{ display:block;	width:746px;	float:left;}
	
#main > section > section{	margin-top:20px;	position:relative;}
#main > section > section:before{	content:"";	display:block;	height:17px;	width:14px;	margin:0 auto 10px;	background:url(../img/common.png) -112px -74px no-repeat;}

#side{	display: block;	width:184px; float:right;	padding-top:5px;}

@media screen and (max-width: 640px){
	#contents-inner{	width:auto;	padding-bottom:0px;}
	#main > section{	padding:10px;}
	#main,
	#side{	width:100%; float:none;	clear:both;	margin:0 auto 30px;}
	#side{	background:#EEE1E9;	padding:20px 10px;	-webkit-box-sizing:border-box;	box-sizing:border-box; margin:0;	border-top:solid 1px #DDD;}
}

/* ------------------------------------------------------ *
	pager
 * ------------------------------------------------------ */

/* ------------------------------------------------------ *
	footer
 * ------------------------------------------------------ */
#footer{ display: block; clear: both; width: 100%; background: url(../img/bg-loop-x01.png) 0 -172px repeat-x; padding: 100px 0 0; }
#footerInner{	max-width:960px;	margin:0 auto 0;	position:relative;}
#footer address{ display:block;	clear:both;	width:100%;	font-size:93%;	color:#545454;	font-style:normal;	margin-bottom:30px;}

#nav-footer{	position:absolute;	left:352px;	top:58px;	line-height:1.8;}
	#nav-footer li{	display:block;	list-style:none;	float:left;	padding:0 0 0 17px;}
	#nav-footer a{	display:block;	padding-left:10px;	white-space:nowrap;	font-size:93%;	color:#525252;	position:relative;}
	#nav-footer a:before{	content:"";	display:block;	width:4px;	height:8px;	margin-top:-4px;	background:url(../img/common.png) -94px -72px no-repeat;	position:absolute;	left:0;	top:50%;}

#copyright{	background:#418559;	padding:10px 0;}
	#copyright small{	display:block;	max-width:940px;	padding: 0 0 90px;	line-height:1em;	margin:0 auto;	text-align:right;	font-size:85%; color:#FFF;}


@media screen and (max-width: 640px){
	#footer{	padding:0;	background:#FFF none;	min-width:320px;	box-shadow:0 0 04px #B6B6B6;}
	#footer address{ margin-bottom:10px;}
	#footerInner{	padding:0 10px;}
	.logo02{	margin-bottom:5px;}
	#copyright{	padding:5px 0;}
	#copyright small{	padding:0 10px 45px;	font-size:77%;}
}

