@charset "utf-8";

/*font*/
@import url('https://fonts.googleapis.com/css?family=Noto+Sans|Noto+Serif');

/* È­¸é ³Êºñ 769 ~ 1200px */
* {margin: 0; padding: 0;}
html, body { font-family: 'Noto Sans KR', sans-serif; background-color :#f8f8f8; list-style:none; word-break: keep-all; }
a { text-decoration: none; }
h1, h2 { font-size: 30px; line-height: 1.25em;}
h3 { font-size: 22px; line-height: 1.25em;}
p { font-size: 16px; line-height:2.2em;}

/*ÃÖ»ó´Ü navbar*/
.navbar { position:fixed; z-index:2; align-items: center; text-align:center; font-size:18px; width:100%; background-color:#fff; border-bottom: 1px solid #ddd; }
.navbar_logo { display: flex;  padding: 10px 80px; }
.navbar_logo a { color: red;}
.navbar_menu { display: flex; position:absolute; top:2; right:50; list-style: none; }
.navbar_menu a { color: #4b4b4b;}
.navbar_menu li { width:150px; padding:20px 10px; line-height:0.8em; }
.navbar_menu li:hover{ background-color: #efefef; border-radius: 4px; }
.product_02 li:hover,.product_03 li:hover{background-color: #ddd; border-radius: 4px; }
.product_01 ul,.product_02 ul,.product_03 ul {z-index:3; paddiwng:0; margin-top:10px; }
.navbar a#navbar_menuBtn,.product_01 ul li,.product_02 ul li,.product_03 ul li  { z-index:4; display: none; list-style: none; padding:10px 0;}
.submenu_01 ul,.submenu_02 ul,.submenu_03 ul,.submenu_04 ul,.submenu_05 ul { display: none;}

/*product navbar*/
.topbg { height:109px; width: 100%;}
.navbar_02 { position: fixed; width:100%;  z-index:1; top:59px; height: 50px;  font-size:14px; display: flex; justify-content: flex-start; background-color: #efefef; border-top: 1px solid #bcbec0; border-bottom: 1px solid #bcbec0;}
.navbar_02_iconl { width: 15%;}
.navbar_02_iconr { width: 50%;}
.navbar_02_menu { width: 35%; max-width:1200px; display: flex; justify-content: space-around; align-items: center;}
.navbar_02_menu ul { min-width:100%;  list-style: none; background-color: #ddd;}
.navbar_02_menu a { color: #494949;}
.navbar_02_menu li { flex-direction: column; list-style: none; padding: 16px 10px; margin : 1px;}
.navbar_02_menu li:hover .sub_menu_01,.navbar_02_menu li:hover .sub_menu_02,.navbar_02_menu li:hover .sub_menu_03,.navbar_02_menu li:hover .sub_menu_04,.navbar_02_menu li:hover .sub_menu_05 { display:block; position: absolute; margin-left: -10px;}
.sub_menu_01, .sub_menu_02, .sub_menu_03, .sub_menu_04, .sub_menu_05 { display: none; margin: 15px 0; }

/*index container*/
.container{ margin:0 auto; display: flex; max-width:1200px; justify-content: space-between; text-align:center; font-size:18px;}


.side { width:25%;}
.side p { width: 100%; color: #4b4b4b;}
.side p.line:after { content: ""; display: block;  width: 80%; border-bottom: 1px solid #bcbcbc; margin: 10px auto;}
.side_icon{ padding: 30px 0 15px 0;}
.side_menu{ display: flex; list-style: none;}
.side_menu li { width: 50%; line-height:2em;  font-size:14px; }
.side_menu a { color: #494949;}

/*
.section { position: absolute; left:50%; top: 55%; transform: translate(-50%, -50%); padding: 50px 0; width:20%; max-width:550px;}
*/




/*.section {width: 100%; max-width: 550px; padding: 50px 0; } */
.section { position: absolute; left:50%; top: 55%; transform: translate(-50%, -50%); padding: 50px 0; width:20%; max-width:550px; flex-grow: 1; display: flex; justify-content: center; }
/* .section { flex-grow: 1; display: flex; justify-content: center; } */

.footer { background: #f0f0f0; font-size:14px; color: #494949; padding: 20px 0; text-align:center; }

/*product*/
.pdcontainer_01{ max-width: 100%; height:auto; flex-direction: column; justify-content: center; text-align:center; background-color: #fff; }
.pdcontainer_02{ max-width: 100%; height:auto; flex-direction: column; justify-content: center; text-align:center; background-color: #fafafa;}
.product { display: flex;  min-height: 1px; height: auto; justify-content: center; padding: 40px 0; }
.product img { max-width:100%;}
.product_main { width: 100%; max-width:1200px; height:auto; color:#4b4b4b; padding: 5px; }
.product_main h2 { color:#000; padding: 0 30px 25px; text-align: left;}
.product_main h2:before { display:inline-block; content:""; position:relative; left:-10px; top: -2px; width:20px; height:20; border-radius:10%; background: #fff; border:5px solid #fd916f;  box-sizing:border-box;}
.product_main h3 { color:#000; padding: 0 20px 15px; text-align: left;}
.product_main ol {padding: 20px 0;}
.product_main p { padding: 20px 20px 40px; text-align: left; }
.product_partner { padding: 15px 10px; }
.product_partner img {border: 1px solid #ababab; margin: 5px 10px; }
.product_partner_im { text-align: left; padding-left : 15px; }
.product_content { display: flex; justify-content: space-around; width: 100%; height: auto; padding: 0; }
.product_01_left img,.product_01_right img,.product_02_left img,.product_02_right img { padding: 20px; }
.product_01_left,.product_01_right,.product_02_left,.product_02_right { width: 50%; max-width: 600px; height: auto; padding: 5px; justify-content: space-around;}
.product_p { display: flex; justify-content: center; }
.product_m { display: none; }
.pdintro { text-align: center; background-color: #fff; padding-bottom: 20px;  }
.pdtabs { display:flex; justify-content: space-evenly;  background-color: #fff;}
.pdtab_01 { padding: 20px; text-align:center; border-top:4px solid gray; } 
.pdtab_02 { padding: 20px; text-align:center; border-top:4px solid gray; }
.pdtab_01:hover {background-color: #ddd; border-radius: 4px; }
.pdtab_02:hover {background-color: #ddd; border-radius: 4px; }
.pdtab_content { padding:10px 0 0 40px; width:100%; background:#fff; border:1px solid black; }

/*aboutus*/
.product_title { width: 80%; max-width:1200px;}
.product_title h1 { padding: 60px 0;}
.product_story { width: 80%; max-width:1200px; display:flex; flex-wrap: wrap; }
.product_story_list {display: flex; justify-content:space-around; width: 49%; padding: 0 0 30px; }
.product_story ul { width:210px; }
.product_story li { list-style:none;}
.product_story li h3 { padding: 20px 0; }
.product_story li p { padding: 0 0 20px; }

.history { width: 100%; max-width:1000px; padding: 0 15%; text-align:left; }
.history h2 {position: relative;}
.history h2:before { content:""; position:absolute; left:-35px; top: 12px; width:17px; height:17px; border-radius:20%; background: #fff; border:5px solid #fd916f;  box-sizing:border-box;}
.history_title {position: relative; padding: 20px 0 0 48px; }
.history_title img { position:absolute; width:50px; height:auto; bottom:150px; }
.history_title:before { content:""; position: absolute; left:20px; top:32px; width:3px; height:99%; background:#ddd;}
.history ol {padding : 15px 0 60px; ;}
.history li {list-style:none; font-size:16px; line-height:2em;}

.business {display:flex; flex-wrap: wrap; justify-content:space-around; text-align:left; margin:0 auto;}
/*.business ul{ border-right:1px solid blue; border-top:1px solid blue; border-bottom:1px solid blue;}*/
.business li{ display: flex; list-style:none; background-color:#fff; padding: 20px 0;}
.business li img { height:80px; width:auto; }
.business p {display:inline-block; padding: 0 20px; width:200px; }
.business_list { width:45%; padding:0 0 20px; }