@charset"utf-8";
/*!------------------------------------------------------------ *
 * RemoteCall5.x auth page common css
 * Last Updated: 2013.01.07
 * Author: Jeong Heeju
 * Copyright© RSUPPORT CO., LTD. ALL RIGHTS RESERVED.
 * http://rsupport.com/Products/RemoteCall
 * ------------------------------------------------------------ */
/* Google Font */
@font-face {
    font-family: 'Nanum Gothic'; font-style: normal; font-weight: 400;
    src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot);
    src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
    url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff2) format('woff2'),
    url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff) format('woff'),
    url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.ttf) format('truetype');
}

/* css init */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,
em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,
nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,
u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font-family:inherit;vertical-align:baseline;background:transparent;}
html{height:100%;overflow-y:scroll;font-size:16px;}body{height:100%;color:#000;position:relative;font-size:.75em;line-height:1;font-family:sans-serif;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
ol,ul{list-style:none;}h1,h2,h3,h4,h5,h6{font-weight:bold;}
blockquote,q{quotes:none;}q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}
ins{text-decoration:none;}del{text-decoration:line-through;}hr{display:none;}
a,a:visited{text-decoration:underline;}a:hover,a:active,a:focus{text-decoration:underline;}a img{border:0;}
button{cursor:pointer;}button::-moz-focus-inner{padding:0;border:0;}
:invalid,:required{box-shadow:none;}input::-ms-clear{display: none;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button{ -webkit-appearance: none; margin: 0;}
/*a:focus,button:focus,input[type=submit]:focus,input[type=button]:focus,input[type=image]:focus{outline: 2px dotted red;}*/
/*::-moz-selection{background:transparent;}::selection{background:transparent;} */
/* l10n font */
body, input, textarea, select, button{font-family: arial,helvetica,clean,sans-serif;}
.lang-en, .lang-en input, .lang-en textarea, .lang-en select, .lang-en button{font-family: verdana,helvetica,arial,sans-serif;}
.lang-ko, .lang-ko input, .lang-ko textarea, .lang-ko select, .lang-ko button{font-family: gulim,arial,sans-serif;}
.lang-ja, .lang-ja input, .lang-ja textarea, .lang-ja select, .lang-ja button{font-family: "MS PGothic",Osaka,arial,sans-serif;}
.lang-zh_CN, .lang-zh_CN input, .lang-zh_CN textarea, .lang-zh_CN select, .lang-zh_CN button,
.lang-zh_TW, .lang-zh_TW input, .lang-zh_TW textarea, .lang-zh_TW select, .lang-zh_TW button{font-family: SimSun,arial,sans-serif;}
/* icons */
#notify-bar-close, #view-program-guide, .popup-wrap .popup-close, .ui-datepicker-prev .ui-icon, .ui-datepicker-next .ui-icon, label.check-wrap, .date-picker{
  background-image:url(../images/relay/icons.png); background-repeat: no-repeat;
}
/* input wrap */
form{position: relative; z-index:1000;}
form input{margin: 0; padding: 0;}
.input-wrap{height: 28px; display: inline-block; position: relative;}
.input-wrap label, .input-wrap input, .input-wrap textarea, .input-wrap select, .input-wrap span, .input-wrap label{
  height: 26px; vertical-align: top; line-height: 26px; display: inline-block;
}
.input-wrap label{
  padding: 1px; margin-right: 10px; overflow: hidden;
  font-weight: bold; font-size: 12px; color: #333;
}
input.text,input[type=text],textarea,select{
  width: 166px; padding: 0 10px; *margin: -1px 0; border: 1px solid #D8D8D8;
  font-size: 12px; line-height: 26px; color: #5A5A5A; background-color: #FFF;
}
input.text,input[type=text]{height: 26px;}
textarea{
  height: 57px; min-height: 57px; padding: 8px 0 0 10px !important;
  resize: vertical; line-height: 16px !important; overflow-y: auto;
}
select{width:186px; height:28px;}
.color-blue input.text:focus, .color-blue select:focus, .color-blue textarea:focus,
.color-blue .focusin input.text, .color-blue .focusin select, .color-blue .focusin textarea,
.color-skyblue input.text:focus, .color-skyblue select:focus, .color-skyblue textarea:focus,
.color-skyblue .focusin input.text, .color-skyblue .focusin select,.color-skyblue .focusin textarea{border-color: #5795BB !important;}
.color-brown input.text:focus, .color-brown select:focus, .color-brown textarea:focus,
.color-brown .focusin input.text, .color-brown .focusin select, .color-brown .focusin textarea{border-color: #B37143 !important;}
.color-darkred input.text:focus, .color-darkred select:focus, .color-darkred textarea:focus,
.color-darkred .focusin input.text, .color-darkred .focusin select, .color-darkred .focusin textarea{border-color: #BC425A !important;}
.color-red input.text:focus, .color-red select:focus, .color-red textarea:focus,
.color-red .focusin input.text, .color-red .focusin select, .color-red .focusin textarea{border-color: #D60127 !important;}
.color-green input.text:focus, .color-green select:focus, .color-green textarea:focus,
.color-green .focusin input.text, .color-green .focusin select, .color-green .focusin textarea,
.color-yellowgreen input.text:focus, .color-yellowgreen select:focus, .color-yellowgreen textarea:focus,
.color-yellowgreen .focusin input.text, .color-yellowgreen .focusin select, .color-yellowgreen .focusin textarea{border-color: #4B9A2E !important;}
.color-orange input.text:focus, .color-orange select:focus, .color-orange textarea:focus,
.color-orange .focusin input.text, .color-orange .focusin select, .color-orange .focusin textarea,
.color-orangered input.text:focus, .color-orangered select:focus, .color-orangered textarea:focus,
.color-orangered .focusin input.text, .color-orangered .focusin select, .color-orangered .focusin textarea{border-color: #D87500 !important;}
/* big input wrap */
.large-input-wrap{height: 32px;}
.large-input-wrap label, .large-input-wrap input{height: 30px; font-size: 14px; line-height: 30px;}
.large-input-wrap input{text-align: center; font-weight: bold;}
/* placeholder */
::-webkit-input-placeholder{color: #D4D4D4;}
:-moz-placeholder{color: #D4D4D4;}
:-ms-input-placeholder{color: #D4D4D4;}
input:-moz-placeholder, textarea:-moz-placeholder{color: #D4D4D4;}
.placeholder{color: #D4D4D4 !important;}
.input-wrap .placeholder{color: #D4D4D4; white-space: nowrap; overflow: hidden;text-overflow: ellipsis; -o-text-overflow: ellipsis;}
/* checkbox wrap */
label.check-wrap{
  padding: 6px 0 6px 18px; display: inline-block; overflow: hidden; cursor: pointer;
  position: relative; line-height: 14px !important; background-position: 1px -370px; background-repeat: no-repeat;
}
label.check-wrap span{
  padding: 0 !important; margin: 0 !important; display: block;
  line-height: 14px !important; vertical-align: top;
}
label.check-wrap input{position: absolute; top: -30px; left: -30px;}
label.checkbox-selected{background-position: 1px -450px !important;}
label.checkbox-hover{background-position: 1px -530px !important;}
label.checkbox-hover.checkbox-selected{background-position: 1px -610px !important;}
/* button */
.button, .button *{
  height: 26px; margin:0; padding:0; border:0; display:inline-block; line-height: 26px; _line-height: 27px;
  text-decoration:none !important; font-size:12px; white-space:nowrap; font-family:inherit !important;
  vertical-align:top; overflow:visible; _overflow-y: hidden; background-color: transparent !important; background-repeat: no-repeat;
}
.button, .button span,
.color-blue .button, .color-blue .button span,
.color-skyblue .button, .color-skyblue .button span,
.download-button, .download-button span,
.color-blue .download-button, .color-blue .download-button span,
.color-skyblue .download-button, .color-skyblue .download-button span{background-image: url(../images/relay/buttons-blue.png);}
.color-brown .button, .color-brown .button *,
.download-button, .download-button span{background-image: url(../images/relay/buttons-brown.png);}
.color-red .button, .color-red .button span,
.color-darkred .button, .color-darkred .button span,
.color-red .download-button, .color-red .download-button span,
.color-darkred .download-button,.color-darkred .download-button span{background-image: url(../images/relay/buttons-red.png);}
.color-green .button, .color-green .button span,
.color-green .download-button, .color-green .download-button span{background-image: url(../images/relay/buttons-green.png);}
.color-yellowgreen .button, .color-yellowgreen .button span,
.color-yellowgreen .download-button, .color-yellowgreen .download-button span{background-image: url(../images/relay/buttons-yellowgreen.png);}
.color-orange .button, .color-orange .button span,
.color-orange .download-button, .color-orange .download-button span{background-image: url(../images/relay/buttons-orange.png);}
.color-orangered .button, .color-orangered .button span,
.color-orangered .download-button, .color-orangered .download-button span{background-image: url(../images/relay/buttons-orangered.png);}
.button{margin-right: 17px; position: relative;}
.button span{left:17px; position:relative; background-position: right 0;}
.button button{padding:0;margin:0;border:0;background-color:transparent;overflow:visible;cursor:pointer;}
.button button,.button a{
  margin-right: -17px; padding: 0 17px;position: relative; left: -17px;
  background: transparent !important; cursor:pointer; color: #888; font-weight: bold;
}
.button:hover{background-position: 0 -35px;}
.button:hover span{color: #666; background-position: right -35px;}
/* large button */
.button.large,.button.large *{
  height: 32px; line-height: 32px; _line-height: 35px; font-size: 14px; background-position: 0 -70px;
}
.button.large{margin-right: 25px;}
.button.large span{left:25px;}
.button.large button,.button.large a{margin-right: -25px; padding: 0 25px; top: 0 !important; left: -25px; background: transparent !important;}
.button.large:hover{background-position: 0 -105px;}
.button.large:hover span{
  color: #666; background-position: right -105px;
}
a.cursorUnset{
  cursor:unset !important;
}
/* common layout rules */
.float-left{float: left; display: inline;}
.float-right{float: right; display: inline;}
.float-wrap{position:relative; float:none; overflow:visible; *zoom:1;}
.float-wrap:after{content:"";display:block; clear:both; height:0; visibility:hidden;}
#relay-information p { overflow-y: auto; max-height: 80px; } /* 안내글 4줄 이상 스크롤  */

/* color set */
.point-color, .color-blue .point-color,.color-skyblue .point-color,
.point-color *, .color-blue .point-color *,.color-skyblue .point-color *{
  color: #5795BB !important;
}
.color-brown .point-color, .color-brown .point-color *{
  color: #B37143 !important;
}
.color-darkred .point-color, .color-darkred .point-color *{
  color: #BC425A !important;
}
.color-red .point-color, .color-red .point-color *{
  color: #D60127 !important;
}
.color-green .point-color, .color-yellowgreen .point-color,
.color-green .point-color *, .color-yellowgreen .point-color *{
  color: #4B9A2E !important;
}
.color-orange .point-color, .color-orangered .point-color,
.color-orange .point-color *, .color-orangered .point-color *{
  color: #D87500 !important;
}
/* dropdown menu */
.dropdown-menu{
  width: 186px; height: auto; padding: 0; border: 1px solid #D8D8D8; position: absolute;
  overflow-x: hidden; overflow-y: auto; z-index: 3; background-color: #FFF;
}
.dropdown-menu label{
  width: 160px; height: 12px; padding: 7px 13px; display: block; border-bottom: 1px dotted #CECECE; _border-bottom: 1px solid #EEE;
  position: relative; line-height: 12px !important; overflow: hidden; background-color: #FFF; cursor: pointer;
  font-weight: normal; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis;
}
.dropdown-menu label:last-child{
  border-bottom: 0;
}
.dropdown-menu label:hover,
.dropdown-menu label.current,
.dropdown-menu label.mouseon{
  background-color: #EFEFEF;
}
.dropdown-menu label.disable{
  background-color: #E6E6E6 !important; color: #989898 !important;
}
.dropdown-menu label span{
  height: 12px !important; line-height: 12px !important;
}
.dropdown-menu label input{
  vertical-align: center; position: absolute; left: -99px; top: -99px;
}
.dropdown-menu .error{
  display: block; padding: 30px; line-height: 18px;
}
/* alert message */
.alert-message{
  min-width: 49px; max-width: 205px; _width: 205px; _height: 1%; padding: 11px 10px; border: 1px solid #FDC437; border-radius: 5px;
  position: absolute; line-height: 14px !important; word-break: keep-all; word-wrap: break-word;
  display: block; box-shadow: 0 0 2px #FDC437; color: #592C0F; background-color: #FFE7AB; cursor: pointer;
  opacity: .3;
  transition: margin-top .25s, opacity .25s;
}

.alert-message-top-appended,
.alert-message-bottom-appended{
  opacity: 1;
}

.alert-message-top-removed,
.alert-message-bottom-removed{
  opacity: 0;
}

.alert-message-bottom-removed,
.alert-message-bottom-appended{
  margin-top: 4px;
}

.alert-message-top-removed,
.alert-message-top-appended{
  margin-top: -4px;
}


/*
.alert-message:hover{
  opacity: .8;
}
*/

.alert-message-top:before, .alert-message-top:after, .alert-message-top .before, .alert-message-top .after,
.alert-message-bottom:before, .alert-message-bottom:after, .alert-message-bottom .before, .alert-message-bottom .after{
  width:0; height:0; content: ""; display: block; position: absolute; left: 28px; line-height: 0; font-size: 0; overflow: hidden;
  border-color: transparent; _border-color: #FDC436; border-style: outset; _border-style: solid;
  _filter: chroma(color=#FDC436);
}

.alert-message-top:before, .alert-message-top:after,
.alert-message-top .before, .alert-message-top .after{
  border-width: 9px 9px 0;
  border-top-style: solid;
}

.alert-message-top:before, .alert-message-top .before{
  border-top-color: #FDC437; bottom: -9px; _bottom: -10px;
}

.alert-message-top:after, .alert-message-top .after{
  border-top-color: #FFE7AB; bottom: -7px; _bottom: -8px;
}

.alert-message-bottom:before, .alert-message-bottom:after,
.alert-message-bottom .before, .alert-message-bottom .after{
  border-width: 0 9px 9px;
  border-bottom-style: solid;
}

.alert-message-bottom:before, .alert-message-bottom .before{
  border-bottom-color: #FDC437; top: -9px; _top: -10px;
}

.alert-message-bottom:after, .alert-message-bottom .after{
  border-bottom-color: #FFE7AB; top: -7px; _top: -8px;
}



/* top alert */
#relay-top{
  width: 100%; padding: 0 !important; position: fixed; _position: absolute; top: -31px; left: 0; z-index: 10;
}
#top-notify-bar{
  width: 100%; height: 30px; padding: 0 !important; border-bottom: 1px solid #E4E4E4;
  overflow: hidden; background-color: #FFFffa; color: #656565;
}
#top-notify-bar b{
  font-weight: bold;
}
#top-notify-bar *{
  background-color: #FFFffa !important;
}
#top-notify-bar .relay-layout{
  width: 822px; margin: 0 auto; position:relative; float:none; overflow:visible; *zoom:1;
}
#top-notify-bar .relay-layout:after{
  content:"";display:block; clear:both; height:0; visibility:hidden;
}
#browser-info-wrap,
#notify-close-wrap{
  height: 29px; display: inline;
}
#top-notify-bar div{
  height: 29px; line-height: 30px !important; position: absolute; top: 0;
}
#browser-info-wrap{
  padding-left: 15px;
}
#notify-close-wrap{
  right: 6px;
}
#top-notify-bar p{
  display: inline;
}
#top-notify-bar a{
  margin: 0 10px; text-decoration: none; color: #107EFD;
}
#top-notify-bar a:hover{
  color: #E44;
}
#top-notify-bar .check-wrap{
  vertical-align: middle;
}
#notify-bar-close{
  width: 19px; height: 19px; margin: 0 0 0 10px !important; display: inline-block; text-indent: -999px;
  overflow: hidden; vertical-align: middle; background-color: #FFF; background-position: 0 -240px;
}

/* popup */
.popup-wrap{
  width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1020;
}
.popup-wrap .overlay{
  width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1021;
  background-color: #FFF; opacity: 0.6; filter: alpha(opacity=60);
}
noscript .popup-wrap .overlay, .noscript-overlay{
  opacity: 0.6 !important; filter: alpha(opacity=60) !important;
}
.popup-wrap .popup{
  width: 700px; min-height: 10px;
  margin: 0 0 0 -352px; border: 2px solid #CBCBCB; border-radius: 6px; box-shadow: 0 8px 16px #CBCBCB;
  position: fixed; left: 50%; top: 60px; *position: relative; *left: 0; *margin: 60px auto;
  background-color: #FFF; z-index: 1022; overflow: hidden;
}
.popup-contents{
  position: relative;
}
.popup-wrap .popup-close{
  width: 15px; height: 15px; display: block; position: absolute; top: 13px; right: 20px;
  background-position: 0 -280px; overflow: hidden; text-indent: 99px; z-index: 1023;
}
.popup-wrap .header{
  height: 15px;  padding: 14px 20px 12px; border-bottom: 1px solid #EFEFEF;  border-radius: 6px 6px 0 0;
  position: relative;  line-height: 15px; font-size: 15px; color: #000; background-color: #F7F7F7;
}
.popup-wrap .body{
  min-height: 200px; max-height: 540px; padding: 12px 20px; border-radius: 0 0 6px 6px;
  position: relative; line-height: 1.6; overflow: auto; background-color: #FFF; color: #656565;
}
.popup-wrap  .body p{margin-bottom: 4px;}
.popup-wrap .popup .body .help-image {margin-top: 30px; text-align: center;}
.popup-wrap .popup .program ol {padding: 0 20px; list-style: decimal;}
.popup-wrap .popup .help-description-button {margin-top: 30px; text-align: center;}
.popup-wrap .popup .program .help-description {float: none; overflow: visible; *zoom: 1;}
.popup-wrap .popup .program .help-description:after {content: ""; display: block; clear: both; height: 0; visibility: hidden;}
.popup-wrap .popup .program .help-image {float: left; padding: 0 15px; margin-top: 20px; font-weight: bold; position:relative;}
.popup-wrap .popup .program .help-image img {margin-top: 5px;}
.popup-wrap .program-infomation{padding-top: 10px; clear: both;}

/* balloon notification */
.balloon-notification{
  width: 370px; height: auto; padding: 16px; border: 2px solid #CBCBCB; border-radius: 6px; position: absolute; z-index: 12;
  line-height: 14px !important; word-break: keep-all; word-wrap: break-word; background-color: #F6F6F6; box-shadow: 0 0 1px #CBCBCB; color: #592C0F;
}
.balloon-notification:before, .balloon-notification .before,
.balloon-notification:after , .balloon-notification .after{
  width:0; height:0; content: ""; display: block; position: absolute; line-height: 0; font-size: 0; overflow: hidden;
  border-style: outset; _border-style: solid; border-color: transparent; display: none; z-index: 13;
  _border-color: #FDC436; _filter: chroma(color=#FDC436);
}
.balloon-notification.click-to-close{
  cursor: pointer;
}
.balloon-notification.direction-up:before, .balloon-notification.direction-up .before,
.balloon-notification.direction-up:after, .balloon-notification.direction-up .after{
  display: block; left: 50%; margin-left: -14px;
  border-width: 10px 10px 0; border-top-style: solid;
}
.balloon-notification.direction-up:before, .balloon-notification.direction-up .before{
  border-top-color: #CBCBCB; bottom: -10px;
}
.balloon-notification.direction-up:after, .balloon-notification.direction-up .after{
  border-top-color: #F6F6F6; bottom: -7px;
}
.balloon-notification.direction-down:before, .balloon-notification.direction-down .before,
.balloon-notification.direction-down:after, .balloon-notification.direction-down .after{
  display: block; left: 50%; margin-left: -14px;
  border-width: 0 10px 10px; border-bottom-style: solid;
}
.balloon-notification.direction-down:before, .balloon-notification.direction-down .before{
  border-bottom-color: #CBCBCB; top: -10px;
}
.balloon-notification.direction-down:after, .balloon-notification.direction-down .after{
  border-bottom-color: #F6F6F6; top: -7px;
}
.balloon-notification.direction-left:before, .balloon-notification.direction-left .before,
.balloon-notification.direction-left:after, .balloon-notification.direction-left .after{
  display: block; top: 50%; margin-top: -14px;
  border-width: 10px 0 10px 10px; border-left-style: solid;
}
.balloon-notification.direction-left:before, .balloon-notification.direction-left .before{
  border-left-color: #CBCBCB; right: -10px;
}
.balloon-notification.direction-left:after, .balloon-notification.direction-left .after{
  border-left-color: #F6F6F6; right: -7px;
}
.balloon-notification.direction-right:before, .balloon-notification.direction-right .before,
.balloon-notification.direction-right:after, .balloon-notification.direction-right .after{
  display: block; top: 50%; margin-top: -14px;
  border-width: 10px 10px 10px 0; border-right-style: solid;
}
.balloon-notification.direction-right:before, .balloon-notification.direction-right .before{
  border-right-color: #CBCBCB; left: -10px;
}
.balloon-notification.direction-right:after, .balloon-notification.direction-right .after{
  border-right-color: #F6F6F6; left: -7px;
}
.balloon-notification.download-guide{
    overflow:hidden; width:526px; border:1px solid #2995fa; box-sizing:border-box; background:#fff;
    border-radius:3px; box-shadow:0 0 20px rgba(0,0,0,0.2);
}
.balloon-notification.download-guide.direction-up{ padding:24px 40px 45px 30px; }
.balloon-notification.download-guide.direction-down{ padding:34px 70px 34px 30px; }

.balloon-notification.download-guide.chrome-guide,
.balloon-notification.download-guide.firefox-guide,
.balloon-notification.download-guide.safari-guide,
.balloon-notification.download-guide.opera-guide,
.balloon-notification.download-guide.internetexplorer-guide{
  position:fixed;
}
.balloon-notification.download-guide.chrome-guide{ bottom: 20px; left: 20px; }
.balloon-notification.download-guide.firefox-guide{ top: 20px; right: 20px; }
.balloon-notification.download-guide.safari-guide{ line-height:0; top: 20px; right: 20px; }
.balloon-notification.download-guide.opera-guide{ top: 100px; right: 20px; }
.balloon-notification.download-guide.internetexplorer-guide{ bottom:100px; left:50%; margin-left:-313px; }
.balloon-notification.download-guide:before, .balloon-notification.download-guide .before{ display:none; }
.balloon-notification.download-guide.direction-up:after, .balloon-notification.direction-up.download-guide .after,
.balloon-notification.download-guide.direction-down:after, .balloon-notification.direction-down.download-guide .after {
    width:45px; height:45px; border:none;
}
.balloon-notification.download-guide.direction-up:after,
.balloon-notification.direction-up.download-guide .after{
    background-image: url(../images/relay/down_motion_bottom.gif);
    background-repeat:no-repeat;
    background-position:left center;
    bottom:0; left:43px;
}
.balloon-notification.download-guide.direction-down:after,
.balloon-notification.direction-down.download-guide .after{
    background-image: url(../images/relay/down_motion_up.gif);
    background-repeat:no-repeat;
    background-position:right center;
    top:0; right:20px; left:auto;
}

.balloon-notification.download-guide .download-alert{
    padding:0; padding-top:13px; display:block; float:left; overflow:hidden;
    width:384px; max-height:52px; font-family:"Nanum Gothic"; font-size:18px; line-height:26px; color:#333;
}
.balloon-notification.download-guide.firefox-guide .download-alert,
.balloon-notification.download-guide.opera-guide .download-alert{
  padding-top:0; width:353px;
}
.balloon-notification.download-guide.safari-guide .download-alert {
  padding-top:0; width:268px;
}
.balloon-notification.download-guide .before,
.balloon-notification.download-guide:before{
  position:static; content:''; display:block; float:left; margin:0; margin-right:20px; border:0; width:50px; height:50px;
  background-image: url(../images/relay/exe_icon.png);  background-repeat:no-repeat;  background-position:center;
}
.balloon-notification .program-info{
  padding: 0 0 5px;
}
.balloon-notification .program-info h4{
  padding: 0 0 3px 0;
}
.balloon-notification .program-info ul{
  padding: 3px 0;
}
.balloon-notification .program-info li{
  line-height: 16px; padding-bottom: 4px;
}
.balloon-notification .file-download-wrap{
  padding: 7px 0 0; border-top: 1px solid #DBDBDB; position:relative; float:none; overflow:visible; *zoom:1; margin-bottom: -10px;
}
.balloon-notification p{
  line-height: 16px; padding-bottom: 4px; word-break: keep-all;
  word-wrap: break-word; line-height: 1.5;
}
.balloon-notification .file-download-wrap:after{
  content:"";display:block; clear:both; height:0; visibility:hidden;
}

.balloon-notification .download-button-wrap{
  padding: 4px 0 0; text-align: right;
}
.download-button, .download-button span{
  margin:0; padding:0; border:0; display:inline-block;
  text-decoration:none !important; font-size:12px; white-space:nowrap; font-family:inherit !important;
  vertical-align:top; overflow:visible; cursor:pointer; background-color: transparent !important;
}
.download-button{
  height: 36px; padding-right:14px; margin-right: 3px; background-position: 0 -420px; position: relative;
}
.download-button.disable-button{
  opacity: 0.5; filter: alpha(opacity=50);
}
.download-button span{
  height: 24px; padding: 7px 32px 5px 0; left:17px; position:relative;
  line-height: 24px; color: #333; background-position: right -420px;
}
.download-button:hover, .download-button.hover{
  background-position: 0 -460px !important;
}
.download-button:hover span, .download-button.hover span{
  background-position: right -460px !important;
}
.balloon-overlay{
  width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 11;
  background-color: #000; opacity: 0.33; filter: alpha(opacity=33);
}
#iframe{
  width: 2px; height: 2px; border: 0; background: transparent; position: absolute; top: -9px; left: -9px;
}
.download-progress{
  height: 10px; border: 1px solid #D6D6D6; border-radius: 3px; overflow:hidden; font-size: 1px; line-height: 1;
  background-color:#fff;
  background-image:url(../images/relay/progress.png);
  background-repeat:repeat-x;
  background-position:0;
}
/* basic show/hidden objs */
#relay-step-start,.current-step{
  display: block;
}
#counter-pending{
  display: none;
}

/* **************** *
 * legal notice
 * **************** */
#legal-notice-wrap { }
#legal-notice { width: 600px; margin-left: -302px; *left: 0; *margin: 10px auto; top: 10px; }
#legal-locale-list {
  height: 24px; width: auto; padding: 2px !important;
  position: absolute; z-index: 21; right: 20px; top: 10px; cursor: pointer;
}
#legal-body,#legal-title { width: auto; }
#legal-contents { height: 440px; position: relative; }
.legal-content-wrap{ padding-bottom: 10px; background-color: #fff; position: relative; }
.legal-content-wrap h3{ height: 28px; line-height: 28px; font-size: 13px; }
.legal-content{
  width: 550px; padding: 0 !important; margin: 0 !important; border: 5px solid #333;
  display: block; overflow: hidden; overflow-y: scroll; color: #fff; font-size: 14px;
  background-color: #333; /*white-space: pre-wrap;*/ word-wrap: break-word; line-height: 1.6; resize: none;
}
.rtl-contents{ direction: rtl; }
.legal-content a{ color: #ff4; border-bottom: 1px solid #ff4; text-decoration: none; }
textarea.legal-content:focus{ border-color: #333 !important; }
.legal-check{ position: absolute !important; top: 0; right: 5px; }
#legal-buttons{ text-align: center; }
.legal-button, .legal-button *{
  height: 32px; margin: 0; padding: 0; border: 0; display: inline-block; overflow:visible; _overflow-y: hidden;
  text-decoration:none !important; white-space:nowrap; font-family:inherit !important;
  vertical-align:top; background-color: transparent !important; background-repeat: no-repeat;
  line-height: 32px; _line-height: 35px; font-size: 14px; background-position: 0 -210px;
}
.legal-button, .legal-button span,
.color-blue .legal-button, .color-blue .legal-button span,
.color-skyblue .legal-button, .color-skyblue .legal-button span,
.color-blue .download-button, .color-blue .download-button span{background-image: url(/public/images/relay/buttons-blue.png);}
.color-brown .legal-button, .color-brown .legal-button *{background-image: url(/public/images/relay/buttons-brown.png);}
.color-red .legal-button, .color-red .legal-button span,
.color-darkred .legal-button, .color-darkred .legal-button span{background-image: url(/public/images/relay/buttons-red.png);}
.color-green .legal-button, .color-green .legal-button span{background-image: url(/public/images/relay/buttons-green.png);}
.color-yellowgreen .legal-button, .color-yellowgreen .legal-button span{background-image: url(/public/images/relay/buttons-yellowgreen.png);}
.color-orange .legal-button, .color-orange .legal-button span{background-image: url(/public/images/relay/buttons-orange.png);}
.color-orangered .legal-button, .color-orangered .legal-button span{background-image: url(/public/images/relay/buttons-orangered.png);}
.legal-button{ margin-right: 31px; margin-left: 6px; position: relative; }
.legal-button span{ left:25px; position:relative; background-position: right -210px; }
.legal-button button{ padding:0;margin:0;border:0;background-color:transparent;overflow:visible;cursor:pointer; }
.legal-button button{
  margin-right: -17px; padding: 0 17px;position: relative; left: -17px;
  background: transparent !important; cursor:pointer; color: #888; font-weight: bold;
  margin-right: -25px; padding: 0 25px; top: 0 !important; left: -25px; background: transparent !important;
}
.legal-button:hover{background-position: 0 -245px;}
.legal-button:hover span{color: #666; background-position: right -245px;}
.legal-agree-button{ background-position: 0 -350px; }
.legal-agree-button span{ background-position: right -350px; }
.legal-agree-button:hover{ background-position: 0 -385px; }
.legal-agree-button:hover span{ background-position: right -385px; }
.legal-agree-button *{ color: #FFF !important; }
.disabled-button{ background-position: 0 -70px !important; }
.disabled-button span{ background-position: right -70px !important; }
.disabled-button button{ cursor: default !important; }
.disabled-button:hover{ background-position: 0 -70px !important; }
.disabled-button:hover span{ background-position: right -70px !important; }
.disabled-button *{ color: #bbb !important; }

/*
 * counter agreement popup
 * */
#counter-agreement{
  display: none;
}
.counter-agreement-wrap{
  margin-bottom: 10px;
}
.counter-agreement-contents{
  height: 96px;
  padding: 8px;
  border: 1px solid #d9d9d9;
  overflow-x: hidden;
  overflow-y: scroll;
  background-color: #fafafa;
}
.counter-agreement-contents h5{
  margin: 24px 0 4px;
}
.counter-agreement-contents h5:first-child{
  margin-top: 0;
}

.counter-agreement-contents p{
  line-height: 1.4;
  margin-bottom: 10px !important;
}
#counter-agreement-buttons{
  text-align: center;
  padding: 0;
}

#counter-agreement-buttons .button{
  margin-left: 4px;
}

#counter-agree {
  background-position: 0 -280px !important;
}
#counter-agree span{
  background-position: right -280px !important;
}
#counter-agree:hover{
  background-position: 0 -315px !important;
}
#counter-agree:hover span{
  background-position: right -315px !important;
}
#counter-agree *{
  color: #fff !important;
}
#counter-disagree {
  background-position: 0 -140px !important;
}
#counter-disagree span{
  background-position: right -140px !important;
}
#counter-disagree *{
  color: #fff !important;
}
#counter-disagree:hover{
  background-position: 0 -175px !important;
}
#counter-disagree:hover span{
  background-position: right -175px !important;
}
#counter-disagree *{
  color: #888 !important;
}
/* **********************************************************
 * jQuery UI CSS Framework 1.8.16
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 * http://docs.jquery.com/UI/Theming/API
 */
/* Layout helpers
---------------------------------- */
.ui-helper-hidden{display:none;}
.ui-helper-hidden-accessible{position:absolute !important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px);}
.ui-helper-reset{margin:0;padding:0;border:0;outline:0;line-height:1.3;text-decoration:none;font-size:100%;list-style:none;}
.ui-helper-clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.ui-helper-clearfix{display:inline-block;}
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix{height:1%;}
.ui-helper-clearfix{display:block;}
/* end clearfix */
.ui-helper-zfix{width:100%;height:100%;top:0;left:0;position:absolute;opacity:0;filter:Alpha(Opacity=0);}
/* Interaction Cues
----------------------------------*/
.ui-state-disabled{cursor:default !important;opacity:0.5;filter:alpha(opacity=50);}
.ui-state-disabled .ui-state-default{background-color:#EEE !important;color:#AAA !important;}
/* Component containers
----------------------------------*/
.ui-widget{font-family:Verdana,Tahoma,Arial,sans-serif;}
.ui-widget .ui-widget{font-size:1em;}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{font-family:Verdana,Tahoma,Arial,sans-serif;font-size:1em;}
.ui-widget-content{border:1px solid #D8D8D8;background:#FFF;color:#333;}
.ui-widget-content a{color:#333333;}
.ui-widget-header{border-bottom:1px solid #CDCDCD;background:#FFF;color:#474747;font-weight:bold;}
.ui-widget-header a{color:#FFF;}
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{}
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited{color:#1c94c4;text-decoration:none;}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover,
.ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus{color:#494949;}
.ui-state-hover a, .ui-state-hover a:hover{color:#c77405;text-decoration:none;}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{
  width:19px;height:13px;border:1px solid #FF4108;background:#FFEEE4;font-weight:bold;color:#F22;}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited{color:#eb8f00;text-decoration:none;}
.ui-widget :active{outline:none;}
/* Icons
----------------------------------*/
.ui-icon{display:block;text-indent:-99999px;overflow:hidden;background-repeat:no-repeat;}
.ui-widget-header .ui-icon{width:13px;height:13px;}
.ui-datepicker-prev .ui-icon{background-position:0 -160px;}
.ui-datepicker-next .ui-icon{background-position:0 -200px;}
/*
 * jQuery UI Datepicker 1.8.16
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 * http://docs.jquery.com/UI/Datepicker#theming
 */
.ui-datepicker{width:182px;padding:3px 1px 3px 3px;display:none;font-size:10px;/*box-shadow:2px 2px 5px #e5e5e5 !important;*/}
.ui-datepicker .ui-datepicker-header{width:180px;height:25px;position:relative;padding:0;margin-bottom:3px;}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{position:absolute;top:3px;width:17px;height:17px;cursor:pointer;}
.ui-datepicker .ui-datepicker-prev{left:3px;}
.ui-datepicker .ui-datepicker-next{right:3px;}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span{
  display:block;position:absolute;left:50%;margin-left:-7px;top:50%;margin-top:-7px;}
.ui-datepicker .ui-datepicker-title{margin:0 25px;line-height:21px;text-align:center;font-size:11px;}
.ui-datepicker .ui-datepicker-title select{font-size:1em;margin:1px 0;}
.ui-datepicker select.ui-datepicker-month-year{width:100%;}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year{width:49%;}
.ui-datepicker table{width:100%;font-size:10px;border-collapse:collapse;margin:0;}
.ui-datepicker th{padding:3px 0;text-align:center;font-weight:bold;border:0; font-size: 11px;}
.ui-datepicker td{border:0;padding:1px 0;}
.ui-datepicker td span, .ui-datepicker td a{display:block;width:20px;height:14px;padding:0 3px 3px 0;text-align:right;text-decoration:none !important;
  border-color:#DFDFDF;border-style:solid;border-width:1px 1px 0 0;background:#FFF;color:#545454;font-size:10px;}
.ui-datepicker td .ui-state-hover{background-color:#f4f4f4;}
.ui-datepicker-today span, .ui-datepicker-today a{background-color:#FFF3f3;}
.ui-datepicker .ui-datepicker-buttonpane{background-image:none;margin:.7em 0 0 0;padding:0 .2em;border-left:0;border-right:0;border-bottom:0;}
.ui-datepicker .ui-datepicker-buttonpane button{float:right;margin:.5em .2em .4em;cursor:pointer;padding:.2em .6em .3em .6em;width:auto;overflow:visible;}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{float:left;}
/* td.ui-datepicker-week-end span, td.ui-datepicker-week-end a{background-color:#fef2f2;} */
.ui-datepicker-week-end{color:#d33 !important;}
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi{width:auto;}
.ui-datepicker-multi .ui-datepicker-group{float:left;}
.ui-datepicker-multi .ui-datepicker-group table{width:95%;margin:0 auto .4em;}
.ui-datepicker-multi-2 .ui-datepicker-group{width:50%;}
.ui-datepicker-multi-3 .ui-datepicker-group{width:33.3%;}
.ui-datepicker-multi-4 .ui-datepicker-group{width:25%;}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header{border-left-width:0;}
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header{border-left-width:0;}
.ui-datepicker-multi .ui-datepicker-buttonpane{clear:left;}
.ui-datepicker-row-break{clear:both;width:100%;font-size:0em;}
/* RTL support */
.ui-datepicker-rtl{direction:rtl;}
.ui-datepicker-rtl .ui-datepicker-prev{right:2px;left:auto;}
.ui-datepicker-rtl .ui-datepicker-next{left:2px;right:auto;}
.ui-datepicker-rtl .ui-datepicker-prev:hover{right:1px;left:auto;}
.ui-datepicker-rtl .ui-datepicker-next:hover{left:1px;right:auto;}
.ui-datepicker-rtl .ui-datepicker-buttonpane{clear:right;}
.ui-datepicker-rtl .ui-datepicker-buttonpane button{float:left;}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current{float:right;}
.ui-datepicker-rtl .ui-datepicker-group{float:right;}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header{border-right-width:0;border-left-width:1px;}
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header{border-right-width:0;border-left-width:1px;}
/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-datepicker-cover{
  display:none;/*sorry for IE5*/
  display/**/:block;/*sorry for IE5*/
  position:absolute;/*must have*/
  z-index:-1;/*must have*/
  filter:mask();/*must have*/
  top:-4px;/*must have*/
  left:-4px;/*must have*/
  width:200px;/*must have*/
  height:200px;/*must have*/
}
.date-picker{ width: 166px; background-position: right -77px; cursor: pointer;}

#relay-footer a { color: #C0C0C0; text-decoration: none; }
