/*	reset
============================== */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,main {margin:0;padding:0;border:0;font-size:100%;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display:block;}
body {font-family:Verdana,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
wbr:after {content:"\00200B";}

/*	TBS reset
============================== */
.alt {position:absolute;top:-5000px;left:-9999px;}
.clearfix:after {content:"";clear:both;display:block;}
.hide-txt {text-indent:110%;white-space:nowrap;overflow:hidden;}
.fp-causion {display:none;}
.nocontxt {-webkit-touch-callout: none;-webkit-user-select: none;user-select: none;-webkit-user-drag:none;}
.nocontxt img {pointer-events: none;}
@media all and (min-width:768px) {
.alt-pc {position:absolute;top:-5000px;left:-9999px;}
.clearfix-pc:after {content:"";clear:both;display:block;}
.hide-txt-pc {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
@media all and (max-width:767px) {
.alt-smp {position:absolute;top:-5000px;left:-9999px;}
.clearfix-smp:after {content:"";clear:both;display:block;}
.hide-txt-smp {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
div.embed-tbsplayer {
background-color:#000;
position:relative;
height:0;
padding-top:56.25%;
}
div.embed-tbsplayer .tbs-player {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
}
div.embed-tbsplayer-audio {
background-color:#fff;
}
div.embed-tbsplayer-audio .tbs-player {
height:46px;
}
div.lbx-overlay {
z-index:10000;position:absolute;background-color:#000;width:100%;height:100%;left:0;top:0;right:0;bottom:0;opacity:0.9;
}


/*	fonts
============================== */
@font-face {
   font-family: 'Libre Baskerville', serif;
   src: url('../fonts/LibreBaskerville-Regular.ttf') format("truetype");
}


/*	both
============================== */
img{
	vertical-align:bottom;
}
.cleartext {
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

@media all and (min-width: 768px) {
	.pc-none{
		display: none;
	}
	.sp-none{
		display: block;
	}
	.br-pc {
		display:block;
	}
	.br-sp {
		display:none;
	}
}

@media all and (max-width: 767px) {
	.pc-none{
		display: block;
	}
	.sp-none{
		display: none;
	}
	.br-pc {
		display:none;
	}
	.br-sp {
		display:block;
	}
}


/*	text
============================== */
body {
  font-family : 'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', '游明朝体', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', 'ヒラギノ明朝 Pro W3', 'ＭＳ Ｐ明朝', 'Times', 'Times New Roman', serif ;
  word-break: break-all;
  color:#231815;
}
a:link {
	text-decoration:none;
	color:#2d3450;
}
a:visited {
	text-decoration:none;
	color:#2d3450;
}
a:hover {
	text-decoration:underline;
	color:#2d3450;
}
a:active {
	text-decoration:underline;
	color:#2d3450;
}
.news-text a:link {
	text-decoration:underline;
	color:#2d3450;
	font-weight: bold;
}
.news-text a:visited {
	text-decoration:underline;
	color:#2d3450;
}
.news-text a:hover {
	text-decoration:none;
	color:#2d3450;
}
a:active {
	text-decoration:none;
	color:#2d3450;
}
.copyright a:link{color:#2d3450; text-decoration:none}
.copyright a:visited{color:#2d3450; text-decoration:none}
.copyright a:active{color:#2d3450; text-decoration:none}
.copyright a:hover{color:#2d3450; text-decoration:none; opacity: 0.6; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)"; transition:all 0.5s ease;
}


/*	contents
============================== */
.cover{

}
#top-main-area{
	width: 100%;
	overflow: hidden;
}
.infoimg{
	width: 100%;
	margin: 0 auto;
}
.infoimg img{
	width: 100%;
}
/*FOOTER*/
#under-footer{
	background: #fff;
	box-shadow: 0px -2px 20px 0 rgba(0,0,0,0.3);
}
.under-footer-inner{
	position: relative;
}
.btn-topback img{
	width: 100%;
}
.footer-logo img{
	width: 100%;
}
.copyright {
	letter-spacing: 0.2em;
	line-height: 1.8em;
	text-align: center;
}
.footer-banner img{
	width: 100%;
}
.fadeInUpTrigger{
	opacity: 0;
}

@media all and (min-width: 768px) {
	#top-main-area{
		height: 1062px;
	}
	.top-main{
		width: 1080px;
		margin: 0 auto;
		position: relative;
	}
	.top-main-visual{
		width: 750px;
		height: 1062px;
		position: absolute;
		right: 25px;
	}
	.top-main-side{
		width: 250px;
		padding: 55px 0 0 0;
		position: absolute;
		left: 25px;
	}
	.main-logo{
		width: 230px;
		height: 37px;
		margin: 0 auto 25px;
		background: url("../img/logo_pc_2x.png") no-repeat;
		background-size: cover;
	}
	.main-logo-sp{
		display: none;
	}
	.main-roadshow{
		width: 248px;
		height: 130px;
		margin: 0 auto 10px;
		background: url("../img/roadshow_05_2x.png") no-repeat;
		background-size: cover;
	}
	#info-1{
		
	}
	.info-h2{
		font-size: 56px;
		line-height: 1.5em;
		font-weight: normal;
		text-align: center;
		margin: 0 auto 0.4em;
	}
	.info-category{
		font-size: 12px;
		font-weight: bold;
		letter-spacing: 0.8em;
		line-height: 1.5em;
		font-family: 'Libre Baskerville', serif;
		font-style: italic;
		text-align: center;
		margin: 0 auto 0;
	}
	.infoimg{
		width: 100%;
		margin: 0.5em auto 2em;
	}
	.infoimg img{
		width: 100%;
	}
	.modaal-content-container{
		height: 600px;
		padding: 5% 10%;
		background: url("../img/info_bg.jpg");
		background-size: cover;
		overflow-y: scroll;
		border: 2px solid #231815;
        /*
		-ms-overflow-style: none; 
        scrollbar-width: none;
		*/
	}
	/*
	.modaal-content-container::-webkit-scrollbar {
        display:none;
    }
	*/
	.info-h3{
		font-size: 20px;
		font-weight: bold;
		line-height: 1.6em;
		margin: 1em auto 0.5em;
	}
	.info-h4{
		font-size: 18px;
		font-weight: bold;
		line-height: 1.6em;
		margin: 1em auto 0.5em;
		color: #ff66b3;
	}
	.info-text{
		font-size: 16px;
		line-height: 1.6em;
		margin: 0 auto 1em;
	}
	.info-text-caution{
		font-size: 12px;
		line-height: 1.4em;
		margin: 0 auto 2em;
	}
	.main-pvbanner{
		width: 238px;
		margin: 0 auto 10px;
	}
	.main-pvbanner img{
		width: 100%;
	}
	.side-banner-block{
		/*margin: 0 auto 20px;*/
		margin: 0 auto 10px;
	}
	.sidebanner,
	.side-banner-event{
		width: 226px;
		margin: 0 auto 5px;
	}
	.sidebanner img,
	.side-banner-event img{
		width: 100%;
	}
	.main-twitter-block{
		width: 230px;
		margin: 15px auto 0;
		box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
	}
	.top-twitter-wrap{
		width: 200px;
		height: 300px;
		padding: 15px 15px 0 15px;
		background: #ffffff;
		overflow: auto;
		-ms-overflow-style: none;    /* IE, Edge 対応 */
        scrollbar-width: none;       /* Firefox 対応 */
	}
	.top-twitter-wrap::-webkit-scrollbar {  /* Chrome, Safari 対応 */
        display:none;
    }
	.h2_update{
		background: #fea9bf;
		text-align: center;
		padding: 12px 0 8px;
		color: #ffffff;
		font-family: 'Libre Baskerville', serif;
		letter-spacing: 0.2em;
	}
	.update-box{
		margin-bottom: 1.6em;
		padding-bottom: 0.8em;
		border-bottom: 1px solid #2c2422;
	}
	.update-date{
		color: #fea9bf;
		font-size: 12px;
		font-weight: bold;
		margin-bottom: 0.5em;
	}
	.update-text{
		font-size: 12px;
		line-height: 1.5em;
	}
	.twitter_banner_sp{
		display: none;
	}
	#top-intro-area{
		width: 100%;
		height: 875px;
		position: relative;
	}
	.intro-bg-wrap{
		width: 100%;
		height: 875px;
		position: absolute;
		top: 0;
		left: 0;
	}
	.intro-bg-loop{
		
	}
	.intro-bg-loop01{
		width: 100%;
		height: 175px;
		background: url("../img/bg_intro_long_01_2x.jpg") repeat-x;
		background-position: 0 0;
		background-size: 1866px 175px;
		-webkit-animation: bgrooprigth 60s linear infinite;
		animation: bgroopright 60s linear infinite;
	}
	.intro-bg-loop02{
		width: 100%;
		height: 175px;
		background: url("../img/bg_intro_long_02_2x.jpg") repeat-x;
		background-position: 0 0;
		background-size: 1866px 175px;
		-webkit-animation: bgroopleft 60s linear infinite;
		animation: bgroopleft 60s linear infinite;
	}
	.intro-bg-loop03{
		width: 100%;
		height: 175px;
		background: url("../img/bg_intro_long_03_2x.jpg") repeat-x;
		background-position: 0 0;
		background-size: 1866px 175px;
		-webkit-animation: bgrooprigth 60s linear infinite;
		animation: bgroopright 60s linear infinite;
	}
	.intro-bg-loop04{
		width: 100%;
		height: 175px;
		background: url("../img/bg_intro_long_04_2x.jpg") repeat-x;
		background-position: 0 0;
		background-size: 1866px 175px;
		-webkit-animation: bgroopleft 60s linear infinite;
		animation: bgroopleft 60s linear infinite;
	}
	.intro-bg-loop05{
		width: 100%;
		height: 175px;
		background: url("../img/bg_intro_long_05_2x.jpg") repeat-x;
		background-position: 0 0;
		background-size: 1866px 175px;
		-webkit-animation: bgrooprigth 60s linear infinite;
		animation: bgroopright 60s linear infinite;
	}
	@-webkit-keyframes bgroopright {
		from {
			background-position: 0  0;
		}
		to {
			background-position: 1866px 0;
		}	
	}
	@keyframes bgroopright {
		from {
			background-position: 0 0;
		}
		to {
			background-position: 1866px 0;
		}
	}
	@-webkit-keyframes bgroopleft {
		from {
			background-position: 0  0;
		}
		to {
			background-position: -1866px 0;
		}
	}
	@keyframes bgroopleft {
		from {
			background-position: 0 0;
		}
		to {
			background-position: -1866px 0;
		}
	}
	.intro-text-wrap{
		width: 1080px;
		height: auto;
		margin: 0 auto;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.intro-text{
		width: 1040px;
		height: 696px;
		margin: 0 auto;
		background: url("../img/menu_pc_2x.png") no-repeat;
		background-size: cover;
	}
	.top-menu{
		width: 676px;
		display: flex;
		flex-wrap: wrap;
		position: absolute;
		top: 210px;
		left: 210px;
	}
	.top-menu-list{
		width: 153px;
		margin: 8px;
	}
	.top-menu-list img{
		width: 100%;
	}
	#top-staffcast-area{
		width: 100%;
		height: 780px;
		padding: 100px 0 90px;
		background: url("../img/staffcast_bg.jpg");
		background-position: center bottom;
		background-size: cover;
		position: relative;
	}
	.staffcast-text{
		width: 798px;
		height: 738px;
		background: url("../img/staffcast_pc_2x.png") no-repeat;
		background-size: cover;
		margin: 0 auto;
	}
	
	/*FOOTER*/
	#top-footer{
		width: 100%;
		background: #fff;
		box-shadow: 0px -2px 20px 0 rgba(0,0,0,0.3);
	}
	.top-footer-inner{
		width: 1030px;
		margin: 0 auto 0;
		padding: 80px 0 60px;
		position: relative;
	}
	.top-footer-bannerarea{
		width: 870px;
		margin: 0 auto 48px;
	}
	.footer-banner{
		width: 270px;
		margin: 10px 10px;
		float: left;
	}
	.movie_banner_sp,
	.top-sharenav-sp{
		display:none;
	}
	/*FOOTER*/
	.btn-topback{
		width: 220px;
		height: 76px;
		position: absolute;
		top: -75px;
		left: 405px;
	}
	.footer-logo{
		width: 560px;
		margin: 0 auto;
	}
	.footer-date{
		font-size: 30px;
		letter-spacing: 0.5em;
		text-align: center;
		margin: 50px auto 30px;
		font-family: 'Libre Baskerville', serif;
	}
	.copyright {
		font-size: 12px;
	}

}


@media all and (max-width: 767px) {
	
	#top-main-area{
		padding: 0 0;
	}
	.top-main{
		width: 100%;
		margin: 0 auto;
		position: relative;
	}
	.top-main-visual{
		width: 100%;
		position: relative;
		padding-top: 141%;
	}
	.top-main-side{
		padding: 2% 0 7%;
	}
	.main-logo,
	.main-roadshow{
		display: none;
	}
	
	.main-logo-sp{
		width: 84%;
		margin: 0 auto;
		padding-top: 25%;
		background: url("../img/main_logo_sp_03.png") no-repeat;
		background-size: contain;
		position: absolute;
		bottom: 2%;
		left: 8%;
		z-index: 90;
	}
	.main-twitter-block{
		display: none;
	}
	.side-banner-block{
		width: 98%;
		display: flex;
		margin: 2% auto 4%;
	}
	.sidebanner{
		width: 50%;	
	}
	.sidebanner img{
		width: 100%;
	}
	.main-pvbanner{
		display: none;
	}
	.movie_banner_sp,
	.twitter_banner_sp,
	.side-banner-event-block{
		width: 80%;
		margin: 0 auto 3%;
	}
	.movie_banner_sp img,
	.twitter_banner_sp img,
	.side-banner-event-block img{
		width: 100%;
	}
	.info-h2{
		font-size: 2em;
		line-height: 1.5em;
		font-weight: normal;
		text-align: center;
		margin: 0 auto 0.4em;
	}
	.info-category{
		font-size: 0.4em;
		font-weight: bold;
		letter-spacing: 0.8em;
		line-height: 1.5em;
		font-family: 'Libre Baskerville', serif;
		font-style: italic;
		text-align: center;
		margin: 0 auto 0.2em;
	}
	.infoimg{
		width: 100%;
		margin: 0.5em auto 2em;
	}
	.infoimg img{
		width: 100%;
	}
	.info-h3{
		font-size: 1.1em;
		line-height: 1.6em;
		margin: 1em auto 0.5em;
	}
	.info-h4{
		font-size: 1em;
		line-height: 1.6em;
		margin: 1em auto 0.5em;
		color: #ff66b3;
	}
	.info-text{
		font-size: 0.9em;
		line-height: 1.6em;
		margin: 0 auto 1em;
	}
	.info-text-caution{
		font-size: 0.7em;
		line-height: 1.5em;
		margin: 0 auto 2em;
	}
	.modaal-content-container{
		height: 400px;
		padding: 0% !important;
		background: url("../img/info_bg.jpg");
		background-size: cover;
		overflow-y: scroll;
		border: 2px solid #231815;
        -ms-overflow-style: none; 
        scrollbar-width: none;
	}
	.modaal-inner-wrapper{
		padding: 80px 15px;
	}
	#top-intro-area{
		width: 100%;
		height: auto;
		position: relative;
	}
	.intro-bg-wrap{
		width: 100%;
		height: auto;
	}
	.intro-bg-loop01{
		background: url("../img/bg_intro_long_01_2x.jpg") repeat-x;
		-webkit-animation: bgrooprigth 60s linear infinite;
		animation: bgroopright 60s linear infinite;
	}
	.intro-bg-loop02{
		background: url("../img/bg_intro_long_02_2x.jpg") repeat-x;
		-webkit-animation: bgroopleft 60s linear infinite;
		animation: bgroopleft 60s linear infinite;
	}
	.intro-bg-loop03{
		background: url("../img/bg_intro_long_03_2x.jpg") repeat-x;
		-webkit-animation: bgrooprigth 60s linear infinite;
		animation: bgroopright 60s linear infinite;
	}
	.intro-bg-loop04{
		background: url("../img/bg_intro_long_04_2x.jpg") repeat-x;
		-webkit-animation: bgroopleft 60s linear infinite;
		animation: bgroopleft 60s linear infinite;
	}
	.intro-bg-loop05{
		background: url("../img/bg_intro_long_05_2x.jpg") repeat-x;
		-webkit-animation: bgrooprigth 60s linear infinite;
		animation: bgroopright 60s linear infinite;
	}
	.intro-bg-loop01,
	.intro-bg-loop02,
	.intro-bg-loop03,
	.intro-bg-loop04,
	.intro-bg-loop05{
		width: 100%;
		height: 120px;
		background-position: 0 0;
		background-size: cover;
	}
	@-webkit-keyframes bgroopright {
		from {
			background-position: 0  0;
		}
		to {
			background-position: 1493px 0;
		}	
	}
	@keyframes bgroopright {
		from {
			background-position: 0 0;
		}
		to {
			background-position: 1493px 0;
		}
	}
	@-webkit-keyframes bgroopleft {
		from {
			background-position: 0  0;
		}
		to {
			background-position: -1493px 0;
		}
	}
	@keyframes bgroopleft {
		from {
			background-position: 0 0;
		}
		to {
			background-position: -1493px 0;
		}
	}
	.intro-text-wrap{
		width: 100%;
		height: auto;
		margin: 0 auto;
		position: absolute;
		top: 56%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.intro-text{
		width: 100%;
		margin: 0 auto;
		padding-top: 154%;
		background: url("../img/menu_sp_2x.png") no-repeat;
		background-size: contain;
	}
	.top-menu{
		width: 82%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end; 
		position: absolute;
		top: 22%;
		left: 7%;
	}
	.top-menu-list{
		width: 30%;
		margin: 1%;
	}
	.top-menu-list img{
		width: 100%;
	}
	.top-menu :nth-child(1) { order: 1; }
	.top-menu :nth-child(2) { order: 2; }
	.top-menu :nth-child(3) { order: 3; }
	.top-menu :nth-child(4) { order: 4; }
	.top-menu :nth-child(5) { order: 6; }
	.top-menu :nth-child(6) { order: 5; }
	.top-menu :nth-child(7) { order: 7; }
	.top-menu :nth-child(8) { order: 8; }
	#top-staffcast-area{
		width: 100%;
		padding: 15% 0 20%;
		background: url("../img/staffcast_bg.jpg");
		background-position: center bottom;
		background-size: cover;
		position: relative;
	}
	.staffcast-text{
		width: 90%;
		margin: 0 auto;
		padding-top: 115%;
		background: url("../img/staffcast_sp_2x.png") no-repeat;
		background-size: contain;
	}
	/* FOOTER */
	#top-footer{
		padding: 0 0 5em;
		position: relative;
		box-shadow: 0px -2px 20px 0 rgba(0,0,0,0.3);
	}
	.top-footer-inner{
		margin: 0 auto;
		padding: 0 0 0;
	}
	.top-footer-bannerarea{
		width: 65%;
		margin: 0 auto 6%;
	}
	.footer-banner{
		width: 100%;
		margin: 0 0 0.5em;
		float: left;
	}
	#under-footer{
		padding: 0 0 3em;
	}
	.btn-topback{
		width: 150px;
		height: 52px;
		position: absolute;
		top: -50px;
		left: 31%;
	}
	.footer-logo{
		width: 80%;
		margin: 0 0 1em 11%;
		padding: 3em 0 0;
	}
	.footer-logo img{
		width: 100%;
	}
	.footer-date{
		font-size: 1.2em;
		letter-spacing: 0.3em;
		text-align: center;
		margin: 1em auto 1.7em;
		font-family: 'Libre Baskerville', serif;
	}
	.copyright {
		width: 90%;
		margin: 0 auto;
		font-size: 0.6em;
		line-height: 1.8em;
		text-align: center;
	}
}


/*	UNDERPAGE_TEMP
============================== */

.under-header-logo img{
	width: 100%	
}
#under-h2-area{
	width: 100%;
	background: url("../img/bg_h2_area.jpg") no-repeat;
	background-position: center bottom;
	background-size: cover;
}
#under-contents{
	width: 100%;
	background: #fff2f2;
}
.under-contents-inner{
	width: 100%;
	margin: 0 auto;
}


@media all and (min-width: 768px) {
	#under-header{
		width: 100%;
		height: 60px;
		padding: 35px 0 20px;
		background: #ffffff;
		box-shadow: 0px 2px 20px 0 rgb(0,0,0,30%);
	}
	.under-header-inner{
		width: 980px;
		margin: 0 auto;
		position: relative;
		clear: both;
	}
	.under-header-logo{
		width: 320px;
		margin: 0 40px 0 0;
		float: left;	
	}
	#under-header-nav{
		width: 620px;
		float: left;
		display: flex;
		flex-wrap: wrap;
	}
	.under-header-nav-list{
		margin-right: 20px;	
	}
	.header-nav-01 a{
		width: 70px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: 0 0;
		display: block;
	}
	.header-nav-01 a:hover{
		background-position: 0 -30px;
	}
	.header-nav-02 a{
		width: 79px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -967px 0;
		display: block;
	}
	.header-nav-02 a:hover{
		background-position: -967px -30px;
	}
	.header-nav-03 a{
		width: 158px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -266px 0;
		display: block;
	}
	.header-nav-03 a:hover{
		background-position: -266px -30px;
	}
	.header-nav-04 a{
		width: 152px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -424px 0;
		display: block;
	}
	.header-nav-04 a:hover{
		background-position: -424px -30px;
	}
	.header-nav-05 a{
		width: 116px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -576px 0;
		display: block;
	}
	.header-nav-05 a:hover{
		background-position: -576px -30px;
	}
	.header-nav-06 a{
		width: 93px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -692px 0;
		display: block;
	}
	.header-nav-06 a:hover{
		background-position: -692px -30px;
	}
	.header-nav-07 a{
		width: 105px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -785px 0;
		display: block;
	}
	.header-nav-07 a:hover{
		background-position: -785px -30px;
	}
	.header-nav-08 a{
		width: 77px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -890px 0;
		display: block;
	}
	.header-nav-08 a:hover{
		background-position: -890px -30px;
	}
	.header-nav-09 a{
		width: 116px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -1047px 0;
		display: block;
	}
	.header-nav-09 a:hover{
		background-position: -1047px -30px;
	}
	.header-nav-10 a{
		width: 58px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -1162px 0;
		display: block;
	}
	.header-nav-10 a:hover{
		background-position: -1162px -30px;
	}
	.header-nav-11 a{
		width: 147px;
		height: 30px;
		background-image: url(../img/pcnav4.png);
		background-repeat: no-repeat;
		background-position: -1219px 0;
		display: block;
	}
	.header-nav-11 a:hover{
		background-position: -1219px -30px;
	}
	#under-h2-area{
		height: 124px;
		padding: 80px 0 46px;
	}
	#under-contents{
	}
	.under-contents-inner{
		width: 1080px;
		padding: 80px 0 140px;
	}
	#sp-menu-area{
		display: none;
	}

}

@media all and (max-width: 767px) {
	.under-header-inner{
		padding: 1em 0;
	}
	#under-header-nav{
		display: none;
	}
	.under-header-logo{
		width: 50%;
		margin: 0 auto;
	}
	#under-h2-area{
		padding: 2.5em 0 1em;
	}
	#under-contents{
		width: 100%;
		min-height: 100%;
		background: #fff2f2;
	}
	.under-contents-inner{
		width: 100%;
		margin: 0 auto;
		padding: 2em 0 4em;
	}
	#sp-menu-area{
		width: 100%;
		height: 40px;
		display: block;
		background: #fff2f2;
		border-top: 1px solid #fff2f2;
		border-bottom: 1px solid #fff2f2;
		position: sticky;
		top: 0;
		z-index: 999;
	}
	.sp-menu-area-inner{
		width: 100%;
		height: 50px !important;
	}
	.openbtn{
		width: 72px;
		margin: 10px auto;
	}
	.sp-menu-area-inner .openbtn{
		width: 72px;
		margin: 15px auto;
	}
	.openbtn img{
		width: 100%;
	}
	.closebtn{
		font-size: 0.7em;
		letter-spacing: 0.1em;
		font-family: 'Libre Baskerville', serif;
		text-decoration: none;
		padding:15px 10px;
		color: #2d3450;
		position: absolute;
		bottom: 15%;
		left: 10%;
		transform: translate(0%,-50%);
		display: block;
		text-transform: uppercase;

	}
	/*========= ナビゲーションのためのCSS ===============*/
	
	#g-nav-sp{
		/*position:fixed;にし、z-indexの数値を大きくして前面へ*/
		position:fixed;
		z-index: 9999;
		/*ナビのスタート位置と形状*/
		top:0;
		left: -120%;
		width:55%;
		height: 100vh;/*ナビの高さ*/
		background: rgba(255,242,242,0.95);
		/*動き*/
		transition: all 0.6s;
	}

	/*アクティブクラスがついたら位置を0に*/
	#g-nav-sp.panelactive{
		left: 0;
	}


	/*ナビゲーションの縦スクロール*/
	#g-nav-sp.panelactive #g-nav-list{
		/*ナビの数が増えた場合縦スクロール*/
		position: fixed;
		z-index: 9999; 
		width:100%;
		height: 100vh;/*表示する高さ*/
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}

	/*ナビゲーション*/
	#g-nav-sp ul {
		/*ナビゲーション天地中央揃え*/
		position: absolute;
		z-index: 9999;
		top:40%;
		left:10%;
		transform: translate(0%,-50%);
	}

	/*リストのレイアウト設定*/

	#g-nav-sp li{
		list-style: none;
		text-align: left; 
	}

	#g-nav-sp li a{
		font-size: 0.9em;
		color: #d7ac81;
		font-family: 'Libre Baskerville', serif;
		text-decoration: none;
		padding:15px 10px;
		display: block;
		text-transform: uppercase;
		letter-spacing: 0.1em;
	}
	
	/*========= 上部固定させるためのCSS ===============*/

	.fixed{
		position: fixed;/*fixedを設定して固定*/
		top: 0;
		height: 40px;/*高さ指定*/
		width:100%;/*横幅指定*/
		z-index: 9999;/*最前面へ*/
		transition-duration: 0.5s;
	}

}

/*retina*/

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
	.header-nav-01 a,
	.header-nav-02 a,
	.header-nav-03 a,
	.header-nav-04 a,
	.header-nav-05 a,
	.header-nav-06 a,
	.header-nav-07 a,
	.header-nav-08 a,
	.header-nav-09 a,
	.header-nav-10 a,
	.header-nav-11 a{
		background-image: url("../img/pcnav4_2x.png");
		background-size: 1365px;
	}

}


/*	01.NEWS
============================== */
.under-h2-news img{
	width: 100%;
}
/*NEWS ALL*/
.news-all-block,
.news-block{
	background: #ffffff;
	border: 1px solid #2d3450;
	margin: 0 auto;
	box-shadow: 0px 0px 10px 0 rgba(1,46,79,0.3);
}
.news-all-date,
.news-date,
.news-h4{
	color: #d7ac81;
	font-weight: bold;
}
.news-h5{
	color: #ed73b2;
	font-weight: bold;
}
.news-all-title,
.news-title{
	color: #2d3450;
	font-weight: bold;
}
/*NEWS*/
.news-block{
	
}
.news-header{
	border-bottom: 1px solid #2d3450;
}
.news-img img{
	width: 100%;
}
.news-text{
	color: #2d3450;
}
.news-text-caution{
	font-style: italic;
	font-weight: bold;
	color: #2d3450;
}
.h4-caution{
	color: #d7ac81;
	margin: -1.0em 0 1.5em 0 !important;
}
.btn-back img{
	width: 100%;
}

/* TABLE */
.lvtable{
	width: 100%;
}
.lvtable th{
	background: #2d3450;
	color: #ffffff;
	text-align: center;
}
.lvtable td{
	color: #2d3450;
	border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
}
.lvtable th{
	border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
}
.lvtable tr{
	border-bottom: 1px solid #ddd;
}
.lvtable-time01,
.lvtable-time02{
	text-align: center;
}
.lvtable-date01,
.lvtable-date02,
.lvtable-date03,
.lvtable-date04,
.lvtable-date05{
	text-align: center;
}

@media all and (min-width: 768px) {
	.under-h2-news{
		width: 300px;
		height: 124px;
		margin: 0 auto;
	}
	/*NEWS ALL*/
	.news-all-block{
		width: 780px;
		margin-bottom: 40px;
		padding: 40px;	
	}
	.news-all-date{
		font-size: 12px;
		margin-bottom: 0.5em;
	}
	.news-all-title{
		font-size: 16px;
		line-height: 1.5em;
	}
	/*NEWS*/
	.news-block{
		width: 750px;
		margin: 0 auto 80px;
		padding: 60px 60px;
	}
	.news-header{
		margin-bottom: 40px;
		padding-bottom: 24px;
	}
	.news-date{
		font-size: 12px;
		margin-bottom: 1em;
	}
	.news-title{
		font-size: 20px;
		line-height: 1.5em;
	}
	.news-img{
		width: 750px;
		margin: 24px auto 40px;
	}
	.news-goodsimg{
		width: 400px;
		margin: 24px 0 40px;
	}
	.news-h4{
		font-size: 18px;
		line-height: 1.4em;
		margin: 1.5em 0 1em;
	}
	.news-h5{
		font-size: 14px;
		line-height: 1.4em;
		margin: 1.5em 0 1em;
	}
	.news-text{
		font-size: 14px;
		line-height: 1.6em;
		margin: 0 0 1.5em;
	}
	.news-text-caution{
		font-size: 12px;
		line-height: 1.7em;
		margin: 0 0 1.5em;
	}
	.btn-back{
		width: 288px;
		margin: 50px auto 80px;
	}
	
	/* TABLE */
	.lvtable{
		font-size: 14px;
	}
	.lvtable th{
		padding: 10px;
	}
	.lvtable td{
		padding: 10px;
	}
	.lvtable-city{
		width: 100px;
	}
	.lvtable-theater{
		width: 350px;
	}
	.lvtable-time01{
		width: 100px;
	}
	.lvtable-time02{
		width: 100px;
	}
	.lvtable-date01,
	.lvtable-date02,
	.lvtable-date03,
	.lvtable-date04,
	.lvtable-date05{
		width: 40px;
	}
	
}

@media all and (max-width: 767px) {
	.under-h2-news{
		width: 34%;
		margin: 0 auto;
	}
	/*NEWS ALL*/
	.news-all-block,
	.news-block{
		width: 74%;
		margin-bottom: 2em;
		padding: 5% 8%;	
	}
	.news-block-mlist{
		width: 100%;
		padding: 1% !important;	
	}
	.news-all-date{
		font-size: 0.7em;
		margin-bottom: 0.5em;
	}
	.news-all-title{
		font-size: 0.9em;
		line-height: 1.5em;
	}
	/*NEWS*/
	.news-header{
		margin-bottom: 1em;
		padding-bottom: 1em;
	}
	.news-date{
		font-size: 0.7em;
		margin-top: 0.6em;
		margin-bottom: 0.4em;
	}
	.news-title{
		font-size: 0.9em;
		line-height: 1.5em;
	}
	.news-img{
		width: 100%;
		margin: 1em auto 2em;
	}
	.news-h4{
		font-size: 1em;
		line-height: 1.4em;
		margin: 1.5em 0 1em;
	}
	.news-h5{
		font-size: 0.9em;
		line-height: 1.4em;
		margin: 1.5em 0 1em;
	}
	.news-text{
		font-size: 0.8em;
		line-height: 1.5em;
		margin: 0 0 1.5em;
	}
	.news-text-caution{
		font-size: 0.7em;
		line-height: 1.7em;
		margin: 0 0 1.5em;
	}
	.btn-back{
		width: 50%;
		margin: 2em auto 4em;
	}
	
	/* TABLE */
	.lvtable{
		
	}
	.lvtable th{
		font-size: 0.6em;
		padding: 1em;
	}
	.lvtable td{
		font-size: 0.7em;
		line-height: 1.4em;
		padding: 1em;
	}
	.lvtable-city{
		width: 20%;
	}
	.lvtable-theater{
		width: 40%;
	}
	.lvtable-time01{
		width: 20%;
	}
	.lvtable-time02{
		width: 20%;
	}
}


/*	02.INTRODUCTION
============================== */
.under-h2-area-intro img{
	width: 100%;
}
.intro-text-pc img,
.intro-text-sp img{
	width: 100%;
}

@media all and (min-width: 768px) {
	.under-h2-intro{
		width: 342px;
		height: 124px;
		margin: 0 auto;
	}
	.intro-text-pc{
		width: 823px;
		height: 955px;
		margin: 0 auto 100px;
	}
	.intro-text-pc img{
		width: 100%;
	}
	.intro-text-sp{
		display: none;
	}
}

@media all and (max-width: 767px) {
	.under-h2-intro{
		width: 40%;
		margin: 0 auto;
	}
	.intro-text-pc{
		display: none;
	}
	.intro-text-sp{
		width: 90%;
		margin: 1em auto 4em;
	}
}


/*	03.STAFF&CAST
============================== */
.under-h2-area-staffcast img{
	width: 100%;
}
.staff-text-pc img,
.cast-text-pc img,
.staff-text-sp img,
.cast-text-sp img{
	width: 100%;
}

@media all and (min-width: 768px) {
	.under-h2-staffcast{
		width: 655px;
		height: 123px;
		margin: 0 auto;
	}
	.staff-text-pc{
		width: 913px;
		height: 576px;
		margin: 0 auto 100px;
	}
	.cast-text-pc{
		width: 491px;
		height: 243px;
		margin: 0 auto 80px;
	}
	.staff-text-sp,
	.cast-text-sp{
		display: none;
	}
	
}

@media all and (max-width: 767px) {
	.under-h2-staffcast{
		width: 74%;
		margin: 0 auto;
	}
	.staff-text-pc,
	.cast-text-pc{
		display: none;
	}
	.staff-text-sp,
	.cast-text-sp{
		width: 100%;
		margin: 1em auto 4em;
	}
}


/*	04.CHARACTER
============================== */
.under-h2-area-chara img{
	width: 100%;
}
/* CHARA-ALL */
.chara-all-navi{
	display: flex;
	flex-wrap: wrap;
}
.chara-all-list{
	box-shadow: 0px 0px 6px 0 rgba(0,0,0,0.3);
}
.chara-all-list img{
	width: 100%;
}
/* CHARA-INNER */
.chara-nav-wrap{
	
}
.chara-area-01{
	background: url("../character/img/chara_tati_01.png")no-repeat;
}
.chara-area-02{
	background: url("../character/img/chara_tati_02.png")no-repeat;
}
.chara-area-03{
	background: url("../character/img/chara_tati_03.png")no-repeat;
}
.chara-area-04{
	background: url("../character/img/chara_tati_04.png")no-repeat;
}
.chara-area-05{
	background: url("../character/img/chara_tati_05.png")no-repeat;
}
.chara-area-06{
	background: url("../character/img/chara_tati_06.png")no-repeat;
}
.chara-caption img{
	width: 100%
}
.chara-nav-up,
.chara-nav-down{
	display: flex;
}
.chara-nav-list{
	filter: drop-shadow(0 0 2px rgba(0,0,0,0.3));
}
.chara-nav-list img{
	width: 100%;
}

/*retina*/

@media (-webkit-min-device-pixel-ratio: 2) {
	.chara-area-01{
		background: url("../character/img/chara_tati_01_2x.png")no-repeat;
	}
	.chara-area-02{
		background: url("../character/img/chara_tati_02_2x.png")no-repeat;
	}
	.chara-area-03{
		background: url("../character/img/chara_tati_03_2x.png")no-repeat;
	}
	.chara-area-04{
		background: url("../character/img/chara_tati_04_2x.png")no-repeat;
	}
	.chara-area-05{
		background: url("../character/img/chara_tati_05_2x.png")no-repeat;
	}
	.chara-area-06{
		background: url("../character/img/chara_tati_06_2x.png")no-repeat;
	}

}



@media all and (min-width: 768px) {
	.under-h2-chara{
		width: 628px;
		height: 124px;
		margin: 0 auto;
	}
	/* CHARA-ALL */
	.chara-all-navi{
		width: 1008px;
		margin: auto;
	}
	.chara-all-list{
		width: 160px;
		height: 540px;
		margin: 4px;
	}
	/* CHARA-INNER */
	.under-contents-inner-chara{
		height: 980px;
		padding: 0;
	}
	.chara-area{
		width: 1080px;
		height: 980px;
		position: relative;
		background-size: 615px 983px;
	}
	.chara-area-01{
		background-position: right bottom;
	}
	.chara-area-02{
		background-position: right bottom;
	}
	.chara-area-03{
		background-position: right bottom;
	}
	.chara-area-04{
		background-position: right bottom;
	}
	.chara-area-05{
		background-position: right bottom;
	}
	.chara-area-06{
		background-position: right bottom;
	}
	.chara-caption{
		width: 430px;
		height: 570px;
		position: absolute;
		top: 118px;
		left: 182px;
	}
	.chara-nav-wrap{
		position: absolute;
		top: 670px;
		left: 180px;
	}
	.chara-nav-up{
		
	}
	.chara-nav-down{
		margin: -24px 0 0 60px;
	}
	.chara-nav-list{
		width: 100px;
		margin: 8px;
	}
	
	
}

@media all and (max-width: 767px) {
	.under-h2-chara{
		width: 71%;
		margin: 0 auto;
	}
	/* CHARA-ALL */
	.chara-all-navi{
		width: 95%;
		margin: 0 auto 2em;
	}
	.chara-all-list{
		width: 27%;
		margin: 3%;
	}
	
	
	/* CHARA-INNER */
	.under-contents-inner-chara{
		height: auto;
		padding: 0 0 6em;
	}
	.chara-area{
		width: 100%;
		position: relative;
	}
	.chara-area-01{
		background-size: 150%;
		background-position: 55% -10%;
		padding-top: 125%;
	}
	.chara-area-02{
		background-size: 150%;
		background-position: 55% -10%;
		padding-top: 125%;
	}
	.chara-area-03{
		background-size: 150%;
		background-position: 55% -22%;
		padding-top: 125%;
	}
	.chara-area-04{
		background-size: 150%;
		background-position: 67% -18%;
		padding-top: 125%;
	}
	.chara-area-05{
		background-size: 150%;
		background-position: 47% -20%;
		padding-top: 125%;
	}
	.chara-area-06{
		background-size: 150%;
		background-position: 55% -22%;
		padding-top: 125%;
	}
	.chara-caption{
		width: 90%;
		margin: 0 auto;
		padding: 5% 5% 0;
		background: #fff2f2;
		box-shadow: 0px -20px 15px 0 rgba(0,0,0,0.1);
	}
	.chara-nav-wrap{
		width: 90%;
		margin: 0 0 0 9%;

	}
	.chara-nav-up{
		width: 80%;	
	}
	.chara-nav-down{
		width: 80%;
		margin:  -10% 0 0 12.7%;
	}
	.chara-nav-list{
		width: 30%;
		margin: 3%;
	}
	
	
}


/*	06.TICKET
============================== */
.under-h2-area-ticket img,
.under-h2-area-goods img,
.under-h2-area-novelty img{
	width: 100%;
}
.ticket-title{
	color: #2d3450;
	font-weight: normal;
	letter-spacing: 0.1em;
	margin: 0 auto;
	text-align: center;
}
.ticket-header{
	border-bottom: 1px solid #2d3450;
}
.ticket-nav li{
	box-shadow: 0px 0px 10px 0 rgb(1 46 79 / 30%);
}
.ticket-nav li img{
	width: 100%;
}
.banner-novelty img{
	width: 100%;
}

@media all and (min-width: 768px) {
	.under-h2-ticket{
		width: 397px;
		height: 124px;
		margin: 0 auto;
	}
	.under-h2-novelty{
		width: 468px;
		height: 124px;
		margin: 0 auto;
	}
	.under-h2-goods{
		width: 339px;
		height: 124px;
		margin: 0 auto;
	}
	.ticket-header{
		margin-bottom: 40px;
		padding-bottom: 24px;
	}
	.ticket-title{
		font-size: 50px;
	}
	.ticket-nav-block{
		width: 870px;
		margin: 0 auto 40px;
	}
	.ticket-nav{
		width: 872px;
		display: flex;
		justify-content: space-between;
	}
	.ticket-nav li{
		width: 270px;
	}
	.banner-novelty{
		width: 550px;
		margin: 0 auto 40px;
		box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
	}
}

@media all and (max-width: 767px) {
	.under-h2-ticket{
		width: 46%;
		margin: 0 auto;
	}
	.under-h2-novelty{
		width: 54%;
		margin: 0 auto;
	}
	.under-h2-goods{
		width: 38%;
		margin: 0 auto;
	}
	.ticket-header{
		margin-bottom: 1em;
		padding-bottom: 1em;
	}
	.ticket-title{
		font-size: 1.8em;
		margin: 0.5em auto 0;
	}
	.ticket-nav-block{
		width: 92%;
		margin: 0 auto 5%;
	}
	.ticket-nav{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
	}
	.ticket-nav li{
		width: 48%;
		margin: 1% 1%;
	}
}


/*	07.SPECIAL
============================== */
.under-h2-area-special img{
	width: 100%;
}
.special-banner img{
	width: 100%;
}
.special-banner-text{
	color: #2d3450;
	text-align: center;
	line-height: 1.5em;
	
}

@media all and (min-width: 768px) {
	.under-h2-special{
		width: 428px;
		height: 124px;
		margin: 0 auto;
	}
	.special-banner-block{
		margin: 0 auto 70px;
		
	}
	.special-banner{
		width: 648px;
		margin: 0 auto;
		
	}
	.special-banner-text{
		font-size: 24px;
		margin: 30px 0 0;
	}
}

@media all and (max-width: 767px) {
	.under-h2-special{
		width: 48%;
		margin: 0 auto;
	}
	.special-banner-block{
		margin: 0 auto 2em;
	}
	.special-banner{
		width: 80%;
		margin: 0 auto 1em;
	}
	.special-banner-text{
		font-size: 1em;
	}
}


/*	08.DISC
============================== */

.disc-img{
	box-shadow: 0px 0px 5px 0 rgb(0 0 0 / 30%);
}

.disc-img img{
	width: 100%;
}

@media all and (min-width: 768px) {
	.under-h2-disc{
		width: 257px;
		height: 127px;
		margin: 0 auto;
	}
	.disc-img{
		width: 100%;
		margin: 24px auto;
	}
}

@media all and (max-width: 767px) {
	.under-h2-disc{
		width: 34%;
		margin: 0 auto;
	}
	.disc-img{
		width: 100%;
		margin: 1em auto;
	}
}


/*retina*/

@media only screen and (min-width: 768px) and (-webkit-min-device-pixel-ratio: 2) {

}

@media only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio: 2) {
	
	
}


/*	08.MUSIC
============================== */
.under-h2-area-music img,
.music-img img,
.bandle-img-big img,
.bandle-img img,
.oritoku-img img{
	width: 100%;
}
.oritoku-img{
	width: 100%;
	border: 1px solid #2d3450;
}
.music-title{
	color: #2d3450;
	font-weight: normal;
	letter-spacing: 0.1em;
	margin: 0 auto;
	text-align: center;
}
.music-header{
	text-align: center;
}
.music-name{
	color: #d7ac81;
	font-weight: lighter;
}


@media all and (min-width: 768px) {
	.under-h2-music{
		width: 347px;
		height: 124px;
		margin: 0 auto;
	}
	.music-title{
		font-size: 42px;
		line-height: 1.3em;
	}
	.music-name{
		font-size: 40px;
		line-height: 1.5em;
		margin: 0 0 14px;
	}
	.music-artist{
		font-size: 24px;
		margin: 0 0 10px;
	}
	.music-artist-small{
		font-size: 12px;
	}
	.music-caption{
		font-size: 10px;
	}
	.music-img{
		width: 480px;
		margin: 24px auto 40px;
	}
	
	/*音楽オリ特*/
	.bandle-block{
		margin: 0 auto 48px;
	}
	.bandle-img-big{
		width: 720px;
		margin: 0 0 1.5em;
	}
	.bandle-img{
		width: 315px;
		margin: 0 0 1.5em;
	}
	.oritoku-block-wrap{
		width: 750px;
		display: flex;
		flex-wrap: wrap;
	}
	.oritoku-block{
		width: 375px;
		margin: 0 0 48px;
	}
	.oritoku-img{
		width: 300px;	
	}

}

@media all and (max-width: 767px) {
	.under-h2-music{
		width: 38%;
		margin: 0 auto;
	}
	.music-img{
		width: 100%;
		margin: 2em auto 1em;
	}
	.music-title{
		font-size: 1.5em;
		line-height: 1.3em;
		margin: 0.5em auto 0;
	}
	.music-name{
		font-size: 1.1em;
		line-height: 1.5em;
		margin: 0 0 0.5em;
	}
	.music-artist{
		font-size: 1em;
		margin: 0 0 0.5em;
	}
	.music-artist-small{
		font-size: 0.6em;
	}
	.music-caption{
		font-size: 0.6em;
	}
	
	/*音楽オリ特*/
	.bandle-block{
		margin: 0 auto 2em;
	}
	.bandle-img-big{
		width: 100%;
		margin: 0 0 1.5em;
	}
	.bandle-img{
		width: 80%;
		margin: 0 auto 1.5em;
	}
	.oritoku-block-wrap{

	}
	.oritoku-block{
		margin: 0 0 2em;
	}
	.oritoku-img{
		width: 70%;
		margin: 0 auto;
	}
	.bandle-block-last{
		margin: 0 0 4em;
	}

}


/*	09.DISC
============================== */

.disc-date{
	color: #d7ac81;
	font-weight: bold;
}

@media all and (min-width: 768px) {
	.disc-date{
		font-size: 32px;
		margin: 0 0 10px;
	}
}

@media all and (max-width: 767px) {
	.disc-date{
		font-size: 1.2em;
		margin: 0 0 0.5em;
	}
}


/*	10.STREAMING
============================== */

.haishin-table{
	font-weight: bold;
	line-height: 1.4em;
	table-layout: fixed;
}
.haishin-table th{
	color: #ffffff;
	background: #2d3450;;
}
.haishin-table-td01,
.haishin-caution{
	color: #2d3450;
}
.haishin-table tr{
	border-bottom: 1px solid #2d3450;
}
.haishin-table tr:last-child{
	border-bottom: none;
}
.haishin-table-td01,
.haishin-table-td03{
	line-height: 1.4em;
}
.steream_read{
	color: #2d3450;
}
.haishin-h3{
	color: #2d3450;
}

@media all and (min-width: 768px) {
	.under-h2-stream{
		width: 630px;
		height: 123px;
		margin: 0 auto;
	}
	.haishin-table{
		width: 710px;
		text-align: left;
		margin: 10px 20px 20px;
	}
	.haishin-table th{
		font-size: 12px;
	}
	.haishin-table td,
	.haishin-table th{
		padding: 1em 1em;
	}
	.haishin-caution{
		font-size: 10px;
		text-align: center;
		margin: 0 0 20px;
	}
	.haishin-table-td01{
		width: 200px;
	}
	.haishin-table-td01 span{
		font-size: 12px;
	}
	.haishin-table-td02{
		font-size: 12px;
	}
	.steream_read{
		width: 710px;
		margin: 0 auto 36px;
		font-size: 24px;
		line-height: 36px;
	}
	.haishin-h3{
		width: 710px;
		margin: 0 auto;
		font-size: 18px;
		line-height: 36px;
	}
}

@media all and (max-width: 767px) {
	.under-h2-stream{
		width: 74%;
		margin: 0 auto;
	}
	.haishin-table{
		width: 100%;
		text-align: left;
		margin: 1em auto;
	}
	.haishin-table th{
		font-size: 0.5em;
		padding: 0.3em 0.5em 0.2em;
	}
	.haishin-table th span{
		font-size: 0.6em;
	}
	.haishin-table td{
		padding: 0.5em 0 0.5em 0.2em;
	}
	.haishin-table-td01{
		width: 40%;
		font-size: 0.8em;
		line-height: 1.4em;
	}
	.haishin-table-td01 span{
		font-size: 0.6em;
	}
	.haishin-table-td02{
		font-size: 0.6em;
		margin: 0 0 0 2%;
		line-height: 1.4em;
	}
	.haishin-caution{
		font-size: 1em;
		text-align: center;
		margin: 1em 0 1em;
	}
	.steream_read{
		margin: 0.5em auto 1em;
		font-size: 1.1em;
		line-height: 1.5em;
	}
	.haishin-h3{
		margin: 0.5em auto 1em;
		font-size: 1em;
		line-height: 1.5em;
	}
}





/*==================================================
じわっ
===================================*/

/* ぼかしから出現 */
.blur{
  animation-name:blurAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
}

@keyframes blurAnime{
  from {
  filter: blur(10px);
  transform: scale(1.02);
  }

  to {
  filter: blur(0);
  transform: scale(1);
  }
}


/*========= body背景色の変化CSS ===============*/


#top-main-area{
  animation: bgchange 30s ease infinite;/
}

@keyframes bgchange{
	0%{
	  background:#e1fff7;
	}
	10%{
	  background:#ffffff;
	}
	20%{
	  background:#ffffff;
	}
	30%{
	  background:#fff5f8;
	}
	40%{
	  background:#fff5f8;
	}
	50%{
	  background:#ffffff;
	}
	60% {
	  background:#ffffff;
	}
	70% {
	  background:#e3f5ff;
	}
	80% {
	  background:#e3f5ff;
	}
	90% {
	  background:#e1fff7;
	}
	100% {
	  background:#e1fff7;
	}
 }

/*
@keyframes bgchange{
	0%{
	  background:#e1fff7;
	}
	10%{
	  background:#fff5f8;
	}
	25%{
	  background:#fff5f8;
	}
	35%{
	  background:#ffffff;
	}
	50% {
	  background:#ffffff;
	}
	60% {
	  background:#e3f5ff;
	}
	75% {
	  background:#e3f5ff;
	}
	85% {
	  background:#e1fff7;
	}
	100% {
	  background:#e1fff7;
	}
 }
 */


/*
#top-main-area{
  animation: bgchange 18s ease infinite;/
}

@keyframes bgchange{
	0%{
	  background:#e1fff7;
	}
	10%{
	  background:#ffffff;
	}
	34%{
	  background:#ffffff;
	}
	44%{
	  background:#e3f5ff;
	}
	68% {
	  background:#e3f5ff;
	}
	78% {
	  background:#e1fff7;
	}
	100% {
	  background:#e1fff7;
	}
 }

*/

/*
ffffff
e1fff7
e3f5ff
*/

/*
.top-main-visual{
	 animation: imgchange 12s ease infinite;
}

@keyframes imgchange{
	0%{
	  background: url("../img/top_img_02.jpg");
	}
	10%{
	  background: url("../img/top_img_01.jpg");
	}
	50%{
	  background: url("../img/top_img_01.jpg");
	}
	60% {
	  background: url("../img/top_img_02.jpg");
	}
	100% {
	  background: url("../img/top_img_02.jpg");
	}
 }
*/

@media all and (min-width: 768px) {
	#viewer{
		width: 750px;
		height: 1062px;
		position: relative;
	}
	#viewer img{
		width:100%;
	    position: absolute;   
	}
}

@media all and (max-width: 767px) {
	#viewer{
		width: 100%;
		position: absolute;
		top: 0;
	}
	#viewer img{
		width:100%;
	    position: absolute;   
	}
}




/*========= LoadingのためのCSS ===============*/

/* Loading背景画面設定　*/

#splash {
	/*fixedで全面に固定*/
	position: fixed;
	z-index: 9999;
	width: 100%;
	height: 100%;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bebebe+0,eeeeee+50,bebebe+100 */
	background: #bebebe; /* Old browsers */
	background: -moz-linear-gradient(left,  #bebebe 0%, #eeeeee 50%, #bebebe 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #bebebe 0%,#eeeeee 50%,#bebebe 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #bebebe 0%,#eeeeee 50%,#bebebe 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bebebe', endColorstr='#bebebe',GradientType=1 ); /* IE6-9 */
	text-align:center;
	color:#fff;
}

/* Loadingバー中央配置　*/
#splash_text {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 9999;
	width: 100%;
	transform: translate(-50%, -50%);
	color: #231815;
}
/* Loadingロゴ中央配置　*/
#loading_logo {
	background: url("../img/loading_logo.png") no-repeat;
	background-size: cover;
}


/*IE11対策用バーの線の高さ※対応しなければ削除してください*/
#splash_text svg{
    height: 1px;
}

@media all and (min-width: 768px) {
	/* Loadingロゴ中央配置　*/
	#loading_logo {
		width: 390px;
		height: 63px;
		position: absolute;
		top: 45%;
		left: 50%;
		z-index: 9999;
		transform: translate(-50%, -50%);
	}

}
@media all and (max-width: 767px) {
	/* Loadingロゴ中央配置　*/
	#loading_logo {
		width: 240px;
		height: 39px;
		position: absolute;
		top: 45%;
		left: 50%;
		z-index: 9999;
		transform: translate(-50%, -50%);
	}
	.tbs-gfooter-btn{
		z-index: 9998 !important;
	}

}

/*IE非表示*/
@media all and (-ms-high-contrast: none) {
	  #splash {
		  display: none;
	}
	#top-main-area{
		background: none;
	}
}


/*========= モーダル表示のためのCSS ===============*/


/*全て共通：hideエリアをはじめは非表示*/
.hide-area{
	display: none;
}

/*全て共通：モーダルのボタンの色を変更したい場合*/
.modaal-close:after, 
.modaal-close:before{
	background:#000;	
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}
.modaal-video-wrap{
	margin: auto 20px;
}

.modaal-overlay{
	background: #ffffff !important;
}


/*========= ニュースティッカー用CSS ===============*/

/*動画表示のモーダル：余白を変更したい場合*/
.modaal-video .modaal-inner-wrapper{
	padding:0;
}

/*ニュース1行の周りの余白*/
.slider a{
    display: block;
    background:#fea9bf;
    padding:12px 20px 8px;
	color:#fff;
	font-weight: bold;
	line-height: 1.4em;
	font-size: 0.9rem;
}

/*日付*/
.slider span {
    display:inline-block;
    font-size:0.6rem;
    margin-right:10px;
    color:#fff;
}

@media all and (min-width: 768px) {
	.sp-newsticker{
		display: none;
	}
}

/*768px以下の見た目 ※1行のままにしたい場合は不要　*/
@media screen and (max-width:768px) {
    .slider {
        background:#fff;
    }

    .slider li {
    }

    .slider li:last-child {
        border-bottom:none;
    }
    .slider span {
        display:block;
		padding-bottom:2px;
    }
}


/*モーダル強制*/

@media all and (min-width: 768px) {
	.modal3rd_wrapper{
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: rgba(255, 255, 255, 0.8);
		z-index: 100;
		display: none;
	}

	.modal3rd{
		/*
		position: absolute;
		top: 20%;
		left: 34%;
		*/
		width: 50vh;
		height: 100vh;
		margin: 10vh auto 0;
		text-align: center;
	}
	.modal3rd .popupimg img{
		height: auto;
		max-height: 900px;
		box-shadow: 0px 0px 10px rgba(0,0,0,0.4);
	}
	.close-modal{
		width: 250px;
		margin: 2vh auto 0;
	}
	.close-modal img,
	.popupimg img{
		width: 100%;
		
	}
	
}
@media all and (max-width: 767px) {
	.modal3rd_wrapper{
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: rgba(255, 255, 255, 0.8);
		z-index: 100;
		display: none;
	}

	.modal3rd{
		/*
		position: absolute;
		top: 20%;
		left: 34%;
		*/
		width: 80%;
		margin: 10vh auto 0;
		text-align: center;
	}
	.modal3rd .popupimg img{
		width: 100%;
		box-shadow: 0px 0px 10px rgba(0,0,0,0.4);
	}
	.close-modal{
		width: 60%;
		margin: 2vh auto 0;
	}
	.close-modal img{
		width: 100%;
		
	}
	
}
