@charset "utf-8";

html {height:auto;}
#winClose {position:fixed; top:15px; right:15px; width:50px; height:50px; line-height:200px; border-radius:16px; background-color:rgba(102, 100, 95, 0.7); background-repeat:no-repeat; 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='M23.954 21.03l-9.184-9.095 9.092-9.174-2.832-2.807-9.09 9.179-9.176-9.088-2.81 2.81 9.186 9.105-9.095 9.184 2.81 2.81 9.112-9.192 9.18 9.1z'/%3E%3C/svg%3E"); overflow:hidden; z-index:1999;}
[data-location="guide"] .mg-15px {margin-top:15px;}
[data-location="guide"] table th, 
[data-location="guide"] table td {padding-top:10px; padding-bottom:10px; line-height:1.6;}
[data-location="guide"] .button-sm {width:20px; height:20px; line-height:200px; background-color:#9DACD3; cursor:default;}
[data-location="guide"] .button-sm:hover {background-color:#9DACD3;}
[data-location="guide"] .cardA .card {padding-bottom:0;}
[data-location="guide"] .cardA table tr:last-child th,
[data-location="guide"] .cardA table tr:last-child td {border-bottom:0;}
[data-location="guide"] .comment {display:block; margin-top:5px; padding-left:10px;}
[data-location="guide"] .comment .h4,
[data-location="guide"] .comment .h6 {position:relative; display:inline-block; padding-left:25px; width:auto;  background-color:rgba(173, 176, 188, 0.3);}
[data-location="guide"] .comment .h4 {margin-bottom:5px; padding-top:0; padding-left:40px; padding-right:15px; height:35px; line-height:35px; border-radius:18px;}
[data-location="guide"] figure {margin-bottom:8px; margin-top:4px; padding:0; width:auto; max-width:fit-content; border-radius:15px; border:solid 1px rgba(102, 100, 95, 0.15); overflow:hidden;}
    [data-location="guide"] h3 + figure,     
    [data-location="guide"] p + figure,
    [data-location="guide"] h3 + .cts {margin-left:40px;}
[data-location="guide"] figure .figImg {line-height:0; overflow:auto;}
[data-location="guide"] figure figcaption {padding:10px 15px; background-color:rgba(102, 100, 95, 0.1);}
[data-location="guide"] .group-form {margin-right:0; cursor:default !important;}
[data-location="guide"] .group-form.button .button.button-sm {margin-left:0;}
[data-location="guide"] .group-form.form label + label {margin-left:10px;}
/*[data-location="guide"] h1 {line-height:200px; background:url('/images/feed/h1.png') no-repeat center; background-size:auto 80%; overflow:hidden;}*/
[data-location="guide"] 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;}
[data-location="guide"] h1 span {display:block; line-height:0.9; font-weight:inherit;}
[data-location="guide"] h1 > span {margin-top:15px;}
[data-location="guide"] h1 span span {font-weight:300;}
[data-location="guide"] h2 {margin-bottom:25px; padding-top:40px; padding-left:30px; height:80px; color:rgba(0, 0, 0, 0.6); border-radius:20px; background-color:rgba(201, 191, 173, 0.3);}
[data-location="guide"] h3 {position:relative; margin-top:40px; padding-left:15px; font-size:20px; color:#000;}
[data-location="guide"] h3::before {position:absolute; left:0; top:6px; width:8px; height:20px; border-radius:8px; background-color:#51CDCD; content:'';}
[data-location="guide"] .h {display:block; font-size:17px; font-weight:700; color:#000;}
[data-location="guide"] .h4 {display:block; vertical-align:middle; margin-top:15px; padding-top:8px; font-size:17px; font-weight:800; color:#5C74B5;}
    [data-location="guide"] ul li:first-child .h4 {margin-top:0;}
[data-location="guide"] .h4 + p {padding-left:5px;}
[data-location="guide"] .h5 {position:relative; display:inline-block; vertical-align:middle; margin-bottom:5px; padding-left:12px; padding-right:12px; height:22px; line-height:22px; font-size:15px; color:#FFF; border-radius:22px; background-color:rgba(173, 176, 188, 0.8); overflow:hidden;}
[data-location="guide"] .h5.tB {height:30px; border:solid 1px rgba(173, 176, 188, 0.8); background-color:#FFF;}
    [data-location="guide"] .h5.num {padding-left:30px;}
    [data-location="guide"] .h5.num.only {padding-left:12px;}
    [data-location="guide"] .h5.num::after {/*left:20px;*/ left:0; top:0; width:25px; color:#000; background-color:#FFDD91;}
[data-location="guide"] .h6 {display:inline-block; padding-left:8px; padding-right:8px; height:24px; line-height:24px; color:#555; border-radius:22px; background-color:rgba(173, 176, 188, 0.3);}
[data-location="guide"] img {vertical-align:middle;}
[data-location="guide"] input[disabled] {background-color:#FFF !important; cursor:default;}
[data-location="guide"] select {cursor:default !important;}
[data-location="guide"] .note {display:block; color:rgba(0, 0, 0, 0.6);}
	[data-location="guide"] p.note {padding-left:0; padding-top:7px; letter-spacing:-0.5px;}
[data-location="guide"] .num::after {position:absolute; left:0; top:0; text-align:center; width:20px; height:22px; line-height:22px; border-top-left-radius:18px; border-bottom-left-radius:18px; background-color:rgba(255, 207, 99, 0.7); content:'00';}
[data-location="guide"] .h4.num::after {width:30px; height:35px; line-height:35px;}
[data-location="guide"] i.i {width:20px; height:20px;}
[data-location="guide"] .num.num1::after {content:'①'}
[data-location="guide"] .num.num2::after {content:'②'}
[data-location="guide"] .num.num3::after {content:'③'}
[data-location="guide"] .num.num4::after {content:'④'}
[data-location="guide"] .num.num5::after {content:'⑤'}
[data-location="guide"] .num.num6::after {content:'⑥'}
[data-location="guide"] .num.num7::after {content:'⑦'}
[data-location="guide"] .num.num8::after {content:'⑧'}
[data-location="guide"] .num.num9::after {content:'⑨'}
[data-location="guide"] .num.num10::after {content:'⑩'}
[data-location="guide"] .num.star::after {content:'*'}
[data-location="guide"] .num.arr::after {content:'⇒'}
[data-location="guide"] .num.dot::after {font-size:11px; content:'●'}
[data-location="guide"] p {padding-left:40px;}
[data-location="guide"] p.spc {background-position:15px 3px; background-size:auto 70%; background-repeat:no-repeat; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2394A4CE' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12 4c4.411 0 8 3.589 8 8s-3.589 8-8 8-8-3.589-8-8 3.589-8 8-8zm0-2c-5.523 0-10 4.477-10 10s4.477 10 10 10 10-4.477 10-10-4.477-10-10-10zm0 6c2.206 0 4 1.794 4 4s-1.794 4-4 4-4-1.794-4-4 1.794-4 4-4zm0-2c-3.314 0-6 2.686-6 6s2.686 6 6 6 6-2.686 6-6-2.686-6-6-6zm0 4c-1.105 0-2 .896-2 2s.895 2 2 2 2-.896 2-2-.895-2-2-2z'/%3E%3C/svg%3E");}
[data-location="guide"] .pd-40px {padding-left:40px;}
[data-location="guide"] section {padding-top:55px;}
[data-location="guide"] .spcA {margin-left:40px; margin-bottom:5px; padding:15px 25px; border-radius:18px; border:solid 4px #FFF1AB; background-color:rgba(255, 241, 171, 0.3);}
    [data-location="guide"] ul.ul .spcA {margin-left:0;}
[data-location="guide"] strong {font-weight:400; color:#F35632;}
[data-location="guide"] sup {position:relative; display:inline-block; text-align:center; vertical-align:top; width:22px; height:22px; line-height:21px; font-size:13px; color:#000; overflow:hidden; z-index:100;}
[data-location="guide"] sup::before {position:absolute; left:1px; top:0; width:20px; height:20px; border-radius:20px; background-color:rgba(255, 207, 99, 0.7); content:''; z-index:-1;}
[data-location="guide"] thead th,
[data-location="guide"] thead td {border-bottom:solid 1px #66645F;}
[data-location="guide"] ul.ul {/*margin-top:15px;*/ padding-left:20px;}
[data-location="guide"] ul.ul li {position:relative; padding-left:20px; padding-bottom:4px;}
[data-location="guide"] ul.ul li .cardA {margin-top:5px;}
[data-location="guide"] ul.ul-dpth2 > li::after {position:absolute; left:5px; top:0; content:'-';}
[data-location="guide"] ul.ul-dpth3 {margin-top:5px;}
[data-location="guide"] ul.ul-dpth3 > li::after {position:absolute; left:0; top:0; content:'ㆍ';}
[data-location="guide"] ul.ul-dpth4 {margin-top:5px;}
[data-location="guide"] ul.ul-dpth4 > li {padding-left:12px;}
[data-location="guide"] ul.ul-dpth4 > li::after {position:absolute; left:0; top:0; line-height:20px; font-size:11px; color:#999; content:'+';}

[data-location="guide"] #container {margin-left:120px; padding:0 30px 30px 30px; width:calc(100% - 180px);}
[data-location="guide"] #main {padding-top:0; max-width:none;}
[data-location="guide"] #main section#cmm {padding-top:35px !important;}
[data-location="guide"] #nav {background-color:#FFDA56;}
[data-location="guide"] #nav .nav {margin-top:70px; padding-top:0; height:calc(100% - 70px); overflow-y:auto;}
[data-location="guide"] #nav .nav > li {padding-bottom:5px;}
[data-location="guide"] #nav .nav > li > a {height:90px; line-height:135px;}
[data-location="guide"] #nav .nav > li.nav-maintain > a {letter-spacing:-1px;}
[data-location="guide"] #nav .nav li a::before {top:55px; height:30px; line-height:35px; background-color:rgba(102, 100, 95, 0.15);}
[data-location="guide"] #nav .nav li a::after {height:55px; background-color:rgba(102, 100, 95, 0.5);}
/*[data-location="guide"] #nav .nav li a.active {color:#FFDA56;}*/
[data-location="guide"] #nav .nav li a.active::after {background-color:rgba(102, 100, 95, 1.0);}
[data-location="guide"] #nav .nav .nav-cmm a::after {background-image:url("/images/guide/nav-cmm.png");}
[data-location="guide"] #nav .nav .nav-device a::after {background-image:url("/images/guide/nav-device.png");}
[data-location="guide"] #nav .nav .nav-dashboard a::after {background-image:url("/images/guide/nav-dashboard.png");}
[data-location="guide"] #nav .nav .nav-config a::after {background-image:url("/images/guide/nav-set.png");}
[data-location="guide"] #nav .nav .nav-animal a::after {background-image:url("/images/guide/nav-animal.png");}
[data-location="guide"] #nav .nav .nav-feeding a::after {background-image:url("/images/guide/nav-feeding.png");}
[data-location="guide"] #nav .nav .nav-report a::after {background-image:url("/images/guide/nav-reports.png");}
[data-location="guide"].guideAdm #nav .nav .nav-cmm a::after {background-image:url("/images/guide/nav-cmm.png");}
[data-location="guide"].guideAdm #nav .nav .nav-summ a::after {background-image:url("/images/guideAdm/nav-summ.png"); background-position:center;}
[data-location="guide"].guideAdm #nav .nav .nav-server a::after {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23FFDA56' viewBox='0 0 24 24'%3E%3Cpath d='M13 19h-2v2h-4v2h10v-2h-4v-2zm9 2h-4v2h4v-2zm-16 0h-4v2h4v-2zm18-11h-24v7h24v-7zm-3 4.5c-.552 0-1-.448-1-1s.448-1 1-1c.553 0 1 .448 1 1s-.447 1-1 1zm-3 0c-.552 0-1-.448-1-1s.448-1 1-1c.553 0 1 .448 1 1s-.447 1-1 1zm-3 0c-.552 0-1-.448-1-1s.448-1 1-1c.553 0 1 .448 1 1s-.447 1-1 1zm7-6.5h-20l4-7h12l4 7z'/%3E%3C/svg%3E"); background-position:center; background-size:40%;}
[data-location="guide"].guideAdm #nav .nav .nav-gateway a::after {background-image:url("/images/guideAdm/nav-gateway.png"); background-position:center; background-size:33%;}
[data-location="guide"].guideAdm #nav .nav .nav-remote a::after {background-image:url("/images/guideAdm/nav-remote.png"); background-position:center;}
[data-location="guide"].guideAdm #nav .nav .nav-exe a::after {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23FFDA56' viewBox='0 0 24 24'%3E%3Cpath d='M15 10h4l-7 8-7-8h4v-10h6v10zm6 9v5h-18v-5h18zm-6 2h-1v1h1v-1zm2 0h-1v1h1v-1zm2 0h-1v1h1v-1z'/%3E%3C/svg%3E"); background-position:center; background-size:40%;}
[data-location="guide"].guideAdm #nav .nav .nav-maintain a::after {background-image:url("/images/guideAdm/nav-maintain.png");}
[data-location="guide"].guideAdm #nav .nav .nav-ventil a::after {background-image:url("/images/guideAdm/nav-ventil.png");}
[data-location="guide"].guideAdm #nav .nav .nav-cloud a::after {background-image:url("/images/guideAdm/nav-cloud.png");}
[data-location="guide"] #footer > .ctn {text-align:center; height:50px; line-height:50px;}

[data-location="guide"] figure.dsp-ib,
[data-location="guide"] .cts.dsp-ib {float:left; width:auto;}
[data-location="guide"] figure.dsp-ib + .cts.dsp-ib {margin-left:30px; padding-top:15px;}
[data-location="guide"] .pd-0, 
[data-location="guide"] .pd-0 ul.ul > li {padding-left:0 !important;}
[data-location="guide"] .pd-0 .h5.num::after {left:0;}
[data-location="guide"].guideAdm #nav .nav > li > a {letter-spacing:-1px;}
[data-location="guide"].guideAdm .table-list {border-radius:20px; border:solid 4px rgba(201, 191, 173, 0.5);}
[data-location="guide"].guideAdm .table-list thead tr:first-child th, 
[data-location="guide"].guideAdm .table-list thead tr:first-child td {border-top:0;}
[data-location="guide"].guideAdm table th, 
[data-location="guide"].guideAdm table td {border-left:solid 1px rgba(102, 100, 95, 0.3);}
[data-location="guide"].guideAdm table th:first-child, 
[data-location="guide"].guideAdm table td:first-child {border-left:0;}
[data-location="guide"].guideAdm thead th, 
[data-location="guide"].guideAdm thead td {border-bottom:solid 1px rgba(102, 100, 95, 0.3) !important;}
[data-location="guide"].guideAdm table tr.aC td {text-align:center;}
[data-location="guide"].guideAdm table td.innerT {vertical-align:top;}
[data-location="guide"].guideAdm table td.innerT th, 
[data-location="guide"].guideAdm table td.innerT td {vertical-align:top;}
[data-location="guide"].guideAdm table td.innerT tr:last-child th, 
[data-location="guide"].guideAdm table td.innerT tr:last-child td {border-bottom:0;}
[data-location="guide"].guideAdm .device-1 td.innerT {vertical-align:top;}
[data-location="guide"].guideAdm .device-1 td.innerT table th {width:105px;}
[data-location="guide"].guideAdm .device-1 td:nth-child(2) {text-align:center;}
[data-location="guide"].guideAdm .device-1 td.innerT td {text-align:left;}
[data-location="guide"].guideAdm .device-2 td, 
[data-location="guide"].guideAdm .device-3 td {word-break:break-all; white-space:normal;}
[data-location="guide"].guideAdm .device-3 .buttonD {display:inline-block; vertical-align:middle; width:20px; height:20px; line-height:200px; border-radius:20px; background-position:center; background-repeat:no-repeat; background-size:62%; background-color:#00459C; 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='M3 19h18a1.002 1.002 0 0 0 .823-1.569l-9-13c-.373-.539-1.271-.539-1.645 0l-9 13A.999.999 0 0 0 3 19z'/%3E%3C/svg%3E"); overflow:hidden;}
[data-location="guide"].guideAdm .device-3 .buttonD.down {transform:rotate(180deg);}



/*
   * ------------------------------------------------------------------------
   * X-A-Breakpoints
   * ------------------------------------------------------------------------
   */
/*XX-Large devices (larger desktops, 1400px and up)*/
@media (max-width:1400px) {
	
}

/*X-Large devices (large desktops, 1200px and up)*/ /* AGRT-Tablet-1280px */
@media (max-width:1280px) {
	body {overflow:auto !important;}
	h1 {position:fixed; left:0; top:0;}
	[data-location="guide"] h1 {position:fixed; z-index:990;}
	[data-location="guide"] #menuToggle input {position:fixed !important;}
	[data-location="guide"] #main .ctn section:first-child {margin-top:40px;}
	[data-location="guide"] #footer {border-top:solid 2px rgba(91, 98, 122, 0.2); z-index:990;}
}

/*Large devices (desktops, 992px and up)*/
@media (max-width:993px) {
	
}

/*Medium devices (tablets, 768px and up)*/
@media (max-width:769px) {
    [data-location="guide"] h1 {height:85px; border:solid 1px rgba(102, 100, 95, 0.5); background-color:rgba(255, 255, 255, 0.8);}
    [data-location="guide"] h1 > span {margin-top:20px; height:calc(100% - 20px);}
    [data-location="guide"] #container {margin:0; padding:30px 20px; width:calc(100% - 40px);}
    [data-location="guide"] #main {padding-left:0; padding-right:0;}
    [data-location="guide"] #menuToggle input {height:85px; cursor:pointer !important;}
    [data-location="guide"] ul#menu {padding-left:25px; padding-right:25px;}
    [data-location="guide"] ul#menu > li a {font-size:18px;}
    [data-location="guide"] #menuToggle input:checked ~ ul::before {width:150px;}
}

/*Small devices (landscape phones, 576px and up)*/
@media (max-width:578px) {
	
}