@charset "utf-8";

:root{
    --desc-size: 1.6rem;
}



#sub{padding-top: var(--header-height);}

/* input 공통 */
.input_wrap input[type="text"]{height: 4em; padding: 0 1.5em; border: 1px solid #d7d7d7; font-size: var(--desc-size); border-radius: 8px;}
.input_wrap input::placeholder{color: #b3b3b3;}
.input_wrap input:focus{border-color: var(--blue); outline: 1px solid var(--blue);}
.input_wrap textarea{resize: none; min-height: 10em; padding: 1.5em; border: 1px solid #d7d7d7; font-size: var(--desc-size); border-radius: 8px;}
.input_wrap textarea::placeholder{color: #b3b3b3;}
.input_wrap textarea:focus{border-color: var(--blue); outline: 1px solid var(--blue);}
.input_wrap textarea::-webkit-scrollbar{width: 10px;}
.input_wrap textarea::-webkit-scrollbar-thumb{background: #efefef; border-right: 5px solid #fff; border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px;}
.input_wrap textarea::-webkit-scrollbar-track{background: #fff;}
.input_wrap textarea::-webkit-scrollbar-button:vertical:decrement{height: 15px;}
.input_wrap textarea::-webkit-scrollbar-button:vertical:increment{height: 15px;}


/* 서브 탑 */
.sub_top{padding-top: var(--header-height); padding-bottom: 12rem;}
.sub_top .sub_navi_wrap{}
.sub_top .sub_navi_wrap .sub_navi{display: flex; align-items: center; margin-bottom: 4rem;}
.sub_top .sub_navi_wrap .sub_navi > div{}
.sub_top .sub_navi_wrap .sub_navi > div.home{display: flex; opacity: 0.7; fill: #b4b4b4;}
.sub_top .sub_navi_wrap .sub_navi > div.home svg{position: relative; font-size: 1.4rem;}
.sub_top .sub_navi_wrap .sub_navi > div:not(.nice-select) span{position: relative; opacity: 0.7; padding-left: 1em; margin-left: 1em; color: #B4B4B4; font-size: 1.4rem; font-weight: 500;}
.sub_top .sub_navi_wrap .sub_navi > div:not(.nice-select) span::before{content: ''; position: absolute; top: calc(50% - 2px); left: -2px; width: 4px; height: 4px; background: #e6e6e6; border-radius: 2px;}
.sub_top .sub_navi_wrap .sub_navi > .nice-select{height: auto; margin-left: 1em; padding: 0 1.5em 0 1em; background: none; border: none; font-size: 1.4rem; text-transform: capitalize; line-height: initial;}
.sub_top .sub_navi_wrap .sub_navi > .nice-select::before{content: ''; position: absolute; top: calc(50% - 2px); left: -2px; width: 4px; height: 4px; background: #e6e6e6; border-radius: 2px;}
.sub_top .sub_navi_wrap .sub_navi > .nice-select::after{top: calc(50% - 5px); right: 0; width: 10px; height: 10px; margin-top: 0; transform: rotate(0deg); transform-origin: center; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><style>path{fill: %23000000;}</style><path d="M320 240L160 384 0 240l0-48 320 0 0 48z"/></svg>') no-repeat center center/cover; border: none;}
.sub_top .sub_navi_wrap .sub_navi > .nice-select.open:after{transform: rotate(180deg);}
.sub_top .sub_navi_wrap .sub_navi > .nice-select .list{top: 2em; transform: translateY(-10px);}
.sub_top .sub_navi_wrap .sub_navi > .nice-select .option{min-height: 2.5em; padding-left: 1em; padding-right: 1.5em; line-height: 2.5em;}
.sub_top .sub_navi_wrap .sub_navi > .nice-select.open .list{transform: translateY(0);}
.sub_top .sub_page_tit{}
.sub_top .sub_page_tit h2{white-space: nowrap; font-size: 5.6rem; font-weight: 700; text-transform: capitalize; line-height: 1.35em;}
.sub_top .sub_page_tit p{}

/* sub_top 이미지 있는 경우 */
.sub_top.img{position: relative; height: 100vh; margin-top: calc(0px - var(--header-height));}
.sub_top.img .sub_top_bg{overflow: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000;
    clip-path: polygon(40% 20%, 60% 20%, 60% 80%, 40% 80%);}
.sub_top.img .sub_top_bg .img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.sub_top.img .sub_navi_wrap .sub_navi{padding-top: var(--header-height);}
.sub_top.img .sub_navi_wrap .sub_navi > div.home{fill: #fff;}
.sub_top.img .sub_navi_wrap .sub_navi > div span{color: #fff;}
.sub_top.img .sub_navi_wrap .sub_navi > div.on span{color: #fff;}
.sub_top.img .sub_navi_wrap .sub_navi > div span::before{background: #fff;}
.sub_top.img .in2{position: static;}
.sub_top.img .sub_page_tit{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; text-align: center;}
.sub_top.img .sub_page_tit h2 div{overflow: hidden;}
.sub_top.img .sub_page_tit h2 div p{transform: translateY(100%); transition: 0.3s;}
.sub_top.img .sub_page_tit .sub_tit{overflow: hidden; margin-bottom: 2em; font-size: 20px; font-weight: 700; font-family: var(--pop);}
.sub_top.img .sub_page_tit .sub_tit p{transform: translateY(100%); transition: 0.3s;}
.sub_top.img .sub_page_tit.active h2 div p{transform: translateY(0%);}
.sub_top.img .sub_page_tit.active .sub_tit p{transform: translateY(0%);}


.sub_top.history { position: relative; height: 100vh; margin-top: calc(0px - var(--header-height)); }
.sub_top.history .sub_top_bg{overflow: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff;}
.sub_top.history .sub_top_bg .color_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scaleX(0); transform-origin: center center; background-color: rgba(0,64,152,0.94); }
.sub_top.history .sub_top_bg .img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.sub_top.history .sub_navi_wrap .sub_navi{padding-top: var(--header-height);}
.sub_top.history .sub_navi_wrap .sub_navi > div.home{fill: #fff;}
.sub_top.history .sub_navi_wrap .sub_navi > div > span{color: #fff;}
.sub_top.history .sub_navi_wrap .sub_navi > div.on > span{color: #fff;}
.sub_top.history .sub_navi_wrap .sub_navi > div > span::before{background: #fff;}
.sub_top.history .sub_navi_wrap .sub_navi > .nice-select::after{background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><style>path{fill: %23ffffff;}</style><path d="M320 240L160 384 0 240l0-48 320 0 0 48z"/></svg>') no-repeat center center/cover;}
.sub_top.history .in2 {position: static;}
.sub_top.history .sub_page_tit{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; color: #fff; text-align: center;}
.sub_top.history .sub_page_tit h2 { transform: translateY(80px); opacity: 0; }
.sub_top.history .sub_page_tit .sub_tit{overflow: hidden; opacity: 0; transform: translateY(80px); margin-bottom: 2em; font-size: 20px; font-weight: 700; text-transform: uppercase; }
.sub_top.history .sub_page_tit .sub_txt { margin-top: 2em; font-size: var(--desc-size); font-weight: 500; transform: translateY(80px); opacity: 0; }


.sub_contents{padding-bottom: 20rem;}

.cont_tit_wrap{}
.cont_tit_wrap .tit{font-size: 5rem; font-weight: 700; line-height: 1.35em;}
.cont_tit_wrap .sub_tit{margin-bottom: 1.5em; font-size: 2rem; font-weight: 700;}
.cont_img_wrap{margin-top: 15rem;}
.cont_img_wrap .img{clip-path: polygon(30% 0%, 70% 0%, 70% 100%, 30% 100%);}



#greeting{}
#greeting .greeting_wrap{display: flex; align-items: flex-start; overflow: hidden;}
#greeting .greeting_wrap .left{opacity: 0; transform: translateX(-10%); width: 32.5%;}
#greeting .greeting_wrap .right{flex: 1; margin-left: 10rem;}
#greeting .greeting_wrap .right .tit{opacity: 0; transform: translateX(5%); margin-bottom: 0.6em; font-size: 4.5rem; font-weight: 700; letter-spacing: -0.01em; line-height: 1.3333em;}
#greeting .greeting_wrap .right .sub_tit{opacity: 0; transform: translateX(5%); margin-bottom: 2.5em; font-size: 2.1rem; font-weight: 700;}
#greeting .greeting_wrap .right .desc{font-size: var(--desc-size); word-break: keep-all;}
#greeting .greeting_wrap .right .desc div{opacity: 0; transform: translateX(5%); line-height: 1.6em;}
#greeting .greeting_wrap .right .desc div + div{margin-top: 1.6em;}
#greeting .greeting_wrap .right .nm{display: flex; align-items: baseline; justify-content: flex-start; opacity: 0; transform: translateX(5%); letter-spacing: -0.01em;}
#greeting .greeting_wrap .right .nm p{margin-top: 2.5em; font-size: 2.4rem; font-weight: 700;}
#greeting .greeting_wrap .right .nm span{margin-right: 0.8em; font-size: var(--desc-size); font-weight: 500;}
#greeting .greeting_wrap.active .left{opacity: 1; transform: translateY(0%); transition: opacity 0.75s 0.25s, transform 0.75s 0.25s;}
#greeting .greeting_wrap.active .right .tit{opacity: 1; transform: translateX(0%); transition: opacity 0.5s, transform 0.5s; transition-delay: 0.75s;}
#greeting .greeting_wrap.active .right .sub_tit{opacity: 1; transform: translateX(0%); transition: opacity 0.5s, transform 0.5s; transition-delay: 0.9s;}
#greeting .greeting_wrap.active .right .desc{}
#greeting .greeting_wrap.active .right .desc div{opacity: 1; transform: translateX(0%); transition: opacity 0.5s, transform 0.5s; transition-delay: 1.05s;}
#greeting .greeting_wrap.active .right .desc div:first-child{}
/*
#greeting .greeting_wrap.active .right .desc div:nth-child(2){transition-delay: 1.2s;}
#greeting .greeting_wrap.active .right .desc div:nth-child(3){transition-delay: 1.35s;}
#greeting .greeting_wrap.active .right .desc div:nth-child(4){transition-delay: 1.5s;}
#greeting .greeting_wrap.active .right .desc div:nth-child(5){transition-delay: 1.65s;}
#greeting .greeting_wrap.active .right .desc div:nth-child(6){transition-delay: 1.8s;}
*/
#greeting .greeting_wrap.active .right .nm{opacity: 1; transform: translateX(0%); transition: opacity 0.5s, transform 0.5s; transition-delay: 1.2s;}




/* PC 전용 이미지 */
.pc-only { display: block !important; }
.mo-only { display: none !important; }

/* Mobile 전용 이미지 */
@media (max-width: 768px) {
  .pc-only { display: none !important; }
  .mo-only { display: block !important; }
}


#orgchart .org-img {
  display: flex;
  justify-content: center;  /* 가로 중앙 정렬 */
}

#orgchart .org-img img,
#orgchart .pc-only,
#orgchart .mo-only {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto; /* 세로 컨텍스트 안에서도 가운데 */
}



/* ============= CI PAGE ============= */
#ci{  }
#ci .sect-tit{ margin-bottom: 1em; font-size: 2.4rem; font-weight: 700; }
#ci .card{ background:#F7F9FC; border:1px solid #ECF1F8; border-radius: 16px; padding: 2.2rem; }

/* HERO */
#ci .ci-hero{ display:flex; align-items:center; justify-content:space-between; gap:4rem; }
#ci .ci-hero .tit{ font-size: 2.4rem; font-weight: 700; letter-spacing: -0.01em; }
#ci .ci-hero .tit2{ font-size: 1.8rem; font-weight: 700; letter-spacing: -0.01em; padding-top:20px; }
#ci .ci-hero .tit0{ font-size: 2.4rem; font-weight: 700; letter-spacing: -0.01em; padding-top:50px;}
#ci .ci-hero .desc{ margin-top: .5em; font-size: var(--desc-size); color:#606a77; line-height: 1.7; word-break: keep-all; }
#ci .ci-hero .logo-hero{ flex: 0 0 auto; width: clamp(260px, 28vw, 460px); padding: 2.4rem; border-radius: 20px; text-align: center; }
#ci .ci-hero .logo-hero img{ width: 100%; height: auto; filter: drop-shadow(0 1px 0 rgba(0,0,0,.15)); }

/* SYSTEM */
#ci .ci-system{ margin-top: 6rem; }
#ci .ci-system .grid{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1.6rem; }
/* UA 기본 figure 좌우 40px 여백 제거 */
#ci .ci-system figure,
#ci .ci-system .card{
  margin: 0 !important;
}
#ci .ci-system .card {text-align:center; font-weight:600; line-height:40px;}
/* 이미지 블록화(미세한 좌우 갭 방지) */
#ci .ci-system .card img{
  display: block;
  width: 100%;
  height: auto; 
}

/* SAFE / MIN SIZE */
#ci .ci-safe{ margin-top: 6rem; }
#ci .safe-grid{ display:grid; grid-template-columns: 1.3fr 1fr; gap: 1.6rem; }
#ci .safe .label, #ci .minsize .label{ font-weight: 700; margin-bottom: 1rem; }
#ci .safe .stage{ position: relative; background: #fff; border: 1px dashed #D7DFEC; border-radius: 12px; padding: 2.4rem; min-height: 200px; }
#ci .safe .stage img{ width: clamp(240px, 42%, 420px); height: auto; display: block; margin: 0 auto; }
#ci .safe .stage .guide{ position: absolute; background: #0f3569; }
#ci .safe .stage .g-top,
#ci .safe .stage .g-bottom{ left: 5%; right: 5%; height: 1.5px; }
#ci .safe .stage .g-top{ top: 10%; } .g-bottom{ bottom: 10%; }
#ci .safe .stage .g-left,
#ci .safe .stage .g-right{ top: 12%; bottom: 12%; width: 1.5px; }
#ci .safe .stage .g-left{ left: 8%; } .g-right{ right: 8%; }
#ci .safe .stage .mark{ position: absolute; left: 10%; top: 10%; transform: translate(-50%,-60%); color:#0f3569; font-weight:800; }
#ci .safe .note{ margin-top: .9rem; color:#6c7684; font-size: 1.4rem; }

#ci .minsize .sizes{ display:grid; grid-template-columns: 1fr; gap: 1.2rem; }
#ci .minsize li{ display:flex; align-items:center; gap: 1.2rem; padding: 1.2rem; background:#fff; border:1px solid #ECF1F8; border-radius: 12px; }
#ci .minsize img{ width: 160px; height:auto; }
#ci .minsize span{ font-size: 1.5rem; color:#3b4552; }

/* COLOR */
#ci .ci-color{ margin-top: 6rem; }
#ci .ci-color .chips{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1.6rem; }
#ci .ci-color .chip{ padding: 2rem; background:#fff; border:1px solid #ECF1F8; border-radius: 14px; }
#ci .ci-color .swatch{ display:block; width:100%; height: 86px; background: var(--c,#004098); border-radius: 10px; }
#ci .ci-color .name{ margin-top: 1rem; font-weight: 700; }
#ci .ci-color .code{ margin-top: .3rem; color:#6c7684; font-size: 1.4rem; }
#ci .ci-color .caption{ margin-top: 1rem; color:#6c7684; font-size: 1.4rem; }

/* RULES */
#ci .ci-rules{ margin-top: 6rem; }
#ci .rule-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.6rem; }
#ci .rule-grid figure{ position:relative; background:#fff; border:1px solid #ECF1F8; border-radius: 14px; padding: 1.6rem; text-align:center; }
/* 브라우저 기본 figure 좌우 40px 마진 제거 + 오버플로우 차단 */
#ci .rule-grid figure{
  margin: 0 !important;
  overflow: hidden;
}

/* 카드 내부 이미지 좌우 여백 제거(가운데 정렬) */
#ci .rule-grid img{
  display: block;
  margin: 0 auto;
  height: auto;
  width:60%;
  /* 기존 78% 폭 유지: 내부 여백을 위해 쓰고 있다면 그대로 둡니다 */
  /* width: 78%;  <- 이미 선언돼 있으면 그대로 사용 */
}

/* 잘못된 예 효과 */
#ci .bad .stretch{ width: 63%; transform: scaleX(1.25); }
#ci .bad .wrong-color{ filter: hue-rotate(220deg) saturate(1.2); }
#ci .bad .shadow{ filter: drop-shadow(0 8px 14px rgba(0,0,0,.35)); }
#ci .bad .rotate{ transform: rotate(-12deg); }
#ci .bad .busy-bg{ position:absolute; inset:1.6rem; background: repeating-linear-gradient(135deg,#dfe6f3 0 12px,#b9c6dd 12px 24px); border-radius: 10px; }
#ci .bad .on-busy{ position:absolute; inset:auto; left:50%; top:50%; transform:translate(-50%,-50%); width:60%; }
#ci .bad .ban{ position:absolute; right:10px; top:6px; color:#d33; font-weight:800; font-size: 2.2rem; }

/* DOWNLOAD */
#ci .ci-dl{ margin-top: 6rem; text-align:center; }
#ci .ci-dl .btns{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap: 12px; margin-top: .8rem; }
#ci .ci-dl .btn{
  display:inline-flex; align-items:center; gap:.6em; padding: .9em 1.4em;
  background:#0B2A52; color:#fff; font-weight:700; border-radius: 999px;
}
#ci .ci-dl .btn .ico{ width:16px; height:16px; border-radius:50%; background:linear-gradient(180deg,#d7e3ff,#a7c2ff); box-shadow: inset 0 0 0 2px rgba(255,255,255,.85); }

/* ======= Responsive ======= */
@media (max-width:1241px){
  #ci .ci-hero .tit{ font-size: 3.2rem; }
  #ci .ci-system .grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  #ci .safe-grid{ grid-template-columns: 1fr; }
  #ci .ci-color .chips{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  #ci .rule-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width:769px){
  #ci .ci-hero{ flex-direction: column; align-items: flex-start; }
  #ci .ci-hero .logo-hero{ width: 100%; margin:0 auto;}
  #ci .ci-system .grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 12px;
    row-gap: 12px;
  }
  /* 필요 시 카드 기본 여백 정리 */
  #ci .ci-system .card{
    margin: 0;
  }
  #ci .ci-color .chips{ grid-template-columns: 1fr; }
  #ci .rule-grid{ grid-template-columns: 1fr; }
  #ci .minsize img{ width: 120px; }
  #ci .ci-rules .rule-grid{
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    column-gap: 12px;
    row-gap: 12px;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  /* UA 기본 figure 여백 제거 */
  #ci .ci-rules .rule-grid figure{
    margin: 0 !important;
  }

}






#contribute{}
#contribute .contribute_list{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8rem 4rem; margin-top: 12rem;}
#contribute .contribute_list .item{}
#contribute .contribute_list .img{overflow: hidden; position: relative; padding-top: 75%; margin-bottom: 25px;}
#contribute .contribute_list .img img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); width: 100%; height: 100%; object-fit: cover; transition: transform 0.25s;}
#contribute .contribute_list .item:hover .img img{transform: translate(-50%, -50%) scale(1.1);}
#contribute .contribute_list .txt_box{}
#contribute .contribute_list .txt_box .top{display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
#contribute .contribute_list .txt_box .top .cat{white-space: nowrap; padding: 0.6em 1em; background: #FFF2ED; color: #EA5514; font-size: 1.4rem; font-weight: 600; border-radius: 2em; line-height: 1em;}
#contribute .contribute_list .txt_box .top .since{color: #B3B3B3; font-size: 1.4rem; font-weight: 600; line-height: 1em;}
#contribute .contribute_list .txt_box .top .since::before{content: '\2a'; margin-right: 0.5em;  font-family: var(--awesome); line-height: 1em;}
#contribute .contribute_list .txt_box .tit{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 2rem; font-weight: 700; letter-spacing: -0.010em;}

/* bbs 상세 */
.board_view {  }
.board_view .in2{width: clamp(1180px, 70vw, 1240px);}
.board_view .top { padding-bottom: 3rem; border-bottom: 2px solid #000; }
.board_view .top .label { margin-bottom: 1em; }
.board_view .top .label .cat{white-space: nowrap; padding: 0.6em 1em; background: var(--blue); color: #fff; font-size: 1.4rem; font-weight: 600; border-radius: 2em; line-height: 1em;}
.board_view .top .label .since{margin-left: 1.2em; color: #B3B3B3; font-size: 1.4rem; font-weight: 600; line-height: 1em;}
.board_view .top .label .since::before{content: '\2a'; margin-right: 0.5em;  font-family: var(--awesome); line-height: 1em;}
.board_view .top .tit { font-size: 3.5rem; line-height:3.4rem; font-weight: 700; }
.board_view .top .date { margin-top: 0.8em; font-size: var(--desc-size); color: #B0B0B0; }
.board_view .cont { padding: 5rem 2rem; border-bottom: 1px solid #000; font-size: var(--desc-size); }
.board_view .btn_wrap {display: flex; align-items: center; justify-content: center; margin-top: 9rem; }
.board_view .btn_wrap a{display: flex; align-items: center; height: 3.5em; padding: 0 4em; border: 1px solid #000; font-size: 1.6rem; font-weight: 500; border-radius: 2em; transition: background 0.25s, color 0.25s;}
.board_view .attach_wrap{ padding: 1.2em 0; border-bottom: 1px solid #000; font-size: 1.5rem; }
.board_view .attach_wrap .file_wrap{ display: flex; align-items: center; fill: #b3b3b3; color: #b3b3b3; }
.board_view .attach_wrap .file_wrap + .file_wrap{margin-top: 0.5em;}
.board_view .attach_wrap .file_wrap svg{margin-right: 0.8em;}


/* 이전글/다음글 */
.board_view .board_li_wrap { margin-top: 4rem; }
.board_view .board_li_wrap .box_wrap { display: flex; align-items: center; justify-content: space-between; }
.board_view .board_li_wrap .box { display: flex; align-items: center; justify-content: flex-start; width: 40%; }
.board_view .board_li_wrap .box + .box { margin-left: 20px; }
.board_view .board_li_wrap .box .ico { position: relative; display: flex; align-items: center; justify-content: center; width: 0.8em; height: 1em; font-size: 3.6rem; transition: fill 0.25s; overflow: hidden; flex-shrink: 0; }
.board_view .board_li_wrap .box .ico svg { }
.board_view .board_li_wrap .box.next { flex-direction: row-reverse; }
.board_view .board_li_wrap .box.prev .ico { margin-right: 1.8rem; }
.board_view .board_li_wrap .box.next .ico { margin-left: 1.8rem; }
.board_view .board_li_wrap .box.next .desc { text-align: right; }

.board_view .board_li_wrap .box .tit_box { display: flex; flex-direction: column; }
.board_view .board_li_wrap .box.prev .tit_box { align-items: flex-start; }
.board_view .board_li_wrap .box.next .tit_box { align-items: flex-end; }

.board_view .board_li_wrap .box .tit_box .desc { font-size: var(--desc-size); font-weight: 700; }
.board_view .board_li_wrap .box .tit_box .tit { margin-top: 0.3em; font-size: 1.4rem; display: -webkit-box; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; }

.board_view .board_li_wrap .box.none { pointer-events: none; }
.board_view .board_li_wrap .box.none .ico { border-color: #B3B3B3; fill: #B3B3B3; }
.board_view .board_li_wrap .box.none .tit_box .desc,
.board_view .board_li_wrap .box.none .tit_box .tit { color: #B3B3B3; }


/* 연혁 */
#history .history_cont { display: flex; align-items: flex-start; justify-content: flex-start; padding-top: 30rem; }
#history .history_cont .left { position: sticky; top: 100px; width: 40%; }
#history .history_cont .left .txt { margin-bottom: 1em; font-size: 2rem; font-weight: 700; }
#history .history_cont .left .tit { font-size: 6rem; font-weight: 700; line-height: 1.3; }

#history .history_cont .right { flex: 1; min-width: 50%; margin-left: 12rem; }
#history .history_cont .right .history_box { display: flex; align-items: flex-start; }
#history .history_cont .right .history_box + .history_box { margin-top: 9rem; }
#history .history_cont .right .history_box .year { min-width: 2.75em; margin-right: 2em; font-size: 3.6rem; font-weight: 700; line-height: 1em; }
#history .history_cont .right .history_box .box { font-size: 2rem; }
#history .history_cont .right .history_box .box .txt { font-weight: 500; line-height: 1.55em; word-break: keep-all; }
#history .history_cont .right .history_box .box .txt + .txt {}
#history .history_cont .right .history_box .box .img { width: 80%; margin: 1em 0 2em; }
#history .history_cont .right .history_box .box .img img { width: 100%; height: 100%; object-fit: cover; }

#history .history_bar{position: fixed; left: 50%; bottom: 0; transform: translate(-50%, 100%); transition: transform 0.5s;}
#history .history_bar .bar_wrap{display: flex; padding: 2rem 4rem; background: #F4F4F4; border-radius: 5em;}
#history .history_bar .bar_wrap .item{display: flex; align-items: center; white-space: nowrap; padding: 0.6em 1.5em; font-size: 2rem; border-radius: 2em; line-height: 1em; cursor: pointer; transition: 0.25s;}
#history .history_bar .bar_wrap .item + .item{margin-left: 1.2em;}
#history .history_bar .bar_wrap .item span{color: #B3B3B3; font-size: 0.8em; font-weight: 500;}
#history .history_bar .bar_wrap .item p{margin-left: 0.5em; font-size: 1em; font-weight: 600;}
#history .history_bar.active{transform: translate(-50%, -25%);}
#history .history_bar .bar_wrap .item.active{background: var(--blue);}
#history .history_bar .bar_wrap .item.active span{color: #fff;}
#history .history_bar .bar_wrap .item.active p{color: #fff;}



#ethic{}
#ethic .sect1{padding-top: 25rem;}
#ethic .sect1_none{padding-top: 0 !important;}
#ethic .sect1 .top{}
#ethic .sect1 .top .tit{margin-bottom: 0.5em; font-size: 7rem; font-weight: 700;}
#ethic .sect1 .top .sub_tit{margin-bottom: 0.6667em; font-size: 2.4rem; font-weight: 600;}
#ethic .sect1 .top .desc{font-size: var(--desc-size); word-break: keep-all; line-height: 1.6667em;}
#ethic .sect1 .top .desc div + div{margin-top: 1.6em;}
#ethic .sect1 .bottom{}
#ethic .sect1 .bottom .card_list{margin-top: 12rem;}
#ethic .sect1 .bottom .card_list ul{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 3.6rem;}
#ethic .sect1 .bottom .card_list ul li{display: flex; flex-direction: column; align-items: center; opacity: 0; transform: translateY(0%) rotateY(115deg); padding: 8rem 0 7.5rem; background: var(--blue); border-radius: 20px;}
#ethic .sect1 .bottom .card_list ul li .ico{display: flex; align-items: center; position: relative; width: 100%; height: 10rem;}
#ethic .sect1 .bottom .card_list ul li .ico img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-height: 95%;}
#ethic .sect1 .bottom .card_list ul li .ico object{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-height: 95%;}
#ethic .sect1 .bottom .card_list ul li:first-child .ico object{max-height: 100%;}
#ethic .sect1 .bottom .card_list ul li .txt_box{margin-top: 6rem; color: #fff; text-align: center;}
#ethic .sect1 .bottom .card_list ul li .txt_box p{margin-bottom: 1em; font-size: 3.2rem; font-weight: 700; font-family: var(--pop); text-transform: uppercase; line-height: 1.2em;}
#ethic .sect1 .bottom .card_list ul li .txt_box span{display: block; opacity: 0.7; font-size: 1.6rem; font-weight: 500; line-height: 1.6em;}
#ethic .sect1 .bottom .card_list ul.active{}
#ethic .sect1 .bottom .card_list ul.active li{opacity: 1; transform: translateY(0%) rotateY(0deg); transition: opacity 1.25s, transform 1.25s;}
#ethic .sect1 .bottom .card_list ul.active li:first-child{transition-delay: 0s;}
#ethic .sect1 .bottom .card_list ul.active li:nth-child(2){transition-delay: 0.5s;}
#ethic .sect1 .bottom .card_list ul.active li:nth-child(3){transition-delay: 1s;}

#ethic .sect2{padding: 18rem 0; margin: 18rem 0; background: #F6F6F6;}
#ethic .sect2 .in2{display: flex; justify-content: space-between;}
#ethic .sect2 .left{margin-right: 40px;}
#ethic .sect2 .left .tit{margin-bottom: 0.66667em; font-size: 4.8rem; font-weight: 700;}
#ethic .sect2 .left .desc{font-size: var(--desc-size); word-break: keep-all; line-height: 1.6667em;}
#ethic .sect2 .left .desc div + div{margin-top: 1.6em;}
#ethic .sect2 .right{flex-shrink: 0; width: 50%;}
#ethic .sect2 .right ol{}
#ethic .sect2 .right ol > li{}
#ethic .sect2 .right ol > li + li{margin-top: 7.5rem;}
#ethic .sect2 .right ol li .num{display: block; margin-bottom: 1.5em; color: #B3B3B3; font-size: 2.4rem; font-weight: 600; font-family: var(--pop); line-height: 1em;}
#ethic .sect2 .right ol li .tit{margin-bottom: 0.6667em; font-size: 3rem; font-weight: 700;}
#ethic .sect2 .right ol li ul{}
#ethic .sect2 .right ol li ul li{position: relative; padding-left: 0.6em; font-size: var(--desc-size); word-break: keep-all; line-height: 1.6667em;}
#ethic .sect2 .right ol li ul li::before{content: '·'; position: absolute; top: 0; left: 0;}

#ethic .sect3{}
#ethic .sect3 .in2{display: flex; justify-content: space-between;}
#ethic .sect3 .left{width: 45%;}
#ethic .sect3 .left .tit{margin-bottom: 0.66667em; font-size: 4.8rem; font-weight: 700;}
#ethic .sect3 .left .desc{font-size: var(--desc-size); word-break: keep-all; line-height: 1.6667em;}
#ethic .sect3 .left .desc div + div{margin-top: 1.6em;}
#ethic .sect3 .left dl{display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 1.2rem 2.4rem; padding: 2.5rem 3.6rem; margin-top: 6rem; background: #F6F6F6; font-size: 13px; border-radius: 12px;}
#ethic .sect3 .left dl dt{color: #B6B6B6; font-weight: 600;}
#ethic .sect3 .left dl dd{}
#ethic .sect3 .right{width: 45%;}
#ethic .sect3 .right .input_wrap{}
#ethic .sect3 .right .input_wrap .item{}
#ethic .sect3 .right .input_wrap .item + .item{margin-top: 40px;}
#ethic .sect3 .right .input_wrap .tit{margin-bottom: 0.9em; font-size: 1.6rem; font-weight: 600;}
#ethic .sect3 .right .input_wrap .tit.req::before{content: '*'; margin-right: 0.25em; color: var(--blue);}
#ethic .sect3 .right .input_wrap .txt_wrap{display: flex;}
#ethic .sect3 .right .input_wrap .txt_wrap div{flex: 1;}
#ethic .sect3 .right .input_wrap .txt_wrap div + div{margin-left: 2.5rem;}
#ethic .sect3 .right .input_wrap .txt_wrap div input{width: 100%;}
#ethic .sect3 .right .input_wrap .email_wrap{}
#ethic .sect3 .right .input_wrap .email_wrap .inp{display: flex; align-items: center; margin-bottom: 16px;}
#ethic .sect3 .right .input_wrap .email_wrap .inp input{width: 100%;}
#ethic .sect3 .right .input_wrap .email_wrap .inp span{margin: 0 1em; color: #292929; font-size: 16px;}
#ethic .sect3 .right .input_wrap .email_wrap .nice-select{height: 4em; line-height: 4em; padding: 0 2.5em 0 1.5em; border: 1px solid #d7d7d7; font-size: var(--desc-size); border-radius: 8px;}
#ethic .sect3 .right .input_wrap .email_wrap .nice-select::after{top: calc(50% - 5px); right: 1.25em; width: 10px; height: 10px; margin-top: 0; transform: rotate(0deg); transform-origin: center; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><style>path{fill: %23989898;}</style><path d="M320 240L160 384 0 240l0-48 320 0 0 48z"/></svg>') no-repeat center center/cover; border: none;}
#ethic .sect3 .right .input_wrap .email_wrap .nice-select.open:after{transform: rotate(180deg);}
#ethic .sect3 .right .input_wrap .desc{position: relative; padding-left: 1.2em; margin-top: 1em; color: #b3b3b3; font-size: 13px;}
#ethic .sect3 .right .input_wrap .desc::before{content: '※'; position: absolute; top: 0; left: 0; font-size: 1.5em; font-weight: 200; line-height: 1em;}
#ethic .sect3 .right .btn{display: flex; align-items: center; height: 4em; padding: 0 1.75em; margin-top: 2em; margin-left: auto; border: 1px solid #000; font-size: 1.4rem; font-weight: 500; border-radius: 2em; transition: background 0.25s, color 0.25s;}
#ethic .sect3 .right .btn svg{margin-left: 2.5em; transition: fill 0.25s;}
#ethic .sect3 .right .btn:hover{background: #000; fill: #fff; color: #fff;}


/* 사업분야 공통 */
#business{}
#business .bottom_txt{margin-top: 25rem;}
#business .bottom_txt .tit{font-size: 5rem; font-weight: 700; text-align: center;}
#business .bottom_txt .txt_flow { display: flex; flex: 0 0 auto; white-space: nowrap; overflow: hidden; transition: 0.3s; color: var(--blue); font-weight: 600; font-family: var(--pop); text-transform: uppercase; user-select: none; }
#business .bottom_txt .txt_flow p { animation: textLoop 80s linear infinite; padding-left: 0.5em; font-size: 14rem; }
#business .bottom_txt .btn_wrap{text-align: center;}
#business .bottom_txt .btn_wrap a{display: inline-flex; align-items: center; padding: 1.5em; margin-top: 4em; background: #000; fill: #fff; color: #fff; font-size: var(--desc-size); font-weight: 700; border-radius: 2em; line-height: 1em; transition: background 0.25s;}
#business .bottom_txt .btn_wrap a svg{margin-left: 3em;}
@keyframes textLoop {
    0% {-webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
    100% {-webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0);}
}


#business .text_sect{padding: 25rem 0;}
#business .text_sect .txt_grid{display: flex; align-items: center; justify-content: center; height: 100%;}
#business .text_sect .txt_grid .txt_wrap{display: flex; flex-direction: column; align-items: center;}
#business .text_sect .txt_grid .txt_wrap .tit{display: inline-block; position: relative; white-space: nowrap; color: #e1e1e1; font-size: 6.4rem; font-weight: 700; line-height: 1.425em;}
#business .text_sect .txt_grid .txt_wrap .tit .copy {position: absolute; left: 0; top: 0; width: 0%; height: 100%; font-size: 1em; font-weight: inherit; color: #000; overflow: hidden; white-space: nowrap;}
#business .text_sect .txt_grid .txt_wrap .sub_tit{display: inline-block; position: relative; white-space: nowrap; margin-top: 3em; color: #e1e1e1; font-size: 3.5rem; font-weight: 700; line-height: 1.425em;}
#business .text_sect .txt_grid .txt_wrap .sub_tit .copy {position: absolute; left: 0; top: 0; width: 0%; height: 100%; font-size: 1em; font-weight: inherit; color: #000; overflow: hidden; white-space: nowrap;}

/* 하단 롤링 */
#business .rolling_sect{height: 100vh;}
#business .rolling_sect .roll_wrap{display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%;}
#business .rolling_sect .roll_cont{}
#business .rolling_sect .roll_txt{display: flex; align-items: center; justify-content: center; margin-bottom: 1.4em; font-size: 120px; font-weight: 700; text-transform: uppercase; line-height: 1.2em;}
#business .rolling_sect .roll_txt .roll{overflow: hidden; height: 1.2em;}
#business .rolling_sect .roll_txt .roll.left{margin-right: 0.5em; text-align: right;}
#business .rolling_sect .roll_txt .roll.right{margin-left: 0.5em; text-align: left;}
#business .rolling_sect .roll_txt span{display: block; transition: transform 0.5s, opacity 0.5s 0.25s;}
#business .rolling_sect .roll_txt span:last-child{opacity: 0.15;}
#business .rolling_sect .roll_txt p{}
#business .rolling_sect .sub_tit{overflow: hidden; font-size: 50px; font-weight: 700;}
#business .rolling_sect .sub_tit span{display: block; transform: translateY(100%); transition: transform 0.5s;}
#business .rolling_sect .roll_wrap.active .roll_txt span{transform: translateY(-100%);}
#business .rolling_sect .roll_wrap.active .roll_txt span:last-child{opacity: 1;}
#business .rolling_sect .roll_wrap.active .sub_tit span{display: block; transform: translateY(0%); transition: transform 0.5s 0.25s;}

#business .video_sect{display: flex; align-items: center; height: 100vh}
#business .video_sect .in2{display: flex; align-items: center; height: 100%;}
#business .video_sect .video { position: relative; transform: scale(1); width: 60%; height: 56.25%; margin: 0 auto; pointer-events: none;}
#business .video_sect .video video { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: calc(100% + 1px); object-fit: cover; filter: brightness(0.98); }
#business .video_sect .video iframe { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: calc(100% + 1px); object-fit: cover; filter: brightness(0.98); }
@media (max-aspect-ratio: 1/1) {
    #business .video_sect{}
}


#business .busi_cont_sect{overflow: hidden; position: relative; padding: 320px 0; background: #000;}
#business .busi_cont_sect::before{content: ''; position: absolute; bottom: 0; right: 0; opacity: 0.56; transform: translate(35%, 35%); width: 70%; height: 0; padding-top: 70%; background: url(../img/common/footer_bg.svg) no-repeat 0 0; background-size: 100%;}
#business .busi_cont_sect .cont_txt_box{color: #fff;}
#business .busi_cont_sect .cont_txt_box em{display: block; margin-bottom: 1em; color: var(--white); font-size: 2rem; font-weight: 500;}
#business .busi_cont_sect .cont_txt_box .tit{margin-bottom: 1em; font-size: 6.5rem; font-weight: 700; line-height: 1.3em;}
#business .busi_cont_sect .cont_txt_box .sub_tit{margin-bottom: 1em; font-size: 2.4rem; font-weight: 700;}
#business .busi_cont_sect .cont_txt_box .desc{opacity: 0.6; font-size: var(--desc-size); line-height: 1.6667em; word-break: keep-all;}
#business .busi_cont_sect .cont_txt_box .img{margin-top: 75px;}

#business .promo_in{position: relative; width: clamp(1180px, 70vw, 1440px); max-width: 100%; padding: 0 2rem; margin: 0 auto;}
#business .promo_box{position: relative; padding-top: 25rem;}
#business .promo_box .promo_img{position: absolute; top: 25rem; left: 50%; transform: translateX(-50%); width: calc(44% - 90px);}
#business .promo_box .promo_img .img{position: relative; width: 100%; height: 0%; padding-top: 115%;}
#business .promo_box .promo_img .img img{position: absolute; top: 0; left: 0; opacity: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity 0.25s ease;}
#business .promo_box .promo_img .img img:first-child{opacity: 1;}
#business .promo_box .promo_box_wrap{display: flex; flex-direction: column;}
#business .promo_box .promo_box_wrap .box{display: flex; align-items: center;}
#business .promo_box .promo_box_wrap .box + .box{margin-top: 40rem;}
#business .promo_box .promo_box_wrap .box .img_wrap{width: calc(44% - 90px); padding-top: calc((44% - 90px)*1.15);}
#business .promo_box .promo_box_wrap .box .img_wrap img{display: none;}
#business .promo_box .promo_box_wrap .box .txt_wrap{width: 28%;}
#business .promo_box .promo_box_wrap .box .txt_wrap em{white-space: nowrap; font-size: 7rem; font-weight: 700; text-transform: uppercase; line-height: 1.1em;}
#business .promo_box .promo_box_wrap .box .txt_wrap em.small{font-size: 6rem;}
#business .promo_box .promo_box_wrap .box .txt_wrap em.eng{font-family: var(--pop);}
#business .promo_box .promo_box_wrap .box .txt_wrap .tit{margin-top: 0.5em; margin-bottom: 1.25em; font-size: 2.8rem; font-weight: 700;}
#business .promo_box .promo_box_wrap .box .txt_wrap .desc{white-space: nowrap; margin-top: 3.3em; margin-bottom: 4em; font-size: 15px; line-height: 1.6667em; word-break: keep-all;}
#business .promo_box .promo_box_wrap .box .txt_wrap .tag{display: flex; flex-wrap: wrap; justify-content: flex-end; margin-left: auto;}
#business .promo_box .promo_box_wrap .box .txt_wrap .tag li{padding: 0.9em 1.25em; margin-left: 10px; margin-bottom: 16px; background: #f6f6f6; border: 1px solid #f6f6f6; color: #505050; font-size: 13px; font-weight: 600; text-transform: capitalize; border-radius: 2em; line-height: 1em; transition: all 0.25s;}
#business .promo_box .promo_box_wrap .box.active .txt_wrap .tag li{background: #fff; border-color: var(--blue); color: var(--blue);}
#business .promo_box .promo_box_wrap .box.left{text-align: right;}
#business .promo_box .promo_box_wrap .box.left .txt_wrap{margin-right: 45px;}
#business .promo_box .promo_box_wrap .box.right{text-align: left;}
#business .promo_box .promo_box_wrap .box.right .img_wrap{margin-left: auto;}
#business .promo_box .promo_box_wrap .box.right .txt_wrap{margin-left: 45px;}
#business .promo_box .promo_box_wrap .box.right .txt_wrap .tag{justify-content: flex-start; margin-left: 0;}
#business .promo_box .promo_box_wrap .box.right .txt_wrap .tag li{margin-left: 0; margin-right: 10px;}



#business.busi1 .busi_cont_sect .flex_wrap{display: flex; justify-content: space-between;}
#business.busi1 .busi_cont_sect .flex_wrap .right{display: flex; justify-content: flex-end; width: 50%; margin-left: 4rem;}
#business.busi1 .busi_cont_sect .flex_wrap .right div{opacity: 0; transform: translateX(-15%); transition: opacity 0.75s, transform 0.75s;}
#business.busi1 .busi_cont_sect .flex_wrap .right div + div{margin-left: 4rem;}
#business.busi1 .busi_cont_sect .flex_wrap.active .right div{opacity: 1; transform: translateX(0%);}
#business.busi1 .busi_cont_sect .flex_wrap.active .right div:first-child{transition-delay: 0.2s;}
#business.busi1 .busi_cont_sect .flex_wrap.active .right div:nth-child(2){transition-delay: 0.4s;}
#business.busi1 .busi_cont_sect .flex_wrap.active .right div:nth-child(3){transition-delay: 0.6s;}



#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap{color: #fff;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em{font-size: 7rem; line-height: 1.3em;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em p{display: flex; align-items: center; justify-content: flex-end;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em p img{height: 0.85em;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em p img:first-child{margin-right: 0.25em;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em p img:last-child{margin-left: 0.25em;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em p svg{fill: #fff; height: 0.85em; margin-left: 0.25em;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em p .f_only{display: none;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap .desc{margin-top: 1.5em;}
#business.busi2 .promo_box .promo_box_wrap .box .txt_wrap .tag li{background: none; border: 1px solid rgba(255, 255, 255, 0.4); color: #939393;}
#business.busi2 .promo_box .promo_box_wrap .box.active .txt_wrap .tag li{background: none; border-color: var(--white); color: var(--white);}

#business.busi2 .sect1{padding-top: 25rem;}
#business.busi2 .sect1 .in2{display: flex; justify-content: space-between;}
#business.busi2 .sect1 .left{font-size: 56px; font-weight: 700; font-family: var(--pop); text-transform: uppercase; line-height: 1.3em;}
#business.busi2 .sect1 .right{width: 63.5%;}
#business.busi2 .sect1 .right .list{column-count: 2; column-gap: 48px;}
#business.busi2 .sect1 .right .list .item{display: inline-block; break-inside: avoid; opacity: 0; transform: translateY(15%); width: 100%; margin-bottom: 90px; transition: opacity 0.5s, transform 0.5s;}
#business.busi2 .sect1 .right .list .item .img{}
#business.busi2 .sect1 .right .list .item .tit{margin-top: 0.8em; margin-bottom: 0.5em; font-size: 26px; font-weight: 700; line-height: 1.4em;}
#business.busi2 .sect1 .right .list .item .desc{font-size: var(--desc-size); line-height: 1.6667em;}
#business.busi2 .sect1 .right .list .item.active{opacity: 1; transform: translateY(0%);}



#business.busi3{}
#business.busi3 .busi_cont_sect{margin-bottom: 25rem;}
#business.busi3 .sect1{padding-top: 25rem;}
#business.busi3 .sect1 .txt_box{color: #fff;}
#business.busi3 .sect1 .txt_box .tit{font-size: 5rem; font-weight: 700; font-family: var(--pop);}
#business.busi3 .sect1 .txt_box .desc{margin-top: 0.5em; font-size: var(--desc-size);}
#business.busi3 .sect1 .cont_wrap{display: flex; align-items: center; position: relative; margin-top: 9rem;}
#business.busi3 .sect1 .cir_wrap { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%;}
#business.busi3 .sect1 .cir_wrap .cir { position: relative; width: calc(100%/3 + 20px); padding-top: calc(100%/3 + 10px); border: 1px solid var(--blue); border-radius: 100%; }
#business.busi3 .sect1 .cir_wrap .cir:first-child{ margin-right: -30px; }
#business.busi3 .sect1 .cir_wrap .cir:nth-child(2){z-index: 1;}
#business.busi3 .sect1 .cir_wrap .cir:nth-child(3){ margin-left: -30px; }
#business.busi3 .sect1 .cir_wrap .cir .cir_in { position: absolute; left: 50%; top: 50%; width: 80%; transform: translate(-50%, -50%); }
#business.busi3 .sect1 .cir_wrap .cir .cir_in .tit { color: var(--blue); font-size: 4rem; font-weight: 600; font-family: var(--pop); text-align: center; text-transform: uppercase; line-height: 1.4em;}
#business.busi3 .sect1 .cir_wrap .cir .cir_in .tit.hide{position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; color: transparent;}
#business.busi3 .sect1 .list_wrap{transform: translateY(100%); opacity: 0; width: 50%; margin-left: auto;}
#business.busi3 .sect1 .list_wrap ul{}
#business.busi3 .sect1 .list_wrap ul li{display: flex; align-items: center; padding: 6rem 0; color: #fff;}
#business.busi3 .sect1 .list_wrap ul li:first-child{padding-top: 0;}
#business.busi3 .sect1 .list_wrap ul li:last-child{padding-bottom: 0;}
#business.busi3 .sect1 .list_wrap ul li + li{border-top: 1px solid rgba(255, 255, 255, 0.3);}
#business.busi3 .sect1 .list_wrap ul li p{font-size: 5rem; font-weight: 700; font-family: var(--pop); text-transform: uppercase;}
#business.busi3 .sect1 .list_wrap ul li span{white-space: nowrap; opacity: 0.6; margin-left: 1.5em; font-size: 2rem; font-weight: 500;}

#business.busi3 .promo_box{}
#business.busi3 .promo_tit{position: absolute; top: 0; width: 100%; text-align: center;}
#business.busi3 .promo_tit p{margin-bottom: 0.3em; font-size: 5.6rem; font-weight: 700; font-family: var(--pop);}
#business.busi3 .promo_tit span{display: block; font-size: var(--desc-size);}
#business.busi3 .promo_box .promo_img{}
#business.busi3 .promo_box .promo_box_wrap .box .txt_wrap{}
#business.busi3 .promo_box .promo_box_wrap .box .txt_wrap .desc{margin-bottom: 0;}
#business.busi3 .promo_box .promo_box_wrap .box .txt_wrap .desc b{display: block; margin-bottom: 0.4em; font-size: 2.6rem; font-weight: 700; font-family: var(--pop);}
#business.busi3 .promo_box .promo_box_wrap .box .txt_wrap .desc b ~ b{margin-top: 1em;}
#business.busi3 .promo_box .promo_box_wrap .box .txt_wrap .desc span{display: block;}
#business.busi3 .sect2{padding-top: 25rem;}
#business.busi3 .sect2 .tit{font-size: 5.6rem; font-weight: 700; font-family: var(--pop); text-align: center; text-transform: uppercase;}
#business.busi3 .sect2 .list{display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 80px;}
#business.busi3 .sect2 .list .item{opacity: 0; transform: translateY(15%); transition: opacity 0.5s 0.2s, transform 0.5s 0.2s;}
#business.busi3 .sect2 .list .item.active{opacity: 1; transform: translateY(0%);}



#business.busi4 .rolling_sect .roll_txt{font-size: 100px;}
#business.busi4 .busi_cont_sect::before{left: 0; right: auto; transform: translate(-35%, 35%);}
#business.busi4 .promo_box .promo_box_wrap .box .txt_wrap .desc{margin-bottom: 0;}
#business.busi4 .bg_video{ position: absolute; bottom: -5%; right: -5%; opacity: 0.7; width: 45%; padding-top: 45%; }
#business.busi4 .bg_video video { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: contain; }
#business.busi4 .circles{position: relative; z-index: 1; margin-top: 12.5rem;}
#business.busi4 .circles .circles_txt{position: absolute; white-space: nowrap; top: 50%; left: 50%; z-index: 2; transform: translate(-50%, -50%); color: #fff; font-size: 85px; font-family: var(--pop); font-weight: 700; transition: transform 0.75s, opacity 0.75s;}
#business.busi4 .circles .circles_in{display: flex; align-items: center; justify-content: center;}
#business.busi4 .circles .item{position: relative; width: calc(100%/5 - 20px); backdrop-filter: blur(16px) brightness(1.2); padding-top: calc(100%/5 - 20px); background: rgba(153, 153, 153, 0.2); border-radius: 50%; transition: transform 0.75s;}
#business.busi4 .circles .item + .item{margin-left: 30px;}
#business.busi4 .circles .item .box{position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; text-align: center;}
#business.busi4 .circles .item .box p{margin-bottom: 1em; color: #939393; font-size: 2.4rem; font-family: var(--pop); font-weight: 600;}
#business.busi4 .circles .item .box .img{position: relative; padding-top: 24%;}
#business.busi4 .circles .item .box .img img{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
#business.busi4 .circles .item:first-child{transform:translateX(25%);}
#business.busi4 .circles .item:first-child .box img{width: 40%;}
#business.busi4 .circles .item:nth-child(2) .box img{width: 60%;}
#business.busi4 .circles .item:nth-child(5){transform:translateX(-25%);}
#business.busi4 .circles .item:nth-child(5) .box img{width: 45%;}
#business.busi4 .circles:hover .circles_txt{opacity: 0; transform: translate(-85%, -50%); pointer-events: none;}
#business.busi4 .circles:hover .item:first-child{transform:translateX(0%);}
#business.busi4 .circles:hover .item:nth-child(3){transform:translateX(0%);}



#sheet{}
#sheet .top{display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 25px;}
#sheet .top .nice-select{width: 9em; height: 3em; line-height: 3em; padding: 0 2.5em 0 1.5em; border-color: #d7d7d7; font-size: 16px; font-weight: 600; border-radius: 8px;}
#sheet .top .nice-select::after{top: calc(50% - 5px); right: 1.25em; width: 10px; height: 10px; margin-top: 0; transform: rotate(0deg); transform-origin: center; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><style>path{fill: %23000000;}</style><path d="M320 240L160 384 0 240l0-48 320 0 0 48z"/></svg>') no-repeat center center/cover; border: none;}
#sheet .top .nice-select.open:after{transform: rotate(180deg);}
#sheet .top .nice-select .list{overflow-y: auto; max-height: 15em;}
#sheet .top .nice-select .list::-webkit-scrollbar{width: 5px;}
#sheet .top .nice-select .list::-webkit-scrollbar-thumb{background: #efefef; border-radius: 3px;}
#sheet .top .nice-select .list::-webkit-scrollbar-track{background: #fff;}
#sheet .top .nice-select .list .option{min-height: 2em; padding: 0 1em;}
#sheet .top .txt_box{color: #868686; font-size: 12px; text-align: right;}
#sheet .tbl_wrap{}
#sheet .tbl_wrap table{table-layout: fixed; width: 100%; border-top: 1px solid #000;}
#sheet .tbl_wrap table th{padding: 1em 1.6em; background: #F6F6F6; font-size: var(--desc-size); font-weight: 600;}
#sheet .tbl_wrap table td{padding: 1em 1.6em; border: 1px solid #E5E5E5 !important; font-size: var(--desc-size);}
#sheet .tbl_wrap table td:first-child{border-left: none !important;}
#sheet .tbl_wrap table td:last-child{border-right: none !important;}



#press .press_list{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4rem 4rem;}
#press .press_list .item{overflow: hidden; cursor: pointer;}

#press .press_list .item .txt_wrap{padding: 4rem 3rem; background: #F8F8F8; transition: background 0.25s;}
#press .press_list .item .top{display: flex; align-items: center; justify-content: space-between; margin-bottom: 4.5rem;}
#press .press_list .item .top .cat{padding: 0.65em 1em; background: #fff; color: var(--blue); font-size: 1.4rem; font-weight: 600; font-family: var(--pop); text-transform: uppercase; border-radius: 2em; line-height: 1em; transition: background 0.25s, color 0.25s;}
#press .press_list .item .top .date{color: #B3B3B3; font-size: 1.4rem; font-weight: 600; line-height: 1em;}
#press .press_list .item .txt_box{}
#press .press_list .item .txt_box .tit{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 2.8em; font-size: 2.3rem; font-weight: 700; letter-spacing: -0.010em; line-height: 1.4em;}
#press .press_list .item .txt_box .txt{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; height: 5.25em; font-size: var(--desc-size); line-height: 1.75em;}
#press .press_list .item .img{overflow: hidden; position: relative; padding-top: 70%; background: url(../img/common/logo_color.svg) no-repeat center 45% #ececec; background-size: 55%;}
#press .press_list .item .img img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; transition: transform 0.25s ease-in-out;}
#press .press_list .item:hover .txt_wrap{background: #0040981f;}
#press .press_list .item:hover .top .cat{background: var(--blue); color: #fff;}
#press .press_list .item:hover .img img{transform: translate(-50%, -50%) scale(1.1);}
#press .pointer { position: fixed; top: 0; left: 0; z-index: 100; pointer-events: none; }
#press .pointer .pointer_box { display: flex; flex-direction: column; justify-content: center; align-items: center; overflow: hidden; transform: translate(-50%,-50%); opacity: 0; backdrop-filter: blur(16px) brightness(1.2); width: 140px; height: 140px; background-color: rgba(0, 64, 152, 0.7); color: #fff; font-size: 16px; font-weight: 700; line-height: 1em; border-radius: 50%; transition: all 0.25s ease-out; }
#press .pointer .pointer_box span { display: block; white-space: nowrap; text-align: center; }
#press .pointer.on .pointer_box { opacity: 1 }



#dart{}
#dart .dart_list .list_head{display: flex; align-items: center; justify-content: flex-start; border-top: 2px solid #000; border-bottom: 1px solid #e5e5e5; font-size: 1.6rem; font-weight: 600; text-align: center;}
#dart .dart_list .list_head div{padding: 2.4rem 0;}
#dart .dart_list .list_head .num{width: 6%;}
#dart .dart_list .list_head .tit{flex: 1;}
#dart .dart_list .list_head .nm{ flex-shrink: 0; width: 13%;}
#dart .dart_list .list_head .date{ flex-shrink: 0; width: 13%;}
#dart .dart_list .list_body { }
#dart .dart_list .list_body a { display: flex; align-items: center; justify-content: flex-start; padding: 2.5rem 0; border-bottom: 1px solid #e5e5e5; transition: background-color 0.5s; }
#dart .dart_list .list_body a .num { width: 6%; padding: 0 1em; font-size: 1.5rem; color: #B3B3B3; font-weight: 600; text-align: center; }
#dart .dart_list .list_body a .tit { width: calc(83% - 4rem); padding-left: 1em; font-size: 1.9rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#dart .dart_list .list_body a .nm{ flex-shrink: 0; width: 13%; padding: 0 1em; font-size: 1.5rem; text-align: center; }
#dart .dart_list .list_body a .date { flex-shrink: 0; width: 13%; padding: 0 1em; font-size: 1.5rem; color: #B3B3B3; font-weight: 600; text-align: center; }


/* 오시는 길 */
#location{}
#location .map_wrap{}
#location .map_wrap .map_top{display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 32px;}
#location .map_wrap .map_top .left{display: flex; align-items: baseline;}
#location .map_wrap .map_top .left svg{margin-right: 0.5em; font-size: 2.4rem;}
#location .map_wrap .map_top .left p{color: #262932; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.010em;}
#location .map_wrap .map_top .right{display: flex; flex-shrink: 0; margin-left: 4rem;}
#location .map_wrap .map_top .right a{display: flex; align-items: center; justify-content: center; min-width: 10em; height: 3.5em; padding: 0 1.5em; border: 1px solid #000; font-size: 1.4rem; font-weight: 500; border-radius: 2em; line-height: 1em;}
#location .map_wrap .map_top .right a + a{margin-left: 1.2em;}
#location .map_wrap .map_top .right img{margin-right: 12px;}
#location .map_wrap .map{position: relative; /*padding-top: 40.625%;*/}
#location .map_wrap #map{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#location .map_wrap iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#location .contact_list{display: flex; margin-top: 56px;}
#location .contact_list .item{flex: 1; position: relative; padding-top: 36px;}
#location .contact_list .item + .item{margin-left: 50px;}
#location .contact_list .item::before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 2px; background: #000; transition: width 0.25s;}
#location .contact_list .item span{display: flex; align-items: center; fill: #989898; color: #989898; font-size: var(--desc-size); font-weight: 700;}
#location .contact_list .item span svg{margin-right: 0.5em;}
#location .contact_list .item p{margin-top: 0.8em; font-size: 2.8rem; font-weight: 700; line-height: 1.1em;}
#location .contact_list .item.email p{font-size: 2.5rem;}


/* 고객문의 */
#contact{}
#contact .in2{display: flex; justify-content: space-between;}
#contact .left{}
#contact .left .tit{font-size: 4.5rem; font-weight: 700; line-height: 1.3333em;}
#contact .left .sub_tit{margin-bottom: 1.2em; font-size: 2rem; font-weight: 700; font-family: var(--pop); text-transform: uppercase;}
#contact .right{width: 55%;}
#contact .right div[class^='sect'] + div{margin-top: 10rem;}
#contact .right .sect_tit{margin-bottom: 1.5em; font-size: 2.4rem; font-weight: 700;}
#contact .sect1{}
#contact .sect1 .radio_wrap{display: flex; justify-content: space-between;}
#contact .sect1 .radio_wrap div{flex: 1;}
#contact .sect1 .radio_wrap div + div{margin-left: 16px;}
#contact .sect1 .radio_wrap input{}
#contact .sect1 .radio_wrap input + label{display: block; padding: 1em; border: 1px solid #000; font-size: 2rem; text-align: center; border-radius: 10px; cursor: pointer; transition: all 0.25s;}
#contact .sect1 .radio_wrap input + label p{margin-bottom: 0.5em; font-weight: 600; line-height: 1em;}
#contact .sect1 .radio_wrap input + label span{display: block; color: #B3B3B3; font-size: 0.65em;}
#contact .sect1 .radio_wrap input:checked + label{background: var(--blue); border-color: var(--blue); color: #fff;}
#contact .sect1 .radio_wrap input:checked + label span{color: #fff;}

#contact .sect2{transition: opacity 0.5s;}
#contact .sect2 .radio_wrap{display: flex;}
#contact .sect2 .radio_wrap div{}
#contact .sect2 .radio_wrap div + div{margin-left: 16px;}
#contact .sect2 .radio_wrap input + label{display: block; padding: 1em 2em; border: 1px solid #D7D7D7; font-size: var(--desc-size); font-weight: 500; text-align: center; border-radius: 2em; text-transform: capitalize; line-height: 1em; cursor: pointer; transition: all 0.25s;}
#contact .sect2 .radio_wrap input:checked + label{background: var(--blue); border-color: var(--blue); color: #fff;}
#contact .sect2 .contact02{display: none;}

#contact .sect3{transition: opacity 0.5s;}
#contact .sect3 .item{}
#contact .sect3 .item + .item{margin-top: 4.5rem;}
#contact .sect3 .input_wrap .tit{margin-bottom: 0.9em; font-size: var(--desc-size); font-weight: 600;}
#contact .sect3 .input_wrap .tit.req::before{content: '*'; margin-right: 0.25em; color: var(--blue);}
#contact .sect3 input[type="text"]{width: 100%;}
#contact .sect3 .agree_txt{padding: 3.6rem; background: #F6F6F6; border-radius: 8px;}
#contact .sect3 .agree_txt p{color: #868686; font-size: 13px; line-height: 1.75em;}
#contact .sect3 .email_wrap{display: flex;}
#contact .sect3 .email_wrap .inp{display: flex; align-items: center; width: 65%; margin-right: 16px;}
#contact .sect3 .email_wrap .inp span{margin: 0 1em; color: #292929; font-size: var(--desc-size);}
#contact .sect3 .email_wrap .nice-select{flex: 1; height: 4em; line-height: 4em; padding: 0 2.5em 0 1.5em; border: 1px solid #d7d7d7; font-size: var(--desc-size); border-radius: 8px;}
#contact .sect3 .email_wrap .nice-select::after{top: calc(50% - 5px); right: 1.25em; width: 10px; height: 10px; margin-top: 0; transform: rotate(0deg); transform-origin: center; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><style>path{fill: %23989898;}</style><path d="M320 240L160 384 0 240l0-48 320 0 0 48z"/></svg>') no-repeat center center/cover; border: none;}
#contact .sect3 .email_wrap .nice-select.open:after{transform: rotate(180deg);}
#contact .sect3 .cap_wrap{display: grid; grid-template-columns: auto minmax(0, 1fr);}
#contact .sect3 .cap_wrap .captcha{display: flex; align-items: center; margin-right: 5rem;}
#contact .sect3 .cap_wrap .captcha button{display: flex; align-items: center; justify-content: center; width: 2.5em; height: 100%; padding: 0 1rem; font-size: 2.2rem;}
#contact .sect3 .cap_wrap .captcha img{height: 100%;}
#contact .sect3 .cap_wrap input{}
#contact .sect3 .agree_chk{display: flex; align-items: flex-start; justify-content: space-between;}
#contact .sect3 .agree_chk div{}
#contact .sect3 .agree_chk input + label{display: block; position: relative; white-space: nowrap; padding-left: 1.75em; margin-left: 2em; font-size: var(--desc-size); font-weight: 600; cursor: pointer;}
#contact .sect3 .agree_chk input + label::before{content: ''; position: absolute; top: calc(50% - 0.6em); left: 0; width: 1.2em; height: 1.2em; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512"><style>path{fill: %23b6b6b6;}</style><path d="M384 64c17.7 0 32 14.3 32 32l0 320c0 17.7-14.3 32-32 32L64 448c-17.7 0-32-14.3-32-32L32 96c0-17.7 14.3-32 32-32l320 0zM64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64L64 32z"/></svg>') no-repeat center center/cover;}
#contact .sect3 .agree_chk input:checked + label{}
#contact .sect3 .agree_chk input:checked + label::before{background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512"><style>path{fill: %23EA5514;}</style><path d="M64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64L64 32zM337 209L209 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L303 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z"/></svg>') no-repeat center center/cover;}

#contact .btn_wrap{}
#contact .btn_wrap button{display: flex; align-items: center; height: 4em; padding: 0 5em; margin-top: 2em; margin-left: auto; border: 1px solid #000; color: #000; font-size: 1.4rem; font-weight: 500; border-radius: 2em; transition: background 0.25s, color 0.25s;}
#contact .btn_wrap button:hover{background: #000; fill: #fff; color: #fff;}

#contact .disable {pointer-events: none; user-select: none; opacity: 0.15;}


/* 페이징 */
.pagination { display: flex; align-items: center; justify-content: center; margin-top: 15rem; font-size: 14px; }
.pagination > a { display: flex; align-items: center; justify-content: center; width: 2.7em; height: 2.7em; background: #F4F4F4; fill: #b4b4b4; border-radius: 50%; }
.pagination > a + a { margin-left: 0.7em; }
.pagination > a svg{transition: fill 0.25s;}
.pagination .num_list { display: flex; align-items: center; justify-content: center; margin: 0 0.85em;}
.pagination .num_list li {  }
.pagination .num_list li + li{margin-left: 0.85em;}
.pagination .num_list li a { position: relative; display: flex; align-items: center; justify-content: center; width: 2.7em; height: 2.7em; color: #262932; border-radius: 50%;}
.pagination .num_list li.active a{background: #004098; color: #fff;}

/*호버 스타일*/
@media screen and (min-width: 1241px){
    .board_view .btn_wrap a:hover{background: var(--blue); color: #fff;}
    .board_view .board_li_wrap .box:hover .ico{fill: var(--blue);}
    #history .history_bar .bar_wrap .item:hover{background: var(--blue);}
    #history .history_bar .bar_wrap .item:hover span{color: #fff;}
    #history .history_bar .bar_wrap .item:hover p{color: #fff;}
    #business .bottom_txt .btn_wrap a:hover{background: var(--blue);}
    #dart .dart_list .list_body a:hover{background: #f8f8f8;}
    #contact .sect1 .radio_wrap input + label:hover{background: var(--blue); border-color: var(--blue); color: #fff;}
    #contact .sect1 .radio_wrap input + label:hover span{color: #fff;}
    #contact .sect2 .radio_wrap input + label:hover{background: var(--blue); border-color: var(--blue); color: #fff;}
    .pagination > a:hover{fill: #000;}
}

@media screen and (max-width: 1921px){

    :root{

    }

    .sub_top{padding-bottom: 80px;}
    .sub_top .sub_page_tit h2{}

    .sub_top.history .sub_page_tit .sub_tit{font-size: 18px;}

    .sub_contents{padding-bottom: 21rem;}

    #contribute .contribute_list .img{margin-bottom: 20px;}
    #contribute .contribute_list .txt_box .top{margin-bottom: 16px;}
    #contribute .contribute_list .txt_box .top .cat{}
    #contribute .contribute_list .txt_box .top .since{}
    #contribute .contribute_list .txt_box .tit{}

    .board_view .top .tit{}
    .board_view .cont{}

    #history .history_cont{}
    #history .history_cont .left .tit{}
    #history .history_cont .right{margin-left: 9rem;}
    #history .history_bar .bar_wrap{}

    #business .busi_cont_sect{padding: 240px 0;}
    #business .busi_cont_sect .cont_txt_box em{}
    #business .busi_cont_sect .cont_txt_box .tit{}
    #business .busi_cont_sect .cont_txt_box .sub_tit{}
    #business .busi_cont_sect .cont_txt_box .desc{}

    #business .promo_box{}
    #business .promo_box .promo_img{}
    #business .promo_box .promo_box_wrap .box .txt_wrap .desc{}
    #business .promo_box .promo_box_wrap .box .txt_wrap .tag li{padding: 0.6em 1em;}

    #business .bottom_txt{}

    #business.busi2 .sect1{padding-top: 180px;}
    #business.busi2 .sect1 .left{font-size: 42px;}
    #business.busi2 .sect1 .right .list .item .tit{font-size: 21px;}
    #business.busi2 .sect1 .right .list .item .desc{}

    #business.busi3 .promo_tit p{}
    #business.busi3 .sect1{padding-top: 180px;}
    #business.busi3 .sect1 .txt_box .tit{}
    #business.busi3 .sect1 .txt_box .desc{}
    #business.busi3 .sect2 .tit{}

    #business.busi4 .circles .item .box p{}

    #press .press_list .item .txt_wrap{}
    #press .press_list .item .top{margin-bottom: 3.6rem;}

    #location .contact_list .item{padding-top: 24px;}

}

@media screen and (max-width: 1441px){



}

@media screen and (max-width: 1241px){

    :root{

    }

    .sub_contents{padding-bottom: 15rem;}

    .sub_top{padding-top: calc(var(--header-height)*0.5); padding-bottom: 80px;}
    .sub_top.history{padding-top: calc(var(--header-height)*1)}
    .sub_top .sub_navi_wrap .sub_navi{margin-bottom: 30px;}
    .sub_top .sub_page_tit h2{}

    .sub_top.history .sub_page_tit .sub_txt{font-size: 14px;}

    .cont_tit_wrap .tit{font-size: 4rem;}

    #greeting .greeting_wrap .right .tit{font-size: 3.5rem; word-break: keep-all;}
    #greeting .greeting_wrap .right .nm p{font-size: 20px;}

    #contribute .contribute_list{gap: 5rem 2rem;}
    #contribute .contribute_list .txt_box .top .cat{}
    #contribute .contribute_list .txt_box .top .since{}
    #contribute .contribute_list .txt_box .tit{}

    #history .history_cont{padding-top: 20rem;}
    #history .history_cont .left{width: auto;}
    #history .history_cont .left .tit{font-size: 5rem;}
    #history .history_cont .right .history_box + .history_box{margin-top: 7rem;}
    #history .history_cont .right .history_box .year{margin-right: 1em; font-size: 3rem;}
    #history .history_cont .right .history_box .box{font-size: 1.6rem;}
    #history .history_cont .right .history_box .box .img{}
    #history .history_bar .bar_wrap{padding: 1.2rem 3rem;}
    #history .history_bar .bar_wrap .item{padding: 0.6em 1em;}

    #ethic .sect1{padding-top: 15rem;}
    #ethic .sect1 .top .sub_tit{font-size: 2rem;}
    #ethic .sect1 .top .tit{font-size: 4.5rem;}
    #ethic .sect1 .bottom .card_list{margin-top: 6rem;}
    #ethic .sect1 .bottom .card_list ul{gap: 0 2.5rem;}
    #ethic .sect2 .in2{flex-direction: column;}
    #ethic .sect2 .left .tit{font-size: 3.6rem;}
    #ethic .sect2 .right{width: 100%;}
    #ethic .sect2 .right ol{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5rem 3.5rem; margin-top: 5rem;}
    #ethic .sect2 .right ol > li + li{margin-top: 0;}
    #ethic .sect2 .right ol li .tit{font-size: 2rem;}
    #ethic .sect3 .in2{flex-direction: column;}
    #ethic .sect3 .left{width: 100%;}
    #ethic .sect3 .left .tit{font-size: 3.5rem;}
    #ethic .sect3 .right{width: 100%; margin-top: 5rem;}

    #business .text_sect{padding: 15rem 0;}
    #business .text_sect .txt_grid .txt_wrap .tit{}
    #business .text_sect .txt_grid .txt_wrap .sub_tit{white-space: normal; padding: 0 1em; word-break: keep-all;}
    #business .text_sect .txt_grid .txt_wrap .sub_tit .copy{margin: 0 1em;}

    #business .bottom_txt{margin-top: 15rem;}
    #business .bottom_txt .tit{font-size: 4rem;}
    #business .bottom_txt .txt_flow p{font-size: 10rem;}

    #business .busi_cont_sect{min-height: auto; padding: 120px 0;}
    #business .busi_cont_sect .cont_txt_box .tit{font-size: 4rem;}
    #business .busi_cont_sect .cont_txt_box .sub_tit{font-size: 1.8rem;}
    #business .busi_cont_sect .cont_txt_box .desc{}

    #business .video_sect{height: auto;}
    #business .video_sect .video{transform: scale(1); padding-top: 56.25%;}

    #business .promo_box{width: 80%; margin: 0 auto;}
    #business .promo_box .promo_img{left: 0%; width: 50%;}
    #business .promo_box .promo_box_wrap .box{}
    #business .promo_box .promo_box_wrap .box + .box{margin-top: 25rem;}
    #business .promo_box .promo_box_wrap .box .txt_wrap{order: 2; width: calc(50% - 3.6rem); margin-left: 3.6rem;}
    #business .promo_box .promo_box_wrap .box .txt_wrap em{font-size: 4rem;}
    #business .promo_box .promo_box_wrap .box .txt_wrap em.small{font-size: 3.5rem;}
    #business .promo_box .promo_box_wrap .box .txt_wrap .tit{font-size: 2.1rem;}
    #business .promo_box .promo_box_wrap .box .txt_wrap .desc{white-space: normal; margin-top: 1.5em; font-size: 13px;}
    #business .promo_box .promo_box_wrap .box .txt_wrap .tag li{font-size: 11px;}
    #business .promo_box .promo_box_wrap .box .img_wrap{width: 50%; padding-top: calc(50%* 1.15);}
    #business .promo_box .promo_box_wrap .box .txt_wrap .tag{justify-content: flex-start;}
    #business .promo_box .promo_box_wrap .box .txt_wrap .tag li{margin-left: 0; margin-right: 10px;}
    #business .promo_box .promo_box_wrap .box.left{text-align: left;}
    #business .promo_box .promo_box_wrap .box.left .txt_wrap{margin-right: 0;}
    #business .promo_box .promo_box_wrap .box.right .txt_wrap{order: 2; margin-left: 3.6rem;}

    #business.busi1 .busi_cont_sect .flex_wrap{align-items: center;}
    #business.busi1 .busi_cont_sect .flex_wrap .right{}
    #business.busi1 .busi_cont_sect .flex_wrap .right img{}

    #business.busi2 .sect1{padding-top: 120px;}
    #business.busi2 .sect1 .right .list{column-gap: 30px;}
    #business.busi2 .sect1 .right .list .item{margin-bottom: 50px;}
    #business.busi2 .sect1 .right .list .item .tit{font-size: 18px;}
    #business.busi2 .sect1 .right .list .item .desc{}
    #business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em{font-size: 3.5rem;}
    #business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em p{justify-content: flex-start;}

    #business.busi3 .busi_cont_sect{margin-bottom: 15rem;}
    #business.busi3 .sect1{padding-top: 120px;}
    #business.busi3 .sect1 .txt_box .tit{font-size: 28px;}
    #business.busi3 .sect1 .txt_box .desc{}
    #business.busi3 .sect1 .cir_wrap .cir .cir_in .tit{font-size: 3rem;}
    #business.busi3 .sect1 .list_wrap{transform: translateY(0%); width: 100%; padding-top: calc(100% / 3 + 10px);}
    #business.busi3 .sect1 .list_wrap ul{margin-top: 6rem;}
    #business.busi3 .sect1 .list_wrap ul li{padding: 3rem 0;}
    #business.busi3 .sect1 .list_wrap ul li p{font-size: 3.5rem;}
    #business.busi3 .promo_tit p{font-size: 4rem;}
    #business.busi3 .promo_box .promo_box_wrap .box .txt_wrap .desc b{margin-bottom: 0; font-size: 2rem;}
    #business.busi3 .sect2 .tit{font-size: 4rem;}
    #business.busi3 .sect1 .list_wrap ul li span{font-size: 1.8rem;}
    #business.busi3 .sect2 .list{grid-template-columns: repeat(4, minmax(0, 1fr));}

    #business.busi4 .circles{margin-top: 60px;}
    #business.busi4 .circles .item{width: calc(100%/3 - 12px);}
    #business.busi4 .circles .item + .item{margin-left: 18px;}
    #business.busi4 .circles .item:first-child{transform: translateX(0%);}
    #business.busi4 .circles .item:nth-child(3){transform: translateX(0%);}
    #business.busi4 .bg_video{bottom: auto; top: 0;}

    #sheet .top .nice-select{font-size: 14px;}
    #sheet .top .txt_box{font-size: 13px;}
    #sheet .tbl_wrap{overflow-x: auto;}
    #sheet .tbl_wrap table th{padding: 0.8em 1.2em;}
    #sheet .tbl_wrap table td{padding: 0.8em 1.2em;}

    #press .pointer{display: none;}
    #press .press_list{gap: 3rem 3rem;}
    #press .press_list .item{border-radius: 16px;}
    #press .press_list .item .txt_wrap{padding: 2rem;}
    #press .press_list .item .top{margin-bottom: 20px;}
    #press .press_list .item .txt_box .tit{font-size: 2.1rem;}

    #location .map_wrap .map{/*padding-top: 56.25%;*/}
    #location .contact_list{margin-top: 30px;}
    #location .contact_list .item{padding-top: 16px;}
    #location .contact_list .item + .item{margin-left: 32px;}

    #contact .in2{display: block;}
    #contact .right{width: auto; margin-top: 9rem;}
    #contact .sect1 .radio_wrap{justify-content: flex-start; max-width: 600px;}
    #contact .sect1 .radio_wrap div{min-width: 275px;}

    .pagination{margin-top: 8rem;}

}

@media screen and (max-width: 769px){

    :root{
        --desc-size: 13px;
    }

    .input_wrap input[type="text"]{font-size: 13px;}
    .input_wrap textarea{font-size: 13px;}

    .sub_contents{padding-bottom: 10rem;}

    .cont_tit_wrap .tit{font-size: 3rem;}
    .cont_img_wrap{margin-top: 8rem;}

    .sub_top{padding-top: calc(var(--header-height)*0.35); padding-bottom: clamp(4rem, 9.8039vw + .4706rem, 8rem);}
    .sub_top .sub_navi_wrap .sub_navi{}
    .sub_top .sub_navi_wrap .sub_navi > div.home svg{font-size: 12px;}
    .sub_top .sub_navi_wrap .sub_navi > div span{font-size: 12px;}
    .sub_top .sub_navi_wrap .sub_navi > div:not(.nice-select) span{font-size: 12px;}
    .sub_top .sub_navi_wrap .sub_navi > .nice-select{font-size: 12px;}
    .sub_top .sub_page_tit h2{white-space: normal; font-size: clamp(3.6rem, 3.4314vw + 1.8353rem, 5.6rem);}

    .sub_top.history{height: 100svh;}
    .sub_top.history .sub_navi_wrap .sub_navi{padding-top: calc(var(--header-height)*0.5);}
    .sub_top.history .sub_top_bg.busi1 .img{background: url(/inc/img/main/business_img01.jpg) no-repeat center center / cover !important;}
    .sub_top.history .sub_top_bg.busi2 .img{background: url(/inc/img/main/business_img02.jpg) no-repeat center center / cover !important;}
    .sub_top.history .sub_top_bg.busi3 .img{background: url(/inc/img/main/business_img03.jpg) no-repeat center center / cover !important;}
    .sub_top.history .sub_top_bg.busi4 .img{background: url(/inc/img/main/business_img04.jpg) no-repeat center center / cover !important;}
	.sub_top.history .sub_top_bg.busi4 .img{background: url(/inc/img/main/business_img05.jpg) no-repeat center center / cover !important;}
    .sub_top.history .sub_page_tit{margin-top: calc(var(--header-height)/2);}
    .sub_top.history .sub_page_tit .sub_tit{margin-bottom: 1em; font-size: clamp(2rem, .8578vw + 1.5588rem, 2.5rem);}
    .sub_top.history .sub_page_tit h2{font-size: clamp(3rem, 6.0049vw + -.0882rem, 6.5rem);}
    .sub_top.history .sub_top_bg.busi4 + .in2 .sub_page_tit h2{font-size: clamp(2.7rem, 5.1471vw + .0529rem, 5.7rem);}
    .sub_top.history .sub_page_tit .sub_txt{padding: 0 1.25em; font-size: 13px;}

    #greeting .greeting_wrap .left{}
    #greeting .greeting_wrap .right{margin-left: 5rem;}
    #greeting .greeting_wrap .right .tit{font-size: clamp(2.5rem, 1.7157vw + 1.6176rem, 3.5rem);}
    #greeting .greeting_wrap .right .sub_tit{}
    #greeting .greeting_wrap .right .desc{}
    #greeting .greeting_wrap .right .nm span{}

    #contribute .contribute_list{grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 12px; margin-top: 7rem;}
    #contribute .contribute_list .txt_box .top{margin-bottom: 8px;}
    #contribute .contribute_list .txt_box .top .cat{padding: 0; background: none; font-size: 12px;}
    #contribute .contribute_list .txt_box .top .since{font-size: 12px;}
    #contribute .contribute_list .txt_box .top .since::before{font-size: 0.9em;}
    #contribute .contribute_list .txt_box .tit{font-size: 15px;}

    .board_view .board_li_wrap .box .tit_box .tit{font-size: 12px;}
    .board_view .top{padding-bottom: 1.5rem; border-width: 1px;}
    .board_view .top .label{margin-bottom: 2.4rem;}
    .board_view .top .label .cat{font-size: 12px;}
    .board_view .top .label .since{font-size: 12px;}
    .board_view .top .tit{font-size: 3rem;}
    .board_view .cont{padding: 4rem 2rem;}
    .board_view .attach_wrap{font-size: 11px;}
    .board_view .btn_wrap{}
    .board_view .btn_wrap a{font-size: 12px;}

    #history .history_cont{display: block; padding-top: 100px;}
    #history .history_cont .left{position: static;}
    #history .history_cont .left .txt{font-size: clamp(1.4rem, 1.4706vw + .8706rem, 2rem);}
    #history .history_cont .left .tit{font-size: clamp(2.4rem, 2.9412vw + 1.3412rem, 3.6rem);}
    #history .history_cont .left .tit br{display: none;}
    #history .history_cont .right{margin-left: 0px; margin-top: 40px;}
    #history .history_cont .right .history_box + .history_box{margin-top: 55px;}
    #history .history_cont .right .history_box .year{min-width: 3.25em; margin-right: 0.5em; font-size: 19px;}
    #history .history_cont .right .history_box .box{font-size: 13px;}
    #history .history_cont .right .history_box .box .txt{line-height: 1.6em;}
    #history .history_cont .right .history_box .box .txt + .txt{margin-top: 0.6em;}
    #history .history_cont .right .history_box .box .img{margin: 0.6em 0 1.5em;}
    #history .history_bar{display: none;}
    #history .history_bar .bar_wrap{padding: 8px 15px; border-radius: 8px;}
    #history .history_bar .bar_wrap .item{flex-direction: column; padding: 0.5em 0.75em; font-size: 13px; border-radius: 5px;}
    #history .history_bar .bar_wrap .item + .item{margin-left: 0.6em;}
    #history .history_bar .bar_wrap .item p{margin-top: 0.4em;}

    #ethic .sect1{padding-top: 80px;}
    #ethic .sect1 .top .tit{font-size: 30px;}
    #ethic .sect1 .bottom .card_list{margin-top: 30px;}
    #ethic .sect1 .bottom .card_list ul{grid-template-columns: minmax(0, 1fr); gap: 1.6rem 0; max-width: 480px; margin: 0 auto;}
    #ethic .sect1 .bottom .card_list ul li{transform: translateY(10%); padding: clamp(3rem, 7.3529vw + .3529rem, 6rem) 0;}
    #ethic .sect1 .bottom .card_list ul li .ico{height: clamp(9rem, 9.8039vw + 5.4706rem, 13rem);}
    #ethic .sect1 .bottom .card_list ul li .txt_box{padding: 0 2.5rem; margin-top: 30px;}
    #ethic .sect1 .bottom .card_list ul li .txt_box p{font-size: 2.5rem;}
    #ethic .sect1 .bottom .card_list ul li .txt_box span{font-size: 12px;}
    #ethic .sect2{padding: 50px 0; margin: 50px 0;}
    #ethic .sect2 .left{margin-right: 0;}
    #ethic .sect2 .left .tit{font-size: 25px;}
    #ethic .sect2 .right ol li .num{margin-bottom: 0.6em;}
    #ethic .sect2 .right ol li .tit{font-size: 18px;}
    #ethic .sect3 .left .tit{font-size: 25px;}
    #ethic .sect3 .left dl{padding: 2rem 2.5rem; font-size: 12px;}
    #ethic .sect3 .right .input_wrap .tit{font-size: 13px;}
    #ethic .sect3 .right .input_wrap .desc{font-size: 12px;}
    #ethic .sect3 .right .btn{color: #000; font-size: 12px;}

    #business .text_sect{height: 50svh;}
    #business .text_sect .txt_grid .txt_wrap .tit{font-size: clamp(4rem, 4.1176vw + 1.8824rem, 6.4rem);}
    #business .text_sect .txt_grid .txt_wrap .sub_tit{font-size: clamp(1.6rem, 2.9412vw + .5412rem, 2.8rem);}
    #business .bottom_txt{margin-top: 120px;}
    #business .bottom_txt .tit{font-size: 2.5rem;}
    #business .bottom_txt .txt_flow p{font-size: 6rem;}
    #business .bottom_txt .btn_wrap a{margin-top: 2em; font-size: 12px;}

    #business .busi_cont_sect{padding: 80px 0;}
    #business .busi_cont_sect::before{transform: translate(50%, 40%); width: 150%; padding-top: 150%;}
    #business .busi_cont_sect .cont_txt_box em{font-size: 13px;}
    #business .busi_cont_sect .cont_txt_box .tit{line-height: 1.5em;}
    #business .busi_cont_sect .cont_txt_box .sub_tit{margin-bottom: 0.6em; font-size: 16px;}
    #business .busi_cont_sect .cont_txt_box .desc{}
    #business .busi_cont_sect .cont_txt_box .img{margin-top: 30px;}

    #business .promo_box{padding-top: 100px;}
    #business .promo_box .promo_img{display: none;}
    #business .promo_box .promo_box_wrap .box{align-items: flex-start;}
    #business .promo_box .promo_box_wrap .box + .box{margin-top: 60px;}
    #business .promo_box .promo_box_wrap .box .txt_wrap{width: calc(60% - 3.6rem);}
    #business .promo_box .promo_box_wrap .box .txt_wrap em{font-size: 27px;}
    #business .promo_box .promo_box_wrap .box .txt_wrap em.small{font-size: 27px;}
    #business .promo_box .promo_box_wrap .box .txt_wrap .tit{font-size: 2rem;}
    #business .promo_box .promo_box_wrap .box .txt_wrap .desc{margin-top: 1em; margin-bottom: 1.5em; font-size: 12px; word-break: break-all;}
    #business .promo_box .promo_box_wrap .box .txt_wrap .desc br{display: none;}
    #business .promo_box .promo_box_wrap .box .txt_wrap .tag li{margin-bottom: 8px; margin-right: 6px; font-size: 10px;}
    #business .promo_box .promo_box_wrap .box .img_wrap{padding-top: 0;}
    #business .promo_box .promo_box_wrap .box .img_wrap img{display: block;}

    #business.busi1 .busi_cont_sect .flex_wrap{flex-direction: column;}
    #business.busi1 .busi_cont_sect .flex_wrap .left{width: 100%;}
    #business.busi1 .busi_cont_sect .flex_wrap .right{justify-content: center; width: 60%; margin-left: 0; margin-top: 30px;}

    #business.busi2 .sect1{padding-top: 100px;}
    #business.busi2 .sect1 .in2{flex-direction: column;}
    #business.busi2 .sect1 .left{font-size: clamp(2.4rem, 4.4118vw + .8118rem, 4.2rem);}
    #business.busi2 .sect1 .left br{display: none;}
    #business.busi2 .sect1 .right{width: auto; margin-top: 30px;}
    #business.busi2 .sect1 .right .list{column-gap: 16px;}
    #business.busi2 .sect1 .right .list .item{opacity: 1; transform: translateY(0%); margin-bottom: 30px;}
    #business.busi2 .sect1 .right .list .item .tit{font-size: 15px;}
    #business.busi2 .sect1 .right .list .item .tit br{display: none;}
    #business.busi2 .sect1 .right .list .item .desc{}
    #business.busi2 .sect1 .right .list .item .desc br{display: none;}
    #business.busi2 .promo_box .promo_box_wrap .box .txt_wrap em{font-size: 27px;}

    #business.busi3 .sect1{padding-top: 100px;}
    #business.busi3 .sect1 .txt_box .tit{font-size: 4rem;}
    #business.busi3 .sect1 .txt_box .desc{}
    #business.busi3 .sect1 .cir_wrap .cir .cir_in .tit{font-size: 18px;}
    #business.busi3 .sect1 .list_wrap ul li p{font-size: 18px;}
    #business.busi3 .sect1 .list_wrap ul li span{font-size: 12px;}
    #business.busi3 .sect2{padding-top: 100px;}
    #business.busi3 .sect2 .list{grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 30px;}
    #business.busi3 .promo_tit p{}
    #business.busi3 .promo_box .promo_box_wrap .box .txt_wrap .desc{margin-top: 1.75em;}
    #business.busi3 .promo_box .promo_box_wrap .box .txt_wrap .desc b ~ b{margin-top: 0.5em;}

    #business.busi4 .circles .circles_in{flex-wrap: wrap;}
    #business.busi4 .circles .item{width: 50%; padding-top: 50%;}
    #business.busi4 .circles .item + .item{margin-left: -2rem;}
    #business.busi4 .circles .item:last-child{margin-left: 0; margin-top: -6rem;}
    #business.busi4 .circles .item .box p{font-size: 2rem;}

    #sheet .top{align-items: flex-end; margin-bottom: 25px;}
    #sheet .top .txt_box{font-size: 10px;}
    #sheet .top .nice-select{width: 8em; height: 3em; line-height: 3em; font-size: 12px;}
    #sheet .tbl_wrap{width: calc(100% + 2rem);}
    #sheet .tbl_wrap table{min-width: calc(768px - 4rem);}
    #sheet .tbl_wrap table th{padding: 0.6em 1em;}
    #sheet .tbl_wrap table td{padding: 0.6em 1em;}

    #press .press_list{grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 12px;}
    #press .press_list .item{border-radius: 8px;}
    #press .press_list .item .txt_wrap{}
    #press .press_list .item .top{margin-bottom: 12px;}
    #press .press_list .item .top .cat{}
    #press .press_list .item .top .date{}
    #press .press_list .item .txt_box .tit{height: 3.2em; margin-bottom: 0.6em; font-size: 15px; line-height: 1.6em;}
    #press .press_list .item .txt_box .txt{-webkit-line-clamp: 2; height: 3.5em;}

    #dart .dart_list .list_head{display: none;}
    #dart .dart_list .list_head .nm{width: 100px;}
    #dart .dart_list .list_head .date{width: 100px;}
    #dart .dart_list .list_body{border-top: 1px solid #000;}
    #dart .dart_list .list_body a{flex-wrap: wrap; padding: 15px 0;}
    #dart .dart_list .list_body a .tit{white-space: normal; width: 100%; padding: 0 1.5rem; margin-bottom: 0.5em; font-size: 16px; }
    #dart .dart_list .list_body a .nm{overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: auto; padding: 0; margin: 0 2.5rem 0 1.5rem; font-size: 12px;}
    #dart .dart_list .list_body a .date{width: auto;  padding: 0; margin: 0 2.5rem 0 1.5rem;   font-size: 11px;}

    #location .map_wrap .map_top{flex-direction: column; align-items: flex-start;}
    #location .map_wrap .map_top .left svg{}
    #location .map_wrap .map_top .left p{}
    #location .map_wrap .map_top .right{margin-top: 20px; margin-left: 0;}
    #location .map_wrap .map_top .right a{font-size: 11px;}
    #location .map_wrap .map_top .right img{max-height: 55%; margin-right: 8px;}
    #location .map_wrap .map{/*padding-top: 75%;*/}
    #location .contact_list{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 10px;}
    #location .contact_list .item{border-radius: 8px;}
    #location .contact_list .item:last-child{grid-column: span 2;}
    #location .contact_list .item + .item{margin-left: 0;}
    #location .contact_list .item span{font-size: 12px;}
    #location .contact_list .item p{margin-top: 0.4em; font-size: 16px;}
    #location .contact_list .item.email p{font-size: 15px;}

    #contact .left .sub_tit{margin-bottom: 0.4em;}
    #contact .left .tit{font-size: 3rem;}
    #contact .left .tit br{display: none;}
    #contact .right{margin-top: 40px;}
    #contact .right div[class^='sect'] + div{margin-top: clamp(3rem, 8.5784vw + -.0882rem, 6.5rem);}
    #contact .right .sect_tit{margin-bottom: 1em; font-size: 2.1rem;}
    #contact .sect1 .radio_wrap div{min-width: auto;}
    #contact .sect1 .radio_wrap div + div{margin-left: 10px;}
    #contact .sect1 .radio_wrap input + label{font-size: 14px;}
    #contact .sect1 .radio_wrap input + label span{white-space: nowrap; font-size: 0.8em;}
    #contact .sect2 .radio_wrap div + div{margin-left: 10px;}
    #contact .sect2 .radio_wrap input + label{padding: 0.8em 1.2em; font-size: 12px;}
    #contact .sect3 .item + .item{margin-top: 24px;}
    #contact .sect3 .input_wrap .tit{margin-bottom: 0.6em; font-size: 13px;}
    #contact .sect3 .email_wrap{flex-wrap: wrap;}
    #contact .sect3 .email_wrap .inp{width: 100%; margin-right: 0; margin-bottom: 10px;}
    #contact .sect3 .email_wrap .inp span{font-size: 13px;}
    #contact .sect3 .email_wrap .nice-select{font-size: 13px;}
    #contact .sect3 .cap_wrap{}
    #contact .sect3 .agree_chk input + label{font-size: 13px;}
    #contact .sect3 .agree_txt{padding: 16px;}
    #contact .sect3 .agree_txt p{font-size: 11px;}
    #contact .btn_wrap button{padding: 0 4em; font-size: 11px;}

    .pagination{font-size: 12px;}
    .pagination > a{width: 1.5em; background: none; fill: #bbb;}
    .pagination .num_list li + li{margin-left: 0.65em;}

}

@media screen and (max-width: 481px){

    #greeting .greeting_wrap{flex-direction: column;}
    #greeting .greeting_wrap .left{width: 50%; margin: 0 auto;}
    #greeting .greeting_wrap .right{margin-left: 0; margin-top: 6rem;}

    #contribute .contribute_list .txt_box .top .cat{font-size: 10px;}
    #contribute .contribute_list .txt_box .top .since{font-size: 10px;}

    #history .history_cont .right .history_box .box .img{}

    #ethic .sect1 .top .desc br{display: none;}
    #ethic .sect2 .left .desc br{display: none;}
    #ethic .sect2 .right ol{grid-template-columns: minmax(0, 1fr);}
    #ethic .sect2 .right ol li ul li br{display: none;}

    #business .promo_box{width: 100%;}
    #business.busi1 .busi_cont_sect .cont_txt_box .desc br{display: none;}
    #business.busi1 .busi_cont_sect .flex_wrap .right{width: 90%;}

    #contact .sect1 .radio_wrap{flex-direction: column;}
    #contact .sect1 .radio_wrap div + div{margin-left: 0; margin-top: 10px;}

}


/* ====== 오시는 길 : 카카오 퍼가기 반응형 풀사이즈 ====== */
#location .map_wrap .map{
  position: relative;
  /* 16:9 비율 (원하면 56.25% → 50%/60% 등으로 조정) */
  padding-top: 56.25%;
}

/* 카카오 퍼가기 루트 박스를 절대배치로 덮어씌움 */
#location .map_wrap .map .root_daum_roughmap{
  position: absolute !important;
  top: 0; left: 0;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

/* 내부 래퍼들도 100% 높이로 강제 */
#location .map_wrap .map .root_daum_roughmap .map_border,
#location .map_wrap .map .root_daum_roughmap .wrap_map{
  
height: 100% !important;
}

/* 모바일에서 조금 더 세로를 키우고 싶으면 */
@media (max-width: 769px){
  #location .map_wrap .map{ padding-top: 75%; } /* 4:3 느낌 */
}

/* 혹시 다른 곳에서 iframe 규칙이 충돌할 대비 */
#location .map_wrap iframe{
  position: absolute; top:0; left:0; width:100%; height:100%;
}



.download-btn-wrap {
  display: flex;
  justify-content: center;   /* 버튼 센터 정렬 */
  margin: 60px 0;            /* 상하 여백 */
  padding: 0 20px;           /* 모바일 좌우 안전 여백 */
}

.download-btn {
  display: inline-flex;
  align-items: center;
  height: 4em;
  padding: 0 1.75em;
  border: 1px solid #000;
  font-size: 1.4rem;
  font-weight: 500;
  border-radius: 2em;
  transition: background 0.25s, color 0.25s;
}
.download-btn svg { margin-left: 1.5em; transition: fill 0.25s; }
.download-btn:hover { background:#000; color:#fff; }

.download-btn svg {
  margin-left: 1em;
  transition: fill 0.25s;
}

/* Hover 효과 */
.download-btn:hover {
  background: #000;
  color: #fff;
}

/* ===== 반응형 ===== */
@media (max-width: 768px) {
  .download-btn {
    width: 100%;       /* 모바일에서는 가로 100% */
    font-size: 1.2rem; /* 글자 크기 줄임 */
    padding: 1em;      /* 터치 영역 확대 */
  }
}

.link-btn-wrap {
  display: flex;
  justify-content: center;
  gap: 16px; /* 버튼 사이 간격 */
  margin: 40px 0;
  flex-wrap: wrap; /* 모바일 대응 */
}

.link-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 4em;
  padding: 0 2em;
  border: 1px solid #000;
  font-size: 1.4rem;
  font-weight: 500;
  border-radius: 2em;
  background: #fff;
  color: #000;
  text-decoration: none;
  transition: background 0.25s, color 0.25s;
}

.link-btn svg {
  margin-left: 1em;
  transition: fill 0.25s;
}

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