@font-face { font-family:'Pretendard-ExtraLight';font-style:normal;font-display:swap;src:local('Pretendard-ExtraLight'),url(/common/public/fonts/Pretendard-ExtraLight.woff) format('woff');}
@font-face { font-family:'Pretendard-Light';font-style:normal;font-display:swap;src:local('Pretendard-Light'),url(/common/public/fonts/Pretendard-Light.woff) format('woff');}
@font-face { font-family:'Pretendard-Regular';font-style:normal;font-display:swap;src:local('Pretendard-Regular'),url(/common/public/fonts/Pretendard-Regular.woff) format('woff');}
@font-face { font-family:'Pretendard-Medium';font-style:normal;font-display:swap;src:local('Pretendard-Medium'),url(/common/public/fonts/Pretendard-Medium.woff) format('woff');}
@font-face { font-family:'Pretendard-SemiBold';font-style:normal;font-display:swap;src:local('Pretendard-SemiBold'),url(/common/public/fonts/Pretendard-SemiBold.woff) format('woff');}
@font-face { font-family:'Pretendard-Bold';font-style:normal;font-display:swap;src:local('Pretendard-Bold'),url(/common/public/fonts/Pretendard-Bold.woff) format('woff');}
@font-face { font-family:'Pretendard-ExtraBold';font-style:normal;font-display:swap;src:local('Pretendard-ExtraBold'),url(/common/public/fonts/Pretendard-ExtraBold.woff) format('woff');}
@font-face { font-family:'Pretendard-Black';font-style:normal;font-display:swap;src:local('Pretendard-Black'),url(/common/public/fonts/Pretendard-Black.woff) format('woff');}

:root{
    --bs-body-font-family: Apple SD Gothic Neo, Pretendard-Regular, sans-serif;
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 500;
    --bs-dark: #060606;
    --bs-ci: #004FFF;
    --bs-card-color:var(--bs-dark);
    --localnav-background:rgba(250, 250, 252, 0.7);
    --shadow-xs: 0px 1px 2px 0px rgba(16, 24, 40, .051);
}

h1, h2, h3, h4, h5, h6{
    margin-bottom: 0.25rem;
}

h4{
    opacity: 0.75;
}

h6{
    font-weight: 500;
}

@media (max-width: 575.98px) {
    #header .navbar-brand{
        width: 130px;
    }
    #content section:first-child .container>div>svg{
        height: 250px;
    }
}
#showNotify{top:53px;}
.notify-text {
    padding: 10px;
    padding-left: 48px;
    padding-right: 20px;
    white-space: nowrap;
    color: #51596C;
}
.notifys{ margin: 20px;}
.phone-svg{
  position: relative;
  text-align: center;
  display: flex; justify-content: center;
}

.shake-icon { animation: shake 1s ease-in-out infinite;}
.float-icon { animation: float 2s ease-in-out infinite;}
@keyframes shake {
  0%   { transform: translateX(0); }
  15%  { transform: translateX(-5px); }
  30%  { transform: translateX(5px); }
  45%  { transform: translateX(-5px); }
  60%  { transform: translateX(5px); }
  75%  { transform: translateX(-3px); }
  100% { transform: translateX(0); }
}
@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-8px);
  }
  100% {
    transform: translateY(0px);
  }
}
.a-items-center{ align-items: center;}
.navbar .nav-pills .nav-link,.nav-item>a {font-weight: 500; font-family: Apple SD Gothic Neo, 'Pretendard-Medium'; }
.navbar .nav-pills .nav-link { padding: 0.50rem 0.65rem;}
.navbar { background-color:var(--bs-white);}
.navbar-custom .navbar-toggler.navbar-btn-last{
  font-size:1.5rem;
  border-color:transparent !important;
}
.navbar .hs-has-mega-menu .marketing-position{ 
    left:5%;
}
.navbar .hs-has-mega-menu .analytics-position{ 
  left:20%;
}
.navbar .hs-has-mega-menu .blog-position{
    right:0px;
    left:unset;
}
.navbar.navbar-scrolled.navbar-light{
    background-color: transparent;
    box-shadow: none;
    padding-top: 10px;
}
.nav-blur::before{
  content:"";
  position:absolute; inset:0;
  backdrop-filter: blur(10px) saturate(115%);
  -webkit-backdrop-filter: blur(10px) saturate(115%);
}
.navbar-custom .container>nav::before{
  content:"";
  position:absolute; inset:0;
  padding:1px;                            
  border-radius: inherit;
  background:
    linear-gradient(135deg,
      rgba(255,255,255,0.1),
      rgba(255,255,255,0.20) 30%,
      rgba(255,255,255,0.06) 55%,
      rgba(255, 255, 255, 0.1) 100%);            
}

.navbar-custom .container>nav{
  width: 100%;
  backdrop-filter: blur(10px) saturate(115%);
  -webkit-backdrop-filter: blur(10px) saturate(115%);
  box-shadow: none;
  /* outline: 1px solid rgba(255,255,255,.18);      */
  box-shadow: 0 1px 3px 0px rgba(0, 0, 0, .15);
  padding: 6px;
  padding-left: 15px;
  padding-right: 15px;
  border-radius: var(--bs-border-radius-2xl);
}
.navbar-custom:not(.on) {
  box-shadow:none !important;
  padding-bottom: 0px;
  background-color: transparent !important;
  padding-top: 10px;
}


.navbar-nav>li,.navbar-brand{z-index: 3;}
.navbar-aura::before {
  content: "";
  position: absolute;
  inset: -24px;
  border-radius: inherit;
  pointer-events: none;
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  mask: radial-gradient(closest-side, rgba(0,0,0,0) 0 72%, #000 100%);
}

.sliding-img-inapp-to-start{
    background-size: 1919px 238px; 
    height: 238px;
}
.sliding-img-inapp-to-start {
  animation: sliding-img-frame-to-start 60s linear infinite;
}

.sliding-img { width: 100%; height: 53px; }
.sliding-img-frame-to-start{ background-size: 9991px 53px; }
.card{ color:var(--bs-card-color);}
.go-to{z-index: 9998;}
/* .showModal.modal{ z-index: 9999;} */
@media (max-width: 575.98px) {
    .modal.fade.show{
        display: flex !important;
        justify-content: center;
        align-items: center;
    }
}
.showModal>.showDialog{ background: transparent;}
.showModal>.showDialog .modal-dialog{ 
    margin-top: 0px; margin-bottom: 0px;
    width: calc(100vw - 20px);
    margin: 0px;
}
.showModal>.showDialog form{
    display: contents;
}
#navbarNavDropdown .nav-item .recent-blog .img-fluid{
    object-fit: cover;
    object-position: center;
    height: 130px;
}
.recent-blog span ,.recent-blog p{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
  }

.h-lg-85 { height: 85% !important;}

#showNotify{
    z-index: 9999;
}

#login.showDialog ,
#findid.showDialog,
#findpw.showDialog,
#service_description .modal-dialog.modal-dialog-scrollable, 
#partner_inquiry .modal-dialog.modal-dialog-scrollable, 
#service_meeting .modal-dialog.modal-dialog-scrollable{
    display:flex; 
    align-items: center;
}

#login .input-group-merge #login-pw.form-control:not(:last-child){
    padding-left: 0.7rem !important;
}

#login .form-check-input {
    margin-top: 0.25rem;
}
#login #remember-id{
    margin-top: 4.5px;
}
#login .float-start label, #login .float-start span{
    line-height: 24px;
} 
/* 개인정보처리방침, 서비스 이용약관 */ 
.showModal.modal .showDialog{ height: calc(100% - var(--bs-modal-margin) * 2);}
#personalPolicy .modal-dialog.modal-dialog-scrollable, #serviceTerm .modal-dialog.modal-dialog-scrollable{ height: 100%;}

#personalPolicy .modal-header, #serviceTerm .modal-header{
    padding:0.7rem 1.5rem;
}
#personalPolicy .modal-header h4, #serviceTerm .modal-header h4{
    margin-bottom: 0;
}
#personalPolicy .modal-header .btn-sm.dropdown-toggle, #serviceTerm .modal-header .btn-sm.dropdown-toggle{
    padding-top:0.2rem !important;
    padding-bottom:0.2rem !important;
}
#personalPolicy .modal-header .btn-close, #serviceTerm .modal-header .btn-close{
    margin:0;
}   

#service_description label.form-check-label, #partner_inquiry label.form-check-label, #service_meeting label.form-check-label{
    display: inline;
}

/* END 개인정보처리방침, 서비스 이용약관  */
.c-auto{
    cursor: auto;
}

.fw-400{ font-weight: 400;}
.link-size-20{font-size: 18px;}
.modal-content {
    color: #2D374B !important;
}

.form-check-input {
    vertical-align: middle;
    margin-top: 0px;
}

.form-check-label {
    color: #2D374B;
}

.back-gray {
    background-color: rgb(239, 239, 239);
}

.back-service-gray {
    background-color: #F5F9FF;
}

.back-white {
    background-color: #FFFFFF;
}

.back-marking {
    background-color: #FFFF00;
}

.back-green {
    background-color: #DCFFDA;
}

.back-ivory {
    background-color: #F4F3EF;
}

.back-dark-blue {
    background-color: #2D374B;
}

.bg-gray {
    background-color: #EDF0F580;
}

.bg-gray-light {
    background-color: #FBFBFB;
}

.border-page-view {
    border: 5px solid rgba(0, 0, 0, 0.1);
}

.dropdown-menu {
    margin-top: 0;
}

.nav-price>li {
    width: 16.6%;
}

.sliding-img-frame-to-start {
    width: inherit;
    height: inherit;
    background-size: inherit;
}

.fs-7 {
    font-size: 11px;
}

.border-bottom-item {
    border-bottom: var(--bs-list-group-border-width) solid var(--bs-list-group-border-color) !important;
    border-bottom-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    padding: var(--bs-list-group-item-padding-y) 0 !important;
}

.max-w-40 {
    max-width: 40% !important;
}

.min-w-300 {
    min-width: 300px !important;
}

.min-w-400 {
    min-width: 300px !important;
}

.min-w-500 {
    min-width: 500px !important;
}

.arrow-wh {
    width: 30px;
    height: 30px;
}

.w-us {
    width: unset;
}

.w-in {
    width: inherit;
}

.w-7 {
    width: 7% !important;
}

.w-33 {
    width: 33%;
}

.w-55 {
    width: 55%;
}

.w-80 {
    width: 80% !important;
}

.w-90 {
    width: 90% !important;
}


.border-h {
    height: 100px;
}

.term-list>li>a {
    border-radius: 5px;
    padding: 5px 8px;
}

.link-clicked {
    color: white;
    background-color: var(--bs-green);
}

.title-gradient {
    background: linear-gradient(90deg, var(--bs-green) 0%, #9DB4FF 100%);
    color: transparent;
    -webkit-background-clip: text;
}

.was-validated .form-control:invalid,.form-control.is-invalid,
.was-validated .form-check-input:invalid, .form-check-input.is-invalid {
    border-color: #F83434;
    background-color: #FFF7F7;
}

.was-validated .form-control:invalid::placeholder,.form-control.is-invalid::placeholder,
.was-validated .form-check-input:invalid::placeholder, .form-check-input.is-invalid::placeholder,
.form-check-input.is-invalid ~ .form-check-label , .is-invalid ~ .invalid-feedback{
    color: #F83434;
}

.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus,
.was-validated .form-check-input:invalid:focus, .form-check-input.is-invalid:focus {
    border-color: #F83434;
    box-shadow: 0 0 1rem 0 rgba(248, 52, 52, 0.25);
}

.text-valid {
    color: #F83434;
}

.form-control {
    background-color: #FAFBFB;
    padding: 0.7rem !important;
}

.form-control:focus {
    border-color: var(--bs-green);
    box-shadow: 0 0 1rem 0 rgba(10, 191, 83, 0.25);
}

.form-control::placeholder {
    font-size: 14px;
}

.form-control.area-holder-67::placeholder {
    line-height: 67px;
}

.valid-status>div { padding: 10px; }

.valid-status>div {
    color: #F83434;
    background-color: #F834340F;
}

.btn.disable {
    border: 1px solid #82828238;
    background-color: #82828238;
    pointer-events: none;
}

.divider-start.m-0::after {
    margin: 0;
}

.domain-chk .protocal,
#service_meeting .protocal{
    display: inline-block;
    position: absolute;
    padding: 0.7rem;
}

.domain-chk input ,
#service_meeting #site-url{
    padding-left: 63px !important;
}

.animation-section .container>div>div>div h2.display-6:last-of-type{
    margin-bottom: 2rem !important;
}

@media (max-width: 575.98px) {
    .brand-group img{
        height: 22px;
    }
}

/* tooltip */
.tooltip {
    --bs-tooltip-arrow-width: 2rem;
    --bs-tooltip-arrow-height: 1.4rem;
}

.tooltip {
    max-width: 485px;
}

.tooltip-inner {
    max-width: none;
    padding: 20px;
    border-radius: 16px;
    box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.25);
}

.js-tooltip>div {
    padding-bottom: 15px;
}

.js-tooltip>div:last-child {
    padding-bottom: 0px;
}

.js-tooltip .image-tip img {
    width: 400px;
    height: 200px;
    border-radius: 16px;
    border: 1px solid #D0D0D0;
}

.js-tooltip .title-tip {
    text-align: left;
}

.js-tooltip .title-tip span {
    font-family: Apple SD Gothic Neo, Pretendard-Regular, sans-serif;
    font-weight: 700;
    font-size: 18px !important;
    padding-bottom: 20px;
    color: white;
}

.tooltip-light .js-tooltip .title-tip span{
    color: #000;
}

.js-tooltip .content-tip {
    text-align: left;
}

.js-tooltip .content-tip span {
    font-family: Apple SD Gothic Neo, Pretendard-Regular, sans-serif;
    font-size: 16px !important;
    font-weight: 400;
    font-size: var(--bs-body-font-size);
    color: white;
}

.tooltip-light .js-tooltip .content-tip span{
    color: #000 !important;
}

.js-tooltip .button-tip {
    text-align: right;
}

.js-tooltip .button-tip>div {
    display: inline-block;
    background-color: #0ABF53;
    padding: 14px 20px;
    border-radius: 8px;
    color: #1C1F2E;
    font-family: Apple SD Gothic Neo, Pretendard-Regular, sans-serif;
    font-weight: 700;
    font-size: 18px;
    cursor: pointer;
}

.tooltip-light .js-tooltip .button-tip>div{
    color: white !important;
}

.tooltip-light .tooltip-arrow::before{
    border-right-color: white !important;
}

.tooltip-light .tooltip-inner{
    background-color: white !important;
}
/* end tooltip */


@media (min-width: 992px) {
    .navbar-custom .navbar-nav.nav-pills  .nav-item.me-4{
        margin-right: 5.625rem  !important;
    }
}
@media (min-width: 992px) {
 .navbar-custom.on .navbar-nav.nav-pills  .nav-item.me-4{
        margin-right: 7.625rem  !important;
    }
}
.navbar-custom .navbar-nav.nav-pills .nav-item{
    margin-left: 0.45rem !important;
    margin-right: 0.45rem !important;
}