@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
body { margin: 0; padding: 0; font-family: "Nanum Gothic"; font-size: 10pt }
img { border: 0; }
a { text-decoration: none; color: #575757 }
a:link { text-decoration: none; color: #575757 }
a:hover { text-decoration: none; color: #575757 }
a:visited { text-decoration: none; color: #575757 }
ul li { list-style: none }

#top a { font-size: 11px }
#top.form-control { float: left;  display: block; width: 100%; height: 40px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 3px solid #3e76c1; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s }
#custom.btn-default { height: 35px; color: #FFF; background-color: #3e76c1; border-color: #3e76c1 }
#custom .glyphicon { position: relative; top: 3px }
.btn { position: relative; left: -20px; display: inline-block;  padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 4px }
.btns { position: relative; left: 0px; display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 4px }
.btn-group-sm>.btns, .btn-sm { padding: 4px 8px; font-size: 12px; line-height: 1.5; border-radius: 3px }
.btn-group-xsm>.btns, .btn-xsm {  padding: 2px 4px; font-size: 12px; line-height: 1.5; border-radius: 3px }
.btn-default { color: #333; background-color: #fff; border-color: #ccc }

.btn-blue { background-color: #337AB7; color: #FFF; border-color: #337AB7 }
.btn-sky { background-color: #99FFFF; color: #FFF; border-color: #337AB7 }
.pagination { display: inline-block; padding-left: 0; margin: 15px 0; border-radius: 4px }
.colorA { background: #92B42E; cursor: pointer }
.colorB { background: #AAA; cursor: pointer }
.st { font-size: 16px }

#main-body { width: 1080px; margin: 0 auto }
#main-body .mainFrame { margin: 15px 0  0 0 }
#main-body .mainFrame .slideBanner { float: left; margin-right: 10px }
.slideBanner .mainbann { width: 720px; height: 300px; margin-bottom: 15px }
#main-body .mainFrame .clubRanking { float: right; width: 345px; height: 300px; padding-bottom: 15px }
#main-body .mainFrame .clubRanking .rankTitle { width: 100%; height: 36px; background: #336FB5 }
.rankTitle .title { float: left; padding: 8px 0 0 12px; font-size: 14px; font-weight: bold; color: #FFF }
.rankTitle .title .engt { color: #CCC }
.rankTitle .rankList { float: right; padding: 6px 15px 0 0; font-size: 15px; font-weight: bold }
.rankTitle .rankList a.color { color: #FFF }
#main-body .mainFrame .clubRanking .rankBody { content:''; display:block; clear:both }
#main-body .mainFrame .competitions { content:''; display:block; clear:both; width: 1078px; border: 2px solid #ebebeb; height: 100px; margin-bottom: 13px }
#main-body .mainFrame .competitions .compTitle { float: left; width: 195px; height: 85px; margin: 6px 0 0 5px }
#main-body .mainFrame .competitions .compBody { float: left; padding: 10px 0 0 30px }
#main-body .mainFrame .tabBoard { clear: both; float: left }
#main-body .mainFrame .tabBoard a { font-size: 14px }

#main-body .mainFrame .photoAlbum { float: left; margin: 0 0 0 15px }
.photoAlbum .photoTitle { float: left; width: 250px; padding: 6px 0 10px 0; font-weight: bold; font-size: 15px }
.photoAlbum .photoMore { float: right; width: 95px; text-align: right; padding: 6px 5px 0 0 }
.photoAlbum .photoBody { clear: both; height: 242px; border: 1px solid #EBEBEB; padding: 0 15px }

#main-body .mainFrame .infoSection { clear: both; padding-top: 13px }
.infoSection h4 { font-size: 15px; font-weight: bold }
#main-body .mainFrame .boxes { width: 100% }
.mainFrame .boxes ul.boxEvent { overflow: hidden; margin-left: -15px }
.mainFrame .boxes ul.boxEvent .thumbs { display: block }
.mainFrame .boxes ul.boxEvent .thumbs.etcs  { display: block; height: 112px; margin-bottom: 13px }
.mainFrame .boxes ul.boxEvent .thumbs img { display: block; width: 100%; height: 100% }
.mainFrame .boxes ul.boxEvent .thumbs .summary { padding-top: 15px; text-align: center; font-size: 15px; font-weight: 700 }
.summary .subinfo { text-align: left; font-size: 12px; font-weight: 400; color: #999; padding: 10px 15px 15px }
.mainFrame .boxes ul.boxEvent li { float: left; width: calc(25% - 15px); margin-left: 15px }
.boxes ul.boxEvent li>div { border: 1px solid #EEE }
.thumbs.etcs .summary a { position: relative; top: 5px; color: #FFF }
.thumbs.etcs .summary .subinfo { position: relative; top: 5px; color: #FFF }

.main-button-bolder { float: right; margin-top: 25px; width: 250px; padding: 12px 0; text-align: center }
.mbutton a { text-decoration:none; color: #FFF; background: #336FB5 }
.mbutton a.a:link { background: #336FB5; font-size: 15px; font-weight: 700; color:#FFF; padding: 8px 22px; margin-right: 3px; border-radius: 3px }
.mbutton a.a:hover { background: none; font-size: 15px; font-weight: 700; color:#336FB5; padding: 6px 20px; border: 2px solid #336FB5 }


.acontent { width: 845px; padding-top: 20px; font-size: 12px }
.acontent p { line-height: 90% }
.acontent ul li { list-style-type: none; line-height: 170% }
.acontent ul li.sbj { font-size: 14px; font-weight: 600; color: #336FB5; padding-bottom: 5px }
.info_area { line-height: 125% }

.pageTitle { position: relative; top: 3px }
.pageTitle ul { width: 845px; margin: 0; padding: 0; list-style: none }
.pageTitle ul li.titles { float: left; font-family: 'Nanumgothic', 'Malgun Gothic'; color: #808080; width: 600px; margin-bottom: 7px; letter-spacing: -1px }
.pageTitle ul li .bar { border: 3px solid #336FB5; margin: 0 6px 0 0 }
.pageTitle ul li .index { font-family: 'Nanumgothic', 'Malgun Gothic'; color: #000; font-size: 20px; position: relative; top: 2px; letter-spacing: -1px; font-weight: bold; padding-right: 3px }
.pageTitle ul li.direction { float: right; text-align: right; font-size: 12px; position: relative; top: 10px }
.pageTitle ul li .divs { margin: 0 7px; padding: 0; border: 1px solid #D0D0D0 }
.pageTitle ul li .divstemp { margin: 0 7px; padding: 0; border: 1px solid #D0D0D0 }
.liner { clear: both; position: relative; top: 3px; border: 1px solid #E3E3E3 }

.orange { color:#F90 }
.brick-house:after { display: block; clear: both; content: '' }
.brick-house .brick-vowel { float: left; width: 345px }
.grid1_wrap .brick-vowel { width: 345px }
.grid1_wrap, .grid2_wrap { position: relative; top: 5px; left: -5px; margin: 5px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box }
.grid1,.grid2 { float: left; width: 100%; padding: 0 5px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box }
.grid1:after, .grid2:after { display: block; clear: both; height: 1px; margin-top: -1px; content: '' }

.uio_cd_thumbh { position: relative; background-color:#F7F7F7; margin: 0 0 5px; padding: 5px; -webkit-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.1); box-shadow: 0 0 2px rgba(0, 0, 0, 0); border: 1px solid #EEE }
.uio_cd_thumbh:after { display: block; clear: both; content:'' }
.uio_cd_thumbh .uct_mw { position: relative; float: left; width: 25px; text-align: center }
.uio_cd_thumbh .top3 { background-color: #08A0EC }
.uio_cd_thumbh .over3 { background-color: #9C9C9C }
.uio_cd_thumbh .uct_mw .nmbs { font-size: 12px; font-family: arials, sans-serif; font-weight: bold; color: #FFF }
.uio_cd_thumbh .uct_m { min-height: 36px }
.uio_cd_thumbh .uc_time { bottom: 0; right: 5px; padding: 0; background: none }
.uio_cd_thumbh .uct_flex { position: absolute; top: 0; top: 4px\9; right: 0; bottom: 0; left: 25px; white-space: nowrap }
.uio_cd_thumbh .uct_det { position: relative; top: 4px; display: inline-block; max-width: 100%; padding: 0 10px 0 15px; -webkit-box-sizing: border-box; box-sizing: border-box; vertical-align: middle; white-space: normal; word-wrap: break-word }
.uio_cd_thumbh .uct_flex:after { display: inline-block; height: 100%; vertical-align: middle; content: '' }
.uio_cd_thumbh .uct_title { color: #222; letter-spacing: 0px; position: relative; top: 1px }
.uio_cd_thumbh .uct_title a { font-size: 13px; font-weight: normal; color: #777 !important }
.uio_cd_thumbh .uct_title a:visited { color: #777 !important }
.uio_cd_thumbh .uct_title a .str { font-weight: 600 }
.uio_cd_thumbh .uct_pnt { position: absolute; top: 4px; right: 10px; font-size: 14px; font-family: HelveticaNeue-Light, sans-serif; font-weight: bold }
.uio_cd_thumbh .ftop3 { color: #08A0EC }
.uio_cd_thumbh .fover3 { color: #9C9C9C }

ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 41px; border-bottom: 1px solid #EEE; border-left: 1px solid #EEE; width: 100%; font-size: 15px }
ul.tabs li { float: left; text-align: center; cursor: pointer; width: 120px; height: 41px; line-height: 41px; border: 1px solid #EEE; border-left: none; font-weight: bold; background: #FAFAFA; overflow: hidden; position: relative }
ul.tabs li.active { background: #089FEE; border-bottom: 1px solid #FFF; color: #FFF }
.tab_container { border: 1px solid #EEE; border-top: none; clear: both; float: left; width: 720px; background: #FFF }
.tab_content { padding: 5px; font-size: 14px; height: 240px; display: none }
.tab_container .tab_content ul { width: 100%; margin: 0px; padding: 0px }
.tab_container .tab_content ul li { padding: 5px; list-style: none }

.pointResult { text-align: right; padding-right: 5px; color: #336FB5; font-weight: bold; }
.badge-blue { background: #336FB5; }
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th { padding: 6px; line-height: 1em; vertical-align: middle; border-top: 1px solid #eee }
.reserv { padding: 5px 10px; text-align: center; font-size: 12px }
.reserv table>thead>tr>th { text-align: center }
.avail { padding: 2px 6px; background: #3A87AD; border-radius: 3px; font-size: 11px; color: #FFF }
.cant { padding: 2px 6px; background: #FF0000; border-radius: 3px; font-size: 11px; color: #FFF }
.reserved { padding: 2px 6px; background: #FF9900; border-radius: 3px; font-size: 11px; color: #FFF }
.reservedtxt { color: #3A87AD; font-weight: 700 }

/* main popup */
.main_popup .modal-dialog{
    margin-top: calc(50vh - 300px);
    width: 845px;
}
.main_popup .modal-content{
    border-radius: 0px;
}
.main_popup .modal-header, .main_popup .modal-footer{
    padding-top: 5px;
    padding-bottom: 5px;
}
.main_popup .modal-content .modal-body{
    height: 534px;
    overflow: auto;
}
.main_popup .today_not_open_btn{
    text-align: right;
    margin-bottom: 0px;
    cursor: pointer;
}
.main_popup .today_not_open_btn:hover{
    text-decoration: underline;
}
/* main popup */