@charset "utf-8";

/* --------------------------
 *    reset
 * --------------------------
**/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,
aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,
nav,output,ruby,section,summary,time,mark,audio,video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,
nav,section {
    display: block;
}
body {
    line-height: 1;
}
ol,
ul {
    list-style: none;
}
blockquote,
q {
    quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
input:focus {
    outline: none;
}
a {
    color: inherit;
    text-decoration: none;
}


/* --------------------------
 *    font
 * --------------------------
**/

@font-face {
    font-family: 'GmarketSans';
    font-weight: 300;
    font-style: normal;
    src: url('fonts/GmarketSansLight.eot');
    src: url('fonts/GmarketSansLight.eot?#iefix') format('embedded-opentype'),
    url('fonts/GmarketSansLight.woff2') format('woff2'),
    url('fonts/GmarketSansLight.woff') format('woff'),
    url('fonts/GmarketSansLight.ttf') format("truetype");
    font-display: swap;
}

@font-face {
    font-family: 'GmarketSans';
    font-weight: 500;
    font-style: normal;
    src: url('fonts/GmarketSansMedium.eot');
    src: url('fonts/GmarketSansMedium.eot?#iefix') format('embedded-opentype'),
    url('fonts/GmarketSansMedium.woff2') format('woff2'),
    url('fonts/GmarketSansMedium.woff') format('woff'),
    url('fonts/GmarketSansMedium.ttf') format("truetype");
    font-display: swap;
}

@font-face {
    font-family: 'GmarketSans';
    font-weight: 700;
    font-style: normal;
    src: url('fonts/GmarketSansBold.eot');
    src: url('fonts/GmarketSansBold.eot?#iefix') format('embedded-opentype'),
    url('fonts/GmarketSansBold.woff2') format('woff2'),
    url('fonts/GmarketSansBold.woff') format('woff'),
    url('fonts/GmarketSansBold.ttf') format("truetype");
    font-display: swap;
}

*, *:before, *:after {box-sizing: border-box;}

html, body {font-size: 16px;}

.joba-wrap {display: flex; flex-direction: column; justify-content: center; position: relative; width: 100vw; min-height: 100vh; background: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/bg.png) repeat; font-family: 'GmarketSans'; color: #000;}
.joba-wrap.page1 {align-items: center; padding: 0 60px;}
.joba-wrap.page2 {padding: 0 60px;}
.joba-wrap.page3 {padding: 0 15px; align-items: center;}
.joba-wrap .bg {display: block; position: absolute; left: 0; bottom: 0; width: 100%; background-color: #0070C0;}
.joba-wrap.page1 .bg {height: 48%;}
.joba-wrap.page2 .bg {height: 30%;}
.joba-wrap.page3 .bg {height: 48%;}
.joba-wrap .joba-titbox {z-index: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; width: 83.0065vw; padding: 8.3877vw 5.5918vw 7.4557vw; border: 2px solid #000; box-shadow: 15px 15px #FFD612; background-color: #fff;}
.joba-wrap .joba-titbox .tit1 {display: block; width: 47.4510vw; margin-bottom: 2.6144vw;}
.joba-wrap .joba-titbox .tit2 {display: block; width: 59.6078vw; margin-bottom: 6.5359vw;}
.joba-wrap .joba-titbox .txt1 {margin-bottom: 1.3979vw; font-size: 1.625rem; font-weight: 700; line-height: 1.5; text-align: center; word-break: keep-all; color: #0070C0;}
.joba-wrap .joba-titbox .txt2 {font-size: 1.25rem; font-weight: 500; line-height: 1.5; text-align: center; word-break: keep-all;}
.joba-wrap .btn-start {display: block; position: relative; margin-top: 40px;}
.joba-wrap .btn-start img {width: 255px;}
.joba-wrap .top-tit {margin-bottom: 10px; font-size: 1.625rem; font-weight: 700; line-height: 1.5; word-break: keep-all;}
.joba-wrap .top-tit span {background-color: #FFD612;}
.joba-wrap .joba-pick {display: flex; flex-wrap: wrap; position: relative; margin: 0 -30px;}
.joba-wrap .joba-pick .item {width: 33.33%; padding: 15px 30px;}
.joba-wrap .joba-pick .card {position: relative; cursor: pointer;}
.joba-wrap .joba-pick .card .tit {display: flex; justify-content: space-between; width: 145px; padding: 3px 8px 0; border: 2px solid #000; box-shadow: 10px 10px #FFD612; background-color: #fff; color: #0070C0;}
.joba-wrap .joba-pick .card .tit strong {margin-right: 8px; font-size: 1.375rem; font-weight: 700;}
/*
.joba-wrap .joba-pick .card .tit span {font-size: 1.125rem; font-weight: 700;}
*/
.joba-wrap .joba-pick .card .tit button {padding: 0; border: none; background: none; font-family: 'GmarketSans'; font-size: 1.125rem; font-weight: 700; color: inherit; cursor: pointer;}
.joba-wrap .joba-pick .card .tit i {width: 20px; height: 20px; background: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/check_gr.svg) no-repeat;}
.joba-wrap .joba-pick .card .tag {display: none; position: absolute; top: 8px; right: 5px; font-size: 1rem; font-weight: 700;}
.joba-wrap .joba-pick .card .cont {margin-top: -2px; padding: 12px 16px; border: 2px solid #000; box-shadow: 10px 10px #FFD612; background-color: #fff;}
.joba-wrap .joba-pick .card .cont .top {display: flex; align-items: center;}
.joba-wrap .joba-pick .card .cont .top .img {flex-basis: 100px; flex-shrink: 0; width: 100px; height: 105px; background-repeat: no-repeat; background-position: center;}
.joba-wrap .joba-pick .card .cont .top .img.r {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_r.svg);}
.joba-wrap .joba-pick .card .cont .top .img.i {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_i.svg);}
.joba-wrap .joba-pick .card .cont .top .img.a {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_a.svg);}
.joba-wrap .joba-pick .card .cont .top .img.s {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_s.svg);}
.joba-wrap .joba-pick .card .cont .top .img.e {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_e.svg);}
.joba-wrap .joba-pick .card .cont .top .img.c {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_c.svg);}
.joba-wrap .joba-pick .card .cont .top .key {display: flex; flex-wrap: wrap; padding-left: 5px;}
.joba-wrap .joba-pick .card .cont .top .key span {width: 50%; padding: 5px; font-size: 1rem; font-weight: 700;}
.joba-wrap .joba-pick .card .cont .top .key span.long {width: 100%;}
.joba-wrap .joba-pick .card .cont .bottom {margin-top: 16px; padding-top: 16px; border-top: 1px dashed #aaa;}
.joba-wrap .joba-pick .card .cont .bottom p {font-size: 1.25rem; font-weight: 500; line-height: 1.5; text-align: center; word-break: keep-all;}
.joba-wrap .joba-pick .card .cont .bottom p b {font-weight: 700;}
.joba-wrap .joba-pick .card.pick .tit {box-shadow: 10px 10px #c5c5c5; color: #fff;}
.joba-wrap .joba-pick .card.pick .tit i {background: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/check.svg) no-repeat;}
.joba-wrap .joba-pick .card.pick .tag {display: block;}
.joba-wrap .joba-pick .card.pick .cont {box-shadow: 10px 10px #c5c5c5; color: #fff;}
.joba-wrap .joba-pick .card.pick .cont .bottom {border-top-color: rgba(255, 255, 255, .4);}
.joba-wrap .joba-pick .card.pick.first .tit {background-color: #FF334B;}
.joba-wrap .joba-pick .card.pick.first .tag {color: #FF334B;}
.joba-wrap .joba-pick .card.pick.first .cont {background-color: #FF334B;}
.joba-wrap .joba-pick .card.pick.second .tit {background-color: #7231A7;}
.joba-wrap .joba-pick .card.pick.second .tag {color: #7231A7;}
.joba-wrap .joba-pick .card.pick.second .cont {background-color: #7231A7;}
.joba-wrap .joba-pick .card.pick .cont .top .img.r {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_r_pick.svg);}
.joba-wrap .joba-pick .card.pick .cont .top .img.i {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_i_pick.svg);}
.joba-wrap .joba-pick .card.pick .cont .top .img.a {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_a_pick.svg);}
.joba-wrap .joba-pick .card.pick .cont .top .img.s {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_s_pick.svg);}
.joba-wrap .joba-pick .card.pick .cont .top .img.e {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_e_pick.svg);}
.joba-wrap .joba-pick .card.pick .cont .top .img.c {background-image: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/item_c_pick.svg);}
.joba-wrap .joba-pick-next {display: flex; justify-content: flex-end; align-items: center; position: relative; margin-top: 10px;}
.joba-wrap .joba-pick-next p {margin-right: 15px; font-size: 1.25rem; font-weight: 700; line-height: 1.5; word-break: keep-all; color: #fff;}
.joba-wrap .joba-pick-next p span {color: #FFD612;}
.joba-wrap .joba-pick-next .btn-next {display: block;}
.joba-wrap .joba-pick-next .btn-next img {width: 150px;}
.joba-wrap .joba-view {position: relative; width: 87.1389vw; border: 2px solid #000; background-color: #fff;}
.joba-wrap .joba-view .head {display: flex; justify-content: space-between; align-items: center; position: relative; padding: 5px 18px 0px 70px; border-bottom: 2px solid #000; background-color: #0070C0;}
.joba-wrap .joba-view .head:before {z-index: 1; content: ''; display: block; position: absolute; top: 12px; left: 18px; width: 42px; height: 12px; background: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/three.svg) no-repeat;}
.joba-wrap .joba-view .head p {font-size: 1.25rem; font-weight: 700; line-height: 1.5; color: #fff;}
.joba-wrap .joba-view .head i {font-size: 1rem; font-weight: 500; line-height: 1.5; text-align: center; word-break: keep-all; color: #FFD612;}
/*
.joba-wrap .joba-view .view {height: 350px; padding: 20px 30px;}
*/
.joba-wrap .joba-view .view {height: auto; min-height:350px; padding: 20px 30px;}
.joba-wrap .joba-view .view .code {font-size: 1.25rem; font-weight: 700; line-height: 1.5; word-break: keep-all; color: #0070C0;}
.joba-wrap .joba-view .view .code span {margin: 0 15px; font-size: 1.5rem;}
.joba-wrap .joba-view .view .job {margin-top: 10px; line-height: 1.5;}
/*
.joba-wrap .joba-view .view .job a {font-size: 1.0625rem; font-weight: 500;}
*/
.joba-wrap .joba-view .view .job a {font-size: 1.0625rem; font-weight: 500; line-height: 31px; }
.joba-wrap .joba-view .view .job a:hover {background-color: #FFD612;}
.joba-wrap .joba-view .view .job .btn-open {font-size: 1rem; color: #888;}
.joba-wrap .joba-view .view .job .btn-open:hover {background-color: transparent; color: #0070C0;}
.joba-wrap .joba-view .view .job .modal-bg {z-index: 10; overflow: hidden; display: none; position: fixed; top: 0; left: 0; width: 100%; min-height: 100%; background-color: rgba(0, 0, 0, .7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);}
.joba-wrap .joba-view .view .job .modal-wrap {z-index: 11; display: none; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; width: 100%;}
.joba-wrap .joba-view .view .job .modal-cont {width: 87.1389vw; margin-bottom: 20px; border: 2px solid #000; background-color: #fff;}
.joba-wrap .joba-view .view .job .modal-head {display: flex; justify-content: space-between; align-items: center; position: relative; padding: 5px 18px 0px 70px; border-bottom: 2px solid #000; background-color: #0070C0;}
.joba-wrap .joba-view .view .job .modal-head:before {z-index: 1; content: ''; display: block; position: absolute; top: 12px; left: 18px; width: 42px; height: 12px; background: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/three.svg) no-repeat;}
.joba-wrap .joba-view .view .job .modal-head p {font-size: 1.25rem; font-weight: 700; line-height: 1.5; color: #fff;}
.joba-wrap .joba-view .view .job .modal-head i {font-size: 1rem; font-weight: 500; line-height: 1.5; color: #FFD612;}
.joba-wrap .joba-view .view .job .modal-view {padding: 20px 30px;}
.joba-wrap .joba-view .view .job .modal-view .job-more {margin-top: 10px; line-height: 1.5;}
.joba-wrap .joba-view .view .job .modal-view .job-more a {font-size: 1.0625rem; font-weight: 500;}
.joba-wrap .joba-view .view .job .modal-foot {display: flex; justify-content: center; align-items: center; padding: 10px 0; background-color: #f2f2f2;}
.joba-wrap .joba-view .view .job .modal-foot .btn-close {padding: 10px 15px 5px; border: 2px solid #000; border-radius: 10px; box-shadow: inset 3px 3px #fff; background-color: #FFD612; font-weight: 500; font-size: 1.0625rem;}
/*.joba-wrap .joba-view .foot {display: flex; justify-content: flex-end; align-items: center; padding: 8px 18px 3px; background-color: #f2f2f2;}*/
.joba-wrap .joba-view .foot {display: flex; justify-content: space-between; align-items: center; padding: 8px 18px 3px; background-color: #f2f2f2;}
/*.joba-wrap .joba-view .foot p {font-size: 1rem; font-weight: 500; line-height: 1.5; margin-right: 15px;}*/
.joba-wrap .joba-view .foot p {font-size: 1rem; font-weight: 500; line-height: 2.5; margin-right: 15px;}
.joba-wrap .joba-view .foot .btn-reset-back img {width: 110px;}
.joba-wrap .joba-link {display: flex; position: relative; width: 100%; margin-top: 20px; padding: 0 20px;}
.joba-wrap .joba-link > div {display: flex; flex-direction: column; align-items: center; width: 50%; padding-top: 20px;}
.joba-wrap .joba-link .left {padding-right: 20px;}
.joba-wrap .joba-link .right {padding-left: 20px; border-left: 1px dotted #fff;}
.joba-wrap .joba-link .tit {position: relative; width: 100%; padding: 4px 40px 0 20px; border: 2px solid #000; border-radius: 50em; box-shadow: 5px 3px #000; background-color: #fff; font-size: 1.0625rem; font-weight: 700; line-height: 1.5; word-break: keep-all; color: #0070C0;}
.joba-wrap .joba-link .tit:before {z-index: 1; content: ''; display: block; position: absolute; top: 4px; right: 12px; width: 22px; height: 23px; background: url(/images/consltJobCarpa/jobPsyExamNew/psyExamNewImg/intsOccpSch/view.svg) no-repeat;}
.joba-wrap .joba-link .tit span {color: #FF334B;}
.joba-wrap .joba-link .info {margin: 20px 0 15px; font-size: 1rem; font-weight: 700; line-height: 1.5; text-align: center; word-break: keep-all; color: #fff;}
.joba-wrap .joba-link .btn-group-1 {display: flex; column-gap: 10px;}
.joba-wrap .joba-link .btn-youth img, .joba-wrap .joba-link .btn-adult img {width: 215px;}
.joba-wrap .joba-link .btn-dream img {width: 285px;}

@media (max-width: 768px) {
    html, body {
        font-size: 14px;
    }

    .joba-wrap .btn-start {
        margin-top: 60px;
    }

    .joba-wrap .joba-pick .card.pick.first .tag,
    .joba-wrap .joba-pick .card.pick.second .tag {
        top: 36px;
        right: 10px;
        color: #fff;
    }

    .joba-wrap .joba-pick .card .cont {
        padding: 12px;
    }

    .joba-wrap .joba-pick .card .cont .top {
        flex-direction: column;
    }

    .joba-wrap .joba-pick .card .cont .top .img {
        flex-basis: 60px;
        width: 60px;
        margin-bottom: 10px;
    }

    .joba-wrap .joba-pick .card .cont .top .key {
        padding-left: 0;
    }

    .joba-wrap .joba-pick .card .cont .top .key span {
        padding: 3px 5px;
    }

    .joba-wrap .joba-pick .card .cont .bottom {
        margin-top: 6px;
        padding-top: 12px;
    }

    .joba-wrap .joba-pick-next {
        flex-direction: column;
    }

    .joba-wrap .joba-pick-next p {
        margin: 10px 0 15px 0;
        text-align: center;
    }

    .joba-wrap .joba-view .head,
    .joba-wrap .joba-view .view .job .modal-head {
        flex-direction: column;
        padding: 5px 18px 0px;
    }

    .joba-wrap .joba-view .view,
    .joba-wrap .joba-view .view .job .modal-view {
        padding: 20px;
    }

    .joba-wrap .joba-view .view .code {
        text-align: center;
    }

    .joba-wrap .joba-view .foot {
        justify-content: center;
    }

    .joba-wrap .joba-view .foot p {
        margin-right: 10px;
    }

    .joba-wrap .joba-link .btn-group-1 {
        flex-direction: column;
    }
}

@media (max-width: 1072px) {
    .joba-wrap {
        max-width: 100%;
    }

    .joba-wrap.page2 {
        padding: 20px 15px;
    }

    .joba-wrap.page3 {
        padding: 20px 15px;
    }

    .joba-wrap.page3 .bg {
        height: 70%;
    }

    .joba-wrap .top-tit {
        text-align: center;
    }

    .joba-wrap .joba-pick {
        margin: 0 -15px;
    }

    .joba-wrap .joba-pick .item {
        width: 50%;
        padding: 15px;
    }

    .joba-wrap .joba-pick .card .cont .top .key span,
    .joba-wrap .joba-pick .card .cont .top .key span.long {
        width: auto;
    }

    .joba-wrap .joba-pick-next {
        justify-content: center;
    }

    .joba-wrap .joba-view .view {
        height: auto;
    }

    .joba-wrap .joba-link{
        flex-direction: column;
        align-items: center;
        padding: 0;
    }

    .joba-wrap .joba-link > div {
        width: 100%;
    }

    .joba-wrap .joba-link .left {
        padding-right: 0;
    }

    .joba-wrap .joba-link .right {
        padding-left: 0;
        border-left: none;
    }

    .joba-wrap .joba-link .tit {
        text-align: center;
    }
}

@media (min-width: 550px) {
    .joba-wrap.page2 .bg {
        height: 35%;
    }
}