@charset "UTF-8";

.dropmenu {
    *zoom: 1;
    list-style-type: none;
    width: 800px;
    height: 40px;
    margin: 0px 0px 0px 80px;
    padding: 0;
    box-sizing: border-box;
}

.dropmenu:before, .dropmenu:after {
    content: "";
    display: table;
}

.dropmenu:after {
    clear: both;
}

.dropmenu > ul {
}

.dropmenu li {
    position: relative;
    width: 160px;
    height: 40px;
    float: left;
    margin: 0px;
    padding: 0px;
    text-align: center;
}

.dropmenu li a {
    display: block;
    margin: 0px;
    padding: 0px;
}

.dropmenu > li > a:hover {
    opacity: 0.5;
}

.dropmenu li ul {
    list-style: none;
    position: absolute;
    z-index: 9999;
    top: 100%;
    left: 0;
    margin: 0;
    padding: 0;
    -webkit-box-shadow: 2px 2px 10px rgba(0,0,0,0.26);
    box-shadow: 2px 2px 10px rgba(0,0,0,0.26);
}

.dropmenu li ul li {
    width: 100%;
    height: 40px;
    margin: 0px;
    padding: 0px;
}

.dropmenu li ul li a {
    display: block;
    margin: 0px;
    padding: 10px;
    height: 18px;
    /*border: 1px solid #2CA9E1;*/
    border: 1px solid rgba(44,169,225,0.95);
    color: rgba(255,255,255,1.00);
    background: rgba(44,169,225,0.95);
    text-align: left;
}

.dropmenu li ul li a:hover {
    color: #2CA9E1;
    background: #FFFFFF;
    border: 1px solid rgba(255,255,255,0.95);
}

.dropmenu li#blank {
    display: none;
}


/* normal */
#normal li ul {
    display: none;
}
#normal li:hover ul {
    display: block;
}


/* spread */
#spread li ul li{
  overflow: hidden;
  height: 0;
  transition: .2s;
}

#spread li:hover ul li{
  overflow: visible;
  height: 40px;
    margin: 0px;
    padding: 0px;
}

/* fadein */
#fade-in li ul{
  visibility: hidden;
  opacity: 0;
  transition: 0s;
}
#fade-in li:hover ul{
  visibility: visible;
  opacity: 1;
}
#fade-in li ul li a{
  visibility: hidden;
  opacity: 0;
  transition: .5s;
}
#fade-in li:hover ul li a{
  visibility: visible;
  opacity: 1;
}

/* fadein-down */
#fade-in2 li ul{
  opacity: 0;
  top: 50%;
  visibility: hidden;
  transition: .5s;
}
#fade-in2 li:hover ul{
  top: 100%;
  visibility: visible;
  opacity: 1;
}

/* slide */
#slide ul{
  overflow: hidden;
  width: 0;
  transition: .5s;
}
#slide li:hover ul{
  width: 100%;
}
#slide li:hover ul li a{
  white-space: nowrap;
}


/* flip */
#flip > li{
  perspective: 400px;
}
#flip li ul{
  visibility: hidden;
  transform: rotateX(-90deg);
  transform-origin: 50% 0;
  transition: .3s;
}
#flip li:hover ul{
  visibility: visible;
  transform: rotateX(0);
}


/* rolling */
#rolling li ul {
  visibility: hidden;
  perspective: 400px;
}
#rolling li:hover ul{
  visibility: visible;
}
#rolling ul li{
  transform: rotateY(90deg);
  transform-origin: 50% 0;
  transition: .3s;
}
#rolling li:hover li{
  transform: rotateY(0);
}
#rolling ul li:nth-child(2) {
  transition-delay: .1s;
}
#rolling ul li:nth-child(3) {
  transition-delay: .2s;
}
#rolling ul li:nth-child(4) {
  transition-delay: .3s;
}
#rolling ul li:nth-child(5) {
  transition-delay: .4s;
}


/* pata2 */
#pata2 ul {
  visibility: hidden;
  perspective: 400px;
}
#pata2 li:hover ul{
  visibility: visible;
}
#pata2 ul li{
  transform: rotateX(-90deg);
  transform-origin: 50% 0;
  transition: .1s;
}
#pata2 li:hover ul li{
  transform: rotateX(0);
}
#pata2 li:hover ul li:nth-child(1) {
  transition-delay: 0s;
}
#pata2 li:hover ul li:nth-child(2) {
  transition-delay: .1s;
}
#pata2 li:hover ul li:nth-child(3) {
  transition-delay: .2s;
}
#pata2 li:hover ul li:nth-child(4) {
  transition-delay: .3s;
}
#pata2 li ul li:nth-last-of-type(1) {
  transition-delay: 0s;
}
#pata2 li ul li:nth-last-of-type(2) {
  transition-delay: .1s;
}
#pata2 li ul li:nth-last-of-type(3) {
  transition-delay: .2s;
}
#pata2 li ul li:nth-last-of-type(4) {
  transition-delay: .3s;
}