/* 서브페이지 메인 - 공통설정 */
body {position: relative; z-index: -999;}
section h4 {font-size: 1.8rem; font-weight: 700;}
section h3 {font-size: 2.2rem; font-weight: 500; color: #3e8eac;}
section h2 {font-size: 4.2rem; font-weight: 700; margin-top: 10px;}
section p {font-size: 1.6rem; font-weight: 500; color: #333;}

/* section01 - 회사소개 페이지 메인영역*/
.section01 {padding-top: 200px; position: relative; z-index: -1;}
.section01 article {height: 100%; align-content: center;}
.section01 .bg {width: 100%; height: 100%; background: url(images/sub01/bgEffect01.png) no-repeat center / cover;
    opacity: 0.7; position: absolute; top: 0; z-index: -999;}
.section01 .contents_wrap {display: flex;}
.section01 .contents_wrap .contents_box {width: 50%; height: 100%;}
.section01 .contents_wrap .text_box {line-height: 30px; padding-right: 20px; margin-top: 60px; text-align: justify;}
.section01 .contents_wrap p {margin-bottom: 60px;}
.section01 .contents_wrap .img_box {width: 50%; height: 800px; align-content: center; border-radius: 65px;
box-shadow: 3px 5px 10px rgba(0, 0, 0, 0.3);}
.section01 .contents_wrap .ceo_img {background: url(images/sub01/ceo.png) no-repeat center center / cover;
width: 100%; height: 100%; border-radius: 65px;}

/* section02 - 경영이념 */
.section02 {padding: 180px 0; align-content: center; position: relative;}
.section02 .bg {background: url(images/sub01/bgEffect02.png)no-repeat center / cover; width: 100%; height: 100%; 
    opacity: 0.5; position: absolute; top: 0;}
.section02 .contents_wrap {display: flex; justify-content: space-between; margin-top: 60px;}
.section02 .contents_wrap ul {width: 33.333%; height: 410px; margin-right: 20px; 
    box-shadow: 1px 10px 15px rgba(0, 0, 0, 0.1);}
.section02 .contents_wrap ul:last-child {margin: 0;}
.section02 .contents_wrap ul li {width: 100%; height: 50%; background: #fff;}
.section02 .contents_wrap ul li:last-child {text-align: justify; align-content: center; line-height: 30px;}
.section02 .contents_wrap ul p {padding: 0 30px;}
.section02 .contents_wrap .img_box:hover {filter: brightness(0.9);}
.section02 .contents01 .img_box {width: 100%; height: 100%; background: url(images/sub01/contents01.png)no-repeat left top / cover;}
.section02 .contents01 h4 {position: relative; bottom: 70px; color: #fff; text-align: center;}
.section02 .contents02 .img_box {width: 100%;; height: 100%; background: url(images/sub01/contents02.png)no-repeat left top / cover;}
.section02 .contents02 h4 {position: relative; bottom: 70px; color: #fff; text-align: center;}
.section02 .contents03 .img_box {width: 100%; height: 100%; background: url(images/sub01/contents03.png)no-repeat left top / cover;}
.section02 .contents03 h4 {position: relative; bottom: 70px; color: #fff; text-align: center;}

/* section03 - 회사연혁 */
.section03 {padding: 100px 0; align-content: center; background: url(images/sub01/history_bg.png) no-repeat center center / cover;}
.section03 h2, .section03 h3 {color: #fff;}
.section03 .contents_wrap {display: flex; height: 500px; margin-top: 60px; background: rgba(0, 0, 0, 0.2);
    padding: 30px; border-radius: 20px;}
.section03 .contents_wrap ul {width: 60%; height: 100%; }
.section03 .contents_wrap ul:last-child {width: 40%}
.section03 .contents_wrap ul > li {display: flex; line-height: 35px;}
.section03 .contents_wrap ul > li > p {margin-right: 20px; color: #fff;}

/* section04 - 글로벌 파트너쉽 */
.section04 {height: 1600px; position: relative; align-content: center;}
.global_bg {height: 1758px; width: 100%; background: url(images/sub01/global_bg.png) no-repeat top center / cover;
position: absolute; z-index: -999; top: 0;}
.section04 .tit_box {margin-bottom: 185px;}
.section04 .img_box {max-width: 1050px; height: 718px; margin: 0 auto; }
.section04 .img_box a {width: 100%; height: 100%; background: url(images/sub01/global.png) no-repeat center / contain; animation: globalani 2s linear forwards infinite;}
@keyframes globalani {
    0% {rotate: 0deg;}
    50% {rotate: 1deg;}
}


/* 반응형 */
@media screen and (max-width: 1400px) {
    article {padding: 0 20px;}
}

@media screen and (max-width: 1200px) {
    .section02 .contents_wrap {flex-wrap: wrap; margin-top: 40px;}
    .section02 .contents_wrap ul {width: 49%; margin: 0;}
    .section02 .contents03 {display: none;}
    .section03 .contents_wrap {padding: 20px;}
}

@media screen and (max-width: 1100px) {
    .section03 .contents_wrap {padding: 30px 0px 30px 20px;}
    .section03 .contents_wrap ul:last-child li p:last-child {margin: 0;}
}

@media screen and (max-width: 955px) {
    section h3 {font-size: 1.8rem;}
    section h2 {font-size: 3.2rem;}
    section p {font-size: 1.4rem;}

    .section02 .contents_wrap h4 {font-size: 1.6rem;}
    .section03 .contents_wrap ul {width: 100%; align-content: center;}
    .section03 .contents_wrap ul:last-child {display: none;}
    .mb_global_text {display: block;}
}

@media screen and (max-width: 800px) {
    .section01 .contents_wrap {flex-wrap: wrap;}
    .section01 .contents_wrap .contents_box {width: 100%; height: 40%; align-content: center;}
    .section01 .contents_wrap .text_box {padding: 0; margin-top: 40px; line-height: 30px;}
    .section01 .contents_wrap .text_box p {margin-bottom: 10px; margin: 0; display: inline;}
    .section01 .contents_wrap .img_box {width: 100%; height: 400px;}
    .section01 .contents_wrap .ceo_img {background-position: center 20%;}
    .section04 {height: 1000px;}
    .section04 .tit_box {margin: 0px;}
    .global_bg {height: 1200px;} 
}

@media screen and (max-width: 600px) {
    section h3 {font-size: 1.6rem;}
    section h2 {font-size: 2.6rem;}
    .section01 {padding-top: 120px;}
    .section02 .contents_wrap ul p {padding: 0 10px; text-align: justify; line-height: 25px;}
    .section03 ul li p:last-child {margin: 0;}
    .section04 {height: 900px;}
}

@media screen and (max-width: 550px) {
    .section02 .contents_wrap {flex-wrap: wrap;} 
    .section02 .contents_wrap ul {width: 100%; margin-top: 50px;}
    .section03 .contents_wrap {padding: 0 5px;}
    .section03 .contents_wrap ul > li > p:last-child {font-size: 1.2rem;}
    .section04 {height: 800px;}
    .section04 .img_box {height: 500px;}
}

@media screen and (max-width: 450px) {
    .section03 .contents_wrap ul > li > p {margin-right: 10px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

}