@charset "UTF-8";
/* 회사소개 공통 변수*/
.icon_gmv { display: flex; background: url("/lib/img/common/icon_gmv.png") center center/cover no-repeat; }

.icon_press { display: flex; background: url("/lib/img/common/icon_press.png") center center/cover no-repeat; }

.icon_video { display: flex; background: url("/lib/img/common/icon_video.png") center center/cover no-repeat; }

.icon_more { display: flex; background: url("/lib/img/common/icon_more.svg") center center/cover no-repeat; }

.icon_more2 { display: flex; background: url("/lib/img/common/icon_modal.svg") center center/cover no-repeat; }

.icon_close { display: flex; background: url("/lib/img/common/icon_close.svg") center center/cover no-repeat; }

.icon_arr { display: flex; background: url("/lib/img/common/icon_arr.png") center center/cover no-repeat; }

.icon_prev { display: flex; background: url("/lib/img/common/icon_prev.svg") center center/cover no-repeat; }

.icon_next { display: flex; background: url("/lib/img/common/icon_next.svg") center center/cover no-repeat; }

.icon_color { display: flex; background: url("/lib/img/common/icon_color.png") center center/cover no-repeat; }

.icon_top { display: flex; background: url("/lib/img/common/icon_top.svg") center center/cover no-repeat; }

.icon_menu1 { display: flex; background: url("/lib/img/common/icon_menu1.png") center center/cover no-repeat; }

.icon_menu2 { display: flex; background: url("/lib/img/common/icon_menu2.png") center center/cover no-repeat; }

.icon_menu3 { display: flex; background: url("/lib/img/common/icon_menu3.png") center center/cover no-repeat; }

.icon_menu4 { display: flex; background: url("/lib/img/common/icon_menu4.png") center center/cover no-repeat; }

.icon_menu5 { display: flex; background: url("/lib/img/common/icon_menu5.png") center center/cover no-repeat; }

.icon_modal { display: flex; background: url("/lib/img/common/icon_modal.svg") center center/cover no-repeat; }

div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, textarea, button { font-family: "Pretendard"; box-sizing: border-box; }

table { border-collapse: collapse; }

button { background: inherit; border: none; box-shadow: none; border-radius: 0; padding: 0; overflow: visible; cursor: pointer; }

input { -webkit-appearance: none; -webkit-border-radius: 0; margin: 0; }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

img { vertical-align: middle; }

a, a:hover, a:active { text-decoration: none; color: #000; }

.inner { margin: 0 auto; width: 1620px; }

.sub_inner { margin: 0 auto; width: 1090px; }

.sub_visual { position: relative; display: flex; align-items: center; justify-content: center; height: 386px; }

.sub_visual h2 { font-family: 'Archivo_Expanded'; position: relative; font-size: 60px; font-weight: 700; color: #fff; z-index: 3; }

.sub_visual::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); z-index: 2; }

.sub_visual.company { background: url("/lib/img/company/visual_company.png") center center/cover no-repeat; }

.sub_visual.brand { background: url("/lib/img/brand/visual_brand.png") center center/cover no-repeat; }

.sub_visual.media { background: url("/lib/img/media/visual_media_new.png") center center/cover no-repeat; }
 
.sub_visual.recruit { background: url("/lib/img/recruit/visual_recruit.png") center center/cover no-repeat; }

.sub_visual.office { background: url("/lib/img/office/visual_office.png") center center/cover no-repeat; }

.sub_container { padding: 123px 0; }

.sub_txt { margin-bottom: 65px; }

.sub_txt h3 { margin-bottom: 40px; font-size: 40px; font-weight: 700; color: #000; }

.sub_txt strong { display: block; font-size: 20px; font-weight: 600; color: #000; }

.sub_txt p { font-size: 20px; font-weight: 500; color: #555; line-height: 1.5; }

.sub_txt strong + p { margin-top: 12px; }

.btn_box .inner { position: relative; }

.top_btn { display: none; position: fixed; width: 1680px; bottom: 450px; opacity: 0; border-radius: 100%; transition: all 0.5s ease; z-index: 9999; cursor: pointer; }

.top_btn a { position: absolute; right: 0; }

.top_btn i { width: 48px; height: 48px; }

.top_btn:hover { background: #e9ebec; }

.top_btn.show { display: block; opacity: 1; transform: translateY(0); }

@media screen and (max-width: 1740px) { .top_btn { display: none; } }

@media screen and (max-width: 1640px) { .inner { width: 100%; padding: 0 2.46914vw; } }

@media screen and (max-width: 1280px) { .sub_visual { height: 300px; }
  .sub_visual h2 { font-size: 8.54938vw; }
  .sub_container { padding: 11.7284vw 0 7.40741vw; }
  .sub_inner { padding: 0 3.08642vw; width: 100%; } }

@media screen and (max-width: 1080px) { .sub_visual.recruit { background: url("/lib/img/recruit/visual_recruit_m.png") center center/cover no-repeat; } }

@media screen and (max-width: 1024px) { .sub_visual h2 { display: flex; justify-content: center; max-width: 360px; line-height: 1.16; text-align: center; }
  .sub_txt { margin-bottom: 7.28395vw; }
  .sub_txt h3 { margin-bottom: 6.17284vw; font-size: 4.93827vw; }
  .sub_txt strong { font-size: 2.96296vw; }
  .sub_txt p { font-size: 2.96296vw; }
  .sub_txt strong + p { margin-top: 2.40741vw; } }

@media screen and (max-width: 768px) { .sub_inner { padding: 0 18px; }
  .sub_container { padding: 63px 0 40px; }
  .inner { padding: 0 18px; }
  .sub_visual h2 { font-size: 46px; }
  .sub_txt h3 { margin-bottom: 33px; font-size: 27px; }
  .sub_txt strong { font-size: 16px; }
  .sub_txt p { font-size: 16px; }
  .sub_txt strong + p { margin-top: 10px; } }

.header { position: sticky; top: 0; left: 0; width: 100%; background-color: #fff; z-index: 101; }

.header .container { height: 100px; display: flex; align-items: center; justify-content: space-between; }

.header .logo img { display: block; max-width: 100%; height: auto; object-fit: cover; }

.header .burger { position: relative; display: none; cursor: pointer; user-select: none; width: 27px; height: 27px; opacity: 0; visibility: hidden; background: transparent; }

.header .burger .line { position: absolute; display: block; left: 0; width: 100%; height: 2px; opacity: 1; border: none; outline: none; background: #000; }

.header .burger .line:nth-child(1) { top: 0px; }

.header .burger .line:nth-child(2) { top: 10px; }

.header .burger .line:nth-child(3) { top: 20px; }

.header .overlay { position: fixed; top: 0; left: 0; height: 100%; width: 100%; z-index: 9; opacity: 0; visibility: hidden; transition: all 0.35s ease-in-out; background-color: rgba(0, 0, 0, 0.65); }

.header .nav .nav_header { display: none; }

.header .nav ul { display: flex; }

.header .nav .menu { position: relative; margin-right: 77px; }

.header .nav .menu .link { cursor: pointer; font-size: 18px; font-weight: 500; color: #222; }

.header .nav .menu .link i { display: none; }

.header .nav .menu .submenu { position: absolute; display: flex; top: 33px; left: 0; border-radius: 40px; background-color: #000; opacity: 0; width: max-content; visibility: hidden; transform: translateY(5px); padding: 17px 28px 18px; transition: all 0.3s ease-in-out; }

.header .nav .menu .submenu li { margin-left: 25px; }

.header .nav .menu .submenu li:nth-of-type(1) { margin-left: 0; }

.header .nav .menu .submenu li a { font-size: 16px; font-weight: 500; color: #888; transition: all 0.3s ease-in-out; }

.header .nav .menu .submenu li a:hover { color: #fff; }

.header .nav .menu:hover .submenu { opacity: 1; visibility: visible; transform: translateY(0px); }

.header .nav .menu.submenu-active .submenu { opacity: 1; visibility: visible; transform: translateY(0px); }

@media screen and (max-width: 1024px) { .header .burger { display: block; opacity: 1; visibility: visible; }
  .header .overlay.active { display: block; opacity: 1; visibility: visible; }
  .header .nav { position: fixed; top: 0; right: -100%; width: 100%; height: 100%; z-index: 10; opacity: 0; overflow-y: auto; visibility: hidden; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); background-color: #fff; transition: all 0.5s ease; }
  .header .nav.active { right: 0; opacity: 1; visibility: visible; }
  .header .nav .nav_header { display: flex; justify-content: space-between; align-items: center; padding: 0 5.49383vw; height: 80px; }
  .header .nav .nav_header .nav_close { width: 30px; height: 31px; }
  .header .nav .nav_header .nav_close img { width: 100%; }
  .header .nav ul { display: block; width: 100%; height: auto; }
  .header .nav .menu { padding: 4.81481vw 0 5.49383vw 3.39506vw; margin-right: 0; }
  .header .nav .menu.dropdown .link::after { content: ""; width: 30px; height: 30px; background: url("/lib/img/common/icon_menu_arr.png"); background-size: cover; }
  .header .nav .menu.submenu-active .submenu { position: relative; display: block; flex-direction: column; left: 77px; padding: 0; }
  .header .nav .menu .link { display: flex; align-items: center; font-size: 5.30864vw; font-weight: 700; color: #000; }
  .header .nav .menu .link i { display: flex; margin-right: 2.46914vw; width: 8.14815vw; height: 8.58025vw; background-size: contain; }
  .header .nav .menu .submenu { display: none; background-color: transparent; }
  .header .nav .menu .submenu li { padding: 20px; margin-left: 0; margin-top: 2.09877vw; background-color: #eee; color: #000; border-radius: 40px; text-align: center; }
  .header .nav .menu .submenu li a { font-size: 2.83951vw; font-weight: 700; color: #000; } }

@media screen and (max-width: 768px) { .header .container { height: 80px; }
  .header .logo { width: 108px; }
  .header .nav .menu { padding: 16px; }
  .header .nav .menu .link { font-size: 28px; font-weight: 700; }
  .header .nav .menu .link i { width: 42px; height: 42px; }
  .header .nav .menu.dropdown .link::after { content: ""; margin-left: 10px; width: 20px; height: 20px; }
  .header .nav .menu .submenu { top: 20px; }
  .header .nav .menu .submenu li:nth-of-type(1) { margin-top: 0; }
  .header .nav .menu .submenu li a { font-size: 16px; }
  .header .nav .menu.submenu-active .submenu { position: relative; display: block; flex-direction: column; left: auto; margin-left: 53px; padding: 0; padding-bottom: 16px; } }

.footer { background-color: #f6f6f6; color: #666; font-size: 16px; }

.footer_container { display: flex; justify-content: space-between; padding: 70px 0 92px; }

.footer_container .left { color: #666; }

.footer_container .left .logo { margin-bottom: 22px; width: 81px; }

.footer_container .left .logo img { display: block; }

.footer_container .left p { color: #666; line-height: 1.56; word-break: keep-all; }

.footer_container .left .privacy_policy { margin-top: 5px; margin-bottom: 10px; }

.footer_container .left .privacy_policy a:hover { text-decoration: underline; text-underline-position: under; }

.footer_container .left .privacy_policy a:nth-of-type(2) { margin-left: 20px; }

.footer_container .left a { color: #666; }

.footer_container .left small { color: #aaa; }

.footer_container .right { font-size: 0; }

.footer_container .right a { display: inline-block; margin-left: 10px; }

@media screen and (max-width: 1620px) { .btn_box { display: none; } }

@media screen and (max-width: 1024px) { .footer_container { flex-direction: column; padding: 7.34568vw 0; }
  .footer_container .right .sns { margin-top: 6.91358vw; display: flex; align-items: center; justify-content: center; } }

@media screen and (max-width: 768px) { .footer_container { padding: 39px 0; }
  .footer_container .left p { font-size: 12px; }
  .footer_container .left p:nth-of-type(3) { margin-top: 8px; margin-bottom: 5px; }
  .footer_container .right .sns { margin-top: 37px; } }

.modal_container { position: fixed; display: none; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); }

.modal_inner { display: flex; justify-content: space-between; align-items: center; margin: 0 auto; max-width: 1080px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

.modal { position: relative; padding: 40px 31px 32px; width: 520px; height: 560px; background-color: #fff; border: solid 1px #f0f0f0; box-sizing: border-box; }

.modal + .modal { margin-left: 40px; }

.modal_header { margin-bottom: 24px; }

.modal_header h3 { font-size: 24px; font-weight: 700; line-height: 1.33; color: #222; text-align: center; }

.modal_content .desc { font-size: 14px; line-height: 1.43; color: #555; word-break: break-all; }

.modal_content .notice { position: relative; margin-top: 42px; padding: 33px 0 32px; border-top: 1px solid #888; border-bottom: 1px solid #888; }

.modal_content .notice_title { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); width: 96px; height: 20px; background-color: #fff; font-size: 14px; line-height: 1.43; color: #222; font-weight: 700; text-align: center; white-space: pre-wrap; }

.modal_content .notice dl:not(:nth-of-type(1)) { margin-top: 20px; }

.modal_content .notice dl dt { font-size: 14px; font-weight: 700; line-height: 1.43; color: #222; }

.modal_content .notice dl dd { font-size: 14px; margin-top: 4px; color: #555; line-height: 1.43; }

.modal_content .notice ul { margin-top: 8px; margin-bottom: 4px; }

.modal_content .notice ul li { position: relative; padding-left: 34px; font-size: 14px; line-height: 1.43; color: #555; }

.modal_content .notice ul li:not(:nth-of-type(1)) { margin-top: 6px; }

.modal_content .notice ul li .num { position: absolute; left: 16px; top: 0; }

.modal_content .notice p { font-size: 14px; line-height: 1.43; color: #555; white-space: pre-wrap; }

.modal_content .notice p:not(:nth-of-type(1)) { margin-top: 20px; }

.modal_content .notice p strong { font-size: 14px; font-weight: 700; line-height: 1.43; color: #222; }

.modal_content .notice .num { display: inline-flex; width: 16px; }

.modal_footer { text-align: center; padding-top: 25px; }

.modal_footer .date { font-size: 14px; line-height: 1.43; color: #555; }

.modal_footer .ceo { margin-top: 2px; font-size: 16px; font-weight: 500; line-height: 1.5; color: #222; }

.modal_footer .ceo strong { margin-right: 6px; font-size: 16px; font-weight: 700; color: #222; line-height: 1.5; }

.modal .close_btn { position: absolute; right: 10px; top: 10px; padding: 10px; cursor: pointer; }

.modal .close_btn img { display: block; width: 20px; height: 20px; }

.modal_full_img { position: relative; width: max-content; box-sizing: border-box; }

.modal_full_img .img_box img { max-width: calc(100vw - 40px); max-height: calc(100vh - 40px); }

.modal_full_img .close_btn { position: absolute; right: 10px; top: 10px; padding: 10px; cursor: pointer; }

.modal_full_img .close_btn img { display: block; width: 20px; height: 20px; }

.main .visual { position: relative; }

.main .visual .swiper-slide { height: 770px; }

.main .visual .swiper-slide::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); z-index: 2; }

.main .visual .util i { width: 48px; height: 49px; background-size: contain; }

.main .visual .util .swiper-button-next, .main .visual .util .swiper-button-prev { width: 48px; height: 49px; z-index: 999; }

.main .visual .util .swiper-button-next:after, .main .visual .util .swiper-button-prev:after { display: none; }

.main .visual .util .swiper-button-prev { left: 85px; }

.main .visual .util .swiper-button-next { right: 85px; }

.main .visual .title { display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); visibility: visible; width: 100%; max-width: 1620px; color: #fff; z-index: 999; }

.main .visual .title h2 { font-size: 69.5px; font-weight: 600; line-height: 1.15; }

.main .visual .title h2 span { display: block; }

.main .visual .title p { margin-top: 45px; font-size: 34px; font-weight: 500; line-height: 1.59; }

.main .visual .title .swiper-pagination { left: -10px; bottom: -120px; text-align: left; }

.main .visual .title .swiper-pagination-bullet { width: 14px; height: 15px; margin: 0 10px; background-color: #fff; opacity: 0.5; }

.main .visual .title .swiper-pagination-bullet-active { opacity: 1; }

.main .gmv { padding-top: 120px; }

.main .gmv .gmv_box { padding: 35px 50px 40px; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.main .gmv .gmv_box:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.main .gmv .gmv_box p { display: flex; align-items: center; margin-bottom: 20px; font-size: 17px; font-weight: normal; color: #888; }

.main .gmv .gmv_box p i { margin-right: 10px; width: 60px; height: 55px; }

.main .gmv .gmv_box ul { display: flex; justify-content: space-between; }

.main .gmv .gmv_box ul li { display: flex; align-items: center; font-size: 20px; font-weight: 500; color: #000; }

.main .gmv .gmv_box ul li strong { display: flex; margin-left: 22px; font-size: 38px; font-weight: 600; }

.main .board { padding: 34px 0 76px; }

.main .board .grid { display: flex; width: 100%; }

.main .board .grid .column.col1 { width: 53%; margin-right: 2%; }

.main .board .grid .column.col1 .card { width: 100%; height: 838px; margin-bottom: 0; }

.main .board .grid .column.col1 .card .info_container { padding: 29px 30px 34px 50px; }

.main .board .grid .column.col1 .card .title { min-height: 94px; font-size: 37.5px; font-weight: 600; line-height: 1.6; color: #000; }

.main .board .grid .column.col1 .img_wrap { height: 100%; }

.main .board .grid .column.col2 { width: 47%; margin-right: -2%; }

.main .board .grid .column.col2 .grid_sizer { width: 46%; }

.main .board .grid .column.col2 .gutter_sizer { width: 4%; }

.main .board .grid .column.col2 .grid_item { float: left; width: 46%; margin-bottom: 4%; }

.main .board .grid .column.col2 .card .title { min-height: 71px; }

.main .board .grid .column::after { content: ""; display: block; clear: both; }

.main .service ul { display: flex; flex-wrap: wrap; }

.main .service .service_box { overflow: hidden; position: relative; width: 540px; padding-top: 31%; max-height: 400px; background: no-repeat 50%; -webkit-background-size: cover; background-size: cover; cursor: pointer; }

.main .service .service_dimmed { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(58, 62, 80, 0.5); opacity: 0; filter: alpha(opacity=0); -webkit-transition: opacity 0.3s; transition: opacity 0.3s; }

.main .service .service_box:hover .service_dimmed { opacity: 1; filter: alpha(opacity=100); }

.main .service .service_dimmed dl { position: absolute; left: 0px; bottom: -103px; width: 100%; padding-top: 50px; padding-left: 30px; color: #fff; -webkit-transition: bottom 0.3s; transition: bottom 0.3s; color: #fff; }

.main .service .service_dimmed dl:before { content: ""; position: absolute; left: 30px; top: 0; width: 26px; height: 25px; background: url("/lib/img/main/icon_service_arr_new.png") no-repeat; background-size: cover; }

.main .service .service_dimmed dl dt { margin-bottom: 12px; font-size: 25px; }

.main .service .service_dimmed dl dd { width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size: 16px; }

.main .service .service_dimmed:focus { opacity: 1; filter: alpha(opacity=100); }

.main .service .service_dimmed:focus dl { bottom: 30px; }

.main .service .service_box:hover .service_dimmed dl { bottom: 30px; }

@media screen and (max-width: 1920px) { .main .visual .title { max-width: 100%; left: 15%; transform: translate(0, -50%); width: auto; } }

@media screen and (max-width: 1640px) { .main .gmv .gmv_box { padding: 25px 30px; }
  .main .gmv .gmv_box ul li strong { font-size: 32px; }
  .main .board .grid .column.col1 { width: 50%; }
  .main .board .grid .column.col2 { width: 50%; }
  .main .service .service_box { width: 33.33%; } }

@media screen and (max-width: 1500px) { .main .board .grid .column.col2 { width: 48%; margin-right: 0; }
  .main .board .grid .column.col2 .grid_sizer { width: 100%; }
  .main .board .grid .column.col2 .gutter_sizer { width: 4%; }
  .main .board .grid .column.col2 .grid_item { float: left; width: 100%; margin-bottom: 2%; }
  .main .board .grid .column.col2 .card { width: 100%; height: auto; } }

@media screen and (max-width: 1350px) { .main .gmv .gmv_box ul li strong { font-size: 23px; } }

@media screen and (max-width: 1240px) { .main .visual .title h2 { font-size: 46px; }
  .main .visual .title p { font-size: 30px; }
  .main .visual .util .swiper-button-next { right: 16px; }
  .main .visual .util .swiper-button-prev { left: 16px; }
  .main .gmv { padding-top: 60px; }
  .main .gmv .gmv_box ul { flex-wrap: wrap; }
  .main .gmv .gmv_box ul li { flex-basis: 50%; padding: 10px 0; }
  .main .gmv .gmv_box ul li span { min-width: 132px; }
  .main .gmv .gmv_box ul li strong { font-size: 32px; }
  .main .board .grid .column.col1 .card { height: auto; }
  .main .board .grid .column.col1 .card .title { min-height: auto; font-size: 32px; } }

@media screen and (max-width: 1024px) { .main .visual .title { left: 50%; display: flex; flex-direction: column; justify-content: center; transform: translate(-50%, -44%); }
  .main .visual .title .swiper-pagination { text-align: center; }
  .main .gmv .grid { padding: 4.25926vw 4.32099vw 4.81481vw; grid-template-columns: 1fr; }
  .main .gmv .grid .item .top { justify-content: space-between; }
  .main .gmv .grid .item li { padding: 26px 0; margin-left: 0; justify-content: space-between; }
  .main .gmv .grid .item:nth-of-type(1) { padding: 0; border-right: none; }
  .main .gmv .grid .item:nth-of-type(1) li + li { border-top: 1px solid #ededed; }
  .main .gmv .grid .item:nth-of-type(2) { display: block; margin-top: 20px; padding: 0; border-bottom: none; border-top: 1px solid #ededed; }
  .main .gmv .grid .item:nth-of-type(2) ul { display: block; }
  .main .gmv .grid .item:nth-of-type(2) li { justify-content: space-between; }
  .main .gmv .grid .item:nth-of-type(3) { margin-top: 20px; padding: 0; border-top: 1px solid #ededed; }
  .main .gmv .grid .item:nth-of-type(3) ul { display: block; width: 100%; }
  .main .gmv .grid .item:nth-of-type(3) li { justify-content: space-between; }
  .main .board { padding: 34px 0 34px; }
  .main .board .grid .column.col1 .card .title { font-size: 30px; }
  .main .service { padding: 0; }
  .main .service .inner { padding: 0; }
  .main .service ul { flex-wrap: nowrap; }
  .main .service .service_box { height: 360px; }
  .main .service .service_box:hover .service_dimmed dl { bottom: 103px; }
  .main .service .service_dimmed { opacity: 1; }
  .main .service .service_dimmed dl { bottom: 103px; } }

@media screen and (max-width: 768px) { .main .visual .swiper-slide { height: 600px; }
  .main .visual .title { pointer-events: none; width: 100%; padding: 0 18px; transform: translate(-50%, -40%); }
  .main .visual .title h2 { padding-left: 20px; font-size: 46px; }
  .main .visual .title p { margin-top: 30px; padding: 0 20px; font-size: 26px; word-break: keep-all; }
  .main .visual .title p br { display: none; }
  .main .visual .title .swiper-pagination { left: 0; bottom: -10px; }
  .main .visual .title .swiper-pagination-bullet { width: 10px; height: 10px; margin: 0 6px; }
  .main .visual .util { display: none; }
  .main .gmv { padding-top: 34px; }
  .main .gmv .gmv_box ul li { justify-content: space-between; flex-basis: 100%; }
  .main .gmv .gmv_box ul li:not(:first-child) { border-top: 1px solid #ededed; }
  .main .gmv .gmv_box ul li strong { font-size: 28px; }
  .main .board .grid { flex-direction: column; }
  .main .board .grid .column.col1 { width: 100%; }
  .main .board .grid .column.col1 .card { height: auto; }
  .main .board .grid .column.col1 .card .info_container { padding: 18px 24px 13px; }
  .main .board .grid .column.col1 .card .title { font-size: 17px; min-height: auto; }
  .main .board .grid .column.col2 { width: 100%; }
  .main .board .grid .column.col2 .grid_item { margin-bottom: 0; margin-top: 40px; }
  .main .service .service_box:hover .service_dimmed dl { bottom: 85px; }
  .main .service .service_dimmed dl { bottom: 85px; padding-top: 40px; padding-left: 41px; }
  .main .service .service_dimmed dl::before { left: 41px; width: 23px; height: 23px; }
  .main .service .service_dimmed dl dt { margin-bottom: 13px; font-size: 23px; }
  .main .service .service_dimmed dl dd { font-size: 15px; }
  .main .service .banner-pagination { position: absolute; width: 100%; bottom: 40px; z-index: 1; text-align: center; }
  .main .service .banner-pagination .swiper-pagination-bullet { background: #fff; opacity: 0.5; }
  .main .service .banner-pagination .swiper-pagination-bullet-active { opacity: 1; } }

.service { padding-bottom: 123px; }

.interview { padding: 124px 0; background-color: #000; }

.interview h3 { color: #fff; }

.interview .video_wrap { position: relative; height: 0; padding-bottom: 56.25%; }

.interview .video_wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.history { padding-top: 125px; }

.history .timeline { display: flex; }

.history .timeline .tabs { display: flex; flex-direction: column; width: 15%; }

.history .timeline .tabs button { position: relative; font-size: 20px; font-weight: 600; color: #888; text-align: left; }

.history .timeline .tabs button.active { color: #000; }

.history .timeline .tabs button.active::after { content: ""; position: absolute; left: 0; bottom: -5px; width: 114px; height: 2px; background-color: #D00000; }

.history .timeline .tabs button + button { margin-top: 20px; }

.history .timeline .container { width: 85%; }

.history .timeline .container .item { display: none; margin-left: 130px; }

.history .timeline .container .item.active { display: block; }

.history .timeline .container .item .year { display: flex; padding: 38px 0; border-top: 2px solid #f4f4f4; }

.history .timeline .container .item .year:nth-of-type(1) { padding-top: 0; border-top: none; }

.history .timeline .container .item .year .title { font-size: 20px; font-weight: 600; color: #000; }

.history .timeline .container .item .year .list { padding-left: 94px; }

.history .timeline .container .item .year .list li { position: relative; margin-top: 17px; padding-left: 150px; font-size: 16px; font-weight: 400; color: #555; line-height: 1.94; word-break: keep-all; }

.history .timeline .container .item .year .list li:nth-of-type(1) { margin-top: 0; }

.history .timeline .container .item .year .list strong { position: absolute; left: 0; top: 0; font-weight: 500; color: #000; }

.history .timeline .container .item .year .list span { display: inline-flex; margin-left: 20px; }

.directions #naver_map { width: 100%; height: 505px; margin-bottom: 60px; }

.directions .vehicle { display: flex; flex-wrap: wrap; }

.directions .vehicle > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (2 - 1) * 20px) / 2); margin-bottom: 20px; }

.directions .vehicle > *:not(:last-child) { margin-right: 20px; }

.directions .vehicle > *:nth-child(2n) { margin-right: 0; }

.directions .vehicle .panel { margin-bottom: 0; padding: 34px 43px 43px; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.directions .vehicle .panel:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.directions .vehicle .panel .top { margin-bottom: 30px; padding-bottom: 30px; border-bottom: 2px solid #f4f4f4; }

.directions .vehicle .badge { display: inline-block; padding: 12px 0; font-weight: 600; width: 100px; margin-bottom: 30px; font-size: 18px; color: #000; border-radius: 20px; background-color: #eee; text-align: center; }

.directions .vehicle p { font-size: 19px; font-weight: 500; color: #555; }

.directions .vehicle dl { margin-bottom: 28px; }

.directions .vehicle dl:nth-of-type(3) { margin-bottom: 0; }

.directions .vehicle dd { font-size: 17px; font-weight: 500; color: #555; }

.directions .vehicle .color { display: block; margin-bottom: 10px; font-size: 19px; font-weight: 600; }

.directions .vehicle .color.orange { color: #ff7e00; }

.directions .vehicle .color.blue { color: #2d59e8; }

.directions .vehicle .color.green { color: #1ca73a; }

.directions .vehicle .color.red { color: #D00000; }

@media screen and (max-width: 1024px) { .history .timeline .tabs { display: none; }
  .history .timeline .container { width: 100%; }
  .history .timeline .container .item { margin-left: 0; }
  .history .btn { display: flex !important; }
  .history .btn button { display: inline-flex; justify-content: center; text-align: center; margin: 0 auto; padding: 28px 0; width: 300px; font-size: 15px; color: #fff; font-weight: 600; background-color: #000; border-radius: 45px; }
  .directions .vehicle { display: flex; flex-wrap: wrap; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }
  .directions .vehicle > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (1 - 1) * 20px) / 1); margin-bottom: 20px; }
  .directions .vehicle > *:not(:last-child) { margin-right: 20px; }
  .directions .vehicle > *:nth-child(1n) { margin-right: 0; }
  .directions .vehicle:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }
  .directions .vehicle .panel { margin-bottom: 0; padding: 34px 43px 43px; box-shadow: none; border-radius: 0; }
  .directions .vehicle .panel:hover { transform: translateY(0); box-shadow: none; }
  .directions .vehicle .panel .top { margin-bottom: 30px; padding-bottom: 30px; border-bottom: 2px solid #f4f4f4; }
  .directions .vehicle .badge { display: inline-block; padding: 12px 0; font-weight: 600; width: 100px; margin-bottom: 30px; font-size: 18px; color: #000; border-radius: 20px; background-color: #eee; text-align: center; }
  .directions .vehicle p { font-size: 19px; font-weight: 500; color: #555; line-height: 1.5; word-break: keep-all; }
  .directions .vehicle dl { margin-bottom: 28px; }
  .directions .vehicle dl:nth-of-type(3) { margin-bottom: 0; }
  .directions .vehicle dd { font-size: 17px; font-weight: 500; color: #555; }
  .directions .vehicle .color { display: block; margin-bottom: 10px; font-size: 19px; font-weight: 600; }
  .directions .vehicle .color.orange { color: #ff7e00; }
  .directions .vehicle .color.blue { color: #2d59e8; }
  .directions .vehicle .color.green { color: #1ca73a; }
  .directions .vehicle .color.red { color: #D00000; } }

@media screen and (max-width: 768px) { .intro .btn { margin-top: 40px; }
  .service { padding-bottom: 40px; }
  .service .btn { margin-top: 40px; }
  .interview { padding: 40px 0; }
  .history { padding: 40px 0 0; }
  .history .timeline .container .item .year { align-items: flex-start; }
  .history .timeline .container .item .year .title { margin-top: 2px; font-size: 16px; }
  .history .timeline .container .item .year .list { padding-left: 22px; }
  .history .timeline .container .item .year .list li { margin-top: 8px; padding-left: 40px; line-height: 1.53; font-size: 12px; }
  .history #timeline2 .year:nth-of-type(6) { padding-bottom: 0; }
  .directions #naver_map { height: 233px; margin-bottom: 40px; }
  .directions .vehicle .badge { width: 67px; padding: 8px 14px; font-size: 12px; }
  .directions .vehicle p { font-size: 12px; }
  .directions .vehicle .panel { padding: 23px 27px 0; }
  .directions .vehicle .panel:nth-of-type(2) { padding-bottom: 43px; }
  .directions .vehicle .bottom { padding-bottom: 20px; border-bottom: 2px solid #f4f4f4; }
  .directions .vehicle .color { font-size: 12px; }
  .directions .vehicle dd { font-size: 11px; } }

.slide .swiper-wrapper { position: relative; -webkit-transition-timing-function: linear !important; transition-timing-function: linear !important; }

.slide .swiper-slide { position: relative; display: flex; justify-content: center; align-items: center; width: auto; overflow: hidden; padding: 0 50px; }

.ci .panel { margin-top: 60px; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.ci .panel:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.ci .panel:nth-of-type(1) { margin-top: 0; }

.ci .panel .top { position: relative; padding-top: 414px; background: url("/lib/img/brand/ci_img.png") left top/contain no-repeat; }

.ci .panel .bottom h3 { margin-bottom: 38px; }

.ci .panel .title { padding: 29px 0 26px 32px; }

.ci .panel .title strong { position: relative; display: block; padding-left: 64px; }

.ci .panel .title strong i { position: absolute; display: block; left: 0; top: 50%; width: 56px; height: 55px; margin-top: -23px; }

.ci .panel .table { display: flex; }

.ci .panel .table dt { padding: 36px; height: 180px; font-size: 20px; font-weight: 500; color: #fff; }

.ci .panel .table dd { display: flex; justify-content: space-between; padding: 28px 28px 28px 35px; width: 100%; border-top: 2px solid #eee; font-size: 16px; font-weight: 400; color: #4d4d4d; border-left: 2px solid #eee; margin-left: -1px; }

.ci .panel .table.primary dl { width: 50%; }

.ci .panel .table.primary dl:nth-of-type(1) dt { background-color: #1F1F2C; }

.ci .panel .table.primary dl:nth-of-type(2) dt { background-color: #D00000; }

.ci .panel .table.secondary dl { width: 25%; }

.ci .panel .table.secondary dl:nth-of-type(1) dt { background-color: #505050; }

.ci .panel .table.secondary dl:nth-of-type(2) dt { background-color: #646464; }

.ci .panel .table.secondary dl:nth-of-type(3) dt { background-color: #a0a0a0; }

.ci .panel .table.secondary dl:nth-of-type(4) dt { background-color: #c8c8c8; }

.ci .panel h4 { margin-left: 35px; margin-bottom: 26px; font-size: 26px; font-weight: 600; color: #000; }

.ci .panel .tag { position: absolute; top: 27px; left: 34px; }

.ci .panel ul { display: flex; }

.ci .panel li { padding: 108px 80px; }

.ci .panel li:nth-of-type(1) { background-color: #fff; border-top: 2px solid #eee; }

.ci .panel li:nth-of-type(2) { background-color: #1F1F2C; }

.ci .panel li:nth-of-type(3) { background-color: #D00000; }

.ci .panel .cate { position: relative; display: inline-flex; margin-left: 55px; padding: 13px 14px 12px; border-radius: 20px; background-color: #ededed; font-size: 18px; font-weight: 500; color: #000; }

.ci .panel .cate::after { content: ""; position: absolute; left: 0; bottom: 0; width: 0px; height: 0px; border-top: 10px solid none; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #ededed; }

.ci .panel .cate i { position: absolute; left: -55px; top: 0; width: 55px; height: 55px; }

@media screen and (max-width: 1024px) { .slide .swiper-slide { padding: 0 4.32099vw; width: 47.53086vw; height: 47.53086vw; border-radius: 100%; }
  .slide .swiper-slide img { display: block; width: 100%; }
  .ci .panel { margin-top: 7.34568vw; }
  .ci .panel .top { padding-top: 39.50617vw; }
  .ci .panel .bottom h3 { margin-bottom: 38px; }
  .ci .panel .title { padding: 29px 0 26px 32px; }
  .ci .panel .title strong { position: relative; display: block; padding-left: 64px; }
  .ci .panel .title strong i { position: absolute; display: block; left: 0; top: 50%; width: 56px; height: 55px; margin-top: -23px; }
  .ci .panel .table { display: flex; flex-wrap: wrap; }
  .ci .panel .table dt { display: flex; align-items: center; justify-content: center; padding: 0; height: 12.96296vw; font-size: 2.34568vw; }
  .ci .panel .table dd { flex-direction: column; padding: 1.85185vw 4.32099vw; font-size: 1.88272vw; }
  .ci .panel .table dd span:nth-of-type(1) { color: #bbb; margin-bottom: 10px; }
  .ci .panel .table.secondary dl { width: 50%; }
  .ci .panel .table.secondary dl:nth-of-type(1) dt { background-color: #505050; }
  .ci .panel .table.secondary dl:nth-of-type(2) dt { background-color: #646464; }
  .ci .panel .table.secondary dl:nth-of-type(3) dt { background-color: #a0a0a0; }
  .ci .panel .table.secondary dl:nth-of-type(4) dt { background-color: #c8c8c8; }
  .ci .panel h4 { font-size: 3.30247vw; margin-left: 4.44444vw; margin-bottom: 3.64198vw; }
  .ci .panel .tag { top: 4.25926vw; left: 4.32099vw; }
  .ci .panel .cate { padding: 13px 20px 12px; }
  .ci .panel ul { flex-direction: column; }
  .ci .panel li { padding: 9.93827vw 16.91358vw; }
  .ci .panel li:nth-of-type(1) { background-color: #fff; border-top: 2px solid #eee; }
  .ci .panel li:nth-of-type(2) { background-color: #1F1F2C; }
  .ci .panel li:nth-of-type(3) { background-color: #D00000; } }

@media screen and (max-width: 768px) { .slide .swiper-slide { padding: 0 12px; width: 300px; height: 300px; border-radius: 100%; }
  .slide .swiper-slide img { display: block; width: 100%; }
  .ci .panel { margin-top: 40px; }
  .ci .panel .title { padding: 18px 24px 17px; }
  .ci .panel .cate { margin-left: 40px; padding: 8px 14px; font-size: 12px; }
  .ci .panel .cate i { left: -40px; top: auto; width: 40px; height: 40px; }
  .ci .panel h4 { margin-bottom: 15px; margin-left: 24px; font-size: 18px; }
  .ci .panel li { padding: 53px 91px; }
  .ci .panel .table dt { padding: 30px 0; height: auto; font-size: 12px; }
  .ci .panel .table dd { margin-left: -2px; padding: 10px 0 0 24px; border-top: none; font-size: 10px; }
  .ci .panel .table dd span:nth-of-type(1) { color: #bbb; margin-bottom: 6px; }
  .ci .panel .table dd:nth-of-type(1) { padding-top: 17px; }
  .ci .panel .table dd:nth-last-of-type(1) { padding-bottom: 23px; }
  .ci .panel .table.secondary dd:nth-of-type(2) { display: none; } }

.media_detail { padding: 73px 0 119px; }

.media_detail .title strong { display: flex; justify-content: center; color: #2d2d2d; }

.media_detail .title strong .category { font-size: 18px; font-weight: 500; }

.media_detail .title strong .date { position: relative; padding-left: 24px; font-size: 17px; font-weight: 600; }

.media_detail .title strong .date::after { content: ""; width: 2px; height: 16px; background-color: #2d2d2d; position: absolute; left: 12px; top: 50%; margin-top: -8px; }

.media_detail .title h3 { margin-top: 36px; margin-bottom: 65px; font-size: 50px; font-weight: 700; line-height: 1.25; text-align: center; color: #000; }

.media_detail .cont { color: #666 !important; }

.media_detail .btn.media { margin-top: 65px; }

.media_detail .btn.media .link { width: 271px; background-color: #ededed; color: #000; }

.hidden { display: none; }

.video-pagination-container, .press-pagination-container { width: 100%; display: flex; align-items: center; justify-content: center; }

.video-pagination-number, .video-pagination-button, .press-pagination-number, .press-pagination-button { border: none; margin: 0.25rem 0.25rem; cursor: pointer; width: 40px; height: 40px; }

.video-pagination-number img, .video-pagination-button img, .press-pagination-number img, .press-pagination-button img { width: 100%; }

.video-pagination-number.active, .press-pagination-number.active { color: #000000; font-weight: 600; }

@media screen and (max-width: 768px) { .video-pagination-number, .video-pagination-button, .press-pagination-number, .press-pagination-button { width: 20px; height: 25px; }
  .media_detail { padding: 53px 0 66px; }
  .media_detail .title .category { font-size: 14px; }
  .media_detail .title .date { font-size: 14px; color: #888; }
  .media_detail .title h3 { margin-top: 23px; margin-bottom: 42px; font-size: 32px; } }

.hire .panel { padding: 60px 44px 58px; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.hire .panel:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.hire .box { padding-bottom: 60px; margin-bottom: 60px; border-bottom: 2px solid #f4f4f4; }

.hire .box:last-child { padding-bottom: 0px; margin-bottom: 0px; border-bottom: none; }

.hire .box:nth-of-type(1) .txt h4 { font-size: 34.5px; }

.hire .box .txt h4 { margin-bottom: 25px; font-size: 26.5px; font-weight: 600; color: #000; }

.hire .box .txt p { font-size: 20px; font-weight: 500; line-height: 1.5; color: #555; }

.hire .box .txt p .r_color { color: #D00000; }

.hire .box .txt h4 + p { margin-bottom: 44px; }

@media screen and (min-width: 1081px) { .hire .box .txt br.mo { display: none; } }

.hire .box .diagram.mo { display: none; }

.hire .box .diagram ul { position: relative; display: flex; margin: 0 66px; z-index: 10; }

.hire .box .diagram li { position: relative; display: flex; align-items: center; justify-content: center; margin-left: 50px; width: 180px; height: 180px; border: solid 2px #D00000; border-radius: 100%; }

.hire .box .diagram li::after { content: ""; position: absolute; right: -31px; top: 50%; margin-top: -7px; width: 12px; /* 사이즈 */ height: 13px; /* 사이즈 */ border-top: 2px solid #888; /* 선 두께 */ border-right: 2px solid #888; /* 선 두께 */ transform: rotate(45deg); /* 각도 */ }

.hire .box .diagram li:nth-of-type(1) { margin-left: 0px; }

.hire .box .diagram li:nth-of-type(4) { background-color: #D00000; }

.hire .box .diagram li:nth-of-type(4) p strong { color: #fff; }

.hire .box .diagram li:nth-of-type(4)::after { display: none; }

.hire .box .diagram li p { text-align: center; font-size: 24.5px; color: #D00000; font-weight: 600; line-height: 1.41; }

.hire .box .diagram li p strong { display: block; font-size: 24.5px; font-weight: 500; color: #333; }

.hire .box .diagram .notice { margin-top: 44px; font-size: 19px; font-weight: 400; line-height: 1.5; letter-spacing: -0.38px; color: #555; }

.hire .box .list { font-size: 19px; font-weight: 500; line-height: 1.5; color: #555; }

.hire .box .list a { color: #555; }

.culture .visual { margin-top: -30px; overflow: hidden; border-radius: 20px; }

.culture .visual img { width: 100%; }

.culture .visual img.mo { display: none; }

.culture .principle .tit { margin: 60px 0; font-size: 26px; font-weight: 700; line-height: 1.92; color: #000; }

.culture .card { position: relative; }

.culture .card .card_layer { padding: 80px 35px 0; }

.culture .card .card_layer .word { font-size: 30px; font-weight: 600; line-height: 2.11; }

.culture .card .card_layer .sharp { margin-top: 40px; }

.culture .card .card_layer li { word-break: keep-all; }

.culture .card .info_container { position: absolute; display: flex; align-items: center; padding: 33px 40px; width: 100%; z-index: 2; }

.culture .card .info_container .principle { font-size: 26.5px; font-weight: 600; line-height: 1.38; }

.culture .card .info_container .principle.white { color: #fff; }

.culture .card .info_container .principle.black { color: #333; }

.jobs .panel { padding: 60px 45px 70px; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.jobs .panel:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.jobs .visual { margin-bottom: 60px; height: 400px; background: url("/lib/img/recruit/job_img.png") center center/cover no-repeat; }

.jobs .box { padding-bottom: 40px; margin-bottom: 40px; border-bottom: 2px solid #f4f4f4; }

.jobs .box:nth-of-type(4) { padding-bottom: 0px; margin-bottom: 0px; border-bottom: none; }

.jobs .box .txt h4 { margin-bottom: 29px; font-size: 26.5px; font-weight: 600; color: #000; }

.jobs .box .txt p { font-size: 20px; font-weight: 500; line-height: 1.5; color: #555; }

.jobs .box .txt h4 + p { margin-bottom: 29px; }

.jobs .box .diagram ul { position: relative; display: flex; margin: 0 75px; z-index: 10; }

.jobs .box .diagram ul::after { content: ""; position: absolute; left: 0; top: 50%; display: block; height: 2px; width: 100%; background: #eeeeee; z-index: -1; }

.jobs .box .diagram li { display: flex; align-items: center; justify-content: center; margin-left: 43px; width: 180px; height: 180px; color: #fff; border-radius: 100%; }

.jobs .box .diagram li:nth-of-type(1) { margin-left: 0px; background-color: #eee; color: #000; }

.jobs .box .diagram li:nth-of-type(2) { background-color: #888; }

.jobs .box .diagram li:nth-of-type(3) { background-color: #1f202c; }

.jobs .box .diagram li:nth-of-type(4) { color: #fff; background-color: #D00000; }

.jobs .box .diagram li span { display: block; margin-bottom: 10px; font-size: 18px; }

.jobs .box .diagram li strong { font-size: 24.5px; }

.jobs .box .list { font-size: 19px; font-weight: 500; line-height: 1.5; color: #555; }

.jobs .box .contact p { font-size: 19px; line-height: 1.5; color: #555; }

.jobs .box .contact a { color: #00b4ff; text-decoration: underline; text-underline-position: under; }

.benefit .mo { display: none; }

@media screen and (max-width: 1080px) { .hire .panel { padding: 9.08257vw 6.42202vw 11.00917vw; }
  .hire .box { padding-bottom: 11.00917vw; margin-bottom: 11.00917vw; border-bottom: 1px solid #f4f4f4; }
  .hire .box:nth-of-type(1) .txt h4 { font-size: 5.59633vw; margin-bottom: 2.93578vw; }
  .hire .box:nth-of-type(2) { padding-bottom: 0; border-bottom: none; }
  .hire .box .txt h4 { margin-bottom: 25px; font-size: 4.90826vw; }
  .hire .box .txt p { font-size: 3.48624vw; line-height: 1.41; }
  .hire .box .txt h4 + p { margin-bottom: 9.17431vw; }
  .hire .box .diagram.pc { display: none; }
  .hire .box .diagram.mo { display: block; }
  .hire .box .diagram ul { flex-direction: column; margin: 0; }
  .hire .box .diagram ul::after { display: none; }
  .hire .box .diagram li { width: auto; height: auto; margin: 0; padding: 4.01235vw 0; justify-content: left; border: none; border-bottom: 1px solid #efefef; border-radius: 0; }
  .hire .box .diagram li:nth-of-type(1) { background-color: transparent; border-top: 2px solid #000; }
  .hire .box .diagram li:nth-of-type(2) { background-color: transparent; }
  .hire .box .diagram li:nth-of-type(3) { background-color: transparent; }
  .hire .box .diagram li:nth-of-type(4) { background-color: transparent; border-bottom: none; }
  .hire .box .diagram li:nth-of-type(4) span { background-color: #D00000; }
  .hire .box .diagram li::after { display: none; }
  .hire .box .diagram li div { display: flex; align-items: center; }
  .hire .box .diagram li span { background-color: #000; width: 7.65432vw; height: 7.65432vw; font-size: 3.05556vw; font-weight: 500; color: #fff; text-align: center; line-height: 7.65432vw; border-radius: 100%; margin-bottom: 0; margin-right: 2.46914vw; }
  .hire .box .diagram li strong { font-size: 3.05556vw; font-weight: 600; color: #000; }
  .hire .box .diagram li strong em { margin-left: 0.91743vw; font-style: normal; color: #D00000; }
  .hire .box .diagram .notice { margin-top: 0; font-size: 3.48624vw; line-height: 1.51; color: #555; }
  .hire .box .list { font-size: 3.48624vw; }
  .culture .visual { margin: 0 -4.58716vw 0; border-radius: 0; }
  .culture .visual img { height: 82.56881vw; }
  .culture .visual img.pc { display: none; }
  .culture .visual img.mo { display: block; }
  .culture .principle .tit { margin: 10.91743vw 0 9.72477vw; font-size: 5.59633vw; font-weight: 600; line-height: 1.19; color: #000; letter-spacing: -1.22px; }
  .culture .card .img_wrap { padding: 0; height: 95.22936vw; }
  .culture .card .img_wrap::after { display: none; }
  .culture .card .info_container { padding: 6.69725vw 4.95413vw 0 6.51376vw; }
  .culture .card .info_container .principle { font-size: 4.90826vw; line-height: 1.36; }
  .culture .card .info_container .btn_more { top: 6.23853vw; right: 5.13761vw; }
  .culture .card.active .card_layer { padding: 13.02752vw 5.22936vw 0 7.33945vw; }
  .culture .card.active .card_layer .word { font-size: 6.23853vw; line-height: 7.33945vw; }
  .culture .card.active .card_layer ul { margin-top: 4.58716vw; }
  .culture .card.active .card_layer li { font-size: 4.40367vw; line-height: 7.33945vw; }
  .culture .card.active .card_layer p { font-size: 4.40367vw; line-height: 7.33945vw; }
  .culture .card.active .card_layer .sharp { margin-top: 0; }
  .culture .card.active .card_layer button { top: 6.23853vw; right: 5.13761vw; }
  .benefit .pc { display: none; }
  .benefit .mo { display: block; }
  .benefit .sub_txt strong { font-size: 4.40367vw; font-weight: 500; line-height: 1.42; color: #555; }
  .benefit .card { height: 95.22936vw; }
  .benefit .card.active .card_layer { padding: 9.63303vw 6.6055vw 0 8.25688vw; }
  .benefit .card.active .card_layer li { font-size: 4.40367vw; margin-bottom: 0.91743vw; word-break: keep-all; }
  .benefit .card.active .card_layer li span { display: block; }
  .benefit .card.active .card_layer button { top: 6.23853vw; right: 5.13761vw; }
  .benefit .card:nth-of-type(2).active .card_layer { padding: 20.36697vw 6.6055vw 0 8.25688vw; }
  .benefit .card:nth-of-type(3).active .card_layer { padding: 20.36697vw 6.6055vw 0 8.25688vw; }
  .benefit .card .info_container .btn_more { top: 6.23853vw; right: 5.13761vw; }
  .benefit .card .img_wrap { padding-bottom: 72.25%; } }

@media screen and (max-width: 1024px) { .jobs .panel { padding: 4.19753vw 3.39506vw 10.74074vw; }
  .jobs .box { padding-bottom: 7.40741vw; margin-bottom: 7.40741vw; border-bottom: none; }
  .jobs .box:nth-of-type(3) { border-bottom: 2px solid #f4f4f4; }
  .jobs .box .txt h4 { margin-bottom: 4.01235vw; font-size: 3.30247vw; }
  .jobs .box .txt p { font-size: 2.34568vw; }
  .jobs .box .txt h4 + p { margin-bottom: 5.92593vw; }
  .jobs .box .diagram ul { flex-direction: column; margin: 0; }
  .jobs .box .diagram ul::after { display: none; }
  .jobs .box .diagram li { width: auto; height: auto; margin: 0; padding: 4.01235vw 0; justify-content: left; border-bottom: 2px solid #efefef; border-radius: 0; }
  .jobs .box .diagram li:nth-of-type(1) { background-color: transparent; border-top: 2px solid #000; }
  .jobs .box .diagram li:nth-of-type(2) { background-color: transparent; }
  .jobs .box .diagram li:nth-of-type(3) { background-color: transparent; }
  .jobs .box .diagram li:nth-of-type(4) { background-color: transparent; }
  .jobs .box .diagram li:nth-of-type(4) span { background-color: #D00000; }
  .jobs .box .diagram li div { display: flex; align-items: center; }
  .jobs .box .diagram li span { background-color: #000; width: 7.65432vw; height: 7.65432vw; font-size: 3.05556vw; font-weight: 500; color: #fff; text-align: center; line-height: 7.65432vw; border-radius: 100%; margin-bottom: 0; margin-right: 2.46914vw; }
  .jobs .box .diagram li strong { font-size: 3.05556vw; font-weight: 600; color: #000; }
  .jobs .box .list { font-size: 2.34568vw; }
  .jobs .box .contact p { font-size: 2.34568vw; } }

@media screen and (max-width: 768px) { .jobs .visual { margin: 0 -18px 40px; height: 329px; background: url("/lib/img/recruit/m_job_img.png") center center/cover no-repeat; }
  .jobs .panel { padding: 34px 23px; }
  .jobs .box { padding-bottom: 20px; margin-bottom: 20px; }
  .jobs .box:nth-of-type(3) { padding-bottom: 40px; margin-bottom: 40px; }
  .jobs .box:nth-of-type(3) .txt h4 { margin-bottom: 21px; }
  .jobs .box .txt h4 { margin-bottom: 15px; font-size: 17px; }
  .jobs .box .txt p { font-size: 12px; }
  .jobs .box .txt h4 + p { margin-bottom: 32px; }
  .jobs .box .diagram li { padding: 22px 0; }
  .jobs .box .diagram li span { width: 41px; height: 41px; font-size: 16px; line-height: 41px; margin-right: 13px; }
  .jobs .box .diagram li strong { font-size: 16px; }
  .jobs .box .list { font-size: 12px; }
  .jobs .box .contact p { font-size: 12px; } }

.floor .grid { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: minmax(400px, auto); gap: 100px 35px; }

.floor .item:nth-of-type(1) { grid-row: 1 / span 2; }

.floor .item:nth-of-type(4) { grid-column: 1 / span 2; }

.floor .item h3 { font-size: 40px; font-weight: 700; color: #000; }

.floor .item .modal { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); opacity: 0; display: flex; justify-content: center; align-items: center; visibility: hidden; transform: scale(1.1); z-index: 10; }

.floor .item .modal.show-modal { opacity: 1; visibility: visible; transform: scale(1); transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s; }

.floor .item .modal_inner { position: relative; max-width: 1620px; max-height: 1024px; }

.floor .item .modal_inner .swiper-button-next, .floor .item .modal_inner .swiper-button-prev { width: 48px; height: 49px; }

.floor .item .modal_inner .swiper-button-next::after, .floor .item .modal_inner .swiper-button-prev::after { display: none; }

.floor .item .modal_inner .swiper-button-next i, .floor .item .modal_inner .swiper-button-prev i { width: 48px; height: 49px; }

.floor .item .modal_inner .swiper-pagination { bottom: 109px; }

.floor .item .modal_inner .swiper-pagination-bullet { width: 14px; height: 15px; margin: 0 10px; background-color: #fff; opacity: 0.5; }

.floor .item .modal_inner .swiper-pagination-bullet-active { opacity: 1; }

.floor .item .modal_inner .swiper-button-prev { left: 80px; }

.floor .item .modal_inner .swiper-button-next { right: 80px; }

.floor .item .modal_inner img { display: block; width: 100%; height: 50%; max-height: 1024px; }

.floor .item .modal button { position: absolute; right: 50px; top: 50px; z-index: 10; }

.floor .item .modal button i { width: 30px; height: 30px; }

.box.bg1 { position: relative; margin-top: 42px; min-height: 400px; background: url("/lib/img/office/bg1.png") center center/cover no-repeat; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; height: 982px; }

.box.bg1:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.box.bg1 button { position: absolute; right: 30px; top: 35px; background: transparent; }

.box.bg1 i { width: 30px; height: 30px; }

.box.bg2 { position: relative; margin-top: 42px; min-height: 400px; background: url("/lib/img/office/bg2.png") center center/cover no-repeat; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.box.bg2:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.box.bg2 button { position: absolute; right: 30px; top: 35px; background: transparent; }

.box.bg2 i { width: 30px; height: 30px; }

.box.bg3 { position: relative; margin-top: 42px; min-height: 400px; background: url("/lib/img/office/bg3.png") center center/cover no-repeat; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.box.bg3:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.box.bg3 button { position: absolute; right: 30px; top: 35px; background: transparent; }

.box.bg3 i { width: 30px; height: 30px; }

.box.bg4 { position: relative; margin-top: 42px; min-height: 400px; background: url("/lib/img/office/bg4.png") center center/cover no-repeat; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.box.bg4:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.box.bg4 button { position: absolute; right: 30px; top: 35px; background: transparent; }

.box.bg4 i { width: 30px; height: 30px; }

.box.bg5 { position: relative; margin-top: 42px; min-height: 400px; background: url("/lib/img/office/bg5.png") center center/cover no-repeat; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.box.bg5:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.box.bg5 button { position: absolute; right: 30px; top: 35px; background: transparent; }

.box.bg5 i { width: 30px; height: 30px; }

.box.bg6 { position: relative; margin-top: 42px; min-height: 400px; background: url("/lib/img/office/bg6.png") center center/cover no-repeat; overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }

.box.bg6:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.box.bg6 button { position: absolute; right: 30px; top: 35px; background: transparent; }

.box.bg6 i { width: 30px; height: 30px; }

@media screen and (max-width: 1640px) { .floor .item .modal_inner { width: 90%; } }

@media screen and (max-width: 1024px) { .floor .grid { display: grid; grid-template-columns: 1fr; grid-auto-rows: minmax(400px, auto); gap: 0; }
  .floor .item { margin-top: 7.40741vw; padding-top: 7.40741vw; border-top: 2px solid #efefef; }
  .floor .item:nth-of-type(1) { grid-row: auto; max-height: none; margin-top: 0; padding-top: 0; border-top: none; }
  .floor .item:nth-of-type(4) { grid-column: auto; }
  .floor .item h3 { font-size: 4.93827vw; }
  .box button { display: none; }
  .box.bg1 { height: auto; } }

@media screen and (max-width: 768px) { .floor .item h3 { font-size: 27px; } }

@media screen and (max-height: 1400px) { .floor .item .modal_inner { width: 80%; height: 80%; }
  .floor .item .modal_inner img { max-height: 1000px; } }

@media screen and (max-height: 1200px) { .floor .item .modal_inner img { max-height: 800px; } }

/* 2022-10 회사소개 리뉴얼 */
/* common */
html { box-sizing: border-box; scroll-behavior: smooth; scroll-padding-top: 120px; }

*, *::after, *::before { box-sizing: inherit; }

body { font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; }

/* blind */
.blind { position: absolute; left: -9999999px; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); overflow: hidden; opacity: 0; white-space: nowrap; }

/* common - responsive */
.only_pc { display: block !important; }

.only_mobile { display: none !important; }

/* common - divider */
.divider { width: 100%; height: 2px; background-color: #efefef; margin: 123px 0; }

.tag { display: inline-flex; justify-content: center; align-items: center; padding: 0 24px; height: 40px; font-size: 18px; font-weight: 500; color: #fff; background-color: #D00000; border-radius: 20px; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: keep-all; }

.cate { position: relative; display: inline-flex; margin-left: 55px; padding: 13px 14px 12px; border-radius: 20px; background-color: #ededed; font-size: 18px; font-weight: 500; color: #000; }

.cate::after { content: ""; position: absolute; left: 0; bottom: 0; width: 0px; height: 0px; border-top: 10px solid none; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #ededed; }

.cate i { position: absolute; display: block; left: -55px; top: 50%; margin-top: -20px; }

.img_wrap { display: block; }

.img_wrap img { width: 100%; }

.card_list { display: flex; }

.card_list.col3 { display: flex; flex-wrap: wrap; }

.card_list.col3 > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (3 - 1) * 47px) / 3); margin-bottom: 47px; }

.card_list.col3 > *:not(:last-child) { margin-right: 47px; }

.card_list.col3 > *:nth-child(3n) { margin-right: 0; }

.card_list.col2 { display: flex; flex-wrap: wrap; }

.card_list.col2 > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (2 - 1) * 54px) / 2); margin-bottom: 54px; }

.card_list.col2 > *:not(:last-child) { margin-right: 54px; }

.card_list.col2 > *:nth-child(2n) { margin-right: 0; }

.card_list.media { display: flex; flex-wrap: wrap; }

.card_list.media > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (3 - 1) * 40px) / 3); margin-bottom: 40px; }

.card_list.media > *:not(:last-child) { margin-right: 40px; }

.card_list.media > *:nth-child(3n) { margin-right: 0; }

.card { overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; height: fit-content; }

.card:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }

.card.type1 .info_container { padding: 28px 35px 43px; }

.card.type2 .info_container { padding: 35px 35px 29px; }

.card.type3 .info_container { padding: 30px 10px 35px 32px; }

.card.type3 .info_container .title { margin-top: 0; min-height: auto; }

.card.type3 .info_container .desc { font-size: 16px; margin-top: 24px; line-height: 1.63; }

.card.media .img_wrap { padding-bottom: 56.25%; }

.card.media .img_wrap .cover_img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; }

.card.media .img_wrap::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); z-index: 2; }

.card.media .info_container { padding: 29px 30px 34px 23px; }

.card.media .info_container .date { position: absolute; top: 43px; right: 30px; }

.card.media .info_container .cate i { width: 44px; height: 44px; }

.card.media .info_container .title { min-height: 72px; }

.card.active .card_layer { opacity: 1; left: 0; top: 0; width: 100%; height: 100%; z-index: 11; height: 100%; width: 100%; padding: 90px 30px 0; }

.card .card_layer { position: absolute; opacity: 0; height: 0; width: 0; transition: all 0.4s ease; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; background-color: #D00000; color: #fff; z-index: -1; }

.card .card_layer p { font-size: 18px; font-weight: 400; line-height: 1.67; color: #fff; }

.card .card_layer li { position: relative; padding-left: 10px; margin-bottom: 10px; font-size: 18px; color: #fffefe; line-height: 1.5; }

.card .card_layer li::after { content: ""; position: absolute; left: 0; top: 13px; margin-top: -2px; width: 4px; height: 4px; background-color: #fffefe; border-radius: 100%; }

.card .card_layer button { position: absolute; right: 30px; top: 30px; }

.card .card_layer i { width: 30px; height: 30px; }

.card .info_container .title { margin-top: 29px; font-size: 26px; color: #000; font-weight: 600; line-height: 1.38; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; word-break: keep-all; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.card .info_container .desc { margin-top: 21px; font-size: 15.5px; font-weight: 400; line-height: 1.71; color: #555; word-break: keep-all; }

.card .info_container .date { font-size: 17px; font-weight: 400; color: #888; }

.card .img_wrap { position: relative; width: 100%; overflow: hidden; }

.btn_more { position: absolute; right: 30px; top: 30px; }

.icon_more { display: block; width: 30px; height: 30px; }

.icon_more2 { display: block; width: 30px; height: 30px; }

.btn_container { display: flex; justify-content: center; align-items: center; }

.btn { display: flex; justify-content: center; align-items: center; }

.btn .link { position: relative; display: inline-flex; justify-content: center; align-items: center; padding: 36px 0 35px; width: 370px; font-size: 20px; font-weight: 600; text-align: center; color: #fff; background-color: #000; border-radius: 45px; }

.btn i { position: absolute; display: block; right: 47px; top: 50%; width: 9px; height: 15px; margin-top: -8px; }

.btn + .btn { margin-left: 40px; }

@media screen and (max-width: 1024px) { /* common - responsive */
  .only_pc { display: none !important; }
  .only_mobile { display: block !important; }
  .divider { margin: 7.40741vw 0; }
  .tag { padding: 1.7284vw 2.71605vw; height: auto; font-size: 2.25309vw; border-radius: 40px; }
  .btn_container { flex-direction: column; }
  .btn + .btn { margin-left: 0px; margin-top: 2.09877vw; }
  .card_list.col3 { display: flex; flex-wrap: wrap; }
  .card_list.col3 > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (1 - 1) * 7.53086vw) / 1); margin-bottom: 7.53086vw; }
  .card_list.col3 > *:not(:last-child) { margin-right: 7.53086vw; }
  .card_list.col3 > *:nth-child(1n) { margin-right: 0; }
  .card_list.col2 { display: flex; flex-wrap: wrap; }
  .card_list.col2 > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (1 - 1) * 7.53086vw) / 1); margin-bottom: 7.53086vw; }
  .card_list.col2 > *:not(:last-child) { margin-right: 7.53086vw; }
  .card_list.col2 > *:nth-child(1n) { margin-right: 0; }
  .card_list.media { display: flex; flex-wrap: wrap; }
  .card_list.media > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (1 - 1) * 7.53086vw) / 1); margin-bottom: 7.53086vw; }
  .card_list.media > *:not(:last-child) { margin-right: 7.53086vw; }
  .card_list.media > *:nth-child(1n) { margin-right: 0; }
  .card { overflow: hidden; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.4); transform: translateY(0); transition: all .3s ease; }
  .card:hover { transform: translateY(-5px); box-shadow: 0 0 40px 0 rgba(187, 187, 187, 0.5); }
  .card.type2 .info_container { padding: 4.19753vw 3.33333vw 5.80247vw 4.32099vw; }
  .card.type3 .info_container { padding: 4.44444vw 3.58025vw 5.30864vw 4.32099vw; }
  .card.type3 .info_container .title { max-width: 340px; font-size: 3.76543vw; }
  .card.type3 .info_container .desc { margin-top: 3.08642vw; font-size: 2.34568vw; }
  .card.media .info_container .title { min-height: auto; }
  .card .info_container .title { font-size: 3.30247vw; min-height: auto; }
  .card .img_wrap { padding-bottom: 56.25%; }
  .card .img_wrap .cover_img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; }
  .card .img_wrap::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); z-index: 2; } }

@media screen and (max-width: 768px) { .divider { width: auto; margin: 40px 18px; }
  .tag { padding: 8px 14px; font-size: 14px; }
  .btn i { right: 37px; top: 50%; width: 7px; height: 11px; margin-top: -5px; }
  .btn .link { padding: 28px 0; width: 290px; font-size: 15px; }
  .icon_more { display: block; width: 24px; height: 24px; }
  .icon_more2 { display: block; width: 24px; height: 24px; }
  .card_list.col3 { display: flex; flex-wrap: wrap; }
  .card_list.col3 > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (1 - 1) * 40px) / 1); margin-bottom: 40px; }
  .card_list.col3 > *:not(:last-child) { margin-right: 40px; }
  .card_list.col3 > *:nth-child(1n) { margin-right: 0; }
  .card_list.col3 .card:nth-last-of-type(1) { margin-bottom: 0; }
  .card_list.col2 { display: flex; flex-wrap: wrap; }
  .card_list.col2 > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (1 - 1) * 40px) / 1); margin-bottom: 40px; }
  .card_list.col2 > *:not(:last-child) { margin-right: 40px; }
  .card_list.col2 > *:nth-child(1n) { margin-right: 0; }
  .card_list.col2 .card:nth-last-of-type(1) { margin-bottom: 0; }
  .card_list.media { display: flex; flex-wrap: wrap; }
  .card_list.media > * { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% - (1 - 1) * 40px) / 1); margin-bottom: 40px; }
  .card_list.media > *:not(:last-child) { margin-right: 40px; }
  .card_list.media > *:nth-child(1n) { margin-right: 0; }
  .card .card_layer i { width: 24px; height: 24px; }
  .card.type1 .info_container { padding: 23px 23px 20px; }
  .card.type2 .info_container { padding: 23px 23px 16px; }
  .card.type3 .info_container { padding: 24px 24px 30px 24px; }
  .card.type3 .info_container .title { font-size: 20px; }
  .card.type3 .info_container .desc { margin-top: 16px; font-size: 16px; }
  .card.media .info_container { padding: 18px 24px 13px; }
  .card.media .info_container .cate i { width: 36px; height: 36px; }
  .card.media .info_container .date { top: 27px; right: 25px; font-size: 11px; }
  .card.media .info_container .title { margin-top: 21px; font-size: 17px; }
  .card.active .card_layer { padding: 61px 29px; }
  .card .card_layer li { font-size: 16px; }
  .card .card_layer p { font-size: 16px; }
  .card .info_container .title { margin-top: 22px; max-width: 320px; font-size: 17px; }
  .card .info_container .desc { margin-top: 13px; font-size: 12px; }
  .cate { margin-left: 43px; padding: 8px 14px; font-size: 12px; }
  .cate i { margin-top: -18px; left: -43px; }
  .main .gmv .grid .item .cate i { width: 36px; height: 36px; } }