@font-face {
    font-family: "Pretendard Black";
    font-weight: 900;
    src: url("/_lib/m_lib/font/Pretendard-Black.woff2") format("woff2");
}

@font-face {
    font-family: "Pretendard ExtraBold";
    font-weight: 800;
    src: url("/_lib/m_lib/font/Pretendard-ExtraBold.woff2") format("woff2");
}

@font-face {
    font-family: "Pretendard Bold";
    font-weight: 700;
    src: url("/_lib/m_lib/font/Pretendard-Bold.woff2") format("woff2");
}

@font-face {
    font-family: "Pretendard SemiBold";
    font-weight: 600;
    src: url("/_lib/m_lib/font/Pretendard-SemiBold.woff2") format("woff2");
}

@font-face {
    font-family: "Pretendard Medium";
    font-weight: 500;
    src: url("/_lib/m_lib/font/Pretendard-Medium.woff2") format("woff2");
    
}

@font-face {
    font-family: "Pretendard Regular";
    font-weight: 400;
    src: url("/_lib/m_lib/font/Pretendard-Regular.woff2") format("woff2");
}

@font-face {
    font-family: "Pretendard Light";
    font-weight: 300;
    src: url("/_lib/m_lib/font/Pretendard-Light.woff2") format("woff2");
}

@font-face {
    font-family: "Pretendard ExtraLight";
    font-weight: 200;
    src: url("/_lib/m_lib/font/Pretendard-ExtraLight.woff2") format("woff2");
}

@font-face {
    font-family: "Pretendard Thin";
    font-weight: 100;
    src: url("/_lib/m_lib/font/Pretendard-Thin.woff2") format("woff2");
}

body{font-family: "Pretendard Regular"; background-color: black;}


:root {

  --white-color:                  #ffffff;
  --primary-color:                #076FB7;
  --secondary-color:              #076fb7;
  --section-bg-color:             #f0f8ff;
  --custom-btn-bg-color:          #80d0c7;
  --custom-btn-bg-hover-color:    #13547a;
  --dark-color:                   #000000;
  --p-color:                      #717275;
  --border-color:                 #7fffd4;
  --link-hover-color:             #13547a;
  --body-font-family: 'Pretendard', sans-serif;
  --title-font-family: 'Pretendard', sans-serif;
  --h1-font-size:                 58px;
  --h2-font-size:                 46px;
  --h3-font-size:                 32px;
  --h4-font-size:                 28px;
  --h5-font-size:                 24px;
  --h6-font-size:                 22px;
  --p-font-size:                  20px;
  --menu-font-size:               14px;
  --btn-font-size:                18px;
  --copyright-font-size:          16px;

  --border-radius-large:          100px;
  --border-radius-medium:         20px;
  --border-radius-small:          10px;

  --font-weight-normal:           400;
  --font-weight-medium:           500;
  --font-weight-semibold:         600;
  --font-weight-bold:             700;
}






a:hover {
    color: #ffce3a;
    text-decoration: none;
  }
  
  /*--------------------------------------------------------------
  # Back to top button
  --------------------------------------------------------------*/
  .back-to-top {
    position: fixed;
    visibility: hidden;
    opacity: 0;
    right: 15px;
    bottom: 15px;
    z-index: 996;
    background: #5892ff;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    transition: all 0.4s;
  }
  
  .back-to-top i {
    font-size: 28px;
    color: #fff;
    line-height: 0;
  }
  
  .back-to-top:hover {
    background: #ffcb30;
    color: #fff;
  }
  
  .back-to-top.active {
    visibility: visible;
    opacity: 1;
  }
  
  /*--------------------------------------------------------------
  # Header
  --------------------------------------------------------------*/
  #header {
    transition: all 0.5s;
    z-index: 997;
    padding: 20px 0;
    background: rgba(55, 64, 85, 0.9);
  }
  
  #header.header-transparent {
    background: transparent;
  }
  
  #header.header-scrolled {
    background: rgba(55, 55, 55, 0.7);
    padding: 15px 0;
  }
  
  #header .logo {
    width: 50%;
  }
  
  #header .logo a {
    color: #fff;
  }
  
  #header .logo img {
    max-height: 40px;
  }
  
  /*--------------------------------------------------------------
  # Navigation Menu
  --------------------------------------------------------------*/
  /**
  * Desktop Navigation 
  */
  .navbar {
    padding: 0;
  }
  
  .navbar ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
  }
  
  .navbar li {
    position: relative;
  }
  
  .navbar a,
  .navbar a:focus {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 10px 70px;
    color: #fff;
    font-size: 18px;
    white-space: nowrap;
    transition: 0.3s;
  }
  
  .navbar a i,
  .navbar a:focus i {
    font-size: 12px;
    line-height: 0;
    margin-left: 5px;
  }
  
  .navbar a:hover,
  .navbar .active,
  .navbar .active:focus,
  .navbar li:hover>a {
    color: #5892ff;
  }
  
  .navbar .dropdown ul {
    display: block;
    position: absolute;
    left: 60px;
    top: calc(100% + 30px);
    margin-top: 18px;
    padding: 10px 0;
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    background: rgba(55, 55, 55, 0.7);
    /* box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25); */
    transition: 0.3s;
  }
  
  .navbar .dropdown ul li {
    min-width: 200px;
  }
  
  .navbar .dropdown ul a {
    padding: 10px 20px;
    font-size: 14px;
    text-transform: none;
    color: #fff;
  }
  
  .navbar .dropdown ul a i {
    font-size: 12px;
  }
  
  .navbar .dropdown ul a:hover,
  .navbar .dropdown ul .active:hover,
  .navbar .dropdown ul li:hover>a {
    color: #5892ff;
  }
  
  .navbar .dropdown:hover>ul {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }
  
  .navbar .dropdown .dropdown ul {
    top: 0;
    left: calc(100% - 30px);
    visibility: hidden;
  }
  
  .navbar .dropdown .dropdown:hover>ul {
    opacity: 1;
    top: 0;
    left: 100%;
    visibility: visible;
  }
  
  @media (max-width: 1366px) {
    .navbar .dropdown .dropdown ul {
      left: -90%;
    }
  
    .navbar .dropdown .dropdown:hover>ul {
      left: -100%;
    }
  }
  
  /**
  * Mobile Navigation 
  */
  .mobile-nav-toggle {
    color: #fff;
    font-size: 28px;
    cursor: pointer;
    display: none;
    line-height: 0;
    transition: 0.5s;
  }
  
  @media (max-width: 991px) {
    .mobile-nav-toggle {
      display: block;
    }
  
    .navbar ul {
      display: none;
    }
  }
  
  .navbar-mobile {
    position: fixed;
    overflow: hidden;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(45, 53, 69, 0.9);
    transition: 0.3s;
    z-index: 999;
  }
  
  .navbar-mobile .mobile-nav-toggle {
    position: absolute;
    top: 15px;
    right: 15px;
  }
  
  .navbar-mobile ul {
    display: block;
    position: absolute;
    top: 55px;
    right: 15px;
    bottom: 15px;
    left: 15px;
    padding: 10px 0;
    background-color: #fff;
    overflow-y: auto;
    transition: 0.3s;
  }
  
  .navbar-mobile a,
  .navbar-mobile a:focus {
    padding: 10px 20px;
    font-size: 15px;
    color: #414c64;
  }
  
  .navbar-mobile a:hover,
  .navbar-mobile .active,
  .navbar-mobile li:hover>a {
    color: #5892ff;
  }
  
  .navbar-mobile .dropdown ul {
    position: static;
    display: none;
    margin: 10px 20px;
    padding: 10px 0;
    z-index: 99;
    opacity: 1;
    visibility: visible;
    background: #fff;
    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  }
  
  .navbar-mobile .dropdown ul li {
    min-width: 200px;
  }
  
  .navbar-mobile .dropdown ul a {
    padding: 10px 20px;
  }
  
  .navbar-mobile .dropdown ul a i {
    font-size: 12px;
  }
  
  .navbar-mobile .dropdown ul a:hover,
  .navbar-mobile .dropdown ul .active:hover,
  .navbar-mobile .dropdown ul li:hover>a {
    color: #5892ff;
  }
  
  .navbar-mobile .dropdown>.dropdown-active {
    display: block;
  }
  
  /*--------------------------------------------------------------
  # Hero Section
  --------------------------------------------------------------*/

#hero {
  width: 100%;
  height: 100vh;
  position: relative;
  overflow: hidden;
}
  #hero:before {
    content: "";
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
  }

#heroVideo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1;
}

#heroVideo video {
  width: 100%;
  height: 100%;
  object-fit: fill;
}



  #hero .container {
    text-align: center;
    padding-top: 50px;
    padding-bottom: 50px;
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
    border: 1px solid rgba(255, 255, 255, 0.18);
    opacity: 0.5;
  }
  
  @media (max-width: 991px) {
    #hero .container {
      padding-top: 0;
    }
  }
  
  .hero-text {
    text-align: center;
    position: absolute;
    opacity: 0;
    animation: fadeIn 1s ease-in-out 3s forwards;
    padding-bottom: 70px;
  }

  .hero-text-front {
    text-align: center;
	  position: absolute;
	  opacity: 1;
    animation: fadeOut 1s ease-in-out 2s forwards;
  }

  #hero h1 {
    font-size: 100px;
    font-weight: 700;
    line-height: 56px;
    color: #fff;
  }

  #hero .logo-icon {
    width:130px;
  }

  @keyframes fadeIn {
    to {
        opacity: 1;
    }
  }  

  @keyframes fadeOut {
    to {
        opacity: 0;
    }
  }  
  
  @keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translateX(-100%);
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
  }

  @keyframes fadeOutRight {
	0% {
		opacity: 1;
		transform: translateX(0);
	}
	100% {
		opacity: 0;
		transform: translateX(100%);
	}
  }

  #hero h2 {
    color: #eee;
    margin: 50px 0 50px 0;
    font-size: 70px;
  }
  
  #hero .btn-get-started {
    font-family: "Raleway", sans-serif;
    font-weight: 500;
    font-size: 15px;
    letter-spacing: 1px;
    display: inline-block;
    transition: 0.5s;
	position:absolute;
	bottom: 50px;
	text-align:center;
    /* border-radius: 50px;
    border: 2px solid rgba(178, 204, 255, 0.7); */
    color: #fff;
  }

  @media (min-width: 1024px) {
    #hero {
      background-attachment: fixed;
    }
  }
  

/* ABOUT */
  #nw-about {
    height: 50vh; 
    background-image: url("/images/renew_front/about-top.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }
  #nw-about h1{
    color: #fff;
    font-size: 72px;
    font-weight: bolder;
  }

  #nw-bm-mws {
    height: 50vh; 
    background-image: url("/images/renew_front/bm-mws-top.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }

  /* #nw-case-mws{
    height: 100vh !important; 
    background-image: url("/images/renew_front/top-board-case.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;    
  }


  #nw-noti-mws{
    height: 100vh !important; 
    background-image: url("/images/renew_front/top-board-case.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;    
  } */

.noti_th_num      { min-width: 50px; }
.noti_th_title    { min-width: 600px; }
.noti_th_writer   { min-width: 50px; }
.noti_th_regdate  { min-width: 50px; }



#nw-case-mws, #nw-noti-mws {
  height: 50vh !important;
  overflow: hidden;
  background-image: url("/images/renew_front/top-board-case.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

#nw-case-mws, #nw-noti-mws {
  flex-shrink: 0;
}


  .about-text h1{
    color: #fff;
    font-size: 72px;
    font-weight: bolder;
  }

  .about-text-load h1{
    color: #fff;
    font-size: 72px;
    font-weight: bolder;
    margin-bottom: 60px;
    margin-top: 150px;
  }


.bold-border-tb td{
  padding: 10px;  /* padding will now be applied */
}

  /* case */
  .case-text h1{
    color: #fff;
    font-size: 72px;
    font-weight: bolder;   
  }





  /* BM */

  .bm-text h1{
    color: #fff;
    font-size: 72px;
    font-weight: bolder;    
  }

  .bm-text p{
    color: #fff;
    font-size: 32px;
    font-weight: 400;
  }

  .bm-mws{
    margin-top: 200px;
    margin-bottom: 200px;
  }

  .bm-mws-text{
    align-items: center;
    height: 636px;
    color: #fff;
  }  
  .bm-mws-text h5{
    font-size: 24px;
    line-height: 1.5  ;
  }
  .bm-mws-text h3{
    font-size: 67px;
    font-weight: bolder;
    line-height: 2.0;
  }
  .bm-mws-text li{
    line-height: 2;
  }
  .bm-mws-video iframe {
    width: 100%;
    height: 100%;
    border-radius: 20px;
  }
  .mws-card h1{
    font-size: 67px !important;
    font-weight: 800 !important;
  }
  .mws-card small{
    font-size: 12px !important;
    font-weight: 400 !important;
  }

  .progress {
    background-color: #3a3a3a;
    position: relative;
    height: 32px;
    border-radius: 12px;
    overflow: hidden;
  }

  .progress-bar {
    height: 100%;
    border-radius: 12px;
    z-index: 1;
    position: relative;
  }

  .progress-label {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.85rem;
    color: #fff;
    z-index: 2;
    white-space: nowrap;
  }
  .pg-area h1{
    /* font-size: 96px; */
    font-size: 67px;
    font-weight: 900;
  }
  .pg-area h4{
    /* font-size: 96px; */
    font-size: 24px;
    font-weight: 400;
  }  

.stepline-list {
  --col-gap: 2rem;
  --row-gap: 2rem;
  --line-w: 0.25rem;
  display: grid;
  grid-template-columns: var(--line-w) 1fr;
  grid-auto-columns: max-content;
  column-gap: var(--col-gap);
  list-style: none;
  width: min(88rem, 100%);
  margin-inline: auto;
}

.stepline-list::before {
  content: "";
  grid-column: 1;
  grid-row: 1 / span 20;
  background: rgb(225, 225, 225);
  border-radius: calc(var(--line-w) / 2);
}

.stepline-item:not(:last-child) {
  margin-bottom: var(--row-gap);
}

.stepline-item {
  grid-column: 2;
  --inlineP: 1.5rem;
  margin-inline: var(--inlineP);
  grid-row: span 2;
  display: grid;
  grid-template-rows: min-content min-content min-content;
}


.stepline-date-wrapper {
  border-radius: 25px 25px 0 0;
  background-color: #1C1C1F;
  width: 100%;
}

.stepline-date {
  --dateH: 3rem;
  height: var(--dateH);
  text-align: center;
  color: white;
  font-size: 1.25rem;
  font-weight: 700;
  display: grid;
  place-content: center;
  position: relative;

  border-radius: 20px;
  padding: 0 1rem;

  /* 동일 폭을 위해 */
  width: 100%;
  margin: 0;
}

/* 제거: 삼각형 꼬리 */
.stepline-date::before {
  display: none;
}

.stepline-date::after {
  content: "";
  position: absolute;
  width: 2rem;
  height: 2rem;
  background-color: transparent; /* 비어 있게 */
  border: 3px solid; /* 색은 stepN에서 지정 */
  border-radius: 50%;
  top: 50%;
  transform: translate(50%, -50%);
  right: calc(100% + var(--col-gap) + var(--line-w) / 2);
  z-index: 2;
}



.stepline-descr {
  background: #1C1C1F;
  position: relative;
  padding: 1rem;
  width: 100%;
  font-size: 24px;
  font-weight: 300;
  color: #fff;
  border-radius: 0px 0px 15px 15px;
  line-height: 1.5;
}

@media (min-width: 40rem) {
  .stepline-list {
    grid-template-columns: 1fr var(--line-w) 1fr;
  }

  .stepline-list::before {
    grid-column: 2;
  }

  .stepline-item:nth-child(odd) {
    grid-column: 1;
  }

  .stepline-item:nth-child(even) {
    grid-column: 3;
  }

  .stepline-item:nth-child(2) {
    grid-row: 2/4;
  }

  .stepline-item:nth-child(odd) .stepline-date::after {
    transform: translate(-50%, -50%);
    left: calc(100% + var(--col-gap) + var(--line-w) / 2);
  }
}

.stepline-credits {
  margin-top: 1rem;
  text-align: right;
}

.stepline-credits a {
  color: #1e1e1e;
}

/* 개별 step 색상 */
.step1 .stepline-date {
  background-color: #477ABD;
  border-color: #477ABD;
}

.step2 .stepline-date{
  background-color: #D02156;
  border-color: #D02156;
}

.step3 .stepline-date{
  background-color: #E2AD34;
  border-color: #E2AD34;
}

.step4 .stepline-date{
  background-color: #3B8B55;
  border-color: #3B8B55;
}

.step1 .stepline-date::after {
  border-color: #477ABD;
  background-color: #000000;
  margin-left: 23.5px;
}

.step2 .stepline-date::after {
  border-color: #D02156;
  background-color: #000000;
  margin-right: 23.5px;
}

.step3 .stepline-date::after {
  border-color: #E2AD34;
  background-color: #000000;
  margin-left: 23.5px;
}

.step4 .stepline-date::after {
  border-color: #3B8B55;
  background-color: #000000;
  margin-right: 23.5px;
}

@media (max-width: 639px){
.step1 .stepline-date::after {
  margin-left: 0px;
  margin-right: 24px;
}

.step2 .stepline-date::after {
  margin-right: 24px;
}

.step3 .stepline-date::after {
  margin-left: 0px;
  margin-right: 24px;
}

.step4 .stepline-date::after {
  margin-right: 24px;
}  
}
  

  /*--------------------------------------------------------------
  # Sections General
  --------------------------------------------------------------*/
  section {
    padding: 60px 0;
  }

  section:first-child{
	padding-top:180px;
  }

  section:nth-child(n+4){
	padding:100px 0;
  }

  section:last-child{
	padding-bottom:0px;
  }
  
  .section-bg {
    background: black;
    height: auto;
  }
  
  .section-title {
    text-align: center;
    padding-bottom: 30px;
  }
  
  .section-title h2 {
    color: white;
    font-size: 70px;
    font-weight: bolder;
    margin-bottom: 20px;
    padding-bottom: 20px;
    position: relative;
  }
  
  .section-title h2::after {
    content: "";
    position: absolute;
    display: block;
    width: 50px;
    height: 3px;
    bottom: 0;
    left: calc(50% - 25px);
  }
  
  .section-title p {
    margin-bottom: 0;
    font-size: 14px;
    color: #aab3c7;
  }
  
  .section-title-top {
    text-align: center;
    padding-bottom: 30px;
  }
  
  .section-title-top h2 {
    color: white;
    font-size: 70px;
    font-weight: bolder;
    margin-bottom: 20px;
    padding-bottom: 20px;
    position: relative;
  }
  
  .section-title-top h2::after {
    content: "";
    position: absolute;
    display: block;
    width: 50px;
    height: 3px;
    bottom: 0;
    left: calc(50% - 25px);
  }
  
  .section-title-top p {
    margin-bottom: 0;
    font-size: 14px;
    color: #aab3c7;
  }
  
  
  /*--------------------------------------------------------------
  # MWS
  --------------------------------------------------------------*/
  .about h3 {
    font-weight: 700;
    font-size: 34px;
    color: #414c64;
  }
  
  .about h4 {
    font-size: 20px;
    font-weight: 700;
    margin-top: 5px;
  }
  
  .about i {
    font-size: 48px;
    margin-top: 15px;
    color: #8b97b3;
  }
  
  .about p {
    font-size: 15px;
    color: #848484;
  }

  
  
  /*--------------------------------------------------------------
  # Footer
  --------------------------------------------------------------*/
  #footer {
    color: #414c64;
    font-size: 14px;
    background: #000000;
  }
  
  #footer .footer-top {
    padding: 60px 0 30px 0;
    background: #4e7bbd;
    color: white;
  }
  #footer .mb-footer-top{
    padding: 30px 0 30px 0;
    background: #4e7bbd;
    color: white;    
  }
 
  /* Addon CSS */
  
  .info-move{
    width: 80%;
    text-align: left;
    margin-bottom: 1%;
    opacity: 0;
    transition: opacity 0.5s ease, transform 0.5s ease;
  }
  
  .info-move.show {
    opacity: 1;
  }
  
  /* Pross CSS area START*/
                 
  a {
    text-decoration: none;
  }
  .pros-icon {
    display: inline-block;
    width: 1em;
    stroke-width: 0;
    stroke: currentColor;
    fill: currentColor;
  }
  
  @media screen and (max-width: 991px) {
    .wrapper {
      height: auto;
      min-height: 100vh;
   }
  }
  .content {
    height: 600px;
    margin: auto;
    width: 100%;
    max-width: 1050px;
    display: flex;
    align-items: center;
    position: relative;
  }
  @media screen and (max-width: 1200px) {
    .content {
      max-width: 920px;
   }
  }

  @media screen and (max-width: 991px) {
    .content {
      max-width: noned;
	  width: 100%;
      margin-top: 100px;
      height: auto;
      min-height: 100vh;
	  margin-left:0;
	  margin-right:0;
   }
  }

  @media screen and (max-width: 576px) {
    .content {
      margin-bottom: 20px;
   }
  }
  .bg-shape {
    height: 100%;
    background-image: linear-gradient(-45deg, #cc3843 0%, #cb193f 100%);
    box-shadow: 0px 30px 139px 0px rgba(10, 22, 31, 0.26);
    border-radius: 30px;
    padding: 45px 40px;
    width: 50%;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
  }
  @media screen and (max-width: 1200px) {
    .bg-shape {
      width: 45%;
   }
  }
  @media screen and (max-width: 991px) {
    .bg-shape {
      width: 90%;
      height: 290px;
      align-items: flex-start;
      padding: 50px;
      left: 50%;
   }
  }
  @media screen and (max-width: 767px) {
    .bg-shape {
      padding: 30px;
      width: 95%;
      border-radius: 20px;
   }
  }
  @media screen and (max-width: 576px) {
    .bg-shape {
      height: 200px;
      padding: 30px;
   }
  }
  .bg-shape img {
    object-fit: contain;
    width: 510px;
    display: block;
    object-position: left center;
    opacity: 0.2;
    max-width: inherit;
    left: 10px;
    position: absolute;
  }
  @media screen and (max-width: 1200px) {
    .bg-shape img {
      width: 430px;
      left: 10px;
   }
  }
  @media screen and (max-width: 991px) {
    .bg-shape img {
      transform: none;
      width: 100%;
      position: relative;
      left: auto;
      margin-left: auto;
      margin-right: auto;
      object-fit: contain;
      height: 100%;
      object-position: top center;
   }
  }
  .next, .prev {
    z-index: 22;
    display: inline-flex;
    border: none;
    width: 61px;
    height: 61px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    font-size: 25px;
    position: absolute;
    top: 50%;
    outline: none;
    cursor: pointer;
  }
  
  .next.disabled, .prev.disabled {
    cursor: not-allowed;
  }
  .next:focus, .prev:focus {
    outline: none;
  }
  @media screen and (max-width: 991px) {
    .next, .prev {
      top: 170px;
   }
  }
  .prev {
    left: -30%;
    transform: translate(-100%, -50%);
  }
  @media screen and (max-width: 1200px) {
    .prev {
      left: -21%;
          margin-left: 25%;
   }
  }
  @media screen and (max-width: 991px) {
    .prev {
      left: 0;
      transform: translate(-50%, -50%);
          margin-left: 5%;
   }
  }
  @media screen and (max-width: 576px) {
    .prev {
      transform: translate(20%, -50%);
   }
  }
  .next {
    right: -32%;
    transform: translate(50%, -50%);
  }
  @media screen and (max-width: 576px) {
    .next {
      transform: translate(-20%, -50%);
   }
  }
  .pross-slider {
    width: 75%;
    height: 85%;
    border-radius: 30px;
    box-shadow: 0 28px 79px 0 rgba(10, 22, 31, 0.35);
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }
  
  @media screen and (max-width: 1200px) {
    .pross-slider {
      width: 80%;
   }
  }
  @media screen and (max-width: 991px) {
    .pross-slider {
      width: 80%;
      left: 50%;
      transform: translateX(-50%);
      height: auto;
      position: relative;
      top: 0;
      margin-top: 170px;
      margin-bottom: 100px;
   }
    .pross-slider br {
      /*display: none;*/
   }
  }
  .pross-slider__wrp {
    height: 100%;
  }
  .pross-slider__item {
    position: relative;
    height: 100%;
    width: 100%;
  }
  @media screen and (max-width: 991px) {
    .pross-slider__item {
      height: auto;
   }
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > * {
    opacity: 1;
    transform: none;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(1) {
    transition-delay: 0s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(2) {
    transition-delay: 0.2s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(3) {
    transition-delay: 0.4s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(4) {
    transition-delay: 0.6s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(5) {
    transition-delay: 0.8s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(6) {
    transition-delay: 1s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(7) {
    transition-delay: 1.2s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(8) {
    transition-delay: 1.4s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(9) {
    transition-delay: 1.6s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(10) {
    transition-delay: 1.8s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(11) {
    transition-delay: 2s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(12) {
    transition-delay: 2.2s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(13) {
    transition-delay: 2.4s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(14) {
    transition-delay: 2.6s;
  }
  .pross-slider__item.swiper-slide-active .pross-slider__content > *:nth-child(15) {
    transition-delay: 2.8s;
  }
  .pross-slider__item.swiper-slide-active circle {
    animation: progress 1s ease-out forwards;
    animation-delay: 0.5s;
    opacity: 0.75;
  }
  .pross-slider__card {
    height: 100%;
    display: flex;
    align-items: center;
    width: 1032px;
    transition: all 0.5s;
    overflow: hidden;
    position: relative;
    border-radius: 30px;
  }
  .card_index_no{
    text-align: right;
  }
  .card-container{
    margin-left: 8%;
  }

  @media screen and (max-width: 991px) {
    .pross-slider__card {
      align-items: flex-start;
   }
  }
  @media screen and (max-width: 767px) {
    .pross-slider__card {
      border-radius: 20px;
   }
  }
  .pross-slider__cover {
    border-radius: 30px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
  }
  @media screen and (max-width: 767px) {
    .pross-slider__cover {
      border-radius: 20px;
   }
  }
  .pross-slider__cover img{
    object-fit: fill;
  }
  .pross-slider__content {
    color: #fff;
    padding-top: 1px;
    position: relative;
    z-index: 2;
    width: 100%;
    padding-left: 10px;
    padding-right: 80px;
    text-align: left;
  }
  @media screen and (max-width: 1200px) {
    .pross-slider__content {
      padding-left: 220px;
   }
  }
  @media screen and (max-width: 991px) {
    .pross-slider__content {
      padding: 20px 60px 100px;
      padding-top: 280px;
      text-align: center;
   }
   .hr-vertical{
    margin-left: 0% !important;
    width: 0px !important;
   }
  }

  .pross-slider__title {
    margin: 0;
    margin-bottom: 10px;
    font-weight: 900;
    font-size: 41px;
    line-height: 1.2em;
    letter-spacing: 2px;
    opacity: 0;
    transform: translateY(55px);
    transition: all 0.5s;
  }
  .pross-slider__title h5{
    font-size: 32px;
  }
  .pross-slider__title h3{
    font-size: 60px;
    font-weight: bolder;
  }
  .pross-right-txt h5{
    font-size: 28px;
    letter-spacing: -1px;
  }
  @media screen and (max-width: 1200px) {
    .pross-slider__title {
      font-size: 34px;
   }
  }

  .pross-ctr {
    display: flex;
    align-items: center;
    min-height: 150px;
    opacity: 0;
    transform: translateY(55px);
    transition: all 0.5s;
  }
  .pross-ctr h2{
    font-size: 40px;
  }

  @media screen and (max-width: 991px) {
    .pross-ctr {
      justify-content: center;
   }
  }
  .hr-vertical {
    width: 3px;
    background: #9fa3a7;
    align-self: stretch;
    margin-left: 25%;
    margin-right: 5%;
    margin-top: 12%;
    flex-shrink: 0;
    opacity: 0.5;
    height: 60%;
  }
  @media screen and (max-width: 991px) {
    .pross-ctr {
      justify-content: center;
      flex-wrap: wrap;
      margin-bottom: 40px;
   }
    .pross-ctr .hr-vertical {
      width: 100%;
      margin: 35px 0;
      height: 1px;
   }
  }
  @media screen and (max-width: 767px) {
    .pross-labels {
      width: 100%;
   }
  }
  @keyframes progress {
    0% {
      stroke-dasharray: 0 100;
   }
  }
  
  
  .pross-img {
    position: absolute;
    z-index: 2;
    width: 500px;
    left: 25%;
    transform: translateX(-45%);
    max-height: 500px;
    height: 100%;
    pointer-events: none;
  }
  @media screen and (max-width: 1200px) {
    .pross-img {
      width: 430px;
      left: 20%;
   }
  }
  @media screen and (max-width: 991px) {
    .pross-img {
      width: 430px;
      left: 50%;
      transform: translateX(-50%);
      top: 0;
      height: 350px;
   }
  }

  .pross-img__item {
    display: flex;
    align-items: center;
    position: absolute;
    pointer-events: none;
    user-select: none;
    top: 50%;
    right: 0;
    transform: translateY(-50%) translateX(-130px);
    opacity: 0;
    transition: all 0.3s;
  }
  .pross-img__item.active {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
    transition-delay: 0.3s;
  }
  .pross-img__item img {
    object-fit: contain;
    margin-left: 10%;
    /*margin-bottom: 10%;*/
    /* object-position: center right; */
    width: 80%;
  }
  /* Pross CSS area  END*/

  /* Glass panel Style */
  .glass-panel{
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    width: 1000px;    
  }
  .glass-div{
    background: #4e7abd73;
    backdrop-filter: blur(10px);
    border-radius: 20px;
    padding: 20px;
    /* box-shadow: 0 8px 32px 0 rgba(75, 75, 75, 0.37); */
    backdrop-filter: blur(5px);
  }

  /* Manual CSS */
  .ab-01{
    background-size: contain;
  }
  .ab-01 img{
    width: 90%;
    height: 100%;
  }
  .ab-02 img{
    width: 153px;
    margin-bottom: 100%;
  }
  .ab-03 img{
    width: 240px;
    height: 100%;
  }
  .ab-04 img{
    margin-top: 50%;
    width: 100px;
  }
  .ab-05 img{
    margin-top: 3%;
    height: 100%;
    width: 100%;
  }
  .ab-06 img{
    margin-left: 82%;
    margin-top: 5%;
    width: 120px;
  }
  .ab-07 img{
    margin-top: 10%;
    width: 100px;
  }
  .ab-08 img{
    width: 150px;
  }  
  .ab-right{
    color: white;
  }
  .ab-right-txt{
    margin-left: 14px;
    width:600px    
  }
  .ab-right-txt2{
    margin-left: 30px;
    padding-left: 12px;
    width: 600px   
  }
  .ab-right h4{
    font-size: 30px;
  }
  .ab-right h2{
    margin: 0 0 25px 0;
    font-size: 70px;
    font-weight: bolder;
  }
  .sctxt-title{
    /*margin-bottom: 5%;*/
  }
  .p-text{
   width: 597px; 
  }
  .p-text h5{
    margin-top: 5%;
    font-size: 28px;
    color: gray;
	  text-align: justify;
    line-height: 38px;
    letter-spacing: -1px;
    font-weight: 600;
  }
  .p-text h5 strong {
    color: white;
  }

  .ab-div{
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 0%;
  }
  .mws-text{
    text-align: center;
    color: white;
  }
  .mws-text h4{
    font-size: 32px;
    letter-spacing: -1px;
	position: relative;
    font-weight: 600;
    margin-bottom: 4%;
  }
  .mws-text h4::after{
	content: '';
    position: absolute;
    left: 50%;
	transform: translateX(-50%);
    bottom: -20px; /* 밑줄의 위치를 조정합니다 */
    width: 110px;
    height: 5px; /* 밑줄의 두께를 조정합니다 */
    background-color: #2568B1; /* 밑줄의 색상을 설정합니다 */
	
  }
  
  .mws-text h2{
    font-size: 60px;
    font-weight: bold;
  }
  .mws-text h2 small{
    font-size: 30px;
  }
  .mws-text h5 {
    color: gray;
    font-size: 28px;
    line-height: 38px;
    letter-spacing: -1px;
    font-weight: 600;
    margin-top: 4%;    
  }

  .mws-text h5 strong {
    color: white;
  }

  .mws-text-cnt {
    margin-top: 7%;
  }

  .hr-bd {
    border-right: 3px solid gray;
  }



  /* card css */

  .tile-card {
    text-align: left;
    margin-top: 8%;
    --background-color: #18181b;
    --text-color: #a1a1aa;
    --card-background-color: rgba(255, 255, 255, 0.015);
    --card-border-color: rgba(255, 255, 255, 0.1);
    --card-box-shadow-1: rgba(0, 0, 0, 0.05);
    --card-box-shadow-1-y: 3px;
    --card-box-shadow-1-blur: 6px;
    --card-box-shadow-2: rgba(0, 0, 0, 0.1);
    --card-box-shadow-2-y: 8px;
    --card-box-shadow-2-blur: 15px;
    --card-label-color: #fff;
    --card-icon-color: #d4d4d8;
    --card-icon-background-color: rgba(255, 255, 255, 0.08);
    --card-icon-border-color: rgba(255, 255, 255, 0.12);
    --card-shine-opacity: 0.1;
    --card-shine-gradient: conic-gradient(
      from 205deg at 50% 50%,
      rgba(33, 16, 185, 0) 0deg,
      #1900ff 25deg,
      rgba(52, 76, 211, 0.18) 295deg,
      rgba(33, 16, 185, 0) 360deg
    );
    --card-line-color: #2a2b2c;
    --card-tile-color: rgba(16, 19, 185, 0.05);
    --card-hover-border-color: rgba(255, 255, 255, 0.2);
    --card-hover-box-shadow-1: rgba(0, 0, 0, 0.04);
    --card-hover-box-shadow-1-y: 5px;
    --card-hover-box-shadow-1-blur: 10px;
    --card-hover-box-shadow-2: rgba(0, 0, 0, 0.3);
    --card-hover-box-shadow-2-y: 15px;
    --card-hover-box-shadow-2-blur: 25px;
    --card-hover-icon-color: #0004ff;
    --card-hover-icon-background-color: rgba(55, 52, 211, 0.1);
    --card-hover-icon-border-color: rgba(62, 52, 211, 0.2);
    --blur-opacity: 0.01;
  }
  .tile-card h3 {
    color: white;
    margin-left: 20px;
  }

  .tile-card.light {
    --background-color: #fafafa;
    --text-color: #52525b;
    --card-background-color: transparent;
    --card-border-color: rgba(24, 24, 27, 0.08);
    --card-box-shadow-1: rgba(24, 24, 27, 0.02);
    --card-box-shadow-1-y: 3px;
    --card-box-shadow-1-blur: 6px;
    --card-box-shadow-2: rgba(24, 24, 27, 0.04);
    --card-box-shadow-2-y: 2px;
    --card-box-shadow-2-blur: 7px;
    --card-label-color: #18181b;
    --card-icon-color: #18181b;
    --card-icon-background-color: rgba(24, 24, 27, 0.04);
    --card-icon-border-color: rgba(24, 24, 27, 0.1);
    --card-shine-opacity: 0.3;
    --card-shine-gradient: conic-gradient(
      from 225deg at 50% 50%,
      rgba(27, 16, 185, 0) 0deg,
      #4245fc 25deg,
      #edfaf6 285deg,
      #fff 345deg,
      rgba(19, 16, 185, 0) 360deg
    );
    --card-line-color: #e9e9e7;
    --card-tile-color: rgba(16, 185, 129, 0.08);
    --card-hover-border-color: rgba(24, 24, 27, 0.15);
    --card-hover-box-shadow-1: rgba(24, 24, 27, 0.05);
    --card-hover-box-shadow-1-y: 3px;
    --card-hover-box-shadow-1-blur: 6px;
    --card-hover-box-shadow-2: rgba(24, 24, 27, 0.1);
    --card-hover-box-shadow-2-y: 8px;
    --card-hover-box-shadow-2-blur: 15px;
    --card-hover-icon-color: #18181b;
    --card-hover-icon-background-color: rgba(24, 24, 27, 0.04);
    --card-hover-icon-border-color: rgba(24, 24, 27, 0.34);
    --blur-opacity: 0.1;
  }
  
  .tile-card .card {
    background-color: var(--background-color);
    box-shadow: 0px var(--card-box-shadow-1-y) var(--card-box-shadow-1-blur)
        var(--card-box-shadow-1),
      0px var(--card-box-shadow-2-y) var(--card-box-shadow-2-blur)
        var(--card-box-shadow-2),
      0 0 0 1px var(--card-border-color);
    padding: 16px 16px 16px 16px;
    border-radius: 15px;
    cursor: pointer;
    position: relative;
    transition: box-shadow 0.25s;
  }
  .tile-card .card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 15px;
    background-color: var(--card-background-color);
  }
  .tile-card .card .icon {
    z-index: 2;
    padding: 8px;
  }  
  .tile-card .card h4 {
    z-index: 2;
    position: relative;
    margin: 12px 0 4px 0;
    font-family: inherit;
    font-weight: 600;
    font-size: 14px;
    line-height: 2;

    color: var(--card-label-color);
  }

  .tile-card .card h3 {
    font-weight: 900;
  }

  .tile-card .card p {
    z-index: 2;
    position: relative;
    font-size: 17px;
    line-height: 1.7;
    color: white;
    width: 88%;
    margin-left: 20px;
    margin-top: 20px;
    letter-spacing: -0.5px;
    font-weight: 400;
  }
  .tile-card .card .shine {
    border-radius: inherit;
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.5s;
  }
  .tile-card .card .shine:before {
    content: "";
    width: 150%;
    padding-bottom: 150%;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    bottom: 55%;
    filter: blur(35px);
    opacity: var(--card-shine-opacity);
    transform: translateX(-50%);
    background-image: var(--card-shine-gradient);
  }
  .tile-card .card .tileback {
    border-radius: inherit;
    position: absolute;
    inset: 0;
    overflow: hidden;
    -webkit-mask-image: radial-gradient(
      circle at 60% 5%,
      black 0%,
      black 15%,
      transparent 60%
    );
    mask-image: radial-gradient(
      circle at 60% 5%,
      black 0%,
      black 15%,
      transparent 60%
    );
  }
  .tile-card .card .tileback .tiles {
    opacity: 0;
    transition: opacity 0.25s;
  }
  .tile-card .card .tileback .tiles .tile {
    position: absolute;
    background-color: var(--card-tile-color);
    animation-duration: 8s;
    animation-iteration-count: infinite;
    opacity: 0;
  }
  .tile-card .card .tileback .tiles .tile.tile-4,
  .tile-card .card .tileback .tiles .tile.tile-6,
  .tile-card .card .tileback .tiles .tile.tile-10 {
    animation-delay: -2s;
  }
  .tile-card .card .tileback .tiles .tile.tile-3,
  .tile-card .card .tileback .tiles .tile.tile-5,
  .tile-card .card .tileback .tiles .tile.tile-8 {
    animation-delay: -4s;
  }
  .tile-card .card .tileback .tiles .tile.tile-2,
  .tile-card .card .tileback .tiles .tile.tile-9 {
    animation-delay: -6s;
  }
  .tile-card .card .tileback .tiles .tile.tile-1 {
    top: 0;
    left: 0;
    height: 10%;
    width: 22.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-2 {
    top: 0;
    left: 22.5%;
    height: 10%;
    width: 27.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-3 {
    top: 0;
    left: 50%;
    height: 10%;
    width: 27.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-4 {
    top: 0;
    left: 77.5%;
    height: 10%;
    width: 22.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-5 {
    top: 10%;
    left: 0;
    height: 22.5%;
    width: 22.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-6 {
    top: 10%;
    left: 22.5%;
    height: 22.5%;
    width: 27.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-7 {
    top: 10%;
    left: 50%;
    height: 22.5%;
    width: 27.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-8 {
    top: 10%;
    left: 77.5%;
    height: 22.5%;
    width: 22.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-9 {
    top: 32.5%;
    left: 50%;
    height: 22.5%;
    width: 27.5%;
  }
  .tile-card .card .tileback .tiles .tile.tile-10 {
    top: 32.5%;
    left: 77.5%;
    height: 22.5%;
    width: 22.5%;
  }
  @keyframes tile {
    0%,
    12.5%,
    100% {
      opacity: 1;
    }
    25%,
    82.5% {
      opacity: 0;
    }
  }
  .tile-card .card .tileback .line {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.35s;
  }
  .tile-card .card .tileback .line:before,
  .tile-card .card .tileback .line:after {
    content: "";
    position: absolute;
    background-color: var(--card-line-color);
    transition: transform 0.35s;
  }
  .tile-card .card .tileback .line:before {
    left: 0;
    right: 0;
    height: 1px;
    transform-origin: 0 50%;
    transform: scaleX(0);
  }
  .tile-card .card .tileback .line:after {
    top: 0;
    bottom: 0;
    width: 1px;
    transform-origin: 50% 0;
    transform: scaleY(0);
  }
  .tile-card .card .tileback .line.line-1:before {
    top: 10%;
  }
  .tile-card .card .tileback .line.line-1:after {
    left: 22.5%;
  }
  .tile-card .card .tileback .line.line-1:before,
  .tile-card .card .tileback .line.line-1:after {
    transition-delay: 0.3s;
  }
  .tile-card .card .tileback .line.line-2:before {
    top: 32.5%;
  }
  .tile-card .card .tileback .line.line-2:after {
    left: 50%;
  }
  .tile-card .card .tileback .line.line-2:before,
  .tile-card .card .tileback .line.line-2:after {
    transition-delay: 0.15s;
  }
  .tile-card .card .tileback .line.line-3:before {
    top: 55%;
  }
  .tile-card .card .tileback .line.line-3:after {
    right: 22.5%;
  }
  .tile-card .card:hover {
    box-shadow: 0px 3px 6px var(--card-hover-box-shadow-1),
      0px var(--card-hover-box-shadow-2-y) var(--card-hover-box-shadow-2-blur)
        var(--card-hover-box-shadow-2),
      0 0 0 1px var(--card-hover-border-color);
  }
  .tile-card .card:hover .icon::after {
    background-color: var(--card-hover-icon-background-color);
    border-color: var(--card-hover-icon-border-color);
  }
  .tile-card .card:hover .icon svg {
    color: var(--card-hover-icon-color);
  }
  .tile-card .card:hover .shine {
    opacity: 1;
    transition-duration: 0.5s;
    transition-delay: 0s;
  }
  .tile-card .card:hover .tileback .tiles {
    opacity: 1;
    transition-delay: 0.25s;
  }
  .tile-card .card:hover .tileback .tiles .tile {
    animation-name: tile;
  }
  .tile-card .card:hover .tileback .line {
    opacity: 1;
    transition-duration: 0.15s;
  }
  .tile-card .card:hover .tileback .line:before {
    transform: scaleX(1);
  }
  .tile-card .card:hover .tileback .line:after {
    transform: scaleY(1);
  }
  .tile-card .card:hover .tileback .line.line-1:before,
  .tile-card .card:hover .tileback .line.line-1:after {
    transition-delay: 0s;
  }
  .tile-card .card:hover .tileback .line.line-2:before,
  .tile-card .card:hover .tileback .line.line-2:after {
    transition-delay: 0.15s;
  }
  .tile-card .card:hover .tileback .line.line-3:before,
  .tile-card .card:hover .tileback .line.line-3:after {
    transition-delay: 0.3s;
  }

  .num-flag{
    color:white;
    text-align: right;
  }

  .circle-icon{
    color: white;
  }  
  .card-top{
	margin-top: 5%;
    margin-bottom: 20%;
  }
  .con-bg-area{
    height: 100vh;
    background-image: url("/images/front_img/con_bg.jpg");
    background-size: cover;
    color: white;
    margin-top: 120px;
  }
  .con-bg-left{
    width: 75%;
    height: 100vh;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
  }
  .con-bg-text{
    width: 60%;
    text-align: start;
    color: gray;
  }

  .con-bg-text h2{
    font-size: 90px;
    font-weight: 900;
    text-shadow: -1px -1px 1px #9c9c9c, 1px 1px 1px #000;
    color: #000000;
    opacity: 0.5;
  }

  .con-bg-text p{
    margin-top: 100px;
    font-size: 32px;
    text-shadow: -1px -1px 1px #9c9c9c, 1px 1px 1px #000;
    color: #000000;
    opacity: 0.5;
  }


  #main{
    background-color: #000000;
  }

  .glass-box{
    background: rgb(114, 114, 114);
    /* background: linear-gradient(to bottom right, #aaaaaa69, #24242475); */
    /* box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.4), -2px -2px 13px 1px rgba(53, 52, 52, 0.753), 0px -3px 0px 0px rgba(0,0,0,0.2) inset; */
    border-radius: 10px; 
    width: 100%;
  }

  .input-box-white{
    background: rgb(255, 255, 255);
    border-radius: 10px; 
    width: 100%;    
  }


  .glass-box-contact{
    background: rgb(114, 114, 114);
    /* background: linear-gradient(to bottom right, #aaaaaa69, #24242475); */
    /* box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.4), -2px -2px 13px 1px rgba(53, 52, 52, 0.753), 0px -3px 0px 0px rgba(0,0,0,0.2) inset; */
    border-radius: 10px; 
    margin-top: 15px;
  }

  .glass-box-contact p{
    font-size: 20px;
    margin: 12px 0  12px 0 ;
	color: white;
  }

  .con_call{
    width:48%;
    margin-left: 2%;
  }


  .contact-right{
    color: white;
    /* margin-left: 50px; */
    height: 100%;
    width: 30%;
  }



  .contact-right-tx h2{
    font-size: 32px;
    font-weight: bolder;
    margin: 30px 0px 30px 20px;
  }
  .contact-right-tx p{
    font-size: 32px;
  }
  .contact-right i{
    font-size: 40px;
    
  }
  .contact-right .row{
    margin-left: 15px;
  }
    
  
  .gl-inp{
    width: 100%;
    height: 70px;
    padding-left: 25px;
    margin-bottom: 17.5px;
    color: black;
    font-size: 20px;
  }
  .gl-tx{
    width: 100%;
    color: black;
    border-radius: 10px;
    padding-left: 25px;
    padding-top: 15px;
    height: 260px;
    resize: none;
    font-size: 20px;
  }

  .gl-inp::placeholder{
    color: rgba(41, 41, 41, 0.5);
    font-size: 17px;
  }
  .gl-tx::placeholder{
    color: rgba(41, 41, 41, 0.5);
    font-size: 17px;
  }
  /* .gl-inp-title{
    font-size: 15px;
    width: 585px;
    height: 70px;
    padding-left: 15px;
    margin-bottom: 20px;
    color: white;    
  } */

  .gl-inp-select{
	font-size: 17px;
	width: 250px;
	height: 70px;
	padding-left: 15px;
	margin-bottom: 20px;
	color: rgba(41, 41, 41, 0.5);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDE0IDgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEgMUw3IDcgMTMgMSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBmaWxsPSJub25lIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L3N2Zz4='); /* Change this to the appropriate arrow icon */
    background-repeat: no-repeat;
    background-position: right 15px center;
  }
  .gl-inp-select option{
    color: black;
    background: linear-gradient(to bottom right, #aaaaaa69, #24242475);
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.4), -2px -2px 13px 1px rgba(53, 52, 52, 0.753), 0px -3px 0px 0px rgba(0,0,0,0.2) inset;
    border-radius: 40px; 
  }
  
  .con-map{
    border-radius: 20px;
  }

  .con-sub-btn{
    font-size: 27px;
    transition-duration: 0.4s;
    /* background-image: linear-gradient(to right, #3597ffc9 0%, #ffffffa1  51%, #2569b1  100%); */
    background-color: #4e7bbd;
    text-align: center;
    color: white;            
    /*border-radius: 10px;*/
    height: 54px;
    width: 25%;   
    margin-top: 1%;
  }
  .con-sub-btn:hover {
    /* background-position: right center;  */
    background-color: #3089e7;
    text-decoration: none;  
  }  

input, textarea {border:0;outline:0;}
input:focus  textarea:focus {outline:none!important;}


/* scroll style */
html::-webkit-scrollbar {
  width: 5px !important; 
}
html::-webkit-scrollbar-thumb {
  background-color: #2f3542 !important;
  border-radius: 10px !important;
  background-clip: padding-box !important;
  border: 2px solid transparent !important;
}
html::-webkit-scrollbar-track {
  background-color: grey !important;
  border-radius: 10px !important;
  box-shadow: inset 0px 0px 5px white !important;
}

.news-container{
  background-color: rgb(90, 90, 90);
  width: 1294px;
  border-radius: 15px;
  text-align: center;
  height: 750px;
}

.news-container h2, p{
  margin-bottom: 10px;
}


.news-container h2{
  font-size: 90px;
  font-weight: bolder;
  color: white;
}

.news-container p{
  margin-top: 2%;
  margin-bottom: 2%;
  font-size: 40px;
  line-height: 1.2;
  font-weight: 500;
  color: white;
}

.news-icon{
  margin: 3% 0 0 0;
  width: 20%;
}

.news-div{
  min-height: 600px;
}
.news-box{
  color: white;
  margin-top: 10%;
  height: 500px;
}


.news-box p{
  font-size: 30px;
}
.news-sub{
  margin-top: 5%;
}
.news-sub-email {
  color: black;
  padding-left: 30px;
  font-size: 25px;
  height: 47px;
  width: 100%;
  border-radius: 10px;
  font-size: 20px;
}
.news-sub-btn{
  background-color: #4e7bbd;
  font-size: 27px;
  transition-duration: 0.4s;
  /* background-image: linear-gradient(to right, #3597ffc9 0%, #ffffffa1  51%, #2569b1  100%); */
  text-align: center;
  color: white;            
  /* border-radius: 10px; */
  height: 47px;
  width: 100%;  
}
.bottom-info-area{
  color: white;
  text-align: center;
}

.bottom-info-area h2{
  font-weight: 700 !important;
  font-size: 50px;
  line-height: 250%;
}

.bottom-info-area h4{
  font-size: 32px;
  font-weight: 600;
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-100% - var(--gap)));
  }
}

.ref-number{
  margin-top: 1%;
  margin-bottom: 3%;
  text-align: left;
  line-height: 1.2;
  padding-left: 0px;
  width: 1285px;
}

.ref-number p{
  text-indent : -20px;
  padding-left: 20px;  
  font-size: 13px;
  margin-bottom: 0;
  letter-spacing: 0.5px;
}

.ref-number .col-md-8{
  margin-bottom: 170px;
}

.moving-obj-3{
  opacity: 0;
  transition  : all 0.3s ease-in;
  border-radius: 15px;
}

.moving-obj-5{
  opacity: 0;
  transition  : all 0.5s ease-in;
}


  @media screen and (min-width: 2500px) {

    .con-bg-text h2{
      font-size: 120px;
    }
    .con-bg-text p{
      font-size: 41px;
    }
    .portfolio #portfolio-flters li{
      width: 200px;
      font-size: 30px;
    }
    .portfolio .portfolio-item {
      width: 440px;
    }
    .news-div{
      height: 50vh;
    }

    .card-container{
      margin-left: 19%;
    }
  }
  
  /* 4k */
  /*
  @media screen and (min-width: 3200px) {
    .ab-div{
      margin-top: 300px;
      margin-bottom: 120px;
    }
  }
  */

/* mobile */
@media (max-width: 991px) {
  .card-container{
    margin-left: 0;
  }
  .pross-slider__card{
    width: 100% !important;
  }
  .next{
    right: 5%;
  }
  .bg-shape{
    display: none;
  }
  .con-map{
    width: 405px !important;
  }
  .gl-inp-title {
    margin-left: 0;
    width: 100%;
  }
  .gl-inp {
    width: 100%;
  }
  .gl-tx{
    width: 100%;
  }

  .contact-right-tx h2{
    font-size: 30px;
    margin-bottom: 0;
  }  
  .contact-right-tx p{
    font-size: 18px;
    margin-bottom: 15px;
  }
  .con-sub-btn{
    width: 100%;
    font-size: 20px;
  }
}
.hover-a {
  cursor: pointer;
  position: absolute;
  right: 20px;
  font-size: 24px;
  top: calc(50% - 18px);
  color: rgba(255, 255, 255, 0.7);
  transition: ease-in-out 0.3s;
}



.portfolio-item{
  width: 33.3%;
  height: 320px;
  overflow: hidden;
  position: relative;
}

.img-fluid{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  position: relative;
  transition: transform 0.3s ease-in-out;
}

.swal2-confirm{
  background-color: #2569b1 !important;
}

.swal-wide{
  width:850px !important;
}



.swhtml .img{
  width: 300px;
}
.swal2-html-container {
  text-align: justify !important;
}

.swal2-popup {
  display: grid !important;
}


.sidebar-menu {
  display: none;
}

.pr-0{
    padding-right: 0rem !important;
}

.pr-1{
    padding-right: .25rem !important;
}

.pr-2{
    padding-right: .5rem !important;
}

.pr-3{
    padding-right: .75rem !important;
}

.pr-4{
    padding-right: 1rem !important;
}

.pr-5{
    padding-right: 1.25rem !important;
}

.pr-6{
    padding-left: 24px;;
    padding-right: 1.5rem !important;
}

.pl-0{
    padding-left: 0rem !important;
}

.pl-1{
    padding-left: .25rem !important;
}

.pl-2{
    padding-left: .5rem !important;
}

.pl-3{
    padding-left: .75rem !important;
}

.pl-4{
    padding-left: 1rem !important;
}

.pl-5{
    padding-left: 1.25rem !important;
}

.pl-6{
    padding-left: 1.5rem !important;
}



/* 구독 박스 */
.sub_chk_container {
  display: flex;
  text-align: center;
  margin-bottom: 10px;
}

.chk_pitem{
  text-align: right;
  font-size: 20px;
}
.chk_pitem a{
  text-decoration: none;
  color: white;
}
.chk_pitem a:hover{
  text-decoration: none;
  color: #2c7dd4;
}
.chk_aitem{
  text-align: left;
  font-size: 20px;
}
.chk_aitem a{
  text-decoration: none;
  color: white;
}
.chk_aitem a:hover{
  text-decoration: none;
  color: #2c7dd4;
}


.sub_chk_item input {
  margin-right: 5px;
}


.sc03-video {
  width: 100%;
  height: 100%;
  margin-left: 8%;
  border-radius: 20px;
  overflow: hidden; /* 중요: iframe 밖 나가는 거 잘라냄 */
  position: relative; /* 필요 시 */
}

.sc03-video iframe {
  width: 100%;
  height: 100%;
  border: none;
  
}

.vp-center{
  width: 100%;
}


.i4by4{
  width: 100%;
  height: 100%;
  border-radius: 15px;
}
.i4by4div .col-md-6{
  padding: 5px !important;
}

.i4by4wd{
  padding-left: 34px;
  width: 644px;
  padding-right: 30px;
}

.more-info-btn{
  margin: 2% 0 5% 0;
  width: 455px;
  font-size: 20px;
  font-weight: 700;
  background-color: #4e7bbd;
}

.download-info-book {
  margin: 5% 0 0 0;
  width: 50%;
  font-size: 20px;
  font-weight: 700;
  background-color: #4e7bbd;
}
.dwld-icon{
  font-weight: blod;
}
.more-info-btn .i{
  font-size: 10px;
}
.ft_icon {
  text-align: right;
}
.ft_icon img{
  width:193px;
}
.sns-icon-container img{
  width: 30px;
  margin-bottom: 3%;
}

.last-hr hr{
  border: 1px solid white;
  border-radius: 20%;
  opacity: 1;
  margin: auto;
  text-align: center;
}




#policy {
  background-color: #000;
}
.policy-text-title{
  background-color: #000;
  color: white;
  font-weight: 900;
  text-align: center;
  margin-top: 5%;
}
.policy-text-title h2{
  font-size: 70px;
}
.policy-text-title h3{
  font-size: 50px;
}

.policy-text-detail{
  text-align: left;
  margin-top: 5%;
  font-weight: 500;
}
.policy-text-detail h5{
  font-size: 32px;
  margin-top: 7%;
  margin-bottom: 2%;
}
.policy-text-detail p{
  font-size: 15px;
}

.text-indent{
  margin-left: 1%;
  margin-bottom: 0%;
}

.text-indented{
  margin-left: 1%;
  margin-bottom: 1%;
}
.p-bt-margin-0{
  margin-bottom: 0%;
}
policy-home-container {
  text-align: center;
}

.policy-home-btn{
  margin: 2% 0 5% 0;
  font-size: 20px;
  transition-duration: 0.4s;
  background-color: #2569b1;
  text-align: center;
  color: white;                   
  border-radius: 10px;
  width: 25%; 
}
.foot-bottom-txt p{
  margin-bottom: 0;
  line-height: 27px;
}

.portfolio-container{
	min-height: 350px;
}
.ci_kict_svg img{
  /*margin-top: 5%;*/
  width: 580px;
}

.ref-info-hr {
  border: 1px solid white;
  border-radius: 20%;
  opacity: 1;
  max-width: 1285px;
  margin: auto;
  text-align: center;  
}
     
.con-right-area{
  padding-right: 0px;
}

.ck-sizing{
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

.sub-input-layout{
  margin-top: 3%;
  margin-bottom: 3%;
}

#about-mws{
  /*padding-bottom: 0;*/
}
#pross-mws{
  /*padding-top: 0;*/
}
.sc05-icon{
  width: 60px;
}



/* footer layout */
.left-right-containe{
  display: flex;
  justify-content: space-between;
}
.ft-right-btn{
  text-align: right;
}


.footer-info-p{
  padding-left: 0px;
}

.left-right-container{
  margin-top: 10px;
}

.ft-right-btn a{
  font-size: 9px;
  text-decoration: none;
  color: white;
}

.ft-info-p {
  /* padding-left: 0px; */
}

.ft-info-p-left {
  max-width: 160px !important;
}

.ft-info-p-left {
  font-weight: bold !important;
  font-size: 18px;
}

.ft-info-p-right p{
  font-weight: 100 !important;
  font-size: 18px;
  
}

.ft-info-icon{
  text-align: right;
  margin-top: 23px;
}

.con-subject{
  padding-left: 0px;
}

.ab-left{
  padding-left: 12px;
}
.scp-txt-width{
  width: 621px !important;
}
.pc_card_index{
	display: black;
}
.m_card_index{
	display: none;
}

.mobile-temp{
  /*margin: 0;*/
  /*padding: 0;*/
  background-color: black;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  /*font-family: Arial, sans-serif;*/
}
/* .mobile-temp img{
margin-top: 25%;
width: 50%;
} */

/* tab horizontal */
@media (min-width: 992px) and (max-width: 1199px) {
     
}



.root_daum_roughmap{
	width: 100% !important;
}

/* tab horizontal */ 
@media (min-width: 1200px) and (max-width: 1399px) { 
	#hero h1 {
		font-size: 90px;
	}
	
	#hero h2 {
		font-size: 60px;
	}

	.ab-right-txt{ 
		width : 550px; 
	}
	
	.ab-right h2{
		font-size: 60px;
	}
	
	.ab-right h4{
	    font-size: 35px;
	}
	
	.ab-right-txt2{
		width : 550px; 
	    margin-left: 10px;
	}
	
	#about-floor .ab-left .container-fluid{
		padding-right:0;
	}
	
	.ab-03 img {
		width: 210px;
		height: 100%;
	}
	
	.sctxt-title {
		margin-bottom: 2%;
	}
	
	.i4by4wd{
		width : 572px; 
	}

	.scp-txt-width{
		width : 533px !important; 
	}
	.p-text h5{
		width : 533px !important; 
		font-size: 26px;
	}
	
	.tile-card .card h3{
		font-size: 1.45rem;
	}
	
	.tile-card .card p {
		font-size: 16px;
	}
	
	.card-top {
		margin-bottom: 20%;
		padding-top:5%;
	}
	
	.pross-slider__card {
		width: 853px;
	}
	
	.next {
		right: -9.2%;
	}
	
	.gl-inp{
		/*margin-bottom: 22px;*/
		height: 50px;
	}
	
	.gl-inp-select{
		width: 100%;
		height: 50px;
		margin-bottom: 10px;
	}
	
	.glass-box-contact p {
		color: white;
		font-size: 17px;
	}
	
	.news-container{
		height: 650px;
	}
	
	.news-container h2{
		color: white;
		font-size : 70px;
	}
	
	.news-container p{
		color: white;
		font-size : 35px;
	}
	
	.ref-number{
		width: 1114px;
	}
	
	.ref-info-hr{
		max-width:1114px;
	}
	
	.news-container{
		width: 1114px;
	}
	
	.pross-ctr{
		/*margin-top: 20px;*/
	}
	
	.chk_pitem {
		font-size:17px;
	}
	
	.chk_aitem{
		font-size:17px;
	}
	
	.ck-sizing {
		width: 17px;
		height: 17px;
	}
}


/* tab horizontal */ 
@media (min-width: 992px) and (max-width: 1199px) { 
	#hero h1 {
		font-size: 90px;
	}
	
	#hero h2 {
		font-size: 60px;
	}

	.ab-right-txt{ 
		width : 478px; 
	}
	
	.ab-right h2{
		font-size: 50px;
	}
	
	.ab-right h4{
	    font-size: 30px;
	}
	
	.ab-right-txt2{
		width : 480px; 
	    margin-left: 10px;
	}
	
	#about-floor .ab-left .container-fluid{
		padding-right:0;
	}
	
	.ab-03 img {
		width: 175px;
		height: 100%;
	}
	
	.sctxt-title {
		margin-bottom: 0%;
	}
	
	.i4by4wd{
		width : 485px; 
	}

	.scp-txt-width{
		width : 441px !important; 
	}
	.p-text h5{
		width : 441px !important; 
		font-size: 22px;
		line-height: 36px;
		margin-top: 0;
	}
	
	.tile-card .card h3{
		font-size: 1.2rem;
	}
	
	.tile-card .card p{
		line-height: 1.4;
	}
	
	.card-top {
		margin-bottom: 20%;
		padding-top:10%;
	}
	
	.pross-slider__title h3 {
		font-size: 40px;
	}
	
	.pross-right-txt h5 {
		font-size: 24px;
	}
	
	.pross-ctr {
		margin-top: 20px;
	}
	
	.pross-slider__content {
		padding-left : 0px;
	}
	
	.pross-slider__card {
		width: 753px;
	}
	
	.prev {
		left: -46%;
	}
	
	.next {
		right: -2.8%;
	}
	
	.gl-inp{
		/*margin-bottom: 22px;*/
		height: 50px;
	}
	
	.gl-inp-select{
		width: 100%;
		height: 50px;
		margin-bottom: 10px;
	}
	
	.glass-box-contact p {
		font-size: 17px;
		color: white;
	}
	
	.news-container{
		height: 650px;
	}
	
	.news-container h2{
		font-size : 70px;
		color: white;
	}
	
	.news-container p{
		font-size : 35px;
		color: white;
	}
	
	.ref-number{
		width: 935px;
	}
	
	.ref-info-hr{
		max-width:935px;
	}
	
	.news-container{
		width: 935px;
	}
	
	.chk_pitem {
		font-size:16px;
	}
	
	.chk_aitem{
		font-size:16px;
	}
	
	.ck-sizing {
		width: 16px;
		height: 16px;
	}
}


/* Mobile */
/* @media (min-width: 992px) and (max-width: 991px) { */
/* } */

@media (max-width: 991px){
	

  .mobile-temp{
    display: block !important;
  } 
  .pc-viewer{
    display:none !important;
  }

  #header .logo{
    /*padding-left: 20px;*/
  }
  .bi-list::before {
    /*padding-right: 20px;*/
  }

  #hero h2{
    font-size: 24px;
    font-weight: 600;
  }
  #hero h1{
    font-size: 32px;
    font-weight: 600;
  }
  .sctxt-title{
    text-align: left;
  }

  .mobile-temp h2{
    text-align: left;
  }

  .ab-right-txt{
    margin-top:30px;
  }

  .mb-1by2img{
    padding-left: 30px;
    padding-right: 30px;
  }
  
  .mb-falut-img img {
    width: 100%; 
	box-sizing: border-box;
  }

  .mb-falut-img div{
	/*
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 30px;
	*/
    padding-left: 10px;
    padding-right: 10px;
  }
  
  .falut-end-img1{
	width: calc(100% - 10px) !important;
  }
  
  .falut-end-img2{
  	width: calc(100% - 10px) !important;
  }
  
  .falut-end-img3{
  	width: calc(100% - 10px) !important;
  	margin-top:20px;
  }

  .ab-right h4 {
    font-size: 22px;
    letter-spacing: -1px;
  }
  .ab-right h2 {
    font-size: 40px;
  }

  .scp-txt-width{
    padding-right: 10%;
  }
  .ab-right-txt{
	width:100%;
	margin-left: auto;
  }
  .ab-4by4-txt{
    padding-left: 38px;
    padding-right: 38px;
    width: 100% !important;
  }
  .p-text{
    width: 100%;
  }
  .video-div{
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
  }
  
  .img-div{
	  /*height: calc(100% * (2/3)) !important;*/
  }
  
  .sc03-video{
    padding: 0 3px 0 3px;
	object-fit: cover;
	object-position: center;	
  }
  .ab-right h4{
    font-weight: 500;
    padding-top: 25px;
  }
  .ab-right h5{
    font-size: 18px;
    line-height: 25px;
  }
  .section-title h2{
    font-size: 45px;
    padding-bottom: 5%;
  }
  .section-title-top h2{
    text-align: center;
    font-size: 45px;
    font-weight: 900;
    color: white;
  }  
  .ab-div{
	 /*
    margin: 50px 0 50px 0;
	*/
  }
  
  .mws-text{
	/*
    padding-left: 38px;
    padding-right: 23px;
	*/
  }
  .mws-text h4{
    font-size: 26px;
    margin-bottom: 35px;
  }
  .mws-text h2{
    font-size: 30px;
  }
  .mws-text h5{
    font-size: 15px;
    line-height: 25px;
  }  
  .cnt-mobile h2{
    font-size: 50px;
    line-height: 50px;
    padding-bottom: 18px;
  }
  .cnt-mobile h2 small{
    font-size: 50px;
  }
  .hr-bd {
    border-right: 0px;
  }
  .cnt-mobile{
    width: 50%;
    padding: 0;
  }

  cntvtxt{
    font-size: 15px;
  }
  .tile-card{
    margin-top:0px;
    margin-bottom: 15px;
  }
  .card-top{
    margin-bottom: 25px;
  }

  .card-top .col-md-6{
    width: 50%;
  }
  .card-top h1{
    margin-top: 15px;
    font-weight: 700;
  }

  .tile-card .card p {
    line-height: 25px;
  }
  .tile-card .card {
    width: 100%;
    margin-bottom: 20px;
  }

  .pross-slider__title h5{
    font-size: 20px;
    font-weight: 300;
  }
  .pross-slider__title h3{
    margin-top: 15px;
    font-size: 35px;
    font-weight: 900;
  }

  .h-slider{
    height: 50%;
  }

  .pross-slider{
    height: 100%;
  }
  #pross-mws{
	/*
    padding: 0px;
	padding-top: 80px;
    margin-bottom: 150px;
	*/
  }
  
  #pross-mws .hr-vertical{
	margin-right:0px;
  }
  
  .pross-slider{
    margin-top: 0px;
  }
  .pross-img{
    width: 100%;
    height: 0;
	
	left: 0;
	transform: none;
	
  }
  
  .pross-img__item{
  /*
    padding-left: 25%;
    padding-bottom: 25%;
	*/
	width: 100%;
	text-align: center;
	transform: none;
	display: block;
	
  }
  .pross-img__item.active{
	transform: translateY(-55%);
  }
  
  .pross-img__item img{
    width: 10%;
    margin-bottom: 0px;
	margin-left: 0px;
	max-height:230px;
  }

  .pross-slider__content{
    margin: 0;
    padding-top: 50px;
    height: 50%;
  }

  .i4by4wd{
    width: 100%;
	
    padding-left: 3px;
    padding-right: 3px;
	
  }
  .i4by4{
    /*
    width: 95%;
	*/
  }
  /*
  .i4by4div .col-md-3{
    width: 50%;
    padding: 0 0 9px 0;
  }
  */
  .i4by4div{
	padding-top: 20px;
  }
  
  .mb-footer-top{
    display: block !important;
  }
  .footer-top{
    display:none !important;
  }
  .ft_icon {
    /*width: 50%;*/
	/*padding-right: 0px;*/
  }
  .ft_icon img{
    width: 110px;
  }
  .mb_nwcorp{
    /*
	width: 50%;
    padding: 0;
	*/
  }
  .mb_nwcorp h5{
    font-size: 16px;
    padding-top: 3px;
  }
  .mb-address-info{
	/*padding: 0 34px 0 34px;*/
    margin-top: 5%;
  }
  .mb-address-info p{
    /**/
    font-size: 10px;
    line-height: 10px;
  }
  .mb-icon-container img{
    width: 20px;
  }
  .mbftinfo-right{
    text-align: right;
    width: 50%;
  }
  .mbftinfo-right img{
    margin-left: 1%;
    margin-bottom: 10%;
  }
  .no-tel-link {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  .download-info-book{
    /*width: 200px;*/
	width: 45% !important;
    font-size: 15px;
  }
  .pross-slider {
    margin-bottom: 0px;
  }
  .portfolio{
    padding: 0px;
  }

  #portfolio-flters{
    width: 100%;
  }
  .portfolio #portfolio-flters li{
    margin-top: 15px;
    font-size: 13px;
    width: 15%;
    padding-left: 0px;
    padding-right: 0px;
  }
  .portfolio .portfolio-item{
    width: 100%;
    /*padding: 0px 35px 0px 35px;*/
	padding: none;
    margin-bottom: 20px;
  }
  
  .portfolio .portfolio-item .portfolio-info{
    /*
    margin-left: 25px;
    margin-right: 25px;
	*/
  }

  .contact-pd{
    /*padding: 0 4px 0 4px;*/
  }
  .con-map{
    width: 100% !important;
  }
  .con_email{
    /*width: 49%;*/
  }
  .con_call {
    margin-left: 2%;
  }
  .glass-box-contact p{
    font-size: 11px;
  }
  .con-right-area{
    margin-top: 10px;
  }
  .gl-inp{
    height: 40px;
    margin-bottom: 10px;
    font-size: 11px;
    padding-left: 10px;
  }
  .gl-inp-select{
    width: 100%;
    padding: 0 0 0 10px;
    height: 40px;
    margin-bottom: 10px;
    font-size: 11px;
    color: black;
  }
  .mb-select{
    padding-left: 0px !important;
    text-align: center;
  }
  .con-sub-btn{
    height: 80%;
    width: 45% !important;
    /*padding-bottom: 12px;*/
    font-size: 16px;
    font-weight: 500;
  }
  .glass-box-contact{
    margin-top: 10px;
  }
  .m-news-container{
    width: 100%;
    /*height: 450px;*/
    background-color: rgb(114, 114, 114);
    border-radius: 15px;
    /*margin-left: 34px;*/
    text-align: center !important;
    padding: 50px 0;
  }
  .m-news-container h3{
    font-size: 20px;
    font-weight: 600;
    margin-top: 30px;
  }
  .m-news-container p{
    margin-top: 15px;
    font-size: 13px;
    font-weight: 600;
  }  
  .news-icon{
    width: 35%;
	margin: 0;
	max-width: 230px;
  }
  .m-news-lines{
	max-width:330px;
  }
  .m-news-sub-email{
    height: 35px;
    padding: 0 10px 0 20px;
    border-radius: 5px;
    width: 85%;
    font-size: 12px;
    margin-bottom: 2%;
  }
  .m-news-sub-email::placeholder{
    font-size: 12px;
  }
  .outer-container{
	width:100%;
	display: flex;
    justify-content: center; /* 수평 중앙 정렬 */
  }
  .sub_chk_container{
    display: block;
  }
  .chk_pitem{
    text-align: left;
    font-size: 10px;
    font-weight: 600;
    margin-top: 10px;
  }
  .chk_aitem{
    text-align: left;
    font-size: 10px;
    font-weight: 600;
    margin-top: 10px;
  }
  .ck-sizing {
    width: 12px;
    height: 12px;
  }
  .news-sub-btn{
    width: 50%;
    height: 80%;
    font-size: 15px;
    font-weight: 600;
    margin-top: 3%;
  }  
  .ci_kict_svg img{
    width: 180px;
  }
  .bottom-info-area h2{
    font-size:21px;
  }
  .bottom-info-area h4{
    font-size:13px;
    font-weight: 500;
  }
  .more-info-btn{
    width: 42%;
    height: 80%;
    font-size: 15px;
    margin: 10% 0 10% 0;
  } 
  #smart-con{
    /*padding-top: 0;*/
  } 
  .ref-info-hr{
    width: 100%;
  }
  .ref-number{
    margin-top: 5%;
    width: 100%;
  }
  .ref-number p{
    font-size: 7px;
    text-indent: -14px;
  }
  .site-info{
    /*padding: 0 34px 0 34px;*/
  }
  .site-info p{
    font-size: 10px;
    line-height: 10px;
  } 
  .gl-tx{
    padding-left: 10px;
    font-size: 11px;
  } 
  .gl-tx::placeholder{
    font-size: 11px;
  }
  .pross-right-txt h5{
    font-size: 20px;
    font-weight: 300;
  }
  .card_index_no h4{
    font-size: 13px
  }
  .next, .prev{
    margin-top: -65px;
    width: 47px;
    height: 47px;
  }
  .pros-icon {
    width: 15px;
  }
  .pross-slider__cover{
    /*height: 440px;*/
  }
  .pross-slider__content{
    padding: 15% 5% 0 5%;
  }
  .pross-ctr {
	margin-top: 10px;
  }
  
  .pross-slider {
    width: 100%;
    /*padding-top: 80px;*/
  }
  #pross-mws .content {
	min-height: 0;
  }
  
  #pross-mws .wrapper {
    min-height: 0;
  }
  
  .h-slider{
    height: 650px;
  }
  /*
  .falut-end-img1{
    height: 102%;
  }
  .falut-end-img2{
    height: 107%;
  }
  */
  .tile-card .card .tileback{
	padding-left:3px;
	padding-right:3px;
  }
  
  .tile-card h3 {
	font-size: calc(1.0rem + .2vw);
  }
  
  .p-text h5 {
    width: 100% !important;
	padding-left:3px;
	padding-right:3px;	
  }
  
  .c-marginout {
	padding-left:5px;
	padding-right:5px;	
  }
  
  .tile-card h3 {
	margin-left: 15px;  
  }
  
  .tile-card .card p {
	margin-left: 15px;
	width:85%;
  }
  
  .tile-card .card .icon {
	padding: 2px;
	padding-top: 5px;
  }
  .pc_card_index{
	display: none;
  }
  .m_card_index{
 	display: block;
  }
  
  .mws-text h4::after{
	width: 90px;	
  }
  
  .gl-inp::placeholder{
    font-size: 11px;
  }
  .gl-tx::placeholder{
    font-size: 11px;
  }  
  .contact-top{
	margin-top:0px;
  }

  .tile-card .row>*:nth-child(odd){
	padding-right: calc(var(--bs-gutter-x)* .4);
  }

  .tile-card .row>*:nth-child(even){
	padding-left: calc(var(--bs-gutter-x)* .4);
  }
  
  .i4by4wd .row>*:nth-child(odd){
	padding-right: calc(var(--bs-gutter-x)* .4);
  }

  .i4by4wd .row>*:nth-child(even){
	padding-left: calc(var(--bs-gutter-x)* .4);
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .tablet-out{
	padding:0 60px;
  }

  .tile-card .row>*:nth-child(odd){
	padding-left: 0;
  }

  .tile-card .row>*:nth-child(even){
	padding-right: 0;
  }
}

@media (max-width: 767px) {
  .tablet-out2{
	padding:0 4px;
  }
  
  .ref-number p {
    text-indent: -6px;
  }
}

/* small mobile size (12pro, Galaxy s, etc) */
@media (max-width: 390px){
  .pross-img__item{
  	/*
    padding-left: 25%;
    padding-bottom: 35%;
	*/
  }

  .next, .prev{
    margin-top: -110px;
  }

  .m-news-container{

  }

}

.navbar-mobile ul {
	bottom:auto;
	left:auto;
	/*background: rgba(55, 55, 55, 0.7);*/
}

/*
@media (min-width: 992px) {
    .container, .container-lg, .container-md, .container-sm {
        max-width: 960px;
    }
}
*/

.counts{

}

/* 폰트 재정의 */
/* PC 메뉴 헤더 */
.navbar a, .navbar a:focus{
	font-size: 18px;
}

/* 영상 섹션 윗 글씨 */
#hero h2 {
	font-size: 60px;
}

/* 영상 섹션 아래 글씨 */
#hero h1 {
    font-size: 90px;
}

/* 설명 섹션 윗 글씨 */
.ab-right h4 {
	font-size: 40px;
}

/* 설명 섹션 제목 */
.ab-right h2 {
    font-size: 75px;
	margin: 0 0 0 0;
}

/* 설명 섹션 내용 */
.p-text h5 {
	font-size: 30px;
	line-height: 40px;
}

/* MWS 놀라운 가능성의 시작 MWS 부분 */
.mws-text h4 {
    font-size: 55px;
    letter-spacing: -1px;
    font-weight: 600;
}

.mws-text h4::after {
	width: 220px;
	bottom: -27px;
}

/* MWS 타이틀 */
.mws-text h2 {
    font-size: 75px;
    font-weight: bold;
}

/* MWS 내용 */
.mws-text h5 {
    font-size: 30px;
    line-height: 38px;
    letter-spacing: -1px;
    font-weight: 600;
}

/* MWS %숫자부분 */
.cnt-mobile h2 {
    font-size: 80px;
	line-height: 40px;
}

/* MWS 퍼센트부분 */
.mws-text h2 small{
	font-size: 30px;
}

/* MWS 주석부분 크기 */
.mws-text h2 small cntvtxt{
	font-size: 30px;
}

/* MWS 주석표시 크기 */
.mws-text h2 small cntvtxt sup{
	top: -.65em;
	font-size: .6em;
}

/*MWS 1,2,3,4 넘버 크기 */
.tile-card h1{
	font-size: 2.5rem;
	line-height: 1.5;
}

/*MWS tile-card 탸이틀*/
.tile-card .card h3 {
    font-size: 1.75rem;
}

/*MWS tile-card 설명*/
.tile-card .card p {
	font-size: 20px;
	line-height: 1.5;
}

/* 프로의 프로세스 넘버링 */
.card_index_no {
	font-size: 1.45rem;
    position: absolute;
	top: 70px;
	right: 70px;
	color: white;
}

/* 프로의 프로세스 소타이틀 */
.pross-slider__title h5 {
	font-size: 30px;
    line-height: 10px;
}

/* 프로의 프로세스 타이틀 */
.pross-slider__title h3 {
    font-size: 60px;
    font-weight: bolder;
	margin-bottom: 30px;
}

/* 프로의 프로세스 내용 */
.pross-right-txt h5 {
    font-size: 28px;
    letter-spacing: -1px;
}

/*다운로드 버튼 글씨 크기*/
.download-info-book {
    font-size: 20px;
    font-weight: 400 !important;
}

/* 섹션 타이틀 공용 */
.section-title h2 {
    font-size: 75px;
    font-weight: bolder;
}

.section-title-top h2 {
    font-size: 75px;
}

/* 현장 메뉴 글씨 크기  */
.portfolio #portfolio-flters li {
    font-size: 28px;
	font-weight: 500;
	width: 140px;
}

/* 선택지 밑줄 */
.portfolio #portfolio-flters li:hover::after, .portfolio #portfolio-flters li.filter-active::after {
	bottom: -5px;
	width: 100px;
}

/* 지도 설명 글시 크기. */
.glass-box-contact p {
	font-size: 17px;
	padding-left: 5px;
}

/* 메일 선택 옵션 글씨 크기 */
.gl-inp-select {
    font-size: 17px;
	height: 60px;
}

/* 메일 선택 옵션 글씨 크기 */
.gl-inp-select {
    font-size: 17px;
	padding-left: 23px;
}

/* 메일 입력창 글씨 크기 */
.gl-inp{
    font-size: 20px;
	height: 60px;
}
.gl-inp::placeholder{
	font-size: 17px;
}

/* 메일 내용 글씨 크기 */
.gl-tx{
	font-size: 20px;
	height: 281px;
}
.gl-tx::placeholder{
	font-size: 17px;
}

/* 구독 상자안 타이틀 크기 */
.news-container h2 {
	font-size: 90px;
}

/* 구독 상자안 설명 크기 */
.news-container p {
	font-size: 43px;
}

/* 구독 상자안 체크리스트 글씨 크기 */
.con-sub-btn {
    font-size: 20px;
	height: 50px;
	line-height: 10px;
	font-weight: 400 !important;
}

/* 메일 텍스트 크기 */
.news-sub-email {
	font-size: 20px;
}

/* 구독하기 버튼 */
.news-sub-btn {
	font-size: 20px;
    line-height: 10px;
	font-weight: 400 !important;
}

/* 스마트 건설 얼라이언스 공식 회원사 타이틀 */
.bottom-info-area h2 {
    font-weight: 700 !important;
    font-size: 75px;
    line-height: 250%;
}

/* 스마트 건설 얼라이언스 설명 내용 */
.bottom-info-area h4 {
    font-weight: 600;
    font-size: 30px;
	line-height: 40px;
	letter-spacing: -1px;
}

/* 스마트 건설 더 알아보기 버튼 글씨 크기 */
.more-info-btn {
    font-size: 20px;
    font-weight: 400 !important;
}

/* 주석 설명 */
.ref-number p {
	font-size: 13px;
}

/* PC기준 푸터 회사명 */
.footer-top h5{
	font-size: 1.25rem;
}

/* PC기준 푸터 글씨 공용 */
#footer {
	font-size: 18px;
}

/* 푸터 공용 개인정보 방침 */
.ft-right-btn a {
    font-size: 18px;
}

/* 모바일 회사명 */
.mb_nwcorp h5 {
	font-size: 16px;
}

/* 모바일 푸터 회사 기본정보 */
.site-info p {
	font-size: 10px;
	line-height: 10px;
}

/* 모바일 푸터 주소및 세부정보 */
.mb-address-info p{
	font-size: 10px;
	line-height: 10px;
}
/* 
.chk_aitem {
    font-size: 20px;
}
*/
/* 버튼 크기 통일화 */
.download-info-book, .con-sub-btn, .more-info-btn{
	width: 330px;
}

.btn-primary, .policy-home-btn {
	--bs-btn-color: #fff;
	--bs-btn-bg: #4e7bbd;
	--bs-btn-border-color: #4e7bbd;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #0b5ed7;
	--bs-btn-hover-border-color: #0a58ca;
	--bs-btn-focus-shadow-rgb: 49, 132, 253;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #0a58ca;
	--bs-btn-active-border-color: #0a53be;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: #4e7bbd;
	--bs-btn-disabled-border-color: #4e7bbd;
}

.policy-home-btn{
	background-color: #4e7bbd;
	width: 250px;
	height: 50px;
}


@media (min-width: 1200px) and (max-width: 1399px){

	/* 폰트 재정의 */
	/* PC 메뉴 헤더 */
	.navbar a, .navbar a:focus{
		font-size: 16px;
	}

	/* 영상 섹션 윗 글씨 */
	#hero h2 {
		font-size: 57px;
	}

	/* 영상 섹션 아래 글씨 */
	#hero h1 {
		font-size: 85px;
	}

	/* 설명 섹션 윗 글씨 */
	.ab-right h4 {
		font-size: 32px;
	}

	/* 설명 섹션 제목 */
	.ab-right h2 {
		font-size: 65px;
		margin: 0 0 0 0;
	}

	/* 설명 섹션 내용 */
	.p-text h5 {
		font-size: 26px;
		line-height: 35px;
	}

	/* MWS 놀라운 가능성의 시작 MWS 부분 */
	.mws-text h4 {
		font-size: 50px;
		letter-spacing: -1px;
		font-weight: 600;
	}

	.mws-text h4::after {
		width: 190px;
		bottom: -27px;
	}

	/* MWS 타이틀 */
	.mws-text h2 {
		font-size: 65px;
		font-weight: bold;
	}

	/* MWS 내용 */
	.mws-text h5 {
		font-size: 26px;
		line-height: 35px;
		letter-spacing: -1px;
		font-weight: 600;
	}

	/* MWS %숫자부분 */
	.cnt-mobile h2 {
		font-size: 73px;
		line-height: 40px;
	}

	/* MWS 퍼센트부분 */
	.mws-text h2 small{
		font-size: 26px;
	}

	/* MWS 주석부분 크기 */
	.mws-text h2 small cntvtxt{
		font-size: 26px;
	}

	/* MWS 주석표시 크기 */
	.mws-text h2 small cntvtxt sup{
		top: -.65em;
		/*font-size: .em;*/
	}

	.sc05-icon {
		width: 55px;
	}

	/*MWS 1,2,3,4 넘버 크기 */
	.tile-card h1{
		font-size: 2.3rem;
		line-height: 1.3;
	}

	/*MWS tile-card 탸이틀*/
	.tile-card .card h3 {
		font-size: 24px;
	}

	/*MWS tile-card 설명*/
	.tile-card .card p {
		font-size: 18px;
		line-height: 1.3;
	}

	/* 프로의 프로세스 넘버링 */
	.card_index_no {
		font-size: 1.45rem;
	}

	/* 프로의 프로세스 소타이틀 */
	.pross-slider__title h5 {
		font-size: 26px;
		line-height: 10px;
	}

	/* 프로의 프로세스 타이틀 */
	.pross-slider__title h3 {
		font-size: 55px;
		font-weight: bolder;
		margin-bottom: 30px;
	}

	/* 프로의 프로세스 내용 */
	.pross-right-txt h5 {
		font-size: 24px;
		letter-spacing: -1px;
	}

	/*다운로드 버튼 글씨 크기*/
	.download-info-book {
		font-size: 20px;
		font-weight: 700;
	}

	/* 섹션 타이틀 공용 */
	.section-title h2 {
		font-size: 65px;
		font-weight: bolder;
	}

	.section-title-top h2 {
		font-size: 65px;
	}

	/* 현장 메뉴 글씨 크기  */
	.portfolio #portfolio-flters li {
		font-size: 24px;
		font-weight: 500;
		width: 140px;
	}

	/* 선택지 밑줄 */
	.portfolio #portfolio-flters li:hover::after, .portfolio #portfolio-flters li.filter-active::after {
		bottom: -5px;
		width: 80px;
	}

	/* 지도 설명 글시 크기. */
	.glass-box-contact p {
		font-size: 15px;
		padding-left: 5px;
	}

	/* 메일 선택 옵션 글씨 크기 */
	.gl-inp-select {
		font-size: 15px;
		height: 46px;
	}

	/* 메일 선택 옵션 글씨 크기 */
	.gl-inp-select {
		font-size: 15px;
		padding-left: 23px;
	}

	/* 메일 입력창 글씨 크기 */
	.gl-inp{
		font-size: 18px;
		height: 46px;
	}
	.gl-inp::placeholder{
		font-size: 15px;
	}

	/* 메일 내용 글씨 크기 */
	.gl-tx{
		font-size: 18px;
		height: 271px;
	}
	.gl-tx::placeholder{
		font-size: 15px;
	}

	/* 구독 상자안 타이틀 크기 */
	.news-container h2 {
		font-size: 80px;
	}

	/* 구독 상자안 설명 크기 */
	.news-container p {
		font-size: 36px;
	}

	/* 구독 상자안 체크리스트 글씨 크기 */
	.con-sub-btn {
		font-size: 18px;
		height: 46px;
		font-weight:700;
	}

	/* 메일 텍스트 크기 */
	.news-sub-email {
		font-size: 18px;
	}

	/* 구독하기 버튼 */
	.news-sub-btn {
		font-size: 18px;
		font-weight:700;
	}

	/* 스마트 건설 얼라이언스 공식 회원사 타이틀 */
	.bottom-info-area h2 {
		font-weight: 700 !important;
		font-size: 65px;
		line-height: 250%;
	}

	/* 스마트 건설 얼라이언스 설명 내용 */
	.bottom-info-area h4 {
		font-weight: 600;
		font-size: 26px;
		line-height: 35px;
		letter-spacing: -1px;
	}

	/* 스마트 건설 더 알아보기 버튼 글씨 크기 */
	.more-info-btn {
		font-size: 20px;
		font-weight: 700;
	}

	/* 주석 설명 */
	.ref-number p {
		font-size: 12px;
	}

	/* PC기준 푸터 회사명 */
	.footer-top h5{
		font-size: 1.1rem;
	}

	/* PC기준 푸터 글씨 공용 */
	#footer {
		font-size: 16px;
	}

	/* 푸터 공용 개인정보 방침 */
	.ft-right-btn a {
		font-size: 16px;
	}

	/* 모바일 회사명 */
	.mb_nwcorp h5 {
		font-size: 16px;
	}

	/* 모바일 푸터 회사 기본정보 */
	.site-info p {
		font-size: 10px;
		line-height: 10px;
	}

	/* 모바일 푸터 주소및 세부정보 */
	.mb-address-info p{
		font-size: 10px;
		line-height: 10px;
	}
}

@media (max-width: 1199px) {

	/* 폰트 재정의 */
	/* PC 메뉴 헤더 */
	.navbar a, .navbar a:focus{
		font-size: 16px;
	}

	/* 영상 섹션 윗 글씨 */
	#hero h2 {
		font-size: 55px;
	}

	/* 영상 섹션 아래 글씨 */
	#hero h1 {
		font-size: 80px;
	}

	/* 설명 섹션 윗 글씨 */
	.ab-right h4 {
		font-size: 29px;
	}

	/* 설명 섹션 제목 */
	.ab-right h2 {
		font-size: 62px;
		margin: 0 0 20px 0;
	}

	/* 설명 섹션 내용 */
	.p-text h5 {
		font-size: 22px;
		line-height: 30px;
	}

	/* MWS 놀라운 가능성의 시작 MWS 부분 */
	.mws-text h4 {
		font-size: 45px;
		letter-spacing: -1px;
		font-weight: 600;
	}

	.mws-text h4::after {
		width: 160px;
		bottom: -22px;
	}

	/* MWS 타이틀 */
	.mws-text h2 {
		font-size: 60px;
		font-weight: bold;
	}

	/* MWS 내용 */
	.mws-text h5 {
		font-size: 22px;
		line-height: 30px;
		letter-spacing: -1px;
		font-weight: 600;
	}

	/* MWS %숫자부분 */
	.cnt-mobile h2 {
		font-size: 69px;
		line-height: 38px;
	}

	/* MWS 퍼센트부분 */
	.mws-text h2 small{
		font-size: 23px;
	}

	/* MWS 주석부분 크기 */
	.mws-text h2 small cntvtxt{
		font-size: 23px;
	}

	/* MWS 주석표시 크기 */
	.mws-text h2 small cntvtxt sup{
		top: -.65em;
		/*font-size: .em;*/
	}

	/*MWS 1,2,3,4 넘버 크기 */
	.tile-card h1{
		font-size: 2.1rem;
		line-height: 1.3;
	}

	/*MWS tile-card 탸이틀*/
	.tile-card .card h3 {
		font-size: 16px;
		margin-left:15px;
	}

	/*MWS tile-card 설명*/
	.tile-card .card p {
		font-size: 15px;
		line-height: 1.2;
		margin-left:15px;
	}

	.sc05-icon {
		width: 50px;
	}

	/* 프로의 프로세스 넘버링 */
	.card_index_no {
		font-size: 1.45rem;
	}

	/* 프로의 프로세스 소타이틀 */
	.pross-slider__title h5 {
		font-size: 22px;
		line-height: 10px;
	}

	/* 프로의 프로세스 타이틀 */
	.pross-slider__title h3 {
		font-size: 50px;
		font-weight: bolder;
		margin-bottom: 20px;
	}

	/* 프로의 프로세스 내용 */
	.pross-right-txt h5 {
		font-size: 22px;
		letter-spacing: -1px;
	}

	/*다운로드 버튼 글씨 크기*/
	.download-info-book {
		font-size: 16px;
		font-weight: 700;
	}

    .pross-ctr {
        margin-top: 0px;
    }

	/* 섹션 타이틀 공용 */
	.section-title h2 {
		font-size: 60px;
		font-weight: bolder;
	}

	.section-title-top h2 {
		font-size: 60px;
	}

	/* 현장 메뉴 글씨 크기  */
	.portfolio #portfolio-flters li {
		font-size: 22px;
		font-weight: 500;
		width: 130px;
	}

	/* 선택지 밑줄 */
	.portfolio #portfolio-flters li:hover::after, .portfolio #portfolio-flters li.filter-active::after {
		bottom: -5px;
		width: 75px;
	}

	/* 지도 설명 글시 크기. */
	.glass-box-contact p {
		font-size: 13px;
		padding-left: 5px;
	}

	/* 메일 선택 옵션 글씨 크기 */
	.gl-inp-select {
		font-size: 13px;
		height: 43px;
	}

	/* 메일 선택 옵션 글씨 크기 */
	.gl-inp-select {
		font-size: 13px;
		padding-left: 23px;
	}

	/* 메일 입력창 글씨 크기 */
	.gl-inp{
		font-size: 15px;
		height: 43px;
	}
	.gl-inp::placeholder{
		font-size: 13px;
	}

	/* 메일 내용 글씨 크기 */
	.gl-tx{
		font-size: 15px;
		height: 226px;
	}
	.gl-tx::placeholder{
		font-size: 13px;
	}

	/* 구독 상자안 타이틀 크기 */
	.news-container h2 {
		font-size: 70px;
	}

	/* 구독 상자안 설명 크기 */
	.news-container p {
		font-size: 32px;
	}

	.news-container {
        height: 550px;
    }

	/* 구독 상자안 체크리스트 글씨 크기 */
	.con-sub-btn {
		font-size: 15px;
		height: 43px;
		font-weight:700;
	}

	.chk_pitem {
        font-size: 15px;
    }

	.chk_aitem {
        font-size: 15px;
    }

	/* 메일 텍스트 크기 */
	.news-sub-email {
		font-size: 15px;
	}

	/* 구독하기 버튼 */
	.news-sub-btn {
		font-size: 15px;
		font-weight:700;
	}

	.ci_kict_svg img {
		/* margin-top: 5%; */
		width: 500px;
	}

	/* 스마트 건설 얼라이언스 공식 회원사 타이틀 */
	.bottom-info-area h2 {
		font-weight: 700 !important;
		font-size: 60px;
		line-height: 250%;
	}

	/* 스마트 건설 얼라이언스 설명 내용 */
	.bottom-info-area h4 {
		font-weight: 600;
		font-size: 23px;
		line-height: 35px;
		letter-spacing: -1px;
	}

	/* 스마트 건설 더 알아보기 버튼 글씨 크기 */
	.more-info-btn {
		font-size: 16px;
		font-weight: 700;
	}

	/* 주석 설명 */
	.ref-number p {
		font-size: 11px;
	}

	/* PC기준 푸터 회사명 */
	.footer-top h5{
		font-size: 1.1rem;
	}

	/* PC기준 푸터 글씨 공용 */
	#footer {
		font-size: 15px;
	}

	/* 푸터 공용 개인정보 방침 */
	.ft-right-btn a {
		font-size: 16px;
	}

	/* 모바일 회사명 */
	.mb_nwcorp h5 {
		font-size: 16px;
	}

	/* 모바일 푸터 회사 기본정보 */
	.site-info p {
		font-size: 10px;
		line-height: 10px;
	}

	/* 모바일 푸터 주소및 세부정보 */
	.mb-address-info p{
		font-size: 10px;
		line-height: 10px;
	}
}

/* 태블릿 & 모바일 */
@media (max-width: 991px) {

	/* 폰트 재정의 */

	/* 영상 섹션 윗 글씨 */
	#hero h2 {
		font-size: 50px;
	}

	/* 영상 섹션 아래 글씨 */
	#hero h1 {
		font-size: 70px;
	}

	/* 설명 섹션 윗 글씨 */
	.ab-right h4 {
		font-size: 30px;
	}

	/* 설명 섹션 제목 */
	.ab-right h2 {
		font-size: 60px;
		font-weight: 800;
		margin: 0 0 20px 0;
	}

	/* 설명 섹션 내용 */
	.p-text h5 {
		font-size: 26px;
		line-height: 33px;
	}

	/* MWS 놀라운 가능성의 시작 MWS 부분 */
	.mws-text h4 {
		font-size: 40px;
		letter-spacing: -1px;
		font-weight: 600;
	}

	.mws-text h4::after {
		width: 150px;
		bottom: -22px;
	}

	/* MWS 타이틀 */
	.mws-text h2 {
		font-size: 60px;
		font-weight: bold;
	}

	/* MWS 내용 */
	.mws-text h5 {
		font-size: 22px;
		line-height: 33px;
		letter-spacing: -1px;
		font-weight: 600;
		margin-bottom: 8%;
	}

	/* MWS %숫자부분 */
	.cnt-mobile h2 {
		font-size: 69px;
        line-height: 26px;
        margin-bottom: 40px;
	}

	/* MWS 퍼센트부분 */
	.mws-text h2 small{
		font-size: 23px;
	}

	/* MWS 주석부분 크기 */
	.mws-text h2 small cntvtxt{
		font-size: 23px;
	}

	/* MWS 주석표시 크기 */
	.mws-text h2 small cntvtxt sup{
		top: -.65em;
	}

	/*MWS 1,2,3,4 넘버 크기 */
	.tile-card h1{
		font-size: 2.1rem;
		line-height: 0.6;
	}

	/*MWS tile-card 탸이틀*/
	.tile-card .card h3 {
		font-size: 26px;
		margin-left:8px;
	}

	/*MWS tile-card 설명*/
	.tile-card .card p {
		font-size: 20px;
		line-height: 1.2;
		margin-left:8px;
        width: 97%;
	}

	.sc05-icon {
		width: 50px;
	}

    .next, .prev {
        margin-top: 0px;
	}

	/* 프로의 프로세스 넘버링 */
	.card_index_no {
		font-size: 1.45rem;
	  position: absolute;
		top: auto;
		bottom: 20px;
		right: auto;
		color: white;
	}

	/* 프로의 프로세스 소타이틀 */
	.pross-slider__title h5 {
		font-size: 22px;
		line-height: 50px;
	}

	/* 프로의 프로세스 타이틀 */
	.pross-slider__title h3 {
		font-size: 50px;
		font-weight: bolder;
        margin-bottom: 20px;
	}

	/* 프로의 프로세스 내용 */
	.pross-right-txt h5 {
		font-size: 22px;
		letter-spacing: -1px;
		margin-bottom:5%;
	}

	/*다운로드 버튼 글씨 크기*/
	.download-info-book {
		font-size: 16px;
		font-weight: 700;
	}

    .pross-ctr {
        margin-top: 0px;
    }

	/* 섹션 타이틀 공용 */
	.section-title h2 {
		font-size: 60px;
		font-weight: bolder;
		margin-bottom: 0px; 
	    padding-bottom: 0px;
	}

	.section-title-top h2 {
		font-size: 60px;
		margin-bottom: 0px; 
	    padding-bottom: 0px;
	}

	/* 현장 메뉴 글씨 크기  */
	.portfolio #portfolio-flters li {
		font-size: 22px;
		font-weight: 500;
		width: 110px;
	}

	/* 선택지 밑줄 */
	.portfolio #portfolio-flters li:hover::after, .portfolio #portfolio-flters li.filter-active::after {
		bottom: -5px;
		width: 75px;
	}

	/* 지도 설명 글시 크기. */
	.glass-box-contact p {
		font-size: 13px;
		padding-left: 5px;
	}

	/* 메일 선택 옵션 글씨 크기 */
	.gl-inp-select {
		font-size: 13px;
		height: 43px;
	}

	/* 메일 선택 옵션 글씨 크기 */
	.gl-inp-select {
		font-size: 13px;
		padding-left: 15px;
	}

	/* 메일 입력창 글씨 크기 */
	.gl-inp{
		font-size: 15px;
		height: 43px;
		padding-left: 15px;
	}
	.gl-inp::placeholder{
		font-size: 13px;
	}

	/* 메일 내용 글씨 크기 */
	.gl-tx{
		font-size: 15px;
		height: 226px;
		padding-left: 10px;
	}
	.gl-tx::placeholder{
		font-size: 13px;
	}

	/* 구독 상자안 타이틀 크기 */
	.news-container h2 {
		font-size: 70px;
	}

	/* 구독 상자안 설명 크기 */
	.news-container p {
		font-size: 32px;
	}

	/* 구독상자 모바일 타이틀 크기*/
	.m-news-container h3 {
        font-size: 30px;
        font-weight: 600;
        margin-top: 30px;
    }

	/* 구독 상자안 설명 크기 */
	.m-news-container p {
        margin-top: 15px;
        font-size: 16px;
        font-weight: 500;
    }

	.news-container {
        height: 550px;
    }

	/* 구독 상자안 체크리스트 글씨 크기 */
	.con-sub-btn {
		font-size: 15px;
		height: 43px;
		font-weight:700;
	}

	.chk_pitem {
        font-size: 15px;
    }

	.chk_aitem {
        font-size: 15px;
    }

	/* 메일 텍스트 크기 */
	.news-sub-email {
		font-size: 15px;
	}

	/* 구독하기 버튼 */
	.news-sub-btn {
		font-size: 15px;
		font-weight:700;
		height: 43px;
	}

	.ci_kict_svg img {
		/* margin-top: 5%; */
		width: 400px;
	}

	/* 스마트 건설 얼라이언스 공식 회원사 타이틀 */
	.bottom-info-area h2 {
		font-weight: 700 !important;
		font-size: 45px;
		line-height: 250%;
	}

	/* 스마트 건설 얼라이언스 설명 내용 */
	.bottom-info-area h4 {
		font-weight: 600;
		font-size: 22px;
		line-height: 30px;
		letter-spacing: -1px;
	}

	/* 스마트 건설 더 알아보기 버튼 글씨 크기 */
	.more-info-btn {
		font-size: 16px;
		font-weight: 700;
		margin: 5% 0;
	}

	/* 주석 설명 */
	.ref-number p {
		font-size: 13px;
	}

	/* PC기준 푸터 회사명 */
	.footer-top h5{
		font-size: 1.1rem;
	}

	/* PC기준 푸터 글씨 공용 */
	#footer {
		font-size: 15px;
	}

	/* 푸터 공용 개인정보 방침 */
	.ft-right-btn a {
		font-size: 13px;
	}

	/* 모바일 회사명 */
	.mb_nwcorp h5 {
		font-size: 22px;
	}

	/* 모바일 푸터 회사 기본정보 */
	.site-info p {
		font-size: 13px;
		line-height: 15px;
	}

	/* 모바일 푸터 주소및 세부정보 */
	.mb-address-info p{
		font-size: 13px;
		line-height: 15px;
	}

	section:first-child {
		padding-top: 120px;
	}

	section:nth-child(n+4) {
		padding: 60px 0;
	}

	section:last-child {
		padding-bottom: 20px;
	}

	.news-sub-btn{
		width: 330px;
	}

	.mb-icon-container img {
        width: 30px;
    }

	.ft_icon img {
        width: 140px;
    }
}

@media screen and (max-width: 767px) {
	.prev {
	  transform: translate(20%, -50%);
	}
}
@media screen and (max-width: 767px) {
	.next {
	  transform: translate(0%, -50%);
	}
}

@media (max-width: 767px) {
/* 폰트 재정의 */

	/* 영상 섹션 윗 글씨 */
	.hero-text{
		padding-bottom: 0px;
	}

	#hero h2 {
		font-size: 30px;
		margin: 10px 0;
	}

	/* 영상 섹션 아래 글씨 */
	#hero h1 {
		font-size: 45px;
	}

	#hero .logo-icon {
		width: 65px;
	}

	/* 설명 섹션 윗 글씨 */
	.ab-right h4 {
		font-size: 24px;
	}

	/* 설명 섹션 제목 */
	.ab-right h2 {
		font-size: 32px;
		font-weight: 800;
		margin: 0 0 20px 0;
	}

	/* 설명 섹션 내용 */
	.p-text h5 {
		font-size: 18px;
		line-height: 23px;
	}

	/* MWS 놀라운 가능성의 시작 MWS 부분 */
	.mws-text h4 {
		font-size: 24px;
		letter-spacing: -1px;
		font-weight: 600;
	}

	.mws-text h4::after {
		width: 80px;
		bottom: -22px;
	}

	/* MWS 타이틀 */
	.mws-text h2 {
		font-size: 32px;
		font-weight: bold;
	}

	/* MWS 내용 */
	.mws-text h5 {
		font-size: 14px;
		line-height: 20px;
		letter-spacing: -1px;
		font-weight: 600;
		margin-bottom: 8%;
	}

	/* MWS %숫자부분 */
	.cnt-mobile h2 {
		font-size: 50px;
        line-height: 20px;
        margin-bottom: 20px;
	}

	/* MWS 퍼센트부분 */
	.mws-text h2 small{
		font-size: 16px;
	}

	/* MWS 주석부분 크기 */
	.mws-text h2 small cntvtxt{
		font-size: 16px;
	}

	/* MWS 주석표시 크기 */
	.mws-text h2 small cntvtxt sup{
		top: -.65em;
		/*font-size: .em;*/
	}

    .card-top {
        margin-bottom: 30px;
    }



	.download-info-book, .con-sub-btn, .more-info-btn {
		width: 200px !important;
		margin: 0;
	}

	/*MWS 1,2,3,4 넘버 크기 */
	.tile-card h1{
		font-size: 2.1rem;
		line-height: 0.6;
	}

	/*MWS tile-card 탸이틀*/
	.tile-card .card h3 {
		font-size: 24px;
		margin-left:8px;
	}

	/*MWS tile-card 설명*/
	.tile-card .card p {
		font-size: 16px;
		line-height: 1.2;
		margin-left:8px;
        width: 97%;
	}

	.sc05-icon {
		width: 50px;
	}

    .next, .prev {
        margin-top: 0px;
	}

	/* 프로의 프로세스 넘버링 */
	.card_index_no {
		font-size: 14px;
	}

	/* 프로의 프로세스 소타이틀 */
	.pross-slider__title h5 {
		font-size: 22px;
		line-height: 50px;
	}

	/* 프로의 프로세스 타이틀 */
	.pross-slider__title h3 {
		font-size: 32px;
		font-weight: 800;
        margin-bottom: 20px;
	}

	/* 프로의 프로세스 내용 */
	.pross-right-txt h5 {
		font-size: 14px;
		letter-spacing: -1px;
	}

	/*다운로드 버튼 글씨 크기*/
	.download-info-book {
		font-size: 14px;
        height: 36px;
        font-weight: 400;
	}

    .pross-ctr {
        margin-top: 0px;
    }

	.section-title {
		padding-bottom: 0px;
	}

	/* 섹션 타이틀 공용 */
	.section-title h2 {
		font-size: 30px;
		font-weight: 800;
		margin-bottom: 0px; 
	    padding-bottom: 30px;
	}

	.section-title-top h2 {
		font-size: 30px;
		margin-bottom: 0px; 
	    padding-bottom: 0px;
	}

	/* 현장 메뉴 글씨 크기  */
	.portfolio #portfolio-flters li {
		font-size: 12px;
		font-weight: 500;
		width: 50px;
	}

	

	.prev {
        left: -3%;
    }

	.next {
        right: 3%;
    }

	.next, .prev {
		width: 40px;
		height: 40px;
        margin-top: -70px;
        padding: 0;
    }

	.section-title-top {
		padding-bottom: 10px;
	}

	/* 선택지 밑줄 */
	.portfolio #portfolio-flters li:hover::after, .portfolio #portfolio-flters li.filter-active::after {
		bottom: 0px;
		width: 50px;
	}

	/* 지도 설명 글시 크기. */
	.glass-box-contact p {
		font-size: 10px;
		padding-left: 5px;
	}

	/* 메일 선택 옵션 글씨 크기 */
	.gl-inp-select {
		font-size: 10px;
		height: 43px;
	}

	/* 메일 선택 옵션 글씨 크기 */
	.gl-inp-select {
		font-size: 10px;
		padding-left: 15px;
	}

	/* 메일 입력창 글씨 크기 */
	.gl-inp{
		font-size: 10px;
		height: 43px;
		padding-left: 15px;
	}
	.gl-inp::placeholder{
		font-size: 13px;
	}

	/* 메일 내용 글씨 크기 */
	.gl-tx{
		font-size: 10px;
		height: 226px;
		padding-left: 15px;
	}
	.gl-tx::placeholder{
		font-size: 13px;
	}

    .con-sub-btn {
	
	}

	/* 구독 상자안 타이틀 크기 */
	.news-container h2 {
		font-size: 70px;
	}

	/* 구독 상자안 설명 크기 */
	.news-container p {
		font-size: 32px;
	}

	/* 구독상자 모바일 타이틀 크기*/
	.m-news-container h3 {
        font-size: 24px;
        font-weight: 600;
        margin-top: 30px;
    }

	/* 구독 상자안 설명 크기 */
	.m-news-container p {
        margin-top: 15px;
        font-size: 14px;
        font-weight: 500;
    }

	.news-container {
        height: 550px;
    }

	/* 구독 상자안 체크리스트 글씨 크기 */
	.con-sub-btn {
        font-size: 14px;
        height: 36px;
        font-weight: 400;
	}

	.chk_pitem {
        font-size: 10px;
    }

	.chk_aitem {
        font-size: 10px;
    }

	/* 메일 텍스트 크기 */
	.news-sub-email {
		font-size: 15px;
	}

	/* 구독하기 버튼 */
	.news-sub-btn {
		font-size: 15px;
		font-weight:700;
	}

	.ci_kict_svg img {
		/* margin-top: 5%; */
		width: 250px;
	}

	/* 스마트 건설 얼라이언스 공식 회원사 타이틀 */
	.bottom-info-area h2 {
		font-weight: 700 !important;
		font-size: 24px;
		line-height: 250%;
	}

	/* 스마트 건설 얼라이언스 설명 내용 */
	.bottom-info-area h4 {
		font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        letter-spacing: -1px;
	}

	/* 스마트 건설 더 알아보기 버튼 글씨 크기 */
	.more-info-btn {
		font-size: 14px;
		font-weight: 400;
		margin: 5% 0 15%;
	}

	/* 주석 설명 */
	.ref-number p {
		font-size: 7px;
	}

	/* PC기준 푸터 회사명 */
	.footer-top h5{
		font-size: 1.1rem;
	}

	/* PC기준 푸터 글씨 공용 */
	#footer {
		font-size: 15px;
	}

	/* 푸터 공용 개인정보 방침 */
	.ft-right-btn a {
		font-size: 11px;
	}

	/* 모바일 회사명 */
	.mb_nwcorp h5 {
		font-size: 18px;
	}

	/* 모바일 푸터 회사 기본정보 */
	.site-info p {
		font-size: 11px;
		line-height: 10px;
	}

	/* 모바일 푸터 주소및 세부정보 */
	.mb-address-info p{
		font-size: 11px;
		line-height: 10px;
	}

	section:first-child {
		padding-top: 60px;
	}

	section:nth-child(n+4) {
		padding: 30px 0;
	}

	section:last-child {
		padding-bottom: 20px;
	}

	.news-sub-btn{
		width: 200px;
		font-size: 14px;
        height: 36px;
        font-weight: 400;
	}

	.mb-icon-container img {
        width: 20px;
    }

	.ft_icon img {
        width: 100px;
    }

	.m-news-lines {
        max-width: 280px;
    }

	.policy-text-title h3 {
		font-size: 30px;
	}

	.policy-text-title h2 {
		font-size: 50px;
	}
}

@media (max-width: 510px){
    #pross-mws .section-title h2 {
		padding-bottom: 0px;
	}
}

@media (min-width: 431px) and (max-width: 767px){
	.pross-right-txt h5 {
        font-size: 17px;
        letter-spacing: -1px;
    }
}

@media (max-width: 375px){

}



/* 추가 CSS */
.custom-caption {
  position: absolute;
  top: 50%;
  left: 5%;
  transform: translateY(-50%);
  text-align: left;
  z-index: 2;
  max-width: 600px; /* 필요시 너비 조정 */
}


.custom-radio-group {
  display: flex;
  gap: 1px;
}

/* 해당 그룹의 라디오 input만 가립니다 */
.custom-radio-group .custom-radio {
  /* 접근성 보장형 숨김: 기본 라디오와 겹치지 않음 */
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* 버튼 스타일 레이블 */
.custom-radio-group label {
  padding: 10px 32px;
  border-radius: 5px;
  background: #000000;
  color: #333;
  border: 1.5px solid #000000;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border 0.2s;
  font-weight: 500;
  user-select: none;
}

/* 해당 그룹에서 체크된 input 뒤 label에만 선택 스타일 */
.custom-radio-group .custom-radio:checked + label {
  background: #477ABD;
  color: #fff;
  border: 1.5px solid #477ABD;
}


.white-txt-area{
  color: #fff;
}

.nw-bd-card {
  background: none;          /* 카드 배경 없음 */
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.nw-bd-card-img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 16px;       /* 이미지만 둥글게 */
  margin-bottom: 8px;
  display: block;
}

.nw-bd-card-caption {
  font-size: 14px;
  color: #bdbdbd;
  margin-bottom: 2px;
  margin-top: 8px;           /* 이미지와 충분한 간격 */
}

.nw-bd-card-title {
  font-size: 18px;
  font-weight: 400;
  color: #fff;
  word-break: keep-all;
  line-height: 1.4;
}

.nw-case,
.nw-mws,
.nw-qa{
  margin-top: 100px;
  padding: 0 15% 0 15%;
}

.nw-case h1{
  margin-bottom: 50px;
}

.nw-qa h1{
  margin-bottom: 50px;
}

.custom-radio-group label{
  padding-left: 0;
  padding-right: 0;
  width: 100%;
  text-align: center;
}

.qa-gray-card{
  background: #1C1C1F;       /* 회색 배경 */
  padding: 20px;
  border-radius: 5px;       /* 둥근 모서리 */
  box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* 약간의 그림자 */
  margin-bottom: 20px;       /* 카드 간격 */
}

.gray-card-input{
  background-color: #1C1C1F !important;       /* 회색 배경 */
  border-color: #1C1C1F !important;         /* 테두리 색상 */
  color: #fff !important;                    /* 텍스트 색상 */
}

.gray-card-txtarea{
  background-color: #1C1C1F !important;       /* 회색 배경 */
  border-color: #1C1C1F !important;         /* 테두리 색상 */
  color: #fff !important;    
  height: 300px;
  resize: none;
}


.gray-card-txtarea::placeholder{
  color: #bdbdbd !important;                  /* 플레이스홀더 색상 */
}


.gray-card-input::placeholder{
  color: #bdbdbd !important;                  /* 플레이스홀더 색상 */
}

.padding-l-zero{
  padding-left: 0 !important;
}
.padding-r-zero{
  padding-right: 0 !important;  
}

.i-margin-t-zero{
  margin-top: 0 !important; 
  margin-left: 15px !important;
}

@media (max-width: 767px) {
  .padding-l-zero{
    padding: 0 0 0 0 !important;
  }
  .padding-r-zero{
    padding: 0 0 0 0 !important;  
  }
}

.qa-gray-card p {
  font-size: 24px;           /* 텍스트 크기 */
  color: #fff;               /* 텍스트 색상 */
  margin: 0;                 /* 기본 마진 제거 */
  padding-bottom: 5px;
}

.qa-gray-card i{
  color: #fff;               /* 아이콘 색상 */
  font-size: 20px;           /* 아이콘 크기 */
  margin-right: 10px;        /* 아이콘과 텍스트 간격 */
  margin-top: 8px;
}

.required::after {
  content: '*';
  color: #ff3737;  /* 빨간색으로 표시 (선택 사항) */
  margin-left: 4px; 
}

.back-img-section-qa {
  width: 100% !important;
  padding: 0 !important;
  background-image: url('/images/renew_front/online_qa.png');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain; 
}
.grayin-btn{
  height: 35px;
  font-size: 16px;
  display: flex;
  align-items: center;   /* 세로 중앙 */
  justify-content: center; /* 가로 중앙 */  
}
.grayin-btn i{
  font-size: small;
}
.qa-send-btn{
  margin: 25px 0px 145px 0px;
  height: 45px;
  font-size: 22px;
}


.vp-center{
  width: 90% !important;
}

.nw-mws .accordion-item {
  border-radius: 20px !important;
  border: 0;
  margin-bottom: 15px;
}
.accordion-button{
  border-radius: var(--border-radius-small);
  background-color: #F5F7F6 !important;
}

.nw-mws .accordion-button {
  font-size: var(--h6-font-size);
  font-weight: var(--font-weight-semibold);
  border-radius: 20px !important;
}


.nw-mws .accordion-button:not(.collapsed) {
  border-radius: var(--border-radius-large);
  box-shadow: none;
  color: var(--white-color);
  background-color: #477ABD !important;
}

.accordion-header{
  border-radius: 20px 20px 20px 20px !important ;
  background-color: #1C1C1F !important;
}

.accordion{
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
  --bs-accordion-bg : #1C1C1F !important;
}


.nw-mws .accordion-body {
  color: #F5F7F6;
  font-size: var(--btn-font-size);
  line-height: 30px;
  padding: 15px 20px 15px 20px !important;
  background-color: #1C1C1F;
  border-radius: 0 0 16px 16px !important;
}

.accordion-item:last-of-type .accordion-button.collapsed {
  border-radius: 25px; 
}
/* About */

.about-text{
  text-align: center;
  margin-top: 200px;
}

.about-text-load{
  text-align: left;
  margin-top: 145px;
}

.about-text h1{
  color: white;
  font-size: 72px;
  font-weight: 800; 
  margin-bottom: 150px;
}


/* 조직도 */

.org-chart-text{
  margin-top: 345px;
  text-align: center;
}

.org-chart-text h1{
  color: white;
  font-size: 72px;
  font-weight: 800; 
  margin-bottom: 50px;
}


.org-chart{
  background-image: url('/images/renew_front/org-chart.png');
  background-repeat: no-repeat;
  background-size: contain;   /* 이미지를 짤림 없이 비율 유지하며 줄임 */
  background-position: center;
  width: 98%;
  min-height: 300px;          
  height: 40vw;               
  max-height: 600px;
  margin-left: 15px;     
}







/* stepline */
.step-text{
  text-align: center;
}

.step-text h1{
  color: white;
  font-size: 72px;
  font-weight: 800; 
}

.step-text p{
  color: white;
  font-size: 27px !important;
  font-weight: 400;  
}


.about-text p{
  color: white;
  font-size: 32px !important;
  font-weight: 600;
}


.about-content{
  align-items: center;
  display: flex;
  height: 370px;
}

.about-content p{
  color: white;
  font-size: 20px !important;
  font-weight: 400;
  line-height: 1.5;
}

.ab-card-header{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 15px !important;
}

.card{
  background-color: #1C1C1F !important;
  border-radius: 15px !important;
  
  box-shadow: none;
  width: 100%;
}

.ab-card-inner{
  display: flex;
  align-items: center;           /* 수직 중앙 */
  justify-content: center;       /* 수평 중앙 */
  height: 150px !important;
  background-color: #1C1C1F !important;
  border-radius: 15px !important;
  text-align: center !important;
}

.ab-card-inner p {
  font-size: 28px !important;
  width: 100%;
}

.simbol-info{
  height: 350px !important;
}

.simbol-info h5{
  font-size: 32px !important;
  font-weight: 600;
  color: white;
  margin-bottom: 20px;
}

.simbol-info p{
  color: white;
  font-size: 20px !important;
  font-weight: 400;
  line-height: 1.5;
}

.simbol-img {
  background-size: 90%;
  background-repeat: no-repeat;
  background-position: center;
  max-height: 250px; 

  /* margin-left: 5px; */
}


.b-stack {
  background-image: url('/images/renew_front/b-stack.png');
}
.r-stack {
  background-image: url('/images/renew_front/r-stack.png');
}
.y-stack {
  background-image: url('/images/renew_front/y-stack.png');
}



.timeline-card-radio {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.timeline-cards-container {
  --base-rotation: 0deg;
  --full-circle: 360deg;
  --radius: 20vw;
  --duration: 200ms;

  --cards-container-size: calc(var(--radius) * 2);
  --cards-container-padding: 2rem;

  --border-color: transparent;

  --label-offset: calc(var(--radius) * -1 - 1rem);
  --label-size: 30px;
  --label-color: #666;
  --label-color-hover: steelblue;
  --label-line-h: 0;
  --label-line-h-current: 2rem;
  --label-dot-size: 10px;

  --title-top: 1.5rem;
  --title-offset-y: 30px;

  --info-top: 5rem;
  --info-width: min(70%, 500px);
  --info-offset-y: 30px;
  
  
  position: relative;

  
  width: 1280px;
  height: 512px;
  margin: 5rem auto;
  padding: var(--cards-container-padding);
  box-sizing: content-box;
  overflow: hidden; /* 넘칠 경우 잘리도록 */
}



.timeline-cards {
  width: 100%;
  position: relative;
  inset: var(--cards-container-padding);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid var(--border-color);
  transition: transform 0.3s ease-in-out var(--duration);
  list-style: none;
}

.timeline-card-item {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  transform-origin: center;
  transform: rotate(calc(var(--i) * 360deg / var(--items)));
  pointer-events: none;
  margin: 0;
  padding: 0;
}

.timeline-card-label {
  position: absolute;
  inset: 0;
  margin: auto;
  transform: translateY(var(--label-offset));
  width: var(--label-size);
  height: var(--label-size);
  cursor: pointer;
  pointer-events: initial;
  text-align: left;
  color: var(--label-color);
  font-size: clamp(.8rem, 2.5vw + .04rem, 1rem);
  transition: var(--duration) ease-in-out;
}

.timeline-card-label::before {
  content: '';
  position: absolute;
  top: var(--cards-container-padding);
  left: 50%;
  translate: -50% 0;
  width: var(--label-dot-size);
  height: var(--label-dot-size);
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: var(--label-color);
  transition: background-color var(--duration) ease-in-out;
}

.timeline-card-label::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  translate: -50% 5px;
  width: 2px;
  height: var(--label-line-h);
  background-color: steelblue;
  transition: height 300ms ease-in-out var(--label-line-delay, 0ms);
}

.timeline-card-label:hover {
  --label-color: var(--label-color-hover);
}

.timeline-card-title,
.timeline-card-desc {
  position: absolute;
  left: 50%;
  text-align: center;
  transform: translate(-50%, 0);
  transform-origin: center;
  color: #fff;
}



.timeline-card-title {
  top: 265px;
  font-size: 22px;
  translate: 0 var(--title-offset-y);
  transition: var(--duration) ease-in-out var(--title-delay, 0ms);
}

.timeline-card-desc {
  top: 220px;
  /* margin: 0 120px auto auto; */
  margin-top: 200px;
  width: var(--info-width);
  z-index: 2;
  font-size: 24px;
  text-align: center;
  text-wrap: pretty;
  opacity: var(--info-opacity, 0);
  transition: var(--duration) ease-in-out var(--info-delay, 0ms);
}


/* QHD (2560x1440 이상) */
@media screen and (min-width: 2560px) {
  .timeline-card-label{
    margin-bottom: 450px !important;
  }
}

/* 4K UHD (3840x2160 이상) */
@media screen and (min-width: 3840px) {
  .timeline-card-label{
    margin-bottom: 200px !important;
  }
}




.timeline-cards-container{
  padding-right: 80px;
}

.timeline-card-item:has(.timeline-card-radio:checked) {
  --label-opacity: 1;
  --label-color: var(--label-color-hover);
  --label-line-h: var(--label-line-h-current);
  --label-line-delay: calc(var(--duration) * 2);
  --title-opacity: 1;
  --title-offset-y: 0;
  --title-delay: calc(var(--duration) * 3);
  --info-opacity: 1;
  --info-offset-y: 0;
  --info-delay: calc(var(--duration) * 4);
}

.timeline-cards:has(.timeline-card-radio:checked) {
  transform: rotate(calc(
    var(--base-rotation) -
    (var(--index) * var(--full-circle) / var(--items))
  ));
}

/* 인덱싱 */
.timeline-cards:has(li:nth-child(1) > .timeline-card-radio:checked)  { --index: 0; }
.timeline-cards:has(li:nth-child(2) > .timeline-card-radio:checked)  { --index: 1; }
.timeline-cards:has(li:nth-child(3) > .timeline-card-radio:checked)  { --index: 2; }
.timeline-cards:has(li:nth-child(4) > .timeline-card-radio:checked)  { --index: 3; }
.timeline-cards:has(li:nth-child(5) > .timeline-card-radio:checked)  { --index: 4; }
.timeline-cards:has(li:nth-child(6) > .timeline-card-radio:checked)  { --index: 5; }
.timeline-cards:has(li:nth-child(7) > .timeline-card-radio:checked)  { --index: 6; }
.timeline-cards:has(li:nth-child(8) > .timeline-card-radio:checked)  { --index: 7; }
.timeline-cards:has(li:nth-child(9) > .timeline-card-radio:checked)  { --index: 8; }
.timeline-cards:has(li:nth-child(10) > .timeline-card-radio:checked) { --index: 9; }
.timeline-cards:has(li:nth-child(11) > .timeline-card-radio:checked) { --index: 10; }
.timeline-cards:has(li:nth-child(12) > .timeline-card-radio:checked) { --index: 11; }
.timeline-cards:has(li:nth-child(13) > .timeline-card-radio:checked) { --index: 12; }
.timeline-cards:has(li:nth-child(14) > .timeline-card-radio:checked) { --index: 13; }
.timeline-cards:has(li:nth-child(15) > .timeline-card-radio:checked) { --index: 14; }

.timeline-card-radio:disabled + .timeline-card-label {
  opacity: 0.4;
  pointer-events: none;
  cursor: not-allowed;
}


.timeline-card-radio:disabled + .timeline-card-label::before {
  background-color: #ccc;
}

/* kakao map text 가리기 */
.lst{
  display: none !important;
}


.about-map p{ 
  color: #fff !important;
  font-size: 24px !important;
  margin-top: 24px !important;
}

.about-map h4{
  color: #fff !important;
  margin-bottom: 28px !important;
}

.wrap_controllers {
  display: none !important;
}

.about-load{
  margin-bottom: 200px;
}

#btnList-btm{
  background-color: #477ABD !important;
  margin-bottom: 1% !important;
  width: 100px !important;
}



.bold-border-tb {
  border-top: 2px solid #CED4DA;
  border-bottom: 2px solid #CED4DA;
}

.border-hr-white td {
  border-bottom: 1px solid #CED4DA;
}

.clickable { cursor: pointer;}

.con_tr{
  color: #fff !important;
}


.page-num a{
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 500 !important;
}
.page-num{
  padding: 5px;
}
.page-next a, .page-last a, .page-first a{
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 500 !important;
}

.page-current{
  color: #fff !important;
  background-color: #477ABD;
  padding: 5px;
  font-size: 16px !important;
  font-weight: 700 !important ;
  border-radius: 3px;
}
.page-prev a{
  color: #fff !important;
  padding: 5px;
}

.post_h1{
  font-weight: bold;
  font-size: 32px;
}

.btn.case_tag_btn{
  width: 105px;
}


.btn.case_tag_btn:hover,
.btn.case_tag_btn:focus,
.btn.case_tag_btn:active {
  background-color: #477ABD !important;  /* Bootstrap5 기본 btn-primary 배경색 */
  border-color: #477ABD !important;      /* 기본 테두리 */
  color: #fff !important;                /* 글자색 (흰색) */
  box-shadow: none !important;           /* 효과 없애기 */
}

.case_card_title h5{
  font-size: 32px !important;
  margin-top: 1.75%;
}
.case_card{
  background-color: #1C1C1F !important; /* 카드 배경색 */
  border-radius: 15px !important;        /* 둥근 모서리 */
  box-shadow: none;                       /* 그림자 제거 */
  padding: 20px;                          /* 내부 여백 */
  margin-bottom: 20px;                    /* 카드 간격 */ 
}

.case_img {
    height: 250px;
    width: 100%;
    object-fit: cover;    
    display: block;       
}

.case_tag_btn{
  background-color: #fff;
  border-radius: 5px;
  border-color: #477ABD;
  color: #477ABD;
  margin-bottom: 5px;
  margin-top: 2px;
  padding: 5px;
  width: 100px;
}

.tag_area,
.tag_year,
.tag_categ,
.tag_symp,
.tag_method,
.tag_finish{
  border-bottom: #1C1C1F solid 2px;
  padding-bottom: 10px;
  margin-bottom: 10px;
}


.img-cover-container {
  position: relative;
  height: 390px; /* 원하는 높이 지정 */
  overflow: hidden;
  margin-top: 2%;
  border-radius: 25px;
}

.img-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;       /* 크기 꽉 채우기, 작으면 확대됨 */
  object-position: center;
  display: block;
}


.nw-bd-card-img-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.nw-bd-card-img {
  display: block;
  width: 100%;
  height: auto;
}

.card-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5); /* 기본 어둡게용: 투명 */
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: opacity 0.3s;
}

.nw-bd-card-img-wrapper:hover .card-overlay {
  opacity: 1;
}

.card-btn {
  background: #fff;
  color: #000;
  padding: 12px 24px;
  border-radius: 24px;
  text-decoration: none;
  font-weight: bold;
  font-size: 16px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  transition: background 0.2s, color 0.2s;
}

.card-btn:hover {
  background: #000;
  color: #fff;
}


.top-logo-img{
  padding-right: 9%;
}


.sch_box{
  margin-left: 1%;
  width: 98.5%;  
}


/* 반응형 미디어 쿼리 */
/* FHD */
@media (min-width: 1920px) and (max-width: 2559px) {
  .nw-mws{
    padding: 0 16.3% 0 16.5%;
  }
  .nw-case{
    padding: 0 0 0 0;
  }
  .nw-qa{
    padding: 0 1% 0 1%;
  }
  .carousel-caption{
    margin-left: 11.5%;
  }
  .carousel-caption h1{
    font-size: 40px !important;
    font-weight: bolder;
    width: 1500px;
  }
  .carousel-caption p{
    font-size: 20px !important;
    font-weight: 600;
    width: 1500px;
    line-height: 40px;
  }       
}

/* QHD */
@media (min-width: 2560px) and (max-width: 3839px) {
  .nw-mws{
    padding: 0 24.5% 0 24.7%
  }
  .nw-case{
    padding: 0 0 0 0;
  }
  .nw-qa{
    padding: 0 1% 0 1%;
  }
  .carousel-caption{
    margin-left: 19.8%;
  }
  .carousel-caption h1{
    font-size: 60px !important;
    font-weight: bolder;
    width: 1500px;
  }
  .carousel-caption p{
    font-size: 28px !important;
    font-weight: 600;
    width: 1500px;
    line-height: 50px;
  }      
}

/* 4K */
@media (min-width: 3840px) {
  .nw-mws{
    padding: 0 33% 0 33.2%
  }
  .nw-case{
    padding: 0 0 0 0;
  }
  .nw-qa{
    padding: 0 1% 0 1%;
  }
  .carousel-caption{
    margin-left: 28.3%;
  }
  .carousel-caption h1{
    font-size: 72px !important;
    font-weight: bolder;
    width: 1500px;
  }
  .carousel-caption p{
    font-size: 32px !important;
    font-weight: 600;
    width: 1500px;
    line-height: 65px;
  }          
}

.nw-qa-mb{
  display: none;
}

.nw-ab-mb{
  display: none;
}

.nw-bm-mb{
  display: none;
}

#pers_check{
  margin-bottom: 5px;
}

.qa-send-btn{
  width: 16%;
}

/* Mobile */
@media (max-width: 600px) {
  .nw-qa-pc {
    display: none;
  } 
  .nw-ab-pc{
    display: none;
  }
  .nw-qa-mb .nw-ab-mb{
    display: block;
  }
  .nw-ab-mb{
    display: block;
  }  
  .nw-bm-pc{
    display: none;
  }
  .nw-bm-mb{
    display: block;
  }
  #menu-toggle{
    color: #fff !important;
  }
  #hero {
    height: 50vh;
  }
  #nwCarousel {
    height: 40vh; /* 높이 1.5배 */
    position: relative; /* 위치 기준 명확히 */
  }

  /* 캡션 위치를 높이에 맞게 아래로 이동 */
  #nwCarousel .carousel-caption {
    bottom: 15vh; /* 기존보다 아래로 */
    padding: 10px 15px;
    font-size: 14px;

    border-radius: 8px;
    width: 90%;
    left: 5%;
    right: 5%;
  }

  /* 좌우 이전/다음 버튼 위치도 높이에 맞춰 조정 */
  #nwCarousel .carousel-control-prev,
  #nwCarousel .carousel-control-next {
    top: 50%; /* 중앙 위치 */
    transform: translateY(-50%);
    width: 5vw;  /* 버튼 크기 조정 가능 */
    height: 5vw;
  }
  #nwCarousel .carousel-item img {
    height: 40vh; /* 캐러셀 높이와 동일하게 맞춤 */
    object-fit: cover; /* 비율 유지하며 잘림 최소화 */
  }
  .image-box{
    display: none;
  } 
  .accordion-button{
    font-size: 15px !important;
  }
  .accordion-body{
    font-size: 14px !important;
    line-height: 25px !important;
  }
  .accordion-body br{
    display: none;
  }
  .nw-mws {
    padding: 0% 5% 0% 5%;
  }
  .nw-qa{
    padding: 0% 3% 0% 3%;
  }
  .nw-case{
    padding: 0% 0% 0% 0%;
    margin-top: 50px  !important;
  }

  .carousel-item {
    position: relative; 
  }

  .carousel-item::after {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0, 0, 0, 0.5); /* 검은색, 투명도 0.9 */
    pointer-events: none; /* 클릭 등 이벤트 방해 안함 */
  }

  .nw-case h1{
    margin-bottom: 15px;;
    font-weight: bolder !important;
  }
  .nw-case p{
    font-size: 13px !important;
  }
  .nw-case, .nw-mws, .nw-qa{
    margin-top: 50px;
  }
  .qa-gray-card p {
    font-size: 18px !important;
    line-height: 27px !important;
  }
  .more-info-btn{
    width: 25% !important;
    font-size: 12px !important;
    margin-bottom: 3% !important;
  }
  .more-info-btn i{
    font-size: 10px !important; 
    margin-left: 2px !important;
  } 

  .checkbox-label {
    display: flex;
    align-items: flex-start; /* 중앙 정렬 대신 위쪽 정렬로 변경 */
    gap: 0.5em;
  }
  .checkbox-label {
    display: block;
    overflow: hidden; /* clearfix 역할 */
    padding-left: 25px; /* 체크박스 너비 + 간격 */
    position: relative;
  }

  .checkbox-label input {
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
  }
  #adressDetail{
    padding-left: 48px;
  }
  .qa-send-btn{
    width: 100% !important;
  }

  /* About mb */
  .about-text{
    margin-top: 45px !important;
  }
  .about-text p{
    font-size: 20px !important;
    font-weight: 600;

  }
  .about-text h1{
    font-size: 36px !important;
    margin-bottom: 15px !important;
  }
  .about-content {
    height: auto !important;
    margin-bottom: 25px !important;
  }
  .about-content p{
    font-size: 16px !important;
    line-height: 1.6 !important;
  }
  .custom-row {
    margin-left: 0; 
    margin-right: 0;
    flex-wrap: nowrap; 
  }
  .custom-col {
    flex: 0 0 50%;     
    max-width: 50%;
    padding-left: 2px !important;
    padding-right: 2px !important;
  }

  .about-content p{
    padding-left: 1%  !important;
    padding-right: 1%  !important;
  }


  .custom-col3 {
    flex: 0 0 33.3%;     
    max-width: 33.3%;    
    padding-left: 4% !important;
    padding-right: 3% !important;    
  }

  .org-chart{
    margin-left: 5% !important;
    width: 90% !important;
  }
  .simbol-info{
    padding-left: 3.5%  !important;
    padding-right: 3.5%  !important;    
    height: 200px !important;
  }

  .simbol-info h5{
    font-size: 24px !important;
    margin-bottom: 10px;
    margin-top: 25px;
  }
  .simbol-info p{
    font-size: 16px !important;
    line-height: 1.6 !important;
  }

  .mb-history{
    padding-left: 1.5%  !important;
    padding-right: 1.5%  !important;        
  }

  .mb-history h5{
    font-size: 24px !important;
    font-weight: 600;
    margin-bottom: 15px;
  }

  .mb-history, h5, li {
    color: white;
  }
  .mb-history li, ul{
    list-style-type: none;
    padding-left: 5px;
    margin-left: 5px;    
  }
  .org-chart-text{
    margin-top: 45px !important;
  }
  .org-chart-text h1{
    font-size: 36px !important;
    margin-bottom: 15px !important;
  }
  .about-text-load{
    margin-top: 45px !important;
  }
  .about-text-load h1{
    padding-left: 1%  !important;
    font-size: 36px !important;
    margin-top: 15px !important;
    margin-bottom: 15px !important;
  }
  .about-map{
    margin-left: 1.75%  !important;
    padding-right: 0px  !important;
  }

  .about-map p {
    margin-top: 5px !important;
    font-size: 16px !important;
    line-height: 1.6 !important;  
  }
  
  .about-map h4{
    margin-top: 25px !important;
    margin-bottom: 10px !important;
  }
  .bm-mws{
    margin-top: 50px !important;
    margin-bottom: 0px !important;
  }
  .bm-mws h5{
    font-size: 20px !important;
  }
  .bm-mws h3{
    font-size: 32px !important;
    margin-top: 15px !important;
    margin-bottom: 15px !important;
  }
  .bm-mws-text {
    height: 500px !important;
  }
  .step-text h1{
    font-size: 36px !important;
    margin-bottom: 15px !important;
  }
  .step-text p{
    font-size: 18px !important;
  }  

  .bm-mws-text li {
      font-size: 16px !important;
      line-height: 1.5;
      margin-left: 30px !important;
  }  
  .stepline-list{
    margin-left: 10px !important;
  }
  .stepline-date{
    font-size: 16px !important;
  }
  .stepline-descr{
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
  .case_card{
    width: 98% !important;
  }
  .case_card_title h5{
    font-size: 20px !important;
  }
  .case_img{
    height: 150px;
  }

  .btn.case_tag_btn {
      width: 75px;
  }
  .sch_categoty{
    margin-bottom: 10px !important;
  }
  .sch_box{
    margin-left: 4% !important;
    width: 92% !important;
  }
  .case_tag_btn {
    width: 75px;
    font-size: 12px !important;
    padding: 3px !important;
  }
  .btn-container{
    text-align: right !important;
    margin-bottom : 20px !important;
  }
  .noti_table{
    width: 5% !important;
    margin-left: 1% !important;
  }

  .noti_table th{
    font-size: 15px !important;
  }

  .noti_table td{
    font-size: 10px !important;
  }


  .noti_th_title   { min-width: 31vw; }
  .noti_th_num,
  .noti_th_regdate { min-width: 90px; }
  .noti_th_writer { min-width: 80px;}
  

  .stepline-list{
    width: 98% !important;
    padding-left: 25px !important;
  }
}