@charset "utf-8";
@media all and (max-width: 991px) {
/* 공통 css 시작 */
    .serveTopArea, .serveContentArea, .lectureSearch,
    .procedureInner, .digitalTarget, .retakeArea,
    .windowArea, .pcEduArea, .completionCheckArea, .targetArea,
    .conditionArea, .stepArea, .employmentArea, .operatingArea,
    .categoryArea, .employmentProcedureArea, .cheatingArea02,
    .cheatingArea05, .cheatingArea04, .lectureBg, .lectureInnerTop,
    .studyNoteArea, .lectureBox, .lectureLeftContent, .lectureBtnWrap, .standardArea,
    .tab-menu > ul, .padWrap, .industryListArea, .lectureRightWrap { margin: 0 auto; padding: 0px 15px; }
    .tab-menu { padding: 0; }
    .contentBox { padding: 25px 0; font-size: 18px; }
    .serveTopArea { display: flex; justify-content: space-between; flex-wrap: nowrap; align-items: center; height: 55px; margin-bottom: 20px; }
    .serveTitleArea h3 { font-size: 16px; }
    .marginNone { margin-bottom: 0px !important; }

    .backBtnArea { min-width: 22px; }

    .backBtnArea a img { height: auto; width: auto; max-height: 22px; }

    .slide-box { width: 100%; overflow-x: auto; overflow-y: hidden; white-space: nowrap; }

	.slide-box::-webkit-scrollbar { display: none; }
    .tab-container { margin-bottom: 10px; padding: 0px 15px; }
    .tab-container .tab-container { padding: 0px; margin-top:20px; }

    p.pointList { line-height: 18px; letter-spacing: -0.15px; padding-top: 2px; font-size: 12px; font-weight: 300; }
    p.pointList03 { padding-left: 24px; line-height: 18px; color: #000; font-size: 12px; }
    p.pointList03:before { top: 1px; width: 18px; height: 18px; }
    p.pointList04 { padding-left: 26px; line-height: 30px; font-size: 12px; }
    p.pointList04:before { top: 5px; width: 20px; height: 22px; }
    .bluePoint { font-size: 16px; }
    .greenPoint { font-size: 16px; }
    
    .arrowBtn { padding: 8px 40px; font-size: 14px; }
    .mb_100 { margin-bottom: 50px; }

    .contentTitle { font-size: 16px; margin-bottom: 20px; }
    
    .mob_col { display: table-column-group; }

    .pt_50 { padding-top: 0; }
/* 공통 css 끝 */

/* 학습가이드 시작 */
	/* .eduTabStyle { border-bottom: 1px solid #DFE0E2; } */
	.eduTabStyle ul { text-align: center; display: flex; align-items: center; justify-content: space-between; padding: 0px 3%; }
	.eduTabStyle ul li { flex-basis: fit-content; }
	.eduTabStyle ul li a { width: 100%; height: auto; font-size: 12px; padding: 10px 15px; }

	.eduTabStyle ul li a.active-a { color: #256ea8; font-weight: 600; border-bottom: 4px solid #256ea8; }

    .tab-menu02 { overflow: hidden; }
    .tab-menu02 ul { justify-content: flex-start; gap: 15px; padding: 5px 0; background: none; }
    .tab-menu02 ul li { flex-basis: fit-content; }
    .tab-menu02 ul li:not(:last-of-type) { border-right: 0; }
    .tab-menu02 ul li a { display: inline-block; width: 120px; padding: 0px 20px; line-height: 35px; font-size: 14px; color: #979797; border-radius: 50px; background-color: #f4f4f4; }
    .tab-menu02 ul li a.active-a02 { color: #ffffff; background-color: #256ea8; }

    .IATABoxList, .IATABox02List ul { flex-direction: column; }

    .questionTitleIcon { margin-bottom: 10px; width: auto; height: auto; max-height: 45px; }
    .questionTitle { margin-bottom: 35px; font-size: 16px; line-height: 1.5em; }

    .IATAContentTitleWrap { margin-bottom: 30px; }
	.IATAContentTitleWrap h3 { margin-bottom: 10px; font-size: 20px; }

	.IATAContentTitleWrap p { font-size: 12px; }

    .IATABox { padding: 20px 10px; }
	.IATABox:not(:last-of-type) { margin-bottom: 25px; }
    .IATABox01::after { bottom: -35px; border-top: 35px solid #63b7e7; border-left: 35px solid transparent; border-right: 35px solid transparent; }
    .IATABox02::after { bottom: -35px; border-top: 35px solid #9fd8ec; border-left: 35px solid transparent; border-right: 35px solid transparent; }

    .IATABoxList { font-size: 12px;	}

    .IATAContentArea h4 { font-size: 14px; letter-spacing: -0.8px; margin-bottom: 20px; font-weight: 600; }
    .IATAContentArea:first-of-type {margin-bottom: 50px;}
    .cards { width: 100%; height: auto; flex-basis: 0; }
    .fancy-card .content .primary { height: auto; }
    .primary h2 { font-size: 14px; padding: 25px 5px 20px 5px; }

    .fancy-card .content .secondary { position: initial; opacity: 1; background: none; }
	.fancy-card .content .secondary p { width: 150px; font-size: 14px; padding: 6px 20px; border-radius: 50px; margin-bottom: 20px; }

	.IATABox02List ul li { flex-basis: 0; width: 100%; height: auto; font-size: 18px; margin-bottom: 20px; }
	.IATABox02List ul li h2 { font-size: 14px; padding: 50px 5px; }

    .IATAbenefitArea ul { display: block; }
    .IATAbenefitArea ul li {padding: 10px 0px; }
    .IATAbenefitArea ul li:not(:last-of-type) { margin-bottom: 20px; }
    .IATAbenefitArea ul li img { max-width: 200px; }
    .IATAbenefitArea ul li h4 { margin-bottom: 5px; font-size: 16px; }
    .IATAbenefitArea ul li p { font-size: 14px; }

    .blackListArea li { padding: 12px 10px; }
    .blackListArea li:not(:last-of-type) { margin-bottom: 20px; }

    /* .eduGuideInner { padding: 25px 0px; }
    .eduGuideInner:not(:last-of-type) {  border-bottom: 1px dashed #d4d4d4; margin-bottom: 30px;  } */

    .eduGuideBg01 { background: none; }
    .contentBox { font-size: 12px; }
    .cabinList ul { flex-wrap: wrap; gap: 20px; }
    .cabinList ul li { width: 100%; flex-basis: 100%; padding: 20px 10px; }
    .cabinList ul li img { max-height: 65px; margin-bottom: 10px; }
    .cabinList p { font-size: 14px; line-height: 1.5em; }

    .groundJobList ul li { width: 100%; flex-basis: 100%; padding: 20px 10px; }
    .groundJobList ul li img { max-height: 65px; margin-bottom: 10px; }
    .groundJobList p { font-size: 14px; line-height: 1.5em; }
    
    .DGRList ul { flex-wrap: wrap; gap: 20px; }
    .DGRList ul li { width: 100%; flex-basis: 100%; padding: 20px 10px; }
    .DGRList ul li img { max-height: 65px; margin-bottom: 10px; }
    .DGRList p { font-size: 14px; line-height: 1.5em; }

    .industryListArea li { flex-basis: 100%; }
    .industryListArea li a img { width: auto; height: auto; max-height: 40px; margin-right: 10px; }

    .changeWrap { padding: 0; }
    .container01 { width: 100%; height: 330px; }
    .container01 .wrapper .slide .slide-content h2 { font-size: 18px; }
    .container01 .wrapper .slide .slide-content > p { font-size: 12px; line-height: 1.5em; }
    .container01 .wrapper .slide .slide-content ul { font-size: 11px; line-height: 18px; }
    
/* 학습가이드 끝 */

/* 제도 시작 */
    .bg { max-width: 250px; margin-bottom: 50px; }
    .purposeMotionCard { max-width: 215px; }
    .targetArea h2 { line-height: 20px; }
    .targetArea h2 span { font-size: 12px; }
    .targetListArea ul li { padding: 5px 15px; font-size: 11px; letter-spacing: -0.55px; font-weight: 300; }
    .trainingFeeList li { text-align: center; }
    .trainingFeeContent ul li span { font-size: 14px; font-weight: 600; color: #ff8d0a; }
    
    .traningSearchArea p { margin-bottom: 20px; padding: 0 15px; }

    .laptop { height: 150px; margin: 0 auto 50px auto; }
    .laptop .content { height: 125px; }
    .laptop:after { width: 110%; height: 12px; }

    .traningSearchArea button { padding: 8px 40px; font-size: 14px; }

    .procedureArea { height: fit-content; background-color: #f4f4f4; }
        .contentBox ol.procedureList { display: block; margin: 0; }
        .procedureList > li { width: 90%; margin: 0 auto 40px auto; padding: 20px 6px; }
        .procedureList li:not(:last-of-type)::before { right: calc(50% - 16px); top: 103%; transform: rotate(90deg); }
    
        .procedureList li div.iconBox { display: flex; justify-content: center; align-items: center; }
/* 제도 끝 */

/* 학습절차 시작 */
    .useInner h4 { min-height: fit-content; }
    .procedureList li h4 { margin-bottom: 10px; }
    .procedureList li:not(:first-of-type) h4 { font-size: 16px; line-height: 1.5em; }
    .procedureText li p { font-size: 14px; line-height: 1.5em; }
    .eduUseImg { width: 90%; margin: 0 auto 15px auto; }

    .identityList ul { flex-wrap: wrap; gap: 10px 20px; margin-bottom: 20px; }
    .motpArea img { max-width: 220px; margin-bottom: 30px; }
    .motpArea { padding: 0 15px; }

    .identityContent ul { flex-wrap: wrap; gap: 30px 0; }
    .identityContent ul li { width: 100%; }
    .identityContentH ul li h3 { height: fit-content; font-size: 12px; }
    .identityContent ul li img { max-width: 120px; }
    .progress { width: 120px; height: 120px; }
    .identityContent ul li h3 span { display: block; padding: 10px 0 0 0; font-size: 12px; }

    .windowArea { flex-wrap: wrap; justify-content: center; }
    .windowArea img { max-width: 170px; }
    .windowArea ul li h3 { font-size: 12px; }
    .windowArea ul li h3 span { font-size: 14px; }
    .windowArea ul li p { font-size: 12px !important; }

    .pcEduArea { flex-wrap: wrap; justify-content: center; gap: 20px; padding-top: 30px; text-align: center; }
    .pcEduArea ul li h3 span { font-size: 14px; }

    .progress-title, .progress-title02 { font-size: 16px; }
    .progress-bar, .bar-container { height: 25px; }
    .progress-percentage { font-size: 14px; line-height: 18px; }
    .test_obj11 { margin-bottom: 50px; }
    .testList { flex-wrap: wrap; gap: 20px; margin-bottom: 50px; }
    .testList > div { width: 100%; }

    .reassessmentArea, .retakeArea { margin-bottom: 35px; padding: 0 15px; text-align: center; }
    .reassessmentArea div h2, .retakeArea div h2 { font-size: 16px; }
    .retakeList,
    .retakeList span { padding-left: 20px; font-size: 12px;  margin-left: 5px; }
    .retakeList span::before { left: 0; top: 0px; width: 18px; height: 18px; }

    .numberlist ol li { display: flex; align-items: center; line-height: 1.5em; }
    .completionCheckArea h2.contentTitle { margin-bottom: 20px; }
    .completionCheckArea .contentBox > p { margin-bottom: 35px; }
    .completionCheckInner { display: block; margin-bottom: 50px; text-align: center; }
    .completionCheckInner img { max-height: 170px; margin: 0 auto 20px auto; }
    .noticeBox p.pointList02 { display: inline-block; width: auto; font-size: 12px; }
    .reviewList ul { flex-direction: column; justify-content: center; align-items: center; gap: 30px; }
    .reviewList ul li img { max-height: 130px; margin-bottom: 10px; }

    .contentBox.penaltyArea { padding: 50px 15px; }
    p.pointList { padding-left: 20px; }
    p.pointList:before { left: 0; top: 2px; width: 18px; height: 18px; }
    .penaltyArea h2 { margin: 0 0 15px 0; }
    .penaltyTable th, .penaltyTable td { padding: 5px; }
    .penaltyTable th:not(.penaltyTableBg) { font-size: 16px; }

    .remoteProcedure ul { flex-direction: column; }
    .remoteProcedure ul li:nth-of-type(2) img { max-height: 35px; transform: rotate(90deg); }
    .remoteProcedure ul li:not(:nth-of-type(2)) img { max-height: 150px; }
    .remoteProcedure ul li h3 { font-size: 14px; }

    .dataArea { display: block; padding: 0 15px; text-align: center; }
    .dataArea img { max-height: 150px; margin-bottom: 10px; }
    .dataArea ul li h3 span { color: #ff8d0a; }
    .dataArea ul li h3 span::after { display: none; }
/* 학습절차 끝 */

/* 국민취업제도 시작 */

    .employmentArea ul { flex-direction: column; align-items: center; gap: 30px; }
    .employmentArea ul li img { max-height: 130px; margin-bottom: 10px; }
    .operating01 { display: block; text-align: center; margin-bottom: 35px; }
    .operatingArea img { max-height: 130px; margin-bottom: 10px; }
    .operatingArea p { font-size: 12px !important; }
    .operating02 { display: block; text-align: center; margin-bottom: 35px; }

    .categoryArea ul { flex-direction: column; }
    .categoryArea ul li { flex-basis: fit-content; padding: 35px 5px 10px; }
    .categoryArea ul li p { padding: 0 !important; font-size: 12px; }
    .category01 p.pointList { padding-left: 20px !important; }
    .category01 p.pointList:before { left: 0; }

    .employmentProcedureInner { padding-left: 15px; }
    .employmentProcedureInner div { padding: 20px 25px; }
    .employmentProcedureInner div::before { left: -16px; top: 20px; background-size: 65%; background-repeat: no-repeat; }
    .employmentProcedureInner div:not(:last-of-type) { margin-bottom: 30px; }
    .employmentProcedureInner div ul li h3 { margin-bottom: 10px; font-size: 18px; }
    .employmentProcedureInner div ul li p { font-size: 12px; line-height: 18px; }
    
/* 국민취업제도 끝 */
/* 부정행위금지안내 시작 */

    .cheatingArea01 { padding: 0 15px; }
    .cheatingArea01 ul { flex-direction: column; align-items: center; gap: 0px; }
    .cheatingArea01 ul li img { max-height: 130px; }
    .cheatingArea01 ul li p { display: inline-block; }
    
    .cheatingArea02 ul li { min-width: 100%; font-size: 12px; line-height: 1.5em; }

    .cheatingArea05 ul li { min-width: 100%; font-size: 12px; line-height: 1.5em; }

    .cheatingArea04 ul { flex-direction: column; gap: 30px; }
    .cheatingArea04 ul li img { max-height: 130px; margin-bottom: 20px; }

    .cheatingArea05 h2 { margin-bottom: 30px !important; }
/* 부정행위금지안내 끝 */

/* k-디지털 제도 시작 */

    .kImg { max-height: 150px; margin: 0 auto 20px auto; }
    .digitalTarget ul { flex-direction: column; align-items: center; gap: 0px; }
    .digitalTarget ul li:first-of-type { min-width: 100%; }

    .digitalTarget ul li h3 { font-size: 12px; }
    .digitalTarget ul li:not(:nth-of-type(2)) img { max-height: 100px; margin-bottom: 0; }
    .digitalTarget ul li:nth-of-type(2) img { max-height: 30px; margin-bottom: 0; }
    .digitalTarget ul li:not(:last-of-type) { margin-bottom: 20px; }

    .procedureList02 li div.iconBox img { max-width: 90px; height: auto; }
    .procedureList li h4 { font-size: 16px; margin-bottom: 20px; }

    .tabtitleArea p { font-size: 12px !important; }

/* k-디지털 제도 끝 */

/* 직업심리검사 시작 */
    .edutab01 { padding: 20px; border-radius: 20px; }
    .edutab01 h2 { font-size: 16px; margin-bottom: 20px; line-height: 1.2em; }
    .edutab01 h2 span { font-size: 20px; }
    .edutab01 p { font-size: 12px; line-height: 18px; }

    .contentArea .contentBox { padding: 25px 15px; }
    .eduGuideInner { padding-bottom: 25px; margin-bottom: 50px; }

    .eduGuideTable01, .eduGuideTable02 { font-size: 12px; }

/* 직업심리검사 끝 */

/* 무료서비스 시작 */
    .incruitArea .purposeArea { height: fit-content; }
    .incruitArea .purposeArea .fadeInLeft01 { width: 230px; margin: 0 auto 12px auto; }

    .incruitArea .targetArea { background: #256ea8; }
    .incruitArea .targetArea .contentBox { padding: 25px 0; }
    .incruitArea .targetArea .procedureList { background: none; }
    .incruitArea .targetArea .procedureList02 li { width: 100%; box-shadow: none; }
    .incruitArea .procedureList02 li div.iconBox img { max-height: 100px; }
    .procedureList02 li div.iconBox { margin-bottom: 10px; }

    .incruitArea .contentTitle { margin-bottom: 20px; }
    .trainingFeeContent img { width: 150px; margin: 0 auto 20px auto; }

    .incruitArea .trainingFeeArea .trainingFeeList > a { margin: 0 auto; }

/* 무료서비스 끝 */
/* 협회 소개 시작 */
    .introduceTabStyle ul li { flex-basis: fit-content; }
    .tab-menu ul li a { height: auto; padding: 10px 15px; font-size: 12px; }
    .top_bar_fix { height: auto; }
    .introduceBox ul li p { font-size: 14px; line-height: 22px; }
    .agencyArea p { margin-bottom: 30px }
    .agencyArea h3, .agencyArea h3 span  { font-size: 14px; line-height: 22px; font-weight: 500; }
    .banner-slide-items ul li,
    .banner-slide-items02 ul li { min-width: 160px; }
    .banner-slide-items ul li img,
    .banner-slide-items02 ul li img { height: 20px; }
/* 협회 소개 끝 */

/* 인사말 시작 */
    .ceoArea ul li p { font-size: 14px; line-height: 22px; }
    .ceoArea ul li:not(:last-of-type) { margin-bottom: 10px; }
    .ceoArea ul { background: none; }
    .ceoArea img { margin-left: auto; }
/* 인사말 끝 */

/* 연혁 시작 */
    #container label { min-width: 68px; margin: 0 10px; font-size: 11px; }
    #container input:checked + label { font-size: 12px; }
    #container::before { top: 54px; }
    .historyContent li { flex-direction: column; gap: 0; }

    .historyBox h3 { font-size: 20px; margin-bottom: 10px; }
    .historyContent li h4 { font-size: 18px; margin-bottom: 15px; }
    .histroyDate { width: 100%; padding: 0; font-size: 15px; }
    .historyContent li ul li p { font-size: 12px; line-height: 22px; }
    .historyContent:not(:last-of-type) { margin-bottom: 50px; }
    .historyBox:not(:last-of-type) { margin-bottom: 50px; padding-bottom: 50px;  }
/* 연혁 끝 */

/* 참여기관 시작 */
    .companyWrap .companyArea ul { gap: 30px 4%; }
    .companyWrap .companyArea ul li { flex-basis: 48%; }
    .companyWrap .companyArea ul li div { min-height: 100px; line-height: 100px; margin-bottom: 10px; padding: 0; }
    .companyWrap .companyArea ul li img { max-height: 21px; }

    .modalCompanyInner { width: 92%; padding: 15px; }
    .modalCompanyClose { margin-bottom: 20px; }
    .modalCompanyClose h3 { font-size: 16px; }
    .modalCompanyContent ul { flex-direction: column; align-items: center; gap: 20px; }
    .modalCompanyContent ul li img { max-height: 25px; }
    .modalCompanyContent ul li:nth-of-type(2) { width: 100%; height: 142px; }
    .modalCompanyContent ul li p { font-size: 12px; }
/* 참여기관 끝 */

/* 오시는 길 시작 */
    .mapArea { flex-direction: column; }
    .mapArea .mapContent { order: 1; }

    .mapContent > ul { gap: 20px 5%; }
    .mapContent > ul > li:nth-of-type(odd) { flex-basis: 41%; }
    .mapContent > ul > li img { max-height: 24px; margin-top: 5px; }
    .mapContent ul li h3 { font-size: 16px; margin-bottom: 10px; }
    .mapContent ul li p { font-size: 12px; }
    .mapContent > ul li ul.subbusArea { flex-direction: column; gap: 0; }
    
    .root_daum_roughmap { width: 100% !important; height: 300px; }
/* 오시는 길 끝 */ 
}