@charset "UTF-8";

.box-gray {background:#efefef; color:#000000; width:100%; max-width:250px; text-align:center; border-radius: 16px; font-size:1em; margin:0 auto; padding:18px 0}
.sero-line {margin:0 auto; width:1px; height:30px; background:#dfdfdf; padding:0; overflow:hidden;}

.box-main-title {display: flex; justify-content: center; align-items: center; text-align:center }

.box-main-title .box-gray {flex:0 0 200px; margin:0 0 0 -250px; }
.box-main-title .box-arrow {flex:0 0 40px;}
.box-main-title .box-title {flex:0 0 280px; margin:0 ;text-align:center;}

.box-arrow span {display: inline-block;  color:#6d6d6d;margin:0 16px; font-size:1.65rem;}
.box-sub-job {display:flex; justify-content: start; align-items: start;}
.box-group { text-align:center; width:22%; padding:0 1.5%; position: relative;}
.box-group::before {display:block; width:100%; height:1px; overflow:hidden; position:absolute; top:0; left:0; background:#dfdfdf;clear:both; content:""}
.box-group.first::before {width:50%; left:50%;}
.box-group.last::before {width:50%; left:0;}

.box-title {background:#F5AB2C; border-radius: 16px; padding:16px; font-size:1.25rem; color:#ffffff; width:100%; margin:0 auto; text-align:center;}
.box-normal {text-align:left; background:#efefef; margin:8px 0 0 0; border-radius: 16px; padding:24px;}
.box-normal li {margin-left:12px; padding:4px 0; font-weight:400}
.box-normal li::marker {content:"- ";}
.box-normal .user {font-weight:500; font-size:1.085rem; padding-bottom:8px;}

.box-main-job {border:1px solid #F5AB2C; border-radius: 16px; overflow: hidden; display:flex; justify-content: start; align-items: center; padding:24px 0; margin-top:8px;}
.part-title {flex:1 1 32%; text-align:center; font-weight: 500; font-size:1.35rem;}

.part-content {flex:1 1 68%; text-align:left; border-left:1px solid #efefef; padding-left:16px}
.part-content li {margin-left:14px; padding:4px 0}
.part-content li::marker {content: "- "}

.table-job {table-layout: fixed; width:100%}
.table-job thead th {border-top: 1px solid #F5AB2C; border-bottom: 1px solid #F5AB2C; padding:12px 0; text-align:center; font-weight:500 }
.table-job tbody td {border-bottom:1px solid #dfdfdf; padding:12px; background:#f6f6f6}
.table-job tbody th {border-bottom:1px solid #dfdfdf; padding:12px; text-align:center; font-weight: 400; background:#f6f6f6}
.table-job caption {font-size:1.25rem; text-align:left; padding-top:36px;}
.table-job ul li::marker {content:"\EB7B"; font-family:'remixicon';}
.table-job ul li {margin-left:8px; padding-left:4px;}


@media(max-width: 1280px) {
    .page-content {font-size: 0.925rem;}
}
@media(max-width: 1200px) {
    .box-sub-job .sero-line {display:none}
    .sero-line.pc {display:none;}
    
    .box-group {padding-top:24px;}
    .box-group.big {padding-top:0;}
    .box-group::before {display:none;}
    .box-sub-job {flex-wrap:wrap;}
    .box-sub-job .box-group {flex:1 1 49%;}
}
@media(max-width: 700px) {
    .box-sub-job .box-group {flex: 1 1 99%;}
}
@media(max-width: 380px) {
    .box-main-job {flex-wrap: wrap; }
    .part-title {flex:1 1 100%; text-align: left; padding-left:16px; }
    .part-content {flex:1 1 100%; }
}