@charset "utf-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&family=Roboto:wght@300;400;500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap");

* {
    word-break: keep-all;
}

.body-layout {
    opacity: 0;
    padding-top: 0px;
    font-family: "Roboto", "Noto Sans KR", sans-serif;
    font-size: 16px;
    letter-spacing: -0.01em;
}

.body-layout > .container {
    width: 100%;
    padding: 0;
}

.bg {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#lwbox {
    /* top: 90px; */
    /* bottom: auto !important; */
}

/*=================================== reset =================================== */

img {
    flex-shrink: 0;
    image-orientation: from-image;
}

.img-box {
    position: relative;
    /* border: 1px solid #ddd; */
}

.img-box + p {
}

.pd-wrap > div:nth-child(2) .item {
    padding-left: 20px;
    padding-top: 10px;
}

:is(ol, ul, li, dl) {
    margin: 0;
    padding: 0;
    font-weight: normal;
    list-style-type: none;
    list-style-position: inside;
}

:is(p, h1, h2, h3, h4, h5, h6, dt dd, th, td, li) {
    position: relative;
    margin: 0;
    padding: 0;
    line-height: 1.5;
    font-weight: normal;
}

:is(a, a:hover) {
    text-decoration: none;
}

button {
    border-radius: 0;
    background: transparent;
    border: 1px solid #444;
}

br {
    visibility: visible;
    opacity: 0;
}

:where(.container, .row) {
    position: relative;
}

.row::before,
.row::after,
.container::before,
.container::after {
    display: none;
}

.row {
    display: flex;
    flex-wrap: wrap;
}

.row > * {
    float: inherit;
}

/* =================================== material symbol =================================== */
:root {
    /* https://fonts.google.com/icons */
    --gms: "Material Symbols Outlined";
    --true: 1;
    --false: 0;
    /* grade */
    --gradLow: "GRAD"-25;
    --gradZero: "GRAD" 0;
    --gradHigh: "GRAD" 200;
    --opsz: "opsz" 48;
    /* fill icon */
    --gms100_Fill: "FILL" var(--true), "wght" 100, var(--opsz);
    --gms200_Fill: "FILL" var(--true), "wght" 200, var(--opsz);
    --gms300_Fill: "FILL" var(--true), "wght" 300, var(--opsz);
    --gms400_Fill: "FILL" var(--true), "wght" 400, var(--opsz);
    --gms500_Fill: "FILL" var(--true), "wght" 500, var(--opsz);
    --gms600_Fill: "FILL" var(--true), "wght" 600, var(--opsz);
    --gms700_Fill: "FILL" var(--true), "wght" 700, var(--opsz);
    /* outlined icon */
    --gms100_Out: "FILL" var(--false), "wght" 100, var(--opsz);
    --gms200_Out: "FILL" var(--false), "wght" 200, var(--opsz);
    --gms300_Out: "FILL" var(--false), "wght" 300, var(--opsz);
    --gms400_Out: "FILL" var(--false), "wght" 400, var(--opsz);
    --gms500_Out: "FILL" var(--false), "wght" 500, var(--opsz);
    --gms600_Out: "FILL" var(--false), "wght" 600, var(--opsz);
    --gms700_Out: "FILL" var(--false), "wght" 700, var(--opsz);
}

@font-face {
    font-family: "Material Symbols Outlined";
    src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v47/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2) format("woff2");
    font-display: block;
}

.material-symbols-outlined {
    font-variation-settings: var(--gms400_Fill), var(--gradZero);
    user-select: none;
}

/* =================================== old builder css reset =================================== */

.container_slide,
.container_mmenu,
.topmarginLay_a,
.divider-vertical,
.intro-board-widget-layout,
.footer-social-layout,
.navbar-inverse + br,
footer + br {
    margin: 0;
    display: none !important;
}

.footer_copy > div {
    padding: 0;
}

.container_contents {
    width: 100%;
    padding: 0;
}

/* =================================== old builder css common =================================== */

/* =================================== navbar =================================== */
/* default */
#gnbauth i {
    display: none;
}

:where(.navbar-header, .navbar > .container) {
    display: flex;
}

.navbar-header {
    justify-content: center;
    align-items: center;
}

.navbar > .container {
    justify-content: space-between;
}

/* 불필요 항목 삭제 */
.navbar .caret {
    display: none;
}

/* 상단 메뉴 */
.navbar-inverse {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background: #fff;
    padding: 0px 0px;
    margin-bottom: 0;
    border-bottom: 1px solid #e1e1e1;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.18);
}

.navbar-inverse .navbar-right {
    margin-right: 0 !important;
}

/* nav 로고 */
.navbar-brand {
    width: 200px;
    height: auto;
    margin: 0 !important;
    padding: 0;
}

.navbar-brand img {
    margin: 0;
}

.divider-vertical + li {
    display: none;
}

/* nav 메뉴 속성 */
.navbar-inverse .navbar-nav > li > a {
    font-family: "Poppins", sans-serif;
    position: relative;
    font-size: 20px;
    font-weight: 600;
    color: #000;
}

/* nav 메뉴 클릭 및 후버 시 */
.navbar-inverse .navbar-nav > li > a:is(:hover, :focus),
.navbar-inverse .navbar-nav > li:is(:hover, :focus) .dropdown-toggle {
    background: none;
}

.navbar-inverse .navbar-nav > li > a::after {
    content: "";
    transition: 0.25s;
    position: absolute;
    bottom: 30px;
    display: block;
    width: 0px;
    /* width: calc(100% - 40px); */
    height: 2px;
    background: #007cbe;
}

.navbar-inverse .navbar-nav > li:is(:hover, :focus) > a::after {
    width: calc(100% - 80px);
}

/* dropdown-menu 배경 */
.navbar-inverse .navbar-nav .dropdown-menu {
    background: #fff;
}

/* dropdown-menu 메뉴 기본 */
.navbar-inverse .navbar-nav :is(li.open, li) .dropdown-menu > li > a {
    color: #555;
}

/* dropdown-menu 메뉴 후버 */
.navbar-inverse .navbar-nav .dropdown-menu > li > a:hover {
    background: #fff;
    color: #005697 !important;
    text-decoration: underline;
    text-underline-position: under;
    font-weight: 400;
}

#lang-btn {
    /* pointer-events: none; */
    display: flex;
    position: absolute;
    z-index: 100;
    right: 45px;
    top: 0;
    gap: 0 15px;
    height: var(--navHeight);
    align-items: center;
}
/* html:has(#lwbox) #lang-btn {
    pointer-events: all;
} */
#lang-btn button {
    border: 0;
    padding: 2px 0 0;
    color: #222;
    font-size: 15px;
    line-height: 1.25;
    opacity: 0.65;
    border-bottom: 1px solid #fff;
}

/* .after #lang-btn button {
    color: #222;
} */

#lang-btn button:hover {
    opacity: 1;
}

#lang-btn button.active {
    font-weight: 500;
    opacity: 1;
    color: #0b5e9d;
    border-bottom: 1px solid;
}

/* .after #lang-btn button.active {
    color: #0B5E9D;
} */

.navbar .caret,
.navbar .divider-vertical,
.navbar ~ br,
.footer-social-layout,
.footer_copy .text-center > br {
    display: none;
}

.body-layout > .navbar > #lang-btn {
    /* display: none; */
}

@media (min-width: 768px) {
    :root {
        --navHeight: 100px;
        --navMaxHeight: 125px;
    }

    .body-layout {
        padding-top: var(--navHeight);
    }

    .navbar > .container {
        width: 100%;
        padding: 0 30px;
        justify-content: center;
    }

    .navbar-right {
        /* padding-right: 110px; */
    }

    /* pc nav 높이 */
    .navbar-inverse {
        width: 100%;
        height: var(--navHeight);
        background: #fff;
    }

    .navbar-inverse :is(.container, .navbar-right, .navbar-right > li, .navbar-right > li > a) {
        height: 100%;
    }

    .navbar-inverse :is(.navbar-right, .navbar-right > li) {
        float: inherit !important;
    }

    .navbar-inverse :is(.navbar-right, .navbar-right > li > a) {
        display: flex;
    }

    .navbar-inverse.before {
        padding: 22px 0;
        height: var(--navMaxHeight);
        box-shadow: none;
    }

    .navbar-inverse.after::before {
        opacity: 1;
    }

    /* 서브페이지 nav */
    .subwrapper .navbar-inverse {
        display: block;
    }

    .subwrapper .navbar-inverse::before {
        transition: none;
        opacity: 1;
    }

    /* 로고 사이징 */
    .navbar-brand {
        position: absolute;
        display: flex;
        align-items: center;
        top: 0;
        left: 30px;
        height: var(--navHeight);
        transition: 0.3s;
        width: 200px;
    }

    .navbar-inverse.before .navbar-brand {
        width: 250px;
    }

    .navbar-inverse :is(.container, .navbar-right, .navbar-right > li, .navbar-right > li > a) {
        height: 100%;
    }

    .navbar-inverse :is(.navbar-right, .navbar-right > li) {
        float: inherit !important;
    }

    .navbar-inverse :is(.navbar-right, .navbar-right > li > a) {
        display: flex;
    }

    /* pc nav 대메뉴 */
    .navbar-inverse .navbar-nav > li > a {
        justify-content: center;
        align-items: center;
        padding: 0px 40px;
    }

    .navbar-inverse.before .navbar-nav > li > a {
        color: #fff;
    }

    .navbar-inverse.after .navbar-nav > li > a {
        color: #000;
    }

    /* pc nav 드롭다운 박스 */
    .navbar-inverse .navbar-nav .dropdown-menu {
        left: 50%;
        right: auto;
        transform: translate(-50%, -10px);
        border-radius: 0;
        border: 0;
        padding: 20px 10px;
        text-align: center;
        box-shadow: 6px 6px 18px rgb(0 0 0 / 17%);
    }

    .navbar-inverse .navbar-nav > li > a:is(:hover, :focus),
    .navbar-inverse .navbar-nav > li:is(:hover, :focus) .dropdown-toggle {
        color: #0067b5;
    }

    /* pc nav 드롭다운 메뉴*/
    .navbar-inverse .navbar-nav .dropdown-menu > li > a {
        padding: 11px 25px;
        font-size: 14px;
        line-height: 1;
        letter-spacing: 0;
        font-weight: 400;
        color: #555;
    }
}

@media (max-width: 767px) {
    :root {
        --navHeight: 70px;
    }

    #lang-btn {
        right: 55px;
    }

    #lang-btn button {
        font-size: 12px;
    }

    .body-layout {
        padding-top: 70px;
    }

    .navbar-header {
        justify-content: space-between;
        width: 100%;
        height: var(--navHeight);
        margin: 0 !important;
        border-bottom: 1px solid #ddd;
    }

    .navbar-collapse {
        padding: 0;
        margin: 0 !important;
    }

    .navbar-nav {
        width: 100%;
        margin: 0;
    }

    .navbar-header::before,
    .navbar-header::after {
        display: none;
    }

    .navbar > .container {
        flex-direction: column;
        padding: 0;
    }

    .navbar-brand {
        order: 1;
        width: 140px;
        margin: 0 0 0 15px !important;
    }

    .navbar-inverse .navbar-toggle {
        order: 2;
        border: 0;
        padding: 9px 0;
        margin: 0 15px 0 0;
    }

    .navbar-inverse .navbar-toggle .icon-bar {
        background-color: #666;
        transition: ease-in-out 0.15s all;
        opacity: 1;
        position: relative;
    }

    .navbar-inverse .navbar-toggle:is(:hover, :focus) {
        background: none;
        border-color: #444;
    }

    .navbar-inverse .navbar-nav > li > a:focus,
    .navbar-inverse .navbar-nav > li > a:hover {
        color: inherit !important;
    }

    .navbar-inverse .navbar-toggle:is(:hover, :focus) .icon-bar {
        background-color: #444;
    }

    .navbar-inverse :is(.navbar-collapse, .navbar-form) {
        border-color: transparent;
    }

    /* menu */
    .navbar-inverse.open .navbar-toggle > .icon-bar:nth-of-type(1) {
        transform: rotate(45deg);
        top: 6px;
    }

    .navbar-inverse.open .navbar-toggle > .icon-bar:nth-of-type(2) {
        opacity: 0;
    }

    .navbar-inverse.open .navbar-toggle > .icon-bar:nth-of-type(3) {
        transform: rotate(-45deg);
        top: -6px;
    }

    .navbar-inverse .navbar-nav > li > a,
    .navbar-nav .open .dropdown-menu :is(.dropdown-header, li > a) {
        display: flex;
        justify-content: start;
        align-items: center;
    }

    .navbar-inverse .navbar-nav > li > a {
        height: 50px;
        font-size: 18px;
        padding: 0 15px;
    }

    .navbar-nav .open .dropdown-menu :is(.dropdown-header, li > a) {
        height: 45px;
        padding: 0 20px;
    }

    .navbar-nav .dropdown-menu {
        float: inherit;
        padding: 0;
    }

    /* 드롭다운 배경 */
    .navbar-inverse .navbar-nav .dropdown-menu {
        background: #f7f7f7;
    }

    /* 드롭다운 폰트 */
    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
        color: #fff;
    }

    /* 드롭다운 메뉴 클릭시 */
    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:is(:hover, :focus) {
        color: #005697 !important;
        background: inherit;
    }

    .navbar-inverse .navbar-nav > li > a::after {
        content: none;
    }

    .navbar-inverse .navbar-nav > .open > a,
    .navbar-inverse .navbar-nav > .open > a:focus,
    .navbar-inverse .navbar-nav > .open > a:hover {
        background-color: inherit;
        color: inherit;
    }
}

/* =================================== footer =================================== */

.body-layout footer {
    margin-top: 0px;
    padding: 47px 0 50px;
    background-color: #111;
}

.footer-wrap {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
}

/* left logo */
/* default */
.footer-info {
    color: #888;
    font-size: 14px;
    margin: 0;
    line-height: 1.5;
}

.footer-info li:not(.corp, .copyright, .clearfix) {
    display: inline;
    margin-right: 10px;
}

.footer-info li:where(.corp, .copyright) {
    display: block;
}

.footer-info li.corp {
    margin-bottom: 19px;
    color: #aaa;
    font-size: 16px;
}

.footer-info li.copyright {
    margin-top: 10px;
    font-size: 12px;
    color: #666;
    letter-spacing: 0;
}

.footer-login {
    margin-left: auto;
}

.footer-login a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0 30px;
    margin-bottom: 5px;
    height: 35px;
    color: #aaa;
    border: 1px solid #4a4a4a;
    line-height: 1;
    font-size: 12px;
    font-weight: 500;
}

/* scrolltop */
#scrolltop {
    position: fixed;
    z-index: 1000;
    right: 20px;
    bottom: 20px;
    display: none;
    font-size: 18px;
    text-align: center;
    color: #000;
    border: 1px solid #d6d6d6;
    box-shadow: 2px 2px 6px rgb(0 0 0 / 10%);
    background: #fff;
    border-radius: 50%;
}

#scrolltop .inner {
    aspect-ratio: 1/1;
    width: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#scrolltop .inner :is(i, span) {
    font-size: 20px;
    font-variation-settings: var(--gms600_Fill), var(--gradZero);
}

/* mobile footer*/
@media (max-width: 767px) {
    .footer-info li {
        font-size: 12px;
    }
    #scrolltop {
        display: none !important;
        width: 40px;
        height: 40px;
        right: 0px;
        bottom: 50px;
    }
}

#quick-menu {
    z-index: 2000;
    position: fixed;
    right: 0;
    top: 52%;
    transform: translateY(-50%);
}

#quick-menu ul {
    margin: 0;
    background: rgb(0 0 0 / 85%);
    border-radius: 7px 0 0 7px;
    /* border-radius: 0; */
    box-shadow: 0 0 5px 0px rgba(0, 0, 0, 0.4);
    overflow: hidden;
    text-align: center;
}

#quick-menu ul li {
    border-bottom: 1px solid rgb(0 0 0);
}

#quick-menu ul li a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    padding: 0px 15px;
    height: 90px;
}

#quick-menu ul li a:hover {
    background: #0b5e9d;
}

#quick-menu ul li span.material-symbols-outlined {
    display: block;
    font-size: 35px;
    margin-bottom: 6px;
}

#quick-menu ul li img {
    width: 34px;
    margin-bottom: 7px;
    border-radius: 5px;
}

#quick-menu ul li a span:not([class]) {
    font-weight: 400;
    letter-spacing: 0;
    font-size: 13px;
}

/* no_content */
.maintenance {
    background: #f4f4f4;
    padding: 120px 25px;
    text-align: center;
}

.maintenance .icon {
    display: block;
    line-height: 1;
    font-size: 64px;
    margin-bottom: 10px;
}

.maintenance .big-cont {
    display: block;
    line-height: 1;
    font-size: 22px;
    font-weight: bold;
    letter-spacing: -0.05em;
    margin-bottom: 20px;
}

.maintenance .small-cont {
    display: block;
    line-height: 1.5;
    font-size: 14px;
    letter-spacing: -0.03em;
    color: #818181;
    margin-bottom: 20px;
}

.maintenance {
    background: #f4f4f4;
    padding: 120px 25px;
    text-align: center;
}

.maintenance .icon {
    display: block;
    line-height: 1;
    font-size: 64px;
    margin-bottom: 10px;
}

.maintenance .big-cont {
    display: block;
    line-height: 1;
    font-size: 22px;
    font-weight: bold;
    letter-spacing: -0.05em;
    margin-bottom: 20px;
}

.maintenance .small-cont {
    display: block;
    line-height: 1.5;
    font-size: 14px;
    letter-spacing: -0.03em;
    color: #818181;
    margin-bottom: 20px;
}

/* =================================== mainCarousel =================================== */
#mainCarousel.is_fade .carousel-inner .item {
    -webkit-transition-property: opacity;
    transition-property: opacity;
}

#mainCarousel.is_fade .carousel-inner .item,
#mainCarousel.is_fade .carousel-inner .active.left,
#mainCarousel.is_fade .carousel-inner .active.right {
    opacity: 0;
}

#mainCarousel.is_fade .carousel-inner .active,
#mainCarousel.is_fade .carousel-inner .next.left,
#mainCarousel.is_fade .carousel-inner .prev.right {
    opacity: 1;
}

#mainCarousel.is_fade .carousel-inner .next,
#mainCarousel.is_fade .carousel-inner .prev,
#mainCarousel.is_fade .carousel-inner .active.left,
#mainCarousel.is_fade .carousel-inner .active.right {
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

#mainCarousel.is_fade .carousel-control {
    z-index: 2;
}

#mainCarousel .carousel-inner .item {
    height: calc(100vh - var(--navHeight));
    object-fit: cover;
}

#mainCarousel .carousel-inner .item img {
    width: 100%;
    height: 100%;
    animation: zoom 9s cubic-bezier(0, 0, 0.745, 0.715);
}

@keyframes zoom {
    from {
        transform: scale(1.55, 1.55);
    }

    to {
        transform: scale(1, 1);
    }
}

#mainCarousel .carousel-inner .item::before {
    z-index: 1;
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #000;
    opacity: 0.25;
    /* mix-blend-mode: ; */
}

/* caption */
.carousel-caption {
    overflow: hidden;
    top: 30%;
    bottom: auto;
    padding: 0;
    text-align: left;
    animation: fadeInLeft 2s;
    text-shadow: 2px 2px 8px rgb(3 7 44 / 30%);
}

.carousel-caption h1 {
    white-space: nowrap;
}

.carousel-caption h1 b {
    color: #fff;
}

.carousel-caption img {
    max-width: 350px;
    filter: grayscale(1) brightness(100);
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        width: 0;
    }

    100% {
        opacity: 1;
        width: 50%;
    }
}

.carousel-caption h1 strong {
    display: block;
    font-size: 42px;
    letter-spacing: -0.03em;
    margin-bottom: 15px;
    line-height: 1.38;
    font-weight: 500;
}

.carousel-caption h1 {
    position: relative;
    font-size: 96px;
    font-weight: 800;
    letter-spacing: 0.01em;
    margin: 0;
}

.carousel-caption p {
    margin-top: 16px;
    font-size: 22px;
    line-height: 1.65;
    font-weight: 400;
    letter-spacing: -0.01em;
}

.carousel-caption .more-btn {
    margin-top: 45px;
}

.more-btn {
    transition: all 0.3s;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 186px;
    height: 51px;
    padding: 2px 24px 0;
    margin: 0 auto;
    border: 2px solid rgba(255, 255, 255, 1);
    background: rgba(0, 0, 0, 0);
    font-size: 16px;
    font-weight: 500;
    line-height: 0.8;
    color: #fff;
}

.more-btn i {
    font-size: 20px;
    margin-top: -1px;
    color: #fff;
}

.more-btn:hover {
    background: #007cbe !important;
    border-color: #007cbe;
    color: #fff;
}

.more-btn:hover i {
    color: #fff;
}

/* control */
.carousel-control {
    display: flex;
    align-items: center;
    opacity: 0.25;
}

.carousel-control:is(.right, .left) {
    background: transparent;
    justify-content: center;
}

.carousel-control.right span {
    margin-right: 0;
}

.carousel-control.left span {
    margin-left: 0;
}

.glyphicon.glyphicon-chevron-right::before,
.glyphicon.glyphicon-chevron-left::before {
    color: #fff;
    font-family: var(--gms);
    font-weight: 100;
}

.glyphicon.glyphicon-chevron-right::before {
    content: "\e5e1";
}

.glyphicon.glyphicon-chevron-left::before {
    content: "\e5e0";
}

.carousel-control :is(.glyphicon-chevron-left, .glyphicon-chevron-right, .icon-next, .icon-prev) {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    font-size: 70px;
    width: 40px;
    height: 70px;
}

/* indicators */
.carousel-indicators {
    bottom: 10%;
    /* display: none; */
    text-align: left;
}

.carousel-indicators :is(li, li.active) {
    /* aspect-ratio: 1/1; */
    width: 65px;
    height: 8px;
    border: 1px solid rgb(255 255 255 / 55%);
    border-radius: 0;
    margin: 0 3px;
}

.carousel-indicators li {
    background-color: rgba(255, 255, 255, 0);
    transition: ease-in-out 0.15s all;
}

.carousel-indicators li.active {
    background: #fff;
    /* width: 55px; */
    box-shadow: none;
}

/* =================================== mainpage common =================================== */

/* =================================== subpage header =================================== */
/* default */
.subpage-header {
    position: relative;
    height: 370px;
    background: center / cover no-repeat url(/skin/img/sub/sub-top01.jpg);
    /* backdrop-filter: brightness(50%); */
}

/* background */
/* .subpage-header.visual01 {
    background-image: url(/public/img/sub/sub-top01.jpg);
} */

/* .subpage-header.visual02 {
    background-image: url(/public/img/sub/sub-top02.jpg);
} */

/* .subpage-header.visual03 {
    background-image: url(/public/img/sub/sub-top03.jpg);
} */

/* .subpage-header.visual04 {
    background-image: url(/public/img/sub/sub-top04.jpg);
} */

/* .subpage-header.visual05 {
    background-image: url(/public/img/sub/sub-top05.jpg);
} */

.subpage-header::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #000;
    /* background: linear-gradient(to bottom, rgba(0,0,0,0.5), #000); */
    opacity: 0.15;
}

.subpage-header .subpage-title {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
    padding-top: 50px;
    text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
}

.subpage-header .subpage-title h1 {
    font-size: 68px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    letter-spacing: 0;
}

.breadcrumb {
    position: static;
    background: none;
    padding: 0;
    margin: 0 0 14px;
    display: flex;
    gap: 20px;
    font-size: 13px;
}

.breadcrumb > li {
    position: relative;
    color: rgba(255, 255, 255, 0.7);
}

.breadcrumb > li.active {
    color: #fff;
}

.breadcrumb > li + li:before {
    content: "\e5cc";
    font-family: var(--gms);
    font-weight: 400;
    position: absolute;
    left: -24px;
    display: block;
    font-size: 18px;
    line-height: 1;
}

/* =================================== snb =================================== */
.snb {
    position: relative;
    z-index: 10;
    background: #111;
}

.snb :where(ul, li > a) {
    display: flex;
    justify-content: center;
}

.snb ul {
    margin: 0;
}

.snb li > a {
    display: inline-block;
    /* justify-content: center; */
    /* align-items: center; */
    /* width: 100%; */
    line-height: 70px;
    padding: 0 0px;
    height: 70px;
    text-align: center;
    font-size: 15.5px;
    text-transform: uppercase;
    color: #eee;
    font-weight: 300;
}

.snb li {
    /* margin: 0 10px; */
    flex: 1;
    text-align: center;
}

.snb ul li:not(.active) a:hover {
    color: #fff;
}

.snb li.active a {
    position: relative;
    color: #fff;
    /* background: #0B5E9D; */
    font-weight: 500;
}

.snb li.active a::after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 23px;
    background: #219fff;
    background: #fff;
}

.snb_depth2 {
    margin-top: 50px;
}

.subpage .snb_depth2 + h2 {
    margin-top: 70px;
    font-size: 46px;
    font-weight: 500;
    color: #004a82;
}

.snb_depth2 ul {
    display: flex;
    gap: 0;
    justify-content: center;
}

.snb_depth2 ul > li {
    flex: 1;
    max-width: 50%;
}

.snb_depth2 ul a {
    display: flex;
    height: 60px;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    text-transform: uppercase;
    color: #555;
    padding: 0 30px;
    background: #fff;
    border: 1px solid #d6d6d6;
}

.snb_depth2 ul li + li a {
    border-left: none;
}

.snb_depth2 ul li.active a {
    background: #004a82;
    border-color: #004a82;
    font-weight: 700;
    color: #fff;
}

.snb_depth3 {
    margin-top: 25px;
    /* border-bottom: 1px solid #ddd; */
}

.snb_depth3 ul::before,
.snb_depth3 ul::after {
    content: none;
}

.snb_depth3 ul {
    align-items: center;
    justify-content: center;
    display: flex;
    gap: 5px 10px;
    border: none;
    flex-wrap: wrap;
}

.snb_depth3 ul a {
    padding: 0 17px;
    margin: 0;
    line-height: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 43px;
    font-size: 15px;
    color: #777;
    font-weight: 500;
    border: 1px solid #fff !important;
    border-radius: 50px;
}

.snb_depth3 ul li + li a {
    border-left: none;
}

.snb_depth3 ul li > a:hover,
.snb_depth3 ul li > a:focus {
    background: transparent;
    color: #222;
    border: 1px solid #fff;
}

.snb_depth3 ul .active > a,
.snb_depth3 ul .active > a:hover,
.snb_depth3 ul .active > a:focus {
    font-weight: 700;
    color: #111;
    border: 1px solid #fff;
    /* border-bottom: 3px solid #0B5E9D; */
    border: 1px solid #0b5e9d !important;
    color: #0b5e9d;
}

/* =================================== subpage section, title =================================== */
.content-header {
    margin-bottom: 100px;
}

.content-header h2 {
    font-weight: 700;
    font-size: 48px;
    line-height: 1;
    color: #000;
    text-align: center;
}

.section-header {
    margin-bottom: -50px;
}

.subpage :where(.section-wrap) {
    display: flex;
    flex-direction: column;
    gap: 135px 0;
}

.subpage .section-wrap.active {
    display: flex !important;
}

.section-header h3 {
    font-weight: 900;
    font-size: 40px;
    line-height: 1;
    color: #005393;
}
.section-header h3 > a{
    display: inline-block;
    width: fit-content;
}
.subpage-content {
    padding-top: 120px;
    padding-bottom: 150px;
}

.subpage-content section {
    display: flex;
    flex-direction: column;
    gap: 40px 0;
}

.subpage-content .se-title {
    position: relative;
}

.subpage-content .se-title:only-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.subpage-content .se-title h4 {
    margin: 0 0 -10px;
    padding-left: 18px;
    font-size: 30px;
    font-weight: 700;
    color: #111;
}

.subpage-content .se-title h4::before {
    content: "";
    width: 8px;
    height: 8px;
    background: #ff7b17;
    position: absolute;
    left: 0;
    top: 11px;
    border-radius: 50%;
    box-shadow: 0 14px #ff7b17;
}

.subpage-content .se-title h4 small {
    font-size: 70%;
    margin-left: 10px;
}

.subpage-content .se-title p {
    font-size: 17px;
    margin-bottom: 0;
    line-height: 1.68;
    font-weight: 400;
    color: #333;
}

.subpage-content .se-title h4 + * {
    margin-top: 40px;
}

.subpage-content .se-title img.se-logo {
    /* position: absolute; */
    /* right: 0; */
    /* bottom: 10px; */
    /* height: 60px; */
}

/* Business > Semiconductor */
#bs01_01 .section-wrap {
    gap: 150px;
}

#bs01_01 .se01 {
    margin-top: -30px;
}

#bs01_01 .se-title h4 {
    margin: 0 0 10px;
}

#bs01_01 .se-title h4 small {
    display: block;
    margin-top: 8px;
    margin-left: 0;
}

#bs01_01 .se-title .se-logo {
    margin-bottom: 25px;
}

#bs01_01 .se-inova .con-wrap {
    margin: 0 -20px;
}

#bs01_01 .se-inova .con-wrap > div {
    padding: 0 20px;
}

#bs01_01 .se-inova p {
    margin-top: 30px;
    padding: 0 50px;
    text-align: center;
    font-size: 18px;
    color: #333;
    line-height: 1.45;
    font-weight: 700;
}

#bs01_01 .se-inova .item {
    background: #f7f7f7;
    padding-bottom: 35px;
}

#bs01_01 .se-inova p span {
    color: #f03927;
}

#bs01_03 .se06 .item {
    margin-top: 5px;
}

#bs01_03 .se06 .item h5 {
    text-align: center;
    background: #0b5e9d;
    color: #fff;
    margin: 0;
    padding: 10px;
}

#bs01_03 .se06 .item .img-box {
    margin-top: 0;
    padding: 45px 50px;
    background: #f2f2f2;
}

/* Geehy */
#bs01_04 .se01 .wrap-con {
    padding: 60px 60px 0;
    background: #0e143e;
}
#bs01_04 .se01 .box-icon {
    display: flex;
    justify-content: space-around;
}
#bs01_04 .se01 .box-icon img {
    width: 100px;
}
#bs01_04 .se01 .box-icon .tit {
    margin: 15px 0 0;
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    text-align: center;
}
#bs01_04 .se01 .middle {
    margin: 40px 0;
    text-align: center;
}
#bs01_04 .se01 .middle p {
    position: relative;
    display: inline-block;
    font-size: 23px;
    font-weight: 600;
    color: #fff;
    letter-spacing: 2px;
}
#bs01_04 .se01 .middle p::before,
#bs01_04 .se01 .middle p::after {
    content: "";
    top: 12px;
    width: 222px;
    height: 20px;
    position: absolute;
}
#bs01_04 .se01 .middle p::before {
    left: -53%;
    background: url(/skin/img/sub/bs01_04_se01_middle_left.png) no-repeat center / cover;
}
#bs01_04 .se01 .middle p::after {
    right: -53%;
    background: url(/skin/img/sub/bs01_04_se01_middle_right.png) no-repeat center / cover;
}
#bs01_04 .se01 .box-card-round {
    display: flex;
    gap: 12px;
}
#bs01_04 .se01 .box-card-round .inner {
    position: relative;
}
#bs01_04 .se01 .box-card-round .tit {
    top: 0;
    left: 0;
    width: 100%;
    position: absolute;
    padding: 10px 2px;
    font-size: 13px;
    font-weight: 500;
    color: #fff;
    letter-spacing: 0.2px;
    line-height: 1.2em;
    text-align: center;
    background: rgb(14 20 62 / 60%);
}
#bs01_04 .se01 .box-card-round .tit .light {
    font-weight: 300;
}
#bs01_04 .se01 .box-card-round .tit .light.sm {
    font-size: 85%;
}
#bs01_04 .w_img {
    padding: 45px;
    background: #f5f5f5;
}
#bs01_04 .se03 ul.li-icon-hori {
    padding: 0;
}
#bs01_04 .se03 ul.li-icon-hori > li {
    min-height: 125px;
    display: flex;
    align-items: center;
    padding: 15px;
    padding-left: 100px;
    font-size: 14px;
    line-height: 1.35em;
}
#bs01_04 .se03 ul.li-icon-hori > li + li {
    border-top: 1px solid #fff;
}
#bs01_04 .se03 ul.li-icon-hori > li .icon {
    top: 0;
    left: 0;
    width: 80px;
    height: 100%;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #cad6f6;
}
#bs01_04 .se03 ul.li-icon-hori > li .icon img {
    max-width: 30px;
    max-height: 35px;
}
#bs01_04 .se05 p.img-bottom {
    margin: 30px 0 0 55px;
    font-weight: 500;
    color: #c00000;
}
.geehy-table-wrap > div:nth-child(1) {
    padding-right: 45px;
}
.geehy-table-wrap > div:nth-child(1) p {
    color: #333;
    text-align: center;
}
.geehy-table-wrap .table-wrap table th {
    width: 50%;
    padding: 15px;
    font-size: 17px;
    font-weight: 700;
    text-align: center;
    background: #f7f7f7;
}
.geehy-table-wrap .table-wrap table td p {
    margin: 20px 0 15px;
    font-size: 15px;
}
#bs01_04 .se08 .geehy-table-wrap .table-wrap table th {
    width: 33.333%;
}
.box-toolChain .inner {
    padding: 30px;
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 5px;
}
.box-toolChain .inner + .inner {
    margin-top: 30px;
}
#bs01_04 .se09 .box-toolChain h5 {
    margin: 0 0 25px;
    font-size: 20px;
    font-weight: 700;
    color: #0b5e9d;
    line-height: 1.3;
}
#bs01_04 .se09 .wrap-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}
#bs01_04 .se09 .wrap-logo > .logo:nth-child(1) {
    flex-basis: 60%;
}
#bs01_04 .se09 .table-wrap table th {
    padding: 16px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    background: #0e143e;
}
#bs01_04 .se09 .table-wrap table td {
    background: #fff;
}
#bs01_04 .se09 .box-toolChain .right .inner-left {
    width: 72%;
}
#bs01_04 .se09 .box-toolChain .right .inner-right {
    width: 28%;
    margin-top: -25px;
    text-align: center;
}
#bs01_04 .se09 .box-toolChain .right .inner-bottom {
    margin-top: 20px;
    padding: 0;
}

.color-red {
    color: #ff0000 !important;
}

/* Business > Wireless */
#bs02_01 .se08 .pd-wrap + .pd-wrap {
    margin-top: 25px;
}

#bs02_01 .se10 .img-box {
    padding: 30px 45px 0;
}

#bs02_01 .se16 .se-title h4 {
    padding-bottom: 0;
    border-bottom: 0;
}

#bs02_01 .se16 .se-title img.pd-img {
    position: absolute;
    mix-blend-mode: multiply;
    right: 40px;
    bottom: -100px;
    height: 190px;
    margin: 0;
}

#bs02_02 .se03 .img-box {
    border: 1px solid #ddd;
    padding: 5%;
}

#bs02_02 .se03 .img-wrap > div > img {
    border: 1px solid #ddd;
}

#bs02_03 .se01 .img-box {
    border: 1px solid #ddd;
    padding: 30px 0;
}

#bs02_03 .se02 .img-box {
    border: 1px solid #ddd;
    padding: 50px 80px;
}

#bs02_03 .se01 .se-title h4 {
    flex: 1;
}

#bs02_03 .se01 .se-title img.pd-img {
    margin: 0 auto;
    max-width: 319px;
}

#bs02_04 .se01 .li-img {
    max-width: 800px;
    margin: 30px auto 0;
}

/* Business > 수동소자 */
[id^="bs03_"] .snb_depth2 li a {
    font-size: 15px;
}

#bs03_02 .pd-wrap {
    gap: 30px 0;
    margin-top: 15px;
}

#bs03_03 .subpage-content .se01 .se-title p {
    padding: 30px 100px 20px;
    font-size: 24px;
    font-weight: 500;
    text-align: center;
    line-height: 1.5;
    color: #111;
}

#bs03_03 .subpage-content .se01 .se-title h4::before {
    content: none;
}

#bs03_03 .subpage-content .se01 .se-title h4 {
    padding-left: 0;
}

#bs06_01 .se11 .img-box + p {
    text-align: center;
    color: #333;
    font-weight: 500;
    font-size: 15px;
    line-height: 1.4;
    padding: 0 20px;
}

#bs06_01 .se11 .col-sm-4 .item {
    border: 1px solid #ddd;
    padding: 20px;
}

#bs06_01 .se13 .col-sm-6 .item {
    border: 1px solid #ddd;
}

#bs06_01 .se13 .col-sm-6 .item h5 {
    text-align: center;
    background: #0b5e9d;
    color: #fff;
    margin: -1px;
    padding: 10px;
}

#bs06_01 .se13 .col-sm-6 .item .img-box {
    padding: 40px;
}

#bs06_01 .se21 > .con-wrap {
    margin: 0 -30px;
}

#bs06_01 .se21 > .con-wrap > div {
    padding: 0px 30px;
}

#bs06_01 .se21 .pd-wrap .item {
    padding-left: 5px;
}

#bs06_01 .se21 .pd-wrap img {
    border: 1px solid #ddd;
}

#bs06_02 .se04 .img-box {
    border: 1px solid #ddd;
    padding: 30px 50px;
}

#bs06_01 .se15 > div:nth-child(3) .item .img-box {
    justify-content: end;
}

#bs06_01 .se15 > div:nth-child(3) .item .img-box img {
    max-width: 200px;
}

#bs07_01 .se03 .img-wrap {
    border: 1px solid #ddd;
    padding: 50px 85px;
    margin: 0;
}

/* PRODUCT */
#pd03_01 .se02 .img-box {
    border: 1px solid #ddd;
    padding: 40px 80px;
}

#pd03_01 .se03 .col-sm-6 > .img-box {
    padding: 40px;
    border: 1px solid #ddd;
}

#pd03_01 .se03 .li-round {
    margin-bottom: 35px;
}

#pd03_01 .se04 .item .img-box {
    margin-top: 0;
    padding: 40px;
    background: #f2f2f2;
}

#pd03_01 .se04 .item h5 {
    text-align: center;
    background: #0b5e9d;
    color: #fff;
    margin: 0;
    padding: 10px;
}

.subpage-content .item h5 {
    margin: 0 0 10px;
    font-size: 22px;
    font-weight: 700;
    color: #0b5e9d;
    line-height: 1.4;
}

.subpage-content .item h5 + .dl-info {
    margin-top: 15px;
}

.subpage-content .item > * + h5 {
    margin-top: 35px;
}

.subpage-content .info > * + :where(ul, div, img),
.subpage-content .item > * + :where(ul, div, img) {
    margin-top: 13px;
}

.subpage-content .item > :where(ul, div, img) + p {
    margin-top: 20px;
}

.subpage-content p {
    font-size: 16px;
    line-height: 1.55;
    color: #555;
}

.subpage-content p + p {
    margin-top: 22px;
}

.subpage-content :where(img, .img-box) + p {
    margin-top: 20px;
}

.subpage-content .iso {
    display: flex;
    align-items: center;
    gap: 0 10px;
    color: #777;
}

/* =================================== subpage content =================================== */
.greet-wrap {
    display: flex;
    align-items: start;
}

.greet-wrap .text-wrap {
    width: 50%;
}

.greet-wrap h3 {
    font-size: 40px;
    margin-bottom: 40px;
    color: #333;
    letter-spacing: -0.02em;
    font-weight: 600;
    line-height: 1.45;
}

.greet-wrap p {
    line-height: 1.65;
    letter-spacing: -0.025em;
}

.greet-wrap p + p {
    margin-top: 20px;
}

.greet-wrap b {
    color: #0b5e9d;
}

.greet-wrap .slogan {
    padding-right: 60px;
}

.greet-wrap .name {
    text-align: right;
}

.greet-wrap .name span {
    font-size: 20px;
    transform: translateY(-10px);
    margin-right: 10px;
}

.greet-wrap .name strong {
    font-size: 22px;
    color: #222;
    letter-spacing: 5px;
}

.history-wrap {
    margin: 0;
}

.history-wrap > div {
    padding: 0;
}

.history-wrap .img-box {
    flex-direction: column;
    gap: 50px 0;
    padding-right: 80px;
}

.history-wrap .img-box .img-2010 {
    margin-top: 1100px;
}

.history-wrap .year-box {
    border-left: 1px solid #e1e1e1;
    gap: 60px 0;
    padding-top: 10px;
    padding-left: 60px;
}

.history-wrap .item {
    width: 100%;
}

.history-wrap .item h5 {
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 16px;
    line-height: 1;
    color: #0b5e9d;
}

.history-wrap .item h5::after {
    content: "";
    z-index: 10;
    position: absolute;
    left: -69px;
    top: 7px;
    display: block;
    aspect-ratio: 1;
    width: 17px;
    border-radius: 50%;
    background: #0b5e9d;
    border: 5px solid #fff;
    box-shadow: 0px 0px 0px 1px #63a0cf;
}

.history-wrap .item li {
    display: flex;
    font-size: 16px;
    color: #555;
    padding-left: 13px;
}

.history-wrap .item li::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    width: 6px;
    height: 2px;
    background: #898989;
}

.history-wrap .item ul {
    display: flex;
    flex-direction: column;
    gap: 5px 0;
}

.history-wrap .item li strong {
    margin-right: 15px;
    color: #222;
}

.cert-wrap {
    gap: 60px 0;
    margin: 0 -25px;
}

.cert-wrap > div {
    padding: 0 25px;
}

.cert-wrap img {
    border: 2px solid #f0f0f0;
    padding: 10px;
    box-shadow: 3px 4px 10px rgba(0, 0, 0, 0.07);
}

.cert-wrap p {
    margin-top: 20px;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    color: #333;
}

/* map */
/* :where(.root_daum_roughmap, .root_daum_roughmap .wrap_map, .map-google iframe) {
    width: 100% !important;
    height: 400px;
    padding: 0 !important;
} */

[class$="-dash"] {
    display: flex;
    flex-direction: column;
    gap: 5px 0;
    margin: 0;
    padding: 0;
}

[class$="-dash"] > *:not(dt) {
    position: relative;
    padding-left: 15px;
    line-height: 1.4;
}

[class$="-dash"] > *:not(dt)::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 8px;
    width: 7px;
    height: 2px;
    background: #898989;
}

[class$="-box"] {
    display: flex;
    flex-wrap: wrap;
}

.li-grey {
    background: #f7f7f7;
    padding: 30px;
}

.li-box {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin: 0;
    padding: 0;
}

.li-box > li {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    padding: 0 20px;
    font-size: 15px;
    background: #e9f2f9;
    color: #00427e;
}

.li-round {
    display: flex;
    flex-direction: column;
    gap: 5px 0;
    margin: 0;
    padding: 0;
}

.li-round > li {
    position: relative;
    padding-left: 15px;
}

.li-round > li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 9px;
    display: block;
    width: 5px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: #0b5e9d;
}

.li-round > li > ul {
    display: flex;
    flex-direction: column;
    font-size: 87%;
    gap: 4px 0;
    opacity: 0.88;
    margin-top: 4px;
    margin-bottom: 12px;
}

.li-round > li > ul > li::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 8px;
    width: 7px;
    height: 2px;
    background: #898989;
}

.li-round > li > ul > li {
    padding-left: 14px;
    line-height: 1.4;
}

.li-feat {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.li-feat > li {
    display: flex;
    flex-direction: column;
    padding: 15px 25px;
    background: #e9f2f9;
    color: #00427e;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: calc((100% - 15px * 3) / 4);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.4;
    height: 110px;
}

.li-feat > li > ul {
    display: flex;
    gap: 0 14px;
    font-size: 13px;
    margin-top: 5px;
}

.li-img {
    display: flex;
    flex-wrap: wrap;
    gap: var(--liGap);
    --liGap: 10px;
}

.li-img.border li {
    border: 1px solid #ddd;
    padding: 10px 25px;
}

.li-img.col-6 > li {
    width: calc((100% - var(--liGap) * 1) / 2);
}

.li-img.col-4 > li {
    width: calc((100% - var(--liGap) * 2) / 3);
}

.li-img.col-3 > li {
    width: calc((100% - var(--liGap) * 3) / 4);
    border: 1px solid #e3e3e3;
    padding: 15px 55px;
}

.partner-wrap {
    gap: 30px 0;
}

.partner-wrap .item {
    height: 100%;
    border: 1px solid #ddd;
    padding: 33px 24px;
    border-top: 2px solid #0b5e9d;
}

.partner-wrap .item .li-round li {
    font-size: 15px;
}

.partner-wrap .item ul {
    padding-top: 25px;
    border-top: 1px solid #eaeaea;
    margin-top: 25px;
}

.dl-info {
    display: flex;
    flex-wrap: wrap;
    gap: var(--dlGap);
    --dlGap: 20px;
}

.dl-info li {
    color: #555;
    font-size: 15px;
}

.dl-info.col-12 > div {
    width: 100%;
}

.dl-info.col-6 > div {
    width: calc((100% - var(--dlGap) * 1) / 2);
}

.dl-info.col-4 > div {
    width: calc((100% - var(--dlGap) * 2) / 3);
}

.dl-info.col-3 > div {
    width: calc((100% - var(--dlGap) * 3) / 4);
}

.dl-info div {
    background: #f5f5f5;
    padding: 30px 33px;
}

.dl-info dt {
    font-size: 20px;
    margin-bottom: 12px;
    color: #0b5e9d;
    line-height: 1.3;
}

.dl-info dd {
    margin-top: 5px;
    line-height: 1.55;
    font-size: 15px;
    color: #555;
    padding-left: 12px;
    position: relative;
}

.dl-info dd::before {
    content: "";
    width: 4px;
    height: 4px;
    background: #666;
    position: absolute;
    left: 0;
    top: 8px;
}

.top-wrap {
    position: relative;
    width: 800px;
    margin: 0 auto;
}

.top-wrap .winizen-logo {
    position: absolute;
    left: 0;
    top: 0;
}

.con-wrap {
    gap: 55px 0;
}

#bs02_02 .se01 .pd-wrap .col-sm-5 img {
    width: 70%;
    margin: 0 auto;
}

#bs03_03 .pd-wrap .col-sm-12 + .col-sm-12 {
    margin-top: -1px;
}

#bs03_03 .pd-wrap .item {
    padding: 20px 0;
    border-top: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
    align-items: center;
}

#bs03_03 .se04 .pd-wrap {
    border-top: 2px solid #0b5e9d;
    margin: 0;
}

.pd-wrap .item.bg {
    display: flex;
    padding: 30px;
    align-items: flex-end;
    height: 100%;
}

.pd-wrap .item.bg h5 {
    width: 100%;
    font-size: 22px;
    text-align: center;
    color: #fff;
}

#bs06_01 .se02 .pd-wrap .item.bg {
    background-image: url(/skin/img/sub/bs06_01_se02_01.jpg);
}

#bs06_01 .se04 .pd-wrap .item.bg {
    background-image: url(/skin/img/sub/bs06_01_se04_01.jpg);
}

.pd-wrap .pd-img {
    display: flex;
    gap: 0 5px;
    padding-left: 20px;
}

.pd-wrap .pd-img img {
    width: 50%;
}

.pd-wrap .pd-img img:only-child {
    width: 100%;
}

.quote-box {
    margin-top: 0;
    padding: 35px 40px;
    /* text-align: center; */
    display: block;
    background: #e9f2f9;
    background: #f5f5f5;
}

.quote-box p {
    /* font-size: 18px; */
    /* color: #00427e; */
}

.quote-box p.name {
    font-size: 15px;
    font-weight: 600;
    font-style: italic;
    margin-top: 18px;
}

#bs06_01 .se14 .img-box {
    margin-top: 20px;
}

.quote-box h5 {
    font-size: 20px;
    margin-bottom: 15px;
    font-weight: 700;
}

.quote-box h5.text-red {
    /* color: #f03927; */
}

.cate-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: -85px;
    padding-right: 40px;
}

.cate-wrap .li-cate {
    display: flex;
    gap: 0 10px;
    flex: 1;
    width: 100%;
    margin-right: 50px;
    margin-top: 55px;
}

.cate-wrap .li-cate li {
    flex: 1;
    display: flex;
    height: 55px;
    justify-content: center;
    align-items: center;
    background: #4d6274;
    color: #fff;
}

.cate-wrap + .img-box {
    margin-top: 50px;
}

.app-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.app-wrap .item {
    display: flex;
    width: calc((100% - 16px) / 3);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.app-wrap .item p {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 90px;
    background: rgba(0, 0, 0, 0.6);
    font-weight: 500;
    letter-spacing: 0.1px;
    font-size: 20px;
    text-shadow: 1px 1px 3px rgb(0 0 0 / 70%);
}

.app-wrap .item:nth-of-type(1) {
    background-image: url(/skin/img/sub/busi05-app1.jpg);
}

.app-wrap .item:nth-of-type(2) {
    background-image: url(/skin/img/sub/busi05-app2.jpg);
}

.app-wrap .item:nth-of-type(3) {
    background-image: url(/skin/img/sub/busi05-app3.jpg);
}

.app-wrap .item:nth-of-type(4) {
    background-image: url(/skin/img/sub/busi05-app4.jpg);
}

.app-wrap .item:nth-of-type(5) {
    background-image: url(/skin/img/sub/busi05-app5.jpg);
}

.app-wrap .item:nth-of-type(6) {
    background-image: url(/skin/img/sub/busi05-app6.jpg);
}

.app-wrap .item:nth-of-type(7) {
    background-image: url(/skin/img/sub/busi05-app7.jpg);
}

.app-wrap .item:nth-of-type(8) {
    background-image: url(/skin/img/sub/busi05-app8.jpg);
}

.app-wrap .item:nth-of-type(9) {
    background-image: url(/skin/img/sub/busi05-app9.jpg);
}

.app-wrap .item:nth-of-type(10) {
    background-image: url(/skin/img/sub/busi05-app10.jpg);
}

.app-wrap .item:nth-of-type(11) {
    background-image: url(/skin/img/sub/busi05-app11.jpg);
}

.app-wrap .item:nth-of-type(12) {
    background-image: url(/skin/img/sub/busi05-app12.jpg);
}

.app-wrap .item:nth-of-type(13) {
    background-image: url(/skin/img/sub/busi05-app13.jpg);
}

.app-wrap .item:nth-of-type(14) {
    background-image: url(/skin/img/sub/busi05-app14.jpg);
}

.app-wrap .item:nth-of-type(15) {
    background-image: url(/skin/img/sub/busi05-app15.jpg);
}

.app-wrap .item:nth-of-type(16) {
    background-image: url(/skin/img/sub/busi05-app16.jpg);
}

.app-wrap .item:nth-of-type(17) {
    background-image: url(/skin/img/sub/busi05-app17.jpg);
}

.app-wrap .item:nth-of-type(18) {
    background-image: url(/skin/img/sub/busi05-app18.jpg);
}

.app-wrap .item:nth-of-type(19) {
    background-image: url(/skin/img/sub/busi05-app19.jpg);
}

.app-wrap .item:nth-of-type(20) {
    background-image: url(/skin/img/sub/busi05-app20.jpg);
}

.app-wrap .item:nth-of-type(21) {
    background-image: url(/skin/img/sub/busi05-app21.jpg);
}

.app-wrap .item:nth-of-type(22) {
    background-image: url(/skin/img/sub/busi05-app22.jpg);
}

.app-wrap .item:nth-of-type(23) {
    background-image: url(/skin/img/sub/busi05-app23.jpg);
}

.app-wrap .item:nth-of-type(24) {
    background-image: url(/skin/img/sub/busi05-app24.jpg);
}

.app-wrap .item:nth-of-type(25) {
    background-image: url(/skin/img/sub/busi05-app25.jpg);
}

.app-wrap .item:nth-of-type(26) {
    background-image: url(/skin/img/sub/busi05-app26.jpg);
}

.app-wrap .item:nth-of-type(27) {
    background-image: url(/skin/img/sub/busi05-app27.jpg);
}

.app-wrap .item p {
    color: #fff;
}

.icon-wrap {
    gap: 30px 0;
}

.icon-wrap.type02 {
    gap: 15px 0;
}

#bs02_02 .icon-wrap {
    margin: 60px 0 50px;
}

.icon-wrap .item {
    position: relative;
    height: 100%;
    align-items: center;
    padding: 35px 30px;
    border: 1px solid #ddd;
    border-top: 2px solid #0b5e9d;
}

.icon-wrap .item > h5:last-child {
    margin-bottom: 0;
}

.icon-wrap .item li {
    font-size: 15px;
    color: #555;
}

.icon-wrap .item h5 {
    margin-top: 10px;
    margin-bottom: 30px;
    line-height: 1.35;
    letter-spacing: -0.015em;
}

.icon-wrap .item p {
    font-size: 15px;
}

.icon-wrap:not(.type02) .item span + p {
    margin-top: 15px;
}

.icon-wrap:not(.type02) .item span + p {
    /* margin-top: 12px; */
    /* line-height: 1.3; */
    /* font-weight: 600; */
    /* color: #005393; */
}

.icon-wrap.border-none .item {
    border: 0;
    padding: 0 !important;
}

.icon-wrap .item span.material-symbols-outlined {
    font-variation-settings: var(--gms500_Out);
    font-size: 60px;
    color: #005393;
}

.icon-wrap .col-sm-12 span.material-symbols-outlined {
    position: absolute;
    left: 65px;
    top: 50%;
    transform: translateY(-50%);
    background: #0b5e9d;
    color: #fff;
    border-radius: 50%;
    padding: 20px;
    font-size: 50px;
}

.icon-wrap .col-sm-12 .item {
    display: flex;
    padding-left: 210px;
    min-height: 110px;
    flex-flow: column;
    justify-content: start;
    align-items: start;
}

.icon-wrap.type02 .col-sm-12 .item {
    padding-left: 140px;
    justify-content: center;
}

.icon-wrap.type02 .col-sm-12 .item span.material-symbols-outlined {
    left: 40px;
    padding: 15px;
    font-size: 40px;
}

.icon-wrap .col-sm-12 .item h5 {
    margin: 0 0 10px;
}

.card-wrap {
    /* margin: 0 -10px; */
    margin: 0;
    align-items: stretch;
    align-content: stretch;
    gap: var(--cdGap);
    --cdGap: 20px;
}

.card-wrap > .col-sm-4 {
    width: calc((100% - var(--cdGap) * 2) / 3);
    background: #f5f5f5;
}

.card-wrap > .col-sm-3 {
    width: calc((100% - var(--cdGap) * 3) / 4);
    background: #f5f5f5;
}

.card-wrap > div {
    /* padding: 0 10px; */
    padding: 0;
}

.card-wrap .item h5 {
    background: #0b5e9d;
    padding: 10px 20px;
    font-weight: 500;
    font-size: 18px;
    color: #fff;
    margin: 0;
    text-align: center;
}

.card-wrap .item {
    background: #f5f5f5;
}

.card-wrap .item > ul {
    margin-top: 0 !important;
    padding: 25px 25px 25px;
    background: #f5f5f5;
}

.card-wrap .item > ul > li {
    font-size: 15px;
}

.card-wrap .item > ul > li li::before {
    content: "";
    width: 3px;
    height: 3px;
    background: #666;
    position: absolute;
    left: 0;
    top: 8px;
}

.card-wrap .item > ul > li li {
    padding-left: 10px;
    font-size: 87%;
    opacity: 0.88;
}

.card-wrap .item > ul > li > ul {
    margin-top: 5px;
}

.card-wrap .item > ul {
    margin-top: 6px;
}

/* table */
.table-wrap .table-logo {
    margin: 0 auto;
    filter: invert(1);
    height: 45px;
}

#bs06_01 .se12 .table-wrap img {
    mix-blend-mode: multiply;
}

.table-wrap .item table h5 {
    text-align: center;
    font-size: 18px;
}

.table-wrap .item table img + h5 {
    margin-top: 13px;
}

.table-wrap .item table img + h5 + img {
    margin-top: 40px;
}

.table-wrap table {
    margin-bottom: 0 !important;
}

.table-wrap table :is(tbody, thead) :is(th, td) {
    border-bottom: 1px solid #e3e3e3;
    border-color: #e3e3e3;
    padding: 12px 16px;
    font-size: 15px;
    vertical-align: middle;
}

.table-wrap table :is(tbody, thead) tr th:first-child,
.table-wrap table :is(tbody, thead) tr td:first-child {
    border-left: none;
}

.table-wrap table :is(tbody, thead) :is(td) {
    color: #555;
}

.table-wrap table thead th {
    /* border: 0; */
    border-bottom: 1px solid #ddd;
    font-weight: 700;
    background: #f7f7f7;
    color: #333;
}

.table-wrap table tbody th {
    font-weight: 500;
}

.table-wrap table .tableizer-firstrow th {
    text-align: center;
    font-size: 18px;
    padding: 15px;
}

.table-wrap .table-style {
    border: none;
    border-right: 2px solid #fff;
    border-top: 2px solid #0b5e9d;
    border-bottom: 2px solid #ccc;
}

.table-caption {
    background: #f7f7f7;
    padding: 30px;
}

.contact-wrap {
    margin: 0;
}

.contact-wrap > .col-sm-3 {
    width: 30%;
}

.contact-wrap > .col-sm-9 {
    width: 70%;
}

.contact-wrap > div {
    padding: 0;
}

/* map */
:where(.root_daum_roughmap, .root_daum_roughmap .wrap_map, .map-google iframe) {
    width: 100% !important;
    height: 500px !important;
    padding: 0 !important;
}

iframe[src^="https://www.google.com/"]
{
    background-color: #e5e3df;
    margin-bottom: -6px;
}

.contact-wrap .item {
    padding: 35px 29px 35px 27px;
    /* padding: 35px 40px 35px 37px; */
    height: 100%;
    background: #03447c;
    color: #fff;
}

.contact-wrap .item h5 {
    color: #fff;
    font-size: 30px;
    margin: 15px 0 35px !important;
}

.contact-wrap .item h5::after {
    content: "";
    /* width: 40px; */
    /* height: 1px; */
    background: #fff;
    display: block;
    margin-top: 10px;
    opacity: 0.4;
}

.contact-wrap .item h5::after {
}

.contact-wrap h5 {
    margin-bottom: 20px !important;
}

.contact-wrap ul {
    margin-top: 48px;
}

.contact-wrap li {
    color: #fff;
    font-size: 15px;
    font-weight: 300;
    padding-left: 30px;
    letter-spacing: 0;
}

.contact-wrap li + li {
    margin-top: 30px;
}

.contact-wrap li.tel {
    margin-left: auto;
    margin-right: 30px;
}

.contact-wrap li strong {
    display: flex;
    margin-bottom: 4px;
    font-size: 14px;
    letter-spacing: 0;
    margin-left: -30px;
    font-weight: 500;
    color: #c6e7ff;
}

.contact-wrap span.material-symbols-outlined {
    top: -1px;
    font-variation-settings: var(--gms300_Out);
    font-size: 22px;
    margin-right: 8px;
    color: #90cfff;
}

/* =================================== board, bbs =================================== */
.filter-items {
    display: flex;
    gap: 0 8px;
    padding: 0;
    margin: -30px 0 50px;
    justify-content: center;
    display: none;
}

.filter-items .filter-label {
    color: #333;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 45px;
    margin: 0;
    padding: 5px 25px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 500;
    border: 1px solid #ddd;
    background: #fff;
}

.filter-items a {
    margin: 0;
}

.filter-items a.on .filter-label,
.filter-label:hover,
.filter-label:focus {
    background: #fff;
    border: 1px solid #0b5e9d;
    color: #0b5e9d;
}

.bbs-area h4 {
    font-weight: 500;
    padding: 0;
    color: #222;
    font-size: 28px;
}

.bbs-area h4::before,
.bbs-area h4::after {
    content: none !important;
}

.bbs-area h4.title {
    text-align: center;
}

.bbs-area .reply_wrap h4 {
    text-align: left;
}

.bbs-area .search_wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 0;
}

.bbs-area .search_wrap > * + * {
    margin-left: 5px;
}

.board_wrapper .text-center .btn.btn-lg,
.board_wrapper .text-center .btn + .btn {
    min-width: 200px;
}

.btn {
    height: 40px;
    padding: 10px 14px;
    font-size: 15px;
    border-radius: 0;
}

.btn.btn-primary {
    background-color: #0b5e9d;
    border: 1px solid #0b5e9d;
    color: #fff;
    font-size: 14px;
    border-radius: 0;
}

.btn.btn-primary:hover,
.btn.btn-primary:focus {
    background-color: #004b85;
    border-color: #004b85;
}

.form-control {
    height: 40px;
    box-shadow: none;
}

.pagination > li > a,
.pagination > li > span {
    color: #333;
    border-radius: 0 !important;
    border-color: #d6d6d6;
    margin: 0 2px;
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover {
    color: #333;
    border-color: #d6d6d6;
}

.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    background: #0b5e9d;
    border-color: #0b5e9d;
    color: #fff;
}

/* member */
.member_wrapper {
    max-width: 1140px;
    margin: 0 auto;
}

.member_wrapper h1 {
    margin-top: 0;
}

.member_wrapper .btn {
    transition: all ease 0.3s;
}

.member_wrapper .table tbody tr th {
    background-color: rgba(0, 0, 0, 0.03);
}

.member_wrapper .table tbody tr th span {
    color: #5dae57;
}

.table.table_default tbody tr th.num {
    font-weight: normal;
}

.table.table_default tbody .subject a {
    font-size: 17px;
    color: #333;
}

.table.table_default tr th,
.table.table_default tr td {
    font-size: 15px;
    border-bottom: 1px solid #ddd;
}

.table.table_default thead th {
    background: #fff;
    border-bottom: 1px solid #ccc;
    font-weight: 500;
}

.table_default {
    border-top: 1px solid #333;
}

.table.table_default tr td {
    color: #777;
}

.text-muted {
    font-size: 14px !important;
    margin-top: 8px !important;
}

input.form-control {
}

/* wrapper */

.dh-board > .table-hover > tbody > tr:hover {
    background: #fff;
}

.dh-board > .table-hover {
    border-top: 2px solid #0b5e9d;
    border-bottom-color: #ccc;
    margin: 0;
}

.dh-board > .table-hover thead .col-xs-2,
.dh-board > .table-hover thead .col-xs-1 {
    width: 10%;
}

.dh-board > .table-hover thead .col-xs-5 {
    width: 70%;
}

.dh-board table tr th,
.dh-board table tr td {
    padding: 18px 3px;
    border-bottom: 1px solid #e3e3e3;
}

.dh-board table thead tr th {
    font-size: 16px;
    font-weight: 500;
    background: #f6f6f6;
    color: #000;
    line-height: 1;
}

.dh-board table tbody tr td {
    font-size: 15px;
    color: #777;
}

.dh-board table tbody tr td.subject strong a {
    font-size: 16px;
    letter-spacing: -0.02em;
    font-weight: 500;
}

.dh-board table tbody tr td.subject strong a:hover {
    text-decoration: underline;
    text-underline-position: under;
    color: #0b5e9d;
}

.bbs-blog2-index-layout .dh-board {
    margin: 0 -15px;
}

.bbs-blog2-index-layout .dhb-txt-box-type-b {
    width: 33.3333%;
    background: transparent;
    padding: 0 15px;
    border: 0;
    margin-bottom: 80px;
}

.bbs-blog2-index-layout .dhb-txt-box-type-b > .row {
    margin: 0;
}

.bbs-blog2-index-layout .dhb-txt-box-type-b > .row > div {
    padding: 0;
}

.dhb-txt-box-type-b-text-layout h4 {
    text-align: center;
    margin: 20px 0 10px;
    font-size: 20px;
    font-weight: 500;
}

.dhb-txt-box-type-b-text-layout h4 strong {
    font-weight: 500;
    letter-spacing: -0.034em;
}

.thumb-hidden > a > img {
    position: relative;
    transform: translateY(-50%);
    top: 50%;
}

.dhb-txt-box-type-b-img-layout .thumb-hidden {
    height: 200px;
    max-height: inherit;
    padding: 0;
    border: 0;
    box-shadow: none;
}

.dhb-txt-box-type-b-text-layout .txt-box-footer {
    display: flex;
    justify-content: center;
    width: 100%;
    float: inherit;
    text-align: center;
    margin-top: 0;
}

.dhb-txt-box-type-b-text-layout .txt-box-footer,
.dhb-txt-box-type-b-text-layout .txt-box-footer .hits {
    font-size: 14px !important;
    color: #666 !important;
    font-weight: 400;
}

.dhb-txt-box-type-b-text-layout .txt-box-footer br {
    display: none;
}

.dhb-txt-box-type-b-text-layout .txt-box-footer em {
    display: none;
}

.dhb-txt-box-type-b-text-layout .txt-box-footer > * {
    margin-right: 10px;
}

.dhb-txt-box-type-b-text-layout .txt-box-footer > *:last-child {
    margin-right: 0;
}

.dh-margin-top {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    margin-top: 60px;
}

.dh-margin-top .col-md-7 {
    width: 100%;
}

.dh-margin-top > * {
    width: auto;
}

.dh-margin-top > *:first-child {
    margin-top: 28px;
    order: 2;
}

.dh-margin-top > *:nth-child(2) {
    width: 45%;
    order: 1;
}

.dh-view-box {
    margin: 0;
}

.dh-view-box > .row:nth-child(2) > div:nth-child(3) {
    padding: 20px 0 60px !important;
}

.dh-view-box h4 {
    text-align: center;
    margin: 0;
    font-size: 30px;
    letter-spacing: -0.03em;
    font-weight: 600;
}

.dh-view-box > .row > .page-header {
    width: 100%;
    border-top: 2px solid #0b5e9d;
    border-bottom: none;
    margin: 0;
    padding: 45px 30px 0;
}

.dh-view-box > .row > .dh-view-info {
    padding: 15px 15px 50px;
    margin-bottom: 15px;
    text-align: center;
    background: #fff;
}

.dh-view-box > .row > .dh-view-info .pull-right {
    display: none;
}

.dh-view-box > .row > .dh-view-info > span {
    font-size: 13px;
    color: #777;
    padding: 0 10px 0;
}

.dh-view-box > .row > .dh-view-info > span > strong {
    color: #888;
}

.dh-view-box .dh-attach h6 b {
    font-size: 13px;
    color: #000;
}

.dh-view-box .dh-attach h6 {
    padding: 8px 5px;
}

.label-danger {
    transform: translateY(-3px);
}

.label {
    display: inline-flex;
    padding: 0;
    line-height: 0;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 16px;
    margin-left: 3px;
}

.form-horizontal {
    padding: 50px;
    background: #f4f4f4;
}

.form-horizontal h2 {
    text-align: center;
    margin-bottom: 35px;
    letter-spacing: -0.06em;
    font-size: 28px;
    color: #999;
    font-weight: 500;
}

.form-horizontal .form-group {
    display: flex;
    justify-content: center;
}

.form-horizontal .form-group .col-sm-2 {
    width: 120px;
}

.form-horizontal .col-sm-offset-2 {
    margin: 0;
}

.btn-group-lg > .btn,
.btn-lg {
    border-radius: 0;
    min-width: 150px;
    font-size: 16px;
    margin-top: 20px;
}

.checkbox label,
.radio label {
    font-size: 15px;
    letter-spacing: -0.06em;
}

.custom_checkbox + span a {
    font-weight: 500;
}

.privacy_body {
    font-size: 16px;
    line-height: 1.6em;
    padding: 0 100px;
}

.badge {
    padding: 6px 6px;
    border-radius: 2px;
    font-weight: 400;
    font-size: 13px;
    margin-right: 3px;
}

label.error,
.text-danger {
    margin-top: 7px;
    font-weight: 400;
    color: #e00000;
    font-size: 14px;
}

.btn-group-sm > .btn,
.btn-sm {
    font-size: 14px;
}

/* login */

.login-layout,
.id-find-layout,
.pw-find-layout {
    background: #f5f5f5;
    padding: 100px 15px;
}

.login-layout .panel,
.id-find-layout .panel,
.pw-find-layout .panel {
    box-shadow: none;
    max-width: 500px;
    padding: 80px 40px 80px;
    margin: 0 auto;
    border: 1px solid #ddd;
    border-radius: 0px;
}

.login-layout .panel hr,
.id-find-layout .panel hr,
.pw-find-layout .panel hr {
    display: none;
}

.login-layout .panel .panel-body,
.id-find-layout .panel .panel-body,
.pw-find-layout .panel .panel-body {
    padding: 0;
}

.login-layout .panel-body > div.col-sm-12,
.id-find-layout .panel-body > div.col-sm-12,
.pw-find-layout .panel-body > div.col-sm-12 {
    float: none;
}

.login-layout .panel-body > div.col-sm-12 h2,
.id-find-layout .panel-body > div.col-sm-12 h2,
.pw-find-layout .panel-body > div.col-sm-12 h2 {
    text-align: center;
    margin: 0 0 15px;
    line-height: 1;
    color: #222;
    font-size: 32px;
}

.inner-box-msg {
    width: 100%;
    text-align: center;
    float: none;
    margin-bottom: 30px;
    padding: 0;
}

.inner-box-msg p {
    font-size: 14px;
    letter-spacing: -0.03em;
    color: #555;
    margin: 0;
}

.inner-box-form {
    width: 100%;
    float: none;
    margin: 0 auto;
    overflow: hidden;
    padding: 0;
}

.login-layout label,
.id-find-layout label,
.pw-find-layout label {
    font-size: 16px;
    letter-spacing: -0.03em;
    color: #222;
    font-weight: 500;
    margin: 0 0 10px;
    line-height: 1;
}

.login-layout .form-control,
.id-find-layout .form-control,
.pw-find-layout .form-control {
    box-shadow: none;
    border-radius: 0px;
    border: 1px solid #ddd;
    height: 40px;
    color: #555;
    font-size: 15px;
    letter-spacing: -0.03em;
}

.login-layout .form-control:focus,
.id-find-layout .form-control:focus,
.pw-find-layout .form-control:focus {
    border-color: #aaa;
}

.login-layout .btn-warning,
.id-find-layout .btn-warning,
.pw-find-layout .btn-warning {
    float: none;
    width: 100%;
    height: 50px;
    background: #184ba8;
    border-radius: 0px;
    border: none;
    font-size: 15px;
    letter-spacing: -0.03em;
    box-shadow: none;
    margin-top: 15px;
    transition: all ease 0.3s;
}

.login-layout .btn-warning:hover,
.id-find-layout .btn-warning:hover,
.pw-find-layout .btn-warning:hover {
    background: #0d52d2;
}

.login-layout form > div > p,
.id-find-layout form > div > p,
.pw-find-layout form > div > p {
    width: 50%;
    margin: 0;
    float: left;
    text-align: center;
    line-height: 1;
}

.login-layout form > div > p + p,
.id-find-layout form > div > p + p,
.pw-find-layout form > div > p + p {
    border-left: 1px solid #ccc;
}

.login-layout form > div > p > a,
.id-find-layout form > div > p > a,
.pw-find-layout form > div > p > a {
    font-size: 14px;
    color: #555;
    letter-spacing: -0.03em;
    display: block;
    padding: 2px 0;
}

@media (max-width: 768px) {
    .login-layout,
    .id-find-layout,
    .pw-find-layout {
        padding: 20px 15px;
    }

    .login-layout .panel,
    .id-find-layout .panel,
    .id-find-layout .panel {
        padding: 40px;
    }

    .login-layout .panel-body > div.col-sm-12 h2,
    .id-find-layout .panel-body > div.col-sm-12 h2,
    .pw-find-layout .panel-body > div.col-sm-12 h2 {
        font-size: 24px;
    }

    .inner-box-msg p {
        font-size: 12px;
    }

    .login-layout label,
    .id-find-layout label,
    .pw-find-layout label {
        font-size: 14px;
    }

    .login-layout .form-control,
    .id-find-layout .form-control,
    .pw-find-layout .form-control {
        font-size: 13px;
        height: 36px;
    }

    .login-layout form > div > p > a,
    .id-find-layout form > div > p > a,
    .pw-find-layout form > div > p > a {
        font-size: 12px;
    }

    .login-layout .btn-warning,
    .id-find-layout .btn-warning,
    .pw-find-layout .btn-warning {
        height: 45px;
        font-size: 14px;
        margin-top: 10px;
    }
}

/* =================================== mobile =================================== */
/* mainpage */
@media (max-width: 767px) {
    /* carousel */
    #mainCarousel .carousel-inner .item {
        height: 500px;
    }

    #mainCarousel .carousel-inner .item img {
        position: relative;
        max-width: 1000px;
        width: auto;
        aspect-ratio: 16/9;
        height: 100%;
        left: -60%;
    }

    .carousel-caption {
        left: 5%;
        right: 5%;
        top: 30%;
    }

    @keyframes fadeInLeft {
        0% {
            opacity: 0;
            width: 0;
        }

        100% {
            opacity: 1;
            width: 100%;
        }
    }

    .carousel-caption h1 {
    }

    .carousel-caption h1 strong {
        font-size: 28px;
    }
    .carousel-caption img {
        max-width: 250px;
    }

    .carousel-control {
        /* font-size: 14px; */
        display: none;
    }
    .carousel-indicators {
        left: 6%;
        right: 6%;
        margin-left: 0;
    }
    .carousel-indicators li,
    .carousel-indicators li.active {
        width: 60px !important;
        height: 7px !important;
    }

    .mainpage {
        margin-top: 0;
        background: #333;
    }

    .carousel-caption p {
        font-size: 20px;
    }

    .body-layout footer {
        padding-bottom: 120px;
    }
    .footer-login {
        margin-top: 20px;
        margin-left: 0;
    }
    #quick-menu {
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        transform: translateY(0);
    }

    #quick-menu ul {
        display: flex;
        border-radius: 0;
        padding-bottom: 7px;
    }

    #quick-menu ul li {
        flex: 1;
    }

    #quick-menu ul li a span:not([class]) {
        font-size: 12px;
    }

    #quick-menu ul li span.material-symbols-outlined {
        font-size: 24px;
    }
    #quick-menu ul li img {
        width: 22px;
    }
    #quick-menu ul li a {
        height: 75px;
    }
}

/* subpage */
@media (max-width: 767px) {
    .subpage-content {
        padding: 80px 0 100px;
    }
    .content-header {
        margin-bottom: 50px;
    }
    .content-header h2 {
        font-size: 42px;
    }
    .section-header {
        margin-bottom: -70px;
    }
    .subpage-header {
        height: 220px;
    }
    .subpage-header .subpage-title {
        padding-top: 10px;
        align-items: center;
    }
    .subpage-header .subpage-title h1 {
        font-size: 48px;
    }
    .subpage-content .se-title p {
        font-size: 16px;
    }
    .subpage :where(.section-wrap) {
        gap: 100px 0 !important;
    }
    .snb {
        border: 0;
    }

    .snb ul {
    }

    .snb li {
        margin: 0;
        flex: auto;
        width: 100%;
    }

    .snb li > a {
        display: inline-flex;
        line-height: 1;
        align-items: center;
        font-size: 14px;
        height: 60px;
    }

    .snb li.active a::after {
        bottom: 19px;
    }

    .breadcrumb {
        margin: 0;
        width: 100%;
        flex-wrap: wrap;
        justify-content: center;
        align-content: center;
        text-align: center;
        gap: 5px 20px;
        margin-bottom: 15px;
    }

    .subpage-content h3 {
        font-size: 32px;
    }

    .subpage-content h4 {
        font-size: 32px;
    }

    .subpage-content .se-title h4 {
        font-size: 26px;
    }
    .subpage-content .se-title h4 small {
        display: block;
        margin-left: 0;
        margin-top: 10px;
    }

    .subpage-content .item h5 {
        font-size: 28px;
    }

    .subpage-header .sub-title h2 {
        font-size: 44px;
    }
    .greet-wrap .slogan {
        padding-right: 15px;
    }
    .cert-wrap {
        margin: 0;
    }
    .greet-wrap .text-wrap {
        width: 100%;
        margin-top: 30px;
    }
    .history-wrap {
        display: flex;
        flex-direction: column-reverse;
        overflow-x: auto;
        /* box-shadow: inset -10px 0px 30px rgba(0, 0, 0, 0.3); */
    }
    .history-wrap .img-box {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 20px 30px;
        padding-right: 0;
    }
    .history-wrap .img-box .img-2010 {
        margin-top: 0;
        margin-left: 2000px;
    }
    .history-wrap .year-box {
        flex-wrap: nowrap;
        padding-left: 0;
        border-left: 0;
        margin-bottom: 20px;
    }
    .history-wrap .item {
        border-top: 1px solid #ccc;
        padding-top: 25px;
        padding-left: 30px;
        width: 250px;
        flex: none;
    }
    .history-wrap .item li {
        font-size: 14px;
    }
    .history-wrap .item h5::after {
        left: 0px;
        top: -35px;
    }
    .cert-wrap > div {
        width: 100%;
        min-width: 200px;
        padding: 0;
    }
    .cert-wrap img {
        width: 100%;
    }

    .snb_depth2 ul {
        flex-wrap: wrap;
        gap: 5px;
    }
    .snb_depth2 ul > li {
        flex: inherit;
        width: calc((100% - 5px) / 2);
        flex-grow: 1;
    }
    .snb_depth2 ul a {
        font-size: 14px;
        height: 55px;
        padding: 0 15px;
        border: 1px solid #d6d6d6 !important;
    }
    .snb_depth2 ul li + li a {
    }
    .subpage .snb_depth2 + h2 {
        font-size: 36px;
        margin-top: 50px;
    }
    .snb_depth3 ul {
        flex-wrap: wrap;
        gap: 10px;
    }
    .snb_depth3 ul a {
        font-size: 14px;
        height: 40px;
    }

    #bs01_01 .se-inova p {
        padding: 0 20px;
    }
    #bs01_01 .se01 {
        margin-top: 0;
    }
    .cate-wrap {
        flex-direction: column-reverse;
        padding-right: 0;
    }
    .cate-wrap .li-cate {
        flex: inherit;
        flex-wrap: wrap;
        margin-right: 0;
        gap: 10px;
        margin-top: 30px;
    }
    .cate-wrap .li-cate li {
        flex: inherit;
        width: calc((100% - 10px) / 2);
    }
    .app-wrap .item {
        width: calc((100% - 8px) / 2);
    }
    .app-wrap .item p {
        text-align: center;
        font-size: 15px;
        padding: 0 10px;
    }
    .dl-info.col-3 > div,
    .dl-info.col-6 > div {
        width: 100%;
    }
    .pd-wrap > div:nth-child(2) .item {
        padding-left: 5px;
        margin-top: 20px;
    }
    .icon-wrap > div {
        width: 100%;
    }
    .li-feat > li {
        width: calc((100% - 15px * 0) / 1);
    }
    #bs03_02 .pd-wrap {
        margin: 0;
    }
    #bs03_02 .pd-wrap > div {
        width: 50%;
    }
    #bs03_03 .subpage-content .se01 .se-title p {
        padding: 20px 40px 0px;
    }

    #bs01_04 .se01 .wrap-con {
        padding: 30px 20px 0;
    }
    #bs01_04 .se01 .box-icon {
        flex-wrap: wrap;
    }
    #bs01_04 .se01 .box-icon > .item {
        flex-basis: 50%;
    }
    #bs01_04 .se01 .box-icon > .item:nth-child(n + 3) {
        margin-top: 15px;
    }
    #bs01_04 .se01 .box-icon .tit {
        margin: 12px 0 0;
        font-size: 15px;
    }
    #bs01_04 .se01 .middle {
        margin: 30px 0;
    }
    #bs01_04 .se01 .middle p {
        font-size: 19px;
        letter-spacing: 1px;
        line-height: 1.4em;
    }
    #bs01_04 .se01 .middle p::before,
    #bs01_04 .se01 .middle p::after {
        display: none;
    }
    #bs01_04 .se01 .box-card-round {
        flex-wrap: wrap;
    }
    #bs01_04 .w_img {
        padding: 15px;
    }
    #bs01_04 .se03 .card-wrap .item h5 {
        padding: 10px 15px;
        font-size: 17px;
    }
    #bs01_04 .se03 ul.li-icon-hori > li {
        min-height: unset;
    }
    #bs01_04 .se05 p.img-bottom {
        margin: 20px 0 0 0;
        font-size: 15px;
    }
    .geehy-table-wrap > div:nth-child(1) {
        padding: 0 60px 30px;
    }
    .box-toolChain .right,
    .box-toolChain .inner + .inner {
        margin-top: 20px;
    }
    .box-toolChain .inner {
        padding: 30px 20px;
    }
    #bs01_04 .se06 .row,
    #bs01_04 .se07 .row,
    #bs01_04 .se08 .row {
        display: block;
    }
    #bs01_04 .se09 .box-toolChain .right .inner-left,
    #bs01_04 .se09 .box-toolChain .right .inner-right {
        width: 100% !important;
    }
    #bs01_04 .se09 .box-toolChain .right .inner-left > .row {
        display: block;
    }
    #bs01_04 .se09 .box-toolChain .right .inner-right {
        margin-top: 20px;
    }
    #bs01_04 .se09 .box-toolChain .right .inner-right-2 {
        margin-top: 15px;
    }

    .pd-wrap {
        gap: 15px 0;
    }
    .pd-wrap > div {
        width: 100%;
    }
    .li-img.col-3 > li {
        width: calc((100% - var(--liGap) * 1) / 2);
        padding: 5px 20px;
    }
    .partner-wrap > div {
        width: 100%;
    }
    .partner-wrap .img-box {
        justify-content: center;
    }
    .card-wrap > div {
        width: 100% !important;
    }
    .icon-wrap .col-sm-12 .item {
        min-height: auto;
        padding: 30px !important;
    }
    .icon-wrap .col-sm-12 span.material-symbols-outlined {
        position: static;
        transform: translateY(0);
        margin-bottom: 20px;
    }
    #bs06_01 .se04 .pd-wrap .item.bg {
        width: 100%;
        padding: 0 !important;
        aspect-ratio: 1;
    }
    .pd-wrap .item.bg h5 {
        margin-bottom: 20px;
    }
    #bs06_01 .se21 > .con-wrap {
        margin: 0 -15px;
    }
    #bs06_01 .se21 > .con-wrap > div {
        padding: 0 15px;
    }
    #bs06_01 .se21 .pd-wrap img {
        width: 100%;
    }
    .contact-wrap {
        flex-direction: column-reverse;
    }
    .contact-wrap > div {
        width: 100% !important;
    }
}

/* bbs, etc */
@media (max-width: 767px) {
    .filter-items {
        flex-wrap: wrap;
        gap: 5px;
    }

    .bbs-blog2-index-layout .dhb-txt-box-type-b {
        width: 100%;
        margin-bottom: 40px;
    }

    .dh-margin-top > *:nth-child(2) {
        width: calc(100% - 30px);
    }

    .dhb-txt-box-type-b-text-layout h4 {
        font-size: 24px !important;
    }

    .dh-view-box h4 {
        font-size: 20px !important;
    }
    .dh-view-box img {
        max-width: 100%;
    }
    .dh-board tr :is(.writer, .hits, .regdate) {
        display: none;
    }
}
