:root {
	--mainskin-text: #000000;
	--mainskin-base: #FAF3EB;
	--mainskin-point: #FDCEC2;
}

.load_svg path,
.load_svg rect{
  fill: var(--mainskin-point);
}

#view-fixbtn.active {
	color:#ffffff;
	background:	#222222;
	border-color:	#000000;
}

#view-sticker-fixbtn.active {
	color:#ffffff;
	background:	#0000ff;
	border-color:	#0000ff;
}

.mainskin--dday--day {
	color: var(--mainskin-point);
}
.mainskin--dday--text2 {
	color: var(--mainskin-text);
}

.mainskin--link .mainskin--icon {
	background: var(--mainskin-point);
	color: var(--mainskin-base);
}
.mainskin--link:hover .mainskin--icon {
	background: var(--mainskin-text);
	color: var(--mainskin-point);
}
.mainskin--link--text {
	color: var(--mainskin-text);
}

.mainskin--link.text {
	background: var(--mainskin-point);
	color: var(--mainskin-text);
}
.mainskin--link.text:hover {
	color: var(--mainskin-point);
	background: var(--mainskin-base);
}
.mainskin--link.text .mainskin--icon {
	background: none;
	color: var(--mainskin-text);
}

.mainskin--link.text:hover .mainskin--icon {
	color: var(--mainskin-point);
}

/* 1. 아이콘 크기 아주 조금 줄이기 (기존 25px -> 23px) */
.mainskin--link .mainskin--icon {
    width: 23px !important;
    height: 23px !important;
}
.mainskin--link .material-icons {
    font-size: 16px !important; /* 내부 아이콘 크기도 살짝 축소 (기존 18px -> 16px) */
}

/* 2. 개별 색상 및 안쪽 테두리(2px) 적용 */
/* 1번 (빨강) */
.mainskin--link:nth-child(1) .mainskin--icon {
    background: #de635b !important;
    color: #FFFFFF !important;
    box-shadow: inset 0 0 0 2px #c15448 !important; /* 안쪽으로 2px 테두리 */
}
.mainskin--link:nth-child(1):hover .mainskin--icon {
    background: #FFFFFF !important;
    color: #de635b !important;
    box-shadow: inset 0 0 0 2px #c15448 !important;
}

/* 2번 (노랑) */
.mainskin--link:nth-child(2) .mainskin--icon {
    background: #ecbd5a !important;
    color: #FFFFFF !important;
    box-shadow: inset 0 0 0 2px #caa348 !important;
}
.mainskin--link:nth-child(2):hover .mainskin--icon {
    background: #FFFFFF !important;
    color: #ecbd5a !important;
    box-shadow: inset 0 0 0 2px #caa348 !important;
}

/* 3번 (초록) */
.mainskin--link:nth-child(3) .mainskin--icon {
    background: #72c45b !important;
    color: #FFFFFF !important;
    box-shadow: inset 0 0 0 2px #60a946 !important;
}
.mainskin--link:nth-child(3):hover .mainskin--icon {
    background: #FFFFFF !important;
    color: #72c45b !important;
    box-shadow: inset 0 0 0 2px #60a946 !important;
}


.main_layout.main_digital {
	box-shadow: 1px 0px 0px var(--mainskin-text), -1px 0px 0px var(--mainskin-text), 0px 1px 0px var(--mainskin-text), 0px -1px 0px var(--mainskin-text), 4px 5px 0px rgba(0,0,0,0.2);
}
.main_layout.main_digital::before {
	background: var(--mainskin-point);
	border-color: var(--mainskin-point);
	box-shadow: 0px 1px 0px var(--mainskin-text);
}

.main_layout.main_grid {
  background: var(--mainskin-base);
  background-image: linear-gradient(90deg, var(--mainskin-point) 1px, transparent 1%), linear-gradient(180deg, var(--mainskin-point) 1px, transparent 1%); 
	border: 1px solid var(--mainskin-point);
}

.main_layout.main_checked {
	background: var(--mainskin-point);
  background-image: linear-gradient(90deg, rgba(255,255,255,0.3) 1px, transparent 1%), linear-gradient(180deg, rgba(255,255,255,0.3) 1px, transparent 1%), linear-gradient(90deg, rgba(0,0,0,0.2) 5px, transparent 6px, transparent 25px, rgba(0,0,0,0.2) 5px), linear-gradient(180deg, rgba(0,0,0,0.2) 6px, transparent 5px, transparent 25px, rgba(0,0,0,0.2) 5px),linear-gradient(90deg, transparent 15px, rgba(255,255,255,0.3) 1px, transparent 16px), linear-gradient(180deg, transparent 15px, rgba(255,255,255,0.3) 1px, transparent 16px); 
}


.s_style15 {
	box-shadow: 1px 0px 0px var(--mainskin-text), -1px 0px 0px var(--mainskin-text), 0px 1px 0px var(--mainskin-text), 0px -1px 0px var(--mainskin-text), 4px 5px 0px rgba(0,0,0,0.2);
}
.s_style15 img {
	background: var(--mainskin-base);
}
.s_style15::before {
	background: var(--mainskin-point);
	border-color: var(--mainskin-point);
	box-shadow: 0px 1px 0px var(--mainskin-text);
}

.s_style15::after {
	color: var(--mainskin-text);
}

.pointcolored {
	background: var(--mainskin-point);
	color: var(--mainskin-text);
}
.uplift {
	translate: 0px -50px;
}
.downlift {
	translate: 0px 50px;
}
.leftlift {
	translate: -50px 0px;
}
.rightlift {
	translate: 50px 0px;
}
.upliften {
	translate: 0px -30px;
	filter: drop-shadow(0px 20px 0px rgba(0,0,0,0.1));
}