@import url(https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&display=swap);
@charset "UTF-8";

@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: normal;
  src: url("/fonts/NotoSansKR-Regular.woff2") format("woff2"),
    url("/fonts/NotoSansKR-Regular.woff") format("woff"),
    url("/fonts/NotoSansKR-Regular.otf") format("otf");
}

@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 300;
  src: url("/fonts/NotoSans-Light.woff2") format("woff2"),
    url("/fonts/NotoSans-Light.woff") format("woff"),
    url("/fonts/NotoSans-Light.otf") format("otf");
}

@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 500;
  src: url("/fonts/NotoSans-Medium.woff2") format("woff2"),
    url("/fonts/NotoSans-Medium.woff") format("woff"),
    url("/fonts/NotoSans-Medium.otf") format("otf");
}

@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 600;
  src: url("/fonts/NotoSans-Bold.woff2") format("woff2"),
    url("/fonts/NotoSans-Bold.woff") format("woff"),
    url("/fonts/NotoSans-Bold.otf") format("otf");
}

/* CSS reset */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
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,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 12px;
  vertical-align: baseline;
  background: transparent;
  -webkit-text-size-adjust: none;
  font-family: "Open Sans", sans-serif;
  list-style: none;
  line-height: 1;
}

em,
address {
  font-style: normal;
}
hr {
  display: none;
}
body {
  line-height: 1;
  word-break: break-all;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}
table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
  word-break: break-all;
}
table th,
table td {
  vertical-align: middle;
}
fieldset {
  margin: 0;
  padding: 0;
  border: 0 none;
}
legend,
caption,
.skip {
  position: absolute;
  left: -9999px;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
}
caption {
  position: static;
}

html,
body,
input,
button,
textarea {
  font-size: 12px;
  color: #888;
  font-family: "Open Sans", sans-serif;
}

a {
  color: #a7a7a7;
  text-decoration: none;
}
a:hover {
  color: #a7a7a7;
  text-decoration: none;
}
img,
input {
  vertical-align: top;
}
label {
  vertical-align: middle;
  font-size: 14px;
  cursor: pointer;
}
select {
  height: 24px;
  margin: 0;
  border: 1px solid #dcdcdc;
  padding: 0;
  font-size: 13px;
  vertical-align: middle;
  color: #666;
  cursor: pointer;
}
textarea {
  border: 1px solid #dcdcdc;
  color: #888;
  font-size: 13px;
  line-height: 18px;
  padding: 5px;
  overflow-y: auto;
  resize: none;
  -webkit-appearance: none;
  border-radius: 0;
  font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6,
th,
strong {
  font-weight: 600;
}
select {
  font-family: "Open Sans", sans-serif;
}

/* html5 reset */
header,
footer,
section,
article,
aside,
nav,
hgroup,
details,
menu,
figure,
figcaption,
canvas {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
input {
  -webkit-appearance: none;
  border-radius: 0;
  padding: 0;
  margin: 0;
  -webkit-border-radius: 0;
}
input[type="text"] {
  -webkit-appearance: none;
}
input[type="text"]::-ms-clear {
  display: none;
}

/* skip */
a.skipNavi {
  position: absolute;
  display: block;
  width: 100%;
  left: 0;
  text-align: center;
  top: -10000px;
  z-index: 500;
  font-size: 1.3em;
}
a.skipNavi:hover,
a.skipNavi:focus,
a.skipNavi:active {
  position: absolute;
  top: 0;
  padding: 15px 0;
  font-weight: bold;
  color: #fff;
  background: #1d60a7;
  z-index: 500;
}
a:active,
a:focus {
  outline: 0;
  border: none;
  -moz-outline-style: none;
}

/******************** layout ********************/
html {
  width: 100%;
  min-height: 840px;
  overflow-x: hidden;
}
html {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
body {
}

/*** base wrap ***/
#allwrap {
  width: 100%;
  margin: 0 auto;
  min-width: 320px;
}
#allwrap:after {
  content: '';
  display: block;
  clear: both;
}
#allBg {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #1b1b1c;
  opacity: 0.6;
  overflow: hidden;
  z-index: 200;
}
#wrap {
  position: relative;
  width: 100%;
}
#wrap:after {
  content: '';
  display: block;
  clear: both;
}

/* loading */
#loading {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
}
#loading .loadingBg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #1b1b1c;
  opacity: 0.6;
  z-index: 50;
}
#dots {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  height: 50px;
  width: 50px;
  margin: -25px 0 0 -25px;
  z-index: 60;
}
#dots span {
  position: absolute;
  width: 10px;
  height: 10px;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 50%;
  -webkit-animation: dots 1s infinite ease-in-out;
  animation: dots 1s infinite ease-in-out;
}
#dots span:nth-child(1) {
  left: 0px;
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
#dots span:nth-child(2) {
  left: 15px;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
#dots span:nth-child(3) {
  left: 30px;
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}
#dots span:nth-child(4) {
  left: 45px;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}

@keyframes dots {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    background: #d62d20;
  }
  25% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    background: #ffa700;
  }
  50% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    background: #008744;
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    background: #0057e7;
  }
}
@-webkit-keyframes dots {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    background: #d62d20;
  }
  25% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    background: #ffa700;
  }
  50% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    background: #008744;
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    background: #0057e7;
  }
}
/** END of dots */

/*** content ***/
#content {
  position: relative;
  width: 100%;
  z-index: 10;
}
#content:after {
  content: '';
  display: block;
  clear: both;
}

/*** base inbox ***/
.layoutOutbox {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0 0 150px 0;
}
.layoutOutbox:after {
  content: '';
  display: block;
  clear: both;
}

.guideLayout {
  position: relative;
  max-width: 1240px;
  margin: 0 auto;
}
.guideLayout:after {
  content: '';
  display: block;
  clear: both;
}

/*** header ***/
header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 140px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  overflow: hidden;
  z-index: 100;
}
header h1 {
  position: absolute;
  left: 0;
  top: 51px;
  z-index: 30;
}
header h1 a {
  display: inline-block;
  width: 230px;
  height: 36px;
  background: url('/img/img_logo.png') left top no-repeat;
}

header .naviBox {
  float: right;
  margin: 0 154px 0 0;
}
header .naviBox .mlogin {
  display: none;
}
header .naviBox .maccount {
  display: none;
}
header .naviBox .myAccount {
  display: none;
}
header .naviBox .myLogout {
  display: none;
}

header .naviBox .navi {
}
header .naviBox .navi:after {
  content: '';
  display: block;
  clear: both;
}
header .naviBox .navi > ul:after {
  content: '';
  display: block;
  clear: both;
}
header .naviBox .navi > ul > li {
  display: inline-block;
  text-align: center;
  margin: 0 23px;
}
header .naviBox .navi > ul > li > a {
  display: block;
  font-size: 19px;
  color: #fff;
  line-height: 140px;
  font-weight: 600;
  letter-spacing: 1.5px;
}
header .naviBox .navi > ul > li > a.on {
  color: #fbc61e;
}
body.hoverOk header .naviBox .navi > ul > li:hover > a {
  color: #fbc61e;
}

header .naviBox .navi > ul > li > div {
  position: absolute;
  left: 0;
  top: 140px;
  width: 20%;
  height: 314px;
  border-left: 1px #ccc solid;
  box-sizing: border-box;
}
header .naviBox .navi > ul > li > div p {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  font-weight: 600;
  padding: 22px 0 0 12.9%;
  text-align: left;
}
header .naviBox .navi > ul > li > div ul {
}
header .naviBox .navi > ul > li > div ul:after {
  content: '';
  display: block;
  clear: both;
}
header .naviBox .navi > ul > li > div ul li {
  display: block;
  text-align: left;
}
header .naviBox .navi > ul > li > div ul li a {
  display: block;
  width: 100%;
  padding: 9px 0 0 12.9%;
  box-sizing: border-box;
}
header .naviBox .navi > ul > li > div ul li a span {
  position: relative;
  font-size: 14px;
  color: #666;
  line-height: 1.2;
}
header .naviBox .navi > ul > li > div ul li a span u {
  text-decoration: none;
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 1px;
  background: #666;
}
header .naviBox .navi > ul > li > div ul li a span.active {
  color: #fbc61e;
}
header .naviBox .navi > ul > li > div ul li a span.active u {
  background: #fbc61e;
}
header .naviBox .navi > ul > li:nth-child(1) div {
  left: 0;
}
header .naviBox .navi > ul > li:nth-child(2) div {
  left: 20%;
}
header .naviBox .navi > ul > li:nth-child(3) div {
  left: 40%;
}
header .naviBox .navi > ul > li:nth-child(4) div {
  left: 60%;
}
header .naviBox .navi > ul > li:nth-child(5) div {
  left: 80%;
  border-right: 1px #ccc solid;
}
header .naviBox .navi.five > ul > li > div {
  width: 20%;
}
header .naviBox .navi.type > ul > li:nth-child(1) div {
  left: 0;
}
header .naviBox .navi.type > ul > li:nth-child(2) div {
  left: 20%;
}
header .naviBox .navi.type > ul > li:nth-child(3) div {
  left: 40%;
}
header .naviBox .navi.type > ul > li:nth-child(4) div {
  left: 60%;
}
header .naviBox .navi.type > ul > li:nth-child(5) div {
  left: 80%;
  border-right: 1px #ccc solid;
}

header .naviBox .navi.four > ul > li > div {
  width: 25%;
}
header .naviBox .navi.four > ul > li:nth-child(1) div {
  left: 0;
}
header .naviBox .navi.four > ul > li:nth-child(2) div {
  left: 25%;
}
header .naviBox .navi.four > ul > li:nth-child(3) div {
  left: 50%;
}
header .naviBox .navi.four > ul > li:nth-child(4) div {
  left: 75%;
  border-right: 1px #ccc solid;
}
header .util {
  position: absolute;
  right: 0;
  top: 56px;
}
header .util ul:after {
  content: '';
  display: block;
  clear: both;
}
header .util ul li {
  position: relative;
  float: left;
}
header .util ul li:after {
  content: '|';
  position: absolute;
  right: 0;
  top: -1px;
  font-size: 11px;
  color: #fff;
  line-height: 30px;
}
header .util ul li a {
  display: inline-block;
  font-size: 14px;
  color: #fff;
  line-height: 30px;
  letter-spacing: 1px;
  padding: 0 17px;
}
header .util ul li:last-child:after {
  display: none;
}

header.fixed {
  height: 120px;
  background: #fff;
  border-bottom: 1px #ccc solid;
}
header.fixed h1 {
  top: 42px;
}
header.fixed h1 a {
  background: url('/img/img_logo_on.png') left top no-repeat;
}
header.fixed .guideLayout {
  border-bottom: 1px #ccc solid;
}
header.fixed .naviBox .navi > ul > li > a {
  color: #000;
  line-height: 120px;
}
header.fixed .util {
  top: 45px;
}
header.fixed .util ul li a {
  color: #000;
}
header.fixed .util ul li:after {
  color: #000;
}
header.fixed .naviBox .navi > ul > li > div {
  top: 120px;
}

header.on {
  height: 432px;
  background: #fff;
  border-bottom: 1px #ccc solid;
}
header.on h1 a {
  background: url('/img/img_logo_on.png') left top no-repeat;
}
header.on .guideLayout {
  border-bottom: 1px #ccc solid;
}
header.on .naviBox .navi > ul > li > a {
  color: #000;
}
header.on .util ul li a {
  color: #000;
}
header.on .util ul li:after {
  color: #000;
}
header.on .line {
  display: block;
}

header.fixed.on .naviBox .navi > ul > li > div {
  top: 120px;
}

header .line {
  display: none;
  position: absolute;
  left: 0;
  top: 140px;
  width: 100%;
  height: 1px;
  background: #ccc;
  z-index: 10;
  overflow: hidden;
}
header.fixed.on .line {
  top: 120px;
}

#naviOpen {
  display: none;
}

/*** silde app btn ***/
.slideAppWrap {
  position: relative;
  width: 1460px;
  margin: 0 auto;
}
.slideAppWrap:after {
  content: '';
  display: block;
  clear: both;
}
.slideApp {
  position: absolute;
  right: -20px;
  top: 0;
  z-index: 99;
}
.slideApp a {
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  width: 95px;
  height: 140px;
  background: url('/img/bg/bg_slide_app_btn.png') left top no-repeat;
}
.slideApp a span {
  display: block;
  font-size: 24px;
  color: #000;
  line-height: 1.1;
  font-weight: 800;
  text-align: left;
  padding: 5px 0 0 16px;
}

/***** main section *****/
#mainSection {
  width: 100%;
  overflow: hidden;
}

#mainVisible {
  width: 100%;
  overflow: hidden;
}
#mainVisible .mvSlide {
  position: relative;
  width: 100%;
  height: 810px;
  overflow: hidden;
}
#mainVisible .mvSlide:before {
  position: absolute;
  left: 0;
  top: 0;
  content: '';
  width: 80%;
  height: 800px;
  background: #000;
}
#mainVisible .mvSlide:after {
  position: absolute;
  right: 0;
  top: 0;
  content: '';
  width: 1068px;
  height: 100%;
  background: url('/img/img_mainvisible_bg.png') left top no-repeat;
}
#mainVisible .mvSlide .img {
  position: absolute;
  left: 50%;
  top: 0;
  margin: 0 0 0 -620px;
  z-index: 2;
}
#mainVisible .mvSlide .txt {
  position: absolute;
  left: 0;
  top: 50%;
  margin: -123px 0 0 0;
  z-index: 2;
  word-break: keep-all;
}
#mainVisible .mvSlide .txt strong {
  display: block;
  font-size: 65px;
  color: #fff;
  line-height: 1.1;
  font-weight: 800;
  padding: 0 0 30px 0;
}
#mainVisible .mvSlide .txt strong span {
  display: block;
  font-size: 65px;
}
#mainVisible .mvSlide .txt p {
  font-size: 18px;
  color: #fff;
  line-height: 1.4;
}
#mainVisible .mvSlide .txt p span {
  display: block;
  font-size: 18px;
  color: #fff;
  line-height: 1.4;
}
#mainVisible .guideLayout {
  height: 100%;
}

#sector1 {
  width: 100%;
  margin: 90px 0 110px 0;
  text-align: center;
  overflow: hidden;
}
#sector1 .ico {
  width: 100%;
  padding: 0 0 24px 0;
  overflow: hidden;
}
#sector1 .txt {
  width: 100%;
  overflow: hidden;
  word-break: keep-all;
}
#sector1 .txt span {
  display: block;
  font-size: 20px;
  color: #000;
  line-height: 1.3;
  font-weight: 300;
}
#sector1 .txt span strong {
  font-size: 20px;
  font-weight: 700;
}

#sector2 {
  width: 100%;
  margin: 0 0 120px 0;
}
#sector2:after {
  content: '';
  display: block;
  clear: both;
}
#sector2 .img {
  float: right;
  width: 50%;
  overflow: hidden;
}
#sector2 .cimg {
  position: absolute;
  left: 50%;
  bottom: 0;
  margin: 0 0 0 -210px;
}
#sector2 .txtArea {
  position: absolute;
  left: 0;
  top: 64px;
  word-break: keep-all;
}
#sector2 .txtArea .tit {
  font-size: 48px;
  color: #000;
  line-height: 1.2;
  font-weight: 800;
  padding: 0 0 10px 0;
}
/* #sector2 .txtArea ul:after {
  content: '';
  display: block;
  clear: both;
} */

#sector2 .txtArea ul li {
  position: relative;
  display: block;
  font-size: 20px;
  color: #999;
  line-height: 1.2;
  padding: 0 0 0 23px;
}

/* #sector2 .txtArea ul li:after {
  content: "*";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 20px;
} */

#sector3 {
  width: 100%;
  margin: 0 0 120px 0;
}
#sector3:after {
  content: '';
  display: block;
  clear: both;
}
#sector3 .img {
  width: 50%;
  overflow: hidden;
}
#sector3 .cimg {
  position: absolute;
  left: 50%;
  bottom: 0;
  margin: 0 0 0 -152px;
}
#sector3 .txtArea {
  position: absolute;
  left: 58%;
  top: 72px;
  word-break: keep-all;
}
#sector3 .txtArea .tit {
  font-size: 48px;
  color: #000;
  line-height: 1.2;
  font-weight: 800;
  padding: 0 0 10px 0;
}
#sector3 .txtArea ul:after {
  content: '';
  display: block;
  clear: both;
}
#sector3 .txtArea ul li {
  position: relative;
  display: block;
  font-size: 20px;
  color: #999;
  line-height: 1.2;
  padding: 0 0 0 23px;
}
/* #sector3 .txtArea ul li:after {
  content: '*';
  position: absolute;
  left: 0;
  top: 0;
  font-size: 20px;
} */

#sector4 {
  width: 100%;
  margin: 0 0 100px 0;
}
#sector4:after {
  content: '';
  display: block;
  clear: both;
}
#sector4 .img {
  float: right;
  width: 50%;
  overflow: hidden;
}
#sector4 .cimg {
  position: absolute;
  left: 50%;
  bottom: 0;
  margin: 0 0 0 -164px;
}
#sector4 .txtArea {
  position: absolute;
  left: 0;
  top: 80px;
  word-break: keep-all;
}
#sector4 .txtArea .tit {
  font-size: 48px;
  color: #000;
  line-height: 1.2;
  font-weight: 800;
  padding: 0 0 10px 0;
}
#sector4 .txtArea ul:after {
  content: '';
  display: block;
  clear: both;
}
#sector4 .txtArea ul li {
  position: relative;
  display: block;
  font-size: 20px;
  color: #999;
  line-height: 1.2;
  padding: 0 0 0 23px;
}
/* #sector4 .txtArea ul li:after {
  content: '*';
  position: absolute;
  left: 0;
  top: 0;
  font-size: 20px;
} */

#sector5 {
  width: 100%;
  margin: 0 0 100px 0;
}
#sector5:after {
  content: '';
  display: block;
  clear: both;
}
#sector5 .info {
  position: absolute;
  left: 0;
  top: 0;
  width: 25%;
  height: 310px;
  background: #000;
}
#sector5 .info span {
  display: inline-block;
  font-size: 60px;
  color: #fcc800;
  line-height: 1.2;
  font-weight: 800;
  padding: 25px 0 0 28px;
}
#sector5 .info a {
  position: absolute;
  bottom: 20px;
  display: inline-block;
  width: 40px;
  height: 40px;
}
#sector5 .info a.slidePrev {
  right: 59px;
  background: url('/img/btn/btn_main_slide_prev.png') left top no-repeat;
}
#sector5 .info a.slideNext {
  right: 20px;
  background: url('/img/btn/btn_main_slide_next.png') left top no-repeat;
}
#sector5 .slideQna {
  margin: 0 0 0 25%;
}
#sector5 .slideQna .slick-slide {
  height: 310px;
  background: #e2e2e2;
  padding: 0 30px;
  box-sizing: border-box;
  word-break: keep-all;
}
#sector5 .slideQna .slick-slide:nth-child(even) {
  background: #efefef;
}
#sector5 .slideQna .slick-slide .q {
  font-size: 24px;
  color: #fcc800;
  line-height: 1.2;
  font-weight: 700;
  padding: 27px 0 4px 0;
}
#sector5 .slideQna .slick-slide .tit {
  font-size: 24px;
  color: #000;
  line-height: 1.2;
  font-weight: 700;
  padding: 0 0 45px 0;
  letter-spacing: -0.5px;
}
#sector5 .slideQna .slick-slide .txt {
  font-size: 16px;
  color: #000;
  line-height: 1.5;
  font-weight: 300;
}

#sector6 {
  width: 100%;
  padding: 0 0 25px 0;
}
#sector6:after {
  content: '';
  display: block;
  clear: both;
}
#sector6 .ico {
  position: absolute;
  left: 0;
  top: -2px;
}
#sector6 .btn {
  float: right;
  width: 90%;
  background: #fcc800;
  border-radius: 10px;
}
#sector6 .btn a {
  display: block;
  width: 100%;
  text-align: right;
  background: url('/img/bg/bg_sector_a_span.png') right 46px top 50% no-repeat;
}
#sector6 .btn a span {
  font-size: 48px;
  color: #fff;
  line-height: 98px;
  font-weight: 300;
  padding: 0 120px 0 0;
}

/** footer **/
footer {
  position: relative;
  width: 100%;
  padding: 0 0 80px 0;
  margin: 150px 0 0 0;
  background: #000;
  overflow: hidden;
}
footer .fnb {
  width: 100%;
  font-size: 0;
  line-height: 0;
}
footer .fnb a {
  position: relative;
  font-size: 14px;
  color: #fff;
  line-height: 74px;
  padding: 0 12px 0 0;
  margin: 0 12px 0 0;
}
footer .fnb a:after {
  content: '|';
  position: absolute;
  right: -3px;
  top: 2px;
  font-size: 12px;
  color: #fff;
  line-height: 1.2;
}
footer .fnb a:last-child:after {
  display: none;
}
footer .fInfo {
  width: 100%;
  margin: 30px 0 0 0;
}
footer .fInfo ul {
  margin: 0 0 10px 0;
}
footer .fInfo ul:after {
  content: '';
  display: block;
  clear: both;
}
footer .fInfo ul li {
  display: inline-block;
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 13px;
  color: #8b8b8b;
  font-weight: 300;
  line-height: 1.2;
  margin: 0 15px 0 0;
}
footer .fInfo ul li strong {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #999;
  padding: 0 4px 0 0;
}
footer .fsns {
  position: absolute;
  right: 0;
  top: 105px;
  font-size: 0;
  line-height: 0;
}
footer .fsns ul:after {
  content: '';
  display: block;
  clear: both;
}
footer .fsns ul li {
  display: inline-block;
  margin: 0 0 0 8px;
}
footer .copyright {
  width: 100%;
  font-size: 14px;
  color: #999;
  line-height: 1.2;
}
footer:after {
  content: '';
  position: absolute;
  left: 0;
  top: 74px;
  width: 100%;
  height: 1px;
  background: #484848;
}

/***************** web design **************/

/***************** media web **************/
@media all and (max-width: 1680px) {
  #mainVisible .mvSlide:after {
    right: -120px;
  }
}

/***************** media web **************/
@media all and (max-width: 1480px) {
  .slideAppWrap {
    width: 100%;
  }
  .slideApp {
    right: 12px;
    top: -120px;
  }
}

/***************** media web **************/
@media all and (max-width: 1280px) {
  .guideLayout {
    width: auto;
    margin: 0 20px;
  }
}

/***************** media web **************/
@media all and (max-width: 1200px) {
  #mainVisible .mvSlide .img {
    margin: 0 0 0 -670px;
  }
  #mainVisible .mvSlide .txt strong {
    font-size: 60px;
  }
  #mainVisible .mvSlide .txt strong span {
    font-size: 60px;
  }
}

/***************** media web **************/
@media all and (max-width: 1100px) {
  header .naviBox .navi > ul > li {
    margin: 0 20px;
  }
  header .naviBox .navi > ul > li > a {
    font-size: 17px;
  }
}

/***************** media mobile navi **************/
@media all and (max-width: 1000px) {
  /* header */
  header {
    height: 98px;
    overflow: visible;
  }
  header h1 {
    top: 32px;
  }
  header .util {
    display: none;
  }

  header .naviBox {
    float: none;
    position: absolute;
    right: -100%;
    top: 0;
    width: 440px;
    padding: 340px 0 0 0;
    background: #fff;
    margin: 0 -20px 0 0;
    z-index: 100;
  }
  header .naviBox .mlogin {
    display: block;
    position: absolute;
    left: 0;
    top: 98px;
    width: 400px;
    height: 200px;
    overflow: hidden;
  }
  header .naviBox .mlogin ul {
    float: right;
    width: 100%;
    height: 100%;
  }
  header .naviBox .mlogin ul li {
    float: left;
    width: 50%;
    height: 100%;
  }
  header .naviBox .mlogin ul li a {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
  }
  header .naviBox .mlogin ul li a span {
    font-size: 28px;
    font-weight: 600;
    line-height: 200px;
  }
  header .naviBox .mlogin ul li:nth-child(1) {
    background: #fbc61e;
  }
  header .naviBox .mlogin ul li:nth-child(1) a {
    color: #000;
  }
  header .naviBox .mlogin ul li:nth-child(2) {
    background: #000;
  }
  header .naviBox .mlogin ul li:nth-child(2) a {
    color: #fbc61e;
  }

  header .naviBox .maccount {
    display: block;
    position: absolute;
    left: 0;
    top: 98px;
    width: 400px;
    height: 200px;
    background: url('/img/bg/bg_maccount.jpg') left top no-repeat;
    overflow: hidden;
  }
  header .naviBox .maccount .pic {
    position: absolute;
    left: 40px;
    top: 50px;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background: #fbc61e;
    overflow: hidden;
  }
  header .naviBox .maccount .pic img {
    width: 100%;
  }
  header .naviBox .maccount .name {
    position: absolute;
    left: 160px;
    top: 86px;
    font-size: 24px;
    color: #f2f2f2;
    line-height: 1.2;
  }

  header .naviBox .myAccount {
    display: block;
    width: 100%;
  }
  header .naviBox .myAccount a {
    display: block;
    font-size: 28px;
    color: #000;
    font-weight: 800;
    line-height: 98px;
    padding: 0 0 0 40px;
    box-sizing: border-box;
  }

  header .naviBox .myLogout {
    display: block;
    margin: 0 40px 0 0;
    border-bottom: 2px #ddd solid;
  }
  header .naviBox .myLogout a {
    display: block;
    font-size: 28px;
    color: #000;
    font-weight: 600;
    line-height: 98px;
    background: url('/img/bg/bg_my_logout.png') 371px 50% no-repeat;
    padding: 0 0 0 40px;
    box-sizing: border-box;
  }

  header .naviBox .navi {
    margin: 0;
    overflow-y: auto;
  }
  header .naviBox .navi > ul {
    margin: 0 40px 0 0;
  }
  header .naviBox .navi > ul > li {
    float: none;
    width: 100%;
    text-align: left;
    margin: 0;
    border-bottom: 2px #ddd solid;
  }
  header .naviBox .navi > ul > li > a {
    display: block;
    font-size: 28px;
    color: #000;
    line-height: 98px;
    padding: 0 0 0 40px;
    background: url('/img/bg/bg_navi_arrow.png') 373px 50% no-repeat;
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s;
    box-sizing: border-box;
  }
  header .naviBox .navi > ul > li > a.on {
    background: url('/img/bg/bg_navi_arrow_on.png') 373px 50% no-repeat;
  }
  header .naviBox .navi > ul > li > a.nodep {
    background: url('');
  }
  header .naviBox .navi > ul > li > div {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: 0;
    border-left: 0;
    overflow: hidden;
  }
  header .naviBox .navi > ul > li > div ul {
    padding: 0 0 28px 0;
  }
  header .naviBox .navi > ul > li > div ul li {
    display: block;
    text-align: left;
  }
  header .naviBox .navi > ul > li > div ul li a {
    display: block;
    width: 100%;
    padding: 10px 0;
    box-sizing: border-box;
  }
  header .naviBox .navi > ul > li > div ul li a span {
    font-size: 24px;
    color: #666;
    padding: 0 0 0 40px;
  }
  header .naviBox .navi > ul > li > div ul li a span u {
    display: none;
  }
  header .naviBox .navi > ul > li:nth-child(1) {
    border-top: 2px #ddd solid;
  }
  header .naviBox .navi > ul > li:nth-child(1) div {
    left: 0;
  }
  header .naviBox .navi > ul > li:nth-child(2) div {
    left: 0;
  }
  header .naviBox .navi > ul > li:nth-child(3) div {
    left: 0;
  }
  header .naviBox .navi > ul > li:nth-child(4) div {
    left: 0;
  }
  header .naviBox .navi > ul > li:nth-child(5) div {
    left: 0;
    border-right: 0;
  }
  header .naviBox .navi.type > ul > li > div {
    width: 0;
  }
  header .naviBox .navi.four > ul > li > div {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: 0;
    border-left: 0;
    overflow: hidden;
  }
  header .naviBox .navi.type > ul > li:nth-child(2) div {
    left: 0;
  }
  header .naviBox .navi.type > ul > li:nth-child(3) div {
    left: 0;
  }
  header .naviBox .navi.type > ul > li:nth-child(4) div {
    left: 0;
    border-right: 0;
  }
  header .naviBox .navi > ul > li > div p {
    display: none;
  }

  header .naviOpen {
    display: block;
    position: absolute;
    right: 0;
    top: 9px;
    width: 52px;
    padding: 10px;
    z-index: 300;
  }
  header .naviOpen button {
    display: block;
    width: 100%;
  }
  header .naviOpen span {
    display: block;
    width: 100%;
    height: 3px;
    background: #fff;
    margin: 13px 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  header .naviOpen.active {
    right: -15px;
    top: 17px;
  }
  header .naviOpen.active button {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  header .naviOpen.active span {
    width: 46px;
    background: #000;
  }
  header .naviOpen.active span:nth-child(2) {
    display: none;
  }
  header .naviOpen.active span:nth-child(1) {
    /* -webkit-transform: translateY(11px);
    -ms-transform: translateY(11px);
    -o-transform: translateY(11px); */
    transform: translateY(11px);
  }
  header .naviOpen.active span:nth-child(3) {
    /* -webkit-transform: translateY(-4px) rotate(90deg);
    -ms-transform: translateY(-4px) rotate(90deg);
    -o-transform: translateY(-4px) rotate(90deg); */
    transform: translateY(-4px) rotate(90deg);
  }

  header.fixed {
    height: 98px;
    border-bottom: 2px #fbc61e solid;
  }
  header.fixed h1 {
    top: 32px;
  }
  header.fixed .guideLayout {
    border: 0;
  }
  header.fixed .naviOpen span {
    background: #000;
  }

  header .naviBG {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.8;
    z-index: 90;
  }
  header .line {
    display: none;
  }

  #mainVisible .mvSlide .img {
    top: auto;
    bottom: 10px;
    margin: 0 0 0 -538px;
  }
  #mainVisible .mvSlide .img img {
    width: 1000px;
  }
  #mainVisible .mvSlide .txt {
    width: 70%;
    margin: -152px 0 0 0;
  }

  #sector2 .cimg {
    margin: 0;
    left: auto;
    right: 0;
  }
  #sector2 .txtArea {
    width: 48%;
    top: 20px;
  }
  #sector3 .cimg {
    margin: 0;
    left: 12%;
    right: auto;
  }
  #sector3 .txtArea {
    left: 50%;
    width: 48%;
    margin: 0 0 0 2%;
    top: 20px;
  }
  #sector4 .cimg {
    margin: 0;
    left: auto;
    right: 12%;
  }
  #sector4 .txtArea {
    width: 48%;
    top: 20px;
  }
  #sector5 .info {
    width: 33.333%;
  }
  #sector5 .slideQna {
    margin: 0 0 0 33.333%;
  }
}

/***************** media mobile **************/
@media all and (max-width: 840px) {
  /* footer */
  footer .fsns {
    position: relative;
    left: 0;
    right: auto;
    top: 0;
    margin: 30px 0 0 0;
  }
  footer .fsns ul li {
    margin: 0 8px 0 0;
  }

  #sector2 .txtArea {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0 0 30px 0;
  }
  #sector2 .img {
    float: none;
    width: 100%;
  }
  #sector2 .img img {
    width: 100%;
  }
  #sector2 .cimg {
    left: 50%;
    margin: 0 0 0 -240px;
  }

  #sector3 .txtArea {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0 0 30px 0;
  }
  #sector3 .img {
    float: none;
    width: 100%;
  }
  #sector3 .img img {
    width: 100%;
  }
  #sector3 .cimg {
    left: 50%;
    margin: 0 0 0 -130px;
  }

  #sector4 .txtArea {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0 0 30px 0;
  }
  #sector4 .img {
    float: none;
    width: 100%;
  }
  #sector4 .img img {
    width: 100%;
  }
  #sector4 .cimg {
    left: 50%;
    margin: 0 0 0 -130px;
  }

  #sector5 .info {
    width: 50%;
  }
  #sector5 .slideQna {
    margin: 0 0 0 50%;
  }
}

/***************** mobile design **************/
/***************** media mobile **************/
@media all and (max-width: 640px) {
  /* base inbox */
  .guideLayout {
    margin: 0 12px;
  }

  /* header */
  header {
    height: 58px;
  }
  header h1 {
    top: 18px;
  }
  header h1 a {
    width: 160px;
    height: 25px;
    background-size: 160px 25px;
  }
  header.fixed {
    height: 58px;
  }
  header.fixed h1 {
    top: 18px;
  }
  header.fixed h1 a {
    background-size: 160px 25px;
  }
  header .naviBox {
    width: 248px;
    padding: 188px 0 0 0;
    margin: 0 -12px 0 0;
  }
  header .naviBox .mlogin {
    top: 53px;
    width: 226px;
    height: 113px;
  }
  header .naviBox .mlogin ul li a span {
    font-size: 15px;
    line-height: 113px;
  }
  header .naviBox .maccount {
    top: 53px;
    width: 226px;
    height: 113px;
    background-size: 226px 113px;
  }
  header .naviBox .maccount .pic {
    left: 24px;
    top: 28px;
    width: 58px;
    height: 58px;
  }
  header .naviBox .maccount .name {
    left: 90px;
    top: 48px;
    font-size: 13px;
  }
  header .naviBox .myAccount a {
    font-size: 15px;
    line-height: 54px;
    padding: 0 0 0 22px;
  }
  header .naviBox .myLogout {
    margin: 0 20px 0 0;
    border-width: 1px;
  }
  header .naviBox .myLogout a {
    font-size: 15px;
    line-height: 54px;
    padding: 0 0 0 22px;
    background-position: 210px 50%;
    background-size: 18px;
  }
  header .naviBox .navi > ul {
    margin: 0 20px 0 0;
  }
  header .naviBox .navi > ul > li {
    border-width: 1px;
  }
  header .naviBox .navi > ul > li > a {
    font-size: 15px;
    line-height: 54px;
    padding: 0 0 0 22px;
    background-position: 210px 50%;
    background-size: 15px 7px;
  }
  header .naviBox .navi > ul > li > a.on {
    background-position: 210px 50%;
    background-size: 15px 7px;
  }
  header .naviBox .navi > ul > li > div ul {
    padding: 0 0 14px 0;
  }
  header .naviBox .navi > ul > li > div ul li a {
    padding: 6px 0;
  }
  header .naviBox .navi > ul > li > div ul li a span {
    font-size: 13px;
    padding: 0 0 0 22px;
  }
  header .naviBox .navi > ul > li:nth-child(1) {
    border-width: 1px;
  }

  header .naviOpen {
    top: 2px;
    width: 32px;
    right: -5px;
  }
  header .naviOpen span {
    height: 2px;
    margin: 7px 0;
  }
  header .naviOpen.active {
    top: 3px;
  }
  header .naviOpen.active span {
    width: 30px;
  }
  header .naviOpen.active span:nth-child(3) {
    -webkit-transform: translateY(2px) rotate(90deg);
    -ms-transform: translateY(2px) rotate(90deg);
    -o-transform: translateY(2px) rotate(90deg);
    transform: translateY(2px) rotate(90deg);
  }

  /* silde app btn */
  .slideApp {
    position: fixed;
    top: auto !important;
    right: 5px;
    bottom: 225px;
  }
  .slideApp a {
    position: relative;
    left: 0;
    top: 0;
    width: 58px;
    height: 58px;
    background: url('/img/ico/ico_slideapp_m.png') left top no-repeat;
    background-size: 58px;
  }
  .slideApp a img {
    display: none;
  }
  .slideApp a span {
    display: none;
  }

  /* main */
  #mainVisible .mvSlide {
    height: 400px;
  }
  #mainVisible .mvSlide:before {
  }
  #mainVisible .mvSlide:after {
    right: -60px;
    width: 527px;
    height: 100%;
    background-size: 527px auto;
  }
  #mainVisible .mvSlide .img {
    bottom: 5px;
    margin: 0 0 0 -360px;
  }
  #mainVisible .mvSlide .img img {
    width: 620px;
  }
  #mainVisible .mvSlide .txt {
    width: 80%;
    margin: -55px 0 0 0;
  }
  #mainVisible .mvSlide .txt strong {
    font-size: 25px;
    padding: 0 0 15px 0;
  }
  #mainVisible .mvSlide .txt strong span {
    display: inline;
    font-size: 25px;
  }
  #mainVisible .mvSlide .txt p {
    font-size: 13px;
    line-height: 1.3;
  }
  #mainVisible .mvSlide .txt p span {
    display: inline;
    font-size: 13px;
    line-height: 1.3;
  }

  #sector1 {
    margin: 45px 0 50px 0;
  }
  #sector1 .ico {
    padding: 0 0 14px 0;
  }
  #sector1 .ico img {
    width: 100px;
  }
  #sector1 .txt span {
    display: inline;
    font-size: 14px;
  }
  #sector1 .txt span strong {
    font-size: 14px;
  }

  #sector2 {
    margin: 0 0 60px 0;
  }
  #sector2 .cimg {
    margin: 0 0 0 -100px;
  }
  #sector2 .cimg img {
    width: 220px;
  }
  #sector2 .txtArea {
    margin: 0 0 15px 0;
  }
  #sector2 .txtArea .tit {
    font-size: 24px;
  }
  #sector2 .txtArea ul li {
    font-size: 14px;
    padding: 0 0 0 16px;
  }
  #sector2 .txtArea ul li:after {
    font-size: 14px;
  }

  #sector3 {
    margin: 0 0 60px 0;
  }
  #sector3 .cimg {
    margin: 0 0 0 -60px;
  }
  #sector3 .cimg img {
    width: 120px;
  }
  #sector3 .txtArea {
    margin: 0 0 15px 0;
  }
  #sector3 .txtArea .tit {
    font-size: 24px;
  }
  #sector3 .txtArea ul li {
    font-size: 14px;
    padding: 0 0 0 16px;
  }
  #sector3 .txtArea ul li:after {
    font-size: 14px;
  }

  #sector4 {
    margin: 0 0 60px 0;
  }
  #sector4 .cimg {
    margin: 0 0 0 -60px;
  }
  #sector4 .cimg img {
    width: 110px;
  }
  #sector4 .txtArea {
    margin: 0 0 15px 0;
  }
  #sector4 .txtArea .tit {
    font-size: 24px;
  }
  #sector4 .txtArea ul li {
    font-size: 14px;
    padding: 0 0 0 16px;
  }
  #sector4 .txtArea ul li:after {
    font-size: 14px;
  }

  #sector5 {
    margin: 0 0 50px 0;
  }
  #sector5 .info {
    height: 200px;
  }
  #sector5 .info span {
    font-size: 30px;
    padding: 15px 0 0 18px;
  }
  #sector5 .info a {
    bottom: 12px;
    width: 30px;
    height: 30px;
  }
  #sector5 .info a.slidePrev {
    right: 41px;
    background-size: 30px;
  }
  #sector5 .info a.slideNext {
    right: 12px;
    background-size: 30px;
  }
  #sector5 .slideQna .slick-slide {
    height: 200px;
    padding: 0 15px;
  }
  #sector5 .slideQna .slick-slide .q {
    font-size: 16px;
    padding: 15px 0 4px 0;
  }
  #sector5 .slideQna .slick-slide .tit {
    font-size: 16px;
    padding: 0 0 25px 0;
  }
  #sector5 .slideQna .slick-slide .txt {
    font-size: 12px;
  }

  #sector6 {
    padding: 0 0 15px 0;
    margin: 0 0 20px 0;
  }

  #sector6 .ico {
    top: -1px;
  }
  #sector6 .ico img {
    width: 90px;
  }
  #sector6 .btn {
  }
  #sector6 .btn a {
    background-size: 8px auto;
    background-position: right 24px top 50%;
  }
  #sector6 .btn a span {
    font-size: 24px;
    line-height: 52px;
    padding: 0 50px 0 0;
  }

  /* footer */
  footer {
    padding: 0 0 30px 0;
    margin: 30px 0 0 0;
  }
  footer:after {
    top: 42px;
  }
  footer .fnb {
    text-align: center;
  }
  footer .fnb a {
    font-size: 12px;
    line-height: 42px;
    padding: 0 7px 0 0;
    margin: 0 7px 0 0;
  }
  footer .fnb a:after {
    right: -3px;
    top: 2px;
    font-size: 10px;
  }
  footer .fsns {
    text-align: center;
    margin: 15px 0 0 0;
  }
  footer .fsns ul li {
    margin: 0 2px;
  }
  footer .fsns ul li img {
    width: 30px;
  }
  footer .fInfo {
    margin: 16px 0 0 0;
    text-align: center;
  }
  footer .fInfo ul {
    margin: 0 0 5px 0;
  }
  footer .fInfo ul li {
    display: inline;
    font-size: 11px;
    margin: 0 6px 0 0;
  }
  footer .fInfo ul li strong {
    display: block;
    font-size: 12px;
    padding: 0 0 5px 0;
  }
  footer .fInfo ul li.dep {
    display: block;
    padding: 5px 0 2px 0;
  }
  footer .copyright {
    font-size: 11px;
    text-align: center;
  }
}

/* sub banner */
#subBanner {
  position: relative;
  width: 100%;
  height: 446px;
  overflow: hidden;
}
#subBanner .img {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}
#subBanner p {
  position: absolute;
  left: 38px;
  top: 220px;
  font-size: 48px;
  color: #fff;
  font-weight: 800;
  line-height: 1.2;
  z-index: 3;
}
#subBanner p span {
  font-size: 48px;
}
#subBanner:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 80%;
  height: 430px;
  background: #000;
  z-index: 1;
}
#subBanner:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1480px;
  height: 446px;
  background: url('/img/bg/bg_subbanner_after.png') left top no-repeat;
  z-index: 1;
}

/*** content ***/
#content {
  width: 100%;
  padding: 100px 0 140px 0;
}
#content:after {
  content: '';
  display: block;
  clear: both;
}

/*** login ***/
.lboxWrap {
  width: 930px;
  margin: 0 auto;
  background: #f1eeee;
}
.lboxWrap:after {
  content: '';
  display: block;
  clear: both;
}
.lboxWrap .lbox {
  position: relative;
  float: left;
  width: 50%;
  height: 580px;
  text-align: center;
}
.lboxWrap .lbox .lTit {
  font-size: 42px;
  color: #333;
  line-height: 1.2;
  font-weight: 800;
  padding: 76px 0 0 0;
}
.lboxWrap .lbox .lTxt {
  font-size: 13px;
  color: #000;
  line-height: 1.2;
  font-weight: 400;
  padding: 15px 0;
}
.lboxWrap .lbox .lSns {
  width: 100%;
  overflow: hidden;
}
.lboxWrap .lbox .lSns ul {
  font-size: 0;
  line-height: 0;
}
.lboxWrap .lbox .lSns ul:after {
  content: '';
  display: block;
  clear: both;
}
.lboxWrap .lbox .lSns ul li {
  display: inline-block;
  margin: 0 7px;
}
.lboxWrap .lbox .lSns.join {
  padding: 20px 0 10px 0;
}
.lboxWrap .lbox .linform {
  position: relative;
  padding: 0 33px;
  margin: 24px 10.75% 0;
  border-top: 1px #c2c2c2 solid;
}
.lboxWrap .lbox .linform:after {
  content: '';
  display: block;
  clear: both;
}
.lboxWrap .lbox .linform .divider {
  position: absolute;
  left: 0;
  top: -9px;
  width: 100%;
}
.lboxWrap .lbox .linform .divider span {
  display: inline-block;
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  font-weight: 400;
  padding: 0 7px;
  background: #f1eeee;
}
.lboxWrap .lbox .linform ul {
  font-size: 0;
  line-height: 0;
  margin: 25px 0 0 0;
}
.lboxWrap .lbox .linform ul:after {
  content: '';
  display: block;
  clear: both;
}
.lboxWrap .lbox .linform ul li {
  display: block;
  margin: 0 0 10px 0;
}
.lboxWrap .lbox .linform ul li:last-child {
  margin: 0;
}
.lboxWrap .lbox .linform ul li input {
  width: 100%;
  height: 50px;
  line-height: 50px;
  padding: 0 0 0 20px;
  margin: 0;
  box-sizing: border-box;
  border: 1px #c2c2c2 solid;
  border-radius: 3px;
}
.lboxWrap .lbox .linform p {
  font-size: 15px;
  color: #000;
  line-height: 60px;
  font-weight: 400;
}
.lboxWrap .lbox .agreeChk {
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
  overflow: hidden;
  word-break: keep-all;
}
.lboxWrap .lbox .agreeChk .custom-checkbox label {
  display: inline-block;
  position: relative;
  z-index: 1;
  cursor: pointer;
  font-size: 13px;
  color: #000;
  padding: 0 0 0 36px;
  line-height: 15px;
  letter-spacing: 0;
  background: url('/img/ico/ico_join_agree.png') 0 0 no-repeat;
}
.lboxWrap .lbox .agreeChk .custom-checkbox label.checked {
  background-position: 0 -45px;
}
.lboxWrap .lbox .goBtn {
  padding: 0 33px;
  margin: 0 10.75%;
}
.lboxWrap .lbox .goBtn a {
  display: block;
  width: 100%;
  height: 50px;
  font-size: 14px;
  color: #fff;
  font-weight: 600;
  line-height: 50px;
  background: #fbc61e;
}

.lboxWrap .lbox.noti {
  background: #fbc61e;
}
.lboxWrap .lbox.noti .notiBox {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  margin: -102px 0 0 0;
}
.lboxWrap .lbox.noti .notiBox .notiTit {
  font-size: 42px;
  color: #333;
  line-height: 1.2;
  font-weight: 800;
  padding: 0 0 12px 0;
}
.lboxWrap .lbox.noti .notiBox .notiTxt {
  width: 100%;
  height: 42px;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  font-weight: 400;
  padding: 0 20px;
  box-sizing: border-box;
  word-break: keep-all;
}
.lboxWrap .lbox.noti .notiBox .notiTxt span {
  display: block;
  font-size: 16px;
  color: #000;
  line-height: 1.5;
  font-weight: 400;
}
.lboxWrap .lbox.noti .notiBox .notiTxt.join {
  height: 50px;
}
.lboxWrap .lbox.noti .notiBox .btn {
  padding: 0 33px;
  margin: 24px 10.75% 0;
}
.lboxWrap .lbox.noti .notiBox .btn a {
  display: block;
  width: 100%;
  height: 50px;
  font-size: 14px;
  color: #fff;
  font-weight: 600;
  line-height: 50px;
  background: #000;
}

.signup {
  width: 100%;
  text-align: center;
  overflow: hidden;
}
.signup .sTit {
  font-size: 42px;
  color: #333;
  line-height: 1.2;
  font-weight: 800;
  padding: 0 0 12px 0;
}
.signup .sTxt {
  padding: 0 0 15px 0;
  word-break: keep-all;
}
.signup .sTxt p {
  font-size: 16px;
  color: #000;
  line-height: 1.5;
  padding: 0 0 30px 0;
  letter-spacing: -0.2px;
}
.signup .sTxt p span {
  display: block;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.2px;
}
.signup a {
  display: inline-block;
  width: 300px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  font-weight: 600;
  line-height: 50px;
  background: #000;
  border-radius: 3px;
}

/*** apply ***/
.subMTit {
  font-size: 42px;
  color: #333;
  line-height: 1.2;
  font-weight: 800;
}
.applyStep {
  width: 100%;
  margin: 30px 0 0 0;
  overflow: hidden;
}
.applyStep ul:after {
  content: '';
  display: block;
  clear: both;
}
.applyStep ul li {
  position: relative;
  float: left;
  width: 33.33%;
  height: 50px;
  text-align: center;
  background: #d3d3d3;
  box-sizing: border-box;
}
.applyStep ul li span {
  display: inline-block;
  font-size: 12px;
  color: #fff;
  line-height: 1.2;
  font-weight: 800;
  padding: 9px 0 0 0;
}
.applyStep ul li p {
  font-size: 18px;
  color: #fff;
  font-weight: 300;
  line-height: 1.2;
}
.applyStep ul li p.l {
  line-height: 50px;
}
.applyStep ul li:nth-child(2) {
  border-left: 1px #fff solid;
  border-right: 1px #fff solid;
}
.applyStep ul li.on {
  background: #fbc61e;
}
.applyStep ul li.on span {
  color: #000;
}
.applyStep ul li.on p {
  color: #000;
}
.applyStep ul li.fin:after {
  content: 'COMPLETE';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  font-size: 18px;
  color: #fbc61e;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 50px;
  background: url('/img/bg/bg_apply_step_fin.png') left top repeat;
}

.applyBox {
  position: relative;
  width: 100%;
  margin: 70px 0 0 0;
}
.applyBox:after {
  content: '';
  display: block;
  clear: both;
}
.applySubTit {
  position: absolute;
  left: 0;
  top: -5px;
  font-size: 30px;
  color: #fbc61e;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 4px;
}
.applyInform {
  border-top: 3px #c2c2c2 solid;
  margin: 0 0 0 25%;
}
.applyInform .dBox {
  position: relative;
  width: 100%;
  padding: 10px 20px 10px 300px;
  border-bottom: 1px #c2c2c2 solid;
  background: url('/img/bg/bg_dbox_th.png') left top repeat-y;
  box-sizing: border-box;
}
.applyInform .dBox:after {
  content: '';
  display: block;
  clear: both;
}
.applyInform .dBox .tit {
  position: absolute;
  left: 30px;
  top: 25px;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
}
.applyInform .dBox ul.half:after {
  content: '';
  display: block;
  clear: both;
}
.applyInform .dBox ul.half li {
  float: left;
  width: 50%;
  box-sizing: border-box;
}
.applyInform .dBox ul.half li:nth-child(1) {
  padding: 0 5px 0 0;
}
.applyInform .dBox ul.half li:nth-child(2) {
  padding: 0 0 0 5px;
}
.applyInform .dBox ul.third:after {
  content: '';
  display: block;
  clear: both;
}
.applyInform .dBox ul.third li {
  float: left;
  box-sizing: border-box;
}
.applyInform .dBox ul.third li:nth-child(1) {
  width: 40%;
  padding: 0 5px 0 0;
}
.applyInform .dBox ul.third li:nth-child(2) {
  width: 60%;
  padding: 0 0 0 5px;
}
.applyInform .dBox .noti {
  font-size: 14px;
  color: #ff0055;
  line-height: 50px;
}
.applyInform .dBox textarea {
  width: 100%;
  height: 440px;
  font-size: 14px;
  color: #000;
  line-height: 1.6;
  padding: 16px;
  box-sizing: border-box;
}

.applyInform .rBox {
  position: relative;
  width: 100%;
  padding: 20px 20px 20px 300px;
  background: #fbc61e;
  box-sizing: border-box;
}
.applyInform .rBox .tit {
  position: absolute;
  left: 0;
  top: 0;
  width: 280px;
  height: 100%;
  background: #000;
}
.applyInform .rBox .tit span {
  position: absolute;
  left: 30px;
  top: 30px;
  font-size: 24px;
  color: #fbc61e;
  font-weight: 800;
}
.applyInform .rBox textarea {
  width: 100%;
  height: 148px;
  font-size: 16px;
  color: #000;
  line-height: 1.6;
  padding: 20px;
  border: 1px #ddd solid;
  box-sizing: border-box;
}
.applyInform .rBox textarea::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #000;
}
.applyInform .rBox textarea:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #000;
  opacity: 1;
}
.applyInform .rBox textarea::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #000;
  opacity: 1;
}
.applyInform .rBox textarea:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #000;
}
.applyInform .rBox textarea::-ms-input-placeholder {
  /* Internet Explorer Edge  */
  color: #000;
}

.applyInform.qa {
  margin: 0;
}

.mockInfo {
  margin: 0 0 0 25%;
}
.mockInfo:after {
  content: '';
  display: block;
  clear: both;
}
.mockInfo .mtit {
  font-size: 24px;
  color: #000;
  font-weight: 800;
  line-height: 1.2;
  padding: 0 0 22px 0;
}
.mockInfo .mtxt {
  font-size: 14px;
  color: #000;
  line-height: 1.7;
  padding: 0 0 90px 0;
  word-break: keep-all;
}
.mockInfo .mtxt.nodep {
  padding: 0;
}
.mockInfo .mHow {
  padding: 26px 0 86px;
}
.mockInfo .mHow:after {
  content: '';
  display: block;
  clear: both;
}
.mockInfo .mHow img {
  max-width: 100%;
}
.mockInfo .mHow img.w {
  display: inline-block;
}
.mockInfo .mHow img.m {
  display: none;
}
.mockInfo .mHowInfo {
  margin: 0 0 0 3.87%;
}
.mockInfo .mHowInfo:after {
  content: '';
  display: block;
  clear: both;
}
.mockInfo .mHowInfo ul:after {
  content: '';
  display: block;
  clear: both;
}
.mockInfo .mHowInfo ul li {
  display: block;
  position: relative;
  padding: 0 0 74px 0;
}
.mockInfo .mHowInfo ul li .ico {
  position: absolute;
  left: 0;
  top: -28px;
}
.mockInfo .mHowInfo ul li .info {
  margin: 0 340px 0 145px;
}
.mockInfo .mHowInfo ul li .info:after {
  content: '';
  display: block;
  clear: both;
}
.mockInfo .mHowInfo ul li .info .tt {
  font-size: 16px;
  color: #000;
  font-weight: 800;
  line-height: 1.2;
  padding: 0 0 16px 0;
  word-break: keep-all;
}
.mockInfo .mHowInfo ul li .info .tx {
  min-height: 56px;
}
.mockInfo .mHowInfo ul li .info .tx span {
  font-size: 14px;
  color: #000;
  line-height: 1.4;
  padding: 0 0 90px 0;
  word-break: keep-all;
}
.mockInfo .mHowInfo ul li .info .tx p {
  padding: 17px 0 0 0;
}
.mockInfo .mHowInfo ul li .info .tx strong {
  font-size: 14px;
  font-weight: 800;
}
.mockInfo .mHowInfo ul li .info .btn {
  position: absolute;
  right: 0;
  top: 0;
}
.mockInfo .mHowInfo ul li .info .btn a {
  display: inline-block;
  width: 300px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  background: #fbc61e;
  border-radius: 3px;
}
.mockInfo .mHowInfo ul li .info.full {
  margin: 0 0 0 145px;
}
.mockInfo .mHowInfo ul li:last-child {
  padding: 0;
}
.mockInfo .mcriteria {
  position: relative;
  margin: 90px 0 0 3.87%;
  padding: 0 42px;
  border: 1px #ccc solid;
  box-sizing: border-box;
}
.mockInfo .mcriteria .mcIco {
  position: absolute;
  right: 40px;
  top: 40px;
}
.mockInfo .mcriteria .mctt {
  font-size: 18px;
  color: #fbc61e;
  font-weight: 800;
  line-height: 1.2;
  padding: 38px 0 18px 0;
}
.mockInfo .mcriteria .mctx {
  width: 100%;
  padding: 0 0 14px 0;
  overflow: hidden;
}
.mockInfo .mcriteria .mctx ul:after {
  content: '';
  display: block;
  clear: both;
}
.mockInfo .mcriteria .mctx ul li {
  display: block;
  position: relative;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  padding: 0 0 6px 0;
}
.mockInfo .mcriteria .mcbn {
  width: 100%;
  padding: 0 0 40px 0;
  text-align: center;
  overflow: hidden;
}
.mockInfo .mcriteria .mcbn a {
  display: inline-block;
  width: 300px;
  height: 50px;
  font-size: 14px;
  color: #fbc61e;
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  background: #000;
  border-radius: 3px;
}

.applyContract {
  width: 930px;
  margin: 0 auto;
  overflow: hidden;
}
.applyContract .congratulations {
  width: 100%;
  padding: 112px 0 0 0;
}
.applyContract .congratulations .sTit {
  font-size: 42px;
  color: #000;
  line-height: 1.2;
  font-weight: 800;
  padding: 0 0 20px 0;
  text-align: center;
}
.applyContract .congratulations .sTxt {
  padding: 0 0 30px 0;
  word-break: keep-all;
  text-align: center;
}
.applyContract .congratulations .sTxt p {
  font-size: 17px;
  color: #333;
  line-height: 1.6;
  letter-spacing: -0.2px;
}
.applyContract .congratulations .sTxt p span {
  display: block;
  font-size: 18px;
  line-height: 1.6;
  letter-spacing: -0.2px;
}
.applyContract .congratulations .agreeBox {
  position: relative;
  width: 100%;
  height: 250px;
  font-size: 13px;
  color: #333;
  line-height: 1.6;
  padding: 20px;
  border: 1px #ddd solid;
  box-sizing: border-box;
  overflow-y: auto;
  word-break: keep-all;
  border-radius: 3px;
}
.applyContract .congratulations .agreeChk {
  margin: 20px 0 0 0;
  text-align: center;
}

.applyContract .fileTit {
  font-size: 24px;
  color: #333;
  font-weight: 800;
  line-height: 1.2;
  padding: 36px 0 12px;
}
.applyContract .fileUpload {
  width: 100%;
  border-top: 3px #c2c2c2 solid;
  overflow: hidden;
}
.applyContract .fileUpload .dBox {
  position: relative;
  width: 100%;
  padding: 10px 20px 10px 300px;
  border-bottom: 1px #c2c2c2 solid;
  box-sizing: border-box;
}
.applyContract .fileUpload .tit {
  position: absolute;
  left: 30px;
  top: 25px;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
}

.fileList {
  width: 100%;
}
.fileList:after {
  content: '';
  display: block;
  clear: both;
}
.fileList .file {
  margin: 10px 0 0 0;
}
.fileList .file:after {
  content: '';
  display: block;
  clear: both;
}
.fileList .file span {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  padding: 0 6px 0 26px;
  background: url('/img/bg/bg_file_list_span.png') left top no-repeat;
}
.fileList .file .previewBtn {
  display: inline-block;
  width: 120px;
  font-family: 'Noto Sans KR';
  font-size: 12px;
  color: #fff;
  line-height: 24px;
  text-align: center;
  letter-spacing: -0.5px;
  background: #999;
  margin: 0 0 0 10px;
  border-radius: 50px;
}
.fileList .file * {
  vertical-align: middle;
}
.fileList .fileNoti {
  margin: 20px 0 0 0;
}
.fileList .fileNoti:after {
  content: '';
  display: block;
  clear: both;
}
.fileList .fileNoti p {
  display: inline-block;
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #000;
  line-height: 24px;
}
.fileList .fileNoti a {
  display: inline-block;
  width: 120px;
  font-family: 'Noto Sans KR';
  font-size: 12px;
  color: #000;
  line-height: 24px;
  text-align: center;
  letter-spacing: -0.5px;
  background: #fbc61e;
  margin: 0 0 0 10px;
  border-radius: 50px;
}

.thanxTo {
  width: 100%;
  text-align: center;
  overflow: hidden;
}
.thanxTo .sTit {
  font-size: 42px;
  color: #333;
  line-height: 1.2;
  font-weight: 800;
  padding: 0 0 12px 0;
  word-break: keep-all;
}
.thanxTo .sTxt {
  word-break: keep-all;
}
.thanxTo .sTxt p {
  font-size: 16px;
  color: #000;
  line-height: 1.5;
  padding: 0 0 30px 0;
  letter-spacing: -0.2px;
}
.thanxTo .sTxt p span {
  display: block;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.2px;
}
.thanxTo a {
  display: inline-block;
  width: 300px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  font-weight: 600;
  line-height: 50px;
  background: #000;
  border-radius: 3px;
}

.qualifications {
  position: relative;
  width: 100%;
  word-break: keep-all;
}
.qualifications .qInner {
  width: 100%;
  min-height: 340px;
  overflow: hidden;
  padding-top: 60px;
}
.qualifications .qInner .qTit {
  font-size: 30px;
  color: #fbc61e;
  line-height: 1.2;
  font-weight: 700;
  padding: 0 0 10px 0;
}
.qualifications .qInner .qTxt {
  font-size: 18px;
  color: #000;
  line-height: 1.4;
  font-weight: 300;
  padding: 0 0 90px 0;
}
.qualifications .qInner .qImg {
  position: absolute;
  right: 0;
  top: -40px;
}
.qualifications .qInfo {
  width: 100%;
  margin: 100px 0 0 0;
  overflow: hidden;
}
.qualifications .qInfo ul:after {
  content: '';
  display: block;
  clear: both;
}
.qualifications .qInfo ul li {
  float: left;
  width: 20%;
}
.qualifications .qInfo ul li .ico {
  text-align: center;
}
.qualifications .qInfo ul li .ico img {
  max-width: 100%;
}
.qualifications .qInfo ul li p {
  font-size: 16px;
  color: #000;
  line-height: 1.4;
  font-weight: 300;
  padding: 40px 12px 0;
  word-break: keep-all;
}

.welcomeWrap {
  position: relative;
  margin: 50px 0 0 0;
  padding: 0 0 40px 25%;
}
.welcomeWrap:after {
  content: '';
  display: block;
  clear: both;
}
.welcomeWrap .wStep {
  position: absolute;
  left: 6.45%;
  top: 0;
  width: 150px;
  height: 150px;
  border-radius: 100%;
  background: #fbc61e;
  text-align: center;
}
.welcomeWrap .wStep span {
  display: inline-block;
  font-size: 36px;
  color: #fff;
  line-height: 150px;
  font-weight: 600;
}
.welcomeWrap .wTit {
  font-size: 18px;
  color: #000;
  line-height: 1.8;
  padding: 0 0 28px 0;
  word-break: keep-all;
}
.welcomeWrap .wTit span {
  display: block;
  font-size: 18px;
  color: #000;
  line-height: 1.8;
}
.welcomeWrap .wTit p {
  font-size: 18px;
  color: #000;
  line-height: 1.8;
  padding: 0 0 32px 0;
}
.welcomeWrap .wTit p:last-child {
  padding: 0;
}

.welcomeWrap .wInform {
  border-top: 3px #c2c2c2 solid;
}
.welcomeWrap .wInform:after {
  content: '';
  display: block;
  clear: both;
}
.welcomeWrap .wInform .wBox {
  position: relative;
  width: 100%;
  padding: 10px 20px 10px 300px;
  border-bottom: 1px #c2c2c2 solid;
  box-sizing: border-box;
}
.welcomeWrap .wInform .wBox:after {
  content: '';
  display: block;
  clear: both;
}
.welcomeWrap .wInform .wBox .tit {
  position: absolute;
  left: 30px;
  top: 25px;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
}
.welcomeWrap .wInform .wBox ul.half:after {
  content: '';
  display: block;
  clear: both;
}
.welcomeWrap .wInform .wBox ul.half li {
  float: left;
  width: 50%;
  box-sizing: border-box;
}
.welcomeWrap .wInform .wBox ul.half li:nth-child(1) {
  padding: 0 5px 0 0;
}
.welcomeWrap .wInform .wBox ul.half li:nth-child(2) {
  padding: 0 0 0 5px;
}
.welcomeWrap .wInform .wBox .noti {
  font-size: 14px;
  color: #ff0055;
  line-height: 50px;
}
.welcomeWrap .wInform .wBox textarea {
  width: 100%;
  height: 180px;
  font-size: 14px;
  color: #000;
  line-height: 1.6;
  padding: 16px;
  box-sizing: border-box;
}
.welcomeWrap .wInform .wBox .imgFile {
  position: relative;
  width: 100%;
}
.welcomeWrap .wInform .wBox .imgFile .dragImg {
  width: 200px;
  height: 200px;
  background: url('/img/bg/bg_img_drag.png') center 50% #f5f5f5 no-repeat;
  border-radius: 3px;
}
.welcomeWrap .wInform .wBox .imgFile .dragInfo {
  position: absolute;
  left: 216px;
  top: 50%;
  margin: -36px 0 0 0;
}
.welcomeWrap .wInform .wBox .imgFile .dragInfo ul:after {
  content: '';
  display: block;
  clear: both;
}
.welcomeWrap .wInform .wBox .imgFile .dragInfo ul li {
  display: block;
  font-family: 'Noto Sans KR';
  font-size: 12px;
  color: #999;
  line-height: 1.2;
  letter-spacing: -0.5px;
  padding: 2px 0 2px 7px;
  background: url('/img/bg/bg_drag_info_li.png') left 8px no-repeat;
  word-break: keep-all;
}

.welcomeWrap .mBox {
  position: relative;
  border-top: 3px #c2c2c2 solid;
  border-bottom: 1px #c2c2c2 solid;
  padding: 10px 0;
}
.welcomeWrap .mBox:after {
  content: '';
  display: block;
  clear: both;
}
.welcomeWrap .movieBox {
  position: relative;
  width: 44.08%;
  float: left;
  margin: 0 20px 0 0;
}
.welcomeWrap .movieBox .img {
  width: 100%;
  overflow: hidden;
}
.welcomeWrap .movieBox .img img {
  width: 100%;
}
.welcomeWrap .movieBox a {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: url('/img/bg/bg_moviebox_a_back.png') left top repeat;
}
.welcomeWrap .movieBox a img {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -32px 0 0 -32px;
  z-index: 2;
}
.welcomeWrap .fileMovie {
  position: absolute;
  left: 46.23%;
  top: 50%;
  width: 53.77%;
  margin: -65px 0 0 0;
}

.nextStep {
  width: 100%;
  text-align: center;
  margin: 20px 0 0 0;
  padding: 93px 0 0 0;
  border-top: 1px #666 solid;
  overflow: hidden;
}
.nextStep .nTxt {
  width: 100%;
  word-break: keep-all;
}
.nextStep .nTxt:after {
  content: '';
  display: block;
  clear: both;
}
.nextStep .nTxt span {
  display: block;
  font-size: 18px;
  color: #000;
  line-height: 1.6;
  font-weight: 600;
}

.howToApp:after {
  content: '';
  display: block;
  clear: both;
}
.howToApp .htTxt {
  font-size: 24px;
  color: #333;
  line-height: 1.3;
  margin: 45px 0 0 0;
}
.howToApp .htImg {
  width: 100%;
  text-align: center;
  margin: 93px 0;
}
.howToApp .htImg img {
  max-width: 100%;
}
.howToApp .htImg img.w {
  display: inline-block;
}
.howToApp .htImg img.m {
  display: none;
}
.howToApp .htaList:after {
  content: '';
  display: block;
  clear: both;
}
.howToApp .htaList ul:after {
  content: '';
  display: block;
  clear: both;
}
.howToApp .htaList ul li {
  position: relative;
  display: block;
  margin: 0 0 46px 0;
  padding: 0 0 0 143px;
  word-break: keep-all;
}
.howToApp .htaList ul li .ico {
  position: absolute;
  left: 0;
  top: 0;
}
.howToApp .htaList ul li .inbox {
  position: relative;
  padding: 0 0 0 330px;
}
.howToApp .htaList ul li .inbox .tit {
  position: absolute;
  left: 0;
  top: 30px;
}
.howToApp .htaList ul li .inbox .tit span {
  display: block;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  font-weight: 800;
}
.howToApp .htaList ul li .inbox .txt {
  min-height: 82px;
  font-size: 16px;
  color: #000;
  line-height: 1.3;
  padding: 26px 0 0 0;
}
.howToApp .htaList ul li:last-child {
  margin: 0;
}
.howToApp .hbTxt {
  font-size: 30px;
  color: #fbc61e;
  font-weight: 700;
  line-height: 1.3;
  margin: 60px 0 0 0;
  text-align: center;
  word-break: keep-all;
}

/*** account ***/
.accountSchedule {
  position: relative;
  width: 100%;
  margin: 0 0 40px 0;
  padding: 0 360px 0 0;
  box-sizing: border-box;
}
.accountSchedule .asTit {
  width: 100%;
  font-size: 42px;
  color: #333;
  font-weight: 800;
  line-height: 1.2;
  padding: 0 0 20px 0;
}
.accountSchedule .accountSet {
  position: absolute;
  right: 0;
  bottom: 0;
}
.accountSchedule .accountSet ul:after {
  content: '';
  display: block;
  clear: both;
}
.accountSchedule .accountSet ul li {
  float: left;
  width: 145px;
  height: 145px;
  margin: 0 0 0 10px;
}
.accountSchedule .accountSet ul li a {
  display: block;
  width: 100%;
  height: 100%;
  background: #fbc61e;
  border-radius: 3px;
  text-align: center;
}
.accountSchedule .accountSet ul li a .ico {
  padding: 30px 0 0 0;
}
.accountSchedule .accountSet ul li a .txt {
  font-family: 'Noto Sans KR';
  font-size: 12px;
  color: #fff;
  line-height: 1.2;
  padding: 18px 0 0 0;
  word-break: keep-all;
}

.accountHead {
  position: relative;
  width: 100%;
  margin: 0 0 42px 0;
}
.accountHead:after {
  content: '';
  display: block;
  clear: both;
}
.accountHead .tit {
  width: 100%;
  font-size: 42px;
  color: #333;
  font-weight: 800;
  line-height: 1.2;
}
.accountHead .dayTit {
  width: 100%;
  font-size: 42px;
  color: #333;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
}
.accountHead .period {
  position: relative;
  display: inline-block;
  margin: 13px 0 0 0;
}
.accountHead .period span {
  font-size: 30px;
  color: #333;
  font-weight: 600;
  line-height: 30px;
  padding: 0 50px;
}
.accountHead .period .prev {
  position: absolute;
  left: 0;
  top: 0;
}
.accountHead .period .next {
  position: absolute;
  right: 0;
  top: 0;
}

.accountHead .scheduleNoti {
  margin: 52px 0 0 0;
}
.accountHead .scheduleNoti:after {
  content: '';
  display: block;
  clear: both;
}
.accountHead .scheduleNoti ul {
  width: 100%;
}
.accountHead .scheduleNoti ul li {
  float: left;
  width: 16.6666%;
}
.accountHead .scheduleNoti ul li .cbox {
  font-size: 14px;
  color: #000;
  margin: 0 1px;
  line-height: 60px;
  text-align: center;
  border-radius: 3px;
}
.accountHead .scheduleNoti ul li:nth-child(1) .cbox {
  background: #f0f1c6;
}
.accountHead .scheduleNoti ul li:nth-child(2) .cbox {
  background: #c0e0e6;
}
.accountHead .scheduleNoti ul li:nth-child(3) .cbox {
  background: #bdd1ea;
}
.accountHead .scheduleNoti ul li:nth-child(4) .cbox {
  background: #d1c9df;
}
.accountHead .scheduleNoti ul li:nth-child(5) .cbox {
  background: #f7c5c8;
}
.accountHead .scheduleNoti ul li:nth-child(6) .cbox {
  background: #fdd6b3;
}

.accountHead .rInfoTy {
  position: absolute;
  right: 0;
  top: 10px;
  padding: 0 90px 0 0;
}
.accountHead .rInfoTy .icoZone {
  position: absolute;
  right: 0;
  top: 0;
}
.accountHead .rInfoTy .icoZone ul:after {
  content: '';
  display: block;
  clear: both;
}
.accountHead .rInfoTy .icoZone ul li {
  position: relative;
  float: left;
  margin: 0 8px 0 0;
}
.accountHead .rInfoTy .icoZone ul li span {
  position: absolute;
  right: -7px;
  top: -7px;
  width: 20px;
  height: 20px;
  font-size: 12px;
  color: #fff;
  font-weight: 500;
  text-align: center;
  line-height: 20px;
  border-radius: 100%;
  background: #ff0000;
}
.accountHead .rInfoTy .infoZone {
  text-align: right;
}
.accountHead .rInfoTy .infoZone span {
  display: block;
  font-size: 14px;
  color: #333;
  line-height: 1.2;
}
.accountHead .rInfoTy .infoZone strong {
  display: block;
  font-size: 18px;
  color: #333;
  line-height: 1.2;
  font-weight: 800;
}
.accountHead.space {
  margin: 200px 0 42px 0;
}

.accountSearch {
  position: relative;
  width: 100%;
  margin: 0 0 20px 0;
}
.accountSearch:after {
  content: '';
  display: block;
  clear: both;
}
.accountSearch .days {
  display: inline-block;
  float: left;
}
.accountSearch .days:after {
  content: '';
  display: block;
  clear: both;
}
.accountSearch .days ul:after {
  content: '';
  display: block;
  clear: both;
}
.accountSearch .days ul li {
  float: left;
}
.accountSearch .days ul li input {
  width: 148px;
  text-align: center;
  padding: 0;
  height: 40px;
  line-height: 40px;
}
.accountSearch .days ul li.unit {
  width: 40px;
  text-align: center;
  font-size: 42px;
  color: #c2c2c2;
  line-height: 40px;
  font-weight: 300;
}
.accountSearch .days ul li img {
  padding: 0 0 0 10px;
}
.accountSearch .studentS {
  display: inline-block;
  float: left;
  margin: 0 50px 0 0;
}
.accountSearch .studentS:after {
  content: '';
  display: block;
  clear: both;
}
.accountSearch .studentS span {
  font-size: 14px;
  color: #333;
  line-height: 40px;
  font-weight: 600;
  padding: 0 12px 0 0;
}
.accountSearch .studentS input {
  width: 198px;
  text-align: left;
  padding: 0 0 0 12px;
  height: 40px;
  line-height: 40px;
  box-sizing: border-box;
}
.accountSearch .studentS a {
  display: inline-block;
  width: 100px;
  text-align: center;
  font-size: 14px;
  color: #fff;
  line-height: 40px;
  font-weight: 600;
  background: #666;
}
.accountSearch .selectBox {
  position: absolute;
  right: 0;
  top: 0;
}
.accountSearch .selectBox span.searchStyleSelectBox {
  height: 40px;
  background-size: auto 40px;
}
.accountSearch .selectBox .searchStyleSelectBoxInner {
  white-space: nowrap;
  line-height: 40px;
}

.accountDash {
  width: 100%;
  margin: 0 0 45px 0;
  overflow: hidden;
}
.accountDash ul:after {
  content: '';
  display: block;
  clear: both;
}
.accountDash ul li {
  float: left;
  width: 20%;
  text-align: center;
  background: url('/img/bg/bg_account_dash_li.png') left top no-repeat;
}
.accountDash ul li .atit {
  font-size: 14px;
  color: #000;
  font-weight: 600;
  line-height: 1.2;
  padding: 30px 0 0 0;
}
.accountDash ul li .atit span {
  font-size: 14px;
  color: #000;
  font-weight: 600;
  line-height: 1.2;
}
.accountDash ul li .anum {
  font-size: 48px;
  color: #fbc61e;
  line-height: 1.2;
  padding: 0 0 32px 0;
}

.accountInfo {
  width: 100%;
  border-top: 3px #c2c2c2 solid;
  overflow: hidden;
}
.accountInfo table {
  vertical-align: middle;
  text-align: left;
}
.accountInfo table td {
  position: relative;
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  padding: 18px 10px 18px 30px;
}
.accountInfo table td:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.accountInfo table td:last-child:after {
  display: none;
}
.accountInfo table td.center {
  text-align: center;
  padding: 18px 5px;
}
.accountInfo table td span.ty {
  display: inline-block;
  font-size: 14px;
  color: #fff;
  line-height: 25px;
  background: #e94830;
  border-radius: 3px;
  padding: 0 10px;
  margin: 2px 0;
}
.accountInfo table tr.point td {
  font-size: 16px;
  padding: 10px 10px 10px 30px;
}
.accountInfo table tr.point td .time {
  font-size: 24px;
}
.accountInfo table tr.point td.center {
  padding: 10px 5px;
}
.accountInfo table td .entrance {
  width: 100%;
}
.accountInfo table td .entrance a {
  display: block;
  width: 80%;
  margin: 0 auto;
  font-size: 24px;
  color: #fff;
  line-height: 45px;
  text-align: center;
  background: #fbc61e;
  border-radius: 3px;
}
.accountInfo table td .leftTime {
  font-size: 12px;
  color: #ff0055;
  line-height: 1.2;
  text-align: center;
  padding: 8px 0 0 0;
}
.accountInfo .tth1 {
  width: 175px;
}
.accountInfo .tth2 {
  width: 140px;
}
.accountInfo .tth3 {
  width: 240px;
}

.accountAtable {
  width: 100%;
  border-top: 2px #c2c2c2 solid;
  overflow: hidden;
}
.accountAtable table {
  vertical-align: middle;
  text-align: left;
  border-top: 1px #c2c2c2 solid;
}
.accountAtable table th {
  position: relative;
  border-bottom: 1px #c2c2c2 solid;
  padding: 20px 0;
  text-align: left;
}
.accountAtable table th span {
  font-size: 16px;
  color: #000;
  font-weight: 700;
  padding: 0 0 0 30px;
}
.accountAtable table th:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.accountAtable table td {
  position: relative;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  padding: 0 10px 0 30px;
}
.accountAtable .setth1 {
  width: 248px;
}

.accountBtable {
  position: relative;
  width: 100%;
  border-top: 2px #c2c2c2 solid;
  overflow: hidden;
}
.accountBtable table {
  vertical-align: middle;
  text-align: left;
  border-top: 1px #c2c2c2 solid;
}
.accountBtable table th {
  position: relative;
  border-bottom: 1px #c2c2c2 solid;
  background: #efefef;
  padding: 20px 0;
  text-align: center;
}
.accountBtable table th span {
  font-size: 16px;
  color: #000;
  font-weight: 700;
}
.accountBtable table th:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.accountBtable table th:last-child:after {
  display: none;
}
.accountBtable table td {
  position: relative;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  padding: 12px 10px 12px 30px;
}
.accountBtable table td:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.accountBtable table td:last-child:after {
  display: none;
}
.accountBtable table td.center {
  text-align: center;
  padding: 12px 5px;
}
.accountBtable table td img {
  margin: 0 5px;
}
.accountBtable table td .wtime {
  font-size: 12px;
  color: #ff0055;
  line-height: 1.2;
  padding: 2px 0 0 0;
}
.accountBtable .custom-checkbox label {
  display: inline-block;
  position: relative;
  z-index: 1;
  cursor: pointer;
  font-size: 16px;
  color: #000;
  padding: 0 0 0 17px;
  line-height: 22px;
  word-break: keep-all;
  background: url('/img/ico/ico_checkbox_table.png') 0 top no-repeat;
}
.accountBtable .custom-checkbox label.checked {
  background-position: 0 -72px;
}

.accountBtable .hsth1 {
  width: 94px;
} /* Holiday Setting */
.accountBtable .hsth2 {
  width: 230px;
}
.accountBtable .hsth3 {
  width: 230px;
}
.accountBtable .hsth4 {
  width: 123px;
}

.accountBtable .wlth1 {
  width: 175px;
} /* Waiting List */
.accountBtable .wlth2 {
  width: 250px;
}
.accountBtable .wlth3 {
  width: 130px;
}
.accountBtable .wlth4 {
  width: 123px;
}

.accountBtable .mcth1 {
  width: 175px;
} /* My Class */
.accountBtable .mcth2 {
  width: 134px;
}
.accountBtable .mcth3 {
  width: 212px;
}
.accountBtable .mcth4 {
  width: 212px;
}

.accountBtable .rsth1 {
  width: 94px;
} /* Repeat Schedule */
.accountBtable .rsth2 {
  width: 100px;
}

.accountBtable .rtth1 {
  width: 115px;
} /* Resources */
.accountBtable .rtth2 {
  width: 200px;
}
.accountBtable .rtth3 {
  width: 190px;
}

.firstNoti {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  background: url('/img/bg/bg_first_notice.png') left top repeat;
  z-index: 10;
}
.firstNoti p {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  font-size: 24px;
  color: #000;
  font-weight: 700;
  line-height: 1.5;
  margin: -36px 0 0 0;
  word-break: keep-all;
}

/* payment info */
.paymentInfo {
  position: relative;
  width: 100%;
  border-top: 3px #c2c2c2 solid;
  overflow: hidden;
}
.paymentInfo .info {
  font-size: 30px;
  color: #000;
  font-weight: 700;
  padding: 42px 0;
}
.paymentInfo .total {
  position: absolute;
  right: 0;
  top: 0;
  float: right;
  text-align: right;
}
.paymentInfo .total .money {
  position: relative;
  display: inline-block;
  font-size: 60px;
  color: #fbc61e;
  font-weight: 800;
  line-height: 1.2;
  padding: 20px 0 0 0;
}
.paymentInfo .total .money:before {
  white-space: pre;
  content: 'Total\APayment';
  position: absolute;
  left: -134px;
  top: 33px;
  font-size: 24px;
  color: #999;
  font-weight: 700;
  line-height: 1;
}

/* payment data */
.paymentData {
  width: 100%;
  padding: 0 0 30px 0;
  overflow: hidden;
}
.paymentData > ul:after {
  content: '';
  display: block;
  clear: both;
}
.paymentData > ul > li {
  float: left;
  width: 20%;
  height: 150px;
  padding: 0 20px;
  box-sizing: border-box;
  background: #fbc61e;
  word-break: keep-all;
}
.paymentData > ul > li .tit {
  position: relative;
  font-size: 16px;
  color: #000;
  font-weight: 700;
  padding: 18px 54px 18px 0;
  border-bottom: 1px #fff solid;
}
.paymentData > ul > li .tit span {
  position: absolute;
  right: 0;
  top: 18px;
  font-size: 16px;
  color: #000;
  font-weight: 700;
}
.paymentData > ul > li .info {
  width: 100%;
  padding: 20px 0 0 0;
  word-break: keep-all;
}
.paymentData > ul > li .info ul:after {
  content: '';
  display: block;
  clear: both;
}
.paymentData > ul > li .info ul li {
  position: relative;
  display: block;
  font-size: 14px;
  color: #000;
  line-height: 1.3;
  font-weight: 600;
  padding: 0 54px 0 10px;
  background: url('/img/bg/bg_payment_data_info_li.png') left 7px no-repeat;
}
.paymentData > ul > li .info ul li span {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 14px;
  color: #000;
  font-weight: 600;
}
.paymentData > ul > li .stit {
  position: relative;
  font-size: 16px;
  color: #000;
  font-weight: 700;
  margin: 66px 0 0 0;
  padding: 0 54px 0 0;
}
.paymentData > ul > li .stit span {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 16px;
  color: #000;
  font-weight: 700;
}
.paymentData > ul > li .stit.dep {
  margin: 54px 0 0 0;
  padding: 0 15px 0 0;
}
.paymentData > ul > li .stit.dep u {
  display: block;
  text-decoration: none;
  font-size: 16px;
  color: #000;
  font-weight: normal;
  padding: 2px 0 0 0;
}
.paymentData > ul > li.ty .stit {
  color: #fbc61e;
}
.paymentData > ul > li.ty .stit span {
  color: #fbc61e;
}
.paymentData > ul > li .etit {
  position: relative;
  font-size: 16px;
  color: #fbc61e;
  font-weight: 700;
  line-height: 1.2;
  padding: 27px 54px 27px 0;
  border-bottom: 1px #999 solid;
}
.paymentData > ul > li .etit span {
  position: absolute;
  right: 0;
  top: 27px;
  font-size: 16px;
  color: #fbc61e;
  font-weight: 700;
}
.paymentData > ul > li .etit:last-child {
  border: 0;
}
.paymentData > ul > li:nth-child(even) {
  background: #000;
}
.paymentData > ul > li:nth-child(even) .tit {
  color: #fbc61e;
  border-color: #999;
}
.paymentData > ul > li:nth-child(even) .tit span {
  color: #fbc61e;
}
.paymentData > ul > li:nth-child(even) .info ul li {
  color: #fbc61e;
  background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
}
.paymentData > ul > li:nth-child(even) .info ul li span {
  color: #fbc61e;
}

/* payment table */
.payTable {
  width: 100%;
  padding: 50px;
  margin: 20px 0 0 0;
  background: #f2f2f2;
  box-sizing: border-box;
}
.payTable .payHead {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.payTable .payHead .ptit {
  font-size: 24px;
  color: #000;
  font-weight: 700;
  line-height: 1.2;
  padding: 0 0 18px 0;
}
.payTable .payHead .total {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 16px;
  color: #000;
  font-weight: 700;
  line-height: 1.2;
}
.payTable .payHead .total span {
  font-size: 24px;
  color: #000;
  font-weight: 700;
  line-height: 1.2;
  padding: 0 0 0 18px;
}
.payTable table {
  vertical-align: middle;
  text-align: center;
  border: 1px #c2c2c2 solid;
  border-top: 3px #c2c2c2 solid;
  border-bottom: 0;
  background: #fff;
}
.payTable table th {
  position: relative;
  border-bottom: 1px #c2c2c2 solid;
  padding: 18px 0;
  text-align: center;
}
.payTable table th span {
  font-size: 16px;
  color: #000;
  font-weight: 700;
}
.payTable table th:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.payTable table td {
  position: relative;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  padding: 18px 0;
}
.payTable table td:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.payTable table th:nth-child(2) {
  border-right: 1px #c2c2c2 solid;
}
.payTable table th:nth-child(2):after {
  display: none;
}
.payTable table th:last-child:after {
  display: none;
}
.payTable table td:nth-child(2) {
  border-right: 1px #c2c2c2 solid;
}
.payTable table td:nth-child(2):after {
  display: none;
}
.payTable table td:last-child:after {
  display: none;
}

/* schedule notice */
.scheduleNoti {
  width: 100%;
  text-align: center;
  overflow: hidden;
  word-break: keep-all;
}
.scheduleNoti strong {
  display: block;
  font-size: 24px;
  color: #000;
  font-weight: 700;
  line-height: 1.2;
  padding: 80px 0 22px 0;
}
.scheduleNoti p {
  font-size: 18px;
  color: #000;
  line-height: 1.2;
  padding: 0 0 90px 0;
}

/* schedule list */
.scheduleList {
  width: 100%;
  overflow: hidden;
}
.scheduleList ul {
  margin: 0 -3% 0 0;
}
.scheduleList ul:after {
  content: '';
  display: block;
  clear: both;
}
.scheduleList ul li {
  float: left;
  width: 47%;
  margin: 0 3% 3% 0;
  border: 1px #ccc solid;
  box-sizing: border-box;
}
.scheduleList ul li .inbox {
  position: relative;
  width: 100%;
  height: 148px;
  padding: 18px 6.66%;
  border: 4px #fff solid;
  box-sizing: border-box;
}
.scheduleList ul li .inbox .cont {
  position: relative;
  padding: 7px 0 7px 90px;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
}
.scheduleList ul li .inbox .cont span {
  position: absolute;
  left: 0;
  top: 7px;
  font-size: 16px;
  color: #fbc61e;
  font-weight: 700;
  line-height: 1.2;
}
.scheduleList ul li .inbox a {
  display: block;
  position: absolute;
  right: 6.66%;
  top: 50%;
  width: 140px;
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #fff;
  line-height: 90px;
  margin: -45px 0 0 0;
  text-align: center;
  background: #999;
  border-radius: 3px;
}
.scheduleList ul li.on {
  border: 1px #fbc61e solid;
}
.scheduleList ul li.on .inbox {
  border: 4px #fbc61e solid;
}

/* right search */
.rSearch {
  width: 100%;
  padding: 0 0 20px 0;
  margin: 160px 0 0 0;
  overflow: hidden;
}
.rSearch ul {
  float: right;
}
.rSearch ul li {
  float: left;
}
.rSearch ul li input[type='text'] {
  width: 300px;
  height: 40px;
  margin: 0 0 0 10px;
  line-height: 40px;
}
.rSearch ul li a {
  display: inline-block;
  width: 100px;
  height: 40px;
  font-size: 14px;
  color: #fff;
  font-weight: 700;
  line-height: 40px;
  letter-spacing: 0.5px;
  text-align: center;
  background: #666;
  border-radius: 2px;
}

/* resources list */
.resourcesList {
  width: 100%;
  border-bottom: 1px #c2c2c2 solid;
  overflow: hidden;
}
.resourcesList ul {
  margin: 0 -1% 0 0;
}
.resourcesList ul:after {
  content: '';
  display: block;
  clear: both;
}
.resourcesList ul li {
  float: left;
  width: 24%;
  margin: 0 1% 58px 0;
}
.resourcesList ul li .movie {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.resourcesList ul li .movie .img {
  width: 100%;
}
.resourcesList ul li .movie .img img {
  width: 100%;
}
.resourcesList ul li .movie .btn {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url('/img/bg/bg_resources_list.png') left top repeat;
}
.resourcesList ul li .movie .btn a {
  display: block;
}
.resourcesList ul li .movie .btn a img {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -32px 0 0 -32px;
}
.resourcesList ul li .name {
  font-size: 16px;
  color: #000;
  font-weight: 600;
  line-height: 1.2;
  padding: 16px 0 0 0;
}

/* pay content */
.payCHead {
  position: relative;
  width: 100%;
}
.payCHead:after {
  content: '';
  display: block;
  clear: both;
}
.payCHead .tit {
  width: 100%;
  font-size: 42px;
  color: #333;
  font-weight: 800;
  line-height: 1.2;
}
.payCHead .ptxt {
  font-size: 24px;
  color: #000;
  line-height: 1.2;
  padding: 52px 0 34px 45px;
  letter-spacing: -0.5px;
}

#payTitle {
  font-size: 30px;
  color: #fbc61e;
  line-height: 1.2;
  font-weight: 700;
  padding: 0 0 10px 0;
}

#payDescription {
  font-size: 24px;
  color: #333;
  line-height: 1.2;
  padding: 0 0 20px 0;
}

.payCHead .pimg {
  position: relative;
  width: 100%;
  height: 210px;
}
.payCHead .pimg:after {
  content: '';
  display: block;
  clear: both;
}
.payCHead .pimg .people {
  position: absolute;
  right: 9.67%;
  bottom: 0;
}
.payCHead .pimg .img {
  position: absolute;
  left: 0;
  bottom: 0;
}
.payCHead .pimg p {
  position: relative;
  font-size: 36px;
  color: #fbc61e;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.5px;
  padding: 57px 0 0 46px;
  z-index: 2;
  word-break: keep-all;
}
.payCHead .list {
  margin: 98px 40px 0;
}
.payCHead .list:after {
  content: '';
  display: block;
  clear: both;
}
.payCHead .list ul:after {
  content: '';
  display: block;
  clear: both;
}
.payCHead .list ul li {
  float: left;
  width: 27.333%;
  margin: 0 3%;
  text-align: center;
  word-break: keep-all;
}
.payCHead .list ul li .ico {
  padding: 0 0 25px 0;
}
.payCHead .list ul li .ico img {
  max-width: 100%;
}
.payCHead .list ul li .tit {
  font-size: 18px;
  color: #000;
  line-height: 1.2;
  font-weight: normal;
  padding: 0 0 22px 0;
  letter-spacing: -0.5px;
}
.payCHead .list ul li .tit span {
  display: block;
  font-size: 24px;
  color: #000;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.5px;
}
.payCHead .list ul li .txt {
  font-size: 18px;
  color: #000;
  line-height: 1.4;
  font-weight: 300;
}

/* about */
.aboutWrap {
  position: relative;
  width: 100%;
}
.aboutWrap:after {
  content: '';
  display: block;
  clear: both;
}
.aboutWrap .atit {
  width: 100%;
  font-size: 42px;
  color: #333;
  font-weight: 800;
  line-height: 1.2;
  padding: 0 0 58px 0;
}
.aboutWrap .aboutUs {
  position: relative;
  width: 100%;
}
.aboutWrap .aboutUs:after {
  content: '';
  display: block;
  clear: both;
}
.aboutWrap .aboutUs .aBox {
  margin: 0 50% 0 0;
  word-break: keep-all;
}
.aboutWrap .aboutUs .aBox:after {
  content: '';
  display: block;
  clear: both;
}
.aboutWrap .aboutUs .aBox .htit {
  font-size: 30px;
  color: #fbc61e;
  line-height: 1.2;
  font-weight: 700;
  padding: 0 0 10px 0;
}
.aboutWrap .aboutUs .aBox .stit {
  font-size: 24px;
  color: #333;
  line-height: 1.2;
  padding: 0 0 20px 0;
}
.aboutWrap .aboutUs .aBox .stxt {
  font-size: 18px;
  color: #000;
  line-height: 1.4;
  font-weight: 300;
  padding: 0 0 90px 0;
}
.aboutWrap .aboutUs .aImg {
  position: absolute;
  right: 0;
  top: -25px;
}
.aboutWrap .aboutUs .abNoti {
  margin: 0 120px;
}
.aboutWrap .aboutUs .abNoti ul:after {
  content: '';
  display: block;
  clear: both;
}
.aboutWrap .aboutUs .abNoti ul li {
  float: left;
  width: 27.333%;
  margin: 0 3%;
  text-align: center;
  word-break: keep-all;
}
.aboutWrap .aboutUs .abNoti ul li .ico {
  padding: 0 0 30px 0;
}
.aboutWrap .aboutUs .abNoti ul li .ico img {
  max-width: 100%;
}
.aboutWrap .aboutUs .abNoti ul li .txt {
  font-size: 18px;
  color: #000;
  line-height: 1.4;
  font-weight: 300;
}

.aboutWrap .aboutUs .classT {
  font-size: 24px;
  color: #333;
  line-height: 1.2;
  padding: 0 0 218px 0;
  word-break: keep-all;
}
.aboutWrap .aboutUs .classT:after {
  content: '';
  display: block;
  clear: both;
}
.aboutWrap .aboutUs .classI {
  position: absolute;
  right: 0;
  top: -48px;
}
.aboutWrap .aboutUs .classY {
  font-size: 30px;
  color: #fbc61e;
  font-weight: 800;
  line-height: 1.2;
  padding: 0 0 42px 0;
}
.aboutWrap .aboutUs .abClass {
  margin: 130px 60px 50px;
}
.aboutWrap .aboutUs .abClass ul:after {
  content: '';
  display: block;
  clear: both;
}
.aboutWrap .aboutUs .abClass ul li {
  float: left;
  width: 27.333%;
  margin: 0 3%;
  text-align: left;
  word-break: keep-all;
}
.aboutWrap .aboutUs .abClass ul li .ico {
  padding: 0 0 30px 0;
  text-align: center;
}
.aboutWrap .aboutUs .abClass ul li .ico img {
  max-width: 100%;
}
.aboutWrap .aboutUs .abClass ul li .tit {
  font-size: 16px;
  color: #000;
  line-height: 1.4;
  font-weight: 700;
  padding: 24px 0 20px 0;
}
.aboutWrap .aboutUs .abClass ul li .txt {
  font-size: 16px;
  color: #000;
  line-height: 1.6;
  font-weight: 300;
}
.aboutWrap .aboutUs .classC {
  position: relative;
  /* padding: 0 52% 0 0; */
  word-break: keep-all;
}
.aboutWrap .aboutUs .classC p {
  font-size: 16px;
  color: #000;
  line-height: 1.6;
  font-weight: 300;
  padding: 0 0 22px 0;
}
.aboutWrap .aboutUs .classC .classCImg {
  text-align: center;
  /* position: absolute;
  right: 0;
  top: -60px; */
}

.aboutWrap .aboutUs .ourVtxt {
  position: relative;
  width: 50%;
  padding: 0 50% 0 0;
}
.aboutWrap .aboutUs .ourVtxt:after {
  content: '';
  display: block;
  clear: both;
}
.aboutWrap .aboutUs .ourVtxt .otit {
  font-size: 30px;
  color: #fbc61e;
  font-weight: 800;
  line-height: 1.2;
  padding: 0 0 4px 0;
  word-break: keep-all;
}
.aboutWrap .aboutUs .ourVtxt .stit {
  font-size: 24px;
  color: #333;
  line-height: 1.2;
  padding: 0 0 22px 0;
  word-break: keep-all;
}
.aboutWrap .aboutUs .ourVtxt .stxt {
  font-size: 18px;
  color: #000;
  line-height: 1.4;
  word-break: keep-all;
}
.aboutWrap .aboutUs .ourVtxt .simg {
  position: absolute;
  right: 0;
  top: -97px;
}
.aboutWrap .aboutUs .ourVimg {
  margin: 116px 0 0 0;
  text-align: center;
}
.aboutWrap .aboutUs .ourVimg img {
  max-width: 100%;
}
.aboutWrap .aboutUs .ourVimg img.w {
  display: inline-block;
}
.aboutWrap .aboutUs .ourVimg img.m {
  display: none;
}
.aboutWrap .aboutUs .ourVList {
  padding: 95px 0 0 0;
}
.aboutWrap .aboutUs .ourVList ul {
  margin: 0 -3% 0 0;
}
.aboutWrap .aboutUs .ourVList ul:after {
  content: '';
  display: block;
  clear: both;
}
.aboutWrap .aboutUs .ourVList ul li {
  float: left;
  width: 21%;
  margin: 0 3% 0 0;
  text-align: left;
  word-break: keep-all;
}
.aboutWrap .aboutUs .ourVList ul li .ico {
  padding: 0 0 25px 0;
  text-align: center;
}
.aboutWrap .aboutUs .ourVList ul li .ico img {
  max-width: 100%;
}
.aboutWrap .aboutUs .ourVList ul li .txt {
  font-size: 16px;
  color: #000;
  line-height: 1.6;
  font-weight: 300;
}

/* qa */
.faqType {
  position: relative;
  width: 100%;
  border-top: 2px #c2c2c2 solid;
  overflow: hidden;
}
.faqType table {
  vertical-align: middle;
  text-align: left;
  border-top: 1px #c2c2c2 solid;
}
.faqType table th {
  position: relative;
  border-bottom: 1px #c2c2c2 solid;
  background: #efefef;
  padding: 20px 10px;
  text-align: center;
}
.faqType table th span {
  font-size: 16px;
  color: #000;
  font-weight: 700;
}
.faqType table th:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.faqType table th:last-child:after {
  display: none;
}
.faqType table td {
  position: relative;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  padding: 20px 10px 20px 20px;
}
.faqType table td:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.faqType table td:last-child:after {
  display: none;
}
.faqType table td.lineNo:after {
  display: none;
}
.faqType table td.center {
  text-align: center;
  padding: 12px 5px;
}
.faqType tr.q * {
  cursor: pointer;
}
.faqType tr.a {
  display: none;
}

.faqType .faqth1 {
  width: 125px;
} /* faq */
.faqType .faqth2 {
  width: 78px;
}
.faqType .faqA {
  width: 100%;
  padding: 0 0 12px 0;
  overflow: hidden;
}
.faqType .faqA p {
  font-size: 16px;
  color: #000;
  font-weight: 300;
  line-height: 1.8;
  padding: 0 0 38px 0;
  word-break: keep-all;
}
.faqType .faqA p:last-child {
  padding: 0;
}
.faqType .arrow {
  width: 100%;
  height: 9px;
  background: url('/img/bg/bg_faq_down.png') center 50% no-repeat;
}
.faqType tr.on .arrow {
  background: url('/img/bg/bg_faq_up.png') center 50% no-repeat;
}

.inquiryType {
  position: relative;
  width: 100%;
  border-top: 2px #c2c2c2 solid;
  overflow: hidden;
}
.inquiryType table {
  vertical-align: middle;
  text-align: left;
  border-top: 1px #c2c2c2 solid;
}
.inquiryType table th {
  position: relative;
  border-bottom: 1px #c2c2c2 solid;
  background: #efefef;
  padding: 20px 10px;
  text-align: center;
}
.inquiryType table th span {
  font-size: 16px;
  color: #000;
  font-weight: 700;
}
.inquiryType table th:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.inquiryType table th:last-child:after {
  display: none;
}
.inquiryType table td {
  position: relative;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  padding: 20px 10px 20px 20px;
}
.inquiryType table td:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 37px;
  background: #c2c2c2;
}
.inquiryType table td:last-child:after {
  display: none;
}
.inquiryType table td.lineNo:after {
  display: none;
}
.inquiryType table td.center {
  text-align: center;
  padding: 12px 5px;
}
.inquiryType table td .answer {
  margin: 0 30px 0 116px;
  word-break: keep-all;
}
.inquiryType table td .answer:after {
  content: '';
  display: block;
  clear: both;
}
.inquiryType table td .answer .cont {
  font-size: 16px;
  color: #000;
  font-weight: 300;
  line-height: 1.8;
}
.inquiryType table td .answer .admin {
  margin: 25px 0 0 0;
  padding: 20px 25px;
  background: #efefef;
  font-size: 16px;
  color: #000;
  font-weight: 300;
  line-height: 1.8;
}
.inquiryType table td span.day {
  display: inline-block;
  font-size: 11px;
  color: #999;
  line-height: 20px;
  padding: 0 0 0 30px;
  letter-spacing: 0.5px;
  background: url('/img/bg/bg_inquiry_type_span_noti.png') left top no-repeat;
}
.inquiryType tr.q * {
  cursor: pointer;
}
.inquiryType tr.a {
  display: none;
}

.inquiryType .quth1 {
  width: 120px;
} /* questions */
.inquiryType .quth2 {
  width: 186px;
}
.inquiryType .quth3 {
  width: 186px;
}

/***** common *****/

/* file */
.fileBox {
  position: relative;
  padding: 0 150px 0 0;
}
.fileBox:after {
  content: '';
  display: block;
  clear: both;
  *zoom: 1;
}
.fileBox input[type='text'] {
  cursor: pointer;
  border-radius: 3px 0 0 3px;
}
.fileBox .btn {
  position: absolute;
  right: 0;
  top: 0;
  width: 150px;
  height: 50px;
  font-size: 14px;
  color: #000;
  line-height: 50px;
  text-align: center;
  background: #c2c2c2;
  border-radius: 0 3px 3px 0;
  z-index: 10;
}
.fileBox .hideCon {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  box-sizing: border-box;
  overflow: hidden;
  z-index: 20;
}
.fileBox .hideCon:after {
  content: '';
  display: block;
  clear: both;
}
.fileBox .fileHidden {
  position: relative;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 50px;
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: alpha(opacity=0);
  cursor: pointer;
  background: #f3f5f6;
}

/* btn area */
.btnArea {
  position: relative;
  padding: 50px 0 0 0;
  text-align: center;
  font-size: 0;
  line-height: 0;
}
.btnArea:after {
  content: '';
  display: block;
  clear: both;
  *zoom: 1;
}
.btnArea .cBtn {
  display: inline-block;
  width: 300px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  background: #fbc61e;
  border-radius: 3px;
}
.btnArea .bBtn {
  display: inline-block;
  width: 300px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  background: #000;
  border-radius: 3px;
}
.btnArea .yBtn {
  display: inline-block;
  width: 200px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  background: #fbc61e;
  border-radius: 3px;
}
.btnArea .cancelBtn {
  display: inline-block;
  width: 200px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  background: #999;
  border-radius: 3px;
}
.btnArea .short {
  width: 150px;
}
.btnArea a {
  margin: 0 10px;
}

.tabtnArea {
  position: relative;
  padding: 30px 0 0 0;
  text-align: center;
}
.tabtnArea:after {
  content: '';
  display: block;
  clear: both;
  *zoom: 1;
}
.tabtnArea .gBtn {
  display: inline-block;
  width: 242px;
  height: 50px;
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 500;
  background: #bcbcbc;
  border-radius: 3px;
}
.tabtnArea .alignR {
  text-align: right;
}

/* select */
span.searchStyleSelectBox {
  width: 100%;
  height: 50px;
  margin: 0;
  padding: 0;
  font-size: 16px;
  background: url('/img/bg/bg_select_style.png') right center #fff no-repeat;
  border: 1px #ddd solid;
  border-radius: 3px;
  box-sizing: border-box;
}
.searchStyleSelectBoxInner {
  font-size: 16px;
  color: #000;
  white-space: nowrap;
  line-height: 46px;
  padding: 0 45px 0 20px;
}

span.bdSbox {
  min-width: 180px;
  height: 40px;
  margin: 0;
  padding: 0;
  background: url('/img/bg/bg_select_style.png') right center no-repeat;
  background-size: auto 40px;
  border: 1px #ddd solid;
  border-radius: 3px;
  box-sizing: border-box;
}
.bdSboxInner {
  font-size: 16px;
  color: #000;
  white-space: nowrap;
  line-height: 40px;
  padding: 0 45px 0 20px;
}

span.searchStyleSelectBox2 {
  min-width: 280px;
  height: 50px;
  margin: 0;
  padding: 0;
  font-size: 16px;
  background: url('/img/bg/bg_select_style.png') right center #fff no-repeat;
  border: 1px #ddd solid;
  border-radius: 3px;
  box-sizing: border-box;
}
.searchStyleSelectBoxInner2 {
  font-size: 16px;
  color: #000;
  white-space: nowrap;
  line-height: 46px;
  padding: 0 45px 0 20px;
}

/* checkbox, radio */
/* wrapper divs */
.custom-checkbox,
.custom-radio {
  position: relative;
  z-index: 1;
}
.custom-checkbox label.empty {
  padding-left: 22px;
}
.custom-radio label.empty {
  padding-left: 22px;
}
/* input, label positioning */
.custom-checkbox input,
.custom-radio input {
  margin: 0;
  z-index: 0;
  height: 0;
  width: 0;
}
.custom-checkbox label,
.custom-radio label {
  display: inline-block;
  position: relative;
  z-index: 1;
  cursor: pointer;
  font-size: 16px;
  color: #000;
  padding: 0 0 0 25px;
  line-height: 22px;
  word-break: keep-all;
}
/* states */
.custom-checkbox label {
  background: url('/img/ico/ico_checkbox.png') 0 3px no-repeat;
}
.custom-radio label {
  background: url('/img/ico/ico_checkbox.png') 0 -77px no-repeat;
}
.custom-checkbox label.checked {
  background-position: 0 -39px;
}
.custom-radio label.checked {
  background-position: 0 -115px;
}

/* input */
input[type='text'],
input[type='password'] {
  width: 100%;
  height: 50px;
  font-size: 16px;
  color: #000;
  line-height: 50px;
  padding: 0 0 0 20px;
  border: 1px #ddd solid;
  margin: 0;
  border-radius: 2px;
  box-sizing: border-box;
}
input[type='text']:focus,
input[type='password']:focus {
  outline: 0;
  border-color: #000 !important;
}
input[type='checkbox'] {
  opacity: 0;
}
input[type='radio'] {
  opacity: 0;
}

/* -placeholder */
input::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #c2c2c2;
}
input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #c2c2c2;
  opacity: 1;
}
input::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #c2c2c2;
  opacity: 1;
}
input::-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #c2c2c2;
}

textarea {
  border-radius: 3px;
}
textarea::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #c2c2c2;
}
textarea:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #c2c2c2;
  opacity: 1;
}
textarea::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #c2c2c2;
  opacity: 1;
}
textarea:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #c2c2c2;
}
textarea::-ms-input-placeholder {
  /* Internet Explorer Edge  */
  color: #c2c2c2;
}
textarea:focus {
  outline: 0;
  border-color: #848689;
}
input[readonly] {
  background-color: #f1eeee;
  color: #999;
}
input[disabled] {
  background-color: #f1eeee;
  color: #999;
}
::-webkit-file-upload-button {
  cursor: pointer;
}

/* table guard */
.tableGuard {
  width: 100%;
}
.tableGuard:after {
  content: '';
  display: block;
  clear: both;
  *zoom: 1;
}

/* paging */
.pagingArea {
  position: relative;
  width: 100%;
  padding: 50px 0 0 0;
}
.pagingArea:after {
  content: '';
  display: block;
  clear: both;
  *zoom: 1;
}
.pagingArea .paging {
  width: 100%;
  overflow: hidden;
  font-size: 0;
  text-align: center;
  padding: 9px 0;
}
.pagingArea .paging a {
  display: inline-block;
  width: 32px;
  height: 32px;
  text-align: center;
  font-size: 14px;
  color: #111;
  font-weight: 600;
  line-height: 32px;
}
.pagingArea .paging a.on {
  color: #fff;
  background: #fbc61e;
  border-radius: 100%;
}
.pagingArea .paging a.n {
  margin: 0 4px;
}
.pagingArea .paging a.n img {
  vertical-align: top;
}
.pagingArea .paging a.n.prev {
  margin-right: 22px;
}
.pagingArea .paging a.n.next {
  margin-left: 22px;
}
.pagingArea .selectDelBtn {
  position: absolute;
  left: 0;
  top: 50px;
  display: inline-block;
  width: 95px;
  height: 50px;
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 500;
  background: #999;
  border-radius: 3px;
}
.pagingArea .hsAddBtn {
  position: absolute;
  right: 0;
  top: 50px;
  display: inline-block;
  width: 242px;
  height: 50px;
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 500;
  background: #fbc61e;
  border-radius: 3px;
}
.pagingArea .yrBtn {
  position: absolute;
  right: 0;
  top: 50px;
  display: inline-block;
  width: 150px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-weight: 500;
  background: #fbc61e;
  border-radius: 3px;
}
.pagingArea .boardBtn {
  position: absolute;
  right: 0;
  top: 59px;
}
.pagingArea .boardBtn span {
  font-size: 16px;
  color: #000;
  line-height: 30px;
  padding: 0 22px 0 0;
}
.pagingArea .boardBtn a {
  display: inline-block;
  width: 120px;
  height: 30px;
  font-size: 16px;
  color: #fbc61e;
  line-height: 30px;
  text-align: center;
  font-weight: 600;
  background: #000;
  border-radius: 50px;
}

/* tabs */
.tabs {
  width: 100%;
  margin: 0 0 50px 0;
  overflow: hidden;
}
.tabs ul {
  margin: 0 -1px;
}
.tabs ul:after {
  content: '';
  display: block;
  clear: both;
}
.tabs ul li {
  position: relative;
  float: left;
  text-align: center;
  box-sizing: border-box;
}
.tabs ul li a {
  display: block;
  height: 50px;
  margin: 0 1px;
  background: #d3d3d3;
  box-sizing: border-box;
}
.tabs ul li a span {
  display: inline-block;
  font-size: 18px;
  color: #fff;
  line-height: 50px;
  font-weight: 700;
}
.tabs ul li.on a {
  background: #fbc61e;
}
.tabs ul li.on a span {
  color: #000;
}
.tabs ul.four li {
  width: 25%;
}
.tabs ul.five li {
  width: 20%;
}
.tabs ul.three li {
  width: 33.333%;
}

/* top search */
.topSearch {
  width: 100%;
  margin: 50px 0 20px 0;
}
.topSearch:after {
  content: '';
  display: block;
  clear: both;
}
.topSearch .rArea {
  float: right;
}
.topSearch .rArea:after {
  content: '';
  display: block;
  clear: both;
}
.topSearch .rArea ul:after {
  content: '';
  display: block;
  clear: both;
}
.topSearch .rArea ul li {
  float: left;
}
.topSearch .rArea ul li input {
  width: 298px;
  height: 40px;
}
.topSearch .rArea ul li a {
  display: inline-block;
  width: 100px;
  height: 40px;
  text-align: center;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  color: #fff;
  line-height: 40px;
  font-weight: 600;
  background: #666;
  border-radius: 2px;
}

/*** popWrap ***/
.popupTest a {
  font-size: 14px;
  font-weight: 600;
  color: #000;
  text-decoration: underline;
}

#popWrap .popBg {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #1b1b1c;
  opacity: 0;
  overflow: hidden;
  z-index: 1;
}
#popWrap {
  position: fixed;
  left: 0;
  top: 50%;
  width: 100%;
  height: 100%;
  z-index: 9999;
  opacity: 0;
}
#popWrap #guHead {
  width: 100%;
  height: 45px;
  overflow: hidden;
}
#popWrap #guHead .guClosed {
  position: absolute;
  right: -5px;
  top: 5px;
  z-index: 100;
}
#popWrap #guHead .guClosed a {
  display: block;
  width: 40px;
  height: 40px;
  background: url('/img/btn/btn_pop_close.png') left top no-repeat;
}
#popWrap .guCont {
  position: relative;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
}
#popWrap .guCont .innerBox {
  padding: 24px;
}
#popWrap .guCont .innerBox:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .guCont .innerBox .tit {
  font-size: 18px;
  color: #000;
  font-weight: 600;
  line-height: 1.2;
  padding: 2px 0 10px 0;
  border-bottom: 2px #000 solid;
}
#popWrap .guCont .innerBox .tit.noLine {
  border: 0;
}

#popWrap #guTBase {
  position: relative;
  max-width: 458px;
  height: auto;
  margin: 0 auto;
  z-index: 2;
} /* base */
#popWrap #guTBLow {
  position: relative;
  max-width: 470px;
  height: auto;
  margin: 0 auto;
  z-index: 2;
}
#popWrap #guTMLow {
  position: relative;
  max-width: 600px;
  height: auto;
  margin: 0 auto;
  z-index: 2;
}
#popWrap #guTMid {
  position: relative;
  max-width: 640px;
  height: auto;
  margin: 0 auto;
  z-index: 2;
} /* middle */
#popWrap #guTWidth {
  position: relative;
  max-width: 900px;
  height: auto;
  margin: 0 auto;
  z-index: 2;
} /* width */

/* setting */
#popWrap .guCont .innerBox .testDiv {
  position: relative;
  width: 100%;
  overflow: hidden;
}
#popWrap .guCont .innerBox .testDiv .tDtop {
  position: relative;
  width: 100%;
  overflow: hidden;
}
#popWrap .guCont .innerBox .testDiv .tDtop .ico {
  position: absolute;
  left: 0;
  bottom: 0;
}
#popWrap .guCont .innerBox .testDiv .tDtop .test {
  margin: 0 125px 0 90px;
}
#popWrap .guCont .innerBox .testDiv .tDtop .test:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .guCont .innerBox .testDiv .tDtop .test p {
  font-size: 14px;
  color: #000;
  font-weight: 600;
  line-height: 1.2;
  padding: 26px 0 10px 0;
}
#popWrap .guCont .innerBox .testDiv .tDtop .test .search {
  position: relative;
  width: 100%;
  margin: 0 0 20px 0;
  overflow: hidden;
}
#popWrap .guCont .innerBox .testDiv .tDtop .test .search.dep {
  margin: 38px 0;
}
#popWrap .guCont .innerBox .testDiv .tDtop .cameraArea {
  position: absolute;
  right: 0;
  bottom: 10px;
  width: 107px;
  border-radius: 3px;
  overflow: hidden;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea {
  position: absolute;
  right: 0;
  bottom: 10px;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul {
  float: right;
  height: 78px;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li {
  position: relative;
  float: left;
  width: 11px;
  height: 100%;
  margin: 0 0 0 9px;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li span {
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #999;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li:nth-child(1) {
  margin: 0;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li:nth-child(1) span {
  height: 55%;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li:nth-child(2) span {
  height: 65%;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li:nth-child(3) span {
  height: 75%;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li:nth-child(4) span {
  height: 85%;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li:nth-child(5) span {
  height: 100%;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea .base {
  position: relative;
  width: 91px;
  overflow: hidden;
  z-index: 2;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea .dummy {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 91px;
  height: 78px;
  overflow: hidden;
  z-index: 4;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea .dummy ul {
  float: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 91px;
}
#popWrap .guCont .innerBox .testDiv .tDtop .volumeArea .dummy li span {
  background: #fbc61e;
}
#popWrap .guCont .innerBox .testDiv .tDbom {
  width: 100%;
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  text-align: center;
  padding: 15px 0 36px 0;
  border-top: 1px #efefef solid;
  border-bottom: 1px #fbc61e solid;
  overflow: hidden;
}
#popWrap .guCont .innerBox .testDiv.last .tDtop .ico {
  bottom: 12px;
}
#popWrap .guCont .innerBox .testDiv.last .tDbom {
  border-bottom: 0;
  padding: 15px 0 12px 0;
}
#popWrap .guCont .innerBox select {
  width: 100%;
  height: 33px;
}

/* pop common */
#popWrap .setNoti {
  width: 100%;
  background: #fbc61e;
  text-align: center;
  overflow: hidden;
}
#popWrap .setNoti a {
  display: block;
}
#popWrap .setNoti span {
  font-size: 18px;
  color: #fff;
  line-height: 50px;
  font-weight: 600;
}
#popWrap .setNoti.red {
  background: #ff0000;
}
#popWrap span.searchStyleSelectBox {
  display: block;
  width: 100%;
  height: 35px;
  margin: 0;
  padding: 0;
  font-size: 13px;
  padding: 0 36px 0 12px;
  background: url('/img/bg/bg_select_style.png') right center #fff no-repeat;
  border: 1px #ccc solid;
  border-radius: 3px;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  overflow: hidden;
}
#popWrap .searchStyleSelectBoxInner {
  width: 100%;
  font-size: 13px;
  color: #000;
  line-height: 33px;
  padding: 0;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  overflow: hidden;
}

/* movie preview */
#popWrap .popMView {
  position: relative;
  width: 100%;
}
#popWrap .popMView .img {
  width: 100%;
  overflow: hidden;
}
#popWrap .popMView .img img {
  width: 100%;
}
#popWrap .popMView a {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: url('/img/bg/bg_moviebox_a_back.png') left top repeat;
}
#popWrap .popMView a img {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -32px 0 0 -32px;
  z-index: 2;
}

#popWrap .popMViewBig {
  position: relative;
  width: 100%;
}
#popWrap .popMViewBig .img {
  width: 100%;
  overflow: hidden;
}
#popWrap .popMViewBig .img img {
  width: 100%;
}
#popWrap .popMViewBig a {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: url('/img/bg/bg_moviebox_a_back.png') left top repeat;
}
#popWrap .popMViewBig a img {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -50px 0 0 -50px;
  z-index: 2;
}

/* class */
#popWrap .classNoti {
  width: 100%;
  font-family: 'Noto Sans KR';
  font-size: 18px;
  color: #000;
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: -0.5px;
  padding: 95px 0 70px 0;
  text-align: center;
  overflow: hidden;
}
#popWrap .classInfo {
  width: 100%;
  padding: 35px 0 32px 0;
  overflow: hidden;
}
#popWrap .classInfo ul:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .classInfo ul li {
  position: relative;
  display: block;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  padding: 5px 0 5px 82px;
}
#popWrap .classInfo ul li strong {
  position: absolute;
  left: 0;
  top: 5px;
  font-size: 16px;
  color: #fbc61e;
  line-height: 1.2;
  font-weight: 600;
}
#popWrap .classTime {
  width: 100%;
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #ff0055;
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: -0.2px;
  text-align: center;
  padding: 0 0 20px 0;
  overflow: hidden;
}

#popWrap .cReason {
  position: relative;
  padding: 0 0 0 82px;
}
#popWrap .cReason:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .cReason .tt {
  position: absolute;
  left: 0;
  top: 2px;
  font-size: 16px;
  color: #000;
  line-height: 1.2;
  font-weight: 700;
}
#popWrap .cReason .reason {
  position: relative;
  width: 100%;
}
#popWrap .cReason .reason span.searchStyleSelectBox {
  display: block;
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0;
  font-size: 15px;
  padding: 0 36px 0 12px;
  background: url('/img/bg/bg_select_style.png') right center #fff no-repeat;
  border: 1px #ccc solid;
  border-radius: 3px;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  overflow: hidden;
}
#popWrap .cReason .reason .searchStyleSelectBoxInner {
  width: 100%;
  font-size: 15px;
  color: #000;
  line-height: 38px;
  padding: 0;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  overflow: hidden;
}
#popWrap .cancelBox {
  width: 100%;
  text-align: center;
  border-top: 1px #c1c1c1 solid;
  margin: 40px 0 0 0;
  overflow: hidden;
}
#popWrap .cancelBox .firstNoti {
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #ff0055;
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: -0.2px;
  padding: 25px 0 12px;
}
#popWrap .cancelBox a {
  display: inline-block;
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #fff;
  line-height: 30px;
  letter-spacing: -0.2px;
  padding: 0 15px;
  border-radius: 50px;
  background: #c2c2c2;
}
#popWrap .cancelBox .lastNoti {
  font-family: 'Noto Sans KR';
  font-size: 18px;
  color: #000;
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: -0.2px;
  padding: 38px 0 14px;
}

#popWrap .timeNoti {
  font-family: 'Noto Sans KR';
  font-size: 14px;
  color: #000;
  line-height: 1.8;
  letter-spacing: -0.2px;
  padding: 25px 0 40px 0;
}
#popWrap .timeSet {
  width: 100%;
  padding: 0 0 25px 0;
  text-align: center;
}
#popWrap .timeSet ul:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .timeSet ul li {
  display: block;
  margin: 0 0 14px 0;
}
#popWrap .timeSet ul li:last-child {
  margin: 0;
}
#popWrap .timeSet .custom-radio label {
  display: inline-block;
  position: relative;
  z-index: 1;
  cursor: pointer;
  font-size: 16px;
  color: #000;
  padding: 0 0 0 25px;
  line-height: 15px;
  letter-spacing: 0;
  background: url('/img/ico/ico_checkbox.png') 0 -81px no-repeat;
}
#popWrap .timeSet .custom-radio label.checked {
  background-position: 0 -119px;
}

/* change pw */
#popWrap .pwTxt {
  font-size: 16px;
  color: #000;
  line-height: 1.6;
  text-align: center;
  padding: 68px 0 44px 0;
}
#popWrap .pwChForm {
  width: 100%;
  padding: 60px 0;
  overflow: hidden;
}
#popWrap .pwChForm p {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  font-weight: 700;
  padding: 0 0 10px 0;
}
#popWrap .pwChForm input {
  height: 40px;
  line-height: 40px;
}

/* schedule */
#popWrap .dayList {
  width: 100%;
  padding: 30px 0 20px;
  text-align: center;
  overflow: hidden;
}
#popWrap .dayList ul {
  font-size: 0;
  line-height: 0;
}
#popWrap .dayList ul:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .dayList ul li {
  display: inline-block;
  width: 30px;
  height: 30px;
  font-size: 14px;
  color: #000;
  line-height: 30px;
  font-weight: 800;
  text-align: center;
  background: #d3d3d3;
  border-radius: 100%;
  margin: 0 5px;
}
#popWrap .dayList ul li.on {
  background: #fbc61e;
}

#popWrap .popForm {
  width: 100%;
  padding: 0 0 20px;
}
#popWrap .popForm:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .popForm .pBox {
  position: relative;
  padding: 0 0 10px 68px;
}
#popWrap .popForm .pBox:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .popForm .pBox:last-child {
  padding: 0 0 0 68px;
}
#popWrap .popForm .pBox .tt {
  position: absolute;
  left: 12px;
  top: 0;
  font-size: 14px;
  color: #000;
  line-height: 40px;
  font-weight: 800;
}
#popWrap .popForm .pBox .data {
}
#popWrap .popForm .pBox .data:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .popForm .pBox .data input[type='text'] {
  height: 40px;
  line-height: 38px;
  font-size: 14px;
}
#popWrap .popForm .pBox .data span.searchStyleSelectBox {
  display: block;
  width: 100%;
  height: 40px;
  margin: 0;
  padding: 0;
  font-size: 14px;
  padding: 0 36px 0 12px;
  background: url('/img/bg/bg_select_style.png') right center #fff no-repeat;
  border: 1px #ccc solid;
  border-radius: 3px;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  overflow: hidden;
}
#popWrap .popForm .pBox .data .searchStyleSelectBoxInner {
  width: 100%;
  font-size: 14px;
  color: #000;
  line-height: 38px;
  padding: 0;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  overflow: hidden;
}
#popWrap .popForm .pBox .data ul.divide {
  font-size: 0;
  line-height: 0;
}
#popWrap .popForm .pBox .data ul.divide:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .popForm .pBox .data ul.divide li {
  position: relative;
  float: left;
  width: 44%;
  margin: 0 20px 0 0;
}
#popWrap .popForm .pBox .data ul.divide li:after {
  content: '';
  position: absolute;
  right: -20px;
  top: 50%;
  width: 20px;
  height: 1px;
  background: url('/img/bg/bg_pop_time_divide.png') center top no-repeat;
}
#popWrap .popForm .pBox .data ul.divide li:last-child {
  margin: 0;
}
#popWrap .popForm .pBox .data ul.divide li:last-child:after {
  display: none;
}
#popWrap .popForm .pBox .data .calendar {
  position: relative;
  width: 44%;
  padding: 0 42px 0 0;
}
#popWrap .popForm .pBox .data .calendar a {
  position: absolute;
  right: 0;
  top: 5px;
}
#popWrap .popForm .pBox .data textarea {
  width: 100%;
  height: 108px;
  font-size: 14px;
  color: #000;
  line-height: 1.6;
  padding: 16px;
  box-sizing: border-box;
}

#popWrap .popForm.holiday {
  padding: 28px 0 0 0;
}
#popWrap .popForm.holiday .pBox {
  padding: 0 0 10px 78px;
}
#popWrap .popForm.holiday .pBox:last-child {
  padding: 0 0 0 78px;
}

/* tips */
#popWrap .tipsWrap {
  width: 100%;
  overflow: hidden;
}
#popWrap .tipsWrap .tipBox {
  position: relative;
  width: 100%;
  padding: 12px 0 15px 90px;
  border-bottom: 1px #c2c2c2 solid;
  box-sizing: border-box;
  overflow: hidden;
}
#popWrap .tipsWrap .tipBox .number {
  position: absolute;
  left: 0;
  top: 12px;
  width: 70px;
  height: 70px;
  font-size: 48px;
  color: #fff;
  font-weight: 600;
  line-height: 68px;
  text-align: center;
  background: #fbc61e;
  border-radius: 25px;
}
#popWrap .tipsWrap .tipBox .tipCont:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .tipsWrap .tipBox .tipCont p {
  font-size: 14px;
  color: #000;
  line-height: 1.3;
  font-weight: 600;
  padding: 7px 0 14px 0;
  word-break: keep-all;
}
#popWrap .tipsWrap .tipBox .tipCont ul:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .tipsWrap .tipBox .tipCont ul li {
  position: relative;
  display: block;
  padding: 0 0 0 18px;
  font-size: 14px;
  color: #000;
  line-height: 1.5;
  word-break: keep-all;
}
#popWrap .tipsWrap .tipBox .tipCont ul li span {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 14px;
  color: #000;
  line-height: 1.5;
  font-weight: 800;
}
#popWrap .tipsWrap .tipBox:last-child {
  border: 0;
  padding: 12px 0 20px 90px;
}

/* view info */
#popWrap .viewInfoWrap {
  padding: 16px 0 6px 0;
}
#popWrap .viewInfoWrap:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .viewInfoWrap .information {
  position: relative;
  padding: 0 0 0 140px;
}
#popWrap .viewInfoWrap .information:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .viewInfoWrap .information .picInfo {
  position: absolute;
  left: 0;
  top: 0;
  width: 116px;
}
#popWrap .viewInfoWrap .information .picInfo .pic {
  width: 80px;
  height: 80px;
  border-radius: 100%;
  margin: 0 auto;
  overflow: hidden;
}
#popWrap .viewInfoWrap .information .picInfo .pic img {
  width: 100%;
}
#popWrap .viewInfoWrap .information .picInfo .info {
  width: 100%;
  text-align: center;
  overflow: hidden;
}
#popWrap .viewInfoWrap .information .picInfo .info span {
  display: block;
}
#popWrap .viewInfoWrap .information .picInfo .info .name {
  font-size: 18px;
  color: #000;
  line-height: 1.2;
  font-weight: 600;
  padding: 10px 0 0 0;
}
#popWrap .viewInfoWrap .information .picInfo .info .bday {
  font-size: 12px;
  color: #000;
  line-height: 1.2;
}

#popWrap .viewInfoWrap .information .dataInfo {
  width: 100%;
  border-top: 2px #4c4c4c solid;
  overflow: hidden;
}
#popWrap .viewInfoWrap .information .dataInfo table {
  vertical-align: middle;
  text-align: left;
}
#popWrap .viewInfoWrap .information .dataInfo table th {
  position: relative;
  border-bottom: 1px #c2c2c2 solid;
  padding: 12px 0;
}
#popWrap .viewInfoWrap .information .dataInfo table th span {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  padding: 0 0 0 14px;
}
#popWrap .viewInfoWrap .information .dataInfo table th span.kr {
  font-family: 'Noto Sans KR';
  letter-spacing: -1px;
  font-weight: 500;
}
#popWrap .viewInfoWrap .information .dataInfo table th:after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 19px;
  background: #c2c2c2;
}
#popWrap .viewInfoWrap .information .dataInfo table td {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  padding: 12px 0 12px 14px;
}
#popWrap .viewInfoWrap .information .dataInfo .th1 {
  width: 110px;
}

#popWrap .viewInfoWrap .dataTable {
  width: 100%;
  margin: 40px 0 6px 0;
  border-top: 2px #4c4c4c solid;
  overflow: hidden;
}
#popWrap .viewInfoWrap .dataTable table {
  text-align: left;
}
#popWrap .viewInfoWrap .dataTable table th {
  position: relative;
  border-bottom: 1px #c2c2c2 solid;
  padding: 12px 0;
  vertical-align: top;
}
#popWrap .viewInfoWrap .dataTable table th span {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  padding: 0 0 0 14px;
}
#popWrap .viewInfoWrap .dataTable table td {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  padding: 12px 0 12px 14px;
}
#popWrap .viewInfoWrap .dataTable table td textarea {
  width: 100%;
  height: 78px;
  font-size: 13px;
  color: #000;
  line-height: 1.3;
  padding: 12px;
  box-sizing: border-box;
}
#popWrap .viewInfoWrap .dataTable .vh1 {
  width: 140px;
}
#popWrap .viewInfoWrap .dataTable .divide {
  width: 100%;
  overflow: hidden;
}
#popWrap .viewInfoWrap .dataTable .divide ul:after {
  content: '';
  display: block;
  clear: both;
}
#popWrap .viewInfoWrap .dataTable .divide ul li {
  display: block;
  padding: 0 0 12px 0;
  margin: 0 0 12px 0;
  border-bottom: 1px #c2c2c2 solid;
}
#popWrap .viewInfoWrap .dataTable .divide ul li:last-child {
  border: 0;
  padding: 0;
  margin: 0;
}

#popWrap .starrr {
  display: inline-block;
  font-size: 0;
  line-height: 0;
}
#popWrap .starrr a {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin: 0 2px;
  background: url('/img/star-empty.png') left top no-repeat;
  background-size: 14px 14px;
}
#popWrap .starrr a.fa-star-o {
  background: url('/img/star-empty.png') left top no-repeat;
  background-size: 14px 14px;
}
#popWrap .starrr a.fa-star {
  background: url('/img/star.png') left top no-repeat;
  background-size: 14px 14px;
}
#popWrap .starrr span {
  display: inline-block;
  margin: 0 2px;
}

#popWrap .viewInfoWrap .summary {
  width: 100%;
  overflow: hidden;
}
#popWrap .viewInfoWrap .summary .sTit {
  font-size: 18px;
  color: #000;
  line-height: 1.2;
  font-weight: 700;
  padding: 37px 0 15px;
}
#popWrap .viewInfoWrap .summary table {
}
#popWrap .viewInfoWrap .summary table th {
  position: relative;
  border-bottom: 1px #c2c2c2 solid;
  border-right: 1px #c2c2c2 solid;
  padding: 12px 0;
  vertical-align: top;
  text-align: center;
}
#popWrap .viewInfoWrap .summary table th span {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
}
#popWrap .viewInfoWrap .summary table th:last-child {
  border-right: 0;
}
#popWrap .viewInfoWrap .summary table td {
  font-size: 12px;
  color: #000;
  line-height: 1.2;
  border-bottom: 1px #c2c2c2 solid;
  border-right: 1px #c2c2c2 solid;
  padding: 7px 0 7px 10px;
}
#popWrap .viewInfoWrap .summary table td:last-child {
  border-right: 0;
}
#popWrap .viewInfoWrap .summary .sth1 {
  width: 116px;
}
#popWrap .viewInfoWrap .summary .sth2 {
  width: 200px;
}
#popWrap .viewInfoWrap .summary .sth3 {
  width: 82px;
}
#popWrap .viewInfoWrap .summary .sth4 {
  width: 110px;
}
#popWrap .viewInfoWrap .summary .sth5 {
  width: 110px;
}
#popWrap .viewInfoWrap .summary .tableGuard {
  border-top: 2px #4c4c4c solid;
  height: 402px;
  overflow-y: auto;
}

#popWrap .viewInfoWrap .moreBtn {
  width: 100%;
  margin: 10px 0 16px 0;
  overflow: hidden;
}
#popWrap .viewInfoWrap .moreBtn a {
  display: block;
  width: 200px;
  height: 40px;
  background: #ddd;
  border-radius: 3px;
  text-align: center;
  margin: 0 auto;
}
#popWrap .viewInfoWrap .moreBtn a span {
  font-size: 14px;
  color: #999;
  line-height: 40px;
  font-weight: 600;
}

/************************* media query *****************************/

/***************** media web **************/
@media all and (max-width: 1680px) {
  #subBanner:after {
    right: -118px;
  }
}

/***************** media web **************/
@media all and (max-width: 1280px) {
  /* sub banner */
  #subBanner .img {
    left: auto;
    right: 0;
    margin: 0 -40px 0 0;
  }

  /* account */
  .accountDash ul li {
    width: 33.33%;
    background-position: center top;
  }

  /* payment data */
  .paymentData > ul > li {
    width: 25%;
  }

  .paymentData > ul > li:nth-child(even) {
    background: #fbc61e;
  }
  .paymentData > ul > li:nth-child(even) .tit {
    color: #000;
    border-color: #fff;
  }
  .paymentData > ul > li:nth-child(even) .tit span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(even) .info ul li {
    color: #000;
    background: url('/img/bg/bg_payment_data_info_li.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(even) .info ul li span {
    color: #000;
  }

  .paymentData > ul > li.ty .stit {
    color: #000;
  }
  .paymentData > ul > li.ty .stit span {
    color: #000;
  }

  .paymentData > ul > li:nth-child(2) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(2) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(2) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(2) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(2) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(2) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(2) .stit span {
    color: #fbc61e;
  }

  .paymentData > ul > li:nth-child(4) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(4) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(4) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(4) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(4) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(4) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(4) .stit span {
    color: #fbc61e;
  }

  .paymentData > ul > li:nth-child(5) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(5) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(5) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(5) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(5) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(5) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(5) .stit span {
    color: #fbc61e;
  }

  .paymentData > ul > li:nth-child(7) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(7) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(7) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(7) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(7) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(7) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(7) .stit span {
    color: #fbc61e;
  }

  .paymentData > ul > li:nth-child(10) {
    background: #000;
  }
}

/***************** media web **************/
@media all and (max-width: 1240px) {
  /* about */
  .aboutWrap .aboutUs .ourVtxt {
    width: 100%;
    padding: 0;
  }
  .aboutWrap .aboutUs .ourVtxt .simg {
    position: relative;
    right: auto;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
    margin: 40px 0 0 0;
  }
  .aboutWrap .aboutUs .ourVtxt .simg img {
    max-width: 100%;
  }
}

/***************** media web **************/
@media all and (max-width: 1200px) {
  /* apply */
  .applyInform {
    margin: 0 0 0 20%;
  }
  .qualifications .qInner .qImg {
    width: 50%;
  }
  .qualifications .qInner .qImg img {
    width: 100%;
  }

  .welcomeWrap {
    padding: 0 0 40px 20%;
  }
  .welcomeWrap .wStep {
    left: 15px;
  }
  .welcomeWrap .wTit {
    margin: 0 20px 0 0;
  }
  .welcomeWrap .wTit span {
    display: inline;
  }

  /* account */
  .accountSchedule {
    padding: 0 320px 0 0;
  }

  /* about */
  .aboutWrap .aboutUs .aImg {
    width: 50%;
  }
  .aboutWrap .aboutUs .aImg img {
    width: 100%;
  }
  .aboutWrap .aboutUs .abNoti {
    margin: 0;
  }

  .aboutWrap .aboutUs .classI {
    top: 35px;
  }
  .aboutWrap .aboutUs .classT {
    padding: 0 0 240px 0;
  }
  .aboutWrap .aboutUs .abClass {
    margin: 0 0 90px;
  }
}

/***************** media web **************/
@media all and (max-width: 1100px) {
  /* apply */
  .applySubTit {
    position: relative;
    margin: 0 0 20px 0;
  }
  .applyInform {
    margin: 0;
  }
  .mockInfo {
    margin: 0;
  }

  .applyContract .congratulations {
    padding: 76px 0 0 0;
  }

  /* account */
  .accountInfo .tth1 {
    width: 100px;
  }
  .accountInfo .tth2 {
    width: 90px;
  }
  .accountInfo .tth3 {
    width: 180px;
  }

  .accountBtable .hsth1 {
    width: 80px;
  } /* Holiday Setting */
  .accountBtable .hsth2 {
    width: 160px;
  }
  .accountBtable .hsth3 {
    width: 160px;
  }
  .accountBtable .hsth4 {
    width: 123px;
  }

  .accountBtable .wlth1 {
    width: 110px;
  } /* Waiting List */
  .accountBtable .wlth2 {
    width: 180px;
  }
  .accountBtable .wlth3 {
    width: 100px;
  }
  .accountBtable .wlth4 {
    width: 100px;
  }

  .accountBtable .mcth1 {
    width: 110px;
  } /* My Class */
  .accountBtable .mcth2 {
    width: 120px;
  }
  .accountBtable .mcth3 {
    width: 180px;
  }
  .accountBtable .mcth4 {
    width: 200px;
  }

  .accountAtable .setth1 {
    width: 190px;
  }

  .accountSearch .studentS {
    display: block;
    float: none;
    margin: 0 0 10px 0;
  }
  .accountSearch .days {
    display: block;
    float: none;
  }

  .accountSchedule {
    padding: 0;
  }
  .accountSchedule .accountSet {
    position: relative;
    right: auto;
    left: 0;
    top: 0;
    bottom: auto;
    margin: -20px 0 0 0;
  }
  .accountSchedule .accountSet ul li {
    margin: 0 10px 0 0;
  }

  /* schedule list */
  .scheduleList ul {
    margin: 0;
  }
  .scheduleList ul li {
    float: none;
    width: 100%;
    margin: 0 0 40px 0;
  }
  .scheduleList ul li:last-child {
    margin: 0;
  }

  /* resources list */
  .resourcesList ul li {
    width: 32.33%;
  }

  /* qa */
  .inquiryType table td .answer {
    margin: 0 30px 0 85px;
  }
}

/***************** media web **************/
@media all and (max-width: 1000px) {
  /* payment data */
  .paymentData > ul > li {
    width: 33.33%;
  }

  .paymentData > ul > li:nth-child(5) {
    background: #fbc61e;
  }
  .paymentData > ul > li:nth-child(5) .tit {
    color: #000;
    border-color: #fff;
  }
  .paymentData > ul > li:nth-child(5) .tit span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(5) .info ul li {
    color: #000;
    background: url('/img/bg/bg_payment_data_info_li.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(5) .info ul li span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(5) .stit {
    color: #000;
  }
  .paymentData > ul > li:nth-child(5) .stit span {
    color: #000;
  }

  .paymentData > ul > li:nth-child(6) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(6) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(6) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(6) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(6) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(6) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(6) .stit span {
    color: #fbc61e;
  }

  .paymentData > ul > li:nth-child(7) {
    background: #fbc61e;
  }
  .paymentData > ul > li:nth-child(7) .tit {
    color: #000;
    border-color: #fff;
  }
  .paymentData > ul > li:nth-child(7) .tit span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(7) .info ul li {
    color: #000;
    background: url('/img/bg/bg_payment_data_info_li.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(7) .info ul li span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(7) .stit {
    color: #000;
  }
  .paymentData > ul > li:nth-child(7) .stit span {
    color: #000;
  }

  .paymentData > ul > li:nth-child(8) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(8) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(8) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(8) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(8) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(8) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(8) .stit span {
    color: #fbc61e;
  }

  /* payment table */
  .payTable {
    padding: 30px;
  }

  /* pay content */
  .payCHead .pimg .people {
    right: 0;
  }
  .payCHead .pimg p {
    font-size: 32px;
    padding: 64px 0 0 30px;
  }
  .payCHead .list {
    margin: 98px 0 0;
  }
  .payCHead .list ul li {
    float: left;
    width: 29.333%;
    margin: 0 2%;
    text-align: center;
    word-break: keep-all;
  }

  /* about */
  .aboutWrap .aboutUs .ourVimg img.w {
    display: none;
  }
  .aboutWrap .aboutUs .ourVimg img.m {
    display: inline-block;
  }
  .aboutWrap .aboutUs .ourVList ul li {
    width: 30.33%;
    margin: 0 3% 3% 0;
  }

  /* paging */
  .pagingArea .boardBtn {
    top: 25px;
    text-align: right;
  }
  .pagingArea .boardBtn span {
    display: block;
    padding: 0 0 5px 0;
  }

  /* apply */
  .howToApp .htaList ul li .inbox {
    padding: 0 0 0 266px;
  }
}

/***************** media web **************/
@media all and (max-width: 960px) {
  /* login */
  .lboxWrap {
    width: auto;
    margin: 0 20px;
  }
  .lboxWrap .lbox .linform {
    padding: 0 20px;
    margin: 24px 8% 0;
  }
  .lboxWrap .lbox .goBtn {
    padding: 0 20px;
    margin: 0 8%;
  }
  .lboxWrap .lbox.noti .notiBox .btn {
    padding: 0 20px;
    margin: 24px 8% 0;
  }

  /* apply */
  .applyContract {
    width: auto;
    margin: 0;
  }
  .applyContract .congratulations .sTxt p span {
    display: inline;
  }

  .qualifications .qInfo ul li {
    width: 33.33%;
    margin: 0 0 40px 0;
  }
  .qualifications .qInner .qImg {
    position: relative;
    right: auto;
    left: 0;
    top: 0;
    width: 100%;
    margin: 40px 0 0 0;
  }
  .qualifications .qInner .qImg img {
    width: auto;
    max-width: 100%;
  }
  .qualifications .qInner .qTit {
    width: 100%;
  }
  .qualifications .qInner .qTxt {
    width: 100%;
  }

  .welcomeWrap {
    padding: 0 0 40px 0;
  }
  .welcomeWrap .wStep {
    position: relative;
    left: 0;
    top: 0;
    margin: 0 0 30px 0;
  }
  .nextStep .nTxt {
    padding: 0 20px;
    box-sizing: border-box;
  }
  .nextStep .nTxt span {
    display: inline;
  }

  /* popWrap */
  #popWrap #guTWidth {
    max-width: 600px;
  }

  /* account */
  .accountHead .dayTit {
    text-align: left;
  }

  .accountBtable table td {
    padding: 12px 10px 12px 12px;
  }
  .accountBtable table td img {
    margin: 0 2px;
  }

  .accountBtable .hsth1 {
    width: 60px;
  } /* Holiday Setting */
  .accountBtable .hsth2 {
    width: 130px;
  }
  .accountBtable .hsth3 {
    width: 130px;
  }
  .accountBtable .hsth4 {
    width: 123px;
  }

  .accountBtable .wlth1 {
    width: 100px;
  } /* Waiting List */
  .accountBtable .wlth2 {
    width: 160px;
  }
  .accountBtable .wlth3 {
    width: 90px;
  }
  .accountBtable .wlth4 {
    width: 90px;
  }

  .accountBtable .mcth1 {
    width: 100px;
  } /* My Class */
  .accountBtable .mcth2 {
    width: 100px;
  }
  .accountBtable .mcth3 {
    width: 140px;
  }
  .accountBtable .mcth4 {
    width: 190px;
  }

  .accountBtable .rtth1 {
    width: 90px;
  } /* Resources */
  .accountBtable .rtth2 {
    width: 200px;
  }
  .accountBtable .rtth3 {
    width: 130px;
  }

  /* paging */
  .pagingArea.other .paging {
    margin: 0 0 70px 0;
  }
  .pagingArea.other .selectDelBtn {
    top: 120px;
  }
  .pagingArea.other .hsAddBtn {
    top: 120px;
  }
  .pagingArea.other .yrBtn {
    top: 120px;
  }

  /* about */
  .aboutWrap .aboutUs .classI {
    position: relative;
    right: auto;
    left: 0;
    width: 100%;
    margin: 0 auto 80px;
    text-align: center;
  }
  .aboutWrap .aboutUs .classI img {
    max-width: 100%;
  }
  .aboutWrap .aboutUs .classT {
    padding: 0 0 20px 0;
  }
  .aboutWrap .aboutUs .classC .classCImg {
    width: 50%;
    top: 0;
  }
  .aboutWrap .aboutUs .classC .classCImg img {
    width: 100%;
  }

  /* qa */
  .faqType table td {
    padding: 12px 10px 12px 12px;
  }
  .inquiryType table td {
    padding: 12px 10px 12px 12px;
  }
}

/***************** media web **************/
@media all and (max-width: 840px) {
  /* apply */
  .applyInform .dBox {
    padding: 10px 20px 10px 236px;
    background-size: 216px 5px;
  }
  .applyInform .dBox .tit {
    left: 12px;
    font-size: 15px;
  }

  .applyInform .rBox {
    padding: 20px 20px 20px 236px;
  }
  .applyInform .rBox .tit {
    width: 216px;
  }

  .applyContract .fileUpload .dBox {
    padding: 10px 20px 10px 236px;
  }
  .applyContract .fileUpload .dBox .tit {
    left: 12px;
    font-size: 15px;
  }

  .mockInfo .mHowInfo ul li .info {
    margin: 0 0 0 145px;
  }
  .mockInfo .mHowInfo ul li .info .tx {
    min-height: auto;
  }
  .mockInfo .mHowInfo ul li .info .btn {
    position: relative;
    left: 0;
    right: auto;
    top: 0;
    margin: 20px 0 0 0;
  }
  .mockInfo .mcriteria .mcIco {
    right: 30px;
  }
  .mockInfo .mcriteria .mcIco img {
    width: 120px;
  }

  .welcomeWrap .wInform .wBox {
    padding: 10px 20px 10px 180px;
  }
  .welcomeWrap .wInform .wBox .tit {
    left: 12px;
    font-size: 15px;
  }

  .welcomeWrap .movieBox {
    width: 39.08%;
  }
  .welcomeWrap .fileMovie {
    left: 41.23%;
    width: 58.77%;
  }
  .welcomeWrap .wInform .wBox .imgFile .dragImg {
    width: 160px;
    height: 160px;
  }
  .welcomeWrap .wInform .wBox .imgFile .dragInfo {
    left: 175px;
  }

  /* account */
  .accountInfo table td .entrance a {
    width: 90%;
  }
  .accountDash ul li {
    width: 50%;
  }

  .accountHead .period {
    padding: 0 0 20px 0;
  }
  .accountHead .rInfoTy.schedule {
    top: 60px;
  }
  .accountHead .scheduleNoti ul li .cbox {
    font-size: 13px;
  }

  /* payment data */
  .paymentData > ul > li {
    width: 50%;
  }

  .paymentData > ul > li:nth-child(3) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(3) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(3) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(3) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(3) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(3) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(3) .stit span {
    color: #fbc61e;
  }

  .paymentData > ul > li:nth-child(4) {
    background: #fbc61e;
  }
  .paymentData > ul > li:nth-child(4) .tit {
    color: #000;
    border-color: #fff;
  }
  .paymentData > ul > li:nth-child(4) .tit span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(4) .info ul li {
    color: #000;
    background: url('/img/bg/bg_payment_data_info_li.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(4) .info ul li span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(4) .stit {
    color: #000;
  }
  .paymentData > ul > li:nth-child(4) .stit span {
    color: #000;
  }

  .paymentData > ul > li:nth-child(5) {
    background: #fbc61e;
  }
  .paymentData > ul > li:nth-child(5) .tit {
    color: #000;
    border-color: #fff;
  }
  .paymentData > ul > li:nth-child(5) .tit span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(5) .info ul li {
    color: #000;
    background: url('/img/bg/bg_payment_data_info_li.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(5) .info ul li span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(5) .stit {
    color: #000;
  }
  .paymentData > ul > li:nth-child(5) .stit span {
    color: #000;
  }

  .paymentData > ul > li:nth-child(6) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(6) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(6) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(6) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(6) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(6) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(6) .stit span {
    color: #fbc61e;
  }

  .paymentData > ul > li:nth-child(7) {
    background: #000;
  }
  .paymentData > ul > li:nth-child(7) .tit {
    color: #fbc61e;
    border-color: #999;
  }
  .paymentData > ul > li:nth-child(7) .tit span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(7) .info ul li {
    color: #fbc61e;
    background: url('/img/bg/bg_payment_data_info_li2.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(7) .info ul li span {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(7) .stit {
    color: #fbc61e;
  }
  .paymentData > ul > li:nth-child(7) .stit span {
    color: #fbc61e;
  }

  .paymentData > ul > li:nth-child(8) {
    background: #fbc61e;
  }
  .paymentData > ul > li:nth-child(8) .tit {
    color: #000;
    border-color: #fff;
  }
  .paymentData > ul > li:nth-child(8) .tit span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(8) .info ul li {
    color: #000;
    background: url('/img/bg/bg_payment_data_info_li.png') left 7px no-repeat;
  }
  .paymentData > ul > li:nth-child(8) .info ul li span {
    color: #000;
  }
  .paymentData > ul > li:nth-child(8) .stit {
    color: #000;
  }
  .paymentData > ul > li:nth-child(8) .stit span {
    color: #000;
  }

  /* about */
  .aboutWrap .aboutUs .aBox {
    margin: 0;
  }
  .aboutWrap .aboutUs .aImg {
    position: relative;
    right: auto;
    left: 0;
    top: 0;
    width: 70%;
    margin: 0 auto 90px;
    text-align: center;
  }
}

/***************** media web **************/
@media all and (max-width: 760px) {
  /* pay content */
  .payCHead .ptxt {
    padding: 52px 0 34px 20px;
  }
  .payCHead .pimg p {
    width: 60%;
    font-size: 28px;
    padding: 40px 0 0 30px;
  }
  .payCHead .list ul li {
    width: 46%;
    margin: 0 2% 40px;
  }
}

/***************** media web **************/
@media all and (max-width: 740px) {
  /* login */
  .lboxWrap .lbox {
    float: none;
    width: 100%;
  }

  /* apply */
  .applyInform .dBox ul.half li {
    float: none;
    display: block;
  }
  .applyInform .dBox ul.half li:nth-child(1) {
    width: 100%;
    padding: 0;
  }
  .applyInform .dBox ul.half li:nth-child(2) {
    width: 100%;
    padding: 5px 0 0 0;
  }

  .welcomeWrap .wInform .wBox ul.half li {
    float: none;
    display: block;
  }
  .welcomeWrap .wInform .wBox ul.half li:nth-child(1) {
    width: 100%;
    padding: 0;
  }
  .welcomeWrap .wInform .wBox ul.half li:nth-child(2) {
    width: 100%;
    padding: 5px 0 0 0;
  }

  .howToApp .htImg img.w {
    display: none;
  }
  .howToApp .htImg img.m {
    display: inline-block;
  }
  .howToApp .htaList ul li .inbox {
    padding: 0;
  }
  .howToApp .htaList ul li .inbox .tit {
    position: relative;
    top: 0;
    width: 100%;
    padding: 10px 0 0 0;
  }
  .howToApp .htaList ul li .inbox .txt {
    padding: 15px 0 0 0;
  }
  .howToApp .hbTxt {
    font-size: 25px;
  }

  /* resources list */
  .resourcesList ul li {
    width: 49%;
  }

  /* paging */
  .pagingArea .boardBtn {
    position: relative;
    right: auto;
    left: 0;
    top: 0;
    text-align: right;
    padding: 12px 0 0 0;
  }
  .pagingArea .boardBtn span {
    display: inline;
    padding: 0 22px 0 0;
  }
}

/***************** media mobile **************/
@media all and (max-width: 680px) {
  /* popup */
  #popWrap #guTMid {
    max-width: 340px;
  }

  /* table guard */
  .tableGuard {
    overflow-x: auto;
  }
  .tableGuard table {
    width: 640px;
  }
}

/***************** media mobile **************/
@media all and (max-width: 640px) {
  /* content */
  #content {
    padding: 30px 0 50px 0;
  }

  /* sub banner */
  #subBanner {
    height: 180px;
  }
  #subBanner .img {
    margin: 0 0 0 0;
  }
  #subBanner .img img {
    width: 478px;
  }
  #subBanner p {
    left: 12px;
    top: 72px;
    font-size: 20px;
  }
  #subBanner p span {
    display: block;
    font-size: 20px;
  }
  #subBanner:before {
    height: 166px;
  }
  #subBanner:after {
    right: -36px;
    width: 571px;
    height: 172px;
    background-size: 571px 172px;
  }

  /* login */
  .lboxWrap .lbox {
    height: 394px;
  }
  .lboxWrap .lbox .lTit {
    font-size: 24px;
    padding: 38px 0 0 0;
  }
  .lboxWrap .lbox .lTxt {
    font-size: 12px;
    padding: 10px 0;
  }
  .lboxWrap .lbox .lSns.join {
    padding: 14px 0 7px 0;
  }
  .lboxWrap .lbox .linform {
    padding: 0 16px;
    margin: 14px 6% 0;
  }
  .lboxWrap .lbox .linform ul li input {
    height: 36px;
    line-height: 36px;
    padding: 0 0 0 12px;
  }
  .lboxWrap .lbox .linform p {
    font-size: 13px;
    line-height: 50px;
  }
  .lboxWrap .lbox .goBtn {
    padding: 0 16px;
    margin: 0 6%;
  }
  .lboxWrap .lbox .goBtn a {
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .lboxWrap .lbox.noti {
    height: 228px;
  }
  .lboxWrap .lbox.noti .notiBox {
    margin: -65px 0 0 0;
  }
  .lboxWrap .lbox.noti .notiBox .notiTit {
    font-size: 24px;
    padding: 0 0 10px 0;
  }
  .lboxWrap .lbox.noti .notiBox .notiTxt {
    height: 42px;
    font-size: 14px;
  }
  .lboxWrap .lbox.noti .notiBox .notiTxt.join {
    height: 42px;
  }
  .lboxWrap .lbox.noti .notiBox .notiTxt span {
    font-size: 14px;
    line-height: 1.3;
  }
  .lboxWrap .lbox.noti .notiBox .btn {
    padding: 0 16px;
    margin: 14px 6% 0;
  }
  .lboxWrap .lbox.noti .notiBox .btn a {
    font-size: 13px;
    height: 36px;
    line-height: 36px;
  }
  .lboxWrap .lbox .agreeChk .custom-checkbox label {
    padding: 0 0 0 25px;
  }

  .signup .sTit {
    font-size: 24px;
    padding: 0 0 10px 0;
  }
  .signup .sTxt {
    padding: 0 20px 10px;
  }
  .signup .sTxt p {
    font-size: 13px;
    padding: 0 0 16px 0;
  }
  .signup .sTxt p span {
    display: inline;
    font-size: 13px;
  }
  .signup a {
    width: 240px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }

  /* apply */
  .subMTit {
    font-size: 24px;
  }
  .applyStep {
    margin: 16px 0 0 0;
  }
  .applyStep ul li {
    height: 40px;
  }
  .applyStep ul li span {
    font-size: 11px;
    padding: 5px 0 0 0;
    font-weight: 600;
  }
  .applyStep ul li p {
    font-size: 14px;
  }
  .applyStep ul li p.l {
    line-height: 40px;
  }
  .applyStep ul li.fin:after {
    font-size: 14px;
    letter-spacing: 0.5px;
    line-height: 40px;
  }

  .applyBox {
    margin: 30px 0 0 0;
  }
  .applySubTit {
    font-size: 18px;
    letter-spacing: 2px;
    margin: 0 0 12px 0;
  }
  .applyInform .dBox {
    padding: 15px 6px 12px 6px;
    background: url('');
  }
  .applyInform .dBox .tit {
    position: relative;
    left: 0;
    top: 0;
    font-size: 13px;
    margin: 0 0 10px 0;
  }
  .applyInform .dBox .noti {
    font-size: 13px;
    line-height: 1.2;
    padding: 5px 0 0 0;
  }
  .applyInform .dBox textarea {
    height: 140px;
    font-size: 12px;
    line-height: 1.3;
    padding: 10px;
  }
  .applyInform .rBox {
    padding: 15px;
  }
  .applyInform .rBox .tit {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
  }
  .applyInform .rBox .tit span {
    display: block;
    position: relative;
    left: 0;
    top: 0;
    margin: 0 0 0 12px;
    font-size: 16px;
    padding: 10px 0;
  }
  .applyInform .rBox textarea {
    height: 120px;
    font-size: 12px;
    line-height: 1.3;
    padding: 10px;
  }

  .applyContract .congratulations {
    padding: 38px 0 0 0;
  }
  .applyContract .congratulations .sTit {
    font-size: 24px;
    padding: 0 0 12px 0;
  }
  .applyContract .congratulations .sTxt {
    padding: 0 0 20px 0;
  }
  .applyContract .congratulations .sTxt p {
    font-size: 14px;
  }
  .applyContract .congratulations .sTxt p span {
    font-size: 14px;
  }
  .applyContract .congratulations .agreeBox {
    height: 200px;
    font-size: 12px;
    padding: 12px;
  }
  .applyContract .congratulations .agreeChk {
    margin: 12px 20px 0 20px;
  }
  .applyContract .fileTit {
    font-size: 16px;
    padding: 30px 0 10px;
  }
  .applyContract .fileUpload .dBox {
    padding: 15px 6px 12px 6px;
  }
  .applyContract .fileUpload .dBox .tit {
    position: relative;
    left: 0;
    top: 0;
    font-size: 13px;
    margin: 0 0 10px 0;
  }

  .mockInfo .mtit {
    font-size: 16px;
    padding: 0 0 12px 0;
  }
  .mockInfo .mtxt {
    font-size: 13px;
    line-height: 1.3;
    padding: 0 0 45px 0;
  }
  .mockInfo .mHow {
    padding: 30px 0 50px;
    text-align: center;
  }
  .mockInfo .mHow img.w {
    display: none;
  }
  .mockInfo .mHow img.m {
    display: inline-block;
    width: 260px;
  }

  .mockInfo .mHowInfo {
    margin: 0;
  }
  .mockInfo .mHowInfo ul li {
    padding: 0 0 50px 0;
  }
  .mockInfo .mHowInfo ul li .ico {
    position: absolute;
    left: 0;
    top: -18px;
  }
  .mockInfo .mHowInfo ul li .ico img {
    width: 82px;
  }
  .mockInfo .mHowInfo ul li .info {
    margin: 0 0 0 94px;
  }
  .mockInfo .mHowInfo ul li .info .tt {
    font-size: 14px;
    padding: 0 0 10px 0;
  }
  .mockInfo .mHowInfo ul li .info .tx span {
    font-size: 12px;
    padding: 0 0 45px 0;
  }
  .mockInfo .mHowInfo ul li .info .tx p {
    padding: 10px 0 0 0;
  }
  .mockInfo .mHowInfo ul li .info .tx strong {
    font-size: 13px;
  }
  .mockInfo .mHowInfo ul li .info .btn {
    margin: 12px 0 0 0;
  }
  .mockInfo .mHowInfo ul li .info .btn a {
    width: 200px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .mockInfo .mHowInfo ul li .info.full {
    margin: 0 0 0 94px;
  }

  .mockInfo .mcriteria {
    margin: 50px 0 0 0;
    padding: 0 12px;
  }
  .mockInfo .mcriteria .mcIco {
    right: 20px;
    top: 20px;
  }
  .mockInfo .mcriteria .mcIco img {
    width: 100px;
  }
  .mockInfo .mcriteria .mctt {
    font-size: 16px;
    padding: 20px 0 10px 0;
  }
  .mockInfo .mcriteria .mctx {
    padding: 0 0 8px 0;
  }
  .mockInfo .mcriteria .mctx ul li {
    font-size: 13px;
  }
  .mockInfo .mcriteria .mcbn {
    padding: 0 0 24px 0;
  }
  .mockInfo .mcriteria .mcbn a {
    width: 200px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }

  .thanxTo .sTit {
    font-size: 24px;
    padding: 0 0 10px 0;
  }
  .thanxTo .sTxt {
    padding: 0 20px 10px;
  }
  .thanxTo .sTxt p {
    font-size: 13px;
    padding: 0 0 16px 0;
  }
  .thanxTo .sTxt p span {
    display: inline;
    font-size: 13px;
  }
  .thanxTo a {
    width: 240px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }

  .fileBox {
    padding: 0 100px 0 0;
  }
  .fileBox .btn {
    width: 100px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .fileList .file span {
    font-size: 13px;
    padding: 0 6px 0 20px;
    background-size: 14px auto;
    background-position: left 2px;
  }
  .fileList .file .previewBtn {
    width: 100px;
  }
  .fileList .fileNoti p {
    font-size: 13px;
  }
  .fileList .fileNoti a {
    display: block;
    margin: 4px 0 0 0;
  }

  .qualifications .qInner {
    min-height: auto;
  }
  .qualifications .qInner .qTit {
    font-size: 15px;
    padding: 25px 0 15px 0;
  }
  .qualifications .qInner .qTxt {
    font-size: 14px;
  }
  .qualifications .qInner .qImg {
    margin: 20px 0 0 0;
  }
  .qualifications .qInfo {
    margin: 50px 0 0 0;
  }
  .qualifications .qInfo ul li {
    width: 50%;
    margin: 0 0 20px 0;
  }
  .qualifications .qInfo ul li .ico img {
    width: 90px;
  }
  .qualifications .qInfo ul li p {
    font-size: 13px;
    padding: 20px 6px 0;
    text-align: center;
  }

  .welcomeWrap {
    margin: 25px 0 0 0;
    padding: 0 0 20px 0;
  }
  .welcomeWrap .wStep {
    width: 80px;
    height: 80px;
    margin: 0 0 12px 0;
  }
  .welcomeWrap .wStep span {
    font-size: 20px;
    line-height: 80px;
  }
  .welcomeWrap .wTit {
    font-size: 14px;
    line-height: 1.5;
    padding: 0 0 15px 0;
  }
  .welcomeWrap .wTit span {
    font-size: 14px;
    line-height: 1.5;
  }
  .welcomeWrap .wTit p {
    font-size: 14px;
    line-height: 1.5;
    padding: 0 0 16px 0;
  }
  .welcomeWrap .wInform .wBox {
    padding: 15px 6px 12px 6px;
  }
  .welcomeWrap .wInform .wBox .tit {
    position: relative;
    left: 0;
    top: 0;
    font-size: 13px;
    margin: 0 0 10px 0;
  }
  .welcomeWrap .wInform .wBox .noti {
    font-size: 13px;
    line-height: 1.2;
    padding: 5px 0 0 0;
  }
  .welcomeWrap .wInform .wBox textarea {
    height: 100px;
    font-size: 13px;
    padding: 12px;
  }
  .welcomeWrap .wInform .wBox .imgFile .dragImg {
    width: 120px;
    height: 120px;
    background-size: 90px auto;
  }
  .welcomeWrap .wInform .wBox .imgFile .dragInfo {
    left: 130px;
    top: 50%;
    margin: -50px 0 0 0;
  }
  .welcomeWrap .wInform .wBox .imgFile .dragInfo ul li {
    font-size: 11px;
  }
  .welcomeWrap .movieBox {
    width: 46%;
    margin: 0 4% 4% 0;
  }
  .welcomeWrap .movieBox a img {
    margin: -20px 0 0 -20px;
    width: 40px;
    height: 40px;
  }
  .welcomeWrap .fileMovie {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    padding: 20px 0 0 0;
    clear: both;
  }

  .nextStep {
    margin: 12px 0 0 0;
    padding: 45px 0 0 0;
  }
  .nextStep .nTxt span {
    font-size: 14px;
    line-height: 1.4;
  }

  .howToApp .htTxt {
    font-size: 16px;
    margin: 25px 0 0 0;
  }
  .howToApp .htImg {
    margin: 40px 0;
  }
  .howToApp .htImg img {
    width: 320px;
  }
  .howToApp .htaList ul li {
    margin: 0 0 24px 0;
    padding: 0;
  }
  .howToApp .htaList ul li .ico {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
  }
  .howToApp .htaList ul li .ico img {
    width: 90px;
  }
  .howToApp .htaList ul li .inbox .tit span {
    display: inline;
    font-size: 14px;
  }
  .howToApp .htaList ul li .inbox .txt {
    min-height: auto;
    font-size: 14px;
    padding: 12px 0 0 0;
  }
  .howToApp .hbTxt {
    font-size: 18px;
    margin: 30px 0 0 0;
  }

  /*** account ***/
  .accountHead {
    margin: 0 0 15px 0;
  }
  .accountHead.space {
    margin: 100px 0 15px 0;
  }
  .accountHead .tit {
    font-size: 24px;
  }
  .accountHead .dayTit {
    font-size: 24px;
  }
  .accountHead .rInfoTy {
    position: relative;
    right: auto;
    left: 0;
    top: 0;
    float: none;
    padding: 0 70px 0 0;
    margin: 15px 0 0 0;
  }
  .accountHead .rInfoTy .icoZone {
    top: 4px;
  }
  .accountHead .rInfoTy .icoZone ul li {
    margin: 0 5px 0 0;
  }
  .accountHead .rInfoTy .icoZone ul li span {
    right: -5px;
    top: -5px;
    width: 16px;
    height: 16px;
    font-size: 11px;
    line-height: 16px;
  }
  .accountHead .rInfoTy .icoZone ul li img {
    width: 24px;
  }
  .accountHead .rInfoTy .infoZone {
    text-align: left;
  }
  .accountHead .rInfoTy .infoZone span {
    font-size: 12px;
  }
  .accountHead .rInfoTy .infoZone strong {
    font-size: 14px;
  }
  .accountHead .rInfoTy.schedule {
    top: 0;
  }
  .accountHead .rInfoTy.qa {
    position: absolute;
    right: 0;
    top: -15px;
    padding: 0;
  }

  .accountHead .period {
    margin: 10px 0 0 0;
    padding: 0;
  }
  .accountHead .period span {
    font-size: 22px;
    line-height: 24px;
    padding: 0 34px;
  }
  .accountHead .period .prev img {
    width: 24px;
  }
  .accountHead .period .next img {
    width: 24px;
  }
  .accountHead .scheduleNoti {
    margin: 25px 0 0 0;
  }
  .accountHead .scheduleNoti ul li {
    width: 33.3333%;
    margin: 0 0 2px 0;
  }
  .accountHead .scheduleNoti ul li .cbox {
    font-size: 12px;
    line-height: 30px;
  }

  .accountSchedule {
    margin: 0 0 30px 0;
  }
  .accountSchedule .asTit {
    font-size: 24px;
  }
  .accountSchedule .accountSet {
    margin: 0;
  }
  .accountSchedule .accountSet ul li {
    width: 90px;
    height: 90px;
  }
  .accountSchedule .accountSet ul li a .ico {
    padding: 14px 0 0 0;
  }
  .accountSchedule .accountSet ul li a .ico img {
    height: 30px;
  }
  .accountSchedule .accountSet ul li a .txt {
    padding: 10px 10px 0;
  }

  .accountSearch {
    margin: 0 0 12px 0;
  }
  .accountSearch .days ul li input {
    width: 116px;
    height: 32px;
    line-height: 32px;
  }
  .accountSearch .days ul li.unit {
    width: 26px;
    font-size: 24px;
    line-height: 32px;
  }
  .accountSearch .days ul li img {
    width: 24px;
    padding: 0 0 0 5px;
  }
  .accountSearch .studentS span {
    font-size: 13px;
    padding: 0 6px 0 0;
    line-height: 32px;
  }
  .accountSearch .studentS input {
    width: 139px;
    padding: 0 0 0 8px;
    height: 32px;
    line-height: 32px;
  }
  .accountSearch .studentS a {
    width: 80px;
    font-size: 13px;
    line-height: 32px;
  }
  .accountSearch .selectBox {
    position: relative;
    right: auto;
    left: 0;
    margin: 10px 0 0 0;
  }
  .accountSearch .selectBox span.searchStyleSelectBox {
    height: 40px;
    background-size: auto 40px;
  }
  .accountSearch .selectBox .searchStyleSelectBoxInner {
    white-space: nowrap;
    line-height: 40px;
  }

  .accountDash {
    margin: 0 0 20px 0;
  }
  .accountDash ul li {
    background-size: 160px 83px;
    margin: 0 0 10px 0;
  }
  .accountDash ul li .atit {
    font-size: 11px;
    padding: 26px 0 0 0;
  }
  .accountDash ul li .atit.dep {
    padding: 15px 0 0 0;
  }
  .accountDash ul li .atit span {
    display: block;
    font-size: 11px;
  }
  .accountDash ul li .anum {
    font-size: 24px;
    padding: 0 0 16px 0;
  }

  .accountInfo {
    border-width: 2px;
  }
  .accountInfo table td {
    font-size: 12px;
    padding: 12px 5px 12px 12px;
  }
  .accountInfo table td:after {
    height: 16px;
  }
  .accountInfo table td.center {
    padding: 12px 5px;
  }
  .accountInfo table td span.ty {
    font-size: 12px;
    line-height: 18px;
    padding: 0 6px;
  }
  .accountInfo table tr.point td {
    font-size: 14px;
    padding: 6px 5px 6px 12px;
  }
  .accountInfo table tr.point td .time {
    font-size: 16px;
  }
  .accountInfo table tr.point td.center {
    padding: 6px 5px;
  }
  .accountInfo table td .entrance a {
    font-size: 16px;
    line-height: 25px;
  }
  .accountInfo table td .leftTime {
    font-size: 11px;
    padding: 5px 0 0 0;
  }
  .accountInfo table td .ico {
    width: 30px;
  }
  .accountInfo .tth1 {
    width: 80px;
  }
  .accountInfo .tth2 {
    width: 80px;
  }
  .accountInfo .tth3 {
    width: 160px;
  }

  .accountAtable {
    border-width: 1px;
  }
  .accountAtable table th {
    padding: 18px 0;
  }
  .accountAtable table th span {
    font-size: 13px;
    padding: 0 0 0 6px;
  }
  .accountAtable table th:after {
    height: 16px;
  }
  .accountAtable table td {
    font-size: 12px;
    padding: 0 5px 0 12px;
    line-height: 32px;
  }
  .accountAtable table td img {
    height: 32px;
  }
  .accountAtable .setth1 {
    width: 116px;
  }

  .accountBtable {
    border-width: 1px;
  }
  .accountBtable table th {
    padding: 10px 0;
  }
  .accountBtable table th span {
    font-size: 13px;
  }
  .accountBtable table th:after {
    height: 16px;
  }
  .accountBtable table td {
    font-size: 12px;
    padding: 10px 5px 10px 12px;
  }
  .accountBtable table td:after {
    height: 16px;
  }
  .accountBtable table td.center {
    padding: 10px 5px;
  }
  .accountBtable .custom-checkbox label {
    font-size: 14px;
    padding: 0 0 0 13px;
    line-height: 16px;
    background-size: 16px 71px;
  }
  .accountBtable .custom-checkbox label.checked {
    background-position: 0 -55px;
  }
  .accountBtable .btn img {
    height: 32px;
  }

  .accountBtable .hsth1 {
    width: 40px;
  } /* Holiday Setting */
  .accountBtable .hsth2 {
    width: 110px;
  }
  .accountBtable .hsth3 {
    width: 120px;
  }
  .accountBtable .hsth4 {
    width: 90px;
  }

  .accountBtable .wlth1 {
    width: 80px;
  } /* Waiting List */
  .accountBtable .wlth2 {
    width: 130px;
  }
  .accountBtable .wlth3 {
    width: 80px;
  }
  .accountBtable .wlth4 {
    width: 90px;
  }

  .accountBtable .mcth1 {
    width: 80px;
  } /* My Class */
  .accountBtable .mcth2 {
    width: 90px;
  }
  .accountBtable .mcth3 {
    width: 120px;
  }
  .accountBtable .mcth4 {
    width: 170px;
  }

  .accountBtable .rtth1 {
    width: 60px;
  } /* Resources */
  .accountBtable .rtth2 {
    width: 150px;
  }
  .accountBtable .rtth3 {
    width: 110px;
  }

  .firstNoti p {
    font-size: 17px;
    margin: -25px 0 0 0;
  }

  /* payment info */
  .paymentInfo {
    border-width: 2px;
  }
  .paymentInfo .info {
    font-size: 16px;
    padding: 20px 0 0 0;
  }
  .paymentInfo .total {
    position: relative;
    right: auto;
    left: 0;
    top: 0;
    float: none;
    text-align: left;
  }
  .paymentInfo .total .money {
    font-size: 37px;
    margin: 12px 0;
    padding: 0 0 0 80px;
  }
  .paymentInfo .total .money:before {
    left: 0;
    top: 10px;
    font-size: 15px;
  }

  /* payment data */
  .paymentData {
    padding: 0 0 15px 0;
  }
  .paymentData > ul > li {
    height: 120px;
    padding: 0 12px;
  }
  .paymentData > ul > li .tit {
    font-size: 14px;
    padding: 14px 30px 14px 0;
  }
  .paymentData > ul > li .tit span {
    top: 10px;
    font-size: 14px;
  }
  .paymentData > ul > li .info {
    padding: 10px 0 0 0;
  }
  .paymentData > ul > li .info ul li {
    font-size: 12px;
    padding: 0 30px 0 10px;
    background-position: left 6px;
  }
  .paymentData > ul > li .info ul li span {
    font-size: 12px;
  }
  .paymentData > ul > li .stit {
    font-size: 14px;
    margin: 53px 0 0 0;
    padding: 0 30px 0 0;
  }
  .paymentData > ul > li .stit span {
    font-size: 14px;
  }
  .paymentData > ul > li .stit.dep {
    margin: 44px 0 0 0;
    padding: 0 15px 0 0;
  }
  .paymentData > ul > li .stit.dep u {
    font-size: 13px;
  }
  .paymentData > ul > li .etit {
    font-size: 14px;
    padding: 21px 30px 21px 0;
  }
  .paymentData > ul > li .etit span {
    top: 21px;
    font-size: 14px;
  }

  /* payment table */
  .payTable {
    padding: 30px;
    margin: 14px 0 0 0;
  }
  .payTable .payHead .ptit {
    font-size: 16px;
    padding: 0 0 12px 0;
  }
  .payTable .payHead .total {
    font-size: 14px;
  }
  .payTable .payHead .total span {
    font-size: 16px;
    padding: 0 0 0 12px;
  }
  .payTable table {
    border-top: 2px #c2c2c2 solid;
  }
  .payTable table th {
    padding: 12px 0;
  }
  .payTable table th span {
    font-size: 14px;
  }
  .payTable table th:after {
    height: 16px;
  }
  .payTable table td {
    font-size: 12px;
    padding: 12px 0;
  }
  .payTable table td:after {
    height: 16px;
  }

  /* schedule notice */
  .scheduleNoti {
    border-width: 2px;
  }
  .scheduleNoti strong {
    font-size: 16px;
    padding: 40px 0 12px 0;
  }
  .scheduleNoti p {
    font-size: 14px;
    padding: 0 0 40px 0;
  }

  /* schedule list */
  .scheduleList ul li {
    margin: 0 0 20px 0;
  }
  .scheduleList ul li .inbox {
    height: auto;
    padding: 10px 20px;
    border-width: 2px;
  }
  .scheduleList ul li .inbox .cont {
    padding: 5px 0 5px 70px;
    font-size: 13px;
  }
  .scheduleList ul li .inbox .cont span {
    top: 5px;
    font-size: 13px;
  }
  .scheduleList ul li .inbox a {
    right: 20px;
    width: 80px;
    font-size: 12px;
    line-height: 70px;
    margin: -35px 0 0 0;
  }
  .scheduleList ul li.on .inbox {
    border-width: 2px;
  }

  /* right search */
  .rSearch {
    padding: 0 0 15px 0;
    margin: 80px 0 0 0;
  }
  .rSearch ul li input[type='text'] {
    width: 160px;
    height: 36px;
    line-height: 36px;
  }
  .rSearch ul li a {
    width: 70px;
    height: 36px;
    font-size: 12px;
    line-height: 36px;
  }

  /* resources list */
  .resourcesList ul li {
    margin: 0 1% 25px 0;
  }
  .resourcesList ul li .movie .btn a img {
    width: 50px;
    margin: -25px 0 0 -25px;
  }
  .resourcesList ul li .name {
    font-size: 14px;
    padding: 12px 0 0 0;
  }

  /* pay content */
  .payCHead .tit {
    font-size: 24px;
  }
  .payCHead .ptxt {
    font-size: 18px;
    padding: 26px 0 18px 16px;
  }

  #payTitle {
    font-size: 16px;
    color: #fbc61e;
    line-height: 1.2;
    font-weight: 700;
    padding: 0 0 10px 0;
  }

  #payDescription {
    font-size: 14px;
    color: #333;
    line-height: 1.2;
    padding: 0 0 20px 0;
  }
  .payCHead .pimg {
    height: 160px;
  }
  .payCHead .pimg .people img {
    width: 120px;
  }
  .payCHead .pimg .img img {
    width: 945px;
  }
  .payCHead .pimg p {
    font-size: 18px;
    padding: 28px 0 0 20px;
  }
  .payCHead .list {
    margin: 45px 20px 0;
  }
  .payCHead .list ul {
    width: 260px;
    margin: 0 auto;
  }
  .payCHead .list ul li {
    float: none;
    width: 100%;
    margin: 0 0 20px;
  }
  .payCHead .list ul li .ico {
    padding: 0 0 15px 0;
  }
  .payCHead .list ul li .ico img {
    width: 120px;
  }
  .payCHead .list ul li .tit {
    font-size: 14px;
    padding: 0 0 14px 0;
  }
  .payCHead .list ul li .tit span {
    font-size: 16px;
  }
  .payCHead .list ul li .txt {
    font-size: 14px;
  }

  /* about */
  .aboutWrap .atit {
    font-size: 24px;
    padding: 0 0 25px 0;
  }
  .aboutWrap .aboutUs .aBox .htit {
    font-size: 16px;
  }
  .aboutWrap .aboutUs .aBox .stit {
    font-size: 14px;
    padding: 0 0 12px 0;
  }
  .aboutWrap .aboutUs .aBox .stxt {
    font-size: 13px;
    padding: 0 0 40px 0;
  }
  .aboutWrap .aboutUs .abNoti ul li {
    float: none;
    width: 100%;
    margin: 0 0 24px 0;
  }
  .aboutWrap .aboutUs .abNoti ul li .ico {
    padding: 0 0 15px 0;
  }
  .aboutWrap .aboutUs .abNoti ul li .txt {
    font-size: 14px;
  }

  .aboutWrap .aboutUs .classT {
    font-size: 16px;
    padding: 0 0 12px 0;
  }
  .aboutWrap .aboutUs .classY {
    font-size: 22px;
    padding: 0 0 24px 0;
  }
  .aboutWrap .aboutUs .abClass {
    margin: 0 0 40px 0;
  }
  .aboutWrap .aboutUs .abClass ul li {
    float: none;
    width: 100%;
    margin: 0 0 30px 0;
  }
  .aboutWrap .aboutUs .abClass ul li .ico {
    padding: 0 0 12px 0;
  }
  .aboutWrap .aboutUs .abClass ul li .tit {
    font-size: 14px;
    padding: 0 0 10px 0;
  }
  .aboutWrap .aboutUs .abClass ul li .txt {
    font-size: 13px;
  }
  .aboutWrap .aboutUs .classC {
    padding: 0;
  }
  .aboutWrap .aboutUs .classC p {
    font-size: 13px;
    line-height: 1.4;
    padding: 0 0 12px 0;
  }
  .aboutWrap .aboutUs .classC .classCImg {
    position: relative;
    right: auto;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
    margin: 30px 0 0 0;
  }
  .aboutWrap .aboutUs .classC .classCImg img {
    width: 240px;
  }

  .aboutWrap .aboutUs .ourVtxt .otit {
    font-size: 18px;
  }
  .aboutWrap .aboutUs .ourVtxt .stit {
    font-size: 15px;
    padding: 0 0 12px 0;
  }
  .aboutWrap .aboutUs .ourVtxt .stxt {
    font-size: 13px;
  }
  .aboutWrap .aboutUs .ourVtxt .simg {
    margin: 20px 0 0 0;
  }
  .aboutWrap .aboutUs .ourVtxt .simg img {
    width: 260px;
  }
  .aboutWrap .aboutUs .ourVimg {
    margin: 50px 0 0 0;
  }
  .aboutWrap .aboutUs .ourVList {
    padding: 50px 0 0 0;
  }
  .aboutWrap .aboutUs .ourVList ul {
    margin: 0 -5% 0 0;
  }
  .aboutWrap .aboutUs .ourVList ul li {
    width: 45%;
    margin: 0 5% 5% 0;
  }
  .aboutWrap .aboutUs .ourVList ul li .ico {
    padding: 0 0 15px 0;
    text-align: center;
  }
  .aboutWrap .aboutUs .ourVList ul li .ico img {
    width: 120px;
  }
  .aboutWrap .aboutUs .ourVList ul li .txt {
    font-size: 13px;
    line-height: 1.4;
  }

  /* qa */
  .faqType {
    border-width: 1px;
  }
  .faqType table th {
    padding: 10px 0;
  }
  .faqType table th span {
    font-size: 13px;
  }
  .faqType table th:after {
    height: 16px;
  }
  .faqType table td {
    font-size: 13px;
    padding: 10px 5px 10px 12px;
  }
  .faqType table td:after {
    height: 16px;
  }
  .faqType table td.center {
    padding: 10px 5px;
  }
  .faqType .faqth1 {
    width: 70px;
  } /* faq */
  .faqType .faqth2 {
    width: 40px;
  }
  .faqType .faqA p {
    font-size: 13px;
    line-height: 1.4;
    padding: 0 0 20px 0;
  }

  .inquiryType {
    border-width: 1px;
  }
  .inquiryType table th {
    padding: 10px 0;
  }
  .inquiryType table th span {
    font-size: 13px;
  }
  .inquiryType table th:after {
    height: 16px;
  }
  .inquiryType table td {
    font-size: 13px;
    padding: 10px 5px 10px 12px;
  }
  .inquiryType table td:after {
    height: 16px;
  }
  .inquiryType table td.center {
    padding: 10px 5px;
  }
  .inquiryType table td span.noti {
    font-size: 11px;
  }
  .inquiryType table td .answer {
    margin: 0 15px 0 60px;
  }
  .inquiryType table td .answer .cont {
    font-size: 12px;
    line-height: 1.4;
  }
  .inquiryType table td .answer .admin {
    font-size: 12px;
    margin: 12px 0 0 0;
    padding: 12px 13px;
    line-height: 1.4;
  }
  .inquiryType table td span.day {
    padding: 0 0 0 24px;
  }

  .inquiryType .quth1 {
    width: 80px;
  } /* questions */
  .inquiryType .quth2 {
    width: 120px;
  }
  .inquiryType .quth3 {
    width: 120px;
  }

  /*** common ***/
  /* btn area */
  .btnArea {
    padding: 25px 0 0 0;
  }
  .btnArea .cBtn {
    width: 200px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .btnArea .bBtn {
    width: 200px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .btnArea .yBtn {
    width: 150px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .btnArea .cancelBtn {
    width: 150px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .btnArea .short {
    width: 120px;
  }

  .tabtnArea {
    padding: 20px 0 0 0;
  }
  .tabtnArea .gBtn {
    width: 160px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }

  /* select */
  span.searchStyleSelectBox {
    height: 36px;
    font-size: 12px;
    background-size: auto 36px;
  }
  .searchStyleSelectBoxInner {
    font-size: 12px;
    line-height: 36px;
    padding: 0 35px 0 12px;
  }

  span.bdSbox {
    min-width: 100px;
    height: 36px;
    font-size: 12px;
    background-size: auto 36px;
  }
  .bdSboxInner {
    font-size: 12px;
    line-height: 36px;
    padding: 0 35px 0 12px;
  }

  span.searchStyleSelectBox2 {
    min-width: 100px;
    height: 36px;
    font-size: 12px;
    background-size: auto 36px;
  }
  .searchStyleSelectBoxInner2 {
    font-size: 12px;
    line-height: 36px;
    padding: 0 35px 0 12px;
  }

  /* paging */
  .pagingArea {
    padding: 20px 0 0 0;
  }
  .pagingArea .paging {
    padding: 5px 0;
  }
  .pagingArea .paging a {
    width: 26px;
    height: 26px;
    font-size: 12px;
    line-height: 26px;
  }
  .pagingArea .paging a.n img {
    width: 26px;
  }
  .pagingArea .paging a.n.prev {
    margin-right: 5px;
  }
  .pagingArea .paging a.n.next {
    margin-left: 5px;
  }
  .pagingArea.other .selectDelBtn {
    top: 60px;
    width: 70px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .pagingArea.other .hsAddBtn {
    top: 60px;
    width: 120px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .pagingArea.other .yrBtn {
    top: 60px;
    width: 100px;
    height: 36px;
    font-size: 13px;
    line-height: 36px;
  }
  .pagingArea.other .paging {
    margin: 0 0 40px 0;
  }
  .pagingArea .boardBtn span {
    font-size: 13px;
    padding: 0 12px 0 0;
  }
  .pagingArea .boardBtn a {
    width: 90px;
    height: 30px;
    font-size: 13px;
  }

  /* top search */
  .topSearch {
    margin: 30px 0 12px 0;
  }
  .topSearch .rArea ul li input {
    width: 200px;
    height: 36px;
  }
  .topSearch .rArea ul li a {
    width: 80px;
    height: 36px;
    font-size: 12px;
    line-height: 36px;
  }

  /* checkbox */
  .custom-checkbox label,
  .custom-radio label {
    font-size: 13px;
    padding: 0 0 0 20px;
    line-height: 18px;
  }

  /* input */
  input[type='text'],
  input[type='password'] {
    height: 36px;
    font-size: 12px;
    line-height: 36px;
    padding: 0 0 0 12px;
  }

  /* tabs */
  .tabs {
    margin: 0 0 23px 0;
  }
  .tabs ul li a {
    height: 40px;
  }
  .tabs ul li a span {
    font-size: 14px;
    line-height: 40px;
  }
  .tabs ul.four li {
    width: 50%;
    margin: 0 0 2px 0;
  }
  .tabs ul.five li {
    width: 50%;
    margin: 0 0 2px 0;
  }
  .tabs ul.five li:nth-child(5) {
    width: 100%;
  }
  .tabs ul.three li {
    width: 50%;
  }
  .tabs ul.three li:nth-child(3) {
    width: 100%;
  }

  /*** popWrap ***/
  #popWrap .guCont .innerBox {
    padding: 14px;
  }
  #popWrap .guCont .innerBox .tit {
    font-size: 15px;
  }
  #popWrap #guHead.long {
    height: 0;
  }
  #popWrap #guHead.long .guClosed {
    right: 4px;
  }
  #popWrap #guHead.long .guClosed a {
    background: url('/img/btn/btn_pop_close_m.png') left top no-repeat;
  }
  #popWrap #guTBase {
    max-width: 340px;
  }
  #popWrap #guTBLow {
    max-width: 340px;
  }
  #popWrap #guTMLow {
    max-width: 340px;
  }
  #popWrap #guTWidth {
    max-width: 340px;
  }

  /* setting */
  #popWrap .guCont .innerBox .testDiv .tDtop .ico {
    position: relative;
    left: 0;
    bottom: auto;
    top: 0;
    width: 100%;
    padding: 10px 0 0 0;
    text-align: center;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .ico img {
    width: 40px;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .test {
    margin: 0 75px 0 0;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .test p {
    font-size: 13px;
    padding: 6px 0 10px 0;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .test .search {
    margin: 0 0 12px 0;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .test .search.dep {
    margin: 6px 0 10px;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .cameraArea {
    bottom: 13px;
    width: 65px;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .cameraArea img {
    width: 100%;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .volumeArea {
    bottom: 13px;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul {
    height: 50px;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .volumeArea ul li {
    width: 8px;
    margin: 0 0 0 5px;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .volumeArea .base {
    position: relative;
    width: 60px;
    overflow: hidden;
    z-index: 2;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .volumeArea .dummy {
    width: 60px;
    height: 50px;
  }
  #popWrap .guCont .innerBox .testDiv .tDtop .volumeArea .dummy ul {
    width: 60px;
  }
  #popWrap .guCont .innerBox .testDiv .tDbom {
    font-size: 13px;
    padding: 12px 0 20px 0;
  }
  #popWrap .guCont .innerBox .testDiv.last .tDtop .ico {
    bottom: auto;
  }
  #popWrap .guCont .innerBox .testDiv.last .tDbom {
    padding: 12px 0 6px 0;
  }
  #popWrap .setNoti span {
    font-size: 15px;
    line-height: 40px;
  }

  /* movie preview */
  #popWrap .popMView a img {
    margin: -20px 0 0 -20px;
    width: 40px;
    height: 40px;
  }
  #popWrap .popMViewBig a img {
    margin: -30px 0 0 -30px;
    width: 60px;
    height: 60px;
  }

  /* class */
  #popWrap .classNoti {
    font-size: 15px;
    padding: 45px 0 32px 0;
  }
  #popWrap .classInfo {
    padding: 20px 0 18px 0;
  }
  #popWrap .classInfo ul li {
    font-size: 14px;
    padding: 5px 0 5px 70px;
  }
  #popWrap .classInfo ul li strong {
    top: 5px;
    font-size: 14px;
  }
  #popWrap .classTime {
    font-size: 13px;
    padding: 0 0 12px 0;
  }

  #popWrap .cReason {
    padding: 0 0 0 70px;
  }
  #popWrap .cReason .tt {
    top: 1px;
    font-size: 14px;
  }
  #popWrap .cReason .reason span.searchStyleSelectBox {
    height: 36px;
    font-size: 12px;
    background-size: auto 36px;
    padding: 0 30px 0 12px;
  }
  #popWrap .cReason .reason .searchStyleSelectBoxInner {
    font-size: 12px;
    line-height: 34px;
  }
  #popWrap .cancelBox {
    margin: 20px 0 0 0;
  }
  #popWrap .cancelBox .firstNoti {
    font-size: 13px;
    padding: 16px 0 10px;
  }
  #popWrap .cancelBox a {
    font-size: 13px;
  }
  #popWrap .cancelBox .lastNoti {
    font-size: 15px;
    padding: 20px 0 6px;
  }

  #popWrap .timeNoti {
    font-size: 13px;
    line-height: 1.4;
    padding: 16px 0 20px 0;
  }
  #popWrap .timeSet {
    padding: 0 0 16px 0;
  }
  #popWrap .timeSet ul li {
    margin: 0 0 10px 0;
  }
  #popWrap .timeSet .custom-radio label {
    font-size: 14px;
  }

  /* change pw */
  #popWrap .pwTxt {
    font-size: 14px;
    line-height: 1.4;
    padding: 36px 0 22px 0;
  }
  #popWrap .pwChForm {
    padding: 29px 0;
  }
  #popWrap .pwChForm p {
    font-size: 13px;
    padding: 0 0 6px 0;
  }
  #popWrap .pwChForm input {
    height: 36px;
    line-height: 36px;
  }

  /* schedule */
  #popWrap .dayList {
    padding: 20px 0 15px;
  }
  #popWrap .dayList ul li {
    width: 25px;
    height: 25px;
    font-size: 13px;
    line-height: 25px;
    font-weight: 600;
  }
  #popWrap .popForm {
    padding: 0 0 15px 0;
  }
  #popWrap .popForm .pBox {
    padding: 0 0 10px 55px;
  }
  #popWrap .popForm .pBox:last-child {
    padding: 0 0 0 55px;
  }
  #popWrap .popForm .pBox .tt {
    left: 5px;
    font-size: 13px;
    line-height: 36px;
  }
  #popWrap .popForm .pBox .data input[type='text'] {
    font-size: 12px;
    height: 36px;
    line-height: 34px;
  }
  #popWrap .popForm .pBox .data span.searchStyleSelectBox {
    height: 36px;
    font-size: 12px;
    background-size: auto 36px;
    padding: 0 30px 0 12px;
  }
  #popWrap .popForm .pBox .data .searchStyleSelectBoxInner {
    font-size: 12px;
    line-height: 34px;
  }
  #popWrap .popForm .pBox .data ul.divide li {
    float: none;
    width: 90%;
    margin: 0 20px 0 0;
  }
  #popWrap .popForm .pBox .data ul.divide li:first-child {
    margin: 0 0 5px 0;
  }
  #popWrap .popForm .pBox .data ul.divide li:after {
    background-size: 10px 1px;
  }
  #popWrap .popForm .pBox .data .calendar {
    width: 50%;
    padding: 0 34px 0 0;
  }
  #popWrap .popForm .pBox .data .calendar a {
    position: absolute;
    right: 0;
    top: 5px;
  }
  #popWrap .popForm .pBox .data .calendar a img {
    width: 24px;
  }
  #popWrap .popForm .pBox .data textarea {
    height: 108px;
    font-size: 12px;
    line-height: 1.4;
    padding: 12px;
  }

  #popWrap .tipsWrap .tipBox {
    padding: 10px 0 10px 60px;
  }
  #popWrap .tipsWrap .tipBox .number {
    top: 10px;
    width: 50px;
    height: 50px;
    font-size: 22px;
    line-height: 48px;
    border-radius: 15px;
  }
  #popWrap .tipsWrap .tipBox .tipCont p {
    font-size: 13px;
    padding: 7px 0 10px 0;
  }
  #popWrap .tipsWrap .tipBox .tipCont ul li {
    padding: 0 0 0 15px;
    font-size: 13px;
  }
  #popWrap .tipsWrap .tipBox .tipCont ul li span {
    font-size: 13px;
  }
  #popWrap .tipsWrap .tipBox:last-child {
    padding: 10px 0 15px 60px;
  }

  /* view info */
  #popWrap .viewInfoWrap {
    padding: 12px 0 6px 0;
  }
  #popWrap .viewInfoWrap .information {
    padding: 0;
  }
  #popWrap .viewInfoWrap .information .picInfo {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0 0 10px 0;
  }
  #popWrap .viewInfoWrap .information .picInfo .pic {
    width: 50px;
    height: 50px;
  }
  #popWrap .viewInfoWrap .information .picInfo .info .name {
    font-size: 15px;
    padding: 6px 0 0 0;
  }
  #popWrap .viewInfoWrap .information .picInfo .info .bday {
    font-size: 12px;
  }
  #popWrap .viewInfoWrap .information .dataInfo table th {
    padding: 8px 0;
  }
  #popWrap .viewInfoWrap .information .dataInfo table th span {
    font-size: 13px;
    padding: 0 0 0 10px;
  }
  #popWrap .viewInfoWrap .information .dataInfo table th:after {
    height: 10px;
  }
  #popWrap .viewInfoWrap .information .dataInfo table td {
    font-size: 12px;
    padding: 8px 0 8px 10px;
  }
  #popWrap .viewInfoWrap .information .dataInfo .th1 {
    width: 80px;
  }

  #popWrap .viewInfoWrap .dataTable {
    margin: 20px 0 4px 0;
  }
  #popWrap .viewInfoWrap .dataTable table th {
    padding: 8px 0;
  }
  #popWrap .viewInfoWrap .dataTable table th span {
    font-size: 13px;
    padding: 0 0 0 10px;
  }
  #popWrap .viewInfoWrap .dataTable table td {
    font-size: 12px;
    padding: 8px 0 8px 10px;
  }
  #popWrap .viewInfoWrap .dataTable table td textarea {
    height: 70px;
    font-size: 12px;
    padding: 8px;
  }
  #popWrap .viewInfoWrap .dataTable .vh1 {
    width: 110px;
  }
  #popWrap .viewInfoWrap .dataTable .divide ul li {
    padding: 0 0 8px 0;
    margin: 0 0 8px 0;
  }

  #popWrap .viewInfoWrap .summary .sTit {
    font-size: 15px;
    padding: 16px 0 10px;
  }
  #popWrap .viewInfoWrap .summary table th {
    padding: 8px 0;
  }
  #popWrap .viewInfoWrap .summary table th span {
    font-size: 13px;
  }
  #popWrap .viewInfoWrap .summary table td {
    font-size: 12px;
    padding: 4px 0 4px 8px;
  }
  #popWrap .viewInfoWrap .summary .sth1 {
    width: 116px;
  }
  #popWrap .viewInfoWrap .summary .sth2 {
    width: 200px;
  }
  #popWrap .viewInfoWrap .summary .sth3 {
    width: 82px;
  }
  #popWrap .viewInfoWrap .summary .sth4 {
    width: 110px;
  }
  #popWrap .viewInfoWrap .summary .sth5 {
    width: 110px;
  }
  #popWrap .viewInfoWrap .summary .tableGuard {
    height: 300px;
  }
  #popWrap .viewInfoWrap .moreBtn {
    margin: 6px 0 10px 0;
  }
  #popWrap .viewInfoWrap .moreBtn a {
    width: 160px;
    height: 36px;
  }
  #popWrap .viewInfoWrap .moreBtn a span {
    font-size: 13px;
    line-height: 36px;
  }
}

/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}
@keyframes backInLeft {
    from {
        width: 0
    }

    to {
        width: 100%
    }
}

@keyframes backInRight {
    from {
        width: 100%;
    }

    to {
        width: 0;
    }
}

#slidePrev {
  right: 59px;
  background: url("/img/btn/btn_main_slide_prev.png") left top no-repeat;
}
#slideNext {
  right: 20px;
  background: url("/img/btn/btn_main_slide_next.png") left top no-repeat;
}

#slideNext,
#slidePrev {
  position: absolute;
  bottom: 20px;
  display: inline-block;
  width: 40px;
  height: 40px;
  color: #a7a7a7;
  text-decoration: none;
  cursor: pointer;
  border: none;
}

.titleSmall {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 20px;
  color: black;
}

button {
  border: none;
  outline: 0;
  margin: 0;
  padding: 0;
  cursor: pointer;
}

#naviButton {
  background: transparent;
  z-index: 990;
}

.bm-menu-wrap {
  background-color: white;
  top: 0;
}

@media (max-width: 1000px) {
  header .naviOpen button {
    display: block;
    width: 100%;
    background: transparent;
    border: 0;
    padding: 0;
  }

  .maccount,
  .mlogin {
    /* margin-top: 53px; */
    height: 200px;
    position: relative !important;
    margin-bottom: 80px;
  }

  header .naviBox .navi.four > ul > li > div {
    left: 0 !important;
    border: none !important;
  }

  header .naviBox .myLogout button {
    display: block;
    font-size: 28px;
    color: #000;
    font-weight: 600;
    line-height: 98px;
    background: url('/img/bg/bg_my_logout.png') 371px 50% no-repeat;
    padding: 0 0 0 40px;
    box-sizing: border-box;
  }
}

@media (max-width: 640px) {
  .maccount,
  .mlogin {
    margin-bottom: 53px;
  }

  header .naviBox .myLogout button {
    font-size: 15px;
    line-height: 54px;
    padding: 0 0 0 22px;
    background-position: 210px 50%;
    background-size: 18px;
  }
}

#mainTitleText {
  max-width: 640px;
}

.bulletinUL {
  padding-left: 30px;
  list-style: disc !important;
}

.bulletinUL li {
  list-style: disc !important;
  display: list-item !important;
  padding: 0 !important;
}

.maxWidth262 {
  max-width: 262px;
}

.ulHowToApply {
  /* list-style: disc !important; */
  display: list-item !important;
}

.ulHowToApply li {
  list-style: disc !important;
  padding: 0 0 0 0 !important;
  display: list-item !important;
  font-size: 16px;
  margin-bottom: 10px !important;
}
.payCHead .pimg .people {
  right: 5% !important;
}

.applyContract .fileUpload .dBox {
  padding-left: 330px;
}

.pagination {
    width: 100%;
    overflow: hidden;
    text-align: center;
    list-style: none;
    padding: 59px 0 0 0;
    position: relative;
    font-size: 0;
}

.previous_btn {
    width: 32px;
    height: 32px;
    margin: 0 22px 0 0;
    display: inline-block;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    line-height: 32px;
    background-image: url('/img/btn/btn_paging_prev.png');
    cursor: pointer;
}

.previous_btn > a {
    display: inline-block;
    width: 32px;
    height: 32px;
}

.next_btn {
    width: 32px;
    height: 32px;
    margin: 0 0 0 22px;
    display: inline-block;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    line-height: 32px;
    background-image: url('/img/btn/btn_paging_next.png');
    cursor: pointer;
}

.next_btn > a {
    display: inline-block;
    width: 32px;
    height: 32px;
}

.active {
    color: #ffffff;
    background: #fbc61e;
    border-radius: 100%;
    cursor: pointer;
}

.page_container {
    display: inline-block !important;
    width: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
    font-weight: 600;
    vertical-align: top;
}

.page_link {
    display: inline-block;
    font-size: 14px !important;
    color: #111111 !important;
    cursor: pointer !important;
    line-height: 32px;
    font-weight: 600;
}

/*.break {*/
/*    display: inline-block;*/
/*    color: #000;*/
/*}*/

.rc-time-picker {
  display: inline-block;
  position: relative;
  box-sizing: border-box;
}
.rc-time-picker * {
  box-sizing: border-box;
}
.rc-time-picker-clear {
  position: absolute;
  right: 6px;
  cursor: pointer;
  overflow: hidden;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
  top: 3px;
  margin: 0;
}
.rc-time-picker-clear-icon:after {
  content: "x";
  font-size: 12px;
  font-style: normal;
  color: #aaa;
  display: inline-block;
  line-height: 1;
  height: 20px;
  width: 20px;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
}
.rc-time-picker-clear-icon:hover:after {
  color: #666;
}
.rc-time-picker-input {
  width: 100%;
  position: relative;
  display: inline-block;
  padding: 4px 7px;
  height: 28px;
  cursor: text;
  font-size: 12px;
  line-height: 1.5;
  color: #666;
  background-color: #fff;
  background-image: none;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  -webkit-transition: border 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: border 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.rc-time-picker-input[disabled] {
  color: #ccc;
  background: #f7f7f7;
  cursor: not-allowed;
}
.rc-time-picker-panel {
  z-index: 1070;
  width: 170px;
  position: absolute;
  box-sizing: border-box;
}
.rc-time-picker-panel * {
  box-sizing: border-box;
}
.rc-time-picker-panel-inner {
  display: inline-block;
  position: relative;
  outline: none;
  list-style: none;
  font-size: 12px;
  text-align: left;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 1px 5px #ccc;
  background-clip: padding-box;
  border: 1px solid #ccc;
  line-height: 1.5;
}
.rc-time-picker-panel-narrow {
  max-width: 113px;
}
.rc-time-picker-panel-input {
  margin: 0;
  padding: 0;
  width: 100%;
  cursor: auto;
  line-height: 1.5;
  outline: 0;
  border: 1px solid transparent;
}
.rc-time-picker-panel-input-wrap {
  box-sizing: border-box;
  position: relative;
  padding: 6px;
  border-bottom: 1px solid #e9e9e9;
}
.rc-time-picker-panel-input-invalid {
  border-color: red;
}
.rc-time-picker-panel-select {
  float: left;
  font-size: 12px;
  border: 1px solid #e9e9e9;
  border-width: 0 1px;
  margin-left: -1px;
  box-sizing: border-box;
  width: 56px;
  max-height: 144px;
  overflow-y: auto;
  position: relative;
}
.rc-time-picker-panel-select-active {
  overflow-y: auto;
}
.rc-time-picker-panel-select:first-child {
  border-left: 0;
  margin-left: 0;
}
.rc-time-picker-panel-select:last-child {
  border-right: 0;
}
.rc-time-picker-panel-select ul {
  list-style: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  width: 100%;
}
.rc-time-picker-panel-select li {
  list-style: none;
  margin: 0;
  padding: 0 0 0 16px;
  width: 100%;
  height: 24px;
  line-height: 24px;
  text-align: left;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.rc-time-picker-panel-select li:hover {
  background: #edfaff;
}
li.rc-time-picker-panel-select-option-selected {
  background: #f7f7f7;
  font-weight: bold;
}
li.rc-time-picker-panel-select-option-disabled {
  color: #ccc;
}
li.rc-time-picker-panel-select-option-disabled:hover {
  background: transparent;
  cursor: not-allowed;
}

.rc-time-picker-panel {
    z-index: 5000;
}

.react-datepicker-popper {
    z-index: 6000 !important;
}

@charset "UTF-8";
.rbc-btn {
  color: inherit;
  font: inherit;
  margin: 0; }

button.rbc-btn {
  overflow: visible;
  text-transform: none;
  -webkit-appearance: button;
  cursor: pointer; }

button[disabled].rbc-btn {
  cursor: not-allowed; }

button.rbc-input::-moz-focus-inner {
  border: 0;
  padding: 0; }

.rbc-calendar {
  box-sizing: border-box;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch; }

.rbc-calendar *,
.rbc-calendar *:before,
.rbc-calendar *:after {
  box-sizing: inherit; }

.rbc-abs-full, .rbc-row-bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }

.rbc-ellipsis, .rbc-event-label, .rbc-row-segment .rbc-event-content, .rbc-show-more {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }

.rbc-rtl {
  direction: rtl; }

.rbc-off-range {
  color: #999999; }

.rbc-off-range-bg {
  background: #e6e6e6; }

.rbc-header {
  overflow: hidden;
  flex: 1 0 0%;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0 3px;
  text-align: center;
  vertical-align: middle;
  font-weight: bold;
  font-size: 90%;
  min-height: 0;
  border-bottom: 1px solid #DDD; }
  .rbc-header + .rbc-header {
    border-left: 1px solid #DDD; }
  .rbc-rtl .rbc-header + .rbc-header {
    border-left-width: 0;
    border-right: 1px solid #DDD; }
  .rbc-header > a, .rbc-header > a:active, .rbc-header > a:visited {
    color: inherit;
    text-decoration: none; }

.rbc-row-content {
  position: relative;
  user-select: none;
  -webkit-user-select: none;
  z-index: 4; }

.rbc-row-content-scrollable {
  display: flex;
  flex-direction: column;
  height: 100%; }
  .rbc-row-content-scrollable .rbc-row-content-scroll-container {
    height: 100%;
    overflow-y: scroll;
    /* Hide scrollbar for Chrome, Safari and Opera */
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */ }
    .rbc-row-content-scrollable .rbc-row-content-scroll-container::-webkit-scrollbar {
      display: none; }

.rbc-today {
  background-color: #eaf6ff; }

.rbc-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
  font-size: 16px; }
  .rbc-toolbar .rbc-toolbar-label {
    flex-grow: 1;
    padding: 0 10px;
    text-align: center; }
  .rbc-toolbar button {
    color: #373a3c;
    display: inline-block;
    margin: 0;
    text-align: center;
    vertical-align: middle;
    background: none;
    background-image: none;
    border: 1px solid #ccc;
    padding: .375rem 1rem;
    border-radius: 4px;
    line-height: normal;
    white-space: nowrap; }
    .rbc-toolbar button:active, .rbc-toolbar button.rbc-active {
      background-image: none;
      box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
      background-color: #e6e6e6;
      border-color: #adadad; }
      .rbc-toolbar button:active:hover, .rbc-toolbar button:active:focus, .rbc-toolbar button.rbc-active:hover, .rbc-toolbar button.rbc-active:focus {
        color: #373a3c;
        background-color: #d4d4d4;
        border-color: #8c8c8c; }
    .rbc-toolbar button:focus {
      color: #373a3c;
      background-color: #e6e6e6;
      border-color: #adadad; }
    .rbc-toolbar button:hover {
      color: #373a3c;
      background-color: #e6e6e6;
      border-color: #adadad; }

.rbc-btn-group {
  display: inline-block;
  white-space: nowrap; }
  .rbc-btn-group > button:first-child:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
  .rbc-btn-group > button:last-child:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
  .rbc-rtl .rbc-btn-group > button:first-child:not(:last-child) {
    border-radius: 4px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
  .rbc-rtl .rbc-btn-group > button:last-child:not(:first-child) {
    border-radius: 4px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
  .rbc-btn-group > button:not(:first-child):not(:last-child) {
    border-radius: 0; }
  .rbc-btn-group button + button {
    margin-left: -1px; }
  .rbc-rtl .rbc-btn-group button + button {
    margin-left: 0;
    margin-right: -1px; }
  .rbc-btn-group + .rbc-btn-group,
  .rbc-btn-group + button {
    margin-left: 10px; }

.rbc-event, .rbc-day-slot .rbc-background-event {
  border: none;
  box-sizing: border-box;
  box-shadow: none;
  margin: 0;
  padding: 2px 5px;
  background-color: #3174ad;
  border-radius: 5px;
  color: #fff;
  cursor: pointer;
  width: 100%;
  text-align: left; }
  .rbc-slot-selecting .rbc-event, .rbc-slot-selecting .rbc-day-slot .rbc-background-event, .rbc-day-slot .rbc-slot-selecting .rbc-background-event {
    cursor: inherit;
    pointer-events: none; }
  .rbc-event.rbc-selected, .rbc-day-slot .rbc-selected.rbc-background-event {
    background-color: #265985; }
  .rbc-event:focus, .rbc-day-slot .rbc-background-event:focus {
    outline: 5px auto #3b99fc; }

.rbc-event-label {
  font-size: 80%; }

.rbc-event-overlaps {
  box-shadow: -1px 1px 5px 0px rgba(51, 51, 51, 0.5); }

.rbc-event-continues-prior {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0; }

.rbc-event-continues-after {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }

.rbc-event-continues-earlier {
  border-top-left-radius: 0;
  border-top-right-radius: 0; }

.rbc-event-continues-later {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0; }

.rbc-row {
  display: flex;
  flex-direction: row; }

.rbc-row-segment {
  padding: 0 1px 1px 1px; }

.rbc-selected-cell {
  background-color: rgba(0, 0, 0, 0.1); }

.rbc-show-more {
  background-color: rgba(255, 255, 255, 0.3);
  z-index: 4;
  font-weight: bold;
  font-size: 85%;
  height: auto;
  line-height: normal; }

.rbc-month-view {
  position: relative;
  border: 1px solid #DDD;
  display: flex;
  flex-direction: column;
  flex: 1 0 0;
  width: 100%;
  user-select: none;
  -webkit-user-select: none;
  height: 100%; }

.rbc-month-header {
  display: flex;
  flex-direction: row; }

.rbc-month-row {
  display: flex;
  position: relative;
  flex-direction: column;
  flex: 1 0 0;
  flex-basis: 0px;
  overflow: hidden;
  height: 100%; }
  .rbc-month-row + .rbc-month-row {
    border-top: 1px solid #DDD; }

.rbc-date-cell {
  flex: 1 1 0;
  min-width: 0;
  padding-right: 5px;
  text-align: right; }
  .rbc-date-cell.rbc-now {
    font-weight: bold; }
  .rbc-date-cell > a, .rbc-date-cell > a:active, .rbc-date-cell > a:visited {
    color: inherit;
    text-decoration: none; }

.rbc-row-bg {
  display: flex;
  flex-direction: row;
  flex: 1 0 0;
  overflow: hidden; }

.rbc-day-bg {
  flex: 1 0 0%; }
  .rbc-day-bg + .rbc-day-bg {
    border-left: 1px solid #DDD; }
  .rbc-rtl .rbc-day-bg + .rbc-day-bg {
    border-left-width: 0;
    border-right: 1px solid #DDD; }

.rbc-overlay {
  position: absolute;
  z-index: 5;
  border: 1px solid #e5e5e5;
  background-color: #fff;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25);
  padding: 10px; }
  .rbc-overlay > * + * {
    margin-top: 1px; }

.rbc-overlay-header {
  border-bottom: 1px solid #e5e5e5;
  margin: -10px -10px 5px -10px;
  padding: 2px 10px; }

.rbc-agenda-view {
  display: flex;
  flex-direction: column;
  flex: 1 0 0;
  overflow: auto; }
  .rbc-agenda-view table.rbc-agenda-table {
    width: 100%;
    border: 1px solid #DDD;
    border-spacing: 0;
    border-collapse: collapse; }
    .rbc-agenda-view table.rbc-agenda-table tbody > tr > td {
      padding: 5px 10px;
      vertical-align: top; }
    .rbc-agenda-view table.rbc-agenda-table .rbc-agenda-time-cell {
      padding-left: 15px;
      padding-right: 15px;
      text-transform: lowercase; }
    .rbc-agenda-view table.rbc-agenda-table tbody > tr > td + td {
      border-left: 1px solid #DDD; }
    .rbc-rtl .rbc-agenda-view table.rbc-agenda-table tbody > tr > td + td {
      border-left-width: 0;
      border-right: 1px solid #DDD; }
    .rbc-agenda-view table.rbc-agenda-table tbody > tr + tr {
      border-top: 1px solid #DDD; }
    .rbc-agenda-view table.rbc-agenda-table thead > tr > th {
      padding: 3px 5px;
      text-align: left;
      border-bottom: 1px solid #DDD; }
      .rbc-rtl .rbc-agenda-view table.rbc-agenda-table thead > tr > th {
        text-align: right; }

.rbc-agenda-time-cell {
  text-transform: lowercase; }
  .rbc-agenda-time-cell .rbc-continues-after:after {
    content: ' \BB'; }
  .rbc-agenda-time-cell .rbc-continues-prior:before {
    content: '\AB   '; }

.rbc-agenda-date-cell,
.rbc-agenda-time-cell {
  white-space: nowrap; }

.rbc-agenda-event-cell {
  width: 100%; }

.rbc-time-column {
  display: flex;
  flex-direction: column;
  min-height: 100%; }
  .rbc-time-column .rbc-timeslot-group {
    flex: 1; }

.rbc-timeslot-group {
  border-bottom: 1px solid #DDD;
  min-height: 40px;
  display: flex;
  flex-flow: column nowrap; }

.rbc-time-gutter,
.rbc-header-gutter {
  flex: none; }

.rbc-label {
  padding: 0 5px; }

.rbc-day-slot {
  position: relative; }
  .rbc-day-slot .rbc-events-container {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    margin-right: 10px;
    top: 0; }
    .rbc-day-slot .rbc-events-container.rbc-rtl {
      left: 10px;
      right: 0; }
  .rbc-day-slot .rbc-event, .rbc-day-slot .rbc-background-event {
    border: 1px solid #265985;
    display: flex;
    max-height: 100%;
    min-height: 20px;
    flex-flow: column wrap;
    align-items: flex-start;
    overflow: hidden;
    position: absolute; }
  .rbc-day-slot .rbc-background-event {
    opacity: 0.75; }
  .rbc-day-slot .rbc-event-label {
    flex: none;
    padding-right: 5px;
    width: auto; }
  .rbc-day-slot .rbc-event-content {
    width: 100%;
    flex: 1 1 0;
    word-wrap: break-word;
    line-height: 1;
    height: 100%;
    min-height: 1em; }
  .rbc-day-slot .rbc-time-slot {
    border-top: 1px solid #f7f7f7; }

.rbc-time-view-resources .rbc-time-gutter,
.rbc-time-view-resources .rbc-time-header-gutter {
  position: sticky;
  left: 0;
  background-color: white;
  border-right: 1px solid #DDD;
  z-index: 10;
  margin-right: -1px; }

.rbc-time-view-resources .rbc-time-header {
  overflow: hidden; }

.rbc-time-view-resources .rbc-time-header-content {
  min-width: auto;
  flex: 1 0 0;
  flex-basis: 0px; }

.rbc-time-view-resources .rbc-time-header-cell-single-day {
  display: none; }

.rbc-time-view-resources .rbc-day-slot {
  min-width: 140px; }

.rbc-time-view-resources .rbc-header,
.rbc-time-view-resources .rbc-day-bg {
  width: 140px;
  flex: 1 1 0;
  flex-basis: 0 px; }

.rbc-time-header-content + .rbc-time-header-content {
  margin-left: -1px; }

.rbc-time-slot {
  flex: 1 0 0; }
  .rbc-time-slot.rbc-now {
    font-weight: bold; }

.rbc-day-header {
  text-align: center; }

.rbc-slot-selection {
  z-index: 10;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  font-size: 75%;
  width: 100%;
  padding: 3px; }

.rbc-slot-selecting {
  cursor: move; }

.rbc-time-view {
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  border: 1px solid #DDD;
  min-height: 0; }
  .rbc-time-view .rbc-time-gutter {
    white-space: nowrap; }
  .rbc-time-view .rbc-allday-cell {
    box-sizing: content-box;
    width: 100%;
    height: 100%;
    position: relative; }
  .rbc-time-view .rbc-allday-cell + .rbc-allday-cell {
    border-left: 1px solid #DDD; }
  .rbc-time-view .rbc-allday-events {
    position: relative;
    z-index: 4; }
  .rbc-time-view .rbc-row {
    box-sizing: border-box;
    min-height: 20px; }

.rbc-time-header {
  display: flex;
  flex: 0 0 auto;
  flex-direction: row; }
  .rbc-time-header.rbc-overflowing {
    border-right: 1px solid #DDD; }
  .rbc-rtl .rbc-time-header.rbc-overflowing {
    border-right-width: 0;
    border-left: 1px solid #DDD; }
  .rbc-time-header > .rbc-row:first-child {
    border-bottom: 1px solid #DDD; }
  .rbc-time-header > .rbc-row.rbc-row-resource {
    border-bottom: 1px solid #DDD; }

.rbc-time-header-cell-single-day {
  display: none; }

.rbc-time-header-content {
  flex: 1;
  display: flex;
  min-width: 0;
  flex-direction: column;
  border-left: 1px solid #DDD; }
  .rbc-rtl .rbc-time-header-content {
    border-left-width: 0;
    border-right: 1px solid #DDD; }
  .rbc-time-header-content > .rbc-row.rbc-row-resource {
    border-bottom: 1px solid #DDD;
    flex-shrink: 0; }

.rbc-time-content {
  display: flex;
  flex: 1 0 0%;
  align-items: flex-start;
  width: 100%;
  border-top: 2px solid #DDD;
  overflow-y: auto;
  position: relative; }
  .rbc-time-content > .rbc-time-gutter {
    flex: none; }
  .rbc-time-content > * + * > * {
    border-left: 1px solid #DDD; }
  .rbc-rtl .rbc-time-content > * + * > * {
    border-left-width: 0;
    border-right: 1px solid #DDD; }
  .rbc-time-content > .rbc-day-slot {
    width: 100%;
    user-select: none;
    -webkit-user-select: none; }

.rbc-current-time-indicator {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #74ad31;
  pointer-events: none; }

.rbc-event-label {
    font-size: 100%;
}

.rbc-event-content {
    font-size: 80%;
}

.rbc-events-container {
    margin-right: 0 !important;
}

.rbc-event {
    border-radius: 0 !important;
}

/* Default state */
.rc-checkbox {
  white-space: nowrap;
  cursor: pointer;
  outline: none;
  display: inline-block;
  position: relative;
  line-height: 1;
  vertical-align: middle;
}
.rc-checkbox:hover .rc-checkbox-inner,
.rc-checkbox-input:focus + .rc-checkbox-inner {
  border-color: #3dbcf6;
}
.rc-checkbox-inner {
  position: relative;
  top: 0;
  left: 0;
  display: inline-block;
  width: 14px;
  height: 14px;
  border-width: 1px;
  border-style: solid;
  border-radius: 3px;
  border-color: #d9d9d9;
  background-color: #ffffff;
  transition: border-color 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55), background-color 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.rc-checkbox-inner:after {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  left: 4px;
  top: 1px;
  display: table;
  width: 5px;
  height: 8px;
  border: 2px solid #ffffff;
  border-top: 0;
  border-left: 0;
  content: ' ';
  animation-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);
  animation-duration: 0.3s;
  animation-name: amCheckboxOut;
}
.rc-checkbox-input {
  position: absolute;
  left: 0;
  z-index: 9999;
  cursor: pointer;
  opacity: 0;
  top: 0;
  bottom: 0;
  right: 0;
}
/* Checked state */
.rc-checkbox-checked:hover .rc-checkbox-inner {
  border-color: #3dbcf6;
}
.rc-checkbox-checked .rc-checkbox-inner {
  border-color: #3dbcf6;
  background-color: #3dbcf6;
}
.rc-checkbox-checked .rc-checkbox-inner:after {
  transform: rotate(45deg);
  position: absolute;
  left: 4px;
  top: 1px;
  display: table;
  width: 5px;
  height: 8px;
  border: 2px solid #ffffff;
  border-top: 0;
  border-left: 0;
  content: ' ';
  animation-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);
  animation-duration: 0.3s;
  animation-name: amCheckboxOut;
}
@media print {
  .rc-checkbox-checked .rc-checkbox-inner {
    box-shadow: inset 0 0 0 16px #3dbcf6;
  }
}
.rc-checkbox-disabled.rc-checkbox-checked:hover .rc-checkbox-inner {
  border-color: #d9d9d9;
}
.rc-checkbox-disabled.rc-checkbox-checked .rc-checkbox-inner {
  background-color: #f3f3f3;
  border-color: #d9d9d9;
}
.rc-checkbox-disabled.rc-checkbox-checked .rc-checkbox-inner:after {
  animation-name: none;
  border-color: #cccccc;
}
@media print {
  .rc-checkbox-disabled.rc-checkbox-checked .rc-checkbox-inner {
    box-shadow: inset 0 0 0 16px #f3f3f3;
  }
}
.rc-checkbox-disabled:hover .rc-checkbox-inner {
  border-color: #d9d9d9;
}
.rc-checkbox-disabled .rc-checkbox-inner {
  border-color: #d9d9d9;
  background-color: #f3f3f3;
}
.rc-checkbox-disabled .rc-checkbox-inner:after {
  animation-name: none;
  border-color: #f3f3f3;
}
.rc-checkbox-disabled .rc-checkbox-inner-input {
  cursor: default;
}
@keyframes amCheckboxIn {
  0% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(0, 0) rotate(45deg);
  }
  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1) rotate(45deg);
  }
}
@keyframes amCheckboxOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* CSS variables. */
:root {
	--PhoneInput-color--focus: #03b2cb;
	--PhoneInputInternationalIconPhone-opacity: 0.8;
	--PhoneInputInternationalIconGlobe-opacity: 0.65;
	--PhoneInputCountrySelect-marginRight: 0.35em;
	--PhoneInputCountrySelectArrow-width: 0.3em;
	--PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);
	--PhoneInputCountrySelectArrow-borderWidth: 1px;
	--PhoneInputCountrySelectArrow-opacity: 0.45;
	--PhoneInputCountrySelectArrow-color: inherit;
	--PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);
	--PhoneInputCountrySelectArrow-transform: rotate(45deg);
	--PhoneInputCountryFlag-aspectRatio: 1.5;
	--PhoneInputCountryFlag-height: 1em;
	--PhoneInputCountryFlag-borderWidth: 1px;
	--PhoneInputCountryFlag-borderColor: rgba(0,0,0,0.5);
	--PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);
	--PhoneInputCountryFlag-backgroundColor--loading: rgba(0,0,0,0.1);
}

.PhoneInput {
	/* This is done to stretch the contents of this component. */
	display: flex;
	align-items: center;
}

.PhoneInputInput {
	/* The phone number input stretches to fill all empty space */
	flex: 1;
	/* The phone number input should shrink
	   to make room for the extension input */
	min-width: 0;
}

.PhoneInputCountryIcon {
	width: calc(var(--PhoneInputCountryFlag-height) * var(--PhoneInputCountryFlag-aspectRatio));
	height: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--square {
	width: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--border {
	/* Removed `background-color` because when an `<img/>` was still loading
	   it would show a dark gray rectangle. */
	/* For some reason the `<img/>` is not stretched to 100% width and height
	   and sometime there can be seen white pixels of the background at top and bottom. */
	background-color: var(--PhoneInputCountryFlag-backgroundColor--loading);
	/* Border is added via `box-shadow` because `border` interferes with `width`/`height`. */
	/* For some reason the `<img/>` is not stretched to 100% width and height
	   and sometime there can be seen white pixels of the background at top and bottom,
	   so an additional "inset" border is added. */
	box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor),
		inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor);
}

.PhoneInputCountryIconImg {
	/* Fixes weird vertical space above the flag icon. */
	/* https://gitlab.com/catamphetamine/react-phone-number-input/-/issues/7#note_348586559 */
	display: block;
	/* 3rd party <SVG/> flag icons won't stretch if they have `width` and `height`.
	   Also, if an <SVG/> icon's aspect ratio was different, it wouldn't fit too. */
	width: 100%;
	height: 100%;
}

.PhoneInputInternationalIconPhone {
	opacity: var(--PhoneInputInternationalIconPhone-opacity);
}

.PhoneInputInternationalIconGlobe {
	opacity: var(--PhoneInputInternationalIconGlobe-opacity);
}

/* Styling native country `<select/>`. */

.PhoneInputCountry {
	position: relative;
	align-self: stretch;
	display: flex;
	align-items: center;
	margin-right: var(--PhoneInputCountrySelect-marginRight);
}

.PhoneInputCountrySelect {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	border: 0;
	opacity: 0;
	cursor: pointer;
}

.PhoneInputCountrySelect[disabled] {
	cursor: default;
}

.PhoneInputCountrySelectArrow {
	display: block;
	content: '';
	width: var(--PhoneInputCountrySelectArrow-width);
	height: var(--PhoneInputCountrySelectArrow-width);
	margin-left: var(--PhoneInputCountrySelectArrow-marginLeft);
	border-style: solid;
	border-color: var(--PhoneInputCountrySelectArrow-color);
	border-top-width: 0;
	border-bottom-width: var(--PhoneInputCountrySelectArrow-borderWidth);
	border-left-width: 0;
	border-right-width: var(--PhoneInputCountrySelectArrow-borderWidth);
	transform: var(--PhoneInputCountrySelectArrow-transform);
	opacity: var(--PhoneInputCountrySelectArrow-opacity);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon + .PhoneInputCountrySelectArrow {
	opacity: 1;
	color: var(--PhoneInputCountrySelectArrow-color--focus);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon--border {
	box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus),
		inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon .PhoneInputInternationalIconGlobe {
	opacity: 1;
	color: var(--PhoneInputCountrySelectArrow-color--focus);
}
.PhoneInputInput {
    width: 100% !important;
    height: 50px !important;
    font-size: 16px !important;
    color: #000000 !important;
    line-height: 50px !important;
    padding: 0 0 0 20px !important;
    border: 1px #ddd solid !important;
    margin: 0 !important;
    border-radius: 2px !important;
    box-sizing: border-box !important;
}

.PhoneInputCountryIcon {
    width: 60px;
    height: 40px;
}

