@charset "UTF-8";

button,[type='button'],[type='reset'],[type='submit'] {
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
border:0;
cursor:pointer;
display:inline-block;
-webkit-font-smoothing:antialiased;
text-align:center;
text-decoration:none;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
white-space:nowrap;
color:inherit;
font:inherit;
overflow:visible
}

button:hover,button:focus,[type='button']:hover,[type='button']:focus,[type='reset']:hover,[type='reset']:focus,[type='submit']:hover,[type='submit']:focus {
color:#fff
}

button:disabled,[type='button']:disabled,[type='reset']:disabled,[type='submit']:disabled {
cursor:not-allowed;
opacity:.5;
cursor:default
}

button:disabled:hover,[type='button']:disabled:hover,[type='reset']:disabled:hover,[type='submit']:disabled:hover {
background-color:#1565c0
}

fieldset {
background-color:transparent;
border:0;
margin:0;
padding:0
}

input,select,textarea,optgroup {
color:inherit;
font:inherit;
cursor:default
}

[type='color'],[type='date'],[type='datetime'],[type='datetime-local'],[type='email'],[type='month'],[type='number'],[type='password'],[type='search'],[type='tel'],[type='text'],[type='time'],[type='url'],[type='week'],input:not([type]),textarea {
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
-webkit-box-sizing:border-box;
box-sizing:border-box
}

[type='color']:focus,[type='date']:focus,[type='datetime']:focus,[type='datetime-local']:focus,[type='email']:focus,[type='month']:focus,[type='number']:focus,[type='password']:focus,[type='search']:focus,[type='tel']:focus,[type='text']:focus,[type='time']:focus,[type='url']:focus,[type='week']:focus,input:not([type]):focus,textarea:focus {
outline:none
}

[type='color']:disabled,[type='date']:disabled,[type='datetime']:disabled,[type='datetime-local']:disabled,[type='email']:disabled,[type='month']:disabled,[type='number']:disabled,[type='password']:disabled,[type='search']:disabled,[type='tel']:disabled,[type='text']:disabled,[type='time']:disabled,[type='url']:disabled,[type='week']:disabled,input:not([type]):disabled,textarea:disabled {
cursor:not-allowed
}

[type='color']::-webkit-input-placeholder,[type='date']::-webkit-input-placeholder,[type='datetime']::-webkit-input-placeholder,[type='datetime-local']::-webkit-input-placeholder,[type='email']::-webkit-input-placeholder,[type='month']::-webkit-input-placeholder,[type='number']::-webkit-input-placeholder,[type='password']::-webkit-input-placeholder,[type='search']::-webkit-input-placeholder,[type='tel']::-webkit-input-placeholder,[type='text']::-webkit-input-placeholder,[type='time']::-webkit-input-placeholder,[type='url']::-webkit-input-placeholder,[type='week']::-webkit-input-placeholder,input:not([type])::-webkit-input-placeholder,textarea::-webkit-input-placeholder {
color:#858585
}

[type='color']::-moz-placeholder,[type='date']::-moz-placeholder,[type='datetime']::-moz-placeholder,[type='datetime-local']::-moz-placeholder,[type='email']::-moz-placeholder,[type='month']::-moz-placeholder,[type='number']::-moz-placeholder,[type='password']::-moz-placeholder,[type='search']::-moz-placeholder,[type='tel']::-moz-placeholder,[type='text']::-moz-placeholder,[type='time']::-moz-placeholder,[type='url']::-moz-placeholder,[type='week']::-moz-placeholder,input:not([type])::-moz-placeholder,textarea::-moz-placeholder {
color:#858585
}

[type='color']:-ms-input-placeholder,[type='date']:-ms-input-placeholder,[type='datetime']:-ms-input-placeholder,[type='datetime-local']:-ms-input-placeholder,[type='email']:-ms-input-placeholder,[type='month']:-ms-input-placeholder,[type='number']:-ms-input-placeholder,[type='password']:-ms-input-placeholder,[type='search']:-ms-input-placeholder,[type='tel']:-ms-input-placeholder,[type='text']:-ms-input-placeholder,[type='time']:-ms-input-placeholder,[type='url']:-ms-input-placeholder,[type='week']:-ms-input-placeholder,input:not([type]):-ms-input-placeholder,textarea:-ms-input-placeholder {
color:#858585
}

[type='color']::placeholder,[type='date']::placeholder,[type='datetime']::placeholder,[type='datetime-local']::placeholder,[type='email']::placeholder,[type='month']::placeholder,[type='number']::placeholder,[type='password']::placeholder,[type='search']::placeholder,[type='tel']::placeholder,[type='text']::placeholder,[type='time']::placeholder,[type='url']::placeholder,[type='week']::placeholder,input:not([type])::placeholder,textarea::placeholder {
color:#858585
}

textarea {
resize:vertical
}

[type="checkbox"],[type="radio"] {
display:inline
}

html {
-webkit-box-sizing:border-box;
box-sizing:border-box
}

*,::before,::after {
-webkit-box-sizing:inherit;
box-sizing:inherit
}

html,body {
height:100%;
width: 100%;
overflow-x: hidden;
}

ul,ol {
list-style-type:none
}

dt {
margin:0
}

img,picture {
margin:0;
max-width:100%
}

table {
border-collapse:collapse;
table-layout:fixed;
width:100%
}

th {
text-align:left
}

a {
-webkit-transition:color 150ms ease;
transition:color 150ms ease
}

html {
-ms-text-size-adjust:100%;
-webkit-text-size-adjust:100%
}

article,aside,footer,header,nav,section {
display:block
}

figcaption,figure,main {
display:block
}

hr {
-webkit-box-sizing:content-box;
box-sizing:content-box;
overflow:visible
}

a {
background-color:transparent;
-webkit-text-decoration-skip:objects
}

small {
font-size:80%
}

img {
border-style:none
}

svg:not(:root) {
overflow:hidden
}

button,input,optgroup,select,textarea {
margin:0
}

button,input {
overflow:visible
}

button,select {
text-transform:none
}

button,html [type="button"],[type="reset"],[type="submit"] {
-webkit-appearance:button
}

button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {
border-style:none;
padding:0
}

button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {
outline:1px dotted ButtonText
}

legend {
color:inherit;
display:table;
max-width:100%;
white-space:normal
}

textarea {
overflow:auto
}

[type="checkbox"],[type="radio"] {
-webkit-box-sizing:border-box;
box-sizing:border-box;
padding:0
}

[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {
height:auto
}

[type="search"] {
-webkit-appearance:textfield;
outline-offset:-2px
}

[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration {
-webkit-appearance:none
}

::-webkit-file-upload-button {
-webkit-appearance:button;
font:inherit
}

details,menu {
display:block
}

summary {
display:list-item
}

canvas {
display:inline-block
}

template {
display:none
}

[hidden] {
display:none
}

@font-face {
font-family:'Noto Sans KR';
font-style:normal;
font-weight:400;
src:url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format("woff2"),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format("woff"),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format("opentype")
}

html {
font-family:sans-serif;
font-size:1em;
line-height:1;
color:#fff;
font-family:"Noto Sans KR","Apple SD Gothic Neo","맑은 고딕","Malgun Gothic",AppleGothic,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue","Lucida Grande",Tahoma,Verdana,나눔고딕,UnDotum,Dotum,sans-serif
}

em {
font-style:italic
}

strong,b {
font-weight:700
}

#__bs_notify__ {
top:inherit!important;
bottom:0!important
}

html {
background-color:#fff;
min-height:100%;
vertical-align:top
}

* {
vertical-align:inherit
}

body,h1,h2,h3,h4,h5,h6,p,blockquote,pre,dl,dd,ol,ul,form,fieldset,legend,figure,table,th,td,caption,hr {
margin:0;
padding:0
}

body {
overflow-x:hidden
}

html {
background-color:#000
}

body {
position:relative;
background-color:#000
}

.jp-video {

/*height:720px;*/
max-width:1280px;
width: 100%;
margin: 0 auto;
position: relative;
overflow: hidden;
/*position:absolute;
left:50%;
top:50%;
-webkit-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);*/
border:none
}



.jp-jplayer{
width: 100% !important;
/*height: 605px !important;*/
}
.jp-jplayer img{
  width: 100% !important;
  height: auto !important;
}
.jp-jplayer video{
  width: 100% !important;
  /*height: auto !important;*/
  display: none;
}

.jp-gui {
opacity:1;
width:100%;
/*display: none;*/
position:absolute;
left:0;
bottom:68px;
z-index: 8000000;
}


.jp-video-full.jp-video {
-webkit-transform:none;
-ms-transform:none;
transform:none
}

.jp-video-full .c-ui{
  position: fixed;
  left: 0;
  bottom: 0;
  display: none !important;
}

.c-ui {
height:68px;
background-color:#000;
position:relative;
position:absolute;
bottom:0;
left:-8000em;
width:100%;
z-index: 8000000;
}
.jp-video .c-ui{
  display: none;
  left: -8000em; 
}
.jp-video.u-hide .c-ui{
  display: block;
  left: 0;
}

.c-ui > a {
height:68px;
display:inline-block;
position:absolute;
bottom:0;
/*background-image:url(../img/sprite-1-s.png)*/
}

.a-guide {
width:68px;
left:0;
/*background-position:0 0*/
/*content: url(../img/ui-1.png);*/
background-image: url(../img/ui-1.png);
}

.a-percentage {
width:64px;
left:68px;
/*background-position:-68px 0*/
/*content: url(../img/ui-2.png);*/
background-image: url(../img/ui-2.png);
}

.a-board {
width:65px;
left:132px;
/*background-position:-132px 0*/
/*content: url(../img/ui-3.png);*/
background-image: url(../img/ui-3.png);
}

.a-prev {
width:180px;
right:50%;
/*background-position:-460px 0*/
/*content: url(../img/ui-4.png);*/
background-image: url(../img/ui-4.png);
}

.a-next {
width:180px;
left:50%;
/*background-position:-640px 0*/
/*content: url(../img/ui-5.png);*/
background-image: url(../img/ui-5.png);
}

.a-subtitle {
width:70px;
right:149px;
/*background-position:-1062px 0*/
/*content: url(../img/ui-6.png);*/
background-image: url(../img/ui-6.png);
}

.a-index {
display:none! important;
width:149px;
right:0;
/*background-position:-1131px 0*/
/*content: url(../img/ui-7.png);*/
background-image: url(../img/ui-7.png);
}

.a-guide:hover {
/*content: url(../img/ui-1-on.png);*/
background-image: url(../img/ui-1-on.png);
}

.a-percentage:hover {
/*content: url(../img/ui-2-on.png);*/
background-image: url(../img/ui-2-on.png);
}

.a-board:hover {
/*content: url(../img/ui-3-on.png);*/
background-image: url(../img/ui-3-on.png);
}

.a-prev:hover {
/*content: url(../img/ui-4-on.png);*/
background-image: url(../img/ui-4-on.png);
}

.a-next:hover {
/*content: url(../img/ui-5-on.png);*/
background-image: url(../img/ui-5-on.png);
}

.a-subtitle:hover {
/*content: url(../img/ui-6-on.png);*/
background-image: url(../img/ui-6-on.png);
}

.a-index:hover {
/*content: url(../img/ui-7-on.png);*/
background-image: url(../img/ui-7-on.png);
}

.jp-interface {
/*bottom:68px;*/
height:47px;
background-color:#000
}

.jp-video .jp-volume-controls {
right:10px;
top:0;
height:47px;
width:90px
}

.jp-volume-bar {
right:5px;
top:20px
}

.jp-video .jp-toggles {
right:110px;
margin-top:0;
top:0
}

.jp-play,.jp-repeat,.jp-full-screen,.jp-toggles button {
display:inline-block;
width:32px;
height:47px;
background-image:url(../img/sprite-2-s.png)
}

.jp-play {
background-position:0 0
}

.jp-play:focus,.jp-state-playing .jp-play,.jp-state-playing .jp-play:focus,.jp-full-screen:focus,.jp-state-full-screen .jp-full-screen,.jp-state-full-screen .jp-full-screen:focus,.jp-mute,.jp-mute:focus,.jp-state-muted .jp-mute,.jp-state-muted .jp-mute:focus,.jp-repeat:focus,.jp-state-looped .jp-repeat,.jp-state-looped .jp-repeat:focus {
background-image:url(../img/sprite-2-s.png)
}

.jp-play:focus {
background-position:0 0
}

.jp-state-playing .jp-play {
background-position:0 -47px
}

.jp-state-playing .jp-play:focus {
background-position:0 -47px
}

.jp-repeat,.jp-repeat:focus,.jp-state-looped .jp-repeat,.jp-state-looped .jp-repeat:focus {
background-position:-57px 0
}

.jp-full-screen {
background-position:-114px 0
}

.jp-full-screen:focus {
background-position:-114px 0
}

.jp-state-full-screen .jp-full-screen {
background-position:-114px -47px
}

.jp-state-full-screen .jp-full-screen:focus {
background-position:-114px -47px
}

.jp-controls {
position:absolute;
right:225px;
top:0
}

.jp-mute {
width:33px;
height:47px;
display:inline-block;
background-position:-148px 0
}

.jp-mute:focus {
background-position:-148px 0
}

.jp-state-muted .jp-mute {
background-position:-148px 0
}

.jp-state-muted .jp-mute:focus {
background-position:-148px 0
}

.jp-current-time,.jp-duration {
font-size:20px;
color:#fff;
position:absolute;
line-height:27px;
top:10px;
height:27px
}

.jp-duration {
right:300px
}

.jp-current-time {
right:388px;
border-right:2px solid #fff;
padding-right:20px
}

.c-content {
display:none;
position:absolute
}

.jp-video-full .jp-jplayer {
background-color:#000
}

.jp-video-full .jp-interface {
bottom:0
}

.c-content--guide {
left:0;
top:0;
right:0;
bottom:0;
background-image:url(../img/guide.png);
background-repeat:no-repeat;
background-position:center center;
-webkit-background-size: 100% 100%;
background-size: 100% 100%;
}

.c-content--next {
right:270px;
bottom:80px;
width:266px;
height:95px;
background-image:url(../img/try-next.png);
background-repeat: no-repeat;
}
.c-content--next.get_down{
  bottom: 68px
}

.js-close,.js-close-e,.js-close-l {
position:absolute;
right:30px;
top:30px;
width:27px;
height:29px;
/*content: url(../img/close.png);*/
background-image:url(../img/close.png);
background-repeat: no-repeat;
}
.js-close:hover,.js-close-e:hover,.js-close-l:hover {
/*content: url(../img/close-on.png);*/
background-image:url(../img/close-on.png);
}

.js-close-l {
position:absolute;
right:50%;
top:50%;
margin-right:-364px;
margin-top:-189px
}

.c-content--percentage {
left:20px;
bottom:115px;
/*width:551px;
height:538px;*/
width:585px;
height:570px;
background-image:url(../img/percentage.png);
line-height:1
}

.c-content--percentage h1 {
color:#80cdff;
font-size:30px;
font-size:1.875rem;
padding:48px 0 22px 75px
}

.c-content--percentage p {
font-size:23px;
font-size:1.4375rem;
color:#5bf;
padding-left:48px;
margin-bottom:15px
}

.c-content--percentage span {
color:#fff
}

.c-content--percentage table {
width:100%;
border-top:1px solid #71b3de
}

.c-content--percentage .c-table--wrap {
width:-webkit-calc(100% - 80px);
width:calc(100% - 80px);
margin:35px 55px 0 40px;
max-height:320px;
overflow-y:scroll
}

.c-content--percentage tr {
border-bottom:1px solid #71b3de
}

.c-content--percentage th,.c-content--percentage td {
height:50px;
line-height:50px;
color:#5bf;
font-weight:400;
width:20%;
text-align:center
}

.c-content--percentage th {
font-size:23px;
font-size:1.4375rem
}

.c-content--percentage td {
font-size:20px;
font-size:1.25rem
}

.c-content--percentage td:nth-child(2) {
width:60%;
color:#fff;
border-left:1px solid #71b3de;
border-right:1px solid #71b3de;
text-align:left;
padding-left:25px
}

.c-content--subtitle {
width:856px;
height:217px;
background-image:url(../img/subtitle.png);
left:50%;
bottom:115px;
-webkit-transform:translate(-50%,0);
-ms-transform:translate(-50%,0);
transform:translate(-50%,0)
}

.c-subtitle-wrap {
position:absolute;
left:40px;
top:70px;
line-height:1.4;
font-size:20px;
font-size:1.25rem;
color:#fff;
width:775px;
height:120px;
overflow-y:scroll
}

.u-mask-2,.u-mask,.u-test-bg {
background-color:#000;
opacity:.9;
left:0;
right:0;
top:0;
bottom:68px;
position:absolute;
display:none
}

.u-test-bg {
opacity:1;
background-color:none;
background-image:url(../img/test-bg.png);
bottom:68px;
}

.c-content--note,.c-content--index,.c-content--quiz,.c-content--test,.c-content--last,.c-content--test_result,.c-last--content {
width:1280px;
height:652px;
left:50%;
top:-webkit-calc(50% - 34px);
top:calc(50% - 34px);
-webkit-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);

}

.c-content--index {
background-image:url(../img/index.png)
}

.c-content--index td {
padding-bottom:30px
}

.c-content--index a,.c-content--index th {
line-height:1
}

.c-content--index a,
.c-content--index td {
color:#48b1f5;
font-size:25px;
font-size:1.5625rem;
text-decoration:none;
cursor: default;
}

/*.c-content--index a:hover {
  color: #fff
}*/

.c-content--index th {
font-size:36px;
font-size:2.25rem;
color:#80cdff;
font-weight:400;
padding-bottom:40px
}

.c-content--index table {
width:89%;
position:absolute;
top:50%;
left:50%;
-webkit-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
transform:translate(-50%,-50%)
}

.c-content--index .index-cover-2 {
width:89%;
position:absolute;
top:47%;
left:50%;
-webkit-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
transform:translate(-50%,-50%)
}


.c-content--index .js-close {
width:11%;
height:12.5%;
left:50%;
top:83.5%;
-webkit-transform:translate(-50%,0);
-ms-transform:translate(-50%,0);
transform:translate(-50%,0);
content: none;
background-image: none;
}

.c-content--quiz p,.c-content--note h1 {
font-size:30px;
font-size:1.875rem;
color:#101010;
line-height:1.2;
margin-top:180px;
text-align:center
}

.c-content--note h1{
  height: 144px;
}

.c-content--quiz {
background-image:url(../img/quiz.png)
}

.c-content--note.is-saved {
background-image:url(../img/note-2.png)
}

.c-content--note {
background-image:url(../img/note-1.png)
}

.c-content--note a {
position:absolute;
}

.c-content--note textarea {
color:#000;
width:750px;
display:block;
margin:74px auto 0;
line-height:1.6;
font-size:26px;
font-size:1.625rem;
background:transparent;
border:none;
height:170px
}

.c-content--note img {
bottom:0;
left:50%;
-webkit-transform:translate(-50%,0);
-ms-transform:translate(-50%,0);
transform:translate(-50%,0);
position:absolute;
display:none
}

.c-content--expert {
width:882px;
height:470px;
left:50%;
top:50%;
-webkit-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
background-image:url(../img/expert.png)
}

.c-content--expert p {
margin:120px 20px 0;
line-height:1.6;
font-size:23px;
font-size:1.4375rem;
color:#101010;
height:300px;
overflow-y:scroll
}

.c-content--test {
background-image:url(../img/test-new.png)
}

.test-1 {
width:278px;
height:249px;
line-height:238px;
padding-left:90px;
left:0;
top:110px;
position:absolute;
color:#005065;
font-size:100px;
font-size:6.25rem;
background-image:url(../img/test-1.png)
}



.test-1.is-x {
background-image:url(../img/test-x.png)
}

.test-1.is-x span {
display:none
}

.test-1.is-o,.test-1.is-x.is-o {
background-image:url(../img/test-o.png)
}

.test-1.is-o span,.test-1.is-x.is-o span {
display:none
}

.test-2 {
width:154px;
height:154px;
left:128px;
top:338px;
position:absolute;
background-image:url(../img/test-2.png)
}

.test-2:hover {
background-image:url(../img/test-2-on.png)
}

.test-3,.test-6 {
position:absolute;
left:50%;
bottom:80px;
-webkit-transform:translate(-50%,0);
-ms-transform:translate(-50%,0);
transform:translate(-50%,0);
display:none
}

.test-4 {
width:84px;
height:90px;
right:56px;
top:275px;
position:absolute;
background-image:url(../img/test-4.png);
display:none
}

.test-5 {
width:859px;
height:121px;
left:278px;
bottom:50px;
position:absolute;
background-image:url(../img/test-5.png);
display:none
}

.test-5 span {
font-size:106px;
font-size:6.625rem;
position:absolute;
left:90px;
color:#62DFE3;
top:0;
height:121px;
line-height:1
}

.test-5 p {
color:#fff;
font-size:20px;
font-size:1.25rem;
line-height:1.3;
position:absolute;
left:235px;
top:8px;
width:550px;
height:105px;
overflow-y:scroll
}

.test-choose-one {
font-size:23px;
font-size:1.4375rem;
line-height:1.2;
color:#2F3237;
margin-left:310px;
margin-top:190px;
width:780px
}

.test-choose-one li {
margin-bottom:14px;
cursor:pointer;
padding-left:70px;
position:relative
}

.test-choose-one li:before {
content:'1';
color:#000;
font-size:43px;
font-size:2.6875rem;
position:absolute;
left:0;
top:5px;
width:54px;
height:41px;
line-height:32px;
padding-left:14px;
background-image:url(../img/test-off.png)
}

.test-choose-one li:nth-child(2):before {
content:'2'
}

.test-choose-one li:nth-child(3):before {
content:'3'
}

.test-choose-one li:nth-child(4):before {
content:'4'
}

.test-choose-one li.is-clicked:before {
color:#80cdff;
background-image:url(../img/test-on.png)
}

.c-content--test h1{
  position: absolute;
  color: #02809C;
  font-size: 27.5px;
  font-weight: normal;
  left: 310px;
  top: 115px
}

.c-content--test--long {
  position: absolute;
  color: #02809C;
  font-size: 24.5px;
  font-weight: normal;
  line-height: 100%;
  left: 310px;
  top: 112px
}

.c-content--test_result {
background-image:url(../img/test-r.png)
}

.c-content--test_result ul {
position:absolute;
left:50%;
top:259px;
-webkit-transform:translate(-50%,0);
-ms-transform:translate(-50%,0);
transform:translate(-50%,0);
overflow:hidden
}

.c-content--test_result li {
width:120px;
height:144px;
float:left;
margin:0 20px;
background-image:url(../img/test-r-x.png)
}

.c-content--test_result li.is-o {
background-image:url(../img/test-r-o.png)
}

.test-q {
font-size:54px;
font-size:3.375rem;
color:#fff;
position:absolute;
left:560px;
top:150px
}

.c-content--last {
background-image:url(../img/last.png);
color:#055469
}

.c-content--last h1 {
font-size:46px;
color:#055469;
position:absolute;
top:50%;
/*margin-top: -30px;*/
line-height: 1.2;
transform: translateY(-50%);
text-align:center;
width:100%
}

.c-content--last li {
font-size:23px;
color:#000;
font-size:1.4375rem;
line-height:1.2;
position:absolute;
top:233px
}

.c-content--last li:nth-child(odd) {
left:245px
}

.c-content--last li:nth-child(odd) a {
left:-4px
}

.c-content--last li:nth-child(even) {
right:245px;
text-align:right
}

.c-content--last li:nth-child(even) a {
right:-4px
}

.c-content--last li:nth-child(n+3) {
top:437px
}

.c-content--last a {
position:absolute;
width:92px;
height:27px;
top:-38px;
/*content: url(../img/i-open.png)*/
background-image:url(../img/i-open.png);
}

.c-content--last a:hover {
/*content: url(../img/i-open-on.png)*/
background-image:url(../img/i-open-on.png);
}

.c-last--content {
background-image:url(../img/last-1.png)
}

.c-last--content h1 {
position:absolute;
left:285px;
color:#055469
}

.c-last--content div{
  position:absolute;
  left:285px;
  top:240px;
  width: 723px;
      height: 300px;
    overflow-y: auto;
}

.c-last--content h1 {
top:125px
}

.c-last--content h1 span:nth-child(1) {
font-size:67px;
font-size:4.1875rem
}

.c-last--content h1 span:nth-child(2) {
font-size:33px;
font-size:2.0625rem;
line-height:3.5;
padding-left:10px
}

.c-last--content h2 {
/*top:240px;*/
font-size:26px;
font-size:1.625rem;
color:#67b6cc;
background-color:#0e3a5c;
display:inline-block;
padding:0 5px;
margin-bottom: 8px;
}

.c-last--content p {
/*top:300px;*/
color:#000;
line-height:1.4;
font-size:23px;
font-size:1.4375rem;
margin-bottom: 12px;
}

.js-save {
left:0;
top:305px;
/*content: url(../img/js-save.png);*/
background-image: url(../img/js-save.png);
width: 183px;
height: 253px;
}

.js-see-1,.js-see-2 {
right:0;
top:221px;
/*content: url(../img/js-see-1.png);*/
background-image: url(../img/js-see-1.png);
width: 202px;
height: 221px;
}

.js-see-2 {
top:412px;
/*content: url(../img/js-see-2.png);*/
background-image: url(../img/js-see-2.png);
width: 222px;
height: 195px;
}

.js-save:hover {
/*content: url(../img/js-save-on.png);*/
background-image: url(../img/js-save-on.png);
}

.js-see-1:hover {
/*content: url(../img/js-see-1-on.png);*/
background-image: url(../img/js-see-1-on.png);
}

.js-see-2:hover {
/*content: url(../img/js-see-2-on.png);*/
background-image: url(../img/js-see-2-on.png);
}

.quiz-ox {
width:185px;
height:117px;
position:absolute;
top:352px
}

.quiz-o {
right:50%;
margin-right: 7px;
/*content: url(../img/quiz-o.png)*/
background-image: url(../img/quiz-o.png);
}

.quiz-x {
left:50%;
margin-left: 1px;
/*content: url(../img/quiz-x.png)*/
background-image: url(../img/quiz-x.png);
}

.quiz-o:hover {
/*content: url(../img/quiz-o-on.png)*/
background-image: url(../img/quiz-o-on.png);
}

.quiz-x:hover {
/*content: url(../img/quiz-x-on.png)*/
background-image: url(../img/quiz-x-on.png);
}

#jp_container_2 {
display:none
}

.jp-video .jp-progress{
  background-color: #000;
  width: 50%;
  height: 47px;
}

.jp-seek-bar{
  background: none;
  width: 100% !important;
}

.jp-play-bar{
  background: none;
  background-color: #51b5f3;
  /*width: 100% !important;*/
}


/* z-index */
.c-ui {
z-index:1002
}

.u-test-bg {
z-index:1003
}

/*.u-mask-2, .u-mask, .u-test-bg*/

.c-content--note,
.c-content--quiz,
.c-content--test,
.c-content--last,
.c-content--test_result,
.c-last--content {
z-index:1004
}

.u-mask-2{
  z-index:8000;
}

.c-content--quiz.c-content--quiz,
.c-content--note.c-content--note,
.c-content--expert.c-content--expert,
.c-content--last.c-content--last,
.c-last--content.c-last--content,
.c-content--test.c-content--test,
.c-content--test_result.c-content--test_result{
  z-index:9000
}

.u-mask{
  z-index:99999;
}
.c-content {
  z-index:100000;
}




/*
.c-content--test {
z-index:1004;
}*/


.mp3{
  display: none;
  position: fixed;
  left: -8000em;
  top: -8000em;
}

.jump_to{
  cursor: pointer;
}



/*
c-new--
*/
.c-new--hide{
  position: fixed;
  left: -8000em;
  top: -8000em;
  visibility: hidden;
}

@keyframes go_down {
    from {top: -90px;}
    to {top: 10px;}
}

.c-index--add{
  position: fixed;
  left: 50%;
  margin-left: -200px;
  top: 10px;
  text-align: center;
  width: 400px;
  background-color: #fff;
  padding: 20px 0 16px;
  border-radius: 100px;
  opacity: .7;
  animation-name: go_down;
  animation-duration: 1s;
}
.c-index--add a{
  color: #fff;
  display: inline-block;
  padding: 5px;
  font-size: 14px;
  text-decoration: none;
  margin: 0 5px;
  background-color: #888;
  border-radius: 5px;
  width: 60px
}
.c-index--add p{
  color: #000;
  margin-bottom: 10px;
  font-size: 18px;
}

.c-index--add a:hover{
  text-decoration: underline;
  color: #fff;
  background-color: #48b1f5;
}


.cover-next{
  height: 68px;
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 180px;
}
.progress-cover{
  height: 47px;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.jp-progress{
  position: relative;
}
.remove-cover .cover-next,
.remove-cover .progress-cover{
  display: none;
}

.index-cover-2{
  position: relative;
}
/*.c-content--index table tr:last-child td:last-child,
.cover-index*/
.index-cover-2 div{
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
/*.c-content--index table a{
  cursor: default;
}*/

.jp-seek-bar{
  background-color: #444;
}
.jp-video .jp-progress{
  width: 50%;
  /*30으로*/
}
.jp-video .jp-volume-controls{
  right: 0;
}
.jp-video .jp-toggles{
  right: 256px;
}
.jp-full-screen{
  margin-left: 5px;
}
.jp-controls{
  right: 358px
}
.jp-duration{
  right: 395px;
}
.jp-current-time{
  right: 460px;
  padding-right: 10px;
}

.jp-gui:hover{
  display: block !important
}
.go_1,
.go_15,
.go_2,
.go_25{
  position: absolute;
  top: 0;
  width: 37px;
  height: 37px;
  display: inline-block;
  margin: 5px;
  border: 3px solid #fff;
  color: #fff;
  text-align: center;
  line-height: 29px;
  border-radius: 50%;
  font-size: 13px;
  cursor: pointer;
  z-index: 10;
}
.go_1:hover,.go_1.js-on,
.go_2:hover,.go_2.js-on,
.go_15:hover,.go_15.js-on,
.go_25:hover,.go_25.js-on{
  color: #51b5f3;
  border-color: #51b5f3;
}


.go_1{
  right: 240px;
}
.go_15{
  right: 190px;
}
.go_2{
  right: 140px;
}
.go_25{
  right: 90px;
}


.jp-video{
  padding-bottom: 68px;
  /*height: 720px;*/
  min-width: 800px;
}
.jp-video.u-hide{
  /*height: auto;*/
}


/*.c-ui{
  display: none;
}*/
/*.c-ui.js-reveal{
  display: block;
}*/

@media (max-width: 1200px) {

.c-content--note{
  transform: translate(-50%,-50%) scale(.9);
  transform-origin: center;
}

}

@media (max-width: 1100px) {

.c-content--note{
  transform: translate(-50%,-50%) scale(.8);
  transform-origin: center;
}

}

@media (max-width: 1000px) {

.c-content--note{
  transform: translate(-50%,-50%) scale(.7);
  transform-origin: center;
}

}

@media (max-width: 900px) {

.c-content--note{
  transform: translate(-50%,-50%) scale(.6);
  transform-origin: center;
}

}


@media (max-width: 1279px) {
  .c-content--quiz{
    transform: translate(-50%,-50%) scale(.9);
    transform-origin: center bottom;
  }
  .c-content--last{
    transform: translate(-50%,-50%) scale(.85);
  }
  .c-last--content{
   transform: translate(-50%,-50%) scale(.85); 
  }
  .c-content--test{
   transform: translate(-50%,-50%) scale(.8); 
  }
  .c-content--test_result{
   transform: translate(-50%,-50%) scale(.85);  
  }
  .c-content--index{
    transform: translate(-50%,-50%) scale(.75);
  }
}

@media (max-width: 1159px) {
  .c-content--quiz{
    transform: translate(-50%,-50%) scale(.8);
    transform-origin: center bottom;
  }
  .c-content--last{
    transform: translate(-50%,-50%) scale(.7);
  }
  .c-last--content{
   transform: translate(-50%,-50%) scale(.7); 
  }
  .c-content--test{
   transform: translate(-50%,-50%) scale(.64); 
  }
  .c-content--test_result{
   transform: translate(-50%,-50%) scale(.7);  
  }
  .c-content--index{
    transform: translate(-50%,-50%) scale(.6);
  }
}


@media (max-width: 1279px) {

.jp-video .jp-progress{
  width: 33%;
}

/*.c-content--guide{
  transform: scale(.95);
  transform-origin: center top
}*/
.c-content--percentage{
  transform: scale(.6); 
  transform-origin: left bottom
}
.c-content--subtitle{
  transform: scale(.8); 
  transform-origin: center bottom;
  left: 0
}




}



.js-super .cover-next,
.js-super .progress-cover,
.js-super .c-content--index table tr:last-child td:last-child{
  display: none !important;
}




.js-board{
  position: absolute;
  left: -8000em;
  top: -8000em;
}




.progress-cover,
.cover-next{
  display: none !important;
}

.progress-cover{
	display: block !important;
}

.c-ui > i {
  height:68px;
  display:inline-block;
  position:absolute;
  bottom:0;
  padding: 0;
  /*background-image:url(../img/sprite-1-s.png)*/
}

.c-index--add i{
  color: #fff;
  display: inline-block;
  padding: 5px;
  font-size: 14px;
  text-decoration: none;
  margin: 0 5px;
  background-color: #888;
  border-radius: 5px;
  width: 60px
}

.c-index--add i:hover{
  text-decoration: underline;
  color: #fff;
  background-color: #48b1f5;
}

.c-content--note i {
  position:absolute;
  display: inline-block;
}

.c-content--last i {
  position:absolute;
  width:92px;
  height:27px;
  top:-38px;
  /*content: url(../img/i-open.png)*/
  background-image:url(../img/i-open.png);
  }
  
  .c-content--last i:hover {
  /*content: url(../img/i-open-on.png)*/
  background-image:url(../img/i-open-on.png);
  }

  .c-content--last li:nth-child(odd) i {
    left:-4px
    }
    
    
    .c-content--last li:nth-child(even) i {
    right:-4px
    }