@charset "utf-8";

/* common */
#subWrap { padding-top: var(--header-H);}
.sub-visual { overflow: hidden; }
.sub-visual .inner { position: relative; display: flex; flex-wrap: wrap; gap: 20px; justify-content: space-between; padding-top: 20px; z-index: 5; }
.sub-visual .main-title { font-family: var(--font-Mix); font-size: clamp(34px,3.125vw,60px); font-weight: 600; color: #000; animation: textRight 0.6s 0.2s ease-out both; }
.visual-img { position: relative; width: 100%; height: clamp(160px,26.04vw,500px); background-color: #aaa; }
.navigation { display: flex; align-items: center; column-gap: 46px; animation: textLeft 0.6s 0.2s ease-out both; }
.navigation > li { position: relative; }
.navigation > li::before { content: ""; position: absolute; left: -26px; top: 50%; display: block; width: 6px; height: 6px; background-color: #DDDDDD; transform: translateY(-50%); }
.navigation > li:first-child::before { display: none; }
.navigation > li.home > a { display: block; width: 30px; height: 30px; background: url("/img/common/icon_home.svg") no-repeat center center/auto var(--main-color3); }
.navigation > li > a, .navigation > li > span { font-family: var(--font-Mix); font-size: 18px; font-weight: 500; color: #333; }

.container { overflow: hidden; }
.content { padding-top: 60px; padding-bottom: 100px; }
.content.pt20 { padding-top: 20px; }
.content .section + .section { margin-top: 100px; }
.content__title { font-family: var(--font-Mix); margin-bottom: 100px; font-size: clamp(32px,3.64vw,70px); font-weight: 600; color: #111; text-align: center; }
.content__text { margin-bottom: 60px; font-size: 20px; color: #333; }
.sub__title { font-family: var(--font-Mix); margin-bottom: 30px; font-size: clamp(24px,2.08vw,40px); font-weight: 600; color: #111; }
.sub__text { font-size: 20px; font-weight: 300; line-height: 1.7; color: #333; }

/* board */
.paging a { border: none; }
.paging a { width: 30px; height: 30px; font-family: var(--font-Oxanium); font-size: 18px; line-height: 1; font-weight: 600; letter-spacing: 0; color: #AAA; }
.paging ul { margin: 0 10px; }
.paging ul li a { padding-top: 0.1em; }
.paging ul li.on a { color: #000; background-color: transparent; }
.paging ul li:not(:last-child) { margin-right: 10px; }
.paging a i { width: 10px; height: 16px; }
.paging a i::before { display: none; }
.paging .arr a:not(:last-child) { margin-right: 10px; }
.paging .arr a.last i, .paging .arr a.first i { transform: none; }
.paging a i.xi-angle-left-min { background: url("/img/common/page_prev.svg") no-repeat center center/contain; }
.paging a i.xi-angle-right-min { background: url("/img/common/page_next.svg") no-repeat center center/contain; }
.img_borad_list{display: flex; flex-wrap:wrap; gap: 20px; }
.img_borad_list .item{ position: relative; cursor: pointer; width: calc((100% - 60px)/4); padding: 28px; border: 3px solid #EEE; transition: 0.3s ease-out; }
.img_borad_list .item a{position: absolute;top: 0; left: 0; right: 0;bottom: 0;}
.img_borad_list .item figure{position: relative; overflow: hidden;}
.img_borad_list .item figure::before { content: ""; display: block; width: 100%; padding-top: 138.46%; }
.img_borad_list .item figure .icon-view { position: absolute; left: 50%; top: 50%; width: 50px; height: 50px; background-color: var(--main-color3); transform: translate(-50%, -50%) scale(0.8); z-index: 5; transition: 0.3s ease-out; visibility: hidden; opacity: 0; pointer-events: none; }
.img_borad_list .item figure .icon-view > img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(90deg) ; transition: 0.3s ease-out; }
.img_borad_list .item figure > img {position: absolute; top: 50%; left: 50%; width: 100%; min-height: 100%; object-fit: contain; transform: translate(-50%,-50%);}
.img_borad_list .item .txt { margin-top: 20px; }
.img_borad_list .item .txt .title { font-size: 20px; color: #333; text-align: center; }
.img_box_list { display: flex; flex-wrap:wrap; gap: 20px; }
.img_box_list .item { width: calc((100% - 60px)/4); padding: 68px 28px; border: 3px solid #EEE; text-align: center; }
.img_box_list .item figure{position: relative; overflow: hidden;}
.img_box_list .item .txt p { font-size: 20px; font-weight: 300; color: #333; }
.img_box_list .item .txt .date { font-family: var(--font-Oxanium); font-size: 60px; font-weight: 600; letter-spacing: 0; color: #111; }
.img_borad_list .item:hover { border-color: var(--main-color3); }
.img_borad_list .item:hover figure .icon-view { visibility: visible; opacity: 1; transform: translate(-50%, -50%) scale(1); }
.img_borad_list .item:hover figure .icon-view > img { transform: translate(-50%, -50%) rotate(0); }
.board_box{border-top: 3px solid #000;}
.board_box table tr{position: relative; border-bottom: 1px solid #DDD; }
.board_box table th{position: relative;}
.board_box table th::after{content:""; position: absolute; top: 50%; right: 0; width: 1px; height: 15px; transform: translateY(-50%);}
.board_box table th:last-of-type::after{display: none;}
.board_box table td{ padding: 0 30px; text-align: center; }
.board_box table td.date, .board_box table td.hit { font-family: var(--font-Oxanium); font-size: 18px; font-weight: 300; letter-spacing: 0; color: #999; }
.board_box table td a{width: 100%; display: inline-block; padding-block: 35px; vertical-align: top; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; font-size: 20px; font-weight: 500; color: #333;}
.board_box table .notice td { position: relative; }
.board_box table .notice td:first-child{ text-align: left; }
.board_box table .notice td a { padding-left: 100px; }
.board_box table .notice td .tag { position: absolute; display: block; left: 30px; top: 50%; width: 70px; font-family: var(--font-Oxanium); font-size: 16px; font-weight: 600; letter-spacing: 0; line-height: 30px; background-color: var(--main-color2); color: var(--main-color); text-align: center; transform: translateY(-50%); }

.search__area { margin-bottom: 30px; }
.search__area form { display: flex; align-items: center; height: 60px; gap: 10px; }
.search__area .search-select { width: 220px; height: 100%; border: none; padding: 0 24px; font-size: 18px; font-weight: 500; color: #333; background: url("/img/common/select_arrow.svg") no-repeat calc(100% - 24px) center/auto #F5F5F5; }
.search__area .search-input { width: 360px; height: 100%; border: none; padding: 0 24px; font-size: 18px; font-weight: 500; color: #333; background-color: #F5F5F5; }
.search__area .btn-search { width: 60px; height: 60px; border: none; background: url("/img/common/icon_search.svg") no-repeat center center/auto var(--main-color3); }

.view_ctn .tit { padding-bottom: 60px; border-bottom: 3px solid #000; }
.view_ctn .tit h2 { font-size: clamp(24px,3.125vw,60px); font-weight: 500; color: #111; }
.view_ctn .tit ul { overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; margin-top: 30px; }
.view_ctn .tit ul li { position: relative; display: flex; gap: 10px; font-family: var(--font-Oxanium); font-size: 18px; font-weight: 300; letter-spacing: 0; color: #666; }
.view_ctn .tit ul li:not(:last-child) { padding-right: 66px; }
.view_ctn .tit ul li:not(:nth-child(1))::before { content: ""; position: absolute; left: -36px; top: 50%; display: block; width: 6px; height: 6px; background-color: #DDD; transform: translateY(-50%); }
.view_ctn .tit ul li span { font-family: inherit; font-weight: 500; letter-spacing: inherit; color: #333; }
.view_ctn .info { padding: 100px 60px 200px; font-size: 16px; }
.view_ctn .file_box { width: calc(100% - 120px); margin-inline: auto; padding: 50px 100px; background-color: #F5F5F5; }
.view_ctn .file_box dl { display: flex; gap: 66px; }
.view_ctn .file_box dl + dl { margin-top: 15px; }
.view_ctn .file_box dt { position: relative; width: 137px; padding: 8.5px 0; font-family: var(--font-Oxanium); font-size: 18px; font-weight: 500; letter-spacing: 0; color: #333; text-transform: capitalize; }
.view_ctn .file_box dt > span { font-family: inherit; line-height: inherit; font-weight: inherit; }
.view_ctn .file_box dt::after { content: ""; position: absolute; right: -36px; top: 50%; display: block; width: 6px; height: 6px; background-color: #DDD; transform: translateY(-50%); }
.view_ctn .file_box dd { width: calc(100% - 202px); font-size: 18px; font-weight: 300; color: #666; }
.view_ctn .file_box dd a { position: relative; display: block; width: 100%; padding-block: 8.5px; padding-right: 175px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.view_ctn .file_box dd a .download { position: absolute; right: 0px; top: 50%; font-family: var(--font-Oxanium); font-size: 18px; font-weight: 500; letter-spacing: 0; color: #333; transform: translateY(-50%); }
.view_ctn .file_box dd a .download::after { content: ""; display: inline-block; width: 40px; height: 40px; margin-left: 20px; background: url("/img/common/icon_download.svg") no-repeat center center/auto var(--main-color3); vertical-align: middle; }
.view_ctn .pages { display: flex; justify-content: space-between; align-items: center; margin-top: 150px; }
.view_ctn .pages .btn-page a { font-family: var(--font-Oxanium); font-size: 22px; font-weight: 700; letter-spacing: 0; color: #111; }
.view_ctn .pages .btn-bracket { width: 286px; }

/* company */
/* .sv01 .visual-img { background: url("/img/sub/visual_company.jpg") no-repeat center center/cover; } */
.about-main .flex { display: flex; flex-wrap: wrap; gap: 10px;}
.about-main .img-box { width:37.5%; }
.about-main .about-text { position: relative; display: flex; align-items: flex-end; width: calc(62.5% - 10px); padding: 40px; color: #fff; background-color: #221E1F; text-align: right; }
.about-text .text-box { width: 100%; }
.about-text .text-box > em { font-size: 40px; font-weight: 500; line-height: 1; }
.about-text .text-box .sub-title { font-family: var(--font-Oxanium); font-size: 20px; font-weight: 500; letter-spacing: 0; color: #fff; opacity: 0.3; text-transform: capitalize; }
.about-text .text-box .main-title { margin-top: 30px; font-size: 46px; font-weight: 500; line-height: 1; }
.about-text .text-box .text { margin-top: 30px; font-size: 18px; font-weight: 200; color: #fff; }
.about-text .text-box .text p { line-height: 1.7; }
.about-text .text-box .text p + p { margin-top: 1em;}
.about__content .about-text .text-box .text { margin-top: 20px; }
.about-main .box {  display: flex; flex-direction: column; justify-content: space-between; width: calc(50% - 10px); height: 360px; margin-top: 20px; padding: 30px; background-color: #F5F5F5; }
.about-main .box .title { font-size: 20px; font-weight: 500; }
.about-main .box .value { font-family: var(--font-Mix); font-size: clamp(20px,1.56vw,30px); font-weight: 500; }
.about-main .box .value .font-ox { font-size: clamp(24px,2.6vw,50px); font-weight: 600; }
.about-main .box .value .font-ox.fs-inherit { font-size: inherit; }
.about-main .box.color { background-color: var(--main-color); }
.about-info { margin-top: 10px; }
.about-info__list { display: flex; flex-wrap: wrap; gap: 10px; }
.about-info__list > li { position: relative; display: flex; align-items: flex-end; width: calc((100% - 60px)/7); height: 150px; padding: 18px; border: 2px solid #221E1F; }
.about-info__list > li .label { position: absolute; left: -2px; top: -2px; padding: 8.5px 15px; background-color: var(--main-color3); font-size: 18px; font-weight: 500; color: #fff; }
.about-info__list > li p { font-size: 20px; font-weight: 500; color: #111; }
.about-info__list > li p .sub { font-size: 0.8em; font-weight: 300; color:  #333; }

.greeting__wrap { display: flex; flex-wrap: wrap; justify-content: space-between; }
.greeting__wrap .text__area { position: sticky; top: var(--header-H); height: 100%; }
.greeting__wrap .text__area { width: 62.5%; }
.greeting__wrap .img__area { width: 31.25%; }
.greeting__wrap .title { margin-bottom: 50px; font-size: 46px; font-weight: 500; line-height: 1.3; color: #111; }
.greeting__wrap .text-box p { font-size: 20px; font-weight: 300; line-height: 1.7; color: #333; }
.greeting__wrap .text-box p + p { margin-top: 1em; }
.greeting__wrap .ceo { display: flex; align-items: center; column-gap: 10px; margin-top: 60px; }
.greeting__wrap .ceo span { font-size: 20px; color: #333; }
.greeting__wrap .ceo b { font-size: 24px; font-weight: 500; color: #111; }
.greeting__wrap .img__area .img-box + .img-box { margin-top: 30px; }

.vision__text { font-size: 28px; color: #222; }
.value__list { display: flex; flex-wrap: wrap; gap: 20px; }
.value__list + .value__list { margin-top: 20px; }
.value__list > li { position: relative; display: flex; width: calc((100% - 60px)/4); height: 240px; border: 2px solid #F5F5F5; padding: 28px; background-color: #F5F5F5; }
.value__list > li.title { justify-content: center; align-items: center; background-color: var(--main-color3); }
.value__list > li.title::before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.value__list:nth-child(1) > li.title::before { content: url("/img/sub/num_01.svg"); }
.value__list:nth-child(2) > li.title::before { content: url("/img/sub/num_02.svg"); }
.value__list:nth-child(3) > li.title::before { content: url("/img/sub/num_03.svg"); }
.value__list:nth-child(4) > li.title::before { content: url("/img/sub/num_04.svg"); }
.value__list:nth-child(even) > li:not(.title) { border-color: #EEEEEE; background-color: #fff; } 
.value__list > li.title .value-title { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; z-index: 5; }
.value__list > li.title .value-title span { margin-bottom: 0.5em; font-size: 20px; font-weight: 600; color: var(--main-color); }
.value__list > li.title .value-title b { font-size: 32px; font-weight: 500; color: #fff; }
.value__list > li .icon { position: absolute; left: -2px; top: -2px; }
.value__list > li .box { display: flex; align-items: flex-end; height: 100%; }
.value__list > li .text-box dt { font-size: 24px; font-weight: 500; color: #222; }
.value__list > li .text-box dd { margin-top: 0.5em; font-size: 20px; line-height: 1.7; font-weight: 300; color: #333; word-break: break-all; }

.history__wrap { position: relative; display: block; }
.history__wrap .line { position: absolute; left: 16.625%; top: 0; width: 4px; height: 100%; background-color: #DDDDDD; z-index: 1; }
.history__wrap .line > .bar { position: absolute; display: block; left: 0; top: 0; width: 4px; height: var(--line-H); max-height:100%; min-height: 0px; background-color: var(--main-color3); transition: 0.3s ease-out; }
.history__wrap .line > .bar::after { content: ""; position: absolute; left: -6px; bottom: 0; display: block; width: 15px; height: 15px; background-color: var(--main-color3); }
.history__item { display: flex; justify-content: space-between; gap: 40px; }
.history__item + .history__item { margin-top: 60px; }
.history__item .year { position: relative ;display: inline-block; height: fit-content; font-family: var(--font-Oxanium); font-size: 50px; font-weight: 600; letter-spacing: 0; color: #AAAAAA; }
.history__item .year::after { content: attr(data-text); overflow: hidden; position: absolute; left: 0; top: 0; color: transparent; background: no-repeat 0 center /0 100% linear-gradient(#000 0 0); -webkit-background-clip: text; background-clip: text; white-space: nowrap; transition: background-size 0.6s ease-out; transition-delay: 0.2s; }
.history__item .year.on::after { background-size: 100% 100%; }
.history__item .year-content { width: 73.75%; }
.history__box + .history__box { margin-top: 20px; }
.history-text { display: flex; align-items: baseline; column-gap: 20px;}
.history-text .month { width: 40px; font-family: var(--font-Oxanium); font-size: 24px; font-weight: 500; letter-spacing: 0; color: #333; }
.history-text .text { max-width: calc(100% - 60px); font-family: var(--font-Pretendard); font-size: 20px; font-weight: 300; color: #666; }
.history-img { margin-top: 20px; display: flex; gap:10px; }
[data-aos="text-fill"] { position: relative; display: inline-block; color: #DDDDDD; }
[data-aos="text-fill"]::after { content: attr(data-text); overflow: hidden; position: absolute; left: 0; top: 0; color: transparent; background: no-repeat 0 center /0 100% linear-gradient(#000 0 0); -webkit-background-clip: text; background-clip: text; white-space: nowrap; transition: background-size 0.6s ease-out; transition-delay: 0.2s; }
[data-aos="text-fill"].aos-animate::after { background-size: 100% 100%; }

.global__content { overflow: hidden; padding-top: min(670px,calc(48.95% - 14.06vw)); padding-bottom: 0; }
.global__content .world-map { overflow: hidden; position: absolute; left: 50%; top: 0; width: 100%; max-width: 1920px; margin: 0 auto; transform: translateX(-50%); z-index: 1; }
.global__content .world-map svg { width: 100%; backface-visibility: hidden; transform: translateZ(0); }
.global__content .world-map svg * { shape-rendering:geometricPrecision; transform-box: fill-box; }
.global__content .inner.summary { position: relative; transform: translateY(-100%); z-index: 5;}
.corporate__list { display: flex; flex-wrap: wrap; gap: 20px; }
.corporate__item { position: absolute; left: 0; top: 0; width: max-content; padding: 30px; background-color: var(--main-color3); color: #fff; transform: translate(-50%, 10px); box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.3); visibility: hidden; opacity: 0; z-index: 10; transition: transform 0.3s ease-out, visibility 0.3s ease-out ,opacity 0.3s ease-out; z-index: 10; }
.corporate__item.reverse { transform: translate(-50%, calc(-100% - 10px)); }
.n-box + g > .plus { transition: transform 0.3s ease-out; transform-origin: center center; }
.n-box.on + g > .plus { transform: rotate(-180deg); }
.corporate__item.on { visibility: visible; opacity: 1; transform: translate(-50%, 0px); }
.corporate__item.reverse.on { visibility: visible; opacity: 1; transform: translate(-50%, -100%); }
.corporate__item .title { display: none; margin-bottom: 10px; font-size: 18px; font-weight: 600; }
.corporate__item dl { display: flex; font-size: 18px; }
.corporate__item dl + dl { margin-top: 10px; }
.corporate__item dt { width: 85px; font-weight: 500; }    
.corporate__item dd { width: calc(100% - 85px); font-weight: 200; }
.global-summary { width: 100%; }
.global__list { display: flex; flex-wrap: wrap; gap: 14px; }
.global__item { display: flex; flex-direction: column; justify-content: space-between; align-items: center; width: calc((100% - 70px)/6); height: 157px; padding: 30px 10px; background-color: #F5F5F5; text-align: center; }
.global__item .nation { display: flex; align-items: center; gap:15px; }
.global__item .nation img { width: 30px; }
.global__item .nation span { font-family: var(--font-Oxanium); font-size: 20px; font-weight: 600; letter-spacing: 0; text-transform: uppercase; }
.global__item .value { display: flex; align-items: center; column-gap: 10px; font-size: 20px; font-weight: 500; color: #000; }
.global__item .value > b { font-family: var(--font-Oxanium); font-size: 36px; font-weight: 600; letter-spacing: 0; color: #000; }
.global__item .value:not(:has(b)) { padding-bottom: 10px; }
.global__item.total { background-color: var(--main-color2); }
.global__item.total > p { font-size: 18px; font-weight: 500; color: #fff; }
.global__item.total > p > small { font-size: 0.89em; }
.global__item.total .value, .global__item.total .value * { color: var(--main-color); }
.global-summary .etc-text { margin-bottom: 10px; font-size: 18px; font-weight: 300; color: #666; text-align: right;}

.map__wrap { position: relative; }
.tab { display: flex; align-items: center; }
.tab-type-box { position: absolute; left: 20px; top: 20px; column-gap: 10px; z-index: 10; }
.tab-type-box .tab__item { display: flex; justify-content: center; align-items: center; height: 50px; padding: 0 65.5px; border: 2px solid var(--main-color3); font-size: 18px; font-weight: 500; color: var(--main-color3); background-color: #fff; text-align: center; }
.tab-type-box .tab__item.on { background-color: var(--main-color3); color: #fff; }
.map__area { position: absolute; left: 0; top: 0; width: 100%; height: 100%; visibility: hidden; opacity: 0; pointer-events: none; z-index: 0; }
.map__area.on { position: static; visibility: visible; opacity: 1; pointer-events: auto; z-index: 1; display: flex; justify-content: space-between; align-items: flex-end; }
.map__box { overflow: hidden; width: 46.87%; height: 600px; }
.map__box .root_daum_roughmap { width: 100%; height: 100%; }
.root_daum_roughmap .wrap_map { height: 100% !important; }
.root_daum_roughmap .cont { display: none; }
.add-info__box { width: calc(53.13% - 100px); }
.add-info__box .title-box { margin-bottom: 30px; text-align: right; }
.add-info__box .title-box > span { font-size: 18px; font-weight: 600; color: #AAA; }
.add-info__box .title-box > .title { margin-top: 0.5em; font-size: clamp(24px,2.08vw,40px); font-weight: 500; color: #111; }
.line-info__list > li { display: flex; align-items: center; gap: 30px; padding: 30px; border-top: 3px solid #000; }
.line-info__list > li .text-box { width: calc(100% - 100px); }
.line-info__list > li .text-box dt { font-size: 20px; font-weight: 500; color: #222; }
.line-info__list > li .text-box dd { font-family: var(--font-Mix); margin-top: 0.5em; font-size: 20px; font-weight: 300; line-height: 1.3; color: #333; }

/* product */
/* .sv02 .visual-img { background: url("/img/sub/visual_product.jpg") no-repeat center center/cover; } */
.depth2-tab { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 60px; }
.depth2-tab .tab__item  { width: 150px; height: 50px; }
.depth2-tab .tab__item > a { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; padding: 1px 5px 0; border: 2px solid var(--main-color3); font-family: var(--font-Mix); font-size: 18px; font-weight: 500; color: var(--main-color3); text-align: center; }
.depth2-tab .tab__item.on > a { color: #fff; background-color: var(--main-color3); }
.product__content .area + .area { margin-top: 200px; }
.about-text .tag-logo { position: absolute; right: 0; top: 0; padding-left: 10px; padding-bottom: 10px; background-color: #fff; }
.about-text .tag-logo img { width: 150px; }

.product__wrap { display: flex; justify-content: space-between; align-items: flex-end; gap: 60px; }
.card-num__list { display: flex; flex-direction: column; gap: 10px; width: 25%; max-width: 400px; }
.card-num__item { position: relative; display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 179px; padding: 20px; background-color: #F5F5F5; }
.card-num__item .img-box { text-align: center; }
.card-num__item .num-box { position: absolute; left: 0; top: 0; width: 30px; }
.card-num__item .num-box .num { position: relative; display: inline-block; width: 100%; height: 100%; font-family: var(--font-Oxanium); font-size: 16px; font-weight: 700; letter-spacing: 0; color: #fff; line-height: 30px; background-color: var(--main-color3); text-align: center; z-index: 5; }
.card-num__item .num-box::before { content: ""; position: absolute; left: 0px; top: 0px; display: block; width: calc(100% + 10px); height: calc(100% + 10px); background-color: #fff; z-index: 1; }
.card-num__item .img-box img { mix-blend-mode: multiply; }
.card-num__item .text-box > .name { font-family: var(--font-Mix); font-size: 18px; font-weight: 500; color: #333; }
.card-num__item .text-box > .name > span { font-weight: 300; color: #666; }
.card-num__item .text-box > .text { margin-top: 10px; font-size: 18px; font-weight: 300; color: #666; }
.product-main { text-align: center; }
.product-main > p { display: inline-block; margin-top: 58px; padding: 17px 40px; font-size: 20px; font-weight: 500; color: #fff; background-color: var(--main-color3); text-align: center; }
.product__wrap.col { flex-direction: column; align-items: center; gap: 30px; }
.product__wrap.col .product-main > p { margin-top: 27px; }
.product__wrap.col .card-num__list { flex-direction: row; width: 100%; max-width: initial; }
.product__wrap.col .card-num__item { height: 240px; }
.step__row { display: flex; flex-wrap: wrap; align-items: center; gap: 20px;}
.step__row:nth-child(even) { flex-direction: row-reverse; }
.step__row + .step__row { margin-top: 20px; }
.step__row .product__item { position: relative; width: calc((100% - 40px)/3); }
.step__row .product__item::before { content: ""; position: absolute; left: -30px; top: 50%; display: block; width: 40px; height: 40px; border:2px solid var(--main-color3); background: url("/img/sub/process_arrow.svg") no-repeat calc(50% + 1px) center/auto #fff; box-sizing: border-box; transform: translateY(-50%); z-index: 5; }
.step__row:not(.col):first-child .product__item:last-child::after { content: ""; position: absolute; left: 50%; bottom: -30px; display: block; width: 40px; height: 40px; border:2px solid var(--main-color3); background: url("/img/sub/process_arrow.svg") no-repeat calc(50% + 1px) center/auto #fff; box-sizing: border-box; transform: translateX(-50%) rotate(90deg); z-index: 5; }
.step__row:not(:nth-child(even)) .product__item:first-child::before { display: none; }
.step__row:not(.col):nth-child(even) .product__item::before { transform: translateY(-50%) rotateY(180deg); }
.step__row:not(.col):nth-child(even) .product__item:last-child::before { display: none; }
.step__row .product__item .title-box { display: flex; justify-content: center; align-items: center; height: 60px; padding: 10px; background-color: var(--main-color3); font-size: clamp(16px,1.04vw,20px); font-weight: 500; color: #fff; text-align: center; }
.step__row .product__item .step { color: var(--main-color); }
.step__row .product__item .img-box { position: relative; border: 2px dashed var(--main-color3); border-top: none; text-align: center; }
.step__row .product__item .img-box::before { content: ""; display: block; width: 100%; padding-top: 40.38%; }
.step__row .product__item .img-box img, .step__row .product__item .img-box video { position: absolute; left: 50%; top: 50%; width: 100%; min-height: 100%; object-fit: contain; transform: translate(-50%, -50%); }
.step__row .product__item:nth-child(2) .img-box video { max-width: 64.8%; }
.step__row .product__item:nth-child(3) .img-box video { max-width: 62.1%; }
.product-step__wrap.flex { display: flex; gap: 50px; }
.step__row.col { flex-direction: column; width: 100%; margin-top: 0; }
.step__row.col .product__item { width: 100%; }
.step__row.col .product__item::before { left: 50%; top: -30px; transform: translateX(-50%) rotate(90deg); }
.step__row.col .product__item:first-child::before { display: none; }
.step__row.col .product__item .title-box { height: 70px; }
.step__row .product__item.line .title-box { border: 2px solid var(--main-color3); background-color: #fff; color: var(--main-color3); }

.table-item table { table-layout: fixed; width: 100%; border-top: 3px solid #000;border-top: 3px solid #000; }
.table-item table tr:not(:first-child) { border-top: 1px dashed #DDD; }
.table-item table tr:last-child { border-bottom: 1px solid #DDD; }
.table-item table thead tr:first-child {  border-bottom: none; }
.table-item table thead th { height: 70px; padding: 0 20px; font-size: 18px; font-weight: 500; color: #333; text-align: center; border-bottom: 1px solid #DDD;}
.table-item table thead.size-s th { height: 40px; } 
.table-item table tbody th, .table-item table td { height: 70px; padding: 20px; font-size: 18px; font-weight: 300; color: #666; text-align: center; }
.table-item table td.text-left { text-align: left; }
.table-item table tr.main-tr { border-top: 1px solid #DDD; }
.table-item table tr.main-tr th, .table-item table tr.main-tr td { font-weight: 500; color: #333; }
.table-item table th.color-dark { font-weight: 400; color: #333; }
.table-item table th.color-dark-500 { font-weight: 500; color: #333; }
.table-item table th.merge { border-right: 1px dashed #DDD; }
.table-item table td ul > li { position: relative; padding-left: 15px; text-align: left; }
.table-item table td ul > li::before { content: ""; position: absolute; left: 0; top: 0.5em; display: block; width: 5px; height: 5px; background-color: #AAAAAA; }
.table-item table td ul > li + li { margin-top: 0.5em; }
.table-item td.text-left { text-align: left; }
.table-item.font-ox th, .table-item.font-ox td { font-family: var(--font-Oxanium); font-size: 18px; letter-spacing: 0;  }
.table-item.font-ox th.color-dark { font-weight: 500; }
.table-item table tr.total { border-top: 1px solid #DDD; border-bottom: 1px solid #DDD; background-color: #F5F5F5; }
.table-item table tr.total th, .table-item table tr.total td { font-weight: 500; color: #333; }
.table-item table tr.total-line:not(:last-child) { border-top: 1px dashed #000; border-bottom: 1px dashed #000; }
.table-item table tr.total-line:last-child { border-top: 1px dashed #000; border-bottom: 1px solid #000; }
.table-item table tr.total-line th, .table-item table tr.total-line td { font-weight: 500; color: #333; }
.table-item .list-type-dot { margin-top: 30px; }
.table-item .list-type-dot li {padding-left: 15px; color: #666; }
.table-item .list-type-dot.none > li { padding-left: 0; }
.table-item .list-type-dot.none > li::before { display: none; }
.table-item .table-scroll { padding-bottom: 1px; }


/* rnd */
/* .sv03 .visual-img { background: url("/img/sub/visual_rnd.jpg") no-repeat center center/cover; } */
.line-card__list { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 60px; }
.line-card__item { position: relative; display: flex; flex-wrap: wrap; flex: 1; gap: 20px; padding: 30px; border: 2px solid var(--main-color3); text-align: center; }
.line-card__item > .tag { position: absolute; left: -2px; top: -2px; display: inline-block; padding: 8.5px 15px; font-size: 18px; font-weight: 500; color: #fff; background-color: var(--main-color3); }
.line-card__item .box { width: calc((100% - 40px)/3); }
.line-card__item .box .img-box > img { width: 100%; }
.line-card__item .box .text { margin-top: 15px; font-size: 18px; color: #333; }
.org-row + .line { width: 100%; max-width: 1100px; height: 20px; margin: 20px auto 0; border: 1px solid #DDD; border-bottom: none; }
.org-row .title-box { display: flex; justify-content: center; align-items: center; width: 100%; max-width: 500px; height: 60px; margin-inline: auto; font-family: var(--font-Mix); font-size: 20px; font-weight: 500; color: #fff; background-color: var(--main-color3); text-align: center; }
.org-row .group__list { display: flex; flex-wrap: wrap; gap: 50px; }
.org-row .group__list > li { flex: 1; padding: 5px;}
.org-row .group__list > li .title-box { position: relative; border: 2px solid var(--main-color3); background-color: #fff; color: var(--main-color3); }
.org-row .group__list > li .title-box::before { content: ""; position: absolute; left: 50%; bottom: 100%; display: block; width: 1px; height: 50px; background: #DDD; transform: translateX(-50%); z-index: -1; }
.org-row .group__list > li:first-child .title-box::before, .org-row .group__list > li:last-child .title-box::before { display: none; }
.org-row .group__list > li .title-box::after { content: ""; position: absolute; left: 50%; top: -6px; display: block; width: 10px; height: 10px; background-color: var(--main-color3); transform: translateX(-50%); }
.org-row .group__list > li .group { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; padding: 20px; border: 2px dashed var(--main-color3); }
.org-row .group__list > li .group > p { display: flex; justify-content: center; align-items: center; width: calc((100% - 10px)/3); height: 50px; padding: 5px; background-color: #F5F5F5; font-size: 18px; font-weight: 300; color: #333; text-align: center; }
.rnd .sub__title { font-size: clamp(24px, 2.6vw, 50px); }
.rnd-type .line-card__list { margin-top: 20px; }
.list-type-dot > li { position: relative; padding-left: 15px; font-size: 18px; font-weight: 300; color: #333; }
.list-type-dot > li::before { content: ""; position: absolute; left: 0; top: 0.5em; width: 5px; height: 5px; background-color: #AAA; }
.list-type-dot > li + li { margin-top: 10px; }
.rnd .img_borad_list .item { padding: 0; border: none; }
.rnd .img_borad_list .item .box { border: 3px solid #EEEEEE; border-top: none; padding: 25px; transition: 0.3s ease-out; }
.rnd .img_borad_list .item .txt { display: flex; justify-content: center; align-items: center; width: 100%; height: 60px; margin-top: 0; padding: 0 10px; background-color: var(--main-color3); text-align: center; }
.rnd .img_borad_list .item .txt .title { color: #fff; }
.rnd .img_borad_list .item:hover .box { border-color: var(--main-color3); }

/* ir */
/* .sv04 .visual-img { background: url("/img/sub/visual_ir.jpg") no-repeat center center/cover; } */
.ir .sub__title { margin-bottom: 10px; font-size: clamp(24px, 2.91vw, 56px); }
.financial__content .table-item .list-type-dot li { font-weight: 600; }

/* esg */
/* .sv05 .visual-img { background: url("/img/sub/visual_esg.jpg") no-repeat center center/cover; } */
.esg .content__text { word-break: break-all; line-height: 1.7; }
.about__area { display: flex; justify-content: space-between; gap: 40px; }
.about__area.reverse { flex-direction: row-reverse; }
.about__area .img-box { width: 50%; }
.about__area .text-box { width: 40.625%; }
.about__area .text-box.w100 { width: 100%; }
.about__area .text-box .sub__title { margin-bottom: 0; }
.about__area .text-box .sub-title { font-family: var(--font-Oxanium); font-size: 18px; font-weight: 500; letter-spacing: 0; color: #AAA; text-transform: uppercase; }
.about__area .text-box .main-title { margin-top: 0.5em; font-size: 40px; font-weight: 600; color: #111; }
.about__area .text-box .text { margin-top: 1em; font-size: 20px; font-weight: 300; line-height: 1.7; color: #333; word-break: break-all; }
.about__area .text-box .info-list { margin-top: 30px; }
.about__area .text-box .info-list > li { display: flex; align-items: center; gap: 25px; padding: 18px 38px; border: 2px solid #EEE; }
.about__area .text-box .info-list > li + li { margin-top: 10px; }
.about__area .text-box .info-list > li .num { min-width: 30px; line-height: 30px; font-family: var(--font-Oxanium); font-size: 16px; font-weight: 600; letter-spacing: 0; color: #fff; text-align: center; background-color: var(--main-color3); }
.about__area .text-box .info-list > li > p { font-size: 20px; line-height: 1.6; font-weight: 300; color: #333; }
.about__area .text-box .btn-box-03 {  margin-top: 60px; }
.about__area .text-box .button__wrap { justify-content: left; gap: 10px; margin-top: 60px; }
.about__area .text-box .button__wrap .btn { margin-top: 0; }
.about__area .process { margin-top: 30px; }
.about__area .process > .title { font-size: 22px; font-weight: 500; color: #222; }
.about__area .process .list { display: flex; flex-wrap: wrap; gap: 30px; margin-top: 20px; }
.about__area .process .list > li { width: calc((100% - 90px)/4); }
.about__area .process .list > li .icon-box { position: relative; display: flex; justify-content: center; align-items: center; width: 100%; aspect-ratio: 1/1; background-color: #F5F5F5; }
.about__area .process .list > li .icon-box img { max-width: 57.14%; }
.about__area .process .list > li:not(:last-child) .icon-box::after { content: ""; position: absolute; right: -21px; top: 50%; display: block; width: 9px; height: 14px; background: url("/img/sub/process_arrow.svg") no-repeat center center/ contain; transform: translateY(-50%); }
.about__area .process .list > li:last-child .icon-box { background-color: var(--main-color3); }
.about__area .process .list > li > p { margin-top: 20px; font-size: 18px; font-weight: 300; color: #333; text-align: center; }
.about__area.coming-soon .img-box { display: flex; justify-content: center; align-items: center; aspect-ratio: 1/1; background-color: #F5F5F5; }
.about__area.coming-soon .img-box img { width: 175px; }
.esg__list { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 30px; }
.esg__list > li { overflow: hidden; position: relative; width: calc((100% - 40px)/3); }
.esg__list > li:nth-child(1){ height: 720px; }
.esg__list > li:nth-child(2){ height: 620px; }
.esg__list > li:nth-child(3){ height: 520px; }
.esg__list > li > .bg { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; background: url("/img/main/esg_01.jpg") no-repeat center center/cover; transform: translate(-50%, -50%); transition: 0.5s ease-out; }
.esg__list > li:nth-child(1) > .bg { background: url("/img/main/esg_01.jpg") no-repeat center center/cover; }
.esg__list > li:nth-child(2) > .bg { background: url("/img/main/esg_02.jpg") no-repeat center center/cover; }
.esg__list > li:nth-child(3) > .bg { background: url("/img/main/esg_03.jpg") no-repeat center center/cover; }
.esg__list > li > p { position: absolute; left: 60px; bottom: 40px; font-family: var(--font-Oxanium); font-size: clamp(30px,2.4vw,46px); font-weight: 600; letter-spacing: 0; color: #fff; }
.esg__list > li > p > b { font-family: inherit; font-size: inherit; font-weight: inherit; letter-spacing: inherit; color: var(--main-color); }
.esg__list .text__box { position: relative; width: 100%; height: 100%; padding: 60px; background-color: rgba(0, 0, 0, 0.6); visibility: hidden; opacity: 0; transition: 0.5s ease-out; }
.esg__list .text__box ul > li { position: relative; padding-left: 15px; font-size: 20px; font-weight: 200; color: #fff; transition: 0.5s ease-out; }
.esg__list .text__box ul > li::before { content: ""; position: absolute; left: 0; top: 0.5em; display: block; width: 5px; height: 5px; background-color: #fff; }
.esg__list .text__box ul > li + li { margin-top: 20px; }
.esg__list > li:hover .text__box { visibility: visible; opacity: 1; }
.esg__list > li:hover .text__box ul > li + li { margin-top: 10px; }
.esg-org,.safety-org { position: relative; }
.esg-org .sub__title, .safety-org .sub__title { position: absolute; left: 0; top: 0; margin-bottom: 0; }
.esg-org__wrap .org-row + .line { max-width: 1375px; height: 40px; margin-top: 40px; }
.org-row .title-circle { position: relative; display: flex; justify-content: center; align-items: center; width: 100%; max-width: 240px; aspect-ratio: 1/1; border-radius: 50%; margin: 0 auto; font-size: 40px; font-weight: 600; background-color: var(--main-color3); color: #fff; }
.org-row .title-circle::after { content: ""; position: absolute; left: 50%; top: 100%; display: block; width: 1px; height: 170px; background-color: #DDDDDD; transform: translateX(-50%); z-index: -1;}
.org-row.row-02 .title-box { max-width: 300px; height: 70px; border: 2px solid var(--main-color3); margin-top: 60px; background-color: #fff; color: var(--main-color3); }
.org-row.row-03 .group__list > li .title-box::before { height: 41px; }
.org-row.row-03 .group__list > li .title-box { height: 70px; border: none; background-color: #F5F5F5; font-weight: 400; }
.esg__list > li:hover > .bg { transform: translate(-50%, -50%) scale(1.047); }
.section-board { margin-top: 30px; }
.section-board .img_borad_list .item { width: calc((100% - 60px)/4); }
.section-board .img_borad_list .item figure::before { padding-top: 100%; }
.section-board .img_borad_list .item .txt .title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.section-board .paging {margin-top: 30px; }
.img-info__area { display: flex; flex-wrap: wrap; gap: 60px; margin-top: 30px; }
.img-info__area .box { position: relative; width: calc(50% - 30px); height: 400px; background: no-repeat center center/cover; }
.img-info__area .box .text-box { position: absolute; left: 0;  bottom: 0; width: 77.92%; padding: 30px; background-color: rgba(34, 30, 31, 0.9); }
.img-info__area .box .text-box dt { font-size: 24px; font-weight: 500; color: #fff; }
.img-info__area .box .text-box dd { margin-top: 0.55em; font-size: 18px; line-height: 1.67; font-weight: 200; color: #fff; word-break: break-all; }
.practice-board .img-info__area .box:nth-child(1) { background-image: url("/img/sub/practice_img_01.jpg"); }
.practice-board .img-info__area .box:nth-child(2) { background-image: url("/img/sub/practice_img_02.jpg"); }

.line-content__list { display: flex; flex-wrap: wrap; gap: 60px; }
.line-content__list > li { width: calc(50% - 30px); }
.line-content__list .text-box .sub-title { font-family: var(--font-Oxanium); font-size: 20px; font-weight: 500; letter-spacing: 0; color: #AAA; text-transform: uppercase; }
.line-content__list .text-box .main-title { font-size: 28px; font-weight: 500; color: #222; }
.line-content__list .text-box .text { margin-top: 1em; font-size: 20px; font-weight: 300; line-height: 1.7; color: #666; }
.line-content__list .img-box { position: relative; margin-bottom: 40px; }
.line-content__list .img-box img { width: 100%; }
.line-content__list .img-box .num { content: ""; position: absolute; left: 0; top: 0; display: inline-block; width: 40px; height: 40px; background-color: #fff; z-index: 1; }
.line-content__list .img-box .num > span { position: absolute; left: 0; top: 0; display: inline-block; width: 30px; line-height: 30px; background-color: var(--main-color); font-family: var(--font-Oxanium); font-size: 16px; font-weight: 700; letter-spacing: 0; color: #000; text-align: center; z-index: 5; }
.line-content__list .list-type-dot { margin-top: 20px; }
.line-content__list .list-type-dot > li { font-size: 20px; color: #666; }
.line-content__list.col-3 { gap: 50px; }
.line-content__list.col-3 > li { width: calc((100% - 100px)/3); }
.line-content__list.col-3 .img-box { margin-bottom: 30px; }
.line-content__list.col-3 .text-box .main-title { font-size: 24px; }
.caption-text { margin-bottom: 10px; font-size: 16px; font-weight: 300; color: #666; text-align: right; }
.drop-down__area { margin-top: 60px; }
.drop-down__box { border: 2px solid var(--main-color3);}
.drop-down__box + .drop-down__box { margin-top: 20px; }
.drop-down__box .btn-dropdown { position: relative; display: flex; align-items: center; width: 100%; border: none; height: 100px; padding-left: 60px; padding-right: 70px; font-size: 24px; font-weight: 500; text-align: left; color: #222; background-color: transparent;; }
.drop-down__box .btn-dropdown::after { content: ""; position: absolute; right: 60px; top: 50%; display: block; width: 14px; height: 8px; background: url("/img/common/select_arrow.svg") no-repeat center center/auto; transform: translateY(-50%); transition: 0.3s ease-out;}
.drop-down__box .btn-dropdown.on::after { transform: translateY(-50%) rotateX(180deg); }
.drop-down__box .drop-down__item { overflow: hidden; height: 0; transition: 0.3s; }
.drop-down__box .drop-down__item.on { height: var(--dropdown-H); }
.drop-down__box .drop-down__inner { position: relative; padding: 35px 60px 60px; }
.drop-down__box .drop-down__inner::after { content: ""; position: absolute; left: 50%; top: 0; display: block; width: calc(100% - 120px); height: 1px; background-color: #DDD; transform: translateX(-50%); }
.drop-down__box .text__box { overflow-y: auto; max-height: 500px; padding-right: 57px; }
.drop-down__box .text__box::-webkit-scrollbar{ width: 3px; }
.drop-down__box .text__box::-webkit-scrollbar-thumb { border-radius: 3px; background-color: #AAAAAA; }
.drop-down__box .text__box .top-text { margin-bottom: 30px; font-size: 20px; line-height: 1.7; color: #333; word-break: break-all; }
.drop-down__box .text__box dl + dl { margin-top: 30px; }
.drop-down__box .text__box dt { font-size: 20px; font-weight: 500; color: #333; }
.drop-down__box .text__box dd { margin-top: 10px; font-size: 18px; font-weight: 300; line-height: 1.67; color: #666; word-break: break-all; }
.drop-down__box .text__box dd .inset { padding-left: 1em; font-size: inherit; line-height: inherit; letter-spacing: inherit; margin-bottom: 0.5em; }
.drop-down__box .text__box dd * { line-height: 1.67; }
.drop-down__inner .table-item table thead th { height: 60px; font-size: 18px; }
.drop-down__inner .table-item table tbody th, .drop-down__inner .table-item table td { height: 60px; padding: 18px 10px; font-size: 18px; }
.esg .table-item table thead th { border-bottom: none; background-color: #EEEEEE; }
.border-table tbody th { border-right: 1px solid #DDD; }
.border-table tbody td { padding: 0 5px; }
.social-diagram { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch; margin-top: 30px; }
.social-diagram .text-box { position: relative; width: calc((56.25% - 100px)/2); padding: 40px; border: 2px dashed var(--main-color3); }
.social-diagram .text-box::before { content: ""; position: absolute; right: 0; top: 50%; display: block; width: 51px; height: 2px; background-color: var(--main-color3); transform: translate(100%, -50%); }
.social-diagram .text-box::after { content: ""; position: absolute; right: -52px; top: 50%; display: block; width: 8px; height: 8px; background-color: var(--main-color3); transform: translate(50%,-50%) rotate(45deg); }
.social-diagram .text-box:last-child::before { right: auto; left: 0; transform: translate(-100%, -50%); }
.social-diagram .text-box:last-child::after { right: auto; left: -52px; transform: translate(-50%,-50%) rotate(45deg); }
.social-diagram .text-box { display: flex; flex-direction: column; justify-content: space-between; gap: 10px; }
.social-diagram .text-box .icon { margin-left: auto; }
.social-diagram .text-box dt { margin-bottom: 0.714em; font-size: 28px; font-weight: 500; color: #222; }
.social-diagram .img-box { width: 43.75%; }
.social-diagram .img-box img { width: 100%; }
.governance-org .img-box { position: relative; }

/* career */
/* .sv06 .visual-img { background: url("/img/sub/visual_career.jpg") no-repeat center center/cover; } */
.talent__list { display: flex; flex-wrap: wrap; gap: 20px; }
.talent__list > li { position: relative; width: calc((100% - 60px)/4); height: 556px; background: no-repeat center center/cover; }
.talent__list > li:nth-child(1) { background-image: url("/img/sub/career/talent_img_01.jpg"); }
.talent__list > li:nth-child(2) { background-image: url("/img/sub/career/talent_img_02.jpg"); }
.talent__list > li:nth-child(3) { background-image: url("/img/sub/career/talent_img_03.jpg"); }
.talent__list > li:nth-child(4) { background-image: url("/img/sub/career/talent_img_04.jpg"); }
.talent__list > li .text-box { position: absolute; left: 0; bottom: 0; width: 100%; height: 226px; padding: 30px 29px; background-color: rgba(34, 30, 31, 0.9); color: #fff; }
.talent__list > li .text-box dt { font-size: 24px; font-weight: 500; }
.talent__list > li .text-box dd { margin-top: 0.83em; font-size: 18px; line-height: 1.67; font-weight: 300; word-break: break-all; }
.system__content .sub__title { margin-bottom: 20px; }
.system__content .sub__text { line-height: 1.3; }
.circle-step__list { display: flex; flex-wrap: wrap; text-align: center; gap: 20px; margin-top: 30px; }
.circle-step__list > li { width: calc((100% - 100px)/6); }
.circle-step__list > li .circle { position: relative;  display: flex; flex-direction: column; align-items: center; width: 100%; aspect-ratio: 1/1; border-radius: 50%; background-color: #F5F5F5; padding-top: 20%; }
.circle-step__list > li .circle .num { font-size: 16px; font-weight: 500; color: #000; opacity: 0.3; }
.circle-step__list > li .circle > img { max-width: 36%; margin-top: 20px; }
.circle-step__list > li .text { display: inline-block; margin-top: 1em; font-size: 20px; font-weight: 500; color: #333; }
.circle-step__list > li:last-child .circle { background-color: var(--main-color3); }
.circle-step__list > li:last-child .circle .num { color: #fff; opacity: 1; }
.circle-step__list > li:last-child .text { font-weight: 600; }
.circle-step__list > li .circle::before { content: ""; position: absolute; left: -10px; top: 50%; display: block; width: 40px; height: 40px; border:2px solid var(--main-color3); background: url("/img/sub/process_arrow.svg") no-repeat calc(50% + 1px) center/auto #fff; box-sizing: border-box; transform: translate(-50%,-50%); z-index: 5; }
.circle-step__list > li:first-child .circle::before { display: none; }
.system-02 .img-info__area { gap: 20px; }
.system-02 .img-info__area .box { width: calc(50% - 10px); height: 420px; }
.system-02 .img-info__area .box:nth-child(1) { background-image: url("/img/sub/career/edu_img_01.jpg"); }
.system-02 .img-info__area .box:nth-child(2) { background-image: url("/img/sub/career/edu_img_02.jpg"); }
.system-02 .img-info__area .box .text-box { width: 59.49%; padding: 40px; }
.system-02 .img-info__area .box .text-box dd { margin-top: 1em; font-size: 20px; }

.benefit__list { display: flex; flex-wrap: wrap; gap: 20px; }
.benefit__list > li { overflow: hidden; position: relative; width: calc((100% - 60px)/4); height: 268px; }
.benefit__list > li::after { content: ""; position: absolute; left: 0;top: 0; width: 100%; height: 100%; display: block; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #222 100%); }
.benefit__list > li > img { position: absolute; left: 50%; top: 50%; width: 100%; min-height: 100%; object-fit: cover; transform: translate(-50%, -50%); }
.benefit__list > li .text-box { position: absolute; left: 0; top: 0; display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 100%; z-index: 5; padding: 30px; color: #fff; }
.benefit__list > li .text-box dt { font-size: 24px; font-weight: 500; margin-bottom: 10px; }
.benefit__list > li .text-box dd { font-size: 18px; line-height: 1.67; font-weight: 200; }
.step-info { margin-top: 60px; }
.step-info .line-info__list {display: flex; flex-wrap: wrap; gap: 0 60px;  }
.step-info .line-info__list > li { gap: 40px; width: calc(50% - 30px); align-items: flex-start; padding: 40px 20px 47px 40px; }
.step-info .line-info__list > li .text-box { width: calc(100% - 120px); }
.step-info .line-info__list > li .text-box dt { font-size: 22px; }
.step-info .line-info__list > li .text-box dt > span { color: var(--main-color); }
.step-info .line-info__list > li .text-box dd { line-height: 1.7; color: #444; }
.step-info .info-box { margin-top: 10px; padding: 50px; border: 2px dashed var(--main-color3); }
.step-info .info-box > p { font-size: 18px; line-height: 1.67; font-weight: 300; color: #444; }

/* job */
.table-job .table-title { margin-bottom: 30px; font-size: 24px; font-weight: 500; color: #222; }
.table-job .caption-box { padding: 20px 50px; border-top: 3px solid #000; background-color: #F5F5F5; font-size: 20px; font-weight: 500; color: var(--main-color3); } 
.table-job .table-item + .table-item { margin-top: 60px; }
.table-job .table-item table td { padding: 14px 20px; border-right: 1px dashed #DDD; color: #333; }
.table-job .table-item table td.etc { text-align: left; line-height: 1.67; }
.table-job .table-item table td.etc b { font-weight: 500; }
.table-job .table-item table tbody th { border-right: 1px dashed #DDD; font-weight: 500; color: #333; }
.table-job .table-item table td:last-child { border-right: none; }
.table-item table .btn-box-03 { height: 40px; margin: 0 auto; padding: 0 20px; font-size: 16px; }
.job-info__area { display: flex; flex-wrap: wrap; gap: 60px; margin-top: 60px; }
.job-info__area .box { position: relative; display: flex; justify-content: center; align-items: center; padding: 20px; width: calc(50% - 30px); height: 234px; text-align: center; }
.job-info__area .box::before { content: ""; position: absolute; right: 0; bottom: 0; display: block; width: 471px; max-width: 61.17%; aspect-ratio: 3.14/1; background: url("/img/sub/job_bg_logo.png") no-repeat center center/contain; z-index: 1; }
.job-info__area .box:nth-child(1) { border: 2px dotted var(--main-color3); }
.job-info__area .box:nth-child(2) { background-color: #F5F5F5; }
.job-info__area .box:nth-child(2)::before { background-image: url("/img/sub/job_bg_logo_w.png"); }
.job-info__area .box .text-box { position: relative; z-index: 5; }
.job-info__area .box p { font-size: 20px; line-height: 1.6; font-weight: 300; color: #333; }
.job-info__area .box p b { font-weight: 500; }
.job-info__area .box .btn-box-03 { margin: 30px auto 0; padding: 0 30px; }
.job-info__area .box:nth-child(2) .btn-box-03::after { display: none; }
.job-info__area .box:nth-child(2) .btn-box-03:hover { color: #fff; background-color: var(--main-color3); }

/* policy */
/* .sv09 .visual-img { background: url("/img/sub/visual_policy.jpg") no-repeat center center/cover; } */
.policy .table-item table tbody th, .policy .table-item table td { font-size: 16px; }

@media screen and (max-width: 1660px) {
    .about-text .text-box > em { font-size: clamp(26px,2.4vw,40px); }
    .about-text .text-box .main-title { font-size: clamp(26px,2.77vw,46px); }
    .about-text .text-box .text { font-size: clamp(14px,1.084vw,18px);}
    .about-text .text-box .text p > br { display: none; }
    .greeting__wrap .title { font-size: clamp(24px,2.77vw,46px); }
    .greeting__wrap .text-box p { font-size: clamp(16px,1.2vw,20px); }
    .history__item .year {font-size: clamp(24px,3.012vw,50px);}
    .value__list > li .text-box dd { word-break: keep-all; }
    .value__list > li .text-box dd > br { display: none;  }

    .product-step__wrap.flex { gap: 20px; }

    .org-row + .line { max-width: calc(100% - ((100% - 100px) / 3)); }
    .org-row .group__list > li .group > p { font-size: 16px; }
    .development__area .list > li { height: clamp(300px,24.58vw,408px); }
    .development__area .list > li > em { font-size: clamp(40px,7.23vw,120px); }
    .rnd__content .title-box .text > br { display: none; }
    .line-card__item .box .text { font-size: 14px; }

    .desc__list > li .icon-box { width: 140px; }
    .desc__list > li .icon-box img { width: 30%; }
    .desc__list > li .icon-box span { font-size: 14px; }
    .desc__list > li .text-box p { font-size: 16px; }

    .line-content__list .text-box .main-title { font-size: clamp(20px,1.68vw,28px); }
    .line-content__list.col-3 .text-box .main-title { font-size: clamp(20px,1.44vw,24px); }
    .line-content__list .text-box .sub-title, .line-content__list .text-box .text { font-size: clamp(16px,1.2vw,20px); }
    .line-content__list .text-box .text > br { display: none; }
    .line-content__list .list-type-dot > li > br { display: none; }
    .about__area .text-box .info-list > li > p > br { display: none; }
    .about__area .text-box .sub-title, .about__area .text-box .text { font-size: clamp(16px,1.08vw,18px); }
    .about__area .text-box .main-title { font-size: clamp(24px,2.4vw,40px); }
    .esg-org__wrap .org-row + .line { max-width: calc(100% - ((100% - 250px) / 6)); }

    .talent__list > li .text-box dt { font-size: 20px; }
    .talent__list > li .text-box dd { font-size: 16px; }
    .talent__list > li .text-box dd > br { display: none; }
    .system-02 .img-info__area .box .text-box dd > br { display: none; }
    .step-info .line-info__list > li .text-box dd > br { display: none; }
}
@media screen and (max-width: 1400px) {
    .greeting__wrap .text-box p > br { display: none; }
    .about-info__list > li p{ font-size: 16px; }
    .value__list > li.title .value-title b { font-size: 28px; }
    .value__list > li .text-box dt { font-size: 20px; }
    .value__list > li .text-box dd { font-size: 16px; }

    .board_box table td { padding: 0 20px; }
    
    .global__content { height: auto; padding-bottom: 100px; }
    .global__content .world-map { top: 50px; }
    .global__content .inner.summary { position: relative; left: 0; top: 0; transform: none;}
    .tab-type-box .tab__item { height: 40px; padding: 0 32px; font-size: 16px; }

    .org-row .group__list { gap: 20px; }
    .org-row + .line { max-width: calc(100% - ((100% - 40px) / 3)); }
    .esg-org__wrap .org-row + .line { max-width: calc(100% - ((100% - 100px) / 6)); }

    .rnd__content .title-box .text > br { display: none; }
    .line-card__item { flex: none; width: 100%; }
    .development__area .list > li { row-gap: 10px; }
    .cae__area { flex-direction: column; }
    .column-tab { display: flex; width: 100%; }
    .cae__box { width: 100%; }
    .column-tab .tab__item { font-size: 16px; }
    .column-tab .tab__item.on { height: 110px; }
    .column-tab .tab__item + .tab__item { margin-top: 0; }

    .about__area { align-items: center; }
    .about__area .text-box .text > br { display: none; }
    
    .line-content__list .list-type-dot > li { font-size: 18px; }

    .social-diagram { gap: 30px; }
    .social-diagram .text-box { width: calc((56.25% - 60px) / 2); padding: 20px; }
    .social-diagram .text-box::before { width: 31px; }
    .social-diagram .text-box::after { right: -32px; }
    .social-diagram .text-box:last-child::after { left: -32px; }
    .social-diagram .text-box .icon { width: 60px; }
    .social-diagram .text-box dt { font-size: 22px; }

    .talent__list > li .text-box { height: 260px; }
    .step-info .line-info__list > li { gap: 30px; padding: 30px 20px; }
    .step-info .line-info__list > li .icon { width: 60px; }
    .step-info .line-info__list > li .text-box { width: calc(100% - 90px); }
    .step-info .line-info__list > li .text-box dt { font-size: 18px; }
    .step-info .line-info__list > li .text-box dd { font-size: 14px; }
}
@media screen and (max-width: 1200px) {
    .img_borad_list .item { width: calc((100% - 40px)/3); }
    .board_box table .notice td a { padding-left: 90px; }
    .board_box table .notice td .tag { left: 20px; width: 70px; line-height: 25px; font-size: 16px; }
    .board_box table td a { padding-block: 20px; font-size: 16px; }
    .board_box table td.date, .board_box table td.hit { font-size: 14px; }
    .view_ctn .info { padding: 60px 20px 100px; }
    .view_ctn .tit { padding-bottom: 40px; }
    .view_ctn .file_box { width: calc(100% - 40px); padding: 30px 50px; }
    .view_ctn .file_box dl { gap: 5px 40px; }
    .view_ctn .file_box dt { font-size: 16px; }
    .view_ctn .file_box dt::after{ right: -17px; }
    .view_ctn .file_box dd { width: calc(100% - 177px); font-size: 16px; }
    .view_ctn .file_box dd a { padding-right: 150px; }
    .view_ctn .file_box dd a .download { font-size: 16px; }
    .view_ctn .file_box dd a .download::after { width: 30px; height: 30px; background-size: 50%; }
    .view_ctn .pages { margin-top: 60px; }

    .about-main .img-box { width: 40%; }
    .about-main .about-text { width: calc(60% - 10px); padding: 25px; }
    .about-info__list > li { width: calc((100% - 20px)/3); height: 120px; }
    .about-info__list > li:first-child { width: 100%; }
    .about-info__list > li:first-child p { font-size: 20px; }
    .product_list .item { padding: 30px 20px; }
    .product_list .text-box{ padding: 0 10px; }
    .product_list .title { font-size: 24px; }
    .product_list .info__list .info__item .label { width: 40px; font-size: 14px; }
    .product_list .info__list .info__item .text { width: calc(100% - 40px); font-size: 14px; }
    .corporate__item dl { font-size: 16px; }
    .global__list { gap: 10px; }
    .global__item { width: calc(50% - 5px); }
    .map__box { height: 500px; }
    .add-info__box { width: calc(53.13% - 40px); }
    .line-info__list > li .text-box dt { font-size: 16px; }
    .line-info__list > li .text-box dd { font-size: 16px; }

    .development__area.row { gap: 80px; }
    .development__area.row .title-box { width: calc(50% - 80px); }
    .development__area .img-layout .flex { padding: 10px; }
    .development__area .img-layout .side-text span { font-size: 14px; }
    .development__area .img-layout .side-text .arrow { max-width: 70%; }
    .development__area .img-layout .top { gap: 30px; }
    .development__area .img-layout .box .img-text { height: 40px; font-size: 16px; }
    .desc__list { position: relative; display: flex; flex-wrap: wrap; width: 100%; justify-content: center; z-index: 3; gap: 40px 20px; }
    .desc__list > li { width: calc((100% - 60px)/4); }
    .desc__list > li, .desc__list > li:nth-child(even) { position: static; flex-direction: column-reverse; justify-content: flex-end; }
    .desc__list > li:nth-child(even),.desc__list > li:nth-child(odd) { transform: none; }
    .desc__list > li p, .desc__list > li:nth-child(odd) p { text-align: center; }

    .esg__list > li:nth-child(1) { height: 600px; }
    .esg__list > li:nth-child(2) { height: 550px; }
    .esg__list > li:nth-child(3) { height: 500px; }
    .drop-down__box .btn-dropdown { height: 80px; padding-left: 40px; padding-right: 60px; font-size: 20px; }
    .drop-down__box .btn-dropdown::after { right: 40px; }
    .drop-down__box .drop-down__inner { padding: 35px 40px 40px; }
    .drop-down__box .drop-down__inner::after { width: calc(100% - 80px); }
    .drop-down__box .text__box { padding-right: 40px; }
    .drop-down__box .text__box .top-text { font-size: 18px; }
    .drop-down__box .text__box dt { font-size: 18px; }
    .drop-down__box .text__box dd { font-size: 16px; }
    .ir .board_box colgroup col:nth-child(1) { width: 65%; }
    .ir .board_box colgroup col:nth-child(2) { width: 20%; }
    .ir .board_box colgroup col:nth-child(3) { width: 15%; }

    .about__area .text-box .info-list { margin-top: 20px; }
    .about__area .text-box .info-list > li { gap: 14px; padding: 10px; }
    .about__area .text-box .info-list > li > p { font-size: 16px; }
    .about__area .text-box .button__wrap{ margin-top: 20px; }
    .about__area .text-box .btn-box-03 { margin-top: 20px; }
    .table-item .table-scroll.size-l table { min-width: 1000px; }
    .esg__list .text__box { padding: 30px 40px; }
    .list-type-dot > li { font-size: 14px; }

    .talent__list > li { width: calc(50% - 10px); }
    .talent__list > li .text-box { height: 205px; }
    .circle-step__list > li { width: calc((100% - 40px)/3); }
    .circle-step__list > li:nth-child(4) .circle::before { display: none; }
    .img-info__area { gap: 20px; }
    .img-info__area .box .text-box,.system-02 .img-info__area .box .text-box { padding: 30px; }
    .system-02 .img-info__area .box .text-box { width: 70%; }
    .img-info__area .box .text-box dt { font-size: 20px; }
    .img-info__area .box .text-box dd, .system-02 .img-info__area .box .text-box dd { font-size: 16px; }
    .benefit__list > li { height: 240px; }
    .benefit__list > li .text-box { padding: 20px; }
    .benefit__list > li .text-box .icon img { width: 50px; }
    .benefit__list > li .text-box dt { font-size: 20px; }
    .benefit__list > li .text-box dd { font-size: 16px; }

    .table-item table .btn-box-03 { height: 36px; padding: 0 12px; border-width: 2px; font-size: 14px; }
}   
@media screen and (max-width: 1024px) {
    :root {
        --input-H: 50px;
        --input-Font: 16px;
    }
    #subWrap { padding-top: var(--header-H); }
    .navigation > li > a, .navigation > li > span { font-size: 16px; }
    .depth2-tab { margin-bottom: 30px; } 
    .depth2-tab .tab__item { width: 100px; height: 36px; }
    .depth2-tab .tab__item > a { font-size: 14px; }
    .content:not(.global__content) { padding-top: 30px; }
    .content__title { margin-bottom: 60px; }
    .content__text { margin-bottom: 30px; font-size: 16px; }
    .sub__title { margin-bottom: 20px; }
    .sub__text { font-size: 16px; }
    .paging { margin-top: 60px; }
    .content .section + .section { margin-top: 50px; }

    .search__area { margin-bottom: 20px; }
    .search__area form { height: 50px; }
    .search__area .search-select { width: 180px; font-size: 16px; }
    .search__area .search-input { font-size: 16px; }
    .search__area .btn-search { width: 50px; height: 50px; }
    .img_borad_list .item { padding: 14px; }
    .img_borad_list .item,.section-board .img_borad_list .item { width: calc(50% - 10px); }
    .img_borad_list .item .box { border-width: 2px;  padding: 20px; }
    .img_borad_list .item .txt .title { font-size: 16px; }

    .about-main .img-box { overflow: hidden; width: 100%; height: 500px; }
    .about-main .img-box img { width: 100%; min-height: 100%; object-position: center center; object-fit: cover; }
    .about-main .about-text { width: 100%; padding: 70px 30px 30px;  }
    .product_list .item { width: calc(50% - 10px); }
    .about-main .flex { gap: 10px; }
    .about-main .box { height: 260px; margin-top: 10px; }
    .about-text .text-box .text p > br { display: none; }
    .about-text .tag-logo img { width: 100px; }
    .about-text .tag-logo { padding-left: 10px; padding-bottom: 10px; }
    .greeting__wrap { row-gap: 60px; }
    .greeting__wrap .text__area { position: static; }
    .greeting__wrap .title { margin-bottom: 30px; }
    .greeting__wrap .title > br { display: none; }
    .greeting__wrap .text__area, .greeting__wrap .img__area { width: 100%; }
    .greeting__wrap .img__area { display: flex; gap: 10px; }
    .greeting__wrap .img__area .img-box + .img-box { margin-top: 0; }
    .greeting__wrap .ceo { margin-top: 40px; }
    .greeting__wrap .ceo span { font-size: 16px; }
    .greeting__wrap .ceo b { font-size: 20px; }
    .vision__text { font-size: 20px; }
    .value__list { gap: 10px; }
    .value__list + .value__list { margin-top: 30px; }
    .value__list > li { width: calc(50% - 5px); height: 200px; padding: 20px; }
    .history__item .year-content { width: 60%; }
    .n-box { pointer-events: none; }
    .n-box + g { display: none; }
    .corporate__list { margin-bottom: 30px; }
    .corporate__item { position: static; width: calc((100% - 40px)/3); padding: 20px; box-shadow: none; transform: none; visibility: visible; opacity: 1; }
    .corporate__item.reverse { transform: none; }
    .corporate__item .title { display: block; }
    .corporate__item dl { font-size: 14px; }
    .corporate__item dt { width: 70px; }
    .corporate__item dd { width: calc(100% - 70px); }
    .global__content { padding-top: 0; }
    .global__content .world-map { position: static; transform: none;}
    .global__item { height: 140px; padding: 20px 10px; }
    .global__item.total > p, .global__item .nation span { font-size: 16px; }
    .global__item .nation img { width: 34px; }
    .global__item .value > b { font-size: 32px; }
    .global__item .value { font-size: 20px; }
    .global__item .value:not(:has(b)) { padding-bottom: 7px; }    
    .tab-type-box { left: 10px; top: 10px; }
    .map__area { flex-direction: column; }
    .map__box  { width: 100%; height: 360px; }
    .add-info__box { width: 100%; margin-top: 40px; }
    .add-info__box .title-box { text-align: left; }

    .product__wrap { flex-direction: column; }
    .card-num__list { flex-direction: row; width: 100%; max-width: initial; }
    .card-num__item .text-box > .name { font-size: 16px; }
    .product-main > p { margin-top: 30px; padding: 10px 20px; font-size: 16px; }
    .product__wrap.col .card-num__item { height: 179px; }
    .step__row .product__item .title-box { height: 50px; padding: 5px; font-size: 16px; }
    .step__row.col .product__item .title-box { height: 55px; }
    .step__row .product__item::before { width: 30px; height: 30px; left: -25px; }
    .step__row:not(.col):first-child .product__item:last-child::after { width: 30px; height: 30px; bottom: -25px; }
    .step__row.col .product__item::before { top: -25px; }

    .org-row + .line { display: none; }
    .org-row:not(.top) { margin-top: 30px; }
    .org-row .title-box { max-width: initial; height: 50px; font-size: 18px; }
    .org-row .group__list > li { flex: none; width: 100%; }
    .org-row .group__list > li .title-box::after, .org-row .group__list > li .title-box::before { display: none; }
    .org-row .group__list > li .group > p { height: 40px; font-size: 14px; }
    .org-row .title-circle { max-width: 200px; font-size: 30px; }
    .org-row .title-circle::after { height: 160px; }
    .org-row.row-02 .title-box { max-width: initial; }
    .org-row.row-03 .group__list { gap: 10px; border: 1px solid #DDDDDD; padding: 10px; }
    .org-row.row-03 .group__list > li .title-box { height: 60px; }

    .development__area + .development__area, .control__area + .control__area { margin-top: 60px; }
    .rnd__content .title-box .title .num { min-width: 30px; line-height: 30px; font-size: 16px; margin-top: 0; }
    .rnd__content .title-box .title span { font-size: 24px; }
    .rnd__content .title-box .text { font-size: 16px; }
    .rnd .img_borad_list .item .box { padding: 10px; }
    .rnd .img_borad_list .item .txt { height: 45px; }

    .development__area .list { gap: 10px; }
    .development__area .list > li { width: calc((100% - 20px)/3); height: 260px; }
    .development__area .list > li > p { font-size: 14px; }
    .development__area.row, .development__area.row:nth-child(even) { flex-direction: column-reverse; align-items: flex-start; row-gap: 40px; }
    .development__area.row .title-box, .development__area.row .img-box { width: 100%; }
    .development__area.row .img-box { max-width: 500px; }
    .development__area .img-layout .top { flex-direction: column; gap: 40px; }
    .development__area .img-layout .bottom { flex-direction: column; }
    .development__area .img-layout .bottom .box:nth-child(n) {width: 100%; max-width: initial; }
    .development__area .img-layout .bottom .flex .img { height: 110px; }
    .development__area .img-layout .side-text { flex-direction: row; top: 50%; transform: translate(-50%, -50%); }
    .development__area .img-layout .side-text .arrow { width: 30px; transform: rotate(90deg); }
    .column-tab { flex-wrap: wrap; margin-bottom: 10px; }
    .column-tab .tab__item, .column-tab .tab__item.on { width: 33.3%; height: 80px; }
    .control__area .process-img { padding: 20px; }
    .process-img .list { gap: 10px; }
    .process-img .list .text { font-size: 18px; height: 50px; }

    .caption-text { font-size: 14px; }

    .about__area .process > .title { font-size: 16px; }
    .about__area .process .list { gap: 20px; }
    .about__area .process .list > li{ width: calc((100% - 60px)/4); }
    .about__area .process .list > li > p { margin-top: 1em; font-size: 14px; }
    .about__area .process .list > li:not(:last-child) .icon-box::after { right: -16px; }
    .line-content__list, .line-content__list.col-3 { gap: 40px; }
    .line-content__list > li, .line-content__list.col-3 > li { width: calc(50% - 20px); }
    .line-content__list .img-box, .line-content__list.col-3 .img-box { margin-bottom: 20px; }
    .line-content__list .list-type-dot > li { font-size: 14px; }
    .about__area, .about__area.reverse { flex-direction: column; align-items: flex-start; }
    .about__area .img-box { width: 100%; max-width: 500px; }
    .about__area .img-box[data-aos=fade-left] { transform: translate3d(-100px, 0, 0); }
    .about__area .text-box[data-aos=fade-right] { transform: translate3d(100px, 0, 0); }
    .about__area .img-box[data-aos^=fade][data-aos^=fade].aos-animate,
    .about__area .text-box[data-aos^=fade][data-aos^=fade].aos-animate { opacity: 1; transform: translateZ(0); }  
    .about__area .text-box { width: 100%; }
    .esg__list { margin-top: 0px; }
    .esg__list > li { width: 100%; }
    .esg__list > li::before{ content: ""; position: absolute; left: 0; top: 0; display: block; width: 80%; height: 100%; background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,255,255,0) 100%); }
    .esg__list > li:nth-child(1), .esg__list > li:nth-child(2), .esg__list > li:nth-child(3) { height: auto; }
    .esg__list > li:nth-child(2) { width: 90%; }
    .esg__list > li:nth-child(3) { width: 80%; }
    .esg__list > li:nth-child(1) > .bg { background-position: center 60%; }
    .esg__list > li:nth-child(2) > .bg { background-position: center 36%; }
    .esg__list > li:nth-child(3) > .bg { background-position: center 40%; }
    .esg__list > li > p { left: 30px; top: 30px; bottom: auto; font-size: 40px; }
    .esg__list .text__box { visibility: visible; opacity: 1; padding-top: 100px; }
    .esg__list > li .text__box ul > li + li { margin-top: 10px; }
    .esg__list .text__box ul > li { font-size: 16px; }
    .esg .content__text { word-break: keep-all; }    
    .esg-org .sub__title, .safety-org .sub__title { position: static; margin-bottom: 20px; }
    .table-item .table-scroll { overflow-x: auto; padding-bottom: 10px; }
    .table-item .table-scroll table { min-width: 800px; }
    .table-item .table-scroll.size-s table { min-width: 500px; }
    .table-item table thead th { height: 70px; font-size: 16px; }
    .table-item table tbody th, .table-item table td { height: 60px; font-size: 16px; padding: 15px 10px; }
    .table-item.font-ox th, .table-item.font-ox td { font-size: 16px; }
    .drop-down__area { margin-top: 30px; }
    .drop-down__inner .table-item table thead th { height: 50px; font-size: 16px; }
    .drop-down__inner .table-item table tbody th, .drop-down__inner .table-item table td { height: 50px; font-size: 14px; padding: 10px; }
    .social-diagram .text-box, .social-diagram .img-box { width: 100%; }
    .social-diagram .text-box { flex-direction: row; justify-content: center; gap: 30px; }
    .social-diagram .text-box::before { left: 50%; top: 100%; width: 2px; height: 31px; transform: translate(-50%, 1px); }
    .social-diagram .text-box::after { right: 50%; top: auto; bottom: -31px; transform: translate(50%, 50%) rotate(45deg);}
    .social-diagram .text-box:last-child::before { left: 50%; top: -1px; transform: translate(-50%, -100%); }
    .social-diagram .text-box:last-child::after { left: 50%; top: -31px; transform: translate(-50%, -50%) rotate(45deg); }
    .social-diagram .text-box .icon { margin-left: 0; }
    .social-diagram .text-box dl { display: flex; align-items: center; gap: 30px; }
    .social-diagram .text-box dt { margin-bottom: 0; font-size: 20px; }

    .circle-step__list > li .circle::before { width: 30px; height: 30px; }
    .img-info__area .box, .system-02 .img-info__area .box { width: 100%; }
    .benefit__list > li { width: calc(50% - 10px); }
    .step-info .line-info__list > li { width: 100%; }
    .step-info .info-box { padding: 30px; }
    .step-info .info-box > p { font-size: 16px; }
    .step-info .info-box > p + p { margin-top: 6px; }
    
    .talent__list > li .text-box dt { font-size: 16px; }
    .talent__list > li .text-box dd { font-size: 14px; }

    .table-job .table-title { margin-bottom: 15px; font-size: 20px; }
    .table-job .caption-box { padding: 15px 20px; font-size: 16px; }
    .table-job .table-item + .table-item { margin-top: 20px; }
    .table-job .table-item table td { padding: 15px 10px; }
    .job-info__area { gap: 20px; margin-top: 30px; }
    .job-info__area .box { width: calc(50% - 10px); height: 180px; padding: 15px 10px; }
    .job-info__area .box p { font-size: 16px; }
    .job-info__area .box .btn-box-03 { margin: 20px auto 0; }

    .policy .table-item table tbody th, .policy .table-item table td { font-size: 14px; }
}

@media screen and (max-width: 768px) {
    .sub-visual .inner { flex-direction: column; }
    .navigation { column-gap: 30px; }
    .navigation > li::before { left: -16px; width: 4px; height: 4px; }
    .navigation > li.home > a { width: 24px; height: 24px; background-size: 70%; }
    .navigation > li > a, .navigation > li > span { font-size: 14px; }
    .depth2-tab .tab__item { width: calc((100% - 20px)/3); }
    .paging a { width: 20px; height: 24px; font-size: 14px; }
    .paging .arr a:not(:last-child) { margin-right: 5px; }
    .paging a i { width: 8px; height: 13px; }
    .paging ul { margin: 0 5px; }
    .paging ul li:not(:last-child) { margin-right: 5px; }
    .paging ul li a { padding-top: 0; }

    .img_borad_list { gap: 10px; }
    .img_borad_list .item,.section-board .img_borad_list .item { width: calc(50% - 5px); }
    .view_ctn .tit { padding-bottom: 20px; }
    .view_ctn .tit ul { margin-top: 20px; }
    .view_ctn .tit ul li { font-size: 14px; }
    .view_ctn .info {  padding: 30px 0px 60px; }
    .view_ctn .file_box { width: 100%; padding: 20px; }
    .view_ctn .file_box dl { flex-direction: column; }
    .view_ctn .file_box dt { padding: 0; }
    .view_ctn .file_box dt::after { display: none; }
    .view_ctn .file_box dd { width: 100%; }
    .view_ctn .file_box dd a { padding-right: 50px; }
    .view_ctn .file_box dd a .download { font-size: 0; }
    .view_ctn .pages .btn-bracket { width: 180px; }
    .view_ctn .pages .btn-page a { font-size: 13px; }
    
    .product_list .item { width: 100%; }
    
    .about-main .flex { flex-direction: column; }
    .about-main .box { height: 150px; margin-top: 0; }
    .about-main .box .value > br { display: none; }
    .about-main .box .title { font-size: 16px; }

    .history__wrap .line { left: 140px; }
    .history__item { gap: 20px; }
    .history__item .year { width: 100px; font-size: 36px; }
    .history__item .year-content { width: calc(100% - 200px); }
    .history-text { column-gap: 10px; }
    .history-text .month { width: 30px; font-size: 20px; }
    .history-text .text { max-width: calc(100% - 40px); font-size: 16px; }
    .corporate__list { gap: 10px; }
    .corporate__item { width: 100%; }
    .global__list { gap: 10px; }
    .global__item { height: 120px; }
    .global__item.total > p, .global__item .nation span { font-size: 14px; }
    .global__item .value > b { font-size: 24px; }
    .global__item .value { font-size: 14px; }
    .global-summary .etc-text { margin-top: 1em; font-size: 14px; }
    .tab-type-box .tab__item { height: 36px; padding: 0 25px; font-size: 14px; }
    .add-info__box .title-box { margin-bottom: 20px; }
    .add-info__box .title-box > span { font-size: 14px; }
    .add-info__box .title-box > .title { font-size: 24px; }
    .line-info__list > li { gap: 20px; padding: 20px 10px; }
    .line-info__list > li .icon { width: 50px; }
    .line-info__list > li .text-box { width: calc(100% - 70px); }

    .card-num__list, .product__wrap.col .card-num__list { flex-direction: column; }
    .card-num__item, .product__wrap.col .card-num__item { height: auto; }
    .step__row .product__item { width: 100%; }
    .step__row:not(.col) .product__item::before { left: 50%; top: -25px; transform: translateX(-50%) rotate(90deg); }
    .step__row:not(.col):nth-child(even) .product__item::before { transform: translateX(-50%) rotate(90deg); }
    .step__row:not(.col):nth-child(even) .product__item:last-child::before { display: block; }
    .step__row:first-child .product__item:last-child::after { display: none; }
    .product-step__wrap.flex { flex-wrap: wrap; gap: 40px; }

    .line-card__item .box { width: 100%; }
    .line-card__item > .tag { padding: 8px 10px; font-size: 16px; }
    .development__area .list > li { flex: none; width: 100%; height: clamp(160px,25.39vw,260px); }
    .column-tab .tab__item {font-size: 14px; }
    .column-tab .tab__item, .column-tab .tab__item.on { width: 50%; height: 60px; }
    .process-img .list { flex-direction: column; }
    .process-img .list > li { flex: none; }
    .desc__list > li { width: calc(50% - 10px); gap: 20px; }
    .table-item table thead th { height: 60px; }
    .table-item table tbody th, .table-item table td { height: 50px; font-size: 14px; }
    .table-item.font-ox th, .table-item.font-ox td { font-size: 14px; }

    .ir .board_box colgroup { display: none; }

    .esg__list > li:nth-child(1), .esg__list > li:nth-child(2), .esg__list > li:nth-child(3)  { width: 100%; }
    .esg__list > li:nth-child(1) > .bg { background-position: center 70%; }
    .esg__list > li > p { left: 20px; top: 20px; font-size: 30px; }
    .esg__list .text__box { padding-top: 80px; }
    .drop-down__box .btn-dropdown { height: 60px; padding-left: 20px; padding-right: 40px; font-size: 16px; }
    .drop-down__box .btn-dropdown::after { right: 20px; }
    .drop-down__box .drop-down__inner { padding: 25px 20px; }
    .drop-down__box .drop-down__inner::after { width: calc(100% - 40px); }
    .drop-down__box .text__box { padding-right: 20px; }
    .drop-down__box .text__box .top-text { margin-bottom: 20px; font-size: 15px; }
    .drop-down__box .text__box dt { font-size: 16px; }
    .drop-down__box .text__box dd { font-size: 14px; }
    .search__area form { height: 40px; }
    .search__area .search-select { width: 120px; font-size: 14px; padding: 0 14px; background-position: calc(100% - 14px) center; }
    .search__area .search-input { width: calc(100% - 180px ); padding: 0 14px; font-size: 14px; }
    .search__area .btn-search { width: 40px; height: 40px; background-size: 50%; }
    .board_box table tr { display: flex; flex-wrap: wrap; width: 100%; padding: 5px 0; }
    .board_box table td { display: inline-block; width: 100%; padding: 5px 10px; }
    .board_box table td.date { width: 110px; text-align: left; }
    .board_box table td.hit { position: relative; width: fit-content; text-align: left; }
    .board_box table td.hit::before { content: ""; position: absolute; left: -10px; top: 50%; display: block; width: 1px; height: 10px; background-color: #DDD; transform: translateY(-50%); }
    .board_box table td a { padding-block: 5px;  }
    .board_box table .notice td a { padding-left: 70px; }
    .board_box table .notice td .tag { width: 60px; left: 10px; font-size: 14px; }
    .about__area .text-box .button__wrap { flex-direction: column; align-items: flex-start; }

    .line-content__list > li, .line-content__list.col-3 > li { width: 100%; } 
    .social-diagram .text-box { flex-direction: column; align-items: center; gap: 20px; }
    .social-diagram .text-box dl { flex-direction: column; gap: 20px; }
    .social-diagram .text-box dt { margin-bottom: 0; font-size: 20px; }

    .talent__list > li { width: 100%; height: 500px; }
    .talent__list > li .text-box { height: auto; padding: 20px; }
    .circle-step__list > li { width: calc(50% - 10px); }
    .circle-step__list > li .circle .num { font-size: 14px; }
    .circle-step__list > li .circle > img { margin-top: 10px; }
    .circle-step__list > li .text { font-size: 16px; }
    .circle-step__list > li .circle::before { display: none; }
    .img-info__area .box .text-box, .system-02 .img-info__area .box .text-box { width: 100%; }

    .step-info .line-info__list > li { flex-direction: column; align-items: flex-start; gap: 20px; padding: 20px 10px; }
    .step-info .line-info__list > li .icon { width: 50px; }
    .step-info .line-info__list > li .text-box { width: 100%; }
    .step-info .info-box { padding: 20px; }
    .step-info .info-box > p { font-size: 14px; }
    .system-02 .img-info__area .box .text-box { width: 100%; }
    .job-info__area .box { width: 100%; }
}
@media screen and (max-width: 640px) {
    .img_borad_list .item,.section-board .img_borad_list .item { width: 100%; }
    .rnd .img_borad_list .item { width: calc(50% - 5px); }
    .rnd .img_borad_list .item .txt .title { font-size: 14px; }

    .greeting__wrap .img__area { flex-direction: column; }
    .about-main .img-box { height: 360px; }
    .about-info__list > li:not(:first-child) { width: calc(50% - 5px); }
    .history__wrap .line { left: 6px; }
    .history__item { flex-direction: column; padding-left: 40px; }
    .history__item .year-content { width: 100%; }
    .value__list > li { width: 100%; }

    .benefit__list > li { width: 100%; }
}

/* keyframes */
@keyframes textRight {
    0%{ opacity: 0; transform: translateX(-50%); }
    100%{ opacity: 1; transform: translateX(0%); }
}
@keyframes textLeft {
    0%{ opacity: 0; transform: translateX(50%); }
    100%{ opacity: 1; transform: translateX(0%); }
}