@charset "UTF-8";

.header {width:100%;position:fixed;left:0;top:0}
.header .header_inner .gnb_cont_area::before {display:none}
.header.scrolled .header_inner .gnb_cont_area::before {display:block}

/* 메인 타이틀 공통 */
.vs_tit {font-size:2.6rem;font-weight:700;line-height:1.35}
.vs_txt {font-size:0.9rem;color:var(--colorFontGray);font-weight:700}
.main_tit {font-size:40px;font-weight:700;line-height:1.35}
.main_txt {font-size:21px;font-weight:500}

/* 인트로 */
.introMain { overflow: hidden;display:flex;align-items:center;height:100dvh;max-height:960px;background-image:url(../images/bg/bg_pattern.jpg);background-position:center bottom;background-repeat:no-repeat;background-size:cover;position:relative}
.introMain a,
.introMain button {transition:0.2s}
.introMain .container {width:100%;margin-top:80px;z-index:1}
.introMain .typo {margin-bottom:65px;text-align:center}
.introMain .vs_tit {}
.introMain .vs_tit .symbol {display:inline-block;width:73px;height:80px;color:transparent;background-image:url(../images/icon/simbol.png);background-position:left top;background-repeat:no-repeat;background-size:cover}
.introMain .vs_txt {margin-bottom:15px}
.introMain .quick_obj {display:flex;column-gap:30px;max-width:1170px;margin:0 auto}
.introMain .quick_obj .quick {flex:1;display:table;height:400px}
.introMain .quick_obj .link {display:table-cell;height:100%;text-align:center;background-color:var(--colorWhite);border-radius:18px;box-shadow:0 0 25px rgba(0,0,0,0.15);vertical-align:middle}
.introMain .quick_obj .link .img {display:block;margin:0 auto 22px auto;transition:0.2s}
.introMain .quick_obj .link .img img {transform:scale(0.9);transition:0.2s}
.introMain .quick_obj .link .tit {margin-bottom:15px;font-size:30px;font-weight:700}
.introMain .quick_obj .link .text {color:var(--colorFontGray);font-size:17px; word-break: auto-phrase;}
.introMain .quick_obj .link .btn {display:block;width:0;height:0;margin:0 auto;color:var(--colorBlack2);font-weight:500;background-color:var(--colorWhite);border-radius:40px;overflow:hidden;opacity:0;transition:0.2}
.introMain .quick_obj .link:focus, 
.introMain .quick_obj .link:hover {color:var(--colorWhite);background-color:var(--colorMain);box-shadow:none}
.introMain .quick_obj .link:focus .img, 
.introMain .quick_obj .link:hover .img {margin-top:-90px}
.introMain .quick_obj .link:focus .img img, 
.introMain .quick_obj .link:hover .img img {transform:scale(1)}
.introMain .quick_obj .link:focus .tit, 
.introMain .quick_obj .link:hover .tit {}
.introMain .quick_obj .link:focus .text, 
.introMain .quick_obj .link:hover .text {margin-bottom:30px;color:var(--colorWhite)}
.introMain .quick_obj .link:focus .btn, 
.introMain .quick_obj .link:hover .btn {width:115px;height:40px;line-height:40px;opacity:1}
.introMain .shape_bg {display:flex;justify-content:space-between;width:100%;height:100%;position:absolute;left:0;top:0;z-index:0;overflow:hidden}
.introMain .shape_bg .left {position:absolute;left:0;bottom:0}
.introMain .shape_bg .right {position:absolute;right:0;bottom:0}
.introMain .shape_bg .img {display:block}
.introMain .shape_bg .img.img01 {transform:translate(25px, 95px);animation:shapeMove1 3.5s ease-in-out infinite}
.introMain .shape_bg .img.img02 {transform:translate(85px, 137px);animation:shapeMove2 4.2s ease-in-out infinite 0.3s}
.introMain .shape_bg .img.img03 {transform:translate(-65px, 85px);animation:shapeMove3 3.8s ease-in-out infinite 0.5s}
.introMain .shape_bg .img.img04 {transform:translate(200px, 65px);animation:shapeMove4 4.6s ease-in-out infinite 0.1s}
.introMain .shape_bg .img.img05 {transform:translate(50px, 70px);animation:shapeMove5 4.0s ease-in-out infinite 0.2s}
.introMain .shape_bg .img.img06 {transform:translate(65px, 95px);animation:shapeMove6 4.2s ease-in-out infinite 0.4s}


/* 메인 비주얼 -> 인트로스타일 유사 : 추가 스타일 */
.main-visual .introMain { position: relative; }
.main-visual .introMain .typo { margin:0 0 50px; } 
.main-visual .visual_center .link { font-size:0.8rem; z-index: 9; position: relative;display: inline-block; border-radius: 30px; background:var(--colorBlack2); color: var(--colorWhite); padding: 18px 36px; }
.visual_center { text-align: center; /* position: relative;  */height: 430px; }
.visual_center > img  { position: absolute;left: 50%; transform: translateX(-50%); }

.introMain.home { background-image:url(../images/bg/bg_pattern2.jpg);background-position:center bottom;background-repeat:no-repeat;background-size:cover;p}
.introMain.home .left_img { left:15%; }
.introMain.home .right_img { left:85%; }


@keyframes shapeMove1 {
  0%, 100% {transform:translate(25px, 95px)}
  50% {transform: translate(25px, 90px)}
}

@keyframes shapeMove2 {
  0%, 100% {transform:translate(85px, 137px)}
  50% {transform: translate(85px, 125px)}
}

@keyframes shapeMove3 {
  0%, 100% {transform:translate(-65px, 85px)}
  50% {transform:translate(-65px, 100px)}
}

@keyframes shapeMove4 {
  0%, 100% {transform:translate(200px, 60px)}
  50% {transform:translate(200px, 50px)}
}

@keyframes shapeMove5 {
  0%, 100% {transform:translate(50px, 65px)}
  50% {transform:translate(50px, 80px)}
}

@keyframes shapeMove6 {
  0%, 100% {transform:translate(65px, 95px)}
  50% {transform:translate(65px, 80px)}
}

/* 모바일  top 메뉴 */
.m_tab_menu_area { display: none; }
.m_tab_menu_area .link_order { position: absolute; top: -3.8rem; right: 7.4rem;	border-radius: 2rem;padding: 0.7rem 1.2rem;	display: inline-block;font-size: 1.2rem;line-height: 1.5rem;border: 0; }
.m_tab_menu_area .link_order:after {content: "";display: inline-block;vertical-align: top;margin-left: 0.5rem;background-image: url("/templates/default/images_new/ico/ico_link.png");background-position: right center;
	background-repeat: no-repeat;text-indent: -99999px;	width: 25px;height: 13px;background-size: auto 10px; }
.m_tab_menu_area.sub2,.m_tab_menu_area.sub1 {	background-color: #fff;    box-shadow: 0 4px 3px rgba(0, 0, 0, .1); }
.m_tab_menu_area.sub1 .link_order {	background-color: #0090AD;	color: #fff; }
.m_tab_menu_area.sub2 .link_order {	background-color: #efb940;	color: #fff; }
.m_tab_menu_area ul {	overflow: auto; }
.m_tab_menu_area ul::-webkit-scrollbar { 	width: 4px;	height: 3px;}
.m_tab_menu_area ul::-webkit-scrollbar-thumb {	background-color: #ddd;	border-radius: 10px; }
.m_tab_menu_area ul::-webkit-scrollbar-track {	background-color: #aaa;	border-radius: 10px; }
.m_tab_menu_area ul li a {	display: block;	padding: 15px 0;color: #aaa; }
.m_tab_menu_area ul li:nth-child(1) { order: 1; }
.m_tab_menu_area ul li:nth-child(2) { order: 2; }
.m_tab_menu_area ul li:nth-child(3) { order: 3; }
.m_tab_menu_area ul li.active a {border-bottom: 4px solid #009fca; color: #000;	font-weight: bold; }

/* 타이틀 / 버튼 공통 */
.mt_80 { margin: 80px auto 0; }
.mt_40 {  margin: 40px 0 0;; }
.block_br { display: none; }
.title_area { grid-gap:50px; }
.news .title_area .sec_tit { font-size: 1.6rem; }
.title_area .sec_tit { font-size: 2.0rem; font-weight: 700; color: var(--colorBlack2); text-align: center; word-break: auto-phrase; }
.title_area .sec_tit .s_tex { display: block; font-size: 24px; margin: 0 0 10px; }
.slide_btn .btn { border-radius: 50px; color: var(--colorBlack2); border: 1px solid var(--colorLightGray); width: 40px; height: 40px; text-align: center; }
.slide_btn a.btn {border: 1px solid var(--colorBlack2); }
.slide_btn .btn i { font-size: 18px; line-height: 40px; }
.slide_btn .btn.prev1 { transform: rotate(-90deg); }
.slide_btn .btn.next1 { transform: rotate(90deg); }
.slide_btn .btn.play { display: none; }

/* 소비자  - 새로운소식 */
.news { border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; }
.title_area .news_tab { flex:1; text-align: left; grid-gap:10px; }
.title_area .news_tab li { border-radius: 30px; padding: 10px 24px; font-size: 16px; color: var(--colorBlack2); border: 1px solid var(--colorLightGray); cursor: pointer; }
.title_area .news_tab li.active { border: 1px solid var(--colorBlack2); }
/* .news_slide { overflow: hidden; margin: 40px 0 0; }
.news_slide li {padding-right: 30px; }
.news_slide li a { display: block; background: #f9fafb; padding: 40px 30px; border-radius: 30px; border: 1px solid #f9fafb; }
.news_slide .subject { color:var(--colorFontGray); }
.news_slide .mesg { position: relative; font-size: 22px; color: var(--colorBlack2); margin: 10px 0 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; height: 68px; font-weight: 700; }
.news_slide .date { color:var(--colorFontGray); }
.news_slide li.new .mesg:after { position: absolute;bottom: 7px; right: 0; content:'N'; background: #e86b11; color: #fff; border-radius:50px; font-size: 16px; width:20px; height: 20px;display: inline-block; line-height: 20px; text-align: center; margin:0 0 0 10px;}
.news_slide li:hover a { border: 1px solid #009cc4; background: #fff; box-shadow: 0px 0px 10px 0px #eee; }
 */
.news_slide { width: 60%; flex:1; overflow: hidden; }
.news_slide li a { display: block;  }
.news_slide .mesg { font-size: 22px; color: var(--colorBlack2);overflow: hidden; white-space: nowrap; text-overflow: ellipsis;  font-weight: 700; }
.news_slide li.new .mesg:after { content:'N'; background: #e86b11; color: #fff; border-radius:50px; font-size: 16px; width:20px; height: 20px;display: inline-block; line-height: 20px; text-align: center; margin:0 0 0 10px; }
.news_slide .subject, .news_slide .date { display: none; }
.news_slide .subject { color:var(--colorFontGray); }
.news_slide .date { color:var(--colorFontGray); }

/* 소비자  - 농촌융복합산업이란  */
.sec_cha { background: #f3fdff; padding: 80px 0; }
.sec_cha ul { grid-gap: 30px; text-align: center; }
.sec_cha ul li { border: 1px solid var(--colorLightGray); background: #fff; border-radius: 30px; overflow: hidden; }
.sec_cha ul .tit {  font-size: 1.6rem; color: var(--colorBlack2); font-weight: 700; }
.sec_cha ul .tit > span { display: inline-block; font-size: 16px; border-radius: 20px; padding: 2px 17px; }
.sec_cha ul .dis { font-size: 1rem; color: var(--colorFontGray); margin: 0 0 36px; }

/* 소비자  - 테마별 제품  */
.sec_theme { background: #fffaed; padding: 80px 0; }
.sec_theme ul { grid-gap: 30px; }
.sec_theme ul li { position: relative; padding: 60px 40px; background: #ffeec1; border-radius: 30px; min-height: 500px; overflow: hidden; transition: width 4s linear,background-color 0.5s ease-in-out; cursor:pointer; }
.sec_theme ul li .left_text { font-size: 1.1rem; font-weight: 700; width: 30px; margin-right: 115px; color: var(--colorBlack2); }
.sec_theme .text_wrap { color: var(--colorBlack2);  display: none;  }
.sec_theme .text_wrap .tit { font-size: 1.6rem; font-weight: 700; word-break: auto-phrase; }
.sec_theme .text_wrap .dis { font-size: 0.9rem; margin: 0 0 46px; word-break: auto-phrase; }
.sec_theme .text_wrap a { background: rgba(0,0,0, 0.1); padding: 14px 30px; border-radius: 50px; font-size:0.8rem }
.sec_theme ul li img { position: absolute; left:20%; bottom: 0; min-width: 451px; }
.sec_theme ul li.active { flex:1; background: #fbb900; cursor:auto; padding: 70px;  }
.sec_theme ul li.active .left_text { display: none;}
.sec_theme ul li.active .text_wrap { display: block; position: relative;  z-index: 1; }
.sec_theme ul li.active img { right: 5%; left: auto; }

/* 소비자  - 슬라이드  */
.sec_4 { position:relative; overflow: hidden; }
.sec_4 .title_area { display: none; }
.intro_prev { background: #fff; position:absolute; left:0; top:50%; transform:rotate(-90deg) translateX(50%) !important; z-index: 9 }
.intro_next { background: #fff; position:absolute; right:0; top:50%; transform:rotate(90deg) translateX(-50%) !important; z-index: 9 }
.intro_slide { display: flex; gap: 10px; flex-wrap: wrap; }
.intro_slide li { flex: 1 0 32%; }
.intro_slide li a { background: #f9fafb; border-radius: 20px; padding: 30px; display: block; }
.intro_slide li a .dis_flex { flex-direction: row-reverse; align-items: center; justify-content: space-between }
.intro_slide li a img { height: 60px;}
/* .intro_slide li .text_wrap { width: 80%;} */
.intro_slide .subject { font-size: 1.20rem; color:var(--colorBlack2);  font-weight: 700; }
.intro_slide .mesg { font-size: 0.8rem; color: var(--colorBlack2); margin: 10px 0 0;/*  overflow: hidden; white-space: nowrap; text-overflow: ellipsis; */}

/* 소비자  - 안테나숍  */
.sec_antenna { background: #f9fafb; padding: 80px 0;text-align: center; overflow: hidden; }
.antenna_slide  { overflow: hidden; }
.sec_antenna .slick-list { overflow:visible; width:76%; margin: 0 auto; }
.sec_antenna .title_area > a { display: none; }
.sec_antenna li { position: relative; margin: 0 15px; border-radius: 26px; overflow: hidden; }
.sec_antenna .text_wrap { cursor:pointer; text-align: left; position: absolute; top:0; left:0; color:var(--colorBlack2); width: 100%; height: 100%; background:rgba(0,156,196,0.9); color: #fff; padding: 50px 40px; display: none; transition: all 0.3s; z-index: 1; }
.sec_antenna .subject { font-size: 1.6rem; font-weight: 700; text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2; }
.sec_antenna .mesg { font-size: 0.8rem; margin: 24px 0 0;}
.sec_antenna .text_wrap a { position: absolute; bottom:50px; left:40px; font-size: 16px; color: #009cc4; background: #fff; border-radius: 20px; padding: 3px 18px; }
.sec_antenna li:hover .text_wrap { display: block; }
.sec_antenna .link {  font-size: 0.8rem; display: inline-block; color:var(--colorBlack2); background: rgba(0,0,0,0.1); border-radius: 20px; padding: 10px 38px; }
.sec_antenna .img_wrap:after { content:''; display: none; width: 100%; height: 100%; background: rgba(0,0,0,0.3); position: absolute; top: 0; left:0; }
/* .sec_antenna .img_wrap {filter: brightness(0.5);} */

/* 소비자  - SNS이야기 */
.title_area .sns_tab { flex:1; text-align: left; grid-gap:10px;     flex-wrap: wrap;}
.title_area .sns_tab li { border-radius: 30px; padding: 5px 24px 5px 8px; font-size: 16px; color: var(--colorBlack2); border: 1px solid var(--colorLightGray); cursor: pointer; line-height: 30px; }
.title_area .sns_tab li img { margin: 0 14px 0 0; }
.title_area .sns_tab li.active { border: 1px solid var(--colorBlack2); }

#sec_sns .slide_btn .sns_prev,#sec_sns .slide_btn .sns_next, .sns_pause { display:none !important; }

.slide_wrap { position: relative; margin: 40px 0 80px; grid-gap: 30px; }
.sns_slide { overflow: hidden; width: calc(100% - 416px); padding: 0; }
.sns_slide iframe { width: 100%;  height: 520px; border-radius: 20px; overflow:hidden;  }
.sns_slide .img_area { border-radius: 20px; overflow:hidden; background-color: var(--colorBgGray) !important; }
.sns_slide .subj { font-size: 1.2rem; color: var(--colorBlack2); margin: 10px 0 0; font-weight: 700; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.sns_nav { position: absolute !important; right: 0; top:-50px; width: 450px;  }
.sns_nav li { padding: 0 0 0 60px; margin: 0 0 30px;  grid-gap: 20px; max-width: 450px; cursor: pointer; }
.sns_nav .slick-current { background: #fbb900; padding: 20px; box-shadow: 0px 0px 30px rgba(0,0,0,0.2); border-radius: 20px; /* transform: translateX(-60px); */ }
.sns_nav .slick-list { padding: 0; }
.sns_nav .tit_wrap { }
.sns_nav p { font-size: 18px; color: var(--colorBlack2);overflow: hidden; -webkit-line-clamp: 2;  -webkit-box-orient: vertical;  word-break: break-word; display: -webkit-box; }
.sns_nav span { font-size: 16px; color: var(--colorFontGray); margin: 20px 0 0; font-weight: 300;}
.sns_nav .slick-current  span { color: var(--colorBlack2); }
.sns_nav .tit_wrap { width: 50%; }
.sns_nav li .dis_flex { gap:14px; }
.sns_nav .img_area { max-width: 46%; border-radius: 10px; }
.sns_nav .slick-list { overflow: visible; }

/* ------------------------------------------------------------------------------------------------------------ */

/* 인증경영제 - 새로운소식 */
.news_slide2 { width: 60%; flex:1; overflow: hidden; }
.news_slide2 li a { display: block;  }
.news_slide2 .mesg { font-size: 22px; color: var(--colorBlack2);overflow: hidden; white-space: nowrap; text-overflow: ellipsis;  font-weight: 700; }
.news_slide2 li.new .mesg:after { content:'N'; background: #e86b11; color: #fff; border-radius:50px; font-size: 16px; width:20px; height: 20px;display: inline-block; line-height: 20px; text-align: center; margin:0 0 0 10px; }
.news_slide2 .subject, .news_slide2 .date { display: none; }
.news_slide2 .subject { color:var(--colorFontGray); }
.news_slide2 .date { color:var(--colorFontGray); }


/* 인증경영제 - 지원센터 */
.sec_area { background: #f3fdff; padding: 80px 0; }
.sec_area .area_wrap { flex-wrap: wrap; grid-gap: 30px; }
.sec_area .area_wrap li { flex: 0 1 31%; padding: 20px 30px; background: #fff; border: 1px solid #fff; border-radius: 20px; }
.sec_area .area_wrap li:hover { border: 1px solid #009cc4; box-shadow: 0px 0px 10px 0px #eee; }
.sec_area .area_wrap .tit { font-size: 24px; font-weight: 700; color: var(--colorBlack2); }
.sec_area .area_wrap .dis { font-size: 18px; font-weight: 700; }
.sec_area .area_wrap a { display: inline-block; color: var(--colorFontGray); border-radius: 50px; border: 1px solid var(--colorLightGray); width: 40px; height: 40px; text-align: center; line-height: 37px; }
.sec_area .area_wrap a.call { display: none; }
.sec_area .area_wrap li:hover a { color: var(--colorMain); }
.sec_area .area_wrap li.all { overflow: hidden; background: #d7f6ff; background-image: url('../images/main/sec_area_bg.png'); background-repeat: no-repeat; background-position: center}
.sec_area .area_wrap li.all .tit {font-size: 22px;     word-break: auto-phrase; }
.sec_area .area_wrap li.all a { border: 1px solid var(--colorBlack2); color: var(--colorBlack2);}

/* 농촌융복합산업 지원사업  */
.sec_backup { background: #fffaed; padding: 80px 0; }
.backup_wrap { grid-gap: 30px; }
.sec_backup .box_wrap {  flex:1; /* max-width: 800px; */ padding: 70px 70px 30px; border-radius: 20px; background: #fbb900; background-image: url('../images/main/sec_backup_bg.png'); background-repeat: no-repeat; background-position: right -45px bottom -120px; }
.sec_backup ul li { padding: 50px 40px 20px; border-radius: 20px; background: rgba(251,185,0,0.3); }
.sec_backup ul li:first-child { margin: 0 0 30px; }
.sec_backup .tit { font-size: 1.6rem; font-weight: 700; color: var(--colorBlack2);     word-break: auto-phrase; }
.sec_backup .dis { font-size: 0.9rem; color: var(--colorBlack2); margin: 20px 0 0;word-break: auto-phrase; }
.sec_backup a { font-size:0.8rem; display: inline-block; margin: 30px 0 0; padding: 10px 20px; border-radius: 50px; background: rgba(0,0,0,0.1); color: var(--colorBlack2); }
.sec_backup ul li img {object-fit: contain;}

/* 농촌융복합산업 인증제도  */
.sec_cert {  }
.cert_wrap { grid-gap: 30px; }
.cert_wrap li { position: relative;  border-radius: 20px; background: var(--colorBgGray); padding: 60px 40px; }
.cert_wrap li .tit { font-size: 1.6rem; font-weight: 700; color: var(--colorBlack2); }
.cert_wrap li .dis { font-size: 0.9rem; color: var(--colorFontGray); margin: 20px 0 100px; word-break: auto-phrase; }
.cert_wrap li a { font-size:0.8rem; padding: 10px 20px; border-radius: 50px; background: rgba(0,0,0,0.1); color: var(--colorBlack2); }
.cert_wrap li img { position: absolute; bottom: 40px; right: 50px; }
.sec_cert .gra_wrap { position: relative; overflow: hidden; margin: 80px 0; padding: 60px 80px; background: linear-gradient(90deg,#009cc4, #24d7e7); border-radius: 20px; color: #fff; }
.sec_cert .gra_wrap h4 { font-size:2rem; font-weight: 700; word-break: auto-phrase; }
.sec_cert .gra_wrap h4 .s_tex { font-size: 18px; color: var(--colorYellow); display:block; }
.sec_cert .gra_wrap p { font-size: 16px; margin: 10px 0 40px; word-break: auto-phrase; }
.sec_cert .gra_wrap a { font-size:0.8rem; padding: 10px 20px; border-radius: 50px; background: #fff; color: var(--colorBlack2); }
.sec_cert .gra_wrap img { position: absolute; bottom: -26%; right: 80px; }