* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-family: 'PT Sans', sans-serif;
}
*:active, *:focus {outline: none;}
a {color: #1E8EDF;}
body {margin: 0px;padding: 0px;color: #262633;line-height: 1.4;}
.d-none {display: none;}
.flex {display: flex;}
.flex-col {flex-direction: column;}
.flex-row {flex-direction: row;}
.flex-inline {display: inline-flex;}
.justify-center {justify-content: center;}
.justify-between {justify-content: space-between;}
.justify-around {justify-content: space-around;}
.justify-evenly {justify-content: space-evenly;}
.items-start {align-items: start;}
.items-center {align-items: center;}
.items-end {align-items: end;}
.items-stretch {align-items: stretch;}
.flex-col-reverse {flex-direction: column-reverse;}
.grow-0 {flex-grow: 0;}
.grow-1 {flex-grow: 1;}
.shrink-1 {flex-shrink: 1;}
.shrink-0 {flex-shrink: 0;}
.mr-1 {margin-right: 1rem;}
.text-center {text-align: center;}
.bold {font-weight: bold;}
.pull-left {float: left;}
.pull-right {float: right;}
.colorg {color: #999;}
.col-3 {width: 25%;}
.col-4 {width: 33.3333%;}
.col-6 {width: 50%;}
.gap-10 {gap: 10px;}
.gap-20 {gap: 20px;}
.gap-30 {gap: 30px;}
.gap-40 {gap: 40px;}

.help-link {
	color: var(--marker-blue);
    cursor: pointer;
    background: #e4f5ff;
	font-size: 16px;
    padding: 4px 9px;
    border-radius: 30px;
	font-weight: normal;
	border: 1px solid #e4f5ff;
}
.help-link:hover {border-color: var(--marker-blue);}
#any-wrapper {
	backdrop-filter: blur(2px);
    background-color: rgb(74 76 86 / 38%);
	z-index: 800;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
	transition: all 0.1s ease-in-out;
	opacity: 0;
	display: none;
}
#any-wrapper .wrapani, #pover .dialogue {position:relative;top: 30px;}
#any-wrapper.show .wrapani, #pover .dialogue {
	animation-name: wrapani;
	animation-duration: 0.2s;
	animation-direction: normal;
	animation-timing-function: cubic-bezier(0.39, 0.74, 0.41, 1.28);
	animation-fill-mode: forwards;
}
@keyframes wrapani {
	0% {top: 30px;scale: 0.9;}
	100% {top: 0;scale: 1;}
}
.helper-popup {
	background-color: #fff;
	width: 740px;
	height: 540px;
	padding: 40px;
	padding-top: 30px;
	border-radius: 8px;
	position: relative;
	box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
	display: none;
}
.popup-top {margin-bottom: 20px;}
.popup-header {margin: 0;font-size: 17px;color: #555;}
.popup-close-btn {
	font-size: 30px;
	cursor: pointer;
	display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    border-radius: 30px;
}
.popup-close-btn:hover {background-color: #eee;}
.helper-navi {
	position: absolute;
    bottom: 20px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
	gap: 10px;
}
.helper-btn {
	display: flex;
    width: 30px;
    height: 30px;
    background: #e4f5ff;
	color: #48606f;
    border-radius: 30px;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    font-size: 16px;
	cursor: pointer;
	transition: all 0.1s ease-in-out;
}
.helper-btn:hover {background: #c9e3f2;}
.helper-btn.active {color: #fff;background-color: var(--marker-blue);}
.helper-frame {opacity: 0;display: none;transition: all 0.1s ease-in-out;}
.helper-frame.active {opacity: 1;display: flex;}
.helper-frame p {margin-top: 0;}
.helper-frame p:last-child {margin-bottom: 0;}
.popup-body {color: #48606f;}
.popup-body h4 {margin: 0;margin-bottom: 10px;font-size: 20px;color: #374f67;}
.popup-body img {max-width: 100%;}
.popup-body img.maxh {max-height: 197px;}
.col-6 {width: 50%;}
#no-project-yet {padding: 90px 19px 20px 30px;}
#no-project-yet a {
	color: #ecf8ff;
	background: #303944;
	padding: 6px 10px;
	border-radius: 8px;
	text-decoration: none;
}
#json-goal {display:none;opacity: 0;visibility: hidden;}