@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Denk+One|Jockey+One');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap');

/* =========================================================
* 共通設定
========================================================= */

:root {
  --main-color: #b51313;
  --main-color-hover: #da3c3c;
  --sub-color: #b38322;
  --black: #211917;
  --pl-gray: #f8f8f8;
  --font-jp: 'font-family: 'Noto Sans JP', sans-serif;
  --font-en: 'Roboto Condensed', sans-serif;
}

html {
	scroll-behavior: smooth;
}
body{
	color: #111;
	line-height: 1.8;
	background: #f8f8f8;
	margin: 0;
	font-family: 'Noto Sans JP', sans-serif;
}
a{
	color: var(--main-color);
	outline: none;
	text-decoration: none;
}
a:hover{
	color:#c33232;
}
img{
	max-width: 100%;
}
a:focus, *:focus { outline:none; }



.jockeyOne{
	font-family: 'Jockey One', sans-serif;
}

.txt-left{text-align: left;}
.txt-right{text-align: right;}
.txt-center{text-align: center;}

.float-left {float: left;}
.float-right {float: right;}
.clear:after, .clear-left:after, .clear-right:after {display: block; content: "";}
.clear, .clear:after {clear: both;}
.clear-left, .clear-left:after {clear: left;}
.clear-right, .clear-right:after {clear: right;}

h1,h2,h3,h4,p{
	margin: 0;
}



.main-color{
	color: var(--main-color);
}
.bg-main-color{
	background: var(--main-color);
}
.sub-color{
	color: var(--sub-color);
}
.bg-sub-color{
	background: var(--sub-color);
}



.txt-gold{ color: var(--sub-color)!important;}
.txt-lblue{ color: #9CA9E8!important;}
.txt-blue{ color: #1658B4!important;}
.txt-navy{ color: #171c61!important;}
.txt-green{ color: #18A05F!important;}
.txt-pink{ color: #e6136f!important;}
.txt-lpink{ color: #EF8DAC!important;}
.txt-white{ color: #fff!important;}
.txt-lpink{color: #702381!important;}
.txt-red{color: #e21518!important;}
.txt-dred{color: #c9151e!important;}
.txt-lgreen{color: #c4c82b!important;}

.txt-ivory{color: #eee!important;}
.txt-lygreen{color: #9dc325!important;}
.txt-yellow{color: #ffd600!important;}
.txt-lpurple{color: #eb84dc!important;}

.text-red-lt{
	color: #E92A2D;
}


.font60{font-size: 60%!important;}
.font70{font-size: 70%!important;}
.font80{font-size: 80%!important;}
.font80{font-size: 80%!important;}
.font90{font-size: 90%!important;}
.font110{font-size: 110%!important;}
.font120{font-size: 120%!important;}
.font130{font-size: 130%!important;}
.font140{font-size: 140%!important;}
.font150{font-size: 150%!important;}
.font160{font-size: 160%!important;}
.font170{font-size: 170%!important;}
.font180{font-size: 180%!important;}
.font190{font-size: 190%!important;}
.font200{font-size: 200%!important;}
.font250{font-size: 250%!important;}


.bold-100 {font-weight:100;}
.bold-200 {font-weight:200;}
.bold-300 {font-weight:300;}
.bold-400 {font-weight:400;}
.bold-500 {font-weight:500;}
.bold-600 {font-weight:600;}
.bold-700 {font-weight:700;}


.bg-black{background-color: #111!important;}
.bg-white{background-color: #fff!important;}

.bg-beige{background-color:#edeae4!important;}


.v-align-middle{
	vertical-align: middle;
}

.font-normal{
	font-weight: normal;
}
.font-bold{
	font-weight: bold;
}
.font-thin{
	font-weight: 300;
}


.font-jp{
	font-family: var(--font-jp)!important;
}
.font-en{
	font-family: var(--font-en)!important;
}



.hover{
	transition: all 0.3s ease;
}
.hover:hover{
	cursor: pointer;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
.hover:hover div{
	cursor: pointer;
	filter:alpha(opacity=90);
	-moz-opacity: 0.9;
	opacity: 0.9;
	filter: brightness(1.05);
}

.bg-yellow{background: #ffd600!important;}
.bg-aqua{background: #2db2ea!important;}

.border-box-white{
	border: solid 1px #fff;
}



/* トップへ戻る　*/
#backTop{
	position: fixed;
	bottom: 10px;
	right: 10px;
	font-size: 40px;
	color: var(--main-color);
}

.ggmap {
	position: relative;
	padding-bottom: 50%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none!important;
}


.btn{
	background: var(--main-color);
	color: #fff;
	padding: 15px 10px;
	transition-duration: .3s;
}
.btn:hover{
	background: var(--main-color-hover);
	color: #fff;
}



@media screen and (max-width:768px) {
.ggmap {
	position: relative;
	padding-bottom: 80%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
}


	
/* ----------------------------------------------------
margin
/*---------------------------------------------------- */
.mt00 { margin-top:  0px !important; }
.mt05 { margin-top:  5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt30 { margin-top: 30px !important; }
.mt35 { margin-top: 35px !important; }
.mt40 { margin-top: 40px !important; }
.mt50 { margin-top: 50px !important; }
.mt60 { margin-top: 60px !important; }
.mt70 { margin-top: 70px !important; }
.mt80 { margin-top: 80px !important; }

.mr00 { margin-right:  0px !important; }
.mr05 { margin-right:  5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }
.mb00 { margin-bottom:  0px !important; }
.mb05 { margin-bottom:  5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb60 { margin-bottom: 60px !important; }
.mb70 { margin-bottom: 70px !important; }
.mb80 { margin-bottom: 80px !important; }
.mb90 { margin-bottom: 90px !important; }

.ml00 { margin-left:  0px !important; }
.ml05 { margin-left:  5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml40 { margin-left: 40px !important; }

@media screen and (max-width:768px) {
.mt-mob00 { margin-top:  0px !important; }
.mt-mob05 { margin-top:  5px !important; }
.mt-mob10 { margin-top: 10px !important; }
.mt-mob15 { margin-top: 15px !important; }
.mt-mob20 { margin-top: 20px !important; }
.mt-mob25 { margin-top: 25px !important; }
.mt-mob30 { margin-top: 30px !important; }
.mt-mob35 { margin-top: 35px !important; }
.mt-mob40 { margin-top: 40px !important; }
.mt-mob50 { margin-top: 50px !important; }
.mt-mob60 { margin-top: 60px !important; }
.mt-mob70 { margin-top: 70px !important; }
.mt-mob80 { margin-top: 80px !important; }
	
	
.mr-mob0 { margin-right: 0px !important; }
}
/* ----------------------------------------------------
padding
---------------------------------------------------- */
.pt00 { padding-top:  0px !important; }
.pt05 { padding-top:  5px !important; }
.pt10 { padding-top: 10px !important; }
.pt15 { padding-top: 15px !important; }
.pt20 { padding-top: 20px !important; }
.pt25 { padding-top: 25px !important; }
.pt30 { padding-top: 30px !important; }
.pt35 { padding-top: 35px !important; }
.pt40 { padding-top: 40px !important; }
.pr00 { padding-right:  0px !important; }
.pr05 { padding-right:  5px !important; }
.pr10 { padding-right: 10px !important; }
.pr15 { padding-right: 15px !important; }
.pr20 { padding-right: 20px !important; }
.pr25 { padding-right: 25px !important; }
.pr30 { padding-right: 30px !important; }
.pr35 { padding-right: 35px !important; }
.pr40 { padding-right: 40px !important; }
.pb00 { padding-bottom:  0px !important; }
.pb05 { padding-bottom:  5px !important; }
.pb10 { padding-bottom: 10px !important; }
.pb15 { padding-bottom: 15px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb25 { padding-bottom: 25px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb35 { padding-bottom: 35px !important; }
.pb40 { padding-bottom: 40px !important; }
.pl00 { padding-left:  0px !important; }
.pl05 { padding-left:  5px !important; }
.pl10 { padding-left: 10px !important; }
.pl15 { padding-left: 15px !important; }
.pl20 { padding-left: 20px !important; }
.pl25 { padding-left: 25px !important; }
.pl30 { padding-left: 30px !important; }
.pl35 { padding-left: 35px !important; }
.pl40 { padding-left: 40px !important; }

/* ----------------------------------------------------
grid-wide
---------------------------------------------------- */
.grid-wide-1200 .grid-container {
    max-width: 1200px;
}

.grid-wide-full .grid-container {
    max-width: 100%;
}
.grid-200{
    max-width: 200px;
	margin: 0 auto;
}
.grid-300{
    max-width: 300px;
	margin: 0 auto;
}	
.grid-400{
    max-width: 400px;
	margin: 0 auto;
}
.grid-500{
    max-width: 500px;
	margin: 0 auto;
}
.grid-600{
    max-width: 600px;
	margin: 0 auto;
}
.grid-700{
    max-width: 700px;
	margin: 0 auto;
}
.grid-800{
    max-width: 800px;
	margin: 0 auto;
}


 /* =========================================================
* レイアウト
========================================================= */
html{
	height: 100%;
}
.container{
	min-height: calc(100vh - 90px);
	padding-bottom: 100px;
}
.footer{
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 20px 0!important;
}
.content-box{
	max-width: 1200px;
	margin: 0 auto;
}
.content-box-1000{
	max-width: 1000px;
	margin: 0 auto;
}


.map {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%; /* 比率を4:3に固定 */
}

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

@media screen and (max-width: 1100px) {
.content-box{
	width: 100%;
	margin: 0 auto;
	padding: 0;
}	
}
.clearfix {
    zoom: 1;
}
.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}
.clearfix:after {
    clear: both;
}

.grid-container img{
	height: auto;
	max-width: 100%;
}



 /* =========================================================
* ヘッダー
========================================================= */

.header-logo{
	color: var(--sub-color);
	font-size: 25px;
	font-weight: bold;
	padding: 0.3em 0 0 0;
}
.header-logo a{
	color: var(--sub-color);
}

.g-navigation{
	background: rgba(255,255,255,0.8);
	background: #fff;
	padding-top: 6px;
	border-bottom: solid 1px rgba(200,183,153,0.3);
}

.g-navigation ul{
	margin: 0;
	padding: 0;
	
}
.g-navigation ul li{
	list-style: none;
	display: inline-block;
}
.g-navigation ul li a{
	text-decoration: none;
	font-size: 13px;
	padding: 0 0.7em;
	color: #5A4F50;
}
.g-navigation ul li a:hover{
	color: #346596;
}
.g-navigation img{
	max-height: 36px;
}
.g-navigation .g-link{
	text-align: right;
}


.header{
	background: #f8f8f8;
	max-width: 90%;
	margin:  0 auto;
}
.header h1{
	margin: 0 auto;
	line-height: 0;
	clear: both;
}
.header h1 img{
	max-width: 360px;
	height: auto;
	margin-top: 4px;
}
.header-logo{
	max-width: 1200px;
	margin: 0 auto;
	line-height: 0.9;
}
.header-inner{
	display: flex;
	flex-direction: row;
	border-bottom: solid 2px rgba(176,170,159,0.3);
}
.navigation{
	width: 70%;
	background: var(--pl-gray);
	/*border-bottom: solid 2px rgba(176,170,159,0.3);
	border-top: solid 1px rgba(176,170,159,0.3);*/
}
.navigation > ul > li > a{
    font-family: 'Roboto Condensed', sans-serif!important;
	text-decoration: none;
	font-size: 20px!important;
	line-height: 1.1!important;
	letter-spacing: 0.1em!important;
	display: block;
	padding: 15px 5px!important;
}
.navigation > ul > li > a:hover{
	color: #FAEFBD;
	color: rgba(233,106,90,1);
}
.navigation ul{
	margin:0 auto;
	width: 100%;
	max-width: 1200px!important;
}
.navigation ul li{
	width: 23%;
	text-align: center;
}
.navigation > ul > li:last-child a{
	border-right: none;
}


.navigation .hover:hover{
	cursor: pointer;
	filter:alpha(opacity=95);
	-moz-opacity: 0.95;
	opacity: 0.95;
	color: rgba(233,106,90,1);
}


.navigation ul li a span{
	color: #f6d300;
    font-size: 12px!important;
	display: block!important;
	font-family: 'Noto Sans Japanese', sans-serif!important;
	font-weight: 200!important;
}

.navigation ul li ul,
.navigation ul li ul li{
	display: block;
	background: var(--black);
	width: 100%;
}
.navigation ul li ul{
	border-top: dotted 1px rgba(255,255,255,0.2);
}
.navigation ul li ul li a{
	display: block;
	width: 100%;
	font-weight:200;
	font-size: 13px!important;
	line-height: 1.4;
	letter-spacing: 0;
	text-align: left;
	border-bottom: dotted 1px rgba(255,255,255,0.2);
	border-left: dotted 2px rgba(255,255,255,0.2);
	padding-left: 10px!important;
}

.navigation ul li ul{display: none;}


 @media screen and (max-width: 768px) {
	.header {
    	width: 100%;
		max-width: 100%;
	}
	.header h1 img{
		max-height: 45px;
		margin: 10px auto;
		display: block;
		width: auto;
	}
}
 
@media screen and (max-width: 1024px) {
.header-inner{
	flex-wrap: wrap;
}
.g-navigation{
	text-align: center;
}
.g-navigation .g-link{
	text-align: center;
	font-size: 12px;
	line-height: 1.5em;
	padding-bottom: 5px;
	display: none;
}
.g-navigation img{
	max-height: 28px;
	margin: 0 auto 4px auto;
}
.navigation{
	width: 100%;
}
.navigation ul li ul{
	border-top: none;
}
.navigation ul li ul li a{
	border-bottom: none;
	border-left: none;
}

 .back-2017top{
	float: none;
	display: block;
}
 .back-2017top i{
	 font-size: 14px;
 }


.menu-toggle {
	text-align: center;
	transition-duration: 0.5s;
	font-family: 'Roboto Condensed', sans-serif!important;
	border-top: solid 2px rgba(176,170,159,0.3);
}
.navigation ul,
.navigation ul li{
	display: block;
	width: 100%;
}
.navigation ul li ul li a{
	display: block;
	width: 100%;
	font-weight:200;
	font-size: 14px;
	letter-spacing: 0;
}
.navigation ul li ul{display: none;}

}







 /* =========================================================
* フッター
========================================================= */
.footer{
	background: var(--black);
	padding: 20px 10px 0 10px;
	margin-top: 0;
	color: #ddd;
	font-size: 12px;
	font-weight: 200;
	line-height: 1.6;
}
.footer .copy{
	text-align: center;
	font-size: 11px;
	padding: 20px 0;
}


 /* =========================================================
* 下層ページ
========================================================= */
.page-ttl{
    font-family: 'Roboto Condensed', sans-serif!important;
	text-decoration: none;
	font-size: 50px;
	padding: 40px 0;
	text-align: center;
	letter-spacing: 0.05em;
	line-height: 1.2;
}
.page-ttl span{
	font-size: 16px;
	display: block;
	font-family: 'Noto Sans Japanese', sans-serif;
	font-weight: 400;
	line-height: 1;
}

.program .ttl-cate{
	font-size: 80px;
	text-align: center;
	line-height: 1.2;
	margin-bottom: 30px;
}
.program .ttl-cate .kana{
	font-size: 50px;
	text-align: center;
	line-height: 1.2;
}
.program .ttl-cate.ttl-cate-s{
	font-size: 50px;
}
.program .ttl-cate .txt-eng{
	font-size: 20px;;
}


.program .lead-txt{
	text-align: center;
}

.program {
	margin-bottom: 20px;
	padding-bottom: 40px;
}
.program .film-info{
	padding: 30px 20px 10px 20px;
	margin-bottom: 50px;
	background: #fff;
	box-shadow: 0px 1px 11px -7px #4e4b4b;
	border-radius: 2px;
}


.program h3{
	font-size: 32px;
	margin: 10px 10px 10px 10px;
	line-height: 1.4;
}
.program h3 span{
	font-size: 16px;
	display: block;
	font-weight: 300;
	margin-top: 0;
}

.program h3 .wp{
	font-size: 16px;
	background: rgba(255,210,0,0.9);
	padding: 3px 10px;
	border: solid 2px #000;
	vertical-align: middle;
	position: relative;
	top: -3px;
}
.program .special{
	color: #E4495B;
	font-size: 24px;
	letter-spacing: 0.2em;
	display: block;
	border-top: double 3px #E85153;
	border-bottom: double 3px #E85153;
	padding: 10px;
}

.program p{
	line-height: 1.6;
	margin: 10px;
}
.program .flilm-txt{
	line-height: 1.4;
	font-size: 13px;
	padding: 5px;
	margin-bottom: 10px;
	color: #746768;
	border-bottom: dotted 1px rgba(81,68,68,0.38);
}
.program .time{
	line-height: 1.4;
	font-size: 13px;
	padding: 8px;
	color: #fff;
	background: var(--sub-color);
	width: 200px;
	text-align: center;
	margin: 0 10px 10px auto;
	font-weight: bold;
	
	display: none;
}

.director-info{
	border-top: dotted 1px rgba(81,68,68,0.38);
	padding: 10px;
	margin: 10px 0;
	background: #fff;
}
.director-info img.photo{
	float:left;
	max-width: 120px;
	margin: 0 auto;
	padding-right: 20px;
}
.director-info p{
	padding: 0 20px;
	color: #5c4f50;
}
.director-info b.name{
	display: block;
	margin-bottom: 10px;
	font-size: 18px;
}


.pager .selected {
	background: #171c61;
	border-radius: 50%;
	height: 18px;
	width: 20px;
	text-align: center;
	display: inline-block;
	padding-top: 3px;
}
.pager {
	font-size: 15px;
	color: #fff;
	line-height: 1;
	text-align: center;
	padding: 20px;
	font-weight: bold;
}
.pager a {
	color: #171c61;
}
.pager a:hover {
	color: #2d76d2;
}

@media screen and (max-width:768px) {
.page-ttl{
	font-size: 30px;
}
	
.program .ttl-cate{
	font-size: 44px;
	text-align: center;
	line-height: 1.2em;
}
.program .ttl-cate .kana{
	font-size: 25px;
	text-align: center;
	line-height: 1.2em;
}	
.program .ttl-cate.ttl-cate-s{
	font-size: 34px;
	padding: 0 10px;
	letter-spacing: 0;
}

.program .lead-txt{
	text-align: left;
	font-size: 90%;
}
.program .lead-txt > div{
	padding: 10px
}

.director-info{
	padding: 5px!important;
	margin-bottom: 10px;
	border: solid 1px #E5DFDB;
	background: #fff;
}
.director-info img.photo{
	float:left;
	max-width: 90px;
	margin: 0 auto;
	padding-right: 10px;
	padding-bottom: 0;
}
.director-info p{
	padding: 0!important;
	margin: 0;
	font-size: 85%;
	color: #5c4f50;
}
.director-info b.name{
	display: block;
	margin-bottom: 5px;
	font-size: 18px;
	line-height: 1;
}
.btn-trailer{
	margin: 0 0 20px auto;
	display: block;
}
}


.timetable{
	padding-bottom: 40px;
}

.timetable h2{
	text-align: center;
	padding: 10px;
	margin: 0 10px;
	line-height: 1.2;
	font-size: 30px;
	color: #fff;
}
.timetable h3{
	font-size: 25px;
}
@media screen and (max-width:768px) {
.timetable h2{
	font-size: 35px;
}
.timetable h3{
	font-size: 22px;
}
}

.timetable .timetable-inner{
	padding: 0 30px 30px 30px;
}

@media screen and (max-width:768px) {
.timetable .timetable-inner{
	padding: 0 10px 30px 10px;
}
}




.timetable .grid-container{
	border-radius: 2px;
	overflow: hidden!important;
	padding: 0!important;
	margin: 0 5px;
}
/*.timetable .grid-container > div:nth-last-child(2),
.timetable .grid-container > div:last-child{
	border-bottom: none;
}*/

.timetable .timetable-time{
	padding: 15px 10px 10px 10px;
	font-weight: bold;
	border-bottom: solid 4px #2a2a2a;
	background: #747373;
	color: #fff;
}
.timetable.tatemachi .timetable-time{
	background: #d3e4e3;
}
.timetable.tatemachi .timetable-event{
	background: #f5e67e;
}


.timetable .timetable-film{
	padding: 15px 10px 10px 10px;
	font-weight: bold;
	border-bottom: solid 4px #2a2a2a;
	background: #fff;
}


.timetable .timetable-film,
.timetable .timetable-time{
	padding: 15px 10px;
	vertical-align: middle;
	line-height: 1.4;
	min-height: 80px;
}
.timetable .timetable-film span.shortfilm{
	display: block;
	font-size: 13px;
}

.timetable .timetable-event{
	padding: 15px 10px 10px 10px;
	font-weight: bold;
	border-bottom: solid 4px #5cadc7;
	background: #fff;
}
.timetable .timetable-event-time{
	padding: 15px 10px 10px 10px;
	font-weight: bold;
	border-bottom: solid 4px #5cadc7;
	background: #747373;
	color: #fff;
}

.timetable-break{
	text-align: center;
	font-size: 14px;
	color: #eee;
	padding-bottom: 5px;
}


@media screen and (max-width:768px) {

.timetable .timetable-time,
.timetable .timetable-event{
	padding: 5px;
	font-size: 15px;
}
.timetable .timetable-time,
.timetable .timetable-event-time{
	padding: 5px;
	font-size: 12px;
}
}

.timetable a{
	color: #111;
	text-decoration: none;
}
.timetable a:hover{
	color: var(--main-color);
}


.timetable .grid-container {
    display: flex;
    flex-wrap: wrap;
	margin-bottom: 20px;
}
.timetable .timetable-film-all{
	padding: 15px 10px 10px 10px;
	font-weight: bold;
	border-bottom: dotted 1px #A19797;
	background: #CCDCE9;
}
.timetable .timetable-film-all b{
	display: block;
	font-size: 80px;
	padding: 40px 0;
	color: #3A6BAB;
}
.timetable .break{
	border-bottom: dotted 1px #A19797;
	text-align: center;
	color: #777777;
}

.timetable .short{
	background: rgba(0,0,0,0.2);
	padding: 20px 10px 0 10px;
}
.timetable .short .timetable-time{
	background: #fff;
}


.timetable .timetable-tatemachi .timetable-time {
    border-bottom: none;
	background: #262c2e;
}
.timetable .timetable-tatemachi .timetable-film {
    border-bottom: none;
}





.event {
	margin-bottom: 20px;
}
.event h2{
	font-size: 32px;
	line-height: 1.5em;
}

.event .event-time{
	line-height: 1.4;
	font-size: 32px;
	padding: 8px;
	text-align: center;
	margin: 5px auto;
	font-weight: bold;
}
.event .event-guest > div{
	padding: 10px;
	font-size: 14px;
}
.event .event-guest > div img{
	display: block;
	width: 100px;
	padding-right: 10px;
	margin: 10px auto;
}
.event .event-guest b{
	font-size: 18px;
	display: block;
	margin: 10px auto;
	text-align: center;
}
.event .event-place{
	line-height: 1.4em;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}
.event-chairman {
	padding: 10px;
	border: solid 1px rgba(0,0,0,0.2);
	line-height: 1.5;
	font-size: 13px;
}
.event-chairman img{
	width: 100px;
	float: left;
	padding-right: 5px;
}



.event-tatemachi{
	color: #11315e;
	background: #fff;
	padding: 10px 0 5px 0;
}
.event-tatemachi .event-tatemachi-txt{
	font-size: 18px;
	line-height: 1.5em;
	padding:  10px;
}
.event-tatemachi .event-tatemachi-txt h4{
	font-size: 28px;
}
.event-tatemachi .event-tatemachi-txt h4 a{
	font-size: 14px;
	font-weight: normal;
}

.talkevent{
	background: #111;
	padding: 15px 10px;
	color: #fff;
	line-height: 1.2em;
	max-width: 600px;
	margin: 0 auto;
	font-size: 20px;
}



@media screen and (max-width:768px) {
.event h2{
	font-size: 20px;
	margin-bottom: 10px;
	font-weight: bold;
}
.event h3{
	padding: 8px 5px 4px 5px;
	display: block;
	color: #fff;
	background: #1c1515;
	margin: 0 auto;
	text-align: center;
	width:  90%;
}
.event .event-time{
	line-height: 1.2;
	font-size: 26px;

}
.event .event-guest > div{
	padding: 10px;
	font-size: 13px;
	line-height: 1.5em;
	margin-bottom: 10px;
	border-radius: 10px;
}
.event .event-guest > div img{
	float: left;
	width: 70px;
	padding-right: 10px;
	margin: 0;
}
.event .event-guest b{
	font-size: 15px;
	display: block;
	margin: 10px 0;
	text-align: left;
}
.event-chairman {
	margin-top: 20px;
}
.event-chairman img{
	width: 80px;
	float: left;
	padding-right: 5px;
	padding-bottom: 3px;
}
.event-tatemachi .event-tatemachi-txt{
	font-size: 15px;
	line-height: 1.5em;
	padding:  10px;
}
}


.ticket p.price{
	text-align: center;
	padding: 15px;
	margin: 0;
	font-size: 20px;
}
.ticket p.note{
	display:inline-block;
	text-align: left;
	line-height: 1.8em;
}

.access h2{
	font-size: 20px;
	margin: 0 auto 0.5em auto;
}
.access .access-info h3{
	border-top: dotted 1px #b8afa2;
	padding-top: 5px;
	font-size: 16px;
}
.access .access-info{
	padding: 0 5px;
}


.event .event-speaker .name{
	float: left;
	margin-right: 20px;
	font-size: 18px;
	text-align: center;
	padding-bottom: 10px;
}
.event .event-speaker .name-center{
	margin-right: 20px;
	font-size: 18px;
	text-align: center;
	padding-bottom: 10px;
}
.event .event-speaker .name{
	float: left;
	margin-right: 20px;
	font-size: 18px;
	text-align: center;
	padding-bottom: 10px;
}
.event .event-speaker .name-center img,
.event .event-speaker .name img{
	width: 120px;
	padding: 4px;
	background: #fff;
	display: block;
	margin: 0 auto 10px auto;
}
.event .event-speaker .speaker-info{
	font-size: 90%;
	color: #525050;
}



@media screen and (max-width: 768px) {
.timetable .timetable-film,
.timetable .timetable-time{
	min-height: auto;
}
.program h3 .wp{
	font-size: 16px;
	background: rgba(255,210,0,0.9);
	padding: 3px 10px;
	border: solid 2px #000;
	display: inline-block;
	margin: 6px 0;
}
.program h2,
.event h2.event-ttl{
	font-size: 18px;
}
.event .event-speaker .name{
	width: 160px;
	float: none;
	margin: 10px auto;
}
.event .event-speaker .speaker-info{
	font-size: 90%;
	color: #525050;
	margin-left: 0;
}
.event .border-left{
	border-left: none;
}
.program h3{
	font-size: 20px;
	margin: 0 10px 10px 10px;
}

}


	

.fadein-s {
    opacity: 0;
    transform: translateY(30px);
    transition: all 1s;
}
.serif{
 font-family: 'Noto Serif', serif;
}
.block{
	display: block;
}
.inline-block{
	display: inline-block;
}


hr.line{
	border: none;
	width: 100%;
	height: 1px;
	background: #ddd;
	margin: 40px 0;
}
.txt-shadow{
-moz-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
-webkit-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
-ms-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
}



.lin-arrow:hover{
	opacity: .6;
}
.lin-arrow{
    position: relative;
    transition: all .3s;
	padding: 10px 25px 10px 0;
	line-height: 1.5em;
}
.lin-arrow::before{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background: #c9161f; 
    transition: all .3s;
    position: absolute;
    right: 0;
    bottom: 0;
}
.lin-arrow::after{
    content: "";
    display: block;
    width: 20px;
    height: 2px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    background: #c9161f; 
    position: absolute;
    right: -3px;
    bottom: 6px;
    transition: all .3s;
}
.lin-arrow.navy::before{
    background: #171c61; 
}
.lin-arrow.navy::after{
    background: #171c61; 
}

.lin-arrow:hover::before{
    right: -6px;
}
.lin-arrow:hover::after{
    right: -10px;
}
@media (max-width: 768px) {
	.lin-arrow{
		padding: 0 10px 10px 0;
		display: block;
		margin: 0 auto;
		text-align: center;
	}
}


.button-blueline{
	border: solid 4px var(--main-color);
	text-decoration: none;
	display: block!important;
	padding: 10px;
	text-align: center;
	font-size: 18px;
	margin: 0 auto;
	color: var(--main-color);
	letter-spacing: 0.1em;
	font-weight:600;
}
.button-blueline:hover{
	border: solid 4px var(--main-color);
	text-decoration: none;
	text-align: center;
	font-size: 18px;
	background: var(--main-color);
	color: #fff;
}

.stellarnav.dark li a {
    color: var(--black)!important;
}
.navigation > ul > li > a span{
	color: var(--black)!important;
	font-weight: 400!important;
}
.stellarnav.dark > ul > li > a:hover,
.navigation > ul > li > a:hover span{
	color: var(--main-color)!important;
	opacity: 1!important;
}
.stellarnav.dark .menu-toggle, .stellarnav.dark .call-btn-mobile, .stellarnav.dark .location-btn-mobile {
	color: var(--black);
}
.stellarnav.dark.mobile .has-sub li a:hover,
.stellarnav.dark.mobile .has-sub li a,
.stellarnav .has-sub li a:hover,
.stellarnav .has-sub li a{
	color: #fff!important;
}

@media (max-width: 1024px) {
	.stellarnav.dark li a {
    	color: #fff!important;
	}
	.navigation ul li a span{
		color: #fff!important;
		font-weight: 400!important;
	}
}




.coming-soon{
	text-align: center;
	padding: 60px 0;
	height: 40vh;
}
.coming-soon .font-en{
	font-size: 100px;
	color: #d9d9d9;
	margin-bottom: 10px;
	line-height: 0.8em;
background: #EBEBEB;
background: repeating-radial-gradient(circle farthest-corner at center center, #EBEBEB 0%, #E6E6E6 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}




.tatemachi-btn{
	position: fixed;
	right: 0;
	bottom: 8%;
	z-index: 100;
	display: inline-block;
	display: block;
	padding: 15px 10px;
	color: #000!important;
	font-weight: 500;
	width: 160px;
	line-height: 1.2em;
	border-radius: 3px 0 0 3px;
	text-align: center;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f4e002+0,f2e126+42,f4e002+78 */
background: #f4e002; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #f4e002 0%, #f2e126 42%, #f4e002 78%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #f4e002 0%,#f2e126 42%,#f4e002 78%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #f4e002 0%,#f2e126 42%,#f4e002 78%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4e002', endColorstr='#f4e002',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

-moz-box-shadow: -2px 4px 15px -7px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: -2px 4px 15px -7px rgba(0, 0, 0, 0.5);
-ms-box-shadow: -2px 4px 15px -7px rgba(0, 0, 0, 0.5);
box-shadow: -2px 4px 15px -7px rgba(0, 0, 0, 0.5);
}
.tatemachi-btn:hover{
	background: #fff0a8;
}
@media screen and (max-width:768px) {
    .navigation .tatemachi-btn{
		position: relative!important;
		right: auto;
		bottom: auto;
		z-index: 100;
		padding: 15px 10px;
		width: 100%;
		line-height: 1.2em;
		border-radius: 0;
		margin: 0;
		color: #333!important;
	}
    .navigation .tatemachi-btn b,
	.navigation .tatemachi-btn span{
		color: #333!important;
	}
}



/* ----------------------------------------------------
トップ
---------------------------------------------------- */

.ttl-top-info{
	position: relative;
}

.ttl-top-info::after{
	content: "";
	display: block;
	width: 100%;
	height: 2px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#c91e1e+50,b38322+50 */
	background: linear-gradient(to right,  #c91e1e 50%,#b38322 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
}


/* ----------------------------------------------------
アニメ
---------------------------------------------------- */
.opacity-0{
	opacity: 0;
}

body.fade-anim{
	position: relative;
}
body.fade-anim::before{
	content: "";
	display: block;
	width: 100%;
	height: 100vh;
	background: #fff;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9999;
	transition-delay: 0.3s;
	transition-duration: 1s;
	opacity: 1;
}
body.fade-anim.open::before{
	opacity: 0;
	z-index: -1;
}

.no-js body.fade-anim::before{
	opacity: 0;
	z-index: -1;
}



.sc-anim {
	 opacity: 0;
}
.sc-anim.sc-show {
	 opacity: 1;
	 transform: none;
}

.sc-anim.anim-color{
	opacity: .7;
	filter: saturate(10%);
}
.sc-anim.anim-color.sc-show{
	filter: sepia(0%);
	opacity: 1;
	filter: saturate(100%);
}


.sc-slideLeft {
	 transform: translateX(-30px);
}
.sc-slideRight{
	 transform: translateX(30px);
}
.sc-slideUp {
  transform: translateY(30px);
}
.duration-500{
	 transition-duration: 500ms;
}
.duration-1000{
	 transition-duration: 1000ms;
}
.duration-1500{
	 transition-duration: 1500ms;
}
.duration-2000{
	 transition-duration: 2000ms;
}
.duration-3000{
	 transition-duration: 2000ms;
}
.delay-300{
	transition-delay: 300ms;
}
.delay-500{
	transition-delay: 500ms;
}
.delay-1000{
	transition-delay: 1000ms;
}
.delay-1500{
	transition-delay: 1500ms;
}
.delay-2000{
	transition-delay: 2000ms;
}
.delay-3000{
	transition-delay: 3000ms;
}