@charset "utf-8";

/***************************************** sub layout ***********************************************/

.sub .subVisual {width: 100%; height: 200px; display:flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; overflow: hidden; position: relative;}
.sub .subVisual::before { content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; -webkit-animation: subVisual 2s ease-in-out both; -moz-animation: subVisual 2s ease-in-out both; -ms-animation: subVisual 2s ease-in-out both; -o-animation: subVisual 2s ease-in-out both;animation: subVisual 2s ease-in-out both; background-size: cover; background-repeat: no-repeat; background-position: center top;}
.sub .subVisual01::before {background-image: url(../../image/sub/subVisual01.jpg);}
.sub .subVisual02::before {background-image: url(../../image/sub/subVisual02.jpg);}
.sub .subVisual03::before {background-image: url(../../image/sub/subVisual03.jpg);}
.sub .subVisual04::before {background-image: url(../../image/sub/subVisual04.jpg);}
.sub .subVisual05::before {background-image: url(../../image/sub/subVisual05.jpg);}
.sub .subVisual06::before {background-image: url(../../image/sub/subVisual06.jpg);}
.sub .subVisual07::before {background-image: url(../../image/sub/subVisual07.jpg);}
.sub .subVisual08::before {background-image: url(../../image/sub/subVisual08.jpg);}
.sub .subVisual09::before {background-image: url(../../image/sub/subVisual08.jpg);}
@keyframes subVisual {
  from {
      transform:scale(1.08);
  }

  to {
      transform:scale(1);
  }
}
.sub .subVisual h2 {color: #fff; padding-bottom: 5px; font-weight: 400;}
.sub .subVisual span {display: block; color: rgba(255, 255, 255, 0.65); font-family: 'poppins'; font-size: 1.4rem; font-weight: 400; letter-spacing: 1px;}

.sub .contentWrap {position: relative; padding: 70px 0 100px; min-height: 750px;}
.sub .contentWrap > .inner {display: flex; flex-direction:row;}
.sub .contentWrap aside {width: 240px; margin-right: 50px; position: relative; top: -140px;}
.sub .contentWrap aside .subTiBox {width: 100%; height: 140px; background: linear-gradient(131deg, rgba(23,183,148,1) 0%, rgba(118,188,26,1) 100%); border-radius: 10px 10px 0 0; position:relative; margin-bottom:10px;}
.sub .contentWrap aside .subTiBox::before {content: "";width: 198px; height: 140px; background:url(../../image/sub/subTiBoxBg.png) no-repeat; position: absolute; top: 0; left: 0; opacity: 0.1;}
.sub .contentWrap aside .subTiBox h3 { color: #fff; line-height: 140px; text-align: center; font-weight: 400;}
.sub .contentWrap aside .depth2List {border: 1px solid #DBDBDB;}
.sub .contentWrap aside .depth2List > li > a {display: flex; flex-direction: row; padding: 15px 20px; justify-content: space-between;  border-bottom: 1px solid #dbdbdb;}
.sub .contentWrap aside .depth2List > li:last-child > a {border-bottom:none;}
.sub .contentWrap aside .depth2List > li > a.on {border-bottom: 2px solid #76BC1A; color: #76BC1A; font-weight: 400;}
.sub .contentWrap aside .depth2List > li > a::after {content: ""; width: 22px; height: 22px; background: url(../../image/main/lnbArrow2.png) no-repeat; display: block; transition: all 0.3s;}
.sub .contentWrap aside .depth2List > li > a.active::after {transform: rotate(90deg); transition: transform 0.3s;}
.sub .contentWrap aside .depth2List > li > a.on::after {background: url(../../image/main/lnbArrow2On.png);}
.sub .contentWrap aside .depth3List {display:none;border-bottom: 2px solid #76BC1A; background: #f6f6f6; padding:20px;}
.sub .contentWrap aside .depth3List > li > a {display:block; padding: 5px 3px; font-size: 1.6rem; position: relative;}
.sub .contentWrap aside .depth3List > li > a.on,
.sub .contentWrap aside .depth3List > li > a:hover {text-decoration: underline; color: #76BC1A;}
.sub .contentWrap aside .depth3List > li > a::before { content: ""; width: 3px; height: 3px; background: #555; border-radius: 50%; display: inline-block; margin: 0 5px 2px 0; vertical-align: middle;}
.sub .contentWrap aside .depth3List > li > a.on::before,
.sub .contentWrap aside .depth3List > li > a:hover::before {background: #76BC1A;}
.sub .contentWrap .content {width: calc(100% - 290px);}
.sub .contentWrap .content .conTop {display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; padding-bottom: 20px; margin-bottom: 50px; border-bottom: 1px solid #dbdbdb;}
.sub .contentWrap .content .conTop strong {font-size: 3.2rem; color: #222;}
.sub .contentWrap .content .conTop .utileWrap {display: flex; align-items: center;}
.sub .contentWrap .content .conTop .utileWrap ul {display: flex; flex-direction: row; align-items: center; margin: 0;}
.sub .contentWrap .content .conTop .utileWrap .breadCrumb li {position: relative;}
.sub .contentWrap .content .conTop .utileWrap .breadCrumb li:last-child a {font-weight: 400; color: #666;}
.sub .contentWrap .content .conTop .utileWrap .breadCrumb li:not(:last-child)::after {content: ""; display: inline-block; position:absolute; top: 9px; right: 9px; width: 5px; height: 5px; border: solid #7E7E7E; border-width: 1px 1px 0 0; transform: rotate(45deg);}
.sub .contentWrap .content .conTop .utileWrap .breadCrumb li a {color: #7E7E7E; display:inline-block; margin-right: 20px; font-size: 1.6rem;}
.sub .contentWrap .content .conTop .utileWrap .breadCrumb li a.home {font-size: 0; width: 18px; height: 15px; background: url(../../image/sub/homeIcon.png) no-repeat; vertical-align: text-top; padding: 0;}
.sub .contentWrap .content .conTop .utileWrap .btnWrap::before {content: ""; width: 1px; height: 12px; background: #7E7E7E; display: inline-block; vertical-align: middle; margin-right: 20px;}
.sub .contentWrap .content .conTop .utileWrap .btnWrap li button {display:block; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #dbdbdb; transition: background 0.3s ease-out;}
.sub .contentWrap .content .conTop .utileWrap .btnWrap li:not(:last-child) {margin-right:5px;}
.sub .contentWrap .content .conTop .utileWrap .btnWrap li button.favorite {background:#fff url(../../image/sub/favorite.png) no-repeat center center;}
.sub .contentWrap .content .conTop .utileWrap .btnWrap li button.favorite:hover {border:0; background:#76BC1A url(../../image/sub/favoriteW.png) no-repeat center center;}
.sub .contentWrap .content .conTop .utileWrap .btnWrap li button.print {background:#fff url(../../image/sub/print.png) no-repeat center center;}
.sub .contentWrap .content .conTop .utileWrap .btnWrap li button.print:hover {border:0; background:#76BC1A url(../../image/sub/printW.png) no-repeat center center;}
.sub .contentWrap .content .contentArea {width: 100%;}

@media all and (max-width:1279px){
  .sub .contentWrap {padding: 50px 0;}
  .sub .contentWrap .inner {flex-direction: column;}
  .sub .contentWrap aside {display:none;}
  .sub .contentWrap .content {width: 100%;}
  .sub .contentWrap .content .conTop strong {font-size: 2.8rem;}
}
@media all and (max-width:767px){
  .sub .contentWrap .content .conTop {padding-bottom: 50px; margin-bottom:30px; flex-direction: column; align-items: center;}
}
@media all and (max-width:500px){
  .sub .subVisual {height: 150px;}
  .sub .contentWrap .content .conTop strong {margin-bottom: 10px;}
  .sub .contentWrap .content .conTop .utileWrap {flex-direction: column; align-items: center;}
  .sub .contentWrap .content .conTop .utileWrap .breadCrumb {margin-bottom: 10px;}
  .sub .contentWrap .content .conTop .utileWrap .btnWrap::before {content: none;}
}
/***************************************** cnt101 ***********************************************/
.cnt-tx strong{color: #444;}
.cnt-tx p{line-height: 27px;}
.last-tx{margin-top: 20px}
.cnt101 .cnt-wrap:not(:last-child){margin-bottom: 80px;}
.cnt101 .cnt-wrap .cnt-tx01 p:not(:last-child){margin-bottom: 20px;}
.cnt101 .cnt-wrap .cnt101-bg {width: 100%; height: 267px; background: url(../../image/sub/cnt101-bg.jpg) no-repeat center; border-radius: 25px; margin: 15px 0 30px 0; background-size: cover;}

.cnt101 .cnt-wrap .cnt101-graph{margin: 70px 0;}
.cnt101 .cnt-wrap .cnt101-graph .graphTit{margin: 0 auto; width: 395px; padding: 20px 0; border:1px solid #5CB058; border-radius: 80px; box-shadow: 0 0 0 10px #F7FAEC; transform: translateY(5px);}
.cnt101 .cnt-wrap .cnt101-graph .graphTit .titLogo{margin: 0 auto; background: url(../../image/sub/cnt101-graphLogo.png) no-repeat; width: 114px; height: 60px;}
.cnt101 .cnt-wrap .cnt101-graph .graphTit span{display: block; margin-top: 10px; font-size: 2rem; font-weight: 700; text-align: center; color: #006B42;}
.cnt101 .cnt-wrap .cnt101-graph .graphLine{margin: 0 auto; width: 526px; height: 88px; background: url(../../image/sub/cnt101-graphLine.png) no-repeat; transform: translateY(5px);}
.cnt101 .cnt-wrap .cnt101-graph .graphCnt{width: 780px; margin: 0 auto; display: flex;}
.cnt101 .cnt-wrap .cnt101-graph .graphCnt dt{margin-bottom: 10px;}
.cnt101 .cnt-wrap .cnt101-graph .graphCnt .gpCnt01 dt{background-color: #A7CC3D; border-radius: 50px; width: 270px; padding: 15px; color: #fff; text-align: center;}
.cnt101 .cnt-wrap .cnt101-graph .graphCnt .gpCnt02 dt{background-color: #5CB058; border-radius: 50px; width: 270px; padding: 15px; color: #fff; text-align: center; margin-left: -10px;}
.cnt101 .cnt-wrap .cnt101-graph .graphCnt .gpCnt03{display: block; background-color: #398A6B; border-radius: 50px; width: 270px;     height: 54px; padding: 15px; color: #fff; text-align: center;margin-left: -10px;}
.cnt101 .cnt-wrap .cnt101-graph .graphCnt dd{font-size: 1.6rem;}
.cnt101 .cnt-wrap .txtDotBox, .cnt101 .roundBox{margin-top: 20px;}
.cnt101 .cnt-wrap .txtDotBox .bullet03 li:not(:last-child){margin-bottom: 30px;}
.cnt101 .cnt-wrap .txtDotBox .bullet03 li div{font-size: 1.8rem; color: #222; font-weight: 400; margin-bottom: 5px;}
.cnt101 .cnt-wrap .txtDotBox .bullet03 li p{font-size: 1.6rem; line-height: 23px; color: #666;}
.cnt101 .cnt-wrap .cnt-tx .txtDotBox{display: flex;justify-content: space-around; align-items: center;}
.cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-img{border-radius: 100%; width: 200px; height: 200px; background: url(../../image/sub/cnt101-img.jpg) no-repeat; flex-shrink: 0; box-shadow: 10px 2px 0 #9FDCBE;}
.cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-tx-wrap{max-width: 73%; min-width: 70%; padding-left: 2%;}
.cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-tx-wrap span {font-size: 2rem; color: #008600; font-weight: 700; margin-bottom: 10px; display: block;}
.cnt101 .cnt-wrap .methodBox .bullet02{border-bottom: 1px dotted #BEBEBE; padding-bottom: 15px;}
.cnt101 .cnt-wrap .methodBox .txtDotBox{border: 0;}

@media (max-width:1067px){
  .cnt101 .cnt-wrap{margin-bottom: 100px;}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-tx-wrap{width: 60%;}
}
@media (max-width:856px){
  .cnt101 .cnt-wrap .cnt101-img{flex: 0 1 calc(33% - 40px);}
  .cnt101 .cnt-tx p{line-height: 25px;}
  .cnt101 .cnt-wrap .cnt101-graph .graphLine{display: none; }
  .cnt101 .cnt-wrap .cnt101-graph .graphTit{transform: none;}
  .cnt101 .cnt-wrap .cnt101-graph .graphCnt{width: 100%; flex-direction: column; align-items: center; margin-top: 40px;}
  .cnt101 .cnt-wrap .cnt101-graph .graphCnt .gpCnt{width:70%;}
  .cnt101 .cnt-wrap .cnt101-graph .graphCnt .gpCnt dt{width:100%; }
  .cnt101 .cnt-wrap .cnt101-graph .graphCnt .gpCnt:not(:last-child){margin-bottom: 30px; border-bottom: 1px solid #e6e6e6; padding-bottom: 10px;}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox{width: 100%; display: block;}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-img{margin: auto}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-tx-wrap{width: 100%; margin: 20px auto 0 auto; text-align: center;}
}
@media (max-width:767px){
  .cnt101 .cnt-wrap .cnt101-bg{height: 200px;}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-tx-wrap span{font-size: 1.8rem;}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-tx-wrap p{line-height: 22px;}
  .cnt101 .cnt-wrap .txtDotBox .bullet03 li div{font-size: 1.7rem;}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-img{width: 180px; height: 180px; background-position: center;}
}
@media (max-width:500px){
  .cnt101 .cnt-wrap .cnt101-bg{height: 160px;}
  .cnt101 .cnt-wrap .cnt101-graph .graphTit{width: 90%; padding: 10px 0;}
  .cnt101 .cnt-wrap .cnt101-graph .graphTit span{font-size: 1.8rem;}
  .cnt101 .cnt-wrap .cnt101-graph .graphCnt .gpCnt{width:90%;}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-tx-wrap span{letter-spacing: -0.8px;}
  .cnt101 .cnt-wrap .cnt-tx .txtDotBox .cnt-img{width: 150px; height: 150px; background-position: center;}
}

/***************************************** cnt102 ***********************************************/
.cnt102 .cnt-wrap{max-width: 1100px; width: 100%;}
.cnt102 .cnt-wrap .cnt-card{width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; justify-content: space-around; margin: 20px 0; align-items: center;}
.cnt102 .cnt-wrap .cnt-card li{border: 1px solid #DBDBDB; padding: 30px; border-radius: 10px;}
.cnt102 .cnt-wrap .cnt-card li .cnt-icon01{margin:0 auto; width: 120px; height: 120px; background: url(../../image/sub/cnt102icon01.png) no-repeat;}
.cnt102 .cnt-wrap .cnt-card li .cnt-icon02{margin:0 auto; width: 120px; height: 120px; background: url(../../image/sub/cnt102icon02.png) no-repeat;}
.cnt102 .cnt-wrap .cnt-card li .cnt-icon03{margin:0 auto; width: 120px; height: 120px; background: url(../../image/sub/cnt102icon03.png) no-repeat;}
.cnt102 .cnt-wrap .cnt-card li span{display: block; font-size: 2rem; font-weight: 400; color: #008a6e; text-align: center; margin-bottom: 10px; position: relative; margin-top: 15px; text-decoration: underline;}
.cnt102 .cnt-wrap .cnt-card li p{text-align: center;}

.cnt102 .cnt-wrap .cnt-graph-wrap{max-width: 1110px; margin-bottom: 110px;}
.cnt102 .cnt-wrap .cnt-graph{display:flex; justify-content: space-between; padding: 30px;}
.cnt102 .cnt-wrap .cnt-graph li{text-align:center; display:flex; flex-direction: column; justify-content: center; background:url('../../image/sub/cnt102-graphCenter.png') no-repeat center; background-size:100%; width:100%; height:168px; color: #0B7B65;  position:relative; color: #0B7B65;}
.cnt102 .cnt-wrap .cnt-graph li div{margin-left:-25px; font-size: 18px;font-weight: 400;line-height: 25px;}
.cnt102 .cnt-wrap .cnt-graph li:nth-last-child(1) div{margin: 0;}
.cnt102 .cnt-wrap .cnt-graph li span{color: #919191; display: block; margin-top: 5px;}
.cnt102 .cnt-wrap .cnt-graph li:nth-child(1){background:url('../../image/sub/cnt102-graphLeft.png') no-repeat center; background-size:100%;}
.cnt102 .cnt-wrap .cnt-graph li:nth-last-child(1){background:url('../../image/sub/cnt102-graphRight.png') no-repeat center; background-size:100%; width:85%;}

@media all and (max-width:1319px){
  .cnt102 .cnt-wrap .cnt-card li p{font-size: 1.6rem; line-height: 22px;}
}
@media (max-width:1280px){
  .cnt102 .cnt-wrap .cnt-graph{flex-wrap: wrap; justify-content: center; width:800px; margin:0 auto;}
  .cnt102 .cnt-wrap .cnt-graph li{width:200px; background-size:196px; width:196px; margin:20px 0;}
  .cnt102 .cnt-wrap .cnt-graph li:nth-last-child(1),.cnt102 .cnt-wrap .cnt-graph li:nth-child(3){width:164px;}
  .cnt102 .cnt-wrap .cnt-graph li:nth-child(3) div{margin:0; }
  .cnt102 .cnt-wrap .cnt-graph li:nth-child(3){background:url('../../image/sub/cnt102-graphRight.png') no-repeat center; background-size:100%;}
  .cnt102 .cnt-wrap .cnt-graph li:nth-child(4){background:url('../../image/sub/cnt102-graphLeft.png') no-repeat center; background-size:100%; }
}
@media all and (max-width:959px){
  .cnt102 .cnt-wrap .cnt-card{grid-gap: 10px;}
  .cnt102 .cnt-wrap .cnt-card li{padding: 20px 0 30px 0;}
  .cnt102 .cnt-wrap .cnt-card li p br{display: none;}
  .cnt102 .cnt-wrap .cnt-card li span{font-size: 1.8rem; margin: 5px 0;}
  .cnt102 .cnt-wrap .cnt-card li p{font-size: 1.6rem;}
  .cnt102 .cnt-wrap .cnt-card li .cnt102icon{background-size: 85%; background-position: center;}
}
@media all and (max-width:767px){
  .cnt102 .cnt-wrap .cnt-card{display:flex; flex-direction: column;}
  .cnt102 .cnt-wrap .cnt-card li{width: 100%; padding: 15px 20px;}
  .cnt102 .cnt-wrap .cnt-card li span{font-size: 1.8rem;}
  .cnt102 .cnt-wrap .cnt-card li .cnt102icon{left: 0;}
  .cnt102 .cnt-wrap .cnt-graph{flex-wrap: wrap; justify-content: center; flex-direction: column; align-items: center; width:100%;}
  .cnt102 .cnt-wrap .cnt-graph li,.cnt102 .cnt-wrap .cnt-graph li:nth-last-child(1),.cnt102 .cnt-wrap .cnt-graph li:nth-child(1){background:none; margin:10px 0;}
  .cnt102 .cnt-wrap .cnt-graph li div{margin-left:0;}
  .cnt102 .cnt-wrap .cnt-graph li::after {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url('../../image/sub/cnt102-graphCenter.png') no-repeat center center;background-size: cover;transform: rotate(90deg);transform-origin: center;}
  .cnt102 .cnt-wrap .cnt-graph li:nth-last-child(1){margin:0; width:200px;}
  .cnt102 .cnt-wrap .cnt-graph li:nth-last-child(1)::after{background: url('../../image/sub/cnt102-graphRight.png') no-repeat center center; }
  .cnt102 .cnt-wrap .cnt-graph li:nth-child(1)::after{background: url('../../image/sub/cnt102-graphLeft.png') no-repeat center center;}
  .cnt102 .cnt-wrap .cnt-graph li:nth-child(3){background:none; width:200px;}
  .cnt102 .cnt-wrap .cnt-graph li:nth-child(4){background:none;}
}
@media all and (max-width:593px){
  .cnt102 .cnt-wrap .cnt-tx br{display: none;}
}



/***************************************** cnt1` ***********************************************/
.contentArea .resultList li:not(:last-child) {margin-bottom: 15px;}
.resultList .conWrap {display: flex; flex-direction:row; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #e9e9e9;}
.cnt103 .resultArea .conBox .resultList .conTit{align-items: center;}
.cnt103 .resultArea .conBox .resultList .conWrap .cnt103-icon{width: 40px; height: 40px; background: url(../../image/sub/cnt103icon.svg);}
.cnt103 .resultList .conTit p {margin-left: 10px; font-size: 2rem; color: #222; font-weight: 700;}
.cnt103 .resultList .conTit p::before {font-size: 2rem; color: #222; font-weight: 700;} /***img bofore로 넣기***/
.cnt103 .resultList li {border: 2px solid #ddd; padding: 25px; border-radius: 10px; transition: all 0.3s;}
.cnt103 .resultList li:hover {border:2px solid transparent; background-image: linear-gradient(#fff, #fff), linear-gradient(131deg, rgba(23,183,148,1) 0%, rgba(118,188,26,1) 100%); background-origin: border-box; background-clip: padding-box, border-box; box-shadow: 2px 5px 4px rgba(0, 0, 0, 0.08);}
.cnt103 .resultList li:hover .downloadBtn3{border: 1px solid #71BC20; background-color: #F4FFE5; color: #3F7100;}
.cnt103 .resultList li .conTxt .t_r .downloadBtn3{transition: all 0.3s;}
.cnt103 .resultList li .conTxt{display: flex; justify-content: space-between; align-items: center;}
.cnt103 .resultList li .conTxt .desc{width: 85%; margin-top: 10px; color: #888888;}
.cnt103 .resultArea .conBox .noticeTxt{display: flex; align-items: center; justify-content: center; margin-top: 40px; background-color: #FAFAFA; width: 100%; padding: 30px 15px;}
.cnt103 .resultArea .conBox .noticeTxt p{color: #0B7B65; text-decoration: underline; text-align: center;}
.cnt103 .resultArea .conBox .noticeTxt .noticeIcon{margin-right: 10px; background: url(../../image/sub/cnt103icon02.svg) no-repeat; width: 25px; height: 26px;}

@media all and (max-width:1452px){
  .downloadBtn3{padding: 10px 15px;}
  .downloadBtn3::after{margin-left: 10px;}
  .cnt103 .resultList li .conTxt .desc{width: 80%;}
}
@media all and (max-width:1183px){
  .cnt103 .resultList .conTit p{width: 80%;}
}
@media all and (max-width:767px){
  .cnt103 .resultList li .conTit p{font-size: 1.8rem;} 
  .cnt103 .resultList li .conTxt .desc{width: 100%; margin-bottom: 10px; font-size: 1.6rem;}
  .cnt103 .resultList li .conTxt{display: block;}
  .cnt103 .resultArea .conBox .noticeTxt{display: block; padding: 15px 10px;}
  .cnt103 .resultArea .conBox .noticeTxt .noticeIcon{margin: 0 auto;}
  .cnt103 .resultArea .conBox .noticeTxt p{margin-top: 5px; font-size: 1.6rem;}
}
@media all and (max-width:500px){
  .cnt103 .resultList li .conTit{display: block; margin: 0 auto;}
  .cnt103 .resultList li .conTit p{font-size: 1.7rem; width: 100%; margin-top: 10px;} 
  .cnt103 .resultList li .conTxt .downloadBtn3 {font-size: 1.5rem; padding: 8px 13px;}
}
/***************************************** cnt104 ***********************************************/
.cnt104 .bullet03 .example {text-indent: 10px;}
.cnt104 .resultList li {border: 2px solid #ddd; padding: 20px; border-radius: 10px; cursor: url('../../image/sub/clickNone.png'),url('../../image/sub/clickNone.svg'),url('../../image/sub/clickNone.jpg'),auto;}
.contentArea .resultList li:not(:last-child) {margin-bottom: 10px;}
.cnt104 .resultList .conWrap {display: flex; flex-direction:row; justify-content: space-between; margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #e9e9e9;}
.cnt104 .resultList .conWrap p {font-size: 2rem; color: #222; font-weight: 700;}
.cnt104 .resultList .conWrap p span {font-weight: 400; padding-left: 5px;}

@media all and (max-width:999px){
  .cnt104 .resultList .conWrap {display: flex; flex-direction:column-reverse; align-items: flex-start; margin-bottom: 10px;}
  .cnt104 .resultList .conWrap .colorBox {margin-bottom: 5px;}
}
@media all and (max-width:500px){
  .cnt104 .resultList .conWrap p {font-size: 1.8rem;}
}
/***************************************** cnt201 ***********************************************/
.contentArea .subSearchArea .infoTxt {display: block; text-align: center; margin-top: 10px; font-size: 1.6rem;}
.contentArea .subSearchArea .infoTxt i {display: inline-block; width: 16px; height: 15px; background: url(../../image/sub/infoIcon.png)no-repeat; margin-right: 5px; vertical-align: text-bottom;}
.contentArea .resultArea .totalCount {color: #222; font-weight: 400; padding-bottom: 10px; margin-bottom: 30px; border-bottom:2px solid #555; position:relative;}
.contentArea .resultArea .totalCount .species {font-size: 2.8rem; font-weight: 700;}
.contentArea .resultArea .totalCount .downloadBtn {position: absolute; right:0; bottom:10px;}
.contentArea .resultArea .resultConBox .resultTi {display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; margin-bottom: 15px;}
.contentArea .resultArea .resultConBox .speciesLegend {display:flex; flex-direction: row; padding: 20px; background: #fafafa; border-radius: 10px; margin-bottom: 15px;}
.contentArea .resultArea .resultConBox .speciesLegend li {font-size: 1.6rem; margin-right: 15px;}
.contentArea .resultArea .resultConBox .speciesLegend li:last-child {margin-right:0;}
.contentArea .resultArea .resultConBox li i {width: 23px; height: 19px; display: inline-block; vertical-align: sub; margin-right: 3px;}
.contentArea .resultArea .resultConBox li i.legendIcon01 {background: url(../../image/sub/legendIcon01.png) no-repeat center;}
.contentArea .resultArea .resultConBox li i.legendIcon02 {background: url(../../image/sub/legendIcon02.png) no-repeat center;}
.contentArea .resultArea .resultConBox li i.legendIcon03 {background: url(../../image/sub/legendIcon03.png) no-repeat center;}
.contentArea .resultArea .resultConBox li i.legendIcon04 {background: url(../../image/sub/legendIcon04.png) no-repeat center;}
.contentArea .resultArea .resultConBox li i.legendIcon05 {background: url(../../image/sub/legendIcon05.png) no-repeat center;}
.contentArea .resultArea .resultConBox li i.legendIcon06 {background: url(../../image/sub/legendIcon06.png) no-repeat center;}
.contentArea .resultArea .resultConBox li i.legendIcon07 {background: url(../../image/sub/legendIcon07.png) no-repeat center;}
.contentArea .resultArea .resultConBox li i.legendIcon08 {background: url(../../image/sub/legendIcon08.png) no-repeat center;}
.contentArea .resultArea .resultConBox li i.legendIcon09 {background: url(../../image/sub/legendIcon09.png) no-repeat center;}
.contentArea .resultArea .resultConBox .speciesInfoList li:not(:last-child) {margin-bottom: 10px;}
.contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfo {display:flex; flex-direction: row; justify-content: space-between; align-items: flex-start; width: 100%; padding: 20px; border: 2px solid #dbdbdb; border-radius: 10px; transition: all 0.3s;}
.contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfo.nonClick {cursor: url('../../image/sub/clickNone.png'),url('../../image/sub/clickNone.svg'),url('../../image/sub/clickNone.jpg'),auto;}
.contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfo:hover {border: 2px solid transparent; background-image: linear-gradient(#fff, #fff), linear-gradient(131deg, rgba(23,183,148,1) 0%, rgba(118,188,26,1) 100%); background-origin:border-box;  background-clip:padding-box, border-box; box-shadow: 2px 5px 4px rgba(0, 0, 0, 0.08); transition: all 0.3s;}
.contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfoEmpty {pointer-events: none; justify-content: center; align-items:center;}
.contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfo .infoWrap p {font-size: 2rem; color: #222; font-weight: 700; padding-bottom:5px;}
.contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfo .infoWrap .speciesInfo_en {display: inline-block; padding-left: 5px;}
.contentArea .resultArea .resultConBox .resultTable:not(:last-of-type) {margin-bottom: 30px;}
.speciesInfoWrap {display: flex; flex-direction: row; justify-content: space-between;}
.speciesInfoWrap .speciesInfoImg {width: 300px; height: 286px;}
.speciesInfoWrap .speciesInfoImg img {width: 100%; height: 100%; object-fit: cover;}
.speciesInfoWrap .speciesInfoTaxon {width: calc(100% - 350px);}
.speciesInfoWrap .speciesInfoTaxon .infoTop {display: flex; justify-content: space-between; align-items: flex-end; border-bottom: 2px solid #555; padding-bottom: 5px;}
.speciesInfoWrap .speciesInfoTaxon .scBold {font-size: 2.8rem; color: #222; font-weight: 700; font-style: normal;}
.speciesInfoWrap .speciesInfoTaxon dl {display: flex; flex-direction: row; padding: 7px 0; border-bottom: 1px dashed #C2C2C2;}
.speciesInfoWrap .speciesInfoTaxon dl:nth-of-type(2) dd {margin-bottom:-5px;}
.speciesInfoWrap .speciesInfoTaxon dl dt {width: 100px; flex-shrink: 0; color: #222; font-weight: 400;}
.speciesInfoWrap .speciesInfoTaxon .taxonInfo {display:inline-block; padding :2px 8px; border-radius: 4px; font-size: 1.6rem; margin-bottom: 5px;}
.speciesInfoWrap .speciesInfoTaxon .speciesStatus {margin-right: -10px;}
.speciesInfoWrap .speciesInfoTaxon .speciesStatus,
.speciesInfoWrap .speciesInfoTaxon .speciesStatus li {display: flex; flex-shrink: 0; flex-wrap: wrap;}
.speciesInfoWrap .speciesInfoTaxon .speciesStatus li {position:relative; width: calc((100% - 30px) / 3); align-items: center; justify-content: space-between; padding-left: 10px; margin-right: 10px;}
.speciesInfoWrap .speciesInfoTaxon .speciesStatus li::before {position: absolute; left:0;}
.speciesInfoWrap .speciesInfoTaxon .speciesStatus li span {display: inline-block;}
.infoTabBox {display: table; width: 100%; table-layout: fixed;}
.infoTabBox li {display: table-cell;}
.infoTabBox li a {display: block; text-align: center; border-top:1px solid #dbdbdb; border-left:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; color: #8b8b8b; height: 46px; line-height: 46px; }
.infoTabBox li:last-child a {border-right: 1px solid #dbdbdb;}
.infoTabBox li a.on {background: #76BC1A; color: #fff; border: 0; font-weight: 400; border-right: 0;}
.cnt201 .tabConArea .bullet01 {position:relative;}
.cnt201 .tabConArea .bullet01 .btnBox {position:absolute; right:0;}
.cnt201 .tabConArea .emptyBox {background: #f9f9f9; text-align:center; padding: 100px 0; margin-top: 15px;}
.cnt201 .tabConArea .tabConBox {margin-top: 15px;} 
.cnt201 .tabConArea .tabConBox .table table th {text-wrap: nowrap;}
.cnt201 .tabConArea .tabConBox .mapArea {width: 100%; height: 360px; background: url(../../image/sub/mapArea.png) no-repeat;}
.cnt201 .tabConArea .tabConBox .minmaxBox ul {position: relative; padding-left: 15px; font-weight: 400; display: flex; flex-direction: row; flex-wrap: wrap;}
.cnt201 .tabConArea .tabConBox .minmaxBox ul::before {content: ""; width: 8px; height: 1px; background: #006500; position: absolute; left: 0; top: 12px;}
.cnt201 .tabConArea .tabConBox .minmaxBox ul li {color: #555; flex-shrink: 0;}
.cnt201 .tabConArea .tabConBox .minmaxBox ul li::after {content: ""; width: 1px; height: 14px; background: #006500; display: inline-block; margin: 0 12px;}
.cnt201 .tabConArea .tabConBox .minmaxBox ul li:last-child:after {content: none;}
.cnt201 .tabConArea .tabConBox .infoType {display: inline-block; padding: 4px 10px; border-radius: 4px; font-weight: 400;}
.cnt201 .tabConArea .scBold {font-size: 2rem; font-style: normal; font-weight: 400;}
.cnt201 .tabConArea .tabConBox .imgInfo {display: flex; flex-wrap: wrap; margin: 0 -30px -30px 0;}
.cnt201 .tabConArea .tabConBox .imgInfo > li {width:calc((100% - 60px) / 2); margin: 0 30px 30px 0;}
.cnt201 .tabConArea .tabConBox .imgInfo .conWrap {display: flex; align-items: center; justify-content: space-between;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox {display: flex;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox li:not(:last-child) {margin-right: 20px;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox li {width: 50%; height:200px;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox a {display: block; width: 100%; height: 100%; position:relative;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox a::before {content: ""; width: 100%; height: 100%; background: #fff; opacity: 0.4; position:absolute; top: 0; left: 0; opacity: 0; transition: opacity 0.3s;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox a:hover::before {opacity: 0.4;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox a::after {content: ""; width: 64px; height: 64px; background: url(../../image/sub/moreBtn.png) no-repeat; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; transition: opacity 0.3s;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox a:hover::after {opacity: 1;}
.cnt201 .tabConArea .tabConBox .imgInfo > li .roundBox img {display: block; width:100%; max-width: 100%; height: 100%; object-fit: cover;}

.cnt201 .subSearchArea .optionDetailBtn {width: 90px;height:45px; margin-left: 5px;border-radius: 4px;flex-shrink: 0;background: #fff; border:1px solid #76BC1A; color:#76BC1A;}
.cnt201 .subSearchArea .subSearchBox.type1 input[type="text"]{width:calc(100% - 190px);}
.cnt201 .subSearchArea .optionDetail {margin-top:36px; padding-top:30px; border-top:1px dashed #d1d1d1; display: none;}
.cnt201 .subSearchArea .optionDetail.on {display:block;}
.cnt201 .subSearchArea .optionDetail .selInput { width: calc(50% - 60px) !important; float: left;}
.cnt201 .subSearchArea .optionDetail .selInput2 { width: calc(100% - 120px) !important; float: left;}
.cnt201 .subSearchArea .optionDetail .wave2 {display: block; width: 60px; line-height: 45px;text-align: center; float: left;}

@media all and (max-width:1499px){
  .speciesInfoWrap .speciesInfoTaxon .speciesStatus li {width:calc((100% - 20px) / 2);}
}
@media all and (max-width:1279px){
  .contentArea .resultArea .totalCount .species {font-size: 2.6rem;}
  .speciesInfoWrap {flex-direction: column; align-items: center;}
  .speciesInfoWrap .speciesInfoTaxon {width: 100%;}
  .speciesInfoWrap .speciesInfoTaxon .speciesStatus li {width:calc((100% - 30px) / 3);}
  .speciesInfoWrap .speciesInfoTaxon .scBold {font-size: 2.4rem;}
}
@media all and (max-width:1350px){
  .contentArea .resultArea .resultConBox .speciesLegend {flex-wrap: wrap; padding-bottom: 10px;}
  .contentArea .resultArea .resultConBox .speciesLegend li { margin-bottom: 10px;}
}
@media all and (max-width:999px){
  .contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfo .infoWrap .speciesInfo_en {display: block;}
  .infoTabBox {display: flex; flex-wrap: wrap;}
  .infoTabBox li {width: calc(100% / 3);}
  .infoTabBox li a {height:40px; line-height: 40px;}
  .infoTabBox li:nth-child(3) a,
  .infoTabBox li:nth-child(6) a,
  .infoTabBox li:last-child a {border-right: 1px solid #dbdbdb;}
  .infoTabBox li:nth-child(n + 4):nth-child(-n + 9) a {border-top: 0;}
  .speciesInfoWrap .speciesInfoTaxon {margin-top: 10px;}
}
@media all and (max-width:767px){
  .exampleBox .bullet01 {flex-direction: column; align-items: flex-start;}
  .exampleBox .bullet01 .red {margin-top: 5px;}
  .contentArea .resultArea .totalCount .species {font-size: 2.4rem;}
  .contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfo {flex-direction: column-reverse;}
  .speciesInfoWrap .speciesInfoTaxon dl {flex-direction: column;}
  .speciesInfoWrap .speciesInfoTaxon dt {margin-bottom: 5px;}
  .speciesInfoWrap .speciesInfoTaxon .speciesStatus li {width:calc((100% - 20px) / 2);}
  .cnt201 .tabConArea em {font-size: 1.8rem;}
  .cnt201 .tabConArea .tabConBox .infoType {padding: 2px 10px;}
  .cnt201 .tabConArea .tabConBox .imgInfo {margin: 0;}
  .cnt201 .tabConArea .tabConBox .imgInfo > li {width: 100%; margin: 0 0 20px 0;}
  .cnt201 .tabConArea .tabConBox .imgInfo > li:last-child {margin-bottom: 0;}
  .contentArea .resultArea.resultMoreView .totalCount {padding-top:50px;}
  .contentArea .resultArea .totalCount .downloadBtn {bottom:auto; top:0;}
  .cnt201 .subSearchArea .optionDetail {margin-top: 26px; padding-top:20px;}
  
}
@media all and (max-width:600px){
	.cnt201 .subSearchArea .optionDetail .inputName {width:100% !important;}
    .speciesInfoWrap .speciesInfoTaxon .infoTop {flex-direction: column; align-items: normal;}
    .speciesInfoWrap .speciesInfoTaxon .scBold {text-align: center;}
	.cnt201 .btnBox {margin-top: 10px;}
	.cnt201 .downloadBtn {width: 100%; text-align: center;}
	.editBtn {width: 100%; margin-top: 5px;}
}
@media all and (max-width:500px){
  .contentArea .resultArea .resultConBox .speciesInfoList li .speciesInfo .infoWrap p {font-size: 1.8rem;}
  .speciesInfoWrap .speciesInfoTaxon .speciesStatus {margin-right: 0;}
  .speciesInfoWrap .speciesInfoTaxon .speciesStatus li {width:100%;}
  .infoTabBox li {width: calc(100% / 2);}
  .infoTabBox li:nth-child(3) a{border-right: 0;}
  .infoTabBox li:nth-child(2) a, 
  .infoTabBox li:nth-child(4) a,
  .infoTabBox li:nth-child(8) a,
  .infoTabBox li:last-child a{border-right:1px solid #dbdbdb;}
  .infoTabBox li:nth-child(n + 3):nth-child(-n + 5) a {border-top: 0;}
  .cnt201 .subSearchArea .subSearchBox.type1 input[type="text"] {width: 100%;}
  .cnt201 .subSearchArea .optionDetailBtn {width: 100%; margin-left: 0; margin-top: 5px;}
  .cnt201 .subSearchArea .optionDetail .selInput {width: calc(50% - 50px) !important;}
  .cnt201 .subSearchArea .optionDetail .selInput2 {width: calc(100% - 100px) !important;}
  .cnt201 .subSearchArea .optionDetail .wave2 {width:50px;}

  
}
@media all and (max-width: 420px) {
  .contentArea .resultArea .resultConBox .speciesLegend li{ width: 50%; margin-right: 0;}
}
/***************************************** cnt202 ***********************************************/
.cnt202 .resultList > .resultListWrap,
.cnt202 .tabConArea .imgWrap {display: flex; margin: 0 -30px -30px 0; flex-wrap: wrap;}
.cnt202 .resultList > .resultListWrap > li,
.cnt202 .tabConArea .imgWrap li {width: calc((100% - 120px) / 4); margin: 0 30px 30px 0;}
.cnt202 .resultList > .resultListWrap > li a {position:relative;}
.cnt202 .resultList > .resultListWrap > li a:focus-visible::before {content: "";padding: 2px; display: block; position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 100%; height: 100%; border: 2px dotted #000; border-radius: 10px;}
.cnt202 .resultList > .resultListWrap > li .imgWrap {height: 210px;}
.cnt202 .resultList > .resultListWrap > li img,
.cnt202 .tabConArea img  {display: block; width: 100%; max-width: 100%; height: 100%; object-fit: cover;}
.cnt202 .resultList > .resultListWrap > li img{border-radius: 10px 10px 0 0;}
.cnt202 .resultList > .\resultListWrap > li figcaption { padding: 15px; border: 1px solid #dbdbdb; border-radius: 0 0 10px 10px;}
.cnt202 .iconList {justify-content: flex-end;}
.cnt202 .resultList > .resultListWrap > li p {word-break: break-all; font-size: 2rem; color: #222; font-weight: 700;}
.cnt202 .resultList > .resultListWrap > li p .speciesInfo_en {height:24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 400; color: #555;}
.cnt202 .iconList li {width: 30px; height: 30px; border: 1px solid #dbdbdb; border-radius: 4px; text-align: center;}
.cnt202 .iconList li i {display: inline-block; width: 30px; height: 30px; background-position: center; background-repeat: no-repeat;}
.cnt202 .iconList li i.Icon01 {background-image: url(../../image/sub/cnt202Icon01.png);}
.cnt202 .iconList li i.Icon02 {background-image: url(../../image/sub/cnt202Icon04.png);}
.cnt202 .iconList li i.Icon03 {background-image: url(../../image/sub/cnt202Icon02.png);}
.cnt202 .iconList li i.Icon04 {background-image: url(../../image/sub/cnt202Icon03.png);}
.cnt202 .iconList li i.Icon05 {background-image: url(../../image/sub/cnt202Icon05.png);}
.cnt202 .checkList {display: flex; flex-wrap: wrap; height:100%; align-items: center;}
.cnt202 .checkList li:not(:last-child) {margin-right: 10px;}

.cnt202 .tabConArea .imgWrap > li a {display: block; width: 100%; height:200px; position:relative;}
.cnt202 .tabConArea .imgWrap > li a::before {content: ""; width: 100%; height: 100%; background: #fff; opacity: 0.4; position:absolute; top: 0; left: 0; opacity: 0; transition: opacity 0.3s;}
.cnt202 .tabConArea .imgWrap > li a:hover::before {opacity: 0.4;}
.cnt202 .tabConArea .imgWrap > li a::after {content: ""; width: 64px; height: 64px; background: url(../../image/sub/moreBtn.png) no-repeat; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; transition: opacity 0.3s;}
.cnt202 .tabConArea .imgWrap > li a:hover::after {opacity: 1;}
.cnt202 .tabConArea .imgWrap > li a img {display: block; width:100%; max-width: 100%; height: 100%; object-fit: cover;}


@media all and (max-width:999px) {
  .cnt202 .resultList > .resultListWrap > li,
  .cnt202 .tabConArea .imgWrap li {width: calc((100% - 90px) / 3);}
}
@media all and (max-width:768px) {
  .cnt202 .resultList > .resultListWrap,
  .cnt202 .tabConArea .imgWrap {margin: 0 -20px -20px 0;}
  .cnt202 .resultList > .resultListWrap > li,
  .cnt202 .tabConArea .imgWrap li {width: calc((100% - 40px) / 2); margin:0 20px 20px 0;}
}
@media all and (max-width:500px) {
  .cnt202 .resultList > .resultListWrap,
  .cnt202 .tabConArea .imgWrap {margin: 0 0 -20px 0;}
  .cnt202 .resultList > .resultListWrap > li,
  .cnt202 .tabConArea .imgWrap li {width: 100%; margin:0 0 20px 0;}
  .cnt202 .resultList > .resultListWrap > li p {font-size: 1.8rem;}
}
/***************************************** cnt203 ***********************************************/
.__float-tbl {position: absolute; top: 30px; left: -50px; text-align: left; border-radius: 5px; background-color: #fff; color: #555; width: 280px; line-height: 1.5; font-weight:400; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);overflow: hidden;}
.__float-tbl .closeBtn {padding:2px 10px; background: #F1F0F6; text-align:right; border-bottom: 1px solid #eaeaea;}
.__float-tbl .closeIcon {display: inline-block; width: 20px; height:20px; background:url(../../image/sub/close-btn.svg)no-repeat center / cover; vertical-align: sub;}
.__float-tbl .popbody {padding:12px; font-size: 1.4rem;}
.__float-tbl .popbody span {font-size: 1.4rem;}
.__float-tbl .popbody span::after {content:''; display:inline-block; width: 1px; height: 10px; background:#b7b7b7; margin: 0 5px;}
.ol-control button {background-color: rgb(77 77 77 / 50%) !important;}
.ol-control button:focus, .ol-control button:hover {background-color: rgb(75 75 75 / 70%) !important;}
/***************************************** cnt204 ***********************************************/
.cnt204 .chartBox {display: flex; flex-direction: column;}
.cnt204 .chartBox > div canvas {width: 100% !important; height: auto !important;}
.cnt204 .chartBox > div .methodBox {height: 470px; overflow: hidden;}
.cnt204 .chartBox > div:last-child .methodBox {display: flex; align-items: center;}
.cnt204 .chartBox .w100{width: 100%;}
.cnt204 .chartBox .chart_wr{display: flex; gap: 20px;}
.cnt204 .chartBox .chart_wr > div{width:calc((100% - 20px) / 2);}


@media all and (max-width:1499px) {
	.cnt204 .chartBox > div .methodBox {height: 29vw;}

}
@media all and (max-width:1279px) {
	.cnt204 .chartBox > div .methodBox {height: 37vw;}
}
@media all and (max-width:999px) {
	.cnt204 .chartBox {flex-direction: column;}
	.cnt204 .chartBox > div {width: 100%;}
	.cnt204 .chartBox > div:first-child {margin-bottom: 30px;}
	.cnt204 .chartBox > div .methodBox {height: auto;}
}
@media all and (max-width:767px) {
	.cnt204 .chartBox > div:first-child {margin-bottom: 20px;}
	
}
/***************************************** cnt301 ***********************************************/
.cnt301 .methodBox .bullet02 {padding-bottom: 10px; border-bottom: 1px dashed #BEBEBE; margin-bottom: 20px;}
.cnt301 .methodBox p {margin-bottom: 20px;}
.cnt301 .processBox {display: flex; flex-wrap: wrap ;}
.cnt301 .processBox ul {display: flex; flex-direction: row; width: 100%;}
.cnt301 .processBox ul li {display: flex; flex-direction: column; align-items: center; text-align: center; position:relative; width: 180px; }
.cnt301 .processBox ul li .cir {position:relative; display: block; width: 100px; height: 100px; border-radius: 50%; margin-bottom: 10px;}
.cnt301 .processBox ul li .cir::after {content:""; width: 0px; height: 0px; border-top: 9px solid transparent;  border-left: 12px solid #D9D9D9; border-bottom: 9px solid transparent; display: block; position:absolute; right:-50%; top: 50%; transform: translateY(-50%);}
.cnt301 .processBox ul:last-child li:last-child .cir::after {content:none;}
.cnt301 .processBox ul li:first-child .cir {background: #F5F5F5 url(../../image/sub/processIcon01.png) no-repeat center center;}
.cnt301 .processBox ul li:nth-child(2) .cir {background: #F5F5F5 url(../../image/sub/processIcon02.png) no-repeat center center;}
.cnt301 .processBox ul li:nth-child(3) .cir {background: #F5F5F5 url(../../image/sub/processIcon03.png) no-repeat center center;}
.cnt301 .processBox ul li:nth-child(4) .cir {background: #F5F5F5 url(../../image/sub/processIcon04.png) no-repeat center center;}
.cnt301 .processBox ul li:nth-child(5) .cir {background: #F5F5F5 url(../../image/sub/processIcon05.png) no-repeat center center;}
.cnt301 .processBox ul li:last-child .cir {background: #F5F5F5 url(../../image/sub/processIcon06.png) no-repeat center center;}
.cnt301 .processBox ul li strong {font-size: 1.8rem; padding-bottom: 5px;}
.cnt301 .inquiryBox ul {display: flex; flex-direction: row; flex-wrap: wrap; margin-right: -20px; margin-bottom: -20px; margin-top: 15px;}
.cnt301 .inquiryBox ul li {display: flex; flex-direction: row; width: calc((100% - 60px) / 3); border:5px solid #ebebeb; flex-shrink: 0; margin-right: 20px; margin-bottom: 20px; padding:20px;}
.cnt301 .inquiryBox ul li .inquiryIcon {display: inline-block; width: 90px; height: 90px; border-radius: 10px; flex-shrink: 0; margin-right: 20px;}
.cnt301 .inquiryBox ul li:first-child .inquiryIcon {background: #F5F5F5 url(../../image/sub/inquiryIcon01.png) no-repeat center;}
.cnt301 .inquiryBox ul li:nth-child(2) .inquiryIcon {background: #F5F5F5 url(../../image/sub/inquiryIcon02.png) no-repeat center;}
.cnt301 .inquiryBox ul li:nth-child(3) .inquiryIcon {background: #F5F5F5 url(../../image/sub/inquiryIcon03.png) no-repeat center;}
.cnt301 .inquiryBox ul li:nth-child(4) .inquiryIcon {background: #F5F5F5 url(../../image/sub/inquiryIcon04.png) no-repeat center;}
.cnt301 .inquiryBox ul li:last-child .inquiryIcon {background: #F5F5F5 url(../../image/sub/inquiryIcon05.png) no-repeat center;}
.cnt301 .inquiryBox ul li .txtWrap strong {display: block; font-size: 1.8rem; color: #222; font-weight: 400; padding-bottom: 5px;}
.cnt301 .inquiryBox ul li .txtWrap dl {line-height: 1.2;}
.cnt301 .inquiryBox ul li .txtWrap dt,
.cnt301 .inquiryBox ul li .txtWrap dd {display: inline-block; line-height: 1.2;}


@media all and (max-width:1499px) {
  .cnt301 .processBox ul {width: 100%; justify-content: center;}
  .cnt301 .processBox ul:first-child {margin-bottom: 20px;}
  .cnt301 .processBox ul:first-child li:last-child .cir::after {content: none;}
  .cnt301 .processBox ul li span br {display: none;}
  .cnt301 .inquiryBox ul li {width: calc((100% - 40px) / 2);}
}
@media all and (max-width: 767px) {
  .cnt301 .bullet01 {flex-direction: column; align-items: flex-start;}
  .cnt301 .bullet01 .red {margin-top: 5px;}
  .cnt301 .inquiryBox ul {margin-right: 0;}
  .cnt301 .inquiryBox ul li {width:100%;}
}
@media all and (max-width: 640px) {
  .cnt301 .processBox ul {flex-direction: column; margin-bottom: 0 !important;}
  .cnt301 .processBox ul li {width: 100%;}
  .cnt301 .processBox ul li .cir {width: 100%; height: 75px; border-radius: 10px;}
  .cnt301 .processBox ul li .cir::after {content: none;}
  .cnt301 .processBox ul li::after {content:""; width: 0px; height: 0px; border-top: 12px solid #76BC1A;  border-left: 9px solid transparent; border-right: 9px solid transparent; display: block; margin: 20px 0;}
  .cnt301 .processBox ul:last-child li:last-child::after {content:none;}
}

/***************************************** cnt402 ***********************************************/
.cnt402 .cnt402ListBox > li {transition: all 0.3s;}
.cnt402 .cnt402ListBox > li:hover {border:2px solid transparent; background-image: linear-gradient(#fff, #fff), linear-gradient(131deg, rgba(23,183,148,1) 0%, rgba(118,188,26,1) 100%); background-origin: border-box; background-clip: padding-box, border-box; box-shadow: 2px 5px 4px rgba(0, 0, 0, 0.08);}
.cnt402 .cnt402ListBox > li > a {position:relative;}
.cnt402 .cnt402ListBox > li > a:focus-visible::before {content: "";padding: 4px; display: block; position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); width: 100%; height: 100%; border: 2px dotted #000; border-radius: 10px;}
.cnt402 .cnt402ListBox > li > a > span {display:inline-block; width:147px; padding: 6px 10px; text-align: center; border-radius: 10px 0 10px 0; background-color: #17b794; color: #fff; font-weight: 400; position: absolute; top: -2px; left: -2px;}
.cnt402 .cnt402ListBox > li > a > .titleWrap {padding: 45px 20px 12px 20px;}
.cnt402 .cnt402ListBox > li > a > .transWrap {padding: 25px 20px 22px 20px !important;}
.cnt402 .cnt402ListBox > li > a > .titleWrap p {font-size: 2rem; color: #222; font-weight: 700;}
.cnt402 .cnt402ListBox > li > a > .dataInfo {padding: 12px 20px; border-top: 1px dashed #dbdbdb; background: #f8f8f8; border-radius: 0 0 10px 10px;}
.cnt402 .cnt402ListBox > li > a > .dataInfo li {display: inline; font-size: 1.6rem;}
.cnt402 .cnt402ListBox > li > a > .dataInfo li:not(:last-child)::after {content: ""; width: 1px; height: 12px; background: #777777; display: inline-block; margin: 0 4px 0 10px;}
.cnt402noResult {pointer-events: none;}
.cnt402noResult .titleWrap {padding: 20px !important;}
@media all and (max-width: 767px) {
  .cnt402 .cnt402ListBox > li > a > .titleWrap p {font-size: 1.8rem;}
}
@media all and (max-width: 640px) {
  .cnt402 .cnt402ListBox > li > a > span {padding: 4px 10px;}
  .cnt402 .cnt402ListBox > li > a > .titleWrap {padding: 40px 20px 10px 20px;}
}
/***************************************** cnt502 ***********************************************/
.cnt502 .qnaBox {border-top: 2px solid #222; margin-top: 10px;}
.cnt502 .qnaBox .qnaList {border-bottom: 1px solid #dbdbdb;}
.cnt502 .qnaBox .qnaList dt {position: relative;}
.cnt502 .qnaBox .qnaList dt:hover {background: #f8faf3;}
.cnt502 .qnaBox .qnaList dt a {display:block;}
.cnt502 .qnaBox .qnaList dt a::before {content: ""; width: 2px; height: 18px; position: absolute; right: 25px; top: 50%; margin: -9px 8px 0 0; background: #222; border-radius: 50px;}
.cnt502 .qnaBox .qnaList dt.open a::before {content: none;}
.cnt502 .qnaBox .qnaList dt.open a::after {background: #ddd;} 
.cnt502 .qnaBox .qnaList dt a::after {content: "";width: 18px; height: 2px; position: absolute; right: 25px; top: 50%; margin-top: -1px; background: #222; border-radius: 50px;}
.cnt502 .qnaBox .qnaList dt a,
.cnt502 .qnaBox .qnaList dd .ans {padding: 20px 25px;}
.cnt502 .qnaBox .qnaList dt .qus,
.cnt502 .qnaBox .qnaList dd .ans {display: flex; align-items: flex-start;}
.cnt502 .qnaBox .qnaList dd {background: #f6f6f6; display: none;}
.cnt502 .qnaBox .qnaList dd p {width:calc(100% - 65px);}
.cnt502 .qnaBox .qnaList dt b {font-size: 2rem; font-weight: 700; color: #222; width: calc(100% - 100px); line-height: 1.2;}
.cnt502 .qnaBox .qnaList dt b span {display:block; color: #76BC1A; font-weight: 400; font-size: 1.6rem;  margin-bottom: 2px;}
.cnt502 .qnaBox .qnaList .q,
.cnt502 .qnaBox .qnaList .a {font-family: 'poppins'; font-size: 2.2rem; font-weight: 700; width: 45px; height: 45px; border-radius: 50%; text-align: center; line-height: 43px; margin-right: 20px; float: left;}
.cnt502 .qnaBox .qnaList .q {background: #fff; color: #2ec16c; border:1px solid #ddd;}
.cnt502 .qnaBox .qnaList .a {background: linear-gradient(131deg, rgba(23,183,148,1) 0%, rgba(118,188,26,1) 100%); color: #fff;}
.cnt502noResult {border-bottom:1px solid #dbdbdb; padding:20px;}

@media all and (max-width: 767px) {
  .cnt502 .qnaBox .qnaList dt b {font-size: 1.8rem;}
}
@media all and (max-width: 640px) {
  .cnt502 .qnaBox .qnaList dt a, .cnt502 .qnaBox .qnaList dd .ans {padding: 17px 15px;}
  .cnt502 .qnaBox .qnaList dt a::before,
  .cnt502 .qnaBox .qnaList dt a::after {right: 20px;}
  .cnt502 .qnaBox .qnaList .q,
  .cnt502 .qnaBox .qnaList .a {width: 40px; height:40px; font-size: 2rem; line-height: 38px; margin-right: 15px;}
  .cnt502 .qnaBox .qnaList dt b {width:calc(100% - 85px);}
}

/* ===================================
	공공데이터개방 2025-08-06 임혜경추가
 =================================== */

/***************************************** cnt604 ***********************************************/
.cnt604 .linklst{display:flex;flex-wrap:wrap}
.cnt604 .linklst li{flex:1 1 50%}
.cnt604 .linklst li a{display:block;color:blue}
.cnt604 .dataContact{display:flex}
.cnt604 .dataContact dt{margin-right:4px}
.cnt604 .dataContact dd address{display:inline-block;font-style:normal}

/***************************************** cnt701 ***********************************************/
.termsBox .group:first-child {padding-top: 0;}
.termsBox .group { padding: 30px 0; border-bottom: 1px dashed #dbdbdb;}
.termsBox .group .bullet01 {margin-bottom: 20px;}
.termsBox .group .terms dt {margin-bottom: 10px;}
.termsBox .group .terms dd .bullet03 {margin: 10px 0 0 15px;}
.termsBox .group .terms dd .txtDotBox {padding: 15px 22px; margin: 10px 0 10px 0;}
/***************************************** cnt702 ***********************************************/
.cnt702 .infoBox p:first-child {color: #76BC1A; font-weight:400; margin-bottom: 5px; font-size: 2rem;}
.cnt702 .table table .labelingImg {margin: 0 auto 15px; display: block;}
.cnt702 .table table .labelingImg + span {font-weight: 400;}
.cnt702 .table table td.listLeft,
.cnt702 .table table td.listRight {text-align: left;}
.cnt702 .table table td.listLeft a,
.cnt702 .table table td.listRight a {padding: 5px; display: block;}
.cnt702 .table table td .dot {color: #17B794;}
.cnt702 .table table .listTi {color: #555; text-decoration: none;}
.cnt702 .listImg {vertical-align: bottom;}
.termsBox .group .terms .termsTi {font-size: 2rem; font-weight: 400; color: #222; display:flex; align-items: center;}
.termsBox .group .terms .termsTi .listImg {margin-right: 5px;}
.termsBox .group .terms .listNum {margin-right:5px;}
.termsBox .group .terms .txtListNum li {font-size: 1.6rem; margin-bottom: 7px;}
.termsBox .group .terms .txtListNum li:last-child {margin-bottom: 0;}
@media all and (max-width: 767px) {
  .termsBox .group .terms .termsTi {font-size: 1.8rem;}
}
@media all and (max-width: 500px) {
  .cnt703 .infoBox,
  .cnt702 .infoBox {padding: 25px;}
  .cnt703 .infoBox::before, 
  .cnt702 .infoBox::before {content: none;}
  .cnt702 .infoBox p:first-child {font-size: 1.8rem;}
}
/***************************************** cnt703 ***********************************************/
.cnt703 .table table .openmarkImg {margin: 15px auto 15px; display: block;}
.cnt703 .table table .openmarkImg + span {font-weight: 400;}
.cnt703 .bangIcon {display:inline-block; width: 18px; height:18px; background:url(../../image/sub/bangIcon.png)no-repeat center / 18px auto; vertical-align: text-bottom; margin-right: 5px;}
.cnt703 .cautionTxt {color: #222; margin-bottom: 10px;}
/***************************************** cnt801 ***********************************************/
.cnt801 .stepBox {display: flex; flex-direction: row;}
.cnt801 .stepBox li {width: 25%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding-left: 80px; border-top:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; height: 90px; position:relative; background: #fff url(../../image/sub/step_ic01.png) no-repeat 20px center; font-size: 2rem;}
.cnt801 .stepBox li:first-child {border-left: 1px solid #dbdbdb;}
.cnt801 .stepBox li:nth-child(2) {background: #fff url(../../image/sub/step_ic02.png) no-repeat 20px center;}
.cnt801 .stepBox li:nth-child(3) {background: #fff url(../../image/sub/step_ic03.png) no-repeat 20px center;}
.cnt801 .stepBox li:last-child {border-right: 1px solid #dbdbdb; background: #fff url(../../image/sub/step_ic04.png) no-repeat 20px center;}
.cnt801 .stepBox li:not(:last-child)::after {content: ""; width: 39px; height: 90px; background: url(../../image/sub/step_deco02.png) no-repeat; position: absolute; right: 0; top: 0; z-index: 1;}
.cnt801 .stepBox li.on {color: #fff; border-top: 1px solid #76BC1A;}
.cnt801 .stepBox li.on:first-child {background: #76BC1A url(../../image/sub/step_ic01_on.png) no-repeat 20px center;}
.cnt801 .stepBox li.on:nth-child(2) {background: #76BC1A url(../../image/sub/step_ic02_on.png) no-repeat 20px center;}
.cnt801 .stepBox li.on:nth-child(3) {background: #76BC1A url(../../image/sub/step_ic03_on.png) no-repeat 20px center;}
.cnt801 .stepBox li.on:last-child { background: #76BC1A url(../../image/sub/step_ic04_on.png) no-repeat 20px center;}
.cnt801 .stepBox li.on:not(:last-child)::after  {background: url(../../image/sub/step_deco01.png) no-repeat; top: -1px; right: -1px;}
.cnt801 .stepBox li.on:not(:first-child):before {content: ""; width: 39px; height: 89px; background: url(../../image/sub/step_deco03.png) no-repeat; position: absolute; left: -39px; top: -1px; z-index: 1;}
.cnt801 .stepBox li span {font-size: 1.6rem;}
.cnt801 .terms {margin-top: 15px;}
.cnt801 .terms .agreeBox {border: 1px solid #dbdbdb; background: #fafafa; padding: 15px 20px;}
.cnt801 .terms .scrollArea {height: 250px; padding: 20px; border-left: 1px solid #dbdbdb; border-right: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; overflow-y: auto;}
.crtWrap {display: flex; flex-direction: row; flex-wrap:wrap; justify-content: space-between;}
.crtWrap > div {width: calc((100% - 30px) / 2); padding: 40px;}
.crtWrap > div .crtIcon {width: 85px; height: 75px; display: block; background: url(../../image/sub/crtIcon01.png) no-repeat center; margin: 0 auto 30px;}
.crtWrap > div:last-child .crtIcon {background: url(../../image/sub/crtIcon02.png) no-repeat center; margin: 0 auto 30px;}
em.borderTi {display: block; text-align: center; font-style: normal; color: #222; font-size: 2.4rem; font-weight: 400; padding-bottom: 15px; border-bottom: 1px solid #dbdbdb; margin-bottom: 30px;}
.crtWrap > div p {text-align: center;}
.cnt801 .bbsWrite input[type="text"],
.cnt801 .bbsWrite input[type="password"] {width: 350px;}
.cnt801 .bbsWrite .pwTxt {color: #828282; margin-top: 5px;}
.cnt801 .completBox {padding: 40px;}
.cnt801 .completBox .completIcon {display:block; width: 115px; height: 115px; background: #fafafa url(../../image/sub/completIcon.png) no-repeat 37px center; border-radius: 50%; margin: 0 auto;}
.cnt801 .completBox strong {font-size: 3.2rem; display: block; text-align: center; color: #222; padding: 30px 0 20px 0;}
.cnt801 .completBox p {text-align: center;}

@media all and (max-width: 1279px) {
  .crtWrap > div p br {display: none;}
  .cnt801 .completBox strong {font-size: 2.8rem;}
}

@media all and (max-width: 899px) {
  .cnt801 .stepBox li {font-size: 1.8rem; height: 75px; border-right: 1px solid #dbdbdb;}
  .cnt801 .stepBox li.on:not(:first-child):before,
  .cnt801 .stepBox li:not(:last-child)::after  {content: none;}
}
@media all and (max-width: 767px) {
  .cnt801 .stepBox {flex-wrap: wrap;}
  .cnt801 .stepBox li {width: 50%;}
  .cnt801 .stepBox li:nth-child(-n+2) {border-bottom: 0;}
  .cnt801 .stepBox li:nth-child(3) {border-left: 1px solid #dbdbdb;}
  .cnt801 .completBox,
  .crtWrap > div {padding: 30px;}
  em.borderTi {font-size: 2.2rem;}
  .cnt801 .completBox strong {font-size: 2.4rem; padding: 20px 0 10px 0;}
}

@media all and (max-width: 640px) {
  .crtWrap > div {width: 100%;}
  .crtWrap > div .crtIcon {margin: 0 auto 20px;}
  em.borderTi {font-size: 2rem; padding-bottom:10px; margin-bottom: 20px;}
}
@media all and (max-width: 500px) {
  .cnt801 .bbsWrite input#pd_id {width: calc(100% - 81px) !important;}
  .cnt801 .bbsWrite input[type="text"] {width: 100%;}
}


/***************************************** cnt901 ***********************************************/
.cnt901 .loginTxt {text-align: center;}
.cnt901 .loginTxt strong {display: block; font-size: 3.2rem; color: #222;margin-bottom: 10px;}
.loginBoxWrap {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.cnt901 .loginBox {width: calc((100% - 30px) /2); padding:60px 40px; margin-top: 0;}
.cnt901 .loginBox em {display: block; text-align: center; font-style: normal; color: #222; font-size: 2.4rem; font-weight: 400; margin-bottom: 20px;}
.cnt901 input[type="text"],
.cnt901 input[type="password"],
.cnt605 input[type="text"],
.cnt605 input[type="password"] {display: block; height: 60px; border: 1px solid #dbdbdb; border-radius: 4px; width: 100%; padding: 0 10px;}
.cnt901 div.loginBox .loginBt button {height: 60px; text-align: center; width: 100%; background: #76BC1A; color: #fff; border-radius: 4px;}
.cnt901 div.loginBox .loginBt.mobileIDBt {height:50px;}
.cnt901 div.loginBox .mobileIdDiv {width:100%; text-align: center;}
.cnt901 div.loginBox .mobileImg {background: url(../../image/sub/mobileId.png) no-repeat; cursor: pointer; width:80%; height:90px; display: inline-block; background-size: 100% 100%; }
.cnt901 div.loginBox:last-child p {margin-bottom: 48px;}
.cnt901 div.loginBox .linkList {display: flex; justify-content: center; margin-top: 20px;}
.cnt901 div.loginBox .linkList li:not(:last-child) {margin-right: 30px; position: relative;}
.cnt901 div.loginBox .linkList li:not(:last-child)::after {content: ""; width: 1px; height: 12px; background: #555; position: absolute; right: -15px; top: 50%; transform: translateY(-50%);}
.idBox .idForm,
.pwBox .pwForm {width: 100%; max-width: 600px; margin: 0 auto;}
.cnt901 .idBox p a {color: #76BC1A;}

@media all and (max-width: 1279px) {
  .cnt901 .loginTxt strong {font-size: 2.8rem;}
}

@media all and (max-width: 899px) {
  .cnt901 .loginBox {padding: 50px 30px;}
  .cnt901 .loginTxt strong {font-size: 2.4rem;}
  .cnt901 div.loginBox:last-child p br {display: none;}
}
@media all and (max-width: 767px) {
  .loginBoxWrap {flex-direction: column;}
  .cnt901 .loginBox {width: 100%; margin-top: 15px;}
  .cnt901 .loginBox em {font-size: 2.2rem;}
  .cnt901 input[type="text"],
.cnt901 input[type="password"],
  .cnt901 div.loginBox .loginBt button {height: 48px;}
  .cnt901 div.loginBox:last-child p {height: auto;}
}


/***************************************** mypage **************************************************/
.mypage .Btxt {font-size: 25px; font-weight: bolder; color: rgb(37, 37, 37);}
.mypage .BtxtDiv {margin-top: 50px;}
.mypage .watchList {margin: 10px auto;}
.mypage .bbsWrite {margin: 10px auto;}
.star_rating{display: flex;}
.star_rating .star_box .star1::after{content: '★'; color: hsl(60, 80%, 45%); font-size: 20px;}
.star_rating .star_box .star2::after{content: '☆'; color: hsl(60, 80%, 45%); font-size: 20px;}
.sat_star , .sat_star2 {font-size: 30px !important; cursor: pointer; color: #dabd18b2;}
.mypage #printzone .midTitle {margin-bottom: 10px; }


/***************************************** watchlist ***********************************************/
.contentArea .watchlistTopFrame {display: flex; flex-direction: row; justify-content: space-between; align-items: center; margin-bottom: 5px;}
.contentArea .watchList > li {border: 2px solid #ddd; padding: 20px; border-radius: 10px; position: relative;}
.contentArea .watchList > li:not(:last-child) {margin-bottom: 10px;}
.contentArea .watchList > li .listDelete {display: block; width: 16px; height:16px; background: url(../../image/sub/listDelete.png) no-repeat; position: absolute; right: 20px; top:20px; }
.contentArea .watchList > li p {font-size: 2rem; color: #222;font-weight: 700; padding: 5px 0 10px 0;}
.contentArea .watchList > li .speciesInfo_en {display: inline-block; padding-left: 5px;}
.contentArea .watchList > li .infoList {display: flex; flex-direction: row; flex-wrap: wrap;}
.contentArea .watchList > li .infoList li:not(:last-child) {margin-right: 5px; margin-bottom:5px;}
.contentArea .watchList > li .infoList li div span {font-size: 1.6rem;}
.contentArea .watchList > li .infoList li div span::before {content:""; display: inline-block; margin: 0 10px; width: 1px; height: 10px; background: #008600; opacity: 0.5;}
.contentArea .watchList > li .infoList li:nth-child(2) div span::before {background: #0E6FB1;}
.contentArea .watchList > li .infoList li:nth-child(3) div span::before {background: #FF8100;}
.contentArea .watchList > li .btnWrap a.c_btn {height: auto; line-height: unset; font-size: 1.6rem; padding: 6px 20px;}
.checkBtWrap .c_btn {height: auto;line-height: unset;font-size: 1.6rem; padding: 6px 20px;display: inline-block;height: 35px;line-height: 36px;text-align: center;color: #fff;border-radius: 4px;padding: 0 30px;}
.checkBtWrap .c_btn2 {height: auto;line-height: unset; font-size: 1.8rem; padding: 6px 20px;display: inline-block;height: 43px;width:150px;line-height: 42px;text-align: center;color: #fff;border-radius: 4px;padding: 0 30px;}
.checkBtWrap .c_btn3 {height: auto;line-height: unset; padding: 6px 20px;display: inline-block;height: 43px;width:150px;line-height: 42px;text-align: center;color: #fff;border-radius: 4px;padding: 0 30px;}
.orderFrame {margin:10px auto; width:10%;}
.statusFrame {margin:10px auto; width:100%; text-align: center;}
@media all and (max-width:999px){
  .contentArea .watchList > li .speciesInfo_en {display: block;}
}
@media all and (max-width:767px){
	.contentArea .watchlistTopFrame {flex-direction: column-reverse; align-items: flex-end;}
	.contentArea .watchlistTop {margin-top: 10px;}
}

/* 사이트맵 */
/***************************************** sitemap ***********************************************/

#sitemap_w {position:relative;}
#sitemap_w .stm1 {display: flex; flex-wrap: wrap; margin: 0 0 -30px -30px;}
#sitemap_w .stm1 > li {width:calc((100% - 90px) / 3); margin:0 0 30px 30px;}
#sitemap_w .stm1 > li > h3 {padding:15px 0;background:#76BC1A url(../../image/main/lnbBg.png) no-repeat right center;color: #fff; text-align:center; border-radius:10px; font-size:2rem;line-height:22px; font-weight: 400;}
#sitemap_w .stm2 > li > a {display:block;padding:12px 20px;margin:5px 0;background:#fff;color:#555;font-size:17px;line-height:20px;border-bottom:1px dashed #dbdbdb; position: relative;}
#sitemap_w .stm2 > li:last-child > a {margin-bottom: 0;}
#sitemap_w .stm2 > li > a::after {content:"";width: 6px; height: 6px; border-top:1px solid #76BC1A; border-right: 1px solid #76BC1A; transform: rotate(45deg); position:absolute; top:20px; right: 20px;}
#sitemap_w .stm3 {padding:20px; border-bottom: 1px dashed #dbdbdb; background: #f9f9f9;}
#sitemap_w .stm3 > li:not(:last-child) {margin-bottom:10px;}
#sitemap_w .stm3 > li a::before{content:""; width: 3px; height:3px; background:#555; border-radius: 50%; display:inline-block; vertical-align: middle; margin:0 5px 2px 0;}
#sitemap_w .stm3 > li a {display: block; }


@media screen and (max-width:800px) {	
	#sitemap_w .stm1 > li {width:calc((100% - 60px) / 2);}
	#sitemap_w .stm2 > li > a {padding: 10px 20px;}
}
@media screen and (max-width:500px) {
	#sitemap_w .stm1 {margin:0;}	
	#sitemap_w .stm1 > li {width:100%;margin:0 0 30px 0;}
} 

/***************************************** layer ***********************************************/

.layer { width: 100%;  height: 100%; background: rgba(0, 0, 0, 0.4); display: none; position: fixed; top: 0; left: 0; z-index: 1000;}
.layer .layerConWrap { display: flex; width: 100%; height: 100%; flex-direction: column; justify-content: center; align-items: center; overflow-y: auto;}
.layer .layerCon { width: 100%; max-width: 1000px; min-width: 1000px; max-height: 90%; background-color: #fff; position: absolute; top: 50%; left: 50%;transform: translate(-50%, -50%); border-radius: 10px;}
.layer .layerCon2 {position: relative; top: 5%; left: auto; transform: none;}
.layer .layerCon2:not(:last-child) {margin-bottom: 10px;}
.layer .layerCon .infoTitle {display: flex; flex-direction: row; justify-content: space-between; align-items: center; background:#3F3F3F; padding: 15px 30px; border-radius: 10px 10px 0 0;}
.layer .layerCon .infoTitle strong{color: #fff; font-size: 2rem; font-weight: 400;}
.layer .layerCon .infoTitle .layerCloseBtn {width:20px; height: 20px; background: url(../../image/sub/close_layer.png) no-repeat; flex-shrink: 0;}
.layer .layerCon .layerContent {padding:50px 30px; max-height: calc(90vh - 58px); overflow-y: auto;}
.layer .layerCon .layerContent p {word-break: break-all;}
.layer .layerCon .infoContent .info:not(:last-child) {margin-bottom: 50px;}
.layer .layerCon .layerContent .slideBox {background: #f6f6f6; padding:30px; margin-top: 20px;}
.layer .layerCon .layerContent .slideBox .imgSlider li{height: 500px;}
.layer .layerCon .layerContent .slideBox .imgSliderNav li {height: 180px;}
.layer .layerCon .layerContent .slideBox img {display: block; width: 100%; max-width: 100%; height: 100%; object-fit: contain;}
.layer .layerCon .layerContent .slideBox .zoomBtn {text-align:right; margin-bottom: 10px;}
.layer .layerCon .layerContent .slideBox .zoomBtn img {display: inline-block; width: 26px; height: 26px; object-fit: cover;}
.layer .layerCon .layerContent .imgSlider .slick-list {margin-bottom: 120px;}
.layer .layerCon .layerContent .imgSlider .slick-arrow { width: 57px; height: 57px; cursor: pointer; font-size: 0 !important;  line-height: 0; border: none; background: url(../../image/sub/slideArrowPrev.png) no-repeat center / cover; position: absolute;   bottom: -17%; left: 50%;}
.layer .layerCon .layerContent .imgSliderNav .slick-list {margin-right: -20px;}
.layer .layerCon .layerContent .imgSliderNav li {margin-right: 20px; position: relative;}
.layer .layerCon .layerContent .imgSliderNav li.slick-slide::before {content: ""; width: 100%;  height: 100%; background: #000; opacity: 0.5; position: absolute; top: 0; left: 0;}
.layer .layerCon .layerContent .imgSliderNav li.slick-slide.slick-current::before {content: none;}
.layer .layerCon .layerContent .imgSliderNav .slick-arrow {display:none !important;}
.layer .layerCon .layerContent .imgSliderNav .slick-track {margin: 0 !important;}
.layer .layerCon .layerContent .imgSlider .slick-prev {left:calc(50% - 60px);}
.layer .layerCon .layerContent .imgSlider .slick-next {background: url(../../image/sub/slideArrowNext.png) no-repeat center / cover;}
.layer .layerCon .layerContent .conWrap {display: flex; align-items: flex-end;}
.layer .commentBox {background: #f6f6f6; display:flex; padding:20px;}
.layer .commentBox .iconCir {display: block; width: 46px; height: 46px; background: #fff url(../../image/sub/commentBoxIcon.png) no-repeat 60% center; border-radius: 50%; margin-right: 15px; flex-shrink: 0;}


@media all and (max-width:1279px){
  .layer .layerCon {width: 95%; min-width:auto;}
}
@media all and (max-width:767px){
  .layer .layerCon .layerContent {padding: 30px 20px;}
  .layer .layerCon .infoTitle {padding: 15px 20px;}
  .layer .layerCon .infoTitle strong {font-size: 1.8rem;}
  .layer .layerCon .layerContent .conWrap {display: flex; flex-direction: column; align-items: flex-start;}
  .layer .layerCon .layerContent .slideBox {padding:20px;} 
  .layer .layerCon .layerContent .slideBox .imgSlider li{height: 400px;}
  .layer .layerCon .layerContent .slideBox .imgSliderNav li {height: 140px;}
  .layer .layerCon .layerContent .imgSlider .slick-list {margin-bottom: 100px;}
  .layer .layerCon .layerContent .slick-dots {margin-right: -10px;}
  .layer .layerCon .layerContent .slick-dots li {width: calc((100% - 30px) / 3); margin-right: 10px;}
  .layer .layerCon .layerContent .imgSlider .slick-arrow {width: 45px; height: 45px;}
  
}

@media all and (max-width:500px){
  .layer .commentBox .iconCir {display:none;}
  .layer .layerCon .layerContent .slideBox .imgSlider li{height: 220px;}
  .layer .layerCon .layerContent .slideBox .imgSliderNav li {height: 120px;}
  .layer .layerCon .layerContent .imgSlider .slick-list {margin-bottom: 88px;}
  .layer .layerCon .layerContent .imgSlider .slick-arrow {bottom:-30%;}
}


.comingSoon {border:1px solid #dbdbdb; height: 350px;}
.comingSoon img {width:100%; height:100%; object-fit: cover;}

@media all and (max-width:767px){
.comingSoon {height: 300px;}
}

@media all and (max-width:500px){
.comingSoon {height: 270px;} 
}




/***************************************** 에러페이지 ***********************************************/

.errorBox {padding: 200px 0; text-align: center;}
.errorBox h1 {font-size: 3rem; padding-top: 100px; margin-bottom: 20px; background: url(../../image/sub/errorIcon.svg) no-repeat center top;}
.errorBox p {line-height: 1.6;; margin-bottom: 50px;}
.errorBox .logoBox {margin-top: 50px;border-top: 1px solid #e7e7e7;}
.errorBox .logo {display: block; width:130px; height:40px; margin: 50px auto 0; background-size: contain;
 background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg width='158' height='39' viewBox='0 0 158 39' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.73815 18.0596C5.36756 21.1487 7.33642 22.201 9.13556 22.201C12.2925 22.201 13.7862 20.7413 13.7862 18.6027C13.7862 13.5108 1.29404 15.7512 1.29404 6.89135C1.29404 2.58022 4.75653 -0.0336189 9.64475 0.000326646C12.6999 0.000326646 16.1624 1.79946 17.7239 6.00876L13.854 7.40054C12.8017 4.61698 11.1044 3.76833 9.6108 3.73438C7.0988 3.73438 5.67307 5.05827 5.67307 6.89135C5.67307 11.9154 18.1312 10.1841 18.1312 18.6367C18.1312 22.9818 14.7027 25.969 9.10161 25.9351C5.36756 25.9351 2.31242 23.7286 0.173828 20.0963L3.73815 18.0596Z' fill='%23222222'/%3E%3Cpath d='M63.4331 25.7653C58.8504 25.7653 55.5577 22.3368 55.5577 17.4486C55.5577 12.5943 58.8504 9.13178 63.4331 9.13178C64.3157 9.13178 66.3525 9.47124 67.8461 11.1346V1.15449H72.2251V25.6974H67.8461V23.7965C66.3525 25.324 64.3157 25.7653 63.4331 25.7653ZM59.9367 17.5504C59.9367 20.4358 61.3964 22.235 63.7386 22.235C66.013 22.235 67.8461 20.1982 67.8461 17.5504C67.8461 14.8687 66.013 12.8319 63.7386 12.8319C61.3964 12.8319 59.9367 14.631 59.9367 17.5504Z' fill='%23222222'/%3E%3Cpath d='M85.4728 12.9677C87.9848 12.9677 89.75 11.1007 89.75 8.48681C89.75 5.90692 87.9848 4.0399 85.4389 4.0399H80.2112V12.9677H85.4728ZM75.8322 25.6635V0.271897H85.6086C90.5987 0.271897 94.129 3.66649 94.129 8.48681C94.129 13.3411 90.5987 16.7357 85.6086 16.7357H80.2112V25.6635H75.8322Z' fill='%23222222'/%3E%3Cpath d='M102.788 25.7314C98.0699 25.7314 94.7772 22.3368 94.7772 17.4825C94.7772 12.5943 98.0699 9.16573 102.788 9.16573C107.982 9.16573 109.646 13.409 109.713 13.6127C110.732 15.7852 110.426 18.6027 110.426 19.044H98.9525C99.3599 20.8771 101.057 22.0992 102.788 22.0992C105.029 22.0992 106.047 20.945 106.353 20.3679L109.917 21.7937C109.136 23.6946 106.794 25.7314 102.788 25.7314ZM98.9525 15.7512H106.387C106.013 14.1897 104.893 12.7979 102.788 12.7979C100.854 12.7979 99.3599 14.0879 98.9525 15.7512Z' fill='%23222222'/%3E%3Cpath d='M120.323 25.7653C115.74 25.7653 112.448 22.3368 112.448 17.4486C112.448 12.5943 115.74 9.13178 120.323 9.13178C121.206 9.13178 123.242 9.47124 124.736 11.1346V1.15449H129.115V25.6974H124.736V23.7965C123.242 25.324 121.206 25.7653 120.323 25.7653ZM116.827 17.5504C116.827 20.4358 118.286 22.235 120.629 22.235C122.903 22.235 124.736 20.1982 124.736 17.5504C124.736 14.8687 122.903 12.8319 120.629 12.8319C118.286 12.8319 116.827 14.631 116.827 17.5504Z' fill='%23222222'/%3E%3Cpath d='M132.926 9.13178H137.305V25.6635H132.926V9.13178ZM132.756 3.1573C132.756 1.79946 133.74 0.815032 135.132 0.815032C136.49 0.815032 137.475 1.79946 137.475 3.1573C137.475 4.54908 136.49 5.53352 135.132 5.53352C133.74 5.53352 132.756 4.54908 132.756 3.1573Z' fill='%23222222'/%3E%3Cpath d='M148.105 25.7993C143.522 25.7993 140.263 22.3368 140.263 17.4825C140.263 12.6282 143.522 9.19968 148.105 9.19968C149.599 9.19968 151.228 9.81071 152.45 11.1007V9.16573H156.829V25.6974H152.45V23.9323C151.228 25.2222 149.599 25.7993 148.105 25.7993ZM144.642 17.4825C144.642 20.3679 146.102 22.1671 148.444 22.1671C150.651 22.1671 152.45 20.1982 152.484 17.4825C152.45 14.7668 150.651 12.7979 148.444 12.7979C146.102 12.7979 144.642 14.5971 144.642 17.4825Z' fill='%23222222'/%3E%3Cpath d='M1.225 35.523C1.561 36.16 1.967 36.377 2.338 36.377C2.989 36.377 3.297 36.076 3.297 35.635C3.297 34.585 0.721 35.047 0.721 33.22C0.721 32.331 1.435 31.792 2.443 31.799C3.073 31.799 3.787 32.17 4.109 33.038L3.311 33.325C3.094 32.751 2.744 32.576 2.436 32.569C1.918 32.569 1.624 32.842 1.624 33.22C1.624 34.256 4.193 33.899 4.193 35.642C4.193 36.538 3.486 37.154 2.331 37.147C1.561 37.147 0.931 36.692 0.49 35.943L1.225 35.523ZM9.61696 31.855V32.632H7.04096V34.004H9.24596V34.781H7.04096V36.307H9.61696V37.091H6.13796V31.855H9.61696ZM14.972 31.855V32.632H12.396V34.004H14.601V34.781H12.396V36.307H14.972V37.091H11.493V31.855H14.972ZM18.514 36.3C19.564 36.3 20.243 35.579 20.243 34.473C20.243 33.36 19.564 32.639 18.514 32.639L17.835 32.646V36.293L18.514 36.3ZM16.932 37.091V31.855H18.528C20.061 31.855 21.139 32.933 21.139 34.473C21.139 36.013 20.061 37.091 18.528 37.091H16.932ZM25.7074 31.855H26.6104V37.091H25.7074V31.855ZM32.9403 31.855V37.091H31.9323L29.5313 33.374V37.091H28.6283V31.855H29.6293L32.0303 35.565V31.855H32.9403ZM38.4179 31.855V32.632H35.9119V34.074H38.0469V34.851H35.9119V37.091H35.0089V31.855H38.4179ZM42.4617 36.356C43.5117 36.356 44.1907 35.614 44.1907 34.473C44.1907 33.325 43.5117 32.583 42.4617 32.583C41.4187 32.583 40.7397 33.325 40.7397 34.473C40.7397 35.614 41.4187 36.356 42.4617 36.356ZM39.8367 34.473C39.8367 32.905 40.9217 31.799 42.4617 31.799C44.0087 31.799 45.0937 32.905 45.0937 34.473C45.0937 36.041 44.0087 37.147 42.4617 37.147C40.9217 37.147 39.8367 36.041 39.8367 34.473ZM49.261 35.936L47.791 33.423V37.091H46.888V31.855H47.889L49.639 34.788L51.382 31.855H52.39V37.091H51.487V33.423L50.01 35.936H49.261ZM57.2539 31.855L59.1649 37.091H58.2059L57.7089 35.719H55.6859L55.1679 37.091H54.2089L56.1619 31.855H57.2539ZM55.9729 34.942H57.4219L56.7079 32.982L55.9729 34.942ZM64.0062 31.855V32.632H62.5852V37.091H61.6752V32.632H60.2402V31.855H64.0062ZM65.8789 31.855H66.7819V37.091H65.8789V31.855ZM71.2601 36.356C72.3101 36.356 72.9891 35.614 72.9891 34.473C72.9891 33.325 72.3101 32.583 71.2601 32.583C70.2171 32.583 69.5381 33.325 69.5381 34.473C69.5381 35.614 70.2171 36.356 71.2601 36.356ZM68.6351 34.473C68.6351 32.905 69.7201 31.799 71.2601 31.799C72.8071 31.799 73.8921 32.905 73.8921 34.473C73.8921 36.041 72.8071 37.147 71.2601 37.147C69.7201 37.147 68.6351 36.041 68.6351 34.473ZM79.9844 31.855V37.091H78.9764L76.5754 33.374V37.091H75.6724V31.855H76.6734L79.0744 35.565V31.855H79.9844ZM87.1679 36.356C88.2179 36.356 88.8969 35.614 88.8969 34.473C88.8969 33.325 88.2179 32.583 87.1679 32.583C86.1249 32.583 85.4459 33.325 85.4459 34.473C85.4459 35.614 86.1249 36.356 87.1679 36.356ZM84.5429 34.473C84.5429 32.905 85.6279 31.799 87.1679 31.799C88.7149 31.799 89.7999 32.905 89.7999 34.473C89.7999 36.041 88.7149 37.147 87.1679 37.147C85.6279 37.147 84.5429 36.041 84.5429 34.473ZM93.5822 34.473C94.1002 34.473 94.4642 34.088 94.4642 33.549C94.4642 33.017 94.1002 32.632 93.5752 32.632H92.4972V34.473H93.5822ZM91.5942 37.091V31.855H93.6102C94.6392 31.855 95.3672 32.555 95.3672 33.549C95.3672 34.55 94.6392 35.25 93.6102 35.25H92.4972V37.091H91.5942ZM100.508 31.855V32.632H97.9324V34.004H100.137V34.781H97.9324V36.307H100.508V37.091H97.0294V31.855H100.508ZM106.759 31.855V37.091H105.751L103.35 33.374V37.091H102.447V31.855H103.448L105.849 35.565V31.855H106.759ZM113.348 34.473C113.866 34.473 114.23 34.088 114.23 33.549C114.23 33.017 113.866 32.632 113.341 32.632H112.263V34.473H113.348ZM111.36 37.091V31.855H113.376C114.405 31.855 115.133 32.555 115.133 33.549C115.133 34.55 114.405 35.25 113.376 35.25H112.263V37.091H111.36ZM117.768 31.855V36.307H120.057V37.091H116.865V31.855H117.768ZM124.736 31.855L126.647 37.091H125.688L125.191 35.719H123.168L122.65 37.091H121.691L123.644 31.855H124.736ZM123.455 34.942H124.904L124.19 32.982L123.455 34.942ZM131.488 31.855V32.632H130.067V37.091H129.157V32.632H127.722V31.855H131.488ZM136.708 31.855V32.632H134.202V34.074H136.337V34.851H134.202V37.091H133.299V31.855H136.708ZM140.752 36.356C141.802 36.356 142.481 35.614 142.481 34.473C142.481 33.325 141.802 32.583 140.752 32.583C139.709 32.583 139.03 33.325 139.03 34.473C139.03 35.614 139.709 36.356 140.752 36.356ZM138.127 34.473C138.127 32.905 139.212 31.799 140.752 31.799C142.299 31.799 143.384 32.905 143.384 34.473C143.384 36.041 142.299 37.147 140.752 37.147C139.212 37.147 138.127 36.041 138.127 34.473ZM147.152 34.473C147.684 34.473 148.034 34.137 148.034 33.549C148.034 32.961 147.684 32.632 147.152 32.632H146.088V34.473H147.152ZM145.185 37.091V31.855H147.313C148.272 31.855 148.937 32.513 148.937 33.521C148.944 34.172 148.678 34.725 147.866 35.103L149.189 37.091H148.104L146.879 35.25H146.088V37.091H145.185ZM153.426 35.936L151.956 33.423V37.091H151.053V31.855H152.054L153.804 34.788L155.547 31.855H156.555V37.091H155.652V33.423L154.175 35.936H153.426Z' fill='%239F9F9F'/%3E%3Cg clip-path='url(%23clip0_45_3213)'%3E%3Cpath d='M36.2252 14.9858C36.1607 14.0522 35.1449 13.5182 34.3447 13.9952L29.4222 16.9447L24.4997 19.8943L33.0056 12.1705C33.7034 11.5436 33.4958 10.4077 32.6279 10.0627C30.0831 9.07187 26.6589 9.62 23.7872 11.7526C19.774 14.7273 18.358 19.6597 20.6295 22.7629C22.9009 25.8661 27.9931 25.9681 32.0088 22.9868C34.8804 20.8541 36.4182 17.7262 36.2342 14.9815L36.2252 14.9858Z' fill='url(%23paint0_linear_45_3213)'/%3E%3Cpath d='M36.2252 14.9858C36.1607 14.0522 35.1449 13.5182 34.3447 13.9952L29.4222 16.9447L24.4997 19.8943L33.0056 12.1705C33.7034 11.5436 33.4958 10.4077 32.6279 10.0627C30.0831 9.07187 26.6589 9.62 23.7872 11.7526C19.774 14.7273 18.358 19.6597 20.6295 22.7629C22.9009 25.8661 27.9931 25.9681 32.0088 22.9868C34.8804 20.8541 36.4182 17.7262 36.2342 14.9815L36.2252 14.9858Z' fill='%2376BC1A'/%3E%3C/g%3E%3Cg clip-path='url(%23clip1_45_3213)'%3E%3Cpath d='M54.0465 14.9858C53.982 14.0522 52.9661 13.5182 52.166 13.9952L42.321 19.8943L50.8269 12.1705C51.5247 11.5436 51.3171 10.4077 50.4492 10.0627C47.9043 9.07187 44.4801 9.62 41.6085 11.7526C37.5953 14.7273 36.1793 19.6597 38.4507 22.7629C40.7222 25.8661 45.8144 25.9681 49.83 22.9868C52.7016 20.8541 54.2395 17.7262 54.0555 14.9815L54.0465 14.9858Z' fill='url(%23paint1_linear_45_3213)'/%3E%3Cpath d='M54.0465 14.9858C53.982 14.0522 52.9661 13.5182 52.166 13.9952L42.321 19.8943L50.8269 12.1705C51.5247 11.5436 51.3171 10.4077 50.4492 10.0627C47.9043 9.07187 44.4801 9.62 41.6085 11.7526C37.5953 14.7273 36.1793 19.6597 38.4507 22.7629C40.7222 25.8661 45.8144 25.9681 49.83 22.9868C52.7016 20.8541 54.2395 17.7262 54.0555 14.9815L54.0465 14.9858Z' fill='%2376BC1A'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_45_3213' x1='35.2191' y1='26.7328' x2='25.4597' y2='10.1841' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2376BC1A'/%3E%3Cstop offset='0.25' stop-color='%235FBB38'/%3E%3Cstop offset='1' stop-color='%2317B794'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_45_3213' x1='53.0404' y1='26.7328' x2='43.2809' y2='10.1841' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2376BC1A'/%3E%3Cstop offset='0.25' stop-color='%235FBB38'/%3E%3Cstop offset='1' stop-color='%2317B794'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_45_3213'%3E%3Crect width='18.4666' height='20.3676' fill='white' transform='translate(18.6704 6.78955)'/%3E%3C/clipPath%3E%3CclipPath id='clip1_45_3213'%3E%3Crect width='18.4666' height='20.3676' fill='white' transform='translate(36.4917 6.78955)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");}

@media all and (max-width:767px){
  .errorBox h1 {font-size:2.4rem;} 
  }
  
  
 /***************************************** 로딩바 ***********************************************/
 /* 로딩바 스타일 */
.map-loading-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.map-loading-spinner {
    width: 50px;
    height: 50px;
    border: 5px solid #f3f3f3;
    border-top: 5px solid #76BC1A;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}