
div.Wrap{
}
div.Wrap>#header>.topmenu{
  height: 30px;
  width: 100%;
  background: white;
}
div.Wrap>#header>.topmenu>section{
    width:1200px;
    margin:0 auto;
    position:relative;
}
div.Wrap>#header>.topmenu>section>h4{
  color:#ca1b1d;
  font-size:18px;
  text-align:  center;
}
div.Wrap>#header>.topmenu>section>p{
  font-size:12px;
  padding: 8px 14px 0 0;
  color: #555555;
  position:  absolute;
  right: 0;
}
div.contents{
  width: 100%;
  float: left;
}

div.Wrap>header{
  width: 100%;
  float: left;
  background: white;
  }
div.Wrap>header>section{
  width: 1200px;
  margin: 0 auto;
}
div.Wrap>header>section>.m_menu{
    display: none;
}
div.Wrap>header>div.bg{
    position: absolute;
    left: 0;
    top: 169px;
    width: 100%;
    height: 76px;
    background-color: #f3f3f3;
    z-index: 2;
    display: none;
}
div.Wrap>header>section>h1{
  width: 100%;
  text-align:  center;
  float: left;
  margin-bottom: 20px;
}
div.Wrap>header>section>h1.two{
  display:none;
  text-align: left;
}
div.Wrap>header>section>h1.two>a>img{
      width: 58%;
    }

div.Wrap>header>nav{
    height: 50px;
    width: 100%;
    float: left;
    background: #093968;
}
div.Wrap>header>nav>ul{
    width: 1180px;
    margin:0 auto;
}
div.Wrap>header>nav>ul>li{
    float:left;
    margin-right: 68px;
    position:relative;
    padding-top: 11px;
}
div.Wrap>header>nav>ul>li>ul{
    top: 50px;
    z-index: 999;
    display: none;
    position: absolute;
    width: 167px;
}

div.Wrap>header>nav>ul>li>a{
    font-size: 18px;
    font-weight: 400;
    float:left;
    display:  block;
    text-align: center;
    width: 168px;
    color: white;
}
div.Wrap>header>nav>ul>li>ul>li{padding: 9px 0;text-align: center;}
div.Wrap>header>nav>ul>li>ul>li:hover{
    background:#ca1b1d;
}
div.Wrap>header>nav>ul>li>ul>li:hover a{
    color:white;
}
div.Wrap>header>nav>ul>li>ul>li>a{
    font-size: 14px;
    color: #333333;
    font-weight: 400;
    text-align:center;
    display:  block;
}

div.Wrap>header>nav>ul>li:last-child{
  margin-right: 0;
}
div.gnb{
    width:100%;
    float:left;
    display:  none;
    position: absolute;
    left: 0;
    top: 120px;
    z-index:  999;
    background: white;
    border-bottom:  5px solid #1d2189;
}
div.gnb>div{
  width:1200px;
  margin:0 auto;
}
.wrapper{display:none;}
.jbFixed {
        position: fixed;
        top: 0px;
        z-index:  999;
}
div.Wrap>.jbFixed>section>h1{
  float:left;
  width:auto;
  padding-bottom:10px;
  padding-top: 10px;
  padding-left: 0;
}

div.Wrap>.jbFixed>nav{
  width:auto;
  float: left;
  background:none;
  margin-top: 16px;
  /* margin-left: 162px; */
}
.jbFixed topmenu{
  display:none;
}
div.Wrap>.jbFixed>div.bg{
  top: 80px;
}
div.Wrap>.jbFixed>.topmenu{
  display:none;
}
div.Wrap>.jbFixed>nav>ul{
  width:auto;
}
div.Wrap>.jbFixed>nav>ul>li>ul{
  top: 67px;
}
div.Wrap>.jbFixed>nav>ul>li{
  margin-right: 0;
}
div.Wrap>.jbFixed>nav>ul>li>a{
  color:black;
}
@media screen and (max-width:1200px) {
    #navi{
        display:none;
    }
    div.Wrap>.jbFixed .wrapper{
      top: 8px;
    }
    .wrapper {
      display:block;
      position:absolute;
      right: 0px;
      z-index:  999;
      top: 38px;
    }
    .m_menu{
        float: right;
        display: none;
    }
    .m_menu>ul{
        width: 200px;
    }
    .m_menu>ul>li{
        font-size:16px;
        color:white;
        background:green;
    }
    .m_menu>ul>li>a{
        padding: 16px 40px;
        display:  block;
        font-size: 16px;
        background: #07182a;
        cursor:pointer;
        font-weight: 600;
    }
    .m_menu>ul>li>ul{
        display: none;
    }
    .m_menu>ul>li>ul>li>a{
        display: block;
        padding: 14px 40px;
        background: #093968;
        color: white;
    }
    #line-wrapper {
      cursor:pointer;
      height: 45px;
      position:relative;
      left: 0;
      padding: 12px 12px 18px 12px;
      float: left;
    }

    .init {
      animation:none !important;
    }

    .line {
      background:#ffffff;
      margin-top: 3px;
      margin-bottom: 3px;
      width: 35px;
      height: 3px;
      box-shadow:0 1px 3px rgba(0,0,0,.5);
      position:relative;
    }

    .line-top {
      animation:line-top .5s forwards ease-out,
                line-top-rotate .3s .5s forwards ease-out;
    }

    .top-reverse {
      animation:line-top-rotate-reverse .3s forwards ease-out,
                line-top-reverse .5s .3s forwards ease-out;
    }

    .line-mid {
      animation:line-mid .5s forwards ease-out;
    }

    .mid-reverse {
      animation:line-mid-invisible .3s forwards ease-out,
                line-mid-reverse .5s .3s forwards ease-out;
      margin: 10px 0;
    }

    .line-bot {
      animation:line-bot .5s forwards ease-out,
                line-bot-rotate .3s .5s forwards ease-out;
    }

    .bot-reverse {
      animation:line-bot-rotate-reverse .3s forwards ease-out,
                line-bot-reverse .5s .3s forwards ease-out;
    }

    @keyframes line-top {
      0% {transform:translateY(0px)}
      100% {transform:translateY(6px)}
    }

    @keyframes line-top-reverse {
      0% {transform:translateY(6px)}
      100% {transform:translateY(0px)}
    }

    @keyframes line-top-rotate {
      0% {transform:translateY(6px) rotateZ(0deg)}
      100% {transform:translateY(6px) rotateZ(45deg)}
    }

    @keyframes line-top-rotate-reverse {
      0% {transform:translateY(6px) rotateZ(45deg)}
      100% {transform:translateY(6px) rotateZ(0deg)}
    }

    @keyframes line-mid {
      0% {transform:scale(1)}
      100% {transform:scale(0)}
    }

    @keyframes line-mid-reverse {
      0% {transform:scale(0)}
      100% {transform:scale(1)}
    }

    @keyframes line-mid-invisible {
      0% {transform:scale(0)}
      100% {transform:scale(0)}
    }

    @keyframes line-bot {
      0% {transform:translateY(0px)}
      100% {transform:translateY(-6px)}
    }

    @keyframes line-bot-reverse {
      0% {transform:translateY(-6px)}
      100% {transform:translateY(0px)}
    }

    @keyframes line-bot-rotate {
      0% {transform:translateY(-6px) rotateZ(0deg)}
      100% {transform:translateY(-6px) rotateZ(135deg)}
    }

    @keyframes line-bot-rotate-reverse {
      0% {transform:translateY(-6px) rotateZ(135deg)}
      100% {transform:translateY(-6px) rotateZ(0deg)}
    }
    div.Wrap>header>section{
        width: 100%;
    }
    div.Wrap>header>section>h1{
        text-align: left;
        padding: 0;
    }
    div.Wrap>header>section>h1.one>a>img{
        width:200px;
    }

    div.Wrap>#haeder>.topmenu>section{
        width:100%;
    }
    div.Wrap>header>div.bg2{
        width:100%;
        height:100%;
        background: rgba(0,0,0,0.5);
        position:fixed;
        z-index:998;
        top:0;
        display:none;
    }
    div.Wrap>header{
        height:100px;
    }
    div.Wrap>.jbFixed{
      height:auto;
    }
    div.Wrap>#header>.topmenu>section{
      width:100%;
    }


}
@media screen and (max-width:320px) {
div.Wrap>header>section>h1>a>img{
      width:70%;
   }
