@charset "utf-8";

/* size */
.w120{width:120px;}
.w130{width:130px;}
.w140{width:140px;}
.w150{width:150px;}
.w160{width:160px;}
.w170{width:170px;}
.w180{width:180px;}

/* margin */
.mgb5{margin-bottom:5px;}

/* default */
.em{color:#C1272D; font-weight: 600;}
.req{margin-right:4px; color:#C1272D; vertical-align: middle;}
.hyphen{padding:0px 5px;}
strong{font-weight:600;}

.isModal{overflow:hidden;}

/* heading */
h1,h2,h3,h4,h5,h6{font-weight:600;}
h3{font-size:15px; color: #1A1A1A;}
/*.ti3{margin-bottom:15px; font-size:15px; font-weight: bold; color: #1A1A1A;}*/

.tibox{margin-bottom:15px; overflow:hidden;}
.tibox .ti3{display:inline; font-size:15px; font-weight: 600; color: #1A1A1A;}
.tibox .sub{display:inline; font-size:12px; margin-left:10px;}

/* icon */
.icon{display:inline-block; margin-right:5px; vertical-align: middle; background: url("../images/common/sprite_icon.png") 0 0 no-repeat;}
.icon.iconCaution{width:18px; height:15px; background-position: -5px -5px;}
.icon.iconCpn{width:18px; height:12px; background-position: -53px -5px;}
.icon.iconBookmark{width:30px; height:30px; background-position: -5px -57px;}
.icon.iconBookmark.marked{background-position: -183px -57px;}
.icon.iconCopy{width:30px; height:30px; background-position: -40px -57px;}
.icon.iconFacebook{width:30px; height:30px; background-position: -76px -57px;}
.icon.iconTwitter{width:30px; height:30px; background-position: -111px -57px;}
.icon.iconPlus{width:30px; height:30px; background-position: -147px -57px;}
.spico{display:inline-block; vertical-align: middle; background: url("../images/common/sprite_icon2.png") 0 0 no-repeat;}
.spico.ico-chev2-toggle{width:11px; height:11px; background-position: -21px -21px;}
.spico.ico-chev2-left{width:11px; height:11px;  background-position: -37px -21px;}
.spico.ico-chev3-right{}
.spico.ico-new{width:18px; height:18px; background-position: -5px -97px;}
.spico.ico-triangle-down{width:6px; height:6px; background-position: -5px -37px;}
.spico.ico-triangle-up {width: 6px; height: 6px; background-position: -27px -38px;}
/* checkMsg */
.checkMsg{display:inline-block; padding:0px 0px 0px 18px; margin:2px 5px; font-size:14px; min-height:22px; vertical-align: middle;}
.checkMsg.capcharwrong{color:#C1272D; background:url("../images/ico/ico_check_wrong.png") 0px 6px no-repeat;}
.checkMsg.wrong{color:#C1272D; background:url("../images/ico/ico_check_wrong.png") 0px 6px no-repeat;}
.checkMsg.okay{color:#249CFF; background:url("../images/ico/ico_check_okay.png") 0px 6px no-repeat;}
.formGroup .checkMsg.okay,
.formGroup .checkMsg.wrong { display: none; }
.formGroup.validatedSuccess .checkMsg.okay { display: inline-block; *display:inline;}
.formGroup.validatedError .checkMsg.wrong { display: inline-block; *display:inline; }

.inptxt{height:20px; padding:6px 9px 7px;  line-height:20px; vertical-align: middle; font-size:14px; border:1px solid #ddd; /* box-sizing: border-box; *behavior: url(/resources/js/app/boxsizing.htc);*/}
.inpbx{position:relative; display:inline-block;overflow:hidden; min-width:134px; /* *width:134px; */  height:18px; margin:0px 3px; padding:8px 8px 7px; vertical-align:middle; line-height:18px;border:1px solid #ddd;}
.inpbx .placeholder{position:absolute; left:8px; top:8px; z-index:1; cursor:text;}
.inpbx input.txt{position:relative;width:100%;height:17px;border:0 none;font-size:12px;line-height:17px;color:#222;vertical-align:top; }
.inpbx input.focus,.inpbx input:focus{color:#222}
.txtbx{display:inline-block;width:auto;margin:0px 3px; padding:8px 8px 7px;line-height:18px;border:1px solid #ddd;}
.txtbx .txtar{width:100%;border:0 none;background:transparent;font-size:12px;line-height:17px;color:#222;vertical-align:top; resize: none;}
.txtbx.full{display:block;}
.inpbx.disable{background:#eee;}
.inpbx.disable .txt{background: #eee;}

.txtarea{min-height:100px; border:1px solid #ddd; resize: none;}
.txtarea.full{width:94.9999%;}

.inpGrp{}

.btnGroup{text-align:center;}
.btn{display:inline-block; text-indent:-999px; overflow:hidden; border:none; background:none; cursor: pointer;}
*:first-child+html .btn{text-indent:0; line-height:0; font-size:0; overflow:hidden}
.btn.btnNewWindow{vertical-align:middle; width:17px; height:14px; background:url("../images/common/sprite_common.png") -38px 0px no-repeat;}
.btn.btnNewWindow:hover{background-position:-55px 0px;}
.btn.btnCmmt{width:30px; height:30px; background:url("../images/btn/btn_cmmt.png") 0 0 no-repeat;}

.btn.btnSns{width:20px; height:20px; background:url("../images/common/sprite_btn.png") -5px -5px no-repeat;}
.btn.btnBookmark{width:20px; height:20px; background:url("../images/common/sprite_btn.png") -30px -5px no-repeat;}
.btn.btnBookmark.marked{background-position: -55px -5px;}
.btn.btnRefresh{width:53px; height:33px; background:url("../images/common/sprite_btn.png") -5px -30px no-repeat; }
.btn.btnPlus{width:35px; height:35px;  background:url("../images/common/sprite_btn.png") -63px -30px no-repeat; }
.btn.btnMinus{width:35px; height:35px; background:url("../images/common/sprite_btn.png") -103px -30px no-repeat; }

.btntxt{display:inline-block; margin-left:4px; *margin-left:4px; padding:0px 10px;  min-width:60px; height:33px; line-height:31px; vertical-align: middle; text-align:center; font-size:14px; }
button.btntxt{line-height:normal; height:35px;}
.btntxt:first-child {margin-left:0px;}
.btntxt .spico{vertical-align:middle; margin:0px 5px;}
.btntxt.btnWhiteGray{color:#858585; border:1px solid #ccc;}
.btntxt.btnWhite{color:#858585; border:1px solid #ccc; background: #fff;}
.btntxt.btnBlack{color:#fff; border:1px solid #000; background:#000000;}
.btntxt.btnGray{border:1px solid #ccc; color:#666666; background:#F4F4F4;}
.btntxt.btnRed{background:#BF001D; color:#fff;}
.btntxt.btnSkyBlue{color:#fff; border:1px solid #249CFF; background:#249CFF;}
.btntxt.btnRedBrown{color:#fff; border:1px solid #A34545; background:#A34545;}
.btntxt.btnDarkGray{color:#fff; border:1px solid #858585; background: #858585;}

.btntxt.small{padding: 0px 5px; height:28px; line-height:26px; font-size:12px;}
.btntxt.mini{padding:0px 5px; height:18px; line-height:16px; font-size:12px;}

.close {float: right; display:block; width:17px; height:17px; text-indent:-100px; background:url("../images/common/sprite_common.png") -163px 0px;}
.close:hover,
.close:focus {color: #000000; text-decoration: none; cursor: pointer; opacity: 0.4; filter: alpha(opacity=40);}
button.close {padding: 0; cursor: pointer; border: 0; -webkit-appearance: none;}

/* forms */
.checkbox{position:relative; display:inline-block; margin-left:10px;}
.checkbox:first-child{margin-left:0px;}
.checkbox .lbl{position:relative; display:inline-block; min-height:20px; padding-left:30px; line-height:20px; font-size:14px;cursor:pointer;}
.checkbox .lbl *{vertical-align:top;}
.checkbox .lbl .ico{display:inline-block; width:20px; height:20px; margin-left:-30px; margin-right:3px; vertical-align:middle; background:url("../images/common/sprite_form.png") -1px -1px no-repeat;}
.checkbox .inp{position:absolute;top:1px;left:1px;width:5px;height:5px;border:0 none;margin:2px 1px;padding:0;vertical-align:top;z-index:-1; visibility:hidden;}
.checkbox.checked .lbl .ico{background-position:-22px -1px;}
.checkbox.small{}
.checkbox.small .lbl{padding-left:20px; line-height:15px; font-size:13px; cursor:pointer;}
.checkbox.small .lbl .ico{width:16px; height:16px; margin-left:-20px; background:url("../images/common/sprite_form.png") -1px -22px no-repeat;}
.checkbox.small.checked .lbl .ico{background-position:-18px -22px;}

.radiobox{position:relative; display:inline-block; margin-left:10px;}
.radiobox:first-child{margin-left:0px;}
.radiobox .lbl{position:relative; display:inline-block; /*padding-left:30px;*/ line-height:20px; font-size:14px; cursor:pointer;}
.radiobox .lbl *{vertical-align:middle;}
.radiobox .lbl .ico{display:inline-block; width:20px; height:20px; /* margin-left:-30px; */ margin-right:3px; vertical-align:middle; background:url("../images/common/sprite_form.png") -43px -1px no-repeat;}
.radiobox .inp{position:absolute;top:1px;left:1px;width:5px;height:5px;border:0 none;margin:2px 1px;padding:0;vertical-align:top;z-index:-1; visibility:hidden;}
.radiobox.checked .lbl .ico{background-position:-64px -1px;}

.label{position:relative; display:inline-block; padding:4px 5px 5px; font-size:11px; line-height:1;}
.label-blue{background:#29ABE2; color:#fff;}
.label-red{background:#C1272D;color:#fff;}
.label-path{margin-left:10px; padding:2px 5px 3px;  font-size:12px; color:#999999; background:#F4F4F4;}
.label-path .i{position:absolute; top:50%; left:-10px; display:block; width:6px; height:6px; margin-top:-3px; background:url("../images/common/sprite_common.png") -21px -30px no-repeat;}
.label-path:first-child{margin-left:0px;}
.label-path:first-child .i{display:none;}
.label-caution{background:#C1272D;color:#fff;}

/* ui : tab */
.tabA{padding:15px;}
.tabA ul{overflow:hidden;}
.tabA li{float:left; margin-right:15px;}
.tabA li a{display:block; padding:5px 0px 4px; font-size:14px; font-weight: bold; border-bottom:1px solid #fff;}
.tabA .on a{color:#A34545; border-bottom:1px solid #A34545;}

/* ui : dropdown */
.dropdownGroup{display:inline-block; *display:inline; vertical-align: middle;}
.dropdown{position:relative; z-index:1; line-height:normal; display:inline-block; min-width:70px; *display:inline; margin-right:5px; font-size:13px; vertical-align:middle; border:1px solid #ccc; background:#fff; *zoom:1}
/*.dropdown:first-child{margin:0px;}*/
.dropdown a:hover{text-decoration:none;}
.dropdown .box{position:absolute; left:0px; top:33px; display:none; width:100%; max-height:300px; overflow-y:auto; padding:2px 0px; margin-left:-1px; border:1px solid #cccccc; background:#fff;}
.dropdown .box a{display:block; padding:3px 5px 3px 10px; text-align: left; font-size:12px; color:#4D4D4D;}
.dropdown .tg{position:relative; float:left; display:block; width:100%; height:33px; text-align:left; line-height:33px; color:#000000;}
.dropdown .tg .txt{display:block; padding-left:10px; padding-right:24px; overflow:hidden; white-space: nowrap; text-overflow:ellipsis;-o-text-overflow:ellipsis}
.dropdown .tg .i{position:absolute; right:7px; top:50%; z-index:1; display:inline-block; width:12px; height:12px; margin-top:-6px; vertical-align:middle; background:url("../images/common/sprite_common.png") -34px -17px no-repeat;}
.dropdown .tg:hover{text-decoration: none;}
.dropdown.open .tg .i,
.dropdown .tg:hover .i{background-position: -48px -17px;}
.dropdown.open{z-index:100;}
.dropdown.open .box{display:block; z-index: 10;}
.dropdown.disable{background:#f0f0f0;}
.dropdown.disable .tg{cursor:default; outline:none;}
.dropdown.disable .tg:hover .i{background-position:-34px -17px;}

.dropdown.new-dropdown{margin: 0 3px!important;}
.dropdown.new-dropdown .tg .txt{font-size:13px !important;float:none !important;width: auto !important; }


/* ui : forms */
.formHorizontal{}
.formHorizontal .tl{text-align:left;}
.formHorizontal .tr{text-align:right;}
.formHorizontal .formGroup{margin-bottom:15px; *zoom:1;}
.formHorizontal .formGroup:after{display:block; clear:both; content:'';}
.formHorizontal .formGroup .formLabel{float:left; width:140px; padding-top:5px; padding-bottom:8px; font-size:15px; /*font-weight: bold;*/color:#1A1A1A;}
.formHorizontal .formGroup .formItem{padding-left:160px; font-size:13px;}
.formHorizontal .formGroup .formTxt{padding:6px 0px 7px 160px; font-size:13px;}
.formHorizontal .formGroup .formBlock{padding:6px 0px 7px 160px; font-size:13px;}

/* dlHorizontal */
.dlHorizontal{padding:15px; overflow:hidden; font-size:14px; }
.dlHorizontal dt{float:left; width:60px; padding:2px 0px; text-align: left; font-weight: bold; color:#4D4D4D;}
.dlHorizontal dd{margin-left:65px;  padding:2px 0px; text-align: left; color:#4D4D4D;}

/* text list */
.txtList{font-size:13px;}
.txtList li{padding:2px 0px;}
.txtList.dot{}
.txtList.dot li{padding-left:10px; background:url("/resources/images/ico/ico_circle_black.png") 0px 9px no-repeat;}
.txtList.dotGray li{padding-left:10px; background:url("/resources/images/ico/ico_square_gray.png") 0px 9px no-repeat;}

.list{}
.list li{padding:2px 0px;}
.list ul,
.list ol{margin-left:15px;}
.list .p{margin-left:15px;}
.list-dot{margin-left:20px;}
.list-dot li{padding:1px 0px 2px;list-style: disc;}
.list-dot{margin-left:20px;}
.list-square li{padding:2px 0px;list-style: square;}
.list-num{margin-left:20px;}
.list-num>li{padding:2px 0px;list-style: decimal;}
.list-image-square{}
.list-image-square li{padding:2px 0px 2px; padding-left:15px; background:url("/resources/images/ico/bul_list_square1.png") 0px 9px no-repeat;}
.list-image-triangle li{padding:2px 0px 2px; padding-left:15px; background:url("/resources/images/ico/bul_list_triangle_right.png") 0px 8px no-repeat;}

@media all and (max-width:767px) {

    .inpbx{display:inline-block;overflow:hidden;width:auto; min-width:0px; height:18px;margin:0px 3px; padding:8px 8px 7px; vertical-align:middle; line-height:18px;border:1px solid #ddd;}
    .inpbx input.txt{width:100%;height:17px;border:0 none;background:transparent;font-size:12px;line-height:17px;color:#222;vertical-align:top}
    .inpbx input.focus,.inpbx input:focus{color:#222}
    .txtbx{display:inline-block;width:auto;margin:0px 3px; padding:8px 8px 7px;line-height:18px;border:1px solid #ddd;}
    .txtbx .txtar{width:100%;border:0 none;background:transparent;font-size:12px;line-height:17px;color:#222;vertical-align:top; resize: none;}

    /* dlHorizontal */
    .dlHorizontal{padding:15px; overflow:hidden; font-size:14px; }
    .dlHorizontal dt{float:none; width:auto; padding:2px 0px; font-weight: bold; color:#4D4D4D;}
    .dlHorizontal dd{margin-left:0px; margin-bottom:5px; padding:2px 0px; color:#4D4D4D;}

    /* ui : forms */
    .formHorizontal{}
    .formHorizontal .formGroup .formLabel{float:none; width:auto; text-align: left;}
    .formHorizontal .formGroup .formItem{padding-left:0px !important;}
    .formHorizontal .formGroup .formTxt{padding-left:0px !important; padding:0;}
    .formHorizontal .formGroup .formBlock{padding-left:0px !important;}

    .m_box{}
    .m_box_half{width:50%;}
    .m_box_thrid{width:33.3333%;}
    .m_box_rpd{position:relative; display:block; padding-right:85px;}
    .m_box_rpd .inpbx{display:block;}
    .pos_r{position:absolute; right:0px; top:0px;}
    .pos_l{position:absolute; right:0px; top:0px;}
}

