:root{
  --mustard: rgb(192,131,50);
  --sunset: rgb(223,172,141);
  --ppink: rgb(217,133,95);
  --brick: rgb(141,76,46);
  --sage: rgb(162,161,131);
  --olive: rgb(104,98,48);
}

body,
html {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  background-color:rgb(255, 255, 255);
}

header {
  width: 100%;
  height: 30px;
  align-items: center;
  margin-top: 20px;
}

h2{
  font-family: 'Libre Caslon Text', serif;
  font-size: 15px;
  text-align: center; 
  font-weight: 700;
}
a {
  text-decoration: none;
  color: rgb(228,204,170);
}

a:visited { text-decoration: none; }

.slider {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 110vw;
}

.slider__container {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  position: relative;

}

.slider__list {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
}

.slider__buttons > * {
  margin: 0 4%;
  color: var(--olive);
  top: 190px;
  cursor: pointer;
  opacity: 0.5;

}

.slider__button:first-child {
  position: absolute;
  left: 0;
  z-index: 9;
}

.slider__button:last-child {
  position: absolute;
  right: 0;
  z-index: 9;
}

.slider__list li {
  padding: 0;
  margin: 0;
  width: 100%;
  object-fit:cover;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  opacity: 0;
  z-index: 0;
  transition: opacity 1s ease-out;
}

.slider__list li img {  
  padding: 0;
  margin: 0;
  width: 81%;
  height:108%;
}

.slider__list li.active {
  z-index: 1;
  opacity: 1;
}
hr {
  margin-top:50px;
  margin-left:10%;
  
  width:10%;
  color: var(--sage);
}
.gallary {
  width:80%;
  text-align:left;
  margin:0px auto;
  padding-bottom: 30px;
  padding-top: 5px;
  margin:0 auto;

}
.gallary .name {
  font-family: 'Libre Caslon Text', serif;
  font-size: 15px;
  font-weight: 400;
  padding: 0px;
  margin-bottom:5px;
}
.gallary .concept {
  font-family: 'Nanum Myeongjo', serif;
  font-size:12px;
  font-weight: 700;
}
.items {
  font-family: 'Barlow', sans-serif;
  font-weight:300;
  width: 90%;
  color:var(--sage);
  font-size:8px;
  text-align: right;
  margin-top:20px;
  padding-bottom:50px;   
}

.copyright{
  text-align: center;
  padding-top:70px;
  padding-bottom:10px;
}
h6{
  font-size: 10px;
  font-family: 'Roboto Mono', monospace;
  font-weight:400;
  color:rgb(124, 124, 124);
}

@media ( min-width: 375px ) {
  html {
    width: 375px;
    margin: 0 auto;
  }
}