@charset "shift_JIS";

p.urlCopyButton{ display:none; }

div#jp1PageTitleArea1{
	background:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/topBrandingBack.png') no-repeat center;
	background-size:cover;
	height:450px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	position:relative;
	overflow:hidden;
	margin-bottom:20px;
}
div#jp1PageTitleArea1.FeatureTitle3:after{
	content:"";
	display:block;
	background:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/topBrandingIcon.png') no-repeat center;
	background-size:auto 300px;
	width:350px;
	height:450px;
	position:absolute;
	left:calc((50% - 482.5px) + 770px);
	top:0;
}
div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1{
	width:calc((50% - 482.5px) + 965px);
	margin:0;
}
div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1 div#PageTitleInner{
	display:flex;
	background:rgba(31, 61, 182, 0.4);
	transform:skew(-30deg);
	margin:0 100px 0 -100px;
	padding:30px 0;
}

div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1 h1{
	color:#FFF;
	transform:skew(30deg);
	margin-left:calc(50vw - 400.5px);
	box-sizing:border-box;
	font-size: 138%;
}
div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1 h1 a{
	pointer-events:none;
	display:block;
	font-weight:bold;
	font-size:130%;
	margin-bottom:30px;
}
div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1 h1 span{
	font-weight:normal;
	font-size:100%;
}

/*[メインページ内リンク]*/
ul#horizontalInnerLinks{
	padding: 0;
}

ul#horizontalInnerLinks li{
	border:2px solid #C00;
	border-left:none;
	flex-basis:16.6%;
	text-align:center;
}
ul#horizontalInnerLinks li:first-child{
	border-left:2px solid #C00;
}
ul#horizontalInnerLinks li a{
	display:block;
	padding:10px 5px;
	color: #c00;
	font-size: 95%;
	box-sizing:border-box;
	height:100%;
}

ul#horizontalInnerLinks li a:hover{
	background-color: #c00;
	color: #fff;
}

/*[全ブロック共通]*/
div.migrationsBlock{
	padding:50px 15px;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
}
h2{
	color:#2D2D2D;
	font-weight:bold;
	margin-top:0;
	line-height: 130%;
}
h2 strong{
	color:#2D2D2D;
	text-decoration-line：none;
	display:block;
	line-height:1.3;
	font-size: 120%;
	margin-bottom: 10px;
	text-decoration: underline;
}

/*[ジョブ管理システムの移行パターン]*/
div#migration01to02Area{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/migration01AreaBack.png');
}
div#migration01to02Area div.FlexWrap{
	flex-wrap:wrap;
	gap:2px;
}
/*box設定共通、3つめ含*/
div#migration01to02Area div.flexInner{
	background:#FFF;
	box-sizing:border-box;
	border:10px solid #196B24;
	width:calc(50% - 1px);
	margin-bottom:10px;
	text-align:center;
	padding:15px;
}
div#migration01to02Area div.flexInner h3{
	color:#196B24;
}
div#migration01to02Area div.flexInner h3 .circleItem{
	border-color:#196B24;
}
p.TextStyle1.Requirements{
	min-height:6.5em;
}
p.TextStyle1.arrowStyle span{
	display:block;
}
p.TextStyle1.arrowStyle span:first-child{
	margin-bottom:30px;
	position:relative;
}
p.TextStyle1.arrowStyle span:first-child:after{
	content:"";
	border:10px solid rgba(255, 255, 255, 0);
	border-top:13px solid #C00000;
	position:absolute;
	bottom:-30px;
	left:calc(50% - 5px);
}

/*box設定1つめ*/
div#migration01to02Area div.flexInner:first-child{
	border-color:#0070C0;
}
div#migration01to02Area div.flexInner:first-child h3{
	color:#0070C0;
}
div#migration01to02Area div.flexInner:first-child h3 .circleItem{
	border-color:#0070C0;
}
/*box設定2つめ*/
div#migration01to02Area div.flexInner:first-child + div.flexInner{
	border-color:#E97132;
}
div#migration01to02Area div.flexInner:first-child + div.flexInner h3{
	color:#E97132;
}
div#migration01to02Area div.flexInner:first-child + div.flexInner h3 .circleItem{
	border-color:#E97132;
}
/*box設定4つめ*/
div#migration01to02Area div.flexInner:last-child{
	border-color:#A02B93;
}
div#migration01to02Area div.flexInner:last-child h3{
	color:#A02B93;
}
div#migration01to02Area div.flexInner:last-child h3 .circleItem{
	border-color:#A02B93;
}

table#MigrationTable th{
	text-align:center;
	color:#FFF;
	font-weight:bold;
	background:#196B24;
}
table#MigrationTable tr td ul.circleList li:before{
	background:#196B24;
}
table#MigrationTable th:first-child{
	background:#000;
}
table#MigrationTable th:first-child + th{
	background:#0070C0;
}
table#MigrationTable tr td:first-child + td ul.circleList li:before{
	background:#0070C0;
}
table#MigrationTable th:first-child + th + th{
	background:#E97132;
}
table#MigrationTable tr td:first-child + td + td ul.circleList li:before{
	background:#E97132;
}
table#MigrationTable th:last-child{
	background:#7030A0;
}
table#MigrationTable tr td:last-child ul.circleList li:before{
	background:#7030A0;
}
table#MigrationTable th span.circleItem{
	border-color:#FFF;
}
table#MigrationTable tr td:first-child{
	text-align:center;
}

table#MigrationTable td.Excellent{
	font-family: BIZ UDPゴシック;
	font-weight:bold;
	color:#0070C0;
	background:#DCEAF7;
}
table#MigrationTable td.noProblem{
	font-family: BIZ UDPゴシック;
}
table#MigrationTable td.difficult{
	font-family: BIZ UDPゴシック;
	font-weight:bold;
	color:#C00000;
	background:#F2F2F2;
}
table#MigrationTable td.Excellent,
table#MigrationTable td.difficult,
table#MigrationTable td.noProblem{
	text-align:center;
	font-size: 105%;
}

table#MigrationTable td.Excellent sup{
	font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 83%;
}

table#MigrationTable tr:nth-child(5) td:first-child,
table#MigrationTable tr:nth-child(6) td:first-child{
	background:#156082;
	color:#FFF;
	font-weight:bold;
}


/*[つまずきポイント]*/
div#migration03Area{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/migration03AreaBack.png');
}
div#migration03Area div.FlexWrap{
	gap:10px;
	flex-wrap:wrap;
}

div#migration03Area h3{
	color: #535252;
}

div#migration03Area div.FlexWrap .flexInner{
	background:#FFF;
	width:calc(50% - 5px);
	box-sizing:border-box;
	padding:20px;
}
div#migration03Area div.FlexWrap p.flexInner{ font-weight:bold; }
div#migration03Area div.FlexWrap p.flexInner span{
	display:block;
	font-size:90%;
}

div#migration03Area div.FlexWrap dl.flexInner dt{
	font-weight:bold;
	color:#00B050;
	font-size: 110%;
}
div#migration03Area div.FlexWrap dl.flexInner li{
	font-size:95%;
	font-weight: bold;
	text-indent:-1.2em;
	margin-left:1.2em;
}
div#migration03Area div.FlexWrap dl.flexInner li:before{
	content:"・";
	color:#00B050;
}
div#migration03Area div.FlexWrap dl.flexInner dt .circleItem{
	border-color:#00B050;
}
/*1つ目*/
div#migration03Area div.FlexWrap dl.flexInner:first-child dt{
	color:#0070C0;
}
div#migration03Area div.FlexWrap dl.flexInner:first-child dt .circleItem{
	border-color:#0070C0;
}
div#migration03Area div.FlexWrap dl.flexInner:first-child li:before{
	color:#0070C0;
}
/*2つ目*/
div#migration03Area div.FlexWrap dl.flexInner:first-child + dl.flexInner dt{
	color:#E97132;
}
div#migration03Area div.FlexWrap dl.flexInner:first-child + dl.flexInner dt .circleItem{
	border-color:#E97132;
}
div#migration03Area div.FlexWrap dl.flexInner:first-child + dl.flexInner li:before{
	color:#E97132;
}
/*4つ目*/
div#migration03Area div.FlexWrap dl.flexInner:last-child dt{
	color:#7030A0;
}
div#migration03Area div.FlexWrap dl.flexInner:last-child  dt .circleItem{
	border-color:#7030A0;
}
div#migration03Area div.FlexWrap dl.flexInner:last-child li:before{
	color:#7030A0;
}


/*[ジョブ管理システムのクラウド移行にはJP1]*/
div#migration04to05Area{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/migration04AreaBack.png');
}
div#migration04to05Area h3{
	color:#C00000;
}
div#migration04to05Area div.FlexWrap{
	flex-wrap:wrap;
}
div#migration04to05Area div.migration04Contents{
	background:#FFF;
	padding:20px;
	border-radius:20px;
}
div#migration04to05Area div.FlexWrap dl.flexItem dt{
	font-weight:bold;
	margin-bottom:10px;
	color:#00B050;
}
div#migration04to05Area div.FlexWrap dl.flexItem dt .circleItem{
	border-color:#00B050;
}
div#migration04to05Area div.FlexWrap dl.flexItem:first-child dt{
	color:#0070C0;
}
div#migration04to05Area div.FlexWrap dl.flexItem:first-child dt .circleItem{
	border-color:#0070C0;
}
div#migration04to05Area div.FlexWrap dl.flexItem:first-child + dl.flexItem dt{
	color:#E97132;
}
div#migration04to05Area div.FlexWrap dl.flexItem:first-child + dl.flexItem dt .circleItem{
	border-color:#E97132;
}
div#migration04to05Area div.FlexWrap dl.flexItem:last-child dt{
	color:#7030A0;
}
div#migration04to05Area div.FlexWrap dl.flexItem:last-child dt .circleItem{
	border-color:#7030A0;
}
div#migration04to05Area div.FlexWrap dl.flexItem p.ImgOnlyStyle{
	margin:0;
}
div#migration04to05Area div.FlexWrap dl.flexItem img{
	max-height:140px;
}
div#migration04to05Area div.FlexWrap dl.flexItem dd > div.FlexWrap{
	padding:0;
	justify-content:space-between;
	display: flex;
}
div#migration04to05Area div.FlexWrap dl.flexItem dd > div.FlexWrap p.TextStyle2{
	width:50%;
}
div#migration04to05Area h3#migration0401{
	color:#156082;
}

/*[ジョブ管理のクラウド移行でJP1が選ばれる理由]*/
div#migration05Area > h3 + div.Section:not(:last-child){
	border-bottom:3px solid #C00000;
	padding:0 0 30px;
	margin-bottom:20px;
}
div#migration05Area ul.FlexWrap{
	gap:20px;
	padding:0;
}
div#migration05Area .figureBox{
	margin-bottom:20px;
	text-align:center;
	background:#FFF;
	color:#C00000;
	font-weight:bold;
	font-size:100%;
	border:1px solid #C00000;
	border-radius:10px;
	padding:200px 15px 20px;
	background-position:center 20px;
	background-repeat:no-repeat;
	background-size:auto 160px;
}
div#migration05Area div#figureArea .figureBox:first-child{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/migration0501.png');
}
div#migration05Area div#figureArea .figureBox:last-child{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/migration0505.png');
}
div#migration05Area div#figureArea ul li.figureBox{
	flex-grow:1;
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/migration0503.png');
}
div#migration05Area div#figureArea ul li.figureBox:first-child{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/migration0502.png');
}
div#migration05Area div#figureArea ul li.figureBox:last-child{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/migration0504.png');
}

ul.rListStyle li{
	text-indent:-1.2em;
	margin-left:1.2em;
	font-size:90%;
}
ul.rListStyle li:before{
	content:"・";
	color:#C00000;
}

ul.characterList,
div.characterList{
	display:flex;
	gap:20px;
}
ul.characterList li,
div.characterList dl{
	border:1px solid #156082;
	padding:10px 15px;
	background:#FFF;
	text-align:center;
	flex-grow:1;
}
ul.characterList li,
div.characterList dl dt{
	font-weight:bold;
	color:#156082;
}
ul.characterList li{
	flex-basis:calc(50% - 10px);
}
div.characterList dl{
	flex-basis:calc(33% - 13.3px);
}


div#migration04to05Area div#JobManagetFunction.FlexWrap{
	flex-wrap:nowrap;
	gap:15px;
	padding:0;
}
div#JobManagetFunction > dl{
	flex-basis:calc(33% - 10px);
	padding-bottom:160px;
	background:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/JobManagetFunc02.png') no-repeat center bottom;
	background-size:auto 150px;
}
div#JobManagetFunction > dl:first-child{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/JobManagetFunc01.png');
}
div#JobManagetFunction > dl:last-child{
	background-image:url('/Prod/comp/soft1/jp1/feature/automation/jp1_job_cloud_migration/images/JobManagetFunc03.png');
}
div#JobManagetFunction > dl > dt{
	background:#00487E;
	color:#FFF;
	font-weight:bold;
	padding:2px 10px;
	min-height:4em;
	display:flex;
	flex-direction:column;
	justify-content:center;
	margin-bottom:15px;
}
div#JobManagetFunction > dl > dd{
	padding:0 10px;
}
div#JobManagetFunction > dl > dd > dl dt{
	color:#002060;
	font-weight:bold;
	margin-bottom:10px;
}
div#JobManagetFunction ul.circleList.bDiskStyle li:before{
	background:#00487E;
}


/*[FAQ　よくある質問]*/
div#migration06Area{
	padding-bottom:0;
}
ul.faqList > li.question{ margin-bottom:5px; }
ul.faqList > li > dl{
	display:flex;
	padding:10px;
}
ul.faqList > li.question > dl{
	background:#000;
	color:#FFF;
	font-size:90%;
	font-weight:bold;
}
ul.faqList > li > dl dt span{
	padding-right:0.5em;
	margin-right:1em;
	border-right:2px solid;
}
ul.faqList > li.question > dl dt span{
	border-color:#FFF;
}
ul.faqList > li.answer > dl dt span{
	border-color:#C00000;
	font-weight:bold;
	color:#C00000;
}


/*[まとめ]*/
div#migration07Area{
	background:#002060;
	color:#FFF;
}
div#migration07Area strong{
	color:#FFF;
	font-size: larger;
}


/*[資料ダウンロード]*/
ul.DownloadLinkList li{
	max-width:80%;
	margin:0 auto 15px;
}
ul.DownloadLinkList li a{
	display:block;
	color:#FFF;
	font-size:120%;
	font-weight:bold;
	background:#4E95D9;
	padding:20px;
	border-radius:2em;
	text-align:center;
}
ul.DownloadLinkList li a span{
	background:url(/image/jp/r1/icon/icon_link_right_l_white_hd.gif) no-repeat center right;
	padding-right:25px;
	background-size:25px;
}
ul.DownloadLinkList li a span b{
	font-size:120%;
}


/*[お問い合わせ]*/
#migrationbottomContentsSet .Inquiry{
	margin-top:15px;
}
#migrationbottomContentsSet .Inquiry > a{
    margin: 0 auto;
    max-width: 500px;
    background: #707070 url('/image/jp/r1/icon/icon_inquiry_white_hd.png') no-repeat center right;
    border: 1px solid #2F528F;
    display: block;
    background-position-x: calc(100% - 25px);
    padding: 15px 55px;
}
#migrationbottomContentsSet .Inquiry > a:hover{
    text-decoration: none;
    opacity: 0.7;
}

#migrationbottomContentsSet .Inquiry span{
    display: block;
    color: #fff;
}

#migrationbottomContentsSet .Inquiry span:first-child{
    font-weight: bold;
}

#migrationbottomContentsSet .Inquiry span:last-child{
    font-size: 90%;
}

#migrationbottomContentsSet div#BoxBottom{
	max-width:610px;
	margin:0 auto;
	text-align:left;
}
#migrationbottomContentsSet div#BoxBottom ul.LinkListStyle1{ text-align:center; }
#migrationbottomContentsSet div#BoxBottom ul.LinkListStyle1 li{
	display:inline-block;
	background:#FFF;
	padding:5px 20px;
}
#migrationbottomContentsSet div#BoxBottom h3{
	font-weight:normal;
	font-size:100%;
	color:#000;
}
#migrationbottomContentsSet div#BoxBottom h4{
	font-weight:normal;
	line-height:110%;
}


/*強調アイテム（bold化）*/
.strongStyle{
	font-weight:bold!important;
}
.circleItem{
	margin:0 0.3em;
	text-align:center;
}

/*丸付きリスト */
.circleHeader,
ul.circleList li,
ul.circleList li,
dl.circleList dt{
	padding-left:1.2em;
	text-indent:-1.2em;
	margin-bottom: 15px;
}

.circleHeader:before,
ul.circleList li:before,
dl.circleList dt:before{
	content:"";
	display:inline-block;
	width:10px;
	height:10px;
	line-height:1;
	background:#333;
	border-radius:50%;
	margin-right:0.5em;
}
ul.circleList.rDiskStyle li:before{
	background:#C00000;
}

/* for - 1290px
=========================================================================================== */
@media screen and (max-width:1290px){

	.JS div#jp1PageTitleArea1.FeatureTitle3::after {
		right:0;
		left:auto;
	}
	.JS div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1{
		width:90%!important;
	}
	.JS div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1 h1{
		max-width:calc(100vw - 380px);
	}

}


/* for - 1164px
=========================================================================================== */
@media screen and (max-width:1164px){
}

/* for - 994px
=========================================================================================== */
@media screen and (max-width:994px){

	.JS div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1 h1{
		margin-left:115px;
	}
	.JS ul.DownloadLinkList li{
		max-width:none;
	}
}

/* for - 964px
=========================================================================================== */
@media screen and (max-width:964px){
}

/* for - 768px
=========================================================================================== */
@media screen and (max-width:767px){

	.JS div#jp1PageTitleArea1{
		justify-content:normal;
		height:auto;
		padding-bottom:390px;
	}
	.JS div#jp1PageTitleArea1.FeatureTitle3::after{
		background-size:100% auto;
		height:380px;
		top:auto;
		right:auto;
		bottom:10px;
		left:calc(50% - 175px);
	}
	.JS div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1{
		width:100%!important;
	}
	.JS div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1 div#PageTitleInner{
		transform:none;
		margin:50px 0 0;
	}
	.JS div#jp1PageTitleArea1.FeatureTitle3 div.PageTitleStyle1 h1{
		text-shadow:none;/*jp1feature.css打消し*/
		transform:none;
		margin:0 15px;
		max-width:none;
	}
	.JS ul#horizontalInnerLinks li{
		border-left:2px solid #C00;
		border-bottom:none;
	}
	.JS ul#horizontalInnerLinks li:last-child{
		border-bottom:2px solid #C00;
	}
	
	.JS div#migration01to02Area div.flexInner{
		width:100%;
	}
	.JS div#migration03Area div.FlexWrap,
	.JS div#migration04to05Area div#JobManagetFunction.FlexWrap{
		display:flex;
		flex-direction:column;
	}
	.JS div#migration03Area div.FlexWrap .flexInner{
		width:100%;
	}
	.JS div#migration04to05Area div.FlexWrap dl.flexItem img{
		max-height:none;
	}
	.JS div#migration04to05Area div.FlexWrap dl.flexItem img.singleImage{
		width:50%;
	}
}

/* for - 579px
=========================================================================================== */
@media screen and (max-width:579px){
	.JS div.PageTitleStyle1{
		padding-top: 50px;
	}
	.JS ul.characterList,
	.JS div.characterList{
		flex-direction:column;
	}
}