/* =================================
	TBS Reset CSS
================================= */
@import url("/um/v7/css/reset.css");

/* =================================
	Common CSS
================================= */
@media print {
  header {
    display: none;
  }
}

a {
  text-decoration: none;
  color: #000;
}

.txt {
  line-height: 1.5;
  letter-spacing: 0.05em;
}

/* link */
.lazy {
  position: relative;
}

.wbr {
  white-space: nowrap;
  display: inline-block;
}

text-color .gray {
  color: #808080;
}

.black {
  color: #171717;
}

.purple {
  color: #a757a8;
}

.ultramarine {
  color: #465daa;
}

.blue {
  color: #0057a8;
}

.lightblue {
  color: #afdfe4;
}

.deepgreen {
  color: #060;
}

.green {
  color: #008000;
}

.yellowgreen {
  color: #b9c42f;
}

.yellow {
  color: #ffb74c;
}

.orange {
  color: #eb5f10;
}

.pink {
  color: #f58f98;
}

.vermilion {
  color: #ef454a;
}

.red {
  color: #c00;
}

.carmine {
  color: #c22047;
}

.magenta {
  color: #ec008c;
}

.brown {
  color: #994c00;
}

.reddishbrown {
  color: #800000;
}

.yellowocher {
  color: #c39143;
}

.gold {
  color: #ffd700;
}

.silver {
  color: #c0c0c0;
}

/*	marker
============================== */
.marker {
  background: linear-gradient(transparent 40%, #ffff66 40%);
}

/*	text align
============================== */
.tcenter {
  text-align: center;
}

.tleft {
  text-align: left;
}

.tright {
  text-align: right;
}

/*	txt common
============================== */
article .txt {
  letter-spacing: 1px;
  padding: 0.5em;
  line-height: 1.5;
}

@media all and (max-width: 767px) {
  article .txt {
    font-size: 13px;
  }
}

/*	font size
============================== */
@media all and (min-width: 768px) {
  .syo {
    font-size: 75%;
  }

  .tyu {
    font-size: 115%;
  }

  .dai {
    font-size: 120%;
    letter-spacing: 1px;
    line-height: 1.5;
  }

  .tokudai {
    font-size: 180%;
  }

  .fs20 {
    font-size: 20px;
  }

  .fs30 {
    font-size: 30px;
  }

  .fs40 {
    font-size: 40px;
  }

  .fs50 {
    font-size: 50px;
  }
}

@media all and (max-width: 767px) {
  .syou {
    font-size: 85%;
  }

  .dai {
    font-size: 120%;
  }

  .tokudai {
    font-size: 150%;
  }

  .fs20 {
    font-size: 15px;
  }

  .fs30 {
    font-size: 23px;
  }

  .fs40 {
    font-size: 30px;
  }

  .fs50 {
    font-size: 35px;
  }
}

/*	font weight
============================== */
.bold {
  font-weight: bold;
}

/*	dot list
============================== */
.dotlist {
  padding: 3px 0.5em 0 0;
  /* font-size: 85%; */
  line-height: 1.5;
}

.dotlist>li {
  position: relative;
  padding: 0.5em 0 0.5em 1.7em;
  text-align: justify;
}

.dotlist>li:before {
  content: "";
  position: absolute;
  left: 10px;
  display: block;
  width: 0.5em;
  height: 0.5em;
  border-radius: 50%;
  background: #0057a8;
  top: 0;
  margin-top: 1.25em;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

/*	kome list
============================== */
.komelist>li {
  position: relative;
  font-size: 95%;
  margin-bottom: 0.5em;
}

.komelist>li>span:before {
  content: "※";
  position: absolute;
  left: 0;
  display: block;
  top: 0;
}

.komelist>li>span {
  display: block;
  padding-left: 1.5em;
}

/*	sankaku list
============================== */
.sankakulist {
  padding: 3px 0.5em 0 0;
}

.sankakulist li {
  position: relative;
  padding: 0.5em 0 0.5em 1.5em;
}

.sankakulist li:before {
  content: "";
  position: absolute;
  left: 0;
  display: block;
  width: 0;
  height: 0;
  border-top: 0.8em solid #f00;
  border-right: 0.5em solid transparent;
  border-bottom: 0.8em solid transparent;
  border-left: 0.5em solid transparent;
  top: 0;
  margin-top: 1.6em;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

/*	count list
============================== */
.custom-counter {
  counter-reset: number;
  /*数字をリセット*/
  list-style-type: none !important;
  /*数字を一旦消す*/
  font-size: 85%;
}

.custom-counter li {
  position: relative;
  line-height: 1.5em;
  padding: 0.5em 0.5em 0.5em 2em;
  text-align: justify;
}

.custom-counter li::before {
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*以下数字のデザイン変える*/
  display: inline-block;
  background: #0057a8;
  color: white;
  font-family: 'Avenir', 'Arial Black', 'Arial', sans-serif;
  font-weight: bold;
  border-radius: 50%;
  left: 0;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media all and (min-width: 768px) {
  .custom-counter li dl dt {
    margin-left: 2em;
    margin-top: -1.6em;
  }

  .custom-counter li::before {
    font-size: 13px;
    width: 20px;
    height: 20px;
    line-height: 22px;
    text-align: center;
    top: 1.3em;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
}

@media all and (max-width: 767px) {
  .custom-counter li::before {
    padding: 5px 5px;
    font-size: 90%;
  }

  .custom-counter li dl dt {
    margin-left: 2em;
    margin-top: -1.7em;
  }

  .custom-counter li::before {
    width: 9px;
    height: 9px;
    line-height: 10px;
    text-align: center;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(20%);
    letter-spacing: -0.5px;
  }
}

article.invite dl.kaijo {
  margin-bottom: 1em;
}

/*	hover btn
============================== */
@media all and (min-width: 768px) {
  div.btn {
    height: 3em;
  }

  @-webkit-keyframes sheen {
    0% {
      -webkit-transform: skewY(-45deg) translateX(0);
      transform: skewY(-45deg) translateX(0);
    }

    100% {
      -webkit-transform: skewY(-45deg) translateX(12.5em);
      transform: skewY(-45deg) translateX(12.5em);
    }
  }

  @keyframes sheen {
    0% {
      -webkit-transform: skewY(-45deg) translateX(0);
      transform: skewY(-45deg) translateX(0);
    }

    100% {
      -webkit-transform: skewY(-45deg) translateX(12.5em);
      transform: skewY(-45deg) translateX(12.5em);
    }
  }

  .btnwrapper {
    display: block;
    position: relative;
  }

  .button {
    color: hsla(0, 0%, 100%, 1.00);
    box-sizing: border-box;
    padding: 1.5em 2em;
    text-align: center;
    text-decoration: none;
    border-bottom: 4px solid #0057a8;
    border-top: 2px solid #0057a8;
    border-left: 2px solid #0057a8;
    border-right: 2px solid #0057a8;
    background: #3379b9;
    display: block;
    border-radius: 0.3em;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    overflow: hidden;
    letter-spacing: 1px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    line-height: 0;
  }

  .button:before {
    content: "";
    background-color: rgba(255, 255, 255, 0.5);
    height: 100%;
    width: 3em;
    display: block;
    position: absolute;
    top: 0;
    left: -4.5em;
    -webkit-transform: skewX(-45deg) translateX(0);
    transform: skewX(-45deg) translateX(0);
    -webkit-transition: none;
    transition: none;
  }

  .button:hover {
    background-color: #0057a8;
    color: #fff;
    border-bottom: 4px solid #004484;
    border-top: 2px solid #004484;
    border-left: 2px solid #004484;
    border-right: 2px solid #004484;
  }

  div.sbtn .button:hover:before {
    -webkit-transform: skewX(-45deg) translateX(15em);
    transform: skewX(-45deg) translateX(15em);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
  }

  div.lbtn .button:hover:before {
    -webkit-transform: skewX(-45deg) translateX(28em);
    transform: skewX(-45deg) translateX(28em);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
  }

  div.sbtn {
    padding: 0 8em;
  }

  div.lbtn {
    padding: 0 1em;
  }
}

@media all and (max-width: 767px) {
  .btn {
    border-radius: 10px;
    background-color: #fff;
    margin-bottom: 1em;
    padding: 4px;
    box-sizing: border-box;
  }

  .btnwrapper {
    background-color: #0057a8;
    border-radius: 10px;
  }

  .btnwrapper a {
    display: block;
    background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.7) 10%, rgba(255, 255, 255, 0) 27%);
    background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.7) 10%, rgba(255, 255, 255, 0) 27%);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.7) 10%, rgba(255, 255, 255, 0) 27%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=1);
    border: solid #000 3px;
    color: white;
    line-height: 1.5;
    letter-spacing: 1px;
    text-align: center;
    padding: 0.7em;
    border-radius: 10px;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
  }
}

/*	margin bottom
============================== */
.mgb05em {
  margin-bottom: 0.5em;
}

.mgb1em {
  margin-bottom: 1em;
}

.mgb2em {
  margin-bottom: 2em;
}

.mgb3em {
  margin-bottom: 3em;
}

.mgb4em {
  margin-bottom: 4em;
}

.mgb5em {
  margin-bottom: 5em;
}

/*	background
============================== */
html, body, div#con-body {
  background-color: #FFFFFF;
  /* デフォルトのグレーを白に上書き */
}

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

div#page-top {
  background-image: url(../img/bg.jpg);
  font-family: Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  font-kerning: normal;
  font-feature-settings: "palt";
  text-align: justify;
  text-justify: inter-ideograph;
}

/*	copyright
============================== */
p.copyright {
  line-height: 1.25;
  text-align: center;
  color: #fff;
  background-color: #0057a8;
}

p.copyright a {
  color: #fff;
  text-decoration: none;
}

@media all and (min-width: 768px) {
  p.copyright {
    font-size: 75%;
    padding: 30px 0;
    border-top: solid 4px #fff;
    outline: solid 4px #0057a8;
  }

  p.copyright a:hover {
    text-decoration: none;
  }
}

@media all and (max-width: 767px) {
  p.copyright {
    font-size: 67.5%;
    line-height: 1.5;
    padding: 1em;
    padding-top: 10px;
  }
}

/*	header
============================== */
.idx header div.title h1 span,
.idx header div.title h1 a {
  background-image: url(../img/header05.jpg?0406);
}

@media all and (min-width: 768px) {
  .idx header {
    background-image: url(../img/headerbg.jpg);
    background-repeat: repeat-x;
    height: 741px;
    margin-bottom: 20px;
    background-position: bottom;
    background-color: #fff;
  }

  .idx header div.title h1 span,
  .idx header div.title h1 a {
    display: block;
    background-image: url(../img/header05.jpg?0406);
    background-repeat: no-repeat;
    white-space: nowrap;
    overflow: hidden;
    width: 930px;
    height: 619px;
    margin: 0 auto 10px;
    background-size: 100%;
  }

  .idx header div.title h1 span img {
    width: 930px;
    height: 388px;
  }

  .cmn header {
    background-image: url(../img/headerbg.jpg);
    background-position: bottom;
    background-repeat: repeat-x;
    height: 293px;
    margin-bottom: 20px;
  }

  .cmn header div.title h1 span,
  .cmn header div.title h1 a {
    display: block;
    background-image: url(../img/header2.png);
    background-repeat: no-repeat;
    white-space: nowrap;
    overflow: hidden;
    width: 930px;
    height: 172px;
    margin: 0 auto 10px;
  }

  .cmn header div.title h1 a img {
    width: 930px;
    height: 172px;
  }
}

@media all and (max-width: 767px) {

  .idx header h1 span,
  .idx header h1 a {
    display: block;
    background-size: cover;
    /* 縦÷横 */
    position: relative;
    padding-top: 66.559139784946237%;
  }

  .idx header h1 img {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
  }

  .cmn header h1 a {
    display: block;
    background-size: cover;
    /* 縦÷横 */
    position: relative;
    padding-top: 18.494623655914%;
    background-image: url(../img/header2.png);
    background-color: #fff;
  }

  .cmn header h1 img {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
  }
}

/*	layout
============================== */
@media all and (min-width: 768px) {
  div.wrap {
    width: 930px;
    margin: 0 auto;
  }

  div.left {
    width: 610px;
    float: left;
    margin-bottom: 70px;
    padding: 20px;
  }

  div.right {
    width: 300px;
    float: right;
  }
}

@media all and (max-width: 767px) {
  div.left {
    margin-bottom: 20px;
    padding: 10px;
  }

  div.right {
    width: 300px;
    margin: 0 auto 30px;
  }
}

/*	left
============================== */
div.left {
  box-sizing: border-box;
  background-color: white;
  box-shadow: 3px 3px 10px 0px rgba(255, 255, 255, 0.5) inset, -3px -3px 10px 0px rgba(0, 0, 0, 0.5) inset;
}

/*	h2
============================== */
h2 {
  width: 100%;
  height: 100%;
  position: relative;
  margin-bottom: 4px;
}

h2:before {
  content: "";
  display: block;
  width: 100%;
  background-color: #0057a8;
  background: -moz-linear-gradient(left, #0057a8, #3379b9);
  background: -webkit-gradient(linear, left center, right center, from(#0057a8), to(#3379b9));
}

h2:after {
  content: "";
  display: block;
  width: 100%;
  background-color: #0057a8;
  background: -moz-linear-gradient(left, #3379b9, #0057a8);
  background: -webkit-gradient(linear, left center, right center, from(#3379b9), to(#0057a8));
}

h2 span {
  display: block;
  background-image: url(../img/h2.png?2021);
  background-repeat: no-repeat;
  text-indent: 110%;
  white-space: nowrap;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

@media all and (min-width: 768px) {
  h2 span {
    width: 230px;
    height: 40px;
  }

  h2:before {
    height: 23px;
    margin-bottom: 4px;
  }

  h2:after {
    height: 23px;
  }
}

@media all and (max-width: 767px) {
  h2 span {
    background-size: 200px 571px;
    width: 175px;
    height: 28px;
  }

  h2:before {
    height: 17px;
    margin-bottom: 3px;
  }

  h2:after {
    height: 17px;
  }
}

/*	h2 background-position
============================== */
@media all and (min-width: 768px) {
  article.next h2 span {
    background-position: center top;
  }

  article.news h2 span {
    background-position: center -50px;
  }

  article.about h2 span {
    background-position: center -240px;
  }

  article.cast h2 span {
    background-position: center -290px;
  }

  article.invite h2 span {
    background-position: center -340px;
  }

  article.data h2 span {
    background-position: center -390px;
  }

  article.present h2 span {
    background-position: center -440px;
  }

  article.tw h2 span {
    background-position: center -490px;
  }

  article.minogashi h2 span {
    background-position: center -290px;
  }
}

@media all and (max-width: 767px) {
  article.next h2 span {
    background-position: center top;
  }

  article.news h2 span {
    background-position: center -37px;
  }

  article.about h2 span {
    background-position: center -179px;
  }

  article.cast h2 span {
    background-position: center -217px;
  }

  article.invite h2 span {
    background-position: center -254px;
  }

  article.data h2 span {
    background-position: center -290px;
  }

  article.present h2 span {
    background-position: center -330px;
  }

  article.tw h2 span {
    background-position: center -367px;
  }

  article.minogashi h2 span {
    background-position: center -217px;
  }
}

/*	h3
============================== */
h3 {
  position: relative;
  padding: .5em 1em .5em 3em;
  background-color: #facf0c;
  box-shadow: 0 -1px 0 rgba(255, 255, 255, 1) inset;
  color: #000;
  border-radius: 5px;
  margin-bottom: 0.8em;
  line-height: 1.5;
}

h3::after {
  position: absolute;
  top: 0.75em;
  left: .6em;
  z-index: 2;
  content: '';
  width: 10px;
  height: 10px;
  border: 3px solid #fff;
  border-radius: 100%
}

@media all and (min-width: 768px) {
  h3 {
    letter-spacing: 1px;
  }
}

@media all and (max-width: 767px) {
  h3 {
    font-size: 13px;
  }

  h3::after {
    position: absolute;
    top: 0.75em;
    left: .6em;
    z-index: 2;
    content: '';
    width: 6px;
    height: 6px;
    border: 3px solid #fff;
    border-radius: 100%;
  }
}

/*	h4
============================== */
h4 {
  position: relative;
  padding: 0 .5em .5em 1.7em;
  border-bottom: 2px solid #dddfe2;
  letter-spacing: 1px;
}

h4::after {
  position: absolute;
  top: .4em;
  left: .4em;
  z-index: 0;
  content: '';
  width: 12px;
  height: 12px;
  background-color: #facf0c;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

@media all and (max-width: 767px) {
  h4 {
    font-size: 12px;
  }

  h4::after {
    position: absolute;
    top: .4em;
    left: .4em;
    z-index: 0;
    content: '';
    width: 10px;
    height: 10px;
    background-color: #facf0c;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }
}

/*	article
============================== */
div.cont {
  background: #fce785;
  padding: 5px;
}

div.cont>.inner {
  background: -moz-linear-gradient(-45deg, #ffffff 6%, #fce785 28%, #fce785 100%);
  background: -webkit-linear-gradient(-45deg, #ffffff 6%, #fce785 28%, #fce785 100%);
  background: linear-gradient(135deg, #ffffff 6%, #fce785 28%, #fce785 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#fce785', GradientType=1);
  border: 4px solid #000000;
}

div.cont .inner>div {
  background-color: #fff;
  background: -moz-linear-gradient(left top, #f6f6f6, #f6f6f6 10%, #fff 10%, #fff 50%,
    #f6f6f6 50%, #f6f6f6 60%, #fff 60%, #fff);
  background: -webkit-linear-gradient(left top, #f6f6f6, #f6f6f6 10%, #fff 10%, #fff 50%,
    #f6f6f6 50%, #f6f6f6 60%, #fff 60%, #fff);
  background: linear-gradient(left top, #f6f6f6, #f6f6f6 10%, #fff 10%, #fff 50%,
    #f6f6f6 50%, #f6f6f6 60%, #fff 60%, #fff);
  -moz-background-size: 10px 10px;
  -webkit-background-size: 10px 10px;
  background-size: 10px 10px;
}

div.cont .inner>div:not(:last-child) {
  margin-bottom: 1em;
}

article:last-child {
  margin-bottom: 0;
}

@media all and (min-width: 768px) {
  article {
    margin-bottom: 30px;
  }

  div.cont>.inner {
    padding: 20px;
  }

  div.cont>.inner>div.section {
    padding: 1em;
  }
}

@media all and (max-width: 767px) {
  article {
    margin-bottom: 10px;
  }

  div.cont .inner {}

  div.cont>.inner>div.section {
    padding: 0.5em;
  }
}

/*	article next
============================== */
.center {
  text-align: center;
}

.next p.nomv {
  padding: 2em 2em 1em;
}

.next p.date,
.next p.midashi {
  font-weight: bold;
  line-height: 1.5;
  color: #0057a8;
}

.next p b {
  text-align: center;
  font-weight: bold;
}

.next p b {
  display: block;
  letter-spacing: 1px;
  margin-bottom: 1em;
  line-height: 1.5;
}

@media all and (min-width: 768px) {
  .next p b {
    font-size: 17px;
  }
}

@media all and (max-width: 767px) {
  .next p b {
    font-size: 14px;
  }
}

.next ul.mlist {
  padding: 0 0 0 1.5em;
  position: relative;
}

.next ul.mlist li {
  line-height: 1.5;
  padding: 0 0 0;
  list-style-type: none !important;
  font-weight: bold;
}

.next ul.mlist li:before {
  content: "▼";
  position: absolute;
  left: 0.2em;
  color: red;
}

/*	YouTube Player
============================== */
.ytube {
  position: relative;
  height: 0;
  padding-top: 56.25%;
  margin-bottom: 15px;
}

.ytube iframe {
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}

/*	article news
============================== */
article.news ul {
  background-color: #fff;
}

article.news ul li {
  background-color: #fff;
  font-size: 16px;
}

article.news ul li dl dt {
  margin-bottom: 0.3em;
  font-weight: bold;
  color: #0057a8;
}

article.news ul li dl dd {}

article.news ul li a:hover {
  background-color: #cce3f6;
}

article.news ul li a, article.news ul li div {
  display: block;
  text-align: justify;
  letter-spacing: 1px;
  border-bottom: 3px solid #ececec;
}

article.news ul {
  font-size: 15px;
  overflow: auto;
  /* height: 280px; */
  border-radius: 5px;
}

@media all and (min-width: 768px) {
  article.news ul {
    overflow: auto;
    margin-top: 15px;
  }

  article.news ul li {
    line-height: 1.5;
  }

  article.news ul li a, article.news ul li div {
    text-decoration: none;
  }

  article.news ul li dl dt {}

  article.news ul li a, article.news ul li div {
    padding: 20px 30px;
  }
}

@media all and (max-width: 767px) {
  article.news {}

  article div.inner {
    padding: 10px;
  }

  article h2 {
    text-align: center;
  }

  article.news ul li a, article.news ul li div {
    padding: 10px 20px;
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: 1px;
  }
}

/*	recta
============================== */
div.recta {
  margin-bottom: 20px;
}

/*	sns link
============================== */
div.sns {
  width: 300px;
  margin: 0 auto;
  padding-bottom: 20px;
}

div.sns p.title {
  background-image: url(../img/h2.png?01);
  background-repeat: no-repeat;
  background-position: center -100px;
  width: 267px;
  height: 34px;
  text-indent: 110%;
  white-space: nowrap;
  overflow: hidden;
  margin-bottom: 3px;
}

/*	a　*/
div.sns p.fb a,
div.sns p.tw a,
div.sns p.ig a,
div.sns p.tt a {
  display: block;
  cursor: pointer;
  width: 267px;
  height: 46px;
  margin-bottom: 7px;
  box-shadow: 3px 3px 10px 0px rgba(255, 255, 255, 0.5) inset, -3px -3px 10px 0px rgba(0, 0, 0, 0.5) inset;
  padding-top: 12px;
  box-sizing: border-box;
}

div.sns p.fb a:hover,
div.sns p.tw a:hover,
div.sns p.ig a:hover,
div.sns p.tt a:hover {
  box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.5) inset, -3px -3px 10px 0px rgba(255, 255, 255, 0.5) inset;
}

div.sns p.fb a {
  background-color: #3b5a9a;
  /* float: left; */
}

div.sns p.tw a {
  background-color: #000;
  /* float: right; */
}

div.sns p.ig a {
  background-color: #c54175;
  /* float: right; */
}

div.sns p.tt a {
  background-color: #000;
  /* float: right; */
}

div.sns p.fb a span,
div.sns p.tw a span,
div.sns p.ig a span,
div.sns p.tt a span {
  display: block;
  background-image: url(../img/h2.png?20231205);
  text-indent: 110%;
  white-space: nowrap;
  overflow: hidden;
  width: 155px;
  height: 25px;
  margin: 0 auto;
}

div.sns p.fb a span {
  background-position: center -140px;
}

div.sns p.tw a span {
  background-position: center -170px;
}

div.sns p.ig a span {
  background-position: center -547px;
}

div.sns p.tt a span {
  background-position: center -579px;
}

div.sns p.sns {
  font-size: 10px;
  text-align: center;
}

@media all and (min-width: 768px) {
  .com div.sns p.sns {
    color: #000;
  }
}

div.sns div.cont {
  background: #fce785;
  padding: 5px;
}

div.sns div.cont .inner {
  padding: 8px;
}

/*	sns like btn
============================== */
div.sns-btns div.tw {
  float: left;
}

div.sns-btns div.fb {
  float: right;
}

div.sns-btns {
  background-color: rgba(255, 255, 255, 1);
  box-sizing: border-box;
  height: 40px;
  padding-top: 11px;
  padding-bottom: 30px;
  width: 300px;
  margin-bottom: 20px;
  border-top: 2px solid #0057a8;
  border-bottom: 2px solid #0057a8;
}

@media all and (min-width: 768px) {
  div.sns-btns div.tw {
    padding-left: 50px;
  }

  div.sns-btns div.fb {
    margin-right: 40px;
  }
}

@media all and (max-width: 767px) {

  /* buttons */
  div.sns-btns {
    margin: 0 auto;
  }

  div.sns-btns div.tw {
    padding-left: 18%;
  }

  div.sns-btns div.fb {
    margin-right: 15%;
  }
}

/*	facebook timeline
============================== */
div.fb div.cont div.inner {
  padding: 10px 15px 15px;
}

div.fb div.cont div.inner div.title {
  background-image: url(../img/h2.png);
  background-size: 230px 657px;
  background-position: center -169px;
  background-repeat: no-repeat;
  width: 151px;
  height: 29px;
  text-indent: 110%;
  white-space: nowrap;
  overflow: hidden;
  margin: 0 auto 10px;
}

div.fb {
  margin-bottom: 20px;
}

/*	banner million spoon
============================== */
div.bn_spoon {
  background-image: url(../img/bn_spoon.jpg);
  background-repeat: no-repeat;
  width: 300px;
  height: 250px;
  text-indent: 110%;
  white-space: nowrap;
  overflow: hidden;
  margin-bottom: 20px;
}
}

/*	pagetop
============================== */
p.pgt {
  z-index: 20;
}

p.pgt a, p.pgt span {
  display: block;
}

@media all and (min-width: 768px) {
  p.pgt {
    position: fixed;
    right: 40px;
    bottom: 40px;
  }

  p.pgt a {
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
    background-repeat: no-repeat;
    width: 76px;
    height: 100px;
    background-image: url(../img/cm_chara.png);
    background-position: -2480px 0;
  }

  p.pgt a:hover {
    background-position: -2400px 0;
  }
}

@media all and (max-width: 767px) {
  p.pgt {
    width: 100%;
    min-width: 320px;
    bottom: 0;
  }

  p.pgt a {
    position: relative;
    text-decoration: none;
    color: #fff;
    text-shadow: 0 2px 2px hsla(0, 0%, 0%, .25);
    background-color: hsla(209, 100%, 33%, 0.80);
    height: 50px;
    letter-spacing: 1.5px;
    border-top: 3px solid #fff;
    outline: 3px solid hsla(209, 100%, 33%, 0.80);
    box-sizing: border-box;
  }

  p.pgt a span {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -0.55em;
    margin-left: -5em;
    font-size: 87.5%;
    font-weight: bold;
  }

  p.pgt a span:before {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -33px;
    margin-left: -9.2em;
    display: block;
    content: "";
    background-repeat: no-repeat;
    background-position: left top;
    width: 38px;
    height: 50px;
    background-image: url(../img/cm_chara.png);
    background-size: 1280px 50px;
    background-position: -1240px 0;
  }
}

/*	menu
============================== */
@media all and (min-width: 768px) {
  div.menu nav div.outer ul {
    width: 930px;
    margin: 0 auto;
  }

  div.menu nav div.outer ul li {
    width: 302px;
    height: 90px;
    float: left;
    box-sizing: border-box;
    border: 4px solid #fff;
    background-color: #facf0c;
    -webkit-box-shadow: 0 0 30px hsla(0, 0%, 0%, 0.5) inset;
    box-shadow: 0 0 30px hsla(0, 0%, 0%, 0.5) inset;
  }

  div.menu nav div.outer ul li:not(:last-child) {
    margin-right: 10.8px;
  }

  div.menu nav div.outer ul li a {
    display: block;
    height: 82px;
    box-sizing: border-box;
    border: 4px solid #000;
    background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0) 27%);
    background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0) 27%);
    background: linear-gradient(135deg, rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0) 27%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=1);
    position: relative;
  }

  div.menu nav div.outer ul li a span {
    display: block;
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
    position: absolute;
    background-image: url(../img/menu.png);
    background-repeat: no-repeat;
    width: 123px;
    height: 38px;
    -webkit-filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.4));
    filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.4));
    top: 3px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
  }

  div.menu nav div.outer ul li.nobtn a span {
    background-image: url(../img/menu_nobtn.png);
  }

  div.menu nav div.outer ul li.invite a span {
    background-position: center -40px;
  }

  div.menu nav div.outer ul li.news a span {
    background-position: center -80px;
  }

  div.menu nav div.outer ul li.kanran a span {
    background-position: center -120px;
  }

  div.menu nav div.outer ul li.present a span {
    background-position: center -160px;
    height: 60px;
  }

  div.menu nav div.outer ul li.data a span {
    background-position: center -217px;
  }

  body.about div.menu nav div.outer ul li.about,
  body.invite div.menu nav div.outer ul li.invite,
  body.news div.menu nav div.outer ul li.news,
  body.kanran div.menu nav div.outer ul li.kanran,
  body.about div.menu nav div.outer ul li.about,
  body.present div.menu nav div.outer ul li.present,
  body.data div.menu nav div.outer ul li.data,
  div.menu nav div.outer ul li:hover {
    background-color: #db6570;
  }

  body.about div.menu nav div.outer ul li.about a,
  body.invite div.menu nav div.outer ul li.invite a,
  body.news div.menu nav div.outer ul li.news a,
  body.kanran div.menu nav div.outer ul li.kanran a,
  body.about div.menu nav div.outer ul li.about a,
  body.present div.menu nav div.outer ul li.present a,
  body.data div.menu nav div.outer ul li.data a {
    cursor: default;
  }

  div.menu nav div.outer ul li.nobtn:hover {
    background-color: #b9970e;
  }

  div.menu nav div.outer ul li.nobtn {
    background-color: #b9970e;
  }

  div.menu nav div.outer ul li.nobtn {
    border: 4px solid #bcb9b8;
  }

  div.menu nav div.outer ul li.nobtn a {
    background: -moz-linear-gradient(-45deg, rgba(185, 185, 185, 1) 10%, rgba(255, 255, 255, 0) 27%);
    background: -webkit-linear-gradient(-45deg, rgba(185, 185, 185, 1) 10%, rgba(255, 255, 255, 0) 27%);
    background: linear-gradient(135deg, rgba(185, 185, 185, 1) 10%, rgba(255, 255, 255, 0) 27%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b9b9b9', endColorstr='#00ffffff', GradientType=1);
    cursor: default;
  }
}

@media all and (max-width: 767px) {
  div.menu {
    background-color: #0057a8;
    border-bottom: solid 5px #fce26b;
    box-shadow: 0px 5px 0px 0px #7f6706;
    -moz-box-shadow: 0px 5px 0px 0px #7f6706;
    -webkit-box-shadow: 0px 5px 0px 0px #7f6706;
    padding: 10px;
    margin-bottom: 5px;
  }

  div.menu nav div.outer ul li {
    width: 33.3%;
    height: 52px;
    float: left;
    box-sizing: border-box;
    margin-bottom: 2px;
  }

  div.menu nav div.outer ul li a {
    display: block;
    width: 100%;
    height: 52px;
    float: left;
    box-sizing: border-box;
    border: solid #fff 3px;
    background-color: #facf0c;
  }

  div.menu nav div.outer ul li.nobtn a {
    background-color: #b9970e;
    border: solid #bcb9b8 3px;
  }

  div.menu nav div.outer ul li:nth-child(1),
  div.menu nav div.outer ul li:nth-child(4) {
    padding-right: 2px;
  }

  div.menu nav div.outer ul li:nth-child(3),
  div.menu nav div.outer ul li:nth-child(6) {
    padding-left: 2px;
  }

  div.menu nav div.outer ul li a span {
    display: block;
    background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0) 27%);
    background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0) 27%);
    background: linear-gradient(135deg, rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0) 27%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=1);
    box-sizing: border-box;
    border: solid #000 3px;
    width: 100%;
    height: 46px;
    position: relative;
  }

  div.menu nav div.outer ul li.nobtn a span {
    background: -moz-linear-gradient(-45deg, rgba(185, 185, 185, 1) 10%, rgba(255, 255, 255, 0) 27%);
    background: -webkit-linear-gradient(-45deg, rgba(185, 185, 185, 1) 10%, rgba(255, 255, 255, 0) 27%);
    background: linear-gradient(135deg, rgba(185, 185, 185, 1) 10%, rgba(255, 255, 255, 0) 27%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=1);
  }

  div.menu nav div.outer ul li a span b {
    display: block;
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
    background-image: url(../img/menu.png);
    background-size: 80px 164px;
    width: 80px;
    height: 22.5px;
    background-repeat: no-repeat;
    position: absolute;
    top: 1.5px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    -webkit-filter: drop-shadow(1.5px 1.5px 1.5px rgba(0, 0, 0, 0.4));
    filter: drop-shadow(1.5px 1.5px 1.5px rgba(0, 0, 0, 0.4));
  }

  div.menu nav div.outer ul li.nobtn a span b {
    background-image: url(../img/menu_nobtn.png);
  }

  div.menu nav div.outer ul li.invite a span b {
    background-position: center -26px;
  }

  div.menu nav div.outer ul li.news a span b {
    background-position: center -52px;
  }

  div.menu nav div.outer ul li.kanran a span b {
    background-position: center -78px;
  }

  div.menu nav div.outer ul li.present a span b {
    background-position: center -104px;
    height: 39px;
  }

  div.menu nav div.outer ul li.data a span b {
    background-position: center -143px;
  }

  body.about div.menu nav div.outer ul li.about a,
  body.invite div.menu nav div.outer ul li.invite a,
  body.news div.menu nav div.outer ul li.news a,
  body.kanran div.menu nav div.outer ul li.kanran a,
  body.about div.menu nav div.outer ul li.about a,
  body.present div.menu nav div.outer ul li.present a,
  body.data div.menu nav div.outer ul li.data a {
    background-color: #db6570;
  }
}

/*	hover effect
============================== */
body li, body a span, a {
  transition: background-color 0.25s ease 0s;
}

@media all and (min-width: 768px) {
  .video {
    width: 512px;
    margin: 0 auto 20px;
  }
}

@media all and (max-width: 767px) {
  .video {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    margin-bottom: 2%;
    margin-left: 0;
  }

  .video iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
  }
}

/*	next pic
============================== */
figure span {
  display: block;
  height: 258px;
}

@media print {
  figure span {
    display: none;
  }
}

figcaption {
  padding: 10px 0 0;
  line-height: 1.5;
  text-align: justify;
}

@media all and (max-width: 767px) {
  figure span {
    position: relative;
    height: 0;
    padding-top: 56.25%;
  }

  figure span img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }

  figure span,
  figure span img {
    background-size: cover;
  }
}

/*	sp banner
============================== */
figure.sp_banner span {
  position: relative;
  height: 0;
  padding-top: 25%;
  background-position: center;
}

@media all and (min-width: 768px) {
  figure.sp_banner span {
    margin: -20px;
  }
}

@media all and (max-width: 767px) {
  figure.sp_banner span {
    margin: -10px;
  }
}

/*	news pic
============================== */
.pic img {
  width: 100%;
  height: auto;
  background-size: cover;
}

/*	minogashi
============================== */
.minogashi p.tbsfree,
.minogashi p.tver,
.minogashi p.paravi {
  background-size: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 110%;
}

.minogashi p.tbsfree {
  background-image: url(../img/tbsfree.jpg);
}

.minogashi p.tver {
  background-image: url(../img/tver.jpg);
}

.minogashi p.paravi {
  background-image: url(../img/paravi.jpg);
}

.minogashi p.tver a,
.minogashi p.paravi a {
  display: block;
  width: 100%;
  height: 100%;
}

@media all and (min-width: 768px) {

  .minogashi p.tbsfree,
  .minogashi p.tver,
  .minogashi p.paravi {
    width: 400px;
    margin: 0 auto;
  }

  .minogashi p.tbsfree {
    height: 72px;
  }

  .minogashi p.tver,
  .minogashi p.paravi {
    height: 169px;
    border: solid 2px #dbdbdb;
    margin-bottom: 1em;
  }

  .minogashi div.cont .inner>div {
    padding: 2em 0 1em;
  }
}

@media all and (max-width: 767px) {

  .minogashi p.tbsfree,
  .minogashi p.tver,
  .minogashi p.paravi {
    position: relative;
    height: 0;
  }

  .minogashi p.tbsfree {
    padding-top: 22.5%;
    margin-bottom: -1em;
  }

  .minogashi p.tver,
  .minogashi p.paravi {
    padding-top: 42.166666666666667%;
    border: solid 2px #cecece;
    margin-bottom: 1em;
  }

  .minogashi p.tbsfree span,
  .minogashi p.tver span,
  .minogashi p.paravi span {
    display: block;
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
  }

  .minogashi div.cont .inner>div {
    padding: 1em 1em 0.01em;
  }
}