@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');

/* 초기화 */
html {overflow-y:scroll}
body {margin:0;padding:0;font-size:0.75em;font-family: 'Noto Sans KR', sans-serif;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-size:1em}
button {cursor:pointer}
textarea, select {font-size:1.2em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a:link, a:visited {color:#000;text-decoration:none}
a:hover, a:focus, a:active {color:#000;text-decoration:none}
body { margin: 0; }
ul,li,ol,dt,dd{padding:0;margin:0;list-style:none}
*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #333;
    font-family: 'Nanumsquare', sans-serif;
}
input[type=text],input[type=password], textarea {
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    outline: none;
}
.sound-only {display: none;}
.flex-hr {
  display: flex;
  justify-content: center;
  align-items: center;
}
.flex-vt {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.pc {
  display: block;
}
.mb {
  display: none;
}

.container {
  width: 800px;
  margin: 0 auto;
  background-position: top;
  background-repeat: no-repeat;
  background-size: contain;
}
#quickmenu {
  position: fixed;
  width: 80px;
  top: 50%;
  transform: translate(0, -50%);
  right: 0px;
  border: 1px solid #333;
  text-align: center;
  background-color: #fff;
  z-index: 999;
}
#quickmenu ul li {
  border-bottom: 1px solid #333;
  padding: 10px;
}
#quickmenu i {
  display: block;
  font-size: 3rem;
}
i::before {
  font-family: xeicon !important;
}
.sec1{width: inherit; height: auto;position: relative;}
.sec1 a{
  display: block;position: absolute; bottom: 65px;left: 90px;width: 250px; height: 75px;
}
.sec1 img, .sec-final img {width: inherit;height: inherit; object-fit: cover;}
.sec2{padding: 40px; background-color: #f2eadd;}
section h2, section h1, section h3 {font-size: 2rem; text-align:center;margin: 10px auto 20px;}
section h1 {font-size: 3rem;}
section h3 {font-size: 1rem;}
section pre { overflow: hidden; font-size: 1.4rem;}
/* form */
.form-sec{
  background:#efaa4d;
  padding: 50px;
  height: 40vw;
  gap:5%;
}
.form-sec h2 {
  font-size: 1.3rem;
  color: #000;
}
.form-sec form {
  width: 70%;
  height: auto;
  background-color: #fff;
  border-radius: 20px;
  padding: 20px;

}
.form-sec form label {
  width: 30%;
  display: inline-block;
}
.form-sec form li {
  margin-bottom: 10px;
}
.form-sec form input[type=text] {
  width: 70%;
  padding: 5px;
}
.form-sec form .btn input[type=submit] {
  width: 100%;
  padding: 10px;
  background-color: #774020;
  color: #fff;
  border: none;
  cursor: pointer;
}
.form-sec form .btn input[type=submit]:hover {
  background-color: #efaa4d;
  color: #000;
}


@media (max-width: 1000px) {
  .pc {
    display: none;
  }
  .mb {
    display: block;
  }
}

/* swiper */
.swiper {
  width: 500px;
  height: 600px;
}

.swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  font-size: 22px;
  font-weight: bold;
  color: #fff;
}
.swiper-slide img {
  width: inherit;
  height: inherit;
  object-fit: cover;
}
.swiper-slide:nth-child(1n) {
  background-color: rgb(206, 17, 17);
}

.swiper-slide:nth-child(2n) {
  background-color: rgb(0, 140, 255);
}

.swiper-slide:nth-child(3n) {
  background-color: rgb(10, 184, 111);
}