/* BASIC css start */
.updown {display:none; } /* ¸ÞÀÎÀ§¾Æ·¡¹öÆ° ³ëÃâ¾ÈÇÔ */

.section{ }
#menu li { display:block; margin:10px;color: #000;background: rgba(255,255,255, 0); -webkit-border-radius: 100%; border-radius: 100%; text-align:center;}
#menu li.active{ background: rgba(0,0,0,0);color: #fff;}
#menu li a { width:15px; height:15px;  line-height:30px; color: #000;font-size:30px; font-family: 'Dancing Script','Poppins', sans-serif;  color:#000; font-weight: 700;}
#menu li.active a:hover{ color: #000;}
#menu li a:hover{	background: rgba(255,255,255, 0); font-size:18px; color:#fff }
#menu li a,
#menu li.active a { display:block;}
#menu li.active a {color: #fff; font-size:45px; border-top:0px solid #fff; border-bottom:0px solid #fff; transition: all 0.35s;
	-webkit-transition: all 0.35s;
	-ms-transition: all 0.35s;}
#menu{position:fixed;top:50%; transform: translateY(-50%);right:10px;height: auto;	z-index: 70;padding: 0;}


.video-background {
  background: #000;
  top: 0; right: 0; bottom: 0; left: 0;
  z-index: -99;
}
.video-foreground,
.video-background iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

@media (min-aspect-ratio: 16/9) {
  .video-foreground { height: 300%; top: -100%; }
}
@media (max-aspect-ratio: 16/9) {
  .video-foreground { width: 300%; left: -100%;  }
}

.con2 { border:0px solid #000;  width:100%;height:100% }
.con2 .main_text { position:absolute;top:50%;right:10%; transform: translateY(-50%); width:40%; border:0px solid #000; opacity:0; z-index:999; -webkit-transition:all 2s ease,-webkit-transform 1s ease-out;-moz-transition:all 2s ease,-moz-transform 1s ease-out;-ms-transition:all 2s ease,-ms-transform 1s ease-out; }
.con2 .main_text .mainTexBut { cursor:pointer; padding:10px 20px; margin-top:30px; float:center; transition:all 0.2s ease-out;width:100px;border:1px solid #fff;}
.con2 .main_text .mainTexBut a {color:#fff;}
.con2 .main_text .mainTexBut:hover {color:#fff;background:#000;border-color:#000;}

.main_text_store { width:90%;  line-height: 1.8; margin-left:20px;}

.main_text_button .mainTexBut { cursor:pointer; padding:10px 20px; margin:20px auto 0;transition:all 0.2s ease-out;width:90px;border:1px solid #fff;}
.main_text_button .mainTexBut a {color:#fff; }
.main_text_button .mainTexBut:hover {color:#fff;background:#000;border-color:#000;}
.main_text_button { cursor:pointer;position:absolute;top:60%;left:50%;transform:translateX(-50%) translateY(-50%);opacity:0;z-index:999;-webkit-transition:all 2s ease,-webkit-transform 1s ease-out;-moz-transition:all 2s ease,-moz-transform 1s ease-out;-ms-transition:all 2s ease,-ms-transform 1s ease-out;}

.main_item  { width:100%; margin:0 auto;  padding:0%; }
.main_item .itemstory { margin-top:100px; transition:transform 2.0s ease,opacity 2.0s ease;transform:translate(0px,120px);opacity:0.0; }
.main_item .itemstory ul { margin:0; font-size:0; vertical-align:top;  }
.main_item .itemstory li { display:inline-block;width:50%; text-align:center; vertical-align:top; padding:10px 0;}
.main_item .itemstory li:hover { }
.main_item .itemstory li a {display:block; width:100%;   }
.main_item .itemstory li img { width:95%; text-align:center; overflow: hidden; }
.main_item .itemstory li strong { display: block; margin: 10px auto 0px;; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 400; color: #333; font-size: 12px; letter-spacing: ;}
.main_item .itemstory li p { box-sizing:border-box; padding:0 0 10px;  color: #666;  font-size: 11px;  line-height: 1.5; word-break: keep-all;}



/* ¾×¼ÇÀ§Ä¡¼³Á¤ */
.section.active .main_text_button { position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);opacity:1;z-index:999;-webkit-transition:all 2s ease,-webkit-transform 1s ease-out;-moz-transition:all 2s ease,-moz-transform 1s ease-out;-ms-transition:all 2s ease,-ms-transform 1s ease-out;}
.section.active .con2 .main_text { position:absolute;top:50%;right:20%;transform:translateY(-50%);opacity:1;z-index:999; ;-webkit-transition:all 2s ease,-webkit-transform 1s ease-out;-moz-transition:all 2s ease,-moz-transform 1s ease-out;-ms-transition:all 2s ease,-ms-transform 1s ease-out;  }
.section.active .main_text_button { position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);opacity:1;z-index:999;-webkit-transition:all 2s ease,-webkit-transform 1s ease-out;-moz-transition:all 2s ease,-moz-transform 1s ease-out;-ms-transition:all 2s ease,-ms-transform 1s ease-out;}
.section.active .itemstory { transform:translate(0,0);opacity:1.0;}
.section.active .itemstory { transform:translate(0,0);opacity:1.0;}

/* ¾×¼ÇÀ§Ä¡¼³Á¤ */

.fp-viewing-anchor4 .itemstory { transform:translate(0,0);opacity:1.0;}


/* BASIC css end */

