@charset "Shift_JIS";

.GridSet {
	width: 100%;
}


/* フォント */
#area_content {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#area_content {font-size: 100%;}

.CloudTextStyle{
	font-size: 100%;
	margin: 0 0 15px;
	line-height: 160%;
}

/* -a */
.CloudInner a {
  outline: none;
  color: #08427c;
  text-decoration: none;
}

.CloudInner a:link {
  color: #08427c;
}

.CloudInner a:visited {
  color: #6d087c;
}

.CloudInner a:hover {
  color: #b1000e;
  text-decoration: underline;
}

.CloudInner a:active {
  color: #f59130;
  text-decoration: underline;
}


/* ページの先頭へ */

.elem_pagetop {
  padding: 5px 0 15px 0;
}

.elem_pagetop .elem_pagetop_pad {
  text-align: right;
}

.elem_pagetop ul li a {
  padding: 5px 25px 5px 0;
  background: url(/products/it/harmonious/cloud/common/images/module_parts/elem_pagetop/arrow_top.png) 100% 0.4em no-repeat;
  white-space: nowrap;
  text-decoration: none;
}

/* フッター：ページの先頭へ */
#area_mega_footer .elem_pagetop {
  padding: 0 0 20px 0;
  min-width: 995px;
}

#area_mega_footer .elem_pagetop .elem_pagetop_pad {
  width: 965px;
  margin: 0 auto;
}

.elem_pagetop_pad li {
	font-size: 90%;
}
  
#PageTopContainer > .Container {
	position: relative;
}

#PageTopBtn {
	position: absolute;
	width: 40px;
	height: 40px;
	right: 15px;
	top:-40px;
	z-index: 1;
	background-color: #ff0026;
	cursor: pointer;
}
#PageTopBtn::before {
	content: "";
	position: absolute;
	right: 11px;
	top: 14px;
	width: 18px;
	height: 2px;
	z-index: -1;
	background-color: #fff;
}
#PageTopBtn::after {
	content: "";
	position: absolute;
	top: 22px;
	right: calc((40px - 10px * 1.4142) / 2);
	width: 13px;
	height: 13px;
	z-index: -1;
	border: transparent;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	box-sizing: border-box;
}

/* 間隔調整 */
.mb10 { padding-bottom: 10px!important;}
.mb20 { padding-bottom: 20px!important;}
.mb30 { padding-bottom: 30px!important;}
.mb40 { padding-bottom: 40px!important;}
.mt10 { padding-top: 10px!important;}
.mt20 { padding-top: 20px!important;}
.mt30 { padding-top: 30px!important;}
.mt40 { padding-top: 40px!important;}
.mt0 { padding-top: 0px!important;}

/* ブランディングイメージ */
#area_content .PageTitleStyle1 {
    height: 171px;
    background-image: url(/products/it/harmonious/cloud/articles/bizadvance/images/bizadvance_title.jpg);
    width: 100%;
    max-width: 1920px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
	margin: 0 auto 25px;
    border-bottom: none;
}

.PageTitleStyle1 h1 {
	height:171px;
	display: flex;
	align-items: center;
    text-align: left;
	margin-left:15px;
    color: #333;
    font-weight: bold;
    font-size: 196%;
}

/* ページ内リンク */
div.HorizontalInnerLinks {
    text-align: center;
    font-size: 100%;
}

div.HorizontalInnerLinks p {
    display: inline-block;
    text-align: center;
    margin: 0 5px;    
}
div.HorizontalInnerLinks p a {
    background-image: url(/image/jp/r1/icon/icon_link_bottom_hd.gif);
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    padding-right: 18px;
}

div.HorizontalInnerLinks p a:link {
    color: #c02;
}

/* ページ枠 */
.CloudInner {
    max-width: 995px;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}

.bg_textarea .CloudInner {
    padding: 2%;
}

/* タイトル部分 */
.bg_textarea .CloudInner h2.mainh2,
.bg_textarea .CloudInner h2.subh2{
    color: #0d6682;
    font-weight: bold;
    text-align: center;
    position: relative;
    background: none;
	margin-bottom: 20px;
	padding: 0;
}

.bg_textarea .CloudInner h2.mainh2{
    font-size: 160%;
}

.bg_textarea .CloudInner h2.subh2{
    font-size: 145%;
}

.bg_textarea .CloudInner h3 {
    font-size: 150%;
    padding-left: 10px;
    line-height: 1.5;
    background-color:#fff;
    border-left: solid 6px #b1000e;
	text-align: left;
}

.bg_textarea .CloudInner strong{
	color: #0D6682;
}

.bg_textarea .CloudInner .bcatch {
    font-size: 128%;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
    position: relative;
    color: #333;
    background-color:#dae6ef;
	padding: 10px 10px;
}

dl.AdditionalNotesStyle2 dd {
	margin: -1.55em 0 3px 1.2em;
}

/* 注意書き */
.bg_textarea .CloudInner dl.notes{
	content: "";
	display: block;
	clear: both;
	font-size: 83%;
}

.bg_textarea .CloudInner dl.notes dt{
	color : #333333;
	float: left;
}

.bg_textarea .CloudInner dl.notes dd {
	color : #333333;
	margin-left: 3em;
}

/* 表スタイル */
.bg_textarea .CloudInner table.ArticlesTable th,
.bg_textarea .CloudInner table.ArticlesTable td{
    font-size: 100%;
}
.bg_textarea .CloudInner table.ArticlesTable th{
    text-align: center;
}
.bg_textarea .CloudInner table.ArticlesTable a{
   line-height: 160%;
}
.bg_textarea .CloudInner table.ArticlesTable .LinkListStyle1{
   font-size: 100%;
   margin: 0;
}

.bg_textarea .CloudInner table.ArticlesTable .LinkListStyle1 li {
	padding: 0;
}

/* 関連リンク */
ul.RelatedLink.LinkListStyle1 {
   font-size: 100%;
}

/*----------------------------------------------
    994px以下に適用
-----------------------------------------------*/

@media screen and (max-width: 994px) {
	.JS #Contents {
		padding: 0;
	}

	.JS .GridSet {
    max-width: 994px;
    margin: 0;
	}
	.JS .Grid4 {
		padding: 0;
	}
	.JS #area_content, .JS #area_content_main {
		max-width: 994px;
	}    
	.JS .CloudInner {
		width: 100%;
	}
	.JS h2.mainh2,
	.JS h2.subh2{
		margin: 0 0 5px;
	}
	.JS .PageTitleStyle1 {
		width: 100%;
		padding-left: 0;
		margin-right: 15px;
	}
	.JS .AdditionalNotesStyle2 {
		margin-left: 0;
	}   
    
}

/*----------------------------------------------
    767px以下に適用
-----------------------------------------------*/

@media screen and (max-width: 767px) {
	.JS .PageTitleStyle1 h1 {
		font-size: 160%;
	}
}


/*----------------------------------------------
    579px以下に適用
-----------------------------------------------*/

@media screen and (max-width: 579px) {
	.JS .PageTitleStyle1 h1 {
		font-size: 150%;
	}

	.PageTitleStyle1 h1 {
		align-items: flex-start;
		padding-top: 15px;
	}
	
	/* ブランディングイメージ */
	#area_content .PageTitleStyle1 {
    	background-image: url(/products/it/harmonious/cloud/articles/bizadvance/images/bizadvance_title_sp.jpg);
    	max-width: 579px;
		background-position: left 0px bottom 0px;
	}

	.JS .bg_textarea .CloudInner h2.mainh2,
	.JS .bg_textarea .CloudInner h2.subh2{
		margin-bottom: 10px;
	}
	.JS .bg_textarea .CloudInner h2.mainh2{
    	font-size: 130%;
	}

	.JS .bg_textarea .CloudInner h2.subh2{
    	font-size: 120%;
	}
	
	.JS .bg_textarea .CloudInner .bcatch {
		font-size: 110%;
	}
	.JS .bg_textarea .CloudInner h2.mainh2:before,
	.JS .bg_textarea .CloudInner h2.mainh2:after,
	.JS .bg_textarea .CloudInner h2.mainh2:before,
	.JS .bg_textarea .CloudInner h2.mainh2:after{
		width: 3.6vw;
		height: 3.6vw;
	}
}


/*----------------------------------------------
    399px以下に適用
-----------------------------------------------*/

@media screen and (max-width: 399px) {
	.JS .PageTitleStyle1 h1 {
		font-size: 130%;
		height:150px;
	}
	#area_content .PageTitleStyle1 {
		height:150px;
	}
	
	.JS .bg_textarea .CloudInner h3 {
		font-size: 120%;
	}
}