/*********************************************************************
 * ステージ CMS スタイルシート
 *********************************************************************/
/* 外部スタイルシートをインポート */
@import url("init.css");	/* スタイルの初期化 */
@import url("layout.css");	/* 配置設定 */
@import url("space.css");	/* 余白設定 */
@import url("fonts.css");	/* フォント設定 */
@import url("color.css");	/* 色設定 */
@import url("split.css");	/* 分割設定 */
@import url("col-fit.css");	/* 横並びの割合設定 */
@import url("border.css");	/* ボーダー設定 */
@import url("image.css");	/* 画像設定 */
@import url("category.css");	/* 種別定義 */
@import url("scms-init.css");	/* 初期値 */

/***************************************
 * 初期化
 ***************************************/
body{
	/* 基本フォント－Google Noto ゴシック */
	/* font-family: "Noto Sans JP",sans-serif; */ 
	/* 旧バージョンと同じ設定 */
	font-family: "メイリオ","ヒラギノ角ゴ Pro W3","Lucida Grande","Hiragino Kaku Gothic Pro", Verdana,"ＭＳ Ｐゴシック",sans-serif;
	/* 基本文字色 */
	color :dimgray;
	/* ページ背景色 */
	background-color:white;
	border-color: #d7d7d7; 
}

a         { color: blue; }
a:visited { color: indigo; }
a:hover   { color: orange; }
/*
a:link    {}
a:active  {}
*/

/***************************************
 * ヘアーライン
 ***************************************/
hr {
	margin-top: 0;
	margin-bottom: 0;
	border: 0;
	border-top: solid 1px rgba(105, 105, 105, 0.6);
	background-color: transparent;
}

.hr-dotted { border-top: 1px dotted rgba(0, 0, 0, 0.8); }
.hr-dashed { border-top: 1px dashed rgba(0, 0, 0, 0.8); }
.hr-double { border-top: 3px double rgba(0, 0, 0, 0.8); }


/***************************************
 * bxSlider の縁取りを消す
 ***************************************/
.bx-wrapper {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	border: 0;
	margin-bottom: 0;
}


/***************************************
 * iframe の拡大縮小をサポート
 ***************************************/
/* 拡大縮小する iframe の識別子 */
.iframe-scale {
	display: block;
	position: relative;
}
.iframe-overlap {
	position: absolute;
	top: 0;
	left: 0;
}


/***************************************
 * デザイン
 ***************************************/
/* カーソル形状 */
.cursor-pointer { cursor: pointer; }
.cursor-default { cursor: default; }


.scroll-contents {
	overflow: scroll;
}

/***************************************
 * スマートホンのようなスクロールバー
 ***************************************/
/* スクロールバーの色 */
.ps__rail-x .ps__thumb-x,
.ps__rail-y .ps__thumb-y {
	background-color: #666;
}

/* スクロールバーにマウスを重ねたときの色 */
.ps__rail-x:hover > .ps__thumb-x,
.ps__rail-x:focus > .ps__thumb-x,
.ps__rail-x.ps--clicking .ps__thumb-x {
	background-color: #666;
}

.ps__rail-y:hover > .ps__thumb-y,
.ps__rail-y:focus > .ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
	background-color: #666;
}

.ps:hover > .ps__rail-x,
.ps:hover > .ps__rail-y,
.ps--focus > .ps__rail-x,
.ps--focus > .ps__rail-y,
.ps--scrolling-x > .ps__rail-x,
.ps--scrolling-y > .ps__rail-y {
  opacity: 0.7;
}


/* スクロールバーの背景色 */
.ps .ps__rail-x:hover,
.ps .ps__rail-y:hover,
.ps .ps__rail-x:focus,
.ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking,
.ps .ps__rail-y.ps--clicking {
  background-color: #eee;
  opacity: 0.7;
}


/***************************************
 * スライド
 ***************************************/
.slide-box {	/* UL に指定する */
	display: table;
	margin:  0;
	padding: 0;
	border:  0;
}
.slide-item {	/* LI に指定する */
	display: table-cell;
	position: relative;
	width: 100%;
	overflow: hidden;
}
.slider {		/* スライドする内容に指定する */
	width: 100%;
	overflow: hidden;
}


/***************************************
 * ページイメージ画像
 ***************************************/
.page-image {
	width: 100%;
	min-height:50px;
	max-height:100px;
}


/***************************************
 * メニュー領域
 ***************************************/
/* メニューロゴ画像の設定 */
.image-menu {
	width: 100%;
	height: 90px;
	object-fit: cover;
}


/* スクロールメニューの設定 */
.scroll-menu {
	overflow: scroll;
	top: 90px;
	height: calc(100% - 91px);
}

/* メニューを配置するボックス */
.menu-items {
	position: relative;
	width: 188px;
	margin: 0;
	padding-left: 2px;
}

/* メニュー位置を固定 */
.fixed-menu {
	position: fixed;
	width: 192px;
}

/* ドロップダウンメニューを配置するボックス */
.dropdown-menu {
	width: 192px;
	position: absolute;
	box-shadow: 0 10px 25px 0 rgba(0, 0, 0, 1.0);
	background-color: white;
}

/* メニュー単体 */
.row-menu {
/*	width: 192px;*/
	display: block;
	position: relative;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color :dimgray;
}

.row-menu a       { color: dimgray; }
.row-menu a:hover { color: orange; }

/***************************************
 * メニュー
 ***************************************/
/* メニュー文字の色 */
#menuItems { color: dimgray; }
#menuItems a { color: dimgray; }
#menuItems a:hover { color: orange; }

/***************************************
 * メニューバー
 ***************************************/
.menu-bar {
	color: lightgray;
	background-color:#404040;
	padding-bottom: 0.25em;
}

.menu-bar ul {
	list-style: none;
	margin: 0;
	padding-top: 0.4em;
	padding-left: 0;
	padding-right: 0.6em;
}
.menu-bar ul li {
	display: inline-block;
	padding-left: 0.5em;
	padding-right: 0.5em;
}

.menu-bar ul li a {
	color: lightgray;
}

.menu-bar ul li a:hover {
	color: orange;
}

/* ドロップダウンメニューを起動するアイコン */
.icon-bars {
	display: table-cell;
	float: left;
	width: 1.8em;
	text-align: center;
	border: solid 1px lightgray;
	border-radius: 7px;
	cursor: pointer;
}
.icon-bars:hover {
	color: orange;
	border-color: orange;
}

.bar-icon-left {
	float: left;
}

/* メニューバーの会社名 */
.brand {
	display: table-cell;
	cursor: default;
}

.bar-icon-right {
	display: table-cell;
	float: right;
	font-size: 1.2em;
}


/* 画像に重ね合わせるフォントのスタイル */
.overlap-text {
	color: white;
	font-weight: bold;
	text-shadow:
		0px 0px 1px #333,
		0px 0px 2px #333,
		0px 0px 3px #333,
		0px 0px 4px #333,
		0px 0px 5px #333,
		0px 0px 6px #333;
}

.overlap-text a {
	color: paleturquoise;
}
.overlap-text a:visited {
	color: hotpink;
}
.overlap-text a:hover {
	color: orange;
}

/*************************************************
 * iPhone 5 がターゲット
 *************************************************/
@media all and ( max-width:320px) {
	html {
		font-size: 0.75rem;
	}
}