/* =============================

박보라
Copryright 2018 Chungchuy.com

============================= */

@charset "utf-8";
/******* Layout *******/

#wrap {
  position: relative;
  min-height: 100%;
  padding-bottom: 160px;
}
main {overflow: auto;}
main > .in:last-child {padding-bottom: 159px;}
main > .in.last:last-child {padding-bottom: 80px;}
#wrap, #header, main, footer, #content-wrap {
  width: 100%;
  min-width: 1280px;
}
.in, footer>div {
  width: 1280px;
  margin: 0 auto;
}
.in_plus {
    width: 1180px;
    margin: 0 auto;
}
@media screen and (max-width: 1280px) {
    #wrap, #header, main, footer, #content-wrap {
        min-width: 100%;
    }
    main>div, footer>div {
        width: 100%;
    }
    /* .in {
        width: -webkit-calc(100% - 2.604%);
        width: -moz-calc(100% - 2.604%);
        width: calc(100% - 2.604%);
        min-width: -webkit-calc(100% - 2.604%);
        min-width: -moz-calc(100% - 2.604%);
        min-width: calc(100% - 2.604%);
    } */
    .in_plus {width: 92.1875%; /*1180/1280*/
    }
}

@media screen and (max-width: 1300px) {
    #wrap, #header, main, footer {
        min-width: 1300px;
    }
}

/* 탑버튼 */

div#top {
    position: fixed;
    width: 40px;
    height: 40px;
    bottom: 0;
    right: 45%;
    margin-right: -602px;
    z-index: 10;
}

div#top a {
    display: block;
    width: 100%;
    height: 100%;
    background-color: #414042;
    background-image: url(/public_html/resource/images/common/icn-top.png);
    background-position: center center;
    background-repeat: no-repeat;
}

/* /탑버튼 */

/* 헤더 */

#header>div.in {
    overflow: hidden;
    height: 100px;
    position: relative;
}
.logo {
    float: left;
    width: 9.84375%;
    /* 126/1280 */
    margin-top: 12px;
    position: relative;
    z-index: 5;
}

.logo a {
    display: block;
    width: 100%;
}

.logo a img {
    display: block;
    width: 100%;
    margin: 0 auto;
}
#header nav {
    padding-left: 16.25%;
}
#header nav	.leftMenu{
  float:left;
  width:60%;
  overflow: hidden;
}
#header nav	.rightMenu{
  float:right;
  width:40%;
  text-align:right;
  overflow: hidden;
}
#header nav .leftMenu ul.nav-1d {
  overflow: visible;
  width: 100%;
}
#header nav ul li {
  position: relative;
  width: 27.99377916018663%;
  margin: 0 2.16637781629116%;
}

#header nav ul.nav-1d li a {
  display: block;
  width: 100%;
  text-align: center;
  position: relative;
  height: 100px;
  line-height: 100px;
  font-size: 2.4em;/* 18/18 */
  letter-spacing: -.005em;
  font-weight: 700;
}

#header nav ul.nav-1d li a::before {
  display: none;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: #4356a4;
}
/* #header nav ul.nav-1d li a:hover, */
#header nav ul.nav-1d li a.nav-act {
  color: #4356a4;
}
#header nav ul.nav-1d li a:hover::before, #header nav ul.nav-1d li a.nav-act::before {
  display: block;
}


#header nav ul.nav-1d li a.nav-act+span {
  display: block;
}
#header nav ul.nav-1d li span {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  margin: 0 auto;
  text-align: center;
  height: 8px;
}
#header nav ul.nav-2d li span.icn-new {
  top: 11px;
  left: 144px;
}
#header nav ul.nav-1d li span img {
    vertical-align: top;
}

#header nav ul.nav-2d li {
    text-align: center;
    font-size: 0.7778em;
    /* 14/18 */
}
#header nav ul.li5 li {
    width: 20%;
}
#header nav ul.li2 li {
    width: 50%;
}
#header nav ul.li5 li a {
    width: 74.974619%;
}
.rightMenu div{
  margin-top:33px;
}
.rightMenu span.r_submenu{
  display:inline-block;
  margin-top:10px;font-size:1.3em;
  padding: 0 10px;
}
.rightMenu a:hover, .rightMenu a.act {color: #4356a4 !important;}
.rightMenu a:hover {color: #4356a4 !important;}

.rightMenu .login_wrap1 {
    float: right;
    width: 18%; /*174/512*/
    padding: 1px 1%; /*5/424*/
    height: 34px;
    border-radius: 34em;
    border: 1px solid #d1d3d4;
    overflow: hidden;
    margin-left: 10px;
}
/*width 40%에서 수정*/
.rightMenu .login_wrap2 {
    float: right;
    width: 47%; /*174/512*/
    padding: 0 1%; /*5/424*/
    height: 34px;
    border-radius: 34em;
    border: 1px solid #d1d3d4;
    overflow: hidden;
    margin-left: 10px;
}

.rightMenu .login_wrap1 a {
    float:left;

    height: 34px;
    line-height: 30px;
    color: #565e71;
    font-size: 1.3em;
    padding: 0 9.23076923076923%; /*12/130*/
    position: relative;
    text-align: center;
    font-weight: 800;
    letter-spacing: -0.025em;
}

.rightMenu .login_wrap2 a {
    float:left;

    height: 34px;
    line-height: 30px;
    color: #565e71;
    font-size: 1.3em;
    padding: 0 9.23076923076923%; /*12/130*/
    position: relative;
    text-align: center;
    font-weight: 800;
    letter-spacing: -0.025em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn_join {width: 102px;}

.rightMenu .login_wrap2 .blank {
  margin-top: 12px;
  display: block;
  float: left;
  width: 1px;
  height: 7px;
  background: #d1d3d4;
}

.rightMenu .login_wrap.logout {width: 16% !important;}
.rightMenu .login_wrap.logout a {width: 100%;letter-spacing: -0.025em;}
.rightMenu .login_wrap span {
    margin-top: 14px;
    display: block;
    float: left;
    width: 1px;
    height: 7px;
    background: #d1d3d4;
}

/* @media screen and (max-width: 1300px) {
    #snb > div.login_wrap {
        width: 27%;
    }
    #snb div.top_menu {
        right: 27%;
    }
    #snb div.top_menu div{width: 70%;}
}
@media screen and (max-width: 1200px) {
    #snb > div.login_wrap { width: 30%; }
    #snb div.top_menu { right: 30%;}
    #snb div.top_menu div{width: 80%;}
}
@media screen and (max-width: 1040px) {
    #snb > div.login_wrap { width: 33%; }
    #snb div.top_menu { right: 33%;}
    #snb div.top_menu div{width: 85%;}
}
@media screen and (max-width: 940px) {
    #snb > div.login_wrap { width: 30%; }
    #snb div.top_menu { right: 30%;}
    #snb > div.login_wrap a {padding: 0 4%;}
    #snb div.top_menu a {margin: 0 3%;}
}
@media screen and (max-width: 940px) {
    #snb div.top_menu a {margin: 0 2%;}
}
@media screen and (max-width: 860px) {
    #header nav {top:40px;}
    #header nav ul.nav-1d li a {height: 60px;line-height: 60px;}
    #snb > div.login_wrap {margin-top: 4px;}
    #snb div.top_menu a {line-height: 40px;}
    #header nav ul li {width: 27.33333333333333%; margin: 0 2.16637781629116%;}
} */
/*common*/

/* main */
/** VARIABLES
===================================*/
/** RESET AND LAYOUT
===================================*/
.bx-wrapper {
  position: relative;
  *zoom: 1;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  /*fix other elements on the page moving (on Chrome)*/
  -webkit-transform: translatez(0);
  z-index: 1;
}
.bx-wrapper img {
  max-width: 100%;
  display: block;
}
/** THEME
===================================*/

.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
  display: inline-block;
  vertical-align: bottom;
  *zoom: 1;
  *display: inline;
}

.bx-controls {
    width: 1280px;
    height: 30px;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 0;
    overflow: hidden;
    z-index: 2;
}
.bx-pager {text-align: center;}
.bx-wrapper .bx-pager.bx-default-pager a {
    text-indent: -9999px;
    display: block;
    float: left;
    display: block;
    width: 40px;
    height: 3px;
    position: relative;
    margin-right: 10px;
}
.bx-pager-item a:last-child {margin-right: 0;}
.bx-pager a.active::after {background: #ed1c24;}
.bx-pager a::after {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 40px;
    height: 3px;
    /* border-radius: 15px; */
    background: #bcbec0;
    /* box-shadow: 2px 2px 3px rgba(119, 119, 119, .1); */

}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
  background-position: 0 0;
}
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
  background-position: -43px 0;
}
.bx-controls-direction {display: none;}
.bx-controls-auto {float: right;margin-right: 50px;}
.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 50%;
  margin-top: -16px;
  outline: 0;
  width: 32px;
  height: 32px;
  text-indent: -9999px;
  z-index: 9999;
}
.bx-wrapper .bx-controls-direction a.disabled {
  display: none;
}
/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
  text-align: center;
  position: relative;
  top: 12px;
}
.bx-wrapper .bx-controls-auto > div a {
    display: block;
    opacity: 0.5;
}
.bx-wrapper .bx-controls-auto > div a.active {opacity: 1;}
.bx-wrapper .bx-controls-auto .bx-start {
  text-indent: -9999px;
  width: 10px;
  height: 11px;
  outline: 0;
  background: url(/public_html/resource/images/main/icon_mv_play.png) left top no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop {
  text-indent: -9999px;
  width: 10px;
  height: 11px;
  outline: 0;
  background: url(/public_html/resource/images/main/icon_mv_pause.png) left top no-repeat;
  margin: 0 3px;
}
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  text-align: left;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
  right: 0;
  width: 35px;
}

.slider > div {text-align: center;}
.slider > div img {display: inline;}
.mv1 {background: url(/public_html/resource/images/main/story_bg.png) no-repeat top center;}
.mv2 {background: url(/public_html/resource/images/main/worksheet_bg.png) no-repeat top center;}
.mv3 {background: url(/public_html/resource/images/main/award_bg.png) no-repeat top center;}
.mv4 {background: url(/public_html/resource/images/main/excellence_bg.png) no-repeat top center;}
.mv5 {background: url(/public_html/resource/images/main/stories_bg.png) no-repeat top center;}

/* main visual slide change 231205 */

.swiper {
  position: relative;
  overflow: hidden;
}
.swiper-slide a{
  display: block;
  width: 100%;
  height: 100%;
}
.swiper-slide img{
  width: 100%;
  height: 100%;
  max-height: 500px;
}

.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
  position: absolute;
  bottom: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: auto;
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
  width: 40px;
  height: 3px;
  margin: 0;
  border-radius: 0;
  background-color: #bcbec0;
  opacity: 1;
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active{
  background-color: #ed1c24;
}

/* main visual slide change 231205 end */


/* quick menu */
#quick {position: fixed; right: 0; top: 139px;z-index: 1000;
    -webkit-transition: right 0.3s;
    -moz-transition: right 0.3s;
    -o-transition: right 0.3s;
    -ms-transition: right 0.3s;
    transition: right 0.3s;
}
#quick > a {left: -26px; top: 1px; position: absolute; display: none; width: 26px; height: 119px; background-color:  #3a4a8e; border-radius: 20px 0 0 20px; background-image: url(/public_html/resource/images/common/quick_close.png); background-repeat: no-repeat; background-position: center;}
@media screen and (max-width: 1400px) {
    #quick.quick_close > a {background-image: url(/public_html/resource/images/common/quick_open.png);}
    #quick.quick_close { right: -90px; }
    #quick > a {display: block; }
}
#quick li a {
    display: block;
    padding-top: 8px;
    width: 90px;
    height: 60px;
    text-align: center;
    background: #fff;
    border-top: 1px solid #eaeaea;
    border-left: 1px solid #eaeaea;
    border-right: 1px solid #eaeaea;
}
#quick li a h4 {padding-top: 3px;}
#quick li a h4, #quick li h4  {font-size: 1.5em;letter-spacing: -0.05em;}

#quick li > h4 {
    padding: 12px 0;
    background: #4356a4;
    width: 90px;
    height: 36px;
    color: #fff;
    text-align: center;
}
#quick li > h4 span {
    display: block;
    color: #fff7b8;
    font-weight: 800;
}


/* 공지사항 */
#notice {border-bottom: 1px solid #dcdcdc;height: 80px;}
#notice .in_plus {overflow: hidden;}
#notice h2 {
    letter-spacing: -0.05em;
    float: left;
    width: 6.44067796610169%; /*76/1180*/
    text-align: left;
    display: block;
    line-height: 80px;
    font-size: 1.7em; color: #ed481c; font-weight: 800;
}
#notice li {display: block; width: 100%;}
#notice p {
    letter-spacing: -0.05em;
    width: 80%; /*820/1180*/
    float: left;
    line-height: 80px;
    font-size: 1.7em;
    font-weight: 400;
}
#notice span {
    letter-spacing: -0.05em;
    line-height: 80px;
    display: block;
    float: left;
    width: 20%; /*142/1180*/
    color: #565e71;
    text-align: center;
    font-size: 1.7em;
    font-weight: 400;
}
#notice div > div {
    width: 74px; /*74/1180*/
    float: right;
}
#notice div > div a {
    margin-top: 23px;
    float: left;
    display: block;
    width: 35px; /*35/74*/
}
#notice div > div a:last-child {
    float: right;
}
#notice > div > a {
    display: block;
    text-align: right;
    float: right;
    font-size: 1.7em;
    font-weight: 400;
    letter-spacing: -0.05em;
    line-height: 80px;
    margin-left: 10px;
}
#notice > div > a::after {
    content: url("/public_html/resource/images/main/btn_notice_more.png");
}

.sub_notice {
    border-top: 1px solid #e6e7e8;
    position: absolute;
    width: 100%;
    bottom: 170px;
}

/* @media screen and (max-width: 1220px) {
    #notice h2 {width: 10%;}
    #notice p {width: 60%;}
}
@media screen and (max-width: 900px) {
    #notice p {width: 50%;}
    #notice h2 {width: 14%;}
    #notice span {width:15%;}
} */
/* service */
#service ul {padding: 7.8% 0;width: 100%; margin: 0 auto; overflow: hidden;} /*1200/1280*/
#service ul li {width: 33.33333333333333%; float: left;} /*400/1200*/
#service ul li a {display: block;}
#service span {display: block; margin: 0 auto; width: 88.4%;text-align: center;} /*270/400*/
#service h3 {
    padding-top: 30px;text-align: center;
    color: #6d6e71;
    font-size: 2.4em;
    letter-spacing: -0.05em;
    font-weight: 800;
}
#service ul li a:hover h3 {color: #4356a4;}

/* movie */
#movie {background: #e6eafb;}
#movie ul {padding: 7.8% 0;width: 100%; margin: 0 auto; overflow: hidden;} /*1200/1280*/
#movie ul li {width: 30.15625%; float: left; } /*400/1200*/
#movie ul li:nth-child(2) {margin: 0 4.6875%;}
#movie li > span {display: block; margin: 0 auto; width: 100%; position: relative;} /*300/400*/
#movie h3 {
    padding-bottom: 20px;text-align: left;
    color: #6d6e71;
    font-size: 2.4em;
    letter-spacing: -0.05em;
    font-weight: 800;
}
#movie a {
    display: block;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
}
#movie h3 span {color: #4356a4; display: inline-block; font-weight: 800;}


.theory2 {
    background: #fafafd url(/public_html/resource/images/sub/program_theory2_bg.png) no-repeat center center;
    text-align: center;
}
.theory4 {
    background: #f1f7ff;text-align: center;
}
.bg_gray {background: #fafafd;text-align: center;}
.program2 {
    background: #fafafd url(/public_html/resource/images/sub/program_program2_bg.png) no-repeat center 786px;
    text-align: center;
}
.philosophy3 {
    background: url(/public_html/resource/images/sub/company_philosophy3_bg.png) no-repeat center right;
    text-align: center;
}
.map {padding-bottom: 80px;}
#map {padding: 0; margin: 0 auto 100px; top: 50px;}
.map > div:last-child {
    padding: 100px 50px 0;
    text-align: left;
}
.map > div img {padding-right: 8px;}
.map > div h2 {font-size: 4.8em; font-weight: 800;}
.map > div p {padding-top: 20px;font-size: 2em; color: #6d7583; font-weight: 400;}
.map > div p span, .map > div p a {display: inline-block; color: #8193df;}
.map > div h3 {font-size: 2em;padding-top: 60px;}


.step_check {display: none;}
label.step_more {margin: 0 auto 130px; }
label.step_more::before {content: '더보기';}
.g4_after {display: none;}
.step_check:checked ~ .g4_after {display: block;}
.step_check:checked ~ label {margin: 0 auto 50px;}
.step_check:checked ~ label.step_more::before {content: '접기';}

footer {
    padding: 40px 0;
    position: absolute;
    bottom: 0;
    left: 0;
}
footer .in {overflow: hidden;position: relative;}
footer h1 {
    float: left;
    width: 9.84375%; /*126/1280*/
}
footer nav {
    float: left;
    width: 86.953125%; /*1113/1280*/
    position: relative;
    z-index: 1;
}
footer nav ul {overflow: hidden;padding-left: 3.59389038634322%;} /*40/1113*/
footer nav ul li {float: left;}
footer nav ul li.blank {
    width: 3.59389038634322%; /*40/1113*/
}
li.blank span {display: block;width: 1px; height: 7px;background: #7a808d;margin: 6px auto 0;}
footer nav a {
    display: block;
    color: #333333;
    font-size: 1.6em;
    font-weight: 800;
}
footer p {
    width: 100%; /*1113/1280*/
    padding-top: 25px;
    padding-left: 3.59389038634322%;
    font-size: 1.4em;
    color: #777777;
    letter-spacing: -0.75px;
    word-break: break-word;
    line-height: 1.5;
    font-weight: 400;
}
.privacy {color: #4356a4;}
footer div {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}



/* sub */
.snb_2depth {
    height: 40px;
    background: #f6f6f9;
    border-top: 1px solid #e9eaea;
    border-bottom: 1px solid #e9eaea;
}
.snb_2depth ul {
    width: 100%;
    padding-left: 14.296875%;
}
.snb_2depth ul li {
    width: 10.39861351819757%;
    margin: 0 2.16637781629116%;
    text-align: center;
}
.snb_2depth ul li a {
    margin-top: 5px;
    display: block;
    height: 28px;
    line-height: 28px;
    color: #4356a4;
    font-size: 1.6em;
    border-radius: 28px;
}
.snb_2depth a:hover,
.snb_2depth a.snb_act {
    background: #4356a4;
    color: #fff;
}
/* sub visual */
.sub_visual {
    width: 100%;
    height: 240px;
    background-image: url(/public_html/resource/images/sub/visual.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    text-align: center;
}
.sub_visual .sub_visual_title {
    padding-top: 50px;
    color: #fff;
    letter-spacing: -0.025em;
    font-weight: 800;
    font-size: 4.8em;
}
.sub_visual p {
    padding-top: 20px;
    font-size: 2.4em;
    color: #fff;
    line-height: 1.5;
}

h2.title {padding: 60px 0 20px;font-size: 4.8em; font-weight: 800;letter-spacing: -0.025em;}
.pay_content {
    padding: 0 50px 100px;
    background: #fafafc;
}
.pay_item {padding-top: 80px;}
.pay_item h3 {
    font-size: 2em;
    font-weight: 800;
    letter-spacing: -0.025em;
    /* padding-bottom: 20px; */
}

.pay_detail {
    padding: 30px 30px 30px 50px;
    border: 1px solid #e6e7e8;
    background: #fff;
    overflow: hidden;
    margin-top: 20px;
}
.pay_left {float: left;}
.pay_left h4 {
    letter-spacing: -0.025em;
    font-size: 3.2em;
}
.pay_left ul {
    padding-top: 20px;
    font-size: 1.6em;
    color: #4f5666;
    letter-spacing: -0.025em;
    line-height: 1.5;
}
.pay_right {float: right;line-height: 1.5;}
.number {overflow: hidden;position: relative;}
.pay_right h4 {
    float: right;
    padding-top: 16px;
    padding-bottom: 20px;
    font-size: 4em;
    letter-spacing: -0.025em;
    font-weight: 800;
    text-align: right;
    line-height: 1;
}
.number > span {
    float: right;
    display: inline-block;
    padding-left: 5px;
    padding-right: 10px;
    padding-top: 14px;
    font-size: 2.8rem;
    color: #000;
    letter-spacing: -0.025em;
    font-weight: 400;
}
.pay_right div.btn_pay span {
    display: inline-block;
    font-size: 1.6em;
    color: #4f5666;
    letter-spacing: -0.025em;
    font-weight: 400;
    width: 123px;
}
.pay_right div.btn_pay span img {padding-right: 10px;}
.pay_right a {
    display: inline-block;
    width: 200px;
    height: 50px;
    line-height: 50px;
    background: #3a3635;
    color: #fff;
    text-align: center;
    font-size: 2em;
}

.blue {color: #0093d6;}
.blue2 {color: #4354a2;}
.violet {color: #7b64f0;}
.green {color: #03b66d;}
.red {color: #ef4344;}
.red2 {color: #f54a3c;}
.orange {color: #fd8800;}

.discount {position: absolute;top: 23px;overflow: hidden;width: 205px;}
.discount > * {float: right;font-size: 2em;letter-spacing: -0.025em;}
.discount span {font-weight: 200; text-decoration: line-through;color: #3a3635;}

.sub_title {padding: 60px 0 20px; font-size: 2em; font-weight: 800;}

.pay_use p {
    width: 100%;
    height: 300px;
    overflow-y: auto;
    box-sizing: border-box;
    font-size: 1.6em;
    line-height: 1.5;
    padding: 0 50px; border: 1px solid #d1d3d4;}


.pay_btn {
    padding: 80px 0 0;
}

/* 로그인, 회원가입 */
.member {
    background: #fafafd;
    padding: 40px 0 20px;
}
.member .in {
    margin: 0 auto 100px;
    padding: 80px 0 100px;
    background: #fff;
    border: 1px solid #eeedf6;
}
.member .in h2.title {
    color: #848a98;
    text-align: center;
    padding: 0 0 60px;
    letter-spacing: 0;
}
.member_content {
    width: 450px;
    margin: 0 auto;
}
@media screen and (max-width: 450px)  {
    .member_content {
        width: 35.15625%; /*450/1280*/
    }
}
.login_tab {overflow: hidden;}
.login_tab h3 {
    width: 33.3%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    position: relative;
    margin-left: -1px;
    border-top: 1px solid #d1d3d4;
    border-left: 1px solid #d1d3d4;
    border-right: 1px solid #d1d3d4;
    border-bottom: 1px solid #d1d3d4;
    float: left;
    box-sizing: border-box;
    font-size: 1.6em;
    background: #fff;
}
.login_tab h3.act {
    border-color: #8193df;
    border-bottom: 1px solid #8193df;
    z-index: 5;
   background: #fafafd;
}
.login_tab h3:first-child {margin-left: 0;}
.login_tab h3 span {display: block; color: #848a98;}
.login_tab h3.act span {color: #4356a4;}
.member_item .login_tab h4 {clear: both; padding-top: 40px; padding-bottom: 30px;}

.login_form {margin-top: 20px;}
.login_form input[type="text"],
.login_form input[type="password"] {
    width: 100%;
    height: 57px;
    border: 1px solid #d1d3d4;
    margin-bottom: 10px;
    font-size: 1.6em;
    padding: 0 10px;
}
.login_form input[type="password"] {margin-bottom: 20px;}
.login_form input[type="text"]:focus,
.login_form input[type="password"]:focus {
    border: 1px solid #8193df;
}
.login_form button {
    width: 100%;
    height: 70px;
    line-height: 70px;
    display: block;
    font-size: 2em;
    margin-bottom: 20px;
}
input[type="checkbox"].input_check {display: none;}
.input_check + label{
    display: inline-block;
    height: 20px;
    line-height: 20px;
    font-size: 1.3em;
    color: #848a98;
    font-weight:bold;
    padding-left: 30px;
    background: url(/public_html/resource/images/common/icon_checkbox.png) left top no-repeat;
}
input[type="checkbox"].input_check:checked + label {
    background: url(/public_html/resource/images/common/icon_checkbox_on.png) left top no-repeat;
}
.member_content hr {
    width: 100%;
    height: 1px;
    background: #e6e7e8;
    border: 0;
    margin: 40px 0;
}
.member_item h4 {
    display: inline-block;
    font-size: 1.4em;
    color: #848a98;
    float: right;
    padding-bottom: 20px;
}
.member_item button {
    width: 100%;
    height: 60px;
    line-height: 60px;
    display: block;
    margin-bottom: 10px;
    font-size: 2em;
    font-weight: bold;
}
.member_item button:last-child {margin-bottom: 0;}
.search_result {overflow: hidden;}
.search_result h5 {
    font-size: 2em;
    font-weight: 800;
    padding-bottom: 20px;
}
.search_result p {
    width: 100%;
    line-height: 1.5;
    padding: 20px 0;
    background: #fafafd;
    border: 1px solid #8193df;
    box-sizing: border-box;
    margin-bottom: 10px;
    text-align: center;
    font-size: 2em;
}
.search_result p span {color: #ea485b;}
.search_result button {
    float: left;
    width: 48.88888888888889%; /*220/450*/
    margin-bottom: 0;
}
.search_result button:last-child {float: right;}
.search_result button.again {width: 100%;}
.search h4 {
    font-size: 2em;
    font-weight: 800;
    padding-bottom: 20px;
    text-align: center;
}
.search h5 {
    font-size: 1.4em;
    color: #848a98;
    padding-bottom: 20px;
}
.search button {
    width: 100%;
    height: 60px;
    line-height: 60px;
    display: block;
    margin-bottom: 10px;
    font-size: 2em;
}
.search_info h5 {
    font-size: 2em;
    font-weight: 800;
    padding-bottom: 20px;
}
.search_info p {
    width: 100%;
    line-height: 1.5;
    padding: 20px 4px;
    background: #fafafd;
    border: 1px solid #8193df;
    box-sizing: border-box;
    margin-bottom: 10px;
    font-size: 1.4em;
}
/* sub */
.sub_content {
    padding: 0 50px 70px;
    background: #fafafc;
}
.sub_item {padding-top: 60px;}
.sub_item h3 {font-size: 2em; font-weight: 800; letter-spacing: -0.025em;padding-bottom: 20px;}

/* 서브 공통 스타일 */
.sub_title_wrap {position: relative;}
.sub_tit {
    padding: 60px 0 20px;
    font-size: 4.8em;
    font-weight: 800;
    border-bottom: 2px solid #8193df;
}
.bread {position: absolute;top: 96px;right: 0;}
.bread div {
    height: 15px;
    line-height: 15px;
    text-align: right;
    color: #848a98;
    font-size: 1.4em;
}
.bread div span {color: #8193df;}
.bread_home {
    display: inline-block;
    padding-right: 6px;;
}
.bread_home img {
    vertical-align: -3px;
}

.sub {}
.sub_tab {
    overflow: hidden;
}
.sub_tab li {
    float: left;
    text-align: center;
}
.sub_tab.li2 li {width: 50%;}
.sub_tab.li3 li {width: 50%;}
.sub_tab.li4 li {width: 25%;}
.sub_tab.li5 li {width: 20%;}

.sub_tab li a {
    display: block;
    background: #f6f6f9;
    border-bottom: 1px solid #d1d3d4;
    border-left: 1px solid #d1d3d4;
    height: 60px;
    line-height: 60px;
    font-size: 2em;
}
.sub_tab.my_sb_mn li a {border-left: 0;}
.sub_tab li:first-child a {border-left: none;}
.sub_tab li a.act {background: #8193df;color: #fff;}
.sub_tab.my_sb_mn li a.act {background: #f6f6f9; color: #8193df;}

.use_detail {margin-bottom: 60px;}
.use_detail:last-child {margin-bottom: 0;}
.use_detail div {
    font-size: 1.4em;
    line-height: 1.5;
    font-weight: 400;
    width: 100%;
    height: 205px;
    padding: 10px;
    overflow-y: auto;
    border: 1px solid #e6e7e8;
    background-color: #fff;
    box-sizing: border-box;
    margin-bottom: 10px;
}
.use_detail table th, .use_detail table td {font-size: 1.4rem;height: 40px;}
.btn_wrap.use {margin-top: 60px;}

.btn_wrap.join {text-align: center;}
.btn_wrap.join a {margin: 60px 10px 0;display: inline-block;}

.history > li {margin-top: 2px;}
.history > li > ul {overflow: hidden;}
.history > li > ul > li {float: left; font-weight: 400;}
.history > li > ul > li:first-child {width: 19.53125%; font-size: 3.6em;font-weight: 800; text-align: center;height: 100%;color: #fff;letter-spacing: -0.075em;} /*250/1280*/
.history > li > ul > li:last-child {width: 80.46875%; padding: 20px 3.125% 15px; background: #fafafd;} /*1030/1280 40/1280*/
.history > li:nth-child(odd) > ul > li:first-child {background: #8193df;}
.history > li:nth-child(even) > ul > li:first-child {background: #9aa9e5;}
.history > li > ul > li > ul > li {overflow: hidden; padding-bottom: 5px;line-height: 25px;}
.history > li > ul > li > ul > li span {float: left; display: block;width: 25px;height: 25px;border-radius: 25px;background: #8193df; color: #fff;font-weight: 800;text-align: center; line-height: 26px;font-size: 1.6em; }
.history > li > ul > li p {font-size: 1.6rem; font-weight: 400;float: left; display: block;padding-left: 1.05263157894737%;} /*10/950*/
.row1 {padding: 12px 0;}
.row2 {padding: 27px 0;}
.row3 {padding: 42px 0;}
.row4 {padding: 57px 0;}
.row6 {padding: 85px 0;}


.dataTables_paginate {
    position: relative;
    padding-top: 30px;
    margin: 0 auto;
    text-align: center;
    font-size: 0;
}

.dataTables_paginate img {
    vertical-align: -1px;
}

.dataTables_paginate a {
    display: inline-block;
    zoom: 1;
    *display: inline;
    cursor: pointer;
}

.dataTables_paginate span {
    display: inline-block;
    vertical-align: top;
}

.dataTables_paginate span a {
    width: 32px;
    height: 32px;
    line-height: 30px;
    margin: 0 2px;
    border: 1px solid #d1d3d4;
    border-radius: 2px;
    color: #58595b;
    font-weight: 400;
    font-size: 14px;
    /* 14/18 */
}

.dataTables_paginate span a.current {
    border: 1px solid #a7a9ac;
    background: #a7a9ac;
    color: #fff;
}

.dataTables_paginate .previous, .dataTables_paginate .next {
    margin: 0 8px;
}

.dataTables_paginate .previous, .dataTables_paginate .next {
    width: 42px;
    height: 32px;
    text-indent: -1000em;
    overflow: hidden;
    background: url(/public_html/resource/images/common/btn_pag.png) no-repeat;
    border: 0 none;
    border-radius: 0;
}

.dataTables_paginate .previous {
    background-position: 0 0;
}

.dataTables_paginate .next {
    background-position: 100% 0;
}

/* table */

table {
    width: 100%;
}

table.blue.bd {
    border-top: 2px solid #8193df;
}

table.blue th, table.blue td {
    font-size: 2em;
    height: 60px;
    border-bottom: 1px solid #d1d3d4;
}

table.blue th {
    border-right: 1px solid #d1d3d4;
    color: #414042;
    background: #f6f6f9;
    letter-spacing: -0.025em;
    text-align: center;
}
table.blue th:nth-child(3) {border-left: 1px solid #d1d3d4;}
table.blue td {
    font-weight: 400;
    letter-spacing: -0.025em;
    text-align: left;
    padding-left: 3%;
}
table.blue td.comment {
    padding-top: 10px;
    padding-bottom: 10px;
}
table.blue td.comment span {
    display: block;
    padding-top: 10px;
    font-size: 1.4rem;
    color: #848a98;
}
table.blue td.comment input[type="checkbox"] {vertical-align: middle;}
table.blue td a {
    width: 22%;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    text-align: center;
}
table.blue td input[type="text"] {
    width: 93%;
    border: 1px solid #d1d3d4;
    font-weight: 400;
    letter-spacing: -0.025em;
    font-size: 2rem;
    text-align: left;
    height: 40px;
    padding: 0 2%;
}
table.blue td input[type="password"] {
    border: 1px solid #d1d3d4;
    font-weight: 400;
    letter-spacing: -0.025em;
    font-size: 2rem;
    text-align: left;
    height: 40px;
    padding: 0 2%;
    color: #000;
}
table.blue td input.num[type="text"],
table.blue td select.num {width: 24.8%;}
table.blue td input.in_card {width: 16.8%;}
table.blue td input.in_email[type="text"] {width: 43%;}
table.blue td input.pw_card {width: 88%;}
table.blue td.validity label {margin-right: 8px;margin-left: 8px;}
table.blue td.validity input[type="text"] {width: 31%;}
table.blue td label {font-weight: 400; margin-right: 10px;}
table.blue td label:last-child {margin-right: 0;}
table.blue td input.per20 {width: 8%;}
table.blue td input.per40 {width: 40%;}
table.blue td input.per70 {width: 70%;}
table.blue td input.per80 {width: 80%;}
.per90 {width: 90%;}
table.blue td input.per93 {width: 93%;}
table.blue td input.adr {margin-top: 10px; width: 46%;}




table.blue td span.symbols { display: inline-block; width: 4%; text-align: center; font-weight: 400;}
table.blue td select {
    border: 1px solid #d1d3d4;
    font-weight: 400;
    letter-spacing: -0.025em;
    font-size: 2rem;
    text-align: left;
    height: 40px;
    padding: 0 2%;
    box-sizing: border-box;
}
table.blue td select.email {width: 45%;}
table.blue td select.card {width: 93%;}
table.blue td select.se_bank {width: 92%;}




/* 게시판 테이블 */
table.board {border-top: 1px solid #d1d3d4;}
table.board thead th {
    border-right: 1px solid #d1d3d4;
    color: #414042;
    background: #f6f6f9;
    letter-spacing: -0.025em;
    text-align: center;
    font-size: 2rem;
    height: 60px;
    border-bottom: 1px solid #d1d3d4;
}
table.board thead th:last-child {border-right: none;}

table.board tbody th {
    border-right: 0;
    background: #f6f6f9;
}
table.board td {
    font-weight: 400;
    letter-spacing: -0.025em;
    text-align: center;
    font-size: 2rem;
    height: 60px;
    border-bottom: 1px solid #d1d3d4;
}
table.board td a {
    font-weight: 400;
}
table.board td.board_content {
    padding: 40px 10px;
    /*height: 400px;*/
    font-weight: 400;
    text-align: center;
}
table.board.bd {
    border-top: 2px solid #8193df;
}
.board_btn {padding: 30px 0 0;}
.board_btn a {
    float: right;
    width: 70px;
    height: 40px;
    line-height: 40px;
}
.board_opt {
    height: 60px;
    overflow: hidden;
}
.board_opt a, .board_opt input {float: right;margin-top: 10px;}
.board_opt input {
    width: 200px;
    height: 36px;
    border: 1px solid #d1d3d4;
}
.board_opt a {
    margin-left: 10px;
    display: inline-block;
    width: 60px;
    height: 36px;
    line-height: 36px;
    font-size: 1.3em;
    text-align: center;
}
.table_title {
    text-align: left !important;
    padding: 0 10px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
}

.qa_cont {text-align: left !important; padding: 0 20px; border-left: 1px solid #d1d3d4;}
.content {padding: 20px;line-height: 1.5;}
table.qa td {text-align: left; padding: 0 20px;}
table.qa input {display: inline-block;width: 100%;border: 1px solid #d1d3d4;height: 36px; font-size: 1.8rem;}
table.qa select {border: 1px solid #d1d3d4;height: 36px; font-size: 1.8rem;width: 100%;}
table.qa .num input {width: 20%;}
table.qa .num span {display: inline-block; padding: 0 10px;}
table.qa textarea {display: block; margin: 20px 0; width: 100%;border: 1px solid #d1d3d4; padding: 0;font-size: 1.8rem;font-family: "NanumSquareRound", sans-serif;}

.no_bd {border: none !important;}
/* btn */
.btn {
    display: block;
    margin: 0 auto;
    width: 260px;
    height: 60px;
    line-height: 60px;
    font-size: 2em;
    text-align: center;
}
.btn_blue {
    background: #4356a4;
    color: #fff;
}
.btn_red {
    background: #ea485b;
    color: #fff;
}
.btn_white {
    background: #fff;
    color: #848a98;
    border: 1px solid #d1d3d4;
}


.indent {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

/* 글씨 안보이게 */

.ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
}

/* 말줄임 */

/* float 모듈 */

.float-li {
    overflow: hidden;
}

.float-li li {
    float: left;
}

/* hr */

.nameoverflow {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #248ab2;
}

.lh_15 {
    /*2017-09-11*/
    line-height: 1.5 !important;
}
.full_width {width: 100% !important}

.po_rela {position: relative;}
.is-hide {display: none;}
.clear {clear: both;}
/******* //모듈 *******/


.publisher_text {
    position: absolute;
    top: 314px;
    left: 0;
    right: 0;
    width: 1280px;
    margin: 0 auto;
    text-align: left;
    padding-left: 50px;
    font-size: 2em;
}
.publisher_text2 {top: 50px;left: 320px;width: 903px;right: unset;height: 330px;}
.publisher_text h3 {
    padding-bottom: 10px;
    color: #8d8d8d;
}
.publisher_text p {
    color: #8d8d8d;
    height: 213px;
    font-weight: 700;
    line-height: 1.3;
}
.publisher_text2 p {color: #414142;font-size: 2.4rem;letter-spacing: -0.025em;}
.publisher_text p.trans {line-height: 1.5;}
.publisher_text2 p.trans {font-size: 2.4rem;}
.publisher_text label {
    display: block;
    width: 200px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 1.6rem;
    color: #4354a2;
    border: 1px solid #4354a2;
    background: transparent;
    position: absolute;
    bottom: -50px;
}
.publisher_text2 label {}
.publisher_text input[type="checkbox"] ~ label::after {
    display: block;
    position: absolute;
    content: "번역보기";
    width: 100%;
    height: 100%;
    text-align: center;
    font-family: "NanumSquare", sans-serif;
    font-weight: 400;
}
.publisher_text input[type="checkbox"]:checked ~ label::after {content: "영문보기";}
.publisher_text input {display: none;}
.publisher_text .trans {display: none;}
.publisher_text input[type="checkbox"] ~ p.eng {display: block;}
.publisher_text input[type="checkbox"] ~ p.trans {display: none;}
.publisher_text input[type="checkbox"]:checked ~ p.eng {display: none;}
.publisher_text input[type="checkbox"]:checked ~ p.trans {display: block;}



/*마이페이지*/
.my_tab {
    position: relative;

}
.my_tab ul  {
    width: 426px;
    height: 52px;
    position: absolute;
    top: -112px;
    right: 0;
    overflow: hidden;
}
.my_tab.tab1 ul  {
    background: url(/public_html/resource/images/sub/my_tab_bg1.png) no-repeat top left;
}
.my_tab.tab2 ul  {
    background: url(/public_html/resource/images/sub/my_tab_bg2.png) no-repeat top left;
}
.my_tab li {float: left;}
.my_tab ul a {
    display: block;
    height: 52px;
    font-size: 2em;
    color: #fff;
    padding-top: 12px;
    line-height: 40px;
    text-align: center;
}
.my_tab.tab1 li:nth-child(1) a,
.my_tab.tab2 li:nth-child(2) a {
    padding-top: 0px;
    color: #8193df;
    line-height: 50px;
}
.my_tab.tab1 li a { width: 188px;}
.my_tab.tab1 li:nth-child(1) a {width: 208px;}
.my_tab.tab2 li a { width: 207px;}
.my_tab.tab2 li:nth-child(2) a {width: 190px;}


.sub_my_tab {
    margin-top: 30px;
    width: 716px;
    height: 51px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}
.sub_my_tab.tab1.pre {
    background: url(/public_html/resource/images/sub/1_sub_my_tab_bg.png) no-repeat top left;
}
.sub_my_tab.tab1 {
    background: url(/public_html/resource/images/sub/sub_my_tab_bg1.png) no-repeat top left;
}
.sub_my_tab.tab2 {
    background: url(/public_html/resource/images/sub/sub_my_tab_bg2.png) no-repeat top left;
}
.sub_my_tab.tab3 {
    background: url(/public_html/resource/images/sub/sub_my_tab_bg3.png) no-repeat top left;
}
.sub_my_tab.tab4 {
    background: url(/public_html/resource/images/sub/sub_my_tab_bg4.png) no-repeat top left;
}
.sub_my_tab a {
    margin-top: 10px;
    display: block;
    float: left;
    height: 41px;
    line-height: 41px;
    font-size: 1.4em;
    color: #fff;
    text-align: center;
    font-weight: 800;
    width: 170px;
}
.sub_my_tab.tab1 a:nth-child(1) {width: 190px;color: #157cdb;}
.sub_my_tab.tab2 a:nth-child(2) {width: 190px;color: #1db0f1;}
.sub_my_tab.tab3 a:nth-child(3) {width: 190px;color: #6879df;}
.sub_my_tab.tab4 a:nth-child(4) {width: 190px;color: #00c1a3;}

/*탭2개*/
.sub_my_tab.col2.tab1 {
    background: url(/public_html/resource/images/sub/2_sub_my_tab_bg1.png) no-repeat top left;
}
.sub_my_tab.col2.tab2 {
    background: url(/public_html/resource/images/sub/2_sub_my_tab_bg2.png) no-repeat top left;
}

.sub_my_tab_content {
    padding: 50px;
    border: 1px solid #d1d3d4;
    margin-top: -1px;
}
.book_wrap {
    border-radius: 10px;
    background: #fafafd;
    padding-top: 40px;
    position: relative;
}
.container {width: 227px;margin: 0 auto;position: relative;}
.slidesjs-navigation {
    position: absolute;
    width: 46px;
    height: 70px;
    display: block;
    top: 115px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
.slidesjs-previous {left: -106px;background: url(/public_html/resource/images/sub/slide_left.png) no-repeat;}
.slidesjs-next {right: -106px;background: url(/public_html/resource/images/sub/slide_right.png) no-repeat;}
.slidesjs-previous:hover {background: url(/public_html/resource/images/sub/slide_left_on.png) no-repeat;}
.slidesjs-next:hover {background: url(/public_html/resource/images/sub/slide_right_on.png) no-repeat;}
#slidesjs-log {padding: 50px 0 20px;font-size: 2.4em;color: #848a98;text-align: center;font-weight: 800;}
.slidesjs-slide-number {color: #4356a4;}
.slidesjs-pagination {display: none;}
.book {
    position: relative;
    margin: 0 auto;
    right: 0;
}
.bl-btm_left {
    bottom: -7px;
    left: 2px;
}
.book-line {
    position: absolute;
    width: 9px;
    height: 9px;
    background: url(/public_html/resource/images/sub/book-line.png) no-repeat;
}
.bl-top_right {
    top: 1px;
    right: 3px;
}
.book-shadow {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 95.65217391304348%;
    height: 100%;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #a7a9ac;
    z-index: 2;
}
.img-shadow {
    position: absolute;
    top: 4px;
    left: 0;
    width: 20%;
    height: -webkit-calc(100% - 8px);
    height: -moz-calc(100% - 8px);
    height: calc(100% - 8px);
    background: url(/public_html/resource/images/sub/book-shadow.png) 4px top repeat-y;
    z-index: 2;
}
.book img, .book-wrap ul li.no-book:hover img {
    border: 4px solid #fff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 2px 1px 0px #fff,
 3px 2px 0px #dfdfdf,
 4px 3px 0px #fff,
 5px 4px 0px #dfdfdf,
 6px 5px 0px #fff,
 7px 6px 0px #a7a9ac;
    -webkit-box-shadow: 2px 1px 0px #fff, 3px 2px 0px #dfdfdf, 4px 3px 0px #fff, 5px 4px 0px #dfdfdf, 6px 5px 0px #fff, 7px 6px 0px #a7a9ac;
    box-shadow: 2px 1px 0px #fff, 3px 2px 0px #dfdfdf, 4px 3px 0px #fff, 5px 4px 0px #dfdfdf, 6px 5px 0px #fff, 7px 6px 0px #a7a9ac;
}
.book > img {
    width: 95.50561797752809%;
}
.book_title {position: absolute; bottom: 60px; font-size: 2.4em;color: #4356a4; font-weight: 800;width: 100%;text-align: center;}

.record_table {padding-top: 40px;}
.record_table_head {background: #8193df;height: 60px; overflow: hidden;}
.record_table_head ul li {color: #fff;line-height: 60px;height: 60px;}
.record_table_wt ul {overflow: hidden;}
.record_table_wt li {float: left;font-size: 1.8em;line-height: 80px; text-align: center;border-bottom: 1px solid #d1d3d4;height: 80px;}
.record_table_wt li:nth-child(1),
.record_table_wt li:nth-child(n+3):nth-child(-n+4) {width: 14%;}
.record_table_wt li:nth-child(2) {width: 58%;}
.player {width: 418px;height: 80px;margin: 0 auto;}
#player1, .player > div {height: 79px !important;}
.tab_icn { display: inline-block; vertical-align: middle; width: 100%; height: 100%;background-repeat: no-repeat;margin: 0 auto;background-position: center;}
.script {background-image: url(/public_html/resource/images/sub/icn_script.png);}
.down {background-image: url(/public_html/resource/images/sub/icn_down.png);}
.print {background-image: url(/public_html/resource/images/sub/icn_print.png);}
.xls {background-image: url(/public_html/resource/images/sub/icn_xls.png);}
.report {background-image: url(/public_html/resource/images/sub/icn_report.png);}
.script:hover, .script.act {background-image: url(/public_html/resource/images/sub/icn_script_on.png);}
.down:hover {background-image: url(/public_html/resource/images/sub/icn_down_on.png);}
.print:hover {background-image: url(/public_html/resource/images/sub/icn_print_on.png);}
.xls:hover {background-image: url(/public_html/resource/images/sub/icn_xls_on.png);}
.report:hover {background-image: url(/public_html/resource/images/sub/icn_report_on.png);}
div.a {padding: 20px 150px;border-bottom: 1px solid #d1d3d4;background: #fafafd;}
div.a h4 {font-size: 1.4em; font-weight: 800; color: #8193df;position: relative;}
div.a h4 span {display: block; position: absolute;left: -30px; top: -3px;}
div.a p {padding-top: 10px; font-size: 1.6em; font-weight: 400; }
#record_table_wrap h5 {
    font-size: 1.6em;font-weight: 400;padding-top: 20px;
}

.my_table {
    margin-top: 40px;position: relative;
}
.my_table_btn {position: absolute;bottom: 0;z-index: 10;}
.my_table_btn button {
    padding: 0 10px;
    height: 36px;
    background: #4356a4;
    color: #fff;
    font-size: 1.3em;
    margin-right: 3px;
    cursor: pointer;
}
.word_table input[type="checkbox"] {
    width: 16px; height: 16px;background: #fff;
    border: 1px solid #d1d3d4;
}
.sub_my_tab_content .my_table {
    margin-top: 0px;
}
.my_table table th, .my_table table td {font-size: 2em;height: 60px;border-bottom: 1px solid #d1d3d4;}
.my_table th {background: #8193df; color: #fff;font-size: 1.8em;}
.my_table td {font-size: 1.6em;color: #414042;text-align: center;font-weight: 400;}

.my_table > h2 {float: left;font-size: 1.8em;line-height: 36px;}
.my_table p {padding-top: 10px;font-size: 1.4em;font-weight: 400; position: absolute; bottom: 11px;}
.search_field {
    float: right;
    overflow: hidden;
    margin-bottom: 10px;
}
.search_field > * {float: left;}
.search_field input,
.search_field select {
    width: 120px;
    height: 36px;
    border: 1px solid #a7a9ac;
    font-size: 1.3em;
    margin-left: 10px;
    box-sizing: border-box;
}
.search_field div {overflow: hidden;}
.search_field div > * {float: left;}
.search_field span {margin-left: 3px;line-height: 36px;}
.search_field select {width: 120px;}
.search_field.lvtest select {width: 140px;}
.cal {background: url(/public_html/resource/images/sub/icn_cal.png) no-repeat 97px center;padding-right: 28px;padding-left: 15px;}
.search_field .search {width: 250px;padding: 0 10px;}
.search_field button {width: 60px; height: 36px;background: #4356a4;color: #fff;font-size: 1.3em;margin-left: 3px;}


.report_wrap {margin-top: 30px;border: 1px solid #d1d3d4;}

.report_monthly div.title {padding: 10px 0 40px;width: 480px;margin: 0 auto;position: relative;}
.report_monthly div.title h2 {text-align: center;font-size: 4.8em;font-weight: 800;color: #4356a4;}
.report_monthly div.title a {display: block;position: absolute;width: 30px; height: 46px;top: 10px;}
.report_monthly div.title a:first-child {background-image: url(/public_html/resource/images/sub/report_left.png);left: -20px;}
.report_monthly div.title a:last-child {background-image: url(/public_html/resource/images/sub/report_right.png);right: -20px;}
.report_monthly div.title a:first-child:hover {background-image: url(/public_html/resource/images/sub/report_left_on.png);}
.report_monthly div.title a:last-child:hover {background-image: url(/public_html/resource/images/sub/report_right_on.png);}

#report {
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.5);
    position: absolute;
    z-index: 2000;
}
#report div {position: relative;width: 1200px;height: 100%;margin: 0 auto;}
#report div a {display: block;position: absolute; top: 4%; right: -55px;}
#report div iframe {background: #fff;margin-top: 10%;}


#info_leveltest {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2000;
}
#info_leveltest div {position: relative;width: 1200px;margin: 70px auto 0;}
#info_leveltest .info_leveltest a {display: block;position: absolute; top: 0px; right: -10px;}
#info_leveltest .viewer a {display: block;position: absolute; top: 0px; right: -30px;}
#info_leveltest .wecaning a {display: block;position: absolute; top: 0px; right: -30px;}
#info_leveltest div button {background: transparent;position: absolute;right: 140px; bottom: 80px;}

/* sitemap */
.sitemap {width: 100%; margin: 0 auto;padding: 50px 0; overflow: hidden;} /*1180/1280*/
.sitemap li {float: left;margin-right: 82px;}
.sitemap h3 a {display: block;font-size: 2.4em; color: #8193df; border-bottom: 1px solid #d1d3d4; padding-bottom: 20px;}
.sitemap li div {float: left;padding-top: 16px;width: 150px;}
.sitemap li div a {display: block; line-height: 36px;}
.site1 {font-size: 2em;}
.site2 {font-size: 1.6em; color: #848a98;}
.site2:hover {color: #8193df;}
.site2:nth-child(2) {padding-top: 0px;}
.sitemap2 li {margin-right: 82px;}
.sitemap li:last-child {margin-right: 0;}
.sitemap2 h3 a {border-bottom: 0;}


/* 개인정보, 이용약관 */
.privacy_in {
    font-size: 1.4em;
    line-height: 1.5;
    font-weight: 400;
    width: 100%;
    padding: 50px;
    overflow-y: auto;
    background-color: #fff;
    box-sizing: border-box;
    margin-bottom: 10px;
}
.privacy_in table th, .privacy_in table td {font-size: 1.4rem;height: 40px;}

.ui-datepicker {font-size: 18px;width: 16em;}
.ui-datepicker th,.ui-datepicker td {font-size: 1em;height: 40px;}
.ui-datepicker th {padding: 0;}
.ui-datepicker td {font-size: 1em;}

.iw_inner h2 {}

.board pre {
    font-weight: 400;
    width: 100%;
    word-break: keep-all;
    text-align: left;
    display: block;
    line-height: 1.5;
    white-space: pre-wrap; /* CSS3*/
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-all; /* Internet Explorer 5.5+ */
}







/* 2019.06.12 디자인팀 민자혜추가*/
/* intro_tab 하이라이츠소개탭*/
#intro_tab {background: #eff2ff;overflow: hidden;}
ul.tabs {
  margin-top: 50px;
  float: left;
  height: 70px;
  width: 100%;
}
 ul.tabs li {
  float: left;
  text-align:center;
  cursor: pointer;
  line-height: 70px;
  font-size:2.4em;
  color: #ddd;
  box-sizing: border-box;
  letter-spacing: -0.5px;
  border-left: none;
  font-weight: 800;
  background: #fafafa;
  overflow: hidden;
  position: relative;
}
.tab_container {
  border: 3px solid #525252;
  border-top: none;
  clear: both;
  float: left;
  width: 100%;
  background: #FFFFFF;
  height: 650px;
  box-sizing: border-box;
  margin-bottom: 50px;
}
.tab_content .main_box_in{
  width: 1180px;
  margin: 0 auto;
}
 .tab_content .main_box_in>p.title,
 .tab_content .main_box_in_1024>p.title{
   font-weight: 800;
   text-align: center;
   font-size: 3.2em;
   letter-spacing: -0.5px;
   padding: 60px 0 0 0;
 }
 /*서브타이틀있을때 paading간격,탭5번째 가로1024일때*/
 .tab_content .main_box_in p.title2,
 .tab_content .main_box_in_1024 p.title2{
   padding: 50px 0 0 0;
 }
 .tab_content .main_box_in>p.sub_title,
 .tab_content .main_box_in_1024>p.sub_title{
   font-weight: 600;
   text-align: center;
   font-size: 1.6em;
   letter-spacing: -0.5px;
   padding: 10px 0 15px;
 }
  .tab_content .main_box_in>p.title span.blue2{
    font-weight: 800;
  }
  .tab_content .main_box_in>ul{
    overflow: hidden;
    margin-top: 40px;
  }
   /*서브타이틀있을때 paading간격*/
  .tab_content .main_box_in>ul.worksheet_tab4{
    overflow: hidden;
    margin-top: 0;
  }
  .tab_content .main_box_in>ul.worksheet_tab4 li{
    margin-right: 20px;
  }
  .tab_content .main_box_in>ul.worksheet_tab4 li:last-child{
    margin-right: 0;
  }
 .tab_content .main_box_in>ul>li{
   float: left;
   border-radius: 10px;
   height: 460px;
   box-sizing: border-box;
 }
 .tab_content .main_box_in ul li.box_780{
   width: 780px;
   background-image: url(/public_html/resource/images/main/tab4_img01.png);
 }
  .tab_content .main_box_in ul li.box_580{
    width: 580px;
  }
  .tab_content .main_box_in ul li.box_380{
    width: 380px;
    margin-right: 20px;
  }
  .tab_content .main_box_in ul li.box_380:last-child{
    margin-right: 0;
  }
  .tab_content .main_box_in ul li.box_580:nth-child(1){
    margin-right: 20px;
  }
  .tab_content .main_box_in ul li.blue{
     border: 1px solid #4356a4;
     background-color: #f4f8ff;
  }
  .tab_content .main_box_in ul li.blue2{
     border: 1px solid #4356a4;
     background-color: #fcfcfc;
     position: relative;
  }
  .tab_content .main_box_in ul li.red{
     border: 1px solid #ee4542;
     background-color: #fcfcfc;
  }
  .tab_content .main_box_in ul li.green{
     border: 1px solid #2ab081;
     background-color: #fcfcfc;
  }
  .tab_content .main_box_in ul li.yellow{
     border: 1px solid #ffb400;
     background-color: #fcfcfc;
  }
    .tab_content .main_box_in ul li p.title{
      height: 65px;
      color: #fff;
      text-align: center;
      line-height: 65px;

      letter-spacing: -0.5px;
      font-weight: 400;
    }
    .tab_content .main_box_in ul li.box_380 p.title{
      font-size: 1.8em;
    }
    .tab_content .main_box_in ul li.box_580 p.title{
      font-size: 2.2em;
    }
    .tab_content .main_box_in ul li.box_780 p.title{
      font-size: 2em;
      letter-spacing: 0;
    }

    .tab_content .main_box_in ul li p.title strong{
      color: #fff;
      font-weight: 800;
    }
    .tab_content .main_box_in ul li.red p{
      background-color: #ee4542;
      border-radius: 10px 10px 0 0;
    }
  .tab_content .main_box_in ul li.blue p{
    background-color: #4356a4;
    border-radius: 8px 8px 0 0;
  }
  .tab_content .main_box_in ul li.blue2 p{
    background-color: #4356a4;
    width: 100%;
    border-radius: 0 0 10px 10px;
    position: absolute;
    bottom: 0;
  }
  .tab_content .main_box_in ul li.green p{
    background-color: #2ab081;
    border-radius: 10px 10px 0 0;
  }
.tab_content .main_box_in ul li.yellow p{
  background-color: #ffb400;
  border-radius: 10px 10px 0 0;
}
.tab_content .main_box_in ul li .main_img{
  text-align: center;
  margin-top: 50px;
}
.tab_content .main_box_in ul li ul.infor_txt{
  overflow: hidden;
  padding-top: 24px;
}
/* tab2 */
.tab_content .main_box_in ul li .main_img2{
  text-align: center;
  margin-top: 19px;
}
/* tab4 */
.tab_content .main_box_in ul li .main_img3{
  text-align: center;
  margin-top: 70px;
}
.tab_content .main_box_in ul li ul.infor_txt2{
  padding-top: 22px;
}
  .tab_content .main_box_in ul li ul.blue{
    padding-left: 50px;
  }
  .tab_content .main_box_in ul li ul.red{
    padding-left: 41px;
  }
  .tab_content .main_box_in ul li ul.green{
    padding-left: 53px;
  }
  .tab_content .main_box_in ul li ul.yellow{
    padding-left: 38px;
  }
.tab_content .main_box_in ul li ul.infor_txt li{
  font-size: 1.6em;
  letter-spacing: -0.75px;
  line-height: 30px;
  font-weight: 800;
  margin-left: 20px;
  position: relative;
  color: #333;

}
.tab_content .main_box_in ul li ul.infor_txt li span{
  font-weight: 800;
}
.tab_content .main_box_in ul li ul.infor_txt li::before{
  content: '';
  position: absolute;
  top: 12px;
  left: -20px;
  width: 6px;
  border-radius: 50%;
  height: 6px;
}
.tab_content .main_box_in ul li ul.blue li::before{
  background-color: #4356a4;
}
.tab_content .main_box_in ul li ul.red li::before{
  background-color: #ee4542;
}
.tab_content .main_box_in ul li ul.green li::before{
  background-color: #2ab081;
}
.tab_content .main_box_in ul li ul.yellow li::before{
  background-color: #ffb400;
}

.tab_content .main_box_in ul li ul{
  padding-top: 30px;
}
.tab_content .main_box_in ul li ul.step li{
  width: 490px;
  margin: 0 auto;
  height: 110px;
  background-color: #fcfdff;
  border-radius: 5px;
  border: 1px solid #c3d3ff;
  box-sizing: border-box;
  margin-bottom: 5px;
}
.tab_content .main_box_in ul li ul.step li span.img{
  float: left;
  padding: 10px 0 0 30px;
}
.tab_content .main_box_in ul li ul.step li p{
  float: left;
  color: #333;
  background: none;
  font-size: 1.4em;
  font-weight: 600;
  letter-spacing: -0.5px;
  padding-left: 20px;
  line-height: 20px;
}
.tab_content .main_box_in ul li ul.step li p span{
  font-size: 1.3em;
  line-height: 22px;
  font-weight: 800;
  margin-bottom: 5px;
  display: inline-block;
}
.tab_content .main_box_in ul li ul.step li:nth-child(1) p{
  padding-top: 30px;
}
.tab_content .main_box_in ul li ul.step li:nth-child(2) p,
.tab_content .main_box_in ul li ul.step li:nth-child(3) p{
  padding-top: 20px;
}

/* tab5 */

.tab_content .main_box_in_1024 {
    width: 1024px;
    margin: 0 auto;
    position: relative;
}
.tab_content .main_box_in_1024>ul.movie{
  overflow: hidden;
  margin-top: 22px;
}
.tab_content .main_box_in_1024>ul.movie li{
  float: left;
  width: 500px;
  position: relative;
}
.tab_content .main_box_in_1024>ul.movie li:nth-child(1){
  margin-right: 24px;
}
.tab_content .main_box_in_1024>ul.movie li span:before {
    content: "";
    background-color: rgba(0,0,0,0.65);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
}
.tab_content .main_box_in_1024>ul.movie li span{
  display: block;
  margin: 0 auto;
  width: 100%;
  height: 345px;
  
  background-image: url("/public_html/resource/images/main/At-the-zoo_thumbnail.png");
  border: 1px solid #333;
  box-sizing: border-box;
  position: relative;
}

.tab_content .main_box_in_1024>ul.movie li .utube{
  display: block;
  margin: 0 auto;
  width: 100%;
  height: 345px;
  
  background-image: url("/public_html/resource/images/main/thumb_company_b2b.png");
  border: 1px solid #333;
  box-sizing: border-box;
  position: relative;
}
.tab_content .main_box_in_1024>ul.movie li span p{
  color: #fff;
  text-align: center;
  font-size: 2.2em;
  position: absolute;
  transform: translate(-33%, -50%);
    top: 80%;
    left: 42%;
    z-index: 13;
}
.tab_content .main_box_in_1024>ul.movie li span a {
    display: block;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 47%;
    left: 50%;
    z-index: 12;
}
.tab_content .main_box_in_1024 input{
  display: none;
}
.tab_content .main_box_in_1024 label {
    display: block;
    width: 100%;
    height: 72px;
    line-height: 72px;
    text-align: center;
    font-size: 2em;
    color: #fff;
    background-color:#4354a2;
    position: absolute;
    bottom: -98px;
}
.tab_content .main_box_in_1024 input[type="checkbox"] ~ label::after {
    display: block;
    position: absolute;
    content: "가입문의 하기";
    font-weight: 800;
    width: 100%;
    height: 100%;
    text-align: center;
    font-family: "NanumSquareRound", sans-serif;
    /* font-weight: 400; */
}
#weekly_book{
  background: #f9f9f9;
  overflow: hidden;
}
#weekly_book .in .weekly_book_box{
  width: 100%;
  height: 400px;
  border: 1px solid #e5e5e5;
  background: #fff;
  margin: 50px 0;
  position: relative;
}
#weekly_book .in .weekly_book_box>.title{
  width: 1160px;
  height: 80px;
  margin: 0 auto;
  border-bottom: 2px solid #e5e5e5;
  box-sizing: border-box;
}
#weekly_book .in .weekly_book_box>.title p{
  font-size: 2.4em;
  line-height: 80px;
  font-weight: 800;
  letter-spacing: -0.25px;
}
#weekly_book .in .weekly_book_box .title p span{
  font-weight: 800;
}
#weekly_book .in .weekly_book_box .title p span.sub_title{
  font-size: 16px;
  color: #777777;
}
#weekly_book .in .weekly_book_box .content{
  padding: 35px 0 44px;
}
#weekly_book .in .weekly_book_box .content ul{
  overflow: hidden;
}
#weekly_book .in .weekly_book_box .content ul li{
  float: left;
}
#weekly_book .in .weekly_book_box .content ul li.book_img{
  margin-left: 160px;
}
#weekly_book .in .weekly_book_box .content ul li.book_content{
  margin: 35px 0 0 85px;
}
#weekly_book .in .weekly_book_box .content ul li.book_content p.title{
  font-size: 3em;
  font-weight: 800;
  letter-spacing: -0.25px;
  color: #333;
  margin-bottom: 15px;
}
#weekly_book .in .weekly_book_box .content ul li.book_content p{
  font-size: 1.6em;
  line-height: 26px;
  letter-spacing: -0.5px;
  color: #555;
  font-weight: 700;
  width: 700px;
}
#weekly_book .in .weekly_book_box .sticker{
  position: absolute;
  right: 0;
  bottom: 0;
}


#short_cut{
  background: #ffebc4;
  overflow: hidden;
}
#short_cut .in ul{
  overflow: hidden;
}
#short_cut .in ul li{
  float: left;
  width: 17.96875%;
  margin-right: 2.528125%;
  margin-top: 45px;
  margin-bottom: 45px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);

}
#short_cut .in ul li:last-child{
  margin-right: 0;
}
.sBookMark {
    display: block;
    float: right;
    font-size: 1.3em;
    line-height: 20px;
    color: #4356a4;
    font-weight: bold;
    border-bottom: 1px solid #4356a4;
    cursor: pointer;
}
.sBookMark:hover {
    color: #ea485b;
    border-bottom: 1px solid #ea485b;
}