@font-face {
  font-family: "InkLipquid";
  src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/InkLipquid.woff")
    format("woff");
  font-weight: normal;
  font-style: normal;
}
.subtop {
  width: 100%;
  height: 40vh;
  position: relative;
}
#subtop1 {
  background: url(../img/subtop/subtop1.png) no-repeat center/cover;
}
#subtop2 {
  background: url(../img/subtop/subtop2.png) no-repeat center/cover;
}
#subtop3 {
  background: url(../img/subtop/subtop3.png) no-repeat center/cover;
}
#subtop4 {
  background: url(../img/subtop/subtop4.png) no-repeat center/cover;
}
#subtop5 {
  background: url(../img/subtop/subtop5.png) no-repeat center/cover;
}

.subtop_txt {
  position: absolute;
  left: 50%;
  top: 60%;
  transform: translate(-50%, -50%);
}
.subtop_txt .txt1 {
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 3px;
  color: #87b540;
}
.subtop_txt .txt2 {
  font-size: 3rem;
  color: #fff;
  font-weight: 600;
  margin: 6px 0 24px;
}
.subtop_txt .txt3 {
  font-size: 1rem;
  color: #fff;
  font-weight: 200;
}

.sub_tit {
  padding: 10vh 0;
  text-align: center;
}
.sub_tit2 {
  padding: 10vh 0 0;
}
.sub_tit .tit1 {
  font-size: 0.95rem;
  font-weight: 300;
  color: #87b540;
  margin-bottom: 8px;
}
.sub_tit .tit2 {
  font-size: 2.8rem;
  font-weight: 700;
}

.sub {
  width: 100%;
}
.board {
  margin: 70px auto 26vh;
}

.list_top {
  width: 100%;
  padding: 6vh 0;
  background: url(../img/subtop/list_bg.png);
}
.list_tit {
  margin: auto;
  font-size: 0;
}
.list_tit > li {
  display: inline-block;
  vertical-align: top;
  box-sizing: border-box;
}
.list_tit > li.left {
  width: 30%;
  margin-right: 5%;
  border-top: 3px solid #2d3661;
  padding-top: 30px;
}
.list_tit > li.right {
  width: 65%;
  background: #2d3661;
  padding: 30px 60px 60px 100px;
  border-radius: 0 0 0 150px;
}

.list_tit > li.left .txt1 {
  font-size: 4rem;
  font-weight: 700;
  color: #2d3661;
}
.list_tit > li.left .txt2 {
  font-size: 1.1rem;
  margin-top: 14px;
}
.list_tit > li.left .txt2 span {
  font-weight: 700;
  margin-right: 8px;
}

.list_tit > li.right .txt1 {
  font-size: 1rem;
  font-weight: 200;
  line-height: 1.5;
  color: #fff;
  word-break: keep-all;
  margin-bottom: 40px;
  font-weight: 200;
}
.list_tit > li.right .txt2 {
  font-size: 0rem;
  color: #fff;
  margin-bottom: 10px;
}
.list_tit > li.right .txt2 span {
  display: inline-block;
  width: calc(100% - 16px);
  vertical-align: top;
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 200;
}
.list_tit > li.right .txt2 span.cir {
  width: 16px;
}
.list_tit > li.right .txt2 span.cir::before {
  content: "";
  width: 4px;
  height: 4px;
  background: #fff;
  border-radius: 50%;
  display: block;
  margin-top: 7px;
}

.list_tit2 > li.left {
  border-top: 3px solid #2e3092;
}
.list_tit2 > li.right {
  background: #2e3092;
}
.list_tit2 > li.left .txt1 {
  color: #2e3092;
}

.list_tit3 > li.left {
  border-top: 3px solid #0353a5;
}
.list_tit3 > li.right {
  background: #0353a5;
}
.list_tit3 > li.left .txt1 {
  color: #0353a5;
}

.list_tit4 > li.left {
  border-top: 3px solid #468ac9;
}
.list_tit4 > li.right {
  background: #468ac9;
}
.list_tit4 > li.left .txt1 {
  color: #468ac9;
}

.list_tit5 > li.left {
  border-top: 3px solid #28bec6;
}
.list_tit5 > li.right {
  background: #28bec6;
}
.list_tit5 > li.left .txt1 {
  color: #28bec6;
}

.list_tit6 > li.left {
  border-top: 3px solid #7ecfd7;
}
.list_tit6 > li.right {
  background: #7ecfd7;
}
.list_tit6 > li.left .txt1 {
  color: #7ecfd7;
}

.list_tit7 > li.left {
  border-top: 3px solid #b3d347;
}
.list_tit7 > li.right {
  background: #b3d347;
}
.list_tit7 > li.left .txt1 {
  color: #b3d347;
}

.list_tit8 > li.left {
  border-top: 3px solid #9faf46;
}
.list_tit8 > li.right {
  background: #9faf46;
}
.list_tit8 > li.left .txt1 {
  color: #9faf46;
}

.list_tit9 > li.left {
  border-top: 3px solid #6dbe4b;
}
.list_tit9 > li.right {
  background: #6dbe4b;
}
.list_tit9 > li.left .txt1 {
  color: #6dbe4b;
}

.list_tit10 > li.left {
  border-top: 3px solid #27b88b;
}
.list_tit10 > li.right {
  background: #27b88b;
}
.list_tit10 > li.left .txt1 {
  color: #27b88b;
}

.list_tit11 > li.left {
  border-top: 3px solid #797041;
}
.list_tit11 > li.right {
  background: #797041;
}
.list_tit11 > li.left .txt1 {
  color: #797041;
}

.list_tit12 > li.left {
  border-top: 3px solid #b09b3d;
}
.list_tit12 > li.right {
  background: #b09b3d;
}
.list_tit12 > li.left .txt1 {
  color: #b09b3d;
}

.list_tit13 > li.left {
  border-top: 3px solid #7c513c;
}
.list_tit13 > li.right {
  background: #7c513c;
}
.list_tit13 > li.left .txt1 {
  color: #7c513c;
}

.list_tit14 > li.left {
  border-top: 3px solid #aa8457;
}
.list_tit14 > li.right {
  background: #aa8457;
}
.list_tit14 > li.left .txt1 {
  color: #aa8457;
}

.list_tit15 > li.left {
  border-top: 3px solid #bf8c22;
}
.list_tit15 > li.right {
  background: #bf8c22;
}
.list_tit15 > li.left .txt1 {
  color: #bf8c22;
}

.list_tit16 > li.left {
  border-top: 3px solid #f5b234;
}
.list_tit16 > li.right {
  background: #f5b234;
}
.list_tit16 > li.left .txt1 {
  color: #f5b234;
}

.list_tit17 > li.left {
  border-top: 3px solid #f36e2e;
}
.list_tit17 > li.right {
  background: #f36e2e;
}
.list_tit17 > li.left .txt1 {
  color: #f36e2e;
}

.list_tit18 > li.left {
  border-top: 3px solid #b2401f;
}
.list_tit18 > li.right {
  background: #b2401f;
}
.list_tit18 > li.left .txt1 {
  color: #b2401f;
}

.list_tit19 > li.left {
  border-top: 3px solid #ea2424;
}
.list_tit19 > li.right {
  background: #ea2424;
}
.list_tit19 > li.left .txt1 {
  color: #ea2424;
}

.list_tit20 > li.left {
  border-top: 3px solid #531122;
}
.list_tit20 > li.right {
  background: #531122;
}
.list_tit20 > li.left .txt1 {
  color: #531122;
}

.list_tit21 > li.left {
  border-top: 3px solid #513a97;
}
.list_tit21 > li.right {
  background: #513a97;
}
.list_tit21 > li.left .txt1 {
  color: #513a97;
}

.list_tit22 > li.left {
  border-top: 3px solid #41315e;
}
.list_tit22 > li.right {
  background: #41315e;
}
.list_tit22 > li.left .txt1 {
  color: #41315e;
}

.list_tit23 > li.left {
  border-top: 3px solid #3e3e3f;
}
.list_tit23 > li.right {
  background: #3e3e3f;
}
.list_tit23 > li.left .txt1 {
  color: #3e3e3f;
}

.list_tit24 > li.left {
  border-top: 3px solid #7a3f5a;
}
.list_tit24 > li.right {
  background: #7a3f5a;
}
.list_tit24 > li.left .txt1 {
  color: #7a3f5a;
}

.list_tit25 > li.left {
  border-top: 3px solid #1a4b68;
}
.list_tit25 > li.right {
  background: #1a4b68;
}
.list_tit25 > li.left .txt1 {
  color: #1a4b68;
}

/*서브1-1*/
.s111_ul {
  font-size: 0;
  margin: 0 auto 26vh;
}
.s111_ul > li {
  display: inline-block;
  vertical-align: top;
}
.s111_ul > li.txt {
  width: 70%;
  margin-right: 10%;
  position: relative;
}
.s111_ul > li.img {
  width: 20%;
  text-align: center;
}
.s111_ul > li.img img {
  width: 100%;
}

.s111_point {
  width: 50px;
  position: absolute;
  left: -8%;
  top: -3%;
}
.s111_ul > li.txt .txt1 {
  font-size: 2.2rem;
  font-family: "InkLipquid";
}
.s111_ul > li.txt .txt2 {
  font-size: 1.2rem;
  font-weight: 700;
  margin: 20px 0 40px;
}
.s111_ul > li.txt .txt2 span {
  color: #87b540;
}
.s111_ul > li.txt .txt3 {
  font-size: 1rem;
  line-height: 1.5;
  text-align: justify;
}
.s111_ul > li.txt .txt6 {
  font-size: 1.2rem;
  font-weight: 700;
  margin-top: 40px;
}
.s111_ul > li.txt .txt6 img {
  width: 100px;
  display: inline-block;
  vertical-align: bottom;
  margin-left: 10px;
}
.s111_ul > li.img .txt4 {
  font-size: 1rem;
  color: #87b540;
  font-weight: 700;
  margin: 20px 0 6px;
}
.s111_ul > li.img .txt5 {
  font-size: 1rem;
}

/*서브1-2*/
.s121 {
  margin: 180px 0 60px;
}
.s121 .sub_tit {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}
.s122 {
  position: relative;
}
.s122 .inner {
  margin: auto;
}
.s122_nav {
  width: 100%;
  font-size: 0;
  margin-bottom: 150px;
  display: flex;
  flex-direction: row-reverse;
}
.s122_nav > li {
  width: 25%;
  display: inline-block;
  box-sizing: border-box;
  text-align: center;
  transition: all 0.4s;
  cursor: pointer;
  border-top: 1px solid #d9d9d9;
  border-bottom: 1px solid #d9d9d9;
  border-left: 1px solid #d9d9d9;
  border-right: transparent;
}
.s122_nav > li:nth-last-child(1) {
  border-right: 1px solid #d9d9d9;
}
.s122_nav > li a {
  font-size: 1.1rem;
  color: #666;
  display: block;
  padding: 16px 0;
}
.s122_nav > li:hover {
  border: 1px solid #185194;
}
.s122_nav > li:hover a {
  color: #185194;
}
.s122_nav > li.on {
  border: 1px solid #185194;
}
.s122_nav > li.on a {
  color: #185194;
}

.his_wrap {
  position: relative;
  padding-bottom: 200px;
  display: flex;
  flex-direction: column-reverse;
}
.his_wrap::before {
  content: "";
  width: 1px;
  height: 100%;
  background: #d9d9d9;
  position: absolute;
  left: 30%;
  top: 0;
}
.his_wrap .pro {
  content: "";
  width: 1px;
  height: 3%;
  background: #185194;
  position: absolute;
  left: 30%;
  top: 0;
  z-index: 10;
}

.his_box {
  width: 100%;
  font-size: 0;
  /* padding-top: 60px; */
}
.his_box.padding {
  padding-top: 0;
}
.his_box > li {
  display: inline-block;
  vertical-align: top;
}
.his_box > li.left {
  width: 25%;
  margin-right: 5%;
  border-top: 3px solid #185194;
  padding-top: 25px;
}
.his_box > li.right {
  width: 65%;
  margin-left: 5%;
  position: relative;
  display: inline-flex;
  flex-direction: column-reverse;
}
.his_box > li.right::before {
  content: "";
  width: 12px;
  height: 12px;
  background: #185194;
  border-radius: 50%;
  position: absolute;
  left: -8.3%;
  top: 0;
}

.his_tit {
  font-size: 2.4rem;
  font-weight: 900;
  color: #185194;
}
.year_box {
  width: 100%;
  border-bottom: 1px solid #d9d9d9;
  padding-bottom: 10px;
  margin-bottom: 40px;
}
.year_box.mar {
  /* margin-bottom: 0; */
}
.year_box.mar .year {
  padding-top: 0;
}
.year {
  font-size: 1.6rem;
  font-weight: 900;
  line-height: 1;
  margin-bottom: 40px;
  padding-top: 20px;
}
.year.mar {
  margin-top: -10px;
}
.month_box {
  font-size: 0;
  width: 100%;
  margin-bottom: 24px;
}
.month_box span {
  font-size: 0.9rem;
  font-weight: 300;
  line-height: 1.8;
  word-break: keep-all;
  color: #999;
  width: 94%;
  display: inline-block;
  vertical-align: top;
}
.month_box span.month {
  color: #666;
  font-weight: 500;
  width: 6%;
}

/*서브1-3*/
.s131 {
  margin-bottom: 26vh;
}
.s131 .inner {
  margin: auto;
}
.s131 .inner img {
  width: 100%;
  max-width: 780px;
  display: block;
  margin: 0 auto;
}

/*서브1-5*/
.s151 {
  margin-bottom: 16vh;
}
.s151 .inner {
  margin: auto;
}
.s151 .map {
  width: 100%;
  height: 45vh;
  position: relative;
  margin-bottom: 16vh;
}
.s151 .map iframe {
  width: 100%;
  height: 100%;
}
.map_info {
  position: absolute;
  right: 40px;
  bottom: -4vh;
  background: #185194;
  width: 45%;
  box-sizing: border-box;
  padding: 40px;
}
.map_info p {
  font-size: 1rem;
  color: #fff;
  word-break: keep-all;
  line-height: 1.8;
}

.s151_ul {
  width: 100%;
  font-size: 0;
  margin: 6vh auto;
  padding-bottom: 6vh;
  border-bottom: 1px dashed #87b540;
}
.s151_ul2 {
  border-bottom: 0;
}
.s151_ul > li {
  display: inline-block;
  vertical-align: middle;
}
.s151_ul > li.left {
  width: 30%;
  text-align: center;
}
.s151_ul > li.right {
  width: 70%;
}
.s151_ul > li.left i {
  font-size: 3rem;
  color: #ddd;
  position: relative;
}
.s151_ul > li.left i::after {
  content: "";
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 1px solid #ddd;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.s151_ul > li.right .txt1 {
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 18px;
}
.s151_ul > li.right .txt2 {
  font-size: 1rem;
}
.s151_ul > li.right .txt2 span {
  background: #87b540;
  display: inline-block;
  padding: 2px 6px;
  border-radius: 10px;
  color: #fff;
}

/*서브1-6*/
.s161 {
  margin-bottom: 26vh;
}
.s161 .inner {
  margin: auto;
}
.s161 .txt1 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #0353a5;
}
.s161 .txt2 {
  font-size: 1rem;
  margin: 20px 0 8vh;
}
.s161 .ci_top {
  margin-bottom: 16vh;
}
.s161 .ci_img {
  width: 100%;
  max-width: 840px;
  margin: auto;
}
.s161 .ci_img img {
  width: 100%;
}
.s161 .ci_download {
  margin-top: 6vh;
  text-align: center;
}
.s161 .ci_download .ci_down {
  display: inline-block;
  width: auto;
  line-height: 40px;
  padding: 0 20px;
  border: 1px solid #7f7f7f;
  font-size: 1rem;
  transition: all 0.4s;
}
.s161 .ci_download .ci_down:first-child {
  margin-right: 40px;
}
.s161 .ci_download .ci_down i {
  display: inline-block;
  vertical-align: middle;
  margin-right: 3px;
  transition: all 0.4s;
}
.s161 .ci_download .ci_down span {
  display: inline-block;
  vertical-align: middle;
  transition: all 0.4s;
}
.s161 .ci_download .ci_down:hover {
  background: #7f7f7f;
}
.s161 .ci_download .ci_down:hover i {
  color: #fff;
}
.s161 .ci_download .ci_down:hover span {
  color: #fff;
}

/*서브2-2*/
.s221_ul {
  font-size: 0;
  margin: 0 auto 26vh;
}
.s221_ul > li {
  display: inline-block;
  vertical-align: top;
  width: calc(25% - 15px);
  margin-right: 20px;
  margin-bottom: 20px;
  background: #e3e3e3;
  box-sizing: border-box;
  padding: 60px 0;
  text-align: center;
  border-radius: 10px;
  transition: all 0.4s;
  color: #424242;
}
.s221_ul > li:nth-child(4n) {
  margin-right: 0;
}
.s221_ul > li:hover {
  background: #87b540;
  color: #fff;
}
.s221_ul > li a {
  font-size: 1.4rem;
  font-weight: 700;
  display: block;
}

/*서브4-1*/
.s411 {
  margin-bottom: 14vh;
}
.s411_ul {
  margin: auto;
  font-size: 0;
}
.s411_ul > li {
  width: 45%;
  display: inline-block;
  vertical-align: middle;
}
.s411_ul > li.left {
  margin-right: 10%;
  position: relative;
}
.s411_ul > li.left img {
  width: 100%;
}
.s411_ul > li.left::before {
  content: "";
  width: 200px;
  height: 200px;
  background: #87b540;
  position: absolute;
  left: -30px;
  bottom: -30px;
  z-index: -1;
}
.s411_ul > li.right .txt1 {
  font-size: 2.8rem;
  font-weight: 700;
  color: #87b540;
}
.s411_ul > li.right .txt2 {
  font-size: 1.1rem;
  line-height: 1.5;
  margin: 30px 0 60px;
}

.s411_btn > li {
  display: inline-block;
  vertical-align: middle;
  margin-right: 14px;
}
.s411_btn > li a {
  display: inline-block;
  font-size: 1rem;
  font-weight: 500;
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid #87b540;
  color: #87b540;
  transition: all 0.4s;
}
.s411_btn > li a:hover {
  background: #87b540;
  color: #fff;
}

.s412 {
  margin: auto;
}
.s412_tit {
  width: 100%;
  position: relative;
  margin: 40px 0 30px;
}
.s412_tit span {
  font-size: 2rem;
  color: #87b540;
  font-weight: 700;
  display: inline-block;
  background: #fff;
  padding-right: 20px;
}
.s412_tit::before {
  content: "";
  width: 100%;
  height: 1px;
  background: #bfbfbf;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(50%);
  z-index: -1;
}
.s412_conbox p {
  font-size: 1rem;
  margin-bottom: 14px;
}
.s412_conbox p.bold {
  font-weight: 700;
}
.s412_conbox p.gray {
  background: #efefef;
  box-sizing: border-box;
  padding: 30px;
  line-height: 1.8;
}
.s412_conbox ul.gray {
  background: #efefef;
  box-sizing: border-box;
  padding: 30px;
  font-size: 0;
  margin-bottom: 14px;
}
.s412_conbox ul.gray > li {
  display: inline-block;
  vertical-align: top;
  width: 45%;
}
.s412_conbox ul.gray > li:nth-child(1) {
  margin-right: 10%;
}
.s412_conbox ul.gray > li p {
  font-size: 1rem;
  margin-bottom: 14px;
}
.s412_conbox ul.gray > li p:nth-last-child(1) {
  margin-bottom: 0;
}
.s412_conbox ul.gray > li p span:nth-child(1) {
  font-weight: 700;
  margin-right: 10px;
}
.s412_conbox p.point {
  width: 100%;
  font-size: 0;
  margin-bottom: 14px;
}
.s412_conbox p.point > span {
  display: inline-block;
  vertical-align: top;
  width: 90%;
  font-size: 1rem;
}
.s412_conbox p.point > span.green {
  width: 10%;
  color: #87b540;
  font-weight: 700;
}

.s413 {
  margin-bottom: 20vh;
}

/*서브 4-2*/
.s421 {
  margin: 0 0 20vh;
}
.s421 .inner {
  margin: auto;
}