@charset "utf-8";
/* ---------------------- */

/* ----- SCROLL SUB ----- */

/* ---------------------- */

/* ----- common ----- */

.txt-underline {
    position: relative;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.txt-underline:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 1px;
    background: #22b1ac;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.txt-underline:hover {
    color: #22b1ac;
}

.txt-underline:hover:after {
    width: 100%;
}

.has-scroll-smooth.mobile body {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.c-scrollbar {
    z-index: 5000;
    width: 8px;
}

.c-scrollbar_thumb {
    width: 5px;
    background-color: rgba(0, 0, 0, 0.7);
}

/* ----- vision ----- */

.vision .scroll-wrap {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100vh;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

.vision .scroll-wrap .scroll-down p {
    color: #fff;
}

.vision .scroll-wrap .scroll-down i {
    border-color: rgba(255, 255, 255, 0.5);
}

.vision .scroll-wrap .scroll-down i:before {
    background-color: rgba(255, 255, 255, 1);
}

.vision .scroll-wrap .scroll-down i:after {
    background-color: rgba(255, 255, 255, 1);
}

.vision .scroll-wrap .scroll-down:hover i {
    background-color: rgba(255, 255, 255, 0.5);
}

.vision .vision-tit .maxinner {
    overflow: hidden;
    position: relative;
    height: 100vh;
    text-align: center;
}

.vision .vision-tit h2 {
    opacity: 0;
    position: absolute;
    left: 5%;
    bottom: 50%;
    width: 90%;
    -webkit-transform: translateY(50%);
    -moz-transform: translateY(50%);
    -ms-transform: translateY(50%);
    -o-transform: translateY(50%);
    transform: translateY(50%);
}

.vision .vision-tit h2 span {
    opacity: 0;
    display: inline-block;
    position: relative;
    top: 30px;
    min-width: 0.3em;
    font-size: 6rem;
    color: #000;
    font-weight: 800;
    vertical-align: middle;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.vision .vision-pin {
    overflow: hidden;
}

.vision .vision-pin .pin-inner {
    position: relative;
    height: 100vh;
}

.vision .vision-pin .pin-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(/images/sub/about/vision2.jpg) no-repeat center;
    background-size: cover;
}

.vision .vision-pin .pin-tit {
    position: absolute;
    left: 5%;
    top: 50%;
    width: 90%;
    font-size: 5rem;
    font-weight: 700;
    text-align: center;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.vision .vision-pin .pin-tit span {
    display: block;
    padding-top: 100px;
    font-size: 2rem;
    color: #fff;
    line-height: 1em;
    letter-spacing: -0.013em;
    font-weight: 700;
}

.vision .vision-pin .pin-tit h3 {
    display: block;
    margin-top: 0.675em;
    font-size: 4rem;
    color: #fff;
    line-height: 1.5em;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.vision .vision-pin .pin-tit p {
    margin-top: 2.750em;
    font-size: 2rem;
    color: #fff;
    line-height: 1.8em;
    letter-spacing: -0.025em;
    font-weight: 400;
}

.vision .vision-pin .pin-tit-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    opacity: 1 !important;
}

.vision .vision-fix {
    overflow: hidden;
    position: relative;
    padding: 150px 0 50px;
}

.vision .vision-fix .fix-bg-wrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.vision .vision-fix .fix-bg-wrap .fix-bg>div {
    overflow: hidden;
    background: #fff;
}

.vision .vision-fix .fix-bg-wrap .fix-bg>div>div {
    position: relative;
    height: 100vh;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/*.vision .vision-fix .fix-bg-wrap .fix-bg > div { overflow:hidden; background:#fff;}*/

.vision .vision-fix .fix-tit {
    /*display:flex; justify-content:center; align-items:center;position:absolute; left:0; top:0; z-index:10; width:100%; height:100%;*/
    text-align: center;
}

.vision .vision-fix .fix-tit h3 {
    display: block;
    margin-top: 0.675em;
    font-size: 4rem;
    line-height: 1.5em;
    font-weight: 700;
}

.vision .vision-fix .fix-tit h3:after {
    content: "";
    display: block;
    margin: 1em auto;
    width: 3px;
    height: 50px;
    background: #33ba05;
}

.vision .vision-fix .fix-tit p {
    margin-top: 1em;
    font-size: 2rem;
    color: #666;
    line-height: 1.8em;
    letter-spacing: -0.025em;
    font-weight: 400;
}

.vision .vision-fix .ani-underline:after {
    background: rgb(51 186 5 / 18%);
}
.vision .vision-fix .elementor-section .elementor-container {display: flex;flex-wrap: wrap;margin-right: auto;margin-left: auto;position: relative;}
.vision .vision-fix .elementor-section .elementor-widget-container {font-size: 36px;}
.vision .vision-fix .elementor-section .elementor-heading-title {font-size: 26px;}
.elementor-widget:not(:last-child) {margin-bottom: 20px;}
.vision .vision-fix .elementor-col-20 {width: 50%;font-size: 28px;margin-bottom: 50px;}
.vision .vision-fix .elementor-col-20:nth-child(1), .vision .vision-fix .elementor-col-20:nth-child(2), .vision .vision-fix .elementor-col-20:nth-child(3) {width: 33.3%;}
@media (max-width: 767px) {
  .vision .vision-fix .elementor-section .elementor-widget-container {font-size: 26px;}
  .vision .vision-fix .elementor-section .elementor-heading-title {font-size: 16px;}
  .vision .vision-fix .elementor-col-20 {width: 100%;font-size: 28px;margin-bottom: 30px;}
  .vision .vision-fix .elementor-col-20:nth-child(1), .vision .vision-fix .elementor-col-20:nth-child(2), .vision .vision-fix .elementor-col-20:nth-child(3) {width: 100%;}
}
.vision .vision-fix .core-value-title {text-align: center;margin-bottom: 50px;}
.vision .vision-fix .core-value-item {text-align: center;margin-bottom: 40px;}
.vision .vision-fix .core-value-icon {width: 60px;height: 60px;margin-bottom: 15px;}
.vision .vision-fix .core-value-item h5 {color: #0066ff;font-weight: bold;}
.vision .vision-fix .core-value-item p span {color: #0066ff;font-weight: 500;}

/* ----- history ----- */

#header.sticky {
    top: -100px;
}

.history .progressbtn {
    display: none;
}

.history .history-visual {
    position: relative;
    height: 100vh;
    background: url(/images/sub/about/history-visual.jpg) no-repeat center;
    background-size: cover;
}

.history .history-visual .intro {
    /* display:flex; */
    /* justify-content:center; */
    /* align-items:center; */
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}

.history .history-visual .intro .open-txt {
    opacity: 0;
    position: relative;
    top: 50%;
    z-index: 100;
    will-change: transform, opacity;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.history .history-visual .intro .his-intro-txt {
    display: flex;
    justify-content: center;
    align-items: center;
}

.history .history-visual .intro .his-intro-txt .year {
    overflow: hidden;
    display: flex;
    justify-content: center;
    height: 1em;
    position: relative;
    z-index: 100;
    font-size: 6rem;
    color: #fff;
    line-height: 1;
    font-weight: 800;
    vertical-align: middle;
    -webkit-transition: opacity 1.2s, transform 1.2s cubic-bezier(.23, 1, .32, 1);
    -moz-transition: opacity 1.2s, transform 1.2s cubic-bezier(.23, 1, .32, 1);
    -ms-transition: opacity 1.2s, transform 1.2s cubic-bezier(.23, 1, .32, 1);
    -o-transition: opacity 1.2s, transform 1.2s cubic-bezier(.23, 1, .32, 1);
    transition: opacity 1.2s, transform 1.2s cubic-bezier(.23, 1, .32, 1);
}

.history .history-visual .intro .his-intro-txt .year span {
    display: inline-block;
    vertical-align: middle;
    transform: inherit;
}

.history .history-visual .intro .his-intro-txt .txt {
    display: inline-block;
    position: relative;
    z-index: 100;
    font-size: 6rem;
    color: #fff;
    font-weight: 800;
    vertical-align: middle;
}

.history .history-visual .intro .open-window {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.history .history-visual .intro .open-window:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    height: 100%;
    background: #101010;
}

.history .history-visual .intro .open-window:before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 100%;
    background: #101010;
}

.history .history-visual.init-animation .intro .open-window:after,
.history .history-visual.init-animation .intro .open-window:before {
    width: 0;
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -ms-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}

.history .history-visual .txtbox {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.history .history-visual .txtbox .maxinner {
    position: relative;
    top: 50%;
    height: 100%;
    text-align: center;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.history .history-visual .txtbox h2 {
    opacity: 0;
    position: relative;
    top: 50%;
    margin-top: -9rem;
    font-size: 4rem;
    color: #fff;
    font-weight: 800;
    letter-spacing: -0.006em;
    line-height: 1.5em;
}

.history .history-visual .txtbox p {
    opacity: 0;
    position: relative;
    top: 50%;
    margin-top: 3rem;
    font-size: 2rem;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.8em;
    font-weight: 300;
    letter-spacing: -0.025em;
}

.history .history-list {
    position: relative;
}

.history .history-list .list {
    overflow: hidden;
}

.history .history-list .list .tit {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    padding-top: 13em;
    text-align: center;
}

.history .history-list .list .tit .txt h2 {
    margin-bottom: 0.214em;
    font-size: 7rem;
    color: #101010;
    font-weight: 800;
    letter-spacing: -0.004em;
}

.history .history-list .list .tit .txt p {
    font-size: 4rem;
    color: #101010;
    font-weight: 800;
    letter-spacing: -0.006em;
}

.history .history-list .list .tit .bg {
    overflow: hidden;
    position: relative;
    margin: 9em auto 0;
    width: 100%;
    height: 55em;
    text-align: center;
}

.history .history-list .list .tit .bg .img {
    position: absolute;
    left: 50%;
    top: 0;
    min-width: 1460px;
    width: 70%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.history .history-list .list .tit .bg p {
    position: absolute;
    left: 5%;
    top: 0;
    width: 90%;
    height: 100%;
    z-index: 1;
    font-size: 3rem;
    color: #ffffff;
    font-weight: 600;
    line-height: 1.6em;
    letter-spacing: -0.008em;
}

.history .history-list .list .tit .bg p>span {
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.history .history-list .list .cont .pin .maxinner {
    display: flex;
    height: 100vh;
}

.history .history-list .list .cont .pin .imgwrap {
    position: relative;
    width: 50%;
}

.history .history-list .list .cont .pin .imgwrap .img-item {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.history .history-list .list .cont .pin .imgwrap .img-item>div {
    position: relative;
    padding-bottom: 55.755%;
    max-width: 729px;
    width: 100%;
    height: 0;
}

.history .history-list .list .cont .pin .imgwrap .img-item>div>.img-cover {
    display: none !important;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    will-change: transform, opacity;
}

.history .history-list .list .cont .pin .imgwrap .img-item>div>.cover-first {
    display: none;
}

.history .history-list .list .cont .pin .imgwrap .img-item>div>img {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    will-change: transform, opacity;
}

.history .history-list .list .cont .pin .imgwrap .img-item .list-year {
    opacity: 0;
    position: absolute;
    left: 40px;
    top: -0.5em;
    z-index: 0;
    font-size: 6rem;
    color: #33ba05;
    letter-spacing: -0.004em;
    font-weight: 800;
    line-height: 1;
    will-change: transform, opacity;
}

.history .history-list .list .cont .pin .imgwrap .img-item:first-child>div>img {
    display: block !important;
}

.history .history-list .list .cont .pin .txtwrap {
    position: relative;
    width: 50%;
}

.history .history-list .list .cont .pin .txtwrap .txt-item {
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 100%;
    text-align: left;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
}

.history .history-list .list .cont .pin .txtwrap .txt-item .txt-con {
    position: absolute;
    left: 15%;
    top: 50%;
    width: 85%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.history .history-list .list .cont .pin .txtwrap .txt-item .txt-con .txt-year {
    margin-bottom: 1.167em;
    font-size: 3rem;
    color: #333;
    font-weight: 800;
    letter-spacing: -0.008em;
    line-height: 1.3;
}

.history .history-list .list .cont .pin .txtwrap .txt-item .txt-con .txt-desc {
    font-size: 1.6rem;
    color: #666;
    line-height: 1.875em;
    font-weight: 300;
    letter-spacing: -0.016em;
}

.history .history-list .list .cont .pin .txtwrap .txt-item.first-start {
    left: auto;
    right: 0;
    width: 200%;
    text-align: center;
}

.history .history-list .list .cont .pin .txtwrap .txt-item.first-start .txt-con {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    left: 0;
    width: 100%;
    height: 60%;
    background: #fff;
}

.history .history-list .list .cont .pin .txtwrap .txt-item.first-start .txt-con .txt-year {
    font-size: 4rem;
}

.history .history-list .list .cont .pin .txtwrap .txt-item.first-start .txt-con .txt-desc {
    font-size: 1.9rem;
    margin-top: 2.4em
}

.history .history-list .list .cont .pin .txtwrap .txt-item.first-start .txt-con .txt-year-bold {
    position: absolute;
    left: 40px;
    top: 5%;
    font-size: 6rem;
    color: #33ba05;
    letter-spacing: -0.004em;
    font-weight: 800;
    line-height: 1;
}

.history .history-list .list .cont .pin .txtwrap .txt-item.first-start img {
    margin: 0 auto;
    display: block;
}

/*
.history .history-list .list .cont .pin .txtwrap .txt-item.first-start .txt-con .txt-year-bold:after { content:""; position:absolute; right:0; bottom:0; z-index:-1; width:calc(100% + 40px); height:50%; background:#ececec;}
*/

.history .progressbar {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

.history .progressbar .inner {
    position: relative;
    padding: 2em 0 1em;
    background: #fff;
}

.history .progressbar .progresscon>ul {
    display: flex;
    position: relative;
    margin: 0 auto;
    max-width: 1460px;
    width: 90%;
    text-align: left;
}

.history .progressbar .progresscon>ul li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    width: 25%;
    height: 70px;
    cursor: pointer;
}

.history .progressbar .progresscon>ul li:before {
    content: "";
    position: absolute;
    left: 0;
    top: -4.5px;
    z-index: 10;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #dddddd;
}

.history .progressbar .progresscon>ul li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 1px;
    background: #f1f1f1;
}

.history .progressbar .progresscon>ul li span {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 0;
    height: 1px;
    background: #33ba05;
}

.history .progressbar .progresscon>ul li strong {
    display: block;
    margin-top: 1.111em;
    font-size: 1.8rem;
    color: #111111;
    letter-spacing: -0.014em;
    font-weight: 500;
    line-height: 1.667em;
}

.history .progressbar .progresscon>ul li p {
    margin-top: 0.214em;
    font-size: 1.4rem;
    color: #666666;
}

.history .progressbar .progresscon>ul li.on:before {
    top: -7.5px;
    width: 15px;
    height: 15px;
    background: #33ba05;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.history .progressbar .progresscon>ul li.active:before {
    top: -7.5px;
    width: 15px;
    height: 15px;
    background: #33ba05;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.history .progressbar .progresscon>ul li.on strong {
    font-size: 2.4rem;
    color: #33ba05;
    letter-spacing: -0.01em;
    line-height: 1.25em;
    font-weight: 800;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.history .progressbar .progresscon>ul li.on p {
    font-size: 1.6rem;
    color: #33ba05;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.history .progressbar .progresscon>ul li:last-child {
    position: absolute;
    left: 100%;
    top: 0;
}

.history .progressbar .progresscon>ul li:last-child span {
    display: none !important;
}

.history .progressbar .progresscon>ul li:last-child:after {
    display: none !important;
}

.history .progressbar .progresscon>.listall {
    position: absolute;
    left: 20px;
    top: 15px;
}

.history .progressbar .progresscon>.listall a {
    font-size: 1.6rem;
    color: #666666;
    letter-spacing: -0.018em;
    font-weight: 300;
}

.history .progressbar .progresscon>.listall img {
    display: inline-block;
    margin-right: 8px;
    vertical-align: middle;
}

.history-topbtn {
    opacity: 0;
    visibility: hidden;
    position: fixed;
    right: 0;
    bottom: 0;
    z-index: 1000;
    height: 6em;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.history-topbtn button {
    width: 6em;
    height: 6em;
    background: #33ba05;
}

.history-topbtn button:after {
    content: "\e915";
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -0.5em;
    margin-left: -0.5em;
    font-size: 2.5rem;
    color: #fff;
    font-family: 'xeicon', sans-serif;
}

.history-topbtn.on {
    opacity: 1;
    visibility: visible;
}

/* ----- history - all ----- */

.history-all {
    padding: 11em 0;
}

.history-all-btn-wrap>a {
    margin-bottom: 1.5em;
    font-size: 1.6rem;
    color: #666666;
    letter-spacing: -0.018em;
    font-weight: 300;
}

.history-all-btn-wrap>a span {
    display: inline-block;
    margin-left: 0.714em;
    vertical-align: middle;
}

.history-all-btn-wrap .history-all-btn {
    display: flex;
    flex-wrap: wrap;
    border-left: 1px solid #ddd;
    border-top: 1px solid #ddd;
}

.history-all-btn-wrap .history-all-btn li {
    width: 8.3333%;
}

.history-all-btn-wrap .history-all-btn li a {
    display: block;
    position: relative;
    border: 1px solid #dcdcdc;
    border-left: none;
    border-top: none;
    font-size: 1.8rem;
    color: #666666;
    letter-spacing: -0.014em;
    font-weight: 300;
    text-align: center;
    line-height: 2.389em;
}

.history-all-btn-wrap .history-all-btn li a:after {
    content: "";
    display: none;
    position: absolute;
    left: -1px;
    right: -1px;
    top: -1px;
    bottom: -1px;
}

.history-all-btn-wrap .history-all-btn li.on a,
.history-all-btn-wrap .history-all-btn li a:hover {
    color: #333;
    font-weight: 500;
}

.history-all-btn-wrap .history-all-btn li.on a:after,
.history-all-btn-wrap .history-all-btn li a:hover:after {
    display: block;
    border: 1px solid #333;
}

.history-all-list .list {
    padding-top: 12em;
}

.history-all-list .list .tit {
    padding-bottom: 0.667em;
    border-bottom: 2px solid #313131;
    font-size: 3rem;
    color: #333333;
    letter-spacing: -0.008em;
    font-weight: 700;
}

.history-all-list .list .item {
    display: flex;
    margin-top: 5em;
}

.history-all-list .list .item .img {
    width: 20%;
}

.history-all-list .list .item .img>div {
    position: relative;
    padding-bottom: 61.987%;
    width: 100%;
    height: 0;
}

.history-all-list .list .item .img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.history-all-list .list .item .txt {
    padding-left: 8em;
    width: 80%;
}

.history-all-list .list .item .txt .item-tit {
    margin-top: 1em;
    margin-bottom: 0.75em;
    font-size: 2rem;
    color: #333333;
    letter-spacing: -0.013em;
    font-weight: 600;
}

.history-all-list .list .item .txt .item-desc {
    font-size: 1.6rem;
    color: #666666;
    letter-spacing: -0.016em;
    line-height: 1.75em;
}

/* ---------------------- */

/* ----- COMMON SUB ----- */

/* ---------------------- */

/* ----- common animation ----- */

.con-ani {
    opacity: 0;
    -webkit-transition-property: opacity, transform;
    -moz-transition-property: opacity, transform;
    -ms-transition-property: opacity, transform;
    -o-transition-property: opacity, transform;
    transition-property: opacity, transform;
    -webkit-transition-timing-function: ease;
    -moz-transition-timing-function: ease;
    -ms-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-duration: 1.2s;
    -moz-transition-duration: 1.2s;
    -ms-transition-duration: 1.2s;
    -o-transition-duration: 1.2s;
    transition-duration: 1.2s;
    -webkit-transition-delay: 0.1s;
    -moz-transition-delay: 0.1s;
    -ms-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.con-ani.on {
    opacity: 1;
    -webkit-transform: translateZ(0) !important;
    -moz-transform: translateZ(0) !important;
    -ms-transform: translateZ(0) !important;
    -o-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
}

.con-ani.fade-up {
    -webkit-transform: translate3d(0, 100px, 0);
    -moz-transform: translate3d(0, 100px, 0);
    -ms-transform: translate3d(0, 100px, 0);
    -o-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
}

.con-ani.fade-left {
    -webkit-transform: translate3d(100px, 0, 0);
    -moz-transform: translate3d(100px, 0, 0);
    -ms-transform: translate3d(100px, 0, 0);
    -o-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
}

.con-ani.fade-right {
    -webkit-transform: translate3d(-100px, 0, 0);
    -moz-transform: translate3d(-100px, 0, 0);
    -ms-transform: translate3d(-100px, 0, 0);
    -o-transform: translate3d(-100px, 0, 0);
    transform: translate3d(-100px, 0, 0);
}

/* ----- modal popup ----- */

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

.pop-wrap.open {
    display: block;
}

.pop-wrap .pop-conwrap {
    overflow: hidden;
    position: absolute;
    left: 50%;
    top: 50%;
    padding: 7em 6em;
    max-width: 76em;
    max-height: 90vh;
    background: #fff;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-behavior: smooth;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    box-shadow: 1px 1px 10px rgba(60, 60, 60, 0.5);
}

.pop-wrap .pop-conwrap .pop-con {
    height: 100%;
    max-height: 70vh;
    overflow-y: auto;
}

.pop-wrap .pop-conwrap::-webkit-scrollbar {
    display: none;
}

.pop-wrap .pop-conwrap video {
    width: 100%;
}

.pop-wrap .pop-conwrap .btn-popup-close {
    position: absolute;
    right: 25px;
    top: 25px;
    min-width: auto !important;
    width: 28px;
    height: 28px;
    background: none;
    border: 1px solid #333;
}

.pop-wrap .pop-conwrap .btn-popup-close:after {
    content: "\e9af";
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 2.3rem;
    color: #333;
    font-family: 'xeicon', sans-serif;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.pop-wrap .pop-tit {
    padding: 0.893em 0;
    font-size: 2.8rem;
    color: #333333;
    letter-spacing: -0.009em;
    line-height: 1.429em;
    font-weight: 600;
}

.pop-wrap .pop-sub-txt {
    padding: 10px;
    font-size: 1.4em;
    text-align: right;
}

/* ----- table setting ----- */

.td-title {
    font-family: 'Noto Sans KR', sans-serif;
}

.tbcenter table th,
.tbcenter table td {
    text-align: center;
}

.ta-l {
    text-align: left !important;
}

.ta-c {
    text-align: center !important;
}

.ta-r {
    text-align: right !important;
}

.tbstyle01 {}

.tbstyle01 strong {
    font-size: 2rem;
}

.tbstyle01 table {
    border-top: 2px solid #22b1ac;
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}

.tbstyle01 table th {
    padding: 1.111em 0;
    border-bottom: 1px solid #e6e6e6;
    border-left: 1px solid #e6e6e6;
    font-size: 1.8rem;
    color: #333;
    font-weight: 500;
    letter-spacing: -0.014em;
}

.tbstyle01 table td {
    padding: 1.25em 1.875em;
    border-bottom: 1px solid #e6e6e6;
    border-left: 1px solid #e6e6e6;
    font-size: 1.6rem;
    color: #333;
    font-weight: 300;
    letter-spacing: -0.031em;
    vertical-align: top;
}

.tbstyle01 table thead th:first-child {
    border-left: none !important;
}

.tbstyle01 table tbody td:first-child {
    border-left: none !important;
}

.tbstyle02 {}

.tbstyle02 strong {
    font-size: 2rem;
}

.tbstyle02 table {
    border-top: 2px solid #000000;
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}

.tbstyle02 table thead th {
    padding: 1.375em 0;
    border-bottom: 1px solid #e6e6e6;
    border-left: 1px solid #e6e6e6;
    background: #fafafa;
    font-size: 1.6rem;
    color: #000000;
    font-weight: 400;
    letter-spacing: -0.016em;
}

.tbstyle02 table td {
    padding: 1.133em 0.3em;
    border-bottom: 1px solid #e6e6e6;
    border-left: 1px solid #e6e6e6;
    font-size: 1.5rem;
    color: #666;
    line-height: 2em;
    font-weight: 300;
    letter-spacing: -0.017em;
}

.tbstyle02 table tfoot td {
    font-size: 1.5rem;
    color: #000;
    font-weight: 400;
}

.tbstyle02 table thead th:first-child {
    border-left: none !important;
}

.tbstyle02 table tbody td:first-child {
    border-left: none !important;
}

.tbstyle02 table tfoot td:first-child {
    border-left: none !important;
}

.tbstyle02>p {
    margin-top: 1.429em;
    font-size: 1.4rem;
    color: #666;
    line-height: 1.714em;
    letter-spacing: -0.018em;
    font-weight: 300;
    text-align: left;
}

.tbstyle02 table tbody td.bd-l {
    border-left: 1px solid #e6e6e6 !important;
}

.tbstyle03 {}

.tbstyle03 strong {
    font-size: 2rem;
}

.tbstyle03 table {
    border-top: 2px solid #000000;
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}

.tbstyle03 table thead th {
    padding: 1.375em 0;
    border-bottom: 1px solid #e6e6e6;
    font-size: 1.6rem;
    color: #000000;
    font-weight: 400;
    letter-spacing: -0.016em;
}

.tbstyle03 table td {
    padding: 1em 1.667em;
    border-bottom: 1px solid #e6e6e6;
    font-size: 1.8rem;
    color: #333333;
    line-height: 1.667em;
    letter-spacing: -0.014em;
}

.tbstyle03 table td span {
    font-size: 1.6rem;
    color: #666;
    font-weight: 300;
}

.tbstyle03 table thead th:first-child {
    border-left: none !important;
}

.tbstyle03 table tbody td:first-child {
    border-left: none !important;
}

.tbstyle04 {}

.tbstyle04 table {
    border-top: 2px solid #000000;
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}

.tbstyle04 table th {
    padding: 0.5em 1.25em;
    border-bottom: 1px solid #e6e6e6;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.5em;
    letter-spacing: -0.014em;
    font-weight: 300;
    text-align: left;
}

.tbstyle04 table td {
    padding: 0.5em 1.25em;
    border-left: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.5em;
    letter-spacing: -0.014em;
    font-weight: 300;
    text-align: left;
}

.tbstyle04 table td span {
    font-size: 1.6rem;
    color: #666;
    font-weight: 300;
}

.tbstyle04 table thead th:first-child {
    border-left: none !important;
}

.tbstyle04 table tbody td:first-child {
    border-left: none !important;
}

.tbstyle04 p {
    margin-top: 1em;
    font-size: 1.4rem;
    color: #999999;
    letter-spacing: -0.25px;
    font-weight: 300;
}

.tab-nav-con:not(.con-ani) dl:nth-child(4) .tbstyle02 table tbody tr:nth-child(1) td:nth-child(3),
.tab-nav-con:not(.con-ani) dl:nth-child(4) .tbstyle02 table tbody tr:nth-child(2) td,
.tab-nav-con:not(.con-ani) dl:nth-child(4) .tbstyle02 table tbody tr:nth-child(3) td,
.tab-nav-con:not(.con-ani) dl:nth-child(5) .tbstyle02 table tbody tr:not(:nth-child(1)):not(:nth-child(7)):not(:nth-child(9)) td:first-child,
.tab-nav-con:not(.con-ani) dl:nth-child(6) .tbstyle02 table tbody tr:not(:nth-child(1)):not(:nth-child(2)) td:first-child,
.tab-nav-con:not(.con-ani) dl:nth-child(7) .tbstyle02 table tbody tr:nth-child(2) td:first-child {
    border-left: 1px solid #e6e6e6 !important
}

/* ----- list setting ----- */

.list-st01 {
    margin-top: 2em;
}

.list-st01 li {
    position: relative;
    padding-left: 1.429em;
    margin: 0.357em 0;
    font-size: 1.4rem;
    color: #666;
    line-height: 1.714em;
    letter-spacing: -0.018em;
    font-weight: 300;
    text-align: left;
}

.list-st01 li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    width: 10px;
    height: 1px;
    background: #666;
}

.list-st02 li {
    position: relative;
    padding-left: 0.667em;
    margin-left: 0.667em;
    font-size: 1.5rem;
    color: #666;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
}

.list-st02 li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 13px;
    width: 2px;
    height: 2px;
    background: #adadad;
}

.list-st02 li>ul>li {
    margin-left: 0;
}

.list-st02 li>ul>li:after {
    width: 5px;
    height: 1px;
}

.list-st03 li {
    position: relative;
    padding-left: 0.833em;
    margin: 0.833em 0;
    font-size: 1.8rem;
    color: #333;
    font-weight: 300;
    letter-spacing: -0.014em;
    text-align: left;
}

.list-st03 li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #dddddd;
}

/* ----- btn setting ----- */

.btn-view-product {
    padding-right: 20px;
    background: url(/images/ico/ico-search-sm.png) no-repeat right 5px;
}

.btn-view-product span {
    display: inline-block;
    position: relative;
    padding-bottom: 7px;
    font-size: 1.8rem;
    color: #111111;
    letter-spacing: -0.5px;
    vertical-align: middle;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.btn-view-product span:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #111;
    transition: all ease .3s;
}

.btn-view-product i {
    display: inline-block;
    margin-left: 0.5em;
    margin-top: -0.1em;
    font-size: 2rem;
    color: #000;
    vertical-align: middle;
}

.btn-view-product:hover span:after {
    width: 0;
}

.btn-download {
    position: relative;
    padding: 0.938em 4.375em 0.938em 1.563em;
    border: 1px solid #1b1b1b;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.375em;
    text-align: left !important;
    min-width: 270px
}

.btn-download i {
    position: absolute;
    right: 1.563em;
    top: 50%;
    margin-top: -8px;
    width: 16px;
    height: 16px;
    background: url(/images/ico/ico-download.png) no-repeat center;
    -webkit-transition: all ease .3s;
    -moz-transition: all ease .3s;
    -ms-transition: all ease .3s;
    -o-transition: all ease .3s;
    transition: all ease .3s;
}

.btn-download:hover {
    border-color: #333;
    background: #333;
    color: #fff;
}

.btn-download:hover i {
    background: url(/images/ico/ico-download-on.png) no-repeat center;
}

.btn-download.small {
    padding: 0;
    min-width: auto;
    width: 43px;
    height: 43px;
    text-align: center;
}

.btn-download.small i {
    right: 50%;
    margin-right: -8px;
    top: 50%;
    margin-top: -8px;
}

.btn-video {
    position: relative;
    padding: 0.938em 4.375em 0.938em 1.563em;
    border: 1px solid #1b1b1b;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.375em;
    text-align: left !important;
    min-width: 270px
}

.btn-video i {
    position: absolute;
    right: 1.563em;
    top: 50%;
    margin-top: -8px;
    width: 20px;
    height: 15px;
    background: url(/images/ico/ico-video.png) no-repeat center;
    -webkit-transition: all ease .3s;
    -moz-transition: all ease .3s;
    -ms-transition: all ease .3s;
    -o-transition: all ease .3s;
    transition: all ease .3s;
}

.btn-video:hover {
    border-color: #333;
    background: #333;
    color: #fff;
}

.btn-video:hover i {
    background: url(/images/ico/ico-video-on.png) no-repeat center;
}

.btn-print {
    position: relative;
    padding: 0 1.563em 0 0;
    min-width: 8.125em;
    border: none;
    line-height: 2.5em;
}

.btn-print i {
    position: absolute;
    right: 1.563em;
    top: 50%;
    margin-top: -8px;
    width: 15px;
    height: 15px;
    background: url(/images/ico/ico-print.png) no-repeat center;
    -webkit-transition: all ease .3s;
    -moz-transition: all ease .3s;
    -ms-transition: all ease .3s;
    -o-transition: all ease .3s;
    transition: all ease .3s;
}

.btn-print:hover {
    background: none;
    color: #33ba05;
}

.btn-print:hover i {
    background: url(/images/ico/ico-print-on.png) no-repeat center;
}

.btn-link {
    position: relative;
    padding: 0.938em 4.375em 0.938em 1.563em;
    border: 1px solid #1b1b1b;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.375em;
    text-align: left !important;
    min-width: 270px;
}

.btn-link i {
    position: absolute;
    right: 1.563em;
    top: 50%;
    margin-top: -9px;
    width: 17px;
    height: 18px;
    background: url(/images/ico/ico-link-big.png) no-repeat center;
    -webkit-transition: all ease .3s;
    -moz-transition: all ease .3s;
    -ms-transition: all ease .3s;
    -o-transition: all ease .3s;
    transition: all ease .3s;
}

.btn-link.small {
    padding: 0;
    width: 43px;
    height: 43px;
    text-align: center;
    min-width: auto;
}

.btn-link.small i {
    right: 50%;
    margin-right: -8.5px;
}

.btn-link:hover {
    border-color: #333;
    background: #333;
    color: #fff;
}

.btn-link:hover i {
    background: url(/images/ico/ico-link-big-on.png) no-repeat center;
}

.btn-link.black {
    background: #333;
    color: #fff;
}

.btn-link.black i {
    background: url(/images/ico/ico-link-big-on.png) no-repeat center;
}

.btn-inlink {
    position: relative;
}

.btn-inlink i {
    display: none;
}

.btn-inlink:hover {
    border-color: #333;
    background: #333;
    color: #fff;
}

.btn-inlink:hover:after {
    border-color: #fff;
}

.btn-inlink:after {
    content: "";
    position: absolute;
    right: 1.363em;
    top: 50%;
    width: 10px;
    margin-top: -7px;
    height: 10px;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;
}

/*
.btn-inlink i { position:absolute; right:1.563em;  top:50%; margin-top:-5.5px; width:11px; height:11px; background:url(/images/ico/ico-inlink.png) no-repeat center;   
    -webkit-transition:all ease .3s;
    -moz-transition:all ease .3s;
    -ms-transition:all ease .3s;
    -o-transition:all ease .3s;
    transition:all ease .3s; 
}  
.btn-inlink:hover i { background:url(/images/ico/ico-inlink-on.png) no-repeat center;}
*/

.btn-type01 {
    min-width: 13.889em;
    height: 3.333em;
    border: 1px solid #000;
    font-size: 1.8rem;
    color: #000000;
    text-align: center;
    line-height: 3.333em;
    -webkit-transition: all ease .3s;
    -moz-transition: all ease .3s;
    -ms-transition: all ease .3s;
    -o-transition: all ease .3s;
    transition: all ease .3s;
}

.btn-type01:hover {
    background: #333;
    color: #fff;
}

.btn-type01.green {
    background: #33ba05;
    border-color: #33ba05;
    color: #fff;
}

.btn-type01.black {
    background: #333333;
    border-color: #333333;
    color: #fff;
}

.btn-videoplay {
    position: relative;
    width: 75px;
    height: 75px;
    border-radius: 50%;
    background: #33ba05;
}

.btn-videoplay:after {
    content: "\e930";
    position: absolute;
    left: 50%;
    top: 50%;
    padding-bottom: 0.091em;
    font-size: 5.5rem;
    color: #fff;
    font-family: 'xeicon', sans-serif;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: rotate(90deg) translate(-50%, -50%);
    -moz-transform: rotate(90deg) translate(-50%, -50%);
    -ms-transform: rotate(90deg) translate(-50%, -50%);
    -o-transform: rotate(90deg) translate(-50%, -50%);
    transform: rotate(90deg) translate(-50%, -50%);
}

.btn-videoplay:hover {
    background: #333;
}

.btn-video.small2 {
    padding: 0 1.563em 0 0;
    min-width: 8.125em;
    border: none;
    line-height: 2.5em;
}

.btn-video.small2 i {
    right: 0;
}

.btn-download.small2 {
    padding: 0 1.563em 0 0;
    min-width: 8.125em;
    border: none;
    line-height: 2.5em;
}

.btn-download.small2 i {
    right: 0;
    margin-top: -10px;
}

.btn-video.small2:hover {
    background: none;
    color: #33ba05;
}

.btn-video.small2:hover i {
    background: url(/images/ico/ico-video-green.png) no-repeat center;
}

.btn-download.small2:hover {
    background: none;
    color: #33ba05;
}

.btn-download.small2:hover i {
    background: url(/images/ico/ico-download-green.png) no-repeat center;
}

/* ----- sub visual ----- */

.sub-visual {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 100vh;
}

.sub-visual.small {
    padding-top: 5em;
    height: 50em;
}

.sub-visual:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-animation: bgMove 2s ease-in-out both;
    -moz-animation: bgMove 2s ease-in-out both;
    -ms-animation: bgMove 2s ease-in-out both;
    -o-animation: bgMove 2s ease-in-out both;
    animation: bgMove 2s ease-in-out both;
}

.sub-visual.bg-greeting:after {
    background-image: url(/images/sub/common/sub-visual-greeting.jpg);
}

.sub-visual.bg-gas-turbine:after {
    background-image: url(/images/sub/common/sub-visual-gas-turbine.jpg);
}

.sub-visual.bg-smr:after {
    background-image: url(/images/sub/common/sub-visual-smr.jpg);
}

.sub-visual.bg-hydrogen:after {
    background-image: url(/images/sub/common/sub-visual-hydrogen.jpg);
}

.sub-visual.bg-ess-sunlight:after {
    background-image: url(/images/sub/common/sub-visual-ess-sunlight.jpg);
}

.sub-visual.bg-nuclear:after {
    background-image: url(/images/sub/common/sub-visual-nuclear.jpg);
}

.sub-visual.bg-ci:after {
    background-image: url(/images/sub/common/sub-visual2-ci.jpg?v=0.1);
}

.sub-visual.bg-innovation:after {
    background-image: url(/images/sub/common/sub-visual-innovation.jpg);
}

.sub-visual.bg-quality:after {
    background-image: url(/images/sub/common/sub-visual-quality.jpg);
}

.sub-visual.bg-board:after {
    background-image: url(/images/sub/common/sub-visual-board.jpg);
}

.sub-visual.bg-governance:after {
    background-image: url(/images/sub/common/sub-visual-governance.jpg);
}

.sub-visual.bg-ir:after {
    background-image: url(/images/sub/common/sub-visual-ir.jpg);
}

.sub-visual.bg-board2:after {
    background-image: url(/images/sub/common/sub-visual-board2.jpg);
}

.sub-visual.bg-wind-energy:after {
    background-image: url(/images/sub/common/sub-visual-wind-energy.jpg);
}

.sub-visual.bg-overview:after {
    background-image: url(/images/sub/common/sub-visual-overview.jpg);
}

.sub-visual.bg-environment:after {
    background-image: url(/images/sub/common/sub-visual-environment.jpg);
}

.sub-visual.bg-contactus:after {
    background-image: url(/images/sub/common/sub-visual-contactus.jpg);
}

.sub-visual.bg-history:after {
    background-image: url(/images/sub/common/sub-visual-history.jpg);
}

.sub-visual.bg-network:after {
    background-image: url(/images/sub/common/sub-visual-network.jpg);
}

.sub-tit {
    display: block;
    position: relative;
    z-index: 10;
    width: 100%;
    font-size: 6rem;
    color: #fff;
    font-weight: 700;
    text-align: center;
}

.sub-tit span {
    opacity: 0;
    visibility: hidden;
    display: inline-block;
    min-width: 0.25em;
    -webkit-transform: rotateY(-90deg);
    -moz-transform: rotateY(-90deg);
    -ms-transform: rotateY(-90deg);
    -o-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    -webkit-animation: subTitAni 0.3s ease forwards;
    -moz-animation: subTitAni 0.3s ease forwards;
    -ms-animation: subTitAni 0.3s ease forwards;
    -o-animation: subTitAni 0.3s ease forwards;
    animation: subTitAni 0.3s ease forwards;
}

.sub-nav-wrap {
    position: relative;
    z-index: 10;
    padding-top: 13em;
    margin: 0 auto;
    max-width: 1210px;
    width: 90%;
    text-align: center;
}

.sub-nav-wrap .sub-nav {
    display: flex;
    width: 100%;
}

.sub-nav-wrap .sub-nav li {
    flex: 1;
    position: relative;
    margin-left: 60px;
}

.sub-nav-wrap .sub-nav li:first-child {
    margin-left: 0;
}

.sub-nav-wrap .sub-nav li:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 2px;
    height: 0;
    background: #fff;
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    -ms-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.sub-nav-wrap .sub-nav li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 2px;
    background: #fff;
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
    -webkit-transition-delay: 0.1s;
    -moz-transition-delay: 0.1s;
    -ms-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.sub-nav-wrap .sub-nav li a {
    display: flex;
    align-items: center;
    position: relative;
    padding: 0 3em;
}

.sub-nav-wrap .sub-nav li a i {
    opacity: 0;
    position: absolute;
    right: 28px;
    top: 50%;
    margin-top: -12.5px;
    font-size: 2.5rem;
}

.sub-nav-wrap .sub-nav li a:after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 2px;
    height: 0;
    background: #fff;
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
    -webkit-transition-delay: 0;
    -moz-transition-delay: 0;
    -ms-transition-delay: 0;
    -o-transition-delay: 0;
    transition-delay: 0;
}

.sub-nav-wrap .sub-nav li a:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #fff;
}

.sub-nav-wrap .sub-nav li a i {
    position: absolute;
    right: 1.120em;
    top: 50%;
    margin-top: -0.5em;
    font-size: 2.5rem;
    color: #fff;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}

.sub-nav-wrap .sub-nav li a span {
    display: block;
    width: 100%;
    position: relative;
    z-index: 2;
    white-space: nowrap;
    font-size: 2rem;
    color: #fff;
    letter-spacing: -0.025em;
    line-height: 3.5em;
    -webkit-transition: width 0.7s ease;
    -moz-transition: width 0.7s ease;
    -ms-transition: width 0.7s ease;
    -o-transition: width 0.7s ease;
    transition: width 0.7s ease;
}

.sub-nav-wrap .sub-nav li.on a i,
.sub-nav-wrap .sub-nav li:hover a i {
    opacity: 1;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.sub-nav-wrap .sub-nav li.on:after,
.sub-nav-wrap .sub-nav li:hover:after {
    height: 100%;
    -webkit-transition-delay: 0;
    -moz-transition-delay: 0;
    -ms-transition-delay: 0;
    -o-transition-delay: 0;
    transition-delay: 0;
}

.sub-nav-wrap .sub-nav li.on:before,
.sub-nav-wrap .sub-nav li:hover:before {
    width: 100%;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    -ms-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.sub-nav-wrap .sub-nav li.on a:after,
.sub-nav-wrap .sub-nav li:hover a:after {
    height: 100%;
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -ms-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

.sub-nav-wrap .sub-nav li.on a span,
.sub-nav-wrap .sub-nav li a:hover span {
    width: 0;
}

.breadcrumb {
    position: absolute;
    left: 50%;
    bottom: 3.5em;
    z-index: 10;
    max-width: 1460px;
    width: 90%;
    text-align: right;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.breadcrumb li {
    display: inline-block;
    position: relative;
    padding-left: 1.929em;
}

.breadcrumb li:after {
    content: "\e93f";
    position: absolute;
    left: .4em;
    top: 1px;
    font-family: 'xeicon', sans-serif;
}

.breadcrumb li:first-child {
    padding-left: 0;
}

.breadcrumb li:first-child:after {
    display: none;
}

.breadcrumb li,
.breadcrumb li a {
    font-size: 1.4rem;
    color: #fff;
    font-weight: 300;
}

.breadcrumb li a:hover {
    text-decoration: underline;
    text-underline-position: under;
}

/* ----- contents common ----- */

.mobile-only {
    display: none !important;
}

.sub-sm-tit {
    overflow: hidden;
    padding: 11em 0;
    text-align: center;
}

.sub-sm-tit h3 {
    font-size: 2.6rem;
    color: #333333;
    line-height: 1.667em;
    letter-spacing: -0.01em;
    font-weight: 600;
}

.sub-sm-tit h3>span {
    display: block;
    font-size: 1.99rem;
}

.sub-sm-tit ul {
    max-width: 890px;
    width: 100%;
    margin: 0 auto;
    text-align: left;
}

.sub-sm-tit ul>li {
    display: flex;
    gap: 1%;
    font-size: 2.6rem;
    color: #333333;
    line-height: 1.667em;
    letter-spacing: -0.01em;
    font-weight: 600;
}

.sub-sm-tit .ico-h2 {
    margin-top: 4.286em;
    font-size: 1.4rem;
    color: #666666;
    text-align: right;
}

.con-sm-tit {
    font-size: 2rem;
    color: #333333;
    letter-spacing: -0.013em;
    font-weight: 700;
}

.ico-h2 {
    margin-top: 2.143em;
}

.conbox .maxinner {
    position: relative;
}

.conbox .ico-h2 {
    margin: 0;
    font-size: 1.4rem;
    color: #666666;
    position: absolute;
    right: 0;
    top: -50px;
    text-align: right;
}

.sub-con {
    padding-bottom: 18em;
}

.space {
    padding-top: 11em;
}

.bd-t {
    border-top: 1px solid #dcdcdc;
}

.bd-l {
    border-left: 1px solid #e6e6e6 !important;
}

.mb-br {
    display: none;
}

.ico-touch {
    opacity: .8;
    display: none;
}

.alicenter {
    align-items: center;
}

.counting {
    font-style: normal;
}

.ani-underline {
    display: inline-block;
    position: relative;
}

.ani-underline:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 10%;
    z-index: -1;
    width: 0;
    height: 30%;
    background: #33ba05;
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -ms-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}

.ani-on .ani-underline:after {
    width: 100%;
}

.halfbox {
    display: flex;
}

.halfbox .left {
    width: 27%;
    padding-right: 5%;
}

.halfbox .left .tit {
    font-size: 3.4rem;
    color: #333333;
    letter-spacing: -0.007em;
    font-weight: 700;
    line-height: 1.588em;
}

.halfbox .left .tit span {
    display: block;
    font-size: 2.4rem;
    color: #333333;
    font-weight: 500;
    line-height: 1.4em;
    letter-spacing: -0.010em;
}

.halfbox .left .txt {
    margin-top: 0.722em;
    font-size: 1.8rem;
    color: #666666;
    letter-spacing: -0.014em;
    font-weight: 300;
    line-height: 1.667em;
}

.halfbox .right {
    width: 73%;
}

.halfbox .right .tbstyle02 {
    margin-top: 1em;
}

.halfbox .btnwrap {
    margin-top: 5em;
}

.halfbox2 {
    display: flex;
    align-items: center;
}

.halfbox2 .left {
    padding-left: 50px;
    width: 72%;
}

.halfbox2 .left .tit {
    font-size: 3.4rem;
    color: #333333;
    letter-spacing: -0.007em;
    font-weight: 800;
}

.halfbox2 .left .txt {
    margin-top: 1.389em;
    font-size: 1.8rem;
    color: #666666;
    letter-spacing: -0.014em;
    font-weight: 300;
    line-height: 1.667em;
}

.halfbox2 .right {
    width: 28%;
}

.halfbox2 {
    padding: 10em 0 0;
}

.halfbox2 .btnwrap {
    text-align: center;
}

.flexbox {
    display: flex;
    margin-left: -2%;
}

.flexbox li {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 2.5em;
    margin-left: 2%;
    width: 18%;
    min-height: 13.5em;
    border: 1px solid #dcdcdc;
}

.flexbox li strong {
    font-size: 1.8rem;
    color: #333333;
    line-height: 1.667em;
    letter-spacing: -0.014em;
    font-weight: 700;
}

.flexbox li p {
    font-size: 1.8rem;
    color: #666666;
    line-height: 1.667em;
    letter-spacing: -0.014em;
    font-weight: 300;
}

.infobox {
    padding: 2.5em 3em 2em;
    border: 1px solid #dcdcdc;
}

.infobox .info-tit {
    margin-bottom: 0.8em;
    font-size: 1.6rem;
    color: #22b1ac;
    font-weight: 400;
    letter-spacing: -0.014em;
}

.infobox ul {
    display: flex;
    flex-wrap: wrap;
}

.infobox li {
    position: relative;
    padding-left: 1em;
    margin: 0.214em 0;
    width: 50%;
    font-size: 1.4rem;
    color: #888888;
    font-weight: 300;
    line-height: 1.714em;
    letter-spacing: -0.014em;
}

.infobox li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 11px;
    width: 8px;
    height: 1px;
    background: #888;
}

.line-imgbox>div {
    display: inline-block;
    position: relative;
}

.line-imgbox>div:after {
    content: "";
    position: absolute;
    left: 0;
    top: -0.5%;
    width: 100%;
    height: 101%;
    background: #fff;
    -webkit-transition: all 1.1s;
    -moz-transition: all 1.1s;
    -ms-transition: all 1.1s;
    -o-transition: all 1.1s;
    transition: all 1.1s;
}

.line-imgbox.on>div:after {
    width: 0;
}

.f-color {
    color: #22b1ac !important;
    font-weight: 400;
}

.normal-tit {
    margin: 0 0 0.5em;
    display: block;
    font-size: 2.6rem;
    color: #333333;
    line-height: 1.667em;
    letter-spacing: -0.014em;
    font-weight: 700;
}

.normal-txt {
    font-size: 1.8rem;
    color: #333333;
    line-height: 1.667em;
    letter-spacing: -0.014em;
    font-weight: 300;
    word-break: keep-all;
}

.normal-txt sub {
    line-height: 1;
}

.normal-sm-txt {
    position: relative;
    margin-top: 1em;
    font-size: 1.5rem;
    color: #666666;
    line-height: 2em;
    letter-spacing: -0.017em;
    font-weight: 300;
}

.normal-sm-txt a {
    color: #666;
}

.summary {
    padding: 0.7em 0.714em;
    background: #fafafa;
    font-size: 1.4rem;
    color: #666666;
    line-height: 1.7em;
    letter-spacing: -0.018em;
    font-weight: 300;
    text-align: left;
}

.link-decoration {
    text-decoration: underline;
}

.link-txt {
    position: relative;
    padding-bottom: 0.313em;
    font-size: 1.6rem;
    color: #22b1ac;
    font-weight: 300;
    line-height: 1.875em;
}

.link-txt:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 1px;
    background: #22b1ac;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.link-txt i {
    margin-right: 0.455em;
    margin-top: -0.045em;
    font-size: 2.2rem;
    vertical-align: middle;
}

.link-txt:hover:after {
    width: 100%;
}

.line-link {
    padding-top: 18em;
    text-align: right;
}

.line-link>div {
    position: relative;
}

.line-link>div .txtwrap {
    position: absolute;
    left: 0;
    top: 0;
    padding-left: 6.5em;
    width: 100%;
    height: 100%;
    text-align: left;
}

.line-link>div .txtwrap h3 {
    padding-top: 2.353em;
    margin-bottom: 0.735em;
    font-size: 3.4rem;
    color: #ffffff;
    line-height: 36px;
    font-weight: 700;
}

.line-link>div .txtwrap .link-txt {
    font-size: 1.8rem;
    color: #fff;
    font-weight: 500;
}

.line-link>div .txtwrap .link-txt i {
    display: inline-block;
    margin: 0 0 0 0.6em;
    font-size: 2rem;
    vertical-align: text-bottom;
}

.line-link>div .txtwrap .link-txt:after {
    background: #fff;
}

.line-link>div .txtwrap .big-link {
    padding-top: 8em;
}

.line-link>div .txtwrap .big-link .link-txt {
    font-size: 3.4rem;
}

.line-link>div .txtwrap .big-link .link-txt i {
    font-size: 2.8rem;
    vertical-align: baseline;
}

.line-link>div .txtwrap .big-link li {
    display: inline-block;
    width: 40%;
    vertical-align: middle;
}

.line-link>div .txtwrap .sm-link li {
    display: inline-block;
    position: relative;
    padding-left: 3em;
    margin-left: 3em;
}

.line-link>div .txtwrap .sm-link li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 1px;
    height: 18px;
    background: rgba(255, 255, 255, 0.5);
}

.line-link>div .txtwrap .sm-link li:first-child {
    padding-left: 0;
    margin-left: 0;
}

.line-link>div .txtwrap .sm-link li:first-child:after {
    display: none;
}

.line-link>div .txtwrap .sm-link li img {
    vertical-align: baseline;
}

.sub-depth-nav {
    display: flex;
    justify-content: center;
    border: 1px solid #e5e5e5;
}

.sub-depth-nav li {
    position: relative;
    padding: 3.2em 0;
}

.sub-depth-nav li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 20px;
    background: #e5e5e5;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.sub-depth-nav li:first-child:after {
    display: none;
}

.sub-depth-nav li a {
    padding: 0 4em;
    border: none;
    background: none;
    font-size: 2rem;
    color: #333333;
    letter-spacing: -0.025em;
    display: block;
    text-align: center;
}

.sub-depth-nav li.on a,
.sub-depth-nav li a:hover {
    color: #22b1ac;
}

.tab-nav {
    padding: 10em 0 0;
    text-align: center;
}

.tab-nav li {
    display: inline-block;
    margin: 0 4px;
    vertical-align: middle;
}

.tab-nav li a,
.tab-nav li button {
    display: block;
    min-width: 225px;
    background: #f0f0f0;
    font-size: 1.8rem;
    color: #333333;
    letter-spacing: -0.5px;
    text-align: center;
    line-height: 3.056em;
    padding: 0 1.111em;
}

.tab-nav li.on a,
.tab-nav li.on button {
    background: #22b1ac;
    color: #fff;
    box-shadow: 1px 1px 15px rgb(56 184 0 / 44%);
}

.tab-nav-con {
    display: none;
}

.tab-nav-con.open {
    display: block;
}

.tabarea .tab-tit {
    padding: 10em 0;
    text-align: center;
}

.tabarea .tab-tit h4 {
    margin-bottom: 1em;
    font-size: 4rem;
    color: #333333;
    letter-spacing: -0.007em;
    font-weight: 700;
}

.tabarea .tab-tit p {
    color: #666666;
}

.img-borderbox {
    border: 1px solid #e6e6e6;
    text-align: center;
}

.sub-btnwrap {
    overflow: hidden;
    padding-bottom: 5em;
}

.sub-btnwrap a {
    margin-left: 10px;
}

.sub-btnwrap a:first-child {
    margin-left: 0;
}

.cont-tit {
    margin-bottom: 1.125em;
    font-size: 4rem;
    color: #333333;
    font-weight: 700;
    letter-spacing: -0.006em;
    text-align: center;
}

.halfbox.halfbox-new .tit {
    margin-bottom: 15px;
    font-size: 3.2rem;
    color: #333;
    letter-spacing: -0.007em;
    font-weight: 700;
    line-height: 1.588em;
}

.halfbox-new {
    gap: 15px;
    flex-wrap: wrap;
}

.halfbox-new>div {
    width: calc(100% / 3) !important;
    min-width: 440px;
    padding: 0 !important;
    flex: 1;
}

.halfbox-new .pic-wrap {
    position: relative;
    border: 1px solid #22b1ac;
}

/*
.halfbox-new .pic-wrap:before, .halfbox-new .pic-wrap:after {content:""; position:absolute; width:92%; left:4%;}
*/

.halfbox-new .pic-wrap:before {
    top: 0;
    border-top: 2px solid #efefef;
}

.halfbox-new .pic-wrap:after {
    bottom: 0;
    border-bottom: 2px solid #efefef;
}

.halfbox-new .pic-wrap>li {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
}

.halfbox-new .pic-wrap>li:after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 94%;
}

.halfbox-new .pic-wrap>li:not(:last-child):after {
    border-bottom: 1px dashed #22b1ac
}

.halfbox-new .pic-wrap>li:not(:last-child) .pic-title:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 115px;
    border-bottom: 1px dashed #fff;
    z-index: 1;
}

.halfbox-new .pic-wrap>li>div {
    display: flex;
    align-items: center;
}

.halfbox-new .pic-wrap .pic-title {
    flex: 0 0 116px;
    justify-content: center;
    padding: 0 10px;
    text-align: center;
    border-right: 1px solid #22b1ac;
    background: #22b1ac;
}

.halfbox-new .pic-wrap .pic-title>h5 {
    font-size: 1.6rem;
    color: #fff;
    line-height: 1.3;
}

.en .halfbox-new .pic-wrap .pic-title>h5 {
    word-break: break-word;
}

.halfbox-new .pic-wrap .pic-txt {
    flex-wrap: wrap;
    flex: 1;
    padding: 10px 12px;
}

.halfbox-new .pic-wrap .pic-txt>div>p {
    width: 100%;
    font-size: 1.5rem;
    color: #333;
    line-height: 1.4;
}

.halfbox-new .pic-wrap .pic-txt>div>span {
    position: relative;
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 0 10px 0 15px;
    color: #848382;
    font-size: 1.4rem;
    line-height: 1.35;
}

.halfbox-new .pic-wrap .pic-txt>div>span:before {
    content: "•";
    position: absolute;
    top: 1px;
    left: 3px;
    font-size: 1px;
}

.halfbox-new .pic-wrap .pic {
    flex: 0 0 147px;
    flex-direction: column;
    gap: 5px;
    align-self: center;
    padding: 10px 10px 10px 0;
}

/* ----- step style01 ----- */

.step-st01 {
    display: flex;
    justify-content: space-between;
    margin-top: 6em;
}

.step-st01>li {
    position: relative;
    padding-bottom: 20%;
    width: 20%;
    height: 0;
    border-radius: 50%;
    text-align: center;
}

.step-st01>li .icowrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 20px;
    top: 20px;
    right: 20px;
    bottom: 20px;
    z-index: 1;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #33ba05;
    padding: 0 3rem;
}

.step-st01>li .icowrap .ico {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 1;
    width: 8em;
    height: 8em;
}

.step-st01>li .line-circle {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    -webkit-animation: circleRotate 40s linear infinite;
    -moz-animation: circleRotate 40s linear infinite;
    -ms-animation: circleRotate 40s linear infinite;
    -o-animation: circleRotate 40s linear infinite;
    animation: circleRotate 40s linear infinite;
}

.step-st01>li:nth-child(even) {
    z-index: 10;
}

.step-st01>li:nth-child(even) .line-circle {
    border: 1px dashed #33ba05;
}

.step-st01>li:nth-child(even) .line-circle:after {
    content: '';
    position: absolute;
    left: 3.5%;
    top: 70%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #33ba05;
}

.step-st01>li:nth-child(2) .line-circle:after,
.step-st01>li:nth-child(6) .line-circle:after {
    -webkit-transform: translate3d(-30%, -50%, 0);
    -moz-transform: translate3d(-30%, -50%, 0);
    -ms-transform: translate3d(-30%, -50%, 0);
    -o-transform: translate3d(-30%, -50%, 0);
    transform: translate3d(-30%, -50%, 0);
}

.step-st01>li:nth-child(4) .line-circle:after {
    left: auto;
    right: 3.5%;
    top: 30%;
    -webkit-transform: translate3d(30%, -50%, 0);
    -moz-transform: translate3d(30%, -50%, 0);
    -ms-transform: translate3d(30%, -50%, 0);
    -o-transform: translate3d(30%, -50%, 0);
    transform: translate3d(30%, -50%, 0);
}

.step-st01>li:nth-child(odd) .line-circle {
    background: #fafafa;
}

.step-st01>li p {
    position: relative;
    z-index: 1;
    margin-top: .2em;
    font-size: 1.8rem;
    color: #333333;
    font-weight: 600;
    letter-spacing: -0.014em;
}

/* ----- step style02 ----- */

.step-st02 {
    display: flex;
    text-align: center;
    position: relative;
    margin-left: -1%;
}

.step-st02 li {
    position: relative;
    margin-left: 1%;
    width: 19%;
}

.step-st02 li>.titwrap {
    position: relative;
    margin: 0 auto;
    padding-bottom: 100%;
    width: 100%;
    height: 0;
    border-radius: 50%;
    border: 3px dotted #ececec;
}

.step-st02 li>.titwrap:after {
    content: "";
    position: absolute;
    left: -1%;
    top: 50%;
    z-index: -1;
    margin-top: -15%;
    width: 30px;
    height: 30%;
    background: #fff;
}

.step-st02 li>.titwrap:before {
    content: "";
    position: absolute;
    right: -1%;
    top: 50%;
    z-index: -1;
    margin-top: -15%;
    width: 30px;
    height: 30%;
    background: #fff;
}

.step-st02 li>.titwrap>div {
    position: absolute;
    left: 17px;
    top: 17px;
    right: 17px;
    bottom: 17px;
    z-index: 10;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #22b1ac;
}

.step-st02 li>.titwrap>div:after {
    content: "";
    position: absolute;
    right: -29px;
    top: 50%;
    margin-top: -7.5%;
    width: 30px;
    height: 15%;
    border-top: 2px solid #22b1ac;
    background: #fff;
}

.step-st02 li>.titwrap>div:before {
    content: "";
    position: absolute;
    left: -29px;
    top: 50%;
    margin-top: -7.5%;
    width: 30px;
    height: 15%;
    border-top: 2px solid #22b1ac;
    background: #fff;
}

.step-st02 li>.titwrap span {
    display: block;
    padding-top: 26%;
    font-size: 1.8rem;
    color: #22b1ac;
    font-weight: 700;
    letter-spacing: -0.014em;
}

.step-st02 li>.titwrap strong {
    display: block;
    margin-top: 0.588em;
    min-height: 2.588em;
    font-size: 1.7rem;
    color: #000000;
    letter-spacing: -0.015em;
    font-weight: 400;
    line-height: 1.294em;
}

.step-st02 li>p {
    margin-top: 1.25em;
    font-size: 1.6rem;
    color: #666666;
    letter-spacing: -0.016em;
    line-height: 1.375em;
    font-weight: 300;
    text-align: center !important;
}

.step-st02 li:first-child>.titwrap:after {
    display: none;
}

.step-st02 li:last-child>.titwrap:before {
    display: none;
}

.step-st02 li:first-child>.titwrap>div:before {
    display: none;
}

.step-st02 li:last-child>.titwrap>div:after {
    display: none;
}

/* ----- step style03 ----- */

.step-st03 {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    position: relative;
    margin-left: -5%;
    margin-top: -8.692%;
}

.step-st03 li {
    position: relative;
    margin-top: 8.692%;
    margin-left: 8.692%;
    padding-bottom: 16.308%;
    width: 16.308%;
    height: 0;
    border-radius: 50%;
    background: #fff;
    border: 1px dashed #22b1ac;
    -webkit-box-shadow: 1px 1px 15px rgba(221, 221, 221, 0.3);
    box-shadow: 1px 1px 15px rgba(221, 221, 221, 0.3);
}

.step-st03 li:after {
    content: "";
    position: absolute;
    left: 100%;
    top: 50%;
    z-index: -1;
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #22b1ac;
}

.step-st03 li:before {
    content: "";
    display: none;
    position: absolute;
    left: 50%;
    top: -100%;
    z-index: -1;
    width: 1px;
    height: 100%;
    border-left: 1px dashed #22b1ac;
}

.step-st03 li:nth-child(5):before {
    display: block;
}

.step-st03 li:nth-child(8):before {
    display: block;
}

.step-st03 li:nth-child(4n):after {
    display: none;
}

.step-st03 li>div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.step-st03 li p {
    padding: 0 1.111em;
    margin-top: 1.111em;
    font-size: 1.8rem;
    color: #333333;
    font-weight: 600;
    line-height: 1.389em;
    letter-spacing: -0.014em;
}

/* ----- gas turbine product ----- */

.gas-turbine-product .space {
    padding-bottom: 11em;
    border-top: 1px solid #ddd;
}

.gas-turbine-product .halfbox .left .tit img {
    vertical-align: top;
}

.gas-turbine-product .line-imgbox {
    margin-top: 3em;
    text-align: right;
}

.gas-turbine-product .sub-btnwrap .maxinner {
    position: relative;
}

.gas-turbine-product .sub-btnwrap .ico-h2 {
    position: absolute;
    right: 0;
    top: 100%;
    margin: 0;
    font-size: 1.4rem;
    color: #666666;
    text-align: right;
}

/* ----- gas turbine infra - map ----- */

.gas-turbine-infra .mapwrap {
    position: relative;
    margin-top: 3.5em;
    padding-bottom: 41.644%;
    height: 0;
}

.gas-turbine-infra .mapwrap>img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.gas-turbine-infra .mapwrap .map-btn {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.gas-turbine-infra .mapwrap .map-btn button {
    position: absolute;
    background: none;
    cursor: pointer;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-transform: skew(-21deg, 21deg);
    -moz-transform: skew(-21deg, 21deg);
    -ms-transform: skew(-21deg, 21deg);
    -o-transform: skew(-21deg, 21deg);
    transform: skew(-21deg, 21deg);
}

.gas-turbine-infra .mapwrap .map-btn button.btn-map01 {
    top: 24%;
    left: 20.5%;
    width: 15%;
    height: 37.5%;
}

.gas-turbine-infra .mapwrap .map-btn button.btn-map02 {
    top: 23%;
    left: 16.5%;
    width: 4%;
    height: 10%;
}

.gas-turbine-infra .mapwrap .map-btn button.btn-map03 {
    left: 79.9%;
    top: 68%;
    width: 4%;
    height: 6%;
}

.gas-turbine-infra .mapwrap .map-pop {
    display: none;
    position: absolute;
    right: 7%;
    top: 7%;
    z-index: 2;
    padding: 6em 5em 5.5em;
    min-width: 45em;
    background: #fff;
}

.gas-turbine-infra .mapwrap .map-pop h4 {
    margin-bottom: 0.714em;
    font-size: 2.8rem;
    color: #333333;
    letter-spacing: -0.009em;
    font-weight: 600;
}

.gas-turbine-infra .mapwrap .map-pop img {
    border: 1px solid #ddd;
}

.gas-turbine-infra .mapwrap .map-pop .btn-map-close {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 28px;
    height: 28px;
    background: none;
    border: 1px solid #333;
}

.gas-turbine-infra .mapwrap .map-pop .btn-map-close:after {
    content: "\e9af";
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 2.3rem;
    color: #333;
    font-family: 'xeicon', sans-serif;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.gas-turbine-infra .mapwrap .map-pop .btn-map-close:hover {
    background: #333;
}

.gas-turbine-infra .mapwrap .map-pop .btn-map-close:hover:after {
    color: #fff;
    font-weight: 700;
}

/* ----- smr common ----- */

.smr .imgbox p {
    margin-top: 1em;
    font-size: 2rem;
    color: #333333;
    line-height: 1.5em;
    letter-spacing: -0.013em;
    font-weight: 700;
}

/* ----- smart smr ----- */

.smart-smr .bg-gray {
    margin-top: 11em;
    padding-bottom: 15em;
    background: #fbfbfb;
}

.smart-smr.sub-con {
    padding-bottom: 0 !important;
}

.smart-smr .f-color {
    font-weight: 300;
}

.smart-smr .summary {
    margin-top: 3.5em;
}

.smart-smr .line-imgbox {
    text-align: right;
}

.smart-smr .halfbox.imgbox {
    margin-top: 6em;
    padding-top: 0;
    justify-content: space-between;
}

.smart-smr .halfbox.imgbox li {
    width: 48%;
}

/* ----- nuscale ----- */

.nuscale .onebox {
    margin-top: 6em;
    padding-top: 0;
}

.nuscale .onebox img {
    background: #f8f8f8;
    margin-top: 1.5em;
    padding: 2em 0;
}

/* ----- etc smr ----- */

.etc-smr {
    padding-bottom: 0 !important;
}

.etc-smr .map-wrap {
    padding: 12em 0;
    margin-top: 15em;
    background: #fbfbfb;
}

.etc-smr .map-wrap .map-tit {
    display: flex;
    align-items: center;
    margin-bottom: 10em;
}

.etc-smr .map-wrap .map-tit h4 {
    margin-right: 4.118em;
    font-size: 3.4rem;
    color: #333333;
    letter-spacing: -0.007em;
    font-weight: 700;
    line-height: 1.588em;
}

.etc-smr .map-wrap .map-tit ul li {
    display: inline-block;
    margin-left: 1.667em;
    font-size: 1.8rem;
    color: #333333;
    line-height: 1.667em;
    letter-spacing: -0.014em;
    font-weight: 500;
    vertical-align: middle;
}

.etc-smr .map-wrap .map-tit ul li img {
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}

.etc-smr .map-wrap .map-img {
    position: relative;
    min-width: 768px;
}

.etc-smr .map-wrap .map-img .country {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    text-align: center;
}

.etc-smr .map-wrap .map-img .country li {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.etc-smr .map-wrap .map-img .country li img {
    box-shadow: 1px 1px 5px rgba(67, 67, 67, 0.5);
}

.etc-smr .map-wrap .map-img .country li span {
    display: block;
    margin-top: 0.5em;
    font-size: 1.6rem;
    color: #333333;
    letter-spacing: -0.25px;
    font-weight: 700;
}

.etc-smr .map-wrap .map-img .country li:nth-child(1) {
    position: absolute;
    left: 1%;
    top: 39.5%;
}

.etc-smr .map-wrap .map-img .country li:nth-child(2) {
    position: absolute;
    left: 8.3%;
    top: 35%;
}

.etc-smr .map-wrap .map-img .country li:nth-child(3) {
    position: absolute;
    left: 37.8%;
    top: 32.3%;
    z-index: 1;
}

.etc-smr .map-wrap .map-img .country li:nth-child(4) {
    position: absolute;
    left: 40.5%;
    top: 43%;
}

.etc-smr .map-wrap .map-img .country li:nth-child(5) {
    position: absolute;
    left: 75.5%;
    top: 34.7%;
}

.etc-smr .map-wrap .map-img .country li:nth-child(6) {
    position: absolute;
    left: 1%;
    top: 20%;
}

/* ----- hydrogen ----- */

.hydrogen .halfbox+.halfbox {
    padding-top: 10em;
}

.hydrogen .line-imgbox {
    padding-bottom: 11em;
}

.hydrogen .btnwrap>div:first-child {
    margin-top: 0;
}

.hydrogen .btnwrap>div {
    margin-top: 2em;
}

.hydrogen .btnset {
    min-width: 313px;
    text-align: left !important;
}

.hydrogen .process .maxinner {
    position: relative;
}

.hydrogen .process .nav-img {
    position: relative;
    padding-bottom: 74.179%;
    height: 0;
}

.hydrogen .process .nav-img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.hydrogen .process nav {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}

.hydrogen .process nav ul {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.hydrogen .process nav ul li:nth-child(1) {
    overflow: hidden;
    position: absolute;
    left: 1.9%;
    top: 8.096%;
    padding-bottom: 22.672%;
    width: 75.343%;
    height: 0;
    border-radius: 20px;
}

.hydrogen .process nav ul li:nth-child(1) a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.hydrogen .process nav ul li:nth-child(2) {
    overflow: hidden;
    position: absolute;
    right: 1.55%;
    top: 8.096%;
    padding-bottom: 22.672%;
    width: 17.329%;
    height: 0;
    border-radius: 20px;
}

.hydrogen .process nav ul li:nth-child(2) a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.hydrogen .process nav ul li:nth-child(3) {
    overflow: hidden;
    position: absolute;
    left: 1.9%;
    bottom: 32%;
    padding-bottom: 20%;
    width: 41.439%;
    height: 0;
    border-radius: 20px;
}

.hydrogen .process nav ul li:nth-child(3) a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.hydrogen .process nav ul li:nth-child(4) {
    overflow: hidden;
    position: absolute;
    left: 1.9%;
    bottom: 2.5%;
    padding-bottom: 20%;
    width: 41.439%;
    height: 0;
    border-radius: 20px;
}

.hydrogen .process nav ul li:nth-child(4) a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.hydrogen .process nav ul li:nth-child(5) {
    overflow: hidden;
    position: absolute;
    right: 1.55%;
    bottom: 2.5%;
    padding-bottom: 41.987%;
    width: 50.685%;
    height: 0;
    border-radius: 20px;
}

.hydrogen .process nav ul li:nth-child(5) a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

/* ----- ess ----- */

.ess-sunlight {
    padding-top: 11em;
}

.ess-sunlight .halfbox .left .sub-btnwrap {
    margin-top: 2em;
}

.ess-sunlight .halfbox .right .sub-btnwrap {
    padding: 6em 0;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: start;
}

.ess-sunlight .halfbox .right .sub-btnwrap a {
    margin-left: 0;
    margin-right: 6px;
    margin-bottom: 5px;
}

.ess-sunlight .btnset {
    min-width: 260px;
    text-align: left !important;
}

/* ----- nuclear common ----- */

.nuclear .maxinner .circle-list .halfbox .left .btnwrap {
    margin-top: 2em;
}

.nuclear .maxinner .circle-list .halfbox .right {
    text-align: right;
}

.nuclear .nuclear-imglist {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: -3.5em;
}

.nuclear .nuclear-imglist li {
    margin-top: 4.5em;
    width: 47%;
}

.nuclear .nuclear-imglist li strong {
    display: block;
    margin-top: 1em;
    font-size: 1.8rem;
    color: #333333;
    letter-spacing: -0.014em;
    font-weight: 600;
}

.nuclear .nuclear-imglist li p {
    position: relative;
    padding-left: 0.938em;
    margin-top: 1.125em;
    font-size: 1.6rem;
    color: #666666;
    letter-spacing: -0.016em;
    line-height: 1.5em;
}

.nuclear .nuclear-imglist li p:after {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    width: 8px;
    height: 1px;
    background: #666;
}

/* ----- large nuclear ----- */

.large-nuclear .summary {
    display: inline-block;
    margin-top: 4em;
}

.large-nuclear .halfbox .left {
    padding-right: 5%;
}

.large-nuclear .scale-up {
    min-width: 768px;
}

.btn-scale {
    position: relative;
    padding: 0.6em 1em;
    border: 1px solid #1b1b1b;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.375em;
    margin-right: 16px;
    float: right;
    display: none;
}

.btn-scale i {
    width: 16px;
    height: 18px;
    display: inline-block;
    margin-left: 10px;
    background: url(/images/ico/ico-search-black.png) no-repeat center;
    vertical-align: middle;
}

/* ----- power plant ----- */

.power-plant .step-st01>li .icowrap {
    left: 15px;
    right: 15px;
    top: 15px;
    bottom: 15px;
}

.power-plant .step-st01>li {
    width: 16.66667%;
    padding-bottom: 16.66667%;
}

.power-plant .step-st01>li p {
    margin: 0.8em 0;
}

.power-plant .scale-up {
    min-width: 768px;
}

/* ----- nuclear cycle ----- */

.nuclear-cycle {
    padding-bottom: 0 !important;
}

.nuclear-cycle .sec01 .onebox .halfbox p {
    margin-top: 1.389em;
    font-size: 1.8rem;
    color: #333;
    letter-spacing: -0.014em;
    line-height: 1.333em;
    text-align: center;
}

.nuclear-cycle .onebox {
    padding-top: 10em;
}

.nuclear-cycle .onebox h5 {
    margin-bottom: 1.25em;
    font-size: 2.2rem;
    color: #333333;
    letter-spacing: -0.013em;
    line-height: 1.5em;
    font-weight: 600;
}

.nuclear-cycle .onebox .halfbox {
    padding-top: 0;
    justify-content: space-between;
}

.nuclear-cycle .onebox .halfbox .left {
    width: 48%;
    padding-right: 0;
}

.nuclear-cycle .onebox .halfbox .right {
    width: 48%;
    margin-top: 0;
}

.nuclear-cycle .sec02 {
    padding-bottom: 18em;
    margin-top: 10em;
    background: #fafafa;
}

.nuclear-cycle .sec02 .halfbox li {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    border: 1px solid #dcdcdc;
    background: #fff;
}

.nuclear-cycle .model-list {
    display: flex;
    justify-content: center;
    padding: 9em 7em 6em;
    border: 1px solid #e5e5e5;
    text-align: center;
}

.nuclear-cycle .model-list>.item {
    width: 13%;
}

.nuclear-cycle .model-list>.itembox {
    display: flex;
    position: relative;
    margin-left: 3%;
    width: 51%;
    border: 1px dashed #ccc;
}

.nuclear-cycle .model-list>.itembox:nth-child(2) {
    width: 28%;
}

.nuclear-cycle .model-list>.itembox .item {
    flex: 1;
}

.nuclear-cycle .model-list>.itembox strong {
    position: absolute;
    left: 50%;
    top: -1.375em;
    z-index: 1;
    padding: 0.625em 0;
    width: 21.125em;
    border-radius: 3px;
    background: #22b1ac;
    font-size: 1.6rem;
    color: #ffffff;
    font-weight: 400;
    line-height: 1.5em;
    letter-spacing: -0.016em;
    text-align: center;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.nuclear-cycle .model-list .item {
    position: relative;
    padding-top: 5em;
    padding-bottom: 3.3em;
}

.nuclear-cycle .model-list .item span {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.5em;
    letter-spacing: -0.016em;
}

.nuclear-cycle .model-list .item-img {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    height: 22.5em;
}

.nuclear-cycle .model-list .item p {
    margin-top: 1.25em;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.625em;
    letter-spacing: -0.016em;
    font-weight: 300;
}

.nuclear-cycle .model-list+p {
    margin-top: 1.429em;
    font-size: 1.4rem;
    color: #999999;
    line-height: 1.857em;
    font-weight: 300;
    letter-spacing: -0.018em;
}

.nuclear-cycle .tech-list {
    display: flex;
    justify-content: space-between;
    text-align: center;
}

.nuclear-cycle .tech-list>.item {
    width: 22%;
}

.nuclear-cycle .tech-list>.itemwrap {
    display: flex;
    flex-direction: column;
    margin: 0 1.5%;
    width: 53%;
}

.nuclear-cycle .tech-list>.itemwrap>.itembox {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}

.nuclear-cycle .tech-list>.itemwrap>.itembox:last-child {
    margin-top: 1.5374em;
}

.nuclear-cycle .tech-list>.itemwrap>.itembox>.item {
    flex: 1;
    position: relative;
    margin: 0 12px;
    max-width: 167px;
    width: 22%;
}

.nuclear-cycle .tech-list>.itemwrap>.itembox>.item:after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -30px;
    margin-left: -25.5px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #22b1ac;
}

.nuclear-cycle .tech-list>.itemwrap>.itembox>.item:before {
    content: "\e93f";
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -30px;
    z-index: 1;
    margin-left: -25.5px;
    width: 24px;
    height: 24px;
    font-size: 2rem;
    color: #fff;
    font-family: 'xeicon', sans-serif;
}

.nuclear-cycle .tech-list>.itemwrap>.itembox>.item:first-child:after {
    display: none;
}

.nuclear-cycle .tech-list p {
    margin-top: 0.938em;
    min-height: 2.375em;
    font-size: 1.6rem;
    color: #333333;
    letter-spacing: -0.016em;
}

.nuclear-cycle .cask-banner {
    padding: 10em 0;
}

.nuclear-cycle .cask-banner .maxinner>div {
    display: flex;
    justify-content: space-between;
}

.nuclear-cycle .cask-banner .cask-img {
    width: 26%;
}

.nuclear-cycle .cask-banner .cask-txt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    width: 49%;
}

.nuclear-cycle .cask-banner .cask-txt h4 {
    font-size: 3.4rem;
}

.nuclear-cycle .cask-banner .cask-btn {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 21%;
    text-align: right;
}

/* ----- wind energy common ----- */

.wind-energy .right .btnwrap .btnset {
    min-width: 313px;
}

/* ----- wind energy vision ----- */

.wind-energy.vision {
    padding-bottom: 0 !important;
}

.wind-energy.vision .con-tit {
    margin-bottom: 2.059em;
    font-size: 3.4rem;
    color: #333333;
    letter-spacing: -0.007em;
    font-weight: 700;
}

.wind-energy.vision .sec01 {
    overflow: hidden;
    padding: 14em 0 20rem;
    background: #fafafa;
    text-align: center;
}

.wind-energy.vision .circle-ani {
    display: inline-block;
    position: relative;
}

.wind-energy.vision .circle-ani .cir {
    position: absolute;
    left: 49%;
    top: 50%;
    width: 25%;
    padding-bottom: 25%;
    height: 0;
    border-radius: 50%;
    border-radius: 50%;
    border: 1px dashed #22b1ac;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.wind-energy.vision .circle-ani .cir i {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-animation: circleRotate 15s linear infinite;
    -moz-animation: circleRotate 15s linear infinite;
    -ms-animation: circleRotate 15s linear infinite;
    -o-animation: circleRotate 15s linear infinite;
    animation: circleRotate 15s linear infinite;
}

.wind-energy.vision .circle-ani .cir i:after {
    content: "";
    position: absolute;
    left: 3.2%;
    top: 70%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22b1ac;
    -webkit-transform: translate3d(-30%, -50%, 0);
    -moz-transform: translate3d(-30%, -50%, 0);
    -ms-transform: translate3d(-30%, -50%, 0);
    -o-transform: translate3d(-30%, -50%, 0);
    transform: translate3d(-30%, -50%, 0);
}

/* ----- wind energy lineup ----- */

.wind-energy.lineup .conbox:nth-child(2) {
    padding-bottom: 11em;
}

.wind-energy.lineup .fixbg {
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    height: 700px;
}

.wind-energy.lineup .img-borderbox {
    margin-top: 10em;
}

.wind-energy.lineup .tbstyle02 table td {
    padding: 1.133em 0.8em;
}

/* ----- wind energy results ----- */

.wind-energy.results .flex-box ul {
    display: flex;
    margin-bottom: 9em;
}

.wind-energy.results .flex-box ul li {
    margin-left: 13em;
}

.wind-energy.results .flex-box ul li:first-child {
    margin-left: 0;
}

.wind-energy.results .flex-box ul li:last-child strong {
    color: #005eb8;
}

.wind-energy.results .flex-box span {
    display: block;
    font-size: 2rem;
    color: #333;
}

.wind-energy.results .flex-box strong {
    display: block;
    padding: 0.208em 0;
    font-size: 4.8rem;
    color: #333;
}

.wind-energy.results .flex-box p {
    font-size: 1.8rem;
    color: #666666;
}

.wind-energy.results .mapwrap {
    margin: 0 auto;
    max-width: 971px;
}

.wind-energy.results .mapwrap .img {
    position: relative;
    padding-bottom: 120.186%;
    height: 0;
}

.wind-energy.results .mapwrap .img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.wind-energy.results .mapwrap .map-btn {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.wind-energy.results .mapwrap .map-btn a {
    position: absolute;
    left: 0;
    top: 0;
    padding: 0 1.429em;
    width: 8.929em;
    height: 2.5em;
    background: url(/images/ico/ico-search-sm.png) no-repeat 85% 58%;
    background-size: 14px;
    border: 1px solid #333;
    font-size: 1.4rem;
    line-height: 2.5em;
    text-align: left !important;
}

.wind-energy.results .mapwrap .map-btn a:hover {
    background: #333 url(/images/ico/ico-search-sm-white.png) no-repeat 85% 58%;
    background-size: 14px;
    color: #fff;
}

.wind-energy.results .mapwrap .map-btn a:nth-child(1) {
    left: 0.24%;
    top: 56.69%;
}

.wind-energy.results .mapwrap .map-btn a:nth-child(2) {
    left: 0.24%;
    top: 87.5%;
}

.wind-energy.results .tbstyle04 {
    border-top: 1px solid #000;
}

.wind-energy.results .tbstyle04 table {
    table-layout: fixed;
    border-top: none;
}

/* ----- overview strategy ----- */

.overview .sub-depth-nav-wrap {
    margin-top: 11em;
}

.overview-strategy .mapimg {
    position: relative;
    margin: 0 auto;
    margin-top: 11em;
    padding-bottom: 42.329%;
    max-width: 1398px;
    width: 100%;
    height: 0;
    background: url(/images/sub/management/overview-strategy-img01.png) no-repeat center;
    background-size: cover;
}

.overview-strategy .mapimg .step-st01 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
}

.overview-strategy .mapimg .step-st01>li {
    margin-top: -20%;
    padding-bottom: 23.105%;
    width: 23.105%;
}

.overview-strategy .mapimg .step-st01>li .line-circle {
    background: none;
    border: 1px dashed #33ba05;
}

.overview-strategy .mapimg .step-st01>li .line-circle:after {
    content: '';
    position: absolute;
    left: 3.5%;
    top: 70%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #33ba05;
}

.overview-strategy .mapimg .step-st01>li:nth-child(1) .line-circle:after {
    margin-top: -4px;
    left: 50%;
    top: 0;
}

.overview-strategy .mapimg .step-st01>li:nth-child(2) .line-circle:after {
    left: auto;
    right: 3.5%;
    top: 73%;
}

/* ----- overview esg ----- */

.overview-esg .cont-tit+div {
    margin-top: 7em;
}

.overview-esg .esg-chart {
    max-width: 1180px;
    margin: 11em auto 0;
}

.overview-esg .esg-chart .esg-chart-top {
    position: relative;
    display: inline-flex;
    width: 30%;
    justify-content: center;
    align-items: center;
    background: #395ba4;
    font-size: 1.4rem;
    line-height: 2.5;
}

.overview-esg .esg-chart .esg-chart-top>span {
    color: #fff;
    background: #395ba4;
    z-index: 1;
}

.overview-esg .esg-chart .esg-chart-top:before {
    content: "";
    position: absolute;
    top: 0;
    width: 1px;
    height: 400%;
    background: #ababab;
}

.overview-esg .esg-chart .esg-chart-mid {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    padding-top: 20px;
}

.overview-esg .esg-chart .esg-chart-mid:before {
    content: "";
    position: absolute;
    top: 10px;
    width: 100%;
    height: 1px;
    background: #ababab;
}

.overview-esg .esg-chart .esg-chart-mid>div {
    width: 30%;
    position: relative;
    display: flex;
    flex-direction: column;
    align-self: stretch;
}

.overview-esg .esg-chart .esg-chart-mid .title {
    margin-bottom: 10px;
}

.overview-esg .esg-chart .esg-chart-mid .title>span {
    display: block;
    position: relative;
    border-width: 2px;
    border-style: solid;
    font-size: 1.4rem;
    line-height: 2.2;
    border-radius: 30px;
    background: #fff;
    font-weight: 500;
    z-index: 1;
}

.overview-esg .esg-chart .esg-chart-mid .left .title:before,
.overview-esg .esg-chart .esg-chart-mid .right .title:before {
    content: "";
    position: absolute;
    top: -10px;
    width: 50%;
    height: 100%;
    background: #fff;
}

.overview-esg .esg-chart .esg-chart-mid .left .title:before {
    left: 0;
    border-right: 1px solid #ababab;
}

.overview-esg .esg-chart .esg-chart-mid .right .title:before {
    right: 0;
    border-left: 1px solid #ababab;
}

.overview-esg .esg-chart .esg-chart-mid .left .title>span {
    color: #4f9983;
    border-color: #4f9983;
}

.overview-esg .esg-chart .esg-chart-mid .middle .title>span {
    color: #dba54d;
    border-color: #dba54d;
}

.overview-esg .esg-chart .esg-chart-mid .right .title>span {
    color: #5a9be2;
    border-color: #5a9be2;
}

.overview-esg .esg-chart .esg-chart-mid .list {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    padding: 0 4.6%;
    align-items: center;
    border: 1px solid #aaa;
    background: #fff;
}

.overview-esg .esg-chart .esg-chart-mid .list>ul {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
}

.overview-esg .esg-chart .esg-chart-mid .list>ul>li {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.overview-esg .esg-chart .esg-chart-mid .left .list>ul>li:not(:last-child):before,
.overview-esg .esg-chart .esg-chart-mid .middle .list>ul>li:nth-child(odd):not(:nth-last-child(2)):not(:last-child):before,
.overview-esg .esg-chart .esg-chart-mid .right .list>ul>li:nth-child(odd):not(:nth-last-child(2)):not(:last-child):before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    border-bottom: 1px dashed #aaa;
}

.overview-esg .esg-chart .esg-chart-mid .left .list>ul>li:before {
    width: 100%;
}

.overview-esg .esg-chart .esg-chart-mid .middle .list>ul>li:nth-child(odd):before,
.overview-esg .esg-chart .esg-chart-mid .right .list>ul>li:nth-child(odd):before {
    width: 200%;
}

.overview-esg .esg-chart .esg-chart-mid .list>ul>li>span {
    display: inline-flex;
    padding: 10px 0;
    justify-content: center;
    align-items: center;
    font-size: 1.4rem;
    font-weight: 500;
    color: #848382;
}

.overview-esg .esg-chart .esg-chart-mid .left .list>ul>li {
    width: 100%;
}

.overview-esg .esg-chart .esg-chart-mid .middle .list>ul>li,
.overview-esg .esg-chart .esg-chart-mid .right .list>ul>li {
    width: 50%;
}

.overview-esg .esg-chart .esg-chart-mid .middle .list>ul>li:nth-child(odd):after,
.overview-esg .esg-chart .esg-chart-mid .right .list>ul>li:nth-child(odd):after {
    content: "";
    position: absolute;
    height: 50%;
    right: -0.5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-right: 1px dashed #aaa;
}

.overview-esg .esg-chart .esg-chart-bottom {
    position: relative;
    margin-top: 7px;
}

.overview-esg .esg-chart .esg-chart-bottom:before {
    content: "";
    position: absolute;
    top: 10px;
    width: 1px;
    height: 60%;
    background: #ababab;
}

.overview-esg .esg-chart .esg-chart-bottom .title {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    padding-top: 2px;
}

.overview-esg .esg-chart .esg-chart-bottom .title:before {
    content: "";
    position: absolute;
    bottom: -7.5px;
    width: 100%;
    height: 1px;
    background: #ababab;
}

.overview-esg .esg-chart .esg-chart-bottom .title>div {
    content: "";
    position: absolute;
    width: 100%;
    height: 3px;
    background: #efefef;
}

.overview-esg .esg-chart .esg-chart-bottom .title>div:before,
.overview-esg .esg-chart .esg-chart-bottom .title>div:after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 3px;
    padding-top: 15px;
    background: #efefef;
}

.overview-esg .esg-chart .esg-chart-bottom .title>div:before {
    left: 0;
}

.overview-esg .esg-chart .esg-chart-bottom .title>div:after {
    right: 0;
}

.overview-esg .esg-chart .esg-chart-bottom .title>span {
    padding: 0 15px;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.58;
    color: #7f8792;
    background: #fff;
    z-index: 2;
}

.overview-esg .esg-chart .esg-chart-bottom .list {
    display: flex;
    position: relative;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
}

.overview-esg .esg-chart .esg-chart-bottom .list>li {
    position: relative;
    width: 30%;
}

.overview-esg .esg-chart .esg-chart-bottom .list>li:first-child:before,
.overview-esg .esg-chart .esg-chart-bottom .list>li:last-child:before {
    content: "";
    position: absolute;
    top: -10px;
    width: 50%;
    height: 100%;
    background: #fff;
}

.overview-esg .esg-chart .esg-chart-bottom .list>li:first-child:before {
    left: 0;
    border-right: 1px solid #ababab;
}

.overview-esg .esg-chart .esg-chart-bottom .list>li:last-child:before {
    right: 0;
    border-left: 1px solid #ababab;
}

.overview-esg .esg-chart .esg-chart-bottom .list>li>span {
    display: block;
    position: relative;
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 2.5;
    color: #757e87;
    background: #eaecee;
    z-index: 2;
}

/* ----- overview result ----- */

.overview-result .sec01,
.overview-result .sec03 {
    padding-top: 11em;
    text-align: center;
}

.overview-result .reportbox {
    padding: 10em 0;
    margin-top: 60px;
    background: #fafafa;
}

.overview-result .reportbox .maxinner {
    max-width: 1100px;
}

.overview-result .reportbox .halfbox {
    justify-content: space-between;
    text-align: left;
}

.overview-result .reportbox .halfbox .left {
    width: 46%;
    padding-right: 0;
}

.overview-result .reportbox .halfbox .left>div {
    max-width: 400px;
    float: right;
}

.overview-result .reportbox .halfbox .left a {
    display: block;
}

.overview-result .reportbox .halfbox .left img {
    padding: 1.8em;
    background: #fff;
    border: 1px solid #dcdcdc;
}

.overview-result .reportbox .halfbox .right {
    width: 46%;
    margin-top: 0;
}

.overview-result .reportbox .halfbox .right .btn-link {
    min-width: 320px;
    background: #fff;
    font-size: 1.8rem;
    font-weight: 600;
}

.overview-result .reportbox .halfbox .right .btn-link:hover {
    background: #333;
    color: #fff;
}

.overview-result .sec02,
.overview-result .sec03 {
    padding-top: 11em;
}

.overview-result .external-list {
    display: flex;
    flex-wrap: wrap;
    margin-top: 6em;
    margin-left: -3%;
}

.overview-result .external-list li {
    margin-left: 3%;
    width: 30.3333%;
}

.overview-result .external-list li>div {
    padding: 0 3.5em;
}

.overview-result .external-list li .img {
    display: flex;
    align-items: center;
    height: 15em;
    border: 1px solid #333;
}

.overview-result .external-list li .txt {
    padding-top: 3em;
}

.overview-result .external-list li .txt p {
    font-size: 1.8rem;
    color: #333333;
    line-height: 1.444em;
    letter-spacing: -0.25px;
    font-weight: 700;
}

.overview-result .external-list li .txt span {
    display: block;
    margin-top: 2em;
    font-size: 1.5rem;
    color: #999999;
    line-height: 1.6em;
    letter-spacing: -0.017em;
    font-weight: 300;
}

.overview-result .file-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    padding-top: 6em;
}

.overview-result .file-list li {
    width: 33%;
}

.overview-result .file-list li .img {
    margin: 0 10%;
    padding: 1.8em 1.8em 3em;
    border: 1px solid #333;
}

.overview-result .file-list li .txt {
    padding-top: 1em;
    font-size: 2rem;
    color: #333333;
    line-height: 1.444em;
    letter-spacing: -0.25px;
    font-weight: 700;
}

/* ----- environment stragegy ----- */

.environment .sub-depth-nav-wrap {
    margin-top: 11em;
}

.environment-strategy {
    padding-bottom: 0 !important;
}

.environment-strategy .strategy-list {
    padding: 10em 0 18em;
    text-align: center;
    background: #fafafa;
    margin-top: 8em;
}

.environment-strategy .listbox-wrap {
    margin-left: -18em;
}

.environment-strategy .listbox {
    margin: 0 auto;
    max-width: 1180px;
    width: 100%;
    text-align: left;
    margin-top: -3em;
}

.environment-strategy .listbox>li {
    display: flex;
    align-items: center;
    margin-top: 3em;
}

.environment-strategy .listbox>li .tit {
    display: block;
    position: relative;
    padding-right: 85px;
    width: 220px;
    font-size: 2.6rem;
    color: #22b1ac;
    letter-spacing: -0.010em;
    font-weight: 700;
    text-align: right;
}

.environment-strategy .listbox>li .tit:after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -4.5px;
    margin-right: -4.5px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #22b1ac;
}

.environment-strategy .listbox>li .tit:before {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -0.5px;
    width: 35%;
    height: 1px;
    background: #22b1ac;
}

.environment-strategy .listbox>li .con {
    width: calc(100% - 220px);
}

.environment-strategy .listbox>li.list01 {
    position: relative;
}

.environment-strategy .listbox>li.list01:after {
    content: "";
    position: absolute;
    left: 220px;
    top: 50%;
    margin-top: -68.5px;
    width: calc(100% - 220px);
    height: 1px;
    background: #22b1ac;
}

.environment-strategy .listbox>li.list01 .tit {
    margin-bottom: 135px;
}

.environment-strategy .listbox>li.list01 .con {
    position: relative;
    padding-bottom: 135px;
    text-align: center;
}

.environment-strategy .listbox>li.list01 .con:before {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -71.5px;
    margin-right: -4.5px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #22b1ac;
}

.environment-strategy .listbox>li.list01 .con .titbox {
    display: inline-block;
    position: relative;
    z-index: 10;
    padding: 12em;
    background: #fff;
    border-radius: 6em;
    border: 1px dashed #33ba05;
}

.environment-strategy .listbox>li.list01 .con .titbox:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #33ba05;
    border-radius: 5em;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.environment-strategy .listbox>li.list01 .con .titbox h5 {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 1;
    width: 80%;
    font-size: 2rem;
    color: #fff;
    font-weight: 600;
    line-height: 1.350em;
    letter-spacing: -0.025em;
    text-transform: uppercase;
    text-align: center;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.environment-strategy .listbox>li.list01 .con .arrow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 135px;
}

.environment-strategy .listbox>li.list02 .con {
    background: #fff;
    border: 1px solid #33ba05;
    text-align: center;
    -webkit-box-shadow: 1px 1px 10px rgba(200, 200, 200, 0.3);
    box-shadow: 1px 1px 10px rgba(200, 200, 200, 0.3);
}

.environment-strategy .listbox>li.list02 p {
    padding: 1.944em 0;
    font-size: 1.8rem;
    color: #333333;
    line-height: 1.667em;
    font-weight: 300;
    letter-spacing: -0.014em;
}

.environment-strategy .listbox>li.list03 .con {
    padding: 4.5em 5em;
    background: #fff;
    -webkit-box-shadow: 1px 1px 10px rgba(200, 200, 200, 0.3);
    box-shadow: 1px 1px 10px rgba(200, 200, 200, 0.3);
}

.environment-strategy .listbox>li.list03 dl {
    display: flex;
    margin: 2em 0;
}

.environment-strategy .listbox>li.list03 dt {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.875em 0;
    min-width: 14.375em;
    background: #edf9e8;
    border: 2px dotted #33ba05;
    border-radius: 0.625em;
    font-size: 1.6rem;
    color: #333333;
    font-weight: 500;
    letter-spacing: -0.016em;
    line-height: 1.375em;
    text-align: center;
}

.environment-strategy .listbox>li.list03 dd {
    padding-left: 4em;
}

.environment-strategy .listbox>li.list03 dd li {
    position: relative;
    padding-left: 0.75em;
    font-size: 1.6rem;
    color: #333333;
    font-weight: 300;
    line-height: 1.875em;
    letter-spacing: -0.016em;
}

.environment-strategy .listbox>li.list03 dd li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 13px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #666;
}

.environment-strategy .listbox>li.list03 dd li>ul>li:after {
    width: 5px;
    height: 1px;
    top: 14px
}

.environment-strategy .activity {
    padding-top: 6%;
}

.environment-strategy .activity .title {
    margin: 12px 0;
}

.environment-strategy .activity .title>p {
    display: flex;
    position: relative;
    padding: 0 12px;
    justify-content: center;
    align-items: center;
    font-size: 1.8rem;
}

.environment-strategy .activity .title>p:before,
.environment-strategy .activity .title>p:after {
    content: "";
    position: absolute;
    width: 45%;
    height: 1px;
    background: #898989;
}

.environment-strategy .activity .title>p:before {
    left: 0;
}

.environment-strategy .activity .title>p:after {
    right: 0;
}

.environment-strategy .activity .list01 {
    padding: 15px 0;
    border: 10px solid #bbe2f2;
}

.environment-strategy .activity .list01>ul {
    display: flex;
    flex-wrap: wrap;
}

.environment-strategy .activity .list01>ul>li {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: calc(100% / 5)
}

.environment-strategy .activity .list01>ul>li:not(:last-child):before {
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    border-right: 1px dashed #52bfe0;
}

.environment-strategy .activity .list01>ul>li>span {
    font-size: 1.8rem;
    line-height: 1.3;
    color: #333;
    padding: 0 10px;
}

.environment-strategy .activity .list02 {
    width: 100%;
    max-width: 1025px;
    margin: 20px auto 0;
    padding: 15px 10px 20px;
    background: #eef1f2;
}

.environment-strategy .activity .list02>table {
    width: 100%;
    border-collapse: collapse;
}

.environment-strategy .activity .list02>table th,
.environment-strategy .activity .list02>table td {
    padding: 0;
    font-size: 1.8rem;
    line-height: 1.3;
    color: #333;
}

.environment-strategy .activity .list02>table th {
    padding-bottom: 15px;
    color: #8b97b1;
}

.environment-strategy .activity .list02>table td {
    position: relative;
    color: #333;
    background: #fff;
    text-align: left;
}

.environment-strategy .activity .list02>table td:before,
.environment-strategy .activity .list02>table td:after {
    content: "";
    width: 10px;
    height: 100%;
    position: absolute;
    top: 0;
    background: #eef1f2;
}

.environment-strategy .activity .list02>table td:before {
    left: 0;
}

.environment-strategy .activity .list02>table td:after {
    right: 0;
}

.environment-strategy .activity .list02>table td>div {
    padding: 10px 10%;
}

.environment-strategy .activity .list02>table td>div>span {
    text-align: center;
    line-height: 1.5;
}

.environment-strategy .activity .list02>table td:first-child>div {
    display: flex;
    justify-content: center;
}

.environment-strategy .activity .list02>table td:last-child p {
    position: relative;
    padding-left: 30px;
    line-height: 1.5
}

.environment-strategy .activity .list02>table td:last-child p:before {
    content: "•";
    position: absolute;
    top: 6px;
    left: 10px;
    font-size: 12px;
}

.environment-strategy .activity .list02>table tr:not(:last-child) td>div:before {
    content: "";
    width: 80%;
    position: absolute;
    left: auto;
    right: auto;
    bottom: 0;
    border-bottom: 1px dashed #9a9a9a;
}

/* ----- environment change ----- */

.environment-change .sec01 {
    margin-top: 8em;
    padding: 10em 0 18em;
    background: #fafafa;
    text-align: center;
}

.environment-change .sec01 h5 {
    margin-bottom: 1.364em;
    font-size: 2.2rem;
    color: #333333;
    letter-spacing: -0.25px;
}

/* ----- environment pollution ----- */

.environment-pollution {
    padding-bottom: 0 !important;
}

.environment-pollution .sec01 {
    padding: 10em 0 18em;
    text-align: center;
}

.environment-pollution .sec01 .maxinner {
    max-width: 1220px;
}

.environment-pollution .active-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: -7em;
    margin-left: -3%;
}

.environment-pollution .active-list>li {
    margin-top: 9em;
    width: 30.3333%;
    border: 1px dashed #22b1ac;
    border-radius: 0 0 2em 2em;
    background: #fff;
}

.environment-pollution .active-list>li {
    margin-left: 3%;
}

.environment-pollution .active-list>li:nth-child(4),
.environment-pollution .active-list>li:nth-child(5) {
    width: 47%;
}

.environment-pollution .active-list>li>strong {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: -1.667em;
    height: 3.333em;
    padding: 0 0.5em;
    background: #fff;
    border: 1px solid #22b1ac;
    border-radius: 2.778em;
    font-size: 1.8rem;
    color: #333;
    font-weight: 600;
    letter-spacing: -0.014em;
    text-align: center;
}

.environment-pollution .active-list>li>strong img {
    margin-right: 1em;
}

.environment-pollution .active-list>li ul {
    padding: 0 2em 2em;
}

.environment-pollution .active-list>li ul li {
    padding: 0.75em;
    margin-top: 0.625em;
    border-radius: 0.313em;
    background: #eef7e9;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.875em;
    text-align: center;
}

.environment-pollution .active-list>li ul li:first-child {
    margin-top: 0;
}

/* ----- environment -green ----- */

.environment-green .maxinner {
    max-width: 1475px;
}

.environment-green .summary {
    display: inline-block;
    margin-top: 7.143em;
}

.environment-green .sub-sm-tit h3 .f-color {
    display: inline-block;
    margin-top: -5px;
    vertical-align: top;
}

/* ----- environment result ----- */

.environment-result {
    padding-top: 11em;
}

.environment-result .result-list {
    display: flex;
    flex-wrap: wrap;
    margin-top: -7em;
    margin-left: -3%;
}

.environment-result .result-list .item {
    margin-top: 8em;
    margin-left: 3%;
    width: 30.3333%;
    text-align: left;
}

.environment-result .result-list .item .tit-box {
    position: relative;
    padding: 5em 4.5em;
    height: 24.5em;
    border: 1px solid #e5e5e5;
    border-top: 2px solid #22b1ac;
}

.environment-result .result-list .item .tit-box .tit {
    font-size: 2.4rem;
    color: #333333;
    line-height: 1.25em;
    letter-spacing: -0.01em;
    font-weight: 600;
}

.environment-result .result-list .item .tit-box img {
    position: absolute;
    right: 3.5em;
    bottom: 3.5em;
}

.environment-result .result-list .item ul {
    padding: 3em 1.5em;
}

.environment-result .result-list .item ul li {
    position: relative;
    padding-left: 0.882em;
    margin: 0.353em 0;
    font-size: 1.7rem;
    color: #333;
    line-height: 1.647em;
    font-weight: 300;
    letter-spacing: -0.015em;
}

.environment-result .result-list .item ul li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 12px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #22b1ac;
}

.environment-result .normal-txt {
    font-size: 1.4rem;
}

/* ----- greeting ----- */

.greeting .greeting-tit h3 {
    padding: 3.833em 0 3.333em;
    font-size: 3rem;
    color: #333333;
    line-height: 1.5em;
    letter-spacing: -0.008em;
    font-weight: 600;
    text-align: center;
}

.greeting .greeting-message {
    position: relative;
    padding: 9em 0 21em;
}

.greeting .greeting-message:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    width: 35%;
    height: 100%;
    background: #f4f4f4;
}

.greeting .greeting-message .maxinner {
    display: flex;
    justify-content: space-between;
}

.greeting .greeting-message .maxinner>* {
    padding-left: 55px;
    width: 50%;
}

.greeting .greeting-message .txtbox>strong {
    display: block;
    margin: 0.833em 0 1.667em;
    font-size: 2.4rem;
    color: #333333;
    line-height: 1.5em;
    font-weight: 600;
    letter-spacing: -0.010em;
}

.greeting .greeting-message .txtbox>p {
    font-size: 1.7rem;
    color: #666666;
    line-height: 1.765em;
    letter-spacing: -0.015em;
    font-weight: 300;
}

.greeting .greeting-message .txtbox .ceo-name {
    padding-top: 8.5em;
}

.greeting .greeting-message .txtbox .ceo-name span {
    display: inline-block;
    font-size: 1.8rem;
    color: #111111;
    font-weight: 700;
    line-height: 1.444em;
    letter-spacing: -0.014em;
    vertical-align: middle;
}

.greeting .greeting-message .txtbox .ceo-name strong {
    display: inline-block;
    margin-left: 0.417em;
    font-size: 2.4rem;
    color: #111111;
    font-weight: 700;
    line-height: 1.083em;
    letter-spacing: -0.010em;
    vertical-align: middle;
}

/* ----- ci ----- */

.ci .line-imgbox>div:after {
    left: auto;
    right: 0;
}

.ci .maxinner>.halfbox:first-child {
    border-top: 1px solid #ddd;
}

.ci .logobox {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 80px 100px;
    border: 1px solid #e5e5e5;
    background: url(/upload/images/sub/ci-grid.png) no-repeat center;
    background-size: cover;
}

.ci .btnwrap {
    margin-top: 5em;
}

.ci .btnset {
    margin-right: 5px;
    min-width: 260px;
    text-align: left !important;
}

.ci .logobox2 {
    margin-top: 5em;
}

.ci .ci-palette {
    margin-top: 8em;
}

.ci .ci-space {
    margin-top: 8em;
}

.ci .ci-type {
    margin-top: 8em;
}

.ci dl dt {
    font-size: 1.9rem;
    font-weight: 700;
}

.ci dl dd {
    margin-top: 2em;
}

.ci dl dt strong {
    display: block;
    font-size: 2.2rem;
}

.ci .color-box01:after {
    content: "";
    display: block;
    clear: both;
}

.ci .color-box01 dl {
    float: left;
    width: 65%;
}

.ci .color-box01 dl dt {
    padding-bottom: 0.5em;
    font-weight: 500;
    line-height: 1.6;
}

.ci .color-box01 .img {
    float: right;
    width: 33%;
    text-align: right;
}

.ci .color-box02 {
    margin-top: 8em;
}

.ci .color-box02 dd:last-child {
    margin-top: 4em;
}

.ci .clearspace .img {
    padding: 7em 0 4em;
}

.ci .clearspace .img:nth-of-type(2) {
    margin-left: -7%;
}

/* ----- tech innovation ----- */

.innovation .maxinner>.halfbox:first-child {
    border-top: 1px solid #ddd;
}

.innovation .halfbox .left .btnwrap {
    margin-top: 2em;
}

.innovation .inno-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: -5%;
    margin-top: -9.5em;
}

.innovation .inno-list li {
    margin-top: 9.5em;
    margin-left: 5%;
    max-width: 430px;
    width: 45%;
}

.innovation .inno-list li>h5 {
    margin: 1.818em 0 0.909em;
    font-size: 2.2rem;
    color: #333;
    line-height: 1.364em;
    letter-spacing: -0.011em;
    font-weight: 700;
}

.innovation .inno-list li>p {
    min-height: 8.750em;
    font-size: 1.6rem;
    color: #666666;
    line-height: 1.625em;
    letter-spacing: -0.016em;
}

.innovation .inno-list li>div {
    margin-top: 1.5em;
}

.innovation .btnset {
    margin-right: 5px;
    min-width: 280px;
    text-align: left !important;
}

.innovation .inno-list li:nth-child(3) .btnset {
    min-width: 325px;
}

/* ----- quality manage ----- */

.quality .maxinner>.halfbox:first-child {
    border-top: 1px solid #ddd;
}

.quality .con-sm-tit {
    margin: 2.5em 0 1.5em;
}

.quality .tbstyle01 table td {
    padding: 0.625em 0;
    border-bottom: none;
}

.quality .tbstyle01 table tr:first-child td {
    padding-top: 2.5em;
}

.quality .tbstyle01 table tr:last-child td {
    padding-bottom: 2.5em;
    border-bottom: 1px solid #ddd;
}

.quality .tbstyle01 table th {
    border-left: none;
}

.quality .btnwrap {
    margin-top: 5em;
}

/* ----- certification ----- */

.certification {
    padding-bottom: 18em;
}

.certification .tbstyle02 table td {
    padding: 1.133em;
}

/* ----- governance ----- */

.governance .halfbox .left {
    width: 30%;
}

.governance .halfbox .right {
    width: 70%;
}

.governance .btnset {
    min-width: 235px;
}

.governance .btnset.small {
    min-width: auto;
}

.governance.stock .normal-sm-txt {
    position: relative;
}

.governance.stock .normal-sm-txt span {
    position: absolute;
    right: 0;
    top: 0;
}

.governance.stock .btnwrap {
    margin-top: 5em;
}

.governance.director .normal-sm-txt span {
    position: absolute;
    right: 0;
    top: 0;
}

.governance.director .list-st01 {
    margin-top: 0;
}

.governance.director .list-st01 li {
    padding-left: 0.833em;
    font-size: 1.8rem;
    color: #333333;
    line-height: 1.889em;
}

.governance.director .list-st01 li:after {
    top: 0.889em;
    width: 7px;
}

.governance.director .btnwrap {
    margin-top: 3em;
}

/* ----- IR 주가정보 ----- */

.ir.stock .halfbox .right {
    margin-top: -40px;
}

/* ----- contact us ----- */

.st-inp {
    padding: 0 1.111em;
    width: 100%;
    height: 3em;
    border-radius: 0;
    border: 1px solid #ddd;
    font-size: 1.8rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.st-inp::placeholder {
    color: #b2b2b2;
}

.st-inp::-ms-clear {
    display: none;
}

.st-inp::-webkit-inner-spin-button,
.st-inp::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.st-select {
    padding: 0 1.75em 0 1.111em;
    width: 100%;
    height: 3em;
    border-radius: 0;
    border: 1px solid #ddd;
    background: url(/images/bu/bu-select.png) no-repeat 95% center;
    font-size: 1.8rem;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.st-select::-ms-expand {
    display: none;
}

.st-select.line {
    padding: 0 1.75em 0 0.5em;
    margin-bottom: 50px;
    max-width: 225px;
    border: none;
    border-bottom: 2px solid #333;
    font-size: 2rem;
    font-weight: 500;
    color: #000;
}

select option:hover {
    background: #333;
    color: #fff;
}

select option:checked {
    background: #333;
    color: #fff;
}

.st-select option:hover {
    background: #333;
    color: #fff;
}

.st-select option:checked {
    background: #333;
    color: #fff;
}

.st-textarea {
    padding: 1.111em;
    width: 100%;
    min-height: 230px;
    border: 1px solid #ddd;
    font-size: 1.8rem;
}

.pribox {
    padding-top: 4em;
}

.pribox h5 {
    margin-bottom: 1em;
    font-size: 2.2rem;
    color: #333333;
    letter-spacing: -0.011em;
    font-weight: 700;
}

.pribox .pricon {
    overflow-y: scroll;
    padding: 4em;
    height: 23.5em;
    background: #fafafa;
}

.pribox .pricon h4 {
    font-size: 2rem;
    color: #333333;
    font-weight: 600;
    letter-spacing: -0.013em;
}

.pribox .pricon p {
    margin-top: 1.333em;
    font-size: 1.5rem;
    color: #999999;
    font-weight: 300;
    line-height: 1.733em;
    letter-spacing: -0.017em;
}

.pribox .pricon dl {
    margin-top: 3em;
}

.pribox .pricon dt {
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.875em;
    letter-spacing: -0.016em;
}

.pribox .pricon dd {
    font-size: 1.5rem;
    color: #999999;
    line-height: 1.733em;
    letter-spacing: -0.017em;
    font-weibht: 300;
}

.pribox .pricon dd>ul>li {
    position: relative;
    padding-left: 12px;
}

.pribox .pricon dd>ul>li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 12px;
    width: 8px;
    height: 1px;
    background: #999;
}

.pribox .seccon {
    padding: 4em;
    background: #fafafa;
}

.pribox .seccon p {
    font-size: 1.5rem;
    color: #999999;
    font-weight: 300;
    line-height: 1.733em;
    letter-spacing: -0.017em;
}

.pribtn {
    display: flex;
    justify-content: space-between;
    padding: 2em 0;
    margin-bottom: 7em;
}

.pribtn p {
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.625em;
    letter-spacing: -0.016em;
    font-weight: 300;
}

.pribtn label {
    display: inline-block;
    position: relative;
    padding-left: 1.875em;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.625em;
    letter-spacing: -0.016em;
    font-weibht: 300;
    cursor: pointer;
}

.pribtn label:after {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    width: 16px;
    height: 16px;
    border: 1px solid #666666;
}

.pribtn label:before {
    content: "\e929";
    position: absolute;
    left: 0;
    top: 4px;
    z-index: 10;
    width: 16px;
    height: 16px;
    font-family: 'xeicon', sans-serif;
    color: #fff;
    line-height: 16px;
}

.pribtn input[type="checkbox"] {
    display: none;
}

.pribtn input[type="checkbox"]:checked+label:after {
    border-color: #22b1ac;
    background: #22b1ac;
}

.req-txt {
    width: 100%;
    font-size: 1.5rem;
    color: #808080;
    letter-spacing: -0.017em;
    text-align: right;
}

.req-txt span {
    margin-right: 5px;
}

.form-list {
    padding: 3em 0 3em;
}

.form-wrap {
    margin: 0 auto;
    max-width: 108em;
    width: 100%;
}

.form-wrap .formbox-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.form-wrap .formbox-wrap .formbox {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 15px 0;
    width: 100%;
}

.form-wrap .formbox-wrap .formbox.half {
    width: 47%;
}

.form-wrap .formbox-wrap .formbox .left {
    padding: 0.875em 0 0;
    width: 132px;
    font-size: 1.6rem;
    color: #333333;
    font-weight: 500;
    letter-spacing: -0.016em;
}

.form-wrap .formbox-wrap .formbox .left span.f-color {
    display: inline-block;
    margin-left: 2px;
    margin-top: -5px;
    vertical-align: top;
}

.form-wrap .formbox-wrap .formbox .right {
    width: calc(100% - 110px);
}

.form-wrap .formbox-wrap .formbox .st-select {
    border: none;
    background-color: #fafafa;
    font-size: 1.6rem;
    color: #333;
    font-weight: 300;
}

.contactus .form-wrap .formbox-wrap .formbox .st-select+.st-select {
    margin-top: 10px;
}

.contactus .form-wrap .formbox-wrap .formbox .st-select+.st-inp {
    margin-top: 10px;
}

.form-wrap .formbox-wrap .formbox .st-inp {
    border: none;
    background-color: #fafafa;
    font-size: 1.6rem;
    color: #333;
    font-weight: 300;
}

.form-wrap .formbox-wrap .formbox .st-textarea {
    border: none;
    background-color: #fafafa;
    font-size: 1.6rem;
    color: #333;
    font-weight: 300;
}

.form-wrap .formbox-wrap .formbox .filebox {
    position: relative;
    max-width: 537.59px;
    width: 55.423%;
    padding-right: 140px;
}

.form-wrap .formbox-wrap .formbox .filebox button {
    position: absolute;
    right: 0;
    top: 0;
    width: 140px;
    height: 100%;
    background: none;
    border: 1px solid #333;
    font-size: 1.6rem;
    color: #333;
    letter-spacing: -0.25px;
}

.form-wrap .formbox-wrap .formbox .filebox button:hover {
    background: #333;
    color: #fff;
}

.form-wrap .formbox-wrap .formbox .filebox span {
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 1.111em;
    width: 100%;
    height: 3em;
    background-color: #fafafa;
    font-size: 1.6rem;
    color: #b2b2b2;
    line-height: 3em;
}

.form-wrap .form-sm-txt {
    margin-top: 1.286em;
    font-size: 1.4rem;
    color: #333;
    font-weight: 300;
}

.form-wrap .btnwrap a {
    margin-right: 10px;
}

.form-wrap .btnwrap .btn-type01 {
    min-width: 8.889em;
}

.form-wrap .btnwrap .btn-type01 {
    min-width: 8.889em;
}

.form-wrap .btnwrap .btn-type01.black:hover {
    background: #22b1ac;
    border-color: #22b1ac;
}

.form-wrap .btnwrap .btn-type01.white:hover {
    background: #333333;
    border-color: #333333;
    color: #fff;
}

.contactus .btnwrap {
    padding-top: 7em;
    border-top: 1px solid #dcdcdc;
    text-align: center;
}

.contactus .sub-depth-nav li a {
    padding: 0 2.5em;
}

/* ----- contact us index ----- */

.contact-list .space {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: -6em;
}

.contact-list .contact-list-box {
    margin-top: 6em;
    width: 48%;
}

.contact-list .contact-list-box h3 {
    margin-bottom: 1.406em;
    font-size: 3.2rem;
    color: #333;
    letter-spacing: -0.008em;
}

.contact-list .contact-list-box ul {
    margin-top: 2.5em;
}

.contact-list .contact-list-box ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1em 0;
    border-top: 1px solid #dcdcdc;
}

.contact-list .contact-list-box ul li:first-child {
    border-top: none;
}

.contact-list .contact-list-box ul li span {
    display: block;
    padding: .5em 0;
    padding-right: 2.353em;
    font-size: 1.7rem;
    color: #666;
    line-height: 1.529em;
    letter-spacing: -0.024em;
    font-weight: 300;
}

.contact-list .contact-list-box ul li .btn-link {
    min-width: 250px;
}

.contact-list .contact-list-box .incon {
    padding: 6em 5em;
    min-height: 36.5em;
    border: 1px solid #dcdcdc;
}

.contact-list .contact-list-box .incon ul {
    margin-top: 0;
}

.contact-list .contact-list-box .incon ul li span {
    font-size: 1.8rem;
}

.contact-list .contact-list-box.three-row h3 {
    margin-bottom: 0.5em;
}

.contact-list .contact-list-box.three-row ul li {
    padding: 0.4em 0;
}

/* ----- 약관 공통 ----- */

.terms dd {
    padding-top: 1em;
    font-size: 1.6rem;
    color: #333;
    line-height: 1.750em;
    font-weight: 300;
}

.terms dd .link-underline {
    color: #22b1ac;
}

.terms dd .link-underline:hover {
    text-decoration: underline;
}

.terms dd:nth-child(2) {
    padding-top: 0;
}

.terms dd p {
    padding-top: 1em;
}

.terms dd .dd-con {
    padding-top: 1em;
}

.terms dd .p-left {
    padding-left: 1em;
}

.terms dd ul li {
    position: relative;
    margin-left: 1em;
    font-size: 1.6rem;
    color: #333;
    font-weight: 300;
    line-height: 2.6rem;
}

.terms dd ul li:before {
    content: '-';
    position: absolute;
    margin-left: -1em;
    font-size: 1.5rem;
    color: #333;
    font-weight: 300;
}

.terms .tbstyle02 {
    margin-top: 1em;
}

.terms .tbstyle02 table thead th {
    padding: 1em 0;
    font-size: 1.6rem;
}

.terms .tbstyle02 table thead td {
    padding: 0.5em 0.3em;
    font-size: 1.5rem;
}

/** 이용약관 **/

.terms .maxinner {
    max-width: 1260px;
}

.terms .titbox .tit {
    font-size: 4rem;
    text-align: center;
    margin-bottom: 2em;
}

.terms .titbox .normal-txt {
    padding: 2em 3em;
    background: #fafafa;
    text-align: left;
    font-size: 1.6rem;
}

.terms .terms-list dl {
    margin-top: 7em;
}

.terms .terms-list dl:first-child {
    padding-top: 10em;
    border-top: 1px solid #dcdcdc;
}

.terms .terms-list dl dt {
    margin-bottom: 1em;
    font-size: 2.4rem;
    color: #000;
    font-weight: 600;
}

/** 개인정보처리방침 **/

.terms-listbtn {
    margin: 5em 0 0;
    text-align: right;
}

.terms-listbtn .terms-list-date {
    display: inline-block;
    position: relative;
}

.terms-listbtn .terms-list-date strong {
    position: absolute;
    right: 100%;
    top: 50%;
    margin-right: 1em;
    width: 100%;
    font-size: 2rem;
    vertical-align: middle;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.terms-listbtn .terms-list-date span {
    display: inline-block;
    padding: 0 1.75em 0 0.5em;
    min-width: 225px;
    margin: 0;
    width: 100%;
    height: 3em;
    border: none;
    border-bottom: 2px solid #333;
    background: url(/images/bu/bu-select.png) no-repeat 95% center;
    font-size: 2rem;
    font-weight: 500;
    line-height: 3em;
    cursor: pointer;
    text-align: left;
    vertical-align: middle;
}

.terms-listbtn ul {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 10;
    width: 100%;
    background: #fff;
    border: 1px solid #333;
    text-align: left;
}

.terms-listbtn ul li {
    margin: 0 !important;
}

.terms-listbtn ul li:before {
    display: none;
}

.terms-listbtn ul li a {
    display: block;
    padding: 7px 10px;
    font-size: 1.8rem;
}

.terms-listbtn ul li.on a {
    background: #333;
    color: #fff;
}

.terms-listbtn ul li a:hover {
    background: #1e90ff;
    color: #fff;
}

.term-conbox {
    display: none;
}

.term-conbox.on {
    display: block;
}

.maxinner .sub-titbox {
    text-align: center;
    margin: 5em 0 0;
}

/* ----- board wrap ----- */

.board-wrap .line-imgbox>div:after {
    left: auto;
    right: 0;
}

.board-wrap .board-info2 {
    padding: 1.5em 0;
    margin-bottom: 7.5em;
    background: #fafafa;
    text-align: center;
}

.board-wrap .board-info2 .st-select {
    min-width: 170px;
    width: auto;
    border: none;
    font-size: 1.6rem;
    color: #333333;
}

.board-wrap .board-info2 .st-inp {
    min-width: 360px;
    width: auto;
    background: none;
    border: none;
    font-size: 1.6rem;
    font-weight: 300;
}

.board-wrap .board-info2 .board-search fieldset {
    display: flex;
    justify-content: center;
    align-items: center;
}

.board-wrap .board-info2 .board-search fieldset .searchbox {
    overflow: hidden;
    position: relative;
}

.board-wrap .board-info2 .board-search fieldset .searchbox .btnset {
    position: absolute;
    right: 0;
    top: 0;
    width: 3em;
    height: 3em;
    background: url(/images/ico/ico-search-black.png) no-repeat center;
    font-size: 1.6rem;
    line-height: 0;
    text-indent: -9999px;
}

.board-wrap .board-list-wrap .space {
    padding-top: 10em;
}

.board-wrap .board-list-wrap .board-info2 {
    margin: 10em 0;
}

.board-wrap .titbox {
    text-align: center;
    margin-top: 10em;
}

.board-wrap .titbox .tit {
    font-size: 4rem;
    color: #333333;
}

.board-wrap .board-total {
    font-size: 1.8rem;
    color: #666666;
    letter-spacing: -0.014em;
    font-weight: 300;
}

.board-wrap .board-total span {
    margin-left: 5px;
    color: #22b1ac;
    font-weight: 500;
}

.board-wrap .board-recent {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6em 0 0;
}

.board-wrap .board-recent>* {
    width: 48%;
}

.board-wrap .board-recent a {
    display: block;
}

.board-wrap .board-recent .imgbox a {
    position: relative;
    max-width: 684px;
    padding-bottom: 63.358%;
    height: 0;
}

.board-wrap .board-recent .imgbox a img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.board-wrap .board-recent .txtbox {
    padding-right: 5em;
}

.board-wrap .board-recent .txtbox h4 {
    display: -webkit-box;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 1.176em;
    height: 2.824em;
    font-size: 3.4rem;
    color: #333;
    line-height: 1.412em;
    letter-spacing: -0.007em;
    font-weight: 700;
    font-family: 'Noto Sans KR', sans-serif;
}

.board-wrap .board-recent .txtbox p {
    display: -webkit-box;
    word-wrap: break-word;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 3.333em;
    height: 5em;
    font-size: 1.8rem;
    color: #444;
    line-height: 1.667em;
    letter-spacing: -0.014em;
    font-family: 'Noto Sans KR', sans-serif;
}

.board-wrap .board-recent .txtbox span {
    font-size: 1.6rem;
    color: #a6a6a6;
    letter-spacing: -0.016em;
}

.board-wrap .board-recent .txtbox a:hover h4 {
    text-decoration: underline;
}

.board-wrap .board-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 10;
    padding: 4.5em 0 0;
    border-top: 2px solid #313131;
}

.board-wrap .board-info .board-search fieldset {
    display: flex;
    align-items: center;
}

.board-wrap .board-info .board-search fieldset .st-select {
    min-width: 10.625em;
    width: auto;
    height: 3.125em;
    font-size: 1.6rem;
    color: #333;
    font-weight: 300;
}

.board-wrap .board-info .board-search fieldset .searchbox {
    overflow: hidden;
    position: relative;
}

.board-wrap .board-info .board-search fieldset .searchbox .btnset {
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 50px;
    background: url(/images/ico/ico-search-green.png) no-repeat center;
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
}

.board-wrap .board-info .board-search fieldset .searchbox .st-inp {
    margin-left: 0.625em;
    min-width: 23.750em;
    width: auto;
    height: 3.125em;
    font-size: 1.6rem;
    color: #333;
}

.board-wrap .board-info .board-search fieldset .searchbox .st-inp::placeholder {
    color: #b2b2b2;
    font-weight: 300;
}

/* ----- board wrap - gallery list ----- */

.board-wrap .board-item-list {
    display: flex;
    flex-wrap: wrap;
    padding-top: 12em;
    margin-left: -1.8263%;
}

.board-wrap .board-item-list .item {
    overflow: hidden;
    margin-top: 4em;
    margin-left: 1.8263%;
    width: 31.507%;
}

.board-wrap .board-item-list .item a {
    display: block;
    position: relative;
}

.board-wrap .board-item-list .item .img {
    overflow: hidden;
    position: relative;
    padding-bottom: 64.35%;
    height: 0;
}

.board-wrap .board-item-list .item .img>img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -ms-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}

.board-wrap .board-item-list .item .txt {
    padding: 3em 0;
}

.board-wrap .board-item-list .item .txt h4 {
    display: -webkit-box;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 1.591em;
    min-height: 2.727em;
    height: 2.727em;
    font-size: 2.2rem;
    color: #333333;
    line-height: 1.364em;
    letter-spacing: -0.011em;
    font-weight: 500;
    font-family: 'Noto Sans KR', sans-serif;
    letter-spacing: -0.03em;
}

.board-wrap .board-item-list .item .txt span {
    font-size: 1.5rem;
    color: #a6a6a6;
    letter-spacing: -0.017em;
    font-weight: 300;
}

.board-wrap .board-item-list .item a:hover .img img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.board-wrap .board-item-list .item a:hover .img-none img {
    transform: none;
}

/* ----- board wrap - data list ----- */

.board-wrap .board-data-list .tbstyle03 {
    margin-top: 20px;
}

/* ----- advertisement ----- */

.advertisement .pop-wrap.pop03 .pop-conwrap {
    min-width: 450px;
}

.advertisement .space {
    padding-top: 10em;
}

.advertisement .cont-tit.ta-l {
    margin-bottom: 20px;
    text-align: left;
}

.advertisement .normal-txt {
    margin-bottom: 2.778em;
}

.advertisement .sub-btnwrap {
    padding-top: 10em;
}

.advertisement .ad-btnwrap {
    padding-top: 10px;
}

.advertisement .ad-btnwrap a {
    position: relative;
    padding-left: 20px;
    margin-left: 20px;
}

.advertisement .ad-btnwrap a:before {
    content: "";
    position: absolute;
    left: 0;
    top: 12px;
    width: 1px;
    height: 15px;
    background: #333;
}

.advertisement .ad-btnwrap a:first-child {
    padding-left: 0;
    margin-left: 0;
}

.advertisement .ad-btnwrap a:first-child:before {
    display: none;
}

.advertisement .media-list {
    display: flex;
    flex-wrap: wrap;
}

.advertisement .media-list li .img {
    position: relative;
    padding-bottom: 56%;
    height: 0;
}

.advertisement .media-list li .img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.advertisement .media-list li>strong {
    display: block;
    padding-top: 30px;
    font-size: 2rem;
    color: #333333;
    font-weight: 600;
    letter-spacing: -0.25px;
}

.advertisement .gallery-con {
    padding-top: 8em;
    border-top: 2px solid #313131;
}

.advertisement .gallery-con01 .media-list {
    margin-left: -2%;
}

.advertisement .gallery-con01 .media-list li {
    margin-left: 2%;
    width: 48%;
}

.advertisement .gallery-con02 {
    padding-top: 12em;
}

.advertisement .gallery-con02 .media-list {
    margin-left: -2%;
}

.advertisement .gallery-con02 .media-list li {
    margin-left: 2%;
    margin-bottom: 2%;
    width: 31.3333%;
}

.advertisement .gallery-con03 {
    padding-top: 12em;
}

.advertisement .gallery-con03 .media-list {
    margin-left: -2%;
}

.advertisement .gallery-con03 .media-list li .img {
    position: relative;
    padding-bottom: 133%;
    height: 0;
}

.advertisement .gallery-con03 .media-list li {
    margin-left: 2%;
    width: 23%;
}

/* ----- board wrap - view ----- */

.board-wrap .board-view {
    padding: 6em 0 0;
}

.board-wrap .board-view .board-info {
    padding: 6em 0;
    border-bottom: 1px solid #ddd;
}

.board-wrap .board-view .board-tit {
    width: 100%;
    text-align: center;
}

.board-wrap .board-view .board-tit h4 {
    margin-bottom: 0.833em;
    font-size: 3rem;
    color: #333333;
    line-height: 1.333em;
    letter-spacing: -0.008em;
    font-weight: 600;
    font-family: 'Noto Sans KR', sans-serif;
}

.board-wrap .board-view .board-tit span {
    display: block;
    font-size: 1.8rem;
    color: #666666;
    line-height: 1.667em;
    font-weight: 300;
    letter-spacing: -0.014em;
}

.board-wrap .board-view .board-con {
    padding: 7.5em 8.5em 0;
}

.board-wrap .board-view .board-con .board-conarea {
    font-size: 1.8rem;
    color: #666666;
    font-weight: 400;
    line-height: 1.667em;
    letter-spacing: -0.014em;
    text-align: center;
    font-family: 'Noto Sans KR', sans-serif;
}

.board-wrap .board-view .board-con .board-conarea p {
    text-align: left;
    font-family: 'Noto Sans KR', sans-serif;
}

.board-wrap .board-page {
    display: flex;
    justify-content: space-between;
    margin-top: 17em;
    padding: 3.2em 8em;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.board-wrap .board-page a {
    width: 45%;
}

.board-wrap .board-page a.prev {
    display: inline-block;
}

.board-wrap .board-page a.next {
    display: inline-block;
    text-align: right;
}

.board-wrap .board-page a p {
    display: -webkit-box;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 1em;
    height3.750em;
    font-size: 1.6rem;
    color: #1a1a1a;
    line-height: 1.875em;
    letter-spacing: -0.016em;
    font-weight: 600;
}

.board-wrap .board-page a.none {
    opacity: 0.6;
}

.board-wrap .board-page a span {
    display: inline-block;
    position: relative;
    font-size: 1.6rem;
    color: #22b1ac;
    font-weight: 600;
    letter-spacing: -0.016em;
}

.board-wrap .board-page a.prev span {
    padding-left: 18px;
}

.board-wrap .board-page a.prev span:after {
    content: "\e93c";
    position: absolute;
    left: -5px;
    top: 0;
    font-size: 2rem;
    color: #22b1ac;
    font-family: 'xeicon', sans-serif;
    vertical-align: top;
}

.board-wrap .board-page a.next span {
    padding-right: 18px;
}

.board-wrap .board-page a.next span:after {
    content: "\e93f";
    position: absolute;
    right: -5px;
    top: 0;
    font-size: 2rem;
    color: #22b1ac;
    font-family: 'xeicon', sans-serif;
    vertical-align: top;
}

.board-wrap .board-page a:hover p {
    text-decoration: underline;
}

.board-wrap .board-btnwrap {
    margin-top: 7.5em;
    text-align: center;
}

/* ----- pg wrap ----- */

.pg_wrap {
    padding: 8em 0 0;
    text-align: center;
}

.pg_wrap .pg {
    margin: 0 1em;
}

.pg_wrap .pg a {
    display: inline-block;
    width: 2.5em;
    height: 2.5em;
    border-radius: 50%;
    font-size: 1.6rem;
    color: #b2b2b2;
    vertical-align: middle;
    text-align: center;
    line-height: 2.5em;
}

.pg_wrap .pg a:hover {
    color: #000;
}

.pg_wrap .pg a.on {
    background: #22b1ac;
    color: #fff !important;
}

.pg_wrap .pg-btn {
    opacity: 0.4;
    display: inline-block;
    position: relative;
    margin: 0 0.5em;
    width: 2.5em;
    height: 2.5em;
    background-repeat: no-repeat;
    background-position: center center;
    vertical-align: middle;
    cursor: pointer;
}

.pg_wrap .pg-btn:hover {
    opacity: 1;
}

.pg_wrap .pg-btn.pg-start {
    background-image: url(/images/bu/bu-start.png);
}

.pg_wrap .pg-btn.pg-prev {
    background-image: url(/images/bu/bu-prev.png);
}

.pg_wrap .pg-btn.pg-next {
    background-image: url(/images/bu/bu-next.png);
}

.pg_wrap .pg-btn.pg-end {
    background-image: url(/images/bu/bu-end.png);
}

/* ----- modal popup ----- */

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

.pop-wrap.open {
    display: block;
}

.pop-wrap .pop-conwrap {
    overflow-y: scroll;
    position: absolute;
    left: 50%;
    top: 50%;
    padding: 7em 6em;
    min-width: 76em;
    max-height: 90vh;
    background: #fff;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-behavior: smooth;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    box-shadow: 1px 1px 10px rgba(60, 60, 60, 0.5);
}

.pop-wrap .pop-conwrap::-webkit-scrollbar {
    display: none;
}

.pop-wrap .pop-conwrap video {
    width: 100%;
}

.pop-wrap .pop-conwrap .btn-popup-close {
    position: absolute;
    right: 25px;
    top: 25px;
    min-width: auto !important;
    width: 28px;
    height: 28px;
    background: none;
    border: 1px solid #333;
}

.pop-wrap .pop-conwrap .btn-popup-close:after {
    content: "\e9af";
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 2.3rem;
    font-weight: 600;
    color: #333;
    font-family: 'xeicon', sans-serif;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.pop-wrap .pop-tit {
    padding: 0.893em 0;
    font-size: 2.4rem;
    color: #333333;
    letter-spacing: -0.009em;
    line-height: 1.429em;
    font-weight: 600;
}

.pop-wrap .mapinfo strong {
    display: block;
    margin: 20px 0 10px;
    font-size: 1.7rem;
    color: #333;
}

.pop-wrap .mapinfo strong:first-child {
    margin-top: 0;
}

.pop-wrap .mapinfo p {
    font-size: 1.5rem;
    color: #333;
    line-height: 1.5;
}

.pop-wrap .report-list {
    border-bottom: 1px solid #ddd;
}

.pop-wrap .report-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 7px 70px 7px 20px;
    border-top: 1px solid #ddd;
}

.pop-wrap .report-list li p {
    width: 70%;
    font-size: 1.6rem;
    color: #666666;
    font-weight: 300;
    letter-spacing: -0.25px;
}

.pop-wrap .report-list li select {
    display: block;
    padding: 0 12px;
    width: 80px;
    height: 35px;
    border: 1px solid #ddd;
    background: url(/images/bu/bu-select.png) no-repeat 90% center;
    background-size: 8px;
    font-size: 1.4rem;
    color: #666;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.pop-wrap .report-list li select::-ms-expand {
    display: none;
}

.pop-wrap .report-list li select option:hover {
    background: #333;
    color: #fff;
}

.pop-wrap .report-list li select option:checked {
    background: #333;
    color: #fff;
}

.pop-wrap .report-list li .btn-download.small {
    position: absolute;
    right: 20px;
    top: 50%;
    width: 35px;
    height: 35px;
    border: none;
    margin-top: -17.5px;
}

.pop-wrap .report-list li .btn-download.small i {
    top: 17px;
}

.pop-wrap .narr {
    overflow-y: scroll;
    padding: 20px;
    max-height: 110px;
    border: 1px solid #dcdcdc;
    font-size: 1.6rem;
    color: #666;
    line-height: 1.4;
}

/* ----- global network ----- */

.btn-global-clear {
    padding: 0 25px;
    position: relative;
    width: 200px;
    height: 50px;
    background: #fff url(/images/ico/ico-global-clear.png) no-repeat center right 25px;
    border: 1px solid #444444;
    font-size: 1.6rem;
    color: #3f3f3f;
    text-align: left !important;
}

.btn-global-clear:hover {
    background: #333 url(/images/ico/ico-global-clear-on.png) no-repeat center right 25px;
    color: #fff;
}

.btn-global-search {
    padding: 0 25px;
    position: relative;
    width: 200px;
    height: 50px;
    background: #333333 url(/images/ico/ico-global-search.png) no-repeat center right 25px;
    border: 1px solid #444444;
    font-size: 1.6rem;
    color: #fff;
    text-align: left !important;
}

.btn-global-search:hover {
    background-color: #22b1ac;
    border-color: #22b1ac;
    color: #fff;
}

.btn-sm-map {
    padding: 0 2.813em;
    border: 1px solid #dcdcdc;
    font-size: 1.6rem;
    color: #333333;
    font-weight: 200;
    letter-spacing: -0.016em;
    text-align: center;
    line-height: 2.5em;
}

.btn-sm-map:hover {
    background: #333;
    border-color: #333;
    color: #fff;
}

.global-network {
    padding: 11em 0;
}

.global-network .maxinner {
    max-width: 1280px;
}

.global-network .global-search {
    padding: 4em 0;
    margin-bottom: 5em;
    background: #fff;
}

.global-network .global-search:after {
    content: "";
    display: block;
    clear: both;
}

.global-network .global-search .listbox {
    width: 100%;
}

.global-network .global-search .listbox strong {
    display: block;
    float: left;
    margin-top: 13px;
    font-size: 1.8rem;
    color: #333333;
    font-weight: 500;
}

.global-network .global-search .st-select {
    display: inline-block;
    width: 190px;
    height: 50px;
    background-color: #fff;
    font-size: 1.6rem;
    color: #333333;
    vertical-align: middle;
}

.global-network .global-search .st-inp {
    width: 100%;
    height: 50px;
    background-color: #fff;
    font-size: 1.6rem;
    color: #333333;
}

.global-network .global-search .left {
    float: left;
    width: 82%;
}

.global-network .global-search .left .left-top:after {
    content: "";
    display: block;
    clear: both;
}

.global-network .global-search .left .left-top .listbox:nth-child(odd) {
    float: left;
}

.global-network .global-search .left .left-top .listbox:nth-child(even) {
    float: right;
}

.global-network .global-search .left .left-top .listbox:nth-child(1) {
    width: 65%;
}

.global-network .global-search .left .left-top .listbox:nth-child(1)>strong {
    width: 235px;
}

.global-network .global-search .left .left-top .listbox:nth-child(1)>div {
    float: right;
}

.global-network .global-search .left .left-top .listbox:nth-child(1) .st-select:first-child {
    margin-right: 10px;
}

.global-network .global-search .left .left-top .listbox:nth-child(2) {
    width: 35%;
}

.global-network .global-search .left .left-top .listbox:nth-child(2)>strong {
    width: 90px;
    text-align: right;
}

.global-network .global-search .left .left-top .listbox:nth-child(2)>div {
    float: right;
    text-align: right;
}

.global-network .global-search .left .left-btm {
    margin-top: 10px;
}

.global-network .global-search .left .left-btm .listbox>strong {
    float: left;
    width: 235px;
}

.global-network .global-search .left .left-btm .listbox>div {
    float: right;
    width: 72.4%;
}

.global-network .global-search .right {
    float: right;
    width: 16%;
    text-align: right;
}

.global-network .global-search .right .btn-global-search {
    margin-top: 10px;
}

.global-network .global-cate {
    padding: 0 0 5em;
}

.global-network .global-cate ul {
    display: flex;
    justify-content: space-between;
    margin-left: -1em;
}

.global-network .global-cate ul li {
    flex: 1;
    margin-left: 1em;
}

.global-network .global-cate ul li a {
    display: block;
    background: #f0f0f0;
    border: 1px solid #f0f0f0;
    font-size: 1.6rem;
    color: #333333;
    font-weight: 300;
    letter-spacing: -0.016em;
    text-align: center;
    line-height: 3.438em;
}

.global-network .global-cate ul li a img {
    margin-right: 0.5em;
    vertical-align: baseline;
}

.global-network .global-cate ul li.on a,
.global-network .global-cate ul li a:hover {
    background: #fff;
    border: 1px solid #333;
    font-weight: 600;
}

.global-network .tbstyle03 thead th {
    padding: 1.375em 1.25em;
    font-weight: 400;
    font-size: 1.6rem;
    text-align: left;
}

.global-network .tbstyle03 tbody td {
    padding: 1.875em 1.25em;
    font-size: 1.6rem;
    color: #333333;
    font-weight: 200;
    text-align: left;
}

.global-network .tbstyle03 tbody td img {
    margin-right: 0.5em;
    vertical-align: baseline;
}

.global-network .tbstyle03 tbody td a:hover {
    text-decoration: underline;
}

.global-network .map-wrap .map-info {
    border-top: 1px solid #000;
    border-bottom: 1px solid #e1e1e1;
}

.global-network .map-wrap .map-info>li {
    border-bottom: 1px solid #e1e1e1;
}

.global-network .map-wrap .map-info>li:last-child {
    border: none;
}

.global-network .map-wrap .map-info>li .place-tit a {
    display: inline-block;
    position: relative;
    padding: 30px 20px;
    width: 100%;
    font-size: 0;
}

.global-network .map-wrap .map-info>li .place-tit a>.tit {
    display: inline-block;
    position: relative;
    width: 61%;
    margin-bottom: 0;
    font-size: 2rem;
    line-height: 1.7em;
    color: #222;
    font-weight: 700;
    vertical-align: middle;
}

.global-network .map-wrap .map-info>li .place-tit a>.tit img {
    margin-right: 5px;
    margin-bottom: 1px;
    vertical-align: baseline;
}

.global-network .map-wrap .map-info>li .place-tit a>.loc {
    display: inline-block;
    padding-right: 90px;
    line-height: 36px;
    width: 39%;
    text-align: right;
    vertical-align: middle;
}

.global-network .map-wrap .map-info>li .place-tit a>.loc span {
    display: inline-block;
    position: relative;
    padding-left: 10px;
    margin-left: 10px;
    font-size: 1.7rem;
    color: #666;
    vertical-align: middle;
}

.global-network .map-wrap .map-info>li .place-tit a>.loc span:after {
    content: "";
    position: absolute;
    left: 0;
    top: 14px;
    width: 1px;
    height: 10px;
    background: #aaa;
}

.global-network .map-wrap .map-info>li .place-tit a>.loc span:first-child {
    margin-left: 0;
    padding-left: 0;
}

.global-network .map-wrap .map-info>li .place-tit a>.loc span:first-child:after {
    display: none;
}

.global-network .map-wrap .map-info>li .place-tit a:after {
    content: "";
    position: absolute;
    right: 25px;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-left: 2px solid #333;
    border-top: 2px solid #333;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    -o-transform: rotate(225deg);
    transform: rotate(225deg);
    -webkit-transform-origin: center 3px;
    -moz-transform-origin: center 3px;
    -ms-transform-origin: center 3px;
    -o-transform-origin: center 3px;
    transform-origin: center 3px;
}

.global-network .map-wrap .map-info>li.on .place-tit a:after {
    margin-top: 2px;
    -webkit-transform: rotate(45deg) translateY(-50%);
    -moz-transform: rotate(45deg) translateY(-50%);
    -ms-transform: rotate(45deg) translateY(-50%);
    -o-transform: rotate(45deg) translateY(-50%);
    transform: rotate(45deg) translateY(-50%);
}

.global-network .map-wrap .map-info>li .place-con {
    display: none;
    padding: 20px 20px 50px;
}

.global-network .map-wrap .map-info>li .place-con:after {
    content: "";
    display: block;
    clear: both;
}

.global-network .map-wrap .map-info>li .place-con .con-left {
    float: left;
    width: calc(100% - 480px);
    padding-right: 100px;
}

.global-network .map-wrap .map-info>li .place-con .con-left dl {
    display: flex;
    margin-bottom: 1em;
}

.global-network .map-wrap .map-info>li .place-con .con-left dl dt {
    margin-right: 1em;
    font-size: 1.8rem;
    line-height: 1.667em;
}

.global-network .map-wrap .map-info>li .place-con .con-left dl dd {
    font-size: 1.8rem;
    color: #555;
    line-height: 1.667em;
}

.global-network .map-wrap .map-info>li .place-con .con-right {
    float: right;
}

.global-network .map-wrap .map-info>li .place-con .con-right .mapbox {
    width: 480px;
    height: 280px;
    background: #f5f5f5;
}

.global-network .map-wrap .map-info>li .place-con .con-right .mapbox iframe {
    width: 100%;
    height: 100%;
}

/* ----- search resuluts ----- */

.search-results .search-box {
    padding: 5.5em 6em;
    margin-top: 12.5em;
    background: #fafafa;
}

.search-results .search-box form {
    display: flex;
    justify-content: space-between;
    position: relative;
}

.search-results .search-box form fieldset {
    width: 45%;
}

.search-results .search-box .search-area {
    position: relative;
}

.search-results .search-box .search-area .st-inp {
    padding: 0 1.9em 0.667em 0;
    height: auto;
    background: none;
    border: none;
    border-bottom: 2px solid #000;
    font-size: 3rem;
    letter-spacing: -0.25px;
    font-weight: 500;
}

.search-results .search-box .search-area button {
    position: absolute;
    right: 0;
    top: 0;
    width: 1.9em;
    height: 1.233em;
    background: url(/images/ico/ico-search-big-black.png) no-repeat center;
    font-size: 3rem;
}

.search-results .search-box .re-search label {
    display: inline-block;
    position: relative;
    padding-left: 1.875em;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.625em;
    letter-spacing: -0.016em;
    font-weight: 300;
    cursor: pointer;
}

.search-results .search-box .re-search label:after {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    width: 16px;
    height: 16px;
    border: 1px solid #666666;
}

.search-results .search-box .re-search label:before {
    content: "\e929";
    position: absolute;
    left: 0;
    top: 4px;
    z-index: 10;
    width: 16px;
    height: 16px;
    font-family: 'xeicon', sans-serif;
    color: #fff;
    line-height: 16px;
}

.search-results .search-box .re-search input[type="checkbox"] {
    display: none;
}

.search-results .search-box .re-search input[type="checkbox"]:checked+label:after {
    border-color: #22b1ac;
    background: #22b1ac;
}

.search-results .auto-keyword {
    display: none;
    background: #fff;
    position: absolute;
    top: 57px;
    width: 45%;
    height: auto;
    border-radius: 0 0 16px 16px;
    -webkit-box-shadow: 0 5px 2px 0 rgba(0, 0, 0, 0.05), 0 5px 8px 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 5px 2px 0 rgba(0, 0, 0, 0.05), 0 5px 8px 0 rgba(0, 0, 0, 0.08);
    background-color: #fff;
    letter-spacing: -0.3px;
    line-height: 2rem;
    padding: 20px 0;
    z-index: 9;
    font-size: 1.8rem;
}

.search-results .auto-keyword .auto-keyword-item {
    display: block;
    color: #010101;
    padding-left: 26px;
    background-image: url(/images/ico/ico-search-big-black.png);
    background-repeat: no-repeat;
    background-size: 1.7rem;
    background-position: 0 0.5rem;
    margin-left: 20px;
    line-height: 3rem;
    margin-bottom: 10px;
}

.search-results .sort_area {
    font-size: 1.8rem;
    width: 165px;
    padding-left: 20px;
}

.search-results .sort_area .active {
    font-weight: 800
}

.search-results .auto-correct-desc {
    font-size: 2.4rem;
    color: #333333;
    font-weight: 500;
    letter-spacing: -0.010em;
    margin: 6rem 0 0;
    text-align: center;
}

.search-results .auto-correct-desc .name {
    font-weight: 700;
}

.search-results .search-box .search-keyword {
    width: 45%;
}

.search-results .search-box .search-keyword dt {
    margin-bottom: 1.25em;
    font-size: 1.6rem;
    color: #333333;
    letter-spacing: -0.016em;
}

.search-results .search-box .search-keyword dd {
    margin-left: -1%;
    margin-top: -1%;
    font-size: 0;
}

.search-results .search-box .search-keyword dd a {
    display: inline-block;
    margin: 1%;
    padding: 0 1.429em;
    background: #fff;
    border: 1px solid #dcdcdc;
    font-size: 1.4rem;
    color: #666666;
    letter-spacing: -0.018em;
    line-height: 2.5em;
}

.search-results .search-block {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 9.5em 0 5em;
}

.search-results .search-block p {
    width: calc(100% - 280px);
    font-size: 2.4rem;
    color: #333333;
    font-weight: 500;
    letter-spacing: -0.010em;
}

.search-results .search-block p strong {
    color: #22b1ac;
    font-weight: 600;
}

.search-results .search-block .search-select {
    position: relative;
    width: 300px;
}

.search-results .search-block .search-select .selc-name {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    max-width: 300px;
    width: 100%;
    height: 6em;
    background: url(/images/bu/bu-select.png) no-repeat 95% center;
    border: none;
    border-bottom: 2px solid #333;
}

.search-results .search-block .search-select .selc-name a {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 0 1.944em 0 0.556em;
    width: 100%;
    height: 100%;
    font-size: 1.8rem;
    color: #333333;
    font-weight: 500;
    letter-spacing: -0.014em;
}

.search-results .search-block .search-select .selc-box {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 10;
    width: 100%;
}

.search-results .search-block .search-select .selc-box .selc-con {
    overflow-y: scroll;
    max-height: 200px;
    background: #fff;
    border: 1px solid #000;
}

.search-results .search-block .search-select .selc-box a {
    display: block;
    padding: 0 0.556em;
    font-size: 1.8rem;
    line-height: 2.222em;
}

.search-results .search-block .search-select .selc-box a:hover {
    background: #22b1ac;
    color: #fff;
}

.search-results .search-nav.tab-nav {
    display: flex;
    padding: 0;
    margin-bottom: 8.5em;
}

.search-results .search-nav.tab-nav li {
    display: block;
    flex: 1;
}

.search-results .search-nav.tab-nav li a,
.search-results .search-nav.tab-nav li button {
    width: 100%;
    border: 1px solid #f0f0f0;
}

.search-results .search-nav.tab-nav li.on a,
.search-results .search-nav.tab-nav li.on button {
    border: 1px solid #333;
    background: #fff;
    color: #333;
    box-shadow: none;
}

.search-results .search-nav.tab-nav span.count {
    font-size: 14px;
    position: relative;
    top: -3px;
    display: inline-block;
    vertical-align: top;
}

.search-results .list-tit {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: 3.5em;
}

.search-results .list-tit h3 {
    font-size: 2.8rem;
    color: #333333;
}

.search-results .list-tit a {
    display: block;
    position: relative;
    padding-right: 1.563em;
    font-size: 1.6rem;
    color: #333333;
    line-height: 1.875em;
    letter-spacing: -0.016em;
}

.search-results .list-tit a:after {
    content: "";
    position: absolute;
    right: 0;
    top: 0.47em;
    width: 10px;
    height: 10px;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;
}

.search-results .list-tit a:hover {
    color: #22b1ac;
}

.search-results .list-tit a:hover:after {
    border-color: #22b1ac;
}

.search-results .search-list .list-con {
    border-top: 2px solid #000;
}

.search-results .search-list .list-con .list {
    padding: 7em 0;
    border-bottom: 1px solid #e6e6e6;
}

.search-results .search-list .list-con .list .tit {
    margin-bottom: 1.9em;
}

.search-results .search-list .list-con .list .tit a {
    display: inline-block;
    font-size: 2.4rem;
    color: #333333;
    letter-spacing: -0.010em;
    font-weight: 600;
}

.search-results .search-list .list-con .list .tit a:after {
    content: "";
    display: inline-block;
    margin-left: 15px;
    margin-top: -0.1em;
    width: 17px;
    height: 18px;
    background: url(/images/ico/ico-link-results.png) no-repeat center;
    vertical-align: middle;
}

.search-results .search-list .list-con .list .tit strong {
    color: #22b1ac;
}

.search-results .search-list .list-con .list .tit a:hover {
    color: #22b1ac;
}

.search-results .search-list .list-con .list .txt {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    height: 5.625em;
    font-size: 1.6rem;
    color: #666666;
    line-height: 1.875em;
    letter-spacing: -0.016em;
    font-weight: 300;
}

.search-results .search-list .list-con .list .date {
    margin-top: 45px;
}

.search-results .search-list .list-con .list .date span {
    display: inline-block;
    position: relative;
    padding-left: 1em;
    margin-left: 1em;
    font-size: 1.6rem;
    color: #666666;
    line-height: 1.5em;
    letter-spacing: -0.016em;
    font-weight: 300;
}

.search-results .search-list .list-con .list .date span:after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 10px;
    background: #808080;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.search-results .search-list .list-con .list .date span:first-child {
    margin-left: 0;
    padding-left: 0;
}

.search-results .search-list .list-con .list .date span:first-child:after {
    display: none;
}

.search-results .search-list+.search-list {
    margin-top: 11em;
}

/* ----- parking error ----- */

.parking-error {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 10em;
    min-height: 730px;
    border-top: 1px solid #ddd;
    text-align: center;
}

.parking-error strong {
    display: block;
    margin: 2.222em 0 0.694em;
    font-size: 3.6rem;
    color: #333333;
    line-height: 1.528em;
    letter-spacing: -0.007em;
    font-weight: 700;
}

.parking-error p {
    font-size: 1.8rem;
    color: #666666;
    letter-spacing: -0.014em;
    line-height: 1.667em;
    font-weight: 300;
}

.parking-error .error-btn {
    margin-top: 8em;
}

.parking-error .error-btn a {
    display: inline-block;
    min-width: 185px;
    margin-left: 1.25em;
    border: 1px solid #313131;
    font-size: 1.6rem;
    color: #313131;
    letter-spacing: -0.016em;
    line-height: 3.438em;
}

.parking-error .error-btn a:first-child {
    margin-left: 0;
}

.parking-error .error-btn a:hover {
    background: #313131;
    color: #fff;
}

/* ---------------------- */

/* ------ IOS ONLY ------ */

/* ---------------------- */

@supports (-webkit-touch-callout: none) {
    /* height 100vh fix */
    .vision .scroll-wrap,
    .vision .vision-tit .maxinner,
    .vision .vision-pin .pin-inner,
    .vision .vision-fix,
    .vision .vision-slide .slide-img-list,
    .history .history-visual,
    .history .history-list .list .cont .pin .maxinner,
    .sub-visual {
        height: -webkit-fill-available;
    }
}

/* ---------------------- */

/* ------ 추가작업 ------ */

/* ---------------------- */

.sub-visual.bg-talent:after {
    background-image: url("/images/sub/common/sub-visual-talent.jpg");
}

.sub-visual.bg-employment:after {
    background-image: url("/images/sub/common/sub-visual-employment.jpg");
}

.sub-visual.bg-welfare:after {
    background-image: url("/images/sub/common/sub-visual-welfare.jpg");
}

.sub-visual.bg-printing:after {
    background-image: url("/images/sub/common/sub-visual-printing.jpg");
}

.sub-visual.bg-lithium:after {
    background-image: url("/images/sub/common/sub-visual-lithium.png");
}

.sub-visual.bg-gasting-forging:after {
    background-image: url("/images/sub/common/sub-visual-gasting-forging.jpg");
}

.sub-visual.bg-fire-power:after {
    background-image: url("/images/sub/common/sub-visual-fire-power.jpg");
}

.sub-visual.bg-combined:after {
    background-image: url("/images/sub/common/sub-visual-combined.jpg");
}

.sub-visual.bg-water-power:after {
    background-image: url("/images/sub/common/sub-visual-water-power.jpg");
}

.sub-visual.bg-plant-epc:after {
    background-image: url("/images/sub/common/sub-visual-plant-epc.jpg");
}

.sub-visual.bg-water-epc:after {
    background-image: url("/images/sub/common/sub-visual-water-epc.jpg");
}

.sub-visual.bg-construction:after {
    background-image: url("/images/sub/common/sub-visual-construction.jpg");
}

.sub-visual.bg-strategy:after {
    background-image: url("/images/sub/common/sub-visual-strategy.jpg");
}

.sub-visual.bg-society:after {
    background-image: url("/images/sub/common/sub-visual-society.jpg");
}

.sub-visual.bg-ethics:after {
    background-image: url("/images/sub/common/sub-visual-ethics.jpg");
}

.sub-visual.bg-human-rights:after {
    background-image: url("/images/sub/common/sub-visual-human-rights.jpg");
}

.sub-visual.bg-shared-growth:after {
    background-image: url("/images/sub/common/sub-visual-shared-growth.jpg");
}

.sub-visual.bg-safety:after {
    background-image: url("/images/sub/common/sub-visual-safety.jpg");
}

.sub-visual.bg-faq:after {
    background-image: url("/images/sub/common/sub-visual-nuclear-02.jpg");
}

/**** 채용 ****/

/** 두산의 인재, 두산인 **/

.talent01 .halfbox .left {
    padding-right: 0;
}

.talent01 .halfbox .right {
    margin-top: 0;
}

.talent01 .space {
    padding: 11em 0;
}

.talent01 .left>div {
    display: flex;
}

.talent01 .left .tit {
    font-size: 3rem;
    font-weight: 600;
    line-height: 1.333em;
}

.talent01 .left .tit span {
    font-size: 2.6rem;
    font-weight: 600;
    color: #22b1ac;
    line-height: 1.385em;
    margin-top: 0.5em;
}

.talent01 .left .tit.italic span {
    font-style: italic;
}

.talent01 .left .img {
    margin-right: 8em;
}

.talent01 .right .normal-txt {
    color: #666666;
    font-size: 1.7rem;
    line-height: 1.765em;
}

.talent02 {
    padding-bottom: 14em;
}

.talent02 .con-tit {
    text-align: center;
    padding: 10em 0;
}

.talent02 .con-tit .tit {
    font-size: 4rem;
    margin-bottom: 1.176em;
}

.talent02 .con-tit p {
    font-size: 1.8rem;
    color: #666666;
    font-weight: 300;
    line-height: 1.667em;
}

.talent02 .halfbox {
    max-width: 1320px;
    width: 90%;
    margin: 0 auto;
}

.talent02 .halfbox>div {
    flex: 1;
    margin: 0 .5em;
}

.talent02 .halfbox .box-tit {
    height: 7.6em;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    background: url("../../images/sub/employment/talent-img01.png") no-repeat center center;
    background-size: cover;
}

.talent02 .halfbox .box-tit .tit {
    font-size: 2.2rem;
    color: #fff;
    font-weight: 600;
}

.talent02 .halfbox .box-con {
    border: solid 1px #ececec;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    border-top: none;
    padding: 3.5em;
}

.talent02 .halfbox .box-con>p {
    font-size: 1.7rem;
    color: #666666;
    text-align: center;
    line-height: 1.529em;
    font-weight: 300;
}

.talent02 .halfbox .box-con>p.con-sm-tit {
    font-size: 2rem;
    color: #000000;
    line-height: 1.5em;
    font-weight: 600;
    padding: 1.75em 0;
}

.talent02 .halfbox p.con-sm-tit span {
    color: #22b1ac;
}

.talent02 .halfbox ul li {
    margin-bottom: 1em;
}

.talent02 .halfbox ul li:last-child {
    margin-bottom: 0;
}

.talent02 .halfbox ul li .box {
    background: #fafafa;
    padding: 2em 1em;
    text-align: center;
}

.talent02 .halfbox ul li p {
    font-size: 1.8rem;
    color: #333333;
    line-height: 1.667em;
    font-weight: 500;
    margin-bottom: .3em;
}

.talent02 .halfbox ul li span {
    font-size: 1.5rem;
    font-weight: 300;
    color: #666666;
    line-height: 1.5em;
}

.talent02 .halfbox ul li .halfbox {
    width: 100%;
    padding-top: 0;
}

.talent02 .halfbox ul li .halfbox .box:first-child {
    margin-left: 0;
}

.talent02 .halfbox ul li .halfbox .box:last-child {
    margin-right: 0;
}

.talent02 .c-box {
    text-align: center;
}

.talent02 .c-box:last-child {
    margin-top: 3em;
}

.talent02 .c-box:last-child:before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #c4f6b2;
}

.talent02 .c-box .circle {
    background: url("/images/sub/employment/talent-img03.png") no-repeat center center;
    background-size: cover;
    width: 33.5em;
    height: 33.5em;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 8;
}

.talent02 .c-box>div:before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background: #c4f6b2;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    border-radius: 100%;
}

.talent02 .c-box>div:after {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background: #c4f6b2;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    border-radius: 100%;
}

.talent02 .c-box .circle p {
    font-size: 2.4rem;
    color: #fff;
    font-weight: 600;
    line-height: 1.250em;
    margin-top: 1em;
}

/** 채용전형 안내 **/

.employment .normal-txt sup {
    color: #22b1ac
}

.employment .sec01 {
    margin: 0 auto;
    max-width: 1460px;
    width: 90%;
    border-top: 1px solid #dcdcdc;
}

.employment .sec02 {
    margin: 0 auto;
    padding-top: 5em;
    max-width: 1460px;
    width: 90%;
}

.employment .s-inner {
    margin: 0 auto;
    max-width: 1214px;
    width: 90%;
}

.employment .halfbox {
    display: block;
    padding-top: 11em;
}

.employment .halfbox:after {
    content: "";
    display: block;
    clear: both;
}

.employment .halfbox .left {
    float: left;
    width: 30%;
}

.employment .halfbox .right {
    float: right;
    width: 70%;
}

.employment .listbox {
    padding: 11em 0 0;
}

.employment .listbox:nth-of-type(2n) {
    padding-top: 17em;
}

.employment .listbox .tit {
    text-align: center;
    color: #333333;
    font-size: 4rem;
    margin-bottom: 1.5em;
}

.employment .listbox .list {
    border: dashed 1px #d3d3d3;
    border-radius: 15em;
}

.employment .listbox .list ul {
    padding: 2.5em 3.5em;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.employment .listbox .list ul:after {
    content: '';
    width: 8px;
    height: 8px;
    background: #33ba05;
    border-radius: 100%;
    position: absolute;
    right: 0;
    transform: translateX(50%);
}

.employment .listbox .list ul:before {
    content: '';
    width: 8px;
    height: 8px;
    background: #33ba05;
    border-radius: 100%;
    position: absolute;
    left: 0;
    transform: translateX(-50%);
}

.employment .listbox .list li {
    width: 22.2em;
    height: 22.2em;
    border: 1px solid #49c220;
    border-radius: 100%;
    box-shadow: 0 0 15px rgb(155 221 132 / 29%);
    display: flex;
    justify-content: center;
}

.employment .listbox .list li.arrow-btn {
    background: url('../../images/ico/ico-next.png')no-repeat center center;
    width: 1.6em;
    height: 3em;
    border: none;
    border-radius: unset;
    box-shadow: unset;
}

.employment .listbox .list li.last {
    background: #22b1ac;
}

.employment .listbox .list li.last span {
    color: #bbff9d;
}

.employment .listbox .list li.last p {
    color: #fff;
}

.employment .listbox .list li>div {
    margin-top: 5em;
    text-align: center;
}

.employment .listbox .list li.last h3 {
    color: #fff;
}

.employment .listbox .list li span {
    font-size: 2rem;
    color: #22b1ac;
    line-height: 1.5em;
}

.employment .listbox .list li h3 {
    font-size: 2.4rem;
    color: #333333;
    font-weight: 600;
    margin: 0.5em 0;
}

.employment .listbox .list li p {
    font-size: 1.7rem;
    color: #333333;
    opacity: 0.8;
}

.employment .halfbox .left>div {
    margin-top: -2.5em;
}

.employment .halfbox .left span {
    color: #22b1ac;
    font-size: 1.8rem;
}

.employment .halfbox .left .tit {
    font-size: 3.2rem;
    font-weight: 600;
}

.employment .halfbox .left .tit em {
    font-style: normal;
    color: #22b1ac;
    margin-right: 0.469em;
}

.employment .halfbox .right .small-txt {
    font-size: 1.4rem;
    color: #666666;
    padding: 1em 1.5em;
    background: #fafafa;
    margin-top: 1.5em;
    display: inline-flex;
}

.employment .halfbox .right .small-txt span {
    color: #22b1ac;
}

.employment .halfbox .right ul {
    margin-top: 3.5em;
}

.employment .halfbox .right li {
    position: relative;
    padding-left: 15px;
}

.employment .halfbox .right li span {
    position: absolute;
    left: 0;
    top: 12px;
    width: 4px;
    height: 4px;
    background: #dddddd;
    border-radius: 100%;
}

.employment .halfbox .right li p {
    color: #666666;
    font-size: 1.6rem;
    line-height: 1.875em;
}

.employment .halfbox .right li p em {
    color: #22b1ac;
    font-style: normal;
}

.employment .line-imgbox {
    text-align: right;
}

.employment .line-imgbox>div:after {
    right: 0;
    left: unset;
}

.employment .line-imgbox .txt {
    position: absolute;
    top: 9em;
    left: 7em;
    text-align: left;
}

.employment .line-imgbox .txt h3 {
    font-size: 3.4rem;
    color: #fff;
    line-height: 1.059em;
    margin-bottom: 1em;
}

.employment .line-imgbox .txt a {
    font-size: 1.8rem;
    color: #fff;
    position: relative;
    display: inline-flex;
    align-items: center;
}

.employment .line-imgbox .txt a img {
    width: 15px;
    height: 15px;
    margin-left: 0.5em;
}

.employment .line-imgbox .txt a:hover:after {
    width: 100%;
}

.employment .line-imgbox .txt a:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 0;
    height: 2px;
    background: #fff;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

/** 복리후생 **/

.welfare .tit {
    display: flex;
    align-items: center;
    border-bottom: solid 1px #22b1ac;
    padding: 0 0 3em;
}

.welfare .tit img {
    margin-right: 1.5em;
}

.welfare .tit h4 {
    font-size: 3rem;
    color: #22b1ac;
}

.welfare .list {
    border-top: solid 1px #95d977;
    padding: 7.5em 1em 0;
    display: flex;
    flex-wrap: wrap;
}

.welfare .list .item {
    padding: 0 3em 5em;
    flex: 0 0 auto;
    width: 25%;
}

.welfare .list .item .number {
    font-size: 3.6rem;
    color: #eeeeee;
    font-weight: 800;
    margin-bottom: 0.5em;
}

.welfare .list .item h4 {
    color: #333333;
    font-size: 2.6rem;
    margin-bottom: 1.5em;
    line-height: 1.154em;
    font-weight: 700;
}

.welfare .list .item .normal-txt {
    font-size: 1.7rem;
    color: #666666;
    word-break: keep-all;
}

/**** 사업분야  > 소재 제작 사업 ****/

/** 3D 프린팅 제조 **/

.printing .btnwrap {
    margin-top: 4em;
}

/** 리튬 회수 **/

video#lithium_video1 {
    position: absolute;
}

.lithium .comments {
    font-size: 16px;
    text-align: right;
    margin-top: 50px;
}

.lithium video {
    width: 100%
}

@media (min-width:1800px) {
    video#lithium_video1 {
        width: 100%;
    }
}

/** 리튬 회수 그래프**/

.lithium .graph .img_area {
    position: relative;
    text-align: center;
    width: 50%;
    float: left;
    margin: 130px 0;
}

.lithium .graph .img_area svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.lithium .graph .img_area svg circle {
    stroke-dashoffset: 25;
    fill: transparent;
    stroke-width: 8;
    stroke-dasharray: 0, 100;
    transform-origin: center;
}

.lithium .graph .img_area svg .circle1 {
    stroke: #fff;
}

.lithium .graph .img_area svg .circle2 {
    stroke: #00AD83;
}

.lithium .graph.on .img_area svg .circle1 {
    stroke-dasharray: 100, 0;
    transition: stroke-dasharray 2s 1s;
}

.lithium .graph.on .img_area svg .circle2 {
    stroke-dasharray: 99.5, 0.5;
    transition: stroke-dasharray 2s 1s;
}

.lithium .graph.on .img_area.second svg .circle1 {
    stroke-dasharray: 100, 0;
    transition: stroke-dasharray 2s 3s;
}

.lithium .graph.on .img_area.second svg .circle2 {
    stroke-dasharray: 85, 15;
    transition: stroke-dasharray 2s 3s;
}

.lithium .graph .img_area .graph_li {
    position: absolute;
}

.lithium .graph .img_area .graph_li.graph_li1 {
    width: 100%;
    top: 50%;
    left: 47%;
    transform: translate(-50%, -50%);
}

.lithium .graph .img_area .graph_li.graph_li2 {
    width: 24%;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.lithium .graph .img_area .graph_li:nth-child(even) {
    text-align: left;
}

.lithium .graph .img_area .graph_li:nth-child(odd) {
    text-align: center;
}

.lithium .graph .img_area .graph_li .num {
    position: relative;
    font-size: 20px;
}

.lithium .graph .img_area .graph_li .num>span {
    font-size: 38px;
    font-weight: 600;
    line-height: 1.3;
}

.lithium .graph .img_area .graph_li .desc {
    font-size: 18px;
    color: #666;
    margin-top: 12px;
    padding-top: 10px;
}

/* .lithium .bd-t.graph {padding: 15px 0} */

@media (max-width:1400px) {
    .lithium .graph .img_area .graph_li .num>span {
        font-size: 31px;
        line-height: 1.1;
    }
}

@media (max-width:1080px) {
    .lithium .graph .img_area {
        margin: 80px 0;
    }
    .lithium .graph .img_area .graph_li .num>span {
        font-size: 25px;
        line-height: 1.1;
    }
    .search-results .auto-keyword {
        width: 100%
    }
    .search-results .auto-keyword .auto-keyword-item {
        padding-left: 20px;
        padding-right: 3px;
        background-position: 0 0.5rem;
        margin-left: 10px;
    }
}

@media (max-width:700px) {
    .conbox .graph {
        position: relative;
        width: 100%;
    }
    .lithium .graph .img_area {
        width: 100%;
        float: none;
    }
    .lithium .graph .img_area svg {
        top: 50%;
        left: 54%;
        transform: translate(-50%, -50%);
    }
    .lithium .graph .img_area .graph_li.graph_li1 {
        left: 50%;
    }
    .sub-con.lithium {
        padding-bottom: 0;
    }
}

/** 주조 및 단조 **/

.gasting-forging .forging-list {
    display: flex;
    flex-wrap: wrap;
    margin-left: -2.3333%;
    margin-top: -2.3333%;
}

.gasting-forging .forging-list .list {
    padding: 4em;
    margin-top: 2.3333%;
    margin-left: 2.3333%;
    width: 31%;
    min-height: 375px;
    border: 1px solid #dcdcdc;
    text-align: center;
}

.gasting-forging .forging-list .list .ico {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    width: 70px;
    height: 70px;
}

.gasting-forging .forging-list .list strong {
    margin: 0.833em 0 1.250em;
    display: block;
    font-size: 2.4rem;
    color: #22b1ac;
    font-weight: 500;
    letter-spacing: -0.010em;
}

.gasting-forging .forging-list .list p {
    font-size: 1.6rem;
    color: #666666;
    line-height: 1.875em;
    font-weight: 300;
    letter-spacing: -0.016em;
}

/**** 사업분야  > 플랜트 기자재/서비스 사업 ****/

/** 화력 발전용 - 플랜트 기자재 **/

.bg-fire-power .sub-nav-wrap {
    max-width: 840px;
}

.fire-power .halfbox .left .btnwrap {
    margin-top: 2em;
}

.fire-power .btn-box {
    margin: 3.5em 0;
}

.fire-power .btn-box .btnwrap {
    margin: 1.6em 0;
}

.fire-power .btn-box .btnwrap .btn-download {
    width: 23em;
}

/** 화력 발전용 - 플랜트 서비스 **/

.fire-power-02 {
    padding-bottom: 0 !important;
}

.fire-power-02 .sec01 {
    padding: 12em 0;
    background: #fafafa;
}

/** 복합화력 발전용 **/

.combined .halfbox .left .btnwrap {
    margin-top: 2em;
}

.combined .halfbox .right .btnwrap .btnset {
    min-width: 16em;
}

.combined .halfbox .right .imgbox {
    margin: 7.5em 0 6em;
}

.combined .halfbox .right .tablebox {
    padding-top: 0;
    width: 100%;
}

.combined .halfbox .right .tablebox .left {
    width: 27%;
}

.combined .halfbox .right .tablebox .right {
    width: 77%;
}

.combined .halfbox .right .tablebox .tit {
    font-size: 2rem;
    line-height: 1.5em;
}

.combined .halfbox .right .tablebox .right table {
    width: 100%;
    border-top: solid 2px #33ba05;
    border-collapse: collapse;
}

.combined .halfbox .right .tablebox td {
    font-size: 1.8rem;
    color: #333333;
    padding: 1em;
    border-bottom: solid 1px #dcdcdc;
}

/** 수력/양수 발전용 **/

.water-power .imglist {
    margin-top: 6em;
}

.water-power .imglist>p {
    font-size: 2em;
    color: #333333;
    font-weight: 700;
    margin-bottom: 2em;
}

.water-power .imglist .list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -2.5em;
}

.water-power .imglist .list .item {
    width: 50%;
    padding: 0 2.5em;
    margin-bottom: 4em;
}

.water-power .imglist .list .item .imgbox img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.water-power .imglist .list .item p {
    font-size: 1.8rem;
    color: #333333;
    text-align: center;
    margin-top: 1.5em;
}

/**** 사업분야  > 플랜트 EPC/건설 사업 ****/

/** 플랜트 EPC **/

.plant-epc .step-st01 {
    position: relative;
    margin-bottom: 10em;
}

.plant-epc .step-st01:after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    border: dashed 1px #d2d2d2;
    top: 50%;
}

.plant-epc .step-st01 li {
    padding-bottom: 21%;
    width: 21%;
    z-index: 1;
}

.plant-epc .step-st01 li>p {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    padding-top: 1em;
    font-size: 1.6rem;
    font-weight: 500;
}

.plant-epc .step-st01 .icowrap {
    left: 13px;
    top: 13px;
    right: 13px;
    bottom: 13px;
}

.plant-epc .step-st01 .icowrap .number {
    font-weight: 900;
    color: #dddddd;
    font-size: 2rem;
}

.plant-epc .step-st01>li:nth-child(odd) .line-circle {
    background: unset;
    border: 1px dashed #33ba05;
    background: #fff;
    animation: none;
}

.plant-epc .step-st01>li:nth-child(even) .line-circle {
    border: none;
    background: #fafafa;
}

.plant-epc .step-st01>li:nth-child(even) .line-circle:after {
    display: none;
}

.plant-epc .tbstyle01 table td ul li {
    display: flex;
    align-items: center;
    margin-bottom: 1em;
}

.plant-epc .tbstyle01 table td ul li span {
    width: 3px;
    height: 3px;
    border-radius: 100%;
    background: #dddddd;
    display: block;
    margin-right: 0.5em;
}

.plant-epc .tbstyle01 table td ul li p {
    font-size: 1.6rem;
    font-weight: 300;
}

/** WATER EPC **/

.water-epc .sub-btnwrap a {
    margin: 0 5px 10px;
}

.water-epc .sub-btnwrap {
    margin-left: -10px;
}

.water-epc .halfbox .left .btnwrap {
    margin-top: 2em;
}

.water-epc .halfbox .right .list:after {
    content: "";
    display: block;
    clear: both;
}

.water-epc .halfbox .right .list .item {
    float: left;
    width: 28%;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    transition: all ease 0.3s;
}

.water-epc .right .list-tit {
    display: block;
    font-size: 2em;
    color: #333333;
    font-weight: 700;
    margin: 0.85em 0 2em;
}

.water-epc .right .box02 {
    margin-top: 8em;
}

.water-epc .halfbox .right .list .item .inner {
    overflow: hidden;
    background: #fafafa;
    border: solid 1px #e5e5e5;
    padding: 3em;
    height: 52em;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    transition: all ease 0.3s;
}

.water-epc .halfbox .right .list .item .inner h4 {
    font-size: 1.8rem;
    color: #999999;
    text-align: center;
    font-weight: 500;
}

.water-epc .halfbox .right .list .item .imgbox {
    display: flex;
    flex-direction: column-reverse;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.water-epc .halfbox .right .list .item .imgbox .img {
    margin: 0 auto 5em;
}

.water-epc .halfbox .right .list .item:nth-child(1) .img {
    background: url("/images/sub/business/water-epc-icon01.png") no-repeat center center;
    background-size: cover;
    width: 8.6em;
    height: 8.8em;
}

.water-epc .halfbox .right .list .item:nth-child(2) .img {
    background: url("/images/sub/business/water-epc-icon02.png") no-repeat center center;
    background-size: cover;
    width: 9.6em;
    height: 8.5em;
}

.water-epc .halfbox .right .list .item:nth-child(3) .img {
    background: url("/images/sub/business/water-epc-icon03.png") no-repeat center center;
    background-size: cover;
    width: 7.7em;
    height: 7.8em;
}

.water-epc .halfbox .right .list .item p {
    color: #333333;
    font-size: 1.63rem;
    text-align: center;
    line-height: 2.8rem;
    word-break: keep-all;
    display: none;
    opacity: 0;
}

@keyframes fadeUp {
    0% {
        opacity: 0;
        transform: translateY(40%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.water-epc .halfbox .right .list .item.on {
    width: 44%;
}

.water-epc .halfbox .right .list .item.on .inner {
    border: solid 2px #22b1ac;
    box-shadow: 4px 0 9px rgb(225 235 221);
    background: #fff;
}

.water-epc .halfbox .right .list .item.on .inner .imgbox {
    padding-top: 2em;
    top: 0;
}

.water-epc .halfbox .right .list .item.on .inner .imgbox,
.water-epc .halfbox .right .list .item.on .inner p {
    animation-name: fadeUp;
    animation-duration: 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    transition-timing-function: ease-in;
}

.water-epc .halfbox .right .list .item.on .inner h4 {
    font-size: 2rem;
    color: #22b1ac;
    font-weight: 600;
    margin-bottom: 2.5em;
    display: block;
}

.water-epc .halfbox .right .list .item.on .inner .imgbox {
    display: flex;
    flex-direction: column;
}

.water-epc .halfbox .right .list .item:nth-child(1) .inner.on .img {
    background-image: url("/images/sub/business/water-epc-icon01-on.png");
}

.water-epc .halfbox .right .list .item:nth-child(2) .inner.on .img {
    background-image: url("/images/sub/business/water-epc-icon02-on.png");
}

.water-epc .halfbox .right .list .item:nth-child(3) .inner.on .img {
    background-image: url("/images/sub/business/water-epc-icon03-on.png");
}

.water-epc .halfbox .right .list .item.on .inner p {
    color: #333333;
    font-size: 1.63rem;
    text-align: center;
    line-height: 2.8rem;
    word-break: keep-all;
    opacity: 1;
    display: block;
}

.water-epc .halfbox .right .btn-box {
    display: flex;
}

.water-epc .halfbox .right .btn-box .btnwrap .btnset {
    width: 18em;
}

.water-epc .halfbox .right .btnwrap .btnset {
    margin-right: 1.5em;
}

.water-epc .tbstyle01 table td ul li {
    display: flex;
    align-items: center;
    margin-bottom: 1em;
}

.water-epc .tbstyle01 table td ul li span {
    width: 3px;
    height: 3px;
    border-radius: 100%;
    background: #dddddd;
    display: block;
    margin-right: 0.5em;
}

.water-epc .tbstyle01 table td ul li p {
    font-size: 1.6rem;
    font-weight: 300;
}

/** construction **/

.construction .halfbox .right .imgbox {
    margin: 7.5em 0 5em;
}

.construction .con-sm-tit {
    margin-bottom: 1.25em;
}

.construction .con-download-leaflet a {
    margin: 0 0 1rem 1rem;
}

.construction .con-download-leaflet .con-sm-tit {
    margin-right: 1rem;
    display: inline-block;
}

.construction .tbstyle01 table td ul li {
    display: flex;
    align-items: center;
    margin-bottom: 1.5em;
}

.construction .tbstyle01 table td ul li span {
    width: 3px;
    height: 3px;
    border-radius: 100%;
    background: #dddddd;
    display: block;
    margin-right: 0.5em;
}

.construction .tbstyle01 table td ul li p {
    font-size: 1.6rem;
    font-weight: 300;
}

/**** 사업분야  > 에너지 솔루션 신사업 ****/

/** 가스터빈 - 가스터빈 서비스 사업 **/

.gas-turbine-service .flex-box>ul {
    margin-left: -4%;
}

.gas-turbine-service .flex-box>ul:after {
    content: "";
    display: block;
    clear: both;
}

.gas-turbine-service .flex-box>ul>li {
    float: left;
    margin-left: 4%;
    width: 29.3333%;
}

.gas-turbine-service .flex-box li .tit {
    font-size: 2.6rem;
    color: #333333;
    margin-bottom: 1em;
}

.gas-turbine-service .flex-box li .imgbox {
    margin-bottom: 4em;
}

.gas-turbine-service .flex-box li .imgbox img {
    width: 100%;
}

.gas-turbine-service .flex-box li .list li {
    padding: 1.3em;
    border-bottom: solid 1px #ececec;
    position: relative;
}

.gas-turbine-service .flex-box li .list li:after {
    content: '';
    width: 3px;
    height: 3px;
    background: #22b1ac;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 22px;
}

.gas-turbine-service .flex-box li .list li:last-child {
    border-bottom: none;
}

.gas-turbine-service .flex-box li .list .ico {
    display: none !important;
    justify-content: center;
    align-items: center;
    margin: 0 1.5em;
    width: 40px;
    height: 40px;
}

.gas-turbine-service .flex-box li .list li p {
    font-size: 1.8rem;
    color: #333333;
}

.gas-turbine-service .line-imgbox {
    text-align: right;
}

.gas-turbine-service .line-imgbox>div:after {
    right: 0;
    left: unset;
}

.gas-turbine-service .line-imgbox .txt {
    position: absolute;
    top: 9em;
    left: 7em;
    text-align: left;
}

.gas-turbine-service .line-imgbox .txt h3 {
    font-size: 3.4rem;
    color: #fff;
    line-height: 1.059em;
    margin-bottom: 1em;
}

.gas-turbine-service .line-imgbox .txt a {
    font-size: 1.8rem;
    color: #fff;
    position: relative;
    display: inline-flex;
    align-items: center;
}

.gas-turbine-service .line-imgbox .txt a img {
    width: 15px;
    height: 15px;
    margin-left: 0.5em;
}

.gas-turbine-service .line-imgbox .txt a:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 0;
    height: 2px;
    background: #fff;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.gas-turbine-service .line-imgbox .txt a:hover:after {
    width: 100%;
}

/** 가스터빈 - 가스터빈 인프라 **/

.gas-turbine-infra .halfbox .flex-box {
    display: flex;
    margin-top: 5em;
}

.gas-turbine-infra .halfbox .flex-box p {
    font-size: 2rem;
    color: #333333;
    font-weight: 700;
    display: flex;
    align-items: center;
}

.gas-turbine-infra .halfbox .flex-box p span {
    font-size: 7.2rem;
    margin-right: 0.2em;
    color: #005eb8;
}

.gas-turbine-infra .halfbox .flex-box p:first-child {
    margin-right: 6em;
}

.gas-turbine-infra .halfbox .flex-box p:first-child span {
    color: #22b1ac;
}

.gas-turbine-infra .halfbox .map-text {
    margin-top: 4em;
    display: flex;
}

.gas-turbine-infra .halfbox .map-text p {
    font-size: 1.6rem;
    color: #333333;
}

.gas-turbine-infra .halfbox .map-text p span {
    width: 9px;
    height: 10px;
    border-radius: 100%;
    background: #005eb8;
    display: inline-block;
}

.gas-turbine-infra .halfbox .map-text p:first-child {
    margin-right: 2.5em;
}

.gas-turbine-infra .halfbox .map-text p:first-child span {
    background: #33ba05;
}

.gas-turbine-infra .map-img {
    margin-top: 8em;
    text-align: center;
    min-width: 768px;
}

.gas-turbine-infra .road-view-text {
    display: flex;
    margin-top: 11em;
}

.gas-turbine-infra .road-view-text p {
    color: #333333;
    font-size: 1.8rem;
    font-weight: 600;
    margin-right: 3em;
    display: flex;
    align-items: center;
}

.gas-turbine-infra .road-view-text p span {
    width: 19px;
    height: 19px;
    border-radius: 100%;
    display: inline-block;
    margin-right: 0.8em;
}

.gas-turbine-infra .road-view-text p:nth-child(1) span {
    background: #0088ce;
    box-shadow: 0 0 10px rgb(0 136 206);
}

.gas-turbine-infra .road-view-text p:nth-child(2) span {
    background: #00ad83;
    box-shadow: 0 0 10px rgb(0 173 131);
}

.gas-turbine-infra .road-view-text p:nth-child(3) span {
    background: #0018a8;
    box-shadow: 0 0 10px rgb(0 24 168);
}

.gas-turbine-infra .road-view {
    margin-top: 3em;
}

/**** 지속가능경영 ****/

/** 전략물자관리 **/

.strategy .sub-depth-nav-wrap {
    margin-top: 11em;
}

.strategy .conbox .maxinner {
    max-width: 1127px;
}

.strategy .conbox .tit {
    font-size: 3.4rem;
    text-align: center;
    color: #333333;
    margin-bottom: 2.235em;
}

.strategy .conbox .normal-txt {
    color: #666666;
    padding: 0 4.444em 4.444em;
}

.strategy .conbox .bg {
    background: #fafafa;
    padding: 7.5em 8em;
    margin-bottom: 6em;
}

.strategy .conbox .bg ul li {
    margin-bottom: 3em;
}

.strategy .conbox .bg ul li span {
    color: #33ba05;
    font-size: 2.4rem;
    font-weight: 700;
    margin-right: 0.5em;
    display: block;
    margin-bottom: 1rem;
}

.strategy .conbox .bg ul li p {
    font-size: 1.8rem;
    color: #666666;
    font-weight: 300;
    line-height: 3rem;
}

.strategy .conbox .bg ul li:last-child {
    margin-bottom: 0;
}

.strategy .conbox .bg ul li:last-child span {
    margin-right: 0;
}

.strategy .conbox .sign {
    display: flex;
    align-items: center;
    padding: 0 8em;
}

.strategy .conbox .sign p {
    color: #333333;
    font-size: 2rem;
    line-height: 1.5em;
    font-weight: 600;
    margin-right: 3em;
}

.strategy-document .conbox .bg ul li:last-child span {
    margin-right: 0.5em;
}

/**** 지속가능경영 ****/

/** 사회공헌 > 전략 **/

.society .sub-depth-nav-wrap {
    margin-top: 11em;
}

.society.society-strategy .conbox .list .item {
    width: 33.3333%;
}

.society-strategy .conbox .maxinner {
    max-width: 1300px;
}

.society-strategy .conbox .tit {
    font-size: 4rem;
    text-align: center;
    color: #333333;
    margin-bottom: 1.5em;
}

.society-strategy .conbox .normal-txt {
    text-align: center;
}

.society-strategy .conbox .circle {
    text-align: center;
    margin: 7em 0 3em;
    position: relative;
}

.society-strategy .conbox .circle:before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #c4f6b2;
}

.society-strategy .conbox .circle .box {
    position: relative;
    margin: 0 auto;
    background: url("/images/sub/employment/talent-img03.png") no-repeat center center;
    background-size: cover;
    width: 32em;
    height: 30em;
    z-index: 1;
    padding: 8em;
}

.society-strategy .conbox .circle>div:before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background: #c4f6b2;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    border-radius: 100%;
}

.society-strategy .conbox .circle>div:after {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background: #c4f6b2;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 0;
    border-radius: 100%;
}

.society-strategy .conbox .circle .box p {
    position: relative;
    top: 50%;
    font-size: 2.4rem;
    color: #fff;
    font-weight: 600;
    line-height: 1.25em;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.society-strategy .conbox .arrow {
    text-align: center;
}

.society-strategy .conbox .listbox {
    margin-bottom: 8em;
}

.society-strategy .conbox .listbox .tit {
    font-size: 2.4rem;
}

.society-strategy .conbox .listbox .list {
    display: flex;
    justify-content: space-around;
}

.society-strategy .conbox .listbox .item {
    position: relative;
    z-index: 1;
}

.society-strategy .conbox .listbox .item .list-tit {
    margin: 0 auto;
    font-size: 1.8rem;
    color: #333333;
    border: dotted 2px #22b1ac;
    border-radius: 32.5px;
    padding: 1.167em;
    text-align: center;
    font-weight: 600;
    position: relative;
    z-index: 2;
    background: #fff;
}

.society-strategy .conbox .listbox .item .box {
    border-radius: 10px;
    background: #fafafa;
    border: solid 1px #ececec;
    margin-top: 3em;
    padding: 3em;
    position: relative;
    min-height: 32em;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.society-strategy .conbox .listbox .item .box:before {
    content: '';
    width: 1px;
    height: 25%;
    border: dashed 1px #56C326;
    position: absolute;
    top: -25%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}

.society-strategy .conbox .listbox .item .box:after {
    content: '';
    width: 7px;
    height: 7px;
    background: #56c326;
    border-radius: 100%;
    display: block;
    position: absolute;
    top: -4px;
    left: 50%;
    transform: translateX(-50%);
}

.society-strategy .conbox .listbox .item .box p {
    font-size: 2rem;
    color: #333333;
    font-weight: 600;
    margin-bottom: 1em;
}

.society-strategy .conbox .listbox .item .box .txt {
    margin-bottom: 5em;
}

.society-strategy .conbox .listbox .item .box .txt ul li {
    color: #666666;
    font-size: 1.6rem;
    margin-bottom: 0.6em;
    position: relative;
    margin-left: 0.5em;
}

.society-strategy .conbox .listbox .item .box .txt ul li:before {
    content: '';
    background: #737373;
    width: 3px;
    height: 3px;
    display: inline-block;
    position: absolute;
    top: 7px;
    left: 0;
    border-radius: 50%;
    margin-left: -0.5em;
}

.society-strategy .conbox .listbox .item .box .icon ul {
    display: flex;
    align-items: center;
}

.society.society-strategy .conbox .list .item .box .icon ul li {
    width: 25%;
}

.society-strategy .conbox .listbox .list-theme {
    text-align: center;
}

.society-strategy .conbox .listbox .list-theme .theme-item {
    display: inline-flex;
    justify-content: center;
    width: 100%;
    max-width: 600px;
    align-items: center;
    color: #00a5d7;
    border: 2px solid #00a5d7;
    padding: 10px 20px;
    overflow: hidden;
    border-radius: 100px;
}

.society-strategy .conbox .listbox .list-theme .theme-item img {
    max-height: 70px;
}

.society-strategy .conbox .listbox .list-theme .theme-item span {
    margin-left: 20px;
    padding-left: 20px;
    border-left: 1px solid #00a5d7;
    font-size: 2.2rem;
    font-weight: bold;
}

/*
.society-positivity .space{
  padding-top:0;
}
.society-support .space{
  padding-top:0;
}
.society-community .space{
  padding-top:0;
}
*/

/** 사회공헌  **/

.society .conbox .list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -1em;
}

.society .conbox .list .item {
    flex: 0 0 auto;
    padding: 0 1em;
    width: 50%;
}

.society .conbox .list .item .img {
    margin-bottom: 2em;
}

.society .conbox .list .item .img img {
    width: 100%;
}

.society .conbox .list .item .txt h4 {
    font-size: 2rem;
    color: #333333;
    font-weight: 700;
    margin-bottom: 1em;
    letter-spacing: -0.1rem;
}

.society .conbox .list .item .txt span {
    font-size: 1.8rem;
    color: #333333;
    font-weight: 300;
    line-height: 1.667em;
    word-break: keep-all;
}

.society-community .space:first-child .list .item:first-child {
    margin-bottom: 7.5em;
}

.society-community .conbox .list .txt h4 {
    font-size: 2rem;
    color: #333333;
    font-weight: 700;
    margin-bottom: 1em;
    letter-spacing: -0.1rem;
}

.society-community .conbox .list .txt span {
    font-size: 1.8rem;
    color: #333333;
    font-weight: 300;
    line-height: 1.667em;
    word-break: keep-all;
}

/**** 지속가능경영 > 윤리경영 ****/

.ethics .sub-depth-nav-wrap {
    margin-top: 11em;
}

/** 윤리규범 **/

.ethics .conbox .titbox {
    text-align: center;
    margin-bottom: 7em;
}

.ethics .conbox .titbox .tit {
    font-size: 4rem;
    color: #333333;
    margin-bottom: 1.471em;
}

.ethics .conbox .titbox .normal-txt {
    color: #666666;
}

.ethics .conbox .bg {
    background: #fafafa;
    padding: 6em 0 12em;
}

.ethics .conbox .bg .maxinner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.ethics .conbox .bg .img {
    margin-bottom: 8em;
}

.ethics .conbox .img {
    text-align: center;
    margin-bottom: 0;
}

.ethics-cyber .conbox .titbox .normal-txt {
    margin-bottom: 5.556em;
}

.ethics-cyber .conbox .titbox .btnset {
    min-width: 320px;
}

/**** 지속가능경영 > 인권경영 ****/

.human .sub-depth-nav-wrap {
    margin-top: 11em;
}

/** 인권경영 > 인권정책 **/

.human-rights-policy .titbox {
    text-align: center;
}

.human-rights-policy .titbox .tit {
    color: #333333;
    font-size: 4rem;
    margin-bottom: 1.765em;
}

.human-rights-policy .titbox .normal-txt {
    color: #666666;
}

.human-rights-policy .bg {
    background: #fafafa;
    padding: 11.5em 0;
}

.human-rights-policy .bg .maxinner {
    max-width: 1055px;
}

.human-rights-policy .bg .normal-txt {
    text-align: center;
    color: #666666;
    margin-bottom: 3.889em;
}

.human-rights-policy .bg .circle-list ul {
    display: flex;
    justify-content: space-between;
}

.human-rights-policy .bg .circle-list li {
    position: relative;
    padding-bottom: 22%;
    min-width: 22%;
    height: 0;
    border-radius: 50%;
    text-align: center;
    margin-left: -4%;
    z-index: 1;
}

.human-rights-policy .bg .circle-list li:first-child {
    margin-left: 0;
}

.human-rights-policy .bg .circle-list li:nth-child(even) .txt-wrap {
    background: #fff;
    color: #333;
    border-color: #22b1ac;
}

.human-rights-policy .bg .circle-list li:nth-child(even) .border-circle {
    background: #fff;
}

.human-rights-policy .bg .circle-list .txt-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 10px;
    top: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 1;
    border-radius: 50%;
    background: #22b1ac;
    padding: 0 3rem;
    border: dashed 1px #fff;
    color: #fff;
}

.human-rights-policy .bg .circle-list .txt-wrap p {
    display: table-cell;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 2.4rem;
}

.human-rights-policy .bg .circle-list .border-circle {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    background: #22b1ac;
}

.human-rights-policy .icon-list .maxinner {
    max-width: 1055px;
}

.human-rights-policy .icon-list li {
    display: flex;
    align-items: flex-start;
    margin-bottom: 8em;
}

.human-rights-policy .icon-list li:last-child {
    margin-bottom: 0;
}

.human-rights-policy .icon-list li .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 4em;
    min-width: 55px;
    height: 55px;
}

.human-rights-policy .icon-list li .txt strong {
    font-size: 2.2rem;
    color: #333333;
    margin-bottom: 0.75em;
    display: block;
    font-weight: 700;
}

.human-rights-policy .icon-list li .txt p {
    font-size: 1.6rem;
    color: #666666;
    font-weight: 300;
    word-break: keep-all;
    line-height: 1.750em;
}

/** 인권경영 > 인권경영 실천 **/

.human-rights-implement .titbox {
    text-align: center;
    margin-bottom: 9em;
}

.human-rights-implement .titbox .tit {
    font-size: 4rem;
    color: #333333;
    margin-bottom: 1.765em;
}

.human-rights-implement .titbox .normal-txt {
    font-size: 1.8rem;
    color: #666666;
}

.human-rights-implement .list {
    display: flex;
    justify-content: space-between;
    margin: 0 1.8em;
}

.human-rights-implement .list .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 25%;
}

.human-rights-implement .list .item:last-child ul:after {
    display: none;
}

.human-rights-implement .list .item .icon-wrap {
    width: 15em;
    height: 15em;
    border-radius: 100%;
    background: #fff;
    border: dotted 2.5px #22b1ac;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 10px 0 27px rgb(0 0 0 / 11%);
    margin-bottom: 4em;
    position: relative;
}

.human-rights-implement .list .item .icon-wrap:after {
    content: '';
    display: block;
    width: 1px;
    height: 30%;
    position: absolute;
    bottom: -30%;
    border: dashed 1px #60c633;
    opacity: 0.5;
}

.human-rights-implement .list .item .tit {
    background: rgba(34, 177, 172, 0.8);
    width: 39em;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.4em 0;
    border-radius: 35px;
    position: relative;
}

.human-rights-implement .list .item .tit p {
    font-size: 2rem;
    color: #fff;
    font-weight: 600;
}

.human-rights-implement .list .item ul {
    padding: 6em 3em;
    position: relative;
    width: 100%;
}

.human-rights-implement .list .item ul:after {
    content: '';
    width: 1px;
    height: 21em;
    background: #e8e8e8;
    top: 5em;
    display: block;
    right: 0;
    position: absolute;
}

.human-rights-implement .list .item li {
    display: flex;
    position: relative;
    margin-bottom: 0.625em;
    padding-left: 0.8em;
    font-size: 1.6rem;
    color: #666666;
    font-weight: 300;
    line-height: 1.875em;
    letter-spacing: -0.05em;
}

.human-rights-implement .list .item li:after {
    content: "";
    position: absolute;
    left: 0;
    top: 13px;
    width: 3px;
    height: 3px;
    background: #ddd;
}

.human-rights-implement .list .item li p {}

/**** 지속가능경영 > 공급망 동반성장 ****/

/** 전략 **/

.growth .sub-depth-nav-wrap {
    margin-top: 11em;
}

.growth-strategy .conbox .titbox {
    text-align: center;
    margin-bottom: 9em;
}

.growth-strategy .conbox .titbox .tit {
    font-size: 4rem;
    color: #333333;
    margin-bottom: 1.125em;
}

.growth-strategy .conbox .titbox .normal-txt {
    color: #666666;
}

.growth-strategy .conbox .imgwrap {
    text-align: center;
}

.growth-strategy .conbox .list {
    display: flex;
}

.growth-strategy .conbox .item {
    flex: 1;
    padding: 5em 4em;
    border: solid 1px #dcdcdc;
    border-right: navajowhite;
    border-top: solid 2px #22b1ac;
}

.growth-strategy .conbox .item:last-child {
    border-right: solid 1px #dcdcdc;
}

.growth-strategy .conbox .item h4 {
    font-size: 2rem;
    color: #333333;
    font-weight: 600;
    margin-bottom: 1.2em;
}

.growth-strategy .conbox .item li {
    margin-bottom: 1em;
    display: flex;
    flex-wrap: wrap;
}

.growth-strategy .conbox .item li span {
    min-width: 3px;
    height: 3px;
    background: #aaa;
    display: inline-block;
    margin: 0.7em 10px 0 0;
    border-radius: 50%;
}

.growth-strategy .conbox .item li p {
    font-size: 1.6em;
    color: #666666;
    width: calc(100% - 13px);
}

/** 공급망 ESG **/

.growth-esg {
    padding-bottom: 0 !important;
}

.growth-esg .titbox {
    text-align: center;
    margin-bottom: 9em;
}

.growth-esg .titbox .tit {
    font-size: 4rem;
    color: #333333;
    margin-bottom: 1.125em;
}

.growth-esg .titbox .normal-txt {
    color: #666666;
}

.growth-esg .list {
    width: 100%;
    max-width: 100em;
    margin: 0 auto;
}

.growth-esg .list .item {
    border: solid 1px #22b1ac;
    border-radius: 37.69px;
    padding: 8px;
    display: flex;
    align-items: center;
    margin-bottom: 1.5em;
    height: 7.8em;
    position: relative;
}

.growth-esg .list .item h4 {
    font-size: 2.2rem;
    font-weight: 700;
    color: #fff;
    background: #22b1ac;
    width: 7.909em;
    height: 2.727em;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
    position: absolute;
    top: 0.364em;
    left: 0.364em;
    bottom: 0.364em;
}

.growth-esg .list .item p {
    width: 100%;
    text-align: center;
    font-size: 2rem;
    color: #333333;
    font-weight: 500;
    position: relative;
}

.growth-esg .list .item p:before {
    content: '';
    width: 5px;
    height: 5px;
    background: #22b1ac;
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin: 0 -1em;
}

.growth-esg .btn-wrap {
    margin-top: 6.8em;
    text-align: center;
}

.growth-esg .bg {
    background: #fafafa;
    padding: 12em 0;
}

.growth-esg .titbox {
    text-align: center;
    margin-bottom: 9em;
}

.growth-esg .flex-box {
    border: solid 1px #dcdcdc;
    background: #fff;
    padding: 7.5em;
}

.growth-esg .flex-box p {
    text-align: center;
    font-size: 1.8rem;
    color: #666666;
    font-weight: 300;
    line-height: 1.667em;
}

/** 공정거래 **/

.growth-transaction .titbox {
    text-align: center;
}

.growth-transaction .titbox .tit {
    font-size: 4rem;
    color: #333333;
}

.growth-transaction .tab-nav li button {
    min-width: 304px;
}

.growth-transaction .tab-nav-con {
    display: none;
}

.growth-transaction .tab-nav-con.open {
    display: block;
}

.growth-transaction .tab-nav-con .titbox {
    margin-bottom: 10em;
}

.growth-transaction .tab-nav-con .titbox .tit {
    margin-bottom: 1.125em;
    font-size: 3.4rem;
}

.growth-transaction .tab-con1 .maxinner {
    max-width: 1128px;
}

.growth-transaction .tab-con1 .bd-t .tit {
    font-size: 3.4rem;
    color: #333333;
    text-align: center;
    margin-bottom: 2.059em;
}

.growth-transaction .tab-con1 .normal-txt {
    color: #666666;
    padding: 0 5em;
}

.growth-transaction .tab-con1 .bg {
    background: #fafafa;
    padding: 7.5em 9em;
    margin: 9.5em 0;
}

.growth-transaction .tab-con1 .bg ul li {
    margin-bottom: 4em;
}

.growth-transaction .tab-con1 .bg ul li .tit {
    display: flex;
    margin-bottom: .5em;
}

.growth-transaction .tab-con1 .bg ul li .tit span {
    font-size: 2.4rem;
    color: #33ba05;
    font-weight: 600;
    margin-right: 0.3em;
    margin-top: -0.3em;
    position: relative;
}

.growth-transaction .tab-con1 .bg ul li .tit span:after {
    content: '';
    width: 20px;
    height: 2px;
    background: #33ba05;
    display: block;
    margin: .5em 0 1em;
}

.growth-transaction .tab-con1 .bg ul li .tit p {
    font-size: 1.8rem;
    color: #666666;
    font-weight: 300;
    text-align: left;
    letter-spacing: -0.25px;
    line-height: 1.8;
}

.growth-transaction .tab-con1 .bg ul li .normal-txt {
    letter-spacing: -0.025em;
    padding: 0;
}

.growth-transaction .tab-con1 .bg ul li:last-child {
    margin-bottom: 0;
}

.growth-transaction .tab-con1 .sign {
    display: flex;
    align-items: center;
    padding: 6em 9em 0;
}

.growth-transaction .tab-con1 .sign p {
    font-size: 2rem;
    color: #333333;
    line-height: 1.5em;
    margin-right: 1.5em;
}

.growth-transaction .tab-con2 .bg {
    background: #fafafa;
    padding: 12em 0 14em;
}

.growth-transaction .tab-con2 .bg .cp-list ul {
    display: flex;
    flex-wrap: wrap;
    margin-top: -2%;
    margin-left: -2%;
}

.growth-transaction .tab-con2 .bg .cp-list ul li {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    margin-left: 2%;
    margin-top: 2%;
    padding: 3.5em 3em;
    width: 23%;
    min-height: 19.5em;
    background: #fff;
    border: 1px solid #22b1ac;
}

.growth-transaction .tab-con2 .bg .cp-list ul li .ico {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: 2em;
    bottom: 2em;
    width: 7em;
    height: 7em;
}

.growth-transaction .tab-con2 .bg .cp-list ul li strong {
    display: block;
    position: relative;
    padding-left: 1.667em;
    font-size: 1.8rem;
    color: #333333;
    font-weight: 600;
    line-height: 1.4;
}

.growth-transaction .tab-con2 .bg .cp-list ul li strong span {
    position: absolute;
    left: 0;
    top: 0;
    color: #22b1ac;
    font-weight: 700;
}

.growth-transaction .tab-con2 .icon-list .maxinner {
    max-width: 1055px;
}

.growth-transaction .tab-con2 .icon-list li {
    display: flex;
    align-items: flex-start;
    margin-bottom: 8em;
}

.growth-transaction .tab-con2 .icon-list li:last-child {
    margin-bottom: 0;
}

.growth-transaction .tab-con2 .icon-list li .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 6em;
    min-width: 55px;
    height: 55px;
}

.growth-transaction .tab-con2 .icon-list li .txt strong {
    font-size: 2rem;
    color: #333333;
    margin-bottom: 0.75em;
    display: block;
}

.growth-transaction .tab-con2 .icon-list li .txt p {
    font-size: 1.6rem;
    color: #666666;
    font-weight: 300;
    word-break: keep-all;
}

.growth-transaction .tab-con2 .btn-wrap {
    text-align: center;
}

.growth-transaction .tab-con3 .bg {
    background: #fafafa;
    padding: 9em 10em;
}

.growth-transaction .tab-con3 .bg .maxinner {
    max-width: 1260px;
}

.growth-transaction .tab-con3 .bg .flex-box {
    display: flex;
}

.growth-transaction .tab-con3 .bg .flex-box>div {
    border: solid 1px #dcdcdc;
    background: #fff;
}

.growth-transaction .tab-con3 .bg .flex-box .left {
    min-width: 25%;
    margin-right: 7em;
    padding: 6em 0;
}

.growth-transaction .tab-con3 .bg .flex-box .left ul .year {
    padding: 1.5em 0;
    text-align: center;
}

.growth-transaction .tab-con3 .bg .flex-box .left ul .year p {
    font-size: 2rem;
    color: #333333;
    font-weight: 700;
    display: inline-block;
    cursor: pointer;
    transition: 0.3s;
}

.growth-transaction .tab-con3 .bg .flex-box .left ul .year:hover p {
    color: #22b1ac;
}

.growth-transaction .tab-con3 .bg .flex-box .left ul .year.on p {
    color: #22b1ac;
    font-size: 3rem;
    text-decoration: underline;
    text-underline-position: under;
}

.growth-transaction .tab-con3 .bg .flex-box .right {
    width: 75%;
    padding: 6em;
}

.growth-transaction .tab-con3 .bg .flex-box .right .year-con {
    display: none;
}

.growth-transaction .tab-con3 .bg .flex-box .right .year-con.on {
    display: block;
}

.growth-transaction .tab-con3 .bg .flex-box .right .year-con .detail {
    display: flex;
    margin-bottom: 2.5em;
}

.growth-transaction .tab-con3 .bg .flex-box .right .year-con .detail strong {
    font-size: 1.8rem;
    color: #333333;
    font-weight: 600;
    position: relative;
    display: inline-block;
    padding: 0 1em;
    line-height: 1.667em;
}

.growth-transaction .tab-con3 .bg .flex-box .right .year-con .detail strong:before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 4px;
    background: #22b1ac;
    border-radius: 50%;
    position: absolute;
    top: .7em;
    left: 0;
    border-radius: 50%;
}

.growth-transaction .tab-con3 .bg .flex-box .right .year-con .detail p {
    font-size: 1.6rem;
    color: #666666;
    font-weight: 300;
    line-height: 1.875em;
}

.growth-transaction .tab-con3 .imgwrap {
    text-align: center;
}

/** 동방성장 소식 **/

.growth-news .titbox {
    text-align: center;
    margin-bottom: 10em;
}

.growth-news .titbox .tit {
    font-size: 4rem;
    color: #333333;
    margin-bottom: 1.125em;
}

.growth-news .board-info2 {
    padding: 1.5em 0;
    margin-bottom: 7.5em;
    background: #fafafa;
    text-align: center;
}

.growth-news .board-info2 .board-search fieldset {
    display: flex;
    justify-content: center;
    align-items: center;
}

.growth-news .board-info2 .st-select {
    min-width: 170px;
    width: auto;
    border: none;
    font-size: 1.6rem;
    color: #333333;
}

.growth-news .board-info2 .board-search fieldset .searchbox {
    overflow: hidden;
    position: relative;
}

.growth-news .board-info2 .st-inp {
    min-width: 360px;
    width: auto;
    background: none;
    border: none;
    font-size: 1.6rem;
    font-weight: 300;
}

.growth-news .board-info2 .board-search fieldset .searchbox .btnset {
    position: absolute;
    right: 0;
    top: 0;
    width: 3em;
    height: 3em;
    background: url("/images/ico/ico-search-black.png") no-repeat center;
    font-size: 1.6rem;
    line-height: 0;
    text-indent: -9999px;
}

.growth-news .board-total {
    font-size: 1.8rem;
    color: #666666;
    letter-spacing: -0.014em;
    font-weight: 300;
}

.growth-news .board-total span {
    margin-left: 5px;
    color: #22b1ac;
    font-weight: 500;
}

.growth-news .board-data-list .tbstyle03 {
    margin-top: 20px;
}

/** 동방성장 콜센터 **/

.growth-callcenter .titbox {
    text-align: center;
    margin-bottom: 10em;
}

.growth-callcenter .titbox .tit {
    font-size: 4rem;
    color: #333333;
    margin-bottom: 1.125em;
}

.growth-callcenter .imgwrap {
    padding-top: 5em;
    text-align: center;
}

.growth-callcenter .sec01 {
    padding: 10em 0;
    margin-top: 11em;
    background: #fafafa;
}

.growth-callcenter .sec01 .maxinner {
    max-width: 1080px;
}

.growth-callcenter .sec01 .normal-sm-txt {
    margin-top: 0;
}

.growth-callcenter .sec01 dl {
    margin-top: 10em;
}

.growth-callcenter .sec01 dl:first-child {
    margin-top: 0;
}

.growth-callcenter .sec01 dt {
    margin-bottom: 1em;
    font-size: 3.4rem;
    color: #333333;
    letter-spacing: -0.011em;
    font-weight: 700;
}

.growth-callcenter .sec01 dt:after {
    /*content:'';*/
    display: block;
    width: 3rem;
    height: 2px;
    background: #333;
    margin: 2rem auto;
}

.growth-callcenter .sec01 dd {
    font-size: 1.6rem;
}

.growth-callcenter .sec01 ul li {
    display: inline-block;
    margin-left: 2.857em;
    vertical-align: middle;
}

.growth-callcenter .sec01 ul li:first-child {
    margin-left: 0;
}

.growth-callcenter .sec01 ul li span {
    display: inline-block;
    position: relative;
    padding-right: 0.7em;
    margin-right: 0.4em;
    color: #22b1ac;
    vertical-align: middle;
    font-weight: 600;
}

.growth-callcenter .sec01 ul li span:after {
    content: "";
    position: absolute;
    right: 0;
    top: 10px;
    width: 1px;
    height: 10px;
    background: #acacac;
}

.growth-callcenter .sec01 ul li p {
    display: inline-block;
    vertical-align: middle;
}

.growth-callcenter .sec01 .btnwrap {
    margin-top: 5em;
}

.growth-callcenter .sec01 .btn-type01.black:hover {
    background: #22b1ac;
    border-color: #22b1ac;
}

/**** 지속가능경영 >  안전보건 ****/

/** 전략 **/

.safety .sub-depth-nav-wrap {
    margin-top: 11em;
}

.safety-strategy {
    padding-bottom: 0 !important;
}

.safety-strategy .titbox {
    text-align: center;
    margin-bottom: 10em;
}

.safety-strategy .titbox .tit {
    font-size: 4rem;
    color: #333333;
    margin-bottom: 1.125em;
}

.safety-strategy .tri {
    background: url("/images/sub/management/safety-strategy-img01.png") no-repeat center top;
    display: flex;
    height: 21.6em;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.safety-strategy .tri p {
    font-size: 2.6rem;
    font-weight: 700;
    color: #333;
}

.safety-strategy .listbox {
    margin: 0 auto;
    max-width: 960px;
    width: 100%;
    text-align: left;
}

.safety-strategy .listbox>li {
    display: flex;
    align-items: center;
    margin-top: 3em;
    position: relative;
}

.safety-strategy .listbox>li .tit {
    display: block;
    position: relative;
    width: 9.615em;
    font-size: 2.6rem;
    color: #22b1ac;
    letter-spacing: -0.010em;
    font-weight: 700;
    text-align: left;
    padding-left: 1.5em;
    position: absolute;
    left: -9.6em;
}

.safety-strategy .listbox>li .tit:before {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -0.5px;
    width: 22%;
    height: 1px;
    background: #22b1ac;
}

.safety-strategy .listbox>li .tit:after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -4.5px;
    margin-right: -4.5px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #22b1ac;
}

.safety-strategy .listbox>li .con {
    width: 100%;
    box-shadow: 0 0 18px rgb(212 212 212 / 46%);
}

.safety-strategy .listbox>li.list01 .tit {
    padding-left: 4.7em;
}

.safety-strategy .listbox>li.list01 .con {
    background: #fff;
    border: 1px solid #33ba05;
    text-align: center;
    box-shadow: 1px 1px 10px rgb(200 200 200 / 50%);
}

.safety-strategy .listbox>li.list01 p {
    padding: 1em 0;
    font-size: 2rem;
    color: #333333;
    line-height: 1.667em;
    font-weight: 500;
    letter-spacing: -0.014em;
}

.safety-strategy .listbox li.list02 .con {
    padding: 5.5em 9.5em;
    background: #fff;
}

.safety-strategy .listbox li.list02 ul {
    display: flex;
    justify-content: space-between;
    margin-left: -11%;
}

.safety-strategy .listbox li.list02 ul li {
    margin-left: 11%;
    width: 22.3333%;
}

.safety-strategy .listbox li.list02 ul li .ico {
    position: relative;
    padding-bottom: 100%;
    width: 100%;
    border-radius: 50%;
    border: 1px solid #22b1ac;
    box-shadow: 1px 1px 10px rgb(200 200 200 / 30%);
}

.safety-strategy .listbox li.list02 ul li .ico:before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    background: #dcdcdc;
    border-radius: 100%;
    position: absolute;
    top: 50%;
    left: 120%;
    transform: translateY(-50%);
}

.safety-strategy .listbox li.list02 ul li:nth-child(2) .ico:before {
    left: 127%;
}

.safety-strategy .listbox li.list02 ul li:last-child .ico:before {
    display: none;
}

.safety-strategy .listbox li.list02 ul li .ico img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.safety-strategy .listbox li.list02 ul li:nth-child(2) .ico:after {
    width: 115%;
    padding-bottom: 115%;
    content: '';
    display: block;
    position: absolute;
    border-radius: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: dotted 2px #22b1ac;
}

.safety-strategy .listbox li.list02 ul li p {
    margin-top: 1.667em;
    font-size: 1.8rem;
    color: #333333;
    letter-spacing: -0.028em;
    line-height: 1.389em;
    text-align: center;
}

.safety-strategy .listbox li.list02 ul li p span {
    color: #33ba05;
    font-weight: 700;
}

.safety-strategy .listbox li.list03 .con {
    width: 100%;
    box-shadow: 0 0 18px rgb(212 212 212 / 46%);
    background: #22b1ac;
    border-radius: 40px;
}

.safety-strategy .listbox li.list03 p {
    font-size: 2rem;
    color: #ffffff;
    font-weight: 700;
    text-align: center;
    padding: 3rem 0;
}

.safety-strategy .bg {
    background: #fafafa;
    padding: 12em 0 18em;
    margin-top: 13em;
}

.safety-strategy .bg .maxinner {
    max-width: 1260px;
}

.safety-strategy .bg .box {
    border: solid 1px #ececec;
    background: #fff;
    padding: 9em 5em;
}

.safety-strategy .bg .box p {
    font-size: 1.8rem;
    color: #666666;
    font-weight: 300;
    text-align: center;
    line-height: 1.667em;
}

/** 관리체계 **/

.safety-management .titbox {
    text-align: center;
    margin-bottom: 7em;
}

.safety-management .titbox .tit {
    font-size: 4em;
    color: #333333;
    margin-bottom: 1.125em;
}

.safety-management .bg {
    padding: 5em 0;
}

.safety-management .bg .imgwrap {
    text-align: center;
}

.safety-management .bg .imgwrap img {
    margin: 0 auto;
}

.safety-management .list-wrap .maxinner {
    max-width: 1260px;
}

.safety-management .list {
    display: flex;
    flex-wrap: wrap;
    border: solid 1px #ececec;
    border-bottom: none;
    border-right: none;
}

.safety-management .list .item {
    width: 33.3%;
    flex: 0 0 auto;
    border-right: solid 1px #ececec;
    border-bottom: solid 1px #ececec;
    padding: 5em;
    min-height: 35em;
}

.safety-management .list .item>p {
    font-size: 3rem;
    color: #22b1ac;
    font-weight: 800;
    margin-bottom: 0.6em;
}

.safety-management .list .item h4 {
    font-size: 2rem;
    color: #333333;
    font-weight: 700;
    margin-bottom: 1em;
}

.safety-management .list .item ul li {
    display: flex;
    flex-wrap: wrap;
}

.safety-management .list .item ul li span {
    width: 3px;
    height: 3px;
    background: #aaa;
    display: inline-flex;
    border-radius: 50%;
    margin: 12px 10px 0 0;
}

.safety-management .list .item ul li p {
    font-size: 1.6rem;
    color: #666666;
    font-weight: 300;
    line-height: 1.75em;
    width: calc(100% - 13px);
}

/** 인증현황 **/

.safety-certification.sub-con {
    padding-bottom: 0;
}

.safety-certification .titbox {
    text-align: center;
    margin-bottom: 7em;
}

.safety-certification .titbox .tit {
    font-size: 4em;
    color: #333333;
    margin-bottom: 1.125em;
}

.safety-certification .bg {
    background: #fafafa;
    padding: 9em 0 18em;
}

.safety-certification .imgwrap {
    text-align: center;
}

.safety-certification .imgwrap img {
    margin: 0 4.5em;
    box-shadow: 10px 0 27px rgb(0 0 0 / 11%);
}

/* IR 자료 - 오디오 태그 */

.audio-cell {
    min-width: 350px;
}

.audio-cell audio {
    width: 100%;
    display: flex;
    align-items: center;
}

.audio-cell audio::-webkit-media-controls-current-time-display {
    font-size: 12px;
}

.audio-cell audio::-webkit-media-controls-time-remaining-display {
    font-size: 12px;
}