/*=====================================================================================
버  전 : 5.0
날  짜 : 2025.07.10
제작사 : (주)에듀마루
본 파일 소스의 모든 저작권은 (주)에듀마루에 있습니다. 임의의 수정 및 배포를 금합니다.
문  의 : 02-6989-9337
=====================================================================================*/

[data-select-obj]:hover,
[data-delete-btn]:hover,
[data-confirm-btn]:hover {
  background-color: #3ca3f7;
  color: #fff;
}
.inputBox .space {
  padding: 0 6px;
}
[data-event-type='dropdown'].complete .dropdownBox .dropdownObj:after {
  display: none;
}

/* slide0 */
#wrap > main .contentsArea > section .slide0 .eventContainer {
  padding: 0 50px;
}
.slide0 .summaryBox {
  font-size: 56px;
  padding: 40px 20px;
  letter-spacing: -2px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.slide0 .summaryBox .imgBox {
  width: 214px;
  height: 300px;
  margin: 0 30px 0 20px;
  background: url('../images/slide0_img_1.svg') 0 0 / auto 100% no-repeat;
}
.slide0 .summaryBox .boxStyle2 {
  width: 460px;
  border-width: 10px;
  border-color: #f8b3ba;
  background-color: #f8b3ba;
}
.slide0 .summaryBox .boxStyle2.b2 {
  flex-grow: 1;
}
.slide0 .summaryBox .boxStyle2 .boxTop {
  height: 160px;
  padding: 20px 0;
  text-align: center;
  background-color: #f8b3ba;
}
.slide0 .summaryBox .boxStyle2 .boxBottom {
  height: 400px;
  padding: 20px 30px;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 50px;
}
.slide0 .summaryBox .boxStyle2 .boxBottom .boxTextList {
  display: flex;
  gap: 5px;
}
.slide0 .summaryBox .boxStyle2 .boxBottom .boxTextList > li {
  display: flex;
  flex-direction: column;
  gap: 70px;
}
.slide0 .summaryBox .boxStyle2 .boxBottom .boxTextList > li:nth-of-type(1) {
  align-items: flex-end;
}
.slide0 .summaryBox .boxStyle2 .boxBottom .boxTextList .colorBox {
  position: relative;
  padding: 15px 20px;
}
.slide0 .summaryBox .boxStyle2 .boxBottom .boxTextList .colorBox .arrowCss {
  position: absolute;
  top: -58px;
  left: 50%;
  transform: translateX(-50%);
}
.slide0 .summaryBox .boxStyle2 .boxBottom .lineBox {
  width: 100%;
  text-align: center;
  padding: 10px 20px;
}

/* slide1 */
/* .slide1 .captionBox {
  position: absolute;
  top: -80px;
  right: 80px;
} */
.slide1 .imgBox {
  width: 834px;
  height: 300px;
  background: url('../images/slide1_img_1.svg') 0 0 / auto 100% no-repeat;
}
.slide1 .oxList {
  position: relative;
  margin: 30px 0 0 0;
  display: flex;
  justify-content: space-between;
}
.slide1 .oxList .oxBox {
  width: 30%;
  text-align: center;
  padding: 30px;
}
.slide1 .oxList .oxBox .oxText {
  position: relative;
  padding: 10px 20px;
}
.slide1 .oxList .oxBox .css_circle {
  width: 100%;
  height: 100%;
  border-radius: 100px;
  top: 0;
  left: 0;
  transform: none;
}

/* slide2 */
.tableArea1 {
  font-size: 60px;
  letter-spacing: -2px;
}
.tableArea1 .tableContainer table {
  table-layout: auto;
  overflow: visible;
}
.tableArea1 .tableContainer table tr td.w1 {
  width: 140px;
}
.tableArea1 .tableContainer table tr td.w2 {
  width: 380px;
}
.tableArea1 .tableContainer.pink > table tr:nth-of-type(1) th:nth-of-type(1) {
  border-top-left-radius: 22px;
}
.tableArea1 .tableContainer.pink > table tr:nth-of-type(1) th:last-child {
  border-top-right-radius: 22px;
}
.tableArea1 .tableContainer.pink > table > tbody > tr:nth-of-type(2) > td:nth-of-type(1) {
  border-bottom-left-radius: 22px;
}
.tableArea1 .tableContainer.pink > table > tbody > tr:nth-of-type(2) > td:last-child {
  border-bottom-right-radius: 22px;
}
.tableArea1 .tableContainer.pink table.gray tr td {
  border: none;
}
.tableArea1 .tableContainer.pink table.gray tr:not(:last-child) {
  border-bottom: 4px solid #ccc;
}
.tableArea1 .tableContainer.pink table.gray tr td:not(:last-child) {
  border-right: 4px solid #ccc;
}
.tableArea1 .tableContainer.pink table.gray {
  table-layout: fixed;
}

.tableArea1 .resultBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #2461ba;
  background-color: #fff;
  border-bottom-right-radius: 22px;
  display: none;
}
.tableArea1 .resultBox.on {
  display: block;
}
.tableArea1 .resultBox .resultList {
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.tableArea1 .resultBox .resultList > li {
  display: flex;
  align-items: center;
}

.slide2 .examBox {
  position: absolute;
  top: 0;
  left: -70px;
  display: none;
}
.slide2 .examBox.on {
  display: block;
}
.slide2 .dropdownBox {
  position: relative;
  width: 100%;
  height: 100%;
}
.slide2 .dropdownBox .inputBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-family: 'ONEMobileTitle';
  color: #61b0ff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.slide2 .dropdownBox .inputBox > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
.slide2 .dropdownBox .inputBox.ing {
  font-family: 'NanumSquareRoundB';
  color: #2461ba;
}

.slide2 .dropdownBox.inactive.d3 .inputBox {
  border-bottom-right-radius: 22px;
  color: #9b9b9b;
  background-color: #ccc;
}

.slide2 .dropdownBox .dropdownObj {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.slide2 .dropdownBox.inactive .dropdownObj {
  pointer-events: none !important;
}
.slide2 .dropdownBox .dropdownObj:after {
  content: '';
  position: absolute;
  bottom: 5px;
  right: 5px;
  width: 30px;
  height: 21px;
  background: url('../images/btn_dropdown.svg') center / contain no-repeat;
}
.slide2 .dropdownBox .dropdownObj.on:after {
  transform: rotateX(180deg);
}
.slide2 .dropdownBox .dropdownArea {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 100%;
  border: 4px solid #ccc;
  border-radius: 20px;
  z-index: 1;
  overflow: hidden;
  visibility: hidden;
}
.slide2 .dropdownBox .dropdownArea.on {
  visibility: visible;
}
.slide2 .dropdownBox.d3 .dropdownArea {
  z-index: 2;
}
.slide2 .dropdownBox .dropdownArea .dropdownList {
  width: 100%;
}
.slide2 .dropdownBox .dropdownArea .dropdownList tr td {
  height: 90px;
}
.slide2 .dropdownBox .dropdownArea .dropdownList tr td [data-select-obj] {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.slide2 .dropdownBox .dropdownArea .dropdownList > li > div:nth-of-type(1) {
  border-right: 4px solid #ccc;
}
.slide2 .dropdownBox .dropdownArea .dropdownList > li:not(:last-child) {
  border-bottom: 4px solid #ccc;
}

.slide2 [data-select-obj],
.slide2 [data-delete-btn],
.slide2 [data-confirm-btn] {
  cursor: pointer;
}
.slide2 [data-delete-btn],
.slide2 [data-confirm-btn] {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.slide2 [data-select-obj].inactive {
  color: #ccc;
}

/* slide3 */
.tableArea2 {
  font-size: 60px;
  letter-spacing: -2px;
}
.tableArea2 .tableContainer table {
  table-layout: auto;
  overflow: visible;
}
.tableArea2 .tableContainer table tr td.w1 {
  width: 140px;
}
.tableArea2 .tableContainer table tr td.w2 {
  width: 380px;
}
.tableArea2 .tableContainer.pink > table tr:nth-of-type(1) th:nth-of-type(1) {
  border-top-left-radius: 22px;
}
.tableArea2 .tableContainer.pink > table tr:nth-of-type(1) th:last-child {
  border-top-right-radius: 22px;
}
.tableArea2 .tableContainer.pink > table > tbody > tr:nth-of-type(2) > td:nth-of-type(1) {
  border-bottom-left-radius: 22px;
}
.tableArea2 .tableContainer.pink > table > tbody > tr:nth-of-type(2) > td:last-child {
  border-bottom-right-radius: 22px;
}
.tableArea2 .tableContainer.pink table.gray tr td {
  border: none;
}
.tableArea2 .tableContainer.pink table.gray tr:not(:last-child) {
  border-bottom: 4px solid #ccc;
}
.tableArea2 .tableContainer.pink table.gray tr td:not(:last-child) {
  border-right: 4px solid #ccc;
}
.tableArea2 .tableContainer.pink table.gray {
  table-layout: fixed;
}

.tableArea2 .resultBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #2461ba;
  background-color: #fff;
  border-bottom-right-radius: 22px;
  display: none;
}
.tableArea2 .dropdownBox.d1 .resultBox {
  border-bottom-left-radius: 22px;
}
.tableArea2 .resultBox.on {
  display: block;
}
.tableArea2 .resultBox .resultList {
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.tableArea2 .resultBox .resultList > li {
  display: flex;
  align-items: center;
}

.slide3 .examBox {
  position: absolute;
  top: -70px;
  left: 0px;
  display: none;
}
.slide3 .examBox.on {
  display: block;
}
.slide3 .imgBox {
  position: relative;
  width: 980px;
  height: 240px;
  margin: 0 0 20px 0;
  background: url('../images/slide3_img_1.png') 0 0 / auto 100% no-repeat;
}
.slide3 .dropdownBox {
  position: relative;
  width: 100%;
  height: 100%;
}
.slide3 .dropdownBox .inputBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-family: 'ONEMobileTitle';
  color: #61b0ff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.slide3 .dropdownBox .inputBox > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
.slide3 .dropdownBox .inputBox.ing {
  font-family: 'NanumSquareRoundB';
  color: #2461ba;
}
.slide3 .dropdownBox.inactive.d4 .inputBox {
  border-bottom-right-radius: 22px;
}
.slide3 .dropdownBox.inactive .inputBox {
  background-color: #ccc;
  color: #9b9b9b;
}

.slide3 .dropdownBox .dropdownObj {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.slide3 .dropdownBox.inactive .dropdownObj {
  pointer-events: none !important;
}
.slide3 .dropdownBox .dropdownObj:after {
  content: '';
  position: absolute;
  bottom: 5px;
  right: 5px;
  width: 30px;
  height: 21px;
  background: url('../images/btn_dropdown.svg') center / contain no-repeat;
}
.slide3 .dropdownBox .dropdownObj.on:after {
  transform: rotateX(180deg);
}
.slide3 .dropdownBox .dropdownArea {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 100%;
  border: 4px solid #ccc;
  border-radius: 20px;
  z-index: 16;
  overflow: hidden;
  visibility: hidden;
}
.slide3 .dropdownBox .dropdownArea.on {
  visibility: visible;
}
.slide3 .dropdownBox.d4 .dropdownArea {
  z-index: 17;
}
.slide3 .dropdownBox .dropdownArea .dropdownList {
  width: 100%;
  font-size: 56px;
}
.slide3 .dropdownBox .dropdownArea .dropdownList tr td {
  height: 70px;
}
.slide3 .dropdownBox .dropdownArea .dropdownList tr td [data-select-obj] {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.slide3 .dropdownBox .dropdownArea .dropdownList > li > div:nth-of-type(1) {
  border-right: 4px solid #ccc;
}
.slide3 .dropdownBox .dropdownArea .dropdownList > li:not(:last-child) {
  border-bottom: 4px solid #ccc;
}

.slide3 [data-select-obj],
.slide3 [data-delete-btn],
.slide3 [data-confirm-btn] {
  cursor: pointer;
}
.slide3 [data-delete-btn],
.slide3 [data-confirm-btn] {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.slide3 [data-select-obj].inactive {
  color: #ccc;
}
.slide3 [data-auto-open] {
  display: none;
}
.slide3 [data-auto-open].on {
  display: block;
}

/* slide4 */
.slide4 .contList {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.slide4 .colorBox {
  padding: 20px 50px;
  display: flex;
  align-items: center;
}
.slide4 .lineBox {
  padding: 40px 10px 40px 40px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.slide4 .lineBox .scrollBox {
  height: 300px;
  padding: 0 20px 0 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow-y: scroll;
}
.slide4 .lineBox .scrollBox > li {
  display: flex;
  gap: 12px;
}
.slide4 .lineBox .scrollBox .nameText {
  flex-shrink: 0;
}

/* slide5 */
.slide5 .situationBox {
  display: flex;
  align-items: center;
  gap: 20px;
}
.slide5 .situationBox .underLine {
  position: relative;
  flex-grow: 1;
}
.slide5 input {
  width: 100%;
  padding: 5px 10px;
  border-radius: 4px;
  color: #2461ba;
  box-sizing: border-box;
  outline: none;
  font-family: 'NanumSquareRoundB';
}
.slide5 .dropdownBox input {
  text-align: center;
}
.slide5 input::placeholder {
  font-size: 46px;
}
.slide5 .resultBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  display: none;
}
.slide5 .resultBox.on {
  display: block;
}
.slide5 .resultBox .resultList {
  width: 100%;
  height: 100%;
  color: #2461ba;
  text-align: center;
  display: flex;
  align-items: center;
  gap: 15px;
}
.slide5 .resultBox .resultList .icon.exam {
  position: relative;
  top: -4px;
}

.tableArea3 {
  margin: 30px 0 0 0;
  font-size: 60px;
  letter-spacing: -2px;
}
.tableArea3 .tableContainer table {
  table-layout: auto;
  overflow: visible;
}
.tableArea3 .tableContainer table tr td.w1 {
  width: 140px;
}
.tableArea3 .tableContainer table tr td.w2 {
  width: 380px;
}
.tableArea3 .tableContainer.pink > table tr:nth-of-type(1) th:nth-of-type(1) {
  border-top-left-radius: 22px;
}
.tableArea3 .tableContainer.pink > table tr:nth-of-type(1) th:last-child {
  border-top-right-radius: 22px;
}
.tableArea3 .tableContainer.pink > table > tbody > tr:nth-of-type(2) > td:nth-of-type(1) {
  border-bottom-left-radius: 22px;
}
.tableArea3 .tableContainer.pink > table > tbody > tr:nth-of-type(2) > td:last-child {
  border-bottom-right-radius: 22px;
}
.tableArea3 .tableContainer.pink table.gray tr td {
  border: none;
}
.tableArea3 .tableContainer.pink table.gray tr:not(:last-child) {
  border-bottom: 4px solid #ccc;
}
.tableArea3 .tableContainer.pink table.gray tr td:not(:last-child) {
  border-right: 4px solid #ccc;
}
.tableArea3 .tableContainer.pink table.gray {
  table-layout: fixed;
}

.tableArea3 .resultBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #2461ba;
  background-color: #fff;
  border-bottom-right-radius: 22px;
  display: none;
}
.tableArea3 .dropdownBox.d1 .resultBox {
  border-bottom-left-radius: 22px;
}
.tableArea3 .resultBox.on {
  display: block;
  z-index: 1;
}
.tableArea3 .resultBox .resultList {
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.tableArea3 .resultBox .resultList > li {
  display: flex;
  align-items: center;
}

.slide5 .dropdownBox {
  position: relative;
  width: 100%;
  height: 100%;
}
.slide5 .dropdownBox .inputBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-family: 'ONEMobileTitle';
  color: #61b0ff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.slide5 .dropdownBox .inputBox > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
.slide5 .dropdownBox .inputBox.ing {
  font-family: 'NanumSquareRoundB';
  color: #2461ba;
}
.slide5 .dropdownBox.inactive.d5 .inputBox {
  border-bottom-right-radius: 22px;
}
.slide5 .dropdownBox.inactive .inputBox {
  background-color: #ccc;
  color: #9b9b9b;
}

.slide5 .dropdownBox .dropdownObj {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.slide5 .dropdownBox.inactive .dropdownObj {
  pointer-events: none !important;
}
.slide5 .dropdownBox .dropdownObj:after {
  content: '';
  position: absolute;
  bottom: 5px;
  right: 5px;
  width: 30px;
  height: 21px;
  background: url('../images/btn_dropdown.svg') center / contain no-repeat;
}
.slide5 .dropdownBox .dropdownObj.on:after {
  transform: rotateX(180deg);
}
.slide5 .dropdownBox .dropdownArea {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 100%;
  border: 4px solid #ccc;
  border-radius: 20px;
  z-index: 16;
  overflow: hidden;
  visibility: hidden;
}
.slide5 .dropdownBox .dropdownArea.on {
  visibility: visible;
}
.slide5 .dropdownBox.d4 .dropdownArea {
  z-index: 17;
}
.slide5 .dropdownBox .dropdownArea .dropdownList {
  width: 100%;
  font-size: 56px;
}
.slide5 .dropdownBox .dropdownArea .dropdownList tr td {
  height: 70px;
}
.slide5 .dropdownBox .dropdownArea .dropdownList tr td [data-select-obj] {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.slide5 .dropdownBox .dropdownArea .dropdownList > li > div:nth-of-type(1) {
  border-right: 4px solid #ccc;
}
.slide5 .dropdownBox .dropdownArea .dropdownList > li:not(:last-child) {
  border-bottom: 4px solid #ccc;
}
.slide5 .resultBox.r2 {
  top: 0;
  left: -70px;
  width: auto;
  height: auto;
}

.slide5 [data-select-obj],
.slide5 [data-delete-btn],
.slide5 [data-confirm-btn] {
  cursor: pointer;
}
.slide5 [data-delete-btn],
.slide5 [data-confirm-btn] {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.slide5 [data-select-obj].inactive {
  color: #ccc;
}
.slide5 [data-auto-open] {
  display: none;
}
.slide5 [data-auto-open].on {
  display: block;
}
.slide5 .examBox {
  position: absolute;
  display: none;
}
.slide5 .examBox.on {
  display: block;
}
.slide5 .examBox.e1 {
  top: 12px;
  left: 10px;
}
.slide5 .examBox.e2 {
  top: 110px;
  left: 10px;
}

/* 팝업 */
.popupContainer .popupBox.slide.explanation {
  height: 850px;
}
.popupBox[data-popup-name='2'] .popupCont .tableArea1 {
  margin: 20px 0 0 0;
}
.popupBox[data-popup-name='2'] .popupCont .tableArea1 .resultBox {
  position: relative;
  color: #222;
}
.popupBox[data-popup-name='2'] .tableArea1 .tableContainer table tr td.w1 {
  width: 120px;
}
.popupBox[data-popup-name='2'] .tableArea1 .tableContainer table tr td.w2 {
  width: 330px;
}
.popupBox[data-popup-name='3'] .popupCont .tableArea2 {
  margin: 20px 0 0 0;
}
.popupBox[data-popup-name='3'] .popupCont .tableArea2 .resultBox {
  position: relative;
  color: #222;
}
.popupBox[data-popup-name='3'] .tableArea2 .tableContainer table tr td.w1 {
  width: 120px;
}
.popupBox[data-popup-name='3'] .tableArea2 .tableContainer table tr td.w2 {
  width: 330px;
}

.popupContainer .popupBox[data-popup-name='move'] {
  top: 260px;
  left: 160px;
  width: 1600px;
  height: 620px;
}
.popupContainer .popupBox[data-popup-name='move'] .popupCont .popupScaleBox {
  width: 1600px;
  height: 620px;
}
.popupContainer .popupBox[data-popup-name='move'] .popupCont .popupScaleBox .moveImgBox {
  background-image: url('../images/slide1_img_1.svg');
}

.popupContainer .popupBox[data-popup-name='move2'] {
  top: 350px;
  left: 160px;
  width: 1600px;
  height: 440px;
}
.popupContainer .popupBox[data-popup-name='move2'] .popupCont .popupScaleBox {
  width: 1600px;
  height: 440px;
}
.popupContainer .popupBox[data-popup-name='move2'] .popupCont .popupScaleBox .moveImgBox {
  background-image: url('../images/slide3_img_1.png');
}