@charset "utf-8"; @import url('layer_popup.css'); body.layerOpen {overflow:hidden;} /* body 스크롤 없애기 : 전체메뉴 */ .m_only { display: none !important; } /* hide */ .sr_only {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;} /* 접근성 관련 제목 hide처리 */ /* mask */ .black_bg { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.6); display: none; } .mask_bg { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.4); z-index: 9999; display: none; } .topBanner {position: relative; width: 100%; height: auto;background:#11881f;} .topBanner .inner {width: 100%; max-width: 1200px; position: relative; display: block; margin:0 auto;overflow: hidden; text-align: center; } .topBanner .inner p {margin:.5rem 1rem;} .topBanner .inner span {display: inline-block;/* padding:.15rem 1rem .18rem; *//* border:1px solid #156da9; */margin-left: 20px;border-radius:20px;line-height: 58px;} .topBanner .inner span a {color: #fff;font-size: .925rem;font-weight: 500;letter-spacing: -.03rem;padding: .3rem 1rem;background: rgba(255,255,255,.2);border-radius: 30px;box-shadow: 1px 1px 3px 0 rgba(16,16,16,.1);-webkit-box-shadow: 1px 1px 3px 0 rgba(16,16,16,.1);} #header, #container, #footer { width:100%; margin: 0 auto; display:block; position:relative; min-width: 320px;} /* header */ #header .headerWrap {position: relative; width: 100%; padding:0 2%; height: 88px; margin: auto; } #header .headerWrap .logo {position: absolute; top:10px; left:2%;} #header .headerWrap .logo a {font-size:0; text-indent:-9999px; display:block; width:94px; height:68px; background:url('/ps/img/cmmImg_2020/common/nongsaro_logo.png') no-repeat 0 0/cover;} #header .btn-utilWrap {position:absolute; top:0; bottom:0; right:118px; width:auto;} #header .btn-utilWrap .utilArea {position: relative; display: inline-block; top:1.75rem;margin: auto; margin-right:.5rem;overflow:hidden;} #header .btn-utilWrap .utilArea li {float: left;} #header .btn-utilWrap .utilArea li a span { font-size: 14px; font-weight: 500;letter-spacing: -.05rem;} #header .btn-utilWrap .utilArea li + li {margin-left:1rem;} #header .btn-utilWrap .btn-openForm {position:relative; display: block; } #header .btn-utilWrap .btn-openForm .seT {display:block; padding:.15rem 1rem .18rem; border:1px solid #156da9;border-radius:20px; } #header .btn-utilWrap .btn-openForm .seT span { color:#156da9; font-size: 14px; font-weight: 500;letter-spacing: -.05rem;} #header .btn-utilWrap .btn-openForm .seT:hover {background-color:#156da9; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);border:0;margin:1px;} #header .btn-utilWrap .btn-openForm .seT:hover span {color:#fff;} #header .btn-openSearch {position: absolute;right: 78px;top: 0;display: inline-block;width: 40px;height: 86px;margin:auto;border:0;background:none;} #header .btn-openSearch:after {content: '';display: block; margin: auto;width:28px; height:28px; background:url('/ps/img/cmmImg_2020/common/ico_search.png') no-repeat 0 0/cover; } #header .openAllWrap { position:absolute; display: block; top:0; right:0; width:78px; height:88px;line-height: 88px; vertical-align: middle;text-align: center;} #header .openAllWrap .btn-openAll {display: inline-block;width:30px;height:30px;margin:auto;border:0;background:none;/* outline:none; */text-indent: -9999px;} #header .openAllWrap .btn-openAll span {display:block; float:right; width:70%; margin: 2px 0 8px; height:2px; background:#555; } #header .openAllWrap .btn-openAll span:first-child{width:100%; margin: 1px 0 7px} #header .openAllWrap .btn-openAll span:last-child{width:100%; margin: 0px 0 7px} #header .openAllWrap .btn-openAll:hover span{width:100% !important; background:#004a96;} #header .openAllWrap .btn-openAll span{transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; } #header .btn-utilWrap button:focus { outline-width: 2px !important; outline-style:dotted !important; outline-color:black !important; outline-offset:-1px;} /* 상단검색 */ .searchWrap { width: 100%; position: absolute; top: 0; left: 0; display: none; overflow: hidden; z-index: 9999; background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);} .header.on {position: relative;height: 100px; width: 100%; top: 0;left: 0; background: #fff;} .header_search { max-width: 960px; margin: 0 auto; padding:60px 5%; } .header_search dt { width: 100%; padding-bottom: 20px; border-bottom: 2px solid #fff; font-size: 0; } .header_search dt select {position:relative; min-width: 130px; font-size: 21px; color: rgba(255,255,255,0.5); height: 38px; line-height: 38px; vertical-align: top; font-weight: 300; padding: 0 5px; background: transparent url('/ps/img/cmmImg_2020/common/select_arrow_W.png') center right 10px no-repeat; background-size: 8px auto; border:0;-webkit-appearance: none; appearance: none; text-indent: 5px;} .header_search dt select option {color: #676767;} .header_search dt .radioWrap {position: relative; margin-bottom: 20px} .header_search dt .radioWrap ul {overflow: hidden;} .header_search dt .radioWrap ul li {float: left;} .header_search dt .radioWrap ul li input[type="radio"] {appearance: none; -webkit-appearance: none; -moz-appearance: none; -o-appearance:none; border: 1px solid rgba(255,255,255,0.5); border-radius: 50%;} .header_search dt .radioWrap ul li input[type="radio"]:checked {border: 4px solid #fff; background-image: linear-gradient(101deg, rgba(0,209,197,1) 0%,rgba(5,70,204,1) 100%);} .header_search dt .radioWrap ul li input.radio_bt {display: inline-block; width:24px; height: 24px;vertical-align: middle; cursor: pointer; margin-right: 5px;} .header_search dt .radioWrap ul li label { position: relative;display: inline-block;top: inherit;vertical-align: middle;margin-right: 20px; font-size: 18px; font-weight: 300; color: rgba(255,255,255,0.6);} .header_search dt .radioWrap ul li input[type="radio"]:checked + label { color: rgba(255,255,255,1);} .header_search dt input { width: calc(100% - 80px); height: 38px; line-height: 38px; font-size: 32px; color: rgba(255,255,255,0.5); font-weight: 300; vertical-align: top; border:0; } .header_search dt input:-ms-input-placeholder{ color: #ffd3b8 !important; } .header_search dt .btnSearch { display: inline-block; padding: 0; margin-left:20px; } .header_search dt .btnSearch:after { content:'';display:block; width:40px; height:38px; background:url('/ps/img/cmmImg_2020/common/search_ico_big.png') no-repeat 0 0/cover; } .header_search dt a img { width: 100%; } .header_search dd { font-size: 0; margin-top: 18px; } .header_search dd a { display: inline-block; height: 36px; line-height: 34px; padding: 0 20px; margin: 12px 12px 0 0; font-size: 16px; color: #fff; font-weight: 500; border: 1px solid rgba(255,255,255,0.4); border-radius: 18px; } .header_search dd a:last-of-type { margin-right: 0; } .searchWrap .search_xClose {position:absolute;top:0;right:0;width:100px;height:100px;/*border:solid 1px #fff;*/background:transparent;text-indent:-9999px;cursor: pointer;} .searchWrap .search_xClose:before, .searchWrap .search_xClose:after{content:'';display:block;position:absolute;top:50%;left:50%;width:40px;height:2px;margin-left:-20px;background:#222;} .searchWrap .search_xClose:before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);} .searchWrap .search_xClose:after{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);} #contentWrap {} #contentHeader {} .popupArea { display: none; } .popupArea.on { display: block; position:fixed; left: 1.5%; top:100px;z-index:60; } .popupArea.on a.alArm {position: relative;display: block;margin: auto;text-align: center;width: 2.6rem;height: 2.6rem;padding: 4px 0;background: rgba(0,0,0,0.5);border-radius: 50%;background: rgb(0,111,186);background: -moz-linear-gradient(left, rgba(17,136,31,1) 0%, rgba(21,109,169,1) 100%);background: -webkit-linear-gradient(left, rgba(17,136,31,1) 0%,rgba(21,109,169,1) 100%);background: linear-gradient(to right, rgba(17,136,31,1) 0%,rgba(21,109,169,1) 100%);border: .1rem solid #fff;box-shadow: 0.3rem 0.3rem 0.5rem 0 rgba(0,0,0,.18);} .popupArea.on a.alArm:before {content: '';display: block;width: 30px;height: 30px;background-image: url('/ps/img/cmmImg_2020/common/icon_alArm.png');background-size: 20px auto;background-repeat: no-repeat;background-position: 50%;text-align: center;/* padding-top: .6rem; */margin: 0 auto;} .popupArea.on a.alArm .count {position:absolute;top: 8px;right: 8px;background: #e51b13;font-family: verdana,sans-serif;font-size: 8px;color: #fff;border-radius: 20px;width: 13px;height: 13px;line-height: 1.3;text-align: center;z-index: 1;} #container.introArea .subTitleWrap {display:none;} #container.cropArea .subTitleWrap {display:none;} #container.cropArea.cropView .subTitleWrap {display:block;position: relative; height: 160px;} #container .subTitleWrap {position: relative; width: 100%; } #container .subTitleWrap h2.subTitle { position: relative; margin: 0 auto; padding-top: 3rem; padding-bottom: 1rem; color: #222; font-size: 2.4rem; font-weight: 500; letter-spacing: -0.05em; text-align: center;} #container .subTitleWrap h2.subTitle:after {content:'';display:block;height:1px;width:50px; bottom: 0;margin: 0 auto;margin-top: .6rem;background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);} #container .subAreaT {position: relative; width: 100%; } #container.introArea { /* background-image: url('/ps/img/cmmImg_2020/sub/subVisual_intro.png'); */background-color: transparent; background-repeat: no-repeat; background-size: contain; background-position: top center !important; transition: all 0.25s;} #container.cropArea { background-image: url('/ps/img/cmmImg_2020/sub/subVisual_crop.png');background-color: transparent; background-repeat: no-repeat; background-size: contain; background-position: top center !important; transition: all 0.25s;} #container.curation { background-image: url('/ps/img/cmmImg_2020/sub/subVisual_curation.png');background-color: transparent; background-repeat: no-repeat; background-size: contain; background-position: top center !important; transition: all 0.25s;} #container.cropArea.cropView {position: relative; background-image:none; } #container.cropArea.cropView:before {content:'';display:block;position:absolute; top:0; left:50%;width: 100vw;min-height: 355px;background:#eaecf1; background:linear-gradient(to top, #fff 10%, #eaecf1 90%);transform:translateX(-50%);} #container.cropArea.cropView:after {content:'';display:block;position:absolute;top:0; left:50%;width: 100%;height: 100%; background-image: url('/ps/img/cmmImg_2020/sub/subVisual_cropView.png');background-color: transparent; background-repeat: no-repeat; background-size: contain; background-position: top center !important; transition: all 0.25s;transform:translateX(-50%);z-index: 0;} #container .subAreaB {position: relative; width: 100%; } #container .contents {position: relative; max-width: 1200px; margin: 0 auto; padding: 2rem 0 50px 0; overflow: hidden;} #container.mainArea .contents { max-width: inherit;padding: 0;min-height: 500px;}/* 메인contents */ #container.introArea .contents { max-width: inherit;padding: 0;min-height: 500px;}/* 서브인트로 contents */ #container.cropArea .contents { max-width: inherit;padding: 0;min-height: 500px;}/* 작목별기술 contents */ #container.cropArea.cropView .contents { max-width: 1200px; margin: 0 auto;min-height: 500px; padding: 2rem 0 50px 0; overflow: hidden;z-index: 1;}/* 작목별기술 view contents */ /* sub-nav */ #locationWrap .sub_util .btn-openForm {display: none;} #locationWrap.fixed { position: fixed; top: 0; left: 0; width: 100%; z-index: 100000; -webkit-transition:all .2s; transition:all .2s } #locationWrap { width:100%; height: 58px; position: relative; z-index: 3;} #locationWrap:before { width:100%; height:58px; content:''; position:absolute; top:0; left:0; z-index:-1; background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);}/* 2차메뉴 배경 색 2차메뉴 높이 */ #locationWrap .locationArea {position: relative;max-width: 1400px;margin:0 auto;} #locationWrap .nav { position: relative;display: block;height:58px; margin:0 auto;}/* 3차메뉴 활성화시 lnb 전체 밑줄 */ #locationWrap .nav ul {display:block; margin: 0 auto;} #locationWrap .nav ul:after {display:table; content:''; clear:both; } #locationWrap .nav ul li {position: relative; float: left; vertical-align: top; } #locationWrap .nav .navList button{display: block; font-size: 15px; color:#fff; line-height: 58px; font-weight: 300; width: 220px; padding:0 38px 0 15px; border-right:1px solid rgba(255,255,255,0.1); text-decoration: none; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;text-align:left;} #locationWrap .nav .navList button::after{display: block; content: ''; position: absolute; right:20px; top:22px; width:9px; height: 9px; border-bottom:1px solid #fff; border-right:1px solid #fff; transform:rotate(45deg);transition: transform 150ms ease-in-out; } #locationWrap .nav .navList.active button{ top:30px; font-weight: 400;} #locationWrap .nav .navList.active button::after{top:26px; transform:rotate(-135deg); } #locationWrap .nav .home {display: block; position: relative; width:50px; height:58px; border-left:1px solid rgba(255,255,255,0.1); border-right:1px solid rgba(255,255,255,0.1);} #locationWrap .nav .home:after {content: ''; display: block; position: absolute; top:0; bottom:0; left:0; right:0; margin: auto; width:15px; height:14px; background:url('/ps/img/cmmImg_2020/common/ico_home.png') no-repeat; } #locationWrap .nav .ico.home:hover, #locationWrap .nav .ico.home:focus{ background-color:rgba(0,0,0,0.15);} #locationWrap .nav .navList .dropdown {display: none; position: relative;} #locationWrap .nav .navList.active .dropdown {display: block;} #locationWrap .nav .navList .dropdown {position: absolute; top:58px; left:-1px; z-index: 10; min-width: 221px; } #locationWrap .nav .navList .dropdown .dropdown-menu {border:1px solid #ddd;background: #fff; border-top:0px;} #locationWrap .nav .navList .dropdown .dropdown-menu li{display: block; line-height: 1.5; width:100%; /*height:40px;*/ border:0;} #locationWrap .nav .navList .dropdown .dropdown-menu li:hover, #locationWrap .nav .navList .dropdown .dropdown-menu li:focus{} #locationWrap .nav .navList .dropdown .dropdown-menu li + li{border:0;} #locationWrap .nav .navList .dropdown .dropdown-menu li a {display: block; font-size: 0.925rem; color:#63676d; text-decoration: none; padding:8px 15px; background: #fff;} #locationWrap .nav .navList .dropdown .dropdown-menu li a.active { font-weight: 500;color:#203c92;background:#f2f2f2; } #locationWrap .nav .navList .dropdown .dropdown-menu li a:hover, #locationWrap .nav .navList .dropdown .dropdown-menu li a:focus{color:#fff; text-decoration: none; background:#4e5158;} /* [새창]표시-icon */ #locationWrap .nav .navList .dropdown .dropdown-menu li a[target="_blank"]:after {content:'';display: inline-block; background:url('/ps/img/cmmImg_2020/common/ico_blank.png') no-repeat; width:11px; height:12px; vertical-align:middle; margin:-2px 0 0 5px;} #locationWrap .nav .navList .dropdown .dropdown-menu li a:hover[target="_blank"]:after {content:'';display: inline-block; background:url('/ps/img/cmmImg_2020/common/ico_blank_w.png') no-repeat; width:11px; height:12px; vertical-align:middle; margin:-2px 0 0 5px;} #locationWrap .sub_util {display:block; position:absolute; right:0; top:0; height:58px;font-size: 0; border-right:1px solid rgba(255,255,255,0.1);} #locationWrap .sub_util button {position: relative;display: inline-block; width: 50px; height: 58px; line-height: 58px; border-left:1px solid rgba(255,255,255,0.1);} #locationWrap .sub_util .btn_share:after {content: ''; display: block; margin: auto; width:20px; height:20px; background:url('/ps/img/cmmImg_2020/common/ico_share.png') no-repeat 50%/cover; } #locationWrap .sub_util .btn_share.on:after { background:url('/ps/img/cmmImg_2020/common/xBtn_close.png') no-repeat 50%/cover; } #locationWrap .sub_util .btn_print:after {content: ''; display: block; margin: auto; width:20px; height:20px; background:url('/ps/img/cmmImg_2020/common/ico_print.png') no-repeat 50%/cover; } .shareList.on {display: block;} .shareList {display: none;position:absolute;right: 0;top: 62px;z-index:99;background:#fff;border:1px solid #8C817B;padding: 10px;box-shadow:0 2px 6px rgba(0,0,0,0.2);width: 410px;border-radius:4px;} .shareList li {float: left;} .shareList a {display:block;font-weight: 300;font-size: .75rem;color: #737373;text-align: center;width: 55px;height: 66px;padding-top: 48px;border-radius:0;background-repeat:no-repeat;background-position: 50% 2px;background-size: 40px auto;border-radius:50%;} .shareList a.twitter {background-image:url('/ps/img/cmmImg_2020/common/ico_twitter.png')} .shareList a.facebook {background-image:url('/ps/img/cmmImg_2020/common/ico_facebook.png')} .shareList a.blog {background-image:url('/ps/img/cmmImg_2020/common/ico_blog.png')} .shareList a.naver {background-image:url('/ps/img/cmmImg_2020/common/ico_naver.png')} .shareList a.line {background-image:url('/ps/img/cmmImg_2020/common/ico_line.png')} .shareList a.band {background-image:url('/ps/img/cmmImg_2020/common/ico_band2.png')} .shareList a.kakao {background-image:url('/ps/img/cmmImg_2020/common/ico_kakao.png')} .shareList a.kakaostory {background-image:url('/ps/img/cmmImg_2020/common/ico_kakaostory.png')} .shareList a.googel {background-image:url('/ps/img/cmmImg_2020/common/ico_googel.png')} .shareList a.scrap {background-image:url('/ps/img/cmmImg_2020/common/ico_scrap.png')} .shareList a.mailing {background-image:url('/ps/img/cmmImg_2020/common/ico_mailing.png')} .shareList a.urlcopy {background-image:url('/ps/img/cmmImg_2020/common/ico_urlcopy.png')} /* footer */ #footer .footerWrap {position: relative; height: 100%; padding:0;} #footer {clear:both;background: #353535;} #footer .siteWrap {} /*#footer .siteWrap:before {content:''; position: absolute; width: 100%; left:0;top:0;border-bottom:1px solid rgba(255,255,255,0.2); height: 46px;background-color:#11881f;}*/ /* sitelink */ .sitelink {display: block; width: 100%;} .sitelink > li {position:relative; display: block; width: 100%; } .sitelink > li:last-child {margin-right: 0;} .sitelink > li > button {position: relative; color: #f9f9f9; border-bottom:1px solid rgba(255,255,255,0.2); font-size: 15px; font-weight: 400; text-align: left; width: 100%; height: 46px; padding: 10px 15px 12px 20px;} .sitelink > li > button:after{display: block; content: ''; position: absolute; right:20px; top:16px; width:9px; height: 9px; border-bottom:1px solid #fff; border-right:1px solid #fff; transform:rotate(45deg);transition: transform 150ms ease-in-out; } .sitelink > li.on > button:after{top:22px; transform:rotate(-135deg); } .sitelink > li.far_service > button { border:1px solid #236fca; color: #236fca; } .sitelink > li.on > button {background-color: #444; color: #e7e7e7;} .sitelink > li .list {display: none; width: 100%; max-height: 235px; overflow-y: auto; position: absolute; bottom:44px; background-color: #535353; box-sizing: border-box; padding: 10px 10px 10px 20px;z-index:10;} .sitelink > li.on .list {display: block;} .sitelink > li .list dt:first-child {border-top: 0; padding-top: 0; margin-top: 10px;z-index:2;} .sitelink > li .list dt {color: #b7e3fe; font-size: 14px; font-weight: 400;margin: 20px 0 10px; border-top: 1px solid #818181; padding-top: 20px;} .sitelink > li .list dd {margin: 6px 0;} .sitelink > li .list dd a {color: #fff; font-size: 13px; font-weight: 200;} #footer .footerMenu {display: block; position:relative; width: 100%; overflow: hidden;} #footer .footerMenu ul + ul {padding-left:.5rem; display: inline-block;} #footer .ft_link {position: relative;width: 100%; display: block; padding-top: 30px;text-align: center;overflow: hidden;line-height: 1.6 !important;} #footer .ft_link li {position:relative; display: inline-block;} #footer .ft_link li {padding-right:1.3rem;} #footer .ft_link li:last-child {padding-right:0;} #footer .ft_link li:after {content:'';position:absolute; top:56%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:.5rem;width:1px;height:10px;background:rgba(255,255,255,0.2);} #footer .ft_link li:last-child:after {display: none;} #footer .ft_link li a { position: relative; font-weight: 300; font-size: 15px; color: #f0f0f0;letter-spacing: -0.5px;display: block;} #footer .ft_link li a.privacy {color: #33b2ff;} #footer .ft_link2 {position: relative;width: 100%; display: block; padding-top: 1rem;text-align: center;overflow: hidden;} #footer .ft_link2 li {position:relative; display: inline-block;} #footer .ft_link2 li + li {padding-left:1rem;} #footer .ft_link2 li a img {vertical-align: middle;} #footer .ft_outlink {width: 100%; display: block; text-align: center;} #footer .ft_outlink ul {margin-top: 1rem; display: inline-block; overflow: hidden;} #footer .ft_outlink li {position:relative; display: inline-block; vertical-align: middle;} #footer .ft_outlink li a {display: block; } #footer .ft_outlink li a img {vertical-align: middle;} #footer .ft_outlink .snsLink li a.ico {display:block;float:left;margin:0 .3rem;width:35px;height:35px;border-radius:0;background-repeat:no-repeat;background-position:50% 50%;background-size:35px 35px;border-radius:50%;} #footer .ft_outlink .snsLink li a.facebook {background-image:url('/ps/img/cmmImg_2020/common/ico_facebook.png')} #footer .ft_outlink .snsLink li a.twitter {background-image:url('/ps/img/cmmImg_2020/common/ico_twitter.png')} #footer .ft_outlink .snsLink li a.blog {background-image:url('/ps/img/cmmImg_2020/common/ico_blog.png')} #footer .cs_tel {display: block; margin-top:1rem; position: relative; text-align: center;overflow: hidden; } #footer .cs_tel dt {display: inline-block; font-weight: 300; font-size: 16px; color: #fff;} #footer .cs_tel dd {display: inline-block; margin-left:.5rem; font-weight: 500; font-size: 25px; color: #fff799;} #footer .footerInfo { display: block; position:relative; width: 100%; overflow: hidden; margin-top: 12px; padding: 20px 0 40px; border-top: 1px solid rgba(255,255,255,0.1);} #footer .footerInfo {position: relative; font-size: 15px;text-align: center;} #footer .footerInfo .rdaLogo { display: inline-block; margin-right: 1.2rem; float: left;} #footer .footerInfo address {} #footer .footerInfo span { position: relative; display: block; font-weight: 300; color: rgba(255,255,255,.7);line-height: 1.6 !important;} #footer .footerInfo span:before{content: none;} #footer .footerInfo span:first-child { padding-left: 0; margin-left: 0;} #footer .footerInfo span:first-child:before {display: none;} #footer .footerInfo img {margin-left: 5px; vertical-align: baseline;} #footer .footerInfo p.copyright {font-weight: 200;font-size: 14px;color: rgba(255,255,255,.5);} /* 만족도조사 */ #satisfaction {background:#fff; box-sizing:border-box; border:1px solid #ddd; border-top:1px solid #7d7d7d; position:relative; max-width:1200px; margin:50px auto; } #satisfaction .open_mark, #satisfaction .title {padding:15px 0; text-align: left; margin:0 2.5%; font-size:15px; color:#393939; position:relative; /*border-bottom:1px dotted #ddd;*/} #satisfaction .title {line-height:35px; display:none;} #satisfaction .open_mark:after {content:''; display:block; clear:both;} #satisfaction .open_mark img {display:block; float:left; margin:0 10px 0 0;} #satisfaction .open_mark span {display:inline-block; vertical-align:top; margin-top:5px;} #satisfaction .open_mark strong {font-weight:500; color:#203c92;} #satisfaction .manager_info {position:relative; padding:15px 0; margin:0 2.5%; font-size:15px;} #satisfaction .manager_info:after {content:''; display:block; clear:both;} #satisfaction .manager_info ul {float:left;} #satisfaction .manager_info ul li {margin-top:3px; padding:0 0 0 12px; position:relative;text-align: left;} #satisfaction .manager_info ul li:first-child {margin-top:0;} #satisfaction .manager_info ul li:after {content:''; display:block; width:3px; height:3px; background:#1a5bb1; position:absolute; left:2px; top:11px;} #satisfaction .manager_info ul li span {display:inline-block; font-weight: 500; padding:0 10px 0 0; margin-right:10px; position:relative;} #satisfaction .manager_info ul li span:after {content:''; display:block; width:1px; height:10px; background: rgba(0,0,0,0.2); position:absolute; right:0; top:8px;} #satisfaction .manager_info ul li a {display:inline-block; margin-left:10px; text-decoration:none;} #satisfaction .manager_info ul li a.tel:before {content:"☎"; display:inline-block; margin-right: 3px;} #satisfaction .manager_info .date {float:right; text-align: left;} #satisfaction .manager_info .date span {display:inline-block; font-weight: 500;padding:0 10px 0 22px; margin-right:10px; position:relative;line-height: 1.6 !important; background:url('/ps/img/cmmImg_2020/common/ico_date.png') no-repeat left 5px;} #satisfaction .manager_info .date span:after {content:''; display:block; width:1px; height:10px; background: rgba(0,0,0,0.2); position:absolute; right:0; top:8px;} #satisfaction .evaluation {padding:25px 2.5%; background:#f0f3f8;} #satisfaction .evaluation dl {} #satisfaction .evaluation dl dt {color:#393939; font-weight: 500; text-align: left; padding:0 0 0 35px; line-height:24px; background:url('/ps/img/cmmImg_2020/common/ico_evaluation.png') no-repeat left top;} #satisfaction .evaluation dl dd {position:relative; padding:0 50% 0 0;} #satisfaction .evaluation dl dd ul.check {width:auto; padding:8px 0 0 35px;} #satisfaction .evaluation dl dd ul.check:after {content:''; display:block; clear:both;} #satisfaction .evaluation dl dd ul.check li {float:left; margin-bottom:5px;} #satisfaction .evaluation dl dd ul.check li:last-child {margin-right:0;} #satisfaction .evaluation dl dd ul.check li label {font-size:15px; color:#5d5d5d; margin-right: 20px;vertical-align: middle;} #satisfaction .evaluation dl dd ul.radio_btn li input[type="radio"] {width:16px;height:16px;vertical-align: middle; margin-right: 3px;} #satisfaction .evaluation dl dd ul.radio_btn li input[type="radio"]:checked + label {font-weight:500; } #satisfaction .evaluation dl dd .opinionWrap {width:50%; position:absolute; right:0; top:0; box-sizing:border-box; padding-right:80px;} #satisfaction .evaluation dl dd .opinionWrap input[type="text"] {width:100%; border:1px solid #bcc3c6; background-color:#fff; border-right:0; height:38px; line-height:38px; font-size:15px;text-indent: 6px;} #satisfaction .evaluation dl dd .opinionWrap input[type="text"]::-webkit-input-placeholder {font-weight: 300;color:#b7b7b7;} #satisfaction .evaluation dl dd .opinionWrap input[type="text"]:-moz-placeholder {font-weight: 300;color:#b7b7b7;} #satisfaction .evaluation dl dd .opinionWrap input[type="text"]::-moz-placeholder {font-weight: 300;color:#b7b7b7;} #satisfaction .evaluation dl dd .opinionWrap input[type="text"]:-ms-input-placeholder {font-weight: 300;color:#b7b7b7;} #satisfaction .evaluation dl dd .opinionWrap input[type="button"] {width:80px; font-size:15px; cursor:pointer; line-height:38px; height:100%; border:0; background:#156da9; color:#fff; text-align:center; position:absolute; right:0; top:0;} /* btn-popup */ .btn-popup {position:fixed; right:2%; bottom:5rem; z-index:60; width:3.5rem; height:3.5rem; padding:0; background: rgba(0,0,0,0.5);border-radius: 50%; text-indent:-99999rem} /* btn-gotop */ .btn-gotop {position:fixed; right:2%; bottom:2%; z-index:60; width:3.5rem; height:3.5rem; padding:0; background: rgba(0,0,0,0.5);border-radius: 50%;/* background:url('/ps/img/cmmImg_2020/common/topBtn.png') no-repeat 100% 50%; background-size:100% auto;*/ text-indent:-99999rem} .btn-gotop::before { content: ''; display: inline-block; width: 2px; height: 15px; background-color: #fff; position: absolute; left: 50%; transform: translateX(-50%); top: 20px; transition: background-color 0.3s;} .btn-gotop::after { content: ''; display: inline-block; width: 8px; height: 8px; position: absolute; border: 2px solid #fff; border-bottom: none; border-right: none; transform: translate(-50%, -50%) rotateZ(45deg); left: 50%; top: 50%; margin-top: -4px; transition: border 0.3s;} .btn-sec {display: flex;justify-content: center;width: 100%;padding-top: 50px; padding: .25%;} /* 관심작목설정 팝업 */ .setPopWrap {display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); z-index: 999; } .setPopWrap .setPopArea {width: 100%;max-width: 800px; height: 100%; max-height: 85%; padding-bottom: 40px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-box-sizing: border-box; box-sizing: border-box; background: #fff; border: 1px solid #11881f; border-radius: 1.5rem;} .setPopWrap .setPopArea .setPop_top h3.popTit { padding: 1.5rem; font-size: 1.8rem; color: #222;font-weight: 500; border-bottom: 1px solid #ddd; position: relative;letter-spacing: -.05rem; } .setPopWrap .setPopArea .setPop_top p { padding: 1.5rem; font-size: 1.125rem; font-weight: 500; text-align: center; } .setPopWrap .setPopArea .setPop_top p span { font-size: 1rem;font-weight: 300; } .setPopWrap .setPopArea .setPop_top p em {display: block;font-size: .85rem;font-weight: 300;color: #dc0000;} .setPopWrap .setPopArea .setPop_top .setting_Cont { position:relative; margin: 0 2rem; } .setPopWrap .setPopArea .setPop_Cont ul li { width: 50%; margin-bottom: 0; padding-right: 0; text-align: center; } .setPopWrap .setPopArea .setPop_Cont ul li .checkbox { display: block; } .setPopWrap .setPopArea .setPop_Cont ul li .checkbox input[type="checkbox"] + label { display: block; height: 11.11vw; line-height: 11.11vw; padding-left: 0; font-size: 3.61vw; color: #999; font-weight: 300; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; background: transparent; background-size: auto; } .setPopWrap .setPopArea .setPop_Cont ul li:nth-of-type(2n-1) .checkbox input[type="checkbox"] + label { border-left: 1px solid #ddd; } .setPopWrap .setPopArea .setPop_Cont ul li:nth-of-type(1) .checkbox input[type="checkbox"] + label { border-top: 1px solid #ddd; } .setPopWrap .setPopArea .setPop_Cont ul li:nth-of-type(2) .checkbox input[type="checkbox"] + label { border-top: 1px solid #ddd; } .setPopWrap .setPopArea .setPop_Cont ul li .checkbox input[type="checkbox"]:checked + label { background: #ff8400; border-color: #ffa94d; color: #fff; } .setPopWrap .setPopArea .btn_wrap { position: absolute; width: 100%; bottom: 1.5rem; padding-top: 2rem; margin: 0;} .setPopArea .setPop_Cont { margin: 0 2rem; padding: 1rem 0; border: 0; overflow-y:auto !important;} .contactBoard dl {width: 100%; margin: 20px 0; /*border-top: 1px solid #eee;*/ display: table;} .contactBoard dt {position: relative; padding-top: 5px; margin-bottom: 12px; font-size: 20px; color: #333; font-weight: 500; letter-spacing: -.05rem;} .contactBoard dt:before {content:'';position:absolute;top: 0; left:0; width:5px; height:5px; background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%); border-radius: 50%;} .contactBoard dd {position: relative;} .contactBoard dd + dd {margin-top:.6rem} .contactBoard .optionGroup { overflow: hidden;} .contactBoard .optionBox {position: relative; float: left; display: inline-flex;width: 100%;width: calc(100% - 80px);overflow: hidden;} .contactBoard .optionBox select {width: 50%;height: 38px;border-radius: 4px;padding: 0 40px 0 16px;margin-right: .4rem; border: 1px solid #ddd;background: #fff url("/ps/img/cmmImg_2020/common/select_Sarrow.png") center right 12px no-repeat;background-size: 10px auto;-webkit-appearance: none;-moz-appearance: none;-o-appearance:none;} .contactBoard .optionBox select::-ms-expand { display: none; } .contactBoard .optionBox input { width: 100%;height: 38px;padding: 0 .6rem;border-radius: 4px;border: 1px solid #ddd;margin-right: .4rem; } .contactBoard input[type="text"]::-webkit-input-placeholder {font-weight: 300;color:#999;font-size: .88rem;} .contactBoard input[type="text"]:-moz-placeholder {font-weight: 300;color:#999;font-size: .88rem;} .contactBoard input[type="text"]::-moz-placeholder {font-weight: 300;color:#999;font-size: .88rem;} .contactBoard input[type="text"]:-ms-input-placeholder {font-weight: 300;color:#999;font-size: .9rem;} .contactBoard p.point_Ttxt {color:#06378e;font-size: 15px;text-align: center;} .contactBoard p.point_txt {color:#156da9;font-size: 12px;line-height: 25px;overflow: hidden;} .contactBoard p.point_txt em {float: right;color:#f35000;} .contactBoard .btnSec {clear: both;position: relative;text-align: center; margin-top: 1rem;} .contactBoard .proundBtn {display: inline-block;min-width: 80px;height: 38px;line-height: 36px;border-radius: 4px;text-align: center;transition: 0.5s;color: #fff;background-color: #6d6c76;padding: 0;} .contactBoard .proundBtn.pbtnSet {color: #fff;background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);} .contactBoard .proundBtn.pbtnSet:hover {color: #fff; background-color:#11881f; } .search_items { display: none;} .search_items.on { display: block;} .search_items ul.colList { padding: 0.6rem;overflow: hidden; margin:0;background: #f2f2f2; border-radius: 4px;} .search_items ul.colList li {position: relative; float: left; padding: .3rem;} .search_items li a {display: block; padding: 0 .5rem; font-size: .85rem;background:#fff;height: 30px;line-height: 28px;color: #555;text-align: left;cursor: pointer;white-space: nowrap;-webkit-border-radius: 4px;border-radius: 4px; letter-spacing: -0.03em; transition: 0.5s;} .search_items li a:hover {color:#fff; background:#11881f;} .search_items li.active a {color:#fff; background:#11881f;font-weight:500;} .search_items p.reTxt { padding: 1rem; min-height: 50px;font-weight:400;font-size: .85rem;background: #f2f2f2; border-radius: 4px;margin: 1rem auto;} .search_items p.reTxt strong {color:#11881f;font-weight:500;} .setPopWrap .setting_Cont {position: relative; background-color: #f3f6f9; padding: 1.2rem; border-radius: 6px;} .setPopWrap .setting_Cont .settingList {position: relative; overflow: hidden;} .setPopWrap .setting_Cont .settingList li {position: relative; display: inline-block; margin: 4px 10px 4px 0;} .setPopWrap .setting_Cont .settingList li button{height:36px; padding:0 1rem; border: 1px solid #156da9; background:#156da9; border-radius:18px;} .setPopWrap .setting_Cont .settingList li button span.tag{font-size: 0.925rem; color: #fff; font-weight: 500;} .setPopWrap .setting_Cont .settingList li button span.tagDel{display:inline-block; width:11px; height:11px; margin: 0 0 2px 7px; text-indent:-9999px;background:url('/ps/img/cmmImg_2020/common/ico_tagDelW.png') no-repeat;vertical-align: middle; opacity: 0.5;} .setPopWrap .setting_Cont .settingList li button:hover {border: 1px solid #156da9; background:#fff;} .setPopWrap .setting_Cont .settingList li button:hover span.tag {color: #156da9; } .setPopWrap .setting_Cont .settingList li button:hover span.tagDel {opacity: 1;background:url('/ps/img/cmmImg_2020/common/ico_tagDel.png') no-repeat;} .setPopWrap .prodPop_xClose {position:absolute;top:1.5rem;right:1.5rem;width:46px;height:46px;/*border:solid 1px #fff;*/background:transparent;text-indent:-9999px;/*outline:none;*/} .setPopWrap .prodPop_xClose:before, .setPopWrap .prodPop_xClose:after{content:'';display:block;position:absolute;top:50%;left:50%;width:34px;height:2px;margin-left:-17px;background:#222;} .setPopWrap .prodPop_xClose:before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);} .setPopWrap .prodPop_xClose:after{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);} .btn_wrap {display: flex; margin: 0 2rem; padding-top: 40px; text-align: center;} .btn_wrap a { display: inline-block;} .btn_wrap a + a {margin-left: 1rem; } .btn_wrap { padding: 0 1.5rem; } .roundBtn { display: inline-block; width: 100%; padding: 0.8rem; font-size: 1.125rem; font-weight: 500; border-radius: 6px; text-align: center; } .roundBtn.btnSet { background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%); color: #fff; } .roundBtn.btnReset { background: #6d6c76;color: #fff;} .lineRoundBtn { display: inline-block; width: 180px; height: 48px; line-height: 46px; font-size: 16px; font-weight: 600; border-radius: 6px; text-align: center; } .lineRoundBtn.gray { border: 1px solid #ddd; color: #999; } .cont-type-area p { padding: 1.5rem; font-size: 1rem; font-weight: 500; text-align: center; } .cont-type-area p span { font-size: .9rem;font-weight: 300; } .cont-type-area p em {display: block;font-size: .85rem;font-weight: 300;color: #f00000;} .cont-type-area .setting_Cont {position: relative; background-color: #f3f6f9; padding: 1.2rem; border-radius: 6px;} .cont-type-area .setting_Cont .settingList {position: relative; overflow: hidden;} .cont-type-area .setting_Cont .settingList li {position: relative; display: inline-block; margin: 4px 10px 4px 0;} .cont-type-area .setting_Cont .settingList li button{height:34px;padding:0 1rem; border: 1px solid #156da9; background:#156da9; border-radius:18px;} .cont-type-area .setting_Cont .settingList li button span.tag{font-size: 0.9rem; line-height: 32px;color: #fff; font-weight: 500;} .cont-type-area .setting_Cont .settingList li button span.tagDel{display:inline-block; width:11px; height:11px; margin: 0 0 2px 7px; text-indent:-9999px;background:url('/ps/img/cmmImg_2020/common/ico_tagDelW.png') no-repeat;vertical-align: middle; opacity: 0.5;} .cont-type-area .setting_Cont .settingList li button:hover {border: 1px solid #156da9; background:#fff;} .cont-type-area .setting_Cont .settingList li button:hover span.tag {color: #156da9; } .cont-type-area .setting_Cont .settingList li button:hover span.tagDel {opacity: 1;background:url('/ps/img/cmmImg_2020/common/ico_tagDel.png') no-repeat;} .cont-type-area .setPop_Cont ul li { width: 50%; margin-bottom: 0; padding-right: 0; text-align: center; } .cont-type-area .setPop_Cont ul li .checkbox { display: block; } .cont-type-area .setPop_Cont ul li .checkbox input[type="checkbox"] + label { display: block; height: 11.11vw; line-height: 11.11vw; padding-left: 0; font-size: 3.61vw; color: #999; font-weight: 300; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; background: transparent; background-size: auto; } .cont-type-area .setPop_Cont ul li:nth-of-type(2n-1) .checkbox input[type="checkbox"] + label { border-left: 1px solid #ddd; } .cont-type-area .setPop_Cont ul li:nth-of-type(1) .checkbox input[type="checkbox"] + label { border-top: 1px solid #ddd; } .cont-type-area .setPop_Cont ul li:nth-of-type(2) .checkbox input[type="checkbox"] + label { border-top: 1px solid #ddd; } .cont-type-area .setPop_Cont ul li .checkbox input[type="checkbox"]:checked + label { background: #ff8400; border-color: #ffa94d; color: #fff; } .cont-type-area .btn_wrap { position: absolute; width: 100%; bottom: 1.5rem; padding-top: 2rem; margin: 0;} .tblrow { display: table-row; margin: 0; padding: 0;} .tblth { display: table-cell; float: none; width: 160px; padding: 10px 0; color: #222; font-weight: 500; line-height: 1; text-align: left;vertical-align: top;} .tblth span { display: inline-block; position: relative; top: 11px; line-height: 1; font-size: inherit; color: inherit; font-weight: inherit;} .tbltd {display: table-cell; position: relative; width: 720px; margin-left: 160px; padding: 10px 0; line-height: 40px; font-size: 15px;} /* 자주찾는서비스 설정_팝업 */ .contactBoard ul { margin: -.15rem; overflow: hidden;} .contactBoard li {padding: .3rem;} .sMenuList { position: relative; display: block;} .sMenuList:after{content:''; display:block; clear:both;} .sMenuList li{ float:left; width:20%;} .sMenuList input[type="checkbox"]{position:absolute;width:1px;height:1px;margin:-1px;border:0;overflow:hidden;padding:0;clip:rect(0,0,0,0);-webkit-appearance:none;opacity:0} /* input 초기화 */ .sMenu_chk input[type="checkbox"] + label{display: block; margin: auto; text-align: center;padding: .8rem .6rem .6rem;border:1px dashed #d4d4d4;background-color:#f6f6f6;border-radius:10px;cursor: pointer;} .sMenu_chk input[type="checkbox"] + label:before{position:absolute;top:10px;left:inherit;right:13px} .sMenu_chk input[type="checkbox"]:checked + label{border:1px solid #156da9;background-color: #156da9;} .sMenu_chk .lb{display: block; margin-top:.4rem; font-size: 0.925rem; font-weight:300; color:#454545; vertical-align:middle;letter-spacing: -0.03em;} .sMenu_chk input[type="checkbox"]:checked + label .lb {font-weight:500;color:#fff;} .sMenu_chk input[type="checkbox"]:checked + label i.iCo_tag {background-color: #fff;} .sMenu+label{display:inline-block;position:relative;color:#3f3f3f;vertical-align:top;cursor:pointer} .sMenu:focus+label{outline:dotted 1px;outline:-webkit-focus-ring-color auto 10px} .sMenuList i.iCo_tag {position: relative; display: block; width:50px; height:50px; line-height:50px; margin: auto;overflow: hidden;border-radius:50%; box-sizing: border-box; background:#FFF;} .sMenuList i.iCo_tag:before { content:'';display:block; position: absolute; width: 40px; height: 40px; left: 0; top: 0; bottom: 0; right: 0; margin: auto; background-image:url("/ps/img/cmmImg_2020/main/main-service-icon.png");background-size: 440px auto; background-position: 50% 50%;background-repeat:no-repeat;vertical-align: middle; transition: all 0.3s ease;} .sMenuList i.iCo_tag.siC01:before { background-position:0 0;} /* 주간농사 정보 */ .sMenuList i.iCo_tag.siC02:before { background-position:-40px 0;} /* 농업날씨 */ .sMenuList i.iCo_tag.siC03:before { background-position:-80px 0;} /* 농산물가격 */ .sMenuList i.iCo_tag.siC04:before { background-position:-120px 0;} /* 병해충정보 */ .sMenuList i.iCo_tag.siC05:before { background-position:-160px 0;} /* 농약정보 */ .sMenuList i.iCo_tag.siC06:before { background-position:-200px 0;} /* 작목기술정보 */ .sMenuList i.iCo_tag.siC07:before { background-position:-240px 0;} /* 농작업일정 */ .sMenuList i.iCo_tag.siC08:before { background-position:-280px 0;} /* 교육 */ .sMenuList i.iCo_tag.siC09:before { background-position:-320px 0;} /* 지방농촌소식(행사) */ .sMenuList i.iCo_tag.siC10:before { background-position:-360px 0;} /* 보도자료 */ .sMenuList i.iCo_tag.siC11:before { background-position:-400px 0;} /* 동영상 */ /* ********************************************************************************* * @media screen and ( min-width:1200px ) * *********************************************************************************/ @media screen and ( min-width:1200px ){ #header .btn-utilWrap .utilArea .btn-login {position:relative; } #header .btn-utilWrap .utilArea .btn-login + .btn-login:before {content:'';position:absolute;top:56%;-webkit-transform:translateY(-50%);transform:translateY(-50%);left: 0;margin-left: -.5rem;width:1px;height:10px;background: rgba(0,0,0,0.2);} #header .btn-utilWrap .btn-login { display: block; padding: 0.17rem;} #header .btn-utilWrap .btn-login a.loGin {display:inline-block; position:relative; padding-left: 25px;} #header .btn-utilWrap .btn-login a.loGin:before { content: ''; display: inline-block; position: absolute; top: 5px; left: 0px; width: 16px; height: 16px; background: url('/ps/img/cmmImg_2020/common/ico_login.png') no-repeat;} #mainNav {display:none;} .mobile-only {display:none !important} /* nav */ #nav_wrap nav {display:block; } #gnb {margin-left: 136px; vertical-align: middle;} #gnb > ul.gnbMenu {width:auto; height:100%; display:inline-block; vertical-align:middle; letter-spacing: -0.05em; } #gnb > ul.gnbMenu > li{width:auto; height:100%; display:inline-block;float: left;} #gnb > ul.gnbMenu > li > a {display:block; position:relative; margin:0 20px; line-height:88px;overflow: hidden; font-size:1.125rem; font-weight:500; color:#333;} #gnb > ul.gnbMenu > li > a:before{content:''; position:absolute; width:0; height:6px; background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%); top: 18px;left: 50%; margin-left: -3px; border-radius: 50%; } #gnb > ul.gnbMenu > li > a.subMenuListOn:before{content:'';width:6px;-webkit-transition:all .5s ease; transition: all .5s ease;} #gnb > ul.gnbMenu > li > a.subMenuListOn:hover, #gnb > ul.gnbMenu > li > a.subMenuListOn:focus, #gnb > ul.gnbMenu > li > a.subMenuListOn:active{color:#111;} #gnb > ul.gnbMenu > li > a.active {color:#111;background:none !important;} #gnb > ul.gnbMenu > li > a.active:before{content:''; position:absolute; width:6px; height:6px; background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%); top: 18px;left: 50%; margin-left: -3px; border-radius: 50%; } #gnb > ul.gnbMenu > li > a span {display: inline-block;position:relative;font-size: 10px;border-radius: 3px;background-image: linear-gradient(120deg,#11881f,#156da9);color: #fff;padding: 4px 5px;line-height: 1;letter-spacing: -.03em;font-weight: 300;vertical-align: middle;margin-left: 8px;/* padding-left: 10px; */} #gnb > ul.gnbMenu > li > a span:after{content:'';display:block;position:absolute;left: -8px;top: 6px;margin-top: 0;border-bottom: 6px solid #11852e;border-right: 6px solid transparent;border-left: 6px solid transparent;transform: rotate(-90deg);transition:0.3s ease;} #gnb > ul.gnbMenu > li.active > a:after{content:''; width:100%; height:4px; position:absolute; bottom:0; left:0; background-color:#005bb4;} #gnb > ul.gnbMenu > li.current > a{color:#005bb4;} #gnb > ul.gnbMenu > li.current > a:after{content:''; width:100%; height:4px; position:absolute; bottom:0; left:0; background-color:#005bb4;} #gnb > ul.gnbMenu > li.full_menu{margin-right:0; position:relative;} #gnb > ul.gnbMenu > li.full_menu:before{content:''; width:20px; height:2px; position:absolute; top:30px; left:0; background-color:#1f1f1f;} #gnb > ul.gnbMenu > li.full_menu:after{content:''; width:20px; height:2px; position:absolute; bottom:29px; left:0; background-color:#1f1f1f;} #gnb > ul.gnbMenu > li.full_menu span{display:block; padding-left:30px;} #gnb > ul.gnbMenu > li.full_menu span:before{content:''; width:15px; height:2px; margin-top:-1px; position:absolute; top:50%; left:5px; background-color:#1f1f1f;} #gnb > ul.gnbMenu > li > div.subMenuList{display:none; width:100%; position:absolute; top:88px; left:0; border-top:1px solid #11881f; background-color:#F7F7F7;z-index: 999;box-shadow:1px 1px 8px rgba(0,0,0,.1);} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt{width:100%; max-width:1200px; margin:0 auto; padding:35px 0; overflow:hidden; position:relative;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt h3.mlCntTit { width:170px; float:left; font-size:1.5rem; font-weight:600; color:#004d97; letter-spacing:-2px;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt h3.mlCntTit span {display: inline-block;position:relative;font-size: 10px;border-radius: 3px;background-image: linear-gradient(120deg,#11881f,#156da9);color: #fff;padding: 4px 5px;line-height: 1;letter-spacing: -.03em;font-weight: 300;vertical-align: middle;margin-left: 8px;/* padding-left: 10px; */} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt h3.mlCntTit span:after{content:'';display:block;position:absolute;left: -8px;top: 6px;margin-top: 0;border-bottom: 6px solid #11852e;border-right: 6px solid transparent;border-left: 6px solid transparent;transform: rotate(-90deg);transition:0.3s ease;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul{width:1000px; float:right; overflow:hidden; font-size:0;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li{display:inline-block; width:calc(20% - 20px); margin-top:24px; margin-left:25px; position:relative; vertical-align:top;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li:nth-child(5n+1){margin-left:0;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li:nth-child(1), #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li:nth-child(2), #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li:nth-child(3), #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li:nth-child(4), #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li:nth-child(5){margin-top:0;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > a{display:block; line-height:22px; font-size:.95rem; font-weight:500; padding:6px 10px; color:#0058af; word-break:keep-all; /*border:1px solid #7a99b7; */background-color:#fff;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > a:hover, #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > a:focus{background-color:#fafafa; color:#fff; /*border:1px solid #fff;*/background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li.current > a{background-color:#0058af; color:#fff;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > ul{padding:6px 0 0 0;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > ul li a{display:block; padding:3px 0 3px 10px; font-size:0.9rem; color:rgba(0,0,0,0.6);} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > ul li a:hover, #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > ul li a:focus{color:#000;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > ul li.current a{font-weight:500; color:#000; text-decoration:underline;} /* #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li{display:inline-block; width:calc(120px - 20px); margin-top:24px; margin-left:25px; position:relative; vertical-align:top;} #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li > a {text-align: center;color: #555; border: 1px solid #dcdcdc;} #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li > a:hover, #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li > a:focus{color: #254b91;background-color:#fff; background-image:none;border: 1px solid #254b91;} #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li > a:before {content:''; display:block;width:80px;height:60px; background-size: 40px auto;background-repeat: no-repeat; background-position: center;opacity: 0.75;transition: all 0.3s ease;} #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li > a:hover:before {opacity: 1;} #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li:nth-child(1) > a:before{background-image:url('http://10.30.200.47:8080/ps/img/2020Img/nongbak_lm01_on.png'); } #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li:nth-child(2) > a:before{background-image:url('http://10.30.200.47:8080/ps/img/2020Img/nongbak_lm02_on.png'); } #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li:nth-child(3) > a:before{background-image:url('http://10.30.200.47:8080/ps/img/2020Img/nongbak_lm03_on.png'); } #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li:nth-child(4) > a:before{background-image:url('http://10.30.200.47:8080/ps/img/2020Img/nongbak_lm04_on.png'); } #gnb > ul.gnbMenu > li.gnb6 > div.subMenuList div.mlCnt > ul > li:nth-child(5) > a:before{background-image:url('http://10.30.200.47:8080/ps/img/2020Img/nongbak_lm05_on.png'); } */ /* [새창]표시-icon */ #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul li a[target="_blank"]:after {content:'';display: inline-block; background:url('/ps/img/cmmImg_2020/common/ico_blank.png') no-repeat; width:11px; height:12px; vertical-align:middle; margin:-2px 0 0 5px;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > a:hover[target="_blank"]:after {content:'';display: inline-block; background:url('/ps/img/cmmImg_2020/common/ico_blank_w.png') no-repeat; width:11px; height:12px; vertical-align:middle; margin:-2px 0 0 5px;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > ul li.blank a{padding:5px 0 5px 15px;} #gnb > ul.gnbMenu > li > div.subMenuList div.mlCnt > ul > li > ul li.blank a:after{display:inline-block; position:static; margin-left:7px; vertical-align:-3px;} #gnb > ul.gnbMenu > li.active > div.subMenuList{display:block;} #gnb_message{display:none;} #gnb_message p{font-size:15px; color:#333; text-align:center;} /* 전체메뉴 */ #mainNav {position:fixed;z-index:100001;left: 0;top:0;bottom:0;padding:0;display:none;width:100%;background:#fff url('/ps/img/cmmImg_2020/common/nongsa_bg.png') no-repeat right bottom;overflow-y:scroll;} #mainNav .util_link {position:absolute; top: 60px; left: 30px;} #mainNav .util_link a.btn {display:inline-block;background: none; margin: 0 auto; border: 1px solid #fff; font-size: 14px; padding: 0.4rem 1rem; color: #fff !important; /*background: #555; opacity: 0.5;*/} #mainNav .util_link a.btn:hover {border: 1px solid #fff;background: #fff;color: #000 !important;font-weight:500;} .allMenuNav {position:relative;width:100%;display:table; padding: 110px 0 0;margin:0 auto;padding-bottom:60px;color:#fff;} .allMenuNav:before {content:'';position:absolute;left: 0;top:0;bottom:0;padding:0;width:18%;z-index: -1;background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);} #mainNav .allMenuTit {position: absolute; width: 100%;text-align: center;color: #222;margin:20px auto;} #mainNav .allMenuTit .nlogo {text-indent:-9999px;display:inline-block; width:84px; height:61px; background:url('/ps/img/cmmImg_2020/common/nongsaro_logo.png') no-repeat 0 0/cover;vertical-align: bottom;margin-right:12px;} /* 메뉴 속성 및 사이즈 조정 */ .allMenuNav .depth1m.rda_aeh {display:none;} .allMenuNav .depth1m {display: block; width: 100%; padding: 30px; border-bottom: 1px dotted rgba(0, 0, 0, .15); overflow: hidden;} .allMenuNav .depth1m:last-child {border-bottom:0px;} .allMenuNav .depth1m > a {position: relative;display: inline-block; width:18%;padding:0 5px;font-size:24px;line-height:32px;color:#fff;font-weight:500;} .allMenuNav .depth2m li {line-height:38px;display: inline-block; width: calc(20% - .2rem); position: relative; vertical-align: top;margin-top:1rem; padding: .5rem;/*margin-right: 20px;*/} .allMenuNav .depth2m li:nth-child(1), .allMenuNav .depth2m li:nth-child(2), .allMenuNav .depth2m li:nth-child(3), .allMenuNav .depth2m li:nth-child(4), .allMenuNav .depth2m li:nth-child(5){margin-top:0;} .allMenuNav .depth2m li:nth-child(5), .allMenuNav .depth2m li:nth-child(10){margin-right:0;} .allMenuNav .depth2m {display: inline-block; width: 80%; float: right; overflow: hidden;vertical-align: top;} .allMenuNav .depth2m > li > p a, .allMenuNav .depth2m li > a {display: block;font-size:16px;font-weight:500;letter-spacing: -.05em; color:rgba(0, 0, 0, .75);text-decoration:none; border: 1px solid #dadada;text-align: center;} .allMenuNav .depth3m li:before {display:inline-block;content:'-';margin-right:5px;color:rgba(0, 0, 0, .3);} .allMenuNav .depth3m li p {display:inline-block;} .allMenuNav .depth3m {margin-left:8px;margin-top: 10px;} .allMenuNav .depth3m li {line-height:26px;width: 100%; display: block;display: -webkit-box;margin-top:0;padding: 0;} .allMenuNav .depth3m li p a, .allMenuNav .depth3m li > a {display: inline-block;font-size:15px;font-weight:400;color:rgba(0, 0, 0, .75);text-decoration:none;letter-spacing: -.05em;padding: 0;border: 0;background: none;} .allMenuNav .depth4m li:before {display:inline-block;content:'·';margin-right:2px;} .allMenuNav .depth4m li p {display:inline-block;} .allMenuNav .depth4m {display: none;margin-left:10px;} .allMenuNav .depth4m li {line-height:22px;} .allMenuNav .depth4m li p a, .allMenuNav .depth4m li > a {font-size:13px;font-weight:300;color:rgba(0, 0, 0, .75);text-decoration:none;letter-spacing: -.1px;} .allMenuNav .depth5m {display: none;padding: 5px 8px; margin: 0 5px; background: rgba(0, 0, 0, .04);border-radius: 4px;} .allMenuNav .depth5m li p a, .allMenuNav .depth5m li > a {font-size:12px;font-weight:100;color:rgba(0, 0, 0, .75);text-decoration:none;letter-spacing: -.1px;} .allMenuNav .depth5m li {line-height:18px;} .allMenuNav .depth1m > a:hover{color:#fff;text-decoration: none; } .allMenuNav .depth1m > a:hover:before{content:''; position:absolute; width:18px; height:1px; background-color:#fff; top: 50%; right: 15px; margin-left: -3px; } .allMenuNav .depth2m li > a:hover {color:#fff; text-decoration: none; border: 1px solid #11881f;background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);} .allMenuNav .depth3m li > a:hover {color:#555; text-decoration: underline;border: 0;background-color:transparent;background-image:none;} /* [새창]표시-icon */ .allMenuNav .depth1m > a[target="_blank"]:after {content:'';display: inline-block; background:url('/ps/img/cmmImg_2020/common/ico_blank_w.png') no-repeat; width:11px; height:12px; vertical-align:middle; margin:-2px 0 0 5px;} .allMenuNav li > a[target="_blank"]:after {content:'';display: inline-block; background:url('/ps/img/cmmImg_2020/common/ico_blank.png') no-repeat; width:11px; height:12px; vertical-align:middle; margin:-2px 0 0 5px;} .nsGuide {position: absolute; top: 15px; left: 15px; width: 16%; line-height: 38px;} .nsGuide a.btnDown {display: block;font-size:16px;font-weight:500;letter-spacing: -.05em; color:#fff;text-decoration:none; border: 1px solid #dadada;text-align: center;transition: 0.5s;} .nsGuide a.btnDown:hover {color:#fff; background:#156da9;border: 1px solid #156da9;} .nsGuide i.icon {display: inline-block;margin-left: 8px;} .nsGuide i.icon.down {width: 9px; height: 10px; background-image: url('/ps/img/cmmImg_2020/common/ico_down.png');background-repeat: no-repeat;} /* 메뉴창 닫기 버튼 */ #mainNav button.menuClose {position:absolute;z-index:10;top:15px; right: 15px;/*left:50%;margin-left:-20px;*/width:80px;height:80px;border:solid 1px #11881f;background:transparent;text-indent:-9999px;cursor: pointer;} #mainNav button.menuClose:before, #mainNav button.menuClose:after{content:'';display:block;position:absolute;top:50%;left:50%;width:40px;height:2px;margin-left:-20px;background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);} #mainNav button.menuClose:before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);} #mainNav button.menuClose:after{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);} } /* ********************************************************************************* * @media all and (min-width:1px) and (max-width:1199px) * *********************************************************************************/ @media all and (min-width:1px) and (max-width:1199px){ #header .btn-utilWrap .btn-login { display: none; } header #nav_wrap nav { display: none;} #mainNav {display:block;} .mobile-hide {display:none !important} .mobile-only {display:block !important; } .allMenuNav {position:relative;width:100%;display:table;margin:0 auto;margin-top:130px;margin-bottom:30px;color:#fff;} #mainNav {display:none;float:none;position:fixed;left: 0;top:0;z-index:100001;width:100%;height:calc(100%);background-color:rgba(0,0,0,0.6)} #mainNav h2 {position:relative; padding:0 20px; height:80px; font-size:16px; line-height:80px; /*color:#fff;*/font-weight:500;/*background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);*/background-color: #f6f6f6;} #mainNav h2:before {content: ''; background:none;} #mainNav .nlogo {text-indent:-9999px;display:inline-block; width:66px; height:48px; background:url('/ps/img/cmmImg_2020/common/nongsaro_logo.png') no-repeat 0 0/cover;vertical-align: middle;margin-right:12px;} #mainNav .mobile-scroll {overflow:auto;position:fixed;top:0;right:0;width:250px;height:100%;height:101%;background-color:#fff; -webkit-overflow-scrolling:touch;} #mainNav .mobile-scroll .menu-close {position:absolute;z-index:10;top:10px; right: 0;width:60px;height:60px;background:transparent;font-size: 0;text-indent:-9999px;cursor: pointer;} #mainNav .mobile-scroll .menu-close:before, #mainNav .mobile-scroll .menu-close:after{content:'';display:block;position:absolute;top:50%;left:50%;width:34px;height:2px;margin-left:-17px;background-color:#444; } #mainNav .mobile-scroll .menu-close:before{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);} #mainNav .mobile-scroll .menu-close:after{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);} /* 202010506 로그인추가 */ #mainNav .util-menu {} #mainNav .util-menu .login-mobile {position:relative; padding: 14px 20px;border-bottom: 3px solid #dfdfdf;} #mainNav .util-menu .login-mobile a.loGin {display:inline-block; position:relative; padding-left: 24px;} #mainNav .util-menu .login-mobile a.loGin:before { content: ''; display: inline-block; position: absolute; top: 5px; left: 0px; width: 16px; height: 16px; background: url('/ps/img/cmmImg_2020/common/ico_login.png') no-repeat;} #mainNav .util-menu .mypage-mobile {position: absolute; top: 16px; right: 18px; z-index: 1;} #mainNav .util-menu .mypage-mobile a.myPage {display: block;position:relative;width: 18px;height: 18px;text-indent: -9999px;} #mainNav .util-menu .mypage-mobile a.myPage:before {content: '';display: inline-block;position: absolute;top: 0;right: 0px;width: 18px;height: 18px;background: url('/ps/img/cmmImg_2020/common/ico_set_off.png') center;background-size: 18px;} #mainNav .util-menu .logout-mobile {position: absolute; top: 18px; right: 18px; z-index: 1;} #mainNav .util-menu .logout-mobile a.logOut {display: block;position:relative;width: 18px;height: 18px;text-indent: -9999px;} #mainNav .util-menu .logout-mobile a.logOut:before {content: '';display: inline-block;position: absolute;top: 0;right: 0px;width: 18px;height: 18px;background: url('/ps/img/cmmImg_2020/common/ico_logout.png') center;background-size: 18px;} #mainNav .util-menu.mobile-only .login-mobile span {font-size: .925rem; font-weight: 500; letter-spacing: -.05rem;} #mainNav .util_link {position:relative; display:block; } #mainNav .util_link a {display:block; margin: 0 auto; text-align: center;} #mainNav .util_link a.btn { display:block; position:relative; background: none; font-size: 15px; margin:3px 15px; border: 1px solid #dfdfdf; background: #fff; border-radius: 22px; padding: 0.5rem 1rem; padding-left: 60px; color: #344554 !important; } #mainNav .util_link a.btn.rda { display:none; } #mainNav .util_link a.btn:hover {color: #fff !important; background: linear-gradient(to right, #0096d6, #5b3eb3); border: 1px solid #467ce1; font-weight:500;} /*#mainNav .util_link a:before {content: ''; position:absolute; width:25px; height:25px; left:22px; top: 5px; } #mainNav .util_link a.nongsaro:before {background: url("/ps/img/cmmImg_2020/common/icon_nongsaro.png") 0 0 no-repeat; background-size: contain;}*/ #mainNav .util_link a.nongsaro { background: rgba(0,0,0,0.18);padding:5px 0;margin:0 15px; border-radius: 25px;} #mainNav .util_link a.rda:before {background: url("/ps/img/cmmImg_2020/common/icon_rda.png") 0 0 no-repeat; background-size: contain;} #mainNav ul {float:none;margin-top:0;} #mainNav ul .depth1m.rda_aeh {display:block;} #mainNav ul .depth1m{float:none;margin:0 !important} #mainNav ul .depth1m > a{position:relative;display:block;width:100%;border-bottom:1px solid #dadada;line-height:54px;font-size:16px;font-weight:500;color:#333;text-align:left;text-indent: 20px;} #mainNav ul .depth1m > a:before, #mainNav ul .depth1m > a:after{content:'';display:block;position:absolute;top:50%;left:95%;width:12px;height:2px;margin-left:-20px;background-color:#778086; } #mainNav ul .depth1m > a:before{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);} #mainNav ul .depth1m > a.on{border-bottom:1px solid #156da9;background-color:#11881f; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%); color:#fff} #mainNav ul .depth1m > a.on:after{content:'';display:block;position:absolute;top:50%;left:95%;width:12px;height:2px;margin-left:-20px;background-color:#fff; } #mainNav ul .depth1m > a.on:before{content:none;} #mainNav ul .depth1m ul{display:none;position:relative;top:0;left:0;width:100%; padding:0; border-top:none; background-color:#363a3e} #mainNav ul .depth1m ul li.d2m a{position:relative;display:block;width:100%;border-bottom:1px solid #303437;background:none;background-size:auto;line-height:42px;font-size:14px;font-weight:400;color:rgba(255,255,255,.8);text-indent: 20px;} #mainNav ul .depth1m ul li.d2m a.parent{} #mainNav ul .depth1m ul li.d2m a.parent:before, #mainNav ul .depth1m ul li.d2m a.parent:after{content:'';display:block;position:absolute;top:50%;left:95%;width:10px;height:2px;margin-left:-18px;margin-top:-1px;background-color:rgba(255,255,255,.5); } #mainNav ul .depth1m ul li.d2m a.parent:before{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);} #mainNav ul .depth1m ul li.d2m a.on{} #mainNav ul .depth1m ul li.d2m a.parent.on:after{content:'';display:block;position:absolute;top:50%;left:95%;width:10px;height:2px;margin-left:-18px;background-color:rgba(255,255,255,.5);} #mainNav ul .depth1m ul li.d2m a.parent.on:before{content:none;} #mainNav ul .depth1m ul ul.d2m a.on:after{content:none;} #mainNav ul .depth1m ul ul.d2m a.on:before{content:none;} #mainNav ul .depth1m ul li.d2m ul{display:none;background-color:#43494d} #mainNav ul .depth1m ul ul li.d3m{} #mainNav ul .depth1m ul ul li.d3m a{position:relative;display:block;width:100%;border-bottom:1px solid rgba(0, 0, 0, .2);background:none;background-size:auto;line-height:42px;font-size:14px;font-weight:300;color:rgba(255,255,255,.67);text-indent:24px} #mainNav ul .depth1m ul ul li.d3m a.parent{} #mainNav ul .depth1m ul ul li.d3m a.parent:before, #mainNav ul .depth1m ul ul li.d3m a.parent:after{display: block;content: '';position: absolute;top: 50%;right: 22px; left: inherit;margin-top: -4px;width: 5px;height: 5px;border: solid rgba(255,255,255,.5);border-width: 0 1px 1px 0;background: transparent;transform:rotate(45deg);} #mainNav ul .depth1m ul ul li.d3m a.parent:before{content:'';position: absolute;top: 50%;margin-top: -8px;left: inherit;right: 17px;width: 15px;height: 15px;background: rgba(255, 255, 255, .1);border-radius: 3px;border: 0;transform: inherit;} #mainNav ul .depth1m ul ul li.d3m a.on{} #mainNav ul .depth1m ul ul li.d3m a.parent.on:after{content:'';display:block;position:absolute;top:50%;margin-top: -1px;right: 20px; left: inherit;width: 9px;height: 1px;transform: inherit; border: 0;background-color:rgba(255,255,255,.5);} #mainNav ul .depth1m ul ul li.d3m a.parent.on:before{content:'';position: absolute;top: 50%;margin-top: -8px;left: inherit;right: 17px;width: 15px;height: 15px;background: rgba(255, 255, 255, .1);border-radius: 3px;} #mainNav ul .depth1m ul ul li.d3m a.on:after{content:none;} #mainNav ul .depth1m ul ul li.d3m a.on:before{content:none;} #mainNav ul .depth1m ul ul li.d3m ul {display:none;padding:0 10px;background-color:#384046} #mainNav ul .depth1m ul ul ul li.d4m{} #mainNav ul .depth1m ul ul ul li.d4m a{position:relative;display:block;width:100%;background:none;border-bottom:1px solid rgba(255, 255, 255, .05);background-size:auto;line-height:34px;font-size:13px;font-weight:200;color:rgba(255,255,255,.5);text-indent:14px} /*#mainNav ul .depth1m ul ul ul li.d4m a:before{ content: "·"; margin-right: 3px;color: #ccc;}*/ #mainNav ul .depth1m ul ul ul li.d4m a.parent{} #mainNav ul .depth1m ul ul ul li.d4m a.parent:before, #mainNav ul .depth1m ul ul ul li.d4m a.parent:after{content:'';display:block;position:absolute;top:50%;left:99%;width:9px;height:1px;margin-left:-18px;margin-top:-1px;transform: rotate(90deg); border: 0;background-color:rgba(255,255,255,.4); } #mainNav ul .depth1m ul ul ul li.d4m a.parent:before{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);transform: inherit;} #mainNav ul .depth1m ul ul ul li.d4m:last-child a {border-bottom:0;} #mainNav ul .depth1m ul ul ul li.d4m a.parent.on {border-bottom:0;} #mainNav ul .depth1m ul ul ul li.d4m a.on{background:none;} #mainNav ul .depth1m ul ul ul li.d4m a.parent.on:after{content:'';display:block;position:absolute;top:50%;left:99%;width:9px;height:1px;/* margin-left:-18px; */background-color:rgba(255,255,255,.4);} #mainNav ul .depth1m ul ul ul li.d4m a.parent.on:before{content:none;} #mainNav ul .depth1m ul ul ul li.d4m a.on:after{content:none;} /*#mainNav ul .depth1m ul ul ul li.d4m a.on:before{ content: "·"; margin-right: 3px;color: #eee;}*/ #mainNav ul .depth1m ul ul ul li.d4m ul {display:none;padding:6px 0;background-color:rgba(255, 255, 255, .1);border-radius: 4px;} #mainNav ul .depth1m ul ul ul ul li.d5m a,#mainNav ul .depth1m ul ul ul ul li.d5m a.on{border:none;background:none;line-height:26px;font-size:12px;font-weight:100;text-indent: 8px;} /*#mainNav ul .depth1m ul ul ul ul li.d5m a:hover {background-color:rgba(0, 0, 0, .2);}*/ #mainNav ul .depth1m ul ul ul ul li.d5m a:before{content: "-"; display: inline-block;margin-right: 3px;color: #eee;} #mainNav ul .depth1m ul ul ul ul li.d5m a.on:before{content: "-"; display: inline-block;margin-right: 3px;color: #eee;} /* 새창표시-icon */ #mainNav li li a[target="_blank"]:after {content:''; position: relative !important; top: inherit !important; left: inherit !important;display: inline-block !important; background:url('/ps/img/cmmImg_2020/common/ico_blank.png') no-repeat !important; width:11px !important; height:12px !important; vertical-align:middle !important; margin:-2px 0 0 5px !important;transform: inherit !important;} #mainNav li li a.on [target="_blank"]:after {content:'';position: relative !important; top: inherit !important; left: inherit !important; display: inline-block !important; background:url('/ps/img/cmmImg_2020/common/ico_blank.png') no-repeat !important; width:11px !important; height:12px !important; vertical-align:middle !important; margin:-2px 0 0 5px !important;transform: inherit !important;} .nsGuide {position: relative;display:block; line-height: 38px; margin:0 20px;} .nsGuide a.btnDown {display: block;font-size:16px;font-weight:500;letter-spacing: -.05em; color:#fff;text-decoration:none;background: rgba(21,109,169,1);background: linear-gradient(to right, rgba(17,136,31,1) 0%,rgba(21,109,169,1) 100%);text-align: center;transition: 0.5s;} .nsGuide a.btnDown:hover {color:#fff; background:#156da9;border: 1px solid #156da9;} .nsGuide i.icon {display: inline-block;margin-left: 8px;} .nsGuide i.icon.down {width: 9px; height: 10px; background-image: url('/ps/img/cmmImg_2020/common/ico_down.png');background-repeat: no-repeat;} } @media screen and ( min-width:681px){ #locationWrap.fixed .sub_util .btn-openForm {position: relative; display: inline-block; height: 58px; line-height: 58px; vertical-align: bottom;} #locationWrap.fixed .sub_util .btn-openForm .seT {display: block; height: 58px; line-height: 58px; padding: 0 1rem; border-left: 1px solid rgba(255,255,255,0.1); } #locationWrap.fixed .sub_util .btn-openForm .seT span {display: block;font-size: .925rem; color: #fff;letter-spacing: -.05rem;} #locationWrap.fixed .sub_util .btn-openForm .seT:hover {background-color:#156da9; background-image:linear-gradient(120deg,#11881f 10%,#156da9 90%);border:0;margin:0;} #locationWrap.fixed .sub_util .btn-openForm .seT:hover span {color:#fff;} } @media screen and ( min-width:640px){ #footer .cs_tel {position: relative; display: inline-block; } } @media screen and ( min-width:1023px){ #footer .footerInfo { text-align: left;} #footer .footerInfo span { display: inline-block; margin-right: 12px;} #footer .footerWrap { padding:0 2%;} .sitelink > li {float: left; display: inline-block;width: calc(20% - 12px); margin-right: 15px;} .sitelink > li > button {/* border-right:1px solid rgba(255,255,255,0.2);*/border-bottom:0;background: #222; border-radius: 0 0 6px 6px; } .sitelink > li:first-child > button{/*border-left:1px solid rgba(255,255,255,0.2);*/ } } @media screen and ( min-width:1200px){ #footer .footerMenu ul + ul {padding-left:1rem;} #footer .ft_link {display: inline-block; float:left; width: auto; text-align: center;} #footer .ft_link2 {display: inline-block; float:left; width: auto; padding-top: 26px; text-align: center;} #footer .ft_outlink {width: auto; display: inline-block; float:right; margin-left: 15px; text-align: center;} #footer .ft_outlink ul {margin-top: 26px; } } @media screen and (min-width: 1440px){ /* header */ #header .headerWrap {padding:0 3%;} #header .headerWrap .logo {left:3%;} /* #footer */ #footer .footerWrap { padding:0 3%;} } @media screen and ( max-width:1300px){ #footer .footerInfo .rdaLogo { display: block; margin-right: 0; float: none;text-align: center;} } @media screen and (max-width: 1220px){ #container.cropArea.cropView .contents { margin:0 1%;} #container.subpArea .contents { margin:0 1%;} /* 만족도조사 */ #satisfaction {margin-left:1%; margin-right:1%;} } @media screen and ( max-width:1080px){ .headerWrap.on { background: #fff; border-bottom: 1px solid #eee; } } @media screen and ( max-width:1180px){ /* header */ #header .headerWrap .logo {left: 2%;} #header .btn-utilWrap {right: 118px;} #header .btn-openSearch {right: 78px;} } @media screen and ( max-width:1024px){ #container.cropArea.cropView .contents { margin:0 2%;} #container.subpArea .contents { margin:0 2%;} /* sub-nav */ #locationWrap .nav { display:block; margin:0 auto;}/* 3차메뉴 활성화시 lnb 전체 밑줄 */ #locationWrap .nav .home {display: none;} #locationWrap .nav .navList .dropdown { left:0; min-width: auto; width: 100%; } #locationWrap .sub_util .btn_share, #locationWrap .sub_util .btn_print {display:none;} /* 만족도조사 */ #satisfaction {margin-left:2%; margin-right:2%; margin-top:30px;} #satisfaction .open_mark img {float:none; margin: 0 auto 10px;} #satisfaction .title {display:block; font-size:15px; border-bottom:0; line-height:23px; padding:13px 0;} #satisfaction .manager_info {font-size:14px; margin:0 3%;} #satisfaction .manager_info ul li:after {top:10px;} #satisfaction .manager_info .date span {background-position:left 4px;} #satisfaction .evaluation {padding:20px 3%;} #satisfaction .open_mark, #satisfaction .title {margin:0 3%;} #satisfaction .evaluation dl dd {padding:0;} #satisfaction .evaluation dl dd .opinionWrap {width:auto; position:relative; right:auto; top:auto; margin-left:35px; margin-top:5px;} #satisfaction .btn_more {display:block; right:3%;} } @media screen and ( max-width:840px){ /* 만족도조사 */ #satisfaction .manager_info ul {float:none;} #satisfaction .manager_info ul li {margin-top:1px;} #satisfaction .manager_info .date {float:none; margin-top:8px;} } @media screen and ( max-width:800px){ .setPopWrap .setPopArea {width: 88.89vw;max-height: 90%;position: fixed;top: 50%;left: 5.56vw;background: #fff;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);} .setPopArea .setPop_Cont {margin: 0 1rem;} .contactBoard .optionGroup { overflow: hidden;} } @media screen and ( max-width:767px){ .m_only { display: block !important; } /* header */ #header .headerWrap {height: 80px; } #header .headerWrap .logo {left: 3%;} #header .headerWrap .logo a { width:86px; height:62px; } #header .btn-utilWrap .utilArea {top:1.5rem;margin-right: 0;} #header .openAllWrap {width:66px; height:80px;line-height: 77px;} #header .btn-openSearch {height: 80px;right: 66px;} #container.cropArea.cropView .subTitleWrap {height: auto;} .header.on {height: 80px;} .header_search dt input { width: calc(100% - 100px); height: 38px; line-height: 38px; font-size: 32px; color: rgba(255,255,255,0.5); font-weight: 300; vertical-align: top; border:0; } .header_search dt .btnSearch_voice { display: inline-block; padding: 0; } .header_search dt .btnSearch_voice:after { content:'';display:block; width:30px; height:38px; background:url('/ps/img/cmmImg_2020/common/ico_search_voice.png') no-repeat 0 0/cover; } .searchWrap .search_xClose {position:absolute;top:0;right:0;width:80px;height:80px;/*border:solid 1px #fff;*/background:transparent;text-indent:-9999px;cursor: pointer;} #container .subTitleWrap h2.subTitle { font-size: 1.9rem;padding-top: 2rem; padding-bottom: .6rem;} #container.subpArea .contents { margin:0 3%;} #container.cropArea.cropView .contents { margin:0 3%;padding: 1rem 0 50px 0;} #container .contents {padding:1rem 0 50px 0} .prodContactPop .contactPopWrap { width: calc(100% - 8.33vw); padding-bottom: 8.33vw; } .contactPopWrap .contactPopCon { padding: 0 5.56vw;} .contactPopWrap h2 { padding: 5.14vw 5.56vw; margin-bottom: 6.94vw; font-size: 5vw;} /* 자주찾는서비스 설정_팝업 */ .contactBoard ul { margin: -.15rem; overflow: hidden;} .contactBoard li {padding: .3rem;} .sMenuList li{ float:left; width:25%;} .sMenu_chk input[type="checkbox"] + label{text-align: center;padding: .5rem ;} .sMenu_chk .lb{ margin-top:.2rem; font-size: 0.9rem;} .cont-type-area p { padding: 1rem; font-size: 1rem; } } @media screen and ( max-width:680px){ /* sub-nav */ #locationWrap .nav ul li {width: 100%;display: none;} #locationWrap .nav ul li:last-child {display: block;} #locationWrap .nav .navList button{border-right:0; width: 100%;} .contactBoard .optionBox {position: relative; float: none;display: block; width: 100%; overflow: hidden;} .contactBoard .optionBox select { width: 100%;} .contactBoard .optionBox select#selectCrop1 {margin-top:.5rem} .contactBoard .optionBox select#selectCropCate3 {margin-top:5px} .contactBoard .proundBtn { display: block; text-align: center; margin:1rem auto; } .contactBoard dl + dl .optionBox {float: left; display: inline-flex;width: calc(100% - 80px);} .contactBoard dl + dl .proundBtn { display: inline-block; margin:0; } } @media screen and ( max-width:640px){ /* 상단검색 */ .header_search dt input { font-size: 24px; } .header_search dt button.btnSearch:after { content:'';display:block; width:35px; height:33px; background:url('/ps/img/cmmImg_2020/common/search_ico_big.png') no-repeat 0 0/cover; } .header_search dd a {height: 32px; line-height: 30px; padding: 0 15px; margin: 6px 6px 0 0; font-size: 14px; } } @media screen and ( max-width:540px){ .topBanner .inner img { text-align: center; margin: auto;display: block;} .topBanner .inner span { margin-left:0; line-height: 40px;} #header .headerWrap .logo a {width: 80px;height: 58px;} .setPopWrap .setPopArea .setPop_top h3.popTit { padding: 1.2rem; font-size: 1.6rem; } .setPopWrap .setPopArea .setPop_top p { padding: 1rem; font-size: 1.025rem;} .setPopWrap .setPopArea .setPop_top .setting_Cont { margin: 0 1.2rem; } .setPopWrap .setPopArea .setPop_top p span { font-size: 0.9rem; } .setPopWrap .setting_Cont {padding: 1rem;} .setPopWrap .setting_Cont .settingList li {margin: 4px 6px 4px 0;} .setPopWrap .setting_Cont .settingList .item_del { font-size: 0.9rem;} .setPopWrap .setPopArea .btn_wrap { position: absolute; width: 100%; bottom: 1.2rem; padding-top: 1.4rem; margin: 0;} .setPopWrap .prodPop_xClose {position:absolute;top:1.2rem;right:1.2rem;width:40px;height:40px;} .roundBtn { padding: 0.6rem 0.8rem; font-size: 1rem; } /* 자주찾는서비스 설정_팝업 */ .sMenuList li{ float:left; width:33.333%;} .sMenu_chk .lb{ margin-top:.2rem; font-size: 0.8rem;} .cont-type-area p { padding: .8rem; font-size: .9rem; } .cont-type-area .setting_Cont {padding: .6rem 1rem;} .cont-type-area .setting_Cont .settingList li {margin: 4px 6px 4px 0;} .cont-type-area .setting_Cont .settingList .item_del { font-size: 0.9rem;} .cont-type-area .setting_Cont .settingList li button{height:30px;padding:0 .8rem; } .cont-type-area .setting_Cont .settingList li button span.tag{font-size: 0.8rem; line-height: 28px;} } @media screen and ( max-width:425px){ #header .btn-utilWrap .utilArea {margin-right:0.3rem;} #header .btn-utilWrap .btn-openForm .seT {padding:.15rem 0.9rem .2rem;} #header .btn-utilWrap .btn-openForm .seT span { font-size:0.85rem;} #header .btn-utilWrap {right: 90px;} #header .btn-openSearch {right: 50px;} #header .openAllWrap {width:50px;} #container .subTitleWrap .subTitle { padding-top:1rem; font-size: 1.6rem;} .header_search {padding: 40px 5%;} .header_search dt {padding-bottom: 12px;} .header_search dt input {font-size: 20px;} .header_search dd {margin-top: 12px;} .header_search dd a {height: 30px; line-height: 28px; padding: 0 12px; margin: 6px 6px 0 0; font-size: 13px; font-weight: 400; } }