@charset "UTF-8";
/* CSS Document */


body {
	font-family: 'Helvetica Neue','Helvetica','Arial','Geneva,sans-serif','Meiryo','メイリオ','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック','Osaka',sans-serif;
	font-family: 'Meiryo','メイリオ','ＭＳ Ｐゴシック','Osaka','Helvetica Neue','Helvetica','Arial','Geneva,sans-serif',sans-serif\9; /* IE8 and below */
	font-size:75%;
	color: #323232;
	line-height:1.75;
	margin:0;
	padding:0;
}

/*--------------------
IE6メッセージ
---------------------*/
 
.ieerror {
	color:#FFF;
        background:#000;
        padding: 10px;
        text-align:center;
        font-weight:bold;
	position:absolute;
	top:0px;
	left:0px;
	z-index:1000;
	width:100%;
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}
 
.ieerror a {
	color:#FFF;
}



/* -----------------------------------------------------------

  TEXT関係

------------------------------------------------------------- */

/*リンク*/
a { color:#323232; text-decoration:none; }
a:hover { color:#999999; text-decoration:underline;}

/*テキスト位置*/
.texrCenter { text-align:center; }
.textRight { text-align:right; }

/*テキスト装飾関係*/
.textBold { font-weight:bold; }
.textNormal { font-weight:normal; }
.textBlack { color:#000; }

/*フォント種類*/
.julius {
	font-family: 'Varela Round', sans-serif;
	letter-spacing:0.1em;
	font-size:1em;
}



/* -----------------------------------------------------------

   共通レイアウト関係

------------------------------------------------------------- */

#wrapper {
	position:relative;
	width:880px;
	height:100%;
	margin: 0 auto;
	padding:0 auto;
}

#footer {
	position:absolute;
	right:0;
	top:0;
	}


/* -----------------------------------------------------------

   トップページ

------------------------------------------------------------- */

#top {
	position:absolute;
	width:100%;
	height:100%;
	margin: 0 auto;
	padding:0 auto;
	background:url(../images/bg_top.jpg) center 42% no-repeat ;
}


/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#top { background:url(../images/bg_top-2x.jpg) 50% 62% no-repeat;  background-size:1024px 1240px; }
	}


#headerTop {
	position:relative;
	top:36%;
}

#logoTop { float:left; }
#naviTop { float:left; margin:18px 0 0 55px; }

#naviTop li {
	float:left;
	padding-right:35px;
}

	#naviTop .nav1 a, #naviTop .nav2 a, #naviTop .nav3 a, #naviTop .nav4 a {
		display: block;
		text-indent: -9999px;
		height: 16px;
		overflow: hidden;
		line-height: 0;
		font-size: 0;
	}
	/*ロールオーバー用の背景画像*/
	#naviTop .nav1 a { background:url(../images/bt_message_b.jpg) top left; width:79px; }
	#naviTop .nav2 a { background:url(../images/bt_works_b.jpg) top left; width:52px; }
	#naviTop .nav3 a { background:url(../images/bt_ex_b.jpg) top left; width:77px; }
	#naviTop .nav4 a { background:url(../images/bt_profile_b.jpg) top left; width:70px; }

	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviTop .nav1 a { background:url(../images/bt_message_b-2x.jpg) top left; background-size:158px 16px; }
		#naviTop .nav2 a { background:url(../images/bt_works_b-2x.jpg) top left; background-size:104px 16px; }
		#naviTop .nav3 a { background:url(../images/bt_ex_b-2x.jpg) top left; background-size:154px 16px; }
		#naviTop .nav4 a { background:url(../images/bt_profile_b-2x.jpg) top left; background-size:140px 16px; }
	}

	#naviTop .nav1 a:hover, #naviTop .nav2 a:hover, #naviTop .nav3 a:hover, #naviTop .nav4 a:hover {
		background-position:top right; 
	}

#naviTop_other {
	clear:both;
	position:absolute;
	width:180px;
	top:92%;
	left:85%;
	font-family: 'Varela Round', sans-serif;
	font-size:0.92em;
}

	#naviTop_other li {
		float:left;
		margin-left:20px;
		padding-left:8px; 
		background:url(../images/icon_pngg.png) 0 45% no-repeat;
		background-position:0 40%\9;/*IE6-8*/
	}
	
	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviTop_other li { background:url(../images/icon_pngg-2x.png) 0 45% no-repeat; background-size:4px 9px; }
	}
	
	#naviTop_other li a { color:#808080; text-decoration:none; }
	#naviTop_other li a:hover { color:#ff9300; text-decoration:underline;}


/* -----------------------------------------------------------

   メッセージ

------------------------------------------------------------- */

#message {
	position:absolute;
	width:100%;
	height:100%;
	margin: 0 auto;
	padding:0 auto;
	background:url(../images/bg_message1.jpg) 50% 40% no-repeat ;
}

@media screen and (max-width: 1024px){
	/* タブレット用のスタイル記述 */
	#message {
	background:url(../images/bg_message1_ipad.jpg) 50% top no-repeat;
	}
}



/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#message { background:url(../images/bg_message1_ipad-2x.jpg) 50% top no-repeat;  background-size:1024px 1240px; }
	}

#headerMessage {
	position:absolute;
	padding-top:30px;
	width:100%;
}

#logoMessage { float:left; }
#naviMessage { float:right; margin:10px 0 0 30px; }

#naviMessage li {
	float:left;
	padding-left:25px;
}

	#naviMessage .nav5 a, #naviMessage .nav2 a, #naviMessage .nav3 a, #naviMessage .nav4 a {
		display: block;
		text-indent: -9999px;
		height: 16px;
		overflow: hidden;
		line-height: 0;
		font-size: 0;
	}
	/*ロールオーバー用の背景画像*/
	#naviMessage .nav5 a { background:url(../images/bt_top_b.jpg) top left; width:37px; }
	#naviMessage .nav2 a { background:url(../images/bt_works_b.jpg) top left; width:52px; }
	#naviMessage .nav3 a { background:url(../images/bt_ex_b.jpg) top left; width:77px; }
	#naviMessage .nav4 a { background:url(../images/bt_profile_b.jpg) top left; width:70px; }

	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviMessage .nav5 a { background:url(../images/bt_top_b-2x.jpg) top left; background-size:74px 16px; }
		#naviMessage .nav2 a { background:url(../images/bt_works_b-2x.jpg) top left; background-size:104px 16px; }
		#naviMessage .nav3 a { background:url(../images/bt_ex_b-2x.jpg) top left; background-size:154px 16px; }
		#naviMessage .nav4 a { background:url(../images/bt_profile_b-2x.jpg) top left; background-size:140px 16px; }
	}

	#naviMessage .nav5 a:hover, #naviMessage .nav2 a:hover, #naviMessage .nav3 a:hover, #naviMessage .nav4 a:hover {
		background-position:top right; 
	}

#naviMessage_other {
	clear:both;
	position:absolute;
	width:180px;
	top:92%;
	left:85%;
	font-family: 'Varela Round', sans-serif;
	font-size:0.92em;
}

	#naviMessage_other li {
		float:left;
		margin-left:20px;
		padding-left:8px; 
		background:url(../images/icon_pngg.png) 0 45% no-repeat;
		background-position:0 40%\9;/*IE6-8*/
	}
	
	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviMessage_other li { background:url(../images/icon_pngg-2x.png) 0 45% no-repeat; background-size:4px 9px; }
	}
	
	#naviMessage_other li a { color:#808080; text-decoration:none; }
	#naviMessage_other li a:hover { color:#ff9300; text-decoration:underline;}

#messageDetail {
	width:496px;
	position:absolute;
	top:28%;
	right:0;
	}
	
	#titleMessage { position:absolute; top:92%; }
	
	#messageDetail h1 { padding-bottom:25px; }
	#messageDetail dl { float:left; padding-top:18px; width:342px; }
		#messageDetail dt { float:left; display:inline; padding-bottom:3px; }
		#messageDetail dd { margin-left:80px; padding-bottom:3px; }
		
	#messageDetail .paraContents { clear:both; padding-top:23px; border-top:1px solid #323232; line-height:1.85; }
		.btContents { 
			margin-top:18px; 
			padding-left:8px; 
			background:url(../images/icon_w.png) 0 48% no-repeat;
			background-position:0 40%\9;/*IE6-8*/ 
		}
		.btContents a { text-decoration:none; }
		.btContents a:hover { color:#ff9300; text-decoration:underline;}



/* -----------------------------------------------------------

   社長プロフィール

------------------------------------------------------------- */

#ceo {
	position:absolute;
	width:100%;
	height:100%;
	margin: 0 auto;
	padding:0 auto;
	background:url(../images/bg_message2_2.jpg) center 50% no-repeat ;
}

@media screen and (max-width: 1024px){
	/* タブレット用のスタイル記述 */
	#ceo { background:url(../images/bg_message2_ipad.jpg) 50% top no-repeat; }	
}

/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#ceo { background:url(../images/bg_message2_ipad-2x.jpg) 50% top no-repeat;  background-size:1024px 1240px; }
	}

#headerCeo {
	position:absolute;
	padding-top:30px;
	width:100%;
}

#logoCeo { float:left; }
#naviCeo { float:left; margin:10px 0 0 30px; }

#naviCeo li {
	float:left;
	padding-right:25px;
}

	#naviCeo .nav5 a, #naviCeo .nav2 a, #naviCeo .nav3 a, #naviCeo .nav4 a {
		display: block;
		text-indent: -9999px;
		height: 16px;
		overflow: hidden;
		line-height: 0;
		font-size: 0;
	}
	/*ロールオーバー用の背景画像*/
	#naviCeo .nav5 a { background:url(../images/bt_top_b.jpg) top left; width:37px; }
	#naviCeo .nav2 a { background:url(../images/bt_works_b.jpg) top left; width:52px; }
	#naviCeo .nav3 a { background:url(../images/bt_ex_b.jpg) top left; width:77px; }
	#naviCeo .nav4 a { background:url(../images/bt_profile_b.jpg) top left; width:70px; }

	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviCeo .nav5 a { background:url(../images/bt_top_b-2x.jpg) top left; background-size:74px 16px; }
		#naviCeo .nav2 a { background:url(../images/bt_works_b-2x.jpg) top left; background-size:104px 16px; }
		#naviCeo .nav3 a { background:url(../images/bt_ex_b-2x.jpg) top left; background-size:154px 16px; }
		#naviCeo .nav4 a { background:url(../images/bt_profile_b-2x.jpg) top left; background-size:140px 16px; }
	}

	#naviCeo .nav5 a:hover, #naviCeo .nav2 a:hover, #naviCeo .nav3 a:hover, #naviCeo .nav4 a:hover {
		background-position:top right; 
	}

#naviCeo_other {
	clear:both;
	position:absolute;
	width:180px;
	top:92%;
	left:85%;
	font-family: 'Varela Round', sans-serif;
	font-size:0.92em;
}

	#naviCeo_other li {
		float:left;
		margin-left:20px;
		padding-left:8px; 
		background:url(../images/icon_pngw.png) 0 45% no-repeat;
		background-position:0 40%\9;/*IE6-8*/
	}
	
	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviCeo_other li { background:url(../images/icon_pngw-2x.png) 0 45% no-repeat; background-size:4px 9px; }
	}
	
	#naviCeo_other li a { color:#FFF; text-decoration:none; }
	#naviCeo_other li a:hover { color:#000; text-decoration:underline;}

#ceoDetail {
	width:570px;
	position:absolute;
	top:18%;
	}
	
	@media screen and (max-width: 1024px){
	/* タブレット用のスタイル記述 */
	#ceoDetail { top:19%; }
	}
	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#ceoDetail { top:19%; }
	}
	
	#titleCeo { position:absolute; top:88%; left:85%; }
	
	#ceoDetail h1 { font-size:134%; letter-spacing:0.15em; float:left; }
	#ceoDetail dl { float:left; padding-top:18px; width:432px; }
		#ceoDetail dt { float:left; display:inline; padding-bottom:3px; }
		#ceoDetail dd { margin-left:80px; padding-bottom:3px; }
		
	#ceoPhoto { float:right; padding:4px 0 25px 0; }
	#ceoDetail .paraContents { clear:both; padding-top:23px; border-top:1px solid #323232; line-height:1.85; }
		.btContents { 
			margin-top:18px; 
			padding-left:8px; 
			background:url(../images/icon_w.png) 0 48% no-repeat;
			background-position:0 40%\9;/*IE6-8*/ 
		}
		.btContents2 a { text-decoration:underline; }
		.btContents2 a:hover { color:#ff9300; text-decoration:underline;}
		.btContents a { text-decoration:none; }
		.btContents a:hover { color:#ff9300; text-decoration:underline;}



/* -----------------------------------------------------------

   会社概要

------------------------------------------------------------- */

#profile {
	position:absolute;
	width:100%;
	height:100%;
	margin: 0 auto;
	padding:0 auto;
	background:url(../images/bg_profile.jpg) 49% 39.5% no-repeat ;
}

@media screen and (max-width: 1024px){
	/* タブレット用のスタイル記述 */
	#profile {
	background:url(../images/bg_profile_ipad.jpg) 50% top no-repeat;
	}
}



/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#profile { background:url(../images/bg_profile_ipad-2x.jpg) 50% top no-repeat;  background-size:1024px 1240px; }
	}

#headerProfile {
	position:absolute;
	padding-top:30px;
	width:100%;
}

#logoProfile { float:left; }
#naviProfile { float:right; margin:10px 0 0 30px; }

#naviProfile li {
	float:left;
	padding-left:25px;
}

	#naviProfile .nav1 a, #naviProfile .nav2 a, #naviProfile .nav3 a, #naviProfile .nav5 a {
		display: block;
		text-indent: -9999px;
		height: 16px;
		overflow: hidden;
		line-height: 0;
		font-size: 0;
	}
	/*ロールオーバー用の背景画像*/
	#naviProfile .nav5 a { background:url(../images/bt_top_b.jpg) top left; width:37px; }
	#naviProfile .nav2 a { background:url(../images/bt_works_b.jpg) top left; width:52px; }
	#naviProfile .nav3 a { background:url(../images/bt_ex_b.jpg) top left; width:77px; }
	#naviProfile .nav1 a { background:url(../images/bt_message_b.jpg) top left; width:79px; }

	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviProfile .nav5 a { background:url(../images/bt_top_b-2x.jpg) top left; background-size:74px 16px; }
		#naviProfile .nav2 a { background:url(../images/bt_works_b-2x.jpg) top left; background-size:104px 16px; }
		#naviProfile .nav3 a { background:url(../images/bt_ex_b-2x.jpg) top left; background-size:154px 16px; }
		#naviProfile .nav1 a { background:url(../images/bt_message_b-2x.jpg) top left; background-size:158px 16px; }
	}

	#naviProfile .nav1 a:hover, #naviProfile .nav2 a:hover, #naviProfile .nav3 a:hover, #naviProfile .nav5 a:hover {
		background-position:top right; 
	}

#naviProfile_other {
	clear:both;
	position:absolute;
	width:180px;
	top:92%;
	left:85%;
	font-family: 'Varela Round', sans-serif;
	font-size:0.92em;
}

	#naviProfile_other li {
		float:left;
		margin-left:20px;
		padding-left:8px; 
		background:url(../images/icon_pngg.png) 0 45% no-repeat;
		background-position:0 40%\9;/*IE6-8*/
	}
	
	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviProfile_other li { background:url(../images/icon_pngg-2x.png) 0 45% no-repeat; background-size:4px 9px; }
	}
	
	#naviProfile_other li a { color:#808080; text-decoration:none; }
	#naviProfile_other li a:hover { color:#ff9300; text-decoration:underline;}

#profileDetail {
	width:456px;
	position:absolute;
	top:19%;
	right:60px;
	}
	
	#titleProfile {  }
		#profileDetail dl { padding-top:18px;  }
		#profileDetail dt { float:left; display:inline; padding-bottom:3px; }
		#profileDetail dd { margin-left:80px; padding-bottom:3px; }
		
		#profileDetail li { line-height:1.6; }



/* -----------------------------------------------------------

   事業内容

------------------------------------------------------------- */

#works {
	position:absolute;
	width:100%;
	height:100%;
	margin: 0 auto;
	padding:0 auto;
	background:url(../images/bg_works.jpg) center 37% no-repeat ;
}


/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#works { background:url(../images/bg_works-2x.jpg) 50% 38% no-repeat;  background-size:1024px 1240px; }
	}


#headerWorks {
	position:absolute;
	padding-top:30px;
	width:100%;
}

#logoWorks { float:left; }
#naviWorks { float:left; margin:10px 0 0 30px; }

#naviWorks li {
	float:left;
	padding-left:25px;
}

	#naviWorks .nav1 a, #naviWorks .nav3 a, #naviWorks .nav4 a, #naviWorks .nav5 a {
		display: block;
		text-indent: -9999px;
		height: 16px;
		overflow: hidden;
		line-height: 0;
		font-size: 0;
	}
	/*ロールオーバー用の背景画像*/
	#naviWorks .nav5 a { background:url(../images/bt_top_w.jpg) top left; width:37px; }
	#naviWorks .nav3 a { background:url(../images/bt_ex_w.jpg) top left; width:77px; }
	#naviWorks .nav4 a { background:url(../images/bt_profile_w.jpg) top left; width:70px; }
	#naviWorks .nav1 a { background:url(../images/bt_message_w.jpg) top left; width:79px; }

	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviWorks .nav5 a { background:url(../images/bt_top_w-2x.jpg) top left; background-size:74px 16px; }
		#naviWorks .nav3 a { background:url(../images/bt_ex_w-2x.jpg) top left; background-size:154px 16px; }
		#naviWorks .nav4 a { background:url(../images/bt_profile_w-2x.jpg) top left; background-size:140px 16px; }
		#naviWorks .nav1 a { background:url(../images/bt_message_w-2x.jpg) top left; background-size:158px 16px; }
	}

	#naviWorks .nav1 a:hover, #naviWorks .nav3 a:hover, #naviWorks .nav4 a:hover, #naviWorks .nav5 a:hover {
		background-position:top right; 
	}

#naviWorks_other {
	clear:both;
	position:absolute;
	width:180px;
	top:92%;
	left:85%;
	font-family: 'Varela Round', sans-serif;
	font-size:0.92em;
}

	#naviWorks_other li {
		float:left;
		margin-left:20px;
		padding-left:8px; 
		background:url(../images/icon_pngw.png) 0 45% no-repeat;
		background-position:0 40%\9;/*IE6-8*/
	}
	
	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviWorks_other li { background:url(../images/icon_pngw-2x.png) 0 45% no-repeat; background-size:4px 9px; }
	}
	
	#naviWorks_other li a { color:#fff; text-decoration:none; }
	#naviWorks_other li a:hover { color:#000; text-decoration:underline;}

#worksDetail {
	width:880px;
	position:absolute;
	top:39%;
	}
	
	#titleWorks { float:left; padding-top:65px; }
		#worksPara { float:right; width:695px; border-left:#333 solid 1px; padding-left:40px; }
			#worksPara h2 { position:relative; top:-3px;}
			.paraBottom30 { padding-bottom:30px; }



/* -----------------------------------------------------------

   事例紹介

------------------------------------------------------------- */

#ex {
	position:absolute;
	width:100%;
	height:100%;
	margin: 0 auto;
	padding:0 auto;
	background:url(../images/bg_ex.jpg) center 50% no-repeat ;
}

@media screen and (max-width: 1024px){
	/* タブレット用のスタイル記述 */
	#ex {
	background:url(../images/bg_ex.jpg) 50% 50% no-repeat;
	}
}



/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#ex { background:url(../images/bg_ex-2x.jpg) 50% 43% no-repeat;  background-size:1024px 1240px; }
	}


#headerEx {
	position:absolute;
	padding-top:30px;
	width:100%;
}

#logoEx { float:left; }
#naviEx { float:right; margin:10px 0 0 30px; }

#naviEx li {
	float:left;
	padding-left:25px;
}

	#naviEx .nav1 a, #naviEx .nav2 a, #naviEx .nav4 a, #naviEx .nav5 a {
		display: block;
		text-indent: -9999px;
		height: 16px;
		overflow: hidden;
		line-height: 0;
		font-size: 0;
	}
	/*ロールオーバー用の背景画像*/
	#naviEx .nav5 a { background:url(../images/bt_top_w.jpg) top left; width:37px; }
	#naviEx .nav2 a { background:url(../images/bt_works_w.jpg) top left; width:52px; }
	#naviEx .nav4 a { background:url(../images/bt_profile_w.jpg) top left; width:70px; }
	#naviEx .nav1 a { background:url(../images/bt_message_w.jpg) top left; width:79px; }

	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviEx .nav5 a { background:url(../images/bt_top_w-2x.jpg) top left; background-size:74px 16px; }
		#naviEx .nav2 a { background:url(../images/bt_works_w-2x.jpg) top left; background-size:104px 16px; }
		#naviEx .nav4 a { background:url(../images/bt_profile_w-2x.jpg) top left; background-size:140px 16px; }
		#naviEx .nav1 a { background:url(../images/bt_message_w-2x.jpg) top left; background-size:158px 16px; }
	}

	#naviEx .nav1 a:hover, #naviEx .nav2 a:hover, #naviEx .nav4 a:hover, #naviEx .nav5 a:hover {
		background-position:top right; 
	}

#naviEx_other {
	clear:both;
	position:absolute;
	width:180px;
	top:92%;
	left:85%;
	font-family: 'Varela Round', sans-serif;
	font-size:0.92em;
}

	#naviEx_other li {
		float:left;
		margin-left:20px;
		padding-left:8px; 
		background:url(../images/icon_pngw.png) 0 45% no-repeat;
		background-position:0 40%\9;/*IE6-8*/
	}
	
	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviEx_other li { background:url(../images/icon_pngw-2x.png) 0 45% no-repeat; background-size:4px 9px; }
	}
	
	#naviEx_other li a { color:#fff; text-decoration:none; }
	#naviEx_other li a:hover { color:#000; text-decoration:underline;}

#exDetail {
	width:640px;
	position:absolute;
	top:24%;
	padding-left:120px;
	}
	
	#titleEx { padding-bottom:20px }
		#exDetail li { list-style:disc; color:#FFF; margin-left:16px; padding-bottom:5px; }



/* -----------------------------------------------------------

   English

------------------------------------------------------------- */

#eng { background:url(../images/bg_eng.jpg) left top repeat-y; }

	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#eng { background:url(../images/bg_eng-2x.jpg) left top repeat-y; }
	}

#wrapperEng {
	width:790px;
	margin-left:170px;
	margin-top:120px;
}

#logoEng { float:left; padding-left: 80px;}

.articleEng { float:right; width:495px; padding-bottom:40px; }
	.articleTile { font-size:125%; padding-bottom:10px; color:#000; letter-spacing:0.1em; }
	.articleEng p { padding-bottom:20px; }
	.articleEng dt { font-size:109%; color:#000; font-weight:bold; }
	.articleEng dl { padding-bottom:20px; }
	.articleEng ul { padding-bottom:20px; }
	
#footerEng {
	float:right; 
	width:495px; 
	padding-bottom:40px;
	padding-top:40px;
	text-align:right;
	}
	
	#footerEng small { font-size:84%; }

#naviEng {
	clear:both;
	position:absolute;
	width:180px;
	top:40px;
	left:800px;
	font-family: 'Varela Round', sans-serif;
	font-size:0.92em;
}

	#naviEng li {
		float:left;
		margin-left:20px;
		padding-left:8px; 
		background:url(../images/icon_pngg.png) 0 45% no-repeat;
		background-position:0 40%\9;/*IE6-8*/
	}
	
	/*Retina用画像差し替え*/
	/*device-pixel-ratioが2だったら適用*/
	@media only screen and (-webkit-min-device-pixel-ratio:2){
		#naviEng li { background:url(../images/icon_pngg-2x.png) 0 45% no-repeat; background-size:4px 9px; }
	}
	
	#naviEngr li a { color:#808080; text-decoration:none; }
	#naviEng li a:hover { color:#ff9300; text-decoration:underline;}




/* ======================================
clearfix 
======================================*/ 

.clearfix:after {  
visibility:hidden;
height:0;
display: block;
font-size: 0;  
content: " ";  
clear: both;  

}  
* html .clearfix             { zoom: 1; }
*:first-child+html .clearfix { zoom: 1; }