@charset "utf-8";
@import url("/html/script/css/fonts-noto.css");
/* Element Reset */
input, textarea, select, table, button{ font-family:'Noto Sans KR','Malgun Gothic',Dotum,sans-serif; font-size:12px; margin:0; padding:0;}
div, ul, ol, dl, form, fieldset, td, th, li, dt, dd, h1, h2, h3, h4, h5, p, a, img, span, caption{ margin:0; padding:0;}
img, fieldset{ border:0;}
form, fieldset{ margin:0; padding:0;}
hr{ display:none;}
em, address{font-style:normal;}
h1, h2, h3, h4, h5, h6{ font-size:12px;}
button{ margin:0; padding:0; overflow:visible; cursor:pointer;}
ul, li, ol, dl{ list-style:none;}
a{ text-decoration:none;}
a:hover, a:active, a:focus{ text-decoration:none;}
legend,caption{ display:none;}
select, input, textarea{ vertical-align:middle; color:#333; line-height: 1.5;}
input, select{ line-height:16px; veretical-align:middle;}
textarea{ width:98%; padding: 4px 4px; border:1px solid #E4E4E4; line-height:150%;}


/*-----------------------------------------------------------------------------*\
 *                                 레이아웃
\*-----------------------------------------------------------------------------*/
#NPMS{background-image: none !important; margin: 0px; padding: 0px;}
/*-----------------------------------------------------------------------------*\
 *                                 //레이아웃
\*-----------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------*\
 *                                 테이블
\*-----------------------------------------------------------------------------*/
.tabelRound .listDetail p.tl{
	height:16px ;
	margin: -1px !important;
	padding: 5px 0px !important;
	text-align:left;
	color:#305200;
	font-family:"NanumGothicWebB";
	font-size:13px;}


.grid{
	    margin: 6px 0;
    border-collapse: collapse;
    border: none;
    border-top: 2px solid #71bf45;
    border-bottom: 1px solid #71bf45;
    font-size: 12px;
    line-height: 18px;
    table-layout: fixed;position: relative; width:100%;
    }
.grid thead th, .grid thead td, .grid tbody th, .grid tbody td, .grid tfoot th{border-style:none; border:0; border-width:0; word-break:break-all; }
.grid thead th, .grid thead td{color:#818181;}
.grid thead th:first-child{
    background: none;
}
.grid thead th, .grid tbody th.brd, .grid tbody td.brd{ border:0;     padding: 0 10px;
    font-size: 12px;
    height: 40px;
    line-height: 1.3;
    border-bottom: 1px solid #71bf45;
    background: url(/html/images/front/bbs/bg_head_line.gif) no-repeat 0 50%;
    color: #3a9200;
    letter-spacing: -1px;
    text-align: center;}
.grid thead td, .grid tbody th, .grid tbody td, .grid tfoot th, .grid tfoot td{     border: 0;
   	border-top: 1px solid #e1e1e1;
    font-size: 13px;
    color: #686868;
    text-align: center;
    vertical-align: middle;
    padding: 10px 4px;
    /* border: 0; */
    line-height: 18px;}
.grid thead td.bgbr2{ background: #e6f1f4; text-align: center; font-weight: bold;}
.grid tfoot th{ background: #e6f1f4; text-align: center; font-weight: bold; border: 1px solid #bbb; color: #0878a1; border-top: 2px solid #dbdbdb;}
.grid thead td.bgbr3, .bgbr3{ background: #41c818 !important; text-align: center; font-weight: bold; color: #ffffff !important; border: 1px solid #1484a3;}
.grid thead td.bgbr4, .bgbr4{ background: #f5f5f5 !important; text-align: center; font-weight: bold; border: 1px solid #d5d5d5 !important; color: #818181 !important;}
.grid thead td.bgbr, .grid tbody td.bgbr, .grid tbody th.bgbr{ background: #f3f4f5; text-align: center; font-weight: bold;}

.grid tbody td.borbtm1{ border: 0; border-bottom: 1px solid #e8e8e8;}
.grid tbody td.borbtm1 div{ margin: 10px;}
.grid tbody td.borbtm1 div p{ margin: 0 0 10px;}
.grid tbody td.borbtm1 div p.txtInfo{ line-height: 1.5; color: #000;}


/* .topLine{ border-top: 0px solid #7e7e7e;} */
.topLine2{ border-top: 2px solid #b0b0b0;}
.grid tbody th.bg1{ background: #f2f2f2 url(http://api.nongsaro.go.kr/images/api/common/dotBlack.gif) no-repeat 5px 50% !important; padding: 5px 3px; padding-left: 13px; text-align: left;}
.grid tbody th.bg2{ background: #f2f2f2; text-align: center;}
.grid tbody td a{color:#444;}
.grid tbody tr:nth-child(even) {
    background: #f9f9f9;
}
.grid tbody .lft{text-align:left;}
.grid tbody th.brd, .grid tbody td.brd{ font-size: 12px; color: #ffffff;}
.grid .schArea{ background: none !important; border: 0 !important; text-align: left; border-color:#F1F7F7; padding: 2px;}
.grid img.bord{ border: 1px solid #cdcdcd; vertical-align: middle;height:auto;width:100%;}
.help_tip{ position: absolute; z-index: 2000; background: #ffffff url(http://api.nongsaro.go.kr/images/api/common/help_tip.gif) no-repeat 0 0; border-right: 1px solid #b9b9b9; height: 17px; padding: 6px 5px 0 10px; font-size: 11px;}


.gridDetailList{ margin: 15px 0 5px;}
.gridDetailList h4{ background: url(http://api.nongsaro.go.kr/images/api/common/gridList_h4Bg.gif) no-repeat 0 100%; padding: 0 0 7px 0; margin-bottom: 5px;}
.gridDetailList h4 strong{ background:url(http://api.nongsaro.go.kr/images/api/common/depthBullet.gif) no-repeat 0 0; padding: 0 0 3px 15px;}
/*-----------------------------------------------------------------------------*\
 *                                 //테이블
\*-----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------*\
 *                                 검색박스
\*-----------------------------------------------------------------------------*/
#NPMS .schBox{ margin: 0; position: relative; margin-bottom: 10px; color: #4c5155; font-size:12px; text-align: left; }
#NPMS .schBox .outerRound{ background: #efefef; padding: 10px;}
#NPMS .schBox .innerRound{position:relative; background: #fff; border:1px solid #e7e7e7; position: relative; padding: 15px; veretical-align: top; text-align: left;}
#NPMS .schBox .nTitle{font-weight:bold; margin-right: 25px; background: url(http://api.nongsaro.go.kr/images/api/common/grayDot.gif) no-repeat 0 45%;  padding: 3px 5px 3px 10px;}
#NPMS .schBox .mTitle{display:inline-block; margin: 5px; border:1px dotted #ddd; padding: 3px 10px;}
#NPMS .schBox .mTitle:hover {display:inline-block; width:auto; background:#27c183; color:#fff;}
#NPMS .schBox .mTitle a { display:block; width:100%; padding:0 7px;}
#NPMS .schBox .mTitle a:hover {color:#fff;}
#NPMS .schBox label{padding:0px 6px; position: relative; margin: 0px; top: 1px;}
#NPMS .schBox .inputW{width: 100% !important;  position: relative; display: inline;}
.schBox input[type="text"],.schBox select,.schBox textarea{
    padding: 1px;
    border: 2px solid #71bf45;
    background: #fff;
    line-height: 12px;
    font-size: 12px;
    color: #666;
    vertical-align: middle;
    }
#NPMS .schBox p{margin-bottom:10px;}
#NPMS .schBox .schButton{position:absolute; bottom: 10px; right: 10px;}

#NPMS .schBox table{ empty-cells:show; border-collapse:collapse; border-style:none; border-width:0;  border-color:#FFF;}
#NPMS .schBox table tbody th, .schBox table tbody td{border-style:none; border:0; border-width:0;  }
#NPMS .schBox table tbody th{ background: url(http://api.nongsaro.go.kr/images/api/common/grayDot.gif) no-repeat 0 45%; color: #4c5155; border: 0; }
#NPMS .sch, .frm{ position: relative;}

/*병해충명검색박스*/
.sch, .frm{ position: relative;}
.contentsSch{background: #efefef; padding: 10px; margin: 0 0 5px; position: relative; *zoom: 1; padding: 10px;}
.contentsSch table{ background: #fff; border:1px solid #e7e7e7; empty-cells:show; border-collapse:collapse; border-style:none; border-width:0; font-size:12px; border-color:#FFF;}
.contentsSch table tbody th, .contentsSch table tbody td{border-style:none; border:0; border-width:0;}
.contentsSch table tbody th, .labeDotBg{ background: url(http://api.nongsaro.go.kr/images/api/common/grayDot.gif) no-repeat 0 7px; color: #4c5155; border: 0; padding: 3px 5px 3px 10px; text-align: left;}

/*-----------------------------------------------------------------------------*\
 *                                 //검색박스
\*-----------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------*\
 *                                 검색탭메뉴
\*-----------------------------------------------------------------------------*/
.tabArea{border-bottom:1px solid #c3cbd1;  position:relative; overflow:hidden; }
/*[윤]110805 end*/
.tabArea ul{ position: relative; top: 1px;}
.tabArea ul li{ float: left; height: 29px; margin-right: 2px; margin-bottom:0;}
.tabArea ul li a{position: relative; top:2px; border:1px solid #27c183; border-radius:4px 4px 0 0; border-bottom:0; font-size: 11px; color: #349800; display:inline-block; height:29px; line-height:29px; text-align:center; padding:0 4px; min-width:50px}
.tabArea ul li a strong{ cursor:pointer; display:inline-block; height:29px; line-height:29px; text-align:center;}
.tabArea ul li a:hover, .tabArea ul li a.active{position: relative; top:0px; background: #27c183; color: #fff; padding-top: 1px; min-width:50px}
.tabArea ul li a:hover strong, .tabArea ul li a.active strong{ background: #27c183; color: #fff; height: 29px; line-height:29px; text-align:center;}


.contentsRoundBox{ margin: 0 0 5px; position: relative; background:#fafafa url(http://api.nongsaro.go.kr/images/api/common/contentsRoundBoxBg2.gif) repeat-x 0 100%; border: 1px solid #c9cdd0; *zoom: 1; padding: 6px;}
.contentsRoundBox span.round{ display: block; position: absolute; background: url(http://api.nongsaro.go.kr/images/api/common/contentsRoundBox2.gif) no-repeat; width: 8px; height: 8px; z-index: 100;}
.contentsRoundBox span.round.lt{ background-position: 0 0; left: -1px; top: -1px;}
.contentsRoundBox span.round.rt{ background-position: 100% 0; right: -1px; top: -1px; _right: -1px;}
.contentsRoundBox span.round.lb{ background-position: 0 100%; left: -1px; bottom: 0; _bottom: 0;}
.contentsRoundBox span.round.rb{ background-position: 100% 100%; right: -1px; bottom: 0; _bottom: 0; _right: -1px;}


/*-----------------------------------------------------------------------------*\
 *                                 검색탭메뉴
\*-----------------------------------------------------------------------------*/


#NPMS .tabelRound span.round{ display: inline-block; position: absolute;  width: 2px; height: 2px; z-index: 100;}
#NPMS .innerRound p.btnArea{ position: absolute; right:50px; top:0;} /* top: 20px; */

#NPMS .tabelRound span.round{ display: inline-block; position: absolute;  width: 2px; height: 2px; z-index: 100;}
#NPMS .innerRound p.btnArea{ position: absolute; right:50px; top:0;} /* top: 20px; */


/*-----------------------------------------------------------------------------*\
 *                                 페이지네비
\*-----------------------------------------------------------------------------*/
#NPMS .pagination{ line-height:normal; padding:20px 0; text-align:center; font-size: 11px; text-align: center; }
#NPMS .pagination a {color:#323232; margin:0 -2px; padding:3px 6px; vertical-align:top; position:relative; z-index:2;}
#NPMS .pagination strong { color:#2f6aa6; font-size: 12px;}
#NPMS .pagination .direction { color:#0f4078; padding: 3px;}
#NPMS .pagination .direction span{ display:inline-block; vertical-align:top; height: 14px; background: url(http://api.nongsaro.go.kr/images/api/button/pagingArrow.gif) no-repeat; cursor: pointer;}
#NPMS .pagination .direction span.prev{ background-position: -25px top; width: 16px;}
#NPMS .pagination .direction span.next{ background-position: -45px top; width: 16px;}
#NPMS .pagination .direction span.first{ background-position: left top; width: 16px;}
#NPMS .pagination .direction span.last{ background-position: right top; width: 16px;}
#NPMS .pagination.topLine{  border-top: 1px solid #e8e8e8;}


/* (구) .apiContArea .pagination 규칙 제거 — api.css 가 modern.css 보다
   늦게 로드되어 공통 페이징 규칙(margin/간격/active 색)을 덮어쓰던 문제.
   페이징 스타일은 modern.css 의 "pagination (공통)" 섹션 한 곳에서 관리한다. */
/*-----------------------------------------------------------------------------*\
 *                                  //페이지네비
\*-----------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------*\
 *                                  서브타이틀
\*-----------------------------------------------------------------------------*/
#NPMS h3{margin: 0px; padding: 0px; border-top:2px solid #b9b9b9; position: relative; margin-bottom: 40px;}
#NPMS h3 p{position:relative; top:-2px; display:inline; text-align:left; height:20px; border-top:2px solid #27c183;  height:inherit; padding: 5px 3px 0px 3px;}
#NPMS h3 p.bgRp{border-top:2px solid #b9b9b9; margin-left: 3px;}
#NPMS h3 p strong{font-size: 18px; font-weight:bold; letter-spacing: -0.5px;}
#NPMS h3 p strong.miniF{font-family: Helvetica , Verdana; color: #9f9f9f; font-stretch:extra-expanded; text-transform:uppercase; font-size:11px; letter-spacing: 1px; font-weight: normal;}
/*-----------------------------------------------------------------------------*\
 *                                  //서브타이틀
\*-----------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------*\
 *                               기타 공통 스타일
\*-----------------------------------------------------------------------------*/
.cLear{clear:both;}
.widInhe{width: inherit !important;}

#NPMS .listDetail .tl{text-align:left; color:#2f6aa6; padding: 5px 3px; font-size: 14px; font-weight: bold;}
#NPMS .listDetail .date{ margin: 5px;}
#NPMS .listDetail dl{ margin: 10px 0;}
#NPMS .listDetail dl dt{ font-weight: bold;}
#NPMS .listDetail dl dd{ margin: 10px; color: #636363;}
#NPMS .listDetail dl dd p{ margin-bottom: 10px; line-height: 1.5;}
#NPMS .listDetail p.addFile, .addFile{ border: 1px solid #d9e3e7; background: #f4f8f9; margin: 20px 0 10px; padding: 7px;}
#NPMS .bord_topDotLine{ border-top: 1px dotted #d9e3e7; padding-top: 3px;}


#NPMS h4, h4{  margin: 5px 5px 5px 0; background: url(http://api.nongsaro.go.kr/images/api/common/bull_h4.gif) no-repeat 0 45%; padding-left: 10px; color:#424242; font-size:small; font-weight:bold;}
#NPMS h4 em.ic{ margin-left: 10px; font-size: 14px; color: #998200;}
#NPMS h4.floatH{ background: none !important; border-left: 1px solid #e1e1e1; margin-left: 15px; color: #6c6c6c;}



/* BUTTON str */
#NPMS .imgButton{ margin:0; padding:0; display:inline-block; text-decoration:none !important; border:0; font-size:12px; white-space:nowrap; vertical-align:top; overflow:visible; background: none;}
#NPMS .btnArea { margin: 10px 0; text-align:center;}
#NPMS .btnArea:after { content: ""; clear: both; display: block;}

#NPMS .button,
#NPMS .button *{ position:relative; margin:0; padding:0; display:inline-block; text-decoration:none !important; border:1px solid #85c3b8; white-space:nowrap; background:#85c3b8; color:#fff; overflow:hidden; font-weight: bold;}
#NPMS .button { margin-right:4px;}
#NPMS .button *{ cursor:pointer; _cursor:hand;}


/* Button Size = medium | large | xLarge | small */
#NPMS .button.medium, #NPMS button.medium *{ height:30px; line-height:30px;}
#NPMS .button.medium { background-position:left 0;}
#NPMS .button.medium *{ padding:0 20px; font-size:12px; background-position:right top;}
#NPMS .button.medium.blue {background-position:left -130px;}
#NPMS .button.medium.blue *{ background-position:right -130px; color: #fff; padding: 0 10px 0 8px !important;}
#NPMS .button.blue a{ color: #fff !important;}

/* Button Hover */
#NPMS .button *:hover,
#NPMS .button *:active,
#NPMS .button *:focus{ color:#000 !important;}
#NPMS .button.blue *:hover,
#NPMS .button *:active,
#NPMS .button.blue *:focus{ color:#b9dfff;}


#NPMS .button.strong *{ font-weight:bold !important;}
/* Button Icon Variation */
#NPMS .button.icon *{ padding-left:15px;}
#NPMS .button.icon span{ width:20px; margin-right:-20px; padding:0 !important;}
#NPMS .button.medium .default{ background-position: 0 -432px;}
#NPMS .button.medium .list{ background-position: -40px -432px;}
#NPMS .button.medium .add{ background-position: -61px -432px;}
#NPMS .button.medium .del{ background-position: -80px -432px;}
#NPMS .button.medium .zoom{ background-position: -102px -435px;}
/* //BUTTON end */

/*common style str*/

.inputData{ border:1px solid #ddd; padding: 1px 2px 0 2px; height: 16px !important; font-size: 12px; margin-bottom: 1px; border-color:#999999 #E4E4E4 #E4E4E4 #999999;border-right:1px solid #E4E4E4;border-style:solid;border-width:1px; background: #F5F5F5;}
.inputFile{ border:1px solid #ddd; padding: 1px 2px 0 2px; height: 19px !important; font-size: 12px; margin-bottom: 1px; border-color:#999999 #E4E4E4 #E4E4E4 #999999;border-right:1px solid #E4E4E4;border-style:solid;border-width:1px; background: #F5F5F5;}
.inputDisible{ height: 16px !important; border:1px solid #c5c5c5; background: #f6f6f6; font-size: 12px;}
.inputRadio{ position: relative; top: 2px;}
.inputRChk{ margin: 0 3px 0 0;}
.h100{ height: 100px;}
.h480{ height: 490px;}
.h500{ height: 500px;}
.stipulation{ border: 1px solid #dcdcdc; background: #ffffff; overflow-x:hidden; overflow-y: scroll; padding: 10px; color: #727272;}

.overflow_y{ overflow-y: scroll;}


.noKR {
	ime-mode: disabled;
}

/* MARGIN */
.mReset{ margin: 0 !important;}
.ml0{ margin-left: 0 !important;}
.ml2{ margin-left: 2px !important;}
.ml5{ margin-left: 5px !important;}
.ml10{ margin-left: 10px !important;}
.ml15{ margin-left: 15px;}
.ml20{ margin-left: 20px;}
.ml25{ margin-left: 25px;}
.ml30{ margin-left: 30px;}
.ml40{ margin-left: 40px;}
.ml60{ margin-left: 60px;}
.ml70{ margin-left: 70px;}
.ml80{ margin-left: 80px;}
.mt0{ margin-top:0 !important;}
.mt3{ margin-top:3px;}
.mt5{ margin-top:5px !important;}
.mt7{ margin-top:7px !important;}
.mt10{ margin-top:10px  !important;}
.mt13{ margin-top:13px  !important;}
.mt15{ margin-top:15px  !important;}
.mt20{ margin-top: 20px !important;}
.mt30{ margin-top: 30px !important;}
.mt50{ margin-top: 50px !important;}
.mt60{ margin-top: 60px !important;}
.mb3{ margin-bottom:3px;}
.mb5{ margin-bottom:5px !important;}
.mb10{ margin-bottom:10px !important;}
.mb15{ margin-bottom:15px;}
.mb20{ margin-bottom:20px;}
.mr2{ margin-right: 2px !important;}
.mr13{ margin-right: 13px !important;}
.mr5{ margin-right: 5px !important;}
.mr10{ margin-right: 10px !important;}
.mr20{ margin-right: 20px;}
.ma5{ margin: 5px !important;}
.ma10{ margin: 10px !important;}
.mauto{margin: 0px auto !important;;}


/* PADDING */
.pReset{ padding: 0 !important;}
.pt2{ padding-top: 2px !important;}
.pt3{ padding-top: 3px !important;}
.ptb3{ padding: 3px 0 !important;}
.pt5{ padding-top: 5px !important;}
.pt8{ padding-top: 8px !important;}
.pt10{ padding-top: 10px !important;}
.pb5{ padding-bottom: 5px !important;}
.pb3{ padding-bottom: 3px !important;}
.pB30{ padding-bottom: 30px;}
.p5{ padding: 5px !important;}
.pr5{ padding-right: 5px !important;}
.pr10{ padding-right: 10px !important;}
.pr20{ padding-right: 20px !important;}
.p10{ padding: 10px !important;}
.ptrb{ padding: 10px 10px 10px 0px !important;}
.pLR15{ padding:0 15px;}
.pLRB12{padding:0 12px 12px 12px;}
.pL3{ padding-left: 3px !important;}
.pL5{ padding-left: 5px !important;}
.pL10{ padding-left: 10px !important;}
.pL20{ padding-left: 20px !important;}
.pL5Pt2{ padding: 2px 0px 0px 5px !important;}

/* [윤]추가  110825*/
.pL0{ padding:5px 0px 0px 0px !important;}
/* [윤]추가  110825*/

/* ALIGN */
.lft{ text-align: left;}
.ce{ text-align: center;}
.rgt{ text-align: right !important;}
.clear{ clear: both;}
.block{ display:block !important; vertical-align:middle;}
.inBlock{ display: inline-block;}
.poT3{position:relative; top: 3px; }

/* FONT */
.p11 {font-size:11px !important; letter-spacing: -1px;}
.p111 {font-size:11px !important;}
.p12 {font-size:12px; line-height: 1.3; color: #595a5b;}
.underline {text-decoration:underline;}
.fontSmall {font-size: 90%;}
.fontLarge {font: 120% ����; color:#000;}
.fontNormal{ font-weight: normal !important;}
.orange {color:#ff6600;}
.red {color:#e10000 !important;}
.blue {color:#006699 !important;}
.gray{ color: #8d8d8d !important; line-height: 1.5;}
.gray2{color:#7a7e82 !important;}
.gray3{color:#bebebe !important;}
/*[윤]*/.green{ color: #58ae00 !important;}
.black1{ color: #4c4c4c;}
.white{ color: #ffffff;}
.greenN{color:#4a7e01; }
.blueGeen{color:#018fa0 !important; }
.greenN2{color:#5ea100 !important; }

.LeSpacing_5{letter-spacing: -0.5px;}
.LeSpacing{letter-spacing: 0px;}
.LeSpacing2{letter-spacing: 1px;}

/* BACKGROUND COLOR */
.bgNone{ background: none !important;}

/* png ���ȭ ó�� */
.png24 {tmp:expression(setPng24(this));}

/* WIDTH */
.w5 {width: 5%;}
.w10 {width: 10%;}
.w12 {width: 12%;}
.w15 {width: 15%;}
.w18 {width: 18%;}
.w20 {width: 20%;}
.w23 {width: 23%;}
.w25 {width: 25%;}
.w30 {width: 30%;}
.w32 {width: 32%;}
.w35 {width: 35%;}
.w38 {width: 38%;}
.w40 {width: 40%;}
.w45 {width: 45%;}
.w48 {width: 48%;}
.w50 {width: 50%;}
.w55 {width: 55%;}
.w60 {width: 60%;}
.w65 {width: 65%;}
.w70 {width: 70%;}
.w80 {width: 80%;}
.w95 {width: 95%;}
.w98 {width: 98%;}
.w100 {width: 100%;}
.w100p{width: 100px;}
.w130{width: 130px;}
.w150{width: 160px;}
.w450{ width: 450px;}
.w460{ width: 460px;}
.w230{width: 230px !important;}
.w270{ width: 270px !important;}
.w293{ width: 293px !important;}
.w335{width: 335px !important;}
.w995{width: 995px !important; /*[윤]사이즈추가 중요*/}
.maAuto{ margin: 0 auto !important;}
.relative{ position: relative;}

/* BORDER */
.borNone { border:none !important;}
.imgBord{ border: 2px solid #d5d5d5; padding: 2px;}

/* ALIGN */
.vtop{ vertical-align: top;}
.vmid{ vertical-align: middle !important;}
.vbtm{ vertical-align: bottom;}

.top2{ position: relative; top: 2px;}
.top5{ position: relative; top: 5px;}
.top8{ position:relative; top: 8px;}
.top11{ position:relative; top: 13px;}


/* float div */
.floatDiv{ *zoom: 1;}
.floatDiv:after{ content: ""; clear: both; display: block;}

.fl{ float: left;}
.fr{ float: right;}
.dpi{ width:175px; }
.dpb{ display:block;}

.lineHeight1{ line-height: 1.4;}

.dataInput{margin:5px 0px; padding-top:10px; text-align:left; *zoom:1;}
.dataInput:after{ content: ""; clear: both; display: block;}
.dataInput dt, .dataInput dd{margin-bottom:5px;}
.dataInput .photo, .photo{width:104px; height:80px; border:1px solid #c9cdd0 !important;}
.dataInput .data{width:202px; padding:0 6px 0 0; line-height:18px; }
.dataInput .tlt{width:190px; padding:0 6px 0 15px;  line-height:22px; background:#424242 url(http://api.nongsaro.go.kr/images/api/common/bull_h6.gif) no-repeat 5px 45%; color:#fff; font-weight:700;}
.photo2{ border:1px solid #c9cdd0 !important;}
.photo3{ border:2px solid #ff6600 !important;}

.topVisArea{ *zoom: 1; margin-left: 5px;}
.topVisArea .w160{ width: 160px;}
.topVisArea .txtImg{ margin-top: 22px;}
.topVisArea .txtImg span{ display: block; margin-top: 8px; font-size: 11px; line-height: 1.4;color: #939598;}

.topVisArea:after{ content: ""; clear: both; display: block;}

/*common style end*/

/* api 수정 */
.button a { height:30px; line-height:30px; color:#333; }
/* #insttName { text-indent:10px; } */
.tabelRound h {display:inline-block; font-size:16px; font-weight:bold; margin:10px 0;}

/* ============================================================
   농사로 OpenAPI 표 가독성 개선
   표 HTML은 외부 API가 생성하므로 마크업 대신 CSS로 보정한다.
   ============================================================ */

/* 1) 표 폰트를 사이트 공통(Noto Sans KR)으로 통일
      - 위쪽 4행에서 table 요소에 'Nanum Gothic'을 지정해 본문과 서체가 달라져 있었다. */
.grid, .grid th, .grid td, .grid td a,
.gridDetailList, .gridDetailList th, .gridDetailList td {
	font-family:'Noto Sans KR','Malgun Gothic','Apple SD Gothic Neo','Nanum Gothic',Dotum,sans-serif;
}

/* 2) 한글은 단어 단위로 줄바꿈
      - 기존 word-break:break-all 때문에 '농촌진흥청 국립식량과학원'이 글자 단위로 쪼개졌다.
      - 괄호가 붙은 긴 품종명은 overflow-wrap 으로 예외 처리한다. */
.grid thead th, .grid thead td,
.grid tbody th, .grid tbody td,
.grid tfoot th, .grid tfoot td {
	word-break: keep-all;
	overflow-wrap: break-word;
	line-height: 1.55;
}

/* 3) 표 머리글은 한 줄 유지 ('육성년/도' 처럼 끊기던 문제) */
.grid thead th, .grid thead td {
	white-space: nowrap;
	font-weight: 600;
	letter-spacing: -0.02em;
}

/* 4) 셀 여백과 세로 정렬 */
.grid tbody td { padding: 12px 10px; vertical-align: middle; }
.grid tbody tr { transition: background-color .15s ease; }
.grid tbody tr:hover { background-color: #f3f9f4; }

/* 5) 사진: 라운드 + 옅은 테두리/그림자, 마우스 오버 시 살짝 떠오르게 */
.grid tbody img {
	border-radius: 10px;
	border: 1px solid #e3e6ea;
	box-shadow: 0 1px 4px rgba(0,0,0,.08);
	object-fit: cover;
	transition: transform .2s ease, box-shadow .2s ease;
}
.grid tbody img:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(0,0,0,.16);
}

/* 6) 품종정보 목록 컬럼 폭 재배분
      - API colgroup 이 육성기관에 6%(약 56px)만 줘서 심하게 줄바꿈되었다.
      - 여유가 많던 주요특성에서 폭을 넘겨준다. */
.varietyInfo .grid { table-layout: fixed; }
.varietyInfo .grid colgroup col:nth-child(1) { width: 5%;  } /* 번호 */
.varietyInfo .grid colgroup col:nth-child(2) { width: 10%; } /* 사진 */
.varietyInfo .grid colgroup col:nth-child(3) { width: 11%; } /* 작물명 */
.varietyInfo .grid colgroup col:nth-child(4) { width: 7%;  } /* 육성년도 */
.varietyInfo .grid colgroup col:nth-child(5) { width: 20%; } /* 육성기관 - 기관 전체명이 두 줄에 들어가는 폭 */
.varietyInfo .grid colgroup col:nth-child(6) { width: 12%; } /* 품종명 */
.varietyInfo .grid colgroup col:nth-child(7) { width: auto;} /* 주요특성 */

/* 번호/육성년도처럼 짧은 값은 가운데 정렬이 읽기 편하다 */
.varietyInfo .grid tbody td:nth-child(1),
.varietyInfo .grid tbody td:nth-child(4) { text-align: center; }

/* ============================================================
   품종정보 검색영역 세로 정렬 보정 (2026-07-15)
   - default.css 의 품종정보 규칙은 입력 높이 20px 시절의
     float / line-height:20px 기준이라, modern.css 오버레이가
     select/input 을 40px 로 키운 뒤 라벨·조회버튼이 위로 떴다.
   - 마크업(농사로 API 생성)은 손대지 않고 행을 flex 로 재정렬한다.
   ============================================================ */

/* 1) 기관명 행 */
.varietyInfo #nongsaroApiLoadingAreaInstt .apiContArea .innerRound{ display:flex; align-items:center; flex-wrap:wrap; }
.varietyInfo #nongsaroApiLoadingAreaInstt .apiContArea .innerRound .fl{ float:none; display:flex; align-items:center; flex-wrap:wrap; gap:6px; overflow:visible; }
.varietyInfo #nongsaroApiLoadingAreaInstt .apiContArea .innerRound .nTitle{ float:none; line-height:normal; }
.varietyInfo #nongsaroApiLoadingAreaInstt .apiContArea .innerRound .inputW{ float:none; }
.varietyInfo #nongsaroApiLoadingAreaInstt .apiContArea .innerRound .cLear{ display:none; }

/* 2) 품종명/작물분류/육성연도 + 조회 버튼 행 */
.varietyInfo #nongsaroApiLoadingArea1 .innerRound{ display:flex; align-items:center; flex-wrap:wrap; row-gap:10px; }
.varietyInfo #nongsaroApiLoadingArea1 .innerRound .fl{ float:none; flex:1 1 auto; min-width:0; }
.varietyInfo #nongsaroApiLoadingArea1 .innerRound span.inputW{ display:flex; align-items:center; flex-wrap:wrap; gap:6px; overflow:visible; margin-right:0; }
.varietyInfo #nongsaroApiLoadingArea1 .schBox input[type=text],
.varietyInfo #nongsaroApiLoadingArea1 .schBox select{ float:none; margin-right:0; }
.varietyInfo #nongsaroApiLoadingArea1 .innerRound label{ float:none; line-height:normal; margin-right:0; }
.varietyInfo #nongsaroApiLoadingArea1 .innerRound .fr{ float:none; margin-left:auto; display:flex; align-items:center; }
.varietyInfo #nongsaroApiLoadingArea1 .innerRound .cLear{ display:none; }
.varietyInfo #nongsaroApiLoadingArea1 .innerRound .contentsRoundBox{ flex-basis:100%; }

/* 3) 숙기/구분/지대 행 */
.varietyInfo #nongsaroApiLoadingArea2>div{ display:flex !important; align-items:center; flex-wrap:wrap; gap:6px; overflow:visible !important; }
.varietyInfo #nongsaroApiLoadingArea2 .nTitle{ float:none; line-height:normal; }

/* 4) 목록 사진: API 가 인라인 style="width:128px" 로 고정해 사진 칸(약 122px)을
      넘어 작물명 칸을 덮었다. 셀 폭에 맞춰 축소한다. */
.varietyInfo .grid tbody td img{ width:100% !important; height:auto !important; display:block; margin:0 auto; }

/* (페이지네이션 통일 규칙은 modern.css 의 공통 섹션으로 이동했다) */

/* 조회 버튼 글자 세로 중앙 정렬
   - default.css 가 a 를 inline-block + line-height 18px 로 강제해
     38px 버튼 안에서 글자가 상단에 붙어 있었다. */
.varietyInfo #nongsaroApiLoadingArea1 .innerRound .fr .button a,
.cropTechInfo #nongsaroApiLoadingAreaInstt .innerRound .fr .button a,
.agriTechVideo #nongsaroApiLoadingArea1 .innerRound .fr .button a{
	display:inline-flex; align-items:center; justify-content:center; line-height:1;
}