/* @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css) ;*/
@font-face {
   font-family : 'Nanum Gothic' ;
   font-style : normal ;
   font-weight : 400 ;
   src : url(//tmb.kocn.co.kr/fonts/NanumGothic-Regular.eot) ;
   src : url(//tmb.kocn.co.kr/fonts/NanumGothic-Regular.eot?#iefix)
      format('embedded-opentype'),
      url(//tmb.kocn.co.kr/fonts/NanumGothic-Regular.woff2)
      format('woff2'),
      url(//tmb.kocn.co.kr/fonts/NanumGothic-Regular.woff)
      format('woff'),
      url(//tmb.kocn.co.kr/fonts/NanumGothic-Regular.ttf)
      format('truetype') ;
}

@font-face {
   font-family : 'Nanum Gothic' ;
   font-style : normal ;
   font-weight : 700 ;
   src : url(//tmb.kocn.co.kr/fonts/NanumGothic-Bold.eot) ;
   src : url(//tmb.kocn.co.kr/fonts/NanumGothic-Bold.eot?#iefix)
      format('embedded-opentype'),
      url(//tmb.kocn.co.kr/fonts/NanumGothic-Bold.woff2)
      format('woff2'),
      url(//tmb.kocn.co.kr/fonts/NanumGothic-Bold.woff) format('woff'),
      url(//tmb.kocn.co.kr/fonts/NanumGothic-Bold.ttf)
      format('truetype') ;
}

html {
   font-family : 'Nanum Gothic', '나눔고딕', 'Malgun gothic', '맑은 고딕', Dotum,
      AppleGothic, sans-serif ;
   letter-spacing : -1px ;
}

body {
   overflow-y : scroll ;
   height : 100% ;
   margin : 0 ;
   padding : 0 ;
   min-width : 1100px ;
   font-family : 'Nanum Gothic', '나눔고딕', Dotum, AppleGothic, sans-serif ;
   font-size : 12px ;
   line-height : 18px ;
}

img {
   border : 0 ;
}

input, textarea, select {
   font-family : 'Nanum Gothic', '나눔고딕', Dotum, AppleGothic, sans-serif ;
}

.header {
   width : 100% ;
   position : relative ;
   float : left ;
}

.header_sub_main {
   width : 100% ;
   position : absolute ;
   float : left ;
   top : 140px ;
   z-index : 10 ;
}

.content {
   margin : 20px 20px 0px 0px ;
   width : 100% ;
   position : relative ;
   clear : both ;
}

.footer {
   width : 100% ;
   margin : 0 ;
   padding : 0 ;
   bottom : 0px ;
   position : relative ;
   background-color : #3D3D3D ;
   border : 1px solid #262626 ;
   box-sizing : border-box ;
   -moz-box-sizing : border-box ;
   -webkit-box-sizing : border-box ;
   height : 183px ;
   padding-top : 20px ;
}

.navContainer {
   padding : 0 ;
   list-style : none ;
   position : relative ;
   background-color : #242424 ;
}

.topContainer {
   overflow : hidden ;
   width : 1066px ;
   height : 335px ;
   margin-top : 15px ;
}

.topContainer2 {
   height : 316px ;
}

.top1 {
   margin : 50px 0px ;
   height : 90px ;
   width : 100% ;
   box-sizing : border-box ;
   -moz-box-sizing : border-box ;
   -webkit-box-sizing : border-box ;
}

.topMenu a {
   color : #000000 ;
   text-decoration : none ;
}

.top1 {
   margin : 50px 0px ;
   height : 90px ;
   width : 100% ;
   box-sizing : border-box ;
   -moz-box-sizing : border-box ;
   -webkit-box-sizing : border-box ;
}

.noticeArea {
   text-align : left ;
   color : black ;
   padding-top : 15px ;
}

.noticeText {
   vertical-align : top ;
   line-height : 23px ;
   color : #E2E2E2 ;
}

.myInfo_container {
   background-color : #FFF ;
   width : 250px ;
   height : 152px ;
   z-index : 100 ;
   position : absolute ;
   right : 0px ;
   top : 45px ;
   padding-top : 15px ;
   -webkit-box-shadow : 0 1px 3px rgba(0, 0, 0, 0.5) ;
   moz-box-shadow : 0 1px 3px rgba(0, 0, 0, 0.5) ;
   box-shadow : 0 1px 3px rgba(0, 0, 0, 0.5) ;
}

.myInfo_item {
   height : 30px ;
   padding : 0 5px ;
}

.myInfo_btn1 {
   width : 100% ;
   height : 30px ;
   padding-top : 10px ;
   background-color : #FFFFFF ;
   font-size : 11pt ;
   text-align : center ;
}

.myInfo_btn1:hover    {
   text-decoration : underline ;
}

.myInfo_btn2 {
   width : 100% ;
   height : 28px ;
   padding-top : 10px ;
   background-color : #EEEEEE ;
   font-size : 11pt ;
   text-align : center ;
   border-top : 1px solid #DDDDDD ;
   border-bottom : 1px solid #DDDDDD ;
}

.myInfo_btn2:hover    {
   text-decoration : underline ;
}

.mainNavContainer {
   width : 100% ;
   height : 65px ;
   padding : 0 ;
   list-style : none ;
   position : absolute ;
   z-index : 15 ;
}

.mainNav {
   margin : 0 ;
   padding : 0 ;
   list-style : none ;
   text-align : left ;
   position : relative ;
}

.mainNav li {
   float : left ;
   padding : 15px 60px 0 0 ;
   height : 50px ;
}

.subNavContainer {
   height : 55px ;
   padding : 0 ;
   list-style : none ;
   position : relative ;
   background-color : #000000 ;
   top : -11px ;
}

.subNav {
   padding : 0 ;
   list-style : none ;
   text-align : center ;
   position : relative ;
}

.subNav li {
   float : left ;
   width : 90px ;
}

.subNav a {
   color : #FFFFFF ;
   font-size : 14px ;
   text-transform : uppercase ;
   text-decoration : none ;
   border-left : none ;
   padding : 15px 12px ;
   display : block ;
}

.subItem1 {
   width : 120px !important ;
}

.bannerContainer {
   height : 350px ;
   padding-top : 3px ;
   list-style : none ;
   position : relative ;
}

.banner {
   width : 100% ;
   height : 350px ;
   position : relative ;
   float : left ;
   background-color : #CDDA6B ;
   box-sizing : border-box ;
   -moz-box-sizing : border-box ;
   -webkit-box-sizing : border-box ;
}

.banner_s {
   display : inline-block ;
   height : 150px ;
   vertical-align : middle ;
}

.serviceContainer {
   font-size : 0.8em ;
   color : white ;
   float : right ;
   margin-top : 5px ;
}

.serviceContainer a {
   color : white ;
   text-decoration : none ;
}

.topMenuContainer {
   padding : 4px 0px 7px 0px ;
   text-align : right ;
   font-size : 9pt ;
   position : relative ;
}

.footerLogoContainer {
   padding-left : 20px ;
   width : 200px ;
   float : left ;
}

.footerMenuContainer {
   width : 800px ;
   float : left ;
   color : gray ;
   line-height : 150% ;
}

.footerMenuContainer a {
   color : white ;
   text-decoration : none ;
}

.faq {
   border : 1px solid #C3C3C3 ;
}

.faqItem:hover    {
   background-color : #DEDEDE ;
}

.faq a {
   color : #666666 ;
}

.inner {
   margin : 0 auto ;
   width : 1076px ;
}

.inner2 {
   margin : 0 auto ;
   width : 1024px ;
}

.main_menu {
   font-size : 15px ;
   font-weight : bold ;
   text-decoration : none ;
   border-left : none ;
   padding : 9px 0px ;
   display : block ;
}

.menu_active {
   background-color : #CDDA6B ;
}

.menu_active a {
   color : #000 ;
}

.menu_unactive a {
   color : #444 ;
}

.menuSelecter {
   width : 10px ;
   height : 10px ;
   margin : 0 auto ;
}

.selected {
   background-color : #000000 ;
}

.spliter {
   height : 1px ;
}

.login_title {
   color : white ;
   font-size : 14pt ;
   font-weight : bold ;
   text-align : center ;
   margin-top : 35px ;
}

.login_area {
   margin : 0 auto ;
   width : 400px ;
   text-align : center ;
}

.login_area2 {
   font-size : 10pt ;
   clear : both ;
}

.login_input {
   padding-left : 10px ;
   padding-top : 15px ;
   padding-bottom : 15px ;
   border : 1px solid #CACACA ;
   width : 390px ;
}

.login_btn1 {
    color : white ;
    font-size : 12pt ;
    padding-top : 16px ;
    background-color : #CDDA6B ;
    width : 240px ;
    height : 36px ;
    float : left ;
    font-weight : bold ;
}

.login_btn2 {
    color : white ;
    font-size : 12pt ;
    padding-top : 16px ;
    background-color : #929292 ;
    width : 140px ;
    height : 36px ;
    float : right ;
    font-weight : bold ;
}

.login_btn3 {
   color : white ;
   font-size : 12pt ;
   padding-top : 16px ;
   background-color : #3B9A82 ;
   width : 400px ;
   height : 36px ;
   float : left ;
   font-weight : bold ;
}

.intro_area {
   background-color : #FFFFFF ;
   margin : 20px 10px ;
   padding : 25px 30px ;
   border : 1px solid #E3DFE0 ;
   color : black ;
   line-height : 25pt ;
}

.bill_title {
   color : white ;
   font-size : 14pt ;
   font-weight : bold ;
   text-align : center ;
   margin-top : 35px ;
}

.bill_area {
   margin : 0 auto ;
   width : 550px ;
   text-align : center ;
}

.title_area {
   font-size : 25pt ;
   font-weight : bold ;
   padding : 50px 0 ;
   text-align : center ;
}

.bill_btn {
   color : white ;
   font-size : 12pt ;
   padding-top : 16px ;
   background-color : #689590 ;
   width : 240px ;
   height : 36px ;
   font-weight : bold ;
   text-align : center ;
}

.bill_container {
   width : 130px ;
   height : 100px ;
   border : 1px solid #d5d5d5 ;
   border-radius : 5px ;
   background-color : #FFFFFF ;
   padding-top : 10px ;
   text-align : center ;
   float : left ;
}

.bill_item1 {
   width : 108px ;
   height : 45px ;
   margin : 0 auto ;
   background-color : #DC6430 ;
   border : 1px solid #dc6430 ;
   border-radius : 5px ;
   color : #FFFFFF ;
   padding-top : 7px ;
}

.bill_item2 {
   width : 108px ;
   height : 37px ;
   margin : 0 auto ;
   background-color : #8BBEB9 ;
   border : 1px solid #8BBEB9 ;
   border-radius : 5px ;
   color : #FFFFFF ;
   padding-top : 15px ;
}

.bill_item3 {
   width : 108px ;
   height : 45px ;
   margin : 0 auto ;
   background-color : #8BBEB9 ;
   border : 1px solid #8BBEB9 ;
   border-radius : 5px ;
   color : #FFFFFF ;
   padding-top : 7px ;
}

.list_page {
   float : right ;
   position : relative ;
   left : -50% ;
}

.list_page li {
   float : left ;
   position : relative ;
   left : 50% ;
}

.check_off {
   background-image : url('/img/check.png') ;
   background-repeat : no-repeat ;
   background-position : center ;
   background-color : #CCCCCC ;
   width : 45px ;
   height : 45px ;
}

.check_on {
   background-image : url('/img/check.png') ;
   background-repeat : no-repeat ;
   background-position : center ;
   background-color : #C8DA40 ;
   width : 45px ;
   height : 45px ;
}

.term_area {
   text-align : left ;
   background-color : #FFFFFF ;
   border : 1px solid #CACACA ;
}

.term_box {
   padding : 5px 0 0 5px ;
   color : gray ;
   overflow : auto ;
   width : 370px ;
   height : 85px ;
   background-color : #F7F7F7 ;
   border : 1px solid #F0F0F0 ;
}

.top_item {
   width : 250px ;
    height : 316px ;
   position : relative ;
   float : left ;
   margin-right : 19px ;
   border : 1px solid #000 ;
}

.top_item_ovr {
   width : 100% ;
    height : 100% ;
   position : absolute ;
   top : 0px ;
}

.top_item_txt {
   position : absolute ;
   top : 240px ;
   margin : 0px 12px ;
   color : #FFCC67 ;
   font-size : 17pt ;
   font-weight : bold ;
}

.top_item_txt2 {
   position : absolute ;
   top : 270px ;
   margin : 0px 12px ;
   color : #CCC ;
   font-size : 10pt ;
   font-weight : bold ;
   height : 40px ;
   overflow : hidden ;
   line-height : 145% ;
}

.grayscale {
   /* Firefox 10+, Firefox on Android */
   filter : url("data:image/svg+xml ;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale") ;
   /* IE 6-9 */
   filter : gray ;
   /*a
   Chrome 19+,
   Safari 6+,
   Safari 6+ iOS,
   Opera 15+
  */
   -webkit-filter : grayscale(100%) ;
}

.grayscale.grayscale-fade {
   -webkit-transition : -webkit-filter .5s ;
}

.grayscale.grayscale-fade:hover    {
   -webkit-filter : grayscale(0%) ;
   filter : none ;
}

.grayscale-replaced.grayscale-fade svg {
   opacity : 1 ;
   -webkit-transition : opacity .5s ease ;
   transition : opacity .5s ease ;
}

.grayscale-replaced.grayscale-fade:hover    svg {
   opacity : 0 ;
}

.time_area {
   background-color : #FFFFFF ;
   height : 350px ;
   padding-top : 20px ;
   border-bottom : 1px solid #D8D8D8 ;
}

.time_mark {
   background-color : #A2A2A2 ;
   width : 161px ;
   height : 240px ;
}

.time_item1 {
   background-color : #F4F4F4 ;
   width : 161px ;
   height : 240px ;
}

.time_item2 {
   width : 161px ;
   height : 39px ;
   text-align : center ;
}

.time_item3 {
   width : 110px ;
   text-align : center ;
}

.new_item {
   width : 180px ;
   height : 310px ;
   text-align : center ;
   float : left ;
   margin-bottom : 70px ;
   position : relative ;
}

.new_item2 {
   height : 310px ;
   background-color : #FFFFFF ;
   border : 1px solid #C7C7C7 ;
}

.main_item {
   width : 150px ;
   height : 170px ;
   text-align : center ;
   float : left ;
   margin-bottom : 70px ;
   position : relative ;
}

.main_item2 {
   height : 187px ;
   background-color : #FFFFFF ;
   border : 1px solid #000 ;
   overflow : hidden ;
}

.margin_main_item {
   margin-right : 80px ;
}

.btn {
   width : 240px ;
   height : 240px ;
   color : black ;
   background-color : white ;
   border : 1px solid #AAAAAA ;
   font-size : 15pt ;
   text-align : center ;
}

.btn:hover    {
   background-color : #AAAAAA ;
}

.board_area {
   background-color : #FFFFFF ;
   margin : 20px 10px ;
   border-top : 1px solid #E3DFE0 ;
   border-left : 1px solid #E3DFE0 ;
   border-right : 1px solid #E3DFE0 ;
}

.board_area2 {
   color : black ;
   border-bottom : 1px solid #E3DFE0 ;
}

.board_tbl {
   border-color : gray ;
   border-spacing : 1px ;
   border-collapse : collapse ;
   width : 100% ;
}

.board_tbl tr {
   height : 40px ;
}

.board_tbl tr:hover    td {
   background-color : #DEDEDE ;
}

.board_tbl thead th {
   border-bottom : 1px solid #E3DFE0 ;
}

.board_tbl tbody td {
   border-bottom : 1px solid #E3DFE0 ;
}

.board_mark {
   width : 31px ;
   height : 31px ;
}

.board_mark2 {
   width : 31px ;
   height : 26px ;
   background-color : #3B9A82 ;
   padding-top : 5px ;
}

.board_mark3 {
   width : 31px ;
   height : 26px ;
   padding-top : 5px ;
   text-align : center ;
}

.board_title {
   margin-top : 6px ;
   float : left ;
}

.board_paging {
   height : 50px ;
   margin : 0 auto ;
   margin-bottom : 15px ;
   text-align : center ;
}

.board_paging ul {
   list-style : none ;
   margin : 0 ;
   padding : 0 ;
   position : relative ;
}

.board_paging ul li {
   float : left ;
   position : relative ;
   left : 50% ;
}

.board_pbtn1 {
   width : 30px ;
   height : 25px ;
   background-color : #858585 ;
   font-size : 9pt ;
   color : #FFFFFF ;
   text-align : center ;
   padding-top : 5px ;
   margin-right : 10px ;
}

.board_pbtn2 {
   width : 30px ;
   height : 25px ;
   background-color : #FFFFFF ;
   font-size : 9pt ;
   font-weight : bold ;
   color : #858585 ;
   text-align : center ;
   padding-top : 5px ;
   border : 1px solid #E6E6E6 ;
   margin-right : 10px ;
}

.board_pbtn3 {
   width : 30px ;
   height : 25px ;
   background-color : #FFFFFF ;
   font-size : 9pt ;
   font-weight : bold ;
   color : #A40D14 ;
   text-align : center ;
   padding-top : 5px ;
   border : 1px solid #E6E6E6 ;
   margin-right : 10px ;
}

.board_cmt {
   height : 35px ;
}

.board_cmt input {
   padding : 6px 0 6px 2px ;
   width : 92% ;
   border : 1px solid #E6E6E6 ;
}

.board_cmt2 {
   padding-left : 45px ;
   color : black ;
   background-color : #FFFFFF ;
   margin : 15px 10px ;
   border : 1px solid #E3DFE0 ;
   min-height : 40px ;
}

.board_art {
   margin : 0 10px ;
   height : 50px ;
   color : black ;
}

.wish_mark {
   width : 100px ;
   height : 26px ;
   padding-top : 5px ;
   text-align : center ;
}

.box_area {
   background-color : #FFFFFF ;
   border : 1px solid #E3DFE0 ;
}

.box_area2 {
   background-color : #FFFFFF ;
   border-top : 1px solid #E3DFE0 ;
   border-left : 1px solid #E3DFE0 ;
   border-right : 1px solid #E3DFE0 ;
}

.box_border {
   border-bottom : 1px solid #E3DFE0 ;
}

.comic_paging {
   height : 50px ;
   margin : 0 auto ;
   margin-bottom : 15px ;
   text-align : center ;
}

.comic_paging ul {
   list-style : none ;
   margin : 0 ;
   padding : 0 ;
   position : relative ;
   float : right ;
   left : -50% ;
}

.comic_paging ul li {
   float : left ;
   position : relative ;
   left : 50% ;
}

.comic_area {
   margin : 0 auto ;
   padding-top : 20px ;
   width : 100% ;
}

.comic_area2 {
   background-color : #FFFFFF ;
   border : 1px solid #EBEBEB ;
}

.comic_desc {
   background-color : #242424 ;
   width : 100% ;
   height : 260px ;
   padding : 15px ;
}

.comic_desc2 {
   width : 555px ;
   height : 30px ;
   font-color : black ;
   margin-left : 25px ;
   padding-left : 5px ;
   float : left ;
   background-color : #FFF ;
}

.comic_books {
   margin-top : 15px ;
   padding : 15px ;
   width : 100% ;
   overflow : auto ;
}

.comic_book {
   background-repeat : no-repeat ;
   width : 95px ;
   height : 115px ;
   color : white ;
   font-weight : bold ;
   text-align : center ;
   float : left ;
   margin-right : 12px ;
   font-size : 12pt ;
   display : table ;
}

.comic_book_txt {
   vertical-align : middle ;
   display : table-cell ;
}

.comic_book1 {
   background-image : url('/img/b2.png') ;
}

.comic_book2 {
   background-image : url('/img/b0.png') ;
}

.comic_book3 {
   background-image : url('/img/b1.png') ;
}

.comic_book:hover    {
   color : #000000 ;
}

.list_area {
   padding-top : 40px ;
   overflow : auto ;
   min-height : 600px ;
}

.list_area2 {
   background-color : #FFFFFF ;
   padding-top : 20px ;
   border-bottom : 1px solid #D8D8D8 ;
}

.list_item {
   width : 145px ;
   height : 215px ;
   text-align : center ;
   float : left ;
   margin-right : 20px ;
   position : relative ;
}

.list_item2 {
   height : 150px ;
   background-color : #FFFFFF ;
   border : 1px solid #EEEEEE ;
   -webkit-box-shadow : 1px 1px 4px 1px rgba(0, 0, 0, 0.3) ;
   moz-box-shadow : 1px 1px 4px 1px rgba(0, 0, 0, 0.3) ;
   box-shadow : 1px 1px 4px 1px rgba(0, 0, 0, 0.3) ;
}

.list_mark {
   margin : 0 auto ;
   background-color : #DD7E68 ;
   border : 1px solid #BE6955 ;
}

.list_mark2 {
   margin : 0 auto ;
   background-color : #69B0DC ;
   border : 1px solid #5694BB ;
}

.new_area {
   height : 380px ;
   padding-top : 30px ;
   background-color : #FFFFFF ;
}

.free_area {
   padding-top : 30px ;
   background-color : #FFFFFF ;
}

.myInfo_header {
   height : 178px ;
   background-color : #FFFFFF ;
   border : 1px solid #E3DFE0 ;
   margin : 0 auto ;
   margin-top : 20px ;
   text-align : center ;
}

.myInfo_header_box {
   width : 178px ;
   height : 94px ;
   padding-top : 84px ;
   border-right : 1px solid #E3DFE0 ;
   cursor : pointer ;
}

.myInfo_header_box:hover    {
   background-color : #E3DFE0 ;
}

.myInfo_header_box2 {
   width : 178px ;
   height : 94px ;
   padding-top : 84px ;
   cursor : pointer ;
}

.myInfo_header_box2:hover    {
   background-color : #E3DFE0 ;
}

.myInfo_box {
   width : 200px ;
   height : 105px ;
   padding-top : 95px ;
   border-right : 1px solid #E3DFE0 ;
}

.myInfo_item1 {
   float : left ;
   padding-left : 100px ;
   font-size : 10pt ;
   text-align : left ;
}

.pop_area {
   clear : both ;
   padding-top : 30px ;
   background-color : #FFFFFF ;
}

.header_search {
   padding : 17px 0 0 5px ;
   width : 135px ;
}

/* border */
.border1 {
   border-bottom : 1px solid #D8D8D8 ;
}

/* 폰트 */
.title {
   font-size : 16px ;
   color : #333333 ;
   font-weight : normal ;
}

.time_font {
   color : #333333 ;
   font-size : 12px ;
   font-weight : bold ;
}

/* Input */
.search_text {
   background-color : transparent ;
   border : 0px solid ;
   height : 20px ;
   width : 120px ;
   color : #000 ;
   font-family : 'Nanum Gothic', '나눔고딕', Dotum, AppleGothic, sans-serif ;
   font-size : 12px ;
   line-height : 18px ;
}

.search_text::-webkit-input-placeholder {
   color : #000 ;
}

.search_text:-moz-placeholder {
   color : #000 ;
}

.search_text::-moz-placeholder {
   color : #000 ;
}

.search_text:-ms-input-placeholder {
   color : #000 ;
}

.search_text:focus {
   outline : 0 ;
}

.search_text_active {
   background-color : transparent ;
   border : 0px solid ;
   height : 20px ;
   width : 120px ;
   color : #FFF ;
   font-family : 'Nanum Gothic', '나눔고딕', Dotum, AppleGothic, sans-serif ;
   font-size : 12px ;
   line-height : 18px ;
}

.search_text_active::-webkit-input-placeholder {
   color : #FFF ;
}

.search_text_active:-moz-placeholder {
   color : #FFF ;
}

.search_text_active::-moz-placeholder {
   color : #FFF ;
}

.search_text_active:-ms-input-placeholder {
   color : #FFF ;
}

.search_text_active:focus {
   outline : 0 ;
}

.mark_19 {
   height : 15px ;
   vertical-align : middle ;
   margin-left : 3px ;
}