@charset "utf-8";
/* Powernet - style */
/* common */
html, body { font-family: 'PretendardJP-Regular'; font-size: 20px; font-weight: 400; color: #5a5858; background-color: #f9f9f9; }
body::after { position: absolute; content: url(../img/img_header_bg.jpg); width: 0; height: 0; overflow: hidden; z-index: -1; }
.screenCover { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: #fff; opacity: 1; visibility: visible; user-select: none; transition: all .3s ease-in-out; z-index: 10000; }
.screenCover.active { opacity: 0; visibility: hidden; }
.outline { position: relative; margin: 0 auto; width: 100%; max-width: 1400px; box-sizing: border-box; }
/* visual */
#visual { position: relative; width: 100%; height: 100vh; overflow: hidden;  }
#visual .topBg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../img/img_header_bg.jpg) no-repeat center / cover; }
#visual header { position: absolute; top: 60px; left: 0; box-sizing: border-box; z-index: 2; }
#visual header a { position: relative; display: inline-block; }
#visual header a img { width: clamp(133px, 16.64vw, 233px); }
#visual .outline { padding-top: 43.426vh; padding-bottom: clamp(140px, 18.519vh, 200px); height: 100vh; }
#visual .message { position: relative; }
#visual .message h2 { position: relative; margin-bottom: 1rem; padding-top: 1.5rem; font-size: clamp(28px, 2.86vw, 40px); font-family: 'PretendardJP-SemiBold'; font-weight: 600; color: #fff; line-height: 1.2; letter-spacing: -2px; z-index: 5; }
#visual .message h3 { position: relative; font-size: clamp(37px, 7.14vw, 100px); font-family: 'PretendardJP-Black'; font-weight: 900; color: rgba(255,255,255,.7); text-transform: uppercase; line-height: 0.8; z-index: 5; }
#visual .message figure { position: absolute; top: 0; left: -25px; z-index: 1; }
#visual .message figure img { width: clamp(229px, 25.43vw, 356px); }
#visual .goTo { position: absolute; right: 0; bottom: 90px; width: 280px; z-index: 100; }
/* #visual.main.active h2 { animation: mainTit01 1.2s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.75s; } */
/* @keyframes mainTit01 {
    0% { opacity: 0; transform: translateY(50px) translateX(0); }
    100% { opacity: 1; transform: translateY(0) translateX(0); }
} */
/* #visual.main.active h3 { animation: mainTit02 1.2s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 1s; } */
/* @keyframes mainTit02 {
    0% { opacity: 0; transform: translateY(50px) translateX(0); }
    100% { opacity: 1; transform: translateY(0) translateX(0); }
} */
/* #visual.main.active figure { animation: maindeco 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 0.3s; } */
/* @keyframes maindeco {
    0% { opacity: 0; transform: translateX(-100px) translateX(0); }
    100% { opacity: 1; transform: translateX(0) translateX(0); }
} */
/* #visual.main.active .goTo { animation: mainTit01 1.2s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: 1.35s; } */
.goTo { position: absolute; right: 0; bottom: 0; z-index: 100; }
.goTo.moMenu { backdrop-filter: blur(5px); }
.goTo .linkBtn { display: flex; justify-content: space-between; align-items: center; padding: 0 1.25rem; font-size: clamp(15px, 1.43vw, 20px); width: 100%; border: 2px solid rgba(255,255,255,.5); border-radius: 2rem; line-height: 3.25rem; cursor: pointer; user-select: none; box-sizing: border-box; }
.goTo .linkBtn span { font-size: inherit; color: #fff; }
.goTo .linkBtn span.arrow { font-size: inherit; color: #fff; transform: rotate(0deg); transform-origin: center; }
.goTo.active .linkBtn span.arrow {  transform: rotate(180deg); }
.goTo dd { position: absolute; bottom: 70px; left: 0; display: none; padding: 0.8rem 1.5rem; width: 100%; background-color: #f58220; border-radius: 1.5rem; z-index: 100; }
.goTo.active dd { display: block; }
.goTo dd ul li a { position: relative; display: block; }
.goTo dd ul li a span { position: relative; display: inline-block; font-size: clamp(15px, 1.43vw, 20px); color: #fff; font-family: 'PretendardJP-Bold'; font-weight: 700; line-height: 1.5rem; }
.goTo dd ul li a span::after { position: absolute; content: ""; left: 0; bottom: 0; width: 0; height: 2px; background-color: #fff; transition: width .3s; }
.goTo dd ul li a:hover span::after { width: 100%; }
@media all and (max-width: 1460px){
    #visual .outline { padding-left: 1.5rem; padding-right: 1.5rem; }
}
@media all and (max-width: 1400px){
    #visual header { left: 1.5rem; }
    #visual .goTo { right: 1.5rem; }
}
@media all and (max-width: 1024px){
    .goTo .linkBtn { padding: 0 1.25rem; line-height: 2.5rem; }
    .goTo dd { bottom: 55px; padding: 0.5rem 1.25rem; }
}
@media all and (max-width: 800px){
    #visual .goTo { bottom: 30px; }
}
@media all and (max-width: 599px){
    #visual .goTo { left: 1.5rem; right: 1.5rem; width: calc(100% - 3rem); box-sizing: border-box; }
    .goTo .linkBtn { border: 1px solid rgba(255,255,255,.5); }
    .goTo dd { bottom: 52px; }
}
@media all and (max-width: 480px){
    #visual .outline { padding-top: 39.432vh; }
    #visual header { top: 40px; }
}
/* footer */
#footer { position: relative; padding: 100px 0 60px; background-color: #171717; }
#footer h3 { margin-bottom: 1.6rem; font-size: clamp(38px, 3.57vw, 50px);; color: #fff; font-family: 'PretendardJP-SemiBold'; font-weight: 600; word-break: keep-all; }
#footer ul { position: relative; display: flex; flex-flow: row nowrap; justify-content: flex-start; gap: 2rem; margin-bottom: 5.7rem; }
#footer ul li { position: relative; }
#footer ul li a { position: relative; display: block; padding: 0.2rem 0; font-size: clamp(14px, 1vw, 18px); color: #909090; font-family: 'PretendardJP-SemiBold'; font-weight: 600; transition: 0.3s ease-in-out; line-height: 1; }
#footer ul li a:hover { color: #fff; }
#footer address { position: relative; padding-left: 10rem; font-style: normal; }
#footer address figure { position: absolute; top: 0; left: 0; display: inline-block; }
#footer address figure img { width: 180px; }
#footer address ol { position: relative; display: flex; flex-flow: row nowrap; gap: 1.5rem; padding-top: 0.5rem; margin-bottom: 0.8rem; }
#footer address ol li { display: inline-block; font-size: 18px; color: #909090; font-family: 'PretendardJP-SemiBold'; font-weight: 600; line-height: 1.3; }
#footer address ol li strong { color: #fff; font-family: 'PretendardJP-Bold'; font-weight: 700; line-height: inherit; }
#footer address p { position: relative; font-size: 18px; color: #909090; font-family: 'PretendardJP-SemiBold'; font-weight: 600; line-height: 1.3; }
#footer address p br { display: none; }
#footer .familySite { position: absolute; top: 0; right: 0; display: flex; flex-flow: row nowrap; gap: 4px; z-index: 10; }
#footer .familySite .goTo { position: relative; display: inline-block; width: 300px; }
#footer .familySite .goTo .linkBtn { line-height: calc(3rem - 4px); }
#footer .familySite .goTo dd { bottom: 61px; }
#footer .familySite .goTo dd ul { margin-bottom: 0; }
#footer .familySite .topMove { position: relative; display: inline-block; }
#footer .familySite .topMove a { position: relative; display: flex; justify-content: center; align-items: center; width: 3rem; height: 3rem; background-color: #f58220; border-radius: 50%; }
#footer .familySite .topMove a i { color: #fff; font-size: 1.5rem; }
@media all and (max-width: 1460px){
    #footer .outline { padding-left: 1.5rem; padding-right: 1.5rem; }
    #footer .familySite { right: 1.5rem; }
}
@media all and (max-width: 1240px){
    #footer address ol { flex-flow: row wrap; gap: 0.25rem; }
    #footer address ol li { width: 100%; }
}
@media all and (max-width: 1024px){
    #footer address figure img { width: 170px; }
    #footer ul { margin-bottom: 3.5rem; }
    #footer address ol li { font-size: 16px; }
    #footer address p { font-size: 16px; }
    #footer .familySite .goTo { width: 260px; }
}
@media all and (max-width: 900px){
    #footer h3 { padding-right: 360px; }
}
@media all and (max-width: 767px){
    #footer { padding: 70px 0 45px; }
    #footer h3 { padding-right: 0; }
    #footer address { padding-left: 0; }
    #footer address figure { position: relative; top: auto; left: auto; margin-bottom: 1rem; }
    #footer .familySite { position: relative; top: auto; right: auto; margin-top: 3rem; }
    #footer .familySite .goTo { width: calc(100% - 50px); }
    #footer .familySite .goTo .linkBtn { line-height: calc(2.5rem - 2px); }
    #footer .familySite .goTo dd { bottom: 53px; }
    #footer .familySite .topMove a { width: 2.5rem; height: 2.5rem; }
    #footer .familySite .topMove a i { font-size: 1.1rem; }
}
@media all and (max-width: 599px){
    #footer ul { gap: 0.5rem; margin-bottom: 2.5rem; }
}
@media all and (max-width: 480px){
    #footer address p br { display: inline; }
}
/* index - con */
#indexWrap { position: relative; }
#indexWrap section { position: relative; padding: 16.667vh 0; height: 100vh; background-color: #fff; overflow: hidden; }
#indexWrap section.no02,
#indexWrap section.no04 { background-color: #f5f5f5; border: 1px solid #eee; }
#indexWrap section.no01 picture,
#indexWrap section.no03 picture { position: absolute; top: 16.667vh; right: 60.42vw; display: inline-block; text-align: right; width: 100%; height: calc(100vh - 16.667vh * 2); }
#indexWrap section.no01 picture img,
#indexWrap section.no03 picture img { position: absolute; top: 0; right: 0; bottom: 0; height: 100%; object-fit: contain; }
#indexWrap section.no01 .outline,
#indexWrap section.no03 .outline { display: flex; flex-flow: row nowrap; justify-content: flex-end; align-items: flex-end; height: calc(100vh - 16.667vh * 2); }
#indexWrap section.no01 .outline .boxWrap,
#indexWrap section.no03 .outline .boxWrap { width: 56%; }
#indexWrap section.no02 picture { position: absolute; top: 16.667vh; left: 60.42vw; display: inline-block; text-align: left; width: 100%; height: calc(100vh - 16.667vh * 2); }
#indexWrap section.no02 picture img { position: absolute; top: 0; left: 0; bottom: 0; height: 100%; object-fit: contain; }
#indexWrap section.no02 .outline { display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: flex-end; height: calc(100vh - 16.667vh * 2); }
#indexWrap section.no02 .outline .boxWrap { width: 56%; }
#indexWrap section.no04 picture { position: absolute; top: 16.667vh; left: 60.42vw; display: inline-block; text-align: left; width: 100%; height: calc(100vh - 16.667vh * 2); }
#indexWrap section.no04 picture img { position: absolute; top: 0; left: 0; bottom: 0; height: 100%; object-fit: contain; }
#indexWrap section.no04 .outline { display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: flex-end; height: calc(100vh - 16.667vh * 2); }
#indexWrap section.no04 .outline .boxWrap { width: 56%; }
#indexWrap section h2 { margin-bottom: 1rem; font-size: clamp(34px, 3.57vw, 50px); font-family: 'PretendardJP-Black'; font-weight: 900; color: var(--logoClr); letter-spacing: -1.5px; }
#indexWrap section p { font-size: clamp(16px, 1.43vw, 20px); }
#indexWrap section.management p { margin-bottom: 3rem; }
#indexWrap section.environment p { margin-bottom: 7rem; }
#indexWrap section.social p { margin-bottom: 5rem; }
#indexWrap section.governance p { margin-bottom: 7rem; }
#indexWrap section .linkWrap { position: relative; display: block; padding-right: 2.75rem; text-align: right; }
#indexWrap section a.pageLink { display: inline-block; text-align: right; }
#indexWrap section a.pageLink span { display: block; transition: all .5s cubic-bezier(0.76, 0, 0.24, 1); }
#indexWrap section a.pageLink:hover span { transform: translateX(10px); }
#indexWrap section a.pageLink span em { display: inline; font-size: clamp(38px, 7.14vw, 100px); font-family: 'PretendardJP-Black'; font-weight: 900; color: #000; letter-spacing: -2px; text-transform: uppercase; font-style: normal; line-height: 0.95; }
#indexWrap section a.pageLink span.spinIcon { position: absolute; right: 0; bottom: 0.3rem; display: flex; justify-content: center; align-items: center; width: clamp(38px, 3.57vw, 50px); height: clamp(38px, 3.57vw, 50px); transform: rotate(0deg); background-color: #000; border-radius: 50%; transition: all .5s cubic-bezier(0.76, 0, 0.24, 1); }
#indexWrap section a.pageLink:hover span.spinIcon { transform: rotate(360deg); }
#indexWrap section a.pageLink span.spinIcon i { font-size: 1.5rem; color: #fff; }
#indexWrap section:nth-child(even) .linkWrap { text-align: left; }
@media all and (max-width: 1460px){
    #indexWrap section:nth-child(odd) .boxWrap { padding-right: 1.5rem; }
    #indexWrap section:nth-child(even) .boxWrap { padding-left: 1.5rem; }
    #indexWrap section a.pageLink span em { font-size: clamp(38px, 6.43vw, 90px); }
}
@media all and (max-width: 767px){
    #indexWrap section { display: flex; flex-flow: column; padding: 70px 0 20px; height: auto; }
    #indexWrap section picture { order: 2; }
    #indexWrap section .outline { order: 1; margin-bottom: 1.5rem; }
    #indexWrap section:nth-child(odd) picture { position: relative; top: auto; right: auto; display: inline-block; text-align: right; width: 100%; height: 78.23vw; }
    #indexWrap section:nth-child(odd) picture img { position: absolute; top: 0; right: 1.5rem; bottom: 0; height: 100%; border-top-right-radius: 18px; border-bottom-right-radius: 18px; }
    #indexWrap section:nth-child(odd) .outline { height: auto; }
    #indexWrap section:nth-child(odd) .outline .boxWrap { padding-left: 1.5rem; width: 100%; }
    #indexWrap section:nth-child(even) picture { position: relative; top: auto; left: auto; text-align: left; width: 100%; height: 78.23vw; }
    #indexWrap section:nth-child(even) picture img { position: absolute; top: 0; left: 1.5rem; bottom: 0; height: 100%; border-top-left-radius: 18px; border-bottom-left-radius: 18px; }
    #indexWrap section:nth-child(even) .outline { height: auto; }
    #indexWrap section:nth-child(even) .outline .boxWrap { padding-right: 1.5rem; width: 100%; }
    #indexWrap section.management p { margin-bottom: 2rem; }
    #indexWrap section.environment p { margin-bottom: 2rem; }
    #indexWrap section.social p { margin-bottom: 2rem; }
    #indexWrap section.governance p { margin-bottom: 2rem; }
    #indexWrap section:nth-child(even) .linkWrap { text-align: right; }
    #indexWrap section p br { display: none; }
    #indexWrap section p br.all { display: inline; }
}
@media all and (max-width: 480px){
    #indexWrap section:nth-child(odd) picture,
    #indexWrap section:nth-child(even) picture { height: 120vw; }
    #indexWrap section .linkWrap { text-align: left; padding-right: 0; padding-bottom: 2rem; }
    #indexWrap section a.pageLink { text-align: inherit; }
    #indexWrap section:nth-child(even) .linkWrap { text-align: left; }
}
/* *** Sub page Common *** */
.conTit01 { font-size: clamp(30px, 3.57vw, 50px); color: #222; font-family: 'PretendardJP-Bold'; font-weight: 700; line-height: 1.1; letter-spacing: -1px; }
.conTit02 { font-size: clamp(30px, 5vw, 40px); color: #222; font-family: 'PretendardJP-Bold'; font-weight: 700; line-height: 1.1; letter-spacing: -1px; }
.conTit03 { font-size: clamp(18px, 2.14vw, 30px); color: #222; font-family: 'PretendardJP-Bold'; font-weight: 700; line-height: 1.1; letter-spacing: -1px; }
.conTit03_01 { font-size: clamp(22px, 3.75vw, 30px); color: #222; font-family: 'PretendardJP-Bold'; font-weight: 700; line-height: 1.1; letter-spacing: -1px; }
.conTit04 { font-size: clamp(20px, 1.79vw, 25px); color: #222; font-family: 'PretendardJP-Bold'; font-weight: 700; line-height: 1.1; letter-spacing: -1px; }
.conTit05 { font-size: clamp(16px, 1.6vw, 23px); color: #222; font-family: 'PretendardJP-SemiBold'; font-weight: 600; line-height: 1.1; letter-spacing: -1px; }
.conTit06 { font-size: clamp(14px, 1.29vw, 18px); color: #222; font-family: 'PretendardJP-Bold'; font-weight: 700; line-height: 1.1; letter-spacing: -1px; }
.con01 { font-size: clamp(16px, 1.43vw, 20px); color: #222; font-family: 'PretendardJP-Regular'; font-weight: 400; letter-spacing: -0.2px; }
.con02 { font-size: clamp(12px, 1.3vw, 20px); color: #222; font-family: 'PretendardJP-Regular'; font-weight: 400; letter-spacing: -0.2px; }
#visual.subPage .outline { position: relative; display: block; padding: 0; width: 100%; height: 100%; min-height: 100vh; }
#visual.subPage .titTopBox { position: relative; padding-top: 41.369vh; }
#visual.subPage .titTopBox .pageTit { position: relative; font-size: clamp(20px, 5.71vw, 80px); font-family: 'PretendardJP-ExtraBold'; font-weight: 800; color: #fff; text-align: center; width: 100%; }
#visual.subPage .titTopBox .pageTit strong { display: none; }
#visual.subPage .titTopBox ul { position: relative; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; gap: 40px; margin: 20px auto 0; padding: 0 10px; width: 553px; height: 60px; background-color: var(--logoClr); border-radius: 30px; box-sizing: border-box; }
#visual.subPage .titTopBox ul.fixed { position: fixed; top: 10px; left: 50%; margin-top: 0; transform: translateX(-50%); z-index: 100000 !important; }
#visual.subPage .titTopBox ul li { display: block; }
#visual.subPage .titTopBox ul li a { display: inline-block; padding: 0 20px; font-size: 20px; font-family: 'PretendardJP-Bold'; font-weight: 700; color: #fff; transition: all .3s cubic-bezier(0.76, 0, 0.24, 1);; line-height: 40px; border-radius: 22px; box-sizing: border-box; }
#visual.subPage .titTopBox ul li a:hover { color: #000; background-color: #fff; }
#visual.subPage .titTopBox ul li.on a { color: #000; background-color: #fff; }
#visual.subPage.esgmanageCon .topBg { background: url(../img/subPage/esgManagement_bg_01.jpg) no-repeat center / cover; }
#visual.subPage.environmentCon .topBg { background: url(../img/subPage/environment_bg_01.jpg) no-repeat center / cover; }
#visual.subPage.socialCon .topBg { background: url(../img/subPage/social_bg_01.jpg) no-repeat center / cover; }
#visual.subPage.governanceCon .topBg { background: url(../img/subPage/governance_bg_01.jpg) no-repeat center / cover; }
#visual.subPage .goTo.moMenu { display: none; }
#subConWrap { position: relative; padding: 1.5rem 0 0; }
#subConWrap .outline { position: relative; padding: 6.75rem 0 4rem; }
/* table */
.tableWrap { position: relative; }
.tableWrap .scrollInfo { position: relative; display: none; margin-bottom: 10px; }
.tableWrap .scrollInfo span { display: inline-block; margin-right: 5px; font-size: 18px; font-family: 'PretendardJP-Bold'; font-weight: 700; color: var(--logoClr); text-transform: uppercase; line-height: 1; }
.tableWrap .scrollInfo i { font-size: 1rem; color: var(--logoClr); animation: scrollIngo 1.5s infinite ease; }
.tableWrap .scrollWrap { overflow: hidden; }
@keyframes scrollIngo {
    0% { transform: translateX(0); }
    50% { transform: translateX(8px); }
    100% { transform: translateX(0); }
}
table { border-top: 2px solid #000; }
table tr th { padding: 25px 10px; font-size: 20px; color: #222; font-family: 'PretendardJP-Medium';font-weight: 500; line-height: 1; background-color: #f0f8ff; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; }
table tr th:last-child { border-right: 0px solid #e0e0e0; }
table tr td { padding: 25px 10px; font-size: 20px; color: #222; font-family: 'PretendardJP-Medium';font-weight: 500; line-height: 1; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; }
table tr td:last-child { border-right: 0px solid #e0e0e0; }
#subConWrap .first h3 { margin-bottom: 100px; }
@media all and (max-width: 1400px){
    #subConWrap .first { padding: 0 4.29vw; }
    #subConWrap .first h3 { margin-bottom: 7.14vw; }
}
@media all and (max-width: 1200px){
    table tr th { padding: 20px 10px; }
    table tr td { padding: 20px 10px; }
}
@media all and (max-width: 1023px){
    .tableWrap .scrollWrap { overflow-x: auto; }
    .tableWrap .scrollWrap table { width: 1024px; }
    .tableWrap .scrollInfo { display: block; }
}
@media all and (max-width: 800px){
    #subConWrap .first { padding: 0 7.5vw; }
    #subConWrap .first h3 { display: none; }
}
@media all and (max-width: 768px){
    #subConWrap .outline { padding: 45px 0 30px 0; }
    #subConWrap .big .outline { padding: 120px 0 30px 0; }
}
@media all and (max-width: 767px){
    #subConWrap.esgmanage .first { padding: 0 0 0 40px; }
    #visual.subPage .titTopBox { padding-top: 41.667vh; }
    #visual.subPage .titTopBox .pageTit strong { display: block; margin-top: 5px; font-size: clamp(32px, 10.42vw, 80px); letter-spacing: -1px; white-space: nowrap; }
    #visual.subPage .titTopBox ul { display: none; }
    #visual.subPage.esgmanageCon .topBg { background-image: url(../img/subPage/esgManagement_bg_01m.jpg); }
    #visual.subPage.environmentCon .topBg { background-image: url(../img/subPage/environment_bg_01m.jpg); }
    #visual.subPage.socialCon .topBg { background-image: url(../img/subPage/social_bg_01m.jpg); }
    #visual.subPage.governanceCon .topBg { background: url(../img/subPage/governance_bg_01m.jpg) no-repeat center / cover; }
    #visual.subPage .goTo.moMenu { display: block; left: 1.5rem; right: 1.5rem; bottom: 20px; width: calc(100% - 3rem); box-sizing: border-box; }
    #subConWrap .first { padding: 0 0 0 7.5vw; }
    #subConWrap .first h3,
    #subConWrap .first h4,
    #subConWrap .first p.con01 { padding-right: 7.5vw; }
}
@media all and (max-width: 480px){
    .esgmanage .first { padding: 0 0 0 30px; }
    .esgmanage .first h3,
    .esgmanage .first h4,
    .esgmanage .first p.con01 { padding-right: 30px; }
}
/* sub ani */
#visual.subPage .topBg { transform: scale(1.05); transition: var(--transition04); transform-origin: center; transition-delay: .3s; }
#visual.subPage .outline .titTopBox h2 { transform: translateY(30px); transition: var(--transition01); transition-delay: .3s; opacity: 0; }
#visual.subPage .outline .titTopBox ul { transition: opacity 1s ease-in-out; transition-delay: .45s; opacity: 0; }
#visual.subPage .outline .goTo.moMenu { transform: translateY(30px); transition: var(--transition02); transition-delay: .6s; opacity: 0; }
#visual.subPage.active .topBg { transform: scale(1); }
#visual.subPage.active .outline .titTopBox h2 { transform: translateY(0px); opacity: 1; }
#visual.subPage.active .outline .titTopBox ul { opacity: 1; }
#visual.subPage.active .outline .goTo.moMenu { transform: translateY(0px); opacity: 1; }
#subConWrap.subCon .fadeUp { transform: translateY(30px); transition: var(--transition02); transition-delay: .2s; opacity: 0; }
#subConWrap.subCon .fadeWrap > .fadeUp + .fadeUp { transition-delay: .3s; }
#subConWrap.subCon .fadeWrap > .fadeUp:nth-child(3) { transition-delay: .4s; }
#subConWrap.subCon .fadeUp.active { transform: translateY(0px); opacity: 1; }
.subCon section .outline picture { display: block; }
/* first 공통 */
.subCon .first .outline { padding-top: 80px; padding-bottom: 60px; }
.subCon h3 { margin-bottom: 65px; text-align: center; }
.subCon .esgKeyMessage { margin-bottom: 80px; font-size: clamp(32px, 4.29vw, 60px); font-family: 'PretendardJP-ExtraBold'; font-weight: 800; color: #222; line-height: 1.05; letter-spacing: -1.5px; }
.subCon .esgKeyMessage small { display: block; margin-bottom: 5px; font-size: inherit; font-family: 'PretendardJP-Regular'; font-weight: 400; color: inherit; }
.subCon p { padding-left: 750px; margin-bottom: 60px; }
.subCon p strong { display: block; font-family: 'PretendardJP-Bold'; font-weight: 700; }
@media all and (max-width: 1400px){
    .subCon h3 { margin-bottom: 5.63vw; }
    .subCon .esgKeyMessage { margin-bottom: 5.71vw; }
    .subCon p { padding-left: 40vw; margin-bottom: 4.29vw; }
}
@media all and (max-width: 800px){
    .subCon .first .outline { padding-top: 45px; padding-bottom: 30px; }
    .subCon h3 { margin-bottom: 3vh; }
    .subCon p { padding-left: 0; margin-bottom: 4.29vw; }
}
/* 경영방향 */
.esgmanage .direc .boxWrap .box { position: relative; display: flex; flex-flow: row nowrap; justify-content: space-between; gap: 100px; margin-bottom: 30px; }
.esgmanage .direc .boxWrap .box:last-child { margin-bottom: 0; }
.esgmanage .direc .boxWrap .box li { position: relative; width: calc(50% - 100px / 2); background-color: #f1f2f5; border-radius: 110px; }
.esgmanage .direc .boxWrap .box .left { padding: 40px 70px 40px 230px;  }
.esgmanage .direc .boxWrap .box .left::before { position: absolute; content: url(../img/subPage/esgManagement_09.png); top: 50%; transform: translate(50%, -50%); right: -50px; }
.esgmanage .direc .boxWrap .box .left .cirWrap { position: absolute; top: 50%; left: 13px; transform: translateY(-50%); display: flex; flex-flow: column; justify-content: center; align-items: center; width: 186px; height: 186px; border-radius: 50%; border: 1px solid #e0e0e0; background-color: #fff; }
.esgmanage .direc .boxWrap .box .left .cirWrap h4 { display: block; margin-top: 10px; text-align: center; }
.esgmanage .direc .boxWrap .box .left .cirWrap h4 span { display: block; text-align: center; font-size: 0.72em; font-family: 'PretendardJP-Regular'; font-weight: 400; }
.esgmanage .direc .boxWrap .box li h5 { margin-bottom: 25px; }
.esgmanage .direc .boxWrap .box .right { display: flex; justify-content: center; align-items: center; }
.esgmanage .direc .boxWrap .box .lay01 { position: relative; padding-left: 120px; }
.esgmanage .direc .boxWrap .box .lay01 dt { position: absolute; top: 0; left: 0; width: 104px; color: #fff; text-align: center; line-height: 35px; border-radius: 20px; }
.esgmanage .direc .boxWrap .box .lay01 dd { position: relative; }
.esgmanage .direc .boxWrap .box .lay01 dd span { position: relative; display: block; padding-left: 10px; }
.esgmanage .direc .boxWrap .box .lay01 dd span::before { position: absolute; content: ""; left: 0; top: 13px; width: 3px; height: 3px; border-radius: 3px; background-color: #222; }
.esgmanage .direc .boxWrap .box .left .lay01 dt { background-color: #5c5c5c; }
.esgmanage .direc .boxWrap .box .right .lay01 dt { background-color: var(--logoClr); }
@media all and (max-width: 1400px){
    .esgmanage .direc { padding: 0 4.29vw; }
    .esgmanage .direc .boxWrap .box li { border-radius: 70px; }
    .esgmanage .direc .boxWrap .box .left { padding: 30px 50px 30px 200px; }
    .esgmanage .direc .boxWrap .box .left .cirWrap { left: 10px; width: 170px; height: 170px; }
    .esgmanage .direc .boxWrap .box li h5 { margin-bottom: 15px; }
    .esgmanage .direc .boxWrap .box .lay01 { padding-left: 0; }
    .esgmanage .direc .boxWrap .box .lay01 dt { position: relative; top: auto; left: auto; margin-bottom: 5px; /* width: 104px; */ }
}
@media all and (max-width: 1024px){
    .esgmanage .direc .boxWrap .box { gap: 60px; margin-bottom: 20px; }
    .esgmanage .direc .boxWrap .box li { width: calc(50% - 60px / 2); border-radius: 50px; }
    .esgmanage .direc .boxWrap .box .left { padding: 30px 50px 30px 180px; }
    .esgmanage .direc .boxWrap .box .left::before { right: -30px; }
    .esgmanage .direc .boxWrap .box .left .cirWrap { width: 150px; height: 150px; }
    .esgmanage .direc .boxWrap .box .lay01 dt { width: 90px; }
}
@media all and (max-width: 900px){
    .esgmanage .direc .boxWrap .box { flex-flow: row wrap; gap: 10px; margin-left: auto; margin-right: auto; margin-bottom: 30px; max-width: 700px;; }
    .esgmanage .direc .boxWrap .box li { width: 100%; }
    .esgmanage .direc .boxWrap .box .left { padding: 30px 50px 30px 180px; }
    .esgmanage .direc .boxWrap .box .left::before { display: none; }
    .esgmanage .direc .boxWrap .box .left .cirWrap { width: 150px; height: 150px; }
    .esgmanage .direc .boxWrap .box .right { display: flex; justify-content: flex-start; padding: 30px 50px 30px 180px; }
    .esgmanage .direc .boxWrap .box .lay01 { padding-left: 120px; }
    .esgmanage .direc .boxWrap .box .lay01 dt { position: absolute; top: 0; left: 0; width: 100px; }
    .esgmanage .direc .boxWrap .box .lay01 dd span::before { top: 10px; }
}
@media all and (max-width: 800px){
    .esgmanage .direc { padding: 0 7.5vw; }
}
@media all and (max-width: 768px){
    .esgmanage .direc { padding: 0 40px; }
}
@media all and (max-width: 699px){
    .esgmanage .direc .boxWrap .box .lay01 { padding-left: 0; }
    .esgmanage .direc .boxWrap .box .lay01 dt { position: relative; top: auto; left: auto; margin-bottom: 5px; }
}
@media all and (max-width: 599px){
    .esgmanage .direc .boxWrap .box li { border-radius: 30px; }
    .esgmanage .direc .boxWrap .box .left { padding: 30px }
    .esgmanage .direc .boxWrap .box .left .cirWrap { position: relative; top: auto; left: auto; transform: translateY(0); margin-bottom: 15px; }
    .esgmanage .direc .boxWrap .box .right { padding: 30px }
    .esgmanage .direc .boxWrap .box .lay01 { padding-left: 120px; }
    .esgmanage .direc .boxWrap .box .lay01 dt { position: absolute; top: 0; left: 0; width: 100px; }
}
@media all and (max-width: 480px){
    .esgmanage .direc { padding: 0 30px; }
    .esgmanage .direc .boxWrap .box .lay01 { padding-left: 0; }
    .esgmanage .direc .boxWrap .box .lay01 dt { position: relative; top: auto; left: auto; margin-bottom: 5px; }
}
/* 조직 */
.esgmanage .group { padding: 0 4.29vw; }
.esgmanage .group .imgWrap img { width: 100%; }
@media all and (max-width: 800px){
    .esgmanage .group { padding: 0 7.5vw; }
}
@media all and (max-width: 768px){
    .esgmanage .group { padding: 0 40px; }
}
@media all and (max-width: 767px){
    .esgmanage .group .imgWrap img { display: block; margin: 0 auto; max-width: 260px; }
}
@media all and (max-width: 480px){
    .esgmanage .group { padding: 0 30px; }
}
/* 관리지표 */
.esgmanage .impo { padding: 0 4.29vw; }
.esgmanage .impo .outline { padding: 3.75rem 0 7.5rem 0; }
.esgmanage .impo .scrollWrap { height: auto; }
.esgmanage .impo .tableWrap #mCSB_1_container.mCSB_container { width: 100%; }
.esgmanage .impo .tableWrap table .no01 { width: 21%; }
.esgmanage .impo .tableWrap table .no02 { width: 18%; }
.esgmanage .impo .tableWrap table .no03 { width: auto; }
.esgmanage .impo .tableWrap table .no04 { width: 15%; }
.esgmanage .impo .tableWrap table .no05 { width: 15%; }
.esgmanage .impo .tableWrap table tr th { font-size: clamp(16px, 1.43vw, 20px); }
.esgmanage .impo .tableWrap table tr td { font-size: clamp(16px, 1.43vw, 20px); text-align: center; }
@media all and (max-width: 768px){
    .esgmanage .impo .scrollWrap table { width: 1000px; }
}
@media all and (max-width: 767px){
    .esgmanage .impo .outline { padding: 12vw 0 18vw 0; }
}
/* ISO 인증서 */
.esgmanage .last { background: url(../img/subPage/esgManagement_bg_02.jpg) no-repeat center; background-size: cover; }
.esgmanage .last .outline { padding: 193px 0 124px; }
.esgmanage .last .inBx { padding: 83px 110px 93px; background-color: rgba(255, 255, 255, .95); border-radius: 0.75rem; }
.esgmanage .last .inBx ul { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; gap: 70px; }
.esgmanage .last .inBx ul li { text-align: center; width: calc(33.3333% - 140px / 3); }
.esgmanage .last .inBx ul li img { box-shadow: 22px 22px 54px rgba(173, 173, 173, .5); }
@media all and (max-width: 1400px){
    .esgmanage .last { padding: 0 60px; }
    .esgmanage .last .outline { padding: 130px 0 160px; }
    .esgmanage .last .inBx { padding: 100px 80px 100px; }
    .esgmanage .last .inBx ul { gap: 5vw; }
    .esgmanage .last .inBx ul li { width: calc(33.3333% - 10vw / 3); }
}
@media all and (max-width: 800px){
    .esgmanage .last { background-image: url(../img/subPage/esgManagement_bg_02m.jpg); }
    .esgmanage .last { padding: 0 7.5vw; }
    .esgmanage .last .outline { padding: 16.25vw 0 20vw; }
    .esgmanage .last .inBx { padding: 12.5vw 10vw 12.5vw; }
    .esgmanage .last .inBx ul { gap: 5.63vw; }
    .esgmanage .last .inBx ul li { width: 100%; text-align: center; }
    .esgmanage .last .inBx ul li img { width: 100%; max-width: 320px; }
}
/* environment (환경) */
/* first */
.environment .first { overflow: hidden; }
.environment .first .sliderWrap { position: relative; user-select: none; }
.environment .first #slider { position: relative; width: 100%; height: 400px; overflow: hidden; }
.environment .first .swiper-slide { position: relative; background: no-repeat center; background-size: cover; border-radius: 10px; }
.environment .first .swiper-slide.no01 { background-image: url(../img/subPage/environment_slide_01.png); }
.environment .first .swiper-slide.no02 { background-image: url(../img/subPage/environment_slide_02.png); }
.environment .first .swiper-slide.no03 { background-image: url(../img/subPage/environment_slide_03.png); }
.environment .first .swiper-slide strong { position: absolute; right: 60px; bottom: 50px; color: #fff; text-shadow: 0 0 20px #000; line-height: 1; }
@media all and (max-width: 800px){
    .environment .first #slider { overflow: visible; }
    .environment .first .swiper-wrapper { transition-timing-function: linear; }
    .environment .first .swiper-slide.no01 { background-image: url(../img/subPage/environment_slide_01m.png); }
    .environment .first .swiper-slide.no02 { background-image: url(../img/subPage/environment_slide_02m.png); }
    .environment .first .swiper-slide.no03 { background-image: url(../img/subPage/environment_slide_03m.png); }
    .environment .first .swiper-slide strong { right: 30px; bottom: 30px; font-size: clamp(22px, 3.5vw, 28px); }
}
/* second */
.environment .second .outline > p { padding: 0; text-align: center; }
.environment .second .outline p.con01 { margin-bottom: 100px; }
.environment .second .boxWrap { position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; gap: 45px; margin-bottom: 140px; }
.environment .second .boxWrap figure { display: flex; justify-content: center; align-items: center; margin-bottom: 15px; height: 95px; }
.environment .second .boxWrap li { padding: 50px 40px; text-align: center; width: calc(33.3333% - 90px / 3); box-shadow: 22px 22px 54px rgba(173, 173, 173, .6); border-radius: 15px; }
.environment .second .boxWrap h4 { margin-bottom: 35px; font-size: clamp(22px, 2.14vw, 30px); text-align: center; color: #000; }
.environment .second .boxWrap h4 small { display: block; margin-bottom: 6px; font-size: clamp(16px, 1.3vw, 20px); text-align: center; font-family: 'PretendardJP-Regular'; font-weight: 400; color: #010101; }
.environment .second .boxWrap li p { padding: 0; margin: 0; font-size: clamp(16px, 1.3vw, 20px); color: #6a6a6a; }
.environment .second .graphWrap figure { display: inline-block; }
.environment .second .graphWrap figure img { max-width: 904px; }
.graphWrap { position: relative; padding-left: 430px; }
.graphWrap h4 { position: absolute; left: 25px; top: 40px; }
.graphWrap figure { display: inline-block; }
.graphWrap figure img { width: 100%; }
.graphWrap figure figcaption { display: block; margin-top: 25px; text-align: left; }
/* third */
.environment .third { position: relative; background: url(../img/subPage/environment_bg_03.jpg) no-repeat center; background-size: cover; }
.environment .third::before { position: absolute; content: ""; top: 0; left: 0; width: 52%; height: 100%; background-color: rgba(0,0,0,.4); }
.environment .third .outline { position: relative; z-index: 10; }
.environment .third h3 { margin-bottom: 25px; color: #fff; text-align: left; }
.environment .third ul { width: 50%; }
.environment .third ul li { position: relative; padding-left: 10px; color: #fff; }
.environment .third ul li::before { position: absolute; content: ""; top: 12px; left: 2px; width: 3px; height: 3px; border-radius: 50%; background-color: #fff; }
.environment .third ul li em { position: relative; display: inline-block; padding: 0 5px; }
.environment .third ul li em span { position: relative; display: inline-block; font-family: 'PretendardJP-SemiBold'; font-weight: 600; font-style: normal; border-radius: 5px; z-index: 10;  }
.environment .third ul li em::before { position: absolute; content: ""; left: 0; top: 50%; transform: translateY(-50%); width: 0; height: 94%; background-color: var(--logoClr); border-radius: 5px; transition: width .8s cubic-bezier(0.76, 0, 0.24, 1); z-index: 0; }
.environment .third ul li em.action::before { width: 100%; }
/* .environment .third ul li.barDeco.action em::before { width: 100%; } */
/* fourth */
.environment .fourth .graphWrap figure img { max-width: 639px; }
/* last */
.environment .last { background: url(../img/subPage/environment_bg_02.jpg) no-repeat center; background-size: cover; }
.environment .last .inBx { position: relative; padding: 85px 90px; background-color: rgba(255,255,255,0.9); border-radius: 15px; /* border: 2px solid red; */ }
.environment .last .inBx h3 { text-align: left; }
.environment .last .inBx h4 { margin-bottom: 25px; color: var(--logoClr); }
.environment .last .inBx p { padding: 0; margin-bottom: 0; }
.environment .last .inBx p.ceo { margin-top: 50px; }
@media all and (max-width: 1400px){
    .environment .second { padding: 0 4.29vw; }
    .environment .third { padding: 0 4.29vw; }
    .environment .third::before { width: 60%; }
    .environment .third ul { width: 58%; }
    .environment .fourth { padding: 0 4.29vw; }
    .environment .last { padding: 0 4.29vw; }
}
@media all and (max-width: 1024px){
    .environment .second .boxWrap figure { height: 70px; }
    .environment .second .boxWrap figure img { width: auto; height: 100%; }
    .environment .second .boxWrap { gap: 5.208vh; margin-bottom: 11.719vh; }
    .environment .second .boxWrap li { padding: 50px 30px; margin: 0 auto; width: 94%; max-width: 380px; }
    .environment .second .graphWrap figure img { max-width: 904px; }
    .graphWrap { padding-left: 0; }
    .graphWrap h4 { position: relative; left: auto; top: auto; margin-bottom: 20px; }
    .graphWrap figure figcaption { margin-top: 20px; font-size: 18px; }
    .environment .last .inBx { padding: 9.115vh 6.84vw; }
}
@media all and (max-width: 800px){
    .environment .second { padding: 0 7.5vw; }
    .environment .third { padding: 0 7.5vw; background-image: url(../img/subPage/environment_bg_03m.jpg); }
    .environment .third::before { width: 100%; }
    .environment .third ul { width: 100%; }
    .environment .fourth { padding: 0 7.5vw; }
    .environment .last { padding: 0 7.5vw; background-image: url(../img/subPage/environment_bg_02m.jpg); }
}
@media all and (max-width: 768px){
    .environment .third .outline { padding: 100px 0; }
}
@media all and (max-width: 767px){
    .environment .second .outline p.con01 { margin-bottom: 50px; }
}
@media all and (max-width: 480px){
    .environment .third .outline { padding: 80px 0; }
    .graphWrap figure figcaption { font-size: 16px; }
}
/* social (사회) */
.circleBx { position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; gap: 50px; }
.circleBx li { padding: 35px; width: calc(33.3333% - 100px / 3); box-shadow: 22px 22px 54px rgba(173, 173, 173, .6); border-radius: 15px; }
.circleBx li span { position: relative; display: flex; justify-content: center; align-items: center; margin-bottom: 20px; color: #fff; font-family: 'PretendardJP-Bold'; font-weight: 700; background-color: var(--logoClr); width: 60px; height: 60px; border-radius: 50%; }
.circleBx li p { padding: 0; margin: 0; }
.scrollWrap { padding: 50px; height: 500px; background-color: #f2f2f2; border-radius: 20px; }
.scrollWrap + h3 { margin-top: 130px; }
.scrollWrap .scrollBx { height: 100%; overflow: hidden; overflow-y: auto; }
.scrollWrap .scrollBx h6 { margin-bottom: 20px; text-align: left; font-family: 'PretendardJP-ExtraBold'; font-weight: 800; }
.scrollWrap .scrollBx dl + h6 { margin-top: 60px; }
.scrollWrap .scrollBx dl dt { font-family: 'PretendardJP-ExtraBold'; font-weight: 800; }
.scrollWrap .scrollBx dl dd + dt { margin-top: 20px; }
/* second */
.social .second .boxWrap { margin-bottom: 120px; }
.social .second .boxWrap li p { padding: 0; margin: 0; }
.social .second .graphWrap { padding-left: 400px; }
.social .second .graphWrap .infoWrap { position: absolute; top: 0; left: 25px; }
.social .second .graphWrap .infoWrap h4 { position: relative; left: auto; top: auto; margin-bottom: 5px; }
.social .second .graphWrap .infoWrap ul li { position: relative; padding-left: 30px; }
.social .second .graphWrap .infoWrap ul li span { position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 22px; height: 22px; background-color: var(--logoClr); }
.social .second .graphWrap .infoWrap ul li:nth-child(1) span { position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 22px; height: 22px; background-color: #274186; }
.social .second .graphWrap .imgWrap img { width: 100%; max-width: 985px; }
/* third */
.social .third { background: url(../img/subPage/social_bg_02.jpg) no-repeat center; background-size: cover; }
.social .third .boxWrap { position: relative; display: flex; flex-flow: row wrap; gap: 20px; }
.social .third .boxWrap .box { width: calc(50% - 20px / 2); }
.social .third .boxWrap .box h4 { margin-bottom: 40px; color: #fff; text-align: center; }
.social .third .boxWrap .box ul li { display: flex; justify-content: center; align-items: center; margin-bottom: 20px; padding: 12px 10px; text-align: center; color: #fff; min-height: 145px; background-color: rgba(255,255,255,.3); border-radius: 15px; }
/* fourth */
.social .fourth p { padding: 0; }
.social .fourth .boxWrap { display: flex; flex-flow: column; gap: 30px; }
.social .fourth .boxWrap .box { position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; gap: 10px; padding: 34px; box-shadow: 22px 22px 54px rgba(173, 173, 173, .6); border-radius: 15px; }
.social .fourth .boxWrap .box figure { position: absolute; top: 34px; left: 34px; text-align: center; }
.social .fourth .boxWrap .box figure img { width: auto; height: 59px; }
.social .fourth .boxWrap .box h5 { padding-top: 80px; width: 340px; }
.social .fourth .boxWrap .box p { margin: 0; padding-top: 80px; width: calc(100% - 340px - 10px); }
/* fifth */
.social .fifth .outline { max-width: calc(1400px - 20px); }
.social .fifth h5 { padding: 20px; margin-bottom: 30px; text-align: center; color: #fff; border-radius: 14px; }
.social .fifth h5 br { display: none; }
.social .fifth h5.yellow { background-color: var(--logoClr); }
.social .fifth h5.blue { background-color: var(--blueClr); }
.social .fifth .boxWrap { display: flex; flex-flow: row wrap; gap: 30px 0; }
.social .fifth .boxWrap + h5 { margin-top: 100px; }
.social .fifth .boxWrap .box { padding: 0 20px; width: 25%; }
.social .fifth .boxWrap.n3 .box { width: 33.3333%; }
.social .fifth .boxWrap .box span { position: relative; display: block; padding-bottom: 15px; margin-bottom: 25px; color: var(--blueClr); font-family: 'PretendardJP-SemiBold'; font-weight: 600; }
.social .fifth .boxWrap .box span::before { position: absolute; content: ""; left: 0; bottom: 0; width: 100%; height: 1px; background-color: #ccc; }
.social .fifth .boxWrap .box span::after { position: absolute; content: ""; left: 0; bottom: 0; transform: translateY(50%); width: 10px; height: 10px; border-radius: 50%; background-color: var(--blueClr); }
.social .fifth .boxWrap .box figure { margin-bottom: 14px; height: 57px; }
.social .fifth .boxWrap .box figure img { width: auto; height: 100%; }
.social .fifth .boxWrap .box h5 { padding: 0; margin-bottom: 6px; font-size: clamp(18px, 2.14vw, 30px); color: #222; font-family: 'PretendardJP-ExtraBold'; font-weight: 800; text-align: left; }
.social .fifth .boxWrap .box em { display: inline-block; padding-left: 4px; font-size: clamp(15px, 1.43vw, 20px); font-style: normal; color: #8a8a8a; }
.social .fifth .boxWrap.n3 .box span { color: var(--logoClr); }
.social .fifth .boxWrap.n3 .box span::after { background-color: var(--logoClr); }
.social .fifth.process .boxWrap .fadeUp { transform: translateY(0px) !important; opacity: 0; transition: var(--opacity01); }
.social .fifth.process .boxWrap .fadeUp:nth-child(1) { transition-delay: .2s !important; }
.social .fifth.process .boxWrap .fadeUp:nth-child(2) { transition-delay: .4s !important; }
.social .fifth.process .boxWrap .fadeUp:nth-child(3) { transition-delay: .6s !important; }
.social .fifth.process .boxWrap .fadeUp:nth-child(4) { transition-delay: .8s !important; }
.social .fifth.process .boxWrap .fadeUp.active { opacity: 1; }
/* .social .fifth.process { transform: scale(0.8); transform-origin: center; } */
@media all and (max-width: 599px){
    .social .fifth.process .boxWrap .fadeUp:nth-child(1) { transition-delay: 0s !important; }
    .social .fifth.process .boxWrap .fadeUp:nth-child(2) { transition-delay: 0s !important; }
    .social .fifth.process .boxWrap .fadeUp:nth-child(3) { transition-delay: 0s !important; }
    .social .fifth.process .boxWrap .fadeUp:nth-child(4) { transition-delay: 0s !important; }
}
/* sixth */
.social .sixth { background: url(../img/subPage/social_bg_03.jpg) no-repeat center; background-size: cover; }
.social .sixth .outline .inBx { padding: 65px 50px; background-color: rgba(255, 255, 255, 0.9); border-radius: 20px; }
.social .sixth .outline .inBx h4 { margin-bottom: 25px; color: var(--logoClr); }
.social .sixth .outline .inBx h6 { margin-bottom: 35px; }
.social .sixth .outline .inBx p { margin: 0; padding: 0; }
/* last */
.social .last .outline { padding-bottom: 5rem; }
.social .last p { padding: 0; }
.social .last .circleBx { margin-bottom: 65px; }
.social .last .circleBx p { margin-bottom: 0; }
@media all and (max-width: 1400px){
    .social .second { padding: 0 4.29vw; }
    .social .third { padding: 0 4.29vw; }
    .social .third .boxWrap .box ul li { min-height: 174px; }
    .social .fourth { padding: 0 4.29vw; }
    .social .fifth { padding: 0 4.29vw; }
    .social .sixth { padding: 0 4.29vw; }
    .social .last { padding: 0 4.29vw; }
}
@media all and (max-width: 1200px){
    .circleBx { gap: 30px; }
    .circleBx li { padding: 30px; width: calc(33.3333% - 60px / 3); }
    .social .second .boxWrap { margin-bottom: 13.021vh; }
    .social .second .graphWrap { padding-left: 27.34vw; }
}
@media all and (max-width: 1024px){
    .scrollWrap + h3 { margin-top: 100px; }
}
@media all and (max-width: 800px){
    .circleBx li { width: 100%; }
    .scrollWrap { padding: 36px 20px; height: 400px; }
    .social .second { padding: 0 7.5vw; }
    .social .third { padding: 0 7.5vw; background-image: url(../img/subPage/social_bg_02m.jpg) }
    .social .fourth { padding: 0 7.5vw; }
    .social .fifth { padding: 0 7.5vw; }
    .social .sixth { padding: 0 7.5vw; background-image: url(../img/subPage/social_bg_03m.jpg); }
    .social .last { padding: 0 7.5vw; }
    .social .second .graphWrap { padding-left: 0; }
    .social .second .graphWrap .infoWrap { position: relative; top: auto; left: auto; margin-bottom: 30px; }
    .social .second .graphWrap .infoWrap h4 { position: relative; left: auto; top: auto; margin-bottom: 5px; text-align: center; }
    .social .second .graphWrap .infoWrap ul li span { width: 18px; height: 18px; }
    .social .second .graphWrap .infoWrap ul li:nth-child(1) span { width: 18px; height: 18px; }
    .social .third .boxWrap { gap: 8.75vh; }
    .social .third .boxWrap .box { width: 100%; }
    .social .third .boxWrap .box h4 { margin-bottom: 20px; }
    .social .third .boxWrap .box ul li { padding: 25px; min-height: auto; }
    .social .fourth .boxWrap .box { padding: 34px 20px; }
    .social .fourth .boxWrap .box h5 { padding-top: 80px; width: 100%; }
    .social .fourth .boxWrap .box p { padding-top: 0; width: 100%; }
    .social .fifth .boxWrap .box { padding: 0 15px; width: 50%; }
}
@media all and (max-width: 768px){
    .scrollWrap + h3 { margin-top: 60px; }
}
@media all and (max-width: 599px){
    .scrollWrap { padding: 35px 14px; }
    .social .fifth h5 br { display: inline; }
    .social .fifth .boxWrap .box { padding: 0 20px; width: 100%; }
    .social .fifth .boxWrap.n3 .box { width: 100%; }
    .social .fifth .boxWrap .box span::before { left: -10px; bottom: auto; top: 7px; width: 1px; height: 180px; }
    .social .fifth .boxWrap .box span::after { left: -15px; bottom: auto; top: 3px; transform: translateY(0); }
    .social .sixth .outline .inBx { padding: 30px 20px; }
}
/* governance (지배구조) */
.governance .second p { padding: 0; }
.governance .third { background: url(../img/subPage/governance_bg_02.jpg) no-repeat center; background-size: cover; }
.governance .third .inBx { padding: 65px 50px; background-color: rgba(255, 255, 255, 0.95); border-radius: 20px; }
.governance .third .inBx + .inBx { margin-top: 30px; }
.governance .third .inBx h4 { margin-bottom: 25px; color: var(--logoClr); }
.governance .third .inBx h6 { margin-bottom: 35px; }
.governance .third .inBx p { margin: 0; padding: 0; }
.governance .fourth h4 { text-align: center; }
.governance .fourth p { padding: 0; text-align: center; }
.governance .fourth .boxWrap { position: relative; display: flex; flex-flow: row wrap; justify-content: space-between; gap: 40px; }
.governance .fourth .boxWrap .box { display: flex; flex-flow: column; padding: 70px 20px 46px; width: calc(25% - 120px / 4); background-color: #fff; box-shadow: 22px 22px 54px rgba(173, 173, 173, .6); border-radius: 15px; }
.governance .fourth .boxWrap .box h6 { margin-bottom: 10px; text-align: center; }
.governance .fourth .boxWrap .box div { margin-bottom: 5px; text-align: center; font-family: 'PretendardJP-Bold'; font-weight: 700; letter-spacing: -3px; }
.governance .fourth .boxWrap .box div strong { display: inline-block; margin-right: 5px; font-size: clamp(40px, 5vw, 70px); color: var(--logoClr); }
.governance .fourth .boxWrap .box span { display: inline-block; margin: 0 auto; font-size: clamp(16px, 1.3vw, 20px); text-align: center; font-family: 'PretendardJP-Bold'; font-weight: 700; width: 140px; line-height: 55px; background-color: #f1f1f1; border-radius: 30px; }
.governance .last { background: url(../img/subPage/governance_bg_03.jpg) no-repeat center; background-size: cover; }
.governance .last .inBx { padding: 65px 50px; background-color: rgba(255, 255, 255, 0.9); border-radius: 20px; }
.governance .last .inBx h4 { margin-bottom: 25px; }
.governance .last .inBx h6 { margin-bottom: 35px; color: var(--logoClr); }
.governance .last .inBx p { margin: 0; padding: 0; }
@media all and (max-width: 1400px){
    .governance .second,
    .governance .third,
    .governance .fourth,
    .governance .last { padding: 0 4.29vw; }
}
@media all and (max-width: 1024px){
    .governance .fourth .boxWrap { justify-content: center; }
    .governance .fourth .boxWrap .box { padding: 60px 20px 35px; width: 100%; max-width: 300px; }
    .governance .fourth .boxWrap .box span { line-height: 45px; }
}
@media all and (max-width: 800px){
    .governance .second,
    .governance .third,
    .governance .fourth,
    .governance .last { padding: 0 7.5vw; }
    .governance .third { background-image: url(../img/subPage/governance_bg_02m.jpg); }
    .governance .last { background-image: url(../img/subPage/governance_bg_03m.jpg); }
}
@media all and (max-width: 599px){
    .governance .third .inBx { padding: 30px 20px; }
    .governance .last .inBx  { padding: 30px 20px; }
}