@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Noto+Sans);
@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);

/* ==================================================
   .Common
================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, 
ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
a:link, a:visited {text-decoration:none}
button{overflow: visible;padding:0; border: 0;background: transparent;white-space: nowrap;cursor: pointer;}



a:hover, a:focus, a:active {text-decoration:none;}
html {letter-spacing: -1px; word-spacing: 1px;height:100%;}



/*
@media (min-width: 1685px) {
  article.block-content { width: 1300px !important; margin: auto; }
}
@media (min-width: 990px) {
  article.block-content { width: 1100px; margin: auto; }
}
*/

html,body {font-family: 'Nanum Gothic', sans-serif;}
.clearfix {content: " ";clear: both;}

/* ==================================================
   .Layout API
================================================== */
html {letter-spacing: -1px;word-spacing: 1px; outline: none; }
#wrap-all {background-color:#fff;    display: table;
    width: 100%;}
section#block {width: 100%; margin-left: auto; margin-right: auto;display: table;content: " ";position: relative;}
 section#block.top-block { background: url(../css-images/main-page-top-banner.jpg) center no-repeat;} 
  section#block.type-cm {height: 365px; background: url(../css-images/main-cm.jpg) center no-repeat;padding-top: 38px;} 

  section#block.type-tile {height: 596px; background: url(../css-images/main-tile.jpg) center no-repeat;padding-top: 55px;} 
  section#block.type-oo {height: 672px; background: url(../css-images/oo-bg.jpg) center no-repeat;} 
section#block.type-normal { background: #f5f5f5; }
section#block.lighter-block { padding-top: 70px; background: #f5f5f5;}
article.block-content { margin: auto; width: 1100px; position: relative;;}
.row {content: " ";;}
#content {padding: 20px 0 !important; }

nav,nav:before,nav:after,
footer,footer:before,footer:after {
    display: table !important;
    content: " ";
}

.special-header {height: 50px;margin-bottom: 45px;}
.special-header h4{float: left;height: 50px;background: #444;line-height: 50px;color: #fff;width: 200px;font-size: 22px;text-align: center;font-weight: normal;;}
.special-header .sm{font-size: 12px;height: 50px;line-height: 50px;padding-left: 30px;float: left;background: #f6f6f6;width: 870px;;}


.top-cnt {    font-size: 13px;
    color: #c7c7c7;
    line-height: 20px;    top: 280px;    position: absolute;}
span.bottom-bar {border-bottom: 2px solid #13bec3;padding-bottom: 60px;padding: 0px 1px 60px 1px;}
.h3-em {float: left;padding-top: 13px;padding-left: 20px;font-size: 14px;color: #888;;;}
/* ==================================================
   <Header>
================================================== */
nav.primary-menu {width: 100%;margin: auto;height: 100px;background: #444;border-bottom: 1px solid #7ff7ff;position: relative;}
nav.primary-menu .header-box {width: 1100px; margin: auto;}
nav.primary-menu .header-box > .main-logo {float: left;margin-top: 25px;}
nav.primary-menu ul.main-menu {float: right;}
nav.primary-menu ul.main-menu li.menu-item {float: left;}
nav.primary-menu ul.main-menu li.menu-item a:hover {background: url(/css-images/header-hover.png) bottom center no-repeat;}
nav.primary-menu ul.main-menu li.menu-item a {float: left;font-size: 18px;display: block;line-height: 100px;color: #f6f6f6;margin: 0 30px;}
nav.primary-menu ul.main-menu li.menu-item a:hover {color: #7ff7ff;}
nav.primary-menu ul.main-menu li.menu-item:hover a {color: #7ff7ff;}
nav.primary-menu ul.main-menu li:hover {}
nav.primary-menu ul.main-menu li.menu-item a.last {padding-right: 0;}



/* ==================================================
   <Footer>
================================================== */
footer { width: 100%; margin-left: auto; margin-right: auto; display: table; content: " "; }
footer.black {float: left;height: auto;color: #fff;width: 100%;bottom: 0;background: #262626;}
footer.black .footer-box {width: 1100px; margin: auto;}
footer.black .content {position:relative; width: 1100px; margin: auto; padding-top: 40px;}
footer.black .content .qrcode {position:absolute; top:40px; left:912px;}
footer.black em {color: #eee;}
footer.black p {color: #999;font-size: 13px;line-height: 20px;}
footer.black .footer-logo {float: left; margin-right: 20px;}
footer.black .ft-line {height: 40px; line-height: 41px; border-bottom: 1px solid #484848;}
footer.black .footer-box .footer-ul {margin: auto; width: 1100px;  color: #363636;list-style: none;}
footer.black .footer-box .footer-ul li {font-size: 12px; color: #ccc; float: left; margin-left: 40px;}
footer.black .footer-box .footer-ul li a {color: #bbb;}
footer.black .footer-box .footer-ul li:hover > a {color: #fff; font-weight: bold;}
footer.black .footer-box .footer-ul li:first-child {margin-left: 0;}
.footer-title {width: 175px;height: 70px;float: left;font-size: 14px;font-weight: 700;;}
.footer-title span {border-bottom: 1px solid #5ffbff;padding-bottom: 15px;}
.footer-cnt {float: left;width: 925px;height: 70px;}
.footer-copy {line-height: 50px;height: 50px;font-size: 12px;color: #bbb;background-color: #181818;;;;}
    .poweredbyhover {color: #aaa; }
    .poweredbyhover:hover {background: #111; color: #fff !important;}
span.num {font-size: 20px;}
    .bar{display:inline-block;overflow:hidden;width:0;height:11px;margin:-1px 10px 1px 10px;*margin:0 8px 0 5px;border-left:1px solid #888;vertical-align:middle}
.main-sec-price {position: absolute;bottom: 100px;font-size: 32px;}
.main-sec-price em { font-size: 20px; padding: 0 3px; font-style: normal;}
.main-btn2 {position: absolute;bottom: 100px;left: 320px;;}
/* ==================================================
   .Material-Process
================================================== */
.border-box
{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}





.img-responsive {width: 100%;display: block; max-width: 100%;height: auto;}

.small-interval {margin-top: 20px;}
.default-interval {margin-top: 40px;}
.large-interval {margin-top: 100px;}

.push-10 {margin-bottom: 10px !important;}
.push-20 {margin-bottom: 20px !important;}
.push-30 {margin-bottom: 30px !important;}
.push-40 {margin-bottom: 30px !important;}
.push-50 {margin-bottom: 50px !important;}



.center-align {text-align: center;}
.left-align {text-align: left;}
.right-align {text-align: right;}

.font-theme-color {color: #5bf4e4;}
.font-bold {font-weight: 700 !important;}
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-weight: inherit;
}
h1, .h1 {font-size: 36px;}
h2, .h2 {font-size: 30px;}
h3, .h3 {font-size: 24px;}
h4, .h4 {font-size: 20px;}
h5, .h5 {font-size: 16px;}
h6, .h6 {font-size: 14px;}


.multiple-layout {width: 1200px;}
.multiple-layout .side-block {width: 400px; float: left;}
.multiple-layout .cnt-block {width: 780px; margin-left: 20px; float: right;}


.doc-content { -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;color: #444; bottom: 0; right: 0; height: 45px; line-height: 45px;width: 100px; background-color: #444;width: 100px; position: absolute; background: #159ca5;}
.col-doc-3:hover {opacity: 0.8;}
.doc-content h5 {color: #fff;text-align: center;font-weight: normal;font-size: 14px;;}
.doc {margin-right: -10px;margin-left: -10px;}
.col-doc-2,.col-doc-4,.col-doc-6,.col-doc-12,.col-doc-5,.col-doc-7,.col-doc-3,.col-doc-5ro
{ padding-right: 10px; padding-left: 10px; float: left; position: relative; min-height: 1px;}
.col-doc-5ro {
    width: 216px;
}
.tile4 {margin-left: 25px;width: 248px; float: left;height: 177px;background: #333;position: relative;;}
.tile4.fir {margin-left: 0px;}
.col-doc-12 {width: 100%;}
.col-doc-6 {width: 50%;}
.col-doc-3 {width: 25%;}
.col-doc-4 {width: 33.33333333%;}
.col-doc-5 {width: 41.66666667%;}
.col-doc-7 {width: 58.33333333%;}
.col-doc-2{width:16.66666667%;}

.col-doc-5ro .stm-title {;\: 1;text-align: center;height: 53px;line-height: 53px;background: #888;color: #fff;font-weight: bold;;;;}
.col-doc-5ro .stm-item {text-align: center;height: 50px;line-height: 50px;font-size: 18px;}


.col-xs-4,.col-xs-6,.col-xs-12, .col-xs-3, .col-xs-7, .col-xs-5, .col-xs-8
{float: left; position: relative; min-height: 1px;padding: 0 0px;}
.col-xs-12 {width: 100%;}
.col-xs-6 {width: 50%;}
.col-xs-8 {width: 66.66666666%;}
.col-xs-4 {width: 33.33333333%;}
.col-xs-3 {width: 25%;}
.col-xs-5 {width: 41.66666667%;}
.col-xs-7 {width: 58.33333333%;}
.float-left {float: left;}
.float-right {float: right;}

.xs-content {height: 250px;text-align: center;font-size: 14px;color: #fff;padding-top: 55px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.xs-content .css-button { border: 2px solid white; color: white; border-radius: 25px; width: 180px; margin-top: 50px; height: 25px; line-height: 25px; font-size: 14px; }
.xs-content h2 {font-weight: bold;}


.animated-02 {
  -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.animated-color {transition: color 0.12s ease-out;-webkit-transition: color 0.12s ease-out;
}
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
}


/* ==================================================
   .CSS INPUT SYSTEM
================================================== */
.checkbox-large {width: 28px; height: 28px;}
.checkbox-medium {width: 22px; height: 22px;}
.checkbox-small {width: 18px; height: 18px;}
input[type="checkbox"].css-checkbox {
    display: inline-block;
    vertical-align: middle;
    -webkit-appearance: none;
    border-radius: 0;
    border: 1px solid #ccc;
    margin: 0;
    padding: 0;
    cursor: pointer;
    background: #fff;
    outline: none;
}

input[type="checkbox"].css-checkbox:checked { background: #ef656d url(../css-images/check.png) center no-repeat; background-size: 100% 100%; }
input[type="checkbox"].css-checkbox:hover {box-shadow: 0px 0px 4px 0px #b9b9b9;}
input[type="checkbox"].css-checkbox:active {box-shadow: 0px 0px 4px 0px #444;}
input[type="checkbox"].css-checkbox:disabled { background: #fff; }

label.css-radio  {cursor: pointer;text-align: center;background-size: 100% 100%;margin: 0;padding: 0;;}
.css-radio input {
  width: 0px;
  height: 0px;
  margin: 0;
  display: block;
}
.css-radio input + span .fa-check {display: none;}
.css-radio input:checked + span .fa-check {display: inline-block;font-size: 28px;padding-right: 3px;position: relative;top: 3px;;}
.css-radio input + span{
    display: block;
    background-color: #fff;
    border: 1px solid #aaa;
    width: 146px;
    height: 54px;
    line-height: 54px;
    font-size: 18px;
    position: relative;
    border-radius: 27px 0;
}
.css-radio input:checked + span {border-color: #ddd;border-width: 1px;background-color: #14a4c8;color: #fff;font-weight: 800;position: relative;}

label.css-img-radio input[type="radio"] {display: inline-block;width: 16px;height: 16px;vertical-align: middle;-webkit-appearance: none;border-radius: 0;border: 0;margin:0;padding:0;cursor: pointer;}
label.css-img-radio input[type="radio"] {outline:none; background: url(../css-images/artradio.png) no-repeat 0 0;}
label.css-img-radio input[type="radio"]:checked {background-position: 0 -16px;}
label.css-img-radio { cursor: pointer; font-size: 16px;display: inline-block; text-align: left;}
label.css-img-radio span {}

.select_sec {float: left;}
select.css-sel { background-color: #fff; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-family: 'Nanum Gothic', sans-serif; margin: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #d9d9d9; background: #fff url(../css-images/list-arrow.jpg) right center no-repeat; outline: none; position: relative; height: 47px; font-size: 14px; color: #333;line-height: 47px; text-align: center; letter-spacing: -1px;
}

select.css-sel.calendar {background: #fff url(../css-images/list-arrow.jpg) right top no-repeat;}
/* IE 10, 11의 네이티브 화살표 숨기기 */
select.css-sel::-ms-expand { display: none; }

input[type="text"].css-calendar { font-size: 14px; background-color: #fff; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: #fff url(../css-images/list-arrow.jpg) center right no-repeat; outline: none; margin: 0; min-width: 80px; height: 47px; line-height: 47px; border: 1px solid #d9d9d9; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: center;color: #333; position: relative; top: -1px; background-position-x: right;font-family: 'Nanum Gothic', sans-serif; letter-spacing: -1px;;}


.input-small {padding-right: 45px;padding-left: 28px;border-radius: 100px 100px;width: 110px !important;}
.input-medium {padding-right: 45px;padding-left: 28px;width: 227px !important;border-radius: 100px 100px;}
.input-large {padding-right: 45px;padding-left: 90px;width: 305px !important;border-radius: 100px 100px;font-weight: bold;}

/* ==================================================
   .Button
================================================== */
.css-button {
    font-family: 'Nanum Gothic', sans-serif;
    outline: none;
    min-width: 110px;
    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: 0px;
}



.css-button:hover { border-color: #000000; background: rgba(0, 0, 0, 0.15);}
.css-button:active {background-color: rgba(0, 0, 0, 0.25); border-color: #b1b1b1;}










/*  #Sub-page
---------------------------------------------------------------- */
.searchWrap h3 {display: inline-block;font-size: 32px;letter-spacing: -2px;padding-right: 8px;;}
.searchWrap h5 {font-size: 14px;display: inline-block;color: #777;font-family: 'NanumSquare' , '나눔스퀘어' , dotum , '돋움';font-weight: normal;;}
.jer-text .block-div {position: absolute;bottom: 0;width: 480px;background: #444;height: 60px;line-height: 60px;color: #fff;;}
.jer-text .block-div button {outline:none; float: right;width: 140px;text-align: center;font-size: 18px;background: #14a4c8;;}
.jer-text .block-div button:hover {background: #49bcd9;}
.jer-text .block-div button:active {background: #317f93;}
.jer-text .block-div .cp-box {float: left;padding-left: 30px;font-size: 18px;font-weight: bold;}
.jer-text .block-div .cp-box #chargepay {font-size: 28px;;padding-left: 13px;padding-right: 3px;vertical-align: top;}
.jer-text .block-div .cp-box span.won {vertical-align: sub;}
.jer-heading {}
.jer-text {width: 100%;float: left;position: relative;}
.jer-text p {font-size: 14px;line-height: 20px;;}
.jer-heading h4{color: #fff; font-size: 22px;}
.jer-heading h1{color: #7ff7ff; font-size: 40px;}
.jer-text .input-small {padding: 0 40px 0 30px;  text-align:left !important; border-radius: 15px 0;width: 110px !important;cursor: pointer;}
.jer-text .input-small:focus {box-shadow: 2px 2px 11px 0px #3c646e;}
.jer-text .input-medium {padding: 0 40px 0 30px;  text-align:left !important; width: 227px !important;border-radius: 15px 0;}
.jer-text .input-large {padding: 0 40px 0 30px;  text-align:left !important; width: 225px !important;border-radius: 15px 0;font-weight: bold;margin-right: 10px !important;padding: 0 40px 0 30px;;}
.jer-text .input-large2 {padding: 0 40px 0 30px;  text-align:left !important; width: 235px !important;border-radius: 15px 0;font-weight: bold;text-align: center;}
.jer-text ul.searchUl {width: 500px;float: left;margin-top: 30px;}
.jer-text .searchUl li {float: left;width: 50%;margin-bottom: 30px;}
.jer-text .searchUl h6 {margin-bottom: 10px}



.jar-option {width: 100% !important;}
.jar-option .row {}
.jar-option .col-xs-6 {padding: 10px;}

.plex .col-xs-2 {padding: 0 10px; width: 16.66666667%;float: left;position: relative;height: 165px; ;text-align: center;;}
.plex .row {margin-right: -10px; margin-left: -10px;margin-top: 45px;}
.plex .col-xs-2 .in-box {border:2px solid #14a4c8;height:165px;background:rgba(255, 255, 255, 0.75);}
.plex .col-xs-2 .in-box h3 {position: relative; margin:auto;margin-top: 110px;font-size: 20px;color: #2d5560;}

.how-to-charge .col-xs-6 {padding: 0 10px;}
.how-to-charge .col-xs-12 {position:relative; padding: 20px;background: #fff;border: 1px solid #d9d9d9; border-radius: 0 0 10px 10px;}
.how-to-charge .col-xs-12 a{color:#000;}
.how-to-charge .col-xs-12 .con01{font-size:14px;}
.how-to-charge .col-xs-12 img {position:absolute; top:12px; right:36px;}
.how-to-charge .special-heading {width: 100%;border: solid #d9d9d9;border-width: 1px 1px 0 1px;padding: 10px 20px;background: #159ca5;color: #fff;border-radius: 10px 10px 0 0;}



.how-to .col-xs-6 {padding: 0 10px;}
.how-to .col-xs-6:hover h1 {color: #444 !important;background: #fff460;padding: 0 10px;display: inline-block;;;;}
.how_guide_sub {/* width:100%; */background:#fff;padding:35px 30px;/* width:100%; */border:1px solid #888;}
.how_guide_sub h5 {margin-bottom:12px;font-size:18px;color:#333;padding-bottom:3px;border-bottom:2px solid #333;}
.how_guide_sub ul {margin-bottom:0px;}
.how_guide_sub ul li {margin-bottom:8px;padding-left:8px;background:url("/images/sub/spot.png") no-repeat 0 7px ;font-size:14px;color:#666;font-weight:200;}
.how_guide_sub ul li span {font-size:13px;font-weight:200;}
.how_guide_sub ul li.nobg{padding:0;background:none}
.how_guide_sub ul li > ul h6{margin:12px 0;font-size:15px;color:#333;font-weight:600;}
.how_guide_sub ul li > ul li{margin-bottom:8px;padding-left:13px;background:url("/images/sub/spot.png") no-repeat 5px 7px ;font-size:14px;color:#666;font-weight:200;}
.how_guide_sub p {margin-bottom:20px;font-size:14px;}
.how_guide_sub em {color: #ee1f60}








@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}
@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.jer-img-bomb {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
  position: absolute;right: 0;top: 80px;animation-delay: 0.5s;
}
@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.jer-text.form-runner {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}



























/********************************************************************************************/
/****************************************** reserv ******************************************/
/********************************************************************************************/
.order {position: relative; width: 100%; margin: 0 auto;}

table.tred {width:100%;border-top:solid 2px #666;border-bottom:dashed 1px #d3d3d5;margin-top:15px;font-size:14px;border-collapse: collapse;} 
table.tred th {font-size:14px;text-align:center;padding:12px 0;font-weight:600;color:#232a32;}
table.tred td {border-top:dashed 1px #d3d3d5; border-right: dashed 1px #ecedee;padding:20px 0;text-align:center;font-size:14px;vertical-align:middle;color:#333;font-weight:200;}
table.tred td.txt_left {padding-left:10px;text-align:left;} 
table.tred td.vat {vertical-align:top;}
table.tred td p.itm_title {font-size:14px;line-height:22px;color:#333;}
table.tred td p.itm_title span {font-size:14px;line-height:15px;vertical-align:0;}
table.tred td ul {margin-top:15px;}
table.tred td ul li {color:#888;font-size:14px;font-weight:200;line-height:20px;}
table.tred td.order_no {height:224px; background:#f4f4f4 url("/resourc/images/mypage/bg_order_no.png") no-repeat center 71px;padding-top:83px;font-size:14px;color:#888;font-weight:300;}
table.tred td.br {padding:0;height:3px;border-top:none;}
table.tred .clr66 {color:#666;}

table.tblk {width:100%;border-top:solid 2px #666;border-bottom:dashed 1px #d3d3d5;margin-top:15px;font-size:14px;border-collapse: collapse;} 
table.tblk th {font-size:14px;text-align:center;padding:12px 0;font-weight:600;color:#232a32;}
table.tblk td {border-top:dashed 1px #d3d3d5; border-right: dashed 1px #ecedee;padding:20px 0;text-align:center;font-size:15px;vertical-align:middle;color:#333;font-weight:200;}
table.tblk td > .thumb {float:none;width:100px;display:block;margin:0 auto}
table.tblk td > .thumb img {vertical-align:middle}
table.tblk td:last-child {border-right:0;font-size:16px;font-weight:bold}
table.tblk td.txt_left {padding-left:10px;text-align:left;} 
table.tblk td.vat {vertical-align:top;}
table.tblk td p.itm_title {font-size:14px;line-height:22px;color:#333;}
table.tblk td p.itm_title span {font-size:14px;line-height:15px;vertical-align:0;}
table.tblk td ul {margin-top:15px;}
table.tblk td ul li {color:#888;font-size:14px;font-weight:200;line-height:20px;}
table.tblk td.order_no {height:224px; background:#f4f4f4 url("/resourc/images/mypage/bg_order_no.png") no-repeat center 71px;padding-top:83px;font-size:14px;color:#888;font-weight:300;}
table.tblk td.br {padding:0;height:3px;border-top:none;}
table.tblk .clr66 {color:#666;}



/* 테이블 */
.table_both_area{width:100%;clear:both}
.table_both_area:after {content:" ";display:block;clear:both;}
.table_area {}
.table_area.half49{float: left;width: 50%;}
.table_area.nomg{margin:10px auto 0;}
.tbl_top {position:relative;height:30px;display:block;margin-top:50px;}
.tbl_top h3:after , .tbl_top:after {content:" ";display:block;clear:both;}
.tbl_top h3 {display:block;float:left;position:absolute;top: 18px;left:0;margin-right:8px;color:#666;font-size: 28px;font-weight: normal;vertical-align:middle;}

.tbl_top select.srch_select_border{position:absolute;top:-5px ;right:0px;padding:0 10px;width:160px;height:36px;line-height:36px;border:1px solid #8c908e;border-radius:5px;font-size:15px;font-weight:300;color:#333;margin-right:1px}

.checkALL {position:absolute;top: 15px;right:0;font-size: 18px;letter-spacing: -.3px;text-align: center;text-align: right;}
.checkALL label {padding-left: 5px; line-height: 18px;}


/**/
table.tbl_order {position:relative;}
table.tbl_order td {padding:20px 6px 15px;}
table.tbl_order td:after {content:" ";display:block;clear:both;}
table.tbl_order th {padding-left:6px;padding-right:6px;}
table.tbl_order tbody td ul li {line-height:18px;}
table.tbl_order tbody .verti_top {vertical-align:top;}
table.tbl_order .thumb {float:left;width:100px;margin-right:15px;}
table.tbl_order .thumb img {vertical-align:middle}
table.tbl_order tbody .verti_top .prd_info_area {float:left;/*width:60%;*/margin-top:-2px;text-align:left;}
table.tbl_order tbody .verti_top .prd_info_area .prd_info {vertical-align:middle;margin-top:0px;}
table.tbl_order tbody .verti_top .prd_info_area .prd_info > li {margin-bottom:6px;}
table.tbl_order tbody .verti_top .prd_info_area .prd_info > li.prd_name {font-size: 15px; color: #14a4c8; font-weight: 600;}
table.tbl_order tbody .verti_top .prd_info_area .prd_info > li.prd_option {}
table.tbl_order .prd_price {color:#333;font-size:16px;}
table.tbl_order .prd_price strong {margin-right:2px;color:#333;font-size:22px;font-weight: normal;letter-spacing:-1px;}
table.tbl_order .prd_price span {color:#333;font-size:16px;vertical-align:2px;}
table.tbl_order .prd_price p {display:block;margin-top:8px;}
table.tbl_order .price_sale {color:#333;font-size:18px;letter-spacing:-1px}
table.tbl_order .price_sale strong {font-weight: normal;}
table.tbl_order .price_discount {color:#333;font-size:16px;}
table.tbl_order .price_discount span {color:#333;font-size:16px;vertical-align:2px;}
table.tbl_order .price_discount strong {margin-right:2px;color:#333;font-size:22px;font-weight: normal;letter-spacing:-1px;}
table.tbl_order .coupon_discount_amount {color:#666;font-size:14px;}
table.tbl_order .coupon_discount_amount p {font-size: 16px;}
table.tbl_order .coupon_discount_amount span {color:#666;font-size:14px;vertical-align:1px;}
table.tbl_order .coupon_discount_amount strong {margin-right:2px;color:#666;font-size:16px;}


/*테이블*/
.tbl_style_01 {width: 100%; margin-top: 15px; border-bottom: solid 1px #c6c6c6;border-top: 2px solid #666; }
.tbl_style_01 tbody > tr {border-top:1px solid #e5e5e5;}
.tbl_style_01 tbody > tr:first-child {border-top:0px solid #fff;}
.tbl_style_01 tbody th {background: #f9f9f9;border-right: solid 1px #ecedee;padding:15px 10px 15px 16px;color:#333;font-size:14px;line-height;1;font-weight:600;text-align:left;vertical-align:middle;}
.tbl_style_01 tbody th label {color:#333;font-size:14px;line-height;1;font-weight:500;text-align:left;}
.tbl_style_01 tbody td {padding:15px 10px 15px 10px; font-size:14px;}
.tbl_style_01 tbody td ul.credit_area{width:100%;border:1px dashed #e5e5e5;padding:5px 0}
.tbl_style_01 tbody td ul.credit_area li{padding:5px 10px}
.tbl_style_01 tbody td ul.credit_area li input[type="text"] {margin-right:10px;height:22px !important;width:100px;padding:0 10px;vertical-align:-1px;margin-left:5px}
.tbl_style_01 tbody td button {margin-right:2px;}
.tbl_style_01 tbody td input {margin-right:10px;}
.tbl_style_01 tbody td input[type="text"] {margin-right:10px;}
.tbl_style_01 tbody td input[type="text"] {padding: 6px 10px; width: 250px; height: 20px; border: 1px solid #ccc; font-size: 14px; font-weight: 300; color: #000;}
.tbl_style_01 tbody td input[type="text"].send_name {padding: 6px 10px; width: 120px; height: 20px; border: 1px solid #ccc; font-size: 14px; font-weight: 300; color: #000;}
.tbl_style_01 tbody td input[type="password"] {margin-right:10px;}
.tbl_style_01 tbody td input[type="password"] {padding: 6px 10px; width: 250px; height: 20px; border: 1px solid #ccc; background: #ebebeb; font-size: 14px; font-weight: 300; color: #000;}

.tbl_style_02 {width: 100%; margin-top: 15px; border-top: 1px solid #666; border-bottom: solid 1px #c6c6c6; }
.tbl_style_02 tbody > tr {border-top:1px dashed #e4e4e4;}
.tbl_style_02 tbody > tr:first-child {border-top:0px}
.tbl_style_02 tbody th {background: #f9f9f9;border-right: dashed 1px #ecedee;padding:15px 10px 15px 16px;color:#333;font-size:14px;line-height;1;font-weight:600;text-align:left;vertical-align:middle;}
.tbl_style_02 tbody th label {color:#333;font-size:14px;line-height;1;font-weight:500;text-align:left;}
.tbl_style_02 tbody td {padding:15px 10px 15px 10px; font-size:14px;}
.tbl_style_02 tbody td ul.credit_area{width:100%;border:1px dashed #e5e5e5;padding:5px 0}
.tbl_style_02 tbody td ul.credit_area li{padding:5px 10px}
.tbl_style_02 tbody td ul.credit_area li input[type="text"] {margin-right:10px;height:22px !important;width:100px;padding:0 10px;vertical-align:-1px;margin-left:5px}
.tbl_style_02 tbody td button {margin-right:2px;}
.tbl_style_02 tbody td input {margin-right:10px;}
.tbl_style_02 tbody td input[type="text"] {margin-right:10px;}
.tbl_style_02 tbody td input[type="text"] {padding: 6px 10px; width: 250px; height: 20px; border: 1px solid #e4e4e4; font-size: 14px; font-weight: 300; color: #000;}
.tbl_style_02 tbody td input[type="text"].send_name {padding: 6px 10px; width: 120px; height: 20px; border: 1px solid #e4e4e4; font-size: 14px; font-weight: 300; color: #000;}
.tbl_style_02 tbody td input[type="password"] {margin-right:10px;}
.tbl_style_02 tbody td input[type="password"] {padding: 6px 10px; width: 250px; height: 20px; border: 1px solid #e4e4e4; background: #ebebeb; font-size: 14px; font-weight: 300; color: #000;}
.tbl_style_02 tbody td textarea {width:680px;height:80px;border:1px solid #e4e4e4;font-size:14px;padding:6px 10px}

.tbl_style_03 {width: 100%; margin-top: 15px; border-top: 2px solid #666; border-bottom: solid 1px #c6c6c6; }
.tbl_style_03 tbody > tr {border-top:1px solid #e5e5e5;}
.tbl_style_03 tbody > tr:first-child {border-top:0px solid #fff;}
.tbl_style_03 tbody th {background: #f9f9f9;border-right: solid 1px #ecedee;padding:15px 10px 15px 16px;color:#333;font-size:14px;line-height;1;font-weight:600;text-align:center;vertical-align:middle;}
.tbl_style_03 tbody th label {color:#333;font-size:14px;line-height;1;font-weight:500;text-align:left;}
.tbl_style_03 tbody th:last-child {border-right:0}
.tbl_style_03 tbody td {padding:15px 10px 15px 10px; font-size:14px;text-align:center;border-right:1px dashed #e5e5e5;}
.tbl_style_03 tbody tr td:nth-child(4) {text-align:left}
.tbl_style_03 tbody tr td:last-child {border-right:none}
.tbl_style_03 tbody td ul.credit_area{width:100%;border:1px dashed #e5e5e5;padding:5px 0}
.tbl_style_03 tbody td ul.credit_area li{padding:5px 10px}
.tbl_style_03 tbody td ul.credit_area li input[type="text"] {margin-right:10px;height:22px !important;width:100px;padding:0 10px;vertical-align:-1px;margin-left:5px}
.tbl_style_03 tbody td button {margin-right:2px;}
.tbl_style_03 tbody td input {margin-right:10px;}
.tbl_style_03 tbody td input[type="text"] {margin-right:10px;}
.tbl_style_03 tbody td input[type="text"] {padding: 6px 10px; width: 250px; height: 20px; border: 1px solid #ccc; font-size: 14px; font-weight: 300; color: #000;}
.tbl_style_03 tbody td input[type="text"].send_name {padding: 6px 10px; width: 120px; height: 20px; border: 1px solid #ccc; font-size: 14px; font-weight: 300; color: #000;}
.tbl_style_03 tbody td input[type="password"] {margin-right:10px;}
.tbl_style_03 tbody td input[type="password"] {padding: 6px 10px; width: 250px; height: 20px; border: 1px solid #ccc; background: #ebebeb; font-size: 14px; font-weight: 300; color: #000;}



.expect_amount {width:100%;display:table;position:relative; border: 1px dashed #515151; border-width:1px 0; background:url(/css-images/rsv_arrow.png) no-repeat 0 0; box-sizing: border-box; margin:10px auto;}
.expect_amount ul.top_amount {height:90px;}
.expect_amount ul.top_amount:after {content:" ";display:block;clear:both;}
.expect_amount ul.top_amount > li {float:left;width:25%;height:90px; /*border-left:1px solid #d9d9d9;*/ text-align:right;}
/*.expect_amount ul.top_amount > li:first-child {width:314px;border-left:0px;}*/
/*.expect_amount ul.top_amount > li.last {width:350px}*/
.expect_amount ul.top_amount > li h3 {margin-bottom:2px;padding-top:18px;padding-right:40px;color:#333;font-size:14px;font-weight: 600;}
.expect_amount ul.top_amount > li p {padding-right:40px;color:#333;font-size:26px;}
.expect_amount ul.top_amount > li p > span {color:#333;font-size:20px;vertical-align:2px;}
.expect_amount ul.top_amount > li p > span.ft_red {color:#14a4c8;font-size:32px;font-weight:500;vertical-align:0;}
.expect_amount ul.top_amount > li.last h3 {padding-right: 20px;}
.expect_amount ul.top_amount > li.last p {padding-right:20px;}
.expect_amount span.icon_minus {position:absolute;top: 25px;left: 310px;}
.expect_amount span.icon_plus {position:absolute;top: 25px;left: 590px;}
.expect_amount span.icon_total {position:absolute;top: 25px;left: 880px;}
.expect_amount ul.bg_gray  {width:1170px;background:#f4f4f4;border-top:2px solid #eaeaea;}
.expect_amount ul.bg_gray  > li {display:table-cell;background:#f4f4f4;width:250px;padding:12px 0;border-left:1px solid #d9d9d9;text-align:right;}
.expect_amount ul.bg_gray  > li:after {content:" ";display:block;clear:both;}
.expect_amount ul.bg_gray  > li:first-child {width:314px;border-left:0px;}
.expect_amount ul.bg_gray  > li.last {width:350px}
.expect_amount ul.bg_gray  > li h3 {float:left;margin-bottom:0px;padding-top:0px;padding-left:24px;color:#333;font-size:13px;width:130px;text-align:left;}
.expect_amount ul.bg_gray  > li p {padding-right:20px;color:#333;font-size:13px;}
.expect_amount ul.bg_gray  > li p > span {margin-left:2px;color:#333;font-size:13px;vertical-align:1px;line-height:1;}

  .table_area textarea {width: 680px; height: 80px;border: 1px solid #ccc;font-size:14px;padding: 6px 10px;}
  .payment_total {color: #333; font-size: 20px; font-weight: 500;}

/*약관동의*/
.terms_sec {margin:40px auto; overflow: hidden;}
.terms_sec ul.list_age {margin-top: 15px;overflow: hidden;border:1px dashed #e5e5e5;border-top:2px solid #666;border-width:2px 0 1px 1px}
.terms_sec ul.list_age li {float: left; width: 263px; border-right:1px dashed #e5e5e5;}
.terms_sec ul.list_age li:last-child{width:266px;}
.terms_sec ul.list_age li .head {position: relative; height: 18px; padding: 18px 16px 15px 16px; }
.terms_sec ul.list_age li .head > h3 {float: left; font-size: 16px; font-weight:bold}
.terms_sec ul.list_age li .head p {float: right;}
.terms_sec ul.list_age li .head p > label {font-size: 14px;}
.terms_sec span.checks label {color: #101010; font-size: 14px;}
.terms_sec ul.list_age li .agree_content {padding: 16px 8px 16px 16px;border-top:1px dashed #e5e5e5;overflow-x: hidden;max-height:180px;}
.terms_sec ul.list_age li .agree_content pre {height: 180px; color: #666; font-size: 12px; line-height: 1.6; background: transparent; border: 0;}
.terms_sec ul.list_age li .agree_content pre {word-wrap: break-word; white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-break: break-all; overflow-x: hidden;}



  .rsv_btn_area {width: 30%; padding: 20px 0; margin: 20px auto 40px; background: #fff;}
  .rsv_btn_area .area_wrap {margin: 0 auto; text-align: center; overflow: hidden;}




/*체크박스*/
.checks {position: relative;}

.checks input[type="checkbox"] {  /* 실제 체크박스는 화면에서 숨김 */
  position: absolute;
   width: 1px;
   height: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
   clip:rect(0,0,0,0);
   border: 0
}
.checks input[type="checkbox"] + label {
  display: inline-block;
  position: relative;
  padding-left: 30px;  /* 글자와 체크박스 사이의 간격을 변경 */
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.checks input[type="checkbox"] + label:before {  /* 가짜 체크박스 */
  content: '';
  position: absolute;
  left: 0;
  top: -1px;  /* 이 값을 변경해서 글자와의 정렬 */
  width: 18px;  /* 체크박스의 너비를 지정 */
  height: 18px;  /* 체크박스의 높이를 지정 */
  line-height: 18px; /* 세로정렬을 위해 높이값과 일치 */
  text-align: center;  
  background: #fafafa;
  border: 1px solid #cacece;
  border-radius : 1px;
}
.checks input[type="checkbox"] + label:active:before,
.checks input[type="checkbox"]:checked + label:active:before {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

.checks input[type="checkbox"]:checked + label:before {  /* 체크박스를 체크했을때 */ 
  content: '\2714';  /* 체크표시 유니코드 사용 */
  color: #333;
  background: #fff;
  border-color: #cacece;
  /*color: #99a1a7;
  text-shadow: 1px 1px #fff;
  background: #e9ecee;
  border-color: #adb8c0;*/
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
}

.checks.small input[type="checkbox"] + label {
  font-size: 13px;
}

.checks.small input[type="checkbox"] + label:before {
  width: 17px;
  height: 17px;
  line-height: 17px;
  font-size: 13px;
  font-weight: 600;
}



button.btn_gray_50{
      display: inline-block;
      width: 50%;
      height:52px;
      background-color: #555;
      color: #fff;
      text-align: center;
      vertical-align: middle;
      font-size: 16px;
      font-weight: bold;
      line-height:52px;
  }