@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
@import url('https://fonts.googleapis.com/css?family=Black+Ops+One');
@import url(https://cdn.rawgit.com/kattergil/NotoSerifKR-Web/76eb9ebf/stylesheet/NotoSerif-Web.css);

/*@import url(iconfont/material-icons.css);*/
.contents {
  font-family: 'Noto Sans', 'Noto Sans KR', sans-serif;
}

section.item {
  padding: 1em;
  margin: 0 auto;
  position: relative;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
  background: #fff;
  max-width: 800px;
  transition: .25s;
  border-top: 1px rgba(0, 0, 0, .12) solid;
  z-index: 1;
}

section.item:hover {
  box-shadow: 0 2px 10px rgb(0 0 0 / 25%);
  z-index: 2;
}

section.item:first-of-type, section.item.on+section.item {
  border-radius: .25em .25em 0 0;
}

section.item:last-of-type {
  border-radius: 0 0 .25em .25em;
}

section.item>h3>a {
  display: flex;
  color: inherit;
}

section.item>h3>a span {
  flex: auto;
}

section.item>h3>a .operation_plan.no {
  max-width: 10em;
}

section>h3 {
  margin: 0;
}

section.on {
  margin: 2em auto;
  padding: 2em 0;
  max-width: 1080px;
  width: calc(100% - 4em);
  border-radius: .5em;
  padding: 2em;
}

section.on .operation_plan.title {
  opacity: 0;
}

section.on .title, section.on .no {
  font-size: .8em;
}

.translation {
  /* color: rgba(0, 0, 0, .38); */
  opacity: .65;
  font-size: .75em;
  font-style: italic;
  font-family: 'Noto Sans KR', sans-serif;
}

#sub_header .translation, #tooltip .translation, section.on h4 .translation, section.on h5 .translation, .tip .translation, .caution .translation, .warning .translation {
  color: #fff;
}

.not_printed {
  display: none;
}

section.on .not_printed {
  display: inherit;
}

.tip, .caution, .warning {
  /* line-height: 1; */
  padding: 6px 8px 6px 10px;
  border-left: 6px solid #36c;
}

.tip:before {
  font-weight: bold;
  content: "💡 ";
}

.tip {
  background-color: #e5ecf9;
  border-left: 6px solid #36c;
}

.caution:before {
  font-weight: bold;
  content: "🚨 ";
}

.caution {
  background-color: #fffbd9;
  border-left: 6px solid #ffef70;
}

.warning:before {
  font-weight: bold;
  content: "⛔ ";
}

.warning {
  background-color: #f9e5ec;
  border-left: 6px solid #c36;
}

.deprecated:after {
  font-size: .85em;
  margin: -.5em -3em 0;
  /* padding: 0.5em 1em; */
  position: absolute;
  white-space: nowrap;
  transform: rotate(-5deg);
  content: "!DEPRECATED";
  /* background: #D32F2F; */
  color: #D32F2F;
  border: 3px solid #D32F2F;
  border-width: 3px 0 3px 0;
  /* border-radius: 3px; */
  /* box-shadow: 0 2px 5px rgba(0, 0, 0, .25); */
  transform-origin: 0 50%;
  display: inline-block;
  transition: .25s;
}

code, .prettyprint {
  background: #f0f0f0;
  border: 1px solid #888;
}

pre.prettyprint {
  padding: 1em 1.25em !important;
}

code.prettyprint {
  padding: .25em .5em;
}

.contents {
  line-height: 1.75;
  font-size: 14px;
  counter-reset: sop;
}

.contents [data-title] {
  background: #FFFF8D;
}

.contents img {
  max-width: 100%;
  margin: 0 auto .5em;
  display: block;
}

.contents h1, .contents h2, .contents h3 {
  /* margin: inherit; */
  color: rgba(0, 0, 0, .8);
}

.contents h1 {
  font-size: 1.75em;
  text-align: center;
}

.contents h2 {
  counter-reset: sop2;
}

.contents h2:not(.table_of_contents)::before {
  counter-increment: sop;
  content: counter(sop) ". ";
}

.contents h3 {
  counter-reset: sop3;
}

.contents h3::before {
  counter-increment: sop;
  counter-increment: sop2;
  content: counter(sop)"."counter(sop2) ". ";
}

.contents h4::before {
  counter-increment: sop;
  counter-increment: sop2;
  counter-increment: sop3;
  content: counter(sop)"."counter(sop2)"."counter(sop3) ". ";
}

section .contents .img {
  display: flex;
  overflow: hidden;
  margin: 0 !important
}

.contents .img>div {
  flex: 1;
}

.contents .img:first-child>div:first-child>img {
  border-top-left-radius: 3px
}

.contents .img:first-child>div:last-child>img {
  border-top-right-radius: 3px
}

.contents .img:last-child>div:first-child>img {
  border-bottom-left-radius: 3px
}

.contents .img:last-child>div:last-child>img {
  border-bottom-right-radius: 3px
}

.contents ul li,
.contents ol li {
  padding: .25em 0;
  line-height: 1.6;
}

.contents ul li ol,
.contents ol li ol {
  padding-top: .25em;
}

.contents table {
  width: 100%;
  border-spacing: 0;
  border-bottom: 1px solid rgba(0, 0, 0, .12);
}

.contents table tr td, section table tr th {
  border-top: 1px rgba(0, 0, 0, .12) solid;
  padding: .5em 1em;
}

.contents hr {
  border: none;
  border-top: 1px rgba(0, 0, 0, .12) solid;
}

h2+section {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  /*background: gold;*/
}

.contents *[data-title] {
  /*background: gold;*/
  /*text-decoration: underline;
  font-weight: bold;*/
}

.contents ol>li>ol {
  list-style-type: hangul;
}

.contents ol>li>ol>li>ol {
  margin-left: -2em;
  list-style-type: none;
  counter-reset: part;
}

.contents ol>li>ol>li>ol>li:before {
  counter-increment: part;
  content: counter(part, decimal) ") ";
}

.contents dl {
  border-bottom: 1px solid #eee;
}

.contents dl:last-of-type {
  border-bottom: none;
}

.contents dt {
  font-weight: bold;
  margin: .5em 0;
}

.contents dd {
  margin: 0 0 1em 1em;
}

.contents .center {
  text-align: center;
}

.contents input:not([type="checkbox"]) {
  border: none;
  border-bottom: 3px solid black;
  margin-bottom: -5px;
  padding: 3px 5px;
  margin: 0 .5em -5px;
  width: 5em;
  transition: .25s;
}

.contents textarea {
  font-size: 14px;
  border: 3px solid black;
  padding: 3px 5px;
  font-family: inherit;
}

.contents button {
  color: rgba(255, 255, 255, .85);
  background: rgb(3, 169, 244);
  border: none;
  padding: .5em;
  line-height: 1;
  border-radius: 3px;
  font-weight: bold;
  margin: -10px 0;
}

.contents .icon {
  display: inline !important;
  margin: 0 .5ex -6px 0px !important;
  height: 26px;
}

.contents a[file]::before, .contents a[href]::before, .contents a[src]::before, .contents a[onclick]::before {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  content: "announcement";
  vertical-align: middle;
  font-size: 24px;
  /*margin-right: .5em;*/
  margin: -12px 0 -8px 0;
  line-height: 1;
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: 'liga';
}

.contents a[href]::before {
  content: "open_in_new";
}

.contents a[href^="#"]::before {
  content: "find_in_page";
}

.contents a[file]::before {
  content: "insert_drive_file";
}

.contents a[src]::before {
  content: "image";
}

.contents a[onclick]::before {
  content: "movie";
}

.censored,
.spoiler {
  color: transparent !important;
  background: #000;
  cursor: not-allowed;
}

.censored::selection,
.spoiler::selection {
  color: transparent !important;
  background: #000;
  cursor: not-allowed;
}

.censored:after {
  font-size: .85em;
  margin: -.5em -3em 0;
  /* padding: 0.5em 1em; */
  position: absolute;
  white-space: nowrap;
  transform: rotate(-5deg);
  content: "!CENSORED!";
  /* background: #D32F2F; */
  color: #D32F2F;
  border: 3px solid #D32F2F;
  border-width: 3px 0 3px 0;
  /* border-radius: 3px; */
  /* box-shadow: 0 2px 5px rgba(0, 0, 0, .25); */
  transform-origin: 0 50%;
  display: inline-block;
  transition: .25s;
}

.contents object[type="application/pdf"] {
  margin-top: 1em;
  width: 100%;
  height: 30em;
}

section .contents object[type="application/pdf"] {
  margin-top: 1em;
  width: calc(100% + 4em);
  height: 45em;
  margin-left: -2em;
}