@charset "UTF-8";
#main,
#mainVisual {
  position: relative;
}

/* 제목 */
.tit_s1 h2 {
  font-size: 3.4375rem;
  color: #272727;
  font-weight: 900;
  position: relative;
  display: inline-block;
}

.tit_s1 h2:before {
  content: "";
  width: 16px;
  height: 7px;
  background: #284b93;
  display: block;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  margin: 0 auto 13px;
}

.tit_s1 p {
  font-size: 1.125rem;
  line-height: 1.6em;
  color: #3f3f3f;
  margin-top: 23px;
}

.tit_s1.center {
  text-align: center;
}

.tit_s1.white h2 {
  color: #fff;
}

/* 폰트 */
.fontExo {
  font-family: "Exo", sans-serif;
}

/* tab */
.tab_s1 {
  margin-bottom: 38px;
  margin-top: 43px;
}

.tab_s1 ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.tab_s1 ul li a {
  font-size: 1.125rem;
  color: #424242;
  display: block;
  padding: 8px 16px;
  border-bottom: 3px solid #d7d7d7;
}

.tab_s1 ul li.on a {
  border-bottom: 3px solid #284b93;
}

.more_s1 {
  position: relative;
  z-index: 1;
}

.more_s1 a {
  text-align: center;
  display: block;
  width: 170px;
  height: 45px;
  border: 1px solid #fff;
  font-size: 13px;
  font-weight: 500;
  margin: 0 auto;
  line-height: 45px;
  color: #fff;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.more_s1 a img {
  margin-left: 26px;
  vertical-align: middle;
}

.more_s1 a:hover {
  background: #284b93;
}

/* 메인 비주얼 */
#mainVisual article {
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
  background: #1b3a7c;
}

#mainVisual img {
  max-height: 100%;
  margin: 0 auto;
}

/* #mainContents #eSkil {
  background: #e8ebf2;
  padding-top: 32px;
  height: 605px;
} */

#mainContents #eSkil > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#mainContents #eSkil .tit_s1 {
  /* width: 39.76923076923%; */
  /* padding-top: 60px; */
}

#mainContents #eSkil .newsList {
  width: 60.23076923077%;
}

#mainContents #eSkil .newsList .slick-list {
  max-height: 340px;
  overflow: hidden;
}

#mainContents #eSkil .newsList ul li {
  margin-bottom: 19px;
  padding-bottom: 19px;
  border-bottom: 1px solid #cdd0d7;
}

#mainContents #eSkil .newsList ul li:nth-child(2n) {
  border: none;
}

#mainContents #eSkil .newsList ul li a {
  display: block;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#mainContents #eSkil .newsList ul li .img {
  width: 166px;
  margin-right: 54px;
  overflow: hidden;
  padding-top: 19.5822%;
  position: relative;
}

#mainContents #eSkil .newsList ul li .img img {
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  position: absolute;
  max-height: 100%;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

#mainContents #eSkil .newsList ul li dl {
  width: calc(100% - 220px);
  padding-top: 22px;
}

#mainContents #eSkil .newsList ul li dl dt {
  font-size: 1.25rem;
  color: #2d2d2d;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#mainContents #eSkil .newsList ul li dl dd {
  line-height: 1.625rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin-top: 23px;
}

#mainContents #eSkil .newsList ul li:hover img {
  -webkit-transform: scale(1.1) translate(-47.8%, -47.8%);
          transform: scale(1.1) translate(-47.8%, -47.8%);
}

#mainContents #eSkil .newsList .slick-arrow {
  background-repeat: no-repeat;
  width: 14px;
  height: 12px;
  border: none;
  font-size: 0;
  position: absolute;
  right: 0;
  z-index: 10;
}

#mainContents #eSkil .newsList .slick-prev {
  background-image: url("/img/main/newsList_prev.png");
  top: calc(50% - 19px);
}

#mainContents #eSkil .newsList .slick-next {
  background-image: url("/img/main/newsList_next.png");
  top: calc(50% + 19px);
}

#mainContents #bnGroup {
/*   margin-top: -202px; */
}

#mainContents #bnGroup ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#mainContents #bnGroup ul li {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  height: 256px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  overflow: hidden;
}

#mainContents #bnGroup ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  padding: 0 10.46153846154%;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  position: relative;
}

#mainContents #bnGroup ul li .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

#mainContents #bnGroup ul li:nth-child(1) .bg {
  background-image: url("/img/main/cnd_bg.jpg");
}

#mainContents #bnGroup ul li:nth-child(2) .bg {
  background-image: url("/img/main/ipoffice_bg.jpg");
}

#mainContents #bnGroup ul li dl {
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  color: #fff;
  position: relative;
  z-index: 1;
}

#mainContents #bnGroup ul li dl dt {
  font-size: 3rem;
  font-family: "Exo", sans-serif;
  font-weight: 800;
}

#mainContents #bnGroup ul li dl dd {
  line-height: 1.75em;
  margin-top: 22px;
}

#mainContents #bnGroup ul li:hover .bg {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

#mainContents #bnGroup ul li:hover dl {
  -webkit-transform: translateX(25px);
          transform: translateX(25px);
}

#mainContents #community {
  padding: 120px 0;
}

#mainContents #community .slideWrap .tabCont {
  display: none;
}

#mainContents #community .slideWrap .tabCont:first-child {
  display: block;
}

#mainContents #community .slideWrap .tabCont .slick-list {
  margin: 0 -10px;
}

#mainContents #community .slideWrap .tabCont .item {
  margin: 0 10px;
  border-bottom: 1px solid #c9c9c9;
  padding-bottom: 28px;
}

#mainContents #community .slideWrap .tabCont .item .img {
  overflow: hidden;
  padding-top: 61.29032258065%;
  position: relative;
  border: 1px solid #ddd;
}

#mainContents #community .slideWrap .tabCont .item .img img {
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  max-height: 100%;
}

#mainContents #community .slideWrap .tabCont .item:hover {
  border-bottom: 1px solid #575757;
}

#mainContents #community .slideWrap .tabCont .item:hover .img img {
  -webkit-transform: scale(1.1) translate(-45%, -45%);
          transform: scale(1.1) translate(-45%, -45%);
}

#mainContents #community .slideWrap .txtBox {
  margin-top: 36px;
}

#mainContents #community .slideWrap .txtBox dl {
  margin-bottom: 22px;
}

#mainContents #community .slideWrap .txtBox dl dt {
  font-size: 1.125rem;
  color: #2d2d2d;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#mainContents #community .slideWrap .txtBox dl dd {
  line-height: 1.625em;
  min-height: 52px;
  margin-top: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

#mainContents #community .slideWrap .txtBox .more img {
  position: static;
  -webkit-transform: translate(0);
          transform: translate(0);
}

#mainContents #community .slideWrap .slick-arrow {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: 1px solid #c8c8c8;
  background-repeat: no-repeat;
  background-position: center;
  overflow: hidden;
  text-indent: -9999px;
  background-color: unset;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
#mainContents #community .slideWrap .slick-arrow:hover{background-color: #28386e;} 
#mainContents #community .slideWrap .slick-prev {
  background-image: url("/img/main/slick_arrow_prev.png");
  left: -96px;
}
#mainContents #community .slideWrap .slick-prev:hover {
  background-image: url("/img/main/slick_arrow_prevH.png");
  left: -96px;
}
#mainContents #community .slideWrap .slick-next {
  background-image: url("/img/main/slick_arrow_next.png");
  right: -96px;
}
#mainContents #community .slideWrap .slick-next:hover {
  background-image: url("/img/main/slick_arrow_prevH.png");
  left: -96px;
}
#mainContents #network {
  background: url("/img/main/network_bg.jpg") no-repeat center;
  background-attachment: fixed;
  padding: 121px 0;
  text-align: center;
}

#mainContents #network .map {
  margin-top: 74px;
  position: relative;
  display: inline-block;
}

#mainContents #network ul,
#mainContents #network .countryList {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

#mainContents #network .countryList li {
  position: absolute;
}

#mainContents #network .countryList li.america {
  left: 2.57092198582%;
  top: 7.29366602687%;
}

#mainContents #network .countryList li.belgium {
  left: 47.87234042553%;
  top: 13.43570057582%;
}

#mainContents #network .countryList li.spain {
  left: 43.79432624113%;
  top: 23.2245681382%;
}

#mainContents #network .countryList li.israel {
  left: 55.31914893617%;
  top: 31.09404990403%;
}

#mainContents #network .countryList li.korea {
  right: 11.08156028369%;
  top: 23.2245681382%;
}

#mainContents #network .countryList li.singapore {
  right: 17.46453900709%;
  top: 46.25719769674%;
}

#mainContents #network .more_s1 {
  margin-top: -26px;
}

#mainContents #contactUs {
  background: url("/img/main/contactUs.jpg") no-repeat center;
  background-attachment: fixed;
  padding: 95px 0;
}

#mainContents #contactUs .contactForm {
  margin-top: 58px;
}

.contactForm .inputBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.contactForm .inputBox ul {
  margin-right: 34px;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
}

.contactForm .inputBox ul:last-child {
  margin: 0;
}

.contactForm .inputBox ul li {
  margin-bottom: 10px;
}

.contactForm .inputBox ul li:last-child {
  margin: 0;
}

.contactForm .inputBox ul li input[type="text"] {
  height: 60px;
}

.contactForm .inputBox ul li input,
.contactForm .inputBox ul li textarea {
  width: 100%;
  border: 1px solid #fff;
  background: rgba(255, 255, 255, 0.2);
  font-size: 1.125rem;
  padding-left: 25px;
}

.contactForm .inputBox ul li textarea {
  padding-top: 18px;
  resize: none;
  max-height: 193px;
}

.contactForm .agreeBox {
  position: relative;
}

.contactForm .agreeBox input[type="checkBox"] {
  position: absolute;
  left: -9999px;
}

.contactForm .agreeBox input[type="checkBox"]:checked + label span {
  background: #284b93;
  border: 3px solid #284b93;
}

.contactForm .agreeBox label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #3f3f3f;
  font-size: 14px;
}

.contactForm .agreeBox label span {
  width: 13px;
  height: 13px;
  border: 3px solid #242424;
  display: inline-block;
  margin-right: 10px;
}

.contactForm .agreeBox .txt {
  margin-top: 14px;
  height: 100%;
  max-height: 102px;
  overflow-y: scroll;
  border: 1px solid #fff;
  background: rgba(255, 255, 255, 0.2);
  padding: 20px;
  font-size: 14px;
  line-height: 1.4;
}

.contactForm .submitBtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 20px;
}

.contactForm .submitBtn input[type="submit"] {
  background: #1b3a7c;
  color: #fff;
  width: 233px;
  height: 56px;
  border: none;
  font-size: 1.125rem;
  font-weight: 500;
}

::-webkit-input-placeholder {
  /* Edge */
  color: #3f3f3f;
}

:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #3f3f3f;
}

::-ms-input-placeholder {
  color: #3f3f3f;
}

::placeholder {
  color: #3f3f3f;
}

.where {
  display: block;
  margin: 25px 15px;
  font-size: 11px;
  color: #000;
  text-decoration: none;
  font-family: verdana;
  font-style: italic;
}

.filebox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

.filebox input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.filebox label {
  width: 139px;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #999;
  font-size: inherit;
  line-height: normal;
  vertical-align: middle;
  background-color: #fdfdfd;
  cursor: pointer;
  border: 1px solid #ebebeb;
  border-bottom-color: #e2e2e2;
}

/* named upload */
.filebox .upload-name {
  display: inline-block;
  padding: 0.5em 0.75em;
  font-size: inherit;
  font-family: inherit;
  line-height: normal;
  vertical-align: middle;
  background-color: #f5f5f5;
  border: 1px solid #ebebeb;
  border-bottom-color: #e2e2e2;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.filebox.bs3-primary label {
  color: #fff;
  background-color: #1b3a7c;
  border-color: #1b3a7c;
}


/* 230307 추가 */
figure{margin: 0;}
#eSkil.mod{padding:125px 0;}
.mod *{word-break:keep-all}
#eSkil.mod .flex_box{display:flex; width: 100%;}
#eSkil.mod .flex_box .box{text-align: center; width: 50%;}
#eSkil.mod .flex_box .tit_s1{width: 100%;}
#eSkil.mod .flex_box .tit_s1 h2{font-weight:700;}
#eSkil.mod .flex_box .slide_wrap{position:relative; max-width: 510px; margin-left: 28px; margin-right: auto; text-align: left;}
#eSkil.mod .flex_box .box:last-of-type .slide_wrap{margin-right: 28px; margin-left: auto;}
#eSkil.mod .flex_box .slide_wrap .slide_btn{}
#eSkil.mod .flex_box .slide_wrap .slide_btn > div{}
#eSkil.mod .flex_box .slide_wrap .slide_ctn{padding: 26px 0;}
#eSkil.mod .flex_box .slide_wrap .slide_ctn .slick-list{margin-right: -24px;}
#eSkil.mod .flex_box .slide_wrap .slide_ctn .item{margin-right: 24px;}
#eSkil.mod .flex_box .slide_wrap .slide_ctn .item figure{position: relative;padding-bottom:73%; overflow: hidden;}
#eSkil.mod .flex_box .slide_wrap .slide_ctn .item figure img{position:absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); max-width: inherit; height: 100%;}
#eSkil.mod .flex_box .slide_wrap .slide_ctn .item .txt{position:relative; }
#eSkil.mod .flex_box .slide_wrap .slide_ctn .item .txt h4{font-weight:bold; font-size:20px; letter-spacing:-0.05em; color: #2d2d2d; white-space: normal; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 2.8em; margin: 13px 0 22px; }
#eSkil.mod .flex_box .slide_wrap .slide_ctn .item .txt p{position:relative; white-space: normal; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; height: 4.8em; line-height: 1.6;}
#eSkil.mod .flex_box .slide_wrap .slide_ctn .item .txt::before{content:""; position:absolute; top: calc(2.8em + 24px); left: 0; width: 100%; height: 1px; background: #e1e1e1; }
#eSkil.mod .flex_box .slide_wrap .slide_btn > div{width: 60px; height: 60px; border-radius: 50%;border: 1px solid #c8c8c8; background-repeat: no-repeat; background-position: center; overflow: hidden; text-indent: -9999px; background-color: unset; position: absolute;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%); cursor: pointer;}
#eSkil.mod .flex_box .slide_wrap .slide_btn > div:hover{background-color: #28386e;}
#eSkil.mod .flex_box .slide_wrap .slide_btn > .prev{background-image: url("/img/main/slick_arrow_prev.png"); left: -96px;}
#eSkil.mod .flex_box .slide_wrap .slide_btn > .prev:hover{background-image: url("/img/main/slick_arrow_prevH.png");}
#eSkil.mod .flex_box .slide_wrap .slide_btn > .next{background-image: url("/img/main/slick_arrow_next.png");right: -96px;}
#eSkil.mod .flex_box .slide_wrap .slide_btn > .next:hover{background-image: url("/img/main/slick_arrow_nextH.png");}

#mainContents #bnGroup ul li:nth-child(1) .bg{background-image:url(/img/main/mod_main03.jpg)}
#mainContents #bnGroup ul li:nth-child(2) .bg{background-image:url(/img/main/mod_main04.jpg)}

@media (max-width: 1500px){
	#eSkil.mod .flex_box{flex-wrap:wrap;}
	#eSkil.mod .flex_box .box{width: 100%; margin-bottom:50px;}
	#eSkil.mod .flex_box .slide_wrap{max-width: calc(100% - 200px); margin-left: auto !important; margin-right: auto !important;}
}

@media (max-width: 800px){
	#eSkil.mod .flex_box .box{margin-bottom:0px;}
	#eSkil.mod .flex_box .slide_wrap{max-width: 100%; margin-left: auto !important; margin-right: auto !important;}
	#eSkil.mod .flex_box .slide_wrap .slide_btn > div{display:none; }
}

/* 250324 */
#videoKakao{ padding-top: 100px; }
#videoKakao .flex-box{ display:flex; }
#videoKakao .video-box{ position: relative; max-width: 1030px; width: 100%; height: 540px; margin-right: 40px; overflow: hidden; border-radius:10px; }
#videoKakao .video-box iframe{	 width: 100%; height: 100%; }
#videoKakao .kakao-box{ background: #FFDE24; border-radius:20px; }
#videoKakao .kakao-box *{ box-sizing:border-box; }
#videoKakao .kakao-box a{ display:block;}
#videoKakao .kakao-box .title{ position: relative; padding: 40px 30px 60px; line-height: 140%;  font-weight: 700; color:#333; font-size:24px; word-break:keep-all; }
#videoKakao .kakao-box .title img{ position: absolute; top: 40px; right: 30px;}
#videoKakao .kakao-box figure{ text-align: center; }


@media (max-width: 1300px){
	#videoKakao .video-box{ width: 70%;}
	#videoKakao .kakao-box{ width: 30%; }
	#videoKakao .kakao-box br{ display:block; }
}

@media (max-width: 800px){	
	#videoKakao{ padding-top: 60px; }
	#videoKakao .flex-box{ flex-wrap:wrap; }
	#videoKakao .video-box{ width: 100%; height: 300px; margin-right: 0; margin-bottom: 30px; }
	#videoKakao .kakao-box{ width: 100%; padding-bottom: 20px;}
	#videoKakao .kakao-box .title{ padding: 20px;}
	#videoKakao .kakao-box figure img{ height: 200px; }
}