﻿@charset "utf-8";

/*
==================================================
基本スタイルシート(全ページ共通ヘッダー・フッター部分)
==================================================
*/

/*デフォルト
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
*{ padding:0px; margin:0px; }
body {
font-size:14px;
font-family:Helvetica, Arial, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
line-height: 1.7;
color:#282828;
background:#f6f6f6;
min-width:1000px;
position:relative;
}
h1,h2,h3,h4,h5,h6{font-weight:normal;font-size:14px;line-height:1.2;}

/*--画像--*/
img{ border:none; margin:0px; background-color:transparent; }

/*--リンク--*/
a:link,a:visited {
color:#009FE8;
text-decoration:none;
-moz-outline-style:none;
/*
overflow:hidden;
*/
}
a:hover,a:active,a:after {
color:#009FE8;
text-decoration:underline;
-moz-outline-style:none;
/*
overflow:hidden;
*/
}

/*--リスト--*/
ul,ol,dl,dt,dd,li{ color:#282828; list-style:none; }

/*--clearfix--*/
.clearfix {width:100%;}
.clearfix:after{ content: ""; display: block; clear: both; }

/*レイアウト
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
#header{
	width:100%;
	position:relative;
	z-index:102;
	}
#header.fixed{
	position:fixed;
	top:0;
	left:0;
	animation-duration: .5s;
	animation-name: header-fix;
	}
@keyframes header-fix {
	0% {top: -100px;}
	100% {top: 0;}
	}

#contents,
#main,
.wrap{
	width:1000px;
	margin:0px auto;
	}
	#column{
		width:740px;
		float:right;	
		}
	#nav{
		width:220px;
		float:left;
		}
#gmogroupfooter {
    margin: auto;
    width: 1000px;
	}

/*全ページ共通
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
a:hover.hover,
.all-hover a:hover{
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
	text-decoration:none;
}


/*フッター
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
#footer {
	background:#f5f5f5;
	text-align:center;
	font-size:14px;
	padding:20px 0;
	border-top:solid 5px #fff;
}


/*パーツ
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
.h1_title{
	margin:80px 0 10px;
	font-size:48px;
	font-weight:normal;
	}

.page_catch{
	margin:0 0 10px;
	font-weight:normal;
	font-size:14px;
	text-align:center;
	}

/*2カラムの時の指定*/
#column .page_catch{
	margin:0 0 10px;
	}
	.page_catch .ruby .rt{
		top:-0.5em;
		text-indent:0.2em;
		}
.page_title{
	margin:0 0 10px 0;
	font-size:48px;
	font-weight:normal;
	}
	.page_title .ruby .rt{
		top:-0.1em;
		}
	.page_title.new:before{
		content:'NEW';
		vertical-align:10px;
		margin:0 10px;
		padding:6px 10px;
		font-size:18px;
		color:#E8104E;
		border:1px solid #E8104E;
		}
		
.top_text{
	margin-bottom:0;
	font-size:18px;
	}
	.top_text .ruby .rt{
		top:-0.3em;
		}
.h2_title{
	font-size:32px;
	margin-bottom:40px;
	text-align:center;
	line-height:1.7;
	}
/* リード文 */
.section p.lead_text{
	margin:-20px 0 40px 0;
	text-align:center;
	font-size:128%;
}
.h3_title{
	margin-bottom:30px;
	padding:15px 15px 15px 45px;
	background:url("/images2/ico_h3.png") #e8eaec no-repeat 15px 50%;
	font-size:171%;
	line-height:1;
	border-radius:4px;
}
.h3_title.basic,
.h3_title.isolate,
.h3_title.storage,
.h3_title.managed{
	padding:15px;
}
.h3_title.basic:before,
.h3_title.isolate:before,
.h3_title.storage:before,
.h3_title.managed:before{
	content:'';
	width:20px;
	height:20px;
	display:block;
	float:left;
	margin:2px 10px 0 0;
	border-radius:4px;
}
.title_line{
	position:relative;
	margin:0 100px 20px;
	font-size:26px;
	text-align:center;
	line-height:1;
	}
.title_line:before{
	content: "";
	display: block;
	position: absolute;
	background:#d0d0d0;
	width: 100%;
	height: 1px;
	top: 50%;
	z-index: 1;
	}
.title_line span{
	position: relative;
	z-index: 5;
	padding:0 10px;
	}
.title_line span{
	background:#f6f6f6;
	}
.title_line span.white,
.bg-white .title_line span{
	background:#f8f8f8;
	}

.h4_title{
	margin-bottom:30px;
	font-size:142%;
	line-height:1;
}
.h4_title:before{
	content:'';
	width:7px;
	height:20px;
	display:block;
	float:left;
	margin:0 10px 0 0;
	background:#979ba2;
	border-radius:4px;
}
#no_account,#account{
	margin-bottom: 0;
	margin-top: -180px;
	padding-top: 180px;
}



.h5_title{
	font-size:16px;
	line-height:1.2;
	border-left:8px solid #ddd;
	padding-left:16px;
	margin-bottom:25px;
	}
.section{
	margin-bottom:80px;
	}
	.section p,
	.section ul,
	.section ol
	{
		margin-bottom:15px;
		}
.em{
	color:#E8104E;
	}
.image_wrap{
	text-align:center;
	margin:30px 0px;
	}
.text_left{
	text-align:left !important;
	}
.text_right{
	text-align:right !important;
	}
.text_center{
	text-align:center !important;
	}
.bg-white{
	background:#fff;
	}
.float_l{
	float: left;
	}
.float_r{
	float: right;
	}
dl.info dt .ico_new,
.icon-new:before{
	margin-right:5px;
	color:#E8104E;
	border:1px solid #E8104E;
	}
dl.info dt .ico_new{
	padding:0px 6px;
	}
.icon-new:before{
	content:'NEW';
	padding:3px 6px;
	}
.m_auto {
	margin:0 auto !important;
}

/**リンク**/
a.link_arrow,
.link_arrow a{
	background:url("/images2/ico_arrow2.png") no-repeat 0 50%;
	padding-left:10px;
	min-height:14px;
	}
.targetblank{
	background:url("/images2/ico_blank.png") no-repeat 100% 50%;
	min-height:14px;
	padding-right:14px;
	}
.link_pdf {
    background: url("/images/link-pdf.gif") no-repeat right center;
    padding-right: 21px;
	}

.list_number li{
	list-style-type:decimal;
	margin-left:23px;
	}
	

/*--ルビ--*/
ruby rt{
	font-size:75%;
	margin:0px 3px;
	display:inline;
	}
ruby rp{
	font-size:75%;
	letter-spacing:-0.2em;
	}
.ruby{
	position: relative;
	display: inline-block;
	}
.ruby .rb{
	display: inline-block;
	margin-top: 0.3em;
	white-space: nowrap;
	}
.ruby .rt{
	position: absolute;
	top: 0;
	left: 0;
	font-size: 50%;
	text-indent:1.2em;
	}

	
/* リスト */	
.list-disc li{
	padding-left:1em;
	text-indent:-1em;
	}
.list-disc li:before{
	content:'●';
	padding-right:5px;
	color:#666;
	}

/* 関連コンテンツ */
.related-link{
	margin-bottom: 90px;
	padding:10px 20px;
	background:#fff;
	font-size:78%;
	border-radius:4px;
}

/* 注意書き */
.add {
    color: #5f646c;
    font-size: 12px;
	}
	.add li{
		text-indent:-1em;
		padding-left:1em;
		color: #5f646c;
		}

/* PDFダウンロードボタン */
.donwload_pdf{
	}/* PDFダウンロードボタン */
.donwload_pdf{
	}
	.donwload_pdf a{
		display:block;
		position:relative;
		float:right;
		margin-top:-90px;
		padding:0 35px 0 15px;
		height:40px;
		line-height:40px;
		color:#fff;
		border-radius:4px;

		background: #9d9d9d;
		background: -moz-linear-gradient(top,  #9d9d9d 50%, #8c8c8c 50%, #8c8c8c 50%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,#9d9d9d), color-stop(50%,#8c8c8c), color-stop(50%,#8c8c8c));
		background: -webkit-linear-gradient(top,  #9d9d9d 50%,#8c8c8c 50%,#8c8c8c 50%);
		background: -o-linear-gradient(top,  #9d9d9d 50%,#8c8c8c 50%,#8c8c8c 50%);
		background: -ms-linear-gradient(top,  #9d9d9d 50%,#8c8c8c 50%,#8c8c8c 50%);
		background: linear-gradient(to bottom,  #9d9d9d 50%,#8c8c8c 50%,#8c8c8c 50%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d9d9d', endColorstr='#8c8c8c',GradientType=0 );
		}
	.donwload_pdf a:before{
		content:'';
		display:block;
		position:absolute;
		width:18px;
		height:18px;
		top:10px;
		right:10px;
		background:url("/images/link-pdf.gif") no-repeat;
		}


/* ボタンルールの設定
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/

.btn-red,
.btn-grey,
.btn-grey2{
	position: relative;
	}
	.btn-red a,
	.btn-grey a,
	.btn-grey2 a{
		display:block;
		border-radius:4px;
		color:#fff;
		text-decoration:none;
		text-align:center;
		text-shadow:rgba(0,0,0,0.2) 0px 0px 5px;
		}
	.btn-red a:hover,
	.btn-grey a:hover,
	.btn-grey2 a:hover{
		background-color:#fff;
		text-shadow:rgba(0,0,0,0) 0 0 0;
		}
	.btn-red a.targetblank:after,
	.btn-grey a.targetblank:after,
	.btn-grey2 a.targetblank:after
	.btn-black a.targetblank:after{
		content: url(/images2/ico_blank2.png);
		margin-left: 8px;
		margin-right: -19px;
		}
	.btn-red a.targetblank:hover:after,
	.btn-grey a.targetblank:hover:after,
	.btn-grey2 a.targetblank:hover:after{
		content: url(/images2/ico_blank.png);
		}


/* ボタン：赤色（申し込み系） */
.btn-red a{
	border:2px solid #E8104E;
	background: #E8104E;
	}
.btn-red a:hover{
	color:#E8104E;
	}
	
/* ボタン：灰色 */
.btn-grey a,.btn-grey2 a{
	border:2px solid #666;
	background: #666;
	}
.btn-grey a:hover,.btn-grey2 a:hover{
	color:#666;
	}
	
	
/*特長
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
.section .page_catch{
	display: block;
	margin-bottom: 1em;
	}
	.section h1{
		margin-bottom: 2em;
		}

/* intro */
.intro{
	margin-bottom:0;
	padding-bottom:10px;
	background:#cc0000;
	color:#fff;
	padding:60px 0 25px;
	}
	.intro h1{
		}
		.intro h1 > .altus{
			display: block;
			margin-top: 60px;
			}
		.intro h1 > .name{
			font-size:58px;
			}
		.intro h1 > .series{
			font-size:44px;
			}
		.intro h1 > .text{
			display: block;
			margin: 30px 0;
			font-size:32px;
			}
	.intro h2{
		margin:30px 0 10px 0;
		font-size:52px;
		}
	.intro .icon-new:before{
		font-size: 12px;
		margin-right: 1rem;
		}
	.intro p.em{
		margin-bottom: 20px;
		}

			
/* レイアウト */
.column-1{
	margin-bottom: 0;
	}
.column-1 .wrap{
	padding: 50px 0;
	}
.column-1 h2{
	margin-bottom:20px;
	font-size:40px;
	letter-spacing:-0.04em;
	text-align:center;
	}
.column-1 .text{
	font-size:18px;
	text-align:center;
	}	

.feature .float_l{
	width: 460px;
	float: left;
	height: 260px;
}
.feature .float_r{
	width: 460px;
	float: right;
	height: 260px;
}
	.feature .float_l > .img,.feature .float_r > .img{
		width: 150px;
		margin-right:30px;
		float: left;
	}
		.feature .float_l > .img img ,.feature .float_r > .img img {
			width: 150px;
			height: auto;
		}

	.feature .float_l > .text,.feature .float_r > .text{
		width: 280px;
		float: right;
		text-align: left;
	}
	.feature .float_l > .text h3,.feature .float_r > .text h3 {
		font-size: 18px;
		margin-bottom: 10px;
		font-weight: bold;
	}
	.feature .float_l > .text p,.feature .float_r > .text p {
		font-size: 14px;
	}
	

/*料金
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
/* 料金表	*/
.table_price {
	border-collapse: collapse;
	border: solid 1px #ccc;
	margin-bottom: 10px;
}
.table_price th,.table_price td {
	border: solid 1px #ccc;
	padding: 8px 10px;
}
.table_price thead th {
	font-size: 120%;
	border-bottom:none;
	padding-bottom: 0;
}
.table_price thead td {
	border-top:none; 
	padding-top: 0;
}

.table_price thead th,thead th,.table_price thead td {
	background: #333;
	color: #fff;
}
.table_price .num {
	font-size: 180%;
	font-weight: bold;
}
.table_price tbody th {
background: #f5f5f5;
}
.table_price tbody td.em {
	background: #FCFFD7
}

/* PDFボタン */
.btn-pdf {
	width:350px !important;
}
.btn-pdf a {
	height: 46px;
	line-height: 3.5;
}
.btn-pdf a:after{
				content:url("../img/link-pdf.gif");
				position:absolute;
				top:15px;
				right:10px;		
				}


/*様々なご要望にお応えできます
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
.scene h2 {
	font-size: 220%;
	margin-bottom: 40px;
}
.scene .column-5{
	width: 230px;
	float: left;
	margin-right: 50px;
	height: 400px;
	margin-bottom: 50px;
	background: #fff;
	border-radius: 4px;
	padding: 15px;
}
	.scene .column-5:first-child{
	width: 230px;
	float: left;
	margin-right: 50px;
	margin-left: 60px;
}
	.scene .column-5:nth-child(4){
		width: 230px;
		float: left;
		margin-right: 50px;
		margin-left: 60px;/*5つのときはココ210px*/
	}
.scene .column-5 h4 {
	font-size: 140%;
	font-weight: bold;
	margin-bottom: 20px;
}


/*CVエリア
----------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------*/
#cv .wrap{
	width:700px;
	margin:0 auto;
	padding-top:50px;
}
#cv .btn-grey{
	width:320px;
	float:left;
	margin-bottom:0 !important;
	}
	#cv .btn-grey a{
		height:46px;
		line-height:46px;
		font-size:16px;
		}
#cv .btn-red{
	width:320px;
	margin:0 auto;/*２つのときはfloat:rightにする*/
	margin-bottom:0 !important;
	}
	.btn-red a{
		height:46px;
		line-height:46px;
		font-size:16px;
		}