.container { width: 100%; height: 100%; position: relative; }
.container * { background-position: center center; background-repeat: no-repeat; background-size: contain; letter-spacing: -1px; box-sizing: border-box; word-break: keep-all; }
.container > .section { margin: 0 auto; }
.container > .section > .article01 > .topBox > h2 { color: #595959; background-image: url(/assets/_img/sub/jobcenter/GreenEmploymentSupportSystem/parentheses.png); text-align: center; background-size: contain; font-weight: bold; }
.container > .section > .article01 > .topBox > h3 { color: #595959; margin: 0 auto; text-align: center; font-weight: normal; }
.container > .section > .article01 > .numberBox { border-top: 1px solid #ccc; }
.container > .section > .article01 > .numberBox > ul > li > div { margin: 0 auto; }
.container > .section > .article01 > .numberBox > ul > li > div > span { width: 0; height: 0; display: block; overflow: hidden; }
.container > .section > .article01 > .numberBox > ul > li > p { margin: 0 auto; text-align: center; }
.container > .section > .article01 > .numberBox > ul > .img01 > div { background-image: url(/assets/_img/sub/servicecenter/college01.png); }
.container > .section > .article01 > .numberBox > ul > .img02 > div { background-image: url(/assets/_img/sub/servicecenter/college02.png); }
.container > .section > .article01 > .numberBox > ul > .img03 > div { background-image: url(/assets/_img/sub/servicecenter/college03.png); }
.container > .section > .article01 > .numberBox ul:after { content: ""; display: block; clear: both; }
.container > .section > .article02 > ul > li > h4 { border-left: 4px solid #006cba; color: #565656; }
.container > .section > .article02 > ul > li > h5 { color: #333; }
.container > .section > .article02 > ul > li > p { color: #595959; }
.container > .section > .article02 > ul > li > div > span { width: 0; height: 0; display: block; overflow: hidden; }
.container > .section > .article03 { border-top: 1px solid #ccc; }
.container > .section > .article03 > a { background-color: #006cba; text-align: center; text-decoration: none; color: #fff; display: block; font-weight: bold; margin: 0 auto; }

@media all and (min-width: 1080px) { .container > .section { width: 900px; padding: 94px 0; }
  .container > .section .smallText { font-size: 13px; line-height: 28px; }
  .container > .section .nomalText { font-size: 16px; line-height: 24px; }
  .container > .section > div { width: 100%; }
  .container > .section > .article01 { margin-bottom: 70px; }
  .container > .section > .article01 > .topBox { width: 100%; height: 110px; margin-bottom: 30px; }
  .container > .section > .article01 > .topBox > h2 { width: 400px; height: 45px; font-size: 30px; line-height: 45px; margin: 0 auto; margin-bottom: 24px; }
  .container > .section > .article01 > .topBox > h3 { font-size: 16px; width: 100%; height: auto; line-height: 24px; }
  .container > .section > .article01 > .numberBox { padding-top: 100px; }
  .container > .section > .article01 > .numberBox > ul { width: 100%; }
  .container > .section > .article01 > .numberBox > ul > li { width: 33%; float: left; }
  .container > .section > .article01 > .numberBox > ul > li > div { width: 205px; height: 172px; margin-bottom: 15px; }
  .container > .section > .article02 > ul > li { width: 100%; margin-bottom: 60px; }
  .container > .section > .article02 > ul > li > h4 { padding-left: 10px; margin-bottom: 15px; font-size: 22px; height: 24px; line-height: 24px; }
  .container > .section > .article02 > ul > li > h5 { padding-left: 10px; margin-bottom: 5px; font-size: 18px; height: 20px; line-height: 20px; }
  .container > .section > .article02 > ul > li > p { padding-left: 10px; }
  .container > .section > .article02 > ul > li > .mbtx { margin-bottom: 25px; }
  .container > .section > .article02 > ul > li > div { width: 100%; height: 400px; background-image: url(/assets/_img/sub/servicecenter/college2_pc.png); margin-top: 30px; }
  .container > .section > .article03 { height: 90px; padding-top: 48px; }
  .container > .section > .article03 > a { width: 275px; height: 42px; line-height: 42px; border-radius: 42px; font-size: 16px; } }
@media (min-width: 641px) and (max-width: 1079px) { .container > .section { width: 96%; padding: 58px 0; }
  .container > .section .smallText { font-size: 13px; line-height: 20px; }
  .container > .section .nomalText { font-size: 13px; line-height: 20px; }
  .container > .section > .article01 { margin-bottom: 7%; }
  .container > .section > .article01 > .topBox { margin-bottom: 3%; }
  .container > .section > .article01 > .topBox > h2 { width: 100%; height: 42px; line-height: 42px; font-size: 29px; margin-bottom: 3%; }
  .container > .section > .article01 > .topBox > h3 { width: 100%; height: 46px; font-size: 16px; line-height: 24px; }
  .container > .section > .article01 > .numberBox { padding-top: 4%; }
  .container > .section > .article01 > .numberBox > ul { width: 100%; height: auto; }
  .container > .section > .article01 > .numberBox > ul > li { width: 90%; margin: 0 auto; margin-bottom: 30px; }
  .container > .section > .article01 > .numberBox > ul > li > div { width: 40%; height: 140px; float: left; }
  .container > .section > .article01 > .numberBox > ul > li > p { float: left; height: 140px; text-align: left; padding-top: 30px; }
  .container > .section > .article01 > .numberBox > ul > .img03 > p { padding-top: 20px; }
  .container > .section > .article01 > .numberBox > ul li:after { content: ""; display: block; clear: both; }
  .container > .section > .article02 > ul > li { margin-bottom: 30px; }
  .container > .section > .article02 > ul > li > h4 { height: 18px; line-height: 20px; font-size: 17px; margin-bottom: 12px; padding-left: 6px; }
  .container > .section > .article02 > ul > li > h5 { padding-left: 6px; }
  .container > .section > .article02 > ul > li > p { padding-left: 6px; }
  .container > .section > .article02 > ul > li > div { width: 100%; height: 350px; background-image: url(/assets/_img/sub/servicecenter/college2_pc.png); }
  .container > .section > .article03 { height: 80px; padding-top: 45px; }
  .container > .section > .article03 > a { font-size: 14px; width: 35%; height: 35px; border-radius: 35px; line-height: 35px; } }
@media (max-width: 640px) { .container > .section { width: 96%; padding: 40px 0; }
  .container > .section .smallText { font-size: 12px; line-height: 18px; }
  .container > .section .nomalText { font-size: 11px; line-height: 18px; }
  .container > .section > div { width: 100%; }
  .container > .section > .article01 { margin-bottom: 30px; }
  .container > .section > .article01 > .topBox { margin-bottom: 5%; }
  .container > .section > .article01 > .topBox > h2 { width: 100%; height: 26px; font-size: 18px; line-height: 28px; margin-bottom: 4%; }
  .container > .section > .article01 > .topBox > h3 { width: 100%; font-size: 13px; line-height: 20px; }
  .container > .section > .article01 > .numberBox { padding-top: 4%; }
  .container > .section > .article01 > .numberBox > ul { width: 100%; }
  .container > .section > .article01 > .numberBox > ul > li { width: 100%; margin-bottom: 5%; }
  .container > .section > .article01 > .numberBox > ul > li > div { width: 100%; height: 150px; margin-bottom: 15px; }
  .container > .section > .article02 > ul { width: 100%; }
  .container > .section > .article02 > ul > li { width: 100%; margin-bottom: 3%; }
  .container > .section > .article02 > ul > li > h4 { padding-left: 10px; font-size: 12px; height: 13px; line-height: 13px; margin-bottom: 10px; }
  .container > .section > .article02 > ul > li > h5 { font-size: 13px; left: 18px; margin-bottom: 4px; }
  .container > .section > .article02 > ul > li > p { margin-bottom: 15px; }
  .container > .section > .article02 > ul > li > div { background-image: url(/assets/_img/sub/servicecenter/college2_m.png); width: 100%; height: 420px; }
  .container > .section > .article03 { height: 70px; padding-top: 35px; margin-top: 20px; }
  .container > .section > .article03 > a { font-size: 14px; width: 70%; height: 35px; line-height: 35px; border-radius: 35px; } }