/*
  Loading
*/
.loading {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
}

.loading-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.loading-layer-1 {
  -webkit-transform: perspective(1000) translateZ(0px);
  transform: perspective(1000) translateZ(0px);
  -webkit-animation: load_layer01 5s linear 0s 1 normal;
  animation: load_layer01 5s linear 0s 1 normal;
  background: url("../img/loading/bg_mist_1.png") 0 0 no-repeat;
}

.loading-layer-2 {
  -webkit-transform: perspective(1000) translateZ(0px);
  transform: perspective(1000) translateZ(0px);
  -webkit-animation: load_layer02 5s linear 0s 1 normal;
  animation: load_layer02 5s linear 0s 1 normal;
  background: url("../img/loading/bg_mist_2.png") 0 0 no-repeat;
}

.loading-txt-1 {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0;
}

.loading-txt-2 {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-animation: load_txt02 5s linear 0s 1 normal;
  animation: load_txt02 5s linear 0s 1 normal;
  opacity: 0;
}

/*#root {
  background: none;
}

#root:before {
  background: none;
}*/

.contents {
  position: relative;
  background: black url("/assets/img/bg_ornament_repeat_1.png") 50% 0 repeat-y;
}

.contents:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  min-width: 1048px;
  height: 100%;
  content: '';
  background: url("/assets/img/bg_ornament_repeat_2.png") 50% 0 repeat-y;
}

/*
  Hero
*/
.hero {
  position: relative;
  background: #000;
}

.hero-kv img {
  width: 100%;
  height: auto;
}

.hero-logo {
  position: absolute;
  top: 2.6%;
  left: 1.4%;
  width: 14.75%;
}

.hero-logo img {
  width: 100%;
  height: auto;
}

.hero-share {
  position: absolute;
  top: 27.25%;
  left: 3.916%;
  width: 9.75%;
}

.hero-share-bg img {
  width: 100%;
  height: auto;
}

.hero-share-items {
  position: absolute;
  top: 27.5%;
  left: 0;
  width: 100%;
}

.hero-share-item {
  position: relative;
  float: left;
}

.hero-share-item a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.hero-share-item-title {
  width: 32%;
  margin-left: 10.2564102564%;
}

.hero-share-item-title img {
  width: 100%;
  height: auto;
}

.hero-share-item-fb {
  width: 7%;
  margin-left: 8.54700854701%;
}

.hero-share-item-fb img {
  width: 100%;
  height: auto;
}

.hero-share-item-tw {
  width: 12%;
  margin-left: 20.5128205128%;
}

.hero-share-item-tw img {
  width: 100%;
  height: auto;
}

.hero-banner {
  position: absolute;
  top: 64.2%;
  left: 2.16666666667%;
  width: 16.6666666667%;
}

.hero-banner-item {
  position: relative;
  background: #000;
}

.hero-banner-item a {
  position: relative;
  display: block;
}

.hero-banner-item a:after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  content: '';
  background: url("/assets/img/banner_ornament.png") 0 0 no-repeat;
  background-size: cover;
}

.hero-banner-item img {
  width: 100%;
  height: auto;
}

.hero-arrow {
  position: absolute;
  top: 74.5%;
  left: 47.5%;
  width: 5%;
  -webkit-animation: hero_arrow_blink 4s linear 0s infinite normal;
  animation: hero_arrow_blink 4s linear 0s infinite normal;
}

.hero-arrow img {
  width: 100%;
  height: auto;
}

/*
  -
  multi-contents
  -
*/
.multi-contents {
  width: 984px;
  margin: 0 auto;
  padding-top: 65px;
}

/*
  -
  twitter
  -
*/
.twitter {
  float: left;
  width: 443px;
}

.twitter-widget {
  margin-top: 26px;
}

/*
  -
  pickup
  -
*/
.pickup {
  float: right;
  width: 443px;
}

.pickup-items {
  margin-top: 36px;
}

.pickup-item {
  position: relative;
  width: 250px;
  height: 160px;
  margin-top: 30px;
}

.pickup-item a {
  position: relative;
  display: block;
}

.pickup-item a:after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  content: '';
  background: url("/assets/img/banner_ornament.png") 0 0 no-repeat;
  background-size: cover;
}

.pickup-item img {
  width: 100%;
  height: auto;
}

.pickup-item:nth-child(even) {
  margin-left: 192px;
}

.pickup-item:first-child {
  margin-top: 0;
}

/*
  -
  news
  -
*/
.news {
  position: relative;
  width: 993px;
  margin: 124px auto 0;
}

.news:after {
  position: relative;
  display: block;
  width: 15px;
  height: 36px;
  margin: 8px auto 0;
  content: '';
  background: url("/assets/img/common/line_ornament.png") 0 0 no-repeat;
}

.news-items {
  position: relative;
  overflow: hidden;
  padding-top: 27px;
  padding-bottom: 825px;
}

.news-items-wrap {
  position: relative;
}

.news-items-wrap:before {
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 1px;
  height: 100%;
  margin-left: -.5px;
  content: '';
  background: #746848;
}

.news-items-wrap:after {
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 18px;
  height: 100%;
  margin-left: -9px;
  content: '';
  background: url("/assets/img/common/line_ornament_repeat.png") 0 0 repeat;
}

.news-item {
  position: absolute;
  top: 0;
  display: none;
  width: 447px;
}

.news-item:nth-child(odd) {
  left: 0;
}

.news-item:nth-child(odd) .news-item-arrow {
  position: absolute;
  top: 50%;
  right: -48px;
  width: 27px;
  height: 5px;
  margin-top: -2.5px;
  content: '';
  background: url("/assets/img/common/news_arrow.png") 0 0 no-repeat;
}

.news-item:nth-child(even) {
  left: 547px;
}

.news-item:nth-child(even) .news-item-arrow {
  position: absolute;
  top: 50%;
  left: -48px;
  width: 27px;
  height: 5px;
  margin-top: -2.5px;
  content: '';
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  background: url("/assets/img/common/news_arrow.png") 0 0 no-repeat;
}

.news-item-inner {
  position: relative;
  top: 0;
  left: 0;
  width: 447px;
  height: 170px;
}

.news-thumb {
  float: left;
  overflow: hidden;
  width: 169px;
  height: 169px;
  border: 1px solid #7e6948;
}

.news-descs {
  float: right;
  width: 256px;
  height: 170px;
}

.news-date {
  font-size: 16px;
  margin-bottom: 14px;
  letter-spacing: .1em;
  color: #7e6948;
}

.news-title {
  font-size: 16px;
  color: #fff;
}

.news-body {
  font-size: 11px;
  margin-top: 17px;
  color: #b4b4b4;
}

.news-more {
  font-size: 16px;
  margin-top: 18px;
  margin-bottom: 14px;
  letter-spacing: .1em;
  color: #7e6948;
}

.news-more a {
  color: #7e6948;
}

.news-more img {
  vertical-align: middle;
}

.news-footer {
  position: relative;
  width: 47px;
  margin: 0 auto;
  padding-top: 41px;
  padding-bottom: 30px;
}

.news-footer-more-btn {
  position: relative;
  width: 47px;
  height: 118px;
  cursor: pointer;
  background: url("/assets/img/news_btn_more_off.png") 0 0 no-repeat;
}

.news-footer-more-btn:after {
  position: relative;
  display: block;
  width: 47px;
  height: 118px;
  content: '';
  -webkit-transition: all 0.75s cubic-bezier(0.77, 0, 0.175, 1);
  transition: all 0.75s cubic-bezier(0.77, 0, 0.175, 1);
  opacity: 0;
  background: url("/assets/img/news_btn_more_on.png") 0 0 no-repeat;
}

.news-footer-more-btn:hover:after {
  -webkit-transition: all 0.75s cubic-bezier(0.77, 0, 0.175, 1);
  transition: all 0.75s cubic-bezier(0.77, 0, 0.175, 1);
  opacity: 1;
  background: url("/assets/img/news_btn_more_on.png") 0 0 no-repeat;
}

.news-footer-more-btn--disable {
  cursor: default;
}

.news-footer-more-btn--disable:after {
  opacity: 0 !important;
}

.news-footer img {
  position: relative;
  cursor: pointer;
}

.news-footer:before {
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 1px;
  height: 41px;
  margin-left: -.5px;
  content: '';
  background: #746848;
}

.news-footer:after {
  position: absolute;
  top: 158px;
  left: 50%;
  display: block;
  width: 1px;
  height: 30px;
  margin-left: -.5px;
  content: '';
  background: #746848;
}

@-webkit-keyframes load_layer01 {
  0% {
    -webkit-transform: perspective(1500) translateZ(0px);
    transform: perspective(1500) translateZ(0px);
    opacity: 0;
  }

  50% {
    -webkit-transform: perspective(1500) translateZ(500px);
    transform: perspective(1500) translateZ(500px);
    opacity: .8;
  }

  100% {
    -webkit-transform: perspective(1500) translateZ(1000px);
    transform: perspective(1500) translateZ(1000px);
    opacity: 0;
  }
}
@keyframes load_layer01 {
  0% {
    -webkit-transform: perspective(1500) translateZ(0px);
    transform: perspective(1500) translateZ(0px);
    opacity: 0;
  }

  50% {
    -webkit-transform: perspective(1500) translateZ(500px);
    transform: perspective(1500) translateZ(500px);
    opacity: .8;
  }

  100% {
    -webkit-transform: perspective(1500) translateZ(1000px);
    transform: perspective(1500) translateZ(1000px);
    opacity: 0;
  }
}
@-webkit-keyframes load_layer02 {
  0% {
    -webkit-transform: perspective(1500) translateZ(0px);
    transform: perspective(1500) translateZ(0px);
    opacity: 0;
  }

  50% {
    -webkit-transform: perspective(1500) translateZ(500px);
    transform: perspective(1500) translateZ(500px);
    opacity: .8;
  }

  100% {
    -webkit-transform: perspective(1500) translateZ(1000px);
    transform: perspective(1500) translateZ(1000px);
    opacity: 0;
  }
}
@keyframes load_layer02 {
  0% {
    -webkit-transform: perspective(1500) translateZ(0px);
    transform: perspective(1500) translateZ(0px);
    opacity: 0;
  }

  50% {
    -webkit-transform: perspective(1500) translateZ(500px);
    transform: perspective(1500) translateZ(500px);
    opacity: .8;
  }

  100% {
    -webkit-transform: perspective(1500) translateZ(1000px);
    transform: perspective(1500) translateZ(1000px);
    opacity: 0;
  }
}
@-webkit-keyframes load_txt02 {
  0% {
    opacity: 0;
  }

  18% {
    opacity: 0;
  }

  40% {
    opacity: 1;
  }

  95% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}
@keyframes load_txt02 {
  0% {
    opacity: 0;
  }

  18% {
    opacity: 0;
  }

  40% {
    opacity: 1;
  }

  95% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}
@-webkit-keyframes hero_arrow_blink {
  0% {
    opacity: 1;
  }

  25% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  75% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}
@keyframes hero_arrow_blink {
  0% {
    opacity: 1;
  }

  25% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  75% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}


/*****modal_newyear*****/
.modal_newyear{
	position:fixed;
	z-index:9;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
}
.modal_newyear .image{
	position: absolute;
	left:50%;
	top:50%;
	z-index:100;
	margin: -300px 0 0 -480px;
}
.modal_newyear .bg{
	position:fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background:rgba(0,0,0,0.5)
}
.modal_newyear .close{
	position:absolute;
	left:50%;
	top:50%;
	margin: -340px 0 0 430px;
	cursor: pointer;
}