@charset "utf-8";

body {  font-family: "Noto Sans KR" , sans-serif; margin: 0; padding: 0; background:#fff; }

/* defualt layout */
* {margin: 0; padding: 0; outline: 0;}
img { border:0px; padding:0px; margin:0px; }
section { margin:0px; padding:0px; }
#container { position:relative; min-width:940px; }
#container_product { position:relative; padding-top:91px; min-width:940px; }
#container_board { position:relative; padding-top:0px; min-width:940px; }
#container_board_2 { position:relative; padding-top:54px; min-width:940px; }
p.s50 { height: 50px; }
p.clr { clear:both; }
p.s60 { height: 60px; }
p.s80 { height: 80px; }
p.s50 { height: 50px; }

.bottom_space { margin-bottom:100px!important; }
.blue { color:blue; }
.red { color:red; }
.white_t { color:white; }
.w70 {height:70px;}
.left { text-align:left; }
.right { text-align:right; }
.half { width:50%!important; }
.top_line { border-top: 1px solid #b8b8b8;} 

/* main image */
#top_img_board { margin-top:54px; }
.top_img_size { position: relative; width: 100%; height: auto; vertical-align: middle; }
#top_img_text { position: absolute; top: 80px; width: 100%; text-align: center; font-family: 'Roboto', sans-serif; }
#top_img_text_2 { position: absolute; top: 20vw; width: 100%; text-align: center; font-family: 'Roboto', sans-serif; }
#top_img_text_3 { position: absolute; top: 54px; height:210px; width: 100%; line-height:210px; text-align: center; background: #f0f; font-size:70px; font-weight:700; }
.title_comment { font-weight: 300; font-size: 2vw; }
.title { font-weight: 900; font-size: 5vw; }
.comment { position: relative; width: 100%; background: #fff; top: 0px; font-style: italic; line-height: 25px; text-align: center; padding: 38px 0px; font-size: 13px; }
.comment_gray { position: relative; width: 100%; height: 72px; background: #f2f3f4; line-height: 72px; text-align: center; font-family: 'Roboto', sans-serif; font-weight: 300; font-size: 13.5px; font-style: italic; }

/* image menu */
#img_menu_2 { position:relative; width:100%; top:0px; background:#212121; height:163px; }
#img_menu_2 ul { width:940px; list-style: none; padding:0px; margin:0 auto; }
#img_menu_2 ul li { width:50%; height:163px; background:#fff; float:left; text-align:center; }
#img_menu_2 ul li.on { background:#fff; }
#img_menu_4 { position:relative; width:100%; top:0px; background:#212121; height:163px; }
#img_menu_4 ul { width:940px; list-style: none; padding:0px; margin:0 auto; }
#img_menu_4 ul li { width:25%; height:163px; background:#fff; float:left; text-align:center; }
#img_menu_4 ul li.on { background:#fff; }
#img_menu_5 { position:relative; width:100%; top:0px; background:#212121; height:163px; }
#img_menu_5 ul { width:940px; list-style: none; padding:0px; margin:0 auto; }
#img_menu_5 ul li { width:20%; height:163px; background:#fff; float:left; text-align:center; }
#img_menu_5 ul li.on { background:#fff; }
.bu_img_2 { width:470px; height:auto; }
.bu_img { width:235px; height:auto; }
.bu_img_5 { width:188px; height:auto; }

/* sun menu */
#sub_menu_2 { width:100%; height:36px; margin:0 auto; padding:0px; background:#212121;}
#sub_menu_2 ul { list-style: none; }
#sub_menu_2 li { float: left; margin: 0; padding: 0; width: 50%; height:36px; line-height:36px; font-family: 'Roboto', sans-serif; font-weight:300; font-size:14px; text-align:center; }
#sub_menu_2 li.on { height:36px; color:#000; text-decoration:none; background:#fff; }
#sub_menu_2 li.on a:link { width:50%; height:36px; color:#fff; text-decoration:none; }
#sub_menu_2 li.on a:active { width:50%; height:36px; color:#fff; text-decoration:none; }
#sub_menu_2 li.on a:visited { width:50%; color:#fff; text-decoration:none; }
#sub_menu_2 li a:link { width:33%; height:36px; color:#fff; text-decoration:none; }
#sub_menu_2 li a:active { width:33%; height:36px; color:#fff; text-decoration:none; }
#sub_menu_2 li a:visited { width:33%; color:#fff; text-decoration:none; }
#sub_menu_2.stick { position: fixed; top: 54px; z-index: 100; }

#sub_menu_3 { width:100%; height:36px; margin:0 auto; padding:0px; background:#212121; }
#sub_menu_3 ul { list-style: none; }
#sub_menu_3 li { float: left; margin: 0; padding: 0; max-width: 33.334%; min-width: 33.333%; width: 33.333%; height:36px; line-height:36px; font-family: 'Roboto', sans-serif; font-weight:300; font-size:14px; text-align:center; }
#sub_menu_3 li.on { height:36px; color:#000; text-decoration:none; background:#fff; }
#sub_menu_3 li.on a:link { width:33%; height:36px; color:#fff; text-decoration:none; }
#sub_menu_3 li.on a:active { width:33%; height:36px; color:#fff; text-decoration:none; }
#sub_menu_3 li.on a:visited { width:33%; color:#fff; text-decoration:none; }
#sub_menu_3 li a:link { width:33%; height:36px; color:#fff; text-decoration:none; }
#sub_menu_3 li a:active { width:33%; height:36px; color:#fff; text-decoration:none; }
#sub_menu_3 li a:visited { width:33%; color:#fff; text-decoration:none; }
#sub_menu.stick { position: fixed; top: 54px; z-index: 100; }

#sub_menu_4 { width:100%; height:36px; margin:0 auto; padding:0px; background:#212121 }
#sub_menu_4 ul { list-style: none; }
#sub_menu_4 li { float: left; margin: 0; padding: 0; width:25%; height:36px; line-height:36px; font-family: 'Work Sans', sans-serif; font-weight:400; font-size:14px; text-align:center; }
#sub_menu_4 li.on { height:36px; color:#000; text-decoration:none; background:#fff; }
#sub_menu_4 li.on a:link {  height:36px; color:#fff; text-decoration:none; }
#sub_menu_4 li.on a:active { height:36px; color:#fff; text-decoration:none; }
#sub_menu_4 li.on a:visited { color:#fff; text-decoration:none; }
#sub_menu_4 li a:link { height:36px; color:#fff; text-decoration:none; }
#sub_menu_4 li a:active { height:36px; color:#fff; text-decoration:none; }
#sub_menu_4 li a:visited { color:#fff; text-decoration:none; }

.sub_hover { background: #fff; color:#212121; }
.revert_hover { background: #212121; color:#fff; border:1px solid #000;	-webkit-border-radius: 3px 3px; -moz-border-radius: 3px 3px;	border-radius: 3px 3px; }

/* content area */
section.gray { position:relative; width:100%; background:#f2f3f5; margin:0px; padding:0px; }
section.white { width:100%; background:#ffffff; margin:0px; padding:0px; }
section.black { width:100%; background:#000000; margin:0px; padding:0px; }
section.p_white { width:100%; background:#ffffff; margin:0px; padding:18px 0px 0px; }
.wrap_box { position:relative; width:940px; margin:0 auto; padding:100px 0px 0px }
.wrap_box_summary { position:relative; width:940px; margin:0 auto; padding:100px 0px; }
.wrap_box_contact { position:relative; width:100%; margin:0 auto; padding:0px; }
.wrap_box_board { position:relative; width:100%; margin:0 auto; padding:0px 0px; }
.wrap_box_board_view { position:relative; width:100%; margin:0 auto; padding:100px 0px; }
.wrap_box_line { position:relative; width:940px; margin:0 auto; padding:100px 0px 0px; border-top:1px solid #000; border-bottom:1px solid #000; }
.wrap_box_contact_line { position:relative; width:100%; margin:0 auto; padding:0px; border-bottom:1px solid #bababa; }

/* Accesoy box */
.hoverbox3 { position: relative;  }
.hoverbox3:after, .hoverbox3:before { position:absolute; opacity:0; transition: all 0.5s; -webkit-transition: all 0.5s; }
.hoverbox3:after { content:'\A'; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,0); }
.hoverbox3:before { content: attr(data-content); width:100%; color:#fff; z-index:1; font-family: 'Roboto', sans-serif; font-weight:900; font-size:1.5vw; text-align:center; top:40%; padding:4px 10px; text-align:center; box-sizing:border-box; -moz-box-sizing:border-box; }
.hoverbox3:hover:after, .hoverbox3:hover:before { opacity:1; }
.acc_title { font-size:50px; line-height:50px; font-weight:900; text-align:center; margin-bottom:30px; }
.acc_summay { font-size:15px; line-height:20px; color:#7d7d7d; text-align:justify; margin-bottom:40px; }
.media_title { font-size:30px; line-height:40px; font-weight:900; text-align:left; margin-bottom:30px; }

/* media box */
.hoverbox2 { position: relative; }
.hoverbox2:after, .hoverbox2:before { position:absolute; opacity:1; transition: all 0.5s; -webkit-transition: all 0.5s; }
.hoverbox2:after { content:'\A'; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,0); }
.hoverbox2:before { content: attr(data-content); width:100%; color:#fff; z-index:1; font-family: 'Roboto', sans-serif; font-weight:900; font-size:2vw; text-align:center; top:40%; padding:4px 10px; text-align:center; box-sizing:border-box; -moz-box-sizing:border-box; }
.hoverbox2:hover:after, .hoverbox2:hover:before { opacity:1; }
.media_background {position: relative; height: 100%; width: 100%; background:#000;}

/* contact layout */
.contact_box2 { width:540px; height:35px; background:#000; line-height:35px; -webkit-border-radius: 3px 3px; -moz-border-radius: 3px 3px;	border-radius: 3px 3px; }
.contactus2 { width:540px; margin:0 auto; padding:0; }
.contactus2 ul { padding:30px 0px; list-style: none; }
.contactus2 ul li { font-family: 'Work Sans', sans-serif; text-align:center; font-size:14px; color:#fff; line-height:20px; }
.contactus2 a:link { color:#fff; text-decoration:none; }
.contactus2 a:active { color:#fff; text-decoration:none; }
.contactus2 a:visited { color:#fff; text-decoration:none; }
.mail_form table { max-width:900px; }
.mail_form tr { height:35px; }
.mail_form th { font-family: 'Work Sans', sans-serif; font-weight:700; font-size:70px; text-align:center; }
.mail_form td { width:510px; }
.mail_subject { width:510px; height:55px;  padding:0px 15px; background:#eeeeee; border:0px; }
.mail_con { width:510px; height:215px; padding:15px; background:#eeeeee; border:0px; font-size:14px; font-family: 'roboto', sans-serif; font-weight:300; color:#555; }
.mail_con input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #444; font-size:14px; font-family: 'roboto'; }
.mailbutton_box { width:100%; height:35px; background:#000; line-height:35px; }
.sendmail { width:100%; margin:0 auto; padding:0; }
.sendmail ul { padding:0px; list-style: none; }
.sendmail ul li { font-family: 'Work Sans', sans-serif; text-align:center; font-size:14px; color:#fff; line-height:20px; width:100%; border:1px solid #000;	-webkit-border-radius: 3px 3px; -moz-border-radius: 3px 3px;	border-radius: 3px 3px; }
.sendmail a:link { color:#fff; text-decoration:none; }
.sendmail a:active { color:#fff; text-decoration:none; }
.sendmail a:visited { color:#fff; text-decoration:none; }
.movie { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; margin-bottom: 1rem; margin-top: 3rem; }
.movie > iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


/* button layout */
.view { position:relative; padding:0px; width:180px; text-decoration:none; height:30px; padding-top:0px; }
.view a:link { width:180px; height:36px; color:#000; text-decoration:none; }
.view a:active { width:180px; height:36px; color:#000; text-decoration:none; }
.view a:visited { width:180px;; color:#000; text-decoration:none; }
.product_down_div { float: left; border: 1px solid #000; width: 136px; height: 36px; line-height: 36px; text-align: center; margin: 0px 0px 0px 5px; font-family: 'Work Sans', sans-serif; font-weight: 500; font-size: 14px; -webkit-border-radius: 2px 2px; -moz-border-radius: 2px 2px; border-radius: 2px 2px; }
.product_hover {background: #212121; color:#000; }


/* Sitemap */
#wrap_sitemap { width:100%; background:#1b1b1b; }
#wrap_sitemap_sub { position:relative; width:940px; margin:0 auto; padding:50px 0px; }
#sitemap { }
#sitemap ul { list-style: none; }
#sitemap li { float: left; margin: 0; padding: 0; color:#c9c9c9; font-family: 'Roboto', sans-serif; font-weight:300; font-size:11.5px; line-height:13px; width:175px; }
#sitemap li a:link { color:#c9c9c9; text-decoration:none; }
#sitemap li a:visited { color:#c9c9c9; text-decoration:none; }
#sitemap li a:active { color:#ffffff; text-decoration:none; }
#sitemap li a:hover { color:#ffffff; text-decoration:none; }
#sitemap li p { margin-bottom:15px; }
.p_stong { font-weight:900; color:#fff; padding-bottom:30px; }
#wrap_sitemap_en { width:100%; background:#1b1b1b; }
#wrap_sitemap_sub_en { position:relative; width:940px; margin:0 auto; padding:50px 0px; }
#sitemap_en { }
#sitemap_en ul { list-style: none; }
#sitemap_en li { float: left; margin: 0; padding: 0; color:#c9c9c9; font-family: 'Roboto', sans-serif; font-weight:300; font-size:11.5px; line-height:13px; width:215px; }
#sitemap_en li a:link { color:#c9c9c9; text-decoration:none; }
#sitemap_en li a:visited { color:#c9c9c9; text-decoration:none; }
#sitemap_en li a:active { color:#ffffff; text-decoration:none; }
#sitemap_en li a:hover { color:#ffffff; text-decoration:none; }
#sitemap_en li p { margin-bottom:15px; }


/* bottom */
#wrap_bottom { position:relative; width:100%; height:94px; background:#000; }
#wrap_bottom_sub { position:relative; width:940px; margin:0 auto; }
#contact_button { margin-top:30px; width:135px; height:35px; border:1px solid #535353; line-height:35px; text-align:center; font-family:'Work Sans', sans-serif; font-weight:500; font-size:14px; display:inline-block; }
#contact_button a:link { color:#535353; text-decoration:none; }
#contact_button a:active { color:#ffffff; text-decoration:none; }
#contact_button a:visited { color:#535353; text-decoration:none; }
#contact_button a:hover { color:#ffffff; text-decoration:none; }
#copyright { display:inline-block; width:635px; height:55px; color:#fff; font-family:'Arial', sans-serif; font-weight:100; font-size:12px; text-align:center; }
.sns { display:inline-block; margin-top:5px; width:34px; line-height:55px; vertical-align:middle; }

/* scroll */
.go-top { display:block; width:40px; height:40px; line-height:40px; text-align:center; font-size:20px; position:fixed; bottom:-40px; right:20px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; background-color:#404040; color:#FFFFFF; text-decoration:none; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; }
.go-top.show { bottom:20px; }
.go-top:hover { background-color:#606060; color:#FFFFFF; }
.wrapper { margin:0; width:100%; text-align:left; }

/* manual */
header.manual { width:100%; height:55px; line-height:55px; background:#7f7f7f; text-align:center; }
section.manual { width:100%; text-align:center;  }
section.manual h1 { margin-top:55px; font-size:50px; font-weight:900; font-family: 'Roboto', sans-serif; color:#cdcdcd; letter-spacing: 4px; }
section.manual p { margin-top:10px; font-size:14px; font-weight:400; font-family: 'Roboto', sans-serif; font-style:italic;  color:#000; letter-spacing: 1px; } 
section.manual > div { display:flex; justify-content: center; margin-top:50px; }
section.manual > div > a { display:inline-block; width:130px; height:130px; line-height:130px; background:#000; border-radius:5px; color:#fff; text-align:center; font-family: 'NanumSquare',sans-serif; text-decoration:none; font-weight:900; font-size:20px; }
section.manual > div > a:first-child { margin-right:10px; }
section.manual > div > a:last-child { margin-left:10px; }