﻿@charset "utf-8";

*.text-justify {text-align:justify;}
*.text-left {text-align:left;}
*.text-center {text-align:center;}
*.text-right {text-align:right;}

span.button {display:inline-block;vertical-align:middle;border:solid 1px #555;background:#555;border-radius:4px;padding:0;}
span.button button,
span.button input,
span.button a {display:block;height:26px;line-height:26px;padding:0 10px;margin:0;border:none;background:transparent;cursor:pointer;color:#fff !important;font-size:10pt;white-space:nowrap;}
span.button.small button,
span.button.small input,
span.button.small a {font-size:9pt;height:22px;line-height:22px;padding:0 8px;}
span.button.big button,
span.button.big input,
span.button.big a {font-size:13pt;height:32px;line-height:32px;padding:0 16px;}
span.button a:hover {text-decoration:none;}
span.button:hover {background:#222;}
span.button.green {background:#388E3C;border-color:#388E3C;}
span.button.green:hover {background:#43A047;}
span.button.red {background:#C62828;border-color:#C62828;}
span.button.red:hover {background:#D32F2F;}
span.button.blue {background:#448AFF;border-color:#448AFF;}
span.button.blue:hover {background:#1E88E5;}

div.paging {margin-bottom:10px;}
.paginate {font-size:0;}
.paginate strong,
.paginate a {font-size:9pt;display:inline-block;padding:7px 2px;min-width:36px;border:solid 1px #ccc;border-left:none;line-height:1;text-align:center;}
.paginate *:first-child {border-left:solid 1px #ccc;border-top-left-radius:4px;border-bottom-left-radius:4px;}
.paginate *:last-child {border-top-right-radius:4px;border-bottom-right-radius:4px;}
.paginate strong {background-color:#007fff;color:#fff;}
.paginate a:hover {background-color:#d4eaff;}
.paginate a.pre,
.paginate a.pre_end,
.paginate a.next,
.paginate a.next_end {background-color:#f6f6f6;}

.mt-1 {margin-top:10px !important;}
.mb-1 {margin-bottom:10px !important;}
.mt-2 {margin-top:20px !important;}
.mb-2 {margin-bottom:20px !important;}
.mt-3 {margin-top:30px !important;}
.mb-3 {margin-bottom:30px !important;}

.fg-red {color:#f00;}
.fg-green {color:#0ff;}
.fg-blue {color:#00f;}

.w50 {width:50px;}
.w75 {width:75px;}
.w100 {width:100px;}
.w10p {width:10%;}
.w20p {width:20%;}
.w30p {width:30%;}
.w40p {width:40%;}
.w50p {width:50%;}
.w60p {width:60%;}
.w70p {width:70%;}
.w80p {width:80%;}
.w90p {width:90%;}

.col-3:before,
.col-3:after {content:'';clear:both;display:table;}
.col-3 {margin-left:-10px;margin-right:-10px;box-sizing:border-box;}
.col-3 .col {width:33.33%;padding-left:10px;padding-right:10px;float:left;box-sizing:border-box;}
.col-3 .col:nth-child(3n+2) {width:33.34%;}
.col-3 .col:after {content:'';clear:both;display:table;}

.col-2:before,
.col-2:after {content:'';clear:both;display:table;}
.col-2 {margin-left:-10px;margin-right:-10px;box-sizing:border-box;}
.col-2 .col {width:50%;padding-left:10px;padding-right:10px;float:left;box-sizing:border-box;}
.col-2 .col:after {content:'';clear:both;display:table;}

.col-gutter-2 {margin-left:-20px;margin-right:-20px;}
.col-gutter-2 .col {padding-left:20px;padding-right:20px;}

.label-1 {display:inline-block;font-size:10pt;padding:3px 6px;border-radius:4px;background:#ddd;color:#565656;line-height:1.1;vertical-align:middle;}

hr.divider {display:block;border:none;height:1px;width:100%;background:#ddd;margin:5px 0;padding:0;overflow:hidden;clear:both;visibility:visible;}
hr.divider-1 {margin:10px 0;}
hr.divider-2 {margin:20px 0;}
hr.divider-3 {margin:30px 0;}

div.well:before,
div.well:after {content:'';clear:both;display:table;}
div.well {padding:1em;background:#f6f6f6;border:solid 1px #eee;color:#343434;}

/* vertical columns */
.v-cols {display:table;width:100%;table-layout:fixed;}
.v-cols .v-col {display:table-cell;vertical-align:top;}
.v-cols .v-col.split {width:40px;vertical-align:middle;position:relative;}
.v-cols .v-col.split hr {display:block;margin:0;padding:0;overflow:hidden;width:1px;height:100%;background:#ddd;visibility:visible;border:none;position:absolute;top:0;left:50%;}

/* member login form style */
.tiny-form {max-width:380px;margin:0 auto;}
.tiny-form fieldset {border:none;padding:0;display:block;}
.tiny-form legend {display:block;width:100%;padding:0 0 20px 0;font-family:'Noto Sans KR',sans-serif;font-weight:400;font-size:17pt;text-align:center;}
.tiny-form * {box-sizing:border-box;}
.tiny-form .inf {color:#666;font-size:11pt;text-align:center;}
.tiny-form .f-inputs {border:solid 1px #bbb;border-radius:8px;overflow:hidden;}
.tiny-form .f-inputs div {border-top:solid 1px #bbb;position:relative;}
.tiny-form .f-inputs div:first-child {border-top:none;}
.tiny-form .f-inputs div input {padding:12px 8px;font-size:14pt;line-height:1.3;border:none;width:100%;}
.tiny-form .f-inputs div.f-col {display:table;width:100%;}
.tiny-form .f-inputs div.f-col label {display:table-cell;text-align:center;vertical-align:middle;white-space:nowrap;background:#f6f6f6;color:#666;font-size:13pt;}
.tiny-form .f-inputs div.f-col input {float:left;}
.tiny-form .f-inputs .f-fa input {padding-left:36px;}
.tiny-form .f-inputs .f-fa i.fa {position:absolute;left:8px;top:12px;font-size:14pt;line-height:1.3;color:#777;}
.tiny-form .f-buttons button {width:100%;padding:12px 0;font-size:14pt;line-height:1.3;border:none;border-radius:8px;background:#007fff;color:#fff;cursor:pointer;}
.tiny-form .f-links a {color:#007fff;}

/* member reg form style */
.table-form * {box-sizing:border-box;}
.table-form fieldset {border:none;padding:0;display:block;}
.table-form legend {display:block;width:100%;border-bottom:solid 1px #000;padding:4px;font-family:'Noto Sans KR',sans-serif;font-weight:400;font-size:13pt;}
.table-form .f-texts {height:120px;overflow-y:scroll;padding:20px;border:solid 1px #eee;}
.table-form .f-inputs {display:table;width:100%;border-spacing:1px;clear:both;table-layout:fixed;}
.table-form .f-inputs .f-col {display:table-cell;padding:6px;vertical-align:middle;font-size:10pt;border-bottom:solid 1px #eee;}
.table-form .f-inputs label.f-col {width:15%;background:#f4f4f4;color:#353535;font-weight:bold;text-align:center;}
.table-form .f-inputs input,
.table-form .f-inputs textarea {font-size:10pt;padding:4px;line-height:1.3;border:solid 1px #aaa;color:#323232;}
.table-form .f-buttons {text-align:center;}
.table-form .f-buttons button {padding:10px 20px;font-size:12pt;line-height:1.3;border:none;border-radius:8px;background:#545454;color:#fff;cursor:pointer;}
.table-form .f-buttons button.prime {background:#007fff;}
.table-form .f-buttons button.danger {background:#C62828;}

ul#floater {position:absolute;list-style:none;padding:10px;margin:0;background:#fff;border:solid 1px #aaa;box-shadow:#aaa 0 0 10px;}