@charset "utf-8";

#wrap {
  background: #f6f5f1;
}
header {
  position: fixed;
  top: 0;
  background: #f6f5f1;
  z-index: 3;
  width: 100%;
  height: auto;
  border-bottom: 1px solid #999;
}
#menu {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 80px;
  padding: 24px 45px;
  transition: all 2s ease-in-out;
}
#menu ul {
  cursor: pointer;
  display: flex;
  align-items: center;
  width: 110px;
  justify-content: space-between;
}
.menu_trigger span {
  background: #444;
}
.menu_trigger .spanch {
  background-color: #fff;
}

#content {
  width: 90%;
  margin: 0 auto;
  height: auto;
  padding: 150px 0 100px;
}

#content #btnwrap {
  display: flex;
  width: 270px;
  justify-content: space-between;
  align-content: center;
  flex-wrap: wrap;
  margin: 0 auto;
  height: 150px;
}
#content #butn {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 44%;
  height: 100%;
}
#content #butn span,
#butn2 span {
  font-family: "Noto Serif KR", serif;
  font-weight: 500;
  color: #444;
  font-size: 14px;
}
#butn button {
  border-radius: 30px;
  overflow: hidden;
  border: none;
  width: 100%;
}
button:hover,
label:hover {
  cursor: pointer;
  opacity: 0.9;
}
#butn img {
  width: 100%;
  height: 100%;
}
#content #butn2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 43%;
  height: 100%;
}
#butn2 button {
  border-radius: 30px;
  overflow: hidden;
  border: none;
  width: 100%;
}
#butn2 img {
  width: 100%;
  height: 100%;
}

#content #innerwrap {
  height: calc(100% - 150px);
  width: 80%;
  display: flex;
  flex-wrap: wrap;
  margin: 100px auto;
}
#inner {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 0 200px 0;
  height: 25%;
}

.text {
  width: 68%;
  text-align: center;
  line-height: 25px;
  font-family: "IBM Plex Sans KR", sans-serif;
}
.text h3 {
  margin-bottom: 20px;
}
.text p {
  font-size: 15px;
  font-weight: 500;
}
.text p:nth-child(2) {
  margin-bottom: 10px;
}
.text p:last-of-type {
  margin-bottom: 50px;
}

#inner #slwrap {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner .slideimg {
  width: 370%;
  display: flex;
}
#slwrap .slideimg li {
  width: 15%;
  height: auto;
}
#inner .slideimg img {
  width: 90%;
  height: 100%;
}
#slwrap i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap i:hover {
  opacity: 0.9;
}

.prev {
  left: 0;
  padding: 0 9px 0 8px;
}
.next {
  right: 0;
  padding: 0 8px 0 9px;
}

#inner2 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 0 200px 0;
}
#inner2 #slwrap2 {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner2 .slideimg2 {
  width: 158%;
  display: flex;
  height: 100%;
}
#slwrap2 .slideimg2 li {
  width: 34%;
  height: auto;
}
#inner2 .slideimg2 img {
  width: 90%;
  height: 100%;
}
#slwrap2 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap2 i:hover {
  opacity: 0.9;
}

#inner3 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 0 200px 0;
}
#inner3 #slwrap3 {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner3 .slideimg3 {
  width: 158%;
  display: flex;
  height: 100%;
}
#slwrap3 .slideimg3 li {
  width: 34%;
  height: auto;
}
#inner3 .slideimg3 img {
  width: 90%;
  height: 100%;
}
#slwrap3 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap3 i:hover {
  opacity: 0.9;
}

#content #candle {
  width: 100%;
  display: flex;
  justify-content: center;
}

#candle #obj {
  width: 50%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-right: 50px;
}
.objtext {
  width: 86%;
  text-align: center;
  line-height: 25px;
  font-family: "IBM Plex Sans KR", sans-serif;
}
.objtext h2 {
  margin-bottom: 10px;
}
.objtext h3 {
  margin-bottom: 10px;
}
.objtext p {
  font-size: 15px;
  font-weight: 500;
}
.objtext p:last-child {
  margin-bottom: 30px;
}

#obj #candleSl {
  width: 90%;
  height: auto;
  position: relative;
  overflow: hidden;
}
#obj #candleSl .candleSlImg {
  width: 500%;
  height: 100%;
  display: flex;
}
#obj #candleSl .candleSlImg li {
  width: 100%;
  height: auto;
  text-align: center;
}
#obj #candleSl .candleSlImg img {
  width: 90%;
  height: auto;
  padding: 20px;
  border-radius: 70px;
}

#candleSl i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 14px;
  line-height: 35px;
  cursor: pointer;
  height: 35px;
  opacity: 0.7;
  color: #444;
  transform: translateY(-50%);
}
#candleSl i:hover {
  opacity: 0.9;
}
.objprev {
  left: 0;
  padding: 0 7px 0 3px;
}
.objnext {
  right: 0;
  padding: 0 3px 0 7px;
}

#candle #obj2 {
  width: 50%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

#obj2 #candleSl2 {
  width: 90%;
  height: auto;
  position: relative;
  overflow: hidden;
}
#obj2 #candleSl2 .candleSlImg2 {
  width: 700%;
  height: 100%;
  display: flex;
}
#obj2 #candleSl2 .candleSlImg2 li {
  width: 100%;
  height: auto;
  text-align: center;
}
#obj2 #candleSl2 .candleSlImg2 img {
  width: 90%;
  height: auto;
  padding: 20px;
  border-radius: 70px;
}

#candleSl2 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 14px;
  line-height: 35px;
  cursor: pointer;
  height: 35px;
  opacity: 0.7;
  color: #444;
  transform: translateY(-50%);
}
#candleSl2 i:hover {
  opacity: 0.9;
}

#content #innerwrap2 {
  height: calc(100% - 150px);
  margin: 100px auto;
  width: 80%;
  display: flex;
  flex-wrap: wrap;
  display: none;
}

#inner4 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 0 200px 0;
}
#inner4 #slwrap4 {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner4 .slideimg4 {
  width: 315%;
  display: flex;
  height: 100%;
}
#slwrap4 .slideimg4 li {
  width: 11%;
  height: auto;
}
#inner4 .slideimg4 img {
  width: 90%;
  height: 100%;
}
#slwrap4 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap4 i:hover {
  opacity: 0.9;
}

#inner5 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 0 200px 0;
}
#inner5 #slwrap5 {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner5 .slideimg5 {
  width: 211%;
  display: flex;
  height: 100%;
}
#slwrap5 .slideimg5 li {
  width: 25%;
  height: auto;
}
#inner5 .slideimg5 img {
  width: 90%;
  height: 100%;
}
#slwrap5 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap5 i:hover {
  opacity: 0.9;
}

#inner6 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 0 200px 0;
}
#inner6 #slwrap6 {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner6 .slideimg6 {
  width: 316%;
  display: flex;
  height: 100%;
}
#slwrap6 .slideimg6 li {
  width: 17%;
  height: auto;
}
#inner6 .slideimg6 img {
  width: 90%;
  height: 100%;
}
#slwrap6 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap6 i:hover {
  opacity: 0.9;
}

#inner7 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 0 200px 0;
}
#inner7 #slwrap7 {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner7 .slideimg7 {
  width: 211%;
  display: flex;
  height: 100%;
}
#slwrap7 .slideimg7 li {
  width: 25%;
  height: auto;
}
#inner7 .slideimg7 img {
  width: 90%;
  height: 100%;
}
#slwrap7 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap7 i:hover {
  opacity: 0.9;
}

#inner8 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 0 200px 0;
}
#inner8 #slwrap8 {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner8 .slideimg8 {
  width: 211%;
  display: flex;
  height: 100%;
}
#slwrap8 .slideimg8 li {
  width: 17%;
  height: auto;
}
#inner8 .slideimg8 img {
  width: 90%;
  height: 100%;
}
#slwrap8 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap8 i:hover {
  opacity: 0.9;
}

#inner9 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
#inner9 #slwrap9 {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
#inner9 .slideimg9 {
  width: 211%;
  display: flex;
  height: 100%;
}
#slwrap9 .slideimg9 li {
  width: 25%;
  height: auto;
}
#inner9 .slideimg9 img {
  width: 90%;
  height: 100%;
}
#slwrap9 i {
  position: absolute;
  top: 50%;
  display: block;
  font-size: 12px;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
  height: 25px;
  background: #333;
  opacity: 0.6;
  transform: translateY(-50%);
  border-radius: 30px;
  margin: 0 10px;
}
#slwrap9 spian:hover {
  opacity: 0.9;
}