@charset "utf-8";

#container {padding-top: 223px;}
#container section {max-width: 1200px; width: 100%; margin: 0 auto;}


.sec1 {padding-top: 101px;}
.sec1 .inner_box > div a {display:block; width:100%; height:100%;}
.sec1 .img_box {height: 762px; display: table; width: 100%;}
.sec1 .img_box .img_wrap {display: table-cell;}
.sec1 .box1 {margin-bottom: 25px;}
.sec1 .box1 .img_wrap {height: 762px;}
.sec1 .box1 .img_wrap:nth-child(1) {padding-right: 10px; width: 57.95%;}
.sec1 .box1 .img_wrap:nth-child(2) {padding-left: 10px;}
.sec1 .img_box .img_wrap .img1 {background: url(../images/main/sec1_01.jpg) no-repeat center; height: 762px; background-size: cover;}
.sec1 .img_box .img_wrap .img2 {background: url(../images/main/sec1_02.jpg) no-repeat right center; height: 345px; margin-bottom: 20px; background-size: cover;}
.sec1 .img_box .img_wrap .img3 {background: url(../images/main/sec1_03.png) no-repeat center #5e655e; height: 90px; margin-bottom: 20px}
.sec1 .img_box .img_wrap .img4 {background: url(../images/main/sec1_04.png) no-repeat center #778b7b; height: 90px; margin-bottom: 20px}
.sec1 .img_box .img_wrap .img5 {/* background: url(../images/main/sec1_05.jpg) no-repeat center;  background-size: cover; */height: 177px; /* margin-bottom: 20px */}

.sec1 .img_box .img_wrap .img5_1 {background: url(../images/main/sec1_05_1.jpg) no-repeat center; width: 33.5%; height: 177px; background-size: cover; display:inline-block;}
.sec1 .img_box .img_wrap .img5_2 {background: url(../images/main/sec1_05_2.jpg) no-repeat center; width: 62.5%; height: 177px; background-size: cover;  display:inline-block; margin-left:16px; }

.sec1 .box2 {position: relative; padding-right: 310px; margin-bottom: 20px;}
.sec1 .box2 .img_wrap:nth-child(1) {padding-right: 20px;}
.sec1 .box2 .img_wrap:nth-child(1) .txt1 {text-align: center; word-break: keep-all; font-family: 'Hind', sans-serif; font-size: 20px; line-height: 28px; color: #222522; background-color: #e6e7e8; position: relative; padding: 87px 25px 93px;}
.sec1 .box2 .img_wrap:nth-child(1) .txt1 span {position: relative;}

.sec1 .box2 .img_wrap:nth-child(1) .txt1 .icon1::before {content: ''; width: 25px; height: 20px;  background: url(../images/main/sec1_txt_1_1.png) no-repeat center; position: absolute; top: -40px; right: -25px;}
.sec1 .box2 .img_wrap:nth-child(1) .txt1 .icon2::before {content: ''; width: 25px; height: 20px; background: url(../images/main/sec1_txt_1_2.png) no-repeat center; position: absolute; bottom: -40px; left: -25px;}

.sec1 .box2 .img_wrap:nth-child(2) .img6 {position: absolute; height: 100%; background: url(../images/main/sec1_06.jpg) no-repeat center #00062a; right: 0px; top: 0px; width: 310px;}

.sec1 .box3 {display: table; table-layout: fixed; width: 100%; margin-bottom: 20px;}
.sec1 .box3 .img_wrap {display: table-cell; height: 499px;}
.sec1 .box3 .img_wrap:nth-child(1) {padding-right: 10px;}
.sec1 .box3 .img_wrap:nth-child(2) {padding-left: 10px;}
/*.sec1 .box3 .img_wrap .img7 {height: 499px; background: url(../images/main/sec1_07.jpg) no-repeat left center;}*/
.sec1 .box3 .img_wrap .img7 {height: 499px; background: url(../images/main/sec1_07_2.jpg) no-repeat left center;}
.sec1 .box3 .img_wrap .img8 {height: 499px; background: url(../images/main/sec1_08.jpg) no-repeat left center;}

.sec1 .box4 {font-size: 0px; padding-bottom: 103px; clear: both;}
.sec1 .box4 div {display: inline-block; width: 23.92%; margin-right: 1.42%; height: 285px;}
.sec1 .box4 div.img9 {background: url(../images/main/sec1_09_2.jpg) no-repeat center;}
.sec1 .box4 div.img10 {background: url(../images/main/sec1_10.jpg) no-repeat center; float: right; margin-right: 0;}
.sec1 .box4 div.img11 {background: url(../images/main/sec1_11.jpg) no-repeat center;}
.sec1 .box4 div.img13 {background: url(../images/main/sec1_13.jpg) no-repeat center;}
.sec1 .box4 div.img12 {background: url(../images/main/sec1_12.jpg) no-repeat center;}
/*.sec1 .box4 div.img12 {background: url(../images/main/sec1_12.jpg) no-repeat center; float: right; margin-right: 0;}*/

/* PC */
@media all and (min-width:1025px){
    .sec1 .img_box .img_wrap .img5 {display: flex; flex-flow: wrap; height: auto;}
    .sec1 .img_box .img_wrap .img5_1 {width: calc(37.3% - 17px); position: relative; padding-bottom: 35.787%; height: auto;}
    .sec1 .img_box .img_wrap .img5_2 {width: 62.7%; position: relative; padding-bottom: 35.787%; height: auto;}
    .sec1 .img_box .img_wrap .img5 a {position: absolute; top: 0px; left: 0px;}
    
    .sec1 .box3 {display: flex; flex-flow: wrap;}
    .sec1 .box3 .img_wrap {padding-right: 0!important; padding-left: 0!important; padding-bottom: 41.584%; position: relative; width: calc(50% - 10px); height: auto;}
    .sec1 .box3 .img_wrap:nth-child(1) {margin-right: 20px;}
    .sec1 .box3 .img_wrap .img7 {position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; background-size: cover;}
    .sec1 .box3 .img_wrap .img8 {position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; background-size: cover;}
}

@media all and (max-width:1300px){
    #container section .inner_box {padding: 0 20px;}
}

@media all and (max-width:1300px){
    #container section .inner_box {padding: 0 20px;}
}

/* 태블릿&모바일 공통*/

@media all and (max-width:1024px){
	#container {padding-top: 71px;}

    .sec1 {padding-top: 50px;}
    .sec1 .box1 {margin-bottom: 10px;}
    .sec1 .img_box .img_wrap {display: block; width: 100%!important; padding: 0!important; height: auto;}
    .sec1 .img_box .img_wrap:nth-child(1) {margin-bottom: 10px;}
    .sec1 .img_box .img_wrap .img1 {height: 372px; background-position: center top;}
    .sec1 .img_box .img_wrap .img2 {height: 233px; background-position: center bottom; margin-bottom: 10px;}
    .sec1 .img_box .img_wrap .img3 {height: 61px; background-size: 198px; margin-bottom: 10px;}
    .sec1 .img_box .img_wrap .img4 {height: 61px; background-size: 198px; margin-bottom: 10px;}
    /*.sec1 .img_box .img_wrap .img5 {height: 120px;}*/
    .sec1 .img_box .img_wrap .img5 {display: flex; flex-flow: wrap; height: auto;}
    .sec1 .img_box .img_wrap .img5_1 {width: calc(37.3% - 10px); position: relative; padding-bottom: 35.787%; height: auto;}
    .sec1 .img_box .img_wrap .img5_2 {width: 62.7%; position: relative; padding-bottom: 35.787%; height: auto; margin-left: 10px;}
    .sec1 .img_box .img_wrap .img5 a {position: absolute; top: 0px; left: 0px;}

    .sec1 .box2 {padding-right: 0px; margin-bottom: 10px;}
    .sec1 .box2 .img_wrap:nth-child(1) {padding-right: 0px; padding-bottom: 10px;}
    .sec1 .box2 .img_wrap:nth-child(1) .txt1 {padding: 43px 22px 40px; font-size: 15px; line-height: 19px;}
    .sec1 .box2 .img_wrap:nth-child(1) .txt1 .icon1::before {width: 13px; height: 10px; background-size: 13px!important; top: -16px; right: -13px;}
    .sec1 .box2 .img_wrap:nth-child(1) .txt1 .icon2::before {width: 13px; height: 10px; background-size: 13px!important; bottom: -16px; left: 0px;}
    .sec1 .box2 .img_wrap:nth-child(2) .img6 {position: relative; height: 61px; background: url(../images/main/sec1_06_m.png) no-repeat center #00062a; width: 100%;}

    .sec1 .box3 {display: block; margin-bottom: 10px;}
    .sec1 .box3 .img_wrap {display: block; width: 100%; height: auto; padding: 0!important;}
    .sec1 .box3 .img_wrap div {background-size: cover!important; height: 282px!important;}
    .sec1 .box3 .img_wrap .img7 {background-position: left bottom; margin-bottom: 10px;}
    .sec1 .box3 .img_wrap .img8 {background-position: left top;}

    .sec1 .box4 {padding-bottom: 50px; height: 334px;}
    .sec1 .box4 div {width: 48.5%; margin-right: 0px; height: 162px; background-size: cover!important;}
    .sec1 .box4 div.img9, .sec1 .box4 div.img10 {margin-bottom: 10px;}
    .sec1 .box4 div:nth-child(2n) {float: right;}
    .sec1 .box4 div.img11 {float: left;}
}

/* 모바일 */
@media all and (max-width:768px){
    /*.sec1 .img_box .img_wrap .img5_1 {width:33%; height: 120px;}*/
	/*.sec1 .img_box .img_wrap .img5_2 {width:63%; height: 120px; margin-left:8px;}*/
}