@charset "UTF-8";

/* Page Title */
h2.guide {width:1240px; margin:0 auto;    text-align:Center; margin-top:80px; font-size:35px; font-weight:700; color:#333; border-bottom:1px solid #ddd; padding-bottom:10px; margin-bottom:10px; }


h2.build_tit { text-align:Center;  font-size:32px; font-weight:700; color:#333; margin-bottom:10px;}
h3.build_size { text-align:Center;  font-size:20px; font-weight:500; color:#666; }

#sub {width:100%;  float:left;  position:relative;  box-sizing:border-box; padding-bottom:50px;}
#sub .sub_wrap {width:1200px; margin:0 auto; padding:60px 0 ; box-sizing:border-box; min-width:1240px; }
#sub section.wrap {width:1240px; margin:0 auto; padding:0px; }
/*#sub section.company  {  margin-top:-20px; }*/
#sub  .img_box {width:100%; height:400px; overflow:hidden;}

.sub_con_menu {width:100%; float:left; border-bottom:1px solid #ddd; box-sizing:border-box; margin-bottom:60px;}
.sub_con_menu ul{position:relative; width:1170px; margin:0 auto; text-align:center;}
.sub_con_menu li {position:relative; display:inline-block; vertical-align:top; margin:0 15px}
.sub_con_menu li:last-child {margin-right:0}
.sub_con_menu li a {position:relative; font-weight:300; font-size:18.5px; letter-spacing:0; color:#888; display:block; line-height:100%; height:65px; text-align:center; padding:0 8px; box-sizing:border-box; transition: all 0.3s ease-out; display:flex; justify-content:center; align-items:center; box-sizing:border-box;}
.sub_con_menu li a:after{position:absolute;; display:block; bottom:-1px; left:0; content:""; overflow:hidden; width:0; height:2px; background:#c00; transition: all 0.3s ease-out;}
.sub_con_menu li a:hover{color:#c00; text-decoration: none;  font-weight:600}
.sub_con_menu li a:hover:after{width:100%; transition: all 0.3s ease-out;}

#sub_con_menu_wrap { z-index:999 !important; width:100%; position:relative;  background:#fff; transition: all 0.2s ease-out;}
.mn_on{display:block; color:#c00 !important; font-weight:600 !important; text-decoration: none}
.mn_on:after{width:100% !important; transition: all 0.3s ease-out;}



@font-face {
    font-family: 'Jal_Onuel';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10-21@1.0/Jal_Onuel.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.box_100 {width:100%; float:left;}
div.text h3 {font-size:32px; text-transform:uppercase ; font-weight:800; color:#333; width:100%;  }
div.text h4 {font-size:28px; line-height:1.35em;  font-weight:700; color:#333; width:100%;  }
div.text h5 {font-size:20px;  line-height:1.3em; font-weight:600; color:#333; width:100%;  }
div.text  {font-size:17px; font-weight:400; color:#555; width:100%;  display:inline-block; margin:30px 0; }
div.text b  {font-weight:600 !important; color:#333; }

.text_sm {font-size:16px; color:#666; font-weight:400; line-height:1.3em;}
.text_01 {font-size:17px; color:#555; font-weight:400; line-height:1.4em;}
.text_02 {font-size:18px; color:#444; font-weight:400; line-height:1.45em;}
.text_03 {font-size:20px; color:#333; font-weight:400; line-height:1.5em;}

.span_tit {font-weight:600; color:#333; font-size:18px;}

.color_c00 {color:#c00 !important}
.f_500 {font-weight:500}
.f_600 {font-weight:600; color:#333;}

/*회사소개 company*/
ul.company_ul {width:100%; display:inline-block;  margin-top:20px;}
ul.company_ul li {text-align:Center; width:32.3%; margin-right:1%;box-sizing:border-box; padding:30px 2%; height:210px;  display:inline-block; border:1px solid #ddd; vertical-align:top; font-size:1em}
ul.company_ul li b {font-size:1.25em; color:#333; font-weight:600; width:100%; display:inline-block; margin-bottom:5px;}
ul.company_ul li:last-child {float:right; margin:0;}




/************* sub01 **********************************************************************************************************/
.sub01_visual_wrap {position:relative;width:100%; float:left; height:250px;  box-sizing:border-box;   background:url('/htm/madang/common/img/sub01_vi.png') no-repeat center center;  }
.sub01_visual_wrap .sub01_vi_txt { width:1200px; margin:0 auto; /*background:rgba(255,255,255,0.3); */ box-sizing:border-box; position:absolute; text-shadow:1px 2px rgba(0,0,0,0.3);
top:55%; left:50%; transform: translate(-50%, -50%);color:#fff; z-index:99; text-align:center; }

.sub01_visual_wrap .sub01_vi_txt h1 {font-size:42px; text-align:left;}
.sub01_visual_wrap .sub01_vi_txt p {color:#ddd}

#sub_wrap .sub_con_wrap {width:1200px; margin:0 auto;display:block;}
#sub_wrap .sub_con {width:100%; float:left;  background:#fff; padding:80px 40px;   box-sizing:border-box; }

#sub_wrap .sub01_visual_wrap  {position:relative; overflow: hidden; width:100%; }
#sub_wrap .sub01_visual_wrap ::before{
        content: "";
        background-size: cover;
		background:#333;
        opacity: 1;
        position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        bottom: 0px;
    }

.sub_h2 {font-weight:600; font-size:30px; margin-bottom:30px;}


.company01_icon_wrap{width:80%;  display:flex; margin:0 auto; justify-content: space-between;}
.company01_icon_wrap li{width:30%;float:left; margin-right:3%; float:left; text-align:center;}
.company01_icon_wrap li img{border:3px solid #ddd;  border-radius:30%; padding:50px; box-sizing:border-box; margin-bottom:10px}

.company01_icon_wrap span.no {font-weight:500; font-size:20px; margin-top:15px; display:inline-block; color:#c00}
.company01_icon_wrap span.tit {font-weight:600; font-size:22px; margin-top:2cpx; display:inline-block; color:#000}



/* 연혁 */
.history_ul { width:100%; float:left; margin-top:30px; border-top:1px solid #333;}
.history_ul li ul li:first-child { width:25%; float:left; padding:16px 0; font-size:24px; line-height:1.05em; background:#d0e3b7; border-bottom:1px dashed #ddd;}
.history_ul li ul li:last-child  { width:75%; float:right;   padding:16px 0;font-size:17px; color:#555; border-bottom:1px dashed #ddd; text-align:left; padding-left:30px; box-sizing:border-box;}


/* 동글 이미지 */
.circle_img_ul {width:75%;  display:block; }
.circle_img_ul li{ float:left; width:25%; text-align:center; }
.circle_img_ul li img{ border-radius:50%; }

/* 사각 이미지 */
.ract_img_ul {width:90%;  display:block; }
.ract_img_ul li {width:30%; float:left; margin-right:3.8%;}
.ract_img_ul li img {width:100%; border:1px solid #ddd;   box-sizing:border-box;}
.ract_img_ul li:last-child {margin-right:0;}



/*회사연혁*/
.accordion .tab-label:hover, .accordion input:checked + .tab-label:hover {
    background: #2891ed;
	width:100%;
    color: #fff;
}

/* Accordion styles */
.accordion {
    overflow: hidden;
}

.accordion .tab ~ .tab {
}

.accordion .tab {
    width: 100%;
    overflow: hidden;
}

.accordion .tab-label {
    counter-increment: accordion;
    display: flex;
    ajustify-content: space-between;
    padding: 1em;
    cursor: pointer;
    transition: all 0.3s;
	width:100%;
}

.accordion .tab-label span {
    flex-grow: 1;
	font-size:22px;
	font-weight:600
}

.accordion .tab-label::before {
    /*content: counter(accordion) ".";
    font-weight: bold;
    margin-right: 0.5em;
    color: #1177d1;*/
}

.accordion .tab-label:hover::before {
    color: #000;
}

.accordion .tab-label::after {
    content: "\276F";
    width: 1em;
    height: 1em;
    flex-basis: 3em;
    text-align: center;
    transition: all 0.3s;
}

.accordion .tab-content {
    max-height: 0;
    padding: 0 1em;
    background: #fff;
    transition: all 0.3s;
    overflow: auto;
}

.accordion input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.accordion input:checked + .tab-label {
    background: #1177d1;
    color: #fff;

}

.accordion input:checked + .tab-label::before {
    color: #000;
}

.accordion input:checked + .tab-label::after {
    transform: rotate(90deg);
}

.accordion input:checked ~ .tab-content {
    max-height: 100vh;
    padding: 1em;
}



.news_list{
	list-style:none;
	padding:0;
	margin-top:20px;
}
.news_list li{
	float:left;
	width:32%;
	padding-left:24px;
	padding-bottom:20px;
}

.news_list li:nth-child(1), .news_list li:nth-child(4){
	float:left;
	width:32%;
	padding-left:0;
}

.news_list li .news-background{background:#f9f9f9; box-shadow:1px 2px 5px rgba(0,0,0,0.1); height:600px;}
.news_list li .news-content{padding:30px; box-sizing:border-box; position:relative; }
.news_list li .news-content p{color:#666}

button.b3 {
   display:block;
   width:100%;
   font-weight:500;
   border:solid 1px #ddd;
	border-radius:6px;
	padding:12px 0;
	display:block;
	text-align:center;
	margin-top:20px;
	color: #666;
	background:#fff;
	border-radius: 5px;
	cursor: pointer;
	font-size:16px;
	position: relative;
	z-index: 1;
}


.b3:before {
  content: "";
  width: 0;
  height: 100%;
  position: absolute;
  background-color: #555;
  right: 0;
  top: 0;
  transition: 0.5s;
  z-index: -1;
}
.b3:hover:before {
  width: 100%;
  right: auto;
  left: 0;
}


.b3:hover span{color:#fff;}

.news_list li .news-content h2 a{
	color:#555;
	margin-bottom:10px;
	display:block;
	line-height:1.2em;
	font-size:20px;
}
.news_list li .news-content h2 a:hover{
	color:#333; text-decoration:underline;
}

.news_list li .blog-thumb{
	height:300px;
	background:#fff;
}



/* 페이징 */
.paging_wrap {width:100%; float:left;}
.paging_wrap .arrow_img {border:1px solid #999; padding:4px 8px;}

.paging_wrap .page_num  {margin:0 auto; display:inline-block; text-align:center; }
.paging_wrap .page_num li {float:left; margin:0 6px}
.paging_wrap .page_num li a {font-size:17px; color:#777;}
.paging_wrap .page_num li a:hover {color:#000; font-weight:600; transition:ease-in-out 0.3s}
.paging_wrap .page_num li img { vertical-align:middle;}
.paging_wrap .page_num .ov { color:#000; font-weight:600}
.paging_wrap .page_num .no { color:#999;}

/* 실적 */
.result_ul {width:100%; float:left; }
.result_ul li {width:24%; margin-right:1.3%; float:left;  text-align:center; }
.result_ul li:nth-child(4) {margin-right:0; float:right;}
.result_ul li:nth-child(8) {margin-right:0; float:right;}
.result_ul li div.img_div{ background-size:cover; width:100%; float:left; height:200px;}
.result_ul li p{ display:inline-block;}




/* 수상 */
.award_ul {width:100%; float:left; display:flex; justify-content: flex-start; }
.award_ul li {width:30%; float:left; margin-right:3%; text-align:center; }
.award_ul li div{ background-size:cover; width:100%; float:left;  height:500px; border:1px solid #ddd;}
.award_ul li p{ display:inline-block;}

/* 사업분야 */
.business_img_ul {width:90%; margin:0 auto; display:flex;  justify-content: space-between;}
.business_img_ul li {width:22%; float:left;  text-align:center; }

.business_img_ul2 {width:90%; margin:0 auto; display:flex;  justify-content: space-between;}
.business_img_ul2 li {width:22%; float:left;  text-align:center; }

.business04_img_ul {width:90%; margin:0 auto; display:flex;  justify-content: space-between;}
.business04_img_ul li {width:48%; float:left;  text-align:center;}
.business04_img_ul li img {width:100%;  border:1px solid #ddd; }



.text_box {font-size:17px;font-weight:400; line-height:1.45em; color:#555}
.text_box .t1 {font-size:26px; font-weight:700; line-height:1.35em; color:#444;}
.text_box .t2 {font-size:21px;line-height:1.4em;  font-weight:500; color:#333;}

.text_box span.sign b {font-size:40px; font-weight:400}

table.info_table {width:100%; float:left; }
table.info_table th {background-color:#f5f5f5; text-align:center; text-align:center;  padding:9px; font-size:18px; color:#333; border:1px solid #ddd;}
table.info_table th  span {font-size:16px; color:#666; font-weight:400}
table.info_table td {background-color:#fff; text-align:center; text-align:center;  padding:9px; font-size:16.5px; color:#666; border:1px solid #ddd;}

section#sub_content ul.step {width:100%;  text-align:Center; border:none; margin-bottom:0; margin-top:30px;}
section#sub_content ul.step li {display:inline-block; background-color:#fff; vertical-align:top; box-sizing:border-box; font-size:17px;    line-height:1.5em;color:#666;  border:none ; width:85px}
section#sub_content ul.step li div {  border-radius:10px; width:80px; height:80px; border:2px solid #ddd; margin-bottom:5px; }
section#sub_content ul.step li.ov div {border:2px solid #c00; }
section#sub_content ul.step li.ov span {color:#c00; font-weight:600; }

section#sub_content ul.step li img { margin-top:15px; width:50px;}

.ing_bar {width:90%; margin-left:5%; height:35px; background-color:#f1f1f1;  margin-top:40px; border-radius:50px; float:left; margin-bottom:30px;   text-align:left; }
.ing_bar p span {width:50%; background: linear-gradient(to right, #c00, #dd0000); height:35px; float:left; border-radius:50px; margin-right:20px; color:#fff; letter-spacing:1px;text-align:center; font-size:18px; font-weight:600; line-height:35px;}
.ing_bar img {vertical-align:middle;}

.gall_info {width:100%;  float:left;  box-sizing:border-box; border:0px solid #ddd;}
.gall_info h4 {width:100%; display:inline-block; background-color:#f9f9f9; font-size:18px; text-align:center; line-height:50px; font-weight:600; color:#333; border:1px solid #ddd; box-sizing:border-box;}
.gall_info h4 span {font-size:16px; font-weight:300; color:#666 }
.gall_info  img {max-width:100%;}
.gall_info  div.gall_img_box {width:100%; float:left; box-sizing:border-box; padding:15px;  }
.gall_info  div.gall_img_box img {width:49%; margin:0.5% 0.2%; vertical-align:top}

.gall_info .img_box {width:100%; float:left; box-sizing:border-box; padding:15px;}


.gall_info  div.gall_img_box1 {width:100%; float:left; box-sizing:border-box; padding:15px;  }
.gall_info  div.gall_img_box1 img {width:100%; vertical-align:top; margin:0 0.2%; }


.gall_info  div.gall_img_box2 {width:100%; float:left; box-sizing:border-box; padding:15px;}
.gall_info  div.gall_img_box2 img {width:48%; margin:0 0.2%; }

.gall_info  div.gall_img_box4 {width:100%; float:left; box-sizing:border-box; padding:15px;}
.gall_info  div.gall_img_box4 img {width:24%; margin:0 0.2%; }

.gall_info ul.info {width:92%; float:left; margin:15px 4% 10px 4%;}
.gall_info ul.info li {width:50%; padding-right:20px; box-sizing:border-box; font-size:17px; float:left;}


.gall_info ul.info li dl {width:100%; display:inline-block; }
.gall_info ul.info li dl dt {font-size:1em; width:25%; float:left;  font-weight:600; color:#333;}
.gall_info ul.info li dl dd {font-size:1em; width:75%; float:left; font-weight:400; color:#666;}


.gall_list_type {width:100%; float:left; height:50px; }
.gall_list_type p {width:20%; float:left; font-size:18px;}
.gall_list_type p span {color:#c00; font-weight:500}
.gall_list_type ul {text-align:right; }
.gall_list_type ul li {display:inline-block; padding-left:13px; font-size:17px; }
.gall_list_type ul li.ov a {font-weight:500; color:#c00;}

/*갤러리리스트*/
ul.gall {
	 width:100%; float:left; font-size:0px;
}
ul.gall li {
 	 display:inline-block; vertical-align:top;
	 margin-right:25px; margin-bottom:30px;
}

ul.gall li:nth-child(4) {margin-right:0;}
ul.gall li:nth-child(8) {margin-right:0;}
ul.gall li:nth-child(12) {margin-right:0;}
ul.gall li:nth-child(16) {margin-right:0;}
ul.gall li:nth-child(20) {margin-right:0;}

 ul.gall li .inner {
	position: relative;
	width: 290px;
    margin-left:1px;
 }

ul.gall li .photo {
 	z-index: 1;
	width: 100%;
	height: 187px;
   float:left;
}
ul.gall li .photo img {
	width: 290px;
	height: 187px;
}


ul.gall li .desc {
   position:relative;
	 width:100%;  float:left;
	z-index: 2;
	width: 290px;
 	box-sizing:border-box;
	padding:20px;
 	background-color: white;
	border:1px solid #ddd;
}


ul.gall li .desc  span.label1 {  position:absolute; top:0px; right:15px; }
ul.gall .gall_pic {box-sizing:border-box; background-size:cover; width:100%;  height:190px;}

ul.gall li .desc p.name {
	margin: 0px 0px;
	font-weight: 600;
	font-size: 18px;
	line-height:20px;
}
ul.gall li .desc p.address {
	font-size: 14px;
	line-height:20px;
	color:#777;
    width:100%; float:left; margin-top:7px;
}
ul.gall li .desc p.address2 {
	font-size: 15px;
	line-height:20px; color:#666;
  width:100%; float:left; margin-top:5px;
}

ul.gall li .desc div.bar {
	font-size: 16px;
    color:#666;
	line-height: 27px;
}
 ul.gall li .desc div.bar p {width:130px; height:10px; display:inline-block; margin-right:10px;  margin-top:-3px; border-radius:50px;background-color:#ddd; vertical-align:middle;}
 ul.gall li .desc div.bar p span {width:50%; height:10px; float:left; background-color:#c00; border-radius:50px;}

.gall_search {width:100%; float:left; border:1px solid #ddd; box-sizing:border-box; padding:20px 25px 15px 25px; margin-bottom:30px; }
.gall_search h4 {float:left; width:100%; line-height:35px; font-size:1.1em; font-weight:600; color:#555; margin-bottom:10px; }
.gall_search input {width:200px; float:right; height:35px; border:1px solid #ddd;   margin-top:-5px; padding-left:10px; border-radius:0 !important;  }
.gall_search a {float:right; width:100px; text-align:center; font-size:16px; line-height:35px;background-color:#91bb2d; color:#fff; margin-top:-5px; }

.gall_search .check  {width:100%; float:left; border-top:1px solid #ddd; padding:10px 0; box-sizing:border-box;   }
.gall_search .check b {width:100px;float:left; font-weight:500; color:#ff7e00; font-size:17px;line-height:15px; }
.gall_search .check p { padding-right:25px; float:left; font-size:16px; line-height:15px; color:#666}
.gall_search .check input {height:15px; width:15px; float:left; margin-right:10px;  vertical-align:middle; margin-top:0}

.gall3_box {width:50%; float:left; box-sizing:border-box; padding:20px 50px 10px 50px; font-size:16px; color:#666;}
.gall3_box  div {width:100%; float:left; margin:3px 0; }
.gall3_box  b {font-size:1.05em; color:#333; font-weight:600;  width:20%; float:left; line-height:1.3em}
.gall3_box p {width:80%; float:right; line-height:1.3em}

.map {width:100%; float:left; height:405px}
.map_info {width:300px; height:300px; float:right; margin-top:-400px; background-color:rgba(0,0,0,0.7); position:relative; text-align:center; color:#fff; font-size:16.5px; font-weight:400; box-sizing:border-box; padding-top:60px; margin-right:50px;}
.map_info span.t1 {font-size:1.4em; font-weight:600; line-height:2em}

.col-2 .gall_info ul.info li {width:100% !important; padding-right:0 }


/* 연혁 */
.history_box {width:100%; float:left; background:#f6f6f6; padding:20px 40px; box-sizing:border-box;}
.history_box .year_h3{font-size:30px; font-weight:600; color:#333;  border-right:1px solid #ddd; width:220px; line-height:1em; display:inline-block;}
.history_box p.history_text{width:77%; float:right;font-size:17px; color:#666; display:inline; margin-left:40px; line-height:1.6em; vertical-align:5px;}


/* 게시판 비밀글 비번창 */
.password_div {width:100%; float:Left; background:#f7f7f7; padding:35px 0px; box-sizing:border-box; border:1px solid #ddd;}