/* BASIC css start */
/* aside */
#aside { width: 177px; margin-right: 20px; } 
/* lnb */
#aside .lnb-wrap h2 { font-size: 0; line-height: 0; }
#aside h2.txt { padding-right: 15px; background: url(/images/d3/modern_simple/common/bull_h13_dw_arw.gif) no-repeat right 45%; }
#aside h2.txt span { border-bottom: 1px solid #999999; color: #333333; display: block; font-size: 12px; font-weight: bold; line-height: 14px; padding-bottom: 3px; } 
#aside .lnb { zoom: 1; padding-bottom: 25px; padding-left: 2px; }
#aside .lnb:after{ content: ""; display: block; clear: both; }
#aside .lnb li,
#aside .lnb a { float: left; width: 100%; }
#aside .lnb li { margin-top: 10px;  word-wrap:break-word;}
#aside .lnb li.now a { font-weight: bold; }
#aside .lnb a:hover { font-weight: bold; }
#aside .lnb li a { color: #767676; }
/* ÅõÇ¥ÇÏ±â */
#aside .research .txt-1 { margin-top: 10px; font-weight: bold; text-align: center; }
#aside .research .list { margin-top: 10px; }
#aside .research .list li { margin-top: 5px; }
#aside .research .list li.li-center { text-align: center; }
/* info */
#aside .info { margin-bottom: 15px; background: url(/images/d3/modern_simple/aside_info_mdl.gif) repeat-y 0 0; }
#aside .info .cnt,
#aside .info .cnt a { color: #616161; }
#aside .info .cnt { zoom: 1; padding: 0 13px 7px; text-align: center; color: #616161; background: url(/images/d3/modern_simple/aside_info_btm.gif) no-repeat 0 bottom; }
#aside .info .cnt dd { padding: 10px 0; background: url(/images/d3/modern_simple/aside_info_dot.gif) repeat-x 0 0; }
#aside .info .cnt dd.first { background-image: none; }
#aside .info .cnt dd li { padding: 2px 0; }
/* cs-center */
#aside .info-cs .ph { font-size: 14px; font-weight: bold; }
#aside .info-cs .qna { font-weight: bold; }
#aside .info-cs .qna img { vertical-align: middle; }

/* =========================
   ôÌ ÀüÃ¼ À§Ä¡
========================= */
#fix_icon {
  position: fixed;
  right: 20px;
  bottom: 400px;
  z-index: 999999;
}

/* =========================
   ôÌ ¸®½ºÆ® ±¸Á¶
========================= */
#fix_icon ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* =========================
   ôÌ °øÅë ¹öÆ°
========================= */
#fix_icon ul li a {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 80px;
  height: 80px;

  border-radius: 16px;
  transition: all 0.2s;
}

/* °øÅë ÀÌ¹ÌÁö */
#fix_icon ul li a img {
  object-fit: contain;
}

/* hover °øÅë */
#fix_icon ul li:hover a {
  transform: scale(1.1);
}

/* =========================
   ôÌ Ä«Ä«¿ÀÅå ¹öÆ°
========================= */
#fix_icon ul li.kakao-talk-btn a {
  background-color: #FEE500;
  box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

#fix_icon ul li.kakao-talk-btn img {
  width: 70px;
  height: 70px;
}

/* =========================
   ôÌ »ç¾÷ÀÚµî·Ï ¹öÆ°
========================= */
#fix_icon ul li.ico_license a {
  background-color: #e30025;
  box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

#fix_icon ul li.ico_license img {
  width: 70px;
  height: 70px;
}

/* =========================
   ôÌ TOP ¹öÆ°
========================= */

/* ±âº» ¼û±è */
#fix_icon ul li.gotoTop {
  opacity: 0;
  pointer-events: none;
  transform: translateY(20px);
  transition: opacity 0.3s, transform 0.3s;
}

/* È°¼ºÈ­ */
#fix_icon ul li.gotoTop.active {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

/* ¹öÆ° ½ºÅ¸ÀÏ */
#fix_icon ul li.gotoTop a {
  background-color: #999;
  box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

#fix_icon ul li.gotoTop img {
  width: 70px;
  height: 70px;
}

/* ºÎ¸ð ±âÁØ Àâ±â */
#fix_icon ul li a {
  position: relative;
}

/* ÅøÆÁ ±âº» (ÁÂÃø À§Ä¡) */
#fix_icon ul li a .tooltip {
  position: absolute;
  right: 90px; /* ¹öÆ° ¿ÞÂÊÀ¸·Î ÀÌµ¿ (¹öÆ° 80px + ¿©À¯) */
  top: 50%;
  transform: translateY(-50%) translateX(10px);

  background: #333;
  color: #fff;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 8px;
  white-space: nowrap;

  opacity: 0;
  pointer-events: none;
  transition: all 0.2s;
}

/* ¸»Ç³¼± ²¿¸® (¿À¸¥ÂÊ ¹æÇâ) */
#fix_icon ul li a .tooltip::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -5px;
  transform: translateY(-50%);

  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent transparent #333;
}

/* hover ½Ã ³ëÃâ */
#fix_icon ul li:hover a .tooltip {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}
/* BASIC css end */

