html {width:100%; max-width:2560px; min-width:1440px; margin:0 auto; scroll-behavior: smooth; font-size:16px}

/******************************************************************************************************************************************** 
common
*********************************************************************************************************************************************/
* {box-sizing:border-box; margin:0; padding:0; border:0; white-space:nowrap;}
html,body,div,span,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,blockquote,p,address,pre,cite,form,fieldset,table,th,td,legend,label,button {font-family:-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Pretendard Variable", "Malgun Gothic","맑은 고딕", Roboto, "Noto Sans KR", "Segoe UI", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; font-size-adjust: 0.5; font-size:16px; letter-spacing:-.05em; font-display: swap;}
body {width:100%; height:100%; margin:0 auto; -webkit-text-size-adjust:none; font-family:"Pretendard Variable"}
a, button {cursor:pointer; background:transparent}
a {display: block; text-decoration:none; white-space: nowrap; color:inherit; height: fit-content;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal; line-height:1.5}
fieldset,img,abbr,acronym,label {border:0 none}
blockquote:before,blockquote:after,q:before,q:after {content:''}
ol,ul,dl {list-style:none}
hr {display:none}
label,select,input,textarea {vertical-align:middle}
img {display:block; width:100%; height:auto}
.HIDDEN {display:none !important;}


/******************************************************************************************************************************************** 
폰트
*********************************************************************************************************************************************/
/*G마켓 BOLD*/
@font-face {
  font-family: 'GmarketSansBold';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


/******************************************************************************************************************************************** 
기타 설정
*********************************************************************************************************************************************/
/* 공통 설정 */
:root {
	--color-main: #15243d;
	--color-2: #139098;
	--color-3: #8f8976;
	--color-yellow: #ffde00;
	--number: '1688-1782';  /*✅ 번호 한번에 교체 */
  --mo-header-height: 14vw;
  --mo-header-quick-height:8.5vw;
}	

svg {fill:currentColor; stroke-width:0;}
video {width: 100%; height:auto}

/* 해상도 맞춤 */
/* 모바일, 991px이하 */
@media (max-width: 991px) {
  }  
  
  /* 울트라 와이트 해상도 */
  @media (min-width: 3440px) {
  }  
    
  /* QHD해상도 */
  @media (min-width: 2560px) {
  }
    
  /* WSXGA해상도 */
  @media (max-width: 1681px) {
    header .logo {left:10px !important}
    header .number {right:10px !important;}
  }
  
  /*LAPTOP 해상도*/
  @media (max-width: 1441px) {
  }



/******************************************************************************************************************************************** 
기타 설정
*********************************************************************************************************************************************/
header {position: fixed; top:0; width:100%; max-width:2560px; margin:0 auto; z-index: 1;}

header .header_wrap {display: flex; justify-content:space-evenly; align-items: center; }
header .lnb li a {height: 100%; width: 100%;}

/* 990px 이상일 시 */
@media(min-width:991px){
  .mo_gnb {display: none;}

@keyframes blink {
    0%, 100% {background-color: #fff;}
    50% {background-color: #fdff70;}
}
  /* 헤더 */
  header .header_wrap {justify-content:space-around; height:80px; background:rgb(0 0 0 / 30%); transition:0.2s}
	header .logo {position:absolute; left:100px; width:220px;}
	header .logo img {position: absolute; left: 0; top: 50%; transform: translateY(-50%); width:100%; transition:0.1s}
	header .logo .logo_color {opacity:0}
	header .gnb {display:flex; display:flex; align-items: center; min-width:1000px; height: 100%; margin: 0 auto}
	header .gnb li {position: relative; width:100%; height: 100%;}
  header .gnb li span {display: flex; align-items: center; justify-content: center; height: 100%; font-size: 1.15rem; font-weight: 500; color:#fff; cursor:pointer}
  
	header .number {position:absolute; right:100px; display:flex; align-items:center; border-radius:100px; padding:6px 22px; color:#fff; background:var(--color-main)}
	header .number .feather {width: 22px; height: 22px;}
	header .number p {display:none}
	header .number span {font-weight:600; font-size: 28px; padding-left: 5px; pointer-events: none;}
	header .number span:before {content:var(--number)}

  /* 드롭다운 메뉴 */
  .dropDown_menu {position:absolute; display:flex; justify-content: center; transform: scaleY(0); transform-origin: top; transition: 0.2s; min-height:180px; top:80px; width:100%; overflow:hidden; background:#fff;}
  .dropDown_menu .sub_page {width:100%; max-width:1000px; display:flex;}
  .dropDown_menu .sub_page > div {width: 100%; border-right: 1px solid #ebebeb;}
  .dropDown_menu .sub_page > div:first-child {border-left:1px solid #ebebeb;}
  .dropDown_menu .lnb li {display: flex; align-items: center; }
	.dropDown_menu .lnb li:hover {background:rgb(0 0 0 / 30%); background:var(--color-main); font-weight:500; color:#fff;}
	.dropDown_menu .lnb li a {display:flex; align-items: center; padding:13px 15px; font-size:17px}

	header .hd_bg {position:fixed; height:100vh; top:0; width:100%; max-width:2560px; transition:0.2s; pointer-events:none; z-index:-1;}

  /* hover 또는 scroll 시 */
  header .header_wrap.scroll, header .header_wrap.Hover {background:#fff;}
	header .Hover .logo_white, header .scroll .logo_white {opacity:0}
	header .Hover .logo_color, header .scroll .logo_color {opacity:1 !important}
  header .Hover .gnb > li > span, header .scroll .gnb > li > span  {color:inherit}
  header .Hover .number, header .scroll .number {background:var(--color-main);}
  header .Hover .dropDown_menu {transform: scaleY(1);}
  header .Hover .hd_bg {background: rgb(0 0 0 / 50%)} 
}

/* 모바일 메뉴버튼 */
header .menu_btn {display:none;}
.m_number, .m_registration, #menu_btn_close { display: none; }

/*MO 퀵상단*/
.mo_quick_top {display: none;}


@keyframes blink2 {
  0%, 100% {background-color: #a00e15;}
  50% {background-color: #141c41;}
}

@keyframes bell {
  0%, 100% {transform:rotate(15deg)}
  50% {transform:rotate(-15deg);}
}
 
/* 990px 이하일 시 */
@media(max-width:990px){

  /*PC 스타일 초기화*/
  html {min-width:initial;}
  .gnb {display:none;}
  .dropDown_menu {display:none;}
  .hd_bg {display: none !important}

  /* 모바일 헤더 */
  header {height:var(--mo-header-height); background: var(--color-main);}
  header .pc_quick_top {display: none;}
  header .header_wrap {height:100%; min-width:320px;}

  header .logo {width:38vw; height:auto; margin-right:8vw;}
  header .logo img {width:100%}
  header .logo .logo_color {display:none}
  header .number {position: absolute; display:flex; align-items: center; background:#b00; color:#fff; right: 2vw !important; height: 9vw; padding: 0 10px 0 8px; border-radius:99px; transition:0.2s}
  header .number:hover {filter:brightness(0.9)}
  header .number span {display:none;}
  header .number svg {padding-top: 2px; width:5vw}
  header .number p {display:block; font-weight:700; font-size: 4.5vw; letter-spacing:-1.5px;}

  /*모바일 메뉴버튼*/
  header .menu_btn {position:absolute; display:block; top:50%; transform:translateY(-50%);left:4vw; width: 28px; height: 22px; transition:0.2s}
  header .menu_btn:hover {transform: translateY(-50%) scale(1.2);}
  header .menu_btn div {position: absolute; left: 0; width: 100%; height: 2px; background-color: #fff; border-radius: 4px;}
  header .menu_btn div:nth-child(1) { top: 0; transform-origin: top left; transition: transform 0.2s ease; }
  header .menu_btn div:nth-child(2) { top: 10px; }
  header .menu_btn div:nth-child(3) { bottom: 0; transform-origin: bottom left; transition: transform 0.2s ease; }
  header .menu_btn.active div {position: absolute; }
  header .menu_btn.active div:nth-child(1) { transform: rotate(45deg); }
  header .menu_btn.active div:nth-child(2) { opacity: 0; }
  header .menu_btn.active div:nth-child(3) { transform: rotate(-45deg); }

  .mo_gnb {position: absolute; display: block; padding:3vw 3vw 80vw 3vw; top:calc(var(--mo-header-height) + var(--mo-header-quick-height)); transform: translateX(-100%);left: 0;transition:.3s ease; width:100%; height:100vh; overflow-y: auto; background: #383A38; scrollbar-width: none; z-index: 1;}
  .mo_gnb::-webkit-scrollbar {display: none;}
  .mo_gnb.open {transform: translateX(0%);}
  .mo_gnb > li {position: relative; border-bottom:1px solid #555}
  .mo_gnb > li:after {content: ""; position: absolute; right: 6vw; top:5vw; width: 1.8vw; height: 1.8vw; border-top: 0.6vw solid #C8B9AF; border-right: 0.6vw solid #C8B9AF; transform: rotate(135deg); transition:0.3s}
	.mo_gnb > li.no_after {display:none}
  .mo_gnb > li.active:after {transform: rotate(-45deg);}
  .mo_gnb li span {display:block; text-align: left; color:#fff; font-size:4.8vw; padding: 4vw 6vw; transition:0.1s; cursor:pointer}
  .mo_gnb li span:hover {background: rgb(0 0 0 / 10%);} 
  .mo_gnb li.active .lnb {display:block}
  .mo_gnb .lnb {position:relative; display:none; width:100%; background: rgb(0 0 0 / 20%);}
  .mo_gnb.lnb li:hover {background: rgb(0 0 0 / 20%);}
  .mo_gnb .lnb li a {padding:4vw 10vw; color:#C8B9AF; font-size: 4vw;}
  .mo_gnb .lnb li a:hover {background: rgb(0 0 0 / 20%);} 
  .m_number {margin-top:60px; background: #4B5055;}
  .m_number a::before {content: var(--number);}
  .m_registration {background: var(--color-main);}
  #menu_btn_close {top: auto; transform:none; left: inherit; width: inherit; height:auto; background:#222; margin-top: 10px; border-radius: 10px; cursor:pointer;}
  .m_number, .m_registration, header #menu_btn_close {display:flex; justify-content: center; border-bottom:none !important; font-weight:600}
  .m_number:after, .m_registration:after, #menu_btn_close:after {display:none}
  .m_number a, .m_registration a, #menu_btn_close a {text-align:center !important; color:#fff; font-size:5vw; padding: 4vw 0; width:100%; }

  /*MO 퀵상단*/
  .mo_quick_top {position:absolute; display: block; top:0; display:flex; justify-content: center; align-items: center; padding:3px 0; width: 100%; background-color: #ffe303; 
                height:var(--mo-header-quick-height); top:var(--mo-header-height); cursor:pointer}

  .mo_quick_top .mo-quick-top-img {display: flex; align-items: center;}
  .mo_quick_top .mo-quick-top-img img {width:100%}

  .mo_quick_top .mo-quick-top-txt {display: flex; justify-content: center; align-items: center; display:none;} /* 숨겨둠 */
  .mo_quick_top .megaphone {display:flex; align-items: center; animation: blink2 1s steps(1, end) infinite; font-weight:700; padding: 0 5px; border-radius: 20px; margin-right:5px}
  .mo_quick_top .megaphone svg {height:fit-content; fill:yellow; animation: bell 1s steps(1, end) infinite; }
  .mo_quick_top .megaphone p {color: #fff; font-weight: 800;}
  .mo_quick_top .megaphone {padding: 0.3vw 1.5vw;}
  .mo_quick_top .megaphone svg {width:3.5vw;}
  .mo_quick_top .megaphone p {font-size: 3.8vw;}
  .mo_quick_top p {font-size:4.2vw; font-weight:700; letter-spacing: 0;}
  .mo_quick_top p b {font-weight: 900;}
}





/******************************************************************************************************************************************** 
내부 컨텐츠
*********************************************************************************************************************************************/
/* 홈-pc */
.home_pc {position:relative; width:100%; height:880px;}
.home_pc .home_bg {position:absolute; width:100%; height:100%; object-fit: cover; left:0; z-index:-1}
.home_pc .home_title {position: absolute; background: rgb(255 255 255 / 80%); min-width: 380px; padding: 40px 30px; border-radius: 20px; text-align:center; cursor:default;
                      gap: 1.5rem; display: flex; flex-direction: column; top: 34%; left:10%;} /* ✅텍스트 박스 위치 */
.home_pc .home_title .sub_title {font-size:1.5rem; font-weight: 700; color: var(--color-main);}
.home_pc .home_title .main_title {font-weight: 700; font-size: 2rem; line-height: 1.2;}
.home_pc .home_title .main_title span {font-size: 3rem;}
.home_pc .home_title img {width: 200px; margin: 0 auto;}
.home_pc .home_title .txt_box {width:100%; background-color: var(--color-main); font-weight: 700; color: #fff; font-size: 1.25rem; padding: 16px 20px; border-radius: 8px;}

/* 홈-모바일 */
.home_mo {display:flex; flex-direction: column; width:100%;} 
.home_mo #db_box {background-color: color-mix(in srgb, var(--color-main) 60%, black 40%); padding: 10px;}
.home_mo #db_box iframe {width:100%;}

/* 모바일 하단 퀵버튼 */
.footer .mo_quick_bottom {display: none;}
.footer .mo_quick_bottom.arni .mo_quick_bottom_btn {display:flex; flex-direction: column; width: fit-content; cursor:pointer; pointer-events: all;}
.footer .mo_quick_bottom.arni .mo_quick_bottom_btn a:hover, .mo_quick_bottom_btn div:hover {transition:0.2s; transform:scale(1.05)}

@media(min-width:991px){
  .home_mo {position:absolute; width: 340px; margin:50px; top:150px; height:70%; overflow:scroll; overflow-x: hidden;
            border-radius: 20px; border: 8px solid #111; background:#eee; box-shadow: rgba(255, 255, 255, 0.8) 0px 5px 15px;
            display:none} /* PC에서 모바일 보이게(숨겨둠) */
  .home_mo::-webkit-scrollbar {width:4px;}
  .home_mo::-webkit-scrollbar-track {background: transparent; margin: 0px; }
  .home_mo::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.5); border-radius: 4px;}
}
@media(max-width:990px){
  .home_pc {display:none}
  .home_mo {padding-top:calc(var(--mo-header-height) + var(--mo-header-quick-height)); display:block}
  .home_mo #db_box {padding: 2.5vw;}

  /* 모바일 하단 퀵버튼 */
  .footer .mo_quick_bottom {position:sticky; display: block; bottom:-1px; left:0; width:100%;}
  .footer .mo_quick_bottom.arni  {position:fixed; pointer-events: none; z-index:1;} 
  .footer .mo_quick_bottom.arni .mo_quick_bottom_btn img {width:20vw; height:auto;}
  .footer .mo_quick_bottom.arni .mo_quick_bottom_Bubble {position:absolute; width:63vw; right:0vw; bottom: 16vw; pointer-events: none; }  /* ✅ 하단 퀵버튼 사이즈 조절 */
}




/******************************************************************************************************************************************** 
서브 페이지
*********************************************************************************************************************************************/
/*서브 페이지 상단 */
.sub_top {position:relative; display: flex; flex-direction: column; justify-content: center; width:100%; height:600px; text-align:center; margin-bottom:100px; overflow:hidden} 
.sub_top_img { position:absolute; animation: sub_top 1.5s 0s both; animation-delay:0.5s; background:url(img/sub_page/nav-bg.jpg), var(--color-main) center center no-repeat; background-size: cover; background-position: center 30%; /*background-blend-mode: multiply;*/ width:100%; height:100%; z-index:-1;}
.sub_top h2 {color:#333; font-size:56px; font-weight:bold; letter-spacing: 50px; animation: spacing-change 1.5s forwards; animation-delay:0.4s; padding-top:150px;}
.sub_top h3 {font-size:22px; color:#666; }

@keyframes sub_top {
  0% {transform: scale(1.1);}
  100% {}

}

@keyframes spacing-change {
  from {letter-spacing: 50px;}
  to {letter-spacing: 10px;}
}

/* 서브페이지 탭버튼 */
.tab {display:flex; flex-wrap: nowrap; justify-content:center; width:100%; height:44px; margin:50px 0px; padding:0 20px;}
.tab li {width:100%; max-width:200px; height:100%; border:1px solid #dbdbdb; background:#fff; transition:0.2s}
.tab li:nth-child(2),
.tab li:nth-child(3) {border-left:0;}
.tab li:hover {background:#f1f1f1;}
.tab li.on {background:var(--color-main); pointer-events: none;}
.tab li a {display:flex; align-items:center; justify-content:center; height:100%; }
.tab li.on a {color:#fff;}

/*서브페이지 */
.contents_wrap {display:flex; flex-wrap:wrap; width:100%; max-width:1000px; margin:0 auto; padding-bottom:10vw}
.contents_wrap .img_box {display: flex; flex-direction: column; width:100%; height:auto; margin:0 auto;}
.contents_wrap .img_box img {width:100%; height:auto;}
.contents_wrap .img_box h3 {width:100%; font-size:2rem; margin-bottom:10px;}
.contents_wrap .img_box ul,
.contents_wrap .img_box ul li {width:100%; height:auto; display:flex; flex-wrap:wrap; align-content:flex-start;}

/* 언론보도 */
.contents_wrap .news-board .title {justify-content:flex-start; font-size:18px; word-break: keep-all; line-height:1.2em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.contents_wrap .news-board li {position:relative; border-bottom:1px solid #dbdbdb; padding:18px; cursor:pointer}
.contents_wrap .news-board li::after {content:''; position:absolute; right:30px; display:block; width:8px; height:8px; border-right: 1px solid #333; border-top: 1px solid #333; top: 50%; transform: translateY(-50%) rotate(135deg); transition:.3s; }
.contents_wrap .news-board li.on::after  {transform:translateY(-50%) rotate(315deg);}
.contents_wrap .news-board li:first-child {border-top:1px solid #dbdbdb;}
.contents_wrap .news-board li .acd_body {display:inline-block; width:100%; height:0; overflow:hidden; transition:.3s;}
.contents_wrap .news-board li .acd_body:hover {opacity: 0.5;}
.contents_wrap .news-board li.on .acd_body {height:fit-content; padding:22px 10px 0px; }
.contents_wrap .news-board li .acd_body a {font-size:16px; font-weight:400; color:#555; line-height:1em;}


/* 유튜브 영상 */
.contents_wrap .video-container {position: relative; width: 100%; max-width: 1000px;  aspect-ratio: 16 / 9; }
.contents_wrap .video-container iframe {position: relative; width: 100%; height: 100%; top: 0; left: 0; }

/* 관심고객 */
.contents_wrap .db_box {position: relative; width: 100%; padding-bottom: 100%; height: 0; overflow: hidden;}
.contents_wrap .db_box iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}


/* 모바일 : 990px 이하일 시 */
@media(max-width:990px){
  .sub_top {padding-top:calc(var(--mo-header-height) + var(--mo-header-quick-height)); margin-bottom:0;  height:60vw;}
  .sub_top_img {background-position: right; background-size: cover;}
  .sub_top h2 {font-size:8vw; color: #353535; padding-top:0}
  .sub_top h3 {font-size: 3.2vw; color:#555}

  /* 언론보도 */
  .contents_wrap .news-board .title {width:90%;}

  /* 관심고객 */
  .contents_wrap .db_box {position: relative; width: 100%; padding-bottom: 150%; height: 0; overflow: hidden;}
}


/******************************************************************************************************************************************** 
Footer
*********************************************************************************************************************************************/
.footer {width:100%; background:#f1f1f1; padding-bottom:80px; cursor:default}
.footer .ft_wrap {display:flex; width:1400px; margin:0 auto; padding:60px 0 20px; color:#333;}
.footer .ft_box1 {display:flex; flex-direction: column; width: 70%;}
.footer .ft_box1 .title {font-size:1.75rem; font-weight:700; padding-bottom:20px;}
.footer .ft_box1 .copyright .title {font-size:revert; font-weight:revert}
.footer .ft_box1 table  {font-size: 1rem; font-weight: 500; line-height: 1.75; margin-bottom:20px}
.footer .ft_box1 tr td:nth-child(1) {width:120px; font-weight:bold;}
.footer .ft_box1 p {font-size:0.85rem; font-weight:300; line-height:1.75; opacity:0.8}
.footer .ft_box1 .copyright {padding-top:18px}

.footer .ft_box2 {display:flex; justify-content: space-between; align-items: flex-end; flex-direction: column; padding: 10px 0 0; width: 30%; height:100%;}
.footer .ft_box2 .ft_number {display: flex; align-items: center; font-size: 24px}
.footer .ft_box2 .ft_number .dynamicNumber:after {content: var(--number); position: relative;font-size:2.25rem; font-weight:700; font-family: 'GmarketSansBold'; margin-left: 10px;}
.footer .ft_box2 .info {cursor:pointer}
  
.footer .company-link {position:relative; display:flex; align-items:center; border:1px solid #dbdbdb; background:#fff; width:fit-content; padding-left:40px;
                      margin:20px 0;margin: 0 auto; cursor:pointer; border-radius: 50px; display:none}  /* 숨겨둠 */
.footer .company-link img {padding: 0 0.8rem;}
.footer .company-link p {font-weight:500; font-size:16px; padding-right:5px; letter-spacing: 1px;}
.footer .company-link b {font-size:1.5rem; margin:0 1.5rem 0 0;}
.footer .company-link_number {display:flex; align-items: center; border-radius: 100px; color:#fff; padding: 5px 38px; margin-left:1rem;
                         background:linear-gradient(127deg, rgb(83 99 114) 0%, rgba(34, 43, 52, 1) 100%)}

/*모바일 해상도*/
@media(max-width:990px) {
  .footer {padding-bottom:48vw}
  .footer .ft_wrap {flex-direction: column-reverse; width: initial; padding: 0;}
  .footer .ft_box1 {width: initial; padding:3vw 0 0 3vw}
  .footer .ft_box1 .title {font-size:5vw; padding-bottom:1rem}
  .footer .ft_box1 table {line-height: 1.5;}
  .footer .ft_box1 table tr td {font-size:3vw}
  .footer .ft_box1 table tr td:nth-child(1) {width:16vw}
  .footer .ft_box1 p {font-size: clamp(12px, 2vw, 14px); text-wrap: auto; white-space: normal; word-break: auto-phrase;}
  .footer .ft_box1 .copyright {padding-top:0; padding-bottom:20px}
  .footer .ft_box2 {width:initial; align-items: initial; padding: 9vw 2.5vw 3vw; border-bottom: 1px solid #dbdbdb;}
  .footer .ft_box2 .ft_number {font-weight: 600; line-height:1}

  /* 분양의신 푸터 */
  .footer .company-link {margin: 0 auto; padding-left: 3vw;}
  .footer .company-link p {font-size: 2.5vw; letter-spacing: 0;}
  .footer .company-link img {width:10vw; padding:0}
  .footer .company-link_number {padding:0.5vw 10px; margin-left: 5px; font-size:2.5vw}
  .footer .company-link_number b {font-size:4vw; font-weight:500; margin:0 2vw 0 0}
  .footer .ft_box2 .ft_number .dynamicNumber:after {font-size: 7vw;}
}

/* 말풍선 애니메이션 */
@keyframes scale {
  0%, 100% { transform: scale(1); }
  4%, 50% { transform: scale(1.2); }
  54%, 79% { transform: scale(1); }
}


/******************************************************************************************************************************************** 
팝업
*********************************************************************************************************************************************/
.popup_wrap {position:fixed; top:0; left:0; width: 100%; height: 100vh; z-index: 2;}
.popup ul {display: flex;}
.popup_bg {position: absolute; top: 0; z-index: -1; background-color: rgb(0 0 0 / 60%); width: 100%; height:100vh;}
.popup_close {position: absolute; display: flex; justify-content: center; align-items: center; top:10px; right:10px; color:#fff; font-size: 36px; width: 50px; height: 50px; transition:0.2s; cursor:pointer}
.popup_close:hover {transform: scale(1.3);}
.popup_skip_oneday {color: #fff;font-size: 18px; cursor:pointer;  padding:10px; background: #111; }
.popup_skip_oneday:hover {background: #000; }

/* 990px 이상일 시 */
@media(min-width:991px){
  .popup {position: absolute; display: flex; flex-direction: column; align-items: center; top: 50%; left:50%; transform: translate(-50%, -50%);}
  .popup ul {position: relative;}
  .popup ul li {position: relative;margin:10px; }
  .popup ul li img {width: 400px; max-width: 400px; box-shadow: rgba(0, 0, 0, 0.5) 0px 5px 15px;}
  .popup_skip_oneday {position: absolute; bottom: -60px; left: 50%; transform: translateX(-50%);}
}

/* 990px 이하일 시 */
@media(max-width:990px) {
  .popup_wrap {height: 100vh;}
  .popup {display: flex; justify-content: center; flex-direction: column; align-items: center; width:100%; height:100vh}
  .popup ul {align-items: center; justify-content: center; height: 70vh;}
  .popup ul li {position:absolute;}
  .popup_close {top:0; right:0;}
  .popup_skip_oneday {width:fit-content; z-index:1}
}