@charset "utf-8";
/*
   * ------------------------------------------------------------------------
   * X-A-Color
   * #66645F, rgba(102, 100, 95, 1.0), Default
   * #FFDA56, rgba(255, 218, 86, 1.0), Primary-Yellow
   * #FAC300, rgba(250, 195, 0, 1.0), Primary-Yellow-B
   * #FD6D6A, rgba(253, 109, 106, 1.0), Primary-red
   * ------------------------------------------------------------------------
   */



/*
   * ------------------------------------------------------------------------
   * X-A-Common
   * ------------------------------------------------------------------------
   */
a.link {position:relative; padding-left:7px; padding-right:7px;}
a.link::after {position:absolute; left:0; bottom:3px; width:100%; height:15px; border-radius:3px; background-color:rgba(120, 170, 243, 0.3); content:''; transition:0.2s; z-index:-1;}
a.link:hover::after {background-color:rgba(251, 108, 107, 0.3);}
.accordionA {border-radius:16px; overflow:hidden;}
.accordionA .accordion {border-bottom:solid 1px rgba(0, 0, 0, 0.1); background-color:#B1B0AD;}
.accordionA .accordion:hover {background-color:rgba(178, 159, 91, 0.8);}
.accordionA .accordion h3 {font-size:17px; color:#FFF;}
.accordionA .panel {border-left:solid 1px rgba(177, 176, 173, 0.3); border-right:solid 1px rgba(177, 176, 173, 0.3);}
.alarmS {position:fixed; left:120px; right:0; top:0; text-align:center; padding:12px 20px; color:#FFF; background-color:rgba(102, 100, 95, 0.9); z-index:1500; box-shadow:0 10px 10px rgba(102, 100, 95, 0.2);}
.alarmS .i {position:relative;}
.alarmS .i::after {position:absolute; left:0; top:0; text-align:center; width:100%; height:100%; line-height:24px; font-style:normal; font-weight:800; content:'i';}
.alarmS .comment {padding-bottom:10px;}
.alarmS .srchA {margin-bottom:0;}
.alarmS .srchA.group-form.button {height:auto;}
.alarmS .srchA .button.srch {width:20px; height:20px;}
.button.primary {background-color:#FAC300;}
input.primary,
.primary input,
select.primary,
.primary select {border-color:#FAC300;}
.secondary {background-color:#66645F;}
.chartA {border:solid 2px rgba(169, 165, 150, 0.6); border-radius:18px;}
.chartA .chart {min-width:500px; overflow-x:auto;}
.date-birth {background-color:rgba(255, 218, 86, 0.5);}
.feed-stop {text-indent:-100px; background-color:#F2F2EF; background-image:url("data:image/svg+xml,%3Csvg fill='%23A9A596' width='24' height='24' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' clip-rule='evenodd'%3E%3Cpath d='M12 11.293l10.293-10.293.707.707-10.293 10.293 10.293 10.293-.707.707-10.293-10.293-10.293 10.293-.707-.707 10.293-10.293-10.293-10.293.707-.707 10.293 10.293z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center; overflow:hidden;}
.legend span.feed-stop {text-indent:0;}
/*h3 strong {color:#7D56C9;}*/
h3 strong.num {font-size:110%; font-weight:800;}
.i-alarm {width:22px; height:22px; border-radius:22px; background-color:#FB6C6B; overflow:hidden;}
.i-drt.i-drt-tB {width:25px; height:25px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%2394928F' viewBox='0 0 24 24'%3E%3Cpath d='M16 8v-4l8 8-8 8v-4h-16l8-8h8z'/%3E%3C/svg%3E");}
.i-drt.i-drt-tB:hover {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23FFBF07' viewBox='0 0 24 24'%3E%3Cpath d='M16 8v-4l8 8-8 8v-4h-16l8-8h8z'/%3E%3C/svg%3E");}
.i-drt.i-drt-tB.drt-prev {margin-right:10px; background-position:0 1px; transform:rotate(180deg);}
.i-drt.i-drt-tB.drt-next {margin-left:10px;}
.item {position:relative; display:inline-block; text-align:center; margin-right:10px; padding-left:10px; padding-right:10px; height:26px; line-height:26px; text-indent:0; font-size:14px; color:#FFF; border-radius:26px;}
.item.notice {color:#000; background-color:#EAEAEA;}
.item.error {background-color:#FB6C6B;}
.group-form.form.form-fix,
.group-form.form.form-stop,
.group-form.form.form-trigger {height:36px;}
.group-form.form.form-fix input[type="checkbox"] + span,
.group-form.form.form-stop input[type="checkbox"] + span,
.group-form.form.form-trigger input[type="checkbox"] + span {position:relative; text-align:center; padding-left:0; width:65px; height:36px; line-height:200px; /*border:solid 1px #7D7B77;*/ border-radius:18px; background-color:transparent; background-position:center; background-repeat:no-repeat; background-image:url("/images/feed/button-form-fix.png"); background-size:auto; overflow:hidden;}
.group-form.form.form-fix input[type="checkbox"]:checked + span,
.group-form.form.form-stop input[type="checkbox"]:checked + span,
.group-form.form.form-trigger input[type="checkbox"]:checked + span {background-color:transparent; opacity:1.0;}
.group-form.form.form-fix label:hover input[type="checkbox"] + span, 
.group-form.form.form-stop label:hover input[type="checkbox"] + span, 
.group-form.form.form-trigger label:hover input[type="checkbox"] + span {background-image:url("/images/feed/button-form-hover.png");}
.group-form.form.form-fix input[type="checkbox"]:checked + span {background-image:url("/images/feed/button-form-fix-active.png") !important;}
.group-form.form.form-stop input[type="checkbox"]:checked + span {background-image:url("/images/feed/button-form-stop-active.png") !important;}
.group-form.form.form-trigger input[type="checkbox"]:checked + span {background-image:url("/images/feed/button-form-trigger-active.png") !important;}
/*.group-form.form.form-trigger strong.dt {width:55px;}*/
/*.group-form.form.form-trigger strong.dt {display:none;}*/
/*
.group-form.form.form-trigger strong.dt + label input[type="checkbox"] + span {width:150px; background-image:url("/images/feed/button-form-trigger.png");}
.group-form.form.form-trigger strong.dt + label input[type="checkbox"] + span::after {position:absolute; top:0; right:20px; text-align:right; width:calc(100% - 20px); height:100%; line-height:36px; letter-spacing:-0.5px; content:'공통설정';}
.group-form.form.form-trigger strong.dt + label input[type="checkbox"]:checked + span {background-image:url("/images/feed/button-form-trigger-active.png");}
.group-form.form.form-trigger strong.dt + label input[type="checkbox"]:checked + span::after {right:auto; left:27px; text-align:left; width:calc(100% - 27px); color:#FFF; content:'개별설정';}
*/
/*.group-form.form.form-trigger input[type="checkbox"] + span {background-size:auto 55%; background-position:left 8px top 8px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23E0E0DF' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M19 6.734c0 4.164-3.75 6.98-3.75 10.266h-6.5c0-3.286-3.75-6.103-3.75-10.266 0-4.343 3.498-6.734 6.996-6.734 3.502 0 7.004 2.394 7.004 6.734zm-4.5 11.266h-5c-.276 0-.5.224-.5.5s.224.5.5.5h5c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zm0 2h-5c-.276 0-.5.224-.5.5s.224.5.5.5h5c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zm.25 2h-5.5l1.451 1.659c.19.216.465.341.753.341h1.093c.288 0 .562-.125.752-.341l1.451-1.659z'/%3E%3C/svg%3E");;}

.group-form.form.form-trigger input[type="checkbox"] + span::after {position:absolute; left:0; top:0; width:100%; height:100%; line-height:36px; text-indent:10px; color:#FFF; content:'켜기';}
.group-form.form.form-trigger input[type="checkbox"]:checked + span {background-size:auto 63%; background-position:left 7px top 5px;  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23F6B63B' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M14 19h-4c-.276 0-.5.224-.5.5s.224.5.5.5h4c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zm0 2h-4c-.276 0-.5.224-.5.5s.224.5.5.5h4c.276 0 .5-.224.5-.5s-.224-.5-.5-.5zm.25 2h-4.5l1.188.782c.154.138.38.218.615.218h.895c.234 0 .461-.08.615-.218l1.187-.782zm3.75-13.799c0 3.569-3.214 5.983-3.214 8.799h-5.572c0-2.816-3.214-5.23-3.214-8.799 0-3.723 2.998-5.772 5.997-5.772 3.001 0 6.003 2.051 6.003 5.772zm4-.691v1.372h-2.538c.02-.223.038-.448.038-.681 0-.237-.017-.464-.035-.69h2.535zm-10.648-6.553v-1.957h1.371v1.964c-.242-.022-.484-.035-.726-.035-.215 0-.43.01-.645.028zm-3.743 1.294l-1.04-1.94 1.208-.648 1.037 1.933c-.418.181-.822.401-1.205.655zm10.586 1.735l1.942-1.394.799 1.115-2.054 1.473c-.191-.43-.423-.827-.687-1.194zm-3.01-2.389l1.038-1.934 1.208.648-1.041 1.941c-.382-.254-.786-.473-1.205-.655zm-10.068 3.583l-2.054-1.472.799-1.115 1.942 1.393c-.264.366-.495.763-.687 1.194zm13.707 6.223l2.354.954-.514 1.271-2.425-.982c.21-.397.408-.812.585-1.243zm-13.108 1.155l-2.356 1.06-.562-1.251 2.34-1.052c.173.433.371.845.578 1.243zm-1.178-3.676h-2.538v-1.372h2.535c-.018.226-.035.454-.035.691 0 .233.018.458.038.681z'/%3E%3C/svg%3E");}
.group-form.form.form-trigger input[type="checkbox"]:checked + span::after {content:'끄기';}
*/
/*
.group-form.form.form-fix strong + label span, 
.group-form.form.form-stop strong + label span, 
.group-form.form.form-trigger strong + label span {border-top-left-radius:0 !important; border-bottom-left-radius:0 !important;}
*/
.group-form.form.form-star input + span {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23CCC' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12 5.173l2.335 4.817 5.305.732-3.861 3.71.942 5.27-4.721-2.524-4.721 2.525.942-5.27-3.861-3.71 5.305-.733 2.335-4.817zm0-4.586l-3.668 7.568-8.332 1.151 6.064 5.828-1.48 8.279 7.416-3.967 7.416 3.966-1.48-8.279 6.064-5.827-8.332-1.15-3.668-7.569z'/%3E%3C/svg%3E");}
.group-form.form.form-star input:hover + span {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFBF07' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12 5.173l2.335 4.817 5.305.732-3.861 3.71.942 5.27-4.721-2.524-4.721 2.525.942-5.27-3.861-3.71 5.305-.733 2.335-4.817zm0-4.586l-3.668 7.568-8.332 1.151 6.064 5.828-1.48 8.279 7.416-3.967 7.416 3.966-1.48-8.279 6.064-5.827-8.332-1.15-3.668-7.569z'/%3E%3C/svg%3E");}
.group-form.form.form-star input:checked + span {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFBF07' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z'/%3E%3C/svg%3E");}
.group-form.form.form-button {height:36px; border-radius:18px;}
.group-form.form.form-button label {border-left:solid 1px #C9C9C7;}
.group-form.form.form-button label:first-child {border-left:0;}
.group-form.form.form-button label + label {margin-left:0;}
.group-form.form.form-button input + span {padding-left:15px; padding-right:15px; height:100%; line-height:36px; color:#FFF; background-color:#B2B1AF; background-image:url('');}
.group-form.form.form-button:hover input + span {background-image:url('') !important;}
.group-form.form.form-button input:checked + span {font-weight:400; background-color:#3D3731; background-image:url('') !important;}
.whs-normal .group-form {margin-bottom:5px;}
.keyA {position:relative; text-align:right; padding-bottom:5px; width:100%;}
.keyA::after {width:100%; height:1px; margin-top:-1px; content:''; clear:both;}
.keyA dd {padding-right:10px;}
.keyA dl dd:last-child {padding-right:0;}
.keyA dd span {display:inline-block; width:16px; height:16px; border-radius:18px;}
.keyA dd span.grade-stop {border:solid 1px #CCC;}
section {margin-top:35px;}
section.fst {margin-top:0;}
select.primary {height:35px; line-height:35px; border:solid 1px #FD6D6A;}
.standard-overt {color:#78AAF3 !important;}
.standard-short {color:#FB6C6B !important;}
	.group-form.select.standard-over {border-color:#78AAF3;}
	.group-form.select.standard-short {border-color:#FB6C6B;}
strong.sort {display:inline-block; padding-left:15px; padding-right:15px; height:36px; line-height:36px; font-weight:400; color:#FFF; border-radius:36px; background-color:#A9A596; cursor:n-resize;}
strong.sort:hover,
strong.sort:focus,
strong.sort:active {background-color:#FFBF07;}
.tabA {margin-bottom:15px; background-color:#FFF;}
.tabA li {position:relative; float:left; display:inline-block; height:65px; border-bottom:solid 2px rgba(102, 100, 95, 0.3);}
.tabA li.active {border-bottom-color:rgba(0, 0, 0, 1.0);}
.tabA li::after {position:absolute; top:25px; bottom:25px; left:0; width:1px; background-color:rgba(102, 100, 95, 0.3); content:'';}
.tabA li:first-of-type::after {width:0;}
.tabA li a {line-height:65px; font-size:18px; font-weight:700; color:rgba(102, 100, 95, 0.7);}
.tabA li a span {font-weight:inherit;}
.tabA li.active a {color:#000;}
table tr.active th,
table tr.active td {background-color:#FDE799;}
table button {font-size:14px; color:#FFF; background-color:#FAC300; /* background-image:url("/images/_common/corner-a.png"); */}
/*table input[type='text'] {min-width:50px;}*/
.table-card {border:solid 3px #FFBF07; border-radius:18px; overflow:hidden;}
.table-card > .ctn {overflow-x:auto;}
.table-card tr:first-child th,
.table-card tr:first-child td {padding-top:15px;}
.table-card tr:last-child th,
.table-card tr:last-child td{padding-bottom:15px; border-bottom:0;}
.table-card.table-vertical {border-top-color:#FFBF07; border-top-width:3px;}
.table-vertical {border-top:solid 2px #5B627A;}
.table-vertical th {background-color:#F5F5F5;}
.today-now {font-weight:800; color:#000 !important;}



/*
   * ------------------------------------------------------------------------
   * X-A-#menuToggle
   * ------------------------------------------------------------------------
   */

body {overflow-x:hidden; overflow-y:scroll;}
.navAll {position:absolute; top:0; left:0; height:100%;}
.navAll h2 {display:none;}
#menuToggle {display:block; position:relative; top:0; left:0; height:100%; z-index:1000; -webkit-user-select:none; user-select:none;}
#menuToggle a {text-decoration:none; color:#232323; transition:color 0.3s ease;}
#menuToggle a:hover {color:tomato;}
#menuToggle input {position:fixed; top:0; left:0; display:block; width:120px; height:65px; cursor:pointer; opacity:0; z-index:1000; -webkit-touch-callout:none;}
#menuToggle input:checked ~ ul {transform:none; overflow-y:auto;}
#menuToggle input:checked ~ ul::before {position:absolute; left:0; top:0; text-align:center; width:200px; height:90px; line-height:90px; font-size:26px; font-weight:800; content:'X';}
ul#menu {position:fixed; left:0; top:0; margin:0; padding:50px; width:100px; height:calc(100% - 100px); background:#EDEDED; list-style-type:none; -webkit-font-smoothing:antialiased; /* to stop flickering of text in safari */ transform-origin:0% 0%; transform:translate(-100%, 0); transition:transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);}
ul#menu > li:first-child {padding-top:30px;}
ul#menu > li a {padding:10px 0 0 0; width:100%; font-size:22px;}
ul#menu ul li a {position:relative; padding:0; width:100%; font-size:15px;}
ul#menu ul li a::before {content:'- ';}



/*
   * ------------------------------------------------------------------------
   * X-A-#Header
   * ------------------------------------------------------------------------
   */
body {/* height:100%; */ background-color:#FFF;}
#wrap {position:relative; height:100%;}
h1 {position:fixed; top:0; left:0; text-align:center; width:120px; height:65px; line-height:65px; font-size:26px; font-weight:800; color:#66645F; z-index:1000; overflow:hidden;}
h1 > span {font-weight:inherit;}
#header {position:fixed; top:0; left:120px; right:0; height:65px; background-color:#FFF; z-index:900;}
#header .tabA {margin:0 auto; max-width:1700px;}
#header .btnFloatA {position:fixed; top:10px; right:90px; z-index:900;}
#header .btnFloatA .button.settings {width:46px; height:46px; line-height:200px; border-radius:46px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFFFFF' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M24 13.616v-3.232c-1.651-.587-2.694-.752-3.219-2.019v-.001c-.527-1.271.1-2.134.847-3.707l-2.285-2.285c-1.561.742-2.433 1.375-3.707.847h-.001c-1.269-.526-1.435-1.576-2.019-3.219h-3.232c-.582 1.635-.749 2.692-2.019 3.219h-.001c-1.271.528-2.132-.098-3.707-.847l-2.285 2.285c.745 1.568 1.375 2.434.847 3.707-.527 1.271-1.584 1.438-3.219 2.02v3.232c1.632.58 2.692.749 3.219 2.019.53 1.282-.114 2.166-.847 3.707l2.285 2.286c1.562-.743 2.434-1.375 3.707-.847h.001c1.27.526 1.436 1.579 2.019 3.219h3.232c.582-1.636.75-2.69 2.027-3.222h.001c1.262-.524 2.12.101 3.698.851l2.285-2.286c-.744-1.563-1.375-2.433-.848-3.706.527-1.271 1.588-1.44 3.221-2.021zm-12 2.384c-2.209 0-4-1.791-4-4s1.791-4 4-4 4 1.791 4 4-1.791 4-4 4z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center; background-color:rgba(102, 100, 95, 0.7); background-size:60% auto; overflow:hidden;}
#header .srchA-traceN {position:fixed; top:10px; right:35px; height:45px; z-index:999;}
#header .srchA-traceN input[type="search"] {display:none; vertical-align:top; margin-right:-5px; height:46px; line-height:46px; text-indent:12px; font-size:17px; font-weight:700; letter-spacing:2px; color:#FFDA56; border-radius:46px; background-color:#66645F; transition:all 0.5s;}
#header .srchA-traceN input[type="search"]::placeholder {font-size:15px; font-weight:400; color:#FFDA56;}
#header .srchA-traceN button.srch {vertical-align:bottom; margin-bottom:5px; width:46px; height:46px; line-height:500px; border-radius:46px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23FFFFFF' viewBox='0 0 24 24'%3E%3Cpath d='M23.822 20.88l-6.353-6.354c.93-1.465 1.467-3.2 1.467-5.059.001-5.219-4.247-9.467-9.468-9.467s-9.468 4.248-9.468 9.468c0 5.221 4.247 9.469 9.468 9.469 1.768 0 3.421-.487 4.839-1.333l6.396 6.396 3.119-3.12zm-20.294-11.412c0-3.273 2.665-5.938 5.939-5.938 3.275 0 5.94 2.664 5.94 5.938 0 3.275-2.665 5.939-5.94 5.939-3.274 0-5.939-2.664-5.939-5.939z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center; background-color:#66645F; overflow:hidden;}
#header .srchA-traceN:hover input[type="search"] {display:inline-block;}

#top_container {position:relative; margin-left:120px; /*margin-bottom:50px;*/ /*min-height:100%;*/ min-height:calc(100% - 50px);/* min-height:100%;*/} /* [add] 20211007. height 추가. .table-fix 최대 높이 설정 이유 */
#top_container.heightFull {height:calc(100% - 50px);}
#top_container.heightFull > .ctn {height:100%;}
#top_container.heightFull #main {height:calc(100% - 90px);}
#top_container.heightFull #main > .ctn,
#top_container.heightFull #main > .ctn > .fL {height:100%;}
#top_container #main > .ctn {position:relative;}
#top_container.heightFull #main .listA {height:calc(100% - 50px);}
#top_container.heightFull #main .srchA + .listA {margin-top:10px; height:calc(100% - 50px);}
#container {min-height:100%; height:100%;}
#nav {position:fixed; top:0; bottom:0; left:0; width:120px; background-color:#FFDA56; z-index:900;}
#nav h2 {display:none;}
#nav .nav {padding-top:65px;}
#nav .nav li {padding-bottom:15px;}
#nav .nav li a {position:relative; display:inline-block; text-align:center; width:100%; height:95px; line-height:152px; color:rgba(102, 100, 95, 1.0); overflow:hidden;}
#nav .nav li a::before {position:absolute; bottom:0; left:50%; margin-left:-40px; width:80px; height:35px; border-bottom-left-radius:16px; border-bottom-right-radius:16px; background-color:rgba(102, 100, 95, 0.15); content:'';}
#nav .nav li a::after {position:absolute; top:0; left:50%; margin-left:-40px; width:80px; height:60px; background-repeat:no-repeat; background-position:center top;  border-top-left-radius:16px; border-top-right-radius:16px; background-color:rgba(102, 100, 95, 0.5);  content:'';}
#nav .nav li.dashboard a::after {background-image:url("/images/feed/nav-dashboard.png");}
#nav .nav li.animal a::after {background-image:url("/images/feed/nav-animal.png");}
#nav .nav li.feeding a::after {background-image:url("/images/feed/nav-feeding.png");}
#nav .nav li.reports a::after {background-image:url("/images/feed/nav-reports.png");}
#nav .nav li.set a::after {background-image:url("/images/feed/nav-set.png");}
#nav .nav li.admin a::after {background-image:url("/images/feed/nav-admin.png");}
#nav .nav li.active a {color:#FFDA56;}
#nav .nav li.active a::before {left:30px; margin-left:0; width:60px; border-top:solid 1px rgba(255, 218, 86, 0.4); background-color:transparent;}
#nav .nav li.active a::after {height:100%; border-radius:18px; background-color:rgba(102, 100, 95, 1.0); z-index:-1;}
#nav .nav li.selDevice {text-align:center;}
#nav .nav li.selDevice .group-form {height:36px; border:0;}
#nav .nav li.selDevice select {margin:0 auto; padding-left:10px; padding-right:25px; width:80px; color:#FFF; background-color:rgba(102, 100, 95, 0.5); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23E8C957' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M24 12c0-6.627-5.373-12-12-12s-12 5.373-12 12 5.373 12 12 12 12-5.373 12-12zm-18.005-1.568l1.415-1.414 4.59 4.574 4.579-4.574 1.416 1.414-5.995 5.988-6.005-5.988z'/%3E%3C/svg%3E"); background-size:auto 45%; background-position:right 5px top 9px;}
.pnbA {margin:0 auto; width:80px; height:36px; border-radius:36px; overflow:hidden;}
.pnbA a {position:relative; display:inline-block; float:left; padding:0; width:50%; height:100%; line-height:200px; background-color:rgba(102, 100, 95, 0.5); background-repeat:no-repeat; background-position:center;}
.pnbA a:first-child::before {position:absolute; right:0; top:0; width:1px; height:100%; background-color:rgba(255, 255, 255, 0.2); content:'';}
.pnbA a.my {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFDA56' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M20.822 18.096c-3.439-.794-6.641-1.49-5.09-4.418 4.719-8.912 1.251-13.678-3.732-13.678-5.082 0-8.465 4.949-3.732 13.678 1.598 2.945-1.725 3.641-5.09 4.418-2.979.688-3.178 2.143-3.178 4.663l.005 1.241h23.99l.005-1.241c0-2.52-.199-3.975-3.178-4.663zm-1.822 3.904h-5v-2h5v2z'/%3E%3C/svg%3E"); background-size:auto 50%;}
.pnbA a.signOut {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFDA56' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M8 9v-4l8 7-8 7v-4h-8v-6h8zm6-7c-1.787 0-3.46.474-4.911 1.295l.228.2 1.395 1.221c1.004-.456 2.115-.716 3.288-.716 4.411 0 8 3.589 8 8s-3.589 8-8 8c-1.173 0-2.284-.26-3.288-.715l-1.395 1.221-.228.2c1.451.82 3.124 1.294 4.911 1.294 5.522 0 10-4.477 10-10s-4.478-10-10-10z'/%3E%3C/svg%3E"); background-size:auto 62%;}
.modal-my .tableA th {display:none;}
#main {margin:0 auto; padding-top:90px; max-width:1700px; height:100%; z-index:100;} /* [add] 20211007. height 추가. .table-fix 최대 높이 설정 이유 */
h2 {font-size:24px; font-weight:700;}
h3 {margin-top:50px; padding-bottom:5px; font-size:21px; font-weight:700;}
h3:first-of-type {margin-top:0;}
h3 .group-form.form label span {font-size:21px; font-weight:700;}
h4 {font-size:19px; font-weight:700;}
.srchA + h3 {margin-top:25px;}
.srchA button.save {color:#FFF; background-color:rgba(102, 100, 95, 1.0);}

 #top_footer {position:relative; /*position:fixed; bottom:0; left:0;*/ text-align:center; width:100%; height:50px; line-height:50px;}
 #top_footer .ctn {margin:0 auto; padding:0 150px 0 150px; width:fit-content; line-height:50px;}



/*
   * ------------------------------------------------------------------------
   * X-A-Animal
   * ------------------------------------------------------------------------
   */
#animalInfoModal .modal-content,
#curveInfoModal .modal-content {height:70%;}
#animalInfoModal .modal-body,
#curveInfoModal .modal-body {height:85%;}
[data-location='animal'],
[data-location='curveInfo'] {padding-right:15px;}
#iframe_animal_info #top_container {margin-left:0 !important;}
#iframe_animal_info #main {padding-left:0 !important;}
[data-location='animal'] {position:relative;}
[data-location='animal'] .srchA {position:fixed; left:0; top:0; right:15px; /*width:calc(100% - 15px);*/ background-color:rgba(255, 255, 255, 0.95); z-index:1000;}
[data-location='animal'] .accordionA {margin-top:50px;}



/*
   * ------------------------------------------------------------------------
   * X-A-Dashboard
   * ------------------------------------------------------------------------
   */
[data-location="dashboard"] #main {margin:0; padding-top:90px; max-width:100%;}
[data-location="dashboard"] .locationA {position:relative; text-align:center; margin-top:-25px; margin-left:-35px; margin-right:-35px; height:400px; font-size:22px; color:#FFF; background:url("/images/feed/background-feed.jpg") center top repeat-x;}
[data-location="dashboard"] .locationA h2 {display:none; height:50px; line-height:60px; font-size:24px; font-weight:700;}
[data-location="dashboard"] .locationA .owl-carousel {margin:0 110px; padding-top:40px; width:calc(100% - 220px);}
[data-location="dashboard"] .locationA .owl-carousel .owl-stage-outer {height:300px;}
[data-location="dashboard"] .locationA .item {text-align:center; margin:0 auto; padding-left:0; padding-right:0; min-width:223px; max-width:273px; height:283px; border:solid 1px rgba(55, 52, 47, 0.8); border-radius:18px; background-color:rgba(55, 52, 47, 0.8); box-shadow:0 10px 10px 0 rgba(250, 195, 0, 0.1); overflow:hidden; cursor:pointer;}
[data-location="dashboard"] .locationA .item::before {background-image:url('');}
[data-location="dashboard"] .locationA .item:hover {min-width:223px; max-width:273px; height:283px; border-color:#FFDA56; background-color:rgba(55, 52, 47, 1.0); box-shadow:0 10px 10px 0 rgba(250, 195, 0, 0.3);}
[data-location="dashboard"] .locationA .item h3 {height:55px; line-height:65px; color:#FFDA56;}
/*[data-location="dashboard"] .locationA .item h3 a {display:inline-block; width:100%; height:100%; }*/
[data-location="dashboard"] .locationA .item h3 strong {font-size:22px; font-weight:700; color:#FFF;}
[data-location="dashboard"] .locationA .avg {position:relative; padding-top:20px; height:100px; background-color:rgba(0, 0, 0, 0.4);}
[data-location="dashboard"] .locationA .avg h4 {position:absolute; top:25px; left:50%; margin-left:-15px; font-size:15px; line-height:1.4; font-weight:700; color:rgba(255, 255, 255, 0.8);}
[data-location="dashboard"] .locationA .avg dl {position:relative; float:left; display:inline-block; text-align:left; padding-left:35px; width:calc(50% - 35px);}
[data-location="dashboard"] .locationA .avg dt {line-height:1.1;}
[data-location="dashboard"] .locationA .avg dd {font-size:25px; font-weight:700; color:#FFDA56;}
[data-location="dashboard"] .locationA .avg dd > span {display:block; margin-top:-3px; font-size:80%; line-height:1.0;}
/*[data-location="dashboard"] .locationA .avg dl.today:after {position:absolute; right:0; top:0; width:1px; height:100%; background-color:rgba(255, 255, 255, 0.2); content:'';}*/
[data-location="dashboard"] .locationA .info {margin-top:10px;}
[data-location="dashboard"] .locationA .info dt,
[data-location="dashboard"] .locationA .info dd {float:left; display:inline-block; text-align:left; line-height:1.8;}
[data-location="dashboard"] .locationA .info dt {position:relative; width:135px; text-indent:35px; opacity:0.8;}
[data-location="dashboard"] .locationA .info dt::before {position:absolute; top:0; left:-12px; color:rgba(255, 255, 255, 0.5); content:'-';}
[data-location="dashboard"] .locationA .info dt .unit {font-size:100%; font-weight:300;}
[data-location="dashboard"] .locationA .info dd {padding-left:10px; width:calc(100% - 170px);}
[data-location="dashboard"] .owl-nav {margin-top:0;} /* PREV, NEXT */
[data-location="dashboard"] .owl-carousel .owl-nav button.owl-next, 
[data-location="dashboard"] .owl-carousel .owl-nav button.owl-prev {position:absolute; top:50%; margin-top:-50px; width:50px; height:99px; line-height:500px; background-repeat:no-repeat; background-position:center; background-image:url("/images/_common/ico-arr-a.png"); overflow:hidden;}
[data-location="dashboard"] .owl-carousel .owl-nav button.owl-next {right:-75px; transform:rotate(180deg);}
[data-location="dashboard"] .owl-carousel .owl-nav button.owl-prev {left:-75px;}
[data-location="dashboard"] .owl-theme .owl-nav .disabled {opacity:0.3;}
[data-location="dashboard"] .owl-theme .owl-nav [class*=owl-]:hover {background-image:url("/images/_common/ico-arr-a.png"); background-color:transparent;}
[data-location="dashboard"] .owl-dots {text-align:center; margin-top:10px;} /* PAGING */
[data-location="dashboard"] .owl-dots .owl-dot {height:12px; line-height:0;}
[data-location="dashboard"] .owl-dots .owl-dot span {display:inline-block; margin:0 7px; width:75px; height:100%; line-height:200px; border-radius:12px; background-color:rgba(255, 255, 255, 0.4); overflow:hidden; transition:0.2s;}
[data-location="dashboard"] .owl-dots .owl-dot:hover span {margin-top:-4px; height:18px; background-color:rgba(255, 255, 255, 0.75);}
[data-location="dashboard"] .owl-dots .owl-dot.active span {background-color:#FFBF07; cursor:default;}
[data-location="dashboard"] .owl-dots .owl-dot.active:hover span {height:10px; background-color:#FFBF07;}
[data-location="dashboard"] .wrapG {margin:0 55px; margin-top:50px; padding-left:75px; padding-right:75px;}
[data-location="dashboard"] .cautionA,
[data-location="dashboard"] .noticeA {display:inline-block; float:left;}
[data-location="dashboard"] .cautionA h2,
[data-location="dashboard"] .noticeA h2 {padding-bottom:5px; height:30px; font-size:18px; font-weight:700;}
[data-location="dashboard"] .cautionA .listA,
[data-location="dashboard"] .noticeA .listA {padding:15px 30px 25px 30px; width:calc(100% - 60px); height:calc(200px - 40px); border-radius:18px; background-color:#F8F8F8; overflow:hidden;}
[data-location="dashboard"] .cautionA .listA > .ctn,
[data-location="dashboard"] .noticeA .listA > .ctn {height:100%; overflow-y:scroll;}
[data-location="dashboard"] .cautionA {width:60%;}
[data-location="dashboard"] .cautionA h2 strong {display:inline-block; text-align:center; width:30px; height:30px; line-height:30px; font-size:14px; font-weight:800; color:#FFF; border-radius:30px; background-color:#FB6C6B;}
[data-location="dashboard"] .cautionA h2 .amount {padding-left:0; font-size:14px; color:#555;}
[data-location="dashboard"] .cautionA .listA li {float:left; display:inline-block; padding-top:8px; padding-bottom:8px; width:25%; border-bottom:solid 1px #E6E8EC;}
[data-location="dashboard"] .cautionA .title strong {font-weight:400;}
[data-location="dashboard"] .cautionA .item {margin-right:0; padding-right:0; padding-left:5px; color:#FB6C6B; background-color:transparent;}
[data-location="dashboard"] .cautionA .item::before {background-image:url('');}
[data-location="dashboard"] .cautionA .amount span {position:relative; padding-right:20px;}
[data-location="dashboard"] .cautionA .amount span::before {position:absolute; right:7px; top:0; line-height:1.2; content:'/';}
[data-location="dashboard"] .cautionA .amount span.tomorrow::before {content:'';}
[data-location="dashboard"] .noticeA {float:right; text-align:left; width:33%;}
[data-location="dashboard"] .noticeA .listA li {height:39px; line-height:39px; border-bottom:solid 1px #E6E8EC; overflow:hidden;}
[data-location="dashboard"] .noticeA .item {padding-left:0; padding-right:0; width:80px;}
[data-location="dashboard"] .feedingA {margin-top:50px;}
[data-location="dashboard"] .feedingA h2 {padding-bottom:5px; height:30px; font-size:18px; font-weight:700;}
[data-location="dashboard"] .feedingA .chartA {height:325px; border:solid 2px #CCC; overflow:hidden;}
.lct-dashboardDevice {margin:0 auto !important; max-width:1700px !important;}
.lct-dashboardDevice .fL {margin-left:50px; margin-bottom:20px; width:calc((100% - 150px)/4);}
/*[data-location="dashboard"] .lct-dashboardDevice .keyA + .fL, */
.lct-dashboardDevice .fL:nth-of-type(4n+2) {margin-left:0;}
.lct-dashboardDevice .listA {border:solid 1px #EAEAEA; border-radius:18px; overflow:hidden;}



/*
   * ------------------------------------------------------------------------
   * X-A-admin
   * ------------------------------------------------------------------------
   */
.lct-adminLocation .fL {width:33%;}
.lct-adminLocation .connected-pre  {width:calc(33% - 50px);}
.lct-adminLocation .connected-last  {width:34%;}



/*
   * ------------------------------------------------------------------------
   * X-A-Animal
   * ------------------------------------------------------------------------
   */
.lct-animalStall #top_container {height:100%;}
.lct-animalStall .splitA {min-width:1200px; height:calc(100% - 140px); overflow-y:hidden; overflow-x:auto;}
.lct-animalStall .splitA > .fL, 
.lct-animalStall .splitA > .fR {height:100%;}
.lct-animalStall .splitA > .fL {width:calc(40% - 20px);} 
.lct-animalStall .splitA > .fR {width:calc(60% - 20px);}
.lct-animalStall .splitA > .fL .tableA, 
.lct-animalStall .splitA > .fR .tableA {height:calc(100% - 90px); overflow-y:auto;}



/*
   * ------------------------------------------------------------------------
   * X-A-Feed
   * ------------------------------------------------------------------------
   */
[data-location="feeding"] .group-birth {text-align:center; vertical-align:middle; width:100%; min-width:100px; height:36px; overflow:hidden;}
[data-location="feeding"] .group-birth .dsp-ib {height:100%; line-height:36px;}
.lct-feeding-info #main .keyA + .tableA {height:calc(100% - 90px);}



/*
   * ------------------------------------------------------------------------
   * X-A-Reports
   * ------------------------------------------------------------------------
   */
.lct-reportsDay #container .srchA {width:100%; overflow:hidden;}
.lct-reportsDay #container .srchA .form-buttonA {margin-bottom:5px; width:100%; overflow-x:auto;}
.lct-reportsDay #container .srchA .form-button {width:max-content;}



/*
   * ------------------------------------------------------------------------
   * X-A-Tooltip
   * ------------------------------------------------------------------------
   */
.tooltip {display:none; position:absolute; margin-top:2px; margin-left:-5px; padding:8px; /*width:200px;*/ -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; background-color:rgba(126, 124, 121, 0.9); color:#FFF; font-size:14px; z-index:1500;}
.tooltip:not(.tooltip-sub):after {position:absolute; bottom:100%; left:7px; width:0; /*height: 0;*/ margin-left:0; border:solid transparent; border-color:rgba(51, 51, 51, 0); border-bottom-color:rgba(126, 124, 121, 0.9); border-width:10px; pointer-events:none; content:''; z-index:999;}
.tooltip * {font-size:13px;}
.tooltip h6 {font-size:15px;}
.tooltip .new {position:relative; display:inline-block; float:right; margin-top:-23px; margin-bottom:7px; width:17px; height:17px; line-height:100px; border-radius:17px; border:solid 1px rgba(255, 255, 255, 0.5); background-repeat:no-repeat; background-size:50% auto; background-position:center; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFFFFF' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M24 10h-10v-10h-4v10h-10v4h10v10h4v-10h10z'/%3E%3C/svg%3E"); overflow:hidden; cursor:pointer;}
.tooltip .tableA table {border-top:solid 2px rgba(255, 255, 255, 0.2);}
.tooltip .tableA table th, 
.tooltip .tableA table td {padding-top:2px; padding-bottom:2px; height:22px; line-height:22px; border-bottom-color:rgba(255, 255, 255, 0.2);}
.tooltip .tableA table th {border-right:0; background-color:rgba(255, 255, 255, 0.1);}
.tooltip .tableA table td {border-right-color:rgba(255, 255, 255, 0.2);}
.tooltip .tableA table thead th,
.tooltip .tableA table thead td {background-color:rgba(255, 255, 255, 0.1);}
.tooltip .noteA {padding-top:5px;}
.arrow_box_b {display:none; position:absolute; /*width:200px;*/ padding:8px; /*margin-top:-70px;*/ /*left: 0;*/ -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; background:#333; color:#FFF; font-size:14px; z-index:999;}
.arrow_box_b:after {position:absolute; bottom:-20px; left:20%; width:0; /*height: 0;*/ margin-left:-30px; border:solid transparent; border-color:rgba(51, 51, 51, 0); border-top:360px solid #333; border-left:180px solid transparent; border-right:180px solid transparent; border-width:10px; pointer-events:none; content:''; z-index:999;}
.s_arrow_box {display:none; position:absolute; /*margin-top: -70px;*/ /*left: 0;*/ margin-left:210px; /*width: 100px;*/ padding:8px; /*height:350px;*/ -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; /*background:#333;*/ color:#FFF; font-size:14px; z-index:999;}
/*.s_arrow_box div {height:345px; overflow:scroll;}*/
/*.s_arrow_box td {font-size:10px; line-height:12px; height:13px;}*/
.tooltip.tooltip-sub {background-color:rgba(65, 63, 57, 0.9);}
/*.tooltip.tooltip-sub:after {border-bottom-color:rgba(65, 63, 57, 0.9);}*/



/*
   * ------------------------------------------------------------------------
   * X-A-Breakpoints
   * ------------------------------------------------------------------------
   */
@media (max-width:1800px) {
/*	#header {left:155px;}*/
	#main {padding-left:25px; padding-right:25px; max-width:none;}
	[data-location="dashboard"] .cautionA .listA li {width:33%;}
	
}

@media (max-width:1400px) {
	[data-location="dashboard"] .wrapG {margin-left:0; margin-right:0; padding-left:0; padding-right:0;}
	[data-location="dashboard"] .cautionA {width:65%;}
	[data-location="dashboard"] .cautionA .listA li {width:50%;}
	.lct-dashboardDevice .fL {width:calc((100% - 100px)/3);}
	.lct-dashboardDevice .fL:nth-of-type(4n+2) {margin-left:50px;}
	.lct-dashboardDevice .fL:nth-of-type(3n+2) {margin-left:0;}
}

@media (max-width:1200px) {
	
}

@media (max-width:992px) {
	[data-location="dashboard"] .cautionA .listA li {width:100%;}
	.lct-dashboardDevice .fL {width:calc((100% - 50px)/2);}
	.lct-dashboardDevice .fL:nth-of-type(3n+2) {margin-left:50px;}
	.lct-dashboardDevice .fL:nth-of-type(2n) {margin-left:0;}
}

@media (max-width:768px) {
	.accordion.active + .panel {padding:15px;}
	.alarmS {left:0;}
	a.button, 
	button.button {padding-left:10px; padding-right:10px;}
	.group-form.button button:first-child {padding-left:15px;}
	.group-form.button button:last-child {padding-right:15px;}
	.group-form strong.dt {padding-left:10px; padding-right:10px; letter-spacing:-1px;}
	.group-form.form.form-trigger strong.dt {width:50px;}
	
	#header {left:0;}
	#header .tabA li {display:none;}
	#header .tabA li.active {display:block; width:100%;}
	#top_container {margin-left:0;}
	#nav {margin-left:-120px; transition:all 0.2s;}
	#nav h1 {position:fixed; left:50px; top:50px;}
	h1:hover #nav {margin-left:0; width:100%;}
	/* Dashboard */
	[data-location="dashboard"] .locationA {margin-top:0;}
	[data-location="dashboard"] .wrapG {margin:10px 0 0 0; padding-left:0; padding-right:0;}
	[data-location="dashboard"] .cautionA,
	[data-location="dashboard"] .noticeA {float:none; margin-top:25px; width:100%;}
	[data-location="dashboard"] .cautionA .title,
	[data-location="dashboard"] .cautionA .amount {display:inline-block;}
	[data-location="dashboard"] .cautionA .amount {padding-left:10px;}
	
	.modal.modal-md .modal-content {padding-left:20px; padding-right:20px; width:calc(100% - 40px);}/* padding:60px; */
	.modal.modal-md .modal-content .tableA > .ctn {overflow:auto;}
	.chartA > .ctn {min-width:700px}
}

@media (max-width:576px) {
	.group-form.button {height:auto;}
	
	[data-location="dashboard"] .locationA .owl-carousel {margin:0 50px; padding-top:20px; width:calc(100% - 100px);}
	[data-location="dashboard"] .owl-carousel .owl-nav button.owl-prev {left:-30px;}
	[data-location="dashboard"] .owl-carousel .owl-nav button.owl-next {right:-30px;}
	[data-location="dashboard"] .owl-dots {margin-top:0;}
	[data-location="dashboard"] .owl-dots .owl-dot span {width:25px;}
	[data-location="dashboard"] .feedingA {margin-top:25px;}
	[data-location="dashboard"] #main {padding-top:65px;}
	
	.lct-dashboardDevice .fL {margin-left:0; width:100%; height:50% !important;}
	.lct-dashboardDevice .fL:nth-of-type(3n+2) {margin-left:0;}
}