@charset "utf-8";
/* Copy NGUYEN VAN tu app/kisaragieki/css/layout.css (ban HTML cu) — khong sua selector,
   de trang /kisaragieki/** giu y het giao dien goc.
   Trang nay dung layout rieng (layouts/kisaragieki.vue), khong co header/footer
   cua site chinh, nen CSS toan cuc o day khong anh huong cac trang khac. */
/* reset
==================================*/
  html, body, div, span, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	abbr, address, cite, code,
	del, dfn, em, img, ins, kbd, q, samp,
	small, strong, sub, sup, var,
	b, i,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, figcaption, figure,
	footer, header, hgroup, menu, nav, section, summary,
	time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
	}
	body,form,fieldset {
		margin: 0;
		padding:0;
	  -webkit-text-size-adjust: none;
	}
	fieldset {
		border:none;
	}
	blockquote,li,dt,dd {
		margin:0;
		padding:0;
	}
	li {
		list-style:none;
	}
	input, textarea, select {
		font-size:1em;
	}
	img {
		margin:0px;
		padding:0px;
		border: 0px;
		vertical-align:bottom;
	}
	table {
	  border-collapse:collapse;
	}
	button{
		background-color: transparent;
		border: none;
		cursor: pointer;
		outline: none;
		padding: 0;
		appearance: none;
	}

/* font
==================================*/
input, textarea, select {
		font-style:normal;
		font-family: YakuHanMP_Noto, "Noto Serif JP", 'ヒラギノ明朝 ProN','Hiragino Mincho ProN', 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ＭＳ 明朝', 'MS Mincho', serif;
		font-weight: 400;
	}
	body {
		color:#000;
		background-color:#fff;
		font-family: YakuHanMP_Noto, "Noto Serif JP", 'ヒラギノ明朝 ProN','Hiragino Mincho ProN', 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ＭＳ 明朝', 'MS Mincho', serif;
		font-weight: 400;
		line-height: 1;
		letter-spacing: 0.03em;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

/* float, clear
==================================*/
	.cf { zoom:1; }
	.cf:before, .cf:after { content:""; display:table; }
	.cf:after { clear:both; }
	.clear { clear: both;	visibility: visible; }
	@media print{
		body{
			_zoom: 70%;
			background: none;
		}
		img.hover {
			display:none;
		}
	}

/* =============================================================================
   Bo sung khi migrate sang Nuxt — GIU FONT GIONG HET BAN GOC.

   Van de: Nuxt nap entry.css (chua global.css cua site chinh) SAU cac file css nay.
   Trong do co `body{font-family:var(--font-sans);line-height:1.8;color:...}` — font
   GOTHIC cua site chinh. Selector deu la `body` (cung do uu tien) nen file nao nap
   sau se thang => font goc (MINH CHO) bi de len.

   Cach xu ly: lap lai dung khai bao cua ban goc voi do uu tien CAO HON bang
   `html body` (0,0,2 > 0,0,1) — khong dung !important de component van override duoc.
   Gia tri ben duoi COPY Y NGUYEN tu khoi `body{}` o tren (khong doi gi).
   ============================================================================= */
html body {
  color: #000;
  background-color: #fff;
  font-family: YakuHanMP_Noto, "Noto Serif JP", 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', 'ＭＳ 明朝', 'MS Mincho', serif;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.03em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* =============================================================================
   Bo sung khi migrate sang Nuxt — TRA IMG/VIDEO VE MAC DINH TRINH DUYET.

   Van de (lech so voi web cu): Nuxt dung Tailwind, preflight cua no co rule
       audio,canvas,embed,iframe,img,object,svg,video{vertical-align:middle;display:block}
   nap SAU css cua trang. Hai thay doi nay khong co o web cu:

   1) display: inline -> block. Voi phan tu INLINE, margin cua no KHONG "collapse"
      (khong gop) voi margin cua block cha. Khi bi doi thanh BLOCK thi margin-bottom
      cua con CUOI gop voi margin-bottom cua cha => chi con 1 cai.
      Vi du dung nhu da phat hien: .movies{margin-bottom:50px} + .movies video{margin-bottom:50px}
      -> web cu = 100px, ban Nuxt bi gop = 50px.

   2) vertical-align: bottom -> middle: anh inline bi day len ~vai px, sinh khe ho
      duoi anh (layout.css goc co dat 'vertical-align: bottom' nhung bi preflight de len).

   Cach xu ly: lap lai gia tri MAC DINH cua trinh duyet (dung nhu web cu). Preflight dung
   selector 1 phan tu (0,0,1) nen o day dung `html body img` (0,0,3) de thang chac chan,
   KHONG can !important -> cac rule khac trong style.css/style_sp.css van override duoc.
   ============================================================================= */
html body img,
html body video,
html body audio,
html body canvas,
html body embed,
html body iframe,
html body object,
html body svg {
  display: inline; /* mac dinh trinh duyet — KHONG collapse margin voi block cha */
  vertical-align: bottom; /* dung nhu layout.css goc (khong phai 'middle' cua preflight) */
}

/* =============================================================================
   Bo sung khi migrate sang Nuxt — HIEU UNG TAT LOADER (splash) giong web cu.

   Web cu: sau khi 8 dong chu hien ra het thi jQuery goi $("#loader").fadeOut(800)
   -> ca man trang MO DAN (opacity 1 -> 0) trong 800ms roi moi bien mat.
   Ban Nuxt truoc day dung v-show (display:none) nen bi TAT PHUP, khong co mo dan.

   Cach lam: JS bat class .is-fading (xem useKisaragiEffects) -> CSS lo phan mo dan,
   het 800ms JS moi go han khoi luong (dung thu tu nhu fadeOut cua jQuery).
   ============================================================================= */
#loader {
  opacity: 1;
  transition: opacity 800ms ease;
}
#loader.is-fading {
  opacity: 0;
  pointer-events: none; /* dang mo dan thi khong chan click nua */
}
/* Nguoi dung tat hieu ung chuyen dong -> tat luon mo dan */
@media (prefers-reduced-motion: reduce) {
  #loader {
    transition: none;
  }
}