@charset "utf-8";

/***********************************************/
/* HTML tag styles                             */
/***********************************************/

body {
	font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	color: #444;
	-webkit-text-size-adjust: 100%;
	width: 950px;
	text-align: left;
	margin: 0 auto;
	padding: 0;	
}

a { 
	color:	#069; 
	text-decoration:none; 
}
a:visited { 
	color:	#069; 
	text-decoration:none; 
}

a:hover { 
	color:	red; 
	text-decoration:underline; 
}

a:active { 
	color:	red; 
	text-decoration:underline; 
}

img	{ 
	border:		0;
	padding:	0;
	vertical-align: middle;
	margin: 0;
}

table {
	border-collapse: collapse;	
}

ul {
	padding-left: 33px;	
}

/***********************************************/
/* Layout                                      */
/***********************************************/


#header {
	margin: 0 0 10px 0;
	width: 950px;
	padding: 0;
}

#headerLinks {
	float: right;
	width: auto;	
}

#logo {
	float: left;
	margin: 10px 0;
	width: 179px;
	height: 82px;
}



#topBanner {
	float: left;
	border: 1px solid #ccc;
	margin: 10px auto 15px 75px;
	width: 468px;
	height: 60px;

}

#header #print {
	padding-top: 10px;
	float: right;
	width: 300px;
	text-align: right;
	font-size:80%;
}

#heartbeat {
	width: 0px;
	height: 0px;
	border: none;	
}

/***********************************************/
/* Setting                                       */
/***********************************************/

.panel-wrap {
  display: block;
  position: relative; 
  float: left;
  padding: 0;
  padding-top: 5px;
  padding-right: 10px;  
  font-size: 80%;
}
a.panel-btn{
  display: block;
  position: relative;
  float: right;
  z-index: 100;
  padding-left: 22px;

}
a.panel-btn:before {
  	position: absolute;
 	left: 2px;
  	color: #999;
  	font: 18px 'FontAwesome';
}
a.panel-btn:hover:before
{
  color: red;
}

.clock a.panel-btn:before {
	content: "\f017";
}
.globe a.panel-btn:before {
  content: "\f0ac";
}

.panel {
  display: none;
  position: absolute;
  top: 35px;
  left: 0px;
  z-index: 1000;
  width: 325px;
  padding: 10px;
  background: #ffe;
  border: 5px solid #9fb5cb;
  border-radius: 3px;
  box-shadow: 0 2px 5px 1px rgba(0,0,0,.2);
}

.clock .panel {
  margin-left: -235px;	
}

.globe .panel {
  margin-left: -130px;	
}

.panel:after,#panel:before {
  content: "";
  position: absolute;
  height: 0;
  width: 0;
}


.panel:after {
  top: -35px;
  border: 15px solid transparent;
  border-bottom: 15px solid #9fb5cb;
}

.clock .panel:after {
  left: 235px;	
}

.globe .panel:after {
  left: 130px;	
}

.panel p {
	font-size: 12px;
	color: #666;
	line-height: 1.6;	
}

.panel a {
	display: block;
	float: right;
	margin-top: 10px;	
}

a.btn {
  display: block;
  position: relative;
  float: right;
  z-index: 100;
  padding-left: 25px;
}

a.btn:before {
  position: absolute;
  left: 2px;
  color: #999;
  font: 18px 'FontAwesome';
}

a.login:before {
  content: "\f090";
}

a.logout:before {
  content: "\f08b";
}

a.clock:before {
  content: "\f017";
}

/***********************************************/
/* Layout                                      */
/***********************************************/

#leftColumn {
	vertical-align: top;
	padding: 0;
	float: left;
	width: 160px;
	margin-right: 10px;
	margin-top: 0px;
}

#mainColumn {
	vertical-align: top;
	padding: 0;
	float: right;
	width: 780px;
	line-height: 1.7;
	margin-top: 0px;

}

#msgColumn {
	vertical-align: top;
	padding: 0;
	line-height: 1.5;
	float: left;
	width: 950px;
	text-align: center;
	margin-top: 3px;
}



#mainColumn2 {
	vertical-align: top;
	float: left;
	width: 640px;
	margin: 165px 10px 10px 0;
	line-height: 1.5;
}

#rightColumn2 {
	vertical-align: top;
	padding: 0;
	float: left;
	width: 300px;
	margin-top: 165px;
	margin-bottom: 10px;
	font-size: 80%;
}

/***********************************************/
/* Size                                        */
/***********************************************/

.rs {
	width: 728px;
	margin: 0 auto;	
}

/***********************************************/
/* side                                        */
/***********************************************/

.sideBox {
	margin-bottom: 10px;
	font-size: 80%;	
}

.sideBox .title {
	padding: 3px 0 4px 18px;
	text-align: left;
	font-weight: bolder;
	height: 22px;
	margin-bottom: 5px;
}

.sideBox .cat {
	text-align:	left;
	font-weight: bold;
	color: #c60;
	margin: 0 0 5px 7px;
}

.sideBox ul {
	margin: 0 0 5px 0;
	padding: 0;
	list-style-type: none;
}
.sideBox li {
	padding: 0 0 3px 20px;
	background: url(/image/em/parts.png) no-repeat 10px -100px;
	line-height: 130%;
}

.sideBox li.selected {
	padding: 0 0 3px 20px;
	background: url(/image/em/parts.png) no-repeat 10px -135px;
	line-height: 130%;
	font-weight: bolder;
}

.sideBox .back {
	font-size: 85%;
	text-align: right;
	margin-right: 2px;
}


/***********************************************/
/* TABLE                                       */
/***********************************************/
table.table { 	
	border:				1px solid #CACA95;
	color:				#444444;
	border-collapse: 	collapse;
	text-align:			left;
}
table.table td 	{	
	border: 1px solid #CACA95;
	padding: 5px;
	line-height: 1.5;
}
table.table .top	{	
	background-color:	#E2E2C2;
	border:				1px solid #CACA95;
	text-align:			center;
	color:				#444444;
	background: 		#eec url(/image/em/parts.png) repeat-x 0 -60px;
	
}
table.table .side	{ 	
	background-color:	;
	width: 25%;
	background: #eec url(/image/common/triBeige.gif) no-repeat 2px 10px;
	padding-left: 10px;
	vertical-align: top;
}
	
table.table .side span.red {
	font-size: 80%;	
}

table.gTable { 	
	border:				1px solid #ccc;
	color:				#444;
	border-collapse: 	collapse;
	text-align:			left;
}
table.gTable td 	{	
	border: 1px solid #ccc;
	padding: 5px;
	line-height: 1.5;
}
table.gTable .top	{	
	background-color:	#eee;
	border:				1px solid #ccc;
	text-align:			center;
}



table.noBorder {
	border: none;
	border-colapse: collapse;
}

table.noBorder td {
	border: none;
	padding: 2px;
}


table.zTable {
	border-collapse: 	collapse;
	width: 100%;	
}

table.zTable tr.g {
	background-color: #f6f6f6;	
}	



/***********************************************/
/* Top Navi                                    */
/***********************************************/
#navi {
	clear:both;	
	height: 40px;
	line-height: 35px;
	-webkit-box-shadow: 0px 2px 8px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 8px rgba(0,0,0,0.3);
	background: #0c0c0c;
	background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#0c0c0c));
	background: -webkit-linear-gradient(#555, #0c0c0c);
	background: linear-gradient(#555, #0c0c0c);
	border-radius: 4px 4px 4px 4px;
}

#navi ul {
	list-style-type: none;
	height: 40px;	
	margin: 0px auto;
	width: 950px;
	padding-left: 7px;
}
#navi ul li {
	float: left;
	width: 104px;
	font-size: 11px;
}
#navi ul li a {
	text-decoration: none;	
	display: block;
	text-align: center;
	color: #FFF;
	border-right: 1px solid #666;
}
#navi ul li a:hover {
	background: #eee;
	color: #333;
}

#navi ul li a.active:before {
	position: relative;
	top: 1px;
	right: 4px;
  	font: 14px 'FontAwesome';
}
#navi ul li.info a {
	border-top: 5px solid #797979;
}
#navi ul li.info a.active {
	border-top: 5px solid #666;
	background: #797979;
	background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#797979));
	background: -webkit-linear-gradient(#999, #797979);
	background: linear-gradient(#999, #797979);
}
#navi ul li.info a.active:before {
  	content: "\f015";
  	color: #ccc;
}

#navi ul li.bbs a {
	border-top: 5px solid #009A63;
}
#navi ul li.bbs a.active {
	background: #009A63;
	border-top: 5px solid #00794f;
	background: -webkit-gradient(linear, left top, left bottom, from(#009A63), to(#00794f));
	background: -webkit-linear-gradient(#009A63, #00794f);
	background: linear-gradient(#009A63, #00794f);	
	
}
#navi ul li.bbs a.active:before {
  	content: "\f086";
  	color: #d0dfa4;
}

#navi ul li.classified a {
	border-top: 5px solid #B33737;
	letter-spacing: -0.1em;
}
#navi ul li.classified a.active {
	background: #B33737;
	border-top: 5px solid #962e2e;
	background: -webkit-gradient(linear, left top, left bottom, from(#B33737), to(#962e2e));
	background: -webkit-linear-gradient(#B33737, #962e2e);
	background: linear-gradient(#B33737, #962e2e);
}
#navi ul li.classified a.active:before {
  	content: "\f14a";
  	color: #F1DAC8;
}

#navi ul li.school a {
	border-top: 5px solid #006699;
}
#navi ul li.school a.active {
	background: #006699;
	border-top: 5px solid #004f75;
	background: -webkit-gradient(linear, left top, left bottom, from(#006699), to(#004f75));
	background: -webkit-linear-gradient(#006699, #004f75);
	background: linear-gradient(#006699, #004f75);	
}
#navi ul li.school a.active:before {
  	content: "\f19d";
	color: #DFF4FF;
}

#navi ul li.travel a {
	border-top: 5px solid #CC3333;
}
#navi ul li.travel a.active {
	background: #CC3333;
	border-top: 5px solid #a82b2b;
	background: -webkit-gradient(linear, left top, left bottom, from(#CC3333), to(#a82b2b));
	background: -webkit-linear-gradient(#CC3333, #a82b2b);
	background: linear-gradient(#CC3333, #a82b2b);
}
#navi ul li.travel a.active:before {
  	content: "\f072";
	color: #FFDBDB;
}

#navi ul li.stay a {
	border-top: 5px solid #ee6600;
}
#navi ul li.stay a.active {
	background: #ee6600;
	border-top: 5px solid #c65400;
	background: -webkit-gradient(linear, left top, left bottom, from(#ee6600), to(#c65400));
	background: -webkit-linear-gradient(#ee6600, #c65400);
	background: linear-gradient(#ee6600, #c65400);	
}
#navi ul li.stay a.active:before {
  	content: "\f0f7";
 	color: #FADDC9;
}

#navi ul li.guide a {
	border-top: 5px solid #B4783C;
}
#navi ul li.guide a.active {
	background: #B4783C;
	border-top: 5px solid #956331;
	background: -webkit-gradient(linear, left top, left bottom, from(#B4783C), to(#956331));
	background: -webkit-linear-gradient(#B4783C, #956331);
	background: linear-gradient(#B4783C, #956331);	
}
#navi ul li.guide a.active:before {
  	content: "\f02d";
 	color: #F0E1CF;
}

#navi ul li.kuchikomi a {
	border-top: 5px solid #9351A6;
}
#navi ul li.kuchikomi a.active {
	background: #9351A6;
	border-top: 5px solid #814792;
	background: -webkit-gradient(linear, left top, left bottom, from(#9351A6), to(#814792));
	background: -webkit-linear-gradient(#9351A6, #814792);
	background: linear-gradient(#9351A6, #814792);	
}
#navi ul li.kuchikomi a.active:before {
  	content: "\f0e5";
  	color: #eee2f1;
}

#navi ul li.site a {
	border-top: 5px solid #5A65A5;
	border-right: none;
}
#navi ul li.site a.active {
	background: #5A65A5;
	border-top: 5px solid #4b558b;
	background: -webkit-gradient(linear, left top, left bottom, from(#5A65A5), to(#4b558b));
	background: -webkit-linear-gradient(#5A65A5, #4b558b);
	background: linear-gradient(#5A65A5, #4b558b);
}

#navi ul li.site a.active:before {
  	content: "\f108";
 	color: #DFE0EF;
}


/***********************************************/
/* Second Navi                                    */
/***********************************************/

#navi2 {
	clear:both;
	width: 950px;
	padding-top: 0;
	background-color: #fff;
	border-bottom: 1px dotted #ccc;
	height: 22px;
}

#navi2 .nl {
	width: 100%;
	margin: 0 auto 0 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
	height: 22px;
}

#navi2 .nl li {  
	float: left;
	background: url(/image/common/triBeige.gif) no-repeat 5px 8px;
}


#navi2 .nl li a {
	margin-right:1px;
	font-size: 10px;
	display: block;
	position: relative; /* IE6—p */
	padding: 7px 11px 5px 17px; 
	text-decoration: none;	
}

#navi2 .nl li a:hover {
	margin-right:1px;
	color: #222;
	background: #eed url(/image/em/parts.png) no-repeat 6px -131px;
}

#navi2 .nl li.active {
	background: #eed url(/image/em/parts.png) no-repeat 6px -131px;
}

#navi2 .nl li.active a {
	color: #222;
}



/***********************************************/
/* Topic Path                                  */
/***********************************************/

#breadcrumb {
	padding-left: 0;
	font-size: 12px;
	margin: 0;
	padding: 6px 0 0 0;
	text-align: left;
	vertical-align: top;
}	

#breadcrumb li {
	display: inline;
	padding: 0;
	margin: 0;
}

#breadcrumb li a {
	text-decoration: none;
	padding-right: 10px; 
}

#breadcrumb li:after {
	position: relative;
	top: 1px;
	right: 4px;
  	font: 14px 'FontAwesome';
  	content: "\f105";
  	color: #aaa;
}


#breadcrumb li.bold {
	padding-left: 5px;
	font-weight: normal;
	font-size: 100%;
}

/***********************************************/
/* Basic                                       */
/***********************************************/

.alignL { 	text-align: left;	}
.alignC {	text-align: center;	}
.alignR {	text-align: right;	}

.mrgnB10 {	margin-bottom: 10px;}
.mrgnT10 {	margin-top: 10px;	}
.mrgnB20 {	margin-bottom: 20px;}
.mrgnT20 {	margin-top: 20px;	}

.divC	{	margin:0 auto		}

.sizeS 	{	font-size: 85%;		}
.sizeM	{	font-size: 90%;		}
.sizeB 	{	font-size: 120%;	}	

.red 	{	color: red;			}
.grey 	{	color: #666;		}
.green 	{	color: #008000;		}
.brown 	{	color: #c60;		}
.yellow {	color: #ffd;		}
.beige  {	color: #A4A453;		}

.bold 	{	font-weight: bolder;}
.notBold 	{	font-weight: normal;}
.widthFull {	width: 100%; }
.widthSemi {	width: 80%;		margin: 0 auto;	}
.widthHalf {	width: 50%;		margin: 0 auto;	}

.clear 	{	clear: both; }

.mTop5 { margin-top: 5px; }

.pic 	{
	border: 1px solid #ccc;
	margin: 0 auto;
}

.maple {
	padding: 2px 17px 0 0;
	background: url(/image/em/user/maple.png) no-repeat right  0;		
}

.pdf {
	background: url(/image/pdf.gif) no-repeat left 0px;
	padding-left: 20px;
	padding-top: 1px;
}



/***********************************************/
/* Box                                         */
/***********************************************/
.boxY {
	border: 1px solid #ccc;
	background-color: #ffd;
	line-height: 1.5;
	color: #222;
	padding: 10px;
}

ol.boxY {
	margin-left: 8px;
	padding-left: 35px;	
}

.boxG {
	border: 1px solid #ccc;
	background-color: #fcfcfc;
	line-height: 1.5;
	color: #222;
	padding: 10px;
}

p.boxG, p.boxY {
	margin-left: 8px;
}

ol.boxG {
	margin-left: 8px;
	padding-left: 35px;	
}

/***********************************************/
/* Footer                                      */
/***********************************************/
#footer {
	clear: left;
	font-size: 80%;
	text-align: center;
	padding: 5px 0;
	color: #666;
	line-height: 1.5;
	clear: both;
}

#footer ul.listP {
	width: 300px;
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: left;
	float: left;
}

#footer ul.listP li {
	display: inline;
	padding: 0 7px 0 11px;
}

#footer ul.listP li:before {
	position: relative;
	top: 1px;
	right: 4px;
  	font: 14px 'FontAwesome';
  	content: "\f0da";
  	color: #aaa;
}

#footer ul.listA {
	width: 500px;
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: right;
	float: right;
	font-size: 100%;
	font-weight: bolder;
}

#footer ul.listA li {
	display: inline;
	padding: 0 7px 0 11px;
}

#footer ul.listA li:before {
	position: relative;
	top: 1px;
	right: 4px;
  	font: 14px 'FontAwesome';
  	content: "\f0da";
  	color: #aaa;
}


#footer ul.listB {
	margin: 0 0 5px 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
}

#footer ul.listB li {
	padding: 0 0px 0 10px;
	background: url(/image/em/parts.png) no-repeat left -30px; 
	display: inline;
}
#footer ul.listB li.first {
	background-image: none;
}

/***********************************************/
/* Table List                                  */
/***********************************************/

.tl {
	width: 100%;
	margin-top: 5px;
}

.tl .left {
	width: 25%;
	float: left;
	text-align: right;
	margin-right: 5px;
}

.tl .right {
	float: left;
	width: 73%;
}

/***********************************************/
/* A Navi                                      */
/***********************************************/

.mainBox {
	border: 1px solid #ccc;
	background-color: #ffd;
	width: 728px;
	margin: 0 auto;
}

.mainBox .title {
	font-weight: bolder;
	margin: 20px 15px 0 15px;
	line-height: 0;
}

.mainBox ul.list {
	padding: 0;
	list-style-type: none;
	text-align: left;
	margin: 15px;
}

.mainBox ul.list li {
	display: inline;
	padding: 0 7px 0 0;
}

.mainBox ul.list li.selected {
	padding: 0 7px 0 11px;
	background: url(/image/em/parts.png) no-repeat 2px -47px;
}

.mainBox ul.list li.selected a {
	font-weight: bolder;
	color: #c60;
}

/***********************************************/
/* Main Table                                  */
/***********************************************/


.mainTable {
	width: 728px;
	margin: 0 auto;
	color: #666;
	border-collapse: collapse;
	line-height: 1.7;
	vertical-align:	middle;	
}

.mainTable td {
	padding: 5px;
}

.mainTable tr.note td {
	color: #fff;
	font-weight: bolder;
	text-align: center;	
}

.mainTable tr.title td {
	background-color: #fbfbfb;
	height: 40px;
	text-align: center;
}

.mainTable tr.sLine td{
	border: none;
}

.mainTable tr.sLine td{
	border: none;
	border-bottom: 1px solid #eee;
}

.mainTable tr.gray td{
	background-color: #fafafa;
}

/***********************************************/
/* gMap Info window                            */
/***********************************************/

.gmap_marker {
	font-size: 80%;
	line-height: 1.3;
	padding: 0;
	margin: 0;	
}

/***********************************************/
/* Pager                                      */
/***********************************************/
.pages {
	margin: 10px 0;
	text-align: center;
}

.pages .pager {
	font-weight: bold;
	color: #c60;
}	

.pages img {
	vertical-align: middle;
	margin-bottom: 2px;
}

/***********************************************/
/* Border                                      */
/***********************************************/
.borderBD {	border-bottom: 1px dotted #ccc; }	
.borderTD {	border-top: 1px dotted #ccc; }	
.borderBS {	border-bottom: 1px solid #97a5b0; }	
.borderTS {	border-top: 1px solid #97a5b0; }
.borderS  { border: 1px dotted #ccc;}



/***********************************************/
/* Other                                       */
/***********************************************/

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

.clearFix {
	min-height: 1px;
}

/***********************************************/
/* Page Top                                    */
/***********************************************/

#page-top {
  	display: block;
  	position: fixed;
  	z-index: 9999;
  	bottom: 10px;
  	right: 10px;
  	width: 90px;
  	padding: 10px 5px;
  	background: #666;
  	background: rgba(0,0,0,.4);
  	color: #fff;
  	text-align: center;
  	text-decoration: none;
  	font-size: 11px;
  	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

#page-top:hover{
	background: #ccc;
  	background: rgba(0,0,0,.6);
}