@charset "utf-8";

/*====================

initial

====================*/

html {
  /* font-size:16px */
  font-size: 100%;
  height: 100%;
}

body {
  color: #333;
  background-color: #000;
  line-height: 1.5;
  /* フォントサイズ自動調整解除 */
  -webkit-text-size-adjust: 100%;
  height: 100%;
}

* {
  box-sizing: border-box;
  outline: 0px !important;
}

*:last-child {
  margin-bottom: 0 !important;
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.2;
  font-weight: bold;
}

img {
  vertical-align: bottom;
  border: none;
  width: 100%;
}

p {
  margin: 0 0 1.6em;
}


/* list
------------------------------*/

ul, ol {
  margin: 0 0 1.6em;
	padding:0 0 0 1em;
}

ul li, ol li {
	margin: 0 0 0.6em;
}

ul li p, ol li p {
	margin: 0 0 0.6em;
}

.ul-dotted {
  padding-left: 0;
  list-style: none;
}

.ul-dotted li {
  border-bottom: 1px dotted #CCC;
  padding: 0 0.8em 0.8em;
  margin: 0 0 0.8em;
}

dl {
  margin: 0 0 1.6em;
}

dl dt {}

dl dd {
  margin: 0 0 0.6em;
}

.dl-dotted {
  border-bottom: 1px dotted #CCC;
  padding: 0px 0.8em 0.8em;
  overflow: hidden;
  margin: 0 0 0.8em;
}

.dl-dotted dt {
  float: left;
  margin-bottom: 0;
}

.dl-dotted dd {
  margin: 0 0 0 8em;
}


/* table
------------------------------*/

table {
  width: 100% !important;
  height: auto !important;
  margin: 0 0 1.6em;
  border-bottom: 1px solid #eceeef;
  /* 半角英数連続文字の折り返し */
  table-layout: fixed;
}

table th, table td {
  padding: 0.5em;
  /* 半角英数連続文字の折り返し */
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.table-scroll {
  /*tableをスクロールさせる*/
  overflow: auto;
}

table p, table ul, table ol, table dl {
  margin-bottom: 0.6em;
}

table dl dd {
  margin-bottom: 0;
}


/* form
------------------------------*/

input, button, select, textarea {
  /* デフォルトデザイン解除 */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
}

::-webkit-input-placeholder {
  /*placeholder天地中央 iOS*/
  padding-top: 3px;
}

input[type="text"] {
  /*placeholder天地中央 Android*/
	/*
	line-height:1;
	padding:5px 3px;
	*/
  /* フォーカス時ズーム回避 iOS */
  font-size: 16px;
}

button, select {
  cursor: pointer;
}


/* column
------------------------------*/

.row {
  margin-right: -15px;
  margin-left: -15px;
  margin-bottom: 1.6em;
}

.row .col {
  padding: 15px !important;
}

.row.padding-thin {
  margin-right: -5px;
  margin-left: -5px;
}

.row.padding-thin .col {
  padding: 5px !important;
}

.row.padding-none {
  margin-right: 0;
  margin-left: 0;
}

.row.padding-none .col {
  padding: 0 !important;
}


/* font size
------------------------------*/

.fs-5l {
  /* font-size:80px */
  font-size: 5rem !important;
}

.fs-4l {
  /* font-size:64px */
  font-size: 4rem !important;
}

.fs-3l {
  /* font-size:48px */
  font-size: 3rem !important;
}

.fs-2l {
  /* font-size:32px */
  font-size: 2rem !important;
}

.fs-lg {
  /* font-size:24px */
  font-size: 1.5rem !important;
}

.fs-md {
  /* font-size:20px */
  font-size: 1.25rem !important;
}

.fs-rg {
  /* font-size:16px */
  font-size: 1rem !important;
}

.fs-sm {
  /* font-size:14px */
  font-size: 0.875rem !important;
}

.fs-xs {
  /* font-size:12px */
  font-size: 0.75rem !important;
}


/* font-color
------------------------------*/

.fc- {}


/* font-awesome
------------------------------*/

i.fas, i.far, i.fab {
  font-size: 120%;
  margin-bottom: 0 !important;
}

i.fa-mr {
  margin-right: 0.3em;
}

i.fa-ml {
  margin-left: 0.3em;
}


/* link
------------------------------*/

a {
  -webkit-transition: all .3s;
  transition: all .3s;
  /* リンクタップ時のハイライト非表示 */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.not-pc a {
  -webkit-transition: all .0s;
  transition: all .0s;
}

a:link:not(.btn):not(.navbar-brand):not(.nav-link):not(.alert-link) {
  color: #337ab7;
  text-decoration: none;
}

a:visited:not(.btn):not(.navbar-brand):not(.nav-link):not(.alert-link) {
  color: #337ab7;
  text-decoration: none;
}

a:hover:not(.btn):not(.navbar-brand):not(.nav-link):not(.alert-link) {
  color: #00a0ff;
  text-decoration: none;
}

a:active:not(.btn):not(.navbar-brand):not(.nav-link):not(.alert-link) {
  color: #337ab7;
  text-decoration: none;
}


/* .hover
------------------------------*/

img.hover {
  -webkit-transition: all .3s;
  transition: all .3s;
  /* 画像ブレ回避 */
  background-color: #fff;
}

.not-pc img.hover {
  -webkit-transition: all .0s;
  transition: all .0s;
}

img.hover:hover {
  filter: brightness(60%);
}


/* .disabled
------------------------------*/

.disabled>* {
  cursor: default !important;
}


/* .btn
------------------------------*/

.btn {
  cursor: pointer;
}

.btn.active {
  cursor: default;
}

.btn.disabled, .btn:disabled {
  cursor: default;
}

.btn:focus {
  box-shadow: none;
}

.btn-black, .btn-black:focus {
  color: #fff;
  background-color: #222;
  border-color: #222;
}

.btn-black:hover {
  color: #fff;
  background-color: #000;
  border-color: #000;
}

.btn-outline-black, .btn-outline-black:focus {
  color: #000;
  background-color: transparent;
  border-color: #000;
}

.btn-outline-black:hover {
  color: #E7792C;
  background-color: #000;
  border-color: #000;
}


/* .tags
------------------------------*/

.tags {
  /* インライン子要素の隙間解除 */
  font-size: 0;
}

.tags .tag {
  padding: 2px;
  display: inline-block;
}

.tags .tag i {
  font-size:100%;
}

.tags .tag .num{
  font-weight:200;
  font-size:10px;
  margin-left:2px;
  opacity:0.6;
}

/* alert
------------------------------*/

.alert-default {
  color: #292b2c;
  background-color: #e6e6e6;
  border-color: #ddd;
}

.alert-default .alert-link {
  color: #333;
}

.alert p, .alert ul, .alert ol, .alert dl {
  margin-bottom: 0;
}

.alert>p, .alert>ul, .alert>ol, .alert>dl {
  margin-bottom: 0.6em;
}

.alert ul li, .alert ol li, .alert dl dt, .alert dl dd {
  margin-bottom: 0;
}

/* border
------------------------------*/

.border {
  padding: 2px;
  border: solid 1px #000;
}


/* .content-center
------------------------------*/

.content-center {
  width: 70%;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block;
}


/* #wrap
------------------------------*/

#wrap {
  width: 100%;
  position: relative;
  overflow: hidden;
  background-color: #fafafa;
  /* If child-element is fixed, it is hidden*/
  /*opacity: 0.999999;*/
}

/* .card
------------------------------*/

.card {
  height: 100%;
  border-radius:0;
  border: 1px solid #eee;
}

.card figure {
  margin:0;
}

.card figure a {
  display: block;
  position: relative;
}

.card figure a figcaption {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  background: rgba(0, 0, 0, 0.6);
  -webkit-transition: all .3s;
  transition: all .3s;
}

.not-pc .card figure a figcaption {
  -webkit-transition: all .0s;
  transition: all .0s;
}

.card figure a:hover figcaption {
  opacity: 1;
}

.card figure a figcaption span {
  display:inline-block;
  color:#fff;
}

.card figure a figcaption span i.fa {
  font-size: 100%;
}

.card figure a .card-img-top {
  border-radius:0;
}

.card .card-block {
  padding:1em;
}

.card .card-block .card-title {
  font-size:0.875rem;
  margin-bottom:0.4em;
  font-weight:normal;
}

.card .card-block .card-text {
  font-size:0.75rem;
  font-weight:200;
  color:#999;
}


/*====================
 
 .section

====================*/

.section {
  position: relative;
}

/* .section-header
------------------------------*/

.section .section-header {
  text-align: center;
  padding-top: 1.6em;
  padding-bottom: 1.6em;
  background-color:#fff;
  border-bottom:solid 1px #eee;
}

.section .section-header .section-header-main-title {
  margin: 0 0 5px;
  font-size: 1.25rem;
  font-weight: normal;
}

.section .section-header .section-header-sub-title {
  margin: 0;
  color: #999;
  font-weight: normal;
  font-weight: 200;
  font-size: 0.875rem;
}

.section .section-header .section-header-num {
  margin: 1em 0 0;
  color: #999;
  font-weight: normal;
  font-weight: 200;
  font-size: 0.875rem;
}

/* .section-content
------------------------------*/

.section .section-content {
padding:1.6em 0;
}

.section .section-content .section-large-title {}

.section .section-content .section-medium-title {}

.section .section-content .section-small-title {}


/* loader
------------------------------*/

#loader-bg {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 9999;
}

#loader-wrap {
  width: 100%;
  height: 100%;
}

#loader, #loader:after {
  border-radius: 50%;
  width: 5em;
  height: 5em;
}

#loader {
  border-top: 0.1em solid rgba(0, 0, 0, 0.2);
  border-right: 0.1em solid rgba(0, 0, 0, 0.2);
  border-bottom: 0.1em solid rgba(0, 0, 0, 0.2);
  border-left: 0.1em solid #000;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1s infinite ease 0s;
  animation: load8 1s infinite ease 0s;
}

@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/*====================
 
 #header

====================*/

#header {
  border-bottom: solid 1px #eee;
  background-color: #fff;
}

#header #header-inner.container {
  padding-right: 0;
}

#header #header-inner #header-logo #site-logo {
  margin: 3px 0 0;
  width: 120px;
  line-height: 0;
}

#header #header-inner #header-logo #site-title {
  font-weight:200;
  font-size:10px;
  line-height:1;
  margin-top:5px;
  color:#666;
}

#header #header-inner #header-logo a #site-title {
  color:#666;
}

#header #header-inner nav#header-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

#header #header-inner nav#header-nav ul li {
  color: #333;
  padding: 1.4em;
	margin:0;
  display: block;
  font-weight: 200;
  cursor: pointer;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.not-pc #header #header-inner nav#header-nav ul li {
  -webkit-transition: all .0s;
  transition: all .0s;
}

.pc #header #header-inner nav#header-nav ul li:hover {
  color: #fff;
  background-color:#000;
}

#header #header-inner nav#header-nav ul li.on {
  color: #fff;
  background-color:#000;
}


#header #header-inner nav#header-nav ul li i {
  margin-right: 0.3em;
}


/* .megamenu
------------------------------*/

#header .megamenu {
  background-color: #000;
  display: none;
  padding: 1em 0;
  color: #fff;
}

#header .megamenu .megamenu-title {
  font-weight: normal;
  margin: 0 0 1em;
}

#header .megamenu#megamenu-area .row .col a {
  display: block;
  font-size: 0.75rem;
  color: #fff;
}

#header .megamenu#megamenu-area .row .col a figure {}

#header .megamenu#megamenu-area .row .col a figure figcaption {
  -webkit-transition: .3s;
  transition: .3s;
}

#header .megamenu#megamenu-area .row .col a figure figcaption .num {
  font-weight: 200;
  font-size: 10px;
  margin-left: 4px;
  color: #666;
}

.not-pc #header .megamenu#megamenu-area .row .col a figure figcaption {
  -webkit-transition: all .0s;
  transition: all .0s;
}

#header .megamenu#megamenu-area .row .col a:hover figure figcaption {
  opacity: 0.6;
}

#header .megamenu#megamenu-area .row .col a figure img {
  -webkit-transition: .3s;
  transition: .3s;
}

.not-pc #header .megamenu#megamenu-area .row .col a figure img {
  -webkit-transition: all .0s;
  transition: all .0s;
}

#header .megamenu#megamenu-area .row .col a:hover figure img {
  filter: brightness(60%);
}

#header .megamenu#megamenu-genre {
  text-align: center;
}

#header .megamenu#megamenu-search {}

#header .megamenu#megamenu-search .input-group .form-control {
  border: solid 1px #fff;
}

#header .megamenu#megamenu-search .input-group .input-group-btn button {
  margin-left: 0;
}

#header .megamenu#megamenu-search .custom-control-description {
  color: #ccc;
  line-height: normal;
}

#header .megamenu#megamenu-search .row {
  margin-bottom: 0;
}


/*====================
 
 #footer

====================*/

#footer {
  text-align: center;
  font-size: 0.875rem;
  font-weight: 200;
  border-top:solid 1px #eee;
}

.search #footer,
.archive #footer {
  margin-top:-1px;
}

#footer #footer-top {
  padding-top: 1em;
  padding-bottom: 1em;
  background-color: #fff;
}

#footer #footer-top #fk a {
  width:180px;
  display:block;
  margin:0 auto;
}

#footer #footer-top #fk a img.hover:hover{
  opacity:0.6;
  filter: brightness(100%);
}

#footer #footer-bottom {
  padding-top: 1em;
  padding-bottom: 1em;
  background-color: #000;
  position: relative;
  color: #999;
}

#footer #footer-bottom ul#footer-bottom-link {
  margin: 0 0 0.6em;
  padding: 0;
  list-style: none;
}

#footer #footer-bottom ul#footer-bottom-link li {
  display: inline-block;
  margin: 0 0.3em;
}

#footer #footer-bottom ul#footer-bottom-link li a {
  color: #999;
}

#footer #footer-bottom ul#footer-bottom-link li a:hover {
  color: #fff;
}

#footer #footer-share-buttons {
  margin-bottom: 0.6em;
}

#footer #footer-bottom #copyright {
  font-size: 0.75rem;
}


/* #page-top
------------------------------*/

#page-top {
  position: fixed;
  right: 1em;
  bottom: 1em;
  display: none;
  z-index: 50;
}

#page-top i.fas {
  padding: 10px 0;
  color: #fff;
  cursor: pointer;
  text-align: center;
  border-radius: 50%;
  background-color: #000;
  line-height: 1.0;
  font-size: 14px;
	width:34px;
	height:34px;
	display: inline-block;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.not-pc #page-top i.fas {
  -webkit-transition: all .0s;
  transition: all .0s;
}

#page-top i.fas:hover {
  background-color: #00a0ff;
}


/*-----------------------------------------------------	*/


/* for - 1200px */


/*-----------------------------------------------------	*/

@media all and (max-width: 1199px) {}


/*-----------------------------------------------------	*/


/* for - 992px */


/*-----------------------------------------------------	*/

@media all and (max-width: 991px) {}


/*-----------------------------------------------------	*/


/* for - 768px */


/*-----------------------------------------------------	*/

@media all and (max-width: 767px) {
  html {
    /* font-size:14px */
    font-size: 87.5%;
  }
  .content-center {
    width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #header #header-inner #header-logo #site-logo {
    margin: 0;
    width: 70px;
  }
  #header #header-inner #header-logo #site-title {
    display:none;
  }
  #header #header-inner nav#header-nav ul li {
    padding: 1em;
  }
  #header #header-inner nav#header-nav ul li i {
    font-size: 180%;
    margin-right: 0;
  }
  #header #header-inner nav#header-nav ul li span {
    display: none;
  }
  #footer #footer-top #fk a {
    width:140px;
  }
}


/*-----------------------------------------------------	*/


/* for - 576px */


/*-----------------------------------------------------	*/

@media all and (max-width: 575px) {}