@font-face {
    font-family: 'menusFont';
    src: url('../images/JAAPOKKI-REGULAR.WOFF.TTF');
    font-style: normal;
    font-weight: normal;
  }

  body{min-height: 100%;}
  .container{width:100%;height:100%;position: fixed;background:#000;}

  .menu_nav{position:fixed;left:2%;top:5%;width:150px;z-index: 1000;text-align: left;height:180px;}
  .menu_nav ul li{height: 45px;}
  .menu_nav ul li a{font-family:'menusFont';line-height:25px;font-size:15px;color:#cccccc;}
  .menu_nav ul li.sel a{color: #fff;}
  .quote_nav{position:fixed;right:2%;top:5%;width:120px;z-index: 1000;}
  .quote_nav a{font-family:'menusFont';display: block;font-size:14px;background:#fff;border-radius: 15px;line-height:30px;color:#000;text-align:center;}

  .logo_nav{position:fixed;bottom:10%;left:1%;width: 15%;z-index: 1000;}
  
  .container_index, .container_main, .container_works, .container_about, .container_contact, .container_quote{height:100%;}

  .container_index{background:#fff;}
  .container_index .main_logo_nav, .container_main .main_logo_nav{position:absolute;top:40%;width: 100%;text-align: center;z-index:10;}

  .container_index .progress_bar{width:1%;height:2px;background:#000;}


  .container_main .lan_nav{position:absolute;bottom:0%;width:100%;text-align:center;z-index: 10;}
  .container_main .lan_nav ul{width:300px;height:40px;margin:0px auto;}
  .container_main .lan_nav ul li{width:50%;line-height: 30px;float:left;}
  .container_main .lan_nav ul li a{font-family:'menusFont';font-size:14px;color:#808080;}
  .container_main .lan_nav ul li a:hover{color:#fff;border-bottom: 1px solid #fff;}
  .container_main .lan_nav .arrow_down{margin:0px auto;width: 32px;height: 17px;background: url(../images/main_arrow_down.png) center center no-repeat;}

  /*
  .container_main .main_pics{height:100%;position: absolute;width:100%;left:0px; top:0px;display: block;z-index:1;}
  .container_main .main_pics .picnav{width: 100%;height:100%;position:absolute;left:0px; top:0px;overflow: hidden;
      background:url(../images/1x1.png) center center no-repeat; background-size: 100% 100%; display: none;}
  .container_main .main_pics .picnav:first-child{display: block;}
*/

  .container_works .works_pics{height:100%;position: absolute;width:100%;left:0px; top:0px;display: block;}
  .container_works .works_pics .picnav{width: 100%;height:100%;position:absolute;left:0px; top:0px;overflow: hidden;
      background:url(../images/1x1.png) center center no-repeat; background-size: 100% auto; display: none;}
  .container_works .works_pics .picnav:first-child{display: block;}
  .container_works .works_pics .picnav_w{background-size: 80% auto;}
.container_works .works_pics .picnav_h{background-size: 90% auto;}
/*
  .container_works .works_pics .picnav_h{background-size: auto 100%;}
*/
  .container_about{background: url(../images/about_bg.png) center center no-repeat;background-size: 100% 100%;} 
  .container_about .cont{position: absolute; top:35%;left:50%;height:30%;width:400px;font-size:13px;line-height:20px;color: #f1f1f1;overflow:auto;height:60%;}
  
  .contscrollbar::-webkit-scrollbar {width: 5px;}
  .contscrollbar::-webkit-scrollbar-track {background:rgba(255, 255, 255, 0.3);}
  .contscrollbar::-webkit-scrollbar-thumb {background-color: #aaa; border-radius: 50px;}
  .contscrollbar::-webkit-scrollbar-thumb:hover {background-color: #ccc;}
      

  /*.container_contact{background: url(images/about_bg.png) center center no-repeat;background-size: 100% 100%;}*/
  .container_contact .cont{position: absolute; top:15%;left:20%;width:60%;height:70%;}
  .container_contact .cont .leftnav{width:30%;float:left;height:100%;font-size:13px;line-height:26px;color: #f1f1f1;}
  .container_contact .cont .leftnav .cont_ttl{font-weight:bold;}
.container_contact .cont .leftnav a{color:#f1f1f1}

.container_contact .cont .leftnav .wtapp{border-radius:3px;display:inline-block;padding:0px 5px;height:30px;background:#f1f1f1; color:#333;text-align:center;line-height:30px;}
.container_contact .cont .leftnav img{width:18%;display:block;margin:5px 0px;}
  .container_contact .cont .rightnav{width:70%;float:right;height:100%;}
  
  .container_contact .cont .rightnav .iptnav{margin-bottom:15px;}
  .container_contact .cont .rightnav .iptnav .ipt_lable{font-size:13px;color:#eee;line-height:24px;height:30px;}
  .container_contact .cont .rightnav .iptnav .ipt_main{background:rgba(0,0,0,0.5);}
  
  .ms_input, .ms_textarea{background:none;border:none;outline:none;color:#eee;font-size:14px;width:100%;background:#333;padding-left:10px;border-radius:5px;}
  .ms_input{height:30px;line-height:30px;}
  .ms_textarea{min-height:120px;line-height:30px;font-family:arial;}
  .ms_btn{width:150px;height:40px;font-size:14px;line-height:40x;text-align:center;border:none;background:#aaa;border-radius:10px;cursor:pointer}
  .ms_btn:hover{background:#ccc;}
  
  a.aCondition{color:#999;font-size:12px;text-decoration:underline;}
  a.aCondition:hover{color:#bbb;}

  .container_quote .quote_main{width:600px;height:60%;background:rgba(255,255,255,0.2);padding:10px;margin:7% auto 0px;overflow:auto;}
  .container_quote .quote_main .mttl{font-size:22px;color:#fff;line-height:35px;}
  .container_quote .quote_main .mttld{font-size:13px;color:#fff;line-height:20px;}
  .container_quote .quote_main .ttl{font-size:16px;color:#fff;line-height:25px;}
  .container_quote .quote_main .ttld{font-size:13px;color:#fff;line-height:20px;}
  .container_quote .quote_main .lines{height:10px; border-bottom: 1px solid #ccc;margin-bottom:15px;}
  .container_quote .quote_main .iptnav{position:relative;padding-left:180px;margin-bottom:12px;}
  .container_quote .quote_main .iptnav .ipt_lable{position:absolute;left:0px;top:5px;min-height:35px;width:180px;font-size:12px;color:#eee;line-height:22px;}
  .container_quote .quote_main .iptnav .ipt_main{background:rgba(0,0,0,0.5);padding:0px 10px;}
  
  .iptprivacy{height:30px;color:#ccc;}
  .iptprivacy a{color:#bbb;font-size:13px;}
  
  .qt_input{background:none;border:none;outline:none;color:#eee;font-size:14px;height:35px;line-height:35px;width:100%;}
  .qt_select{background:none;border:none;outline:none;color:#eee;font-size:14px;height:35px;line-height:35px;width:100%;}
  .qt_select option{color:#333;}
  .qt_textarea{background:none;border:none;outline:none;color:#eee;font-size:14px;min-height:150px;line-height:28px;width:100%;font-family:arial;}
  .qt_btn{width:150px;height:30px;font-size:14px;line-height:30x;text-align:center;border:none;background:#aaa;border-radius:5px;cursor:pointer;}
  .qt_btn:hover{background:#ccc;}
  

  @keyframes kf_index_logo {
      from{
          opacity: 1;
      }to{
          opacity: 0;
      }
  }

  .change_color{
      animation-name: kf_index_logo;
      animation-duration: 2000ms;
      animation-timing-function: linear;
      animation-iteration-count: 1;
      animation-fill-mode: forwards;
  }
  
  .contscrollbar::-webkit-scrollbar {width: 5px;}
  .contscrollbar::-webkit-scrollbar-track {background:rgba(255, 255, 255, 0.3);}
  .contscrollbar::-webkit-scrollbar-thumb {background-color: #aaa; border-radius: 50px;}
  .contscrollbar::-webkit-scrollbar-thumb:hover {background-color: #ccc;}
  
  
  .container_policy{width:100%;height:100%;position: fixed;background:rgba(0,0,0,1);z-index:10000;}
  .container_policy .pmain{position:absolute;left:20%;top:20%;width:60%;height:60%;background:rgba(255,255,255,0.2);font-size:13px;line-height:22px;text-align:left;color:#aaa;padding:10px 0px 10px 10px;}
  .container_policy .pmain .cont{height:100%;overflow:auto;}
  .container_policy .pmain .cls{position:absolute;right:0%;top:0%;background:rgba(255,255,255,0.2);width:25px;height:25	px;text-align:center;color:#aaa;text-align:center;cursor:pointer}

  .mob_undis{}