﻿@charset "utf-8";

/* @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); */

/*나눔 고딕 글꼴*/
@font-face  { 
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/NanumGothic-Regular.eot');
  src: url('../fonts/NanumGothic-Regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/NanumGothic-Regular.woff2') format('woff2'),
       url('../fonts/NanumGothic-Regular.woff') format('woff'),
       url('../fonts/NanumGothic-Regular.ttf') format('truetype');
 }
@font-face  { 
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/NanumGothic-Bold.eot');
  src: url('../fonts/NanumGothic-Bold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/NanumGothic-Bold.woff2') format('woff2'),
       url('../fonts/NanumGothic-Bold.woff') format('woff'),
       url('../fonts/NanumGothic-Bold.ttf') format('truetype');
 }
@font-face  { 
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/NanumGothic-ExtraBold.eot');
  src: url('../fonts/NanumGothic-ExtraBold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/NanumGothic-ExtraBold.woff2') format('woff2'),
       url('../fonts/NanumGothic-ExtraBold.woff') format('woff'),
       url('../fonts/NanumGothic-ExtraBold.ttf') format('truetype');
 }

body  { font-family: 나눔고딕, 'Nanum Gothic', arial, verdana, sans-serif !important; }
	
	
 /*초기화*/
    body, h1, h2, h3, h4, h5, p, ul, dl, dt, dd, figure  {  margin: 0; padding: 0; vertical-align:baseline;  }
    li  {  list-style: none;  }
    a  {  text-decoration: none;  }
    img  {  border: 0;  }
    hr  {  display: none;  }
    .hidden  {  position: absolute; left: -9999px;  }

    
@media (min-width: 700px)  { 
	.userWrap  { position: absolute; right: 0; top: 0; height: 46px; color:#fff; text-align:right; line-height:46px; font-size:12px;  }
	.userName  { display:inline-block;  }
	.login  {  display:inline-block; padding: 0px 15px; cursor:pointer;  }
	.login > a  { display:block; color:#fff; }
	.login > a > img { width:15px; margin:0 5px; vertical-align:-5px; }
	
	.mail  {  display:inline-block; padding: 0px 15px; cursor:pointer;  }
	.mail > a  { display:block; color:#fff; }
	.mail > a > img { width:18px; margin:0 5px; vertical-align:-3px; }
	
    #footer  {  overflow:hidden; margin:0; padding:10px 0; background:#262524; color:#bbb; text-align:center; font-size:0.813em;/* 13px */  }
    #footer .f_inner  {  margin:0 auto; height:auto;  }
    #footer .f_inner p  {  width:100%; line-height:1.7; margin:0 auto;  }
    #footer .f_inner > p > span  {  display:inline-block;  }
    #footer .f_inner p em  {  display:block; font-size:0.688em;/* 11px */ color:#777;  }
    .f_inner img { width:120px;height:auto; }
    /*con_1*/
    .all_wrap { margin:auto;width:1000px; height:100%; }

    /*con_1*/
    .con_1 { text-align:center;padding-top:120px;background-color:#ffedde; }
    .logo { margin-top:40px; }
    .logo img { width:450px; height:auto; }
    .con_1_text { margin:20px 0 90px 0; }
    .con_1_bot_line { margin: 40px 0 -8px 0; }
    .m_con_1_bot_line { display:none; }
    #m_con_1_img_02 { display:none; }
    #m_con_2_img { display:none; }

    /*con_2*/
    .con_2 { text-align:center;background-image:url(/images/con2_back.jpg);padding-top:40px; }
    p { font-size:12px; }
    #bottom_line { margin-top:-15px; }

    /*con_3*/
    .con_3 { margin-top:40px;border-bottom:1px solid black; }
    .con_3_text { display:inline-block;margin-top:80px; }
    #con3_text_in { width:1000px; height:200px;display:inline-block; }
    #con_3_img { display:inline-block;margin: 5px 0 40px 50px; }

    #m_con_3_img { display:none; }

    /*con_4*/
    .con_4 { margin-top:80px ;margin-bottom:100px; }
    .con_4_text { display:inline-block; }
    #test_in { width:1000px; height:200px;display:inline-block; }
    #con_4_img { display:inline-block;margin:20px 0 30px 50px; }

    #m_con_4_img { display:none; }


    /*i_con_1*/
    .i_con_1 { text-align:center;background-color:#ffedde;padding-bottom:100px; }

    /*i_con_2*/
    .i_con_2 { text-align:center; }
    .i_con_2_text { ;background-color:#241209; background-image:url(/images/coffee_bin_img.png);background-size: auto 100%;padding:30px; }
    .chart_img { margin:50px 0 50px 0; }
    .con_2_link { text-align:center;padding:50px 0 70px; }
    .m_i_con_1_img { display:none; }
    .m_chart_img { display:none; }
    .con_2_link img { width:170px;height:auto; }




    /*p_con_1*/
    .p_con_1 { text-align:center;padding:150px 0 70px;background-color:#ffedde; }
    .p_con1_img2 { margin:50px 0 -75px; }
    .m_p_con_1_img { display:none; }
    .m_p_con1_img2 { display:none; }

    /*p_con_2*/
    .p_con_2 { text-align:center; }
    .p_con_2_top {  background-color:#130a01;padding:30px 0 30px ; }
    .p_con_2_img { padding:30px 0 30px ; }
    .m_p_con_2_img { display:none; }
    .chart_img img { margin-top:50px;width:700px;height:auto; }

    /*p_con_3*/
    .p_con_3 { text-align:center;background-color:#ffedde; }
    .p_con_3_title { background-color:#130a01;padding:30px 0 30px ; }
    .p_con_3_text { padding:50px 0 30px; }
    .p_con_3_img1 { margin-bottom:50px; }
    .p_con_3_img2 { margin:50px 0 50px; }
    .m_p_con_3_img1 { display:none; }
    .m_p_con_3_img2 { display:none; }

    /*p_con4*/
    .p_con_4 { text-align:center;background-color:#ffedde; }
    .p_con_4_title { background-color:#130a01;padding:30px 0 30px ; }
    .p_con_4_text { padding:50px 0 0 0; }
    #p_con_4_textin { padding-top:30px; }
    .p_con_4_bottom { padding:50px 0 50px; }
    .m_p_com_4_img1 { display:none; }

    .p_navi_in  { padding: 50px 0 16px; display: inline;position: fixed;margin: 0 auto;width: 100%;height: 50px;background-color: #ffedde; }
    .p_navi_in ul  { list-style: none;display: block;text-align: center;width: 450px;margin: 0 auto; }
    .p_navi_in ul li  { float: left;padding: 0;text-align: center;width: 150px;height: 60px; }
    .m_p_navi_in { display:none; }

    .i_navi_in  { padding: 50px 0 16px;display: inline;position: fixed; margin: 0 auto;width: 100%;height: 50px;background-color: #ffedde; }
    .i_navi_in ul  { list-style: none;display: block;text-align: center;width: 450px;margin: 0 auto; }
    .i_navi_in ul li  { float: left;padding: 0;text-align: center;width: 150px;height: 60px; }
    .m_i_navi_in { display:none; }

    .navi_in  { padding: 50px 0 16px;display: inline;position: fixed;margin: 0 auto;width: 100%;height: 50px; background-color: #ffedde; }
    .navi_in ul  { list-style: none;display: block;text-align: center;width: 600px;margin: 0 auto; }
    .navi_in ul li  { float: left;padding: 0;text-align: center;width: 150px;height: 60px; }
    .m_navi_in { display:none; }



  .navi  { background-color: #000; position:fixed; top:0; z-index:100;width:100%;height:46px;margin: 0 auto; }
  .navi ul  { list-style:none;display:block;text-align:center;width:520px;margin:0 auto; }
  .navi ul:after { content:''; display:block;clear:both;visibility:hidden; }
  .navi ul li { float:left;padding:0;text-align:center;width:130px; }
  .navi ul li a { display:block; position:relative; color:#fff; text-decoration:none;padding:15px 25px;font-weight:bold; font-size:14px;transition:color .25s; }
  .navi ul li a:hover { color:#f00505; }
  .navi ul li a.on  { color:#f00505; }
  .navi ul li a:hover:before { width:100%; }
  .navi ul li a:before { content:'';display:block; position:absolute; left:0;bottom:0;height:3px;width:0; background:#f00505;transition:width .25s;
   }
  .navi ul li.active a { color:#f00505; }
  .navi ul li.active a:before { width:100%; }
  .navi ul li a.on:before { width:100%; }

 }
@media (max-width: 699px)  { 
	.userWrap  {  position: absolute; right: 0; top: 0; height: 46px; color:#fff; text-align:right; line-height:46px; font-size:12px;  }
	.userWrap .loginBtn, .userWrap .mailBtn  {  display:none;  }
	.userName  {  display:inline-block;  }
	.login  {  display:inline-block; padding: 0px 10px; cursor:pointer;  }
	.login > a  {  display:block; color:#fff;   }
	.login > a > img { width:15px; margin:0 5px; vertical-align:-5px; }
	
	.mail  {  display:inline-block; padding: 0px; cursor:pointer;  }
	.mail > a  { display:block; color:#fff; }
	.mail > a > img { width:18px; margin:0 5px; vertical-align:-3px; }
	
    #footer  {  margin:0; padding:10px 0; background:#262524; color:#bbb; text-align:center; font-size:0.813em;/* 13px */  }
    #footer .f_inner  {  margin:0 auto; height:auto;  }
    #footer .f_inner p  {  width:100%; line-height:1.7; margin:0 auto;  }
    #footer .f_inner > p > span  {  display:inline-block;  }
    #footer .f_inner p em  {  display:block; font-size:0.688em;/* 11px */ color:#777;  }
    .f_inner img { width:120px;height:auto; }

    .con_1_img { display:none; }
    #con_1_img_02 { display:none; }
    .con_1 { text-align:center;padding-top:50px;background-color:#ffedde;font-size:12px; }
    .logo img { width:270px; height:auto; }
    .con_1_bot_line { display:none; }
    .m_con_1_bot_line { margin:30px 0 -3px; }
    .con_2 { text-align:center;background-image:url(/images/con2_back.jpg);padding-top:40px;font-size:12px; }
    p { font-size:12px; }
    #m_con_1_img_02 img { width:350px;height:auto;padding:50px 0 50px; }
    #bottom_line { margin-top:-12px; }
    #bottom_line img { width:350px;height:5px; }
    #con_2_img { display:none; }

    /*con_3*/
    .con_3 { margin-top:5px;border-bottom:1px solid black ;text-align:center;font-size:12px; }
    .con_3_text { display:inline-block;margin-top:30px; }
    /*#con3_text_in { width:1000px; height:200px;display:inline-block; }*/
    #m_con_3_img { padding:50px 0 50px;max-width : 320px; }
    #m_con_3_img img { width:320px;height:auto; }
    #con_3_img  {  display: none; }

    /*con_4*/
    .con_4 { margin-top:40px ;margin-bottom:50px;text-align:center;font-size:12px; }
    .con_4_text { display:inline-block; }
    /*#test_in { width:1000px; height:200px;display:inline-block; }*/
    #con_4_img { display:none; }
    #m_con_4_img { margin-top:50px; }
    #m_con_4_img img { width:320px;height:auto; }

    .m_navi_in img { width:88px;height:auto; }
    .m_i_navi_in img { width:88px;height:auto; }
    .m_p_navi_in img { width:88px;height:auto; }

    /*i_con_1*/
    .i_con_1 { text-align:center;background-color:#ffedde;padding:100px 0 50px;font-size:12px; }

    /*i_con_2*/
    .i_con_2 { text-align:center;font-size:13px; }
    .i_con_2_text { ;background-color:#241209; background-image:url(/images/coffee_bin_img.png);background-size: auto 100%;padding:30px; }
    .con_2_link { text-align:center;padding:50px 0 70px; }
    /*.m_chart_img { margin-top:50px; }*/
    .i_con_1_img img { width:370px;height:auto; }
    .chart_img img { margin-top:50px;width:350px;height:auto; }
    

    /*p_con_1*/
    .p_con_1 { text-align:center;padding:120px 0 70px;background-color:#ffedde; }
    .p_con1_img2 { margin:50px 0 -75px; }
    .p_con_1_img { display:none; }
    .p_con1_img2 { display:none; }
    .m_p_con_1_img img { width:330px;height:auto; }
    .m_p_con_1_img { margin:-10px 0 50px; }

    /*p_con_2*/
    .p_con_2 { text-align:center;margin-top:-74px; }
    .p_con_2_top {  background-color:#130a01;padding:10px 0 10px ; }
    .p_con_2_img { display:none ; }
    .m_p_con_2_img { margin:50px 0 50px; }
    .m_p_con_2_img img { width:350px;height:auto; }
    .con_2_link img { width:120px;height:auto; }

    /*p_con_3*/
    .p_con_3 { text-align:center;background-color:#ffedde;font-size:12px; }
    .p_con_3_title { background-color:#130a01;padding:10px 0 10px ; }
    .p_con_3_text { padding:50px 0 30px; }
    .p_con_3_img1 { display:none; }
    .p_con_3_img2 { display:none; }
    .m_p_con_3_img1 { margin-bottom:50px; }
    .m_p_con_3_img2 { margin:50px 0 50px; }
    .m_p_con_3_img1 img { width:330px; height:auto; }
    .m_p_con_3_img2 img { width:300px; height:auto; }


    /*p_con4*/
    .p_con_4 { text-align:center;background-color:#ffedde;font-size:11px; }
    .p_con_4_title { background-color:#130a01;padding:10px 0 10px ; }
    .p_con_4_text { padding:50px 0 0 0; }
    #p_con_4_textin { padding-top:30px; }
    .p_con_4_bottom { padding:50px 0 50px; }
    .p_con_4_img1 { display:none; }

    .m_p_navi_in  { padding: 50px 0 16px; display: inline;position: fixed;margin: 0 auto;width: 100%;height: 20px;background-color: #ffedde; }
    .m_p_navi_in ul  { list-style: none;display: block;text-align: center;width: 270px;margin: 0 auto;padding-top:3px; }
    .m_p_navi_in ul li  { float: left;padding: 0;text-align: center;width: 90px;height: 60px; }
    .p_navi_in { display:none; }

    .m_i_navi_in  { padding: 50px 0 16px; display: inline;position: fixed;margin: 0 auto;width: 100%;height: 20px;background-color: #ffedde; }
    .m_i_navi_in ul  { list-style: none;display: block;text-align: center;width: 270px;margin: 0 auto;padding-top:3px; }
    .m_i_navi_in ul li  { float: left;padding: 0;text-align: center;width: 90px;height: 60px; }
    .i_navi_in { display:none; }
    
    .m_navi_in  { padding: 50px 0 16px;display: inline;position: fixed;margin: 0 auto;width: 100%;height: 20px; background-color: #ffedde; }
    .m_navi_in ul  { list-style: none;display: block;text-align: center;width: 360px;margin: 0 auto;padding-top:3px; }
    .m_navi_in ul li  { float: left;padding: 0;text-align: center;width: 90px;height: 60px; }
    .navi_in { display:none; }

  	.navi  { background-color: #000;position:fixed;z-index:100;width:100%;height:46px;top:0; margin: 0 auto; }
  	.navi ul  { list-style:none; display:block; text-align:left; margin:0 auto; }
  	.navi ul:after { content:''; display:block;clear:both;visibility:hidden; }
  	.navi ul li { display:inline-block; padding:0;text-align:center; /* width:90px; */ }
	.navi ul li a { display:block; position:relative; color:#fff; text-decoration:none;padding:16px 15px;font-weight:500; font-size:12px;transition:color .25s; }
	.navi ul li a:hover { color:#f00505; }
	.navi ul li a:hover:before { width:100%; }
	.navi ul li a:before { content:'';display:block; position:absolute; left:0;bottom:0;height:3px;width:0; background:#f00505;transition:width .25s;
	 }
	.navi ul li.active a { color:#f00505; }
	.navi ul li.active a:before { width:100%; }
   }
