/* PC-first (񃧯 = PC) */

/* =========================
   common
========================= */
:root {
   --main-font-color: #111;
   --sub-font-color: #222;
   --container: 1200px;   /* cont-innerÀÇ ½ÇÁ¦ max-width °ª */
   --gap: 175px;           /* ÄÁÅ×ÀÌ³Ê ¿À¸¥ÂÊ¿¡¼­ ¹Ù±ùÀ¸·Î ¶ç¿ï °£°Ý */
   --mozip-tab-top: 0px;

}

.all-mozip-wrap {position: relative; overflow: hidden;z-index: 1;background: linear-gradient(180deg, #F8F8F8 0%, rgba(248, 248, 248, 0.00) 30%);}
.all-mozip-wrap.gisuk {margin-top: -50px;}
.wrap_left_sky {display: none;}
.wrap_right_sky {display: none;}


/* ¹öÆ° °øÅë */
.mozip-btn-wrap.no-mozip-btn {display: none !important;}
/* =========================
   Visual
========================= */
.visual-wrap {position:relative;overflow:hidden;}
.visual-wrap .inner {background: #fff; width: 100%;max-width: 1200px;position: relative;    box-sizing: border-box;min-height: 218px;display: flex;margin: 24px auto 0;border-radius: 8px;border: 1px solid #DDD;box-sizing: border-box;overflow: hidden;}
.visual-wrap .inner .tit-wrap {display: flex;align-items: center;width: 100%;flex-direction: column;justify-content: center;text-align: center;background: #DCEBFF;padding: 30px;box-sizing: border-box;max-width: 518px;}
.visual-wrap .inner .sub-txt  {color: #777;text-align: center;font-size: 19px;font-weight: 400;line-height: 140%;letter-spacing: -0.45px;}
.visual-wrap .inner .main-tit {display: block;letter-spacing: -0.62px;color: #333;text-align: center;font-size: 32px;font-weight: 700;line-height: 120%;}

.visual-wrap .inner .summary-wrap {padding-left: 14px;width: 100%;padding: 30px 48px;display: flex;flex-direction: column;justify-content: center;}
.visual-wrap .inner .summary-wrap dl {display: flex;}
.visual-wrap .inner .summary-wrap dl:not(:last-of-type) {margin-bottom: 10px;}
.visual-wrap .inner .summary-wrap dl dt {display: flex;flex-direction: column;align-items: flex-start;}
.visual-wrap .inner .summary-wrap dl dt div {color: #555;letter-spacing: -0.5px;font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);line-height: 1.5;min-width: 100px;display: flex;justify-content: left;align-items: center;position: relative;font-weight: 500;}
.visual-wrap .inner .summary-wrap dl dt div::after {display: block;content: '';border-radius: 50px;background: #777;width: 4px;height: 4px;position: absolute;top: 50%;left: -14px;transform: translate(0, -50%);}
.visual-wrap .inner .summary-wrap dl dd {display: flex;justify-content: center;align-items: center;}
.visual-wrap .inner .summary-wrap dl dd div {display: flex;justify-content: center;align-items: flex-start;flex-direction: column;text-align: left;font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);color: rgba(34, 34, 34, 0.70);font-weight: 400;letter-spacing: -0.5px;line-height: 1.5;}
.visual-wrap .inner .summary-wrap dl dd div span {color: #B1B1B1;font-size: 13px;font-weight: 500;letter-spacing: -0.35px;margin-top: 4px;}
.visual-wrap .inner .summary-wrap dl dd div strong.red_txt {font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);font-weight: 400;color: #ED2024;}
.visual-wrap .inner .v-end {position: absolute;top: 0;right: 0;background: #111;color: #fff;width: fit-content;display: flex;justify-content: center;
   padding: clamp(6px, calc(6px + (8 - 6) * ((100vw - 360px) / 840)), 8px) clamp(12px, calc(12px + (14 - 12) * ((100vw - 360px) / 840)), 14px);    
   border-radius: 0 0 10px 10px;    border-radius: 0 0 0 8px;    background: var(--Brand-Blue-Light-01, #5079FF);}

.visual-wrap .inner .v-end p {text-align: center;color: #fff;font-size:  clamp(12px, calc(12px + (14 - 12) * ((100vw - 360px) / 840)), 14px);font-weight: 600;line-height: 140%;letter-spacing: -0.35px;}
.visual-wrap .inner .mozip-btn-wrap {display: flex;gap: 8px;width: fit-content;margin-top: 16px;}

.visual-wrap .inner .mozip-btn-wrap .btn { display: flex;justify-content: center;align-items: center;border-radius: 999px;    white-space: nowrap;
   padding: clamp(8px, calc(8px + (10 - 8) * ((100vw - 360px) / 840)), 10px) 30px;box-sizing: border-box;
   color: #fff;text-align: center;font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);font-weight: 600;line-height: 1.4;letter-spacing: -0.4px;width: 100%;min-width: 159px;}
.visual-wrap .inner .mozip-btn-wrap .btn.btn-apply {background: #2C5BF6;}
.visual-wrap .inner .mozip-btn-wrap .btn.btn-info {background: #9AA3B2;}
.visual-wrap .inner .mozip-btn-wrap .btn span {position: relative;margin-left: -5px;}
.visual-wrap .mozip-btn-wrap .btn span::after {  content: "";  display: block;   line-height: 1;  border-top: 1px solid;  border-right: 1px solid;  transform: rotate(45deg) translateY(-50%);  width: 7px;height: 7px;  position: absolute;  top: 44%;  right: -10px;}

/* 0°³ÀÏ ¶§¸¸ .all-mozip-wrap¿¡ ½ºÅ¸ÀÏ Àû¿ë */
.all-mozip-wrap:has(.visual-wrap .mozip-btn-wrap.no-mozip-btn){  padding-bottom: 0;}
/* .all-mozip-wrap:has(.visual-wrap .mozip-btn-wrap.no-mozip-btn) .quick-wrap {display: none;} */


/* =========================
   contents
========================= */
.mozip-tab {position: relative;    text-align: center;    padding: 12px 0;}
/* .mozip-tab.fixed {position: fixed;top: 0px;left: 0;width: 100%;z-index: 10;border-radius: 0;background: #fff;padding: 12px 0 12PX 16px;} */
.mozip-tab.fixed {  position: fixed;  top: var(--mozip-tab-top, 0px);  left: 0;  width: 100%;  z-index: 10;  border-radius: 0;  background: #fff;  padding: 12px 0 12px 16px;}
.mozip-tab.no-border {border-bottom: 0}
.mozip-tab .cont-inner {max-width: 1200px;margin:0 auto;position: relative;z-index: 1;}
.mozip-tab .cont-inner.off {display: none;}
.mozip-tab .cont-inner .tab-type {display: flex;gap: 12px;}
.mozip-tab .cont-inner .tab-type .tab-item {width: 100%;padding: clamp(10px, calc(10px + (12 - 10) * ((100vw - 360px) / 840)), 12px) 0;cursor: pointer;line-height: 1;display: flex;justify-content: center;align-items: center;font-size: 16px;font-weight: 500;color: #777;}
.mozip-tab .cont-inner .tab-type .tab-item.active {border-bottom: 3px solid #2C5BF6;color: #2C5BF6;font-size: 16px;font-weight: 600;line-height: 140%;letter-spacing: -0.4px;}

.mozip-cont-wrap {position: relative;}
.mozip-cont-wrap .cont-inner {max-width: 1200px; margin: 0 auto;}
.mozip-cont-wrap .cont-inner .section-pdf {max-height: 1500px;height: 1084px;margin: 0 0 48px;}
.mozip-cont-wrap .cont-inner .section-pdf.off {display: none;}

/*¸ðÁý¿ä°­ ÃßÈÄ °ø°³ÀÏ °æ¿ì*/
.mozip-tab.tobe {border-bottom: 0;}
.mozip-cont-wrap .cont-inner .tobe-box {background: #F5F5F5;border-radius: 10px;display: flex;justify-content: center;align-items: center;padding: 63px 0;margin: 0px 0 100px;}
.mozip-cont-wrap .cont-inner .tobe-box .obj-tobe img {width: 72px;}
.mozip-cont-wrap .cont-inner .tobe-box.off {display: none;}
.mozip-cont-wrap .cont-inner .tobe-box > div {display: flex;flex-direction: column;justify-content: center;align-items: center;}
.mozip-cont-wrap .cont-inner .tobe-box > div > p {color: #555;text-align: center;font-size: 18px;font-weight: 400;letter-spacing: -0.45px;margin-top: 12px;line-height: 1.3;}

/*¿ìÃø Äü¹Ù*/
.all-mozip-wrap .quick-wrap {   position: absolute;   top: 30px;   right: max(16px, calc((100vw - var(--container)) / 2 - var(--gap)));   z-index: 5;   display: flex;   flex-direction: column;   transition: top 0.2s, right 0.2s ease;   border-radius: 8px;   overflow: hidden;   width: 100%;   max-width: 144px;}
.all-mozip-wrap .quick-wrap .quick-inner {display: flex;flex-direction: column;border: 1px solid #E9E9EC;margin-top: 16px;border-radius: 8px;overflow: hidden;}
.all-mozip-wrap .quick-wrap.fixed {position: fixed;top: 0;}
.all-mozip-wrap .quick-wrap .q-banner {color: #777;width: 144px;padding: 12px 0;text-align: center;font-weight: 500;font-size: 14px;text-decoration: none;background-color: #fff;}
.all-mozip-wrap .quick-wrap .q-banner:not(:last-of-type) {border-bottom: 1px solid #e9e9ec;}
.all-mozip-wrap .quick-wrap .q-banner:hover {background: #F5F5F5;}
.all-mozip-wrap .quick-wrap .quick-inner.no-mozip-btn {border: 0;}


/* ¿ø¼­Á¢¼ö ¼³¸íȸ ¸ÞÀÎ ¹öÆ° */
.quick-wrap .mozip-btn-wrap {display: flex;flex-direction: column;gap: 8px;}
.quick-wrap .mozip-btn-wrap .btn {font-size: 16px;color: #fff;border-radius: 8px;padding: 12px 0;display: flex;justify-content: center;align-items: center;font-weight: 600;}
.quick-wrap .mozip-btn-wrap .btn.btn-apply {background: #2C5BF6;}
.quick-wrap .mozip-btn-wrap .btn.btn-info {background: #9AA3B2;}


/*FAB ¹öÆ°*/
.scroll-btn-home {display: none;} /* ÃßÈÄ °³Æí ÈÄ »èÁ¦ ¿¹Á¤ */
.scroll-btn-wrap {width: 50px;height: 50px;} /* ÃßÈÄ °³Æí ÈÄ »èÁ¦ ¿¹Á¤ */
.scroll-btn-top {width: 50px;height: 50px;} /* ÃßÈÄ °³Æí ÈÄ »èÁ¦ ¿¹Á¤ */
.scroll-btn-top.on {width: 50px;height: 50px;} /* ÃßÈÄ °³Æí ÈÄ »èÁ¦ ¿¹Á¤ */

#fabQuick .fab-quick__toggle {display: none;}

.scroll-btn-wrap {  position: fixed;  right: 20px;  bottom: 40px;  z-index: 1000;}

/* FAB */
.fab-quick {  position: fixed;  right: 20px;  bottom: 120px;  z-index: 1001;}
.fab-quick__toggle {  width: 50px;  height: 50px;  border-radius: 50%;  border: none;  background: #2C5BF6;  color: #fff;  font-size: 28px;  cursor: pointer;}
.fab-quick__menu {  position: absolute;  right: 0;  bottom: 64px;  display: none;  flex-direction: column;  gap: 10px;  align-items: flex-end;}
.fab-quick.is-open .fab-quick__menu {  display: flex;}
.fab-quick__item {width: 120px;text-align: center;line-height: 1;  padding: 12px 5px;  border-radius: 60px;  background: #F1F3F8; box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.15);  font-size: 13px;  font-weight: 500;  cursor: pointer;}

#fabQuick{  position: fixed;  right: 5% !important;  bottom: 8.5% !important;  z-index: 10001 !important;}
#fabQuick.is-lift{  bottom: calc(3% + 70px) !important;}
#fabQuick .fab-quick__dim{  display: none;  position: fixed;  inset: 0;  background: rgba(0,0,0,.45);  z-index: 0;}
#fabQuick.is-open .fab-quick__dim{ display:block; }
#fabQuick .fab-quick__menu{  position: absolute;  right: 0;  bottom: 57px;  display: flex;  flex-direction: column;  gap: 10px;  align-items: flex-end;  opacity: 0;  transform: translateY(8px);  pointer-events: none;  z-index: 2;}
#fabQuick.is-open .fab-quick__menu{  opacity: 1;  transform: translateY(0);  pointer-events: auto;  transition: opacity .18s ease, transform .18s ease;}
#fabQuick .fab-quick__toggle{  width: 50px;  height: 50px;  border-radius: 50%;  border: 0;  cursor: pointer;  background: #2C5BF6;  position: relative;  z-index: 2;}
#fabQuick.is-open .fab-quick__toggle {background: #333333;}
#fabQuick .fab-quick__plus{  display: inline-flex;  align-items: center;  justify-content: center;  transition: transform .18s ease;margin-top: 5px;}
#fabQuick .fab-quick__plus img{ display:block; }
#fabQuick.is-open .fab-quick__plus{  transform: rotate(45deg);}

body.fab-dim-on .scroll-btn-wrap{  z-index: 80 !important;}
body.fab-dim-on #btn-top{  z-index: 80 !important;}
.scroll-fab-wrap .fab-drawer {display: none;}



/* 1620px ÀÌÇÏ È­¸é¿¡¼­´Â right °ª °íÁ¤ */
/* @media (max-width: 1620px) {
   .all-mozip-wrap .quick-wrap {
      right: calc((100vw - 1620px) / 2 + 38px);
   }
} */

#fabQuick {   position: fixed;   right: 5% !important;   bottom: 8.5% !important;   z-index: 80 !important;}


/* ÅÂºí¸´ ÀÌÇÏ (1199px ÀÌÇÏ) */
@media (max-width: 1199px) {
   .all-mozip-wrap {background: linear-gradient(180deg, #F8F8F8 0%, rgba(248, 248, 248, 0.00) 30%);}

   .visual-wrap {margin: 16px;}
   .visual-wrap .inner {flex-direction: column;max-width: unset;margin: 0;padding: 0;}
   .visual-wrap .inner .tit-wrap {max-width: unset;}
   .visual-wrap .inner .summary-wrap {padding: 24px 68px;}
   .visual-wrap .mozip-btn-wrap .btn span::after {right: -7px;}

   /* .all-mozip-wrap .quick-wrap {top: unset;bottom: -100px;left: 0;right: unset;width: 100%;padding: 0 16px;} */
   .all-mozip-wrap .quick-wrap {top: unset;bottom: -100px;left: 0;right: unset;width: 100%;padding: 0 16px;}
   .all-mozip-wrap .quick-wrap .quick-inner {display: none;}
   .all-mozip-wrap .quick-wrap{position: fixed;left: 0;right: 0;bottom: 0;top: auto;width: 100%;padding: 26px 16px calc(env(safe-area-inset-bottom, 0px) + 24px);    z-index: 10002;    background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 24.39%);    border-radius: 0;  }

   .all-mozip-wrap .quick-wrap {width: unset;max-width: unset;pointer-events: auto;}
   .quick-wrap .mozip-btn-wrap{display:flex;flex-direction: row;gap: 12px;}
   .quick-wrap .mozip-btn-wrap .btn {flex: 1;}
   .mozip-tab {padding: 0 0 12px 16px;box-sizing: border-box;}
   .mozip-tab .cont-inner .tab-type {overflow-x: auto;flex-wrap: nowrap;-webkit-overflow-scrolling: touch;scroll-behavior: smooth;scrollbar-width: none; }
   .mozip-tab .cont-inner .tab-type::-webkit-scrollbar{display:none;}
   .mozip-tab .cont-inner .tab-type .tab-item {border: 1px solid #E6E6E6;border-radius: 999px;min-width: 190px; white-space: nowrap;padding: clamp(10px, calc(10px + (12 - 10) * ((100vw - 360px) / 840)), 12px)  clamp(18px, calc(18px + (25 - 18) * ((100vw - 360px) / 840)), 25px);}
   .mozip-tab .cont-inner .tab-type .tab-item.active {border: 1px solid #2C5BF6;}

   .mozip-tab {padding: 0 0 14px 16px;}
   .mozip-tab .cont-inner .tab-type {overflow-x: auto;overflow-y: visible;padding-bottom: 2px;}
   .mozip-tab .cont-inner .tab-type .tab-item {box-sizing: border-box;  }
   .mozip-tab .cont-inner .tab-type .tab-item.active {border: 1px solid #2C5BF6;}
   .mozip-cont-wrap .cont-inner .tobe-box {margin: 0px 16px 69px;}
   .footer {padding-bottom: 50px;}

   .visual-wrap .inner .mozip-btn-wrap .btn {padding: 10px 30px;}

   /*FAB ¹öÆ° À§Ä¡ Á¶Á¤*/
   #fabQuick .fab-quick__toggle {display: block;width: 40px !important;height: 40px !important;}
   .scroll-fab-wrap .plus-btn {display: none !important;}


   /*ÇÏ´Ü ¹ÙÅÒ ¿µ¿ª*/
   .quick-wrap{pointer-events: none;transform: translateY(100%);transition: opacity .2s ease, transform .2s ease, visibility .2s ease;   }
   .quick-wrap.is-show{opacity: 1;visibility: visible;pointer-events: auto;transform: translateY(0);}
	.all-mozip-wrap .quick-wrap:has(.mozip-btn-wrap.no-mozip-btn) {display: none !important;}

   .scroll-fab-wrap {position: fixed;right: 16px;bottom: 0;z-index: 80;	}
}

@media (min-width: 768px) and (max-width: 1199px) {
	.scroll-fab-wrap {right: 24px;}
}

/* ¸ð¹ÙÀÏ ÀÌÇÏ (767px ÀÌÇÏ) */
@media (max-width: 767px) {
   /* .all-mozip-wrap {padding-top: 55px;} */
   /* .mozip-tab.fixed {top: 55px;} */

   /*Çì´õ GNB*/
   .gnb-inner.is-fixed .gnb-nav {margin-top: 0;}
   
   .mozip-tab .cont-inner .tab-type .tab-item {min-width: auto;font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);}
   .mozip-tab .cont-inner .tab-type .tab-item.active {font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);}

   .visual-wrap .inner .summary-wrap {padding: 24px 24px 24px 38px;}
   .visual-wrap .inner .tit-wrap {padding: 32px 20px;}
   .visual-wrap .inner .mozip-btn-wrap {gap: 6px;}
   .visual-wrap .inner .mozip-btn-wrap .btn {width: 102px;}
   .visual-wrap .inner .sub-txt {font-size: clamp(15px, calc(15px + (19 - 15) * ((100vw - 360px) / 840)), 19px);}
   .visual-wrap .inner .main-tit {font-size: clamp(22px, calc(22px + (32 - 22) * ((100vw - 360px) / 840)), 32px);}
   .visual-wrap .inner .summary-wrap dl:not(:last-of-type) {margin-bottom: 6px;}
   .visual-wrap .inner .mozip-btn-wrap .btn {min-width: 139px;padding: 8px 30px;}
   
   .all-mozip-wrap .quick-wrap {bottom: 60px;}
   
   .mozip-cont-wrap .cont-inner .tobe-box {margin: 0px 16px 26px;padding: 24px 0;}
   .mozip-cont-wrap .cont-inner .tobe-box > div > p {font-size: 14px;}
   .mozip-cont-wrap .cont-inner .tobe-box .obj-tobe img {width: 48px;}
   
   
   /*FAB ¹öÆ° À§Ä¡ Á¶Á¤*/
   #fabQuick {right: 4% !important;}
   .scroll-fab-wrap {right: 16px;}
   .scroll-fab-wrap .top-btn {width: 40px !important;height: 40px !important;}

}