@charset "utf-8";

/* reset */
html {
    font-size: 18px
}

body {
    font-family: 'Poppins', Pretendard, sans-serif;
    word-break: keep-all;
    word-wrap: break-word;
    color: #111;
    letter-spacing: -0.04em;
}

a, button, input, textarea {
    transition: border-color .4s, background .4s, color .4s, opacity .4s, transform .4s
}

a {
    text-decoration: none !important;
    color: inherit
}

a:hover, a:focus, a:active {
    color: inherit
}

body, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, table, th, td, form, fieldset, legend, input, textarea, button, select, label {
    margin: 0;
    padding: 0
}

li {
    list-style: none
}

address, i {
    margin: 0;
    font-style: normal
}

label, button, [role=button] {
    cursor: pointer
}

table {
    width: 100%
}

img, video, iframe {
    max-width: 100%
}

hr {
    border-top-color: #e5e5e5
}

/* 상세 이미지 높이 */
.product-detail img, .board-detail img {
    height: auto !important
}

/* Icon */
[class^=icon-] {
    display: inline-block;
    overflow: hidden;
    margin: 0;
    padding: 0;
    border: 0;
    background-color: transparent;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: 100% auto;
    font-size: 0;
    line-height: 0;
    text-decoration: none;
    vertical-align: middle;
    text-indent: -1000em
}

.icon-arr-wh {
    width: 42px;
    height: 42px;
    background-image: url(../img/icon-arr-wh.svg)
}

.icon-arr {
    width: 26px;
    height: 26px;
    background-image: url(../img/icon-arr.svg)
}

.icon-arr.left {
    transform: rotate(180deg);
}

.icon-arr-down {
    width: 60px;
    height: 60px;
    background-image: url(../img/icon-arr-down.svg)
}

.icon-download {
    width: 26px;
    height: 26px;
    background-image: url(../img/icon-download.png)
}

.icon-search {
    width: 24px;
    height: 24px;
    background-image: url(../img/icon-search.svg)
}

.icon-arr-page {
    width: 42px;
    height: 42px;
}

.icon-arr-page.left {
    background-image: url(../img/icon-arr-page-left.svg)
}

.icon-arr-page.right {
    background-image: url(../img/icon-arr-page-right.svg)
}

.icon-talk {
    width: 60px;
    height: 60px;
    background-image: url(../img/icon-talk.png); /*임시*/
    visibility: hidden;
}

.icon-share {
    width: 28px;
    height: 28px;
    background-image: url(../img/icon-share.svg)
}

.icon-ask {
    width: 28px;
    height: 28px;
    background-image: url(../img/icon-ask.svg)
}

.icon-cs {
    width: 28px;
    height: 28px;
    background-image: url(../img/icon-cs.svg)
}

.icon-chat {
    width: 28px;
    height: 28px;
    background-image: url(../img/icon-chat.svg)
}

.icon-call {
    width: 28px;
    height: 28px;
    background-image: url(../img/icon-call.png)
}

.icon-expand {
    transition: 0.3s;
    line-height: 42px;
    border-radius: 21px;
    font-weight: 500;
}

.icon-expand:hover {
    width: 94px;
    background-position: right center;
    background-size: auto 100%;
    background-color: #fff;
    font-size: 16px;
    text-indent: 16px;
}

.icon-dropdown {
    width: 20px;
    height: 20px;
    background-image: url(../img/icon-dropdown.svg);
    background-color: #fff;
    border-radius: 50%;
    filter: invert(1);
}

[class^=icon-file] {
    width: 44px;
    height: 44px;
    background-image: url("../img/icon-file.svg")
}

*:not(i).dot::before,
i.dot {
    display: inline-block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    border-radius: 3px;
    background-color: #111;
    margin-right: 0.3rem;
}

*:not(i).dot {
    padding-left: calc(0.5rem + 3px);
    position: relative;
}

*:not(i).dot::before {
    content: "";
    position: absolute;
    top: calc(0.5em + 2px);
    left: 0;;
}

/* helper classs */
.d-flex-space {
    display: flex;
    align-items: center;
    justify-content: space-between
}

/* grid */
[class^=container] {
    position: relative;
}

.container {
    max-width: 1230px
}

.container-lg {
    max-width: 1440px;
    padding-left: 20px;
    padding-right: 20px;
}

.container-xl {
    max-width: 1680px
}

/* typo */
.font-Poppins {
    font-family: 'Poppins', sans-serif;
}

.font-Pretendard {
    font-family: 'Pretendard', sans-serif;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}

.display-1, .display-2, .display-3 {
    font-weight: 700;
    line-height: 1.1; /*letter-spacing:0; 영문일 때 */
}

/* 70 52 44 */
.display-1 {
    font-size: 3.889rem !important
}

.display-2 {
    font-size: 3rem !important
}

.display-3 {
    font-size: 2.2222rem !important
}

h3.display-3 {
    line-height: 1.36;
}

.h-para {
    line-height: 1.5 !important;
}

/* 32 28 26 22 20 18 */
h1, .h1 {
    font-size: 1.778rem
}

h2, .h2 {
    font-size: 1.556rem
}

h3, .h3 {
    font-size: 1.444rem
}

h4, .h4 {
    font-size: 1.222rem
}

h5, .h5 {
    font-size: 1.111rem
}

h6, .h6 {
    font-size: 1rem;
    letter-spacing: 0;
    font-weight: 700
}

.txt-line {
    display: -webkit-box;
    overflow: hidden;
    max-height: 3em;
    line-height: 1.5;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    word-break: break-all;
    white-space: normal
}

.caption1 {
    font-size: 0.888rem;
}

.caption2 {
    font-size: 0.833rem;
    color: #999
}

.para {
    line-height: 1.75;
}

h3.display-3 + p {
    line-height: 1.75;
}

/* theme */
.text-dark {
    color: #4D4D4D !important
}

.text-gray {
    color: #666
}

.text-light {
    color: #999 !important
}

.text-primary {
    color: #002EAB !important
}

.text-red {
    color: #F83D5C !important
}

.strong {
    font-weight: 700;
}

.fw600 {
    font-weight: 600 !important;
}

.fw500 {
    font-weight: 500 !important;
}

.fw400 {
    font-weight: 400 !important;
}

.bg-primary {
    background-color: #002EAB !important;
    color: #fff !important;
}

.bg-light {
    background-color: #F9F9F9 !important;
}

.bg-gray {
    background-color: #E5E5E5 !important;
}

.bg-black {
    background-color: #111 !important;
    color: #fff !important;
}

/* list */
[class*=lst-type-] > li {
    position: relative;
    padding-left: .8em;
}

[class*=lst-type-] > li:before {
    position: absolute;
    left: 0
}

.lst-type-dot > li:before {
    content: '·';
    font-weight: 900;
}

.dl {
    margin: 1.5em 0
}

.dl dd + dt {
    margin-top: 1em
}

.list-dash li {
    position: relative;
    display: flex;
}

.list-dash li::before {
    content: "-";
    display: inline-block;
    margin-right: 0.5em
}

.list-group-flush {
    border-top: 1px solid #e5e5e5
}

.list-group-flush .list-group-item {
    position: relative;
    padding: 1.5rem 0;
    border-bottom: 1px solid #e5e5e5 !important;
    background: none
}

.no-data {
    padding: 2em;
    font-size: 1.1em !important;
    text-align: center;
    justify-content: center;
}

.no-data:before {
    content: '';
    display: block;
    height: 106px;
    margin-bottom: 20px;
    background: url("../img/no-data2.png") no-repeat 50% 0 / auto 100%; /*animation:no-data 3s both infinite*/
}

@keyframes no-data {
    0%, 100% {
    }
}

/* box */
.bx-rounded {
    padding: 30px;
    border-radius: 3em;
    background: #fff;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .03);
}

/* button */
.no-style {
    border: 0;
    background: none
}

.btn {
    padding: .75em 2em;
    border: 2px solid;
    border-radius: 0;
    background: none;
    font-weight: 500;
    color: inherit !important
}

.btn:hover, .btn:focus, .btn:active {
}

.btn-wh {
    color: #fff !important
}

.btn-secondary {
}

.btn-dark {
    background-color: #111;
    border-color: #111;
    color: #fff !important
}

.btn-green {
    background-color: #48af51 ;
    border-color: #48af51 ;
    color: #fff !important
}
.btn-f{
    position: relative;
    top: 34px;
}
[class*=btn-outline-] {
    background: none !important
}

.btn-icon {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    padding: .75em 1.1em;
}

.btn-icon-only {
    padding: .75em !important;
}

.btn-circle {
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #e5e5e5
}

a:hover .btn-circle {
    background-color: #111;
    color: #fff;
}

.btn-xs {
    padding: .2em .7em;
    font-size: .8em
}

.btn-sm {
    padding: .45em 1.5em;
    font-size: .889em;
    min-width: 6em
}

.btn-lg {
    padding: .95em 2.7em
}

.btn-wide {
    width: 100%;
}


/* form */
input, button, select {
    outline: 0 !important;
    box-shadow: none !important;
}

input:active, button:active, select:active,
input:focus, button:focus, select:focus {
    border-color: #ccc !important;
}

.form-control, .custom-select {
    border-radius: 0;
    border-color: #ccc;
    height: calc(2em + 0.75rem + 2px);
}

select.form-control {
    padding-right: 1rem;
}

input::placeholder {
    color: #ccc !important
}

.custom-select {
    background: #fff url(../img/icon-dropdown.svg) no-repeat right 0.5rem center/24px 24px;
    cursor: pointer;
}

/* table */
.table-fixed {
    table-layout: fixed
}

.table {
    border-top: 1px solid #ccc;
    color: inherit
}

.table tr > * {
    text-align: center;
    border-top: 0;
    border-bottom: 1px solid #E5E5E5;
    padding: 1.2em .889rem;
    max-width: 0
}

.table thead th {
    font-size: .889em;
    border-bottom: 1px solid #E5E5E5
}

.table .thead-light th {
    background: #f9f9f9
}

.table-sm tr > * {
    font-size: .889rem
}

tfoot > tr > * {
    border: 0 !important
}

.table-responsive thead th {
    white-space: nowrap
}

.table-horizontal tr > * {
    text-align: left;
    padding: 1em 1.333em
}

.table-horizontal tbody th {
    background: #f9f9f9;
    text-align: center
}

.tb tr > * {
    padding: 10px 10px 10px 0
}

.tb td {
    width: 100%
}

/* Alert */
.alert {
    margin: 2em 0;
    padding: 1em;
    border: 4px dashed #eee;
    border-radius: 30px
}

.info-text {
    font-size: 0.83333rem;
}

.tooltip-text {
    display: inline-block;
    position: relative;
    font-size: 0.8888rem;
    box-shadow: 0px 5px 15px #00000026;
    line-height: 1;
    padding: 6px 19px 6px 14px;
    margin-right: 1rem;
    background: url(../img/bg-tooltip.png) no-repeat 0 0 / 100% 100%
}

/* Badge */
.badge {
    display: inline-block;
    vertical-align: middle;
    background: #F5F5F5;
    border-radius: 2rem;
    font-weight: 400;
    color: #999;
    vertical-align: middle;
    font-size: 1rem;
    padding: .666em .8em
}

.badge.active,
.badge:hover {
    background-color: #111;
    color: #fff
}

.badge-sm {
}

.badge-circle {
    width: 2.5em;
    height: 2.5em;
    padding: 0;
    border-radius: 50%;
    text-align: center;
    line-height: 2.5
}

.tag-wrap .badge {
    margin-bottom: 0.5em;
}

/* Pagination */
.pagination {
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}

.page-link {
    display: inline-block;
    border: 0;
    color: #ccc;
    font-family: 'Poppins';
    font-weight: 600;
}

.page-link:hover {
    background: none;
    color: #111;
}

.page-link:hover,
.page-link:active,
.page-link:focus {
    box-shadow: none;
}

.page-link.active {
    color: #111;
}

/* progress */
.progress, .progress > div {
    height: .555rem;
    border-radius: 0.555em;
}

.progress-primary {
    background: #00a468;
}

/* navs */
[class^=nav-] a {
    font-size: 1.1rem;
    color: #999;
}

[class^=nav-] a:hover {
    color: #111;
}

.nav-pills .nav-item a {
    font-weight: 500;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: inherit
}

.nav-tabs {
    margin-bottom: 60px;
    border: 0
}

.nav-tabs a {
    padding: 0;
    border: 0 !important;
    font-size: 1.1rem;
    margin-right: 2.2rem;
}

.nav-tabs a.active {
    font-weight: 700;
}

.nav-cate {
    display: flex;
    justify-content: center;
    margin: 0 -.8333rem 4rem;
}

.nav-cate li {
    width: 100%;
    padding: 0 10px
}

.nav-cate a {
    display: block;
    font-weight: 500;
    text-align: center;
    color: #666
}

.nav-cate div {
    display: inline-block;
    position: relative
}

.nav-cate div:before {
    content: '';
    position: absolute;
    top: -15%;
    left: 0;
    width: 100%;
    height: 130%;
    border-radius: 9em;
    transform: scale(0);
    transition: .2s
}

.nav-cate i {
    position: relative;
    transition: .2s
}

.nav-cate span {
    display: block;
    margin-top: 1em
}

.nav-cate .active a, .nav-cate a:hover {
    color: #00a468
}

.nav-cate .active i, .nav-cate a:hover i {
    filter: brightness(9)
}

.nav-cate .active div:before, .nav-cate a:hover div:before {
    background: #00a468;
    transform: scale(1) rotate(-45deg)
}

.nav-brand {
    overflow: hidden;
    overflow-x: auto;
    position: relative;
    margin: 0 0 80px;
    text-align: center;
    white-space: nowrap
}

.nav-brand li {
    display: inline-block;
    padding: 0 .5em;
    font-weight: 500;
    color: #666
}

.nav-brand img {
    display: block;
    height: 50px;
    margin: 0 auto
}

.nav-brand span {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0
}

/* lnb */
.brand-lnb-wrap {
    position: relative;
    z-index: 30;
    margin: -40px 0 0;
    font-size: 1.222rem;
    font-weight: 500;
}

.brand-lnb {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden;
    border-radius: 20px;
    box-shadow: 0 5px 30px 0 rgba(0, 0, 0, 0.08);
    background: #fff;
    text-align: center
}

.brand-lnb li {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    position: relative;
    max-width: 100%;
}

.brand-lnb li a {
    display: block;
    padding: 23px 0 21px;
    border-bottom: 3px solid transparent;
    font-weight: 600
}

.brand-lnb li + li::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 30%;
    background: rgba(0, 0, 0, 0.08);
    transition: all .4s
}

.brand-lnb .active a {
    border-color: #004738;
    color: #004738
}

/* toggle */
.dropdown-toggle {
    padding-left: 1em;
    padding-right: 1em;
    text-align: left
}

.dropdown-toggle::after {
    float: right;
    margin: .55em 0 0 2em;
}

.dropdown-toggle[aria-expanded="true"]::after {
    transform: scale(1, -1)
}

.dropdown-toggle[aria-expanded="true"] {
    border-bottom-color: transparent !important;
    border-radius: 1.4375em 1.4375em 0 0
}

.dropdown-menu {
    width: 100%;
    min-width: 100%;
    margin: -2px 0 0;
    padding: 0 0 .5em;
    border-color: #e5e5e5;
    border-top-color: transparent;
    border-radius: 0 0 1.4375em 1.4375em;
    box-shadow: none;
    white-space: nowrap
}

.dropdown-menu > li > a {
    display: block;
    margin: 0 -1px;
    padding: .25em 1em;
}

.dropdown-menu > .active > a {
    font-weight: 500;
    color: #00a468
}

.dropup .dropdown-toggle[aria-expanded="true"] {
    border-bottom-color: #e5e5e5 !important;
    border-top-color: transparent !important;
    border-radius: 0 0 1.4375em 1.4375em
}

.dropup .dropdown-menu {
    width: 100%;
    margin: 0 0 -2px;
    padding: .5em 0 0;
    border-color: #e5e5e5;
    border-bottom-color: transparent;
    border-radius: 1.4375em 1.4375em 0 0
}

/* Modal */
.close {
    position: absolute;
    top: 0;
    right: 0;
    padding: .7em !important;
    opacity: 1;
    z-index: 10
}

button.close-blk {
    background: #000;
    border-radius: 50%;
    color: #fff;
    padding: 0 !important;
    width: 1.852em;
    height: 1.852em;
    display: flex;
    align-items: center;
    justify-content: center;
    top: -.37em;
    right: -.37em
}

.close.close-blk:hover {
    color: #fff;
    opacity: 1 !important;
}

.modal-dialog {
    max-width: 560px;
    width: calc(100% - 1rem)
}

.modal-dialog.modal-md {
    max-width: 400px
}

.modal-dialog.modal-lg {
    max-width: 800px
}

.modal-content {
    border-radius: 0;
    padding: 2.222em
}

.modal-body {
    padding: 0
}

.modal-header {
    padding: 0 0 .778rem;
    margin-bottom: 1.111rem;
    border-bottom: 2px solid
}

.modal-title {
    font-size: 1.333rem
}

.modal-bottom {
    width: 100%;
    max-width: 250px;
    margin: 2.222em auto 0;
    text-align: center
}

.modal-bottom.wide {
    max-width: 320px
}

.modal-bottom.wide .btn {
    min-width: 8.333rem;
}

.alert-text {
    letter-spacing: -.05em;
    line-height: 1.6;
    font-size: 1.111rem;
    text-align: center;
    font-weight: 700
}

.alert-title {
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 700;
    margin-bottom: 1rem
}

/* alert */
.modal-alert .modal-header {
    justify-content: center
}

.modal-alert-cnt h4 {
    margin: 1em 0;
}

.modal-alert-ft {
    display: flex;
    overflow: hidden;
    margin: 2.222em -2.222em -2.222em;
    border-radius: 0
}

.modal-alert-ft .btn {
    width: 100%;
    border-radius: 0;
    font-size: 1.111rem
}

/* share */
.share-link {
    margin: 1em 0 2em;
    text-align: center
}

.share-input button {
    padding: 0 1em;
    background: #F5F5F5;
    font-size: 1.1em
}

[class^=icon-share-] {
    width: 64px;
    height: 64px;
    margin: 0 .25rem;
    background-image: url(../img/icon-share-kakao.svg);
    border-radius: 50%;
    background-size: 50%;
    background-color: #ffea00;
}

.icon-share-fb {
    background-image: url(../img/icon-share-fb.svg);
    background-color: #315096;
}

.icon-share-tw {
    background-image: url(../img/icon-share-tw.svg);
    background-color: #31a6df;
}

.icon-share-blog {
    background-image: url(../img/icon-share-blog.svg);
    background-color: #00c73c;
}

/* Slide */
.swiper-button-next, .swiper-button-prev {
    background-color: transparent;
    border: 0
}

.swiper-button-next {
    right: 4em
}

.swiper-button-prev {
    left: 4em
}

.swiper-button-white {
    filter: contrast(0) brightness(10)
}

/* Animate */
.ani-stop {
    visibility: hidden;
    animation-name: none !important
}

.ani-delay01 {
    animation-delay: .15s
}

.ani-delay015 {
    animation-delay: .15s
}

.ani-delay025 {
    animation-delay: .25s
}

.ani-delay02 {
    animation-delay: .2s !important
}

.ani-delay03 {
    animation-delay: .3s !important
}

.ani-delay04 {
    animation-delay: .4s !important
}

.ani-delay05 {
    animation-delay: .5s !important
}

.ani-delay06 {
    animation-delay: .6s !important
}

.ani-delay07 {
    animation-delay: .7s !important
}

.ani-delay075 {
    animation-delay: .75s !important
}

.ani-delay08 {
    animation-delay: .8s !important
}

.ani-delay09 {
    animation-delay: .9s !important
}

.ani-delay10 {
    animation-delay: 1s !important
}

.ani-delay11 {
    animation-delay: 1.1s !important
}

.ani-delay12 {
    animation-delay: 1.2s !important
}

.ani-delay125 {
    animation-delay: 1.25s !important
}

.ani-delay13 {
    animation-delay: 1.3s !important
}

.ani-delay14 {
    animation-delay: 1.4s !important
}

.ani-delay15 {
    animation-delay: 1.5s !important
}

.ani-delay175 {
    animation-delay: 1.75s !important
}

.ani-delay20 {
    animation-delay: 2s !important
}

.ani-delay30 {
    animation-delay: 3s !important
}

.ani-delay40 {
    animation-delay: 4s !important
}

.ani-duration03 {
    animation-duration: .3s !important
}

.ani-duration04 {
    animation-duration: .4s !important
}

.ani-duration05 {
    animation-duration: .5s !important
}

.ani-duration {
    animation-duration: 1s !important
}

.ani-duration15 {
    animation-duration: 1.5s !important
}

.ani-duration2 {
    animation-duration: 2s !important
}

.ani-duration3 {
    animation-duration: 3s !important
}

.ani- {
    animation: 1s .2s both ani-;
    transform-origin: bottom
}

/* 모바일: 기존 400px(또는 화면 폭 맞춤) 유지 */
.popup .modal-dialog {
    max-width: 400px;
}
/* PC 화면에서만 크기 확대 (예: 500px ~ 550px 권장) */
@media (min-width: 768px) {
    .popup .modal-dialog {
        max-width: 520px; /* 또는 500px ~ 600px 원하는 크기 */
    }
}

.popup .modal-content {
    padding: 0;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

.popup-ft {
    position: relative;
    z-index: 1;
    padding: 12px 16px;
    background: #F6F4F2;
    box-shadow: 0 -4px 4px rgba(0, 0, 0, 0.05);
}

.popup-ft button {
    border: 0;
    background: none;
    font-size: 15px;
}

.popup-ft .popup-btn {
    float: right;
    width: 32px;
    height: 32px;
    margin: -3px;
    padding: 0;
    border-radius: 50%;
    background: #000;
    font-weight: 100;
    font-size: 20px;
    line-height: 1;
    color: #fff;
}

#modalPopup .swiper-button-prev {
    left: 15px
}

#modalPopup .swiper-button-next {
    right: 15px
}


/*========== Layout ==========*/
#skip,
#btn-back {
    position: fixed;
    top: -1px;
    left: -1px;
    width: 1px;
    height: 1px;
    overflow: hidden;;
    z-index: 9999;
    padding: .5em;
    opacity: 0;
}

/*
.body-transparent:not(.is-scroll) #hd{background:none;box-shadow:none}
*/
.body-transparent #hd {
    background: none;
    box-shadow: none
}

#hd {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    height: 90px;
    padding: 0 30px;
    background: #fff; /*box-shadow:0 0 40px rgba(0,0,0,.1);*/
    transition: background .4s
}

.is-scroll #hd {
    box-shadow: 0 0 20px rgba(0, 0, 0, .05);
}

#hd h1 {
    position: absolute;
    top: 21px;
    left: 40px;
}

#hd h1 a {
    display: inline-block;
    margin-right: .5rem;
    font-size: 0;
    vertical-align: top
}

#hd h1 img {
    transition: .3s
}

#hd.open h1, .body-transparent #hd h1 {
    filter: contrast(0) brightness(10)
}

#hd.open {
}

#gnb h6 {
    font-weight: 500
}

#gnb > ul a {
    display: block;
    position: relative;
    padding: 34px 0;
    font-size: 18px;
}

#gnb > ul > li > a,
.sitemap > li > a {
    position: relative;
}

#gnb .active h6 {
    font-weight: 700
}

#gnb .active > a, .menu-mypage-link .active a {
    font-weight: 500;
    color: #000
}

#gnb ul ul {
    display: none;
    padding: .5em 0;
}

#gnb ul ul a {
    display: block;
    padding: .5em 1.5em;
}

/* sitemap */
#sitemap {
    display: none;
    overflow-y: auto;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1;
    max-height: calc(100vh - 80px);
    padding: 40px 0;
    border-top: 1px solid #333;
    box-shadow: 0 5px 5px rgba(0, 0, 0, .05);
    color: #fff;
    animation: fadeIn .5s;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
}

.open #sitemap {
    display: block;
    overflow: hidden;
    background-color: rgba(0, 0, 0, .8);
}

.sitemap {
    display: flex;
    white-space: nowrap
}

.sitemap .active > a,
.sitemap a:hover {
    color: #fff !important
}

.sitemap h6 {
    font-weight: 400;
    font-size: 20px;
    color: #fff
}

.sitemap > li + li {
    padding: 0 30px;
}

.sitemap > li > ul {
    margin: 10px 0 0
}

.sitemap > li > ul > li {
    display: flex;
    padding: 10px 20px 0 0;
    font-size: .9em
}

.sitemap > li a {
    min-width: 8em;
    color: #999 !important
}

.sitemap > li.active h6 {
    padding-left: 1rem;
}

.sitemap > li.active h6::before {
    content: "";
    position: absolute;
    top: calc(0.5em + 1px);
    left: 0;
    width: 0.66rem;
    height: 2px;
    background-color: #fff;
}

#sitemap-bn {
    margin-top: 50px
}

#sitemap-bn ul {
    display: flex;
    margin: 0 -20px
}

#sitemap-bn li {
    width: 33.3333%;
    padding: 0 20px
}

#sitemap-bn p {
    margin-top: .75em;
    font-size: .95em
}

#sitemap-bn img {
    animation: zoomIn .5s both
}

#acc {
    position: absolute;
    top: 32px;
    right: 100px;
    font-size: 15px
}

#acc > a {
    display: inline-block;
    position: relative;
    margin-left: 1em;
    white-space: nowrap
}

.lan-mn {
    position: absolute;
    top: 0;
    right: 60px;
    width: 30px;
    height: 58px;
    background: url(../img/icon-language.png) no-repeat center center / 28px 28px;
    border: 0;
    color: inherit;
}

.lan-mn ul {
    display: none;
    position: absolute;
    top: calc(100% - 0.5rem);
    left: 50%;
    transform: translateX(-50%);
    background: #FFF;
    box-shadow: 0px 10px 10px #0000000F;
    border: 1px solid #DDDDDD;
    border-radius: 5px;
    padding: 12px 16px;
    line-height: 1.3;
    text-align: center;
}

.lan-mn ul li a:not(.active) {
    color: #B2B2B2;
    font-size: 14px;
}

.js-mn {
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;
    height: 60px;
    background: none;
    border: 0;
    font-size: 0;
    line-height: 0;
    text-indent: -999em;
    color: inherit;
}

.js-mn > span, .js-mn:after, .js-mn:before {
    content: "";
    position: absolute;
    left: calc((100% - 22px) / 2);
    top: 50%;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: #000;
    margin-top: -2px;
    transition: transform .3s, opacity .3s;
    z-index: 100
}

.js-mn:before {
    margin-top: -10px;
    transform-origin: top right
}

.js-mn:after {
    margin-top: 6px;
    transform-origin: bottom right
}

.gnb-open .js-mn,
.gnb-open .lan-mn {
    z-index: 120
}

.gnb-open .js-mn:before {
    transform: rotate(-45deg);
    margin: -10px 0 0 -4px
}

.gnb-open .js-mn > span {
    opacity: 0
}

.gnb-open .js-mn:after {
    transform: rotate(45deg);
    margin: 5px 0 0 -4px
}

.gnb-open #gnb {
    transform: none !important
}

.body-transparent:not(.nav-open) .js-mn > span, .body-transparent:not(.nav-open) .js-mn:after, .body-transparent:not(.nav-open) .js-mn:before {
    background: #fff
}

.body-transparent:not(.nav-open) .lan-mn {
    background-image: url(../img/icon-language-wh.png)
}

/* ft */
#ft {
    position: relative;
    padding: 80px 0 30px;
    background: #000;
    font-size: 15px;
    font-family: 'Pretendard';
    color: rgba(255, 255, 255, .5);
}

#ft img {
    margin-bottom: 40px
}

/* #ft a{color: #fff} */
#ft h3 {
    margin-bottom: 0;
    font-weight: 500;
    font-size: 1em;
    color: #fff
}

#ft h3 > a {
    font-size: 20px;
}

#ft p {
    margin-bottom: 1em;
    word-break: normal;
}

#ft p i {
    display: inline-block;
}

#ft p i::after {
    content: "|";
    font-size: 0.5rem;
    opacity: 0.5;
}

#ft .ft-info li {
    display: flex;
}

#ft .ft-info li span {
    width: calc(5rem + 20px);
    color: #fff;
    white-space: nowrap;
}

#btn-tel {
    position: fixed;
    bottom: 20px;
    right: 90px;
    z-index: 99;
    width: 120px;
    background: #000;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, .2);
    font-weight: 500;
    font-size: 16px;
    line-height: 60px;
    text-align: center;
    color: #fff
}

.ft-info p,
.ft-mn ul {
    flex-grow: 1;
    flex-basis: 0;
}

.ft-mn > li {
    margin-bottom: 1.5em;
    display: flex;
}

.ft-mn > li > a {
    width: calc(4em + 20px);
}

.ft-mn ul li {
    display: inline-block;
    position: relative;;
    margin-right: 0.8em
}

.ft-mn ul li + li {
    padding-left: 0.8em;
}

.ft-mn ul li + li::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, .3);
    width: 1px;
    height: 10px;
}

#ft .ft-mn ul li a {
    color: rgba(255, 255, 255, .5)
}

.ft-mn a:hover {
    color: #fff !important
}

#ft .copy {
    color: rgba(255, 255, 255, .3);
}

.contact-talk {
    display: flex;
    position: fixed;
    z-index: 9;
    right: 135px;
    bottom: 80px;;
    color: #fff;
    font-weight: 500;
    border: 1px solid #FFFFFF33
}

.contact-talk a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #000;
    font-size: 16px;
    padding: 1rem 1rem;
    box-shadow: 0px 10px 30px #0000001F;
}

#go-top {
    position: absolute;
    bottom: 5px;
    right: 5px;
    transform: rotate(-90deg); /*width:42px;top:42px; padding-top:24px; background:#fff url(../img/icon-top.svg) no-repeat 50% 0; border-radius:50%; font-weight:500; text-align: center; color:#000*/
}

#ch-plugin-launcher img {
    max-width: 60px;
    max-height: 60px;
}

/*================== Sub Layout ==================*/
.page-container {
    position: relative;
}

.page-hd .icon-arr-down {
    position: absolute;
    right: 20px;
    bottom: 0;
}

.page-visual {
    display: flex;
    justify-content: flex-end;
}

body.page-visual-disabled .page-visual {
    display: none;
}

.page-hd h2 ~ ul {
    font-family: 'Pretendard', sans-serif;
}

.page-hd h2 ~ ul li {
    color: #111;
    opacity: 0.3;
    font-weight: 500;
}

.page-hd h2 ~ ul li:hover,
.page-hd h2 ~ ul li.active {
    opacity: 1
}

/* index */
#index {
    overflow: hidden;
    height: 100vh;
}

#index > * > .swiper-slide:not(#index-visual):not(#index-footer),
#index-visual .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    overflow: hidden;
    height: 100vh;
    padding-top: 90px
}

#index #index-footer {
    height: auto;
    padding-top: 0
}

#index .bg {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: no-repeat 50% 50% / cover;
}


#index-nav {
    position: fixed;
    top: 50%;
    left: 30px;
    right: auto;
    width: 0
}

#index-nav li {
    position: relative;
    width: auto;
    height: auto;
    margin: .5em 2em;
    background: none;
    font-weight: 600;
    font-size: .9em;
    text-align: left;
    white-space: nowrap;
    opacity: 1
}

#index-nav li:before,
#index-nav li:after {
    content: '';
    position: absolute;
    top: 50%;
    left: -1.5em;
    width: 6px;
    height: 6px;
    margin-top: -3px;
    border-radius: 9em;
    background: #ccc;
    transition: .4s;
}

#index-nav li:after {
    width: 20px;
    height: 20px;
    margin: -10px -7px;
    border: 1px solid;
    background: none;
    opacity: 0
}

#index-nav li span {
    opacity: 0;
    pointer-events: none
}

/*
#index-nav .swiper-pagination-bullet-active span{opacity: 1;pointer-events: auto}
*/
#index-nav .swiper-pagination-bullet-active:before {
    background: #000
}

#index-nav .swiper-pagination-bullet-active:after {
    opacity: 1
}

#index-nav.wh li {
    color: #fff
}

#index-nav.wh .swiper-pagination-bullet-active:before {
    background: #fff
}

#index h2 {
    font-size: 3.8888rem;
    line-height: 1
}

#index h2 + p {
    margin: 1em 0
}

#index-visual {
    text-align: center;
    color: #fff
}

#index-visual .container {
    position: relative
}

#index-visual .row {
    flex-direction: column
}

#index-visual h2 {
    font-weight: 500;
    font-size: 5em;
    margin-bottom: 2.88rem;
    line-height: 1.2;
}

#index-visual p {
    font-size: 1.44rem;
    margin-bottom: 8px;
}

#index-visual .swiper-pagination {
    top: auto;
    bottom: 72px;
    left: 260px;
    width: 220px;
    height: 2px;
    background-color: rgba(255, 255, 255, .2);
}

#index-visual .swiper-pagination-progressbar-fill {
    background-color: #fff !important;
}

#index-reference {
    background: #fff
}

#index-reference-slide .swiper-slide {
    width: auto;
}

#index-reference-slide .swiper-slide a {
    display: block;
    height: 100%;
    box-shadow: 0px 30px 40px #0000001F;
    background-color: #fff;
}

#index-reference-slide .swiper-slide a > div {
    padding: 32px
}

#index-reference-slide .swiper-slide:not(:last-child) {
    border-right: 1px solid rgba(255, 255, 255, .1);
}

.index-reference-nav {
    position: relative;
    display: flex;
}

.index-reference-nav [class^=swiper-button] {
    position: relative;
    left: auto;
    right: auto;
    margin-top: 0;
    width: auto;
    margin-right: 10px;
}

.index-reference-nav [class^=swiper-button]::after {
    display: none;
}

#index-reference-slide h3 {
    position: absolute;
    z-index: 2;
    font-size: 0.88rem;
    color: #fff;
    font-weight: normal;
    border: 1px solid #fff;
    padding: 6px 12px;
    top: 32px;
    left: 32px
}

#index-reference-slide p.h5 + p {
    min-height: 3em;
}

#index-reference-slide .img {
    width: 100%;
    position: relative;
    max-height: 263px;
    overflow: hidden;
}

#index-reference-slide .img::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent linear-gradient(0deg, #24252700 0%, #23242604 37%, #00000099 100%) 0% 0% no-repeat padding-box;
    opacity: 0.8;
}

#index-reference-slide .img img {
    object-fit: cover;
    width: 100%;
}

#index-reference-slide img, #prod-case img {
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
}

#index-reference-slide img:last-child,
#prod-case img:last-child {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: .4s
}

#index-reference-slide .swiper-slide a:hover {
    transform: translateY(-20px);
}

#index-reference-slide .swiper-slide a:hover img,
#prod-case a:hover img {
    opacity: 1
}

#index-reference-slide .caption1 {
    font-weight: 300;
    opacity: 0.5;
}

#index-reference-slide .more {
    display: inline-block;
    font-size: 0.83333rem;
    line-height: 1;
    border-bottom: 2px solid #fff
}

#index-business h2 {
    position: absolute;
    top: 0;
    font-size: 1.75em
}

#index-business h3, #index-about h2 {
    font-size: 3.3333em;
    line-height: 1.1
}

#index-business h4 {
    margin: 1.5em 0 1.1rem;
    font-size: 1.333rem;
    font-weight: 700;
    font-family: 'Pretendard';
}

#index-business p {
    margin: 0 0 2em;
    color: #333;
    line-height: 1.75;
}

#index-business .icon-arr-wh {
    filter: invert(1);
}

#index-business-nav {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    z-index: 1;
    width: 15.27%;
    transform: translate(0, -50%);
}

#index-business-nav a {
    display: block;
    margin: 1em 0;
    padding: .5em 0;
    border-bottom: 2px solid transparent;
    font-size: 20px;
    font-weight: 500;
    opacity: 0.3;
}

#index-business-nav .active {
    border-color: #111;
    opacity: 1;
    font-weight: 600;
}

#index-about {
    background: #f8f8f8 url(../img/index/object_m.png) no-repeat 160px 128px;
}

#index-about h2 + p {
    margin: 1rem 0 2.8888rem;
    line-height: 1.7;
}

#index-about li {
    display: inline-block
}

#index-about li + li {
    margin-left: 2em
}

#index-about h3 {
    margin-bottom: .2em;
    font-size: 2.5em
}

#index-news h2 + p {
    margin: 2em 0
}

#index-news li a {
    display: block;
    padding: 2em 0;
    border-bottom: 1px solid #ddd;
}

#index-news strong {
    width: 7em;
    color: #002EAB;
}

#index-news h3 {
    margin-bottom: .8em;
    font-weight: 700;
    font-size: 1.2em
}

#index-news li p {
    color: #666
}

#index-news img {
    box-shadow: 0 1em 1.5em rgba(0, 0, 0, .2)
}

/* #index .swiper-container{overflow: hidden;} */
#index .swiper-slide-active h2 {
    animation: fadeIn 1s .4s both
}

#index .swiper-slide-active h2 + * {
    animation: fadeIn 1s .8s both
}

#index .swiper-slide-active h2 + * + * {
    animation: fadeIn 1s 1.2s both
}

#index .swiper-slide-active h2 + * + * + *,
#index-about.swiper-slide-active img,
#index-news.swiper-slide-active .col-lg-8 {
    animation: fadeIn 1s 1.6s both
}

#index-inquiry.swiper-slide-active .index-inquiry-visual {
    animation: fadeIn 1s .4s both;
}

#index-inquiry.swiper-slide-active .index-inquiry-panel {
    animation: fadeIn 1s .8s both;
}

#index-partners > div {
    height: 100%;
}

#index-footer > div > p {
    text-align: center;
    border-top: 1px solid #E5E5E5
}

/* #index-inquiry{background:#f6f7f9;} */
#index-inquiry .index-inquiry-layout{
    display:flex;
    flex-direction:column;
    align-items:center;
    row-gap:70px;
    width:100%;
    padding-top:140px;
    padding-bottom:140px;
}
#index-inquiry .index-inquiry-visual{
    position:relative;
    width:100%;
    max-width:1440px;
    height:340px;
    flex:0 0 340px;
    overflow:hidden;
    border-radius:35px;
    background-color:#f3f5f8;
    background-image:url('/assets/img/index/contact.jpg');
    background-position:center 23.5%;
    background-repeat:no-repeat;
    background-size:cover;
}
#index-inquiry .index-inquiry-visual-content{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
    padding-top:50px;
    color:#fff;
    font-family:Pretendard, sans-serif;
    text-align:center;
}
#index-inquiry .index-inquiry-visual-accent{
    width:65px;
    height:7px;
    flex:0 0 7px;
    border-radius:10px;
    background:linear-gradient(to right, #029efc, #7ccf44);
}
#index-inquiry .index-inquiry-visual-title{
    margin:9px 0 0;
    color:#fff;
    font-size:45px;
    font-weight:800;
    line-height:60px;
    letter-spacing:0;
}
#index-inquiry .index-inquiry-visual-description{
    margin:10px 0 0;
    color:#fff;
    font-size:21px;
    font-weight:400;
    line-height:32px;
    letter-spacing:0;
}
#index-inquiry .index-inquiry-visual-meta{
    display:flex;
    align-items:center;
    gap:32px;
    margin-top:40px;
    font-size:18px;
    font-weight:400;
    line-height:32px;
    letter-spacing:0;
}
#index-inquiry .index-inquiry-visual-meta p{
    display:flex;
    align-items:center;
    gap:12px;
    margin:0;
}
#index-inquiry .index-inquiry-visual-meta strong{font-weight:700;}
#index-inquiry .index-inquiry-visual-meta p:last-child strong{font-weight:600;}
#index-inquiry .index-inquiry-visual-divider{opacity:.4;}
@media (min-width:992px){
    #index-inquiry .index-inquiry-visual-content{
        box-sizing:border-box;
        width:min(635px, calc(100% - 40px));
        margin:0 auto;
        padding-top:60px;
    }
    #index-inquiry .index-inquiry-visual-title{margin-top:53px;}
    #index-inquiry .index-inquiry-visual-description{
        width:100%;
        margin-top:15px;
    }
    #index-inquiry .index-inquiry-visual-meta{
        width:100%;
        justify-content:center;
        margin-top:30px;
    }
    #index-inquiry.index-inquiry--en .index-inquiry-visual-content{
        width:min(1000px, calc(100% - 40px));
    }
    #index-inquiry.index-inquiry--en .index-inquiry-visual-description{
        white-space:nowrap;
    }
    #index-inquiry.index-inquiry--en .index-inquiry-visual-meta{
        white-space:nowrap;
    }
    #index-inquiry.index-inquiry--en .index-inquiry-visual-meta p{
        flex:0 0 auto;
    }
}
#index-inquiry .index-inquiry-kicker{
    margin-bottom:1rem;
    color:#002eab;
    font-size:.875rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}
#index-inquiry h2{
    margin:0;
    font-size:clamp(2rem,2.6vw,3.25rem);
    font-weight:700;
    line-height:1.3;
    letter-spacing:-.045em;
}
#index-inquiry .index-inquiry-description{
    margin-top:2rem;
    color:#111111;
    font-size:1rem;
    line-height:1.75;
    word-break:keep-all;
}
#index-inquiry .index-inquiry-description p{margin:0 0 .45rem;}
#index-inquiry .index-inquiry-panel{
    width:100%;
    max-width:1440px;
    padding:0 0 1.4rem;
    /* border:1px solid #e4e6ea;
    background:#fff;
    box-shadow:0 18px 48px rgba(22,31,54,.08); */
}
#index-inquiry .index-inquiry-form-heading{
    padding-bottom:12px;
    margin-bottom:50px;
    border-bottom:1.5px solid #000;
}
#index-inquiry .index-inquiry-form-heading h3{
    margin:0;
    font-size:32px;
    font-weight:700;
    line-height:60px;
}
#index-inquiry .index-inquiry-form-heading p{margin:0;color:#777;font-size:.76rem;}
#index-inquiry .index-inquiry-form-heading span,
#index-inquiry .index-inquiry-label span{color:#f83d5c;}
#index-inquiry .index-inquiry-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:1rem .8rem;
}
#index-inquiry .index-inquiry-primary-fields{
    display:grid;
    grid-column:1 / -1;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:36px 60px;
}
#index-inquiry .index-inquiry-primary-fields input,
#index-inquiry .index-inquiry-primary-fields select{
    width:100%;
    max-width:none;
}
#index-inquiry .index-inquiry-field{min-width:0;}
#index-inquiry .index-inquiry-field-full{grid-column:1 / -1;}
#index-inquiry .index-inquiry-label{
    display:block;
    margin:0 0 .3rem;
    color:#25282e;
    font-size:1rem;
    font-weight:700;
}
#index-inquiry .index-inquiry-primary-fields .index-inquiry-label{margin-bottom:12px;}
#index-inquiry .form-control,
#index-inquiry .custom-select,
#index-inquiry .index-inquiry-file > label{
    width:100%;
    height:50px;
    border:1px solid #d8dbe0;
    border-radius:0;
    background-color:#fff;
    color:#333;
    font-size: 1rem;
}
#index-inquiry .form-control,
#index-inquiry .custom-select{
    padding:0 18px;
    height:50px;
    font-size: 1rem;
}
#index-inquiry textarea.form-control{
    height:240px;
    min-height:240px;
    padding-top:14px;
    padding-bottom:14px;
    resize:vertical;
}
#index-inquiry .index-inquiry-options{
    display:flex;
    align-items:center;
    gap:.45rem 1rem;
    min-height:1.55rem;
    overflow-x:auto;
    color:#444;
    font-size: 1rem;
    white-space:nowrap;
    scrollbar-width:thin;
}
#index-inquiry .index-inquiry-options label{margin:0;}
#index-inquiry .index-inquiry-options.check-group label{
    display:inline-flex;
    align-items:center;
    gap: 8px;
}
#index-inquiry .index-inquiry-options.check-group input + span {
    margin-right: 0;
}
#index-inquiry .index-inquiry-options .custom-control{min-height:1.25rem;padding-left:1.3rem;}
#index-inquiry .index-inquiry-options .custom-control-label::before,
#index-inquiry .index-inquiry-options .custom-control-label::after{
    top:.1rem;
    left:-1.3rem;
    width:1rem;
    height:1rem;
}
#index-inquiry .index-inquiry-options-scroll {
    overflow-x: visible;
    flex-wrap: wrap;
    white-space: normal;
}
#index-inquiry .index-inquiry-file-field .custom-file-input {
    position: relative;
    width: 100%;
}
#index-inquiry .index-inquiry-file-field .custom-file-label {
    position: absolute;
}
#index-inquiry .index-inquiry-file-field .custom-file-label::before {
    content: none;
}
#index-inquiry .index-inquiry-file-field .custom-file-input:focus ~ .custom-file-label {
    border-color: #80bdff;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
#index-inquiry .index-inquiry-file-field .custom-file-label::after {
    width: auto;
    height: calc(1.5em + .75rem);
    line-height: 1.5;
    border-radius: 0;
    background-color: #e9ecef;
    color: #495057;
    content: "Browse";
}
#index-inquiry .index-inquiry-consent{
    display:flex;
    align-items:center;
    gap:.4rem;
    color:#333;
    font-size:.78rem;
}
#index-inquiry .index-inquiry-agree{
    display:inline-flex;
    align-items:center;
    margin:0;
    cursor:pointer;
    font-size: 1rem;
    gap: 8px;
}
#index-inquiry .index-inquiry-agree input + span {
    margin-right: 0;
}
#index-inquiry .index-inquiry-policy-button{
    padding:0;
    border:0;
    border-bottom:1px solid #777;
    background:none;
    color:#555;
    font-size:inherit;
    line-height:1.2;
}
#index-inquiry .index-inquiry-actions{
    display:flex;
    justify-content:center;
    gap:.5rem;
    margin-top:50px;
}
#index-inquiry .index-inquiry-actions .btn{
    min-width:7rem;
    padding:.58rem 1rem;
    border:1px solid #111;
    border-radius:0;
    font-size:.8rem;
}
#index-inquiry .index-inquiry-actions .btn:first-child{background:#fff;}
.index-inquiry-privacy-modal .modal-title{font-size:1.4rem;font-weight:700;}
.index-inquiry-privacy-modal .modal-body{
    max-height:65vh;
    overflow-y:auto;
    color:#444;
    font-size:.9rem;
    line-height:1.7;
}
.index-inquiry-privacy-modal .modal-header .close {
    margin: 0 0 0 auto;
}

/* Sub */
.partners ul {
    display: flex;
    flex-wrap: wrap;
}

.partners li {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
    padding: 8px;
}

.partners img {
    box-shadow: 0px 10px 20px #0000000F;
}

.partners .color_rule {
    font-weight: 700;
    font-size: 2.5em;
}

.contents .partners ul {
    margin-bottom: 8%
}

.list-dnld li {
    margin: 10px 0
}

/* board */
.board-search *:active,
.board-search *:focus {
    border-color: #111 !important;
}

.board-search .form-control,
.board-search .custom-select {
    border: 0;
    border-bottom: 1px solid #ccc;
    font-size: 1rem;
    height: 100%;
}

.board-search label.form-control {
    padding: 0;
}

.board-search .form-control > input {
    border: 0;
    width: 100%;
    height: 100%;
    padding: 0 0.5rem
}

.board-list div.cont {
    position: relative;
    border: 1px solid #E5E5E5;
    font-family: "Pretendard";
}

.board-list div.cont.notice {
    border-color: #111;
}

.board-list:not(.board-thumb) div.cont.notice a::after,
.board-list.board-thumb div.cont.notice a p.h3::before {
    content: "공지";
    font-size: 0.8888rem;
    color: #fff;
    background-color: #111;
    border-radius: 1em;
    padding: 0.2rem 0.4rem;
}

.board-list:not(.board-thumb) div.cont.notice a::after {
    position: absolute;
    top: 1.1rem;
    right: 1.1rem;
}

.board-list.board-thumb div.cont.notice a p.h3::before {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin-top: -4px;
    margin-right: 0.5rem;
}

.board-list:not(.recruit-process) div.cont:hover {
    border-color: #111;
    box-shadow: 0px 15px 30px #00000014;
}

.board-list div.cont p.h3 {
    font-size: 1.3333rem !important;
    font-weight: 700 !important;
}

[class*=board-] aside {
    font-size: 0.83333rem;
    color: #b2b2b2
}

[class*=board-] aside i.bar {
    display: inline-block;
}

[class*=board-] aside i.bar::after {
    content: "I";
    display: inline-block;
    color: #ccc;
    transform: scale(0.8);
    font-weight: 300;
    padding: 0 0.5em
}

[class*=board-] aside > b {
    margin-right: 0.3rem;
}

.board-list .desc-line {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #666
}

.board-list .desc-line.v2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.board-list .desc-line.v3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.board-card .h3 {
    line-height: 1.4;
}

.board-card.v2 .h3 {
    font-weight: 700;
    font-size: 1.3333rem;
}

.board-card.v2 .card-thumb {
    text-align: center;
}

.board-thumb {
    padding-bottom: 20px;
}

.board-thumb .down {
    white-space: nowrap;
    align-self: center;
    font-weight: 600;
}

.board-gallery .multi-img {
    position: relative;
    overflow: hidden;
}

.board-gallery .multi-img > img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.3s;
}

.board-gallery .multi-img > span {
    position: relative;
    display: block;
}

.board-gallery .multi-img:hover > img:last-child {
    opacity: 0;
}

.board-detail {
}

.board-detail .detail-header {
    padding-bottom: 40px;
}

.board-detail .detail-header h1 {
    font-size: 2.2222rem;
    margin-top: 0.7777rem;
    font-family: 'Pretendard';
    font-weight: 700 !important
}

.board-detail .detail-header p > span {
    color: #b2b2b2;
}

.board-detail .detail-cont {
    padding: 48px 0 60px;
    border-top: 1px solid #111;
    border-bottom: 1px solid #111
}

.board-navi .button {
    display: flex;
    align-items: center;
    border: 0;
    background-color: #fff;
    width: 100%;
    font-weight: 500;
}

.board-navi .button.disabled {
    opacity: 0.3;
    pointer-events: none;
}

.board-navi .button .icon-arr {
    width: 24px;
    height: 24px;
}

.board-navi a i {
    font-size: 1.5rem;
}

.board-navi a span.thumb {
    width: 3.55rem;
    height: 3.55rem;
    overflow: hidden;
}

.board-navi a span.thumb img {
    object-fit: cover;
    width: 100%;
    height: 100%;;
}

.newsletter-list {
    border-top: 1px solid #111;
}

.detail-reference dt {
    font-size: 1.1111rem;
    font-weight: 600;
    min-width: 7em;
}

.detail-reference dd {
    font-size: 0.8888rem;
}

.detail-reference dl ul li {
    display: flex;
}

.detail-reference dl ul li span {
    font-weight: 600;
    width: 5em;
}

.detail-reference dl ul li p {
    color: #4D4D4D;
    flex: 1
}

.detail-reference dl ul li:not(:last-child) {
    margin-bottom: 0.6rem;
}

.detail-reference .caption1 {
    color: #b2b2b2;
}

/* product사업분야 */
.product-location {
    position: absolute;
    top: 170px;
    left: 50%;
    width: 100%;
    max-width: 1440px;
    transform: translateX(-50%);
    padding: 0 20px;
    font-size: 0.83333rem;
    z-index: 10;
}

.product-location > div {
    position: relative;
    display: inline-block;
    padding-right: 1.5em;
    color: #999;
    padding-bottom: 0.3rem;
}

.product-location > div:last-child {
    color: #111
}

.product-location > div:not(:last-child)::after {
    content: "\e93f";
    font-family: 'xeicon';
    position: absolute;
    right: 0.25em;
    top: calc(50% - 0.15rem);
    transform: translateY(-50%);
}

.product-location > div > a {
    position: relative;
    padding-right: 1.5rem;
}

.product-location > div > a::after {
    content: "\e942";
    font-family: 'xeicon';
    position: absolute;
    right: 0;
    top: 50%;
    width: 0.83333rem;
    height: 0.83333rem;
    transform: translateY(-50%);
    border: 1px solid #999;
    border-radius: 50%;
    line-height: 1;
    text-align: center;
    font-size: 0.8em;
}

.product-location > div a:hover {
    color: #333;
}

.product-location > div:last-child a::after {
    border-color: #111
}

.product-location > div > ul {
    position: absolute;
    left: calc(50% - 0.83333rem);
    transform: translateX(-50%);
    background-color: #fff;
    border: 1px solid #E5E5E5;
    padding: 0.8rem 1.111rem;
    z-index: 10;
    opacity: 0;
    pointer-events: none;
    width: 120%
}

.product-location > div > ul li {
    font-size: 0.83333rem;
    padding: 0.2rem 0;
    word-break: break-all;
}

.product-location > div > ul li a:hover {
    text-decoration: underline !important;
}

.product-location > div:hover ul {
    opacity: 1;
    pointer-events: all;
}

.product-location.active {
    position: fixed;
    top: 105px;
}

.product-img {
    position: relative;
    z-index: 5;
    outline: 1px solid #e5e5e5;
    background: #F4F5F6;
    text-align: center;
}

.product-img::before {
    content: "";
    display: block;
    width: 100%;
    padding-top: 100%;
}

.product-img span {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.product-img span img {
    max-height: 100%;
}

.product-summary .summary-tit {
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 1.8888rem;
    margin-bottom: 1.7777rem;
}

.product-heading {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.product-heading-name {
    display: block;
    margin-bottom: .5rem;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
}

.product-summary .summary-tit .d-flex-space { gap: 1rem; }
.product-list-heading { margin-bottom: 2.222rem; line-height: 1.36; }

.product-summary .summary-spec {
    display: flex;
    flex-wrap: wrap;
}

.product-summary .summary-spec > * {
    padding-bottom: 1rem;
}

.product-summary .summary-spec dt {
    width: 8em;
}

.product-summary .summary-spec dd {
    width: calc(100% - 8em);
    color: #333;
}

.product-summary .btn-wrap {
    margin-top: 2.5rem;
}

.product-nav {
    position: absolute;
    width: 100%;
    background-color: #fff;
    z-index: 3;
}

.product-nav.active {
    position: fixed;
    top: 0;
}

.product-nav .nav-tabs {
    margin-bottom: 0;
    border-bottom: 1px solid #CCCCCC
}

.product-nav .nav-tabs a {
    font-size: 1.1111rem;
    padding: 1.1rem 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
}

.product-nav .nav-tabs a.active {
    border-bottom: 2px solid #111 !important
}

#prodNav {
    position: relative;
}

#prodCont h4,
#prodCont .product-section-heading {
    margin-bottom: 2.2222rem;
    font-size: 30px !important;
}

.cs-btn {
    position: absolute;
    right: 20px;
    bottom: 1rem;
    opacity: 0;
    pointer-events: none;
    transition: 0.3s;
}

.product-nav.active .cs-btn {
    opacity: 1;
    pointer-events: all;
}

.product-detail {
    position: relative;
    width: 100%;
    padding-bottom: 4.444rem;
    overflow: hidden;
}

.product-detail + div > .board-navi {
    border-top: 1px solid #111;
}

#prod-case {
    position: relative;
}

/* #prod-case .swiper-slide div{padding-top: 1.38rem;} */
#prod-case .swiper-slide div p {
    padding-bottom: 0.5rem;
}

#prod-case .swiper-slide div p:first-child {
    padding-bottom: 0.8rem;
}

#prod-case .caption1 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #B2B2B2;
}

#prod-case .caption1 > span {
    margin-right: .5em
}

#prod-case .img {
    width: 100%;
    position: relative;
}

.product-detail .swiper-nav {
    position: absolute;
    top: 0;
    right: 0;
}

.product-detail .swiper-nav > * {
    display: inline-block;
    margin-left: 4px;
    opacity: 0.3;
    transition: 0.3s;
}

.product-detail .swiper-nav > *:hover {
    opacity: 1;
}

/* About */
#about h3 {
    font-size: 2.2222rem;
    line-height: 1.5;;
    font-weight: 700;
}

#about-1 {
    display: flex;
    align-items: center;
    flex-direction: column;
    min-height: 60vw;
    padding-top: 20%;
    background: #000 url("../img/about/bg.jpg") no-repeat 50% 0 / 100% auto;
    text-align: center;
    color: #fff;
}

#about h2 {
    margin-bottom: .5em;
    font-size: 3.5rem;
}

#about-1 p {
    max-width: 800px;
    font-size: 1.333rem
}

#about-2 {
    background: #000;
    color: #fff
}

#about-3 {
    padding: 10% 0;
    text-align: center
}

#about-3 ul {
    margin: 5% 0;
}

#about-3 strong {
    display: block;
    color: #999
}

#about-4 {
    position: relative;
    background: #000;
    height: 700vh;
    color: #fff
}

#about-4.eng {
    height: 600vh
}

#about-4 .ani-obj {
    width: 100%;
    transition: 2s
}

#about-4 li > * {
    position: relative;
    border: 2px solid #fff;
    background: #000;
    white-space: nowrap
}

#about-4 h4 {
    font-size: 26px;
}

#about-4 small {
    font-size: 18px;
    color: #005CFF
}

#about-4 img {
    position: absolute;
    bottom: 30px;
    right: 30px
}

#about-4 li:first-child {
    position: relative;
    z-index: 10;
}

#about-4 li:nth-child(2) {
    z-index: 9;
}

#about-4 li:nth-child(3) {
    z-index: 8;
}

#about-4 li:nth-child(4) {
    z-index: 7;
}

#about-4 li:nth-child(5) {
    z-index: 6;
}

#about-4 li:nth-child(6) {
    z-index: 5;
}

#about-4 li:nth-child(7) {
    z-index: 4;
}

#about-4 li:nth-child(8) {
    z-index: 3;
}

#about-4 li:nth-child(9) {
    z-index: 2;
}

#about-4 li:first-child > * {
    border-color: #005CFF;
    box-shadow: 0 0 50px #1700FF96
}

#about-4 li:first-child img {
    bottom: 50%;
    right: 50%;
    width: 50%;
    transform: translate(50%, 50%)
}

#about-4 footer {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    height: 100vh;
    text-align: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 1s
}

#about-4 footer h3 {
    margin-bottom: 1em;
}

#about-5 {
    padding: 10% 0;
}

#about-5 h4 {
    margin-bottom: 1.5em;
    font-size: 1.6666rem
}

#about-5 h5 {
    font-size: 1.3333rem;
    line-height: 1.6
}

#about-5 p {
    color: #666
}

.sect-logo {
    margin: 3rem 0;
}

.logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 360px;
    margin: 2rem 0;
    border: 1px solid #E5E5E5
}

.color-box {
    padding: 0 !important
}

.color-box > * {
    margin: 0 0 2rem;
    padding: 2rem !important;
    background: #005098;
    color: #fff
}

.color-box > *:first-child {
    background: #A1CC56
}

.color-box h5 {
    margin: 1em 0 .25em;
    font-size: 1.1111rem !important;
    font-weight: 500;
}

.color-box p {
    font-size: .8em;
    color: #fff !important
}

.about-history .year {
    position: sticky;
    font-size: 5.555rem;
    font-family: 'Pretendard';
    font-weight: 700;
}

.history-cont ul {
    position: relative;
}

.history-cont ul:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 5px;
    top: calc(0.8em + 12px);
    width: 1px;
    height: 100%;
    background-color: #E5E5E5;
}

.history-cont li {
    line-height: 1.5;
    margin-bottom: 0.5rem;
    padding-left: 6rem;
}

.history-cont li.h4 {
    font-weight: 700;
    color: #111 !important;
    margin-bottom: 0.3rem;
}

.history-cont li:first-child::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 12px;
    height: 12px;
    background-color: #fff;
    border: 3px solid #111;
    border-radius: 50%;
}

#organization1 .org-hd {
    position: relative;
}

#organization1 .org-hd::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    background-color: #CCCCCC;
    z-index: -1;
}

#organization1 .org-hd > div {
    position: relative;
}

#organization1 .org-hd > div:last-child::after {
    content: "";
    position: absolute;
    top: calc(2rem - 2px);
    left: 12.5%;
    width: 50%;
    height: 1px;
    background-color: #CCCCCC;
    z-index: -1;
}

/*#organization1 .org-hd > div:last-child::after {
    content: "";
    position: absolute;
    top: calc(2rem - 2px);
    left: 50%;
    width: 25%;
    height: 1px;
    background-color: #CCCCCC;
    z-index: -1;
}*/

#organization1 h4.bg-primary {
    padding: 1rem;
}

#organization1 h4 {
    background-color: #111;
    color: #fff;
    padding: 0.7777rem;
    text-align: center;
    margin-bottom: 0 !important;
}

#organization1 p.h5 {
    text-align: center;
    border: 2px solid #111;
    padding: 1rem;
    margin-top: 1rem;
    background-color: #fff;
}

#organization1 ul {
    background-color: #F5F5F5;
    padding: 1rem;
    font-family: "Pretendard";
}

#organization1 ul li {
    margin: 2px 0
}

#organization1 ul:not(.d-flex) {
    height: 7.5rem;
}

#organization1 ul.d-flex li {
    margin-left: 1rem;
}

.contect1 {
    background-color: #F5F5F5;
    padding: 2.222rem;
}

.contect2 {
    margin-top: 2.2222rem;
}

.contect2 p.h4 {
    font-size: 1.3333rem;
}

.contect2 i {
    width: 20px;
    height: 20px;
    vertical-align: middle;
    opacity: 0.6;
}

#patent > div {
    margin-bottom: 4.44rem;
}

#patent img {
    border: 1px solid #E5E5E5;
    cursor: pointer;
}

#patentModal .modal-content {
    background-color: transparent;
    border: 0;
    border-radius: 0;
    padding: 2rem 0
}

#patentModal .close {
    color: #fff;
    padding: 0 !important;
}

#patent-img {
    box-shadow: 0px 20px 60px #00000029;
}

#patent .caption2 {
    color: #B2B2B2;
}

.contact-map {
    margin-bottom: 1.666rem;
}

.root_daum_roughmap {
    width: 100% !important;
    border: 1px solid #e5e5e5
}

.contect-road {
    margin-top: 2.333rem;
    line-height: 1.7;
}

.contect-road .h4 {
    width: 7rem;
    margin-bottom: 0;
    line-height: 1.4;
    font-weight: 700;
}

.contect-road .h4 + div {
    flex: 1;
}

.contect-road span[class^=line] {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.222rem;
}

.contect-road span.line1 {
    color: #383887
}

.contect-road span.line7 {
    color: #76812D
}

.contect-road + .contect-road {
    border-top: 1px solid #E5E5E5;
    padding-top: 2.333rem;
}

.contect-showroom-detail {
    border-top: 1px solid #111;
}

#vision2 {
    margin: 0 -5px
}

/* esg  */
.esg-box {
    border: 1px solid #e5e5e5;
}

.esg-box .h1 {
    margin-bottom: 2.2222rem;
}

.esg-vision-box {
    background-color: #F8F8F8;
    font-size: 3.3333rem;
    font-weight: 700;
    text-align: center;
}

.accordion > li {
    position: relative;
    padding: 0;
    border-bottom: 1px solid #E5E5E5;
}

.accordion a {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.accordion a.collapsed i {
    transform: rotate(180deg);
}

.accordion a + div {
    border-top: 1px solid #E5E5E5;
}

#esg-vision a {
    font-size: 1.3333rem;
    font-weight: 500;
    padding: 1em;
}

#esg-vision a .text-primary {
    font-weight: 700;
}

#esg-vision a i {
    font-size: 1rem !important;
}

#esg-vision a + div dt {
    font-size: 1.3333rem;
    font-weight: 500;
    margin-bottom: 1.1rem;
}

#esg-vision a + div dd {
    line-height: 1.7;
}

#esg-vision ol {
    counter-reset: number 0;
}

#esg-vision ol li {
    position: relative;
    padding-left: 1.5rem;
}

#esg-vision ol li:not(:first-child) {
    margin-top: 1.1rem;
}

#esg-vision ol li::before {
    counter-increment: number 1;
    content: counter(number);
    position: absolute;
    font-size: 0.8888rem;
    width: 1rem;
    height: 1rem;
    top: 0.3em;
    left: 0;
    text-align: center;
    background-color: #111;
    color: #fff;
    border-radius: 50%;
    line-height: 1rem;
}

.recruit-tit p.h2 {
    margin-bottom: 1.38rem;
}

.recruit-tit p.h2 + p {
    line-height: 1.75;
}

.recruit-box > div {
    border: 1px solid #E5E5E5;
}

.recruit-box > div .para {
    flex: 1;
    padding-right: 1.66rem;
}

.recruit-process > div {
    position: relative;
}

.recruit-process div.cont::before {
    content: "";
    display: block;
    width: 100%;
    padding-top: 100% !important;
}

.recruit-process div.cont {
    border-radius: 50%;
    overflow: hidden;
}

.recruit-process div.cont > * {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    display: flex !important;
    flex-direction: column;
    justify-content: center !important;
    align-items: center;
}

.recruit-process div.cont > * span {
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    border-radius: 50%;
    overflow: hidden;
    background-color: #0000001A
}

.recruit-process div.cont > * {
    font-size: 1.3333rem;
}

.recruit-process div.cont .bg-black span {
    background-color: #fff !important;
    color: #111
}

.esg-recruit-bn {
    background: url(../img/ESG/recruit-banner-bg.jpg) no-repeat center center / cover;
}

.esg-recruit-bn p.h1 {
    font-size: 2.4444rem;
    color: #fff;
    line-height: 1.36;
}

/* CS */
.cs-write p.h1 {
    padding-bottom: 1.666rem;
    border-bottom: 1px solid #111;
    font-weight: 700;
    margin-bottom: 1.666rem;
}

.cs-write .label {
    font-weight: 700;
    padding-top: 0.8rem;
}

.cs-write .label > span {
    color: #F83D5C
}

.cs-write input[type=text] {
    width: 100%;
}

.cs-write .custom-file-input {
    height: 1px;
    width: 1px;
    position: absolute;
}

.cs-write .custom-file-label {
    border-radius: 0;
    position: relative;
    width: 100%;
    height: calc(2em + 0.75rem + 2px);
    line-height: 2em;
    color: #BCBCBC;
    border: 0
}

.cs-write .custom-file-label::before {
    content: "";
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 8em - 10px);
    height: 100%;
    border: 1px solid #ccc;
    background-color: #F0F0F0;
}

.cs-write .custom-file-label::after {
    content: "파일 첨부";
    height: 100%;
    background-color: #111;
    color: #fff;
    width: 8rem;
    text-align: center;
    line-height: 2;
    border-radius: 0
}

.cs-write .form-group .check-group > * {
    margin-right: 2rem;
    padding-top: 0.8rem;
}

.cs-write .check-group input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.cs-write .check-group input + span {
    display: inline-block;
    vertical-align: middle;
    border: 1px solid #707070;
    width: 20px;
    height: 20px;
    line-height: 1;
    color: #fff;
    margin-right: 4px;
}

.cs-write .check-group input:checked + span {
    background-color: #111;
    color: #fff
}

.cs-write #agree-legal {
    border: 1px solid #CCCCCC;
    padding: 1rem;
    height: 360px;
    overflow-x: auto;
    margin-bottom: 1.6rem;
}

.cscenter > div > div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    border: 1px solid #E5E5E5;
}

.cscenter img, .cs-service img {
    width: 100px;
}

.cs-snd h4 {
    font-weight: 700;
}

.cs-service > div > div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    border: 1px solid #E5E5E5
}

.cs-service dl {
    font-family: 'Pretendard';
}

.cs-service dl dt {
    margin-bottom: 0.5em;
}

.cs-snd .h5 {
    line-height: 1.6;
}

/*
.cs-location{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.cs-location li span{position: absolute;background: url(../img/cs/icon-location_black.svg) no-repeat center center / contain;border:0;color:#fff;text-align: center;padding-top: 0.2em;cursor: pointer;}
.cs-location li.active span{background-image: url(../img/cs/icon-location_blue.svg) ; transform: scale(1.35);}
.cs-location li:nth-child(1) span{top: 16%;left: 39%;}
.cs-location li:nth-child(2) span{top: 12%;left: 56%;}
.cs-location li:nth-child(3) span{top: 37%;left: 36%;}
.cs-location li:nth-child(4) span{top: 32%;left: 48%;}
.cs-location li:nth-child(5) span{top: 50%;left: 42%;}
.cs-location li:nth-child(6) span{top: 62%;left: 38%;}
.cs-location li:nth-child(7) span{top: 38%;left: 63%;}
.cs-location li:nth-child(8) span{top: 56%;left: 56%;}
.cs-location li:nth-child(9) span{top: 88%;left: 31%}
.location-list{position: absolute;opacity: 0;pointer-events: none;transition: 0.3s; background-color: #fff; box-shadow: 0px 15px 30px #00000014;}
.location-list ul{display: flex;flex-wrap: wrap;margin-top: 1rem;}
.location-list ul li{width: 50%;}
.cs-location li.active .location-list{opacity: 1;pointer-events: all;}
*/
.cs-map h3 {
    margin-bottom: 1rem;
    font-weight: 700;
}

.cs-map h3 span {
    color: #002EAB
}

.cs-map h3 + p {
    font-size: 1.2222rem;
    font-weight: 500;
}

#faq {
    border-top: 1px solid #111;
}

#faq [class*=faq-] {
    position: relative;
}

#faq [class*=faq-]::before {
    position: absolute;
    color: #fff;
    text-align: center;
    border-radius: 50%;
}

#faq .faq-q {
    padding: 36px 0;
    padding-left: 92px;
}

#faq .faq-q::before {
    content: "Q";
    top: 36px;
    left: 24px;
    background: #111;
}

#faq .faq-q .cate-name {
    display: block;
    padding-right: 25px;
    line-height: 1;
    margin-bottom: 10px;
}

#faq .faq-a {
    background-color: #F8F8F8;
    padding: 36px 40px 36px 92px;
    line-height: 1.75;
}

#faq .faq-a::before {
    content: "A";
    top: 40px;
    left: 24px;
    background: #002EAB;
}

/* modal */
#newsLetterModal {
    display: none;
    position: fixed;
    justify-content: flex-end;
    width: 100%;
    height: calc(100% - 90px);
    top: 90px;
    left: 0;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 10;
}

#newsLetterModal > .body {
    position: relative;
    width: 600px;
    height: 100%;
    background-color: #fff;
    overflow-y: auto;
}

#newsLetterModal.show {
    display: flex !important;
}

#newsLetterModal .subscribe-body {
    padding: 60px 40px 60px 60px;
}

#newsLetterModal section + section {
    border-top: 1px solid #111;
    margin-top: 2.7777rem;
    padding-top: 2.7777rem;
}

#newsLetterModal .form-group {
    margin-top: 40px;
    margin-bottom: 0;
    font-family: "Pretendard";
}

#newsLetterModal .form-group > label {
    font-weight: 700;
    padding-bottom: 0.8em;
}

#newsLetterModal .form-group label span.btn {
    width: 100%;
    border-width: 1px;
    opacity: 0.3;
    padding: 0.64em
}

#newsLetterModal.newsletter-en .form-group label span.btn {
    font-size: clamp(9px, 2.6vw, 14px);
    white-space: nowrap;
}

#newsLetterModal .form-group label input:checked + span.btn {
    opacity: 1;
}

#newsLetterModal .form-group textarea:read-only {
    background-color: #fff;
    color: #999;
    padding: 10px;
    height: 9rem;
    font-size: 0.8888rem;
}

#newsLetterModal .form-group label span.check {
    display: inline-block;
    vertical-align: middle;
    width: 1rem;
    height: 1rem;
    background-color: #fff;
    border: 1px solid #111;
    margin-right: 0.5rem;
    line-height: 1rem;
    color: #fff;
}

#newsLetterModal .form-group label input:checked + span.check {
    background-color: #000;
}

@media (min-width: 1680px) {
    .sect-main-visual .swiper-container > .swiper-button-next {
        right: 50%;
        margin-right: -780px
    }

    .sect-main-visual .swiper-container > .swiper-button-prev {
        left: 50%;
        margin-left: -780px
    }
}

@media screen and (max-width: 1199px) {
    #gnb > ul > li {
        margin-right: 30px
    }

    #sitemap {
        font-size: 14px
    }

}

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


}

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

}

.root_daum_roughmap .wrap_controllers {
    display: none;
}

/* 임시
#channelio{position: fixed;bottom:20px;right:20px;z-index:90; width: 60px;height: 60px;background:#000;box-shadow: 0px 10px 30px rgba(0,0,0,.2);} */
#ch-plugin-core > div:nth-child(3) {
    bottom: 15px !important;
    right: 15px !important
}

/* 영문 */
[lang=en] .cs-write .custom-file-label::after {
    content: "Upload";
}

.btn-pointer {
    cursor: pointer
}

@media (min-width: 992px) {
    .col-lg-2-5 {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

.solution-location{position: absolute;top: 170px;left: 50%;width: 100%; max-width: 1440px; transform: translateX(-50%); padding: 0 20px;font-size: 0.83333rem;z-index: 10;}
.solution-location>div{position: relative;display: inline-block; padding-right: 1.5em;color:#999;padding-bottom: 0.3rem; }
.solution-location>div:last-child{color:#111}
.solution-location>div:not(:last-child)::after{content: "\e93f";font-family: 'xeicon';position: absolute;right: 0.25em;top: calc(50% - 0.15rem);transform: translateY(-50%);}
.solution-location>div>a{position: relative;padding-right: 1.5rem;}
.solution-location>div>a::after{content: "\e942";font-family: 'xeicon';position: absolute;right: 0;top: 50%;width: 0.83333rem;height: 0.83333rem;transform: translateY(-50%);border:1px solid #999;border-radius: 50%;line-height: 1;text-align: center;font-size: 0.8em;}
.solution-location>div a:hover{color:#333;}
.solution-location>div:last-child a::after{border-color:#111}

.solution-location>div>ul {
    position: absolute;
    left: calc(50% - -2.16667rem);
    transform: translateX(-50%);
    background-color: #fff;
    border: 1px solid #E5E5E5;
    padding: 0.8rem 1.111rem;
    z-index: 10;
    opacity: 0;
    pointer-events: none;
    width: 195%;
}
.solution-location>div>ul li{font-size: 0.83333rem;padding:0.2rem 0;word-break: break-all;}
.solution-location>div>ul li a:hover{text-decoration: underline !important;}
.solution-location>div:hover ul{opacity: 1;pointer-events: all;}
.solution-location.active{position: fixed;top: 105px;}



.icon_shop{
    position: fixed;
    z-index: 10;
    overflow: visible;
    display: flex;
    flex-wrap: nowrap;
    width: auto;
    background: transparent;
    bottom: calc(env(safe-area-inset-bottom) + 235px);
    right: 40px;
}

.contact-talk {
    display: flex;
    position: fixed;
    color: #fff;
    font-weight: 500;
    border: 1px solid #FFFFFF33;
    z-index: 10;
    overflow: visible;
    flex-wrap: nowrap;
    width: auto;
    background: transparent;
    bottom: calc(env(safe-area-inset-bottom) + 75px);
    right: 40px;
}
/*#ch-plugin-entry {*/
/*    display: none ;*/
/*}*/
.contact-talk {
    display: none;
}

/*
.icon_shop {
    display: none;
}*/

.ico-store {
    width: 28px;
    height: 28px;
    background-image: url(../img/ico-store.svg);
}
.icon-store {
    width: 22px;
    height: 22px;
    background-image: url(../img/ico-store.svg);
}

/* ===== ACC LAYOUT ===== */
#acc {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap;   /* PC에서는 한 줄 유지 */
}

/* ===== Select Style ===== */
#acc > select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    height: 34px;
    padding: 0 14px 0 12px;

    border: 1px solid #ddd;
    border-radius: 6px;
    background-color: #fff;

    font-size: 13px;
    color: #333;
    cursor: pointer;

    /* dropdown arrow */
    background-image: url("data:image/svg+xml,%3Csvg fill='%23333' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px;
}

/* Hover / Focus */
#acc > select:hover {
    border-color: #aaa;
}
#acc > select:focus {
    outline: none;
    border-color: #222;
}

/* ===== Link Style Sync ===== */
/*#acc > a {*/
/*    display: inline-flex;*/
/*    align-items: center;*/
/*    height: 34px;*/
/*    padding: 0 10px;*/
/*    font-size: 13px;*/
/*    white-space: nowrap;*/
/*}*/

/* ===== Mobile ===== */
@media (max-width: 768px) {
    #acc {
        flex-wrap: wrap;       /* 모바일에서는 자동 줄바꿈 */
        gap: 8px;
    }

    #acc > select {
        width: 100%;
        height: 42px;
        font-size: 15px;
    }

    #acc > a {
        flex: 1 1 calc(50% - 8px);
        justify-content: center;
        height: 40px;
        font-size: 14px;
        border: 1px solid #eee;
        border-radius: 6px;
        line-height: 2.2;
    }
}
@media (max-width: 1800px) {
    #acc {
        display: none;
    }
}
#acc>a+a::before {
    content: unset;
    position: unset;
}

.cs-write .inquiry-consent-box {
    border: 1px solid #CCCCCC;
    padding: 1.25rem;
    margin-bottom: 1.25rem;
}

.cs-write .inquiry-consent-box p:last-child {
    margin-bottom: 0;
}

.language-switch {
    position: absolute;
    top: 32px;
    right: 40px;
    z-index: 10;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    font-size: 15px;
    line-height: 1.5;
    white-space: nowrap;
}