body {
  font-family: "MiceGothic","Noto Sans KR", "Mice", "Malgun Gothic", "맑은 고딕",
    "AppleSDGothicNeo-Regular", "DroidSansFallback", "Apple Gothic",
    "HelveticaNeue-Regular", sans-serif, Arial;
  font-size: 14px;
  font-weight: 300;
  letter-spacing: 0px;
}
h2 {
  font-family: Mice;
  font-size: 35px;
}

#main {
  background: url("../images/inc/main-bg.png") repeat;
  /*background-size: 25px;*/
  position: relative;
  background: #47759e;
  background: -moz-radial-gradient(
    center,
    ellipse cover,
    #0964eb 0%,
    #88807e 100%
  );
  background: -webkit-gradient(
    radial,
    center center,
    0px,
    center center,
    100%,
    color-stop(0%, #0964eb),
    color-stop(100%, #88807e)
  );
  background: -webkit-radial-gradient(
    center,
    ellipse cover,
    #0964eb 0%,
    #88807e 100%
  );
  background: -o-radial-gradient(
    center,
    ellipse cover,
    #0964eb 0%,
    #88807e 100%
  );
  background: -ms-radial-gradient(
    center,
    ellipse cover,
    #0964eb 0%,
    #88807e 100%
  );
  background: radial-gradient(ellipse at center, #0964eb 0%, #88807e 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#53D797', endColorstr='#081F33',GradientType=1 );
  background-repeat: no-repeat;
  background-attachment: fixed;
}

#main #container {
  position: relative;
  z-index: 1;
  flex: auto;
  margin: 0 auto;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  /* 이선화 코드수정 1114 */
  justify-content: center;
  align-items: center;
  height: 100%;
  overflow: hidden;
  /* 1118 이선화 주석추가 */
  /* background: url("../images/inc/main-bg-img.png") center/cover; */
  /*이세연 추가 1104 /*박소희 삭제 20201111*/
}
.micecity_bg {
  z-index: -1;
}
.main-img {
  width: 1400px;
  height: 750px;
  /* 이선화 코드수정 1112 */
  position: relative;
}
.background-img {
  position: relative;
}
/* BUSAN */
.busan {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 250px;
  left: 50px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.busan img {
  position: relative;
}
.busan-1 strong {
  font-size: 22px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.busan-1 {
  position: absolute;
  top: 11px;
  left: 18px;
  width: 100%;
  height: 100%;
  background: #8e54c9;
}
.busan:hover .busan-1 {
  background-color: #1d3283;
}
.busan:hover {
  transform: translateX(0) translateY(-12%);
}
.busan:hover strong {
  color: white;
}
/* 전남 */
.jeonnam {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 380px;
  left: 210px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.jeonnam img {
  position: relative;
}
.jeonnam-1 strong {
  font-size: 18px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.jeonnam-1 {
  position: absolute;
  top: 11px;
  left: 18px;
  width: 100%;
  height: 100%;
  background: #8e54c9;
}
.jeonnam:hover .jeonnam-1 {
  background-color: #1d3283;
}
.jeonnam:hover {
  transform: translateX(0) translateY(-12%);
}
.jeonnam:hover strong {
  color: white;
}
/* 광주 */
.daegu {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 220px;
  left: 190px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.daegu img {
  position: relative;
}
.daegu-1 strong {
  font-size: 22px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.daegu-1 {
  position: absolute;
  top: 11px;
  left: 18px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.daegu:hover .daegu-1 {
  background-color: #1d3283;
}
.daegu:hover {
  transform: translateX(0) translateY(-12%);
}
.daegu:hover strong {
  color: white;
}
/* 서울 */
.seoul {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 250px;
  left: 530px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.seoul img {
  position: relative;
}
.seoul-1 strong {
  font-size: 22px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.seoul-1 {
  position: absolute;
  top: 11px;
  left: 18px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.seoul:hover .seoul-1 {
  background-color: #1d3283;
}
.seoul:hover {
  transform: translateX(0) translateY(-12%);
}
.seoul:hover strong {
  color: white;
}
/* 대전 */
.daejeon {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 100px;
  left: 1180px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.daejeon img {
  position: relative;
}
.daejeon-1 strong {
  font-size: 20px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.daejeon-1 {
  position: absolute;
  top: 11px;
  left: 18px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.daejeon:hover .daejeon-1 {
  background-color: #1d3283;
}
.daejeon:hover {
  transform: translateX(0) translateY(-12%);
}
.daejeon:hover strong {
  color: white;
}
/* 강원 */
.gangwon {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 178px;
  left: 1210px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.gangwon img {
  position: relative;
}
.gangwon-1 strong {
  font-size: 18px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.gangwon-1 {
  position: absolute;
  top: 11px;
  left: 18px;
  width: 100%;
  height: 100%;
  background: #8e54c9;
}
.gangwon:hover .gangwon-1 {
  background-color: #1d3283;
}
.gangwon:hover {
  transform: translateX(0) translateY(-12%);
}
.gangwon:hover strong {
  color: white;
}
/* 경주 */
.gyeongju {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 430px;
  left: 955px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.gyeongju img {
  position: relative;
}
.gyeongju-1 strong {
  font-size: 18px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.gyeongju-1 {
  position: absolute;
  top: 11px;
  left: 18px;
  width: 100%;
  height: 100%;
  background: #8e54c9;
}
.gyeongju:hover .gyeongju-1 {
  background-color: #1d3283;
}
.gyeongju:hover {
  transform: translateX(0) translateY(-12%);
}
.gyeongju:hover strong {
  color: white;
}
/* 울산 */
.ulsan {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 350px;
  left: 125px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.ulsan img {
  position: relative;
}
.ulsan-1 strong {
  font-size: 25px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.ulsan-1 {
  position: absolute;
  top: 11px;
  left: 15px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.ulsan:hover .ulsan-1 {
  background-color: #1d3283;
}
.ulsan:hover {
  transform: translateX(0) translateY(-12%);
}
.ulsan:hover strong {
  color: white;
}
/* 청북 */
.chungbuk {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 450px;
  left: 325px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.chungbuk img {
  position: relative;
}
.chungbuk-1 strong {
  font-size: 17px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.chungbuk-1 {
  position: absolute;
  top: 11px;
  left: 13px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.chungbuk:hover .chungbuk-1 {
  background-color: #1d3283;
}
.chungbuk:hover {
  transform: translateX(0) translateY(-12%);
}
.chungbuk:hover strong {
  color: white;
}
/* 광주 */
.gwangju {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 230px;
  left: 425px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.gwangju img {
  position: relative;
}
.gwangju-1 strong {
  font-size: 19px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.gwangju-1 {
  position: absolute;
  top: 11px;
  left: 10px;
  width: 100%;
  height: 100%;
  background: #8e54c9;
}
.gwangju:hover .gwangju-1 {
  background-color: #1d3283;
}
.gwangju:hover {
  transform: translateX(0) translateY(-12%);
}
.gwangju:hover strong {
  color: white;
}
/* 경기 */
.gyeonggi {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 260px;
  left: 625px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.gyeonggi img {
  position: relative;
}
.gyeonggi-1 strong {
  font-size: 18px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.gyeonggi-1 {
  position: absolute;
  top: 11px;
  left: 15px;
  width: 100%;
  height: 100%;
  background: #8e54c9;
}
.gyeonggi:hover .gyeonggi-1 {
  background-color: #1d3283;
}
.gyeonggi:hover {
  transform: translateX(0) translateY(-12%);
}
.gyeonggi:hover strong {
  color: white;
}
/* 수원 */
.suwon {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 120px;
  left: 1038px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.suwon img {
  position: relative;
}
.suwon-1 strong {
  font-size: 22px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.suwon-1 {
  position: absolute;
  top: 11px;
  left: 15px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.suwon:hover .suwon-1 {
  background-color: #1d3283;
}
.suwon:hover {
  transform: translateX(0) translateY(-12%);
}
.suwon:hover strong {
  color: white;
}
/* 인천 */
.incheon {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 355px;
  left: 805px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.incheon img {
  position: relative;
}
.incheon-1 strong {
  font-size: 20px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.incheon-1 {
  position: absolute;
  top: 11px;
  left: 15px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.incheon:hover .incheon-1 {
  background-color: #1d3283;
}
.incheon:hover {
  transform: translateX(0) translateY(-12%);
}
.incheon:hover strong {
  color: white;
}
/* 여수 */
.yeosu {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 150px;
  left: 1100px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.yeosu img {
  position: relative;
}
.yeosu-1 strong {
  font-size: 23px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.yeosu-1 {
  position: absolute;
  top: 11px;
  left: 15px;
  width: 100%;
  height: 100%;
  background: #8e54c9;
}
.yeosu:hover .yeosu-1 {
  background-color: #1d3283;
}
.yeosu:hover {
  transform: translateX(0) translateY(-12%);
}
.yeosu:hover strong {
  color: white;
}
/* 고양 */
.goyang {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 230px;
  left: 1280px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.goyang img {
  position: relative;
}
.goyang-1 strong {
  font-size: 20px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.goyang-1 {
  position: absolute;
  top: 11px;
  left: 15px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.goyang:hover .goyang-1 {
  background-color: #1d3283;
}
.goyang:hover {
  transform: translateX(0) translateY(-12%);
}
.goyang:hover strong {
  color: white;
}
/* 전북 */
.jeonbuk {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 455px;
  left: 1070px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.jeonbuk img {
  position: relative;
}
.jeonbuk-1 strong {
  font-size: 19px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.jeonbuk-1 {
  position: absolute;
  top: 11px;
  left: 15px;
  width: 100%;
  height: 100%;
  background: #6cafd0;
}
.jeonbuk:hover .jeonbuk-1 {
  background-color: #1d3283;
}
.jeonbuk:hover {
  transform: translateX(0) translateY(-12%);
}
.jeonbuk:hover strong {
  color: white;
}

/* 경남 */
.gyeongnam {
  text-align: center;
  width: 30px;
  height: 88px;
  cursor: pointer;
  position: absolute;
  top: 385px;
  left: 1210px;
  transform: translate(0 0);
  transition: transform 0.5s;
}
.gyeongnam img {
  position: relative;
}
.gyeongnam-1 strong {
  font-size: 15px;
  transform: rotate(90deg);
  margin: 0 5px;
  color: #000;
}
.gyeongnam-1 {
  position: absolute;
  top: 11px;
  left: 15px;
  width: 100%;
  height: 100%;
  background: #8e54c9;
}
.gyeongnam:hover .gyeongnam-1 {
  background-color: #1d3283;
}
.gyeongnam:hover {
  transform: translateX(0) translateY(-12%);
}
.gyeongnam:hover strong {
  color: white;
}
.main-img a {
  position: absolute;
}
.main-img a.link-sponsor {
  width: 17%;
  height: 32%;
  top: 26%;
  right: calc(50% - 551px);
}

#main .pop {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 9;
  background: #fff;
  font-size: 28px;
  font-weight: bold;
  max-width: 675px;
  width: 80%;
}
#main .pop .pop-top {
  position: relative;
  height: 85px;
  line-height: 85px;
  background: linear-gradient(to right, #088fc1, #3366b5);
  color: #fff;
  font-size: 28px;
}
#main .pop .pop-top .closeBtn {
  position: absolute;
  top: 30px;
  right: 35px;
}
#main .pop .pop-top .closeBtn a {
  display: block;
  width: 25px;
  height: 25px;
}
#main .pop .pop-top a span {
  position: absolute;
  top: 12px;
  display: block;
  width: 25px;
  height: 1px;
  background: #fff;
}
#main .pop .pop-top a span:first-child {
  transform: rotate(45deg);
}
#main .pop .pop-top a span:last-child {
  transform: rotate(-45deg);
}
#main .pop .pop-top + div {
  line-height: 1.3;
  padding: 80px 0;
}
#main .pop > .closeBtn a {
  display: block;
  color: #4054c0;
  font-size: 21px;
  text-align: center;
  width: 135px;
  height: 40px;
  line-height: 38px;
  border: 1px solid #4054c0;
  border-radius: 50px;
  font-weight: bold;
  margin: 0 auto 50px;
}

.m-main {
  display: none;
  width: 97.5%;
  margin: 0 auto;
}
.m-main .box {
  display: flex;
  width: 100%;
  color: #fff;
}
.m-main .box > div {
  position: relative;
  flex: 1;
  width: 50%;
  height: 0;
  padding-bottom: 46.7%;
  margin: 10px;
  border-radius: 4px;
  background-size: 100%;
}
.m-main .box > div a {
  display: block;
  height: 100%;
  padding-bottom: 100%;
}
.m-main .box .text-box span {
  display: block;
}
.m-main .box > div .text {
  position: absolute;
  top: 35px;
  left: 35px;
  font-weight: bold;
  font-size: 30px;
}
.m-main .box > div.text-box {
  line-height: 1;
}
.m-main .box > div.text-box > span {
  font-size: 30px;
  font-weight: 600;
  margin-top: 35px;
}
.m-main .box > div.text-box strong {
  font-weight: 800;
  font-size: 60px;
}
.m-main .box > div.text-box strong + span {
  font-size: 30px;
  margin-top: 0;
  font-weight: 300;
}
.m-main .box > div.text-box p {
  margin-top: 25px;
  font-size: 25px;
  line-height: 1.3;
}
.m-main .m-main-box01 {
  background: #314170 url("../images/inc/m-main-img01.jpg") no-repeat right
    bottom;
}
.m-main .m-main-box02 {
  background: #3399cc url("../images/inc/m-main-img02.jpg") no-repeat right
    bottom;
}
.m-main .m-main-box03 {
  background: #009999 url("../images/inc/m-main-img03.jpg") no-repeat right
    bottom;
}
.m-main .m-main-box04 {
  background: #333366 url("../images/inc/m-main-img04.jpg") no-repeat right
    bottom;
}
.m-main .m-main-box05 {
  background: #663399 url("../images/inc/m-main-img05.jpg") no-repeat right
    bottom;
}
.m-main .m-main-box06 {
  background: #6da1db url("../images/inc/m-main-img06.jpg") no-repeat right
    bottom;
}
.m-main .m-main-box07 {
  background: #1d3c95 url("../images/inc/m-main-img07.jpg") no-repeat right
    bottom;
}
.m-main .m-main-box08 {
  background: #517cb8 url("../images/inc/m-main-img08.jpg") no-repeat right
    bottom;
}
.m-main .m-main-box09 {
  background: #336699 url("../images/inc/m-main-img09.jpg") no-repeat right
    bottom;
}

.main-slider {
  display: none;
  width: 94%;
  margin: 10px auto;
  border-radius: 4px;
  overflow: hidden;
}
.main-slider .swiper-slide img {
  width: 100%;
}
.main-slider .swiper-slide .text {
  position: absolute;
  top: 20px;
  left: 20px;
  color: #fff;
}
.main-slider .swiper-slide .text strong {
  font-size: 60px;
}
.main-slider .swiper-slide .text p {
  font-size: 26px;
}
/*11-19 오전 추가*/
.mob-city-zone{display:none;}
/*11-19 오전 추가 끝*/
@media (max-width: 1280px) {
  .main-img a.link-sponsor {
    width: 24%;
    left: calc(100% - 371px);
  }
}
@media (max-width: 1024px) {
  /*11-19 오전 추가*/
  #main #container{
    overflow: revert;
  }
  .main-img{display:none;}
  .mob-city-zone{display:block;}
  #main #container{
    display:block;
  }
  #main{
    background: #141d39 !important;
  }
  .mob-top-img{
    width: 100%;
    height: auto;
    overflow: hidden;
  }
  .mob-top-img img{
    max-width:100%;
    height:auto;
    overflow:hidden;
    margin:auto;
  }
  .micecityzone{
  }
  .micecityzone ul{
    width:40%;
    padding: 1%;
    background:#fff;
  }
  .micecityzone ul li{
    width:96%;
    margin:2%;
    padding: 3%;
    font-size: 18px;
    border:1px solid #d7d7d7;
  }
  .micecityzone ul li a{
    display:block;
  }
  /*11-19 오전 추가 끝*/
}
@media (max-width: 768px) {
  .m-main .box > div.text-box > span {
    font-size: 20px;
  }
  .m-main .box > div.text-box strong {
    font-size: 40px;
  }
  .m-main .box > div.text-box strong + span {
    font-size: 32px;
  }
  .m-main .box > div.text-box p {
    font-size: 20px;
  }
  .m-main .box > div .text {
    top: 20px;
    left: 20px;
    font-size: 25px;
    line-height: 1.3;
  }
  .main-slider .swiper-slide .text strong {
    font-size: 30px;
  }
  .main-slider .swiper-slide .text p {
    font-size: 16px;
  }
}
@media (max-width: 640px) {
  .m-main .box > div.text-box > span {
    margin-top: 20px;
    font-size: 22px;
  }
  .m-main .box > div.text-box strong {
    font-size: 28px;
  }
  .m-main .box > div.text-box strong + span {
    font-size: 32px;
  }
  .m-main .box > div.text-box p {
    font-size: 14px;
  }
  .m-main .box > div .text {
    font-size: 20px;
  }
}
@media (max-width: 480px) {
  .main-slider .swiper-slide .text strong {
    font-size: 22px;
  }
  .main-slider .swiper-slide .text p {
    font-size: 13px;
  }
}
@media (max-width: 380px) {
  .m-main .box > div.text-box > span {
    margin-top: 20px;
    font-size: 18px;
  }
  .m-main .box > div.text-box strong {
    font-size: 24px;
  }
  .m-main .box > div.text-box strong + span {
    font-size: 22px;
  }
  .m-main .box > div.text-box p {
    font-size: 12px;
  }
  .m-main .box > div .text {
    top: 15px;
    left: 15px;
    font-size: 16px;
  }
  .main-slider .swiper-slide .text {
    top: 10px;
  }
}
