/*-------------------------------------------------
File        : style.css
Author      : COMMIN (GH.SEO)
Create date : 2023-08-30
Version     : 1.0
-------------------------------------------------*/
.container_body h3 {
  font-size: 3.8rem;
  color: #111111;
  font-weight: bold;
  margin-bottom: 2rem;
}
.container_body h4 {
  color: #111111;
  font-weight: bold;
  font-size: 2.8rem;
  margin-bottom: 2rem;
}
.container_body h5 {
  position: relative;
  padding-left: 1.8rem;
  font-size: 2.4rem;
  font-weight: bold;
  color: #3D98EB;
  margin-bottom: 2rem;
}
.container_body h5::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1.1rem;
  height: 1.1rem;
  border: 0.3rem solid transparent;
  border-radius: 50%;
  background-image: linear-gradient(#fff, #fff), linear-gradient(to bottom left, #2260CD 0%, #48ADF7 100%);
  background-origin: border-box;
  background-clip: content-box, border-box;
}
.container_body h6 {
  position: relative;
  font-size: 2rem;
  font-weight: 500;
  color: #666666;
  padding-left: 1.2rem;
  margin-bottom: 2rem;
}
.container_body h6::before {
  content: "";
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0.4rem;
  height: 0.4rem;
  background-color: #666666;
  border-radius: 50%;
  position: absolute;
}
.container_body p {
  font-size: 1.8rem;
  color: #111111;
  line-height: 1.5;
}

@media (max-width:1023px) {
	.container_body p {font-size:1.9rem}
}

.sub_tab {
  margin: 4rem 0 6rem;
}
.sub_tab .sub_tab_title {
  display: none;
  background: rgb(34, 96, 205);
  background: linear-gradient(155deg, rgb(34, 96, 205) 0%, rgb(72, 173, 247) 100%);
  color: #fff;
  border-radius: 1.5rem;
  width: 100%;
  height: 7rem;
  align-items: center;
  justify-content: flex-start;
  padding: 0 3.5rem 0 2.5rem;
  font-size: 2.2rem;
  font-weight: 500;
  position: relative;
  cursor: pointer;
}
.sub_tab .sub_tab_title::after {
  display: inline-block;
  font-family: "Font Awesome 5 Pro";
  content: "\f107";
  font-weight: 400;
  color: #fff;
  position: absolute;
  right: 2.5rem;
  top: 50%;
  transform: translateY(-50%);
}
.sub_tab .sub_tab_list {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sub_tab .sub_tab_list li {
  width: calc(25% - 2rem);
}
.sub_tab .sub_tab_list li a {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1.5rem;
  background-color: #eef3ff;
  height: 7rem;
  font-size: 2.6rem;
  color: #111111;
}
.sub_tab .sub_tab_list li a:hover {
  background: rgb(34, 96, 205);
  background: linear-gradient(155deg, rgb(34, 96, 205) 0%, rgb(72, 173, 247) 100%);
  color: #fff;
}
.sub_tab .sub_tab_list li.active a {
  background: rgb(34, 96, 205);
  background: linear-gradient(155deg, rgb(34, 96, 205) 0%, rgb(72, 173, 247) 100%);
  color: #fff;
}

.bullet {
    margin-bottom: 1.5rem;
    line-height: 1.5;
}

.bullet>li {
    padding: 0.3rem 0 0.3rem 1.6rem;
    position: relative;
    font-size: 1.8rem;
    font-weight: 400;
    color: #111;
    
}

.bullet>li::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 1.3rem;
    width: .8rem;
    height: 2px;
    background-color: #666
}

.bullet > li > ul{margin-top:5px;}

.bullet>li>ul>li {
    position:relative;
    padding-left: 1.0rem;
    font-weight: 300;
    line-height:1.5;
	margin-bottom:5px;
}

.bullet>li>ul>li:before{
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 1.0rem;
    width: .4rem;
    height: .4rem;
    background-color: #666;
    border-radius:50%;
}
.bullet_none li{padding-left:0 !important;}
.bullet_none li::before {display: none !important;}
.card_list {
  width: calc(100% + 2rem);
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.card_list .item {
  width: calc(20% - 2rem);
  margin-right: 2rem;
  margin-bottom: 2rem;
  border: 1px solid #ccc;
  overflow: hidden;
  border-radius: 2rem;
  transition: 0.35s all;
}
.card_list .item:hover {
  transform: translateY(-0.5rem);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  border-color: #2260CD;
}
.card_list .item a img {
  display: block;
  width: 100%;
}
.card_list .item div {
  padding: 2rem;
}
.card_list .item div span {
  font-weight: 500;
  display: block;
  font-size: 1.8rem;
  color: #111;
  display: -webkit-box;
  white-space: normal;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 2rem;
}
.card_list .item div ul {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: center;
}
.card_list .item div ul li {
  color: #666666;
  font-size: 1.6rem;
}
.card_list .item div ul li i {
  margin-right: 0.5rem;
  font-weight: 300;
  color: inherit;
  font-size: inherit;
}

.btn {
  display: inline-block;
  width: 100%;
  font-size: 1.8rem;
  font-weight: 500;
  color: inherit;
  border-radius: 1rem;
  transition: 0.25s ease-in;
  margin: 0;
  height: 5rem;
  line-height: 5rem;
  text-align: center;
  padding: 0 0.5rem;
  border: 1px solid transparent;
  background-color: #ffffff;
  color: #656565;
  overflow: hidden;
}
.btn.auto {
  width: auto;
  height: auto;
  line-height: 1.1;
  padding: 1.6rem 2.4rem;
  max-width: 100%;
}
.btn.sm {
  max-width: 7rem;
}
.btn.md {
  max-width: 10rem;
}
.btn.lg {
  max-width: 15rem;
}
.btn.icon {
  max-width: 100%;
  width: auto;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  border-color: #CCCCCC;
  color: #666666;
  padding: 0 2rem;
}
.btn.icon i {
  color: inherit !important;
  margin-left: 1rem;
}
.btn.icon:hover, .btn.icon:focus, .btn.icon.active {
  border-color: #2260CD;
  background-color: #2260CD;
  color: #fff;
}
.btn.blue {
  background-color: #2260CD;
  color: #fff;
}
.btn.blue:hover, .btn.blue:focus, .btn.blue.active {
  background-color: #fff;
  color: #2260CD;
  border-color: #2260CD;
}
.btn.light {
  border-color: #CCCCCC;
  background-color: #fff;
  color: #666666;
}
.btn.light:hover, .btn.light:focus, .btn.light.active {
  background-color: #f4f4f4;
}
.btn.dark {
  background-color: #333;
  color: #fff;
}
.btn.dark:hover, .btn.dark:focus, .btn.dark.active {
  background-color: #fff;
  border-color: #333333;
  color: #333333;
}

.btn_align {
  display: flex;
  width: 100%;
  margin: 1.5rem 0;
}
.btn_align.left {
  justify-content: flex-start;
}
.btn_align.left .btn:not(:last-child) {
  margin-right: 1rem;
}
.btn_align.center {
  justify-content: center;
}
.btn_align.center .btn:not(:last-child) {
  margin-right: 1rem;
}
.btn_align.right {
  justify-content: right;
}
.btn_align.right .btn:not(:last-child) {
  margin-right: 1rem;
}

.table {
  width: 100%;
  border-top: 2px solid #111111;
  font-size: 1.8rem;
}
.table tr th {
  background-color: #F7F9FD;
  border-bottom: 1px solid #CCCCCC;
  border-right: 1px solid #ccc;
  color: #111;
  font-weight: bold;
  padding: 1.3rem 1rem;
}
.table tr th:last-child {
  border-right: none;
}
.table tr td {
  color: #656565;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  padding: 1.3rem 1rem;
}
.table tr td:last-child {
  border-right: none;
}
.table tr td a {
  font-weight: 500;
}
.table tr td a:hover {
  text-decoration: underline;
}
.table tr td .title {
  width: 100%;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
}
.table.table_layout {
  table-layout: fixed;
}
.table.table_layout tr th {
  border-right: none;
  white-space: nowrap;
}
.table.table_layout tr td {
  border-right: none;
}
.table.center tr td,
.table.center tr th {
  text-align: center;
}
.table.left tr td,
.table.left tr th {
  text-align: left;
}
.table.right tr td,
.table.right tr th {
  text-align: right;
}
.table.th_left tr th {
  text-align: left;
}
.table.th_center tr th {
  text-align: center;
}
.table.th_right tr th {
  text-align: right;
}
.table.td_left tr td {
  text-align: left;
}
.table.td_center tr td {
  text-align: center;
}
.table.td_right tr td {
  text-align: right;
}

.scroll_table[class*=wide] {
  overflow-x: auto;
}
.scroll_table.wide100 .table {
  min-width: 10rem;
}
.scroll_table.wide200 .table {
  min-width: 20rem;
}
.scroll_table.wide300 .table {
  min-width: 30rem;
}
.scroll_table.wide400 .table {
  min-width: 40rem;
}
.scroll_table.wide500 .table {
  min-width: 50rem;
}
.scroll_table.wide600 .table {
  min-width: 60rem;
}
.scroll_table.wide700 .table {
  min-width: 70rem;
}
.scroll_table.wide800 .table {
  min-width: 80rem;
}
.scroll_table[class*=high] {
  overflow-y: auto;
}
.scroll_table.high100 .table {
  min-height: 10rem;
}
.scroll_table.high200 .table {
  min-height: 20rem;
}
.scroll_table.high300 .table {
  min-height: 30rem;
}
.scroll_table.high400 .table {
  min-height: 40rem;
}
.scroll_table.high500 .table {
  min-height: 50rem;
}
.scroll_table.high600 .table {
  min-height: 60rem;
}
.scroll_table.high700 .table {
  min-height: 70rem;
}
.scroll_table.high800 .table {
  min-height: 80rem;
}

.paging {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 3rem 0;
}
.paging li {
  margin-right: 1rem;
}
.paging li:last-child {
  margin-right: 0;
}
.paging li.next a i {
  font-size: 2.2rem;
}
.paging li.prev a i {
  font-size: 2.2rem;
}
.paging li a {
  display: block;
  border: 1px solid #CCCCCC;
  border-radius: 1rem;
  background-color: #fff;
  width: 3.6rem;
  height: 3.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  color: #979797;
  font-size: 1.6rem;
  font-weight: 500;
}
.paging li a i {
  color: #979797;
  font-size: 2rem;
}
.paging li.active a, .paging li:hover a, .paging li:focus a {
  background: rgb(34, 96, 205);
  background: linear-gradient(155deg, rgb(34, 96, 205) 0%, rgb(72, 173, 247) 100%);
  border: none;
  color: #fff;
}
.paging li.active a i, .paging li:hover a i, .paging li:focus a i {
  color: #fff;
}
.paging li.disable a, .paging li.disable:hover a, .paging li.disable:focus a {
  cursor: default;
  background: #fff;
  border: 1px solid #ddd;
  color: #DDDDDD;
}
.paging li.disable a i, .paging li.disable:hover a i, .paging li.disable:focus a i {
  color: #DDDDDD;
}
.paging li.frist a, .paging li.prev a, .paging li.next a, .paging li.last a {
  border: none !important;
}
.paging.left {
  justify-content: flex-start;
}
.paging.right {
  justify-content: flex-end;
}

.search_form {
  background-color: #F7F9FD;
  padding: 2.5rem 4.5rem;
  border-radius: 1.5rem;
  margin-top:4rem;
  margin-bottom: 4rem;
}
.search_form.left fieldset {
  justify-content: flex-start;
}
.search_form.center fieldset {
  justify-content: center;
}
.search_form.right fieldset {
  justify-content: flex-end;
}
.search_form fieldset {
  display: flex;
  align-items: center;
  width: 100%;
}
.search_form fieldset select {
  width: 100%;
  max-width: 12rem;
  background: url(/home/child/images/common/angle-down.svg) no-repeat calc(100% - 1.5rem) center #fff;
  background-size: 1.8rem;
}
.search_form fieldset input {
  width: 100%;
  max-width: 38rem;
  margin: 0 0.6rem;
}
.search_form fieldset button {
  width: 100%;
  max-width: 8rem;
}
.search_form fieldset select,
.search_form fieldset input,
.search_form fieldset button {
  display: block;
  border-radius: 1rem;
  border: 1px solid #ccc;
  height: 5rem;
  line-height: 5rem;
  padding: 0 1.5rem;
}
.search_form fieldset label {
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0 none;
  clip: rect(0, 0, 0, 0);
}

@media (max-width: 1024px) {
  .card_list .item {
    width: calc(25% - 2rem);
  }
  .respon_table .table {
    table-layout: fixed;
  }
  .respon_table .table tr .t_title a {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .respon_table .table tr .t_numb {
    width: 10%;
  }
  .respon_table .table tr .t_title {
    width: 70%;
  }
  .respon_table .table tr .t_writer {
    width: 20%;
  }
  .respon_table .table tr .t_date,
  .respon_table .table tr .t_file,
  .respon_table .table tr .t_sort,
  .respon_table .table tr .t_date,
  .respon_table .table tr .t_hits {
    display: none;
  }
}
@media (max-width: 768px) {
  .sub_tab .sub_tab_title {
    display: flex;
  }
  .sub_tab .sub_tab_title.active {
    margin-bottom: 2px;
  }
  .sub_tab .sub_tab_title.active::after {
    transform: rotate(180deg) translateY(50%);
  }
  .sub_tab .sub_tab_list {
    display: none;
    flex-flow: column;
  }
  .sub_tab .sub_tab_list li {
    width: 100% !important;
    margin-bottom: 2px;
  }
  .sub_tab .sub_tab_list li a {
    font-size: 2.2rem;
    color: #111111;
  }
  .sub_tab .sub_tab_list li a:hover {
    background-color: #F7F9FD;
  }
  .sub_tab .sub_tab_list li.active a {
    background: #eef3ff;
    color: #111;
  }
  .card_list {
    width: calc(100% + 1.5rem);
  }
  .card_list .item {
    width: calc(33.33% - 1.5rem);
    margin-right: 1.5rem;
  }
  .search_form {
    padding: 2.5rem 3.5rem;
  }
  .search_form fieldset {
    flex-flow: column;
    width: 100%;
  }
  .search_form fieldset select {
    max-width: 100%;
  }
  .search_form fieldset input {
    max-width: 100%;
    margin: 0.6rem 0;
  }
  .search_form fieldset button {
    max-width: 100%;
  }
}
@media (max-width: 425px) {
  .card_list {
    width: calc(100% + 1rem);
  }
  .card_list .item {
    width: calc(50% - 1rem);
    margin-right: 1rem;
  }
}

/*광주의 위치*/
.position_wrap{margin-top:40px; background:url(/home/child/images/sub/position_line.png); padding:40px; text-align:center;}
.position_wrap p{margin-top:25px;}
.position_wrap .box01 {margin-top:40px;}
.position_wrap .box01 .con01{margin-top:40px;}
.position_wrap .box01 .con02{margin-top:20px;}
.position_wrap .box02{margin-top:60px;}
.position_wrap .box02 .con03{margin-top:40px;}


@media (min-width:1024px) {
    .position_wrap{text-align:left; padding:60px;}
    .position_wrap .box01 .tit01{margin-bottom:30px;}
    .position_wrap .box01{overflow:hidden;}
    .position_wrap .box01 .con01{float:left; width:49%;}
    .position_wrap .box01 .con02{float:right; width:49%; margin-top:40px;}
    .position_wrap .box02{margin-top:80px; overflow:hidden;}
    .position_wrap .box02 .tit02{float:left; width:46%;}
    .position_wrap .box02 .con03{float:right; width:49%;}
}

@media (min-width:1440px) {
	.position_wrap .box{width:91%;}
    .position_wrap .box01 .con01{margin-left:60px; width:43%}
    .position_wrap .box01 .con02{width:49%;}
    .position_wrap .box02 .tit02{width:46%;}
    .position_wrap .box02 p{line-height:1.6;}
    .position_wrap .box02 .con03{width:44%;}
}

/*광주의 상징*/
.symbol_wrap{margin-top:40px; position:relative; word-break:keep-all;}
.symbol_wrap .top{padding:15px; text-align:center;}
.symbol_wrap .top p{text-align:center; margin-top:25px; font-weight:400}
.symbol_wrap .symbol_box{margin:30px 0 40px; border:2px solid #2360cc; border-radius:20px; padding:40px 30px; background:#fff;}
.symbol_wrap .symbol_box .box01{text-align:center;margin-bottom:30px;background:url(/home/child/images/sub/waveline.png)repeat-x left bottom;padding-bottom:50px;}
.symbol_wrap .symbol_box .box01:last-child{background:none; padding-bottom:0; margin-bottom:0;}
.symbol_wrap .symbol_box .box01 img{width:40%;max-width:191px;}
.symbol_wrap .symbol_box .box01 .tit{font-size:2rem;position:relative;border:3px dashed #2360cc;display:inline-block;padding: 5px 20px;color:#2360cc;font-weight:bold;border-radius:30px;background:#f1f8ff;margin: 25px 0;}
.symbol_wrap .symbol_box .box01 .tit:before{content:'';display:block;background:url(/home/child/images/common/water.png)no-repeat;width: 36px;height: 30px;top: -11px;right: -20px;position:absolute;background-size: 60%;}

.symbol_wrap .symbol_box02 ul{display:flex;flex-wrap:wrap;justify-content:center;}
.symbol_wrap .symbol_box02 ul li{border-radius:20px; margin-bottom:30px; position:relative; overflow:hidden;}
.symbol_wrap .symbol_box02 .txt_box{position:absolute; background:#fff; right:0; bottom:0; left:0; border-radius:20px; text-align:center; padding:30px 20px 20px; width:calc(100% - 50px); margin:0 auto 30px;}
.symbol_wrap .symbol_box02 .txt_box h4{font-size:2rem; color:#2360cc; position:relative;}
.symbol_wrap .symbol_box02 .txt_box h4:before{position:absolute;content:'\f520';display:block;top:-50px;left: 50%;background:#fff;border-radius:100%;width:50px;height:50px;line-height:50px;transform: translateX(-50%); font-weight:500; color:#7e9add;}
.symbol_wrap .symbol_box02 ul li:nth-child(2) .txt_box h4:before{content:'\f800'}
.symbol_wrap .symbol_box02 ul li:nth-child(3) .txt_box h4:before{content:'\f1bb'}

@media (min-width: 768px) {
  .symbol_wrap{width:600px; margin:50px auto 0;}
  .symbol_wrap .symbol_box02 ul{justify-content:center}
}


@media (min-width:1024px) {
    .symbol_wrap{width:100%;}
    .symbol_wrap .symbol_box{margin:50px 0 40px;}
    .symbol_wrap .symbol_box .box01{text-align:left; padding:30px 30px 90px;}
    .symbol_wrap .symbol_box .box01:last-child{padding-bottom:75px;}
    .symbol_wrap .symbol_box .box01 .photo{float:left; margin-bottom:30px}
    .symbol_wrap .symbol_box .box01 img{width:80%;}
    .symbol_wrap .symbol_box .box01 .tit{margin-top:5px; margin-bottom:15px;}

    .symbol_wrap .symbol_box02 ul{justify-content: space-between;}
    .symbol_wrap .symbol_box02 ul li{width:33%;}
}


@media (min-width:1440px) {
	.symbol_wrap{margin-top:80px;}
    .symbol_wrap .top p{width:67%; margin:40px auto; word-break:keep-all;}
    .symbol_wrap:before{content:''; display:block; background:url(/home/child/images/sub/gj_simbol_back.png)no-repeat; background-size:contain; width:100%; height:500px; position:absolute; top:40px; left:0; z-index:-1}
    .symbol_wrap .symbol_box{padding:80px; margin-top:180px; margin-bottom:50px;}
    .symbol_wrap .symbol_box .photo{margin-right:50px;}
    .symbol_wrap .symbol_box .box01{padding:30px 40px 90px}
    .symbol_wrap .symbol_box .box01:first-child{padding-bottom:140px; padding-left:70px}
    .symbol_wrap .symbol_box .box01:last-child{padding-left:70px;}
    .symbol_wrap .symbol_box .box01:first-child .photo{margin-right:58px;}
    .symbol_wrap .symbol_box .box01:last-child .photo{margin-right:58px;}
    .symbol_wrap .symbol_box .box01 img{width:100%; max-width:236px;}
    .symbol_wrap .symbol_box .box01 .tit{margin-top:20px; font-size:2.2rem; padding:3px 25px; border-radius:30px}
    .symbol_wrap .symbol_box02 ul li{width:31%;}
    .symbol_wrap .symbol_box02 .txt_box{padding:40px 25px 35px}
    .symbol_wrap .symbol_box02 .txt_box h4{font-size:24px;}
    .symbol_wrap .symbol_box02 .txt_box h4:before{font-size:24px; width:60px; height:60px; line-height:60px; top:-60px}
}

/*광주의 특산물*/
.special_wrap{margin-top:60px; position:relative;}
.special_wrap .top{text-align:center;}
.special_wrap .con_box{margin-top:60px;}
.special_wrap .con_box ul{/* display: flex; */flex-wrap: wrap;justify-content: center;}
.special_wrap .con_box ul li{border:3px solid #1088a1; border-radius:20px; padding:30px; text-align:center; margin-top:35px; position:relative; box-shadow:0 0 10px rgba(0,0,0,0.1);}
.special_wrap .con_box ul li:before{content:''; display:block; position:absolute; transform: translateX(0)}
.special_wrap .con_box ul li:nth-child(1):before{width:127px; height:143px; background:url(/home/child/images/sub/specialty01.png)no-repeat; background-size:70%; top:-50px; left:30px;}
.special_wrap .con_box ul li:nth-child(2):before{width:102px; height:185px; background:url(/home/child/images/sub/specialty02.png)no-repeat; background-size:70%; top:-50px; right:-20px;}
.special_wrap .con_box ul li:nth-child(3):before{width:238px; height:133px; background:url(/home/child/images/sub/specialty03.png)no-repeat; background-size:70%; bottom:-90px; right:-70px;}
.special_wrap .con_box ul li .img_box{overflow:hidden; border-radius:20px;}
.special_wrap .con_box ul li .img_box img{width:100%;}
.special_wrap .con_box ul li .tit{font-size:2rem;position:relative;border:3px dashed #1088a1;display:inline-block;padding: 5px 20px;color:#1088a1;font-weight:bold;border-radius:30px;background:#e6f6fb;margin: 25px 0; text-align:center;}
.special_wrap .con_box ul li .tit:before{content:'';display:block;background:url(/home/child/images/common/water01.png)no-repeat;width: 36px;height: 30px;top: -11px;right: -20px;position:absolute;background-size: 60%;}

@media (min-width:768px) {
   .special_wrap{width:600px; margin:65px auto;} 
}

@media (min-width:1024px) {
    .special_wrap{width:100%;margin: 80px auto 80px; position:relative;}
    .special_wrap:before {content: ''; display: block; background: url(/home/child/images/sub/gj_specialty_back.png)no-repeat; background-size: contain; width: 100%; height: 246px; position: absolute; top: 90px; left: 0; z-index: -1
    }
    .special_wrap .con_box{margin-top:120px;}
    .special_wrap .con_box ul{ display: flex; flex-wrap: wrap; justify-content: center;}
    .special_wrap .con_box ul li{width:30%; margin-right:35px;}
    .special_wrap .con_box ul li:nth-child(2){top:40px;}
    .special_wrap .con_box ul li:nth-child(2):before{top:100px;}
    .special_wrap .con_box ul li:last-child{margin-right:0;}
}

@media (min-width:1440px) {
	.special_wrap{margin-top:100px}
    .special_wrap .con_box ul li{padding:35px;}
    .special_wrap .con_box ul li .tit{font-size:2.2rem; padding:4px 26px; border-radius:30px;  margin:35px 0;}
    .special_wrap .con_box ul li .tit:before{top:-11px; right:-16px;}
    .special_wrap .con_box ul li:nth-child(1):before{background-size:100%; top:-60px;}
    .special_wrap .con_box ul li:nth-child(2):before{background-size:100%;}
    .special_wrap .con_box ul li:nth-child(3):before{background-size:100%; right:-30px; bottom:-70px;}
}

/*예술의고장예향*/
.name_wrap{text-align:center; word-break:keep-all;}
.name_wrap .name_box{background:#f1f8ff;padding: 0 20px; margin-bottom:70px}
.name_wrap .name_box .txt_box{border-radius:20px;padding:20px;background:#fff;position:relative;top:0; transform: translateY(22%)}
.name_wrap .name_box .txt_box .left{margin-bottom:15px;}
.name_wrap .name_box .txt_box .left p{font-size: 2.2rem;font-weight:bold;}
.name_wrap .name_box .txt_box .left span{display:block; color:#2360cc;}
.name_wrap .txt_bott{margin-top: 0;}
.name_wrap .txt_bott .left{border-radius:20px; overflow:hidden; box-shadow: 0 .5rem 1rem rgba(0,0,0,0.15);}
.name_wrap .txt_bott .left img{width:100%;}
.name_wrap .txt_bott ul li{margin-bottom:40px;}
.name_wrap .txt_bott .right .tit {font-size: 2rem;position: relative;border: 3px dashed #2360cc;display: inline-block;padding: 5px 20px;color: #2360cc;font-weight: bold;border-radius: 30px;background: #e6f6fb;margin: 25px 0;text-align: center;}
.name_wrap .txt_bott .right .tit:before {content: ''; display: block; background: url(/home/child/images/common/water.png)no-repeat; width: 36px; height: 30px; top: -11px; right: -20px; position: absolute; background-size: 60%;}


@media (min-width:768px) {
   .name_wrap .txt_bott{margin-top:60px; padding:0 20px;} 
}


@media (min-width:1024px) {
    .name_wrap .name_box{background:url(/home/child/images/sub/art_top.jpg)no-repeat;background-size: contain;height: 403px;width: 100%; margin-bottom:40px}
    .name_wrap .name_box .txt_box{transform: translateY(140%);overflow:hidden;text-align:left;padding:30px 45px;}
    .name_wrap .name_box .txt_box .left{float:left; margin-right:60px;}
    .name_wrap .txt_bott{position:relative; z-index:10; margin-top:-50px}
    .name_wrap .txt_bott ul li{margin-bottom: 60px;overflow: hidden;}
    .name_wrap .txt_bott ul li:first-child{border-bottom:1px dashed #dcdcdc; padding-bottom:60px;}
    .name_wrap .txt_bott ul li:first-child .right p:last-child{margin-top:10px;}
    .name_wrap .txt_bott .left{float:left; margin-right:60px;}
    .name_wrap .txt_bott .right{text-align:left;}
    .name_wrap .txt_bott .right .tit{margin-top:45px;}

	.name_wrap.st02 .name_box .txt_box{transform: translateY(95%);}
	.name_wrap.st02 .name_box .txt_box .left p{margin-bottom:65px;}
}

@media (min-width:1440px) {
    .name_wrap .name_box{padding:0 100px}
    .name_wrap .name_box .txt_box{transform: translateY(110%);padding: 60px 70px 70px;}
    .name_wrap .name_box .txt_box .left{margin-right:80px;}
    .name_wrap .name_box .txt_box .left p{font-size:2.3rem;}
    .name_wrap .name_box .txt_box .left span{font-size:4rem;}
    .name_wrap .name_box .txt_box .right p{font-size:2rem;}
    .name_wrap .name_box .txt_box .right{margin-top:4px}
    .name_wrap .name_box .txt_box .right p:last-child{margin-top:15px;}
    .name_wrap .txt_bott{padding:0;margin-top: 200px;}
    .name_wrap .txt_bott .left{margin-right:80px;}
    .name_wrap .txt_bott ul li{padding:0 40px; margin-bottom:80px}
    .name_wrap .txt_bott ul li:first-child{padding-bottom:80px;}
    .name_wrap .txt_bott ul li:last-child{margin-bottom:20px;}

    .name_wrap .txt_bott .right .tit{font-size:2.2rem; padding:4px 26px; border-radius:30px; margin-top:50px;}
    
}


/*찾아오시는길*/
.map_info{background:#2360cc; padding:20px;}
.map_info p, .map_info i{color:#fff;}
.map_info p{margin-bottom:5px;}
.map_info i{margin-right:5px;}
.table.map_table th{padding: 4rem 1rem;}

@media (min-width:768px) {
    .map_info{overflow:hidden;}
    .map_info p{display:inline-block; margin-bottom:0; margin-right:15px; margin:15px 15px 10px}
    .map_info p:last-child{float:right; margin-top:0;}
}

/*맛의고장미향*/
.name_wrap.st01 .name_box{background:#fff6e5;}
.name_wrap.st01 .name_box .txt_box .left span{color:#d09626;}
.name_wrap.st01 .txt_bot ul li{margin-bottom:40px;}
.name_wrap.st01 .txt_bot .right .tit {font-size: 2rem; position: relative; border: 3px dashed #d09626; display: inline-block; padding: 5px 20px; color: #d09626; font-weight: bold; border-radius: 30px; background: #fdf7ed; margin: 25px 0; text-align: center;}
.name_wrap.st01 .txt_bot .right .tit:before {content: '';display: block; background: url(/home/child/images/common/water02.png)no-repeat; width: 36px; height: 30px; top: -11px; right: -20px; position: absolute; background-size: 60%;}
.name_wrap.st02 .name_box {
    background: #fff0ef; margin-bottom:100px;
}

.name_wrap.st02 .name_box .txt_box .left span {
    color: #d1554b
}


@media (min-width:768px) {
    .name_wrap.st01 .txt_bot ul li{overflow:hidden; border-bottom: 1px dashed #dcdcdc; padding-bottom:40px;}
    .name_wrap.st01 .txt_bot ul li:last-child{border-bottom:none; padding-bottom:0; margin-bottom:0;}
    .name_wrap.st01 .txt_bot .left{float:left; margin-right:50px;}
    .name_wrap.st01 .txt_bot .right{text-align:left;}
    .name_wrap.st01 .txt_bot{padding:0 20px;}
}

@media (min-width:1024px) {
    .name_wrap.st01 .name_box {background:url(/home/child/images/sub/food_top.jpg)no-repeat; background-size: contain; height: 380px; width: 100%; margin-bottom: 40px;}
	 .name_wrap.st02 .name_box {
        background:url(/home/child/images/sub/history_top.jpg)no-repeat;
        background-size: contain;
        width: 100%;
        margin-bottom: 40px
    }
}

@media (min-width:1440px) {
    .name_wrap.st01 .name_box{height:403px;}
    .name_wrap.st01 .txt_bot{margin-top:200px; padding:0}
    .name_wrap.st01 .txt_bot ul{display:flex; flex-wrap:wrap;}
    .name_wrap.st01 .txt_bot ul li{width:47%; padding:0 20px 60px; margin-bottom:60px;}
    .name_wrap.st01 .txt_bot ul li:nth-child(odd){margin-right:6%;}
    .name_wrap.st01 .txt_bot ul li:nth-child(even){margin-right:0;}
    .name_wrap.st01 .txt_bot .right .tit {font-size: 2.2rem; padding: 4px 26px; border-radius: 30px; margin-top: 10px;}
	  .name_wrap.st02 .txt_bottt {
        margin-top: 230px;
        padding: 0;
		  margin-bottom:100px;
    }
    
}

/*광주의예술인*/
.gj_art_wrap{border:3px solid #2360cc; border-radius:20px; padding:35px 20px; margin-top:50px;}
.gj_art_wrap ul li{text-align:center; margin-bottom:30px;}
.gj_art_wrap ul li .tit{font-size:2rem; font-weight:bold; color:#2360cc; margin:15px 0}

@media (min-width:768px) {
    .gj_art_wrap{padding:45px 35px;}
    .gj_art_wrap ul li{display:flex;padding: 0 30px 40px 10px;overflow:hidden;border-bottom:1px dashed #dcdcdc;margin-bottom:40px;padding-bottom:40px;}
    .gj_art_wrap ul li:last-child{border-bottom:none; padding-bottom:0; margin-bottom:0;}
    .gj_art_wrap ul li:nth-child(even){flex-direction:row-reverse;}
    .gj_art_wrap ul li .left{margin-right:50px; min-width:49%;}
    .gj_art_wrap ul li:nth-child(even) .left{margin-right:0; margin-left:50px;}
    .gj_art_wrap ul li .right{text-align:left; margin-top:50px;}
    .gj_art_wrap ul li .tit{margin-top:0}
	.gj_art_wrap.st01 ul li .left{width: 45%;min-width: auto;}
	.gj_art_wrap ul li:last-child{margin-bottom:40px;}

}


@media (min-width:1024px) {
    .gj_art_wrap ul li .right{margin-top:110px}
	.gj_art_wrap.st01 ul li .left{width: 30%;}
    .gj_art_wrap.st01 ul li .right{margin-top:80px;}
	.gj_art_wrap.st02 ul li:nth-of-type(4) .left{margin-left:130px;}
}

@media (min-width:1440px) {
    .gj_art_wrap{padding:50px; position:relative;}
    .gj_art_wrap:before, .gj_art_wrap ul:before{content:''; display:block; position:absolute; }
    .gj_art_wrap:before{background:url(/home/child/images/sub/gj_art_back01.png)no-repeat; top:380px; right:-30px; width:123px; height:157px;}
	.gj_art_wrap ul{position:relative;}
    .gj_art_wrap ul:before{background:url(/home/child/images/sub/gj_art_back02.png)no-repeat; bottom:367px; left:-53px; width:150px; height:239px;}
    .gj_art_wrap ul li .left{min-width:44%;}
    .gj_art_wrap ul li .tit{font-size:2.2rem;}
    .gj_art_wrap ul li .right{margin-top:135px;}
	.gj_art_wrap.st01 ul li .left{width: 28%}
    .gj_art_wrap.st01 ul li .right{margin-top:110px;}
    .gj_art_wrap.st01 ul li:nth-child(odd) .left{margin-right:90px}
    .gj_art_wrap.st01 ul li:nth-child(even) .left{margin-left:180px;}
	.gj_art_wrap.st01:before{background:none;}
	.gj_art_wrap.st01 ul:before{background:none;}
	.gj_art_wrap.st02 ul li:nth-of-type(2) .left{margin-left:130px;}
	.gj_art_wrap.st02 ul li:nth-of-type(2) .right{width:40%;}
	.gj_art_wrap.st02 ul li:nth-of-type(4) .left{margin-left:340px;}
}


/* 내가시장이라면 */
.reply_top{border-radius:20px; overflow:hidden; margin-top:50px;}
.reply_top .text_wrap{padding:30px 20px 5px; background:#e3f5ff;}
.reply_top .text_wrap p{color:#2360cc; text-align:center; margin:20px 0;}
.reply_top .text_wrap .s_title{line-height:1.6;}
.reply_top .text_wrap .title img{max-width:100%;}

.reply_top .write_wrap{background:#e3f5ff; padding:0 15px 15px;}
.reply_top .write_wrap .write_box{background:#2360cc; padding:30px 20px; border-radius:20px;}
.reply_top .write_wrap .select{position:relative;}
.reply_top .write_wrap .select .btn_setting{background:#f5bc07;color:#fff;width:25px;height:25px;text-align:center;display:block;line-height:25px;border-radius:50%;position:absolute;top: 36px;left: 40px; font-size:14px;}
.reply_top .write_wrap .select .btn_setting i{color:#fff;}
.reply_top .write_wrap .select .character_select{display:none; position:absolute; top:65px; left:0; background:#fff; z-index:1; border:1px solid #333; padding:35px 10px 15px 10px;}
.reply_top .write_wrap .select .character_select ul{overflow:hidden;}
.reply_top .write_wrap .select .character_select ul li{float:left; width:19%; margin-right:1.2%}
.reply_top .write_wrap .select .character_select ul li:last-child{margin-right:0;}
.reply_top .write_wrap .select .character_select ul li a{display:block;}
.reply_top .write_wrap .select .character_select ul li a img{max-width:100%;}

.reply_top .write_wrap .select .character_select .btn_select_close{position:absolute; top:10px; right:4px;}
.reply_top .write_wrap .select .character_select .btn_select_close a{display:block; width:15px; height:15px; position:relative; text-indent:-99999px;}
.reply_top .write_wrap .select .character_select .btn_select_close a:before,.reply_top .write_wrap .select .character_select .btn_select_close a:after {display:block; content:""; position:absolute; width:12px; height:1px; background:#555; top:6px; left:0; }
.reply_top .write_wrap .select .character_select .btn_select_close a:before {transform:rotate(45deg); }
.reply_top .write_wrap .select .character_select .btn_select_close a:after {transform:rotate(-45deg); }

.reply_top .write_wrap .write{margin-top:10px;}
.reply_top .write_wrap .write .top input{margin-bottom:5px; border-radius:8px;}
.reply_top .write_wrap .write .bottom textarea{min-height:130px; border-radius:8px 8px 0 0; margin-top:5px; padding:20px;}
.reply_top .write_wrap .write .bottom .btn_reply{display:block; text-align:center; color: #fff; background:#f5bc07; padding:15px 0; border-radius:0 0 8px 8px;}

.reply_bottom{margin:35px 10px 0 10px;}
.reply_bottom .reply_total{font-size:1.9rem; padding-left:25px; position:relative;}
.reply_bottom .reply_total:before{content:'\f4b0'; font-family:"font awesome 5 pro"; font-weight:300; position:absolute; left: 21px; font-size:18px; position:absolute; left:0;}
.reply_bottom .reply_list li{position:relative;}
.reply_bottom .reply_list li{padding: 30px 0;border-bottom:1px solid #dfdfdf;}
.reply_bottom .reply_list li img{position:absolute;top: 20px;left:0;width:50px;height:50px;}
.reply_bottom .reply_list li .name{font-size: 2rem;font-weight:500;margin: 0 0 8px 0;display:block;}
 .reply_bottom .reply_list li .text{padding-left: 65px;}
.reply_bottom .reply_list li .cont{line-height:1.4; margin-bottom:25px;}
.reply_bottom .reply_list li .date{color:#666;font-size: 1.7rem;/* position: absolute; *//* top: 30px; *//* left: 135px; */margin: 0 0 15px 0;display: inline-block;}
.reply_bottom .reply_list li .btn_area{margin-top:20px;}
.reply_bottom .reply_list li .btn_area a{display:inline-block;border:1px solid #333;border-radius:30px;padding: 5px 15px 5px 34px;position:relative;font-weight:400;font-size: 1.7rem;margin: 5px 0; letter-spacing:0; }
.reply_bottom .reply_list li .btn_area .btn_write{margin-right:5px;}
.reply_bottom .reply_list li .btn_area a:before{font-family:"font awesome 5 pro";font-weight:300;position:absolute;left: 14px;font-size:14px;}
.reply_bottom .reply_list li .btn_area .btn_write:before{content:'\f044';}
.reply_bottom .reply_list li .btn_area .btn_delete:before{content:'\f2ed';}
.reply_bottom .reply_list li .btn_area .blockAdmin:before{content:'\f070';}

.form-style {
    display: inline-block;
    width: 100%;
    height: 40px;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 300;
    vertical-align: middle;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #e5e5e5;
    box-sizing: border-box
}

.btn_con{ display:inline-block; padding:12px 15px; font-size:14px; border-radius: 3px; font-weight:500;  margin:5px 0; }

.btn_write {
    display: inline-block;
    padding: 10px 20px;
    background: #232323;
    color: #fff;
    border-radius: 5px;
    letter-spacing: .4em
}

@media all and (min-width:640px){
	.reply_top .text_wrap .s_title{font-size:1.9rem;}
	.reply_top .write_wrap .select{position:absolute; top:0 left:0;}
	.reply_top .write_wrap .select .character_select{width:350px;}
	.reply_top .write_wrap .write{padding-left:95px;}
    .reply_top .write_wrap .write .top input{display:inline-block; width:49%;}
    .reply_top .write_wrap .write .top input.reply_name{margin-right:2%;}
    .reply_top .write_wrap .write .bottom{overflow:hidden; margin-top:15px;}
    .reply_top .write_wrap .write .bottom textarea{float:left;width: 70%;border-radius:8px 0 0 8px;margin-top:0;}
    .reply_top .write_wrap .write .bottom .btn_reply{float:left;width: 30%;border-radius:0 8px 8px 0;height:130px !important;padding: 0;line-height: 130px;font-weight: 500;}   
   
    .reply_bottom .reply_list li .name{/* margin-bottom:20px; */font-size:2.2rem;}
    .reply_bottom .reply_list li .cont{/* margin-bottom:50px; */font-size:1.9rem;}
    .reply_bottom .reply_list li .btn_area{/* position:absolute; *//* bottom:30px; *//* right:0; */}
}

@media all and (min-width:1024px){
	.reply_top .text_wrap p br{display:block;}
    .reply_top .text_wrap .s_title{font-size:2rem;}
    .reply_top .write_wrap .write .top input{width:220px;}
    .reply_top .write_wrap .write .top input.reply_name{margin-right:10px}
    .reply_top .write_wrap{padding:40px;}
    .reply_top .write_wrap .write .bottom textarea{width:80%;}
    .reply_top .write_wrap .write .bottom .btn_reply{width:20%;}
    .reply_bottom{margin:35px 30px 0 30px;}
    .reply_bottom .reply_total{font-size:20px;}
	.reply_bottom .reply_list li{padding:40px;}
	 .reply_bottom .reply_list li .text{padding-left: 45px;}
    .reply_bottom .reply_list li .name{font-size:2.2rem;}
	.reply_bottom .reply_list li .date{font-size:1.8rem;}
    .reply_bottom .reply_list li .cont, .reply_bottom{font-size:1.9rem;}
    .reply_bottom .reply_list li .btn_area{ position:absolute; top:-10px; right:10px; }
	.reply_bottom .reply_list li .btn_area a {margin:15px 0}
	.reply_bottom .reply_list li img{top:30px;}
	 .reply_top .text_wrap {
        padding:50px 40px 0 40px;
        background-image: url('/home/child/images/sub/mayor_back.png');
        background-repeat: no-repeat;
        background-size:cover;
    }
    

    .reply_top .text_wrap .s_title {
        font-size: 2rem; width:80%; margin:15px auto 0; font-weight:400;
    }

}

@media (min-width:1440px) {
     .reply_top .text_wrap{padding:50px 220px 0 220px;}
    .reply_top .text_wrap .s_title{margin-top:40px; padding-bottom:10px;}
}



/*내가시장이라면*/
.security{background:#fff;padding:10px;border-radius:7px;overflow: hidden;}
.security input[type="text"]{ width:100%; height:35px; }
.reply_form{ text-align:right; }
.insertReply{ background:#404040; color:#fff; border:0; padding:0 10px; line-height:30px; margin-top:5px;  border-radius:5px; }
.reply_user_list{position:relative;padding: 20px 15px; margin-top:15px; background: #f5f5f5;}
.reply_user_list .btn_set{ position:absolute; right:15px; top:10px;}
.reply_user_list .btn_set a{ display:inline-block; background:#eb4141; color:#fff; font-size:12px; font-weight:500; padding:5px; border-radius:5px; }
.reply_list .reply_blind{  line-height:50px; }

.edit_wrap{ position:fixed; left:0; right:0; top:0; bottom:0; background:rgba(0,0,0,0.5); z-index:1000; }
.edit_wrap .edit_box{ position:absolute; width:320px; left:50%; top:50%; transform:translateX(-50%) translateY(-50%); background:#fff; padding:20px; text-align:center; border-radius:10px; }
.edit_wrap .edit_box label{ display:block; font-weight 500; margin-bottom:10px;}
.edit_wrap .edit_box .btn{ display:inline-block; padding:10px; border-radius:5px; margin-top:10px;}
@media all and (min-width:768px){
	.security .btnLayer{ float:left;  }
	.security img{ float:left; margin-right:10px; }
	.security input[type="text"]{width:auto;min-width: 275px;margin-left: 10px;}
	.reply_form textarea{ float:left; width:92%; height:40px;  }	
	.insertReply{ width:8%; line-height:40px; margin-top:0; border-radius:0;  }
}

/*내일이빛나는기회도시*/
.city_wrap{padding-top:15px;}
.city_wrap div:first-child{margin-bottom:30px; text-align:center;}
.city_wrap.st04 ul li{text-align:center; margin:20px 0;}
.city_wrap.st04 ul li p:first-child{border-radius:20px; overflow:hidden;}
.city_wrap.st04 ul li img{width:100%;}
.city_wrap.st04 ul li p:last-child{margin-top:15px; border-radius:30px; border:2px dashed #2260cd; display:inline-block; padding:5px 15px; color:#2260cd; font-weight:bold;}

@media (min-width:768px) {
  .city_wrap.st04 ul{display:flex;align-items: center;}
  .city_wrap.st04 ul li{width:32%; margin-right:20px;}
  .city_wrap.st04 ul li:last-child{margin-right:0;}
  .city_wrap.st04 ul.img02 li{width:100%;}
  .city_wrap.st04 ul.img03 li{width:49%;}
}

@media (min-width:1024px) {
    .city_wrap{overflow:hidden;}
    .city_wrap div:nth-child(1){width:433px;}
    .city_wrap div:nth-child(2){width:48%;}
    .city_wrap .left{float:left;}
    .city_wrap .right{float:right;}

    .city_wrap.st01 div:nth-child(1){width:458px;}
    .city_wrap.st01 div:nth-child(2){width:48%;}
    .city_wrap.st02 div:nth-child(1){width:381px;}
	.city_wrap.st02 div:nth-child(2){width:57%;}
    .city_wrap.st03 div:nth-child(1){width:345px;}
    .city_wrap.st03 div:nth-child(2){width:59%;}
    .city_wrap.st04 div:nth-child(2){width:51%;}
}

@media (min-width:1440px) {
    .city_wrap div:nth-child(2), .city_wrap.st01 div:nth-child(2){width:62%;}
    .city_wrap.st02 div:nth-child(2){width:65%;}
    .city_wrap.st03 div:nth-child(2){width:68%;}
    .city_wrap.st04 div:nth-child(2){width:65%;}
}

.tip_box{position:relative;margin: 40px 0 20px;}
.tip_box:before{content:'';display:block;position:absolute;top: -10px;left: 0;width:74px;height:85px;background:url('/home/child/images/sub/tip_icon.png') no-repeat;}
.tip_box p{background:#fdf8e9;padding:15px 35px;border-radius: 50px;padding-left: 72px; display:inline-block;}

/*아동친화도시*/
.work_wrap{background:#f1f8ff; margin-top:40px;}
.work_wrap .top{padding:25px;}
.work_wrap .top .tit{font-weight:bold; color:#2260cd; font-size:2.2rem; margin-bottom:5px;}

@media (min-width:768px) {
    .work_wrap .top{position:relative; padding-left:110px; }
    .work_wrap .top:before{content:''; display:block; background:url(/home/child/images/sub/work_top_ch001.png)no-repeat; width:194px; height:168px; position:absolute; top:10px; left:10px; background-size:50%; transform: translateY(-5%)}
    .work_wrap .top .tit{position:relative; padding-left:15px; z-index:10;}
    .work_wrap .top .tit:before{content:''; display:block; background:url(/home/child/images/sub/work_mark01.png)no-repeat; width:52px; height:34px; position:absolute; top:0; left:0; z-index:-1; background-size:50%;}
    .work_wrap .top .txt{padding-left:15px;}
	.work_wrap.st01 .top{padding-left:135px}
	.work_wrap.st01 .top:before{background: url(/home/child/images/sub/work_top_ch02.png)no-repeat;background-size: 50%;width: 216px;height: 212px;top: -5px;}
	.work_wrap.st02 .top {padding-left: 125px}
 	.work_wrap.st02 .top:before {background: url(/home/child/images/sub/work_top_ch03.png)no-repeat; background-size: 50%; width: 189px; height: 209px; top: 5px;}

}

@media (min-width:1024px) {
    .work_wrap .top{padding-left:160px; max-height:104px;}
    .work_wrap .top{background:url(/home/child/images/sub/work_top01.jpg)no-repeat; width:100%; height:174px; background-size:contain;}
    .work_wrap .top:before{left:35px;}
	.work_wrap.st01 .top{ background: url(/home/child/images/sub/work_top02.jpg)no-repeat; padding-left:170px;}
	.work_wrap.st02 .top {background: url(/home/child/images/sub/work_top03.jpg)no-repeat; padding-left: 180px; min-height:130px; background-size:contain;}
  	.work_wrap.st02 .top:before{left:62px; top:-21px;}
}

@media (min-width:1440px) {
	.work_wrap{margin-top:85px;}
    .work_wrap .top{max-height: 166px;padding: 40px 40px 40px 298px;}
    .work_wrap .top:before{background-size:100%; transform: translateY(-40%); left:50px}
    .work_wrap .top .tit{font-size: 2.9rem; margin-bottom:10px;}
    .work_wrap .top .tit:before{background-size:100%;top: -15px;left: -22px;}
    .work_wrap .top .txt{font-size:2.1rem;}
	.work_wrap.st01{margin-top:80px;}
	.work_wrap.st01 .top{padding:40px 40px 40px 320px}
	.work_wrap.st01 .top:before{background-size:100%; top:30px;}
	.work_wrap.st02 {margin-top: 90px}
	.work_wrap.st02 .top {padding: 40px 40px 40px 335px; min-height:195px;}
	.work_wrap.st02 .top:before {background-size: 100%; top: 12px; left:85px}
}

/*정의의고장의향*/
.name_wrap.st02 .txt_bottt .box{text-align:left; position:relative;}
.name_wrap.st02 .txt_bottt .box:before{content:''; display:block; position:absolute; top:70px; left:0; width:1px; height:90%; background:#ccc;}
.name_wrap.st02 .txt_bottt .box:last-child{margin-top: 50px;}
.name_wrap.st02 .year{font-size:2.4rem; font-weight:bold; color:#d1554b; margin-bottom:25px;}
.name_wrap.st02 .con{margin-left:25px;position:relative;margin-bottom:25px;}
.name_wrap.st02 .con:before{content:'';display:block;position:absolute;top:1px;left:0;background:url(/home/child/images/sub/history_mark.png)no-repeat;width: 24px;height: 24px;transform: translateY(-50%);transform: translateX(-150%);}
.name_wrap.st02 .tit{font-size:2.2rem; font-weight:bold; margin-bottom:5px;}
.name_wrap.st02 .txt{font-size:2rem; font-weight:bold;}
.name_wrap.st02 a{position:relative; display:inline-block;}
.name_wrap.st02 a:after{display: inline-block;font-family: "Font Awesome 5 Pro";content: "\f0fe";font-weight: 500;right: 3rem;font-size:20px;transition: 0.45s;top:1px; position:absolute; right:-30px}
.name_wrap.st02 a.active:after{content:'\f146';}
.name_wrap.st02 .con div{display:none;background:#f7f7f7;padding:30px;border-radius:20px;margin-top:20px;}
.name_wrap.st02 .con div p:first-child{border-radius:20px; overflow:hidden; margin-bottom:15px;}
.name_wrap.st02 .con div p:first-child img{width:100%}


@media (min-width:1024px) {
    .name_wrap.st02 .txt_bottt .box:after{position:absolute;content:"1900's";color:#ebebeb;font-weight:bold;font-size: 6rem;top: 76px;left: 55%;}
    .name_wrap.st02 .txt_bottt .box:last-child:after{content:"2000's";}
    .name_wrap.st02 .txt_bottt .box{position:relative; overflow:hidden;}
    .name_wrap.st02 .txt_bottt .box:before{left: 50%;}
    .name_wrap.st02 .txt_bottt .box .year{text-align:center;}
    .name_wrap.st02 .txt_bottt .box .con{float:right;width: 42%;clear:both;margin-left: 0;}
    .name_wrap.st02 .txt_bottt .box .con:before{left: -19%;transform: translateX(-58%);margin-left: 2px;}
    .name_wrap.st02 .txt_bottt .box .con:nth-child(even){float:left;margin-left:0;margin-right: 40px; text-align:right;}
    .name_wrap.st02 .txt_bottt .box .con:nth-child(even):before{left: 119%;right: 0;transform: translateX(-50%);margin-left: 1px;}
    .name_wrap.st02 .tit{position:relative;}
    .name_wrap.st02 .tit:after{content:'';position:absolute;top: 16px;width: 67px;height: 1px;border-top:1px dashed #111;z-index: -1;}
    .name_wrap.st02 .txt_bottt .box .con:nth-child(odd) .tit:after{left: -86px;}
    .name_wrap.st02 .txt_bottt .box .con:nth-child(even) .tit:after{right: -88px;}
    .name_wrap.st02 .txt{padding-right:35px;}
    
    .name_wrap.st02 .txt_bottt .box .con:nth-child(even) a:after{right:0; top:4px;}
    .name_wrap.st02 .txt_bottt .box .con:nth-child(odd) a:after{right:0; top:4px;}
    .name_wrap.st02 .con div p:last-child{text-align:left;}
	
	.name_wrap.st02 .txt_bottt .box:last-child .con:nth-child(2) .txt, .name_wrap.st02 .txt_bottt .box:last-child .con:nth-child(6) .txt, .name_wrap.st02 .txt_bottt .box:last-child .con:nth-child(8) .txt{padding-right:0;}
}


@media (min-width:1440px) {
    .name_wrap.st02 .txt_bottt .box:after{font-size:107px;top: 111px;}
    .name_wrap.st02 .txt_bottt .box:before{top: 130px;}
    .name_wrap.st02 .year{font-size:50px; margin-bottom:40px;}
    .name_wrap.st02 .tit{font-size:28px; margin-bottom:10px;}
    .name_wrap.st02 .tit:after{top:19px}
    .name_wrap.st02 .txt_bottt .box .con:nth-child(odd) .tit:after{left: -107px;width: 78px;}
    .name_wrap.st02 .txt_bottt .box .con:nth-child(even) .tit:after{right: -105px;width: 78px;}
    .name_wrap.st02 .txt_bottt .box .con{margin-bottom:35px;}
}

/*문화유산*/
.tour_wrap .con {
    overflow: hidden;
    margin-bottom: 40px
}

.tour_wrap .con .left {
    text-align: center;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 20px
}

.tour_wrap .con .left img {
    width: 100%
}

.tour_wrap .con .tit span {
    font-weight: bold;
    font-size: 2.2rem;
    color: #2360cc
}

.tour_wrap .con .txt {
    margin: 10px 0 20px
}

.tour_wrap .con .box {
    background: #f7f7f7;
    padding: 15px;
    margin-bottom: 15px;
}


@media(min-width: 1024px) {
    .tour_wrap .con {
        margin-bottom:50px;
        position: relative;
        padding-top: 30px
    }

    .tour_wrap .con .left {
        float: left;
        width: 46%;
        position: relative;
        z-index: 1
    }

    .tour_wrap .con .right {
        float: right;
        width: 49%;
        margin-top: 25px
    }


    .tour_wrap .con .box {
        padding: 25px
    }

    .tour_wrap .con .box ul {
        margin-bottom: 0
    }

     .tour_wrap .con a {
        position: absolute;
        top: 50px;
        right: 0
    }
}

@media(min-width: 1440px) {
    .tour_wrap .con:before {
        left:36%;
        font-size: 80px;
        top: -15px
    }

    .tour_wrap .con .left {
        width: 562px
    }

    .tour_wrap .con .right {
        width: 52%;
        margin-top: 10px
    }

    .tour_wrap .con .tit span {
        font-size: 2.4rem
    }

    .tour_wrap .con .txt {
        margin: 15px 0 25px
    }

    .tour_wrap .con a {
        top: 40px;}
}

@media(min-width: 1600px) {
    .tour_wrap .con .right {
        width:55%
    }

    .tour_wrap .con:before {
        left: 34%
    }
}


/*축제행사*/
.festival_wrap .con {
    overflow: hidden;
    margin-bottom: 40px
}

.festival_wrap .con .left {
    text-align: center;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 20px
}

.festival_wrap .con .left img {
    width: 100%
}

.festival_wrap .con .tit {
    font-weight: bold;
    font-size: 2rem
}

.festival_wrap .con .tit span {
    font-size: 2.2rem;
    display: block;
    color: #2360cc
}

.festival_wrap .con ul {
    margin-top: 10px
}

.festival_wrap.st01 .con ul li ul {
    margin-top: 5px
}

@media(min-width: 1024px) {
    .festival_wrap .con {
        margin-bottom:50px;
        position: relative
    }

    .festival_wrap .con:before {
        content: '';
        display: block;
        position: absolute;
        border-top: 1px solid #dcdcdc;
        top: 100px;
        width: 55%;
        height: 1px;
        left: 46%
    }
	
	.festival_wrap .con.line_type1:before {
        top: 120px;
    }

    .festival_wrap .con .left {
        float: left;
        width: 46%
    }

    .festival_wrap .con .right {
        float: right;
        width: 49%;
        margin-top: 25px
    }

    .festival_wrap .con .tit {
        position: relative
    }


    .festival_wrap .con ul {
        margin-top: 30px
    }

    .festival_wrap.st01 .con:before {
        left: 36%;
        width: 70%
    }

    .festival_wrap.st01 .con .left {
        width: 36%
    }

    .festival_wrap.st01 .con .right {
        width: 60%
    }

    .festival_wrap.st02 .con:before {
        left: 38%;
        width: 72%
    }

    .festival_wrap.st02 .con .left {
        width: 38%
    }

    .festival_wrap.st02 .con .right {
        width: 55%
    }

    
    .festival_wrap .con a{position:absolute; top:5px; right:0;}
}

@media(min-width: 1440px) {
    .festival_wrap .con:before {
        width:60%;
        left: 562px;
        top: 98px
    }

    .festival_wrap .con .left {
        width: 562px
    }

    .festival_wrap .con .right {
        width: 52%;
        margin-top: 10px
    }

    .festival_wrap .con .tit {
        font-size: 2.2rem;
    }


    .festival_wrap .con .tit span {
        font-size: 2.3rem;
        display: block;
        margin-bottom:2px;
    }

    .festival_wrap .con ul {
        margin-top: 40px
    }

    .festival_wrap.st01 .con {
        padding-top: 20px
    }

    .festival_wrap.st01 .con:before {
        left: 28%;
        width: 72%;
		top:121px;
    }

    .festival_wrap.st01 .con .left {
        width: 400px
    }

    .festival_wrap.st01 .con .right {
        width: 66%;
        margin-top: 10px
    }

    .festival_wrap.st02 .con:before {
        left: 33.5%
    }

    .festival_wrap.st02 .con .left {
        width: 460px
    }

    .festival_wrap.st02 .con .right {
        width: 62%
    }

    .festival_wrap .con a{top:37px}
    
}

@media(min-width: 1600px) {
    .festival_wrap .con .right {
        width:55%
    }

    .festival_wrap.st01 .con:before {
        left: 31%;
        top: 120px
    }

    .festival_wrap.st01 .con .left {
        width: 460px
    }

    .festival_wrap.st01 .con .right {
        width: 62%
    }
	
	.festival_wrap.st01 .con a{top:56px;}

    .festival_wrap.st02 .con:before {
        left: 34%;
        top: 98px;
    }
	
	.festival_wrap.st02 .con.line_type1:before {
        left: 34%;
        top: 135px;
    }

    .festival_wrap.st02 .con .left {
        width: 500px
    }

    .festival_wrap.st02 .con .right {
        width: 60%
    }
}

@media (max-width:1023px) {
	.festival_wrap .con a, .tour_wrap .con a{width:120px; display:inline-block;}
	.festival_wrap .con a img, .tour_wrap .con a img{max-width:78%;}
}

/*관련사이트*/
.relate_site li{ text-align:center; margin-bottom:20px;border:#dcdcdc solid 1px; padding:20px; border-radius:20px;}
.relate_site li img{ max-width:100%; }
.relate_site li span{ display:block; font-weight:500; padding:10px 0; color:#111; font-size:1.9rem} 
@media all and (min-width:768px){
	.relate_site{ display:flex; flex-wrap:wrap; justify-content:center; }
	.relate_site li{ width:31%; margin-right:20px;}
	.relate_site li:nth-child(3n){margin-right:0}
}

@media (min-width:1024px) {
	.relate_site li span{padding:20px 0 10px;}
}

@media (min-width:1440px) {
	.relate_site li{ width:32%;}
	.relate_site li span{font-size:2rem;}
}

/*의인 퀴즈*/
.quiz_box {
    background: #fdf8e9;
    padding: 25px;
    border-radius: 20px;
    text-align: center
}

.quiz_box>p {
    margin-bottom: 20px
}

.quiz_box p:last-child {
    margin-bottom: 0
}

.quiz_box em {
    color: #111;
    font-size: 1.8rem;
    display: block;
    font-weight: bold;
    background: #fde9ad;
    border-radius: 30px;
    padding: 3px 15px;
    margin-bottom: 10px
}

.quiz_box .answer_box{border-top:1px dashed #dcdcdc; padding-top:15px;}
.quiz_box .answer_box p{display:inline-block; font-weight:500;}
.quiz_box .answer_box p span{background:#595959; color:#595959;}

@media(min-width: 768px) {
    .quiz_box {
        text-align:left;
        position: relative;
        padding-left: 80px;
        overflow: hidden
    }

    .quiz_box:before {
        position: absolute;
        content: '';
        display: block;
        top: 35px;
        left: 0;
        width: 59px;
        height: 95px;
        background: url(/home/child/images/sub/q_icon.png)no-repeat
    }

    .quiz_box em {
        display: inline-block;
        margin-bottom: 5px;
        margin-right: 10px;
        float: left
    }

    .quiz_box .answer_box{margin-top:30px; padding-top:25px; text-align:right;}

}

@media(min-width: 1024px) {
    .quiz_box:before {
        top:30px
    }
}

@media(min-width: 1440px) {
    .quiz_box {
        padding:40px 40px 40px 100px
    }

    .quiz_box>p {
        margin-bottom: 30px
    }

    .quiz_box em {
        font-size: 20px;
        padding: 5px 15px;
        margin-right: 15px
    }

    .quiz_box p {
        margin-top: 1px
    }

    .quiz_box .answer_box{margin-top:35px;}
}


.name_wrap.st02 a.lo_st:after{right: -26px;top: 25px;}


@media (min-width:1024px) {
     .name_wrap.st02 a.lo_st:after{top: 2px;}
}


.load_wrap {
    margin-top: 80px;
    position: relative
}

.load_wrap:before {
    content: '';
    display: block;
    position: absolute;
    top: -34px;
    left: 0;
    width: 20px;
    height: 102%;
    background: #ececec;
    border-radius: 10px
}

.load_wrap .box {
    position: relative
}

.load_wrap .box:before {
    content: '';
    display: block;
    position: absolute;
    top: -15px;
    left: 10px;
    height: 100%;
    border-radius: 10px;
    border-left: 1px dashed #ccc;
    width: 2px
}

.load_wrap .con {
    position: relative;
    margin-left: 40px;
    position: relative;
    margin-bottom: 25px;
    border: 2px dashed #2260cd;
    border-radius: 20px;
    padding: 25px
}

.load_wrap .con:before {
    content: '';
    display: block;
    position: absolute;
    top: 39%;
    left: -56px;
    background: url(/home/child/images/sub/history_mark02.png)no-repeat;
    width: 24px;
    height: 24px;
    transform: translateY(50%);
    transform: translateX(50%)
}

.load_wrap .con .tit {
    color: #2260cd;
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 2rem;
}

@media(min-width: 1024px) {
    .load_wrap .box {
        position:relative;
        overflow: hidden
    }

    .load_wrap:before {
        left: 50%;
        width: 40px;
        border-radius: 50px;
        transform: translate(-17px,10px)
    }

    .load_wrap .box:before {
        left: 50%;
        margin-left: -1px;
        transform: translate(4px,10px)
    }

    .load_wrap .box .con {
        float: right;
        width: 42%;
        clear: both;
        margin-left: 0
    }

    .load_wrap .box .con:before {
        left: -19%;
        transform: translate(-11px,12px);
        margin-left: 0
    }

    .load_wrap .box .con:nth-child(even) {
        float: left;
        margin-left: 0;
        margin-right: 40px;
        text-align: right
    }

    .load_wrap .box .con:nth-child(even):before {
        top:37%;
		left: 119%;
        right: 0;
        transform: translate(-8px,12px);
        margin-left: 3px;
    }

    .load_wrap .box .con:after {
        content: '';
        display: block;
        width: 30px;
        height: 30px;
        border-bottom: 2px dashed #2260cd;
        position: absolute;
        background: #fff
    }

    .load_wrap .box .con:nth-child(even):after {
        top: 43%;
        right: -16px;
        transform: rotate(-45deg);
        border-right: 2px dashed #2260cd
    }

    .load_wrap .box .con:nth-child(odd):after {
        top: 43%;
        left: -16px;
        transform: rotate(45deg);
        border-left: 2px dashed #2260cd
    }
    
    .load_wrap .box .con span:before{content:'';display:block;position:absolute}
    .load_wrap .box .con span.back01:before{top: 88px;left: -85%;width:185px;height:100px; background:url(/home/child/images/sub/load_back01.png)no-repeat;}
    .load_wrap .box .con span.back02:before{top: 230px;left:0;width:98px;height:81px; background:url(/home/child/images/sub/load_back02.png)no-repeat;}
    .load_wrap .box .con span.back03:before{top: 201px;right: 0;width:194px;height:148px;background:url(/home/child/images/sub/load_back03.png)no-repeat;}
    .load_wrap .box .con span.back04:before{top: -228px;right: 0;width:191px;height:198px;background:url(/home/child/images/sub/load_back04.png)no-repeat;}
    .load_wrap .box .con span.back05:before{top: -119px;right: 0;width:98px;height:81px;background:url(/home/child/images/sub/load_back02.png)no-repeat;}
    .load_wrap .box .con span.back06:before{top: -204px;right: 0;width:309px;height:171px;background:url(/home/child/images/sub/load_back05.png)no-repeat;}
    .load_wrap .box .con span.back07:before{top: -199px;right: 0;width:220px;height:163px;background:url(/home/child/images/sub/load_back06.png)no-repeat;}
    .load_wrap .box .con span.back08:before{top: 86px;left: -98%;width:250px;height:185px;background:url(/home/child/images/sub/load_back07.png)no-repeat;}
}

@media(min-width: 1440px) {
	.load_wrap{margin-top:90px}
    .load_wrap .con {
        padding:40px
    }

    .load_wrap .con .tit {
        font-size: 2.2rem
    }

    .load_wrap .box .con span.back01:before{top:130px; left:-76%}
}


.content_page_box{margin-top:40px;}

@media (min-width:1024px) {
	.content_page_box{margin-top:50px;}
}

@media (min-width:1440px) {
	.content_page_box{margin-top:60px;}
}


.work_box{background:#f8f8f8; padding:25px; margin-top:20px;}
.work_box p{margin-bottom:10px;}
.work_box p:last-child{margin-bottom:0;}
.work_box span{font-weight:bold; color:#2260cd; margin-right:20px; border:2px dashed #2260cd; padding:4px 0; border-radius:20px; width:110px; display:inline-block; text-align:center;}

@media (max-width:1023px) {
	.work_box span{display:block; margin-bottom:10px;}
}

.answer_box a{background: #ffd864;font-size: 1.9rem;font-weight: bold;padding: 5px 10px;border-radius: 5px; margin-top:10px; display:inline-block}
.answer_box .answer_show{display:none; margin-top:15px; text-align:center;}

@media (min-width:768px) {
    .answer_box a{display:inline;}
    .answer_box .answer_show{text-align: right;}
}