@charset "utf-8";

/*-----------------------공통-----------------------*/
html { width:100%; -webkit-text-size-adjust:none; -moz-text-size-adjust: none; -ms-text-size-adjust:none; overflow-y:scroll; overflow-x:hidden; word-break:break-all;}
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video
{ font-family: 'Noto Sans SC', sans-serif; font-size:16px; color:#000; font-weight:400; line-height:1.7; margin:0; padding:0; border:0; outline:0; vertical-align:baseline; list-style:none; -webkit-text-size-adjust:none;}

html, body { height:100% !important;}

a {text-decoration:none;color:#000;-webkit-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;-moz-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;-ms-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;-o-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;outline:none;}
a:hover, a:focus {text-decoration:none !important;}

h1 { font-weight:700;}
h2 { font-weight:600;}
h3 { font-weight:500;}
p { word-break:break-all; font-weight:100;}
img { height:auto; max-width:100%; vertical-align:middle;}
.text_center { text-align:center;}

.clear20 { clear:both; height:20px;}
.clear40 { clear:both; height:40px;}
.clear60 { clear:both; height:60px;}
.clear80 { clear:both; height:80px;}
.clear_line { clear:both; height:80px; margin-bottom:40px; border-bottom:#ccc dashed 1px;}
/*드래그*/
::-moz-selection { background:#af8919; color:#fff;}
::selection { background:#af8919; color:#fff;}
/*드래그*/

/*스크롤*/
::-webkit-scrollbar { width:8px; height:4px;}
::-webkit-scrollbar-track { background:#fff;}
::-webkit-scrollbar-thumb { background:#af8919;}
/*스크롤*/

.wrap { max-width:1600px; width:100%; padding:0 20px; margin:0 auto; position:relative;}
.container { max-width:1200px; width:100%; position:relative; margin:0 auto; padding:0 20px;}

#top_btn {position:fixed; bottom:20px; right:20px; width:45px; height:45px; border:1px solid #888; text-align:center; z-index:90; background:rgba(0,0,0,0.3); -webkit-transition: 0.5s; -moz-transition: 0.5s; transition: 0.5s;}
#top_btn img { position:relative; top:-3px;}
#top_btn:hover {border-color:#af8919; background:#af8919;}

.footer { vertical-align: top; width:100%; background:#fff; padding:60px 0; border-top:#ccc solid 1px;}
.footer_ul { padding-left:300px; position:relative;}
.footer_ul img { position:absolute; width:220px; left:0;}
.footer_ul li { font-size:16px; color:#444; margin-bottom:5px;}
.footer_copy { font-size:15px; color:#999;}
.footer_copy a { font-size:15px; color:#999;}
.footer_right { position:absolute; right:0; top:0; max-width:330px;}
.footer_right a { padding:10px 20px; background:#af8919; font-size:15px; color:#fff;}

.section_box { position:relative; padding:100px 0;}
.gray_box { background:#f7f6f2;}
/*-----공통----*/




/*-----메인----*/
.main_title h3 { font-size:35px; line-height:1.3; margin-bottom:20px;}

.main_sol { display:flex; justify-content:space-between; align-items:stretch; gap:20px; text-align:center;}
.main_sol li { flex:1;}
.main_sol li .main_sol_box { padding:30px 20px; box-sizing:border-box; height:100%; border:#ccc solid 1px;}
.main_sol li .main_sol_box h2 { margin:10px 0; font-size:20px;}

.main_com { position:relative; margin-bottom:60px;}
.main_com .main_com_img { position:absolute; width:45%;}
.main_com .main_title { margin-left:50%;}

.main_sol02 { display:flex; justify-content:space-between; align-items:stretch; gap:20px; text-align:center;}
.main_sol02 li { flex:1;}
.main_sol02 li .main_sol02_box { position:relative;}
.main_sol02 li .main_sol02_box h2 { position:absolute; left:0; bottom:0; opacity:0; width:100%; text-align:center; font-size:20px; color:#fff; transition:all 0.6s ease;}
.main_sol02 li .main_sol02_box:hover h2 { bottom:20px; opacity:1;}

.main_board { font-size:0; margin:0 -10px;}
.main_board > li { display:inline-block; vertical-align:top; width:50%;}
.main_board > li .main_board_box { padding:40px 30px; background:#fff; margin:0 10px;}
/*-----메인----*/




/*-----서브----*/
.section_sub { position:relative; padding:50px 0 100px 0;}

.sub_top { padding:160px 0; text-align:center; position:relative;}
.sub_top h2 { font-size:50px; line-height:1.3; color:#fff; text-transform:uppercase;}
.sub_top p { position:absolute; right:0; bottom:20px; color:rgba(255,255,255,0.75); line-height:1.5; text-transform:uppercase;}
.sub_top p .nav_dot { color:rgba(255,255,255,0.75); margin:0 10px;}
.sub_top p .nav_color { color:rgba(255,255,255,1); line-height:1.5; font-weight:600; text-transform:uppercase;}

.sub_top_img01 { background:url(/chn/img/sub/sub_top_img01.jpg) center center no-repeat; background-size:cover;}
.sub_top_img02 { background:url(/chn/img/sub/sub_top_img02.jpg) center center no-repeat; background-size:cover;}
.sub_top_img03 { background:url(/chn/img/sub/sub_top_img03.jpg) center center no-repeat; background-size:cover;}
.sub_top_img04 { background:url(/chn/img/sub/sub_top_img04.jpg) center center no-repeat; background-size:cover;}

.sub_nav { margin:40px 0;}
.sub_nav li { display:inline-block; vertical-align:top;}
.sub_nav li a { display:block; padding:12px 25px; color:#999; border-radius:50px; margin:5px;}
.sub_nav li a:hover { background:#af8919; color:#fff;}
.sub_nav li .nav_on { background:#af8919; color:#fff;}

.sol_top { margin-bottom:60px; padding:60px 30px; border:#ccc solid 1px; border-radius:10px; background:#fafafa;}
.sol_top h1 { font-size:24px; line-height:1.3; margin-bottom:10px;}

.sub_title01 { font-size:30px; color:#af8919; margin-bottom:20px;}
.sub_title02 { font-size:22px; line-height:1.3; margin-bottom:10px; color:#777;}

.sol_ul01 { font-size:0; margin-bottom:20px;}
.sol_ul01 li { display:inline-block; vertical-align:top; width:50%;}
.sol_ul01 li:first-child img { border:#ccc solid 1px;}
.sol_ul01 li .sol_ul01_text { margin-left:60px;}

.sol01_bottom { margin-top:40px; font-size:0;}
.sol01_bottom > li { display:inline-block; vertical-align:top; width:50%;}
.sol01_bottom > li ul { font-size:0; padding-right:60px;}
.sol01_bottom > li ul li { display:inline-block; vertical-align:top; width:50%; text-align:center;}
.sol01_bottom > li:last-child img { width:49%;}

.sol02_bg { background:url(/chn/img/sub/sol02_bg.jpg) center center no-repeat; background-size:cover; margin:60px 0; text-align:center;}
.sol02_bg h1 { padding:120px 20px; font-size:50px; line-height:1.3; color:rgba(255,255,255,0.5);}

.img_line { padding:40px; background:#fff; border:#ccc solid 1px;}

.sol03_bottom { margin-bottom:20px;}
.sol03_bottom li { display:inline-block; vertical-align:top; margin:0 20px 10px 0; padding:20px; background:#fff; border:#ccc solid 1px; text-align:center;}

.sol_ul02 { font-size:0;}
.sol_ul02 > li { display:inline-block; vertical-align:top;}
.sol_ul02 > li:first-child { width:40%;}
.sol_ul02 > li:last-child { width:60%;}
.sol_ul02 li ul { margin-left:40px; font-size:0;}
.sol_ul02 li ul li { display:inline-block; vertical-align:top; width:46%; text-align:center; margin:0 2% 10px 2%;}
.sol_ul02 li ul li img { max-width:220px; width:100%; height:auto;}
.sol_ul02 li ul li h2 { color:#777; line-height:1.3; margin-top:5px;}

.sol05_bottom { font-size:0; margin:0 -1%;}
.sol05_bottom li { display:inline-block; vertical-align:top; width:48%; text-align:center; margin:10px 1%; padding:20px; background:#fff; border:#ddd solid 1px;}
.sol05_bottom li p { margin-top:10px;}

.com01_top { position:relative; margin-bottom:60px;}
.com01_top .com01_top_img { position:absolute; width:400px; top:0; left:0;}
.com01_top .com01_top_text { margin-left:450px;}

/* 연혁 */
.timeline { position:relative;}

.timeline-item {
  padding-left: 30px;
  padding-bottom: 80px;
  position: relative;
}
.timeline-item:last-child {
  padding-bottom: auto;
}
.timeline-info {
  color:#444;
  font-size:30px;
  font-weight:800;
  margin-bottom:20px;
  white-space: nowrap;
  position:relative;
  top:10px;
}
.timeline-centered .timeline-content { position:relative; top:0;}
.timeline-centered .timeline-content span {
  font-size:15px;
  line-height:0;
  margin-right:5px;
  color:#777;
}
.timeline-centered .timeline-content li {
  font-size:15px;
  margin-bottom:10px;
  line-height:1.5;
}

.timeline-marker {
  position: absolute;
  top: 25px;
  bottom: 0;
  left: 0;
  width: 10px;
}
.timeline-marker:before {
  background: #af8919;
  border: 1px solid transparent;
  border-radius: 100%;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  position: absolute;
  top: 5px;
  left: 2px;
  transition: background 0.3s ease-in-out, border 0.3s ease-in-out;
}
.timeline-marker:after {
  content: "";
  width: 2px;
  background: #777;
  display: block;
  position: absolute;
  top: 20px;
  bottom: 0;
  left: 6px;
}
.timeline-marker-last:after {
  background:none;
}
.timeline-item:not(.period):hover .timeline-marker:before {
  background: transparent;
  border: 1px solid #af8919;
}
@media screen and (min-width:991px){  
  .timeline-centered,
  .timeline-centered .timeline-item,
  .timeline-centered .timeline-info,
  .timeline-centered .timeline-marker,
  .timeline-centered .timeline-content {
    display: block;
    margin: 0;
    padding: 0;
  }
  .timeline-info {
    font-size:40px;
	top:0;
  }
  .timeline-centered .timeline-item {
    padding-bottom: 80px;
    overflow: hidden;
  }
  .timeline-centered .timeline-item:last-child {
    padding-bottom: auto;
  }
  .timeline-centered .timeline-marker {
    position: absolute;
    left: 50%;
    margin-left: -7.5px;
  }
  .timeline-centered .timeline-info,
  .timeline-centered .timeline-content {
    width: 50%;
  }
  .timeline-centered .timeline-content {
    top:25px;
	margin:0 -20px;
  }
  .timeline-centered > .timeline-item:nth-child(odd) .timeline-info {
    float: left;
    text-align: right;
    padding-right: 30px;margin-left:-20px;
  }
  .timeline-centered > .timeline-item:nth-child(odd) .timeline-content {
    float: right;
    text-align: left;
    padding-left: 30px;margin-left:0;
  }
  .timeline-centered > .timeline-item:nth-child(even) .timeline-info {
    float: right;
    text-align: left;
    padding-left: 30px;margin-right:-20px;
  }
  .timeline-centered > .timeline-item:nth-child(even) .timeline-content {
    float: left;
    text-align: right;
    padding-right: 30px;margin-right:0;
  }
  .timeline-centered > .timeline-item.period .timeline-content {
    float: none;
    padding: 0;
    width: 100%;
    text-align: center;
  }
  .timeline-centered .period .timeline-marker:after {
    height: 10px;
    bottom: 0;
    top: auto;
  }
}
/* 연혁 */

.com02_bottom {}
.com02_bottom li { display:inline-block; vertical-align:top; width:210px; margin:5px;}
.com02_bottom li img { border:#ccc solid 1px;}

.com03_ul01 { font-size:0; margin:0 -10px;}
.com03_ul01 li { display:inline-block; vertical-align:top; width:25%;}
.com03_ul01 li .com03_ul01_box { color:#fff; margin:10px; padding:20px; height:500px; display:flex; flex-direction:column; justify-content:center; align-items:center;}
.com03_ul01 li:nth-child(1) .com03_ul01_box { background:url(/chn/img/sub/com03_bg01.jpg) center center no-repeat; background-size:cover;}
.com03_ul01 li:nth-child(2) .com03_ul01_box { background:url(/chn/img/sub/com03_bg02.jpg) center center no-repeat; background-size:cover;}
.com03_ul01 li:nth-child(3) .com03_ul01_box { background:url(/chn/img/sub/com03_bg03.jpg) center center no-repeat; background-size:cover;}
.com03_ul01 li:nth-child(4) .com03_ul01_box { background:url(/chn/img/sub/com03_bg04.jpg) center center no-repeat; background-size:cover;}
.com03_ul01 li .com03_ul01_box h1 { margin:10px 0; font-size:24px; color:#eee;}

.com03_ul02 { font-size:0; margin:0 -10px;}
.com03_ul02 li { display:inline-block; vertical-align:top; width:33.33%;}
.com03_ul02 li .com03_ul02_box { margin:10px; padding:40px; background:#fff; border:#ddd solid 1px; min-height:350px;}
.com03_ul02 li .com03_ul02_box img { width:70px;}
.com03_ul02 li .com03_ul02_box h1 { margin:10px 0; font-size:20px; color:#777;}


.ir_box { padding:40px; border:#ddd solid 1px; background:#fafafa; height:800px; overflow:hidden; overflow-y:auto;}
.ir_box h1 { margin:40px 0 10px 0; font-size:20px; text-align:center;}
.ir_box h3 { margin:10px 0 5px 0; color:#777;}
.ir_box p { text-align:center;}



.pro_table01 {}
.pro_table01 table { width:100%; border-spacing:0; border-collapse:collapse; border-bottom:#aaa solid 1px; border-top:#aaa solid 1px;}
.pro_table01 table td { border:#ccc solid 1px; padding:8px 15px; vertical-align:middle;}
.pro_table01 table .table_title01 { background:#ddd;}

@media screen and (max-width:991px){
	.com03_ul01 li { width:50%;}
	.com03_ul01 li .com03_ul01_box { height:400px;}

	.com03_ul02 li { width:50%;}

	.sol05_bottom li { padding:10px;}
}
@media screen and (max-width:767px){
	html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video
	{ font-size:15px;}
	
	.footer_ul { padding-left:0;}
	.footer_ul img { position:relative; margin-bottom:15px;}
	.footer_ul li { margin-bottom:0;}
	.footer_copy { margin-top:10px;}
	.footer_right { position:relative; left:0; max-width:100%; margin-top:25px;}
	
	.section_box { padding:60px 0;}
	
	.main_title h3 { font-size:28px;}
	
	.main_sol { display:block; gap:0;}
	.main_sol li .main_sol_box { margin-bottom:10px;}
	
	.main_com .main_com_img { position:relative; width:100%;}
	.main_com .main_title { margin-left:0; margin-top:20px;}
	
	.main_sol02 { display:block; gap:0;}
	.main_sol02 li .main_sol02_box { margin-bottom:10px;}

	.main_board { margin:0;}
	.main_board > li { width:100%;}
	.main_board > li .main_board_box { margin:10px 0;}

	.section_sub { padding:30px 0 60px 0;}
	
	.sub_top { padding:120px 0;}
	.sub_top h2 { font-size:35px;}
	.sub_top p { position:relative; margin-top:40px;}
	
	.sub_nav { margin:20px 0;}
	.sub_nav li a { padding:10px 20px;}
	
	.sub_title01 { font-size:26px;}
	.sub_title02 { font-size:18px;}
	
	.sol_ul01 li { width:100%;}
	.sol_ul01 li .sol_ul01_text { margin-left:0; margin-top:20px;}
	
	.sol01_bottom > li { width:100%;}
	.sol01_bottom > li ul { padding-right:0; margin-bottom:20px;}
	
	.sol02_bg h1 { padding:80px 20px; font-size:30px;}
	
	.sol_ul02 > li:first-child { width:100%;}
	.sol_ul02 > li:last-child { width:100%;}
	.sol_ul02 li ul { margin-left:0; margin-top:20px;}
	
	.sol05_bottom li { width:100%; margin:5px 1%;}

	.com01_top .com01_top_img { position:relative; width:400px;}
	.com01_top .com01_top_text { margin-left:0;}
	
	
	.com03_ul01 li { width:100%;}
	.com03_ul01 li .com03_ul01_box { padding:60px 20px; height:auto;}
	.com03_ul01 li .com03_ul01_box h1 { font-size:20px;}

	.com03_ul02 li { width:100%;}
	.com03_ul02 li .com03_ul02_box { min-height:auto;}
	.com03_ul02 li .com03_ul02_box h1 { font-size:17px;}
	
	
	
	
	.ir_box { padding:20px;}
}