html
{
  overflow: hidden;
  min-width: 1010px;
}

nav#top-nav
{
  z-index: 1;
  max-height: 0px;
  display: flex;
  justify-content: right;
}

nav#top-nav .column
{
  top: 0;
  /* position: absolute; */
}
/* 
nav#top-nav .column:first-child
{
  left: 0;
}

nav#top-nav .column:nth-child(2)
{
  right: 0;
} */

body
{
/* background: transparent url('../images/bg_2.png') no-repeat 0 0;*/
 background-color: #380B61; /*ececfc; f0d3cc */
  background-size: cover;
  overflow: auto;
  
}

#course-title
{
 /* background: transparent url('../images/course_title3.png') no-repeat 0 0;
  width: 400px;
  height: 62px;
  text-indent: -9999em;
  margin-top: 5px;
  margin-right: 5px ;
 left: calc(50% - 505px);
   margin-right: 0.75em;
  margin-top: 0.75em; */

   z-index: 100;
  margin-top: 20px;
  margin-right:10px ;
 width: 350px;
  font-weight: 300;
  height: 32px;

}


#chapter-title
{

  z-index: 101;
  display: none;
  margin-top: 5px;
  margin-left: 5px;
 /* left: calc(50% - 501px);
 / top: calc(50% - 300px);*/
  font-family: 'GyeonggiTitle';
  font-size: 21px;
  font-weight: 300;
  line-height: 57px;
  text-shadow: #fff 0px 0px 0px;

 color: #e86430 !important;
  padding: 0 5px;
  
}

#chapter-title div
{
  width: 350px;
  height: 62px;
}

#chapter-title div#chap-title
{
  background-position: 0 0;
  display: block;
}


#trans
{
  z-index: 100;
  margin-top: 21px;
  margin-left: 6px;
 
}
#trans div
{
  width: 31px;
  height: 25px;
 display: block;
 background: #e86430;
  opacity : 0.8;

/* background: transparent url(../images/trans.png) no-repeat 0 0; 
 background: red;*/
}

#trans div#next-trans
{
  background-position: 0 0px;
    display: block;

}

span.subj_number { color: #fff;  text-shadow: #9e380f 0px 0px 5px;}
span.c_title{ color: #fff !important;  font-family: 'CTitle'; text-shadow :0 0 2px #7a4430, 0 0 2px #7a4430, 0 0 2px #7a4430, 0 0 2px #7a4430, 0 0 2px #7a4430, 0 0 2px #7a4430, 0 0 2px #7a4430; font-size: 23px;  padding : 0 30px;}
/*span.c_title{ color: #fff !important;  font-family: 'CTitle'; text-shadow :0 0 2px #000, 0 0 2px #000, 0 0 2px #000, 0 0 2px #000, 0 0 2px #000, 0 0 2px #000, 0 0 2px #000; font-size: 22px;  padding : 0 30px;}*/
#video
{
  width: 1010px;
  height: 550px;

}

#video video
{
  /* width: 1010px;
  height: 568px; */
}

#section-img
{
  /* left: calc(50% - 505px); */
  display: none; /*임시삭제*/
  left: 12px;
  top: 15px;
  height: 34px;
  z-index: 100;
}

#script
{
  display: none;
  width: 1000px;
  height: 140px;
  padding: 0.25em 0;
  background-color: rgba(0, 0, 0, 0.8);
  font-family: 'NotoSans', '맑은 고딕', '돋움', sans-serif;
  font-size: 1em;
  left: calc(50% - 500px);
  top: calc(100% - 180px);
  overflow-y: auto;
}

#script p
{
  color: #fff;
  padding: 0.25em 1em;
  font-size: 0.95em;
}

#index
{
 overflow: hidden;
  display: none;
  width: 1000px;
  height: 190px;
  background-color: rgba(0, 0, 0, 0.8);
  font-family: 'GyeonggiTitle';
  font-size: 1em;
  left: calc(50% - 500px);
  top: calc(100% - 230px);
}
#index .module
{
  float: left;
  height: 180px;
  margin: 5px 0;
}

#index .module p
{
  color: #fadd4c;
  font-size: 1.5em;
  text-align: center;
}

#index .module ul
{
  padding: 0 20px;
  margin-top: 0.5em;
}

#index .module ul li
{
  color: #fff;
  padding: 0.2em;
  cursor: pointer;
}

#index .module ul li:hover, #index .module ul li.active
{
  color: #ff98ff;
}

#index .module ul li::before
{
  content: '⊙ ';
}

#index #module_2.module ul li::before
{
  content: '';
}

#index #module_1
{
  width: 250px;
  border-right: 2px solid rgba(255, 255, 255, 0.8);
}

#index #module_2
{
  width: 500px;
  border-right: 2px solid rgba(255, 255, 255, 0.8);
}

#index #module_3
{
  width: 250px;
}

#notice
{
  display: none;
  left: calc(50% + 425px);
/*  top: calc(100% - 65px);*/
  top: calc(50% + 327px); 
}
#notice div
{
  width: 70px;
  height: 28px;
  background: transparent url(../images/notice.png) no-repeat 0 0;
}

#notice div#next-notice
{
  background-position: 0 0;
  display: none;
}

#notice div#end-notice
{
  background-position: -70px 0;
  display: none;
}

/* .columns:not(:last-child)
{
  margin-bottom: 0;
} */

.hidden_sound
{
  display: none;
}

/* Utils */
.bgc-transparent
{
  background-color: transparent;
}

.modal.is-active
{
  z-index: 9999;
}

section.columns.is-fullhd.is-vcentered.is-centered.is-overlay.is-marginless
{
  display: flex;
  overflow: hidden;
  /* display: none; */
}


.ta-right {
  text-align: right;
}

blockquote, body, dd, dl, dt, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, html, iframe, legend, li, ol, p, pre, textarea, ul
{
  word-break: keep-all;
}

ul.exam
{
  border: 1px solid #ccc;
  background-color: rgba(0, 0, 0, 0.1);
  font-size: 0.7em;
  color: #333;
  border-radius: 10px;
  margin: 0.5em;
}

ul.exam li
{
  font-size: 0.7em;
  line-height: 1.6em;
  padding: 0 1em;
}

#assessment ul.exam
{
  font-size: 1.2em;
  padding: 0.5em 0;
}

#modal-reading .modal-content .box ul > li.not-bullet {
  text-indent: 0;
  margin-left: 0;
  margin-top: 0;
  margin-bottom: 0;
}

#modal-reading section.page ul li.not-bullet::before {
  content: '' !important;
  margin-right: 0px !important;
}

#modal-reading .modal-content .box ul > li > p, #modal-reading .modal-content .box ul > li.not-bullet > p
{
  font-size: 1em;
  color: #4a4a4a;
  margin-top: 0;
}

#modal-reading .modal-content .box p.referer
{
  font-size: 0.9em;
  text-indent: 0;
  width: 100%;
  color: #333;
  word-break: break-all;
  text-decoration: underline;
  margin-top: 2em !important;
}

.indent-0em
{
  text-indent: 0em !important;
}

.indent-1em
{
  text-indent: 1em;
}

.indent-2em
{
  text-indent: 2em;
}

.ml-1em
{
  margin-left: 1em;
}

.ml-2em
{
  margin-left: 2em;
}

.mb-1em
{
  margin-bottom: 1em !important;
}

.mt-1em
{
  margin-top: 1em !important;
}

#map
{
  background: transparent url(../images/learningmap_bg.png) no-repeat 0 0;
  position: absolute;
  width: 1010px;
  height: 810px;
  left: calc(50% - 505px);
  top: calc(50% - 284px);
  overflow: hidden;
  display: none;
  padding: 34px 0 0 0;
}

#map .map-left
{
  margin-left: 130px;
}

#map .map-left, #map .map-right
{
  float: left;
  width: 440px;
  padding: 20px 35px 0 35px;
}

#map h3
{
  background-color: #a88abe;
  border-radius: 10px;
  color: #fff;
  font-weight: normal;
  font-size: 18px;
  font-family: 'GyeonggiTitle';
  text-align: center;
  margin: 4px 0 2px 0;
}

#map h3.active
{
  font-weight: bold;
  color: #fcff26;
}

#map ul li
{
  font-family: 'GyeonggiTitle';
  font-size: 16px;
  color: #4e4e4e;
  text-indent: 1em;
}

#map ul li.active
{
  color: #dd496b;
}

#map button#map-close
{
  position: absolute;
  right: 0;
  background: transparent url(../images/popclose.png) no-repeat 0 0;
  width: 40px;
  height: 40px;
  border: none;
  text-indent: -9999em;
  cursor: pointer;
}

#map button#map-close:hover
{
  background-position: 0 -40px;
}

button:focus {
  outline: none;
}