@charset "euc-kr";

/*Basic*/
* { -webkit-text-size-adjust: none; }
body { height: 100%; margin: 0; padding: 0; background: #e6e6e6; }
div, table, ul, ol, li, dl, dt, dd, p, input, textarea, select, img, h1, h2, h3, h4, em, address, fieldset, form, iframe, object { margin: 0; padding: 0; vertical-align: top; } 
ul, ol { list-style: none; }
fieldset, img { border: none; }
a { text-decoration: none; }
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration: underline; }


/*Color*/
.color00 .function button { background: #5077b6; }
.color01 .function button { background: #1380ad; }
.color02 .function button { background: #cf4747; }
.color03 .function button { background: #9266a1; }
.color04 .function button { background: #716fb6; }
.color05 .function button { background: #37855a; }
.color06 .function button { background: #6c7d42; }
.color07 .function button { background: #a9672e; }
.color08 .function button { background: #99594b; }
.color09 .function button { background: #6c7680; }
.color10 .function button { background: #5d666e; }


/*Elements*/
.wrap { width: 100%; min-width: 300px; color: #595959; }


.table { display: block; }
.table > .row { display: table; width: 100%; }
.table > .row > .cell { display: table-cell; }
.term { width: 5px; display: inline-block; }
.term2 { width: 7px; display: inline-block; }
.helper { font-size: 10px; color: #595959; margin: none; }
.w30 { width: 30%; }

.header { width: 100%; height: 40px; background: #fff; border-bottom: 2px solid #b2b2b2; }
.header > li { line-height: 42px; }
.header > li.logo { float: left; height: 26px; margin: 7px 0 0 10px; }
.header > li.logo > img { max-height: 30px; }
.header > li.title { float: left; font-size: 14px; margin-left: 9px; }
.header > li.btn_close { float: right; width: 24px; height: 24px; text-indent: -9999px; margin: 7px 10px 0 0; background: url(/resources/images/common_btn_close_nor.gif) no-repeat; background-size: 24px 24px; cursor: pointer; }


.box_style01 { width: 100%; display: inline-block; zoom: 1; *display: inline; }
.box_style01 > li { height: 60px; border: 2px solid #ccc; margin: 10px 10px 0 10px; background: #fff; cursor: pointer; }
.box_style01 > li { border: 2px solid #d9d9d9; }
.box_style01 > li > span { position: relative; display: inline-block; zoom: 1; *display: inline; }
.box_style01 > li > .logo { float: left; text-indent: -9999px; margin-left: 25px; }
.box_style01 > li > .name { float: right; top: 21px; width: 55px; height: 18px; font-size: 11px; color: #fff; text-align: center; line-height: 20px; border-radius: 20px; }
.box_style01 > li > .icon_arrow { float: right; top: 24px; width: 7px; height: 13px; text-indent: -9999px; background: url(/resources/images/icon_arrow.gif) no-repeat; background-size: 7px 13px; margin: 0 15px; }
.box_style01 > li.disabled > .icon_arrow { background: url(/resources/images/icon_arrow_dis.gif) no-repeat; background-size: 7px 13px; }

.box_style01 > li.skt { border-left: 4px solid #eb870e; }
.box_style01 > li.skt > .logo { top: 10px; width: 75px; height: 30px; background: url(/resources/images/common_logo_skt.gif) no-repeat; background-size: 75px 30px; }
.box_style01 > li.skt > .name { background: #eb870e; }
.box_style01 > li.skt.disabled { border-left: 4px solid #d9d9d9; background: #fcfcfc; }
.box_style01 > li.skt.disabled > .logo { background: url(/resources/images/common_logo_skt_dis.gif) no-repeat; background-size: 75px 30px; }
.box_style01 > li.skt.disabled > .name, .box_style01 > li.kt.disabled > .name, .box_style01 > li.lguplus.disabled > .name, .box_style01 > li.mvno.disabled > .name { background: #d9d9d9; }

.box_style01 > li.kt { border-left: 4px solid #eb575c; }
.box_style01 > li.kt > .logo { top: 18px; width: 66px; height: 20px; background: url(/resources/images/common_logo_kt.gif) no-repeat; background-size: 66px 20px; }
.box_style01 > li.kt > .name { background: #eb575c; }
.box_style01 > li.kt.disabled { border-left: 4px solid #d9d9d9; background: #fcfcfc; }
.box_style01 > li.kt.disabled > .logo { background: url(/resources/images/common_logo_kt_dis.gif) no-repeat; background-size: 66px 20px; }

.box_style01 > li.lguplus { border-left: 4px solid #eb67b4; }
.box_style01 > li.lguplus > .logo { top: 20px; width: 73px; height: 20px; background: url(/resources/images/common_logo_lguplus.gif) no-repeat; background-size: 73px 20px; }
.box_style01 > li.lguplus > .name { background: #eb67b4; }
.box_style01 > li.lguplus.disabled { border-left: 4px solid #d9d9d9; background: #fcfcfc; }
.box_style01 > li.lguplus.disabled > .logo { background: url(/resources/images/common_logo_lguplus_dis.gif) no-repeat; background-size: 73px 20px; }

.box_style01 > li.mvno { border-left: 4px solid #3b95cc; }
.box_style01 > li.mvno > .logo { top: 9px; width: 63px; height: 36px; background: url(/resources/images/common_logo_mvno.gif) no-repeat; background-size: 63px 36px; }
.box_style01 > li.mvno > .name { background: #3b95cc; }
.box_style01 > li.mvno.disabled { border-left: 4px solid #d9d9d9; background: #fcfcfc; }
.box_style01 > li.mvno.disabled > .logo { background: url(/resources/images/common_logo_mvno_dis.gif) no-repeat; background-size: 63px 36px; }

.box_style02 { width: 100%; display: inline-block; zoom: 1; *display: inline; }
.box_style02 > li { color: #b3b3b3; border: 2px solid #d9d9d9; border-left: 4px solid #d9d9d9; margin: 10px 10px 0 10px; background: #f5f5f5; }
.box_style02 > li.select { color: #595959; background: #fff; border: 2px solid #ccc; }
.box_style02 > li > span { display: inline-block; }
.box_style02 > li > span > p { float: left; width: 67px; font-size: 12px; text-align: center; line-height: auto; display: inline-block; zoom: 1; *display: inline; }
.box_style02 > li > span > p > input {  margin-bottom: 5px; }
.box_style02 > li > span > p > label { }
.box_style02 > li > span > ul { float: left; padding: 5px 10px; border-left: 1px solid #e6e6e6; display: inline-block; zoom: 1; *display: inline;  }
.box_style02 > li > span > ul > li { font-size: 10px; }
.box_style02 > li.skt_mvno.select { border-left: 4px solid #eb870e; }
.box_style02 > li.skt_mvno > span > p { padding-top: 30px; }
.box_style02 > li.kt_mvno.select { border-left: 4px solid #eb575c; }
.box_style02 > li.kt_mvno > span > p { padding-top: 5px; }
.box_style02 > li.lguplus_mvno.select { border-left: 4px solid #eb67b4; }
.box_style02 > li.lguplus_mvno > span > p { padding-top: 20px; }

.box_style03 { width: 100%; background: #fff; font-size: 0; border-top: 1px solid #b2b2b2; border-bottom: 1px solid #b2b2b2; margin-top: 10px; padding: 50px 0 50px 0; display: inline-block; zoom: 1; *display: inline;}
.box_style03 > li { font-size: 12px; text-align: center; margin: 5px 20px; }

.list_terms { width: 100%; min-height: 135px; background: #fafafa; border-top: 1px solid #b2b2b2; border-bottom: 1px solid #b2b2b2; padding: 10px 0 0 0; margin-top: 10px; display: inline-block; zoom: 1; *display: inline; }
.list_terms > li { width: 100%; line-height: 24px; display: inline-block; zoom: 1; *display: inline; }
.list_terms > li > span { margin: 0 10px; display: block; }
.list_terms > li > span > input { float: left; position: relative; top: 3px; vertical-align: top; line-height: 23px; margin-top: 2px; }
/* saf3+, chrome1+ */
@media screen and (-webkit-min-device-pixel-ratio:0) {
.list_terms > li > span > input { margin-top: 1px; }
}
.list_terms > li > span > label { float: left; color: #595959; font-size: 12px; margin-left: 5px; vertical-align: top; line-height: 23px; }
.list_terms > li > span > span { float: right; color: #999; font-size: 11px; cursor: pointer; vertical-align: top; line-height: 23px; }
.list_terms > li > span > span.close { color: #666; font-weight: bold; }
.list_terms > li.dotline { border-top: 1px dashed #bfbfbf; margin: 7px 0 9px 0; }
.list_terms > li.agreeall { background: #fff; border-top: 1px solid #e6e6e6; margin-top: 5px; padding: 6px 0; }

.list_terms > li.terms_view { color: #666; background: #ededed; border-top: 1px solid #b2b2b2; border-bottom: 1px solid #b2b2b2; margin: 5px 0; }
.list_terms > li.terms_view > .particulars { font-size: 11px; line-height: 14px; }
.list_terms > li.terms_view > .particulars > .partition {  padding: 15px 10px; }
.list_terms > li.terms_view > .controller { text-align: center; border-top: 1px solid #d6d6d6; }
.list_terms > li.terms_view > .controller > button { float: left; width: 50%; height: 37px; line-height: 37px; font-size: 11px; font-weight: bold; color: #666; text-align: center; vertical-align: top; background: #f2f2f2; padding: 0; border: none; border-top: 2px solid #fcfcfc; border-left: 2px solid #fcfcfc; border-bottom: 1px solid #f2f2f2; cursor: pointer; }
.list_terms > li.terms_view > .controller > .previous { border-right: 2px solid #d6d6d6; }
.list_terms > li.terms_view > .controller > .next {}
.list_terms > li.terms_view > .controller > .disable { color: #bfbfbf; border-top: 2px solid #ededed; border-left: 2px solid #ededed; background: #ededed; }

.list_style01 { width: 100%; background: #fff; font-size: 0; border-top: 1px solid #b2b2b2; border-bottom: 1px solid #b2b2b2; margin-top: 10px; padding: 10px 0 15px 0; display: inline-block; zoom: 1; *display: inline; }
.list_style01 > li { font-size: 12px; margin: 8px 10px 0 10px; }
.list_style01 > li > span > .agency { max-width: 50px; }
.list_style01 > li.agree_check { height: 15px; color: #595959; margin-top: 10px; }
.list_style01 > li.agree_check > input { line-height: 20px; vetical-align: top; margin-right: 5px; display: inline-block; zoom: 1; *display: inline; }
.list_style01 > li.agree_check > label { line-height: 18px; vetical-align: top; display: inline-block; zoom: 1; *display: inline; }
.list_style01 > li > span > .wrap_agency_logo { width: 90px; }
.list_style01 > li > span > span > .agency_logo { float: left; display: inline-block; width: 100%; height: 43px; line-height: 43px; font-size: 0px; color: #fff; background: #fff; border: 1px solid #999; border-right: none; border-radius: 5px 0px 0px 5px; }
.list_style01 > li > span > span > .agency_logo.skt { background: url(/resources/images/common_logo_skt.gif) center #fff no-repeat; background-size: 67px 26px; }
.list_style01 > li > span > span > .agency_logo.kt { background: url(/resources/images/common_logo_kt.gif) center #fff no-repeat; background-size: 67px 20px; }
.list_style01 > li > span > span > .agency_logo.lguplus { background: url(/resources/images/common_logo_lguplus.gif) center #fff no-repeat; background-size: 67px 18px; }
.list_style01 > li > span > span > .mvno_name { float: left; display: block; width: 97%; height: 43px; font-size: 12px; color: #595959; line-height: 43px; padding-left: 3%; background: #fafafa; border: 1px solid #999; border-radius: 0px 5px 5px 0px; }
.list_style01 > li > span > span > .inbtn { display: block; width: 100%; height: 35px; font-size: 12px; color: #fff; text-align: center; line-height: 32px; border: none; border-radius: 5px; cursor: pointer; }
.list_style01 > li > span > span > .inbtn.gray { background: #666; border: 1px solid #666; }
.list_style01 > li > span > span { line-height: 33px; vertical-align: top; }

.additional { margin: 10px 10px 0 10px; }
.additional > li { color: #737373; font-size: 10px; line-height: 12px; }


.function { margin: 10px 10px 0 10px; }
.function button { display: block; width: 100%; height: 40px; font-size: 14px; color: #fff; text-align: center; line-height: 40px; border: none; border-radius: 5px; cursor: pointer; }
.function button.gray { background: #999; }


.customercenter { font-size: 11px; color: #999; text-align: center; margin: 70px 10px 20px 10px; }


/*Textbox Style*/
.textbox_style01 { float: left; display: block; width: 97%; height: 33px; font-size: 12px; color: #595959; line-height: 33px; padding-left: 3%; background: #fafafa; border: 1px solid #999; border-radius: 5px; }
.textbox_style01.hint { color: #bababa; }
.textbox_style02 { float: left; display: block; width: 100%; height: 33px; line-height: 33px; color: #fff; font-weight: bold; text-align: center; vertical-align: top; background: #a6a6a6; border: 1px solid #8c8c8c; border-radius: 5px; }


/*Select Style*/
.select_style01 { float: left; display: block; width: 100%; height: 33px; font-size: 12px; color: #595959; line-height: 33px; padding-left: 7px; background: #fafafa; border: 1px solid #999; border-radius: 5px; }
.select_style01.hint { color: #bababa; }


/*Checkbox Style*/
.checkbox_style01 { display: block; border: 2px solid #999; border-radius: 2px; background: #fff; }


/*Layer popup Style*/
.overthrow { overflow: hidden; -webkit-overflow-scrolling: touch; }

.wrap_layer { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; }
.wrap_layer .layer { position: absolute; left: 20px; right: 20px; text-align: center; font-size: 12px; background: #fff; border: 4px solid #595959; box-shadow: 0px 0px 2px #000; }
.wrap_layer .layer.style01 { top: 90px; }
.wrap_layer .layer.style02 { top: 65px; }
.wrap_layer .layer .layer_header { height: 30px;border-bottom: 1px solid #e6e6e6; background: #595959;}
.wrap_layer .layer .layer_header p { float: left; font-weight: bold; line-height: 30px; color: #fff; padding-left: 10px; display: inline-block; zoom: 1; *display: inline; }
.wrap_layer .layer .layer_header span { float: right; width: 20px; height: 30px; line-height: 30px; color: #fff; font-size: 14px; font-weight: bold; cursor: pointer; display: block; }
.wrap_layer .layer .layer_body { text-align: center; max-height: 150px; overflow-y: auto; }
.wrap_layer .layer.style01 .layer_body { padding: 30px 10px; }
.wrap_layer .layer.style02 .layer_body { padding: 10px; }
.wrap_layer .layer .layer_body.txtleft { text-align: left; }
.wrap_layer .layer .function { margin: 0; border-top: 1px solid #e6e6e6; }
.wrap_layer .layer .function .table { margin: 10px; }
.wrap_layer .layer .function button { display: block; width: 100%; height: 35px; line-height: 35px; font-size: 12px; color: #fff; text-align: center; border: none; border-radius: 5px; cursor: pointer; }
.wrap_layer .layer .function button.gray { background: #999; }


/*°¡·Î¸ðµå*/
@media all and (orientation:landscape) {
.wrap_layer .layer .layer_body {  max-height: 100px; }
}



