@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;700&display=swap');

@font-face {
  font-family: 'NanumPen';
    src: url('../font/NanumPen.ttf') format('truetype'),url('../font/NanumPen.eot') format('embedded-opentype');
	}





/*font-family: 'Noto Sans KR', sans-serif;*/
header {height: 88px; width: 100%;background-color:rgba(99,8,8,0.82);font-family: 'Noto Sans KR', sans-serif;position: absolute; top: 0; left: 0; z-index: 99;}
#gnb {width: 1200px;margin:0 auto;height: 88px;position: relative; }
header > div {border-bottom:1px solid rgba(255,255,255,0.1);}


#gnb > ul > li > a {text-decoration: none; color:white;padding-top: 35px;display: inline-block;padding-bottom: 37px;position: relative;font-family: 'Noto Sans KR', sans-serif;}
#gnb > ul > li {float: left; height: 100%; margin-right: 72px;}
#gnb > ul {overflow: hidden; margin-left: 240px;height: 100%;}
#gnb > * {float: left;}
#gnb > #logo_main {display: inline-block; margin-top: 20px;}

#gnb > ul > li > a > div {width: 100%; height: 4px; display: inline-block; background-color: white; position: absolute; bottom: 0;left: 0; display: none;}

.mobile_open {display: inline-block; width: 40px; height: 30px;position: absolute; right: 30px; top: 15px;display: none; }



.language {font-family: 'Noto Sans KR', sans-serif;}
.language > p {text-decoration: none; color:white;margin-top: 35px; margin-bottom: 37px;display: inline-block;cursor:pointer;margin-left: 5px;}
.arrow {display: inline-block;width: 10px; height: 10px; margin-left: 5px; background-image: url(../img/arrow_up.png); background-size:100% 100%; }

.span_image {background-image:url(../img/arrow_down.png)}

.other_lan {background-color: rgba(0,0,0,0.4);}
.other_lan > a {text-decoration: none; color:white; display: block; text-align: center;margin:10px;padding:5px;}

.other_lan_show {display: none;}


@media(max-width:1255px) {
    #gnb {width: 100%; }
    #gnb > ul {display: none;}
    header {height: 60px; 
    }
    .language > p {margin-top: 23px;margin-bottom: 20px;}
    
    .mobile_open {display: block;}
    #gnb > #logo_main > img {width: 130px; margin-left: 10px;}
    #gnb > #logo_main {margin-top: 10px;}
    #gnb {height: 0;}
}






.sub_area {width: 100%; height: 46px;background-color:rgba(99,8,8,0.82);display: none;}
.sub_area > .sub {position: absolute; display: none; padding-top: 14px;}
.sub_area > .sub > li {display: inline-block;padding-left: 20px;}
.sub_area > .sub > li > a {text-decoration: none; color:white; font-family: 'Noto Sans KR', sans-serif;padding-top: 20px; padding-bottom: 20px;}

.sub_area > .sub:nth-child(1) {right: 50%;margin-right: -100px;}
.sub_area > .sub:nth-child(2) {right:50%; margin-right: -40px;}
.sub_area > .sub:nth-child(3) {right:50%; margin-right: -150px;}
.sub_area > .sub:nth-child(4) {right: 50%; margin-right: -450px;}
.sub_area > .sub:nth-child(5) {right: 50%; margin-right: -530px;}







.mobile_sub {background-color:#282828; position: fixed; right: -300px; top: 0; height: 100vh; display: block; width:300px; transition: right 0,5s;text-align: left;}
.main {background-color:rgba(0,0,0,0.8)}

.mobile_sub > img {display: inline-block; width: 30px; height: 30px;position: absolute; top: 0; right: 0;cursor:pointer;}

.mobile_sub_detail > ul > li {display: none;font-family: 'Noto Sans KR', sans-serif;  margin-left: 70px;}
.mobile_sub_detail > ul > li:first-child {display: block;cursor:pointer; line-height: 2;font-size: 20px; color:#f1f1f1; margin-left: 20px; }
.mobile_sub_detail > ul {border-bottom : 1px solid #f1f1f1;}

.mobile_sub_detail > ul > li > a {text-decoration: none; color: white; line-height: 2; font-size: 17px;}

.mobile_sub_detail > ul > li:first-child:hover {color:white;}
.mobile_logo {display: inline-block;margin-left: 50px;margin-top: 30px;margin-bottom: 30px; }




.banner_area {width: 100%; position: relative;font-family: 'Noto Sans KR', sans-serif;}
.banner_wrap {width: 100%;height: 800px;}
.banner_content {width: 100%; height: 800px;background-image: url(../img/main_banner1.jpg); background-size:cover; background-position:center center;}

.banner_content:nth-child(2) {background-image: url(../img/slide_02.jpg);}
.banner_content:nth-child(3) {background-image: url(../img/slide_03.jpg);}
.banner_content:nth-child(4) {background-image: url(../img/slide_04.jpg);}

.banner_phrase {color:white; text-align: center;padding-top: 300px;}
.banner_phrase > h1 {font-size: 41px; line-height: 2;}
.banner_phrase > h2 {font-size: 20px;}

.banner_content {position: absolute; left: 0; top: 0;}

.banner_content:nth-child(2),.banner_content:nth-child(3),.banner_content:nth-child(4) {opacity:0;display:none;}


.pager_area {position: absolute; right: 30px; top: 300px; width: 15px; }
 .pager {display: inline-block; width: 15px; height: 15px; background-color: #cd9000; border-radius:99px; margin-bottom: 15px; cursor:pointer; }

 .pager_active { border:2px solid #cd9000; box-sizing:border-box;  background-color:rgba(0,0,0,0);}

@media(max-width:1255px) {
    
    .banner_wrap {width: 100%; height: 500px;}
    .banner_content {width: 100%;height: 500px;}
    .banner_phrase {color:white; text-align: center;padding-top: 150px;}
    .banner_phrase > h1 {font-size: 30px; line-height: 2;}
    .banner_phrase > h2 {font-size: 16px;}
    .pager_area { width: 200px;right: 0;top: 90%;left: 50%;transform: translate(-50%,-50%);text-align: center; }
    .pager {margin-right: 15px;}
}




.intro_area {width: 100%;font-family: 'Noto Sans KR', sans-serif; margin-top: 100px;position: relative;}
.intro_wrap {width: 1200px; margin:0 auto;}
.intro_title {text-align: center;}
.intro_title {text-align: center;}
.intro_title > p {font-size: 25px;color:#6e0000;}
.intro_title > h1 {font-size: 32px;line-height: 1.7;}
.intro_content > * {display: inline-block;vertical-align: middle;}
.intro_phrase > p {font-size: 18px; line-height: 1.3;}
.intro_phrase {position: relative;height: 150px;}
.intro_phrase > a {text-decoration: none; color:white; background-color:#6e0000; font-size: 14px; padding: 10px 40px;position: absolute;right: -106px;  bottom:0; }
.intro_square {position: absolute;display: inline-block; background-color: #f1f1f1; width: 1551px; height: 235px; right: 0px; top: 200px;z-index: -99;}

@media(max-width:1255px) {
    .intro_square {display: none;}
    .intro_wrap {width: 600px;}
    .intro_phrase > p {font-size: 18px; line-height: 1.3; text-align: center;}
    
    .intro_phrase {width: 100%;text-align: center;}
    .intro_phrase > a {position:static; line-height: 6;}
    .intro_area:nth-child(3) .intro_content > .intro_phrase { margin-right: 0px;margin-top: 0px;}
    .intro_phrase {position: relative;height: 180px;}
   
}

@media(max-width:656px) {
    .intro_wrap {width: 100%;}
    .intro_content > img {width: 100%;}
    .intro_phrase > p {font-size: 15px; line-height: 1.3;}
    .intro_phrase {height: 220px;}
   
}




.intro_area:nth-child(3) .intro_content {overflow: hidden; margin-top: 50px;}
.intro_area:nth-child(3) .intro_content > * {float: right;}
.intro_area:nth-child(3) .intro_content > .intro_phrase { margin-right: 93px;margin-top: 40px;}
.intro_area:nth-child(3) .intro_content > .intro_phrase > a {right: -75px;bottom: -30px;}
.intro_area:nth-child(3) .intro_square {left: -350px; top: 150px;width: 1451px; }
.intro_area:nth-child(3) {margin-bottom: 230px;}


.line_image_area {width: 100%; height: 385px; background-image: url(../img/sponsor_bg.jpg); background-attachment:fixed; text-align: center;font-family: 'Noto Sans KR', sans-serif;
background-size:cover;}

@media(max-width:1255px) {

    .intro_area:nth-child(3) .intro_content > .intro_phrase { margin-right: 0px;margin-top: 0px;}
    .intro_area:nth-child(3) .intro_content {margin-top: 0px;}
   
}




.haccp_logo {display: inline-block;margin-top: -100px;}
.line_image_area > h1 {color:white; font-size:42px ; margin-top: 30px;}
.line_image_area > p {color:#f1f1f1; font-size: 30px;opacity:0.65;line-height: 2;}

.line_image_logo > img:nth-child(1) {display: inline-block; margin: 20px;}
.line_image_logo > img:nth-child(2) {display: inline-block; margin: 20px;}

@media(max-width:656px) {
    
    .line_image_area > h1 {font-size: 27px;}
    .line_image_area > p {font-size: 18px;}
    .line_image_area > img {width: 160px;}
    .line_image_logo > img {width: 170px; margin-top: 20px;}
   
}






.news_area {width: 100%; background-color: #f2f2f2; padding-top: 50px;font-family: 'Noto Sans KR', sans-serif; padding-bottom: 50px;}
.news_wrap {width: 1200px; margin: 0 auto;overflow: hidden;}
.news_title {text-align: center; margin-bottom: 40px;}
.news_title > p {font-size: 25px;color:#6e0000;}
.news_title > h1 {font-size: 32px;line-height: 1.7; font-weight: bold;}
.news {width: 345px;margin-right: 82.5px; float:left; background-color:white;height:200px;}
.news:nth-child(4) {margin-right: 0;}

.news_sort {border-bottom:2px solid #f2f2f2;}
.news_sort > p {font-size: 25px;line-height: 2; margin-left: 10px;}
.news_sort > * {display: inline-block;vertical-align: middle;}
.news_sort > img {float: right;margin-top: 20px; margin-right: 20px; cursor:pointer; }
.news > p:nth-child(2) {font-size: 20px; line-height: 1.7; margin-left: 15px; margin-top: 15px;}
.news > p:nth-child(3) {font-size: 16px; color:#7d7d7d; margin-left: 15px; margin-top: 30px; margin-bottom: 20px; }


@media(max-width:1255px) {
    
    .news_wrap {width: 100%;}
    .news {width: 30vw; margin-right: 4vw;}
    
    .news > p:nth-child(2) {font-size: 18px; }
}
@media(max-width:893px) {
    
    .news_wrap {width: 300px;}
    .news {width: 300px; margin-bottom: 70px;height:200px; } 
    .news_title > p, .intro_title > p {font-size: 20px;}
    .news_title > h1, .intro_title > h1 {font-size: 27px;}
    
}





.footer_top {font-family: 'Noto Sans KR', sans-serif;background-color: #282828; color:#dedede;border-bottom:1px solid #525252;}

.footer_top_wrap {width: 1200px; margin:0 auto;}

.footer_top_wrap > p {display: inline-block; margin-right: 20px;line-height: 3;}

.footer_bottom {font-family: 'Noto Sans KR', sans-serif;background-color: #282828; color:#dedede;text-align: center;}

.footer_bottom {padding-top: 50px; padding-bottom: 50px; line-height: 2;}



@media(max-width:1255px) {
    
    .footer_top_wrap { text-align: center;width: 100%;}
}




/*ceo소개*/

.sub_banner {height: 395px; width: 100%; background-image: url(../img/sub1_banner.jpg); background-size:cover; background-position:center center;text-align: center; }
.sub_banner > h1 {font-size: 28px; padding-top: 220px; color:white; font-weight: bold;font-family: 'Noto Sans KR', sans-serif;text-align: center; }
.sub_line {display: inline-block; width: 80px; height: 1px; background-color:#ffc949; }


.ceo_greeting {width: 100%;font-family: 'Noto Sans KR', sans-serif;}
.ceo_greeting_wrap {width: 1200px; margin:100px auto; overflow: hidden;}
.ceo_greeting_wrap > .greeting_photo, 
.ceo_greeting_wrap > .greeting_content {float: right;}
.greeting_content {width: 800px;}
.greeting_content > p {line-height: 1.5; margin-top: 20px;}


.greeting_sport {width: 100%;text-align: center; font-size:32px; font-weight: bold;}
.greeting_sport > * {float: left;}


@media(max-width:1255px) {
    .ceo_greeting_wrap {width: 100%;text-align: center;}
    .ceo_greeting_wrap > .greeting_photo {float: inherit;}
    .greeting_content {width: 100%;text-align: center;}
    .greeting_sport > * {float: none;}
}

@media(max-width:656px) {
    .greeting_sport > div > img {width: 100%;}
    .greeting_sport {font-size: 20px;}
   
}


/*역사*/

.sub1_history {width: 100%;font-family: 'Noto Sans KR', sans-serif;}
.sub1_history > .history_wrap {width: 1200px; margin: 100px auto;}
.history_year {padding-bottom: 50px;}
.history_year > p {display: inline-block; font-size:50px; width:333px;font-weight: bold; vertical-align: top;}
.history_content {display: inline-block; width: 830px; padding-left: 30px; border-left:1px solid #cccccc; height: 100%;}
.history_content > p::before {
    content : "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border:3px solid #ffc949;
    border-radius:99px;
    margin-right: 10px;
}
.history_content > p {line-height: 1.7;}


@media(max-width:1255px) {
    .sub1_history > .history_wrap {width: 100%; padding-left: 40px; box-sizing:border-box;}
    .history_year > p {width: 100%; margin-bottom: 20px;}
    .history_content {width: 80%;}
    .history_content > p {width: 100%;}
}

/*인증서*/

.certi {width: 100%;font-family: 'Noto Sans KR', sans-serif;}
.certi_wrap {width: 1200px; margin: 0 auto; text-align: center;}
.certi_wrap > .patent_content > img {display: inline-block;width: 323px; border:1px solid #b1b1b1; margin:30px;}

.certi_wrap > p {text-align: center;font-weight: bold; font-size: 28px; margin-top: 100px; margin-bottom: 50px; }


.regist_content > img {margin: 30px;display: inline-block; border:1px solid #b1b1b1;}

.award_content> *{display: inline-block;border:1px solid #b1b1b1; width: 300px; height: 302px; margin: 30px;}

@media(max-width:1255px) {
    .certi_wrap {width: 100%;}
}


/*제품소개*/


.sub3_banner {height: 395px; width: 100%; background-image: url(../img/sub3_banner.jpg); background-size:cover; background-position:center center;text-align: center; }
.sub3_banner > h1 {font-size: 28px; padding-top: 220px; color:white; font-weight: bold;font-family: 'Noto Sans KR', sans-serif;text-align: center; }
.sub_line {display: inline-block; width: 80px; height: 1px; background-color:#ffc949; }



/*생생프로그램*/

.sub4_banner {height: 395px; width: 100%; background-image: url(../img/sub4_banner.jpg); background-size:cover; background-position:center center;text-align: center; }
.sub4_banner > h1 {font-size: 28px; padding-top: 220px; color:white; font-weight: bold;font-family: 'Noto Sans KR', sans-serif;text-align: center; }
.sub_line {display: inline-block; width: 80px; height: 1px; background-color:#ffc949; }



.ss_01 {position: relative; margin-top: 100px;}
.ss01_box {width: 100%; height: 214px; background-color:#ffc949; position: absolute; bottom: 0; }
.ss01_wrap {width: 1200px; margin: 0 auto; position: relative;height: 500px;}
.ss01_wrap > h1 {position: absolute; right: 250px; top: 50px;font-family:'NanumPen';font-size: 135px; color:#b91212; }
.ss01_wrap > img:nth-child(2) {position: absolute; left: 0;bottom: 0;}
.ss01_wrap > img:nth-child(3) {position: absolute; right: 0; bottom: 0;}


.ss_02 {background-color: #ececec;font-family: 'Noto Sans KR', sans-serif;position: relative;}
.ss02_wrap {width: 1200px; margin: 0 auto;position: relative;height: 623px;}
.ss02_wrap > h1 {font-size: 43px; line-height: 1.2; margin-bottom: 20px;padding-top: 100px;}
.ss02_wrap > p {color:#5c5c5c; font-size: 18px;line-height: 1.4;}
.ss02_wrap > img:nth-child(3) {position: absolute;bottom: 0; left: 0;}
.ss02_wrap > img:nth-child(4) {position: absolute;right: 0; bottom: 0;}


.ss_03 {width: 100%;font-family: 'Noto Sans KR', sans-serif; margin-top: 50px; margin-bottom: 50px;}
.ss03_wrap {width: 1200px; margin:0 auto;overflow: hidden;}
.ss03_wrap > div {width: 50%; float: left;}
.ss03_wrap > div > h1 {font-size: 24px; line-height: 2;}
.ss03_wrap > div:nth-child(1) > p {line-height: 2;}
.ss03_wrap > div:nth-child(2) > p {line-height: 1.3;}



.ss_04 {width: 100%; font-family: 'Noto Sans KR', sans-serif;background-color: #ececec;padding:50px 0; }
.ss04_wrap {width: 1200px; margin:0 auto;overflow: hidden;}
.ss04_title {text-align: center;}
.ss04_title > h2 {font-size: 30px;}
.ss04_title > h1 {font-size:43px; line-height: 2; color:#14590b; font-weight: bold; }
.ss04_wrap > div:nth-child(2), .ss04_wrap > div:nth-child(3) {float: left;width: 50%; }
.ss04_wrap > div:nth-child(2) {margin: 50px 0;}
.ss04_wrap > div:nth-child(3) {line-height: 1.5; font-size: 16px;}




@media(max-width:1255px) {
    .ss01_wrap {width: 100%;}
    .ss01_wrap > img:nth-child(2) {height: 400px;}
    .ss01_wrap > h1 {font-size: 100px; right: 30%; }
    .ss02_wrap {width: 100%;}
    .ss03_wrap {width: 100%;}
    .ss04_wrap {width: 100%;}
}

@media(max-width:1193px) {
    .ss04_wrap > div:nth-child(2), .ss04_wrap > div:nth-child(3) {float: left;width: 100%; text-align: center; }

}

@media(max-width:928px) {
    .ss03_wrap > div {width: 100%; float: left; text-align: center;}

}

@media(max-width:867px) {
    .ss_01 {margin-top: 11.534vw;}
    .ss01_wrap {height:57.670vw;}
    .ss01_box {height:24.682vw; }
    .ss01_wrap > h1 {font-size: 11.534vw;}
    .ss01_wrap > img:nth-child(2) {height: 46.136vw;} 
    .ss01_wrap > img:nth-child(3) {height: 31.833vw;}
    
    .ss02_wrap {height: 71.856vw;}
    .ss02_wrap > h1 {font-size: 4.959vw;padding-top: 11.534vw;}
    .ss02_wrap > p {font-size: 2.076vw;}
    .ss02_wrap > img:nth-child(3) {width: 65.051vw;}
    .ss02_wrap > img:nth-child(4) {width: 40vw;}
}

@media(max-width:615px) {
    .ss04_wrap > div:nth-child(2) > img {width: 100%;}

}


/*알지파낙스 소개*/


.sub2_banner {height: 395px; width: 100%; background-image: url(../img/sub2_banner.jpg); background-size:cover; background-position:center center;text-align: center; }
.sub2_banner > h1 {font-size: 28px; padding-top: 220px; color:white; font-weight: bold;font-family: 'Noto Sans KR', sans-serif;text-align: center; }
.sub_line {display: inline-block; width: 80px; height: 1px; background-color:#ffc949; }





.rg_01 {width: 100%; font-family: 'Noto Sans KR', sans-serif; padding:50px 0; }
.rg01_wrap {width: 1200px; margin:0 auto;overflow: hidden;}
.rg01_wrap > div {float:right; width: 50%;text-align: center;}


.rg01_wrap > div:nth-child(1) {text-align:left;margin-top: 150px;}
.rg01_wrap > div:nth-child(1) > h2 {font-size: 28px; font-weight: 300;}
.rg01_wrap > div:nth-child(1) > h1 {font-size: 38px;font-weight: bold; color:#c51313;line-height: 1.5; } 



@media(max-width:1255px) {
    .rg01_wrap {width: 100%;}
    .rg01_wrap > div:nth-child(1) {text-align: center; margin-top: 50px; margin-bottom: 50px; }
    .rg01_wrap > div {width: 100%;float: right;}
}




.rg_02 {width: 100%; font-family: 'Noto Sans KR', sans-serif; padding:50px 0;background-image: url(../img/rg02.jpg);background-size:cover;color:white;text-align: center; }
.rg02_wrap {width: 1200px; margin:0 auto;}
.rg02_wrap > h1 {font-weight: bold; font-size: 38px;}
.rg02_wrap > p:nth-child(2) { font-size: 23px;line-height: 2;}
.rg02_wrap > p:nth-child(3) {margin:80px 0px; line-height: 2;}

@media(max-width:1255px) {
    .rg02_wrap {width: 100%;}

}


.rg_03 {width: 100%; font-family: 'Noto Sans KR', sans-serif; padding-top: 100px;}
.rg03_wrap {width: 1200px; margin: 0 auto; overflow: hidden;}
.rg03_wrap > div {float:left}
.rg03_wrap > div:nth-child(1) {width: 42%;}
.rg03_wrap > div:nth-child(2) {width: 58%;}
.rg03_wrap > div:nth-child(2) > h1 {font-size: 30px; font-weight: bold; margin: 20px 0; margin-bottom:40px;}
.rg03_wrap > div:nth-child(2) > div {line-height: 1.3;}
.rg03_wrap > div:nth-child(2) > div > h2 {font-weight: bold;}

@media(max-width:1255px) {
    .rg03_wrap {width: 100%;}
    .rg03_wrap  {text-align: center;}
    .rg03_wrap > div:nth-child(1) {width: 100%;}
    .rg03_wrap > div:nth-child(2) {width: 100%;}
    
}

@media(max-width:500px) {

    .rg03_wrap > div:nth-child(1) > img {width: 100%;}
    
}


.rg_04 {width: 100%; font-family: 'Noto Sans KR', sans-serif; padding-top: 100px; padding-bottom: 100px;}
.rg04_wrap {width: 1200px; margin:0 auto; overflow:hidden;}
.rg04_wrap > div {float: left;}
.rg04_wrap > div:nth-child(2) {margin-left: 30px;}
.rg04_wrap > div:nth-child(2) > h1 {font-weight: bold; font-size: 18px; line-height: 2;}
.rg04_wrap > div:nth-child(2) > p {font-size: 16px; line-height: 1.5;}

@media(max-width:1255px) {
    .rg04_wrap {width: 100%;}
    .rg04_wrap  {text-align: center;}
    .rg04_wrap > div:nth-child(1) {width: 100%;}
    .rg04_wrap > div:nth-child(2) {width: 100%;margin-left: 0;}
    
}





/*오시는 길*/
.location {width: 100%;font-family: 'Noto Sans KR', sans-serif; margin: 100px 0;}

.location_wrap {width: 1200px; margin:0 auto;overflow: hidden;}
#map {
        width:100%;
        height: 443px;
      }
.location_wrap > * {float: left;}
.location_wrap > div:nth-child(2), .location_wrap > div:nth-child(3) {width: 50%;} 
.location_wrap > div > h1 {font-size: 28px; font-weight: bold; margin-top: 30px;margin-bottom: 30px;}
.location_wrap > div > p {line-height: 1.5;}

@media(max-width:1255px) {
    .location_wrap {width: 100%;}
    
    
}


/*커뮤니티*/


.sub5_banner {height: 395px; width: 100%; background-image: url(../img/sub5_banner.jpg); background-size:cover; background-position:center center;text-align: center; }
.sub5_banner > h1 {font-size: 28px; padding-top: 220px; color:white; font-weight: bold;font-family: 'Noto Sans KR', sans-serif;text-align: center; }
.sub_line {display: inline-block; width: 80px; height: 1px; background-color:#ffc949; }


/* 그누보드 게시판 */
#bo_list, #bo_v, #bo_w {max-width:1200px; margin: 0 auto;}


#ajax-a {padding-bottom:70px}