@charset "utf-8";

:root {
    --white:#FFFFFF;
    --black:#000000;
    --primary: #0071FF;
    --header-height: 120px;
    --header-bg-height:700px;
    --sec-padding: 180px;
}

/* 공통 */
img {max-width:100%}
p {line-height:1.5}
button {color:#000;cursor:pointer;background:transparent;border:none;outline:0}
.wrapper {width:100%;max-width:1480px;padding:0 40px;margin:0 auto}
.no_scroll {height:100%;overflow:hidden}
.only_mb {display:none}
.btn_wrap {display:flex;align-items:center;justify-content:center;gap:0 10px}
.sec {overflow:hidden}
.primary {color:var(--primary)}

.scroll_custom::-webkit-scrollbar {width:6px}
.scroll_custom::-webkit-scrollbar-thumb {background-clip:padding-box;background-color:rgba(0,0,0,.3)}
.scroll_custom::-webkit-scrollbar-track {background-color:rgba(0,0,0,.1)}

/* 헤더 */
.header {width:100%;position:fixed;top:0;left:0;z-index:9999}
.header .bg {width:100%;height:0;background:#F7F8FB;position:absolute;top:var(--header-height);left:0}

/* 기본 헤더 스타일 (h_index 클래스가 없는 일반 페이지용) */
.header .gnb>ul>li>a {color:#111111}
.header .my_side_menu .txt {color:#111111}
.header .my_side_menu .txt path {fill:#111111}
.header .my_side_menu .lang_btn .txt svg:first-child path {fill:none;stroke:#111111}
.header .menu_open path {fill:#111111}
.header .logo .gra {display:none}
.header .logo .default {display:block}

.header.h_index .gnb>ul>li>a {color:var(--white)}
.header.h_index .my_side_menu .txt {color:var(--white)}
.header.h_index .my_side_menu .txt path {fill:var(--white)}
.header.h_index .my_side_menu .lang_btn .txt svg:first-child path {fill:none;stroke:var(--white)}
.header.h_index .menu_open path {fill:var(--white)}
.header.h_index .logo .gra {display:block}
.header.h_index .logo .default {display:none}

.header.white {background:var(--white)}
.header.white .gnb>ul>li>a {color:#111111}
.header.white .my_side_menu .txt {color:#111111}
.header.white .my_side_menu .txt path {fill:#111111}
.header.white .my_side_menu .lang_btn .txt svg:first-child path {fill:none;stroke:#111111}
.header.white .menu_open path {fill:#111111}
.header.white .logo .gra {display:none}
.header.white .logo .default {display:block}

.header .wrapper {display:flex;align-items:center;max-width:1800px;height:var(--header-height)}
.header .logo {width:170px;position:relative;z-index:2}
.header .logo .gra {display:none}
.header .gnb {width:1100px;position:absolute;top:0;left:50%;transform:translateX(-50%)}
.header .gnb>ul {display:flex}
.header .gnb li {width:100%;position:relative}
.header .gnb>ul>li {display:flex;flex-direction:column}
.header .gnb>ul>li > a::before {content:'';display:block;width:0;height:1px;background:var(--primary);position:absolute;bottom:0;left:50%;transition:all .4s}
.header .gnb>ul>li>a {display:flex;align-items:center;justify-content:center;height:var(--header-height);font-size:20px;font-weight:600;color:#111111;transition:all .2s;text-transform:capitalize;position:relative;transition:all .2s}
.header .gnb .depth_02 {flex:1;display:none;width:100%;padding:23px 0;z-index:4;border-right:solid 1px #DDDDDD;font-size:16px;transition:all .2s}
.header .gnb .depth_02 > div + div {margin-top:10px}
.header .gnb .depth_02 ul li a {display:flex;align-items:center;padding:10px 20px;color:#414141;transition:all .2s}
.header .gnb .depth_02 ul li a:hover {color:var(--primary)}
.header .gnb .depth_02 .sub_tit {display:block;;font-weight:600;color:#111111;padding:10px 20px 0;margin-bottom:7px}
.header .menu_open {display:none}
.my_side_menu .lang_btn button.txt.open + .opt_box {display:block}

.my_side_menu {display:flex;align-items:center;margin-left:auto}
.my_side_menu > * {position:relative;display:flex;align-items:center}
.my_side_menu > * + *::before {content:'';display:block;width:1px;height:10px;background:#BEBEBE;margin:0 10px}
.my_side_menu > * + a.txt::before {margin-right:0}
.my_side_menu .txt {display:flex;align-items:center;gap:0 10px;font-size:18px;padding:10px 0;transition:all .2s;cursor:pointer}
.my_side_menu .txt path {transition:all .2s}
.my_side_menu .lang_btn .opt_box {display:none;position:absolute;top:100%;left:0;background:var(--white);border:solid 1px #DDDDDD;border-radius:10px;padding:10px 0;z-index:10001}
.my_side_menu .lang_btn .opt_box a {display:flex;align-items:center;min-width:100px;height:35px;padding:0 10px;font-size:16px;transition:all .2s}
.my_side_menu .my_page_menu .opt_box {display:none;position:absolute;top:100%;left:0;background:var(--white);border:solid 1px #DDDDDD;border-radius:10px;padding:10px 0;z-index:10001;min-width:180px}
.my_side_menu .my_page_menu .opt_box a {display:flex;align-items:center;width:100%;height:35px;padding:0 15px;font-size:16px;transition:all .2s;white-space:nowrap}
.my_side_menu .my_page_menu .opt_box a:hover {color:var(--primary)}

.side_menu {position:fixed;top:0;right:0;transform:translateX(100%);width:500px;max-width:100%;height:100%;background:var(--white);z-index:1000;overflow-y:auto;transition:all .5s}
.side_menu.fixed {transform:translate(0)}
.side_menu .head {position:sticky;top:0;left:0;width:100%;height:70px;display:flex;align-items:center;background:var(--primary);z-index:5}
.side_menu .menu_close {display:flex;align-items:center;justify-content:center;width:70px;height:70px;margin-left:auto}
.side_menu .my_side_menu {margin-left:24px}
.side_menu .my_side_menu .txt {gap:0 6px;color:var(--white);font-size:15px}
.side_menu .my_side_menu .txt svg {width:18px;height:18px}
.side_menu .my_side_menu .lang_btn .txt svg:last-child {width:9px}
.side_menu .my_side_menu > * + *::before {background:rgba(255,255,255,.3)}
.side_menu .gnb {padding:24px 0}
.side_menu .gnb>ul>li>button {display:flex;align-items:center;width:100%;height:54px;background:#F7F8FB;border-bottom:solid 1px var(--white);font-size:18px;font-weight:700;padding:0 20px;position:relative}
.side_menu .gnb>ul>li>button::after {content:'';display:block;width:16px;height:16px;background:url('../img/web/plus.svg') no-repeat center/100%;position:absolute;top:50%;right:20px;transform:translateY(-50%)}
.side_menu .gnb>ul>li>button.open {border-color:var(--primary)}
.side_menu .gnb>ul>li>button.open::after {background-image:url('../img/web/minus.svg')}
.side_menu .gnb .sub_tit {display:block;width:100%;font-size:15px;font-weight:700;padding:10px 30px}
.side_menu .depth_02 {padding:10px 0;display:none}
.side_menu .depth_02 > div + div {margin-top:10px}
.side_menu .depth_02 a {display:block;width:100%;font-size:14px;color:#414141;padding:10px 30px;position:relative}
.side_menu .depth_02 a::after {content:'';display:block;width:18px;height:18px;background:url('../img/web/arrow_right.svg') no-repeat center/100%;position:absolute;top:50%;right:20px;transform:translateY(-50%)}

.quick_menu {position:fixed;top:45%;right:0;transform:translateY(-50%);z-index:90}
.quick_menu .wrap {transform:translateX(162px);display:flex;align-items:flex-start;transition:all .5s}
.quick_menu .wrap.open {transform:translateX(0)}
.quick_menu .wrap.open .btn_menu_toggle svg {transform:none}
.quick_menu .btn_menu_toggle {display:flex;align-items:center;justify-content:center;width:60px;height:60px;background:var(--primary);border-radius:10px 0 0 10px}
.quick_menu .btn_menu_toggle svg {transform:rotate(180deg)}
.quick_menu .list {width:162px;background:var(--white);box-shadow:0 4px 14px rgba(0,0,0,.1)}
.quick_menu .list li + li {border-top:solid 1px #DDDDDD}
.quick_menu .list a {display:flex;align-items:center;gap:0 6px;width:100%;height:60px;padding:0 10px;font-size:14px;font-weight:500;transition:all .2s}
.quick_menu .list a img {width:40px;height:40px}
.quick_menu .list a:hover {background:#F0F7FF;color:var(--primary)}
.quick_menu .go_youtube {display:inline-flex;align-items:center;gap:0 10px;height:40px;background:#FF0000;border-radius:50px;padding:0 20px;font-size:14px;font-weight:600;color:var(--white);margin:20px 0 0 60px;transition:all .2s}
.quick_menu .go_youtube:hover {transform:translateX(5px)}

/* 푸터 */
.ft_swiper {padding:24px 0;border-top:solid 1px #E8E8E8}
.ft_swiper .swiper-wrapper {-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important}
.ft_swiper .swiper-slide {width:auto;padding:0 15px}
.ft_swiper .swiper-slide img {width:auto;max-width:initial;height:44px}

.footer {background:url('../img/web/ft_bg.jpg') no-repeat center/cover;padding:40px 0;color:var(--white)}
.footer * {word-break:keep-all !important}
.footer .top {display:flex;align-items:center;padding-bottom:30px;margin-bottom:30px;border-bottom:solid 1px rgba(255,255,255,.5)}
.footer .term_link {display:flex;align-items:center}
.footer .term_link a {font-size:16px;color:var(--white)}
.footer .term_link a:hover {text-decoration:underline}
.footer .term_link a:first-child {font-weight:700;display:flex;align-items:center}
.footer .term_link a:first-child::after {content:'';display:block;width:1px;height:13px;background:#5F5F5F;margin:0 20px}
.footer .family_site {margin:0 30px 0 auto;position:relative}
.footer .family_site > button {display:flex;align-items:center;justify-content:space-between;width:200px;height:50px;border:solid 1px #747474;font-size:16px;padding:0 16px;color:#A6A6A6}
.footer .family_site > button.on {background:var(--white);color:var(--black)}
.footer .family_site > button.on path {fill:var(--black)}
.footer .family_site > button.on svg {transform:rotate(180deg)}
.footer .family_site ul {display:none;background:var(--white);position:absolute;bottom:100%;left:0;width:100%;padding:5px 0;border:solid 1px #747474;border-bottom:0;max-height:200px;overflow-y:auto;z-index:5}
.footer .family_site ul li > * {display:flex;align-items:center;width:100%;height:40px;padding:0 16px;font-size:15px}
.footer .sns_link {display:flex;align-items:center;gap:10px}
.footer .sns_link a {display:flex;align-items:center;justify-content:center;width:50px;height:50px;background:#747474;border-radius:50px;transition:all .2s}
.footer .sns_link a:hover {background:#999}
.footer .bottom {display:flex;align-items:center;justify-content:space-between}
.footer .bottom > .copyright {display:none}
.footer .bottom .info .logo {display:block;width:215px}
.footer .bottom .info .email {display:block;font-size:20px;font-weight:600;margin:20px 0 10px}
.footer .bottom .info .number {font-size:18px;font-weight:500}
.footer .bottom .info .number strong {font-size:30px;font-weight:700;color:var(--primary);margin-right:10px}
.footer .bottom .info .copyright {font-size:16px;opacity:.5;margin-top:20px}
.footer .bottom .corp {display:flex;align-items:center;gap:0 20px}
.footer .bottom .corp img {width:auto;max-width:initial;height:60px}
.footer .bottom .corp div:last-child img {height:48px}

@media (hover: hover) {
    .header .gnb>ul>li:hover > a::before {width:100%;left:0}
    .header .gnb>ul>li:hover .depth_02 {background:var(--white)}

    /* h_index 클래스가 있는 헤더에서는 메뉴 호버 시 전체 헤더 텍스트가 검은색으로 변경 */
    .header.h_index .gnb:hover ul li a {color:#111111}
    .header.h_index .gnb:hover ~ .my_side_menu .txt {color:#111111}
    .header.h_index .gnb:hover ~ .my_side_menu .txt path {fill:#111111}
    .header.h_index .gnb:hover ~ .my_side_menu .lang_btn .txt svg:first-child path {fill:none;stroke:#111111}

    .my_side_menu .txt:hover {color:var(--primary)}
    .my_side_menu .txt:hover path {fill:var(--primary)}
    .my_side_menu .lang_btn .opt_box a:hover {color:var(--primary)}
    .my_side_menu .lang_btn:hover .opt_box {display:block}
    .my_side_menu .lang_btn .txt:hover svg:first-child path {fill:none;stroke:var(--primary)}
    .my_side_menu .my_page_menu:hover .opt_box {display:block}
}

@media all and (max-width: 1739px) {
    .header .gnb {width:920px}
}

@media all and (max-width: 1559px) {
    :root {
        --header-height: 80px;
    }
    .header .gnb {width:860px;left:46%}
    .header .gnb .depth_02 {font-size:15px}
    .header .gnb .depth_02 ul li a {padding:8px 16px}
    .header .gnb .depth_02 .sub_tit {padding:10px 16px 0}
    .header .logo {width:140px}
    .my_side_menu .txt {font-size:16px}
    .header .gnb>ul>li>a {font-size:18px}
    .header .gnb .depth_02 {padding:10px 0}
}

@media all and (max-width: 1399px) {
    .header .gnb {display:none}
    .header .wrapper {padding:0 0 0 20px}
    .header .menu_open {display:flex;align-items:center;justify-content:center;width:var(--header-height);height:var(--header-height);margin-left:auto}
    .header .my_side_menu {display:none}
}

@media all and (max-width: 1199px) {
    :root {
        --header-height: 70px;
        --sec-padding: 120px;
    }
    /* 헤더 */
    .header .logo {width:100px}
    .my_side_menu > * + a.txt::before {margin-right:4px}
    .header .menu_open {display:flex;align-items:center;justify-content:center;width:var(--header-height);height:var(--header-height)}
}

@media all and (max-width: 1023px) {
    .wrapper {padding:0 20px}
    .quick_menu {display:none}

    .footer .top {flex-wrap:wrap;gap:16px;padding-bottom:20px;margin-bottom:20px}
    .footer .term_link {width:100%}
    .footer .term_link a {font-size:14px}
    .footer .family_site {margin:0 auto 0 0}
    .footer .family_site > button {width:150px;height:40px;font-size:14px}
    .footer .family_site ul li > * {font-size:14px;;height:36px}
    .footer .sns_link a {width:40px;height:40px}
    .footer .sns_link a img {width:20px}
    .footer .bottom {display:block}
    .footer .bottom .info .logo {width:124px}
    .footer .bottom .info .email {margin:18px 0 8px;font-size:18px}
    .footer .bottom .info .number {font-size:16px}
    .footer .bottom .info .number strong {font-size:20px;display:block;margin-bottom:8px}
    .footer .bottom .info .copyright {display:none}
    .footer .bottom > .copyright {display:block;font-size:13px;opacity:.5}
    .footer .bottom .corp {margin:20px 0}
    .footer .bottom .corp img {height:auto !important;width:100%;max-width:130px}
}

@media all and (max-width: 767px) {
    :root {
        --sec-padding: 80px;
    }
    .only_mb {display:block}
    .only_pc {display:none}

    .ft_swiper .swiper-slide {padding:0 10px}
    .ft_swiper .swiper-slide img {height:40px}
}

@media all and (max-width: 399px) {
    .side_menu .my_side_menu {margin-left:16px}
    .my_side_menu .txt {gap:0 4px}
    .my_side_menu .txt svg {width:16px;height:16px}
    .my_side_menu .lang_btn .txt svg:last-child {width:9px;margin-left:4px}
}


/* 인덱스 */
.title_box {margin-bottom:50px}
.title_box.center {text-align:center}
.title_box .tit {font-size:40px;font-weight:700;line-height:1.4}
.title_box p {font-size:18px;color:#444444;margin-top:24px;word-break:keep-all}
.title_box p + p {margin-top:14px}

.index {overflow-x:hidden}
.index * {word-break:keep-all}
.index .sec_01 {position:relative}
.index .sec_01 .swiper-slide {position:relative}
.index .sec_01 .img_wrap {height:1040px}
.index .sec_01 .img_wrap img {width:100%;height:100%;object-fit:cover;animation:imgScaleUp 5s ease-in-out alternate both infinite}
.index .sec_01 .txt_wrap {position:absolute;bottom:474px;left:0;width:100%;z-index:1;color:var(--white);text-align:center}
.index .sec_01 .txt_wrap .tit {display:block;font-size:60px;font-weight:700;line-height:1.4}
.index .sec_01 .txt_wrap p {font-size:24px;margin-top:30px}
.index .sec_01 .swiper-pagination {bottom:100px !important}
.index .sec_01 .swiper-pagination-bullet {background:var(--white)}
.index .sec_01 .search_box {display:flex;align-items:center;width:calc(100% - 40px);max-width:800px;height:80px;background:var(--white);border-radius:40px;overflow:hidden;position:absolute;bottom:324px;left:50%;transform:translateX(-50%);z-index:3}
.index .sec_01 .search_box input {flex:1;height:100%;padding-left:50px;font-size:20px}
.index .sec_01 .search_box button {width:80px;height:80px}
@keyframes imgScaleUp {
    from {transform:scale(1)}
    to {transform:scale(1.05)}
}

.index .sec_02 {padding-top:var(--sec-padding)}
.index .sec_02 .img_wrap {height:550px}
.index .sec_02 .img_wrap img {width:100%;height:100%;object-fit:cover}

.index .sec_03 .wrapper {display:flex;padding:0;max-width:initial}
.index .sec_03 .wrapper > div {width:50%}
.index .sec_03 .title_box {display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0 40px 0 100px;margin:0}
.index .sec_03 .title_box .inner {max-width:644px}
.index .sec_03 .title_box p {max-width:580px}

.index .sec_04 {background:url('../img/web/index_04_bg.jpg') no-repeat center/cover;padding:var(--sec-padding) 0}
.index .sec_04 .title_box {color:var(--white)}
.index .sec_04 .cont {margin-top:70px}
.index .sec_04 .map {width:80%;max-width:400px;margin:0 auto;position:relative}
.index .sec_04 .map .bg img {width:100%}
.index .sec_04 .item {position:absolute;z-index:3}
.index .sec_04 .item .layer_open {display:flex;align-items:center;justify-content:center;background:#122F51;border:solid 1px var(--primary);border-radius:50px;padding:9px 16px;color:var(--white);font-size:14px;font-weight:500;position:relative;z-index:3;transition:all .2s;white-space:nowrap}
.index .sec_04 .item .layer_open::before {content:'';display:block;width:10px;height:10px;background:var(--primary);border-radius:30px;position:absolute;top:50%;right:calc(100% + 6px);transform:translateY(-50%);transition:all .2s}
.index .sec_04 .layer_open.open {border-color:var(--white) !important;background:var(--primary)}
.index .sec_04 .layer_open:hover::before,
.index .sec_04 .layer_open.open::before {width:12px;height:12px;background:var(--white) !important;border:solid 3px var(--primary);box-shadow:0 0 10px rgba(255,255,255,.3)}
.index .sec_04 .layer_open.open + .layer {opacity:1;visibility:visible;transform:translateX(0) !important}
.index .sec_04 .layer_open.orange {border-color:#F54731}
.index .sec_04 .layer_open.orange::before {background:#F54731}
.index .sec_04 .layer_open.orange.open {background:#F54731}
.index .sec_04 .layer_open.orange:hover::before,
.index .sec_04 .layer_open.orange.open::before {border-color:#F54731}
.index .sec_04 .layer_open.orange + .layer .head {background:#F54731}
.index .sec_04 .layer_open.yellow {border-color:#F1C40F}
.index .sec_04 .layer_open.yellow::before {background:#F1C40F}
.index .sec_04 .layer_open.yellow.open {background:#F1C40F}
.index .sec_04 .layer_open.yellow:hover::before,
.index .sec_04 .layer_open.yellow.open::before {border-color:#F1C40F}
.index .sec_04 .layer_open.yellow + .layer .head {background:#F1C40F}
.index .sec_04 .layer {width:220px;position:absolute;top:-3px;left:220px;z-index:1;opacity:0;visibility:hidden;transform:translateX(20px);transition:all .5s}
.index .sec_04 .layer::before {content:'';display:block;width:80%;height:1px;background:var(--white);position:absolute;top:20px;right:100%}
.index .sec_04 .layer .head {display:flex;align-items:center;justify-content:space-between;border:solid 1px var(--white);border-radius:10px;height:40px;padding-left:18px;background:#004393}
.index .sec_04 .layer:has(.center_list:not(:empty)) .head {border-bottom:0;border-radius:10px 10px 0 0}
.index .sec_04 .layer .head button {font-size:16px;font-weight:700;color:var(--white)}
.index .sec_04 .layer .head button:hover {text-decoration:underline}
.index .sec_04 .layer_close {display:flex;align-items:center;justify-content:center;width:40px;height:40px}
.index .sec_04 .layer .center_list {max-height:220px;background:var(--white);border:solid 1px var(--white);border-radius:0 0 10px 10px;overflow:hidden auto}
.index .sec_04 .layer .center_list > * {display:flex;align-items:center;width:100%;padding:10px 10px 10px 20px;border-bottom:solid 1px #DDDDDD;font-size:15px;font-weight:500;text-align:left;word-break:break-all;transition:all .2s}
.index .sec_04 .layer .center_list > *:hover {background:#dfeeff}
.index .sec_04 .layer .center_list > *::before {content:'·';display:block;font-weight:700;margin-right:8px}

.index .sec_04 .item_01 {top:2%;left:38%}
.index .sec_04 .item_01 .layer_open::before {right:auto;left:50%;;top:calc(100% + 6px);transform:translateX(-50%)}
.index .sec_04 .item_01 .layer {left:300px}
.index .sec_04 .item_01 .layer::before {width:127%}
.index .sec_04 .item_02 {top:10.5%;left:59%}
.index .sec_04 .item_03 {top:17%;left:58.5%}
.index .sec_04 .item_04 {top:24%;left:64%}
.index .sec_04 .item_05 {top:32.5%;left:72.5%}
.index .sec_04 .item_06 {top:42%;left:63%}
.index .sec_04 .item_07 {top:50%;left:67%}
.index .sec_04 .item_07 .layer,
.index .sec_04 .item_08 .layer,
.index .sec_04 .item_09 .layer,
.index .sec_04 .item_10 .layer,
.index .sec_04 .item_11 .layer {top:auto;bottom:-3px}
.index .sec_04 .item_07 .layer::before,
.index .sec_04 .item_08 .layer::before,
.index .sec_04 .item_09 .layer::before,
.index .sec_04 .item_10 .layer::before,
.index .sec_04 .item_11 .layer::before {top:auto;bottom:20px}
.index .sec_04 .item_08 {top:58%;left:67%}
.index .sec_04 .item_09 {top:66.5%;left:66%}
.index .sec_04 .item_10 {top:65%;right:74%}
.index .sec_04 .item_11 {top:51%;right:75%}
.index .sec_04 .item_12 {top:38%;right:76%}
.index .sec_04 .item_13 {top:30%;right:70%}
.index .sec_04 .item_14 {top:23%;right:68%}
.index .sec_04 .item_15 {top:15%;right:77%}
.index .sec_04 .item:nth-child(n + 10) .layer_open::before {right:auto;left:calc(100% + 6px)}
.index .sec_04 .item:nth-child(n + 10) .layer {left:auto;right:220px;transform:translateX(-20px)}
.index .sec_04 .item:nth-child(n + 10) .layer::before {right:auto;left:100%}

.iframe_wrap {width:100%;height:0;padding-bottom:56.25%;position:relative}
.iframe_wrap iframe {display:block;width:100%;height:100%;object-fit:cover;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}
.index .sec_05 {padding:var(--sec-padding) 0}
.index .sec_05 .video_wrap {padding:80px 0;background:#E5F1FF}
.index .sec_05 .video_wrap .wrapper {max-width:928px}
.index .sec_05 .list {margin-top:80px}
.index .sec_05 .list .wrapper {display:flex;gap:10px}
.index .sec_05 .list .item {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;background:url('../img/web/index_05_01.jpg') no-repeat center/cover;padding:40px 30px;color:var(--white);text-align:center}
.index .sec_05 .list .item .tit {display:block;font-size:20px;font-weight:700;line-height:1.4}
.index .sec_05 .list .item p {font-size:16px}
.index .sec_05 .list .item_02 {background-image:url('../img/web/index_05_02.jpg')}
.index .sec_05 .list .item_03 {background-image:url('../img/web/index_05_03.jpg')}
.index .sec_05 .list .item_04 {background-image:url('../img/web/index_05_04.jpg')}
.index .sec_05 .list .item_05 {background-image:url('../img/web/index_05_05.jpg')}

.index .sec_06 {padding:var(--sec-padding) 0;background:#F8F8F8}
.index .sec_06 .title_box {display:flex;align-items:center;justify-content:space-between}
.index .sec_06 .btn_more {display:flex;align-items:center;gap:0 10px;height:54px;background:var(--primary);padding:0 24px;font-size:18px;font-weight:600;color:var(--white);transition:all .2s}
.index .sec_06 .btn_more svg {transition:all .2s}
.index .sec_06 .btn_more:hover {background:#0068eb}
.index .sec_06 .btn_more:hover svg {transform:translateX(5px)}
.index .sec_06 .swiper {overflow:visible}
.index .sec_06 .swiper-slide {width:490px;padding:0 15px}
.index .sec_06 .swiper-slide .item {display:flex;flex-direction:column;align-items:flex-start;width:100%;min-height:373px;background:var(--white);border:solid 1px #DDDDDD;padding:60px 40px;position:relative}
.index .sec_06 .swiper-slide .item::after {content:'';display:block;width:60px;height:60px;background:url('../img/web/index_06_arrow.svg') no-repeat center/100%;position:absolute;bottom:43px;right:25px;transition:all .2s;opacity:0}
.index .sec_06 .swiper-slide .item .tit {font-size:24px;font-weight:700;line-height:1.4;text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;transition:all .2s;word-break:break-all}
.index .sec_06 .swiper-slide .item p {font-size:18px;color:#444444;margin:20px 0 auto 0;text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;word-break:break-all}
.index .sec_06 .swiper-slide .item .date {display:block;font-size:16px;color:#9F9F9F;margin-top:60px}
.index .sec_06 .swiper-slide-active .item {border-color:var(--primary);box-shadow:0 4px 30px rgba(0,0,0,.15)}
.index .sec_06 .swiper-slide-active .item::after {opacity:1}
.index .sec_06 .swiper-slide-active .item .tit {color:var(--primary)}
.index .sec_06 .swiper-scrollbar {margin-top:50px;position:initial;background:#D9D9D9}
.index .sec_06 .swiper-scrollbar-drag {background:var(--primary)}
.index .sec_06 .btn_wrap {display:none}

.index .sec_07 .top_sec {background:url('../img/web/index_07_bg.jpg') no-repeat center/cover;color:var(--white);padding:var(--sec-padding) 0}
.index .sec_07 .top_sec .list {display:grid;grid-template-columns:repeat(5, 1fr);gap:10px}
.index .sec_07 .top_sec .list .item {display:flex;flex-direction:column;align-items:center;justify-content:center;height:188px;border:solid 1px transparent;background:rgba(255,255,255,.15);backdrop-filter:blur(20px);padding:24px;font-size:20px;font-weight:500;color:var(--white);transition:all .2s;word-break:break-word}
.index .sec_07 .top_sec .list .item:hover {border-color:rgba(255,255,255,.5)}
.index .sec_07 .top_sec .list .item.active {color:var(--white);background:var(--primary)}
.index .sec_07 .top_sec .list .item.active:hover {border-color:var(--primary)}

.index .sec_07 .btm_sec {padding:var(--sec-padding) 0}
.index .sec_07 .btm_sec .sec_tit {display:block;font-size:30px;font-weight:700;color:var(--primary);line-height:1.4;margin-bottom:34px}
.index .sec_07 .btm_sec .list {display:grid;grid-template-columns:repeat(3, 1fr);gap:30px}
.index .sec_07 .btm_sec .list .item {display:flex;flex-direction:column;background:var(--white);box-shadow:0 2px 10px rgba(0,0,0,.1);text-align:left}
.index .sec_07 .btm_sec .list .item .img_wrap {flex-shrink:0;height:200px;overflow:hidden}
.index .sec_07 .btm_sec .list .item .img_wrap img {width:100%;height:100%;object-fit:cover}
.index .sec_07 .btm_sec .list .item .txt_wrap {flex:1;display:flex;flex-direction:column;padding:20px 16px 34px}
.index .sec_07 .btm_sec .list .item .txt_wrap .bank {display:block;font-size:20px;font-weight:700;line-height:1.4;min-height:56px}
.index .sec_07 .btm_sec .list .item .txt_wrap .info {margin-top:20px;font-size:16px;color:#7C7C7C;line-height:1.4}
.index .sec_07 .btm_sec .list .item .txt_wrap .info .tit {display:block;color:#044A88;font-weight:600;margin-bottom:3px}

.popup_wrap {display:none;position:fixed;top:0;left:0;z-index:9999;width:100%;height:100%;background:rgba(0,0,0,.5);padding:100px 20px}
.popup_bank {width:100%;max-width:800px;height:100%;background:var(--white);overflow-y:auto;margin:0 auto}
.popup_bank .head {display:flex;align-items:center;justify-content:space-between;width:100%;height:60px;background:var(--primary);padding-left:24px;position:sticky;top:0;left:0;z-index:6}
.popup_bank .head .tit {display:block;font-size:20px;font-weight:700;color:var(--white);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.popup_bank .head .pop_close {display:flex;align-items:center;justify-content:center;width:60px;height:60px}
.popup_bank .cont {padding:30px 24px}
.popup_bank .img_wrap img {width:100%}
.popup_bank .info {margin-top:15px;font-size:14px;color:#444444}
.popup_bank .info > div {display:flex;align-items:flex-start;line-height:1.4}
.popup_bank .info > div + div {margin-top:10px}
.popup_bank .info .tit {flex:96px 0 0;display:flex;align-items:center;gap:0 8px;font-weight:500}
.popup_bank .info .tit + span {padding:2px 0}
.popup_bank .info a {text-decoration:underline}
.popup_bank .sec_tit {font-size:20px;font-weight:700;margin-bottom:15px}
.popup_bank .intro {margin-top:40px}
.popup_bank table {table-layout:fixed;border-collapse:collapse;border-spacing:0;width:100%;font-size:17px}
.popup_bank table + table {margin-top:20px}
.popup_bank table th {width:156px;padding:20px 0;font-weight:600;background:#004393;color:var(--white);border:solid 1px var(--white)}
.popup_bank table td {font-size:16px;color:#444444;border:solid 1px #DDDDDD;padding:20px}
.popup_bank table.gray th {background:#F3F3F3;color:#111111;border-color:#DDDDDD}
.popup_bank table.gray tr:first-child th,
.popup_bank table.gray tr:first-child td {border-top-color:#004393}

@media (hover: hover) {
}

@media all and (max-width: 1599px) {
    .index .sec_03 .title_box {align-items:center;padding:0 40px}

    .index .sec_05 .list .wrapper {max-width:1080px;flex-wrap:wrap;justify-content:center}
    .index .sec_05 .list .item {width:320px}

    .index .sec_07 .wrapper {max-width:1000px}
    .index .sec_07 .top_sec .list {grid-template-columns:repeat(4, 1fr)}
}

@media all and (max-width: 1399px) {
    .index .sec_01 .img_wrap {height:900px}
    .index .sec_01 .txt_wrap {bottom:400px}
    .index .sec_01 .search_box {bottom:260px}
}

@media all and (max-width: 1299px) {
    .index .sec_03 .title_box p .only_pc {display:none}
}

@media all and (max-width: 1199px) {
    .title_box {margin-bottom:40px}
    .title_box .tit {font-size:32px}
    .title_box p {font-size:16px;margin-top:18px}

    .index .sec_01 .img_wrap {height:720px}
    .index .sec_01 .txt_wrap {bottom:300px}
    .index .sec_01 .txt_wrap .tit {font-size:45px}
    .index .sec_01 .txt_wrap p {font-size:20px;margin-top:20px}
    .index .sec_01 .search_box {height:60px;max-width:600px;bottom:200px}
    .index .sec_01 .search_box button {height:60px}
    .index .sec_01 .search_box input {font-size:16px;padding-left:35px}
    .index .sec_01 .swiper-pagination {bottom:40px !important}

    .index .sec_02 .img_wrap {height:380px}

    .index .sec_05 .video_wrap {padding:50px 0}

    .index .sec_06 .swiper-slide {width:400px}
    .index .sec_06 .swiper-slide .item {min-height:320px;padding:45px 32px}
    .index .sec_06 .swiper-slide .item .tit {font-size:20px}
    .index .sec_06 .swiper-slide .item p {font-size:17px;margin-top:16px}
    .index .sec_06 .swiper-slide .item .date {margin-top:40px}
    
    .index .sec_07 .wrapper {max-width:800px}
    .index .sec_07 .top_sec .list {grid-template-columns:repeat(3, 1fr)}
    .index .sec_07 .top_sec .list .item {font-size:17px;height:160px;padding:20px}
    .index .sec_07 .btm_sec .list {grid-template-columns:repeat(2, 1fr);gap:20px}
    .index .sec_07 .btm_sec .sec_tit {font-size:27px}
}

@media all and (max-width: 1023px) {
    .index .sec_03 .wrapper {flex-direction:column-reverse;max-width:540px}
    .index .sec_03 .wrapper > div {width:100%}
    .index .sec_03 .title_box {padding:var(--sec-padding) 20px 30px;text-align:center}

    .index .sec_04 .item.bg_open::after {content:'';display:block;width:100vw;height:100vh;background:rgba(0,0,0,.5);position:fixed;top:0;left:0;z-index:3}
    .index .sec_04 .item .layer_open {z-index:-1}
    .index .sec_04 .layer {position:fixed;left:50% !important;top:50% !important;right:auto !important;bottom:auto !important;transform:translate(-50%, -50%) !important;z-index:20}
    .index .sec_04 .layer_open.open + .layer {transform:translate(-50%, -50%) !important}
    .index .sec_04 .layer::before {display:none}
}

@media all and (max-width: 767px) {
    .title_box {margin-bottom:30px}
    .title_box .tit {font-size:24px}
    .title_box p {margin-top:12px}
    .title_box p + p {margin-top:10px}

    .index .sec_01 .img_wrap {height:560px}
    .index .sec_01 .txt_wrap {bottom:235px}
    .index .sec_01 .txt_wrap .tit {font-size:30px}
    .index .sec_01 .txt_wrap p {max-width:275px;font-size:16px;margin:12px auto 0}
    .index .sec_01 .search_box {max-width:335px;height:40px;bottom:165px}
    .index .sec_01 .search_box input {font-size:14px;padding-left:20px}
    .index .sec_01 .search_box button {width:60px;height:40px}
    .index .sec_01 .search_box button svg {width:18px}
    .index .sec_01 .swiper-pagination {display:none}

    .index .sec_02 .title_box p {max-width:500px;margin-left:auto;margin-right:auto}
    .index .sec_02 .img_wrap {height:300px}

    .index .sec_03 .wrapper {max-width:100%}

    .index .sec_04 .cont {margin-top:30px}
    .index .sec_04 .item .layer_open {font-size:12px;padding:6px 10px}
    .index .sec_04 .item .layer_open::before {width:8px;height:8px}
    .index .sec_04 .item_02{top:9%}
    .index .sec_04 .item_12 {top:43%;right:52%}
    .index .sec_04 .item_12 .layer_open::before {left:50% !important;transform:translateX(-50%);top:auto;bottom:calc(100% + 3px)}
    .index .sec_04 .item_13 {right:64%;top:31%}

    .index .sec_05 .video_wrap {padding:30px 0}
    .index .sec_05 .list {margin-top:70px}
    .index .sec_05 .list .item {width:calc((100% - 20px) / 2);padding:30px 20px}
    .index .sec_05 .list .item .tit {font-size:18px}

    .index .sec_06 .title_box {justify-content:center;text-align:center}
    .index .sec_06 .title_box .btn_more {display:none}
    .index .sec_06 .swiper-slide .item {min-height:244px;padding:30px 24px}
    .index .sec_06 .swiper-slide .item::after {display:none}
    .index .sec_06 .swiper-slide .item .tit {font-size:18px}
    .index .sec_06 .swiper-slide .item p {font-size:16px;margin-top:12px}
    .index .sec_06 .swiper-slide .item .date {margin-top:24px}
    .index .sec_06 .swiper-scrollbar {height:2px;margin-top:20px}
    .index .sec_06 .btn_wrap {display:flex;margin-top:40px}
    .index .sec_06 .btn_more {height:44px;font-size:17px;padding:0 16px}
    .index .sec_06 .btn_more svg {width:20px}
    
    .index .sec_07 .top_sec .list {grid-template-columns:repeat(2, 1fr)}
    .index .sec_07 .top_sec .list .item {font-size:15px;height:145px;padding:18px}
    .index .sec_07 .btm_sec .sec_tit {font-size:24px;text-align:center}
    .index .sec_07 .btm_sec .list .item .txt_wrap {padding:16px 16px 20px}
    .index .sec_07 .btm_sec .list .item .txt_wrap .bank {font-size:16px;min-height:45px}
    .index .sec_07 .btm_sec .list .item .txt_wrap .info {margin-top:12px;font-size:15px}

    .popup_wrap {padding:60px 20px}
    .popup_bank .head {height:48px;padding-left:18px}
    .popup_bank .head .tit {font-size:18px}
    .popup_bank .head .pop_close {width:48px;height:48px}
    .popup_bank .cont {padding:16px 12px}
    .popup_bank .info {font-size:14px}
    .popup_bank .intro {margin-top:30px}
    .popup_bank .sec_tit {font-size:16px}
    .popup_bank table {font-size:14px}
    .popup_bank table th {width:100px;padding:14px 10px;word-break:keep-all}
    .popup_bank table td {font-size:inherit;padding:12px}
}

@media all and (max-width: 499px) {
    .index .sec_04 .item_01 {top:0;left:36%}
    .index .sec_05 .list .item {width:100%}
    .index .sec_06 .swiper-slide {width:100%;padding:0 6px}
    .index .sec_07 .btm_sec .list {display:flex;flex-direction:column}
}
 
@media all and (max-width: 374px) {
    .index .sec_04 .item .layer_open {font-size:11px;padding:5px 8px}
}