/* style */
.fullpage-wrapper {background: #7f9277;}

#header {
    top: 0px;
    position: fixed;
    z-index: 9;
    width: 100%;
    background: transparent;
    transition: 0.3s;
    padding: 17px 10px;
}
.container {width: 1600px;
        padding-right: 0px;
        padding-left: 0px;
        margin-right: auto !important;
        margin-left: auto !important;
        position: relative;
        z-index: 2;
    }
.row {margin: 0px; justify-content: space-evenly;}
.sub_content {
    top: 100px;
    position: relative;
    width: 100%;
    padding-bottom: 99px;
    text-align: justify;
    min-height: 500px;
}

.nav-link {
    display: block;
    padding: .5rem 1rem;
    padding: .5rem 1rem;
    font-weight: bold;
    font-size: 18px;
    color: #1b3520;
}

.lang {
	/*border: 1px solid #585858c2;*/
    padding: 4px 10px;
    vertical-align: middle;
    margin-top: -10px;
	display: inline-block; margin-left:-5px;
	background: #73a37054;
    font-size: 12px;
}
.lang:hover {
	background: #8db08b;
    color: #177710;
}

footer {background:#ffffff; bottom: 10px;  padding-bottom: 20px; position:relative; width: 100%; border-top: 1px solid #dcdcdc;z-index: 2;}
footer li {display:inline-block;margin: 20px 20px 20px 0px;font-size: 14px;vertical-align: top;}
footer li span {padding: 0px 20px; border-right: 1px solid #eeeeee; font-weight: bold;}
footer li span:nth-child(5), footer li span:last-child {border-right: 0px solid #eeeeee;}
footer li p {margin: 20px 0px 0px 0px;}
footer li p span {font-weight: normal; border-right: 0px solid #eeeeee;}



/* main */
#section0 .btn_links{position: relative; z-index: 999999999; bottom: 55px; right: 10px;text-align: right;}
#section0 .btn_links .link_menu {font-size: 16px !important; color: #ffffff; border: 1px solid #ffffff; border-radius: 100px !important; padding:5px 20px;cursor: default;}

#section1 {background: url(../img/img_2.jpg) top center no-repeat;background-size: cover; }
#section2 {background: url(../img/img_3.jpg) top center no-repeat;background-size: cover; }
#section3 {background: url(../img/img_4.jpg) top center no-repeat;background-size: cover; }

#section1 .icon span{font-size:60px;margin-top:5px;}
#section1 .count {font-size: 60px; padding:70px 0px 20px 0px; color: #ffffff;}
#section1 .count::before {content: ""; display: block; width: 20px; height: 1px; border-top: 1px solid #ffffff; margin: auto;}
.icon1 {background:url(../img/main_icon_01.png) top center no-repeat; background-size: 50px;}
.icon2 {background:url(../img/main_icon_02.png) top 25px center no-repeat; background-size: 50px;}
.icon3 {background:url(../img/main_icon_03.png) top 20px center no-repeat; background-size: 50px;}
.icon4 {background:url(../img/main_icon_04.png) top 5px center no-repeat; background-size: 35px;}

#section3 .box {background:url(../img/img_4_icon1.png) top center no-repeat;margin: auto;width: 742px; padding: 50px; margin: 140px auto !important;}
#section3 .center-heading {width: 100%; padding-right: 100px;}
#section3 .center-heading h2  {letter-spacing: -2px; font-size: 2.4rem;}
#section3 h1::before {content: "";display: block; width: 230px;height: 1px;border-top: 1px solid #ffffff; margin: auto;padding: 5px 0px;}
#section3 h1::after {content: "";display: block;width: 230px;height: 1px;border-bottom: 1px solid #ffffff; margin: auto;padding: 5px 0px;
}

#section3 .btn-secondary { color: #3c583a;border: 1px solid #3c583a;border-radius: 100px !important; padding: 0px 60px 0px 40px !important; background: url(../img/ico_right_btn.png) center right 20px no-repeat; font-weight: bold; font-size: 16px !important; margin-top: 110px; }
#section3 .btn-secondary:hover {color: #ffffff;    background: #3c583a url(../img/ico_right_btn_on.png) center right 20px no-repeat;}

.carousel-control-prev-icon, .carousel-control-next-icon {display: none;}

/*subpage*/
.sub_bg{background-image:url('../img/sub_bg.png');background-position:bottom left;background-repeat:no-repeat;color:#fff;height: 440px;
    background-size: cover;}
#container_title {font-size: 34px; margin: 0 auto;font-weight: bold; margin-top: 45px;}
#container_title span {margin: 0 auto 10px; display: block; line-height: 30px; color: #1b3520;}
#ctn_title01, #ctn_title01 a {margin-top: 25px;color: #1b3520;font-size: 14px;}
#ctn_title01 img.icon_home {margin-top: -4px;}

#mysubmenu {list-style:none; font-size:14pt; margin:0; margin-top: -78px; background: #45665494;text-align: center; position: relative;z-index: 99; transition: 0.3s;}
#mysubmenu ul {margin: 0px;}
#mysubmenu .leftmenu_b {line-height:50px; text-align:center;font-size:12pt;font-weight:bold;}
#mysubmenu .leftmenu_s, #mysubmenu .active {font-size: 17px;line-height:35px; margin: 0px 1.3%; display: inline-block;border-top: 2px solid #ffffff00;padding: 10px 0px; color: #ffffff;}
#mysubmenu .leftmenu_s:hover {border-top: 2px solid #ffffff; color: #ffffff;}
#mysubmenu .active {border-top: 2px solid #ffffff; color: #ffffff;}
#mysubmenu a {text-decoration:none;}

.sub_cnt {padding: 80px 15px; background: #ffffff; position: relative; z-index: 2;}
.centent_title {text-align: center; margin-bottom: 40px;font-size: 26px;}
.centent_title h2 {font-size: 24px; }
.centent_title h3 {font-size: 20px; color: #0a6c2a; }
.centent_title h4 {font-size: 23px; color: #0a6c2a; margin-bottom: 20px;}
.centent_title h5 {font-size: 16px;}
.centent_title h6 {font-size: 23px; color: #000000; margin-bottom: 20px;}
.center-line { display: inline-block; width: 70px;height: 1px; border-top: 0px solid #eaeaea; margin: auto;}
.bg_half {background: linear-gradient(to top, #f0ecc2 50%, transparent 50%); padding: 0px 4px;}
.bg_half_1 {background: linear-gradient(to top, #f0ecc2 50%, transparent 50%); padding: 0px 4px;}
.bg-gray2 {background:#f2f2f2; padding: 100px 0px;}
.bg-gray3 {background: url(../img/mn1/mn1_1_bg1.png) top center no-repeat;background-size: cover; padding: 100px 0px;}
.color1 { color: #0a6c2a; }

/* mobile */
@media (max-width: 1650px) {
    .container { max-width: 100% !important; width: 100%; padding-right: 10px; padding-left: 10px;}
}
@media (max-width: 1210px) {
    .mimg {padding: 60px 15px; width:100%; max-width: 800px;}
    .navbar-brand img {max-width: 130px;}
    .navbar > .container li span.logo {font-size: 17px; vertical-align: middle;}
}
@media (max-width: 1023px) {
    #section0 .carousel-item { /*top: -35px;*/ }  
    #section3 .container {padding: 0px 0px; max-width: 100% !important;} 
    #header {top: 0px; padding: 40px 10px 10px 10px;}
    .navbar-brand {top: -30px; position: relative; font-size:25px; font-weight:bold; padding:0px;}
    .navbar-nav li {padding: 10px 0 10px 100px;	}
    #mysubmenu {z-index: 99 !important; }
    .sub_bg {height: 359px;}
    #mysubmenu .leftmenu_s, #mysubmenu .active { margin: 0px 3%; padding: 10px 0px;line-height: 25px;font-size: 12px;}
}
@media (max-width: 1000px) {
    .navbar-brand img {width: 110px;}
}
@media (max-width: 990px) {
    #container_title, #ctn_title01 { top: 80px; position: relative; }
    .navbar-collapse {background: #d1e1d0;}
    .navbar-nav .dropdown-menu {margin: 0px 20px 0px 0px;}
    .navbar-nav .nav-link {padding: 4px 10px; margin-left: -4px;}     
    footer {text-align: center;height: 250px; bottom: 0px;}    
    footer .navbar-nav img {width: 130px;}
    footer li {margin: 20px 10px 0px 10px; display: block;}
    footer li p { margin: 10px 0px 0px 0px;}
    footer li p span { padding: 0px 0px;/*display: block;*/}  
    #top_btn {position: relative; bottom: -20px;}
}
@media (max-width: 901px) {
    .sub_bg {height: 350px;margin-top: 0px;}
    #mysubmenu { margin-top: -21px; font-size: 11pt; letter-spacing: -1px;}
    #section0 .carousel-item, #section0 .icon_img { background-size: cover; min-height:650px; padding: 0px 50px;}        
    #section0 {background: #7f9277 !important;}
    #section0 .btn_links {bottom: 25px;text-align: center;  right: 0px;}
    #section0 .btn_links .link_menu {font-size: 14px !important; margin-bottom: 4px; background-position: bottom left;}    
    #section1 .margin-bottom-60 { margin-bottom: 150px;}
   /* #mysubmenu ul ul {
    margin: 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: scroll;
    width: 150%;
    justify-content: space-around;
}*/
    #tnb_index a {padding: 0 0 0 6px;}
    .carousel-indicators {bottom: 180px;}
    .carousel-caption, .carousel-caption h3.ks4 {font-size: 26px; padding-top: 120px;}
    .fp-section, .fp-tableCell {height: 100% !important;}     
}
@media (max-width: 767px) {   
    .navbar {padding:0px;}
    #navi .toggle-navi {margin-top: -60px;}
    .sub_bg {;margin-top: -48px;background-position: bottom left;}
    #container_title {font-size: 24px;}
    #container_title, #ctn_title01 {top: 130px; position: relative;}
    .mimg {width:100%;}
    .carousel-caption, .carousel-caption p.f20 {font-size: 20px;}
    .fixed-header {right: 0px;}
    #tnb_index, #tnb_index .container, #tnb_index .container .row {margin: 0px 0px; padding: 0px 4px; max-width: 100% !important;}
    #section1 .count {font-size: 50px;}
    .box > .icon > .info > p {margin: 0px 0px; font-size: 13px;}  
    #section3 .center-heading {margin: 0px auto !important;}
    footer li span {padding: 0px 6px; font-size: 12px;}
    footer li span:nth-child(4) {border-right: 0px solid #eeeeee;}
    footer li span:nth-child(5) {display: block; width: 100%; margin: 10px;}
    body {font-size: 13px;}
    .centent_title h2, .centent_title h4 { font-size: 17px;}
    .centent_title h3 { font-size: 16px;}
    .centent_title h5 { font-size: 14px;}
    .row {margin-right: 0px; margin-left: 0px;}
    #bo_cate ul li {    font-size: 13px;}
    #bo_cate a {    padding: 2px 15px;}
}
@media (max-width: 640px) {
    #section0 .btn_links .link_menu {display: block; }
}
@media (max-width: 500px) {
    .carousel-indicators { bottom: 150px; }
    #section3 .center-heading { width: 100%; padding-top: 40px;}
    #section3 .box {background-size: 500px; width: 100%; padding: 20px 20px;padding-right: 50px;margin-left: 0px !important;}
    #section3 .box .f25 {font-size: 20px; margin-bottom: 0px;}
    #section3 .box .f18 { font-size: 14px;}
	#section3 .center-heading h2 {    margin-bottom: 0px;}
    #section3 .btn-secondary {margin-top: 10px;}    
    h2, .h2 { font-size: 2rem; }
    #section3 .box .f16 {font-size: 14px; margin-bottom: 0px;}
    
}
@media (max-width: 450px) {
    .carousel-indicators { bottom: 270px; }
    .navbar > .container li span.logo {font-size: 15px; vertical-align: bottom;}
}
@media (max-width: 301px) {
    .container {width: 100%; min-width: 300px; max-width: 100% !important; }
}


/* 개요 */
.mn1_1 {border: 1px solid #eeeeee; text-align: center; padding: 30px 20px; display: flex; flex-direction: column; flex-wrap: wrap; margin: 10px; flex:0 0 23%; align-content: stretch;}
.mn1_1 li {padding: 10px 0px; }
.mn1_1 li.title {font-size: 18px; font-weight: bold;}
.mn1_1 li.no {font-size: 38px; font-weight: bold; letter-spacing: -2px;}
.client {text-align: center; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; margin: 10px 0px;}
.client li {display:inline-block; border: 1px solid #c9c9c9; margin: 4px; vertical-align: middle; padding: 10px 20px; background: #ffffff;  width: 18%; height: 100px;}
.client li img { max-height: 75px; }

@media (max-width: 1200px) {
    .client li {width: 32%;}
}
@media (max-width: 1050px) {
    .mn1_1 {flex: 0 0 30%; max-width: 33%;}
}
@media (max-width: 680px) {
    .mn1_1 {flex: 0 0 48%; max-width: 48%; padding: 10px 10px; margin: 2px;}    
    .mn1_1 li {letter-spacing: -1px;}
    .mn1_1 li img {height: 65%;}
    .mn1_1 li.title {font-size: 15px;}    
    .mn1_1 li.no {font-size: 30px;}    
    .client li {width: 47%;}
    .client li img { max-width: 100px;}
}

/* 인사말 */
.mn1_2_bg {/*background: url(../img/mn1/mn1_2_bg.png) top center no-repeat; background-size: cover;*/ padding: 80px 50px 0px 50px;}
.mn1_2_title { display: flex; flex-direction: row; align-items: flex-start; background: url(../img/mn1/mn1_2_img02.png) top right -40px no-repeat;  padding: 92px 0px; font-size: 35px; font-weight: bold; line-height: 53px;border-bottom: 1px solid #eeeeee;}
/*.mn1_2 { display: flex; flex-direction: row; align-items: flex-start; background: url(../img/mn1/mn1_2_img01.png) top right 300px no-repeat;  padding: 100px 100px; font-size: 16px; height: 700px; line-height: 28px;}*/
.mn1_2 .item {padding: 30px 0px 60px 0px; font-size: 17px;}

@media (max-width: 1600px) {
    /*.mn1_2 {flex-direction: column; align-items: flex-start; padding: 0px 0px; background: url(../img/mn1/mn1_2_img02.png) top right no-repeat;margin-bottom: 0px;}*/
    /*.mn1_2 .item:nth-child(2) {padding-top: 30px;padding-left: 0px;}*/
}
@media (max-width: 1023px) {    
    .mn1_2_bg {padding: 50px 10px 0px 10px;}
    /*.mn1_2 {background: url(../img/mn1/mn1_2_img02.png) bottom 0px center no-repeat; height: 1150px;}*/
    .mn1_2 .item {width: 100%; font-size: 14px;}
    /*.mn1_2 .item:nth-child(2) {padding-top: 30px;padding-left: 0px;}*/
}
@media (max-width: 950px) {
    .mn1_2_title {background: url(../img/mn1/mn1_2_img02.png) bottom right -150px no-repeat; height: 350px; padding-top: 0px; font-size: 20px; line-height: 30px;} 
}
@media (max-width: 600px) {
    /*.mn1_2 {font-size: 14px; background-size: contain; height: 950px; }*/
    .mn1_2 .item br {display:none;}
}


/* 연혁 */
.mn1_3 {background: url(../img/mn1/mn1_3_bg2.png) top center no-repeat;  padding: 100px 0px 1px 0px; font-size: 16px; line-height: 28px;}
.mn1_3_bg {background:url(../img/mn1/mn1_3_bg1.png) top 200px center no-repeat; background-size: 100%; padding: 80px 50px 0px 50px;}
.mn1_3_bg1 {background:url(../img/mn1/mn1_3_bg3.png) bottom center no-repeat; background-size: 100%; height: 450px;}

.his_w{position: relative; padding-top: 400px;padding-left: 40%; line-height: 1.35; font-size: 16px;}
.his_w .sect{position: relative; padding-bottom: 100px; border-left:  1px solid #7c9e8b;}
.his_w .sect:last-child{padding-bottom: 0;}
.his_w .year{position: absolute; width:230px; left: -230px; font-size: 60px; color: #333; line-height: 1; top:-20px; font-weight: bold;}
.his_w .year:after{position: absolute; right: 0;top:0; width: 30px; height: 30px; background: #7c9e8b; border-radius: 50%; margin-top: 20px; margin-right: -15px; content: ''; z-index: 1}
.his_w .year:before{width: 56px; height: 56px; border:1px solid #7c9e8b; content: ''; border-radius: 50%; right: 0; margin: 0 -28px 0 0; position: absolute; top: 0; display: none;}
.his_w .year .m {display: block;}
.his_w .sect.mb {padding-bottom: 40px;}

.his_w .dep{position: relative; padding-left: 103px;}
.his_w .dep > li{position: relative; padding-left: 100px; margin-top: 1em;}
.his_w .dep > li:first-child{margin-top: 0;}
.his_w .dep .date{position: absolute;left: 0;top:0;color: #333; font-weight: 900;}
.his_w .dep .date:after{content: ''}

.his_w .his-txt{font-size: 38px; font-weight: 700}

.his_w .dep span{display: block;position: relative; padding-left: .7em; margin-top: .5em;}
.his_w .dep span:before{position: absolute;left: 0;top:.63em; left: 0; background: #555; width: 4px; height: 4px; content: ''}
.his_w .dep span:first-child{margin-top: 0;}

.his_w .imgs{margin-top: 30px;}
.his_w .imgs img{display: block;}
.his_w.slash .dep > li{padding-left: 170px;}

.his_w .current .year{font-size: 26px; text-align: right; letter-spacing: -0.03em; left: -130px; width: 130px; padding-right: 30px;}
.his_w .current .sect > li{padding-left: 30px;}


@media (max-width: 1023px) {  
  .mn1_3_bg {padding: 50px 0px 0px 10px;}
  .mn1_3_bg1 {height: 200px;}
  .mn1_3 { background-size: 100%; min-width: 300px;}
  .his_w{padding-left: 10px; padding-top: 35%;}
  .his_w .year{width: auto; left: 0; position: relative;}
  .his_w .year br{display: none;}
  .his_w .year .m{display: inline;}
  .his_w .his-txt{font-size: 30px;}
  .his_w .dep{padding-left: 30px; font-size: 14px;}
  .his_w .year{font-size: 26px; padding-left: 30px; margin-bottom: 15px; display: block;}
  .his_w .year:before{width: 29px; height: 29px; right: auto; margin: 0 0 0 -15px; left: 0}
  .his_w .year:after{width: 15px; height: 15px; right: auto; left: 0; margin: 8px 0 0 -7px;}
  .his_w .sect{padding-bottom: 4rem;}
  .his_w .dep > li {padding-left: 80px;}    
}

/* 경영철학 */
.mn1_4 {display: flex; flex-direction: row; flex-wrap: nowrap;}
.mn1_4 .item {border-right: 2px dotted #cecece; margin-right: 100px; margin-bottom: 100px;}
.mn1_4 .item:nth-child(1) {width: 20%;}
.mn1_4 .item:nth-child(2) {width: 80%; border-right: 0px solid #cecece; margin-right: 0px;}
.mn1_4 .item .title {font-size: 45px; font-weight: bold; }
.mn1_4 .item .sub_title {font-size: 35px; font-weight: bold; margin-left: 0px;}
.mn1_4 .item ul li {padding: 0px 0px 40px 0px; font-size: 16px; display: flex; flex-direction: column;}
.mn1_4 .item ul li span {display: inline-block; min-width: 30px; vertical-align: top; vertical-align: middle; margin-right: 20px;}
.mn1_4 .item ul li span:nth-child(1) { position: relative; top: 20px;}
.mn1_4 .item ul li span:nth-child(2) { padding-left: 100px; margin-top: -35px; font-size: 25px; font-weight: bold; } 
.mn1_4 .item ul li span:nth-child(3) { padding-left: 100px; padding-top: 10px;}    
.mn1_4 .item ul li span strong {border-radius: 50px; background: #eff6ee; padding:20px; color: #599574; font-size: 20px;}

@media (max-width: 1500px) {   
.mn1_4 .item ul li span {margin-bottom: 20px; display: block;}
.mn1_4 .item .sub_title {margin-left: 0px;}
}

@media (max-width: 1100px) {   
.mn1_4 {flex-direction: column; }
.mn1_4 .item {border-bottom: 2px dotted #cecece; margin-right: 10px; margin-bottom: 10px;border-right:none;}
.mn1_4 .item:nth-child(1) { width: auto; width: 100%; text-align: center;padding-bottom: 10px;background: #eaf1e9;}
.mn1_4 .item:nth-child(2) {border-bottom:none; width: 100%;}
.mn1_4 .item ul li span {display: block; margin-bottom: 20px;}
.mn1_4 .item .title { font-size: 30px; font-weight: bold;}
.mn1_4 .item .sub_title {font-size: 18px; text-align: center;}
    .mn1_4 .item ul li span:nth-child(2) {font-size: 20px;}
    .mn1_4 .item ul li span:nth-child(3) {font-size: 14px;}
}

/*오시는길*/
.mn_1_5 .group{border-top: 3px solid #7c9e8b; word-break: keep-all; margin-top: 50px;font-size: 16px;}
.mn_1_5 .group:first-child{margin-top: 0;}
.mn_1_5 .group .l{float: left; position: relative; width: 25%; line-height: 30px;}
.mn_1_5 .group .r{float: right; position: relative;  width: 75%; margin-top: 10px;}
.mn_1_5 .group .r iframe{width: 100%; height: 100%; display: block; position: absolute; left: 0;top:0}
.mn_1_5 .group .l .name{width: 300px; line-height: 30px; background:#7c9e8b; color: #fff; font-size: 1.125em; display: block; text-align: center; margin-top: -1px;}
.mn_1_5 .group .l > *{display: block;}
.mn_1_5 .group .loc{margin: 10px 0px; padding-left: 40px; background-image: url(../img/mn1/location_icon.png); background-repeat: no-repeat;background-position: left center;}
.mn_1_5 .group .tel{padding-left: 40px; background-image: url(../img/mn1/tel_icon.png); background-repeat: no-repeat;background-position: left center;}
.mn_1_5 .group .fax{padding-left: 40px; background-image: url(../img/mn1/fax_icon.png); background-repeat: no-repeat;background-position: left center;}
.mn_1_5 .group .link{font-weight: 500; color: #000; border-radius: 100px; border:1px solid #aeb4bd; width: 176px; height: 47px; line-height: 47px; text-align: center; margin-top: 20px;}
.mn_1_5 .group .link:hover{color: #417257;border: 1px solid #417257;}
.mn_1_5 .root_daum_roughmap {width:100%}

@media (max-width: 950px) { 
    .mn_1_5 .group .l, .mn_1_5 .group .r { width: 100%; }
    .mn_1_5 .group .link { width: 100%; }
    .mn_1_5 .group .l .name, .mn_1_5 .group {font-size: 14px;}
}

    

/* OEM/ODM */
.mn2_1 {/*background: url(../img/mn2_1_bg.jpg) center bottom no-repeat;*/ padding-bottom: 140px;}
.mn2_1 .arti1 ul{display: flex; text-align: center;}
.mn2_1 .arti1 ul li{width: 15.53%; margin-right: 12.62%; }
.mn2_1 .arti1 ul li:last-child{margin-right: 0;}
.mn2_1 .arti1 ul li figure{position: relative; margin-bottom: 15px; }
.mn2_1 .arti1 ul li figure:after{position: absolute; content:''; width: 54px; height: 42px; background: url(../img/mn2/icon_step_1.png) center no-repeat; right: -49%; top: 50%; margin-top: -10px;}
.mn2_1 .arti1 ul li:nth-child(1) figure img {transform: rotate(0deg);}
.mn2_1 .arti1 ul li:nth-child(2) figure img {transform: rotate(28deg);}
.mn2_1 .arti1 ul li:nth-child(3) figure img {transform: rotate(56deg);}
.mn2_1 .arti1 ul li:nth-child(4) figure img {transform: rotate(85deg);}
.mn2_1 .arti1 ul.rev li:nth-child(1) figure img {transform: rotate(174deg);}
.mn2_1 .arti1 ul.rev li:nth-child(2) figure img {transform: rotate(200deg);}
.mn2_1 .arti1 ul.rev li:nth-child(3) figure img {transform: rotate(230deg);}
.mn2_1 .arti1 ul.rev li:nth-child(4) figure img {transform: rotate(273deg);}
.mn2_1 .arti1 ul li .icon_1 {width: 70px; height: 0px; /*background: url(../img/mn2/icon_1.png) center no-repeat;*/ position: relative; top:-49%; left: 34%;}
.mn2_1 .arti1 ul li span{font-size: 16px; line-height: 1; color: #3d895e; font-weight: 700;}
.mn2_1 .arti1 ul li p{font-size: 20px; color: #333; line-height: 1;}
.mn2_1 .arti1 ul.origin li:last-child figure:after{transform:rotate(90deg); right: auto; left: 50%; margin-left: -15px; bottom:-64%; top: auto; margin-top: 0;}
.mn2_1 .arti1 ul.rev{padding-top: 75px; flex-direction: row-reverse;}
.mn2_1 .arti1 ul.rev li:first-child{margin-right: 0;}
.mn2_1 .arti1 ul.rev li:last-child{margin-right: 12.62%;}
.mn2_1 .arti1 ul.rev li figure:after{transform:rotate(180deg)}
.mn2_1 .arti1 ul.rev li:first-child figure:after{display: none;}

@media (max-width:1600px){
	.mn2_1 .arti_wrap:before{right: 0; bottom: -90px;}
	.mn2_1 .arti_wrap:after{right: -40px; bottom: -120px;}
	.mn2_1 .arti1{background-size: auto; background-position: 130% top; }
	.mn2_1 .arti2{margin-top: 150px;}
}

@media (max-width:1400px){
    .mn2_1 img {width:100%; }	
    .mn2_1 .arti1 ul.origin li:last-child figure:after {bottom: -127px;}
}

@media (max-width:1320px){
	.mn2_1 {box-sizing: border-box; padding: 0 20px;}
	.mn2_1 .arti_wrap .tbx{box-sizing: border-box; padding-left: 20px;}
	.mn2_1 .arti_wrap:before{right: 30px;}
	.mn2_1 .arti_wrap:after{right: 0;}	
    .mn2_1 .arti1 ul li .icon_1 {top: -56%; left: 30%;}
}


@media (max-width:1024px){
	.mn2_1 {margin-top: 0 !important;}
    .mn2_1 .arti1 ul.origin li:last-child figure:after {bottom:-130px;}
    .mn2_1 .arti1 ul li .icon_1 {top: -54%; left: 23%;}
    .mn2_1 img {max-width: 55px;}
    .mn2_1 .arti1 ul li figure img {max-width: 100%;}
    .mn2_1 .arti1 ul li p {font-size: 16px;}
}
@media (max-width:700px){
    .mn2_1 .arti1 ul li { width: 18.53%; margin-right: 9.62%;}
    .mn2_1 img { max-width: 35px; }
    .mn2_1 .arti1 ul li .icon_1 { top: -46%; left: 15%;}
    .mn2_1 .arti1 ul li figure:after { background-size: 65%; right: -60%; top: 37%;}
    .mn2_1 .arti1 ul.rev {padding-top: 50px;}
}
@media (max-width:560px){
    .mn2_1 .arti1 ul, .mn2_1 .arti1 ul.rev {flex-direction: column; align-items: center;}
    .mn2_1 .arti1 ul li figure:after, .mn2_1 .arti1 ul.rev li figure:after {transform: rotate(90deg);}
    .mn2_1 .arti1 ul li {width: 50%;min-width: 200px;margin-right: 0%;}
    .mn2_1 .arti1 ul li figure:after { background-size: 100%; right: 70px; top:200px;}
    .mn2_1 .arti1 .tbx {position: relative; top: -125px; left:0px;}
    .mn2_1 img { max-width: 65px;}
    .mn2_1 .arti1 ul li .icon_1 {top: -174px; left: 71px; display: none;}
    .mn2_1 .arti1 ul li figure img { max-width: 180px; width: 180px;}
    .mn2_1 .arti1 ul.origin li:last-child figure:after {bottom: -65px; left: 93px;}
    .mn2_1 .arti1 ul.rev {padding-top: 0px; }
    .mn2_1 .arti1 ul.rev li figure:after { top: -43px;}
    .mn2_1 .arti1 ul.rev li:last-child {margin-right: 0%;}
}

/*가발약품*/
#mn2_3 { list-style:none; margin:0; padding:0; overflow: hidden; }
#mn2_3 > li{position: relative; float: left; background: #efefef; width: 23.93%; margin-right: 1.41%; margin-bottom: 20px; display: flex; align-items:center; cursor: pointer;border: 1px solid #eeeeee;}
#mn2_3 > li > span{width: 100%; text-align: center; overflow: hidden; max-height:350px;}
#mn2_3 > li > span img { width: 100%; height: 100%;}
#mn2_3 > li:nth-child(4n+4){margin-right: 0; }
#mn2_3 > li:nth-child(4n+1){clear: both;}
#mn2_3 > li .tbx{position: absolute; left: 15px; top: 15px; width: calc(100% - 30px); height: calc(100% - 30px); background: #fff; display: flex; align-items:center; box-sizing: border-box; padding-top: 8px; transition:.4s; transform:scale(.8); opacity: 0;}
#mn2_3 > li .tbx .cnt{text-align: center; width: 100%;}
#mn2_3 > li .tbx .cnt h3{font-size: 24px; line-height: 1; color: #000; font-weight: 400; letter-spacing: -0.02em !important; margin-bottom: 13px;}
#mn2_3 > li .tbx .cnt .content_box{padding-left: 4px; position: relative; font-size:18px; line-height: 26px; color: #666; letter-spacing: -0.02em; max-height:80px; padding-bottom: 20px; overflow: hidden;}
#mn2_3 > li .tbx .cnt span{padding-left: 4px; position: relative; z-index: 105;	}
#mn2_3 > li img{width: auto;}
#mn2_3 > li:hover .tbx{transform:scale(1); opacity: 1;}
#mn2_3 > li > img{max-width:300px;  width: auto !important; }

@media (max-width:1024px){
    #mn2_3 > li {width: 31.8%;}
    #mn2_3 > li:nth-child(4n+1) { clear: none;}
    #mn2_3 > li .tbx .cnt h3 {font-size: 16px;}
    #mn2_3 > li .tbx .cnt .content_box {font-size:14px;}
    #mn2_3 > li:hover .tbx {transform: scale(1.1); opacity: 1;}
}
@media (max-width:540px){
    #mn2_3 > li {width: 48.5%;}
    #mn2_3 > li .tbx .cnt h3 {font-size: 14px;}
    #mn2_3 > li .tbx .cnt .content_box {font-size:12px;}
}

/*제조시설*/
.mn3_3 {margin-bottom: 85px; text-align: center;}
.mn3_3 .box {display:inline-block;  width: 55%; vertical-align: top; padding:0px 60px;}
.mn3_3 .mn3_3_img img {width: 100%; height: 465px;}
.mn3_3_right {width:40% !important; padding:0 30px !important; background: #f5f5f5; height: 465px;}
.mn3_3_right .title {color: #fff; font-weight: bold; font-size: 18px; background: #869e7a; padding: 10px 20px; border-radius: 50px; text-align: center; width: 100%; margin: -30px auto 30px auto;}
.mn3_3_right .title:before {content:none;}
.mn3_3_right li {line-height: 23px; font-size: 15px; text-align: left;}
.mn3_3_right li:before {content: '-'; padding-right: 10px;}

@media (max-width:1300px){
    .mn3_3 .box {padding:0px 10px;}
    .mn3_3_right { width: 44% !important; }
}
@media (max-width:1024px){
    .mn3_3 .mn3_3_img img, .mn3_3_right {height:350px; padding: 0 20px !important;}
    .mn3_3_right li {line-height: 24px; font-size: 14px;}
    .mn3_3_right .title { font-weight: normal; font-size: 16px; width: 100%;}
}
@media (max-width:850px){
    .mn3_3 .box, .mn3_3_right {width:95% !important;     margin-bottom: 50px;}
    .mn3_3 .mn3_3_img img {padding: 0 0px !important; height: auto;}
    .mn3_3 { margin-bottom: 40px;}
}

/*문의하기*/
.article_wrap { margin-bottom: 30px; margin-top: 30px;  position: relative; background: #f3f3f3; padding: 30px; }
.article_wrap label {    margin-bottom: 0px;}
.clause_text {
    overflow-y: auto;
    width: 100%;
    height: 180px;
    margin-bottom: 10px;
    padding: 10px;
    box-sizing: border-box;
    border: 1px solid #e6e6e6;
    background: #ffffff;
}

.clause_text ol.ol_st01 {padding-left: 10px; padding-top: 10px;}
.ol_st01 li {
    line-height: 1.8em;
    list-style-type: decimal;
    margin-left: 10px;
}

.table_wrap h4.table_h4 {
    margin-bottom: 5px;
}

.table_infor {
    margin-bottom: 10px;
    float: right;
}

.font_red {
    color: #e3280a;
}

@media (max-width:1024px){
    .article_wrap {padding: 15px;}
}

/* css 애니메이션 */
.anibubble {width: 94%; margin-top: -1000px; position: absolute;}
.icon_img {background:url(../img/img_1_icon1.png) top right no-repeat; background-size: 78px;  position: absolute;z-index: 1; width: 78px; height: 81px;}
.icon_img1 {background:url(../img/img_1_icon3.png) bottom right no-repeat; background-size: 70%;position: absolute;z-index: 1; width: 200px; height:100%; left: 25%;}

.ic_ani {
  opacity: 1;
  animation: spinner4 7s linear infinite;
  transform: translateY(100%);      
}

@keyframes spinner4 {
    to {
      transform:  translateY(-120%);
      opacity: 0; 
    }
}

.ic_ani_1 {
        position: relative;
        animation: fadeInUp 3s linear infinite;
        margin-top: -200px;   
    }

 @keyframes fadeInUp {
        0% {
            opacity: 1;
            transform: translate3d(0, 100%, 0);
        }
        to {
            opacity: 0;
            transform:  translateZ(-120%); 
        }
    }
 
.one, .two, .three, .four, .five {
  animation: bubble 2s linear infinite;  animation-fill-mode: forwards;
    background: url(../img/img_1_icon3.png) center right no-repeat; background-size: 100%;
    position: absolute;  z-index: 1; width: 175px; height: 178px; }

.one {
  right: 5%; top:400px; animation: bubble 2s linear infinite;
}

.two {
  right: 40%; top:600px; animation: fadeInUp 1s linear infinite; width: 100px;
}

.three {
  right: 70%; top:300px; width: 80px;
}

.four {
  right: 60%; top:500px; width: 60px;
}

.five {
  right: 20%; top:700px; width: 60px;
}

@keyframes bubble {
  from {
    transform: translate3d(0, 100%, 0);opacity: 1;
  }
  to {
    transform:  translateZ(0); opacity: 0;
  }
}