/* CSS Document */
@charset "utf-8";

/* @group reset */

*{ margin: 0; padding: 0;}

ul, ol, li { list-style: none; }
a img { border: none; }
html {
  color: #333333;
  font-family : "メイリオ" , "Meiryo" , "ヒラギノ角ゴ Pro W3", arial, helvetica, hirakakupro-w3, "ms pgothic", verdana, sans-serif;
  line-height : 1.6;
  height: 100%;
}

body {
  height: 100%;
}

h2,h3,nav ul li { font-family: 'Kozuka Mincho Pro','Kozuka Mincho Std','小塚明朝 Pro R','小塚明朝 Std R','Hiragino Mincho Pro','ヒラギノ明朝 Pro W3',"Meiryo",'ＭＳ Ｐ明朝','MS PMincho',serif; }
h3,nav ul li { margin-bottom: 20px; }
h2 {
  margin-bottom: 10px;
  padding: 4px 14px 26px 14px;
  height: 3px;
  border-image: linear-gradient(to right, #28A7DE, #78feff, #0052a5, #1f3084, #ffb71c) 1/0 0 4px 0;
  border-style: solid;
}

h1 { line-height: 1; background: #FFFFFF; }
h2 { font-size: 160%; line-height: 1.3333; font-weight: normal; }
h3 { font-size: 180%; line-height: 1.3333; }
h4 { font-size: 120%; line-height: 1.53; margin-bottom: 10px; }
h5 { font-size: 110%; line-height: 1.3333;  margin: 20px 0 5px 0; }

a { text-decoration: none; color: #0052a5; }
a:hover { text-decoration: none; color: #0f8cc4; }
a {
  text-decoration: none;
  outline: none;
  text-decoration: none;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
}

hr { margin:20px 0; border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(225, 225, 225, 0.3); }

.fclear { clear: both; }
.fleft { float: left; }
.fright { float: right; }
.nobr { white-space: nowrap; }

.fs200 { font-size: 200%; }
.fs90 { font-size: 90%; }
.fs80 { font-size: 80%; }
.fs70 { font-size: 70%; }
.fs60 { font-size: 60%; }

.vhidden { visibility: hidden; }
.dblock { display: block; }

/* @end */

/* @@@@@ --------- 共通レイアウト --------- @@@@@ */

article { margin: 14px 2%; font-size: 14px; }
section { clear: both; }
img { vertical-align: middle; max-width: 100%; }

.ulbtn { float:right; margin-bottom: 10px; }
.ulbtn ul li {
    padding: 2px 10px 0 10px;
    height: 24px;
    text-align: center;
    background: #FFFFFF;
    border: 1px solid #0052a5;
}
.ulbtn ul li a { display: block; }
.ulbtn ul li { float: left; margin: 4px; }

.attention { color: #666666; font-size: 80%; float:right; }
.freebox { font-size: 90%; padding: 10px; margin-bottom: 10px; border: 1px double #e0d6c8; }

/* header&nav ----------------------------- */
h1:before { content: " "; position: relative; border-bottom: 2px solid #333; background: #4b7198; display: block; height: 2px; width: 100%; }
h1:after { content: " "; position: relative; background: #4b7198; display: block; height: 2px; width: 100%; }

header { text-align: center; }

nav {
  color: #FFFFFF;
  background: #28A7DE; /* Old browsers */
  background: -moz-linear-gradient(top, #28A7DE 0%, #1f3084 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #28A7DE 0%,#1f3084 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #28A7DE 0%,#1f3084 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28A7DE', endColorstr='#1f3084',GradientType=0 ); /* IE6-9 */
  /*min-height: 100%;*/
  background-attachment: fixed;
  min-height: 100%;
}
#navtitle {
  background: #2e679f;
  border-radius: 3px 3px 0 0;
}
nav ul li {

  border-bottom: 1px solid rgba(225, 225, 225, 0.5); text-align: center; margin: 0; padding: 5px 0; }
nav ul li a { display: block; color: #FFFFFF; padding: 10px 0; }
nav ul li a:hover { color: #aedbf5; }

/* calenderpage ----------------------------- */
.calenderpage table { width: 100%; }
.calenderpage table tr td { padding: 4px 0; border-bottom: 1px dashed #f0f0f0; }
.calenderpage table tr td.date { width: 50px; padding-right: 10px; vertical-align: top; font-size: 90%; white-space: nowrap; }

/* textpage ----------------------------- */
.open { cursor: pointer; }
.slideBox { display:none; }
.slideBox dl { padding-bottom: 30px; }
.textpage h4 { margin-bottom: 12px; border-bottom: 2px solid #003fa6; }

.textpage dl dt { color: #00649d; font-size: 110%; }
.textpage dl dd { margin-bottom: 10px; font-size: 90%;  }
.textimg { max-width: 100%; margin-bottom: 20px;  text-align: center; }

/* schedulepage ----------------------------- */
.schedulepage section { margin: 20px 0; padding-bottom: 10px; border-bottom: 1px solid #cccccc; }
.schedulepage dl { margin: 20px 0; }
.schedulepage dl dt { color: #00649d; font-size: 110%; font-weight: bold; }
.schedulepage dl dd { margin-bottom: 10px; }
.schedulepage h4 {
    font-family: 'Kozuka Mincho Pro','Kozuka Mincho Std','小塚明朝 Pro R','小塚明朝 Std R','Hiragino Mincho Pro','ヒラギノ明朝 Pro W3',"Meiryo",'ＭＳ Ｐ明朝','MS PMincho',serif;
    font-size: 155%; }

/* casterpage ----------------------------- */
.casterpage section { margin: 20px 0; padding-bottom: 20px; border-bottom: 1px solid #cccccc; }
.casterpage h3 { font-size: 210%; }
.casterpage img {
  border-radius: 25px;
  box-shadow: 0px 1px 1px rgba(132, 132, 132, 0.8);
  -webkit-box-shadow: 0px 1px 1px rgba(132, 132, 132, 0.8);
  -moz-box-shadow: 0px 1px 1px rgba(132, 132, 132, 0.8);
}

/* moviepage ----------------------------- */
table.ulizatable tr td { padding: 2px 10px; height: 34px; border: 1px #e0d6c8 solid; }

.tooltip {
    color: #2785C0;
    cursor: default;
}

.tooltip > .tooltip-body {
    display: inline-block;
    visibility: hidden;
    position: absolute;
    z-index: 100;
    margin: -16px 0 0 16px;
    padding: 16px 24px;
    border-radius:3px;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
    background-color: #666666;
    max-width: 700px;
    color: #FFF;
    font-size: small;
    font-weight: normal;
    text-align: left;
    line-height: 1.5em;
    justify-content: center;
    opacity: 0;
    transition: opacity 200ms ease 0s, visibility 0ms linear 200ms;
}

.tooltip:hover > .tooltip-body {
    visibility: visible;
    opacity: 1;
    transition: opacity 300ms ease 0s, visibility 0ms linear;
}

/*
Balloon beak.
*/
.tooltip > .tooltip-body:before {
    display: inline-block;
    position: absolute;
    margin-left: -30px;
    border-width: 6px 6px 6px medium;
    border-style: solid solid solid none;
    border-color: transparent #666666;
    content: "";
}

article.moviepage p {
  max-width: 640px;
  margin: 0 auto;
}




/* spmoviepage ----------------------------- */
.spmoviepage section a { color: #FFFFFF; font-size: 200%; }
.spmoviepage section div.btn { margin: 10px 0; padding: 10px; text-align:center; }
.spmoviepage section div.btn a { margin: 10px 0; padding: 10px; display:block; }
.spmoviepage .icon { width: 80px; color: #2f9cb7; text-align: center; }
.spmoviepage .q .icon { color: #2f9cb7; float: left; margin-right: 10px; }
.spmoviepage .a .icon { color: #ce5e70; float: right; margin-left: 10px; }
.spmoviepage .icon-happy { font-size: 80px; color: #70c8de; }
.spmoviepage .icon-happy2 { font-size: 80px; color: #d97989; }
.spmoviepage .q,.spmoviepage .a {
    width: 80%;
    min-height: 50px;
    margin: 15px 0;
    padding: 15px;
    border: solid 1px #cccccc;
    text-align: left;
}
.spmoviepage .q { background:#f5fafa; float:left; }
.spmoviepage .a { background:#fcf5f6; float:right; }

/* specialpage ----------------------------- */
ul.ulspecial li { margin: 5px 0; }
.youtubebox {
position: relative ;
max-width:640px;
margin: 1.2em auto;
padding-top: 69px ;
padding-bottom: 50% ;
overflow: hidden ;
}
.youtubebox iframe {
position: absolute ;
top: 0 ;
left: 0 ;
height: 100% ;
width: 100% ;
max-width:640px;
}

.ulizabox { text-align: center; margin-bottom: 20px; }

/* opinionpage ----------------------------- */


/* toppage ----------------------------- */
#rate {
  min-height: 210px; padding:4px 14px; margin-bottom: 20px; position: relative;
    background: #28A7DE; /* Old browsers */
    background: -moz-linear-gradient(top, #28A7DE 0%, #1f3084 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #28A7DE 0%,#1f3084 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #28A7DE 0%,#1f3084 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28A7DE', endColorstr='#1f3084',GradientType=0 ); /* IE6-9 */
    color:#FFFFFF;
}
#rate h3, .rateGuest, .rateVoice { font-family: 'Kozuka Mincho Pro','Kozuka Mincho Std','小塚明朝 Pro R','小塚明朝 Std R','Hiragino Mincho Pro','ヒラギノ明朝 Pro W3',"Meiryo",'ＭＳ Ｐ明朝','MS PMincho',serif; }

.rateDate { color: #fff2bd; }
.rateGuest div { display: table; margin-bottom: 8px; line-height: 1.3em; }
.rateGuest span { display: table-cell; }
.rateGuest div span.name { font-size: 110%; padding-right: 14px; white-space: nowrap; }

#rate h3 { margin-bottom: 8px; }
.rateVoice h4 { margin: 4px 0; color: #fff2bd; }
#rate hr { margin: 6px 0; }

#ratebtn { position: absolute; right: 14px; top: 14px; text-align: center; font-weight: bold; line-height: 2; }
#ratebtn ul li { margin-bottom: 20px; }
#ratebtn ul li a { display: block; color: #fff2bd; }
#ratebtn ul li a:hover { color: #aedbf5; }

.scheduletable { width: 100%; }
.movietable { width: 460px; }

table.scheduletable, table.movietable, table.ulizatable { border-collapse: collapse; margin-bottom: 5px; }
table.scheduletable tr td, table.movietable tr td { padding: 2px; height: 34px; border: 1px #e0d6c8 solid; }
table.movietable tr td, table.ulizatable tr td { text-align:center; }
table.scheduletable tr td { text-align:left; }
.day { width: 68px; font-size: 90%; background: #f1f6f7; }
#MonDay,#TueDay,#WedDay,#ThuDay,#FriDay { text-align:center; background: #f1f6f7; }

#schedule, #movie, #bnr img { margin-bottom:10px; }

.streamingBtn { width: 170px; background: #0669b2; border-radius: 3px; color: #fff; font-weight: bold; font-size: 130%; text-align: center; margin: 5px auto; padding: 5px; }

#contact {
  display: flex;
  margin-bottom: 10px;
}
#contact .myvoice a {
  color: #fff;
}
#contact .myvoice a:hover {
  color: #c9e9ef;
}
#contact .myvoice {
  background: linear-gradient(to bottom, #28A7DE 0%,#1f3084 100%);
  color: #fff;
  border: 3px double #fff;
  border-radius: 5px;
  padding: 10px;
  margin-right: 10px;
  width: 60px;
  text-align: center;
}
#contact .myvoice span {
  font-size: 0.5rem;
  display: block;
}
#contact .myvoice span.icon-pencil {
  font-size: 1.5rem;
}

#contact .tel {
  background: #333;
  color: #fff;
  border: 3px double #fff;
  border-radius: 5px;
  padding: 10px;
}
#contact .tel h4 {
  font-size: 0.9rem;
  margin-bottom: 5px;
}
#contact .tel span {
  font-size: 0.7rem;
}

.wrapper_top { overflow: hidden; }
.wrapper { overflow: hidden; }




/* @@@@@ --------- 幅640px未満 スマホ ------------------------------------------------------------------------------------------------------------------- @@@@@ */
@media screen and (max-width: 639px) {
.hidden_sp { display: none; }

/* header&nav ----------------------------- */
nav ul { display: table; width: 100%; }
nav ul li {
    width: 50%;
    table-layout: fixed;
    display: table-cell;
    vertical-align: middle;
    padding: 0;
}
nav ul li a { padding: 10px 0; line-height: 1rem; }
.navright { border-left: 1px solid #FFFFFF; }

/* toppage ----------------------------- */
#rightbox { width: 100%; clear: both; }
#rate h3 .rateDate { font-size:70%; }
#rate h3 .rateTheme { font-size:105%; }

table.ulizatable tr td {
  text-align: left;
}

.casterpage h3 span {
  display: block;
}


}/* --------- @@@@@ --------- */



/* @@@@@ --------- 幅640px以上 タブレット＆PC ----------------------------------------------------------------------------------------------------------- @@@@@ */
@media screen and (min-width: 640px) {

html { background: url(../images/bg.jpg) repeat-x #FFFFFF; }
#contents { max-width: 1024px; margin: 15px auto; background: #fff; background-size: 18% auto; padding-left: 10px; min-height: 100vh; height: 100%; box-sizing: border-box; }
#main { width: 80%; min-height: 600px; margin: 0 1%; padding-bottom: 30px; float: left; }

/* header&nav ----------------------------- */
#headerpc { display: block; width: 100%; height: 115px; }
h1 { background: url(../images/header.jpg?190401) center no-repeat #5BD0F6; }

nav {
  float: left;
  width: 18%;
  /*box-sizing: border-box;*/
  /*padding-bottom: 32768px;*/
  /*margin-bottom: -32768px;*/
}
nav ul li { background: none; }
nav ul li.twitter { margin: 0; padding: 0; border-bottom: 1px dotted rgba(225, 225, 225, 0.5);  }
nav ul li.mobile { margin: 0 0 10px 0; padding: 10px 0; border-bottom: 1px dotted rgba(225, 225, 225, 0.5);  }
nav ul li.bsfuji { margin: 0 0 20px 0; padding-bottom: 10px; border-bottom: 1px dotted rgba(225, 225, 225, 0.5);  }

/* textpage ----------------------------- */
.textpage dl { float: left; }
#rate h3 .rateDate { font-size:70%; }
#rate h3 .rateTheme { font-size:130%; }

}/* --------- @@@@@ --------- */



/* @@@@@ --------- 幅640px以上 769px未満 タブレットのみ ------------------------------------------------------------------------------------------------- @@@@@ */
@media screen and (min-width: 640px) and (max-width: 768px)  {
.hidden_tl { display: none; }
#rightbox { width: 100%; clear: both; }

#bnr img { width: 48%; margin-right: 2%; float: left;}
table.ulizatable tr td {
  text-align: left;
}
}/* --------- @@@@@ --------- */


/* @@@@@ --------- 幅769px以上 PCのみ --------- @@@@@ */
@media screen and (min-width: 769px) {
.hidden_pc { display: none; }
.wrapper { max-width: 1024px; margin: 0 auto; padding-top: 12px; background: #FFFFFF; min-height: 100%; }
.wrapper_top { width: 1024px; margin: 0 auto; padding-top: 12px; background: #FFFFFF; min-height: 100%; overflow: hidden; }

table.ulizatable { width:640px; margin: 0 auto; }
.ulizabox { width: 640px; margin: 0 auto; }

/* toppage ----------------------------- */
.toppage { width: 780px; }
.toppage #rate { width: 432px; }
#centerbox { width: 460px; float:left; }
#rightbox { width: 310px; float: right; }
.scheduletable { font-size: 80%; }

}/* --------- @@@@@ --------- */







/* footer ----------------------------- */
footer {
    padding: 20px;
    background: #001f3e;
    font-size: 70%;
    color: #baa994;
    text-align: center;
}
footer a { text-decoration:none; color:#e7d7c2; }
footer a:hover { text-decoration:none; color:#e7d7c2; }
footer div { margin: 10px 0; font-size: 10px; }



/* ----------------------- css hack & clearfix --------------------- */
*:first-child+html {
}

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}