@charset "utf-8";

/*
con-right(미사시간) 삭제 될 경우 사용
.wrap-con .con-left:has(#conRenew) {width:100%}
*/

#conRenew {
  width: 100%;
  padding: 0 10px 10px 0;
  /* padding: 0 0 10px 0; con-right(미사시간) 삭제 될 경우 사용 */
}

#conRenew section {
  width: 100%;
}

#conRenew section a {
  text-decoration: none;
}

#conRenew section.cR__sec01 {
  width: 100%;
  aspect-ratio: 1000 / 443;
  align-content: center;
  background: url(../img/main_new/cR__sec01_bg.png) no-repeat center / cover;
}

#conRenew section.cR__sec01 a {
  display: block;
  width: 100%;
  padding-left: 50%;
}

#conRenew section.cR__sec01 a img {
  width: 100%;
  padding-right: 30px;
}

#conRenew section.cR__sec02 {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;
}

#conRenew section.cR__sec02>div {
  width: calc(50% - 5px);
  height: auto;
  aspect-ratio: 100 / 62;
}

#conRenew section.cR__sec02>div {
  background: #000 no-repeat center / cover;
}

#conRenew section.cR__sec02>div a {
  display: block;
  width: 100%;
  height: 100%;
}

#conRenew section.cR__sec02>div a {
  padding: 10px;
  align-content: end;
  color: #fff;
  font-weight: bold;
  font-size: 36px;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  transition: all 0.5s;
}

#conRenew section.cR__sec02>div a:hover {
  background-color: rgba(0, 0, 0, 0.5);
}

#conRenew section.cR__sec02>div.cR__info01 {
  background-image: url(../img/main_new/cR__info01_new.jpg);
}

#conRenew section.cR__sec02>div.cR__info02 {
  background-image: url(../img/main_new/cR__info02.png);
}

#conRenew section.cR__sec02>div.cR__info03 {
  background-image: url(../img/main_new/cR__info03.png);
}

#conRenew section.cR__sec04 {
  margin-top: 10px;
}

#conRenew section.cR__sec04>div.cR__notice {
  display: flex;
  gap: 16px;
  min-height: 120px;
}

#conRenew section.cR__sec04>div.cR__notice h4 {
  width: 200px;
  height: auto;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

#conRenew section.cR__sec04>div.cR__notice h4 a {
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 20px;
  color: #fff;
  align-content: center;
  background-color: #760530;
}

#conRenew section.cR__sec04>div.cR__notice h4 a:hover {
  background-color: #222;
  transition: all 0.5s;
}

#conRenew section.cR__sec04>div.cR__notice ul {
  width: calc(100% - 210px);
  border-top: 1px solid #eaeaea;
}

#conRenew section.cR__sec04>div.cR__notice ul li {
  /* height: calc(100% / 5); */
  height: 40px;
  border-bottom: 1px solid #eaeaea;
}

#conRenew section.cR__sec04>div.cR__notice ul li a {
  display: block;
  height: 100%;
  align-content: center;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#conRenew section.cR__sec02>div.cR__news {
  background-image: url(../img/main_new/cR__news.jpg);
}

#conRenew section.cR__sec02>div.cR__road {
  background-image: url(../img/main_new/cR__road.jpg);
}

#conRenew section.cR__sec02>div.cR__board {
  background-image: url(../img/main_new/cR__board.png);
}

#conRenew section.cR__sec03 {
  width: 100%;
  height: auto;
  padding: 20px;
  align-content: center;
  aspect-ratio: 100 / 15.6;
  margin-top: 10px;
  text-align: right;
  background: #000 url(../img/main_new/cR__sec03.png) no-repeat center / cover;
}

#conRenew section.cR__sec03>div {
  display: inline-block;
  text-align: left;
}

#conRenew section.cR__sec03>div h4 {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
}

#conRenew section.cR__sec03>div p {
  display: flex;
  gap: 1ex;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.3;
  color: #fff;
}

#conRenew section.cR__sec03>div p.red {
  color: #ff7e7e;
  font-weight: 600;
}

@media screen and (max-width:800px) {
  .main_content{display:block;}
  
  #conRenew {
    padding: 10px;
  }

  /* #conRenew section.cR__sec02>div {
    width: 100%;
  } */

  #conRenew section.cR__sec02>div a {
    font-size: 18px;
  }

  #conRenew section.cR__sec04>div.cR__notice h4 {
    width: 100px;
  }

  #conRenew section.cR__sec04>div.cR__notice ul {
    width: calc(100% - 110px);
  }

  #conRenew section.cR__sec04>div.cR__notice h4 a {
    font-size: 16px;
  }
  #conRenew section.cR__sec04>div.cR__notice ul li {  
    height: 30px;
  }
  #conRenew section.cR__sec04>div.cR__notice ul li a {
    font-size: 12px;
  }
}