@charset "shift_JIS";

div#jp1PageTitleArea1{
	display:flex;
	align-items:center;
	margin:0px -15px 15px;
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/topBranding.png') no-repeat center;
	min-height:360px;
	background-size:cover;
}

#Contents div.PageTitleStyle1{
	font-size:110%;
	width:965px;
	margin:0 auto;
	color:#FFF;

}

#Contents div.PageTitleStyle1 h1{
	text-shadow:3px 3px 3px rgba(0, 0, 0, 0.5)!important;
}

#Contents div.PageTitleStyle1 a{
	pointer-events:none;
}

#Contents div.PageTitleStyle1 h1{
	font-size:124%;
	font-weight:normal;
	color:#FFF;
	margin-bottom:0px!important;
	margin-left: 5px;
	line-height: 130%;
}
#Contents div.PageTitleStyle1 h1 span{
	font-size:165%;
	line-height:1.2;
	font-weight:bold;
	display:block;
	margin:0 0 10px;
}
#Contents div.PageTitleStyle1 h1 span#prodNameText{
	font-size:70%;
	font-weight:normal;
	margin:0 0 5px;
}
#Contents div.PageTitleStyle1 h1 span#awsName{
	display:inline;
	font-weight:normal;
	font-size:55%;
	margin:0;
}

div.PageTitleStyle1 p#titleSubText{
	font-size:120%;
}

a.LinkBanner div.resourcesLinkBanner{
	background-color: #9f2e13;
	margin-bottom: 30px;
	padding: 25px 0px 20px 0px;
}

a.LinkBanner:hover{
	text-decoration: none;
}

div.resourcesLinkBanner:hover{
	opacity:0.8;
}

div.resourcesLinkBanner h3{
	font-size: 150%;
	color: #fff;
	text-align: center;
}

div.resourcesLinkBanner p{
	font-size: 120%;
	color: #fff;
	text-align: center;
	text-decoration: underline #fff;
}


/** ページ内リンク **/
ul#horizontalInnerLinks{
	padding: 0;
}

ul#horizontalInnerLinks li{
	border:2px solid #C00;
	border-left:none;
	flex-basis:16.66%;
	text-align:center;
}
ul#horizontalInnerLinks li:first-child{
	border-left:2px solid #C00;
}
ul#horizontalInnerLinks li a{
	display:block;
	padding:5px 5px;
	color: #c00;
	box-sizing:border-box;
	height:100%;
	font-size: 85%;
	line-height: 140%;
}

ul#horizontalInnerLinks li a:hover{
	background-color: #c00;
	color: #fff;
}

h2{
	font-weight:bold;
}
h3{
	color:#333;
}
div.cloudjobBlock{
	padding:0 15px;
	margin:0 -15px;
}
div.cloudjobBlock div.GridSet{
	padding:50px 0;
}
div#cloudjob03top,
div.cloudjob03sub{
	margin:0 -15px;
	padding:0 15px;
}

/** 各ブロック設定 **/

#Contents 
div#definitionArea  p.TextStyle1,
div#definitionArea  p.TextStyle2,
div#cloudjob01Area p.TextStyle1,
div#cloudjob03Area p.TextStyle1,
div#cloudjob02Area p.TextStyle1,
div#cloudjob05Area p.TextStyle1,
div#cloudjob05Area p.TextStyle2,
div#summaryArea p.TextStyle1,
div#Contents div#cloudjob02Area h3,
div#Contents div#cloudjob03_02 p.TextStyle2{
	width: 85%;
	margin: 15px auto;
}

#Contents div#cloudjob03_01 ul li,
#Contents div#cloudjob03_02 ul li,
#Contents div#cloudjob05Area ul li{
	width: 85%;
	margin: 5px auto;
}


div#cloudjob01Area{
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/cloudjob01Area.png') no-repeat center;
	background-size:cover;
}
div#cloudjob02Area{
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/cloudjob02Area.png') no-repeat center;
	background-size:cover;
}
div#cloudjob03Area div#cloudjob03top{
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/cloudjob03Area.png') no-repeat center;
	background-size:cover;
}
div#cloudjob03Area div#cloudjob03_01{
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/cloudjob03_01.png') no-repeat center;
	background-size:cover;
}
div#cloudjob03Area div#cloudjob03_02{
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/cloudjob03_02.png') no-repeat center;
	background-size:cover;
}
div#cloudjob04Area{
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/cloudjob04Area.png') no-repeat center;
	background-size:cover;
}
div#cloudjob05Area{
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/cloudjob05Area.png') no-repeat center;
	background-size:cover;
	color:#FFF;
}

/** 丸文字番号リスト **/
ol.CircleList1{
	counter-reset:my-counter;
	list-style:none;
	padding:0;
	margin:0;
}
ol.CircleList1 li{
	font-size:90%;
	line-height:1.5;
	padding-left:2em;
	position:relative;
	margin-bottom:2px;
}
ol.CircleList1 li:before{
	content:counter(my-counter);
	counter-increment: my-counter;
	border:1px solid;
	border-radius:50%;
	box-sizing:border-box;
	display:flex;
	justify-content:center;
	align-items:center;
	font-size:85%;
	line-height:1;
	position:absolute;
	top:0.3em;
	left:0;
	height:1.5em;
	width:1.5em;
}

/** 丸文字通常リスト **/
ul.ListStyle1.CircleListStyle1 li{
	background:none;
	position:relative;
	padding:0 0 0 1.5em;
}
ul.ListStyle1.CircleListStyle1 li:before{
	content:"";
	display:inline-block;
	width:1em;
	height:1em;
	background:#333;
	position:absolute;
	top:0.2em;
	left:0;
	border-radius:50%;
}

div.cloudjob03sub p.ImgOnlyStyle{
	padding:30px;
	background:#FFF;
	border-radius:15px;
}

div.cloudjob03sub h3{
	font-size:150%;
	text-align:center;
}

div#cloudjob03_02 p.TextStyle2 a {
	text-decoration: none;
	background-image: url(/image/jp/r1/icon/icon_link_right_hd.gif);
	-webkit-background-size: 16px 16px;
	background-repeat: no-repeat;
	padding: 0 17px 0 0;
	background-position: right center;
}

div#cloudjob03_02 p.TextStyle2 a:hover {
	text-decoration: underline;
}


div#cloudjob04Area div.FlexWrap{
	justify-content:space-between;
}
div#cloudjob04Area div.FlexWrap p.ImgOnlyStyle{
	flex-basis:30%;
	min-width:200px;
	margin-left:15px;
}
div#cloudjob04Area div.FlexWrap p.ImgOnlyStyle:first-child{
	margin-left:0;
}
div#cloudjob04Area h2{
	text-decoration:underline;
}

div.FlexWrap.ImgBoxStyle p.ImgOnlyStyle{
	margin-right:30px;
}

/** SaaS提供によるメリット **/
div.BoxPatternC.cloudjobBox{
	background-color:#FFF;
	border-radius:15px;
	padding:15px;
	margin:0 15px 15px;
}
div.BoxPatternC.cloudjobBox h3{
	text-decoration:underline;
}
ul.meritList{
	margin-bottom:20px;
	padding:0;
	justify-content:space-between;
}
ul.meritList li{
	width:200px;
	padding-top:125px;
	background:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/meritList03.png') no-repeat top center;
	background-size:150px auto;
	text-align:center;
	font-size:76%;
	color:#4D4D4D;
}
ul.meritList li:first-child{
	background-image:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/meritList01.png');
}
ul.meritList li:first-child + li{
	background-image:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/meritList02.png');
}
ul.meritList li:last-child{
	background-image:url('/Prod/comp/soft1/jp1/feature/cloud_job_management/images/meritList04.png');
}

div#certificationArea{
	display:flex;
	justify-content:space-between;
}
div#certificationSymbol{
	display:flex;
	width:315px;
	margin-right:25px;
}
div#certificationSymbol p.ImgOnlyStyle{
	padding:0;
}
div#certificationSymbol p.ImgOnlyStyle:first-child{
	padding-right:15px;
}

/** さらに便利に！ジョブ分析「JP1 Cloud Service/Job Analysis」 **/
div#cloudjob05Area ul.ListStyle1 li{
	background:none;
	padding-left:1.5em;
	position:relative;
}
div#cloudjob05Area ul.ListStyle1 li:before{
	content:"";
	display:inline-block;
	width:1em;
	height:1em;
	background:#FFF;
	position:absolute;
	top:0.2em;
	left:0;
	border-radius:50%;
}

div#cloudjob05Area p.ImgOnlyStyle{
	background:#FFF;
	padding:30px;
	border-radius:30px;
}

/** まとめ **/
h2#summary{
	text-decoration:underline;
}

div#downloadArea{
	margin-bottom:50px;
}

div#downloadArea div.GridSet{
	background:#B3F9FE;
}
div#downloadArea div.GridSet div.Grid4{
	box-sizing:border-box;
	padding:0 30px;
}
h2#download{
	text-decoration:underline;
}
ul#downloadImage{
	display:flex;
	justify-content:center;
	margin-bottom:30px;
}
ul#downloadImage li{
	text-align:center;
	font-size:120%;
	font-weight: bold;
}
ul#downloadImage li:first-child{
	margin-right:30px;
}
div#downloadArea ul.LinkListStyle1,
div#downloadArea ul.LinkListStyle1 li{
	margin:0;
	padding:0;
}
div#downloadArea ul.LinkListStyle1 li a{
	display:block;
	font-size:180%;
	max-width: 80%;
	font-weight:bold;
	margin: 0 auto;
	color:#FFF;
	padding:20px 10px;
	text-align:center;
	border-radius:2em;
	padding-right:20px;
	background:#1A4E8E;
}
div#downloadArea ul.LinkListStyle1 li a span{
	padding-right:35px;
	background:url(/image/jp/r1/icon/icon_new_window_white_hd.png) no-repeat center right;
	line-height:1.6;
}

div.RelatedLinks ul.LinkListStyle1{
	background:#FBE5D6;
	padding:10px 20px;
}
div.RelatedLinks ul.LinkListStyle1 li a{
	font-weight:bold;
	color:#333;
}

/** お問い合わせ **/
#observabilitybottomContentsSet .Inquiry{
	margin-top:15px;
}
#observabilitybottomContentsSet .Inquiry > a{
	margin:0 auto;
	max-width:500px;
	background:#707070 url('/image/jp/r1/icon/icon_inquiry_white_hd.png') no-repeat center;
	border:1px solid #2F528F;
	display:block;
	background-position-x:calc(100% - 25px);
	padding:15px 55px;
}
#observabilitybottomContentsSet .Inquiry span{
	display:block;
	color:#FFF;
}
#observabilitybottomContentsSet .Inquiry span:first-child{
	font-weight:bold;
}
#observabilitybottomContentsSet .Inquiry span:last-child{
	font-size:90%;
}

/* for - 965px
=========================================================================================== */
@media screen and (max-width:964px){
	.JS div#jp1PageTitleArea1{
		width:auto;
	}
	
	.JS #Contents div.PageTitleStyle1{
		padding:0 15px 10px 15px;
	}
}

/* for - 768px
=========================================================================================== */
@media screen and (max-width:767px){
	.JS div#jp1PageTitleArea1{
		min-height: 300px;
		background-position: top 0 right -400px;
	}
	
	.JS #Contents div.PageTitleStyle1 h1{
		font-size:85%;
	}
	
	.JS ul#horizontalInnerLinks li{
		border:2px solid #C00;
		border-bottom:none;
	}
	
	.JS ul#horizontalInnerLinks li:last-child{
		border-bottom:2px solid #C00;
	}
	
	/** SaaSで利用可能！「JP1 Cloud Service/Job Management」 **/
	.JS div#cloudjob04Area .FlexWrap{
		display:flex;
		justify-content:center;
		flex-wrap:wrap;
	}
	.JS div#certificationArea{
		display:block;
	}
	.JS div#certificationSymbol{
		margin:0;
		justify-content:center;
		width:100%;
	}

	.JS ul#downloadImage li{
		font-size:90%;
	}
	.JS div#downloadArea ul.LinkListStyle1 li a{
		font-size:150%;
	}
}
/* for - 480px
=========================================================================================== */
@media screen and (max-width:479px){
	/** SaaSで利用可能！「JP1 Cloud Service/Job Management」 **/
	.JS div#cloudjob04Area .FlexWrap{
		display:block;
		justify-content:center;
	}
	.JS div#cloudjob04Area div.FlexWrap p.ImgOnlyStyle,
	.JS div#cloudjob04Area ul.meritList li{
		margin:0 auto 10px;
		width:250px;
	}
}