/* /2026/assets/css/site.css
   정리본
   - 공통 배경은 .site-bg 하나만 사용
   - PC: left/right 고정, main#center.center는 태블릿 프레임
   - PC 스크롤은 center 내부에서만 동작
   - Mobile: left/right 숨김, 일반 세로형 화면
*/

/* =========================================================
   RESET / ROOT
========================================================= */
*{ box-sizing:border-box; }

:root{
  --left-p:500px;
  --center-w:680px;
  --layout-gap:80px;
  --layout-max:1400px;
  --right-p:0px;
  --m-topbar-h:65px;
  --active-color:#f6b000;
  --green:#0f5132;
  --dark-green:#002f1b;
}

html,
body{
  margin:0;
  font-size:16px;
}

body{
  min-height:100%;
  font-size:1rem;
  line-height:1.6;
  color:#111;
  font-family:"Open Sans","Pretendard",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,
              "Apple SD Gothic Neo","Malgun Gothic",Arial,sans-serif;
  overflow-x:hidden;
  background:#eee;
}

a{ color:inherit; }
img{ max-width:100%; height:auto; }
.m-br{ display:none; }

.pc-only{ display:block; }
.m-only{ display:none; }

.site-bg{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:url('/2026/assets/img/common_bg.jpg') no-repeat center center;
  background-size:cover;
}

/* =========================================================
   MOBILE TOPBAR / DRAWER
========================================================= */
.m-topbar{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:var(--m-topbar-h);
  display:none;
  align-items:center;
  justify-content:space-between;
  padding:0 16px;
  background:#002f1bf0;
  border-bottom:1px solid rgba(255,255,255,.10);
  z-index:9999;
  transition:transform .25s ease, opacity .25s ease;
  will-change:transform;
}

.m-ci{
  display:flex;
  align-items:center;
  color:#fff;
  font-weight:900;
  letter-spacing:.2px;
}

.m-ci img{
  display:block;
  height:25px;
  width:auto;
  margin-left:10px;
}

.m-ham{
  all:unset;
  position:relative;
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.m-ham i,
.m-ham span{ display:none; }

.m-ham::before,
.m-ham::after{
  content:"";
  position:absolute;
  left:50%;
  width:24px;
  height:1px;
  background:#fff;
  transform:translateX(-50%);
  transition:transform .1s ease, top .1s ease, bottom .1s ease, opacity .2s ease;
}

.m-ham::before{
  top:18px;
  box-shadow:0 8px 0 #fff;
}

.m-ham::after{ bottom:17px; }

.m-ham[aria-expanded="true"]::before{
  top:50%;
  box-shadow:none;
  transform:translateX(-50%) rotate(45deg);
}

.m-ham[aria-expanded="true"]::after{
  bottom:47%;
  transform:translateX(-50%) rotate(-45deg);
}

.m-drawer{
  position:fixed;
  top:var(--m-topbar-h);
  right:0;
  width:78%;
  max-width:320px;
  height:calc(100vh - var(--m-topbar-h));
  display:none;
  flex-direction:column;
  gap:10px;
  padding:16px;
  background:rgba(0,0,0,.70);
  transform:translateX(100%);
  transition:transform 240ms ease;
  z-index:40;
}

.m-link{
  padding:12px 10px;
  color:#fff;
  text-decoration:none;
  font-weight:700;
  transition:color .2s ease, background .2s ease;
}

.m-link:hover{ background:rgba(255,255,255,.10); }
.m-link.is-active{
  color:var(--active-color);
  font-weight:800;
}

.m-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.35);
  opacity:0;
  pointer-events:none;
  transition:opacity 240ms ease;
  z-index:35;
}

body.m-open .m-drawer{ transform:translateX(0); }
body.m-open .m-backdrop{
  opacity:1;
  pointer-events:auto;
}

body.mtopbar-hidden #mTopbar,
#mTopbar.is-hidden{
  transform:translateY(-100%);
  opacity:.98;
  pointer-events:none;
}

/* =========================================================
   PC LEFT / RIGHT
========================================================= */
.left,
.right{
  position:fixed;
  top:0;
  height:100vh;
  padding:26px 30px;
  z-index:10;
  color:#fff;
  background:transparent;
}


.left{
  left:calc(55% - (var(--layout-max) / 2));
  width:var(--left-p);
  display:flex;
  flex-direction:column;
  justify-content:flex-start;

  padding-bottom:30px;
  overflow-y:auto;
  scrollbar-width:none;
}
.left::-webkit-scrollbar{ display:none; }

.right{
  right:0;
  width:var(--right-p);
  padding:26px 22px;
}

.ci{
  display:block;
  flex:0 0 auto;
  margin-bottom:45px;
  padding-top:15px;
  padding-left:0;
  margin-left:-25px;
}

.ci img{
  width:115px;
  height:auto;
  display:block;
}

/* =========================================================
   PC NAV
========================================================= */
.nav{
  display:flex;
  flex-direction:column;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:flex-start;
  gap:0px;
  margin-bottom:35px;
  font-family: futura-pt-bold, sans-serif;
  font-weight:700;
}

.nav-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  padding:0 20px 10px 0;
  color:#fff;
  text-decoration:none;
  white-space:nowrap;
  font-size:1.5rem;
  font-weight:700;
  transition:color .2s ease;
}

.nav-link span{
  position:relative;
  display:inline-block;
  transition:transform .2s ease;
}

.nav-link span::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0px;
  height:1px;
  background:transparent;
  border-radius:2px;
  transition:background .2s ease;
}


.nav-link.is-active{

  background:transparent !important;
  border:0 !important;
  font-size:1.5rem;
  font-weight:700;
}

.nav-link.is-active span{ transform:scale(1.06); }


/* =========================================================
   LEFT FOOT
========================================================= */
.left-foot{
  margin-top:auto;
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  gap:10px;
  transform:none;
      margin-left: 95px;
}

.left-foot .event_title img{
  display:block;
  max-width:85%;
  height:auto;
}

.left-foot .event_text{
  margin-bottom:80px;
  font-size:clamp(15px,1.5vw,24px);
  font-weight:700;
}

.left-foot .sns{
  display:flex;
  gap:10px;
  align-items:center;
}

.left-foot .sns a,
.m-foot .sns a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:rgba(255,255,255,.55);
  text-decoration:none !important;
  transition:color .2s ease, opacity .2s ease;
}

.left-foot .sns a i{ font-size:16px; }

.left-foot .sns a svg{
  width:16px;
  height:16px;
  fill:rgba(255,255,255,.55);
  transition:fill .2s ease;
}

.left-foot .sns a:hover{ color:#fff; }
.left-foot .sns a:hover svg{ fill:#fff; }

.address h3{
  margin-bottom:0;
  padding-bottom:0;
  color:rgba(255,255,255,.8);
  font-size:.9rem;
  font-weight:600;
}

.address h4{
  margin-top:0;
  padding-top:0;
  color:rgba(255,255,255,.5);
  font-size:.7rem;
  font-weight:600;
  word-break:keep-all;
}

.address h5 a{
  margin-top:0;
  padding-top:0;
  color:rgba(255,255,255,.8);
  font-size:.8rem;
  font-weight:600;
  text-decoration:none;
  word-break:keep-all;
}

.m-foot{ display:none; }

/* =========================================================
   CENTER TABLET FRAME - PC
========================================================= */
@media (min-width:901px){


main#center.center{
  position:fixed !important;
  top:20px;
  bottom:0;

  left:50%;
  margin-left:calc((var(--left-p) + var(--layout-gap)) / 2);
  transform:translateX(-50%);

  width:var(--center-w) !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    z-index:2;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    border-radius:36px 36px 0 0;
    background:rgba(0,0,0,.90) !important;

    backdrop-filter:blur(18px) saturate(120%);
    -webkit-backdrop-filter:blur(18px) saturate(120%);

    border-left:1px solid rgba(255,255,255,.12) !important;
    border-right:1px solid rgba(255,255,255,.08) !important;

    box-shadow:
      0 22px 60px rgba(0,0,0,.32),
      0 0 0 1px rgba(255,255,255,.16) inset;

    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  main#center.center::-webkit-scrollbar{ display:none; }

  main#center.center .sec{
    width:100%;
    height:auto;
  }

  main#center.center #sec0{
    width:100% !important;
    min-height:100vh !important;
    margin:0 !important;
    border-radius:0 !important;
    overflow:hidden;
  }
}

/* =========================================================
   SECTIONS COMMON
========================================================= */
.center{
  position:relative;
  z-index:2;
}

.sec{
  /* min-height:100vh; */
  height:auto;
  display:flex;
  align-items:flex-start;
  padding:0;
  background:transparent;
}

.sec-inner{
  width:100%;
  padding:45px;
  color:#fff;
  background:transparent;
  border:0;
}

.sec-inner h1{
  margin:0px 0 10px;
  padding-bottom:0px;

  line-height:1.2;

  text-align:center;
  word-break:keep-all;
  font-weight:800;
  color:#f4c34d;
}

.sec-inner .main_logo h1{
  margin:0 0 10px;
  padding-bottom:20px;
  font-size:35px;
  line-height:1.2;
  letter-spacing:-.5px;
  text-align:center;
  word-break:keep-all;
  font-weight:800;
  color:#fff;
}



.sec-inner h1 span{
  margin:0 0 10px;
  padding-bottom:20px;
  font-size:30px;
  line-height:1.2;
  letter-spacing:-.5px;
  text-align:center;
  word-break:keep-all;
  font-weight:500;
  color:#fff;
}

.sec-inner h2{
  padding-bottom:0;
  letter-spacing:-.5px;
  line-height:1.3;
  word-break:keep-all;
}

.sec-inner p{
  margin:0 0 8px;
  font-size:1rem;
  line-height:1.5;
  opacity:.92;
  word-break:keep-all;
}

/* =========================================================
   SEC0 HERO / YOUTUBE
========================================================= */
#sec0{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  overflow:hidden;
}

#sec0 .ytbg,
#sec0 .ytbg-dim{
  position:absolute;
  inset:0;
}

#sec0 .ytbg{
  z-index:0;
  overflow:hidden;
}

#sec0 .ytbg-dim{
  z-index:1;
  background:rgba(0,0,0,.55);
}

#sec0 .ytbg iframe{
  position:absolute;
  top:50%;
  left:50%;
  width:177.7777778vh;
  height:100vh;
  min-width:100vw;
  min-height:56.25vw;
  transform:translate(-50%,-50%);
  border:0;
  pointer-events:none;
}

#sec0 .sec-inner{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:center;
  width:100%;
}

#sec0 .main_logo{
  display:flex;
  z-index:2;
  flex-direction:column;
  margin-bottom:30px;
  align-items: center;
  text-align: center;
}

#sec0 .main_logo h1,
#sec0 .main_logo h2{ margin:0; }

#sec0 .main_logo h1{
  font-size:4em;
    font-family: futura-pt-bold, sans-serif;
    line-height: 0.9;

}


@media (max-width:820px){
#sec0 .main_logo h1{
  font-size:3.5em;

}
}


#sec0 .main_logo img.y_logo{
  max-width:120px;
  margin-bottom:50px;
}

#sec0 .main_logo img.y_title{ margin-bottom:24px; }

#sec0 .main_logo .y_text{
  font-size:1rem;
  line-height:1.3;
  font-weight:600;
}

.hero-dday-bar{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  z-index:30;
  background:rgba(0,0,0,.82);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.hero-dday-inner{
  width:100%;
  max-width:100%;
  margin:0;
  padding:18px 40px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:34px;
  box-sizing:border-box;
}

.hero-dday-timebox{
  display:flex;
  align-items:center;
  gap:18px;
  color:#fff;
  font-family:"Pretendard";
  font-size:28px;
  font-weight:800;
  line-height:1;
  letter-spacing:1px;
  white-space:nowrap;
}

.dday_div{ opacity:.6; }

.hero-dday-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:190px;
  height:56px;
  padding:0 26px;
  border:2px solid #fff;
  border-radius:999px;
  color:#fff;
  text-decoration:none;
  font-size:16px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  transition:all .2s ease;
}

.hero-dday-btn:hover{
  background:#fff;
  color:#000;
}

.main_count_box{
  display:inline-block;
  margin-top:20px;
  padding:10px 0;
  font-weight:600;
  font-size:1em;
  line-height:1.5;
}







.main_count_box p{
  margin:0;
  display:flex;
  align-items:center;
  color:#ddd;
  font-size:18px;
  line-height:1.2;
  letter-spacing:.5px;
}

.main_count_box span{
  margin:0 4px;
  color:#FFD34D;
  font-family:"Pretendard";
  font-size:35px;
  font-weight:700;
}

/* =========================================================
   SEC1
========================================================= */
.center #sec1{
  height:100vh;
  display:flex;
  align-items:center;
  position:relative;
  overflow:visible;
  pointer-events:none;
    background:
      linear-gradient(
        to bottom,
        rgba(0,0,0,.35),
        rgba(0,0,0,.55)
      ),
      url('/2026/assets/img/sec1_bg2.jpg') no-repeat center center;

    background-size:cover;


}

.center #sec1 .sec-inner{
  position:relative;
  z-index:2;
}

.center #sec1 h1 img{
  display:block;
  width:75%;
  max-width:600px;
  margin:0 auto;
  padding:25px 0;
}

.center #sec1 img.flogo{
  display:block;
  width:80%;
  max-width:260px;
  margin:0 auto;
  padding:50px 0;
}

.center #sec1 p{
    display: block;
    color: #fff;
    text-align: center;
    font-size: 0.97rem;
    line-height: 1.4;
    font-weight: 500;
    word-break: keep-all;
}

@media (min-width:769px){
  .center #sec1 h1 img{ width:400px; }





}

/* =========================================================
   SEC2
========================================================= */
.center #sec2 .sec-inner img.bklogo{
  display:block;
  width:60%;
  max-width:220px;
  padding:0 0 70px;
}

.center #sec2 .sec-inner h2{
  font-size:1.2rem !important;
}

.center #sec2 p img{
  width:100%;
  padding-top:20px;
}

/* =========================================================
   SEC3 GALLERY
========================================================= */
#sec3{
  height:auto !important;
  overflow:visible !important;
}

#sec3.sec{
  align-items:stretch !important;
}



#sec3 .sec-inner > h1{
  flex:0 0 auto !important;
  margin:0 0 12px !important;
  padding:0 !important;
}


#sec3 .sec-inner > .row{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
}

#sec3 .gallery{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  align-items:stretch;
  column-count:initial !important;
  column-gap:0 !important;
}

#sec3 .gallery > .items,
#sec3 .gallery > [class*="col-"]{
  margin:0 !important;
  padding:0 !important;
  height:20vh;
  min-height:23vh !important;
  width:auto !important;
  max-width:none !important;
}

#sec3 .gallery > .items.is-wide,
#sec3 .gallery > .is-wide{
  grid-column:span 2;
}

#sec3 .item-img,
#sec3 .item-img > a,
#sec3 .item-img a{
  display:block;
  width:100% !important;
  height:100% !important;
}

#sec3 .item-img{
  position:relative;
  overflow:hidden;
  background:transparent !important;
}

#sec3 .item-img img{
  display:block;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  padding:0 5px;
}

#sec3 .item-img-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:rgba(0,0,0,.55);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}

#sec3 .item-img-overlay,
#sec3 .item-img-overlay *{
  color:#fff !important;
  margin:0;
}

#sec3 .overlay-info{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .35s ease, transform .35s ease;
}

#sec3 .overlay-info h4{ font-size:1.2em; }

#sec3 .item-img:hover .item-img-overlay{ opacity:1; }
#sec3 .item-img:hover .overlay-info{
  opacity:1;
  transform:translateY(0);
}

@media (max-height:700px){
  #sec3 .gallery > .items,
  #sec3 .gallery > [class*="col-"]{
    height:160px !important;
    min-height:160px !important;
  }
}

/* =========================================================
   BOARD EMBED / SEC5
========================================================= */
.notice-sec5-root,
.notice-sec5-root *{
  max-width:100%;
  font-family:"Pretendard",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,
              "Apple SD Gothic Neo","Malgun Gothic",Arial,sans-serif !important;
}

.notice-sec5-root,
.notice-sec5-root .board-wrap,
.notice-sec5-root .board-table{
  overflow-x:hidden !important;
}

.notice-sec5-root .tbl{
  width:100% !important;
  min-width:0 !important;
  table-layout:fixed !important;
  border-collapse:collapse;
}

.notice-sec5-root .board-list-only .tbl td{
  padding:0;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.notice-sec5-root .board-list-only .ttl{
  display:block;
  padding:16px 0;
  color:rgba(255,255,255,.92);
  text-decoration:none;
  overflow:hidden;
}

.notice-sec5-root .board-list-only .ttl:hover{ background:rgba(255,255,255,.06); }

.notice-sec5-root .board_ttl{
  display:block;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-weight:600;
  line-height:1.35;
}

.notice-sec5-root .board_date{
  display:block;
  margin-top:4px;
  font-size:12px;
  opacity:.7;
  white-space:nowrap;
}

.notice-sec5-root .empty{
  padding:16px 0;
  text-align:center;
  opacity:.85;
}

.notice-sec5-root .paging-ajax{
  margin-top:14px;
  text-align:center;
}

.notice-sec5-root .pg-btn{
  display:inline-block;
  margin:0 3px;
  padding:6px 10px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.9);
  font-size:12px;
  cursor:pointer;
}

.notice-sec5-root .pg-btn:hover{ background:rgba(255,255,255,.12); }
.notice-sec5-root .pg-btn[disabled]{
  opacity:.35;
  cursor:default;
}
.notice-sec5-root .pg-btn.is-active{ background:rgba(255,255,255,.16); }

.notice-sec5-root .view-title{
  margin-bottom:8px;
  font-size:18px;
  font-weight:900;
  line-height:1.35;
}

.notice-sec5-root .view-date{
  margin-bottom:12px;
  font-size:12px;
  opacity:.75;
}

.notice-sec5-root .view-content{
  font-size:14px;
  line-height:1.7;
  opacity:.95;
  overflow-wrap:anywhere;
}

.notice-sec5-root .view-content,
.notice-sec5-root .view-content *{ color:#fff !important; }

.notice-sec5-root .view-content a{
  color:#fff !important;
  text-decoration:underline;
}

.notice-sec5-root .view-content span,
.notice-sec5-root .view-content div,
.notice-sec5-root .view-content p{
  background:transparent !important;
}

.notice-sec5-root .view-actions{
  margin-top:14px;
  text-align:center;
}

.notice-sec5-root .btn-back,
.btn-more{
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.9);
  cursor:pointer;
}

.notice-sec5-root .btn-back{
  padding:8px 14px;
}

.notice-sec5-root .btn-back:hover,
.btn-more:hover{ background:rgba(255,255,255,.12); }

.board-more{
  margin:14px 0 6px;
  text-align:center;
}

.btn-more{
  margin-top:20px;
  padding:10px 14px;
  border-radius:12px;
  font-weight:800;
}

.btn-more:disabled{
  opacity:.65;
  cursor:default;
}

.board-wrap.board-ajax,
#sec5,
#sec5 .sec-inner,
#notice-sec5-root{
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}

/* =========================================================
   SEC6 WINNER
========================================================= */
#sec6{ container-type:inline-size; }
#sec6 .sec-inner{ text-align:center; }

#sec6 .sec-inner p{
  text-align:center;
  font-size:18px;
  line-height:1.3;
  word-break:keep-all;
}

#sec6 .sec-inner p.sub{ padding-bottom:5px; }

#sec6 .sec-inner h2{
  margin:10px;
  padding-top:20px;
  color:#f4c34d;
  text-align:center;
  font-size:22px;
  line-height:1;
  word-break:keep-all;
    font-family:      "futura-pt",      "Pretendard",      sans-serif !important;

}

#sec6 .sec-inner img,
#sec6 .win-result img,
#sec6 .win-wrap img{
  display:block;
  max-width:100%;
  height:auto;
  margin:0 auto;
}

#sec6 .win-result{ margin-bottom:24px; }

.win-result p{
  margin-bottom:20px;
  font-weight:600;
}

.sec6-loading,
.sec6-error,
#sec6 .sec6-loading,
#sec6 .sec6-error{
  padding:20px;
  text-align:center;
  opacity:.8;
}

#sec6 .sec-inner .sec_title{
  display:inline-block;
  white-space:nowrap;
  font-size:40px;
  font-weight:900;
  letter-spacing:-.03em;
  transform:none;
  color:#f4c34d;
    font-family:      "futura-pt",      "Pretendard",      sans-serif !important;

}

#sec6 .win-year{ display:none; }
#sec6 .win-year.is-on{ display:block; }

#sec6 .win-wrap{
  max-width:1100px;
  margin:0 auto;
  padding:0;
  text-align:center;
}

#sec6 .win-wrap h2{ margin:0 0 10px; }
#sec6 .win-wrap p{
  margin:0 0 20px;
  font-weight:600;
}

#sec6 #winDetail[hidden]{ display:none; }

#sec6 .win-tabs-wrap{
  position:sticky;
  top:0;
  z-index:50;
  margin:14px 0;
  padding:10px 12px;
  background:rgba(0,0,0,.6);
  border-top:1px solid rgba(255,255,255,.30);
  border-bottom:1px solid rgba(255,255,255,.30);
  overflow:hidden;
}

#sec6 .win-tabs{
  display:flex;
  flex-wrap:nowrap;
  justify-content:flex-start;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  touch-action:pan-x;
  overscroll-behavior-x:contain;
  scroll-behavior:smooth;
  padding:0 18px;
  margin:0;
  background:transparent;
  cursor:grab;
  user-select:none;
}

#sec6 .win-tabs::-webkit-scrollbar{ display:none; }
#sec6 .win-tabs.is-dragging{ cursor:grabbing; }

#sec6 .win-tab{
  flex:0 0 auto;
  white-space:nowrap;
  background:transparent;
  color:rgba(255,255,255,.55);
  padding:8px 10px;
  border:0;
  border-radius:0;
  font-size:15px;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  user-select:none;
}

#sec6 .win-tab:hover,
#sec6 .win-tab.is-active{
  color:#ebb234;
}

#sec6 .win-tab.is-active{ font-weight:800; }

#sec6 .win-tabs-wrap::before,
#sec6 .win-tabs-wrap::after{
  content:"";
  position:absolute;
  top:0;
  width:22px;
  height:100%;
  pointer-events:none;
  z-index:10;
}

#sec6 .win-tabs-wrap::before{
  left:0;
  background:linear-gradient(to right,rgba(0,0,0,.22),rgba(0,0,0,0));
}

#sec6 .win-tabs-wrap::after{
  right:0;
  background:linear-gradient(to left,rgba(0,0,0,.22),rgba(0,0,0,0));
}

#sec6 .win-year.is-on img{
  padding:10px 0;
  background:#fff;
  margin:20px 0;
}

@container (max-width:520px){ #sec6 .sec-inner p{ font-size:16px; } }
@container (max-width:420px){ #sec6 .sec-inner p{ font-size:16px; } }
@container (max-width:360px){ #sec6 .sec-inner p{ font-size:13px; } }

/* =========================================================
   RESEARCH / SEC R
========================================================= */
#secR.sec{
  min-height:100vh !important;
  height:auto !important;
  padding-bottom:40px !important;
  align-items:center !important;
    position:relative;
    overflow:hidden;

    background:url('/2026/assets/img/re_bg.jpg') center center / cover no-repeat !important;
}


#secR.sec::before{
    content:'';
    position:absolute;
    inset:0;
    background:rgba(0,0,0,0.45); /* 45% 어둡게 */
    z-index:1;
}


#secR .sec-inner{
    position:relative;
    z-index:2;
}

@supports (min-height:100dvh){
  #secR.sec{ min-height:100dvh !important; }
}

#secR .sec-inner{
  max-height:none !important;
  overflow:visible !important;
  padding:25px;
}

#secR .dday-wrap{
  display:flex;
  justify-content:center;
  padding:40px 0;
  margin-top:2vh;
}

#secR .dday-card{
  width:94%;
  max-width:560px;
  border-radius:20px;
  padding:26px 22px;
  text-align:center;
}

#secR .dday-badge{
  display:inline-block;
  padding:6px 12px;
  border-radius:999px;
  background:#fff;
  color:#660001;
  font-weight:700;
  font-size:16px;
  margin-bottom:50px;
}

#secR .dday-title{
  margin:0 0 10px;
  font-size:20px;
  font-weight:900;
}

#secR .dday-counter{ margin-top:10px; }

#secR .dday-day{
  font-family:"Roboto",sans-serif;
  font-size:90px;
  font-weight:900;
  line-height:1.5;
  letter-spacing:-.5px;
}

#secR .dday-time{
  font-family:"Roboto",sans-serif;
  font-size:20px;
  font-weight:300;
  opacity:.85;
  letter-spacing:1px;
}

.re_nav{
  margin:10px auto 18px;
  display:flex;
  justify-content:center;
}

.re_nav .re_tabs{
  list-style:none;
  margin:0;
  padding:6px;
  display:flex;
  gap:6px;
  width:100% !important;
  max-width:none !important;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.10);
  border-radius:999px;
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}

.re_nav .re_tabs > li{
  flex:1 1 0;
  min-width:0;
  background:transparent;
  border:0;
  padding:0;
  height:auto;
  border-radius:0;
}

.re_nav .re_tab{
  display:flex;
  align-items:center;
  justify-content:center;
  height:44px;
  padding:0 14px;
  border-radius:999px;
  color:#111;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(0,0,0,.10);
  text-decoration:none;
  font-weight:800;
  font-size:14px;
  transition:background .15s ease, color .15s ease, transform .12s ease, box-shadow .15s ease;
}

.re_nav .re_tab:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 14px rgba(0,0,0,.12);
}

.re_nav .re_tab.is-active{
  background:#b8871f;
  color:#fff;
  border-color:rgba(0,0,0,.10);
  box-shadow:0 10px 22px rgba(179, 171, 63, 0.28);
}

.rsv2-desc{
  padding-top:20px;
  text-align:center;
  font-size:1.5rem;
  line-height:1.3;
  font-weight:700;
  word-break:keep-all;
}

.sub_cmt{
  margin:0 0 35px;
  padding:14px 16px;
  border-radius:14px;
  background:#f6f7f8;
  border:1px solid rgba(0,0,0,.06);
  color:#222;
  font-size:14px;
  line-height:1.55;
  text-align:left;
  white-space:normal;
}

.sub_cmt ul{
  margin:0;
  padding:0;
  list-style:none;
}

.sub_cmt li{
  position:relative;
  padding-left:18px;
  margin:6px 0;
  word-break:keep-all;
  overflow-wrap:anywhere;
}

.sub_cmt li::before{
  content:"•";
  position:absolute;
  left:0;
  top:0;
  color:var(--green);
  font-weight:900;
  line-height:1.55;
}

.rsv2-row{
  display:flex;
  flex-wrap:wrap;
  gap:5px 12px;
  align-items:flex-start;
}

.rsv2-row.ct{ justify-content:center; }

.rsv2-row.flex-center{
  align-items:center;
  justify-content:center;
  align-content:center;
  flex-direction:column;
  text-align:center;
}

.rsv2-row input[type="radio"]{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.rsv2-row > label:has(input[type="radio"]){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:90px;
  height:44px;
  padding:0 14px;
  border-radius:12px;
  border:1.5px solid #d0d5d8;
  background:#fff;
  color:#555;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  user-select:none;
  transition:background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}

.rsv2-row > label:has(input[type="radio"]):hover{ border-color:var(--green); }

.rsv2-row > label:has(input[type="radio"]:checked){
  background:var(--green);
  border-color:var(--green);
  color:#fff;
  box-shadow:0 6px 14px rgba(0,0,0,.15);
}

.rsv2-row > label:has(input[type="radio"]):active{ transform:translateY(1px); }

.rsv2-row > label.rsv2-l{
  flex:0 0 100%;
  width:100%;
  margin:4px 0 2px;
  padding:0;
  min-width:auto;
  height:auto;
  border:none;
  background:none;
  box-shadow:none;
  color:#111;
  font-weight:800;
  cursor:default;
}

.rsv2-row > label i{
  font-size:1.1rem;
  padding-right:10px;
}

.ok_box{
  max-width:520px;
  margin:80px auto;
  padding:28px;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  text-align:center;
}

.ok{ color:#0a7a3a; font-weight:700; }

.ok_btn{
  display:inline-block;
  margin-top:18px;
  padding:10px 14px;
  border-radius:10px;
  background:#111;
  color:#fff;
  text-decoration:none;
}

.event_img{ margin-top:50px; }
.event_img img{ max-width:100%; }

/* =========================================================
   MODALS
========================================================= */
.rsv2-help-modal,
.rsv2-event-modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:99999;
}

.rsv2-help-modal{
  z-index:9999;
  opacity:0;
  pointer-events:none;
}

.rsv2-help-modal.is-open{
  display:block;
  opacity:1;
  pointer-events:auto;
}

.rsv2-event-modal.is-open{ display:block; }

.rsv2-help-dim,
.rsv2-event-dim{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.42);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

.rsv2-event-dim{
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}

.rsv2-help-panel,
.rsv2-event-panel{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  background:#fff;
  overflow:hidden;
}

.rsv2-help-panel{
  transform:translate(-50%,-46%);
  width:min(560px,calc(100% - 28px));
  max-height:calc(100% - 28px);
  border-radius:18px;
  display:flex;
  flex-direction:column;
  box-shadow:0 26px 60px rgba(0,0,0,.28), 0 2px 0 rgba(255,255,255,.35) inset;
  animation:rsv2PopUp .22s cubic-bezier(.2,.9,.2,1) both;
}

.rsv2-event-panel{
  width:min(920px,calc(100vw - 32px));
  max-height:calc(100vh - 40px);
  border-radius:20px;
  box-shadow:0 20px 60px rgba(0,0,0,.3);
}

.rsv2-help-dim{ animation:rsv2FadeIn .18s ease-out both; }

.rsv2-help-head,
.rsv2-event-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:16px 20px;
  color:#333;
  background:#fff;
}

.rsv2-event-head{ border-bottom:1px solid rgba(0,0,0,.08); }

.rsv2-help-head h3,
.rsv2-event-head h3{
  margin:0;
  font-weight:700;
  letter-spacing:-.2px;
}

.rsv2-event-head h3{ font-size:20px; }

.rsv2-help-close,
.rsv2-event-close{
  border:0 !important;
  background:transparent !important;
  cursor:pointer;
  line-height:1;
}

.rsv2-help-close{
  width:36px;
  height:36px;
  border-radius:12px;
  color:#000 !important;
  font-size:22px;
}

.rsv2-help-close:hover{ background:rgba(0,0,0,.26) !important; }

.rsv2-event-close{ font-size:24px; }

.rsv2-help-body{
  overflow:auto;
  color:#111;
  font-size:14px;
  line-height:1.65;
}

.rsv2-help-body img,
.rsv2-event-body img{
  display:block;
  width:100%;
  height:auto;
}

.rsv2-event-body{
  max-height:calc(100vh - 120px);
  overflow:auto;
  background:#fff;
}

.rsv2-event-body img{ max-width:1000px; }

.rsv2-help-body strong{ font-weight:900; }

.rsv2-help-list{
  margin:0;
  padding-left:18px;
}

.rsv2-help-list li{ margin:8px 0; }

.rsv2-help-foot{
  padding:12px 16px 16px;
  border-top:1px solid rgba(0,0,0,.08);
  display:flex;
  justify-content:flex-end;
  gap:10px;
}

.rsv2-help-ok{
  border:1px solid rgba(0,0,0,.10);
  background:var(--dark-green);
  color:#fff;
  border-radius:14px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(0,47,28,.18);
}

.rsv2-help-ok:hover{ filter:brightness(1.05); }

/* =========================================================
   LIVERE
========================================================= */
.rsv2-livere-wrap{
  margin-top:24px;
  padding:20px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  background:#fff;
}

.rsv2-livere-title{
  margin-bottom:14px;
  color:#111;
  font-size:18px;
  font-weight:700;
}

.rsv2-livere-wrap livere-comment{
  display:block;
  min-height:160px;
}

/* =========================================================
   ANIMATIONS
========================================================= */
@keyframes rsv2FadeIn{
  from{ opacity:0; }
  to{ opacity:1; }
}

@keyframes rsv2PopUp{
  from{ opacity:0; transform:translate(-50%,-42%) scale(.98); }
  to{ opacity:1; transform:translate(-50%,-46%) scale(1); }
}

@media (prefers-reduced-motion:reduce){
  .rsv2-help-dim,
  .rsv2-help-panel{ animation:none !important; }
}

/* =========================================================
   MOBILE
========================================================= */
@media (max-width:900px){
  html,
  body{
    height:auto;
    overflow-y:auto !important;
  }

  .left,
  .right{
    display:none !important;
    position:static !important;
    width:0 !important;
    height:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
  }

  .m-topbar{ display:flex; }
  .m-drawer{ display:flex; }

  main#center.center,
  .center{
  width:100%;
  margin:0;
  padding-top:0 !important;
  background:#000;
  border-left:0;
  border-right:0;
  }

  .sec{
    padding:14px 14px 0 !important;
  }

  .sec-inner h1{ font-size:28px; }

  .m-foot{
    display:block;
    position:relative;
    left:0;
    right:0;
    bottom:0;
    z-index:9999;
    color:#fff;
    padding:14px 20px 18px;
    background:rgba(0,0,0,.35);
    backdrop-filter:blur(6px);
  }

  #center{ padding-bottom:0; }
}

@media (max-width:820px){
  .left-foot{ display:none; }
}

@media (max-width:768px){
  .m-br{ display:inline; }
  .pc-only{ display:none; }
  .m-only{ display:block; }

  .sec-inner{ padding:25px; }

  .sec-inner h1{ font-size:30px; }

  .sec-inner p{
    font-size:.8rem;
    line-height:1.5;
  }

  #sec0 .ytbg iframe{
    width:100vw;
    height:calc(100vw * 9 / 16);
    min-height:100vh;
    min-width:calc(100vh * 16 / 9);
  }

  #sec0 .main_logo{
    margin-bottom:150px;
  }

  #sec0 .main_logo img.y_logo{ max-width:115px; }
  #sec0 .main_logo img.y_title{ max-width:70%; }

  #sec0 .main_logo .y_text{
    font-size:.8rem;
    line-height:1.4;
  }

  .hero-dday-inner{
    padding:14px 18px;
    gap:16px;
    justify-content:space-between;
  }

  .hero-dday-timebox{
    gap:10px;
    font-size:18px;
  }

  .hero-dday-btn{
    min-width:auto;
    height:44px;
    padding:0 16px;
    font-size:13px;
  }

  .center #sec1 p{ font-size:.9rem; }

  #sec3 .sec-inner{ padding:16px 0; }

  #sec3 .gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  #sec3 .gallery > .items,
  #sec3 .gallery > [class*="col-"]{
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:1 / 1;
  }

  #sec3 .gallery > .items.is-wide,
  #sec3 .gallery > .is-wide{
    grid-column:span 1 !important;
  }

  #sec3 .item-img img{ padding:0 10px; }

  #sec6 .sec-inner .sec_title{ font-size:30px; }
}

@media (max-width:480px){
  .sub_cmt{
    padding:12px 14px;
    border-radius:12px;
    font-size:13px;
    line-height:1.6;
  }

  .sub_cmt li{
    padding-left:16px;
    margin:5px 0;
  }
}

@media (max-width:420px){
  .re_nav .re_tabs{
    padding:5px;
    gap:5px;
  }

  .re_nav .re_tab{
    height:42px;
    font-size:13px;
  }

  .rsv2-help-panel{
    width:calc(100% - 20px);
    border-radius:16px;
  }
}



/* =========================
   INDEX COMMON BACKGROUND
   스샷형 상단 레드 + 하단 밝은 배경
========================= */

body.is-index{
  background:#efedef !important;
}

/* 상단 붉은 배경 */
body.is-index::before{
  content:"";
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:200px;
  z-index:0;
  pointer-events:none;


}

/* 붉은 곡선 이미지 */
body.is-index::after{
  content:"";
  position:fixed;

  top:0;
  left:0;

  width:100%;
  height:200px;

  z-index:1;
  pointer-events:none;

  background:url('/2026/assets/img/top_bg.jpg') no-repeat center top;
  background-size:cover;
}

/* 좌측, 중앙 컨텐츠는 배경 위로 */
body.is-index .left,
body.is-index .right,
body.is-index main#center.center,
body.is-index .m-topbar,
body.is-index .m-drawer{
  z-index:10;
}

/* PC 좌측 영역은 밝은 배경 위에 놓이도록 */
@media (min-width:901px){
  body.is-index .left{
    color:#6d0000;
  }

  body.is-index .left .nav-link{
    color:rgba(105,0,0,.42);
  }

  body.is-index .left .nav-link:hover,
  body.is-index .left .nav-link.is-active{
    color:#6d0000;
  }

  body.is-index .left .nav-link.is-active span::after{
    background:#6d0000;
  }
}



/* =========================
   TABLET BOTTOM DOCK
========================= */

main#center.center{
  position:fixed;
}

/* 하단 아이콘 바 */
.tablet-dock{
  position:sticky;
  bottom:0;

  display:flex;
  align-items:center;
  justify-content:space-around;

  width:100%;
  height:92px;

  margin-top:-92px;

  z-index:300;

  border-top:1px solid rgba(255,255,255,.08);

  background:rgba(120,120,120,.88);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);

  border-radius:28px 28px 0 0;

  box-shadow:
    0 -4px 20px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.08);
}

/* 아이콘 */
.dock-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;

  width:20%;
  height:100%;

  color:rgba(255,255,255,.72);
  text-decoration:none;

  font-size:11px;
  font-weight:600;

  transition:.25s ease;
}

.dock-item i{
  font-size:20px;
}

.dock-item:hover{
  color:#fff;
}

.dock-item.is-active{
  color:#fff;
}

/* active 밑줄 */
.dock-item.is-active::after{
  content:"";
  position:absolute;
  bottom:10px;

  width:44px;
  height:3px;

  border-radius:10px;
  background:#fff;
}

/* 마지막 섹션 아래 dock 공간 확보 */
main#center.center .sec:last-child{
  padding-bottom:120px;
}


/* research도 tablet frame 안에서 사용 */
body.is-research main#center.center{
  z-index:10;
}

body.is-research #secR{
  min-height:100vh !important;
  padding-bottom:110px !important;
}

body.is-research .tablet-dock{
  z-index:500;
}


/* =========================
   CENTER TABLET FRAME
========================= */

/* PC만 tablet */
@media (min-width:901px){

  html,
  body{
    height:100%;
    overflow:hidden !important;
  }

main#center.center{
  position:fixed !important;
  top:20px;
  bottom:0;

  left:63%;

  margin-left:calc((var(--left-p) + var(--layout-gap)) / 2);
  transform:translateX(-50%);

  width:var(--center-w) !important;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    border-radius:36px 36px 0 0;

    background:#fff;

    box-shadow:
      0 20px 60px rgba(0,0,0,.28);

    z-index:100;
  }

  main#center.center::-webkit-scrollbar{
    display:none;
  }

  .tablet-dock{
    position:sticky;
    bottom:0;
  }
}


/* =========================
   MOBILE
========================= */
@media (max-width:900px){

  html,
  body{
    overflow:auto !important;
    height:auto;
  }

  main#center.center{
    position:relative !important;

    top:auto;
    bottom:auto;
    left:auto;

    transform:none;

    width:100% !important;
    height:auto !important;

    overflow:visible !important;

    border-radius:0;

    box-shadow:none;
  }

  .tablet-dock{
    position:fixed;

    left:0;
    right:0;
    bottom:0;

    width:100%;

    border-radius:22px 22px 0 0;
  }

  /* dock 공간 확보 */
  body{
    padding-bottom:110px;
  }

}


/* =========================
   FLAGS
========================= */

.flags{
    display:flex;
    align-items:center;
    gap:12px;

    margin-top:10px;

}

.flag{
    width:44px;
    height:44px;

    border-radius:50%;

    overflow:hidden;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#fff;

    box-shadow:
      0 2px 8px rgba(0,0,0,.18);

    transition:
      transform .2s ease,
      box-shadow .2s ease;
}

.flag:hover{
    transform:translateY(-2px);

    box-shadow:
      0 6px 16px rgba(0,0,0,.22);
}

.flag img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}


/* =========================
   SNS
========================= */

.left-foot .sns{
    display:flex;
    gap:18px;
    align-items:center;

    margin-top:15px;
}

.left-foot .sns a{
    color:#b6b6b6 !important;

    opacity:1;

    transition:
      color .2s ease,
      transform .2s ease;
}

.left-foot .sns a i{
    font-size:18px;
}

.left-foot .sns a:hover{
    color:#6d0000 !important;
    transform:translateY(-2px);
}


/* =========================
   ADDRESS
========================= */

.left-foot .address{
    color:#8f8f8f;
    line-height:1.7;
}

.left-foot .address h3{
    font-size:15px;
    font-weight:700;

    color:#8f8f8f;

    margin-bottom:6px;
}

.left-foot .address h4{
    font-size:12px;
    font-weight:400;

    color:#9c9c9c;

    line-height:1.6;
}

.left-foot .address h5{
    margin-top:16px;
}

.left-foot .address h5 a{
    font-size:11px;

    color:#8d8d8d;

    text-decoration:none;
}

.left-foot .address h5 a:hover{
    color:#6d0000;
}


/* =========================
   DOCK에 본문 가림 방지
========================= */

:root{
  --dock-h:110px;
}

/* PC 태블릿 프레임 안에서 dock 높이만큼 여백 확보 */
@media (min-width:901px){
  main#center.center .sec{
    padding-bottom: var(--dock-h) !important;
    box-sizing: border-box;
  }

  main#center.center .sec-inner{

  }
}

/* 모바일 하단 dock 대응 */
@media (max-width:900px){
  body{
    padding-bottom: var(--dock-h);
  }


}

/* =========================
   DOCK SAFE AREA FINAL
========================= */

:root{
  --dock-h:110px;
}

@media (min-width:901px){

  main#center.center .sec{

    height:auto !important;
    padding-bottom:30px !important;
    box-sizing:border-box !important;
    overflow:visible !important;
  }

  main#center.center .sec-inner{
    height:auto !important;
    min-height:auto !important;

    overflow:visible !important;
    box-sizing:border-box !important;
  }

  main#center.center #sec2,
  main#center.center #sec3{
    height:auto !important;
    overflow:visible !important;
  }

  main#center.center #sec3 .portfolio-two.bg-black,
  main#center.center #sec3 .row,
  main#center.center #sec3 .gallery{
    height:auto !important;
    min-height:auto !important;
    overflow:visible !important;
  }

  main#center.center #sec3 .gallery > .items,
  main#center.center #sec3 .gallery > [class*="col-"]{
    height:20vh !important;
    min-height:160px !important;
  }
}

/* =========================
   SEC2 VOTE STYLE
========================= */


#sec2 .sec2-vote{
    padding:56px 34px 30px !important;
    text-align:center;
    color:#fff;
}

/* 금색 라인 */
#sec2 .sec2-line{
    width:42px;
    height:4px;

    margin:0 auto 22px;

    background:#f4c34d;
    border-radius:20px;
}

/* 메인 타이틀 */
#sec2 .sec2-vote h1{
    margin:0 !important;
    padding:0 !important;

    color:#f4c34d !important;

    font-size:1.5em !important;
    line-height:1.08 !important;

    font-weight:900 !important;



    font-family:
      "futura-pt",
      "Pretendard",
      sans-serif !important;
}

/* 기준 텍스트 */
#sec2 .sec2-note{
    margin:10px 0 10px !important;

    color:#fff !important;

    font-size:13px !important;
    line-height:1.6 !important;

    font-weight:700 !important;

    opacity:.95;
}

/* 숫자 2개 */
#sec2 .vote-summary{
    display:grid;
    grid-template-columns:1fr 1fr;

    gap:40px;

    margin-bottom:45px;
}

/* 상단 설명 */
#sec2 .vote-summary-item p{
    margin:0 0 10px !important;

    color:#fff !important;

    font-size:18px !important;
    line-height:1.4 !important;

    font-weight:800 !important;

    opacity:.92;
}

/* 숫자 */
#sec2 .vote-summary-item strong{
    display:block;

    color:#fff !important;

    font-size:2.5em !important;
    line-height:1 !important;

    font-weight:700 !important;



    font-family:
      "futura-pt",
      "Pretendard",
      sans-serif !important;
}

/* 그래프 이미지 */
#sec2 .gp-wrap{
    margin-top:10px;
}

#sec2 .gp2026{
    display:block;

    width:100%;
    height:auto;

    margin:0 auto;
}


/* =========================
   MOBILE
========================= */
@media (max-width:900px){

    #sec2 .sec2-vote{
        padding:44px 22px 30px !important;
    }

    #sec2 .sec2-vote h1{
        font-size:28px !important;
    }

    #sec2 .vote-summary{
        gap:20px;
        margin-bottom:60px;
    }

    #sec2 .vote-summary-item p{
        font-size:13px !important;
    }

    #sec2 .vote-summary-item strong{
        font-size:32px !important;
    }

    #sec2 .sec2-note{
        margin:18px 0 48px !important;
        font-size:11px !important;
    }
}


/* =========================
   SEC3 DOCK 가림 최종 보정
========================= */

@media (min-width:901px){

  main#center.center #sec3{
    height:auto !important;
    padding-bottom:30px !important;
    overflow:visible !important;
  }

  main#center.center #sec3 .portfolio-two.bg-black,
  main#center.center #sec3 .sec-inner,
  main#center.center #sec3 .row,
  main#center.center #sec3 .gallery{
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  }

  main#center.center #sec3 .sec-inner{
    padding-bottom:30px !important;
  }

  main#center.center #sec3 .gallery{
    padding-bottom:20px !important;
  }
}


/* PC 화면 높이가 낮을 때 좌측 메뉴 압축 */
@media (min-width:901px) and (max-height:760px){

  .left{
    padding-top:40px !important;
    padding-bottom:18px !important;
  }

  .ci{
    margin-bottom:14px !important;
    padding-top:0 !important;
  }


  .ci img{
    width:110px !important;
  }

.nav{
    margin-bottom:40px !important;
    gap:0 !important;
  }

  .nav-link,
  .nav-link.is-active{
    font-size:1.18rem !important;
    line-height:1.5 !important;
  }

  .nav-link{
    padding:0 20px 5px 0 !important;
  }


  .left-foot{
    margin-top:70px !important;
    gap:7px !important;
  }

  .flags{
    gap:8px !important;
    margin-top:6px !important;
  }

  .flag{
    width:36px !important;
    height:36px !important;
  }

  .left-foot .sns{
    gap:13px !important;
    margin-top:8px !important;
  }

  .left-foot .sns a i{
    font-size:15px !important;
  }

  .left-foot .address h3{
    font-size:13px !important;
    margin-bottom:3px !important;
  }

  .left-foot .address h4{
    font-size:11px !important;
    line-height:1.4 !important;
  }

  .left-foot .address h5{
    margin-top:8px !important;
  }

  .left-foot .address h5 a{
    font-size:10px !important;
  }
}




















/* 1225px 이하에서는 좌측 메뉴 숨김 */
@media (max-width:1225px){

  .left{
    display:none !important;
  }

  #center,
  main#center.center{
    left:50% !important;
    margin-left:0 !important;
    transform:translateX(-50%) !important;
  }

}



/* 모바일 하단 dock 강제 노출 */
@media (max-width:900px){

  html,
  body{
    overflow-x:hidden !important;
  }

  .tablet-dock{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;

    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;

    width:100vw !important;
    height:86px !important;
    margin:0 !important;
    padding:0 8px calc(env(safe-area-inset-bottom, 0px) + 6px) !important;

    z-index:2147483647 !important;

    background:rgba(70,70,70,.96) !important;
    border-radius:22px 22px 0 0 !important;
    border-top:1px solid rgba(255,255,255,.18) !important;

    transform:none !important;
    pointer-events:auto !important;
  }

  .tablet-dock .dock-item{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
    flex:1 1 20% !important;
    width:auto !important;
    height:100% !important;
    color:#fff !important;
    pointer-events:auto !important;
  }

  .tablet-dock .dock-item i{
    display:block !important;
    font-size:20px !important;
  }

  .tablet-dock .dock-item span{
    display:block !important;
    font-size:10px !important;
  }

  body{
    padding-bottom:100px !important;
  }
}




/* 모바일 하단 dock 최종 강제 고정 */
@media screen and (max-width:900px){

  html body .tablet-dock{
    display:flex !important;
    position:fixed !important;

    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    top:auto !important;

    width:100vw !important;
    height:88px !important;

    margin:0 !important;
    padding:0 8px !important;

    z-index:2147483647 !important;

    transform:none !important;
    translate:none !important;

    background:rgba(90,90,90,.96) !important;
    border-radius:22px 22px 0 0 !important;

    visibility:visible !important;
    opacity:1 !important;
  }

  html body .tablet-dock .dock-item{
    display:flex !important;
    flex:1 1 20% !important;
    width:auto !important;
    height:100% !important;
  }

  html body{
    padding-bottom:100px !important;
  }
}



@media (min-width:901px){
  .tablet-dock-mobile{
    display:none !important;
  }

  .tablet-dock-pc{
    display:flex !important;
    position:sticky !important;
    bottom:0 !important;
  }
}

@media (max-width:900px){
  .tablet-dock-pc{
    display:none !important;
  }

  .tablet-dock-mobile{
    display:flex !important;
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100vw !important;
    height:88px !important;
    z-index:2147483647 !important;
    margin:0 !important;
  }
}


@media (max-width:900px){
  html body .tablet-dock.tablet-dock-pc{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

  html body .tablet-dock.tablet-dock-mobile{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
  }
}



@media (max-width:900px){

  #sec2 .vote-summary{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    width:100% !important;
    justify-items:center !important;
    align-items:center !important;
    text-align:center !important;
  }

  #sec2 .vote-summary-item{
    width:100% !important;
    text-align:center !important;
  }

  #sec2 .vote-summary-item p,
  #sec2 .vote-summary-item strong{
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  #sec2 .vote-summary-item strong{
    font-size:28px !important;
    letter-spacing:-1px !important;
    white-space:nowrap !important;
  }
}