@charset "UTF-8";
#main #header { background: url(../images/main_header.jpg) no-repeat; }

#main #header .titlebox { margin: 8rem 0 17.5rem 4rem; }

#main #contents { padding: 5rem 0 0rem; }

#main .section1 { padding: 0 4rem; }

#main .sec1 { margin-bottom: 5rem; }

#main .sec1_1 .textWrap { width: calc(100% - 24rem); float: left; word-break: keep-all; }

#main .sec1_1 .textWrap .cont { color: #3b3b3b; margin-bottom: 2rem; line-height: 2.8rem; }

#main .sec1_1 .photoWrap { width: 24rem; float: left; margin-top: -4rem; padding-left: 4rem; }

#main .sec1_1 .photoWrap > img { margin: 0 auto 1rem; display: block; -webkit-box-shadow: 0rem 0.2rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0rem 0.2rem 1rem rgba(0, 0, 0, 0.1); }

#main .sec1_1 .photoWrap .name { text-align: right; }

#main .sec1_1 .photoWrap .name span { vertical-align: bottom; margin-right: .5rem; }

#main .sec1_1 .textWrap2 { display: none; }

#main .sec1_1:after { content: ''; display: block; clear: both; }

#main .sec1_2 .imgbox { float: left; width: 40rem; }

#main .sec1_2 .textbox { padding: 5rem 0 3rem 4rem; background: url(../images/blur_bg.png) no-repeat; width: calc(100% - 40rem); float: left; margin-top: -2rem; }

#main .sec1_2 .textbox .title { font-size: 2rem; color: #0a0a0a; font-family: "Nanum Square"; font-weight: 700; margin-bottom: 1rem; }

#main .sec1_2 .textbox .t1 { color: #6b6a6a; }

#main .sec1_2 .textbox a { background-color: #838793; color: #fff; font-size: 1.4rem; display: inline-block; padding: .6rem 1rem; vertical-align: middle; float: right; }

#main .sec1_2:after { content: ''; display: block; clear: both; }

#main .sec1_3 .news1 { margin-bottom: 3rem; }

#main .sec1_3 .news1 li { float: left; width: 50%; padding-right: 1.2rem; }

#main .sec1_3 .news1 li:nth-child(2) { padding-left: 1.2rem; padding-right: 0; }

#main .sec1_3 .news1 li img { margin-bottom: 1.5rem; }

#main .sec1_3 .news1 li .text { padding-left: 1.5rem; border-left: 1px solid #cacfde; }

#main .sec1_3 .news1 li .text .ti { height: 5rem; line-height: 2.5rem; font-size: 2rem; font-family: "Nanum Square"; color: #000; font-weight: 600; margin-bottom: .5rem; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

#main .sec1_3 .news1 li .text .desc { color: #6b6a6a; height: 5rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

#main .sec1_3 .news1 li:hover .text .ti { text-decoration: underline; }

#main .sec1_3 .news1:after { content: ''; display: block; clear: both; }

#main .sec1_3 .news2 { margin-bottom: 7rem; }

#main .sec1_3 .news2 li .ti { position: relative; }

#main .sec1_3 .news2 li .ti a { color: #0a0a0a; background-color: #f0f1f2; font-size: 1.8rem; font-family: "Nanum Square"; font-weight: 700; padding: 1rem 3rem 1rem 2rem; display: block; margin-top: 1rem; }

#main .sec1_3 .news2 li .ti:after { content: ''; width: 2rem; height: 2rem; font-size: 2rem; font-family: "xeicon"; color: #bcadad; position: absolute; right: 1.5rem; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: center; line-height: 2rem; }

#main .sec1_3 .news2 li:hover .ti a { text-decoration: underline; }

#main .sec1_3 .news2 li:hover .ti:after { color: #00aeef; }

#main .more { font-size: 1.4rem; border: 1px solid #7f7f7f; color: #3b3b3b; height: 2.8rem; line-height: 2.6rem; padding: 0 2rem; display: inline-block; font-weight: 500; }

#main .more:hover { background-color: #3b3b3b; border: 1px solid #3b3b3b; color: #fff; -webkit-transition: all .3s; transition: all .3s; }

#main .section2 { background: url(../images/focus_bg.jpg) no-repeat; padding: 9rem 0 3.7rem; }

#main .section2 .section2Box { padding: 0 4rem; }

#main .section2 .section2Box .h2box { background: none; }

#main .section2 .section2Box .h2box h2.ti1.type2 { background: none; }

#main .section2 .focusText { width: calc(100% - 38.6rem); float: left; padding: 2rem 3.4rem; }

#main .section2 .focusText p { color: #3173cd; font-size: 2.4rem; font-family: "Nanum Square"; font-weight: 900; margin-bottom: 2rem; }

#main .section2 img { width: 38.6rem; float: left; margin-top: -11rem; }

#main .section2:after { content: ''; display: block; clear: both; }

#main .section3 { background: url(../images/good_bg.jpg) no-repeat; padding: 4.5rem 0 7.4rem; }

#main .section3 .section3Box { padding: 0 4rem; }

#main .section3 .section3Box .h2box { background: none; }

#main .section3 .section3Box .h2box h2.ti1.type2 { background: none; color: #fff; }

#main .section3 .section3Box .h2box h2.ti1.type2 span { font-family: sans-serif; font-weight: 700; }

#main .section3 .section3Box .textbox { border: 1px solid rgba(21, 36, 75, 0.75); border-top-left-radius: 3rem; border-bottom-right-radius: 3rem; background-color: rgba(21, 36, 75, 0.75); width: 32.5rem; padding: 3.5rem 0rem 3rem; color: #fff; font-family: "Nanum Square"; font-size: 2rem; text-align: center; font-weight: 400; -webkit-transition: all .2s; transition: all .2s; }

#main .section3 .section3Box .textbox a { display: inline-block; width: 100%; }

#main .section3 .section3Box .textbox .title { color: #b6f169; font-weight: 700; font-size: 2.8rem; margin: .75rem 0 1.8rem; }

#main .section3 .section3Box .textbox:hover { background-color: #15244b; border-radius: 0; border-top-right-radius: 3rem; border-bottom-left-radius: 3rem; -webkit-transition: all .2s; transition: all .2s; }

@media (max-width: 900px) { #main .section2 .focusText { width: calc(100% - 30rem); padding: 0; }
  #main .section2 img { width: 30rem; } }

@media (max-width: 820px) { #main .section2 { padding: 8rem 0 6rem; }
  #main .section2 .focusText { width: calc(100% - 26rem); padding: 0; }
  #main .section2 img { width: 26rem; } }

@media (max-width: 768px) { #main #header { background-position: center bottom; }
  #main .section1 { padding: 0 2rem; }
  #main .section1 .textWrap { width: calc(100% - 16rem); }
  #main .section1 .textWrap span { display: none; }
  #main .section1 .photoWrap { width: 16rem; padding-left: 2rem; margin-top: 0; }
  #main .section1 .textWrap2 { display: block; width: 100% !important; }
  #main .sec1 { margin-bottom: 3rem; }
  #main .sec1_2 .imgbox { width: 100%; text-align: center; }
  #main .sec1_2 .textbox { width: 100%; padding: 5rem 0 1rem; margin-top: 0; background-size: 20rem; }
  #main .sec1_3 .news1 { margin-bottom: 1rem; }
  #main .sec1_3 .news1 li { width: 100%; padding: 0 0 2rem !important; }
  #main .sec1_3 .news1 li a { width: 100%; }
  #main .sec1_3 .news1 li img { margin: 0 auto 1.5rem; display: block; }
  #main .sec1_3 .news1 li .text .ti { height: auto; }
  #main .sec1_3 .news2 { margin-bottom: 5rem; }
  #main .section2 .section2Box { padding: 0 1rem 0 3rem; }
  #main .section2 .focusText { width: calc(100% - 22rem); }
  #main .section2 .focusText p { font-size: 2rem; }
  #main .section2 img { width: 22rem; margin-top: -9rem; }
  #main .section3 .section3Box { padding: 0 3rem; }
  #footer { padding: 3rem 2rem; } }

@media (max-width: 500px) { #main #header .titlebox { margin: 7rem 0 10rem 3rem; }
  #main .section1 .textWrap { width: calc(100% - 12rem); }
  #main .section1 .photoWrap { width: 12rem; padding-left: 1rem; }
  #main .section1 .photoWrap .name img { width: 7rem; }
  #main .section2 { position: relative; }
  #main .section2 .focusText { width: 100%; padding-bottom: 8rem; }
  #main .section2 img { width: 16rem; margin-top: 0rem; position: absolute; right: 2rem; bottom: 2rem; }
  #main .section3 .section3Box .textbox { width: 100%; } }