@charset "UTF-8";

/* sub-popup */
.add-popup {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:1050;}
.add-popup.fixed {display:block;}
.add-popup .box {padding:40px; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); background:#fff; border-radius:10px; width:100%; max-width:600px; max-height:600px; overflow-y:auto; overflow-x:hidden;}
.add-popup .box .add-popup-head { text-align: center; }
.add-popup .box .add-popup-head p {font-size:30px; font-weight:600; color:#111; padding:0; margin:0; text-align:center; margin-bottom: 24px;}
.add-popup .box .add-popup-head a {position:absolute; right:20px; top:20px; width:24px; height:24px; background:url('../images/icon_close.svg') no-repeat center / cover; font-size:0;}

.add-popup-magin {
	margin-top: 35px;
}

@media (max-width:1200px){
	.add-popup .box {width:calc(100% - 30px); padding:30px 15px;}
	.add-popup .box .add-popup-head {padding:0 0 10px;}
	.add-popup .box .add-popup-head p {font-size:20px; margin-top: 25px; margin-bottom: 16px;}
	.add-popup-magin { margin-top: 16px; margin-bottom: 10px; }
}

.btn-pc-mob-1 {
	width: 240px !important;
}

@media (max-width:1200px){
	.btn-pc-mob-1 {
		width: 120px !important;
	}
}

.sub-paper .paper-body .paper-button button {width:140px; height:40px; border-radius:10px; font-size:17px; font-weight:500;}

@media (max-width:1200px){
	.sub-paper .paper-body .paper-button a {margin:0 auto;}
}

/* 버튼 사용 */
a.evaluation-button {width:140px; height:40px; border-radius:10px; font-size:17px; font-weight:500;}
button.evaluation-button {width:140px; height:40px; border-radius:10px; font-size:17px; font-weight:500;}
a.evaluation-center-button {width:200px; height:50px; font-size:18px; font-weight:500; border-radius:10px;}
button.evaluation-center-button {width:200px; height:50px; font-size:18px; font-weight:500; border-radius:10px;}

@media (max-width:1200px){
	a.evaluation-button {margin:0 auto;}
	button.evaluation-button {margin:0 auto;}
	a.evaluation-center-button {width:130px; height:35px; font-size:15px; padding:2px 0 0;}
	button.evaluation-center-button {width:130px; height:35px; font-size:15px; padding:2px 0 0;}
}

.evaluation-button-area {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    margin: 40px 0 0;
}

.evaluation-center-button-area {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: 40px 0 0;
}

/* custom right chart - PC */
.custom-right-chart {
	width: 685px;
}

/* custom right chart - Mobile */
@media (max-width:1200px){
	.custom-right-chart { width: 100%; }
}

p.custom-title {
	position: relative;
	font-size: 17px;
	line-height: 1.5;
}

/* spinner loading css */
.spinner-container {
    position: fixed;
    z-index: 1090;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(0, 0, 0, 0.5);
}

.loader,
.loader:after {
  border-radius: 50%;
  width: 2rem;
  height: 2rem; }

.loader {
  position: relative;
}

.loader {
  width: 30px;
  height: 30px;
  position: relative;
  margin: auto;
}

.loader::before,
.loader::after {
  content: '';
  position: absolute;
}

.loader-list {
  display: grid;
  grid-template: repeat(3, 120px)/repeat(3, 120px);
  grid-gap: 30px;
}

.loader-item {
  display: flex;
  justify-content:center;
}

.loader-5::before,
.loader-5::after {
  border-radius: 50%;
  background: #239AFF;
  width: 20px;
  height: 20px;
  top: calc(50% - 8px);
  left: calc(50% - 8px);
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.loader-5::before {
  opacity: 0.7;
  animation-name: upperDot;
}

.loader-5::after {
  opacity: 0.5;
  animation-name: lowerDot;
}

@keyframes upperDot {
  25% {
    transform: translateY(-50%);
  }

  47.5%,
  52.5% {
    transform: translateY(0);
  }

  75% {
    transform: translateY(50%);
  }
}

@keyframes lowerDot {
  25% {
    transform: translateY(50%);
  }

  47.5%,
  52.5% {
    transform: translateY(0);
  }

  75% {
    transform: translateY(-50%);
  }
}
/* spinner loading end */

.custom-content > * {
	vertical-align: initial;
	font-size: initial;
	font-weight: initial;
}

.custom-content > * {
	list-style: inherit;
}

.default-css {
	vertical-align:top; font-weight:300; font-size:14px; font-family:'Spoqa Han Sans Neo', 'sans-serif';
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
	background: none;	
}

.check-box-center {
	justify-content: center;
}

/* 추가적인 설명 띄우기 */

.question-text {
	position: absolute;
	padding: 15px 20px;
	border-radius: 5px;
	color: #ffffff;
	display: none;
	cursor: pointer;
}

.question-text > div {
	position: relative;
	top: -81px;
	left: -220px;
	background: #444444;
	font-size: 13px;
	padding: 11px 20px;
}

.question-title {
	position: absolute;
	cursor: pointer;
}

.question-title > p {
	position: relative;
	top: -45px;
	left: 106px;
	padding: 4px 9px;
	border-radius: 50%;
	background: #122541;
	color: #fff;
	z-index: 500;
}

.question-title:hover + .question-text {
	display: block;
}

.mobile-text {
	line-height: 1.2;
}

.mob-br {
	display: none;
}

@media (max-width:1200px){
	.question-text {
		display: none;
	}
	
	.question-title {
		display: none;
	}
	
	.mob-br {
		display: block;
	}
}

/* pdf 표지 */
ul.cover {
	width: 50%;
	margin: 0 auto !important;
}

ul.cover > li {
	font-weight: bold;
	font-size: 33px !important;
	line-height: 2.4;
}

.p-text {
    text-align: center;
    font-size: 18px;
    margin-bottom: 28px;
    line-height: 1.6;
    font-weight: bold;
}
