@charset "utf-8";


/******************************/
/* 탭메뉴 */
/******************************/
.tab_box [class^="tab_menu_box"] li.on {border:1px solid #1e4ee3;}
.tab_box [class^="tab_menu_box"] li.on h4 a {background-color:#1e4ee3;}
/* 하위탭 */
.tab_box [class^="tab_menu_box_"] li.on {border:0;border-bottom: 1px solid #003964;border-top: 1px solid #003964;}
.tab_box [class^="tab_menu_box_"] li.on h4 a {background-color:#003964;}


/******************************/
/* input, 검색 등 게시판관련 코드 */
/******************************/
/* 게시판 테이블 */
.board_table tbody tr.noti .num span {background:#1e4ee3;}


/********** 체크버튼(라디오, 체크) **********/
.checks input[type="radio"]:checked + label:after {background:#1e4ee3;}
.checks input[type="radio"]:checked + label:before {border:1px solid #1e4ee3;}
.checks input[type="checkbox"]:checked + label:before {background-image:url("./../images/content/icon_checks.gif");}

/* 색상 */
.btn_green {background:#157941 !important;}


/******************************/
/* 컨텐츠 */
/******************************/
/*** 공통 ***/
.con_body p,.con_body .line_box,.con_body .gray_box,.con_body ul,
.con_body dl {line-height: 1.5;}

/*** 01서비스소개 ***/
.contents .subTxtCon { position: relative;padding: 40px;display: flex;justify-content: space-between;background: #f9f9f9;}
.contents .subTxtCon:before {content:'';position: absolute; top: 0; left: 0;width: 50px;height:40px;border-top: 2px solid #157941; border-left: 2px solid #157941;}
.contents .subTxtCon:after {content:'';display:block;position: absolute; top:0; left:0;width: 100%;}
.contents .subTxtCon dt {margin-bottom:10px;font-size: 2.5rem;color:#000;}
.contents .subTxtCon dt strong {display: inline-block;z-index: 0;font-weight:500;color: #11881f;background-image: linear-gradient(120deg, #e7f7e9 0%, #e7f7e9 100%);background-repeat: no-repeat;background-size: 100% 10px;background-position: 0 88%;}
.contents .subTxtCon dd { font-size: 1.6rem; color: #6d6c76;}
.contents .subTxtCon dd strong {font-weight: 500;}
  @media only screen and (max-width:767px){
    .contents .subTxtCon {flex-direction: column;}
    .contents .subTxtCon dd br {display: none;}
    .contents .subTxtCon .img {margin-top:20px;text-align: center;}
  }
  @media only screen and (max-width:479px){
    .contents .subTxtCon {padding: 20px;}
    .contents .subTxtCon .img img {width: 100%;}
  }

/*** 02 간척지구별 환경정보 ***/
.titleH3{max-width:1600px;margin:1% auto 1%;text-align:left;font-size:1.6rem;font-weight:500;font-weight: 500;}
.titleH3>button{background:#0a6cbb;border-radius:.3em;color:#FFF;padding:.5em 1em .6em;font-weight:bold;font-size:1.4rem;margin-top:-5px;vertical-align: middle;}
.titleH3_1{max-width:1600px;margin:0 auto;text-align:left;font-size:2.3rem;font-weight:500;font-weight: 500;color: #000;}
.titleH3_1>button{background:#0a6cbb;border-radius:.3em;color:#FFF;padding:.5em 1em .6em;font-weight:bold;font-size:1.8rem;margin-top:-5px;vertical-align: middle;}
.titleH4{padding:0 0 0 25px;position: relative;text-align:left;font-size:2.2rem;font-weight:400;color:#225898;}
.titleH4:before{content:'';  position: absolute; left: 0; top:0;width:20px;height:25px;background:url('./../images/content/ico_h4.png')left top no-repeat;background-size:100%; transform: translateY(0);}

.date{font-size:14px; color:#666;font-weight: bold;}
.basic_info{background:#f1f7fc;border:1px solid #dce8f1;padding:2%;z-index: -2;position: relative;}
.basic_info1{background:#fff;border:1px solid #fff;padding:2%;z-index: -2;position: relative;}
.basic_info2{background:#fff;border:1px solid #fff;padding:2%;padding-left:30px; z-index: -2;position: relative;}
  @media only screen and (max-width:1023px){
    .con_body .wrap.basic_info{padding:20px;}
  }

.contents .btnArea .btn_bace {position:relative;line-height: 30px;height: 30px;margin-top:-3px;}
.detail_basic_info{display: flex;gap:30px;}
.detail_basic_info>li{width:55%;display:inline-block;vertical-align: top;}
.detail_basic_info>li img {width:clamp(0px,100%,600px);max-height: 400px;}
.detail_basic_info>li:first-child{width:45%;}
.detail_info {display: flex;flex-direction: column;justify-content: space-between;height: 100%;}
.detail_info>li{display: flex;align-items: center;flex-grow:1;border-bottom:1px dashed #d3dce6;padding:15px 0;font-size:1.8rem;font-weight: 500;}
.detail_info>li>.subj{flex-shrink:0;width:150px;display:inline-block;vertical-align: middle;color:#1d5079;}
.detail_info>li>.subj>span{position: relative;}
.detail_info>li>.subj>span:before{content:''; position: absolute; left: 0; bottom:2px; background:#f5f7de;height:10px;width:100%;z-index: -1;}
.detail_info>li>.acc{flex-grow:1;width:70%;display:inline-block;vertical-align: middle;line-height:120%;font-weight: 500; font-size:1.6rem;}
.detail_info1>li{border-bottom:1px dashed #d3dce6;padding:.2em 0;font-size:1.2em;}
.detail_info1>li>.subj{width:35%;display:inline-block;vertical-align: middle;color:#1d5079;}
.detail_info1>li>.subj>span{position: relative;}
.detail_info1>li>.subj>span:before{content:''; position: absolute; left: 0; bottom:2px; background:#f5f7de;height:10px;width:100%;z-index: -1;}
.detail_info1>li>.acc{width:calc(100% - 37%);display:inline-block; vertical-align: middle;line-height:120%;font-weight: 500; font-size:16px;}
  @media only screen and (max-width:1023px){
    .detail_info>li>.subj{width:100px;}
  }
  @media only screen and (max-width:767px){
    .detail_basic_info{flex-direction:column;gap:20px;}
    .detail_basic_info>li{width:100%;}
    .detail_basic_info>li img {width:clamp(0px,100%,767px);max-height: none;}
    .detail_basic_info>li:first-child{width:100%;}
  }

.btnArea .c2 {padding:0 30px 0 10px;}
.btnArea .c2:hover {border:1px solid #157941;background-color:#fff;font-weight:500;color:#fff;}
.btnArea .c2:after{display: block; content: ''; position: absolute; right:10px; top:9px; width:9px; height: 9px; border-bottom:1px solid #fff; border-right:1px solid #fff; transform:rotate(45deg);transition: transform 150ms ease-in-out; }
.btnArea.active .c2{ top:30px; font-weight: 400;}
.btnArea .c2:hover:after{top:12px; border-bottom:1px solid #fff; border-right:1px solid #fff; transform:rotate(-135deg); }

/* 테이블 영역 버튼 */
.table_box .btn_bace {vertical-align: middle;line-height: 30px;height: 30px;}
.popup_box .table_box td {vertical-align:top;}
.popup_box .box > img {width:100%;}


/*** 02 간척지구별 환경정보 ***/
.slmpImg_box {gap:10px;flex-wrap: wrap;}
.slmpImg_box > div {width: calc((100% - 20px) / 3);}
.slmpImg_box > div a img {width: 100%;height: 280px;}
.slmpImg_box > div span {display: block;margin:20px 0;text-align: center;}


/*** 03 간척지 적합 작물 및 재배정보 ***/
/* 리스트 */
.popul {}
.popul li {display: flex;justify-content: space-between;margin-bottom: 5px;}
.vt {vertical-align:top !important;}
/* 상세 */
.summary_list{background: #f9f9f9; padding:30px;}
.summary_list>ul {display: flex;gap:30px;}
.summary_list>ul>li{flex-grow:1;display:inline-block;vertical-align: top;}
.summary_list>ul>li:first-child{flex:0 1 350px;}
.summary_list>ul>li img{width:100%;}
.summary_list ul.summary_info{display: flex;flex-wrap: wrap;gap: 20px;}
.summary_list ul.summary_info li{ flex-grow:1;width:calc((100% - 40px) / 2);padding-bottom:10px; margin-bottom:20px;font-size: 1.9rem; color: #323232; border-bottom: 1px dashed #809ab7; }
.summary_list ul.summary_info li p{ margin-left: 10%; font-size: 1.5rem; }
.summary_list ul.summary_info li p:before{ content: '[';}
.summary_list ul.summary_info li p:after{ content: ']';}
.summary_list ul.summary_info li strong{position: relative;padding-left: 10px;margin-bottom:10px;display: block;font-size: 1.9rem;color: #2159b3;font-weight: 400;}
.summary_list ul.summary_info li strong:before {content:'';display: inline-block;width: 3px;height: 3px;background: #2159b3;position: absolute;left: 0;top: 10px;border-radius: 50%;}
.info_first{float:left; width:50%;}
  @media only screen and (max-width:767px){
    .summary_list{padding:20px;}
    .summary_list>ul {flex-direction: column;}
    .summary_list>ul>li:first-child{flex:1 1 auto;}
    .summary_list ul.summary_info li{ flex-grow:1;width:100%;padding-bottom:10px; margin-bottom:0;}
  }

.box_2st {position:relative; padding:1rem 1.5rem; border:1px dashed #bfbfbf; background:#fff;}
.box_2st.darkPbak{ color:#fff; border-radius:8px; background:#6166a0 url('/ps/img/cmmImg_2020/common/pattern_01.png') repeat;}

/*** 04 작목 추천 서비스 ***/
.contents .subTxtCon2 {overflow: hidden;padding:40px 160px 40px 40px;}
.contents .subTxtCon2 .img2 {position: absolute;right: 0;top: 0;}
.contents .subTxtCon2 .img2 img {max-width: 164px;}
  @media only screen and (max-width:767px){
    .contents .subTxtCon2 {padding:40px;}
    .contents .subTxtCon2 .img2 {position: static;}
  }
  @media only screen and (max-width:479px){
    .contents .subTxtCon2 {padding:20px;}
  }

.board_STop {}
.board_STop .search_Form {padding:50px 20px;background: url('./../images/main/bg.png') right -25px bottom -40px no-repeat #0a1431;}
.board_STop .search_Form fieldset {display: flex;justify-content: center;align-items: flex-end;gap:20px;}
.board_STop .search_Form fieldset .form-select {}
.board_STop .search_Form fieldset .form-select strong {display: block;margin-bottom:10px;font-size:1.7rem;font-weight:400;color: #fff;}
.board_STop .search_Form fieldset .form-select select {width: 200px;border:0;}
.board_STop .search_Form fieldset .form-btn {flex-shrink: 0;width:100px;}
.board_STop .search_Form fieldset .form-btn button {width:100%;height: 40px;padding-left:25px;background: url('./../images/main/icon_search.png') left 25px center no-repeat #396afc;font-family: 'TheJamsil';font-weight:400;font-size:1.6rem;color:#fff;}
.detail_envrn .bt {line-height: 30px;height: 30px;}
  @media only screen and (max-width:1023px){
    .board_STop .search_Form fieldset .form-select {flex-grow: 1;}
    .board_STop .search_Form fieldset .form-select select {width: 100%;}
  }
  @media only screen and (max-width:767px){
    .board_STop .search_Form {padding:30px 20px;}
    .board_STop .search_Form fieldset {flex-direction: column;align-items: center;}
    .board_STop .search_Form fieldset .form-select {flex-grow: 1;width: 100%;}
  }

.box_2st {padding: 20px;}
.box_1st {background: #f6faff;padding: 40px;}
.box_1st .lt {display: flex;flex-wrap:wrap;gap:30px;}
.box_1st .lt li {width: calc((100% - 90px) / 4);}
.box_1st .lt li a {display:flex;align-items:center;justify-content:center;overflow: hidden;position:relative;padding-top:65%;text-align: center;border:1px solid #000;background: #000;}
.box_1st .lt li a img {position:absolute;left:50%;top:50%;width: 101%;transform: translate(-50%, -50%);transition: 0.4s;}
.box_1st .lt li a:is(:hover,:focus,:active) img {transform: translate(-50%, -50%) scale(1.1,1.1);opacity: .8;}
.box_1st .lt li .cropsNm {margin-top:10px;font-weight:300;font-size:1.8rem;text-align: center;color: #000;}
  @media only screen and (max-width:1023px){
    .box_2st {padding: 10px;}
    .box_1st {padding: 30px;}
    .box_1st .lt {gap:20px;}
    .box_1st .lt li {width: calc((100% - 40px) / 3);}
  }
  @media only screen and (max-width:767px){
    .box_1st {padding: 20px;}
    .box_1st .lt li {width: calc((100% - 20px) / 2);}
  }
  @media only screen and (max-width:479px){
    .box_1st .lt li {width: 100%;}
  }

/*** 05 고객지원마당_문의하기(상세) ***/
.form_box {padding:20px;border-top:1px solid #ddd;}
.form_box .input_box {display: flex;justify-content:center;align-items: flex-end;gap:30px;}
.form_box .input_box label {margin-right:10px;}
.form_box .input_box .btn_bace {line-height: 40px;height: 40px;}
  @media only screen and (max-width:767px){
    .form_box {padding:20px 15px;}
    .form_box .input_box {gap:15px;}
    .form_box .input_box > div {flex-grow: 1;}
    .form_box .input_box label {display:block;margin-bottom:10px;}
    .form_box .input_box > div input {width: 100%;}
  }
  @media only screen and (max-width:479px){
    .form_box .input_box {flex-direction: column;align-items: flex-start;}
    .form_box .input_box > div {width: 100%;}
  }

.sub050200 .flex_justify .checks {margin:0 10px;}
