@charset "utf-8";

#skipnavi{margin: 0; padding:0;}
#skipnavi a{display:block;overflow:hidden;position:absolute;left:0;top:-10000px;}
#skipnavi a:hover,#skipnavi a:focus,#skipnavi a:active{ padding:15px 0; background:#1e2e46;color:#fff;font-size:120%;width:100%;text-align:center;top:0px;z-index:500; text-indent:0;}

.inner{ width: 100%; max-width: 1300px; margin: 0 auto; text-align: left}
.sub_bg{ background: url(../images/common/sub_bg.jpg) no-repeat 50% 0; position: fixed; width: 100%; z-index: -1; top: 0; display: none}
#header{ background: #fff; border-bottom: 1px solid #bababa; position: absolute; left: 0; top: 0; width: 100%; z-index: 310;}/* 20201204 position: absolute */
#header.fix{ position: fixed; animation: down 1s ease; background: rgba(255,255,255,.9);}
#header .tpLogo{ position: absolute; display: block; margin-top: 20px; background: url(../images/common/ci2.png) no-repeat 0 0; width: 245px; height: 57px; font-size: 0; transition: all .2s; -webkit-transition: all .2s;}
#header.fix .tpLogo{ width: 200px; background-size: 200px auto; top: 5px}
#gnb{ text-align: center}
#gnb>li{ display: inline-block}
#gnb>li>a{ display: block; padding: 40px 20px 30px; line-height: 20px; font-size: 1.45em; font-weight: 500; position: relative; }
#gnb>li>a:after{ content: ''; display: block; width: 0; height: 6px; background: #03a2a4; position: absolute; bottom: 0; left: 0; transition: all .2s; -webkit-transition: all .2s;}
#gnb>li>a:hover:after{ width: 100%;}
#gnb .subGnb{ display: none; position: absolute; left: 0; top: 90px; border-top: 1px solid #ccc; width: 100%; text-align: center; background: #fafafa}
#gnb .subGnb>ul{ width: 260px; margin-left: calc(50% - 1300px / 2); position: relative; z-index: 10; padding: 20px 0 30px; min-height: 450px; border-left: 1px solid #ccc; background: #f5f5f5}
#gnb .subGnb.on>ul{ background: #eee}
#gnb>li:nth-child(2) .subGnb>ul{ margin-left: calc(50% - 1300px / 2 + 260px)}
#gnb>li:nth-child(3) .subGnb>ul{ margin-left: calc(50% - 1300px / 2 + 260px + 260px)}
#gnb>li:nth-child(4) .subGnb>ul{ margin-left: calc(50% - 1300px / 2 + 260px + 260px + 260px);}
#gnb>li:nth-child(5) .subGnb>ul{ margin-left: calc(50% - 1300px / 2 + 260px + 260px + 260px + 260px); border-right: 1px solid #ccc;}
#gnb .subGnb>ul li i, #gnb .subGnb>ul li strong{ display: block;}
#gnb .subGnb>ul li i{ width: 115px; height: 115px; margin: 5px auto 0; border-radius: 50%; background: #03a2a4 url(../images/common/comIcon2020.png); transition: all .2s; -webkit-transition: all .2s; }
#gnb .subGnb.on>ul li i{ background-color: #fff; background-position: 0 -115px}
#gnb>li:nth-child(1) .subGnb>ul li i{ background-position: -463px 0}
#gnb>li:nth-child(1) .subGnb.on>ul li i{ background-position: -463px -115px}
#gnb>li:nth-child(3) .subGnb>ul li i{ background-position: 0 0}
#gnb>li:nth-child(3) .subGnb.on>ul li i{ background-position: 0 -115px}
#gnb>li:nth-child(2) .subGnb>ul li i{ background-position: -116px 0}
#gnb>li:nth-child(2) .subGnb.on>ul li i{ background-position: -116px -115px}
#gnb>li:nth-child(5) .subGnb>ul li i{ background-position: -232px 0}
#gnb>li:nth-child(5) .subGnb.on>ul li i{ background-position: -232px -115px}
#gnb>li:nth-child(4) .subGnb>ul li i{ background-position: -348px 0}
#gnb>li:nth-child(4) .subGnb.on>ul li i{ background-position: -348px -115px}
#gnb .subGnb>ul li strong{ font-size: 1.7em; font-weight: 500; color: #333; margin: 10px 0 25px}
#gnb .subGnb>ul li a{ display: block; text-align: left; padding: 5px 40px; font-size: 1.15em; position: relative; margin: 0 10px; transition: padding .5s ease-out; -webkit-transition: padding .5s ease-out; -moz-transition: padding .5s ease-out;}
#gnb .subGnb>ul li a:before{ content: ''; display: block; width: 5px; height: 5px; background: #23507b; position: absolute; left: 26px; top: 15px}
#gnb .subGnb>ul li a:hover{ background: #03a2a4; color: #fff; transition: padding .5s ease-out, color .15s ease-out; -webkit-transition: padding .5s ease-out, color .15s ease-out; -moz-transition: padding .5s ease-out, color .15s ease-out;}
#gnb .subGnb>ul li a:hover:before{ background: #fff}

#gnb>li:nth-child(5) .subGnb>ul li i{ background-position: -582px 0}
#gnb>li:nth-child(5) .subGnb.on>ul li i{ background-position: -582px -115px}

#header h2{ height: 100%; position: relative; z-index: 1; width: 280px; background: #03a2a4; position: absolute}
#header h2 span{ display: block; font-size: 2.1em; color: #fff; font-weight: 500; padding: 15px 35px 15px 15px; text-align: right;}

.tpRgt{ position: absolute; right: calc(50% - 1300px / 2); top: 28px; text-align: right;}
.tpRgt .tpSch, .tpRgt .allMn{ width: 45px; height: 45px; border-radius: 50%; font-size: 0; margin: 0 0 0 3px; background: #03a2a4; display: inline-block;}
.tpRgt .tpSch:before, .tpRgt .allMn:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -27px 0; width: 20px; height: 20px; text-align: center;}
.tpRgt .tpSch:hover:before{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: rotateIn; animation-name: rotateIn; animation-duration: 0.5s; }
.tpSchLayer{display: none; position: absolute; top: 62px; right: 0;}
.tpSchLayer>div{ width: 500px; background: rgba(0,0,0,.7);  padding: 15px 10px; text-align: center;}
.tpSchLayer>div label{ display: block; font-size: 1.4em; color: #fff; text-align: center; font-weight: 500; line-height: 1.5; padding: 0 0 8px}
.tpSchLayer>div .inputData{ background: #fff; height: 42px; width: 75%}
.tpSchLayer>div .btnClose{ position: absolute; right: 28px; left: auto; top: -62px; width: 45px; height: 45px; border-radius: 50%; font-size: 0; background: #494949;}
.tpSchLayer>div .btnClose:before{ font-size: 20px;}
.tpRgt .allMn:before{ background-position: -50px 0; width: 21px}
.tpRgt .allMn{ background: #23507b}
#allNav .allMenu{ display: none; position: fixed; width: 100%; height: 100%; background: rgba(15,51,86,1); left: 0; top: 0; overflow-y: auto; z-index: 10}
#allNav.active .allMenu{ display: block}
#allNav .tpMember{  display: inline-block; position: relative; top: -45px; right: 110px;}
#allNav .tpMember.afterL{ right: 110px}
#allNav .tpMember a{ display: inline-block; line-height: 45px; margin: 0 5px; font-size: 1.02em; font-weight: 400}
#allNav .tpMember a.mypage:before{ content: ''; display: inline-block; background:  url(../images/common/icon2020.png) no-repeat -138px -20px; width: 25px; height: 25px; vertical-align: middle; margin-right: 5px}
.mypageLayer{ display: none; position: absolute; right: 0; top: 0}
.mypageLayer>div{ width: 200px; background: #f1f4f7; border: 1px solid #38444a; border-radius: 10px}
.mypageLayer>div>strong{ display: block; margin: 0 20px; padding: 8px 0 6px; font-size: 1.4em; color: #38444a; border-bottom: 1px solid #38444a; text-align: left}
.mypageLayer>div ul{ margin: 0 20px 10px; padding: 8px 0 0}
#allNav .tpMember .mypageLayer>div ul li a{ display: block; text-align: left; line-height: 30px; margin: 0}
#allNav .tpMember .mypageLayer>div ul li a:before{ content: ''; display: inline-block; width: 5px; height: 5px; background: #23507b; margin-right: 5px; vertical-align: middle}
#allNav .tpMember .mypageLayer>div  .btnLogout{ display: block; background: #38444a; text-align: center; color: #fff; border-radius: 0 0 10px 10px; width: 100%; padding: 8px 0}
#allNav .tpMember .mypageLayer>div  .btnLogout:after{ content: ''; display: inline-block; background:  url(../images/common/icon2020.png) no-repeat -159px 0; width: 17px; height: 17px; vertical-align: middle; margin: -3px 0 0 5px}
#allNav .tpMember .mypageLayer>div .btnClose{ left: auto; right: -10px; top: 5px; width: 40px; height: 40px}
#allNav .tpMember .mypageLayer>div .btnClose:before{ color: #38444a; font-size: 20px;}
#allNav .allMenu>strong{ display: block; font-size: 2.5em; color: #fff; text-align: center; padding: 100px 0 0;}
#allNav .allMenu>ul{ max-width: 1300px; width: 100%; margin: 0 auto; border-top: 1px solid #fff; margin-top: 20px; padding-top: 10px;}
#allNav .allMenu>ul>li{ float: left; width: 18%; vertical-align: top; text-align: left; margin: 0 1%; min-height: 500px}
#allNav .allMenu>button, .btnClose{ position: absolute; top: 30px;left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); font-size: 0; background:transparent; width: 50px; height: 50px;}
#allNav .allMenu>button:before, .btnClose:before{ content: '\2573'; display: inline-block; font-size: 25px; font-weight: 600; color: #fff; transition: all .2s; -webkit-transition: all .2s;}
#allNav .allMenu>button:hover:before, .btnClose:hover:before{ transform: rotate(180deg)}
#allNav .allMenu ul ul{ display: block; margin: 10px 0 0}
#allNav .allMenu>ul>li>a{ display: block; font-size: 1.5em; color: #000; font-weight: 500; text-align: center;  padding: 6px 0; background: #12b8ba; cursor: auto;  pointer-events: none;}
#allNav .allMenu li li a{ display: block; font-size: 1.2em; color:#fff; padding: 8px 10px; border-bottom: 1px solid rgba(255,255,255,.1);}
#allNav .allMenu ul ul ul{  display: none; margin: 0; background: rgba(255,255,255,.1)}
#allNav .allMenu li li li a{ border: 0; font-size: 1em; padding: 10px 20px}

/* 마이페이지 레이어 */
#allNav .tpMember a.mypage{ font-size: 0; margin: 0}
#allNav .tpMember a.mypage:before{ background-position: 0 -132px; width: 47px; height: 48px;}
.mypageLayer{ display: none; position: absolute; right: 0; top: 0; padding-top: 63px}
.mypageLayer .afterClear{ width: 400px; background: #23507b; border: 1px solid #23507b; border-radius: 0; padding: 20px}
.mypageLayer .afterClear>div, .mypageLayer .afterClear>ul{ float: left; width: 200px; text-align: left; margin: 0}
.mypageLayer .afterClear>ul{ border-left: 1px solid #2e7cbb; box-sizing: border-box; padding: 0;}
#allNav .tpMember .mypageLayer>div ul li a{ color: #00e4ff; padding: 3px 10px; font-weight: 300}
#allNav .tpMember .mypageLayer>div ul li a:before{ background: #fff; margin: 0 10px}
.mypageLayer .afterClear>div p{ font-size: 1em; color: #fff;  margin-bottom: 10px}
.mypageLayer .afterClear>div p strong{ font-size: 1.25em;}
#allNav .mypageLayer .afterClear>div a{ display: block; color: #fff; font-size: 1em; font-weight: 300; line-height: 30px; margin: 0}
#allNav .mypageLayer .afterClear>div a:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -280px -93px; width: 12px; height: 15px; margin: 0 10px 0 0}
#allNav .mypageLayer .afterClear>div a.logout:before{ background-position: -295px -93px; width: 14px}
#allNav .tpMember .mypageLayer>div .btnClose{ background: #23507b; width: 55px; height: 63px; right: -28px; top: 0}
#allNav .tpMember .mypageLayer>div .btnClose:before{ color: #fff}

.locArea{ width: 100%; position: relative; background:#3086c9; margin-top: 90px}
.locArea>div{ max-width: 1300px; width: 100%; height: 50px; margin: 0 auto; position: relative; text-align: right}
.locArea>div h3{ position: absolute; right: 0; top: 0; color: #fff; font-size: 1.85em; font-weight: 500; line-height: 60px}
.locArea .inner>a, .locArea .inner>strong{ display: inline-block; vertical-align: top; position: relative; padding: 0 20px; line-height: 45px; color: #fff}
.locArea .inner>a:before,  .locArea .inner>strong:before{ content: ''; display: block; width: 1px; height: 15px; position: absolute; left: 0; top: 17px; background: rgba(255,255,255,.5)}
.locArea .inner>a:first-child{ width: 40px; text-align: center; height: 100%; position: relative; font-size: 0; padding: 0 5px;}
.locArea .inner>a:first-child:before{ content: ''; display: block; position: absolute; left: 50%; transform: translateX(-50%); top: 15px; background: url(../images/common/icon2020.png) no-repeat -26px -24px ; width: 19px; height: 17px;}
.locArea .inner>ul{ float: left; width: calc(100% - 65px);}
.locArea .inner>ul>li{ float: left; position: relative;}
.locArea .inner>ul>li>button{ background: transparent; display: block; font-size: 18px; font-weight: 400; color: #fff; height: 60px; text-indent: 15px;  position: relative; padding-right: 100px}
.locArea .inner>ul>li>button:after{ content: ''; display: block; position: absolute; right: 20px; top: 20px; background: url(../images/common/icon2020.png) no-repeat -106px 0; width: 25px; height: 20px;}
.locArea .inner>ul>li.active>button:after{ background-position: -132px 0}
.locArea .inner ul ul{ position: absolute; top: 50px; display: none; background: #fff; width: 100%; border: 1px solid #0c3257; box-sizing: border-box; z-index: 10}
.locArea .inner li li a{ display: block;  font-size: 1.1em; padding: 8px 15px;  transition: all .2s; -webkit-transition: all .2s;}
.locArea .inner li li a:hover{ background: #f2f5f8}
.locArea .inner li li:last-child a{ border-bottom: 0}
.locArea .inner>ul li.active ul{ display: block}

#content{ background: #fff; width: 100%; max-width: 1300px; margin: 0 auto; position:relative}
#content:after{ content: ''; display: block; clear: both}
#content>.innerCont{ padding: 25px 0 100px 280px; position: relative; min-height: 700px}
#content.wide>#totalSch{ padding-left: 0}
#content>.innerCont h1{ font-size: 2.2em; font-weight: 500; border-bottom: 1px solid #e0e0e0; margin-bottom: 30px; padding: 10px 0 15px;}
#content>.innerCont .innerContPrt{ position: absolute; right: 0; top: 30px; width: 55px; height: 55px; border-radius: 50%; background: #3086c9; font-size: 0}
#content>.innerCont .innerContPrt:before{ content: ''; display:inline-block; background: url(../images/common/icon2020.png) no-repeat -104px -21px; width: 32px; height: 32px;}
#content>.innerCont h1 strong, #content>.innerCont h1 span{ display: block; color: #fff}
#content>.innerCont h2{ font-size: 1.4em; font-weight: 500; margin: 0 0 8px}
#content>.innerCont h2:before{ content: ''; display: block; width: 20px; height: 3px; background: #3086c9; margin: 0 0 0 2px;}
#content>.innerCont h2 span{ display: inline-block; font-size: 0.75em !important; font-weight: 300 !important; margin-left: 15px; line-height: 50px; padding: 0 15px; font-size: 0.9em; font-weight: 500; position: relative; z-index: 1}
#content>.innerCont h2.refer{ text-align: center; position: relative; margin-top: 1.5em}
#content>.innerCont h2.refer:before{ content: ''; display: block; width: 100%; height: 1px; background: #599ed4; position: absolute; top: 50%; left: 0;}
#content>.innerCont h2.refer span{ display: inline-block; background: #f2f5f8; border: 1px solid #d2d2d2; border-left: 2px solid #599ed4; border-right: 2px solid #599ed4; color: #3086c9; margin: 0; line-height: 1.5; padding: 15px}
#content>.innerCont h3{ margin: 10px 0; font-size: 1.3em; font-weight: 500; position: relative; padding-left: 25px}
#content>.innerCont h3:before, #content>.innerCont h3:after{ content: ''; display: block; position: absolute; left: 0; top: 10px; width: 12px; height: 12px; background: #008d8f; border-bottom: 1px solid #015f60}
#content>.innerCont h3:after{ width: 6px; height: 6px; background: #12b8ba; border: 0}

.lftArea{ position: absolute; width: 250px; margin-top: -30px; z-index: 1; overflow: hidden; padding-bottom: 1px;}
.lftArea>h2{ background: #23507b; text-align: center; padding-top: 55px; height: 75px; color: #fff; font-size: 1.6em; font-weight: 500; margin-bottom: 1px}
.lftArea>h2 span{ width: 0; height: 0; overflow: hidden; font-size: 0}
.lftArea>h2.comp{ position: relative}
.lftArea>h2.comp span{ overflow: inherit; width: auto; height: auto; position: absolute; font-size: 0.58em; font-weight: 300; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); margin-top: -25px; letter-spacing: 0; color: #9ed5ff; border-bottom: 1px solid rgba(255,255,255,.6); padding: 0 25px 3px}
.lftArea>ul>li>a{ display: block; background: #fff; border: 1px solid #cacaca; margin-bottom: -1px; padding: 15px; font-size: 1.1em; color: #323232; font-weight: 400; position: relative; cursor: pointer; transition: all .2s; -webkit-transition: all .2s; }
.lftArea>ul>li.has-sub>a:after, .lftArea ul ul>li.has-sub>a:after{ content: ''; display: block; position: absolute; right: 15px; top: 22px; background: url(../images/common/icon2020.png) no-repeat -75px -32px; width: 12px; height: 12px}
.lftArea>ul>li.has-sub.open>a, .lftArea>ul>li.active>a{ background: #3086c9; border-color: #3086c9; color: #fff}
.lftArea>ul>li.has-sub.open>a:after, .lftArea ul ul>li.has-sub.open>a:after{ background-position: -91px -32px}
.lftArea ul ul{ display: none;}
.lftArea ul ul{ border: 1px solid #cacaca; border-top: 0; background: #f4f4f4; padding: 10px 0; margin-bottom: -1px}
.lftArea ul ul ul{ border: 0; border-top: 1px solid #cacaca; padding: 0 0 10px; background: #e0e0e0;}
.lftArea ul ul>li>a{ display: block; padding: 6px 20px 4px 30px; position: relative; word-break: keep-all; cursor: pointer;}
.lftArea ul ul>li.has-sub>a:after{ content: '\002B'; background: none; top: 8px; line-height: 1}
.lftArea ul ul>li.has-sub.open>a:after{ content: '\002D'; }
.lftArea ul ul>li>a:before{ content: ''; display: block; position: absolute; left: 15px; top: 18px; width: 6px; height: 2px; background: #7e7e7e}
.lftArea ul ul>li>a:hover, .lftArea ul ul>li>a.active{ color: #3086c9; font-weight: 500}
.lftArea ul ul>li>a:hover:before{ background: #3086c9}
.lftArea ul ul ul>li>a{ font-size: 0.95em}
.lftArea ul ul ul>li>a:hover{ color: #000}
.lftArea ul ul ul>li>a:before{ display: none}

#content.nonLftArea .lftArea h2, #content.nonLftArea .lftArea>ul{ display: none !important}
#content.nonLftArea>.innerCont{ padding-left: 0; transition: all .2s; -webkit-transition: all .2s;}
.lftArea>button[type='button']{ position: absolute; left: 0; top: 0; background: #123a61; color: #fff; font-size: 0.85em; line-height: 30px; padding: 0 20px 0 10px; z-index: 1}
.lftArea>button[type='button'].close:before{ content: '\276E'; display: inline-block; margin: 0 7px 0 10px; }
.lftArea>button[type='button'].close:after{ content: ''; display: block; width: 60px; height: 60px; transform: rotate(-45deg); position: absolute; right: -30px; top: -42px; background: #123a61; z-index: -1}
.lftArea>button[type='button'].open{ display: none}
#content.nonLftArea .lftArea{ overflow: inherit; }
#content.nonLftArea .lftArea>button[type='button'].close{ display: none}
#content.nonLftArea .lftArea>button[type='button'].open{ display: block; padding: 0 15px}
#content.nonLftArea .lftArea>button[type='button'].open:before{ content: ''; display: block; width: 250px; height: 3px; background: #123a61; position: absolute; bottom: 0}
#content.nonLftArea .lftArea>button[type='button'].open:after{ content: '\276F'; display: inline-block; margin: 0 10px}
.lftArea>button[type='button'].close:before, #content.nonLftArea .lftArea>button[type='button'].open:after{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: headShake; animation-name: headShake; animation-duration: 1s; animation-iteration-count: infinite;}
#content.nonLftArea>.innerCont h1{ text-align: center}

/* 게시물 건수 및 게시물 보기 선택 */
.afterClear .totalList{ margin-top: 8px}
.totalList{ padding-left: 40px; line-height: 30px; position: relative; font-size: 1.03em}
.totalList:before{ content: ''; display: block; background: url(../images/common/icon2020.png) no-repeat -74px 0; width: 30px; height: 30px; position: absolute;  left: 5px;}
.vewNumChk { margin: 0 0 5px; }
.vewNumChk select{ width: 130px}
.vewNumChk .button.small{ padding: 0 25px; margin-left: -3px}

/* 검색박스 영역 */
.searchBox{ background: #fff; border-top: 1px solid #12b8ba; position: relative; padding: 20px 0 15px;}
.searchBox.boxH1{ padding: 10px 20px; border-bottom: 1px solid #12b8ba;}
.searchBox.boxH1 label{ margin: 0 15px}
.searchBox ul li{ margin: 0 0 5px; display: inline-block; line-height: 42px; vertical-align: top;}
.searchBox ul>li.w45{ width: 50%; margin-right: -5px}
.searchBox ul>li.w25{ width: 25%; margin-right: -5px}
.searchBox label.dotL{ line-height: 40px; box-sizing: border-box}
.searchBox label.dotL:before{ top: 45%; left: 5px; width: 4px; height: 4px}
.searchBox label input[type='checkbox'], .searchBox label input[type='radio']{ margin: 0 5px 0 15px}
.searchBox .inputData{ height: 42px; }
.searchBox .btnArea{ border-top: 1px solid #12b8ba; margin-top: 10px}
.searchBox .btnArea button{ margin: 0 -1px; width: 50%; height: 50px; line-height: 50px}
.searchBox.boxH1 .button{ font-size: 1em}
.searchBox.boxH1>.button{ position: absolute; bottom: 15px; right: 20px}
.searchBox.searchBoxR{ border-bottom: 1px solid #12b8ba; padding: 10px 0 5px;}
.searchBox.searchBoxR ul{ padding-right: 130px; box-sizing: border-box}
.searchBox.searchBoxR .btnArea{ position: absolute; right: 0; top: 5px; border: 0; margin: 0}
.searchBox.searchBoxR .btnArea .button{ display: block; width: 130px; padding: 0; margin: 3px 0; text-align: center}
.searchBox.searchBoxR .btnArea.hLine2 .button{ height: 100px}
.searchBox.pes_dtlSch label.dotL input{ margin: 0 0 0 10px; width: 20px; height: 20px;}
.searchBox.pes_dtlSch label.dotL+.inputData{ width: calc(100% - 100px - 15px)}
.searchBox.pes_dtlSch .cropNm{ background: #edf7f7; padding: 8px 0; margin: 5px 0 0}
.searchBox.pes_dtlSch .cropNm .inputData{ background: rgba(255,255,255,.8)}
.searchBox.pes_dtlSch .cropNm .dotL.w90p{ margin-left: 10px}
.searchBox.pes_dtlSch .cropNm .dotL.w90p+.inputData{ width: calc(100% - 90px - 20px)}
.searchBox.pes_dtlSch .btnArea{ margin-top: 2px}

/* 버튼 스타일 */
.btnArea{ margin: 20px 0 30px; text-align: center}
.btnArea:after{ content: ''; display: block; clear: both}
.btnArea .fl, .btnArea .fr{ margin: 0 0 5px}
.btnArea .fl .button, .btnArea .fr .button{ margin: 0 0 3px}
.button,
.button *{ position:relative; margin:0 2px; padding:0; display:inline-block; text-decoration:none !important; border:0; white-space:nowrap; vertical-align:top; overflow:visible; cursor: pointer; color: #fff; background: #23507b;  box-sizing: border-box;}
.button.small{ height:42px; line-height:38px; font-size: 0.9em; padding:0 20px; font-weight: 300;}
.button.medium{ height:60px; line-height:60px; font-size: 1.05em; padding:0 50px; font-weight: 400;}
.button.large{ height: 50px; line-height: 50px; font-size: 18px; padding:0 30px; font-weight: 300;}
.button.colorGray{ background: #d2d2d2; color: #000;}
.button.colorblue{ background: #3086c9}
.button.colorJade{ background: #12b8ba; color: #fff}
.button.colorRed{ background: #ee5a5a; color: #fff}
.button.colorWhite{ background: #fff; color: #323232; border: 1px solid #0f0f0f}
.button.colorBlack{ background: #000; color: #fff;}
.button.icon:before, .button.icon:after{ content: ''; display: inline-block; vertical-align: middle; background: url(../images/common/icon2020.png) no-repeat; position: relative; top: -2px; left: -5px}
.button.icon:after{ left: auto; right: -5px}
.button.icon.reset:before{ background-position: -48px -24px; width: 23px; height: 20px;}
.button.icon.search:before{ background-position: -27px 0; width: 20px; height: 20px;}
.button.icon.list:before{ background-position: 0 -14px; width: 12px; height: 13px;}
.button.icon.download:before{ background-position: -91px -63px; width: 13px; height: 14px;}
.button.icon.download2:before{ background-position: -91px -79px; width: 13px; height: 14px;}
.button.icon.delete:before{ content: '\2573'; font-size: 14px; color: #000; background: none}
.button.icon.blank:before{ background-position: -74px -63px; width: 14px; height: 14px;}
.button.icon.blank2:before{ background-position: -74px -79px; width: 14px; height: 14px;}
.button.icon.pen:before{ background-position:  -12px -14px; width: 12px; height: 12px;}
.button.icon.prevW:before{ background-position:  0 -29px; width: 12px; height: 14px;}
.button.icon.nextW:after{ background-position:  -12px -29px; width: 12px; height: 14px;}
.button.icon.prevB:before{ background-position:  0 -45px; width: 12px; height: 14px;}
.button.icon.nextB:after{ background-position:  -12px -37px; width: 12px; height: 14px;}
.button.font0.icon{ font-size: 0; color: transparent; margin: 0 0 0 -4px; padding: 0 10px 0 18px;}
.button.font0.icon:before{ top: 0;}
.button.targetB, .button.targetW{ padding: 0 10px}
.button.targetB[target='_blank']:after{ background:  url(../images/common/icon2020.png) no-repeat -74px -79px; width: 14px; height: 14px;  display: inline-block; margin-left: 7px}
.button.targetW[target='_blank']:after{ content: ''; background: url(../images/common/icon2020.png) no-repeat -74px -63px; width: 14px; height: 14px;  display: inline-block; margin-left: 7px}
.button.icon.preview:before{ background-position: -266px -149px; width: 19px; height: 13px}

/* 파일찾기 영역 */
.fileUpload, .multifileUpload{ position: relative; display: inline-block; min-width: 30%}
.fileUpload label, .multifileUpload label{ position:relative; cursor:pointer; display:inline-block; vertical-align:middle; overflow:hidden; width:100%; height:40px; color:#fff; text-align:center; line-height:40px; padding: 0}
.fileUpload label span, .multifileUpload label span{ position: absolute; right: 0; top: 0; background: #eee; color: #000; border: 1px solid #a3aab8; width: 100px; height: 40px; line-height: 40px; font-size: 0.9em; padding: 0 15px; font-weight: 300; border-radius: 0 3px 3px 0; box-sizing: border-box}
.fileUpload label input, .multifileUpload label input{ display: block; position:absolute; width:calc(100% - 100px); height:100%; overflow:hidden; border: 0; background: transparent; left: 0; top: 0; opacity: 0}
.fileUpload input[type=text], .multifileUpload input[type=text]{ position: absolute; left: 0; top: 0; vertical-align:middle; display: block; width: calc(100% - 100px); height:40px; line-height:40px; border:1px solid #d3d3d3; border-right: 0; box-sizing: border-box}

/* 반응형 테이블 */
table th, table td{ word-break: break-all;}
.default_table{ border-spacing: 0; table-layout: fixed; display: table; margin-bottom: 10px; width: 100%; border-collapse: collapse; background-color: transparent;}
.default_table tr{ transition: transform .3s ease,visibility .3s ease,opacity .3s ease,-webkit-transform .3s ease;}
.default_table thead tr:first-child th{ background: #f1f4f7; border-top: 2px solid #23507b;color:#323232;}
.default_table thead th{ padding: 17px 5px; background:#f1f4f7; border-left:1px solid #23507b; border-bottom:1px solid #23507b; color:#323232; font-size: 1.03em; text-align: center; font-weight: 400}
.default_table tbody th{ background-color:#fff;line-height:1.2;color:#333;}
.default_table tbody td{ border-left:1px solid #d3d3d3; color:#666; text-align: center; background: #fff}
.default_table tbody th, .default_table tbody td{ padding: 10px; border-bottom: 1px solid #d3d3d3;}
.default_table tbody th:nth-child(2){ border-left:1px solid #d3d3d3; }
.default_table thead th:first-child, .default_table tbody td:first-child{ border-left: 0}
.default_table thead th.txt_al, .default_table tbody td.txt_al, .default_table tbody.txt_al td{ text-align: left}

.default_table tbody td .inputData{ height: 42px; background: #f9f9f9; margin: 0}
.default_table tbody td .txtIcon{ font-size: 0.95em; color: #000; margin-bottom: 0}
.default_table tbody tr.trDataCheck{ border: 2px solid #23507b}
.default_table tbody tr.trDataCheck td[data-cell-header='선택'] button{ background: #3086c9; color: #fff}
.default_table tbody tr.trDataCheck td[data-cell-header='업체명']{ font-size: 1.3em;  font-weight: 600; }
.default_table tbody tr.trDataCheck td{ font-weight: 400; color: #23507b}

.default_table thead th:first-child.lfborth{border-left:1px dotted #ccc;}
.default_table tbody td:first-child.lfborth{border-left:1px solid #e1e1e1;}

/* 스크롤링 테이블 */
.gridScroll{ width: 100%; overflow: hidden; overflow-x: auto;}
.gridScroll table{ width: 1300px; margin: 0}
.gridScroll table .orderTr:after{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -26px -48px; width: 10px; height: 12px; margin-left: 5px; vertical-align: middle}
.gridScroll table .orderTr.ASC:after{ transform: rotate(180deg)}
.gridScroll table .orderTr.DESC:after, .gridScroll table .orderTr.ASC:after{ background-position: -37px -48px; width: 10px; height: 6px;}
.gridScroll table td .button.small{ padding: 0 13px; margin: 0 2px 2px;}

.gridScroll.gridPes .default_table thead tr:first-child th{ padding: 12px 2px}
.gridScroll.gridPes .default_table thead th, .gridScroll.gridPes .default_table tbody th, .gridScroll.gridPes .default_table tbody td{ font-size: 0.92em; padding: 7px 2px}
.gridScroll.gridPes .default_table thead th{ padding: 3px 2px; font-weight: 500}

.detailGrid>ul{ border-top: 1px solid #515151;}
.detailGrid>.necessary{ margin: -35px 0 10px; font-size: 16px; text-align: right;}
.detailGrid>ul li{ display: table; width: 100%;}
.detailGrid>ul li.empth{ border-top: 1px solid #515151; margin-top: 10px}
.detailGrid>ul li.temS{ margin-top: 20px; display: block}
.detailGrid>ul li.temS>label{ display: block; line-height: 40px; font-weight: 400}
.detailGrid>ul li>div{ display: table-cell; padding: 5px 10px; border-top: 1px solid #fff; border-bottom: 1px solid #afafaf; font-size: 16px; vertical-align: middle}
.detailGrid>ul li>div:nth-child(odd){ background: #eaf0f3; color: #333; font-weight: 400; width: 20%; vertical-align: top; line-height: 1.3; display: table-cell;}
.detailGrid>ul li>div .inputData{ height: 42px}
.detailGrid>ul li>div label{ line-height: 40px}
.detailGrid>ul li>div textarea.inputData{ height: auto}
.detailGrid>ul li.temS .gridScroll{ display: block; padding: 0}
.detailGrid>ul li.temS .gridScroll .default_table thead th, .detailGrid>ul li.temS .gridScroll .default_table tbody td{ border: 1px solid #afafaf;}
.detailGrid>ul li.temS .default_table thead tr:first-child th{ border-top-color: #23507b}
.detailGrid>ul li.temS .default_table tr:last-child td{ border-bottom: 0}
.detailGrid>ul li.temS .gridScroll .default_table thead th{ border-bottom: 0}

.default_table td a, .gridScroll table td a, .detailGrid>ul li a{ display: inline-block; text-decoration: underline; font-weight: 400}
.gridInLayer{ position: relative; overflow-y: inherit}
.gridInLayerOp{ color: #000; font-weight: 500 !important; background: none; text-decoration: underline}
.gridInLayerOp+.inLayerOp{ display: none; position: absolute; left: 0; top: 0; background: #23507b; width: 100%; padding: 5px; box-sizing: border-box; z-index: 1;}
.gridInLayerOp+.inLayerOp>div{ background: #fff; padding: 0 15px;  height: 100%;}
.gridInLayerOp+.inLayerOp>div .inLayerOp_tl{ display: inline-block; background: #23507b; padding: 8px 25px 12px; font-size: 1.25em; color: #fff; font-weight: 500}
.gridInLayerOp+.inLayerOp>div>p{ background: #f1f4f7; padding: 10px 15px; text-align: left; margin-top: 15px}
.gridInLayerOp+.inLayerOp>div>ul{ margin: 15px 10px !important; text-align: left}
.gridInLayerOp+.inLayerOp>div ul li span:before{ content: '\260E'; display: inline-block; margin: 0 5px 0 20px}
.gridInLayerOp+.inLayerOp>div .depthP li ul{ margin-top: 5px}
.gridInLayerOp+.inLayerOp>div .inLayerClose{ background: #23507b; padding: 10px 15px 8px; font-size: 1em; color: #fff;}

/* 통합검색 */
#totalSch .schBox{ background: #fff; text-align: center; padding: 20px 0; position: relative; border: 1px solid #03a2a4;}
#totalSch .schBox span, #totalSch .schBox .totalSch_sch, #totalSch .schBox button{ display: inline-block; vertical-align: middle;}
#totalSch .schBox span{ font-size: 1.1em; color: #48657f; margin-right: 20px}
#totalSch .schBox span strong{ font-size: 1.2em; color: #000; margin-left: 5px}
#totalSch .schBox .totalSch_sch{ position: relative; background: rgba(3, 162, 164, .15); height: 45px; border-radius: 45px; padding: 0 50px 0 25px; line-height: 45px}
#totalSch .schBox .totalSch_sch input[type='text']{ background: transparent; line-height: 45px; border: 0; width: 325px; font-weight: 500; font-size: 16px; position: relative; z-index: 10}
#totalSch .schBox .totalSch_sch button{ background: url(../images/common/search.png) no-repeat 40% 50%; position: absolute; width: 40px; height: 45px;; right: 10px; top: 0; font-size: 0; cursor: pointer; z-index: 2}
#totalSch .schBox .totalSch_sch button:hover{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: rotateIn; animation-name: rotateIn; animation-duration: 0.5s;}
#totalSch .detaiBtn{ background: #03a2a4; line-height: 45px; font-size: 16px; color: #fff; padding: 0 25px 0 20px; border-radius: 45px; transition: all .2s; -webkit-transition: all .2s;}
#totalSch .detaiBtn:before{ content: ''; display: inline-block; width: 0; height: 0; border-top: 5px solid #fff; border-left: 4px solid transparent; border-right: 4px solid transparent; position: relative; top: -2px; margin-right: 5px}
.detailSchBox{ display: none; border: 1px solid #e7e7e7; border-top-color: #266cad; margin-top: -1px; padding: 15px 40px 0; position: relative}
.detailSchBox>ul{ border-bottom: 1px solid #e7e7e7; }
.detailSchBox>ul li{ margin-left: 200px; }
.detailSchBox label{ display: inline-block; font-size: 16px; width: 135px; text-align: left; vertical-align: top}
.detailSchBox label:before{ content: ''; display: inline-block; width: 5px; height: 5px; background: #276cc3; vertical-align: middle; margin-right: 5px; position: relative; top: -2px}
.detailSchBox>ul li .inputData{ height: 35px; width: 60%}
.detailSchBox>ul li .inputData.hasDatepicker{ width: 20%}
.detailSchBox>ul li .inBlock{ display: inline-block; width: 60%}
.detailSchBox>ul li>div .inputData{ width: 100%}
.detailSchBox>ul li>div p{ font-size: 15px; margin: 5px 0 20px; line-height: 1.5}
.detailSchBox>ul li>div p span{ display: inline-block; margin-left: 20px; color: #25539d}
.detailSchBox>ul li>div p span:before{ content: '예'; display: inline-block; width: 22px; height: 22px; border-radius: 50%; font-size: 12px; background: #09b54f; color: #fff; text-align: center; line-height: 22px; margin-right: 5px}
.detailSchBox>ul li>div p:last-child{ margin-bottom: 5px}
.detailSchBox .button{ border-radius: 0}
.detailSchBox .btnArea{ margin: 20px 0}
.detailSchBox .detailSchClose{ position: absolute; right: 20px; top: 20px; background: none; font-size: 0; color: #000; width: 30px; height: 30px; transition: all .2s; -webkit-transition: all .2s;}
.detailSchBox .detailSchClose:before{ content: '\2573'; display: inline-block; font-size: 18px;}
.detailSchBox .detailSchClose:hover{ transform:rotate(180deg)}
.schWrap{ margin-top: 30px}
.schWrap .schMenu{ margin: 15px 0}
.schWrap .schMenu>li{ text-align: center; float: left; width: 17%;}
.schWrap .schMenu>li:first-child, .schWrap .schMenu>li:last-child{ width: 16%}
.schWrap .schMenu>li>a, .schWrap .schMenu2 li a{ display: block; border: 1px solid #c5c5c5; background: #f2f2f2; line-height: 45px; font-size: 16px; color: #000; margin-left: -1px}
.schWrap .schMenu>li.active>a{ background: #003f71; border-color: #003f71; color: #fff; font-weight: 500}
.schWrap .schMenu2{ margin: 15px}
.schWrap .schMenu2 li{ display: inline-block; margin-bottom: 3px}
.schWrap .schMenu2 li a{ background: #fff; line-height: 35px; font-size: 15px; margin: 0 5px 0 0; padding: 0 20px; border-radius: 5px}
.schWrap .schMenu2 li.active a{ background: #09b54f; border-color: #09b54f; font-weight: 400}
.connWord{ margin: 15px;}
.connWord strong, .connWord ul{ display: inline-block; font-size: 16px;}
.connWord ul li{ display: inline-block; margin-left: 10px}
.connWord ul li:before{ content: ''; display: inline-block; width: 1px; height: 15px; background: #ccc; margin: 0 5px; vertical-align: middle}
.connWord ul li a{ font-size: 15px; padding: 0 15px}
.schResult_cont{ border-top: 1px solid #c7c7c7;}
.schResult_cont .schContent{ float: left; width: calc(100% - 250px); position: relative; box-sizing: border-box; border-right: 1px solid #c7c7c7; padding: 20px 30px 0 0}
.schResult_cont .schContent .result_counter{ font-weight: 300; font-size: 1.3em; margin: 0 0 30px}
.schResult_cont .schContent .result_counter strong, .schResult_cont .schContent .result_counter em{ color: #0a70b9; font-weight: 600; font-size: 1.2em}
.schResult_cont .schContent .result_counter strong:before, .schResult_cont .schContent .result_counter strong:after{ content: '\201C'; display: inline-block;}
.schResult_cont .schContent .result_counter strong:after{ content: '\201D';}
.schResult_cont .schContent .keyword{ color: #ee5a5a !important}
.schResult_cont .schContent .sch_tpBtn{ position: absolute; right: 30px; top: 20px}
.schResult_cont .schContent .sch_tpBtn a{ display: inline-block; border: 1px solid #d3d3d3; line-height: 30px; font-size: 1em; color: #000; padding: 0 20px}
.schResult_cont .schContent .sch_tpBtn a.active{ border-color: #0a70b9; color: #0a70b9; font-weight: 400}
#content>.innerCont .schResult_cont .schContent h2{ color: #000; padding-left: 0; font-weight: 500; font-size: 1.5em}
#content>.innerCont .schResult_cont .schContent h2:before{ display: none}
.schResult_cont .schContent h2 span{ display: inline-block; margin-left: 10px; font-size: 15px; font-weight: 300}
.schResult_cont .schContent h2 span:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -260px -93px; width: 12px; height: 14px; margin-right: 5px}
.schResult_cont .schContent h2 span strong{ color: #0a70b9}
.schResult_cont .schContent .sch_list{ border-bottom: 1px solid #aaa; margin-bottom: 20px; }
.schResult_cont .schContent .sch_list>li{ margin-top: 15px; padding-bottom: 15px; border-bottom: 1px dashed #ccc;}
.schResult_cont .schContent .sch_list>li:last-child{ border: 0}
.schResult_cont .schContent .sch_list>li dl{ position: relative}
.schResult_cont .schContent .sch_list>li dt{ font-size: 1.1em; font-weight: 500; color: #323232; margin: 0 0 8px}
.schResult_cont .schContent .sch_list>li dt a:hover{ text-decoration: underline}
.schResult_cont .schContent .sch_list>li dd .schListCont{ display: block; font-size: 1em; color: #686868; height: 80px; overflow: hidden; line-height: 1.6;}
.schResult_cont .schContent .sch_list>li dd .date{ position: absolute; right: 0; top: 0; color: #686868; }
.schResult_cont .schContent .sch_list>li dd .path{ position: absolute; right: 0; bottom: 0; color: #0a70b9; height: auto; bottom: -15px; color: #000; height: auto; width: 100%; text-align: right; background: #f8f8f8; padding: 5px; box-sizing: border-box;}
.schResult_cont .schContent .sch_list>li dd .fileArea a{ font-size: 1em; color: #000}
.schResult_cont .schContent .sch_list>li dd .fileArea button{ background: #eee; border: 1px solid #0a70b9; font-size: 0.95em; color: #000; padding: 0 15px; line-height: 25px; margin-left: 10px}
.schResult_cont .schContent .button{ border-radius: 0}
.schResult_cont .schContent .btnArea .button:after{ content: '\002B'; display: inline-block; margin-left: 5px}
.schResult_cont .schRgt{ float: right; width: 250px}
.schResult_cont .schRgt .issueCht{ margin: 20px 0 0 20px}
.schResult_cont .schRgt .issueCht strong, .schResult_cont .schRgt .my_issue strong{ display: block; font-size: 1.1em; font-weight: 500; margin-bottom: 10px}
.schResult_cont .schRgt .issueCht li, .schResult_cont .schRgt .my_issue li{ margin-bottom: 5px; position: relative}
.schResult_cont .schRgt .issueCht li span{ font-size: 0.9em; height: 22px; width: 25px; background: #c3c3c3; margin-right: 8px; display: inline-block; text-align: center; line-height: 22px;}
.schResult_cont .schRgt .issueCht li span.tp{ background: #0a70b9; color: #fff}
.schResult_cont .schRgt .issueCht li a, .schResult_cont .schRgt .my_issue li a{ color: #000;  line-height: 22px; cursor: pointer;}
.schResult_cont .schRgt .issueCht li a:hover, .schResult_cont .schRgt .my_issue li a:hover{ text-decoration: underline}
.schResult_cont .schRgt .issueCht li em{ display: inline-block; position: absolute; right: 0; top: 0; text-align: right;  line-height: 22px; width:35px; font-size: 0.75em; font-weight: 300; letter-spacing: 0}
.schResult_cont .schRgt .issueCht li em.sam{ text-align: center; font-weight: 500}
.schResult_cont .schRgt .issueCht li em.new{ color: #e73d00; font-weight: 400; font-size: 0.65em}
.schResult_cont .schRgt .issueCht li em.up:before, .schResult_cont .schRgt .issueCht li em.down:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -260px -109px; width: 8px; height: 9px; margin-right: 5px}
.schResult_cont .schRgt .issueCht li em.down:before{ background-position: -271px -109px}
.schResult_cont .schRgt .my_issue{ margin: 30px 0 0 20px}
.schResult_cont .schRgt .my_issue li a:before{ content: ''; display: inline-block; width: 5px; height: 5px; background: #ccc; margin-right: 5px; position: relative; top: -2px;}
.schResult_cont .schRgt .my_issue li button{ background: none; margin-left: 10px; font-size: 0; width: 25px; height: 25px; line-height: 1}
.schResult_cont .schRgt .my_issue li button:before{ display: inline-block; content: '\2573'; display: inline-block; font-size: 10px;color:#000; position: relative; top: -3px}
.schAutoComplete{ position: absolute; left: 0; top: 22px; background: #c7e1ee; border-radius: 0 0 10px 10px; width: 400px; padding-bottom: 35px; z-index: 1}
.schAutoComplete .innerBox{ margin: 25px 3px 0; background: #fff; text-align: left}
.schAutoComplete .innerBox ul{ padding: 5px}
.schAutoComplete .innerBox ul li a{ display: block; padding-left: 22px; line-height: 30px}
.schAutoComplete .innerBox ul li a:hover{ background: #f4f4f4}
.schAutoComplete .innerBox ul li a strong{ color: #f15922}
.schAutoComplete .innerBtm{ position: absolute; bottom: 0; height:35px; padding-left: 15px; width: calc(100% - 30px); text-align: left}
.schAutoComplete .innerBtm>a{ display: inline-block; line-height: 35px; color: #000; vertical-align: top; font-size: 15px}
.schAutoComplete .innerBtm>a:after{ content: ''; display: inline-block; width: 1px; height: 15px; background: #000; margin: 0 10px; position: relative; top: 2px}
.schAutoComplete .innerBtm>a:nth-child(3):after, .schAutoComplete .innerBtm>a:last-child:after{ display: none}
.schAutoComplete .innerBtm>a:last-child{ position: absolute; right: 0; top:0; color: #266cad}

/* 로그인 및 회원가입 */
.inputData:-ms-input-placeholder{ color: #969696; font-size: inherit; font-weight: 300;  letter-spacing: 0}
.inputData::-webkit-input-placeholder{ color: #969696; font-size: inherit; font-weight: 300;  letter-spacing: 0}
.inputData:-moz-input-placeholder{ color: #969696; font-size: inherit; font-weight: 300;  letter-spacing: 0}
.inputData::-moz-input-placeholder{ color: #969696; font-size: inherit; font-weight: 300;  letter-spacing: 0}

p.txtHead{ font-size: 1.1em; text-align: center; margin: 50px 0 10px}
p.txtHead.txt_al{ text-align: left}
p.txtHead strong{ display: block; font-size: 1.6em; color: #686868; font-weight: 500; line-height: 1.5}
p.txtHead em{ font-weight: 500; }
.loginArea{ width: 550px; margin:25px auto; min-height: 400px}
.loginArea dl dt{ position: absolute; width: 0; height: 0; overflow: hidden}
.loginArea dl dd .inputData{ width: 100%; height: 50px; background: #fff; margin: 0 0 10px}
.loginArea .button{ width: 100%; margin-top: 15px}
.loginArea .usrFind{ margin-top: 10px; position: relative}
.loginArea .usrFind a{ font-size: 1.05em; padding: 0 15px; line-height: 40px; font-weight: 400}
.loginArea .usrFind a:first-child:after{ content: ''; display: inline-block; width: 1px; height: 20px; background: #b6b6b6; vertical-align: middle; margin: 0 -15px 0 15px}
.loginArea .usrFind .button{ width: auto; position: absolute; right: 0; top: 0; margin: 0; padding: 0 50px}

.memberWrap{ margin-top: 15px}
.memberWrap .memberChk{ border-bottom: 3px solid #23507b; position: relative; margin-bottom: 10px}
.memberWrap .memberChk input[type='radio']{ position: absolute; width: 0; height: 0; overflow: hidden}
.memberWrap .memberChk label{ display: block; width: 17%; float: left; background: #d2d2d2; text-align: center; font-size: 1.1em; padding: 35px 0 30px; line-height: 1.5; box-sizing: border-box; border-left: 1px solid #fff}
.memberWrap .memberChk label.first, .memberWrap .memberChk label.last{ width: 16%}
.memberWrap .memberChk label.first{ border: 0}
.memberWrap .memberChk input[type='radio']:checked+label{ background: #23507b; color: #fff; font-weight: 500; position: relative; padding: 45px 0 20px;}
.memberWrap .memberChk input[type='radio']:checked+label:before{ content: ''; display: block; text-align: center; color: #fff; position: absolute; background: url(../images/common/icon2020.png) no-repeat -110px -132px; width: 25px; height: 32px; top: 010px;left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
.memberWrap .memProcess{ display: table; width: 100%; margin: 10px 0 50px}
.memberWrap .memProcess li{ display: table-cell; width: 25%;}
.memberWrap .memProcess li span{ display: block; margin-left: -1px; background: #f4f4f4; border: 1px solid #d2d2d2; text-align: center; padding: 20px 0; font-size: 1.1em; position: relative}
.memberWrap .memProcess li span:before{ content: '1'; display: inline-block; width: 26px; height: 26px; border-radius: 50%; text-align: center; background: #ccc; color: #323232; font-size: 0.75em; line-height: 26px; margin: 0 5px 0 0}
.memberWrap .memProcess li:nth-child(2) span:before{ content: '2';}
.memberWrap .memProcess li:nth-child(3) span:before{ content: '3';}
.memberWrap .memProcess li:nth-child(4) span:before{ content: '4';}
.memberWrap .memProcess li span:after{ content: '\25B6'; display: block; position: absolute; right: 0; top: 28px; color: #ccc; font-size: 0.75em; line-height: 1}
.memberWrap .memProcess li:last-child span:after, .memberWrap .memProcess li.active span:after{ content: ''}
.memberWrap .memProcess li:first-child span{ margin: 0}
.memberWrap .memProcess li.active span{ border-color: #ee5a5a; font-weight: 500; z-index: 1}
.memberWrap .memProcess li.active span:before{ background: #ee5a5a; color: #fff; font-weight: 500}

.mypageTp{ background: #e5eaf1; padding: 15px 10px 10px; position: relative; margin-bottom: 40px}
.mypageTp .button{ position: absolute; right: 10px; top: 35px}
.mypageTp p strong{ display: inline-block;  font-size: 1.15em; line-height: 60px}
.mypageTp p strong:before, .mypageTp .myNoti a:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -48px -132px; width: 60px; height: 60px; margin: 0 15px 0 10px; vertical-align: middle}
.mypageTp .myNoti{ background: #23507b; margin-top: 15px}
.mypageTp .myNoti a{ display: block; position: relative; padding: 0 15px; color: #fff; line-height: 45px}
.mypageTp .myNoti a:before{ background-position: -73px -96px; width: 29px; height: 26px; margin: 0 10px 5px 0;}
.mypageTp .myNoti a span{ color: rgba(255,255,255,.6); position: absolute; right: 20px; top: 0}

.recomProcess>li{ margin: 10px 0 25px; padding: 5px 15px 15px}
.recomProcess>li:nth-child(2){ background: #fff}
.recomProcess>li>strong{ padding: 5px 0}
.recomProcess>li>strong:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -108px -93px; width: 20px; height: 32px; margin-right: 7px}
.recomProcess>li:nth-child(2)>strong:before{ background-position: -130px -93px}
.recomProcess>li:nth-child(3)>strong:before{ background-position: -151px -93px}
.recomProcess>li ul{ background: #fff; padding: 10px 0 5px}
.recomProcess>li ul li label{ line-height: 1.6; width: 16%}
.recomProcess>li ul li .inputData, .boxLayer .inputData{ height: 42px}
.recomProcess span.button{ cursor: inherit; position: relative; padding: 0 50px 0 10px !important; font-size: 1em; margin: 0}
.recomProcess span.button button{ position: absolute; right: 0; top: 0; font-size: 0; background: none; width: 35px; height: 40px}
.recomProcess span.button button:before{content: '\2573'; display: inline-block; font-size: 10px; font-weight: 400; color: #323232;}
.recomProcess>li:nth-child(3)>ul{ text-align: center}
.recomProcess>li:nth-child(3) label{ width: auto}

.certiBox{ padding: 35px 95px 30px 210px; min-height: 110px; margin: 30px 0 20px; transition: all .2s; -webkit-transition: all .2s; }
.certiBox:hover:before{ content: ''; display: block; position: absolute; box-sizing: border-box; border: 3px solid #23507b; width: 100%; height: 100%; left: 0; top: 0;}
.certiBox i{ display: block; background: url(../images/common/iconInfo2020.png) no-repeat -122px 0; width: 76px; height: 112px; position: absolute; left: 100px; top: 35px}
.certiBox p{ font-size: 1.12em; padding-top: 20px;}
.certiBox p strong{ display: block; font-size: 1.2em; font-weight: 500}
.certiBox .button{ position: absolute; right: 70px; top: 60px}
.certiBox:hover .button{ background: #23507b; color: #fff}
.find_pw{ margin: 50px 0 -10px; text-align: center}
.find_pw .inputData{ width: 40%; height: 45px; background: #fff}
.idChk i{ display: block; width: 110px; height: 110px; border-radius: 50%; background: #23507b; margin: 0 auto 15px; text-align: center;}
.idChk i:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -476px -92px; width: 50px; height: 58px; margin-top: 25px;}
.idChk span{ display: block; font-weight: 300; font-size: 0.85em}
.grayBox.chkBox{ border-top: 1px solid #dedede; padding: 20px 50px}
.grayBox.chkBox ul li{ margin: 10px 0}

.complete_txt{ text-align: center;margin: 30px 0 50px}
.complete_txt strong{  display: block; font-size: 1.5em; font-weight: 500}
.complete_txt strong:before{ content: ''; display: block; background: url(../images/common/iconInfo2020.png) no-repeat 0 0; width: 122px; height: 152px; margin: 0 auto 25px}
.complete_txt p{ margin: 35px 0 0; font-size: 1.12em}
.complete_txt p em{ display: inline-block; font-weight: 500}

.memberTy label{ float: left; display: block; width: 49%; background: #fff; position: relative}
.memberTy label:last-child{ float: right;}
.memberTy label span{ display: block; border: 1px solid #d2d2d2; padding: 30px 25px 30px 160px; box-sizing: border-box; word-break: keep-all; min-height: 175px; font-size: 1.05em}
.memberTy label span strong{ display: block; font-size: 1.23em; font-weight: 500; margin-bottom: 8px}
.memberTy label span em{ font-weight: 500}
.memberTy label span i{ display: block; width: 110px; height: 110px; border-radius: 50%; background: #b4d1de; text-align: center; position: absolute; left: 25px; top: 35px}
.memberTy label span i:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -371px -92px; width: 42px; height: 62px; margin-top: 25px}
.memberTy label:last-child span i:before{ background-position: -417px -92px; width: 52px; height: 46px; margin-top: 30px}
.memberTy label input{ position: absolute; width: 1px; height: 1px; overflow: hidden}
.memberTy label input:checked+span{ border: 2px solid #23507b}
.memberTy label input:checked+span i{ background: #23507b}

.grayBox{ background: #efefef; position: relative;}
.lineBox{ background: #fff; border: 1px solid #d2d2d2; padding: 20px; position: relative}

.bluLineBox, .grnLineBox, .grnLineBox2{ background: #fff; border: 1px solid #3086c9; position: relative; text-align: center; padding: 10px 10px 5px}
.grnLineBox, .grnLineBox2{ background: #e5eaf1; border: 1px solid #12b8ba;}
.bluLineBox>em, .grnLineBox>em{ position: absolute; left: 0; top: 0; width: 40px; height: 40px; line-height: 40px; font-size: 1.15em; font-weight: 500; color: #fff; background: #3086c9}
.grnLineBox>em{ background: #12b8ba}
.bluLineBox .tp, .grnLineBox .tp{ display: block; font-size: 1.15em;}
.bluLineBox .tp span, .grnLineBox .tp span{ display: block; font-size: 0.85em; font-weight: 300}
.bluLineBox>span, .grnLineBox>span{ display: block; margin-top: 10px; font-size: 1.1em; white-space: break-spaces;}
.bluLineBox>span strong, .grnLineBox>span strong{ font-size: 2em; color: #ee5a5a}
.referBox{ background: #f7f7f7; font-size: 1.1em}
.referBox.ico{ padding: 30px 20px 15px 120px; position: relative; min-height: 70px;}
.referBox.ico:before{ content: ''; display: block; background: url(../images/common/icon2020.png) no-repeat; position: absolute; left: 20px; top: 15px;}
.referBox.ico.ic1:before{ background-position: -177px -94px; width: 80px; height: 79px;}
.referBox.ico.ic2:before{ background: url(../images/common/iconInfo2020.png) no-repeat -200px 0; width: 94px; height: 94px;}
.referBox.ico.ic3:before{ background: url(../images/common/iconInfo2020.png) no-repeat -295px 0; width: 94px; height: 94px;}
.referBox em{ color: #ee5a5a; font-weight: 400}
.referBox em:before, .referBox em:after{ content: '\02BB'; display: inline-block;}
.referBox em:after{ content: '\02BC';}
.lineBox.referBox{ background: #fff; padding: 20px 20px 20px 130px; font-size: 1em}
.lineBox.referBox strong{ font-size: 1.3em}
.lineBox.referBox.ico.ic2:before{ top: 30px}

.boxLayer{ background: #f7f7f7; text-align: left; margin-top: -1px; padding: 0 15px; position: relative}
.boxLayer>strong{ display: block; font-size: 1.2em; padding: 10px 0; font-weight: 500; border-bottom: 1px solid #bdbdbd}
.boxLayer>strong span{ font-size: 0.785em; font-weight: 300}
.boxLayer ul li{ background: #fff; float: left}
.boxLayer.mixL{ padding: 15px 10px 10px}
.boxLayer.mixL ul li{ background: transparent; float: none; margin: 0 0 5px}
.boxLayer ul li.returnD{ position: absolute; right: 15px; top: 10px; background: none}
.boxLayer ul li.returnD strong:before{ display: none}
.boxLayer ul li>strong, .boxLayer ul li>label{ display: inline-block; font-weight: 400; padding: 5px 0 5px 30px; margin-right: 30px;}
.boxLayer ul li>span{ display: inline-block}
.boxLayer ul li>strong:before, .boxLayer ul li>label:before{ left: 15px; top: 40%}
.boxLayer .btnA{ padding: 5px 0; text-align: right; position: relative}
.boxLayer .btnA .button{ padding: 0 30px}
.boxLayer .btnA p{ position: absolute; left: 0; line-height: 42px;}
.boxLayer .colorWhite{ font-size: 1em; padding: 0 30px 0 10px; margin-right: 50px}
.boxLayer .btnMore{ display: block; text-align: center; width: 100%; padding: 8px 0; background: #fff; border-top: 1px solid #23507b}
.boxLayer .txt_p13{ font-size: 1.3em}
.boxLayer .whiteBox{ background: #fff; padding: 10px; font-weight: 400; position: relative; margin: 0 0 10px;}
.boxLayer .whiteBox .juso.phone{ display: block; position: absolute; right: 10px; top: 10px}
.boxLayer .btnList{ display: block; position: absolute; right: 0; top: 0; background: none; padding: 10px 20px}
.boxLayer .btnList:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -346px -112px; width: 20px; height: 20px; margin-right: 5px; vertical-align: middle}

.orderList{ margin: 0 0 40px}
.orderList:after{ content: ''; display: block; clear: both}
.orderList li{ float: left;}
.orderList.w3 li{ width: 33%}
.orderList.w5 li{ width: 19%; margin-right: 1%}
.orderList.w5 li:last-child{ width: 20%; margin-right: 0}
.orderList.w3 li:nth-child(2){ margin: 0 0.5%}

.imgListA{ border-top: 2px solid #3086c9; padding-top: 10px;}
.imgListA>ul>li{ width: calc(20% - 10px); margin: 0 6px 30px 0; display: inline-block; vertical-align: top;}
.imgListA>ul>li:nth-child(5n){ margin-right: 0; width: 20%}
.imgListA>ul>li a{ display: block; vertical-align: top; position: relative}
.imgListA>ul>li a span{ display: block; height: 145px; overflow: hidden; text-align: center; background: #f0f0f0}
.imgListA>ul>li a span img{ max-width: 100%;}
.imgListA>ul>li a strong{ position: absolute; top: 115px; left: 0; height: 30px; background: rgba(0,0,0,.7); width: 100%; color: #fff; text-indent: 10px; font-weight: 500; line-height: 30px}
.imgListA>ul>li a strong span{ display: block; position: absolute; right: 10px; line-height: 30px; color: #f0ff00; height: auto; background: none; top: 0; font-weight: 300}
.imgListA>ul>li a em{ display: block; padding: 8px 0 0; font-weight: 400; font-size: 1.05em}
#content>.innerCont h1+.imgListDtl{ margin-top: 20px}
.imgListDtl .dtl_tpA{  text-align: center; margin-bottom: 35px}
.imgListDtl .dtl_tpA span{ display: block; height: 250px; overflow: hidden; margin-bottom: 10px}
.imgListDtl .dtl_tpA span img{ max-width: 100%; height: 100%;}
.imgListDtl .dtl_tpA strong{ display: block; font-size: 1.6em; font-weight: 500;}
.imgListDtl .imgDtlBox{ background: #f1f1f1; border-top: 2px solid #3086c9; padding: 0 10px 10px; margin-bottom: 35px}
.imgListDtl .imgDtlBox>li{ display: inline-block; position: relative; padding: 15px 0 12px 130px; width: 33%; box-sizing: border-box}
.imgListDtl .imgDtlBox>li span{ display: block; position: absolute; left: 0; padding-left: 30px; font-weight: 500}
.imgListDtl .imgDtlBox>li span:before{ content: ''; display: block; position: absolute; left: 14px; top: 10px; width: 6px; height: 6px; background: #3086c9;}
.imgListDtl .imgDtlBox>li.w100{ background: #fff; width: 100%; padding: 8px 0 5px 130px}
#content>.innerCont .imgListDtl  h2{ margin-top: 35px}
.imgListDtl h2+ul .dotL{ font-weight: 300; font-size: 0.98em; margin: 0 0 5px}
.imgListDtl  .imgSrl{ position: relative}
.imgListDtl  .imgSrl ul:after{ content: ''; display: block; clear: both}
.imgListDtl  .imgSrl ul>li{ margin: 0 -3px 20px; width: 20%; display: inline-block; vertical-align: top;}
.imgListDtl  .imgSrl ul>li div{ margin: 0 10px 0 0; text-align: center}
.imgListDtl  .imgSrl ul>li div span{ display: block; background: #f0f0f0; width: 195px; height: 140px; text-align: center; overflow: hidden}
.imgListDtl  .imgSrl ul>li:nth-child(5n) div{ margin-right: 0}
.imgListDtl  .imgSrl ul>li div span img{ width: 100%; max-width: 100%}
.imgListDtl  .imgSrl ul>li div strong{ display: block; padding: 10px 0; font-weight: 400; text-align: center; line-height: 1.3;}
.imgListDtl  .imgSrl ul>li div .button{ width: 100%; margin: 0}
.imgListDtl  .imgSrl ul>li div .imgA+.overPic, .seedList>li .thums span+.overPic{ display: none; position: absolute; background: #fff; border: 1px solid #555; padding: 10px; min-width: 500px; min-height: 300px; box-sizing: border-box; text-align: center}
.imgListDtl  .imgSrl ul>li:nth-child(4) div .imgA+.overPic, .imgListDtl  .imgSrl ul>li:nth-child(5n) div .imgA+.overPic, .imgListDtl  .imgSrl ul>li:nth-child(4n+1) div .imgA+.overPic{ right:0}
.imgListDtl  .imgSrl ul>li:nth-child(1) div .imgA+.overPic{ left: 0; right: auto}
.imgListDtl  .imgSrl .overPic span, .seedList>li .thums span+.overPic span{ height: 240px; overflow: hidden; width: auto; background: #fff}
.imgListDtl  .imgSrl .overPic span img, .seedList>li .thums span+.overPic span img{ height: 100%; width: auto;}
.imgListDtl  .imgSrl ul>li div .imgA:hover+.overPic{ display: block; z-index: 10}

.tabStyle1{ position: relative}
.tabStyle1>div>div{ display: none; padding-top: 102px; margin-bottom: 30px}
.tabStyle1>div.active>div{ display: block; position: relative}
.tabStyle1>div>button{ position: absolute; top: 0; left: 0; width: 17%; background: #d2d2d2; text-align: center; font-size: 1.1em; padding: 10px 0 15px; line-height: 1.5; z-index: 1}
.tabStyle1>div.active>button{ background: #23507b; color: #fff; font-weight: 400}
.tabStyle1>div+div button{ left: calc(17% + 1px)}
.tabStyle1>div+div+div button{ left: calc(17% + 1px + 17% + 1px)}
.tabStyle1>div+div+div+div button{ left: calc(17% + 1px + 17% + 1px + 17% + 1px); width: 16%}
.tabStyle1>div+div+div+div+div button{ left: calc(17% + 1px + 17% + 1px + 17% + 1px + 16% + 1px); width: 16%}
.tabStyle1>div+div+div+div+div+div button{ left: calc(17% + 1px + 17% + 1px + 17% + 1px + 16% + 1px + 16% + 1px); width: 16.5%}
.tabStyle1>div>button:before{ content: ''; display: block; margin: 0 auto 5px; height: 46px; background: url(../images/common/icon2020.png) no-repeat -178px 0; width: 35px}

.tabStyle1>div.active>button:before{ background-position: -178px -46px}
.tabStyle1>div+div>button:before{ background-position: -214px 0; width: 60px}
.tabStyle1>div+div.active>button:before{ background-position: -214px -46px;}
.tabStyle1>div+div+div button:before{ background-position: -276px 0; width: 34px}
.tabStyle1>div+div+div.active button:before{ background-position: -276px -46px;}
.tabStyle1>div+div+div+div button:before{ background-position: -312px 0; width: 36px}
.tabStyle1>div+div+div+div.active button:before{ background-position: -312px -46px}
.tabStyle1>div+div+div+div+div button:before{ background-position: -349px 0; width: 50px}
.tabStyle1>div+div+div+div+div.active button:before{ background-position: -349px -46px}
.tabStyle1>div+div+div+div+div+div button:before{ background-position: -402px 0; width: 42px}
.tabStyle1>div+div+div+div+div+div.active button:before{ background-position: -402px -46px}

.tabStyle1>div .usr_m1:before{ background-position: -178px 0}
.tabStyle1>div.active .usr_m1:before{ background-position: -178px -46px}
.tabStyle1>div .usr_m2:before{ background-position: -214px 0; width: 60px}
.tabStyle1>div.active .usr_m2:before{ background-position:-214px -46px;}
.tabStyle1>div .usr_m3:before{ background-position:  -276px 0; width: 34px}
.tabStyle1>div.active .usr_m3:before{ background-position:-276px -46px;}
.tabStyle1>div .usr_m4:before{ background-position: -312px 0; width: 36px}
.tabStyle1>div.active .usr_m4:before{ background-position: -312px -46px}
.tabStyle1>div .usr_m5:before{ background-position: -349px 0; width: 50px}
.tabStyle1>div.active .usr_m5:before{ background-position: -349px -46px}
.tabStyle1>div .usr_m6:before{ background-position: -402px 0; width: 42px}
.tabStyle1>div.active .usr_m6:before{ background-position: -402px -46px}
.tabStyle1>div .usr_m7:before{ background-position: -448px 0; width: 36px}
.tabStyle1>div.active .usr_m7:before{ background-position: -448px -46px}

.tabStyle1 .tabsCont>p{ background: #23507b; padding: 8px 40px; color: #fff}
.tabStyle1 .tabsCont>.button{ position: absolute; right: 0; top: 150px; left: auto; width: auto}
#content>.innerCont .tabStyle1 .tabsCont h3{ margin: 15px 0 10px}

.lisyStyle1{ border-top: 1px solid #23507b}
.lisyStyle1 li{ background: #fff; border: 1px solid #c1c1c1; margin-bottom: -1px;}
.lisyStyle1 li:nth-child(odd){ background: #f1f1f2}
.lisyStyle1 li a{ display: table; width: 100%; padding: 10px 0}
.lisyStyle1 li a strong, .lisyStyle1 li a span{ display: table-cell}
.lisyStyle1 li a strong{ width:60%; font-size: 1.1em; text-indent: 20px; font-weight: 400}
.lisyStyle1 li a span{ width: 20%; text-align: center}
.lisyStyle2{ border-top: 1px solid #23507b}
.lisyStyle2 li{ background: #fff; border: 1px solid #c1c1c1; margin-bottom: -1px;}
.lisyStyle2 li:nth-child(odd){ background: #f1f1f2}
.lisyStyle2 li a{ display: table; width: 100%; padding: 10px 0}
.lisyStyle2 li a strong, .lisyStyle2 li a span{ display: table-cell}
.lisyStyle2 li a strong{ width: 55%; font-size: 1.1em; text-indent: 20px; font-weight: 400}
.lisyStyle2 li a span{ width: 15%; text-align: center}
.lisyStyle2 li a span:last-child{ width: 30%; text-align: left}

.boxList>li{ display: inline-block}
.boxList.w3>li{ width: 33%;}
.boxList.w3>li>div{ background: #fff; padding: 10px; margin: 5px 5px; height: 110px; overflow: hidden}
.boxList.w3>li>div strong, .boxList.w3>li>div span{ display: block;  margin: 0 0 5px}
.boxList.w3>li>div strong{ font-size: 1.1em; margin: 0 0 10px; font-weight: 500}
.boxList.w3>li>div span, .juso{ padding-left: 25px; position: relative}
.boxList.w3>li>div span:before, .juso:before{ content: ''; display: block; background: url(../images/common/icon2020.png) no-repeat; position: absolute; left: 0; top: 05px}
.boxList.w3>li>div span.phone:before, .juso.phone:before{ background-position: -148px -48px; width: 17px; height: 18px}
.boxList.w3>li>div span.zip:before, .juso.zip:before{ background-position: -148px -70px; width: 17px; height: 20px}

.agreeC{ padding: 10px 0; margin: 0 0 30px;}
.agreeC label{ margin: 0 30px 0 5px}
.agreeC input[type="checkbox"], .agreeC input[type="radio"]{ }
.grayLineBox{ background: #fff; border: 1px solid #d2d2d2; padding: 10px}
.grayLineBox.scroll{ height: 220px; overflow-y: auto}
.agreeC.agreeCAll{ margin: 30px 0; position: relative}
.agreeC.agreeCAll label{  display: block; background: #fff; border: 1px solid #d2d2d2; padding: 10px; text-align: center; margin: 0}
.agreeC.agreeCAll input{ position: absolute; left: 38%; top: 23px}
.agreeC.agreeCAll input:checked+label{ background: #3086c9; border: 1px solid #3086c9; color: #fff; font-weight: 500}

.afterClear>h2{ float: left}
.afterClear>.button, .afterClear>.btnArea{ float: right; margin: 0}

/* 콘텐츠 */
.sectionCont_tp{ background: #f2f4f5; padding: 20px 20px 20px 150px; position: relative; min-height: 90px; word-break: keep-all; margin-bottom: 40px; border-bottom: 1px solid #3086c9;}
#content>.innerCont .sectionCont_tp h2:before{ display: none}
.sectionCont_tp li, .sectionCont_tp p{ font-size: 1em; color: #686868; margin-top: 5px}
.sectionCont_tp li:before{ top: 10px}
.sectionCont_tp i{ display: block; background: #d7dadb; width: 95px; height: 95px; border-radius: 50%; position: absolute; left: 25px; top: 20px; text-align: center}
.sectionCont_tp i:before{ content: ''; display: inline-block; background: url(../images/common/iconInfo2020.png) no-repeat 0 -151px; height: 67px; margin-top: 12px}
.sectionCont_tp i.ic1:before{ width: 71px;  margin-top: 8px}
.sectionCont_tp i.ic2:before{ background-position: -78px -151px; width: 50px;}
.sectionCont_tp i.ic3:before{ background-position: -136px -151px; width: 70px;}
.sectionCont_tp i.ic4:before{ background-position: -216px -151px; width: 52px;}
.sectionCont_tp i.ic5:before{ background-position: -285px -151px; width: 59px;}
.sectionCont_tp i.ic6:before{ background-position: -348px -151px; width: 68px;}
.sectionCont_tp i.ic7{ background: transparent; width: auto; height: auto; left: 10px; top: auto; bottom: 0}
.sectionCont_tp i.ic7:before{ background-position: 0 -346px; width: 91px; height: 88px}
.sectionCont_tp i.ic8:before{ background-position: -427px -151px; width: 61px;}
.sectionCont_tp i.ic9:before{ background-position: -500px -151px; width: 70px;}
.sectionCont_tp.boxS1{ border: 1px solid #3086c9; padding: 0; min-height: auto}
.sectionCont_tp.boxS1 p{ border: 8px solid #f2f4f5; background: #fff; margin: 0; padding: 10px 10px 10px 110px; min-height: 110px; box-sizing: border-box}
.imgArea{ margin: 20px 0 0; text-align: center}
.imgArea span{ display: inline-block}
.imgArea span em{ display: block; margin: 1px 0 1em; background: #fff; border: 1px solid #ccc; padding: 8px; text-align: center}
.imgArea.sImg span em{ margin: 0.5em 0 2em;}
.imgArea.w2 span{ width: 40%;}
.imgArea.w3 span{ width: 30%;}
.imgArea.w4 span{ width: 23%;}
.imgArea img{ max-width: 100%}

.worksProcess{ margin: 15px 0 0; font-weight: 300}
.worksProcess dt strong{ font-weight: 500; margin-right: 5px}
.worksProcess dd>ol.t{ margin: 15px 0 30px}
.worksProcess dd>ol.t li{ display: inline-block; position: relative; padding-right: 30px; margin: 0 0 10px}
.worksProcess dd>ol.t li:after{ content: '\279C'; display: inline-block; color: #12b8ba; position: absolute; right: 10px; top: 40px; line-height: 1}
.worksProcess dd>ol.t li:last-child{ padding: 0}
.worksProcess dd>ol.t li:last-child:after{ display: none}
.worksProcess dd>ol.t li span{ display: block; width: 165px; height: 100px; border: 1px solid #12b8ba; text-align: center; font-size: 1.1em}
.worksProcess dd>ol.t li span:before{ content: ''; display: block; margin: 10px auto 0; background: url(../images/common/iconInfo2020.png) no-repeat 0 -221px; width: 58px; height: 58px}
.worksProcess dd>ol.t li:nth-child(2) span:before{ background-position: -59px -221px}
.worksProcess dd>ol.t li:nth-child(3) span:before{ background-position: -118px -221px}
.worksProcess dd>ol.t li:nth-child(4) span:before{ background-position: -177px -221px}
.worksProcess dd>ol.t li:nth-child(5) span:before{ background-position: -236px -221px}
.worksProcess dd>ol.d li{ margin-bottom: 40px;}
.worksProcess dd>ol.d li dt{ margin-bottom: 20px; font-size: 1.2em; font-weight: 500; line-height: 40px;}
.worksProcess dd>ol.d li dt:before{ content: '\0031'; display: inline-block; width: 40px; height: 40px; background: #12b8ba; text-align: center; line-height: 40px; color: #fff; margin: 0 10px 0 0}
.worksProcess dd>ol.d li:nth-child(2) dt:before{ content: '\0032';}
.worksProcess dd>ol.d li:nth-child(3) dt:before{ content: '\0033';}
.worksProcess dd>ol.d li:nth-child(4) dt:before{ content: '\0034';}
.worksProcess dd>ol.d li:nth-child(5) dt:before{ content: '\0035';}
.worksProcess dd>ol.d li dd{ font-size: 1.1em; font-weight: 400}
.worksProcess dd>ol.d li dd.dotL:before{ top: 10px}
.worksProcess dd>ol.d li dd ul{ margin-top: 10px}
.worksProcess dd>ol.d li dd li, .depthP>li>ul>li{ font-size: 0.95em; font-weight: 300; margin-bottom: 5px; position: relative; padding-left: 10px;}
.worksProcess dd>ol.d li dd li:before, .depthP>li>ul>li:before, .depthP ul ul li:before{ content: ''; display: block; width: 5px; height: 1px; background: #323232; position: absolute; left: 0; top: 13px}
.worksProcess.memS dd>ol.t li:nth-child(1) span:before{ background-position: -59px -221px}
.worksProcess.memS dd>ol.t li:nth-child(2) span:before{ background-position: -296px -221px}
.worksProcess.memS dd>ol.t li:nth-child(3) span:before{ background-position: -356px -221px}
.worksProcess.memS dd>ol.d li dt{ margin-bottom: 10px}
.worksProcess.memS dd>ol.d li dd{ font-weight: 300}
.depthP{ margin: 20px 5px 40px}
.depthP .dotL, .defineDiv .dotL{ margin-bottom: 5px}
.depthP .dotL:before, .defineDiv .dotL:before{ top: 10px}
.depthP>li>ul{ margin: 10px 0 20px}
.depthP ul ul{ margin: 10px 5px 15px}
.depthP ul ul li{ font-size: 0.95em; padding-left: 10px; position: relative; margin-bottom: 3px; font-weight: 300; line-height: 1.6}
.depthP li strong{ display: inline-block; font-weight: 500}
.depthP li strong.block{ color: #5f5e5e}
.depthP ul ul li:before{ width: 4px; height: 4px; top: 10px}
.depthP ul ul li li:before{ width: 2px; height: 1px; top: 10px}
.depthP p.txt_orange:before{ content: '\271C'; display: inline-block; margin-right: 5px}
.depthP .dotL .referBox.ico:before{ top: 15px}
.depthP .dotL .referBox strong{ font-size: 1.1em}
.depthP .dotL .referBox>ul{ font-size: 0.9em; font-weight: 300; padding-top: 0.5em;}
.sectionCont_tp+.hideMnA{ margin: -39px 0 40px}
.hideMnA>button, .hideMnA>a{ display: block; background: #3086c9; color: #fff; text-align: center; width: 100%; padding: 10px 0}
.hideMnA>button:after, .hideMnA>a:after{ content: 'CLICK'; display: inline-block; font-weight: 600; margin-left: 10px}
.hideMnA>ul{ display: none}
.hideMnA>ul.active{ display: block}
.hideMnA>ul a{ display: block; background: #e5f1fb; text-align: center; font-size: 1.05em; color: #000; padding: 8px 0; margin-top: 1px; border-bottom: 1px solid #b4cbde; font-weight: 500}
.defineDiv .def1{ margin: 30px 0; text-align: center}
.defineDiv .def1 dt{ font-size: 1.4em; font-weight: 600; margin-bottom: 1em}
.defineDiv .def1 dd{ line-height: 1.7; font-size: 1.08em; margin-bottom: 2em}
.referIn{ text-align: center; color: #686868; padding: 0.8em 2em; word-break: keep-all; font-size: 1.05em}
.defineDiv .defList{ margin: 10px 0; border-top: 2px solid #38394d}
.defineDiv .defList li dt{ display: block; margin-top: 1px; background: #f1f4f7; border-bottom: 1px solid #afafaf}
.defineDiv .defList li dt, .defineDiv .defList li dd{ padding: 0 10px; position: relative}
.defineDiv .defList li dt:before, .defineDiv .defList li dd:before{ content: '\0051'; display: block; position: absolute; left: 15px; top: 0; font-size: 30px; font-weight: 600; color: #3086c9}
.defineDiv .defList li dt button{ display: block; width: 100%; background: transparent; text-align: left; padding: 10px 0 15px 50px; font-size: 1.08em; position: relative}
.defineDiv .defList li dd:before{ content: '\0041'; color: #ee5a5a}
.defineDiv .defList li dd, .defineDiv.tabs .defList li .defCont{ display: none; padding: 10px 10px 10px 50px; border-bottom: 1px solid #38394d}
.defineDiv .defList li.active dd, .defineDiv.tabs .defList li.active .defCont{ display: block}
.defineDiv .defList li dd>strong{ display: block; font-size: 1.2em; margin-bottom: 20px}
.defineDiv .defList .depthP .dotL{ margin-bottom: 5px}
.tblCaption{ margin: 20px 0 5px; font-size: 1.08em; font-weight: 600}
.tblBtmC{ margin: 10px 0 0; font-size: 1em; font-weight: 300}
.defineDiv .gridScroll table, .referS table{ width: 100%; overflow: hidden}
.defineDiv  .default_table thead th{ border-color: #23507b}
.defineDiv  .default_table td .depthP{ text-align: left; margin: 0}
.defineDiv .defList.rndList{ margin: 0; border: 0}
.defineDiv .defList.rndList>li{ margin-bottom: 3px; background: #fff; border: 1px solid #ccc; border-radius: 10px}
.defineDiv .defList.rndList>li.active{ border: 2px solid #3086c9}
.defineDiv .defList.rndList>li dt:before{ color: rgba(0,0,0,.1); font-size: 45px; font-weight: 800;}
.defineDiv .defList.rndList>li:nth-child(1) dt:before, .dlList dt.n1:before{ content: '\0030\0031';}
.defineDiv .defList.rndList>li:nth-child(2) dt:before, .dlList dt.n2:before{ content: '\0030\0032'; }
.defineDiv .defList.rndList>li:nth-child(3) dt:before, .dlList dt.n3:before{ content: '\0030\0033'; }
.defineDiv .defList.rndList>li:nth-child(4) dt:before, .dlList dt.n4:before{ content: '\0030\0034'; }
.defineDiv .defList.rndList>li:nth-child(5) dt:before, .dlList dt.n5:before{ content: '\0030\0035'; }
.defineDiv .defList.rndList>li dt{ padding-left: 0; margin: 0; border: 0; background: transparent}
.defineDiv .defList.rndList>li dt button{ padding: 15px 0 20px 75px; color: #000; position: relative}
.defineDiv .defList.rndList>li dt button:after, .defineDiv .defList li dt button:after{ content: '\261E'; display: block; position: absolute; right: 20px; top: 5px; font-weight: 600; color: rgba(0,0,0,.5); font-size: 32px}
.defineDiv .defList li dt button:after{ top: 0; }
.defineDiv .defList.rndList>li.active dt button:after, .defineDiv .defList li.active dt button:after{ font-size: 0}
.defineDiv .defList.rndList>li.active dt button{ font-weight: 500}
.defineDiv .defList.rndList>li dd{ margin: 0 20px 25px; padding: 10px 30px; background: #e9eced; border: 0}
.defineDiv .defList.rndList>li dd:before{ font-size: 0}
.defineDiv .imgArea+p{ margin: 1.5em 0 1em}
.defineDiv .h4_tl{ display: block; margin: 1em 0 0;}
.defineDiv.tabs .defList{ position: relative; border-top: 0}
.defineDiv.tabs .defList li>h2{ position: absolute; top: 0; width: 25%;}
.defineDiv.tabs.w3 .defList li>h2{ width: 33.33%}
#content>.innerCont .defineDiv.tabs .defList li>h2:before{ display: none}
.defineDiv.tabs .defList li h2 button{ display: block; width: 98%; background: #f3f3f3; border: 1px solid #dadada; font-size: 0.75em; font-weight: 400; height: 55px; transition: all .2s; -webkit-transition: all .2s;}
.defineDiv.tabs .defList li.active h2 button{ background: #12b8ba; border-color: #12b8ba; font-size: 0.9em; font-weight: 500; color: #fff}
.defineDiv.tabs .defList li:nth-child(2) h2{ left: 25%}
.defineDiv.tabs .defList li:nth-child(3) h2{ left: 50%}
.defineDiv.tabs .defList li:nth-child(4) h2{ left: 75%}
.defineDiv.tabs.w3 .defList li:nth-child(2) h2{ left: 33.33%}
.defineDiv.tabs.w3 .defList li:nth-child(3) h2{ left: 66.66%}
.defineDiv.tabs .defList li .defCont{ padding: 70px 10px 10px; border: 0}
.defineDiv.tabs.w3 .defList li .defCont{ padding: 65px 6px 10px 0;}
.defineDiv .dotL{ font-weight: 300}
.defineDiv.tabs.w3 .sectionCont_tp{ border: 0; background: #12b8ba; margin-bottom: 10px}
.defineDiv.tabs.w3 .sectionCont_tp h2{ position: static; color: #fff; width: auto !important}
.defineDiv.tabs.w3 .sectionCont_tp p{ color: #fff}
.defineDiv.tabs.w3 .sectionCont_tp i{ background: #fff}
.defineDiv.tabs.w3 .defCont>.btnArea{ margin-top: 0; text-align: left}
.defineDiv.tabs.w3 .defCont>.btnArea .button, .button.gradient{ background-image: linear-gradient(to right, #0188bf 0%, #3a8823  51%, #0188bf  100%); transition: 0.5s; background-size: 200% auto; padding: 0 90px 0 20px; line-height: 50px; font-weight: 300; margin: 0 3px 3px 0;}
.defineDiv.tabs.w3 .defCont>.btnArea .button:hover,  .button.gradient:hover{ background: #23507b;}
.defineDiv.tabs.w3 .defCont>.btnArea .button i, .button.gradient i{ display: block; position: absolute; right: 15px; top: 12px; width: 25px; height: 25px; border-radius: 50%; transition: 0.5s; background: rgba(255,255,255,0.85); text-align: center; line-height: 1}
.defineDiv.tabs.w3 .defCont>.btnArea .button:hover i, .button.gradient:hover i{ background: #fff}
.defineDiv.tabs.w3 .defCont>.btnArea .button i:before, .button.gradient i:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -142px -132px; width: 13px; height: 14px; margin-top: 7px}
.defineDiv.tabs.w3 .defCont>.btnArea .button.d i:before, .button.d.gradient i:before{ background-position: -91px -79px;  margin-top: 5px}
.defineDiv.tabs.w3 .defCont .grayBox{ background: #fbfbfb; border: 1px solid #ccc; padding: 10px; margin-bottom: 30px}
.defineDiv.tabs.w3 .defCont .grayBox a[target='_blank']:after{ content: ''; background: url(../images/common/icon2020.png) no-repeat -74px -79px; width: 14px; height: 14px;  display: inline-block; margin-left: 7px}
.dlList{ letter-spacing: -0.085em; margin: 0 0 20px}
.dlList dt{ display: inline-block; width: 55%; background: #12b8ba; border-radius: 10px 10px 0 0; padding: 12px 30px 12px 50px; font-size: 1.2em; font-weight: 400; color: #fff; position: relative; overflow: hidden; }
.dlList.dtW20 dt{ width: 20%}
.dlList dt:before{ content: '\0030\0031'; display: block; color: rgba(255,255,255,.2); font-size: 2.5em; font-weight: 800; position: absolute; left: 0; top: 0; line-height: 1.4;}
.dlList dt.n6:before{ content: '\0030\0036';}
.dlList.blu dt{ background: #3086c9}
.dlList dd{ background: #f1f1f1; border-radius: 0 10px 10px; border: 1px solid #ccc; padding:35px 15px 15px; margin-top: -25px}
.dlList ul{ padding: 15px}

.guideSvc{ text-align: center; margin-bottom: 50px}
.guideSvc li{ display: inline-block; position: relative; padding-right: 30px;}
.guideSvc li:after{ content: ''; display: block; position: absolute; right: 10px; top: 70px; width: 12px; height: 12px; background: #d9d9d9; border-radius: 50%}
.guideSvc li:nth-child(5):after{ display: none}
.guideSvc li span{ display: table-cell; border: 1px solid #efefef; width: 150px; height: 150px; border-radius: 50%; position: relative; z-index: 1; vertical-align: middle; font-size: 1.1em; font-weight: 400; color: #fff}
.guideSvc li span i{ display: block; height: 45px; margin: 0 auto 10px; background: url(../images/common/iconInfo2020.png) no-repeat -130px -282px; width: 44px}
.guideSvc li:nth-child(2) i{ background-position: -178px -282px; width: 42px;}
.guideSvc li:nth-child(3) i{ background-position: -225px -282px; width: 37px;}
.guideSvc li:nth-child(4) i{ background-position: -266px -282px;}
.guideSvc li:nth-child(5) i{ background-position: -316px -282px; width: 46px;}
.guideSvc li span:before{ content: ''; display: block; width: 130px; height: 130px; position: absolute; left: 10px; top: 10px; background: #12b8ba; border-radius: 50%; z-index: -1}
.guideSvc li:nth-child(2) span:before{ background: #12ba7d}
.guideSvc li:nth-child(3) span:before{ background: #129cba}
.guideSvc li:nth-child(4) span:before{ background: #1271ba}
.guideSvc li:nth-child(5) span:before{ background: #23507b}

.guideSvc.greenP{ margin: 20px 0 50px}
.guideSvc.greenP li { vertical-align: top}
.guideSvc.greenP li span{ display: block; border-color: #12b8ba; font-size: 1em; font-weight: 300; letter-spacing: -0.095em; line-height: 1.2}
.guideSvc.greenP li span i{ height: 59px; background-position: -97px -346px; width: 60px; margin: 25px auto 5px}
.guideSvc.greenP li:nth-child(2) span i{ background-position: -163px -346px; width: 58px;}
.guideSvc.greenP li:nth-child(3) span i{ background-position: -223px -346px; width: 55px;}
.guideSvc.greenP li:nth-child(4) span i{ background-position: -282px -346px; width: 55px;}
.guideSvc.greenP li:nth-child(5) span i{ background-position: -340px -346px; width: 55px;}
.guideSvc.greenP li span:before{ background: #12b8ba}
.guideSvc.greenP li strong{ display: block; font-size: 1.15em; font-weight: 500; line-height: 1.3; margin-top: 10px}

.guideSvc.greenP.blu li span{ border-color: #3086c9}
.guideSvc.greenP.blu li span:before{ background: #3086c9}
.guideSvc.greenP.dark li span{ border-color: #12ba7d}
.guideSvc.greenP.dark li span:before{ background: #12ba7d}

/*
#content>.innerCont .defineDiv h3{ text-align: center; margin:  4em 0 0.5em; padding: 0}
#content>.innerCont .defineDiv h3:before{ width: 100%; height: 1px; border: 0; top: auto}
#content>.innerCont .defineDiv h3:after{ background: url(../images/common/iconInfo2020.png) no-repeat 0 -344px; width: 64px; height: 48px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: -48px} */

/* 페이징 */
.paging{ text-align: center; margin: 20px 0 50px;}
.paging a, .paging span{ display: inline-block; box-sizing: border-box}
.paging span{ margin: 0 0 3px}
.paging span a{ font-size: 16px; border: solid 1px #b7b7b7; color: #323232; width: 50px; height: 50px; margin: 0 1px;  line-height: 45px; text-decoration: underline; transition: all .2s; -webkit-transition: all .2s;}
.paging span.on a{ font-weight: bold; border: 1px solid #12b8ba; background: #12b8ba; color: #fff}
.paging .first, .paging .prev, .paging .next, .paging .last{ width: 33px; height: 33px; font-size: 0; line-height: 0; padding: 0}
.paging>a{ border: solid 1px #b7b7b7; vertical-align: middle; transition: all .2s; -webkit-transition: all .2s;}
.paging>a:before{ content: ''; display: block; background: url(../images/common/icon2020.png) no-repeat; width: 11px; height: 11px; margin: 0 auto; margin-top: 10px}
.paging>a.prev{ margin-right: 20px}
.paging>a.next{ margin-left: 20px}
.paging>a.first:before{ background-position: -48px -48px;}
.paging>a.prev:before{ background-position: -61px -48px; width: 6px;}
.paging>a.next:before{ background-position: -69px -48px; width: 6px;}
.paging>a.last:before{ background-position: -77px -48px;}

.paging a, .paging span a{ border: 0; border-radius: 10px; width: 45px; height: 40px; line-height: 40px; background: #efefef;  text-decoration: none}
.paging span.on a, .paging span a:hover{ border: 0; background: #23507b; color: #fff !important;}
.paging .first, .paging .prev, .paging .next, .paging .last{ width: 45px; height: 40px; line-height: 40px; vertical-align: top}
.paging>a:before{ margin-top: 13px}
.paging>a.first, .paging>a.last{ width: 40px; background: #fff}
.paging>a.prev, .paging>a.next{ width: 35px;  background: #fff}
.paging>a:hover{ background: #efefef}
.paging>a:before{ height: 14px}
.paging>a.first:before{ background-position: -111px -170px; width: 14px;}
.paging>a.prev:before{ background-position: -129px -170px; width: 8px;}
.paging>a.next:before{ background-position: -142px -170px; width: 8px;}
.paging>a.last:before{ background-position: -154px -170px; width: 14px;}

.move_top{ position: fixed; right: -100px; bottom: 50px; transition: all .2s; -webkit-transition: all .2s; opacity: 0; background: #0f3356; width: 50px; color: #fff;  line-height: 1; width: 70px; height: 55px; border-radius: 50%; text-align: center; padding-top: 15px}
.move_top:before{ content: ''; display: block; transform: rotate(90deg); background: url(../images/common/icon2020.png) no-repeat -2px -29px; width: 8px; height: 14px; margin: 0 auto 3px}
.move_top.on{ opacity: 0; z-index: 300; right: 10px;}

#footer{ background: #2a455e}
.footMn{ background: #0f3356; color: #fff}
.footMn li{ float: left;}
.footMn li:before{ content: '\2223'; display: inline-block; color: #8f8f8f; line-height: 1; position: relative; top: -1px}
.footMn li:first-child:before{ content: ''}
.footMn li a{ display: inline-block; color: #fff; font-size: 0.95em; line-height: 45px; letter-spacing: 0; padding: 0 20px}
.footMn li:first-child a{ color: #fff000; font-weight: 400}
#footer>.inner{ padding: 25px 0 45px 0; position: relative}
#footer address, #footer .copyright{ font-size: 0.9em;  color: #c3c3c3; letter-spacing: 0; padding-left: 20px; line-height: 1.5; margin: 5px 0 0}
#footer>.inner>div{ position: absolute;  top: 15px; right: 10px; padding: 20px 80px 0 0; text-align: right; color: #12b8ba}
#footer>.inner>div:after{ content: ''; display: block; position: absolute; right: 0; top: 0; width: 72px; height: 70px; background: url(../images/common/icon2020.png) no-repeat 0 -61px}
#footer>.inner>div strong{ display: block; color: #fff; font-size: 1.2em; font-weight: 400}

/* popup */
#popLayer>div>div{ position: relative;}
#popLayer>div>div h1{ font-size: 1.5em; color: #fff; font-weight: 400; text-indent: 10px; line-height: 60px; background: #23507b;}
#popLayer .popCont{ padding: 15px 15px 50px}
#popLayer>div>a{ display: block; position: absolute; top: 7px; right: 10px; font-size: 0; padding: 0 10px}
#popLayer>div>a:before{ content: '\2715'; display: inline-block; font-size: 30px; color: #fff; font-weight: 300}

.layerPop{ position: absolute; z-index: 1}
.layerPop .layerTp{ background: #23507b; padding: 15px 80px 12px 20px; color: #fff; font-size: 1.25em;}
.layerPop .layerTp strong{ display: inline-block; font-weight: 500;}
.layerPop .layerTp strong.ico:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat; margin-right: 10px; vertical-align: middle}
.layerPop .layerTp strong.ico.ic1:before{ background-position: -108px -55px; width: 37px; height: 31px; }
.layerPop .layerCont{ padding: 10px;  background: #e5eaf1}
.layerPop .layerCont ul, .layerPop .layerCont ul li{ background: none; padding: 0}
.layerPop .layerCont ul li{ line-height: 1.5}
.layerPop .layerCont ul li>strong{ display: inline-block; font-weight: 400; padding: 5px 0 5px 30px; margin-right: 30px;}
.layerPop .layerCont ul li>strong:before{ left: 15px}
.layerPop .btnClose{ left: auto; right: 0; top: 5px; transform: none;}
.layerPop .btnClose:before{ font-size: 20px}
.layerPop.sign{ left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: 35%}
.layerPop.sign>div{ width: 350px}
.layerPop.sign .layerTp{ border-radius: 7px 7px 0 0; text-align: center; padding:10px; font-size: 1.1em}
.layerPop.sign .layerCont{ border-radius: 0 0 7px 7px; padding: 30px 20px 50px; background: #3086c9; color: #fff}
.layerPop.sign .layerCont p{ text-align: center; font-size: 1.1em;}
.layerPop.sign .layerCont p:before{ content: ''; display: block; margin: 0 auto 10px; background: url(../images/common/iconInfo2020.png) no-repeat 0 -283px; height: 56px; width: 61px}
.layerPop.sign .layerCont p.chk:before{ background-position: -69px -283px; width: 55px}
.layerPop.sign .btnClose{ top: 0; transform: none; width: 45px; height: 45px}
.layerPop.sign .btnClose:before{ font-size:15px}

.layerPop{ background: rgba(0,0,0,.5); position: fixed; z-index: 10; width: 100%; height: 100%; left: 0; top: 0}
.layerPop.sign{ left: 0; top: 0; transform: none;  -webkit-transform: none;}
.layerPop>div{ position: absolute; left: 50%; top: 30%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}

.noFile{ font-size: 1.18em; color: #797979; text-align: center; margin: 0 0 30px}
.noFile:before{ content: ''; display: block; background: url(../images/common/noFile.png) no-repeat 0 0; width: 145px; height: 127px; margin: 30px auto 15px}
.fileDel, .fileAdd{ cursor: inherit; position: relative; padding: 0 50px 0 10px !important; font-size: 1em; margin: 0 0 2px}
.fileDel button, .fileAdd button{ position: absolute; right: 0; top: 0; font-size: 0; background: none; width: 35px; height: 40px}
.fileDel button:before, .fileAdd button:before{content: '\268A'; display: inline-block; font-size: 15px; font-weight: 400; color: #989898;}
.fileAdd button:before{ content: '\002B'; font-size: 20px}

/* 공통 폼 클래스 */
select.inputData{ text-indent: 0}
.inputData{ border: 1px solid #d2d2d2; height: 42px; min-width: 10%; text-indent: 5px; box-sizing: border-box; vertical-align: top; margin: 0 0 3px; background: #f2f5f8}
/* .inputData.hasDatepicker{ background: #f8fbfd url(../images/common/calendar.png) no-repeat 95% 50% !important;} */
.inputData.bgWhite{ background: #fff}
.dotL{ position: relative; padding-left: 15px; font-size: 1.06em; font-weight: 400; word-break: keep-all}
.dotL:before{ content: ''; display: block; clear: both; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; background: #3086c9;}
.necessary:before{ content: '\002A'; display: inline-block; line-height: 0.5; color: #ee5a5a; font-size: 25px; position: relative; top: 8px}
.ment_txt{ text-align: center; margin: 20px 0; font-size: 1.2em; font-weight: 500}
.txtIcon{ font-size: 1em; padding-left: 22px; position: relative; margin: 10px 0}
span.txtIcon, strong.txtIcon{ display: inline-block}
.txtIcon:before{ content: ''; display: block; background: url(../images/common/icon2020.png) no-repeat; position: absolute; left: 0; top: 0;}
.txtIcon.help:before{ background-position: -260px -121px; width: 17px; height: 21px;}
.txtIcon.asterisk:before{ background-position: -282px -121px; width: 19px; height: 23px;}
.txtIcon button{ position: absolute; right: 0; top: -10px}
.fileN{ display: inline-block; position: relative; padding: 10px 60px 8px 25px; font-size: 1em; line-height: 1.3; margin: 5px 0;}
.fileN:before{ content: ''; display: block; position: absolute; left: 0; top: 10px; background: url(../images/common/icon2020.png) no-repeat -324px -112px; width: 19px; height: 20px}
.fileN button{ position: absolute; right: 0; top: 0}
.fileN button+button{ right: -50px;}
#gnb .subGnb>ul li a[target='_blank']:after, .lftArea>ul>li>a[target='_blank']:after{ content: ''; background: url(../images/common/icon2020.png) no-repeat -74px -79px; width: 14px; height: 14px;  display: inline-block; margin-left: 7px; opacity: .7;}
#gnb .subGnb>ul li a[target='_blank']:hover:after{ background-position: -74px -63px}
#allNav .allMenu li li a[target='_blank']:after{ content: ''; background: url(../images/common/icon2020.png) no-repeat -74px -63px; width: 14px; height: 14px;  display: inline-block; margin-left: 7px}
.decimalList li{ list-style: decimal outside none; margin: 0.2em 0; margin-left: 10px}
.decimalList li:before{ display: none !important}
.thin{ font-weight: 300}

/* 에러페이지 */
.error{ background: #e6eef6;}
.error>div{ position: relative; width: 700px; margin: 0 auto; background: url(../images/common/error.png) no-repeat 55% 70px; padding-top: 300px; text-align: center;}
.error>div>span{ display: block; position: absolute; background: url(../images/common/ci.png) no-repeat 0 0 / 200px auto; width: 200px; height: 45px; font-size: 0; top: 20px; left: 10%;}
.error>div:before{ content: ''; display: block; position: absolute; border: 0; border-top: 200px solid #ffbcb9; border-left: 300px solid transparent; border-right: 300px solid transparent; width: 0; height: 0; top: 0; left: 50%; transform: translateX(-50%); z-index: -1}
.error>div>strong{ font-size: 2.5em; color: #253356; font-weight: 700; line-height: 1.2; letter-spacing: -0.085em}
.error>div>p{ padding: 30px 0 50px; line-height: 1.4; color: #6b6b6b; font-size: 1.2em; letter-spacing: -0.055em; word-break: keep-all}
.error.working>div{ background: url(../images/common/working.png) no-repeat 55% 70px; padding-top: 320px;}
.error.working>div>strong em{ color: #cf180f}

.detailGrid.inner_pic{ position: relative}
.detailGrid.inner_pic .picArea{ position: absolute; right: 0; top: 1px; background: #eee; z-index: 1; text-align: center; padding: 3px}
.detailGrid.inner_pic .picArea p{ border: 1px solid #ccc; background: #fff; width:180px; height: 210px; vertical-align: middle; text-align: center; overflow: hidden}
.detailGrid.inner_pic .picArea p span{ font-size: 1em; line-height: 1.2; display: block; margin-bottom: 10px; padding-top: 50px;}
.detailGrid.inner_pic .picArea p img{ width: 100%;}
.certiNum{ margin: 5px 0; position: relative}
.certiNum label{ font-size: 0; color: transparent}
.certiNum input[type='text']{ border: 2px solid #bd2329; box-sizing: border-box; height: 42px; padding: 0 70px 0 10px; margin-right: 5px}
.certiNum .countNum{ position: relative; left: -80px; line-height: 40px; color: #bd2329; margin-right: -65px; font-weight: 500;}

/* 2020 08 21 */
.textareaF{ border: 1px solid #d2d2d2; min-width: 10%; text-indent: 5px; box-sizing: border-box; vertical-align: top; margin: 0 0 3px; background: #f2f5f8}
.jcal_outer{ display: inline-block; position: relative; width: 20%}
.jcal_outer .hasDatepicker{ width: 100%}

/* 2020 09 09 통합검색 수정 */
.schWrap.schWrap2{ position: relative}
.schWrap.schWrap2 .schMenu>li, .schWrap.schWrap2 .schMenu>li:first-child, .schWrap.schWrap2 .schMenu>li:last-child{ width: 20%}
.schResult_cont.schResult_cont2{ border: 0}
.schResult_cont.schResult_cont2 .schRgt{ float: left;}
.schResult_cont.schResult_cont2 .schRgt>ul>li a{ display: block; border: 1px solid #ddd; padding: 8px 10px; margin: 0 0 -1px; position: relative}
.schResult_cont.schResult_cont2 .schRgt>ul>li>a:after{ content: '\002B'; display: block; position: absolute; right: 15px; top: 20%}
.schResult_cont.schResult_cont2 .schRgt>ul>li.open>a:after{ content: '\2212';}
.schResult_cont.schResult_cont2 .schRgt>ul>li>a{ background: #f1f1f1; color: #000}
.schResult_cont.schResult_cont2 .schRgt>ul>li.active>a{ font-weight: 600; background: #0a70b9; border-color: #0a70b9; color: #fff}
.schResult_cont.schResult_cont2 .schRgt ul ul{ display: none;}
.schResult_cont.schResult_cont2 .schRgt ul li.open ul{ display: block}
.schResult_cont.schResult_cont2 .schRgt li li a{ border-bottom: 0; border-top: 0; color: #686868; font-size: 0.95em; padding: 5px 10px}
.schResult_cont.schResult_cont2 .schRgt li li:last-child a{ border-bottom: 1px solid #ddd}
.schResult_cont.schResult_cont2 .schContent{ float: right; border: 0; padding: 20px 0 0 30px;}
.schResult_cont.schResult_cont2 .schRgt .issueCht, .schResult_cont.schResult_cont2 .schRgt .my_issue{ margin-left: 0; border: 1px solid #ddd; padding: 5px 10px}
.schResult_cont.schResult_cont2 .schRgt .my_issue{ margin-top: -1px}
.schResult_cont.schResult_cont2 .schRgt .issueCht strong, .schResult_cont.schResult_cont2 .schRgt .my_issue strong{ font-size: 1.12em; line-height: 35px}
.schResult_cont.schResult_cont2 .schContent{ padding-top: 0}
.schResult_cont.schResult_cont2 h2{ border-top: 2px solid #0a70b9; border-bottom: 1px solid #ccc}
.schWrap.schWrap2 .result_counter{ font-weight: 300; font-size: 1.3em; margin: 0 0 20px}
.schWrap.schWrap2 .result_counter strong, .schResult_cont .schContent .result_counter em{ color: #0a70b9; font-weight: 600; font-size: 1.2em}
.schWrap.schWrap2 .result_counter strong:before, .schResult_cont .schContent .result_counter strong:after{ content: '\201C'; display: inline-block;}
.schResult_cont .schContent .result_counter strong:after{ content: '\201D';}
.schWrap.schWrap2 .keyword{ color: #ee5a5a !important;}
.schWrap.schWrap2 .sch_tpBtn{ position: absolute; right: 0; top: 65px}
.schWrap.schWrap2 .sch_tpBtn a{ display: inline-block; border: 1px solid #d3d3d3; line-height: 30px; font-size: 1em; color: #000; padding: 0 20px}
.schWrap.schWrap2 .sch_tpBtn a.active{ border-color: #0a70b9; color: #0a70b9; font-weight: 400}
.schResult_cont .schTabsData ul li{ float: left; width: 50%; margin-right: -1px}
.schResult_cont .schTabsData ul li a{ display: block; border: 1px solid #c5c5c5; border-bottom: 0; text-align: center; line-height:55px; position: relative; font-size: 1.05em}
.schResult_cont .schTabsData ul li.active a{ background: #0a70b9;  border-color: #0a70b9; z-index: 10; color: #fff; font-weight: 600;}
.schResult_cont .schTabsData .default_table thead tr:first-child th{ border-top: 3px solid #0a70b9;}
.schResult_cont h2{ border-top: 2px solid #0a70b9; border-bottom: 1px solid #ccc;}
.schResult_cont h2.bord0{ border: 0}
.schResult_cont h2.first{ border-bottom: 0; padding: 8px 0 0;}
/* 2020 10 16 통합검색 수정 */
#totalSch .schBox .form-group{ margin: 0.5em 0 -0.5em;}
#totalSch .schBox .form-group label{ margin: 0 10px;}
.schWrap.schWrap2 .schMenu>li{ width: 14%}
.schWrap.schWrap2 .schMenu>li:first-child, .schWrap.schWrap2 .schMenu>li:last-child{ width: 15%}
.schWrap.schWrap2 .sch_tpBtn.sch_tp1{ right: 200px}
.schWrap.schWrap2 .connWord strong, .connWord ul{ line-height: 1.5; padding: 8px 0;}
.konan-autocomplete{ background: #D9F1F1;}
.konan-autocomplete .ui-menu{ padding: 0 5px}
.konan-autocomplete .ui-menu li a{ display: block; padding: 5px 10px}
.konan-autocomplete .ui-menu li a:hover{ background: #fff}
.konan-autocomplete .ui-menu li a strong{ display: inline-block; font-weight: 400; color: #ff004c;}
.konan-autocomplete .konan-autocomplete-footer{ position: relative; height: 25px; padding: 9px  10px 7px 10px; border: 1px solid #e6e6e6; background: #fff; letter-spacing: -1px; clear: both;}
.konan-autocomplete .konan-autocomplete-footer .pull-right{ display: block; text-align: right}
.schWrap.schWrap2 .result_counter strong:after{ content: '\201D';}
.schResult_cont.schResult_cont2 a[target='_blank']:after{ width: 0; position: static; height: 0; display: none;}
.schResult_cont.schResult_cont2 .schRgt>ul>li:last-child{ margin-bottom: 20px}
.schResult_cont.schResult_cont2 .schRgt .issueCht{ margin-top: 0}
.schResult_cont .schContent .sch_list>li dd.inList{ padding-bottom: 20px;}
.schResult_cont .schContent .sch_list>li dd.inList a>span{ display: inline-block; width: 48%; margin: 0 0 5px; font-size: 1em; color: #686868; vertical-align: top;}
.schResult_cont .schContent .sch_list>li dd.inList a>span:before{ content: ''; display: inline-block; width: 4px; height: 4px; background: #323232; margin-right: 5px; line-height: 1;position: relative; top: -4px}
.schResult_cont .schContent .sch_list>li dd.inList a>span .dd_tt{ display: inline-block; width: 20%; font-weight: 500}
.schResult_cont .schContent .sch_list>li dd .schListCont:after{ content: ''; display: block; clear: both;}
.schResult_cont .schContent .sch_list>li dd.inList.inImgA .schListCont{ height: 100px; margin-bottom: 10px}
.schResult_cont .schContent .sch_list>li dd.inList.inImgA .schListCont img{ float: left; margin-right: 10px}
.schResult_cont .schContent .sch_list>li dd.inList.inImgA{ padding-bottom: 25px}

/* 판매인교육 메인 */
#container.pes{ margin-top: 90px; background: url(../images/contents/pesBg1.jpg) no-repeat 50% 0;}
#container.pes #content{ background: transparent; padding: 211px 40px 85px; box-sizing: border-box;}
#container.pes #content .h1_slogan{ position: absolute; right: 55px; top: 105px; font-size: 1.6em; color: #323232; font-weight: 400; text-align: right}
#container.pes #content .h1_slogan strong{ display: block; font-size: 1.8em; font-weight: 600; background: linear-gradient(to right, #109037, #1d73b7); -webkit-background-clip: text; -webkit-text-fill-color: transparent; letter-spacing: -0.085em; line-height: 1;}
#container.pes #content .innerCont{ margin: 13px 13px 13px 365px; padding: 0; min-height: 514px;}
#container.pes #content .innerCont>div{ float: left}
#container.pes #content .innerCont .pesMn{ width: 422px; margin-top: 42px; background: rgba(255,255,255,.9); height: 472px; padding: 30px 0 0 25px; box-sizing: border-box}
#container.pes #content .innerCont .pesMn>ul{ margin-top: 30px}
#container.pes #content .innerCont .pesMn>ul>li{ padding-bottom: 15px; background: url(../images/contents/pesMn_bg1.gif) repeat-y 25px 0}
#container.pes #content .innerCont .pesMn>ul li:last-child{ background: transparent}
#container.pes #content .innerCont .pesMn>ul li>button{ display: block; padding-left: 60px; font-size: 1.1em; color: #323232; font-weight: 400; position: relative; line-height: 32px; background: transparent; text-align: left}
#container.pes #content .innerCont .pesMn>ul li.active>button{ font-size: 1.2em; color: #008d8f; font-weight: 500}
#container.pes #content .innerCont .pesMn>ul li>button i{ display: inline-block; width: 35px; height: 35px; border-radius: 50%; background: #80dbdf; position: absolute; left: 8px; text-align: center;}
#container.pes #content .innerCont .pesMn>ul li>button i:before{ content: ''; display: inline-block; background: url(../images/contents/pesMn.png) no-repeat 0 0 / auto 28px; width: 22px; height: 28px; position: relative; top: 3px}
#container.pes #content .innerCont .pesMn ul li:nth-child(2)>button i:before{ background-position: -26px 0; width: 25px;}
#container.pes #content .innerCont .pesMn ul li:nth-child(3)>button i:before{ background-position: -53px 0; width: 23px;}
#container.pes #content .innerCont .pesMn ul li.active>button i:before{ background: url(../images/contents/pesMn.png) no-repeat 0 0 / auto 34px; width: 29px; height: 34px; top: 6px}
#container.pes #content .innerCont .pesMn ul li:nth-child(2).active>button i:before{ background-position: -33px 0; width: 32px;}
#container.pes #content .innerCont .pesMn ul li:nth-child(3).active>button i:before{ background-position: -70px 0; width: 27px;}
#container.pes #content .innerCont .pesMn ul li.active>button i{ width: 50px; height: 50px; background: #008d8f; left: 0; top: -8px; text-align: center}
#container.pes #content .innerCont .pesMn ul li>div{ display: none; padding: 0 30px 30px 60px;}
#container.pes #content .innerCont .pesMn ul li>div p{ color: #008d8f; word-break: keep-all; margin-bottom: 10px}
#container.pes #content .innerCont .pesMn ul li.active>div{ display: block}
#container.pes #content .innerCont .pesMn ul li>div>.button{ background: #03a2a4; margin: 0}
#container.pes #content .innerCont .pesMn ul li>div>.button:after{ background-position: -91px -48px; width: 9px; height: 11px; margin-left: 15px}
#container.pes #content .innerCont .pesMn ul li>div .detailView{ display: none; position: absolute; left: 0; top: 0; background: #fff; width: 842px; height: 515px; z-index: 1}
#container.pes #content .innerCont .pesMn ul li>div .detailView p.txt_orange{ color: #eb6100; font-weight: 300}
#container.pes #content .innerCont .pesMn ul li>div .detailView .detail_tp{ background: #008d8f; padding: 10px 15px 10px 75px; position: relative; font-size: 1em; color: #fff}
#container.pes #content .innerCont .pesMn ul li>div .detailView .detail_tp i{ display: block; position: absolute; left: 15px; background: url(../images/contents/pesMn.png) no-repeat 0 0; width: 43px; height: 50px}
#container.pes #content .innerCont .pesMn ul li:nth-child(2)>div .detailView .detail_tp i{ background-position: -46px 0}
#container.pes #content .innerCont .pesMn ul li>div .detailView .detail_tp strong{ display: block; font-size: 1.25em; font-weight: 500}
#container.pes #content .innerCont .pesMn ul li>div .detailView>ul{ padding: 0 10px}
#container.pes #content .innerCont .pesMn ul li>div .detailView .btnArea{ margin: 10px; text-align: left}
#container.pes #content .innerCont .pesMn ul li>div .detailView .viewClose{ display: block; position: absolute; top: 7px; right: 10px; font-size: 0; padding: 0 10px; background: transparent}
#container.pes #content .innerCont .pesMn ul li>div .detailView .viewClose:before{ content: '\2715'; display: inline-block; font-size: 30px; color: #fff; font-weight: 300}
#container.pes #content .innerCont .pesMn ul li>div .detailView .realDetail{ padding: 0 10px}
#container.pes #content .innerCont .pesMn ul li>div .detailView .btnTabs button[type='button']{ display: inline-block; background: #f3f3f3; border: 1px solid #dadada; font-size: 1em; font-weight: 400; height: 55px; padding: 0 25px; margin: 0 5px 0 0}
#container.pes #content .innerCont .pesMn ul li>div .detailView .btnTabs button.active{ background: #12b8ba; border-color: #12b8ba; font-size: 1.15em; font-weight: 500; color: #fff;}
#container.pes #content .innerCont .pesMn ul li>div .detailView .gridScroll{ margin-top: 10px;}
#container.pes #content .innerCont .pesMn ul li>div .detailView .gridScroll table{ width: 100%}
#container.pes #content .innerCont .pesMn ul li>div .detailView .gridScroll table thead th, #container.pes #content .innerCont .pesMn ul li>div .detailView .gridScroll table tbody td{ padding: 8px 5px; font-size: 1em}
#container.pes #content .innerCont .pesM_rgt{ width: 420px}
#container.pes #content .pesBanner{ height: 445px;}
#container.pes #content .pesBanner a{ display: block; text-align: center; background: #64c5ca}
#container.pes #content .pesBanner a img{ width: 100%}
#container.pes #content .guideCall{ margin-top: 10px; height: 60px; background: #2a8484; box-sizing: border-box; padding: 10px; text-align: center; font-style: italic; font-size: 1.8em; font-weight: 600; color: #fefb00; vertical-align: top; line-height: 1.3}
#container.pes #content .guideCall span{ color: #fff; font-weight: 300; font-size: 0.52em; font-style: normal; display: inline-block; vertical-align: top; text-align: left; line-height: 1.3; margin-right: 10px}

/* MAIN */
#container.main.bg{ background: url(../images/main/main.jpg) no-repeat 50% 90px; height: 1492px; padding-top: 90px; }
#container.main2020{ padding-top: 90px; background: url(../images/main/main_tp2020.jpg) no-repeat 50% 0;}
#container.main2020 .main_tp{ height: 325px; position: relative}
#container.main2020 .main_tp .bx-viewport{ z-index: 2}
#container.main2020 .main_tp .bx-controls-auto, #container.main2020 .main_tp .bx-pager{ position: absolute; left: 120px; top: 220px; z-index: 3}
#container.main2020 .main_tp .bx-controls-auto{ top: 230px}
#container.main2020 .main_tp .bx-controls-auto a{ display: block; width: 28px; height: 28px; font-size: 0}
#container.main2020 .main_tp .bx-controls-auto a:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -29px -44px; width: 28px; height: 28px;}
#container.main2020 .main_tp .bx-controls-auto a.bx-start:before{ background-position: 0 -44px}
#container.main2020 .main_tp .bx-pager{ left: 170px}
#container.main2020 .main_tp .bx-pager>div{ display: inline-block; margin: 0 -2px}
#container.main2020 .main_tp .bx-pager a{ display: inline-block; border: 2px solid transparent; padding: 12px; background: transparent; width: 35px; height: 35px; border-radius: 50%; box-sizing: border-box; font-size: 0; text-align: center; position: relative}
#container.main2020 .main_tp .bx-pager a.active{ border-color: #1d73b7}
#container.main2020 .main_tp .bx-pager a:before{ content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #1d73b7; position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: calc(50% - 5px)}
#container.main2020 .main_tp .bx-prev, #container.main2020 .main_tp .bx-next{ display: block; width: 95px; height: 95px; background: #fff; border: 1px solid #3086c9; position: absolute; top: 95px; z-index: 3; text-align: center; font-size: 0;}
#container.main2020 .main_tp .bx-prev:before, #container.main2020 .main_tp .bx-next:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat; width: 20px; height: 39px; margin-top: 30px; transition: all .2s; -webkit-transition: all .2s;}
#container.main2020 .main_tp .bx-next:before{ background-position: -23px 0}
#container.main2020 .main_tp .bx-prev:hover:before{ margin-left: -25px}
#container.main2020 .main_tp .bx-next{ left: auto; right: 0}
#container.main2020 .main_tp .bx-next:hover:before{ margin-right: -25px}
#container.main2020 .main_tp ul li{ height: 325px}
#container.main2020 .main_tp ul li p{ padding: 85px 0 0 125px; font-size: 1.5em; color: #323232; font-weight: 400; line-height: 1.2;}
#container.main2020 .main_tp ul li p img{ display: block; margin-bottom: 10px}
#container.main2020 .main_tp ul li.slide1{ background: url(../images/main/main_tp2020_img1.png) no-repeat 92% 15px}
#container.main2020 .main_tp ul li.slide2{ background: url(../images/main/main_tp2020_img2.png) no-repeat 88% -55px}
#container.main2020 .main_mid{ height: 330px;}
#container.main2020 .main_mid .midTotalSch{ background: #fff; padding: 25px 0 10px; box-sizing: border-box; height: 90px; text-align: center; vertical-align: top; border-radius: 50px 50px 0 0;}
#container.main2020 .main_mid .midTotalSch h2{ display: inline-block; }
#container.main2020 .main_mid .midTotalSch label{ display: inline-block; font-size: 1em; color: #323232; font-weight: 400; line-height: 50px; margin-right: 15px}
#container.main2020 .main_mid .midTotalSch label:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -60px -27px; width: 38px; height: 28px; margin-right: 10px; vertical-align: middle}
#container.main2020 .main_mid .midTotalSch input[type='text'], #container.main2020 .main_mid .midTotalSch button{ background: #d1e9f3; border-radius: 50px; padding: 0 25px; height: 50px;}
#container.main2020 .main_mid .midTotalSch input[type='text']{ width: 30%}
#container.main2020 .main_mid .midTotalSch button{ background: #3086c9; color: #fff; font-size: 1.1em; margin-left: -20px; padding: 0 40px 0 35px; font-weight: 400;}
#container.main2020 .main_mid .midTotalSch button:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -78px 0; width: 23px; height: 23px; margin-right: 5px; vertical-align: middle; transition: all .2s; -webkit-transition: all .2s;}
#container.main2020 .main_mid .midTotalSch button:hover:before{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: rotateIn; animation-name: rotateIn; animation-duration: 0.5s;}
#container.main2020 .main_mid .favoBox, #container.main2020 .main_mid .pesSchBox{ float: left; width: 50%; height: 240px; box-sizing: border-box; padding: 15px 20px; position: relative}
#container.main2020 .main_mid h2{ font-size: 1.3em; color: #fff; font-weight: 500; line-height: 1.5; padding: 0 0 15px}
#container.main2020 .main_mid .favoBox h2, #container.main2020 .main_mid .pesSchBox h2{ font-size: 1.4em; padding: 0 0 12px; text-align: center}
#container.main2020 .main_mid h2 span{ display: inline-block; margin: 0 0 0 15px; font-weight: 300; font-size: 0.8em}
#container.main2020 .main_mid .favoBox{ background: #12b8ba; border-radius: 0 0 0 50px;}
#container.main2020 .main_mid .favoBox h2 span{ font-size: 0}
#container.main2020 .main_mid .favoBox .swiper-container{ height: 170px; padding: 0 45px}
#container.main2020 .main_mid .favoBox .swiper-button-next:after, #container.main2020 .main_mid .favoBox .swiper-button-prev:after{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -47px 0; width: 13px; height: 22px; }
#container.main2020 .main_mid .favoBox .swiper-button-next:after{ background-position: -63px 0}
#container.main2020 .main_mid .favoBox .swiper-button-next, #container.main2020 .main_mid .favoBox .swiper-button-prev{top: 0; height: 100%; margin: 0; background: #12b8ba; width: 45px;}
#container.main2020 .main_mid .favoBox .swiper-button-prev{ left: -10px;}
#container.main2020 .main_mid .favoBox .swiper-button-next{ right: -10px}
#container.main2020 .main_mid .favoBox .swiper-button-next:after, #container.main2020 .main_mid .favoBox .swiper-button-prev:after{ position: relative; top: -20%}
#container.main2020 .main_mid .favoBox ul li{ text-align: center; margin-top: 10px}
#container.main2020 .main_mid .favoBox ul li a{ display: block; font-size: 1.15em; color: #323232; font-weight: 400; line-height: 1.2; word-break: keep-all;}
#container.main2020 .main_mid .favoBox ul li a i{ display: block; width: 100px; height: 100px; border-radius: 50%; background: #fff; margin: 0 auto 10px; position: relative;  transition: all .2s; -webkit-transition: all .2s;}
#container.main2020 .main_mid .favoBox ul li a:hover i{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: swing; animation-name: swing; animation-duration: 0.5s; animation-iteration-count: infinite;}
#container.main2020 .main_mid .favoBox ul li a i:before{ content: ''; display: block; background: url(../images/main/ic_mn2020.png) no-repeat; width: 48px; height: 55px; position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: 22px}

#container.main2020 .main_mid .favoBox ul li a i.ic_m1:before{ background-position: 0 0; width: 44px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m2:before{ background-position: -47px 0;}
#container.main2020 .main_mid .favoBox ul li a i.ic_m3:before{ background-position: -98px 0; width: 38px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m4:before{ background-position: -140px 0;}
#container.main2020 .main_mid .favoBox ul li a i.ic_m5:before{ background-position: -189px 0; width: 52px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m6:before{ background-position: -247px 0; width: 36px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m7:before{ background-position: -290px 0; width: 50px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m8:before{ background-position: -347px 0; width: 32px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m9:before{ background-position: -386px 0; width: 37px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m10:before{ background-position: -427px 0; width: 55px}
#container.main2020 .main_mid .favoBox .favoSetting{ position: absolute; right: 15px; top: 20px; text-align: center; width: 30px; height: 30px; background: transparent; font-size: 0;}
#container.main2020 .main_mid .favoBox .favoSetting:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -105px 0; width: 16px; height: 17px; }
#container.main2020 .main_mid .pesSchBox{ background: #2b4eac; border-radius: 0 0 50px 0; overflow: hidden; padding: 0;}
#container.main2020 .main_mid .pesSchBox .inPesSch{ display: none; height: 100%}
#container.main2020 .main_mid .pesSchBox .inPesSch:after{ content: ''; display: block; clear: both;}
#container.main2020 .main_mid .pesSchBox .inPesSch .schBox{ float: left; width: calc(100% - 180px); padding: 15px 20px; box-sizing: border-box; height: 100%; background: #3086c9 url(../images/main/sch_bg2020.png) no-repeat 120px -25px}
#container.main2020 .main_mid .pesSchBox .inPesSch.inPesSch2 .btnSch{ background: #3086c9}
#container.main2020 .main_mid .pesSchBox .inPesSch.inPesSch2 .schBox{ background: #2b4eac url(../images/main/sch_bg2020.png) no-repeat 120px -25px}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch{ float: left; width: 180px; padding: 50px 15px 15px 15px; box-sizing: border-box; height: 100%; text-align: center}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch h2{ padding: 0 0 10px;  text-align: left}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch span{ margin: 0 0 15px; font-size: 0.8em; opacity: .9;}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSchView{ width: 65px; height: 65px; border-radius: 50%; background: #00a9dd; color: #fff; font-size: 0.93em}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSchView:before{ content: ''; display: block; background: url(../images/main/ic_main2020.png) no-repeat -110px -26px; width: 35px; height: 7px; margin: 0 auto 5px}
#container.main2020 .main_mid .pesSchBox .inPesSch.inPesSch1 .btnSchView:before{ background-position: -110px -39px}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSchView.btnSchView1{ background: #00a9dd}
#container.main2020 .main_mid .pesSchBox .inPesSch .schBox .afterClear{ width: 100%}
#container.main2020 .main_mid .pesSchBox .inPesSch .schBox .afterClear>div{ width: 49%}
#container.main2020 .main_mid .pesSchBox .inPesSch .schBox .inputData{ height: 35px; width: 100%; box-sizing: border-box; background: #d1e9f3; margin-bottom: 5px; border: 0}
#container.main2020 .main_mid .pesSchBox .inPesSch .schBox .button{ background: #2b4eac; color: #fff; width: 100%; height: 40px; line-height: 40px; margin: 0; font-size: 1.1em}
#container.main2020 .main_mid .pesSchBox .inPesSch.inPesSch2 .schBox .button{ background: #3086c9}
#container.main2020 .main_mid .pesSchBox .inPesSch.active{ display: block}
#container.main2020 .main_btm{ margin: 30px auto 0}
#container.main2020 .main_btm>div{ margin-bottom: 30px; overflow: hidden; overflow-x: auto;}
#container.main2020 .main_btm .btmCounter{ }
#container.main2020 .main_btm .btmCounter>ul{ display: table; width: 1300px;}
#container.main2020 .main_btm .btmCounter>ul li{ display: table-cell; width: 216px; text-align: center}
#container.main2020 .main_btm .btmCounter>ul li i{ display: block; height: 82px; border-left: 1px solid #c9c9d4}
#container.main2020 .main_btm .btmCounter>ul li:first-child i{ border: 0}
#container.main2020 .main_btm .btmCounter>ul li i:before{ content: ''; display: block; margin: 0 auto; background: url(../images/main/ic_main2020.png) no-repeat; height: 75px;}
#container.main2020 .main_btm .btmCounter>ul li:hover i:before{  -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: swing; animation-name: swing; animation-duration: 0.5s; animation-iteration-count: infinite;}
#container.main2020 .main_btm .btmCounter>ul li.je i:before{ background-position: 0 -80px; width: 63px}
#container.main2020 .main_btm .btmCounter>ul li.su i:before{ background-position: -66px -80px; width: 71px;}
#container.main2020 .main_btm .btmCounter>ul li.pa i:before{ background-position: -141px -80px; width: 82px}
#container.main2020 .main_btm .btmCounter>ul li.pa2 i:before{ background-position: 0 -155px; width: 67px}
#container.main2020 .main_btm .btmCounter>ul li.no i:before{ background-position: -70px -155px; width: 85px}
#container.main2020 .main_btm .btmCounter>ul li.ky i:before{ background-position: -156px -155px; width: 68px}
#container.main2020 .main_btm .btmCounter>ul li span, #container.main2020 .main_btm .btmCounter>ul li a{ display: block; font-size: 1.15em; color: #323232; font-weight: 400}
#container.main2020 .main_btm .btmCounter>ul li span:before{ content: '농약현황정보'; display: inline-block; font-size: 0.85em; font-weight: 200; margin-right: 5px; line-height: 1.2}
#container.main2020 .main_btm .btmCounter>ul li a strong{ display: inline-block; font-size: 1.6em; font-weight: 600; color: #3086c9}
#container.main2020 .main_btm .btmWeekInfo .infoBox{ width: 49.5%; background: #f9f9f9; border: 1px solid #d7d7d7; padding: 15px 15px 10px; box-sizing: border-box; position: relative}
#container.main2020 .main_btm .btmWeekInfo .infoBox h2{ display: inline-block; font-size: 1.1em; font-weight: 400; margin: 0 20px 0 0; vertical-align: top;}
#container.main2020 .main_btm .btmWeekInfo .infoBox h2:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -60px -58px; width: 22px; height: 22px; vertical-align: middle; margin-right: 5px}
#container.main2020 .main_btm .btmWeekInfo .infoBox.fr h2:before{ background-position: -85px -58px}
#container.main2020 .main_btm .btmWeekInfo .infoBox a{ display: inline-block; color:#686868; line-height: 1.5; width: 70%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
#container.main2020 .main_btm .btmWeekInfo .infoBox .more, #container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont .more{ position: absolute; right: 0; top: 0; line-height: 50px; width: 50px; height: 50px; text-align: center; font-size: 0}
#container.main2020 .main_btm .btmWeekInfo .infoBox .more:before, #container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont .more:before, #container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont .more:before{ content: '\002B'; display: inline-block; font-size: 23px; color: #323232; font-weight: 500}
#container.main2020 .main_btm .btmNotiA{ }
#container.main2020 .main_btm .btmNotiA .tablsNoti{ width: calc(100% - 365px - 10px); position: relative;}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont>div{ display: none; padding-top: 50px; height: 280px; position: relative}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li{ margin: 10px 0 0 0; float: left; width: 33.33%;}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li a{ display: block; background: #fff; border: 1px solid #ccc; border-radius: 10px; box-sizing: border-box; padding: 20px 15px; margin-right: 15px; height: 130px; transition: all .2s; -webkit-transition: all .2s;}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li a span{ display: block; color: #0070c0}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li a strong{ display: block; margin-top: 10px; height: 60px; overflow: hidden; font-size: 1.15em; font-weight: 400; color: #4d4c4c; line-height: 1.4; word-break: keep-all}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li a:hover{ border: 3px solid #0070c0}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont .more{ right: 15px; top: 5px; border: 1px solid #ccc; height: 45px; line-height: 45px; box-sizing: border-box;}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont .more:before{ color: #898989}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont h2{ position: absolute; left: 0; top: 0; width: 200px; height: 50px; line-height: 50px; border: 1px solid #ccc; text-align: center;border-radius: 50px; box-sizing: border-box; font-size: 1.1em; z-index: 1; transition: all .2s; -webkit-transition: all .2s;}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont+.tablsNotiCont h2{ left: 170px}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont.active h2{ background: #0070c0; border-color: #0070c0; z-index: 2}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont h2 button{ display: block; width: 100%; height: 100%; background: transparent}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont.active h2 button{ color: #fff; font-size: 1.2em; font-weight: 500; }
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont.active>div{ display: block}
#container.main2020 .main_btm .btmNotiA .popNoti{ width: 365px; position: relative}
#container.main2020 .main_btm .btmNotiA .popNoti h2{ height: 50px; line-height: 50px; font-size: 1.3em; font-weight: 500;}
#container.main2020 .main_btm .btmNotiA .popNoti .bx-wrapper{ height: 280px; padding-top: 10px; box-sizing: border-box;}
#container.main2020 .main_btm .btmNotiA .popNoti ul, #container.main2020 .main_btm .btmNotiA .popNoti ul li{ height: 270px; }
#container.main2020 .main_btm .btmNotiA .popNoti ul li a{ display: block;  border-radius: 10px; width: 100%; height: 100%; overflow: hidden; position: relative}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a img{ width: 100%}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a span{ display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 35%; background: linear-gradient(0deg, rgba(0,0,0,0.9) 40%, rgba(0,0,0,0.7) 60%, rgba(0,0,0,0.3) 80%, rgba(0,0,0,0) 90%); box-sizing: border-box; color:#fff; padding: 25px 10px 0}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a span strong{ display: block; width: 80%; font-size: 1em; font-weight: 300; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a span strong em{ display: block; font-size: 1.25em; font-weight: 500}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a .date{ display: block; position: absolute; right: 10px; bottom: 15px;}
#container.main2020 .main_btm .btmNotiA .popNoti .bx-controls{ position: absolute; right: 0; top: 5px}
#container.main2020 .main_btm .btmNotiA .popNoti .bx-controls a{ display: inline-block; width: 50px; height: 45px; line-height: 45px; border: 1px solid #ccc; margin-left: -1px; font-size: 0; text-align: center}
#container.main2020 .main_btm .btmNotiA .popNoti .bx-controls a:after{ content: '\276E'; display: inline-block; font-size: 18px; color: #ababab}
#container.main2020 .main_btm .btmNotiA .popNoti .bx-controls a.bx-next:after{ content: '\276F';}
#container.main2020 .main_btm .btmLnkA{ background: #f9f9f9; border: 1px solid #ccc; padding: 20px 0;}
#container.main2020 .main_btm .btmLnkA a{ display: inline-block; box-sizing: border-box; display: table-cell; vertical-align: middle; width: 230px; padding-left: 90px; position: relative;}
#container.main2020 .main_btm .btmLnkA a strong{ display: block; font-weight: 400; font-size: 1.1em; word-break: keep-all}
#container.main2020 .main_btm .btmLnkA .icLnk{ width: 420px; padding: 0 30px; vertical-align: top;}
#container.main2020 .main_btm .btmLnkA .icLnk strong{ font-size: 1.25em}
#container.main2020 .main_btm .btmLnkA a span{ display: block; margin-top: 10px; line-height: 1.3; font-weight: 300; word-break: keep-all; color: #6a6a6a}
#container.main2020 .main_btm .btmLnkA a:first-child{ padding-left: 130px}
#container.main2020 .main_btm .btmLnkA a:last-child{ border-left: 1px dashed #ccc; padding-right: 130px}
#container.main2020 .main_btm .btmLnkA a em{ display: block; position: absolute; top: 0; right: 45px; background: #f75d1f; color: #fff; line-height: 25px; border-radius: 25px; padding: 0 15px}
#container.main2020 .main_btm .btmLnkA a:last-child em{ left: 170px; right: auto}
#container.main2020 .main_btm .btmLnkA a i{ display: block; position: absolute; left: 15px; top: 0; z-index: 1;}
#container.main2020 .main_btm .btmLnkA a i:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat 0 -230px; width: 95px; height: 88px;}
#container.main2020 .main_btm .btmLnkA a:hover i:after{ width:60px; height: 60px; }
#container.main2020 .main_btm .btmLnkA a:first-child i{ left: 25px; top: -10px}
#container.main2020 .main_btm .btmLnkA a:last-child i{ right: 30px; left: auto; top: 0}
#container.main2020 .main_btm .btmLnkA a:last-child i:before{ background-position: 0 -321px}
#container.main2020 .main_btm .btmLnkA a.pum i:before{ background-position: -98px -230px; width: 58px}
#container.main2020 .main_btm .btmLnkA a.su i:before{ background-position: -157px -230px; width: 61px}
#container.main2020 .popFaveAdd{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 320; background: rgba(0,0,0,.68);}
#container.main2020 .popFaveAdd .favoBoxL{ width: 1300px; margin: 170px auto}
#container.main2020 .popFaveAdd .favoBoxL h2{ text-align: center; font-size: 2em}

/* MAIN 2 추가 */
#container.main2020 .main_btm.main_btm2{ margin-top: 20px; max-width: 1280px;}
#container.main2020 .main_btm.main_btm2>div{ margin-bottom: 0}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti{ width: calc(100% - 340px - 5px);}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont h2{ width: 20%; border-radius: 0; height: 55px; line-height: 55px}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont h2 button{ margin-right: -1px; font-size: 1em;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont.active h2 button{ text-align: left; text-indent: 15px; font-size: 1.12em}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont+.tablsNotiCont h2{ left: calc(20% - 1px)}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont+.tablsNotiCont+.tablsNotiCont h2{ left: calc(40% - 2px)}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont+.tablsNotiCont+.tablsNotiCont+.tablsNotiCont h2{ left: calc(60% - 3px)}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont+.tablsNotiCont+.tablsNotiCont+.tablsNotiCont+.tablsNotiCont h2{ left: calc(80% - 4px); width: calc(20% - 6px)}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .more{ right: auto; left: calc(20% - 50px); z-index: 10; border: 0;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .noti .more{ left: calc(40% - 51px);}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .data .more{ left: calc(60% - 52px);}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .qna .more{ left: calc(80% - 53px);}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .edu .more{ left: calc(100% - 60px);}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .more:before{ color: #fff}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont>div{ padding-top: 75px; height: 170px}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li{ margin: 0}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a{ height: 170px; padding: 15px 15px 0; border-radius: 0; margin-right: 10px; position: relative; z-index: 1}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a:after{ content: ''; display: block; background: url(../images/main/ic_main2020.png) no-repeat -95px -323px; width: 60px; height: 60px; position: absolute; right: 10px; bottom: 10px; z-index: -1;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a:hover:after{ right: 12px; bottom: 12px}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont>div ul li.data a:after{ background-position: -219px -323px;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont>div ul li.qna a:after{ background-position: -157px -323px;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont>div ul li.edu a:after{ background-position: -281px -323px;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a strong{ height: 55px; font-size: 1.17em;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a em{ display: block; height: 50px; overflow: hidden; color: #8c8c8c; line-height: 1.5; padding-right: 60px;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti{ width: 340px}
#container.main2020 .main_btm.main_btm2 h2{ position: absolute; z-index: 60; color: #fff; height: 55px;  line-height: 55px; font-size: 1.2em; text-indent: 15px; font-weight: 500;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-wrapper{ padding-top: 0; height: 245px;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti ul, #container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti ul li{ height: 245px}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti ul li a{ border-radius: 0}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-controls{ z-index: 60; right: 10px}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-controls a{ border: 0; width: 30px;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-controls a:after{ color: #fff}

#container.main2020 .main_btm.main_btm2 .btmPesA{ margin-top: 20px; overflow: hidden}

#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes{ width: 613px; height: 250px; margin-right: 10px; position: relative; border: 1px solid #ccc; box-sizing: border-box}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont>div{ display: none; padding-top: 55px; height: 193px; position: relative; background: #f6f8fa}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont ul{ padding: 10px}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont ul li a{ display: table; width: 100%}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont ul li a span{ float: left; display: table-cell; line-height: 34px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; text-indent: 10px}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont ul li a span.txt_ac{ text-indent: 0}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont>div .more, #container.main2020 .main_btm.main_btm2 .btmPesA .pesListA .more{ display: none; position: absolute; width: 45px; height: 55px; line-height: 55px; left: calc(33% - 45px); top: 0; z-index: 30; font-size: 0; text-align: center;}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont .more:before{ color: #323232}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont.active>div .more{ display: block}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont+.tabsPesCont .more{ left: calc(66% - 45px); }
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont+.tabsPesCont+.tabsPesCont .more{ left: calc(100% - 45px); }
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont h2{ position: absolute; left: 0; top: 0; width: 33%; height: 55px; line-height: 55px; border: 1px solid #ccc; border-left: 0; border-top: 0; text-align: center; box-sizing: border-box; font-size: 1em; z-index: 1; transition: all .2s; -webkit-transition: all .2s; background: #fff}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont +.tabsPesCont  h2{ left: calc(33% - 1px); border-left: 1px solid #ccc; }
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont +.tabsPesCont+.tabsPesCont  h2{ left: calc(66% - 2px); width: calc(34% + 3px)}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont.active h2{ background: #f6f8fa; border-bottom: 0; z-index: 2}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont h2 button{ display: block; width: 100%; height: 100%; background: transparent}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont.active h2 button{ color: #323232; font-size: 1.12em; font-weight: 500; text-align: left; text-indent: 15px}
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes .tabsPesCont.active>div{ display: block}

#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA{ width: 302px; height: 250px; background: #03a2a4; position: relative}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA h2{ position: static}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA ul{ background: #12b8ba; height: 195px; box-sizing: border-box; padding: 10px}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA ul li a{ display: block; text-indent: 10px; line-height: 34px; color: #fff}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA .more{ display: block; left: auto; right: 0}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA .more:before{ content: '\002B'; display: inline-block; font-size: 23px; color: #fff; font-weight: 500;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA{ width: 340px; height: 250px; background: #3086c9}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA h2{ text-align: center; position: static; text-indent: 0}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA h2:before{ /* content: ''; */ display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -150px 0; width: 48px; height: 28px; vertical-align: middle; margin-right: 8px}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp{ text-align: center; height: 125px}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a{ display: inline-block; width: 32%}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a *{ display: block;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a span{ width: 85px; height: 85px; background: #bbe6fb; border-radius: 50%; margin: 0 auto; position: relative}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a span:before, #container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a i:before, #container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -210px 0; width: 37px; height: 45px; margin: 17px 0 0;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a:hover span:before{  -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: swing; animation-name: swing; animation-duration: 0.5s; animation-iteration-count: infinite;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a:nth-child(2) span:before{ background-position: -252px 0; width: 34px}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a:nth-child(3) span:before{ background-position: -291px 0; width: 34px}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a em{ color: #fff; line-height: 35px}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a i{ width: 26px; height: 26px; border-radius: 50%; background: #fff; position: absolute; bottom: 0; right: 0; font-size: 0}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a i:before{ background-position: -184px -34px; width: 13px; height: 9px; margin-top: 10px}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown{ background: #00a9dd; height: 70px; padding: 13px 15px 0; box-sizing: border-box}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a{ display: inline-block; box-sizing: border-box; padding: 0 30px 0 40px; color: #fff; position: relative; line-height: 1.3}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a:before{ background-position: -150px -34px; width: 30px; height: 32px; margin: 0; position: absolute; left: 0; top: 8px}

#container.main2020 .main_btm.main_btm3{ margin-top: 20px; background: url(../images/main/btmCounter_bg.gif) no-repeat 50% 0; padding: 15px 0 25px}
#container.main2020 .main_btm.main_btm3 .btmCounter{ margin: 0 auto; max-width: 1300px;}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li i{ width: 120px; height: 120px; margin: 0 auto 10px; background: #fff; border-radius: 50%;}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li i:before{ position: relative; top: 25px; height: 65px;}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li:hover i:before{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: swing; animation-name: swing; animation-duration: 0.5s; animation-iteration-count: infinite;}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li.je i:before{ background-position: -226px -79px; width: 59px}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li.su i:before{ background-position: -288px -79px; width: 59px}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li.pa i:before{ background-position: -226px -146px; width: 69px}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li.pa2 i:before{ background-position: -299px -146px; width: 56px}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li.no i:before{ background-position: -226px -213px; width: 68px}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li.ky i:before{ background-position: -298px -213px; width: 56px}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li span{ font-weight: 500}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li span:before{ color: #212121; font-weight: 300}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li a{ line-height: 1}

/* MAIN 20201207 수정 */
#container.main2020 .main_tp ul li.slideProc p{ display: inline-block; padding: 85px 0 0 125px;}
#container.main2020 .main_tp ul li.slideProc p strong{ display: block; font-size: 1.7em; color: #1d73b7; font-weight: 600}
#container.main2020 .main_tp ul li.slideProc .processU{ display: inline-block; padding: 65px 0 0 70px; vertical-align: top; width: 55%}
#container.main2020 .main_tp ul li.slideProc .processU li{ height: auto; display: inline-block; width: 24%; position: relative; text-align: center; vertical-align: top;}
#container.main2020 .main_tp ul li.slideProc .processU li:after{ content: ''; display: block; position: absolute; right: -10px; top: 40px; background: url(../images/main/ic_main2020.png) no-repeat -184px -53px; width: 21px; height: 24px}
#container.main2020 .main_tp ul li.slideProc .processU li:last-child:after{ width: 0}
#container.main2020 .main_tp ul li.slideProc .processU li i, #container.main2020 .main_tp ul li.slideProc .processU li strong{ display: block;  letter-spacing: -0.085em}
#container.main2020 .main_tp ul li.slideProc .processU li i{ width: 118px; height: 118px; border-radius: 50%; background: #e5e5e5; margin: 0 auto;}
#container.main2020 .main_tp ul li.slideProc .processU li i:before{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat; height: 68px; margin-top: 25px}
#container.main2020 .main_tp ul li.slideProc .processU li em{ display: inline-block; font-size: 1.1em; font-weight: 500; margin: 10px 0 0;}
#container.main2020 .main_tp ul li.slideProc .processU li em:after{ content: ''; display: block; width: 100%; height: 1px; background: #0074bb; margin: 5px 0;}
#container.main2020 .main_tp ul li.slideProc .processU li strong{ color: #0074bb; font-size: 1.2em; line-height: 1.3; margin-top: 10px; position: relative; z-index: 10;}
#container.main2020 .main_tp ul li.slideProc .processU li strong:before{ content: ''; display: block; width: 10px; height: 10px; border: 2px solid #0074bb; border-radius: 50%; box-sizing: border-box; margin: -20px auto 0; background: #fff}
#container.main2020 .main_tp ul li.slideProc .processU.ul1 li:nth-child(1) i:before{ background-position: 0 -423px; width: 57px}
#container.main2020 .main_tp ul li.slideProc .processU.ul1 li:nth-child(2) i:before{ background-position: -68px -423px; width: 43px}
#container.main2020 .main_tp ul li.slideProc .processU.ul1 li:nth-child(3) i:before{ background-position: -118px -423px; width: 63px}
#container.main2020 .main_tp ul li.slideProc .processU.ul1 li:nth-child(4) i:before{ background-position: -185px -423px; width: 58px}

#container.main2020 .main_mid .midTotalSch{ position: relative}
#container.main2020 .main_mid .midTotalSch h2{ vertical-align: top}
#container.main2020 .main_mid .pop_schWord{ position: absolute; right: 55px; top: 25px; width: 260px; text-align: left; display: table;}
#container.main2020 .main_mid .pop_schWord>span{ font-size: 0.875em; color: #000; line-height: 50px; font-weight: 500; display: table-cell; width: 85px;}
#container.main2020 .main_mid .pop_schWord>span:before{ content: '\2605'; display: inline-block; color: #0086cc}
#container.main2020 .main_mid .pop_schWord ul li>a{ display: inline-block; width: 70%; white-space: nowrap; word-break: break-all; text-overflow: ellipsis; overflow: hidden; text-decoration: underline}
#container.main2020 .main_mid .pop_schWord .bx-controls{ display: table-cell; position: absolute; right: 0; top: 10px; z-index: 50;}
#container.main2020 .main_mid .pop_schWord .bx-controls a{ display: inline-block; width: 27px; height: 25px; line-height: 23px; border: 1px solid #98a5b3; box-sizing: border-box; font-size: 0; text-align: center; margin: 0 1px;}
#container.main2020 .main_mid .pop_schWord .bx-controls a:after{ content: '\276E'; display: inline-block; font-size: 15px; color: #8a8a8a;}
#container.main2020 .main_mid .pop_schWord .bx-controls a.bx-next:after{ content: '\276F';}
#container.main2020 .main_mid .pop_schWord .schWord{ display: inline-block; vertical-align: top; width: 100%; height: 30px}
#container.main2020 .main_mid .midTotalSch input[type='text']{ width: 23%;}
#container.main2020 .main_mid .midTotalSch button{ padding: 0 30px 0 25px}
#container.main2020 .main_mid .favoBox ul li a{ color: #fff}
#container.main2020 .main_mid .favoBox ul li a i{ background: transparent; border: 1px solid #fff;}
#container.main2020 .main_mid .favoBox ul li a i:before{ content: ''; display: block; background: url(../images/main/ic_mn2020.png) no-repeat 0 -60px; height: 69px; position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: 13px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m1:before{ background-position: 0 -60px; width: 55px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m2:before{ background-position: -57px -60px; width: 53px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m3:before{ background-position: -115px -60px; width: 55px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m4:before{ background-position: -178px -60px; width: 79px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m5:before{ background-position: -266px -60px; width: 62px}
#container.main2020 .main_mid .favoBox ul li a i.ic_m6:before{ background-position: -334px -60px; width: 60px}

#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti{ width: calc(100% - 380px - 5px);}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti{ width: 380px;}
#container.main2020 .main_btm .btmCounter>ul li span:before{ width: 0; font-size: 0; overflow: hidden}
#container.main2020 .main_btm .btmNotiA .popNoti h2{ color: transparent}
#container.main2020 .main_btm .btmNotiA .popNoti .stopNoti a span{ position: absolute; width: 0; height: 0; overflow: hidden; font-size: 0; padding: 0}
#container.main2020 .btmPesInfo{ margin-top: 20px}
#container.main2020 .btmPesInfo>div{ float: left; height: 210px;}
#container.main2020 .main_btm.main_btm2 .btmPesInfo h2{ display: block; text-align: center; position: static;}
#container.main2020 .btmPesInfo .pesEduMov{ width: 587px; margin-right: 10px; background: url(../images/main/pesEduMov.jpg) no-repeat 0 0; background-size: cover; position: relative; z-index: 1;}
#container.main2020 .btmPesInfo .pesEduMov ul{ text-align: center; margin: 15px auto 0; width: 85%}
#container.main2020 .btmPesInfo .pesEduMov ul li{ display: inline-block; width: 23%; vertical-align: top;}
#container.main2020 .btmPesInfo .pesEduMov ul li a{ display: block;}
#container.main2020 .btmPesInfo .pesEduMov ul li a i, #container.main2020 .btmPesInfo .pesEduMov ul li a em{ display: block; margin: 0 auto;}
#container.main2020 .btmPesInfo .pesEduMov ul li a i{ width: 85px; height: 85px; border-radius: 50%; background: rgba(0,0,0,.5); position: relative; transition: all .2s; -webkit-transition: all .2s;}
#container.main2020 .btmPesInfo .pesEduMov ul li a i:before, #container.main2020 .btmPesInfo .pesEduMov ul li a i:after{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -331px 0}
#container.main2020 .btmPesInfo .pesEduMov ul li a i:before{ width: 30px; height: 33px; margin-top: 26px}
#container.main2020 .btmPesInfo .pesEduMov ul li.mn2 a i:before{ background-position: -365px 0}
#container.main2020 .btmPesInfo .pesEduMov ul li.mn3 a i:before{ background-position: -399px 0; width: 32px}
#container.main2020 .btmPesInfo .pesEduMov ul li.more a i:before{ content: '\002B'; background: none; font-size: 2.5em; color: #fff; line-height: 1; margin-top: 23px;}
#container.main2020 .btmPesInfo .pesEduMov ul li.more a i:after{ width: 0}
#container.main2020 .btmPesInfo .pesEduMov ul li a:hover i:before, #container.main2020 .btmPesInfo .manualArea .manualMov:hover i:before{-webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: swing; animation-name: swing; animation-duration: 0.5s; animation-iteration-count: infinite;}
#container.main2020 .btmPesInfo .pesEduMov ul li.more a:hover i:before{ -webkit-animation-name: none; animation-name: none;}
#container.main2020 .btmPesInfo .pesEduMov ul li a i:after, #container.main2020 .btmPesInfo .manualArea .manualMov i:after{ width: 26px; height: 26px; position: absolute; right: 0; bottom: 0; background-position: -435px 0}
#container.main2020 .btmPesInfo .pesEduMov ul li a em{ color: #fff; font-weight: 500; line-height: 1.2; margin-top: 5px; word-break: keep-all}
#container.main2020 .btmPesInfo .pesEduMov:before{ content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0,0,0,.3); z-index: -1;}
#container.main2020 .btmPesInfo .banPls{ width: 288px; background: #000; margin-right: 15px; background: #1180d2 url(../images/main/banPls.jpg) no-repeat 0 0 / 100% auto; text-align: center;}
#container.main2020 .btmPesInfo .banPls h2 span{ display: block; font-size: 0.8em; font-weight: 300; line-height: 1; letter-spacing: 1px; margin-top: -7px}
#container.main2020 .btmPesInfo .banPls>p{ padding: 10px 10px 15px; color: #fff; font-size: 0.95em; word-break: keep-all}
#container.main2020 .btmPesInfo .banPls>p:before{ content: ''; display: inline-block; width: 278px; height:12px; background: url(../images/main/ic_main2020.png) no-repeat -10px -405px; position: relative; top: -5px}
#container.main2020 .btmPesInfo .manualArea{ width: 380px; background: #eff3f8; margin-right: 0; border: 1px solid #d8dadb; box-sizing: border-box; position: relative}
#container.main2020 .btmPesInfo .manualArea h2{ background: #e0e8f1; color: #323232; border-bottom: 1px solid #d8dadb;}
#container.main2020 .btmPesInfo .manualArea .manualMov{ display: block; position: absolute; left: 0; top: 65px; width: 140px; height: 140px; text-align: center}
#container.main2020 .btmPesInfo .manualArea .manualMov i{ display: block; width: 100px; height: 100px; border-radius: 50%; background: #cbd7e5; margin: 7px auto 5px; position: relative}
#container.main2020 .btmPesInfo .manualArea .manualMov i:before, #container.main2020 .btmPesInfo .manualArea .manualMov i:after{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat}
#container.main2020 .btmPesInfo .manualArea .manualMov i:after{ background-position: -435px 0;}
#container.main2020 .btmPesInfo .manualArea .manualMov i:before{ background-position:-356px -46px; width: 46px; height: 57px; margin-top: 20px}
#container.main2020 .btmPesInfo .manualArea .manualD{ margin: 10px 10px 0 150px; height: 140px; overflow-y: scroll}
#container.main2020 .btmPesInfo .manualArea .manualD a{ display: block; line-height: 1.4; margin: 5px 0 0; font-weight: 400; position: relative; z-index: 1;  transition: all .2s; -webkit-transition: all .2s;}
#container.main2020 .btmPesInfo .manualArea .manualD a:hover{ font-size: 1.08em; text-indent: 10px; font-weight: 600}
#container.main2020 .btmPesInfo .manualArea .manualD a:after{ content: ''; display: inline-block; background: url(../images/main/ic_main2020.png) no-repeat -465px 0; width: 15px; height: 14px; margin-left: 10px}
#container.main2020 .btmPesInfo .manualArea .manualD a:hover{ transition: all .2s; -webkit-transition: all .2s;}
#container.main2020 .btmPesInfo .manualArea .manualD a:hover:before{ content: ''; display: inline-block; width: 100%; height: 5px; background: #fff; position: absolute; left: 0; top: 8px; z-index: -1}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li.su2 i:before{ background-position: -359px -146px; width: 72px}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li.si i:before{ background-position: -435px -146px; width: 42px}

/* 병해충 방제정보 */
.sch_theme{ background: url(../images/common/sch2_bg2020.png) no-repeat 98% 100%; padding: 10px 0 25px 10px; margin-top: 20px}
.sch_theme p{ color: #666; line-height: 1.4}
.sch_theme p strong{ display: block; font-size: 1.2em; color: #323232; margin-bottom: 10px; font-weight: 600}
.sch_theme p strong em{ color: #ee5a5a}
.sch_theme p+p{ margin-top: 15px}
.sch_theme p+p span{ display: inline-block; margin-right: 35px; line-height: 1.5; color: #000; font-size: 0.95em}
.sch_theme p+p span em{ display: inline-block; background: #e3e3e3; border-radius: 5px; padding: 5px 10px;}
.sch_theme p+p span a{ display: inline-block; padding-left: 10px; font-weight: 600}
.sch_theme p+p span a:after{ content: ''; background:  url(../images/common/icon2020.png) no-repeat -74px -79px; width: 14px; height: 14px;  display: inline-block; margin-left: 7px}

.pestCrl.defineDiv.tabs .defList li h2 button{ height: 45px}
.pestCrl.defineDiv.tabs .defList li.active h2 button{ font-size: 0.75em; background: #008d8f; border-color: #008d8f; color: #fff}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont{ padding: 55px 6px 10px 0;}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .imgListA{ border: 0; padding: 0}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .imgListA>ul>li a strong{ text-align: center}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .imgListA>ul>li button{ display: inline-block; margin-top: 5px; background: #d4eafb; padding: 5px; border-radius: 3px; font-size: 0.9em; color: #000; border: 1px solid #d4eafb; transition: all .2s; -webkit-transition: all .2s;}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .imgListA>ul>li button:hover{ border-color: #3086c9}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .imgListA>ul>li button:after{ content: '\276F'; display: inline-block; margin: 0 5px; vertical-align: top; line-height: 1.3;}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont #agch_tabs, .schLayerBox #agch_tabs{ text-align: center; margin: 0 0 5px}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont #agch_tabs button, .schLayerBox #agch_tabs button{ display: inline-block; padding: 5px 15px; border-radius: 3px; border: 1px solid #ccc; transition: all .2s; -webkit-transition: all .2s;}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont #agch_tabs button:hover, .schLayerBox #agch_tabs button:hover{ border-color: #23507b}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont #agch_tabs button.active, .schLayerBox #agch_tabs button.active{ border-color: #23507b; background: #23507b; color: #fff; font-weight: 400}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .keyCont{ border: 1px solid #23507b; padding: 20px 25px 15px;}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .keyCont .tit, .schLayerBox .tit{ display: inline-block}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consA, .schLayerBox .consA{ margin: -30px 0 0 100px; overflow: hidden; border-bottom: 1px solid #23507b; padding-bottom: 15px}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consA a, .schLayerBox .consA a{ float: left; display: block; background: #fff; border: 1px solid #0f0f0f; color: #323232; border-radius: 3px; width: 36px; height: 36px; line-height: 34px; text-align: center; margin: 2px 8px 2px 0; transition: all .2s; -webkit-transition: all .2s;}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consA a.all, .schLayerBox .consA a.all{ width: 50px}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consA.conB a, .schLayerBox .consA.conB a{ width: auto; padding: 0 10px; margin: 3px}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consA a:hover, .pestCrl.defineDiv.tabs.w3 .defList li .defCont .consA a.active, .schLayerBox .consA a:hover, .schLayerBox .consA a.active{ background: #23507b; border-color: #23507b; color: #fff; font-weight: 500}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consR{ margin: 15px 0 0 100px; overflow: hidden}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consR li{ float: left; margin: 0 5px 5px 0}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consR li a{ display: block; line-height: 30px; padding: 0 20px; background: #f1f1f1; border-radius: 3px; font-size: 0.9em}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consR li.active a{ background: #23507b; color: #fff}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes{ margin-top: 35px}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div>button{ padding: 0; font-size: 1em; line-height: 1.2; width: 112px; height: 45px; display: table-cell; vertical-align: middle}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div>button:before{ display: none}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div+div button{ left: calc(112px + 1px);}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div+div+div button{ left: calc(224px + 2px);}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div+div+div+div button{ left: calc(336px + 3px);}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div+div+div+div+div button{ left: calc(448px + 4px);}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div+div+div+div+div+div button{ left: calc(560px + 5px);}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div+div+div+div+div+div+div button{ left: calc(672px + 6px);}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div+div+div+div+div+div+div+div button{ left: calc(784px + 7px);}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div+div+div+div+div+div+div+div+div button{ left: calc(896px + 8px); width: 110px}
.pestCrl.defineDiv.tabs.w3 .defList .keyContRes .tabStyle1>div>div{ padding-top: 45px}
.pestCrl.defineDiv .subTabs{ text-align: center; margin: 10px 0 5px; border-bottom: 1px solid #23507b}
.pestCrl.defineDiv .subTabs li{ display: inline-block; margin: 10px 0 0}
.pestCrl.defineDiv .subTabs li a{ display: block; font-size: 1.05em; padding: 5px 15px; transition: all .2s; -webkit-transition: all .2s; text-decoration: underline; border-radius: 3px 3px 0 0}
.pestCrl.defineDiv .subTabs li.active a, .pestCrl.defineDiv .subTabs li.active a:hover{ background: #23507b; color: #fff; text-decoration: none}
.pestCrl.defineDiv .subTabs li a:hover{ background: #f8f8f8; border-radius: 3px;}
.pestCrl.defineDiv .button.font0.icon{ width: 40px; height: 40px; margin: 0 0 3px}
.pestCrl.defineDiv .button.font0.icon:before{ left: -7px}
.imgListA.mov>ul>li a span{ position: relative}
.imgListA.mov>ul>li a span:after, .imgListA.mov>ul>li a span:before{ content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.3); position: absolute; top: 0;}
.imgListA.mov>ul>li a span:before{ content: '\25B7'; background: #3086c9; color: #fff; width: 50px; height: 50px; padding: 5px; z-index: 1; border-radius: 50%;left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); line-height: 50px; top: 40px; transition: all .2s; -webkit-transition: all .2s; font-size: 1.15em}
.imgListA.mov>ul>li a:hover span:before{ background: #323232}
.imgListA.mov>ul>li a strong{ font-size: 0.9em; text-align: left !important; font-weight: 300; color: #fff; text-indent: 5px}
.imgListA.mov>ul>li a strong:before{ content: '\2665'; display: inline-block; color: #ee5a5a; line-height: 1; margin-right: 5px}
.imgListA.mov>ul>li a em{ text-align: center}
.seedList>li{ padding: 15px 0 10px 230px; position: relative; border-bottom: 1px solid #e1e3e6}
.seedList>li .thums{ display: block; position: absolute; left: 0; top: 15px; width: 210px; text-align: center}
.seedList>li .thums span{ display: block; width: 100%; height: 150px; margin-bottom: 10px; overflow: hidden; background: #f8f8f8}
.seedList>li .thums span img{ width: 100%}
.seedList>li .thums:hover .overPic{ display: block; z-index: 10}
.seedList>li ul li{ font-size: 1em; margin: 0 0 8px; line-height: 1.5;}
.seedList>li ul li strong{ display: inline-block; width: 15%; font-weight: 500;  vertical-align: top}
.seedList>li ul li p{ display: inline-block; width: 80%}
.seedList>li ul li p .fileN{ margin: 0}

.schLayerBox{ position: absolute; top: 102px; box-sizing: border-box; background: #fff; border: 1px solid #23507b; padding: 20px 25px 15px; z-index: 10; height: 720px; overflow-y: auto}
.schLayerBox .searchBox{ padding-top: 0; border: 0; margin: 0}
.schLayerBox .searchBox ul li{ margin: 0}
.schLayerBox .searchBox .button{ margin: 0; height: 37px; font-size: 1em}
.schLayerBox .consA{ margin: -25px 0 0 100px;}
.schLayerBox .consR{ margin: 10px 0 0}
.schLayerBox .consR dt{ display: inline-block; background: #f3f3f3; line-height: 30px;width: 80px; text-align: center; font-weight: 500; border: 1px solid #323232; box-sizing: border-box}
.schLayerBox .consR dd{ margin: -30px 0 0 100px;}
.schLayerBox .consR dd a{ margin: 0 0 5px 0; display: inline-block; line-height: 30px; padding: 0 20px; background: #f1f1f1; border-radius: 3px; font-size: 0.9em; transition: all .2s; -webkit-transition: all .2s;}
.schLayerBox .consR dd a.active, .schLayerBox .consR dd a:hover{ background: #23507b; color: #fff;}
.schLayerBox #agch_tabs{ margin: 0 0 15px}
.schLayerBox #agch_tabs button{ font-size: 1.05em}
.schLayerBox .listChkA{ text-align: center}
.schLayerBox .btnClose{ right: 0; top: 10px; left: auto}
.schLayerBox .btnClose:before{ color: #323232; font-size: 20px}
.schLayerBox .downloadBox{ background: #efefef; padding: 8px 0 12px}
.schLayerBox .downloadBox .fileN{ margin: 0 15px}

.schLayerBox .autoArea1{ position: relative; margin: -3px 0 0 269px; width: 30%}
.schLayerBox .autoArea1 ul{ padding: 5px 0 10px; background: #D9F1F1; border: 1px solid #d2d2d2; box-sizing: border-box; border-top: 0; position: absolute; width: 100%}
.schLayerBox .autoArea{ position: relative; margin: -3px 0 0 101px; width: calc(50% + 3px);}
.schLayerBox .autoArea ul{ padding: 5px 0 10px; background: #D9F1F1; border: 1px solid #d2d2d2; box-sizing: border-box; border-top: 0; position: absolute; width: 100%}
.schLayerBox .searchBox ul li{ display: block}
.schLayerBox .searchBox ul li a{ display: block; padding: 0 10px}
.schLayerBox .searchBox ul li a:hover{ background: #fff}

/* 경고메시지 팝업 */
.layerPop.sign.sign2>div{ width: 400px}
.layerPop.sign.sign2 .layerTp{ background: #000;}
.layerPop.sign.sign2 .layerCont{ background: #be1b00;}
.layerPop.sign.sign2 .layerCont p{ color: #fff; font-weight: 400; line-height: 1.5; word-break: keep-all}
.layerPop.sign.sign2 .layerCont p:before{ background-position: -394px 0; width: 102px; height: 102px;}

/* 2020 12 02 간격 및 폰트사이즈 조정 */
#gnb>li>a{ font-size: 1.35em;}
#gnb .subGnb>ul li a{ padding: 5px 20px; font-size: 1.05em; line-height: 1.3}
#gnb .subGnb>ul li a:before{ left: 6px;}
#gnb .subGnb>ul li strong{ font-size: 1.3em; margin: 0 0 5px;}
#gnb .subGnb>ul li i{ transform: scale(.8); margin-top: -15px}
.lftArea ul ul>li>a{ font-size: 0.95em}
.inputData{ height: 37px;}
#content>.innerCont h1{ margin-bottom: 0}
#content>.innerCont h1+.searchBox, #content>.innerCont #srchFm h1+.searchBox{ margin: 10px 0 0;}
.searchBox{ padding: 10px 0 5px}
.searchBox ul li{ margin: 0; line-height: 35px;}
.searchBox label.dotL{ line-height: 35px; font-size: 1em;}
.detailGrid>ul li>div label, .certiNum .countNum{ line-height: 35px;}
.searchBox .inputData, .detailGrid>ul li>div .inputData, .recomProcess>li ul li .inputData, .boxLayer .inputData{ height: 37px;}
.searchBox .btnArea{ margin: 5px 0 20px;}
.searchBox .btnArea button{ height: 40px; line-height: 40px; font-size: 1em}
.certiNum input[type='text']{ height: 37px; line-height: 35px; }
.searchBox.searchBoxR .btnArea.hLine2 .button{ height: 80px;}
.totalList{ font-size: 0.95em}
.button.small, .tpSchLayer>div .inputData{ height: 37px; line-height: 35px}
.default_table thead th, .default_table tbody th, .default_table tbody td{ padding: 10px 5px;  line-height: 1.2}
.default_table td a, .gridScroll table td a, .detailGrid>ul li a{ text-decoration: none}
.default_table td a:hover{ text-decoration: underline}
.detailGrid.inner_pic .picArea p{ height: 195px;}
.txtIcon{ margin: 5px 0}

/* animation 추가 */
.button.icon.search:before, .button.icon.reset:before, #container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .more:before, #container.main2020 .btmPesInfo .pesEduMov ul li.more a i:before{ transition: all .2s; -webkit-transition: all .2s;}
.button.icon.search:hover:before, .button.icon.reset:hover:before{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: rotateIn; animation-name: rotateIn; animation-duration: 0.5s;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .more:hover:before, #container.main2020 .btmPesInfo .pesEduMov ul li.more a i:hover:before{ transform: rotate(180deg)}

@keyframes rotateIn{0%{-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.animate__rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn;-webkit-transform-origin:center;transform-origin:center}

@keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}.animate__headShake{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-name:headShake;animation-name:headShake}

@keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}.animate__swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}

/* 2022 Renewal start */
#main_2022 #wrap.modalBack::before{ content: ''; background: rgba(0,0,0,0.6); z-index:200; position: fixed; top: 0; left: 0; right: 0; bottom: 0;}
#main_2022{ }
#main_2022 .inner{ max-width: 1350px;}
#main_2022 #header .inner, #main_2022 #footer .inner{ max-width: 100%;}
#main_2022 #header .inner{ text-align: center;}
#main_2022 #header #gnbNavi{ background: url(../images/main_2022/gnbNavi.gif) repeat-x 0 80px;}
#main_2022 #header{ border-color: #dcdcdc;}
#main_2022 #header .tpLogo{ background: url(../images/main_2022/ci.png) no-repeat 0 0; width: 200px; height: 48px; margin: 15px 0 0 1%}
#main_2022 #gnb{ padding: 15px 0 0; max-width: 1350px; margin: 0 auto; display: inline-block; vertical-align: top;}
#main_2022 #gnb::after{ content: ''; display: block; clear: both;}
#main_2022 #gnb>li{ float: left; vertical-align: top;}
#main_2022 #gnb>li>a{ display: block; padding: 22px 0 23px; line-height: 20px; font-size: 1.35em; font-weight: 500; position: relative; width: 160px;}
#main_2022 #gnb>li>a:before{ content: ''; display: block; position: absolute; left: -3px; top: 30px; width: 6px; height: 6px; border-radius: 50%; background: #dcdcdc;}
#main_2022 #gnb>li:first-child>a:before{ width: 0}
#main_2022 #gnb>li>a:after{ content: ''; display: block; width: 0; height: 5px; background: #3086c9; position: absolute; bottom: -1px; left: 0; transition: all .2s; -webkit-transition: all .2s;}
#main_2022 #gnb>li>a:hover:after, #main_2022 #gnb>li:hover>a:after{ width: 100%;}
#main_2022 #gnb .subGnb{ display: none; position: static; left: 0; top: 80px; border-top: 1px solid #ccc; width: 100%; text-align: center; background: #fff; /* padding-bottom: 50px */}
#main_2022 #gnb .subGnb>ul{ width: 100%; margin-left: 0 !important; position: relative; z-index: 10; padding: 0 0 30px; min-height: 450px; border-left: 1px solid #ccc; background: #fff; box-sizing: border-box; padding: 15px 0 0}
#main_2022 #gnb>li:last-child .subGnb{ margin-left: -1px;}
#main_2022 #gnb .subGnb>ul>li>strong{ display: none; text-align: center; height: 50px; border-bottom: 1px solid #ccc; width: 100%; line-height: 50px; font-size: 1.25rem; font-weight: 500; background: #fff;}

/* #main_2022 #gnb>li:nth-child(1) .subGnb>ul:before{ content: '농약판매기록';}
#main_2022 #gnb>li:nth-child(2) .subGnb>ul:before{ content: '농약등록신청';}
#main_2022 #gnb>li:nth-child(3) .subGnb>ul:before{ content: '판매인교육';}
#main_2022 #gnb>li:nth-child(4) .subGnb>ul:before{ content: '안전사용정보';}
#main_2022 #gnb>li:nth-child(5) .subGnb>ul:before{ content: '법령.고시/알림';}
#main_2022 #gnb>li:nth-child(6) .subGnb>ul:before{ content: '사용자별서비스';} */

#main_2022 #gnb .subGnb.on>ul{ background: #23507b}
#main_2022 #gnb .subGnb.on>ul>li>strong{ background: #3086c9; color: #fff; border-color: #3086c9}
#main_2022 #gnb>li:nth-child(2) .subGnb>ul{ margin-left: calc(50% - 1350px / 2 + 225px);}
#main_2022 #gnb>li:nth-child(3) .subGnb>ul{ margin-left: calc(50% - 1350px / 2 + 225px + 225px);}
#main_2022 #gnb>li:nth-child(4) .subGnb>ul{ margin-left: calc(50% - 1350px / 2 + 225px + 225px + 225px);}
#main_2022 #gnb>li:nth-child(5) .subGnb>ul{ margin-left: calc(50% - 1350px / 2 + 225px + 225px + 225px + 225px);}
#main_2022 #gnb>li:nth-child(6) .subGnb>ul{ margin-left: calc(50% - 1350px / 2 + 225px + 225px + 225px + 225px + 225px); border-right: 1px solid #ccc;}
#main_2022 #gnb .subGnb>ul li a{ display: block; text-align: left; padding: 5px; font-size: 1.05rem; position: relative; margin: 0;}
#main_2022 #gnb .subGnb>ul li a:before{ content: ''; display: none;}
#main_2022 #gnb .subGnb>ul li a:hover{ background: none; color: #000; font-weight: 500;}
#main_2022 #gnb .subGnb>ul li a[target='_blank']:hover:after{ background-position: -74px -79px;}
#main_2022 #gnb .subGnb.on>ul li a{ color: #fff}
#main_2022 #gnb .subGnb.on>ul li a:hover{ color: #a0d5ff}
#main_2022 #gnb .subGnb>ul li a[target='_blank']:after, #main_2022 #gnb .subGnb.on>ul li a[target='_blank']:hover:after, .lftArea>ul>li>a[target='_blank']:after{ background: url(../images/main_2022/icon_2022.png) no-repeat -276px 0; width: 14px; height: 13px}

/* 배경 없이 라인없이 */
#main_2022 #header #gnbNavi{ background: #fff; position: relative; z-index: 15;}
#main_2022 #header #gnbNavi:before{ content: ''; display: block; width: 100%; height: 1px; position: absolute; top: 80px; background: #ddd;}
#main_2022 #gnb .subGnb>ul{ border-color: #f1f1f2 !important;}
#main_2022 #gnb .subGnb>ul li a{ margin-bottom: 5px; letter-spacing: -0.085em; transition: padding .3s ease-out; -webkit-transition: padding .3s ease-out; -moz-transition: padding .3s ease-out;}
#main_2022 #gnb .subGnb>ul li a:hover{ background: #f1f1f2;}
#main_2022 #gnb .subGnb.on>ul{ background: #F8F8F8}
#main_2022 #gnb .subGnb.on>ul li a{ color: #323232;}
#main_2022 #gnb .subGnb.on>ul li a:hover{ color: #000}
#main_2022 #gnb .subGnb>ul{ min-height: 520px; width: 160px}
/* //배경 없이 라인없이 */

#main_2022 .gnbBn{ display:none; position:absolute; bottom: -60px; left:0; width:100%; height:60px; text-align: center; background:#e0edfb; z-index: 10; border-bottom: 1px solid #c0c0c0}
#main_2022 .gnbBn strong, #main_2022 .gnbBn ol{ display: inline-block; line-height: 60px; margin: 0 15px}
#main_2022 .gnbBn strong, #main_2022 .gnbBn ol>li{ margin: 0 5px}
#main_2022 .gnbBn strong:before{ content: '\2729'; display: inline-block; font-size: 1.2rem; margin-right: 3px}
#main_2022 .gnbBn ol>li{ display: inline-block}
#main_2022 .gnbBn ol>li a{ display: block; line-height: 45px;}
#main_2022 .gnbBn strong, #main_2022 .gnbBn ol>li a:before{ content: ''; display: inline-block; margin-right: 3px; font-size: 1rem;}
#main_2022 .gnbBn strong, #main_2022 .gnbBn ol>li:nth-child(1) a:before{ content: '\2780';}
#main_2022 .gnbBn strong, #main_2022 .gnbBn ol>li:nth-child(2) a:before{ content: '\2781';}
#main_2022 .gnbBn strong, #main_2022 .gnbBn ol>li:nth-child(3) a:before{ content: '\2782';}
#main_2022 .gnbBn strong, #main_2022 .gnbBn ol>li:nth-child(4) a:before{ content: '\2783';}
#main_2022 .gnbBn strong, #main_2022 .gnbBn ol>li:nth-child(5) a:before{ content: '\2784';}
#main_2022 .gnbBn strong{ color: #323232; font-weight: 500;}
#main_2022 #allNav .tpMember{ top: 10px; right: 60px;}
#main_2022 .tpRgt{ top: 20px; right: 1%}

/*
#main_2022 .mypageLayer{ margin-top: 0; padding: 0; top: 80px; display: none; position: fixed; left: 0; z-index: 10;}
#main_2022 .mypageLayer .afterClear{ width: 1350px; box-sizing: border-box; margin-right: 0; background: #2e5dbc; background: -webkit-gradient(linear, left top, right top, from(#2e5dbc), to(#2bb6d0)); background: linear-gradient(to right, #2e5dbc 0%, #2bb6d0 100%); border: 0; margin: 0 auto; position: relative}
#main_2022 #allNav .tpMember .mypageLayer>div .btnClose{ width: 40px; height: 40px; top: 10px; background: transparent; right: 0; border-radius: 50%}
#main_2022 #allNav .tpMember .mypageLayer>div .btnClose:before{ font-size: 1rem;}
#main_2022 .mypageLayer .afterClear>div, #main_2022 .mypageLayer .afterClear>ul{ float: inherit; width: 100%; text-align: center;}
#main_2022 .mypageLayer .afterClear>div{ position: relative;}
#main_2022 .mypageLayer .afterClear>div p{ display: inline-block; font-size: 1.15rem; font-weight: 500; margin: 0; padding: 0 30px 10px; border-bottom: 1px solid #fff;}
#main_2022 .mypageLayer .afterClear>div p strong{ font-weight: inherit; font-size: inherit;}
#main_2022 #allNav .mypageLayer .afterClear>div a{ position: absolute; right: 0; width: 140px; height: 40px; line-height: 38px; font-size: 1rem; box-sizing: border-box; border: 2px solid #1d4162; color: #000; margin: 0; top: 55px}
#main_2022 #allNav .mypageLayer .afterClear>div a:before{ background: url(../images/main_2022/icon_2022.png) no-repeat -222px 0; width: 11px; height: 12px; margin-right: 3px}
#main_2022 #allNav .mypageLayer .afterClear>div a.logout{ top: 98px; background: #23507b; color: #fff; border: 0}
#main_2022 #allNav .mypageLayer .afterClear>div a.logout:before{ background-position: -237px 0; width: 12px; height: 13px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li a{ margin: 0; box-sizing: border-box; width: 125px; padding: 0; text-align: center; font-size: .94rem; color: #fff; font-weight: 400; line-height: 1.2; word-break: keep-all;}
#main_2022 #allNav .mypageLayer .afterClear>ul li a:before{ display: block; width: 70px; height: 70px; border-radius: 50%; background: url(../images/main_2022/icon_2022.png) no-repeat; margin: 0 auto 5px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li.usr1 a:before{ background-position: 0 -158px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li.usr2 a:before{ background-position: -74px -158px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li.usr3 a:before{ background-position: -148px -158px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li.usr4 a:before{ background-position: -222px -158px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li.usr5 a:before{ background-position: 0 -232px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li.usr6 a:before{ background-position: -74px -232px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li.usr7 a:before{ background-position: -148px -232px;}
#main_2022 #allNav .mypageLayer .afterClear>ul li.usr8 a:before{ background-position: -222px -232px;}

#main_2022 .mypageLayer .afterClear{ background: #eaf7ff; border: 1px solid #cecece; padding: 0; overflow: hidden;}
#main_2022 .mypageLayer .afterClear>div p{ color: #323232; border: 0; padding: 15px 0; line-height: 45px; margin-right: 25px;}
#main_2022 .mypageLayer .afterClear>div p:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat -50px -305px; width: 42px; height: 42px; vertical-align: middle; margin-right: 10px}
#main_2022 #allNav .mypageLayer .afterClear>div a{ display: inline-block; position: static; vertical-align: middle; line-height: 35px; height: 35px; background: #aed6ff; width: auto; border-radius: 35px; border: 0; padding: 0 15px; font-size: 0.9rem;}
#main_2022 #allNav .mypageLayer .afterClear>div a.logout{ background: #c3c3c3; color: #323232}
#main_2022 #allNav .mypageLayer .afterClear>div a:before, #main_2022 #allNav .mypageLayer .afterClear>div a.logout:before{ width: 0}
#main_2022 #allNav .mypageLayer .afterClear>ul{ padding: 0; background: #fff;}
#main_2022 #allNav .mypageLayer .afterClear>ul>li{ vertical-align: middle;}
#main_2022 #allNav .mypageLayer .afterClear>ul>li a{ width: auto; padding: 15px 0; color: #323232; border: 1px solid #cecece; background: #fff; box-sizing: border-box; margin-left: -1px; margin-bottom: -1px}
#main_2022 #allNav .mypageLayer .afterClear>ul>li:first-child{ border-left: 0}
#main_2022 #allNav .mypageLayer .afterClear>ul li a:before{ width: 0; height: 0}
#main_2022 #allNav .mypageSwiper .swiper-button-prev, #main_2022 #allNav .mypageSwiper .swiper-button-next{ position: absolute; top: 76px; left: 0; width: 35px; height: 55px; border: 1px solid #cecece; box-sizing: border-box; font-size: 0; background: #fff;}
#main_2022 #allNav .mypageSwiper .swiper-button-next{ left: auto; right: 0}
#main_2022 #allNav .mypageSwiper .swiper-button-prev:after, #main_2022 #allNav .mypageSwiper .swiper-button-next:after{ font-size: 1rem; font-weight: 600; color: #000;}
#main_2022 #allNav .mypageSwiper .swiper-scrollbar{ left: 0;}
#main_2022 #allNav .tpMember .mypageLayer>div .btnClose:before{ color: #323232;}

#main_2022 .mypageLayer .afterClear{ background: #eaf7ff url(../images/main_2022/section1_bg.png) no-repeat 50% 10%; padding-bottom: 20px; cursor: inherit !important;}
#main_2022 .mypageLayer .afterClear:after{ content: ''; display: block; position: absolute; bottom: 0; right: -10px; background: url(../images/main_2022/manual_bg.png) no-repeat; width: 380px; height: 86px;}
#main_2022 .mypageLayer .afterClear>div p{ display: block; margin: 0; padding: 35px 0 0;}
#main_2022 .mypageLayer .afterClear>div p:before{ display: block; margin: 0 auto}
#main_2022 #allNav .mypageLayer .afterClear>div a{ padding: 0 35px}
#main_2022 #allNav .mypageLayer .afterClear>div a.logout{ background: #616161; color: #fff;}
#main_2022 #allNav .mypageLayer .afterClear>ul{ margin: 30px 0 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; background: transparent; border: 0}
#main_2022 #allNav .mypageLayer .afterClear>ul li{ width: 15%; margin: 0 3px 6px; display: table;}
#main_2022 #allNav .mypageLayer .afterClear>ul>li a{ border-radius: 0 10px 0 10px; text-align: left; padding: 0 50px 0 15px; height: 55px; display: table-cell; vertical-align: middle; position: relative; transition: all .2s; -webkit-transition: all .2s;}
#main_2022 #allNav .mypageLayer .afterClear>ul>li a:before{ content: '\279C'; position: absolute; width: 45px; height: 100%; right: -1px; top: -1px; border: 1px solid #c0c0c0; background: #e8e8e8; border-radius: 0 10px 0 10px; margin: 0; text-align: center; line-height: 50px;}
#main_2022 #allNav .mypageLayer .afterClear>ul>li a:hover{ background: #0089d2; border-color: #0089d2; color: #fff; font-weight: 500;}
#main_2022 #allNav .mypageLayer .afterClear>ul>li a:hover:before{ background: #fff; color: #0089d2} */

#main_2022 .mypageLayer{ padding-top: 50px; z-index: 100}
#main_2022 #allNav .mypageLayer>div .btnClose{ width: 34px; height: 34px; border-radius: 50%; right: -12px; top: -3px; background: #163450;}
#main_2022 #allNav .mypageLayer>div .btnClose:before{ font-size: 15px}

#main_2022 #allNav .tpMember a{ font-size: 0.92rem; line-height: 35px; position: relative; margin: 0 10px; z-index: 30}
#main_2022 #allNav .tpMember a.login:after{ content: ''; display: block; width: 1px; height: 30%; background: #949494; position: absolute; right:-12px; top: 35%}
#main_2022 #allNav .tpMember a.mypage{ font-size: 0; margin: 0; line-height: inherit; top: -5px; z-index: 20;}
#main_2022 .tpRgt .tpSch, #main_2022 .tpRgt .allMn{ width: 25px; height: 35px; background: none; margin-top: -25px; z-index: 30; position: relative;}
#main_2022 .tpRgt .tpSch:before, #main_2022 .tpRgt .allMn:before, #main_2022 #allNav .tpMember a.mypage:before{ background: url(../images/main_2022/icon_2022.png) no-repeat;}
#main_2022 #allNav .tpMember a.mypage:before{ background-position: -183px 0; width: 34px; height: 23px; margin: 0}
#main_2022 #allNav .tpMember a.mypage:before{ background-position: -320px 0; width: 34px; height: 34px; margin: 0}
#main_2022 .tpRgt .allMn:before{ background-position: -23px 0; width: 17px; height: 20px}
#main_2022 #allNav .tpMember a.mypage{ margin-right: 5px;}
#main_2022 .tpRgt .tpSch, #main_2022 .tpRgt .allMn{ margin-top: -32px}

#main_2022 .tpSchLayer{ z-index: 1; position: fixed; top: 80px; left: 0}
#main_2022 .tpSchLayer>div .btnClose{ right: 0; width: 40px; height: 40px; top: 10px; background: transparent;}
#main_2022 .tpSchLayer>div .btnClose:before{ color: #fff; font-size: 1rem}
#main_2022 .tpSchLayer>div{ width: 100%;  margin: 0 auto; background: #2e5dbc; background: -webkit-gradient(linear, left top, right top, from(#2e5dbc), to(#2bb6d0)); background: linear-gradient(to right, #2e5dbc 0%, #2bb6d0 100%); box-sizing: border-box;}
#main_2022 .tpSchLayer:before{ content: ''; background: rgba(0,0,0,0.6); z-index:-1; position: fixed; left: 0; top: 0; width: 100%; height: 100%}
#main_2022 .tpSchLayer>div .button{ background: #153451; color: #fff; width: 9%; height: 50px; font-size: 1.1rem;}
#main_2022 .tpSchLayer>div .button:before{ background: url(../images/main_2022/icon_2022.png) no-repeat -59px 0; width: 17px; height: 17px;}
#main_2022 .tpSchLayer>div .inputData{ width: 50%; height: 50px; background: rgba(255,255,255,.3); color: #fff; font-size: 1.15rem; font-weight: 600; border: 0; text-indent: 1em;}

#main_2022 #allNav .allMenu{ background: #23507b; z-index: 50}
#main_2022 #allNav .allMenu:before{ content: ''; display: block; position: absolute; top: 0; background: #15395a; width: 100%; height: 80px; box-shadow: -1px 1px 9px #102d48;}
#main_2022 #allNav .allMenu>ul{ margin-top: 115px; max-width: 1350px; border-top: 0; display: flex; flex-wrap: wrap; padding-bottom: 30px}
#main_2022 #allNav .allMenu>span{ display: block; position: absolute; background: url(../images/main_2022/ci2.png) no-repeat 0 0; width: 200px; height: 48px; top: 15px; left: 25px; font-size: 0;}
#main_2022 #allNav .allMenu>button, .btnClose{ right: 0; left: auto; top: 15px}
#main_2022 #allNav .allMenu>button:before, .btnClose:before{ font-weight: 400; font-size: 1.15rem;}
#main_2022 #allNav .allMenu>ul>li{ width: 33.33%; margin: 0; padding: 0; border-right: 1px solid #3086c9; box-sizing: border-box; min-height: 300px; padding-bottom: 30px}
#main_2022 #allNav .allMenu>ul>li:nth-child(3n){ border: 0}
#main_2022 #allNav .allMenu>ul>li>a{ background: none; text-align: left; padding: 0 0 15px 20px; line-height: 1; color: #fff; font-size: 2rem;}
#main_2022 #allNav .allMenu>ul>li>a:after{ content: ''; display: block; width: 0; height: 1px; background: #fff; -webkit-transition: 0.3s cubic-bezier(0.5, 1, 0.75, 1); transition: 0.3s cubic-bezier(0.5, 1, 0.75, 1); position: absolute; left: 20px; bottom: 0}
#main_2022 #allNav .allMenu>ul>li:hover>a:after{ width: calc(100% - 40px)}
#main_2022 #allNav .allMenu>ul>li>a[target='_blank']:after{ background: url(../images/main_2022/icon_2022.png) no-repeat -42px 0;}
#main_2022 #allNav .allMenu ul ul{ margin: 0; padding: 0 20px;}
#main_2022 #allNav .allMenu li li a{ color: #00d8ff; padding: 8px 0; border: 0; font-size: 1.15rem;}
#main_2022 #allNav .allMenu .depth3{ background: rgb(21 64 104); padding: 5px 10px 10px;}
#main_2022 #allNav .allMenu .depth3 li a{ font-size: 1rem; padding: 6px 0; color: #fff}
#main_2022 #allNav .allMenu .depth4 li a{ font-size: 0.95rem;}
#main_2022 #allNav .allMenu .depth4 li a:before{ content: '\002D'; display: inline-block; margin-right: 5px}
#main_2022 #allNav .allMenu li li a[target='_blank']:after{ background: url(../images/main_2022/icon_2022.png) no-repeat -294px 0;}

#main_2022 #container.main2022{ padding-top: 80px; background: #fff;}
#main_2022 .main_section1{ /* background: url(../images/main_2022/section1_bg.png) no-repeat 50% 0;*/ padding: 30px 0 20px}
#main_2022 .mainSch{ text-align: center}
#main_2022 .mainSch h2{ display: inline-block; vertical-align: top;}
#main_2022 .mainSch h2 label{ font-size: 1.25rem; font-weight: 500; text-shadow: 1px 1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, -1px -1px 0 #fff, 2px 0px 0 #fff, 0px 2px 0 #fff, -2px 0px 0 #fff, 0px -2px 0 #fff; line-height: 55px;}
#main_2022 .mainSch h2 label span{ color: #23507b}
#main_2022 .mainSch .formSch{ display: inline-block; margin: 0 10px; vertical-align: top}
#main_2022 .mainSch .formSch input[type='text']{ background: #fff; border: 6px solid #3b77a5; width: 500px; height: 55px; border-radius: 55px; line-height: 55px; text-indent: 30px;}
#main_2022 .mainSch .formSch button{ display: inline-block; background: #23507b; width: 65px; height: 55px; font-size: 0; border-radius: 20px; margin-left: -18px;}
#main_2022 .mainSch .formSch button:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat 0 -22px; width: 26px; height: 26px;}
#main_2022 .mainSch .hashTag{ display: inline-block;}
#main_2022 .mainSch .hashTag li{ display: inline-block; margin: 10px 5px}
#main_2022 .mainSch .hashTag li a{ display: block; color: #121212; line-height: 30px;}
#main_2022 .mainSch .hashTag li a:before{ content: '\0023'; display: inline-block;}
#main_2022 .mainService1{ margin-top: 30px; display: flex; background: #aed6ff; height: 500px}
#main_2022 .mainBannerZone{ flex: 1.65}
#main_2022 .mainBannerZone .mainLink{ margin-bottom: 3px; height: 85px; display: flex}
#main_2022 .mainBannerZone .mainLink>a{ flex: 1; text-align: center; font-size: 1.3rem; font-weight: 400; color: #fff; line-height: 85px; -webkit-transition: 0.3s cubic-bezier(0.5, 1, 0.75, 1); transition: 0.3s cubic-bezier(0.5, 1, 0.75, 1);}
#main_2022 .mainBannerZone .mainLink>.record{ background: #365b9e;}
#main_2022 .mainBannerZone .mainLink>.edu{ background: #374c74;}
#main_2022 .mainBannerZone .mainLink>.app{ background: #153451;}
#main_2022 .mainBannerZone .mainLink>a i{ display: inline-block; width: 35px; height: 35px; border-radius: 50%; background: #fff; margin-right: 10px; vertical-align: middle;}
#main_2022 .mainBannerZone .mainLink>a i:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat; height: 21px; vertical-align: top; margin-top: 6px}
#main_2022 .mainBannerZone .mainLink>.record i:before{ background-position: -30px -22px; width: 21px}
#main_2022 .mainBannerZone .mainLink>.edu i:before{ background-position: -56px -22px; width: 23px}
#main_2022 .mainBannerZone .mainLink>.app i:before{ background-position: -83px -22px; width: 20px}
#main_2022 .bannerZone{ height: 412px; overflow: hidden; position: relative; background: #365b9e;}
#main_2022 .bannerZone ul li>a{ display: block; height: 412px;}
#main_2022 .bannerZone .bx-controls{ position: absolute; top: 10px; right: 10px; z-index: 100;}
#main_2022 .bannerZone .bx-controls-direction, #main_2022 .bannerZone .bx-controls-auto{ display: inline-block; vertical-align: top;}
#main_2022 .bannerZone .bx-controls-direction a, #main_2022 .bannerZone .bx-controls-auto a{ display: inline-block; width: 60px; height: 50px; background: rgba(21,52,81,.8); margin-left: 1px; text-align: center; font-size: 0; vertical-align: top;}
#main_2022 .bannerZone .bx-controls-direction a:before, #main_2022 .bannerZone .bx-controls-auto a:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat; height: 16px; margin-top: 17px}
#main_2022 .bannerZone .bx-controls-direction a.bx-prev:before{ background-position: -113px 0; width: 10px}
#main_2022 .bannerZone .bx-controls-direction a.bx-next:before{ background-position: -131px 0; width: 10px}
#main_2022 .bannerZone .bx-controls-auto a.bx-stop:before{ background-position: -148px 0; width: 11px}
#main_2022 .bannerZone .bx-controls-auto a.bx-start:before{ background-position: -167px 0; width: 10px}
#main_2022 .nongSch{ flex: 1; overflow: hidden; position: relative;}
#main_2022 .nongSch h2{ text-align: center; font-size: 1.3rem; font-weight: 500; color: #121212; line-height: 60px; display: none;}
#main_2022 .inNongSch{ position: relative; margin: 20px}
#main_2022 .inNongSch>div>div{ padding-top: 75px; display: none}
#main_2022 .inNongSch>div.active>div{ display: block}
#main_2022 .inNongSch>div>div button{ display: block; width: 100%; height: 50px; border-radius: 50px; background: #23507b; color: #fff; font-size: 1.15rem; font-weight: 500; margin-top: 5px; -webkit-transition: 0.3s cubic-bezier(0.5, 1, 0.75, 1); transition: 0.3s cubic-bezier(0.5, 1, 0.75, 1); box-sizing: border-box;}
#main_2022 .inNongSch>div>button{ position: absolute; top: 0; width: 34%; height: 60px; border: 2px solid #0089d2; border-radius: 55px; background: transparent; font-size: 1.05rem; color: #121212;}
#main_2022 .inNongSch>div.pesSch>button{ width: 30%}
#main_2022 .inNongSch>div.diseaseSch1>button{ left: calc(30% + 1%)}
#main_2022 .inNongSch>div.diseaseSch2>button{ right: 0}
#main_2022 .inNongSch>div.active>button{ background: #0089d2; color: #fff; font-size: 1.15rem; font-weight: 500; transition: all .2s; -webkit-transition: all .2s;}
#main_2022 .formDiv .fl, #main_2022 .formDiv .fr{ width: 49.3%}
#main_2022 .formDiv .inputData{ margin-bottom: 8px; width: 100%; height: 55px; background: #fff; border-radius: 50px; border: 0; text-indent: 10px;}
#main_2022 .inNongSch>div.active>button:before, #main_2022 .inNongSch>div>div button:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat -59px 0; width: 17px; height: 17px; margin-right: 3px; transition: all .2s; -webkit-transition: all .2s;}
#main_2022 .inNongSch>div>div button:before{ position: relative; top: 2px;}
#main_2022 .inNongSch>div.active>button:hover:before{ transform: rotate(180deg)}
#main_2022 .nongSch .main_barcode{ position: absolute; bottom: 0; width: 100%; height: 120px; background: #153451; padding: 35px 0 0 115px; box-sizing: border-box; font-size: 1.05rem; color: #aed6ff;}
#main_2022 .nongSch .main_barcode::before{ content: ''; display: block; background: url(../images/main_2022/icon_2022.png) no-repeat 0 -54px; width: 52px; height: 48px; position: absolute; left: 50px; top: 39px}
#main_2022 .nongSch .main_barcode strong{ display: block; font-size: 1.2rem; color: #fff; font-weight: 500;}
#main_2022 .nongSch .main_barcode a{ position: absolute; right: 50px; top: 39px; display: inline-block; height: 46px; border: 1px solid #caddf3; border-radius: 5px; padding: 0 20px; line-height: 46px; color: #fff; font-weight: 400; font-size: 1rem;}
#main_2022 .nongSch .main_barcode a::before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat -78px 0; width: 13px; height: 13px; margin-right: 5px}

#main_2022 .main_section2{ background: #e6f1ff; position: relative; z-index: 1; border-top: 1px solid #cbcbcb; border-bottom: 1px solid #cbcbcb;}
#main_2022 .main_section2>.inner{ display: flex}
#main_2022 .main_section2 h2{ flex: 1}
#main_2022 .main_section2>.inner div{ flex: 6}
#main_2022 .main_section2>.inner div ul{ display: flex; padding: 20px 0}
#main_2022 .main_section2>.inner div ul li{ flex: 1}
#main_2022 .main_section2>.inner div ul li a{ display: block; text-align: center; line-height: 1.1;}
#main_2022 .main_section2>.inner div ul li a i{ display: block; width: 90px; height: 83px; margin: 0 auto 8px; border-radius: 10px; background: #fff; -webkit-transition: 0.3s cubic-bezier(0.5, 1, 0.75, 1); transition: 0.3s cubic-bezier(0.5, 1, 0.75, 1); border: 2px solid transparent; box-sizing: border-box;}
#main_2022 .main_section2>.inner div ul li a:hover i{ border-color: #0089d2}
#main_2022 .main_section2>.inner div ul li a i:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat; height: 43px; margin-top: 20px;}
#main_2022 .main_section2>.inner div ul li.mn1 a i:before{ background-position: 0 -107px; width: 36px}
#main_2022 .main_section2>.inner div ul li.mn2 a i:before{ background-position: -43px -107px; width: 32px}
#main_2022 .main_section2>.inner div ul li.mn3 a i:before{ background-position: -79px -107px; width: 35px}
#main_2022 .main_section2>.inner div ul li.mn4 a i:before{ background-position: -120px -107px; width: 33px}
#main_2022 .main_section2>.inner div ul li.mn5 a i:before{ background-position: -160px -107px; width: 32px}
#main_2022 .main_section2>.inner div ul li.mn6 a i:before{ background-position: -193px -107px; width: 40px}
#main_2022 .main_section2>.inner div ul li.mn7 a i:before{ background-position: -240px -107px; width: 28px}
#main_2022 .main_section2>.inner div ul li.mn8 a i:before{ background-position: -278px -107px; width: 39px}
#main_2022 .main_section2>.inner div ul li.mn9 a i:before{ background-position: -322px -110px; width: 39px}

#main_2022 .main_section2:before{ content: ''; display: block; position: absolute; left: 0; top: 0; width: calc(50% - 675px); height: 100%; background: #d5e6fb; z-index: -1;}
#main_2022 .main_section2 h2{ background: #d5e6fb url(../images/main_2022/favo_bg.png) no-repeat 100% 85%; padding: 20px 0 40px 10px; font-size: 1.3rem; font-weight: 500; box-sizing: border-box;}
#main_2022 .main_section2 h2 span{ display: block; font-size: 1rem; font-weight: 300; line-height: 1.3;}

#main_2022 .main_section3{ padding: 20px 0}
#main_2022 .mainService2{ display: flex; height: 270px;}
#main_2022 .mainService2 .tablsNotiA{ width: 67%; margin: 0 20px 0 0; position: relative}
#main_2022 .mainService2 .tablsNotiA h2{ position: absolute; width: 25%; height: 45px; top: 0}
#main_2022 .mainService2 .tablsNotiA h2 button{ width: 100%; height: 100%; border: 1px solid #cbcbcb; background: #fff; border-radius: 10px}
#main_2022 .mainService2 .tablsNotiA>div.active h2 button{ background: #23507b; border: 0; color: #fff; font-weight: 500; transition: all .2s; -webkit-transition: all .2s;}
#main_2022 .mainService2 .tablsNotiA .notice h2{ left: calc(25% + 10px)}
#main_2022 .mainService2 .tablsNotiA .data h2{ left: calc(50% + 20px)}
#main_2022 .mainService2 .tablsNotiA>div>div{ display: none; padding-top: 65px;}
#main_2022 .mainService2 .tablsNotiA>div>div ul{ background: #fff; height: 205px; border-radius: 10px; padding: 10px 25px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 10px; overflow: hidden;}
#main_2022 .mainService2 .tablsNotiA>div>div ul li{ margin: 8px 0; position: relative}
#main_2022 .mainService2 .tablsNotiA>div>div ul li a{ display: block; width: 80%; line-height: 35px; overflow: hidden; text-overflow: ellipsis; /* white-space: nowrap; */font-weight: 400; padding-left: 16px; position: relative; height: 38px; font-size: 1.1rem;}
#main_2022 .mainService2 .tablsNotiA>div>div ul li a:before{ content: ''; display: block; width: 4px; height: 4px; background: #1d4162; position: absolute; left: 0; top: 16px}
#main_2022 .mainService2 .tablsNotiA>div>div ul li a strong{ display: inline-block; margin-left: 10px; font-size: 0.95rem; color: #999; font-weight: 300; vertical-align: top;}
#main_2022 .mainService2 .tablsNotiA>div>div ul li span{ display: block; position: absolute; right: 0; top: 0; color: rgba(18,18,18,.7); line-height: 30px}
#main_2022 .mainService2 .tablsNotiA>div>div ul li span:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat -94px 0; width: 15px; height: 15px; margin-right: 5px; vertical-align: middle;}
#main_2022 .mainService2 .tablsNotiA>div.active>div{ display: block}
#main_2022 .mainService2 .tablsNotiA>div>div>button{ position: absolute; right: 0; top: 0; border-radius: 10px; background: #1d4162; height: 45px; width: 45px; font-size: 0;}
#main_2022 .mainService2 .tablsNotiA>div>div>button:before{ content: '\002B'; display: inline-block; font-size: 1.5rem; color: #fff}

#main_2022 .mainService2 .plsDiv{ width: 33%; background: #baf4d6 url(../images/main_2022/pls_bg.jpg) no-repeat 50% 50%; background-size: cover; border-radius: 10px; text-align: center; position: relative}
#main_2022 .mainService2 .plsDiv h2{ text-align: center; font-size: 1.3rem; font-weight: 500; color: #121212; line-height: 60px;}
#main_2022 .mainService2 .plsDiv a{ display: block; position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); background: #23507b; color: #fff; line-height: 40px; padding: 0 35px}
#main_2022 .mainService2 .plsDiv a:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat -78px 0; width: 13px; height: 13px; margin-right: 5px;}

#main_2022 .mainService3{ display: flex}
#main_2022 .mainService3 h2{ font-size: 1.3rem; font-weight: 500; color: #121212; line-height: 60px;}
#main_2022 .mainService3 .videoDiv{ flex: 1; margin-right: 10px;}
#main_2022 .mainService3 .videoDiv ul li{ width: 100% !important}
#main_2022 .mainService3 .videoDiv ul li a{ display: block; width: 100%; height: 230px; overflow: hidden; border-radius: 10px;}
#main_2022 .mainService3 .videoDiv ul li a .thumb{ display: block; height: 140px; overflow: hidden;}
#main_2022 .mainService3 .videoDiv ul li a .thumb img{ max-width: 100%; transition: .5s transform ease;}
#main_2022 .mainService3 .videoDiv ul li a:hover .thumb img{ transform: scale(1.08) rotate(0.1deg);}
#main_2022 .mainService3 .videoDiv ul li a em{ display: block; width: 30%; margin: 0 auto -15px; position: relative; top: -15px; background: #153451; color: #fff; text-align: center; line-height: 30px; border-radius: 10px;}
#main_2022 .mainService3 .videoDiv ul li a strong{ display: block; font-weight: 400; color: #121212; line-height: 1.3; padding: 10px 15px}
#main_2022 .mainService3 .videoDiv ul li a .mov_tm{ position: absolute; bottom: 5px; left: 0; font-size: 0.9rem; color: #818181; padding: 5px 15px}
#main_2022 .mainService3 .videoDiv ul li a .mov_tm:before, #main_2022 .mainService3 .manualDiv .usrManual>ul li a span:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat -94px 0; width: 15px; height: 15px; margin-right: 5px; opacity: .8; position: relative; top: 2px}
#main_2022 .mainService3 .videoDiv>div, #main_2022 .mainService3 .manualDiv>div{ height: 230px; box-sizing: border-box; border: 1px solid #cbcbcb; background: #fff; border-radius: 10px; position: relative;}
#main_2022 .mainService3 .videoDiv .makeMov strong{ height: 55px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2;-webkit-box-orient:vertical; box-sizing: border-box;}
#main_2022 .mainService3 .videoDiv .bx-controls-direction a{ display: block; position: absolute; top: 70px; width: 35px; height: 30px; background: rgba(255,255,255,.7); font-size: 0; z-index: 100; text-align: center;}
#main_2022 .mainService3 .videoDiv .bx-controls-direction a.bx-next{ right: 0}
#main_2022 .mainService3 .videoDiv .bx-controls-direction a:before{ content: '\276E'; display: inline-block; color: #121212; font-size: 1rem; line-height: 28px; opacity: .8;}
#main_2022 .mainService3 .videoDiv .bx-controls-direction a.bx-next:before{ content: '\276F';}
#main_2022 .mainService3 .manualDiv{ flex: 2.4}
#main_2022 .mainService3 .manualDiv .manual{ background: #dbedca url(../images/main_2022/manual_bg.png) no-repeat 100% 100%; position: relative; box-sizing: border-box; padding: 20px 0 0 285px}
#main_2022 .mainService3 .manualDiv .manual .usrManual{ position: absolute; left: 0; top: 0; width: 265px; height: 100%; background: #2fc5a4 url(../images/main_2022/usrManual_bg.png) no-repeat 0 100%; border-radius: 10px; box-sizing: border-box; padding: 20px}
#main_2022 .mainService3 .manualDiv .manual ul{ margin-top: 10px}
#main_2022 .mainService3 .manualDiv .manual ul li{ margin-bottom: 5px}
#main_2022 .mainService3 .manualDiv .manual ul li a{ display: block; height: 30px; line-height: 30px; box-sizing: border-box; padding: 0 10px; font-size: 0.92rem;}
#main_2022 .mainService3 .manualDiv .manual>ul>li{ float: left; margin: 0 10px 5px 0; width: 40%}
#main_2022 .mainService3 .manualDiv .manual>ul>li a{ background: rgba(255,255,255,.3); border: 1px solid #acbc9c; transition: all .2s; -webkit-transition: all .2s; position: relative}
#main_2022 .mainService3 .manualDiv .manual>ul>li a:hover{ background: #fff; color: #000; border-color: #007575}
#main_2022 .mainService3 .manualDiv .manual>ul>li a:hover:after{ content: '\261E'; display: block; font-size: 1rem; position: absolute; right: 10px; top: 0}
#main_2022 .mainService3 .manualDiv .usrManual>ul li a{ background: rgba(255,255,255,.8); position: relative; color: #121212; transition: all .2s; -webkit-transition: all .2s; border: 1px solid transparent; box-sizing: border-box;}
#main_2022 .mainService3 .manualDiv .usrManual>ul li a:hover{ border: 1px solid #007575}
#main_2022 .mainService3 .manualDiv .usrManual>ul li a span{ position: absolute; right: 10px;}

#main_2022 .main_section4{ background: #caddf3; padding: 35px 0;}
#main_2022 .main_section4 .inner>ul{ display: flex}
#main_2022 .main_section4 .inner>ul li{ flex: 1; margin-left: 30px;}
#main_2022 .main_section4 .inner>ul li a{ display: block; height: 70px; position: relative; padding: 15px 0 0 85px; box-sizing: border-box;}
#main_2022 .main_section4 .inner>ul li a i{ display: block; width: 70px; height: 70px; border-radius: 50%; background: #3086c9; position: absolute; left:0; top: 0; text-align: center; transition: all .2s; -webkit-transition: all .2s;}
#main_2022 .main_section4 .inner>ul li a:hover i{ background: #23507b}
#main_2022 .main_section4 .inner>ul li a i:before{ content: ''; display: inline-block; background: url(../images/main_2022/icon_2022.png) no-repeat; height: 41px; margin-top: 14px}
#main_2022 .main_section4 .inner>ul li.je a i:before{ background-position: -69px -54px; width: 36px;}
#main_2022 .main_section4 .inner>ul li.su a i:before{ background-position: -109px -54px; width: 40px;}
#main_2022 .main_section4 .inner>ul li.pa a i:before{ background-position: -153px -54px; width: 41px;}
#main_2022 .main_section4 .inner>ul li.su2 a i:before{ background-position: -200px -54px; width: 37px;}
#main_2022 .main_section4 .inner>ul li.si a i:before{ background-position: -243px -54px; width: 28px;}
#main_2022 .main_section4 .inner>ul li.no a i:before{ background-position: -278px -54px; width: 33px;}
#main_2022 .main_section4 .inner>ul li a span{ display: block; line-height: 1.2;}
#main_2022 .main_section4 .inner>ul li a span strong{ font-size: 1.3rem; margin-right: 5px;}

#main_2022 #footer{ background: #3a3e3f; position: relative;}
#main_2022 .footMn{ background: #2e3233; padding: 10px 0 13px; height: 70px; box-sizing: border-box; border-bottom: 1px solid #4e5253}
#main_2022 .footMn li:before{ content: ''; width: 6px; height: 6px; border-radius: 50%; background: #8c8c8c;}
#main_2022 .footMn li:first-child:before{ width: 0}
#main_2022 .footMn li:first-child a{ color: #ffe240}
#main_2022 #footer>.inner{ padding: 15px 0 55px; box-sizing: border-box;}
#main_2022 .btm_wa{ left: 400px; right: auto; top: 15px}
#main_2022 .btm_wa img{ height: 65px}
#main_2022 #footer>.inner>div{ right: 0; top: 0; box-sizing: border-box; text-align: left; z-index: 1; padding: 10px 40px 0 110px; color: #fff; background: url(../images/main_2022/info_bg.png) no-repeat 0 100%; background-size: 100px auto; height: 100%;}
#main_2022 #footer>.inner>div strong{font-size: 1.6rem; line-height: 1.2; letter-spacing: 0;}
#main_2022 #footer>.inner>div span{ display: block; position: static; margin-top: 0; font-size: 0.9rem; width: 100%}
#main_2022 #footer>.inner>div:after{ width: 0}
#main_2022 .move_top{ background: rgba(46,50,51,0); bottom: 125px; width: 68px; height: 68px; box-sizing: border-box;}
#main_2022 .move_top.on{ background: rgba(46,50,51,0.95); z-index: 100}

@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.animate__flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}

#main_2022 .main_section2>.inner div ul li a i:before, #main_2022 .main_section4 .inner>ul li a i:before, #main_2022 .mainBannerZone .mainLink>a i:before, #main_2022 .inNongSch>div.active>button:before, #main_2022 .mainSch .formSch button:before, #main_2022 .inNongSch>div>div button:before{ transition: all .5s; -webkit-transition: all .5s;}

#main_2022 .main_section2>.inner div ul li a:hover i:before, #main_2022 .main_section4 .inner>ul li a:hover i:before, #main_2022 .mainBannerZone .mainLink>a:hover i:before{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: flipInX; animation-name: flipInX; animation-duration: 0.5s;}

#main_2022 .inNongSch>div.active>button:hover:before, #main_2022 .mainSch .formSch button:hover:before, #main_2022 .inNongSch>div>div button:hover:before{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: rotateIn; animation-name: rotateIn; animation-duration: 0.5s;}

#main_2022 #content{ max-width: 1350px;}
#main_2022 .locArea, #main_2022 .eduMain{ margin-top: 80px;}

/* 서브 반영 안함
#main_2022 #container{ background: #ebeef4;}
#main_2022 .locArea{ background: transparent; margin-top: 100px; position: absolute; z-index: 10;}
#main_2022 .locArea .inner{ height: 50px;}
#main_2022 .locArea .inner>a, #main_2022 .locArea .inner>strong{ color: #323232; line-height: 50px; padding: 0 7px 0 15px; font-size: 0.95rem;}
#main_2022 .locArea .inner>strong{ margin-right: 25px}
#main_2022 .locArea .inner>a:before, #main_2022 .locArea .inner>strong:before{ background: transparent; width: 6px; height: 6px; border-top: 1px solid #a1a1a1; border-right: 1px solid #a1a1a1; transform: rotate(45deg); left: -3px; top: 22px}
#main_2022 .locArea .inner>a:first-child{ padding: 0; width: 30px; height: 50px; font-size: 0}
#main_2022 .locArea .inner>a:first-child:before{ background: url(../images/main_2022/icon_2022.png) no-repeat -111px -28px; width: 15px; height: 16px; border: 0; transform: none; left: 7px; top: 18px}
#main_2022 #content{ max-width: 1350px; background: transparent; padding: 100px 0 20px;}
#main_2022 .lftArea{ margin-top: 0; width: 230px; z-index: 20}
#main_2022 .lftArea>h2{ height: 100px; margin: 0; box-sizing: border-box; padding-top: 35px; border-radius: 10px 10px 0 0; background: linear-gradient(130deg, #12b8ba, #23507b); border-bottom: 3px solid #23507b; text-shadow: 1px 1px 0 #23507b, 1px -1px 0 #23507b, -1px 1px 0 #23507b, -1px -1px 0 #23507b, 1px 0px 0 #23507b, 0px 1px 0 #23507b, -1px 0px 0 #23507b, 0px -1px 0 #23507b;}
#main_2022 #lnb{ background: #fff; border-radius: 0 0 10px 10px; padding: 0 10px 50px}
#main_2022 .lftArea>ul>li>a{ border: 0; border-bottom: 1px solid #c7c7c7; margin: 0; padding: 17px 25px 13px 5px; line-height: 1.1; transition: all .2s ease; -webkit-transition: all .2s ease;}
#main_2022 .lftArea>ul>li.has-sub>a:after{ background: url(../images/main_2022/icon_2022.png) no-repeat 0 -305px; width: 25px; height: 23px; top: calc(50% - 11px); right: 0;}
#main_2022 .lftArea>ul>li.has-sub>a:hover:after{ background-position: 0 -331px;}
#main_2022 .lftArea>ul>li.has-sub.open>a:after{ background-position: 0 -357px;}
#main_2022 .lftArea>ul>li.has-sub.open>a, #main_2022 .lftArea>ul>li.active>a{ background: #fff; color: #323232; border-bottom: 2px solid #3086c9; font-weight: 500;}
#main_2022 .lftArea ul ul{ margin: 5px 0 0; border: 0; background: #e7f3fc; padding: 0 0 10px}
#main_2022 .lftArea ul ul>li>a{ padding: 6px 22px 4px 17px}
#main_2022 .lftArea ul ul>li>a:before{ width: 5px; height: 5px; border-radius: 50%; background: linear-gradient(360deg, #1058a4, #0094d9); left: 6px; top: 16px}
#main_2022 .lftArea ul ul>li.has-sub>a:after{ content: '';background: url(../images/main_2022/icon_2022.png) no-repeat -32px -305px; width: 15px; height: 15px; right: 5px; top: 9px}
#main_2022 .lftArea ul ul>li.has-sub.open>a:after{ background-position: -32px -322px;}
#main_2022 .lftArea ul ul ul{ margin: 5px; background: #fff; padding: 5px 0}
#main_2022 .lftArea ul ul ul li a{ padding: 5px 0 3px 12px; font-size: 0.9rem; color: #707070}
#main_2022 .lftArea ul ul ul li a.active{ font-weight: 500;}
#main_2022 #content>.innerCont{ background: #fff; padding: 45px 30px 30px; border-radius: 10px; box-sizing: border-box; width: calc(100% - 230px - 30px);}
#main_2022 #content>.innerCont h1{ margin: 0 0 20px; padding: 0; line-height: 55px; font-size: 1.95rem;}
#main_2022 #content>.innerCont .innerContPrt:before{ background: url(../images/main_2022/icon_2022.png) no-repeat -156px -27px; width: 17px; height: 18px}
#main_2022 #content>.innerCont .innerContPrt{ width: 40px; height: 40px; right: 30px; top: 50px; background: #e7f3fc; transition: all .2s; -webkit-transition: all .2s;}
#main_2022 #content>.innerCont .innerContPrt:hover{ background: #bae1ff;}
#main_2022 #content.nonLftArea .lftArea{ }
#main_2022 #content.nonLftArea>.innerCont{ width: 100%}
#main_2022 #content.nonLftArea .lftArea>button[type='button'].open{ margin-top: -19px;}
#main_2022 .lftArea>button[type='button']{ border-radius: 10px 0 0;}
#main_2022 #content.nonLftArea .lftArea>button[type='button'].open:before{ height: 0}
#main_2022 .sectionCont_tp{ background: #fff; border: 8px solid #f2f4f5;}
*/

/* 2022 Renewal end */

/* 1000 이상 */
@media all and (min-width:1000px){
#allNav .allMenu  li.has-sub>a{ position: relative;}
#allNav .allMenu .depth2 li.has-sub>a:after{ content: '\002B'; display: block; position: absolute; right: 10px; top: 8px;   transition: all .2s; -webkit-transition: all .2s;}
#allNav .allMenu .depth2 li.has-sub.open>a:after{ content: '\002D'; }
#allNav .allMenu .depth3 li.has-sub>a:after{ top: 5px}
#allNav .allMenu .depth3 li a{ border-bottom: 1px solid #0F3356; padding: 6px 20px}
#allNav .allMenu .depth4 li a{ border-bottom: 0; font-size: 0.9em; padding: 8px 20px;}
#allNav .allMenu>ul>li:nth-child(6){ clear: both}
}

/* 2022 Renewal start */
@media all and (max-width:1370px){
	#main_2022 #gnb .subGnb>ul{ width: 100%; margin-left: calc(50% - 100% / 2); box-sizing: border-box; padding: 15px 0}
	#main_2022 #gnb>li:nth-child(2) .subGnb>ul{ margin-left: calc(50% - 100% / 2 + 16.66%);}
	#main_2022 #gnb>li:nth-child(3) .subGnb>ul{ margin-left: calc(50% - 100% / 2 + 16.66% + 16.66%);}
	#main_2022 #gnb>li:nth-child(4) .subGnb>ul{ margin-left: calc(50% - 100% / 2 + 16.66% + 16.66% + 16.66%);}
	#main_2022 #gnb>li:nth-child(5) .subGnb>ul{ margin-left: calc(50% - 100% / 2 + 16.66% + 16.66% + 16.66% + 16.66%);}
	#main_2022 #gnb>li:nth-child(6) .subGnb>ul{ margin-left: calc(50% - 100% / 2 + 16.66% + 16.66% + 16.66% + 16.66% + 16.66%);}
}

/*
@media all and (max-width:1366px){
	#main_2022 .tpSchLayer, #main_2022 .mypageLayer{ width: 100%; position: fixed; left: 0; right: auto; top: 80px; margin: 0}
	#main_2022 .tpSchLayer>div, #main_2022 .mypageLayer .afterClear{ width: 100%; margin: 0;}
	#main_2022 .tpSchLayer>div .btnClose{ right: 30px;}
	#main_2022 #allNav .tpMember .mypageLayer>div .btnClose{ right: 0}
}
*/

@media all and (max-width:1300px){
	#main_2022 #gnb>li>a{ font-size: 1.1rem;}
}

@media all and (max-width:1200px){
	#main_2022 #header .tpLogo{ background-size: 160px auto; width: 160px; margin-top: 22px}
	#main_2022 #gnb>li>a{ font-size: 1rem; padding: 22px 8px 23px; width: 110px}
	#main_2022 #gnb .subGnb>ul li a{ font-size: 0.9rem;}
	#main_2022 .mainSch .hashTag{ display: block;}
	#main_2022 .mainService1{ margin: 0;}
	#main_2022 .nongSch .main_barcode{ height: auto; padding: 10px 0; min-height: 70px; text-align: center;}
	#main_2022 .nongSch .main_barcode::before{ display: inline-block; position: static; vertical-align: middle; margin-right: 5px;}
	#main_2022 .nongSch .main_barcode strong{ display: inline-block; margin-left: 10px;}
	#main_2022 .nongSch .main_barcode a{ height: 100%; border: 0; width: 100%; font-size: 0; right: 0; left: 0; top: 0; padding: 0}
	#main_2022 .nongSch .main_barcode a::before{ width: 0}
	#main_2022 .mainService3 h2{ font-size: 1.15rem; line-height: 1.8; margin: 20px 0 10px}
	#main_2022 .main_section2>.inner{ display: block;}
	#main_2022 .main_section2>.inner div, #main_2022 .main_section4{ overflow: hidden; overflow-x: auto;}
	#main_2022 .main_section2>.inner div::-webkit-scrollbar, #main_2022 .main_section4::-webkit-scrollbar{ height: 5px; /*스크롤바의 너비*/}
	#main_2022 .main_section2>.inner div::-webkit-scrollbar-thumb, #main_2022 .main_section4::-webkit-scrollbar-thumb{ background-color: #0089d2;  /*스크롤바의 색상*/}
	#main_2022 .main_section2>.inner div::-webkit-scrollbar-track, #main_2022 .main_section4::-webkit-scrollbar-track{ background-color: #e4f4ff; /*스크롤바 트랙 색상*/}
	#main_2022 .main_section2>.inner div ul, #main_2022 .main_section4 .inner ul{ display: table}
	#main_2022 .main_section2>.inner div ul li, #main_2022 .main_section4 .inner ul li{ display: table-cell;}
	#main_2022 .main_section2>.inner div ul li a{ width: 130px}
	#main_2022 .main_section2 h2{ float: none; padding: 10px 0 0; background: #fff; text-align: center;}
	#main_2022 .main_section2 h2 span{ display: none}
	#main_2022 .main_section4 .inner>ul li a{ width: 200px}
}
/* 2022 Renewal end */

/* 1320 이하 */
@media all and (max-width:1320px){
.tpRgt{ right: 1%}
#container.pes #content .innerCont{ margin: 13px;}
#container.pes #content .innerCont .pesMn{ width: calc(100% - 420px)}
#container.pes #content .innerCont .pesMn ul li>div .detailView{ width: 100%}

#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti{ width: calc(70% + 10px);}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti{ width: calc(30% - 15px);}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a img{ height: 100%}
#container.main2020 .btmPesInfo .pesEduMov{ width: 45%; margin: 0}
#container.main2020 .btmPesInfo .banPls{ width: 25%;}
#container.main2020 .btmPesInfo .manualArea{ width: calc(30% - 15px)}
#container.main2020 .main_mid .pop_schWord{ position: relative; display: inline-block; right: auto; top: 0; width: 300px;}
#container.main2020 .main_mid .pop_schWord>span{ display: inline-block;}
#container.main2020 .main_mid .pop_schWord .schWord{ width: 65%; height: 50px}
#container.main2020 .main_mid .pop_schWord .schWord .bx-viewport{ height: 50px !important}
#container.main2020 .main_mid .pop_schWord ul li>a{ line-height: 50px}
}

@media all and (max-width:1282px){
#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes{ width: 50%; margin: 0}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA, #container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA{ width: 25%}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown{ padding: 13px 5px; text-align: center;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a{ padding: 0 5px 0 40px; text-align: left}

.sch_theme p+p span{ width: 100%; margin: 0 0 10px}
.sch_theme+.searchBox ul li{ width: 100%}
}

@media all and (max-width:1100px){
/* 메인 */
#container.main2020 .main_mid .midTotalSch, #container.main2020 .main_mid .favoBox, #container.main2020 .main_mid .pesSchBox{ border-radius: 0}
#container.main2020 .main_mid{ height: auto; margin: 0 0.5em; width: auto;}
#container.main2020 .main_mid h2{ text-align:center; }
#container.main2020 .main_mid .pesSchBox .inPesSch .schBox h2{ text-align: left}
#container.main2020 .main_mid .favoBox, #container.main2020 .main_mid .pesSchBox{ width: 100%;}
#container.main2020 .main_mid .favoBox{  padding: 15px 0 0}
#container.main2020 .main_btm .btmWeekInfo .infoBox{ width: 100%; margin: 0; box-sizing: border-box}
#container.main2020 .main_btm .btmWeekInfo .infoBox h2{ width: 150px}
#container.main2020 .main_btm .btmWeekInfo .infoBox+.infoBox{ margin-top: -1px}
#container.main2020 .main_btm>div{ margin: 0 0.5em 30px}
#container.main2020 .main_btm .btmLnkA{ overflow-x: hidden}

#container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes{ width: 70%;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA{ width: 30%;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA{ width: 100%; margin-top: 10px; height: auto}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA h2{ display: none}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp{ padding: 10px 0; height: auto}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a{ text-align: left; vertical-align: top;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a span, #container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a em{ display: inline-block}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a span{ text-align: center; vertical-align: top;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a em{ margin-left: 15px; line-height: 80px; font-size: 1.15em}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown{ height: auto}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a{ width: 48%; line-height: 30px;  font-size: 1.2em; text-align: center; font-weight: 500; vertical-align: top;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a br{ display: none}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a:before{ position: static; display: inline-block; vertical-align: middle; margin-right: 8px}

#container.main2020 .main_btm.main_btm2>div{ margin: 20px 0.5em}
#container.main2020 .btmPesInfo .banPls>p:before{ width: 100%;}
}

/* 1000이하 */
@media all and (max-width:1000px){
#wrap::before{ content: ''; position: fixed; background: transparent; top:0; left: 0; bottom: 0; right: 0; z-index:10; transition: background .3s; z-index:-1;}
#wrap.modalBack::before{ content: ''; background: rgba(0,0,0,0.8); z-index:1;}
#allNav{ display: block; position:fixed; bottom:0; top:0; right:-100%; padding-left:0; z-index:300; width: 100%; background: #fafafa; border-top:0; overflow-y:auto; transition:right .3s;}
#allNav.active{ display: block; right: 0;}
#allNav>div{ position: relative;}
#allNav .allMenu{ position: static; width: auto; height: auto; background: #008d8f}
#allNav .allMenu ul ul{ display: none; margin: 0}
#allNav .tpMember{ position: static; display: block; text-align: left; padding: 10px 0 0; line-height: 45px}
#allNav .allMenu>strong{ display: none}
#allNav .allMenu>button{ top: 10px; right: 1%; left: auto; transform: inherit}
#allNav .allMenu>button:before{ color: #000; font-size: 20px}
#allNav .allMenu>ul{ margin: 0; padding: 0}
#allNav .allMenu>ul li{ width: 100%; border-bottom: 1px solid rgba(255,255,255,.5); float: none; margin: 0; min-height: auto}
#allNav .allMenu>ul>li a{ display: block; padding: 8px 10px; color: #fff; font-weight: 400; font-size: 1.3em; pointer-events: auto;}
#allNav .allMenu>ul ul ul{ background: #fff}
#allNav .allMenu>ul ul li a{ font-size: 1.05em}
#allNav .allMenu>ul ul ul{ padding: 10px 0}
#allNav .allMenu>ul ul ul li a{ color: #828282; font-size: 0.99em; padding: 5px 10px 5px 25px;}
#allNav .allMenu>ul ul ul li a:before{ content: ''; display: block; width: 3px; height: 3px; background: #008d8f; position: absolute; left: 15px; top: 15px}
#allNav .allMenu ul li li:last-child{ border-bottom: 0}
#allNav .allMenu ul li.has-sub a{ position: relative; text-align: left}
#allNav .allMenu ul li.has-sub>a:after{ content: '';  display: block; position: absolute; right: 15px; top: 15px; background: url(../images/common/icon2020.png) no-repeat 0 0; width: 11px; height: 11px;}
#allNav .allMenu ul li.has-sub.open>a:after{ background-position: -12px 0}
#allNav.active .tpMember.beforeL+.allMenu{ width: inherit}
#allNav .allMenu .depth3>li.has-sub>a{ pointer-events: none;}
#allNav .allMenu .depth4{ display: block !important; margin: 0 10px; background: #f3f3f3; border-top: 1px solid #ddd; margin: 0 10px 10px;}
#allNav .allMenu .depth4 li a:before{ width: 5px; height: 2px; background: #757575}

#header .tpLogo{ margin: 15px 0 0 10px}
#header .inner{ background: rgba(255,255,255,.7); border-bottom: 1px solid #fff; height: 1px !important}
#gnb{ display: none}
.tpRgt{ position: static; padding: 15px 10px; height: 45px;}
.mypageLayer{ display: block; position: static; border-top: 1px solid #38444a}
.mypageLayer>div{ background: #fff; width: 100%; border: 0;}
.mypageLayer>div ul{ margin: 0 20px; padding: 10px 0}
.mypageLayer>div strong, .mypageLayer>div .btnClose{ display: none}
#allNav .tpMember a{ margin: 0 0 10px 10px; font-size: 1.4em; font-weight: 500}
#allNav .tpMember .mypageLayer>div ul li a{ font-size: 1em; font-weight: 300}
#allNav .tpMember .mypageLayer>div .btnLogout{ position: absolute; top: 15px; right: 60px;  border-radius: 0; width: auto; border-radius: 35px; padding: 8px 15px}

/* 마이페이지 레이어 */
#allNav .tpMember{ padding: 0}
#allNav .tpMember a.mypage{ display: none}
.mypageLayer{ padding-top: 0; border: 0; background: none}
.mypageLayer .afterClear{ width: 100%; background: none; border: 0; padding: 0}
.mypageLayer .afterClear>div, .mypageLayer .afterClear>ul{ float: none; width: 100%; padding: 0; margin: 0}
.mypageLayer .afterClear>div p{ border-bottom: 1px solid #0f3356; color: #323232; line-height: 50px; margin: 0; background: #fff; padding: 10px 0}
.mypageLayer .afterClear>div p strong{ display: inline-block; text-indent: 10px; font-size: 1.1em}
.mypageLayer .afterClear>div p strong:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -137px -20px; width: 26px; height: 26px; vertical-align: middle; margin-right: 5px}
#allNav .mypageLayer .afterClear>div a{ background: #0f3356; color: #fff; float: left; width: 50%; padding: 10px 0 8px; text-align: center; box-sizing: border-box}
#allNav .mypageLayer .afterClear>div a+a{ border-left: 1px solid #fafafa}
.mypageLayer .afterClear>ul{ background: #0f3356; margin: 49px 0 0; padding: 5px 0 10px}
.mypageLayer .afterClear>ul:after{ content: ''; display: block; clear: both;}
.mypageLayer .afterClear>ul li{ float: left; width: 50%}
.mypageLayer .afterClear>ul li a{ font-size: 1em}
#allNav .allMenu>button{ top: 10px}
.mypageLayer .afterClear>ul{ display: none}

#allNav .tpMember.beforeL{ padding-top: 78px;}
#allNav .tpMember.beforeL:before{ content: ''; display: block; position: absolute; left: 5px; top: 15px; background: url(../images/common/ci.png) no-repeat 0 0 / auto 50px; height: 50px; width: calc(100% - 5px)}
#allNav .tpMember.beforeL a{ margin: 0; font-size: 1em; font-weight: 400; padding: 10px 0 8px; float: left; width: 50%; background: #0f3356; color: #fff; text-align: center; line-height: 30px; box-sizing: border-box}
#allNav .tpMember.beforeL a.memberIn{ border-left: 1px solid #fafafa}

.tpSchLayer{ top: 76px; width: 100%;}
.tpSchLayer>div{ width: 100%; background: #323232; padding: 15px 0}
.tpSchLayer>div .inputData{ width: 90%; display: block; margin: 0 auto 5px}
.tpSchLayer>div .button{ width: 90%}
.tpSchLayer>div .btnClose{ right: 39px; top: -59px}

.locArea{ margin-top: 75px}
.locArea>div{ text-align: left}
.locArea .inner>strong{ display: none}

.lftArea, #content>.innerCont .innerContPrt{ display: none}
#content>.innerCont{ padding: 1em 0.5em}
#content>.innerCont h1{ text-align: center; margin: 0}

.footMn .inner{ text-align: center; padding: 8px 0;}
.footMn li{ float: none; display: inline-block}
.footMn li a{ padding: 0 10px; line-height: 30px}
#footer>.inner{ text-align: center; padding: 10px 0 20px}
#footer address strong{ display: block; font-size: 1.2em; margin-bottom: 10px}
#footer>.inner>div{ position: static; padding: 10px 0 0; text-align: center;}
#footer>.inner>div:after{ width: 0}
#footer>.inner>div strong{ display: inline-block; margin: 0 0 0 10px}

/* 반응형 테이블 */
.respon_tableArea{ width: 100%; overflow: hidden; border-top: 2px solid #236dc7;}
.respon_tableArea .default_table tbody td{ display: block; width: 100%; padding:10px; border: none; text-align: left; box-sizing: border-box; word-break: keep-all; word-wrap: break-word; border-bottom: 1px dashed #ccc;}
.respon_tableArea .default_table tbody td:last-child{ border-bottom: 1px solid #b3b3b3}
.respon_tableArea .default_table [data-cell-header]:before{ content: attr(data-cell-header); display: inline-block; min-width: 15%; margin-right: 15px; padding-right: 10px; font-size: 16px; font-weight: 700; color: #222; border-right: 1px solid #ccc;}
.respon_tableArea .default_table colgroup, .respon_tableArea .default_table thead th{ display: none}
.respon_tableArea .default_table tbody tr:nth-child(odd){ background: #f8f8f8;}

.detailGrid.detailGrid2{ padding: 5px}
.detailGrid.detailGrid2 .necessary{ margin: 0; padding: 0}
.detailGrid.detailGrid2>ul{ border-top: 1px solid #ccc; margin-top: 15px}
.detailGrid.detailGrid2>ul li{ width: 100% !important}
.detailGrid.detailGrid2>ul li>div:nth-child(odd){ padding: 8px 0}
.detailGrid.detailGrid2>ul li div{ padding: 0 5px}

.searchBox ul li.w100 label.dotL{ width: 100%; margin: 0}
.searchBox ul li label.dotL{ width: 25%}
.searchBox.pes_dtlSch .cropNm .dotL.w90p{ margin-left: 0}
.searchBox.pes_dtlSch .cropNm li.w25{ width: 50%}
.searchBox.pes_dtlSch .cropNm .dotL.w90p+.inputData{ width: calc(100% - 100px - 15px);}

.paging>a.prev, .paging>a.next{ margin: 0}
.button.small, .button.medium, .button.large{ padding:0 20px;}

.move_top{ bottom: 30px}
.move_top.on{ opacity: 1}

.jcal_outer{ width: 45%}

/* 통합검색 */
#content.wide>#totalSch{ padding: 1em 0.5em}
#totalSch .schBox{ padding: 20px}
#totalSch .schBox .totalSch_sch{ width: calc(100% - 75px); border-radius: 0}
#totalSch .schBox span{ margin-right: 0}
#totalSch .schBox .totalSch_sch input[type='text']{ width: 100%}
#totalSch .schBox button{ display: block; margin-top: 5px; width: 100%; border-radius: 0; line-height: 35px}
.detailSchBox{ padding: 0.5em}
.detailSchBox label{ display: block}
.detailSchBox>ul li .inputData, .detailSchBox>ul li>div{ width: 100%}
.detailSchBox .detailSchClose{ position: static; width: 100%; background: #ccc; font-size: 15px;}
.detailSchBox .detailSchClose:before{ display: none}
.detailSchBox .detailSchClose:hover{ transform: none}
.schWrap .schMenu>li { display: table}
.schWrap .schMenu>li a{ line-height: 25px; height: 105px; vertical-align: middle; display: table-cell; border-left: 0}
.schWrap .schMenu>li:first-child a{ border-left: 1px solid #c5c5c5}
.schWrap .schMenu>li a span{ display: block;}
.schWrap.schWrap2 .sch_tpBtn{ position: static; display: inline-block; margin: 0 20px 10px 0;}
.schResult_cont.schResult_cont2 .schContent{ padding-left: 0}
.connWord strong{ margin: 0 0 10px; display: block}
.connWord ul li:first-child{ margin: 0}
.connWord ul li:first-child:before{ display: none}
.schResult_cont .schTabsData ul li a{ line-height: 1.5; padding: 10px 0;}
.detailSchBox>ul li{ margin-left: 0}
.schAutoComplete{ width: 100%}
.schAutoComplete .innerBtm{ padding-left: 5px; width: 95%}
.schAutoComplete .innerBtm>a:after{ margin: 0 5px}
.schResult_cont .schContent{ float: none; width: 100%}
.schResult_cont.schResult_cont2 .schRgt{ width: 100%}
.schResult_cont .schContent .sch_list>li dd.inList{ padding-bottom: 0}
.schResult_cont .schContent .sch_list>li dd .path{ position: static; display: block; margin: 10px 0 0;}
.schResult_cont .schContent .sch_list>li dd .fileArea{ padding: 10px 0 0}

.error>div{ width: 100%; overflow: hidden; background: url(../images/common/error.png) no-repeat 50% 70px / 150px auto; padding-top: 230px}
.error>div:before{ border-top: 150px solid #60c4f1; border-left: 200px solid transparent; border-right: 200px solid transparent;}
.error>div>strong{ font-size: 2em;}

.detailGrid.inner_pic .picArea{ position: static; padding: 10px}
.detailGrid.inner_pic .picArea p{ margin: 0 auto}
.defineDiv .gridScroll table, .referS table{ width: 1000px}

.loginArea{ width: 100%}
.btnArea .fl, .btnArea .fr{ float: none}

/* 메인 */
#container.main2020 .main_tp ul li p{ padding: 10px 0 0 15px; line-height: 1;}
#container.main2020 .main_tp .bx-prev, #container.main2020 .main_tp .bx-next{ top: 130px}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont.active>div{ overflow: hidden}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li{ width: 50%}
#container.main2020 .main_tp .bx-pager, #container.main2020 .main_tp .bx-controls-auto, #container.main2020 .main_btm .btmLnkA a em{ display: none}

#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti{ width: 65%}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti{ width: 35%}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont h2{ width: 150px;}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont+.tablsNotiCont h2{ left: 150px}
#container.main2020 .main_btm .btmLnkA{ width: calc(100% - 1em); display: table; padding: 10px 0}
#container.main2020 .main_btm .btmLnkA a{ display: table-cell; width: 25%; padding: 0 !important; vertical-align: top;}
#container.main2020 .main_btm .btmLnkA .icLnk{  width: 25%; text-align: center}
#container.main2020 .main_btm .btmLnkA a:last-child{ border: 0}
#container.main2020 .main_btm .btmLnkA a span, #container.main2020 .main_btm .btmLnkA a strong br{ display: none}
#container.main2020 .main_btm .btmLnkA a i{ position: static; text-align: center}
#container.main2020 .main_btm .btmLnkA a strong{ font-size: 1.1em !important; text-align: center}
#container.main2020 .main_btm .btmLnkA a:first-child i:before, #container.main2020 .main_btm .btmLnkA a:last-child i:before{ transform: scale(.9);}

#container.main2020 .btmPesInfo .pesEduMov{ width: 65%}
#container.main2020 .btmPesInfo .banPls{ width: 35%; margin: 0}
#container.main2020 .btmPesInfo .manualArea{ width: 100%; margin-top: 10px}
#container.main2020 .btmPesInfo .manualArea .manualD ul li{ display: inline-block; width: 32%; vertical-align: top;}
#container.main2020 .btmPesInfo .manualArea .manualD ul li a{ padding: 5px 15px; font-size: 1.085em}

#container.main2020 .main_tp ul li.slideProc p{ padding: 10px 0; text-align: center; display: block}
#container.main2020 .main_tp ul li.slideProc p strong{ display: inline-block; font-size: 1.3em;}
#container.main2020 .main_tp ul li.slideProc .processU{ display: block; padding: 10px 0 0; width: 85%; margin: 0 auto}

#container.main2020 .main_mid .midTotalSch{ height: auto}

.schLayerBox{ position: fixed; left: 0; top: 0 ; width: 100%; height: 100%; z-index: 500}
.schLayerBox .consR dt{ display: block; width: 100%;}
.schLayerBox .consA, .schLayerBox .consR dd{ margin: 10px 0 0;}
.schLayerBox .afterClear .totalList{ margin: 8px 0}
}

/* 2022 Renewal start */
@media all and (max-width:1000px){
	#main_2022 #header .tpLogo{ background: url(../images/main_2022/ci.png) no-repeat 0 0; width: 200px; height: 48px; margin-top: 18px}
	#main_2022 #gnb{ display: none}
	#main_2022 .tpRgt .tpSch, #main_2022 .tpRgt .allMn{ margin-top: 10px}
	#main_2022 .tpSchLayer>div .button.voiceSch{ background: transparent;}
	#main_2022 .tpSchLayer>div .button.voiceSch:before{ background: url(../images/common/icon2020.png) no-repeat -513px 0; width: 28px; height: 39px; transform: scale(.8);}
	#main_2022 #allNav, #main_2022 #allNav .allMenu{ background: #fff;}
	#main_2022 #allNav .allMenu{ height: 100%; position: relative; z-index: 1;}
	#main_2022 #allNav .allMenu>span{ display: none}
	#main_2022 #allNav .tpMember{ position: absolute; z-index: 10; right: auto; left: 1%; top: 15px}
	/*#main_2022 #allNav .tpMember.afterL{ position: static; display: block; text-align: left;}
	#main_2022 .tpMember.afterL .mypageLayer{ display: block; position: absolute; top: 0; height: 75px; z-index: 10;}
	#main_2022 .mypageLayer .afterClear{ background: #fff; border: 0; border-bottom: 1px solid #cecece;}
	#main_2022 .mypageLayer .afterClear>div{ text-align: left;}
	#main_2022 .mypageLayer .afterClear>div p{ padding: 15px 0 0 10px}
	#main_2022 .mypageLayer .afterClear>div p:before{ margin: 0}
	#main_2022 .mypageLayer .afterClear>div p strong:before{ width: 0}*/
	#main_2022 .tpSchLayer>div .inputData, #main_2022 .tpSchLayer>div .button{ margin: 0 1% 5px; width: 98%}
	#main_2022 .tpSchLayer>div .btnClose{ right: 0}
	#main_2022 .tpSchLayer>div .button.voiceSch{ width: auto; margin: 0; right: 1%; font-size: 0; height: 50px; top: 57px;}
	/*
	#main_2022 #allNav .mypageLayer .afterClear>div a{ position: absolute; top: 20px; width: auto; height: auto; line-height: 35px; border: 0; font-size: 0; background: none; padding: 0; right: 90px}
	#main_2022 #allNav .mypageLayer .afterClear>div a:before{ background: url(../images/main_2022/icon_2022.png) no-repeat -183px 0; width: 34px; height: 23px; position: relative; top: 10px;}
	#main_2022 #allNav .mypageLayer .afterClear>div a.logout{ top: 20px; right: 60px; background: transparent; width: 30px}
	#main_2022 #allNav .mypageLayer .afterClear>div a.logout:before{ background-position: -256px 0; width: 18px; height: 22px; margin: 0;}
	#main_2022 #allNav .tpMember .mypageLayer>div .btnClose{ display: block; top: 22px}
	#main_2022 #allNav .tpMember .mypageLayer>div .btnClose:before{ color: #121212}*/

	#main_2022 #allNav .tpMember a.mypage{ display: none;}
	#main_2022 .mypageLayer{ padding-top: 0}
	#main_2022 .mypageLayer .afterClear>div p{ display: inline-block; padding: 0; border: 0}
	#main_2022 #allNav .tpMember a{ float: none; width: auto; display: inline-block; background: #f1f1f1; color: #000; border: 1px solid #ddd; line-height: 30px; margin-left: 10px; padding: 0 5px; border-radius: 5px; font-size: 14px}
	#main_2022 #allNav .tpMember a:before{ display: none;}
	#main_2022 #allNav .tpMember a.logout{ margin-left: -5px}

	#main_2022 #allNav .mypageLayer .afterClear>ul{ display: none}
	#main_2022 #allNav .allMenu:before{ background: #fff; height: 75px; border-bottom: 1px solid #ccc; box-shadow: none; box-sizing: border-box;}
	#main_2022 #allNav .allMenu>ul{ margin-top: 75px; height: calc(100% - 75px); display: block; padding: 0}
	#main_2022 #allNav .allMenu>ul:after{ content: ''; display: block; width: 160px; height: calc(100% - 75px); background: #153451; position: fixed; left: 0; top: 75px; z-index: -1}
	#main_2022 #allNav .allMenu>ul>li{ width: 100%; box-sizing: border-box; border: 0; min-height: auto; padding-bottom: 0}
	#main_2022 #allNav .allMenu ul li.has-sub>a:after{ width: 0;}
	#main_2022 #allNav .allMenu ul li:first-child ul.depth2{ display: block}
	#main_2022 #allNav .allMenu>ul>li>a{ width: 160px; text-align: center; font-size: 1.2rem; height: 85px; padding: 0; line-height: 85px; background: #153451; border-bottom: 1px solid #fff; cursor: pointer;}
	#main_2022 #allNav .allMenu>ul>li.open>a{ background: #fff; color: #121212; font-weight: 500;}
	#main_2022 #allNav .allMenu ul ul.depth2{ position: absolute; left: 160px; top: 75px; width: calc(100% - 160px); box-sizing: border-box; padding: 20px 20px 0}
	#main_2022 #allNav .allMenu ul ul.depth2>li{ border-bottom: 1px solid #ccc; position: relative;}
	#main_2022 #allNav .allMenu ul ul.depth2>li.has-sub:after{ content: '\002B'; display: block; position: absolute; right: 20px; top: 5px; color: #121212; font-size: 1.7rem;}
	#main_2022 #allNav .allMenu ul ul.depth2>li.has-sub.open:after{ content: '\2013';}
	#main_2022 #allNav .allMenu ul ul.depth2>li>a{ color: #121212; font-size: 1.1rem; font-weight: 400; padding: 15px 0; cursor: pointer;}
	#main_2022 #allNav .allMenu .depth3{ background: #f3f3f3; border: 1px solid #ccc; border-bottom: 0; padding: 5px 0}
	#main_2022 #allNav .allMenu .depth3>li{ border: 0}
	#main_2022 #allNav .allMenu .depth3>li a{ padding: 6px 10px 6px 25px; color: #545454}
	#main_2022 #allNav .allMenu .depth3>li a:before{ background: #121212; top: 18px}
	#main_2022 #allNav .allMenu .depth4{ background: #fff; padding: 0 0 10px; margin: 0 10px}
	#main_2022 #allNav .allMenu .depth4>li>a{ font-size: 0.9rem;}
	#main_2022 #allNav .allMenu .depth4>li>a:before{ content: ''; height: 1px}
	#main_2022 #allNav .allMenu .depth3>li.has-sub>a{ pointer-events: auto;}
	#main_2022 #allNav .allMenu li li a[target='_blank']:after{ background: url(../images/main_2022/icon_2022.png) no-repeat -277px 0;}

	#main_2022 #allNav .mypageSwiper .swiper-scrollbar{ display: none}

	#main_2022 .mainService1{ display: block; height: auto;}
	#main_2022 .bannerZone ul li>a{ text-align: center;}
	#main_2022 .inNongSch{ margin: 1% 1% 0;}
	#main_2022 .nongSch .main_barcode{ position: relative; margin-top: 10px}
	#main_2022 .mainService2 .plsDiv a{ width: 50%;}

	#main_2022 .main_section3>div{ margin: 0 1%;}
	#main_2022 .mainService3{ flex-wrap: wrap;}
	#main_2022 .mainService3 .videoDiv{ flex: inherit; width: 49%; margin-right: 1%;}
	#main_2022 .mainService3 .videoDiv+.videoDiv{ width: 50%; margin-right: 0;}

	#main_2022 #footer:after{ width: 0; height: 0}
	#main_2022 #footer>.inner{ height: auto; padding: 0}
	#main_2022 #footer>.inner:before{ width: 100%}
	#main_2022 #footer>.inner>div{ width: 100%}
	#main_2022 #footer .copyright{ padding: 0; margin-bottom: 20px}
	#main_2022 #footer>.inner>div{ padding: 20px 0; text-align: center; height: auto}
	#main_2022 #footer>.inner>div strong{ font-size: inherit;}
	#main_2022 #footer>.inner>div span{ margin-top: 5px}
	#main_2022 .btm_wa{ left: auto; right: 1%}
	#main_2022 .move_top{ right: 1%; bottom: 120px}

	#main_2022 #header #gnbNavi:before{ display: none;}

	#main_2022 .mypageLayer .afterClear:after{ width: 0;}
	#main_2022 .mypageLayer .afterClear>div p:before{ display: inline-block}

	/* 서브반영안함
	#main_2022 #header #gnbNavi:before{ height: 0;}
	#main_2022 #content{ padding: 85px 0.5rem 10px; box-sizing: border-box;}
	#main_2022 #content>.innerCont{ width: 100%}
	#main_2022 .locArea{ margin-top: 85px;}
	#main_2022 .locArea .inner{ padding: 0 1rem; box-sizing: border-box;}
	*/
}

@media all and (max-width:900px){
	#main_2022 .mainService2{ height: auto; flex-wrap: wrap;}
	#main_2022 .mainService2 .tablsNotiA, #main_2022 .mainService2 .plsDiv{ width: 100%; margin: 0;}
	#main_2022 .mainService2 .tablsNotiA{ margin-bottom: 1em}
	#main_2022 .mainService2 .tablsNotiA>div>div ul li a{ width: 60%;}
	#main_2022 .mainService2 .plsDiv{ min-height: 200px; background-size: cover; background-position: 50% 50%;}
	#main_2022 .mainService2 .plsDiv h2{ display: inline-block; background: rgba(255,255,255,.8); line-height: 1;; margin-top: 1em; padding: 8px 20px;}
	#main_2022 .mainService2 .plsDiv a{ width: auto}
}
/* 2022 Renewal end */

/* Mobile */
@media all and (max-width:768px){
#container.pes #content{ padding: 211px 0 0;}
#container.pes #content .innerCont{ margin: 0}
#container.pes #content .innerCont .pesMn, #container.pes #content .innerCont .pesM_rgt{ width: 100%; height: auto}
#container.pes #content .pesBanner a img{ width: auto; height: 100%}
#container.pes #content .innerCont .pesMn ul li>div .detailView{ position: relative; height: auto; margin-top: 10px}
#container.pes #content .innerCont .pesMn ul li>div .detailView .realDetail .btnTabs{ text-align: center}
#container.pes #content .innerCont .pesMn ul li>div .detailView .btnTabs button[type='button']{ margin: 0 5px 5px 0}
#container.pes #content .guideCall{ margin: 0 0 10px}
#container.pes #content .innerCont .pesMn ul li>div .detailView .gridScroll table{ width: 1000px;}
#container.main2020 .main_tp ul li{ background-size: contain !important;}
#container.main2020 .main_tp ul li p{ font-size: 1.3em}
#container.main2020 .main_tp ul li p img{ width: 280px}
#container.main2020 .main_tp ul li.slide1, #container.main2020 .main_tp ul li.slide2{ background-position: 50% 70px}
#container.main2020 .main_tp .bx-prev, #container.main2020 .main_tp .bx-next{ width: 65px; height: 65px}
#container.main2020 .main_tp .bx-prev:before, #container.main2020 .main_tp .bx-next:before{ margin-top: 15px}
#container.main2020 .main_mid h2 span{ display: none}
#container.main2020 .main_mid .midTotalSch{ padding: 10px 0; height: auto}
#container.main2020 .main_mid .midTotalSch h2{ padding: 0; display: block}
#container.main2020 .main_mid .midTotalSch input[type='text']{ width: 70%}
#container.main2020 .main_mid .midTotalSch button{ padding: 0 20px 0 15px; border-radius: 0 50px 50px 0}
#container.main2020 .main_mid .favoBox{ height: auto}
#container.main2020 .main_mid .favoBox h2{ padding: 0}
#container.main2020 .main_mid .pesSchBox{ height: auto}
#container.main2020 .main_mid .pesSchBox .inPesSch .schBox, #container.main2020 .main_mid .pesSchBox .inPesSch .btnSch{ width: 100%}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch{ padding: 15px; position: relative}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch h2{ padding: 0 80px 0 0; text-align: center}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch span{ display: inline-block; margin: 0 10px 0 0}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSchView{ position: absolute; right: 10px; top: 10px; width: auto; height: calc(100% - 20px); border-radius: 10px; padding: 0 15px;}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSchView:before{ display: none}
#container.main2020 .main_btm .btmCounter>ul{ width: 1000px; padding: 0 0 10px;}
#container.main2020 .main_btm .btmCounter>ul li span:before{ content: ''; margin: 0}
#container.main2020 .main_btm .btmCounter>ul li a{ line-height: 1.3;}
#container.main2020 .main_btm .btmCounter>ul li a strong{ font-size: 1.3em;}
#container.main2020 .main_btm .btmNotiA .tablsNoti, #container.main2020 .main_btm .btmNotiA .popNoti{ width: 100%}
#container.main2020 .main_btm .btmNotiA .popNoti{ margin-top: 15px}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li:nth-child(even) a{ margin-right: 0}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont .more{ right: 0}

.searchBox ul li label.dotL{ display: block; width: 100%;}
.searchBox.searchBoxR{ padding-bottom: 0}
.searchBox.searchBoxR .btnArea{ position: static; width: 100%}
.searchBox.searchBoxR .btnArea .button{ margin: 15px 0 0; display: block; width: 100%; height: auto !important}

.sectionCont_tp.boxS1 p, .sectionCont_tp{ padding: 10px}
.defineDiv .defList.rndList>li dd{ margin: 0 10px 10px; padding: 10px;}
.loginArea .button{ margin: 0 0 15px}
.loginArea .usrFind a{ display: block; margin: 0 0 5px; text-align: center; border: 1px solid #ccc}
.loginArea .usrFind .button{ position:static; border: 0}
.memberWrap .memberChk{ overflow: auto; display: table; width: 100%}
.memberWrap .memberChk label{ display: table-cell; float: none}
.memberWrap .memProcess li span:before{ display: block; margin: 0 auto 5px;}
.agreeC.agreeCAll input{ left: 5%}
.certiBox{ padding: 120px 0 0; text-align: center}
.certiBox i{ left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: 10px}
.certiBox .button{ position: static; width: 100%; margin: 20px 0 0;}
.lineBox.referBox{ padding: 15px}
.defineDiv .defList li.active dd>ul{ margin: 20px 0 40px;}
#content>.innerCont h2 span{ display: block; margin: 0; padding: 5px 0 0; line-height: 1.5;}
.orderList.w3 li, .orderList.w3 li:nth-child(2), .orderList.w5 li, .orderList.w5 li:last-child{ width: 100%; margin: 5px 0 0}
.grnLineBox .tp, .grnLineBox>span{ display: inline-block; margin: 0 5px}
.mypageTp{ background: #fff; padding: 20px 0 0}
.mypageTp p{ font-size: 0}
.mypageTp p strong{ display: block; text-align: center; line-height: 1.5; font-size: 22px}
.mypageTp p strong:before{ display: block; margin: 0 auto}
.mypageTp .button{ position: static; margin: 10px 0 0; width: 100%; text-align: center;}
.mypageTp .myNoti{ margin-top: 1px}
.mypageTp .myNoti a{ padding: 0 85px 0 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.tabStyle1>div>button{ position: static; width: 100% !important; border: 1px solid #aaa; margin: 0 0 3px; text-align: left; padding: 5px;}
.tabStyle1>div.active>button{ text-align: center}
.tabStyle1>div>button:before{ display: inline-block; vertical-align: middle; margin-right: 5px}
.tabStyle1>div>div{ padding: 0}
.tabStyle1 .tabsCont>.button{ position: static; width: 100%; margin: 10px 0 0;}
.boxLayer{ padding: 10px}
.boxLayer ul li.returnD{ position: static; background: #fff; float: none;}
.boxLayer ul li.w50{ width: 100%}
.boxLayer .btnA{ text-align: left}
.boxLayer .btnA p{ position: static; padding: 8px 0 10px; line-height: 1.4}
.boxLayer ul li>strong, .boxLayer ul li>label{ width: 130px; margin: 0}
.boxLayer ul li.returnD>strong:before{ content: ''; display: block; clear: both; position: absolute; left: 15px; top: 40%; width: 6px; height: 6px; background: #3086c9;}
.recomProcess>li ul li label{ width: 130px}
.recomProcess>li .referBox.ico{ padding: 10px}
.dlList dt, .dlList.dtW20 dt{ width: auto; line-height: 1.2; word-break: keep-all;}
.dlList dd img{ max-width: 100%;}
.schWrap.schWrap2 .schMenu>li{  margin: 0 3px 3px; display: inline-block; width: auto;}
.schWrap.schWrap2 .schMenu>li:first-child, .schWrap.schWrap2 .schMenu>li:last-child{ width: auto;}
.schWrap .schMenu>li, .schWrap .schMenu>li a{ display: block; margin: 0}
.schWrap .schMenu>li a{ border-left: 1px solid #c5c5c5; height: auto; padding: 10px 15px}
.sectionCont_tp i.ic7, .sectionCont_tp.boxS1 p br, .sectionCont_tp i, .loginArea .usrFind a:first-child:after, .referBox.ico:before, .defineDiv .defList li dt button:after, .memberWrap .memProcess li span:after, .tabStyle1 .tabsCont>p{ display: none}

#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti, #container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti, #container.main2020 .main_btm.main_btm2 .btmPesA .tabsPes, #container.main2020 .main_btm.main_btm2 .btmPesA .pesListA{ width: 100%}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesListA{ margin-top: 10px}

.imgListA>ul, .imgListDtl .imgSrl ul{ text-align: center}
.imgListA>ul>li, .imgListDtl .imgSrl ul>li, .imgListA>ul>li:nth-child(5n){ width: 32%; margin: 0 0 20px}
.imgListDtl .imgDtlBox>li, .imgListDtl .imgSrl ul>li div span{ width: 100%;}
.imgListDtl .imgSrl ul>li div .imgA+.overPic, .seedList>li .thums span+.overPic{ right: auto; left: 0; min-width: 100%; top: 0}

.searchBox.pes_dtlSch label.dotL+.inputData, .searchBox.pes_dtlSch .cropNm .dotL.w90p+.inputData{ width: 95%}

#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-controls{ position: inherit;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-controls a{ position: absolute; top: 40%; z-index: 50;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-controls a.bx-next{ left: auto; right: 0}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-controls a:after{ color: #8c8c8c; font-size: 30px}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a{ text-align: center; background: #f8f8f8;}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a img{ width: 65%; margin: 0 auto}
#container.main2020 .btmPesInfo .pesEduMov ul{ width: 100%; margin: 10px auto}
#container.main2020 .main_btm .btmNotiA .popNoti ul li a img{ height: auto}
#container.main2020 .btmPesInfo .manualArea .manualD ul li{ width: 45%}
#container.main2020 .main_btm.main_btm3{ background-size: cover; padding: 15px 0 0;}
#container.main2020 .main_btm.main_btm3 .btmCounter{ padding-bottom: 15px}

.layerPop.sign>div{  width: 100% !important; top: 78px;}
.layerPop.sign .layerTp, .layerPop.sign .layerCont{ border-radius: 0}

.gridScroll{ position: relative}
/* .gridScroll:before{ content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.5); position: absolute; z-index: 10;}
.gridScroll:after{content: '\27A8\0020\0020 화면을 터치한 후에  좌우로 스크롤하여 확인하세요';display: block;position: absolute;left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);top: 20%;color: #fff;z-index: 20;font-size: 1em;font-weight: 500;background: #000;padding: 10px 20px;border-radius: 10px; width: 80%; text-align: center;}
.gridScroll:hover:before, .gridScroll:hover:after{ display: none} */
}

/* 2022 Renewal start */
@media all and (max-width: 750px){
	#main_2022 .main_section1{ padding-top: 0}
}

@media all and (max-width: 660px){
	#main_2022 .bannerZone, #main_2022 .bannerZone ul li>a{ height: auto;}
	#main_2022 .bannerZone ul li>a img{ max-width: 100%;}
	#main_2022 .mainService3 .manualDiv>div{ height: auto;}
	#main_2022 .mainService3 .manualDiv .manual{ padding: 0;}
	#main_2022 .mainService3 .manualDiv .manual .usrManual{ position: static; width: 100%; margin-bottom: 1em;}
	#main_2022 .mainService3 .manualDiv .manual p{ text-align: center; font-weight: 500;}
	#main_2022 .mainService3 .manualDiv .manual p br{ display: none}
	#main_2022 .mainService3 .manualDiv .manual .afterClear{ padding: 0 20px 10px}
	#main_2022 .mainService3 .manualDiv .manual .afterClear li{ width: 100%; margin-right: 0;}
	#main_2022 .mainService3 .manualDiv .manual ul>li a{ height: auto; padding: 5px 10px; font-weight: 400;}
	#main_2022 .btm_wa{ position: absolute; top: auto; bottom: 5%}
}
/* 2022 Renewal end */

@media all and (max-width:650px){
#container.main2020 .btmPesInfo .pesEduMov, #container.main2020 .btmPesInfo .banPls{ width: 100%}
#container.main2020 .btmPesInfo .banPls{ height: auto}
#container.main2020 .btmPesInfo .banPls h2 span{ height: 0; overflow: hidden; margin: 0}
#container.main2020 .btmPesInfo .banPls>p:before{ display: block; width: 278px; margin: -10px auto 0}
#container.main2020 .btmPesInfo .banPls>p{ padding-top: 0}

#container.main2020 .main_tp ul li.slideProc p strong{ display: block; margin: 0 0 10px;}
#container.main2020 .main_tp ul li.slideProc .processU li i{ width: 90px; height: 90px}
#container.main2020 .main_tp ul li.slideProc .processU li i:before{ margin-top: 10px; transform: scale(.8);}
}

@media all and (max-width:630px){
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a{ text-align: center}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .schComp>a em{ display: block; line-height: 30px; margin: 0;}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a{ width: auto; text-align: left}
}

/* 2022 Renewal start */
@media all and (max-width: 600px){
	#main_2022 .mainSch{ display: none;}
}
/* 2022 Renewal end */

@media all and (max-width:520px){
#container.pes #content{ padding-top: 10px}
#container.pes #content .h1_slogan{ position: static; text-align: center}
#container.pes #content .h1_slogan img{ width: 100%}
#container.pes #content .innerCont .pesMn{ background: #fff}
#container.main2020 .main_tp ul li.slide1, #container.main2020 .main_tp ul li.slide2{ background-position: 50% 130px;}
#container.main2020 .main_tp ul li p{ text-align: center; padding: 20px 0 0 0;}
#container.main2020 .main_tp ul li p img{ margin: 0 auto 15px}
#container.main2020 .main_tp ul li p{ font-size: 1.5em; word-break: keep-all; line-height: 1.2}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch h2{ text-align: left}
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch h2 span{ display: block; word-break: keep-all}
#container.main2020 .main_btm .btmCounter>ul{ width: auto}
#container.main2020 .main_btm .btmCounter>ul li{ padding: 0 10px}
#container.main2020 .main_btm .btmCounter>ul li span, #container.main2020 .main_btm .btmCounter>ul li a{ font-size: 1em}
#container.main2020 .main_btm .btmCounter>ul li a strong{ font-size: 1.12em}
#container.main2020 .main_btm .btmWeekInfo .infoBox a{ display: block; padding: 5px 0 0; width: 100%; line-height: 1.2; font-size: 1.15em;}
#container.main2020 .main_btm .btmWeekInfo .infoBox .more{ padding: 0}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont.active>div{ overflow: inherit; height: auto}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li{ width: 100%; }
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li a{ margin-right: 0; padding: 10px 15px; height: auto}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont ul li a strong{ height: auto; overflow: inherit}

#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont.active h2 button{ font-size: 1em}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont>div{ padding-top: 65px}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a{ margin: 0; border: 0; border-bottom: 1px dashed #ccc; height: auto; padding: 10px 10px 15px}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a strong{ height: auto}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .more{ position: static; font-size: 16px; text-align: center; display: block; width: 100%; background: #333; color: #fff}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont .more:before{ vertical-align: middle; margin-right: 5px}
#container.main2020 .main_btm.main_btm2 .btmPesA .pesSchA .dataDown a{ padding-left: 0; font-size: 1em}

.sch_theme{ background: #fff; padding: 20px 0 0}
.imgListA>ul>li, .imgListDtl .imgSrl ul>li, .imgListA>ul>li:nth-child(5n){ width: 49%;}
.pestCrl.defineDiv.tabs .defList li h2 button{ height: 65px}
.pestCrl.defineDiv.tabs.w3 .defList li .defCont{ padding-top: 75px}

#container.main2020 .main_btm .btmNotiA .popNoti ul li a img{ width: 100%}
#container.main2020 .btmPesInfo .manualArea .manualD ul li{ width: 100%}

#container.main2020 .main_tp ul li.slideProc .processU li i{ width: 60px; height: 60px; background: transparent}
#container.main2020 .main_tp ul li.slideProc .processU li em, #container.main2020 .main_tp ul li.slideProc .processU li strong{ font-size: 1em}

#container.main2020 .main_tp .bx-prev, #container.main2020 .main_tp .bx-next{ opacity: .7}
#container.main2020 .main_mid .midTotalSch{ padding: 10px 0 0}
#container.main2020 .main_mid .pop_schWord{ width: 80%}
#container.main2020 .main_mid .pop_schWord>span{ font-size: 1em; width: auto; margin: 0 10px 0 0;}
#container.main2020 .main_mid .favoBox .swiper-container{ height: auto; padding: 0 45px 10px;}
#container.main2020 .main_mid .favoBox ul li a, #container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a strong, #container.main2020 .btmPesInfo .manualArea .manualD ul li a{ font-size: 1em}
#container.main2020 .main_mid .favoBox h2, #container.main2020 .main_mid .pesSchBox h2, #container.main2020 .main_mid .pesSchBox .inPesSch .schBox h2{ font-size: 1.2em; text-align: center}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont h2 button, #container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont.active h2 button{ font-size: 0.875em; text-indent: 0; text-align: center;}
#container.main2020 .btmPesInfo .banPls{ padding-bottom: 10px}
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li i{ width: 100px; height: 100px}
}

/* 2022 Renewal start */
@media all and (max-width: 520px){
	#main_2022 .mainBannerZone .mainLink{ height: auto;}
	#main_2022 .mainBannerZone .mainLink>a{ line-height: 1.5; padding-bottom: 10px;}
	#main_2022 .mainBannerZone .mainLink>a i{ display: block; margin: 10px auto 0;}
}

@media all and (max-width: 430px){

	#main_2022 .main_section1{ padding-bottom: 10px}
	#main_2022 .mainBannerZone .mainLink>a{ font-size: 1.15rem;}
	#main_2022 .inNongSch>div>button{ border-radius: 0;}
	#main_2022 .inNongSch>div.active>button{ font-size: inherit;}
	#main_2022 .inNongSch>div.active>button:before{ display: block; margin: 0 auto}
	#main_2022 .formDiv .inputData, #main_2022 .inNongSch>div>div button{ border-radius: 0;}
	#main_2022 .mainService2 .tablsNotiA h2{ width: 33.33%}
	#main_2022 .mainService2 .tablsNotiA>div>div{ padding-top: 50px}
	#main_2022 .mainService2 .tablsNotiA>div>div ul{ border-radius: 0;}
	#main_2022 .mainService2 .tablsNotiA .notice h2{ left: 33.33%}
	#main_2022 .mainService2 .tablsNotiA .data h2{ left: auto; right: 0;}
	#main_2022 .mainService2 .tablsNotiA h2 button{ border-radius: 0;}
	#main_2022 .mainService2 .tablsNotiA>div>div>button{ position: static; border-radius: 0; width: 100%; font-size: 1rem; color: #fff; height: auto; padding: 5px 0;}
	#main_2022 .mainService2 .tablsNotiA>div>div>button:before{ content: ''}
	#main_2022 .nongSch .main_barcode{ font-size: 1rem; letter-spacing: -0.055em;}
	#main_2022 .nongSch .main_barcode strong{ font-size: inherit;}
	#main_2022 .main_section3{ padding-bottom: 10px}
	#main_2022 .mainService3 .videoDiv, #main_2022 .mainService3 .videoDiv+.videoDiv{ width: 100%; margin: 0}
	#main_2022 .main_section4{ padding: 15px 10px}
	#main_2022 #footer>.inner:before{ margin: 10px 0;}
	#footer>.inner, #main_2022 #footer>.inner>div{ text-align: left}
	#main_2022 .footMn{ padding: 0}
	#main_2022 .footMn ul{ text-align: left; padding: 10px 10px 0; box-sizing: border-box;}
	#main_2022 .footMn li:first-child:before{ width: 6px}
	#main_2022 #footer .copyright{ padding-left: 20px}
	#main_2022 #footer>.inner>div{ padding: 10px 85px 10px 10px}
	#main_2022 #footer>.inner>div span{ text-align: left;}
	#main_2022 .move_top.on{ right: 0}
}

@media all and (max-width: 368px){
	#main_2022 #allNav .allMenu>ul>li>a{ width: 130px;}
	#main_2022 #allNav .allMenu ul ul.depth2{ width: calc(100% - 130px); left: 130px; padding: 10px 10px 0;}
	#main_2022 #allNav .allMenu>ul:after{ width: 130px}
	#main_2022 .nongSch .main_barcode strong{ margin: 0; position: relative; display: block; top: -15px;}
}
/* 2022 Renewal end */

@media all and (max-width:400px){
#header .tpLogo{ background-size: 220px auto; margin: 15px 0 0 10px;}
#container.main2020 .main_tp ul li.slide1, #container.main2020 .main_tp ul li.slide2{ background-position: 50% 150px;}
#container.main2020 .main_btm .btmLnkA{ text-align: center}
#container.main2020 .main_btm .btmLnkA .icLnk, #container.main2020 .main_btm .btmLnkA a{ width: 45%; display: inline-block; padding: 0 0.5em;}
#container.main2020 .main_btm .btmLnkA a i{ transform: scale(.9);}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont h2{ width: 130px}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont+.tablsNotiCont h2{ left: 130px}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont .more{ top: 0; border: 0}

.imgListA>ul>li, .imgListDtl .imgSrl ul>li, .imgListA>ul>li:nth-child(5n){ width: 99%}

#container.main2020 .main_mid .pop_schWord{ width: 90%}
#container.main2020 .main_mid .midTotalSch input[type='text'], #container.main2020 .main_mid .midTotalSch button{ height: 40px}
#container.main2020 .btmPesInfo>div{ height: auto}
#container.main2020 .btmPesInfo .manualArea h2{ height: 45px; line-height: 45px;}
#container.main2020 .btmPesInfo .manualArea .manualMov{ width: 120px; height: auto; top: 55px;}
#container.main2020 .btmPesInfo .manualArea .manualD{ margin: 0 0 0 110px;}
#container.main2020 .btmPesInfo .manualArea .manualD ul li a{ margin: 0}
}

/* 2020 11 04 감리에 의한 명도대비 수정
#container.main2020 .main_mid .pesSchBox .inPesSch .btnSch h2, #container.main2020 .main_mid .pesSchBox .inPesSch.inPesSch2 h2, .defineDiv.tabs.w3 .defCont>.btnArea .button:hover,  .button.gradient:hover, .guideSvc li:nth-child(4) span, .guideSvc li:nth-child(5) span, #footer>.inner>div, #footer address, #footer .copyright{ color: #fff}
#container.main2020 .main_mid .pesSchBox .inPesSch.inPesSch2 .btnSch h2, #container.main2020 .main_mid .midTotalSch button, #container.main2020 .main_btm .btmLnkA a em, .button.colorblue, .button.colorJade, .paging span.on a, .button.colorRed, .hideMnA>button, .hideMnA>a, .guideSvc li span, .defineDiv.tabs .defList li.active h2 button, .defineDiv.tabs.w3 .sectionCont_tp h2, .defineDiv.tabs.w3 .sectionCont_tp p, .defineDiv.tabs.w3 .defCont>.btnArea .button, .button.gradient, #container.pes #content .innerCont .pesMn ul li>div>.button, .guideSvc li:nth-child(1) span, .guideSvc li:nth-child(2) span, .guideSvc li:nth-child(3) span, .guideSvc.greenP li span, .guideSvc.greenP.blu li span, .guideSvc.greenP.dark li span, .agreeC.agreeCAll input:checked+label, .lftArea>ul>li.has-sub.open>a, .lftArea>ul>li.active>a, .locArea .inner>a, .locArea .inner>strong, #container.main2020 .main_mid h2, #container.main2020 .main_tp .bx-prev, #container.main2020 .main_tp .bx-next, #container.main2020 .main_mid .pesSchBox .inPesSch .btnSchView, #container.main2020 .main_mid .pesSchBox .inPesSch.inPesSch2 .schBox .button, #container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont h2 button, .dlList dt{ color: #000}*/

/* 2020 12 14 */
.gridInLayer { border-bottom: 1px solid #d3d3d3}
.gridInLayer .default_table thead th.bordL,  .default_table thead th.bordL{ border-left: 1px solid #23507b}
.gridInLayer .default_table tbody td.bordL, .default_table tbody td.bordL{ border-left: 1px solid #d3d3d3}
#container.pes #content .innerCont .pesMn ul li:nth-child(3)>div .detailView .detail_tp i{ background-position: -98px 0}
#container.pes #content .innerCont .pesMn ul li>div .detailView .certi_printA{ padding: 0 10px}
#container.pes #content .innerCont .pesMn ul li>div .detailView .certi_printA .txtHead em{ color: #323232}
#container.pes #content .innerCont .pesMn ul li>div .detailView .loginArea{ width: 60%; margin: 10px auto 0; min-height: auto;}
#container.pes #content .innerCont .pesMn ul li>div .detailView .loginArea dl dd .inputData{ margin: 0 0 5px}
.schLayerBox .imgListDtl .imgSrl ul>li div span{ width: 100%}
.fileN .button.preview{ padding: 0 8px 0 15px;}
.defineDiv.tabs.w3 .defCont .grayBox{ word-break: break-all;}
#content.nonLftArea .schLayerBox{ width: 100%;}

@media (max-width: 768px){
#container.pes #content .innerCont .pesMn ul li>div .detailView{ position: absolute;}
#container.pes #content .pesBanner{height: auto}
#container.pes #content .pesBanner a img{ width: 100%; height: auto}
#container.pes #content .guideCall{ height: auto}
#container.pes #content .guideCall span{ display: block; width: 100%; margin: 0; text-align: center;}
#container.pes #content .guideCall span br{ display: none}
#container.pes #content .innerCont .pesMn ul li>div .detailView .loginArea{ width: 90%}
.detailSchBox>ul li .inBlock{ width: 100%}
.schWrap.schWrap2 .schMenu>li:first-child, .schWrap.schWrap2 .schMenu>li:last-child{ width: 50%}
.schWrap.schWrap2 .schMenu>li{ float: left; width: 50%; margin: 0 -1px -1px 0;}
.schWrap .schMenu>li a{ padding: 3px; line-height: 1.2;}
#content>.innerCont .schResult_cont .schContent h2 span{ display: inline-block; margin-left: 10px}
.schResult_cont .schContent .sch_list>li dd.inList a>span{ width: 98%}
.schResult_cont .schContent .sch_list>li dd.inList a>span .dd_tt, .schResult_cont .schContent .sch_list>li dd.inList a>span .dd_tt{ width: 40% !important}
.worksProcess dd>ol.t li span{ width: 110px}
.guideSvc li{ padding-right: 10px}
.guideSvc li:after{ right: -3px; top: 50px}
.guideSvc li span{ width: 110px; height: 110px; font-size: 1em; margin: 0 auto;}
.guideSvc li span:before{ width: 100px; height: 100px; left: 5px; top: 5px}
.guideSvc li span i{ margin: 0 auto}
.guideSvc.greenP li{ width: 40%}
.guideSvc.greenP li span i{ transform: scale(.8); margin: 10px auto -5px;}
.guideSvc.greenP li strong{ font-size: 1em}

#content.nonLftArea>.innerCont{ padding-left: .5em}
.defineDiv.tabs.w3 .defCont>.btnArea .button, .button.gradient{ padding: 0 50px 0 10px;}
}

@media (max-width: 500px){
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li i:before{ top: 15px}
#container.main2020 .btmPesInfo .pesEduMov ul li a i{ width: 80px; height: 80px;}
.searchBox ul>li.w25, .searchBox ul>li.w45, .searchBox ul>li.w50{ width: 100%}
}

/* 2020 12 16 */
#popLayer.manual_pop>div>div h1{ text-align: center; font-size: 2em; font-weight: 600; line-height: 75px; margin: 0}
#popLayer.manual_pop>div>div{ background: #23507b; padding: 0 0 5px;}
#popLayer.manual_pop>div>a:before{ font-size: 40px;}
#popLayer.manual_pop .popCont{ padding: 20px; width: auto; position: relative; background: #fff}
#popLayer.manual_pop .popCont .deco{ position: absolute; left: 20px; top: 10px; width: 180px; height: 180px;}
#popLayer.manual_pop .popCont .deco>span{ display: block; width: 170px; height: 200px; background: url(../images/pop/manualDeco.png) no-repeat 0 0 / 100% auto;}
/* #popLayer.manual_pop .popCont .deco>span:after{ content: ''; display: block; position: absolute; background: url(../images/pop/control.png) no-repeat 0 0; width: 67px; height: 67px; bottom: 10px; right: -20px} */
#popLayer.manual_pop .manualTabs{ margin: 0 0 0 190px; min-height: 180px}
#popLayer.manual_pop .manualTabs div button{ font-size: 18px; color: #686868; letter-spacing: -0.085em; display: block; background: none; padding: 8px 0; font-weight: 400}
#popLayer.manual_pop .manualTabs div button:before{ content: ''; display: inline-block; background: url(../images/pop/control.png) no-repeat -72px 0; width: 31px; height: 31px; vertical-align: middle; margin-right: 10px}
#popLayer.manual_pop .manualTabs>div.active button{ border-color: #1c74a8; font-size: 20px; color: #266cad; font-weight: 600}
#popLayer.manual_pop .manualTabs>div.active button:before{ background-position: -109px 0}
#popLayer.manual_pop .manualTabs div:last-child button{ left: calc(50% + 3px)}
#popLayer.manual_pop .manualTabs>div>div{ display: none; background: #dfdfdf; padding: 10px; font-size: 16px; line-height: 1.2; letter-spacing: -0.085em; margin-bottom: 5px; max-height: 150px}
#popLayer.manual_pop .manualTabs>div.active>div{ display: block}
#popLayer.manual_pop .manualTabs>div+div{ border-top: 1px solid #ccc}
#popLayer.manual_pop .playerArea{ margin: 20px 0}
#popLayer.manual_pop .playerArea video{ width: 100%}
#popLayer.manual_pop.edu .popCont{ padding: 0; margin: 0 10px;}
#popLayer.manual_pop.edu .manualTabs{ margin: 0; min-height: auto; position: relative; min-height: 200px; background: #fff; padding: 10px 10px 0;}

#popLayer.manual_pop.edu .manualTabs div button{ position: absolute; top: 0; width: 48%; text-align: left; border-bottom: 1px solid #ccc; height: 50px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(even) button{ left: 50%}
#popLayer.manual_pop.edu .manualTabs div:nth-child(3) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(4) button{ top: 50px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(5) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(6) button{ top: 100px;}
#popLayer.manual_pop.edu .manualTabs div:nth-child(7) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(8) button{ top: 150px; border: 0}
#popLayer.manual_pop.edu .manualTabs>div>div{ padding: 200px 0 10px; background: #fff; margin: 0}
#popLayer.manual_pop.edu .manualTabs>div+div{ border: 0}
#popLayer.manual_pop.edu .manualTabs>div>div p{ padding: 10px; background: #f3f3f3; border-top: 1px solid #ccc}
#popLayer.manual_pop.edu .playerArea{ margin: 0}
#popLayer.manual_pop.edu .manualTabs>div button{ padding-right: 65px; z-index: 10}
#popLayer.manual_pop.edu .manualTabs>div.active button{ font-size: 18px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(1) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(2) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(3) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(4) button{ left: 20px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(5) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(6) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(7) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(8) button{ left: 50%}
#popLayer.manual_pop.edu .manualTabs div:nth-child(1) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(5) button{ top: 0}
#popLayer.manual_pop.edu .manualTabs div:nth-child(2) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(6) button{ top: 50px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(3) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(7) button{ top: 100px; border-bottom: 1px solid #ccc;}
#popLayer.manual_pop.edu .manualTabs div:nth-child(4) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(8) button{ top: 150px; border: 0}
#popLayer.manual_pop.edu .manualTabs div button span{ display: inline-block; position: absolute; right: 0; top: 10px;  font-size: 0; width: 30px; height: 30px; z-index: 20; cursor: pointer}
#popLayer.manual_pop.edu .manualTabs div button span:before{ top: -5px; left: -8px}
#popLayer.manual_pop.edu .manualTabs div button span+span{ right: 35px}

#popLayer.manual_pop.edu .manualTabs div>span{ display: block; position: absolute; right: 3%;  top: 10px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(1)>span, #popLayer.manual_pop.edu .manualTabs div:nth-child(2)>span, #popLayer.manual_pop.edu .manualTabs div:nth-child(3)>span, #popLayer.manual_pop.edu .manualTabs div:nth-child(4)>span{ right: 52%}
#popLayer.manual_pop.edu .manualTabs div>span a{ font-size: 0; width: 35px; height: 30px; z-index: 1000; cursor: pointer; z-index: 10; margin: 0}
#popLayer.manual_pop.edu .manualTabs div>span a:before{ top: -5px; left: -8px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(2)>span, #popLayer.manual_pop.edu .manualTabs div:nth-child(6)>span{ top: 60px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(3)>span, #popLayer.manual_pop.edu .manualTabs div:nth-child(7)>span{ top: 110px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(4)>span, #popLayer.manual_pop.edu .manualTabs div:nth-child(8)>span{ top: 160px}

@media all and (max-width:768px){
#popLayer.manual_pop>div>div{ padding: 0}
#popLayer.manual_pop>div>div h1{ font-size: 25px; text-align: left; line-height: 45px; letter-spacing: -0.085em}
#popLayer.manual_pop .popCont{ padding: 10px}
#popLayer.manual_pop .popCont .deco{ display: none}
#popLayer.manual_pop>div>a:before{ font-size: 20px;}
#popLayer.manual_pop .manualTabs{ margin: 0}
.mainMid .btmBanner a.pis{ width: 100% !important}
#popLayer.manual_pop.edu .manualTabs{ min-height: auto}
#popLayer.manual_pop.edu .manualTabs div button{ width: 100%; position: static}
#popLayer.manual_pop.edu .manualTabs>div>div{ padding: 0}
#popLayer.manual_pop.edu .manualTabs>div>div p, #popLayer.manual_pop.edu .manualTabs div:nth-child(7) button, #popLayer.manual_pop.edu .manualTabs div:nth-child(8) button{ border: 0; border-bottom: 1px solid #ccc;}
#popLayer.manual_pop.edu .manualTabs div:nth-child(4) button{ border-bottom: 1px solid #ccc;}
#popLayer.manual_pop.edu .manualTabs div button:before{ position: absolute; left: 10px}
#popLayer.manual_pop.edu .manualTabs div button{ height: auto}
#popLayer.manual_pop.edu .manualTabs>div button{ padding: 8px 65px 10px 35px; font-size: 16px}
#popLayer.manual_pop.edu .manualTabs>div.active button{ font-size: 16px}
#popLayer.manual_pop.edu .manualTabs div button span:before, #popLayer.manual_pop.edu .manualTabs div span a:before{ display: inline-block !important}
#popLayer.manual_pop.edu .manualTabs div>span{ right: 10px !important; top: auto !important; margin-top: -35px}
}

/* 2020 12 29 */
.detailGrid>ul li>div pre{ font-family:inherit}
.searchBox.pes_dtlSch+.point_box{ background: #f3fcff; border-top: 1px solid #e3eff3;padding: 8px 15px; position: relative; top: -23px; border-radius: 0 0 8px 8px}
.searchBox.pes_dtlSch+.point_box p{ font-size: 0.95em}

/* 2021 01 05 */
.lftArea{ position: relative; display: inline-block;}
#content>.innerCont{ padding: 25px 0 30px 0; float: right; width: calc(100% - 250px - 30px);}
#content.nonLftArea .lftArea>button[type='button'].open{ margin-top: -48px;}
#content.nonLftArea>.innerCont{ width: 100%; margin-top: -25px;}
#content.wide>#totalSch{ width: 100%}
.schResult_cont.schResult_cont2 .schRgt>ul>li>a:after{ content: '\276F';}

@media all and (max-width:1000px){
.lftArea{ display: none}
#content>.innerCont{ padding: 1em 0.5em; width: 100%; box-sizing: border-box}
}

/* 2021 01 07 푸터를 무조건 하단에 위치하게끔 */
#wrap{ display: flex; min-height: 100%; min-height: 100vh; flex-direction: column;}
#container{ flex: 1 auto; flex: 1 0 0; -ms-flex: 1 0 0;}

/* 2021 01 19 문서뷰어 상단 */
.viewer_tp{ background: #3086c9; text-align: center; position: relative;}
.viewer_tp>h1{ text-align: center; font-size: 1.5em; line-height: 50px; font-weight: 400; color: #fff}
.viewer_tp>span{ display: block; background: url(../images/pop/ci.png) no-repeat; width: 124px; height: 40px; background-size: cover; position: absolute; left: 10px; top: 5px; font-size: 0}
.viewer_tp .button{ display: block; position: absolute; right: 10px; top: 7px; background: transparent; border: 1px solid #fff; border-radius: 5px; height: 35px; line-height:35px; color: #fff}
.viewer_tp .button:before{ background-position:  -141px -146px; width: 19px; height: 18px}

@media all and (max-width:768px){
.viewer_tp>span{ display: none}
.viewer_tp>h1{ text-align: left; text-indent: 10px}
}

/* 2020 01 20 */
.grnLineBox.boxLayer.line1 .txt_p13, .grnLineBox.boxLayer.line1 .whiteBox{ display: inline-block; border: 0; background: transparent; margin: 0}
.grnLineBox.boxLayer.line1 .juso{ display: inline-block; position: relative; top: auto; right: auto; margin: 0 10px; padding-left: 20px;}
.grnLineBox.boxLayer.line1 .juso:before{ top: 3px; transform: scale(.85)}
.grnLineBox.boxLayer.line1 .btnList{ top: 3px}

@media all and (max-width:768px){
.grnLineBox.boxLayer.line1{ padding: 0 10px 10px}
.grnLineBox.boxLayer.line1 .whiteBox{ display: block; background: #fff; border-top: 1px solid #bdbdbd}
.grnLineBox.boxLayer.line1 .juso{ margin: 0 15px 0 0; }
}

/* 2021 01 26 */
.searchBox.pes_dtlSch ul{ position: relative; right: -4px}
.searchBox.pes_dtlSch ul li.w25{ margin-right: -4px}
.searchBox.pes_dtlSch ul li.w50{ width: 50%; margin-right: -4px}
.searchBox.pes_dtlSch label.dotL+.inputData{ width: calc(100% - 88px - 15px);}

.searchBox.pes_dtlSch ul li.w50 .inputData{ width: calc(100% - 88px - 17px);}
.searchBox.pes_dtlSch label.dotL input{ position: absolute; right: 3px; top: 8px;}

.dlList dd img{ max-width: 100%}

@media all and (max-width:1000px){
.searchBox.pes_dtlSch ul li{ margin-right: 0}
.searchBox.pes_dtlSch ul li.w25, .searchBox.pes_dtlSch label.dotL+.inputData, .searchBox.pes_dtlSch ul li.w50 .inputData, .searchBox.pes_dtlSch ul li.w50{ width: 49%;  margin-right: 0}
.searchBox ul li label.dotL{ width: 100%}
.searchBox.pes_dtlSch label.dotL+.inputData, .searchBox.pes_dtlSch ul li.w50 .inputData{ width: 100%; margin-right: 0}
}

@media all and (max-width:500px){
.searchBox.pes_dtlSch ul li.w25, .searchBox.pes_dtlSch label.dotL+.inputData, .searchBox.pes_dtlSch ul li.w50 .inputData, .searchBox.pes_dtlSch ul li.w50{ width: 100%}
}

/* 2021 02 02 */
@media all and (min-width:320px) and (max-width:1000px){
.searchBox ul li label.dotL{ padding-left: 10px; width: 100px; display: inline-block}
.searchBox ul li label.dotL:before{ left: 2px}
.searchBox.pes_dtlSch ul li.w25, .searchBox.pes_dtlSch label.dotL+.inputData, .searchBox.pes_dtlSch ul li.w50 .inputData, .searchBox.pes_dtlSch ul li.w50{ width: calc(50% - 4px)}
.searchBox.pes_dtlSch label.dotL+.inputData, .searchBox.pes_dtlSch ul li.w50 .inputData{ width: calc(100% - 104px)}
}

@media all and (min-width:320px) and (max-width:550px){
.searchBox ul li label.dotL{ padding-left: 0}
.searchBox ul li label.dotL:before{ width: 0}
}

@media all and (max-width:500px){
.searchBox ul li label.dotL{ width: 80px; display: inline-block}
.searchBox.pes_dtlSch ul:first-child li, .searchBox.pes_dtlSch ul:nth-child(3) li{ width: 100% !important}
.searchBox.pes_dtlSch label.dotL+.inputData, .searchBox.pes_dtlSch ul li.w50 .inputData{ width: calc(100% - 84px);}
.searchBox.pes_dtlSch ul:first-child li .inputData, .searchBox.pes_dtlSch ul:nth-child(3) li .inputData{ width: calc(100% - 90px);}
}

/* 2021 02 04 */
@media all and (min-width:501px){
.searchBox.pes_dtlSch.pes_dtlSch2 .cropD>li .button{ display: none;}
}

@media all and (max-width:500px){
.searchBox.pes_dtlSch.pes_dtlSch2 .cropD>li{ display: none}
.searchBox.pes_dtlSch.pes_dtlSch2 .cropD>li.crop1, .searchBox.pes_dtlSch.pes_dtlSch2 .cropD>li.disease1{ display: block; width: 100%;  position: relative}
.searchBox.pes_dtlSch.pes_dtlSch2 .cropD>li.crop1 .inputData, .searchBox.pes_dtlSch.pes_dtlSch2 .cropD>li.disease1 .inputData{ width: calc(100% -  90px);}
.searchBox.pes_dtlSch.pes_dtlSch2 .cropD>li .button{ position: absolute; right: 0.3em; top: 0;  padding: 0 12px}
}

/* 2021 02 05 */
@media all and (max-width:500px){
.searchBox.pes_dtlSch3 .cropD>li:nth-child(1), .searchBox.pes_dtlSch3 .cropD>li:nth-child(2), .searchBox.pes_dtlSch3 .cropD>li:nth-child(3), .searchBox.pes_dtlSch3 .cropD>li:nth-child(4){ float: left; clear: both; margin-right: 2px}
}

/* 2021 02 17 */
.searchBox.pes_dtlSch ul{ width: calc(100% - 4px)}
.searchBox.pes_dtlSch ul li.w25{ margin-right: -3px;}
#footer>.inner>div{ padding: 0 80px 0 0; font-size: 1.1rem;}
#footer>.inner>div span{ display: block; position: absolute; bottom: -17px; right: 80px; color: rgba(255,255,255,.6); font-size: 0.85rem; width: 180px}

@media all and (max-width:1000px){
.searchBox.pes_dtlSch ul{ width: 100%; right: 0}
.searchBox.pes_dtlSch ul li.w25{ margin-right: 0}
#footer>.inner>div{ padding: 10px 0 0;}
#footer>.inner>div span{ position: static; text-align: center; width: 100%}
}

@media all and (max-width:500px){
.searchBox.pes_dtlSch ul:first-child li .inputData, .searchBox.pes_dtlSch ul:nth-child(3) li .inputData{ width: calc(100% - 85px);}
.searchBox.pes_dtlSch ul:nth-child(2) li.w25{ width: calc(50% - 2px);}
.searchBox.pes_dtlSch.pes_dtlSch2 .cropD>li .button{ right: 0}
}

/* 2021 03 03 */
#gnb>li:hover>a:after{ width: 100%;}
#container.pes #content .innerCont{ float: none}
.searchBox.pes_dtlSch ul li.inItemC{ position: relative}
.searchBox.pes_dtlSch ul li.inItemC>div{ position: absolute; right: 10px;top: 0}
.searchBox.pes_dtlSch ul li.inItemC>div span{ display: inline-block; position: relative;}
.searchBox.pes_dtlSch ul li.inItemC>div span input[type='checkbox']{ width: 0; height: 0; overflow: hidden}
.searchBox.pes_dtlSch ul li.inItemC>div span label{ display: inline-block; background: #fff; border: 1px solid #0f0f0f; line-height: 27px; border-radius: 3px; padding: 0 8px; font-size: 0.85em; margin: 4px -2px 0 0; box-sizing: border-box; transition: all .2s; -webkit-transition: all .2s;}
.searchBox.pes_dtlSch ul li.inItemC>div span label:hover{ border-color: #3086c9; color: #3086c9}
.searchBox.pes_dtlSch ul li.inItemC>div span input[type='checkbox']:checked+label{ background: #3086c9; border-color: #3086c9; color: #fff}
.searchBox.pes_dtlSch ul li.inItemC>div span input[type='checkbox']:checked+label:before{ content: '\2714'; display: inline-block; margin-right: 3px}

/* 2021 03 31 */
@media (max-width: 768px){
.certiBox:hover:before{ z-index: 1;}
.certiBox:hover .button{ position: relative; top: auto; right: auto; z-index: 10}
}

/* 2021 05 24 */
.txt_tpGuide{ background: #b7deed; text-align: center; color: #000; padding: 20px; font-size: 1.05rem; margin: -1px 0 30px}
.txt_tpGuide:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -282px -125px; width: 19px; height: 23px; position: relative; top: 7px; margin-right: 5px}
.layerPop{ z-index: 999;}
.layerPop.sign>div, .layerPop.sign.sign2>div{ width: 600px}
.layerPop.sign .layerTp{ font-size: 2rem; font-weight: 500; border-radius: 15px 15px 0 0;}
.layerPop.sign .layerCont{ padding-bottom: 100px; border-radius: 0 0 15px 15px}
.layerPop.sign .layerCont p{ font-size: 1.4rem;}
.layerPop.sign .layerCont p:before{ margin-bottom: 30px}
.layerPop.sign .btnClose{ left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: auto; bottom: 30px; background: #d5edff; border-radius: 45px; font-size: 1.2rem; width: auto; font-weight: 500; padding: 0 35px 0 30px;}
.layerPop.sign.sign2 .btnClose{ background: #ffc903; }
.layerPop.sign .btnClose:before{ color: #323232; margin-right: 8px; position: relative; top: -2px}

/* 2021 07 23 웹접근성 웹표준 */
/* 공통 */
.tpRgt .tpSch{ background: #007576}
#footer>.inner>div{ color: #68eff1}
#footer>.inner>div span{ color: rgba(255,255,255,.8);}
.button.colorJade{ color: #053434}
.button.colorJade.icon.search:before{ background-position: -489px 0}
.button.colorblue{ background: #2079bf}
.button.colorGray.icon.blank:before{ background-position: -74px -79px;}
.button.colorJade.icon.nextW:after{ background-position: -12px -45px}
.txt_blue2{ color: #0078D6}
.txt_orange, .txt_red{ color: #C00000;}

.inputData:-ms-input-placeholder{ color: #606060; font-size: inherit; font-weight: 300;  letter-spacing: 0}
.inputData::-webkit-input-placeholder{ color: #606060; font-size: inherit; font-weight: 300;  letter-spacing: 0}
.inputData:-moz-input-placeholder{ color: #606060; font-size: inherit; font-weight: 300;  letter-spacing: 0}
.inputData::-moz-input-placeholder{ color: #606060; font-size: inherit; font-weight: 300;  letter-spacing: 0}

/* 메인 */
.konan-autocomplete-input:-ms-input-placeholder{ color: #606060;}
.konan-autocomplete-input::-webkit-input-placeholder{ color: #606060;}
.konan-autocomplete-input:-moz-input-placeholder{ color: #606060;}
.konan-autocomplete-input::-moz-input-placeholder{ color: #606060;}
#container.main2020 .main_mid .midTotalSch button{ background: #2b4eac}
#container.main2020 .main_tp ul li.slideProc .processU li strong, #container.main2020 .main_btm .btmCounter>ul li a strong{ color: #236191;}
#container.main2020 .main_mid .favoBox h2, #container.main2020 .main_mid .favoBox ul li a{ color: #073435}
#container.main2020 .main_mid .favoBox ul li a i{ border-color: transparent; background: rgba(255,255,255,.5);}
#container.main2020 .main_mid .favoBox ul li a i:before{ background: url(../images/main/ic_mn2020_va.png) no-repeat 0 -60px;}
#container.main2020 .main_mid .pesSchBox h2, #container.main2020 .main_mid .pesSchBox .inPesSch2 .btnSch h2{ color: #07153a; text-align: left}
#container.main2020 .main_mid .pesSchBox .inPesSch2 h2, #container.main2020 .main_mid .pesSchBox .inPesSch1 .btnSch h2{ color: #fff; text-align: left}
#container.main2020 .main_mid .pesSchBox .inPesSch1 .btnSch button{ background: #011e6a}
#container.main2020 .main_mid .pesSchBox .inPesSch2 .btnSch .btnSchView.btnSchView1{ background: #2b4eac}
#container.main2020 .main_btm .btmNotiA .tablsNoti .tablsNotiCont.active h2{ background: #2b4eac; border-color: #2b4eac}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a em{ color: #606060}
#container.main2020 .btmPesInfo .banPls .button{ background: #011e6a}
#container.main2020 .btmPesInfo .pesEduMov{ background: url(../images/main/pesEduMov.jpg) no-repeat 0 100%; background-size: cover;}
#container.main2020 .btmPesInfo .pesEduMov:before{ background: rgba(0,0,0,.5);}
#container.main2020 .btmPesInfo .pesEduMov ul li a i{ background: rgba(0,0,0,.7); background: rgba(255,255,255,.3);}
#container.main2020 .btmPesInfo .pesEduMov ul li a:hover i{ background: rgba(255,255,255,.5);}
#container.main2020 .main_tp ul li.slideProc .processU li strong{ color: #23507b}
#container.main2020 .btmPesInfo .pesEduMov ul li.more a{ font-size: 0; color: transparent;}
#container.main2020 .btmPesInfo .pesEduMov ul li.more a i{ font-size: 15px; color: #fff; line-height: 1}
#container.main2020 .btmPesInfo .pesEduMov ul li.more a i{ background: rgba(0,0,0,.7);}
#container.main2020 .btmPesInfo .pesEduMov ul li.more a:hover i{ background: rgba(0,0,0,1)}
#container.main2020 .main_mid .favoBox .swiper-button-next, #container.main2020 .main_mid .favoBox .swiper-button-prev{ font-size: 0; color: transparent;}

/* 서브 */
.locArea, .lftArea>ul>li.has-sub.open>a, .lftArea>ul>li.active>a{ background: #2079bf}
.lftArea ul ul>li>a:hover, .lftArea ul ul>li>a.active{ color: #23507b}
#content>.innerCont h2.refer:before{ margin: 0}
.defineDiv.tabs .defList li.active h2 button, .defineDiv.tabs.w3 .sectionCont_tp h2, .defineDiv.tabs.w3 .sectionCont_tp p{ color: #073435}
.defineDiv.tabs.w3 .defCont>.btnArea .button, .button.gradient{ background-image: linear-gradient(to right, #004561 0%, #3a8823 65%, #0188bf 100%);}
.searchBox.pes_dtlSch ul li.inItemC>div span input[type='checkbox']:checked+label{ background: #2079bf; border-color: #2079bf}
.sch_theme p strong em{ color: #C00000;}
.memberWrap .memProcess li.active span:before{ background: #C00000}
.pestCrl.defineDiv.tabs .defList li.active h2 button{ background: #00787A; border-color: #00787A;}
.hideMnA>button, .hideMnA>a{ background: #2079bf}
#content>.innerCont h2.refer span{ color: #23507b}
.worksProcess dd>ol.d li dt:before{ background: #0B7576;}
.guideSvc li:nth-child(1) span, .guideSvc li:nth-child(2) span, .guideSvc li:nth-child(3) span{ color: #000}
.guideSvc.greenP li span{ color: #064040;}
.guideSvc.greenP.blu li span{ color: #fff}
.guideSvc.greenP.blu li span:before{ background: #2079BF;}
.guideSvc.greenP.dark li span{ color: #073435;}
.dlList dt{ background: #00787A;}
.dlList.blu dt{ background: #2079bf}
.agreeC.agreeCAll input:checked+label{ background: #2079bf; border: 1px solid #2079bf;}
.bluLineBox>span strong, .grnLineBox>span strong{ color: #C00000;}
#container.pes #content .innerCont .pesMn ul li>div .detailView .detail_tp, #container.pes #content .innerCont .pesMn ul li>div>.button, #container.pes #content .guideCall{ background: #00787A;}
#container.pes #content .innerCont .pesMn>ul li.active>button, #container.pes #content .innerCont .pesMn ul li>div p{ color: #00787A;}
.schWrap.schWrap2 .sch_tpBtn a.active{ font-weight: 500}

/* 팝업 */
#popLayer.manual_pop.edu .manualTabs>div>div p, #popLayer.manual_pop .manualTabs>div>div{ height: 100px; overflow-x: hidden; overflow-y: auto; word-break: normal; word-wrap: normal; white-space: pre; line-height: 25px;}
#popLayer.manual_pop .manualTabs>div>div{ height: 80px}
.lnkJusoC{ background: #fff; font-weight: 500}

/* //2021 07 23 웹접근성 웹표준 */

/* 2021 09 02 판매인교육 */
.eduMain{ margin-top: 90px; background: #e7ebee}
.eduMain>div{ margin: 0 auto}
.eduMain .eduCont1{ background: #e0edfa url(../images/edu/eduCont1.jpg) no-repeat 50% 0; border-bottom: 2px solid #315e87;}
.eduMain .eduCont1>div{ max-width: 1300px;  margin: 0 auto; position: relative; padding: 25px 0 80px;}
.eduMain .eduCont1>div:after{ content: ''; display: block; background: url(../images/edu/icon.png) no-repeat; width: 384px; height: 228px; position: absolute; left: -100px; bottom: 0; z-index: 1}
.eduMain .eduCont1>div>ul{ text-align: center; box-sizing: border-box; padding: 0 50px; display: table; width: 100%; position: relative}
.eduMain .eduCont1>div>ul>li{ display: table-cell; width: 25%; vertical-align: top;}
.eduMain .eduCont1>div>ul li>a, .eduMain .eduCont1>div>ul>li>p{ display: block; margin: 0 10px; width: calc(100% - 20px); border-radius: 10px; height: 280px;  background: #007e80; box-sizing: border-box; position: relative; overflow: hidden}
.eduMain .eduCont1>div>ul li>a:after, .eduMain .eduCont1>div>ul>li>p:after{ content: ''; display: block; background: url(../images/edu/icon.png) no-repeat; width: 87px; position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
.eduMain .eduCont1>div>ul>li>p:after{ content: '\002B'; background: none; width: 35px; height: 35px; border-radius: 35px; border: 2px solid #f6ff5e; color: #f6ff5e; line-height: 35px; font-size: 1.45em; font-weight: 600; bottom: 70px}
.eduMain .eduCont1>div>ul li.eduInfo a:after{ height: 86px; background-position: -386px 0; bottom: 25px}
.eduMain .eduCont1>div>ul li.eduPlan a:after{ height: 83px; background-position: -386px -89px}
.eduMain .eduCont1>div>ul li.eduPrt a:after{ height: 69px; background-position: -386px -174px}
.eduMain .eduCont1>div>ul li.eduCourse a:after{ width: 93px; height: 88px; background-position: -94px -490px}
.eduMain .eduCont1>div>ul li p a{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; font-size: 0; z-index: 2}
.eduMain .eduCont1>div>ul li.eduInfo a, .eduMain .eduCont1>div>ul li.eduCourse a{ background: #3b77a5;}
.eduMain .eduCont1>div>ul li.eduPlan a, .eduMain .eduCont1>div>ul li.eduInfo a{ background: #406d88}
.eduMain .eduCont1>div>ul li.eduPrt a{ background: #2fc5a4}
.eduMain .eduCont1>div>ul li strong, .eduMain .eduCont1>div ul li span{ display: block; color: #fff; font-size: 0.95em; font-weight: 300; line-height: 1.4}
.eduMain .eduCont1>div>ul li strong{ font-size: 1.65em; font-weight: 500; padding: 30px 0 25px}
.eduMain .eduCont1>div>ul li.eduPrt strong, .eduMain .eduCont1>div>ul li.eduPrt span{ color: #000}
.eduMain .eduCont1>div>ul li>div{ display: none; position: absolute; left: 50px; top: 0; width: calc(100% - 100px); border-radius: 10px; background: #fff; z-index: 2; box-sizing: border-box; padding: 15px 70px 10px 50px}
.eduMain .eduCont1>div>ul li>div:after{ content: ''; display: block; position: absolute; right: 30px; bottom: 20px; background: url(../images/edu/icon.png) no-repeat; z-index:-1;}
.eduMain .eduCont1>div>ul li.eduInfo>div:after{ background-position: 0 -236px; width: 136px; height: 146px;}
.eduMain .eduCont1>div>ul li>div>button{ left: auto; right: -20px; top: 0}
.eduMain .eduCont1>div>ul li>div>button:before{ color: #000; font-size: 20px;}
.eduMain .eduCont1>div>ul li.eduInfo>div{ border: 3px solid #3b77a5; text-align: left}
.eduMain .eduCont1>div>ul li.eduInfo>div>p{ font-size: 1.09em; color: #315e87; font-weight: 500; word-break: keep-all; line-height: 1.2; margin-bottom: 15px}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li{ position: relative; padding-left: 80px; margin-bottom: 5px}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li strong{ display: block; position: absolute; left: 0; top: 0; font-size: 1.085em; padding: 0; color: #323232}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li.ic{ display: inline-block; padding-left: 145px; margin: 10px 0 0}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li.ic i{ display: block; width: 60px; height: 60px; border-radius: 50%; background: #3b77a5; position: absolute; left: 80px; top: 0; text-align: center}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li.ic i:before{ content: ''; display: inline-block; background: url(../images/edu/icon.png) no-repeat -293px -235px; width: 35px; height: 29px; margin-top: 15px}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li:nth-child(4).ic i:before{ background-position: -293px -268px; height: 34px; margin-top: 12px}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li:nth-child(5).ic i:before{ background-position: -293px -308px; height: 34px;}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li.ic strong{ position: static; padding: 5px 0 0}
.eduMain .eduCont1>div>ul li.eduInfo>div .btnArea{ margin-bottom: 0}
.eduMain .eduCont1>div>ul li.eduInfo>div .btnArea a{ background-image: linear-gradient(to right, #004561 0%, #3a8823 65%, #0188bf 100%); background-size: 200% auto;}
.eduMain .eduCont1>div>ul li.eduPrt>div{ border: 3px solid #2fc5a4; min-height: 100%}
.eduMain .eduCont1>div>ul li.eduPrt>div:after{ background-position: -140px -236px; width: 149px; height: 118px;}
.eduMain .eduCont1>div>ul li.eduPrt>div .txtHead, .eduMain .eduCont1>div>ul li.eduPrt>div .txtHead strong{ margin-top: 0; padding: 0}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea{ min-height: auto; margin: 25px auto 0; position: relative; width: 690px;  z-index: 1}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea dl{ width: 400px}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea dl dt{ float: left; position: static; width: 130px; height: 45px; line-height: 45px; text-align: right; margin-right: 20px;}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea dl dt label{ font-weight: 500}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea dl dd .inputData{ height: 45px; margin-bottom: 4px; width: 250px; background: #bde9e9; border: 0}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea .button{ position: absolute; right: 145px; top: 0; width: 140px; height: 144px; margin: 0; text-align: center; padding: 0}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea .button+.button{ right: 0}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea .button:before{ content: ''; display: block; background: url(../images/edu/icon.png) no-repeat -332px -235px; width: 28px; height: 30px; margin: 0 auto -15px}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea .button+.button:before{ background-position: -367px -305px}
.eduMain .eduCont2{ background: #315e87; position: relative; z-index: 1}
.eduMain .eduCont2:before{ content: ''; display: block; width: 50%; min-height: 100%; background: #25b5b7; position: absolute; top: 0; left: 0; z-index: -1}
.eduMain .eduCont2>div{ width: 100%; max-width:1300px; margin: 0 auto; display: table;}
.eduMain .eduCont2>div>div{ display: table-cell; width: 50%; position: relative; box-sizing: border-box; padding: 0 100px 0 135px; height: 90px}
.eduMain .eduCont2>div>div h2{ position: absolute; left: 0; top: 0; line-height: 90px; font-size: 1.4em; font-weight: 500; color: #000}
.eduMain .eduCont2>div>div>a{ display: block; position: absolute; left: 85px; top: 0; font-size: 0}
.eduMain .eduCont2>div>div>a:before{ content: '\002B'; display: inline-block; font-size: 25px; line-height: 90px; padding: 0 5px}
.eduMain .eduCont2>div>div .bx-controls{ display: table-cell; position: absolute; right: 10px; top: 30px; z-index: 1;}
.eduMain .eduCont2>div>div .bx-controls a{ display: inline-block; width: 27px; height: 25px; line-height: 23px; box-sizing: border-box; font-size: 0; text-align: center; margin: 0 1px; background: #dbe7dd}
.eduMain .eduCont2>div>div .bx-controls a:after{ content: '\276E'; display: inline-block; font-size: 15px; color: #000;}
.eduMain .eduCont2>div>div .bx-controls a.bx-next:after{ content: '\276F';}
.eduMain .eduCont2>div>div ul li a{ display: block; line-height: 90px; height: 90px; overflow: hidden}
.eduMain .eduCont2>div>div ul li a span{ display: inline-block; margin-left: 10px}
.eduMain .eduCont2>div>div.eduQna{ padding-left: 185px}
.eduMain .eduCont2>div>div.eduQna h2{ left: 15px; color: #fff}
.eduMain .eduCont2>div>div.eduQna>a{ left: 140px}
.eduMain .eduCont2>div>div.eduQna>a, .eduMain .eduCont2>div>div.eduQna  ul li a{ color: #fff}
.eduMain .eduCont3{ background: #fff;}
.eduMain .eduCont3>div{ width: 100%; max-width:1300px; margin: 0 auto; padding: 35px 0 30px 0; position: relative}
.eduMain .eduCont3>div h2{ font-size: 1.4em; font-weight: 500; color: #000; text-align: center; margin-bottom: 15px}
.eduMain .eduCont3>div>a{ display: block; position: absolute; left: calc(50% + 80px); top: 30px; font-size: 0}
.eduMain .eduCont3>div>a:before{ content: '\002B'; display: inline-block; font-size: 25px; padding: 0 5px}
.eduMain .eduCont3 .eduSchedule{ text-align: center; margin-bottom: 20px; vertical-align: top}
.eduMain .eduCont3 .eduSchedule ul{ display: inline-block; text-align: center;}
.eduMain .eduCont3 .eduSchedule ul li{ display: inline-block; line-height: 55px}
.eduMain .eduCont3 .eduSchedule ul li button{ display: inline-block; width: 75px; height: 55px; background: #c0c8d1;}
.eduMain .eduCont3 .eduSchedule ul li.active button{ color: #fff; background: #315e87; font-weight: 500}
.eduMain .eduCont3 .eduSchedule>span{ display: inline-block; font-size: 1.15em}
.eduMain .eduCont3 .eduSchedule>span button{ display: inline-block; font-size: 0; background: #fff}
.eduMain .eduCont3 .eduSchedule>span button:after{ content: ''; display: inline-block; margin: 0 20px;  background: url(../images/edu/icon.png) no-repeat -332px -267px; width: 19px; height: 35px}
.eduMain .eduCont3 .eduSchedule>span.next button:after{ background-position: -332px -305px}
.eduMain .eduCont3>div>ul li{ float: left; width: 25%; position: relative;}
.eduMain .eduCont3>div>ul li a{ display: block; margin-right: 5px; background: #fff; border: 1px solid #c0c8d1; border-top: 2px solid #315e87; padding: 15px; color: #686868}
.eduMain .eduCont3>div>ul li:last-child a{ margin: 0}
.eduMain .eduCont3>div>ul li a strong{ display: block; height: 40px; overflow: hidden; font-size: 1.18em; color: #323232; font-weight: 400}
.eduMain .eduCont3>div>ul li a span{ color: #3086c9; font-weight: 500; font-size: 0.9em}
.eduMain .eduCont3>div>ul li a em{ display: block; position: absolute; right: 5px; top: 0; background: #315e87; color: #fff; font-size: 0.8em;  font-weight: 300; line-height: 30px; padding: 0 5px}
.eduMain .eduCont3>div>ul li.end a em{ background: #d13434}
.eduMain .eduCont3>div>ul li:last-child a em{ right: 0}
.eduMain .eduCont4{ width: 100%; max-width: 1300px; padding: 20px 0; display: table}
.eduMain .eduCont4>div{ display: table-cell; width: 50%; vertical-align: top;}
.eduMain .eduCont4 .eduPop{ position: relative}
.eduMain .eduCont4 .eduPop h2{ background: #315e87; color: #fff; font-size: 1.4em; font-weight: 400; line-height: 45px; text-indent: 10px}
.eduMain .eduCont4 .eduPop .bx-controls{ display: table-cell; position: absolute; right: 10px; top: 8px; z-index: 1;}
.eduMain .eduCont4 .eduPop .bx-controls a{ display: inline-block; width: 27px; height: 27px; line-height: 25px; box-sizing: border-box; font-size: 0; text-align: center; margin: 0 1px; background: #fff}
.eduMain .eduCont4 .eduPop .bx-controls a:after{ content: '\276E'; display: inline-block; font-size: 15px; color: #000;}
.eduMain .eduCont4 .eduPop .bx-controls a.bx-next:after{ content: '\276F';}
.eduMain .eduCont4 .eduPop ul li a{ display: block; height: 175px}
.eduMain .eduCont4 .eduPop ul li a img{ width: 100%; max-width: 100%}
.eduMain .eduCont4 .eduLnk ul{ display: table; width: 100%;}
.eduMain .eduCont4 .eduLnk ul li{ display: table-cell; width: 33.3333%}
.eduMain .eduCont4 .eduLnk ul li a{ display: block; margin: 0 0 0 10px; background: #fff; height: 220px; text-align: center; font-size: 1.15em; font-weight: 400; box-sizing: border-box; padding-top: 35px; line-height: 1.2}
.eduMain .eduCont4 .eduLnk ul li a:before{ content: ''; display: block; margin: 0 auto 20px; width: 85px; height: 85px; background: url(../images/edu/icon.png) no-repeat}
.eduMain .eduCont4 .eduLnk ul li.m1 a:before{ background-position: 0 -385px}
.eduMain .eduCont4 .eduLnk ul li.m2 a:before{ background-position: -88px -385px}
.eduMain .eduCont4 .eduLnk ul li.m3 a:before{ background-position: -176px -385px}
.eduMain .eduCont4 .eduLnk ul li.m4 a:before{ background-position: -194px -490px}
.tblInM.button{ padding: 0 8px; height: 45px; line-height: 45px; border-radius: 5px}
.tblInM.button.icon{ padding: 0 10px 0 15px}
.button.icon.list:before{ background: url(../images/edu/icon.png) no-repeat -385px -249px; width: 16px; height: 16px;}
.button.colorWhite.icon.list:before{ background: url(../images/edu/icon.png) no-repeat -365px -249px; width: 16px; height: 16px;}
.tblInM.redBg{ background: #c00000}
.eduNm{ padding-left: 75px; position: relative; line-height: 25px}
.eduNm:before{ display: block; height: 25px; width: auto; padding: 0 15px 0 20px; line-height: 25px; background: #097616; color: #fff; font-size: 11px; border-radius: 25px; position: absolute; left: 0; letter-spacing: -0.065em}
.eduNm.online:before{ content: '\ONLINE'; background: #097616;}
.eduNm.offline:before{ content: '\OFFLINE'; background: #5b5b5b}
.eduNm:after{ content: ''; display: block; position: absolute; left: 5px; top: 9px; height: 10px; width: 8px; height: 8px; background: #fff; border-radius: 50%}
.eduNm span{ display: inline-block; line-height: 25px; font-size: 13px; padding: 0 10px; border-radius: 5px; margin: 0 0 0 3px; color: #323232}
.eduNm span.nong{ background: #ffe29c;}
.eduNm span.market{ background: #b8e7f8;}
.dateR{ display: block; margin: 2px 0; color: #323232; font-size: 15px; letter-spacing: 0}
.dateR:before{ display: inline-block; background: #d5d9dc; height: 25px; line-height: 25px; padding: 0 5px; font-size: 13px; border-radius: 3px; margin-right: 10px}
.dateR.acc:before{ content: '\접수일';}
.dateR.edu:before{ content: '\교육일';}
.myClass .mySt{ font-size: 1.2em; font-weight: 400; text-align: center}
.myEduSt{ margin: 20px 0 60px; text-align: center}
.myEduSt li{ display: inline-block; width: 180px; height: 130px; background: #eff3f3; border-bottom: 3px solid #3086c9; text-align: center; padding: 25px 0 0; box-sizing: border-box; margin: 0 3px}
.myEduSt li i{ display: block; margin: 0 auto 10px; }
.myEduSt li i:before{ content: ''; display: inline-block; height: 43px; background: url(../images/edu/icon.png) no-repeat -266px -385px; width: 50px}
.myEduSt li:nth-child(2) i:before{ background-position: -325px -385px; width: 36px}
.myEduSt li:nth-child(3) i:before{ background-position: -370px -385px; width: 37px}
.myEduSt li:nth-child(4) i:before{ background-position: -412px -385px; width: 46px}
.myEduSt.classSt li{ border: 0; height: auto}
.myEduSt.classSt li i{ margin-bottom: 0}
.myEduSt.classSt li i:before{ background-position: -266px -430px; width: 41px; height: 53px}
.myEduSt.classSt li:nth-child(2) i:before{ background-position: -313px -430px; width: 42px}
.myEduSt.classSt li:nth-child(3) i:before{ background-position: -361px -430px; width: 35px}
.myEduSt.classSt li>p{ margin-top: 10px; height: 10px; background: #c9d4d4; position: relative}
.myEduSt.classSt li>p strong{ display: block;  font-size: 0; position: absolute; left: 0; top: 0; height: 10px; background: #23507b; margin: 0}
.myEduSt li strong{ display: inline-block; font-size: 1.3em; color: #d40303; margin-left: 10px}
.eduList{ border-top: 2px solid #23507b; margin-bottom: 60px}
.eduList>li{ border-bottom: 1px solid #c0c0c0; padding: 7px 10px; position: relative; box-sizing: border-box; min-height: 65px}
.eduList>li:nth-child(odd){ background: #f1f4f7}
.eduList>li>strong{ display: block; margin-bottom: 5px}
.eduList>li span{ display: inline-block; padding: 0 12px; border-left: 1px solid #323232; font-size: 0.9em; font-weight: 500; line-height: 1}
.eduList>li span.first, .myClass_tp span.first{ border: 0; padding-left: 0}
.eduList>li span.appD{ padding-left: 0; border: 0}
.eduList>li span em{ display: inline-block; margin-right: 5px; font-weight: 300; color: #686868}
.eduList>li span.eduIng{ color: #d40303}
.eduList>li .rgtA{ position: absolute; right: 10px; top: 10px}
.eduList.cont>li{ display: table; width: 100%;}
.eduList.cont>li>strong, .eduList.cont>li>div{ display: table-cell; vertical-align: middle;}
.eduList.cont>li>div span{ line-height: 45px; border: 0}
.eduList.cont>li>div span.eduIng{ position: relative; width: 340px}
.eduList.cont>li span.eduIng{ color: #323232}
.eduList.cont>li span.eduIng strong{ display: inline-block; width: 240px; height: 10px;  background: #c9d4d4; position: relative; margin-right: 15px}
.eduList.cont>li span.eduIng strong i{ display: block; height: 100%; background: #23507b; font-size: 0; position: absolute; left: 0; top: 0; }
.myClass_tp{ border: 3px solid #d8dfeb; background: #d8dfeb;}
.myClass_tp .edutl{ background: #fff;  padding: 10px 15px; position: relative;}
.myClass_tp .edutl strong{ display: block; font-size: 1.55em; font-weight: 500}
.myClass_tp .edutl span{ display: block; position: absolute; right: 20px; bottom: 10px; border: 0;}
.myClass_tp .edutl span em{ border: 1px solid #c0c0c0; border-radius: 25px; line-height: 28px; padding: 0 15px}
.myClass_tp .eduCn{ padding: 8px 12px}
.myClass_tp span{ display: inline-block; padding: 0 12px; border-left: 1px solid #323232; font-size: 0.9em; font-weight: 500; line-height: 1}
.myClass_tp span em{ display: inline-block; margin-right: 5px; font-weight: 300; color: #686868}
.popCont.eduPop{ position: relative; background: #f6f6f6;}
.popCont.eduPop .eduPopList{ display: none; position: absolute; left: 15px; top: 15px; width: 270px; z-index: 10}
.popCont.eduPop .eduPopList>strong{ display: block; line-height: 45px; background: #fff; text-indent: 10px; font-weight: 400; font-size: 0.9em; border: 1px solid #0f0f0f; border-bottom: 0; border-radius: 5px 5px 0 0; box-sizing: border-box}
.popCont.eduPop .eduPopList>strong:before{ content: ''; display: inline-block; background: url(../images/edu/icon.png) no-repeat -365px -249px; width: 16px; height: 16px; vertical-align: middle; margin-right: 5px; position: relative; top: -2px}
.popCont.eduPop .eduPopList>ul{ background: #f3f3f3; padding: 5px 10px 10px 20px; border: 1px solid #0f0f0f; border-radius: 0 0 5px 5px; box-sizing: border-box}
.popCont.eduPop .eduPopList>ul li{ list-style: decimal outside; margin: 5px 0}
.popCont.eduPop .eduPopList>ul li a{ display: inline-block; font-size: 0.9em; vertical-align: top;}
.popCont.eduPop .eduPopList>ul li.active{ font-weight: 600}
.popCont.eduPop .eduPopList>button, .popCont.eduPop .classDownload>button{ display: block; position: absolute; right: 5px; top: 5px; font-size: 0; background: transparent; padding: 0 5px;}
.popCont.eduPop .eduPopList>button:before, .popCont.eduPop .classDownload>button:before{ content: '\2715'; display: inline-block; font-size: 22px; font-weight: 300;}
.popCont.eduPop .learning{ position: absolute; top: 15px; right: 15px; line-height: 45px; background: #b2b2b2; padding: 0 15px; border-radius: 5px}
.popCont.eduPop .learning.end{ background: #d40303; color: #fff}
.popCont.eduPop .playerArea{ margin: 10px 0 0}
.popCont.eduPop .btmBox{ background: #23507b; padding: 15px 20px; position: relative}
.popCont.eduPop .btmBox>button{ display: block; background: transparent; color: #fff; line-height: 30px; position: absolute; left: 20px; top: 15px}
.popCont.eduPop .btmBox>button:before, .popCont.eduPop .btmBox>button:after{ content: ''; display: inline-block; margin: 0 5px; position: relative; top: -2px}
.popCont.eduPop .btmBox>button:before{ background: url(../images/edu/icon.png) no-repeat -385px -249px; width: 16px; height: 16px; vertical-align: middle}
.popCont.eduPop .btmBox>button:after{ content: '\203A'}
.popCont.eduPop .btmBox>div{ text-align: right; line-height: 30px}
.popCont.eduPop .btmBox>div>div{ display: inline-block; margin-left: 15px}
.popCont.eduPop .btmBox .speed span, .popCont.eduPop .btmBox .speed button{ display: inline-block; line-height: 25px; vertical-align: middle; padding: 0 0 0 8px;}
.popCont.eduPop .btmBox .speed span, .popCont.eduPop .btmBox .speed button:after{ content: '\002F'; display: inline-block; margin-left: 8px; font-weight: 300; color: #acdbff}
.popCont.eduPop .btmBox .speed button.last:after{ content: ''}
.popCont.eduPop .btmBox .speed button.active{ font-weight: 500; color: #fff}
.popCont.eduPop .btmBox .speed span{ background: #3086c9; color: #000; border-radius: 5px; padding: 0 15px; font-size: .9em; }
.popCont.eduPop .btmBox .speed button{ background: transparent; color: #acdbff; font-size: .9em; }
.popCont.eduPop .btmBox .playTime{ font-size: .9em; color: #fff; letter-spacing: 0}
.popCont.eduPop .btmBox .playTime span:before{ content: '\002F'; display: inline-block; margin: 0 5px; font-weight: 300; color: #fff}
.popCont.eduPop .btmBox .playTime strong{ color: #97c4e9}
.popCont.eduPop .btmBox .volume button, .popCont.eduPop .btmBox .screen button{ font-size: 0; background: transparent; vertical-align: middle;}
.popCont.eduPop .btmBox .volume button:before, .popCont.eduPop .btmBox .screen button:before{ content: ''; display: inline-block; background: url(../images/edu/icon.png) no-repeat; width: 25px; height: 25px}
.popCont.eduPop .btmBox .volume button:before{ background-position: -364px -277px}
.popCont.eduPop .btmBox .volume button.non:before{ background-position: -389px -277px}
.popCont.eduPop .btmBox .screen{ margin-left: 5px}
.popCont.eduPop .btmBox .screen button.full:before{ background-position: -414px -277px}
.popCont.eduPop .btmBox .screen button:before{ background-position: -439px -277px}
.popCont.eduPop .classDownload{ display: none; background: #52a7e9; padding: 15px 20px; position: relative}
.popCont.eduPop .classDownload ul li{ display: inline-block; margin-right: 30px;}
.popCont.eduPop .classDownload ul li a{ display: block; color: #000; font-weight: 400}
.popCont.eduPop .classDownload ul li a:before{ content: ''; display: inline-block; vertical-align: middle; background: url(../images/common/icon2020.png) no-repeat -91px -79px; width: 13px; height: 14px; margin-right: 5px}
.popCont.eduPop .classDownload>button{ right: 15px; top: 10px}
.popCont.eduPop .sceneBox{ margin: 10px 0; background: #fff; border: 1px solid #cacaca; padding: 10px; height: 150px; overflow-y: scroll}
.popCont.eduPop .eduSurvey{ background: #fff; padding: 15px 20px 1px}
.popCont.eduPop .eduSurvey>li{ margin-bottom: 30px}
.popCont.eduPop .eduSurvey dl dt{ font-size: 1.1em; font-weight: 400}
.popCont.eduPop .eduSurvey dl dt em{ display: inline-block; font-size: 1.4em; color: #23507b; font-weight: 500; margin-right: 10px}
.popCont.eduPop .eduSurvey dl dd{ margin: 20px 15px}
.popCont.eduPop .eduSurvey dl dd label{ display: inline-block; margin: 0 30px 10px 0}
.popCont.eduPop .eduSurvey dl dd label.etc{ display: block}
.popCont.eduPop .eduSurvey dl dd .inputData.etcD{ width: 100%; height: 55px}
.popCont.eduPop .eduSurvey .downloadBox{ background: #efefef; padding: 5px 10px}
.popCont.eduPop .eduSurvey .downloadBox span{ margin: 0 30px 0 0;}
.popCont.eduPop .eduSurvey textarea.inputData{ background: #fff; height: 150px}

@media all and (max-width:1250px){
.eduMain .eduCont1>div ul li span br{ display: none;}
}

@media all and (max-width:1170px){
.eduMain .eduCont3 .eduSchedule ul li button{ width: auto; padding: 0 10px}
.eduMain .eduCont3>div>ul li a strong{ height: auto; line-height: 1.3}
.eduMain .eduCont1>div>ul li.eduInfo>div{ z-index: 10;}
}

@media all and (max-width:1000px){
.eduMain{ margin-top: 78px;}
.eduMain .eduCont1>div{ padding: 25px 0 15px}
.eduMain .eduCont1>div>ul{ padding: 0}
.eduMain .eduCont1>div:after, .eduMain .eduCont1>div>ul li.eduPrt>div .loginArea .button:before{ display: none}
.eduMain .eduCont1>div>ul li.eduInfo>div, .eduMain .eduCont1>div>ul li>div{ left: 10px; width: calc(100% - 20px); z-index: 10}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea{ width: 60%;}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea dl{ width: 100%}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea .button{ position: static; display: block; width: 100%; height: auto;}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea dl dt{ width: 0; margin: 0}
.eduMain .eduCont1>div>ul li.eduPrt>div .loginArea dl dd .inputData{ width: 100%}
.eduNm{ margin: 10px 0 0}
.dateR{ margin: 5px 0 0}
.detailGrid>ul li>div pre{ white-space: normal}
.eduList.cont>li>strong, .eduList.cont>li>div{ display: block;}
.eduList.cont>li>div.rgtA{ position: static}
}

@media all and (max-width:790px){
.eduMain .eduCont3 .eduSchedule>span{ display: block; border: 1px solid #ccc; width: 30%; margin: 10px auto; border-radius: 10px; position: relative; padding: 10px 0; font-weight: 500}
.eduMain .eduCont3 .eduSchedule>span button{ background: transparent; position: absolute; left: 0; top: 0; width: 100%; height: 100%}
.eduMain .eduCont3 .eduSchedule>span button:after{ content: '\276E'; background: transparent; position: absolute; left: 0; top: 0; font-size: 20px; line-height: 45px;}
.eduMain .eduCont3 .eduSchedule>span.next button:after{ content: '\276F'; left: auto; right: 0}
.eduMain .eduCont3 .eduSchedule ul{ width: 100%; display: table}
.eduMain .eduCont3 .eduSchedule ul li{ display: table-cell}
.eduMain .eduCont3 .eduSchedule ul li button{ width: 98%}
.eduMain .eduCont3>div>ul li{ width: 50%}
.eduMain .eduCont3>div>ul li a, .eduMain .eduCont3>div>ul li:last-child a{ margin: 5px}
.eduMain .eduCont4{ padding: 0 0 10px; background: #fff}
.eduMain .eduCont4>div{ display: block; margin: 0 auto}
.eduMain .eduCont4 .eduPop{ width: 100%; padding: 0 5px; box-sizing: border-box}
.eduMain .eduCont4 .eduLnk{ width: 100%; padding-top: 10px}
.eduMain .eduCont4 .eduPop ul li a, .eduMain .eduCont4 .eduPop ul li a img{ height: auto}
.eduMain .eduCont4 .eduLnk ul li a{ margin: 0; padding-top: 10px; height: auto; font-size: 1em;}
.eduMain .eduCont4 .eduLnk ul li a br{ display: none}
.eduMain .eduCont4 .eduLnk ul li a:before{ margin-bottom: 10px}
}

@media all and (max-width:768px){
.eduMain .eduCont1>div>ul>li{ display: inline-block; width: 50%}
.eduMain .eduCont1>div>ul li>a, .eduMain .eduCont1>div>ul>li>p{ margin: 0 10px 10px}
.eduMain .eduCont1>div>ul li.eduInfo>div, .eduMain .eduCont1>div>ul li>div{ padding: 60px 10px 20px}
.eduMain .eduCont1>div>ul li.eduInfo>div ul li.ic{ display: block}
.eduMain .eduCont2>div>div{ width: 100%; display: block}
.eduMain .eduCont2:before{ background: transparent}
.eduMain .eduCont2>div>div.eduNoti{ background: #25b5b7}
.eduMain .eduCont2>div>div h2{ left: 15px}
.eduMain .eduCont2>div>div>a{ left: 100px}
.eduMain .eduCont2>div>div.eduQna{ padding-left: 135px}
.myEduSt li{ width: 150px; margin: 0 3px 3px}
.myClass_tp .edutl span{ position: static; padding: 0}
.eduList>li>strong{ font-size: 1.15em}
.eduList>li .rgtA{ position: static; margin-top: 15px; text-align: center;}
.eduList>li .rgtA .tblInM.button{ width: 30%}
.eduList>li .rgtA p{ background: #f5f5f5; padding: 5px}
.eduList.cont>li>div.rgtA{ margin-top: 0; text-align: left;}
.eduList.cont>li>div span.eduIng{ width: auto}
.eduList.cont>li>div.rgtA .tblInM.button{ margin: 0 auto; display: block; text-align: center;}
.popCont.eduPop .btmBox .speed span{ padding: 0 5px}
.popCont.eduPop .btmBox{ padding: 10px 0 0}
.popCont.eduPop .btmBox>button{ position: static; background: rgba(0,0,0,.5); margin-top: 10px; width: 100%; box-sizing: border-box; padding: 5px 10px}
.popCont.eduPop .btmBox>div{ text-align: left}
.popCont.eduPop .btmBox .speed{ margin-left: 0; position: relative; top: -2px}
.popCont.eduPop .btmBox .playTime{ position: absolute; right: 90px}
.popCont.eduPop .btmBox .volume{ position: absolute; right: 45px; top: 8px}
.popCont.eduPop .btmBox .screen{ position: absolute; right: 10px; top: 8px;}
}

@media all and (max-width:450px){
.eduMain .eduCont1>div{ padding: 10px 0 5px}
.eduMain .eduCont1>div>ul>li{ width: 100%}
.eduMain .eduCont1>div>ul li>a, .eduMain .eduCont1>div>ul>li>p{ padding: 0 0 15px; height: auto}
.eduMain .eduCont1>div>ul li strong{ padding: 20px 0 10px}
.eduMain .eduCont1>div>ul li>a:after, .eduMain .eduCont1>div>ul>li>p:after{ display: none}
.eduMain .eduCont2>div>div, .eduMain .eduCont2>div>div.eduQna{ height: auto; padding: 10px 0 0}
.eduMain .eduCont2>div>div.eduQna{ border-top: 1px solid #fff}
.eduMain .eduCont2>div>div h2{ position: static; text-align: center; line-height: 1.6; }
.eduMain .eduCont2>div>div ul li a{ height: 45px; line-height: 45px; text-indent: 10px;}
.eduMain .eduCont2>div>div .bx-controls{ top: 10px;}
.eduMain .eduCont2>div>div>a{ position: static; font-size: 0.9em; line-height: 35px; text-align: center; background: rgba(0,0,0,.4); color: #fff}
.eduMain .eduCont2>div>div>a:before{ line-height: 30px; font-size: 1.2em}
.eduMain .eduCont3 .eduSchedule>span{ width: 95%; padding: 5px 0}
.eduMain .eduCont3 .eduSchedule>span button:after{ line-height: 35px}
.eduMain .eduCont3 .eduSchedule ul li{ display: inline-block; margin: 0 1px 2px}
.eduMain .eduCont3 .eduSchedule ul li button{ width: 55px}
.eduMain .eduCont3>div>ul li{ width: 100%}
.eduMain .eduCont3>div>ul li a, .eduMain .eduCont3>div>ul li:last-child a{ margin-bottom: 0}
.eduMain .eduCont3>div>ul li a em{ right: 5px !important; top: 5px}
}

/* 2021 10 21 */
#content>.innerCont .detailGrid>h2{ margin-top: 30px}
.detailGrid>ul li.temS.inGridB{ position: relative; margin-top: 0;}
.detailGrid>ul li.temS.inGridB .gridScroll, .detailGrid>ul li.temS.inGridB .gridScroll table{ width: 100%}
.detailGrid .rgtBtn{ display: block; position: absolute; right: 0; top: 0; border: 0; padding: 0}
.layerPop .detailGrid>ul li>div{ background: #fff}
.layerPop .detailGrid>ul li>div:nth-child(odd){ background: #eaf0f3;}
.layerPop .detailGrid>ul li>div.w35{ width: 35%}

.calBox{ margin-top: 20px}
.calBox .month_tp{ margin: 10px 0; }
.calBox .month_tp .date_view, .calBox .month_tp .exmp{ float: left}
.calBox .month_tp .exmp{ margin-left: 20px}
.calBox .month_tp .exmp .button{ height: 30px; padding: 0 8px 0 30px; margin:  0; border-color: #b5b5b5; line-height: 1}
.calBox .month_tp .exmp .button i{ display: block; position: absolute; left: 0; top: 0; background: #f1f1f1; width: 25px; height: 100%; margin: 0}
.calBox .month_tp .date_view strong{ display: inline-block; line-height: 30px; font-weight: 500; margin-right: 10px}
.calBox .month_tp .date_view .button{ font-size: 0; height: 30px; padding: 0 8px; margin:  0 -2px; border-color: #b5b5b5}
.calBox .month_tp .date_view .button.today{ font-size: 0.8rem; line-height: 1; padding: 0 10px}
.calBox .month_tp .date_view .button:before{ display: inline-block; font-size: 1.15rem; line-height: 26px}
.calBox .month_tp .date_view .button.prev:before{ content: '\25C2';}
.calBox .month_tp .date_view .button.next:before{ content: '\25B8'; }
.calBox .month_tp .date_view .button:hover{ background: #f1f1f1}
.calBox .calendar{ width: 100%}
.calBox .calendar thead{ background: #f5f5f5; }
.calBox .calendar thead th{ font-weight: 400; border: 1px solid #e5e5e5; border-top: 1px solid #ddd; font-size: 0.8rem; text-align: left; text-indent: 10px}
.calBox .calendar thead th:first-child{ color: #f61521}
.calBox .calendar td{ padding: 0 1px; border: 1px solid #e5e5e5}
.calBox .calendar td .schedule{ min-height: 120px; overflow: hidden; text-align: left; font-size: 0.8rem; letter-spacing: -0.085em; position: relative}
.calBox .calendar td .schedule span{ display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; box-sizing: border-box}
.calBox .calendar td .schedule .date{ color: #000; text-indent: 10px; line-height: 20px; height: 20px;}
.calBox .calendar td.disable .schedule .date{ color: #999}
.calBox .calendar td .schedule .myS{ background: #e6f4f9; color: #323232; line-height: 22px; padding-left: 27px; margin-top: 2px; position: relative}
.calBox .calendar td .schedule .myS:before, .calBox .month_tp .exmp .button i:before{ content: ''; display: block; background: url(../images/common/schedule.png) no-repeat; width: 15px; height: 16px; position: absolute; left: 7px; top: 3px}
.calBox .month_tp .exmp .button i:before{ display: inline-block; top:  6px; left: 5px}
.calBox .calendar td .schedule .myS.record:before, .calBox .month_tp .exmp .button.record i:before{ background-position: 0 0}
.calBox .calendar td .schedule .myS.purchase:before, .calBox .month_tp .exmp .button.purchase i:before{ background-position: -20px 0}
.calBox .calendar td .schedule .myS.memo:before, .calBox .month_tp .exmp .button.memo i:before{ background-position: -40px 0;}
.calBox .calendar td .schedule .myS:hover{ background: #d7edf5; cursor: pointer;}
.calBox .calendar td .schedule .restDay{ background: #ffc1a6; color: #323232; line-height: 16px; text-indent: 10px;margin-top: 1px; cursor: pointer;}
.calBox .calendar td .schedule.rest .date, .calBox .calendar td .schedule.rest em{ color: #ff0000;}
.calBox .calendar td .schedule em{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 70%; text-align: right; padding-right: 8px; position: absolute; right: 0; top: 0}
.calBox .calendar td .schedule.today{ background: #f5fbfd; position: relative}
.calBox .calendar td .schedule.today .myS{ z-index: 10; width: calc(100% - 2px); left: 1px}
.calBox .calendar td .schedule.today:before{ content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #333; z-index: 1; box-sizing: border-box}
.calBox .calendar td .schedule.today .date{ display: inline-block; background: #50a7e4; color: #fff; text-indent: 0; margin: 3px 0 0 3px; width: auto; width: 22px; height: 22px; border-radius: 22px; text-align: center}
.calBox .sectionBox.calBox .selectMonth{ position: absolute; width: 100%; top: 0; height: 42px; text-align: center}
.calBox .sectionBox.calBox .selectMonth a{ width: 35px; height: 42px; background: transparent}
.calBox .sectionBox.calBox .selectMonth strong{ font-size: 18px; color: #197bc0; line-height: 42px}

/* 2021 10 27 */
.eduMain .eduCont3 .eduSchedule ul li button, .eduMain .eduCont3 .eduSchedule ul, .eduMain .eduCont3 .eduSchedule ul li{ vertical-align: top;}
.eduMain .eduCont3 .eduSchedule>span{ line-height: 55px}
.eduMain .eduCont3 .eduSchedule>span button:after{ position: relative; top: 8px;}
.eduMain .eduCont3>div>a{ left: calc(50% + 110px);}
.eduMain .eduCont3>div h2 strong{ color: #007e80;}
.eduMain .eduCont3>div>p{ text-align: center; margin: 2rem 0 0; font-size: 1.15rem; font-weight: 500}
.eduMain .eduCont3>div>p:before{ content: ''; display: block; background: url(../images/edu/icon.png) no-repeat 0 -489px; width: 85px; height: 81px; margin: 0 auto 1rem}
.eduMain .eduCont3>div>p span{ color: #007e80;}

@media all and (max-width:768px){
.eduMain .eduCont3 .eduSchedule>span{ line-height: inherit}
.eduMain .eduCont3 .eduSchedule>span button:after{ position: absolute; top: 0}
}

/* 2021 11 12 */
@media all and (min-width:1000px){
.tpSchLayer>div .button.voiceSch, .tpSchLayer .voiceSection{ display: none}
}

@media all and (max-width:1000px){
.tpSchLayer{ z-index: 1;}
.tpSchLayer:before{ content: ''; display: block; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.4); z-index: -1;}
.tpSchLayer>div{ position: relative}
.tpSchLayer>div .inputData{ height: 55px; line-height: 50px; font-size: 1.2rem; font-weight: 500; border: 0}
.tpSchLayer>div .button{ height: 50px; font-size: 1.1rem; font-weight: 500}
.tpSchLayer>div .btnClose{ background: #000}
.tpSchLayer>div .button.voiceSch{ position: absolute; width: auto; right: 5%; top: 55px; height: 55px; margin: 0; font-size: 0; background: transparent; padding: 0 15px}
.tpSchLayer>div .button.voiceSch:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -513px 0; width: 28px; height: 39px;}
.tpSchLayer .voiceSection{ position: absolute;  background: transparent; padding: 0; margin: 2em 0 0}
.tpSchLayer .voiceSection .dot{ background: #fff; position: absolute; width: 170px; height: 170px; border-radius: 50%; left: calc(50% - 170px / 2); box-sizing: border-box}
.tpSchLayer .voiceSection .dot.ref{ border: 10px solid rgba(215,0,0,.68); width: 200px; height: 200px; left: calc(50% - 200px / 2);}
.tpSchLayer .voiceSection .dot.ref .button{ width: auto; height: 35px; line-height: 30px; margin-top: 10px; font-size: 0.9rem; font-weight: 400; border-color: #999; border-radius: 5px;}
.tpSchLayer .voiceSection .dot span{ display: block; margin-top: 15px; font-size: 1.25em; font-weight: 500; color: #333; line-height: 1.2}
.tpSchLayer .voiceSection .dot:before{ content: ''; display: block; background: url(../images/common/icon2020.png) no-repeat -513px 0; width: 28px; height: 39px; margin: 30px auto 0;}
.tpSchLayer .voiceSection .dot .wave{ display: block; position: absolute;  width: 150px; height: 150px; border-radius: 50%; top: 0; border: 10px solid #fff;}
.tpSchLayer .voiceSection .dot .delay1{ animation: waves 6s linear infinite; animation-delay: .05s; -webkit-animation: waves 3s linear infinite; -webkit-animation-delay: .1s}
.tpSchLayer .voiceSection .dot .delay2{ animation: waves 6s linear 1s forwards infinite; -webkit-animation: waves 3s linear 1.5s forwards infinite;}
.tpSchLayer .voiceSection .dot .delay3{ animation: waves 6s linear 2s forwards infinite; -webkit-animation: waves 3s linear 3s forwards infinite;}

@-webkit-keyframes waves{
	0%{-webkit-transform:scale(1);transform:scale(1);opacity:0.5}
	100%{-webkit-transform:scale(1.5);transform:scale(1.5);opacity:0}
	}
@keyframes waves{
	0%{-webkit-transform:scale(1);transform:scale(1);opacity:0.5}
	100%{-webkit-transform:scale(1.5);transform:scale(1.5);opacity:0}
	}
}

/* 2021 11 24 */
a.blank:before{ content: ''; background: url(../images/common/icon2020.png) no-repeat -74px -79px; width: 14px; height: 14px; display: inline-block; margin-right: 5px; opacity: .7;}
.txt_lnk{ display: inline-block; line-height: inherit; font-weight: 600; margin-left: 10px; color: #000; font-size: 16px; position: relative; top: -2px}
.txt_lnk:after{ content: ''; display: block; width: calc(100% + 5px); height: 1px; background: #000}
.button.gradient.targetW{ padding-right: 20px}
.worksProcess dd>ol.t.t2 li:nth-child(1) span:before{ background-position: -118px -221px;}
.worksProcess dd>ol.t.t2 li:nth-child(2) span:before{ background-position: -236px -221px;}
.worksProcess dd>ol.t.t3 li:nth-child(3) span:before{ background-position: -296px -221px}

/* 2021 11 26 */
#popLayer.manual_pop .manualTabs>div.active>div{ white-space: normal;}
#popLayer.manual_pop.edu .manualTabs>div>div{ overflow-y: hidden; white-space: inherit;}
#popLayer.manual_pop.edu .manualTabs>div>div p{ white-space: inherit; height: 80px;}

/* 2021 11 29 */
#content>.innerCont .innerContSt{ background: #23507b; right: 60px}
#content>.innerCont .innerContSt:before{ background-position: -487px -50px}

#content>.innerCont .useRec{ position: absolute; right: 0; top: 40px}
#content>.innerCont .useRec .button{ width: 55px; height: 55px; background: #6585A3; font-size: 11px; margin: 0 0 0 2px;}
#content>.innerCont .useRec .button.active{ background: #23507b;}
#content>.innerCont .useRec .button:before{ display: block; margin: 2px auto 3px; left: 0; top: 0}
#content>.innerCont .useRec .button:hover:before{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;-webkit-animation-name: rotateIn; animation-name: rotateIn; animation-duration: 0.5s;}
#content>.innerCont .useRec .button.setting{ background: #116fb8; opacity: 1}
#content>.innerCont .useRec .button.setting:before{ background-position: -289px -148px; width: 18px; height: 18px}
#content>.innerCont .useRec .button.calendar:before{ background-position: -333px -148px; width: 18px; height: 18px}

@media all and (max-width:768px){
.searchBox ul li.w32{ width: 49%}
#content>.innerCont .useRec{ right: 0.5em; top: 30px}
#content>.innerCont .useRec .button{ font-size: 0; width: 50px; height: 50px; border-radius: 50%}
.calBox .month_tp .exmp{ float: right; }
.calBox .month_tp .btnArea.fr{ margin-top: 10px}
}

@media all and (max-width:550px){
#content>.innerCont .useRec{ margin-top: 70px}
.calBox{ margin-top: 10px}
#content>.innerCont .useRec .button{ width: 35px; height: 35px}
.calBox .month_tp .exmp{ float: left; margin: 10px 0 0}
.calBox .month_tp .btnArea.fr{ float: left; margin-left: -2px}
}

/* 2021 12 02 */
.lftArea>h2.comp span{ padding: 0 15px 3px;}
#content>.innerCont h1 .inH1, #content>.innerCont h1 .inH1 strong{ display: inline-block; font-size: 1.1rem; color: #323232; letter-spacing: 0; margin-left: 10px; font-weight: 400}
#content>.innerCont h1 .inH1 strong{ margin-left: 0; color: #2079bf; font-weight: 500}
.detailGrid .btn_rgtA{ position: relative}
.detailGrid .btn_rgtA .dotL{ font-size: 1em}
.detailGrid .btn_rgtA .btnA{ position: absolute; right: 0; top: 0}
.detailGrid .btn_rgtA .fileN.regiN{ margin: 0 0 0 10px; padding-left: 15px;}
.detailGrid .btn_rgtA .fileN.regiN:before{ background: #2079bf; width: 8px; height: 8px; top: 15px;}
.detailGrid .btn_rgtA+.btn_rgtA{ border-top: 1px dashed #aaa; padding-top: 5px; margin-top: 3px}
.detailGrid .btn_rgtA+.btn_rgtA .btnA{ top: 5px}
.detailGrid.view>ul li>div{ padding: 10px; vertical-align: middle;}
.detailGrid.view>ul li>div.fileIn{ padding: 0 10px}
.default_table thead th.bor_lft{ border-left: 1px solid #23507b}
.default_table tbody td.bor_lft{ border-left: 1px solid #d3d3d3}
.default_table tbody td.bor_tp2, .bor_tp2{ border-top: 2px solid #23507b;}
#content>.innerCont h3 .inH3{ display: inline-block; font-size: 0.75em !important; font-weight: 300 !important; margin-left: 15px; padding: 0 15px; font-size: 0.9em; font-weight: 500; position: relative; z-index: 1;}
#content>.innerCont .w39{ width: 39%}
#content>.innerCont h1{ margin-bottom: 20px;}
.memInfo_box{ margin: 0 0 10px; padding: 20px 0; border-top: 1px solid #999; border-bottom: 1px solid #dcdcdc}
.memInfo_box>strong{ font-size: 1.2rem; font-weight: 500}
.memInfo_box>strong:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -302px -124px; width: 20px; height: 20px; position: relative; top: 3px; margin-right: 5px}
.memInfo_box>li{ display: inline-block; width: 33%; border-left: 1px solid #dcdcdc; text-align: center}
.memInfo_box>li:first-child{ border-left: 0}
.memInfo_box>li strong{ display: inline-block; color: #C00000; font-size: 2em; margin-right: 5px}
.memInfo_box>li span{ display: block;}
.memInfo_box>ul{ margin: 10px 0 0 30px;}
.memInfo_box>ul>li{ list-style: decimal inside; font-size: 1.1rem}
.detailGrid>ul li>div .inBlock{ margin: 0 5px 0 -2px}
.detailGrid>ul li>div .w16{ width: 16%}
.detailGrid>ul li>div .w19{ width: 19.3%}
.detailGrid>ul li>div .w78{ width: 78%}
.detailGrid>ul li>div  .tlB{ display: block; border: 1px solid #ccc; border-bottom: 0; background: #f3f3f3; text-align: center; font-size: 0.9rem; font-weight: 400; padding: 7px 0; line-height: 1.2}
.detailGrid>ul li>div  .tlB.lftA{ display: inline-block; border: 1px solid #ccc; height: 37px; box-sizing: border-box;}
.detailGrid>ul li>div label{ padding: 7px 0; line-height: 1.2;}
.div_atc{ margin: 10px 0 0}
.div_atc>strong{ display: block; font-weight: 500; margin-bottom: 5px}
.div_atc ul{ display: table; width: 100%}
.div_atc ul li{ display: table-cell; width: auto; padding: 0 1px 0 0}
.div_atc ul.w9 li{ width: 11%}
.div_atc ul li .tlB{ min-height: 50px; box-sizing: border-box}
.div_atc ul.line1 li .tlB{ min-height: 30px;}
.layerCont tbody th.bgG{ background: #f9f9f9; border-right: 1px solid #d3d3d3; font-weight: 500}

@media all and (max-width:1000px){
.layerPop>div{ left: 0; top: 0; transform: inherit; -webkit-transform: inherit;}
}

/* 2021 12 09 */
#allNav .tpMember{ top: 0}
.tpRgt .tpSch, .tpRgt .allMn{ margin-top: -45px}
#container.main2020 .main_mid .pop_schWord .schWord{ vertical-align: middle;}
.dlList dt:before{ color: #fff; font-size: 1.5em; font-weight: 200; left: 12px; line-height: 1.6;}
.move_top.on{ opacity: 1}
.tpSchLayer>div .btnClose{ top: -59px;}
.searchBox.pes_dtlSch ul li.inItemC>div button{ display: inline-block; background: #fff; border: 1px solid #0f0f0f; line-height: 27px; border-radius: 3px; padding: 0 8px;  font-size: 0.85em; margin: 4px -2px 0 2px; box-sizing: border-box; transition: all .2s; -webkit-transition: all .2s;}
.searchBox.pes_dtlSch ul li.inItemC>div button:hover{ border-color: #3086c9; color: #3086c9}
.searchBox.pes_dtlSch ul li.inItemC>div button.active{ background: #3086c9; border-color: #3086c9; color: #fff}
.searchBox.pes_dtlSch ul li.inItemC>div button.active:before{ content: '\2714'; display: inline-block; margin-right: 3px}
.memberWrap .memberChk li{ float: left; width: 17%; box-sizing: border-box}
.memberWrap .memberChk li a{ display: block; background: #d2d2d2; text-align: center; font-size: 1.1em; padding: 35px 0 30px; line-height: 1.5; box-sizing: border-box; border-left: 1px solid #fff}
.memberWrap .memberChk li.last, .memberWrap .memberChk li.first{ width: 16%}
.memberWrap .memberChk li.first a{ border: 0}
.memberWrap .memberChk li.active a{ background: #23507b; color: #fff; font-weight: 500; position: relative; padding: 45px 0 20px;}
.memberWrap .memberChk li.active a:before{ content: ''; display: block; text-align: center; color: #fff; position: absolute; background: url(../images/common/icon2020.png) no-repeat -110px -132px; width: 25px; height: 32px; top: 010px;left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
#totalSch .detaiBtn{ background: #007576;}
.detailSchBox>ul li>div p span:before{ color: #000}

@media all and (min-width:1000px){
.move_top{ bottom: 130px; right: 0}
.move_top.on{ right: 0}
}

@media all and (max-width:1000px){
.tpRgt .tpSch, .tpRgt .allMn{ margin-top: 0;}
}

/* 2021 12 12 */
#agch_tabs.tabStyle1{ padding-bottom: 10px}
#agch_tabs.tabStyle1 button{ display: inline-block;  width: calc(50% - 2px); background: #f3f3f3; border: 1px solid #dadada; font-size: 1.1em; font-weight: 400;  height: 55px;  transition: all .2s; -webkit-transition: all .2s;}
#agch_tabs.tabStyle1 button.active{ background: #12b8ba; border-color: #12b8ba; color: #073435; font-weight: 500; font-size: 1.4em; }
#agch_tabs.tabStyle1 button.active.colorblue{ background: #23507b; border-color: #23507b; color: #ffffff; font-weight: 500; font-size: 1.4em; }
.searchBox .resultBox{ background: #eee; border-top: 1px solid #dcdcdc; padding: 20px 0 30px; text-align: center; color: #000; font-size: 1.1rem}
.searchBox .resultBox:before{ content: ''; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -282px -125px; width: 20px; height: 20px; vertical-align: middle; margin-right: 5px}
.searchBox .resultBox strong{ display: inline-block; color: #C00000; font-size: 1.6em; margin: 0 5px 0 15px}
.button.icon.trans:before{ content: '\21C4'; background: none; font-weight: 600}

/* 2021 12 14 */
.popCont.eduPop .sceneBox p, #popLayer.manual_pop .manualTabs>div.active>div p{ font-family: inherit; line-height: 1.5; margin: 10px 0}
#popLayer.manual_pop .manualTabs>div.active>div{ white-space: inherit; margin: 150px 0 0; padding: 0; overflow-y: auto;}
#popLayer.manual_pop .manualTabs>div.active>div p{ height: auto; border: 0; height: auto; padding: 0; margin: 0; padding: 8px 0}
.popCont.eduPop .btmBox .volume button:before, .popCont.eduPop .btmBox .screen button:before{ vertical-align: middle}
#popLayer.manual_pop .popCont .deco+.manualTabs>div>div{ margin-top: 0}
.pop-bx .btn-clo-foot a.btn-2-w{ color: #ffeb00f5 !important}
.defineDiv .defList.rndList>li dt button{ padding-left: 65px}
.defineDiv .defList.rndList>li dt:before{ color: rgba(0,0,0,.7);font-size: 35px;font-weight:  200; line-height: 55px}
#container.main2020 .main_btm.main_btm2 .btmNotiA .popNoti .bx-controls a{ background: rgba(0,0,0,.7); margin: 0 1px}
.defineDiv .defList li dt button{ padding-left: 40px}
.default_table.hOver .orderTr{ cursor: pointer}
.default_table.hOver thead th button{ padding: 5px 15px; background: transparent; border: 0; font-weight: 500; font-size: inherit}
.default_table.hOver .orderTr:after{ position: relative; top: 7px; left: -13px}
.default_table.hOver .orderTr:before{ content: '정렬 미적용'; font-size: 0;}
.default_table.hOver .orderTr.ASC:before{ content: '정렬 오름차순'; font-size: 0;}
.default_table.hOver .orderTr.DESC:before{ content: '정렬 내림차순'; font-size: 0;}

/* 2021 12 16 */
.defineDiv .defList li:first-child dd>p.imgArea.deco img{ display: none}
.defineDiv .defList li:first-child dd>p.imgArea{ background: url(../images/contents/decoImg/info2.jpg) no-repeat 0 0; width: 410px; height: 310px; margin: 0 auto;}
.defineDiv .defList.rndList li:first-child dd>p.imgArea{ width: auto; height: auto; background: none; margin-top: 20px}
.eduMain .eduCont2>div>div .bx-controls a.bx-prev:before{ font-size: 0}

/* jcalendar 웹접근성을 위한 수정 */
.jcalendar-controls{ padding: 15px 75px 15px 15px !important;}
.jcalendar-controls+table+.jcalendar-controls{ padding: 15px !important;}
.jcalendar-controls+table tfoot{ display: none}
.jcalendar-controls div{ width: 45px; text-align: center}
.jcalendar-prev, .jcalendar-next{ width: 24px; height: 24px}
.jcalendar-weekday{ text-align: center}

/* 2021 12 20 */
.inListBox{ margin-bottom: 5px}
.inListBox .box_tl{ background: #f1f4f7; border: 1px solid #afafaf; padding: 10px 25px}
.inListBox .box_tl strong{ font-size: 1.15rem; font-weight: 500; margin-right: 10px}
.inListBox>ul{ display: table; border: 1px solid #cfcfcf; padding: 15px 0; width: 100%; box-sizing: border-box}
.inListBox>ul>li{ display: table-cell; border-left: 1px dashed #ccc; text-align: center; position: relative; padding-top: 35px}
.inListBox>ul>li:first-child{ border: 0}
.inListBox>ul.w4>li{ width: 25%}
.inListBox>ul.w5>li{ width: 20%}
.inListBox>ul>li span{ position: absolute; top: 0; left: 0; width: 100%; line-height: 1.2; font-size: 0.95rem}
.inListBox>ul>li a{ font-size: 1.5rem; font-weight: 500}
.lisyStyle1.s2 li a strong{ font-size: 1rem}
.lisyStyle1.s2 li a span{ padding-right: 15px; text-align: right}

@media all and (max-width:768px){
.inListBox .box_tl strong{ display: block}
.inListBox>ul.w4>li{ float: left; display: block; width: 33.3%; box-sizing: border-box; padding: 0}
.inListBox>ul.w4>li:last-child{ width: calc(100% - 20px); padding: 0; margin: 10px 10px 0; background: #e1efff}
.inListBox>ul>li span{ position: static; display: block;}
.inListBox>ul.w4>li:last-child span{ display: inline-block; width: auto; margin-right: 10px}
.inListBox>ul.w5{ display: block;  text-align: center; padding: 10px 0 0}
.inListBox>ul.w5 li{ display: inline-block; width: 30%; padding-top: 0; margin: 0 0 10px; border: 0}
}

/* 2021 12 22 */
#container.main2020 .main_btm .btmNotiA .popNoti .bx-controls{ top: 10px}
#container.main2020 .main_btm .btmNotiA .popNoti .bx-controls a{ height: 35px}
#container.main2020 .main_btm .btmNotiA .popNoti .bx-controls a:after{ line-height: 35px}

/* 2021 12 27 wa mark */
#footer>.inner>div{ right: 120px}
.btm_wa{ position: absolute; right: 0; top: 15px;}

@media all and (max-width:768px){
.btm_wa{ display: block; position: static; margin-top: 20px}
}

/* 2021 12 28 */
.calBox .calendar td .schedule .myS{ line-height: 43px; opacity: .8; padding-left: 43px}
.calBox .calendar td .schedule .myS:hover{ opacity: 1}
.calBox .calendar td .schedule .myS.record{ background: #99d2ff}
.calBox .calendar td .schedule .myS.purchase{ background: #ffc799}
.calBox .calendar td .schedule .myS.record:before, .calBox .calendar td .schedule .myS.purchase:before{ background: url(../images/common/b_schedule.png) no-repeat; width: 32px; height: 30px; top: 6px}
.calBox .calendar td .schedule .myS.purchase:before{ background-position: -35px 0}
.calBox .month_tp .exmp .button.record{ border-color: #117fc3}
.calBox .month_tp .exmp .button.purchase{ border-color: #d76519}

/* 2022 01 13 */
.memberWrap .memberChk{ display: table; width: 100%;}
.memberWrap .memberChk li, .memberWrap .memberChk li.last, .memberWrap .memberChk li.first{ float: inherit; display: table-cell; width: 14.5%; vertical-align: top}
.memberWrap .memberChk li a{ padding: 35px 0 0; height: 90px; line-height: 1.1}

@media all and (max-width:505px){
.memberWrap .memberChk li a, .memberWrap .memberChk li.active a{ padding-top: 20px; font-size: 0.95em}
.memberWrap .memberChk li.active a:before{ width: 0; height: 0}
}

/* 2022 01 14 */
.sectionCont_tp.boxS1.boxS2 p{ min-height: inherit; padding: 10px 0 10px 110px;}
.sectionCont_tp.boxS1.boxS2 i.ic7{ left: 20px; bottom: 10px}
.sectionCont_tp.boxS1.boxS2 ol{ background: #fff; padding-left: 140px; margin: -13px 8px 8px;}
.sectionCont_tp.boxS1.boxS2 ol li{ position: relative; display: inline-block; font-weight: 500; padding-left: 60px}
.sectionCont_tp.boxS1.boxS2 ol li:after{ content:'\279C'; clear:both; display:block; position:absolute; top:15px; left:20px;}
.sectionCont_tp.boxS1.boxS2 ol li:first-child { padding-left:0}
.sectionCont_tp.boxS1.boxS2 ol li span:before { content:""; display:inline-block; width:58px; height:58px; margin: 0 10px 5px 0; background:url(../images/common/iconInfo2020.png) no-repeat 0 -221px; vertical-align: middle;}
.sectionCont_tp.boxS1.boxS2 ol li:first-child:after{ display:none}
.sectionCont_tp.boxS1.boxS2 ol li:nth-child(2) span:before { background-position:-59px -221px}
.sectionCont_tp.boxS1.boxS2 ol li:nth-child(3) span:before { background-position:-236px -221px}

@media all and (max-width:768px){
.sectionCont_tp.boxS1.boxS2 p, .sectionCont_tp.boxS1.boxS2 ol{ padding-left: 15px}
}

/* 2022 01 17 */
.default_table tbody td.tdInBtn, .tdInBtn{ background: #fbfbfb; text-align: left; padding: 5px 10px}
.tdInBtn>ul li{ display: inline-block; vertical-align: middle; text-align: center; margin: 0 15px 5px}
.tdInBtn>ul li strong{ display: block; font-weight: 500; color: #323232; margin: 0 0 5px;}
.tdInBtn>ul li strong:before, .tdInBtn>ul li strong:after{ content: ''; display: inline-block; width: 85px; height: 18px; border-left: 1px dashed #787878; border-top: 1px dashed #787878; position: relative; top: 10px; margin: 0 8px}
.tdInBtn>ul li strong:after{ border-right: 1px dashed #787878; border-left: 0}
.tdInBtn>ul li .button{ background: #f1ffff}
.tdInBtn>ul li .button.bgR1{ background: #f5fbff}

/* 2022 02 03 */
.sectionCont_tp i.ic8{ background: transparent; width: 194px; height: 87px}
.sectionCont_tp i.ic8:before{ background-position: -407px -346px; width: 194px; height: 87px;}
.sectionCont_tp.boxS1.boxS2  i.ic8 + p{ padding: 10px 50px 0 240px}
.sectionCont_tp.boxS1.boxS2  i.ic8 + p img{ display: block; padding: 10px 0 20px; max-width: 100%}
.button.icon2{ background: transparent;}
.gridScroll table td .button.small.icon2{ padding: 0 5px}
.button.icon2:before{ left: 0}
.button.icon2.apply:before{ background-position: -466px -160px; width: 32px; height: 33px}
.button.icon2.applyList:before{ background-position: -433px -160px; width: 25px; height: 33px}

@media all and (max-width:768px){
.sectionCont_tp.boxS1.boxS2 i.ic8 + p{ padding: 10px;}
}

/* 2022 02 14 */
.lftArea>h2.comp span{ width: 55%}

/* 2022 03 04 */
.detailGrid>ul li>div img{ max-width: 100%}

/* 2022 05 23 */
.default_table.hOver .orderTr:after{ background-position: -526px -175px; width: 9px; height: 15px; top: 6px}
.gridScroll table .orderTr.DESC:after, .gridScroll table .orderTr.ASC:after{ background-position: -537px -175px; width: 9px; height: 6px; top: 7px}
.gridScroll table .orderTr.DESC:after{ top: 5px}
.ic_hOver{ font-size: 0; display: inline-block; background: url(../images/common/icon2020.png) no-repeat -526px -175px; width: 9px; height: 15px; vertical-align: middle;margin: 0 3px 0 5px; position: relative; top: -2px}

/* 2022 06 03 */
#content>.innerCont .useRec .button.pin:before{ background-position: -292px -171px; width: 13px; height: 18px}
#content>.innerCont .useRec .button.cart:before{ background-position: -311px -171px; width: 16px; height: 15px}

/* 2022 06 09 */
#container.main2020 .main_mid .midTotalSch button.barcode{ background: #12b8ba; border-radius: 32px;  height: 32px; line-height: 32px; padding: 0 15px 0 30px; font-weight: 500; position: absolute; right: 15px; bottom: 15px}
#container.main2020 .main_mid .midTotalSch button.barcode:before, #container.main2020 .main_mid .midTotalSch button.barcode:after{ content: ''; display: block; position: absolute;}
#container.main2020 .main_mid .midTotalSch button.barcode:before{ background-position: -455px -48px; width: 43px; height: 55px; left: -18px; bottom: -4px}
#container.main2020 .main_mid .midTotalSch button.barcode:after{ content: '편리하고 쉽게 ~';  left: 30px; top:  -28px; font-size: 0.85rem; color: #333}
#container.main2020 .main_mid .midTotalSch button.barcode:hover:before{ animation: inherit}

@media (max-width: 1000px){
#container.main2020 .main_mid .midTotalSch button.barcode{ position: static; margin: 10px auto 0; display: block; border-radius: 10px; box-sizing: border-box; width: 85%; background: #12b8ba; padding: 0; height: auto;}
#container.main2020 .main_mid .midTotalSch button.barcode:before{ position: static; display: inline-block; margin: 0 5px 0 0; transform: scale(.7);}
#container.main2020 .main_mid .midTotalSch button.barcode:after{ content: '| 편리하고 쉬운 검색'; display: inline-block; margin-left: 5px; position: static; font-size: 1rem; }
}

@media (max-width: 520px){
#container.main2020 .main_mid .midTotalSch{ padding: 10px 0;}
}

@media (max-width: 400px){
#container.main2020 .main_mid .midTotalSch button.barcode:after{ content: '';}
}

/* 2022 06 16 */
.calBox .month_tp .exmp .button{ margin-left: 35px; padding-left: 8px; border-radius: 5px}
.calBox .month_tp .exmp .button.record{ border-color: #003cff}
.calBox .month_tp .exmp .button.purchase{ border-color: #fb4700}
.calBox .month_tp .exmp .button i{ width: 40px; height: 40px; border-radius: 50%; background: #003cff; color: #fff; top: -5px; left: -35px; text-align: center;}
.calBox .month_tp .exmp .button.purchase i{ background: #fb4700}
.calBox .month_tp .exmp .button.memo i{ background: #4c4c4c}
.calBox .month_tp .exmp .button i:before{ background: none; position: static; color: #fff; font-size: 13px; line-height: 40px; width: auto; height: auto; text-indent: -3px}
.calBox .month_tp .exmp .button.record i:before{ content: '사용';}
.calBox .month_tp .exmp .button.purchase i:before{ content: '구매';}
.calBox .month_tp .exmp .button.memo i:before{ content: '메모';}
.calBox .calendar td .schedule .myS.record:before, .calBox .calendar td .schedule .myS.purchase:before{ content: '사용'; background: #003cff; width: 32px; height: 32px; border-radius: 50%; top: 5px; left: 3px; text-align: center; color:#fff; font-size: 13px; line-height: 34px; text-indent: -2px}
.calBox .calendar td .schedule .myS.purchase:before{ content: '구매'; background: #fb4700;}

@media (max-width: 450px){
.calBox{ margin-top: 50px}
}

/* 2022 06 17 */
.button.icon.calc:before{ background-position: -349px -172px; width: 13px; height: 16px}
.button.icon.calcW:before{ background-position: -332px -172px; width: 12px; height: 15px}

/* 2022 06 23 */
#container.main2020 .main_mid .midTotalSch button.barcode{ border-radius: 0 32px 32px 0;}
#container.main2020 .main_mid .midTotalSch button.barcode:before{ background-position: -435px -228px; width: 63px; height: 53px; left: -38px; bottom: -5px;}

@media (max-width: 1000px){
#container.main2020 .main_mid .midTotalSch button.barcode{ border-radius: 32px;}
}

/* 2022 07 23 판매기록 대체농약 및 추천농약 관련 버튼 디자인 추가(이재선) */
.layerPop.sign .btnCustom{ top: 0; transform: none; width: 45px; height: 45px; position:absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: auto; bottom: 30px; background: #d5edff; border-radius: 45px; font-size: 1.2rem; width: auto; font-weight: 500; padding: 0 35px 0 30px;}
.layerPop.sign.sign2 .repBtn, .layerPop.sign.sign2 .recBtn{ background: #ffc903; }

/* 2022 09 28 */
#content>.innerCont .useRec .button.stats:before{ background-position: -265px -181px; width: 17px; height: 17px}

/* 2022 10 11 */
.gridScroll table .orderTr.DESC:after{ transform: rotate(180deg);}
.gridScroll table .orderTr.ASC:after{ transform: inherit;}

/* 2022 11 11 */
#container.main2020 .main_mid .midTotalSch button.barcode{ background: #007575;}
.searchBox label.dotL, .searchBox .dotL{ line-height: 40px; box-sizing: border-box; display: inline-block}
.searchBox label.dotL:before, .searchBox .dotL:before{ top: 45%; left: 5px; width: 4px; height: 4px}
.detailGrid>ul li>div:nth-child(odd){ background: #eaf0f3; color: #333; font-weight: 400; width: 20%; line-height: 1.3; display: table-cell;}

/* 2022 11 24 */
.enti_lt, .enti_gt{ display: inline-block; font-size: 0;}
.enti_lt:before, .enti_gt:before{ content: '\003C'; display: inline-block; font-size: 1rem}
.enti_gt:before{ content: '\003E';}

/* 2022 12 12 웹접근성 */
:focus-visible { outline:#ff0000 dashed 3px; outline-offset: -3px;}
#allNav .allMenu>button{ left: auto; transform: none; -webkit-transform: none; right: 50px}
#container.main2020 .main_mid .midTotalSch .barcode{ background: #007575; border-radius: 0 32px 32px 0; height: 32px; line-height: 32px; padding: 0 15px 0 30px; font-weight: 500; position: absolute; right: 15px; bottom: 15px; color: #fff; font-size: 1.1em; margin-left: -20px;}
#container.main2020 .main_mid .midTotalSch .barcode:before{ content: ''; display: block; position: absolute; background: url(../images/main/ic_main2020.png) no-repeat -435px -228px; width: 63px; height: 53px; left: -38px; bottom: -5px; margin-right: 5px;}
#container.main2020 .main_mid .midTotalSch .barcode:after{ content: ''; display: none}
#container.main2020 .main_mid .midTotalSch .barcode span{ display: block; position: absolute; font-size: 0.85rem; color: #333; left: 30px; top: -28px;}
.imgListDtl .imgSrl ul{ display: flex; flex-wrap: wrap;}
.imgListDtl .imgSrl ul>li{ width: 33.33%; margin-right: 0;}
.imgListDtl .imgSrl ul>li div{ margin-right: 10px !important}
.imgListDtl .imgSrl ul>li div span{ width: 100%; height: 180px}
.imgListDtl .imgSrl ul>li div .imgA:hover+.overPic, .seedList>li .thums:hover .overPic{ left: -1000000px; width: 0; height: 0; overflow: hidden; position: absolute}

.fileUpload div, .multifileUpload div{ position:relative; cursor:pointer; display:inline-block; vertical-align:middle; overflow:hidden; width:100%; height:40px; color:#fff; text-align:center; line-height:40px; padding: 0}
.fileUpload div button, .multifileUpload div button{ position: absolute; right: 0; top: 0; background: #eee; color: #000; border: 1px solid #a3aab8; width: 100px; height: 40px; line-height: 40px; font-size: 0.9em; padding: 0 15px; font-weight: 300; border-radius: 0 3px 3px 0; box-sizing: border-box}
.fileUpload div input, .multifileUpload div input{ display: block; position:absolute; width:calc(100% - 100px); height:100%; overflow:hidden; border: 0; background: transparent; left: 0; top: 0; opacity: 0}
.fileUpload input[type=text], .multifileUpload input[type=text]{ position: absolute; left: 0; top: 0; vertical-align:middle; display: block; width: calc(100% - 100px); height:40px; line-height:40px; border:1px solid #d3d3d3; border-right: 0; box-sizing: border-box}

.seedList>li ul li p .fileN .button{ display: inline-block; position: static;}
.imgListDtl .imgSrl ul>li div .imgA+.overPic, .seedList>li .thums span+.overPic{ left: -1000000px;}
.default_table.hOver .orderTr:before, .default_table.hOver .orderTr.ASC:before, .default_table.hOver .orderTr.DESC:before{ content: ''}
.tabStyle1 .seedList>li{ min-height: 235px; box-sizing: border-box;}
.default_table td a, .gridScroll table td a, .detailGrid>ul li a{ text-decoration: underline}

:focus-visible { outline:#ff0000 dashed 3px; outline-offset: 0;}
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont h2 button:focus-visible,
#container.main2020 .btmPesInfo .manualArea .manualD a:focus-visible,
#container.main2020 .main_btm.main_btm2 .btmNotiA .tablsNoti .tablsNotiCont ul li a:focus-visible,
#container.main2020 .main_btm.main_btm3 .btmCounter>ul li a:focus-visible,
.lftArea>ul>li>a:focus-visible,
.inputData:focus-visible,
.fileUpload div button:focus-visible,
#skipnavi a:focus-visible,
#gnb>li>a:focus-visible,
.locArea .inner>a:focus-visible,
#container.main2020 .main_mid .favoBox .swiper-button-next:focus-visible, #container.main2020 .main_mid .favoBox .swiper-button-prev:focus-visible, #container.main2020 .main_btm .btmNotiA .popNoti ul li a:focus-visible,
.pestCrl.defineDiv.tabs.w3 .defList li .defCont .consR li a:focus-visible{ outline:#ff0000 dashed 3px; outline-offset: -3px;}

#container.main2020 .main_mid .favoBox .swiper-button-prev:focus-visible{ outline-offset: -5px; opacity: 1; left: 5px}

/* 2022 12 16 */
.calBox .calendar td .schedule a{ display: inline-block; width: 100%}
.calBox .calendar td .schedule a:focus-visible{ outline:#ff0000 dashed 3px; outline-offset: -3px; box-sizing: border-box;}
.calBox .calendar td .schedule a.lnk{ position: absolute; width: 100%; height: 100%; font-size: 0}
.orderList>li>a.grnLineBox{ display: inline-block; width: 100%; box-sizing: border-box;}

/* 2022 Renewal start */
/* 2023 01 16 */
.formS1{ background: #e5f3ff; padding: 10px; margin: 10px auto 20px; width: 50%; text-align: center;}
.formS1 span, .formS1 strong{ vertical-align: middle; display: inline-block; font-weight: 400;}
.formS1 strong span{ display: block; padding: 0 10px}
.formS1 strong span.fraction{ width: 100%; height: 1px; background: #333; font-size: 0;}
.referBox2{ background: #f1f1f1; padding: 10px;}
.sectionCont_tp.boxS3{ border: 0}
.sectionCont_tp.boxS1.boxS3 i{ top: 5px; left: 10px; width: 130px}
.sectionCont_tp.boxS1.boxS3 p{ padding: 0 0 0 130px; min-height: 95px; display: flex; flex-wrap: nowrap; align-items: center;}
.sectionCont_tp.boxS1.boxS3 .n_ic:before{ background: url(../images/main_2022/icon_2022.png) no-repeat;}
.sectionCont_tp.boxS1.boxS3 .n_ic.ic8:before{ background-position: 0 -393px; width: 90px; height: 65px;}

.processU.ul2{ margin: 15px 0 30px;}
.processU.ul2 li{ display: inline-block; position: relative; padding-right: 30px; margin: 0 0 10px}
.processU.ul2 li:after{ content: '\279C'; display: inline-block; color: #12b8ba; position: absolute; right: 10px; top: 40px; line-height: 1}
.processU.ul2 li:last-child{ padding: 0}
.processU.ul2 li:last-child:after{ display: none}
.processU.ul2 li span{ display: block; width: 165px; height: 100px; border: 1px solid #12b8ba; text-align: center; font-size: 1.1em}
.processU.ul2 li span:before{ content: ''; display: block; margin: 10px auto 0; background: url(../images/main_2022/icon_2022.png) no-repeat; width: 58px; height: 58px}
.processU.ul2 li:nth-child(1) span:before{ background-position: -97px -305px;}
.processU.ul2 li:nth-child(2) span:before{ background-position: -162px -305px;}
.processU.ul2 li:nth-child(3) span:before{ background-position: -226px -305px;}
.processU.ul2 li:nth-child(4) span:before{ background-position: -292px -305px;}
.processU.ul2 li:nth-child(5) span:before{ background-position: -97px -369px;}
.processU.ul2 li:nth-child(6) span:before{ background-position: -162px -369px;}
.processU.ul2 li:nth-child(7) span:before{ background-position: -226px -369px;}
.processU.ul2 li:nth-child(8) span:before{ background-position: -292px -369px;}

.default_table tfoot td{ padding: 10px 5px; line-height: 1.2; border: 1px solid #d3d3d3; background: #fbfbfb; text-align: center}
.checkboxLi{ text-align: left; margin: 10px 0; padding: 15px; background: #f1f1f1;}
.checkboxLi>li{ padding: 5px 0 2px 18px; line-height: 1.2; position: relative}
.checkboxLi>li:before{ content: '\25A2'; display: block; position: absolute; left: 0; top: 0; line-height: 1.5;}

.default_table td .checkboxLi{ margin: 0; padding: 0; background: #fff;}
.imgArea.bgGray{ margin: 10px 0 20px; padding: 10px; background: #f0f0f0;}
.decimalList.chkList{ padding: 10px 0;}
.decimalList.chkList li{ border: 1px solid #dbdbdb; list-style: decimal inside none; margin: 0 0 1px; padding: 8px; background: #fbfbfb; position: relative}
.decimalList.chkList li div{ position: absolute; right: 0; top: 0; height: 100%; background: #fff; display: table; align-items: center;}
.decimalList.chkList li div span{ flex: 1; border-left: 1px solid #dbdbdb; width: 5em; text-align: center; display: table-cell; vertical-align: middle; font-size: 0.9rem;}

@media (max-width: 768px){
	.decimalList.chkList li{ padding: 8px 0 0;}
	.decimalList.chkList li div{ position: static; width: 100%; border-top: 1px solid #ddd; margin: 10px 0 0}
	.decimalList.chkList li div span:first-child{ border-left: 0}
	.decimalList.chkList li div span{ padding: 5px 0}
}

#main_2022 .sectionCont_tp{ border: 8px solid #f2f4f5; border-radius: 0 0 40px 0; padding: 15px 15px 10px 150px; min-height: 75px;}
#main_2022 .sectionCont_tp i{ top: 12px}
#main_2022 .sectionCont_tp:before, #main_2022 .sectionCont_tp:after{ content: ''; display: block; position: absolute; left: -8px; top: -8px; z-index: 1}
#main_2022 .sectionCont_tp:before{ border-left: 8px solid #fff; border-top: 8px solid #fff; width: 40px; height: 30px; }
#main_2022 .sectionCont_tp:after{ border-left: 8px solid #3086c9; border-top: 8px solid #3086c9; width: 37px; height: 27px;}
#main_2022 .sectionCont_tp.boxS1 p{ border: 0; background: transparent; padding: 0; min-height: auto;}
#main_2022 .sectionCont_tp.boxS1.boxS3 i{ left: 20px; top: 10px}
#main_2022 .sectionCont_tp.boxS1.boxS3 p{ padding: 0; min-height: auto;}
#main_2022 .sectionCont_tp i{ background: url(../images/main_2022/icon_2022.png) no-repeat; height: 84px; border-radius: 0; top: 17px}
#main_2022 .sectionCont_tp i:before{ display: none}
#main_2022 .sectionCont_tp i.ic1{ background-position: -291px -469px; width: 98px;}
#main_2022 .sectionCont_tp i.ic2{ background-position: 0 -469px; width: 85px;}
#main_2022 .sectionCont_tp i.ic3{ background-position: -95px -469px; width: 92px;}
#main_2022 .sectionCont_tp i.ic4{ background-position: -202px -664px; width: 91px; height: 75px;}
#main_2022 .sectionCont_tp i.ic5{ background-position: 0 -664px; width: 95px; height: 75px;}
#main_2022 .sectionCont_tp i.ic6, #main_2022 .sectionCont_tp i.ic8{ background-position: -96px -567px; width: 103px; height: 82px}
#main_2022 .sectionCont_tp i.ic7{ background-position: -204px -567px; width: 92px; height: 85px; left: 20px}
#main_2022 .sectionCont_tp i.ic9{ background-position: -302px -567px; width: 95px; height: 79px}

@media (max-width: 768px){
	#main_2022 .sectionCont_tp{ padding: 10px; border: 8px solid #f2f4f5; min-height: auto; background: #fff; border-radius: 0}
}

/* 2022 Renewal end */

/* 2023 02 03 */
@media (max-width: 1000px){
	#container.main2020 .main_mid .midTotalSch .barcode{display: block;position: relative;border-radius: 60px;margin: 0 1rem;height: auto;right: 0;bottom: 0; border: 2px solid #007575; background: #fff; color: #007575; font-weight: 800;}
	#container.main2020 .main_mid .midTotalSch .barcode:before{ display: inline-block; position: static; vertical-align: middle;}
	#container.main2020 .main_mid .midTotalSch .barcode span{ display: inline-block; position: static; margin-right: 5px; font-weight: 500;}
}

@media (max-width: 768px){
	#container.main2020 .main_mid .midTotalSch .barcode{ margin: 1rem 1rem 0; padding: 3px; border: 0; background: #007575; color: #fff;}
	#container.main2020 .main_mid .midTotalSch .barcode span{ color: #fff;}
}

/* 2023 03 09 교육 구분명 변경 */
.eduNm.online:before{ content: '\온라인'; background: #097616;}
.eduNm.offline:before{ content: '\집합교육'; background: #5b5b5b}

/* 2023 03 13 */
.eduMain .eduCont1>div>ul>li>p:after{ bottom: 55px;}

/* 2023 03 24 */
#main_2022 .main_section2>.inner div ul li.mn10 a i:before{ background-position: -367px -107px; width: 32px}

/* 2023 10 17 */
#main_2022 .mypageLayer{ z-index: 40;}
.eduMain .eduCont1>div>ul li p a:focus-visible{ outline:#ff0000 dashed 3px; outline-offset: -3px;}

/* 2023 10 18 김영숙 */
#main_2022 #allNav .tpMember.beforeL{padding-top: 0;}
#main_2022 #allNav .tpMember.beforeL:before{display: none;}
.worksProcess dd>ol.d li dt:before{display: none;}
.worksProcess dd>ol.d li dt em {display: inline-block;width: 40px;height: 40px;background: #0B7576;text-align: center;line-height: 40px;color: #fff;margin: 0 10px 0 0;}

.default_table thead th{border: 1px solid #23507b;}
.default_table thead th:first-child, .default_table tbody td:first-child {border-left: 0;}
.default_table tbody td:first-child {border-right: 1px solid #d3d3d3;}
.default_table thead th:last-child, .default_table tbody td:last-child{border-right: 0;}

/* 2023 10 25 */
#popLayer.manual_pop.edu .manualTabs div:nth-child(4) button{ top: 150px; left: 20px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(5) button{ top: 0}
#popLayer.manual_pop.edu .manualTabs div:nth-child(6) button{ top: 50px}
#popLayer.manual_pop.edu .manualTabs div:nth-child(7) button{ top: 100px; left: 50%; border-bottom: 1px solid #ccc;}
#popLayer.manual_pop .manualTabs>div.active>div{ margin-top: 200px}

@media (max-width: 768px){
	#popLayer.manual_pop.edu .manualTabs>div.active>div{ margin-top: 0}
}

/* 2023 11 06 */
#main_2022 #footer>.inner>div{ right: auto; left: 30%; padding-left: 0; background: none;}
#main_2022 #footer>.inner>div ul{ display: flex; flex-wrap: wrap; padding-top: 5px; padding-left: 25px; position: relative;}
#main_2022 #footer>.inner>div ul:before{ content: '\260E'; display: block; position: absolute; left: 0; top: 10px}
#main_2022 #footer>.inner>div ul li{ font-size: .9rem; letter-spacing: 0; position: relative; margin: 0 30px 0 0}
#main_2022 #footer>.inner>div ul li:after{ content: '\002D'; display: block; position: absolute; right: -18px; top: 0; color: #9d9d9d}
#main_2022 #footer>.inner>div ul li:first-child{ width: 100%; font-size: 1rem; font-weight: 600;}
#main_2022 #footer>.inner>div ul li:last-child:after, #main_2022 #footer>.inner>div ul li:first-child:after{ display: none;}
#main_2022 #footer>.inner>div>p{ padding-left: 25px; font-size: .9rem; font-weight: 300; opacity: .8;}
#main_2022 .btm_wa{ left: auto; right: 20px}

@media (max-width: 1200px){
	#main_2022 #footer>.inner>div{ position: static; padding: 10px 0;}
	#main_2022 #footer>.inner>div ul:before{ display: none;}
	#main_2022 .move_top{ bottom: 218px;}
}

@media (max-width: 1000px){
	#main_2022 #footer>.inner>div ul{ padding: 0; justify-content: center;}
	#main_2022 .move_top{ bottom: 197px;}
}

@media (max-width: 660px){
	#main_2022 .footMn{ height: auto;}
	#main_2022 .btm_wa{ position: static}
}

@media (max-width: 430px){
	#main_2022 #footer>.inner>div ul{ justify-content: flex-start; padding-left: 20px}
	#main_2022 #footer>.inner>div>p{ padding-left: 20px}
	#main_2022 .btm_wa{ text-align: center;}

}

/* 2023 11 21 */
#main_2022 .inNongSch>div>button{ border: 2px solid #365b9e;}
#main_2022 .inNongSch>div.active>button{ background: #365b9e;}

.default_table tbody th{border-right: 1px solid #d3d3d3;}
.dlList dt:before{display: none;}
.dlList dt{padding: 12px 30px 12px 15px;}
.eduNm.offline:before,.eduNm.online:before{display: none;}
.eduMain .eduCont3>div>ul li a div.online em, .eduMain .eduCont3>div>ul li a div.offline em{    display: block;height: 25px;width: max-content;padding: 0 15px 0 20px;line-height: 25px;background: #097616;color: #fff;font-size: 11px;border-radius: 25px;position: absolute;left: 0;letter-spacing: -0.065em;}
.eduMain .eduCont3>div>ul li a div.offline em{background:#5b5b5b;}

.schWrap.schWrap2 .keyword{color: #DA0000!important;}

/* 2023 11 22 */
.detailSchBox>ul li>div p span{margin-left: 0}
.detailSchBox>ul li>div p em {display: inline-block;width: 22px;height: 22px;border-radius: 50%;font-size: 12px;background: #09b54f;color: #fff;text-align: center;line-height: 22px;margin:0 5px 0 20px;}
.default_table tbody th, .default_table tbody td{border-right: 1px solid #d3d3d3;}
.referBox em {color:#C00000}

/* 2023 11 27 */
.defineDiv.tabs.w3 .sectionCont_tp{ background: #f2f4f5;}
#main_2022 #gnb .subGnb.on>ul li a:hover{ background: #2479bc; color: #fff}
#main_2022 #gnb .subGnb.on>ul li a[target='_blank']:hover:after{ background-position: -79px 0;}

@media (max-width: 500px){
	.searchBox ul>li.w35{ width: 100%}
}

.detailSchBox>ul li>div p span:before{display: none;}
.detailSchBox>ul li>div p em{color: #000;}

.konan-autocomplete{ z-index: 400 !important;}

@media (max-width: 1000px){
	#main_2022 #allNav .allMenu:before, #allNav .allMenu>button, .btnClose{ position: fixed;}
	#main_2022 #allNav .allMenu ul ul.depth2{ position: fixed; bottom: 0; overflow-y: auto;}
}

/* 2023 12 01 */
.bg_tbody{ position: relative;}
.bg_tbody td:before{ content: ''; display: block; background: rgba(0,0,0,.01); width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2}
.bg_tbody .alert{ border: 0; padding: 0; position: absolute; z-index: 3; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); top: 40%; padding: 5px; border-radius: 5px; border: 1px solid #000}

/* 2023 12 05 */
.defineDiv .defList li:first-child dd>p.imgArea{ width: auto; max-width: 100%;}
img{ max-width: 100%;}

/* 2023 12 14 */
#main_2022 .mainService3 .videoDiv ul li a:focus-visible, .eduMain .eduCont2>div>div ul li a:focus-visible, .eduMain .eduCont4 .eduPop ul li a:focus-visible{ outline:#ff0000 dashed 3px; outline-offset: -3px; box-sizing: border-box;}
.calBox .calendar td .schedule.today .date{ background: #2079bf;}
/* .necessary:before{ content: '';}
.necessary+sup{ font-size: 25px; color: #ee5a5a; line-height: 1.6;}
p.necessary:before, em.necessary:before{ content: '\002A';} */
.necessary span{ font-size: 0; height: 0; width: 0; overflow: hidden;}
.jcalendar-prev, .jcalendar-next{ font-size: 0}
#content>.innerCont .useRec .button{ color: #000; font-weight: 400;}
#content>.innerCont .useRec .button.active{ color: #fff; font-weight: 600;}
.calBox .month_tp .exmp .button{ margin-left: 10px}
.calBox .month_tp .exmp .button i{ display: none;}
.calBox .month_tp .exmp .button.record{ background: #003cff; color: #fff}

/* 2023 12 19 */
.defineDiv .defList.rndList>li dt button{ padding-left: 20px;}
.defineDiv .defList.rndList>li.active dt button{ font-size: 1.35em;}
.defineDiv .defList.rndList>li dt:before, .sectionCont_tp+.hideMnA{ display: none !important;}

/* 2024 11 22 */
.searchBox.pes_dtlSch > ul{ display: flex; flex-wrap: wrap; width: auto; right: 0}
.searchBox.pes_dtlSch ul li{ display: flex; justify-content: space-between; gap: 8px;}
.searchBox.pes_dtlSch ul li.w25, .searchBox.pes_dtlSch ul li.w50{ margin-right: 0;}
.searchBox label.dotL, .searchBox .dotL{ width: 120px; flex-shrink: 0;}
.searchBox.pes_dtlSch label.dotL+.inputData{ width: 100%;}

@media (min-width: 320px) and (max-width: 1000px) {
	.searchBox.pes_dtlSch > ul{ gap: 5px 10px}
	.searchBox.pes_dtlSch ul li.w25, .searchBox.pes_dtlSch label.dotL+.inputData, .searchBox.pes_dtlSch ul li.w50 .inputData, .searchBox.pes_dtlSch ul li.w50{ width: calc(50% - 5px)}
	.searchBox.pes_dtlSch ul li.w50.inItemC, .searchBox.pes_dtlSch ul li.w50.inItemC .inputData{ width: 100%}
	.searchBox ul li label.dotL{ width: 120px;}
}

/*2024 11 25 웹접근성 YS*/
#main_2022 .move_top{display: none;}
#main_2022 .move_top.on{display : block;}
/*2024 11 27 웹접근성 명도대비 수정*/
#main_2022 .mainService3 .videoDiv ul li a .mov_tm {color: #757575;}
.eduMain .eduCont3>div>ul li a span{color: #2f79b1;}
.calBox .calendar thead th:first-child {color: #e10e19;}

/* 2024 12 17 웹접근성 명도대비 수정 */
.bluLineBox>em, .grnLineBox>em{color:#323232}

/* 2024 12 19 */
#main_2022 .tpSchLayer>div .btnClose:before{ color: #000}
#main_2022 .mainService2 .tablsNotiA>div>div ul li span, #main_2022 .mainService3 .videoDiv ul li a .mov_tm, #main_2022 .mainService3 .manualDiv .usrManual>ul li a span{ letter-spacing: 0;}
#main_2022 .mainService2 .tablsNotiA>div>div ul li span:before, #main_2022 .mainService3 .videoDiv ul li a .mov_tm:before, #main_2022 .mainService3 .manualDiv .usrManual>ul li a span:before{ display: none;}

.flexUl.w3{ display: flex;}
.flexUl.w3>li{ width: 33.33%}
@media (max-width: 1000px){
	.flexUl{ flex-wrap: wrap;}
	.flexUl.w3>li{ width: 100%}
}

.calendar-button { position: absolute; right: 5px; top: 50%; transform: translateY(-50%);  width: 30px; height: 35px; border: none; background: url(../images/common/calendar.png) no-repeat center; cursor: pointer; z-index: 1;}
.datepicker-container{ display: inline-block}
.datepicker-container .inputData.datepicker{ width: 100% !important}

/* 2025 04 29 */
#main_2022 .tpRgt .tp_mLogin{ display: none; padding: 0; margin: 0; font-size: 1px; overflow: hidden; opacity: 0}
@media (max-width: 1000px) {
   #main_2022 .tpRgt .tp_mLogin{ display: inline-block; opacity: 1; margin: 13px 8px 0; display: inline-block; background: #f1f1f1; color: #000; border: 1px solid #ddd; line-height: 28px; padding: 0 8px;  border-radius: 5px; font-size: 14px;}
}

.blind {
	position: absolute; z-index: -1; display: inline-block; width: 1px; height: 1px;
	padding: 0; overflow: hidden; clip-path: inset(50%); border: 0;
	white-space: nowrap;
}